vuetify 3.1.11 → 3.1.12

package/dist/vuetify-labs.esm.js

@@ -1,15 +1,15 @@
 /*!
-* Vuetify v3.1.11
+* Vuetify v3.1.12
 * Forged by John Leider
 * Released under the MIT License.
 */
 
-import { ref, onBeforeUnmount, watch, readonly, reactive, computed, watchEffect, toRefs, capitalize, getCurrentInstance as getCurrentInstance$1, unref, provide, inject as inject$1, onScopeDispose, effectScope, shallowRef, defineComponent as defineComponent$1, camelize, h, onDeactivated, onActivated, onMounted, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, Fragment, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, cloneVNode, warn, toHandlers, Teleport, createTextVNode, onBeforeUpdate, vModelText, onUpdated } from 'vue';
+import { ref, onBeforeUnmount, watch, readonly, reactive, computed, watchEffect, toRefs, capitalize, getCurrentInstance as getCurrentInstance$1, unref, provide, inject as inject$1, onScopeDispose, effectScope, shallowRef, defineComponent as defineComponent$1, camelize, h, onDeactivated, onActivated, onMounted, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, Fragment, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, cloneVNode, warn, toHandlers, Teleport, createTextVNode, onBeforeUpdate, vModelText, withModifiers, onUpdated } from 'vue';
 
 const IN_BROWSER = typeof window !== 'undefined';
 const SUPPORTS_INTERSECTION = IN_BROWSER && 'IntersectionObserver' in window;
 const SUPPORTS_TOUCH = IN_BROWSER && ('ontouchstart' in window || window.navigator.maxTouchPoints > 0);
-const SUPPORTS_FOCUS_VISIBLE = IN_BROWSER && typeof CSS !== 'undefined' && CSS.supports('selector(:focus-visible)');
+const SUPPORTS_FOCUS_VISIBLE = IN_BROWSER && typeof CSS !== 'undefined' && typeof CSS.supports !== 'undefined' && CSS.supports('selector(:focus-visible)');
 
 // Utilities
 function useResizeObserver(callback) {
@@ -5509,7 +5509,11 @@ const VField = genericComponent()({
         "key": "clear"
       }, {
         default: () => [withDirectives(createVNode("div", {
-          "class": "v-field__clearable"
+          "class": "v-field__clearable",
+          "onMousedown": e => {
+            e.preventDefault();
+            e.stopPropagation();
+          }
         }, [slots.clear ? slots.clear() : createVNode(InputIcon, {
           "name": "clear"
         }, null)]), [[vShow, props.dirty]])]
@@ -6015,6 +6019,15 @@ const Refs = Symbol('Forwarded refs');
 
 /** Omit properties starting with P */
 
+function getDescriptor(obj, key) {
+  let currentObj = obj;
+  while (currentObj) {
+    const descriptor = Reflect.getOwnPropertyDescriptor(currentObj, key);
+    if (descriptor) return descriptor;
+    currentObj = Object.getPrototypeOf(currentObj);
+  }
+  return undefined;
+}
 function forwardRefs(target) {
   for (var _len = arguments.length, refs = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
     refs[_key - 1] = arguments[_key];
@@ -6042,30 +6055,18 @@ function forwardRefs(target) {
       // Check each ref's own properties
       for (const ref of refs) {
         if (!ref.value) continue;
-        const descriptor = Reflect.getOwnPropertyDescriptor(ref.value, key);
+        const descriptor = getDescriptor(ref.value, key) ?? ('_' in ref.value ? getDescriptor(ref.value._?.setupState, key) : undefined);
         if (descriptor) return descriptor;
-        if ('_' in ref.value && 'setupState' in ref.value._) {
-          const descriptor = Reflect.getOwnPropertyDescriptor(ref.value._.setupState, key);
-          if (descriptor) return descriptor;
-        }
       }
+
       // Recursive search up each ref's prototype
-      for (const ref of refs) {
-        let obj = ref.value && Object.getPrototypeOf(ref.value);
-        while (obj) {
-          const descriptor = Reflect.getOwnPropertyDescriptor(obj, key);
-          if (descriptor) return descriptor;
-          obj = Object.getPrototypeOf(obj);
-        }
-      }
-      // Call forwarded refs' proxies
       for (const ref of refs) {
         const childRefs = ref.value && ref.value[Refs];
         if (!childRefs) continue;
         const queue = childRefs.slice();
         while (queue.length) {
           const ref = queue.shift();
-          const descriptor = Reflect.getOwnPropertyDescriptor(ref.value, key);
+          const descriptor = getDescriptor(ref.value, key);
           if (descriptor) return descriptor;
           const childRefs = ref.value && ref.value[Refs];
           if (childRefs) queue.push(...childRefs);
@@ -6167,12 +6168,14 @@ const VTextField = genericComponent()({
     }
     function onInput(e) {
       const el = e.target;
-      const caretPosition = [el.selectionStart, el.selectionEnd];
       model.value = el.value;
-      nextTick(() => {
-        el.selectionStart = caretPosition[0];
-        el.selectionEnd = caretPosition[1];
-      });
+      if (['text', 'search', 'password', 'tel', 'url'].includes(props.type)) {
+        const caretPosition = [el.selectionStart, el.selectionEnd];
+        nextTick(() => {
+          el.selectionStart = caretPosition[0];
+          el.selectionEnd = caretPosition[1];
+        });
+      }
     }
     useRender(() => {
       const hasCounter = !!(slots.counter || props.counter || props.counterValue);
@@ -6231,6 +6234,9 @@ const VTextField = genericComponent()({
                   ...slotProps
                 }
               } = _ref3;
+              const placeholder = computed(() => {
+                return (props.persistentPlaceholder || isFocused.value) && !isDirty.value ? props.placeholder : '';
+              });
               const inputNode = withDirectives(createVNode("input", mergeProps({
                 "ref": inputRef,
                 "value": model.value,
@@ -6239,7 +6245,7 @@ const VTextField = genericComponent()({
                 "readonly": isReadonly.value,
                 "disabled": isDisabled.value,
                 "name": props.name,
-                "placeholder": props.placeholder,
+                "placeholder": placeholder.value,
                 "size": 1,
                 "type": props.type,
                 "onFocus": onFocus,
@@ -6586,7 +6592,7 @@ const VCheckbox = genericComponent()({
   inheritAttrs: false,
   props: {
     ...makeVInputProps(),
-    ...makeVCheckboxBtnProps()
+    ...omit(makeVCheckboxBtnProps(), ['inline'])
   },
   emits: {
     'update:focused': focused => true
@@ -13516,6 +13522,7 @@ const VCombobox = genericComponent()({
       }
     });
     const selectionIndex = ref(-1);
+    let cleared = false;
     const color = computed(() => vTextFieldRef.value?.color);
     const {
       items,
@@ -13552,11 +13559,17 @@ const VCombobox = genericComponent()({
           }
         }
         if (!val) selectionIndex.value = -1;
-        if (isFocused.value) menu.value = true;
         isPristine.value = !val;
       }
     });
     watch(_search, value => {
+      if (cleared) {
+        // wait for clear to finish, VTextField sets _search to null
+        // then search computed triggers and updates _search to ''
+        nextTick(() => cleared = false);
+      } else if (isFocused.value && !menu.value) {
+        menu.value = true;
+      }
       emit('update:search', value);
     });
     watch(model, value => {
@@ -13583,6 +13596,7 @@ const VCombobox = genericComponent()({
     const selection = computed(() => selections.value[selectionIndex.value]);
     const listRef = ref();
     function onClear(e) {
+      cleared = true;
       if (props.openOnClear) {
         menu.value = true;
       }
@@ -13915,9 +13929,9 @@ const VDialog = genericComponent()({
       }, overlayProps, {
         "modelValue": isActive.value,
         "onUpdate:modelValue": $event => isActive.value = $event,
-        "aria-role": "dialog",
         "aria-modal": "true",
-        "activatorProps": activatorProps.value
+        "activatorProps": activatorProps.value,
+        "role": "dialog"
       }, scopeId), {
         activator: slots.activator,
         default: function () {
@@ -18792,7 +18806,7 @@ const VDataTableRow = defineComponent({
         if (column.key === 'data-table-select') {
           return slots['item.data-table-select']?.(slotProps) ?? createVNode(VCheckboxBtn, {
             "modelValue": isSelected([item]),
-            "onClick": () => toggleSelect(item)
+            "onClick": withModifiers(() => toggleSelect(item), ['stop'])
           }, null);
         }
         if (column.key === 'data-table-expand') {
@@ -18800,10 +18814,10 @@ const VDataTableRow = defineComponent({
             "icon": isExpanded(item) ? '$collapse' : '$expand',
             "size": "small",
             "variant": "text",
-            "onClick": () => toggleExpand(item)
+            "onClick": withModifiers(() => toggleExpand(item), ['stop'])
           }, null);
         }
-        return item.columns[column.key];
+        return getPropertyFromItem(item.columns, column.key);
       }
     }))]));
   }
@@ -19132,6 +19146,19 @@ const makeDataTableItemProps = propsFactory({
     itemValue: 'id'
   })
 }, 'v-data-table-item');
+function add(obj, key, value) {
+  const path = key.split('.');
+  while (path.length > 1) {
+    const part = path.shift();
+    if (obj[part] == null) {
+      obj[part] = {};
+    }
+    if (typeof obj[part] === 'object') {
+      obj = obj[part];
+    }
+  }
+  obj[path[0]] = value;
+}
 function useDataTableItems(props, columns) {
   const {
     items
@@ -19141,7 +19168,7 @@ function useDataTableItems(props, columns) {
       ...item,
       type: 'item',
       columns: columns.value.reduce((obj, column) => {
-        obj[column.key] = getPropertyFromItem(item.raw, column.value ?? column.key);
+        add(obj, column.key, getPropertyFromItem(item.raw, column.value ?? column.key));
         return obj;
       }, {})
     };
@@ -19679,7 +19706,9 @@ const VDataTableServer = genericComponent()({
       "height": props.height
     }, {
       top: slots.top,
-      default: slots.default ?? (() => createVNode(Fragment, null, [createVNode("thead", {
+      default: slots.default ?? (() => createVNode(Fragment, null, [slots.colgroup?.({
+        columns
+      }), createVNode("thead", {
         "class": "v-data-table__thead",
         "role": "rowgroup"
       }, [slots.headers ? slots.headers() : createVNode(VDataTableHeaders, {
@@ -20222,7 +20251,7 @@ function createVuetify$1() {
     locale
   };
 }
-const version$1 = "3.1.11";
+const version$1 = "3.1.12";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -20234,7 +20263,7 @@ function inject(key) {
   }
 }
 
-const version = "3.1.11";
+const version = "3.1.12";
 
 const createVuetify = function () {
   let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};