@coldsmirk/ledger-mantine 0.1.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/README.md +49 -0
- package/dist/index.cjs +7338 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +1189 -0
- package/dist/index.d.ts +1189 -0
- package/dist/index.js +7295 -0
- package/dist/index.js.map +1 -0
- package/dist/labels-ChBqD1II.d.cts +107 -0
- package/dist/labels-ChBqD1II.d.ts +107 -0
- package/dist/locales.cjs +55 -0
- package/dist/locales.cjs.map +1 -0
- package/dist/locales.d.cts +7 -0
- package/dist/locales.d.ts +7 -0
- package/dist/locales.js +54 -0
- package/dist/locales.js.map +1 -0
- package/dist/styles.css +904 -0
- package/package.json +95 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,1189 @@
|
|
|
1
|
+
|
|
2
|
+
import { n as defaultLabels, t as DataTableLabels } from "./labels-ChBqD1II.js";
|
|
3
|
+
import { BoxProps, ComboboxData, ElementProps, Factory, MantineBreakpoint, MantineColor, MantineSpacing, PopoverProps, StylesApiProps, TableTdProps, TableThProps, TableTrProps, TextInputProps } from "@mantine/core";
|
|
4
|
+
import { CSSProperties, ComponentProps, ComponentType, JSX, KeyboardEvent, MouseEvent, ReactElement, ReactNode, Ref } from "react";
|
|
5
|
+
import { Cell as Cell$1, CellData, Column as Column$1, ColumnDef as ColumnDef$1, ColumnFiltersState, ColumnFiltersState as ColumnFiltersState$1, ColumnOrderState, ColumnOrderState as ColumnOrderState$1, ColumnPinningState, ColumnPinningState as ColumnPinningState$1, ColumnSizingState, ColumnSizingState as ColumnSizingState$1, ColumnVisibilityState, ColumnVisibilityState as ColumnVisibilityState$1, ExpandedState, ExpandedState as ExpandedState$1, FilterFn, FilterFnOption, GroupingState, GroupingState as GroupingState$1, Header as Header$1, HeaderGroup as HeaderGroup$1, PaginationState, PaginationState as PaginationState$1, ReactTable, Row as Row$1, RowData, RowData as RowData$1, RowPinningState, RowPinningState as RowPinningState$1, RowSelectionState, RowSelectionState as RowSelectionState$1, SortingState, SortingState as SortingState$1, TableFeatures, TableOptions, flexRender } from "@tanstack/react-table";
|
|
6
|
+
//#region src/icons.d.ts
|
|
7
|
+
/**
|
|
8
|
+
* What a replacement icon receives — the two knobs the chrome actually turns. Lucide icons are
|
|
9
|
+
* drawn on a 24px grid at stroke 2; a custom component is free to ignore either.
|
|
10
|
+
*/
|
|
11
|
+
interface DataTableIconProps {
|
|
12
|
+
/**
|
|
13
|
+
* Rendered width and height in px. The chrome passes 12–16 for controls and 40 for the
|
|
14
|
+
* empty/error indicators.
|
|
15
|
+
*/
|
|
16
|
+
size?: number;
|
|
17
|
+
strokeWidth?: number;
|
|
18
|
+
}
|
|
19
|
+
type DataTableIconComponent = ComponentType<DataTableIconProps>;
|
|
20
|
+
/**
|
|
21
|
+
* Every glyph the table chrome renders, one slot per affordance. Slots are named for the
|
|
22
|
+
* `DataTableLabels` key of the same affordance where one exists (`pinStart`, `retry`,
|
|
23
|
+
* `clearSelection`, …), so the two registries read as one vocabulary.
|
|
24
|
+
*/
|
|
25
|
+
interface DataTableIcons {
|
|
26
|
+
sortAsc: DataTableIconComponent;
|
|
27
|
+
sortDesc: DataTableIconComponent;
|
|
28
|
+
/**
|
|
29
|
+
* The neutral both-directions affordance an unsorted sortable column shows.
|
|
30
|
+
*/
|
|
31
|
+
sortable: DataTableIconComponent;
|
|
32
|
+
filterColumn: DataTableIconComponent;
|
|
33
|
+
expandRow: DataTableIconComponent;
|
|
34
|
+
/**
|
|
35
|
+
* The drag handle of the injected row-ordering column, and the ghost that follows a drag.
|
|
36
|
+
*/
|
|
37
|
+
reorderRow: DataTableIconComponent;
|
|
38
|
+
empty: DataTableIconComponent;
|
|
39
|
+
noResults: DataTableIconComponent;
|
|
40
|
+
error: DataTableIconComponent;
|
|
41
|
+
retry: DataTableIconComponent;
|
|
42
|
+
search: DataTableIconComponent;
|
|
43
|
+
clearSelection: DataTableIconComponent;
|
|
44
|
+
resetColumns: DataTableIconComponent;
|
|
45
|
+
reorderColumn: DataTableIconComponent;
|
|
46
|
+
/**
|
|
47
|
+
* Both the group toggle and the grouped rest-state mark.
|
|
48
|
+
*/
|
|
49
|
+
groupByColumn: DataTableIconComponent;
|
|
50
|
+
pinStart: DataTableIconComponent;
|
|
51
|
+
unpin: DataTableIconComponent;
|
|
52
|
+
pinEnd: DataTableIconComponent;
|
|
53
|
+
}
|
|
54
|
+
declare const defaultIcons: DataTableIcons;
|
|
55
|
+
//#endregion
|
|
56
|
+
//#region src/element-props.d.ts
|
|
57
|
+
/**
|
|
58
|
+
* React's HTML attribute types enumerate every `aria-*` attribute but no `data-*` one: JSX
|
|
59
|
+
* accepts them through a compiler special case that an object literal does not get. The escape
|
|
60
|
+
* hatch therefore admits them explicitly — `data-*` is half the point of it.
|
|
61
|
+
*/
|
|
62
|
+
type DataAttributes = Record<`data-${string}`, string | number | boolean | null | undefined>;
|
|
63
|
+
/**
|
|
64
|
+
* The DOM escape hatch (docs/styling.md#dom-props): every rendered row, cell, and header cell
|
|
65
|
+
* accepts consumer props — attributes, `data-*`, `aria-*`, inline styles, extra handlers —
|
|
66
|
+
* either as a static object or as a function of the element's subject.
|
|
67
|
+
*
|
|
68
|
+
* `ref` is deliberately excluded from every one of these types: they are declarative prop hooks
|
|
69
|
+
* resolved per render (per virtual item, for rows), not component instances, and ledger already
|
|
70
|
+
* owns the row ref for virtualization measurement.
|
|
71
|
+
*/
|
|
72
|
+
type DataTableElementProps<TProps, TSubject> = (TProps & DataAttributes) | ((subject: TSubject) => (TProps & DataAttributes) | undefined);
|
|
73
|
+
//#endregion
|
|
74
|
+
//#region src/ledger-features.d.ts
|
|
75
|
+
declare const ledgerFeatures: {
|
|
76
|
+
cellSpanningFeature: import("@tanstack/react-table").TableFeature;
|
|
77
|
+
columnFacetingFeature: import("@tanstack/react-table").TableFeature;
|
|
78
|
+
columnFilteringFeature: import("@tanstack/react-table").TableFeature;
|
|
79
|
+
columnGroupingFeature: import("@tanstack/react-table").TableFeature;
|
|
80
|
+
columnOrderingFeature: import("@tanstack/react-table").TableFeature;
|
|
81
|
+
columnPinningFeature: import("@tanstack/react-table").TableFeature;
|
|
82
|
+
columnSizingFeature: import("@tanstack/react-table").TableFeature;
|
|
83
|
+
columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
|
|
84
|
+
globalFilteringFeature: import("@tanstack/react-table").TableFeature;
|
|
85
|
+
rowAggregationFeature: import("@tanstack/react-table").TableFeature;
|
|
86
|
+
rowExpandingFeature: import("@tanstack/react-table").TableFeature;
|
|
87
|
+
rowPaginationFeature: import("@tanstack/react-table").TableFeature;
|
|
88
|
+
rowPinningFeature: import("@tanstack/react-table").TableFeature;
|
|
89
|
+
rowSelectionFeature: import("@tanstack/react-table").TableFeature;
|
|
90
|
+
rowSortingFeature: import("@tanstack/react-table").TableFeature;
|
|
91
|
+
expandedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
92
|
+
facetedMinMaxValues: (table: import("@tanstack/react-table").Table<import("@tanstack/react-table").TableFeatures, any>, columnId: string) => () => undefined | [number, number];
|
|
93
|
+
facetedRowModel: (table: import("@tanstack/react-table").Table<any, any>, columnId: string) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
94
|
+
facetedUniqueValues: (table: import("@tanstack/react-table").Table<import("@tanstack/react-table").TableFeatures, any>, columnId: string) => () => Map<any, number>;
|
|
95
|
+
filteredRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
96
|
+
groupedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
97
|
+
paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
98
|
+
sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
99
|
+
aggregationFns: {
|
|
100
|
+
count: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, number>;
|
|
101
|
+
extent: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, [(number | Date) | undefined, (number | Date) | undefined]>;
|
|
102
|
+
first: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, unknown>;
|
|
103
|
+
last: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, unknown>;
|
|
104
|
+
max: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, (number | Date) | undefined>;
|
|
105
|
+
mean: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, number | undefined>;
|
|
106
|
+
median: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, number | undefined>;
|
|
107
|
+
min: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, (number | Date) | undefined>;
|
|
108
|
+
sum: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, number>;
|
|
109
|
+
unique: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, unknown[]>;
|
|
110
|
+
uniqueCount: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, number>;
|
|
111
|
+
};
|
|
112
|
+
filterFns: {
|
|
113
|
+
"ledger-date-range": FilterFn<any, any>;
|
|
114
|
+
"ledger-one-of": FilterFn<any, any>;
|
|
115
|
+
arrHas: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
116
|
+
arrIncludes: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
117
|
+
arrIncludesAll: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
118
|
+
arrIncludesSome: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
119
|
+
between: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
120
|
+
betweenInclusive: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
121
|
+
empty: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
122
|
+
endsWith: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
123
|
+
equals: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
124
|
+
equalsString: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
125
|
+
equalsStringSensitive: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
126
|
+
greaterThan: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
127
|
+
greaterThanOrEqualTo: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
128
|
+
inDateRange: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
129
|
+
inNumberRange: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
130
|
+
includesString: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
131
|
+
includesStringSensitive: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
132
|
+
lessThan: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
133
|
+
lessThanOrEqualTo: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
134
|
+
notEmpty: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
135
|
+
startsWith: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
136
|
+
weakEquals: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
137
|
+
};
|
|
138
|
+
sortFns: {
|
|
139
|
+
alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
140
|
+
alphanumericCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
141
|
+
basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
142
|
+
datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
143
|
+
text: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
144
|
+
textCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
145
|
+
};
|
|
146
|
+
};
|
|
147
|
+
type LedgerFeatures = typeof ledgerFeatures;
|
|
148
|
+
/**
|
|
149
|
+
* TanStack's column helper, pre-bound to the canonical feature set — consumers keep the v8
|
|
150
|
+
* calling shape (`createColumnHelper<Person>()`), never managing `TFeatures` themselves.
|
|
151
|
+
*/
|
|
152
|
+
declare function createColumnHelper<TData extends RowData$1>(): import("@tanstack/react-table").ColumnHelper<{
|
|
153
|
+
cellSpanningFeature: import("@tanstack/react-table").TableFeature;
|
|
154
|
+
columnFacetingFeature: import("@tanstack/react-table").TableFeature;
|
|
155
|
+
columnFilteringFeature: import("@tanstack/react-table").TableFeature;
|
|
156
|
+
columnGroupingFeature: import("@tanstack/react-table").TableFeature;
|
|
157
|
+
columnOrderingFeature: import("@tanstack/react-table").TableFeature;
|
|
158
|
+
columnPinningFeature: import("@tanstack/react-table").TableFeature;
|
|
159
|
+
columnSizingFeature: import("@tanstack/react-table").TableFeature;
|
|
160
|
+
columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
|
|
161
|
+
globalFilteringFeature: import("@tanstack/react-table").TableFeature;
|
|
162
|
+
rowAggregationFeature: import("@tanstack/react-table").TableFeature;
|
|
163
|
+
rowExpandingFeature: import("@tanstack/react-table").TableFeature;
|
|
164
|
+
rowPaginationFeature: import("@tanstack/react-table").TableFeature;
|
|
165
|
+
rowPinningFeature: import("@tanstack/react-table").TableFeature;
|
|
166
|
+
rowSelectionFeature: import("@tanstack/react-table").TableFeature;
|
|
167
|
+
rowSortingFeature: import("@tanstack/react-table").TableFeature;
|
|
168
|
+
expandedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
169
|
+
facetedMinMaxValues: (table: import("@tanstack/react-table").Table<import("@tanstack/react-table").TableFeatures, any>, columnId: string) => () => undefined | [number, number];
|
|
170
|
+
facetedRowModel: (table: import("@tanstack/react-table").Table<any, any>, columnId: string) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
171
|
+
facetedUniqueValues: (table: import("@tanstack/react-table").Table<import("@tanstack/react-table").TableFeatures, any>, columnId: string) => () => Map<any, number>;
|
|
172
|
+
filteredRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
173
|
+
groupedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
174
|
+
paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
175
|
+
sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
176
|
+
aggregationFns: {
|
|
177
|
+
count: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, number>;
|
|
178
|
+
extent: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, [(number | Date) | undefined, (number | Date) | undefined]>;
|
|
179
|
+
first: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, unknown>;
|
|
180
|
+
last: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, unknown>;
|
|
181
|
+
max: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, (number | Date) | undefined>;
|
|
182
|
+
mean: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, number | undefined>;
|
|
183
|
+
median: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, number | undefined>;
|
|
184
|
+
min: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, (number | Date) | undefined>;
|
|
185
|
+
sum: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, number>;
|
|
186
|
+
unique: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, unknown[]>;
|
|
187
|
+
uniqueCount: import("@tanstack/react-table").AggregationFnDef<any, any, unknown, number>;
|
|
188
|
+
};
|
|
189
|
+
filterFns: {
|
|
190
|
+
"ledger-date-range": FilterFn<any, any>;
|
|
191
|
+
"ledger-one-of": FilterFn<any, any>;
|
|
192
|
+
arrHas: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
193
|
+
arrIncludes: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
194
|
+
arrIncludesAll: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
195
|
+
arrIncludesSome: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
196
|
+
between: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
197
|
+
betweenInclusive: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
198
|
+
empty: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
199
|
+
endsWith: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
200
|
+
equals: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
201
|
+
equalsString: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
202
|
+
equalsStringSensitive: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
203
|
+
greaterThan: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
204
|
+
greaterThanOrEqualTo: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
205
|
+
inDateRange: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
206
|
+
inNumberRange: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
207
|
+
includesString: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
208
|
+
includesStringSensitive: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
209
|
+
lessThan: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
210
|
+
lessThanOrEqualTo: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
211
|
+
notEmpty: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
212
|
+
startsWith: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
213
|
+
weakEquals: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
214
|
+
};
|
|
215
|
+
sortFns: {
|
|
216
|
+
alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
217
|
+
alphanumericCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
218
|
+
basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
219
|
+
datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
220
|
+
text: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
221
|
+
textCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
222
|
+
};
|
|
223
|
+
}, TData>;
|
|
224
|
+
//#endregion
|
|
225
|
+
//#region src/types.d.ts
|
|
226
|
+
/**
|
|
227
|
+
* TanStack's table instance (the enriched React shape: `state`, `Subscribe`, `FlexRender`),
|
|
228
|
+
* feature-bound and renamed so it never collides with Mantine's `Table` in consumer imports.
|
|
229
|
+
*/
|
|
230
|
+
type TableInstance<TData extends RowData$1> = ReactTable<LedgerFeatures, TData>;
|
|
231
|
+
type ColumnDef<TData extends RowData$1, TValue extends CellData = CellData> = ColumnDef$1<LedgerFeatures, TData, TValue> & {
|
|
232
|
+
enableResizing?: boolean;
|
|
233
|
+
};
|
|
234
|
+
type Column<TData extends RowData$1, TValue extends CellData = CellData> = Column$1<LedgerFeatures, TData, TValue>;
|
|
235
|
+
type Row<TData extends RowData$1> = Row$1<LedgerFeatures, TData>;
|
|
236
|
+
type Cell<TData extends RowData$1, TValue extends CellData = CellData> = Cell$1<LedgerFeatures, TData, TValue>;
|
|
237
|
+
/**
|
|
238
|
+
* The subject of `meta.headerCellProps` / `meta.footerCellProps`, so it is re-exported too.
|
|
239
|
+
*/
|
|
240
|
+
type Header<TData extends RowData$1, TValue extends CellData = CellData> = Header$1<LedgerFeatures, TData, TValue>;
|
|
241
|
+
type HeaderGroup<TData extends RowData$1> = HeaderGroup$1<LedgerFeatures, TData>;
|
|
242
|
+
type DataTableFilterVariant = "text" | "select" | "multi-select" | "range" | "date-range";
|
|
243
|
+
/**
|
|
244
|
+
* Per-variant configuration, discriminated by `variant`: each member carries exactly the keys its
|
|
245
|
+
* control reads. A union rather than one optional-everything object because the alternative type-
|
|
246
|
+
* checks configurations the renderer then ignores — `{ variant: "text", options }` has nowhere to
|
|
247
|
+
* put the options, and `{ variant: "range", placeholder }` no input to put one on (the bounds
|
|
248
|
+
* carry `filterRangeMin` / `filterRangeMax` instead).
|
|
249
|
+
*/
|
|
250
|
+
type DataTableFilterConfig = {
|
|
251
|
+
variant: "text";
|
|
252
|
+
placeholder?: string;
|
|
253
|
+
} | {
|
|
254
|
+
variant: "select" | "multi-select";
|
|
255
|
+
/**
|
|
256
|
+
* Omitted in client mode → derived from faceted values; server mode requires it.
|
|
257
|
+
*/
|
|
258
|
+
options?: ComboboxData;
|
|
259
|
+
placeholder?: string;
|
|
260
|
+
} | {
|
|
261
|
+
variant: "range" | "date-range";
|
|
262
|
+
};
|
|
263
|
+
/**
|
|
264
|
+
* Renders a session editor into an editing cell. The host owns the session around it — the
|
|
265
|
+
* draft, the keyboard map, blur commit, pending state, and the whole lifecycle — the renderer
|
|
266
|
+
* only supplies the control (docs/editing.md#editors). The shipped `textEditor` / `numberEditor`
|
|
267
|
+
* / `selectEditor` helpers are renderers of exactly this shape.
|
|
268
|
+
*/
|
|
269
|
+
type DataTableEditRenderer<TData extends RowData$1, TValue> = (ctx: DataTableEditContext<TData, TValue>) => ReactNode;
|
|
270
|
+
/**
|
|
271
|
+
* Renders an instant-apply control living in the cell itself — no session and no trigger: each
|
|
272
|
+
* change the control reports through `ctx.commit(value)` is one commit
|
|
273
|
+
* (docs/editing.md#instant-editing). The shipped `checkboxEditor` helper is one of these.
|
|
274
|
+
*/
|
|
275
|
+
type DataTableInstantEditRenderer<TData extends RowData$1, TValue> = (ctx: DataTableInstantEditContext<TData, TValue>) => ReactNode;
|
|
276
|
+
interface DataTableEditConfigBase<TData extends RowData$1, TValue> {
|
|
277
|
+
/**
|
|
278
|
+
* Per-row gate on top of the table-level `enableEditing`.
|
|
279
|
+
*/
|
|
280
|
+
enabled?: (row: Row<TData>) => boolean;
|
|
281
|
+
/**
|
|
282
|
+
* A non-null message blocks the commit and is shown on the editor.
|
|
283
|
+
*/
|
|
284
|
+
validate?: (value: TValue, row: Row<TData>) => string | null;
|
|
285
|
+
}
|
|
286
|
+
/**
|
|
287
|
+
* A session editor with its gates. The bare renderer form is this config with neither gate.
|
|
288
|
+
*/
|
|
289
|
+
interface DataTableEditConfig<TData extends RowData$1, TValue> extends DataTableEditConfigBase<TData, TValue> {
|
|
290
|
+
render: DataTableEditRenderer<TData, TValue>;
|
|
291
|
+
}
|
|
292
|
+
/**
|
|
293
|
+
* An instant-apply control with its gates. Discriminated from the session config by its key:
|
|
294
|
+
* `instant` and `render` carry different contexts, so which one a column declares is which
|
|
295
|
+
* interaction model its cells get.
|
|
296
|
+
*/
|
|
297
|
+
interface DataTableInstantEditConfig<TData extends RowData$1, TValue> extends DataTableEditConfigBase<TData, TValue> {
|
|
298
|
+
instant: DataTableInstantEditRenderer<TData, TValue>;
|
|
299
|
+
}
|
|
300
|
+
interface DataTableEditContext<TData extends RowData$1, TValue> {
|
|
301
|
+
row: Row<TData>;
|
|
302
|
+
column: Column<TData, TValue>;
|
|
303
|
+
value: TValue;
|
|
304
|
+
setValue: (value: TValue) => void;
|
|
305
|
+
/**
|
|
306
|
+
* Returns whether validation and the application commit succeeded. Async commits resolve to
|
|
307
|
+
* the same result; rejection is presented as an editor error rather than rethrown. In row
|
|
308
|
+
* mode, `commit` and `cancel` operate on the whole row, matching the keyboard map.
|
|
309
|
+
*/
|
|
310
|
+
commit: () => boolean | Promise<boolean>;
|
|
311
|
+
cancel: () => void;
|
|
312
|
+
error: string | null;
|
|
313
|
+
/**
|
|
314
|
+
* A write for this editor is still out — the cell's in cell mode, the whole row's in row mode.
|
|
315
|
+
* The host cannot know what to disable, so the renderer reads the flag and decides for itself
|
|
316
|
+
* (docs/editing.md#editors).
|
|
317
|
+
*/
|
|
318
|
+
pending: boolean;
|
|
319
|
+
/**
|
|
320
|
+
* Which session hosts the editor. A renderer may adapt — the select helper opens its dropdown
|
|
321
|
+
* immediately and commits on pick only in cell mode, where one cell is the whole session.
|
|
322
|
+
*/
|
|
323
|
+
mode: DataTableEditMode;
|
|
324
|
+
/**
|
|
325
|
+
* Whether this editor should take focus as it mounts: always in cell mode; in row mode only
|
|
326
|
+
* the column the session was started from.
|
|
327
|
+
*/
|
|
328
|
+
autoFocus: boolean;
|
|
329
|
+
/**
|
|
330
|
+
* Localized accessible name for the control (`labels.editColumn` over the column title) — an
|
|
331
|
+
* editor is one of many identical controls in the grid, told apart by the column it edits.
|
|
332
|
+
*/
|
|
333
|
+
label: string;
|
|
334
|
+
}
|
|
335
|
+
interface DataTableInstantEditContext<TData extends RowData$1, TValue> {
|
|
336
|
+
row: Row<TData>;
|
|
337
|
+
column: Column<TData, TValue>;
|
|
338
|
+
/**
|
|
339
|
+
* The value the cell holds as far as the application knows: the value this cell has already
|
|
340
|
+
* written while the data has not caught up with it, else the data's own.
|
|
341
|
+
*/
|
|
342
|
+
value: TValue;
|
|
343
|
+
/**
|
|
344
|
+
* Commits `value` in one act — validation, the application handler, pending, and failure
|
|
345
|
+
* presentation all run exactly as a session commit's would. In row mode the control joins the
|
|
346
|
+
* row like any other editor: the call stages the value in the row draft, and the atomic row
|
|
347
|
+
* commit owns the write.
|
|
348
|
+
*/
|
|
349
|
+
commit: (value: TValue) => boolean | Promise<boolean>;
|
|
350
|
+
/**
|
|
351
|
+
* This cell's own write is still out; the control should disable itself so a second change
|
|
352
|
+
* cannot race the first.
|
|
353
|
+
*/
|
|
354
|
+
pending: boolean;
|
|
355
|
+
error: string | null;
|
|
356
|
+
/**
|
|
357
|
+
* Localized accessible name for the control (`labels.editColumn` over the column title).
|
|
358
|
+
*/
|
|
359
|
+
label: string;
|
|
360
|
+
}
|
|
361
|
+
interface DataTableEditCommit<TData extends RowData$1> {
|
|
362
|
+
row: Row<TData>;
|
|
363
|
+
column: Column<TData, unknown>;
|
|
364
|
+
value: unknown;
|
|
365
|
+
previousValue: unknown;
|
|
366
|
+
}
|
|
367
|
+
interface DataTableEditingCell {
|
|
368
|
+
rowId: string;
|
|
369
|
+
columnId: string;
|
|
370
|
+
}
|
|
371
|
+
/**
|
|
372
|
+
* A completed row drag (docs/rows.md#row-ordering). Indexes address the `data` array — row
|
|
373
|
+
* order is data order — with `arrayMove` semantics: remove the row at `fromIndex`, insert it
|
|
374
|
+
* at `toIndex`.
|
|
375
|
+
*/
|
|
376
|
+
interface DataTableRowReorder<TData extends RowData$1> {
|
|
377
|
+
row: Row<TData>;
|
|
378
|
+
fromIndex: number;
|
|
379
|
+
toIndex: number;
|
|
380
|
+
}
|
|
381
|
+
type DataTableEditTrigger = "double-click" | "click";
|
|
382
|
+
/**
|
|
383
|
+
* `"cell"` (default) edits one cell at a time, committing per cell; `"row"` opens every
|
|
384
|
+
* editable cell of a row at once and commits the row atomically (docs/editing.md#row-mode).
|
|
385
|
+
*/
|
|
386
|
+
type DataTableEditMode = "cell" | "row";
|
|
387
|
+
interface DataTableRowEditCommit<TData extends RowData$1> {
|
|
388
|
+
row: Row<TData>;
|
|
389
|
+
/**
|
|
390
|
+
* Current values for every editable column of the row, keyed by column id — drafts where the
|
|
391
|
+
* user typed, unchanged accessor values elsewhere.
|
|
392
|
+
*/
|
|
393
|
+
values: Record<string, unknown>;
|
|
394
|
+
previousValues: Record<string, unknown>;
|
|
395
|
+
}
|
|
396
|
+
interface DataTableExportMeta<TData extends RowData$1> {
|
|
397
|
+
/**
|
|
398
|
+
* Column title in the exported header line; defaults to the string `header` (or the id).
|
|
399
|
+
*/
|
|
400
|
+
header?: string;
|
|
401
|
+
/**
|
|
402
|
+
* Cell value for the export; defaults to the accessor value. Runs before serialization, so
|
|
403
|
+
* anything `toCsv` can serialize (string, number, Date, object) is a valid return.
|
|
404
|
+
*/
|
|
405
|
+
value?: (row: Row<TData>) => unknown;
|
|
406
|
+
}
|
|
407
|
+
type DataTablePersistableSlice = "sorting" | "columnFilters" | "globalFilter" | "pagination" | "columnVisibility" | "columnPinning" | "columnOrder" | "columnSizing" | "grouping";
|
|
408
|
+
interface DataTablePersistState {
|
|
409
|
+
/**
|
|
410
|
+
* Storage key; one table per key.
|
|
411
|
+
*/
|
|
412
|
+
key: string;
|
|
413
|
+
/**
|
|
414
|
+
* Which slices persist; defaults to the layout set: sizing, visibility, order, pinning.
|
|
415
|
+
*/
|
|
416
|
+
slices?: DataTablePersistableSlice[];
|
|
417
|
+
/**
|
|
418
|
+
* Storage backend; defaults to `localStorage` (guarded — persistence is a no-op without it).
|
|
419
|
+
*/
|
|
420
|
+
storage?: Pick<Storage, "getItem" | "setItem" | "removeItem">;
|
|
421
|
+
}
|
|
422
|
+
interface UseDataTableOptions<TData extends RowData$1> {
|
|
423
|
+
data: TData[];
|
|
424
|
+
columns: Array<ColumnDef<TData, any>>;
|
|
425
|
+
getRowId?: (originalRow: TData, index: number, parent?: Row<TData>) => string;
|
|
426
|
+
enableSorting?: boolean;
|
|
427
|
+
enableMultiSort?: boolean;
|
|
428
|
+
enableSortingRemoval?: boolean;
|
|
429
|
+
enableColumnFilters?: boolean;
|
|
430
|
+
enableGlobalFilter?: boolean;
|
|
431
|
+
enablePagination?: boolean;
|
|
432
|
+
enableRowSelection?: boolean | ((row: Row<TData>) => boolean);
|
|
433
|
+
enableMultiRowSelection?: boolean;
|
|
434
|
+
/**
|
|
435
|
+
* Ledger-owned switch (TanStack's name): the resize interaction is ledger's own pointer
|
|
436
|
+
* session, so no TanStack option backs it (docs/sizing.md).
|
|
437
|
+
*/
|
|
438
|
+
enableColumnResizing?: boolean;
|
|
439
|
+
enableColumnPinning?: boolean;
|
|
440
|
+
enableColumnOrdering?: boolean;
|
|
441
|
+
enableHiding?: boolean;
|
|
442
|
+
enableEditing?: boolean;
|
|
443
|
+
enableGrouping?: boolean;
|
|
444
|
+
enableRowPinning?: boolean;
|
|
445
|
+
/**
|
|
446
|
+
* Cells may merge via the defs' `spanRows` / `spanColumns` (TanStack v9
|
|
447
|
+
* `cellSpanningFeature`). On by default; spanning is ignored while `virtualizedRows` (a
|
|
448
|
+
* merged cell breaks the one-`<tr>`-per-virtual-item invariant) or `virtualizedColumns` (it
|
|
449
|
+
* would reach across the windowed colgroup).
|
|
450
|
+
*/
|
|
451
|
+
enableCellSpanning?: boolean;
|
|
452
|
+
getSubRows?: (originalRow: TData) => TData[] | undefined;
|
|
453
|
+
renderDetailPanel?: (row: Row<TData>) => ReactNode;
|
|
454
|
+
/**
|
|
455
|
+
* Overrides the injected selection column: its `cell` / `header` renderers, `size`, alignment,
|
|
456
|
+
* anything a `ColumnDef` carries. The reserved `id` is not overridable — it is how ledger
|
|
457
|
+
* recognizes its own column.
|
|
458
|
+
*/
|
|
459
|
+
selectionColumn?: Partial<ColumnDef<TData, unknown>>;
|
|
460
|
+
/**
|
|
461
|
+
* Overrides the injected expander column, on the same terms as `selectionColumn`.
|
|
462
|
+
*/
|
|
463
|
+
expanderColumn?: Partial<ColumnDef<TData, unknown>>;
|
|
464
|
+
sortingMode?: "client" | "server";
|
|
465
|
+
filterMode?: "client" | "server";
|
|
466
|
+
paginationMode?: "client" | "server";
|
|
467
|
+
/**
|
|
468
|
+
* Server-mode total row count; `pageCount` is derived internally.
|
|
469
|
+
*/
|
|
470
|
+
rowCount?: number;
|
|
471
|
+
editTrigger?: DataTableEditTrigger;
|
|
472
|
+
editMode?: DataTableEditMode;
|
|
473
|
+
onEditCommit?: (change: DataTableEditCommit<TData>) => void | Promise<void>;
|
|
474
|
+
/**
|
|
475
|
+
* Row-mode atomic commit: every editable column's value, changed or not. Only consulted
|
|
476
|
+
* while `editMode: "row"`.
|
|
477
|
+
*/
|
|
478
|
+
onRowEditCommit?: (change: DataTableRowEditCommit<TData>) => void | Promise<void>;
|
|
479
|
+
/**
|
|
480
|
+
* A single keyboard-reachable current row (row click or ↑/↓/Home/End on the focused body;
|
|
481
|
+
* Enter fires `onRowClick`), independent from checkbox selection. Off by default.
|
|
482
|
+
*/
|
|
483
|
+
enableActiveRow?: boolean;
|
|
484
|
+
/**
|
|
485
|
+
* Drag-and-drop row reordering through an injected handle column. Row order IS data order —
|
|
486
|
+
* there is no order state — so a completed drag hands the move to `onRowReorder` and the
|
|
487
|
+
* application reorders `data`. Handles disable while sorting, a filter, a search or grouping
|
|
488
|
+
* controls the visible order; flat data only (`getSubRows` is not supported). Off by default.
|
|
489
|
+
*/
|
|
490
|
+
enableRowOrdering?: boolean;
|
|
491
|
+
/**
|
|
492
|
+
* A completed drag: apply the move to `data` (`arrayMove` semantics, `fromIndex` → `toIndex`).
|
|
493
|
+
* Without this handler the switch is inert and no handle column is injected.
|
|
494
|
+
*/
|
|
495
|
+
onRowReorder?: (reorder: DataTableRowReorder<TData>) => void;
|
|
496
|
+
/**
|
|
497
|
+
* Overrides the injected drag-handle column, on the same terms as `selectionColumn`.
|
|
498
|
+
*/
|
|
499
|
+
rowDragColumn?: Partial<ColumnDef<TData, unknown>>;
|
|
500
|
+
sorting?: SortingState$1;
|
|
501
|
+
defaultSorting?: SortingState$1;
|
|
502
|
+
onSortingChange?: (value: SortingState$1) => void;
|
|
503
|
+
columnFilters?: ColumnFiltersState$1;
|
|
504
|
+
defaultColumnFilters?: ColumnFiltersState$1;
|
|
505
|
+
onColumnFiltersChange?: (value: ColumnFiltersState$1) => void;
|
|
506
|
+
globalFilter?: string;
|
|
507
|
+
defaultGlobalFilter?: string;
|
|
508
|
+
onGlobalFilterChange?: (value: string) => void;
|
|
509
|
+
pagination?: PaginationState$1;
|
|
510
|
+
defaultPagination?: PaginationState$1;
|
|
511
|
+
onPaginationChange?: (value: PaginationState$1) => void;
|
|
512
|
+
rowSelection?: RowSelectionState$1;
|
|
513
|
+
defaultRowSelection?: RowSelectionState$1;
|
|
514
|
+
onRowSelectionChange?: (value: RowSelectionState$1) => void;
|
|
515
|
+
expanded?: ExpandedState$1;
|
|
516
|
+
defaultExpanded?: ExpandedState$1;
|
|
517
|
+
onExpandedChange?: (value: ExpandedState$1) => void;
|
|
518
|
+
columnVisibility?: ColumnVisibilityState$1;
|
|
519
|
+
defaultColumnVisibility?: ColumnVisibilityState$1;
|
|
520
|
+
onColumnVisibilityChange?: (value: ColumnVisibilityState$1) => void;
|
|
521
|
+
columnPinning?: ColumnPinningState$1;
|
|
522
|
+
defaultColumnPinning?: ColumnPinningState$1;
|
|
523
|
+
onColumnPinningChange?: (value: ColumnPinningState$1) => void;
|
|
524
|
+
columnOrder?: ColumnOrderState$1;
|
|
525
|
+
defaultColumnOrder?: ColumnOrderState$1;
|
|
526
|
+
onColumnOrderChange?: (value: ColumnOrderState$1) => void;
|
|
527
|
+
columnSizing?: ColumnSizingState$1;
|
|
528
|
+
defaultColumnSizing?: ColumnSizingState$1;
|
|
529
|
+
onColumnSizingChange?: (value: ColumnSizingState$1) => void;
|
|
530
|
+
grouping?: GroupingState$1;
|
|
531
|
+
defaultGrouping?: GroupingState$1;
|
|
532
|
+
onGroupingChange?: (value: GroupingState$1) => void;
|
|
533
|
+
rowPinning?: RowPinningState$1;
|
|
534
|
+
defaultRowPinning?: RowPinningState$1;
|
|
535
|
+
onRowPinningChange?: (value: RowPinningState$1) => void;
|
|
536
|
+
/**
|
|
537
|
+
* Non-TanStack slice (like editing); the value is the active row's id.
|
|
538
|
+
*/
|
|
539
|
+
activeRowId?: string | null;
|
|
540
|
+
defaultActiveRowId?: string | null;
|
|
541
|
+
onActiveRowIdChange?: (value: string | null) => void;
|
|
542
|
+
/**
|
|
543
|
+
* Non-TanStack slice; editing has no meaningful default.
|
|
544
|
+
*/
|
|
545
|
+
editingCell?: DataTableEditingCell | null;
|
|
546
|
+
onEditingCellChange?: (value: DataTableEditingCell | null) => void;
|
|
547
|
+
/**
|
|
548
|
+
* Row-mode counterpart of `editingCell` (the editing row's id).
|
|
549
|
+
*/
|
|
550
|
+
editingRowId?: string | null;
|
|
551
|
+
onEditingRowIdChange?: (value: string | null) => void;
|
|
552
|
+
persistState?: DataTablePersistState;
|
|
553
|
+
defaultColumn?: Partial<ColumnDef<TData, unknown>>;
|
|
554
|
+
/**
|
|
555
|
+
* Custom filter functions, registered by id on the table's feature set so their names are
|
|
556
|
+
* valid `filterFn` / `globalFilterFn` strings (TanStack v9 registry slots). Merged over the
|
|
557
|
+
* built-ins; ledger's two reserved ids win with a dev warning. Read once at mount — the
|
|
558
|
+
* registry wires code, not reactive state.
|
|
559
|
+
*/
|
|
560
|
+
filterFns?: Record<string, FilterFn<any, any>>;
|
|
561
|
+
/**
|
|
562
|
+
* Full escape hatch, merged first; ledger-managed keys override with a dev warning (docs/state.md).
|
|
563
|
+
* `globalFilterFn` additionally accepts any string so ids registered through `filterFns`
|
|
564
|
+
* stay usable without a cast — unregistered ids fail at runtime with TanStack's dev warning.
|
|
565
|
+
*/
|
|
566
|
+
tableOptions?: Omit<Partial<TableOptions<LedgerFeatures, TData>>, "globalFilterFn"> & {
|
|
567
|
+
globalFilterFn?: FilterFnOption<LedgerFeatures, TData> | (string & {});
|
|
568
|
+
};
|
|
569
|
+
}
|
|
570
|
+
interface DataTableScrollOptions {
|
|
571
|
+
align?: "start" | "center" | "end" | "auto";
|
|
572
|
+
behavior?: "auto" | "smooth";
|
|
573
|
+
}
|
|
574
|
+
interface DataTableHandle<TData extends RowData$1> {
|
|
575
|
+
table: TableInstance<TData>;
|
|
576
|
+
/**
|
|
577
|
+
* The ScrollArea viewport element.
|
|
578
|
+
*/
|
|
579
|
+
viewport: HTMLDivElement | null;
|
|
580
|
+
/**
|
|
581
|
+
* Scrolls the row with this id into view. Separate from `scrollToIndex` rather than one
|
|
582
|
+
* parameter accepting both: `getRowId` may well return digits, and a table whose ids read
|
|
583
|
+
* `"5"` could not say which of the two it meant.
|
|
584
|
+
*/
|
|
585
|
+
scrollToRow: (rowId: string, options?: DataTableScrollOptions) => void;
|
|
586
|
+
/**
|
|
587
|
+
* Scrolls the row at this position in the page's own row model into view.
|
|
588
|
+
*/
|
|
589
|
+
scrollToIndex: (index: number, options?: DataTableScrollOptions) => void;
|
|
590
|
+
/**
|
|
591
|
+
* Scrolls the column with this id into view — width-engine math, so a column a virtual
|
|
592
|
+
* window is not rendering is still reachable. Pinned columns are already in view; a no-op.
|
|
593
|
+
*/
|
|
594
|
+
scrollToColumn: (columnId: string, options?: DataTableScrollOptions) => void;
|
|
595
|
+
/**
|
|
596
|
+
* Cell mode requires `columnId`; row mode takes the id of any editable column to focus, or
|
|
597
|
+
* none.
|
|
598
|
+
*/
|
|
599
|
+
startEditing: (rowId: string, columnId?: string) => void;
|
|
600
|
+
stopEditing: (options?: {
|
|
601
|
+
commit?: boolean;
|
|
602
|
+
}) => void;
|
|
603
|
+
}
|
|
604
|
+
/**
|
|
605
|
+
* What a mounted cell-mode editor hands the controller. Only what is genuinely per-instance: the
|
|
606
|
+
* editor holds no state of its own, so everything it shows it reads back from the session.
|
|
607
|
+
*/
|
|
608
|
+
interface LedgerCellEditor {
|
|
609
|
+
/**
|
|
610
|
+
* Something the editor shows has changed in the session — draw again.
|
|
611
|
+
*/
|
|
612
|
+
redraw: () => void;
|
|
613
|
+
}
|
|
614
|
+
/**
|
|
615
|
+
* What a mounted row-mode editor hands the controller. Only what is genuinely per-instance: the
|
|
616
|
+
* editor holds no state of its own, so everything else it shows it reads back from the session.
|
|
617
|
+
*/
|
|
618
|
+
interface LedgerRowEditor {
|
|
619
|
+
focus: () => void;
|
|
620
|
+
/**
|
|
621
|
+
* Something the editor shows has changed in the session — draw again.
|
|
622
|
+
*/
|
|
623
|
+
redraw: () => void;
|
|
624
|
+
}
|
|
625
|
+
interface LedgerRowEditingController {
|
|
626
|
+
id: string | null;
|
|
627
|
+
/**
|
|
628
|
+
* Whether this row has a live editing session. The slice naming a row is not enough — its gate
|
|
629
|
+
* may have shut while the application declined to close it — and the render layer asks this
|
|
630
|
+
* before putting an interactive editor on screen.
|
|
631
|
+
*/
|
|
632
|
+
active: (rowId: string) => boolean;
|
|
633
|
+
/**
|
|
634
|
+
* Starts editing the row; an already-editing other row is committed first (commit, never
|
|
635
|
+
* discard), and the start only proceeds if that commit succeeds. `focusColumnId` marks
|
|
636
|
+
* which cell's editor autofocuses.
|
|
637
|
+
*/
|
|
638
|
+
start: (rowId: string, options?: {
|
|
639
|
+
focusColumnId?: string;
|
|
640
|
+
}) => void;
|
|
641
|
+
/**
|
|
642
|
+
* Commits (default) or cancels the whole row atomically. Imperative: use `commit` when the
|
|
643
|
+
* answer matters.
|
|
644
|
+
*/
|
|
645
|
+
stop: (options?: {
|
|
646
|
+
commit?: boolean;
|
|
647
|
+
}) => void;
|
|
648
|
+
/**
|
|
649
|
+
* Commits the whole row and reports whether it went through — validation and the application's
|
|
650
|
+
* handler both. What an editor renderer's `commit` returns (docs/editing.md#editors).
|
|
651
|
+
*/
|
|
652
|
+
commit: () => boolean | Promise<boolean>;
|
|
653
|
+
/**
|
|
654
|
+
* Whether this column's editor should autofocus for the current session.
|
|
655
|
+
*/
|
|
656
|
+
shouldFocus: (columnId: string) => boolean;
|
|
657
|
+
/**
|
|
658
|
+
* The row's editing store. It outlives editor unmounts, so a virtualized editing row that
|
|
659
|
+
* scrolls out and back keeps what was typed into it, and it is addressed by row: an editor
|
|
660
|
+
* names the row it belongs to rather than trusting the controller's idea of which row is
|
|
661
|
+
* current, so two rows' editors mounted at once during a switch cannot read each other's
|
|
662
|
+
* values.
|
|
663
|
+
*/
|
|
664
|
+
drafts: {
|
|
665
|
+
/**
|
|
666
|
+
* Whether a write for this row is still out. Editors disable themselves on it.
|
|
667
|
+
*/
|
|
668
|
+
pending: (rowId: string) => boolean;
|
|
669
|
+
/**
|
|
670
|
+
* The message this column is carrying, if any: a `validate` rejection on that column, or a
|
|
671
|
+
* row-level failure, which lands on the row's first editable column.
|
|
672
|
+
*/
|
|
673
|
+
error: (rowId: string, columnId: string) => string | null;
|
|
674
|
+
/**
|
|
675
|
+
* What the editor should show: the pending value if there is one, else what this session has
|
|
676
|
+
* already written, else `source` — the cell's own value, supplied by the render doing the
|
|
677
|
+
* drawing. That render is the authority on what it is drawing; the event-time paths resolve
|
|
678
|
+
* their own values from the committed snapshot instead (docs/architecture.md).
|
|
679
|
+
*/
|
|
680
|
+
read: (rowId: string, columnId: string, source: unknown) => unknown;
|
|
681
|
+
write: (rowId: string, columnId: string, value: unknown) => void;
|
|
682
|
+
};
|
|
683
|
+
register: (columnId: string, editor: LedgerRowEditor) => () => void;
|
|
684
|
+
}
|
|
685
|
+
interface LedgerEditingController {
|
|
686
|
+
mode: DataTableEditMode;
|
|
687
|
+
cell: DataTableEditingCell | null;
|
|
688
|
+
/**
|
|
689
|
+
* Whether this cell has a live editing session. The slice naming a cell is not enough — its
|
|
690
|
+
* gate may have shut while the application declined to close it — and the render layer asks
|
|
691
|
+
* this before putting an interactive editor on screen.
|
|
692
|
+
*/
|
|
693
|
+
active: (rowId: string, columnId: string) => boolean;
|
|
694
|
+
start: (cell: DataTableEditingCell) => void;
|
|
695
|
+
/**
|
|
696
|
+
* Commits (default) or discards what the session holds. A successful commit asks for the slice
|
|
697
|
+
* to close; a failure keeps the session. Imperative — use `commit` when the answer matters.
|
|
698
|
+
*/
|
|
699
|
+
stop: (options?: {
|
|
700
|
+
commit?: boolean;
|
|
701
|
+
}) => void;
|
|
702
|
+
/**
|
|
703
|
+
* Clears the slice directly.
|
|
704
|
+
*/
|
|
705
|
+
clear: () => void;
|
|
706
|
+
/**
|
|
707
|
+
* Commits or discards what the session holds. The editors call these for Enter and Escape; the
|
|
708
|
+
* logic itself belongs to the session, because an editor can be unmounted at any moment.
|
|
709
|
+
*/
|
|
710
|
+
commit: () => boolean | Promise<boolean>;
|
|
711
|
+
cancel: () => void;
|
|
712
|
+
/**
|
|
713
|
+
* Commits and moves to the row's next (or previous) editable cell — Tab and Shift+Tab. The
|
|
714
|
+
* session answers it, because where the caret goes next depends on the row as the render that
|
|
715
|
+
* reached the screen had it, and an editor could only ask the shared core.
|
|
716
|
+
*/
|
|
717
|
+
moveTo: (backwards: boolean) => void;
|
|
718
|
+
/**
|
|
719
|
+
* The cell session's editing store, addressed by cell for the same reason row mode's is
|
|
720
|
+
* addressed by row: two editors for one cell can exist at once while React reconciles a
|
|
721
|
+
* remount, and a settled write must not act on the instance that replaced the one that sent it.
|
|
722
|
+
*/
|
|
723
|
+
drafts: {
|
|
724
|
+
pending: (rowId: string, columnId: string) => boolean;
|
|
725
|
+
error: (rowId: string, columnId: string) => string | null;
|
|
726
|
+
/**
|
|
727
|
+
* What the editor should show: the pending value if there is one, else what this session has
|
|
728
|
+
* already written, else `source` — the cell's own value, supplied by the render doing the
|
|
729
|
+
* drawing. That render is the authority on what it is drawing; the event-time paths resolve
|
|
730
|
+
* their own values from the committed snapshot instead (docs/architecture.md).
|
|
731
|
+
*/
|
|
732
|
+
read: (rowId: string, columnId: string, source: unknown) => unknown;
|
|
733
|
+
write: (rowId: string, columnId: string, value: unknown) => void;
|
|
734
|
+
};
|
|
735
|
+
/**
|
|
736
|
+
* A mounted editor registers while it is on screen; its departure arms the unmount commit.
|
|
737
|
+
*/
|
|
738
|
+
register: (rowId: string, columnId: string, editor: LedgerCellEditor) => () => void;
|
|
739
|
+
/**
|
|
740
|
+
* Where F2 enters a row: its first editable cell in display order, as the render that reached
|
|
741
|
+
* the screen had it — the order, the gate and each column's editing kind all come from there
|
|
742
|
+
* rather than from the shared core, which carries whatever render pass ran last, committed or
|
|
743
|
+
* not (docs/architecture.md). `skipInstant` is the mode: cell mode has no editor to open on an
|
|
744
|
+
* instant column, row mode does.
|
|
745
|
+
*/
|
|
746
|
+
firstEditable: (rowId: string, skipInstant: boolean) => string | null;
|
|
747
|
+
/**
|
|
748
|
+
* The instant-apply controls' transient edits. Not a session: a change *is* the commit, so
|
|
749
|
+
* there is nothing to open or close — but the write still out, the failure it came back with
|
|
750
|
+
* and the value the application now holds all outlive the control that sent them, and any
|
|
751
|
+
* number of cells can have one at once (docs/editing.md).
|
|
752
|
+
*/
|
|
753
|
+
instant: LedgerInstantEditingController;
|
|
754
|
+
/**
|
|
755
|
+
* Row-mode surface; inert while `mode` is `"cell"`.
|
|
756
|
+
*/
|
|
757
|
+
row: LedgerRowEditingController;
|
|
758
|
+
}
|
|
759
|
+
interface LedgerInstantEditingController {
|
|
760
|
+
/**
|
|
761
|
+
* What the control shows: the value this cell has written while the data has not moved past
|
|
762
|
+
* it, else the data's own.
|
|
763
|
+
*/
|
|
764
|
+
value: (rowId: string, columnId: string, source: unknown) => unknown;
|
|
765
|
+
pending: (rowId: string, columnId: string) => boolean;
|
|
766
|
+
error: (rowId: string, columnId: string) => string | null;
|
|
767
|
+
/**
|
|
768
|
+
* Commits one value in one act, against what the application last knew the cell to hold.
|
|
769
|
+
* Addressed, not handed a `Cell`: the cell would carry the shared core with it, and everything
|
|
770
|
+
* this decides with comes from the render that reached the screen.
|
|
771
|
+
*/
|
|
772
|
+
commit: (rowId: string, columnId: string, value: unknown) => boolean | Promise<boolean>;
|
|
773
|
+
register: (rowId: string, columnId: string, editor: LedgerCellEditor) => () => void;
|
|
774
|
+
}
|
|
775
|
+
interface LedgerMeta<TData extends RowData$1> {
|
|
776
|
+
/**
|
|
777
|
+
* The stable processed column definitions — the render layer's memo token. TanStack v9
|
|
778
|
+
* re-resolves `table.options` on every state tick, so `options.columns` identity is not a
|
|
779
|
+
* "definitions changed" signal anymore; this reference is.
|
|
780
|
+
*/
|
|
781
|
+
columns: Array<ColumnDef<TData, any>>;
|
|
782
|
+
editing: LedgerEditingController;
|
|
783
|
+
filtering: {
|
|
784
|
+
subscribeColumnFilters: (listener: (value: ColumnFiltersState$1) => void) => () => void;
|
|
785
|
+
subscribeGlobalFilter: (listener: (value: string) => void) => () => void;
|
|
786
|
+
};
|
|
787
|
+
editTrigger: DataTableEditTrigger;
|
|
788
|
+
enableEditing: boolean;
|
|
789
|
+
onEditCommit?: (change: DataTableEditCommit<TData>) => void | Promise<void>;
|
|
790
|
+
onRowEditCommit?: (change: DataTableRowEditCommit<TData>) => void | Promise<void>;
|
|
791
|
+
renderDetailPanel?: (row: Row<TData>) => ReactNode;
|
|
792
|
+
/**
|
|
793
|
+
* Header checkbox scope: current page when paginated, all filtered rows otherwise (docs/selection.md).
|
|
794
|
+
*/
|
|
795
|
+
selectAllScope: "page" | "all";
|
|
796
|
+
/**
|
|
797
|
+
* The active-row slice (docs/rows.md): a single keyboard-reachable current row.
|
|
798
|
+
*/
|
|
799
|
+
activeRow: {
|
|
800
|
+
enabled: boolean;
|
|
801
|
+
id: string | null;
|
|
802
|
+
set: (id: string | null) => void;
|
|
803
|
+
};
|
|
804
|
+
/**
|
|
805
|
+
* Header drag-reorder affordance (ledger-owned; TanStack has state but no switch).
|
|
806
|
+
*/
|
|
807
|
+
enableColumnOrdering: boolean;
|
|
808
|
+
/**
|
|
809
|
+
* Row drag reordering (docs/rows.md#row-ordering). `enabled` is the static gate — switch on,
|
|
810
|
+
* handler present, flat data — and decides the handle column; `orderable` is the live one —
|
|
811
|
+
* false while sorting, a filter, a search or grouping controls the visible order, which is
|
|
812
|
+
* when the handles disable.
|
|
813
|
+
*/
|
|
814
|
+
rowOrdering: {
|
|
815
|
+
enabled: boolean;
|
|
816
|
+
orderable: boolean;
|
|
817
|
+
onRowReorder?: (reorder: DataTableRowReorder<TData>) => void;
|
|
818
|
+
};
|
|
819
|
+
/**
|
|
820
|
+
* Pagination master switch (ledger-owned; TanStack expresses it via row-model inclusion).
|
|
821
|
+
*/
|
|
822
|
+
enablePagination: boolean;
|
|
823
|
+
/**
|
|
824
|
+
* Resize affordance switch (ledger-owned; the TanStack option belongs to the unregistered
|
|
825
|
+
* `columnResizingFeature`).
|
|
826
|
+
*/
|
|
827
|
+
enableColumnResizing: boolean;
|
|
828
|
+
}
|
|
829
|
+
declare module "@tanstack/react-table" {
|
|
830
|
+
interface ColumnMeta<in out TFeatures extends TableFeatures, in out TData extends RowData$1, TValue extends CellData = CellData> {
|
|
831
|
+
/**
|
|
832
|
+
* Plain-text column name for the chrome that cannot render the `header` — the columns panel,
|
|
833
|
+
* CSV headers, filter and editor field names. Defaults to the string `header`, then the
|
|
834
|
+
* column id; a column whose `header` is a render function should declare one.
|
|
835
|
+
*/
|
|
836
|
+
label?: string;
|
|
837
|
+
/**
|
|
838
|
+
* Logical text alignment — RTL-correct by construction.
|
|
839
|
+
*/
|
|
840
|
+
align?: "start" | "center" | "end";
|
|
841
|
+
/**
|
|
842
|
+
* Single-line truncation with a title tooltip (host vocabulary: `Text.truncate`).
|
|
843
|
+
*/
|
|
844
|
+
truncate?: boolean;
|
|
845
|
+
/**
|
|
846
|
+
* Header filter UI: a variant shorthand, a config, or a fully custom renderer.
|
|
847
|
+
*/
|
|
848
|
+
filter?: DataTableFilterVariant | DataTableFilterConfig | ((column: Column<TData, TValue>) => ReactNode);
|
|
849
|
+
/**
|
|
850
|
+
* Inline cell editing: a session-editor renderer (bare or in a config with gates), or an
|
|
851
|
+
* instant-apply control (docs/editing.md). Rendering always belongs to the application —
|
|
852
|
+
* the shipped `textEditor` / `numberEditor` / `selectEditor` / `checkboxEditor` helpers are
|
|
853
|
+
* renderers built on the same public contexts.
|
|
854
|
+
*/
|
|
855
|
+
edit?: DataTableEditRenderer<TData, TValue> | DataTableEditConfig<TData, TValue> | DataTableInstantEditConfig<TData, TValue>;
|
|
856
|
+
/**
|
|
857
|
+
* DOM props for this column's body cells — static, or per cell.
|
|
858
|
+
*/
|
|
859
|
+
cellProps?: DataTableElementProps<Omit<TableTdProps, "ref">, Cell<TData, TValue>>;
|
|
860
|
+
/**
|
|
861
|
+
* DOM props for this column's header cell — static, or per header (group headers included).
|
|
862
|
+
*/
|
|
863
|
+
headerCellProps?: DataTableElementProps<Omit<TableThProps, "ref">, Header<TData, TValue>>;
|
|
864
|
+
/**
|
|
865
|
+
* DOM props for this column's footer cell — static, or per footer.
|
|
866
|
+
*/
|
|
867
|
+
footerCellProps?: DataTableElementProps<Omit<TableThProps, "ref">, Header<TData, TValue>>;
|
|
868
|
+
/**
|
|
869
|
+
* `toCsv` column control: `false` excludes the column; an object overrides the exported
|
|
870
|
+
* header text or derives the exported value.
|
|
871
|
+
*/
|
|
872
|
+
export?: false | DataTableExportMeta<TData>;
|
|
873
|
+
/**
|
|
874
|
+
* Removes the column at and above the breakpoint (host vocabulary: `Box.hiddenFrom`).
|
|
875
|
+
* Breakpoint values follow the Mantine theme.
|
|
876
|
+
*/
|
|
877
|
+
hiddenFrom?: MantineBreakpoint;
|
|
878
|
+
/**
|
|
879
|
+
* Shows the column only at and above the breakpoint (host vocabulary: `Box.visibleFrom`).
|
|
880
|
+
*/
|
|
881
|
+
visibleFrom?: MantineBreakpoint;
|
|
882
|
+
}
|
|
883
|
+
interface TableMeta<in out TFeatures extends TableFeatures, in out TData extends RowData$1> {
|
|
884
|
+
ledger?: LedgerMeta<TData>;
|
|
885
|
+
}
|
|
886
|
+
}
|
|
887
|
+
//#endregion
|
|
888
|
+
//#region src/columns-panel.d.ts
|
|
889
|
+
interface DataTableColumnsPanelProps<TData extends RowData$1> {
|
|
890
|
+
table: TableInstance<TData>;
|
|
891
|
+
/**
|
|
892
|
+
* The control that opens the panel, wrapped as the Popover target — a button, an icon in a
|
|
893
|
+
* header cell, anything. Omitted: the panel renders bare for a drawer, a sidebar, or a page
|
|
894
|
+
* of its own.
|
|
895
|
+
*/
|
|
896
|
+
children?: ReactElement;
|
|
897
|
+
/**
|
|
898
|
+
* Forwarded to the Popover; only meaningful alongside a trigger.
|
|
899
|
+
*/
|
|
900
|
+
popoverProps?: Omit<PopoverProps, "children">;
|
|
901
|
+
labels?: Partial<DataTableLabels>;
|
|
902
|
+
icons?: Partial<DataTableIcons>;
|
|
903
|
+
className?: string;
|
|
904
|
+
style?: CSSProperties;
|
|
905
|
+
}
|
|
906
|
+
declare function DataTableColumnsPanel<TData extends RowData$1>(props: DataTableColumnsPanelProps<TData>): import("react").JSX.Element;
|
|
907
|
+
//#endregion
|
|
908
|
+
//#region src/csv.d.ts
|
|
909
|
+
interface ToCsvOptions {
|
|
910
|
+
/**
|
|
911
|
+
* Which rows to export:
|
|
912
|
+
* - `"filtered"` (default) — everything after filters and sorting, before pagination;
|
|
913
|
+
* - `"all"` — the unfiltered data set;
|
|
914
|
+
* - `"page"` — the current page (identical to `"filtered"` without pagination);
|
|
915
|
+
* - `"selected"` — the current selection.
|
|
916
|
+
*/
|
|
917
|
+
scope?: "filtered" | "all" | "page" | "selected";
|
|
918
|
+
delimiter?: string;
|
|
919
|
+
/**
|
|
920
|
+
* Include the header line. Default true.
|
|
921
|
+
*/
|
|
922
|
+
withHeaders?: boolean;
|
|
923
|
+
/**
|
|
924
|
+
* Prefix text a spreadsheet would evaluate as a formula (leading `=`, `+`, `-`, `@`, tab or
|
|
925
|
+
* CR — the OWASP CSV-injection set) with a `'`. Applies to header text and string-valued
|
|
926
|
+
* cells; numeric cells keep their sign. Default false — the quote is data to every
|
|
927
|
+
* non-spreadsheet consumer, so it is opt-in for exports that feed spreadsheets.
|
|
928
|
+
*/
|
|
929
|
+
escapeFormulas?: boolean;
|
|
930
|
+
}
|
|
931
|
+
declare function toCsv<TData extends RowData$1>(table: TableInstance<TData>, options?: ToCsvOptions): string;
|
|
932
|
+
//#endregion
|
|
933
|
+
//#region src/pagination-bar.d.ts
|
|
934
|
+
interface DataTablePaginationProps<TData extends RowData$1> {
|
|
935
|
+
table: TableInstance<TData>;
|
|
936
|
+
pageSizeOptions?: number[];
|
|
937
|
+
labels?: Partial<DataTableLabels>;
|
|
938
|
+
className?: string;
|
|
939
|
+
style?: CSSProperties;
|
|
940
|
+
}
|
|
941
|
+
/**
|
|
942
|
+
* Standalone compound (`DataTable.Pagination`) — place it anywhere, theme it via defaultProps.
|
|
943
|
+
*/
|
|
944
|
+
declare function DataTablePagination<TData extends RowData$1>(props: DataTablePaginationProps<TData>): import("react").JSX.Element;
|
|
945
|
+
//#endregion
|
|
946
|
+
//#region src/search.d.ts
|
|
947
|
+
interface DataTableSearchProps<TData extends RowData$1> extends Omit<TextInputProps, "value" | "defaultValue" | "onChange"> {
|
|
948
|
+
table: TableInstance<TData>;
|
|
949
|
+
/**
|
|
950
|
+
* Debounce before the global filter applies, in milliseconds.
|
|
951
|
+
*/
|
|
952
|
+
debounce?: number;
|
|
953
|
+
labels?: Partial<DataTableLabels>;
|
|
954
|
+
icons?: Partial<DataTableIcons>;
|
|
955
|
+
}
|
|
956
|
+
declare function DataTableSearch<TData extends RowData$1>(props: DataTableSearchProps<TData>): import("react").JSX.Element;
|
|
957
|
+
//#endregion
|
|
958
|
+
//#region src/selection-bar.d.ts
|
|
959
|
+
interface DataTableSelectionBarProps<TData extends RowData$1> {
|
|
960
|
+
table: TableInstance<TData>;
|
|
961
|
+
labels?: Partial<DataTableLabels>;
|
|
962
|
+
icons?: Partial<DataTableIcons>;
|
|
963
|
+
/**
|
|
964
|
+
* Bulk actions, rendered after the count and clear control.
|
|
965
|
+
*/
|
|
966
|
+
children?: ReactNode;
|
|
967
|
+
className?: string;
|
|
968
|
+
style?: CSSProperties;
|
|
969
|
+
}
|
|
970
|
+
declare function DataTableSelectionBar<TData extends RowData$1>(props: DataTableSelectionBarProps<TData>): import("react").JSX.Element | null;
|
|
971
|
+
//#endregion
|
|
972
|
+
//#region src/data-table.d.ts
|
|
973
|
+
type DataTableStylesNames = "root" | "main" | "header" | "scroller" | "footer" | "table" | "thead" | "tbody" | "tfoot" | "headerRow" | "headerCell" | "headerLabel" | "headerActions" | "sortIndicator" | "resizer" | "filterPopover" | "row" | "cell" | "selectionCell" | "expanderCell" | "detailPanel" | "cellEditor" | "instantCell" | "instantSpinner" | "rowDragCell" | "rowDragOverlay" | "footerRow" | "footerCell" | "empty" | "loaderRow" | "loaderRowContent" | "paginationBar";
|
|
974
|
+
interface DataTableCssVariables {
|
|
975
|
+
root: "--ledger-striped-color" | "--ledger-hover-color" | "--ledger-border-color";
|
|
976
|
+
}
|
|
977
|
+
interface DataTableBaseProps<TData extends RowData$1> extends BoxProps, StylesApiProps<DataTableFactory>, ElementProps<"div"> {
|
|
978
|
+
/**
|
|
979
|
+
* Root element ref (React 19 ref-as-prop; genericFactory components receive it here).
|
|
980
|
+
*/
|
|
981
|
+
ref?: Ref<HTMLDivElement>;
|
|
982
|
+
striped?: boolean | "odd" | "even";
|
|
983
|
+
stripedColor?: MantineColor;
|
|
984
|
+
highlightOnHover?: boolean;
|
|
985
|
+
highlightOnHoverColor?: MantineColor;
|
|
986
|
+
withTableBorder?: boolean;
|
|
987
|
+
withColumnBorders?: boolean;
|
|
988
|
+
withRowBorders?: boolean;
|
|
989
|
+
borderColor?: MantineColor;
|
|
990
|
+
verticalSpacing?: MantineSpacing;
|
|
991
|
+
horizontalSpacing?: MantineSpacing;
|
|
992
|
+
tabularNums?: boolean;
|
|
993
|
+
tableMinWidth?: number | string;
|
|
994
|
+
/**
|
|
995
|
+
* Row virtualization ([virtualization.md](../docs/virtualization.md)): the body renders a
|
|
996
|
+
* measured window of rows between two spacer rows.
|
|
997
|
+
*/
|
|
998
|
+
virtualizedRows?: boolean | {
|
|
999
|
+
estimateHeight?: number;
|
|
1000
|
+
overscan?: number;
|
|
1001
|
+
};
|
|
1002
|
+
/**
|
|
1003
|
+
* Column virtualization ([virtualization.md](../docs/virtualization.md#column-virtualization)):
|
|
1004
|
+
* the center zone renders a windowed slice of columns between two spacer cols; pinned columns
|
|
1005
|
+
* stay mounted. Widths are the width engine's exact pixels, so there is nothing to estimate.
|
|
1006
|
+
*/
|
|
1007
|
+
virtualizedColumns?: boolean | {
|
|
1008
|
+
overscan?: number;
|
|
1009
|
+
};
|
|
1010
|
+
onEndReached?: () => void;
|
|
1011
|
+
endReachedOffset?: number;
|
|
1012
|
+
loadingMore?: boolean;
|
|
1013
|
+
/**
|
|
1014
|
+
* The last `onEndReached` load failed — replaces the trailing loader row with the message
|
|
1015
|
+
* (`true` uses `labels.loadMoreError`) and a retry button that fires `onEndReached` again.
|
|
1016
|
+
*/
|
|
1017
|
+
loadMoreError?: boolean | ReactNode;
|
|
1018
|
+
loading?: boolean;
|
|
1019
|
+
emptyState?: ReactNode;
|
|
1020
|
+
/**
|
|
1021
|
+
* Loading the data failed — shows an error panel over the body (`true` uses `labels.error`;
|
|
1022
|
+
* a node replaces the message). Takes precedence over the empty state.
|
|
1023
|
+
*/
|
|
1024
|
+
error?: boolean | ReactNode;
|
|
1025
|
+
/**
|
|
1026
|
+
* Renders a retry button in the error panel.
|
|
1027
|
+
*/
|
|
1028
|
+
onRetry?: () => void;
|
|
1029
|
+
/**
|
|
1030
|
+
* Renders the column header region. Turning it off takes the header's own affordances with
|
|
1031
|
+
* it — sort controls, filter popovers, resize handles, drag reordering — so name the table
|
|
1032
|
+
* some other way ([accessibility.md](../docs/accessibility.md)).
|
|
1033
|
+
*/
|
|
1034
|
+
withColumnHeaders?: boolean;
|
|
1035
|
+
withPaginationBar?: boolean;
|
|
1036
|
+
pageSizeOptions?: number[];
|
|
1037
|
+
/**
|
|
1038
|
+
* A literal primary click on the row. Pointer-only by definition — reach for `onRowActivate`
|
|
1039
|
+
* when the intent is "the user chose this row", so the keyboard reaches it too.
|
|
1040
|
+
*/
|
|
1041
|
+
onRowClick?: (row: Row<TData>, event: MouseEvent) => void;
|
|
1042
|
+
/**
|
|
1043
|
+
* The row was activated, whatever the input device: a primary click, or `Enter` on the
|
|
1044
|
+
* current row while `enableActiveRow` is on ([rows.md](../docs/rows.md#active-row)).
|
|
1045
|
+
*/
|
|
1046
|
+
onRowActivate?: (row: Row<TData>, event: MouseEvent | KeyboardEvent) => void;
|
|
1047
|
+
onRowDoubleClick?: (row: Row<TData>, event: MouseEvent) => void;
|
|
1048
|
+
onRowContextMenu?: (row: Row<TData>, event: MouseEvent) => void;
|
|
1049
|
+
/**
|
|
1050
|
+
* DOM props for every data row — static, or per row. Synthetic rows (detail panels, loader
|
|
1051
|
+
* and skeleton rows) have no `Row` subject and never receive them.
|
|
1052
|
+
*/
|
|
1053
|
+
rowProps?: DataTableElementProps<Omit<TableTrProps, "ref">, Row<TData>>;
|
|
1054
|
+
/**
|
|
1055
|
+
* DOM props for every header row — static, or per header group (grouped columns render one
|
|
1056
|
+
* row per level).
|
|
1057
|
+
*/
|
|
1058
|
+
headerRowProps?: DataTableElementProps<Omit<TableTrProps, "ref">, HeaderGroup<TData>>;
|
|
1059
|
+
/**
|
|
1060
|
+
* DOM props for every footer row — static, or per footer group.
|
|
1061
|
+
*/
|
|
1062
|
+
footerRowProps?: DataTableElementProps<Omit<TableTrProps, "ref">, HeaderGroup<TData>>;
|
|
1063
|
+
/**
|
|
1064
|
+
* DOM props for the internal scroll viewport — `onScroll`, `data-*`, extra styles. Host
|
|
1065
|
+
* vocabulary: `ScrollArea.viewportProps`. ledger owns its scroll listener, its overscroll
|
|
1066
|
+
* behavior and (with `enableActiveRow`) its keyboard handling; those compose rather than
|
|
1067
|
+
* being replaced.
|
|
1068
|
+
*/
|
|
1069
|
+
viewportProps?: Omit<ComponentProps<"div">, "ref"> & DataAttributes;
|
|
1070
|
+
labels?: Partial<DataTableLabels>;
|
|
1071
|
+
/**
|
|
1072
|
+
* Replacements for the chrome's glyphs, merged over the defaults per slot — `lucide-react`
|
|
1073
|
+
* components slot in as-is (docs/styling.md#icons).
|
|
1074
|
+
*/
|
|
1075
|
+
icons?: Partial<DataTableIcons>;
|
|
1076
|
+
/**
|
|
1077
|
+
* Imperative handle: `{ table, viewport, scrollToRow, scrollToIndex, scrollToColumn, startEditing, stopEditing }`.
|
|
1078
|
+
*/
|
|
1079
|
+
handleRef?: Ref<DataTableHandle<TData>>;
|
|
1080
|
+
}
|
|
1081
|
+
/**
|
|
1082
|
+
* Data source — a discriminated pair: a hook-mode instance XOR inline behavior options.
|
|
1083
|
+
*/
|
|
1084
|
+
type DataTableProps<TData extends RowData$1 = RowData$1> = DataTableBaseProps<TData> & (({
|
|
1085
|
+
table: TableInstance<TData>;
|
|
1086
|
+
} & {
|
|
1087
|
+
data?: never;
|
|
1088
|
+
columns?: never;
|
|
1089
|
+
}) | ({
|
|
1090
|
+
table?: never;
|
|
1091
|
+
} & UseDataTableOptions<TData>));
|
|
1092
|
+
type DataTableFactory = Factory<{
|
|
1093
|
+
props: DataTableProps;
|
|
1094
|
+
ref: HTMLDivElement;
|
|
1095
|
+
stylesNames: DataTableStylesNames;
|
|
1096
|
+
vars: DataTableCssVariables;
|
|
1097
|
+
signature: <TData extends RowData$1>(props: DataTableProps<TData>) => JSX.Element;
|
|
1098
|
+
staticComponents: {
|
|
1099
|
+
Search: typeof DataTableSearch;
|
|
1100
|
+
ColumnsPanel: typeof DataTableColumnsPanel;
|
|
1101
|
+
Pagination: typeof DataTablePagination;
|
|
1102
|
+
SelectionBar: typeof DataTableSelectionBar;
|
|
1103
|
+
};
|
|
1104
|
+
}>;
|
|
1105
|
+
declare const DataTable: (<TData extends RowData$1>(props: DataTableProps<TData>) => JSX.Element) & import("@mantine/core").ThemeExtend<{
|
|
1106
|
+
props: DataTableProps;
|
|
1107
|
+
ref: HTMLDivElement;
|
|
1108
|
+
stylesNames: DataTableStylesNames;
|
|
1109
|
+
vars: DataTableCssVariables;
|
|
1110
|
+
signature: <TData extends RowData$1>(props: DataTableProps<TData>) => JSX.Element;
|
|
1111
|
+
staticComponents: {
|
|
1112
|
+
Search: typeof DataTableSearch;
|
|
1113
|
+
ColumnsPanel: typeof DataTableColumnsPanel;
|
|
1114
|
+
Pagination: typeof DataTablePagination;
|
|
1115
|
+
SelectionBar: typeof DataTableSelectionBar;
|
|
1116
|
+
};
|
|
1117
|
+
}> & import("@mantine/core").ComponentClasses<{
|
|
1118
|
+
props: DataTableProps;
|
|
1119
|
+
ref: HTMLDivElement;
|
|
1120
|
+
stylesNames: DataTableStylesNames;
|
|
1121
|
+
vars: DataTableCssVariables;
|
|
1122
|
+
signature: <TData extends RowData$1>(props: DataTableProps<TData>) => JSX.Element;
|
|
1123
|
+
staticComponents: {
|
|
1124
|
+
Search: typeof DataTableSearch;
|
|
1125
|
+
ColumnsPanel: typeof DataTableColumnsPanel;
|
|
1126
|
+
Pagination: typeof DataTablePagination;
|
|
1127
|
+
SelectionBar: typeof DataTableSelectionBar;
|
|
1128
|
+
};
|
|
1129
|
+
}> & {
|
|
1130
|
+
Search: typeof DataTableSearch;
|
|
1131
|
+
ColumnsPanel: typeof DataTableColumnsPanel;
|
|
1132
|
+
Pagination: typeof DataTablePagination;
|
|
1133
|
+
SelectionBar: typeof DataTableSelectionBar;
|
|
1134
|
+
} & {
|
|
1135
|
+
varsResolver: import("@mantine/core").VarsResolver<{
|
|
1136
|
+
props: DataTableProps;
|
|
1137
|
+
ref: HTMLDivElement;
|
|
1138
|
+
stylesNames: DataTableStylesNames;
|
|
1139
|
+
vars: DataTableCssVariables;
|
|
1140
|
+
signature: <TData extends RowData$1>(props: DataTableProps<TData>) => JSX.Element;
|
|
1141
|
+
staticComponents: {
|
|
1142
|
+
Search: typeof DataTableSearch;
|
|
1143
|
+
ColumnsPanel: typeof DataTableColumnsPanel;
|
|
1144
|
+
Pagination: typeof DataTablePagination;
|
|
1145
|
+
SelectionBar: typeof DataTableSelectionBar;
|
|
1146
|
+
};
|
|
1147
|
+
}>;
|
|
1148
|
+
} & import("@mantine/core").FactoryComponentWithProps<{
|
|
1149
|
+
props: DataTableProps;
|
|
1150
|
+
ref: HTMLDivElement;
|
|
1151
|
+
stylesNames: DataTableStylesNames;
|
|
1152
|
+
vars: DataTableCssVariables;
|
|
1153
|
+
signature: <TData extends RowData$1>(props: DataTableProps<TData>) => JSX.Element;
|
|
1154
|
+
staticComponents: {
|
|
1155
|
+
Search: typeof DataTableSearch;
|
|
1156
|
+
ColumnsPanel: typeof DataTableColumnsPanel;
|
|
1157
|
+
Pagination: typeof DataTablePagination;
|
|
1158
|
+
SelectionBar: typeof DataTableSelectionBar;
|
|
1159
|
+
};
|
|
1160
|
+
}> & {
|
|
1161
|
+
displayName?: string;
|
|
1162
|
+
};
|
|
1163
|
+
//#endregion
|
|
1164
|
+
//#region src/editors.d.ts
|
|
1165
|
+
/**
|
|
1166
|
+
* A plain text editor: `meta.edit: textEditor()`.
|
|
1167
|
+
*/
|
|
1168
|
+
declare function textEditor(): DataTableEditRenderer<any, any>;
|
|
1169
|
+
/**
|
|
1170
|
+
* A numeric editor; an emptied input holds `null`, never `0`.
|
|
1171
|
+
*/
|
|
1172
|
+
declare function numberEditor(): DataTableEditRenderer<any, any>;
|
|
1173
|
+
/**
|
|
1174
|
+
* A single-pick editor over the given options. In cell mode the dropdown opens immediately and
|
|
1175
|
+
* picking an option commits at once — one cell is the whole session; in row mode it is one
|
|
1176
|
+
* draft-bound field among the row's others, and the row's own commit decides.
|
|
1177
|
+
*/
|
|
1178
|
+
declare function selectEditor(options: ComboboxData): DataTableEditRenderer<any, any>;
|
|
1179
|
+
/**
|
|
1180
|
+
* A live checkbox for an instant column: `meta.edit: { instant: checkboxEditor() }`. Each
|
|
1181
|
+
* toggle commits the flipped value; the host disables it while its own write is out.
|
|
1182
|
+
*/
|
|
1183
|
+
declare function checkboxEditor(): DataTableInstantEditRenderer<any, any>;
|
|
1184
|
+
//#endregion
|
|
1185
|
+
//#region src/use-data-table.d.ts
|
|
1186
|
+
declare function useDataTable<TData extends RowData$1>(options: UseDataTableOptions<TData>): TableInstance<TData>;
|
|
1187
|
+
//#endregion
|
|
1188
|
+
export { type Cell, type Column, type ColumnDef, type ColumnFiltersState, type ColumnOrderState, type ColumnPinningState, type ColumnSizingState, type ColumnVisibilityState, DataTable, type DataTableBaseProps, DataTableColumnsPanel, type DataTableColumnsPanelProps, type DataTableCssVariables, type DataTableEditCommit, type DataTableEditConfig, type DataTableEditContext, type DataTableEditMode, type DataTableEditRenderer, type DataTableEditTrigger, type DataTableEditingCell, type DataTableElementProps, type DataTableExportMeta, type DataTableFactory, type DataTableFilterConfig, type DataTableFilterVariant, type DataTableHandle, type DataTableIconComponent, type DataTableIconProps, type DataTableIcons, type DataTableInstantEditConfig, type DataTableInstantEditContext, type DataTableInstantEditRenderer, type DataTableLabels, DataTablePagination, type DataTablePaginationProps, type DataTablePersistState, type DataTablePersistableSlice, type DataTableProps, type DataTableRowEditCommit, type DataTableRowReorder, type DataTableScrollOptions, DataTableSearch, type DataTableSearchProps, DataTableSelectionBar, type DataTableSelectionBarProps, type DataTableStylesNames, type ExpandedState, type GroupingState, type Header, type HeaderGroup, type LedgerCellEditor, type LedgerEditingController, type LedgerFeatures, type LedgerInstantEditingController, type LedgerMeta, type LedgerRowEditingController, type LedgerRowEditor, type PaginationState, type Row, type RowData, type RowPinningState, type RowSelectionState, type SortingState, type TableInstance, type ToCsvOptions, type UseDataTableOptions, checkboxEditor, createColumnHelper, defaultIcons, defaultLabels, flexRender, numberEditor, selectEditor, textEditor, toCsv, useDataTable };
|
|
1189
|
+
//# sourceMappingURL=index.d.ts.map
|