vuetify 3.5.8 → 3.5.9

package/dist/vuetify.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.5.8
+* Vuetify v3.5.9
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -4366,6 +4366,8 @@ const aliases = {
   plus: 'mdi-plus',
   minus: 'mdi-minus',
   calendar: 'mdi-calendar',
+  treeviewCollapse: 'mdi-menu-down',
+  treeviewExpand: 'mdi-menu-right',
   eyeDropper: 'mdi-eyedropper'
 };
 const mdi = {
@@ -7752,6 +7754,126 @@ function useList() {
   return inject$1(ListKey, null);
 }
 
+/* eslint-disable sonarjs/no-identical-functions */
+// Utilities
+const independentActiveStrategy = mandatory => {
+  const strategy = {
+    activate: _ref => {
+      let {
+        id,
+        value,
+        activated
+      } = _ref;
+      id = toRaw(id);
+
+      // When mandatory and we're trying to deselect when id
+      // is the only currently selected item then do nothing
+      if (mandatory && !value && activated.size === 1 && activated.has(id)) return activated;
+      if (value) {
+        activated.add(id);
+      } else {
+        activated.delete(id);
+      }
+      return activated;
+    },
+    in: (v, children, parents) => {
+      let set = new Set();
+      for (const id of v || []) {
+        set = strategy.activate({
+          id,
+          value: true,
+          activated: new Set(set),
+          children,
+          parents
+        });
+      }
+      return set;
+    },
+    out: v => {
+      return Array.from(v);
+    }
+  };
+  return strategy;
+};
+const independentSingleActiveStrategy = mandatory => {
+  const parentStrategy = independentActiveStrategy(mandatory);
+  const strategy = {
+    activate: _ref2 => {
+      let {
+        activated,
+        id,
+        ...rest
+      } = _ref2;
+      id = toRaw(id);
+      const singleSelected = activated.has(id) ? new Set([id]) : new Set();
+      return parentStrategy.activate({
+        ...rest,
+        id,
+        activated: singleSelected
+      });
+    },
+    in: (v, children, parents) => {
+      let set = new Set();
+      if (v?.length) {
+        set = parentStrategy.in(v.slice(0, 1), children, parents);
+      }
+      return set;
+    },
+    out: (v, children, parents) => {
+      return parentStrategy.out(v, children, parents);
+    }
+  };
+  return strategy;
+};
+const leafActiveStrategy = mandatory => {
+  const parentStrategy = independentActiveStrategy(mandatory);
+  const strategy = {
+    activate: _ref3 => {
+      let {
+        id,
+        activated,
+        children,
+        ...rest
+      } = _ref3;
+      id = toRaw(id);
+      if (children.has(id)) return activated;
+      return parentStrategy.activate({
+        id,
+        activated,
+        children,
+        ...rest
+      });
+    },
+    in: parentStrategy.in,
+    out: parentStrategy.out
+  };
+  return strategy;
+};
+const leafSingleActiveStrategy = mandatory => {
+  const parentStrategy = independentSingleActiveStrategy(mandatory);
+  const strategy = {
+    activate: _ref4 => {
+      let {
+        id,
+        activated,
+        children,
+        ...rest
+      } = _ref4;
+      id = toRaw(id);
+      if (children.has(id)) return activated;
+      return parentStrategy.activate({
+        id,
+        activated,
+        children,
+        ...rest
+      });
+    },
+    in: parentStrategy.in,
+    out: parentStrategy.out
+  };
+  return strategy;
+};
+
 const singleOpenStrategy = {
   open: _ref => {
     let {
@@ -7836,7 +7958,8 @@ const independentSelectStrategy = mandatory => {
       if (mandatory && !value) {
         const on = Array.from(selected.entries()).reduce((arr, _ref2) => {
           let [key, value] = _ref2;
-          return value === 'on' ? [...arr, key] : arr;
+          if (value === 'on') arr.push(key);
+          return arr;
         }, []);
         if (on.length === 1 && on[0] === id) return selected;
       }
@@ -7978,7 +8101,8 @@ const classicSelectStrategy = mandatory => {
       if (mandatory && !value) {
         const on = Array.from(selected.entries()).reduce((arr, _ref7) => {
           let [key, value] = _ref7;
-          return value === 'on' ? [...arr, key] : arr;
+          if (value === 'on') arr.push(key);
+          return arr;
         }, []);
         if (on.length === 0) return original;
       }
@@ -8022,16 +8146,24 @@ const emptyNested = {
     children: ref(new Map()),
     open: () => null,
     openOnSelect: () => null,
+    activate: () => null,
     select: () => null,
+    activatable: ref(false),
+    selectable: ref(false),
     opened: ref(new Set()),
+    activated: ref(new Set()),
     selected: ref(new Map()),
     selectedValues: ref([])
   }
 };
 const makeNestedProps = propsFactory({
+  activatable: Boolean,
+  selectable: Boolean,
+  activeStrategy: [String, Function],
   selectStrategy: [String, Function],
   openStrategy: [String, Object],
   opened: Array,
+  activated: Array,
   selected: Array,
   mandatory: Boolean
 }, 'nested');
@@ -8040,6 +8172,20 @@ const useNested = props => {
   const children = ref(new Map());
   const parents = ref(new Map());
   const opened = useProxiedModel(props, 'opened', props.opened, v => new Set(v), v => [...v.values()]);
+  const activeStrategy = computed(() => {
+    if (typeof props.activeStrategy === 'object') return props.activeStrategy;
+    switch (props.activeStrategy) {
+      case 'leaf':
+        return leafActiveStrategy(props.mandatory);
+      case 'single-leaf':
+        return leafSingleActiveStrategy(props.mandatory);
+      case 'independent':
+        return independentActiveStrategy(props.mandatory);
+      case 'single-independent':
+      default:
+        return independentSingleActiveStrategy(props.mandatory);
+    }
+  });
   const selectStrategy = computed(() => {
     if (typeof props.selectStrategy === 'object') return props.selectStrategy;
     switch (props.selectStrategy) {
@@ -8068,6 +8214,7 @@ const useNested = props => {
         return multipleOpenStrategy;
     }
   });
+  const activated = useProxiedModel(props, 'activated', props.activated, v => activeStrategy.value.in(v, children.value, parents.value), v => activeStrategy.value.out(v, children.value, parents.value));
   const selected = useProxiedModel(props, 'selected', props.selected, v => selectStrategy.value.in(v, children.value, parents.value), v => selectStrategy.value.out(v, children.value, parents.value));
   onBeforeUnmount(() => {
     isUnmounted = true;
@@ -8086,6 +8233,9 @@ const useNested = props => {
     id: shallowRef(),
     root: {
       opened,
+      activatable: toRef(props, 'activatable'),
+      selectable: toRef(props, 'selectable'),
+      activated,
       selected,
       selectedValues: computed(() => {
         const arr = [];
@@ -8159,6 +8309,26 @@ const useNested = props => {
         newSelected && (selected.value = newSelected);
         nested.root.openOnSelect(id, value, event);
       },
+      activate: (id, value, event) => {
+        if (!props.activatable) {
+          return nested.root.select(id, true, event);
+        }
+        vm.emit('click:activate', {
+          id,
+          value,
+          path: getPath(id),
+          event
+        });
+        const newActivated = activeStrategy.value.activate({
+          id,
+          value,
+          activated: new Set(activated.value),
+          children: children.value,
+          parents: parents.value,
+          event
+        });
+        newActivated && (activated.value = newActivated);
+      },
       children,
       parents
     }
@@ -8177,6 +8347,8 @@ const useNestedItem = (id, isGroup) => {
     openOnSelect: (open, e) => parent.root.openOnSelect(computedId.value, open, e),
     isOpen: computed(() => parent.root.opened.value.has(computedId.value)),
     parent: computed(() => parent.root.parents.value.get(computedId.value)),
+    activate: (activated, e) => parent.root.activate(computedId.value, activated, e),
+    isActivated: computed(() => parent.root.activated.value.has(toRaw(computedId.value))),
     select: (selected, e) => parent.root.select(computedId.value, selected, e),
     isSelected: computed(() => parent.root.selected.value.get(toRaw(computedId.value)) === 'on'),
     isIndeterminate: computed(() => parent.root.selected.value.get(computedId.value) === 'indeterminate'),
@@ -8299,7 +8471,9 @@ const VListGroup = genericComponent()({
         }, [slots.default?.()]), [[vShow, isOpen.value]])]
       })]
     }));
-    return {};
+    return {
+      isOpen
+    };
   }
 });
 
@@ -8372,6 +8546,8 @@ const VListItem = genericComponent()({
     const link = useLink(props, attrs);
     const id = computed(() => props.value === undefined ? link.href.value : props.value);
     const {
+      activate,
+      isActivated,
       select,
       isSelected,
       isIndeterminate,
@@ -8381,9 +8557,9 @@ const VListItem = genericComponent()({
       openOnSelect
     } = useNestedItem(id, false);
     const list = useList();
-    const isActive = computed(() => props.active !== false && (props.active || link.isActive?.value || isSelected.value));
+    const isActive = computed(() => props.active !== false && (props.active || link.isActive?.value || (root.activatable.value ? isActivated.value : isSelected.value)));
     const isLink = computed(() => props.link !== false && link.isLink.value);
-    const isClickable = computed(() => !props.disabled && props.link !== false && (props.link || link.isClickable.value || props.value != null && !!list));
+    const isClickable = computed(() => !props.disabled && props.link !== false && (props.link || link.isClickable.value || !!list && (root.selectable.value || root.activatable.value || props.value != null)));
     const roundedProps = computed(() => props.rounded || props.nav);
     const color = computed(() => props.color ?? props.activeColor);
     const variantProps = computed(() => ({
@@ -8434,7 +8610,13 @@ const VListItem = genericComponent()({
       emit('click', e);
       if (isGroupActivator || !isClickable.value) return;
       link.navigate?.(e);
-      props.value != null && select(!isSelected.value, e);
+      if (root.activatable) {
+        activate(!isActivated.value, e);
+      } else if (root.selectable) {
+        select(!isSelected.value, e);
+      } else if (props.value != null) {
+        select(!isSelected.value, e);
+      }
     }
     function onKeyDown(e) {
       if (e.key === 'Enter' || e.key === ' ') {
@@ -8550,7 +8732,12 @@ const VListItem = genericComponent()({
         }, null)])]
       }), [[resolveDirective("ripple"), isClickable.value && props.ripple]]);
     });
-    return {};
+    return {
+      isGroupActivator,
+      isSelected,
+      list,
+      select
+    };
   }
 });
 
@@ -8892,8 +9079,10 @@ const VList = genericComponent()({
   props: makeVListProps(),
   emits: {
     'update:selected': value => true,
+    'update:activated': value => true,
     'update:opened': value => true,
     'click:open': value => true,
+    'click:activate': value => true,
     'click:select': value => true
   },
   setup(props, _ref) {
@@ -8926,7 +9115,9 @@ const VList = genericComponent()({
       roundedClasses
     } = useRounded(props);
     const {
+      children,
       open,
+      parents,
       select
     } = useNested(props);
     const lineClasses = computed(() => props.lines ? `v-list--${props.lines}-line` : undefined);
@@ -9016,7 +9207,9 @@ const VList = genericComponent()({
     return {
       open,
       select,
-      focus
+      focus,
+      children,
+      parents
     };
   }
 });
@@ -11896,9 +12089,11 @@ const VSelect = genericComponent()({
         });
       }
     });
-    watch(() => props.items, val => {
-      if (!isFocused.value || !val.length || menu.value) return;
-      menu.value = true;
+    watch(() => props.items, (newVal, oldVal) => {
+      if (menu.value) return;
+      if (isFocused.value && !oldVal.length && newVal.length) {
+        menu.value = true;
+      }
     });
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
@@ -12458,9 +12653,11 @@ const VAutocomplete = genericComponent()({
         });
       }
     });
-    watch(() => props.items, val => {
-      if (!isFocused.value || !val.length || menu.value) return;
-      menu.value = true;
+    watch(() => props.items, (newVal, oldVal) => {
+      if (menu.value) return;
+      if (isFocused.value && !oldVal.length && newVal.length) {
+        menu.value = true;
+      }
     });
     useRender(() => {
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots['prepend-item'] || slots['append-item'] || slots['no-data']);
@@ -16263,9 +16460,11 @@ const VCombobox = genericComponent()({
         });
       }
     });
-    watch(() => props.items, val => {
-      if (!isFocused.value || !val.length || menu.value) return;
-      menu.value = true;
+    watch(() => props.items, (newVal, oldVal) => {
+      if (menu.value) return;
+      if (isFocused.value && !oldVal.length && newVal.length) {
+        menu.value = true;
+      }
     });
     useRender(() => {
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots['prepend-item'] || slots['append-item'] || slots['no-data']);
@@ -20286,6 +20485,7 @@ const VDatePickerControls = genericComponent()({
       emit('click:month');
     }
     useRender(() => {
+      // TODO: add slot support and scope defaults
       return createVNode("div", {
         "class": ['v-date-picker-controls']
       }, [createVNode(VBtn, {
@@ -25773,7 +25973,7 @@ function createVuetify$1() {
     goTo
   };
 }
-const version$1 = "3.5.8";
+const version$1 = "3.5.9";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -25798,7 +25998,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.5.8";
+const version = "3.5.9";
 createVuetify.version = version;
 
 export { components, createVuetify, directives, useDate, useDefaults, useDisplay, useGoTo, useLayout, useLocale, useRtl, useTheme, version };