vuetify 3.2.2 → 3.2.4

package/lib/components/VBadge/VBadge.mjs

@@ -13,42 +13,43 @@ import { makeThemeProps, useTheme } from "../../composables/theme.mjs";
 import { makeTransitionProps, MaybeTransition } from "../../composables/transition.mjs";
 import { useBackgroundColor, useTextColor } from "../../composables/color.mjs";
 import { useLocale } from "../../composables/locale.mjs"; // Utilities
-import { genericComponent, pick, useRender } from "../../util/index.mjs";
+import { genericComponent, pick, propsFactory, useRender } from "../../util/index.mjs";
 import { toRef } from 'vue';
+export const makeVBadgeProps = propsFactory({
+  bordered: Boolean,
+  color: String,
+  content: [Number, String],
+  dot: Boolean,
+  floating: Boolean,
+  icon: IconValue,
+  inline: Boolean,
+  label: {
+    type: String,
+    default: '$vuetify.badge'
+  },
+  max: [Number, String],
+  modelValue: {
+    type: Boolean,
+    default: true
+  },
+  offsetX: [Number, String],
+  offsetY: [Number, String],
+  textColor: String,
+  ...makeComponentProps(),
+  ...makeLocationProps({
+    location: 'top end'
+  }),
+  ...makeRoundedProps(),
+  ...makeTagProps(),
+  ...makeThemeProps(),
+  ...makeTransitionProps({
+    transition: 'scale-rotate-transition'
+  })
+}, 'v-badge');
 export const VBadge = genericComponent()({
   name: 'VBadge',
   inheritAttrs: false,
-  props: {
-    bordered: Boolean,
-    color: String,
-    content: [Number, String],
-    dot: Boolean,
-    floating: Boolean,
-    icon: IconValue,
-    inline: Boolean,
-    label: {
-      type: String,
-      default: '$vuetify.badge'
-    },
-    max: [Number, String],
-    modelValue: {
-      type: Boolean,
-      default: true
-    },
-    offsetX: [Number, String],
-    offsetY: [Number, String],
-    textColor: String,
-    ...makeComponentProps(),
-    ...makeLocationProps({
-      location: 'top end'
-    }),
-    ...makeRoundedProps(),
-    ...makeTagProps(),
-    ...makeThemeProps(),
-    ...makeTransitionProps({
-      transition: 'scale-rotate-transition'
-    })
-  },
+  props: makeVBadgeProps(),
   setup(props, ctx) {
     const {
       backgroundColorClasses,

package/lib/components/VBadge/VBadge.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VBadge.mjs","names":["VIcon","IconValue","makeComponentProps","makeLocationProps","useLocation","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","useTheme","makeTransitionProps","MaybeTransition","useBackgroundColor","useTextColor","useLocale","genericComponent","pick","useRender","toRef","VBadge","name","inheritAttrs","props","bordered","Boolean","color","String","content","Number","dot","floating","icon","inline","label","type","default","max","modelValue","offsetX","offsetY","textColor","location","transition","setup","ctx","backgroundColorClasses","backgroundColorStyles","roundedClasses","t","textColorClasses","textColorStyles","themeClasses","locationStyles","side","base","includes","value","isNaN","badgeAttrs","attrs","_createVNode","tag","_mergeProps","class","style","slots","_withDirectives","undefined","badge","_vShow"],"sources":["../../../src/components/VBadge/VBadge.tsx"],"sourcesContent":["// Styles\nimport './VBadge.sass'\n\n// Components\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeLocationProps, useLocation } from '@/composables/location'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, useTheme } from '@/composables/theme'\nimport { makeTransitionProps, MaybeTransition } from '@/composables/transition'\nimport { useBackgroundColor, useTextColor } from '@/composables/color'\nimport { useLocale } from '@/composables/locale'\n\n// Utilities\nimport { genericComponent, pick, useRender } from '@/util'\nimport { toRef } from 'vue'\n\nexport type VBadgeSlots = {\n  default: []\n  badge: []\n}\n\nexport const VBadge = genericComponent<VBadgeSlots>()({\n  name: 'VBadge',\n\n  inheritAttrs: false,\n\n  props: {\n    bordered: Boolean,\n    color: String,\n    content: [Number, String],\n    dot: Boolean,\n    floating: Boolean,\n    icon: IconValue,\n    inline: Boolean,\n    label: {\n      type: String,\n      default: '$vuetify.badge',\n    },\n    max: [Number, String],\n    modelValue: {\n      type: Boolean,\n      default: true,\n    },\n    offsetX: [Number, String],\n    offsetY: [Number, String],\n    textColor: String,\n\n    ...makeComponentProps(),\n    ...makeLocationProps({ location: 'top end' } as const),\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n    ...makeTransitionProps({ transition: 'scale-rotate-transition' }),\n  },\n\n  setup (props, ctx) {\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n    const { roundedClasses } = useRounded(props)\n    const { t } = useLocale()\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'textColor'))\n    const { themeClasses } = useTheme()\n\n    const { locationStyles } = useLocation(props, true, side => {\n      const base = props.floating\n        ? (props.dot ? 2 : 4)\n        : (props.dot ? 8 : 12)\n\n      return base + (\n        ['top', 'bottom'].includes(side) ? +(props.offsetY ?? 0)\n        : ['left', 'right'].includes(side) ? +(props.offsetX ?? 0)\n        : 0\n      )\n    })\n\n    useRender(() => {\n      const value = Number(props.content)\n      const content = (!props.max || isNaN(value)) ? props.content\n        : value <= +props.max ? value\n        : `${props.max}+`\n\n      const [badgeAttrs, attrs] = pick(ctx.attrs as Record<string, any>, [\n        'aria-atomic',\n        'aria-label',\n        'aria-live',\n        'role',\n        'title',\n      ])\n\n      return (\n        <props.tag\n          class={[\n            'v-badge',\n            {\n              'v-badge--bordered': props.bordered,\n              'v-badge--dot': props.dot,\n              'v-badge--floating': props.floating,\n              'v-badge--inline': props.inline,\n            },\n            props.class,\n          ]}\n          { ...attrs }\n          style={ props.style }\n        >\n          <div class=\"v-badge__wrapper\">\n            { ctx.slots.default?.() }\n\n            <MaybeTransition transition={ props.transition }>\n              <span\n                v-show={ props.modelValue }\n                class={[\n                  'v-badge__badge',\n                  themeClasses.value,\n                  backgroundColorClasses.value,\n                  roundedClasses.value,\n                  textColorClasses.value,\n                ]}\n                style={[\n                  backgroundColorStyles.value,\n                  textColorStyles.value,\n                  props.inline ? {} : locationStyles.value,\n                ]}\n                aria-atomic=\"true\"\n                aria-label={ t(props.label, value) }\n                aria-live=\"polite\"\n                role=\"status\"\n                { ...badgeAttrs }\n              >\n                {\n                  props.dot ? undefined\n                  : ctx.slots.badge ? ctx.slots.badge?.()\n                  : props.icon ? <VIcon icon={ props.icon } />\n                  : content\n                }\n              </span>\n            </MaybeTransition>\n          </div>\n        </props.tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VBadge = InstanceType<typeof VBadge>\n"],"mappings":"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"}
+{"version":3,"file":"VBadge.mjs","names":["VIcon","IconValue","makeComponentProps","makeLocationProps","useLocation","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","useTheme","makeTransitionProps","MaybeTransition","useBackgroundColor","useTextColor","useLocale","genericComponent","pick","propsFactory","useRender","toRef","makeVBadgeProps","bordered","Boolean","color","String","content","Number","dot","floating","icon","inline","label","type","default","max","modelValue","offsetX","offsetY","textColor","location","transition","VBadge","name","inheritAttrs","props","setup","ctx","backgroundColorClasses","backgroundColorStyles","roundedClasses","t","textColorClasses","textColorStyles","themeClasses","locationStyles","side","base","includes","value","isNaN","badgeAttrs","attrs","_createVNode","tag","_mergeProps","class","style","slots","_withDirectives","undefined","badge","_vShow"],"sources":["../../../src/components/VBadge/VBadge.tsx"],"sourcesContent":["// Styles\nimport './VBadge.sass'\n\n// Components\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeLocationProps, useLocation } from '@/composables/location'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, useTheme } from '@/composables/theme'\nimport { makeTransitionProps, MaybeTransition } from '@/composables/transition'\nimport { useBackgroundColor, useTextColor } from '@/composables/color'\nimport { useLocale } from '@/composables/locale'\n\n// Utilities\nimport { genericComponent, pick, propsFactory, useRender } from '@/util'\nimport { toRef } from 'vue'\n\nexport type VBadgeSlots = {\n  default: []\n  badge: []\n}\n\nexport const makeVBadgeProps = propsFactory({\n  bordered: Boolean,\n  color: String,\n  content: [Number, String],\n  dot: Boolean,\n  floating: Boolean,\n  icon: IconValue,\n  inline: Boolean,\n  label: {\n    type: String,\n    default: '$vuetify.badge',\n  },\n  max: [Number, String],\n  modelValue: {\n    type: Boolean,\n    default: true,\n  },\n  offsetX: [Number, String],\n  offsetY: [Number, String],\n  textColor: String,\n\n  ...makeComponentProps(),\n  ...makeLocationProps({ location: 'top end' } as const),\n  ...makeRoundedProps(),\n  ...makeTagProps(),\n  ...makeThemeProps(),\n  ...makeTransitionProps({ transition: 'scale-rotate-transition' }),\n}, 'v-badge')\n\nexport const VBadge = genericComponent<VBadgeSlots>()({\n  name: 'VBadge',\n\n  inheritAttrs: false,\n\n  props: makeVBadgeProps(),\n\n  setup (props, ctx) {\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n    const { roundedClasses } = useRounded(props)\n    const { t } = useLocale()\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'textColor'))\n    const { themeClasses } = useTheme()\n\n    const { locationStyles } = useLocation(props, true, side => {\n      const base = props.floating\n        ? (props.dot ? 2 : 4)\n        : (props.dot ? 8 : 12)\n\n      return base + (\n        ['top', 'bottom'].includes(side) ? +(props.offsetY ?? 0)\n        : ['left', 'right'].includes(side) ? +(props.offsetX ?? 0)\n        : 0\n      )\n    })\n\n    useRender(() => {\n      const value = Number(props.content)\n      const content = (!props.max || isNaN(value)) ? props.content\n        : value <= +props.max ? value\n        : `${props.max}+`\n\n      const [badgeAttrs, attrs] = pick(ctx.attrs as Record<string, any>, [\n        'aria-atomic',\n        'aria-label',\n        'aria-live',\n        'role',\n        'title',\n      ])\n\n      return (\n        <props.tag\n          class={[\n            'v-badge',\n            {\n              'v-badge--bordered': props.bordered,\n              'v-badge--dot': props.dot,\n              'v-badge--floating': props.floating,\n              'v-badge--inline': props.inline,\n            },\n            props.class,\n          ]}\n          { ...attrs }\n          style={ props.style }\n        >\n          <div class=\"v-badge__wrapper\">\n            { ctx.slots.default?.() }\n\n            <MaybeTransition transition={ props.transition }>\n              <span\n                v-show={ props.modelValue }\n                class={[\n                  'v-badge__badge',\n                  themeClasses.value,\n                  backgroundColorClasses.value,\n                  roundedClasses.value,\n                  textColorClasses.value,\n                ]}\n                style={[\n                  backgroundColorStyles.value,\n                  textColorStyles.value,\n                  props.inline ? {} : locationStyles.value,\n                ]}\n                aria-atomic=\"true\"\n                aria-label={ t(props.label, value) }\n                aria-live=\"polite\"\n                role=\"status\"\n                { ...badgeAttrs }\n              >\n                {\n                  props.dot ? undefined\n                  : ctx.slots.badge ? ctx.slots.badge?.()\n                  : props.icon ? <VIcon icon={ props.icon } />\n                  : content\n                }\n              </span>\n            </MaybeTransition>\n          </div>\n        </props.tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VBadge = InstanceType<typeof VBadge>\n"],"mappings":"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"}

package/lib/components/VBanner/VBanner.mjs

@@ -20,32 +20,33 @@ import { makeTagProps } from "../../composables/tag.mjs";
 import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
 import { provideDefaults } from "../../composables/defaults.mjs";
 import { useDisplay } from "../../composables/display.mjs"; // Utilities
-import { genericComponent, useRender } from "../../util/index.mjs";
+import { genericComponent, propsFactory, useRender } from "../../util/index.mjs";
 import { toRef } from 'vue';
 
 // Types
 
+export const makeVBannerProps = propsFactory({
+  avatar: String,
+  color: String,
+  icon: IconValue,
+  lines: String,
+  stacked: Boolean,
+  sticky: Boolean,
+  text: String,
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeDimensionProps(),
+  ...makeElevationProps(),
+  ...makeLocationProps(),
+  ...makePositionProps(),
+  ...makeRoundedProps(),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-banner');
 export const VBanner = genericComponent()({
   name: 'VBanner',
-  props: {
-    avatar: String,
-    color: String,
-    icon: IconValue,
-    lines: String,
-    stacked: Boolean,
-    sticky: Boolean,
-    text: String,
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeDimensionProps(),
-    ...makeElevationProps(),
-    ...makeLocationProps(),
-    ...makePositionProps(),
-    ...makeRoundedProps(),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVBannerProps(),
   setup(props, _ref) {
     let {
       slots

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

@@ -1 +1 @@
-{"version":3,"file":"VBanner.mjs","names":["VAvatar","VBannerActions","VBannerText","VDefaultsProvider","makeBorderProps","useBorder","IconValue","makeComponentProps","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","provideDefaults","useDisplay","genericComponent","useRender","toRef","VBanner","name","props","avatar","String","color","icon","lines","stacked","Boolean","sticky","text","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 { 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 { IconValue } from '@/composables/icons'\nimport { makeComponentProps } from '@/composables/component'\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'\n\n// Utilities\nimport { genericComponent, useRender } from '@/util'\nimport { toRef } from 'vue'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type VBannerSlots = {\n  default: []\n  prepend: []\n  text: []\n  actions: []\n}\n\nexport const VBanner = genericComponent<VBannerSlots>()({\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    ...makeComponentProps(),\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 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":["VAvatar","VBannerActions","VBannerText","VDefaultsProvider","makeBorderProps","useBorder","IconValue","makeComponentProps","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","provideDefaults","useDisplay","genericComponent","propsFactory","useRender","toRef","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 { 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 { IconValue } from '@/composables/icons'\nimport { makeComponentProps } from '@/composables/component'\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'\n\n// Utilities\nimport { genericComponent, propsFactory, useRender } from '@/util'\nimport { toRef } from 'vue'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type VBannerSlots = {\n  default: []\n  prepend: []\n  text: []\n  actions: []\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}, 'v-banner')\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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"}

package/lib/components/VBanner/VBannerActions.mjs

@@ -2,14 +2,15 @@ import { createVNode as _createVNode } from "vue";
 // Composables
 import { makeComponentProps } from "../../composables/component.mjs";
 import { provideDefaults } from "../../composables/defaults.mjs"; // Utility
-import { genericComponent, useRender } from "../../util/index.mjs";
+import { genericComponent, propsFactory, useRender } from "../../util/index.mjs";
+export const makeVBannerActionsProps = propsFactory({
+  color: String,
+  density: String,
+  ...makeComponentProps()
+}, 'v-banner-actions');
 export const VBannerActions = genericComponent()({
   name: 'VBannerActions',
-  props: {
-    color: String,
-    density: String,
-    ...makeComponentProps()
-  },
+  props: makeVBannerActionsProps(),
   setup(props, _ref) {
     let {
       slots

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

@@ -1 +1 @@
-{"version":3,"file":"VBannerActions.mjs","names":["makeComponentProps","provideDefaults","genericComponent","useRender","VBannerActions","name","props","color","String","density","setup","_ref","slots","VBtn","variant","_createVNode","class","style","default"],"sources":["../../../src/components/VBanner/VBannerActions.tsx"],"sourcesContent":["// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { provideDefaults } from '@/composables/defaults'\n\n// Utility\nimport { genericComponent, useRender } from '@/util'\n\nexport const VBannerActions = genericComponent()({\n  name: 'VBannerActions',\n\n  props: {\n    color: String,\n    density: String,\n\n    ...makeComponentProps(),\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\n        class={[\n          'v-banner-actions',\n          props.class,\n        ]}\n        style={ props.style }\n      >\n        { slots.default?.() }\n      </div>\n    ))\n\n    return {}\n  },\n})\n\nexport type VBannerActions = InstanceType<typeof VBannerActions>\n"],"mappings":";AAAA;AAAA,SACSA,kBAAkB;AAAA,SAClBC,eAAe,0CAExB;AAAA,SACSC,gBAAgB,EAAEC,SAAS;AAEpC,OAAO,MAAMC,cAAc,GAAGF,gBAAgB,EAAE,CAAC;EAC/CG,IAAI,EAAE,gBAAgB;EAEtBC,KAAK,EAAE;IACLC,KAAK,EAAEC,MAAM;IACbC,OAAO,EAAED,MAAM;IAEf,GAAGR,kBAAkB;EACvB,CAAC;EAEDU,KAAKA,CAAEJ,KAAK,EAAAK,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrBV,eAAe,CAAC;MACdY,IAAI,EAAE;QACJN,KAAK,EAAED,KAAK,CAACC,KAAK;QAClBE,OAAO,EAAEH,KAAK,CAACG,OAAO;QACtBK,OAAO,EAAE;MACX;IACF,CAAC,CAAC;IAEFX,SAAS,CAAC,MAAAY,YAAA;MAAA,SAEC,CACL,kBAAkB,EAClBT,KAAK,CAACU,KAAK,CACZ;MAAA,SACOV,KAAK,CAACW;IAAK,IAEjBL,KAAK,CAACM,OAAO,IAAI,EAEtB,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"version":3,"file":"VBannerActions.mjs","names":["makeComponentProps","provideDefaults","genericComponent","propsFactory","useRender","makeVBannerActionsProps","color","String","density","VBannerActions","name","props","setup","_ref","slots","VBtn","variant","_createVNode","class","style","default"],"sources":["../../../src/components/VBanner/VBannerActions.tsx"],"sourcesContent":["// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { provideDefaults } from '@/composables/defaults'\n\n// Utility\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport const makeVBannerActionsProps = propsFactory({\n  color: String,\n  density: String,\n\n  ...makeComponentProps(),\n}, 'v-banner-actions')\n\nexport const VBannerActions = genericComponent()({\n  name: 'VBannerActions',\n\n  props: makeVBannerActionsProps(),\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\n        class={[\n          'v-banner-actions',\n          props.class,\n        ]}\n        style={ props.style }\n      >\n        { slots.default?.() }\n      </div>\n    ))\n\n    return {}\n  },\n})\n\nexport type VBannerActions = InstanceType<typeof VBannerActions>\n"],"mappings":";AAAA;AAAA,SACSA,kBAAkB;AAAA,SAClBC,eAAe,0CAExB;AAAA,SACSC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS;AAElD,OAAO,MAAMC,uBAAuB,GAAGF,YAAY,CAAC;EAClDG,KAAK,EAAEC,MAAM;EACbC,OAAO,EAAED,MAAM;EAEf,GAAGP,kBAAkB;AACvB,CAAC,EAAE,kBAAkB,CAAC;AAEtB,OAAO,MAAMS,cAAc,GAAGP,gBAAgB,EAAE,CAAC;EAC/CQ,IAAI,EAAE,gBAAgB;EAEtBC,KAAK,EAAEN,uBAAuB,EAAE;EAEhCO,KAAKA,CAAED,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrBZ,eAAe,CAAC;MACdc,IAAI,EAAE;QACJT,KAAK,EAAEK,KAAK,CAACL,KAAK;QAClBE,OAAO,EAAEG,KAAK,CAACH,OAAO;QACtBQ,OAAO,EAAE;MACX;IACF,CAAC,CAAC;IAEFZ,SAAS,CAAC,MAAAa,YAAA;MAAA,SAEC,CACL,kBAAkB,EAClBN,KAAK,CAACO,KAAK,CACZ;MAAA,SACOP,KAAK,CAACQ;IAAK,IAEjBL,KAAK,CAACM,OAAO,IAAI,EAEtB,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

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

@@ -1,6 +1,8 @@
 import * as vue from 'vue';
 import { ComponentPropsOptions, ExtractPropTypes, JSXComponent, PropType } from 'vue';
 
+type Density = null | 'default' | 'comfortable' | 'compact';
+
 declare const block: readonly ["top", "bottom"];
 declare const inline: readonly ["start", "end", "left", "right"];
 type Tblock = typeof block[number];
@@ -11,8 +13,6 @@ interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions
     filterProps<T extends Partial<Props>, U extends Exclude<keyof Props, Exclude<keyof Props, keyof T>>>(props: T): [yes: Partial<Pick<T, U>>, no: Omit<T, U>];
 }
 
-type Density = null | 'default' | 'comfortable' | 'compact';
-
 type IconValue = string | (string | [path: string, opacity: number])[] | JSXComponent;
 declare const IconValue: PropType<IconValue>;
 

package/lib/components/VBottomNavigation/VBottomNavigation.mjs

@@ -16,43 +16,44 @@ import { provideDefaults } from "../../composables/defaults.mjs";
 import { useBackgroundColor } from "../../composables/color.mjs";
 import { useSsrBoot } from "../../composables/ssrBoot.mjs"; // Utilities
 import { computed, toRef } from 'vue';
-import { convertToUnit, genericComponent, useRender } from "../../util/index.mjs"; // Types
+import { convertToUnit, genericComponent, propsFactory, useRender } from "../../util/index.mjs"; // Types
 import { VBtnToggleSymbol } from "../VBtnToggle/VBtnToggle.mjs";
+export const makeVBottomNavigationProps = propsFactory({
+  bgColor: String,
+  color: String,
+  grow: Boolean,
+  mode: {
+    type: String,
+    validator: v => !v || ['horizontal', 'shift'].includes(v)
+  },
+  height: {
+    type: [Number, String],
+    default: 56
+  },
+  active: {
+    type: Boolean,
+    default: true
+  },
+  ...makeBorderProps(),
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeElevationProps(),
+  ...makeRoundedProps(),
+  ...makeLayoutItemProps({
+    name: 'bottom-navigation'
+  }),
+  ...makeTagProps({
+    tag: 'header'
+  }),
+  ...makeGroupProps({
+    modelValue: true,
+    selectedClass: 'v-btn--selected'
+  }),
+  ...makeThemeProps()
+}, 'v-bottom-navigation');
 export const VBottomNavigation = genericComponent()({
   name: 'VBottomNavigation',
-  props: {
-    bgColor: String,
-    color: String,
-    grow: Boolean,
-    mode: {
-      type: String,
-      validator: v => !v || ['horizontal', 'shift'].includes(v)
-    },
-    height: {
-      type: [Number, String],
-      default: 56
-    },
-    active: {
-      type: Boolean,
-      default: true
-    },
-    ...makeBorderProps(),
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeElevationProps(),
-    ...makeRoundedProps(),
-    ...makeLayoutItemProps({
-      name: 'bottom-navigation'
-    }),
-    ...makeTagProps({
-      tag: 'header'
-    }),
-    ...makeGroupProps({
-      modelValue: true,
-      selectedClass: 'v-btn--selected'
-    }),
-    ...makeThemeProps()
-  },
+  props: makeVBottomNavigationProps(),
   emits: {
     'update:modelValue': value => true
   },

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

@@ -1 +1 @@
-{"version":3,"file":"VBottomNavigation.mjs","names":["makeBorderProps","useBorder","makeComponentProps","makeDensityProps","useDensity","makeElevationProps","useElevation","makeGroupProps","useGroup","makeLayoutItemProps","useLayoutItem","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","useTheme","provideDefaults","useBackgroundColor","useSsrBoot","computed","toRef","convertToUnit","genericComponent","useRender","VBtnToggleSymbol","VBottomNavigation","name","props","bgColor","String","color","grow","Boolean","mode","type","validator","v","includes","height","Number","default","active","tag","modelValue","selectedClass","emits","value","setup","_ref","slots","themeClasses","borderClasses","backgroundColorClasses","backgroundColorStyles","densityClasses","elevationClasses","roundedClasses","ssrBootStyles","density","isActive","layoutItemStyles","id","order","parseInt","position","layoutSize","elementSize","absolute","VBtn","stacked","variant","scoped","_createVNode","class","transform","style"],"sources":["../../../src/components/VBottomNavigation/VBottomNavigation.tsx"],"sourcesContent":["// Styles\nimport './VBottomNavigation.sass'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\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 { useSsrBoot } from '@/composables/ssrBoot'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { convertToUnit, genericComponent, useRender } from '@/util'\n\n// Types\nimport { VBtnToggleSymbol } from '@/components/VBtnToggle/VBtnToggle'\n\nexport const VBottomNavigation = genericComponent()({\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    active: {\n      type: Boolean,\n      default: true,\n    },\n\n    ...makeBorderProps(),\n    ...makeComponentProps(),\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 { ssrBootStyles } = useSsrBoot()\n    const height = computed(() => (\n      Number(props.height) -\n      (props.density === 'comfortable' ? 8 : 0) -\n      (props.density === 'compact' ? 16 : 0)\n    ))\n    const isActive = toRef(props, 'active')\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            props.class,\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            ssrBootStyles.value,\n            props.style,\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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"}
+{"version":3,"file":"VBottomNavigation.mjs","names":["makeBorderProps","useBorder","makeComponentProps","makeDensityProps","useDensity","makeElevationProps","useElevation","makeGroupProps","useGroup","makeLayoutItemProps","useLayoutItem","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","useTheme","provideDefaults","useBackgroundColor","useSsrBoot","computed","toRef","convertToUnit","genericComponent","propsFactory","useRender","VBtnToggleSymbol","makeVBottomNavigationProps","bgColor","String","color","grow","Boolean","mode","type","validator","v","includes","height","Number","default","active","name","tag","modelValue","selectedClass","VBottomNavigation","props","emits","value","setup","_ref","slots","themeClasses","borderClasses","backgroundColorClasses","backgroundColorStyles","densityClasses","elevationClasses","roundedClasses","ssrBootStyles","density","isActive","layoutItemStyles","id","order","parseInt","position","layoutSize","elementSize","absolute","VBtn","stacked","variant","scoped","_createVNode","class","transform","style"],"sources":["../../../src/components/VBottomNavigation/VBottomNavigation.tsx"],"sourcesContent":["// Styles\nimport './VBottomNavigation.sass'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\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 { useSsrBoot } from '@/composables/ssrBoot'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { convertToUnit, genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport { VBtnToggleSymbol } from '@/components/VBtnToggle/VBtnToggle'\n\nexport const makeVBottomNavigationProps = propsFactory({\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  active: {\n    type: Boolean,\n    default: true,\n  },\n\n  ...makeBorderProps(),\n  ...makeComponentProps(),\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}, 'v-bottom-navigation')\n\nexport const VBottomNavigation = genericComponent()({\n  name: 'VBottomNavigation',\n\n  props: makeVBottomNavigationProps(),\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 { ssrBootStyles } = useSsrBoot()\n    const height = computed(() => (\n      Number(props.height) -\n      (props.density === 'comfortable' ? 8 : 0) -\n      (props.density === 'compact' ? 16 : 0)\n    ))\n    const isActive = toRef(props, 'active')\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            props.class,\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            ssrBootStyles.value,\n            props.style,\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/VBreadcrumbs/VBreadcrumbs.mjs

@@ -14,35 +14,36 @@ 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"; // Utilities
-import { genericComponent, useRender } from "../../util/index.mjs";
+import { genericComponent, propsFactory, useRender } from "../../util/index.mjs";
 import { computed, toRef } from 'vue';
 
 // Types
 
+export const makeVBreadcrumbsProps = propsFactory({
+  activeClass: String,
+  activeColor: String,
+  bgColor: String,
+  color: String,
+  disabled: Boolean,
+  divider: {
+    type: String,
+    default: '/'
+  },
+  icon: IconValue,
+  items: {
+    type: Array,
+    default: () => []
+  },
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeRoundedProps(),
+  ...makeTagProps({
+    tag: 'ul'
+  })
+}, 'v-breacrumbs');
 export const VBreadcrumbs = genericComponent()({
   name: 'VBreadcrumbs',
-  props: {
-    activeClass: String,
-    activeColor: String,
-    bgColor: String,
-    color: String,
-    disabled: Boolean,
-    divider: {
-      type: String,
-      default: '/'
-    },
-    icon: IconValue,
-    items: {
-      type: Array,
-      default: () => []
-    },
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeRoundedProps(),
-    ...makeTagProps({
-      tag: 'ul'
-    })
-  },
+  props: makeVBreadcrumbsProps(),
   setup(props, _ref) {
     let {
       slots

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

@@ -1 +1 @@
-{"version":3,"file":"VBreadcrumbs.mjs","names":["VBreadcrumbsDivider","VBreadcrumbsItem","VDefaultsProvider","VIcon","IconValue","makeComponentProps","makeDensityProps","useDensity","makeRoundedProps","useRounded","makeTagProps","provideDefaults","useBackgroundColor","genericComponent","useRender","computed","toRef","VBreadcrumbs","name","props","activeClass","String","activeColor","bgColor","color","disabled","Boolean","divider","type","default","icon","items","Array","tag","setup","_ref","slots","backgroundColorClasses","backgroundColorStyles","densityClasses","roundedClasses","map","item","title","raw","hasPrepend","prepend","_createVNode","value","class","style","start","_ref2","index","array","_Fragment","_mergeProps","length","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 { makeComponentProps } from '@/composables/component'\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 { computed, toRef } from 'vue'\n\n// Types\nimport type { LinkProps } from '@/composables/router'\nimport type { PropType } from 'vue'\nimport type { GenericProps } from '@/util'\n\nexport type BreadcrumbItem = string | (Partial<LinkProps> & {\n  title: string\n  disabled?: boolean\n})\n\nexport const VBreadcrumbs = genericComponent<new <T extends BreadcrumbItem>(props: {\n  items?: T[]\n}) => GenericProps<typeof props, {\n  prepend: []\n  title: [{ item: T, index: number }]\n  divider: [{ item: T, index: number }]\n  default: []\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    ...makeComponentProps(),\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    const { roundedClasses } = useRounded(props)\n\n    provideDefaults({\n      VBreadcrumbsDivider: {\n        divider: toRef(props, 'divider'),\n      },\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    const items = computed(() => props.items.map(item => {\n      return typeof item === 'string' ? { item: { title: item }, raw: item } : { item, raw: item }\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            props.class,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            props.style,\n          ]}\n        >\n          { hasPrepend && (\n            <div key=\"prepend\" class=\"v-breadcrumbs__prepend\">\n              { !slots.prepend ? (\n                <VIcon\n                  key=\"prepend-icon\"\n                  start\n                  icon={ props.icon }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"prepend-defaults\"\n                  disabled={ !props.icon }\n                  defaults={{\n                    VIcon: {\n                      icon: props.icon,\n                      start: true,\n                    },\n                  }}\n                  v-slots:default={ slots.prepend }\n                />\n              )}\n            </div>\n          )}\n\n          { items.value.map(({ item, raw }, index, array) => (\n            <>\n              <VBreadcrumbsItem\n                key={ item.title }\n                disabled={ index >= array.length - 1 }\n                { ...item }\n                v-slots={{\n                  default: slots.title ? () => slots.title?.({ item: raw, index }) : undefined,\n                }}\n              />\n\n              { index < array.length - 1 && (\n                <VBreadcrumbsDivider\n                  v-slots={{\n                    default: slots.divider ? () => slots.divider?.({ item: raw, index }) : undefined,\n                  }}\n                />\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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"}
+{"version":3,"file":"VBreadcrumbs.mjs","names":["VBreadcrumbsDivider","VBreadcrumbsItem","VDefaultsProvider","VIcon","IconValue","makeComponentProps","makeDensityProps","useDensity","makeRoundedProps","useRounded","makeTagProps","provideDefaults","useBackgroundColor","genericComponent","propsFactory","useRender","computed","toRef","makeVBreadcrumbsProps","activeClass","String","activeColor","bgColor","color","disabled","Boolean","divider","type","default","icon","items","Array","tag","VBreadcrumbs","name","props","setup","_ref","slots","backgroundColorClasses","backgroundColorStyles","densityClasses","roundedClasses","map","item","title","raw","hasPrepend","prepend","_createVNode","value","class","style","start","_ref2","index","array","_Fragment","_mergeProps","length","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 { makeComponentProps } from '@/composables/component'\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, propsFactory, useRender } from '@/util'\nimport { computed, toRef } from 'vue'\n\n// Types\nimport type { LinkProps } from '@/composables/router'\nimport type { PropType } from 'vue'\nimport type { GenericProps } from '@/util'\n\nexport type BreadcrumbItem = string | (Partial<LinkProps> & {\n  title: string\n  disabled?: boolean\n})\n\nexport const makeVBreadcrumbsProps = propsFactory({\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  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeRoundedProps(),\n  ...makeTagProps({ tag: 'ul' }),\n}, 'v-breacrumbs')\n\nexport const VBreadcrumbs = genericComponent<new <T extends BreadcrumbItem>(props: {\n  items?: T[]\n}) => GenericProps<typeof props, {\n  prepend: []\n  title: [{ item: T, index: number }]\n  divider: [{ item: T, index: number }]\n  default: []\n}>>()({\n  name: 'VBreadcrumbs',\n\n  props: makeVBreadcrumbsProps(),\n\n  setup (props, { slots }) {\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'bgColor'))\n    const { densityClasses } = useDensity(props)\n    const { roundedClasses } = useRounded(props)\n\n    provideDefaults({\n      VBreadcrumbsDivider: {\n        divider: toRef(props, 'divider'),\n      },\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    const items = computed(() => props.items.map(item => {\n      return typeof item === 'string' ? { item: { title: item }, raw: item } : { item, raw: item }\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            props.class,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            props.style,\n          ]}\n        >\n          { hasPrepend && (\n            <div key=\"prepend\" class=\"v-breadcrumbs__prepend\">\n              { !slots.prepend ? (\n                <VIcon\n                  key=\"prepend-icon\"\n                  start\n                  icon={ props.icon }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"prepend-defaults\"\n                  disabled={ !props.icon }\n                  defaults={{\n                    VIcon: {\n                      icon: props.icon,\n                      start: true,\n                    },\n                  }}\n                  v-slots:default={ slots.prepend }\n                />\n              )}\n            </div>\n          )}\n\n          { items.value.map(({ item, raw }, index, array) => (\n            <>\n              <VBreadcrumbsItem\n                key={ item.title }\n                disabled={ index >= array.length - 1 }\n                { ...item }\n                v-slots={{\n                  default: slots.title ? () => slots.title?.({ item: raw, index }) : undefined,\n                }}\n              />\n\n              { index < array.length - 1 && (\n                <VBreadcrumbsDivider\n                  v-slots={{\n                    default: slots.divider ? () => slots.divider?.({ item: raw, index }) : undefined,\n                  }}\n                />\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/VBreadcrumbsDivider.mjs

@@ -1,13 +1,14 @@
 import { createVNode as _createVNode } from "vue";
 // Composables
 import { makeComponentProps } from "../../composables/component.mjs"; // Utility
-import { genericComponent, useRender } from "../../util/index.mjs";
+import { genericComponent, propsFactory, useRender } from "../../util/index.mjs";
+export const makeVBreadcrumbsDividerProps = propsFactory({
+  divider: [Number, String],
+  ...makeComponentProps()
+}, 'v-breacrumbs-divider');
 export const VBreadcrumbsDivider = genericComponent()({
   name: 'VBreadcrumbsDivider',
-  props: {
-    divider: [Number, String],
-    ...makeComponentProps()
-  },
+  props: makeVBreadcrumbsDividerProps(),
   setup(props, _ref) {
     let {
       slots

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

@@ -1 +1 @@
-{"version":3,"file":"VBreadcrumbsDivider.mjs","names":["makeComponentProps","genericComponent","useRender","VBreadcrumbsDivider","name","props","divider","Number","String","setup","_ref","slots","_createVNode","class","style","default"],"sources":["../../../src/components/VBreadcrumbs/VBreadcrumbsDivider.tsx"],"sourcesContent":["// Composables\nimport { makeComponentProps } from '@/composables/component'\n\n// Utility\nimport { genericComponent, useRender } from '@/util'\n\nexport const VBreadcrumbsDivider = genericComponent()({\n  name: 'VBreadcrumbsDivider',\n\n  props: {\n    divider: [Number, String],\n\n    ...makeComponentProps(),\n  },\n\n  setup (props, { slots }) {\n    useRender(() => (\n      <li\n        class={[\n          'v-breadcrumbs-divider',\n          props.class,\n        ]}\n        style={ props.style }\n      >\n        { slots?.default?.() ?? props.divider }\n      </li>\n    ))\n\n    return {}\n  },\n})\n"],"mappings":";AAAA;AAAA,SACSA,kBAAkB,2CAE3B;AAAA,SACSC,gBAAgB,EAAEC,SAAS;AAEpC,OAAO,MAAMC,mBAAmB,GAAGF,gBAAgB,EAAE,CAAC;EACpDG,IAAI,EAAE,qBAAqB;EAE3BC,KAAK,EAAE;IACLC,OAAO,EAAE,CAACC,MAAM,EAAEC,MAAM,CAAC;IAEzB,GAAGR,kBAAkB;EACvB,CAAC;EAEDS,KAAKA,CAAEJ,KAAK,EAAAK,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrBR,SAAS,CAAC,MAAAU,YAAA;MAAA,SAEC,CACL,uBAAuB,EACvBP,KAAK,CAACQ,KAAK,CACZ;MAAA,SACOR,KAAK,CAACS;IAAK,IAEjBH,KAAK,EAAEI,OAAO,IAAI,IAAIV,KAAK,CAACC,OAAO,EAExC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"version":3,"file":"VBreadcrumbsDivider.mjs","names":["makeComponentProps","genericComponent","propsFactory","useRender","makeVBreadcrumbsDividerProps","divider","Number","String","VBreadcrumbsDivider","name","props","setup","_ref","slots","_createVNode","class","style","default"],"sources":["../../../src/components/VBreadcrumbs/VBreadcrumbsDivider.tsx"],"sourcesContent":["// Composables\nimport { makeComponentProps } from '@/composables/component'\n\n// Utility\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport const makeVBreadcrumbsDividerProps = propsFactory({\n  divider: [Number, String],\n\n  ...makeComponentProps(),\n}, 'v-breacrumbs-divider')\n\nexport const VBreadcrumbsDivider = genericComponent()({\n  name: 'VBreadcrumbsDivider',\n\n  props: makeVBreadcrumbsDividerProps(),\n\n  setup (props, { slots }) {\n    useRender(() => (\n      <li\n        class={[\n          'v-breadcrumbs-divider',\n          props.class,\n        ]}\n        style={ props.style }\n      >\n        { slots?.default?.() ?? props.divider }\n      </li>\n    ))\n\n    return {}\n  },\n})\n\nexport type VBreadcrumbsDivider = InstanceType<typeof VBreadcrumbsDivider>\n"],"mappings":";AAAA;AAAA,SACSA,kBAAkB,2CAE3B;AAAA,SACSC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS;AAElD,OAAO,MAAMC,4BAA4B,GAAGF,YAAY,CAAC;EACvDG,OAAO,EAAE,CAACC,MAAM,EAAEC,MAAM,CAAC;EAEzB,GAAGP,kBAAkB;AACvB,CAAC,EAAE,sBAAsB,CAAC;AAE1B,OAAO,MAAMQ,mBAAmB,GAAGP,gBAAgB,EAAE,CAAC;EACpDQ,IAAI,EAAE,qBAAqB;EAE3BC,KAAK,EAAEN,4BAA4B,EAAE;EAErCO,KAAKA,CAAED,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrBT,SAAS,CAAC,MAAAW,YAAA;MAAA,SAEC,CACL,uBAAuB,EACvBJ,KAAK,CAACK,KAAK,CACZ;MAAA,SACOL,KAAK,CAACM;IAAK,IAEjBH,KAAK,EAAEI,OAAO,IAAI,IAAIP,KAAK,CAACL,OAAO,EAExC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

package/lib/components/VBreadcrumbs/VBreadcrumbsItem.mjs

@@ -5,22 +5,23 @@ import { makeRouterProps, useLink } from "../../composables/router.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
 import { useTextColor } from "../../composables/color.mjs"; // Utilities
 import { computed } from 'vue';
-import { genericComponent, useRender } from "../../util/index.mjs";
+import { genericComponent, propsFactory, useRender } from "../../util/index.mjs";
+export const makeVBreadcrumbsItemProps = propsFactory({
+  active: Boolean,
+  activeClass: String,
+  activeColor: String,
+  color: String,
+  disabled: Boolean,
+  title: String,
+  ...makeComponentProps(),
+  ...makeRouterProps(),
+  ...makeTagProps({
+    tag: 'li'
+  })
+}, 'v-breadcrumbs-item');
 export const VBreadcrumbsItem = genericComponent()({
   name: 'VBreadcrumbsItem',
-  props: {
-    active: Boolean,
-    activeClass: String,
-    activeColor: String,
-    color: String,
-    disabled: Boolean,
-    title: String,
-    ...makeComponentProps(),
-    ...makeRouterProps(),
-    ...makeTagProps({
-      tag: 'li'
-    })
-  },
+  props: makeVBreadcrumbsItemProps(),
   setup(props, _ref) {
     let {
       slots,