vuetify 3.1.14 → 3.1.15

package/dist/vuetify-labs.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.1.14
+* Vuetify v3.1.15
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -5297,7 +5297,8 @@
 
   // Composables
   const makeFocusProps = propsFactory({
-    focused: Boolean
+    focused: Boolean,
+    'onUpdate:focused': EventProp()
   }, 'focus');
   function useFocus(props) {
     let name = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstanceName();
@@ -5886,6 +5887,8 @@
     appendIcon: IconValue,
     prependIcon: IconValue,
     hideDetails: [Boolean, String],
+    hint: String,
+    persistentHint: Boolean,
     messages: {
       type: [Array, String],
       default: () => []
@@ -5949,10 +5952,19 @@
         resetValidation,
         validate
       }));
+      const messages = vue.computed(() => {
+        if (errorMessages.value.length > 0) {
+          return errorMessages.value;
+        } else if (props.hint && (props.persistentHint || props.focused)) {
+          return props.hint;
+        } else {
+          return props.messages;
+        }
+      });
       useRender(() => {
         const hasPrepend = !!(slots.prepend || props.prependIcon);
         const hasAppend = !!(slots.append || props.appendIcon);
-        const hasMessages = !!(props.messages?.length || errorMessages.value.length);
+        const hasMessages = messages.value.length > 0;
         const hasDetails = !props.hideDetails || props.hideDetails === 'auto' && (hasMessages || !!slots.details);
         return vue.createVNode("div", {
           "class": ['v-input', `v-input--${props.direction}`, densityClasses.value, validationClasses.value]
@@ -5975,7 +5987,7 @@
         }, [vue.createVNode(VMessages, {
           "id": messagesId.value,
           "active": hasMessages,
-          "messages": errorMessages.value.length > 0 ? errorMessages.value : props.messages
+          "messages": messages.value
         }, {
           message: slots.message
         }), slots.details?.(slotProps.value)])]);
@@ -5987,10 +5999,6 @@
       };
     }
   });
-  function filterInputProps(props) {
-    const keys = Object.keys(VInput.props).filter(k => !isOn(k));
-    return pick(props, keys);
-  }
 
   const VCounter = genericComponent()({
     name: 'VCounter',
@@ -6116,8 +6124,6 @@
     autofocus: Boolean,
     counter: [Boolean, Number, String],
     counterValue: Function,
-    hint: String,
-    persistentHint: Boolean,
     prefix: String,
     placeholder: String,
     persistentPlaceholder: Boolean,
@@ -6172,9 +6178,6 @@
       const vFieldRef = vue.ref();
       const inputRef = vue.ref();
       const isActive = vue.computed(() => activeTypes.includes(props.type) || props.persistentPlaceholder || isFocused.value);
-      const messages = vue.computed(() => {
-        return props.messages.length ? props.messages : isFocused.value || props.persistentHint ? props.hint : '';
-      });
       function onFocus() {
         if (inputRef.value !== document.activeElement) {
           inputRef.value?.focus();
@@ -6217,7 +6220,7 @@
         const [{
           modelValue: _,
           ...inputProps
-        }] = filterInputProps(props);
+        }] = VInput.filterProps(props);
         const [fieldProps] = filterFieldProps(props);
         return vue.createVNode(VInput, vue.mergeProps({
           "ref": vInputRef,
@@ -6227,12 +6230,9 @@
             'v-text-field--prefixed': props.prefix,
             'v-text-field--suffixed': props.suffix,
             'v-text-field--flush-details': ['plain', 'underlined'].includes(props.variant)
-          }],
-          "onClick:prepend": props['onClick:prepend'],
-          "onClick:append": props['onClick:append']
+          }]
         }, rootAttrs, inputProps, {
-          "focused": isFocused.value,
-          "messages": messages.value
+          "focused": isFocused.value
         }), {
           ...slots,
           default: _ref2 => {
@@ -6641,7 +6641,7 @@
       const id = vue.computed(() => props.id || `checkbox-${uid}`);
       useRender(() => {
         const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
-        const [inputProps, _1] = filterInputProps(props);
+        const [inputProps, _1] = VInput.filterProps(props);
         const [checkboxProps, _2] = VCheckboxBtn.filterProps(props);
         return vue.createVNode(VInput, vue.mergeProps({
           "class": "v-checkbox"
@@ -8053,7 +8053,12 @@
   function useItems(props) {
     const items = vue.computed(() => transformItems$1(props, props.items));
     function transformIn(value) {
-      return value.map(item => transformItem$1(props, item));
+      return value.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 ?? transformItem$1(props, v);
+      });
     }
     function transformOut(value) {
       return value.map(_ref => {
@@ -8731,7 +8736,7 @@
   }
 
   /** Get size of element ignoring max-width/max-height */
-  function getIntrinsicSize(el) {
+  function getIntrinsicSize(el, isRtl) {
     // const scrollables = new Map<Element, [number, number]>()
     // el.querySelectorAll('*').forEach(el => {
     //   const x = el.scrollLeft
@@ -8748,7 +8753,11 @@
 
     /* eslint-disable-next-line sonarjs/prefer-immediate-return */
     const contentBox = nullifyTransforms(el);
-    contentBox.x -= parseFloat(el.style.left || 0);
+    if (isRtl) {
+      contentBox.x += parseFloat(el.style.right || 0);
+    } else {
+      contentBox.x -= parseFloat(el.style.left || 0);
+    }
     contentBox.y -= parseFloat(el.style.top || 0);
 
     // el.style.maxWidth = initialMaxWidth
@@ -8829,7 +8838,7 @@
       });
       if (!data.activatorEl.value || !data.contentEl.value) return;
       const targetBox = data.activatorEl.value.getBoundingClientRect();
-      const contentBox = getIntrinsicSize(data.contentEl.value);
+      const contentBox = getIntrinsicSize(data.contentEl.value, data.isRtl.value);
       const scrollParents = getScrollParents(data.contentEl.value);
       const viewportMargin = 12;
       if (!scrollParents.length) {
@@ -9005,7 +9014,8 @@
         transformOrigin: `${placement.origin.side} ${placement.origin.align}`,
         // transform: `translate(${pixelRound(x)}px, ${pixelRound(y)}px)`,
         top: convertToUnit(pixelRound(y)),
-        left: convertToUnit(pixelRound(x)),
+        left: data.isRtl.value ? undefined : convertToUnit(pixelRound(x)),
+        right: data.isRtl.value ? convertToUnit(pixelRound(-x)) : undefined,
         minWidth: convertToUnit(axis === 'y' ? Math.min(minWidth.value, targetBox.width) : minWidth.value),
         maxWidth: convertToUnit(pixelCeil(clamp(available.x, minWidth.value === Infinity ? 0 : minWidth.value, maxWidth.value))),
         maxHeight: convertToUnit(pixelCeil(clamp(available.y, minHeight.value === Infinity ? 0 : minHeight.value, maxHeight.value)))
@@ -9900,6 +9910,7 @@
       })
     },
     emits: {
+      'update:focused': focused => true,
       'update:modelValue': val => true,
       'update:menu': val => true
     },
@@ -10016,6 +10027,9 @@
           menu.value = false;
         }
       }
+      function onFocusin(e) {
+        isFocused.value = true;
+      }
       function onFocusout(e) {
         if (e.relatedTarget == null) {
           vTextFieldRef.value?.focus();
@@ -10070,6 +10084,7 @@
               "selected": selected.value,
               "selectStrategy": props.multiple ? 'independent' : 'single-independent',
               "onMousedown": e => e.preventDefault(),
+              "onFocusin": onFocusin,
               "onFocusout": onFocusout
             }, {
               default: () => [!displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? vue.createVNode(VListItem, {
@@ -10148,6 +10163,7 @@
         });
       });
       return forwardRefs({
+        isFocused,
         menu,
         select
       }, vTextFieldRef);
@@ -10286,6 +10302,7 @@
       })
     },
     emits: {
+      'update:focused': focused => true,
       'update:search': val => true,
       'update:modelValue': val => true,
       'update:menu': val => true
@@ -10309,11 +10326,17 @@
           _menu.value = v;
         }
       });
+      const selectionIndex = vue.ref(-1);
+      const color = vue.computed(() => vTextFieldRef.value?.color);
       const {
         items,
         transformIn,
         transformOut
       } = useItems(props);
+      const {
+        textColorClasses,
+        textColorStyles
+      } = useTextColor(color);
       const search = useProxiedModel(props, 'search', '');
       const model = useProxiedModel(props, 'modelValue', [], v => transformIn(wrapInArray(v)), v => {
         const transformed = transformOut(v);
@@ -10336,6 +10359,7 @@
         return filteredItems.value;
       });
       const selected = vue.computed(() => selections.value.map(selection => selection.props.value));
+      const selection = vue.computed(() => selections.value[selectionIndex.value]);
       const listRef = vue.ref();
       function onClear(e) {
         if (props.openOnClear) {
@@ -10349,7 +10373,9 @@
       }
       function onKeydown(e) {
         if (props.readonly || form?.isReadonly.value) return;
-        if (['Enter', 'ArrowDown', 'ArrowUp'].includes(e.key)) {
+        const selectionStart = vTextFieldRef.value.selectionStart;
+        const length = selected.value.length;
+        if (selectionIndex.value > -1 || ['Enter', 'ArrowDown', 'ArrowUp'].includes(e.key)) {
           e.preventDefault();
         }
         if (['Enter', 'ArrowDown'].includes(e.key)) {
@@ -10366,6 +10392,38 @@
         } else if (e.key === 'ArrowUp') {
           listRef.value?.focus('prev');
         }
+        if (!props.multiple) return;
+        if (['Backspace', 'Delete'].includes(e.key)) {
+          if (selectionIndex.value < 0) {
+            if (e.key === 'Backspace' && !search.value) {
+              selectionIndex.value = length - 1;
+            }
+            return;
+          }
+          const originalSelectionIndex = selectionIndex.value;
+          if (selection.value) select(selection.value);
+          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]) {
+            selectionIndex.value = prev;
+          } else {
+            selectionIndex.value = -1;
+            vTextFieldRef.value.setSelectionRange(search.value?.length, search.value?.length);
+          }
+        }
+        if (e.key === 'ArrowRight') {
+          if (selectionIndex.value < 0) return;
+          const next = selectionIndex.value + 1;
+          if (selections.value[next]) {
+            selectionIndex.value = next;
+          } else {
+            selectionIndex.value = -1;
+            vTextFieldRef.value.setSelectionRange(0, 0);
+          }
+        }
       }
       function onInput(e) {
         search.value = e.target.value;
@@ -10387,7 +10445,6 @@
           const index = selected.value.findIndex(selection => props.valueComparator(selection, item.value));
           if (index === -1) {
             model.value = [...model.value, item];
-            search.value = '';
           } else {
             const value = [...model.value];
             value.splice(index, 1);
@@ -10432,12 +10489,15 @@
           "onUpdate:modelValue": v => {
             if (v == null) model.value = [];
           },
+          "focused": isFocused.value,
+          "onUpdate:focused": $event => isFocused.value = $event,
           "validationValue": model.externalValue,
           "dirty": isDirty,
           "onInput": onInput,
           "class": ['v-autocomplete', {
             'v-autocomplete--active-menu': menu.value,
             'v-autocomplete--chips': !!props.chips,
+            'v-autocomplete--selecting-index': selectionIndex.value > -1,
             [`v-autocomplete--${props.multiple ? 'multiple' : 'single'}`]: true,
             'v-autocomplete--selection-slot': !!slots.selection
           }],
@@ -10446,8 +10506,6 @@
           "placeholder": isDirty ? undefined : props.placeholder,
           "onClick:clear": onClear,
           "onMousedown:control": onMousedownControl,
-          "onFocus": () => isFocused.value = true,
-          "onBlur": () => isFocused.value = false,
           "onKeydown": onKeydown
         }), {
           ...slots,
@@ -10512,7 +10570,8 @@
             };
             return vue.createVNode("div", {
               "key": item.value,
-              "class": "v-autocomplete__selection"
+              "class": ['v-autocomplete__selection', index === selectionIndex.value && ['v-autocomplete__selection--selected', textColorClasses.value]],
+              "style": index === selectionIndex.value ? textColorStyles.value : {}
             }, [hasChips ? !slots.chip ? vue.createVNode(VChip, vue.mergeProps({
               "key": "chip",
               "closable": props.closableChips,
@@ -12907,7 +12966,7 @@
       } = useFocus(props);
       const trackStop = vue.computed(() => position(model.value));
       useRender(() => {
-        const [inputProps, _] = filterInputProps(props);
+        const [inputProps, _] = VInput.filterProps(props);
         const hasPrepend = !!(props.label || slots.label || slots.prepend);
         return vue.createVNode(VInput, vue.mergeProps({
           "class": ['v-slider', {
@@ -13571,6 +13630,7 @@
       })
     },
     emits: {
+      'update:focused': focused => true,
       'update:modelValue': val => true,
       'update:search': val => true,
       'update:menu': val => true
@@ -13708,8 +13768,9 @@
             }
             return;
           }
-          select(selection.value);
-          vue.nextTick(() => !selection.value && (selectionIndex.value = length - 2));
+          const originalSelectionIndex = selectionIndex.value;
+          if (selection.value) select(selection.value);
+          selectionIndex.value = originalSelectionIndex >= length - 1 ? length - 2 : originalSelectionIndex;
         }
         if (e.key === 'ArrowLeft') {
           if (selectionIndex.value < 0 && selectionStart > 0) return;
@@ -13794,6 +13855,8 @@
           "onUpdate:modelValue": [$event => search.value = $event, v => {
             if (v == null) model.value = [];
           }],
+          "focused": isFocused.value,
+          "onUpdate:focused": $event => isFocused.value = $event,
           "validationValue": model.externalValue,
           "dirty": isDirty,
           "class": ['v-combobox', {
@@ -13807,8 +13870,6 @@
           "placeholder": isDirty ? undefined : props.placeholder,
           "onClick:clear": onClear,
           "onMousedown:control": onMousedownControl,
-          "onFocus": () => isFocused.value = true,
-          "onBlur": () => isFocused.value = false,
           "onKeydown": onKeydown
         }), {
           ...slots,
@@ -14260,8 +14321,6 @@
         default: '$vuetify.fileInput.counter'
       },
       multiple: Boolean,
-      hint: String,
-      persistentHint: Boolean,
       showSize: {
         type: [Boolean, Number],
         default: false,
@@ -14286,6 +14345,7 @@
     emits: {
       'click:control': e => true,
       'mousedown:control': e => true,
+      'update:focused': focused => true,
       'update:modelValue': files => true
     },
     setup(props, _ref) {
@@ -14298,6 +14358,11 @@
         t
       } = useLocale();
       const model = useProxiedModel(props, 'modelValue');
+      const {
+        isFocused,
+        focus,
+        blur
+      } = useFocus(props);
       const base = vue.computed(() => typeof props.showSize !== 'boolean' ? props.showSize : undefined);
       const totalBytes = vue.computed(() => (model.value ?? []).reduce((bytes, _ref2) => {
         let {
@@ -14319,21 +14384,14 @@
       });
       const vInputRef = vue.ref();
       const vFieldRef = vue.ref();
-      const isFocused = vue.ref(false);
       const inputRef = vue.ref();
-      const messages = vue.computed(() => {
-        return props.messages.length ? props.messages : props.persistentHint ? props.hint : '';
-      });
       function onFocus() {
         if (inputRef.value !== document.activeElement) {
           inputRef.value?.focus();
         }
-        if (!isFocused.value) {
-          isFocused.value = true;
-        }
+        if (!isFocused.value) focus();
       }
       function onClickPrepend(e) {
-        callEvent(props['onClick:prepend'], e);
         onControlClick(e);
       }
       function onControlMousedown(e) {
@@ -14364,18 +14422,16 @@
         const [{
           modelValue: _,
           ...inputProps
-        }] = filterInputProps(props);
+        }] = VInput.filterProps(props);
         const [fieldProps] = filterFieldProps(props);
         return vue.createVNode(VInput, vue.mergeProps({
           "ref": vInputRef,
           "modelValue": model.value,
           "onUpdate:modelValue": $event => model.value = $event,
           "class": "v-file-input",
-          "onClick:prepend": onClickPrepend,
-          "onClick:append": props['onClick:append']
+          "onClick:prepend": onClickPrepend
         }, rootAttrs, inputProps, {
-          "focused": isFocused.value,
-          "messages": messages.value
+          "focused": isFocused.value
         }), {
           ...slots,
           default: _ref3 => {
@@ -14427,7 +14483,7 @@
                     model.value = [...(target.files ?? [])];
                   },
                   "onFocus": onFocus,
-                  "onBlur": () => isFocused.value = false
+                  "onBlur": blur
                 }, slotProps, inputAttrs), null), vue.createVNode("div", {
                   "class": fieldClass
                 }, [!!model.value?.length && (slots.selection ? slots.selection({
@@ -16122,7 +16178,7 @@
       const model = useProxiedModel(props, 'modelValue');
       useRender(() => {
         const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
-        const [inputProps, _1] = filterInputProps(props);
+        const [inputProps, _1] = VInput.filterProps(props);
         const [controlProps, _2] = VSelectionControl.filterProps(props);
         const label = slots.label ? slots.label({
           label: props.label,
@@ -16250,7 +16306,7 @@
       const trackStart = vue.computed(() => position(model.value[0]));
       const trackStop = vue.computed(() => position(model.value[1]));
       useRender(() => {
-        const [inputProps, _] = filterInputProps(props);
+        const [inputProps, _] = VInput.filterProps(props);
         const hasPrepend = !!(props.label || slots.label || slots.prepend);
         return vue.createVNode(VInput, vue.mergeProps({
           "class": ['v-slider', 'v-range-slider', {
@@ -17124,10 +17180,12 @@
       }
       useRender(() => {
         const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
-        const [inputProps, _1] = filterInputProps(props);
+        const [inputProps, _1] = VInput.filterProps(props);
         const [controlProps, _2] = VSelectionControl.filterProps(props);
         const control = vue.ref();
-        function onClick() {
+        function onClick(e) {
+          e.stopPropagation();
+          e.preventDefault();
           control.value?.input?.click();
         }
         return vue.createVNode(VInput, vue.mergeProps({
@@ -17489,8 +17547,6 @@
       autofocus: Boolean,
       counter: [Boolean, Number, String],
       counterValue: Function,
-      hint: String,
-      persistentHint: Boolean,
       prefix: String,
       placeholder: String,
       persistentPlaceholder: Boolean,
@@ -17545,9 +17601,6 @@
       const controlHeight = vue.ref('');
       const textareaRef = vue.ref();
       const isActive = vue.computed(() => isFocused.value || props.persistentPlaceholder);
-      const messages = vue.computed(() => {
-        return props.messages.length ? props.messages : isFocused.value || props.persistentHint ? props.hint : '';
-      });
       function onFocus() {
         if (textareaRef.value !== document.activeElement) {
           textareaRef.value?.focus();
@@ -17619,7 +17672,7 @@
         const [{
           modelValue: _,
           ...inputProps
-        }] = filterInputProps(props);
+        }] = VInput.filterProps(props);
         const [fieldProps] = filterFieldProps(props);
         return vue.createVNode(VInput, vue.mergeProps({
           "ref": vInputRef,
@@ -17633,12 +17686,9 @@
             'v-textarea--auto-grow': props.autoGrow,
             'v-textarea--no-resize': props.noResize || props.autoGrow,
             'v-text-field--flush-details': ['plain', 'underlined'].includes(props.variant)
-          }],
-          "onClick:prepend": props['onClick:prepend'],
-          "onClick:append": props['onClick:append']
+          }]
         }, rootAttrs, inputProps, {
-          "focused": isFocused.value,
-          "messages": messages.value
+          "focused": isFocused.value
         }), {
           ...slots,
           default: _ref2 => {
@@ -18949,56 +18999,64 @@
       const {
         t
       } = useLocale();
-      useRender(() => vue.createVNode(vue.Fragment, null, [props.loading ? slots.loading?.() ?? vue.createVNode(VDataTableRow, {
-        "class": "v-data-table-rows-no-data",
-        "key": "loading"
-      }, {
-        default: () => [t(props.loadingText)]
-      }) : undefined, !props.loading && !props.items.length && !props.hideNoData && (slots['no-data']?.() ?? vue.createVNode(VDataTableRow, {
-        "class": "v-data-table-rows-no-data",
-        "key": "no-data"
-      }, {
-        default: () => [t(props.noDataText)]
-      })), props.items.map((item, index) => {
-        if (item.type === 'group-header') {
-          return slots['group-header'] ? slots['group-header']({
+      useRender(() => {
+        if (props.loading && slots.loading) {
+          return vue.createVNode("tr", {
+            "class": "v-data-table-rows-no-data",
+            "key": "loading"
+          }, [vue.createVNode("td", {
+            "colspan": columns.value.length
+          }, [slots.loading()])]);
+        }
+        if (!props.loading && !props.items.length && !props.hideNoData && slots['no-data']) {
+          return vue.createVNode("tr", {
+            "class": "v-data-table-rows-no-data",
+            "key": "no-data"
+          }, [vue.createVNode("td", {
+            "colspan": columns.value.length
+          }, [slots['no-data']?.() ?? t(props.noDataText)])]);
+        }
+        return vue.createVNode(vue.Fragment, null, [props.items.map((item, index) => {
+          if (item.type === 'group-header') {
+            return slots['group-header'] ? slots['group-header']({
+              index,
+              item,
+              columns: columns.value,
+              isExpanded,
+              toggleExpand,
+              isSelected,
+              toggleSelect,
+              toggleGroup,
+              isGroupOpen
+            }) : vue.createVNode(VDataTableGroupHeaderRow, {
+              "key": `group-header_${item.id}`,
+              "item": item
+            }, slots);
+          }
+          const slotProps = {
             index,
             item,
             columns: columns.value,
             isExpanded,
             toggleExpand,
             isSelected,
-            toggleSelect,
-            toggleGroup,
-            isGroupOpen
-          }) : vue.createVNode(VDataTableGroupHeaderRow, {
-            "key": `group-header_${item.id}`,
+            toggleSelect
+          };
+          return vue.createVNode(vue.Fragment, null, [slots.item ? slots.item(slotProps) : vue.createVNode(VDataTableRow, {
+            "key": `item_${item.value}`,
+            "onClick": expandOnClick.value || props['onClick:row'] ? event => {
+              if (expandOnClick.value) {
+                toggleExpand(item);
+              }
+              props['onClick:row']?.(event, {
+                item
+              });
+            } : undefined,
+            "index": index,
             "item": item
-          }, slots);
-        }
-        const slotProps = {
-          index,
-          item,
-          columns: columns.value,
-          isExpanded,
-          toggleExpand,
-          isSelected,
-          toggleSelect
-        };
-        return vue.createVNode(vue.Fragment, null, [slots.item ? slots.item(slotProps) : vue.createVNode(VDataTableRow, {
-          "key": `item_${item.value}`,
-          "onClick": expandOnClick.value || props['onClick:row'] ? event => {
-            if (expandOnClick.value) {
-              toggleExpand(item);
-            }
-            props['onClick:row']?.(event, {
-              item
-            });
-          } : undefined,
-          "index": index,
-          "item": item
-        }, slots), isExpanded(item) && slots['expanded-row']?.(slotProps)]);
-      })]));
+          }, slots), isExpanded(item) && slots['expanded-row']?.(slotProps)]);
+        })]);
+      });
       return {};
     }
   });
@@ -19273,7 +19331,8 @@
       page: page.value,
       itemsPerPage: itemsPerPage.value,
       sortBy: sortBy.value,
-      groupBy: groupBy.value
+      groupBy: groupBy.value,
+      search: search.value
     }));
 
     // Reset page when searching
@@ -19306,12 +19365,12 @@
     width: [String, Number],
     fixedHeader: Boolean,
     fixedFooter: Boolean,
-    'onClick:row': Function
+    'onClick:row': Function,
+    search: String
   }, 'v-data-table');
   const VDataTable = genericComponent()({
     name: 'VDataTable',
     props: {
-      search: String,
       ...makeVDataTableProps(),
       ...makeDataTableExpandProps(),
       ...makeDataTableGroupProps(),
@@ -19526,7 +19585,6 @@
   const VDataTableVirtual = genericComponent()({
     name: 'VDataTableVirtual',
     props: {
-      search: String,
       ...makeVDataTableProps(),
       ...makeVDataTableProps(),
       ...makeDataTableGroupProps(),
@@ -19765,7 +19823,8 @@
         page,
         itemsPerPage,
         sortBy,
-        groupBy
+        groupBy,
+        search: vue.toRef(props, 'search')
       });
       vue.provide('v-data-table', {
         toggleSort,
@@ -19825,6 +19884,7 @@
     'date-picker': 'list-item, heading, divider, date-picker-options, date-picker-days, actions',
     'date-picker-options': 'text, avatar@2',
     'date-picker-days': 'avatar@28',
+    divider: 'divider',
     heading: 'heading',
     image: 'image',
     'list-item': 'text',
@@ -20466,7 +20526,7 @@
       locale
     };
   }
-  const version$1 = "3.1.14";
+  const version$1 = "3.1.15";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -20478,7 +20538,7 @@
     }
   }
 
-  const version = "3.1.14";
+  const version = "3.1.15";
 
   const createVuetify = function () {
     let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};