vuetify 3.1.16 → 3.2.1

package/lib/components/VBreadcrumbs/VBreadcrumbs.mjs

@@ -8,6 +8,7 @@ import { VBreadcrumbsItem } from "./VBreadcrumbsItem.mjs";
 import { VDefaultsProvider } from "../VDefaultsProvider/index.mjs";
 import { VIcon } from "../VIcon/index.mjs"; // Composables
 import { IconValue } from "../../composables/icons.mjs";
+import { makeComponentProps } from "../../composables/component.mjs";
 import { makeDensityProps, useDensity } from "../../composables/density.mjs";
 import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
@@ -35,6 +36,7 @@ export const VBreadcrumbs = genericComponent()({
       type: Array,
       default: () => []
     },
+    ...makeComponentProps(),
     ...makeDensityProps(),
     ...makeRoundedProps(),
     ...makeTagProps({
@@ -80,8 +82,8 @@ export const VBreadcrumbs = genericComponent()({
     useRender(() => {
       const hasPrepend = !!(slots.prepend || props.icon);
       return _createVNode(props.tag, {
-        "class": ['v-breadcrumbs', backgroundColorClasses.value, densityClasses.value, roundedClasses.value],
-        "style": backgroundColorStyles.value
+        "class": ['v-breadcrumbs', backgroundColorClasses.value, densityClasses.value, roundedClasses.value, props.class],
+        "style": [backgroundColorStyles.value, props.style]
       }, {
         default: () => [hasPrepend && _createVNode("div", {
           "key": "prepend",

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

@@ -1 +1 @@
-{"version":3,"file":"VBreadcrumbs.mjs","names":["VBreadcrumbsDivider","VBreadcrumbsItem","VDefaultsProvider","VIcon","IconValue","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","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 { 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 { SlotsToProps } 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>() => {\n  $props: {\n    items?: T[]\n  } & SlotsToProps<{\n    prepend: []\n    title: [{ item: T, index: number }]\n    divider: [{ item: T, index: number }]\n    default: []\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    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          ]}\n          style={ backgroundColorStyles.value }\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","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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"}

package/lib/components/VBreadcrumbs/VBreadcrumbsDivider.mjs

@@ -1,17 +1,20 @@
 import { createVNode as _createVNode } from "vue";
-// Utility
+// Composables
+import { makeComponentProps } from "../../composables/component.mjs"; // Utility
 import { genericComponent, useRender } from "../../util/index.mjs";
 export const VBreadcrumbsDivider = genericComponent()({
   name: 'VBreadcrumbsDivider',
   props: {
-    divider: [Number, String]
+    divider: [Number, String],
+    ...makeComponentProps()
   },
   setup(props, _ref) {
     let {
       slots
     } = _ref;
     useRender(() => _createVNode("li", {
-      "class": "v-breadcrumbs-divider"
+      "class": ['v-breadcrumbs-divider', props.class],
+      "style": props.style
     }, [slots?.default?.() ?? props.divider]));
     return {};
   }

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

@@ -1 +1 @@
-{"version":3,"file":"VBreadcrumbsDivider.mjs","names":["genericComponent","useRender","VBreadcrumbsDivider","name","props","divider","Number","String","setup","_ref","slots","_createVNode","default"],"sources":["../../../src/components/VBreadcrumbs/VBreadcrumbsDivider.tsx"],"sourcesContent":["// Utility\nimport { genericComponent, useRender } from '@/util'\n\nexport const VBreadcrumbsDivider = genericComponent()({\n  name: 'VBreadcrumbsDivider',\n\n  props: {\n    divider: [Number, String],\n  },\n\n  setup (props, { slots }) {\n    useRender(() => (\n      <li class=\"v-breadcrumbs-divider\">\n        { slots?.default?.() ?? props.divider }\n      </li>\n    ))\n\n    return {}\n  },\n})\n"],"mappings":";AAAA;AAAA,SACSA,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;EAC1B,CAAC;EAEDC,KAAKA,CAAEJ,KAAK,EAAAK,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrBR,SAAS,CAAC,MAAAU,YAAA;MAAA,SACE;IAAuB,IAC7BD,KAAK,EAAEE,OAAO,IAAI,IAAIR,KAAK,CAACC,OAAO,EAExC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"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"}

package/lib/components/VBreadcrumbs/VBreadcrumbsItem.mjs

@@ -1,5 +1,6 @@
 import { createVNode as _createVNode } from "vue";
 // Composables
+import { makeComponentProps } from "../../composables/component.mjs";
 import { makeRouterProps, useLink } from "../../composables/router.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
 import { useTextColor } from "../../composables/color.mjs"; // Utilities
@@ -14,6 +15,7 @@ export const VBreadcrumbsItem = genericComponent()({
     color: String,
     disabled: Boolean,
     title: String,
+    ...makeComponentProps(),
     ...makeRouterProps(),
     ...makeTagProps({
       tag: 'li'
@@ -39,8 +41,8 @@ export const VBreadcrumbsItem = genericComponent()({
           'v-breadcrumbs-item--disabled': props.disabled,
           'v-breadcrumbs-item--link': link.isLink.value,
           [`${props.activeClass}`]: isActive.value && props.activeClass
-        }, textColorClasses.value],
-        "style": [textColorStyles.value],
+        }, textColorClasses.value, props.class],
+        "style": [textColorStyles.value, props.style],
         "href": link.href.value,
         "aria-current": isActive.value ? 'page' : undefined,
         "onClick": link.navigate

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

@@ -1 +1 @@
-{"version":3,"file":"VBreadcrumbsItem.mjs","names":["makeRouterProps","useLink","makeTagProps","useTextColor","computed","genericComponent","useRender","VBreadcrumbsItem","name","props","active","Boolean","activeClass","String","activeColor","color","disabled","title","tag","setup","_ref","slots","attrs","link","isActive","value","textColorClasses","textColorStyles","Tag","isLink","_createVNode","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 { genericComponent, useRender } from '@/util'\n\nexport const VBreadcrumbsItem = genericComponent()({\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.isActive?.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;AAAA,SACSA,eAAe,EAAEC,OAAO;AAAA,SACxBC,YAAY;AAAA,SACZC,YAAY,uCAErB;AACA,SAASC,QAAQ,QAAQ,KAAK;AAAA,SACrBC,gBAAgB,EAAEC,SAAS;AAEpC,OAAO,MAAMC,gBAAgB,GAAGF,gBAAgB,EAAE,CAAC;EACjDG,IAAI,EAAE,kBAAkB;EAExBC,KAAK,EAAE;IACLC,MAAM,EAAEC,OAAO;IACfC,WAAW,EAAEC,MAAM;IACnBC,WAAW,EAAED,MAAM;IACnBE,KAAK,EAAEF,MAAM;IACbG,QAAQ,EAAEL,OAAO;IACjBM,KAAK,EAAEJ,MAAM;IAEb,GAAGb,eAAe,EAAE;IACpB,GAAGE,YAAY,CAAC;MAAEgB,GAAG,EAAE;IAAK,CAAC;EAC/B,CAAC;EAEDC,KAAKA,CAAEV,KAAK,EAAAW,IAAA,EAAoB;IAAA,IAAlB;MAAEC,KAAK;MAAEC;IAAM,CAAC,GAAAF,IAAA;IAC5B,MAAMG,IAAI,GAAGtB,OAAO,CAACQ,KAAK,EAAEa,KAAK,CAAC;IAClC,MAAME,QAAQ,GAAGpB,QAAQ,CAAC,MAAMK,KAAK,CAACC,MAAM,IAAIa,IAAI,CAACC,QAAQ,EAAEC,KAAK,CAAC;IACrE,MAAMV,KAAK,GAAGX,QAAQ,CAAC,MAAMoB,QAAQ,CAACC,KAAK,GAAGhB,KAAK,CAACK,WAAW,GAAGL,KAAK,CAACM,KAAK,CAAC;IAE9E,MAAM;MAAEW,gBAAgB;MAAEC;IAAgB,CAAC,GAAGxB,YAAY,CAACY,KAAK,CAAC;IAEjET,SAAS,CAAC,MAAM;MACd,MAAMsB,GAAG,GAAGL,IAAI,CAACM,MAAM,CAACJ,KAAK,GAAG,GAAG,GAAGhB,KAAK,CAACS,GAAG;MAE/C,OAAAY,YAAA,CAAAF,GAAA;QAAA,SAEW,CACL,oBAAoB,EACpB;UACE,4BAA4B,EAAEJ,QAAQ,CAACC,KAAK;UAC5C,8BAA8B,EAAEhB,KAAK,CAACO,QAAQ;UAC9C,0BAA0B,EAAEO,IAAI,CAACM,MAAM,CAACJ,KAAK;UAC7C,CAAE,GAAEhB,KAAK,CAACG,WAAY,EAAC,GAAGY,QAAQ,CAACC,KAAK,IAAIhB,KAAK,CAACG;QACpD,CAAC,EACDc,gBAAgB,CAACD,KAAK,CACvB;QAAA,SACM,CACLE,eAAe,CAACF,KAAK,CACtB;QAAA,QACMF,IAAI,CAACQ,IAAI,CAACN,KAAK;QAAA,gBACPD,QAAQ,CAACC,KAAK,GAAG,MAAM,GAAGO,SAAS;QAAA,WACxCT,IAAI,CAACU;MAAQ;QAAAC,OAAA,EAAAA,CAAA,MAErBb,KAAK,CAACa,OAAO,IAAI,IAAIzB,KAAK,CAACQ,KAAK;MAAA;IAGxC,CAAC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"version":3,"file":"VBreadcrumbsItem.mjs","names":["makeComponentProps","makeRouterProps","useLink","makeTagProps","useTextColor","computed","genericComponent","useRender","VBreadcrumbsItem","name","props","active","Boolean","activeClass","String","activeColor","color","disabled","title","tag","setup","_ref","slots","attrs","link","isActive","value","textColorClasses","textColorStyles","Tag","isLink","_createVNode","class","style","href","undefined","navigate","default"],"sources":["../../../src/components/VBreadcrumbs/VBreadcrumbsItem.tsx"],"sourcesContent":["// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeRouterProps, useLink } from '@/composables/router'\nimport { makeTagProps } from '@/composables/tag'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\nexport const VBreadcrumbsItem = genericComponent()({\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    ...makeComponentProps(),\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.isActive?.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            props.class,\n          ]}\n          style={[\n            textColorStyles.value,\n            props.style,\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;AAAA,SACSA,kBAAkB;AAAA,SAClBC,eAAe,EAAEC,OAAO;AAAA,SACxBC,YAAY;AAAA,SACZC,YAAY,uCAErB;AACA,SAASC,QAAQ,QAAQ,KAAK;AAAA,SACrBC,gBAAgB,EAAEC,SAAS;AAEpC,OAAO,MAAMC,gBAAgB,GAAGF,gBAAgB,EAAE,CAAC;EACjDG,IAAI,EAAE,kBAAkB;EAExBC,KAAK,EAAE;IACLC,MAAM,EAAEC,OAAO;IACfC,WAAW,EAAEC,MAAM;IACnBC,WAAW,EAAED,MAAM;IACnBE,KAAK,EAAEF,MAAM;IACbG,QAAQ,EAAEL,OAAO;IACjBM,KAAK,EAAEJ,MAAM;IAEb,GAAGd,kBAAkB,EAAE;IACvB,GAAGC,eAAe,EAAE;IACpB,GAAGE,YAAY,CAAC;MAAEgB,GAAG,EAAE;IAAK,CAAC;EAC/B,CAAC;EAEDC,KAAKA,CAAEV,KAAK,EAAAW,IAAA,EAAoB;IAAA,IAAlB;MAAEC,KAAK;MAAEC;IAAM,CAAC,GAAAF,IAAA;IAC5B,MAAMG,IAAI,GAAGtB,OAAO,CAACQ,KAAK,EAAEa,KAAK,CAAC;IAClC,MAAME,QAAQ,GAAGpB,QAAQ,CAAC,MAAMK,KAAK,CAACC,MAAM,IAAIa,IAAI,CAACC,QAAQ,EAAEC,KAAK,CAAC;IACrE,MAAMV,KAAK,GAAGX,QAAQ,CAAC,MAAMoB,QAAQ,CAACC,KAAK,GAAGhB,KAAK,CAACK,WAAW,GAAGL,KAAK,CAACM,KAAK,CAAC;IAE9E,MAAM;MAAEW,gBAAgB;MAAEC;IAAgB,CAAC,GAAGxB,YAAY,CAACY,KAAK,CAAC;IAEjET,SAAS,CAAC,MAAM;MACd,MAAMsB,GAAG,GAAGL,IAAI,CAACM,MAAM,CAACJ,KAAK,GAAG,GAAG,GAAGhB,KAAK,CAACS,GAAG;MAE/C,OAAAY,YAAA,CAAAF,GAAA;QAAA,SAEW,CACL,oBAAoB,EACpB;UACE,4BAA4B,EAAEJ,QAAQ,CAACC,KAAK;UAC5C,8BAA8B,EAAEhB,KAAK,CAACO,QAAQ;UAC9C,0BAA0B,EAAEO,IAAI,CAACM,MAAM,CAACJ,KAAK;UAC7C,CAAE,GAAEhB,KAAK,CAACG,WAAY,EAAC,GAAGY,QAAQ,CAACC,KAAK,IAAIhB,KAAK,CAACG;QACpD,CAAC,EACDc,gBAAgB,CAACD,KAAK,EACtBhB,KAAK,CAACsB,KAAK,CACZ;QAAA,SACM,CACLJ,eAAe,CAACF,KAAK,EACrBhB,KAAK,CAACuB,KAAK,CACZ;QAAA,QACMT,IAAI,CAACU,IAAI,CAACR,KAAK;QAAA,gBACPD,QAAQ,CAACC,KAAK,GAAG,MAAM,GAAGS,SAAS;QAAA,WACxCX,IAAI,CAACY;MAAQ;QAAAC,OAAA,EAAAA,CAAA,MAErBf,KAAK,CAACe,OAAO,IAAI,IAAI3B,KAAK,CAACQ,KAAK;MAAA;IAGxC,CAAC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

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

@@ -1,17 +1,37 @@
 import * as vue from 'vue';
-import { ComponentPropsOptions, ExtractPropTypes, JSXComponent, PropType } from 'vue';
+import { ComponentPropsOptions, ExtractPropTypes, VNodeChild, JSXComponent, PropType } from 'vue';
 // @ts-ignore
 import * as vue_router from 'vue-router';
 // @ts-ignore
 import { RouteLocationRaw } from 'vue-router';
 
+type SlotsToProps<U extends Record<string, any[]> | Record<string, Slot>, T = U extends Record<string, any[]> ? MakeSlots<U> : U> = {
+    $children?: (VNodeChild | (T extends {
+        default: infer V;
+    } ? V : {}) | {
+        [K in keyof T]?: T[K];
+    });
+    'v-slots'?: {
+        [K in keyof T]?: T[K] | false;
+    };
+} & {
+    [K in keyof T as `v-slot:${K & string}`]?: T[K] | false;
+};
+type Slot<T extends any[] = any[]> = (...args: T) => VNodeChild;
+type MakeSlots<T extends Record<string, any[]> | Record<string, Slot>> = {
+    [K in keyof T]: T[K] extends any[] ? Slot<T[K]> : T[K];
+};
+type GenericProps<Props, Slots extends Record<string, any[]>> = {
+    $props: Props & SlotsToProps<Slots>;
+    $slots: MakeSlots<Slots>;
+};
 interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions>, Props = ExtractPropTypes<PropsOptions>> {
     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 | JSXComponent;
+type IconValue = string | (string | [path: string, opacity: number])[] | JSXComponent;
 declare const IconValue: PropType<IconValue>;
 
 interface LinkProps {
@@ -30,6 +50,7 @@ declare const VBreadcrumbs: {
         $: vue.ComponentInternalInstance;
         $data: {};
         $props: Partial<{
+            style: vue.StyleValue;
             disabled: boolean;
             tag: string;
             rounded: string | number | boolean;
@@ -52,6 +73,11 @@ declare const VBreadcrumbs: {
                 default: string;
                 validator: (v: any) => boolean;
             };
+            class: PropType<any>;
+            style: {
+                type: PropType<vue.StyleValue>;
+                default: null;
+            };
             activeClass: StringConstructor;
             activeColor: StringConstructor;
             bgColor: StringConstructor;
@@ -66,7 +92,7 @@ declare const VBreadcrumbs: {
                 type: PropType<BreadcrumbItem[]>;
                 default: () => never[];
             };
-        }, "$children" | "v-slot:default" | "$slots" | "v-slots" | "items" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "disabled" | "tag" | "rounded" | "density" | "divider">;
+        }, "$children" | "v-slot:default" | "items" | "v-slots" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "style" | "disabled" | "tag" | "rounded" | "density" | "divider">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -97,6 +123,11 @@ declare const VBreadcrumbs: {
                 default: string;
                 validator: (v: any) => boolean;
             };
+            class: PropType<any>;
+            style: {
+                type: PropType<vue.StyleValue>;
+                default: null;
+            };
             activeClass: StringConstructor;
             activeColor: StringConstructor;
             bgColor: StringConstructor;
@@ -111,7 +142,8 @@ declare const VBreadcrumbs: {
                 type: PropType<BreadcrumbItem[]>;
                 default: () => never[];
             };
-        }, "$children" | "v-slot:default" | "$slots" | "v-slots" | "items" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">>>, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<Record<string, any>, "$children" | "v-slot:default" | "$slots" | "v-slots" | "items" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">, string, {
+        }, "$children" | "v-slot:default" | "items" | "v-slots" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">>>, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<Record<string, any>, "$children" | "v-slot:default" | "items" | "v-slots" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">, string, {
+            style: vue.StyleValue;
             disabled: boolean;
             tag: string;
             rounded: string | number | boolean;
@@ -154,6 +186,11 @@ declare const VBreadcrumbs: {
             default: string;
             validator: (v: any) => boolean;
         };
+        class: PropType<any>;
+        style: {
+            type: PropType<vue.StyleValue>;
+            default: null;
+        };
         activeClass: StringConstructor;
         activeColor: StringConstructor;
         bgColor: StringConstructor;
@@ -168,7 +205,7 @@ declare const VBreadcrumbs: {
             type: PropType<BreadcrumbItem[]>;
             default: () => never[];
         };
-    }, "$children" | "v-slot:default" | "$slots" | "v-slots" | "items" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">>> & vue.ShallowUnwrapRef<{}> & {} & vue.ComponentCustomProperties & {};
+    }, "$children" | "v-slot:default" | "items" | "v-slots" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">>> & vue.ShallowUnwrapRef<{}> & {} & vue.ComponentCustomProperties & {};
     __isFragment?: undefined;
     __isTeleport?: undefined;
     __isSuspense?: undefined;
@@ -189,6 +226,11 @@ declare const VBreadcrumbs: {
         default: string;
         validator: (v: any) => boolean;
     };
+    class: PropType<any>;
+    style: {
+        type: PropType<vue.StyleValue>;
+        default: null;
+    };
     activeClass: StringConstructor;
     activeColor: StringConstructor;
     bgColor: StringConstructor;
@@ -203,65 +245,29 @@ declare const VBreadcrumbs: {
         type: PropType<BreadcrumbItem[]>;
         default: () => never[];
     };
-}, "$children" | "v-slot:default" | "$slots" | "v-slots" | "items" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">>>, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<Record<string, any>, "$children" | "v-slot:default" | "$slots" | "v-slots" | "items" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">, string, {
+}, "$children" | "v-slot:default" | "items" | "v-slots" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">>>, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<Record<string, any>, "$children" | "v-slot:default" | "items" | "v-slots" | "v-slot:title" | "v-slot:prepend" | "v-slot:divider">, string, {
+    style: vue.StyleValue;
     disabled: boolean;
     tag: string;
     rounded: string | number | boolean;
     density: Density;
     divider: string;
-}, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T_1 extends BreadcrumbItem>() => {
-    $props: {
-        items?: T_1[] | undefined;
-    } & {
-        $children?: {} | vue.VNodeChild | {
-            prepend?: (() => vue.VNodeChild) | undefined;
-            title?: ((args_0: {
-                item: T_1;
-                index: number;
-            }) => vue.VNodeChild) | undefined;
-            divider?: ((args_0: {
-                item: T_1;
-                index: number;
-            }) => vue.VNodeChild) | undefined;
-            default?: (() => vue.VNodeChild) | undefined;
-        };
-        $slots?: {
-            prepend?: (() => vue.VNodeChild) | undefined;
-            title?: ((args_0: {
-                item: T_1;
-                index: number;
-            }) => vue.VNodeChild) | undefined;
-            divider?: ((args_0: {
-                item: T_1;
-                index: number;
-            }) => vue.VNodeChild) | undefined;
-            default?: (() => vue.VNodeChild) | undefined;
-        } | undefined;
-        'v-slots'?: {
-            prepend?: false | (() => vue.VNodeChild) | undefined;
-            title?: false | ((args_0: {
-                item: T_1;
-                index: number;
-            }) => vue.VNodeChild) | undefined;
-            divider?: false | ((args_0: {
-                item: T_1;
-                index: number;
-            }) => vue.VNodeChild) | undefined;
-            default?: false | (() => vue.VNodeChild) | undefined;
-        } | undefined;
-    } & {
-        "v-slot:prepend"?: false | (() => vue.VNodeChild) | undefined;
-        "v-slot:title"?: false | ((args_0: {
-            item: T_1;
-            index: number;
-        }) => vue.VNodeChild) | undefined;
-        "v-slot:divider"?: false | ((args_0: {
-            item: T_1;
-            index: number;
-        }) => vue.VNodeChild) | undefined;
-        "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-    };
-}) & FilterPropsOptions<{
+}, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T_1 extends BreadcrumbItem>(props: {
+    items?: T_1[] | undefined;
+}) => GenericProps<{
+    items?: T_1[] | undefined;
+}, {
+    prepend: [];
+    title: [{
+        item: T_1;
+        index: number;
+    }];
+    divider: [{
+        item: T_1;
+        index: number;
+    }];
+    default: [];
+}>) & FilterPropsOptions<{
     tag: Omit<{
         type: StringConstructor;
         default: string;
@@ -278,6 +284,11 @@ declare const VBreadcrumbs: {
         default: string;
         validator: (v: any) => boolean;
     };
+    class: PropType<any>;
+    style: {
+        type: PropType<vue.StyleValue>;
+        default: null;
+    };
     activeClass: StringConstructor;
     activeColor: StringConstructor;
     bgColor: StringConstructor;
@@ -309,6 +320,11 @@ declare const VBreadcrumbs: {
         default: string;
         validator: (v: any) => boolean;
     };
+    class: PropType<any>;
+    style: {
+        type: PropType<vue.StyleValue>;
+        default: null;
+    };
     activeClass: StringConstructor;
     activeColor: StringConstructor;
     bgColor: StringConstructor;
@@ -334,17 +350,20 @@ declare const VBreadcrumbsItem: {
             replace: boolean;
             exact: boolean;
             active: boolean;
+            style: vue.StyleValue;
             disabled: boolean;
             tag: string;
         }> & Omit<{
             replace: boolean;
             exact: boolean;
             active: boolean;
+            style: vue.StyleValue;
             disabled: boolean;
             tag: string;
         } & {
             color?: string | undefined;
             title?: string | undefined;
+            class?: any;
             href?: string | undefined;
             to?: vue_router.RouteLocationRaw | undefined;
             activeClass?: string | undefined;
@@ -353,15 +372,12 @@ declare const VBreadcrumbsItem: {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
         } & {
             "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "replace" | "exact" | "active" | "disabled" | "tag">;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "replace" | "exact" | "active" | "style" | "disabled" | "tag">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -379,11 +395,13 @@ declare const VBreadcrumbsItem: {
             replace: boolean;
             exact: boolean;
             active: boolean;
+            style: vue.StyleValue;
             disabled: boolean;
             tag: string;
         } & {
             color?: string | undefined;
             title?: string | undefined;
+            class?: any;
             href?: string | undefined;
             to?: vue_router.RouteLocationRaw | undefined;
             activeClass?: string | undefined;
@@ -392,9 +410,6 @@ declare const VBreadcrumbsItem: {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
@@ -404,6 +419,7 @@ declare const VBreadcrumbsItem: {
             replace: boolean;
             exact: boolean;
             active: boolean;
+            style: vue.StyleValue;
             disabled: boolean;
             tag: string;
         }, {}, string> & {
@@ -430,11 +446,13 @@ declare const VBreadcrumbsItem: {
         replace: boolean;
         exact: boolean;
         active: boolean;
+        style: vue.StyleValue;
         disabled: boolean;
         tag: string;
     } & {
         color?: string | undefined;
         title?: string | undefined;
+        class?: any;
         href?: string | undefined;
         to?: vue_router.RouteLocationRaw | undefined;
         activeClass?: string | undefined;
@@ -443,9 +461,6 @@ declare const VBreadcrumbsItem: {
         $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
             default?: (() => vue.VNodeChild) | undefined;
         };
-        $slots?: {
-            default?: (() => vue.VNodeChild) | undefined;
-        } | undefined;
         'v-slots'?: {
             default?: false | (() => vue.VNodeChild) | undefined;
         } | undefined;
@@ -459,11 +474,13 @@ declare const VBreadcrumbsItem: {
     replace: boolean;
     exact: boolean;
     active: boolean;
+    style: vue.StyleValue;
     disabled: boolean;
     tag: string;
 } & {
     color?: string | undefined;
     title?: string | undefined;
+    class?: any;
     href?: string | undefined;
     to?: vue_router.RouteLocationRaw | undefined;
     activeClass?: string | undefined;
@@ -472,9 +489,6 @@ declare const VBreadcrumbsItem: {
     $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
         default?: (() => vue.VNodeChild) | undefined;
     };
-    $slots?: {
-        default?: (() => vue.VNodeChild) | undefined;
-    } | undefined;
     'v-slots'?: {
         default?: false | (() => vue.VNodeChild) | undefined;
     } | undefined;
@@ -484,6 +498,7 @@ declare const VBreadcrumbsItem: {
     replace: boolean;
     exact: boolean;
     active: boolean;
+    style: vue.StyleValue;
     disabled: boolean;
     tag: string;
 }, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
@@ -498,6 +513,11 @@ declare const VBreadcrumbsItem: {
     replace: BooleanConstructor;
     to: vue.PropType<vue_router.RouteLocationRaw>;
     exact: BooleanConstructor;
+    class: vue.PropType<any>;
+    style: {
+        type: vue.PropType<vue.StyleValue>;
+        default: null;
+    };
     active: BooleanConstructor;
     activeClass: StringConstructor;
     activeColor: StringConstructor;
@@ -516,6 +536,11 @@ declare const VBreadcrumbsItem: {
     replace: BooleanConstructor;
     to: vue.PropType<vue_router.RouteLocationRaw>;
     exact: BooleanConstructor;
+    class: vue.PropType<any>;
+    style: {
+        type: vue.PropType<vue.StyleValue>;
+        default: null;
+    };
     active: BooleanConstructor;
     activeClass: StringConstructor;
     activeColor: StringConstructor;
@@ -529,21 +554,23 @@ declare const VBreadcrumbsDivider: {
     new (...args: any[]): {
         $: vue.ComponentInternalInstance;
         $data: {};
-        $props: Partial<{}> & Omit<{} & {
+        $props: Partial<{
+            style: vue.StyleValue;
+        }> & Omit<{
+            style: vue.StyleValue;
+        } & {
+            class?: any;
             divider?: string | number | undefined;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
         } & {
             "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, never>;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "style">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -557,21 +584,23 @@ declare const VBreadcrumbsDivider: {
         $parent: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
         $emit: (event: string, ...args: any[]) => void;
         $el: any;
-        $options: vue.ComponentOptionsBase<{} & {
+        $options: vue.ComponentOptionsBase<{
+            style: vue.StyleValue;
+        } & {
+            class?: any;
             divider?: string | number | undefined;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
         } & {
             "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-        }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {}, {}, string> & {
+        }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
+            style: vue.StyleValue;
+        }, {}, string> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
             created?: ((() => void) | (() => void)[]) | undefined;
             beforeMount?: ((() => void) | (() => void)[]) | undefined;
@@ -591,15 +620,15 @@ declare const VBreadcrumbsDivider: {
         $forceUpdate: () => void;
         $nextTick: typeof vue.nextTick;
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: vue.WatchOptions<boolean> | undefined): vue.WatchStopHandle;
-    } & {} & {
+    } & {
+        style: vue.StyleValue;
+    } & {
+        class?: any;
         divider?: string | number | undefined;
     } & {
         $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
             default?: (() => vue.VNodeChild) | undefined;
         };
-        $slots?: {
-            default?: (() => vue.VNodeChild) | undefined;
-        } | undefined;
         'v-slots'?: {
             default?: false | (() => vue.VNodeChild) | undefined;
         } | undefined;
@@ -609,23 +638,35 @@ declare const VBreadcrumbsDivider: {
     __isFragment?: undefined;
     __isTeleport?: undefined;
     __isSuspense?: undefined;
-} & vue.ComponentOptionsBase<{} & {
+} & vue.ComponentOptionsBase<{
+    style: vue.StyleValue;
+} & {
+    class?: any;
     divider?: string | number | undefined;
 } & {
     $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
         default?: (() => vue.VNodeChild) | undefined;
     };
-    $slots?: {
-        default?: (() => vue.VNodeChild) | undefined;
-    } | undefined;
     'v-slots'?: {
         default?: false | (() => vue.VNodeChild) | undefined;
     } | undefined;
 } & {
     "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {}, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
+    style: vue.StyleValue;
+}, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+    class: vue.PropType<any>;
+    style: {
+        type: vue.PropType<vue.StyleValue>;
+        default: null;
+    };
     divider: (StringConstructor | NumberConstructor)[];
 }, vue.ExtractPropTypes<{
+    class: vue.PropType<any>;
+    style: {
+        type: vue.PropType<vue.StyleValue>;
+        default: null;
+    };
     divider: (StringConstructor | NumberConstructor)[];
 }>>;