vuetify 3.7.10 → 3.7.12

package/lib/components/VAutocomplete/index.d.mts

@@ -337,7 +337,7 @@ interface ItemProps {
     itemChildren: SelectItemKey;
     itemProps: SelectItemKey;
     returnObject: boolean;
-    valueComparator: typeof deepEqual;
+    valueComparator: typeof deepEqual | undefined;
 }
 
 interface InternalListItem<T = any> extends ListItem<T> {
@@ -356,7 +356,6 @@ declare const VList: {
         tile: boolean;
         density: Density;
         slim: boolean;
-        valueComparator: typeof deepEqual;
         activatable: boolean;
         selectable: boolean;
         selectStrategy: SelectStrategyProp;
@@ -380,6 +379,7 @@ declare const VList: {
         baseColor?: string | undefined;
         bgColor?: string | undefined;
         activeColor?: string | undefined;
+        valueComparator?: typeof deepEqual | undefined;
         activeClass?: string | undefined;
         activeStrategy?: ActiveStrategyProp | undefined;
         collapseIcon?: IconValue | undefined;
@@ -428,7 +428,6 @@ declare const VList: {
         tile: boolean;
         density: Density;
         slim: boolean;
-        valueComparator: typeof deepEqual;
         activatable: boolean;
         selectable: boolean;
         selectStrategy: SelectStrategyProp;
@@ -452,6 +451,7 @@ declare const VList: {
         baseColor?: string | undefined;
         bgColor?: string | undefined;
         activeColor?: string | undefined;
+        valueComparator?: typeof deepEqual | undefined;
         activeClass?: string | undefined;
         activeStrategy?: ActiveStrategyProp | undefined;
         collapseIcon?: IconValue | undefined;
@@ -475,7 +475,6 @@ declare const VList: {
         tile: boolean;
         density: Density;
         slim: boolean;
-        valueComparator: typeof deepEqual;
         activatable: boolean;
         selectable: boolean;
         selectStrategy: SelectStrategyProp;
@@ -526,7 +525,6 @@ declare const VList: {
         tile: boolean;
         density: Density;
         slim: boolean;
-        valueComparator: typeof deepEqual;
         activatable: boolean;
         selectable: boolean;
         selectStrategy: SelectStrategyProp;
@@ -550,6 +548,7 @@ declare const VList: {
         baseColor?: string | undefined;
         bgColor?: string | undefined;
         activeColor?: string | undefined;
+        valueComparator?: typeof deepEqual | undefined;
         activeClass?: string | undefined;
         activeStrategy?: ActiveStrategyProp | undefined;
         collapseIcon?: IconValue | undefined;
@@ -580,7 +579,6 @@ declare const VList: {
         tile: boolean;
         density: Density;
         slim: boolean;
-        valueComparator: typeof deepEqual;
         activatable: boolean;
         selectable: boolean;
         selectStrategy: SelectStrategyProp;
@@ -602,7 +600,6 @@ declare const VList: {
     tile: boolean;
     density: Density;
     slim: boolean;
-    valueComparator: typeof deepEqual;
     activatable: boolean;
     selectable: boolean;
     selectStrategy: SelectStrategyProp;
@@ -626,6 +623,7 @@ declare const VList: {
     baseColor?: string | undefined;
     bgColor?: string | undefined;
     activeColor?: string | undefined;
+    valueComparator?: typeof deepEqual | undefined;
     activeClass?: string | undefined;
     activeStrategy?: ActiveStrategyProp | undefined;
     collapseIcon?: IconValue | undefined;
@@ -675,7 +673,6 @@ declare const VList: {
     tile: boolean;
     density: Density;
     slim: boolean;
-    valueComparator: typeof deepEqual;
     activatable: boolean;
     selectable: boolean;
     selectStrategy: SelectStrategyProp;
@@ -769,10 +766,7 @@ declare const VList: {
         default: string;
     };
     returnObject: BooleanConstructor;
-    valueComparator: {
-        type: PropType<typeof deepEqual>;
-        default: typeof deepEqual;
-    };
+    valueComparator: PropType<typeof deepEqual>;
     itemType: {
         type: StringConstructor;
         default: string;
@@ -878,10 +872,7 @@ declare const VList: {
         default: string;
     };
     returnObject: BooleanConstructor;
-    valueComparator: {
-        type: PropType<typeof deepEqual>;
-        default: typeof deepEqual;
-    };
+    valueComparator: PropType<typeof deepEqual>;
     itemType: {
         type: StringConstructor;
         default: string;
@@ -3078,7 +3069,6 @@ declare const VAutocomplete: {
         rules: readonly ValidationRule[];
         tile: boolean;
         density: Density;
-        valueComparator: typeof deepEqual;
         clearIcon: IconValue;
         hideSpinButtons: boolean;
         persistentHint: boolean;
@@ -3122,6 +3112,7 @@ declare const VAutocomplete: {
         bgColor?: string | undefined;
         prependIcon?: IconValue | undefined;
         appendIcon?: IconValue | undefined;
+        valueComparator?: typeof deepEqual | undefined;
         prependInnerIcon?: IconValue | undefined;
         'onClick:clear'?: ((args_0: MouseEvent) => void) | undefined;
         'onClick:append'?: ((args_0: MouseEvent) => void) | undefined;
@@ -3148,7 +3139,6 @@ declare const VAutocomplete: {
             tile: boolean;
             density: Density;
             slim: boolean;
-            valueComparator: typeof deepEqual;
             activatable: boolean;
             selectable: boolean;
             selectStrategy: SelectStrategyProp;
@@ -3166,7 +3156,6 @@ declare const VAutocomplete: {
             tile: boolean;
             density: Density;
             slim: boolean;
-            valueComparator: typeof deepEqual;
             activatable: boolean;
             selectable: boolean;
             selectStrategy: SelectStrategyProp;
@@ -3189,6 +3178,7 @@ declare const VAutocomplete: {
             baseColor?: string | undefined;
             bgColor?: string | undefined;
             activeColor?: string | undefined;
+            valueComparator?: typeof deepEqual | undefined;
             activeClass?: string | undefined;
             activeStrategy?: ActiveStrategyProp | undefined;
             collapseIcon?: IconValue | undefined;
@@ -3210,7 +3200,6 @@ declare const VAutocomplete: {
             tile: boolean;
             density: Density;
             slim: boolean;
-            valueComparator: typeof deepEqual;
             activatable: boolean;
             selectable: boolean;
             selectStrategy: SelectStrategyProp;
@@ -3234,6 +3223,7 @@ declare const VAutocomplete: {
             baseColor?: string | undefined;
             bgColor?: string | undefined;
             activeColor?: string | undefined;
+            valueComparator?: typeof deepEqual | undefined;
             activeClass?: string | undefined;
             activeStrategy?: ActiveStrategyProp | undefined;
             collapseIcon?: IconValue | undefined;
@@ -3245,7 +3235,7 @@ declare const VAutocomplete: {
                 value: boolean;
                 path: unknown[];
             }) => any) | undefined;
-        }, "variant" | "nav" | "style" | "disabled" | "tag" | "lines" | "mandatory" | "rounded" | "tile" | "density" | "slim" | "valueComparator" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "returnObject" | "itemType"> & {
+        }, "variant" | "nav" | "style" | "disabled" | "tag" | "lines" | "mandatory" | "rounded" | "tile" | "density" | "slim" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "returnObject" | "itemType"> & {
             items?: readonly any[] | undefined;
             itemTitle?: SelectItemKey<any>;
             itemValue?: SelectItemKey<any>;
@@ -3573,7 +3563,6 @@ declare const VAutocomplete: {
         rules: readonly ValidationRule[];
         tile: boolean;
         density: Density;
-        valueComparator: typeof deepEqual;
         clearIcon: IconValue;
         hideSpinButtons: boolean;
         persistentHint: boolean;
@@ -3617,6 +3606,7 @@ declare const VAutocomplete: {
         bgColor?: string | undefined;
         prependIcon?: IconValue | undefined;
         appendIcon?: IconValue | undefined;
+        valueComparator?: typeof deepEqual | undefined;
         prependInnerIcon?: IconValue | undefined;
         'onClick:clear'?: ((args_0: MouseEvent) => void) | undefined;
         'onClick:append'?: ((args_0: MouseEvent) => void) | undefined;
@@ -3643,7 +3633,6 @@ declare const VAutocomplete: {
             tile: boolean;
             density: Density;
             slim: boolean;
-            valueComparator: typeof deepEqual;
             activatable: boolean;
             selectable: boolean;
             selectStrategy: SelectStrategyProp;
@@ -3661,7 +3650,6 @@ declare const VAutocomplete: {
             tile: boolean;
             density: Density;
             slim: boolean;
-            valueComparator: typeof deepEqual;
             activatable: boolean;
             selectable: boolean;
             selectStrategy: SelectStrategyProp;
@@ -3684,6 +3672,7 @@ declare const VAutocomplete: {
             baseColor?: string | undefined;
             bgColor?: string | undefined;
             activeColor?: string | undefined;
+            valueComparator?: typeof deepEqual | undefined;
             activeClass?: string | undefined;
             activeStrategy?: ActiveStrategyProp | undefined;
             collapseIcon?: IconValue | undefined;
@@ -3705,7 +3694,6 @@ declare const VAutocomplete: {
             tile: boolean;
             density: Density;
             slim: boolean;
-            valueComparator: typeof deepEqual;
             activatable: boolean;
             selectable: boolean;
             selectStrategy: SelectStrategyProp;
@@ -3729,6 +3717,7 @@ declare const VAutocomplete: {
             baseColor?: string | undefined;
             bgColor?: string | undefined;
             activeColor?: string | undefined;
+            valueComparator?: typeof deepEqual | undefined;
             activeClass?: string | undefined;
             activeStrategy?: ActiveStrategyProp | undefined;
             collapseIcon?: IconValue | undefined;
@@ -3740,7 +3729,7 @@ declare const VAutocomplete: {
                 value: boolean;
                 path: unknown[];
             }) => any) | undefined;
-        }, "variant" | "nav" | "style" | "disabled" | "tag" | "lines" | "mandatory" | "rounded" | "tile" | "density" | "slim" | "valueComparator" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "returnObject" | "itemType"> & {
+        }, "variant" | "nav" | "style" | "disabled" | "tag" | "lines" | "mandatory" | "rounded" | "tile" | "density" | "slim" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "returnObject" | "itemType"> & {
             items?: readonly any[] | undefined;
             itemTitle?: SelectItemKey<any>;
             itemValue?: SelectItemKey<any>;
@@ -4064,7 +4053,6 @@ declare const VAutocomplete: {
         rounded: string | number | boolean;
         tile: boolean;
         density: Density;
-        valueComparator: typeof deepEqual;
         clearIcon: IconValue;
         centerAffix: boolean;
         hideSpinButtons: boolean;
@@ -4152,7 +4140,6 @@ declare const VAutocomplete: {
         rules: readonly ValidationRule[];
         tile: boolean;
         density: Density;
-        valueComparator: typeof deepEqual;
         clearIcon: IconValue;
         hideSpinButtons: boolean;
         persistentHint: boolean;
@@ -4196,6 +4183,7 @@ declare const VAutocomplete: {
         bgColor?: string | undefined;
         prependIcon?: IconValue | undefined;
         appendIcon?: IconValue | undefined;
+        valueComparator?: typeof deepEqual | undefined;
         prependInnerIcon?: IconValue | undefined;
         'onClick:clear'?: ((args_0: MouseEvent) => void) | undefined;
         'onClick:append'?: ((args_0: MouseEvent) => void) | undefined;
@@ -4222,7 +4210,6 @@ declare const VAutocomplete: {
             tile: boolean;
             density: Density;
             slim: boolean;
-            valueComparator: typeof deepEqual;
             activatable: boolean;
             selectable: boolean;
             selectStrategy: SelectStrategyProp;
@@ -4240,7 +4227,6 @@ declare const VAutocomplete: {
             tile: boolean;
             density: Density;
             slim: boolean;
-            valueComparator: typeof deepEqual;
             activatable: boolean;
             selectable: boolean;
             selectStrategy: SelectStrategyProp;
@@ -4263,6 +4249,7 @@ declare const VAutocomplete: {
             baseColor?: string | undefined;
             bgColor?: string | undefined;
             activeColor?: string | undefined;
+            valueComparator?: typeof deepEqual | undefined;
             activeClass?: string | undefined;
             activeStrategy?: ActiveStrategyProp | undefined;
             collapseIcon?: IconValue | undefined;
@@ -4284,7 +4271,6 @@ declare const VAutocomplete: {
             tile: boolean;
             density: Density;
             slim: boolean;
-            valueComparator: typeof deepEqual;
             activatable: boolean;
             selectable: boolean;
             selectStrategy: SelectStrategyProp;
@@ -4308,6 +4294,7 @@ declare const VAutocomplete: {
             baseColor?: string | undefined;
             bgColor?: string | undefined;
             activeColor?: string | undefined;
+            valueComparator?: typeof deepEqual | undefined;
             activeClass?: string | undefined;
             activeStrategy?: ActiveStrategyProp | undefined;
             collapseIcon?: IconValue | undefined;
@@ -4319,7 +4306,7 @@ declare const VAutocomplete: {
                 value: boolean;
                 path: unknown[];
             }) => any) | undefined;
-        }, "variant" | "nav" | "style" | "disabled" | "tag" | "lines" | "mandatory" | "rounded" | "tile" | "density" | "slim" | "valueComparator" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "returnObject" | "itemType"> & {
+        }, "variant" | "nav" | "style" | "disabled" | "tag" | "lines" | "mandatory" | "rounded" | "tile" | "density" | "slim" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "returnObject" | "itemType"> & {
             items?: readonly any[] | undefined;
             itemTitle?: SelectItemKey<any>;
             itemValue?: SelectItemKey<any>;
@@ -4643,7 +4630,6 @@ declare const VAutocomplete: {
         rounded: string | number | boolean;
         tile: boolean;
         density: Density;
-        valueComparator: typeof deepEqual;
         clearIcon: IconValue;
         centerAffix: boolean;
         hideSpinButtons: boolean;
@@ -4696,7 +4682,6 @@ declare const VAutocomplete: {
     rules: readonly ValidationRule[];
     tile: boolean;
     density: Density;
-    valueComparator: typeof deepEqual;
     clearIcon: IconValue;
     hideSpinButtons: boolean;
     persistentHint: boolean;
@@ -4740,6 +4725,7 @@ declare const VAutocomplete: {
     bgColor?: string | undefined;
     prependIcon?: IconValue | undefined;
     appendIcon?: IconValue | undefined;
+    valueComparator?: typeof deepEqual | undefined;
     prependInnerIcon?: IconValue | undefined;
     'onClick:clear'?: ((args_0: MouseEvent) => void) | undefined;
     'onClick:append'?: ((args_0: MouseEvent) => void) | undefined;
@@ -4766,7 +4752,6 @@ declare const VAutocomplete: {
         tile: boolean;
         density: Density;
         slim: boolean;
-        valueComparator: typeof deepEqual;
         activatable: boolean;
         selectable: boolean;
         selectStrategy: SelectStrategyProp;
@@ -4784,7 +4769,6 @@ declare const VAutocomplete: {
         tile: boolean;
         density: Density;
         slim: boolean;
-        valueComparator: typeof deepEqual;
         activatable: boolean;
         selectable: boolean;
         selectStrategy: SelectStrategyProp;
@@ -4807,6 +4791,7 @@ declare const VAutocomplete: {
         baseColor?: string | undefined;
         bgColor?: string | undefined;
         activeColor?: string | undefined;
+        valueComparator?: typeof deepEqual | undefined;
         activeClass?: string | undefined;
         activeStrategy?: ActiveStrategyProp | undefined;
         collapseIcon?: IconValue | undefined;
@@ -4828,7 +4813,6 @@ declare const VAutocomplete: {
         tile: boolean;
         density: Density;
         slim: boolean;
-        valueComparator: typeof deepEqual;
         activatable: boolean;
         selectable: boolean;
         selectStrategy: SelectStrategyProp;
@@ -4852,6 +4836,7 @@ declare const VAutocomplete: {
         baseColor?: string | undefined;
         bgColor?: string | undefined;
         activeColor?: string | undefined;
+        valueComparator?: typeof deepEqual | undefined;
         activeClass?: string | undefined;
         activeStrategy?: ActiveStrategyProp | undefined;
         collapseIcon?: IconValue | undefined;
@@ -4863,7 +4848,7 @@ declare const VAutocomplete: {
             value: boolean;
             path: unknown[];
         }) => any) | undefined;
-    }, "variant" | "nav" | "style" | "disabled" | "tag" | "lines" | "mandatory" | "rounded" | "tile" | "density" | "slim" | "valueComparator" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "returnObject" | "itemType"> & {
+    }, "variant" | "nav" | "style" | "disabled" | "tag" | "lines" | "mandatory" | "rounded" | "tile" | "density" | "slim" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "returnObject" | "itemType"> & {
         items?: readonly any[] | undefined;
         itemTitle?: SelectItemKey<any>;
         itemValue?: SelectItemKey<any>;
@@ -5192,7 +5177,6 @@ declare const VAutocomplete: {
     rounded: string | number | boolean;
     tile: boolean;
     density: Density;
-    valueComparator: typeof deepEqual;
     clearIcon: IconValue;
     centerAffix: boolean;
     hideSpinButtons: boolean;
@@ -5424,10 +5408,7 @@ declare const VAutocomplete: {
         default: string;
     };
     returnObject: BooleanConstructor;
-    valueComparator: {
-        type: PropType<typeof deepEqual>;
-        default: typeof deepEqual;
-    };
+    valueComparator: PropType<typeof deepEqual>;
     chips: BooleanConstructor;
     closableChips: BooleanConstructor;
     closeText: {
@@ -5625,10 +5606,7 @@ declare const VAutocomplete: {
         default: string;
     };
     returnObject: BooleanConstructor;
-    valueComparator: {
-        type: PropType<typeof deepEqual>;
-        default: typeof deepEqual;
-    };
+    valueComparator: PropType<typeof deepEqual>;
     chips: BooleanConstructor;
     closableChips: BooleanConstructor;
     closeText: {

package/lib/components/VCombobox/VCombobox.mjs

@@ -21,11 +21,10 @@ import { useForm } from "../../composables/form.mjs";
 import { forwardRefs } from "../../composables/forwardRefs.mjs";
 import { transformItem, useItems } from "../../composables/list-items.mjs";
 import { useLocale } from "../../composables/locale.mjs";
-import { useIsMousedown } from "../../composables/mousedown.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs";
 import { makeTransitionProps } from "../../composables/transition.mjs"; // Utilities
 import { computed, mergeProps, nextTick, ref, shallowRef, watch } from 'vue';
-import { checkPrintable, ensureValidVNode, genericComponent, IN_BROWSER, isComposingIgnoreKey, noop, omit, propsFactory, useRender, wrapInArray } from "../../util/index.mjs"; // Types
+import { checkPrintable, deepEqual, ensureValidVNode, genericComponent, IN_BROWSER, isComposingIgnoreKey, noop, omit, propsFactory, useRender, wrapInArray } from "../../util/index.mjs"; // Types
 function highlightResult(text, matches, length) {
   if (matches == null) return text;
   if (Array.isArray(matches)) throw new Error('Multiple matches is not implemented');
@@ -110,9 +109,6 @@ export const VCombobox = genericComponent()({
       return props.multiple ? transformed : transformed[0] ?? null;
     });
     const form = useForm(props);
-    const {
-      isMousedown
-    } = useIsMousedown();
     const hasChips = computed(() => !!(props.chips || slots.chip));
     const hasSelectionSlot = computed(() => hasChips.value || !!slots.selection);
     const _search = shallowRef(!props.multiple && !hasSelectionSlot.value ? model.value[0]?.title ?? '' : '');
@@ -276,18 +272,12 @@ export const VCombobox = genericComponent()({
         vTextFieldRef.value?.focus();
       }
     }
-    function onBlur(e) {
-      if (!isMousedown.value) {
-        menu.value = false;
-      }
-    }
-
     /** @param set - null means toggle */
     function select(item) {
       let set = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
       if (!item || item.props.disabled) return;
       if (props.multiple) {
-        const index = model.value.findIndex(selection => props.valueComparator(selection.value, item.value));
+        const index = model.value.findIndex(selection => (props.valueComparator || deepEqual)(selection.value, item.value));
         const add = set == null ? !~index : set;
         if (~index) {
           const value = add ? [...model.value, item] : [...model.value];
@@ -326,6 +316,7 @@ export const VCombobox = genericComponent()({
     watch(isFocused, (val, oldVal) => {
       if (val || val === oldVal) return;
       selectionIndex.value = -1;
+      menu.value = false;
       if (search.value) {
         if (props.multiple) {
           select(transformItem(props, search.value));
@@ -346,7 +337,7 @@ export const VCombobox = genericComponent()({
     });
     watch(menu, () => {
       if (!props.hideSelected && menu.value && model.value.length) {
-        const index = displayItems.value.findIndex(item => model.value.some(s => props.valueComparator(s.value, item.value)));
+        const index = displayItems.value.findIndex(item => model.value.some(s => (props.valueComparator || deepEqual)(s.value, item.value)));
         IN_BROWSER && window.requestAnimationFrame(() => {
           index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
         });
@@ -383,7 +374,6 @@ export const VCombobox = genericComponent()({
         "readonly": form.isReadonly.value,
         "placeholder": isDirty ? undefined : props.placeholder,
         "onClick:clear": onClear,
-        "onBlur": onBlur,
         "onMousedown:control": onMousedownControl,
         "onKeydown": onKeydown
       }), {