@skdx/react 0.26.0

package/dist/switch/types.d.cts

@@ -0,0 +1,47 @@
+import type { PrimitivePropsWithRef } from '../utils/primitive.cjs';
+/** @internal Shared state distributed from {@link Switch} to its {@link SwitchThumb} via context. Not part of the public API. */
+export interface SwitchContextValue {
+    checked: boolean;
+    disabled: boolean;
+}
+/** Props for the {@link Switch} root. */
+export interface SwitchProps extends Omit<PrimitivePropsWithRef<'button'>, 'defaultChecked'> {
+    /**
+     * Checked state, for controlled usage. Pair with `onCheckedChange`.
+     * @default undefined
+     */
+    checked?: boolean;
+    /**
+     * Initial checked state, for uncontrolled usage.
+     * @default false
+     */
+    defaultChecked?: boolean;
+    /**
+     * Fires with the new checked state whenever it changes, controlled or not.
+     * @default undefined
+     */
+    onCheckedChange?: (checked: boolean) => void;
+    /**
+     * Marks the underlying hidden input as required for native form validation.
+     * @default false
+     */
+    required?: boolean;
+    /**
+     * Name/value for native form participation via a hidden input.
+     * @default undefined
+     */
+    name?: string;
+    /**
+     * Value submitted with the hidden input when checked.
+     * @default 'on'
+     */
+    value?: string;
+    /**
+     * Marks the switch as invalid, exposed as `aria-invalid`/`data-invalid`.
+     * @default false
+     */
+    invalid?: boolean;
+}
+/** Props for the {@link SwitchThumb}, the sliding handle inside a {@link Switch}. */
+export interface SwitchThumbProps extends PrimitivePropsWithRef<'span'> {
+}

package/dist/switch/types.d.ts

@@ -0,0 +1,47 @@
+import type { PrimitivePropsWithRef } from '../utils/primitive.js';
+/** @internal Shared state distributed from {@link Switch} to its {@link SwitchThumb} via context. Not part of the public API. */
+export interface SwitchContextValue {
+    checked: boolean;
+    disabled: boolean;
+}
+/** Props for the {@link Switch} root. */
+export interface SwitchProps extends Omit<PrimitivePropsWithRef<'button'>, 'defaultChecked'> {
+    /**
+     * Checked state, for controlled usage. Pair with `onCheckedChange`.
+     * @default undefined
+     */
+    checked?: boolean;
+    /**
+     * Initial checked state, for uncontrolled usage.
+     * @default false
+     */
+    defaultChecked?: boolean;
+    /**
+     * Fires with the new checked state whenever it changes, controlled or not.
+     * @default undefined
+     */
+    onCheckedChange?: (checked: boolean) => void;
+    /**
+     * Marks the underlying hidden input as required for native form validation.
+     * @default false
+     */
+    required?: boolean;
+    /**
+     * Name/value for native form participation via a hidden input.
+     * @default undefined
+     */
+    name?: string;
+    /**
+     * Value submitted with the hidden input when checked.
+     * @default 'on'
+     */
+    value?: string;
+    /**
+     * Marks the switch as invalid, exposed as `aria-invalid`/`data-invalid`.
+     * @default false
+     */
+    invalid?: boolean;
+}
+/** Props for the {@link SwitchThumb}, the sliding handle inside a {@link Switch}. */
+export interface SwitchThumbProps extends PrimitivePropsWithRef<'span'> {
+}

package/dist/table/Table.cjs

@@ -0,0 +1 @@
+"use strict";var Ut=Object.create;var O=Object.defineProperty;var Yt=Object.getOwnPropertyDescriptor;var qt=Object.getOwnPropertyNames;var Gt=Object.getPrototypeOf,Jt=Object.prototype.hasOwnProperty;var Qt=(e,t)=>{for(var n in t)O(e,n,{get:t[n],enumerable:!0})},ye=(e,t,n,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let l of qt(t))!Jt.call(e,l)&&l!==n&&O(e,l,{get:()=>t[l],enumerable:!(o=Yt(t,l))||o.enumerable});return e};var u=(e,t,n)=>(n=e!=null?Ut(Gt(e)):{},ye(t||!e||!e.__esModule?O(n,"default",{value:e,enumerable:!0}):n,e)),Zt=e=>ye(O({},"__esModule",{value:!0}),e);var no={};Qt(no,{Table:()=>Ae,TableBody:()=>re,TableCaption:()=>se,TableCell:()=>ie,TableColumnHeaderSortTrigger:()=>K,TableColumnResizeTrigger:()=>X,TableEmpty:()=>fe,TableExpandTrigger:()=>de,TableExpandedRow:()=>me,TableFooter:()=>ae,TableHeader:()=>oe,TableHeaderCell:()=>le,TableHeaderCellProvider:()=>te,TableProvider:()=>Me,TableRow:()=>ne,TableRowSelectCheckbox:()=>ge,TableSelectAllCheckbox:()=>Te,TableSortIndicator:()=>be,defaultGetSortLabel:()=>Ne,defaultSelectAllLabel:()=>ue,tableDetailRowId:()=>V,useTableContext:()=>p,useTableHeaderCellContext:()=>D});module.exports=Zt(no);var s=u(require("react"),1),ke=require("../utils/composeRefs.cjs"),ee=require("../utils/createContext.cjs"),Ee=require("../utils/liveAnnouncer.cjs"),He=require("../utils/part.cjs"),Le=require("../utils/primitive.cjs"),$=require("../utils/useControllableState.cjs"),j=require("react/jsx-runtime");function we(e){return e===void 0?new Set:e instanceof Set?e:new Set(e)}var he=[],Z={};function jt(e){return e?Array.isArray(e)?e:[e]:[]}function eo(e,t,n){let o=e.find(r=>r.columnKey===t),l=o===void 0?"asc":o.direction==="asc"?"desc":null;return n?l===null?e.filter(r=>r.columnKey!==t):o===void 0?[...e,{columnKey:t,direction:l}]:e.map(r=>r.columnKey===t?{columnKey:t,direction:l}:r):l===null?[]:[{columnKey:t,direction:l}]}function Ne(e,t){return t===null?`${e} not sorted`:`${e} sorted ${t==="asc"?"ascending":"descending"}`}var[Me,p]=(0,ee.createSafeContext)("Table"),[te,D]=(0,ee.createSafeContext)("TableHeaderCell",{});function V(e,t){return`${e}-detail-${t}`}var Ae=s.forwardRef(({sort:e,defaultSort:t=null,onSortChange:n,multiSort:o=!1,selected:l,defaultSelected:r,onSelectedChange:d,selectionMode:m="none",getSortLabel:b=Ne,expandedRowIds:N,defaultExpandedRowIds:M=he,onExpandedRowIdsChange:z,columnWidths:S,defaultColumnWidths:w,onColumnWidthsChange:v,...T},R)=>{let P=s.useId(),A=s.useRef(null),_=(0,ke.useComposedRefs)(R,A),[h=null,I]=(0,$.useControllableState)({prop:e,defaultProp:t,onChange:n}),E=s.useMemo(()=>jt(h),[h]),i=E[0]??null,g=s.useMemo(()=>l===void 0?void 0:we(l),[l]),[x=new Set,W]=(0,$.useControllableState)({prop:g,defaultProp:we(r??[]),onChange:a=>d?.([...a])}),zt=s.useCallback((a,c=a)=>{let f=eo(E,a,o);I(o?f:f[0]??null);let C=f.find(y=>y.columnKey===a)?.direction??null;(0,Ee.announce)(b(c,C))},[E,o,I,b]),Re=s.useCallback(()=>{let a=A.current?.querySelectorAll(":scope > tbody > tr[data-row-id]");return a?[...a].map(c=>c.dataset.rowId):[]},[]),xe=s.useRef(null),vt=s.useCallback((a,c=!1)=>{if(m==="none")return;let f=xe.current;if(c&&m==="multiple"&&f!==null&&f!==a){let C=Re(),y=C.indexOf(f),Q=C.indexOf(a);if(y!==-1&&Q!==-1){let Xt=C.slice(Math.min(y,Q),Math.max(y,Q)+1);W((Ot=new Set)=>new Set([...Ot,...Xt]));return}}xe.current=a,W((C=new Set)=>{if(m==="single")return C.has(a)&&C.size===1?new Set:new Set([a]);let y=new Set(C);return y.has(a)?y.delete(a):y.add(a),y})},[m,W,Re]),[Ce=he,Se]=(0,$.useControllableState)({prop:N,defaultProp:M,onChange:z}),G=s.useMemo(()=>new Set(Ce),[Ce]),[It=Z,Pe]=(0,$.useControllableState)({prop:S,defaultProp:w??Z,onChange:v}),Kt=s.useCallback(a=>{Se((c=[])=>c.includes(a)?c.filter(f=>f!==a):[...c,a])},[Se]),Bt=s.useCallback(a=>G.has(a),[G]),Ft=s.useCallback((a,c)=>{Pe((f=Z)=>f[a]===c?f:{...f,[a]:c})},[Pe]),_t=s.useCallback(a=>x.has(a),[x]),J=s.useCallback(a=>a.length>0&&a.every(c=>x.has(c)),[x]),$t=s.useCallback(a=>a.some(c=>x.has(c))&&!J(a),[x,J]),Vt=s.useCallback(a=>{m!=="none"&&W((c=new Set)=>{if(a.length>0&&a.every(f=>c.has(f))){let f=new Set(c);return a.forEach(C=>f.delete(C)),f}return new Set([...c,...a])})},[m,W]);return(0,j.jsx)(Me,{tableId:P,sort:i,sortList:E,multiSort:o,selected:x,selectionMode:m,toggleSort:zt,toggleRow:vt,isRowSelected:_t,toggleAll:Vt,isAllSelected:J,isSomeSelected:$t,expandedRows:G,toggleRowExpanded:Kt,isRowExpanded:Bt,columnWidths:It,setColumnWidth:Ft,children:(0,j.jsx)(Le.Primitive.table,{...T,...(0,He.skdxPart)("table","root",T.className),ref:_})})});Ae.displayName="Table";var We=u(require("react"),1),De=require("../utils/part.cjs"),ze=require("../utils/primitive.cjs"),ve=require("react/jsx-runtime"),oe=We.forwardRef((e,t)=>(0,ve.jsx)(ze.Primitive.thead,{...e,...(0,De.skdxPart)("table","header",e.className),ref:t}));oe.displayName="TableHeader";var Ie=u(require("react"),1),Ke=require("../utils/part.cjs"),Be=require("../utils/primitive.cjs"),Fe=require("react/jsx-runtime"),re=Ie.forwardRef((e,t)=>(0,Fe.jsx)(Be.Primitive.tbody,{...e,...(0,Ke.skdxPart)("table","body",e.className),ref:t}));re.displayName="TableBody";var _e=u(require("react"),1),$e=require("../utils/part.cjs"),Ve=require("../utils/primitive.cjs"),Xe=require("react/jsx-runtime"),ae=_e.forwardRef((e,t)=>(0,Xe.jsx)(Ve.Primitive.tfoot,{...e,...(0,$e.skdxPart)("table","footer",e.className),ref:t}));ae.displayName="TableFooter";var Oe=u(require("react"),1),Ue=require("../utils/part.cjs"),U=require("../utils/primitive.cjs");var Ye=require("react/jsx-runtime"),to='button, a, input, [role="button"]',ne=Oe.forwardRef(({rowId:e,...t},n)=>{let o=p("TableRow"),l=e!==void 0&&o.isRowSelected(e),r=o.selectionMode!=="none"&&e!==void 0;return(0,Ye.jsx)(U.Primitive.tr,{"aria-selected":r?l:void 0,"data-state":l?"selected":void 0,"data-row-id":r?e:void 0,...t,...(0,Ue.skdxPart)("table","row",t.className),ref:n,onClick:(0,U.composeEventHandlers)(t.onClick,d=>{!r||d.target.closest(to)||o.toggleRow(e,d.shiftKey)})})});ne.displayName="TableRow";var L=u(require("react"),1),tt=require("../utils/part.cjs"),ot=require("../utils/primitive.cjs");var qe=u(require("react"),1),Ge=require("../utils/part.cjs"),Y=require("../utils/primitive.cjs");var Je=require("react/jsx-runtime"),K=qe.forwardRef(({sortKey:e,...t},n)=>{let o=p("TableColumnHeaderSortTrigger"),l=D("TableColumnHeaderSortTrigger"),r=e??l.sortKey;if(r===void 0)return null;let d=o.sortList.findIndex(b=>b.columnKey===r),m=o.sortList[d]?.direction;return(0,Je.jsx)(Y.Primitive.button,{type:"button","data-skdx-table-sort-trigger":"","data-sort-direction":m,"data-sort-index":o.multiSort&&d!==-1?d:void 0,...t,...(0,Ge.skdxPart)("table","column-header-sort-trigger",t.className),ref:n,onClick:(0,Y.composeEventHandlers)(t.onClick,b=>{o.toggleSort(r,b.currentTarget.textContent?.trim()||r)})})});K.displayName="TableColumnHeaderSortTrigger";var k=u(require("react"),1),Qe=require("../utils/clamp.cjs"),Ze=require("../utils/composeRefs.cjs"),B=require("../utils/direction.cjs"),je=require("../utils/part.cjs"),H=require("../utils/primitive.cjs");var et=require("react/jsx-runtime"),oo=40,ro=1e3,ao=8,X=k.forwardRef(({columnKey:e,minWidth:t,maxWidth:n,step:o,label:l,...r},d)=>{let m=p("TableColumnResizeTrigger"),b=D("TableColumnResizeTrigger"),N=(0,B.useDirection)(),M=k.useRef(null),z=(0,Ze.useComposedRefs)(d,M),S=k.useRef(null),[w,v]=k.useState(!1),T=e??b.columnKey,R=t??b.minWidth??oo,P=n??b.maxWidth??ro,A=o??b.resizeStep??ao,_=T===void 0?void 0:m.columnWidths[T],h=i=>{T!==void 0&&m.setColumnWidth(T,(0,Qe.clamp)(Math.round(i),R,P))},I=()=>_!==void 0?_:(M.current?.closest("th")?.getBoundingClientRect().width??0)||R,E=()=>{let i=S.current;if(!i)return null;S.current=null,v(!1);let g=M.current;return g?.hasPointerCapture?.(i.pointerId)&&g.releasePointerCapture(i.pointerId),i};return k.useEffect(()=>{if(!w)return;let i=g=>{if(g.key!=="Escape")return;let x=E();x&&h(x.startWidth)};return document.addEventListener("keydown",i),()=>document.removeEventListener("keydown",i)},[w,T,R,P]),T===void 0?null:(0,et.jsx)(H.Primitive.span,{role:"separator","aria-orientation":"vertical","aria-label":l??b.resizeLabel??"Resize column","aria-valuenow":Math.round(_??R),"aria-valuemin":R,"aria-valuemax":P,tabIndex:0,"data-skdx-table-resizer":"","data-dragging":w?"":void 0,...r,...(0,je.skdxPart)("table","column-resize-trigger",r.className),ref:z,onPointerDown:(0,H.composeEventHandlers)(r.onPointerDown,i=>{i.button===0&&(i.preventDefault(),i.stopPropagation(),S.current={startX:i.clientX,startWidth:I(),pointerId:i.pointerId},v(!0),i.currentTarget.setPointerCapture?.(i.pointerId))}),onPointerMove:(0,H.composeEventHandlers)(r.onPointerMove,i=>{let g=S.current;if(!g)return;let W=(0,B.resolveDirection)(i.currentTarget,N)==="rtl"?g.startX-i.clientX:i.clientX-g.startX;h(g.startWidth+W)}),onPointerUp:(0,H.composeEventHandlers)(r.onPointerUp,E),onPointerCancel:(0,H.composeEventHandlers)(r.onPointerCancel,E),onKeyDown:(0,H.composeEventHandlers)(r.onKeyDown,i=>{let g=(0,B.directionalKey)(i.key,i.currentTarget,N);if(g==="ArrowRight")h(I()+A);else if(g==="ArrowLeft")h(I()-A);else if(i.key==="Home")h(R);else if(i.key==="End")h(P);else return;i.preventDefault(),i.stopPropagation()})})});X.displayName="TableColumnResizeTrigger";var F=require("react/jsx-runtime");function rt(e){return L.Children.toArray(e).some(t=>L.isValidElement(t)?t.type===K?!0:t.type===L.Fragment&&rt(t.props.children):!1)}var le=L.forwardRef(({sortKey:e,columnKey:t,resizable:n=!1,minWidth:o=40,maxWidth:l=1e3,resizeLabel:r="Resize column",resizeStep:d=8,children:m,style:b,...N},M)=>{let z=p("TableHeaderCell"),S=e!==void 0,w=S?z.sortList.find(A=>A.columnKey===e)?.direction:void 0,v=S?w==="asc"?"ascending":w==="desc"?"descending":"none":void 0,T=t??e,R=n&&T!==void 0,P=T===void 0?void 0:z.columnWidths[T];return(0,F.jsx)(te,{sortKey:e,columnKey:T,minWidth:o,maxWidth:l,resizeLabel:r,resizeStep:d,children:(0,F.jsxs)(ot.Primitive.th,{"aria-sort":v,"data-sort-direction":w,"data-resizable":R?"":void 0,style:P===void 0?b:{...b,width:P,"--skdx-table-column-width":`${P}px`},...N,...(0,tt.skdxPart)("table","header-cell",N.className),ref:M,children:[S&&!rt(m)?(0,F.jsx)(K,{children:m}):m,R?(0,F.jsx)(X,{}):null]})})});le.displayName="TableHeaderCell";var at=u(require("react"),1),nt=require("../utils/part.cjs"),lt=require("../utils/primitive.cjs"),it=require("react/jsx-runtime"),ie=at.forwardRef((e,t)=>(0,it.jsx)(lt.Primitive.td,{...e,...(0,nt.skdxPart)("table","cell",e.className),ref:t}));ie.displayName="TableCell";var st=u(require("react"),1),dt=require("../utils/part.cjs"),ct=require("../utils/primitive.cjs"),mt=require("react/jsx-runtime"),se=st.forwardRef((e,t)=>(0,mt.jsx)(ct.Primitive.caption,{...e,...(0,dt.skdxPart)("table","caption",e.className),ref:t}));se.displayName="TableCaption";var pt=u(require("react"),1),ft=require("../utils/part.cjs"),q=require("../utils/primitive.cjs");var bt=require("react/jsx-runtime"),de=pt.forwardRef(({rowId:e,...t},n)=>{let o=p("TableExpandTrigger"),l=o.isRowExpanded(e);return(0,bt.jsx)(q.Primitive.button,{type:"button","aria-expanded":l,"aria-controls":V(o.tableId,e),"data-state":l?"expanded":"collapsed","data-skdx-table-expand-trigger":"",...t,...(0,ft.skdxPart)("table","expand-trigger",t.className),ref:n,onClick:(0,q.composeEventHandlers)(t.onClick,r=>{r.stopPropagation(),o.toggleRowExpanded(e)})})});de.displayName="TableExpandTrigger";var ut=u(require("react"),1),Tt=require("../utils/part.cjs"),gt=require("../utils/primitive.cjs");var ce=require("react/jsx-runtime"),me=ut.forwardRef(({rowId:e,colSpan:t=1,children:n,...o},l)=>{let r=p("TableExpandedRow"),d=r.isRowExpanded(e);return(0,ce.jsx)(gt.Primitive.tr,{id:V(r.tableId,e),"data-state":d?"expanded":"collapsed","data-skdx-table-detail-row":"",hidden:!d,...o,...(0,Tt.skdxPart)("table","expanded-row",o.className),ref:l,children:(0,ce.jsx)("td",{colSpan:t,children:n})})});me.displayName="TableExpandedRow";var Rt=u(require("react"),1),xt=require("../utils/part.cjs"),Ct=require("../utils/primitive.cjs"),pe=require("react/jsx-runtime"),fe=Rt.forwardRef(({colSpan:e=1,children:t,...n},o)=>(0,pe.jsx)(Ct.Primitive.tr,{"data-state":"empty","data-skdx-table-empty":"",...n,...(0,xt.skdxPart)("table","empty",n.className),ref:o,children:(0,pe.jsx)("td",{colSpan:e,children:t})}));fe.displayName="TableEmpty";var St=u(require("react"),1),Pt=require("../utils/part.cjs"),yt=require("../utils/primitive.cjs");var wt=require("react/jsx-runtime"),be=St.forwardRef(({sortKey:e,...t},n)=>{let o=p("TableSortIndicator"),l=D("TableSortIndicator"),r=e??l.sortKey,d=r===void 0?-1:o.sortList.findIndex(b=>b.columnKey===r),m=o.sortList[d]?.direction??"none";return(0,wt.jsx)(yt.Primitive.span,{"aria-hidden":"true","data-skdx-table-sort-indicator":"","data-sort-direction":m,"data-sort-index":o.multiSort&&d!==-1?d:void 0,...t,...(0,Pt.skdxPart)("table","sort-indicator",t.className),ref:n})});be.displayName="TableSortIndicator";var ht=u(require("react"),1),kt=require("../checkbox/Checkbox.cjs"),Et=require("../utils/part.cjs"),Ht=require("../utils/primitive.cjs");var Lt=require("react/jsx-runtime");function ue(e,t){let n=`${t} ${t===1?"row":"rows"}`;return e==="page"?`Select all ${n} on this page`:`Select all ${n}`}var Te=ht.forwardRef(({rowIds:e,scope:t,getSelectAllLabel:n=ue,...o},l)=>{let r=p("TableSelectAllCheckbox"),d=r.isAllSelected(e)?!0:r.isSomeSelected(e)?"indeterminate":!1;return(0,Lt.jsx)(kt.Checkbox,{"aria-label":n(t,e.length),...o,...(0,Et.skdxPart)("table","select-all-checkbox",o.className),ref:l,checked:d,"data-skdx-table-select-all":"","data-scope":t,onClick:(0,Ht.composeEventHandlers)(o.onClick,()=>r.toggleAll(e))})});Te.displayName="TableSelectAllCheckbox";var Nt=u(require("react"),1),Mt=require("../checkbox/Checkbox.cjs"),At=require("../utils/part.cjs"),Wt=require("../utils/primitive.cjs");var Dt=require("react/jsx-runtime"),ge=Nt.forwardRef(({rowId:e,...t},n)=>{let o=p("TableRowSelectCheckbox");return(0,Dt.jsx)(Mt.Checkbox,{...t,...(0,At.skdxPart)("table","row-select-checkbox",t.className),ref:n,checked:o.isRowSelected(e),"data-skdx-table-row-select":"",onClick:(0,Wt.composeEventHandlers)(t.onClick,l=>{o.toggleRow(e,l.shiftKey)})})});ge.displayName="TableRowSelectCheckbox";0&&(module.exports={Table,TableBody,TableCaption,TableCell,TableColumnHeaderSortTrigger,TableColumnResizeTrigger,TableEmpty,TableExpandTrigger,TableExpandedRow,TableFooter,TableHeader,TableHeaderCell,TableHeaderCellProvider,TableProvider,TableRow,TableRowSelectCheckbox,TableSelectAllCheckbox,TableSortIndicator,defaultGetSortLabel,defaultSelectAllLabel,tableDetailRowId,useTableContext,useTableHeaderCellContext});

package/dist/table/Table.d.cts

@@ -0,0 +1,78 @@
+import * as React from 'react';
+import type { SortDirection, TableContextValue, TableHeaderCellContextValue, TableProps } from './types.cjs';
+/** Default `getSortLabel`: `"Amount sorted ascending"` / `"Amount not sorted"`. */
+export declare function defaultGetSortLabel(column: string, direction: SortDirection | null): string;
+/**
+ * Reads the sort, selection, expansion and column-width state a {@link Table}
+ * publishes to everything inside it, along with the methods that drive them —
+ * `toggleSort`, `toggleRow`, `toggleAll`, `toggleRowExpanded`, `setColumnWidth`.
+ *
+ * Public on purpose: the shared component contract names it as React's access
+ * path to `toggleAll`, which a consumer has to reach because Table keeps no row
+ * registry and so takes the id list from the caller — under pagination or
+ * virtualization that must be the full dataset, not the rendered page.
+ *
+ * Pass the calling component's own name. It is what the thrown error names when
+ * the hook runs outside a `Table` — it throws there rather than handing back
+ * `undefined` for a field access to fail on later.
+ */
+export declare const TableProvider: {
+    (props: TableContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useTableContext: (consumerName: string) => TableContextValue;
+/**
+ * Column-scoped defaults published by a `TableHeaderCell` to the sort and
+ * resize parts nested inside it. Defaulted to an empty object rather than
+ * throwing, because those parts are also legal outside a header cell — they
+ * just need their own `sortKey`/`columnKey` there.
+ */
+export declare const TableHeaderCellProvider: {
+    (props: TableHeaderCellContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useTableHeaderCellContext: (consumerName: string) => TableHeaderCellContextValue;
+/**
+ * The DOM id a row's detail row carries and its `TableExpandTrigger` points at
+ * with `aria-controls`. Derived from the table's own id so two tables on one
+ * page can share row ids without colliding.
+ */
+export declare function tableDetailRowId(tableId: string, rowId: string): string;
+/**
+ * Root of a headless data table: owns only sort and row-selection state — no
+ * pagination, filtering, or data model — and hands it down to
+ * `TableHeaderCell` / `TableRow` via context. Renders a plain `<table>`.
+ * Consumers map over their own row data to render `TableRow`/`TableCell`s.
+ *
+ * Sort and selection each work controlled (`sort`/`selected` +
+ * `onSortChange`/`onSelectedChange`) or uncontrolled (`defaultSort`/`defaultSelected`),
+ * as do expanded detail rows (`expandedRowIds`) and column widths (`columnWidths`).
+ *
+ * `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.
+ *
+ * @example
+ * ```tsx
+ * <Table selectionMode="multiple">
+ *   <TableCaption>A list of recent invoices.</TableCaption>
+ *   <TableHeader>
+ *     <TableRow>
+ *       <TableHeaderCell sortKey="name">Name</TableHeaderCell>
+ *       <TableHeaderCell sortKey="amount">Amount</TableHeaderCell>
+ *     </TableRow>
+ *   </TableHeader>
+ *   <TableBody>
+ *     {rows.map((row) => (
+ *       <TableRow key={row.id} rowId={row.id}>
+ *         <TableCell>{row.name}</TableCell>
+ *         <TableCell>{row.amount}</TableCell>
+ *       </TableRow>
+ *     ))}
+ *   </TableBody>
+ * </Table>
+ * ```
+ */
+export declare const Table: React.ForwardRefExoticComponent<Omit<TableProps, "ref"> & React.RefAttributes<HTMLTableElement>>;

package/dist/table/Table.d.ts

@@ -0,0 +1,78 @@
+import * as React from 'react';
+import type { SortDirection, TableContextValue, TableHeaderCellContextValue, TableProps } from './types.js';
+/** Default `getSortLabel`: `"Amount sorted ascending"` / `"Amount not sorted"`. */
+export declare function defaultGetSortLabel(column: string, direction: SortDirection | null): string;
+/**
+ * Reads the sort, selection, expansion and column-width state a {@link Table}
+ * publishes to everything inside it, along with the methods that drive them —
+ * `toggleSort`, `toggleRow`, `toggleAll`, `toggleRowExpanded`, `setColumnWidth`.
+ *
+ * Public on purpose: the shared component contract names it as React's access
+ * path to `toggleAll`, which a consumer has to reach because Table keeps no row
+ * registry and so takes the id list from the caller — under pagination or
+ * virtualization that must be the full dataset, not the rendered page.
+ *
+ * Pass the calling component's own name. It is what the thrown error names when
+ * the hook runs outside a `Table` — it throws there rather than handing back
+ * `undefined` for a field access to fail on later.
+ */
+export declare const TableProvider: {
+    (props: TableContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useTableContext: (consumerName: string) => TableContextValue;
+/**
+ * Column-scoped defaults published by a `TableHeaderCell` to the sort and
+ * resize parts nested inside it. Defaulted to an empty object rather than
+ * throwing, because those parts are also legal outside a header cell — they
+ * just need their own `sortKey`/`columnKey` there.
+ */
+export declare const TableHeaderCellProvider: {
+    (props: TableHeaderCellContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useTableHeaderCellContext: (consumerName: string) => TableHeaderCellContextValue;
+/**
+ * The DOM id a row's detail row carries and its `TableExpandTrigger` points at
+ * with `aria-controls`. Derived from the table's own id so two tables on one
+ * page can share row ids without colliding.
+ */
+export declare function tableDetailRowId(tableId: string, rowId: string): string;
+/**
+ * Root of a headless data table: owns only sort and row-selection state — no
+ * pagination, filtering, or data model — and hands it down to
+ * `TableHeaderCell` / `TableRow` via context. Renders a plain `<table>`.
+ * Consumers map over their own row data to render `TableRow`/`TableCell`s.
+ *
+ * Sort and selection each work controlled (`sort`/`selected` +
+ * `onSortChange`/`onSelectedChange`) or uncontrolled (`defaultSort`/`defaultSelected`),
+ * as do expanded detail rows (`expandedRowIds`) and column widths (`columnWidths`).
+ *
+ * `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.
+ *
+ * @example
+ * ```tsx
+ * <Table selectionMode="multiple">
+ *   <TableCaption>A list of recent invoices.</TableCaption>
+ *   <TableHeader>
+ *     <TableRow>
+ *       <TableHeaderCell sortKey="name">Name</TableHeaderCell>
+ *       <TableHeaderCell sortKey="amount">Amount</TableHeaderCell>
+ *     </TableRow>
+ *   </TableHeader>
+ *   <TableBody>
+ *     {rows.map((row) => (
+ *       <TableRow key={row.id} rowId={row.id}>
+ *         <TableCell>{row.name}</TableCell>
+ *         <TableCell>{row.amount}</TableCell>
+ *       </TableRow>
+ *     ))}
+ *   </TableBody>
+ * </Table>
+ * ```
+ */
+export declare const Table: React.ForwardRefExoticComponent<Omit<TableProps, "ref"> & React.RefAttributes<HTMLTableElement>>;

package/dist/table/Table.js

@@ -0,0 +1 @@
+import*as s from"react";import{useComposedRefs as Xe}from"../utils/composeRefs.js";import{createSafeContext as te}from"../utils/createContext.js";import{announce as Oe}from"../utils/liveAnnouncer.js";import{skdxPart as Ue}from"../utils/part.js";import{Primitive as Ye}from"../utils/primitive.js";import{useControllableState as B}from"../utils/useControllableState.js";import{jsx as ee}from"react/jsx-runtime";function Z(e){return e===void 0?new Set:e instanceof Set?e:new Set(e)}var j=[],O={};function qe(e){return e?Array.isArray(e)?e:[e]:[]}function Ge(e,t,i){let o=e.find(r=>r.columnKey===t),l=o===void 0?"asc":o.direction==="asc"?"desc":null;return i?l===null?e.filter(r=>r.columnKey!==t):o===void 0?[...e,{columnKey:t,direction:l}]:e.map(r=>r.columnKey===t?{columnKey:t,direction:l}:r):l===null?[]:[{columnKey:t,direction:l}]}function Je(e,t){return t===null?`${e} not sorted`:`${e} sorted ${t==="asc"?"ascending":"descending"}`}var[Qe,f]=te("Table"),[oe,z]=te("TableHeaderCell",{});function F(e,t){return`${e}-detail-${t}`}var Ze=s.forwardRef(({sort:e,defaultSort:t=null,onSortChange:i,multiSort:o=!1,selected:l,defaultSelected:r,onSelectedChange:d,selectionMode:m="none",getSortLabel:b=Je,expandedRowIds:H,defaultExpandedRowIds:L=j,onExpandedRowIdsChange:A,columnWidths:C,defaultColumnWidths:y,onColumnWidthsChange:W,...u},g)=>{let S=s.useId(),N=s.useRef(null),v=Xe(g,N),[w=null,D]=B({prop:e,defaultProp:t,onChange:i}),k=s.useMemo(()=>qe(w),[w]),n=k[0]??null,T=s.useMemo(()=>l===void 0?void 0:Z(l),[l]),[R=new Set,M]=B({prop:T,defaultProp:Z(r??[]),onChange:a=>d?.([...a])}),We=s.useCallback((a,c=a)=>{let p=Ge(k,a,o);D(o?p:p[0]??null);let x=p.find(P=>P.columnKey===a)?.direction??null;Oe(b(c,x))},[k,o,D,b]),Y=s.useCallback(()=>{let a=N.current?.querySelectorAll(":scope > tbody > tr[data-row-id]");return a?[...a].map(c=>c.dataset.rowId):[]},[]),q=s.useRef(null),De=s.useCallback((a,c=!1)=>{if(m==="none")return;let p=q.current;if(c&&m==="multiple"&&p!==null&&p!==a){let x=Y(),P=x.indexOf(p),X=x.indexOf(a);if(P!==-1&&X!==-1){let $e=x.slice(Math.min(P,X),Math.max(P,X)+1);M((Ve=new Set)=>new Set([...Ve,...$e]));return}}q.current=a,M((x=new Set)=>{if(m==="single")return x.has(a)&&x.size===1?new Set:new Set([a]);let P=new Set(x);return P.has(a)?P.delete(a):P.add(a),P})},[m,M,Y]),[G=j,J]=B({prop:H,defaultProp:L,onChange:A}),$=s.useMemo(()=>new Set(G),[G]),[ze=O,Q]=B({prop:C,defaultProp:y??O,onChange:W}),ve=s.useCallback(a=>{J((c=[])=>c.includes(a)?c.filter(p=>p!==a):[...c,a])},[J]),Ie=s.useCallback(a=>$.has(a),[$]),Ke=s.useCallback((a,c)=>{Q((p=O)=>p[a]===c?p:{...p,[a]:c})},[Q]),Be=s.useCallback(a=>R.has(a),[R]),V=s.useCallback(a=>a.length>0&&a.every(c=>R.has(c)),[R]),Fe=s.useCallback(a=>a.some(c=>R.has(c))&&!V(a),[R,V]),_e=s.useCallback(a=>{m!=="none"&&M((c=new Set)=>{if(a.length>0&&a.every(p=>c.has(p))){let p=new Set(c);return a.forEach(x=>p.delete(x)),p}return new Set([...c,...a])})},[m,M]);return ee(Qe,{tableId:S,sort:n,sortList:k,multiSort:o,selected:R,selectionMode:m,toggleSort:We,toggleRow:De,isRowSelected:Be,toggleAll:_e,isAllSelected:V,isSomeSelected:Fe,expandedRows:$,toggleRowExpanded:ve,isRowExpanded:Ie,columnWidths:ze,setColumnWidth:Ke,children:ee(Ye.table,{...u,...Ue("table","root",u.className),ref:v})})});Ze.displayName="Table";import*as re from"react";import{skdxPart as je}from"../utils/part.js";import{Primitive as et}from"../utils/primitive.js";import{jsx as tt}from"react/jsx-runtime";var ae=re.forwardRef((e,t)=>tt(et.thead,{...e,...je("table","header",e.className),ref:t}));ae.displayName="TableHeader";import*as ne from"react";import{skdxPart as ot}from"../utils/part.js";import{Primitive as rt}from"../utils/primitive.js";import{jsx as at}from"react/jsx-runtime";var le=ne.forwardRef((e,t)=>at(rt.tbody,{...e,...ot("table","body",e.className),ref:t}));le.displayName="TableBody";import*as ie from"react";import{skdxPart as nt}from"../utils/part.js";import{Primitive as lt}from"../utils/primitive.js";import{jsx as it}from"react/jsx-runtime";var se=ie.forwardRef((e,t)=>it(lt.tfoot,{...e,...nt("table","footer",e.className),ref:t}));se.displayName="TableFooter";import*as de from"react";import{skdxPart as st}from"../utils/part.js";import{composeEventHandlers as dt,Primitive as ct}from"../utils/primitive.js";import{jsx as pt}from"react/jsx-runtime";var mt='button, a, input, [role="button"]',ce=de.forwardRef(({rowId:e,...t},i)=>{let o=f("TableRow"),l=e!==void 0&&o.isRowSelected(e),r=o.selectionMode!=="none"&&e!==void 0;return pt(ct.tr,{"aria-selected":r?l:void 0,"data-state":l?"selected":void 0,"data-row-id":r?e:void 0,...t,...st("table","row",t.className),ref:i,onClick:dt(t.onClick,d=>{!r||d.target.closest(mt)||o.toggleRow(e,d.shiftKey)})})});ce.displayName="TableRow";import*as E from"react";import{skdxPart as Ht}from"../utils/part.js";import{Primitive as Lt}from"../utils/primitive.js";import*as me from"react";import{skdxPart as ft}from"../utils/part.js";import{composeEventHandlers as bt,Primitive as ut}from"../utils/primitive.js";import{jsx as Tt}from"react/jsx-runtime";var I=me.forwardRef(({sortKey:e,...t},i)=>{let o=f("TableColumnHeaderSortTrigger"),l=z("TableColumnHeaderSortTrigger"),r=e??l.sortKey;if(r===void 0)return null;let d=o.sortList.findIndex(b=>b.columnKey===r),m=o.sortList[d]?.direction;return Tt(ut.button,{type:"button","data-skdx-table-sort-trigger":"","data-sort-direction":m,"data-sort-index":o.multiSort&&d!==-1?d:void 0,...t,...ft("table","column-header-sort-trigger",t.className),ref:i,onClick:bt(t.onClick,b=>{o.toggleSort(r,b.currentTarget.textContent?.trim()||r)})})});I.displayName="TableColumnHeaderSortTrigger";import*as h from"react";import{clamp as gt}from"../utils/clamp.js";import{useComposedRefs as Rt}from"../utils/composeRefs.js";import{directionalKey as xt,resolveDirection as Ct,useDirection as St}from"../utils/direction.js";import{skdxPart as Pt}from"../utils/part.js";import{composeEventHandlers as K,Primitive as yt}from"../utils/primitive.js";import{jsx as Et}from"react/jsx-runtime";var wt=40,ht=1e3,kt=8,_=h.forwardRef(({columnKey:e,minWidth:t,maxWidth:i,step:o,label:l,...r},d)=>{let m=f("TableColumnResizeTrigger"),b=z("TableColumnResizeTrigger"),H=St(),L=h.useRef(null),A=Rt(d,L),C=h.useRef(null),[y,W]=h.useState(!1),u=e??b.columnKey,g=t??b.minWidth??wt,S=i??b.maxWidth??ht,N=o??b.resizeStep??kt,v=u===void 0?void 0:m.columnWidths[u],w=n=>{u!==void 0&&m.setColumnWidth(u,gt(Math.round(n),g,S))},D=()=>v!==void 0?v:(L.current?.closest("th")?.getBoundingClientRect().width??0)||g,k=()=>{let n=C.current;if(!n)return null;C.current=null,W(!1);let T=L.current;return T?.hasPointerCapture?.(n.pointerId)&&T.releasePointerCapture(n.pointerId),n};return h.useEffect(()=>{if(!y)return;let n=T=>{if(T.key!=="Escape")return;let R=k();R&&w(R.startWidth)};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[y,u,g,S]),u===void 0?null:Et(yt.span,{role:"separator","aria-orientation":"vertical","aria-label":l??b.resizeLabel??"Resize column","aria-valuenow":Math.round(v??g),"aria-valuemin":g,"aria-valuemax":S,tabIndex:0,"data-skdx-table-resizer":"","data-dragging":y?"":void 0,...r,...Pt("table","column-resize-trigger",r.className),ref:A,onPointerDown:K(r.onPointerDown,n=>{n.button===0&&(n.preventDefault(),n.stopPropagation(),C.current={startX:n.clientX,startWidth:D(),pointerId:n.pointerId},W(!0),n.currentTarget.setPointerCapture?.(n.pointerId))}),onPointerMove:K(r.onPointerMove,n=>{let T=C.current;if(!T)return;let M=Ct(n.currentTarget,H)==="rtl"?T.startX-n.clientX:n.clientX-T.startX;w(T.startWidth+M)}),onPointerUp:K(r.onPointerUp,k),onPointerCancel:K(r.onPointerCancel,k),onKeyDown:K(r.onKeyDown,n=>{let T=xt(n.key,n.currentTarget,H);if(T==="ArrowRight")w(D()+N);else if(T==="ArrowLeft")w(D()-N);else if(n.key==="Home")w(g);else if(n.key==="End")w(S);else return;n.preventDefault(),n.stopPropagation()})})});_.displayName="TableColumnResizeTrigger";import{jsx as U,jsxs as Nt}from"react/jsx-runtime";function pe(e){return E.Children.toArray(e).some(t=>E.isValidElement(t)?t.type===I?!0:t.type===E.Fragment&&pe(t.props.children):!1)}var fe=E.forwardRef(({sortKey:e,columnKey:t,resizable:i=!1,minWidth:o=40,maxWidth:l=1e3,resizeLabel:r="Resize column",resizeStep:d=8,children:m,style:b,...H},L)=>{let A=f("TableHeaderCell"),C=e!==void 0,y=C?A.sortList.find(N=>N.columnKey===e)?.direction:void 0,W=C?y==="asc"?"ascending":y==="desc"?"descending":"none":void 0,u=t??e,g=i&&u!==void 0,S=u===void 0?void 0:A.columnWidths[u];return U(oe,{sortKey:e,columnKey:u,minWidth:o,maxWidth:l,resizeLabel:r,resizeStep:d,children:Nt(Lt.th,{"aria-sort":W,"data-sort-direction":y,"data-resizable":g?"":void 0,style:S===void 0?b:{...b,width:S,"--skdx-table-column-width":`${S}px`},...H,...Ht("table","header-cell",H.className),ref:L,children:[C&&!pe(m)?U(I,{children:m}):m,g?U(_,{}):null]})})});fe.displayName="TableHeaderCell";import*as be from"react";import{skdxPart as Mt}from"../utils/part.js";import{Primitive as At}from"../utils/primitive.js";import{jsx as Wt}from"react/jsx-runtime";var ue=be.forwardRef((e,t)=>Wt(At.td,{...e,...Mt("table","cell",e.className),ref:t}));ue.displayName="TableCell";import*as Te from"react";import{skdxPart as Dt}from"../utils/part.js";import{Primitive as zt}from"../utils/primitive.js";import{jsx as vt}from"react/jsx-runtime";var ge=Te.forwardRef((e,t)=>vt(zt.caption,{...e,...Dt("table","caption",e.className),ref:t}));ge.displayName="TableCaption";import*as Re from"react";import{skdxPart as It}from"../utils/part.js";import{composeEventHandlers as Kt,Primitive as Bt}from"../utils/primitive.js";import{jsx as Ft}from"react/jsx-runtime";var xe=Re.forwardRef(({rowId:e,...t},i)=>{let o=f("TableExpandTrigger"),l=o.isRowExpanded(e);return Ft(Bt.button,{type:"button","aria-expanded":l,"aria-controls":F(o.tableId,e),"data-state":l?"expanded":"collapsed","data-skdx-table-expand-trigger":"",...t,...It("table","expand-trigger",t.className),ref:i,onClick:Kt(t.onClick,r=>{r.stopPropagation(),o.toggleRowExpanded(e)})})});xe.displayName="TableExpandTrigger";import*as Se from"react";import{skdxPart as _t}from"../utils/part.js";import{Primitive as $t}from"../utils/primitive.js";import{jsx as Ce}from"react/jsx-runtime";var Pe=Se.forwardRef(({rowId:e,colSpan:t=1,children:i,...o},l)=>{let r=f("TableExpandedRow"),d=r.isRowExpanded(e);return Ce($t.tr,{id:F(r.tableId,e),"data-state":d?"expanded":"collapsed","data-skdx-table-detail-row":"",hidden:!d,...o,..._t("table","expanded-row",o.className),ref:l,children:Ce("td",{colSpan:t,children:i})})});Pe.displayName="TableExpandedRow";import*as we from"react";import{skdxPart as Vt}from"../utils/part.js";import{Primitive as Xt}from"../utils/primitive.js";import{jsx as ye}from"react/jsx-runtime";var he=we.forwardRef(({colSpan:e=1,children:t,...i},o)=>ye(Xt.tr,{"data-state":"empty","data-skdx-table-empty":"",...i,...Vt("table","empty",i.className),ref:o,children:ye("td",{colSpan:e,children:t})}));he.displayName="TableEmpty";import*as ke from"react";import{skdxPart as Ot}from"../utils/part.js";import{Primitive as Ut}from"../utils/primitive.js";import{jsx as Yt}from"react/jsx-runtime";var Ee=ke.forwardRef(({sortKey:e,...t},i)=>{let o=f("TableSortIndicator"),l=z("TableSortIndicator"),r=e??l.sortKey,d=r===void 0?-1:o.sortList.findIndex(b=>b.columnKey===r),m=o.sortList[d]?.direction??"none";return Yt(Ut.span,{"aria-hidden":"true","data-skdx-table-sort-indicator":"","data-sort-direction":m,"data-sort-index":o.multiSort&&d!==-1?d:void 0,...t,...Ot("table","sort-indicator",t.className),ref:i})});Ee.displayName="TableSortIndicator";import*as He from"react";import{Checkbox as qt}from"../checkbox/Checkbox.js";import{skdxPart as Gt}from"../utils/part.js";import{composeEventHandlers as Jt}from"../utils/primitive.js";import{jsx as Qt}from"react/jsx-runtime";function Le(e,t){let i=`${t} ${t===1?"row":"rows"}`;return e==="page"?`Select all ${i} on this page`:`Select all ${i}`}var Ne=He.forwardRef(({rowIds:e,scope:t,getSelectAllLabel:i=Le,...o},l)=>{let r=f("TableSelectAllCheckbox"),d=r.isAllSelected(e)?!0:r.isSomeSelected(e)?"indeterminate":!1;return Qt(qt,{"aria-label":i(t,e.length),...o,...Gt("table","select-all-checkbox",o.className),ref:l,checked:d,"data-skdx-table-select-all":"","data-scope":t,onClick:Jt(o.onClick,()=>r.toggleAll(e))})});Ne.displayName="TableSelectAllCheckbox";import*as Me from"react";import{Checkbox as Zt}from"../checkbox/Checkbox.js";import{skdxPart as jt}from"../utils/part.js";import{composeEventHandlers as eo}from"../utils/primitive.js";import{jsx as to}from"react/jsx-runtime";var Ae=Me.forwardRef(({rowId:e,...t},i)=>{let o=f("TableRowSelectCheckbox");return to(Zt,{...t,...jt("table","row-select-checkbox",t.className),ref:i,checked:o.isRowSelected(e),"data-skdx-table-row-select":"",onClick:eo(t.onClick,l=>{o.toggleRow(e,l.shiftKey)})})});Ae.displayName="TableRowSelectCheckbox";export{Ze as Table,le as TableBody,ge as TableCaption,ue as TableCell,I as TableColumnHeaderSortTrigger,_ as TableColumnResizeTrigger,he as TableEmpty,xe as TableExpandTrigger,Pe as TableExpandedRow,se as TableFooter,ae as TableHeader,fe as TableHeaderCell,oe as TableHeaderCellProvider,Qe as TableProvider,ce as TableRow,Ae as TableRowSelectCheckbox,Ne as TableSelectAllCheckbox,Ee as TableSortIndicator,Je as defaultGetSortLabel,Le as defaultSelectAllLabel,F as tableDetailRowId,f as useTableContext,z as useTableHeaderCellContext};

package/dist/table/TableBody.d.cts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { TableBodyProps } from './types.cjs';
+/**
+ * `<tbody>` section, holding the data `TableRow`s.
+ *
+ * @example
+ * ```tsx
+ * <TableBody>
+ *   <TableRow rowId="1">
+ *     <TableCell>Row 1</TableCell>
+ *   </TableRow>
+ * </TableBody>
+ * ```
+ */
+export declare const TableBody: React.ForwardRefExoticComponent<Omit<TableBodyProps, "ref"> & React.RefAttributes<HTMLTableSectionElement>>;

package/dist/table/TableBody.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { TableBodyProps } from './types.js';
+/**
+ * `<tbody>` section, holding the data `TableRow`s.
+ *
+ * @example
+ * ```tsx
+ * <TableBody>
+ *   <TableRow rowId="1">
+ *     <TableCell>Row 1</TableCell>
+ *   </TableRow>
+ * </TableBody>
+ * ```
+ */
+export declare const TableBody: React.ForwardRefExoticComponent<Omit<TableBodyProps, "ref"> & React.RefAttributes<HTMLTableSectionElement>>;

package/dist/table/TableCaption.d.cts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import type { TableCaptionProps } from './types.cjs';
+/**
+ * The table's `<caption>`, describing its contents for sighted and screen-reader users alike.
+ *
+ * @example
+ * ```tsx
+ * <TableCaption>A list of recent invoices.</TableCaption>
+ * ```
+ */
+export declare const TableCaption: React.ForwardRefExoticComponent<Omit<TableCaptionProps, "ref"> & React.RefAttributes<HTMLTableCaptionElement>>;

package/dist/table/TableCaption.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import type { TableCaptionProps } from './types.js';
+/**
+ * The table's `<caption>`, describing its contents for sighted and screen-reader users alike.
+ *
+ * @example
+ * ```tsx
+ * <TableCaption>A list of recent invoices.</TableCaption>
+ * ```
+ */
+export declare const TableCaption: React.ForwardRefExoticComponent<Omit<TableCaptionProps, "ref"> & React.RefAttributes<HTMLTableCaptionElement>>;

package/dist/table/TableCell.d.cts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import type { TableCellProps } from './types.cjs';
+/**
+ * A `<td>` data cell holding one row's value for a single column. Place one
+ * per column inside a `TableRow`, in the same order as the header cells.
+ *
+ * @example
+ * ```tsx
+ * <TableCell>{row.amount}</TableCell>
+ * ```
+ */
+export declare const TableCell: React.ForwardRefExoticComponent<Omit<TableCellProps, "ref"> & React.RefAttributes<HTMLTableCellElement>>;

package/dist/table/TableCell.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import type { TableCellProps } from './types.js';
+/**
+ * A `<td>` data cell holding one row's value for a single column. Place one
+ * per column inside a `TableRow`, in the same order as the header cells.
+ *
+ * @example
+ * ```tsx
+ * <TableCell>{row.amount}</TableCell>
+ * ```
+ */
+export declare const TableCell: React.ForwardRefExoticComponent<Omit<TableCellProps, "ref"> & React.RefAttributes<HTMLTableCellElement>>;

package/dist/table/TableColumnHeaderSortTrigger.d.cts

@@ -0,0 +1,29 @@
+import * as React from 'react';
+import type { TableColumnHeaderSortTriggerProps } from './types.cjs';
+/**
+ * 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.
+ *
+ * A `TableHeaderCell` with a `sortKey` renders one of these around its children
+ * 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 a
+ * `TableColumnHeaderSortTrigger` among its 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.
+ *
+ * @example
+ * ```tsx
+ * <TableHeaderCell sortKey="amount">
+ *   <TableColumnHeaderSortTrigger>
+ *     Amount
+ *     <TableSortIndicator>↑</TableSortIndicator>
+ *   </TableColumnHeaderSortTrigger>
+ * </TableHeaderCell>
+ * ```
+ */
+export declare const TableColumnHeaderSortTrigger: React.ForwardRefExoticComponent<Omit<TableColumnHeaderSortTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/table/TableColumnHeaderSortTrigger.d.ts

@@ -0,0 +1,29 @@
+import * as React from 'react';
+import type { TableColumnHeaderSortTriggerProps } from './types.js';
+/**
+ * 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.
+ *
+ * A `TableHeaderCell` with a `sortKey` renders one of these around its children
+ * 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 a
+ * `TableColumnHeaderSortTrigger` among its 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.
+ *
+ * @example
+ * ```tsx
+ * <TableHeaderCell sortKey="amount">
+ *   <TableColumnHeaderSortTrigger>
+ *     Amount
+ *     <TableSortIndicator>↑</TableSortIndicator>
+ *   </TableColumnHeaderSortTrigger>
+ * </TableHeaderCell>
+ * ```
+ */
+export declare const TableColumnHeaderSortTrigger: React.ForwardRefExoticComponent<Omit<TableColumnHeaderSortTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/table/TableColumnResizeTrigger.d.cts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import type { TableColumnResizeTriggerProps } from './types.cjs';
+/**
+ * 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.
+ *
+ * `TableHeaderCell`'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.
+ *
+ * @example
+ * ```tsx
+ * <TableHeaderCell columnKey="name" minWidth={120}>
+ *   Name
+ *   <TableColumnResizeTrigger label="Resize Name column" step={16} />
+ * </TableHeaderCell>
+ * ```
+ */
+export declare const TableColumnResizeTrigger: React.ForwardRefExoticComponent<Omit<TableColumnResizeTriggerProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/table/TableColumnResizeTrigger.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import type { TableColumnResizeTriggerProps } from './types.js';
+/**
+ * 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.
+ *
+ * `TableHeaderCell`'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.
+ *
+ * @example
+ * ```tsx
+ * <TableHeaderCell columnKey="name" minWidth={120}>
+ *   Name
+ *   <TableColumnResizeTrigger label="Resize Name column" step={16} />
+ * </TableHeaderCell>
+ * ```
+ */
+export declare const TableColumnResizeTrigger: React.ForwardRefExoticComponent<Omit<TableColumnResizeTriggerProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/table/TableEmpty.d.cts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import type { TableEmptyProps } from './types.cjs';
+/**
+ * The row rendered in place of body rows when there is no data: a `<tr>` with
+ * `data-state="empty"` whose single `<td colspan>` holds the empty-state
+ * message. Render it inside `TableBody` when your row array is empty — the
+ * table has no data model of its own, so only you know when that is.
+ *
+ * @example
+ * ```tsx
+ * <TableBody>
+ *   {rows.length === 0 ? (
+ *     <TableEmpty colSpan={3}>No invoices yet.</TableEmpty>
+ *   ) : (
+ *     rows.map((row) => <TableRow key={row.id}>…</TableRow>)
+ *   )}
+ * </TableBody>
+ * ```
+ */
+export declare const TableEmpty: React.ForwardRefExoticComponent<Omit<TableEmptyProps, "ref"> & React.RefAttributes<HTMLTableRowElement>>;

package/dist/table/TableEmpty.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import type { TableEmptyProps } from './types.js';
+/**
+ * The row rendered in place of body rows when there is no data: a `<tr>` with
+ * `data-state="empty"` whose single `<td colspan>` holds the empty-state
+ * message. Render it inside `TableBody` when your row array is empty — the
+ * table has no data model of its own, so only you know when that is.
+ *
+ * @example
+ * ```tsx
+ * <TableBody>
+ *   {rows.length === 0 ? (
+ *     <TableEmpty colSpan={3}>No invoices yet.</TableEmpty>
+ *   ) : (
+ *     rows.map((row) => <TableRow key={row.id}>…</TableRow>)
+ *   )}
+ * </TableBody>
+ * ```
+ */
+export declare const TableEmpty: React.ForwardRefExoticComponent<Omit<TableEmptyProps, "ref"> & React.RefAttributes<HTMLTableRowElement>>;

package/dist/table/TableExpandTrigger.d.cts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import type { TableExpandTriggerProps } from './types.cjs';
+/**
+ * Disclosure button that opens the `TableExpandedRow` for `rowId`: a
+ * `<button aria-expanded>` with `aria-controls` pointing at that detail row,
+ * plus `data-state` of `"expanded"`/`"collapsed"`. Place it inside a
+ * `TableCell` of the row it belongs to — the trigger *cell* stays a plain
+ * `<td>`, so the button (not the cell) is the thing screen readers announce as
+ * expandable.
+ *
+ * Clicking it stops propagation, so a selectable `TableRow` doesn't also
+ * toggle its selection.
+ *
+ * @example
+ * ```tsx
+ * <TableRow rowId={row.id}>
+ *   <TableCell>
+ *     <TableExpandTrigger rowId={row.id} aria-label={`Details for ${row.name}`} />
+ *   </TableCell>
+ *   <TableCell>{row.name}</TableCell>
+ * </TableRow>
+ * <TableExpandedRow rowId={row.id} colSpan={2}>{row.detail}</TableExpandedRow>
+ * ```
+ */
+export declare const TableExpandTrigger: React.ForwardRefExoticComponent<Omit<TableExpandTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/table/TableExpandTrigger.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import type { TableExpandTriggerProps } from './types.js';
+/**
+ * Disclosure button that opens the `TableExpandedRow` for `rowId`: a
+ * `<button aria-expanded>` with `aria-controls` pointing at that detail row,
+ * plus `data-state` of `"expanded"`/`"collapsed"`. Place it inside a
+ * `TableCell` of the row it belongs to — the trigger *cell* stays a plain
+ * `<td>`, so the button (not the cell) is the thing screen readers announce as
+ * expandable.
+ *
+ * Clicking it stops propagation, so a selectable `TableRow` doesn't also
+ * toggle its selection.
+ *
+ * @example
+ * ```tsx
+ * <TableRow rowId={row.id}>
+ *   <TableCell>
+ *     <TableExpandTrigger rowId={row.id} aria-label={`Details for ${row.name}`} />
+ *   </TableCell>
+ *   <TableCell>{row.name}</TableCell>
+ * </TableRow>
+ * <TableExpandedRow rowId={row.id} colSpan={2}>{row.detail}</TableExpandedRow>
+ * ```
+ */
+export declare const TableExpandTrigger: React.ForwardRefExoticComponent<Omit<TableExpandTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;