@vuetify/nightly 3.0.0-beta.3 → 3.0.0-beta.6

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

@@ -1 +1 @@
-{"version":3,"file":"VBanner.mjs","names":["VBannerActions","VBannerAvatar","VBannerIcon","VBannerText","makeBorderProps","useBorder","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","provideDefaults","useDisplay","IconValue","defineComponent","useRender","toRef","VBanner","name","props","avatar","String","color","icon","lines","stacked","Boolean","sticky","text","setup","slots","borderClasses","densityClasses","mobile","dimensionStyles","elevationClasses","locationStyles","positionClasses","roundedClasses","themeClasses","density","image","hasText","hasPrepend","prepend","value","undefined","default","actions"],"sources":["../../../src/components/VBanner/VBanner.tsx"],"sourcesContent":["// Styles\nimport './VBanner.sass'\n\n// Components\nimport { VBannerActions } from './VBannerActions'\nimport { VBannerAvatar } from './VBannerAvatar'\nimport { VBannerIcon } from './VBannerIcon'\nimport { VBannerText } from './VBannerText'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\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'\nimport { provideDefaults } from '@/composables/defaults'\nimport { useDisplay } from '@/composables/display'\nimport { IconValue } from '@/composables/icons'\n\n// Utilities\nimport { defineComponent, useRender } from '@/util'\nimport { toRef } from 'vue'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport const VBanner = defineComponent({\n  name: 'VBanner',\n\n  props: {\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    ...makeDensityProps(),\n    ...makeDimensionProps(),\n    ...makeElevationProps(),\n    ...makeLocationProps(),\n    ...makePositionProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\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({\n      VBannerActions: { color, density },\n      VBannerAvatar: { density, image: toRef(props, 'avatar') },\n      VBannerIcon: { color, density, icon: toRef(props, 'icon') },\n    })\n\n    useRender(() => {\n      const hasText = !!(props.text || slots.text)\n      const hasPrepend = !!(slots.prepend || props.avatar || props.icon)\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          ]}\n          style={[\n            dimensionStyles.value,\n            locationStyles.value,\n          ]}\n          role=\"banner\"\n        >\n          { hasPrepend && (\n            <>\n              { slots.prepend\n                ? (\n                  <div class=\"v-banner__prepend\">\n                    { slots.prepend() }\n                  </div>\n                )\n                : props.avatar ? (<VBannerAvatar />)\n                : props.icon ? (<VBannerIcon />)\n                : undefined\n              }\n            </>\n          ) }\n\n          { hasText && (\n            <VBannerText>\n              { slots.text ? slots.text() : props.text }\n            </VBannerText>\n          ) }\n\n          { slots.default?.() }\n\n          { slots.actions && (\n            <VBannerActions>\n              { slots.actions() }\n            </VBannerActions>\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":["VAvatar","VBannerActions","VBannerText","VDefaultsProvider","makeBorderProps","useBorder","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","provideDefaults","useDisplay","IconValue","defineComponent","useRender","toRef","VBanner","name","props","avatar","String","color","icon","lines","stacked","Boolean","sticky","text","setup","slots","borderClasses","densityClasses","mobile","dimensionStyles","elevationClasses","locationStyles","positionClasses","roundedClasses","themeClasses","density","hasText","hasPrepend","prepend","value","image","default","actions"],"sources":["../../../src/components/VBanner/VBanner.tsx"],"sourcesContent":["// Styles\nimport './VBanner.sass'\n\n// Components\nimport { VAvatar } from '@/components/VAvatar'\nimport { VBannerActions } from './VBannerActions'\nimport { VBannerText } from './VBannerText'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\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'\nimport { provideDefaults } from '@/composables/defaults'\nimport { useDisplay } from '@/composables/display'\nimport { IconValue } from '@/composables/icons'\n\n// Utilities\nimport { defineComponent, useRender } from '@/util'\nimport { toRef } from 'vue'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport const VBanner = defineComponent({\n  name: 'VBanner',\n\n  props: {\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    ...makeDensityProps(),\n    ...makeDimensionProps(),\n    ...makeElevationProps(),\n    ...makeLocationProps(),\n    ...makePositionProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\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 hasPrepend = !!(slots.prepend || props.avatar || props.icon)\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          ]}\n          style={[\n            dimensionStyles.value,\n            locationStyles.value,\n          ]}\n          role=\"banner\"\n        >\n          { hasPrepend && (\n            <VDefaultsProvider\n              key=\"prepend\"\n              defaults={{\n                VAvatar: {\n                  color: color.value,\n                  density: density.value,\n                  icon: props.icon,\n                  image: props.avatar,\n                },\n              }}\n            >\n              <div class=\"v-banner__prepend\">\n                { slots.prepend\n                  ? slots.prepend()\n                  : (props.avatar || props.icon) && (<VAvatar />)\n                }\n              </div>\n            </VDefaultsProvider>\n          ) }\n\n          <div class=\"v-banner__content\">\n            { hasText && (\n              <VBannerText key=\"text\">\n                { slots.text ? slots.text() : props.text }\n              </VBannerText>\n            ) }\n\n            { slots.default?.() }\n          </div>\n\n          { slots.actions && (\n            <VBannerActions>\n              { slots.actions() }\n            </VBannerActions>\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/VBanner.sass

@@ -1,14 +1,12 @@
-@forward './variables'
 @use 'sass:math'
 @use '../../styles/tools'
 @use './variables' as *
 
 .v-banner
-  align-items: center
   display: grid
   flex: 1 1
   font-size: $banner-font-size
-  grid-template-areas: "prepend text actions"
+  grid-template-areas: "prepend content actions"
   grid-template-columns: max-content auto max-content
   grid-template-rows: max-content max-content
   line-height: $banner-line-height
@@ -31,7 +29,7 @@
 
   &--stacked
     &:not(.v-banner--one-line)
-      grid-template-areas: "prepend text" ". actions"
+      grid-template-areas: "prepend content" ". actions"
 
     .v-banner-text
       padding-inline-end: $banner-stacked-padding-inline-end
@@ -69,8 +67,9 @@
   &--sticky
     top: $banner-sticky-top
 
-.v-banner-avatar,
-.v-banner-icon,
+.v-banner__content
+  grid-area: content
+
 .v-banner__prepend
   align-self: flex-start
   grid-area: prepend
@@ -90,9 +89,8 @@
 .v-banner-text
   -webkit-box-orient: vertical
   display: -webkit-box
-  grid-area: text
-  overflow: hidden
   padding-inline-end: $banner-text-padding-end
+  overflow: hidden
 
   .v-banner--one-line &
     -webkit-line-clamp: 1

package/lib/components/VBanner/VBannerActions.mjs

@@ -26,7 +26,7 @@ export const VBannerActions = defineComponent({
 
       return _createVNode("div", {
         "class": "v-banner-actions"
-      }, [slots == null ? void 0 : (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)]);
+      }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)]);
     });
     return {};
   }

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

@@ -1 +1 @@
-{"version":3,"file":"VBannerActions.mjs","names":["provideDefaults","defineComponent","useRender","VBannerActions","name","props","color","String","density","setup","slots","VBtn","variant","default"],"sources":["../../../src/components/VBanner/VBannerActions.tsx"],"sourcesContent":["// Composables\nimport { provideDefaults } from '@/composables/defaults'\n\n// Utility\nimport { defineComponent, useRender } from '@/util'\n\nexport const VBannerActions = defineComponent({\n  name: 'VBannerActions',\n\n  props: {\n    color: String,\n    density: String,\n  },\n\n  setup (props, { slots }) {\n    provideDefaults({\n      VBtn: {\n        color: props.color,\n        density: props.density,\n        variant: 'text',\n      },\n    })\n\n    useRender(() => (\n      <div class=\"v-banner-actions\">\n        { slots?.default?.() }\n      </div>\n    ))\n\n    return {}\n  },\n})\n"],"mappings":";AAAA;SACSA,e,0CAET;;SACSC,e,EAAiBC,S;AAE1B,OAAO,MAAMC,cAAc,GAAGF,eAAe,CAAC;EAC5CG,IAAI,EAAE,gBADsC;EAG5CC,KAAK,EAAE;IACLC,KAAK,EAAEC,MADF;IAELC,OAAO,EAAED;EAFJ,CAHqC;;EAQ5CE,KAAK,CAAEJ,KAAF,QAAoB;IAAA,IAAX;MAAEK;IAAF,CAAW;IACvBV,eAAe,CAAC;MACdW,IAAI,EAAE;QACJL,KAAK,EAAED,KAAK,CAACC,KADT;QAEJE,OAAO,EAAEH,KAAK,CAACG,OAFX;QAGJI,OAAO,EAAE;MAHL;IADQ,CAAD,CAAf;IAQAV,SAAS,CAAC;MAAA;;MAAA;QAAA,SACG;MADH,IAEJQ,KAFI,sCAEJA,KAAK,CAAEG,OAFH,qBAEJ,oBAAAH,KAAK,CAFD;IAAA,CAAD,CAAT;IAMA,OAAO,EAAP;EACD;;AAxB2C,CAAD,CAAtC"}
+{"version":3,"file":"VBannerActions.mjs","names":["provideDefaults","defineComponent","useRender","VBannerActions","name","props","color","String","density","setup","slots","VBtn","variant","default"],"sources":["../../../src/components/VBanner/VBannerActions.tsx"],"sourcesContent":["// Composables\nimport { provideDefaults } from '@/composables/defaults'\n\n// Utility\nimport { defineComponent, useRender } from '@/util'\n\nexport const VBannerActions = defineComponent({\n  name: 'VBannerActions',\n\n  props: {\n    color: String,\n    density: String,\n  },\n\n  setup (props, { slots }) {\n    provideDefaults({\n      VBtn: {\n        color: props.color,\n        density: props.density,\n        variant: 'text',\n      },\n    })\n\n    useRender(() => (\n      <div class=\"v-banner-actions\">\n        { slots.default?.() }\n      </div>\n    ))\n\n    return {}\n  },\n})\n"],"mappings":";AAAA;SACSA,e,0CAET;;SACSC,e,EAAiBC,S;AAE1B,OAAO,MAAMC,cAAc,GAAGF,eAAe,CAAC;EAC5CG,IAAI,EAAE,gBADsC;EAG5CC,KAAK,EAAE;IACLC,KAAK,EAAEC,MADF;IAELC,OAAO,EAAED;EAFJ,CAHqC;;EAQ5CE,KAAK,CAAEJ,KAAF,QAAoB;IAAA,IAAX;MAAEK;IAAF,CAAW;IACvBV,eAAe,CAAC;MACdW,IAAI,EAAE;QACJL,KAAK,EAAED,KAAK,CAACC,KADT;QAEJE,OAAO,EAAEH,KAAK,CAACG,OAFX;QAGJI,OAAO,EAAE;MAHL;IADQ,CAAD,CAAf;IAQAV,SAAS,CAAC;MAAA;;MAAA;QAAA,SACG;MADH,sBAEJQ,KAAK,CAACG,OAFF,qBAEJ,oBAAAH,KAAK,CAFD;IAAA,CAAD,CAAT;IAMA,OAAO,EAAP;EACD;;AAxB2C,CAAD,CAAtC"}

package/lib/components/VBanner/index.mjs

@@ -1,6 +1,4 @@
 export { VBanner } from "./VBanner.mjs";
 export { VBannerActions } from "./VBannerActions.mjs";
-export { VBannerAvatar } from "./VBannerAvatar.mjs";
-export { VBannerIcon } from "./VBannerIcon.mjs";
 export { VBannerText } from "./VBannerText.mjs";
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["VBanner","VBannerActions","VBannerAvatar","VBannerIcon","VBannerText"],"sources":["../../../src/components/VBanner/index.ts"],"sourcesContent":["export { VBanner } from './VBanner'\nexport { VBannerActions } from './VBannerActions'\nexport { VBannerAvatar } from './VBannerAvatar'\nexport { VBannerIcon } from './VBannerIcon'\nexport { VBannerText } from './VBannerText'\n"],"mappings":"SAASA,O;SACAC,c;SACAC,a;SACAC,W;SACAC,W"}
+{"version":3,"file":"index.mjs","names":["VBanner","VBannerActions","VBannerText"],"sources":["../../../src/components/VBanner/index.ts"],"sourcesContent":["export { VBanner } from './VBanner'\nexport { VBannerActions } from './VBannerActions'\nexport { VBannerText } from './VBannerText'\n"],"mappings":"SAASA,O;SACAC,c;SACAC,W"}

package/lib/components/VBottomNavigation/VBottomNavigation.css

@@ -43,19 +43,12 @@
 .v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__icon {
   font-size: 1.5rem;
 }
-.v-bottom-navigation .v-bottom-navigation__content > .v-btn:not(.v-btn--selected):not(.v-btn--disabled) {
-  color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
-}
 .v-bottom-navigation--grow .v-bottom-navigation__content > .v-btn {
   flex-grow: 1;
 }
-.v-bottom-navigation--shift .v-bottom-navigation__content > .v-btn .v-btn__icon {
-  top: 0.5rem;
-  transform: translateY(-0.5rem);
-}
-.v-bottom-navigation--shift .v-bottom-navigation__content > .v-btn:not(.v-btn--selected) .v-btn__content {
-  color: rgba(var(--v-theme-on-surface), 0);
+.v-bottom-navigation--shift .v-bottom-navigation__content .v-btn:not(.v-btn--selected) .v-btn__content > span {
+  opacity: 0;
 }
-.v-bottom-navigation--shift .v-bottom-navigation__content > .v-btn:not(.v-btn--selected) .v-btn__icon {
-  transform: translateY(0);
+.v-bottom-navigation--shift .v-bottom-navigation__content .v-btn:not(.v-btn--selected) .v-btn__content {
+  transform: translateY(0.5rem);
 }

package/lib/components/VBottomNavigation/VBottomNavigation.mjs

@@ -15,7 +15,7 @@ import { useBackgroundColor } from "../../composables/color.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
 
 import { computed, toRef } from 'vue';
-import { convertToUnit, defineComponent } from "../../util/index.mjs"; // Types
+import { convertToUnit, defineComponent, useRender } from "../../util/index.mjs"; // Types
 
 import { VBtnToggleSymbol } from "../VBtnToggle/VBtnToggle.mjs";
 export const VBottomNavigation = defineComponent({
@@ -99,7 +99,7 @@ export const VBottomNavigation = defineComponent({
     }, {
       scoped: true
     });
-    return () => {
+    useRender(() => {
       return _createVNode(props.tag, {
         "class": ['v-bottom-navigation', {
           'v-bottom-navigation--active': isActive.value,
@@ -115,7 +115,8 @@ export const VBottomNavigation = defineComponent({
           "class": "v-bottom-navigation__content"
         }, [slots.default()])]
       });
-    };
+    });
+    return {};
   }
 
 });

package/lib/components/VBottomNavigation/VBottomNavigation.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VBottomNavigation.mjs","names":["makeBorderProps","useBorder","makeDensityProps","useDensity","makeElevationProps","useElevation","makeGroupProps","useGroup","makeLayoutItemProps","useLayoutItem","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","useTheme","provideDefaults","useBackgroundColor","useProxiedModel","computed","toRef","convertToUnit","defineComponent","VBtnToggleSymbol","VBottomNavigation","name","props","bgColor","String","color","grow","Boolean","mode","type","validator","v","includes","height","Number","default","tag","modelValue","selectedClass","emits","value","setup","slots","themeClasses","borderClasses","backgroundColorClasses","backgroundColorStyles","densityClasses","elevationClasses","roundedClasses","density","isActive","layoutItemStyles","id","order","parseInt","position","layoutSize","elementSize","active","absolute","VBtn","stacked","variant","scoped","transform"],"sources":["../../../src/components/VBottomNavigation/VBottomNavigation.tsx"],"sourcesContent":["// Styles\nimport './VBottomNavigation.sass'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeGroupProps, useGroup } from '@/composables/group'\nimport { makeLayoutItemProps, useLayoutItem } from '@/composables/layout'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, useTheme } from '@/composables/theme'\nimport { provideDefaults } from '@/composables/defaults'\nimport { useBackgroundColor } from '@/composables/color'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { convertToUnit, defineComponent } from '@/util'\n\n// Types\nimport { VBtnToggleSymbol } from '../VBtnToggle/VBtnToggle'\n\nexport const VBottomNavigation = defineComponent({\n  name: 'VBottomNavigation',\n\n  props: {\n    bgColor: String,\n    color: String,\n    grow: Boolean,\n    mode: {\n      type: String,\n      validator: (v: any) => !v || ['horizontal', 'shift'].includes(v),\n    },\n    height: {\n      type: [Number, String],\n      default: 56,\n    },\n\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeElevationProps(),\n    ...makeRoundedProps(),\n    ...makeLayoutItemProps({ name: 'bottom-navigation' }),\n    ...makeTagProps({ tag: 'header' }),\n    ...makeGroupProps({\n      modelValue: true,\n      selectedClass: 'v-btn--selected',\n    }),\n    ...makeThemeProps(),\n  },\n\n  emits: {\n    'update:modelValue': (value: any) => true,\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = useTheme()\n    const { borderClasses } = useBorder(props)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'bgColor'))\n    const { densityClasses } = useDensity(props)\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props)\n    const height = computed(() => (\n      Number(props.height) -\n      (props.density === 'comfortable' ? 8 : 0) -\n      (props.density === 'compact' ? 16 : 0)\n    ))\n    const isActive = useProxiedModel(props, 'modelValue', props.modelValue)\n    const { layoutItemStyles } = useLayoutItem({\n      id: props.name,\n      order: computed(() => parseInt(props.order, 10)),\n      position: computed(() => 'bottom'),\n      layoutSize: computed(() => isActive.value ? height.value : 0),\n      elementSize: height,\n      active: isActive,\n      absolute: toRef(props, 'absolute'),\n    })\n\n    useGroup(props, VBtnToggleSymbol)\n\n    provideDefaults({\n      VBtn: {\n        color: toRef(props, 'color'),\n        density: toRef(props, 'density'),\n        stacked: computed(() => props.mode !== 'horizontal'),\n        variant: 'text',\n      },\n    }, { scoped: true })\n\n    return () => {\n      return (\n        <props.tag\n          class={[\n            'v-bottom-navigation',\n            {\n              'v-bottom-navigation--active': isActive.value,\n              'v-bottom-navigation--grow': props.grow,\n              'v-bottom-navigation--shift': props.mode === 'shift',\n            },\n            themeClasses.value,\n            backgroundColorClasses.value,\n            borderClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            roundedClasses.value,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            layoutItemStyles.value,\n            {\n              height: convertToUnit(height.value),\n              transform: `translateY(${convertToUnit(!isActive.value ? 100 : 0, '%')})`,\n            },\n          ]}\n        >\n          { slots.default && (\n            <div class=\"v-bottom-navigation__content\">\n              { slots.default() }\n            </div>\n          ) }\n        </props.tag>\n      )\n    }\n  },\n})\n\nexport type VBottomNavigation = InstanceType<typeof VBottomNavigation>\n"],"mappings":"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"}
+{"version":3,"file":"VBottomNavigation.mjs","names":["makeBorderProps","useBorder","makeDensityProps","useDensity","makeElevationProps","useElevation","makeGroupProps","useGroup","makeLayoutItemProps","useLayoutItem","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","useTheme","provideDefaults","useBackgroundColor","useProxiedModel","computed","toRef","convertToUnit","defineComponent","useRender","VBtnToggleSymbol","VBottomNavigation","name","props","bgColor","String","color","grow","Boolean","mode","type","validator","v","includes","height","Number","default","tag","modelValue","selectedClass","emits","value","setup","slots","themeClasses","borderClasses","backgroundColorClasses","backgroundColorStyles","densityClasses","elevationClasses","roundedClasses","density","isActive","layoutItemStyles","id","order","parseInt","position","layoutSize","elementSize","active","absolute","VBtn","stacked","variant","scoped","transform"],"sources":["../../../src/components/VBottomNavigation/VBottomNavigation.tsx"],"sourcesContent":["// Styles\nimport './VBottomNavigation.sass'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeGroupProps, useGroup } from '@/composables/group'\nimport { makeLayoutItemProps, useLayoutItem } from '@/composables/layout'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, useTheme } from '@/composables/theme'\nimport { provideDefaults } from '@/composables/defaults'\nimport { useBackgroundColor } from '@/composables/color'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { convertToUnit, defineComponent, useRender } from '@/util'\n\n// Types\nimport { VBtnToggleSymbol } from '../VBtnToggle/VBtnToggle'\n\nexport const VBottomNavigation = defineComponent({\n  name: 'VBottomNavigation',\n\n  props: {\n    bgColor: String,\n    color: String,\n    grow: Boolean,\n    mode: {\n      type: String,\n      validator: (v: any) => !v || ['horizontal', 'shift'].includes(v),\n    },\n    height: {\n      type: [Number, String],\n      default: 56,\n    },\n\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeElevationProps(),\n    ...makeRoundedProps(),\n    ...makeLayoutItemProps({ name: 'bottom-navigation' }),\n    ...makeTagProps({ tag: 'header' }),\n    ...makeGroupProps({\n      modelValue: true,\n      selectedClass: 'v-btn--selected',\n    }),\n    ...makeThemeProps(),\n  },\n\n  emits: {\n    'update:modelValue': (value: any) => true,\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = useTheme()\n    const { borderClasses } = useBorder(props)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'bgColor'))\n    const { densityClasses } = useDensity(props)\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props)\n    const height = computed(() => (\n      Number(props.height) -\n      (props.density === 'comfortable' ? 8 : 0) -\n      (props.density === 'compact' ? 16 : 0)\n    ))\n    const isActive = useProxiedModel(props, 'modelValue', props.modelValue)\n    const { layoutItemStyles } = useLayoutItem({\n      id: props.name,\n      order: computed(() => parseInt(props.order, 10)),\n      position: computed(() => 'bottom'),\n      layoutSize: computed(() => isActive.value ? height.value : 0),\n      elementSize: height,\n      active: isActive,\n      absolute: toRef(props, 'absolute'),\n    })\n\n    useGroup(props, VBtnToggleSymbol)\n\n    provideDefaults({\n      VBtn: {\n        color: toRef(props, 'color'),\n        density: toRef(props, 'density'),\n        stacked: computed(() => props.mode !== 'horizontal'),\n        variant: 'text',\n      },\n    }, { scoped: true })\n\n    useRender(() => {\n      return (\n        <props.tag\n          class={[\n            'v-bottom-navigation',\n            {\n              'v-bottom-navigation--active': isActive.value,\n              'v-bottom-navigation--grow': props.grow,\n              'v-bottom-navigation--shift': props.mode === 'shift',\n            },\n            themeClasses.value,\n            backgroundColorClasses.value,\n            borderClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            roundedClasses.value,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            layoutItemStyles.value,\n            {\n              height: convertToUnit(height.value),\n              transform: `translateY(${convertToUnit(!isActive.value ? 100 : 0, '%')})`,\n            },\n          ]}\n        >\n          { slots.default && (\n            <div class=\"v-bottom-navigation__content\">\n              { slots.default() }\n            </div>\n          ) }\n        </props.tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VBottomNavigation = InstanceType<typeof VBottomNavigation>\n"],"mappings":"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"}

package/lib/components/VBottomNavigation/VBottomNavigation.sass

@@ -1,4 +1,3 @@
-@forward './variables'
 @use '../../styles/tools'
 @use './variables' as *
 
@@ -42,22 +41,15 @@
       .v-btn__icon
         font-size: $bottom-navigation-icon-font-size
 
-      &:not(.v-btn--selected):not(.v-btn--disabled)
-        color: $bottom-navigation-button-color
-
   .v-bottom-navigation--grow &
     > .v-btn
       flex-grow: 1
 
   .v-bottom-navigation--shift &
-    > .v-btn
-      .v-btn__icon
-        top: $bottom-navigation-shift-icon-top
-        transform: $bottom-navigation-shift-icon-transform
-
+    .v-btn
       &:not(.v-btn--selected)
-        .v-btn__content
-          color: $bottom-navigation-shift-content-color
+        .v-btn__content > span
+          opacity: 0
 
-        .v-btn__icon
-          transform: translateY(0)
+        .v-btn__content
+          transform: $bottom-navigation-shift-icon-transform

package/lib/components/VBottomNavigation/_variables.scss

@@ -4,7 +4,7 @@
 @use "../../styles/settings/variables";
 @use "../../styles/tools/functions";
 
-// Defaults
+// VBottomNavigation
 $bottom-navigation-background: rgb(var(--v-theme-surface)) !default;
 $bottom-navigation-border-color: settings.$border-color-root !default;
 $bottom-navigation-border-radius: 0 !default;
@@ -12,24 +12,23 @@ $bottom-navigation-border-radius: map.get(settings.$rounded, '0') !default;
 $bottom-navigation-border-style: settings.$border-style-root !default;
 $bottom-navigation-border-thin-width: thin !default;
 $bottom-navigation-border-width: 0 !default;
+$bottom-navigation-button-color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity)) !default;
+$bottom-navigation-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
 $bottom-navigation-content-font-size: functions.map-deep-get(variables.$typography, 'caption', 'size') !default;
 $bottom-navigation-elevation: 4 !default;
 $bottom-navigation-flat-elevation: 0 !default;
 $bottom-navigation-height: 100% !default;
-$bottom-navigation-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
 $bottom-navigation-icon-font-size: 1.5rem !default;
 $bottom-navigation-max-width: 168px !default;
 $bottom-navigation-min-width: 80px !default;
 $bottom-navigation-opacity: var(--v-medium-emphasis-opacity) !default;
-$bottom-navigation-button-color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity)) !default;
-$bottom-navigation-text-transform: none !default;
-$bottom-navigation-transition: transform, color .2s, .1s settings.$standard-easing !default;
-
-// Shift
 $bottom-navigation-shift-content-color: rgba(var(--v-theme-on-surface), 0) !default;
 $bottom-navigation-shift-icon-top: math.div($bottom-navigation-icon-font-size, 3) !default;
-$bottom-navigation-shift-icon-transform: translateY(-($bottom-navigation-shift-icon-top)) !default;
+$bottom-navigation-shift-icon-transform: translateY($bottom-navigation-shift-icon-top) !default;
+$bottom-navigation-text-transform: none !default;
+$bottom-navigation-transition: transform, color .2s, .1s settings.$standard-easing !default;
 
+// Lists
 $bottom-navigation-border: (
   $bottom-navigation-border-color,
   $bottom-navigation-border-style,

package/lib/components/VBreadcrumbs/VBreadcrumbs.css

@@ -1,4 +1,6 @@
 .v-breadcrumbs {
+  display: flex;
+  align-items: center;
   line-height: 1.375rem;
   padding: 16px 12px;
 }
@@ -6,18 +8,23 @@
   border-radius: 4px;
 }
 .v-breadcrumbs--density-default {
-  padding-top: 16px 12px0px;
-  padding-bottom: 16px 12px0px;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 
 .v-breadcrumbs--density-comfortable {
-  padding-top: 16px 12px-4px;
-  padding-bottom: 16px 12px-4px;
+  padding-top: 12px;
+  padding-bottom: 12px;
 }
 
 .v-breadcrumbs--density-compact {
-  padding-top: 16px 12px-8px;
-  padding-bottom: 16px 12px-8px;
+  padding-top: 8px;
+  padding-bottom: 8px;
+}
+
+.v-breadcrumbs__prepend {
+  align-items: center;
+  display: inline-flex;
 }
 
 .v-breadcrumbs-item {

package/lib/components/VBreadcrumbs/VBreadcrumbs.mjs

@@ -2,21 +2,22 @@ import { mergeProps as _mergeProps, resolveDirective as _resolveDirective, Fragm
 // Styles
 import "./VBreadcrumbs.css"; // Components
 
-import { VIcon } from "../VIcon/index.mjs";
+import { VBreadcrumbsDivider } from "./VBreadcrumbsDivider.mjs";
 import { VBreadcrumbsItem } from "./VBreadcrumbsItem.mjs";
-import { VBreadcrumbsDivider } from "./VBreadcrumbsDivider.mjs"; // Composables
+import { VDefaultsProvider } from "../VDefaultsProvider/index.mjs";
+import { VIcon } from "../VIcon/index.mjs"; // Composables
 
+import { IconValue } from "../../composables/icons.mjs";
 import { makeDensityProps, useDensity } from "../../composables/density.mjs";
 import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
 import { provideDefaults } from "../../composables/defaults.mjs";
-import { useBackgroundColor } from "../../composables/color.mjs";
-import { IconValue } from "../../composables/icons.mjs"; // Utilities
+import { useBackgroundColor } from "../../composables/color.mjs"; // Utilities
 
-import { toRef } from 'vue';
-import { defineComponent, useRender } from "../../util/index.mjs"; // Types
+import { genericComponent, useRender } from "../../util/index.mjs";
+import { toRef } from 'vue'; // Types
 
-export const VBreadcrumbs = defineComponent({
+export const VBreadcrumbs = genericComponent()({
   name: 'VBreadcrumbs',
   props: {
     activeClass: String,
@@ -44,16 +45,16 @@ export const VBreadcrumbs = defineComponent({
     let {
       slots
     } = _ref;
+    const {
+      backgroundColorClasses,
+      backgroundColorStyles
+    } = useBackgroundColor(toRef(props, 'bgColor'));
     const {
       densityClasses
     } = useDensity(props);
     const {
       roundedClasses
     } = useRounded(props);
-    const {
-      backgroundColorClasses,
-      backgroundColorStyles
-    } = useBackgroundColor(toRef(props, 'bgColor'));
     provideDefaults({
       VBreadcrumbsItem: {
         activeClass: toRef(props, 'activeClass'),
@@ -65,26 +66,36 @@ export const VBreadcrumbs = defineComponent({
     useRender(() => {
       var _slots$default;
 
+      const hasPrepend = !!(slots.prepend || props.icon);
       return _createVNode(props.tag, {
         "class": ['v-breadcrumbs', backgroundColorClasses.value, densityClasses.value, roundedClasses.value],
         "style": backgroundColorStyles.value
       }, {
-        default: () => [props.icon && _createVNode(VIcon, {
-          "icon": props.icon,
-          "left": true
-        }, null), props.items.map((item, index, array) => {
+        default: () => [hasPrepend && _createVNode(VDefaultsProvider, {
+          "key": "prepend",
+          "defaults": {
+            VIcon: {
+              icon: props.icon,
+              start: true
+            }
+          }
+        }, {
+          default: () => [_createVNode("div", {
+            "class": "v-breadcrumbs__prepend"
+          }, [slots.prepend ? slots.prepend() : props.icon && _createVNode(VIcon, null, null)])]
+        }), props.items.map((item, index, array) => {
           var _slots$divider, _slots$divider2;
 
           return _createVNode(_Fragment, null, [_createVNode(VBreadcrumbsItem, _mergeProps({
             "key": index,
             "disabled": index >= array.length - 1
           }, typeof item === 'string' ? {
-            text: item
+            title: item
           } : item), {
-            default: slots.text ? () => {
-              var _slots$text;
+            default: slots.title ? () => {
+              var _slots$title;
 
-              return (_slots$text = slots.text) == null ? void 0 : _slots$text.call(slots, {
+              return (_slots$title = slots.title) == null ? void 0 : _slots$title.call(slots, {
                 item,
                 index
               });

package/lib/components/VBreadcrumbs/VBreadcrumbs.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VBreadcrumbs.mjs","names":["VIcon","VBreadcrumbsItem","VBreadcrumbsDivider","makeDensityProps","useDensity","makeRoundedProps","useRounded","makeTagProps","provideDefaults","useBackgroundColor","IconValue","toRef","defineComponent","useRender","VBreadcrumbs","name","props","activeClass","String","activeColor","bgColor","color","disabled","Boolean","divider","type","default","icon","items","Array","tag","setup","slots","densityClasses","roundedClasses","backgroundColorClasses","backgroundColorStyles","value","map","item","index","array","length","text","undefined"],"sources":["../../../src/components/VBreadcrumbs/VBreadcrumbs.tsx"],"sourcesContent":["// Styles\nimport './VBreadcrumbs.sass'\n\n// Components\nimport { VIcon } from '@/components/VIcon'\nimport { VBreadcrumbsItem } from './VBreadcrumbsItem'\nimport { VBreadcrumbsDivider } from './VBreadcrumbsDivider'\n\n// Composables\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { provideDefaults } from '@/composables/defaults'\nimport { useBackgroundColor } from '@/composables/color'\nimport { IconValue } from '@/composables/icons'\n\n// Utilities\nimport { toRef } from 'vue'\nimport { defineComponent, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { LinkProps } from '@/composables/router'\n\nexport type BreadcrumbItem = string | (LinkProps & {\n  text: string\n  disabled?: boolean\n})\n\nexport const VBreadcrumbs = defineComponent({\n  name: 'VBreadcrumbs',\n\n  props: {\n    activeClass: String,\n    activeColor: String,\n    bgColor: String,\n    color: String,\n    disabled: Boolean,\n    divider: {\n      type: String,\n      default: '/',\n    },\n    icon: IconValue,\n    items: {\n      type: Array as PropType<BreadcrumbItem[]>,\n      default: () => ([]),\n    },\n\n    ...makeDensityProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps({ tag: 'ul' }),\n  },\n\n  setup (props, { slots }) {\n    const { densityClasses } = useDensity(props)\n    const { roundedClasses } = useRounded(props)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'bgColor'))\n\n    provideDefaults({\n      VBreadcrumbsItem: {\n        activeClass: toRef(props, 'activeClass'),\n        activeColor: toRef(props, 'activeColor'),\n        color: toRef(props, 'color'),\n        disabled: toRef(props, 'disabled'),\n      },\n    })\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-breadcrumbs',\n          backgroundColorClasses.value,\n          densityClasses.value,\n          roundedClasses.value,\n        ]}\n        style={ backgroundColorStyles.value }\n      >\n        { props.icon && (\n          <VIcon icon={ props.icon } left />\n        ) }\n\n        { props.items.map((item, index, array) => (\n          <>\n            <VBreadcrumbsItem\n              key={ index }\n              disabled={ index >= array.length - 1 }\n              { ...(typeof item === 'string' ? { text: item } : item) }\n              v-slots={{\n                default: slots.text ? () => slots.text?.({ item, index }) : undefined,\n              }}\n            />\n\n            { index < array.length - 1 && (\n              <VBreadcrumbsDivider>\n                { slots.divider?.({ item, index }) ?? props.divider }\n              </VBreadcrumbsDivider>\n            ) }\n          </>\n        )) }\n\n        { slots.default?.() }\n      </props.tag>\n    ))\n\n    return {}\n  },\n})\n\nexport type VBreadcrumbs = InstanceType<typeof VBreadcrumbs>\n"],"mappings":"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"}
+{"version":3,"file":"VBreadcrumbs.mjs","names":["VBreadcrumbsDivider","VBreadcrumbsItem","VDefaultsProvider","VIcon","IconValue","makeDensityProps","useDensity","makeRoundedProps","useRounded","makeTagProps","provideDefaults","useBackgroundColor","genericComponent","useRender","toRef","VBreadcrumbs","name","props","activeClass","String","activeColor","bgColor","color","disabled","Boolean","divider","type","default","icon","items","Array","tag","setup","slots","backgroundColorClasses","backgroundColorStyles","densityClasses","roundedClasses","hasPrepend","prepend","value","start","map","item","index","array","length","title","undefined"],"sources":["../../../src/components/VBreadcrumbs/VBreadcrumbs.tsx"],"sourcesContent":["// Styles\nimport './VBreadcrumbs.sass'\n\n// Components\nimport { VBreadcrumbsDivider } from './VBreadcrumbsDivider'\nimport { VBreadcrumbsItem } from './VBreadcrumbsItem'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { provideDefaults } from '@/composables/defaults'\nimport { useBackgroundColor } from '@/composables/color'\n\n// Utilities\nimport { genericComponent, useRender } from '@/util'\nimport { toRef } from 'vue'\n\n// Types\nimport type { LinkProps } from '@/composables/router'\nimport type { MakeSlots } from '@/util'\nimport type { PropType } from 'vue'\n\nexport type BreadcrumbItem = string | (LinkProps & {\n  text: string\n  disabled?: boolean\n})\n\nexport const VBreadcrumbs = genericComponent<new <T>() => {\n  $props: {\n    items?: T[]\n  }\n  $slots: MakeSlots<{\n    default: []\n    item: [T | number]\n  }>\n}>()({\n  name: 'VBreadcrumbs',\n\n  props: {\n    activeClass: String,\n    activeColor: String,\n    bgColor: String,\n    color: String,\n    disabled: Boolean,\n    divider: {\n      type: String,\n      default: '/',\n    },\n    icon: IconValue,\n    items: {\n      type: Array as PropType<BreadcrumbItem[]>,\n      default: () => ([]),\n    },\n\n    ...makeDensityProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps({ tag: 'ul' }),\n  },\n\n  setup (props, { slots }) {\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'bgColor'))\n    const { densityClasses } = useDensity(props)\n\n    const { roundedClasses } = useRounded(props)\n\n    provideDefaults({\n      VBreadcrumbsItem: {\n        activeClass: toRef(props, 'activeClass'),\n        activeColor: toRef(props, 'activeColor'),\n        color: toRef(props, 'color'),\n        disabled: toRef(props, 'disabled'),\n      },\n    })\n\n    useRender(() => {\n      const hasPrepend = !!(slots.prepend || props.icon)\n\n      return (\n        <props.tag\n          class={[\n            'v-breadcrumbs',\n            backgroundColorClasses.value,\n            densityClasses.value,\n            roundedClasses.value,\n          ]}\n          style={ backgroundColorStyles.value }\n        >\n          { hasPrepend && (\n            <VDefaultsProvider\n              key=\"prepend\"\n              defaults={{\n                VIcon: {\n                  icon: props.icon,\n                  start: true,\n                },\n              }}\n            >\n              <div class=\"v-breadcrumbs__prepend\">\n                { slots.prepend\n                  ? slots.prepend()\n                  : props.icon && (<VIcon />)\n                }\n              </div>\n            </VDefaultsProvider>\n          ) }\n\n          { props.items.map((item, index, array) => (\n            <>\n              <VBreadcrumbsItem\n                key={ index }\n                disabled={ index >= array.length - 1 }\n                { ...(typeof item === 'string' ? { title: item } : item) }\n                v-slots={{\n                  default: slots.title ? () => slots.title?.({ item, index }) : undefined,\n                }}\n              />\n\n              { index < array.length - 1 && (\n                <VBreadcrumbsDivider>\n                  { slots.divider?.({ item, index }) ?? props.divider }\n                </VBreadcrumbsDivider>\n              ) }\n            </>\n          )) }\n\n          { slots.default?.() }\n        </props.tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VBreadcrumbs = InstanceType<typeof VBreadcrumbs>\n"],"mappings":"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"}

package/lib/components/VBreadcrumbs/VBreadcrumbs.sass

@@ -1,19 +1,23 @@
-@forward './variables'
 @use '../../styles/tools'
 @use './variables' as *
 
 .v-breadcrumbs
+  display: flex
+  align-items: center
   line-height: $breadcrumbs-line-height
-  padding: $breadcrumbs-padding
+  padding: $breadcrumbs-padding-y $breadcrumbs-padding-x
 
   &--rounded
     @include tools.rounded($breadcrumbs-rounded-border-radius)
 
   @at-root
     @include tools.density('v-breadcrumbs', $breadcrumbs-density) using ($modifier)
-      padding-top: $breadcrumbs-padding + $modifier
-      padding-bottom: $breadcrumbs-padding + $modifier
+      padding-top: #{$breadcrumbs-padding-y + $modifier}
+      padding-bottom: #{$breadcrumbs-padding-y + $modifier}
 
+.v-breadcrumbs__prepend
+  align-items: center
+  display: inline-flex
 
 .v-breadcrumbs-item
   align-items: center

package/lib/components/VBreadcrumbs/VBreadcrumbsItem.mjs

@@ -1,4 +1,4 @@
-import { createVNode as _createVNode, resolveDirective as _resolveDirective } from "vue";
+import { createVNode as _createVNode } from "vue";
 // Composables
 import { makeRouterProps, useLink } from "../../composables/router.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
@@ -14,7 +14,7 @@ export const VBreadcrumbsItem = defineComponent({
     activeColor: String,
     color: String,
     disabled: Boolean,
-    text: String,
+    title: String,
     ...makeRouterProps(),
     ...makeTagProps({
       tag: 'li'
@@ -38,8 +38,9 @@ export const VBreadcrumbsItem = defineComponent({
       textColorStyles
     } = useTextColor(color);
     useRender(() => {
+      var _slots$default, _slots$default2;
+
       const Tag = link.isLink.value ? 'a' : props.tag;
-      const hasText = !!(slots.default || props.text);
       return _createVNode(Tag, {
         "class": ['v-breadcrumbs-item', {
           'v-breadcrumbs-item--active': isActive.value,
@@ -52,11 +53,7 @@ export const VBreadcrumbsItem = defineComponent({
         "aria-current": isActive.value ? 'page' : undefined,
         "onClick": link.navigate
       }, {
-        default: hasText ? () => {
-          var _slots$default, _slots$default2;
-
-          return (_slots$default = (_slots$default2 = slots.default) == null ? void 0 : _slots$default2.call(slots)) != null ? _slots$default : props.text;
-        } : undefined
+        default: () => [(_slots$default = (_slots$default2 = slots.default) == null ? void 0 : _slots$default2.call(slots)) != null ? _slots$default : props.title]
       });
     });
     return {};

package/lib/components/VBreadcrumbs/VBreadcrumbsItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VBreadcrumbsItem.mjs","names":["makeRouterProps","useLink","makeTagProps","useTextColor","computed","defineComponent","useRender","VBreadcrumbsItem","name","props","active","Boolean","activeClass","String","activeColor","color","disabled","text","tag","setup","slots","attrs","link","isActive","isExactActive","value","textColorClasses","textColorStyles","Tag","isLink","hasText","default","href","undefined","navigate"],"sources":["../../../src/components/VBreadcrumbs/VBreadcrumbsItem.tsx"],"sourcesContent":["// Composables\nimport { makeRouterProps, useLink } from '@/composables/router'\nimport { makeTagProps } from '@/composables/tag'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed } from 'vue'\nimport { defineComponent, useRender } from '@/util'\n\nexport const VBreadcrumbsItem = defineComponent({\n  name: 'VBreadcrumbsItem',\n\n  props: {\n    active: Boolean,\n    activeClass: String,\n    activeColor: String,\n    color: String,\n    disabled: Boolean,\n    text: String,\n\n    ...makeRouterProps(),\n    ...makeTagProps({ tag: 'li' }),\n  },\n\n  setup (props, { slots, attrs }) {\n    const link = useLink(props, attrs)\n    const isActive = computed(() => props.active || link.isExactActive?.value)\n    const color = computed(() => isActive.value ? props.activeColor : props.color)\n\n    const { textColorClasses, textColorStyles } = useTextColor(color)\n\n    useRender(() => {\n      const Tag = link.isLink.value ? 'a' : props.tag\n      const hasText = !!(slots.default || props.text)\n\n      return (\n        <Tag\n          class={[\n            'v-breadcrumbs-item',\n            {\n              'v-breadcrumbs-item--active': isActive.value,\n              'v-breadcrumbs-item--disabled': props.disabled,\n              'v-breadcrumbs-item--link': link.isLink.value,\n              [`${props.activeClass}`]: isActive.value && props.activeClass,\n            },\n            textColorClasses.value,\n          ]}\n          style={[\n            textColorStyles.value,\n          ]}\n          href={ link.href.value }\n          aria-current={ isActive.value ? 'page' : undefined }\n          onClick={ link.navigate }\n          v-slots={{\n            default: hasText ? () => slots.default?.() ?? props.text : undefined,\n          }}\n        />\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VBreadcrumbsItem = InstanceType<typeof VBreadcrumbsItem>\n"],"mappings":";AAAA;SACSA,e,EAAiBC,O;SACjBC,Y;SACAC,Y,uCAET;;AACA,SAASC,QAAT,QAAyB,KAAzB;SACSC,e,EAAiBC,S;AAE1B,OAAO,MAAMC,gBAAgB,GAAGF,eAAe,CAAC;EAC9CG,IAAI,EAAE,kBADwC;EAG9CC,KAAK,EAAE;IACLC,MAAM,EAAEC,OADH;IAELC,WAAW,EAAEC,MAFR;IAGLC,WAAW,EAAED,MAHR;IAILE,KAAK,EAAEF,MAJF;IAKLG,QAAQ,EAAEL,OALL;IAMLM,IAAI,EAAEJ,MAND;IAQL,GAAGb,eAAe,EARb;IASL,GAAGE,YAAY,CAAC;MAAEgB,GAAG,EAAE;IAAP,CAAD;EATV,CAHuC;;EAe9CC,KAAK,CAAEV,KAAF,QAA2B;IAAA,IAAlB;MAAEW,KAAF;MAASC;IAAT,CAAkB;IAC9B,MAAMC,IAAI,GAAGrB,OAAO,CAACQ,KAAD,EAAQY,KAAR,CAApB;IACA,MAAME,QAAQ,GAAGnB,QAAQ,CAAC;MAAA;;MAAA,OAAMK,KAAK,CAACC,MAAN,4BAAgBY,IAAI,CAACE,aAArB,qBAAgB,oBAAoBC,KAApC,CAAN;IAAA,CAAD,CAAzB;IACA,MAAMV,KAAK,GAAGX,QAAQ,CAAC,MAAMmB,QAAQ,CAACE,KAAT,GAAiBhB,KAAK,CAACK,WAAvB,GAAqCL,KAAK,CAACM,KAAlD,CAAtB;IAEA,MAAM;MAAEW,gBAAF;MAAoBC;IAApB,IAAwCxB,YAAY,CAACY,KAAD,CAA1D;IAEAT,SAAS,CAAC,MAAM;MACd,MAAMsB,GAAG,GAAGN,IAAI,CAACO,MAAL,CAAYJ,KAAZ,GAAoB,GAApB,GAA0BhB,KAAK,CAACS,GAA5C;MACA,MAAMY,OAAO,GAAG,CAAC,EAAEV,KAAK,CAACW,OAAN,IAAiBtB,KAAK,CAACQ,IAAzB,CAAjB;MAEA;QAAA,SAEW,CACL,oBADK,EAEL;UACE,8BAA8BM,QAAQ,CAACE,KADzC;UAEE,gCAAgChB,KAAK,CAACO,QAFxC;UAGE,4BAA4BM,IAAI,CAACO,MAAL,CAAYJ,KAH1C;UAIE,CAAE,GAAEhB,KAAK,CAACG,WAAY,EAAtB,GAA0BW,QAAQ,CAACE,KAAT,IAAkBhB,KAAK,CAACG;QAJpD,CAFK,EAQLc,gBAAgB,CAACD,KARZ,CAFX;QAAA,SAYW,CACLE,eAAe,CAACF,KADX,CAZX;QAAA,QAeWH,IAAI,CAACU,IAAL,CAAUP,KAfrB;QAAA,gBAgBmBF,QAAQ,CAACE,KAAT,GAAiB,MAAjB,GAA0BQ,SAhB7C;QAAA,WAiBcX,IAAI,CAACY;MAjBnB,GAkBa;QACPH,OAAO,EAAED,OAAO,GAAG;UAAA;;UAAA,4CAAMV,KAAK,CAACW,OAAZ,qBAAM,qBAAAX,KAAK,CAAX,6BAA2BX,KAAK,CAACQ,IAAjC;QAAA,CAAH,GAA2CgB;MADpD,CAlBb;IAuBD,CA3BQ,CAAT;IA6BA,OAAO,EAAP;EACD;;AApD6C,CAAD,CAAxC"}
+{"version":3,"file":"VBreadcrumbsItem.mjs","names":["makeRouterProps","useLink","makeTagProps","useTextColor","computed","defineComponent","useRender","VBreadcrumbsItem","name","props","active","Boolean","activeClass","String","activeColor","color","disabled","title","tag","setup","slots","attrs","link","isActive","isExactActive","value","textColorClasses","textColorStyles","Tag","isLink","href","undefined","navigate","default"],"sources":["../../../src/components/VBreadcrumbs/VBreadcrumbsItem.tsx"],"sourcesContent":["// Composables\nimport { makeRouterProps, useLink } from '@/composables/router'\nimport { makeTagProps } from '@/composables/tag'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed } from 'vue'\nimport { defineComponent, useRender } from '@/util'\n\nexport const VBreadcrumbsItem = defineComponent({\n  name: 'VBreadcrumbsItem',\n\n  props: {\n    active: Boolean,\n    activeClass: String,\n    activeColor: String,\n    color: String,\n    disabled: Boolean,\n    title: String,\n\n    ...makeRouterProps(),\n    ...makeTagProps({ tag: 'li' }),\n  },\n\n  setup (props, { slots, attrs }) {\n    const link = useLink(props, attrs)\n    const isActive = computed(() => props.active || link.isExactActive?.value)\n    const color = computed(() => isActive.value ? props.activeColor : props.color)\n\n    const { textColorClasses, textColorStyles } = useTextColor(color)\n\n    useRender(() => {\n      const Tag = link.isLink.value ? 'a' : props.tag\n\n      return (\n        <Tag\n          class={[\n            'v-breadcrumbs-item',\n            {\n              'v-breadcrumbs-item--active': isActive.value,\n              'v-breadcrumbs-item--disabled': props.disabled,\n              'v-breadcrumbs-item--link': link.isLink.value,\n              [`${props.activeClass}`]: isActive.value && props.activeClass,\n            },\n            textColorClasses.value,\n          ]}\n          style={[\n            textColorStyles.value,\n          ]}\n          href={ link.href.value }\n          aria-current={ isActive.value ? 'page' : undefined }\n          onClick={ link.navigate }\n        >\n          { slots.default?.() ?? props.title }\n        </Tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VBreadcrumbsItem = InstanceType<typeof VBreadcrumbsItem>\n"],"mappings":";AAAA;SACSA,e,EAAiBC,O;SACjBC,Y;SACAC,Y,uCAET;;AACA,SAASC,QAAT,QAAyB,KAAzB;SACSC,e,EAAiBC,S;AAE1B,OAAO,MAAMC,gBAAgB,GAAGF,eAAe,CAAC;EAC9CG,IAAI,EAAE,kBADwC;EAG9CC,KAAK,EAAE;IACLC,MAAM,EAAEC,OADH;IAELC,WAAW,EAAEC,MAFR;IAGLC,WAAW,EAAED,MAHR;IAILE,KAAK,EAAEF,MAJF;IAKLG,QAAQ,EAAEL,OALL;IAMLM,KAAK,EAAEJ,MANF;IAQL,GAAGb,eAAe,EARb;IASL,GAAGE,YAAY,CAAC;MAAEgB,GAAG,EAAE;IAAP,CAAD;EATV,CAHuC;;EAe9CC,KAAK,CAAEV,KAAF,QAA2B;IAAA,IAAlB;MAAEW,KAAF;MAASC;IAAT,CAAkB;IAC9B,MAAMC,IAAI,GAAGrB,OAAO,CAACQ,KAAD,EAAQY,KAAR,CAApB;IACA,MAAME,QAAQ,GAAGnB,QAAQ,CAAC;MAAA;;MAAA,OAAMK,KAAK,CAACC,MAAN,4BAAgBY,IAAI,CAACE,aAArB,qBAAgB,oBAAoBC,KAApC,CAAN;IAAA,CAAD,CAAzB;IACA,MAAMV,KAAK,GAAGX,QAAQ,CAAC,MAAMmB,QAAQ,CAACE,KAAT,GAAiBhB,KAAK,CAACK,WAAvB,GAAqCL,KAAK,CAACM,KAAlD,CAAtB;IAEA,MAAM;MAAEW,gBAAF;MAAoBC;IAApB,IAAwCxB,YAAY,CAACY,KAAD,CAA1D;IAEAT,SAAS,CAAC,MAAM;MAAA;;MACd,MAAMsB,GAAG,GAAGN,IAAI,CAACO,MAAL,CAAYJ,KAAZ,GAAoB,GAApB,GAA0BhB,KAAK,CAACS,GAA5C;MAEA;QAAA,SAEW,CACL,oBADK,EAEL;UACE,8BAA8BK,QAAQ,CAACE,KADzC;UAEE,gCAAgChB,KAAK,CAACO,QAFxC;UAGE,4BAA4BM,IAAI,CAACO,MAAL,CAAYJ,KAH1C;UAIE,CAAE,GAAEhB,KAAK,CAACG,WAAY,EAAtB,GAA0BW,QAAQ,CAACE,KAAT,IAAkBhB,KAAK,CAACG;QAJpD,CAFK,EAQLc,gBAAgB,CAACD,KARZ,CAFX;QAAA,SAYW,CACLE,eAAe,CAACF,KADX,CAZX;QAAA,QAeWH,IAAI,CAACQ,IAAL,CAAUL,KAfrB;QAAA,gBAgBmBF,QAAQ,CAACE,KAAT,GAAiB,MAAjB,GAA0BM,SAhB7C;QAAA,WAiBcT,IAAI,CAACU;MAjBnB;QAAA,qDAmBMZ,KAAK,CAACa,OAnBZ,qBAmBM,qBAAAb,KAAK,CAnBX,6BAmB2BX,KAAK,CAACQ,KAnBjC;MAAA;IAsBD,CAzBQ,CAAT;IA2BA,OAAO,EAAP;EACD;;AAlD6C,CAAD,CAAxC"}

package/lib/components/VBreadcrumbs/_variables.scss

@@ -11,6 +11,7 @@ $breadcrumbs-item-icon-margin-inline-start: -4px !default;
 $breadcrumbs-item-link-text-decoration: underline !default;
 $breadcrumbs-item-padding: 0 4px !default;
 $breadcrumbs-line-height: tools.map-deep-get(settings.$typography, 'subtitle-2', 'line-height') !default;
-$breadcrumbs-padding: 16px 12px !default;
+$breadcrumbs-padding-y: 16px !default;
+$breadcrumbs-padding-x: 12px !default;
 $breadcrumbs-rounded-border-radius: settings.$border-radius-root !default;
 $breadcrumbs-vertical-align: middle !default;