vuetify 3.10.3 → 3.10.4

package/dist/vuetify.d.ts

@@ -123,7 +123,7 @@ declare class Box {
     y: number;
     width: number;
     height: number;
-    constructor({ x, y, width, height }: {
+    constructor(args: DOMRect | {
         x: number;
         y: number;
         width: number;
@@ -4464,6 +4464,8 @@ interface GroupItemProvide {
     value: Ref<unknown>;
     disabled: Ref<boolean | undefined>;
     group: GroupProvide;
+    register: () => void;
+    unregister: () => void;
 }
 
 // typeof allowedDensities[number] evaluates to any
@@ -28157,6 +28159,7 @@ declare const VCombobox: {
         noDataText: string;
         openOnClear: boolean;
         noAutoScroll: boolean;
+        alwaysFilter: boolean;
         clearOnSelect: boolean;
     } & {
         theme?: string | undefined;
@@ -30875,6 +30878,7 @@ declare const VCombobox: {
         noDataText: string;
         openOnClear: boolean;
         noAutoScroll: boolean;
+        alwaysFilter: boolean;
         clearOnSelect: boolean;
     }, true, {}, vue.SlotsType<Partial<{
         prepend: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -31007,6 +31011,7 @@ declare const VCombobox: {
         noDataText: string;
         openOnClear: boolean;
         noAutoScroll: boolean;
+        alwaysFilter: boolean;
         clearOnSelect: boolean;
     } & {
         theme?: string | undefined;
@@ -33720,6 +33725,7 @@ declare const VCombobox: {
         noDataText: string;
         openOnClear: boolean;
         noAutoScroll: boolean;
+        alwaysFilter: boolean;
         clearOnSelect: boolean;
     }>;
     __isFragment?: undefined;
@@ -33775,6 +33781,7 @@ declare const VCombobox: {
     noDataText: string;
     openOnClear: boolean;
     noAutoScroll: boolean;
+    alwaysFilter: boolean;
     clearOnSelect: boolean;
 } & {
     theme?: string | undefined;
@@ -36493,6 +36500,7 @@ declare const VCombobox: {
     noDataText: string;
     openOnClear: boolean;
     noAutoScroll: boolean;
+    alwaysFilter: boolean;
     clearOnSelect: boolean;
 }, {}, string, vue.SlotsType<Partial<{
     prepend: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -37290,6 +37298,7 @@ declare const VCombobox: {
     openOnClear: BooleanConstructor;
     itemColor: StringConstructor;
     noAutoScroll: BooleanConstructor;
+    alwaysFilter: BooleanConstructor;
     autoSelectFirst: {
         type: PropType<"exact" | boolean>;
     };
@@ -37950,6 +37959,7 @@ declare const VCombobox: {
     openOnClear: BooleanConstructor;
     itemColor: StringConstructor;
     noAutoScroll: BooleanConstructor;
+    alwaysFilter: BooleanConstructor;
     autoSelectFirst: {
         type: PropType<"exact" | boolean>;
     };
@@ -105728,48 +105738,43 @@ declare module 'vue' {
     $children?: VNodeChild
   }
   export interface GlobalComponents {
-    VApp: VApp
     VAlert: VAlert
     VAlertTitle: VAlertTitle
-    VAutocomplete: VAutocomplete
     VAppBar: VAppBar
     VAppBarNavIcon: VAppBarNavIcon
     VAppBarTitle: VAppBarTitle
+    VApp: VApp
     VAvatar: VAvatar
     VBanner: VBanner
     VBannerActions: VBannerActions
     VBannerText: VBannerText
-    VBottomSheet: VBottomSheet
-    VBadge: VBadge
+    VAutocomplete: VAutocomplete
     VBottomNavigation: VBottomNavigation
-    VBtnGroup: VBtnGroup
-    VChip: VChip
     VBreadcrumbs: VBreadcrumbs
     VBreadcrumbsItem: VBreadcrumbsItem
     VBreadcrumbsDivider: VBreadcrumbsDivider
+    VBadge: VBadge
+    VBottomSheet: VBottomSheet
+    VBtnGroup: VBtnGroup
     VBtn: VBtn
-    VCarousel: VCarousel
-    VCarouselItem: VCarouselItem
-    VCheckbox: VCheckbox
-    VCheckboxBtn: VCheckboxBtn
-    VChipGroup: VChipGroup
     VCard: VCard
     VCardActions: VCardActions
     VCardItem: VCardItem
     VCardSubtitle: VCardSubtitle
     VCardText: VCardText
     VCardTitle: VCardTitle
-    VCombobox: VCombobox
+    VCheckbox: VCheckbox
+    VCheckboxBtn: VCheckboxBtn
     VBtnToggle: VBtnToggle
-    VColorPicker: VColorPicker
     VCode: VCode
+    VChip: VChip
+    VColorPicker: VColorPicker
+    VChipGroup: VChipGroup
+    VCarousel: VCarousel
+    VCarouselItem: VCarouselItem
+    VCombobox: VCombobox
     VCounter: VCounter
-    VDatePicker: VDatePicker
-    VDatePickerControls: VDatePickerControls
-    VDatePickerHeader: VDatePickerHeader
-    VDatePickerMonth: VDatePickerMonth
-    VDatePickerMonths: VDatePickerMonths
-    VDatePickerYears: VDatePickerYears
+    VDialog: VDialog
     VDataTable: VDataTable
     VDataTableHeaders: VDataTableHeaders
     VDataTableFooter: VDataTableFooter
@@ -105777,33 +105782,35 @@ declare module 'vue' {
     VDataTableRow: VDataTableRow
     VDataTableVirtual: VDataTableVirtual
     VDataTableServer: VDataTableServer
-    VEmptyState: VEmptyState
-    VDialog: VDialog
     VExpansionPanels: VExpansionPanels
     VExpansionPanel: VExpansionPanel
     VExpansionPanelText: VExpansionPanelText
     VExpansionPanelTitle: VExpansionPanelTitle
-    VField: VField
-    VFieldLabel: VFieldLabel
-    VDivider: VDivider
-    VFileInput: VFileInput
+    VDatePicker: VDatePicker
+    VDatePickerControls: VDatePickerControls
+    VDatePickerHeader: VDatePickerHeader
+    VDatePickerMonth: VDatePickerMonth
+    VDatePickerMonths: VDatePickerMonths
+    VDatePickerYears: VDatePickerYears
+    VEmptyState: VEmptyState
     VFooter: VFooter
+    VDivider: VDivider
+    VFab: VFab
     VIcon: VIcon
     VComponentIcon: VComponentIcon
     VSvgIcon: VSvgIcon
     VLigatureIcon: VLigatureIcon
     VClassIcon: VClassIcon
-    VFab: VFab
-    VInput: VInput
+    VField: VField
+    VFieldLabel: VFieldLabel
+    VFileInput: VFileInput
+    VImg: VImg
     VInfiniteScroll: VInfiniteScroll
+    VInput: VInput
+    VLabel: VLabel
     VItemGroup: VItemGroup
     VItem: VItem
-    VImg: VImg
-    VLabel: VLabel
     VKbd: VKbd
-    VNavigationDrawer: VNavigationDrawer
-    VMenu: VMenu
-    VMessages: VMessages
     VList: VList
     VListGroup: VListGroup
     VListImg: VListImg
@@ -105814,61 +105821,64 @@ declare module 'vue' {
     VListItemTitle: VListItemTitle
     VListSubheader: VListSubheader
     VMain: VMain
+    VNavigationDrawer: VNavigationDrawer
+    VMenu: VMenu
+    VMessages: VMessages
     VNumberInput: VNumberInput
+    VPagination: VPagination
     VOverlay: VOverlay
     VOtpInput: VOtpInput
     VProgressCircular: VProgressCircular
-    VProgressLinear: VProgressLinear
-    VPagination: VPagination
+    VRating: VRating
+    VSelect: VSelect
     VRadioGroup: VRadioGroup
+    VProgressLinear: VProgressLinear
+    VSheet: VSheet
     VSelectionControl: VSelectionControl
-    VSelect: VSelect
+    VSelectionControlGroup: VSelectionControlGroup
+    VSnackbar: VSnackbar
     VSlideGroup: VSlideGroup
     VSlideGroupItem: VSlideGroupItem
-    VRating: VRating
-    VSnackbar: VSnackbar
-    VSelectionControlGroup: VSelectionControlGroup
     VSlider: VSlider
     VSkeletonLoader: VSkeletonLoader
-    VSheet: VSheet
     VStepper: VStepper
     VStepperActions: VStepperActions
     VStepperHeader: VStepperHeader
     VStepperItem: VStepperItem
     VStepperWindow: VStepperWindow
     VStepperWindowItem: VStepperWindowItem
-    VSystemBar: VSystemBar
-    VTextarea: VTextarea
     VSwitch: VSwitch
-    VTextField: VTextField
+    VTable: VTable
+    VTextarea: VTextarea
+    VSystemBar: VSystemBar
     VTab: VTab
     VTabs: VTabs
     VTabsWindow: VTabsWindow
     VTabsWindowItem: VTabsWindowItem
-    VTable: VTable
+    VTextField: VTextField
+    VTooltip: VTooltip
+    VTimePicker: VTimePicker
+    VTimePickerClock: VTimePickerClock
+    VTimePickerControls: VTimePickerControls
     VTimeline: VTimeline
     VTimelineItem: VTimelineItem
     VToolbar: VToolbar
     VToolbarTitle: VToolbarTitle
     VToolbarItems: VToolbarItems
-    VTimePicker: VTimePicker
-    VTimePickerClock: VTimePickerClock
-    VTimePickerControls: VTimePickerControls
-    VWindow: VWindow
-    VWindowItem: VWindowItem
-    VTooltip: VTooltip
     VTreeview: VTreeview
     VTreeviewItem: VTreeviewItem
     VTreeviewGroup: VTreeviewGroup
+    VWindow: VWindow
+    VWindowItem: VWindowItem
     VConfirmEdit: VConfirmEdit
     VDataIterator: VDataIterator
     VDefaultsProvider: VDefaultsProvider
-    VHover: VHover
-    VForm: VForm
     VContainer: VContainer
     VCol: VCol
     VRow: VRow
     VSpacer: VSpacer
+    VForm: VForm
+    VHover: VHover
     VLayout: VLayout
     VLayoutItem: VLayoutItem
     VLocaleProvider: VLocaleProvider
@@ -105876,14 +105886,14 @@ declare module 'vue' {
     VNoSsr: VNoSsr
     VParallax: VParallax
     VRadio: VRadio
-    VRangeSlider: VRangeSlider
     VResponsive: VResponsive
+    VRangeSlider: VRangeSlider
     VSnackbarQueue: VSnackbarQueue
     VSparkline: VSparkline
     VSpeedDial: VSpeedDial
     VThemeProvider: VThemeProvider
-    VVirtualScroll: VVirtualScroll
     VValidation: VValidation
+    VVirtualScroll: VVirtualScroll
     VFabTransition: VFabTransition
     VDialogBottomTransition: VDialogBottomTransition
     VDialogTopTransition: VDialogTopTransition
@@ -105900,26 +105910,26 @@ declare module 'vue' {
     VExpandTransition: VExpandTransition
     VExpandXTransition: VExpandXTransition
     VDialogTransition: VDialogTransition
+    VCalendar: VCalendar
+    VColorInput: VColorInput
     VFileUpload: VFileUpload
     VFileUploadItem: VFileUploadItem
-    VColorInput: VColorInput
-    VIconBtn: VIconBtn
-    VPicker: VPicker
-    VPickerTitle: VPickerTitle
-    VCalendar: VCalendar
-    VStepperVertical: VStepperVertical
-    VStepperVerticalItem: VStepperVerticalItem
-    VStepperVerticalActions: VStepperVerticalActions
-    VPie: VPie
-    VPieSegment: VPieSegment
-    VPieTooltip: VPieTooltip
     VVideo: VVideo
     VVideoControls: VVideoControls
     VVideoVolume: VVideoVolume
+    VPie: VPie
+    VPieSegment: VPieSegment
+    VPieTooltip: VPieTooltip
     VHotkey: VHotkey
+    VIconBtn: VIconBtn
+    VStepperVertical: VStepperVertical
+    VStepperVerticalItem: VStepperVerticalItem
+    VStepperVerticalActions: VStepperVerticalActions
+    VPicker: VPicker
+    VPickerTitle: VPickerTitle
     VDateInput: VDateInput
-    VMaskInput: VMaskInput
     VPullToRefresh: VPullToRefresh
+    VMaskInput: VMaskInput
   }
   export interface GlobalDirectives {
     vClickOutside: typeof import('vuetify/directives')['ClickOutside']

package/dist/vuetify.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.10.3
+* Vuetify v3.10.4
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -584,17 +584,19 @@ function getAxis(anchor) {
 }
 
 class Box {
-  constructor(_ref) {
-    let {
+  constructor(args) {
+    const pageScale = document.body.currentCSSZoom ?? 1;
+    const factor = args instanceof DOMRect ? 1 + (1 - pageScale) / pageScale : 1;
+    const {
       x,
       y,
       width,
       height
-    } = _ref;
-    this.x = x;
-    this.y = y;
-    this.width = width;
-    this.height = height;
+    } = args;
+    this.x = x * factor;
+    this.y = y * factor;
+    this.width = width * factor;
+    this.height = height * factor;
   }
   get top() {
     return this.y;
@@ -623,14 +625,16 @@ function getOverflow(a, b) {
 }
 function getTargetBox(target) {
   if (Array.isArray(target)) {
+    const pageScale = document.body.currentCSSZoom ?? 1;
+    const factor = 1 + (1 - pageScale) / pageScale;
     return new Box({
-      x: target[0],
-      y: target[1],
-      width: 0,
-      height: 0
+      x: target[0] * factor,
+      y: target[1] * factor,
+      width: 0 * factor,
+      height: 0 * factor
     });
   } else {
-    return target.getBoundingClientRect();
+    return new Box(target.getBoundingClientRect());
   }
 }
 function getElementBox(el) {
@@ -643,11 +647,12 @@ function getElementBox(el) {
         height: document.documentElement.clientHeight
       });
     } else {
+      const pageScale = document.body.currentCSSZoom ?? 1;
       return new Box({
         x: visualViewport.scale > 1 ? 0 : visualViewport.offsetLeft,
         y: visualViewport.scale > 1 ? 0 : visualViewport.offsetTop,
-        width: visualViewport.width * visualViewport.scale,
-        height: visualViewport.height * visualViewport.scale
+        width: visualViewport.width * visualViewport.scale / pageScale,
+        height: visualViewport.height * visualViewport.scale / pageScale
       });
     }
   } else {
@@ -665,7 +670,7 @@ function getElementBox(el) {
 
 /** @see https://stackoverflow.com/a/57876601/2074736 */
 function nullifyTransforms(el) {
-  const rect = el.getBoundingClientRect();
+  const rect = new Box(el.getBoundingClientRect());
   const style = getComputedStyle(el);
   const tx = style.transform;
   if (tx) {
@@ -5004,14 +5009,18 @@ function useGroupItem(props, injectKey) {
   }
   const value = toRef(() => props.value);
   const disabled = computed(() => !!(group.disabled.value || props.disabled));
-  group.register({
-    id,
-    value,
-    disabled
-  }, vm);
-  onBeforeUnmount(() => {
-    group.unregister(id);
-  });
+  function register() {
+    group?.register({
+      id,
+      value,
+      disabled
+    }, vm);
+  }
+  function unregister() {
+    group?.unregister(id);
+  }
+  onMounted(() => register());
+  onBeforeUnmount(() => unregister());
   const isSelected = computed(() => {
     return group.isSelected(id);
   });
@@ -5039,7 +5048,9 @@ function useGroupItem(props, injectKey) {
     selectedClass,
     value,
     disabled,
-    group
+    group,
+    register,
+    unregister
   };
 }
 function useGroup(props, injectKey) {
@@ -6401,7 +6412,7 @@ const VBtn = genericComponent()({
     });
     function onClick(e) {
       if (isDisabled.value || link.isLink.value && (e.metaKey || e.ctrlKey || e.shiftKey || e.button !== 0 || attrs.target === '_blank')) return;
-      if (link.isLink.value) {
+      if (link.isRouterLink.value) {
         link.navigate?.(e);
       } else {
         // Group active state for links is handled by useSelectLink
@@ -8847,6 +8858,7 @@ const VChip = genericComponent()({
     } = provideTheme(props);
     const isActive = useProxiedModel(props, 'modelValue');
     const group = useGroupItem(props, VChipGroupSymbol, false);
+    const slideGroup = useGroupItem(props, VSlideGroupSymbol, false);
     const link = useLink(props, attrs);
     const isLink = toRef(() => props.link !== false && link.isLink.value);
     const isClickable = computed(() => !props.disabled && props.link !== false && (!!group || props.link || link.isClickable.value));
@@ -8860,6 +8872,15 @@ const VChip = genericComponent()({
         emit('click:close', e);
       }
     }));
+    watch(isActive, val => {
+      if (val) {
+        group?.register();
+        slideGroup?.register();
+      } else {
+        group?.unregister();
+        slideGroup?.unregister();
+      }
+    });
     const {
       colorClasses,
       colorStyles,
@@ -15041,10 +15062,11 @@ const VDialog = genericComponent()({
       scopeId
     } = useScopeId();
     const overlay = ref();
-    function onFocusin(e) {
+    async function onFocusin(e) {
       const before = e.relatedTarget;
       const after = e.target;
-      if (before !== after && overlay.value?.contentEl &&
+      await nextTick();
+      if (isActive.value && before !== after && overlay.value?.contentEl &&
       // We're the topmost dialog
       overlay.value?.globalTop &&
       // It isn't the document or the dialog body
@@ -15052,22 +15074,39 @@ const VDialog = genericComponent()({
       // It isn't inside the dialog body
       !overlay.value.contentEl.contains(after)) {
         const focusable = focusableChildren(overlay.value.contentEl);
-        if (!focusable.length) return;
-        const firstElement = focusable[0];
-        const lastElement = focusable[focusable.length - 1];
-        if (before === firstElement) {
-          lastElement.focus();
-        } else {
-          firstElement.focus();
-        }
+        focusable[0]?.focus();
+      }
+    }
+    function onKeydown(e) {
+      if (e.key !== 'Tab' || !overlay.value?.contentEl) return;
+      const focusable = focusableChildren(overlay.value.contentEl);
+      if (!focusable.length) return;
+      const firstElement = focusable[0];
+      const lastElement = focusable[focusable.length - 1];
+      const active = document.activeElement;
+      if (e.shiftKey && active === firstElement) {
+        e.preventDefault();
+        lastElement.focus();
+      } else if (!e.shiftKey && active === lastElement) {
+        e.preventDefault();
+        firstElement.focus();
       }
     }
     onBeforeUnmount(() => {
       document.removeEventListener('focusin', onFocusin);
+      document.removeEventListener('keydown', onKeydown);
     });
     if (IN_BROWSER) {
       watch(() => isActive.value && props.retainFocus, val => {
-        val ? document.addEventListener('focusin', onFocusin) : document.removeEventListener('focusin', onFocusin);
+        if (val) {
+          document.addEventListener('focusin', onFocusin, {
+            once: true
+          });
+          document.addEventListener('keydown', onKeydown);
+        } else {
+          document.removeEventListener('focusin', onFocusin);
+          document.removeEventListener('keydown', onKeydown);
+        }
       }, {
         immediate: true
       });
@@ -19455,6 +19494,7 @@ const VColorPicker = defineComponent({
 // Types
 
 const makeVComboboxProps = propsFactory({
+  alwaysFilter: Boolean,
   autoSelectFirst: {
     type: [Boolean, String]
   },
@@ -19554,7 +19594,7 @@ const VCombobox = genericComponent()({
     const {
       filteredItems,
       getMatches
-    } = useFilter(props, items, () => isPristine.value ? '' : search.value);
+    } = useFilter(props, items, () => props.alwaysFilter || !isPristine.value ? search.value : '');
     const displayItems = computed(() => {
       if (props.hideSelected) {
         return filteredItems.value.filter(filteredItem => !model.value.some(s => s.value === filteredItem.value));
@@ -19601,6 +19641,7 @@ const VCombobox = genericComponent()({
     const listEvents = useScrolling(listRef, vTextFieldRef);
     function onClear(e) {
       cleared = true;
+      nextTick(() => cleared = false);
       if (props.openOnClear) {
         menu.value = true;
       }
@@ -25274,7 +25315,8 @@ const VFileInput = genericComponent()({
         'onClick:clear': onClear
       };
       const expectsDirectory = attrs.webkitdirectory !== undefined && attrs.webkitdirectory !== false;
-      const inputAccept = expectsDirectory ? undefined : props.filterByType ?? String(attrs.accept);
+      const acceptFallback = attrs.accept ? String(attrs.accept) : undefined;
+      const inputAccept = expectsDirectory ? undefined : props.filterByType ?? acceptFallback;
       return createVNode(VInput, mergeProps({
         "ref": vInputRef,
         "modelValue": props.multiple ? model.value : model.value[0],
@@ -31529,6 +31571,7 @@ const VTreeviewChildren = genericComponent()({
             ...itemProps,
             ...activatorProps,
             value: itemProps?.value,
+            indentLines: indentLines.node,
             onToggleExpand: [() => checkChildren(item), activatorProps.onClick],
             onClick: isClickOnOpen.value ? [() => checkChildren(item), activatorProps.onClick] : () => selectItem(activatorItems.value[index]?.select, !activatorItems.value[index]?.isSelected)
           };
@@ -31542,7 +31585,6 @@ const VTreeviewChildren = genericComponent()({
           }, listItemProps, {
             "hasCustomPrepend": !!slots.prepend,
             "hideActions": props.hideActions,
-            "indentLines": indentLines.node,
             "value": props.returnObject ? item.raw : itemProps.value,
             "loading": loading
           }), slotsWithItem));
@@ -32237,7 +32279,7 @@ function createVuetify$1() {
     };
   });
 }
-const version$1 = "3.10.3";
+const version$1 = "3.10.4";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -32262,7 +32304,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.10.3";
+const version = "3.10.4";
 createVuetify.version = version;
 
 export { index as blueprints, components, createVuetify, directives, useDate, useDefaults, useDisplay, useGoTo, useHotkey, useLayout, useLocale, useMask, useRtl, useTheme, version };