useTableColumnResize
@astryxdesign/core v0.7.1 · useTableColumnResize
Parameters
useTableColumnResize() takes one config object. Wrap it in a getter or a ref so the table reads the current widths: useTableColumnResize(() => ({ ... })).
| Name | Type | Default | Description |
|---|---|---|---|
columnWidths | Record<string, number> | {} | Controlled pixel-width overrides keyed by column key. When a key is present it overrides the column's declared width. |
onColumnResizeEnd | (updates: Record<string, number>) => void | — | Called when a resize completes (pointer release or a key press). Receives a map of every column key whose width changed; merge it into your columnWidths state. The last column is left out because its width follows the space that is left. |
minWidth | number | — | Global minimum column width in pixels during a resize. Overrides the per-column floors. |
maxWidth | number | Infinity | Global maximum column width in pixels during a resize. |
columns | readonly TableColumn<T>[] | — | Column definitions, used to derive per-column minimums and to tell proportional columns from pixel ones when picking the neighbour and the last column. Table passes its own columns, so you only need this when you call the helper functions yourself. |
Returns
useTableColumnResize() returns one TablePlugin<T>. Pass it to Table in plugins. The plugin fills three fields of the plugin contract:
| Name | Type | Description |
|---|---|---|
widthFor | (column: TableColumn<T>) => number | undefined | Returns the committed override for one column, or undefined when the column has none. |
resizeFor | (column: TableColumn<T>, columns: readonly TableColumn<T>[]) => TableColumnResizeContribution | null | Describes how one column takes part in a resize: its current width, its minimum and maximum, the neighbour that gives up width, and whether the column gets a handle. |
onColumnResizeEnd | (updates: Record<string, number>) => void | Called by Table with every changed column. It rounds each width to whole pixels and passes the map on to your onColumnResizeEnd. |
Helpers
The same module exports the pieces the plugin is built from, so you can reuse the arithmetic in your own UI.
| Name | Type | Description |
|---|---|---|
columnResizeMinWidth | (width: ColumnWidth | undefined, globalMinWidth?: number) => number | The narrowest a column may get: the global minimum when set, otherwise the column's own floor. |
isProportionalColumnWidth | (width: ColumnWidth | undefined) => boolean | True for a proportional column and for a column with no declared width. |
resizeColumnWidths | (plan: ColumnResizePlan, delta: number) => number[] | Applies a pointer movement in pixels to a set of column snapshots and returns every resulting width. |
columnResizeStep | (isShiftKey: boolean) => number | How far one arrow key press moves a handle: 10px, or 50px with Shift. |
columnResizeDirectionSign | (direction: string) => 1 | -1 | The sign a horizontal movement gets in the current writing direction. RTL returns -1. |