@techsio/ui-kit 0.37.1 → 0.38.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/organisms/data-table.fields.js +720 -0
- package/dist/organisms/data-table.helpers.js +168 -0
- package/dist/organisms/data-table.js +1736 -0
- package/dist/organisms/table.js +7 -3
- package/dist/src/molecules/switch.d.ts +3 -3
- package/dist/src/molecules/toast.d.ts +3 -3
- package/dist/src/organisms/data-table.d.ts +357 -0
- package/dist/src/organisms/data-table.d.ts.map +1 -0
- package/dist/src/organisms/data-table.fields.d.ts +119 -0
- package/dist/src/organisms/data-table.fields.d.ts.map +1 -0
- package/dist/src/organisms/data-table.helpers.d.ts +240 -0
- package/dist/src/organisms/data-table.helpers.d.ts.map +1 -0
- package/dist/src/organisms/table.d.ts +15 -7
- package/dist/src/organisms/table.d.ts.map +1 -1
- package/dist/stories/changelog/changelog.stories.d.ts.map +1 -1
- package/dist/stories/organisms/data-table.stories.d.ts +145 -0
- package/dist/stories/organisms/data-table.stories.d.ts.map +1 -0
- package/dist/stories/organisms/table.stories.d.ts +7 -0
- package/dist/stories/organisms/table.stories.d.ts.map +1 -1
- package/package.json +7 -1
- package/src/tokens/components/components.css +1 -0
- package/src/tokens/components/organisms/_data-table.css +51 -0
package/dist/organisms/table.js
CHANGED
|
@@ -27,10 +27,12 @@ const tableVariants = tv({
|
|
|
27
27
|
],
|
|
28
28
|
columnHeader: [
|
|
29
29
|
"text-start data-[numeric=true]:text-end",
|
|
30
|
+
"data-[align=center]:text-center data-[align=start]:text-start data-[align=end]:text-end",
|
|
30
31
|
"font-table-header"
|
|
31
32
|
],
|
|
32
33
|
cell: [
|
|
33
|
-
"text-start data-[numeric=true]:text-end"
|
|
34
|
+
"text-start data-[numeric=true]:text-end",
|
|
35
|
+
"data-[align=center]:text-center data-[align=start]:text-start data-[align=end]:text-end"
|
|
34
36
|
]
|
|
35
37
|
},
|
|
36
38
|
variants: {
|
|
@@ -203,12 +205,13 @@ Table.Row = function({ children, ref, className, selected, ...props }) {
|
|
|
203
205
|
children: children
|
|
204
206
|
});
|
|
205
207
|
};
|
|
206
|
-
Table.ColumnHeader = function({ children, ref, className, numeric, ...props }) {
|
|
208
|
+
Table.ColumnHeader = function({ children, ref, className, numeric, align, ...props }) {
|
|
207
209
|
const { styles } = useTableContext();
|
|
208
210
|
return /*#__PURE__*/ jsx("th", {
|
|
209
211
|
className: styles.columnHeader({
|
|
210
212
|
className
|
|
211
213
|
}),
|
|
214
|
+
"data-align": align,
|
|
212
215
|
"data-numeric": numeric,
|
|
213
216
|
ref: ref,
|
|
214
217
|
scope: "col",
|
|
@@ -216,13 +219,14 @@ Table.ColumnHeader = function({ children, ref, className, numeric, ...props }) {
|
|
|
216
219
|
children: children
|
|
217
220
|
});
|
|
218
221
|
};
|
|
219
|
-
Table.Cell = function({ children, ref, className, numeric, ...props }) {
|
|
222
|
+
Table.Cell = function({ children, ref, className, numeric, align, ...props }) {
|
|
220
223
|
const { styles, stickyFirstColumn } = useTableContext();
|
|
221
224
|
return /*#__PURE__*/ jsx("td", {
|
|
222
225
|
className: styles.cell({
|
|
223
226
|
className,
|
|
224
227
|
stickyFirstColumn
|
|
225
228
|
}),
|
|
229
|
+
"data-align": align,
|
|
226
230
|
"data-numeric": numeric,
|
|
227
231
|
ref: ref,
|
|
228
232
|
...props,
|
|
@@ -3,8 +3,8 @@ import type { VariantProps } from "tailwind-variants";
|
|
|
3
3
|
declare const switchVariants: import("tailwind-variants").TVReturnType<{
|
|
4
4
|
[key: string]: {
|
|
5
5
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
6
|
-
label?: import("tailwind-merge").ClassNameValue;
|
|
7
6
|
root?: import("tailwind-merge").ClassNameValue;
|
|
7
|
+
label?: import("tailwind-merge").ClassNameValue;
|
|
8
8
|
control?: import("tailwind-merge").ClassNameValue;
|
|
9
9
|
hiddenInput?: import("tailwind-merge").ClassNameValue;
|
|
10
10
|
thumb?: import("tailwind-merge").ClassNameValue;
|
|
@@ -13,8 +13,8 @@ declare const switchVariants: import("tailwind-variants").TVReturnType<{
|
|
|
13
13
|
} | {
|
|
14
14
|
[x: string]: {
|
|
15
15
|
[x: string]: import("tailwind-merge").ClassNameValue | {
|
|
16
|
-
label?: import("tailwind-merge").ClassNameValue;
|
|
17
16
|
root?: import("tailwind-merge").ClassNameValue;
|
|
17
|
+
label?: import("tailwind-merge").ClassNameValue;
|
|
18
18
|
control?: import("tailwind-merge").ClassNameValue;
|
|
19
19
|
hiddenInput?: import("tailwind-merge").ClassNameValue;
|
|
20
20
|
thumb?: import("tailwind-merge").ClassNameValue;
|
|
@@ -29,8 +29,8 @@ declare const switchVariants: import("tailwind-variants").TVReturnType<{
|
|
|
29
29
|
}, undefined, {
|
|
30
30
|
[key: string]: {
|
|
31
31
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
32
|
-
label?: import("tailwind-merge").ClassNameValue;
|
|
33
32
|
root?: import("tailwind-merge").ClassNameValue;
|
|
33
|
+
label?: import("tailwind-merge").ClassNameValue;
|
|
34
34
|
control?: import("tailwind-merge").ClassNameValue;
|
|
35
35
|
hiddenInput?: import("tailwind-merge").ClassNameValue;
|
|
36
36
|
thumb?: import("tailwind-merge").ClassNameValue;
|
|
@@ -7,9 +7,9 @@ declare const toastVariants: import("tailwind-variants").TVReturnType<{
|
|
|
7
7
|
title?: import("tailwind-merge").ClassNameValue;
|
|
8
8
|
icon?: import("tailwind-merge").ClassNameValue;
|
|
9
9
|
group?: import("tailwind-merge").ClassNameValue;
|
|
10
|
+
root?: import("tailwind-merge").ClassNameValue;
|
|
10
11
|
header?: import("tailwind-merge").ClassNameValue;
|
|
11
12
|
description?: import("tailwind-merge").ClassNameValue;
|
|
12
|
-
root?: import("tailwind-merge").ClassNameValue;
|
|
13
13
|
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
14
14
|
};
|
|
15
15
|
};
|
|
@@ -19,9 +19,9 @@ declare const toastVariants: import("tailwind-variants").TVReturnType<{
|
|
|
19
19
|
title?: import("tailwind-merge").ClassNameValue;
|
|
20
20
|
icon?: import("tailwind-merge").ClassNameValue;
|
|
21
21
|
group?: import("tailwind-merge").ClassNameValue;
|
|
22
|
+
root?: import("tailwind-merge").ClassNameValue;
|
|
22
23
|
header?: import("tailwind-merge").ClassNameValue;
|
|
23
24
|
description?: import("tailwind-merge").ClassNameValue;
|
|
24
|
-
root?: import("tailwind-merge").ClassNameValue;
|
|
25
25
|
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
26
26
|
};
|
|
27
27
|
};
|
|
@@ -39,9 +39,9 @@ declare const toastVariants: import("tailwind-variants").TVReturnType<{
|
|
|
39
39
|
title?: import("tailwind-merge").ClassNameValue;
|
|
40
40
|
icon?: import("tailwind-merge").ClassNameValue;
|
|
41
41
|
group?: import("tailwind-merge").ClassNameValue;
|
|
42
|
+
root?: import("tailwind-merge").ClassNameValue;
|
|
42
43
|
header?: import("tailwind-merge").ClassNameValue;
|
|
43
44
|
description?: import("tailwind-merge").ClassNameValue;
|
|
44
|
-
root?: import("tailwind-merge").ClassNameValue;
|
|
45
45
|
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
46
46
|
};
|
|
47
47
|
};
|
|
@@ -0,0 +1,357 @@
|
|
|
1
|
+
import { type ColumnFiltersState, type ColumnPinningState, type ColumnVisibilityState, type ExpandedState, type PaginationState, type RowData, type RowSelectionState, type SortingState } from "@tanstack/react-table";
|
|
2
|
+
import { type ReactNode, type Ref } from "react";
|
|
3
|
+
import { type ButtonProps } from "../atoms/button";
|
|
4
|
+
import { type IconType } from "../atoms/icon";
|
|
5
|
+
import { type PaginationProps } from "../molecules/pagination";
|
|
6
|
+
import { type DataTableColumnType, type DataTableEditorRenderer, type DataTableFilterRenderer } from "./data-table.fields";
|
|
7
|
+
import { type Column, type ColumnDef, type DataTableGetCellSpan, type Row, type TanstackTable } from "./data-table.helpers";
|
|
8
|
+
export type { DataTableColumnType, DataTableControlSize, DataTableEditorContext, DataTableEditorRenderer, DataTableFilterContext, DataTableFilterRenderer, DataTableOption, } from "./data-table.fields";
|
|
9
|
+
export type { Cell, CellContext, Column, ColumnDef, DataTableCellSpan, DataTableColumnWidth, DataTableConditionalFilterValue, DataTableFeatures, DataTableFilterOperator, DataTableGetCellSpan, DataTableInstance, Header, Row, TanstackTable, } from "./data-table.helpers";
|
|
10
|
+
export { conditionalFilterFn } from "./data-table.helpers";
|
|
11
|
+
/**
|
|
12
|
+
* A custom toolbar action, rendered as a `Button` at the table's `size`.
|
|
13
|
+
* Accepts the full Button API, so icon-only, themed and loading actions all
|
|
14
|
+
* work; `label` is a convenience alias for `children`.
|
|
15
|
+
*/
|
|
16
|
+
export type DataTableToolbarAction = Omit<ButtonProps, "size"> & {
|
|
17
|
+
/**
|
|
18
|
+
* Stable React key; falls back to the array index. The fallback is fine for
|
|
19
|
+
* a fixed list, but a `toolbarActions` array that adds, removes or
|
|
20
|
+
* reorders entries based on state (e.g. permission changes) needs a real
|
|
21
|
+
* `id` — an index-keyed action can otherwise inherit a sibling's DOM node,
|
|
22
|
+
* along with its transient disabled/hover/focus state, across a re-render.
|
|
23
|
+
*/
|
|
24
|
+
id?: string;
|
|
25
|
+
/** Button text. Omit for icon-only actions, but keep an `aria-label`. */
|
|
26
|
+
label?: ReactNode;
|
|
27
|
+
};
|
|
28
|
+
/**
|
|
29
|
+
* Recommended ceiling for `toolbarActions`. Exceeding it warns rather than
|
|
30
|
+
* throws — a fourth action still renders, it just crowds the toolbar and is
|
|
31
|
+
* usually a sign the extra actions belong in a menu.
|
|
32
|
+
*/
|
|
33
|
+
export declare const DATA_TABLE_MAX_TOOLBAR_ACTIONS = 3;
|
|
34
|
+
/**
|
|
35
|
+
* Declarative row action. `hidden` and `disabled` are evaluated per row, so
|
|
36
|
+
* availability can follow the row's id, ownership or the current user's
|
|
37
|
+
* permissions.
|
|
38
|
+
*/
|
|
39
|
+
export type DataTableRowAction<T extends RowData> = {
|
|
40
|
+
id: string;
|
|
41
|
+
label: string;
|
|
42
|
+
icon: IconType;
|
|
43
|
+
tone?: "neutral" | "danger";
|
|
44
|
+
/** Omit the action entirely for this row. */
|
|
45
|
+
hidden?: (row: Row<T>) => boolean;
|
|
46
|
+
/** Render the action but block it for this row. */
|
|
47
|
+
disabled?: (row: Row<T>) => boolean;
|
|
48
|
+
onAction: (row: Row<T>) => void;
|
|
49
|
+
};
|
|
50
|
+
/**
|
|
51
|
+
* Interactions that report through `onInteractionBlocked` while a row is being
|
|
52
|
+
* edited inline.
|
|
53
|
+
*
|
|
54
|
+
* This is exactly the set `blocked()` is called with. Sorting, selection and
|
|
55
|
+
* both reorder flavours are absent on purpose: sorting and selection controls
|
|
56
|
+
* are natively `disabled` during an edit and reorder simply stops being
|
|
57
|
+
* draggable, so in every one of those cases nothing reaches a handler and
|
|
58
|
+
* nothing could ever report. Making any of them reportable means making the
|
|
59
|
+
* control clickable-but-inert first.
|
|
60
|
+
*/
|
|
61
|
+
export type DataTableBlockedAction = "globalFilter" | "paginate" | "columnVisibility" | "rowClick" | "expand";
|
|
62
|
+
export type DataTableTranslations = {
|
|
63
|
+
searchPlaceholder?: string;
|
|
64
|
+
/** Accessible name of the global search input. */
|
|
65
|
+
searchLabel?: string;
|
|
66
|
+
/** Accessible name of the search field's clear button. */
|
|
67
|
+
clearSearchLabel?: string;
|
|
68
|
+
/** Accessible name of the search submit button joined to the input. */
|
|
69
|
+
searchButtonLabel?: string;
|
|
70
|
+
columnsLabel?: string;
|
|
71
|
+
emptyTitle?: string;
|
|
72
|
+
emptyDescription?: string;
|
|
73
|
+
pageSizeLabel?: string;
|
|
74
|
+
actionsLabel?: string;
|
|
75
|
+
filtersLabel?: string;
|
|
76
|
+
selectAllLabel?: string;
|
|
77
|
+
loadingLabel?: string;
|
|
78
|
+
/** Override the filter condition labels, keyed by operator. */
|
|
79
|
+
operatorLabels?: Partial<Record<string, string>>;
|
|
80
|
+
editingLabel?: string;
|
|
81
|
+
rangeLabel?: (info: {
|
|
82
|
+
start: number;
|
|
83
|
+
end: number;
|
|
84
|
+
total: number;
|
|
85
|
+
}) => string;
|
|
86
|
+
/** Inline-edit validation error for a blank `meta.required` field. */
|
|
87
|
+
requiredLabel?: string;
|
|
88
|
+
};
|
|
89
|
+
export type DataTableProps<T extends RowData> = {
|
|
90
|
+
data: T[];
|
|
91
|
+
columns: ColumnDef<T, unknown>[];
|
|
92
|
+
getRowId?: (row: T, index: number) => string;
|
|
93
|
+
/** Stable id for the wrapper element; falls back to a generated one. */
|
|
94
|
+
id?: string;
|
|
95
|
+
className?: string;
|
|
96
|
+
ref?: Ref<HTMLDivElement>;
|
|
97
|
+
variant?: "line" | "outline" | "striped";
|
|
98
|
+
/**
|
|
99
|
+
* Zebra-stripe body rows. Independent of `variant`, so striping composes
|
|
100
|
+
* with `variant="outline"`. Equivalent to `variant="striped"` — DataTable
|
|
101
|
+
* routes both through this prop's own row-index-based coloring rather than
|
|
102
|
+
* `Table`'s `odd:`/`even:` implementation, which drifts under
|
|
103
|
+
* `enableVirtualization` (a row's DOM sibling position, not its logical
|
|
104
|
+
* index, changes as the windowed slice scrolls).
|
|
105
|
+
*/
|
|
106
|
+
striped?: boolean;
|
|
107
|
+
/**
|
|
108
|
+
* Tint rows by nesting depth (`getSubRows` tree data or `renderExpandedRow`
|
|
109
|
+
* detail rows) — same idea as `striped`, but keyed on `row.depth` instead of
|
|
110
|
+
* row index, so a child row reads as "inside" its parent instead of just
|
|
111
|
+
* being the next row in a flat zebra pattern. Composes with `striped`: the
|
|
112
|
+
* depth tint and the odd/even stripe are different CSS properties and stack
|
|
113
|
+
* rather than fight for the same one.
|
|
114
|
+
*/
|
|
115
|
+
tintNestedRows?: boolean;
|
|
116
|
+
size?: "sm" | "md" | "lg";
|
|
117
|
+
stickyHeader?: boolean;
|
|
118
|
+
interactive?: boolean;
|
|
119
|
+
showColumnBorder?: boolean;
|
|
120
|
+
caption?: ReactNode;
|
|
121
|
+
/** Hide the column header row(s) entirely (headerless / borderless layouts). */
|
|
122
|
+
hideHeader?: boolean;
|
|
123
|
+
/** Height of the scroll container; enables sticky header / infinite scroll. */
|
|
124
|
+
maxHeight?: string;
|
|
125
|
+
enableSorting?: boolean;
|
|
126
|
+
enableGlobalFilter?: boolean;
|
|
127
|
+
enableColumnFilters?: boolean;
|
|
128
|
+
enableRowSelection?: boolean;
|
|
129
|
+
/**
|
|
130
|
+
* `"multiple"` (default) lets any number of rows be selected; `"single"`
|
|
131
|
+
* replaces the selection so only one row is ever selected.
|
|
132
|
+
*/
|
|
133
|
+
selectionMode?: "single" | "multiple";
|
|
134
|
+
/**
|
|
135
|
+
* Hard cap on how many rows can be selected at once. Once reached, unselected
|
|
136
|
+
* rows report `getCanSelect() === false` and their checkboxes disable, while
|
|
137
|
+
* already-selected rows stay deselectable.
|
|
138
|
+
*/
|
|
139
|
+
maxSelectedRows?: number;
|
|
140
|
+
/**
|
|
141
|
+
* Per-row selectability predicate, for rules the mode/cap can't express
|
|
142
|
+
* (e.g. "only rows with status=active"). Composed with — not instead of —
|
|
143
|
+
* `selectionMode` and `maxSelectedRows`.
|
|
144
|
+
*/
|
|
145
|
+
canSelectRow?: (row: Row<T>, context: {
|
|
146
|
+
selectedCount: number;
|
|
147
|
+
isSelected: boolean;
|
|
148
|
+
}) => boolean;
|
|
149
|
+
/** Fired when a selection change reaches `maxSelectedRows`. */
|
|
150
|
+
onSelectionLimitReached?: (details: {
|
|
151
|
+
limit: number;
|
|
152
|
+
selectedCount: number;
|
|
153
|
+
}) => void;
|
|
154
|
+
enableColumnVisibility?: boolean;
|
|
155
|
+
enableColumnPinning?: boolean;
|
|
156
|
+
enableColumnReorder?: boolean;
|
|
157
|
+
enableColumnResizing?: boolean;
|
|
158
|
+
/**
|
|
159
|
+
* CSS `table-layout`. Under the default `"auto"` a column's `meta.width` is
|
|
160
|
+
* only a hint and long content can still stretch the column; `"fixed"` makes
|
|
161
|
+
* declared widths exact and lets the remaining columns share what is left.
|
|
162
|
+
*/
|
|
163
|
+
tableLayout?: "auto" | "fixed";
|
|
164
|
+
enableRowReorder?: boolean;
|
|
165
|
+
enableExpanding?: boolean;
|
|
166
|
+
enablePagination?: boolean;
|
|
167
|
+
enableVirtualization?: boolean;
|
|
168
|
+
getSubRows?: (row: T) => T[] | undefined;
|
|
169
|
+
/**
|
|
170
|
+
* Whether a row can expand. Defaults to "any row" when `renderExpandedRow` is
|
|
171
|
+
* given (master-detail), otherwise to "only rows that have sub-rows".
|
|
172
|
+
*/
|
|
173
|
+
getRowCanExpand?: (row: Row<T>) => boolean;
|
|
174
|
+
getCellSpan?: DataTableGetCellSpan<T>;
|
|
175
|
+
sorting?: SortingState;
|
|
176
|
+
onSortingChange?: (state: SortingState) => void;
|
|
177
|
+
columnFilters?: ColumnFiltersState;
|
|
178
|
+
onColumnFiltersChange?: (state: ColumnFiltersState) => void;
|
|
179
|
+
globalFilter?: string;
|
|
180
|
+
onGlobalFilterChange?: (value: string) => void;
|
|
181
|
+
rowSelection?: RowSelectionState;
|
|
182
|
+
onRowSelectionChange?: (state: RowSelectionState) => void;
|
|
183
|
+
columnVisibility?: ColumnVisibilityState;
|
|
184
|
+
onColumnVisibilityChange?: (state: ColumnVisibilityState) => void;
|
|
185
|
+
columnOrder?: string[];
|
|
186
|
+
onColumnOrderChange?: (order: string[]) => void;
|
|
187
|
+
columnPinning?: ColumnPinningState;
|
|
188
|
+
onColumnPinningChange?: (state: ColumnPinningState) => void;
|
|
189
|
+
expanded?: ExpandedState;
|
|
190
|
+
onExpandedChange?: (state: ExpandedState) => void;
|
|
191
|
+
pagination?: PaginationState;
|
|
192
|
+
onPaginationChange?: (state: PaginationState) => void;
|
|
193
|
+
pageSizeOptions?: number[];
|
|
194
|
+
manualSorting?: boolean;
|
|
195
|
+
manualFiltering?: boolean;
|
|
196
|
+
manualPagination?: boolean;
|
|
197
|
+
rowCount?: number;
|
|
198
|
+
pageCount?: number;
|
|
199
|
+
onRowClick?: (row: Row<T>, event: React.MouseEvent<HTMLTableRowElement>) => void;
|
|
200
|
+
onReachEnd?: () => void;
|
|
201
|
+
onColumnReorder?: (details: {
|
|
202
|
+
from: number;
|
|
203
|
+
to: number;
|
|
204
|
+
columnId: string;
|
|
205
|
+
order: string[];
|
|
206
|
+
}) => void;
|
|
207
|
+
onRowReorder?: (details: {
|
|
208
|
+
from: number;
|
|
209
|
+
to: number;
|
|
210
|
+
rowId: string;
|
|
211
|
+
data: T[];
|
|
212
|
+
}) => void;
|
|
213
|
+
onCellEditCommit?: (details: {
|
|
214
|
+
rowId: string;
|
|
215
|
+
columnId: string;
|
|
216
|
+
value: unknown;
|
|
217
|
+
row: T;
|
|
218
|
+
}) => void;
|
|
219
|
+
/**
|
|
220
|
+
* Called once on mount with the table instance, for imperative access
|
|
221
|
+
* (`table.setPageIndex(…)`, `table.getSelectedRowModel()`, …).
|
|
222
|
+
*
|
|
223
|
+
* Methods stay live — they close over the core instance — but read
|
|
224
|
+
* `table.state` / `table.options` off this object with care: `useTable`
|
|
225
|
+
* returns a spread copy rather than the live instance, so the two fields
|
|
226
|
+
* captured here are a mount-time snapshot and never update. For live
|
|
227
|
+
* state use `renderToolbar`, which re-runs on render, or the instance's
|
|
228
|
+
* own `Subscribe`.
|
|
229
|
+
*/
|
|
230
|
+
onReady?: (table: TanstackTable<T>) => void;
|
|
231
|
+
enableInlineEdit?: boolean;
|
|
232
|
+
/**
|
|
233
|
+
* Per-row gate for the built-in edit action. Returning false disables the
|
|
234
|
+
* edit affordance and refuses `startEdit` for that row.
|
|
235
|
+
*/
|
|
236
|
+
canEditRow?: (row: Row<T>) => boolean;
|
|
237
|
+
/**
|
|
238
|
+
* Declarative actions rendered in the actions cell, each able to hide or
|
|
239
|
+
* disable itself per row.
|
|
240
|
+
*/
|
|
241
|
+
rowActions?: DataTableRowAction<T>[];
|
|
242
|
+
/** Controlled id of the row being edited (`null` = not editing). */
|
|
243
|
+
editingRowId?: string | null;
|
|
244
|
+
onEditingRowIdChange?: (rowId: string | null) => void;
|
|
245
|
+
onEditStart?: (details: {
|
|
246
|
+
rowId: string;
|
|
247
|
+
row: T;
|
|
248
|
+
}) => void;
|
|
249
|
+
onEditChange?: (details: {
|
|
250
|
+
rowId: string;
|
|
251
|
+
columnId: string;
|
|
252
|
+
value: unknown;
|
|
253
|
+
draft: Record<string, unknown>;
|
|
254
|
+
}) => void;
|
|
255
|
+
onEditCommit?: (details: {
|
|
256
|
+
rowId: string;
|
|
257
|
+
draft: Record<string, unknown>;
|
|
258
|
+
row: T;
|
|
259
|
+
}) => void;
|
|
260
|
+
onEditCancel?: (details: {
|
|
261
|
+
rowId: string;
|
|
262
|
+
dirty: boolean;
|
|
263
|
+
}) => void;
|
|
264
|
+
onEditValidationError?: (details: {
|
|
265
|
+
rowId: string;
|
|
266
|
+
errors: Record<string, string>;
|
|
267
|
+
}) => void;
|
|
268
|
+
/**
|
|
269
|
+
* Lock sorting/filtering/pagination/selection/reorder while a row is being
|
|
270
|
+
* edited (default `true`). Turning this off is possible but means the edited
|
|
271
|
+
* row can be re-sorted or filtered away mid-edit.
|
|
272
|
+
*/
|
|
273
|
+
lockInteractionsWhileEditing?: boolean;
|
|
274
|
+
/** Fired when a locked interaction is attempted during an edit. */
|
|
275
|
+
onInteractionBlocked?: (details: {
|
|
276
|
+
action: DataTableBlockedAction;
|
|
277
|
+
reason: "editing";
|
|
278
|
+
rowId: string;
|
|
279
|
+
}) => void;
|
|
280
|
+
filterRenderers?: Partial<Record<DataTableColumnType, DataTableFilterRenderer<T>>>;
|
|
281
|
+
editorRenderers?: Partial<Record<DataTableColumnType, DataTableEditorRenderer<T>>>;
|
|
282
|
+
/** Pin the row-actions column to the right edge (sticky). Default `true`. */
|
|
283
|
+
stickyActions?: boolean;
|
|
284
|
+
/**
|
|
285
|
+
* Human-readable label for a row, used by selection checkboxes and the edit
|
|
286
|
+
* action instead of the opaque row id.
|
|
287
|
+
*/
|
|
288
|
+
getRowLabel?: (row: Row<T>) => string;
|
|
289
|
+
/** Replace the body with skeleton rows while the first page is being fetched. */
|
|
290
|
+
loading?: boolean;
|
|
291
|
+
/** How many skeleton rows to render while `loading`. */
|
|
292
|
+
loadingRowCount?: number;
|
|
293
|
+
/** Append a skeleton row while an infinite-scroll page is being fetched. */
|
|
294
|
+
loadingMore?: boolean;
|
|
295
|
+
/**
|
|
296
|
+
* Everything configurable on the `Pagination` molecule, surfaced at table
|
|
297
|
+
* level. `count`/`page`/`pageSize` stay owned by the table's pagination
|
|
298
|
+
* state, and `getPageUrl` by the table too — paging runs through the
|
|
299
|
+
* table's own state, so `Pagination` is rendered with a placeholder href
|
|
300
|
+
* whose navigation is suppressed. Requiring it here would force every
|
|
301
|
+
* consumer who only wants (say) `siblingCount` to invent a `getPageUrl`
|
|
302
|
+
* that is then overridden.
|
|
303
|
+
*/
|
|
304
|
+
paginationProps?: Omit<PaginationProps, "count" | "page" | "pageSize" | "onPageChange" | "onChange" | "getPageUrl">;
|
|
305
|
+
renderToolbar?: (table: TanstackTable<T>) => ReactNode;
|
|
306
|
+
/**
|
|
307
|
+
* Custom actions trailing the toolbar search. At most
|
|
308
|
+
* `DATA_TABLE_MAX_TOOLBAR_ACTIONS` is recommended; more still render but warn.
|
|
309
|
+
*/
|
|
310
|
+
toolbarActions?: DataTableToolbarAction[];
|
|
311
|
+
renderEmpty?: () => ReactNode;
|
|
312
|
+
/**
|
|
313
|
+
* Row actions; receives edit-mode state so you can swap in save/cancel.
|
|
314
|
+
* Return `null` to render no actions for that row, or `undefined` to fall
|
|
315
|
+
* through to the built-in edit button.
|
|
316
|
+
*/
|
|
317
|
+
renderRowActions?: (row: Row<T>, state: {
|
|
318
|
+
isEditing: boolean;
|
|
319
|
+
startEdit: () => void;
|
|
320
|
+
commitEdit: () => void;
|
|
321
|
+
cancelEdit: () => void;
|
|
322
|
+
disabled: boolean;
|
|
323
|
+
}) => ReactNode;
|
|
324
|
+
/**
|
|
325
|
+
* Replace the filter control for a column. Return `null` for no filter at
|
|
326
|
+
* all, or `undefined` to fall through to the type-driven default.
|
|
327
|
+
*/
|
|
328
|
+
renderHeaderFilter?: (column: Column<T, unknown>) => ReactNode;
|
|
329
|
+
renderExpandedRow?: (row: Row<T>) => ReactNode;
|
|
330
|
+
slotProps?: {
|
|
331
|
+
root?: React.HTMLAttributes<HTMLTableElement>;
|
|
332
|
+
header?: React.HTMLAttributes<HTMLTableSectionElement>;
|
|
333
|
+
body?: React.HTMLAttributes<HTMLTableSectionElement>;
|
|
334
|
+
row?: React.HTMLAttributes<HTMLTableRowElement> & {
|
|
335
|
+
ref?: Ref<HTMLTableRowElement>;
|
|
336
|
+
};
|
|
337
|
+
};
|
|
338
|
+
translations?: DataTableTranslations;
|
|
339
|
+
/** Estimated row height (px) for virtualization. */
|
|
340
|
+
estimateRowHeight?: number;
|
|
341
|
+
/** Distance from bottom (px) that triggers `onReachEnd`. */
|
|
342
|
+
reachEndThreshold?: number;
|
|
343
|
+
};
|
|
344
|
+
export declare function DataTable<T extends RowData>(props: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
345
|
+
export declare namespace DataTable {
|
|
346
|
+
var Toolbar: ({ children, }: {
|
|
347
|
+
children: ReactNode;
|
|
348
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
349
|
+
var GlobalSearch: ({ className, }: {
|
|
350
|
+
className?: string;
|
|
351
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
352
|
+
var ToolbarActions: () => import("react/jsx-runtime").JSX.Element | null;
|
|
353
|
+
var ColumnVisibility: () => import("react/jsx-runtime").JSX.Element;
|
|
354
|
+
var Pagination: () => import("react/jsx-runtime").JSX.Element;
|
|
355
|
+
var displayName: string;
|
|
356
|
+
}
|
|
357
|
+
//# sourceMappingURL=data-table.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../../src/organisms/data-table.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* DataTable field registry — column-type driven filter and editor controls.
|
|
3
|
+
*
|
|
4
|
+
* A column declares `meta.type` (`string | int | number | boolean | enum |
|
|
5
|
+
* multiEnum | date | dateRange | custom`) and DataTable renders the matching
|
|
6
|
+
* ui-kit control in both the header filter row and the inline row editor, all
|
|
7
|
+
* at `size={size}`. Anything non-standard uses the per-column escape hatches
|
|
8
|
+
* `meta.renderFilter` / `meta.renderEditor`, or the table-wide
|
|
9
|
+
* `filterRenderers` / `editorRenderers` overrides.
|
|
10
|
+
*
|
|
11
|
+
* The kit has no date-picker component yet, so date fields use the native
|
|
12
|
+
* `Input type="date"` / `datetime-local`; swapping in a real picker later only
|
|
13
|
+
* touches this file.
|
|
14
|
+
*/
|
|
15
|
+
import type { RowData } from "@tanstack/react-table";
|
|
16
|
+
import type { ReactNode } from "react";
|
|
17
|
+
import { type SelectItem } from "../molecules/select";
|
|
18
|
+
import type { Column, DataTableFilterOperator, Row } from "./data-table.helpers";
|
|
19
|
+
export type DataTableColumnType = "string" | "int" | "number" | "boolean" | "enum" | "multiEnum" | "date" | "datetime" | "time" | "dateRange" | "custom";
|
|
20
|
+
/** Control size scale shared by the table and every nested form control. */
|
|
21
|
+
export type DataTableControlSize = "sm" | "md" | "lg";
|
|
22
|
+
export type DataTableOption = {
|
|
23
|
+
label: string;
|
|
24
|
+
value: string;
|
|
25
|
+
};
|
|
26
|
+
export type TextFilterValue = {
|
|
27
|
+
operator?: string;
|
|
28
|
+
value?: string;
|
|
29
|
+
};
|
|
30
|
+
export type NumberFilterValue = {
|
|
31
|
+
operator?: string;
|
|
32
|
+
value?: string;
|
|
33
|
+
to?: string;
|
|
34
|
+
};
|
|
35
|
+
export type BooleanFilterValue = {
|
|
36
|
+
value?: boolean;
|
|
37
|
+
};
|
|
38
|
+
export type EnumFilterValue = {
|
|
39
|
+
values?: string[];
|
|
40
|
+
};
|
|
41
|
+
export type DateRangeFilterValue = {
|
|
42
|
+
from?: string;
|
|
43
|
+
to?: string;
|
|
44
|
+
};
|
|
45
|
+
export type DataTableFilterValue = TextFilterValue | NumberFilterValue | BooleanFilterValue | EnumFilterValue | DateRangeFilterValue;
|
|
46
|
+
export type DataTableFilterContext<T extends RowData = RowData> = {
|
|
47
|
+
column: Column<T, unknown>;
|
|
48
|
+
/** Localised operator labels, keyed by operator. */
|
|
49
|
+
operatorLabels?: Partial<Record<string, string>>;
|
|
50
|
+
type: DataTableColumnType;
|
|
51
|
+
value: DataTableFilterValue | undefined;
|
|
52
|
+
setValue: (value: DataTableFilterValue | undefined) => void;
|
|
53
|
+
/** True while an inline edit locks the table's filter controls. */
|
|
54
|
+
disabled: boolean;
|
|
55
|
+
size: DataTableControlSize;
|
|
56
|
+
options: DataTableOption[];
|
|
57
|
+
};
|
|
58
|
+
export type DataTableEditorContext<T extends RowData = RowData> = {
|
|
59
|
+
row: Row<T>;
|
|
60
|
+
/** Id of the element rendering `error`, for `aria-describedby`. */
|
|
61
|
+
errorId?: string;
|
|
62
|
+
column: Column<T, unknown>;
|
|
63
|
+
type: DataTableColumnType;
|
|
64
|
+
value: unknown;
|
|
65
|
+
setValue: (value: unknown) => void;
|
|
66
|
+
disabled: boolean;
|
|
67
|
+
size: DataTableControlSize;
|
|
68
|
+
options: DataTableOption[];
|
|
69
|
+
/** Validation message for this field, if the last commit attempt failed. */
|
|
70
|
+
error?: string;
|
|
71
|
+
/** Commit the whole row (e.g. on Enter). */
|
|
72
|
+
commit: () => void;
|
|
73
|
+
/** Discard the row draft (e.g. on Escape). */
|
|
74
|
+
cancel: () => void;
|
|
75
|
+
};
|
|
76
|
+
export type DataTableFilterRenderer<T extends RowData = RowData> = (ctx: DataTableFilterContext<T>) => ReactNode;
|
|
77
|
+
export type DataTableEditorRenderer<T extends RowData = RowData> = (ctx: DataTableEditorContext<T>) => ReactNode;
|
|
78
|
+
/** Treats `null`, `undefined` and `""` alike — shared with the conditional filter. */
|
|
79
|
+
export declare const isBlank: (v: unknown) => v is "" | null | undefined;
|
|
80
|
+
/**
|
|
81
|
+
* The operators a text column offers, in menu order. This is the single list:
|
|
82
|
+
* the typed filter row renders it, the conditional (operator-based) filter
|
|
83
|
+
* imports it through `data-table.helpers`, and `matchText` below handles every
|
|
84
|
+
* entry. Adding one here without a branch in `matchText` makes that operator
|
|
85
|
+
* fall through to "contains".
|
|
86
|
+
*/
|
|
87
|
+
export declare const TEXT_FILTER_OPERATORS: {
|
|
88
|
+
label: string;
|
|
89
|
+
value: DataTableFilterOperator;
|
|
90
|
+
}[];
|
|
91
|
+
/** Same contract as `TEXT_FILTER_OPERATORS`, for numeric columns. */
|
|
92
|
+
export declare const NUMBER_FILTER_OPERATORS: {
|
|
93
|
+
label: string;
|
|
94
|
+
value: DataTableFilterOperator;
|
|
95
|
+
}[];
|
|
96
|
+
/** Human-readable column name for generated aria-labels: string header, else id. */
|
|
97
|
+
export declare function columnLabel<T extends RowData>(column: Column<T, unknown>): string;
|
|
98
|
+
export declare function FieldSelect({ items, value, ariaLabel, placeholder, disabled, size, invalid, onChange, }: {
|
|
99
|
+
items: SelectItem[];
|
|
100
|
+
value?: string;
|
|
101
|
+
ariaLabel?: string;
|
|
102
|
+
placeholder?: string;
|
|
103
|
+
disabled?: boolean;
|
|
104
|
+
size?: DataTableControlSize;
|
|
105
|
+
invalid?: boolean;
|
|
106
|
+
onChange: (value: string) => void;
|
|
107
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
108
|
+
export declare const DEFAULT_FILTER_RENDERERS: Record<DataTableColumnType, DataTableFilterRenderer>;
|
|
109
|
+
export declare const DEFAULT_EDITOR_RENDERERS: Record<DataTableColumnType, DataTableEditorRenderer>;
|
|
110
|
+
/** The `between` arm of `matchNumber`, split out to keep either half legible. */
|
|
111
|
+
/**
|
|
112
|
+
* Exported so `evaluateCondition` (data-table.helpers.ts) can share this
|
|
113
|
+
* exact bounds logic for its own `between` operator instead of keeping a
|
|
114
|
+
* second hand-copied implementation that could silently diverge from this
|
|
115
|
+
* one on an edge case (e.g. inclusive/exclusive bounds).
|
|
116
|
+
*/
|
|
117
|
+
export declare function matchBetween(n: number, cellHasNoNumber: boolean, f: NumberFilterValue): boolean;
|
|
118
|
+
export declare function typedFilterMatch(type: DataTableColumnType, cell: unknown, rawFilterValue: DataTableFilterValue): boolean;
|
|
119
|
+
//# sourceMappingURL=data-table.fields.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"data-table.fields.d.ts","sourceRoot":"","sources":["../../../src/organisms/data-table.fields.tsx"],"names":[],"mappings":"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"}
|