@vuetify/nightly 3.0.0-beta.10 → 3.0.0-beta.15

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

@@ -0,0 +1,348 @@
+import * as vue from 'vue';
+import { JSXComponent, PropType, VNodeChild, Prop } from 'vue';
+
+declare type Density = null | 'default' | 'comfortable' | 'compact';
+
+declare type IconValue = string | JSXComponent;
+declare const IconValue: PropType<IconValue>;
+
+declare type SlotsToProps<T extends Record<string, any>> = T extends Record<string, Slot> ? ({
+    $children?: (VNodeChild | (keyof T extends 'default' ? T['default'] : {}) | {
+        [K in keyof T]?: T[K];
+    });
+    'v-slots'?: {
+        [K in keyof T]?: T[K] | false;
+    };
+} & {
+    [K in keyof T as `v-slot:${K & string}`]?: T[K] | false;
+}) : T extends Record<string, any[]> ? SlotsToProps<MakeSlots<T>> : never;
+declare type Slot<T extends any[] = any[]> = (...args: T) => VNodeChild;
+declare type MakeSlots<T extends Record<string, any[]>> = {
+    [K in keyof T]?: Slot<T[K]>;
+};
+
+declare type VRatingItemSlot = {
+    value: number;
+    index: number;
+    isFilled: boolean;
+    isHovered: boolean;
+    icon: IconValue;
+    color?: string;
+    props: Record<string, unknown>;
+};
+declare type VRatingItemLabelSlot = {
+    value: number;
+    index: number;
+    label?: string;
+};
+declare const VRating: {
+    new (...args: any[]): {
+        $: vue.ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            length: string | number;
+            disabled: boolean;
+            size: string | number;
+            readonly: boolean;
+            tag: string;
+            density: Density;
+            modelValue: number;
+            ripple: boolean;
+            clearable: boolean;
+            hover: boolean;
+            halfIncrements: boolean;
+            itemAriaLabel: string;
+            emptyIcon: IconValue;
+            fullIcon: IconValue;
+            itemLabelPosition: string;
+        }> & Omit<Readonly<vue.ExtractPropTypes<Omit<{
+            theme: StringConstructor;
+            tag: {
+                type: StringConstructor;
+                default: string;
+            };
+            size: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: string;
+            };
+            density: {
+                type: vue.PropType<Density>;
+                default: string;
+                validator: (v: any) => boolean;
+            };
+            name: StringConstructor;
+            itemAriaLabel: {
+                type: StringConstructor;
+                default: string;
+            };
+            activeColor: StringConstructor;
+            color: StringConstructor;
+            clearable: BooleanConstructor;
+            disabled: BooleanConstructor;
+            emptyIcon: {
+                type: vue.PropType<IconValue>;
+                default: string;
+            };
+            fullIcon: {
+                type: vue.PropType<IconValue>;
+                default: string;
+            };
+            halfIncrements: BooleanConstructor;
+            hover: BooleanConstructor;
+            length: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: number;
+            };
+            readonly: BooleanConstructor;
+            modelValue: {
+                type: NumberConstructor;
+                default: number;
+            };
+            itemLabels: Prop<string[], string[]>;
+            itemLabelPosition: {
+                type: StringConstructor;
+                default: string;
+                validator: (v: any) => boolean;
+            };
+            ripple: BooleanConstructor;
+        }, "$children" | "v-slots" | "v-slot:item" | "v-slot:item-label">>> & {
+            "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "length" | "disabled" | "size" | "readonly" | "tag" | "density" | "modelValue" | "ripple" | "clearable" | "hover" | "halfIncrements" | "itemAriaLabel" | "emptyIcon" | "fullIcon" | "itemLabelPosition">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: vue.Slot | undefined;
+        }>;
+        $root: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $parent: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $emit: (event: "update:modelValue", value: number) => void;
+        $el: any;
+        $options: vue.ComponentOptionsBase<Readonly<vue.ExtractPropTypes<Omit<{
+            theme: StringConstructor;
+            tag: {
+                type: StringConstructor;
+                default: string;
+            };
+            size: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: string;
+            };
+            density: {
+                type: vue.PropType<Density>;
+                default: string;
+                validator: (v: any) => boolean;
+            };
+            name: StringConstructor;
+            itemAriaLabel: {
+                type: StringConstructor;
+                default: string;
+            };
+            activeColor: StringConstructor;
+            color: StringConstructor;
+            clearable: BooleanConstructor;
+            disabled: BooleanConstructor;
+            emptyIcon: {
+                type: vue.PropType<IconValue>;
+                default: string;
+            };
+            fullIcon: {
+                type: vue.PropType<IconValue>;
+                default: string;
+            };
+            halfIncrements: BooleanConstructor;
+            hover: BooleanConstructor;
+            length: {
+                type: (StringConstructor | NumberConstructor)[];
+                default: number;
+            };
+            readonly: BooleanConstructor;
+            modelValue: {
+                type: NumberConstructor;
+                default: number;
+            };
+            itemLabels: Prop<string[], string[]>;
+            itemLabelPosition: {
+                type: StringConstructor;
+                default: string;
+                validator: (v: any) => boolean;
+            };
+            ripple: BooleanConstructor;
+        }, "$children" | "v-slots" | "v-slot:item" | "v-slot:item-label">>> & {
+            "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+        }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
+            'update:modelValue': (value: number) => boolean;
+        }, "$children" | "v-slots" | "v-slot:item" | "v-slot:item-label">, string, {
+            length: string | number;
+            disabled: boolean;
+            size: string | number;
+            readonly: boolean;
+            tag: string;
+            density: Density;
+            modelValue: number;
+            ripple: boolean;
+            clearable: boolean;
+            hover: boolean;
+            halfIncrements: boolean;
+            itemAriaLabel: string;
+            emptyIcon: IconValue;
+            fullIcon: IconValue;
+            itemLabelPosition: string;
+        }> & {
+            beforeCreate?: ((() => void) | (() => void)[]) | undefined;
+            created?: ((() => void) | (() => void)[]) | undefined;
+            beforeMount?: ((() => void) | (() => void)[]) | undefined;
+            mounted?: ((() => void) | (() => void)[]) | undefined;
+            beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
+            updated?: ((() => void) | (() => void)[]) | undefined;
+            activated?: ((() => void) | (() => void)[]) | undefined;
+            deactivated?: ((() => void) | (() => void)[]) | undefined;
+            beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
+            beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
+            destroyed?: ((() => void) | (() => void)[]) | undefined;
+            unmounted?: ((() => void) | (() => void)[]) | undefined;
+            renderTracked?: (((e: vue.DebuggerEvent) => void) | ((e: vue.DebuggerEvent) => void)[]) | undefined;
+            renderTriggered?: (((e: vue.DebuggerEvent) => void) | ((e: vue.DebuggerEvent) => void)[]) | undefined;
+            errorCaptured?: (((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof vue.nextTick;
+        $watch(source: string | Function, cb: Function, options?: vue.WatchOptions<boolean> | undefined): vue.WatchStopHandle;
+    } & Readonly<vue.ExtractPropTypes<Omit<{
+        theme: StringConstructor;
+        tag: {
+            type: StringConstructor;
+            default: string;
+        };
+        size: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: string;
+        };
+        density: {
+            type: vue.PropType<Density>;
+            default: string;
+            validator: (v: any) => boolean;
+        };
+        name: StringConstructor;
+        itemAriaLabel: {
+            type: StringConstructor;
+            default: string;
+        };
+        activeColor: StringConstructor;
+        color: StringConstructor;
+        clearable: BooleanConstructor;
+        disabled: BooleanConstructor;
+        emptyIcon: {
+            type: vue.PropType<IconValue>;
+            default: string;
+        };
+        fullIcon: {
+            type: vue.PropType<IconValue>;
+            default: string;
+        };
+        halfIncrements: BooleanConstructor;
+        hover: BooleanConstructor;
+        length: {
+            type: (StringConstructor | NumberConstructor)[];
+            default: number;
+        };
+        readonly: BooleanConstructor;
+        modelValue: {
+            type: NumberConstructor;
+            default: number;
+        };
+        itemLabels: Prop<string[], string[]>;
+        itemLabelPosition: {
+            type: StringConstructor;
+            default: string;
+            validator: (v: any) => boolean;
+        };
+        ripple: BooleanConstructor;
+    }, "$children" | "v-slots" | "v-slot:item" | "v-slot:item-label">>> & {
+        "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+    } & vue.ShallowUnwrapRef<{}> & {} & vue.ComponentCustomProperties;
+    __isFragment?: undefined;
+    __isTeleport?: undefined;
+    __isSuspense?: undefined;
+} & vue.ComponentOptionsBase<Readonly<vue.ExtractPropTypes<Omit<{
+    theme: StringConstructor;
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+    size: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    density: {
+        type: vue.PropType<Density>;
+        default: string;
+        validator: (v: any) => boolean;
+    };
+    name: StringConstructor;
+    itemAriaLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    activeColor: StringConstructor;
+    color: StringConstructor;
+    clearable: BooleanConstructor;
+    disabled: BooleanConstructor;
+    emptyIcon: {
+        type: vue.PropType<IconValue>;
+        default: string;
+    };
+    fullIcon: {
+        type: vue.PropType<IconValue>;
+        default: string;
+    };
+    halfIncrements: BooleanConstructor;
+    hover: BooleanConstructor;
+    length: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
+    readonly: BooleanConstructor;
+    modelValue: {
+        type: NumberConstructor;
+        default: number;
+    };
+    itemLabels: Prop<string[], string[]>;
+    itemLabelPosition: {
+        type: StringConstructor;
+        default: string;
+        validator: (v: any) => boolean;
+    };
+    ripple: BooleanConstructor;
+}, "$children" | "v-slots" | "v-slot:item" | "v-slot:item-label">>> & {
+    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
+    'update:modelValue': (value: number) => boolean;
+}, "$children" | "v-slots" | "v-slot:item" | "v-slot:item-label">, string, {
+    length: string | number;
+    disabled: boolean;
+    size: string | number;
+    readonly: boolean;
+    tag: string;
+    density: Density;
+    modelValue: number;
+    ripple: boolean;
+    clearable: boolean;
+    hover: boolean;
+    halfIncrements: boolean;
+    itemAriaLabel: string;
+    emptyIcon: IconValue;
+    fullIcon: IconValue;
+    itemLabelPosition: string;
+}> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T>() => {
+    $props: SlotsToProps<{
+        item: [VRatingItemSlot];
+        'item-label': [VRatingItemLabelSlot];
+    }>;
+});
+declare type VRating = InstanceType<typeof VRating>;
+
+export { VRating };

package/lib/components/VRating/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["VRating"],"sources":["../../../src/components/VRating/index.ts"],"sourcesContent":["export { VRating } from './VRating'\n"],"mappings":"SAASA,O"}
+{"version":3,"file":"index.mjs","names":["VRating"],"sources":["../../../src/components/VRating/index.ts"],"sourcesContent":["export { VRating } from './VRating'\n"],"mappings":"SAASA,OAAO"}

package/lib/components/VResponsive/VResponsive.mjs

@@ -1,9 +1,9 @@
 import { createVNode as _createVNode } from "vue";
 // Styles
-import "./VResponsive.css"; // Composables
+import "./VResponsive.css";
 
+// Composables
 import { makeDimensionProps, useDimension } from "../../composables/dimensions.mjs"; // Utilities
-
 import { computed } from 'vue';
 import { defineComponent, useRender } from "../../util/index.mjs";
 export function useAspectStyles(props) {
@@ -23,7 +23,6 @@ export const VResponsive = defineComponent({
     contentClass: String,
     ...makeDimensionProps()
   },
-
   setup(props, _ref) {
     let {
       slots
@@ -36,7 +35,6 @@ export const VResponsive = defineComponent({
     } = useDimension(props);
     useRender(() => {
       var _slots$additional;
-
       return _createVNode("div", {
         "class": "v-responsive",
         "style": dimensionStyles.value
@@ -49,6 +47,5 @@ export const VResponsive = defineComponent({
     });
     return {};
   }
-
 });
 //# sourceMappingURL=VResponsive.mjs.map

package/lib/components/VResponsive/VResponsive.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VResponsive.mjs","names":["makeDimensionProps","useDimension","computed","defineComponent","useRender","useAspectStyles","props","aspectStyles","ratio","Number","aspectRatio","paddingBottom","String","undefined","VResponsive","name","contentClass","setup","slots","dimensionStyles","value","additional","default"],"sources":["../../../src/components/VResponsive/VResponsive.tsx"],"sourcesContent":["// Styles\nimport './VResponsive.sass'\n\n// Composables\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\n\n// Utilities\nimport { computed } from 'vue'\nimport { defineComponent, useRender } from '@/util'\n\nexport function useAspectStyles (props: { aspectRatio?: string | number }) {\n  return {\n    aspectStyles: computed(() => {\n      const ratio = Number(props.aspectRatio)\n\n      return ratio\n        ? { paddingBottom: String(1 / ratio * 100) + '%' }\n        : undefined\n    }),\n  }\n}\n\nexport const VResponsive = defineComponent({\n  name: 'VResponsive',\n\n  props: {\n    aspectRatio: [String, Number],\n    contentClass: String,\n\n    ...makeDimensionProps(),\n  },\n\n  setup (props, { slots }) {\n    const { aspectStyles } = useAspectStyles(props)\n    const { dimensionStyles } = useDimension(props)\n\n    useRender(() => (\n      <div class=\"v-responsive\" style={ dimensionStyles.value }>\n        <div class=\"v-responsive__sizer\" style={ aspectStyles.value } />\n\n        { slots.additional?.() }\n\n        { slots.default && (\n          <div class={['v-responsive__content', props.contentClass]}>{ slots.default() }</div>\n        )}\n      </div>\n    ))\n\n    return {}\n  },\n})\n"],"mappings":";AAAA;AACA,2B,CAEA;;SACSA,kB,EAAoBC,Y,4CAE7B;;AACA,SAASC,QAAT,QAAyB,KAAzB;SACSC,e,EAAiBC,S;AAE1B,OAAO,SAASC,eAAT,CAA0BC,KAA1B,EAAoE;EACzE,OAAO;IACLC,YAAY,EAAEL,QAAQ,CAAC,MAAM;MAC3B,MAAMM,KAAK,GAAGC,MAAM,CAACH,KAAK,CAACI,WAAP,CAApB;MAEA,OAAOF,KAAK,GACR;QAAEG,aAAa,EAAEC,MAAM,CAAC,IAAIJ,KAAJ,GAAY,GAAb,CAAN,GAA0B;MAA3C,CADQ,GAERK,SAFJ;IAGD,CANqB;EADjB,CAAP;AASD;AAED,OAAO,MAAMC,WAAW,GAAGX,eAAe,CAAC;EACzCY,IAAI,EAAE,aADmC;EAGzCT,KAAK,EAAE;IACLI,WAAW,EAAE,CAACE,MAAD,EAASH,MAAT,CADR;IAELO,YAAY,EAAEJ,MAFT;IAIL,GAAGZ,kBAAkB;EAJhB,CAHkC;;EAUzCiB,KAAK,CAAEX,KAAF,QAAoB;IAAA,IAAX;MAAEY;IAAF,CAAW;IACvB,MAAM;MAAEX;IAAF,IAAmBF,eAAe,CAACC,KAAD,CAAxC;IACA,MAAM;MAAEa;IAAF,IAAsBlB,YAAY,CAACK,KAAD,CAAxC;IAEAF,SAAS,CAAC;MAAA;;MAAA;QAAA,SACG,cADH;QAAA,SAC0Be,eAAe,CAACC;MAD1C;QAAA,SAEK,qBAFL;QAAA,SAEmCb,YAAY,CAACa;MAFhD,+BAIJF,KAAK,CAACG,UAJF,qBAIJ,uBAAAH,KAAK,CAJD,EAMJA,KAAK,CAACI,OAAN;QAAA,SACY,CAAC,uBAAD,EAA0BhB,KAAK,CAACU,YAAhC;MADZ,IAC6DE,KAAK,CAACI,OAAN,EAD7D,EANI;IAAA,CAAD,CAAT;IAYA,OAAO,EAAP;EACD;;AA3BwC,CAAD,CAAnC"}
+{"version":3,"file":"VResponsive.mjs","names":["makeDimensionProps","useDimension","computed","defineComponent","useRender","useAspectStyles","props","aspectStyles","ratio","Number","aspectRatio","paddingBottom","String","undefined","VResponsive","name","contentClass","setup","slots","dimensionStyles","value","additional","default"],"sources":["../../../src/components/VResponsive/VResponsive.tsx"],"sourcesContent":["// Styles\nimport './VResponsive.sass'\n\n// Composables\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\n\n// Utilities\nimport { computed } from 'vue'\nimport { defineComponent, useRender } from '@/util'\n\nexport function useAspectStyles (props: { aspectRatio?: string | number }) {\n  return {\n    aspectStyles: computed(() => {\n      const ratio = Number(props.aspectRatio)\n\n      return ratio\n        ? { paddingBottom: String(1 / ratio * 100) + '%' }\n        : undefined\n    }),\n  }\n}\n\nexport const VResponsive = defineComponent({\n  name: 'VResponsive',\n\n  props: {\n    aspectRatio: [String, Number],\n    contentClass: String,\n\n    ...makeDimensionProps(),\n  },\n\n  setup (props, { slots }) {\n    const { aspectStyles } = useAspectStyles(props)\n    const { dimensionStyles } = useDimension(props)\n\n    useRender(() => (\n      <div class=\"v-responsive\" style={ dimensionStyles.value }>\n        <div class=\"v-responsive__sizer\" style={ aspectStyles.value } />\n\n        { slots.additional?.() }\n\n        { slots.default && (\n          <div class={['v-responsive__content', props.contentClass]}>{ slots.default() }</div>\n        )}\n      </div>\n    ))\n\n    return {}\n  },\n})\n\nexport type VResponsive = InstanceType<typeof VResponsive>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,kBAAkB,EAAEC,YAAY,4CAEzC;AACA,SAASC,QAAQ,QAAQ,KAAK;AAAA,SACrBC,eAAe,EAAEC,SAAS;AAEnC,OAAO,SAASC,eAAe,CAAEC,KAAwC,EAAE;EACzE,OAAO;IACLC,YAAY,EAAEL,QAAQ,CAAC,MAAM;MAC3B,MAAMM,KAAK,GAAGC,MAAM,CAACH,KAAK,CAACI,WAAW,CAAC;MAEvC,OAAOF,KAAK,GACR;QAAEG,aAAa,EAAEC,MAAM,CAAC,CAAC,GAAGJ,KAAK,GAAG,GAAG,CAAC,GAAG;MAAI,CAAC,GAChDK,SAAS;IACf,CAAC;EACH,CAAC;AACH;AAEA,OAAO,MAAMC,WAAW,GAAGX,eAAe,CAAC;EACzCY,IAAI,EAAE,aAAa;EAEnBT,KAAK,EAAE;IACLI,WAAW,EAAE,CAACE,MAAM,EAAEH,MAAM,CAAC;IAC7BO,YAAY,EAAEJ,MAAM;IAEpB,GAAGZ,kBAAkB;EACvB,CAAC;EAEDiB,KAAK,CAAEX,KAAK,QAAa;IAAA,IAAX;MAAEY;IAAM,CAAC;IACrB,MAAM;MAAEX;IAAa,CAAC,GAAGF,eAAe,CAACC,KAAK,CAAC;IAC/C,MAAM;MAAEa;IAAgB,CAAC,GAAGlB,YAAY,CAACK,KAAK,CAAC;IAE/CF,SAAS,CAAC;MAAA;MAAA;QAAA,SACG,cAAc;QAAA,SAASe,eAAe,CAACC;MAAK;QAAA,SAC1C,qBAAqB;QAAA,SAASb,YAAY,CAACa;MAAK,+BAEzDF,KAAK,CAACG,UAAU,qBAAhB,uBAAAH,KAAK,CAAe,EAEpBA,KAAK,CAACI,OAAO;QAAA,SACD,CAAC,uBAAuB,EAAEhB,KAAK,CAACU,YAAY;MAAC,IAAIE,KAAK,CAACI,OAAO,EAAE,EAC7E;IAAA,CAEJ,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

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

@@ -0,0 +1,24 @@
+import * as vue from 'vue';
+
+declare const VResponsive: vue.DefineComponent<{
+    height: (StringConstructor | NumberConstructor)[];
+    maxHeight: (StringConstructor | NumberConstructor)[];
+    maxWidth: (StringConstructor | NumberConstructor)[];
+    minHeight: (StringConstructor | NumberConstructor)[];
+    minWidth: (StringConstructor | NumberConstructor)[];
+    width: (StringConstructor | NumberConstructor)[];
+    aspectRatio: (StringConstructor | NumberConstructor)[];
+    contentClass: StringConstructor;
+}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    height: (StringConstructor | NumberConstructor)[];
+    maxHeight: (StringConstructor | NumberConstructor)[];
+    maxWidth: (StringConstructor | NumberConstructor)[];
+    minHeight: (StringConstructor | NumberConstructor)[];
+    minWidth: (StringConstructor | NumberConstructor)[];
+    width: (StringConstructor | NumberConstructor)[];
+    aspectRatio: (StringConstructor | NumberConstructor)[];
+    contentClass: StringConstructor;
+}>>, {}>;
+declare type VResponsive = InstanceType<typeof VResponsive>;
+
+export { VResponsive };

package/lib/components/VResponsive/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["VResponsive"],"sources":["../../../src/components/VResponsive/index.ts"],"sourcesContent":["export { VResponsive } from './VResponsive'\n"],"mappings":"SAASA,W"}
+{"version":3,"file":"index.mjs","names":["VResponsive"],"sources":["../../../src/components/VResponsive/index.ts"],"sourcesContent":["export { VResponsive } from './VResponsive'\n"],"mappings":"SAASA,WAAW"}

package/lib/components/VSelect/VSelect.css

@@ -1,3 +1,15 @@
+.v-input--density-default {
+  --select-chips-margin-bottom: 0px;
+}
+
+.v-input--density-comfortable {
+  --select-chips-margin-bottom: 2px;
+}
+
+.v-input--density-compact {
+  --select-chips-margin-bottom: 4px;
+}
+
 .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 {
@@ -41,6 +53,7 @@
 }
 .v-select--chips .v-select__selection {
   margin-top: 2px;
+  margin-bottom: var(--select-chips-margin-bottom);
 }
 .v-select--chips .v-select__selection:first-child {
   margin-inline-start: 0;

package/lib/components/VSelect/VSelect.mjs

@@ -1,7 +1,8 @@
 import { createTextVNode as _createTextVNode, mergeProps as _mergeProps, createVNode as _createVNode, Fragment as _Fragment } from "vue";
 // Styles
-import "./VSelect.css"; // Components
+import "./VSelect.css";
 
+// Components
 import { VDialogTransition } from "../transitions/index.mjs";
 import { VCheckboxBtn } from "../VCheckbox/index.mjs";
 import { VChip } from "../VChip/index.mjs";
@@ -9,17 +10,14 @@ import { VDefaultsProvider } from "../VDefaultsProvider/index.mjs";
 import { VList, VListItem } from "../VList/index.mjs";
 import { VMenu } from "../VMenu/index.mjs";
 import { VTextField } from "../VTextField/index.mjs"; // Composables
-
 import { makeItemsProps, useItems } from "../../composables/items.mjs";
 import { makeTransitionProps } from "../../composables/transition.mjs";
 import { forwardRefs } from "../../composables/forwardRefs.mjs";
 import { useLocale } from "../../composables/locale.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs";
 import { IconValue } from "../../composables/icons.mjs"; // Utility
-
 import { computed, mergeProps, ref } from 'vue';
 import { genericComponent, propsFactory, useRender, wrapInArray } from "../../util/index.mjs"; // Types
-
 export const makeSelectProps = propsFactory({
   chips: Boolean,
   closableChips: Boolean,
@@ -51,7 +49,8 @@ export const makeSelectProps = propsFactory({
 }, 'select');
 export const VSelect = genericComponent()({
   name: 'VSelect',
-  props: { ...makeSelectProps(),
+  props: {
+    ...makeSelectProps(),
     ...makeTransitionProps({
       transition: {
         component: VDialogTransition
@@ -62,7 +61,6 @@ export const VSelect = genericComponent()({
     'update:modelValue': val => true,
     'update:menu': val => true
   },
-
   setup(props, _ref) {
     let {
       slots
@@ -87,36 +85,28 @@ export const VSelect = genericComponent()({
       });
     });
     const selected = computed(() => selections.value.map(selection => selection.props.value));
-
     function onClear(e) {
       model.value = [];
-
       if (props.openOnClear) {
         menu.value = true;
       }
     }
-
     function onClickControl() {
       if (props.hideNoData && !items.value.length || props.readonly) return;
       menu.value = !menu.value;
     }
-
     function onKeydown(e) {
       if (props.readonly) return;
-
       if (['Enter', 'ArrowDown', ' '].includes(e.key)) {
         menu.value = true;
       }
-
       if (['Escape', 'Tab'].includes(e.key)) {
         menu.value = false;
       }
     }
-
     function select(item) {
       if (props.multiple) {
         const index = selected.value.findIndex(selection => selection === item.value);
-
         if (index === -1) {
           model.value = [...model.value, item];
         } else {
@@ -129,7 +119,6 @@ export const VSelect = genericComponent()({
         menu.value = false;
       }
     }
-
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
       return _createVNode(VTextField, {
@@ -138,7 +127,7 @@ export const VSelect = genericComponent()({
         "onUpdate:modelValue": v => {
           if (v == null) model.value = [];
         },
-        "validationValue": props.modelValue ?? model.value,
+        "validationValue": model.externalValue,
         "dirty": model.value.length > 0,
         "class": ['v-select', {
           'v-select--active-menu': menu.value,
@@ -152,10 +141,10 @@ export const VSelect = genericComponent()({
         "onClick:control": onClickControl,
         "onBlur": () => menu.value = false,
         "onKeydown": onKeydown
-      }, { ...slots,
+      }, {
+        ...slots,
         default: () => {
           var _slots$noData, _slots$prependItem, _slots$appendItem;
-
           return _createVNode(_Fragment, null, [_createVNode(VMenu, _mergeProps({
             "modelValue": menu.value,
             "onUpdate:modelValue": $event => menu.value = $event,
@@ -175,7 +164,6 @@ export const VSelect = genericComponent()({
                 "title": t(props.noDataText)
               }, null)), (_slots$prependItem = slots['prepend-item']) == null ? void 0 : _slots$prependItem.call(slots), items.value.map((item, index) => {
                 var _slots$item;
-
                 return ((_slots$item = slots.item) == null ? void 0 : _slots$item.call(slots, {
                   item,
                   index,
@@ -205,13 +193,13 @@ export const VSelect = genericComponent()({
               e.preventDefault();
               select(item);
             }
-
             const slotProps = {
               'onClick:close': onChipClose,
-              modelValue: true
+              modelValue: true,
+              'onUpdate:modelValue': undefined
             };
             return _createVNode("div", {
-              "key": index,
+              "key": item.value,
               "class": "v-select__selection"
             }, [hasChips ? _createVNode(VDefaultsProvider, {
               "defaults": {
@@ -244,6 +232,5 @@ export const VSelect = genericComponent()({
       select
     }, vTextFieldRef);
   }
-
 });
 //# sourceMappingURL=VSelect.mjs.map