useTableSortable@astryxdesign/core v0.5.2 · useTableSortable

Usage

Call useTableSortable with a config object containing sort state and callback. Pass the returned plugin to Table via the plugins prop.

ts
import {useTableSortable} from '@astryxdesign/core/Table'

Parameters

ParamTypeDescription
sortrequired
Array<{sortKey: TSortKey, direction: 'ascending' | 'descending'}>

Current sort state (TableSortState<TSortKey>). Ordered array of entries; the first is the primary sort, the rest are tiebreakers. An empty array means unsorted. Direction is the full word: 'ascending' / 'descending', not 'asc' / 'desc'.

onSortChangerequired
(sort: Array<{sortKey: TSortKey, direction: 'ascending' | 'descending'}>) => void

Called when the user clicks a header cell to change sort. Receives the next sort state.

allowUnsortedState
boolean (default: false)

Allow cycling back to unsorted. When true: 'ascending', 'descending', unsorted. When false: 'ascending', 'descending', 'ascending'.

isMultiSortEnabled
boolean (default: false)

Enable multi-sort via Shift+click. Regular click still replaces the entire sort state.

Examples

Common configurations, variations, and states.
Table — Sortable Columns
Open in Playground

Table with sortable columns, click headers to sort ascending or descending.

Use with shadcn

Already using the shadcn registry workflow? Install the real Astryx package and a local public re-export. Component implementation source stays in Astryx. How compatibility works.

This install URL expires with the draft preview.
bash
npx shadcn@latest add https://astryx-4p843mspp-fbopensource.vercel.app/r/hooks/use-table-sortable.json
Install the editable showcase composition
bash
npx shadcn@latest add https://astryx-4p843mspp-fbopensource.vercel.app/r/examples/table/sortable-columns.json