@vuetify/nightly 3.7.4-next.2024-11-06 → 3.7.5-master.2024-12-03

package/lib/components/VOverlay/VOverlay.css

@@ -1,61 +1,64 @@
-@layer vuetify.components {
-  .v-overlay-container {
-    contain: layout;
-    left: 0;
-    pointer-events: none;
-    position: absolute;
-    top: 0;
-    display: contents;
-  }
-  .v-overlay {
-    border-radius: inherit;
-    display: flex;
-    left: 0;
-    pointer-events: none;
-    position: fixed;
-    top: 0;
-    bottom: 0;
-    right: 0;
-  }
-  .v-overlay__content {
-    outline: none;
-    position: absolute;
-    pointer-events: auto;
-    contain: layout;
-  }
-  .v-overlay__scrim {
-    pointer-events: auto;
-    background: rgb(var(--v-theme-on-surface));
-    border-radius: inherit;
-    bottom: 0;
-    left: 0;
-    opacity: var(--v-overlay-opacity, 0.32);
-    position: fixed;
-    right: 0;
-    top: 0;
-  }
-  .v-overlay--absolute {
-    position: absolute;
-  }
-  .v-overlay--contained .v-overlay__scrim {
-    position: absolute;
-  }
-  .v-overlay--scroll-blocked {
-    padding-inline-end: var(--v-scrollbar-offset);
-  }
-}
-@layer vuetify.trumps {
-  .v-overlay-scroll-blocked {
-    padding-inline-end: var(--v-scrollbar-offset);
-  }
-  .v-overlay-scroll-blocked:not(html) {
-    overflow-y: hidden;
-  }
-  html.v-overlay-scroll-blocked {
-    position: fixed;
-    top: var(--v-body-scroll-y);
-    left: var(--v-body-scroll-x);
-    width: 100%;
-    height: 100%;
-  }
+.v-overlay-container {
+  contain: layout;
+  left: 0;
+  pointer-events: none;
+  position: absolute;
+  top: 0;
+  display: contents;
+}
+
+.v-overlay-scroll-blocked {
+  padding-inline-end: var(--v-scrollbar-offset);
+}
+.v-overlay-scroll-blocked:not(html) {
+  overflow-y: hidden !important;
+}
+html.v-overlay-scroll-blocked {
+  position: fixed;
+  top: var(--v-body-scroll-y);
+  left: var(--v-body-scroll-x);
+  width: 100%;
+  height: 100%;
+}
+
+.v-overlay {
+  border-radius: inherit;
+  display: flex;
+  left: 0;
+  pointer-events: none;
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  right: 0;
+}
+
+.v-overlay__content {
+  outline: none;
+  position: absolute;
+  pointer-events: auto;
+  contain: layout;
+}
+
+.v-overlay__scrim {
+  pointer-events: auto;
+  background: rgb(var(--v-theme-on-surface));
+  border-radius: inherit;
+  bottom: 0;
+  left: 0;
+  opacity: var(--v-overlay-opacity, 0.32);
+  position: fixed;
+  right: 0;
+  top: 0;
+}
+
+.v-overlay--absolute {
+  position: absolute;
+}
+
+.v-overlay--contained .v-overlay__scrim {
+  position: absolute;
+}
+
+.v-overlay--scroll-blocked {
+  padding-inline-end: var(--v-scrollbar-offset);
 }

package/lib/components/VOverlay/VOverlay.mjs

@@ -1,4 +1,4 @@
-import { mergeProps as _mergeProps, createVNode as _createVNode, Fragment as _Fragment, vShow as _vShow, resolveDirective as _resolveDirective, withDirectives as _withDirectives } from "vue";
+import { withDirectives as _withDirectives, resolveDirective as _resolveDirective, vShow as _vShow, Fragment as _Fragment, createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
 // Styles
 import "./VOverlay.css";
 

package/lib/components/VOverlay/VOverlay.sass

@@ -12,6 +12,19 @@
     top: 0
     display: contents
 
+  .v-overlay-scroll-blocked
+    padding-inline-end: var(--v-scrollbar-offset)
+
+    &:not(html)
+      overflow-y: hidden !important
+
+    @at-root #{selector.append(html, &)}
+      position: fixed
+      top: var(--v-body-scroll-y)
+      left: var(--v-body-scroll-x)
+      width: 100%
+      height: 100%
+
   .v-overlay
     border-radius: inherit
     display: flex
@@ -49,17 +62,3 @@
 
   .v-overlay--scroll-blocked
     padding-inline-end: var(--v-scrollbar-offset)
-
-@include tools.layer('trumps')
-  .v-overlay-scroll-blocked
-    padding-inline-end: var(--v-scrollbar-offset)
-
-    &:not(html)
-      overflow-y: hidden
-
-    @at-root #{selector.append(html, &)}
-      position: fixed
-      top: var(--v-body-scroll-y)
-      left: var(--v-body-scroll-x)
-      width: 100%
-      height: 100%

package/lib/components/VOverlay/index.d.mts

@@ -93,7 +93,7 @@ declare function blockScrollStrategy(data: ScrollStrategyData, props: StrategyPr
 declare function repositionScrollStrategy(data: ScrollStrategyData, props: StrategyProps, scope: EffectScope): void;
 
 declare const VOverlay: {
-    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
+    new (...args: any[]): vue.CreateComponentPublicInstance<{
         absolute: boolean;
         location: Anchor;
         origin: "auto" | Anchor | "overlap";
@@ -176,20 +176,102 @@ declare const VOverlay: {
         "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
         "onClick:outside"?: ((e: MouseEvent) => any) | undefined;
     }, {
-        activatorEl: Ref<HTMLElement | undefined, HTMLElement | undefined>;
-        scrimEl: Ref<HTMLElement | undefined, HTMLElement | undefined>;
+        activatorEl: Ref<HTMLElement | undefined>;
+        scrimEl: Ref<HTMLElement | undefined>;
         target: vue.ComputedRef<HTMLElement | [x: number, y: number] | undefined>;
         animateClick: () => void;
-        contentEl: Ref<HTMLElement | undefined, HTMLElement | undefined>;
-        globalTop: Readonly<Ref<boolean, boolean>>;
+        contentEl: Ref<HTMLElement | undefined>;
+        globalTop: Readonly<Ref<boolean>>;
         localTop: vue.ComputedRef<boolean>;
-        updateLocation: Ref<((e: Event) => void) | undefined, ((e: Event) => void) | undefined>;
+        updateLocation: Ref<((e: Event) => void) | undefined>;
     }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
         'click:outside': (e: MouseEvent) => true;
         'update:modelValue': (value: boolean) => true;
         afterEnter: () => true;
         afterLeave: () => true;
-    }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, {
+    }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
+        absolute: boolean;
+        location: Anchor;
+        origin: "auto" | Anchor | "overlap";
+        transition: string | boolean | (vue.TransitionProps & {
+            component?: vue.Component;
+        });
+        zIndex: string | number;
+        style: vue.StyleValue;
+        eager: boolean;
+        disabled: boolean;
+        persistent: boolean;
+        modelValue: boolean;
+        locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps$1, contentStyles: Ref<Record<string, string>>) => undefined | {
+            updateLocation: (e?: Event) => void;
+        });
+        scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps, scope: vue.EffectScope) => void) | "reposition";
+        activatorProps: Record<string, any>;
+        openOnHover: boolean;
+        closeOnContentClick: boolean;
+        closeOnBack: boolean;
+        contained: boolean;
+        noClickAnimation: boolean;
+        scrim: string | boolean;
+        _disableGlobalStack: boolean;
+    } & {
+        offset?: string | number | number[] | undefined;
+        height?: string | number | undefined;
+        width?: string | number | undefined;
+        maxHeight?: string | number | undefined;
+        maxWidth?: string | number | undefined;
+        minHeight?: string | number | undefined;
+        minWidth?: string | number | undefined;
+        opacity?: string | number | undefined;
+        target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined;
+        class?: any;
+        theme?: string | undefined;
+        contentClass?: any;
+        activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined;
+        closeDelay?: string | number | undefined;
+        openDelay?: string | number | undefined;
+        openOnClick?: boolean | undefined;
+        openOnFocus?: boolean | undefined;
+        contentProps?: any;
+        attach?: string | boolean | Element | undefined;
+    } & {
+        $children?: vue.VNodeChild | {
+            default?: ((arg: {
+                isActive: Ref<boolean>;
+            }) => vue.VNodeChild) | undefined;
+            activator?: ((arg: {
+                isActive: boolean;
+                props: Record<string, any>;
+                targetRef: TemplateRef;
+            }) => vue.VNodeChild) | undefined;
+        } | ((arg: {
+            isActive: Ref<boolean>;
+        }) => vue.VNodeChild);
+        'v-slots'?: {
+            default?: false | ((arg: {
+                isActive: Ref<boolean>;
+            }) => vue.VNodeChild) | undefined;
+            activator?: false | ((arg: {
+                isActive: boolean;
+                props: Record<string, any>;
+                targetRef: TemplateRef;
+            }) => vue.VNodeChild) | undefined;
+        } | undefined;
+    } & {
+        "v-slot:default"?: false | ((arg: {
+            isActive: Ref<boolean>;
+        }) => vue.VNodeChild) | undefined;
+        "v-slot:activator"?: false | ((arg: {
+            isActive: boolean;
+            props: Record<string, any>;
+            targetRef: TemplateRef;
+        }) => vue.VNodeChild) | undefined;
+    } & {
+        onAfterEnter?: (() => any) | undefined;
+        onAfterLeave?: (() => any) | undefined;
+        "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+        "onClick:outside"?: ((e: MouseEvent) => any) | undefined;
+    }, {
         absolute: boolean;
         location: Anchor;
         origin: "auto" | Anchor | "overlap";
@@ -225,7 +307,7 @@ declare const VOverlay: {
             props: Record<string, any>;
             targetRef: TemplateRef;
         }) => vue.VNode[];
-    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
+    }>>, {
         P: {};
         B: {};
         D: {};
@@ -315,14 +397,14 @@ declare const VOverlay: {
         "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
         "onClick:outside"?: ((e: MouseEvent) => any) | undefined;
     }, {
-        activatorEl: Ref<HTMLElement | undefined, HTMLElement | undefined>;
-        scrimEl: Ref<HTMLElement | undefined, HTMLElement | undefined>;
+        activatorEl: Ref<HTMLElement | undefined>;
+        scrimEl: Ref<HTMLElement | undefined>;
         target: vue.ComputedRef<HTMLElement | [x: number, y: number] | undefined>;
         animateClick: () => void;
-        contentEl: Ref<HTMLElement | undefined, HTMLElement | undefined>;
-        globalTop: Readonly<Ref<boolean, boolean>>;
+        contentEl: Ref<HTMLElement | undefined>;
+        globalTop: Readonly<Ref<boolean>>;
         localTop: vue.ComputedRef<boolean>;
-        updateLocation: Ref<((e: Event) => void) | undefined, ((e: Event) => void) | undefined>;
+        updateLocation: Ref<((e: Event) => void) | undefined>;
     }, {}, {}, {}, {
         absolute: boolean;
         location: Anchor;
@@ -437,14 +519,14 @@ declare const VOverlay: {
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     "onClick:outside"?: ((e: MouseEvent) => any) | undefined;
 }, {
-    activatorEl: Ref<HTMLElement | undefined, HTMLElement | undefined>;
-    scrimEl: Ref<HTMLElement | undefined, HTMLElement | undefined>;
+    activatorEl: Ref<HTMLElement | undefined>;
+    scrimEl: Ref<HTMLElement | undefined>;
     target: vue.ComputedRef<HTMLElement | [x: number, y: number] | undefined>;
     animateClick: () => void;
-    contentEl: Ref<HTMLElement | undefined, HTMLElement | undefined>;
-    globalTop: Readonly<Ref<boolean, boolean>>;
+    contentEl: Ref<HTMLElement | undefined>;
+    globalTop: Readonly<Ref<boolean>>;
     localTop: vue.ComputedRef<boolean>;
-    updateLocation: Ref<((e: Event) => void) | undefined, ((e: Event) => void) | undefined>;
+    updateLocation: Ref<((e: Event) => void) | undefined>;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
     'click:outside': (e: MouseEvent) => true;
     'update:modelValue': (value: boolean) => true;
@@ -486,7 +568,7 @@ declare const VOverlay: {
         props: Record<string, any>;
         targetRef: TemplateRef;
     }) => vue.VNode[];
-}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     transition: {
         type: PropType<string | boolean | (vue.TransitionProps & {
             component?: vue.Component;

package/lib/components/VPagination/VPagination.css

@@ -1,11 +1,9 @@
-@layer vuetify.components {
-  .v-pagination__list {
-    display: inline-flex;
-    list-style-type: none;
-    justify-content: center;
-    width: 100%;
-  }
-  .v-pagination__item, .v-pagination__first, .v-pagination__prev, .v-pagination__next, .v-pagination__last {
-    margin: 0.3rem;
-  }
+.v-pagination__list {
+  display: inline-flex;
+  list-style-type: none;
+  justify-content: center;
+  width: 100%;
+}
+.v-pagination__item, .v-pagination__first, .v-pagination__prev, .v-pagination__next, .v-pagination__last {
+  margin: 0.3rem;
 }

package/lib/components/VPagination/VPagination.mjs

@@ -1,4 +1,4 @@
-import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
+import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
 // Styles
 import "./VPagination.css";
 

package/lib/components/VPagination/index.d.mts

@@ -32,7 +32,7 @@ type ControlSlot = {
     'aria-disabled': boolean;
 };
 declare const VPagination: {
-    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
+    new (...args: any[]): vue.CreateComponentPublicInstance<{
         length: string | number;
         variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
         start: string | number;
@@ -98,7 +98,67 @@ declare const VPagination: {
         prev: (value: number) => true;
         next: (value: number) => true;
         last: (value: number) => true;
-    }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, {
+    }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
+        length: string | number;
+        variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
+        start: string | number;
+        style: vue.StyleValue;
+        ariaLabel: string;
+        disabled: boolean;
+        size: string | number;
+        tag: string;
+        ellipsis: string;
+        modelValue: number;
+        tile: boolean;
+        density: Density;
+        nextIcon: IconValue;
+        prevIcon: IconValue;
+        firstIcon: IconValue;
+        lastIcon: IconValue;
+        pageAriaLabel: string;
+        currentPageAriaLabel: string;
+        firstAriaLabel: string;
+        previousAriaLabel: string;
+        nextAriaLabel: string;
+        lastAriaLabel: string;
+        showFirstLastPage: boolean;
+    } & {
+        border?: string | number | boolean | undefined;
+        color?: string | undefined;
+        class?: any;
+        theme?: string | undefined;
+        elevation?: string | number | undefined;
+        rounded?: string | number | boolean | undefined;
+        activeColor?: string | undefined;
+        totalVisible?: string | number | undefined;
+    } & {
+        $children?: {} | vue.VNodeChild | {
+            item?: ((arg: ItemSlot) => vue.VNodeChild) | undefined;
+            first?: ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+            prev?: ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+            next?: ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+            last?: ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+        };
+        'v-slots'?: {
+            item?: false | ((arg: ItemSlot) => vue.VNodeChild) | undefined;
+            first?: false | ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+            prev?: false | ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+            next?: false | ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+            last?: false | ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+        } | undefined;
+    } & {
+        "v-slot:item"?: false | ((arg: ItemSlot) => vue.VNodeChild) | undefined;
+        "v-slot:first"?: false | ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+        "v-slot:prev"?: false | ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+        "v-slot:next"?: false | ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+        "v-slot:last"?: false | ((arg: ControlSlot) => vue.VNodeChild) | undefined;
+    } & {
+        "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+        onNext?: ((value: number) => any) | undefined;
+        onPrev?: ((value: number) => any) | undefined;
+        onFirst?: ((value: number) => any) | undefined;
+        onLast?: ((value: number) => any) | undefined;
+    }, {
         length: string | number;
         variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
         start: string | number;
@@ -129,7 +189,7 @@ declare const VPagination: {
         prev: (arg: ControlSlot) => vue.VNode[];
         next: (arg: ControlSlot) => vue.VNode[];
         last: (arg: ControlSlot) => vue.VNode[];
-    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
+    }>>, {
         P: {};
         B: {};
         D: {};
@@ -322,7 +382,7 @@ declare const VPagination: {
     prev: (arg: ControlSlot) => vue.VNode[];
     next: (arg: ControlSlot) => vue.VNode[];
     last: (arg: ControlSlot) => vue.VNode[];
-}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     color: StringConstructor;
     variant: Omit<{
         type: vue.PropType<Variant>;

package/lib/components/VParallax/VParallax.css

@@ -1,9 +1,7 @@
-@layer vuetify.components {
-  .v-parallax {
-    position: relative;
-    overflow: hidden;
-  }
-  .v-parallax--active > .v-img__img {
-    will-change: transform;
-  }
+.v-parallax {
+  position: relative;
+  overflow: hidden;
+}
+.v-parallax--active > .v-img__img {
+  will-change: transform;
 }

package/lib/components/VParallax/VParallax.mjs

@@ -1,4 +1,4 @@
-import { createVNode as _createVNode } from "vue";
+import { createVNode as _createVNode, resolveDirective as _resolveDirective } from "vue";
 // Styles
 import "./VParallax.css";
 

package/lib/components/VParallax/index.d.mts

@@ -8,7 +8,7 @@ interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions
 type ClassValue = any;
 
 declare const VParallax: {
-    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
+    new (...args: any[]): vue.CreateComponentPublicInstance<{
         scale: string | number;
         style: vue.StyleValue;
     } & {
@@ -31,7 +31,30 @@ declare const VParallax: {
         "v-slot:placeholder"?: false | (() => vue.VNodeChild) | undefined;
         "v-slot:error"?: false | (() => vue.VNodeChild) | undefined;
         "v-slot:sources"?: false | (() => vue.VNodeChild) | undefined;
-    }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, {
+    }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
+        scale: string | number;
+        style: vue.StyleValue;
+    } & {
+        class?: any;
+    } & {
+        $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
+            default?: (() => vue.VNodeChild) | undefined;
+            placeholder?: (() => vue.VNodeChild) | undefined;
+            error?: (() => vue.VNodeChild) | undefined;
+            sources?: (() => vue.VNodeChild) | undefined;
+        };
+        'v-slots'?: {
+            default?: false | (() => vue.VNodeChild) | undefined;
+            placeholder?: false | (() => vue.VNodeChild) | undefined;
+            error?: false | (() => vue.VNodeChild) | undefined;
+            sources?: false | (() => vue.VNodeChild) | undefined;
+        } | undefined;
+    } & {
+        "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:placeholder"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:error"?: false | (() => vue.VNodeChild) | undefined;
+        "v-slot:sources"?: false | (() => vue.VNodeChild) | undefined;
+    }, {
         scale: string | number;
         style: vue.StyleValue;
     }, true, {}, vue.SlotsType<Partial<{
@@ -39,7 +62,7 @@ declare const VParallax: {
         placeholder: () => vue.VNode[];
         error: () => vue.VNode[];
         sources: () => vue.VNode[];
-    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
+    }>>, {
         P: {};
         B: {};
         D: {};
@@ -107,7 +130,7 @@ declare const VParallax: {
     placeholder: () => vue.VNode[];
     error: () => vue.VNode[];
     sources: () => vue.VNode[];
-}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     class: vue.PropType<ClassValue>;
     style: {
         type: vue.PropType<vue.StyleValue>;