@skdx/vue 0.28.0 → 0.30.0

package/dist/badge/primitives.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./BadgeLeading.vue.cjs"),r=require("./BadgeTrailing.vue.cjs"),d=require("./Badge.vue.cjs");exports.SkdxBadge=d.default;exports.SkdxBadgeLeading=e.default;exports.SkdxBadgeTrailing=r.default;
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./BadgeDelete.vue.cjs"),r=require("./BadgeLabel.vue.cjs"),d=require("./BadgeLeading.vue.cjs"),a=require("./BadgeTrailing.vue.cjs"),i=require("./Badge.vue.cjs");exports.SkdxBadge=i.default;exports.SkdxBadgeDelete=e.default;exports.SkdxBadgeLabel=r.default;exports.SkdxBadgeLeading=d.default;exports.SkdxBadgeTrailing=a.default;

package/dist/badge/primitives.d.cts

@@ -1,7 +1,5 @@
 /**
  * Primitives for `SkdxBadge` — composable building blocks.
- * Use these when you need a custom layout beyond the derived recipe.
- * Badge children are text, not parts — no presence switch like other components.
  *
  * @example
  * ```vue
@@ -18,5 +16,7 @@
  * ```
  */
 export { default as SkdxBadge } from './Badge.vue.cjs';
+export { default as SkdxBadgeDelete } from './BadgeDelete.vue.cjs';
+export { default as SkdxBadgeLabel } from './BadgeLabel.vue.cjs';
 export { default as SkdxBadgeLeading } from './BadgeLeading.vue.cjs';
 export { default as SkdxBadgeTrailing } from './BadgeTrailing.vue.cjs';

package/dist/badge/primitives.d.ts

@@ -1,7 +1,5 @@
 /**
  * Primitives for `SkdxBadge` — composable building blocks.
- * Use these when you need a custom layout beyond the derived recipe.
- * Badge children are text, not parts — no presence switch like other components.
  *
  * @example
  * ```vue
@@ -18,5 +16,7 @@
  * ```
  */
 export { default as SkdxBadge } from './Badge.vue.js';
+export { default as SkdxBadgeDelete } from './BadgeDelete.vue.js';
+export { default as SkdxBadgeLabel } from './BadgeLabel.vue.js';
 export { default as SkdxBadgeLeading } from './BadgeLeading.vue.js';
 export { default as SkdxBadgeTrailing } from './BadgeTrailing.vue.js';

package/dist/badge/primitives.js

@@ -1 +1 @@
-import a from"./BadgeLeading.vue.js";import e from"./BadgeTrailing.vue.js";import d from"./Badge.vue.js";export{d as SkdxBadge,a as SkdxBadgeLeading,e as SkdxBadgeTrailing};
+import e from"./BadgeDelete.vue.js";import a from"./BadgeLabel.vue.js";import d from"./BadgeLeading.vue.js";import g from"./BadgeTrailing.vue.js";import r from"./Badge.vue.js";export{r as SkdxBadge,e as SkdxBadgeDelete,a as SkdxBadgeLabel,d as SkdxBadgeLeading,g as SkdxBadgeTrailing};

package/dist/box/Box.vue.d.cts

@@ -36,6 +36,56 @@ type __VLS_Props = {
      * @default undefined — no inline declaration.
      */
     gap?: Space;
+    /**
+     * Inline size (`inline-size`, never `width`), from the spacing scale.
+     * @default undefined — no inline declaration.
+     */
+    width?: Space;
+    /**
+     * Minimum inline size (`min-inline-size`, never `min-width`), from the spacing scale.
+     * @default undefined — no inline declaration.
+     */
+    minWidth?: Space;
+    /**
+     * Maximum inline size (`max-inline-size`, never `max-width`), from the spacing scale.
+     * @default undefined — no inline declaration.
+     */
+    maxWidth?: Space;
+    /**
+     * Grid columns: a number becomes that many equal columns, a string is a raw track list.
+     * @default undefined — no inline declaration.
+     */
+    columns?: number | string;
+    /**
+     * Gap between rows, from the spacing scale.
+     * @default undefined — no inline declaration.
+     */
+    rowGap?: Space;
+    /**
+     * Gap between columns, from the spacing scale.
+     * @default undefined — no inline declaration.
+     */
+    columnGap?: Space;
+    /**
+     * Number of grid columns this box spans, emitted as `grid-column`.
+     * @default undefined — no inline declaration.
+     */
+    colSpan?: number;
+    /**
+     * Number of grid rows this box spans, emitted as `grid-row`.
+     * @default undefined — no inline declaration.
+     */
+    rowSpan?: number;
+    /**
+     * Cross-axis alignment of this box alone, emitted as `align-self`.
+     * @default undefined — no inline declaration.
+     */
+    alignSelf?: 'start' | 'center' | 'end' | 'stretch' | 'baseline';
+    /**
+     * Flex shorthand for this box, emitted as the `flex` declaration.
+     * @default undefined — no inline declaration.
+     */
+    flex?: number | string;
     /**
      * Padding on all sides, from the spacing scale.
      * @default undefined — no inline declaration.

package/dist/box/Box.vue.d.ts

@@ -36,6 +36,56 @@ type __VLS_Props = {
      * @default undefined — no inline declaration.
      */
     gap?: Space;
+    /**
+     * Inline size (`inline-size`, never `width`), from the spacing scale.
+     * @default undefined — no inline declaration.
+     */
+    width?: Space;
+    /**
+     * Minimum inline size (`min-inline-size`, never `min-width`), from the spacing scale.
+     * @default undefined — no inline declaration.
+     */
+    minWidth?: Space;
+    /**
+     * Maximum inline size (`max-inline-size`, never `max-width`), from the spacing scale.
+     * @default undefined — no inline declaration.
+     */
+    maxWidth?: Space;
+    /**
+     * Grid columns: a number becomes that many equal columns, a string is a raw track list.
+     * @default undefined — no inline declaration.
+     */
+    columns?: number | string;
+    /**
+     * Gap between rows, from the spacing scale.
+     * @default undefined — no inline declaration.
+     */
+    rowGap?: Space;
+    /**
+     * Gap between columns, from the spacing scale.
+     * @default undefined — no inline declaration.
+     */
+    columnGap?: Space;
+    /**
+     * Number of grid columns this box spans, emitted as `grid-column`.
+     * @default undefined — no inline declaration.
+     */
+    colSpan?: number;
+    /**
+     * Number of grid rows this box spans, emitted as `grid-row`.
+     * @default undefined — no inline declaration.
+     */
+    rowSpan?: number;
+    /**
+     * Cross-axis alignment of this box alone, emitted as `align-self`.
+     * @default undefined — no inline declaration.
+     */
+    alignSelf?: 'start' | 'center' | 'end' | 'stretch' | 'baseline';
+    /**
+     * Flex shorthand for this box, emitted as the `flex` declaration.
+     * @default undefined — no inline declaration.
+     */
+    flex?: number | string;
     /**
      * Padding on all sides, from the spacing scale.
      * @default undefined — no inline declaration.

package/dist/box/Box.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const v=require("../utils/mergeStyle.cjs"),i=require("../utils/space.cjs");let o=require("vue");var m=(0,o.defineComponent)({inheritAttrs:!1,__name:"Box",props:{as:{},display:{},direction:{},align:{},justify:{},wrap:{},gap:{},p:{},px:{},py:{},pt:{},pb:{},ps:{},pe:{},m:{},mx:{},my:{},mt:{},mb:{},ms:{},me:{}},setup(a){const e=a,n={start:"flex-start",end:"flex-end",center:"center",stretch:"stretch",baseline:"baseline"},p={start:"flex-start",end:"flex-end",center:"center",between:"space-between",around:"space-around",evenly:"space-evenly",stretch:"stretch"},r=(0,o.useAttrs)(),l=(0,o.computed)(()=>{const{style:t,...s}=r;return s}),d=(0,o.computed)(()=>{const t={};return e.display!==void 0&&(t.display=e.display),e.direction!==void 0&&(t["flex-direction"]=e.direction),e.align!==void 0&&(t["align-items"]=n[e.align]),e.justify!==void 0&&(t["justify-content"]=p[e.justify]),e.wrap!==void 0&&(t["flex-wrap"]=e.wrap),e.gap!==void 0&&(t.gap=i.resolveSpace(e.gap)),e.p!==void 0&&(t.padding=i.resolveSpace(e.p)),e.px!==void 0&&(t["padding-inline"]=i.resolveSpace(e.px)),e.py!==void 0&&(t["padding-block"]=i.resolveSpace(e.py)),e.pt!==void 0&&(t["padding-top"]=i.resolveSpace(e.pt)),e.pb!==void 0&&(t["padding-bottom"]=i.resolveSpace(e.pb)),e.ps!==void 0&&(t["padding-inline-start"]=i.resolveSpace(e.ps)),e.pe!==void 0&&(t["padding-inline-end"]=i.resolveSpace(e.pe)),e.m!==void 0&&(t.margin=i.resolveSpace(e.m)),e.mx!==void 0&&(t["margin-inline"]=i.resolveSpace(e.mx)),e.my!==void 0&&(t["margin-block"]=i.resolveSpace(e.my)),e.mt!==void 0&&(t["margin-top"]=i.resolveSpace(e.mt)),e.mb!==void 0&&(t["margin-bottom"]=i.resolveSpace(e.mb)),e.ms!==void 0&&(t["margin-inline-start"]=i.resolveSpace(e.ms)),e.me!==void 0&&(t["margin-inline-end"]=i.resolveSpace(e.me)),t}),c=(0,o.computed)(()=>({...d.value,...v.toStyleObject(r.style)}));return(t,s)=>((0,o.openBlock)(),(0,o.createBlock)((0,o.resolveDynamicComponent)(a.as??"div"),(0,o.mergeProps)(l.value,{class:"skdx-box","data-part":"root","data-skdx-component":"box",style:c.value}),{default:(0,o.withCtx)(()=>[(0,o.renderSlot)(t.$slots,"default")]),_:3},16,["style"]))}});exports.default=m;
+const g=require("../utils/mergeStyle.cjs"),l=require("../utils/space.cjs");let n=require("vue");var y=(0,n.defineComponent)({inheritAttrs:!1,__name:"Box",props:{as:{},display:{},direction:{},align:{},justify:{},wrap:{},gap:{},width:{},minWidth:{},maxWidth:{},columns:{},rowGap:{},columnGap:{},colSpan:{},rowSpan:{},alignSelf:{},flex:{},p:{},px:{},py:{},pt:{},pb:{},ps:{},pe:{},m:{},mx:{},my:{},mt:{},mb:{},ms:{},me:{}},setup(a){const e=a,o={start:"flex-start",end:"flex-end",center:"center",stretch:"stretch",baseline:"baseline"},p={start:"flex-start",end:"flex-end",center:"center",between:"space-between",around:"space-around",evenly:"space-evenly",stretch:"stretch"},r=(0,n.useAttrs)(),d=(0,n.computed)(()=>{const{style:t,...i}=r;return i}),c=[["gap","gap"],["width","inline-size"],["minWidth","min-inline-size"],["maxWidth","max-inline-size"],["rowGap","row-gap"],["columnGap","column-gap"],["p","padding"],["px","padding-inline"],["py","padding-block"],["pt","padding-top"],["pb","padding-bottom"],["ps","padding-inline-start"],["pe","padding-inline-end"],["m","margin"],["mx","margin-inline"],["my","margin-block"],["mt","margin-top"],["mb","margin-bottom"],["ms","margin-inline-start"],["me","margin-inline-end"]],m=(0,n.computed)(()=>{const t={};e.display!==void 0&&(t.display=e.display),e.direction!==void 0&&(t["flex-direction"]=e.direction),e.align!==void 0&&(t["align-items"]=o[e.align]),e.justify!==void 0&&(t["justify-content"]=p[e.justify]),e.wrap!==void 0&&(t["flex-wrap"]=e.wrap),e.columns!==void 0&&(t["grid-template-columns"]=l.resolveColumns(e.columns)),e.colSpan!==void 0&&(t["grid-column"]=`span ${e.colSpan}`),e.rowSpan!==void 0&&(t["grid-row"]=`span ${e.rowSpan}`),e.alignSelf!==void 0&&(t["align-self"]=o[e.alignSelf]),e.flex!==void 0&&(t.flex=String(e.flex));for(const[i,f]of c){const s=e[i];s!==void 0&&(t[f]=l.resolveSpace(s))}return t}),u=(0,n.computed)(()=>({...m.value,...g.toStyleObject(r.style)}));return(t,i)=>((0,n.openBlock)(),(0,n.createBlock)((0,n.resolveDynamicComponent)(a.as??"div"),(0,n.mergeProps)(d.value,{class:"skdx-box","data-part":"root","data-skdx-component":"box",style:u.value}),{default:(0,n.withCtx)(()=>[(0,n.renderSlot)(t.$slots,"default")]),_:3},16,["style"]))}});exports.default=y;

package/dist/box/Box.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{toStyleObject as e}from"../utils/mergeStyle.js";import{resolveSpace as t}from"../utils/space.js";import{computed as i,createBlock as a,defineComponent as n,mergeProps as s,openBlock as o,renderSlot as d,resolveDynamicComponent as p,useAttrs as r,withCtx as l}from"vue";var m=/* @__PURE__ */n({inheritAttrs:!1,__name:"Box",props:{as:{},display:{},direction:{},align:{},justify:{},wrap:{},gap:{},p:{},px:{},py:{},pt:{},pb:{},ps:{},pe:{},m:{},mx:{},my:{},mt:{},mb:{},ms:{},me:{}},setup(n){const m=n,c={start:"flex-start",end:"flex-end",center:"center",stretch:"stretch",baseline:"baseline"},v={start:"flex-start",end:"flex-end",center:"center",between:"space-between",around:"space-around",evenly:"space-evenly",stretch:"stretch"},g=r(),y=i(()=>{const{style:e,...t}=g;return t}),u=i(()=>{const e={};return void 0!==m.display&&(e.display=m.display),void 0!==m.direction&&(e["flex-direction"]=m.direction),void 0!==m.align&&(e["align-items"]=c[m.align]),void 0!==m.justify&&(e["justify-content"]=v[m.justify]),void 0!==m.wrap&&(e["flex-wrap"]=m.wrap),void 0!==m.gap&&(e.gap=t(m.gap)),void 0!==m.p&&(e.padding=t(m.p)),void 0!==m.px&&(e["padding-inline"]=t(m.px)),void 0!==m.py&&(e["padding-block"]=t(m.py)),void 0!==m.pt&&(e["padding-top"]=t(m.pt)),void 0!==m.pb&&(e["padding-bottom"]=t(m.pb)),void 0!==m.ps&&(e["padding-inline-start"]=t(m.ps)),void 0!==m.pe&&(e["padding-inline-end"]=t(m.pe)),void 0!==m.m&&(e.margin=t(m.m)),void 0!==m.mx&&(e["margin-inline"]=t(m.mx)),void 0!==m.my&&(e["margin-block"]=t(m.my)),void 0!==m.mt&&(e["margin-top"]=t(m.mt)),void 0!==m.mb&&(e["margin-bottom"]=t(m.mb)),void 0!==m.ms&&(e["margin-inline-start"]=t(m.ms)),void 0!==m.me&&(e["margin-inline-end"]=t(m.me)),e}),x=i(()=>({...u.value,...e(g.style)}));return(e,t)=>(o(),a(p(n.as??"div"),s(y.value,{class:"skdx-box","data-part":"root","data-skdx-component":"box",style:x.value}),{default:l(()=>[d(e.$slots,"default")]),_:3},16,["style"]))}});export{m as default};
+import{toStyleObject as e}from"../utils/mergeStyle.js";import{resolveColumns as n,resolveSpace as t}from"../utils/space.js";import{computed as a,createBlock as i,defineComponent as s,mergeProps as o,openBlock as l,renderSlot as r,resolveDynamicComponent as p,useAttrs as d,withCtx as m}from"vue";var c=/* @__PURE__ */s({inheritAttrs:!1,__name:"Box",props:{as:{},display:{},direction:{},align:{},justify:{},wrap:{},gap:{},width:{},minWidth:{},maxWidth:{},columns:{},rowGap:{},columnGap:{},colSpan:{},rowSpan:{},alignSelf:{},flex:{},p:{},px:{},py:{},pt:{},pb:{},ps:{},pe:{},m:{},mx:{},my:{},mt:{},mb:{},ms:{},me:{}},setup(s){const c=s,g={start:"flex-start",end:"flex-end",center:"center",stretch:"stretch",baseline:"baseline"},u={start:"flex-start",end:"flex-end",center:"center",between:"space-between",around:"space-around",evenly:"space-evenly",stretch:"stretch"},f=d(),x=a(()=>{const{style:e,...n}=f;return n}),v=[["gap","gap"],["width","inline-size"],["minWidth","min-inline-size"],["maxWidth","max-inline-size"],["rowGap","row-gap"],["columnGap","column-gap"],["p","padding"],["px","padding-inline"],["py","padding-block"],["pt","padding-top"],["pb","padding-bottom"],["ps","padding-inline-start"],["pe","padding-inline-end"],["m","margin"],["mx","margin-inline"],["my","margin-block"],["mt","margin-top"],["mb","margin-bottom"],["ms","margin-inline-start"],["me","margin-inline-end"]],y=a(()=>{const e={};void 0!==c.display&&(e.display=c.display),void 0!==c.direction&&(e["flex-direction"]=c.direction),void 0!==c.align&&(e["align-items"]=g[c.align]),void 0!==c.justify&&(e["justify-content"]=u[c.justify]),void 0!==c.wrap&&(e["flex-wrap"]=c.wrap),void 0!==c.columns&&(e["grid-template-columns"]=n(c.columns)),void 0!==c.colSpan&&(e["grid-column"]=`span ${c.colSpan}`),void 0!==c.rowSpan&&(e["grid-row"]=`span ${c.rowSpan}`),void 0!==c.alignSelf&&(e["align-self"]=g[c.alignSelf]),void 0!==c.flex&&(e.flex=String(c.flex));for(const[n,a]of v){const i=c[n];void 0!==i&&(e[a]=t(i))}return e}),w=a(()=>({...y.value,...e(f.style)}));return(e,n)=>(l(),i(p(s.as??"div"),o(x.value,{class:"skdx-box","data-part":"root","data-skdx-component":"box",style:w.value}),{default:m(()=>[r(e.$slots,"default")]),_:3},16,["style"]))}});export{c as default};

package/dist/breadcrumb/Breadcrumb.vue.d.cts

@@ -1,35 +1,34 @@
 import type { BreadcrumbItem } from './types.cjs';
 /**
- * Navigation breadcrumb trail rendered as a `<nav>`. Render from `items` or
- * provide custom slot content. Must be named with `aria-label`.
+ * Navigation breadcrumb trail rendered as a nav; must be named with the label prop.
  *
  * @example
  * ```vue
- * <SkdxBreadcrumb aria-label="Breadcrumb" :items="crumbs" />
+ * <SkdxBreadcrumb label="Breadcrumb" :items="crumbs" />
  * ```
  */
 type __VLS_Props = {
     /**
-     * Glyph every `SkdxBreadcrumbSeparator` falls back to when it has no
-     * children of its own, so changing the divider for the whole trail is one
-     * prop rather than the same override repeated on every crumb.
+     * Accessible name written to the nav landmark as aria-label; required so every navigation landmark on the page is distinct.
+     */
+    label: string;
+    /**
+     * Glyph every SkdxBreadcrumbSeparator falls back to when it has no children of its own.
      * @default '/'
      */
     separator?: string;
     /**
-     * The crumbs, rendered as one derived `<li>` each with a separator
-     * between them. Ignored once the default slot supplies its own
-     * `SkdxBreadcrumbList`.
+     * The crumbs, rendered as one derived li each with a separator between them.
      * @default undefined — no derived anatomy; compose the trail yourself.
      */
-    items?: readonly BreadcrumbItem[];
+    items?: readonly BreadcrumbItem[] | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    items: readonly BreadcrumbItem[];
+    items: readonly BreadcrumbItem[] | undefined;
     separator: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/breadcrumb/Breadcrumb.vue.d.ts

@@ -1,35 +1,34 @@
 import type { BreadcrumbItem } from './types.js';
 /**
- * Navigation breadcrumb trail rendered as a `<nav>`. Render from `items` or
- * provide custom slot content. Must be named with `aria-label`.
+ * Navigation breadcrumb trail rendered as a nav; must be named with the label prop.
  *
  * @example
  * ```vue
- * <SkdxBreadcrumb aria-label="Breadcrumb" :items="crumbs" />
+ * <SkdxBreadcrumb label="Breadcrumb" :items="crumbs" />
  * ```
  */
 type __VLS_Props = {
     /**
-     * Glyph every `SkdxBreadcrumbSeparator` falls back to when it has no
-     * children of its own, so changing the divider for the whole trail is one
-     * prop rather than the same override repeated on every crumb.
+     * Accessible name written to the nav landmark as aria-label; required so every navigation landmark on the page is distinct.
+     */
+    label: string;
+    /**
+     * Glyph every SkdxBreadcrumbSeparator falls back to when it has no children of its own.
      * @default '/'
      */
     separator?: string;
     /**
-     * The crumbs, rendered as one derived `<li>` each with a separator
-     * between them. Ignored once the default slot supplies its own
-     * `SkdxBreadcrumbList`.
+     * The crumbs, rendered as one derived li each with a separator between them.
      * @default undefined — no derived anatomy; compose the trail yourself.
      */
-    items?: readonly BreadcrumbItem[];
+    items?: readonly BreadcrumbItem[] | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    items: readonly BreadcrumbItem[];
+    items: readonly BreadcrumbItem[] | undefined;
     separator: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/breadcrumb/Breadcrumb.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const o=require("./context.cjs"),u=require("./BreadcrumbAnatomy.vue.cjs");let e=require("vue");var n={class:"skdx-breadcrumb","data-part":"root","data-skdx-component":"breadcrumb"},c=(0,e.defineComponent)({__name:"Breadcrumb",props:{separator:{default:"/"},items:{default:void 0}},setup(r){const t=r;return(0,e.provide)(o.BREADCRUMB_CONTEXT,{get separator(){return t.separator}}),(a,d)=>((0,e.openBlock)(),(0,e.createElementBlock)("nav",n,[(0,e.renderSlot)(a.$slots,"default",{},()=>[r.items?((0,e.openBlock)(),(0,e.createBlock)(u.default,{key:0,items:r.items},null,8,["items"])):(0,e.createCommentVNode)("",!0)])]))}});exports.default=c;
+const u=require("./context.cjs"),l=require("./BreadcrumbAnatomy.vue.cjs");let e=require("vue");var o=["aria-label"],n=(0,e.defineComponent)({__name:"Breadcrumb",props:{label:{},separator:{default:"/"},items:{default:void 0}},setup(r){const t=r;return(0,e.provide)(u.BREADCRUMB_CONTEXT,{get separator(){return t.separator}}),(a,c)=>((0,e.openBlock)(),(0,e.createElementBlock)("nav",{class:"skdx-breadcrumb","data-part":"root","data-skdx-component":"breadcrumb","aria-label":r.label},[(0,e.renderSlot)(a.$slots,"default",{},()=>[r.items?((0,e.openBlock)(),(0,e.createBlock)(l.default,{key:0,items:r.items},null,8,["items"])):(0,e.createCommentVNode)("",!0)])],8,o))}});exports.default=n;

package/dist/breadcrumb/Breadcrumb.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{BREADCRUMB_CONTEXT as e}from"./context.js";import t from"./BreadcrumbAnatomy.vue.js";import{createBlock as a,createCommentVNode as r,createElementBlock as o,defineComponent as s,openBlock as m,provide as d,renderSlot as n}from"vue";var p={class:"skdx-breadcrumb","data-part":"root","data-skdx-component":"breadcrumb"},c=/* @__PURE__ */s({__name:"Breadcrumb",props:{separator:{default:"/"},items:{default:void 0}},setup(s){const c=s;return d(e,{get separator(){return c.separator}}),(e,d)=>(m(),o("nav",p,[n(e.$slots,"default",{},()=>[s.items?(m(),a(t,{key:0,items:s.items},null,8,["items"])):r("",!0)])]))}});export{c as default};
+import{BREADCRUMB_CONTEXT as e}from"./context.js";import a from"./BreadcrumbAnatomy.vue.js";import{createBlock as r,createCommentVNode as t,createElementBlock as o,defineComponent as s,openBlock as m,provide as l,renderSlot as d}from"vue";var n=["aria-label"],p=/* @__PURE__ */s({__name:"Breadcrumb",props:{label:{},separator:{default:"/"},items:{default:void 0}},setup(s){const p=s;return l(e,{get separator(){return p.separator}}),(e,l)=>(m(),o("nav",{class:"skdx-breadcrumb","data-part":"root","data-skdx-component":"breadcrumb","aria-label":s.label},[d(e.$slots,"default",{},()=>[s.items?(m(),r(a,{key:0,items:s.items},null,8,["items"])):t("",!0)])],8,n))}});export{p as default};

package/dist/breadcrumb/BreadcrumbAnatomy.vue.d.cts

@@ -1,9 +1,5 @@
 import type { BreadcrumbItem } from './types.cjs';
-/**
- * Anatomy when default slot empty: ordered list of crumbs (link/page/ellipsis) with separators.
- * React port's `BreadcrumbAnatomy.tsx` must stay synchronized.
- * @internal
- */
+/** @internal Anatomy when the default slot is empty: ordered list of crumbs with separators. */
 type __VLS_Props = {
     items: readonly BreadcrumbItem[];
 };

package/dist/breadcrumb/BreadcrumbAnatomy.vue.d.ts

@@ -1,9 +1,5 @@
 import type { BreadcrumbItem } from './types.js';
-/**
- * Anatomy when default slot empty: ordered list of crumbs (link/page/ellipsis) with separators.
- * React port's `BreadcrumbAnatomy.tsx` must stay synchronized.
- * @internal
- */
+/** @internal Anatomy when the default slot is empty: ordered list of crumbs with separators. */
 type __VLS_Props = {
     items: readonly BreadcrumbItem[];
 };

package/dist/breadcrumb/BreadcrumbEllipsis.vue.d.cts

@@ -1,9 +1,4 @@
-/**
- * Placeholder for collapsed middle items: renders `<span role="presentation" aria-hidden="true">`,
- * defaulting to "…". Never slot an interactive trigger — content in an `aria-hidden`
- * subtree is unreachable to screen readers while still tab-focusable. Put a menu trigger
- * in the `BreadcrumbItem` instead.
- */
+/** Placeholder for collapsed middle items; renders a span role="presentation" aria-hidden="true", defaulting to "…". */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/breadcrumb/BreadcrumbEllipsis.vue.d.ts

@@ -1,9 +1,4 @@
-/**
- * Placeholder for collapsed middle items: renders `<span role="presentation" aria-hidden="true">`,
- * defaulting to "…". Never slot an interactive trigger — content in an `aria-hidden`
- * subtree is unreachable to screen readers while still tab-focusable. Put a menu trigger
- * in the `BreadcrumbItem` instead.
- */
+/** Placeholder for collapsed middle items; renders a span role="presentation" aria-hidden="true", defaulting to "…". */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/breadcrumb/BreadcrumbLink.vue.d.cts

@@ -1,11 +1,7 @@
-/**
- * A navigable ancestor in the breadcrumb: renders a plain `<a>`.
- * Set `current` for the current page to emit `aria-current="page"`.
- * Use `SkdxBreadcrumbPage` when the current page is not navigable.
- */
+/** A navigable ancestor in the breadcrumb; renders a plain a, with current emitting aria-current="page". */
 type __VLS_Props = {
     /** Marks this link as the current page, emitting aria-current="page". */
-    current?: boolean;
+    current?: boolean | undefined;
     /** Native `target` attribute value, passed straight through to the element. @default undefined */
     target?: string;
     /**
@@ -19,7 +15,7 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    current: boolean;
+    current: boolean | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/breadcrumb/BreadcrumbLink.vue.d.ts

@@ -1,11 +1,7 @@
-/**
- * A navigable ancestor in the breadcrumb: renders a plain `<a>`.
- * Set `current` for the current page to emit `aria-current="page"`.
- * Use `SkdxBreadcrumbPage` when the current page is not navigable.
- */
+/** A navigable ancestor in the breadcrumb; renders a plain a, with current emitting aria-current="page". */
 type __VLS_Props = {
     /** Marks this link as the current page, emitting aria-current="page". */
-    current?: boolean;
+    current?: boolean | undefined;
     /** Native `target` attribute value, passed straight through to the element. @default undefined */
     target?: string;
     /**
@@ -19,7 +15,7 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    current: boolean;
+    current: boolean | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/breadcrumb/BreadcrumbSeparator.vue.d.cts

@@ -1,9 +1,4 @@
-/**
- * Divider between two `SkdxBreadcrumbItem`s: renders `<li role="presentation"
- * aria-hidden="true">` so assistive tech skips it. With no children of its
- * own, falls back to the root's `separator` prop (`"/"` by default); pass
- * slot content (e.g. an icon) to override it for this one crumb.
- */
+/** Separator between two BreadcrumbItems; renders a li role="presentation" aria-hidden="true". */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/breadcrumb/BreadcrumbSeparator.vue.d.ts

@@ -1,9 +1,4 @@
-/**
- * Divider between two `SkdxBreadcrumbItem`s: renders `<li role="presentation"
- * aria-hidden="true">` so assistive tech skips it. With no children of its
- * own, falls back to the root's `separator` prop (`"/"` by default); pass
- * slot content (e.g. an icon) to override it for this one crumb.
- */
+/** Separator between two BreadcrumbItems; renders a li role="presentation" aria-hidden="true". */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/breadcrumb/primitives.d.cts

@@ -1,6 +1,5 @@
 /**
  * Advanced primitives for `SkdxBreadcrumb` — the parts the recipe composes.
- * Use when the derived anatomy is not the structure you need.
  *
  * @example
  * ```vue
@@ -9,7 +8,7 @@
  * </script>
  *
  * <template>
- *   <SkdxBreadcrumb aria-label="Breadcrumb">
+ *   <SkdxBreadcrumb label="Breadcrumb">
  *     <SkdxBreadcrumbList>
  *       <SkdxBreadcrumbItem><SkdxBreadcrumbLink href="/">Home</SkdxBreadcrumbLink></SkdxBreadcrumbItem>
  *       <SkdxBreadcrumbSeparator />

package/dist/breadcrumb/primitives.d.ts

@@ -1,6 +1,5 @@
 /**
  * Advanced primitives for `SkdxBreadcrumb` — the parts the recipe composes.
- * Use when the derived anatomy is not the structure you need.
  *
  * @example
  * ```vue
@@ -9,7 +8,7 @@
  * </script>
  *
  * <template>
- *   <SkdxBreadcrumb aria-label="Breadcrumb">
+ *   <SkdxBreadcrumb label="Breadcrumb">
  *     <SkdxBreadcrumbList>
  *       <SkdxBreadcrumbItem><SkdxBreadcrumbLink href="/">Home</SkdxBreadcrumbLink></SkdxBreadcrumbItem>
  *       <SkdxBreadcrumbSeparator />

package/dist/breadcrumb/types.d.cts

@@ -8,15 +8,12 @@ export interface BreadcrumbItem {
      */
     href?: string;
     /**
-     * Marks a *navigable* crumb as the current page (`aria-current="page"`).
-     * Ignored without `href`, where the page part already carries it.
+     * Marks a navigable crumb as the current page (aria-current="page").
      * @default false
      */
     current?: boolean;
     /**
-     * Renders a `SkdxBreadcrumbEllipsis` for a collapsed run instead of a link
-     * or a page. Decorative and `aria-hidden` — the crumbs it stands for must be
-     * reachable from a real trigger beside it, never inside it.
+     * Renders a SkdxBreadcrumbEllipsis for a collapsed run instead of a link or a page.
      * @default false
      */
     ellipsis?: boolean;

package/dist/breadcrumb/types.d.ts

@@ -8,15 +8,12 @@ export interface BreadcrumbItem {
      */
     href?: string;
     /**
-     * Marks a *navigable* crumb as the current page (`aria-current="page"`).
-     * Ignored without `href`, where the page part already carries it.
+     * Marks a navigable crumb as the current page (aria-current="page").
      * @default false
      */
     current?: boolean;
     /**
-     * Renders a `SkdxBreadcrumbEllipsis` for a collapsed run instead of a link
-     * or a page. Decorative and `aria-hidden` — the crumbs it stands for must be
-     * reachable from a real trigger beside it, never inside it.
+     * Renders a SkdxBreadcrumbEllipsis for a collapsed run instead of a link or a page.
      * @default false
      */
     ellipsis?: boolean;

package/dist/button/Button.vue.d.cts

@@ -1,36 +1,47 @@
 import type { PolymorphicTag } from '../utils/polymorphic.cjs';
 type __VLS_Props = {
-    /**
-     * Mark button busy without native disable: sets aria-busy/aria-disabled
-     * and suppresses activation while keeping focus and tab stop.
-     */
+    /** Marks the button busy without native disable: sets aria-busy/aria-disabled while keeping focus and tab stop. */
     loading?: boolean;
     /**
-     * Text announced while `loading` is true; rendered as visually-hidden
-     * and referenced by aria-describedby.
+     * Text announced while loading is true; rendered as visually-hidden and referenced by aria-describedby.
      * @default 'Loading'
      */
     loadingLabel?: string;
     /** Native disabled state. Outranks loading: sets the native disabled attribute. */
     disabled?: boolean;
-    /**
-     * Keep disabled button in tab order via aria-disabled and tabindex="0",
-     * activation still suppressed. For disabled actions in Toolbar or menu
-     * where arrow-key navigation cannot reach removed tab stops.
-     */
+    /** Keeps a disabled button in the tab order via aria-disabled and tabindex="0", with activation still suppressed. */
     focusableWhenDisabled?: boolean;
     /** Native button type. Defaults to 'button' so it never accidentally submits an enclosing form. */
     type?: 'button' | 'submit' | 'reset';
     /**
-     * Element name to render instead of the default `<button>`, from the
-     * library's tag allowlist. Takes a tag name only, never a component.
+     * Element name to render instead of the default button, from the library's tag allowlist.
      * @default 'button'
      */
     as?: PolymorphicTag;
+    /**
+     * Whether the skin renders the button as a square icon-only control, as `data-icon-only`.
+     * @default undefined — falls back to a `data-icon-only` attribute.
+     */
+    iconOnly?: boolean | undefined;
+    /**
+     * Size rung the skin renders the button at, reflected as `data-size`.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'md' | 'sm' | 'lg' | (string & {}) | undefined;
+    /**
+     * Meaning the button carries, reflected as `data-status` for the skin's colour.
+     * @default undefined — falls back to a `data-status` attribute.
+     */
+    status?: 'neutral' | 'brand' | 'info' | 'success' | 'warning' | 'danger' | (string & {}) | undefined;
+    /**
+     * Visual style family the skin gives the button, reflected as `data-variant`.
+     * @default undefined — falls back to a `data-variant` attribute.
+     */
+    variant?: 'secondary' | 'primary' | 'danger' | 'outline' | 'ghost' | (string & {}) | undefined;
 };
-declare var __VLS_11: {};
+declare var __VLS_7: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_11) => any;
+    default?: (props: typeof __VLS_7) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     /** Moves keyboard focus onto the underlying rendered element. */
@@ -44,6 +55,7 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     focusableWhenDisabled: boolean;
     type: "button" | "submit" | "reset";
     as: PolymorphicTag;
+    iconOnly: boolean | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/button/Button.vue.d.ts

@@ -1,36 +1,47 @@
 import type { PolymorphicTag } from '../utils/polymorphic.js';
 type __VLS_Props = {
-    /**
-     * Mark button busy without native disable: sets aria-busy/aria-disabled
-     * and suppresses activation while keeping focus and tab stop.
-     */
+    /** Marks the button busy without native disable: sets aria-busy/aria-disabled while keeping focus and tab stop. */
     loading?: boolean;
     /**
-     * Text announced while `loading` is true; rendered as visually-hidden
-     * and referenced by aria-describedby.
+     * Text announced while loading is true; rendered as visually-hidden and referenced by aria-describedby.
      * @default 'Loading'
      */
     loadingLabel?: string;
     /** Native disabled state. Outranks loading: sets the native disabled attribute. */
     disabled?: boolean;
-    /**
-     * Keep disabled button in tab order via aria-disabled and tabindex="0",
-     * activation still suppressed. For disabled actions in Toolbar or menu
-     * where arrow-key navigation cannot reach removed tab stops.
-     */
+    /** Keeps a disabled button in the tab order via aria-disabled and tabindex="0", with activation still suppressed. */
     focusableWhenDisabled?: boolean;
     /** Native button type. Defaults to 'button' so it never accidentally submits an enclosing form. */
     type?: 'button' | 'submit' | 'reset';
     /**
-     * Element name to render instead of the default `<button>`, from the
-     * library's tag allowlist. Takes a tag name only, never a component.
+     * Element name to render instead of the default button, from the library's tag allowlist.
      * @default 'button'
      */
     as?: PolymorphicTag;
+    /**
+     * Whether the skin renders the button as a square icon-only control, as `data-icon-only`.
+     * @default undefined — falls back to a `data-icon-only` attribute.
+     */
+    iconOnly?: boolean | undefined;
+    /**
+     * Size rung the skin renders the button at, reflected as `data-size`.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'md' | 'sm' | 'lg' | (string & {}) | undefined;
+    /**
+     * Meaning the button carries, reflected as `data-status` for the skin's colour.
+     * @default undefined — falls back to a `data-status` attribute.
+     */
+    status?: 'neutral' | 'brand' | 'info' | 'success' | 'warning' | 'danger' | (string & {}) | undefined;
+    /**
+     * Visual style family the skin gives the button, reflected as `data-variant`.
+     * @default undefined — falls back to a `data-variant` attribute.
+     */
+    variant?: 'secondary' | 'primary' | 'danger' | 'outline' | 'ghost' | (string & {}) | undefined;
 };
-declare var __VLS_11: {};
+declare var __VLS_7: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_11) => any;
+    default?: (props: typeof __VLS_7) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     /** Moves keyboard focus onto the underlying rendered element. */
@@ -44,6 +55,7 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     focusableWhenDisabled: boolean;
     type: "button" | "submit" | "reset";
     as: PolymorphicTag;
+    iconOnly: boolean | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;