vuetify 3.3.14 → 3.3.16

package/dist/vuetify-labs.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.3.14
+* Vuetify v3.3.16
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -2115,6 +2115,7 @@ const defaultThemeOptions = {
       colors: {
         background: '#FFFFFF',
         surface: '#FFFFFF',
+        'surface-bright': '#FFFFFF',
         'surface-variant': '#424242',
         'on-surface-variant': '#EEEEEE',
         primary: '#6200EE',
@@ -2150,7 +2151,8 @@ const defaultThemeOptions = {
       colors: {
         background: '#121212',
         surface: '#212121',
-        'surface-variant': '#BDBDBD',
+        'surface-bright': '#ccbfd6',
+        'surface-variant': '#a3a3a3',
         'on-surface-variant': '#424242',
         primary: '#BB86FC',
         'primary-darken-1': '#3700B3',
@@ -2341,12 +2343,14 @@ function provideTheme(props) {
   const theme = inject$1(ThemeSymbol, null);
   if (!theme) throw new Error('Could not find Vuetify theme injection');
   const name = computed(() => {
-    return props.theme ?? theme?.name.value;
+    return props.theme ?? theme.name.value;
   });
+  const current = computed(() => theme.themes.value[name.value]);
   const themeClasses = computed(() => theme.isDisabled ? undefined : `v-theme--${name.value}`);
   const newTheme = {
     ...theme,
     name,
+    current,
     themeClasses
   };
   provide(ThemeSymbol, newTheme);
@@ -5803,6 +5807,12 @@ function useSelectionControl(props) {
   } = useTextColor(computed(() => {
     return model.value && !props.error && !props.disabled ? props.color : undefined;
   }));
+  const {
+    backgroundColorClasses,
+    backgroundColorStyles
+  } = useBackgroundColor(computed(() => {
+    return model.value && !props.error && !props.disabled ? props.color : undefined;
+  }));
   const icon = computed(() => model.value ? props.trueIcon : props.falseIcon);
   return {
     group,
@@ -5812,6 +5822,8 @@ function useSelectionControl(props) {
     model,
     textColorClasses,
     textColorStyles,
+    backgroundColorClasses,
+    backgroundColorStyles,
     icon
   };
 }
@@ -5837,6 +5849,8 @@ const VSelectionControl = genericComponent()({
       model,
       textColorClasses,
       textColorStyles,
+      backgroundColorClasses,
+      backgroundColorStyles,
       trueValue
     } = useSelectionControl(props);
     const uid = getUid();
@@ -5901,12 +5915,17 @@ const VSelectionControl = genericComponent()({
       }), [createVNode("div", {
         "class": ['v-selection-control__wrapper', textColorClasses.value],
         "style": textColorStyles.value
-      }, [slots.default?.(), withDirectives(createVNode("div", {
+      }, [slots.default?.({
+        backgroundColorClasses,
+        backgroundColorStyles
+      }), withDirectives(createVNode("div", {
         "class": ['v-selection-control__input']
       }, [slots.input?.({
         model,
         textColorClasses,
         textColorStyles,
+        backgroundColorClasses,
+        backgroundColorStyles,
         inputNode,
         icon: icon.value,
         props: {
@@ -7962,11 +7981,15 @@ const makeItemsProps = propsFactory({
     type: [Boolean, String, Array, Function],
     default: 'props'
   },
-  returnObject: Boolean
+  returnObject: Boolean,
+  valueComparator: {
+    type: Function,
+    default: deepEqual
+  }
 }, 'list-items');
 function transformItem$3(props, item) {
   const title = getPropertyFromItem(item, props.itemTitle, item);
-  const value = props.returnObject ? item : getPropertyFromItem(item, props.itemValue, title);
+  const value = getPropertyFromItem(item, props.itemValue, title);
   const children = getPropertyFromItem(item, props.itemChildren);
   const itemProps = props.itemProps === true ? typeof item === 'object' && item != null && !Array.isArray(item) ? 'children' in item ? pick(item, ['children'])[1] : item : undefined : getPropertyFromItem(item, props.itemProps);
   const _props = {
@@ -7991,25 +8014,32 @@ function transformItems$3(props, items) {
 }
 function useItems(props) {
   const items = computed(() => transformItems$3(props, props.items));
-  return useTransformItems(items, value => transformItem$3(props, value));
-}
-function useTransformItems(items, transform) {
+  const hasNullItem = computed(() => items.value.some(item => item.value === null));
   function transformIn(value) {
-    return value
-    // When the model value is null, returns an InternalItem based on null
-    // only if null is one of the items
-    .filter(v => v !== null || items.value.some(item => item.value === null)).map(v => {
-      const existingItem = items.value.find(item => deepEqual(v, item.value));
-      // Nullish existingItem means value is a custom input value from combobox
-      // In this case, use transformItem to create an InternalItem based on value
-      return existingItem ?? transform(v);
+    if (!hasNullItem.value) {
+      // When the model value is null, return an InternalItem
+      // based on null only if null is one of the items
+      value = value.filter(v => v !== null);
+    }
+    return value.map(v => {
+      if (props.returnObject && typeof v === 'string') {
+        // String model value means value is a custom input value from combobox
+        // Don't look up existing items if the model value is a string
+        return transformItem$3(props, v);
+      }
+      return items.value.find(item => props.valueComparator(v, item.value)) || transformItem$3(props, v);
     });
   }
   function transformOut(value) {
-    return value.map(_ref => {
+    return props.returnObject ? value.map(_ref => {
       let {
-        value
+        raw
       } = _ref;
+      return raw;
+    }) : value.map(_ref2 => {
+      let {
+        value
+      } = _ref2;
       return value;
     });
   }
@@ -9117,7 +9147,7 @@ function _useActivator(props, vm, _ref2) {
     if (selector) {
       if (selector === 'parent') {
         let el = vm?.proxy?.$el?.parentNode;
-        while (el.hasAttribute('data-no-activator')) {
+        while (el?.hasAttribute('data-no-activator')) {
           el = el.parentNode;
         }
         activator = el;
@@ -10840,10 +10870,6 @@ const makeSelectProps = propsFactory({
     default: '$vuetify.noDataText'
   },
   openOnClear: Boolean,
-  valueComparator: {
-    type: Function,
-    default: deepEqual
-  },
   itemColor: String,
   ...makeItemsProps({
     itemChildren: false
@@ -10897,24 +10923,14 @@ const VSelect = genericComponent()({
       return props.multiple ? transformed : transformed[0] ?? null;
     });
     const form = useForm();
-    const selections = computed(() => {
-      return model.value.map(v => {
-        return items.value.find(item => {
-          const itemRawValue = getPropertyFromItem(item.raw, props.itemValue);
-          const modelRawValue = getPropertyFromItem(v.raw, props.itemValue);
-          if (itemRawValue === undefined || modelRawValue === undefined) return false;
-          return props.returnObject ? props.valueComparator(itemRawValue, modelRawValue) : props.valueComparator(item.value, v.value);
-        }) || v;
-      });
-    });
-    const selected = computed(() => selections.value.map(selection => selection.props.value));
+    const selectedValues = computed(() => model.value.map(selection => selection.value));
     const isFocused = shallowRef(false);
     const label = computed(() => menu.value ? props.closeText : props.openText);
     let keyboardLookupPrefix = '';
     let keyboardLookupLastTime;
     const displayItems = computed(() => {
       if (props.hideSelected) {
-        return items.value.filter(item => !selections.value.some(s => s === item));
+        return items.value.filter(item => !model.value.some(s => s === item));
       }
       return items.value;
     });
@@ -10972,7 +10988,7 @@ const VSelect = genericComponent()({
     }
     function select(item) {
       if (props.multiple) {
-        const index = selected.value.findIndex(selection => props.valueComparator(selection, item.value));
+        const index = model.value.findIndex(selection => props.valueComparator(selection.value, item.value));
         if (index === -1) {
           model.value = [...model.value, item];
         } else {
@@ -11009,8 +11025,8 @@ const VSelect = genericComponent()({
       }
     }
     watch(menu, () => {
-      if (!props.hideSelected && menu.value && selections.value.length) {
-        const index = displayItems.value.findIndex(item => selections.value.some(s => item.value === s.value));
+      if (!props.hideSelected && menu.value && model.value.length) {
+        const index = displayItems.value.findIndex(item => model.value.some(s => props.valueComparator(s.value, item.value)));
         IN_BROWSER && window.requestAnimationFrame(() => {
           index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
         });
@@ -11065,7 +11081,7 @@ const VSelect = genericComponent()({
         }, props.menuProps), {
           default: () => [hasList && createVNode(VList, {
             "ref": listRef,
-            "selected": selected.value,
+            "selected": selectedValues.value,
             "selectStrategy": props.multiple ? 'independent' : 'single-independent',
             "onMousedown": e => e.preventDefault(),
             "onKeydown": onListKeydown,
@@ -11114,7 +11130,7 @@ const VSelect = genericComponent()({
               }
             }), slots['append-item']?.()]
           })]
-        }), selections.value.map((item, index) => {
+        }), model.value.map((item, index) => {
           function onChipClose(e) {
             e.stopPropagation();
             e.preventDefault();
@@ -11157,7 +11173,7 @@ const VSelect = genericComponent()({
             index
           }) ?? createVNode("span", {
             "class": "v-select__selection-text"
-          }, [item.title, props.multiple && index < selections.value.length - 1 && createVNode("span", {
+          }, [item.title, props.multiple && index < model.value.length - 1 && createVNode("span", {
             "class": "v-select__selection-comma"
           }, [createTextVNode(",")])])]);
         })]),
@@ -11209,15 +11225,15 @@ function filterItems(items, query, options) {
   const customFiltersLength = Object.keys(options?.customKeyFilter ?? {}).length;
   if (!items?.length) return array;
   loop: for (let i = 0; i < items.length; i++) {
-    const item = items[i];
+    const [item, transformed = item] = wrapInArray(items[i]);
     const customMatches = {};
     const defaultMatches = {};
     let match = -1;
     if (query && !options?.noFilter) {
       if (typeof item === 'object') {
-        const filterKeys = keys || Object.keys(item);
+        const filterKeys = keys || Object.keys(transformed);
         for (const key of filterKeys) {
-          const value = getPropertyFromItem(item, key, item);
+          const value = getPropertyFromItem(transformed, key, transformed);
           const keyFilter = options?.customKeyFilter?.[key];
           match = keyFilter ? keyFilter(value, query, item) : filter(value, query, item);
           if (match !== -1 && match !== false) {
@@ -11251,7 +11267,7 @@ function filterItems(items, query, options) {
 function useFilter(props, items, query, options) {
   const filteredItems = ref([]);
   const filteredMatches = ref(new Map());
-  const transformedItems = computed(() => options?.transform ? unref(items).map(options?.transform) : unref(items));
+  const transformedItems = computed(() => options?.transform ? unref(items).map(item => [item, options.transform(item)]) : unref(items));
   watchEffect(() => {
     const _query = typeof query === 'function' ? query() : unref(query);
     const strQuery = typeof _query !== 'string' && typeof _query !== 'number' ? '' : String(_query);
@@ -11369,24 +11385,13 @@ const VAutocomplete = genericComponent()({
       filteredItems,
       getMatches
     } = useFilter(props, items, () => isPristine.value ? '' : search.value);
-    const selections = computed(() => {
-      return model.value.map(v => {
-        return items.value.find(item => {
-          const itemRawValue = getPropertyFromItem(item.raw, props.itemValue);
-          const modelRawValue = getPropertyFromItem(v.raw, props.itemValue);
-          if (itemRawValue === undefined || modelRawValue === undefined) return false;
-          return props.returnObject ? props.valueComparator(itemRawValue, modelRawValue) : props.valueComparator(item.value, v.value);
-        }) || v;
-      });
-    });
     const displayItems = computed(() => {
       if (props.hideSelected) {
-        return filteredItems.value.filter(filteredItem => !selections.value.some(s => s.value === filteredItem.value));
+        return filteredItems.value.filter(filteredItem => !model.value.some(s => s.value === filteredItem.value));
       }
       return filteredItems.value;
     });
-    const selected = computed(() => selections.value.map(selection => selection.props.value));
-    const selection = computed(() => selections.value[selectionIndex.value]);
+    const selectedValues = computed(() => model.value.map(selection => selection.props.value));
     const highlightFirst = computed(() => {
       const selectFirst = props.autoSelectFirst === true || props.autoSelectFirst === 'exact' && search.value === displayItems.value[0]?.title;
       return selectFirst && displayItems.value.length > 0 && !isPristine.value && !listHasFocus.value;
@@ -11418,7 +11423,7 @@ const VAutocomplete = genericComponent()({
     function onKeydown(e) {
       if (props.readonly || form?.isReadonly.value) return;
       const selectionStart = vTextFieldRef.value.selectionStart;
-      const length = selected.value.length;
+      const length = model.value.length;
       if (selectionIndex.value > -1 || ['Enter', 'ArrowDown', 'ArrowUp'].includes(e.key)) {
         e.preventDefault();
       }
@@ -11443,13 +11448,14 @@ const VAutocomplete = genericComponent()({
           return;
         }
         const originalSelectionIndex = selectionIndex.value;
-        if (selection.value) select(selection.value);
+        const selectedItem = model.value[selectionIndex.value];
+        if (selectedItem) select(selectedItem);
         selectionIndex.value = originalSelectionIndex >= length - 1 ? length - 2 : originalSelectionIndex;
       }
       if (e.key === 'ArrowLeft') {
         if (selectionIndex.value < 0 && selectionStart > 0) return;
         const prev = selectionIndex.value > -1 ? selectionIndex.value - 1 : length - 1;
-        if (selections.value[prev]) {
+        if (model.value[prev]) {
           selectionIndex.value = prev;
         } else {
           selectionIndex.value = -1;
@@ -11459,7 +11465,7 @@ const VAutocomplete = genericComponent()({
       if (e.key === 'ArrowRight') {
         if (selectionIndex.value < 0) return;
         const next = selectionIndex.value + 1;
-        if (selections.value[next]) {
+        if (model.value[next]) {
           selectionIndex.value = next;
         } else {
           selectionIndex.value = -1;
@@ -11499,7 +11505,7 @@ const VAutocomplete = genericComponent()({
     const isSelecting = shallowRef(false);
     function select(item) {
       if (props.multiple) {
-        const index = selected.value.findIndex(selection => props.valueComparator(selection, item.value));
+        const index = model.value.findIndex(selection => props.valueComparator(selection.value, item.value));
         if (index === -1) {
           model.value = [...model.value, item];
         } else {
@@ -11520,11 +11526,11 @@ const VAutocomplete = genericComponent()({
       if (val === oldVal) return;
       if (val) {
         isSelecting.value = true;
-        search.value = props.multiple ? '' : String(selections.value.at(-1)?.props.title ?? '');
+        search.value = props.multiple ? '' : String(model.value.at(-1)?.props.title ?? '');
         isPristine.value = true;
         nextTick(() => isSelecting.value = false);
       } else {
-        if (!props.multiple && !search.value) model.value = [];else if (highlightFirst.value && !listHasFocus.value && !selections.value.some(_ref2 => {
+        if (!props.multiple && !search.value) model.value = [];else if (highlightFirst.value && !listHasFocus.value && !model.value.some(_ref2 => {
           let {
             value
           } = _ref2;
@@ -11543,8 +11549,8 @@ const VAutocomplete = genericComponent()({
       isPristine.value = !val;
     });
     watch(menu, () => {
-      if (!props.hideSelected && menu.value && selections.value.length) {
-        const index = displayItems.value.findIndex(item => selections.value.some(s => item.value === s.value));
+      if (!props.hideSelected && menu.value && model.value.length) {
+        const index = displayItems.value.findIndex(item => model.value.some(s => item.value === s.value));
         IN_BROWSER && window.requestAnimationFrame(() => {
           index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
         });
@@ -11596,7 +11602,7 @@ const VAutocomplete = genericComponent()({
         }, props.menuProps), {
           default: () => [hasList && createVNode(VList, {
             "ref": listRef,
-            "selected": selected.value,
+            "selected": selectedValues.value,
             "selectStrategy": props.multiple ? 'independent' : 'single-independent',
             "onMousedown": e => e.preventDefault(),
             "onKeydown": onListKeydown,
@@ -11650,7 +11656,7 @@ const VAutocomplete = genericComponent()({
               }
             }), slots['append-item']?.()]
           })]
-        }), selections.value.map((item, index) => {
+        }), model.value.map((item, index) => {
           function onChipClose(e) {
             e.stopPropagation();
             e.preventDefault();
@@ -11694,7 +11700,7 @@ const VAutocomplete = genericComponent()({
             index
           }) ?? createVNode("span", {
             "class": "v-autocomplete__selection-text"
-          }, [item.title, props.multiple && index < selections.value.length - 1 && createVNode("span", {
+          }, [item.title, props.multiple && index < model.value.length - 1 && createVNode("span", {
             "class": "v-autocomplete__selection-comma"
           }, [createTextVNode(",")])])]);
         })]),
@@ -13092,11 +13098,29 @@ const VColorPickerCanvas = defineComponent({
       emit
     } = _ref;
     const isInteracting = shallowRef(false);
-    const isOutsideUpdate = shallowRef(false);
-    const dotPosition = ref({
+    const canvasRef = ref();
+    const canvasWidth = shallowRef(parseFloat(props.width));
+    const canvasHeight = shallowRef(parseFloat(props.height));
+    const _dotPosition = ref({
       x: 0,
       y: 0
     });
+    const dotPosition = computed({
+      get: () => _dotPosition.value,
+      set(val) {
+        if (!canvasRef.value) return;
+        const {
+          x,
+          y
+        } = val;
+        emit('update:color', {
+          h: props.color?.h ?? 0,
+          s: clamp(x, 0, canvasWidth.value) / canvasWidth.value,
+          v: 1 - clamp(y, 0, canvasHeight.value) / canvasHeight.value,
+          a: props.color?.a ?? 1
+        });
+      }
+    });
     const dotStyles = computed(() => {
       const {
         x,
@@ -13109,9 +13133,6 @@ const VColorPickerCanvas = defineComponent({
         transform: `translate(${convertToUnit(x - radius)}, ${convertToUnit(y - radius)})`
       };
     });
-    const canvasRef = ref();
-    const canvasWidth = shallowRef(parseFloat(props.width));
-    const canvasHeight = shallowRef(parseFloat(props.height));
     const {
       resizeRef
     } = useResizeObserver(entries => {
@@ -13135,15 +13156,13 @@ const VColorPickerCanvas = defineComponent({
         y: clamp(y - top, 0, height)
       };
     }
-    function handleClick(e) {
-      if (props.disabled || !canvasRef.value) return;
-      updateDotPosition(e.clientX, e.clientY, canvasRef.value.getBoundingClientRect());
-    }
     function handleMouseDown(e) {
-      // To prevent selection while moving cursor
-      e.preventDefault();
+      if (e.type === 'mousedown') {
+        // Prevent text selection while dragging
+        e.preventDefault();
+      }
       if (props.disabled) return;
-      isInteracting.value = true;
+      handleMouseMove(e);
       window.addEventListener('mousemove', handleMouseMove);
       window.addEventListener('mouseup', handleMouseUp);
       window.addEventListener('touchmove', handleMouseMove);
@@ -13161,23 +13180,6 @@ const VColorPickerCanvas = defineComponent({
       window.removeEventListener('touchmove', handleMouseMove);
       window.removeEventListener('touchend', handleMouseUp);
     }
-    watch(dotPosition, () => {
-      if (isOutsideUpdate.value) {
-        isOutsideUpdate.value = false;
-        return;
-      }
-      if (!canvasRef.value) return;
-      const {
-        x,
-        y
-      } = dotPosition.value;
-      emit('update:color', {
-        h: props.color?.h ?? 0,
-        s: clamp(x, 0, canvasWidth.value) / canvasWidth.value,
-        v: 1 - clamp(y, 0, canvasHeight.value) / canvasHeight.value,
-        a: props.color?.a ?? 1
-      });
-    });
     function updateCanvas() {
       if (!canvasRef.value) return;
       const canvas = canvasRef.value;
@@ -13199,7 +13201,7 @@ const VColorPickerCanvas = defineComponent({
     });
     watch(() => [canvasWidth.value, canvasHeight.value], (newVal, oldVal) => {
       updateCanvas();
-      dotPosition.value = {
+      _dotPosition.value = {
         x: dotPosition.value.x * newVal[0] / oldVal[0],
         y: dotPosition.value.y * newVal[1] / oldVal[1]
       };
@@ -13211,8 +13213,7 @@ const VColorPickerCanvas = defineComponent({
         isInteracting.value = false;
         return;
       }
-      isOutsideUpdate.value = true;
-      dotPosition.value = props.color ? {
+      _dotPosition.value = props.color ? {
         x: props.color.s * canvasWidth.value,
         y: (1 - props.color.v) * canvasHeight.value
       } : {
@@ -13228,9 +13229,8 @@ const VColorPickerCanvas = defineComponent({
       "ref": resizeRef,
       "class": ['v-color-picker-canvas', props.class],
       "style": props.style,
-      "onClick": handleClick,
       "onMousedown": handleMouseDown,
-      "onTouchstart": handleMouseDown
+      "onTouchstartPassive": handleMouseDown
     }, [createVNode("canvas", {
       "ref": canvasRef,
       "width": canvasWidth.value,
@@ -14951,24 +14951,13 @@ const VCombobox = genericComponent()({
       filteredItems,
       getMatches
     } = useFilter(props, items, () => isPristine.value ? '' : search.value);
-    const selections = computed(() => {
-      return model.value.map(v => {
-        return items.value.find(item => {
-          const itemRawValue = getPropertyFromItem(item.raw, props.itemValue);
-          const modelRawValue = getPropertyFromItem(v.raw, props.itemValue);
-          if (itemRawValue === undefined || modelRawValue === undefined) return false;
-          return props.returnObject ? props.valueComparator(itemRawValue, modelRawValue) : props.valueComparator(item.value, v.value);
-        }) || v;
-      });
-    });
     const displayItems = computed(() => {
       if (props.hideSelected) {
-        return filteredItems.value.filter(filteredItem => !selections.value.some(s => s.value === filteredItem.value));
+        return filteredItems.value.filter(filteredItem => !model.value.some(s => s.value === filteredItem.value));
       }
       return filteredItems.value;
     });
-    const selected = computed(() => selections.value.map(selection => selection.props.value));
-    const selection = computed(() => selections.value[selectionIndex.value]);
+    const selectedValues = computed(() => model.value.map(selection => selection.value));
     const highlightFirst = computed(() => {
       const selectFirst = props.autoSelectFirst === true || props.autoSelectFirst === 'exact' && search.value === displayItems.value[0]?.title;
       return selectFirst && displayItems.value.length > 0 && !isPristine.value && !listHasFocus.value;
@@ -15000,7 +14989,7 @@ const VCombobox = genericComponent()({
     function onKeydown(e) {
       if (props.readonly || form?.isReadonly.value) return;
       const selectionStart = vTextFieldRef.value.selectionStart;
-      const length = selected.value.length;
+      const length = model.value.length;
       if (selectionIndex.value > -1 || ['Enter', 'ArrowDown', 'ArrowUp'].includes(e.key)) {
         e.preventDefault();
       }
@@ -15028,13 +15017,14 @@ const VCombobox = genericComponent()({
           return;
         }
         const originalSelectionIndex = selectionIndex.value;
-        if (selection.value) select(selection.value);
+        const selectedItem = model.value[selectionIndex.value];
+        if (selectedItem) select(selectedItem);
         selectionIndex.value = originalSelectionIndex >= length - 1 ? length - 2 : originalSelectionIndex;
       }
       if (e.key === 'ArrowLeft') {
         if (selectionIndex.value < 0 && selectionStart > 0) return;
         const prev = selectionIndex.value > -1 ? selectionIndex.value - 1 : length - 1;
-        if (selections.value[prev]) {
+        if (model.value[prev]) {
           selectionIndex.value = prev;
         } else {
           selectionIndex.value = -1;
@@ -15044,7 +15034,7 @@ const VCombobox = genericComponent()({
       if (e.key === 'ArrowRight') {
         if (selectionIndex.value < 0) return;
         const next = selectionIndex.value + 1;
-        if (selections.value[next]) {
+        if (model.value[next]) {
           selectionIndex.value = next;
         } else {
           selectionIndex.value = -1;
@@ -15064,7 +15054,7 @@ const VCombobox = genericComponent()({
     }
     function select(item) {
       if (props.multiple) {
-        const index = selected.value.findIndex(selection => props.valueComparator(selection, item.value));
+        const index = model.value.findIndex(selection => props.valueComparator(selection.value, item.value));
         if (index === -1) {
           model.value = [...model.value, item];
         } else {
@@ -15103,7 +15093,7 @@ const VCombobox = genericComponent()({
       if (val || val === oldVal) return;
       selectionIndex.value = -1;
       menu.value = false;
-      if (highlightFirst.value && !listHasFocus.value && !selections.value.some(_ref2 => {
+      if (highlightFirst.value && !listHasFocus.value && !model.value.some(_ref2 => {
         let {
           value
         } = _ref2;
@@ -15116,8 +15106,8 @@ const VCombobox = genericComponent()({
       }
     });
     watch(menu, () => {
-      if (!props.hideSelected && menu.value && selections.value.length) {
-        const index = displayItems.value.findIndex(item => selections.value.some(s => item.value === s.value));
+      if (!props.hideSelected && menu.value && model.value.length) {
+        const index = displayItems.value.findIndex(item => model.value.some(s => props.valueComparator(s.value, item.value)));
         IN_BROWSER && window.requestAnimationFrame(() => {
           index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
         });
@@ -15168,7 +15158,7 @@ const VCombobox = genericComponent()({
         }, props.menuProps), {
           default: () => [hasList && createVNode(VList, {
             "ref": listRef,
-            "selected": selected.value,
+            "selected": selectedValues.value,
             "selectStrategy": props.multiple ? 'independent' : 'single-independent',
             "onMousedown": e => e.preventDefault(),
             "onKeydown": onListKeydown,
@@ -15222,7 +15212,7 @@ const VCombobox = genericComponent()({
               }
             }), slots['append-item']?.()]
           })]
-        }), selections.value.map((item, index) => {
+        }), model.value.map((item, index) => {
           function onChipClose(e) {
             e.stopPropagation();
             e.preventDefault();
@@ -15266,7 +15256,7 @@ const VCombobox = genericComponent()({
             index
           }) ?? createVNode("span", {
             "class": "v-combobox__selection-text"
-          }, [item.title, props.multiple && index < selections.value.length - 1 && createVNode("span", {
+          }, [item.title, props.multiple && index < model.value.length - 1 && createVNode("span", {
             "class": "v-combobox__selection-comma"
           }, [createTextVNode(",")])])]);
         })]),
@@ -18617,19 +18607,29 @@ const VSwitch = genericComponent()({
             "onBlur": blur
           }, controlAttrs), {
             ...slots,
-            default: () => createVNode("div", {
-              "class": "v-switch__track",
-              "onClick": onTrackClick
-            }, null),
-            input: _ref3 => {
+            default: _ref3 => {
               let {
-                inputNode,
-                icon
+                backgroundColorClasses,
+                backgroundColorStyles
               } = _ref3;
+              return createVNode("div", {
+                "class": ['v-switch__track', ...backgroundColorClasses.value],
+                "style": backgroundColorStyles.value,
+                "onClick": onTrackClick
+              }, null);
+            },
+            input: _ref4 => {
+              let {
+                inputNode,
+                icon,
+                backgroundColorClasses,
+                backgroundColorStyles
+              } = _ref4;
               return createVNode(Fragment, null, [inputNode, createVNode("div", {
                 "class": ['v-switch__thumb', {
                   'v-switch__thumb--filled': icon || props.loading
-                }]
+                }, props.inset ? undefined : backgroundColorClasses.value],
+                "style": props.inset ? undefined : backgroundColorStyles.value
               }, [createVNode(VScaleTransition, null, {
                 default: () => [!props.loading ? icon && createVNode(VIcon, {
                   "key": icon,
@@ -18770,8 +18770,8 @@ const VTab = genericComponent()({
         const delta = prevPos > nextPos ? prevBox[rightBottom] - nextBox[rightBottom] : prevBox[xy] - nextBox[xy];
         const origin = Math.sign(delta) > 0 ? isHorizontal.value ? 'right' : 'bottom' : Math.sign(delta) < 0 ? isHorizontal.value ? 'left' : 'top' : 'center';
         const size = Math.abs(delta) + (Math.sign(delta) < 0 ? prevBox[widthHeight] : nextBox[widthHeight]);
-        const scale = size / Math.max(prevBox[widthHeight], nextBox[widthHeight]);
-        const initialScale = prevBox[widthHeight] / nextBox[widthHeight];
+        const scale = size / Math.max(prevBox[widthHeight], nextBox[widthHeight]) || 0;
+        const initialScale = prevBox[widthHeight] / nextBox[widthHeight] || 0;
         const sigma = 1.5;
         animate(nextEl, {
           backgroundColor: [color, 'currentcolor'],
@@ -18793,11 +18793,10 @@ const VTab = genericComponent()({
         "tabindex": isSelected.value ? 0 : -1,
         "role": "tab",
         "aria-selected": String(isSelected.value),
-        "active": false,
+        "active": false
+      }, btnProps, attrs, {
         "block": props.fixed,
         "maxWidth": props.fixed ? 300 : undefined,
-        "rounded": 0
-      }, btnProps, attrs, {
         "onGroup:selected": updateSlider
       }), {
         default: () => [slots.default?.() ?? props.text, !props.hideSlider && createVNode("div", {
@@ -19167,6 +19166,7 @@ const VTextarea = genericComponent()({
                 once: true
               }]]), props.autoGrow && withDirectives(createVNode("textarea", {
                 "class": [fieldClass, 'v-textarea__sizer'],
+                "id": `${slotProps.id}-sizer`,
                 "onUpdate:modelValue": $event => model.value = $event,
                 "ref": sizerRef,
                 "readonly": true,
@@ -21776,7 +21776,7 @@ const VDataTableServer = genericComponent()({
 const makeVDatePickerControlsProps = propsFactory({
   displayDate: String,
   disabled: {
-    type: [Boolean, String],
+    type: [Boolean, String, Array],
     default: false
   },
   nextIcon: {
@@ -21816,13 +21816,13 @@ const VDatePickerControls = genericComponent()({
       return props.viewMode === 'month' ? props.expandIcon : props.collapseIcon;
     });
     const disableMode = computed(() => {
-      return Array.isArray(props.disabled) ? props.disabled.includes('mode') : props.disabled;
+      return Array.isArray(props.disabled) ? props.disabled.includes('mode') : !!props.disabled;
     });
     const disablePrev = computed(() => {
-      return Array.isArray(props.disabled) ? props.disabled.includes('prev') : props.disabled;
+      return Array.isArray(props.disabled) ? props.disabled.includes('prev') : !!props.disabled;
     });
     const disableNext = computed(() => {
-      return Array.isArray(props.disabled) ? props.disabled.includes('next') : props.disabled;
+      return Array.isArray(props.disabled) ? props.disabled.includes('next') : !!props.disabled;
     });
     function onClickPrev() {
       emit('click:prev');
@@ -22163,6 +22163,7 @@ function isWithinRange(date, range) {
   return isAfter(date, range[0]) && isBefore(date, range[1]);
 }
 function isValid(date) {
+  if (!date || date == null) return false;
   const d = new Date(date);
   return d instanceof Date && !isNaN(d.getTime());
 }
@@ -22194,6 +22195,12 @@ function setYear(date, year) {
   d.setFullYear(year);
   return d;
 }
+function startOfDay(date) {
+  return new Date(date.getFullYear(), date.getMonth(), date.getDate());
+}
+function endOfDay(date) {
+  return new Date(date.getFullYear(), date.getMonth(), date.getDate(), 23, 59, 59, 999);
+}
 class VuetifyDateAdapter {
   constructor(options) {
     this.locale = options.locale;
@@ -22258,6 +22265,12 @@ class VuetifyDateAdapter {
   getMonth(date) {
     return getMonth(date);
   }
+  startOfDay(date) {
+    return startOfDay(date);
+  }
+  endOfDay(date) {
+    return endOfDay(date);
+  }
   startOfYear(date) {
     return startOfYear(date);
   }
@@ -23126,9 +23139,11 @@ const VDatePicker = genericComponent()({
     function updateFromInput(input, index) {
       const {
         isValid,
-        date
+        date,
+        isAfter
       } = adapter;
-      if (isValid(input)) {
+      const inputDate = date(input);
+      if (isValid(input) && (!minDate.value || !isAfter(minDate.value, inputDate)) && (!maxDate.value || !isAfter(inputDate, maxDate.value))) {
         const newModel = model.value.slice();
         newModel[index] = date(input);
         if (props.hideActions) {
@@ -24544,7 +24559,7 @@ function createVuetify$1() {
     date
   };
 }
-const version$1 = "3.3.14";
+const version$1 = "3.3.16";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -24558,7 +24573,7 @@ function inject(key) {
 
 /* eslint-disable local-rules/sort-imports */
 
-const version = "3.3.14";
+const version = "3.3.16";
 
 /* eslint-disable local-rules/sort-imports */