vuetify 3.9.3 → 3.9.5

package/dist/vuetify.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.9.3
+* Vuetify v3.9.5
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -1609,7 +1609,9 @@ function getScrollParents(el, stopAt) {
 function hasScrollbar(el) {
   if (!el || el.nodeType !== Node.ELEMENT_NODE) return false;
   const style = window.getComputedStyle(el);
-  return style.overflowY === 'scroll' || style.overflowY === 'auto' && el.scrollHeight > el.clientHeight;
+  const hasVerticalScrollbar = style.overflowY === 'scroll' || style.overflowY === 'auto' && el.scrollHeight > el.clientHeight;
+  const hasHorizontalScrollbar = style.overflowX === 'scroll' || style.overflowX === 'auto' && el.scrollWidth > el.clientWidth;
+  return hasVerticalScrollbar || hasHorizontalScrollbar;
 }
 function isPotentiallyScrollable(el) {
   if (!el || el.nodeType !== Node.ELEMENT_NODE) return false;
@@ -2721,6 +2723,23 @@ var en = {
     unmute: 'Unmute',
     enterFullscreen: 'Full screen',
     exitFullscreen: 'Exit full screen'
+  },
+  colorPicker: {
+    ariaLabel: {
+      eyedropper: 'Select color with eyedropper',
+      hueSlider: 'Hue',
+      alphaSlider: 'Alpha',
+      redInput: 'Red value',
+      greenInput: 'Green value',
+      blueInput: 'Blue value',
+      alphaInput: 'Alpha value',
+      hueInput: 'Hue value',
+      saturationInput: 'Saturation value',
+      lightnessInput: 'Lightness value',
+      hexInput: 'HEX value',
+      hexaInput: 'HEX with alpha value',
+      changeFormat: 'Change color format'
+    }
   }
 };
 
@@ -3319,9 +3338,7 @@ function useTheme() {
 
 const makeVAppProps = propsFactory({
   ...makeComponentProps(),
-  ...makeLayoutProps({
-    fullHeight: true
-  }),
+  ...omit(makeLayoutProps(), ['fullHeight']),
   ...makeThemeProps()
 }, 'VApp');
 const VApp = genericComponent()({
@@ -3337,7 +3354,10 @@ const VApp = genericComponent()({
       getLayoutItem,
       items,
       layoutRef
-    } = createLayout(props);
+    } = createLayout({
+      ...props,
+      fullHeight: true
+    });
     const {
       rtlClasses
     } = useRtl();
@@ -6482,7 +6502,7 @@ const VAlert = genericComponent()({
     });
     const {
       iconSize
-    } = useIconSizes(props, () => props.prominent ? 44 : 28);
+    } = useIconSizes(props, () => props.prominent ? 44 : undefined);
     const {
       themeClasses
     } = provideTheme(props);
@@ -6533,7 +6553,7 @@ const VAlert = genericComponent()({
       const iconProps = {
         density: props.density,
         icon: icon.value,
-        size: iconSize.value
+        size: props.iconSize || props.prominent ? iconSize.value : undefined
       };
       return isActive.value && createVNode(props.tag, {
         "class": normalizeClass(['v-alert', props.border && {
@@ -7316,9 +7336,14 @@ function useForm(props) {
 // Utilities
 const RulesSymbol = Symbol.for('vuetify:rules');
 function useRules(fn) {
-  const resolveRules = inject$1(RulesSymbol, null);
-  if (!resolveRules) return toRef(fn);
-  return resolveRules(fn);
+  const rules = inject$1(RulesSymbol, null);
+  if (!fn) {
+    if (!rules) {
+      throw new Error('Could not find Vuetify rules injection');
+    }
+    return rules.aliases;
+  }
+  return rules?.resolve(fn) ?? toRef(fn);
 }
 
 // Composables
@@ -11144,11 +11169,11 @@ function closeScrollStrategy(data) {
   function onScroll(e) {
     data.isActive.value = false;
   }
-  bindScroll(data.target.value ?? data.contentEl.value, onScroll);
+  bindScroll(getTargetEl(data.target.value, data.contentEl.value), onScroll);
 }
 function blockScrollStrategy(data, props) {
   const offsetParent = data.root.value?.offsetParent;
-  const target = Array.isArray(data.target.value) ? document.elementFromPoint(...data.target.value) : data.target.value;
+  const target = getTargetEl(data.target.value, data.contentEl.value);
   const scrollElements = [...new Set([...getScrollParents(target, props.contained ? offsetParent : undefined), ...getScrollParents(data.contentEl.value, props.contained ? offsetParent : undefined)])].filter(el => !el.classList.contains('v-overlay-scroll-blocked'));
   const scrollbarWidth = window.innerWidth - document.documentElement.offsetWidth;
   const scrollableParent = (el => hasScrollbar(el) && el)(offsetParent || document.documentElement);
@@ -11196,7 +11221,7 @@ function repositionScrollStrategy(data, props, scope) {
   }
   ric = (typeof requestIdleCallback === 'undefined' ? cb => cb() : requestIdleCallback)(() => {
     scope.run(() => {
-      bindScroll(data.target.value ?? data.contentEl.value, e => {
+      bindScroll(getTargetEl(data.target.value, data.contentEl.value), e => {
         if (slow) {
           // If the position calculation is slow,
           // defer updates until scrolling is finished.
@@ -11219,10 +11244,10 @@ function repositionScrollStrategy(data, props, scope) {
     cancelAnimationFrame(raf);
   });
 }
-
-/** @private */
-function bindScroll(target, onScroll) {
-  const el = Array.isArray(target) ? document.elementFromPoint(...target) : target;
+function getTargetEl(target, contentEl) {
+  return Array.isArray(target) ? document.elementsFromPoint(...target).find(el => !contentEl?.contains(el)) : target ?? contentEl;
+}
+function bindScroll(el, onScroll) {
   const scrollElements = [document, ...getScrollParents(el)];
   scrollElements.forEach(el => {
     el.addEventListener('scroll', onScroll, {
@@ -12784,6 +12809,7 @@ const VTextField = genericComponent()({
                 "name": props.name,
                 "placeholder": props.placeholder,
                 "size": 1,
+                "role": props.role,
                 "type": props.type,
                 "onFocus": focus,
                 "onBlur": blur
@@ -13559,7 +13585,7 @@ const VSelect = genericComponent()({
       return createVNode(VTextField, mergeProps({
         "ref": vTextFieldRef
       }, textFieldProps, {
-        "modelValue": model.value.map(v => v.props.value).join(', '),
+        "modelValue": model.value.map(v => v.props.title).join(', '),
         "onUpdate:modelValue": onModelUpdate,
         "focused": isFocused.value,
         "onUpdate:focused": $event => isFocused.value = $event,
@@ -16218,7 +16244,8 @@ const rgba = {
     getColor: (c, v) => ({
       ...c,
       r: Number(v)
-    })
+    }),
+    localeKey: 'redInput'
   }, {
     label: 'G',
     max: 255,
@@ -16227,7 +16254,8 @@ const rgba = {
     getColor: (c, v) => ({
       ...c,
       g: Number(v)
-    })
+    }),
+    localeKey: 'greenInput'
   }, {
     label: 'B',
     max: 255,
@@ -16236,7 +16264,8 @@ const rgba = {
     getColor: (c, v) => ({
       ...c,
       b: Number(v)
-    })
+    }),
+    localeKey: 'blueInput'
   }, {
     label: 'A',
     max: 1,
@@ -16250,7 +16279,8 @@ const rgba = {
     getColor: (c, v) => ({
       ...c,
       a: Number(v)
-    })
+    }),
+    localeKey: 'alphaInput'
   }],
   to: HSVtoRGB,
   from: RGBtoHSV
@@ -16272,7 +16302,8 @@ const hsla = {
     getColor: (c, v) => ({
       ...c,
       h: Number(v)
-    })
+    }),
+    localeKey: 'hueInput'
   }, {
     label: 'S',
     max: 1,
@@ -16281,7 +16312,8 @@ const hsla = {
     getColor: (c, v) => ({
       ...c,
       s: Number(v)
-    })
+    }),
+    localeKey: 'saturationInput'
   }, {
     label: 'L',
     max: 1,
@@ -16290,7 +16322,8 @@ const hsla = {
     getColor: (c, v) => ({
       ...c,
       l: Number(v)
-    })
+    }),
+    localeKey: 'lightnessInput'
   }, {
     label: 'A',
     max: 1,
@@ -16304,7 +16337,8 @@ const hsla = {
     getColor: (c, v) => ({
       ...c,
       a: Number(v)
-    })
+    }),
+    localeKey: 'alphaInput'
   }],
   to: HSVtoHSL,
   from: HSLtoHSV
@@ -16320,7 +16354,8 @@ const hexa = {
   inputs: [{
     label: 'HEXA',
     getValue: c => c,
-    getColor: (c, v) => v
+    getColor: (c, v) => v,
+    localeKey: 'hexaInput'
   }],
   to: HSVtoHex,
   from: HexToHSV
@@ -16330,7 +16365,8 @@ const hex = {
   inputs: [{
     label: 'HEX',
     getValue: c => c.slice(0, 7),
-    getColor: (c, v) => v
+    getColor: (c, v) => v,
+    localeKey: 'hexInput'
   }]
 };
 const modes = {
@@ -16379,6 +16415,9 @@ const VColorPickerEdit = defineComponent({
     let {
       emit
     } = _ref2;
+    const {
+      t
+    } = useLocale();
     const enabledModes = computed(() => {
       return props.modes.map(key => ({
         ...modes[key],
@@ -16393,11 +16432,13 @@ const VColorPickerEdit = defineComponent({
         let {
           getValue,
           getColor,
+          localeKey,
           ...inputProps
         } = _ref3;
         return {
           ...mode.inputProps,
           ...inputProps,
+          ariaLabel: t(`$vuetify.colorPicker.ariaLabel.${localeKey}`),
           disabled: props.disabled,
           value: color && getValue(color),
           onChange: e => {
@@ -16415,6 +16456,7 @@ const VColorPickerEdit = defineComponent({
       "icon": "$unfold",
       "size": "x-small",
       "variant": "plain",
+      "aria-label": t('$vuetify.colorPicker.ariaLabel.changeFormat'),
       "onClick": () => {
         const mi = enabledModes.value.findIndex(m => m.name === props.mode);
         emit('update:mode', enabledModes.value[(mi + 1) % enabledModes.value.length].name);
@@ -17180,6 +17222,9 @@ const VColorPickerPreview = defineComponent({
     let {
       emit
     } = _ref;
+    const {
+      t
+    } = useLocale();
     const abortController = new AbortController();
     onUnmounted(() => abortController.abort());
     async function openEyeDropper() {
@@ -17205,6 +17250,7 @@ const VColorPickerPreview = defineComponent({
       "class": "v-color-picker-preview__eye-dropper",
       "key": "eyeDropper"
     }, [createVNode(VBtn, {
+      "aria-label": t('$vuetify.colorPicker.ariaLabel.eyedropper'),
       "density": "comfortable",
       "disabled": props.disabled,
       "icon": "$eyeDropper",
@@ -17220,6 +17266,7 @@ const VColorPickerPreview = defineComponent({
       "class": "v-color-picker-preview__sliders"
     }, [createVNode(VSlider, {
       "class": "v-color-picker-preview__track v-color-picker-preview__hue",
+      "name": t('$vuetify.colorPicker.ariaLabel.hueSlider'),
       "modelValue": props.color?.h,
       "onUpdate:modelValue": h => emit('update:color', {
         ...(props.color ?? nullColor),
@@ -17235,6 +17282,7 @@ const VColorPickerPreview = defineComponent({
       "hideDetails": true
     }, null), !props.hideAlpha && createVNode(VSlider, {
       "class": "v-color-picker-preview__track v-color-picker-preview__alpha",
+      "name": t('$vuetify.colorPicker.ariaLabel.alphaSlider'),
       "modelValue": props.color?.a ?? 1,
       "onUpdate:modelValue": a => emit('update:color', {
         ...(props.color ?? nullColor),
@@ -21099,11 +21147,16 @@ function parseFixedColumns(items) {
     if (item.fixed === true) {
       item.fixed = 'start';
     }
-    const orderedChildren = side === 'start' ? item.children?.toReversed() : item.children;
     if (item.fixed === side) {
-      if (orderedChildren) {
-        for (const child of orderedChildren) {
-          setFixed(child, side, side);
+      if (item.children) {
+        if (side === 'start') {
+          for (let i = item.children.length - 1; i >= 0; i--) {
+            setFixed(item.children[i], side, side);
+          }
+        } else {
+          for (let i = 0; i < item.children.length; i++) {
+            setFixed(item.children[i], side, side);
+          }
         }
       } else {
         if (!seenFixed && side === 'start') {
@@ -21118,57 +21171,63 @@ function parseFixedColumns(items) {
         seenFixed = true;
       }
     } else {
-      if (orderedChildren) {
-        for (const child of orderedChildren) {
-          setFixed(child, side);
+      if (item.children) {
+        if (side === 'start') {
+          for (let i = item.children.length - 1; i >= 0; i--) {
+            setFixed(item.children[i], side);
+          }
+        } else {
+          for (let i = 0; i < item.children.length; i++) {
+            setFixed(item.children[i], side);
+          }
         }
       } else {
         seenFixed = false;
       }
     }
   }
-  for (const item of items.toReversed()) {
-    setFixed(item, 'start');
+  for (let i = items.length - 1; i >= 0; i--) {
+    setFixed(items[i], 'start');
   }
-  for (const item of items) {
-    setFixed(item, 'end');
-  }
-  function setFixedOffset(item) {
-    let offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-    if (!item) return offset;
-    if (item.children) {
-      item.fixedOffset = offset;
-      for (const child of item.children) {
-        offset = setFixedOffset(child, offset);
-      }
-    } else if (item.fixed && item.fixed !== 'end') {
-      item.fixedOffset = offset;
-      offset += parseFloat(item.width || '0') || 0;
-    }
-    return offset;
+  for (let i = 0; i < items.length; i++) {
+    setFixed(items[i], 'end');
   }
   let fixedOffset = 0;
-  for (const item of items) {
-    fixedOffset = setFixedOffset(item, fixedOffset);
+  for (let i = 0; i < items.length; i++) {
+    fixedOffset = setFixedOffset(items[i], fixedOffset);
   }
-  function setFixedEndOffset(item) {
-    let offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-    if (!item) return offset;
-    if (item.children) {
-      item.fixedEndOffset = offset;
-      for (const child of item.children) {
-        offset = setFixedEndOffset(child, offset);
-      }
-    } else if (item.fixed === 'end') {
-      item.fixedEndOffset = offset;
-      offset += parseFloat(item.width || '0') || 0;
+  let fixedEndOffset = 0;
+  for (let i = items.length - 1; i >= 0; i--) {
+    fixedEndOffset = setFixedEndOffset(items[i], fixedEndOffset);
+  }
+}
+function setFixedOffset(item) {
+  let offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  if (!item) return offset;
+  if (item.children) {
+    item.fixedOffset = offset;
+    for (const child of item.children) {
+      offset = setFixedOffset(child, offset);
     }
-    return offset;
+  } else if (item.fixed && item.fixed !== 'end') {
+    item.fixedOffset = offset;
+    offset += parseFloat(item.width || '0') || 0;
   }
-  let fixedEndOffset = 0;
-  for (const item of items.toReversed()) {
-    fixedEndOffset = setFixedEndOffset(item, fixedEndOffset);
+  return offset;
+}
+function setFixedEndOffset(item) {
+  let offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  if (!item) return offset;
+  if (item.children) {
+    item.fixedEndOffset = offset;
+    for (const child of item.children) {
+      offset = setFixedEndOffset(child, offset);
+    }
+  } else if (item.fixed === 'end') {
+    item.fixedEndOffset = offset;
+    offset += parseFloat(item.width || '0') || 0;
   }
+  return offset;
 }
 function parse(items, maxDepth) {
   const headers = [];
@@ -21870,8 +21929,6 @@ const VDataTableRows = genericComponent()({
   }
 });
 
-// Types
-
 const makeVTableProps = propsFactory({
   fixedHeader: Boolean,
   fixedFooter: Boolean,
@@ -21901,26 +21958,37 @@ const VTable = genericComponent()({
     const {
       densityClasses
     } = useDensity(props);
-    useRender(() => createVNode(props.tag, {
-      "class": normalizeClass(['v-table', {
-        'v-table--fixed-height': !!props.height,
-        'v-table--fixed-header': props.fixedHeader,
-        'v-table--fixed-footer': props.fixedFooter,
-        'v-table--has-top': !!slots.top,
-        'v-table--has-bottom': !!slots.bottom,
-        'v-table--hover': props.hover,
-        'v-table--striped-even': props.striped === 'even',
-        'v-table--striped-odd': props.striped === 'odd'
-      }, themeClasses.value, densityClasses.value, props.class]),
-      "style": normalizeStyle(props.style)
-    }, {
-      default: () => [slots.top?.(), slots.default ? createElementVNode("div", {
-        "class": "v-table__wrapper",
-        "style": {
-          height: convertToUnit(props.height)
+    useRender(() => {
+      const tableContentDefaults = {
+        VCheckboxBtn: {
+          density: props.density
         }
-      }, [createElementVNode("table", null, [slots.default()])]) : slots.wrapper?.(), slots.bottom?.()]
-    }));
+      };
+      return createVNode(props.tag, {
+        "class": normalizeClass(['v-table', {
+          'v-table--fixed-height': !!props.height,
+          'v-table--fixed-header': props.fixedHeader,
+          'v-table--fixed-footer': props.fixedFooter,
+          'v-table--has-top': !!slots.top,
+          'v-table--has-bottom': !!slots.bottom,
+          'v-table--hover': props.hover,
+          'v-table--striped-even': props.striped === 'even',
+          'v-table--striped-odd': props.striped === 'odd'
+        }, themeClasses.value, densityClasses.value, props.class]),
+        "style": normalizeStyle(props.style)
+      }, {
+        default: () => [slots.top?.(), createVNode(VDefaultsProvider, {
+          "defaults": tableContentDefaults
+        }, {
+          default: () => [slots.default ? createElementVNode("div", {
+            "class": "v-table__wrapper",
+            "style": {
+              height: convertToUnit(props.height)
+            }
+          }, [createElementVNode("table", null, [slots.default()])]) : slots.wrapper?.()]
+        }), slots.bottom?.()]
+      });
+    });
     return {};
   }
 });
@@ -26253,6 +26321,7 @@ const VNumberInput = genericComponent()({
       if (['Enter', 'ArrowLeft', 'ArrowRight', 'Backspace', 'Delete', 'Tab'].includes(e.key) || e.ctrlKey) return;
       if (['ArrowDown', 'ArrowUp'].includes(e.key)) {
         e.preventDefault();
+        e.stopPropagation();
         clampModel();
         // _model is controlled, so need to wait until props['modelValue'] is updated
         await nextTick();
@@ -31471,7 +31540,7 @@ function createVuetify$1() {
     };
   });
 }
-const version$1 = "3.9.3";
+const version$1 = "3.9.5";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -31496,7 +31565,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.9.3";
+const version = "3.9.5";
 createVuetify.version = version;
 
 export { index as blueprints, components, createVuetify, directives, useDate, useDefaults, useDisplay, useGoTo, useHotkey, useLayout, useLocale, useRtl, useTheme, version };