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

package/lib/components/VSelectionControl/VSelectionControl.css

@@ -1,101 +1,103 @@
-@layer vuetify.components {
-  .v-selection-control {
-    align-items: center;
-    contain: layout;
-    display: flex;
-    flex: 1 0;
-    grid-area: control;
-    position: relative;
-    user-select: none;
-  }
-  .v-selection-control .v-label {
-    white-space: normal;
-    word-break: break-word;
-    height: 100%;
-  }
-  .v-selection-control--disabled {
-    opacity: var(--v-disabled-opacity);
-    pointer-events: none;
-  }
-  .v-selection-control--error .v-label, .v-selection-control--disabled .v-label {
-    opacity: 1;
-  }
-  .v-selection-control--error:not(.v-selection-control--disabled) .v-label {
-    color: rgb(var(--v-theme-error));
-  }
-  .v-selection-control--inline {
-    display: inline-flex;
-    flex: 0 0 auto;
-    min-width: 0;
-    max-width: 100%;
-  }
-  .v-selection-control--inline .v-label {
-    width: auto;
-  }
-  .v-selection-control--density-default {
-    --v-selection-control-size: 40px;
-  }
-  .v-selection-control--density-comfortable {
-    --v-selection-control-size: 36px;
-  }
-  .v-selection-control--density-compact {
-    --v-selection-control-size: 28px;
-  }
-  .v-selection-control__wrapper {
-    width: var(--v-selection-control-size);
-    height: var(--v-selection-control-size);
-    display: inline-flex;
-    align-items: center;
-    position: relative;
-    justify-content: center;
-    flex: none;
-  }
-  .v-selection-control__input {
-    width: var(--v-selection-control-size);
-    height: var(--v-selection-control-size);
-    align-items: center;
-    display: flex;
-    flex: none;
-    justify-content: center;
-    position: relative;
-    border-radius: 50%;
-  }
-  .v-selection-control__input input {
-    cursor: pointer;
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    opacity: 0;
-  }
-  .v-selection-control__input::before {
-    border-radius: 100%;
-    background-color: currentColor;
-    opacity: 0;
-    pointer-events: none;
-  }
-  .v-selection-control__input::before {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-  }
-  .v-selection-control__input:hover::before {
-    opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
-  }
-  .v-selection-control__input > .v-icon {
-    opacity: var(--v-medium-emphasis-opacity);
-  }
-  .v-selection-control--disabled .v-selection-control__input > .v-icon, .v-selection-control--dirty .v-selection-control__input > .v-icon, .v-selection-control--error .v-selection-control__input > .v-icon {
-    opacity: 1;
-  }
-  .v-selection-control--error:not(.v-selection-control--disabled) .v-selection-control__input > .v-icon {
-    color: rgb(var(--v-theme-error));
-  }
-  .v-selection-control--focus-visible .v-selection-control__input::before {
-    opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
-  }
+.v-selection-control {
+  align-items: center;
+  contain: layout;
+  display: flex;
+  flex: 1 0;
+  grid-area: control;
+  position: relative;
+  user-select: none;
+}
+.v-selection-control .v-label {
+  white-space: normal;
+  word-break: break-word;
+  height: 100%;
+}
+.v-selection-control--disabled {
+  opacity: var(--v-disabled-opacity);
+  pointer-events: none;
+}
+.v-selection-control--error .v-label, .v-selection-control--disabled .v-label {
+  opacity: 1;
+}
+.v-selection-control--error:not(.v-selection-control--disabled) .v-label {
+  color: rgb(var(--v-theme-error));
+}
+.v-selection-control--inline {
+  display: inline-flex;
+  flex: 0 0 auto;
+  min-width: 0;
+  max-width: 100%;
+}
+.v-selection-control--inline .v-label {
+  width: auto;
+}
+.v-selection-control--density-default {
+  --v-selection-control-size: 40px;
+}
+
+.v-selection-control--density-comfortable {
+  --v-selection-control-size: 36px;
+}
+
+.v-selection-control--density-compact {
+  --v-selection-control-size: 28px;
+}
+
+.v-selection-control__wrapper {
+  width: var(--v-selection-control-size);
+  height: var(--v-selection-control-size);
+  display: inline-flex;
+  align-items: center;
+  position: relative;
+  justify-content: center;
+  flex: none;
+}
+
+.v-selection-control__input {
+  width: var(--v-selection-control-size);
+  height: var(--v-selection-control-size);
+  align-items: center;
+  display: flex;
+  flex: none;
+  justify-content: center;
+  position: relative;
+  border-radius: 50%;
+}
+.v-selection-control__input input {
+  cursor: pointer;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0;
+}
+.v-selection-control__input::before {
+  border-radius: 100%;
+  background-color: currentColor;
+  opacity: 0;
+  pointer-events: none;
+}
+.v-selection-control__input::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+.v-selection-control__input:hover::before {
+  opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
+}
+.v-selection-control__input > .v-icon {
+  opacity: var(--v-medium-emphasis-opacity);
+}
+.v-selection-control--disabled .v-selection-control__input > .v-icon, .v-selection-control--dirty .v-selection-control__input > .v-icon, .v-selection-control--error .v-selection-control__input > .v-icon {
+  opacity: 1;
+}
+.v-selection-control--error:not(.v-selection-control--disabled) .v-selection-control__input > .v-icon {
+  color: rgb(var(--v-theme-error));
+}
+.v-selection-control--focus-visible .v-selection-control__input::before {
+  opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
 }

package/lib/components/VSelectionControl/VSelectionControl.mjs

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

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

@@ -79,7 +79,7 @@ type VSelectionControlSlots = {
     input: SelectionControlSlot;
 };
 declare const VSelectionControl: {
-    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
+    new (...args: any[]): vue.CreateComponentPublicInstance<{
         inline: boolean;
         error: boolean;
         style: vue.StyleValue;
@@ -107,11 +107,38 @@ declare const VSelectionControl: {
         trueValue?: any;
         falseValue?: any;
     } & {}, {
-        isFocused: vue.ShallowRef<boolean, boolean>;
-        input: Ref<HTMLInputElement | undefined, HTMLInputElement | undefined>;
+        isFocused: vue.ShallowRef<boolean>;
+        input: Ref<HTMLInputElement | undefined>;
     }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
         'update:modelValue': (value: any) => true;
-    }, "$children" | "v-slots" | "v-slot:default" | "modelValue" | "update:modelValue" | "v-slot:input" | "v-slot:label">, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, {
+    }, "$children" | "v-slots" | "v-slot:default" | "modelValue" | "update:modelValue" | "v-slot:input" | "v-slot:label">, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
+        inline: boolean;
+        error: boolean;
+        style: vue.StyleValue;
+        disabled: boolean | null;
+        multiple: boolean | null;
+        readonly: boolean | null;
+        density: Density;
+        ripple: boolean | {
+            class: string;
+        } | undefined;
+        valueComparator: typeof deepEqual;
+    } & {
+        name?: string | undefined;
+        type?: string | undefined;
+        id?: string | undefined;
+        color?: string | undefined;
+        value?: any;
+        label?: string | undefined;
+        class?: any;
+        theme?: string | undefined;
+        baseColor?: string | undefined;
+        defaultsTarget?: string | undefined;
+        falseIcon?: IconValue | undefined;
+        trueIcon?: IconValue | undefined;
+        trueValue?: any;
+        falseValue?: any;
+    } & {}, {
         inline: boolean;
         error: boolean;
         style: vue.StyleValue;
@@ -133,7 +160,7 @@ declare const VSelectionControl: {
             props: Record<string, unknown>;
         }) => VNode[];
         input: (arg: SelectionControlSlot) => VNode[];
-    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
+    }>>, {
         P: {};
         B: {};
         D: {};
@@ -168,8 +195,8 @@ declare const VSelectionControl: {
         trueValue?: any;
         falseValue?: any;
     } & {}, {
-        isFocused: vue.ShallowRef<boolean, boolean>;
-        input: Ref<HTMLInputElement | undefined, HTMLInputElement | undefined>;
+        isFocused: vue.ShallowRef<boolean>;
+        input: Ref<HTMLInputElement | undefined>;
     }, {}, {}, {}, {
         inline: boolean;
         error: boolean;
@@ -214,8 +241,8 @@ declare const VSelectionControl: {
     trueValue?: any;
     falseValue?: any;
 } & {}, {
-    isFocused: vue.ShallowRef<boolean, boolean>;
-    input: Ref<HTMLInputElement | undefined, HTMLInputElement | undefined>;
+    isFocused: vue.ShallowRef<boolean>;
+    input: Ref<HTMLInputElement | undefined>;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
     'update:modelValue': (value: any) => true;
 }, "$children" | "v-slots" | "v-slot:default" | "modelValue" | "update:modelValue" | "v-slot:input" | "v-slot:label">, string, {
@@ -240,7 +267,7 @@ declare const VSelectionControl: {
         props: Record<string, unknown>;
     }) => VNode[];
     input: (arg: SelectionControlSlot) => VNode[];
-}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T>(props: {
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T>(props: {
     modelValue?: T;
     "onUpdate:modelValue"?: (value: T) => void;
 }, slots: VSelectionControlSlots) => GenericProps<typeof props, typeof slots>) & FilterPropsOptions<{

package/lib/components/VSelectionControlGroup/VSelectionControlGroup.css

@@ -1,11 +1,9 @@
-@layer vuetify.components {
-  .v-selection-control-group {
-    grid-area: control;
-    display: flex;
-    flex-direction: column;
-  }
-  .v-selection-control-group--inline {
-    flex-direction: row;
-    flex-wrap: wrap;
-  }
+.v-selection-control-group {
+  grid-area: control;
+  display: flex;
+  flex-direction: column;
+}
+.v-selection-control-group--inline {
+  flex-direction: row;
+  flex-wrap: wrap;
 }

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

@@ -54,7 +54,7 @@ interface RippleDirectiveBinding extends Omit<DirectiveBinding, 'modifiers' | 'v
 }
 
 declare const VSelectionControlGroup: {
-    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
+    new (...args: any[]): vue.CreateComponentPublicInstance<{
         inline: boolean;
         error: boolean;
         style: vue.StyleValue;
@@ -78,7 +78,29 @@ declare const VSelectionControlGroup: {
         trueIcon?: IconValue | undefined;
     } & {}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
         'update:modelValue': (value: any) => true;
-    }, "$children" | "v-slots" | "v-slot:default" | "modelValue" | "update:modelValue">, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, {
+    }, "$children" | "v-slots" | "v-slot:default" | "modelValue" | "update:modelValue">, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
+        inline: boolean;
+        error: boolean;
+        style: vue.StyleValue;
+        disabled: boolean | null;
+        multiple: boolean | null;
+        readonly: boolean | null;
+        density: Density;
+        ripple: boolean | {
+            class: string;
+        } | undefined;
+        defaultsTarget: string;
+        valueComparator: typeof deepEqual;
+    } & {
+        name?: string | undefined;
+        type?: string | undefined;
+        id?: string | undefined;
+        color?: string | undefined;
+        class?: any;
+        theme?: string | undefined;
+        falseIcon?: IconValue | undefined;
+        trueIcon?: IconValue | undefined;
+    } & {}, {
         inline: boolean;
         error: boolean;
         style: vue.StyleValue;
@@ -93,7 +115,7 @@ declare const VSelectionControlGroup: {
         valueComparator: typeof deepEqual;
     }, true, {}, vue.SlotsType<Partial<{
         default: () => vue.VNode[];
-    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
+    }>>, {
         P: {};
         B: {};
         D: {};
@@ -178,7 +200,7 @@ declare const VSelectionControlGroup: {
     valueComparator: typeof deepEqual;
 }, {}, string, vue.SlotsType<Partial<{
     default: () => vue.VNode[];
-}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T>(props: {
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T>(props: {
     modelValue?: T;
     "onUpdate:modelValue"?: (value: T) => void;
 }, slots: {

package/lib/components/VSheet/VSheet.css

@@ -1,39 +1,37 @@
-@layer vuetify.components {
-  .v-sheet {
-    display: block;
-  }
-  .v-sheet {
-    border-color: rgba(var(--v-border-color), var(--v-border-opacity));
-    border-style: solid;
-    border-width: 0;
-  }
-  .v-sheet--border {
-    border-width: thin;
-    box-shadow: none;
-  }
-  .v-sheet {
-    box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
-  }
-  .v-sheet--absolute {
-    position: absolute;
-  }
-  .v-sheet--fixed {
-    position: fixed;
-  }
-  .v-sheet--relative {
-    position: relative;
-  }
-  .v-sheet--sticky {
-    position: sticky;
-  }
-  .v-sheet {
-    border-radius: 0;
-  }
-  .v-sheet {
-    background: rgb(var(--v-theme-surface));
-    color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
-  }
-  .v-sheet--rounded {
-    border-radius: 4px;
-  }
+.v-sheet {
+  display: block;
+}
+.v-sheet {
+  border-color: rgba(var(--v-border-color), var(--v-border-opacity));
+  border-style: solid;
+  border-width: 0;
+}
+.v-sheet--border {
+  border-width: thin;
+  box-shadow: none;
+}
+.v-sheet {
+  box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-sheet--absolute {
+  position: absolute;
+}
+.v-sheet--fixed {
+  position: fixed;
+}
+.v-sheet--relative {
+  position: relative;
+}
+.v-sheet--sticky {
+  position: sticky;
+}
+.v-sheet {
+  border-radius: 0;
+}
+.v-sheet {
+  background: rgb(var(--v-theme-surface));
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
+}
+.v-sheet--rounded {
+  border-radius: 4px;
 }

package/lib/components/VSheet/VSheet.mjs

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

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

@@ -14,7 +14,7 @@ interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions
 }
 
 declare const VSheet: {
-    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
+    new (...args: any[]): vue.CreateComponentPublicInstance<{
         style: vue.StyleValue;
         tag: string;
         tile: boolean;
@@ -42,14 +42,42 @@ declare const VSheet: {
         } | undefined;
     } & {
         "v-slot:default"?: 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 & {
+        style: vue.StyleValue;
+        tag: string;
+        tile: boolean;
+    } & {
+        location?: Anchor | null | undefined;
+        height?: string | number | undefined;
+        width?: string | number | undefined;
+        border?: string | number | boolean | undefined;
+        color?: string | undefined;
+        maxHeight?: string | number | undefined;
+        maxWidth?: string | number | undefined;
+        minHeight?: string | number | undefined;
+        minWidth?: string | number | undefined;
+        position?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
+        class?: any;
+        theme?: string | undefined;
+        elevation?: string | number | undefined;
+        rounded?: string | number | boolean | undefined;
+    } & {
+        $children?: vue.VNodeChild | {
+            default?: (() => vue.VNodeChild) | undefined;
+        } | (() => vue.VNodeChild);
+        'v-slots'?: {
+            default?: false | (() => vue.VNodeChild) | undefined;
+        } | undefined;
+    } & {
+        "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
+    }, {
         style: vue.StyleValue;
         tag: string;
         rounded: string | number | boolean;
         tile: boolean;
     }, true, {}, vue.SlotsType<Partial<{
         default: () => vue.VNode[];
-    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
+    }>>, {
         P: {};
         B: {};
         D: {};
@@ -128,7 +156,7 @@ declare const VSheet: {
     tile: boolean;
 }, {}, string, vue.SlotsType<Partial<{
     default: () => vue.VNode[];
-}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     theme: StringConstructor;
     tag: {
         type: StringConstructor;