vuetify 3.5.7 → 3.5.9

package/dist/vuetify.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.5.7
+* Vuetify v3.5.9
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -3154,17 +3154,19 @@ const MaybeTransition = (props, _ref) => {
   const {
     transition,
     disabled,
+    group,
     ...rest
   } = props;
   const {
-    component = Transition,
+    component = group ? TransitionGroup : Transition,
     ...customProps
   } = typeof transition === 'object' ? transition : {};
   return h(component, mergeProps(typeof transition === 'string' ? {
     name: disabled ? '' : transition
-  } : customProps, rest, {
-    disabled
-  }), slots);
+  } : customProps, typeof transition === 'string' ? {} : {
+    disabled,
+    group
+  }, rest), slots);
 };
 
 // Utilities
@@ -4364,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 = {
@@ -7750,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 {
@@ -7834,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;
       }
@@ -7976,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;
       }
@@ -8020,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');
@@ -8038,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) {
@@ -8066,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;
@@ -8084,6 +8233,9 @@ const useNested = props => {
     id: shallowRef(),
     root: {
       opened,
+      activatable: toRef(props, 'activatable'),
+      selectable: toRef(props, 'selectable'),
+      activated,
       selected,
       selectedValues: computed(() => {
         const arr = [];
@@ -8157,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
     }
@@ -8175,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'),
@@ -8297,7 +8471,9 @@ const VListGroup = genericComponent()({
         }, [slots.default?.()]), [[vShow, isOpen.value]])]
       })]
     }));
-    return {};
+    return {
+      isOpen
+    };
   }
 });
 
@@ -8370,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,
@@ -8379,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(() => ({
@@ -8432,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 === ' ') {
@@ -8548,7 +8732,12 @@ const VListItem = genericComponent()({
         }, null)])]
       }), [[resolveDirective("ripple"), isClickable.value && props.ripple]]);
     });
-    return {};
+    return {
+      isGroupActivator,
+      isSelected,
+      list,
+      select
+    };
   }
 });
 
@@ -8890,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) {
@@ -8924,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);
@@ -9014,7 +9207,9 @@ const VList = genericComponent()({
     return {
       open,
       select,
-      focus
+      focus,
+      children,
+      parents
     };
   }
 });
@@ -11894,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);
@@ -12456,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']);
@@ -16139,7 +16338,7 @@ const VCombobox = genericComponent()({
       }
       if (e.key === 'Enter' && search.value) {
         select(transformItem$3(props, search.value));
-        if (hasSelectionSlot.value) search.value = '';
+        if (hasSelectionSlot.value) _search.value = '';
       }
       if (!props.multiple) return;
       if (['Backspace', 'Delete'].includes(e.key)) {
@@ -16233,8 +16432,24 @@ const VCombobox = genericComponent()({
         return value === displayItems.value[0].value;
       })) {
         select(displayItems.value[0]);
-      } else if (search.value) {
-        select(transformItem$3(props, search.value));
+        return;
+      }
+      if (search.value) {
+        if (props.multiple) {
+          select(transformItem$3(props, search.value));
+          return;
+        }
+        if (!hasSelectionSlot.value) return;
+        if (model.value.some(_ref3 => {
+          let {
+            title
+          } = _ref3;
+          return title === search.value;
+        })) {
+          _search.value = '';
+        } else {
+          select(transformItem$3(props, search.value));
+        }
       }
     });
     watch(menu, () => {
@@ -16245,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']);
@@ -16312,12 +16529,12 @@ const VCombobox = genericComponent()({
               "renderless": true,
               "items": displayItems.value
             }, {
-              default: _ref3 => {
+              default: _ref4 => {
                 let {
                   item,
                   index,
                   itemRef
-                } = _ref3;
+                } = _ref4;
                 const itemProps = mergeProps(item.props, {
                   ref: itemRef,
                   key: index,
@@ -16331,10 +16548,10 @@ const VCombobox = genericComponent()({
                 }) ?? createVNode(VListItem, mergeProps(itemProps, {
                   "role": "option"
                 }), {
-                  prepend: _ref4 => {
+                  prepend: _ref5 => {
                     let {
                       isSelected
-                    } = _ref4;
+                    } = _ref5;
                     return createVNode(Fragment, null, [props.multiple && !props.hideSelected ? createVNode(VCheckboxBtn, {
                       "key": item.value,
                       "modelValue": isSelected,
@@ -17350,10 +17567,28 @@ function isSameMonth(date, comparing) {
 function getDiff(date, comparing, unit) {
   const d = new Date(date);
   const c = new Date(comparing);
-  if (unit === 'month') {
-    return d.getMonth() - c.getMonth() + (d.getFullYear() - c.getFullYear()) * 12;
+  switch (unit) {
+    case 'years':
+      return d.getFullYear() - c.getFullYear();
+    case 'quarters':
+      return Math.floor((d.getMonth() - c.getMonth() + (d.getFullYear() - c.getFullYear()) * 12) / 4);
+    case 'months':
+      return d.getMonth() - c.getMonth() + (d.getFullYear() - c.getFullYear()) * 12;
+    case 'weeks':
+      return Math.floor((d.getTime() - c.getTime()) / (1000 * 60 * 60 * 24 * 7));
+    case 'days':
+      return Math.floor((d.getTime() - c.getTime()) / (1000 * 60 * 60 * 24));
+    case 'hours':
+      return Math.floor((d.getTime() - c.getTime()) / (1000 * 60 * 60));
+    case 'minutes':
+      return Math.floor((d.getTime() - c.getTime()) / (1000 * 60));
+    case 'seconds':
+      return Math.floor((d.getTime() - c.getTime()) / 1000);
+    default:
+      {
+        return d.getTime() - c.getTime();
+      }
   }
-  return Math.floor((d.getTime() - c.getTime()) / (1000 * 60 * 60 * 24));
 }
 function setHours(date, count) {
   const d = new Date(date);
@@ -20250,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, {
@@ -20548,7 +20784,7 @@ const VDatePickerMonth = genericComponent()({
         } else {
           rangeStop.value = _value;
         }
-        const diff = adapter.getDiff(rangeStop.value, rangeStart.value);
+        const diff = adapter.getDiff(rangeStop.value, rangeStart.value, 'days');
         const datesInRange = [rangeStart.value];
         for (let i = 1; i < diff; i++) {
           const nextDate = adapter.addDays(rangeStart.value, i);
@@ -24362,6 +24598,8 @@ const VSwitch = genericComponent()({
       const controlProps = VSelectionControl.filterProps(props);
       return createVNode(VInput, mergeProps({
         "class": ['v-switch', {
+          'v-switch--flat': props.flat
+        }, {
           'v-switch--inset': props.inset
         }, {
           'v-switch--indeterminate': indeterminate.value
@@ -25735,7 +25973,7 @@ function createVuetify$1() {
     goTo
   };
 }
-const version$1 = "3.5.7";
+const version$1 = "3.5.9";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -25760,7 +25998,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.5.7";
+const version = "3.5.9";
 createVuetify.version = version;
 
 export { components, createVuetify, directives, useDate, useDefaults, useDisplay, useGoTo, useLayout, useLocale, useRtl, useTheme, version };