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

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

@@ -108,7 +108,7 @@ type VRadioGroupSlots = Omit<VInputSlots, 'default'> & {
     };
 };
 declare const VRadioGroup: {
-    new (...args: any[]): vue.CreateComponentPublicInstance<{
+    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
         type: string;
         inline: boolean;
         error: boolean;
@@ -154,51 +154,7 @@ declare const VRadioGroup: {
         hideDetails?: boolean | "auto" | undefined;
     } & {}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
         'update:modelValue': (value: any) => true;
-    }, "$children" | "v-slots" | "v-slot:default" | "modelValue" | "v-slot:prepend" | "v-slot:append" | "update:modelValue" | "v-slot:label" | "v-slot:message" | "v-slot:details">, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
-        type: string;
-        inline: boolean;
-        error: boolean;
-        height: string | number;
-        direction: "horizontal" | "vertical";
-        style: vue.StyleValue;
-        disabled: boolean | null;
-        readonly: boolean | null;
-        messages: string | readonly string[];
-        focused: boolean;
-        errorMessages: string | readonly string[] | null;
-        maxErrors: string | number;
-        rules: readonly ValidationRule[];
-        density: Density;
-        ripple: boolean | {
-            class: string;
-        } | undefined;
-        falseIcon: IconValue;
-        trueIcon: IconValue;
-        valueComparator: typeof deepEqual;
-        centerAffix: boolean;
-        hideSpinButtons: boolean;
-        persistentHint: boolean;
-    } & {
-        name?: string | undefined;
-        id?: string | undefined;
-        width?: string | number | undefined;
-        color?: string | undefined;
-        maxWidth?: string | number | undefined;
-        minWidth?: string | number | undefined;
-        label?: string | undefined;
-        class?: any;
-        theme?: string | undefined;
-        'onUpdate:focused'?: ((args_0: boolean) => void) | undefined;
-        validateOn?: ("eager" | "lazy" | ("input" | "blur" | "submit" | "invalid-input") | "input lazy" | "blur lazy" | "submit lazy" | "invalid-input lazy" | "input eager" | "blur eager" | "submit eager" | "invalid-input eager" | "lazy input" | "lazy blur" | "lazy submit" | "lazy invalid-input" | "eager input" | "eager blur" | "eager submit" | "eager invalid-input") | undefined;
-        validationValue?: any;
-        prependIcon?: IconValue | undefined;
-        appendIcon?: IconValue | undefined;
-        defaultsTarget?: string | undefined;
-        'onClick:append'?: ((args_0: MouseEvent) => void) | undefined;
-        'onClick:prepend'?: ((args_0: MouseEvent) => void) | undefined;
-        hint?: string | undefined;
-        hideDetails?: boolean | "auto" | undefined;
-    } & {}, {
+    }, "$children" | "v-slots" | "v-slot:default" | "modelValue" | "v-slot:prepend" | "v-slot:append" | "update:modelValue" | "v-slot:label" | "v-slot:message" | "v-slot:details">, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, {
         type: string;
         inline: boolean;
         error: boolean;
@@ -232,7 +188,7 @@ declare const VRadioGroup: {
             label: string | undefined;
             props: Record<string, any>;
         }) => vue.VNode[];
-    }>>, {
+    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};
@@ -391,7 +347,7 @@ declare const VRadioGroup: {
         label: string | undefined;
         props: Record<string, any>;
     }) => vue.VNode[];
-}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T>(props: {
+}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T>(props: {
     modelValue?: T | null;
     "onUpdate:modelValue"?: (value: T | null) => void;
 }, slots: VRadioGroupSlots) => GenericProps<typeof props, typeof slots>) & FilterPropsOptions<{

package/lib/components/VRangeSlider/VRangeSlider.mjs

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

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

@@ -63,7 +63,7 @@ interface VInputSlot {
 }
 
 declare const VRangeSlider: {
-    new (...args: any[]): vue.CreateComponentPublicInstance<{
+    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
         reverse: boolean;
         max: string | number;
         error: boolean;
@@ -171,110 +171,7 @@ declare const VRangeSlider: {
         'update:modelValue': (value: [number, number]) => true;
         end: (value: [number, number]) => true;
         start: (value: [number, number]) => true;
-    }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
-        reverse: boolean;
-        max: string | number;
-        error: boolean;
-        strict: boolean;
-        min: string | number;
-        direction: "horizontal" | "vertical";
-        style: vue.StyleValue;
-        disabled: boolean | null;
-        readonly: boolean | null;
-        step: string | number;
-        elevation: string | number;
-        messages: string | readonly string[];
-        focused: boolean;
-        errorMessages: string | readonly string[] | null;
-        maxErrors: string | number;
-        rules: readonly ValidationRule[];
-        modelValue: readonly (string | number)[];
-        tile: boolean;
-        density: Density;
-        ripple: boolean;
-        centerAffix: boolean;
-        hideSpinButtons: boolean;
-        persistentHint: boolean;
-        showTicks: boolean | "always";
-        tickSize: string | number;
-        trackSize: string | number;
-        thumbSize: string | number;
-    } & {
-        name?: string | undefined;
-        id?: string | undefined;
-        width?: string | number | undefined;
-        color?: string | undefined;
-        maxWidth?: string | number | undefined;
-        minWidth?: string | number | undefined;
-        label?: string | undefined;
-        class?: any;
-        theme?: string | undefined;
-        'onUpdate:focused'?: ((args_0: boolean) => void) | undefined;
-        validateOn?: ("eager" | "lazy" | ("input" | "blur" | "submit" | "invalid-input") | "input lazy" | "blur lazy" | "submit lazy" | "invalid-input lazy" | "input eager" | "blur eager" | "submit eager" | "invalid-input eager" | "lazy input" | "lazy blur" | "lazy submit" | "lazy invalid-input" | "eager input" | "eager blur" | "eager submit" | "eager invalid-input") | undefined;
-        validationValue?: any;
-        rounded?: string | number | boolean | undefined;
-        prependIcon?: IconValue | undefined;
-        appendIcon?: IconValue | undefined;
-        'onClick:append'?: ((args_0: MouseEvent) => void) | undefined;
-        'onClick:prepend'?: ((args_0: MouseEvent) => void) | undefined;
-        hint?: string | undefined;
-        hideDetails?: boolean | "auto" | undefined;
-        trackColor?: string | undefined;
-        trackFillColor?: string | undefined;
-        thumbColor?: string | undefined;
-        thumbLabel?: boolean | "always" | undefined;
-        ticks?: readonly number[] | Record<number, string> | undefined;
-    } & {
-        $children?: vue.VNodeChild | ((arg: VInputSlot) => vue.VNodeChild) | {
-            default?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-            prepend?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-            append?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-            details?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-            message?: ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
-            'thumb-label'?: ((arg: {
-                modelValue: number;
-            }) => vue.VNodeChild) | undefined;
-            'tick-label'?: ((arg: {
-                tick: Tick;
-                index: number;
-            }) => vue.VNodeChild) | undefined;
-            label?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-        };
-        'v-slots'?: {
-            default?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-            prepend?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-            append?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-            details?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-            message?: false | ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
-            'thumb-label'?: false | ((arg: {
-                modelValue: number;
-            }) => vue.VNodeChild) | undefined;
-            'tick-label'?: false | ((arg: {
-                tick: Tick;
-                index: number;
-            }) => vue.VNodeChild) | undefined;
-            label?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-        } | undefined;
-    } & {
-        "v-slot:default"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-        "v-slot:prepend"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-        "v-slot:append"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-        "v-slot:details"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-        "v-slot:message"?: false | ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
-        "v-slot:thumb-label"?: false | ((arg: {
-            modelValue: number;
-        }) => vue.VNodeChild) | undefined;
-        "v-slot:tick-label"?: false | ((arg: {
-            tick: Tick;
-            index: number;
-        }) => vue.VNodeChild) | undefined;
-        "v-slot:label"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
-    } & {
-        onStart?: ((value: [number, number]) => any) | undefined;
-        onEnd?: ((value: [number, number]) => any) | undefined;
-        "onUpdate:focused"?: ((value: boolean) => any) | undefined;
-        "onUpdate:modelValue"?: ((value: [number, number]) => any) | undefined;
-    }, {
+    }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, {
         reverse: boolean;
         max: string | number;
         error: boolean;
@@ -318,7 +215,7 @@ declare const VRangeSlider: {
             index: number;
         }) => vue.VNode[];
         label: (arg: VInputSlot) => vue.VNode[];
-    }>>, {
+    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};
@@ -614,7 +511,7 @@ declare const VRangeSlider: {
         index: number;
     }) => vue.VNode[];
     label: (arg: VInputSlot) => vue.VNode[];
-}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     strict: BooleanConstructor;
     modelValue: {
         type: PropType<readonly (string | number)[]>;

package/lib/components/VRating/VRating.css

@@ -1,54 +1,53 @@
-.v-rating {
-  max-width: 100%;
-  display: inline-flex;
-  white-space: nowrap;
-}
-.v-rating--readonly {
-  pointer-events: none;
-}
-
-.v-rating__wrapper {
-  align-items: center;
-  display: inline-flex;
-  flex-direction: column;
-}
-.v-rating__wrapper--bottom {
-  flex-direction: column-reverse;
-}
-
-.v-rating__item {
-  display: inline-flex;
-  position: relative;
-}
-.v-rating__item label {
-  cursor: pointer;
-}
-.v-rating__item .v-btn--variant-plain {
-  opacity: 1;
-}
-.v-rating__item .v-btn {
-  transition-property: transform;
-}
-.v-rating__item .v-btn .v-icon {
-  transition: inherit;
-  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
-}
-.v-rating--hover .v-rating__item:hover:not(.v-rating__item--focused) .v-btn {
-  transform: scale(1.25);
-}
-.v-rating__item--half {
-  overflow: hidden;
-  position: absolute;
-  clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%);
-  z-index: 1;
-}
-.v-rating__item--half .v-btn__overlay, .v-rating__item--half:hover .v-btn__overlay {
-  opacity: 0;
-}
-
-.v-rating__hidden {
-  height: 0;
-  opacity: 0;
-  position: absolute;
-  width: 0;
+@layer vuetify.components {
+  .v-rating {
+    max-width: 100%;
+    display: inline-flex;
+    white-space: nowrap;
+  }
+  .v-rating--readonly {
+    pointer-events: none;
+  }
+  .v-rating__wrapper {
+    align-items: center;
+    display: inline-flex;
+    flex-direction: column;
+  }
+  .v-rating__wrapper--bottom {
+    flex-direction: column-reverse;
+  }
+  .v-rating__item {
+    display: inline-flex;
+    position: relative;
+  }
+  .v-rating__item label {
+    cursor: pointer;
+  }
+  .v-rating__item .v-btn--variant-plain {
+    opacity: 1;
+  }
+  .v-rating__item .v-btn {
+    transition-property: transform;
+  }
+  .v-rating__item .v-btn .v-icon {
+    transition: inherit;
+    transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+  }
+  .v-rating--hover .v-rating__item:hover:not(.v-rating__item--focused) .v-btn {
+    transform: scale(1.25);
+  }
+  .v-rating__item--half {
+    overflow: hidden;
+    position: absolute;
+    clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%);
+    z-index: 1;
+  }
+  .v-rating__item--half .v-btn__overlay, .v-rating__item--half:hover .v-btn__overlay {
+    opacity: 0;
+  }
+  .v-rating__hidden {
+    height: 0;
+    opacity: 0;
+    position: absolute;
+    width: 0;
+  }
 }

package/lib/components/VRating/VRating.mjs

@@ -1,4 +1,4 @@
-import { createTextVNode as _createTextVNode, mergeProps as _mergeProps, createVNode as _createVNode, Fragment as _Fragment } from "vue";
+import { Fragment as _Fragment, createVNode as _createVNode, mergeProps as _mergeProps, createTextVNode as _createTextVNode } from "vue";
 // Styles
 import "./VRating.css";
 

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

@@ -31,7 +31,7 @@ type VRatingItemLabelSlot = {
     label?: string;
 };
 declare const VRating: {
-    new (...args: any[]): vue.CreateComponentPublicInstance<{
+    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
         length: string | number;
         style: vue.StyleValue;
         disabled: boolean;
@@ -71,45 +71,7 @@ declare const VRating: {
         "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
     }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
         'update:modelValue': (value: number | string) => true;
-    }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
-        length: string | number;
-        style: vue.StyleValue;
-        disabled: boolean;
-        size: string | number;
-        readonly: boolean;
-        tag: string;
-        modelValue: string | number;
-        density: Density;
-        ripple: boolean;
-        clearable: boolean;
-        hover: boolean;
-        itemAriaLabel: string;
-        emptyIcon: IconValue;
-        fullIcon: IconValue;
-        halfIncrements: boolean;
-        itemLabelPosition: string;
-    } & {
-        name?: string | undefined;
-        color?: string | undefined;
-        class?: any;
-        theme?: string | undefined;
-        activeColor?: string | undefined;
-        itemLabels?: string[] | undefined;
-    } & {
-        $children?: {} | vue.VNodeChild | {
-            item?: ((arg: VRatingItemSlot) => vue.VNodeChild) | undefined;
-            'item-label'?: ((arg: VRatingItemLabelSlot) => vue.VNodeChild) | undefined;
-        };
-        'v-slots'?: {
-            item?: false | ((arg: VRatingItemSlot) => vue.VNodeChild) | undefined;
-            'item-label'?: false | ((arg: VRatingItemLabelSlot) => vue.VNodeChild) | undefined;
-        } | undefined;
-    } & {
-        "v-slot:item"?: false | ((arg: VRatingItemSlot) => vue.VNodeChild) | undefined;
-        "v-slot:item-label"?: false | ((arg: VRatingItemLabelSlot) => vue.VNodeChild) | undefined;
-    } & {
-        "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
-    }, {
+    }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, {
         length: string | number;
         style: vue.StyleValue;
         disabled: boolean;
@@ -129,7 +91,7 @@ declare const VRating: {
     }, true, {}, vue.SlotsType<Partial<{
         item: (arg: VRatingItemSlot) => vue.VNode[];
         'item-label': (arg: VRatingItemLabelSlot) => vue.VNode[];
-    }>>, {
+    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};
@@ -255,7 +217,7 @@ declare const VRating: {
 }, {}, string, vue.SlotsType<Partial<{
     item: (arg: VRatingItemSlot) => vue.VNode[];
     'item-label': (arg: VRatingItemLabelSlot) => vue.VNode[];
-}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     theme: StringConstructor;
     tag: {
         type: StringConstructor;

package/lib/components/VResponsive/VResponsive.css

@@ -1,27 +1,26 @@
-.v-responsive {
-  display: flex;
-  flex: 1 0 auto;
-  max-height: 100%;
-  max-width: 100%;
-  overflow: hidden;
-  position: relative;
-}
-.v-responsive--inline {
-  display: inline-flex;
-  flex: 0 0 auto;
-}
-
-.v-responsive__content {
-  flex: 1 0 0px;
-  max-width: 100%;
-}
-
-.v-responsive__sizer ~ .v-responsive__content {
-  margin-inline-start: -100%;
-}
-
-.v-responsive__sizer {
-  flex: 1 0 0px;
-  transition: padding-bottom 0.2s cubic-bezier(0.4, 0, 0.2, 1);
-  pointer-events: none;
+@layer vuetify.components {
+  .v-responsive {
+    display: flex;
+    flex: 1 0 auto;
+    max-height: 100%;
+    max-width: 100%;
+    overflow: hidden;
+    position: relative;
+  }
+  .v-responsive--inline {
+    display: inline-flex;
+    flex: 0 0 auto;
+  }
+  .v-responsive__content {
+    flex: 1 0 0px;
+    max-width: 100%;
+  }
+  .v-responsive__sizer ~ .v-responsive__content {
+    margin-inline-start: -100%;
+  }
+  .v-responsive__sizer {
+    flex: 1 0 0px;
+    transition: padding-bottom 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+    pointer-events: none;
+  }
 }

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

@@ -8,7 +8,7 @@ interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions
 type ClassValue = any;
 
 declare const VResponsive: {
-    new (...args: any[]): vue.CreateComponentPublicInstance<{
+    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
         inline: boolean;
         style: vue.StyleValue;
     } & {
@@ -33,38 +33,13 @@ declare const VResponsive: {
     } & {
         "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
         "v-slot:additional"?: false | (() => vue.VNodeChild) | undefined;
-    }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
-        inline: boolean;
-        style: vue.StyleValue;
-    } & {
-        height?: string | number | undefined;
-        width?: string | number | undefined;
-        aspectRatio?: string | number | undefined;
-        maxHeight?: string | number | undefined;
-        maxWidth?: string | number | undefined;
-        minHeight?: string | number | undefined;
-        minWidth?: string | number | undefined;
-        class?: any;
-        contentClass?: any;
-    } & {
-        $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
-            default?: (() => vue.VNodeChild) | undefined;
-            additional?: (() => vue.VNodeChild) | undefined;
-        };
-        'v-slots'?: {
-            default?: false | (() => vue.VNodeChild) | undefined;
-            additional?: false | (() => vue.VNodeChild) | undefined;
-        } | undefined;
-    } & {
-        "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-        "v-slot:additional"?: false | (() => vue.VNodeChild) | undefined;
-    }, {
+    }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, {
         inline: boolean;
         style: vue.StyleValue;
     }, true, {}, vue.SlotsType<Partial<{
         default: () => vue.VNode[];
         additional: () => vue.VNode[];
-    }>>, {
+    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};
@@ -134,7 +109,7 @@ declare const VResponsive: {
 }, {}, string, vue.SlotsType<Partial<{
     default: () => vue.VNode[];
     additional: () => vue.VNode[];
-}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     height: (StringConstructor | NumberConstructor)[];
     maxHeight: (StringConstructor | NumberConstructor)[];
     maxWidth: (StringConstructor | NumberConstructor)[];

package/lib/components/VSelect/VSelect.css

@@ -1,53 +1,55 @@
-.v-select .v-field .v-text-field__prefix,
-.v-select .v-field .v-text-field__suffix,
-.v-select .v-field .v-field__input, .v-select .v-field.v-field {
-  cursor: pointer;
-}
-.v-select .v-field .v-field__input > input {
-  align-self: flex-start;
-  opacity: 1;
-  flex: 0 0;
-  position: absolute;
-  width: 100%;
-  transition: none;
-  pointer-events: none;
-  caret-color: transparent;
-}
-.v-select .v-field--dirty .v-select__selection {
-  margin-inline-end: 2px;
-}
-.v-select .v-select__selection-text {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-.v-select__content {
-  overflow: hidden;
-}
-.v-select__content {
-  box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
-}
-.v-select__content {
-  border-radius: 4px;
-}
-.v-select__selection {
-  display: inline-flex;
-  align-items: center;
-  letter-spacing: inherit;
-  line-height: inherit;
-  max-width: 100%;
-}
-.v-select .v-select__selection:first-child {
-  margin-inline-start: 0;
-}
-.v-select--selected .v-field .v-field__input > input {
-  opacity: 0;
-}
-.v-select__menu-icon {
-  margin-inline-start: 4px;
-  transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
-}
-.v-select--active-menu .v-select__menu-icon {
-  opacity: var(--v-high-emphasis-opacity);
-  transform: rotate(180deg);
+@layer vuetify.components {
+  .v-select .v-field .v-text-field__prefix,
+  .v-select .v-field .v-text-field__suffix,
+  .v-select .v-field .v-field__input, .v-select .v-field.v-field {
+    cursor: pointer;
+  }
+  .v-select .v-field .v-field__input > input {
+    align-self: flex-start;
+    opacity: 1;
+    flex: 0 0;
+    position: absolute;
+    width: 100%;
+    transition: none;
+    pointer-events: none;
+    caret-color: transparent;
+  }
+  .v-select .v-field--dirty .v-select__selection {
+    margin-inline-end: 2px;
+  }
+  .v-select .v-select__selection-text {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .v-select__content {
+    overflow: hidden;
+  }
+  .v-select__content {
+    box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+  }
+  .v-select__content {
+    border-radius: 4px;
+  }
+  .v-select__selection {
+    display: inline-flex;
+    align-items: center;
+    letter-spacing: inherit;
+    line-height: inherit;
+    max-width: 100%;
+  }
+  .v-select .v-select__selection:first-child {
+    margin-inline-start: 0;
+  }
+  .v-select--selected .v-field .v-field__input > input {
+    opacity: 0;
+  }
+  .v-select__menu-icon {
+    margin-inline-start: 4px;
+    transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+  }
+  .v-select--active-menu .v-select__menu-icon {
+    opacity: var(--v-high-emphasis-opacity);
+    transform: rotate(180deg);
+  }
 }

package/lib/components/VSelect/VSelect.mjs

@@ -1,4 +1,4 @@
-import { createTextVNode as _createTextVNode, mergeProps as _mergeProps, createVNode as _createVNode, Fragment as _Fragment } from "vue";
+import { Fragment as _Fragment, createVNode as _createVNode, mergeProps as _mergeProps, createTextVNode as _createTextVNode } from "vue";
 // Styles
 import "./VSelect.css";