list sheet, tree view sheet and two column select components support hidden field

src/components/mobile/ListItemSelectionSheet.vue

@@ -17,6 +17,7 @@
                               :class="{ 'list-item-selected': isSelected(item, index) }"
                               :key="getItemValue(item, index, keyField, valueType)"
                               v-for="(item, index) in items"
+                              v-show="item && (!hiddenField || !item[hiddenField])"
                               @click="onItemClicked(item, index)">
                     <template #content-start>
                         <f7-icon class="list-item-checked-icon" f7="checkmark_alt" :style="{ 'color': isSelected(item, index) ? '' : 'transparent' }"></f7-icon>
@@ -44,6 +45,7 @@ export default {
         'iconField',
         'iconType',
         'colorField',
+        'hiddenField',
         'items',
         'show'
     ],

src/components/mobile/TreeViewSelectionSheet.vue

@@ -15,7 +15,8 @@
                                   :opened="isPrimaryItemHasSecondaryValue(item)"
                                   :label="$tIf((primaryTitleField ? item[primaryTitleField] : item), primaryTitleI18n)"
                                   :key="primaryKeyField ? item[primaryKeyField] : item"
-                                  v-for="item in items">
+                                  v-for="item in items"
+                                  v-show="item && (!primaryHiddenField || !item[primaryHiddenField])">
                     <template #media>
                         <ItemIcon :icon-type="primaryIconType" :icon-id="item[primaryIconField]"
                                   :color="item[primaryColorField]" v-if="primaryIconField"></ItemIcon>
@@ -26,6 +27,7 @@
                                       :label="$tIf((secondaryTitleField ? subItem[secondaryTitleField] : subItem), secondaryTitleI18n)"
                                       :key="secondaryKeyField ? subItem[secondaryKeyField] : subItem"
                                       v-for="subItem in item[primarySubItemsField]"
+                                      v-show="subItem && (!secondaryHiddenField || !subItem[secondaryHiddenField])"
                                       @click="onSecondaryItemClicked(subItem)">
                         <template #media>
                             <ItemIcon :icon-type="secondaryIconType" :icon-id="subItem[secondaryIconField]"
@@ -52,6 +54,7 @@ export default {
         'primaryIconField',
         'primaryIconType',
         'primaryColorField',
+        'primaryHiddenField',
         'primarySubItemsField',
         'secondaryKeyField',
         'secondaryValueField',
@@ -60,6 +63,7 @@ export default {
         'secondaryIconField',
         'secondaryIconType',
         'secondaryColorField',
+        'secondaryHiddenField',
         'items',
         'show'
     ],
@@ -121,6 +125,10 @@ export default {
             for (let i = 0; i < primaryItem[this.primarySubItemsField].length; i++) {
                 const secondaryItem = primaryItem[this.primarySubItemsField][i];
 
+                if (this.secondaryHiddenField && secondaryItem[this.secondaryHiddenField]) {
+                    continue;
+                }
+
                 if (this.secondaryValueField && secondaryItem[this.secondaryValueField] === this.currentValue) {
                     return true;
                 } else if (!this.secondaryValueField && secondaryItem === this.currentValue) {

src/components/mobile/TwoColumnListItemSelectionSheet.vue

@@ -21,6 +21,7 @@
                                           :footer="$tIf(item[primaryFooterField], primaryFooterI18n)"
                                           :key="primaryKeyField ? item[primaryKeyField] : item"
                                           v-for="item in items"
+                                          v-show="item && (!primaryHiddenField || !item[primaryHiddenField])"
                                           @click="onPrimaryItemClicked(item)">
                                 <template #media>
                                     <ItemIcon :icon-type="primaryIconType" :icon-id="item[primaryIconField]" :color="item[primaryColorField]"></ItemIcon>
@@ -43,6 +44,7 @@
                                           :footer="$tIf(subItem[secondaryFooterField], secondaryFooterI18n)"
                                           :key="secondaryKeyField ? subItem[secondaryKeyField] : subItem"
                                           v-for="subItem in selectedPrimaryItem[primarySubItemsField]"
+                                          v-show="subItem && (!secondaryHiddenField || !subItem[secondaryHiddenField])"
                                           @click="onSecondaryItemClicked(subItem)">
                                 <template #media>
                                     <ItemIcon :icon-type="secondaryIconType" :icon-id="subItem[secondaryIconField]" :color="subItem[secondaryColorField]"></ItemIcon>
@@ -80,6 +82,7 @@ export default {
         'primaryIconField',
         'primaryIconType',
         'primaryColorField',
+        'primaryHiddenField',
         'primarySubItemsField',
         'secondaryKeyField',
         'secondaryValueField',
@@ -92,6 +95,7 @@ export default {
         'secondaryIconField',
         'secondaryIconType',
         'secondaryColorField',
+        'secondaryHiddenField',
         'items',
         'show'
     ],
@@ -151,7 +155,7 @@ export default {
             }
         },
         getPrimaryValueBySecondaryValue(secondaryValue) {
-            return getPrimaryValueBySecondaryValue(this.items, this.primarySubItemsField, this.primaryValueField, this.secondaryValueField, secondaryValue);
+            return getPrimaryValueBySecondaryValue(this.items, this.primarySubItemsField, this.primaryValueField, this.primaryHiddenField, this.secondaryValueField, this.secondaryHiddenField, secondaryValue);
         },
         close() {
             this.$emit('update:show', false);