@zvndev/yable-react 0.3.0 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -1,7 +1,7 @@
1
- import { Table as Table$1, RowData, Cell, Header, Row, TableOptions, Column, ColumnDef, SortDirection, CellContext, ClipboardOptions, CellFlashInfo } from '@zvndev/yable-core';
1
+ import { Table as Table$1, RowData, Cell, Header, Row, TableOptions, TableState, Updater, Column, ColumnDef, ColumnDefBase, SortDirection, CellContext, ClipboardOptions, CellFlashInfo } from '@zvndev/yable-core';
2
2
  export { AccessorFnColumnDef, AccessorKeyColumnDef, AggregationFn, Cell, CellStatus as CellCommitStatus, CellContext, CellFlashEvent, CellPatch, ClipboardOptions, Column, ColumnDef, ColumnDefBase, ColumnFiltersState, ColumnMeta, ColumnOrderState, ColumnPinningState, ColumnSizingInfoState, ColumnSizingState, CommitError, CommitErrorCells, CommitRecord, CommitResult, CommitsSlice, DisplayColumnDef, EditingState, ExpandedState, FillHandleState, FilterFn, FormulaEngine, FormulaError, FormulaFunction, FormulaState, GroupColumnDef, Header, HeaderContext, HeaderGroup, KeyboardNavigationAction, KeyboardNavigationCell, KeyboardNavigationDirection, KeyboardNavigationState, OnChangeFn, OnCommitFn, PaginationState, PartialLocale, PivotColumn, PivotConfig, PivotEngine, PivotFieldConfig, PivotRow, PivotState, PivotValueConfig, Row, RowData, RowDragEndEvent, RowDragEvent, RowDragState, RowEditCommitEvent, RowEditEvent, RowPinningState, RowReorderEvent, RowSelectionState, SortDirection, SortingFn, SortingState, Table as TableInstance, TableOptions, TableOptionsResolved, TableState, UndoAction, UndoRedoOptions, UndoRedoState, UndoStack, Updater, VisibilityState, YableLocale, aggregationFns, createColumnHelper, createLocale, createUndoRedoIntegration, en, filterFns, formulaFunctions, functionalUpdate, generatePivotColumnDefs, getDefaultLocale, getInitialPivotState, getPivotRowModel, resetLocale, setDefaultLocale, sortingFns } from '@zvndev/yable-core';
3
3
  import * as React$1 from 'react';
4
- import React__default, { HTMLAttributes, TdHTMLAttributes, ThHTMLAttributes } from 'react';
4
+ import React__default, { HTMLAttributes, TdHTMLAttributes, ThHTMLAttributes, ReactNode } from 'react';
5
5
  import * as react_jsx_runtime from 'react/jsx-runtime';
6
6
  import { RowDragState } from '@zvndev/yable-core/features/rowDragging';
7
7
 
@@ -99,6 +99,69 @@ interface TableHeaderCellProps<TData extends RowData, TValue = unknown> extends
99
99
  */
100
100
  declare function useTable<TData extends RowData>(options: TableOptions<TData>): Table$1<TData>;
101
101
 
102
+ interface UseTablePersistenceOptions {
103
+ /** Storage key used for getItem/setItem. */
104
+ key: string;
105
+ /** Which TableState slices to persist. Defaults to column layout keys. */
106
+ persistedKeys?: (keyof TableState)[];
107
+ /** Milliseconds to debounce storage writes. Default: 100. */
108
+ debounce?: number;
109
+ /** Schema version — bumping this discards any stale stored data. */
110
+ version?: number;
111
+ /** Custom Storage implementation. Default: localStorage. */
112
+ storage?: Storage;
113
+ }
114
+ interface UseTablePersistenceReturn {
115
+ /**
116
+ * Partial state hydrated from storage — pass to `useTable({ initialState })`.
117
+ * Only useful when NOT passing `onStateChange` (i.e., uncontrolled mode).
118
+ */
119
+ initialState: Partial<TableState>;
120
+ /**
121
+ * State-change handler that persists relevant slices on each update.
122
+ * When passed to `useTable({ onStateChange })`, the persistence hook
123
+ * takes over state management (controlled mode). You MUST also pass
124
+ * `state` to useTable in this case.
125
+ */
126
+ onStateChange: (updater: Updater<TableState>) => void;
127
+ /**
128
+ * Current table state managed by the persistence hook.
129
+ * Pass to `useTable({ state })` alongside `onStateChange`.
130
+ */
131
+ state: Partial<TableState>;
132
+ /** Manually clear all persisted state for this key. */
133
+ clearPersistedState: () => void;
134
+ }
135
+ /**
136
+ * React hook that persists selected table state slices to storage.
137
+ *
138
+ * Returns `initialState` (hydrated from storage), `state`, and
139
+ * `onStateChange` — pass all three to `useTable` so that persisted
140
+ * slices survive page reloads.
141
+ *
142
+ * @example
143
+ * ```tsx
144
+ * const persistence = useTablePersistence({ key: 'my-table', version: 1 })
145
+ *
146
+ * // Controlled mode (recommended) — persistence manages state:
147
+ * const table = useTable({
148
+ * data,
149
+ * columns,
150
+ * initialState: persistence.initialState,
151
+ * state: persistence.state,
152
+ * onStateChange: persistence.onStateChange,
153
+ * })
154
+ *
155
+ * // Uncontrolled mode — only hydrate, no live persistence:
156
+ * const table = useTable({
157
+ * data,
158
+ * columns,
159
+ * initialState: persistence.initialState,
160
+ * })
161
+ * ```
162
+ */
163
+ declare function useTablePersistence(options: UseTablePersistenceOptions): UseTablePersistenceReturn;
164
+
102
165
  interface VirtualRow {
103
166
  index: number;
104
167
  start: number;
@@ -114,6 +177,12 @@ interface UseVirtualizationOptions {
114
177
  pretextHeights?: Float64Array | null;
115
178
  /** Pre-computed prefix sums for O(log n) scroll lookups */
116
179
  pretextPrefixSums?: Float64Array | null;
180
+ /**
181
+ * Opaque key that changes when column widths change.
182
+ * When this value changes the height cache is invalidated because column
183
+ * resizing can affect text wrapping and therefore row heights.
184
+ */
185
+ columnSizingHash?: string | number;
117
186
  }
118
187
  interface UseVirtualizationResult {
119
188
  virtualRows: VirtualRow[];
@@ -121,19 +190,26 @@ interface UseVirtualizationResult {
121
190
  startIndex: number;
122
191
  endIndex: number;
123
192
  scrollTo: (index: number) => void;
193
+ /**
194
+ * Manually clear the row-height cache and force recalculation.
195
+ * Call this when cell content changes (data mutations, font-size changes, etc.)
196
+ * that may affect row heights.
197
+ */
198
+ invalidateRowHeights: () => void;
124
199
  }
125
200
  /**
126
201
  * Computes which rows are visible in a scrollable container and returns
127
202
  * positioning data so only those rows (plus an overscan buffer) are rendered.
128
203
  *
129
- * Returns `{ virtualRows, totalHeight, startIndex, endIndex, scrollTo }`.
204
+ * Returns `{ virtualRows, totalHeight, startIndex, endIndex, scrollTo, invalidateRowHeights }`.
130
205
  * Re-renders are triggered by scroll (rAF-throttled) and ResizeObserver
131
206
  * container resize. Supports fixed, variable, and Pretext-pre-measured heights.
132
207
  *
133
- * Gotcha: variable-height mode caches measured heights per index — pass new
134
- * `pretextHeights` arrays (or change `totalRows`) to invalidate the cache.
208
+ * The height cache is automatically invalidated when `totalRows`, `isFixedHeight`,
209
+ * or `columnSizingHash` changes. For manual invalidation (e.g. after data mutations
210
+ * or font-size changes), call `invalidateRowHeights()`.
135
211
  */
136
- declare function useVirtualization({ containerRef, totalRows, rowHeight, overscan, estimateRowHeight: _estimateRowHeight, pretextHeights, pretextPrefixSums, }: UseVirtualizationOptions): UseVirtualizationResult;
212
+ declare function useVirtualization({ containerRef, totalRows, rowHeight, overscan, estimateRowHeight: _estimateRowHeight, pretextHeights, pretextPrefixSums, columnSizingHash, }: UseVirtualizationOptions): UseVirtualizationResult;
137
213
 
138
214
  interface VirtualColumn<TData extends RowData> {
139
215
  column: Column<TData, unknown>;
@@ -393,7 +469,55 @@ declare function getRegisteredCellTypes(): readonly string[];
393
469
  declare const TableProvider: React$1.Provider<Table$1<any> | null>;
394
470
  declare function useTableContext<TData extends RowData>(): Table$1<TData>;
395
471
 
396
- declare function Table<TData extends RowData>({ table, stickyHeader, striped, bordered, compact, theme, clickableRows, footer, loading, loadingComponent, loadingText, emptyMessage, emptyComponent, emptyIcon, emptyDetail, renderEmpty, renderLoading, children, className, direction, statusBar, statusBarPanels, sidebar, sidebarPanels, defaultSidebarPanel, floatingFilters, columnVirtualization, columnVirtualizationOverscan, ariaLabel, ...rest }: TableProps<TData>): react_jsx_runtime.JSX.Element;
472
+ /**
473
+ * Project-wide default table and column options.
474
+ *
475
+ * Wrap your app (or a subtree) in `<YableProvider>` so every `<Table>` and
476
+ * `useTable` call inherits these defaults without repeating config.
477
+ *
478
+ * Component-level and hook-level values always take precedence over provider
479
+ * defaults.
480
+ */
481
+ interface YableDefaults {
482
+ /** Default props applied to every `<Table>` in the subtree */
483
+ tableProps?: Partial<Pick<TableProps<any>, 'striped' | 'bordered' | 'compact' | 'stickyHeader' | 'theme' | 'direction' | 'ariaLabel'>>;
484
+ /** Default column definition merged under every table's own `defaultColumnDef` */
485
+ defaultColumnDef?: Partial<ColumnDefBase<any, unknown>>;
486
+ }
487
+ /**
488
+ * Read the nearest `YableProvider` defaults.
489
+ *
490
+ * Safe to call outside a provider — returns an empty object.
491
+ */
492
+ declare function useYableDefaults(): YableDefaults;
493
+ /**
494
+ * Provide project-wide defaults for all Yable tables in a subtree.
495
+ *
496
+ * @example
497
+ * ```tsx
498
+ * <YableProvider
499
+ * striped
500
+ * stickyHeader
501
+ * theme="stripe"
502
+ * defaultColumnDef={{ enableSorting: true }}
503
+ * >
504
+ * <EmployeeTable />
505
+ * <ProjectTable />
506
+ * </YableProvider>
507
+ * ```
508
+ */
509
+ declare function YableProvider({ children, defaultColumnDef, striped, stickyHeader, bordered, compact, theme, direction, ariaLabel, }: YableDefaults & {
510
+ children: ReactNode;
511
+ striped?: boolean;
512
+ stickyHeader?: boolean;
513
+ bordered?: boolean;
514
+ compact?: boolean;
515
+ theme?: string;
516
+ direction?: 'ltr' | 'rtl';
517
+ ariaLabel?: string;
518
+ }): react_jsx_runtime.JSX.Element;
519
+
520
+ declare function Table<TData extends RowData>({ table, stickyHeader: stickyHeaderProp, striped: stripedProp, bordered: borderedProp, compact: compactProp, theme: themeProp, clickableRows, footer, loading, loadingComponent, loadingText, emptyMessage, emptyComponent, emptyIcon, emptyDetail, renderEmpty, renderLoading, children, className, direction: directionProp, statusBar, statusBarPanels, sidebar, sidebarPanels, defaultSidebarPanel, floatingFilters, columnVirtualization, columnVirtualizationOverscan, ariaLabel: ariaLabelProp, ...rest }: TableProps<TData>): react_jsx_runtime.JSX.Element;
397
521
 
398
522
  interface TableHeaderProps<TData extends RowData> {
399
523
  table: Table$1<TData>;
@@ -404,8 +528,9 @@ declare function TableHeader<TData extends RowData>({ table, floatingFilters, }:
404
528
  interface TableBodyProps<TData extends RowData> {
405
529
  table: Table$1<TData>;
406
530
  clickableRows?: boolean;
531
+ colgroup?: React__default.ReactNode;
407
532
  }
408
- declare function TableBody<TData extends RowData>({ table, clickableRows }: TableBodyProps<TData>): react_jsx_runtime.JSX.Element;
533
+ declare function TableBody<TData extends RowData>({ table, clickableRows, colgroup, }: TableBodyProps<TData>): react_jsx_runtime.JSX.Element;
409
534
 
410
535
  interface TableCellProps<TData extends RowData> {
411
536
  cell: Cell<TData, unknown>;
@@ -1015,11 +1140,89 @@ interface UseThemeOptions {
1015
1140
  declare function useTheme(options?: UseThemeOptions): {
1016
1141
  theme: string;
1017
1142
  setTheme: (newTheme: string) => void;
1018
- colorScheme: "auto" | "light" | "dark";
1143
+ colorScheme: "auto" | "dark" | "light";
1019
1144
  setColorScheme: (scheme: "light" | "dark" | "auto") => void;
1020
1145
  toggleColorScheme: () => void;
1021
- resolvedColorScheme: "light" | "dark";
1146
+ resolvedColorScheme: "dark" | "light";
1022
1147
  containerRef: React$1.RefObject<HTMLElement | null>;
1023
1148
  };
1024
1149
 
1025
- export { type AutoMeasurementsOptions, CellBadge, type CellBadgeProps, CellBoolean, type CellBooleanProps, CellCheckbox, CellCurrency, type CellCurrencyProps, CellDate, CellDatePicker, type CellDateProps, CellErrorBoundary, CellInput, CellLink, type CellLinkProps, type CellMeasureRecipe, type CellMeasurement, CellNumeric, type CellNumericProps, CellProgress, type CellProgressProps, CellRating, type CellRatingProps, CellSelect, CellStatus, CellStatusBadge, type CellStatusBadgeProps, type CellStatusProps, CellToggle, ColumnsPanel, ContextMenu, ContextMenuItem, type ContextMenuItemDef, DEFAULT_TEXT_RECIPE, DragHandle, ErrorBoundary, ExpandIcon, FillHandle, type FillHandleDragState, type FillHandleProps, FiltersPanel, FlashCell, FloatingFilter, GlobalFilter, LoadingOverlay, type LoadingOverlayProps, MasterDetail, NoRowsOverlay, type NoRowsOverlayProps, Pagination, PivotConfigPanel, type PivotConfigProps, type PivotFieldItem, type PivotValueItem, PrintLayout, SetFilter, Sidebar, SortIndicator, StatusBar, StatusBarPanelComponent, type StatusBarPanelComponentProps, type StatusBarPanelConfig, type StatusBarPanelProps, Table, TableBody, TableCell, type TableCellProps$1 as TableCellProps, TableFooter, TableHeader, type TableHeaderCellProps, type TableProps, TableProvider, type TableRowProps, Tooltip, type TooltipPosition, type TooltipProps, TreeToggle, type UseCellFlashOptions, type UseClipboardOptions, type UseColumnVirtualizationOptions, type UseColumnVirtualizationResult, type UseFillHandleOptions, type UseFillHandleReturn, type UseKeyboardNavigationOptions, type UsePretextMeasurementOptions, type UsePretextMeasurementResult, type UsePrintLayoutOptions, type UseRowAnimationOptions, type UseRowDragOptions, type UseRowDragReturn, type UseTableRowHeightsOptions, type UseThemeOptions, type UseTooltipOptions, type UseVirtualizationOptions, type UseVirtualizationResult, type VirtualColumn, type VirtualRow, getMeasureRecipeForCellType, getRegisteredCellTypes, resolveMeasureRecipe, useAutoMeasurements, useCellFlash, useClipboard, useColumnVirtualization, useContextMenu, useFillHandle, useKeyboardNavigation, usePretextMeasurement, usePrintLayout, useRowAnimation, useRowDrag, useTable, useTableContext, useTableRowHeights, useTheme, useTooltip, useVirtualization };
1150
+ interface SelectColumnOptions {
1151
+ id?: string;
1152
+ size?: number;
1153
+ headerAriaLabel?: string;
1154
+ }
1155
+ declare function selectColumn<TData extends RowData>(options?: SelectColumnOptions): ColumnDef<TData, unknown>;
1156
+
1157
+ interface RowNumberColumnOptions {
1158
+ id?: string;
1159
+ header?: string;
1160
+ size?: number;
1161
+ startFrom?: number;
1162
+ }
1163
+ declare function rowNumberColumn<TData extends RowData>(options?: RowNumberColumnOptions): ColumnDef<TData, unknown>;
1164
+
1165
+ interface ActionItem<TData extends RowData> {
1166
+ label: string;
1167
+ icon?: ReactNode;
1168
+ onClick: (row: Row<TData>) => void;
1169
+ hidden?: (row: Row<TData>) => boolean;
1170
+ disabled?: (row: Row<TData>) => boolean;
1171
+ }
1172
+ interface ActionsColumnOptions<TData extends RowData> {
1173
+ id?: string;
1174
+ header?: string;
1175
+ size?: number;
1176
+ actions: ActionItem<TData>[] | ((row: Row<TData>) => ActionItem<TData>[]);
1177
+ }
1178
+ declare function actionsColumn<TData extends RowData>(options: ActionsColumnOptions<TData>): ColumnDef<TData, unknown>;
1179
+
1180
+ interface ExpandColumnOptions {
1181
+ id?: string;
1182
+ size?: number;
1183
+ }
1184
+ declare function expandColumn<TData extends RowData>(options?: ExpandColumnOptions): ColumnDef<TData, unknown>;
1185
+
1186
+ interface CellStackProps {
1187
+ children: React__default.ReactNode;
1188
+ gap?: number;
1189
+ }
1190
+ declare function CellStack({ children, gap }: CellStackProps): react_jsx_runtime.JSX.Element;
1191
+
1192
+ interface CellRowProps {
1193
+ children: React__default.ReactNode;
1194
+ gap?: number;
1195
+ align?: 'start' | 'center' | 'end' | 'baseline';
1196
+ justify?: 'start' | 'center' | 'end' | 'between';
1197
+ }
1198
+ declare function CellRow({ children, gap, align, justify }: CellRowProps): react_jsx_runtime.JSX.Element;
1199
+
1200
+ interface CellWithIconProps {
1201
+ icon: React__default.ReactNode;
1202
+ children: React__default.ReactNode;
1203
+ gap?: number;
1204
+ iconSize?: number;
1205
+ }
1206
+ declare function CellWithIcon({ icon, children, gap, iconSize }: CellWithIconProps): react_jsx_runtime.JSX.Element;
1207
+
1208
+ interface CellTextProps {
1209
+ children: React__default.ReactNode;
1210
+ variant?: 'primary' | 'secondary' | 'muted';
1211
+ bold?: boolean;
1212
+ truncate?: boolean;
1213
+ size?: 'sm' | 'md' | 'lg';
1214
+ }
1215
+ declare function CellText({ children, variant, bold, truncate, size, }: CellTextProps): react_jsx_runtime.JSX.Element;
1216
+
1217
+ /**
1218
+ * Merges edit-commit changes into a data array, returning a new array
1219
+ * with matching rows shallow-merged. Rows without changes keep their
1220
+ * original reference so downstream memoisation works.
1221
+ *
1222
+ * @param data Current data array
1223
+ * @param changes Map of row ID -> partial row values (same shape as `onEditCommit`)
1224
+ * @param getRowId Optional row-ID resolver; defaults to string index
1225
+ */
1226
+ declare function mergeEditChanges<TData>(data: TData[], changes: Record<string, Partial<TData>>, getRowId?: (row: TData, index: number) => string): TData[];
1227
+
1228
+ export { type ActionItem, type ActionsColumnOptions, type AutoMeasurementsOptions, CellBadge, type CellBadgeProps, CellBoolean, type CellBooleanProps, CellCheckbox, CellCurrency, type CellCurrencyProps, CellDate, CellDatePicker, type CellDateProps, CellErrorBoundary, CellInput, CellLink, type CellLinkProps, type CellMeasureRecipe, type CellMeasurement, CellNumeric, type CellNumericProps, CellProgress, type CellProgressProps, CellRating, type CellRatingProps, CellRow, type CellRowProps, CellSelect, CellStack, type CellStackProps, CellStatus, CellStatusBadge, type CellStatusBadgeProps, type CellStatusProps, CellText, type CellTextProps, CellToggle, CellWithIcon, type CellWithIconProps, ColumnsPanel, ContextMenu, ContextMenuItem, type ContextMenuItemDef, DEFAULT_TEXT_RECIPE, DragHandle, ErrorBoundary, type ExpandColumnOptions, ExpandIcon, FillHandle, type FillHandleDragState, type FillHandleProps, FiltersPanel, FlashCell, FloatingFilter, GlobalFilter, LoadingOverlay, type LoadingOverlayProps, MasterDetail, NoRowsOverlay, type NoRowsOverlayProps, Pagination, PivotConfigPanel, type PivotConfigProps, type PivotFieldItem, type PivotValueItem, PrintLayout, type RowNumberColumnOptions, type SelectColumnOptions, SetFilter, Sidebar, SortIndicator, StatusBar, StatusBarPanelComponent, type StatusBarPanelComponentProps, type StatusBarPanelConfig, type StatusBarPanelProps, Table, TableBody, TableCell, type TableCellProps$1 as TableCellProps, TableFooter, TableHeader, type TableHeaderCellProps, type TableProps, TableProvider, type TableRowProps, Tooltip, type TooltipPosition, type TooltipProps, TreeToggle, type UseCellFlashOptions, type UseClipboardOptions, type UseColumnVirtualizationOptions, type UseColumnVirtualizationResult, type UseFillHandleOptions, type UseFillHandleReturn, type UseKeyboardNavigationOptions, type UsePretextMeasurementOptions, type UsePretextMeasurementResult, type UsePrintLayoutOptions, type UseRowAnimationOptions, type UseRowDragOptions, type UseRowDragReturn, type UseTablePersistenceOptions, type UseTablePersistenceReturn, type UseTableRowHeightsOptions, type UseThemeOptions, type UseTooltipOptions, type UseVirtualizationOptions, type UseVirtualizationResult, type VirtualColumn, type VirtualRow, type YableDefaults, YableProvider, actionsColumn, expandColumn, getMeasureRecipeForCellType, getRegisteredCellTypes, mergeEditChanges, resolveMeasureRecipe, rowNumberColumn, selectColumn, useAutoMeasurements, useCellFlash, useClipboard, useColumnVirtualization, useContextMenu, useFillHandle, useKeyboardNavigation, usePretextMeasurement, usePrintLayout, useRowAnimation, useRowDrag, useTable, useTableContext, useTablePersistence, useTableRowHeights, useTheme, useTooltip, useVirtualization, useYableDefaults };
package/dist/index.d.ts CHANGED
@@ -1,7 +1,7 @@
1
- import { Table as Table$1, RowData, Cell, Header, Row, TableOptions, Column, ColumnDef, SortDirection, CellContext, ClipboardOptions, CellFlashInfo } from '@zvndev/yable-core';
1
+ import { Table as Table$1, RowData, Cell, Header, Row, TableOptions, TableState, Updater, Column, ColumnDef, ColumnDefBase, SortDirection, CellContext, ClipboardOptions, CellFlashInfo } from '@zvndev/yable-core';
2
2
  export { AccessorFnColumnDef, AccessorKeyColumnDef, AggregationFn, Cell, CellStatus as CellCommitStatus, CellContext, CellFlashEvent, CellPatch, ClipboardOptions, Column, ColumnDef, ColumnDefBase, ColumnFiltersState, ColumnMeta, ColumnOrderState, ColumnPinningState, ColumnSizingInfoState, ColumnSizingState, CommitError, CommitErrorCells, CommitRecord, CommitResult, CommitsSlice, DisplayColumnDef, EditingState, ExpandedState, FillHandleState, FilterFn, FormulaEngine, FormulaError, FormulaFunction, FormulaState, GroupColumnDef, Header, HeaderContext, HeaderGroup, KeyboardNavigationAction, KeyboardNavigationCell, KeyboardNavigationDirection, KeyboardNavigationState, OnChangeFn, OnCommitFn, PaginationState, PartialLocale, PivotColumn, PivotConfig, PivotEngine, PivotFieldConfig, PivotRow, PivotState, PivotValueConfig, Row, RowData, RowDragEndEvent, RowDragEvent, RowDragState, RowEditCommitEvent, RowEditEvent, RowPinningState, RowReorderEvent, RowSelectionState, SortDirection, SortingFn, SortingState, Table as TableInstance, TableOptions, TableOptionsResolved, TableState, UndoAction, UndoRedoOptions, UndoRedoState, UndoStack, Updater, VisibilityState, YableLocale, aggregationFns, createColumnHelper, createLocale, createUndoRedoIntegration, en, filterFns, formulaFunctions, functionalUpdate, generatePivotColumnDefs, getDefaultLocale, getInitialPivotState, getPivotRowModel, resetLocale, setDefaultLocale, sortingFns } from '@zvndev/yable-core';
3
3
  import * as React$1 from 'react';
4
- import React__default, { HTMLAttributes, TdHTMLAttributes, ThHTMLAttributes } from 'react';
4
+ import React__default, { HTMLAttributes, TdHTMLAttributes, ThHTMLAttributes, ReactNode } from 'react';
5
5
  import * as react_jsx_runtime from 'react/jsx-runtime';
6
6
  import { RowDragState } from '@zvndev/yable-core/features/rowDragging';
7
7
 
@@ -99,6 +99,69 @@ interface TableHeaderCellProps<TData extends RowData, TValue = unknown> extends
99
99
  */
100
100
  declare function useTable<TData extends RowData>(options: TableOptions<TData>): Table$1<TData>;
101
101
 
102
+ interface UseTablePersistenceOptions {
103
+ /** Storage key used for getItem/setItem. */
104
+ key: string;
105
+ /** Which TableState slices to persist. Defaults to column layout keys. */
106
+ persistedKeys?: (keyof TableState)[];
107
+ /** Milliseconds to debounce storage writes. Default: 100. */
108
+ debounce?: number;
109
+ /** Schema version — bumping this discards any stale stored data. */
110
+ version?: number;
111
+ /** Custom Storage implementation. Default: localStorage. */
112
+ storage?: Storage;
113
+ }
114
+ interface UseTablePersistenceReturn {
115
+ /**
116
+ * Partial state hydrated from storage — pass to `useTable({ initialState })`.
117
+ * Only useful when NOT passing `onStateChange` (i.e., uncontrolled mode).
118
+ */
119
+ initialState: Partial<TableState>;
120
+ /**
121
+ * State-change handler that persists relevant slices on each update.
122
+ * When passed to `useTable({ onStateChange })`, the persistence hook
123
+ * takes over state management (controlled mode). You MUST also pass
124
+ * `state` to useTable in this case.
125
+ */
126
+ onStateChange: (updater: Updater<TableState>) => void;
127
+ /**
128
+ * Current table state managed by the persistence hook.
129
+ * Pass to `useTable({ state })` alongside `onStateChange`.
130
+ */
131
+ state: Partial<TableState>;
132
+ /** Manually clear all persisted state for this key. */
133
+ clearPersistedState: () => void;
134
+ }
135
+ /**
136
+ * React hook that persists selected table state slices to storage.
137
+ *
138
+ * Returns `initialState` (hydrated from storage), `state`, and
139
+ * `onStateChange` — pass all three to `useTable` so that persisted
140
+ * slices survive page reloads.
141
+ *
142
+ * @example
143
+ * ```tsx
144
+ * const persistence = useTablePersistence({ key: 'my-table', version: 1 })
145
+ *
146
+ * // Controlled mode (recommended) — persistence manages state:
147
+ * const table = useTable({
148
+ * data,
149
+ * columns,
150
+ * initialState: persistence.initialState,
151
+ * state: persistence.state,
152
+ * onStateChange: persistence.onStateChange,
153
+ * })
154
+ *
155
+ * // Uncontrolled mode — only hydrate, no live persistence:
156
+ * const table = useTable({
157
+ * data,
158
+ * columns,
159
+ * initialState: persistence.initialState,
160
+ * })
161
+ * ```
162
+ */
163
+ declare function useTablePersistence(options: UseTablePersistenceOptions): UseTablePersistenceReturn;
164
+
102
165
  interface VirtualRow {
103
166
  index: number;
104
167
  start: number;
@@ -114,6 +177,12 @@ interface UseVirtualizationOptions {
114
177
  pretextHeights?: Float64Array | null;
115
178
  /** Pre-computed prefix sums for O(log n) scroll lookups */
116
179
  pretextPrefixSums?: Float64Array | null;
180
+ /**
181
+ * Opaque key that changes when column widths change.
182
+ * When this value changes the height cache is invalidated because column
183
+ * resizing can affect text wrapping and therefore row heights.
184
+ */
185
+ columnSizingHash?: string | number;
117
186
  }
118
187
  interface UseVirtualizationResult {
119
188
  virtualRows: VirtualRow[];
@@ -121,19 +190,26 @@ interface UseVirtualizationResult {
121
190
  startIndex: number;
122
191
  endIndex: number;
123
192
  scrollTo: (index: number) => void;
193
+ /**
194
+ * Manually clear the row-height cache and force recalculation.
195
+ * Call this when cell content changes (data mutations, font-size changes, etc.)
196
+ * that may affect row heights.
197
+ */
198
+ invalidateRowHeights: () => void;
124
199
  }
125
200
  /**
126
201
  * Computes which rows are visible in a scrollable container and returns
127
202
  * positioning data so only those rows (plus an overscan buffer) are rendered.
128
203
  *
129
- * Returns `{ virtualRows, totalHeight, startIndex, endIndex, scrollTo }`.
204
+ * Returns `{ virtualRows, totalHeight, startIndex, endIndex, scrollTo, invalidateRowHeights }`.
130
205
  * Re-renders are triggered by scroll (rAF-throttled) and ResizeObserver
131
206
  * container resize. Supports fixed, variable, and Pretext-pre-measured heights.
132
207
  *
133
- * Gotcha: variable-height mode caches measured heights per index — pass new
134
- * `pretextHeights` arrays (or change `totalRows`) to invalidate the cache.
208
+ * The height cache is automatically invalidated when `totalRows`, `isFixedHeight`,
209
+ * or `columnSizingHash` changes. For manual invalidation (e.g. after data mutations
210
+ * or font-size changes), call `invalidateRowHeights()`.
135
211
  */
136
- declare function useVirtualization({ containerRef, totalRows, rowHeight, overscan, estimateRowHeight: _estimateRowHeight, pretextHeights, pretextPrefixSums, }: UseVirtualizationOptions): UseVirtualizationResult;
212
+ declare function useVirtualization({ containerRef, totalRows, rowHeight, overscan, estimateRowHeight: _estimateRowHeight, pretextHeights, pretextPrefixSums, columnSizingHash, }: UseVirtualizationOptions): UseVirtualizationResult;
137
213
 
138
214
  interface VirtualColumn<TData extends RowData> {
139
215
  column: Column<TData, unknown>;
@@ -393,7 +469,55 @@ declare function getRegisteredCellTypes(): readonly string[];
393
469
  declare const TableProvider: React$1.Provider<Table$1<any> | null>;
394
470
  declare function useTableContext<TData extends RowData>(): Table$1<TData>;
395
471
 
396
- declare function Table<TData extends RowData>({ table, stickyHeader, striped, bordered, compact, theme, clickableRows, footer, loading, loadingComponent, loadingText, emptyMessage, emptyComponent, emptyIcon, emptyDetail, renderEmpty, renderLoading, children, className, direction, statusBar, statusBarPanels, sidebar, sidebarPanels, defaultSidebarPanel, floatingFilters, columnVirtualization, columnVirtualizationOverscan, ariaLabel, ...rest }: TableProps<TData>): react_jsx_runtime.JSX.Element;
472
+ /**
473
+ * Project-wide default table and column options.
474
+ *
475
+ * Wrap your app (or a subtree) in `<YableProvider>` so every `<Table>` and
476
+ * `useTable` call inherits these defaults without repeating config.
477
+ *
478
+ * Component-level and hook-level values always take precedence over provider
479
+ * defaults.
480
+ */
481
+ interface YableDefaults {
482
+ /** Default props applied to every `<Table>` in the subtree */
483
+ tableProps?: Partial<Pick<TableProps<any>, 'striped' | 'bordered' | 'compact' | 'stickyHeader' | 'theme' | 'direction' | 'ariaLabel'>>;
484
+ /** Default column definition merged under every table's own `defaultColumnDef` */
485
+ defaultColumnDef?: Partial<ColumnDefBase<any, unknown>>;
486
+ }
487
+ /**
488
+ * Read the nearest `YableProvider` defaults.
489
+ *
490
+ * Safe to call outside a provider — returns an empty object.
491
+ */
492
+ declare function useYableDefaults(): YableDefaults;
493
+ /**
494
+ * Provide project-wide defaults for all Yable tables in a subtree.
495
+ *
496
+ * @example
497
+ * ```tsx
498
+ * <YableProvider
499
+ * striped
500
+ * stickyHeader
501
+ * theme="stripe"
502
+ * defaultColumnDef={{ enableSorting: true }}
503
+ * >
504
+ * <EmployeeTable />
505
+ * <ProjectTable />
506
+ * </YableProvider>
507
+ * ```
508
+ */
509
+ declare function YableProvider({ children, defaultColumnDef, striped, stickyHeader, bordered, compact, theme, direction, ariaLabel, }: YableDefaults & {
510
+ children: ReactNode;
511
+ striped?: boolean;
512
+ stickyHeader?: boolean;
513
+ bordered?: boolean;
514
+ compact?: boolean;
515
+ theme?: string;
516
+ direction?: 'ltr' | 'rtl';
517
+ ariaLabel?: string;
518
+ }): react_jsx_runtime.JSX.Element;
519
+
520
+ declare function Table<TData extends RowData>({ table, stickyHeader: stickyHeaderProp, striped: stripedProp, bordered: borderedProp, compact: compactProp, theme: themeProp, clickableRows, footer, loading, loadingComponent, loadingText, emptyMessage, emptyComponent, emptyIcon, emptyDetail, renderEmpty, renderLoading, children, className, direction: directionProp, statusBar, statusBarPanels, sidebar, sidebarPanels, defaultSidebarPanel, floatingFilters, columnVirtualization, columnVirtualizationOverscan, ariaLabel: ariaLabelProp, ...rest }: TableProps<TData>): react_jsx_runtime.JSX.Element;
397
521
 
398
522
  interface TableHeaderProps<TData extends RowData> {
399
523
  table: Table$1<TData>;
@@ -404,8 +528,9 @@ declare function TableHeader<TData extends RowData>({ table, floatingFilters, }:
404
528
  interface TableBodyProps<TData extends RowData> {
405
529
  table: Table$1<TData>;
406
530
  clickableRows?: boolean;
531
+ colgroup?: React__default.ReactNode;
407
532
  }
408
- declare function TableBody<TData extends RowData>({ table, clickableRows }: TableBodyProps<TData>): react_jsx_runtime.JSX.Element;
533
+ declare function TableBody<TData extends RowData>({ table, clickableRows, colgroup, }: TableBodyProps<TData>): react_jsx_runtime.JSX.Element;
409
534
 
410
535
  interface TableCellProps<TData extends RowData> {
411
536
  cell: Cell<TData, unknown>;
@@ -1015,11 +1140,89 @@ interface UseThemeOptions {
1015
1140
  declare function useTheme(options?: UseThemeOptions): {
1016
1141
  theme: string;
1017
1142
  setTheme: (newTheme: string) => void;
1018
- colorScheme: "auto" | "light" | "dark";
1143
+ colorScheme: "auto" | "dark" | "light";
1019
1144
  setColorScheme: (scheme: "light" | "dark" | "auto") => void;
1020
1145
  toggleColorScheme: () => void;
1021
- resolvedColorScheme: "light" | "dark";
1146
+ resolvedColorScheme: "dark" | "light";
1022
1147
  containerRef: React$1.RefObject<HTMLElement | null>;
1023
1148
  };
1024
1149
 
1025
- export { type AutoMeasurementsOptions, CellBadge, type CellBadgeProps, CellBoolean, type CellBooleanProps, CellCheckbox, CellCurrency, type CellCurrencyProps, CellDate, CellDatePicker, type CellDateProps, CellErrorBoundary, CellInput, CellLink, type CellLinkProps, type CellMeasureRecipe, type CellMeasurement, CellNumeric, type CellNumericProps, CellProgress, type CellProgressProps, CellRating, type CellRatingProps, CellSelect, CellStatus, CellStatusBadge, type CellStatusBadgeProps, type CellStatusProps, CellToggle, ColumnsPanel, ContextMenu, ContextMenuItem, type ContextMenuItemDef, DEFAULT_TEXT_RECIPE, DragHandle, ErrorBoundary, ExpandIcon, FillHandle, type FillHandleDragState, type FillHandleProps, FiltersPanel, FlashCell, FloatingFilter, GlobalFilter, LoadingOverlay, type LoadingOverlayProps, MasterDetail, NoRowsOverlay, type NoRowsOverlayProps, Pagination, PivotConfigPanel, type PivotConfigProps, type PivotFieldItem, type PivotValueItem, PrintLayout, SetFilter, Sidebar, SortIndicator, StatusBar, StatusBarPanelComponent, type StatusBarPanelComponentProps, type StatusBarPanelConfig, type StatusBarPanelProps, Table, TableBody, TableCell, type TableCellProps$1 as TableCellProps, TableFooter, TableHeader, type TableHeaderCellProps, type TableProps, TableProvider, type TableRowProps, Tooltip, type TooltipPosition, type TooltipProps, TreeToggle, type UseCellFlashOptions, type UseClipboardOptions, type UseColumnVirtualizationOptions, type UseColumnVirtualizationResult, type UseFillHandleOptions, type UseFillHandleReturn, type UseKeyboardNavigationOptions, type UsePretextMeasurementOptions, type UsePretextMeasurementResult, type UsePrintLayoutOptions, type UseRowAnimationOptions, type UseRowDragOptions, type UseRowDragReturn, type UseTableRowHeightsOptions, type UseThemeOptions, type UseTooltipOptions, type UseVirtualizationOptions, type UseVirtualizationResult, type VirtualColumn, type VirtualRow, getMeasureRecipeForCellType, getRegisteredCellTypes, resolveMeasureRecipe, useAutoMeasurements, useCellFlash, useClipboard, useColumnVirtualization, useContextMenu, useFillHandle, useKeyboardNavigation, usePretextMeasurement, usePrintLayout, useRowAnimation, useRowDrag, useTable, useTableContext, useTableRowHeights, useTheme, useTooltip, useVirtualization };
1150
+ interface SelectColumnOptions {
1151
+ id?: string;
1152
+ size?: number;
1153
+ headerAriaLabel?: string;
1154
+ }
1155
+ declare function selectColumn<TData extends RowData>(options?: SelectColumnOptions): ColumnDef<TData, unknown>;
1156
+
1157
+ interface RowNumberColumnOptions {
1158
+ id?: string;
1159
+ header?: string;
1160
+ size?: number;
1161
+ startFrom?: number;
1162
+ }
1163
+ declare function rowNumberColumn<TData extends RowData>(options?: RowNumberColumnOptions): ColumnDef<TData, unknown>;
1164
+
1165
+ interface ActionItem<TData extends RowData> {
1166
+ label: string;
1167
+ icon?: ReactNode;
1168
+ onClick: (row: Row<TData>) => void;
1169
+ hidden?: (row: Row<TData>) => boolean;
1170
+ disabled?: (row: Row<TData>) => boolean;
1171
+ }
1172
+ interface ActionsColumnOptions<TData extends RowData> {
1173
+ id?: string;
1174
+ header?: string;
1175
+ size?: number;
1176
+ actions: ActionItem<TData>[] | ((row: Row<TData>) => ActionItem<TData>[]);
1177
+ }
1178
+ declare function actionsColumn<TData extends RowData>(options: ActionsColumnOptions<TData>): ColumnDef<TData, unknown>;
1179
+
1180
+ interface ExpandColumnOptions {
1181
+ id?: string;
1182
+ size?: number;
1183
+ }
1184
+ declare function expandColumn<TData extends RowData>(options?: ExpandColumnOptions): ColumnDef<TData, unknown>;
1185
+
1186
+ interface CellStackProps {
1187
+ children: React__default.ReactNode;
1188
+ gap?: number;
1189
+ }
1190
+ declare function CellStack({ children, gap }: CellStackProps): react_jsx_runtime.JSX.Element;
1191
+
1192
+ interface CellRowProps {
1193
+ children: React__default.ReactNode;
1194
+ gap?: number;
1195
+ align?: 'start' | 'center' | 'end' | 'baseline';
1196
+ justify?: 'start' | 'center' | 'end' | 'between';
1197
+ }
1198
+ declare function CellRow({ children, gap, align, justify }: CellRowProps): react_jsx_runtime.JSX.Element;
1199
+
1200
+ interface CellWithIconProps {
1201
+ icon: React__default.ReactNode;
1202
+ children: React__default.ReactNode;
1203
+ gap?: number;
1204
+ iconSize?: number;
1205
+ }
1206
+ declare function CellWithIcon({ icon, children, gap, iconSize }: CellWithIconProps): react_jsx_runtime.JSX.Element;
1207
+
1208
+ interface CellTextProps {
1209
+ children: React__default.ReactNode;
1210
+ variant?: 'primary' | 'secondary' | 'muted';
1211
+ bold?: boolean;
1212
+ truncate?: boolean;
1213
+ size?: 'sm' | 'md' | 'lg';
1214
+ }
1215
+ declare function CellText({ children, variant, bold, truncate, size, }: CellTextProps): react_jsx_runtime.JSX.Element;
1216
+
1217
+ /**
1218
+ * Merges edit-commit changes into a data array, returning a new array
1219
+ * with matching rows shallow-merged. Rows without changes keep their
1220
+ * original reference so downstream memoisation works.
1221
+ *
1222
+ * @param data Current data array
1223
+ * @param changes Map of row ID -> partial row values (same shape as `onEditCommit`)
1224
+ * @param getRowId Optional row-ID resolver; defaults to string index
1225
+ */
1226
+ declare function mergeEditChanges<TData>(data: TData[], changes: Record<string, Partial<TData>>, getRowId?: (row: TData, index: number) => string): TData[];
1227
+
1228
+ export { type ActionItem, type ActionsColumnOptions, type AutoMeasurementsOptions, CellBadge, type CellBadgeProps, CellBoolean, type CellBooleanProps, CellCheckbox, CellCurrency, type CellCurrencyProps, CellDate, CellDatePicker, type CellDateProps, CellErrorBoundary, CellInput, CellLink, type CellLinkProps, type CellMeasureRecipe, type CellMeasurement, CellNumeric, type CellNumericProps, CellProgress, type CellProgressProps, CellRating, type CellRatingProps, CellRow, type CellRowProps, CellSelect, CellStack, type CellStackProps, CellStatus, CellStatusBadge, type CellStatusBadgeProps, type CellStatusProps, CellText, type CellTextProps, CellToggle, CellWithIcon, type CellWithIconProps, ColumnsPanel, ContextMenu, ContextMenuItem, type ContextMenuItemDef, DEFAULT_TEXT_RECIPE, DragHandle, ErrorBoundary, type ExpandColumnOptions, ExpandIcon, FillHandle, type FillHandleDragState, type FillHandleProps, FiltersPanel, FlashCell, FloatingFilter, GlobalFilter, LoadingOverlay, type LoadingOverlayProps, MasterDetail, NoRowsOverlay, type NoRowsOverlayProps, Pagination, PivotConfigPanel, type PivotConfigProps, type PivotFieldItem, type PivotValueItem, PrintLayout, type RowNumberColumnOptions, type SelectColumnOptions, SetFilter, Sidebar, SortIndicator, StatusBar, StatusBarPanelComponent, type StatusBarPanelComponentProps, type StatusBarPanelConfig, type StatusBarPanelProps, Table, TableBody, TableCell, type TableCellProps$1 as TableCellProps, TableFooter, TableHeader, type TableHeaderCellProps, type TableProps, TableProvider, type TableRowProps, Tooltip, type TooltipPosition, type TooltipProps, TreeToggle, type UseCellFlashOptions, type UseClipboardOptions, type UseColumnVirtualizationOptions, type UseColumnVirtualizationResult, type UseFillHandleOptions, type UseFillHandleReturn, type UseKeyboardNavigationOptions, type UsePretextMeasurementOptions, type UsePretextMeasurementResult, type UsePrintLayoutOptions, type UseRowAnimationOptions, type UseRowDragOptions, type UseRowDragReturn, type UseTablePersistenceOptions, type UseTablePersistenceReturn, type UseTableRowHeightsOptions, type UseThemeOptions, type UseTooltipOptions, type UseVirtualizationOptions, type UseVirtualizationResult, type VirtualColumn, type VirtualRow, type YableDefaults, YableProvider, actionsColumn, expandColumn, getMeasureRecipeForCellType, getRegisteredCellTypes, mergeEditChanges, resolveMeasureRecipe, rowNumberColumn, selectColumn, useAutoMeasurements, useCellFlash, useClipboard, useColumnVirtualization, useContextMenu, useFillHandle, useKeyboardNavigation, usePretextMeasurement, usePrintLayout, useRowAnimation, useRowDrag, useTable, useTableContext, useTablePersistence, useTableRowHeights, useTheme, useTooltip, useVirtualization, useYableDefaults };