@treeui/vue 0.17.0 → 0.18.0

package/dist/components/TNavMenu.vue.d.ts

@@ -1,11 +1,16 @@
-import { Component } from 'vue';
+import { TIconInput } from '@treeui/icons';
 import { TSize } from '../types/contracts';
 export interface TNavMenuItem {
     label: string;
     value: string;
     shortLabel?: string;
     description?: string;
-    icon?: Component;
+    /**
+     * A registered icon name (`'cpu'`), or any component. A name is the simpler
+     * form: it needs no import and no `markRaw`, since a string is not made
+     * reactive when the item lands in a `ref`.
+     */
+    icon?: TIconInput;
     to?: string | Record<string, unknown>;
     badge?: string | number;
     disabled?: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"TNavMenu.vue.d.ts","sourceRoot":"","sources":["../../src/components/TNavMenu.vue"],"names":[],"mappings":"AAyVA,OAAO,EAAwE,KAAK,SAAS,EAAgC,MAAM,KAAK,CAAC;AACzI,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAOhD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACtC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,KAAK,WAAW,GAAG;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAsOJ,iBAAS,cAAc;WAkJT,OAAO,IAA6B;;eAnWzC,CAAC,KAAK,EAAE;YACb,IAAI,EAAE,YAAY,CAAC;YACnB,QAAQ,EAAE,OAAO,CAAC;YAClB,OAAO,EAAE,OAAO,CAAC;YACjB,SAAS,EAAE,OAAO,CAAC;SACpB,KAAK,OAAO;gBACL,MAAM,OAAO;;eANd,CAAC,KAAK,EAAE;YACb,IAAI,EAAE,YAAY,CAAC;YACnB,QAAQ,EAAE,OAAO,CAAC;YAClB,OAAO,EAAE,OAAO,CAAC;YACjB,SAAS,EAAE,OAAO,CAAC;SACpB,KAAK,OAAO;gBACL,MAAM,OAAO;;;;EAkWtB;AAuBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;gBA5ZJ,MAAM;kBACJ,MAAM;cAIV,OAAO;UAFX,KAAK;WADJ,YAAY,EAAE;WAId,OAAO;eAFH,OAAO;6EAgarB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"TNavMenu.vue.d.ts","sourceRoot":"","sources":["../../src/components/TNavMenu.vue"],"names":[],"mappings":"AAsWA,OAAO,EAAmB,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AAEjE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAOhD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACtC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,KAAK,WAAW,GAAG;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AA6OJ,iBAAS,cAAc;WAkJT,OAAO,IAA6B;;eA1WzC,CAAC,KAAK,EAAE;YACb,IAAI,EAAE,YAAY,CAAC;YACnB,QAAQ,EAAE,OAAO,CAAC;YAClB,OAAO,EAAE,OAAO,CAAC;YACjB,SAAS,EAAE,OAAO,CAAC;SACpB,KAAK,OAAO;gBACL,MAAM,OAAO;;eANd,CAAC,KAAK,EAAE;YACb,IAAI,EAAE,YAAY,CAAC;YACnB,QAAQ,EAAE,OAAO,CAAC;YAClB,OAAO,EAAE,OAAO,CAAC;YACjB,SAAS,EAAE,OAAO,CAAC;SACpB,KAAK,OAAO;gBACL,MAAM,OAAO;;;;EAyWtB;AAwBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;gBApaJ,MAAM;kBACJ,MAAM;cAIV,OAAO;UAFX,KAAK;WADJ,YAAY,EAAE;WAId,OAAO;eAFH,OAAO;6EAwarB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/TNavMenu.vue_vue_type_script_setup_true_lang.cjs

@@ -1,2 +1,2 @@
-const e=require("./sidebar.cjs");let t=require("vue"),n=require("@treeui/utils");var r={key:0,class:`t-nav-menu__list`},i={key:1,class:`t-nav-menu__marker`,"aria-hidden":`true`},a={class:`t-nav-menu__copy`},o={class:`t-nav-menu__label`},s={key:0,class:`t-nav-menu__description`},c={key:2,class:`t-nav-menu__badge`},l={key:1,class:`t-nav-menu__empty`},u=(0,t.defineComponent)({inheritAttrs:!1,__name:`TNavMenu`,props:{modelValue:{default:void 0},defaultValue:{default:``},items:{default:()=>[]},size:{default:`md`},collapsed:{type:Boolean,default:void 0},disabled:{type:Boolean,default:!1},exact:{type:Boolean,default:!0}},emits:[`update:modelValue`,`select`],setup(u,{emit:d}){let f=u,p=d,m=(0,t.useAttrs)(),h=(0,t.inject)(e.treeSidebarInjectionKey,null),g=(0,t.ref)(f.defaultValue),_=(0,t.ref)(new Map),v=(0,t.getCurrentInstance)(),y=(0,t.computed)(()=>f.modelValue??g.value),b=(0,t.computed)(()=>f.collapsed??h?.collapsed.value??!1),x=(0,t.computed)(()=>v?.appContext.components.RouterLink??null),S=e=>e.to&&x.value?x.value:`button`,C=e=>!!e.to&&x.value!==null,w=e=>{if(C(e))return f.modelValue===void 0?e.exact??f.exact?``:`is-selected`:``},T=e=>{if(C(e))return f.modelValue===void 0?`is-selected`:``},E=()=>{let e=f.items.findIndex(e=>e.value===y.value&&!e.disabled);return e>=0?e:f.items.findIndex(e=>!e.disabled)},D=(0,t.ref)(E()),O=(0,t.computed)(()=>[`t-nav-menu`,`t-nav-menu--${f.size}`,{"is-collapsed":b.value,"is-disabled":f.disabled},m.class]),k=(0,t.computed)(()=>m.style),A=(0,t.computed)(()=>{let{class:e,style:t,...n}=m;return n}),j=e=>y.value===e,M=(e,t)=>{let n=e instanceof HTMLElement?e:e&&`$el`in e&&e.$el instanceof HTMLElement?e.$el:null;n?_.value.set(t,n):_.value.delete(t)},N=e=>{let n=f.items[e];n&&(D.value=e,(0,t.nextTick)(()=>_.value.get(n.value)?.focus()))},P=e=>{f.disabled||e.disabled||(f.modelValue===void 0&&(g.value=e.value),p(`update:modelValue`,e.value),p(`select`,e.value,e))},F=(e,t)=>{if(!f.disabled){if(e.key===`Home`){e.preventDefault();let t=f.items.findIndex(e=>!e.disabled);t>=0&&N(t);return}if(e.key===`End`){e.preventDefault();let t=[...f.items].reverse().findIndex(e=>!e.disabled);t>=0&&N(f.items.length-1-t);return}if(e.key===`ArrowDown`||e.key===`ArrowRight`){e.preventDefault();let r=(0,n.getNextEnabledIndex)(t,f.items,1);r>=0&&N(r);return}if(e.key===`ArrowUp`||e.key===`ArrowLeft`){e.preventDefault();let r=(0,n.getNextEnabledIndex)(t,f.items,-1);r>=0&&N(r);return}(0,n.isActivationKey)(e)&&(e.preventDefault(),P(f.items[t]))}},I=e=>D.value===e?0:-1;return(0,t.watch)(()=>[f.items,f.modelValue],()=>{let e=E();D.value=e>=0?e:-1},{deep:!0}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`nav`,(0,t.mergeProps)(A.value,{class:O.value,style:k.value}),[u.items.length>0?((0,t.openBlock)(),(0,t.createElementBlock)(`ul`,r,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(u.items,(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`li`,{key:n.value,class:`t-nav-menu__entry`},[((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(S(n)),{ref_for:!0,ref:e=>M(e,n.value),type:n.to?void 0:`button`,to:n.to||void 0,class:(0,t.normalizeClass)([`t-nav-menu__item`,{"is-selected":j(n.value),"is-disabled":u.disabled||n.disabled}]),"active-class":w(n),"exact-active-class":T(n),disabled:!n.to&&(u.disabled||n.disabled)||void 0,"aria-disabled":n.to&&(u.disabled||n.disabled)||void 0,"aria-current":j(n.value)?`page`:void 0,tabindex:u.disabled||n.disabled?-1:I(r),title:b.value?n.label:void 0,onClick:e=>P(n),onKeydown:e=>F(e,r),onFocus:e=>D.value=r},{default:(0,t.withCtx)(()=>[(0,t.renderSlot)(e.$slots,`item`,{item:n,selected:j(n.value),focused:D.value===r,collapsed:b.value},()=>[n.icon?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(n.icon),{key:0,class:`t-nav-menu__icon`,"aria-hidden":`true`})):((0,t.openBlock)(),(0,t.createElementBlock)(`span`,i,(0,t.toDisplayString)((n.shortLabel??n.label.charAt(0)).toUpperCase()),1)),(0,t.createElementVNode)(`span`,a,[(0,t.createElementVNode)(`span`,o,(0,t.toDisplayString)(n.label),1),n.description?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,s,(0,t.toDisplayString)(n.description),1)):(0,t.createCommentVNode)(``,!0)]),n.badge!==void 0&&n.badge!==null?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,c,(0,t.toDisplayString)(n.badge),1)):(0,t.createCommentVNode)(``,!0)])]),_:2},1064,[`type`,`to`,`class`,`active-class`,`exact-active-class`,`disabled`,`aria-disabled`,`aria-current`,`tabindex`,`title`,`onClick`,`onKeydown`,`onFocus`]))]))),128))])):((0,t.openBlock)(),(0,t.createElementBlock)(`div`,l,[(0,t.renderSlot)(e.$slots,`empty`,{},()=>[n[0]||=(0,t.createTextVNode)(` No navigation items. `,-1)])]))],16))}});exports.default=u;
+const e=require("./sidebar.cjs");let t=require("vue"),n=require("@treeui/utils"),r=require("@treeui/icons");var i={key:0,class:`t-nav-menu__list`},a={key:1,class:`t-nav-menu__marker`,"aria-hidden":`true`},o={class:`t-nav-menu__copy`},s={class:`t-nav-menu__label`},c={key:0,class:`t-nav-menu__description`},l={key:2,class:`t-nav-menu__badge`},u={key:1,class:`t-nav-menu__empty`},d=(0,t.defineComponent)({inheritAttrs:!1,__name:`TNavMenu`,props:{modelValue:{default:void 0},defaultValue:{default:``},items:{default:()=>[]},size:{default:`md`},collapsed:{type:Boolean,default:void 0},disabled:{type:Boolean,default:!1},exact:{type:Boolean,default:!0}},emits:[`update:modelValue`,`select`],setup(d,{emit:f}){let p=d,m=f,h=e=>(0,r.resolveTreeIcon)(e.icon),g=(0,t.useAttrs)(),_=(0,t.inject)(e.treeSidebarInjectionKey,null),v=(0,t.ref)(p.defaultValue),y=(0,t.ref)(new Map),b=(0,t.getCurrentInstance)(),x=(0,t.computed)(()=>p.modelValue??v.value),S=(0,t.computed)(()=>p.collapsed??_?.collapsed.value??!1),C=(0,t.computed)(()=>b?.appContext.components.RouterLink??null),w=e=>e.to&&C.value?C.value:`button`,T=e=>!!e.to&&C.value!==null,E=e=>{if(T(e))return p.modelValue===void 0?e.exact??p.exact?``:`is-selected`:``},D=e=>{if(T(e))return p.modelValue===void 0?`is-selected`:``},O=()=>{let e=p.items.findIndex(e=>e.value===x.value&&!e.disabled);return e>=0?e:p.items.findIndex(e=>!e.disabled)},k=(0,t.ref)(O()),A=(0,t.computed)(()=>[`t-nav-menu`,`t-nav-menu--${p.size}`,{"is-collapsed":S.value,"is-disabled":p.disabled},g.class]),j=(0,t.computed)(()=>g.style),M=(0,t.computed)(()=>{let{class:e,style:t,...n}=g;return n}),N=e=>x.value===e,P=(e,t)=>{let n=e instanceof HTMLElement?e:e&&`$el`in e&&e.$el instanceof HTMLElement?e.$el:null;n?y.value.set(t,n):y.value.delete(t)},F=e=>{let n=p.items[e];n&&(k.value=e,(0,t.nextTick)(()=>y.value.get(n.value)?.focus()))},I=e=>{p.disabled||e.disabled||(p.modelValue===void 0&&(v.value=e.value),m(`update:modelValue`,e.value),m(`select`,e.value,e))},L=(e,t)=>{if(!p.disabled){if(e.key===`Home`){e.preventDefault();let t=p.items.findIndex(e=>!e.disabled);t>=0&&F(t);return}if(e.key===`End`){e.preventDefault();let t=[...p.items].reverse().findIndex(e=>!e.disabled);t>=0&&F(p.items.length-1-t);return}if(e.key===`ArrowDown`||e.key===`ArrowRight`){e.preventDefault();let r=(0,n.getNextEnabledIndex)(t,p.items,1);r>=0&&F(r);return}if(e.key===`ArrowUp`||e.key===`ArrowLeft`){e.preventDefault();let r=(0,n.getNextEnabledIndex)(t,p.items,-1);r>=0&&F(r);return}(0,n.isActivationKey)(e)&&(e.preventDefault(),I(p.items[t]))}},R=e=>k.value===e?0:-1;return(0,t.watch)(()=>[p.items,p.modelValue],()=>{let e=O();k.value=e>=0?e:-1},{deep:!0}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`nav`,(0,t.mergeProps)(M.value,{class:A.value,style:j.value}),[d.items.length>0?((0,t.openBlock)(),(0,t.createElementBlock)(`ul`,i,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(d.items,(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`li`,{key:n.value,class:`t-nav-menu__entry`},[((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(w(n)),{ref_for:!0,ref:e=>P(e,n.value),type:n.to?void 0:`button`,to:n.to||void 0,class:(0,t.normalizeClass)([`t-nav-menu__item`,{"is-selected":N(n.value),"is-disabled":d.disabled||n.disabled}]),"active-class":E(n),"exact-active-class":D(n),disabled:!n.to&&(d.disabled||n.disabled)||void 0,"aria-disabled":n.to&&(d.disabled||n.disabled)||void 0,"aria-current":N(n.value)?`page`:void 0,tabindex:d.disabled||n.disabled?-1:R(r),title:S.value?n.label:void 0,onClick:e=>I(n),onKeydown:e=>L(e,r),onFocus:e=>k.value=r},{default:(0,t.withCtx)(()=>[(0,t.renderSlot)(e.$slots,`item`,{item:n,selected:N(n.value),focused:k.value===r,collapsed:S.value},()=>[h(n)?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(h(n)),{key:0,class:`t-nav-menu__icon`,"aria-hidden":`true`})):((0,t.openBlock)(),(0,t.createElementBlock)(`span`,a,(0,t.toDisplayString)((n.shortLabel??n.label.charAt(0)).toUpperCase()),1)),(0,t.createElementVNode)(`span`,o,[(0,t.createElementVNode)(`span`,s,(0,t.toDisplayString)(n.label),1),n.description?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,c,(0,t.toDisplayString)(n.description),1)):(0,t.createCommentVNode)(``,!0)]),n.badge!==void 0&&n.badge!==null?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,l,(0,t.toDisplayString)(n.badge),1)):(0,t.createCommentVNode)(``,!0)])]),_:2},1064,[`type`,`to`,`class`,`active-class`,`exact-active-class`,`disabled`,`aria-disabled`,`aria-current`,`tabindex`,`title`,`onClick`,`onKeydown`,`onFocus`]))]))),128))])):((0,t.openBlock)(),(0,t.createElementBlock)(`div`,u,[(0,t.renderSlot)(e.$slots,`empty`,{},()=>[n[0]||=(0,t.createTextVNode)(` No navigation items. `,-1)])]))],16))}});exports.default=d;
 //# sourceMappingURL=TNavMenu.vue_vue_type_script_setup_true_lang.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"TNavMenu.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TNavMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getNextEnabledIndex, isActivationKey } from '@treeui/utils';\nimport { computed, getCurrentInstance, inject, nextTick, ref, useAttrs, watch, type Component, type ComponentPublicInstance } from 'vue';\nimport type { TSize } from '../types/contracts';\nimport { treeSidebarInjectionKey } from './sidebar';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TNavMenuItem {\n  label: string;\n  value: string;\n  shortLabel?: string;\n  description?: string;\n  icon?: Component;\n  to?: string | Record<string, unknown>;\n  badge?: string | number;\n  disabled?: boolean;\n  /**\n   * When the item renders as a router link, controls whether an inclusive\n   * (prefix) route match also marks it active. Defaults to the menu-level\n   * `exact` prop. Set to `false` for section roots that should stay active on\n   * nested routes.\n   */\n  exact?: boolean;\n}\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TNavMenuItem[];\n    size?: TSize;\n    collapsed?: boolean;\n    disabled?: boolean;\n    exact?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    collapsed: undefined,\n    disabled: false,\n    exact: true,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n  select: [value: string, item: TNavMenuItem];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TNavMenuItem;\n    selected: boolean;\n    focused: boolean;\n    collapsed: boolean;\n  }) => unknown;\n  empty?: () => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst sidebar = inject(treeSidebarInjectionKey, null);\nconst internalValue = ref(props.defaultValue);\nconst itemRefs = ref<Map<string, HTMLElement>>(new Map());\nconst instance = getCurrentInstance();\n\nconst selectedValue = computed(() => props.modelValue ?? internalValue.value);\nconst resolvedCollapsed = computed(() => props.collapsed ?? sidebar?.collapsed.value ?? false);\n\nconst routerLinkComponent = computed<Component | null>(() => (\n  (instance?.appContext.components.RouterLink as Component | undefined) ?? null\n));\n\nconst itemTag = (item: TNavMenuItem) => {\n  if (item.to && routerLinkComponent.value) {\n    return routerLinkComponent.value;\n  }\n  return 'button';\n};\n\nconst isRouterLinkItem = (item: TNavMenuItem) =>\n  Boolean(item.to) && routerLinkComponent.value !== null;\n\n// Keep the active highlight deterministic when items render as router links.\n// Vue Router's default `router-link-active` uses inclusive (prefix) matching,\n// so several links can appear active at once. We map the router's active\n// classes onto TreeUI's own `is-selected`:\n// - Controlled menus (explicit `modelValue`) own selection, so the router adds\n//   no class of its own — only the bound `is-selected` shows.\n// - Uncontrolled menus let the current route drive selection, using exact\n//   matching by default (opt out per item, or menu-wide, via `exact`).\nconst routerActiveClass = (item: TNavMenuItem) => {\n  if (!isRouterLinkItem(item)) {\n    return undefined;\n  }\n\n  if (props.modelValue !== undefined) {\n    return '';\n  }\n\n  return (item.exact ?? props.exact) ? '' : 'is-selected';\n};\n\nconst routerExactActiveClass = (item: TNavMenuItem) => {\n  if (!isRouterLinkItem(item)) {\n    return undefined;\n  }\n\n  return props.modelValue !== undefined ? '' : 'is-selected';\n};\n\nconst getInitialFocusedIndex = () => {\n  const selectedIndex = props.items.findIndex((item) =>\n    item.value === selectedValue.value && !item.disabled,\n  );\n\n  if (selectedIndex >= 0) {\n    return selectedIndex;\n  }\n\n  return props.items.findIndex((item) => !item.disabled);\n};\n\nconst focusedIndex = ref(getInitialFocusedIndex());\n\nconst rootClasses = computed(() => [\n  't-nav-menu',\n  `t-nav-menu--${props.size}`,\n  {\n    'is-collapsed': resolvedCollapsed.value,\n    'is-disabled': props.disabled,\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 isSelected = (value: string) => selectedValue.value === value;\n\nconst setItemRef = (element: Element | ComponentPublicInstance | null, value: string) => {\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) {\n    itemRefs.value.set(value, resolvedElement);\n  } else {\n    itemRefs.value.delete(value);\n  }\n};\n\nconst focusItem = (index: number) => {\n  const item = props.items[index];\n\n  if (!item) {\n    return;\n  }\n\n  focusedIndex.value = index;\n  nextTick(() => itemRefs.value.get(item.value)?.focus());\n};\n\nconst selectItem = (item: TNavMenuItem) => {\n  if (props.disabled || 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  emit('select', item.value, item);\n};\n\nconst onItemKeydown = (event: KeyboardEvent, index: number) => {\n  if (props.disabled) {\n    return;\n  }\n\n  if (event.key === 'Home') {\n    event.preventDefault();\n    const firstIndex = props.items.findIndex((item) => !item.disabled);\n\n    if (firstIndex >= 0) {\n      focusItem(firstIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'End') {\n    event.preventDefault();\n    const lastIndex = [...props.items].reverse().findIndex((item) => !item.disabled);\n\n    if (lastIndex >= 0) {\n      focusItem(props.items.length - 1 - lastIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n    event.preventDefault();\n    const nextIndex = getNextEnabledIndex(index, props.items, 1);\n\n    if (nextIndex >= 0) {\n      focusItem(nextIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n    event.preventDefault();\n    const previousIndex = getNextEnabledIndex(index, props.items, -1);\n\n    if (previousIndex >= 0) {\n      focusItem(previousIndex);\n    }\n\n    return;\n  }\n\n  if (isActivationKey(event)) {\n    event.preventDefault();\n    selectItem(props.items[index]);\n  }\n};\n\nconst getTabIndex = (index: number) => (focusedIndex.value === index ? 0 : -1);\n\nwatch(\n  () => [props.items, props.modelValue] as const,\n  () => {\n    const nextIndex = getInitialFocusedIndex();\n    focusedIndex.value = nextIndex >= 0 ? nextIndex : -1;\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <nav\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <ul\n      v-if=\"items.length > 0\"\n      class=\"t-nav-menu__list\"\n    >\n      <li\n        v-for=\"(item, index) in items\"\n        :key=\"item.value\"\n        class=\"t-nav-menu__entry\"\n      >\n        <component\n          :is=\"itemTag(item)\"\n          :ref=\"(element: Element | ComponentPublicInstance | null) => setItemRef(element, item.value)\"\n          :type=\"item.to ? undefined : 'button'\"\n          :to=\"item.to || undefined\"\n          class=\"t-nav-menu__item\"\n          :class=\"{\n            'is-selected': isSelected(item.value),\n            'is-disabled': disabled || item.disabled,\n          }\"\n          :active-class=\"routerActiveClass(item)\"\n          :exact-active-class=\"routerExactActiveClass(item)\"\n          :disabled=\"(!item.to && (disabled || item.disabled)) || undefined\"\n          :aria-disabled=\"(item.to && (disabled || item.disabled)) || undefined\"\n          :aria-current=\"isSelected(item.value) ? 'page' : undefined\"\n          :tabindex=\"disabled || item.disabled ? -1 : getTabIndex(index)\"\n          :title=\"resolvedCollapsed ? item.label : undefined\"\n          @click=\"selectItem(item)\"\n          @keydown=\"onItemKeydown($event, index)\"\n          @focus=\"focusedIndex = index\"\n        >\n          <slot\n            name=\"item\"\n            :item=\"item\"\n            :selected=\"isSelected(item.value)\"\n            :focused=\"focusedIndex === index\"\n            :collapsed=\"resolvedCollapsed\"\n          >\n            <component\n              :is=\"item.icon\"\n              v-if=\"item.icon\"\n              class=\"t-nav-menu__icon\"\n              aria-hidden=\"true\"\n            />\n            <span\n              v-else\n              class=\"t-nav-menu__marker\"\n              aria-hidden=\"true\"\n            >\n              {{ (item.shortLabel ?? item.label.charAt(0)).toUpperCase() }}\n            </span>\n\n            <span class=\"t-nav-menu__copy\">\n              <span class=\"t-nav-menu__label\">{{ item.label }}</span>\n              <span\n                v-if=\"item.description\"\n                class=\"t-nav-menu__description\"\n              >\n                {{ item.description }}\n              </span>\n            </span>\n\n            <span\n              v-if=\"item.badge !== undefined && item.badge !== null\"\n              class=\"t-nav-menu__badge\"\n            >\n              {{ item.badge }}\n            </span>\n          </slot>\n        </component>\n      </li>\n    </ul>\n\n    <div\n      v-else\n      class=\"t-nav-menu__empty\"\n    >\n      <slot name=\"empty\">\n        No navigation items.\n      </slot>\n    </div>\n  </nav>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"TNavMenu.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TNavMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getNextEnabledIndex, isActivationKey } from '@treeui/utils';\nimport { resolveTreeIcon, type TIconInput } from '@treeui/icons';\nimport { computed, getCurrentInstance, inject, nextTick, ref, useAttrs, watch, type Component, type ComponentPublicInstance } from 'vue';\nimport type { TSize } from '../types/contracts';\nimport { treeSidebarInjectionKey } from './sidebar';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TNavMenuItem {\n  label: string;\n  value: string;\n  shortLabel?: string;\n  description?: string;\n  /**\n   * A registered icon name (`'cpu'`), or any component. A name is the simpler\n   * form: it needs no import and no `markRaw`, since a string is not made\n   * reactive when the item lands in a `ref`.\n   */\n  icon?: TIconInput;\n  to?: string | Record<string, unknown>;\n  badge?: string | number;\n  disabled?: boolean;\n  /**\n   * When the item renders as a router link, controls whether an inclusive\n   * (prefix) route match also marks it active. Defaults to the menu-level\n   * `exact` prop. Set to `false` for section roots that should stay active on\n   * nested routes.\n   */\n  exact?: boolean;\n}\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TNavMenuItem[];\n    size?: TSize;\n    collapsed?: boolean;\n    disabled?: boolean;\n    exact?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    collapsed: undefined,\n    disabled: false,\n    exact: true,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n  select: [value: string, item: TNavMenuItem];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TNavMenuItem;\n    selected: boolean;\n    focused: boolean;\n    collapsed: boolean;\n  }) => unknown;\n  empty?: () => unknown;\n}>();\n\n/**\n * A registry lookup, so it stays cheap enough to call from the template. An\n * unresolved name returns `undefined` and the item falls back to its letter\n * marker rather than rendering a hole.\n */\nconst iconFor = (item: TNavMenuItem) => resolveTreeIcon(item.icon);\n\nconst attrs = useAttrs();\nconst sidebar = inject(treeSidebarInjectionKey, null);\nconst internalValue = ref(props.defaultValue);\nconst itemRefs = ref<Map<string, HTMLElement>>(new Map());\nconst instance = getCurrentInstance();\n\nconst selectedValue = computed(() => props.modelValue ?? internalValue.value);\nconst resolvedCollapsed = computed(() => props.collapsed ?? sidebar?.collapsed.value ?? false);\n\nconst routerLinkComponent = computed<Component | null>(() => (\n  (instance?.appContext.components.RouterLink as Component | undefined) ?? null\n));\n\nconst itemTag = (item: TNavMenuItem) => {\n  if (item.to && routerLinkComponent.value) {\n    return routerLinkComponent.value;\n  }\n  return 'button';\n};\n\nconst isRouterLinkItem = (item: TNavMenuItem) =>\n  Boolean(item.to) && routerLinkComponent.value !== null;\n\n// Keep the active highlight deterministic when items render as router links.\n// Vue Router's default `router-link-active` uses inclusive (prefix) matching,\n// so several links can appear active at once. We map the router's active\n// classes onto TreeUI's own `is-selected`:\n// - Controlled menus (explicit `modelValue`) own selection, so the router adds\n//   no class of its own — only the bound `is-selected` shows.\n// - Uncontrolled menus let the current route drive selection, using exact\n//   matching by default (opt out per item, or menu-wide, via `exact`).\nconst routerActiveClass = (item: TNavMenuItem) => {\n  if (!isRouterLinkItem(item)) {\n    return undefined;\n  }\n\n  if (props.modelValue !== undefined) {\n    return '';\n  }\n\n  return (item.exact ?? props.exact) ? '' : 'is-selected';\n};\n\nconst routerExactActiveClass = (item: TNavMenuItem) => {\n  if (!isRouterLinkItem(item)) {\n    return undefined;\n  }\n\n  return props.modelValue !== undefined ? '' : 'is-selected';\n};\n\nconst getInitialFocusedIndex = () => {\n  const selectedIndex = props.items.findIndex((item) =>\n    item.value === selectedValue.value && !item.disabled,\n  );\n\n  if (selectedIndex >= 0) {\n    return selectedIndex;\n  }\n\n  return props.items.findIndex((item) => !item.disabled);\n};\n\nconst focusedIndex = ref(getInitialFocusedIndex());\n\nconst rootClasses = computed(() => [\n  't-nav-menu',\n  `t-nav-menu--${props.size}`,\n  {\n    'is-collapsed': resolvedCollapsed.value,\n    'is-disabled': props.disabled,\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 isSelected = (value: string) => selectedValue.value === value;\n\nconst setItemRef = (element: Element | ComponentPublicInstance | null, value: string) => {\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) {\n    itemRefs.value.set(value, resolvedElement);\n  } else {\n    itemRefs.value.delete(value);\n  }\n};\n\nconst focusItem = (index: number) => {\n  const item = props.items[index];\n\n  if (!item) {\n    return;\n  }\n\n  focusedIndex.value = index;\n  nextTick(() => itemRefs.value.get(item.value)?.focus());\n};\n\nconst selectItem = (item: TNavMenuItem) => {\n  if (props.disabled || 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  emit('select', item.value, item);\n};\n\nconst onItemKeydown = (event: KeyboardEvent, index: number) => {\n  if (props.disabled) {\n    return;\n  }\n\n  if (event.key === 'Home') {\n    event.preventDefault();\n    const firstIndex = props.items.findIndex((item) => !item.disabled);\n\n    if (firstIndex >= 0) {\n      focusItem(firstIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'End') {\n    event.preventDefault();\n    const lastIndex = [...props.items].reverse().findIndex((item) => !item.disabled);\n\n    if (lastIndex >= 0) {\n      focusItem(props.items.length - 1 - lastIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n    event.preventDefault();\n    const nextIndex = getNextEnabledIndex(index, props.items, 1);\n\n    if (nextIndex >= 0) {\n      focusItem(nextIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n    event.preventDefault();\n    const previousIndex = getNextEnabledIndex(index, props.items, -1);\n\n    if (previousIndex >= 0) {\n      focusItem(previousIndex);\n    }\n\n    return;\n  }\n\n  if (isActivationKey(event)) {\n    event.preventDefault();\n    selectItem(props.items[index]);\n  }\n};\n\nconst getTabIndex = (index: number) => (focusedIndex.value === index ? 0 : -1);\n\nwatch(\n  () => [props.items, props.modelValue] as const,\n  () => {\n    const nextIndex = getInitialFocusedIndex();\n    focusedIndex.value = nextIndex >= 0 ? nextIndex : -1;\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <nav\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <ul\n      v-if=\"items.length > 0\"\n      class=\"t-nav-menu__list\"\n    >\n      <li\n        v-for=\"(item, index) in items\"\n        :key=\"item.value\"\n        class=\"t-nav-menu__entry\"\n      >\n        <component\n          :is=\"itemTag(item)\"\n          :ref=\"(element: Element | ComponentPublicInstance | null) => setItemRef(element, item.value)\"\n          :type=\"item.to ? undefined : 'button'\"\n          :to=\"item.to || undefined\"\n          class=\"t-nav-menu__item\"\n          :class=\"{\n            'is-selected': isSelected(item.value),\n            'is-disabled': disabled || item.disabled,\n          }\"\n          :active-class=\"routerActiveClass(item)\"\n          :exact-active-class=\"routerExactActiveClass(item)\"\n          :disabled=\"(!item.to && (disabled || item.disabled)) || undefined\"\n          :aria-disabled=\"(item.to && (disabled || item.disabled)) || undefined\"\n          :aria-current=\"isSelected(item.value) ? 'page' : undefined\"\n          :tabindex=\"disabled || item.disabled ? -1 : getTabIndex(index)\"\n          :title=\"resolvedCollapsed ? item.label : undefined\"\n          @click=\"selectItem(item)\"\n          @keydown=\"onItemKeydown($event, index)\"\n          @focus=\"focusedIndex = index\"\n        >\n          <slot\n            name=\"item\"\n            :item=\"item\"\n            :selected=\"isSelected(item.value)\"\n            :focused=\"focusedIndex === index\"\n            :collapsed=\"resolvedCollapsed\"\n          >\n            <component\n              :is=\"iconFor(item)\"\n              v-if=\"iconFor(item)\"\n              class=\"t-nav-menu__icon\"\n              aria-hidden=\"true\"\n            />\n            <span\n              v-else\n              class=\"t-nav-menu__marker\"\n              aria-hidden=\"true\"\n            >\n              {{ (item.shortLabel ?? item.label.charAt(0)).toUpperCase() }}\n            </span>\n\n            <span class=\"t-nav-menu__copy\">\n              <span class=\"t-nav-menu__label\">{{ item.label }}</span>\n              <span\n                v-if=\"item.description\"\n                class=\"t-nav-menu__description\"\n              >\n                {{ item.description }}\n              </span>\n            </span>\n\n            <span\n              v-if=\"item.badge !== undefined && item.badge !== null\"\n              class=\"t-nav-menu__badge\"\n            >\n              {{ item.badge }}\n            </span>\n          </slot>\n        </component>\n      </li>\n    </ul>\n\n    <div\n      v-else\n      class=\"t-nav-menu__empty\"\n    >\n      <slot name=\"empty\">\n        No navigation items.\n      </slot>\n    </div>\n  </nav>\n</template>\n"],"mappings":"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"}

package/dist/components/TNavMenu.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,7 @@
 import { treeSidebarInjectionKey as e } from "./sidebar.js";
-import { Fragment as t, computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, defineComponent as c, getCurrentInstance as l, inject as u, mergeProps as d, nextTick as f, normalizeClass as p, openBlock as m, ref as h, renderList as g, renderSlot as _, resolveDynamicComponent as v, toDisplayString as y, useAttrs as b, watch as x, withCtx as S } from "vue";
-import { getNextEnabledIndex as C, isActivationKey as w } from "@treeui/utils";
+import { Fragment as t, computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, defineComponent as c, getCurrentInstance as l, inject as u, mergeProps as d, nextTick as f, normalizeClass as p, openBlock as m, ref as h, renderList as ee, renderSlot as g, resolveDynamicComponent as _, toDisplayString as v, useAttrs as y, watch as b, withCtx as x } from "vue";
+import { getNextEnabledIndex as S, isActivationKey as C } from "@treeui/utils";
+import { resolveTreeIcon as w } from "@treeui/icons";
 //#region src/components/TNavMenu.vue?vue&type=script&setup=true&lang.ts
 var T = {
 	key: 0,
@@ -9,7 +10,7 @@ var T = {
 	key: 1,
 	class: "t-nav-menu__marker",
 	"aria-hidden": "true"
-}, D = { class: "t-nav-menu__copy" }, ee = { class: "t-nav-menu__label" }, te = {
+}, D = { class: "t-nav-menu__copy" }, te = { class: "t-nav-menu__label" }, ne = {
 	key: 0,
 	class: "t-nav-menu__description"
 }, O = {
@@ -41,33 +42,33 @@ var T = {
 	},
 	emits: ["update:modelValue", "select"],
 	setup(c, { emit: A }) {
-		let j = c, M = A, N = b(), P = u(e, null), F = h(j.defaultValue), I = h(/* @__PURE__ */ new Map()), L = l(), R = n(() => j.modelValue ?? F.value), z = n(() => j.collapsed ?? P?.collapsed.value ?? !1), B = n(() => L?.appContext.components.RouterLink ?? null), V = (e) => e.to && B.value ? B.value : "button", H = (e) => !!e.to && B.value !== null, U = (e) => {
-			if (H(e)) return j.modelValue === void 0 ? e.exact ?? j.exact ? "" : "is-selected" : "";
-		}, W = (e) => {
-			if (H(e)) return j.modelValue === void 0 ? "is-selected" : "";
-		}, G = () => {
-			let e = j.items.findIndex((e) => e.value === R.value && !e.disabled);
+		let j = c, M = A, N = (e) => w(e.icon), P = y(), F = u(e, null), I = h(j.defaultValue), L = h(/* @__PURE__ */ new Map()), R = l(), z = n(() => j.modelValue ?? I.value), B = n(() => j.collapsed ?? F?.collapsed.value ?? !1), V = n(() => R?.appContext.components.RouterLink ?? null), H = (e) => e.to && V.value ? V.value : "button", U = (e) => !!e.to && V.value !== null, W = (e) => {
+			if (U(e)) return j.modelValue === void 0 ? e.exact ?? j.exact ? "" : "is-selected" : "";
+		}, G = (e) => {
+			if (U(e)) return j.modelValue === void 0 ? "is-selected" : "";
+		}, K = () => {
+			let e = j.items.findIndex((e) => e.value === z.value && !e.disabled);
 			return e >= 0 ? e : j.items.findIndex((e) => !e.disabled);
-		}, K = h(G()), q = n(() => [
+		}, q = h(K()), J = n(() => [
 			"t-nav-menu",
 			`t-nav-menu--${j.size}`,
 			{
-				"is-collapsed": z.value,
+				"is-collapsed": B.value,
 				"is-disabled": j.disabled
 			},
-			N.class
-		]), J = n(() => N.style), Y = n(() => {
-			let { class: e, style: t, ...n } = N;
+			P.class
+		]), Y = n(() => P.style), X = n(() => {
+			let { class: e, style: t, ...n } = P;
 			return n;
-		}), X = (e) => R.value === e, Z = (e, t) => {
+		}), Z = (e) => z.value === e, re = (e, t) => {
 			let n = e instanceof HTMLElement ? e : e && "$el" in e && e.$el instanceof HTMLElement ? e.$el : null;
-			n ? I.value.set(t, n) : I.value.delete(t);
+			n ? L.value.set(t, n) : L.value.delete(t);
 		}, Q = (e) => {
 			let t = j.items[e];
-			t && (K.value = e, f(() => I.value.get(t.value)?.focus()));
+			t && (q.value = e, f(() => L.value.get(t.value)?.focus()));
 		}, $ = (e) => {
-			j.disabled || e.disabled || (j.modelValue === void 0 && (F.value = e.value), M("update:modelValue", e.value), M("select", e.value, e));
-		}, ne = (e, t) => {
+			j.disabled || e.disabled || (j.modelValue === void 0 && (I.value = e.value), M("update:modelValue", e.value), M("select", e.value, e));
+		}, ie = (e, t) => {
 			if (!j.disabled) {
 				if (e.key === "Home") {
 					e.preventDefault();
@@ -83,61 +84,61 @@ var T = {
 				}
 				if (e.key === "ArrowDown" || e.key === "ArrowRight") {
 					e.preventDefault();
-					let n = C(t, j.items, 1);
+					let n = S(t, j.items, 1);
 					n >= 0 && Q(n);
 					return;
 				}
 				if (e.key === "ArrowUp" || e.key === "ArrowLeft") {
 					e.preventDefault();
-					let n = C(t, j.items, -1);
+					let n = S(t, j.items, -1);
 					n >= 0 && Q(n);
 					return;
 				}
-				w(e) && (e.preventDefault(), $(j.items[t]));
+				C(e) && (e.preventDefault(), $(j.items[t]));
 			}
-		}, re = (e) => K.value === e ? 0 : -1;
-		return x(() => [j.items, j.modelValue], () => {
-			let e = G();
-			K.value = e >= 0 ? e : -1;
-		}, { deep: !0 }), (e, n) => (m(), a("nav", d(Y.value, {
-			class: q.value,
-			style: J.value
-		}), [c.items.length > 0 ? (m(), a("ul", T, [(m(!0), a(t, null, g(c.items, (t, n) => (m(), a("li", {
+		}, ae = (e) => q.value === e ? 0 : -1;
+		return b(() => [j.items, j.modelValue], () => {
+			let e = K();
+			q.value = e >= 0 ? e : -1;
+		}, { deep: !0 }), (e, n) => (m(), a("nav", d(X.value, {
+			class: J.value,
+			style: Y.value
+		}), [c.items.length > 0 ? (m(), a("ul", T, [(m(!0), a(t, null, ee(c.items, (t, n) => (m(), a("li", {
 			key: t.value,
 			class: "t-nav-menu__entry"
-		}, [(m(), r(v(V(t)), {
+		}, [(m(), r(_(H(t)), {
 			ref_for: !0,
-			ref: (e) => Z(e, t.value),
+			ref: (e) => re(e, t.value),
 			type: t.to ? void 0 : "button",
 			to: t.to || void 0,
 			class: p(["t-nav-menu__item", {
-				"is-selected": X(t.value),
+				"is-selected": Z(t.value),
 				"is-disabled": c.disabled || t.disabled
 			}]),
-			"active-class": U(t),
-			"exact-active-class": W(t),
+			"active-class": W(t),
+			"exact-active-class": G(t),
 			disabled: !t.to && (c.disabled || t.disabled) || void 0,
 			"aria-disabled": t.to && (c.disabled || t.disabled) || void 0,
-			"aria-current": X(t.value) ? "page" : void 0,
-			tabindex: c.disabled || t.disabled ? -1 : re(n),
-			title: z.value ? t.label : void 0,
+			"aria-current": Z(t.value) ? "page" : void 0,
+			tabindex: c.disabled || t.disabled ? -1 : ae(n),
+			title: B.value ? t.label : void 0,
 			onClick: (e) => $(t),
-			onKeydown: (e) => ne(e, n),
-			onFocus: (e) => K.value = n
+			onKeydown: (e) => ie(e, n),
+			onFocus: (e) => q.value = n
 		}, {
-			default: S(() => [_(e.$slots, "item", {
+			default: x(() => [g(e.$slots, "item", {
 				item: t,
-				selected: X(t.value),
-				focused: K.value === n,
-				collapsed: z.value
+				selected: Z(t.value),
+				focused: q.value === n,
+				collapsed: B.value
 			}, () => [
-				t.icon ? (m(), r(v(t.icon), {
+				N(t) ? (m(), r(_(N(t)), {
 					key: 0,
 					class: "t-nav-menu__icon",
 					"aria-hidden": "true"
-				})) : (m(), a("span", E, y((t.shortLabel ?? t.label.charAt(0)).toUpperCase()), 1)),
-				o("span", D, [o("span", ee, y(t.label), 1), t.description ? (m(), a("span", te, y(t.description), 1)) : i("", !0)]),
-				t.badge !== void 0 && t.badge !== null ? (m(), a("span", O, y(t.badge), 1)) : i("", !0)
+				})) : (m(), a("span", E, v((t.shortLabel ?? t.label.charAt(0)).toUpperCase()), 1)),
+				o("span", D, [o("span", te, v(t.label), 1), t.description ? (m(), a("span", ne, v(t.description), 1)) : i("", !0)]),
+				t.badge !== void 0 && t.badge !== null ? (m(), a("span", O, v(t.badge), 1)) : i("", !0)
 			])]),
 			_: 2
 		}, 1064, [
@@ -154,7 +155,7 @@ var T = {
 			"onClick",
 			"onKeydown",
 			"onFocus"
-		]))]))), 128))])) : (m(), a("div", k, [_(e.$slots, "empty", {}, () => [n[0] ||= s(" No navigation items. ", -1)])]))], 16));
+		]))]))), 128))])) : (m(), a("div", k, [g(e.$slots, "empty", {}, () => [n[0] ||= s(" No navigation items. ", -1)])]))], 16));
 	}
 });
 //#endregion

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

@@ -1 +1 @@
-{"version":3,"file":"TNavMenu.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../src/components/TNavMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getNextEnabledIndex, isActivationKey } from '@treeui/utils';\nimport { computed, getCurrentInstance, inject, nextTick, ref, useAttrs, watch, type Component, type ComponentPublicInstance } from 'vue';\nimport type { TSize } from '../types/contracts';\nimport { treeSidebarInjectionKey } from './sidebar';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TNavMenuItem {\n  label: string;\n  value: string;\n  shortLabel?: string;\n  description?: string;\n  icon?: Component;\n  to?: string | Record<string, unknown>;\n  badge?: string | number;\n  disabled?: boolean;\n  /**\n   * When the item renders as a router link, controls whether an inclusive\n   * (prefix) route match also marks it active. Defaults to the menu-level\n   * `exact` prop. Set to `false` for section roots that should stay active on\n   * nested routes.\n   */\n  exact?: boolean;\n}\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TNavMenuItem[];\n    size?: TSize;\n    collapsed?: boolean;\n    disabled?: boolean;\n    exact?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    collapsed: undefined,\n    disabled: false,\n    exact: true,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n  select: [value: string, item: TNavMenuItem];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TNavMenuItem;\n    selected: boolean;\n    focused: boolean;\n    collapsed: boolean;\n  }) => unknown;\n  empty?: () => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst sidebar = inject(treeSidebarInjectionKey, null);\nconst internalValue = ref(props.defaultValue);\nconst itemRefs = ref<Map<string, HTMLElement>>(new Map());\nconst instance = getCurrentInstance();\n\nconst selectedValue = computed(() => props.modelValue ?? internalValue.value);\nconst resolvedCollapsed = computed(() => props.collapsed ?? sidebar?.collapsed.value ?? false);\n\nconst routerLinkComponent = computed<Component | null>(() => (\n  (instance?.appContext.components.RouterLink as Component | undefined) ?? null\n));\n\nconst itemTag = (item: TNavMenuItem) => {\n  if (item.to && routerLinkComponent.value) {\n    return routerLinkComponent.value;\n  }\n  return 'button';\n};\n\nconst isRouterLinkItem = (item: TNavMenuItem) =>\n  Boolean(item.to) && routerLinkComponent.value !== null;\n\n// Keep the active highlight deterministic when items render as router links.\n// Vue Router's default `router-link-active` uses inclusive (prefix) matching,\n// so several links can appear active at once. We map the router's active\n// classes onto TreeUI's own `is-selected`:\n// - Controlled menus (explicit `modelValue`) own selection, so the router adds\n//   no class of its own — only the bound `is-selected` shows.\n// - Uncontrolled menus let the current route drive selection, using exact\n//   matching by default (opt out per item, or menu-wide, via `exact`).\nconst routerActiveClass = (item: TNavMenuItem) => {\n  if (!isRouterLinkItem(item)) {\n    return undefined;\n  }\n\n  if (props.modelValue !== undefined) {\n    return '';\n  }\n\n  return (item.exact ?? props.exact) ? '' : 'is-selected';\n};\n\nconst routerExactActiveClass = (item: TNavMenuItem) => {\n  if (!isRouterLinkItem(item)) {\n    return undefined;\n  }\n\n  return props.modelValue !== undefined ? '' : 'is-selected';\n};\n\nconst getInitialFocusedIndex = () => {\n  const selectedIndex = props.items.findIndex((item) =>\n    item.value === selectedValue.value && !item.disabled,\n  );\n\n  if (selectedIndex >= 0) {\n    return selectedIndex;\n  }\n\n  return props.items.findIndex((item) => !item.disabled);\n};\n\nconst focusedIndex = ref(getInitialFocusedIndex());\n\nconst rootClasses = computed(() => [\n  't-nav-menu',\n  `t-nav-menu--${props.size}`,\n  {\n    'is-collapsed': resolvedCollapsed.value,\n    'is-disabled': props.disabled,\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 isSelected = (value: string) => selectedValue.value === value;\n\nconst setItemRef = (element: Element | ComponentPublicInstance | null, value: string) => {\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) {\n    itemRefs.value.set(value, resolvedElement);\n  } else {\n    itemRefs.value.delete(value);\n  }\n};\n\nconst focusItem = (index: number) => {\n  const item = props.items[index];\n\n  if (!item) {\n    return;\n  }\n\n  focusedIndex.value = index;\n  nextTick(() => itemRefs.value.get(item.value)?.focus());\n};\n\nconst selectItem = (item: TNavMenuItem) => {\n  if (props.disabled || 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  emit('select', item.value, item);\n};\n\nconst onItemKeydown = (event: KeyboardEvent, index: number) => {\n  if (props.disabled) {\n    return;\n  }\n\n  if (event.key === 'Home') {\n    event.preventDefault();\n    const firstIndex = props.items.findIndex((item) => !item.disabled);\n\n    if (firstIndex >= 0) {\n      focusItem(firstIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'End') {\n    event.preventDefault();\n    const lastIndex = [...props.items].reverse().findIndex((item) => !item.disabled);\n\n    if (lastIndex >= 0) {\n      focusItem(props.items.length - 1 - lastIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n    event.preventDefault();\n    const nextIndex = getNextEnabledIndex(index, props.items, 1);\n\n    if (nextIndex >= 0) {\n      focusItem(nextIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n    event.preventDefault();\n    const previousIndex = getNextEnabledIndex(index, props.items, -1);\n\n    if (previousIndex >= 0) {\n      focusItem(previousIndex);\n    }\n\n    return;\n  }\n\n  if (isActivationKey(event)) {\n    event.preventDefault();\n    selectItem(props.items[index]);\n  }\n};\n\nconst getTabIndex = (index: number) => (focusedIndex.value === index ? 0 : -1);\n\nwatch(\n  () => [props.items, props.modelValue] as const,\n  () => {\n    const nextIndex = getInitialFocusedIndex();\n    focusedIndex.value = nextIndex >= 0 ? nextIndex : -1;\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <nav\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <ul\n      v-if=\"items.length > 0\"\n      class=\"t-nav-menu__list\"\n    >\n      <li\n        v-for=\"(item, index) in items\"\n        :key=\"item.value\"\n        class=\"t-nav-menu__entry\"\n      >\n        <component\n          :is=\"itemTag(item)\"\n          :ref=\"(element: Element | ComponentPublicInstance | null) => setItemRef(element, item.value)\"\n          :type=\"item.to ? undefined : 'button'\"\n          :to=\"item.to || undefined\"\n          class=\"t-nav-menu__item\"\n          :class=\"{\n            'is-selected': isSelected(item.value),\n            'is-disabled': disabled || item.disabled,\n          }\"\n          :active-class=\"routerActiveClass(item)\"\n          :exact-active-class=\"routerExactActiveClass(item)\"\n          :disabled=\"(!item.to && (disabled || item.disabled)) || undefined\"\n          :aria-disabled=\"(item.to && (disabled || item.disabled)) || undefined\"\n          :aria-current=\"isSelected(item.value) ? 'page' : undefined\"\n          :tabindex=\"disabled || item.disabled ? -1 : getTabIndex(index)\"\n          :title=\"resolvedCollapsed ? item.label : undefined\"\n          @click=\"selectItem(item)\"\n          @keydown=\"onItemKeydown($event, index)\"\n          @focus=\"focusedIndex = index\"\n        >\n          <slot\n            name=\"item\"\n            :item=\"item\"\n            :selected=\"isSelected(item.value)\"\n            :focused=\"focusedIndex === index\"\n            :collapsed=\"resolvedCollapsed\"\n          >\n            <component\n              :is=\"item.icon\"\n              v-if=\"item.icon\"\n              class=\"t-nav-menu__icon\"\n              aria-hidden=\"true\"\n            />\n            <span\n              v-else\n              class=\"t-nav-menu__marker\"\n              aria-hidden=\"true\"\n            >\n              {{ (item.shortLabel ?? item.label.charAt(0)).toUpperCase() }}\n            </span>\n\n            <span class=\"t-nav-menu__copy\">\n              <span class=\"t-nav-menu__label\">{{ item.label }}</span>\n              <span\n                v-if=\"item.description\"\n                class=\"t-nav-menu__description\"\n              >\n                {{ item.description }}\n              </span>\n            </span>\n\n            <span\n              v-if=\"item.badge !== undefined && item.badge !== null\"\n              class=\"t-nav-menu__badge\"\n            >\n              {{ item.badge }}\n            </span>\n          </slot>\n        </component>\n      </li>\n    </ul>\n\n    <div\n      v-else\n      class=\"t-nav-menu__empty\"\n    >\n      <slot name=\"empty\">\n        No navigation items.\n      </slot>\n    </div>\n  </nav>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"TNavMenu.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../src/components/TNavMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { getNextEnabledIndex, isActivationKey } from '@treeui/utils';\nimport { resolveTreeIcon, type TIconInput } from '@treeui/icons';\nimport { computed, getCurrentInstance, inject, nextTick, ref, useAttrs, watch, type Component, type ComponentPublicInstance } from 'vue';\nimport type { TSize } from '../types/contracts';\nimport { treeSidebarInjectionKey } from './sidebar';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TNavMenuItem {\n  label: string;\n  value: string;\n  shortLabel?: string;\n  description?: string;\n  /**\n   * A registered icon name (`'cpu'`), or any component. A name is the simpler\n   * form: it needs no import and no `markRaw`, since a string is not made\n   * reactive when the item lands in a `ref`.\n   */\n  icon?: TIconInput;\n  to?: string | Record<string, unknown>;\n  badge?: string | number;\n  disabled?: boolean;\n  /**\n   * When the item renders as a router link, controls whether an inclusive\n   * (prefix) route match also marks it active. Defaults to the menu-level\n   * `exact` prop. Set to `false` for section roots that should stay active on\n   * nested routes.\n   */\n  exact?: boolean;\n}\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    defaultValue?: string;\n    items?: TNavMenuItem[];\n    size?: TSize;\n    collapsed?: boolean;\n    disabled?: boolean;\n    exact?: boolean;\n  }>(),\n  {\n    modelValue: undefined,\n    defaultValue: '',\n    items: () => [],\n    size: 'md',\n    collapsed: undefined,\n    disabled: false,\n    exact: true,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n  select: [value: string, item: TNavMenuItem];\n}>();\n\ndefineSlots<{\n  item?: (props: {\n    item: TNavMenuItem;\n    selected: boolean;\n    focused: boolean;\n    collapsed: boolean;\n  }) => unknown;\n  empty?: () => unknown;\n}>();\n\n/**\n * A registry lookup, so it stays cheap enough to call from the template. An\n * unresolved name returns `undefined` and the item falls back to its letter\n * marker rather than rendering a hole.\n */\nconst iconFor = (item: TNavMenuItem) => resolveTreeIcon(item.icon);\n\nconst attrs = useAttrs();\nconst sidebar = inject(treeSidebarInjectionKey, null);\nconst internalValue = ref(props.defaultValue);\nconst itemRefs = ref<Map<string, HTMLElement>>(new Map());\nconst instance = getCurrentInstance();\n\nconst selectedValue = computed(() => props.modelValue ?? internalValue.value);\nconst resolvedCollapsed = computed(() => props.collapsed ?? sidebar?.collapsed.value ?? false);\n\nconst routerLinkComponent = computed<Component | null>(() => (\n  (instance?.appContext.components.RouterLink as Component | undefined) ?? null\n));\n\nconst itemTag = (item: TNavMenuItem) => {\n  if (item.to && routerLinkComponent.value) {\n    return routerLinkComponent.value;\n  }\n  return 'button';\n};\n\nconst isRouterLinkItem = (item: TNavMenuItem) =>\n  Boolean(item.to) && routerLinkComponent.value !== null;\n\n// Keep the active highlight deterministic when items render as router links.\n// Vue Router's default `router-link-active` uses inclusive (prefix) matching,\n// so several links can appear active at once. We map the router's active\n// classes onto TreeUI's own `is-selected`:\n// - Controlled menus (explicit `modelValue`) own selection, so the router adds\n//   no class of its own — only the bound `is-selected` shows.\n// - Uncontrolled menus let the current route drive selection, using exact\n//   matching by default (opt out per item, or menu-wide, via `exact`).\nconst routerActiveClass = (item: TNavMenuItem) => {\n  if (!isRouterLinkItem(item)) {\n    return undefined;\n  }\n\n  if (props.modelValue !== undefined) {\n    return '';\n  }\n\n  return (item.exact ?? props.exact) ? '' : 'is-selected';\n};\n\nconst routerExactActiveClass = (item: TNavMenuItem) => {\n  if (!isRouterLinkItem(item)) {\n    return undefined;\n  }\n\n  return props.modelValue !== undefined ? '' : 'is-selected';\n};\n\nconst getInitialFocusedIndex = () => {\n  const selectedIndex = props.items.findIndex((item) =>\n    item.value === selectedValue.value && !item.disabled,\n  );\n\n  if (selectedIndex >= 0) {\n    return selectedIndex;\n  }\n\n  return props.items.findIndex((item) => !item.disabled);\n};\n\nconst focusedIndex = ref(getInitialFocusedIndex());\n\nconst rootClasses = computed(() => [\n  't-nav-menu',\n  `t-nav-menu--${props.size}`,\n  {\n    'is-collapsed': resolvedCollapsed.value,\n    'is-disabled': props.disabled,\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 isSelected = (value: string) => selectedValue.value === value;\n\nconst setItemRef = (element: Element | ComponentPublicInstance | null, value: string) => {\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) {\n    itemRefs.value.set(value, resolvedElement);\n  } else {\n    itemRefs.value.delete(value);\n  }\n};\n\nconst focusItem = (index: number) => {\n  const item = props.items[index];\n\n  if (!item) {\n    return;\n  }\n\n  focusedIndex.value = index;\n  nextTick(() => itemRefs.value.get(item.value)?.focus());\n};\n\nconst selectItem = (item: TNavMenuItem) => {\n  if (props.disabled || 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  emit('select', item.value, item);\n};\n\nconst onItemKeydown = (event: KeyboardEvent, index: number) => {\n  if (props.disabled) {\n    return;\n  }\n\n  if (event.key === 'Home') {\n    event.preventDefault();\n    const firstIndex = props.items.findIndex((item) => !item.disabled);\n\n    if (firstIndex >= 0) {\n      focusItem(firstIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'End') {\n    event.preventDefault();\n    const lastIndex = [...props.items].reverse().findIndex((item) => !item.disabled);\n\n    if (lastIndex >= 0) {\n      focusItem(props.items.length - 1 - lastIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n    event.preventDefault();\n    const nextIndex = getNextEnabledIndex(index, props.items, 1);\n\n    if (nextIndex >= 0) {\n      focusItem(nextIndex);\n    }\n\n    return;\n  }\n\n  if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n    event.preventDefault();\n    const previousIndex = getNextEnabledIndex(index, props.items, -1);\n\n    if (previousIndex >= 0) {\n      focusItem(previousIndex);\n    }\n\n    return;\n  }\n\n  if (isActivationKey(event)) {\n    event.preventDefault();\n    selectItem(props.items[index]);\n  }\n};\n\nconst getTabIndex = (index: number) => (focusedIndex.value === index ? 0 : -1);\n\nwatch(\n  () => [props.items, props.modelValue] as const,\n  () => {\n    const nextIndex = getInitialFocusedIndex();\n    focusedIndex.value = nextIndex >= 0 ? nextIndex : -1;\n  },\n  { deep: true },\n);\n</script>\n\n<template>\n  <nav\n    v-bind=\"rootAttrs\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <ul\n      v-if=\"items.length > 0\"\n      class=\"t-nav-menu__list\"\n    >\n      <li\n        v-for=\"(item, index) in items\"\n        :key=\"item.value\"\n        class=\"t-nav-menu__entry\"\n      >\n        <component\n          :is=\"itemTag(item)\"\n          :ref=\"(element: Element | ComponentPublicInstance | null) => setItemRef(element, item.value)\"\n          :type=\"item.to ? undefined : 'button'\"\n          :to=\"item.to || undefined\"\n          class=\"t-nav-menu__item\"\n          :class=\"{\n            'is-selected': isSelected(item.value),\n            'is-disabled': disabled || item.disabled,\n          }\"\n          :active-class=\"routerActiveClass(item)\"\n          :exact-active-class=\"routerExactActiveClass(item)\"\n          :disabled=\"(!item.to && (disabled || item.disabled)) || undefined\"\n          :aria-disabled=\"(item.to && (disabled || item.disabled)) || undefined\"\n          :aria-current=\"isSelected(item.value) ? 'page' : undefined\"\n          :tabindex=\"disabled || item.disabled ? -1 : getTabIndex(index)\"\n          :title=\"resolvedCollapsed ? item.label : undefined\"\n          @click=\"selectItem(item)\"\n          @keydown=\"onItemKeydown($event, index)\"\n          @focus=\"focusedIndex = index\"\n        >\n          <slot\n            name=\"item\"\n            :item=\"item\"\n            :selected=\"isSelected(item.value)\"\n            :focused=\"focusedIndex === index\"\n            :collapsed=\"resolvedCollapsed\"\n          >\n            <component\n              :is=\"iconFor(item)\"\n              v-if=\"iconFor(item)\"\n              class=\"t-nav-menu__icon\"\n              aria-hidden=\"true\"\n            />\n            <span\n              v-else\n              class=\"t-nav-menu__marker\"\n              aria-hidden=\"true\"\n            >\n              {{ (item.shortLabel ?? item.label.charAt(0)).toUpperCase() }}\n            </span>\n\n            <span class=\"t-nav-menu__copy\">\n              <span class=\"t-nav-menu__label\">{{ item.label }}</span>\n              <span\n                v-if=\"item.description\"\n                class=\"t-nav-menu__description\"\n              >\n                {{ item.description }}\n              </span>\n            </span>\n\n            <span\n              v-if=\"item.badge !== undefined && item.badge !== null\"\n              class=\"t-nav-menu__badge\"\n            >\n              {{ item.badge }}\n            </span>\n          </slot>\n        </component>\n      </li>\n    </ul>\n\n    <div\n      v-else\n      class=\"t-nav-menu__empty\"\n    >\n      <slot name=\"empty\">\n        No navigation items.\n      </slot>\n    </div>\n  </nav>\n</template>\n"],"mappings":"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"}

package/dist/components/TPricingCard.vue.d.ts

@@ -42,8 +42,8 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
 }>, {
     disabled: boolean;
     size: TSize;
-    description: string;
     badge: string;
+    description: string;
     currency: string;
     period: string;
     features: PricingFeature[];

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

@@ -1 +1 @@
-{"version":3,"file":"TPricingCard.vue.d.ts","sourceRoot":"","sources":["../../src/components/TPricingCard.vue"],"names":[],"mappings":"AAyJA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAIhD,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,KAAK,WAAW,GAAG;IACf,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAC;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAwDJ,iBAAS,cAAc;WAkIT,OAAO,IAA6B;;iBApKvC,MAAM,OAAO;gBACd,MAAM,OAAO;mBACV,MAAM,OAAO;iBACf,MAAM,OAAO;gBACd,MAAM,OAAO;;iBAJZ,MAAM,OAAO;gBACd,MAAM,OAAO;mBACV,MAAM,OAAO;iBACf,MAAM,OAAO;gBACd,MAAM,OAAO;;;;EAqKtB;AAcD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;cA/MN,OAAO;UADX,KAAK;iBARE,MAAM;WAMZ,MAAM;cAJH,MAAM;YACR,MAAM;cACJ,cAAc,EAAE;iBACb,OAAO;gBAER,MAAM;qFA0NrB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"TPricingCard.vue.d.ts","sourceRoot":"","sources":["../../src/components/TPricingCard.vue"],"names":[],"mappings":"AAyJA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAIhD,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,KAAK,WAAW,GAAG;IACf,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAC;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAwDJ,iBAAS,cAAc;WAkIT,OAAO,IAA6B;;iBApKvC,MAAM,OAAO;gBACd,MAAM,OAAO;mBACV,MAAM,OAAO;iBACf,MAAM,OAAO;gBACd,MAAM,OAAO;;iBAJZ,MAAM,OAAO;gBACd,MAAM,OAAO;mBACV,MAAM,OAAO;iBACf,MAAM,OAAO;gBACd,MAAM,OAAO;;;;EAqKtB;AAcD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;cA/MN,OAAO;UADX,KAAK;WAFJ,MAAM;iBANA,MAAM;cAET,MAAM;YACR,MAAM;cACJ,cAAc,EAAE;iBACb,OAAO;gBAER,MAAM;qFA0NrB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/TSidebar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TSidebar.cjs","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.cjs","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.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":"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"}

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":""}