@treeui/vue 0.16.0 → 0.18.0

package/dist/components/TSidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"TSidebar.js","names":[],"sources":["../../src/components/TSidebar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, provide, toRef, useAttrs } from 'vue';\nimport { useControllableOpen } from '../composables/useControllableOpen';\nimport type { TSize } from '../types/contracts';\nimport { treeSidebarInjectionKey } from './sidebar';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst _treeSidebarSides = ['left', 'right'] as const;\n\nexport type TSidebarSide = (typeof _treeSidebarSides)[number];\n\nconst ChevronLeftIcon = getTreeIcon('chevron-left');\nconst ChevronRightIcon = getTreeIcon('chevron-right');\n\nconst props = withDefaults(\n  defineProps<{\n    as?: string;\n    collapsed?: boolean;\n    defaultCollapsed?: boolean;\n    collapsible?: boolean;\n    size?: TSize;\n    side?: TSidebarSide;\n    sticky?: boolean;\n    bordered?: boolean;\n    width?: string;\n    collapsedWidth?: string;\n    collapseLabel?: string;\n    expandLabel?: string;\n  }>(),\n  {\n    as: 'aside',\n    collapsed: undefined,\n    defaultCollapsed: false,\n    collapsible: true,\n    size: 'md',\n    side: 'left',\n    sticky: false,\n    bordered: true,\n    width: '17.5rem',\n    collapsedWidth: '4.75rem',\n    collapseLabel: 'Collapse sidebar',\n    expandLabel: 'Expand sidebar',\n  },\n);\n\nconst emit = defineEmits<{\n  'update:collapsed': [value: boolean];\n  'collapse-change': [value: boolean];\n}>();\n\ndefineSlots<{\n  header?: (props: { collapsed: boolean }) => unknown;\n  default?: (props: { collapsed: boolean }) => unknown;\n  footer?: (props: { collapsed: boolean }) => unknown;\n  toggle?: (props: { collapsed: boolean }) => unknown;\n}>();\n\nconst attrs = useAttrs();\n\nconst { value: isCollapsed, setValue } = useControllableOpen(\n  toRef(props, 'collapsed'),\n  props.defaultCollapsed,\n  (value) => {\n    emit('update:collapsed', value);\n    emit('collapse-change', value);\n  },\n);\n\nconst rootClasses = computed(() => [\n  't-sidebar',\n  `t-sidebar--${props.size}`,\n  `t-sidebar--${props.side}`,\n  {\n    'is-collapsed': isCollapsed.value,\n    'is-sticky': props.sticky,\n    'is-bordered': props.bordered,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => [\n  {\n    '--tree-sidebar-width': props.width,\n    '--tree-sidebar-collapsed-width': props.collapsedWidth,\n  },\n  attrs.style,\n]);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst toggleCollapsed = () => {\n  if (!props.collapsible) {\n    return;\n  }\n\n  setValue(!isCollapsed.value);\n};\n\nconst ToggleIcon = computed(() => {\n  if (props.side === 'right') {\n    return isCollapsed.value ? ChevronLeftIcon : ChevronRightIcon;\n  }\n\n  return isCollapsed.value ? ChevronRightIcon : ChevronLeftIcon;\n});\n\nconst toggleLabel = computed(() =>\n  isCollapsed.value ? props.expandLabel : props.collapseLabel,\n);\n\nprovide(treeSidebarInjectionKey, {\n  collapsed: computed(() => isCollapsed.value),\n});\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n    :data-state=\"isCollapsed ? 'collapsed' : 'expanded'\"\n  >\n    <div\n      v-if=\"$slots.header\"\n      class=\"t-sidebar__header\"\n    >\n      <slot\n        name=\"header\"\n        :collapsed=\"isCollapsed\"\n      />\n    </div>\n\n    <div class=\"t-sidebar__body\">\n      <slot :collapsed=\"isCollapsed\" />\n    </div>\n\n    <div\n      v-if=\"$slots.footer || collapsible\"\n      class=\"t-sidebar__footer\"\n    >\n      <slot\n        v-if=\"$slots.footer\"\n        name=\"footer\"\n        :collapsed=\"isCollapsed\"\n      />\n\n      <button\n        v-if=\"collapsible\"\n        type=\"button\"\n        class=\"t-sidebar__toggle\"\n        :aria-label=\"toggleLabel\"\n        :aria-expanded=\"!isCollapsed\"\n        @click=\"toggleCollapsed\"\n      >\n        <slot\n          name=\"toggle\"\n          :collapsed=\"isCollapsed\"\n        >\n          <component\n            :is=\"ToggleIcon\"\n            :size=\"16\"\n          />\n          <span v-if=\"!isCollapsed\">{{ toggleLabel }}</span>\n        </slot>\n      </button>\n    </div>\n  </component>\n</template>\n"],"mappings":""}
+{"version":3,"file":"TSidebar.js","names":[],"sources":["../../src/components/TSidebar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, provide, toRef, useAttrs } from 'vue';\nimport { useControllableOpen } from '../composables/useControllableOpen';\nimport type { TSize } from '../types/contracts';\nimport { treeSidebarInjectionKey } from './sidebar';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst _treeSidebarSides = ['left', 'right'] as const;\n\nexport type TSidebarSide = (typeof _treeSidebarSides)[number];\n\nconst ChevronLeftIcon = computed(() => getTreeIcon('chevron-left'));\nconst ChevronRightIcon = computed(() => getTreeIcon('chevron-right'));\n\nconst props = withDefaults(\n  defineProps<{\n    as?: string;\n    collapsed?: boolean;\n    defaultCollapsed?: boolean;\n    collapsible?: boolean;\n    size?: TSize;\n    side?: TSidebarSide;\n    sticky?: boolean;\n    bordered?: boolean;\n    width?: string;\n    collapsedWidth?: string;\n    collapseLabel?: string;\n    expandLabel?: string;\n  }>(),\n  {\n    as: 'aside',\n    collapsed: undefined,\n    defaultCollapsed: false,\n    collapsible: true,\n    size: 'md',\n    side: 'left',\n    sticky: false,\n    bordered: true,\n    width: '17.5rem',\n    collapsedWidth: '4.75rem',\n    collapseLabel: 'Collapse sidebar',\n    expandLabel: 'Expand sidebar',\n  },\n);\n\nconst emit = defineEmits<{\n  'update:collapsed': [value: boolean];\n  'collapse-change': [value: boolean];\n}>();\n\ndefineSlots<{\n  header?: (props: { collapsed: boolean }) => unknown;\n  default?: (props: { collapsed: boolean }) => unknown;\n  footer?: (props: { collapsed: boolean }) => unknown;\n  toggle?: (props: { collapsed: boolean }) => unknown;\n}>();\n\nconst attrs = useAttrs();\n\nconst { value: isCollapsed, setValue } = useControllableOpen(\n  toRef(props, 'collapsed'),\n  props.defaultCollapsed,\n  (value) => {\n    emit('update:collapsed', value);\n    emit('collapse-change', value);\n  },\n);\n\nconst rootClasses = computed(() => [\n  't-sidebar',\n  `t-sidebar--${props.size}`,\n  `t-sidebar--${props.side}`,\n  {\n    'is-collapsed': isCollapsed.value,\n    'is-sticky': props.sticky,\n    'is-bordered': props.bordered,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => [\n  {\n    '--tree-sidebar-width': props.width,\n    '--tree-sidebar-collapsed-width': props.collapsedWidth,\n  },\n  attrs.style,\n]);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst toggleCollapsed = () => {\n  if (!props.collapsible) {\n    return;\n  }\n\n  setValue(!isCollapsed.value);\n};\n\nconst ToggleIcon = computed(() => {\n  if (props.side === 'right') {\n    return isCollapsed.value ? ChevronLeftIcon : ChevronRightIcon;\n  }\n\n  return isCollapsed.value ? ChevronRightIcon : ChevronLeftIcon;\n});\n\nconst toggleLabel = computed(() =>\n  isCollapsed.value ? props.expandLabel : props.collapseLabel,\n);\n\nprovide(treeSidebarInjectionKey, {\n  collapsed: computed(() => isCollapsed.value),\n});\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n    :data-state=\"isCollapsed ? 'collapsed' : 'expanded'\"\n  >\n    <div\n      v-if=\"$slots.header\"\n      class=\"t-sidebar__header\"\n    >\n      <slot\n        name=\"header\"\n        :collapsed=\"isCollapsed\"\n      />\n    </div>\n\n    <div class=\"t-sidebar__body\">\n      <slot :collapsed=\"isCollapsed\" />\n    </div>\n\n    <div\n      v-if=\"$slots.footer || collapsible\"\n      class=\"t-sidebar__footer\"\n    >\n      <slot\n        v-if=\"$slots.footer\"\n        name=\"footer\"\n        :collapsed=\"isCollapsed\"\n      />\n\n      <button\n        v-if=\"collapsible\"\n        type=\"button\"\n        class=\"t-sidebar__toggle\"\n        :aria-label=\"toggleLabel\"\n        :aria-expanded=\"!isCollapsed\"\n        @click=\"toggleCollapsed\"\n      >\n        <slot\n          name=\"toggle\"\n          :collapsed=\"isCollapsed\"\n        >\n          <component\n            :is=\"ToggleIcon\"\n            :size=\"16\"\n          />\n          <span v-if=\"!isCollapsed\">{{ toggleLabel }}</span>\n        </slot>\n      </button>\n    </div>\n  </component>\n</template>\n"],"mappings":""}

package/dist/components/TSidebar.vue_vue_type_script_setup_true_lang.cjs

@@ -1,2 +1,2 @@
-const e=require("../composables/useControllableOpen.cjs"),t=require("./sidebar.cjs");let n=require("vue"),r=require("@treeui/icons");var i={key:0,class:`t-sidebar__header`},a={class:`t-sidebar__body`},o={key:1,class:`t-sidebar__footer`},s=[`aria-label`,`aria-expanded`],c={key:0},l=(0,n.defineComponent)({inheritAttrs:!1,__name:`TSidebar`,props:{as:{default:`aside`},collapsed:{type:Boolean,default:void 0},defaultCollapsed:{type:Boolean,default:!1},collapsible:{type:Boolean,default:!0},size:{default:`md`},side:{default:`left`},sticky:{type:Boolean,default:!1},bordered:{type:Boolean,default:!0},width:{default:`17.5rem`},collapsedWidth:{default:`4.75rem`},collapseLabel:{default:`Collapse sidebar`},expandLabel:{default:`Expand sidebar`}},emits:[`update:collapsed`,`collapse-change`],setup(l,{emit:u}){let d=(0,r.getTreeIcon)(`chevron-left`),f=(0,r.getTreeIcon)(`chevron-right`),p=l,m=u,h=(0,n.useAttrs)(),{value:g,setValue:_}=e.useControllableOpen((0,n.toRef)(p,`collapsed`),p.defaultCollapsed,e=>{m(`update:collapsed`,e),m(`collapse-change`,e)}),v=(0,n.computed)(()=>[`t-sidebar`,`t-sidebar--${p.size}`,`t-sidebar--${p.side}`,{"is-collapsed":g.value,"is-sticky":p.sticky,"is-bordered":p.bordered},h.class]),y=(0,n.computed)(()=>[{"--tree-sidebar-width":p.width,"--tree-sidebar-collapsed-width":p.collapsedWidth},h.style]),b=(0,n.computed)(()=>{let{class:e,style:t,...n}=h;return n}),x=()=>{p.collapsible&&_(!g.value)},S=(0,n.computed)(()=>p.side===`right`?g.value?d:f:g.value?f:d),C=(0,n.computed)(()=>g.value?p.expandLabel:p.collapseLabel);return(0,n.provide)(t.treeSidebarInjectionKey,{collapsed:(0,n.computed)(()=>g.value)}),(e,t)=>((0,n.openBlock)(),(0,n.createBlock)((0,n.resolveDynamicComponent)(l.as),(0,n.mergeProps)(b.value,{class:v.value,style:y.value,"data-state":(0,n.unref)(g)?`collapsed`:`expanded`}),{default:(0,n.withCtx)(()=>[e.$slots.header?((0,n.openBlock)(),(0,n.createElementBlock)(`div`,i,[(0,n.renderSlot)(e.$slots,`header`,{collapsed:(0,n.unref)(g)})])):(0,n.createCommentVNode)(``,!0),(0,n.createElementVNode)(`div`,a,[(0,n.renderSlot)(e.$slots,`default`,{collapsed:(0,n.unref)(g)})]),e.$slots.footer||l.collapsible?((0,n.openBlock)(),(0,n.createElementBlock)(`div`,o,[e.$slots.footer?(0,n.renderSlot)(e.$slots,`footer`,{collapsed:(0,n.unref)(g)},void 0,void 0,0):(0,n.createCommentVNode)(``,!0),l.collapsible?((0,n.openBlock)(),(0,n.createElementBlock)(`button`,{key:1,type:`button`,class:`t-sidebar__toggle`,"aria-label":C.value,"aria-expanded":!(0,n.unref)(g),onClick:x},[(0,n.renderSlot)(e.$slots,`toggle`,{collapsed:(0,n.unref)(g)},()=>[((0,n.openBlock)(),(0,n.createBlock)((0,n.resolveDynamicComponent)(S.value),{size:16})),(0,n.unref)(g)?(0,n.createCommentVNode)(``,!0):((0,n.openBlock)(),(0,n.createElementBlock)(`span`,c,(0,n.toDisplayString)(C.value),1))])],8,s)):(0,n.createCommentVNode)(``,!0)])):(0,n.createCommentVNode)(``,!0)]),_:3},16,[`class`,`style`,`data-state`]))}});exports.default=l;
+const e=require("../composables/useControllableOpen.cjs"),t=require("./sidebar.cjs");let n=require("vue"),r=require("@treeui/icons");var i={key:0,class:`t-sidebar__header`},a={class:`t-sidebar__body`},o={key:1,class:`t-sidebar__footer`},s=[`aria-label`,`aria-expanded`],c={key:0},l=(0,n.defineComponent)({inheritAttrs:!1,__name:`TSidebar`,props:{as:{default:`aside`},collapsed:{type:Boolean,default:void 0},defaultCollapsed:{type:Boolean,default:!1},collapsible:{type:Boolean,default:!0},size:{default:`md`},side:{default:`left`},sticky:{type:Boolean,default:!1},bordered:{type:Boolean,default:!0},width:{default:`17.5rem`},collapsedWidth:{default:`4.75rem`},collapseLabel:{default:`Collapse sidebar`},expandLabel:{default:`Expand sidebar`}},emits:[`update:collapsed`,`collapse-change`],setup(l,{emit:u}){let d=(0,n.computed)(()=>(0,r.getTreeIcon)(`chevron-left`)),f=(0,n.computed)(()=>(0,r.getTreeIcon)(`chevron-right`)),p=l,m=u,h=(0,n.useAttrs)(),{value:g,setValue:_}=e.useControllableOpen((0,n.toRef)(p,`collapsed`),p.defaultCollapsed,e=>{m(`update:collapsed`,e),m(`collapse-change`,e)}),v=(0,n.computed)(()=>[`t-sidebar`,`t-sidebar--${p.size}`,`t-sidebar--${p.side}`,{"is-collapsed":g.value,"is-sticky":p.sticky,"is-bordered":p.bordered},h.class]),y=(0,n.computed)(()=>[{"--tree-sidebar-width":p.width,"--tree-sidebar-collapsed-width":p.collapsedWidth},h.style]),b=(0,n.computed)(()=>{let{class:e,style:t,...n}=h;return n}),x=()=>{p.collapsible&&_(!g.value)},S=(0,n.computed)(()=>p.side===`right`?g.value?d:f:g.value?f:d),C=(0,n.computed)(()=>g.value?p.expandLabel:p.collapseLabel);return(0,n.provide)(t.treeSidebarInjectionKey,{collapsed:(0,n.computed)(()=>g.value)}),(e,t)=>((0,n.openBlock)(),(0,n.createBlock)((0,n.resolveDynamicComponent)(l.as),(0,n.mergeProps)(b.value,{class:v.value,style:y.value,"data-state":(0,n.unref)(g)?`collapsed`:`expanded`}),{default:(0,n.withCtx)(()=>[e.$slots.header?((0,n.openBlock)(),(0,n.createElementBlock)(`div`,i,[(0,n.renderSlot)(e.$slots,`header`,{collapsed:(0,n.unref)(g)})])):(0,n.createCommentVNode)(``,!0),(0,n.createElementVNode)(`div`,a,[(0,n.renderSlot)(e.$slots,`default`,{collapsed:(0,n.unref)(g)})]),e.$slots.footer||l.collapsible?((0,n.openBlock)(),(0,n.createElementBlock)(`div`,o,[e.$slots.footer?(0,n.renderSlot)(e.$slots,`footer`,{collapsed:(0,n.unref)(g)},void 0,void 0,0):(0,n.createCommentVNode)(``,!0),l.collapsible?((0,n.openBlock)(),(0,n.createElementBlock)(`button`,{key:1,type:`button`,class:`t-sidebar__toggle`,"aria-label":C.value,"aria-expanded":!(0,n.unref)(g),onClick:x},[(0,n.renderSlot)(e.$slots,`toggle`,{collapsed:(0,n.unref)(g)},()=>[((0,n.openBlock)(),(0,n.createBlock)((0,n.resolveDynamicComponent)(S.value),{size:16})),(0,n.unref)(g)?(0,n.createCommentVNode)(``,!0):((0,n.openBlock)(),(0,n.createElementBlock)(`span`,c,(0,n.toDisplayString)(C.value),1))])],8,s)):(0,n.createCommentVNode)(``,!0)])):(0,n.createCommentVNode)(``,!0)]),_:3},16,[`class`,`style`,`data-state`]))}});exports.default=l;
 //# sourceMappingURL=TSidebar.vue_vue_type_script_setup_true_lang.cjs.map

package/dist/components/TSidebar.vue_vue_type_script_setup_true_lang.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TSidebar.vue_vue_type_script_setup_true_lang.cjs","names":["$slots"],"sources":["../../src/components/TSidebar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, provide, toRef, useAttrs } from 'vue';\nimport { useControllableOpen } from '../composables/useControllableOpen';\nimport type { TSize } from '../types/contracts';\nimport { treeSidebarInjectionKey } from './sidebar';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst _treeSidebarSides = ['left', 'right'] as const;\n\nexport type TSidebarSide = (typeof _treeSidebarSides)[number];\n\nconst ChevronLeftIcon = getTreeIcon('chevron-left');\nconst ChevronRightIcon = getTreeIcon('chevron-right');\n\nconst props = withDefaults(\n  defineProps<{\n    as?: string;\n    collapsed?: boolean;\n    defaultCollapsed?: boolean;\n    collapsible?: boolean;\n    size?: TSize;\n    side?: TSidebarSide;\n    sticky?: boolean;\n    bordered?: boolean;\n    width?: string;\n    collapsedWidth?: string;\n    collapseLabel?: string;\n    expandLabel?: string;\n  }>(),\n  {\n    as: 'aside',\n    collapsed: undefined,\n    defaultCollapsed: false,\n    collapsible: true,\n    size: 'md',\n    side: 'left',\n    sticky: false,\n    bordered: true,\n    width: '17.5rem',\n    collapsedWidth: '4.75rem',\n    collapseLabel: 'Collapse sidebar',\n    expandLabel: 'Expand sidebar',\n  },\n);\n\nconst emit = defineEmits<{\n  'update:collapsed': [value: boolean];\n  'collapse-change': [value: boolean];\n}>();\n\ndefineSlots<{\n  header?: (props: { collapsed: boolean }) => unknown;\n  default?: (props: { collapsed: boolean }) => unknown;\n  footer?: (props: { collapsed: boolean }) => unknown;\n  toggle?: (props: { collapsed: boolean }) => unknown;\n}>();\n\nconst attrs = useAttrs();\n\nconst { value: isCollapsed, setValue } = useControllableOpen(\n  toRef(props, 'collapsed'),\n  props.defaultCollapsed,\n  (value) => {\n    emit('update:collapsed', value);\n    emit('collapse-change', value);\n  },\n);\n\nconst rootClasses = computed(() => [\n  't-sidebar',\n  `t-sidebar--${props.size}`,\n  `t-sidebar--${props.side}`,\n  {\n    'is-collapsed': isCollapsed.value,\n    'is-sticky': props.sticky,\n    'is-bordered': props.bordered,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => [\n  {\n    '--tree-sidebar-width': props.width,\n    '--tree-sidebar-collapsed-width': props.collapsedWidth,\n  },\n  attrs.style,\n]);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst toggleCollapsed = () => {\n  if (!props.collapsible) {\n    return;\n  }\n\n  setValue(!isCollapsed.value);\n};\n\nconst ToggleIcon = computed(() => {\n  if (props.side === 'right') {\n    return isCollapsed.value ? ChevronLeftIcon : ChevronRightIcon;\n  }\n\n  return isCollapsed.value ? ChevronRightIcon : ChevronLeftIcon;\n});\n\nconst toggleLabel = computed(() =>\n  isCollapsed.value ? props.expandLabel : props.collapseLabel,\n);\n\nprovide(treeSidebarInjectionKey, {\n  collapsed: computed(() => isCollapsed.value),\n});\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n    :data-state=\"isCollapsed ? 'collapsed' : 'expanded'\"\n  >\n    <div\n      v-if=\"$slots.header\"\n      class=\"t-sidebar__header\"\n    >\n      <slot\n        name=\"header\"\n        :collapsed=\"isCollapsed\"\n      />\n    </div>\n\n    <div class=\"t-sidebar__body\">\n      <slot :collapsed=\"isCollapsed\" />\n    </div>\n\n    <div\n      v-if=\"$slots.footer || collapsible\"\n      class=\"t-sidebar__footer\"\n    >\n      <slot\n        v-if=\"$slots.footer\"\n        name=\"footer\"\n        :collapsed=\"isCollapsed\"\n      />\n\n      <button\n        v-if=\"collapsible\"\n        type=\"button\"\n        class=\"t-sidebar__toggle\"\n        :aria-label=\"toggleLabel\"\n        :aria-expanded=\"!isCollapsed\"\n        @click=\"toggleCollapsed\"\n      >\n        <slot\n          name=\"toggle\"\n          :collapsed=\"isCollapsed\"\n        >\n          <component\n            :is=\"ToggleIcon\"\n            :size=\"16\"\n          />\n          <span v-if=\"!isCollapsed\">{{ toggleLabel }}</span>\n        </slot>\n      </button>\n    </div>\n  </component>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"TSidebar.vue_vue_type_script_setup_true_lang.cjs","names":["$slots"],"sources":["../../src/components/TSidebar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, provide, toRef, useAttrs } from 'vue';\nimport { useControllableOpen } from '../composables/useControllableOpen';\nimport type { TSize } from '../types/contracts';\nimport { treeSidebarInjectionKey } from './sidebar';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst _treeSidebarSides = ['left', 'right'] as const;\n\nexport type TSidebarSide = (typeof _treeSidebarSides)[number];\n\nconst ChevronLeftIcon = computed(() => getTreeIcon('chevron-left'));\nconst ChevronRightIcon = computed(() => getTreeIcon('chevron-right'));\n\nconst props = withDefaults(\n  defineProps<{\n    as?: string;\n    collapsed?: boolean;\n    defaultCollapsed?: boolean;\n    collapsible?: boolean;\n    size?: TSize;\n    side?: TSidebarSide;\n    sticky?: boolean;\n    bordered?: boolean;\n    width?: string;\n    collapsedWidth?: string;\n    collapseLabel?: string;\n    expandLabel?: string;\n  }>(),\n  {\n    as: 'aside',\n    collapsed: undefined,\n    defaultCollapsed: false,\n    collapsible: true,\n    size: 'md',\n    side: 'left',\n    sticky: false,\n    bordered: true,\n    width: '17.5rem',\n    collapsedWidth: '4.75rem',\n    collapseLabel: 'Collapse sidebar',\n    expandLabel: 'Expand sidebar',\n  },\n);\n\nconst emit = defineEmits<{\n  'update:collapsed': [value: boolean];\n  'collapse-change': [value: boolean];\n}>();\n\ndefineSlots<{\n  header?: (props: { collapsed: boolean }) => unknown;\n  default?: (props: { collapsed: boolean }) => unknown;\n  footer?: (props: { collapsed: boolean }) => unknown;\n  toggle?: (props: { collapsed: boolean }) => unknown;\n}>();\n\nconst attrs = useAttrs();\n\nconst { value: isCollapsed, setValue } = useControllableOpen(\n  toRef(props, 'collapsed'),\n  props.defaultCollapsed,\n  (value) => {\n    emit('update:collapsed', value);\n    emit('collapse-change', value);\n  },\n);\n\nconst rootClasses = computed(() => [\n  't-sidebar',\n  `t-sidebar--${props.size}`,\n  `t-sidebar--${props.side}`,\n  {\n    'is-collapsed': isCollapsed.value,\n    'is-sticky': props.sticky,\n    'is-bordered': props.bordered,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => [\n  {\n    '--tree-sidebar-width': props.width,\n    '--tree-sidebar-collapsed-width': props.collapsedWidth,\n  },\n  attrs.style,\n]);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst toggleCollapsed = () => {\n  if (!props.collapsible) {\n    return;\n  }\n\n  setValue(!isCollapsed.value);\n};\n\nconst ToggleIcon = computed(() => {\n  if (props.side === 'right') {\n    return isCollapsed.value ? ChevronLeftIcon : ChevronRightIcon;\n  }\n\n  return isCollapsed.value ? ChevronRightIcon : ChevronLeftIcon;\n});\n\nconst toggleLabel = computed(() =>\n  isCollapsed.value ? props.expandLabel : props.collapseLabel,\n);\n\nprovide(treeSidebarInjectionKey, {\n  collapsed: computed(() => isCollapsed.value),\n});\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n    :data-state=\"isCollapsed ? 'collapsed' : 'expanded'\"\n  >\n    <div\n      v-if=\"$slots.header\"\n      class=\"t-sidebar__header\"\n    >\n      <slot\n        name=\"header\"\n        :collapsed=\"isCollapsed\"\n      />\n    </div>\n\n    <div class=\"t-sidebar__body\">\n      <slot :collapsed=\"isCollapsed\" />\n    </div>\n\n    <div\n      v-if=\"$slots.footer || collapsible\"\n      class=\"t-sidebar__footer\"\n    >\n      <slot\n        v-if=\"$slots.footer\"\n        name=\"footer\"\n        :collapsed=\"isCollapsed\"\n      />\n\n      <button\n        v-if=\"collapsible\"\n        type=\"button\"\n        class=\"t-sidebar__toggle\"\n        :aria-label=\"toggleLabel\"\n        :aria-expanded=\"!isCollapsed\"\n        @click=\"toggleCollapsed\"\n      >\n        <slot\n          name=\"toggle\"\n          :collapsed=\"isCollapsed\"\n        >\n          <component\n            :is=\"ToggleIcon\"\n            :size=\"16\"\n          />\n          <span v-if=\"!isCollapsed\">{{ toggleLabel }}</span>\n        </slot>\n      </button>\n    </div>\n  </component>\n</template>\n"],"mappings":"qyBAeA,IAAM,GAAA,EAAA,EAAA,SAAA,MAAA,EAAA,EAAA,YAAA,CAA6C,cAAc,CAAC,EAC5D,GAAA,EAAA,EAAA,SAAA,MAAA,EAAA,EAAA,YAAA,CAA8C,eAAe,CAAC,EAE9D,EAAQ,EA+BR,EAAO,EAYP,GAAA,EAAA,EAAA,SAAA,CAAiB,EAEjB,CAAE,MAAO,EAAa,YAAa,EAAA,qBAAA,EAAA,EAAA,MAAA,CACjC,EAAO,WAAW,EACxB,EAAM,iBACL,GAAU,CACT,EAAK,mBAAoB,CAAK,EAC9B,EAAK,kBAAmB,CAAK,CAC/B,CACF,EAEM,GAAA,EAAA,EAAA,SAAA,KAA6B,CACjC,YACA,cAAc,EAAM,OACpB,cAAc,EAAM,OACpB,CACE,eAAgB,EAAY,MAC5B,YAAa,EAAM,OACnB,cAAe,EAAM,QACvB,EACA,EAAM,KACR,CAAC,EAEK,GAAA,EAAA,EAAA,SAAA,KAA2B,CAC/B,CACE,uBAAwB,EAAM,MAC9B,iCAAkC,EAAM,cAC1C,EACA,EAAM,KACR,CAAC,EAEK,GAAA,EAAA,EAAA,SAAA,KAA2B,CAC/B,GAAM,CAAE,MAAO,EAAQ,MAAO,EAAQ,GAAG,GAAS,EAClD,OAAO,CACT,CAAC,EAEK,MAAwB,CACvB,EAAM,aAIX,EAAS,CAAC,EAAY,KAAK,CAC7B,EAEM,GAAA,EAAA,EAAA,SAAA,KACA,EAAM,OAAS,QACV,EAAY,MAAQ,EAAkB,EAGxC,EAAY,MAAQ,EAAmB,CAC/C,EAEK,GAAA,EAAA,EAAA,SAAA,KACJ,EAAY,MAAQ,EAAM,YAAc,EAAM,aAChD,SAEA,EAAA,EAAA,QAAA,CAAQ,EAAA,wBAAyB,CAC/B,WAAA,EAAA,EAAA,SAAA,KAA0B,EAAY,KAAK,CAC7C,CAAC,4EAKQ,EAAA,EAAE,GAAA,EAAA,EAAA,WAAA,CACC,EAiDE,MAjDO,CAChB,MAAO,EAAA,MACP,MAAO,EAAA,MACP,cAAA,EAAA,EAAA,MAAA,CAAY,CAAA,EAAW,YAAA,wCAUlB,CAPEA,EAAAA,OAAO,SAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAOT,MARN,EAQM,EAAA,EAAA,EAAA,WAAA,CADF,EAAA,OAAA,SAAA,CADC,WAAA,EAAA,EAAA,MAAA,CAAW,CAAA,CAAW,CAAA,CAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,2BAMrB,MAFN,EAEM,EAAA,EAAA,EAAA,WAAA,CAD6B,EAAA,OAAA,UAAA,CAA1B,WAAA,EAAA,EAAA,MAAA,CAAW,CAAA,CAAW,CAAA,CAAA,CAAA,EAIvBA,EAAAA,OAAO,QAAU,EAAA,cAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CA4BnB,MA7BN,EA6BM,CAxBIA,EAAAA,OAAO,QAAA,EAAA,EAAA,WAAA,CAGb,EAAA,OAAA,SAAA,CADC,WAAA,EAAA,EAAA,MAAA,CAAW,CAAA,CAAW,EAAA,IAAA,GAAA,IAAA,GAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,EAIjB,EAAA,cAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAiBC,SAAA,OAhBP,KAAK,SACL,MAAM,oBACL,aAAY,EAAA,MACZ,gBAAa,EAAA,EAAA,EAAA,MAAA,CAAG,CAAA,EAChB,QAAO,qBAWD,EAAA,OAAA,SAAA,CAPJ,WAAA,EAAA,EAAA,MAAA,CAAW,CAAA,CAAW,MAOlB,GAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,wBAAA,CAJE,EAAA,KAAU,EAAA,CACd,KAAM,EAAE,CAAA,IAAA,EAAA,EAAA,MAAA,CAEE,CAAA,GAA2B,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,IAA3B,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAAqC,OAAA,GAAA,EAAA,EAAA,gBAAA,CAArB,EAAA,KAAW,EAAA,CAAA,EAAA,CAAA,CAAA,EAAA,EAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,CAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA"}

package/dist/components/TSidebar.vue_vue_type_script_setup_true_lang.js

@@ -43,7 +43,7 @@ var y = {
 	},
 	emits: ["update:collapsed", "collapse-change"],
 	setup(s, { emit: w }) {
-		let T = v("chevron-left"), E = v("chevron-right"), D = s, O = w, k = g(), { value: A, setValue: j } = e(m(D, "collapsed"), D.defaultCollapsed, (e) => {
+		let T = n(() => v("chevron-left")), E = n(() => v("chevron-right")), D = s, O = w, k = g(), { value: A, setValue: j } = e(m(D, "collapsed"), D.defaultCollapsed, (e) => {
 			O("update:collapsed", e), O("collapse-change", e);
 		}), M = n(() => [
 			"t-sidebar",

package/dist/components/TSidebar.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"TSidebar.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../src/components/TSidebar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, provide, toRef, useAttrs } from 'vue';\nimport { useControllableOpen } from '../composables/useControllableOpen';\nimport type { TSize } from '../types/contracts';\nimport { treeSidebarInjectionKey } from './sidebar';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst _treeSidebarSides = ['left', 'right'] as const;\n\nexport type TSidebarSide = (typeof _treeSidebarSides)[number];\n\nconst ChevronLeftIcon = getTreeIcon('chevron-left');\nconst ChevronRightIcon = getTreeIcon('chevron-right');\n\nconst props = withDefaults(\n  defineProps<{\n    as?: string;\n    collapsed?: boolean;\n    defaultCollapsed?: boolean;\n    collapsible?: boolean;\n    size?: TSize;\n    side?: TSidebarSide;\n    sticky?: boolean;\n    bordered?: boolean;\n    width?: string;\n    collapsedWidth?: string;\n    collapseLabel?: string;\n    expandLabel?: string;\n  }>(),\n  {\n    as: 'aside',\n    collapsed: undefined,\n    defaultCollapsed: false,\n    collapsible: true,\n    size: 'md',\n    side: 'left',\n    sticky: false,\n    bordered: true,\n    width: '17.5rem',\n    collapsedWidth: '4.75rem',\n    collapseLabel: 'Collapse sidebar',\n    expandLabel: 'Expand sidebar',\n  },\n);\n\nconst emit = defineEmits<{\n  'update:collapsed': [value: boolean];\n  'collapse-change': [value: boolean];\n}>();\n\ndefineSlots<{\n  header?: (props: { collapsed: boolean }) => unknown;\n  default?: (props: { collapsed: boolean }) => unknown;\n  footer?: (props: { collapsed: boolean }) => unknown;\n  toggle?: (props: { collapsed: boolean }) => unknown;\n}>();\n\nconst attrs = useAttrs();\n\nconst { value: isCollapsed, setValue } = useControllableOpen(\n  toRef(props, 'collapsed'),\n  props.defaultCollapsed,\n  (value) => {\n    emit('update:collapsed', value);\n    emit('collapse-change', value);\n  },\n);\n\nconst rootClasses = computed(() => [\n  't-sidebar',\n  `t-sidebar--${props.size}`,\n  `t-sidebar--${props.side}`,\n  {\n    'is-collapsed': isCollapsed.value,\n    'is-sticky': props.sticky,\n    'is-bordered': props.bordered,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => [\n  {\n    '--tree-sidebar-width': props.width,\n    '--tree-sidebar-collapsed-width': props.collapsedWidth,\n  },\n  attrs.style,\n]);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst toggleCollapsed = () => {\n  if (!props.collapsible) {\n    return;\n  }\n\n  setValue(!isCollapsed.value);\n};\n\nconst ToggleIcon = computed(() => {\n  if (props.side === 'right') {\n    return isCollapsed.value ? ChevronLeftIcon : ChevronRightIcon;\n  }\n\n  return isCollapsed.value ? ChevronRightIcon : ChevronLeftIcon;\n});\n\nconst toggleLabel = computed(() =>\n  isCollapsed.value ? props.expandLabel : props.collapseLabel,\n);\n\nprovide(treeSidebarInjectionKey, {\n  collapsed: computed(() => isCollapsed.value),\n});\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n    :data-state=\"isCollapsed ? 'collapsed' : 'expanded'\"\n  >\n    <div\n      v-if=\"$slots.header\"\n      class=\"t-sidebar__header\"\n    >\n      <slot\n        name=\"header\"\n        :collapsed=\"isCollapsed\"\n      />\n    </div>\n\n    <div class=\"t-sidebar__body\">\n      <slot :collapsed=\"isCollapsed\" />\n    </div>\n\n    <div\n      v-if=\"$slots.footer || collapsible\"\n      class=\"t-sidebar__footer\"\n    >\n      <slot\n        v-if=\"$slots.footer\"\n        name=\"footer\"\n        :collapsed=\"isCollapsed\"\n      />\n\n      <button\n        v-if=\"collapsible\"\n        type=\"button\"\n        class=\"t-sidebar__toggle\"\n        :aria-label=\"toggleLabel\"\n        :aria-expanded=\"!isCollapsed\"\n        @click=\"toggleCollapsed\"\n      >\n        <slot\n          name=\"toggle\"\n          :collapsed=\"isCollapsed\"\n        >\n          <component\n            :is=\"ToggleIcon\"\n            :size=\"16\"\n          />\n          <span v-if=\"!isCollapsed\">{{ toggleLabel }}</span>\n        </slot>\n      </button>\n    </div>\n  </component>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAeA,IAAM,IAAkB,EAAY,cAAc,GAC5C,IAAmB,EAAY,eAAe,GAE9C,IAAQ,GA+BR,IAAO,GAYP,IAAQ,EAAS,GAEjB,EAAE,OAAO,GAAa,gBAAa,EACvC,EAAM,GAAO,WAAW,GACxB,EAAM,mBACL,MAAU;GAET,AADA,EAAK,oBAAoB,CAAK,GAC9B,EAAK,mBAAmB,CAAK;EAC/B,CACF,GAEM,IAAc,QAAe;GACjC;GACA,cAAc,EAAM;GACpB,cAAc,EAAM;GACpB;IACE,gBAAgB,EAAY;IAC5B,aAAa,EAAM;IACnB,eAAe,EAAM;GACvB;GACA,EAAM;EACR,CAAC,GAEK,IAAY,QAAe,CAC/B;GACE,wBAAwB,EAAM;GAC9B,kCAAkC,EAAM;EAC1C,GACA,EAAM,KACR,CAAC,GAEK,IAAY,QAAe;GAC/B,IAAM,EAAE,OAAO,GAAQ,OAAO,GAAQ,GAAG,MAAS;GAClD,OAAO;EACT,CAAC,GAEK,UAAwB;GACvB,EAAM,eAIX,EAAS,CAAC,EAAY,KAAK;EAC7B,GAEM,IAAa,QACb,EAAM,SAAS,UACV,EAAY,QAAQ,IAAkB,IAGxC,EAAY,QAAQ,IAAmB,CAC/C,GAEK,IAAc,QAClB,EAAY,QAAQ,EAAM,cAAc,EAAM,aAChD;SAEA,EAAQ,GAAyB,EAC/B,WAAW,QAAe,EAAY,KAAK,EAC7C,CAAC,mBAIC,EAmDY,EAlDL,EAAA,EAAE,GADT,EAEU,EAiDE,OAjDO;GAChB,OAAO,EAAA;GACP,OAAO,EAAA;GACP,cAAY,EAAA,CAAA,IAAW,cAAA;;oBAUlB;IAPEA,EAAAA,OAAO,UAAA,EAAA,GADf,EAQM,OARN,GAQM,CAJJ,EAGE,EAAA,QAAA,UAAA,EADC,WAAW,EAAA,CAAA,EAAW,CAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA;IAI3B,EAEM,OAFN,GAEM,CADJ,EAAiC,EAAA,QAAA,WAAA,EAA1B,WAAW,EAAA,CAAA,EAAW,CAAA,CAAA,CAAA;IAIvBA,EAAAA,OAAO,UAAU,EAAA,eAAA,EAAA,GADzB,EA6BM,OA7BN,GA6BM,CAxBIA,EAAAA,OAAO,SADf,EAIE,EAAA,QAAA,UAAA,EADC,WAAW,EAAA,CAAA,EAAW,GAAA,KAAA,GAAA,KAAA,GAAA,CAAA,IAAA,EAAA,IAAA,EAAA,GAIjB,EAAA,eAAA,EAAA,GADR,EAkBS,UAAA;;KAhBP,MAAK;KACL,OAAM;KACL,cAAY,EAAA;KACZ,iBAAa,CAAG,EAAA,CAAA;KAChB,SAAO;QAER,EASO,EAAA,QAAA,UAAA,EAPJ,WAAW,EAAA,CAAA,EAAW,SAOlB,EAAA,EAAA,GALL,EAGE,EAFK,EAAA,KAAU,GAAA,EACd,MAAM,GAAE,CAAA,IAEE,EAAA,CAAA,IAA2B,EAAA,IAAA,EAAA,KAA3B,EAAA,GAAb,EAAkD,QAAA,GAAA,EAArB,EAAA,KAAW,GAAA,CAAA,EAAA,CAAA,CAAA,GAAA,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}
+{"version":3,"file":"TSidebar.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../src/components/TSidebar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, provide, toRef, useAttrs } from 'vue';\nimport { useControllableOpen } from '../composables/useControllableOpen';\nimport type { TSize } from '../types/contracts';\nimport { treeSidebarInjectionKey } from './sidebar';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst _treeSidebarSides = ['left', 'right'] as const;\n\nexport type TSidebarSide = (typeof _treeSidebarSides)[number];\n\nconst ChevronLeftIcon = computed(() => getTreeIcon('chevron-left'));\nconst ChevronRightIcon = computed(() => getTreeIcon('chevron-right'));\n\nconst props = withDefaults(\n  defineProps<{\n    as?: string;\n    collapsed?: boolean;\n    defaultCollapsed?: boolean;\n    collapsible?: boolean;\n    size?: TSize;\n    side?: TSidebarSide;\n    sticky?: boolean;\n    bordered?: boolean;\n    width?: string;\n    collapsedWidth?: string;\n    collapseLabel?: string;\n    expandLabel?: string;\n  }>(),\n  {\n    as: 'aside',\n    collapsed: undefined,\n    defaultCollapsed: false,\n    collapsible: true,\n    size: 'md',\n    side: 'left',\n    sticky: false,\n    bordered: true,\n    width: '17.5rem',\n    collapsedWidth: '4.75rem',\n    collapseLabel: 'Collapse sidebar',\n    expandLabel: 'Expand sidebar',\n  },\n);\n\nconst emit = defineEmits<{\n  'update:collapsed': [value: boolean];\n  'collapse-change': [value: boolean];\n}>();\n\ndefineSlots<{\n  header?: (props: { collapsed: boolean }) => unknown;\n  default?: (props: { collapsed: boolean }) => unknown;\n  footer?: (props: { collapsed: boolean }) => unknown;\n  toggle?: (props: { collapsed: boolean }) => unknown;\n}>();\n\nconst attrs = useAttrs();\n\nconst { value: isCollapsed, setValue } = useControllableOpen(\n  toRef(props, 'collapsed'),\n  props.defaultCollapsed,\n  (value) => {\n    emit('update:collapsed', value);\n    emit('collapse-change', value);\n  },\n);\n\nconst rootClasses = computed(() => [\n  't-sidebar',\n  `t-sidebar--${props.size}`,\n  `t-sidebar--${props.side}`,\n  {\n    'is-collapsed': isCollapsed.value,\n    'is-sticky': props.sticky,\n    'is-bordered': props.bordered,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => [\n  {\n    '--tree-sidebar-width': props.width,\n    '--tree-sidebar-collapsed-width': props.collapsedWidth,\n  },\n  attrs.style,\n]);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst toggleCollapsed = () => {\n  if (!props.collapsible) {\n    return;\n  }\n\n  setValue(!isCollapsed.value);\n};\n\nconst ToggleIcon = computed(() => {\n  if (props.side === 'right') {\n    return isCollapsed.value ? ChevronLeftIcon : ChevronRightIcon;\n  }\n\n  return isCollapsed.value ? ChevronRightIcon : ChevronLeftIcon;\n});\n\nconst toggleLabel = computed(() =>\n  isCollapsed.value ? props.expandLabel : props.collapseLabel,\n);\n\nprovide(treeSidebarInjectionKey, {\n  collapsed: computed(() => isCollapsed.value),\n});\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n    :data-state=\"isCollapsed ? 'collapsed' : 'expanded'\"\n  >\n    <div\n      v-if=\"$slots.header\"\n      class=\"t-sidebar__header\"\n    >\n      <slot\n        name=\"header\"\n        :collapsed=\"isCollapsed\"\n      />\n    </div>\n\n    <div class=\"t-sidebar__body\">\n      <slot :collapsed=\"isCollapsed\" />\n    </div>\n\n    <div\n      v-if=\"$slots.footer || collapsible\"\n      class=\"t-sidebar__footer\"\n    >\n      <slot\n        v-if=\"$slots.footer\"\n        name=\"footer\"\n        :collapsed=\"isCollapsed\"\n      />\n\n      <button\n        v-if=\"collapsible\"\n        type=\"button\"\n        class=\"t-sidebar__toggle\"\n        :aria-label=\"toggleLabel\"\n        :aria-expanded=\"!isCollapsed\"\n        @click=\"toggleCollapsed\"\n      >\n        <slot\n          name=\"toggle\"\n          :collapsed=\"isCollapsed\"\n        >\n          <component\n            :is=\"ToggleIcon\"\n            :size=\"16\"\n          />\n          <span v-if=\"!isCollapsed\">{{ toggleLabel }}</span>\n        </slot>\n      </button>\n    </div>\n  </component>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAeA,IAAM,IAAkB,QAAe,EAAY,cAAc,CAAC,GAC5D,IAAmB,QAAe,EAAY,eAAe,CAAC,GAE9D,IAAQ,GA+BR,IAAO,GAYP,IAAQ,EAAS,GAEjB,EAAE,OAAO,GAAa,gBAAa,EACvC,EAAM,GAAO,WAAW,GACxB,EAAM,mBACL,MAAU;GAET,AADA,EAAK,oBAAoB,CAAK,GAC9B,EAAK,mBAAmB,CAAK;EAC/B,CACF,GAEM,IAAc,QAAe;GACjC;GACA,cAAc,EAAM;GACpB,cAAc,EAAM;GACpB;IACE,gBAAgB,EAAY;IAC5B,aAAa,EAAM;IACnB,eAAe,EAAM;GACvB;GACA,EAAM;EACR,CAAC,GAEK,IAAY,QAAe,CAC/B;GACE,wBAAwB,EAAM;GAC9B,kCAAkC,EAAM;EAC1C,GACA,EAAM,KACR,CAAC,GAEK,IAAY,QAAe;GAC/B,IAAM,EAAE,OAAO,GAAQ,OAAO,GAAQ,GAAG,MAAS;GAClD,OAAO;EACT,CAAC,GAEK,UAAwB;GACvB,EAAM,eAIX,EAAS,CAAC,EAAY,KAAK;EAC7B,GAEM,IAAa,QACb,EAAM,SAAS,UACV,EAAY,QAAQ,IAAkB,IAGxC,EAAY,QAAQ,IAAmB,CAC/C,GAEK,IAAc,QAClB,EAAY,QAAQ,EAAM,cAAc,EAAM,aAChD;SAEA,EAAQ,GAAyB,EAC/B,WAAW,QAAe,EAAY,KAAK,EAC7C,CAAC,mBAIC,EAmDY,EAlDL,EAAA,EAAE,GADT,EAEU,EAiDE,OAjDO;GAChB,OAAO,EAAA;GACP,OAAO,EAAA;GACP,cAAY,EAAA,CAAA,IAAW,cAAA;;oBAUlB;IAPEA,EAAAA,OAAO,UAAA,EAAA,GADf,EAQM,OARN,GAQM,CAJJ,EAGE,EAAA,QAAA,UAAA,EADC,WAAW,EAAA,CAAA,EAAW,CAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA;IAI3B,EAEM,OAFN,GAEM,CADJ,EAAiC,EAAA,QAAA,WAAA,EAA1B,WAAW,EAAA,CAAA,EAAW,CAAA,CAAA,CAAA;IAIvBA,EAAAA,OAAO,UAAU,EAAA,eAAA,EAAA,GADzB,EA6BM,OA7BN,GA6BM,CAxBIA,EAAAA,OAAO,SADf,EAIE,EAAA,QAAA,UAAA,EADC,WAAW,EAAA,CAAA,EAAW,GAAA,KAAA,GAAA,KAAA,GAAA,CAAA,IAAA,EAAA,IAAA,EAAA,GAIjB,EAAA,eAAA,EAAA,GADR,EAkBS,UAAA;;KAhBP,MAAK;KACL,OAAM;KACL,cAAY,EAAA;KACZ,iBAAa,CAAG,EAAA,CAAA;KAChB,SAAO;QAER,EASO,EAAA,QAAA,UAAA,EAPJ,WAAW,EAAA,CAAA,EAAW,SAOlB,EAAA,EAAA,GALL,EAGE,EAFK,EAAA,KAAU,GAAA,EACd,MAAM,GAAE,CAAA,IAEE,EAAA,CAAA,IAA2B,EAAA,IAAA,EAAA,KAA3B,EAAA,GAAb,EAAkD,QAAA,GAAA,EAArB,EAAA,KAAW,GAAA,CAAA,EAAA,CAAA,CAAA,GAAA,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}

package/dist/components/TSteps.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TSteps.cjs","names":[],"sources":["../../src/components/TSteps.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TStepItem {\n  label: string;\n  value: string;\n  description?: string;\n  meta?: string;\n  status?: TStepStatus;\n  disabled?: boolean;\n}\n\nconst _treeStepStatuses = ['complete', 'current', 'upcoming', 'error'] as const;\nconst _treeStepOrientations = ['horizontal', 'vertical'] as const;\n\nexport type TStepStatus = (typeof _treeStepStatuses)[number];\nexport type TStepOrientation = (typeof _treeStepOrientations)[number];\n\nconst CheckIcon = getTreeIcon('check');\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TStepItem[];\n    size?: TSize;\n    orientation?: TStepOrientation;\n    interactive?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    orientation: 'horizontal',\n    interactive: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TStepItem;\n    index: number;\n    status: TStepStatus;\n    current: boolean;\n  }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst internalValue = ref(props.defaultValue || props.items[0]?.value || '');\n\nconst activeValue = computed(() => props.modelValue ?? internalValue.value);\n\nconst currentIndex = computed(() => {\n  const activeIndex = props.items.findIndex((item) => item.value === activeValue.value);\n  return activeIndex >= 0 ? activeIndex : 0;\n});\n\nconst rootClasses = computed(() => [\n  't-steps',\n  `t-steps--${props.size}`,\n  `t-steps--${props.orientation}`,\n  {\n    'is-interactive': props.interactive,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst resolveStatus = (item: TStepItem, index: number): TStepStatus => {\n  if (item.status) {\n    return item.status;\n  }\n\n  if (index < currentIndex.value) {\n    return 'complete';\n  }\n\n  if (index === currentIndex.value) {\n    return 'current';\n  }\n\n  return 'upcoming';\n};\n\nconst selectStep = (item: TStepItem) => {\n  if (!props.interactive || item.disabled) {\n    return;\n  }\n\n  if (props.modelValue === undefined) {\n    internalValue.value = item.value;\n  }\n\n  emit('update:modelValue', item.value);\n};\n\nwatch(\n  () => props.items,\n  (items) => {\n    const hasCurrentItem = items.some((item) => item.value === activeValue.value);\n\n    if (!hasCurrentItem && items[0] && props.modelValue === undefined) {\n      internalValue.value = items[0].value;\n    }\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <ol\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <li\n      v-for=\"(item, index) in items\"\n      :key=\"item.value\"\n      class=\"t-steps__item\"\n      :class=\"`is-${resolveStatus(item, index)}`\"\n    >\n      <button\n        type=\"button\"\n        class=\"t-steps__button\"\n        :class=\"{\n          'is-current': resolveStatus(item, index) === 'current',\n          'is-disabled': item.disabled,\n        }\"\n        :disabled=\"!interactive || item.disabled\"\n        :aria-current=\"resolveStatus(item, index) === 'current' ? 'step' : undefined\"\n        @click=\"selectStep(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :index=\"index\"\n          :status=\"resolveStatus(item, index)\"\n          :current=\"resolveStatus(item, index) === 'current'\"\n        >\n          <span\n            class=\"t-steps__indicator\"\n            aria-hidden=\"true\"\n          >\n            <CheckIcon\n              v-if=\"resolveStatus(item, index) === 'complete'\"\n              v-bind=\"treeIconDefaults\"\n            />\n            <span v-else-if=\"resolveStatus(item, index) === 'error'\">!</span>\n            <span v-else>{{ index + 1 }}</span>\n          </span>\n\n          <span class=\"t-steps__copy\">\n            <span class=\"t-steps__label\">{{ item.label }}</span>\n            <span\n              v-if=\"item.description\"\n              class=\"t-steps__description\"\n            >\n              {{ item.description }}\n            </span>\n          </span>\n\n          <span\n            v-if=\"item.meta\"\n            class=\"t-steps__meta\"\n          >\n            {{ item.meta }}\n          </span>\n        </slot>\n      </button>\n    </li>\n  </ol>\n</template>\n"],"mappings":""}
+{"version":3,"file":"TSteps.cjs","names":[],"sources":["../../src/components/TSteps.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TStepItem {\n  label: string;\n  value: string;\n  description?: string;\n  meta?: string;\n  status?: TStepStatus;\n  disabled?: boolean;\n}\n\nconst _treeStepStatuses = ['complete', 'current', 'upcoming', 'error'] as const;\nconst _treeStepOrientations = ['horizontal', 'vertical'] as const;\n\nexport type TStepStatus = (typeof _treeStepStatuses)[number];\nexport type TStepOrientation = (typeof _treeStepOrientations)[number];\n\nconst CheckIcon = computed(() => getTreeIcon('check'));\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TStepItem[];\n    size?: TSize;\n    orientation?: TStepOrientation;\n    interactive?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    orientation: 'horizontal',\n    interactive: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TStepItem;\n    index: number;\n    status: TStepStatus;\n    current: boolean;\n  }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst internalValue = ref(props.defaultValue || props.items[0]?.value || '');\n\nconst activeValue = computed(() => props.modelValue ?? internalValue.value);\n\nconst currentIndex = computed(() => {\n  const activeIndex = props.items.findIndex((item) => item.value === activeValue.value);\n  return activeIndex >= 0 ? activeIndex : 0;\n});\n\nconst rootClasses = computed(() => [\n  't-steps',\n  `t-steps--${props.size}`,\n  `t-steps--${props.orientation}`,\n  {\n    'is-interactive': props.interactive,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst resolveStatus = (item: TStepItem, index: number): TStepStatus => {\n  if (item.status) {\n    return item.status;\n  }\n\n  if (index < currentIndex.value) {\n    return 'complete';\n  }\n\n  if (index === currentIndex.value) {\n    return 'current';\n  }\n\n  return 'upcoming';\n};\n\nconst selectStep = (item: TStepItem) => {\n  if (!props.interactive || item.disabled) {\n    return;\n  }\n\n  if (props.modelValue === undefined) {\n    internalValue.value = item.value;\n  }\n\n  emit('update:modelValue', item.value);\n};\n\nwatch(\n  () => props.items,\n  (items) => {\n    const hasCurrentItem = items.some((item) => item.value === activeValue.value);\n\n    if (!hasCurrentItem && items[0] && props.modelValue === undefined) {\n      internalValue.value = items[0].value;\n    }\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <ol\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <li\n      v-for=\"(item, index) in items\"\n      :key=\"item.value\"\n      class=\"t-steps__item\"\n      :class=\"`is-${resolveStatus(item, index)}`\"\n    >\n      <button\n        type=\"button\"\n        class=\"t-steps__button\"\n        :class=\"{\n          'is-current': resolveStatus(item, index) === 'current',\n          'is-disabled': item.disabled,\n        }\"\n        :disabled=\"!interactive || item.disabled\"\n        :aria-current=\"resolveStatus(item, index) === 'current' ? 'step' : undefined\"\n        @click=\"selectStep(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :index=\"index\"\n          :status=\"resolveStatus(item, index)\"\n          :current=\"resolveStatus(item, index) === 'current'\"\n        >\n          <span\n            class=\"t-steps__indicator\"\n            aria-hidden=\"true\"\n          >\n            <CheckIcon\n              v-if=\"resolveStatus(item, index) === 'complete'\"\n              v-bind=\"treeIconDefaults\"\n            />\n            <span v-else-if=\"resolveStatus(item, index) === 'error'\">!</span>\n            <span v-else>{{ index + 1 }}</span>\n          </span>\n\n          <span class=\"t-steps__copy\">\n            <span class=\"t-steps__label\">{{ item.label }}</span>\n            <span\n              v-if=\"item.description\"\n              class=\"t-steps__description\"\n            >\n              {{ item.description }}\n            </span>\n          </span>\n\n          <span\n            v-if=\"item.meta\"\n            class=\"t-steps__meta\"\n          >\n            {{ item.meta }}\n          </span>\n        </slot>\n      </button>\n    </li>\n  </ol>\n</template>\n"],"mappings":""}

package/dist/components/TSteps.js.map

@@ -1 +1 @@
-{"version":3,"file":"TSteps.js","names":[],"sources":["../../src/components/TSteps.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TStepItem {\n  label: string;\n  value: string;\n  description?: string;\n  meta?: string;\n  status?: TStepStatus;\n  disabled?: boolean;\n}\n\nconst _treeStepStatuses = ['complete', 'current', 'upcoming', 'error'] as const;\nconst _treeStepOrientations = ['horizontal', 'vertical'] as const;\n\nexport type TStepStatus = (typeof _treeStepStatuses)[number];\nexport type TStepOrientation = (typeof _treeStepOrientations)[number];\n\nconst CheckIcon = getTreeIcon('check');\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TStepItem[];\n    size?: TSize;\n    orientation?: TStepOrientation;\n    interactive?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    orientation: 'horizontal',\n    interactive: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TStepItem;\n    index: number;\n    status: TStepStatus;\n    current: boolean;\n  }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst internalValue = ref(props.defaultValue || props.items[0]?.value || '');\n\nconst activeValue = computed(() => props.modelValue ?? internalValue.value);\n\nconst currentIndex = computed(() => {\n  const activeIndex = props.items.findIndex((item) => item.value === activeValue.value);\n  return activeIndex >= 0 ? activeIndex : 0;\n});\n\nconst rootClasses = computed(() => [\n  't-steps',\n  `t-steps--${props.size}`,\n  `t-steps--${props.orientation}`,\n  {\n    'is-interactive': props.interactive,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst resolveStatus = (item: TStepItem, index: number): TStepStatus => {\n  if (item.status) {\n    return item.status;\n  }\n\n  if (index < currentIndex.value) {\n    return 'complete';\n  }\n\n  if (index === currentIndex.value) {\n    return 'current';\n  }\n\n  return 'upcoming';\n};\n\nconst selectStep = (item: TStepItem) => {\n  if (!props.interactive || item.disabled) {\n    return;\n  }\n\n  if (props.modelValue === undefined) {\n    internalValue.value = item.value;\n  }\n\n  emit('update:modelValue', item.value);\n};\n\nwatch(\n  () => props.items,\n  (items) => {\n    const hasCurrentItem = items.some((item) => item.value === activeValue.value);\n\n    if (!hasCurrentItem && items[0] && props.modelValue === undefined) {\n      internalValue.value = items[0].value;\n    }\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <ol\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <li\n      v-for=\"(item, index) in items\"\n      :key=\"item.value\"\n      class=\"t-steps__item\"\n      :class=\"`is-${resolveStatus(item, index)}`\"\n    >\n      <button\n        type=\"button\"\n        class=\"t-steps__button\"\n        :class=\"{\n          'is-current': resolveStatus(item, index) === 'current',\n          'is-disabled': item.disabled,\n        }\"\n        :disabled=\"!interactive || item.disabled\"\n        :aria-current=\"resolveStatus(item, index) === 'current' ? 'step' : undefined\"\n        @click=\"selectStep(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :index=\"index\"\n          :status=\"resolveStatus(item, index)\"\n          :current=\"resolveStatus(item, index) === 'current'\"\n        >\n          <span\n            class=\"t-steps__indicator\"\n            aria-hidden=\"true\"\n          >\n            <CheckIcon\n              v-if=\"resolveStatus(item, index) === 'complete'\"\n              v-bind=\"treeIconDefaults\"\n            />\n            <span v-else-if=\"resolveStatus(item, index) === 'error'\">!</span>\n            <span v-else>{{ index + 1 }}</span>\n          </span>\n\n          <span class=\"t-steps__copy\">\n            <span class=\"t-steps__label\">{{ item.label }}</span>\n            <span\n              v-if=\"item.description\"\n              class=\"t-steps__description\"\n            >\n              {{ item.description }}\n            </span>\n          </span>\n\n          <span\n            v-if=\"item.meta\"\n            class=\"t-steps__meta\"\n          >\n            {{ item.meta }}\n          </span>\n        </slot>\n      </button>\n    </li>\n  </ol>\n</template>\n"],"mappings":""}
+{"version":3,"file":"TSteps.js","names":[],"sources":["../../src/components/TSteps.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TStepItem {\n  label: string;\n  value: string;\n  description?: string;\n  meta?: string;\n  status?: TStepStatus;\n  disabled?: boolean;\n}\n\nconst _treeStepStatuses = ['complete', 'current', 'upcoming', 'error'] as const;\nconst _treeStepOrientations = ['horizontal', 'vertical'] as const;\n\nexport type TStepStatus = (typeof _treeStepStatuses)[number];\nexport type TStepOrientation = (typeof _treeStepOrientations)[number];\n\nconst CheckIcon = computed(() => getTreeIcon('check'));\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TStepItem[];\n    size?: TSize;\n    orientation?: TStepOrientation;\n    interactive?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    orientation: 'horizontal',\n    interactive: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TStepItem;\n    index: number;\n    status: TStepStatus;\n    current: boolean;\n  }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst internalValue = ref(props.defaultValue || props.items[0]?.value || '');\n\nconst activeValue = computed(() => props.modelValue ?? internalValue.value);\n\nconst currentIndex = computed(() => {\n  const activeIndex = props.items.findIndex((item) => item.value === activeValue.value);\n  return activeIndex >= 0 ? activeIndex : 0;\n});\n\nconst rootClasses = computed(() => [\n  't-steps',\n  `t-steps--${props.size}`,\n  `t-steps--${props.orientation}`,\n  {\n    'is-interactive': props.interactive,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst resolveStatus = (item: TStepItem, index: number): TStepStatus => {\n  if (item.status) {\n    return item.status;\n  }\n\n  if (index < currentIndex.value) {\n    return 'complete';\n  }\n\n  if (index === currentIndex.value) {\n    return 'current';\n  }\n\n  return 'upcoming';\n};\n\nconst selectStep = (item: TStepItem) => {\n  if (!props.interactive || item.disabled) {\n    return;\n  }\n\n  if (props.modelValue === undefined) {\n    internalValue.value = item.value;\n  }\n\n  emit('update:modelValue', item.value);\n};\n\nwatch(\n  () => props.items,\n  (items) => {\n    const hasCurrentItem = items.some((item) => item.value === activeValue.value);\n\n    if (!hasCurrentItem && items[0] && props.modelValue === undefined) {\n      internalValue.value = items[0].value;\n    }\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <ol\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <li\n      v-for=\"(item, index) in items\"\n      :key=\"item.value\"\n      class=\"t-steps__item\"\n      :class=\"`is-${resolveStatus(item, index)}`\"\n    >\n      <button\n        type=\"button\"\n        class=\"t-steps__button\"\n        :class=\"{\n          'is-current': resolveStatus(item, index) === 'current',\n          'is-disabled': item.disabled,\n        }\"\n        :disabled=\"!interactive || item.disabled\"\n        :aria-current=\"resolveStatus(item, index) === 'current' ? 'step' : undefined\"\n        @click=\"selectStep(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :index=\"index\"\n          :status=\"resolveStatus(item, index)\"\n          :current=\"resolveStatus(item, index) === 'current'\"\n        >\n          <span\n            class=\"t-steps__indicator\"\n            aria-hidden=\"true\"\n          >\n            <CheckIcon\n              v-if=\"resolveStatus(item, index) === 'complete'\"\n              v-bind=\"treeIconDefaults\"\n            />\n            <span v-else-if=\"resolveStatus(item, index) === 'error'\">!</span>\n            <span v-else>{{ index + 1 }}</span>\n          </span>\n\n          <span class=\"t-steps__copy\">\n            <span class=\"t-steps__label\">{{ item.label }}</span>\n            <span\n              v-if=\"item.description\"\n              class=\"t-steps__description\"\n            >\n              {{ item.description }}\n            </span>\n          </span>\n\n          <span\n            v-if=\"item.meta\"\n            class=\"t-steps__meta\"\n          >\n            {{ item.meta }}\n          </span>\n        </slot>\n      </button>\n    </li>\n  </ol>\n</template>\n"],"mappings":""}

package/dist/components/TSteps.vue_vue_type_script_setup_true_lang.cjs

@@ -1,2 +1,2 @@
-let e=require("vue"),t=require("@treeui/icons");var n=[`disabled`,`aria-current`,`onClick`],r={class:`t-steps__indicator`,"aria-hidden":`true`},i={key:1},a={key:2},o={class:`t-steps__copy`},s={class:`t-steps__label`},c={key:0,class:`t-steps__description`},l={key:0,class:`t-steps__meta`},u=(0,e.defineComponent)({inheritAttrs:!1,__name:`TSteps`,props:{modelValue:{default:void 0},defaultValue:{default:``},items:{default:()=>[]},size:{default:`md`},orientation:{default:`horizontal`},interactive:{type:Boolean,default:!1}},emits:[`update:modelValue`],setup(u,{emit:d}){let f=(0,t.getTreeIcon)(`check`),p=u,m=d,h=(0,e.useAttrs)(),g=(0,e.ref)(p.defaultValue||p.items[0]?.value||``),_=(0,e.computed)(()=>p.modelValue??g.value),v=(0,e.computed)(()=>{let e=p.items.findIndex(e=>e.value===_.value);return e>=0?e:0}),y=(0,e.computed)(()=>[`t-steps`,`t-steps--${p.size}`,`t-steps--${p.orientation}`,{"is-interactive":p.interactive},h.class]),b=(0,e.computed)(()=>h.style),x=(0,e.computed)(()=>{let{class:e,style:t,...n}=h;return n}),S=(e,t)=>e.status?e.status:t<v.value?`complete`:t===v.value?`current`:`upcoming`,C=e=>{!p.interactive||e.disabled||(p.modelValue===void 0&&(g.value=e.value),m(`update:modelValue`,e.value))};return(0,e.watch)(()=>p.items,e=>{!e.some(e=>e.value===_.value)&&e[0]&&p.modelValue===void 0&&(g.value=e[0].value)},{deep:!0}),(d,p)=>((0,e.openBlock)(),(0,e.createElementBlock)(`ol`,(0,e.mergeProps)(x.value,{class:y.value,style:b.value}),[((0,e.openBlock)(!0),(0,e.createElementBlock)(e.Fragment,null,(0,e.renderList)(u.items,(p,m)=>((0,e.openBlock)(),(0,e.createElementBlock)(`li`,{key:p.value,class:(0,e.normalizeClass)([`t-steps__item`,`is-${S(p,m)}`])},[(0,e.createElementVNode)(`button`,{type:`button`,class:(0,e.normalizeClass)([`t-steps__button`,{"is-current":S(p,m)===`current`,"is-disabled":p.disabled}]),disabled:!u.interactive||p.disabled,"aria-current":S(p,m)===`current`?`step`:void 0,onClick:e=>C(p)},[(0,e.renderSlot)(d.$slots,`item`,{item:p,index:m,status:S(p,m),current:S(p,m)===`current`},()=>[(0,e.createElementVNode)(`span`,r,[S(p,m)===`complete`?((0,e.openBlock)(),(0,e.createBlock)((0,e.unref)(f),(0,e.mergeProps)({key:0,ref_for:!0},(0,e.unref)(t.treeIconDefaults)),null,16)):S(p,m)===`error`?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,i,`!`)):((0,e.openBlock)(),(0,e.createElementBlock)(`span`,a,(0,e.toDisplayString)(m+1),1))]),(0,e.createElementVNode)(`span`,o,[(0,e.createElementVNode)(`span`,s,(0,e.toDisplayString)(p.label),1),p.description?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,c,(0,e.toDisplayString)(p.description),1)):(0,e.createCommentVNode)(``,!0)]),p.meta?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,l,(0,e.toDisplayString)(p.meta),1)):(0,e.createCommentVNode)(``,!0)])],10,n)],2))),128))],16))}});exports.default=u;
+let e=require("vue"),t=require("@treeui/icons");var n=[`disabled`,`aria-current`,`onClick`],r={class:`t-steps__indicator`,"aria-hidden":`true`},i={key:1},a={key:2},o={class:`t-steps__copy`},s={class:`t-steps__label`},c={key:0,class:`t-steps__description`},l={key:0,class:`t-steps__meta`},u=(0,e.defineComponent)({inheritAttrs:!1,__name:`TSteps`,props:{modelValue:{default:void 0},defaultValue:{default:``},items:{default:()=>[]},size:{default:`md`},orientation:{default:`horizontal`},interactive:{type:Boolean,default:!1}},emits:[`update:modelValue`],setup(u,{emit:d}){let f=(0,e.computed)(()=>(0,t.getTreeIcon)(`check`)),p=u,m=d,h=(0,e.useAttrs)(),g=(0,e.ref)(p.defaultValue||p.items[0]?.value||``),_=(0,e.computed)(()=>p.modelValue??g.value),v=(0,e.computed)(()=>{let e=p.items.findIndex(e=>e.value===_.value);return e>=0?e:0}),y=(0,e.computed)(()=>[`t-steps`,`t-steps--${p.size}`,`t-steps--${p.orientation}`,{"is-interactive":p.interactive},h.class]),b=(0,e.computed)(()=>h.style),x=(0,e.computed)(()=>{let{class:e,style:t,...n}=h;return n}),S=(e,t)=>e.status?e.status:t<v.value?`complete`:t===v.value?`current`:`upcoming`,C=e=>{!p.interactive||e.disabled||(p.modelValue===void 0&&(g.value=e.value),m(`update:modelValue`,e.value))};return(0,e.watch)(()=>p.items,e=>{!e.some(e=>e.value===_.value)&&e[0]&&p.modelValue===void 0&&(g.value=e[0].value)},{deep:!0}),(d,p)=>((0,e.openBlock)(),(0,e.createElementBlock)(`ol`,(0,e.mergeProps)(x.value,{class:y.value,style:b.value}),[((0,e.openBlock)(!0),(0,e.createElementBlock)(e.Fragment,null,(0,e.renderList)(u.items,(p,m)=>((0,e.openBlock)(),(0,e.createElementBlock)(`li`,{key:p.value,class:(0,e.normalizeClass)([`t-steps__item`,`is-${S(p,m)}`])},[(0,e.createElementVNode)(`button`,{type:`button`,class:(0,e.normalizeClass)([`t-steps__button`,{"is-current":S(p,m)===`current`,"is-disabled":p.disabled}]),disabled:!u.interactive||p.disabled,"aria-current":S(p,m)===`current`?`step`:void 0,onClick:e=>C(p)},[(0,e.renderSlot)(d.$slots,`item`,{item:p,index:m,status:S(p,m),current:S(p,m)===`current`},()=>[(0,e.createElementVNode)(`span`,r,[S(p,m)===`complete`?((0,e.openBlock)(),(0,e.createBlock)((0,e.unref)(f),(0,e.mergeProps)({key:0,ref_for:!0},(0,e.unref)(t.treeIconDefaults)),null,16)):S(p,m)===`error`?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,i,`!`)):((0,e.openBlock)(),(0,e.createElementBlock)(`span`,a,(0,e.toDisplayString)(m+1),1))]),(0,e.createElementVNode)(`span`,o,[(0,e.createElementVNode)(`span`,s,(0,e.toDisplayString)(p.label),1),p.description?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,c,(0,e.toDisplayString)(p.description),1)):(0,e.createCommentVNode)(``,!0)]),p.meta?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,l,(0,e.toDisplayString)(p.meta),1)):(0,e.createCommentVNode)(``,!0)])],10,n)],2))),128))],16))}});exports.default=u;
 //# sourceMappingURL=TSteps.vue_vue_type_script_setup_true_lang.cjs.map

package/dist/components/TSteps.vue_vue_type_script_setup_true_lang.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TSteps.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TSteps.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TStepItem {\n  label: string;\n  value: string;\n  description?: string;\n  meta?: string;\n  status?: TStepStatus;\n  disabled?: boolean;\n}\n\nconst _treeStepStatuses = ['complete', 'current', 'upcoming', 'error'] as const;\nconst _treeStepOrientations = ['horizontal', 'vertical'] as const;\n\nexport type TStepStatus = (typeof _treeStepStatuses)[number];\nexport type TStepOrientation = (typeof _treeStepOrientations)[number];\n\nconst CheckIcon = getTreeIcon('check');\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TStepItem[];\n    size?: TSize;\n    orientation?: TStepOrientation;\n    interactive?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    orientation: 'horizontal',\n    interactive: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TStepItem;\n    index: number;\n    status: TStepStatus;\n    current: boolean;\n  }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst internalValue = ref(props.defaultValue || props.items[0]?.value || '');\n\nconst activeValue = computed(() => props.modelValue ?? internalValue.value);\n\nconst currentIndex = computed(() => {\n  const activeIndex = props.items.findIndex((item) => item.value === activeValue.value);\n  return activeIndex >= 0 ? activeIndex : 0;\n});\n\nconst rootClasses = computed(() => [\n  't-steps',\n  `t-steps--${props.size}`,\n  `t-steps--${props.orientation}`,\n  {\n    'is-interactive': props.interactive,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst resolveStatus = (item: TStepItem, index: number): TStepStatus => {\n  if (item.status) {\n    return item.status;\n  }\n\n  if (index < currentIndex.value) {\n    return 'complete';\n  }\n\n  if (index === currentIndex.value) {\n    return 'current';\n  }\n\n  return 'upcoming';\n};\n\nconst selectStep = (item: TStepItem) => {\n  if (!props.interactive || item.disabled) {\n    return;\n  }\n\n  if (props.modelValue === undefined) {\n    internalValue.value = item.value;\n  }\n\n  emit('update:modelValue', item.value);\n};\n\nwatch(\n  () => props.items,\n  (items) => {\n    const hasCurrentItem = items.some((item) => item.value === activeValue.value);\n\n    if (!hasCurrentItem && items[0] && props.modelValue === undefined) {\n      internalValue.value = items[0].value;\n    }\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <ol\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <li\n      v-for=\"(item, index) in items\"\n      :key=\"item.value\"\n      class=\"t-steps__item\"\n      :class=\"`is-${resolveStatus(item, index)}`\"\n    >\n      <button\n        type=\"button\"\n        class=\"t-steps__button\"\n        :class=\"{\n          'is-current': resolveStatus(item, index) === 'current',\n          'is-disabled': item.disabled,\n        }\"\n        :disabled=\"!interactive || item.disabled\"\n        :aria-current=\"resolveStatus(item, index) === 'current' ? 'step' : undefined\"\n        @click=\"selectStep(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :index=\"index\"\n          :status=\"resolveStatus(item, index)\"\n          :current=\"resolveStatus(item, index) === 'current'\"\n        >\n          <span\n            class=\"t-steps__indicator\"\n            aria-hidden=\"true\"\n          >\n            <CheckIcon\n              v-if=\"resolveStatus(item, index) === 'complete'\"\n              v-bind=\"treeIconDefaults\"\n            />\n            <span v-else-if=\"resolveStatus(item, index) === 'error'\">!</span>\n            <span v-else>{{ index + 1 }}</span>\n          </span>\n\n          <span class=\"t-steps__copy\">\n            <span class=\"t-steps__label\">{{ item.label }}</span>\n            <span\n              v-if=\"item.description\"\n              class=\"t-steps__description\"\n            >\n              {{ item.description }}\n            </span>\n          </span>\n\n          <span\n            v-if=\"item.meta\"\n            class=\"t-steps__meta\"\n          >\n            {{ item.meta }}\n          </span>\n        </slot>\n      </button>\n    </li>\n  </ol>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"TSteps.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TSteps.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TStepItem {\n  label: string;\n  value: string;\n  description?: string;\n  meta?: string;\n  status?: TStepStatus;\n  disabled?: boolean;\n}\n\nconst _treeStepStatuses = ['complete', 'current', 'upcoming', 'error'] as const;\nconst _treeStepOrientations = ['horizontal', 'vertical'] as const;\n\nexport type TStepStatus = (typeof _treeStepStatuses)[number];\nexport type TStepOrientation = (typeof _treeStepOrientations)[number];\n\nconst CheckIcon = computed(() => getTreeIcon('check'));\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TStepItem[];\n    size?: TSize;\n    orientation?: TStepOrientation;\n    interactive?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    orientation: 'horizontal',\n    interactive: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TStepItem;\n    index: number;\n    status: TStepStatus;\n    current: boolean;\n  }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst internalValue = ref(props.defaultValue || props.items[0]?.value || '');\n\nconst activeValue = computed(() => props.modelValue ?? internalValue.value);\n\nconst currentIndex = computed(() => {\n  const activeIndex = props.items.findIndex((item) => item.value === activeValue.value);\n  return activeIndex >= 0 ? activeIndex : 0;\n});\n\nconst rootClasses = computed(() => [\n  't-steps',\n  `t-steps--${props.size}`,\n  `t-steps--${props.orientation}`,\n  {\n    'is-interactive': props.interactive,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst resolveStatus = (item: TStepItem, index: number): TStepStatus => {\n  if (item.status) {\n    return item.status;\n  }\n\n  if (index < currentIndex.value) {\n    return 'complete';\n  }\n\n  if (index === currentIndex.value) {\n    return 'current';\n  }\n\n  return 'upcoming';\n};\n\nconst selectStep = (item: TStepItem) => {\n  if (!props.interactive || item.disabled) {\n    return;\n  }\n\n  if (props.modelValue === undefined) {\n    internalValue.value = item.value;\n  }\n\n  emit('update:modelValue', item.value);\n};\n\nwatch(\n  () => props.items,\n  (items) => {\n    const hasCurrentItem = items.some((item) => item.value === activeValue.value);\n\n    if (!hasCurrentItem && items[0] && props.modelValue === undefined) {\n      internalValue.value = items[0].value;\n    }\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <ol\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <li\n      v-for=\"(item, index) in items\"\n      :key=\"item.value\"\n      class=\"t-steps__item\"\n      :class=\"`is-${resolveStatus(item, index)}`\"\n    >\n      <button\n        type=\"button\"\n        class=\"t-steps__button\"\n        :class=\"{\n          'is-current': resolveStatus(item, index) === 'current',\n          'is-disabled': item.disabled,\n        }\"\n        :disabled=\"!interactive || item.disabled\"\n        :aria-current=\"resolveStatus(item, index) === 'current' ? 'step' : undefined\"\n        @click=\"selectStep(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :index=\"index\"\n          :status=\"resolveStatus(item, index)\"\n          :current=\"resolveStatus(item, index) === 'current'\"\n        >\n          <span\n            class=\"t-steps__indicator\"\n            aria-hidden=\"true\"\n          >\n            <CheckIcon\n              v-if=\"resolveStatus(item, index) === 'complete'\"\n              v-bind=\"treeIconDefaults\"\n            />\n            <span v-else-if=\"resolveStatus(item, index) === 'error'\">!</span>\n            <span v-else>{{ index + 1 }}</span>\n          </span>\n\n          <span class=\"t-steps__copy\">\n            <span class=\"t-steps__label\">{{ item.label }}</span>\n            <span\n              v-if=\"item.description\"\n              class=\"t-steps__description\"\n            >\n              {{ item.description }}\n            </span>\n          </span>\n\n          <span\n            v-if=\"item.meta\"\n            class=\"t-steps__meta\"\n          >\n            {{ item.meta }}\n          </span>\n        </slot>\n      </button>\n    </li>\n  </ol>\n</template>\n"],"mappings":"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"}

package/dist/components/TSteps.vue_vue_type_script_setup_true_lang.js

@@ -30,7 +30,7 @@ var y = [
 	},
 	emits: ["update:modelValue"],
 	setup(o, { emit: D }) {
-		let O = _("check"), k = o, A = D, j = h(), M = u(k.defaultValue || k.items[0]?.value || ""), N = t(() => k.modelValue ?? M.value), P = t(() => {
+		let O = t(() => _("check")), k = o, A = D, j = h(), M = u(k.defaultValue || k.items[0]?.value || ""), N = t(() => k.modelValue ?? M.value), P = t(() => {
 			let e = k.items.findIndex((e) => e.value === N.value);
 			return e >= 0 ? e : 0;
 		}), F = t(() => [

package/dist/components/TSteps.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"TSteps.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../src/components/TSteps.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TStepItem {\n  label: string;\n  value: string;\n  description?: string;\n  meta?: string;\n  status?: TStepStatus;\n  disabled?: boolean;\n}\n\nconst _treeStepStatuses = ['complete', 'current', 'upcoming', 'error'] as const;\nconst _treeStepOrientations = ['horizontal', 'vertical'] as const;\n\nexport type TStepStatus = (typeof _treeStepStatuses)[number];\nexport type TStepOrientation = (typeof _treeStepOrientations)[number];\n\nconst CheckIcon = getTreeIcon('check');\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TStepItem[];\n    size?: TSize;\n    orientation?: TStepOrientation;\n    interactive?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    orientation: 'horizontal',\n    interactive: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TStepItem;\n    index: number;\n    status: TStepStatus;\n    current: boolean;\n  }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst internalValue = ref(props.defaultValue || props.items[0]?.value || '');\n\nconst activeValue = computed(() => props.modelValue ?? internalValue.value);\n\nconst currentIndex = computed(() => {\n  const activeIndex = props.items.findIndex((item) => item.value === activeValue.value);\n  return activeIndex >= 0 ? activeIndex : 0;\n});\n\nconst rootClasses = computed(() => [\n  't-steps',\n  `t-steps--${props.size}`,\n  `t-steps--${props.orientation}`,\n  {\n    'is-interactive': props.interactive,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst resolveStatus = (item: TStepItem, index: number): TStepStatus => {\n  if (item.status) {\n    return item.status;\n  }\n\n  if (index < currentIndex.value) {\n    return 'complete';\n  }\n\n  if (index === currentIndex.value) {\n    return 'current';\n  }\n\n  return 'upcoming';\n};\n\nconst selectStep = (item: TStepItem) => {\n  if (!props.interactive || item.disabled) {\n    return;\n  }\n\n  if (props.modelValue === undefined) {\n    internalValue.value = item.value;\n  }\n\n  emit('update:modelValue', item.value);\n};\n\nwatch(\n  () => props.items,\n  (items) => {\n    const hasCurrentItem = items.some((item) => item.value === activeValue.value);\n\n    if (!hasCurrentItem && items[0] && props.modelValue === undefined) {\n      internalValue.value = items[0].value;\n    }\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <ol\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <li\n      v-for=\"(item, index) in items\"\n      :key=\"item.value\"\n      class=\"t-steps__item\"\n      :class=\"`is-${resolveStatus(item, index)}`\"\n    >\n      <button\n        type=\"button\"\n        class=\"t-steps__button\"\n        :class=\"{\n          'is-current': resolveStatus(item, index) === 'current',\n          'is-disabled': item.disabled,\n        }\"\n        :disabled=\"!interactive || item.disabled\"\n        :aria-current=\"resolveStatus(item, index) === 'current' ? 'step' : undefined\"\n        @click=\"selectStep(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :index=\"index\"\n          :status=\"resolveStatus(item, index)\"\n          :current=\"resolveStatus(item, index) === 'current'\"\n        >\n          <span\n            class=\"t-steps__indicator\"\n            aria-hidden=\"true\"\n          >\n            <CheckIcon\n              v-if=\"resolveStatus(item, index) === 'complete'\"\n              v-bind=\"treeIconDefaults\"\n            />\n            <span v-else-if=\"resolveStatus(item, index) === 'error'\">!</span>\n            <span v-else>{{ index + 1 }}</span>\n          </span>\n\n          <span class=\"t-steps__copy\">\n            <span class=\"t-steps__label\">{{ item.label }}</span>\n            <span\n              v-if=\"item.description\"\n              class=\"t-steps__description\"\n            >\n              {{ item.description }}\n            </span>\n          </span>\n\n          <span\n            v-if=\"item.meta\"\n            class=\"t-steps__meta\"\n          >\n            {{ item.meta }}\n          </span>\n        </slot>\n      </button>\n    </li>\n  </ol>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwBA,IAAM,IAAY,EAAY,OAAO,GAE/B,IAAQ,GAmBR,IAAO,GAaP,IAAQ,EAAS,GACjB,IAAgB,EAAI,EAAM,gBAAgB,EAAM,MAAM,EAAE,EAAE,SAAS,EAAE,GAErE,IAAc,QAAe,EAAM,cAAc,EAAc,KAAK,GAEpE,IAAe,QAAe;GAClC,IAAM,IAAc,EAAM,MAAM,WAAW,MAAS,EAAK,UAAU,EAAY,KAAK;GACpF,OAAO,KAAe,IAAI,IAAc;EAC1C,CAAC,GAEK,IAAc,QAAe;GACjC;GACA,YAAY,EAAM;GAClB,YAAY,EAAM;GAClB,EACE,kBAAkB,EAAM,YAC1B;GACA,EAAM;EACR,CAAC,GAEK,IAAY,QAAe,EAAM,KAAK,GAEtC,IAAY,QAAe;GAC/B,IAAM,EAAE,OAAO,GAAQ,OAAO,GAAQ,GAAG,MAAS;GAClD,OAAO;EACT,CAAC,GAEK,KAAiB,GAAiB,MAClC,EAAK,SACA,EAAK,SAGV,IAAQ,EAAa,QAChB,aAGL,MAAU,EAAa,QAClB,YAGF,YAGH,KAAc,MAAoB;GAClC,CAAC,EAAM,eAAe,EAAK,aAI3B,EAAM,eAAe,KAAA,MACvB,EAAc,QAAQ,EAAK,QAG7B,EAAK,qBAAqB,EAAK,KAAK;EACtC;SAEA,QACQ,EAAM,QACX,MAAU;GAGT,AAAI,CAFmB,EAAM,MAAM,MAAS,EAAK,UAAU,EAAY,KAElE,KAAkB,EAAM,MAAM,EAAM,eAAe,KAAA,MACtD,EAAc,QAAQ,EAAM,EAAE,CAAC;EAEnC,GACA,EAAE,MAAM,GAAK,CACf,mBAIE,EA4DK,MA5DL,EACU,EA2DL,OA3Dc;GAChB,OAAO,EAAA;GACP,OAAO,EAAA;eAER,EAsDK,GAAA,MAAA,EArDqB,EAAA,QAAhB,GAAM,YADhB,EAsDK,MAAA;GApDF,KAAK,EAAK;GACX,OAAK,EAAA,CAAC,iBAAe,MACP,EAAc,GAAM,CAAK,GAAA,CAAA;MAEvC,EA+CS,UAAA;GA9CP,MAAK;GACL,OAAK,EAAA,CAAC,mBAAiB;kBACW,EAAc,GAAM,CAAK,MAAA;mBAA0C,EAAK;;GAIzG,UAAQ,CAAG,EAAA,eAAe,EAAK;GAC/B,gBAAc,EAAc,GAAM,CAAK,MAAA,YAAA,SAA2B,KAAA;GAClE,UAAK,MAAE,EAAW,CAAI;MAEvB,EAmCO,EAAA,QAAA,QAAA;GAjCE;GACC;GACP,QAAQ,EAAc,GAAM,CAAK;GACjC,SAAS,EAAc,GAAM,CAAK,MAAA;WA8B9B;GA5BL,EAUO,QAVP,GAUO,CALG,EAAc,GAAM,CAAK,MAAA,cAAA,EAAA,GADjC,EAGE,EAAA,CAAA,GAHF,EAGE;;;MADQ,EAAA,CAAA,CAAgB,GAAA,MAAA,EAAA,KAET,EAAc,GAAM,CAAK,MAAA,WAAA,EAAA,GAA1C,EAAiE,QAAA,GAAR,GAAC,MAAA,EAAA,GAC1D,EAAmC,QAAA,GAAA,EAAnB,IAAK,CAAA,GAAA,CAAA,EAAA,CAAA;GAGvB,EAQO,QARP,GAQO,CAPL,EAAoD,QAApD,GAAoD,EAApB,EAAK,KAAK,GAAA,CAAA,GAElC,EAAK,eAAA,EAAA,GADb,EAKO,QALP,GAKO,EADF,EAAK,WAAW,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA;GAKf,EAAK,QAAA,EAAA,GADb,EAKO,QALP,GAKO,EADF,EAAK,IAAI,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}
+{"version":3,"file":"TSteps.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../src/components/TSteps.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TStepItem {\n  label: string;\n  value: string;\n  description?: string;\n  meta?: string;\n  status?: TStepStatus;\n  disabled?: boolean;\n}\n\nconst _treeStepStatuses = ['complete', 'current', 'upcoming', 'error'] as const;\nconst _treeStepOrientations = ['horizontal', 'vertical'] as const;\n\nexport type TStepStatus = (typeof _treeStepStatuses)[number];\nexport type TStepOrientation = (typeof _treeStepOrientations)[number];\n\nconst CheckIcon = computed(() => getTreeIcon('check'));\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TStepItem[];\n    size?: TSize;\n    orientation?: TStepOrientation;\n    interactive?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    orientation: 'horizontal',\n    interactive: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TStepItem;\n    index: number;\n    status: TStepStatus;\n    current: boolean;\n  }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst internalValue = ref(props.defaultValue || props.items[0]?.value || '');\n\nconst activeValue = computed(() => props.modelValue ?? internalValue.value);\n\nconst currentIndex = computed(() => {\n  const activeIndex = props.items.findIndex((item) => item.value === activeValue.value);\n  return activeIndex >= 0 ? activeIndex : 0;\n});\n\nconst rootClasses = computed(() => [\n  't-steps',\n  `t-steps--${props.size}`,\n  `t-steps--${props.orientation}`,\n  {\n    'is-interactive': props.interactive,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst rootAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst resolveStatus = (item: TStepItem, index: number): TStepStatus => {\n  if (item.status) {\n    return item.status;\n  }\n\n  if (index < currentIndex.value) {\n    return 'complete';\n  }\n\n  if (index === currentIndex.value) {\n    return 'current';\n  }\n\n  return 'upcoming';\n};\n\nconst selectStep = (item: TStepItem) => {\n  if (!props.interactive || item.disabled) {\n    return;\n  }\n\n  if (props.modelValue === undefined) {\n    internalValue.value = item.value;\n  }\n\n  emit('update:modelValue', item.value);\n};\n\nwatch(\n  () => props.items,\n  (items) => {\n    const hasCurrentItem = items.some((item) => item.value === activeValue.value);\n\n    if (!hasCurrentItem && items[0] && props.modelValue === undefined) {\n      internalValue.value = items[0].value;\n    }\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <ol\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <li\n      v-for=\"(item, index) in items\"\n      :key=\"item.value\"\n      class=\"t-steps__item\"\n      :class=\"`is-${resolveStatus(item, index)}`\"\n    >\n      <button\n        type=\"button\"\n        class=\"t-steps__button\"\n        :class=\"{\n          'is-current': resolveStatus(item, index) === 'current',\n          'is-disabled': item.disabled,\n        }\"\n        :disabled=\"!interactive || item.disabled\"\n        :aria-current=\"resolveStatus(item, index) === 'current' ? 'step' : undefined\"\n        @click=\"selectStep(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :index=\"index\"\n          :status=\"resolveStatus(item, index)\"\n          :current=\"resolveStatus(item, index) === 'current'\"\n        >\n          <span\n            class=\"t-steps__indicator\"\n            aria-hidden=\"true\"\n          >\n            <CheckIcon\n              v-if=\"resolveStatus(item, index) === 'complete'\"\n              v-bind=\"treeIconDefaults\"\n            />\n            <span v-else-if=\"resolveStatus(item, index) === 'error'\">!</span>\n            <span v-else>{{ index + 1 }}</span>\n          </span>\n\n          <span class=\"t-steps__copy\">\n            <span class=\"t-steps__label\">{{ item.label }}</span>\n            <span\n              v-if=\"item.description\"\n              class=\"t-steps__description\"\n            >\n              {{ item.description }}\n            </span>\n          </span>\n\n          <span\n            v-if=\"item.meta\"\n            class=\"t-steps__meta\"\n          >\n            {{ item.meta }}\n          </span>\n        </slot>\n      </button>\n    </li>\n  </ol>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwBA,IAAM,IAAY,QAAe,EAAY,OAAO,CAAC,GAE/C,IAAQ,GAmBR,IAAO,GAaP,IAAQ,EAAS,GACjB,IAAgB,EAAI,EAAM,gBAAgB,EAAM,MAAM,EAAE,EAAE,SAAS,EAAE,GAErE,IAAc,QAAe,EAAM,cAAc,EAAc,KAAK,GAEpE,IAAe,QAAe;GAClC,IAAM,IAAc,EAAM,MAAM,WAAW,MAAS,EAAK,UAAU,EAAY,KAAK;GACpF,OAAO,KAAe,IAAI,IAAc;EAC1C,CAAC,GAEK,IAAc,QAAe;GACjC;GACA,YAAY,EAAM;GAClB,YAAY,EAAM;GAClB,EACE,kBAAkB,EAAM,YAC1B;GACA,EAAM;EACR,CAAC,GAEK,IAAY,QAAe,EAAM,KAAK,GAEtC,IAAY,QAAe;GAC/B,IAAM,EAAE,OAAO,GAAQ,OAAO,GAAQ,GAAG,MAAS;GAClD,OAAO;EACT,CAAC,GAEK,KAAiB,GAAiB,MAClC,EAAK,SACA,EAAK,SAGV,IAAQ,EAAa,QAChB,aAGL,MAAU,EAAa,QAClB,YAGF,YAGH,KAAc,MAAoB;GAClC,CAAC,EAAM,eAAe,EAAK,aAI3B,EAAM,eAAe,KAAA,MACvB,EAAc,QAAQ,EAAK,QAG7B,EAAK,qBAAqB,EAAK,KAAK;EACtC;SAEA,QACQ,EAAM,QACX,MAAU;GAGT,AAAI,CAFmB,EAAM,MAAM,MAAS,EAAK,UAAU,EAAY,KAElE,KAAkB,EAAM,MAAM,EAAM,eAAe,KAAA,MACtD,EAAc,QAAQ,EAAM,EAAE,CAAC;EAEnC,GACA,EAAE,MAAM,GAAK,CACf,mBAIE,EA4DK,MA5DL,EACU,EA2DL,OA3Dc;GAChB,OAAO,EAAA;GACP,OAAO,EAAA;eAER,EAsDK,GAAA,MAAA,EArDqB,EAAA,QAAhB,GAAM,YADhB,EAsDK,MAAA;GApDF,KAAK,EAAK;GACX,OAAK,EAAA,CAAC,iBAAe,MACP,EAAc,GAAM,CAAK,GAAA,CAAA;MAEvC,EA+CS,UAAA;GA9CP,MAAK;GACL,OAAK,EAAA,CAAC,mBAAiB;kBACW,EAAc,GAAM,CAAK,MAAA;mBAA0C,EAAK;;GAIzG,UAAQ,CAAG,EAAA,eAAe,EAAK;GAC/B,gBAAc,EAAc,GAAM,CAAK,MAAA,YAAA,SAA2B,KAAA;GAClE,UAAK,MAAE,EAAW,CAAI;MAEvB,EAmCO,EAAA,QAAA,QAAA;GAjCE;GACC;GACP,QAAQ,EAAc,GAAM,CAAK;GACjC,SAAS,EAAc,GAAM,CAAK,MAAA;WA8B9B;GA5BL,EAUO,QAVP,GAUO,CALG,EAAc,GAAM,CAAK,MAAA,cAAA,EAAA,GADjC,EAGE,EAAA,CAAA,GAHF,EAGE;;;MADQ,EAAA,CAAA,CAAgB,GAAA,MAAA,EAAA,KAET,EAAc,GAAM,CAAK,MAAA,WAAA,EAAA,GAA1C,EAAiE,QAAA,GAAR,GAAC,MAAA,EAAA,GAC1D,EAAmC,QAAA,GAAA,EAAnB,IAAK,CAAA,GAAA,CAAA,EAAA,CAAA;GAGvB,EAQO,QARP,GAQO,CAPL,EAAoD,QAApD,GAAoD,EAApB,EAAK,KAAK,GAAA,CAAA,GAElC,EAAK,eAAA,EAAA,GADb,EAKO,QALP,GAKO,EADF,EAAK,WAAW,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA;GAKf,EAAK,QAAA,EAAA,GADb,EAKO,QALP,GAKO,EADF,EAAK,IAAI,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}

package/dist/components/TToast.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TToast.cjs","names":[],"sources":["../../src/components/TToast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId } from '@treeui/utils';\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed } from 'vue';\nimport type { ToastItem } from '../composables/useToast';\n\nconst XIcon = getTreeIcon('x');\n\nconst iconMap = {\n  info: getTreeIcon('info'),\n  success: getTreeIcon('check'),\n  warning: getTreeIcon('alert-circle'),\n  danger: getTreeIcon('alert-circle'),\n} as const;\n\nconst props = withDefaults(\n  defineProps<{\n    toast: ToastItem;\n  }>(),\n  {},\n);\n\nconst emit = defineEmits<{\n  close: [id: string];\n}>();\n\nconst toastId = createId('t-toast-item');\nconst titleId = `${toastId}-title`;\nconst descriptionId = `${toastId}-description`;\n\nconst classes = computed(() => [\n  't-toast',\n  `t-toast--${props.toast.variant}`,\n]);\n\nconst StatusIcon = computed(() => iconMap[props.toast.variant]);\n\nfunction handleClose() {\n  emit('close', props.toast.id);\n}\n</script>\n\n<template>\n  <div\n    :class=\"classes\"\n    role=\"status\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"toast.description ? descriptionId : undefined\"\n  >\n    <span\n      class=\"t-toast__icon\"\n      aria-hidden=\"true\"\n    >\n      <StatusIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"18\"\n      />\n    </span>\n    <div class=\"t-toast__content\">\n      <p\n        :id=\"titleId\"\n        class=\"t-toast__title\"\n      >\n        {{ toast.title }}\n      </p>\n      <p\n        v-if=\"toast.description\"\n        :id=\"descriptionId\"\n        class=\"t-toast__description\"\n      >\n        {{ toast.description }}\n      </p>\n    </div>\n    <button\n      v-if=\"toast.closable\"\n      type=\"button\"\n      class=\"t-toast__close\"\n      aria-label=\"Dismiss notification\"\n      @click=\"handleClose\"\n    >\n      <XIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"16\"\n      />\n    </button>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"TToast.cjs","names":[],"sources":["../../src/components/TToast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId } from '@treeui/utils';\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed } from 'vue';\nimport type { ToastItem } from '../composables/useToast';\n\nconst XIcon = computed(() => getTreeIcon('x'));\n\n// Resolved per render, not once at setup: an application that replaces one of\n// these built-ins gets the replacement in toasts that are already mounted.\nconst VARIANT_ICONS = {\n  info: 'info',\n  success: 'check',\n  warning: 'alert-circle',\n  danger: 'alert-circle',\n} as const;\n\nconst props = withDefaults(\n  defineProps<{\n    toast: ToastItem;\n  }>(),\n  {},\n);\n\nconst emit = defineEmits<{\n  close: [id: string];\n}>();\n\nconst toastId = createId('t-toast-item');\nconst titleId = `${toastId}-title`;\nconst descriptionId = `${toastId}-description`;\n\nconst classes = computed(() => [\n  't-toast',\n  `t-toast--${props.toast.variant}`,\n]);\n\nconst StatusIcon = computed(() => getTreeIcon(VARIANT_ICONS[props.toast.variant]));\n\nfunction handleClose() {\n  emit('close', props.toast.id);\n}\n</script>\n\n<template>\n  <div\n    :class=\"classes\"\n    role=\"status\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"toast.description ? descriptionId : undefined\"\n  >\n    <span\n      class=\"t-toast__icon\"\n      aria-hidden=\"true\"\n    >\n      <StatusIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"18\"\n      />\n    </span>\n    <div class=\"t-toast__content\">\n      <p\n        :id=\"titleId\"\n        class=\"t-toast__title\"\n      >\n        {{ toast.title }}\n      </p>\n      <p\n        v-if=\"toast.description\"\n        :id=\"descriptionId\"\n        class=\"t-toast__description\"\n      >\n        {{ toast.description }}\n      </p>\n    </div>\n    <button\n      v-if=\"toast.closable\"\n      type=\"button\"\n      class=\"t-toast__close\"\n      aria-label=\"Dismiss notification\"\n      @click=\"handleClose\"\n    >\n      <XIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"16\"\n      />\n    </button>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/TToast.js.map

@@ -1 +1 @@
-{"version":3,"file":"TToast.js","names":[],"sources":["../../src/components/TToast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId } from '@treeui/utils';\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed } from 'vue';\nimport type { ToastItem } from '../composables/useToast';\n\nconst XIcon = getTreeIcon('x');\n\nconst iconMap = {\n  info: getTreeIcon('info'),\n  success: getTreeIcon('check'),\n  warning: getTreeIcon('alert-circle'),\n  danger: getTreeIcon('alert-circle'),\n} as const;\n\nconst props = withDefaults(\n  defineProps<{\n    toast: ToastItem;\n  }>(),\n  {},\n);\n\nconst emit = defineEmits<{\n  close: [id: string];\n}>();\n\nconst toastId = createId('t-toast-item');\nconst titleId = `${toastId}-title`;\nconst descriptionId = `${toastId}-description`;\n\nconst classes = computed(() => [\n  't-toast',\n  `t-toast--${props.toast.variant}`,\n]);\n\nconst StatusIcon = computed(() => iconMap[props.toast.variant]);\n\nfunction handleClose() {\n  emit('close', props.toast.id);\n}\n</script>\n\n<template>\n  <div\n    :class=\"classes\"\n    role=\"status\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"toast.description ? descriptionId : undefined\"\n  >\n    <span\n      class=\"t-toast__icon\"\n      aria-hidden=\"true\"\n    >\n      <StatusIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"18\"\n      />\n    </span>\n    <div class=\"t-toast__content\">\n      <p\n        :id=\"titleId\"\n        class=\"t-toast__title\"\n      >\n        {{ toast.title }}\n      </p>\n      <p\n        v-if=\"toast.description\"\n        :id=\"descriptionId\"\n        class=\"t-toast__description\"\n      >\n        {{ toast.description }}\n      </p>\n    </div>\n    <button\n      v-if=\"toast.closable\"\n      type=\"button\"\n      class=\"t-toast__close\"\n      aria-label=\"Dismiss notification\"\n      @click=\"handleClose\"\n    >\n      <XIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"16\"\n      />\n    </button>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"TToast.js","names":[],"sources":["../../src/components/TToast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId } from '@treeui/utils';\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed } from 'vue';\nimport type { ToastItem } from '../composables/useToast';\n\nconst XIcon = computed(() => getTreeIcon('x'));\n\n// Resolved per render, not once at setup: an application that replaces one of\n// these built-ins gets the replacement in toasts that are already mounted.\nconst VARIANT_ICONS = {\n  info: 'info',\n  success: 'check',\n  warning: 'alert-circle',\n  danger: 'alert-circle',\n} as const;\n\nconst props = withDefaults(\n  defineProps<{\n    toast: ToastItem;\n  }>(),\n  {},\n);\n\nconst emit = defineEmits<{\n  close: [id: string];\n}>();\n\nconst toastId = createId('t-toast-item');\nconst titleId = `${toastId}-title`;\nconst descriptionId = `${toastId}-description`;\n\nconst classes = computed(() => [\n  't-toast',\n  `t-toast--${props.toast.variant}`,\n]);\n\nconst StatusIcon = computed(() => getTreeIcon(VARIANT_ICONS[props.toast.variant]));\n\nfunction handleClose() {\n  emit('close', props.toast.id);\n}\n</script>\n\n<template>\n  <div\n    :class=\"classes\"\n    role=\"status\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"toast.description ? descriptionId : undefined\"\n  >\n    <span\n      class=\"t-toast__icon\"\n      aria-hidden=\"true\"\n    >\n      <StatusIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"18\"\n      />\n    </span>\n    <div class=\"t-toast__content\">\n      <p\n        :id=\"titleId\"\n        class=\"t-toast__title\"\n      >\n        {{ toast.title }}\n      </p>\n      <p\n        v-if=\"toast.description\"\n        :id=\"descriptionId\"\n        class=\"t-toast__description\"\n      >\n        {{ toast.description }}\n      </p>\n    </div>\n    <button\n      v-if=\"toast.closable\"\n      type=\"button\"\n      class=\"t-toast__close\"\n      aria-label=\"Dismiss notification\"\n      @click=\"handleClose\"\n    >\n      <XIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"16\"\n      />\n    </button>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/TToast.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TToast.vue.d.ts","sourceRoot":"","sources":["../../src/components/TToast.vue"],"names":[],"mappings":"AA4FA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAWzD,KAAK,WAAW,GAAG;IACf,KAAK,EAAE,SAAS,CAAC;CAClB,CAAC;;;;;;AA6HJ,wBASG"}
+{"version":3,"file":"TToast.vue.d.ts","sourceRoot":"","sources":["../../src/components/TToast.vue"],"names":[],"mappings":"AA8FA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAazD,KAAK,WAAW,GAAG;IACf,KAAK,EAAE,SAAS,CAAC;CAClB,CAAC;;;;;;AA6HJ,wBASG"}

package/dist/components/TToast.vue_vue_type_script_setup_true_lang.cjs

@@ -1,2 +1,2 @@
-let e=require("vue"),t=require("@treeui/utils"),n=require("@treeui/icons");var r=[`aria-describedby`],i={class:`t-toast__icon`,"aria-hidden":`true`},a={class:`t-toast__content`},o=(0,e.defineComponent)({__name:`TToast`,props:{toast:{}},emits:[`close`],setup(o,{emit:s}){let c=(0,n.getTreeIcon)(`x`),l={info:(0,n.getTreeIcon)(`info`),success:(0,n.getTreeIcon)(`check`),warning:(0,n.getTreeIcon)(`alert-circle`),danger:(0,n.getTreeIcon)(`alert-circle`)},u=o,d=s,f=(0,t.createId)(`t-toast-item`),p=`${f}-title`,m=`${f}-description`,h=(0,e.computed)(()=>[`t-toast`,`t-toast--${u.toast.variant}`]),g=(0,e.computed)(()=>l[u.toast.variant]);function _(){d(`close`,u.toast.id)}return(t,s)=>((0,e.openBlock)(),(0,e.createElementBlock)(`div`,{class:(0,e.normalizeClass)(h.value),role:`status`,"aria-labelledby":p,"aria-describedby":o.toast.description?m:void 0},[(0,e.createElementVNode)(`span`,i,[(0,e.createVNode)((0,e.unref)(g),(0,e.mergeProps)((0,e.unref)(n.treeIconDefaults),{size:18}),null,16)]),(0,e.createElementVNode)(`div`,a,[(0,e.createElementVNode)(`p`,{id:p,class:`t-toast__title`},(0,e.toDisplayString)(o.toast.title),1),o.toast.description?((0,e.openBlock)(),(0,e.createElementBlock)(`p`,{key:0,id:m,class:`t-toast__description`},(0,e.toDisplayString)(o.toast.description),1)):(0,e.createCommentVNode)(``,!0)]),o.toast.closable?((0,e.openBlock)(),(0,e.createElementBlock)(`button`,{key:0,type:`button`,class:`t-toast__close`,"aria-label":`Dismiss notification`,onClick:_},[(0,e.createVNode)((0,e.unref)(c),(0,e.mergeProps)((0,e.unref)(n.treeIconDefaults),{size:16}),null,16)])):(0,e.createCommentVNode)(``,!0)],10,r))}});exports.default=o;
+let e=require("vue"),t=require("@treeui/utils"),n=require("@treeui/icons");var r=[`aria-describedby`],i={class:`t-toast__icon`,"aria-hidden":`true`},a={class:`t-toast__content`},o=(0,e.defineComponent)({__name:`TToast`,props:{toast:{}},emits:[`close`],setup(o,{emit:s}){let c=(0,e.computed)(()=>(0,n.getTreeIcon)(`x`)),l={info:`info`,success:`check`,warning:`alert-circle`,danger:`alert-circle`},u=o,d=s,f=(0,t.createId)(`t-toast-item`),p=`${f}-title`,m=`${f}-description`,h=(0,e.computed)(()=>[`t-toast`,`t-toast--${u.toast.variant}`]),g=(0,e.computed)(()=>(0,n.getTreeIcon)(l[u.toast.variant]));function _(){d(`close`,u.toast.id)}return(t,s)=>((0,e.openBlock)(),(0,e.createElementBlock)(`div`,{class:(0,e.normalizeClass)(h.value),role:`status`,"aria-labelledby":p,"aria-describedby":o.toast.description?m:void 0},[(0,e.createElementVNode)(`span`,i,[(0,e.createVNode)((0,e.unref)(g),(0,e.mergeProps)((0,e.unref)(n.treeIconDefaults),{size:18}),null,16)]),(0,e.createElementVNode)(`div`,a,[(0,e.createElementVNode)(`p`,{id:p,class:`t-toast__title`},(0,e.toDisplayString)(o.toast.title),1),o.toast.description?((0,e.openBlock)(),(0,e.createElementBlock)(`p`,{key:0,id:m,class:`t-toast__description`},(0,e.toDisplayString)(o.toast.description),1)):(0,e.createCommentVNode)(``,!0)]),o.toast.closable?((0,e.openBlock)(),(0,e.createElementBlock)(`button`,{key:0,type:`button`,class:`t-toast__close`,"aria-label":`Dismiss notification`,onClick:_},[(0,e.createVNode)((0,e.unref)(c),(0,e.mergeProps)((0,e.unref)(n.treeIconDefaults),{size:16}),null,16)])):(0,e.createCommentVNode)(``,!0)],10,r))}});exports.default=o;
 //# sourceMappingURL=TToast.vue_vue_type_script_setup_true_lang.cjs.map

package/dist/components/TToast.vue_vue_type_script_setup_true_lang.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TToast.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TToast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId } from '@treeui/utils';\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed } from 'vue';\nimport type { ToastItem } from '../composables/useToast';\n\nconst XIcon = getTreeIcon('x');\n\nconst iconMap = {\n  info: getTreeIcon('info'),\n  success: getTreeIcon('check'),\n  warning: getTreeIcon('alert-circle'),\n  danger: getTreeIcon('alert-circle'),\n} as const;\n\nconst props = withDefaults(\n  defineProps<{\n    toast: ToastItem;\n  }>(),\n  {},\n);\n\nconst emit = defineEmits<{\n  close: [id: string];\n}>();\n\nconst toastId = createId('t-toast-item');\nconst titleId = `${toastId}-title`;\nconst descriptionId = `${toastId}-description`;\n\nconst classes = computed(() => [\n  't-toast',\n  `t-toast--${props.toast.variant}`,\n]);\n\nconst StatusIcon = computed(() => iconMap[props.toast.variant]);\n\nfunction handleClose() {\n  emit('close', props.toast.id);\n}\n</script>\n\n<template>\n  <div\n    :class=\"classes\"\n    role=\"status\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"toast.description ? descriptionId : undefined\"\n  >\n    <span\n      class=\"t-toast__icon\"\n      aria-hidden=\"true\"\n    >\n      <StatusIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"18\"\n      />\n    </span>\n    <div class=\"t-toast__content\">\n      <p\n        :id=\"titleId\"\n        class=\"t-toast__title\"\n      >\n        {{ toast.title }}\n      </p>\n      <p\n        v-if=\"toast.description\"\n        :id=\"descriptionId\"\n        class=\"t-toast__description\"\n      >\n        {{ toast.description }}\n      </p>\n    </div>\n    <button\n      v-if=\"toast.closable\"\n      type=\"button\"\n      class=\"t-toast__close\"\n      aria-label=\"Dismiss notification\"\n      @click=\"handleClose\"\n    >\n      <XIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"16\"\n      />\n    </button>\n  </div>\n</template>\n"],"mappings":"8QAMA,IAAM,GAAA,EAAA,EAAA,YAAA,CAAoB,GAAG,EAEvB,EAAU,CACd,MAAA,EAAA,EAAA,YAAA,CAAkB,MAAM,EACxB,SAAA,EAAA,EAAA,YAAA,CAAqB,OAAO,EAC5B,SAAA,EAAA,EAAA,YAAA,CAAqB,cAAc,EACnC,QAAA,EAAA,EAAA,YAAA,CAAoB,cAAc,CACpC,EAEM,EAAQ,EAOR,EAAO,EAIP,GAAA,EAAA,EAAA,SAAA,CAAmB,cAAc,EACjC,EAAU,GAAG,EAAQ,QACrB,EAAgB,GAAG,EAAQ,cAE3B,GAAA,EAAA,EAAA,SAAA,KAAyB,CAC7B,UACA,YAAY,EAAM,MAAM,SAC1B,CAAC,EAEK,GAAA,EAAA,EAAA,SAAA,KAA4B,EAAQ,EAAM,MAAM,QAAQ,EAE9D,SAAS,GAAc,CACrB,EAAK,QAAS,EAAM,MAAM,EAAE,CAC9B,0DA8CQ,MAAA,CAzCH,OAAA,EAAA,EAAA,eAAA,CAAO,EAAA,KAAO,EACf,KAAK,SACJ,kBAAiB,EACjB,mBAAkB,EAAA,MAAM,YAAc,EAAgB,IAAA,8BAUhD,OARP,EAQO,EAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,MAAA,CADH,CAAA,GAAA,EAAA,EAAA,WAAA,EAAA,EAAA,EAAA,MAAA,CAAA,EAAA,gBAAA,EAFwB,CACvB,KAAM,EAAE,CAAA,EAAA,KAAA,EAAA,CAAA,CAAA,2BAiBP,MAdN,EAcM,EAAA,EAAA,EAAA,mBAAA,CARA,IAAA,CAJD,GAAI,EACL,MAAM,wCAEH,EAAA,MAAM,KAAK,EAAA,CAAA,EAGR,EAAA,MAAM,cAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAKV,IAAA,OAJD,GAAI,EACL,MAAM,8CAEH,EAAA,MAAM,WAAW,EAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,CAAA,CAAA,EAIhB,EAAA,MAAM,WAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAUL,SAAA,OATP,KAAK,SACL,MAAM,iBACN,aAAW,uBACV,QAAO,kCAKN,CAAA,GAAA,EAAA,EAAA,WAAA,EAAA,EAAA,EAAA,MAAA,CAAA,EAAA,gBAAA,EAFwB,CACvB,KAAM,EAAE,CAAA,EAAA,KAAA,EAAA,CAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA"}
+{"version":3,"file":"TToast.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TToast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId } from '@treeui/utils';\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed } from 'vue';\nimport type { ToastItem } from '../composables/useToast';\n\nconst XIcon = computed(() => getTreeIcon('x'));\n\n// Resolved per render, not once at setup: an application that replaces one of\n// these built-ins gets the replacement in toasts that are already mounted.\nconst VARIANT_ICONS = {\n  info: 'info',\n  success: 'check',\n  warning: 'alert-circle',\n  danger: 'alert-circle',\n} as const;\n\nconst props = withDefaults(\n  defineProps<{\n    toast: ToastItem;\n  }>(),\n  {},\n);\n\nconst emit = defineEmits<{\n  close: [id: string];\n}>();\n\nconst toastId = createId('t-toast-item');\nconst titleId = `${toastId}-title`;\nconst descriptionId = `${toastId}-description`;\n\nconst classes = computed(() => [\n  't-toast',\n  `t-toast--${props.toast.variant}`,\n]);\n\nconst StatusIcon = computed(() => getTreeIcon(VARIANT_ICONS[props.toast.variant]));\n\nfunction handleClose() {\n  emit('close', props.toast.id);\n}\n</script>\n\n<template>\n  <div\n    :class=\"classes\"\n    role=\"status\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"toast.description ? descriptionId : undefined\"\n  >\n    <span\n      class=\"t-toast__icon\"\n      aria-hidden=\"true\"\n    >\n      <StatusIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"18\"\n      />\n    </span>\n    <div class=\"t-toast__content\">\n      <p\n        :id=\"titleId\"\n        class=\"t-toast__title\"\n      >\n        {{ toast.title }}\n      </p>\n      <p\n        v-if=\"toast.description\"\n        :id=\"descriptionId\"\n        class=\"t-toast__description\"\n      >\n        {{ toast.description }}\n      </p>\n    </div>\n    <button\n      v-if=\"toast.closable\"\n      type=\"button\"\n      class=\"t-toast__close\"\n      aria-label=\"Dismiss notification\"\n      @click=\"handleClose\"\n    >\n      <XIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"16\"\n      />\n    </button>\n  </div>\n</template>\n"],"mappings":"8QAMA,IAAM,GAAA,EAAA,EAAA,SAAA,MAAA,EAAA,EAAA,YAAA,CAAmC,GAAG,CAAC,EAIvC,EAAgB,CACpB,KAAM,OACN,QAAS,QACT,QAAS,eACT,OAAQ,cACV,EAEM,EAAQ,EAOR,EAAO,EAIP,GAAA,EAAA,EAAA,SAAA,CAAmB,cAAc,EACjC,EAAU,GAAG,EAAQ,QACrB,EAAgB,GAAG,EAAQ,cAE3B,GAAA,EAAA,EAAA,SAAA,KAAyB,CAC7B,UACA,YAAY,EAAM,MAAM,SAC1B,CAAC,EAEK,GAAA,EAAA,EAAA,SAAA,MAAA,EAAA,EAAA,YAAA,CAAwC,EAAc,EAAM,MAAM,QAAQ,CAAC,EAEjF,SAAS,GAAc,CACrB,EAAK,QAAS,EAAM,MAAM,EAAE,CAC9B,0DA8CQ,MAAA,CAzCH,OAAA,EAAA,EAAA,eAAA,CAAO,EAAA,KAAO,EACf,KAAK,SACJ,kBAAiB,EACjB,mBAAkB,EAAA,MAAM,YAAc,EAAgB,IAAA,8BAUhD,OARP,EAQO,EAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,MAAA,CADH,CAAA,GAAA,EAAA,EAAA,WAAA,EAAA,EAAA,EAAA,MAAA,CAAA,EAAA,gBAAA,EAFwB,CACvB,KAAM,EAAE,CAAA,EAAA,KAAA,EAAA,CAAA,CAAA,2BAiBP,MAdN,EAcM,EAAA,EAAA,EAAA,mBAAA,CARA,IAAA,CAJD,GAAI,EACL,MAAM,wCAEH,EAAA,MAAM,KAAK,EAAA,CAAA,EAGR,EAAA,MAAM,cAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAKV,IAAA,OAJD,GAAI,EACL,MAAM,8CAEH,EAAA,MAAM,WAAW,EAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,CAAA,CAAA,EAIhB,EAAA,MAAM,WAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAUL,SAAA,OATP,KAAK,SACL,MAAM,iBACN,aAAW,uBACV,QAAO,kCAKN,CAAA,GAAA,EAAA,EAAA,WAAA,EAAA,EAAA,EAAA,MAAA,CAAA,EAAA,gBAAA,EAFwB,CACvB,KAAM,EAAE,CAAA,EAAA,KAAA,EAAA,CAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA"}

package/dist/components/TToast.vue_vue_type_script_setup_true_lang.js

@@ -10,12 +10,12 @@ var m = ["aria-describedby"], h = {
 	props: { toast: {} },
 	emits: ["close"],
 	setup(a, { emit: _ }) {
-		let v = f("x"), y = {
-			info: f("info"),
-			success: f("check"),
-			warning: f("alert-circle"),
-			danger: f("alert-circle")
-		}, b = a, x = _, S = d("t-toast-item"), C = `${S}-title`, w = `${S}-description`, T = e(() => ["t-toast", `t-toast--${b.toast.variant}`]), E = e(() => y[b.toast.variant]);
+		let v = e(() => f("x")), y = {
+			info: "info",
+			success: "check",
+			warning: "alert-circle",
+			danger: "alert-circle"
+		}, b = a, x = _, S = d("t-toast-item"), C = `${S}-title`, w = `${S}-description`, T = e(() => ["t-toast", `t-toast--${b.toast.variant}`]), E = e(() => f(y[b.toast.variant]));
 		function D() {
 			x("close", b.toast.id);
 		}

package/dist/components/TToast.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"TToast.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../src/components/TToast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId } from '@treeui/utils';\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed } from 'vue';\nimport type { ToastItem } from '../composables/useToast';\n\nconst XIcon = getTreeIcon('x');\n\nconst iconMap = {\n  info: getTreeIcon('info'),\n  success: getTreeIcon('check'),\n  warning: getTreeIcon('alert-circle'),\n  danger: getTreeIcon('alert-circle'),\n} as const;\n\nconst props = withDefaults(\n  defineProps<{\n    toast: ToastItem;\n  }>(),\n  {},\n);\n\nconst emit = defineEmits<{\n  close: [id: string];\n}>();\n\nconst toastId = createId('t-toast-item');\nconst titleId = `${toastId}-title`;\nconst descriptionId = `${toastId}-description`;\n\nconst classes = computed(() => [\n  't-toast',\n  `t-toast--${props.toast.variant}`,\n]);\n\nconst StatusIcon = computed(() => iconMap[props.toast.variant]);\n\nfunction handleClose() {\n  emit('close', props.toast.id);\n}\n</script>\n\n<template>\n  <div\n    :class=\"classes\"\n    role=\"status\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"toast.description ? descriptionId : undefined\"\n  >\n    <span\n      class=\"t-toast__icon\"\n      aria-hidden=\"true\"\n    >\n      <StatusIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"18\"\n      />\n    </span>\n    <div class=\"t-toast__content\">\n      <p\n        :id=\"titleId\"\n        class=\"t-toast__title\"\n      >\n        {{ toast.title }}\n      </p>\n      <p\n        v-if=\"toast.description\"\n        :id=\"descriptionId\"\n        class=\"t-toast__description\"\n      >\n        {{ toast.description }}\n      </p>\n    </div>\n    <button\n      v-if=\"toast.closable\"\n      type=\"button\"\n      class=\"t-toast__close\"\n      aria-label=\"Dismiss notification\"\n      @click=\"handleClose\"\n    >\n      <XIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"16\"\n      />\n    </button>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;EAMA,IAAM,IAAQ,EAAY,GAAG,GAEvB,IAAU;GACd,MAAM,EAAY,MAAM;GACxB,SAAS,EAAY,OAAO;GAC5B,SAAS,EAAY,cAAc;GACnC,QAAQ,EAAY,cAAc;EACpC,GAEM,IAAQ,GAOR,IAAO,GAIP,IAAU,EAAS,cAAc,GACjC,IAAU,GAAG,EAAQ,SACrB,IAAgB,GAAG,EAAQ,eAE3B,IAAU,QAAe,CAC7B,WACA,YAAY,EAAM,MAAM,SAC1B,CAAC,GAEK,IAAa,QAAe,EAAQ,EAAM,MAAM,QAAQ;EAE9D,SAAS,IAAc;GACrB,EAAK,SAAS,EAAM,MAAM,EAAE;EAC9B;yBAIE,EA0CM,OAAA;GAzCH,OAAK,EAAE,EAAA,KAAO;GACf,MAAK;GACJ,mBAAiB;GACjB,oBAAkB,EAAA,MAAM,cAAc,IAAgB,KAAA;;GAEvD,EAQO,QARP,GAQO,CAJL,EAGE,EAAA,CAAA,GAHF,EACU,EAER,CAAA,GAFwB,EACvB,MAAM,GAAE,CAAA,GAAA,MAAA,EAAA,CAAA,CAAA;GAGb,EAcM,OAdN,GAcM,CAbJ,EAKI,KAAA;IAJD,IAAI;IACL,OAAM;QAEH,EAAA,MAAM,KAAK,GAAA,CAAA,GAGR,EAAA,MAAM,eAAA,EAAA,GADd,EAMI,KAAA;;IAJD,IAAI;IACL,OAAM;QAEH,EAAA,MAAM,WAAW,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA;GAIhB,EAAA,MAAM,YAAA,EAAA,GADd,EAWS,UAAA;;IATP,MAAK;IACL,OAAM;IACN,cAAW;IACV,SAAO;OAER,EAGE,EAAA,CAAA,GAHF,EACU,EAER,CAAA,GAFwB,EACvB,MAAM,GAAE,CAAA,GAAA,MAAA,EAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}
+{"version":3,"file":"TToast.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../src/components/TToast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId } from '@treeui/utils';\nimport { getTreeIcon, treeIconDefaults } from '@treeui/icons';\nimport { computed } from 'vue';\nimport type { ToastItem } from '../composables/useToast';\n\nconst XIcon = computed(() => getTreeIcon('x'));\n\n// Resolved per render, not once at setup: an application that replaces one of\n// these built-ins gets the replacement in toasts that are already mounted.\nconst VARIANT_ICONS = {\n  info: 'info',\n  success: 'check',\n  warning: 'alert-circle',\n  danger: 'alert-circle',\n} as const;\n\nconst props = withDefaults(\n  defineProps<{\n    toast: ToastItem;\n  }>(),\n  {},\n);\n\nconst emit = defineEmits<{\n  close: [id: string];\n}>();\n\nconst toastId = createId('t-toast-item');\nconst titleId = `${toastId}-title`;\nconst descriptionId = `${toastId}-description`;\n\nconst classes = computed(() => [\n  't-toast',\n  `t-toast--${props.toast.variant}`,\n]);\n\nconst StatusIcon = computed(() => getTreeIcon(VARIANT_ICONS[props.toast.variant]));\n\nfunction handleClose() {\n  emit('close', props.toast.id);\n}\n</script>\n\n<template>\n  <div\n    :class=\"classes\"\n    role=\"status\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"toast.description ? descriptionId : undefined\"\n  >\n    <span\n      class=\"t-toast__icon\"\n      aria-hidden=\"true\"\n    >\n      <StatusIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"18\"\n      />\n    </span>\n    <div class=\"t-toast__content\">\n      <p\n        :id=\"titleId\"\n        class=\"t-toast__title\"\n      >\n        {{ toast.title }}\n      </p>\n      <p\n        v-if=\"toast.description\"\n        :id=\"descriptionId\"\n        class=\"t-toast__description\"\n      >\n        {{ toast.description }}\n      </p>\n    </div>\n    <button\n      v-if=\"toast.closable\"\n      type=\"button\"\n      class=\"t-toast__close\"\n      aria-label=\"Dismiss notification\"\n      @click=\"handleClose\"\n    >\n      <XIcon\n        v-bind=\"treeIconDefaults\"\n        :size=\"16\"\n      />\n    </button>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;EAMA,IAAM,IAAQ,QAAe,EAAY,GAAG,CAAC,GAIvC,IAAgB;GACpB,MAAM;GACN,SAAS;GACT,SAAS;GACT,QAAQ;EACV,GAEM,IAAQ,GAOR,IAAO,GAIP,IAAU,EAAS,cAAc,GACjC,IAAU,GAAG,EAAQ,SACrB,IAAgB,GAAG,EAAQ,eAE3B,IAAU,QAAe,CAC7B,WACA,YAAY,EAAM,MAAM,SAC1B,CAAC,GAEK,IAAa,QAAe,EAAY,EAAc,EAAM,MAAM,QAAQ,CAAC;EAEjF,SAAS,IAAc;GACrB,EAAK,SAAS,EAAM,MAAM,EAAE;EAC9B;yBAIE,EA0CM,OAAA;GAzCH,OAAK,EAAE,EAAA,KAAO;GACf,MAAK;GACJ,mBAAiB;GACjB,oBAAkB,EAAA,MAAM,cAAc,IAAgB,KAAA;;GAEvD,EAQO,QARP,GAQO,CAJL,EAGE,EAAA,CAAA,GAHF,EACU,EAER,CAAA,GAFwB,EACvB,MAAM,GAAE,CAAA,GAAA,MAAA,EAAA,CAAA,CAAA;GAGb,EAcM,OAdN,GAcM,CAbJ,EAKI,KAAA;IAJD,IAAI;IACL,OAAM;QAEH,EAAA,MAAM,KAAK,GAAA,CAAA,GAGR,EAAA,MAAM,eAAA,EAAA,GADd,EAMI,KAAA;;IAJD,IAAI;IACL,OAAM;QAEH,EAAA,MAAM,WAAW,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA;GAIhB,EAAA,MAAM,YAAA,EAAA,GADd,EAWS,UAAA;;IATP,MAAK;IACL,OAAM;IACN,cAAW;IACV,SAAO;OAER,EAGE,EAAA,CAAA,GAHF,EACU,EAER,CAAA,GAFwB,EACvB,MAAM,GAAE,CAAA,GAAA,MAAA,EAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}

package/dist/components/TTreeViewItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TTreeViewItem.cjs","names":[],"sources":["../../src/components/TTreeViewItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, inject, type ComponentPublicInstance } from 'vue';\nimport { treeTreeViewInjectionKey, type TTreeViewNode } from './tree-view';\n\ndefineOptions({\n  name: 'TTreeViewItem',\n});\n\nconst ChevronRightIcon = getTreeIcon('chevron-right');\nconst CheckIcon = getTreeIcon('check');\n\nconst props = defineProps<{\n  node: TTreeViewNode;\n  level: number;\n}>();\n\nconst ctx = inject(treeTreeViewInjectionKey);\n\nif (!ctx) {\n  throw new Error('[TreeUI] TTreeView items must be rendered inside a TTreeView.');\n}\n\nconst hasChildren = computed(() => Boolean(props.node.children?.length));\nconst isExpanded = computed(() => (hasChildren.value ? ctx.isExpanded(props.node.id) : false));\nconst isSelected = computed(() => ctx.isSelected(props.node.id));\nconst isDisabled = computed(() => ctx.disabled.value || props.node.disabled);\nconst isFocused = computed(() => ctx.focusedId.value === props.node.id);\nconst itemId = computed(() => `${ctx.baseId}-${props.node.id}`);\n\nconst rowClasses = computed(() => ({\n  'is-expanded': isExpanded.value,\n  'is-selected': isSelected.value,\n  'is-disabled': isDisabled.value,\n  'is-focused': isFocused.value,\n}));\n\nconst setItemRef = (element: Element | ComponentPublicInstance | null) => {\n  const resolvedElement =\n    element instanceof HTMLElement\n      ? element\n      : element && '$el' in element && element.$el instanceof HTMLElement\n        ? element.$el\n        : null;\n\n  if (resolvedElement instanceof HTMLElement) {\n    ctx.registerItem(props.node.id, resolvedElement);\n  } else {\n    ctx.unregisterItem(props.node.id);\n  }\n};\n\nconst onRowClick = () => {\n  ctx.setFocusedId(props.node.id);\n  ctx.toggleSelected(props.node.id);\n};\n\nconst onToggleClick = () => {\n  if (isDisabled.value || !hasChildren.value) {\n    return;\n  }\n\n  ctx.toggleExpanded(props.node.id);\n  ctx.setFocusedId(props.node.id);\n};\n</script>\n\n<template>\n  <li\n    class=\"t-tree-view__node\"\n    role=\"none\"\n  >\n    <div\n      :id=\"itemId\"\n      :ref=\"setItemRef\"\n      class=\"t-tree-view__row\"\n      :class=\"rowClasses\"\n      :style=\"{ '--tree-tree-view-level': `${level}` }\"\n      role=\"treeitem\"\n      :aria-level=\"level\"\n      :aria-expanded=\"hasChildren ? isExpanded : undefined\"\n      :aria-selected=\"isSelected\"\n      :aria-disabled=\"isDisabled || undefined\"\n      :tabindex=\"isDisabled ? -1 : isFocused ? 0 : -1\"\n      @click=\"onRowClick\"\n      @keydown=\"ctx.onItemKeydown($event, node.id)\"\n      @focus=\"ctx.setFocusedId(node.id)\"\n    >\n      <button\n        v-if=\"hasChildren\"\n        type=\"button\"\n        class=\"t-tree-view__toggle\"\n        :class=\"{ 'is-expanded': isExpanded }\"\n        tabindex=\"-1\"\n        :disabled=\"isDisabled\"\n        :aria-label=\"isExpanded ? 'Collapse node' : 'Expand node'\"\n        @click.stop=\"onToggleClick\"\n      >\n        <ChevronRightIcon :size=\"16\" />\n      </button>\n\n      <span\n        v-else\n        class=\"t-tree-view__spacer\"\n        aria-hidden=\"true\"\n      />\n\n      <span\n        class=\"t-tree-view__marker\"\n        :class=\"{\n          'is-selected': isSelected,\n          'is-multiple': ctx.selectionMode.value === 'multiple',\n        }\"\n        aria-hidden=\"true\"\n      >\n        <CheckIcon\n          v-if=\"ctx.selectionMode.value === 'multiple' && isSelected\"\n          :size=\"14\"\n        />\n      </span>\n\n      <span class=\"t-tree-view__copy\">\n        <span class=\"t-tree-view__label\">{{ node.label }}</span>\n        <span\n          v-if=\"node.description\"\n          class=\"t-tree-view__description\"\n        >\n          {{ node.description }}\n        </span>\n      </span>\n\n      <span\n        v-if=\"node.meta\"\n        class=\"t-tree-view__meta\"\n      >\n        {{ node.meta }}\n      </span>\n    </div>\n\n    <ul\n      v-if=\"hasChildren && isExpanded\"\n      class=\"t-tree-view__group\"\n      role=\"group\"\n    >\n      <TTreeViewItem\n        v-for=\"child in node.children\"\n        :key=\"child.id\"\n        :node=\"child\"\n        :level=\"level + 1\"\n      />\n    </ul>\n  </li>\n</template>\n"],"mappings":""}
+{"version":3,"file":"TTreeViewItem.cjs","names":[],"sources":["../../src/components/TTreeViewItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, inject, type ComponentPublicInstance } from 'vue';\nimport { treeTreeViewInjectionKey, type TTreeViewNode } from './tree-view';\n\ndefineOptions({\n  name: 'TTreeViewItem',\n});\n\nconst ChevronRightIcon = computed(() => getTreeIcon('chevron-right'));\nconst CheckIcon = computed(() => getTreeIcon('check'));\n\nconst props = defineProps<{\n  node: TTreeViewNode;\n  level: number;\n}>();\n\nconst ctx = inject(treeTreeViewInjectionKey);\n\nif (!ctx) {\n  throw new Error('[TreeUI] TTreeView items must be rendered inside a TTreeView.');\n}\n\nconst hasChildren = computed(() => Boolean(props.node.children?.length));\nconst isExpanded = computed(() => (hasChildren.value ? ctx.isExpanded(props.node.id) : false));\nconst isSelected = computed(() => ctx.isSelected(props.node.id));\nconst isDisabled = computed(() => ctx.disabled.value || props.node.disabled);\nconst isFocused = computed(() => ctx.focusedId.value === props.node.id);\nconst itemId = computed(() => `${ctx.baseId}-${props.node.id}`);\n\nconst rowClasses = computed(() => ({\n  'is-expanded': isExpanded.value,\n  'is-selected': isSelected.value,\n  'is-disabled': isDisabled.value,\n  'is-focused': isFocused.value,\n}));\n\nconst setItemRef = (element: Element | ComponentPublicInstance | null) => {\n  const resolvedElement =\n    element instanceof HTMLElement\n      ? element\n      : element && '$el' in element && element.$el instanceof HTMLElement\n        ? element.$el\n        : null;\n\n  if (resolvedElement instanceof HTMLElement) {\n    ctx.registerItem(props.node.id, resolvedElement);\n  } else {\n    ctx.unregisterItem(props.node.id);\n  }\n};\n\nconst onRowClick = () => {\n  ctx.setFocusedId(props.node.id);\n  ctx.toggleSelected(props.node.id);\n};\n\nconst onToggleClick = () => {\n  if (isDisabled.value || !hasChildren.value) {\n    return;\n  }\n\n  ctx.toggleExpanded(props.node.id);\n  ctx.setFocusedId(props.node.id);\n};\n</script>\n\n<template>\n  <li\n    class=\"t-tree-view__node\"\n    role=\"none\"\n  >\n    <div\n      :id=\"itemId\"\n      :ref=\"setItemRef\"\n      class=\"t-tree-view__row\"\n      :class=\"rowClasses\"\n      :style=\"{ '--tree-tree-view-level': `${level}` }\"\n      role=\"treeitem\"\n      :aria-level=\"level\"\n      :aria-expanded=\"hasChildren ? isExpanded : undefined\"\n      :aria-selected=\"isSelected\"\n      :aria-disabled=\"isDisabled || undefined\"\n      :tabindex=\"isDisabled ? -1 : isFocused ? 0 : -1\"\n      @click=\"onRowClick\"\n      @keydown=\"ctx.onItemKeydown($event, node.id)\"\n      @focus=\"ctx.setFocusedId(node.id)\"\n    >\n      <button\n        v-if=\"hasChildren\"\n        type=\"button\"\n        class=\"t-tree-view__toggle\"\n        :class=\"{ 'is-expanded': isExpanded }\"\n        tabindex=\"-1\"\n        :disabled=\"isDisabled\"\n        :aria-label=\"isExpanded ? 'Collapse node' : 'Expand node'\"\n        @click.stop=\"onToggleClick\"\n      >\n        <ChevronRightIcon :size=\"16\" />\n      </button>\n\n      <span\n        v-else\n        class=\"t-tree-view__spacer\"\n        aria-hidden=\"true\"\n      />\n\n      <span\n        class=\"t-tree-view__marker\"\n        :class=\"{\n          'is-selected': isSelected,\n          'is-multiple': ctx.selectionMode.value === 'multiple',\n        }\"\n        aria-hidden=\"true\"\n      >\n        <CheckIcon\n          v-if=\"ctx.selectionMode.value === 'multiple' && isSelected\"\n          :size=\"14\"\n        />\n      </span>\n\n      <span class=\"t-tree-view__copy\">\n        <span class=\"t-tree-view__label\">{{ node.label }}</span>\n        <span\n          v-if=\"node.description\"\n          class=\"t-tree-view__description\"\n        >\n          {{ node.description }}\n        </span>\n      </span>\n\n      <span\n        v-if=\"node.meta\"\n        class=\"t-tree-view__meta\"\n      >\n        {{ node.meta }}\n      </span>\n    </div>\n\n    <ul\n      v-if=\"hasChildren && isExpanded\"\n      class=\"t-tree-view__group\"\n      role=\"group\"\n    >\n      <TTreeViewItem\n        v-for=\"child in node.children\"\n        :key=\"child.id\"\n        :node=\"child\"\n        :level=\"level + 1\"\n      />\n    </ul>\n  </li>\n</template>\n"],"mappings":""}

package/dist/components/TTreeViewItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"TTreeViewItem.js","names":[],"sources":["../../src/components/TTreeViewItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, inject, type ComponentPublicInstance } from 'vue';\nimport { treeTreeViewInjectionKey, type TTreeViewNode } from './tree-view';\n\ndefineOptions({\n  name: 'TTreeViewItem',\n});\n\nconst ChevronRightIcon = getTreeIcon('chevron-right');\nconst CheckIcon = getTreeIcon('check');\n\nconst props = defineProps<{\n  node: TTreeViewNode;\n  level: number;\n}>();\n\nconst ctx = inject(treeTreeViewInjectionKey);\n\nif (!ctx) {\n  throw new Error('[TreeUI] TTreeView items must be rendered inside a TTreeView.');\n}\n\nconst hasChildren = computed(() => Boolean(props.node.children?.length));\nconst isExpanded = computed(() => (hasChildren.value ? ctx.isExpanded(props.node.id) : false));\nconst isSelected = computed(() => ctx.isSelected(props.node.id));\nconst isDisabled = computed(() => ctx.disabled.value || props.node.disabled);\nconst isFocused = computed(() => ctx.focusedId.value === props.node.id);\nconst itemId = computed(() => `${ctx.baseId}-${props.node.id}`);\n\nconst rowClasses = computed(() => ({\n  'is-expanded': isExpanded.value,\n  'is-selected': isSelected.value,\n  'is-disabled': isDisabled.value,\n  'is-focused': isFocused.value,\n}));\n\nconst setItemRef = (element: Element | ComponentPublicInstance | null) => {\n  const resolvedElement =\n    element instanceof HTMLElement\n      ? element\n      : element && '$el' in element && element.$el instanceof HTMLElement\n        ? element.$el\n        : null;\n\n  if (resolvedElement instanceof HTMLElement) {\n    ctx.registerItem(props.node.id, resolvedElement);\n  } else {\n    ctx.unregisterItem(props.node.id);\n  }\n};\n\nconst onRowClick = () => {\n  ctx.setFocusedId(props.node.id);\n  ctx.toggleSelected(props.node.id);\n};\n\nconst onToggleClick = () => {\n  if (isDisabled.value || !hasChildren.value) {\n    return;\n  }\n\n  ctx.toggleExpanded(props.node.id);\n  ctx.setFocusedId(props.node.id);\n};\n</script>\n\n<template>\n  <li\n    class=\"t-tree-view__node\"\n    role=\"none\"\n  >\n    <div\n      :id=\"itemId\"\n      :ref=\"setItemRef\"\n      class=\"t-tree-view__row\"\n      :class=\"rowClasses\"\n      :style=\"{ '--tree-tree-view-level': `${level}` }\"\n      role=\"treeitem\"\n      :aria-level=\"level\"\n      :aria-expanded=\"hasChildren ? isExpanded : undefined\"\n      :aria-selected=\"isSelected\"\n      :aria-disabled=\"isDisabled || undefined\"\n      :tabindex=\"isDisabled ? -1 : isFocused ? 0 : -1\"\n      @click=\"onRowClick\"\n      @keydown=\"ctx.onItemKeydown($event, node.id)\"\n      @focus=\"ctx.setFocusedId(node.id)\"\n    >\n      <button\n        v-if=\"hasChildren\"\n        type=\"button\"\n        class=\"t-tree-view__toggle\"\n        :class=\"{ 'is-expanded': isExpanded }\"\n        tabindex=\"-1\"\n        :disabled=\"isDisabled\"\n        :aria-label=\"isExpanded ? 'Collapse node' : 'Expand node'\"\n        @click.stop=\"onToggleClick\"\n      >\n        <ChevronRightIcon :size=\"16\" />\n      </button>\n\n      <span\n        v-else\n        class=\"t-tree-view__spacer\"\n        aria-hidden=\"true\"\n      />\n\n      <span\n        class=\"t-tree-view__marker\"\n        :class=\"{\n          'is-selected': isSelected,\n          'is-multiple': ctx.selectionMode.value === 'multiple',\n        }\"\n        aria-hidden=\"true\"\n      >\n        <CheckIcon\n          v-if=\"ctx.selectionMode.value === 'multiple' && isSelected\"\n          :size=\"14\"\n        />\n      </span>\n\n      <span class=\"t-tree-view__copy\">\n        <span class=\"t-tree-view__label\">{{ node.label }}</span>\n        <span\n          v-if=\"node.description\"\n          class=\"t-tree-view__description\"\n        >\n          {{ node.description }}\n        </span>\n      </span>\n\n      <span\n        v-if=\"node.meta\"\n        class=\"t-tree-view__meta\"\n      >\n        {{ node.meta }}\n      </span>\n    </div>\n\n    <ul\n      v-if=\"hasChildren && isExpanded\"\n      class=\"t-tree-view__group\"\n      role=\"group\"\n    >\n      <TTreeViewItem\n        v-for=\"child in node.children\"\n        :key=\"child.id\"\n        :node=\"child\"\n        :level=\"level + 1\"\n      />\n    </ul>\n  </li>\n</template>\n"],"mappings":""}
+{"version":3,"file":"TTreeViewItem.js","names":[],"sources":["../../src/components/TTreeViewItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, inject, type ComponentPublicInstance } from 'vue';\nimport { treeTreeViewInjectionKey, type TTreeViewNode } from './tree-view';\n\ndefineOptions({\n  name: 'TTreeViewItem',\n});\n\nconst ChevronRightIcon = computed(() => getTreeIcon('chevron-right'));\nconst CheckIcon = computed(() => getTreeIcon('check'));\n\nconst props = defineProps<{\n  node: TTreeViewNode;\n  level: number;\n}>();\n\nconst ctx = inject(treeTreeViewInjectionKey);\n\nif (!ctx) {\n  throw new Error('[TreeUI] TTreeView items must be rendered inside a TTreeView.');\n}\n\nconst hasChildren = computed(() => Boolean(props.node.children?.length));\nconst isExpanded = computed(() => (hasChildren.value ? ctx.isExpanded(props.node.id) : false));\nconst isSelected = computed(() => ctx.isSelected(props.node.id));\nconst isDisabled = computed(() => ctx.disabled.value || props.node.disabled);\nconst isFocused = computed(() => ctx.focusedId.value === props.node.id);\nconst itemId = computed(() => `${ctx.baseId}-${props.node.id}`);\n\nconst rowClasses = computed(() => ({\n  'is-expanded': isExpanded.value,\n  'is-selected': isSelected.value,\n  'is-disabled': isDisabled.value,\n  'is-focused': isFocused.value,\n}));\n\nconst setItemRef = (element: Element | ComponentPublicInstance | null) => {\n  const resolvedElement =\n    element instanceof HTMLElement\n      ? element\n      : element && '$el' in element && element.$el instanceof HTMLElement\n        ? element.$el\n        : null;\n\n  if (resolvedElement instanceof HTMLElement) {\n    ctx.registerItem(props.node.id, resolvedElement);\n  } else {\n    ctx.unregisterItem(props.node.id);\n  }\n};\n\nconst onRowClick = () => {\n  ctx.setFocusedId(props.node.id);\n  ctx.toggleSelected(props.node.id);\n};\n\nconst onToggleClick = () => {\n  if (isDisabled.value || !hasChildren.value) {\n    return;\n  }\n\n  ctx.toggleExpanded(props.node.id);\n  ctx.setFocusedId(props.node.id);\n};\n</script>\n\n<template>\n  <li\n    class=\"t-tree-view__node\"\n    role=\"none\"\n  >\n    <div\n      :id=\"itemId\"\n      :ref=\"setItemRef\"\n      class=\"t-tree-view__row\"\n      :class=\"rowClasses\"\n      :style=\"{ '--tree-tree-view-level': `${level}` }\"\n      role=\"treeitem\"\n      :aria-level=\"level\"\n      :aria-expanded=\"hasChildren ? isExpanded : undefined\"\n      :aria-selected=\"isSelected\"\n      :aria-disabled=\"isDisabled || undefined\"\n      :tabindex=\"isDisabled ? -1 : isFocused ? 0 : -1\"\n      @click=\"onRowClick\"\n      @keydown=\"ctx.onItemKeydown($event, node.id)\"\n      @focus=\"ctx.setFocusedId(node.id)\"\n    >\n      <button\n        v-if=\"hasChildren\"\n        type=\"button\"\n        class=\"t-tree-view__toggle\"\n        :class=\"{ 'is-expanded': isExpanded }\"\n        tabindex=\"-1\"\n        :disabled=\"isDisabled\"\n        :aria-label=\"isExpanded ? 'Collapse node' : 'Expand node'\"\n        @click.stop=\"onToggleClick\"\n      >\n        <ChevronRightIcon :size=\"16\" />\n      </button>\n\n      <span\n        v-else\n        class=\"t-tree-view__spacer\"\n        aria-hidden=\"true\"\n      />\n\n      <span\n        class=\"t-tree-view__marker\"\n        :class=\"{\n          'is-selected': isSelected,\n          'is-multiple': ctx.selectionMode.value === 'multiple',\n        }\"\n        aria-hidden=\"true\"\n      >\n        <CheckIcon\n          v-if=\"ctx.selectionMode.value === 'multiple' && isSelected\"\n          :size=\"14\"\n        />\n      </span>\n\n      <span class=\"t-tree-view__copy\">\n        <span class=\"t-tree-view__label\">{{ node.label }}</span>\n        <span\n          v-if=\"node.description\"\n          class=\"t-tree-view__description\"\n        >\n          {{ node.description }}\n        </span>\n      </span>\n\n      <span\n        v-if=\"node.meta\"\n        class=\"t-tree-view__meta\"\n      >\n        {{ node.meta }}\n      </span>\n    </div>\n\n    <ul\n      v-if=\"hasChildren && isExpanded\"\n      class=\"t-tree-view__group\"\n      role=\"group\"\n    >\n      <TTreeViewItem\n        v-for=\"child in node.children\"\n        :key=\"child.id\"\n        :node=\"child\"\n        :level=\"level + 1\"\n      />\n    </ul>\n  </li>\n</template>\n"],"mappings":""}

package/dist/components/TTreeViewItem.vue_vue_type_script_setup_true_lang.cjs

@@ -1,2 +1,2 @@
-const e=require("./tree-view.cjs");let t=require("vue"),n=require("@treeui/icons");var r={class:`t-tree-view__node`,role:`none`},i=[`id`,`aria-level`,`aria-expanded`,`aria-selected`,`aria-disabled`,`tabindex`],a=[`disabled`,`aria-label`],o={key:1,class:`t-tree-view__spacer`,"aria-hidden":`true`},s={class:`t-tree-view__copy`},c={class:`t-tree-view__label`},l={key:0,class:`t-tree-view__description`},u={key:2,class:`t-tree-view__meta`},d={key:0,class:`t-tree-view__group`,role:`group`},f=(0,t.defineComponent)({name:`TTreeViewItem`,__name:`TTreeViewItem`,props:{node:{},level:{}},setup(f){let p=(0,n.getTreeIcon)(`chevron-right`),m=(0,n.getTreeIcon)(`check`),h=f,g=(0,t.inject)(e.treeTreeViewInjectionKey);if(!g)throw Error(`[TreeUI] TTreeView items must be rendered inside a TTreeView.`);let _=(0,t.computed)(()=>!!h.node.children?.length),v=(0,t.computed)(()=>_.value?g.isExpanded(h.node.id):!1),y=(0,t.computed)(()=>g.isSelected(h.node.id)),b=(0,t.computed)(()=>g.disabled.value||h.node.disabled),x=(0,t.computed)(()=>g.focusedId.value===h.node.id),S=(0,t.computed)(()=>`${g.baseId}-${h.node.id}`),C=(0,t.computed)(()=>({"is-expanded":v.value,"is-selected":y.value,"is-disabled":b.value,"is-focused":x.value})),w=e=>{let t=e instanceof HTMLElement?e:e&&`$el`in e&&e.$el instanceof HTMLElement?e.$el:null;t instanceof HTMLElement?g.registerItem(h.node.id,t):g.unregisterItem(h.node.id)},T=()=>{g.setFocusedId(h.node.id),g.toggleSelected(h.node.id)},E=()=>{b.value||!_.value||(g.toggleExpanded(h.node.id),g.setFocusedId(h.node.id))};return(e,n)=>{let h=(0,t.resolveComponent)(`TTreeViewItem`,!0);return(0,t.openBlock)(),(0,t.createElementBlock)(`li`,r,[(0,t.createElementVNode)(`div`,{id:S.value,ref:w,class:(0,t.normalizeClass)([`t-tree-view__row`,C.value]),style:(0,t.normalizeStyle)({"--tree-tree-view-level":`${f.level}`}),role:`treeitem`,"aria-level":f.level,"aria-expanded":_.value?v.value:void 0,"aria-selected":y.value,"aria-disabled":b.value||void 0,tabindex:b.value?-1:x.value?0:-1,onClick:T,onKeydown:n[0]||=e=>(0,t.unref)(g).onItemKeydown(e,f.node.id),onFocus:n[1]||=e=>(0,t.unref)(g).setFocusedId(f.node.id)},[_.value?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,type:`button`,class:(0,t.normalizeClass)([`t-tree-view__toggle`,{"is-expanded":v.value}]),tabindex:`-1`,disabled:b.value,"aria-label":v.value?`Collapse node`:`Expand node`,onClick:(0,t.withModifiers)(E,[`stop`])},[(0,t.createVNode)((0,t.unref)(p),{size:16})],10,a)):((0,t.openBlock)(),(0,t.createElementBlock)(`span`,o)),(0,t.createElementVNode)(`span`,{class:(0,t.normalizeClass)([`t-tree-view__marker`,{"is-selected":y.value,"is-multiple":(0,t.unref)(g).selectionMode.value===`multiple`}]),"aria-hidden":`true`},[(0,t.unref)(g).selectionMode.value===`multiple`&&y.value?((0,t.openBlock)(),(0,t.createBlock)((0,t.unref)(m),{key:0,size:14})):(0,t.createCommentVNode)(``,!0)],2),(0,t.createElementVNode)(`span`,s,[(0,t.createElementVNode)(`span`,c,(0,t.toDisplayString)(f.node.label),1),f.node.description?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,l,(0,t.toDisplayString)(f.node.description),1)):(0,t.createCommentVNode)(``,!0)]),f.node.meta?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,u,(0,t.toDisplayString)(f.node.meta),1)):(0,t.createCommentVNode)(``,!0)],46,i),_.value&&v.value?((0,t.openBlock)(),(0,t.createElementBlock)(`ul`,d,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(f.node.children,e=>((0,t.openBlock)(),(0,t.createBlock)(h,{key:e.id,node:e,level:f.level+1},null,8,[`node`,`level`]))),128))])):(0,t.createCommentVNode)(``,!0)])}}});exports.default=f;
+const e=require("./tree-view.cjs");let t=require("vue"),n=require("@treeui/icons");var r={class:`t-tree-view__node`,role:`none`},i=[`id`,`aria-level`,`aria-expanded`,`aria-selected`,`aria-disabled`,`tabindex`],a=[`disabled`,`aria-label`],o={key:1,class:`t-tree-view__spacer`,"aria-hidden":`true`},s={class:`t-tree-view__copy`},c={class:`t-tree-view__label`},l={key:0,class:`t-tree-view__description`},u={key:2,class:`t-tree-view__meta`},d={key:0,class:`t-tree-view__group`,role:`group`},f=(0,t.defineComponent)({name:`TTreeViewItem`,__name:`TTreeViewItem`,props:{node:{},level:{}},setup(f){let p=(0,t.computed)(()=>(0,n.getTreeIcon)(`chevron-right`)),m=(0,t.computed)(()=>(0,n.getTreeIcon)(`check`)),h=f,g=(0,t.inject)(e.treeTreeViewInjectionKey);if(!g)throw Error(`[TreeUI] TTreeView items must be rendered inside a TTreeView.`);let _=(0,t.computed)(()=>!!h.node.children?.length),v=(0,t.computed)(()=>_.value?g.isExpanded(h.node.id):!1),y=(0,t.computed)(()=>g.isSelected(h.node.id)),b=(0,t.computed)(()=>g.disabled.value||h.node.disabled),x=(0,t.computed)(()=>g.focusedId.value===h.node.id),S=(0,t.computed)(()=>`${g.baseId}-${h.node.id}`),C=(0,t.computed)(()=>({"is-expanded":v.value,"is-selected":y.value,"is-disabled":b.value,"is-focused":x.value})),w=e=>{let t=e instanceof HTMLElement?e:e&&`$el`in e&&e.$el instanceof HTMLElement?e.$el:null;t instanceof HTMLElement?g.registerItem(h.node.id,t):g.unregisterItem(h.node.id)},T=()=>{g.setFocusedId(h.node.id),g.toggleSelected(h.node.id)},E=()=>{b.value||!_.value||(g.toggleExpanded(h.node.id),g.setFocusedId(h.node.id))};return(e,n)=>{let h=(0,t.resolveComponent)(`TTreeViewItem`,!0);return(0,t.openBlock)(),(0,t.createElementBlock)(`li`,r,[(0,t.createElementVNode)(`div`,{id:S.value,ref:w,class:(0,t.normalizeClass)([`t-tree-view__row`,C.value]),style:(0,t.normalizeStyle)({"--tree-tree-view-level":`${f.level}`}),role:`treeitem`,"aria-level":f.level,"aria-expanded":_.value?v.value:void 0,"aria-selected":y.value,"aria-disabled":b.value||void 0,tabindex:b.value?-1:x.value?0:-1,onClick:T,onKeydown:n[0]||=e=>(0,t.unref)(g).onItemKeydown(e,f.node.id),onFocus:n[1]||=e=>(0,t.unref)(g).setFocusedId(f.node.id)},[_.value?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,type:`button`,class:(0,t.normalizeClass)([`t-tree-view__toggle`,{"is-expanded":v.value}]),tabindex:`-1`,disabled:b.value,"aria-label":v.value?`Collapse node`:`Expand node`,onClick:(0,t.withModifiers)(E,[`stop`])},[(0,t.createVNode)((0,t.unref)(p),{size:16})],10,a)):((0,t.openBlock)(),(0,t.createElementBlock)(`span`,o)),(0,t.createElementVNode)(`span`,{class:(0,t.normalizeClass)([`t-tree-view__marker`,{"is-selected":y.value,"is-multiple":(0,t.unref)(g).selectionMode.value===`multiple`}]),"aria-hidden":`true`},[(0,t.unref)(g).selectionMode.value===`multiple`&&y.value?((0,t.openBlock)(),(0,t.createBlock)((0,t.unref)(m),{key:0,size:14})):(0,t.createCommentVNode)(``,!0)],2),(0,t.createElementVNode)(`span`,s,[(0,t.createElementVNode)(`span`,c,(0,t.toDisplayString)(f.node.label),1),f.node.description?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,l,(0,t.toDisplayString)(f.node.description),1)):(0,t.createCommentVNode)(``,!0)]),f.node.meta?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,u,(0,t.toDisplayString)(f.node.meta),1)):(0,t.createCommentVNode)(``,!0)],46,i),_.value&&v.value?((0,t.openBlock)(),(0,t.createElementBlock)(`ul`,d,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(f.node.children,e=>((0,t.openBlock)(),(0,t.createBlock)(h,{key:e.id,node:e,level:f.level+1},null,8,[`node`,`level`]))),128))])):(0,t.createCommentVNode)(``,!0)])}}});exports.default=f;
 //# sourceMappingURL=TTreeViewItem.vue_vue_type_script_setup_true_lang.cjs.map

package/dist/components/TTreeViewItem.vue_vue_type_script_setup_true_lang.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TTreeViewItem.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TTreeViewItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, inject, type ComponentPublicInstance } from 'vue';\nimport { treeTreeViewInjectionKey, type TTreeViewNode } from './tree-view';\n\ndefineOptions({\n  name: 'TTreeViewItem',\n});\n\nconst ChevronRightIcon = getTreeIcon('chevron-right');\nconst CheckIcon = getTreeIcon('check');\n\nconst props = defineProps<{\n  node: TTreeViewNode;\n  level: number;\n}>();\n\nconst ctx = inject(treeTreeViewInjectionKey);\n\nif (!ctx) {\n  throw new Error('[TreeUI] TTreeView items must be rendered inside a TTreeView.');\n}\n\nconst hasChildren = computed(() => Boolean(props.node.children?.length));\nconst isExpanded = computed(() => (hasChildren.value ? ctx.isExpanded(props.node.id) : false));\nconst isSelected = computed(() => ctx.isSelected(props.node.id));\nconst isDisabled = computed(() => ctx.disabled.value || props.node.disabled);\nconst isFocused = computed(() => ctx.focusedId.value === props.node.id);\nconst itemId = computed(() => `${ctx.baseId}-${props.node.id}`);\n\nconst rowClasses = computed(() => ({\n  'is-expanded': isExpanded.value,\n  'is-selected': isSelected.value,\n  'is-disabled': isDisabled.value,\n  'is-focused': isFocused.value,\n}));\n\nconst setItemRef = (element: Element | ComponentPublicInstance | null) => {\n  const resolvedElement =\n    element instanceof HTMLElement\n      ? element\n      : element && '$el' in element && element.$el instanceof HTMLElement\n        ? element.$el\n        : null;\n\n  if (resolvedElement instanceof HTMLElement) {\n    ctx.registerItem(props.node.id, resolvedElement);\n  } else {\n    ctx.unregisterItem(props.node.id);\n  }\n};\n\nconst onRowClick = () => {\n  ctx.setFocusedId(props.node.id);\n  ctx.toggleSelected(props.node.id);\n};\n\nconst onToggleClick = () => {\n  if (isDisabled.value || !hasChildren.value) {\n    return;\n  }\n\n  ctx.toggleExpanded(props.node.id);\n  ctx.setFocusedId(props.node.id);\n};\n</script>\n\n<template>\n  <li\n    class=\"t-tree-view__node\"\n    role=\"none\"\n  >\n    <div\n      :id=\"itemId\"\n      :ref=\"setItemRef\"\n      class=\"t-tree-view__row\"\n      :class=\"rowClasses\"\n      :style=\"{ '--tree-tree-view-level': `${level}` }\"\n      role=\"treeitem\"\n      :aria-level=\"level\"\n      :aria-expanded=\"hasChildren ? isExpanded : undefined\"\n      :aria-selected=\"isSelected\"\n      :aria-disabled=\"isDisabled || undefined\"\n      :tabindex=\"isDisabled ? -1 : isFocused ? 0 : -1\"\n      @click=\"onRowClick\"\n      @keydown=\"ctx.onItemKeydown($event, node.id)\"\n      @focus=\"ctx.setFocusedId(node.id)\"\n    >\n      <button\n        v-if=\"hasChildren\"\n        type=\"button\"\n        class=\"t-tree-view__toggle\"\n        :class=\"{ 'is-expanded': isExpanded }\"\n        tabindex=\"-1\"\n        :disabled=\"isDisabled\"\n        :aria-label=\"isExpanded ? 'Collapse node' : 'Expand node'\"\n        @click.stop=\"onToggleClick\"\n      >\n        <ChevronRightIcon :size=\"16\" />\n      </button>\n\n      <span\n        v-else\n        class=\"t-tree-view__spacer\"\n        aria-hidden=\"true\"\n      />\n\n      <span\n        class=\"t-tree-view__marker\"\n        :class=\"{\n          'is-selected': isSelected,\n          'is-multiple': ctx.selectionMode.value === 'multiple',\n        }\"\n        aria-hidden=\"true\"\n      >\n        <CheckIcon\n          v-if=\"ctx.selectionMode.value === 'multiple' && isSelected\"\n          :size=\"14\"\n        />\n      </span>\n\n      <span class=\"t-tree-view__copy\">\n        <span class=\"t-tree-view__label\">{{ node.label }}</span>\n        <span\n          v-if=\"node.description\"\n          class=\"t-tree-view__description\"\n        >\n          {{ node.description }}\n        </span>\n      </span>\n\n      <span\n        v-if=\"node.meta\"\n        class=\"t-tree-view__meta\"\n      >\n        {{ node.meta }}\n      </span>\n    </div>\n\n    <ul\n      v-if=\"hasChildren && isExpanded\"\n      class=\"t-tree-view__group\"\n      role=\"group\"\n    >\n      <TTreeViewItem\n        v-for=\"child in node.children\"\n        :key=\"child.id\"\n        :node=\"child\"\n        :level=\"level + 1\"\n      />\n    </ul>\n  </li>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"TTreeViewItem.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TTreeViewItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getTreeIcon } from '@treeui/icons';\nimport { computed, inject, type ComponentPublicInstance } from 'vue';\nimport { treeTreeViewInjectionKey, type TTreeViewNode } from './tree-view';\n\ndefineOptions({\n  name: 'TTreeViewItem',\n});\n\nconst ChevronRightIcon = computed(() => getTreeIcon('chevron-right'));\nconst CheckIcon = computed(() => getTreeIcon('check'));\n\nconst props = defineProps<{\n  node: TTreeViewNode;\n  level: number;\n}>();\n\nconst ctx = inject(treeTreeViewInjectionKey);\n\nif (!ctx) {\n  throw new Error('[TreeUI] TTreeView items must be rendered inside a TTreeView.');\n}\n\nconst hasChildren = computed(() => Boolean(props.node.children?.length));\nconst isExpanded = computed(() => (hasChildren.value ? ctx.isExpanded(props.node.id) : false));\nconst isSelected = computed(() => ctx.isSelected(props.node.id));\nconst isDisabled = computed(() => ctx.disabled.value || props.node.disabled);\nconst isFocused = computed(() => ctx.focusedId.value === props.node.id);\nconst itemId = computed(() => `${ctx.baseId}-${props.node.id}`);\n\nconst rowClasses = computed(() => ({\n  'is-expanded': isExpanded.value,\n  'is-selected': isSelected.value,\n  'is-disabled': isDisabled.value,\n  'is-focused': isFocused.value,\n}));\n\nconst setItemRef = (element: Element | ComponentPublicInstance | null) => {\n  const resolvedElement =\n    element instanceof HTMLElement\n      ? element\n      : element && '$el' in element && element.$el instanceof HTMLElement\n        ? element.$el\n        : null;\n\n  if (resolvedElement instanceof HTMLElement) {\n    ctx.registerItem(props.node.id, resolvedElement);\n  } else {\n    ctx.unregisterItem(props.node.id);\n  }\n};\n\nconst onRowClick = () => {\n  ctx.setFocusedId(props.node.id);\n  ctx.toggleSelected(props.node.id);\n};\n\nconst onToggleClick = () => {\n  if (isDisabled.value || !hasChildren.value) {\n    return;\n  }\n\n  ctx.toggleExpanded(props.node.id);\n  ctx.setFocusedId(props.node.id);\n};\n</script>\n\n<template>\n  <li\n    class=\"t-tree-view__node\"\n    role=\"none\"\n  >\n    <div\n      :id=\"itemId\"\n      :ref=\"setItemRef\"\n      class=\"t-tree-view__row\"\n      :class=\"rowClasses\"\n      :style=\"{ '--tree-tree-view-level': `${level}` }\"\n      role=\"treeitem\"\n      :aria-level=\"level\"\n      :aria-expanded=\"hasChildren ? isExpanded : undefined\"\n      :aria-selected=\"isSelected\"\n      :aria-disabled=\"isDisabled || undefined\"\n      :tabindex=\"isDisabled ? -1 : isFocused ? 0 : -1\"\n      @click=\"onRowClick\"\n      @keydown=\"ctx.onItemKeydown($event, node.id)\"\n      @focus=\"ctx.setFocusedId(node.id)\"\n    >\n      <button\n        v-if=\"hasChildren\"\n        type=\"button\"\n        class=\"t-tree-view__toggle\"\n        :class=\"{ 'is-expanded': isExpanded }\"\n        tabindex=\"-1\"\n        :disabled=\"isDisabled\"\n        :aria-label=\"isExpanded ? 'Collapse node' : 'Expand node'\"\n        @click.stop=\"onToggleClick\"\n      >\n        <ChevronRightIcon :size=\"16\" />\n      </button>\n\n      <span\n        v-else\n        class=\"t-tree-view__spacer\"\n        aria-hidden=\"true\"\n      />\n\n      <span\n        class=\"t-tree-view__marker\"\n        :class=\"{\n          'is-selected': isSelected,\n          'is-multiple': ctx.selectionMode.value === 'multiple',\n        }\"\n        aria-hidden=\"true\"\n      >\n        <CheckIcon\n          v-if=\"ctx.selectionMode.value === 'multiple' && isSelected\"\n          :size=\"14\"\n        />\n      </span>\n\n      <span class=\"t-tree-view__copy\">\n        <span class=\"t-tree-view__label\">{{ node.label }}</span>\n        <span\n          v-if=\"node.description\"\n          class=\"t-tree-view__description\"\n        >\n          {{ node.description }}\n        </span>\n      </span>\n\n      <span\n        v-if=\"node.meta\"\n        class=\"t-tree-view__meta\"\n      >\n        {{ node.meta }}\n      </span>\n    </div>\n\n    <ul\n      v-if=\"hasChildren && isExpanded\"\n      class=\"t-tree-view__group\"\n      role=\"group\"\n    >\n      <TTreeViewItem\n        v-for=\"child in node.children\"\n        :key=\"child.id\"\n        :node=\"child\"\n        :level=\"level + 1\"\n      />\n    </ul>\n  </li>\n</template>\n"],"mappings":"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"}

package/dist/components/TTreeViewItem.vue_vue_type_script_setup_true_lang.js

@@ -34,7 +34,7 @@ var y = {
 		level: {}
 	},
 	setup(c) {
-		let O = v("chevron-right"), k = v("check"), A = c, j = l(e);
+		let O = n(() => v("chevron-right")), k = n(() => v("check")), A = c, j = l(e);
 		if (!j) throw Error("[TreeUI] TTreeView items must be rendered inside a TTreeView.");
 		let M = n(() => !!A.node.children?.length), N = n(() => M.value ? j.isExpanded(A.node.id) : !1), P = n(() => j.isSelected(A.node.id)), F = n(() => j.disabled.value || A.node.disabled), I = n(() => j.focusedId.value === A.node.id), L = n(() => `${j.baseId}-${A.node.id}`), R = n(() => ({
 			"is-expanded": N.value,