@skdx/vue 0.26.0 → 0.28.0

package/dist/table/Table.vue.d.ts

@@ -1,98 +1,115 @@
-import { type SortDirection, type TableColumnWidths, type TableSelectionMode, type TableSort } from './context.js';
-/**
- * The Vue implementation of the shared Table contract (see `@skdx/shared`'s
- * `tableContract`). Renders a plain `<table>`: owns only sort and
- * row-selection state, no pagination/filtering/data-model — consumers map
- * over their own row data to render `SkdxTableRow`/`SkdxTableCell`s.
- *
- * Sort and selection each work controlled (`v-model:sort`/`v-model:selected`)
- * or uncontrolled independently of one another, as do expanded detail rows
- * (`v-model:expanded-row-ids`) and column widths (`v-model:column-widths`).
- *
- * `multiSort` lets several columns be sorted at once, at which point `sort`
- * becomes an array ordered most-significant-first. **The table never reorders
- * your rows** — it publishes sort state and you sort the data.
- */
-type __VLS_Props = {
-    /**
-     * Current sort state, for controlled usage. Pair with `v-model:sort` or
-     * `@sort-change`. A bare object (or `null`) for single sort, an array —
-     * most significant column first — when `multiSort` is on.
-     */
-    sort?: TableSort;
-    /** Initial sort state, for uncontrolled usage. */
-    defaultSort?: TableSort;
-    /**
-     * Lets several columns be sorted at once: activating a second column
-     * appends it to the sort instead of replacing the first, and `sort` becomes
-     * an array ordered most-significant-first. Off, exactly one column can
-     * carry `aria-sort="ascending" | "descending"` at a time.
-     */
-    multiSort?: boolean;
-    /** Selected row ids, for controlled usage. Pair with `v-model:selected` or `@selected-change`. */
-    selected?: Set<string> | string[];
-    /** Initially selected row ids, for uncontrolled usage. */
-    defaultSelected?: Set<string> | string[];
-    /**
-     * Whether rows can be selected at all, and if so, whether one or many at
-     * once. `'none'` disables row-click and checkbox selection entirely.
-     */
-    selectionMode?: TableSelectionMode;
-    /**
-     * Formats the message announced (through the shared live announcer) when a
-     * sortable header is activated — a changed `aria-sort` is not itself
-     * re-announced by screen readers. `column` is the header cell's own text.
-     * Return an empty string to announce nothing.
-     */
-    getSortLabel?: (column: string, direction: SortDirection | null) => string;
-    /** Row ids whose detail row is open, for controlled usage. Pair with `v-model:expanded-row-ids`. */
-    expandedRowIds?: string[];
-    /** Initially expanded detail rows, for uncontrolled usage. */
-    defaultExpandedRowIds?: string[];
-    /** Per-column pixel widths keyed by `columnKey`, for controlled usage. Pair with `v-model:column-widths`. */
-    columnWidths?: TableColumnWidths;
-    /** Initial per-column pixel widths, for uncontrolled usage. Columns left out size themselves until resized. */
-    defaultColumnWidths?: TableColumnWidths;
-};
-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, {
-    "update:sort": (sort: TableSort) => any;
-    "sort-change": (sort: TableSort) => any;
-    "update:selected": (selected: string[]) => any;
-    "selected-change": (selected: string[]) => any;
-    "update:expandedRowIds": (rowIds: string[]) => any;
-    "expanded-row-ids-change": (rowIds: string[]) => any;
-    "update:columnWidths": (widths: TableColumnWidths) => any;
-    "column-widths-change": (widths: TableColumnWidths) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:sort"?: ((sort: TableSort) => any) | undefined;
-    "onSort-change"?: ((sort: TableSort) => any) | undefined;
-    "onUpdate:selected"?: ((selected: string[]) => any) | undefined;
-    "onSelected-change"?: ((selected: string[]) => any) | undefined;
-    "onUpdate:expandedRowIds"?: ((rowIds: string[]) => any) | undefined;
-    "onExpanded-row-ids-change"?: ((rowIds: string[]) => any) | undefined;
-    "onUpdate:columnWidths"?: ((widths: TableColumnWidths) => any) | undefined;
-    "onColumn-widths-change"?: ((widths: TableColumnWidths) => any) | undefined;
-}>, {
-    sort: TableSort;
-    selected: Set<string> | string[];
-    defaultSort: TableSort;
-    multiSort: boolean;
-    defaultSelected: Set<string> | string[];
-    selectionMode: TableSelectionMode;
-    getSortLabel: (column: string, direction: SortDirection | null) => string;
-    expandedRowIds: string[];
-    defaultExpandedRowIds: string[];
-    columnWidths: TableColumnWidths;
-    defaultColumnWidths: TableColumnWidths;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
+import { type SortDirection, type TableColumnDef, type TableColumnWidths, type TableSelectionMode, type TableSort } from './context.js';
+declare const _default: <TRow extends Record<string, unknown> = Record<string, unknown>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
+        readonly "onUpdate:sort"?: ((sort: TableSort) => any) | undefined;
+        readonly "onSort-change"?: ((sort: TableSort) => any) | undefined;
+        readonly "onUpdate:selected"?: ((selected: string[]) => any) | undefined;
+        readonly "onSelected-change"?: ((selected: string[]) => any) | undefined;
+        readonly "onUpdate:expandedRowIds"?: ((rowIds: string[]) => any) | undefined;
+        readonly "onExpanded-row-ids-change"?: ((rowIds: string[]) => any) | undefined;
+        readonly "onUpdate:columnWidths"?: ((widths: TableColumnWidths) => any) | undefined;
+        readonly "onColumn-widths-change"?: ((widths: TableColumnWidths) => any) | undefined;
+        readonly "onColumn-widths-commit"?: ((widths: TableColumnWidths) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:sort" | "onSort-change" | "onUpdate:selected" | "onSelected-change" | "onUpdate:expandedRowIds" | "onExpanded-row-ids-change" | "onUpdate:columnWidths" | "onColumn-widths-change" | "onColumn-widths-commit"> & {
+        /** Sorted columns, most significant first, for controlled usage. Pair with `v-model:sort`. */
+        sort?: TableSort;
+        /** Initially sorted columns, for uncontrolled usage. */
+        defaultSort?: TableSort;
+        /** Total row count published as `aria-rowcount`; set when DOM doesn't hold all rows. `-1` means unknown. */
+        rowCount?: number;
+        /** Total column count published as `aria-colcount`, the column counterpart of `rowCount`. */
+        columnCount?: number;
+        /** Whether multiple columns can be sorted (appending) or one at a time (replacing). */
+        multiSort?: boolean;
+        /** Selected row ids for controlled usage. Pair with `v-model:selected`. */
+        selected?: Set<string> | string[];
+        /** Initially selected row ids, for uncontrolled usage. */
+        defaultSelected?: Set<string> | string[];
+        /**
+         * Whether rows can be selected, and whether one or many at once;
+         * `'none'` disables row-click and checkbox selection entirely.
+         * @default 'none' — or `'multiple'` when `selectable` is set and this is left unset; an explicit value here always wins over `selectable`.
+         */
+        selectionMode?: TableSelectionMode;
+        /** Format the announcement message on sortable header activation. Return empty string to announce nothing. */
+        getSortLabel?: (column: string, direction: SortDirection | null) => string;
+        /** Row ids whose detail row is open, for controlled usage. Pair with `v-model:expanded-row-ids`. */
+        expandedRowIds?: string[];
+        /** Initially expanded detail rows, for uncontrolled usage. */
+        defaultExpandedRowIds?: string[];
+        /** Per-column pixel widths keyed by `columnKey`, for controlled usage. Pair with `v-model:column-widths`. */
+        columnWidths?: TableColumnWidths;
+        /** Initial per-column pixel widths, for uncontrolled usage. Columns left out size themselves until resized. */
+        defaultColumnWidths?: TableColumnWidths;
+        /**
+         * The columns of the derived anatomy; sort and selection still come
+         * from this root's own state. Ignored once the default slot supplies
+         * its own parts.
+         * @default undefined — no derived anatomy; compose the parts yourself.
+         */
+        columns?: TableColumnDef<TRow>[];
+        /**
+         * The rows the derived anatomy renders, one `SkdxTableRow` each. Ignored
+         * once the default slot supplies its own parts.
+         * @default undefined — no derived anatomy.
+         */
+        data?: TRow[];
+        /**
+         * Derives each row's id from the row and its index, for `selectable`
+         * and `expandable`. Ignored once the default slot supplies its own parts.
+         * @default (row, index) => String(row.id ?? index)
+         */
+        rowId?: (row: TRow, index: number) => string;
+        /**
+         * Makes derived columns sortable; a column can set `sortable: false` to opt out.
+         * @default false — derived columns are not sortable.
+         */
+        sortable?: boolean;
+        /**
+         * Derives a selection checkbox column; sets `selectionMode` to `'multiple'`
+         * unless explicitly set. An explicit `selectionMode` always wins.
+         * @default false — no selection column, and no change to `selectionMode`.
+         */
+        selectable?: boolean;
+        /**
+         * Derives an expand-trigger column and detail row per row. Pair with
+         * `renderExpanded`; alone renders an empty detail row.
+         * @default false — no expand column.
+         */
+        expandable?: boolean;
+        /**
+         * Makes derived columns resizable; a column can set `resizable: false` to opt out.
+         * @default false — derived columns are not resizable.
+         */
+        resizable?: boolean;
+        /**
+         * Content for the derived empty state, shown when `data` is empty.
+         * @default undefined — no derived empty state.
+         */
+        empty?: string;
+        /** The content of the derived `<caption>` element, which names the table for assistive technology. @default undefined — no caption. */
+        caption?: string;
+        /**
+         * Cell renderer for derived anatomy, overriding `String(row[column.key])`.
+         * @default undefined — each cell renders `String(row[column.key])`.
+         */
+        renderCell?: (row: TRow, column: TableColumnDef<TRow>) => unknown;
+        /**
+         * Renders expanded detail content for a row in the derived anatomy.
+         * @default undefined — a derived detail row renders empty.
+         */
+        renderExpanded?: (row: TRow) => unknown;
+    } & Partial<{}>> & import("vue").PublicProps;
+    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {
+        default?: (props: {}) => any;
     };
+    emit: ((evt: "update:sort", sort: TableSort) => void) & ((evt: "sort-change", sort: TableSort) => void) & ((evt: "update:selected", selected: string[]) => void) & ((evt: "selected-change", selected: string[]) => void) & ((evt: "update:expandedRowIds", rowIds: string[]) => void) & ((evt: "expanded-row-ids-change", rowIds: string[]) => void) & ((evt: "update:columnWidths", widths: TableColumnWidths) => void) & ((evt: "column-widths-change", widths: TableColumnWidths) => void) & ((evt: "column-widths-commit", widths: TableColumnWidths) => void);
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
 };
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/table/Table.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const $=require("../utils/id.cjs"),j=require("../utils/liveAnnouncer.cjs"),W=require("./context.cjs");let l=require("vue");var D=(0,l.defineComponent)({__name:"Table",props:{sort:{default:void 0},defaultSort:{default:null},multiSort:{type:Boolean,default:!1},selected:{default:void 0},defaultSelected:{default:void 0},selectionMode:{default:"none"},getSortLabel:{type:Function,default:W.defaultGetSortLabel},expandedRowIds:{default:void 0},defaultExpandedRowIds:{default:()=>[]},columnWidths:{default:void 0},defaultColumnWidths:{default:()=>({})}},emits:["update:sort","sort-change","update:selected","selected-change","update:expandedRowIds","expanded-row-ids-change","update:columnWidths","column-widths-change"],setup(M,{emit:q}){function A(e){return e?Array.isArray(e)?e:[e]:[]}function E(e,t,o){const d=e.find(r=>r.columnKey===t),u=d===void 0?"asc":d.direction==="asc"?"desc":null;return o?u===null?e.filter(r=>r.columnKey!==t):d===void 0?[...e,{columnKey:t,direction:u}]:e.map(r=>r.columnKey===t?{columnKey:t,direction:u}:r):u===null?[]:[{columnKey:t,direction:u}]}function m(e){return e===void 0?new Set:e instanceof Set?e:new Set(e)}const n=M,s=q,L=$.nextId("table"),h=(0,l.ref)(null),w=(0,l.ref)(n.defaultSort??null),C=(0,l.computed)(()=>n.sort!==void 0?n.sort:w.value),v=(0,l.computed)(()=>A(C.value)),I=(0,l.computed)(()=>v.value[0]??null),g=(0,l.ref)(m(n.defaultSelected??[])),a=(0,l.computed)(()=>n.selected!==void 0?m(n.selected):g.value);function k(e){n.sort===void 0&&(w.value=e),s("update:sort",e),s("sort-change",e)}function c(e){n.selected===void 0&&(g.value=e);const t=[...e];s("update:selected",t),s("selected-change",t)}function y(e,t=e){const o=E(v.value,e,n.multiSort);k(n.multiSort?o:o[0]??null);const d=o.find(u=>u.columnKey===e)?.direction??null;j.announce(n.getSortLabel(t,d))}function T(){const e=h.value?.querySelectorAll(":scope > tbody > tr[data-row-id]");return e?[...e].map(t=>t.dataset.rowId):[]}let i=null;function B(e,t=!1){if(n.selectionMode==="none")return;const o=a.value;if(t&&n.selectionMode==="multiple"&&i!==null&&i!==e){const u=T(),r=u.indexOf(i),S=u.indexOf(e);if(r!==-1&&S!==-1){const X=u.slice(Math.min(r,S),Math.max(r,S)+1);c(new Set([...o,...X]));return}}if(i=e,n.selectionMode==="single"){c(o.has(e)&&o.size===1?new Set:new Set([e]));return}const d=new Set(o);d.has(e)?d.delete(e):d.add(e),c(d)}function O(e){return a.value.has(e)}function x(e){return e.length>0&&e.every(t=>a.value.has(t))}function z(e){return e.some(t=>a.value.has(t))&&!x(e)}function F(e){if(n.selectionMode==="none")return;const t=a.value;if(e.length>0&&e.every(o=>t.has(o))){const o=new Set(t);for(const d of e)o.delete(d);c(o);return}c(new Set([...t,...e]))}const R=(0,l.ref)(n.defaultExpandedRowIds),f=(0,l.computed)(()=>n.expandedRowIds??R.value),_=(0,l.computed)(()=>new Set(f.value));function G(e){const t=f.value.includes(e)?f.value.filter(o=>o!==e):[...f.value,e];n.expandedRowIds===void 0&&(R.value=t),s("update:expandedRowIds",t),s("expanded-row-ids-change",t)}function N(e){return _.value.has(e)}const b=(0,l.ref)({...n.defaultColumnWidths}),p=(0,l.computed)(()=>n.columnWidths??b.value);function V(e,t){if(p.value[e]===t)return;const o={...p.value,[e]:t};n.columnWidths===void 0&&(b.value=o),s("update:columnWidths",o),s("column-widths-change",o)}return(0,l.provide)(W.TABLE_CONTEXT,{tableId:L,sort:I,sortList:v,get multiSort(){return n.multiSort},selected:a,get selectionMode(){return n.selectionMode},toggleSort:y,toggleRow:B,isRowSelected:O,toggleAll:F,isAllSelected:x,isSomeSelected:z,expandedRows:_,toggleRowExpanded:G,isRowExpanded:N,columnWidths:p,setColumnWidth:V}),(e,t)=>((0,l.openBlock)(),(0,l.createElementBlock)("table",{class:"skdx-table","data-part":"root","data-skdx-component":"table",ref_key:"tableRef",ref:h},[(0,l.renderSlot)(e.$slots,"default")],512))}});exports.default=D;
+const $=require("../utils/id.cjs"),j=require("../utils/liveAnnouncer.cjs"),q=require("./context.cjs"),D=require("./TableAnatomy.vue.cjs");let l=require("vue");var H=["aria-rowcount","aria-colcount"],J=(0,l.defineComponent)({__name:"Table",props:{sort:{default:void 0},defaultSort:{default:()=>[]},rowCount:{default:void 0},columnCount:{default:void 0},multiSort:{type:Boolean,default:!1},selected:{default:void 0},defaultSelected:{default:void 0},selectionMode:{default:void 0},getSortLabel:{type:Function,default:q.defaultGetSortLabel},expandedRowIds:{default:void 0},defaultExpandedRowIds:{default:()=>[]},columnWidths:{default:void 0},defaultColumnWidths:{default:()=>({})},columns:{default:void 0},data:{default:void 0},rowId:{type:Function,default:void 0},sortable:{type:Boolean,default:!1},selectable:{type:Boolean,default:!1},expandable:{type:Boolean,default:!1},resizable:{type:Boolean,default:!1},empty:{default:void 0},caption:{default:void 0},renderCell:{type:Function,default:void 0},renderExpanded:{type:Function,default:void 0}},emits:["update:sort","sort-change","update:selected","selected-change","update:expandedRowIds","expanded-row-ids-change","update:columnWidths","column-widths-change","column-widths-commit"],setup(d,{emit:B}){function E(e,t,n){const a=e.find(r=>r.columnKey===t),u=a===void 0?"asc":a.direction==="asc"?"desc":null;return n?u===null?e.filter(r=>r.columnKey!==t):a===void 0?[...e,{columnKey:t,direction:u}]:e.map(r=>r.columnKey===t?{columnKey:t,direction:u}:r):u===null?[]:[{columnKey:t,direction:u}]}function h(e){return e===void 0?new Set:e instanceof Set?e:new Set(e)}const o=d,s=(0,l.computed)(()=>o.selectionMode??(o.selectable?"multiple":"none")),c=B,k=$.nextId("table"),S=(0,l.ref)(null),x=(0,l.ref)(o.defaultSort),b=(0,l.computed)(()=>o.sort!==void 0?o.sort:x.value),g=(0,l.ref)(h(o.defaultSelected??[])),i=(0,l.computed)(()=>o.selected!==void 0?h(o.selected):g.value);function I(e){o.sort===void 0&&(x.value=e),c("update:sort",e),c("sort-change",e)}function f(e){o.selected===void 0&&(g.value=e);const t=[...e];c("update:selected",t),c("selected-change",t)}function A(e,t=e){const n=E(b.value,e,o.multiSort);I(n);const a=n.find(u=>u.columnKey===e)?.direction??null;j.announce(o.getSortLabel(t,a))}function L(){const e=S.value?.querySelectorAll(":scope > tbody > tr[data-row-id]");return e?[...e].map(t=>t.dataset.rowId):[]}let v=null;function M(e,t=!1){if(s.value==="none")return;const n=i.value;if(t&&s.value==="multiple"&&v!==null&&v!==e){const u=L(),r=u.indexOf(v),p=u.indexOf(e);if(r!==-1&&p!==-1){const X=u.slice(Math.min(r,p),Math.max(r,p)+1);f(new Set([...n,...X]));return}}if(v=e,s.value==="single"){f(n.has(e)&&n.size===1?new Set:new Set([e]));return}const a=new Set(n);a.has(e)?a.delete(e):a.add(e),f(a)}function T(e){return i.value.has(e)}function R(e){return e.length>0&&e.every(t=>i.value.has(t))}function z(e){return e.some(t=>i.value.has(t))&&!R(e)}function F(e){if(s.value==="none")return;const t=i.value;if(e.length>0&&e.every(n=>t.has(n))){const n=new Set(t);for(const a of e)n.delete(a);f(n);return}f(new Set([...t,...e]))}const y=(0,l.ref)(o.defaultExpandedRowIds),m=(0,l.computed)(()=>o.expandedRowIds??y.value),C=(0,l.computed)(()=>new Set(m.value));function O(e){const t=m.value.includes(e)?m.value.filter(n=>n!==e):[...m.value,e];o.expandedRowIds===void 0&&(y.value=t),c("update:expandedRowIds",t),c("expanded-row-ids-change",t)}function N(e){return C.value.has(e)}const W=(0,l.ref)({...o.defaultColumnWidths}),w=(0,l.computed)(()=>o.columnWidths??W.value);function G(e,t){if(w.value[e]===t)return;const n={...w.value,[e]:t};o.columnWidths===void 0&&(W.value=n),c("update:columnWidths",n),c("column-widths-change",n)}function V(){c("column-widths-commit",w.value)}return(0,l.provide)(q.TABLE_CONTEXT,{tableId:k,sortList:b,get multiSort(){return o.multiSort},selected:i,get selectionMode(){return s.value},toggleSort:A,toggleRow:M,isRowSelected:T,toggleAll:F,isAllSelected:R,isSomeSelected:z,expandedRows:C,toggleRowExpanded:O,isRowExpanded:N,columnWidths:w,setColumnWidth:G,commitColumnWidths:V}),(e,t)=>((0,l.openBlock)(),(0,l.createElementBlock)("table",{class:"skdx-table","data-part":"root","data-skdx-component":"table",ref_key:"tableRef",ref:S,"aria-rowcount":d.rowCount,"aria-colcount":d.columnCount},[(0,l.renderSlot)(e.$slots,"default",{},()=>[d.columns&&d.data?((0,l.openBlock)(),(0,l.createBlock)(D.default,{key:0,columns:d.columns,data:d.data,"row-id":d.rowId,sortable:d.sortable,selectable:d.selectable,expandable:d.expandable,resizable:d.resizable,empty:d.empty,caption:d.caption,"render-cell":d.renderCell,"render-expanded":d.renderExpanded},null,8,["columns","data","row-id","sortable","selectable","expandable","resizable","empty","caption","render-cell","render-expanded"])):(0,l.createCommentVNode)("",!0)])],8,H))}});exports.default=J;

package/dist/table/Table.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{nextId as e}from"../utils/id.js";import{announce as t}from"../utils/liveAnnouncer.js";import{TABLE_CONTEXT as n,defaultGetSortLabel as o}from"./context.js";import{computed as l,createElementBlock as d,defineComponent as a,openBlock as u,provide as s,ref as i,renderSlot as r}from"vue";var c=/* @__PURE__ */a({__name:"Table",props:{sort:{default:void 0},defaultSort:{default:null},multiSort:{type:Boolean,default:!1},selected:{default:void 0},defaultSelected:{default:void 0},selectionMode:{default:"none"},getSortLabel:{type:Function,default:o},expandedRowIds:{default:void 0},defaultExpandedRowIds:{default:()=>[]},columnWidths:{default:void 0},defaultColumnWidths:{default:()=>({})}},emits:["update:sort","sort-change","update:selected","selected-change","update:expandedRowIds","expanded-row-ids-change","update:columnWidths","column-widths-change"],setup(o,{emit:a}){function c(e){return void 0===e?/* @__PURE__ */new Set:e instanceof Set?e:new Set(e)}const f=o,v=a,m=e("table"),p=i(null),h=i(f.defaultSort??null),S=l(()=>void 0!==f.sort?f.sort:h.value),w=l(()=>{return(e=S.value)?Array.isArray(e)?e:[e]:[];var e}),g=l(()=>w.value[0]??null),x=i(c(f.defaultSelected??[])),y=l(()=>void 0!==f.selected?c(f.selected):x.value);function R(e){void 0===f.selected&&(x.value=e);const t=[...e];v("update:selected",t),v("selected-change",t)}let b=null;function I(e){return e.length>0&&e.every(e=>y.value.has(e))}const M=i(f.defaultExpandedRowIds),W=l(()=>f.expandedRowIds??M.value),A=l(()=>new Set(W.value)),E=i({...f.defaultColumnWidths}),K=l(()=>f.columnWidths??E.value);return s(n,{tableId:m,sort:g,sortList:w,get multiSort(){return f.multiSort},selected:y,get selectionMode(){return f.selectionMode},toggleSort:function(e,n=e){const o=function(e,t,n){const o=e.find(e=>e.columnKey===t),l=void 0===o?"asc":"asc"===o.direction?"desc":null;return n?null===l?e.filter(e=>e.columnKey!==t):void 0===o?[...e,{columnKey:t,direction:l}]:e.map(e=>e.columnKey===t?{columnKey:t,direction:l}:e):null===l?[]:[{columnKey:t,direction:l}]}(w.value,e,f.multiSort);!function(e){void 0===f.sort&&(h.value=e),v("update:sort",e),v("sort-change",e)}(f.multiSort?o:o[0]??null);const l=o.find(t=>t.columnKey===e)?.direction??null;t(f.getSortLabel(n,l))},toggleRow:function(e,t=!1){if("none"===f.selectionMode)return;const n=y.value;if(t&&"multiple"===f.selectionMode&&null!==b&&b!==e){const t=function(){const e=p.value?.querySelectorAll(":scope > tbody > tr[data-row-id]");return e?[...e].map(e=>e.dataset.rowId):[]}(),o=t.indexOf(b),l=t.indexOf(e);if(-1!==o&&-1!==l){const e=t.slice(Math.min(o,l),Math.max(o,l)+1);return void R(/* @__PURE__ */new Set([...n,...e]))}}if(b=e,"single"===f.selectionMode)return void R(n.has(e)&&1===n.size?/* @__PURE__ */new Set:/* @__PURE__ */new Set([e]));const o=new Set(n);o.has(e)?o.delete(e):o.add(e),R(o)},isRowSelected:function(e){return y.value.has(e)},toggleAll:function(e){if("none"===f.selectionMode)return;const t=y.value;if(e.length>0&&e.every(e=>t.has(e))){const n=new Set(t);for(const t of e)n.delete(t);return void R(n)}R(/* @__PURE__ */new Set([...t,...e]))},isAllSelected:I,isSomeSelected:function(e){return e.some(e=>y.value.has(e))&&!I(e)},expandedRows:A,toggleRowExpanded:function(e){const t=W.value.includes(e)?W.value.filter(t=>t!==e):[...W.value,e];void 0===f.expandedRowIds&&(M.value=t),v("update:expandedRowIds",t),v("expanded-row-ids-change",t)},isRowExpanded:function(e){return A.value.has(e)},columnWidths:K,setColumnWidth:function(e,t){if(K.value[e]===t)return;const n={...K.value,[e]:t};void 0===f.columnWidths&&(E.value=n),v("update:columnWidths",n),v("column-widths-change",n)}}),(e,t)=>(u(),d("table",{class:"skdx-table","data-part":"root","data-skdx-component":"table",ref_key:"tableRef",ref:p},[r(e.$slots,"default")],512))}});export{c as default};
+import{nextId as e}from"../utils/id.js";import{announce as t}from"../utils/liveAnnouncer.js";import{TABLE_CONTEXT as o,defaultGetSortLabel as n}from"./context.js";import l from"./TableAnatomy.vue.js";import{computed as a,createBlock as d,createCommentVNode as u,createElementBlock as i,defineComponent as s,openBlock as c,provide as r,ref as f,renderSlot as m}from"vue";var p=["aria-rowcount","aria-colcount"],v=/* @__PURE__ */s({__name:"Table",props:{sort:{default:void 0},defaultSort:{default:()=>[]},rowCount:{default:void 0},columnCount:{default:void 0},multiSort:{type:Boolean,default:!1},selected:{default:void 0},defaultSelected:{default:void 0},selectionMode:{default:void 0},getSortLabel:{type:Function,default:n},expandedRowIds:{default:void 0},defaultExpandedRowIds:{default:()=>[]},columnWidths:{default:void 0},defaultColumnWidths:{default:()=>({})},columns:{default:void 0},data:{default:void 0},rowId:{type:Function,default:void 0},sortable:{type:Boolean,default:!1},selectable:{type:Boolean,default:!1},expandable:{type:Boolean,default:!1},resizable:{type:Boolean,default:!1},empty:{default:void 0},caption:{default:void 0},renderCell:{type:Function,default:void 0},renderExpanded:{type:Function,default:void 0}},emits:["update:sort","sort-change","update:selected","selected-change","update:expandedRowIds","expanded-row-ids-change","update:columnWidths","column-widths-change","column-widths-commit"],setup(n,{emit:s}){function v(e){return void 0===e?/* @__PURE__ */new Set:e instanceof Set?e:new Set(e)}const w=n,h=a(()=>w.selectionMode??(w.selectable?"multiple":"none")),b=s,x=e("table"),S=f(null),y=f(w.defaultSort),g=a(()=>void 0!==w.sort?w.sort:y.value),C=f(v(w.defaultSelected??[])),R=a(()=>void 0!==w.selected?v(w.selected):C.value);function I(e){void 0===w.selected&&(C.value=e);const t=[...e];b("update:selected",t),b("selected-change",t)}let W=null;function B(e){return e.length>0&&e.every(e=>R.value.has(e))}const E=f(w.defaultExpandedRowIds),k=a(()=>w.expandedRowIds??E.value),K=a(()=>new Set(k.value)),A=f({...w.defaultColumnWidths}),z=a(()=>w.columnWidths??A.value);return r(o,{tableId:x,sortList:g,get multiSort(){return w.multiSort},selected:R,get selectionMode(){return h.value},toggleSort:function(e,o=e){const n=function(e,t,o){const n=e.find(e=>e.columnKey===t),l=void 0===n?"asc":"asc"===n.direction?"desc":null;return o?null===l?e.filter(e=>e.columnKey!==t):void 0===n?[...e,{columnKey:t,direction:l}]:e.map(e=>e.columnKey===t?{columnKey:t,direction:l}:e):null===l?[]:[{columnKey:t,direction:l}]}(g.value,e,w.multiSort);!function(e){void 0===w.sort&&(y.value=e),b("update:sort",e),b("sort-change",e)}(n);const l=n.find(t=>t.columnKey===e)?.direction??null;t(w.getSortLabel(o,l))},toggleRow:function(e,t=!1){if("none"===h.value)return;const o=R.value;if(t&&"multiple"===h.value&&null!==W&&W!==e){const t=function(){const e=S.value?.querySelectorAll(":scope > tbody > tr[data-row-id]");return e?[...e].map(e=>e.dataset.rowId):[]}(),n=t.indexOf(W),l=t.indexOf(e);if(-1!==n&&-1!==l){const e=t.slice(Math.min(n,l),Math.max(n,l)+1);return void I(/* @__PURE__ */new Set([...o,...e]))}}if(W=e,"single"===h.value)return void I(o.has(e)&&1===o.size?/* @__PURE__ */new Set:/* @__PURE__ */new Set([e]));const n=new Set(o);n.has(e)?n.delete(e):n.add(e),I(n)},isRowSelected:function(e){return R.value.has(e)},toggleAll:function(e){if("none"===h.value)return;const t=R.value;if(e.length>0&&e.every(e=>t.has(e))){const o=new Set(t);for(const t of e)o.delete(t);return void I(o)}I(/* @__PURE__ */new Set([...t,...e]))},isAllSelected:B,isSomeSelected:function(e){return e.some(e=>R.value.has(e))&&!B(e)},expandedRows:K,toggleRowExpanded:function(e){const t=k.value.includes(e)?k.value.filter(t=>t!==e):[...k.value,e];void 0===w.expandedRowIds&&(E.value=t),b("update:expandedRowIds",t),b("expanded-row-ids-change",t)},isRowExpanded:function(e){return K.value.has(e)},columnWidths:z,setColumnWidth:function(e,t){if(z.value[e]===t)return;const o={...z.value,[e]:t};void 0===w.columnWidths&&(A.value=o),b("update:columnWidths",o),b("column-widths-change",o)},commitColumnWidths:function(){b("column-widths-commit",z.value)}}),(e,t)=>(c(),i("table",{class:"skdx-table","data-part":"root","data-skdx-component":"table",ref_key:"tableRef",ref:S,"aria-rowcount":n.rowCount,"aria-colcount":n.columnCount},[m(e.$slots,"default",{},()=>[n.columns&&n.data?(c(),d(l,{key:0,columns:n.columns,data:n.data,"row-id":n.rowId,sortable:n.sortable,selectable:n.selectable,expandable:n.expandable,resizable:n.resizable,empty:n.empty,caption:n.caption,"render-cell":n.renderCell,"render-expanded":n.renderExpanded},null,8,["columns","data","row-id","sortable","selectable","expandable","resizable","empty","caption","render-cell","render-expanded"])):u("",!0)])],8,p))}});export{v as default};

package/dist/table/TableAnatomy.vue.cjs

@@ -0,0 +1 @@
+const e=require("./TableAnatomy.vue_vue_type_script_setup_true_lang.cjs");var t=e.default;exports.default=t;

package/dist/table/TableAnatomy.vue.d.cts

@@ -0,0 +1,26 @@
+import { type TableColumnDef } from './context.cjs';
+declare const _default: <TRow extends Record<string, unknown>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, never> & {
+        columns: TableColumnDef<TRow>[];
+        data: TRow[];
+        rowId?: (row: TRow, index: number) => string;
+        sortable?: boolean;
+        selectable?: boolean;
+        expandable?: boolean;
+        resizable?: boolean;
+        empty?: string;
+        caption?: string;
+        renderCell?: (row: TRow, column: TableColumnDef<TRow>) => unknown;
+        renderExpanded?: (row: TRow) => unknown;
+    } & Partial<{}>> & import("vue").PublicProps;
+    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {};
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/table/TableAnatomy.vue.d.ts

@@ -0,0 +1,26 @@
+import { type TableColumnDef } from './context.js';
+declare const _default: <TRow extends Record<string, unknown>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, never> & {
+        columns: TableColumnDef<TRow>[];
+        data: TRow[];
+        rowId?: (row: TRow, index: number) => string;
+        sortable?: boolean;
+        selectable?: boolean;
+        expandable?: boolean;
+        resizable?: boolean;
+        empty?: string;
+        caption?: string;
+        renderCell?: (row: TRow, column: TableColumnDef<TRow>) => unknown;
+        renderExpanded?: (row: TRow) => unknown;
+    } & Partial<{}>> & import("vue").PublicProps;
+    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {};
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/table/TableAnatomy.vue.js

@@ -0,0 +1 @@
+import e from"./TableAnatomy.vue_vue_type_script_setup_true_lang.js";var t=e;export{t as default};

package/dist/table/TableAnatomy.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const f=require("../utils/renderProp.cjs"),x=require("./context.cjs"),q=require("./TableBody.vue.cjs"),w=require("./TableCaption.vue.cjs"),k=require("./TableCell.vue.cjs"),T=require("./TableEmpty.vue.cjs"),g=require("./TableExpandedRow.vue.cjs"),h=require("./TableExpandTrigger.vue.cjs"),v=require("./TableHeader.vue.cjs"),s=require("./TableHeaderCell.vue.cjs"),m=require("./TableRow.vue.cjs"),N=require("./TableRowSelectCheckbox.vue.cjs"),V=require("./TableSelectAllCheckbox.vue.cjs");let e=require("vue");var E=(0,e.defineComponent)({__name:"TableAnatomy",props:{columns:{},data:{},rowId:{type:Function,default:void 0},sortable:{type:Boolean,default:!1},selectable:{type:Boolean,default:!1},expandable:{type:Boolean,default:!1},resizable:{type:Boolean,default:!1},empty:{default:void 0},caption:{default:void 0},renderCell:{type:Function,default:void 0},renderExpanded:{type:Function,default:void 0}},setup(r){const o=r,p=(0,e.inject)(x.TABLE_CONTEXT);if(!p)throw new Error("TableAnatomy must be used within SkdxTable.");function c(a,l){if(o.rowId)return o.rowId(a,l);const t=a.id;return String(t===void 0?l:t)}function B(a,l){const t=a[l.key];return t==null?"":String(t)}function b(a,l){return typeof a=="number"&&typeof l=="number"?a-l:String(a??"").localeCompare(String(l??""))}const d=(0,e.computed)(()=>{const a=p.sortList.value;return a.length===0?o.data:[...o.data].sort((l,t)=>{for(const{columnKey:n,direction:u}of a){const i=b(l[n],t[n]);if(i!==0)return u==="asc"?i:-i}return 0})}),y=(0,e.computed)(()=>o.columns.length+(o.selectable?1:0)+(o.expandable?1:0)),C=(0,e.computed)(()=>d.value.map((a,l)=>c(a,l)));return(a,l)=>((0,e.openBlock)(),(0,e.createElementBlock)(e.Fragment,null,[r.caption?((0,e.openBlock)(),(0,e.createBlock)(w.default,{key:0},{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(r.caption),1)]),_:1})):(0,e.createCommentVNode)("",!0),(0,e.createVNode)(v.default,null,{default:(0,e.withCtx)(()=>[(0,e.createVNode)(m.default,null,{default:(0,e.withCtx)(()=>[r.selectable?((0,e.openBlock)(),(0,e.createBlock)(s.default,{key:0},{default:(0,e.withCtx)(()=>[(0,e.createVNode)(V.default,{"row-ids":C.value,scope:"page"},null,8,["row-ids"])]),_:1})):(0,e.createCommentVNode)("",!0),r.expandable?((0,e.openBlock)(),(0,e.createBlock)(s.default,{key:1,"aria-hidden":"true"})):(0,e.createCommentVNode)("",!0),((0,e.openBlock)(!0),(0,e.createElementBlock)(e.Fragment,null,(0,e.renderList)(r.columns,t=>((0,e.openBlock)(),(0,e.createBlock)(s.default,{key:t.key,"column-key":t.key,sortable:r.sortable&&t.sortable!==!1,resizable:r.resizable&&t.resizable!==!1},{default:(0,e.withCtx)(()=>[t.header!==void 0&&typeof t.header!="string"?((0,e.openBlock)(),(0,e.createBlock)((0,e.unref)(f.RenderProp),{key:0,render:()=>t.header},null,8,["render"])):((0,e.openBlock)(),(0,e.createElementBlock)(e.Fragment,{key:1},[(0,e.createTextVNode)((0,e.toDisplayString)(t.header??t.key),1)],64))]),_:2},1032,["column-key","sortable","resizable"]))),128))]),_:1})]),_:1}),(0,e.createVNode)(q.default,null,{default:(0,e.withCtx)(()=>[d.value.length===0&&r.empty?((0,e.openBlock)(),(0,e.createBlock)(T.default,{key:0,"col-span":y.value},{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(r.empty),1)]),_:1},8,["col-span"])):(0,e.createCommentVNode)("",!0),((0,e.openBlock)(!0),(0,e.createElementBlock)(e.Fragment,null,(0,e.renderList)(d.value,(t,n)=>((0,e.openBlock)(),(0,e.createElementBlock)(e.Fragment,{key:c(t,n)},[(0,e.createVNode)(m.default,{"row-id":r.selectable?c(t,n):void 0},{default:(0,e.withCtx)(()=>[r.selectable?((0,e.openBlock)(),(0,e.createBlock)(k.default,{key:0},{default:(0,e.withCtx)(()=>[(0,e.createVNode)(N.default,{"row-id":c(t,n),"aria-label":`Select row ${n+1}`},null,8,["row-id","aria-label"])]),_:2},1024)):(0,e.createCommentVNode)("",!0),r.expandable?((0,e.openBlock)(),(0,e.createBlock)(k.default,{key:1},{default:(0,e.withCtx)(()=>[(0,e.createVNode)(h.default,{"row-id":c(t,n)},{default:(0,e.withCtx)(()=>[...l[0]||(l[0]=[(0,e.createTextVNode)("▸",-1)])]),_:1},8,["row-id"])]),_:2},1024)):(0,e.createCommentVNode)("",!0),((0,e.openBlock)(!0),(0,e.createElementBlock)(e.Fragment,null,(0,e.renderList)(r.columns,u=>((0,e.openBlock)(),(0,e.createBlock)(k.default,{key:u.key},{default:(0,e.withCtx)(()=>[typeof r.renderCell=="function"?((0,e.openBlock)(),(0,e.createBlock)((0,e.unref)(f.RenderProp),{key:0,render:()=>o.renderCell(t,u)},null,8,["render"])):((0,e.openBlock)(),(0,e.createElementBlock)(e.Fragment,{key:1},[(0,e.createTextVNode)((0,e.toDisplayString)(B(t,u)),1)],64))]),_:2},1024))),128))]),_:2},1032,["row-id"]),r.expandable?((0,e.openBlock)(),(0,e.createBlock)(g.default,{key:0,"row-id":c(t,n),"col-span":y.value},{default:(0,e.withCtx)(()=>[typeof r.renderExpanded=="function"?((0,e.openBlock)(),(0,e.createBlock)((0,e.unref)(f.RenderProp),{key:0,render:()=>o.renderExpanded(t)},null,8,["render"])):(0,e.createCommentVNode)("",!0)]),_:2},1032,["row-id","col-span"])):(0,e.createCommentVNode)("",!0)],64))),128))]),_:1})],64))}});exports.default=E;

package/dist/table/TableAnatomy.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{RenderProp as e}from"../utils/renderProp.js";import{TABLE_CONTEXT as l}from"./context.js";import a from"./TableBody.vue.js";import r from"./TableCaption.vue.js";import t from"./TableCell.vue.js";import o from"./TableEmpty.vue.js";import n from"./TableExpandedRow.vue.js";import d from"./TableExpandTrigger.vue.js";import u from"./TableHeader.vue.js";import i from"./TableHeaderCell.vue.js";import s from"./TableRow.vue.js";import p from"./TableRowSelectCheckbox.vue.js";import c from"./TableSelectAllCheckbox.vue.js";import{Fragment as f,computed as m,createBlock as y,createCommentVNode as b,createElementBlock as k,createTextVNode as v,createVNode as w,defineComponent as T,inject as x,openBlock as _,renderList as j,toDisplayString as g,unref as h,withCtx as C}from"vue";var E=/* @__PURE__ */T({__name:"TableAnatomy",props:{columns:{},data:{},rowId:{type:Function,default:void 0},sortable:{type:Boolean,default:!1},selectable:{type:Boolean,default:!1},expandable:{type:Boolean,default:!1},resizable:{type:Boolean,default:!1},empty:{default:void 0},caption:{default:void 0},renderCell:{type:Function,default:void 0},renderExpanded:{type:Function,default:void 0}},setup(T){const E=T,B=x(l);if(!B)throw new Error("TableAnatomy must be used within SkdxTable.");function S(e,l){if(E.rowId)return E.rowId(e,l);const a=e.id;return String(void 0===a?l:a)}function z(e,l){const a=e[l.key];return null==a?"":String(a)}function A(e,l){return"number"==typeof e&&"number"==typeof l?e-l:String(e??"").localeCompare(String(l??""))}const F=m(()=>{const e=B.sortList.value;return 0===e.length?E.data:[...E.data].sort((l,a)=>{for(const{columnKey:r,direction:t}of e){const e=A(l[r],a[r]);if(0!==e)return"asc"===t?e:-e}return 0})}),N=m(()=>E.columns.length+(E.selectable?1:0)+(E.expandable?1:0)),R=m(()=>F.value.map((e,l)=>S(e,l)));return(l,m)=>(_(),k(f,null,[T.caption?(_(),y(r,{key:0},{default:C(()=>[v(g(T.caption),1)]),_:1})):b("",!0),w(u,null,{default:C(()=>[w(s,null,{default:C(()=>[T.selectable?(_(),y(i,{key:0},{default:C(()=>[w(c,{"row-ids":R.value,scope:"page"},null,8,["row-ids"])]),_:1})):b("",!0),T.expandable?(_(),y(i,{key:1,"aria-hidden":"true"})):b("",!0),(_(!0),k(f,null,j(T.columns,l=>(_(),y(i,{key:l.key,"column-key":l.key,sortable:T.sortable&&!1!==l.sortable,resizable:T.resizable&&!1!==l.resizable},{default:C(()=>[void 0!==l.header&&"string"!=typeof l.header?(_(),y(h(e),{key:0,render:()=>l.header},null,8,["render"])):(_(),k(f,{key:1},[v(g(l.header??l.key),1)],64))]),_:2},1032,["column-key","sortable","resizable"]))),128))]),_:1})]),_:1}),w(a,null,{default:C(()=>[0===F.value.length&&T.empty?(_(),y(o,{key:0,"col-span":N.value},{default:C(()=>[v(g(T.empty),1)]),_:1},8,["col-span"])):b("",!0),(_(!0),k(f,null,j(F.value,(l,a)=>(_(),k(f,{key:S(l,a)},[w(s,{"row-id":T.selectable?S(l,a):void 0},{default:C(()=>[T.selectable?(_(),y(t,{key:0},{default:C(()=>[w(p,{"row-id":S(l,a),"aria-label":`Select row ${a+1}`},null,8,["row-id","aria-label"])]),_:2},1024)):b("",!0),T.expandable?(_(),y(t,{key:1},{default:C(()=>[w(d,{"row-id":S(l,a)},{default:C(()=>[...m[0]||(m[0]=[v("▸",-1)])]),_:1},8,["row-id"])]),_:2},1024)):b("",!0),(_(!0),k(f,null,j(T.columns,a=>(_(),y(t,{key:a.key},{default:C(()=>["function"==typeof T.renderCell?(_(),y(h(e),{key:0,render:()=>E.renderCell(l,a)},null,8,["render"])):(_(),k(f,{key:1},[v(g(z(l,a)),1)],64))]),_:2},1024))),128))]),_:2},1032,["row-id"]),T.expandable?(_(),y(n,{key:0,"row-id":S(l,a),"col-span":N.value},{default:C(()=>["function"==typeof T.renderExpanded?(_(),y(h(e),{key:0,render:()=>E.renderExpanded(l)},null,8,["render"])):b("",!0)]),_:2},1032,["row-id","col-span"])):b("",!0)],64))),128))]),_:1})],64))}});export{E as default};

package/dist/table/TableColumnHeaderSortTrigger.vue.d.cts

@@ -1,34 +1,22 @@
 /**
- * The button inside a sortable `<th>` that cycles its column through
- * ascending → descending → unsorted — the APG sortable-table pattern, so the
- * sort control announces as a button and activates on Enter/Space natively
- * while the `<th>` itself stays out of the tab order.
- *
- * An `SkdxTableHeaderCell` with a `sortKey` renders one of these around its
- * slot content for you. Render it yourself when the header needs more than a
- * label inside the button (a sort indicator, an icon, a count) — the cell
- * notices an `SkdxTableColumnHeaderSortTrigger` among its slot children and
- * stops adding its own, so exactly one sort button exists per column either
- * way.
- *
- * Carries `data-sort-direction` (`"asc"`/`"desc"`, absent while unsorted) and,
- * under `multiSort`, `data-sort-index` — the column's 0-based position in the
- * sort, which is what a "1, 2, 3" badge on a multi-sorted header is drawn from.
+ * Sort button cycling ascending → descending → unsorted. Render it yourself
+ * when the header needs more than a label in the button (sort indicator, icon, count).
+ * `SkdxTableHeaderCell` renders one automatically; both detect it and skip duplicates.
+ * Carries `data-sort-direction` and `data-sort-index` (under `multiSort`) for styling.
  */
 type __VLS_Props = {
     /**
-     * Column this trigger sorts. Inherited from the enclosing
-     * `SkdxTableHeaderCell`'s `sortKey`, so you only pass it when rendering the
-     * trigger outside one. The trigger renders nothing without either.
+     * Column this trigger sorts. Inherited from `SkdxTableHeaderCell`'s `columnKey`.
+     * Pass it when rendering outside a cell or in a non-sortable cell.
      */
-    sortKey?: string;
+    columnKey?: string;
 };
 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<{}>, {
-    sortKey: string;
+    columnKey: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/table/TableColumnHeaderSortTrigger.vue.d.ts

@@ -1,34 +1,22 @@
 /**
- * The button inside a sortable `<th>` that cycles its column through
- * ascending → descending → unsorted — the APG sortable-table pattern, so the
- * sort control announces as a button and activates on Enter/Space natively
- * while the `<th>` itself stays out of the tab order.
- *
- * An `SkdxTableHeaderCell` with a `sortKey` renders one of these around its
- * slot content for you. Render it yourself when the header needs more than a
- * label inside the button (a sort indicator, an icon, a count) — the cell
- * notices an `SkdxTableColumnHeaderSortTrigger` among its slot children and
- * stops adding its own, so exactly one sort button exists per column either
- * way.
- *
- * Carries `data-sort-direction` (`"asc"`/`"desc"`, absent while unsorted) and,
- * under `multiSort`, `data-sort-index` — the column's 0-based position in the
- * sort, which is what a "1, 2, 3" badge on a multi-sorted header is drawn from.
+ * Sort button cycling ascending → descending → unsorted. Render it yourself
+ * when the header needs more than a label in the button (sort indicator, icon, count).
+ * `SkdxTableHeaderCell` renders one automatically; both detect it and skip duplicates.
+ * Carries `data-sort-direction` and `data-sort-index` (under `multiSort`) for styling.
  */
 type __VLS_Props = {
     /**
-     * Column this trigger sorts. Inherited from the enclosing
-     * `SkdxTableHeaderCell`'s `sortKey`, so you only pass it when rendering the
-     * trigger outside one. The trigger renders nothing without either.
+     * Column this trigger sorts. Inherited from `SkdxTableHeaderCell`'s `columnKey`.
+     * Pass it when rendering outside a cell or in a non-sortable cell.
      */
-    sortKey?: string;
+    columnKey?: string;
 };
 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<{}>, {
-    sortKey: string;
+    columnKey: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/table/TableColumnHeaderSortTrigger.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const d=require("./context.cjs");let e=require("vue");var g=["data-sort-direction","data-sort-index"],p=(0,e.defineComponent)({inheritAttrs:!1,__name:"TableColumnHeaderSortTrigger",props:{sortKey:{default:void 0}},setup(u){const i=u,s=(0,e.inject)(d.TABLE_CONTEXT);if(!s)throw new Error("SkdxTableColumnHeaderSortTrigger must be used within SkdxTable");const r=s,l=(0,e.inject)(d.TABLE_HEADER_CELL_CONTEXT,void 0),o=(0,e.computed)(()=>i.sortKey??l?.sortKey),n=(0,e.computed)(()=>o.value===void 0?-1:r.sortList.value.findIndex(t=>t.columnKey===o.value)),c=(0,e.computed)(()=>r.sortList.value[n.value]?.direction),v=(0,e.computed)(()=>r.multiSort&&n.value!==-1?n.value:void 0);function m(t){const a=o.value,_=t.currentTarget?.textContent?.trim();r.toggleSort(a,_||a)}return(t,a)=>o.value!==void 0?((0,e.openBlock)(),(0,e.createElementBlock)("button",(0,e.mergeProps)({key:0,class:"skdx-table__column-header-sort-trigger","data-part":"column-header-sort-trigger",type:"button","data-skdx-table-sort-trigger":"","data-sort-direction":c.value,"data-sort-index":v.value,onClick:m},t.$attrs),[(0,e.renderSlot)(t.$slots,"default")],16,g)):(0,e.createCommentVNode)("",!0)}});exports.default=p;
+const d=require("./context.cjs");let e=require("vue");var g=["data-sort-direction","data-sort-index"],p=(0,e.defineComponent)({inheritAttrs:!1,__name:"TableColumnHeaderSortTrigger",props:{columnKey:{default:void 0}},setup(i){const c=i,l=(0,e.inject)(d.TABLE_CONTEXT);if(!l)throw new Error("SkdxTableColumnHeaderSortTrigger must be used within SkdxTable");const o=l,u=(0,e.inject)(d.TABLE_HEADER_CELL_CONTEXT,void 0),r=(0,e.computed)(()=>c.columnKey??(u?.sortable?u.columnKey:void 0)),n=(0,e.computed)(()=>r.value===void 0?-1:o.sortList.value.findIndex(t=>t.columnKey===r.value)),s=(0,e.computed)(()=>o.sortList.value[n.value]?.direction),m=(0,e.computed)(()=>o.multiSort&&n.value!==-1?n.value:void 0);function v(t){const a=r.value,_=t.currentTarget?.textContent?.trim();o.toggleSort(a,_||a)}return(t,a)=>r.value!==void 0?((0,e.openBlock)(),(0,e.createElementBlock)("button",(0,e.mergeProps)({key:0,class:"skdx-table__column-header-sort-trigger","data-part":"column-header-sort-trigger",type:"button","data-skdx-table-sort-trigger":"","data-sort-direction":s.value,"data-sort-index":m.value,onClick:v},t.$attrs),[(0,e.renderSlot)(t.$slots,"default")],16,g)):(0,e.createCommentVNode)("",!0)}});exports.default=p;

package/dist/table/TableColumnHeaderSortTrigger.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{TABLE_CONTEXT as t,TABLE_HEADER_CELL_CONTEXT as e}from"./context.js";import{computed as r,createCommentVNode as o,createElementBlock as a,defineComponent as s,inject as n,mergeProps as d,openBlock as i,renderSlot as l}from"vue";var u=["data-sort-direction","data-sort-index"],c=/* @__PURE__ */s({inheritAttrs:!1,__name:"TableColumnHeaderSortTrigger",props:{sortKey:{default:void 0}},setup(s){const c=s,m=n(t);if(!m)throw new Error("SkdxTableColumnHeaderSortTrigger must be used within SkdxTable");const v=m,g=n(e,void 0),p=r(()=>c.sortKey??g?.sortKey),T=r(()=>void 0===p.value?-1:v.sortList.value.findIndex(t=>t.columnKey===p.value)),x=r(()=>v.sortList.value[T.value]?.direction),f=r(()=>v.multiSort&&-1!==T.value?T.value:void 0);function C(t){const e=p.value,r=t.currentTarget?.textContent?.trim();v.toggleSort(e,r||e)}return(t,e)=>void 0!==p.value?(i(),a("button",d({key:0,class:"skdx-table__column-header-sort-trigger","data-part":"column-header-sort-trigger",type:"button","data-skdx-table-sort-trigger":"","data-sort-direction":x.value,"data-sort-index":f.value,onClick:C},t.$attrs),[l(t.$slots,"default")],16,u)):o("",!0)}});export{c as default};
+import{TABLE_CONTEXT as e,TABLE_HEADER_CELL_CONTEXT as t}from"./context.js";import{computed as o,createCommentVNode as r,createElementBlock as a,defineComponent as n,inject as s,mergeProps as l,openBlock as d,renderSlot as i}from"vue";var u=["data-sort-direction","data-sort-index"],c=/* @__PURE__ */n({inheritAttrs:!1,__name:"TableColumnHeaderSortTrigger",props:{columnKey:{default:void 0}},setup(n){const c=n,m=s(e);if(!m)throw new Error("SkdxTableColumnHeaderSortTrigger must be used within SkdxTable");const v=m,g=s(t,void 0),p=o(()=>c.columnKey??(g?.sortable?g.columnKey:void 0)),T=o(()=>void 0===p.value?-1:v.sortList.value.findIndex(e=>e.columnKey===p.value)),x=o(()=>v.sortList.value[T.value]?.direction),b=o(()=>v.multiSort&&-1!==T.value?T.value:void 0);function f(e){const t=p.value,o=e.currentTarget?.textContent?.trim();v.toggleSort(t,o||t)}return(e,t)=>void 0!==p.value?(d(),a("button",l({key:0,class:"skdx-table__column-header-sort-trigger","data-part":"column-header-sort-trigger",type:"button","data-skdx-table-sort-trigger":"","data-sort-direction":x.value,"data-sort-index":b.value,onClick:f},e.$attrs),[i(e.$slots,"default")],16,u)):r("",!0)}});export{c as default};

package/dist/table/TableColumnResizeTrigger.vue.d.cts

@@ -1,25 +1,14 @@
 /**
- * The column edge you drag — or focus and step with the keyboard — to resize a
- * column. A `role="separator"` with `aria-orientation="vertical"`, its own
- * accessible name, and `aria-valuenow`/`valuemin`/`valuemax`, because a
- * focusable separator is a widget and must expose all four.
- *
- * `SkdxTableHeaderCell`'s `resizable` renders one of these for you; render it
- * yourself to place it differently or to give one column a different `step`.
- *
- * Keyboard, mirrored under `dir="rtl"` so the arrow that visually widens always
- * widens: **Arrow Left/Right** step by `step`px, **Home** and **End** snap to
- * `minWidth` and `maxWidth`. Pointer: drag the handle; **Escape** mid-drag
- * reverts the column to the width it had when the drag started. Every write is
- * clamped to the bounds, and the resulting width is published on the `<th>` as
- * both an inline `width` and the `--skdx-table-column-width` custom property.
+ * Draggable/keyboard-operable column resize handle. `role="separator"` with
+ * `aria-orientation="vertical"`, `aria-valuenow/min/max`. `SkdxTableHeaderCell`
+ * renders one automatically; render it yourself to place differently or override `step`.
+ * Keyboard (mirrored under `dir="rtl"`): Arrow Left/Right step by `step`px,
+ * Home/End snap to bounds. Pointer: drag; Escape reverts.
  */
 type __VLS_Props = {
     /**
-     * Column whose width this handle writes. Inherited from the enclosing
-     * `SkdxTableHeaderCell`'s `columnKey` (which itself falls back to
-     * `sortKey`); a handle with neither has nowhere to store a width and
-     * renders nothing.
+     * Column whose width this handle writes. Inherited from
+     * `SkdxTableHeaderCell`'s `columnKey` or renders nothing.
      */
     columnKey?: string;
     /**
@@ -40,19 +29,17 @@ type __VLS_Props = {
      */
     step?: number;
     /**
-     * Accessible name for the handle — a focusable `role="separator"` is a
-     * widget and needs its own name. Prefer a column-specific one
-     * (`"Resize Name column"`): the handle sits inside the `<th>`, so its name
-     * joins the header's name-from-content.
+     * Accessible name for the handle. A focusable separator needs its own name.
+     * Prefer a column-specific one like `"Resize Name column"`.
      * @default the enclosing header cell's `resizeLabel`, otherwise `'Resize column'`.
      */
     label?: string;
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     label: string;
+    step: number;
     maxWidth: number;
     minWidth: number;
-    step: number;
     columnKey: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/table/TableColumnResizeTrigger.vue.d.ts

@@ -1,25 +1,14 @@
 /**
- * The column edge you drag — or focus and step with the keyboard — to resize a
- * column. A `role="separator"` with `aria-orientation="vertical"`, its own
- * accessible name, and `aria-valuenow`/`valuemin`/`valuemax`, because a
- * focusable separator is a widget and must expose all four.
- *
- * `SkdxTableHeaderCell`'s `resizable` renders one of these for you; render it
- * yourself to place it differently or to give one column a different `step`.
- *
- * Keyboard, mirrored under `dir="rtl"` so the arrow that visually widens always
- * widens: **Arrow Left/Right** step by `step`px, **Home** and **End** snap to
- * `minWidth` and `maxWidth`. Pointer: drag the handle; **Escape** mid-drag
- * reverts the column to the width it had when the drag started. Every write is
- * clamped to the bounds, and the resulting width is published on the `<th>` as
- * both an inline `width` and the `--skdx-table-column-width` custom property.
+ * Draggable/keyboard-operable column resize handle. `role="separator"` with
+ * `aria-orientation="vertical"`, `aria-valuenow/min/max`. `SkdxTableHeaderCell`
+ * renders one automatically; render it yourself to place differently or override `step`.
+ * Keyboard (mirrored under `dir="rtl"`): Arrow Left/Right step by `step`px,
+ * Home/End snap to bounds. Pointer: drag; Escape reverts.
  */
 type __VLS_Props = {
     /**
-     * Column whose width this handle writes. Inherited from the enclosing
-     * `SkdxTableHeaderCell`'s `columnKey` (which itself falls back to
-     * `sortKey`); a handle with neither has nowhere to store a width and
-     * renders nothing.
+     * Column whose width this handle writes. Inherited from
+     * `SkdxTableHeaderCell`'s `columnKey` or renders nothing.
      */
     columnKey?: string;
     /**
@@ -40,19 +29,17 @@ type __VLS_Props = {
      */
     step?: number;
     /**
-     * Accessible name for the handle — a focusable `role="separator"` is a
-     * widget and needs its own name. Prefer a column-specific one
-     * (`"Resize Name column"`): the handle sits inside the `<th>`, so its name
-     * joins the header's name-from-content.
+     * Accessible name for the handle. A focusable separator needs its own name.
+     * Prefer a column-specific one like `"Resize Name column"`.
      * @default the enclosing header cell's `resizeLabel`, otherwise `'Resize column'`.
      */
     label?: string;
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     label: string;
+    step: number;
     maxWidth: number;
     minWidth: number;
-    step: number;
     columnKey: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;