vuetify 3.3.12 → 3.4.0-alpha.0

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

@@ -133,7 +133,7 @@ type FilterMode = 'some' | 'every' | 'union' | 'intersection';
 interface ScrollStrategyData {
     root: Ref<HTMLElement | undefined>;
     contentEl: Ref<HTMLElement | undefined>;
-    activatorEl: Ref<HTMLElement | undefined>;
+    targetEl: Ref<HTMLElement | undefined>;
     isActive: Ref<boolean>;
     updateLocation: Ref<((e: Event) => void) | undefined>;
 }
@@ -154,7 +154,7 @@ declare function repositionScrollStrategy(data: ScrollStrategyData, props: Strat
 
 interface LocationStrategyData {
     contentEl: Ref<HTMLElement | undefined>;
-    activatorEl: Ref<HTMLElement | undefined>;
+    target: Ref<HTMLElement | [x: number, y: number] | undefined>;
     isActive: Ref<boolean>;
     isRtl: Ref<boolean>;
 }
@@ -217,6 +217,7 @@ declare const VAutocomplete: {
             })> | undefined;
             menu?: boolean | undefined;
             style?: vue.StyleValue | undefined;
+            role?: string | undefined;
             autofocus?: boolean | undefined;
             eager?: boolean | undefined;
             disabled?: boolean | undefined;
@@ -245,6 +246,8 @@ declare const VAutocomplete: {
             persistentCounter?: boolean | undefined;
             chips?: boolean | undefined;
             closableChips?: boolean | undefined;
+            closeText?: string | undefined;
+            openText?: string | undefined;
             hideNoData?: boolean | undefined;
             hideSelected?: boolean | undefined;
             menuIcon?: IconValue | undefined;
@@ -309,6 +312,7 @@ declare const VAutocomplete: {
             bgColor?: string | undefined;
             prependIcon?: IconValue | undefined;
             appendIcon?: IconValue | undefined;
+            baseColor?: string | undefined;
             prependInnerIcon?: IconValue | undefined;
             'onClick:clear'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
             'onClick:append'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
@@ -319,7 +323,6 @@ declare const VAutocomplete: {
             validateOn?: "lazy" | ("input" | "blur" | "submit") | "input lazy" | "blur lazy" | "submit lazy" | "lazy input" | "lazy blur" | "lazy submit" | undefined;
             hint?: string | undefined;
             hideDetails?: boolean | "auto" | undefined;
-            baseColor?: string | undefined;
             suffix?: string | undefined;
             counterValue?: ((value: any) => number) | undefined;
             modelModifiers?: Record<string, boolean> | undefined;
@@ -361,6 +364,7 @@ declare const VAutocomplete: {
                 maxWidth?: string | number | undefined;
                 minHeight?: string | number | undefined;
                 minWidth?: string | number | undefined;
+                target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined;
                 class?: any;
                 $children?: vue.VNodeChild | {
                     default?: ((arg: {
@@ -429,7 +433,7 @@ declare const VAutocomplete: {
                     [key: string]: any;
                 }>) => void)[] | undefined;
                 "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
-                activator?: string | Element | vue.ComponentPublicInstance | undefined;
+                activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined;
                 "v-slot:activator"?: false | ((arg: {
                     isActive: boolean;
                     props: Record<string, any>;
@@ -527,6 +531,7 @@ declare const VAutocomplete: {
             })>;
             menu: boolean;
             style: vue.StyleValue;
+            role: string;
             autofocus: boolean;
             eager: boolean;
             disabled: boolean;
@@ -553,6 +558,8 @@ declare const VAutocomplete: {
             persistentCounter: boolean;
             chips: boolean;
             closableChips: boolean;
+            closeText: string;
+            openText: string;
             hideNoData: boolean;
             hideSelected: boolean;
             menuIcon: IconValue;
@@ -576,6 +583,7 @@ declare const VAutocomplete: {
             bgColor?: string | undefined;
             prependIcon?: IconValue | undefined;
             appendIcon?: IconValue | undefined;
+            baseColor?: string | undefined;
             prependInnerIcon?: IconValue | undefined;
             'onClick:clear'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
             'onClick:append'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
@@ -587,7 +595,6 @@ declare const VAutocomplete: {
             centerAffix?: boolean | undefined;
             hint?: string | undefined;
             hideDetails?: boolean | "auto" | undefined;
-            baseColor?: string | undefined;
             suffix?: string | undefined;
             counterValue?: ((value: any) => number) | undefined;
             modelModifiers?: Record<string, boolean> | undefined;
@@ -629,6 +636,7 @@ declare const VAutocomplete: {
                 maxWidth?: string | number | undefined;
                 minHeight?: string | number | undefined;
                 minWidth?: string | number | undefined;
+                target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined;
                 class?: any;
                 $children?: vue.VNodeChild | {
                     default?: ((arg: {
@@ -697,7 +705,7 @@ declare const VAutocomplete: {
                     [key: string]: any;
                 }>) => void)[] | undefined;
                 "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
-                activator?: string | Element | vue.ComponentPublicInstance | undefined;
+                activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined;
                 "v-slot:activator"?: false | ((arg: {
                     isActive: boolean;
                     props: Record<string, any>;
@@ -731,6 +739,7 @@ declare const VAutocomplete: {
             })>;
             menu: boolean;
             style: vue.StyleValue;
+            role: string;
             autofocus: boolean;
             eager: boolean;
             disabled: boolean;
@@ -759,6 +768,8 @@ declare const VAutocomplete: {
             persistentCounter: boolean;
             chips: boolean;
             closableChips: boolean;
+            closeText: string;
+            openText: string;
             hideNoData: boolean;
             hideSelected: boolean;
             menuIcon: IconValue;
@@ -858,6 +869,7 @@ declare const VAutocomplete: {
         })>;
         menu: boolean;
         style: vue.StyleValue;
+        role: string;
         autofocus: boolean;
         eager: boolean;
         disabled: boolean;
@@ -884,6 +896,8 @@ declare const VAutocomplete: {
         persistentCounter: boolean;
         chips: boolean;
         closableChips: boolean;
+        closeText: string;
+        openText: string;
         hideNoData: boolean;
         hideSelected: boolean;
         menuIcon: IconValue;
@@ -907,6 +921,7 @@ declare const VAutocomplete: {
         bgColor?: string | undefined;
         prependIcon?: IconValue | undefined;
         appendIcon?: IconValue | undefined;
+        baseColor?: string | undefined;
         prependInnerIcon?: IconValue | undefined;
         'onClick:clear'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
         'onClick:append'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
@@ -918,7 +933,6 @@ declare const VAutocomplete: {
         centerAffix?: boolean | undefined;
         hint?: string | undefined;
         hideDetails?: boolean | "auto" | undefined;
-        baseColor?: string | undefined;
         suffix?: string | undefined;
         counterValue?: ((value: any) => number) | undefined;
         modelModifiers?: Record<string, boolean> | undefined;
@@ -960,6 +974,7 @@ declare const VAutocomplete: {
             maxWidth?: string | number | undefined;
             minHeight?: string | number | undefined;
             minWidth?: string | number | undefined;
+            target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined;
             class?: any;
             $children?: vue.VNodeChild | {
                 default?: ((arg: {
@@ -1028,7 +1043,7 @@ declare const VAutocomplete: {
                 [key: string]: any;
             }>) => void)[] | undefined;
             "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
-            activator?: string | Element | vue.ComponentPublicInstance | undefined;
+            activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined;
             "v-slot:activator"?: false | ((arg: {
                 isActive: boolean;
                 props: Record<string, any>;
@@ -1061,6 +1076,7 @@ declare const VAutocomplete: {
     })>;
     menu: boolean;
     style: vue.StyleValue;
+    role: string;
     autofocus: boolean;
     eager: boolean;
     disabled: boolean;
@@ -1087,6 +1103,8 @@ declare const VAutocomplete: {
     persistentCounter: boolean;
     chips: boolean;
     closableChips: boolean;
+    closeText: string;
+    openText: string;
     hideNoData: boolean;
     hideSelected: boolean;
     menuIcon: IconValue;
@@ -1110,6 +1128,7 @@ declare const VAutocomplete: {
     bgColor?: string | undefined;
     prependIcon?: IconValue | undefined;
     appendIcon?: IconValue | undefined;
+    baseColor?: string | undefined;
     prependInnerIcon?: IconValue | undefined;
     'onClick:clear'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
     'onClick:append'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
@@ -1121,7 +1140,6 @@ declare const VAutocomplete: {
     centerAffix?: boolean | undefined;
     hint?: string | undefined;
     hideDetails?: boolean | "auto" | undefined;
-    baseColor?: string | undefined;
     suffix?: string | undefined;
     counterValue?: ((value: any) => number) | undefined;
     modelModifiers?: Record<string, boolean> | undefined;
@@ -1163,6 +1181,7 @@ declare const VAutocomplete: {
         maxWidth?: string | number | undefined;
         minHeight?: string | number | undefined;
         minWidth?: string | number | undefined;
+        target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined;
         class?: any;
         $children?: vue.VNodeChild | {
             default?: ((arg: {
@@ -1231,7 +1250,7 @@ declare const VAutocomplete: {
             [key: string]: any;
         }>) => void)[] | undefined;
         "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
-        activator?: string | Element | vue.ComponentPublicInstance | undefined;
+        activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined;
         "v-slot:activator"?: false | ((arg: {
             isActive: boolean;
             props: Record<string, any>;
@@ -1265,6 +1284,7 @@ declare const VAutocomplete: {
     })>;
     menu: boolean;
     style: vue.StyleValue;
+    role: string;
     autofocus: boolean;
     eager: boolean;
     disabled: boolean;
@@ -1293,6 +1313,8 @@ declare const VAutocomplete: {
     persistentCounter: boolean;
     chips: boolean;
     closableChips: boolean;
+    closeText: string;
+    openText: string;
     hideNoData: boolean;
     hideSelected: boolean;
     menuIcon: IconValue;
@@ -1446,6 +1468,10 @@ declare const VAutocomplete: {
         default: null;
     };
     prefix: StringConstructor;
+    role: {
+        type: PropType<string>;
+        default: string;
+    };
     autofocus: BooleanConstructor;
     disabled: {
         type: BooleanConstructor;
@@ -1484,6 +1510,7 @@ declare const VAutocomplete: {
     bgColor: StringConstructor;
     prependIcon: PropType<IconValue>;
     appendIcon: PropType<IconValue>;
+    baseColor: StringConstructor;
     clearIcon: {
         type: PropType<IconValue>;
         default: string;
@@ -1516,7 +1543,6 @@ declare const VAutocomplete: {
     hint: StringConstructor;
     persistentHint: BooleanConstructor;
     hideDetails: PropType<boolean | "auto">;
-    baseColor: StringConstructor;
     clearable: BooleanConstructor;
     persistentClear: BooleanConstructor;
     singleLine: BooleanConstructor;
@@ -1551,6 +1577,14 @@ declare const VAutocomplete: {
     returnObject: BooleanConstructor;
     chips: BooleanConstructor;
     closableChips: BooleanConstructor;
+    closeText: {
+        type: StringConstructor;
+        default: string;
+    };
+    openText: {
+        type: StringConstructor;
+        default: string;
+    };
     eager: BooleanConstructor;
     hideNoData: BooleanConstructor;
     hideSelected: BooleanConstructor;
@@ -1598,6 +1632,7 @@ declare const VAutocomplete: {
             maxWidth?: string | number | undefined;
             minHeight?: string | number | undefined;
             minWidth?: string | number | undefined;
+            target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined;
             class?: any;
             $children?: vue.VNodeChild | {
                 default?: ((arg: {
@@ -1666,7 +1701,7 @@ declare const VAutocomplete: {
                 [key: string]: any;
             }>) => void)[] | undefined;
             "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
-            activator?: string | Element | vue.ComponentPublicInstance | undefined;
+            activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined;
             "v-slot:activator"?: false | ((arg: {
                 isActive: boolean;
                 props: Record<string, any>;
@@ -1739,6 +1774,10 @@ declare const VAutocomplete: {
         default: null;
     };
     prefix: StringConstructor;
+    role: {
+        type: PropType<string>;
+        default: string;
+    };
     autofocus: BooleanConstructor;
     disabled: {
         type: BooleanConstructor;
@@ -1777,6 +1816,7 @@ declare const VAutocomplete: {
     bgColor: StringConstructor;
     prependIcon: PropType<IconValue>;
     appendIcon: PropType<IconValue>;
+    baseColor: StringConstructor;
     clearIcon: {
         type: PropType<IconValue>;
         default: string;
@@ -1809,7 +1849,6 @@ declare const VAutocomplete: {
     hint: StringConstructor;
     persistentHint: BooleanConstructor;
     hideDetails: PropType<boolean | "auto">;
-    baseColor: StringConstructor;
     clearable: BooleanConstructor;
     persistentClear: BooleanConstructor;
     singleLine: BooleanConstructor;
@@ -1844,6 +1883,14 @@ declare const VAutocomplete: {
     returnObject: BooleanConstructor;
     chips: BooleanConstructor;
     closableChips: BooleanConstructor;
+    closeText: {
+        type: StringConstructor;
+        default: string;
+    };
+    openText: {
+        type: StringConstructor;
+        default: string;
+    };
     eager: BooleanConstructor;
     hideNoData: BooleanConstructor;
     hideSelected: BooleanConstructor;
@@ -1891,6 +1938,7 @@ declare const VAutocomplete: {
             maxWidth?: string | number | undefined;
             minHeight?: string | number | undefined;
             minWidth?: string | number | undefined;
+            target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined;
             class?: any;
             $children?: vue.VNodeChild | {
                 default?: ((arg: {
@@ -1959,7 +2007,7 @@ declare const VAutocomplete: {
                 [key: string]: any;
             }>) => void)[] | undefined;
             "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
-            activator?: string | Element | vue.ComponentPublicInstance | undefined;
+            activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined;
             "v-slot:activator"?: false | ((arg: {
                 isActive: boolean;
                 props: Record<string, any>;

package/lib/components/VAvatar/VAvatar.mjs

@@ -19,6 +19,7 @@ export const makeVAvatarProps = propsFactory({
   end: Boolean,
   icon: IconValue,
   image: String,
+  text: String,
   ...makeComponentProps(),
   ...makeDensityProps(),
   ...makeRoundedProps(),
@@ -69,7 +70,7 @@ export const VAvatar = genericComponent()({
       }, null) : props.icon ? _createVNode(VIcon, {
         "key": "icon",
         "icon": props.icon
-      }, null) : slots.default?.(), genOverlays(false, 'v-avatar')]
+      }, null) : slots.default?.() ?? props.text, genOverlays(false, 'v-avatar')]
     }));
     return {};
   }

package/lib/components/VAvatar/VAvatar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VAvatar.mjs","names":["VIcon","VImg","makeComponentProps","makeDensityProps","useDensity","IconValue","makeRoundedProps","useRounded","makeSizeProps","useSize","makeTagProps","makeThemeProps","provideTheme","genOverlays","makeVariantProps","useVariant","genericComponent","propsFactory","useRender","makeVAvatarProps","start","Boolean","end","icon","image","String","variant","VAvatar","name","props","setup","_ref","slots","themeClasses","colorClasses","colorStyles","variantClasses","densityClasses","roundedClasses","sizeClasses","sizeStyles","_createVNode","tag","value","class","style","default"],"sources":["../../../src/components/VAvatar/VAvatar.tsx"],"sourcesContent":["// Styles\nimport './VAvatar.sass'\n\n// Components\nimport { VIcon } from '@/components/VIcon'\nimport { VImg } from '@/components/VImg'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { IconValue } from '@/composables/icons'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeSizeProps, useSize } from '@/composables/size'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Utilities\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport const makeVAvatarProps = propsFactory({\n  start: Boolean,\n  end: Boolean,\n  icon: IconValue,\n  image: String,\n\n  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeRoundedProps(),\n  ...makeSizeProps(),\n  ...makeTagProps(),\n  ...makeThemeProps(),\n  ...makeVariantProps({ variant: 'flat' } as const),\n}, 'VAvatar')\n\nexport const VAvatar = genericComponent()({\n  name: 'VAvatar',\n\n  props: makeVAvatarProps(),\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { colorClasses, colorStyles, variantClasses } = useVariant(props)\n    const { densityClasses } = useDensity(props)\n    const { roundedClasses } = useRounded(props)\n    const { sizeClasses, sizeStyles } = useSize(props)\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-avatar',\n          {\n            'v-avatar--start': props.start,\n            'v-avatar--end': props.end,\n          },\n          themeClasses.value,\n          colorClasses.value,\n          densityClasses.value,\n          roundedClasses.value,\n          sizeClasses.value,\n          variantClasses.value,\n          props.class,\n        ]}\n        style={[\n          colorStyles.value,\n          sizeStyles.value,\n          props.style,\n        ]}\n      >\n        { props.image\n          ? (<VImg key=\"image\" src={ props.image } alt=\"\" cover />)\n          : props.icon\n            ? (<VIcon key=\"icon\" icon={ props.icon } />)\n            : slots.default?.()\n        }\n\n        { genOverlays(false, 'v-avatar') }\n      </props.tag>\n    ))\n\n    return {}\n  },\n})\n\nexport type VAvatar = InstanceType<typeof VAvatar>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,KAAK;AAAA,SACLC,IAAI,6BAEb;AAAA,SACSC,kBAAkB;AAAA,SAClBC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,SAAS;AAAA,SACTC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,aAAa,EAAEC,OAAO;AAAA,SACtBC,YAAY;AAAA,SACZC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,WAAW,EAAEC,gBAAgB,EAAEC,UAAU,yCAElD;AAAA,SACSC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS;AAElD,OAAO,MAAMC,gBAAgB,GAAGF,YAAY,CAAC;EAC3CG,KAAK,EAAEC,OAAO;EACdC,GAAG,EAAED,OAAO;EACZE,IAAI,EAAElB,SAAS;EACfmB,KAAK,EAAEC,MAAM;EAEb,GAAGvB,kBAAkB,EAAE;EACvB,GAAGC,gBAAgB,EAAE;EACrB,GAAGG,gBAAgB,EAAE;EACrB,GAAGE,aAAa,EAAE;EAClB,GAAGE,YAAY,EAAE;EACjB,GAAGC,cAAc,EAAE;EACnB,GAAGG,gBAAgB,CAAC;IAAEY,OAAO,EAAE;EAAO,CAAC;AACzC,CAAC,EAAE,SAAS,CAAC;AAEb,OAAO,MAAMC,OAAO,GAAGX,gBAAgB,EAAE,CAAC;EACxCY,IAAI,EAAE,SAAS;EAEfC,KAAK,EAAEV,gBAAgB,EAAE;EAEzBW,KAAKA,CAAED,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEE;IAAa,CAAC,GAAGrB,YAAY,CAACiB,KAAK,CAAC;IAC5C,MAAM;MAAEK,YAAY;MAAEC,WAAW;MAAEC;IAAe,CAAC,GAAGrB,UAAU,CAACc,KAAK,CAAC;IACvE,MAAM;MAAEQ;IAAe,CAAC,GAAGjC,UAAU,CAACyB,KAAK,CAAC;IAC5C,MAAM;MAAES;IAAe,CAAC,GAAG/B,UAAU,CAACsB,KAAK,CAAC;IAC5C,MAAM;MAAEU,WAAW;MAAEC;IAAW,CAAC,GAAG/B,OAAO,CAACoB,KAAK,CAAC;IAElDX,SAAS,CAAC,MAAAuB,YAAA,CAAAZ,KAAA,CAAAa,GAAA;MAAA,SAEC,CACL,UAAU,EACV;QACE,iBAAiB,EAAEb,KAAK,CAACT,KAAK;QAC9B,eAAe,EAAES,KAAK,CAACP;MACzB,CAAC,EACDW,YAAY,CAACU,KAAK,EAClBT,YAAY,CAACS,KAAK,EAClBN,cAAc,CAACM,KAAK,EACpBL,cAAc,CAACK,KAAK,EACpBJ,WAAW,CAACI,KAAK,EACjBP,cAAc,CAACO,KAAK,EACpBd,KAAK,CAACe,KAAK,CACZ;MAAA,SACM,CACLT,WAAW,CAACQ,KAAK,EACjBH,UAAU,CAACG,KAAK,EAChBd,KAAK,CAACgB,KAAK;IACZ;MAAAC,OAAA,EAAAA,CAAA,MAECjB,KAAK,CAACL,KAAK,GAAAiB,YAAA,CAAAxC,IAAA;QAAA,OACE,OAAO;QAAA,OAAO4B,KAAK,CAACL,KAAK;QAAA,OAAO,EAAE;QAAA;MAAA,WAC7CK,KAAK,CAACN,IAAI,GAAAkB,YAAA,CAAAzC,KAAA;QAAA,OACI,MAAM;QAAA,QAAQ6B,KAAK,CAACN;MAAI,WACpCS,KAAK,CAACc,OAAO,IAAI,EAGrBjC,WAAW,CAAC,KAAK,EAAE,UAAU,CAAC;IAAA,EAEnC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"version":3,"file":"VAvatar.mjs","names":["VIcon","VImg","makeComponentProps","makeDensityProps","useDensity","IconValue","makeRoundedProps","useRounded","makeSizeProps","useSize","makeTagProps","makeThemeProps","provideTheme","genOverlays","makeVariantProps","useVariant","genericComponent","propsFactory","useRender","makeVAvatarProps","start","Boolean","end","icon","image","String","text","variant","VAvatar","name","props","setup","_ref","slots","themeClasses","colorClasses","colorStyles","variantClasses","densityClasses","roundedClasses","sizeClasses","sizeStyles","_createVNode","tag","value","class","style","default"],"sources":["../../../src/components/VAvatar/VAvatar.tsx"],"sourcesContent":["// Styles\nimport './VAvatar.sass'\n\n// Components\nimport { VIcon } from '@/components/VIcon'\nimport { VImg } from '@/components/VImg'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { IconValue } from '@/composables/icons'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeSizeProps, useSize } from '@/composables/size'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Utilities\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport const makeVAvatarProps = propsFactory({\n  start: Boolean,\n  end: Boolean,\n  icon: IconValue,\n  image: String,\n  text: String,\n\n  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeRoundedProps(),\n  ...makeSizeProps(),\n  ...makeTagProps(),\n  ...makeThemeProps(),\n  ...makeVariantProps({ variant: 'flat' } as const),\n}, 'VAvatar')\n\nexport const VAvatar = genericComponent()({\n  name: 'VAvatar',\n\n  props: makeVAvatarProps(),\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { colorClasses, colorStyles, variantClasses } = useVariant(props)\n    const { densityClasses } = useDensity(props)\n    const { roundedClasses } = useRounded(props)\n    const { sizeClasses, sizeStyles } = useSize(props)\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-avatar',\n          {\n            'v-avatar--start': props.start,\n            'v-avatar--end': props.end,\n          },\n          themeClasses.value,\n          colorClasses.value,\n          densityClasses.value,\n          roundedClasses.value,\n          sizeClasses.value,\n          variantClasses.value,\n          props.class,\n        ]}\n        style={[\n          colorStyles.value,\n          sizeStyles.value,\n          props.style,\n        ]}\n      >\n        { props.image\n          ? (<VImg key=\"image\" src={ props.image } alt=\"\" cover />)\n          : props.icon\n            ? (<VIcon key=\"icon\" icon={ props.icon } />)\n            : slots.default?.() ?? props.text\n        }\n\n        { genOverlays(false, 'v-avatar') }\n      </props.tag>\n    ))\n\n    return {}\n  },\n})\n\nexport type VAvatar = InstanceType<typeof VAvatar>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,KAAK;AAAA,SACLC,IAAI,6BAEb;AAAA,SACSC,kBAAkB;AAAA,SAClBC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,SAAS;AAAA,SACTC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,aAAa,EAAEC,OAAO;AAAA,SACtBC,YAAY;AAAA,SACZC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,WAAW,EAAEC,gBAAgB,EAAEC,UAAU,yCAElD;AAAA,SACSC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS;AAElD,OAAO,MAAMC,gBAAgB,GAAGF,YAAY,CAAC;EAC3CG,KAAK,EAAEC,OAAO;EACdC,GAAG,EAAED,OAAO;EACZE,IAAI,EAAElB,SAAS;EACfmB,KAAK,EAAEC,MAAM;EACbC,IAAI,EAAED,MAAM;EAEZ,GAAGvB,kBAAkB,EAAE;EACvB,GAAGC,gBAAgB,EAAE;EACrB,GAAGG,gBAAgB,EAAE;EACrB,GAAGE,aAAa,EAAE;EAClB,GAAGE,YAAY,EAAE;EACjB,GAAGC,cAAc,EAAE;EACnB,GAAGG,gBAAgB,CAAC;IAAEa,OAAO,EAAE;EAAO,CAAC;AACzC,CAAC,EAAE,SAAS,CAAC;AAEb,OAAO,MAAMC,OAAO,GAAGZ,gBAAgB,EAAE,CAAC;EACxCa,IAAI,EAAE,SAAS;EAEfC,KAAK,EAAEX,gBAAgB,EAAE;EAEzBY,KAAKA,CAAED,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEE;IAAa,CAAC,GAAGtB,YAAY,CAACkB,KAAK,CAAC;IAC5C,MAAM;MAAEK,YAAY;MAAEC,WAAW;MAAEC;IAAe,CAAC,GAAGtB,UAAU,CAACe,KAAK,CAAC;IACvE,MAAM;MAAEQ;IAAe,CAAC,GAAGlC,UAAU,CAAC0B,KAAK,CAAC;IAC5C,MAAM;MAAES;IAAe,CAAC,GAAGhC,UAAU,CAACuB,KAAK,CAAC;IAC5C,MAAM;MAAEU,WAAW;MAAEC;IAAW,CAAC,GAAGhC,OAAO,CAACqB,KAAK,CAAC;IAElDZ,SAAS,CAAC,MAAAwB,YAAA,CAAAZ,KAAA,CAAAa,GAAA;MAAA,SAEC,CACL,UAAU,EACV;QACE,iBAAiB,EAAEb,KAAK,CAACV,KAAK;QAC9B,eAAe,EAAEU,KAAK,CAACR;MACzB,CAAC,EACDY,YAAY,CAACU,KAAK,EAClBT,YAAY,CAACS,KAAK,EAClBN,cAAc,CAACM,KAAK,EACpBL,cAAc,CAACK,KAAK,EACpBJ,WAAW,CAACI,KAAK,EACjBP,cAAc,CAACO,KAAK,EACpBd,KAAK,CAACe,KAAK,CACZ;MAAA,SACM,CACLT,WAAW,CAACQ,KAAK,EACjBH,UAAU,CAACG,KAAK,EAChBd,KAAK,CAACgB,KAAK;IACZ;MAAAC,OAAA,EAAAA,CAAA,MAECjB,KAAK,CAACN,KAAK,GAAAkB,YAAA,CAAAzC,IAAA;QAAA,OACE,OAAO;QAAA,OAAO6B,KAAK,CAACN,KAAK;QAAA,OAAO,EAAE;QAAA;MAAA,WAC7CM,KAAK,CAACP,IAAI,GAAAmB,YAAA,CAAA1C,KAAA;QAAA,OACI,MAAM;QAAA,QAAQ8B,KAAK,CAACP;MAAI,WACpCU,KAAK,CAACc,OAAO,IAAI,IAAIjB,KAAK,CAACJ,IAAI,EAGnCb,WAAW,CAAC,KAAK,EAAE,UAAU,CAAC;IAAA,EAEnC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

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

@@ -26,6 +26,7 @@ declare const VAvatar: {
             key?: string | number | symbol | undefined;
             color?: string | undefined;
             image?: string | undefined;
+            text?: string | undefined;
             class?: any;
             icon?: IconValue | undefined;
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -104,6 +105,7 @@ declare const VAvatar: {
         } & {
             color?: string | undefined;
             image?: string | undefined;
+            text?: string | undefined;
             class?: any;
             icon?: IconValue | undefined;
             theme?: string | undefined;
@@ -161,6 +163,7 @@ declare const VAvatar: {
     } & {
         color?: string | undefined;
         image?: string | undefined;
+        text?: string | undefined;
         class?: any;
         icon?: IconValue | undefined;
         theme?: string | undefined;
@@ -189,6 +192,7 @@ declare const VAvatar: {
 } & {
     color?: string | undefined;
     image?: string | undefined;
+    text?: string | undefined;
     class?: any;
     icon?: IconValue | undefined;
     theme?: string | undefined;
@@ -252,6 +256,7 @@ declare const VAvatar: {
     end: BooleanConstructor;
     icon: vue.PropType<IconValue>;
     image: StringConstructor;
+    text: StringConstructor;
 }, vue.ExtractPropTypes<{
     color: StringConstructor;
     variant: Omit<{
@@ -289,6 +294,7 @@ declare const VAvatar: {
     end: BooleanConstructor;
     icon: vue.PropType<IconValue>;
     image: StringConstructor;
+    text: StringConstructor;
 }>>;
 type VAvatar = InstanceType<typeof VAvatar>;
 

package/lib/components/VBanner/VBanner.mjs

@@ -12,7 +12,7 @@ import { makeComponentProps } from "../../composables/component.mjs";
 import { provideDefaults } from "../../composables/defaults.mjs";
 import { makeDensityProps, useDensity } from "../../composables/density.mjs";
 import { makeDimensionProps, useDimension } from "../../composables/dimensions.mjs";
-import { useDisplay } from "../../composables/display.mjs";
+import { makeDisplayProps, useDisplay } from "../../composables/display.mjs";
 import { makeElevationProps, useElevation } from "../../composables/elevation.mjs";
 import { IconValue } from "../../composables/icons.mjs";
 import { makeLocationProps, useLocation } from "../../composables/location.mjs";
@@ -34,6 +34,7 @@ export const makeVBannerProps = propsFactory({
   ...makeComponentProps(),
   ...makeDensityProps(),
   ...makeDimensionProps(),
+  ...makeDisplayProps(),
   ...makeElevationProps(),
   ...makeLocationProps(),
   ...makePositionProps(),
@@ -55,8 +56,9 @@ export const VBanner = genericComponent()({
       densityClasses
     } = useDensity(props);
     const {
+      displayClasses,
       mobile
-    } = useDisplay();
+    } = useDisplay(props);
     const {
       dimensionStyles
     } = useDimension(props);
@@ -92,7 +94,7 @@ export const VBanner = genericComponent()({
           'v-banner--stacked': props.stacked || mobile.value,
           'v-banner--sticky': props.sticky,
           [`v-banner--${props.lines}-line`]: !!props.lines
-        }, borderClasses.value, densityClasses.value, elevationClasses.value, positionClasses.value, roundedClasses.value, themeClasses.value, props.class],
+        }, borderClasses.value, densityClasses.value, displayClasses.value, elevationClasses.value, positionClasses.value, roundedClasses.value, themeClasses.value, props.class],
         "style": [dimensionStyles.value, locationStyles.value, props.style],
         "role": "banner"
       }, {

package/lib/components/VBanner/VBanner.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VBanner.mjs","names":["VBannerActions","VBannerText","VAvatar","VDefaultsProvider","makeBorderProps","useBorder","makeComponentProps","provideDefaults","makeDensityProps","useDensity","makeDimensionProps","useDimension","useDisplay","makeElevationProps","useElevation","IconValue","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","toRef","genericComponent","propsFactory","useRender","makeVBannerProps","avatar","String","color","icon","lines","stacked","Boolean","sticky","text","VBanner","name","props","setup","_ref","slots","borderClasses","densityClasses","mobile","dimensionStyles","elevationClasses","locationStyles","positionClasses","roundedClasses","themeClasses","density","hasText","hasPrependMedia","hasPrepend","prepend","_createVNode","tag","value","class","style","default","image","actions"],"sources":["../../../src/components/VBanner/VBanner.tsx"],"sourcesContent":["// Styles\nimport './VBanner.sass'\n\n// Components\nimport { VBannerActions } from './VBannerActions'\nimport { VBannerText } from './VBannerText'\nimport { VAvatar } from '@/components/VAvatar'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\nimport { provideDefaults } from '@/composables/defaults'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { useDisplay } from '@/composables/display'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { IconValue } from '@/composables/icons'\nimport { makeLocationProps, useLocation } from '@/composables/location'\nimport { makePositionProps, usePosition } from '@/composables/position'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\n\n// Utilities\nimport { toRef } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type VBannerSlots = {\n  default: never\n  prepend: never\n  text: never\n  actions: never\n}\n\nexport const makeVBannerProps = propsFactory({\n  avatar: String,\n  color: String,\n  icon: IconValue,\n  lines: String as PropType<'one' | 'two' | 'three'>,\n  stacked: Boolean,\n  sticky: Boolean,\n  text: String,\n\n  ...makeBorderProps(),\n  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeDimensionProps(),\n  ...makeElevationProps(),\n  ...makeLocationProps(),\n  ...makePositionProps(),\n  ...makeRoundedProps(),\n  ...makeTagProps(),\n  ...makeThemeProps(),\n}, 'VBanner')\n\nexport const VBanner = genericComponent<VBannerSlots>()({\n  name: 'VBanner',\n\n  props: makeVBannerProps(),\n\n  setup (props, { slots }) {\n    const { borderClasses } = useBorder(props)\n    const { densityClasses } = useDensity(props)\n    const { mobile } = useDisplay()\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { locationStyles } = useLocation(props)\n    const { positionClasses } = usePosition(props)\n    const { roundedClasses } = useRounded(props)\n\n    const { themeClasses } = provideTheme(props)\n\n    const color = toRef(props, 'color')\n    const density = toRef(props, 'density')\n\n    provideDefaults({ VBannerActions: { color, density } })\n\n    useRender(() => {\n      const hasText = !!(props.text || slots.text)\n      const hasPrependMedia = !!(props.avatar || props.icon)\n      const hasPrepend = !!(hasPrependMedia || slots.prepend)\n\n      return (\n        <props.tag\n          class={[\n            'v-banner',\n            {\n              'v-banner--stacked': props.stacked || mobile.value,\n              'v-banner--sticky': props.sticky,\n              [`v-banner--${props.lines}-line`]: !!props.lines,\n            },\n            borderClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            positionClasses.value,\n            roundedClasses.value,\n            themeClasses.value,\n            props.class,\n          ]}\n          style={[\n            dimensionStyles.value,\n            locationStyles.value,\n            props.style,\n          ]}\n          role=\"banner\"\n        >\n          { hasPrepend && (\n            <div key=\"prepend\" class=\"v-banner__prepend\">\n              { !slots.prepend ? (\n                <VAvatar\n                  key=\"prepend-avatar\"\n                  color={ color.value }\n                  density={ density.value }\n                  icon={ props.icon }\n                  image={ props.avatar }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"prepend-defaults\"\n                  disabled={ !hasPrependMedia }\n                  defaults={{\n                    VAvatar: {\n                      color: color.value,\n                      density: density.value,\n                      icon: props.icon,\n                      image: props.avatar,\n                    },\n                  }}\n                  v-slots:default={ slots.prepend }\n                />\n              )}\n            </div>\n          )}\n\n          <div class=\"v-banner__content\">\n            { hasText && (\n              <VBannerText key=\"text\">\n                { slots.text?.() ?? props.text }\n              </VBannerText>\n            )}\n\n            { slots.default?.() }\n          </div>\n\n          { slots.actions && (\n            <VBannerActions key=\"actions\" v-slots:default={ slots.actions } />\n          )}\n        </props.tag>\n      )\n    })\n  },\n})\n\nexport type VBanner = InstanceType<typeof VBanner>\n"],"mappings":"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"}
+{"version":3,"file":"VBanner.mjs","names":["VBannerActions","VBannerText","VAvatar","VDefaultsProvider","makeBorderProps","useBorder","makeComponentProps","provideDefaults","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeDisplayProps","useDisplay","makeElevationProps","useElevation","IconValue","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","toRef","genericComponent","propsFactory","useRender","makeVBannerProps","avatar","String","color","icon","lines","stacked","Boolean","sticky","text","VBanner","name","props","setup","_ref","slots","borderClasses","densityClasses","displayClasses","mobile","dimensionStyles","elevationClasses","locationStyles","positionClasses","roundedClasses","themeClasses","density","hasText","hasPrependMedia","hasPrepend","prepend","_createVNode","tag","value","class","style","default","image","actions"],"sources":["../../../src/components/VBanner/VBanner.tsx"],"sourcesContent":["// Styles\nimport './VBanner.sass'\n\n// Components\nimport { VBannerActions } from './VBannerActions'\nimport { VBannerText } from './VBannerText'\nimport { VAvatar } from '@/components/VAvatar'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\nimport { provideDefaults } from '@/composables/defaults'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeDisplayProps, useDisplay } from '@/composables/display'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { IconValue } from '@/composables/icons'\nimport { makeLocationProps, useLocation } from '@/composables/location'\nimport { makePositionProps, usePosition } from '@/composables/position'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\n\n// Utilities\nimport { toRef } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type VBannerSlots = {\n  default: never\n  prepend: never\n  text: never\n  actions: never\n}\n\nexport const makeVBannerProps = propsFactory({\n  avatar: String,\n  color: String,\n  icon: IconValue,\n  lines: String as PropType<'one' | 'two' | 'three'>,\n  stacked: Boolean,\n  sticky: Boolean,\n  text: String,\n\n  ...makeBorderProps(),\n  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeDimensionProps(),\n  ...makeDisplayProps(),\n  ...makeElevationProps(),\n  ...makeLocationProps(),\n  ...makePositionProps(),\n  ...makeRoundedProps(),\n  ...makeTagProps(),\n  ...makeThemeProps(),\n}, 'VBanner')\n\nexport const VBanner = genericComponent<VBannerSlots>()({\n  name: 'VBanner',\n\n  props: makeVBannerProps(),\n\n  setup (props, { slots }) {\n    const { borderClasses } = useBorder(props)\n    const { densityClasses } = useDensity(props)\n    const { displayClasses, mobile } = useDisplay(props)\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { locationStyles } = useLocation(props)\n    const { positionClasses } = usePosition(props)\n    const { roundedClasses } = useRounded(props)\n\n    const { themeClasses } = provideTheme(props)\n\n    const color = toRef(props, 'color')\n    const density = toRef(props, 'density')\n\n    provideDefaults({ VBannerActions: { color, density } })\n\n    useRender(() => {\n      const hasText = !!(props.text || slots.text)\n      const hasPrependMedia = !!(props.avatar || props.icon)\n      const hasPrepend = !!(hasPrependMedia || slots.prepend)\n\n      return (\n        <props.tag\n          class={[\n            'v-banner',\n            {\n              'v-banner--stacked': props.stacked || mobile.value,\n              'v-banner--sticky': props.sticky,\n              [`v-banner--${props.lines}-line`]: !!props.lines,\n            },\n            borderClasses.value,\n            densityClasses.value,\n            displayClasses.value,\n            elevationClasses.value,\n            positionClasses.value,\n            roundedClasses.value,\n            themeClasses.value,\n            props.class,\n          ]}\n          style={[\n            dimensionStyles.value,\n            locationStyles.value,\n            props.style,\n          ]}\n          role=\"banner\"\n        >\n          { hasPrepend && (\n            <div key=\"prepend\" class=\"v-banner__prepend\">\n              { !slots.prepend ? (\n                <VAvatar\n                  key=\"prepend-avatar\"\n                  color={ color.value }\n                  density={ density.value }\n                  icon={ props.icon }\n                  image={ props.avatar }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"prepend-defaults\"\n                  disabled={ !hasPrependMedia }\n                  defaults={{\n                    VAvatar: {\n                      color: color.value,\n                      density: density.value,\n                      icon: props.icon,\n                      image: props.avatar,\n                    },\n                  }}\n                  v-slots:default={ slots.prepend }\n                />\n              )}\n            </div>\n          )}\n\n          <div class=\"v-banner__content\">\n            { hasText && (\n              <VBannerText key=\"text\">\n                { slots.text?.() ?? props.text }\n              </VBannerText>\n            )}\n\n            { slots.default?.() }\n          </div>\n\n          { slots.actions && (\n            <VBannerActions key=\"actions\" v-slots:default={ slots.actions } />\n          )}\n        </props.tag>\n      )\n    })\n  },\n})\n\nexport type VBanner = InstanceType<typeof VBanner>\n"],"mappings":"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"}

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

@@ -3,6 +3,10 @@ import { ComponentPropsOptions, ExtractPropTypes, JSXComponent, PropType } from
 
 type Density = null | 'default' | 'comfortable' | 'compact';
 
+declare const breakpoints: readonly ["sm", "md", "lg", "xl", "xxl"];
+type Breakpoint = typeof breakpoints[number];
+type DisplayBreakpoint = 'xs' | Breakpoint;
+
 declare const block: readonly ["top", "bottom"];
 declare const inline: readonly ["start", "end", "left", "right"];
 type Tblock = typeof block[number];
@@ -100,6 +104,7 @@ declare const VBanner: {
             }>) => void)[] | undefined;
             "v-slot:prepend"?: false | (() => vue.VNodeChild) | undefined;
             lines?: "one" | "two" | "three" | undefined;
+            mobileBreakpoint?: number | DisplayBreakpoint | undefined;
             avatar?: string | undefined;
             "v-slot:actions"?: false | (() => vue.VNodeChild) | undefined;
         };
@@ -151,6 +156,7 @@ declare const VBanner: {
             theme?: string | undefined;
             rounded?: string | number | boolean | undefined;
             lines?: "one" | "two" | "three" | undefined;
+            mobileBreakpoint?: number | DisplayBreakpoint | undefined;
             avatar?: string | undefined;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -234,6 +240,7 @@ declare const VBanner: {
         theme?: string | undefined;
         rounded?: string | number | boolean | undefined;
         lines?: "one" | "two" | "three" | undefined;
+        mobileBreakpoint?: number | DisplayBreakpoint | undefined;
         avatar?: string | undefined;
     } & {
         $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -281,6 +288,7 @@ declare const VBanner: {
     theme?: string | undefined;
     rounded?: string | number | boolean | undefined;
     lines?: "one" | "two" | "three" | undefined;
+    mobileBreakpoint?: number | DisplayBreakpoint | undefined;
     avatar?: string | undefined;
 } & {
     $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -339,6 +347,7 @@ declare const VBanner: {
         type: (StringConstructor | NumberConstructor)[];
         validator(v: any): boolean;
     };
+    mobileBreakpoint: PropType<number | DisplayBreakpoint>;
     height: (StringConstructor | NumberConstructor)[];
     maxHeight: (StringConstructor | NumberConstructor)[];
     maxWidth: (StringConstructor | NumberConstructor)[];
@@ -382,6 +391,7 @@ declare const VBanner: {
         type: (StringConstructor | NumberConstructor)[];
         validator(v: any): boolean;
     };
+    mobileBreakpoint: PropType<number | DisplayBreakpoint>;
     height: (StringConstructor | NumberConstructor)[];
     maxHeight: (StringConstructor | NumberConstructor)[];
     maxWidth: (StringConstructor | NumberConstructor)[];

package/lib/components/VBottomNavigation/VBottomNavigation.css

@@ -48,6 +48,7 @@
   flex-grow: 1;
 }
 .v-bottom-navigation--shift .v-bottom-navigation__content .v-btn:not(.v-btn--selected) .v-btn__content > span {
+  transition: inherit;
   opacity: 0;
 }
 .v-bottom-navigation--shift .v-bottom-navigation__content .v-btn:not(.v-btn--selected) .v-btn__content {

package/lib/components/VBottomNavigation/VBottomNavigation.sass

@@ -50,6 +50,7 @@
     .v-btn
       &:not(.v-btn--selected)
         .v-btn__content > span
+          transition: inherit
           opacity: 0
 
         .v-btn__content

package/lib/components/VBreadcrumbs/VBreadcrumbs.mjs

@@ -104,12 +104,17 @@ export const VBreadcrumbs = genericComponent()({
             item,
             raw
           } = _ref2;
-          return _createVNode(_Fragment, null, [_createVNode(VBreadcrumbsItem, _mergeProps({
-            "key": item.title,
+          return _createVNode(_Fragment, null, [slots.item?.({
+            item,
+            index
+          }) ?? _createVNode(VBreadcrumbsItem, _mergeProps({
+            "key": index,
             "disabled": index >= array.length - 1
-          }, item), {
+          }, typeof item === 'string' ? {
+            title: item
+          } : item), {
             default: slots.title ? () => slots.title?.({
-              item: raw,
+              item,
               index
             }) : undefined
           }), index < array.length - 1 && _createVNode(VBreadcrumbsDivider, null, {