@entropy-softworks/ui 2026.910.3 → 2026.911.1
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/CHANGELOG.md +24 -0
- package/lib/components/data-table.d.ts +35 -1
- package/lib/components/data-table.d.ts.map +1 -1
- package/lib/components/data-table.jsx +162 -9
- package/lib/components/data-table.jsx.map +1 -1
- package/lib/components/index.d.ts +1 -1
- package/lib/components/index.d.ts.map +1 -1
- package/lib/components/index.js +1 -1
- package/lib/components/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/__tests__/data-table.test.ts +70 -1
- package/src/components/data-table.tsx +245 -9
- package/src/components/index.ts +3 -0
package/CHANGELOG.md
CHANGED
|
@@ -7,6 +7,30 @@ are CalVer — `YYYY.M.D` of the publish date, with leading zeros dropped (npm's
|
|
|
7
7
|
them), matching the `entropy-auth` crate. The `0.1.0` entry below predates the switch and was never
|
|
8
8
|
published to npm.
|
|
9
9
|
|
|
10
|
+
## 2026.911.1
|
|
11
|
+
|
|
12
|
+
### Added
|
|
13
|
+
- `DataTable` takes `resizable`, which lets the operator drag the boundary
|
|
14
|
+
between two columns. Widths seed from the measured container by each column's
|
|
15
|
+
`flex`, so a resizable table still fills its space without pixel widths at
|
|
16
|
+
the call site, and a drag moves width between the pair either side of the
|
|
17
|
+
handle rather than growing the table — the total is unchanged, so columns to
|
|
18
|
+
the right do not crawl sideways. A manual drag survives a window resize.
|
|
19
|
+
`distributeColumnWidths` and `resizeColumnPair` are exported and pure, with
|
|
20
|
+
seven tests covering flex weighting, fixed columns, the minimum width, and
|
|
21
|
+
the total-preserving property.
|
|
22
|
+
|
|
23
|
+
## 2026.910.3
|
|
24
|
+
|
|
25
|
+
### Added
|
|
26
|
+
- `SocialConnections` takes a `custom` list of providers this package ships no
|
|
27
|
+
brand mark for — Okta, Keycloak, a second Access instance — rendered after
|
|
28
|
+
the built-ins so learned button positions do not move. Each carries the
|
|
29
|
+
operator's own `iconUrl`; a blank, malformed or unreachable URL falls back to
|
|
30
|
+
a neutral key glyph rather than an empty square, so the button is always
|
|
31
|
+
pressable and always labelled. `customIcon` is exported and pure so the
|
|
32
|
+
fallback rule is testable without a render runtime.
|
|
33
|
+
|
|
10
34
|
## 2026.8.42
|
|
11
35
|
|
|
12
36
|
### Fixed
|
|
@@ -29,6 +29,20 @@ export interface DataTableProps<T> {
|
|
|
29
29
|
emptyState?: React.ReactNode;
|
|
30
30
|
/** Fallback empty message when `emptyState` is not provided. */
|
|
31
31
|
emptyMessage?: string;
|
|
32
|
+
/**
|
|
33
|
+
* Let the operator drag the boundary between two columns.
|
|
34
|
+
*
|
|
35
|
+
* Off by default, because it costs a measured container and per-column
|
|
36
|
+
* width state — a table that never needs it should not pay for it. On, the
|
|
37
|
+
* columns start at their `flex` share of the measured width (so the table
|
|
38
|
+
* still fills its space) and a drag moves width between the pair either
|
|
39
|
+
* side of the handle rather than growing the table.
|
|
40
|
+
*
|
|
41
|
+
* Web-oriented: the handles are 8px targets suited to a pointer. They
|
|
42
|
+
* render on native too and work, but a phone is not where a column gets
|
|
43
|
+
* dragged.
|
|
44
|
+
*/
|
|
45
|
+
resizable?: boolean;
|
|
32
46
|
className?: string;
|
|
33
47
|
}
|
|
34
48
|
/**
|
|
@@ -37,6 +51,26 @@ export interface DataTableProps<T> {
|
|
|
37
51
|
* without a render host.
|
|
38
52
|
*/
|
|
39
53
|
export declare function resolveColumnStyle<T>(column: DataTableColumn<T>): ViewStyle;
|
|
54
|
+
/** Below this a cell shows nothing but its own padding. */
|
|
55
|
+
export declare const MIN_COLUMN_WIDTH = 64;
|
|
56
|
+
/**
|
|
57
|
+
* Starting widths for a resizable table: the container divided by flex, with
|
|
58
|
+
* fixed-width columns taken out first.
|
|
59
|
+
*
|
|
60
|
+
* Pure so the layout rule is testable without a render host, and so the answer
|
|
61
|
+
* is the same on the first frame as after a resize — a table that measures
|
|
62
|
+
* itself and then computes differently is a table that jumps.
|
|
63
|
+
*/
|
|
64
|
+
export declare function distributeColumnWidths<T>(columns: DataTableColumn<T>[], totalWidth: number, minWidth?: number): number[];
|
|
65
|
+
/**
|
|
66
|
+
* Apply one drag to a pair of adjacent columns.
|
|
67
|
+
*
|
|
68
|
+
* Resizing takes width from the NEIGHBOUR rather than from the table, so the
|
|
69
|
+
* total stays put and the columns to the right do not crawl sideways as the
|
|
70
|
+
* handle moves. Both sides clamp at `minWidth`, so a drag past the limit stops
|
|
71
|
+
* instead of inverting the pair.
|
|
72
|
+
*/
|
|
73
|
+
export declare function resizeColumnPair(widths: number[], index: number, delta: number, minWidth?: number): number[];
|
|
40
74
|
/** Which body the table renders: skeleton rows, an empty placeholder, or data. */
|
|
41
75
|
export type DataTableBodyMode = "loading" | "empty" | "data";
|
|
42
76
|
/**
|
|
@@ -55,5 +89,5 @@ export declare function dataTableBodyMode(loading: boolean, rowCount: number): D
|
|
|
55
89
|
* `emptyMessage`). Columns size by fixed `width` or `flex`, support custom
|
|
56
90
|
* `render`, and alignment.
|
|
57
91
|
*/
|
|
58
|
-
export declare function DataTable<T>({ columns, data, keyExtractor, onRowPress, loading, loadingRowCount, emptyState, emptyMessage, className, }: DataTableProps<T>): React.JSX.Element;
|
|
92
|
+
export declare function DataTable<T>({ columns, data, keyExtractor, onRowPress, loading, loadingRowCount, emptyState, emptyMessage, resizable, className, }: DataTableProps<T>): React.JSX.Element;
|
|
59
93
|
//# sourceMappingURL=data-table.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../src/components/data-table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,
|
|
1
|
+
{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../src/components/data-table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAKtB,MAAM,WAAW,eAAe,CAAC,CAAC;IAChC,4EAA4E;IAC5E,GAAG,EAAE,MAAM,CAAC;IACZ,oBAAoB;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,kFAAkF;IAClF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oDAAoD;IACpD,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IACrC,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC;AAED,MAAM,WAAW,cAAc,CAAC,CAAC;IAC/B,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9B,IAAI,EAAE,CAAC,EAAE,CAAC;IACV,iEAAiE;IACjE,YAAY,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAChD,0DAA0D;IAC1D,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B,uDAAuD;IACvD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oEAAoE;IACpE,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,qDAAqD;IACrD,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,gEAAgE;IAChE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;;;;;;;;OAYG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAiBD;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,CAAC,EAAE,MAAM,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,SAAS,CAY3E;AAED,2DAA2D;AAC3D,eAAO,MAAM,gBAAgB,KAAK,CAAC;AAYnC;;;;;;;GAOG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,EACtC,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,EAC7B,UAAU,EAAE,MAAM,EAClB,QAAQ,SAAmB,GAC1B,MAAM,EAAE,CAeV;AAED;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAC9B,MAAM,EAAE,MAAM,EAAE,EAChB,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,MAAM,EACb,QAAQ,SAAmB,GAC1B,MAAM,EAAE,CAWV;AAoBD,kFAAkF;AAClF,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AAE7D;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAG,iBAAiB,CAKvF;AA4JD;;;;;;;;;GASG;AACH,wBAAgB,SAAS,CAAC,CAAC,EAAE,EAC3B,OAAO,EACP,IAAI,EACJ,YAAY,EACZ,UAAU,EACV,OAAe,EACf,eAAmB,EACnB,UAAU,EACV,YAAwB,EACxB,SAAiB,EACjB,SAAS,GACV,EAAE,cAAc,CAAC,CAAC,CAAC,qBAuFnB"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import { FlatList, Pressable, View } from "react-native";
|
|
2
|
+
import { FlatList, PanResponder, Pressable, View, } from "react-native";
|
|
3
3
|
import { cn } from "../utils/cn";
|
|
4
4
|
import { MutedText, Text } from "./text";
|
|
5
5
|
import { Skeleton } from "./skeleton";
|
|
@@ -31,6 +31,73 @@ export function resolveColumnStyle(column) {
|
|
|
31
31
|
}
|
|
32
32
|
return { ...base, flex: column.flex ?? 1 };
|
|
33
33
|
}
|
|
34
|
+
/** Below this a cell shows nothing but its own padding. */
|
|
35
|
+
export const MIN_COLUMN_WIDTH = 64;
|
|
36
|
+
/**
|
|
37
|
+
* The web pointer for a draggable boundary.
|
|
38
|
+
*
|
|
39
|
+
* `col-resize` is a CSS cursor react-native-web passes through, and RN's own
|
|
40
|
+
* `ViewStyle` types only the few cursors native supports — so this is typed as
|
|
41
|
+
* a plain style object rather than cast, which keeps the assertion off the
|
|
42
|
+
* component and out of every future reader's way. Native ignores the property.
|
|
43
|
+
*/
|
|
44
|
+
const WEB_COL_RESIZE_CURSOR = { cursor: "col-resize" };
|
|
45
|
+
/**
|
|
46
|
+
* Starting widths for a resizable table: the container divided by flex, with
|
|
47
|
+
* fixed-width columns taken out first.
|
|
48
|
+
*
|
|
49
|
+
* Pure so the layout rule is testable without a render host, and so the answer
|
|
50
|
+
* is the same on the first frame as after a resize — a table that measures
|
|
51
|
+
* itself and then computes differently is a table that jumps.
|
|
52
|
+
*/
|
|
53
|
+
export function distributeColumnWidths(columns, totalWidth, minWidth = MIN_COLUMN_WIDTH) {
|
|
54
|
+
const fixed = columns.reduce((sum, c) => sum + (typeof c.width === "number" ? c.width : 0), 0);
|
|
55
|
+
const flexColumns = columns.filter((c) => typeof c.width !== "number");
|
|
56
|
+
const flexTotal = flexColumns.reduce((sum, c) => sum + (c.flex ?? 1), 0) || 1;
|
|
57
|
+
// Never negative: a container narrower than its fixed columns would
|
|
58
|
+
// otherwise hand out negative widths and collapse every flexible cell.
|
|
59
|
+
const spare = Math.max(0, totalWidth - fixed);
|
|
60
|
+
return columns.map((c) => typeof c.width === "number"
|
|
61
|
+
? c.width
|
|
62
|
+
: Math.max(minWidth, (spare * (c.flex ?? 1)) / flexTotal));
|
|
63
|
+
}
|
|
64
|
+
/**
|
|
65
|
+
* Apply one drag to a pair of adjacent columns.
|
|
66
|
+
*
|
|
67
|
+
* Resizing takes width from the NEIGHBOUR rather than from the table, so the
|
|
68
|
+
* total stays put and the columns to the right do not crawl sideways as the
|
|
69
|
+
* handle moves. Both sides clamp at `minWidth`, so a drag past the limit stops
|
|
70
|
+
* instead of inverting the pair.
|
|
71
|
+
*/
|
|
72
|
+
export function resizeColumnPair(widths, index, delta, minWidth = MIN_COLUMN_WIDTH) {
|
|
73
|
+
const next = [...widths];
|
|
74
|
+
const left = next[index];
|
|
75
|
+
const right = next[index + 1];
|
|
76
|
+
if (left === undefined || right === undefined) {
|
|
77
|
+
return next;
|
|
78
|
+
}
|
|
79
|
+
const clamped = Math.max(minWidth - left, Math.min(delta, right - minWidth));
|
|
80
|
+
next[index] = left + clamped;
|
|
81
|
+
next[index + 1] = right - clamped;
|
|
82
|
+
return next;
|
|
83
|
+
}
|
|
84
|
+
/**
|
|
85
|
+
* A cell's style, with an explicit width when the table is resizable.
|
|
86
|
+
*
|
|
87
|
+
* Wraps {@link resolveColumnStyle} rather than replacing it: the flex path is
|
|
88
|
+
* still what a non-resizable table uses, and one function deciding padding and
|
|
89
|
+
* alignment keeps the two from drifting apart by a pixel.
|
|
90
|
+
*/
|
|
91
|
+
function cellStyle(column, width) {
|
|
92
|
+
const base = resolveColumnStyle(column);
|
|
93
|
+
if (width === undefined) {
|
|
94
|
+
return base;
|
|
95
|
+
}
|
|
96
|
+
// `flex` has to go, not just be overridden: a box with both grows past the
|
|
97
|
+
// width it was told to take.
|
|
98
|
+
const { flex: _flex, ...rest } = base;
|
|
99
|
+
return { ...rest, width };
|
|
100
|
+
}
|
|
34
101
|
/**
|
|
35
102
|
* Decide the body mode from the loading flag + row count. Loading wins over
|
|
36
103
|
* everything; an empty data set (when not loading) shows the empty state.
|
|
@@ -42,22 +109,76 @@ export function dataTableBodyMode(loading, rowCount) {
|
|
|
42
109
|
}
|
|
43
110
|
return rowCount === 0 ? "empty" : "data";
|
|
44
111
|
}
|
|
45
|
-
function HeaderRowInner({ columns }) {
|
|
112
|
+
function HeaderRowInner({ columns, widths, onResize, }) {
|
|
46
113
|
return (<View className={cn("flex-row border-b border-border bg-card dark:border-neutral-800 dark:bg-neutral-900/50")} accessibilityRole="header">
|
|
47
|
-
{columns.map((column) => (<View key={column.key} style={
|
|
114
|
+
{columns.map((column, i) => (<View key={column.key} style={cellStyle(column, widths?.[i])}
|
|
115
|
+
// `relative` so the handle can sit on this cell's trailing edge; it
|
|
116
|
+
// is absolutely placed and half of it overhangs the boundary, which
|
|
117
|
+
// is what makes the target land where the eye expects.
|
|
118
|
+
className="relative">
|
|
48
119
|
<Text className={cn("text-xs font-semibold uppercase tracking-wider text-muted-foreground dark:text-neutral-400", alignClass[column.align ?? "left"])} numberOfLines={1}>
|
|
49
120
|
{column.header}
|
|
50
121
|
</Text>
|
|
122
|
+
{onResize && i < columns.length - 1 ? (<ColumnResizeHandle onResize={(delta) => onResize(i, delta)}/>) : null}
|
|
51
123
|
</View>))}
|
|
52
124
|
</View>);
|
|
53
125
|
}
|
|
126
|
+
/**
|
|
127
|
+
* The draggable boundary between two header cells.
|
|
128
|
+
*
|
|
129
|
+
* A `PanResponder` rather than a gesture-handler recogniser: this package does
|
|
130
|
+
* not depend on `react-native-gesture-handler`, and a header handle needs no
|
|
131
|
+
* more than "how far has the pointer moved since it went down".
|
|
132
|
+
*
|
|
133
|
+
* `dx` is reported cumulatively from the gesture's start, so each move is fed
|
|
134
|
+
* the DIFFERENCE from the last one — passing `dx` straight through would apply
|
|
135
|
+
* the whole travel again on every frame and the column would run away.
|
|
136
|
+
*/
|
|
137
|
+
function ColumnResizeHandle({ onResize }) {
|
|
138
|
+
const last = React.useRef(0);
|
|
139
|
+
const responder = React.useMemo(() => PanResponder.create({
|
|
140
|
+
onStartShouldSetPanResponder: () => true,
|
|
141
|
+
onMoveShouldSetPanResponder: () => true,
|
|
142
|
+
onPanResponderGrant: () => {
|
|
143
|
+
last.current = 0;
|
|
144
|
+
},
|
|
145
|
+
onPanResponderMove: (_event, gesture) => {
|
|
146
|
+
onResize(gesture.dx - last.current);
|
|
147
|
+
last.current = gesture.dx;
|
|
148
|
+
},
|
|
149
|
+
onPanResponderRelease: () => {
|
|
150
|
+
last.current = 0;
|
|
151
|
+
},
|
|
152
|
+
}), [onResize]);
|
|
153
|
+
return (<View {...responder.panHandlers}
|
|
154
|
+
// Wider than it looks: the visible rule is 1px and the target is 9,
|
|
155
|
+
// because a 1px drag target is a 1px drag target.
|
|
156
|
+
style={[
|
|
157
|
+
{
|
|
158
|
+
position: "absolute",
|
|
159
|
+
top: 0,
|
|
160
|
+
bottom: 0,
|
|
161
|
+
right: -4,
|
|
162
|
+
width: 9,
|
|
163
|
+
alignItems: "center",
|
|
164
|
+
},
|
|
165
|
+
// `col-resize` is a WEB cursor and RN's `ViewStyle` only types the
|
|
166
|
+
// handful native supports, so it goes in as its own object rather than
|
|
167
|
+
// widening the whole style to `unknown`. Without it the pointer gives
|
|
168
|
+
// no sign the boundary can be dragged; react-native-web passes it
|
|
169
|
+
// through and native ignores it.
|
|
170
|
+
WEB_COL_RESIZE_CURSOR,
|
|
171
|
+
]} accessibilityRole="adjustable" accessibilityLabel="Resize column">
|
|
172
|
+
<View className="h-full w-px bg-border dark:bg-neutral-800"/>
|
|
173
|
+
</View>);
|
|
174
|
+
}
|
|
54
175
|
// Memoized so an unchanged row (stable `columns` + `onPress` identity) skips
|
|
55
176
|
// re-rendering when the FlatList recycles. `React.memo` on a generic function
|
|
56
177
|
// erases the type parameter, so we cast back to a generic-preserving signature.
|
|
57
178
|
const HeaderRow = React.memo(HeaderRowInner);
|
|
58
|
-
function DataRowInner({ row, columns, onPress, }) {
|
|
179
|
+
function DataRowInner({ row, columns, widths, onPress, }) {
|
|
59
180
|
const cells = (<>
|
|
60
|
-
{columns.map((column) => (<View key={column.key} style={
|
|
181
|
+
{columns.map((column, i) => (<View key={column.key} style={cellStyle(column, widths?.[i])}>
|
|
61
182
|
{column.render ? (column.render(row)) : (<Text className={cn("text-sm text-foreground", alignClass[column.align ?? "left"])}>
|
|
62
183
|
{String(row[column.key] ?? "")}
|
|
63
184
|
</Text>)}
|
|
@@ -81,14 +202,46 @@ const DataRow = React.memo(DataRowInner);
|
|
|
81
202
|
* `emptyMessage`). Columns size by fixed `width` or `flex`, support custom
|
|
82
203
|
* `render`, and alignment.
|
|
83
204
|
*/
|
|
84
|
-
export function DataTable({ columns, data, keyExtractor, onRowPress, loading = false, loadingRowCount = 5, emptyState, emptyMessage = "No data", className, }) {
|
|
205
|
+
export function DataTable({ columns, data, keyExtractor, onRowPress, loading = false, loadingRowCount = 5, emptyState, emptyMessage = "No data", resizable = false, className, }) {
|
|
85
206
|
const mode = dataTableBodyMode(loading, data.length);
|
|
207
|
+
// ── Resizable columns ──────────────────────────────────────────────────
|
|
208
|
+
//
|
|
209
|
+
// Widths are held here rather than on each column so a drag moves ONE pair
|
|
210
|
+
// and the table's total width is unchanged. They are seeded from the
|
|
211
|
+
// measured container, so a resizable table still fills its space instead of
|
|
212
|
+
// needing pixel widths written by hand at every call site.
|
|
213
|
+
//
|
|
214
|
+
// A manual drag wins over a re-seed: `touched` stops a window resize from
|
|
215
|
+
// discarding the operator's own column widths, which is what made the first
|
|
216
|
+
// cut feel broken — every layout pass reset them.
|
|
217
|
+
const [tableWidth, setTableWidth] = React.useState(0);
|
|
218
|
+
const [widths, setWidths] = React.useState(null);
|
|
219
|
+
const touched = React.useRef(false);
|
|
220
|
+
const onLayout = React.useCallback((e) => {
|
|
221
|
+
const next = e.nativeEvent.layout.width;
|
|
222
|
+
setTableWidth((prev) => (Math.abs(prev - next) < 1 ? prev : next));
|
|
223
|
+
}, []);
|
|
224
|
+
React.useEffect(() => {
|
|
225
|
+
if (!resizable || tableWidth <= 0 || touched.current) {
|
|
226
|
+
return;
|
|
227
|
+
}
|
|
228
|
+
setWidths(distributeColumnWidths(columns, tableWidth));
|
|
229
|
+
// `columns` is in the deps because adding or removing one has to
|
|
230
|
+
// redistribute; a caller that rebuilds the array every render should
|
|
231
|
+
// memoize it, which every manager in this estate already does for the
|
|
232
|
+
// row-recycling reason below.
|
|
233
|
+
}, [resizable, tableWidth, columns]);
|
|
234
|
+
const handleResize = React.useCallback((index, delta) => {
|
|
235
|
+
touched.current = true;
|
|
236
|
+
setWidths((prev) => (prev ? resizeColumnPair(prev, index, delta) : prev));
|
|
237
|
+
}, []);
|
|
238
|
+
const resolved = resizable ? (widths ?? undefined) : undefined;
|
|
86
239
|
// Stable `renderItem` identity (only re-created when `columns`/`onRowPress`
|
|
87
240
|
// change) so the memoized `DataRow` can recycle. `extraData` tells FlatList
|
|
88
241
|
// to re-render rows when either of those closed-over deps change.
|
|
89
|
-
const renderItem = React.useCallback(({ item }) => <DataRow row={item} columns={columns} onPress={onRowPress}
|
|
90
|
-
return (<View className={cn("overflow-hidden rounded-lg border border-border dark:border-neutral-800", className)}>
|
|
91
|
-
<HeaderRow columns={columns}/>
|
|
242
|
+
const renderItem = React.useCallback(({ item }) => (<DataRow row={item} columns={columns} widths={resolved} onPress={onRowPress}/>), [columns, onRowPress, resolved]);
|
|
243
|
+
return (<View onLayout={resizable ? onLayout : undefined} className={cn("overflow-hidden rounded-lg border border-border dark:border-neutral-800", className)}>
|
|
244
|
+
<HeaderRow columns={columns} widths={resolved} onResize={resizable && resolved ? handleResize : undefined}/>
|
|
92
245
|
{mode === "loading" ? (<View>
|
|
93
246
|
{Array.from({ length: loadingRowCount }).map((_, i) => (<View key={i} className="flex-row items-center border-b border-border px-3 py-3 dark:border-neutral-800">
|
|
94
247
|
<Skeleton className="h-4 flex-1"/>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"data-table.jsx","sourceRoot":"","sources":["../../src/components/data-table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,
|
|
1
|
+
{"version":3,"file":"data-table.jsx","sourceRoot":"","sources":["../../src/components/data-table.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@ export { Button, IconButton, type ButtonProps } from "./button";
|
|
|
2
2
|
export { Card, CardHeader, CardContent, CardFooter, CardTitle, CardDescription, type CardProps, type CardTitleProps, type CardDescriptionProps, } from "./card";
|
|
3
3
|
export { Checkbox } from "./checkbox";
|
|
4
4
|
export { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem, ContextMenuSeparator, ContextMenuLabel, } from "./context-menu";
|
|
5
|
-
export { DataTable, resolveColumnStyle, dataTableBodyMode, type DataTableProps, type DataTableColumn, type DataTableBodyMode, } from "./data-table";
|
|
5
|
+
export { DataTable, resolveColumnStyle, dataTableBodyMode, distributeColumnWidths, resizeColumnPair, MIN_COLUMN_WIDTH, type DataTableProps, type DataTableColumn, type DataTableBodyMode, } from "./data-table";
|
|
6
6
|
export { Dialog, DialogContent, DialogFooter, DialogButton, ConfirmDialog } from "./dialog";
|
|
7
7
|
export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuLabel, DropdownMenuSeparator, } from "./dropdown-menu";
|
|
8
8
|
export { EntropyMark, EntropyByline, ENTROPY_MARK_VIEWBOX, ENTROPY_MARK_ASPECT, ENTROPY_MARK_PATH, ENTROPY_MARK_STEP, type EntropyMarkProps, type EntropyBylineProps, } from "./entropy-mark";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"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"}
|
package/lib/components/index.js
CHANGED
|
@@ -4,7 +4,7 @@ export { Button, IconButton } from "./button";
|
|
|
4
4
|
export { Card, CardHeader, CardContent, CardFooter, CardTitle, CardDescription, } from "./card";
|
|
5
5
|
export { Checkbox } from "./checkbox";
|
|
6
6
|
export { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem, ContextMenuSeparator, ContextMenuLabel, } from "./context-menu";
|
|
7
|
-
export { DataTable, resolveColumnStyle, dataTableBodyMode, } from "./data-table";
|
|
7
|
+
export { DataTable, resolveColumnStyle, dataTableBodyMode, distributeColumnWidths, resizeColumnPair, MIN_COLUMN_WIDTH, } from "./data-table";
|
|
8
8
|
export { Dialog, DialogContent, DialogFooter, DialogButton, ConfirmDialog } from "./dialog";
|
|
9
9
|
export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuLabel, DropdownMenuSeparator, } from "./dropdown-menu";
|
|
10
10
|
export { EntropyMark, EntropyByline, ENTROPY_MARK_VIEWBOX, ENTROPY_MARK_ASPECT, ENTROPY_MARK_PATH, ENTROPY_MARK_STEP, } from "./entropy-mark";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,wEAAwE;AACxE,uDAAuD;AAEvD,OAAO,EAAE,MAAM,EAAE,UAAU,EAAoB,MAAM,UAAU,CAAC;AAEhE,OAAO,EACL,IAAI,EACJ,UAAU,EACV,WAAW,EACX,UAAU,EACV,SAAS,EACT,eAAe,GAIhB,MAAM,QAAQ,CAAC;AAEhB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EACL,WAAW,EACX,kBAAkB,EAClB,kBAAkB,EAClB,eAAe,EACf,oBAAoB,EACpB,gBAAgB,GACjB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EACL,SAAS,EACT,kBAAkB,EAClB,iBAAiB,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,4 +1,11 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
resolveColumnStyle,
|
|
3
|
+
dataTableBodyMode,
|
|
4
|
+
distributeColumnWidths,
|
|
5
|
+
resizeColumnPair,
|
|
6
|
+
MIN_COLUMN_WIDTH,
|
|
7
|
+
type DataTableColumn,
|
|
8
|
+
} from "../data-table";
|
|
2
9
|
|
|
3
10
|
// The component module pulls in `react-native-reanimated` (via Skeleton),
|
|
4
11
|
// which ships ESM that the unit-suite babel transform does not process. The
|
|
@@ -92,3 +99,65 @@ describe("DataTable column rendering", () => {
|
|
|
92
99
|
expect(out).toBe("SAM");
|
|
93
100
|
});
|
|
94
101
|
});
|
|
102
|
+
|
|
103
|
+
describe("distributeColumnWidths", () => {
|
|
104
|
+
const cols = [
|
|
105
|
+
{ key: "a", header: "A" },
|
|
106
|
+
{ key: "b", header: "B" },
|
|
107
|
+
];
|
|
108
|
+
|
|
109
|
+
it("divides the container by flex so the table fills its space", () => {
|
|
110
|
+
expect(distributeColumnWidths(cols, 600)).toEqual([300, 300]);
|
|
111
|
+
});
|
|
112
|
+
|
|
113
|
+
it("weights by each column's flex", () => {
|
|
114
|
+
const weighted = [
|
|
115
|
+
{ key: "a", header: "A", flex: 3 },
|
|
116
|
+
{ key: "b", header: "B", flex: 1 },
|
|
117
|
+
];
|
|
118
|
+
expect(distributeColumnWidths(weighted, 800)).toEqual([600, 200]);
|
|
119
|
+
});
|
|
120
|
+
|
|
121
|
+
it("takes fixed widths out before dividing the rest", () => {
|
|
122
|
+
const mixed = [
|
|
123
|
+
{ key: "a", header: "A", width: 100 },
|
|
124
|
+
{ key: "b", header: "B" },
|
|
125
|
+
{ key: "c", header: "C" },
|
|
126
|
+
];
|
|
127
|
+
expect(distributeColumnWidths(mixed, 500)).toEqual([100, 200, 200]);
|
|
128
|
+
});
|
|
129
|
+
|
|
130
|
+
it("never hands out less than the minimum, or a negative", () => {
|
|
131
|
+
// A container narrower than its fixed columns: the flexible ones would
|
|
132
|
+
// otherwise get negative widths and collapse every cell in the row.
|
|
133
|
+
const mixed = [
|
|
134
|
+
{ key: "a", header: "A", width: 400 },
|
|
135
|
+
{ key: "b", header: "B" },
|
|
136
|
+
];
|
|
137
|
+
expect(distributeColumnWidths(mixed, 100)).toEqual([400, MIN_COLUMN_WIDTH]);
|
|
138
|
+
});
|
|
139
|
+
});
|
|
140
|
+
|
|
141
|
+
describe("resizeColumnPair", () => {
|
|
142
|
+
it("moves width from the neighbour, leaving the total alone", () => {
|
|
143
|
+
const before = [200, 200, 200];
|
|
144
|
+
const after = resizeColumnPair(before, 0, 40);
|
|
145
|
+
expect(after).toEqual([240, 160, 200]);
|
|
146
|
+
// The property that matters: dragging a boundary must not change how wide
|
|
147
|
+
// the table is, or every column to the right crawls sideways.
|
|
148
|
+
expect(after.reduce((a, b) => a + b, 0)).toBe(
|
|
149
|
+
before.reduce((a, b) => a + b, 0)
|
|
150
|
+
);
|
|
151
|
+
});
|
|
152
|
+
|
|
153
|
+
it("stops at the minimum rather than inverting the pair", () => {
|
|
154
|
+
const after = resizeColumnPair([100, 100], 0, 500);
|
|
155
|
+
expect(after).toEqual([200 - MIN_COLUMN_WIDTH, MIN_COLUMN_WIDTH]);
|
|
156
|
+
const back = resizeColumnPair([100, 100], 0, -500);
|
|
157
|
+
expect(back).toEqual([MIN_COLUMN_WIDTH, 200 - MIN_COLUMN_WIDTH]);
|
|
158
|
+
});
|
|
159
|
+
|
|
160
|
+
it("is a no-op past the last boundary", () => {
|
|
161
|
+
expect(resizeColumnPair([100, 100], 1, 20)).toEqual([100, 100]);
|
|
162
|
+
});
|
|
163
|
+
});
|
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
FlatList,
|
|
4
|
+
PanResponder,
|
|
5
|
+
Pressable,
|
|
6
|
+
View,
|
|
7
|
+
type LayoutChangeEvent,
|
|
8
|
+
type ListRenderItem,
|
|
9
|
+
type ViewStyle,
|
|
10
|
+
} from "react-native";
|
|
3
11
|
import { cn } from "../utils/cn";
|
|
4
12
|
import { MutedText, Text } from "./text";
|
|
5
13
|
import { Skeleton } from "./skeleton";
|
|
@@ -34,6 +42,20 @@ export interface DataTableProps<T> {
|
|
|
34
42
|
emptyState?: React.ReactNode;
|
|
35
43
|
/** Fallback empty message when `emptyState` is not provided. */
|
|
36
44
|
emptyMessage?: string;
|
|
45
|
+
/**
|
|
46
|
+
* Let the operator drag the boundary between two columns.
|
|
47
|
+
*
|
|
48
|
+
* Off by default, because it costs a measured container and per-column
|
|
49
|
+
* width state — a table that never needs it should not pay for it. On, the
|
|
50
|
+
* columns start at their `flex` share of the measured width (so the table
|
|
51
|
+
* still fills its space) and a drag moves width between the pair either
|
|
52
|
+
* side of the handle rather than growing the table.
|
|
53
|
+
*
|
|
54
|
+
* Web-oriented: the handles are 8px targets suited to a pointer. They
|
|
55
|
+
* render on native too and work, but a phone is not where a column gets
|
|
56
|
+
* dragged.
|
|
57
|
+
*/
|
|
58
|
+
resizable?: boolean;
|
|
37
59
|
className?: string;
|
|
38
60
|
}
|
|
39
61
|
|
|
@@ -71,6 +93,92 @@ export function resolveColumnStyle<T>(column: DataTableColumn<T>): ViewStyle {
|
|
|
71
93
|
return { ...base, flex: column.flex ?? 1 };
|
|
72
94
|
}
|
|
73
95
|
|
|
96
|
+
/** Below this a cell shows nothing but its own padding. */
|
|
97
|
+
export const MIN_COLUMN_WIDTH = 64;
|
|
98
|
+
|
|
99
|
+
/**
|
|
100
|
+
* The web pointer for a draggable boundary.
|
|
101
|
+
*
|
|
102
|
+
* `col-resize` is a CSS cursor react-native-web passes through, and RN's own
|
|
103
|
+
* `ViewStyle` types only the few cursors native supports — so this is typed as
|
|
104
|
+
* a plain style object rather than cast, which keeps the assertion off the
|
|
105
|
+
* component and out of every future reader's way. Native ignores the property.
|
|
106
|
+
*/
|
|
107
|
+
const WEB_COL_RESIZE_CURSOR = { cursor: "col-resize" } as unknown as ViewStyle;
|
|
108
|
+
|
|
109
|
+
/**
|
|
110
|
+
* Starting widths for a resizable table: the container divided by flex, with
|
|
111
|
+
* fixed-width columns taken out first.
|
|
112
|
+
*
|
|
113
|
+
* Pure so the layout rule is testable without a render host, and so the answer
|
|
114
|
+
* is the same on the first frame as after a resize — a table that measures
|
|
115
|
+
* itself and then computes differently is a table that jumps.
|
|
116
|
+
*/
|
|
117
|
+
export function distributeColumnWidths<T>(
|
|
118
|
+
columns: DataTableColumn<T>[],
|
|
119
|
+
totalWidth: number,
|
|
120
|
+
minWidth = MIN_COLUMN_WIDTH
|
|
121
|
+
): number[] {
|
|
122
|
+
const fixed = columns.reduce(
|
|
123
|
+
(sum, c) => sum + (typeof c.width === "number" ? c.width : 0),
|
|
124
|
+
0
|
|
125
|
+
);
|
|
126
|
+
const flexColumns = columns.filter((c) => typeof c.width !== "number");
|
|
127
|
+
const flexTotal = flexColumns.reduce((sum, c) => sum + (c.flex ?? 1), 0) || 1;
|
|
128
|
+
// Never negative: a container narrower than its fixed columns would
|
|
129
|
+
// otherwise hand out negative widths and collapse every flexible cell.
|
|
130
|
+
const spare = Math.max(0, totalWidth - fixed);
|
|
131
|
+
return columns.map((c) =>
|
|
132
|
+
typeof c.width === "number"
|
|
133
|
+
? c.width
|
|
134
|
+
: Math.max(minWidth, (spare * (c.flex ?? 1)) / flexTotal)
|
|
135
|
+
);
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
/**
|
|
139
|
+
* Apply one drag to a pair of adjacent columns.
|
|
140
|
+
*
|
|
141
|
+
* Resizing takes width from the NEIGHBOUR rather than from the table, so the
|
|
142
|
+
* total stays put and the columns to the right do not crawl sideways as the
|
|
143
|
+
* handle moves. Both sides clamp at `minWidth`, so a drag past the limit stops
|
|
144
|
+
* instead of inverting the pair.
|
|
145
|
+
*/
|
|
146
|
+
export function resizeColumnPair(
|
|
147
|
+
widths: number[],
|
|
148
|
+
index: number,
|
|
149
|
+
delta: number,
|
|
150
|
+
minWidth = MIN_COLUMN_WIDTH
|
|
151
|
+
): number[] {
|
|
152
|
+
const next = [...widths];
|
|
153
|
+
const left = next[index];
|
|
154
|
+
const right = next[index + 1];
|
|
155
|
+
if (left === undefined || right === undefined) {
|
|
156
|
+
return next;
|
|
157
|
+
}
|
|
158
|
+
const clamped = Math.max(minWidth - left, Math.min(delta, right - minWidth));
|
|
159
|
+
next[index] = left + clamped;
|
|
160
|
+
next[index + 1] = right - clamped;
|
|
161
|
+
return next;
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
/**
|
|
165
|
+
* A cell's style, with an explicit width when the table is resizable.
|
|
166
|
+
*
|
|
167
|
+
* Wraps {@link resolveColumnStyle} rather than replacing it: the flex path is
|
|
168
|
+
* still what a non-resizable table uses, and one function deciding padding and
|
|
169
|
+
* alignment keeps the two from drifting apart by a pixel.
|
|
170
|
+
*/
|
|
171
|
+
function cellStyle<T>(column: DataTableColumn<T>, width?: number): ViewStyle {
|
|
172
|
+
const base = resolveColumnStyle(column);
|
|
173
|
+
if (width === undefined) {
|
|
174
|
+
return base;
|
|
175
|
+
}
|
|
176
|
+
// `flex` has to go, not just be overridden: a box with both grows past the
|
|
177
|
+
// width it was told to take.
|
|
178
|
+
const { flex: _flex, ...rest } = base;
|
|
179
|
+
return { ...rest, width };
|
|
180
|
+
}
|
|
181
|
+
|
|
74
182
|
/** Which body the table renders: skeleton rows, an empty placeholder, or data. */
|
|
75
183
|
export type DataTableBodyMode = "loading" | "empty" | "data";
|
|
76
184
|
|
|
@@ -86,7 +194,16 @@ export function dataTableBodyMode(loading: boolean, rowCount: number): DataTable
|
|
|
86
194
|
return rowCount === 0 ? "empty" : "data";
|
|
87
195
|
}
|
|
88
196
|
|
|
89
|
-
function HeaderRowInner<T>({
|
|
197
|
+
function HeaderRowInner<T>({
|
|
198
|
+
columns,
|
|
199
|
+
widths,
|
|
200
|
+
onResize,
|
|
201
|
+
}: {
|
|
202
|
+
columns: DataTableColumn<T>[];
|
|
203
|
+
/** Resolved pixel widths, when the table is resizable. */
|
|
204
|
+
widths?: number[];
|
|
205
|
+
onResize?: (index: number, delta: number) => void;
|
|
206
|
+
}) {
|
|
90
207
|
return (
|
|
91
208
|
<View
|
|
92
209
|
className={cn(
|
|
@@ -94,8 +211,15 @@ function HeaderRowInner<T>({ columns }: { columns: DataTableColumn<T>[] }) {
|
|
|
94
211
|
)}
|
|
95
212
|
accessibilityRole="header"
|
|
96
213
|
>
|
|
97
|
-
{columns.map((column) => (
|
|
98
|
-
<View
|
|
214
|
+
{columns.map((column, i) => (
|
|
215
|
+
<View
|
|
216
|
+
key={column.key}
|
|
217
|
+
style={cellStyle(column, widths?.[i])}
|
|
218
|
+
// `relative` so the handle can sit on this cell's trailing edge; it
|
|
219
|
+
// is absolutely placed and half of it overhangs the boundary, which
|
|
220
|
+
// is what makes the target land where the eye expects.
|
|
221
|
+
className="relative"
|
|
222
|
+
>
|
|
99
223
|
<Text
|
|
100
224
|
className={cn(
|
|
101
225
|
"text-xs font-semibold uppercase tracking-wider text-muted-foreground dark:text-neutral-400",
|
|
@@ -105,12 +229,76 @@ function HeaderRowInner<T>({ columns }: { columns: DataTableColumn<T>[] }) {
|
|
|
105
229
|
>
|
|
106
230
|
{column.header}
|
|
107
231
|
</Text>
|
|
232
|
+
{onResize && i < columns.length - 1 ? (
|
|
233
|
+
<ColumnResizeHandle onResize={(delta) => onResize(i, delta)} />
|
|
234
|
+
) : null}
|
|
108
235
|
</View>
|
|
109
236
|
))}
|
|
110
237
|
</View>
|
|
111
238
|
);
|
|
112
239
|
}
|
|
113
240
|
|
|
241
|
+
/**
|
|
242
|
+
* The draggable boundary between two header cells.
|
|
243
|
+
*
|
|
244
|
+
* A `PanResponder` rather than a gesture-handler recogniser: this package does
|
|
245
|
+
* not depend on `react-native-gesture-handler`, and a header handle needs no
|
|
246
|
+
* more than "how far has the pointer moved since it went down".
|
|
247
|
+
*
|
|
248
|
+
* `dx` is reported cumulatively from the gesture's start, so each move is fed
|
|
249
|
+
* the DIFFERENCE from the last one — passing `dx` straight through would apply
|
|
250
|
+
* the whole travel again on every frame and the column would run away.
|
|
251
|
+
*/
|
|
252
|
+
function ColumnResizeHandle({ onResize }: { onResize: (delta: number) => void }) {
|
|
253
|
+
const last = React.useRef(0);
|
|
254
|
+
const responder = React.useMemo(
|
|
255
|
+
() =>
|
|
256
|
+
PanResponder.create({
|
|
257
|
+
onStartShouldSetPanResponder: () => true,
|
|
258
|
+
onMoveShouldSetPanResponder: () => true,
|
|
259
|
+
onPanResponderGrant: () => {
|
|
260
|
+
last.current = 0;
|
|
261
|
+
},
|
|
262
|
+
onPanResponderMove: (_event, gesture) => {
|
|
263
|
+
onResize(gesture.dx - last.current);
|
|
264
|
+
last.current = gesture.dx;
|
|
265
|
+
},
|
|
266
|
+
onPanResponderRelease: () => {
|
|
267
|
+
last.current = 0;
|
|
268
|
+
},
|
|
269
|
+
}),
|
|
270
|
+
[onResize]
|
|
271
|
+
);
|
|
272
|
+
|
|
273
|
+
return (
|
|
274
|
+
<View
|
|
275
|
+
{...responder.panHandlers}
|
|
276
|
+
// Wider than it looks: the visible rule is 1px and the target is 9,
|
|
277
|
+
// because a 1px drag target is a 1px drag target.
|
|
278
|
+
style={[
|
|
279
|
+
{
|
|
280
|
+
position: "absolute",
|
|
281
|
+
top: 0,
|
|
282
|
+
bottom: 0,
|
|
283
|
+
right: -4,
|
|
284
|
+
width: 9,
|
|
285
|
+
alignItems: "center",
|
|
286
|
+
},
|
|
287
|
+
// `col-resize` is a WEB cursor and RN's `ViewStyle` only types the
|
|
288
|
+
// handful native supports, so it goes in as its own object rather than
|
|
289
|
+
// widening the whole style to `unknown`. Without it the pointer gives
|
|
290
|
+
// no sign the boundary can be dragged; react-native-web passes it
|
|
291
|
+
// through and native ignores it.
|
|
292
|
+
WEB_COL_RESIZE_CURSOR,
|
|
293
|
+
]}
|
|
294
|
+
accessibilityRole="adjustable"
|
|
295
|
+
accessibilityLabel="Resize column"
|
|
296
|
+
>
|
|
297
|
+
<View className="h-full w-px bg-border dark:bg-neutral-800" />
|
|
298
|
+
</View>
|
|
299
|
+
);
|
|
300
|
+
}
|
|
301
|
+
|
|
114
302
|
// Memoized so an unchanged row (stable `columns` + `onPress` identity) skips
|
|
115
303
|
// re-rendering when the FlatList recycles. `React.memo` on a generic function
|
|
116
304
|
// erases the type parameter, so we cast back to a generic-preserving signature.
|
|
@@ -119,16 +307,18 @@ const HeaderRow = React.memo(HeaderRowInner) as typeof HeaderRowInner;
|
|
|
119
307
|
function DataRowInner<T>({
|
|
120
308
|
row,
|
|
121
309
|
columns,
|
|
310
|
+
widths,
|
|
122
311
|
onPress,
|
|
123
312
|
}: {
|
|
124
313
|
row: T;
|
|
125
314
|
columns: DataTableColumn<T>[];
|
|
315
|
+
widths?: number[];
|
|
126
316
|
onPress?: (row: T) => void;
|
|
127
317
|
}) {
|
|
128
318
|
const cells = (
|
|
129
319
|
<>
|
|
130
|
-
{columns.map((column) => (
|
|
131
|
-
<View key={column.key} style={
|
|
320
|
+
{columns.map((column, i) => (
|
|
321
|
+
<View key={column.key} style={cellStyle(column, widths?.[i])}>
|
|
132
322
|
{column.render ? (
|
|
133
323
|
column.render(row)
|
|
134
324
|
) : (
|
|
@@ -177,24 +367,70 @@ export function DataTable<T>({
|
|
|
177
367
|
loadingRowCount = 5,
|
|
178
368
|
emptyState,
|
|
179
369
|
emptyMessage = "No data",
|
|
370
|
+
resizable = false,
|
|
180
371
|
className,
|
|
181
372
|
}: DataTableProps<T>) {
|
|
182
373
|
const mode = dataTableBodyMode(loading, data.length);
|
|
374
|
+
|
|
375
|
+
// ── Resizable columns ──────────────────────────────────────────────────
|
|
376
|
+
//
|
|
377
|
+
// Widths are held here rather than on each column so a drag moves ONE pair
|
|
378
|
+
// and the table's total width is unchanged. They are seeded from the
|
|
379
|
+
// measured container, so a resizable table still fills its space instead of
|
|
380
|
+
// needing pixel widths written by hand at every call site.
|
|
381
|
+
//
|
|
382
|
+
// A manual drag wins over a re-seed: `touched` stops a window resize from
|
|
383
|
+
// discarding the operator's own column widths, which is what made the first
|
|
384
|
+
// cut feel broken — every layout pass reset them.
|
|
385
|
+
const [tableWidth, setTableWidth] = React.useState(0);
|
|
386
|
+
const [widths, setWidths] = React.useState<number[] | null>(null);
|
|
387
|
+
const touched = React.useRef(false);
|
|
388
|
+
|
|
389
|
+
const onLayout = React.useCallback((e: LayoutChangeEvent) => {
|
|
390
|
+
const next = e.nativeEvent.layout.width;
|
|
391
|
+
setTableWidth((prev) => (Math.abs(prev - next) < 1 ? prev : next));
|
|
392
|
+
}, []);
|
|
393
|
+
|
|
394
|
+
React.useEffect(() => {
|
|
395
|
+
if (!resizable || tableWidth <= 0 || touched.current) {
|
|
396
|
+
return;
|
|
397
|
+
}
|
|
398
|
+
setWidths(distributeColumnWidths(columns, tableWidth));
|
|
399
|
+
// `columns` is in the deps because adding or removing one has to
|
|
400
|
+
// redistribute; a caller that rebuilds the array every render should
|
|
401
|
+
// memoize it, which every manager in this estate already does for the
|
|
402
|
+
// row-recycling reason below.
|
|
403
|
+
}, [resizable, tableWidth, columns]);
|
|
404
|
+
|
|
405
|
+
const handleResize = React.useCallback((index: number, delta: number) => {
|
|
406
|
+
touched.current = true;
|
|
407
|
+
setWidths((prev) => (prev ? resizeColumnPair(prev, index, delta) : prev));
|
|
408
|
+
}, []);
|
|
409
|
+
|
|
410
|
+
const resolved = resizable ? (widths ?? undefined) : undefined;
|
|
411
|
+
|
|
183
412
|
// Stable `renderItem` identity (only re-created when `columns`/`onRowPress`
|
|
184
413
|
// change) so the memoized `DataRow` can recycle. `extraData` tells FlatList
|
|
185
414
|
// to re-render rows when either of those closed-over deps change.
|
|
186
415
|
const renderItem = React.useCallback<ListRenderItem<T>>(
|
|
187
|
-
({ item }) =>
|
|
188
|
-
|
|
416
|
+
({ item }) => (
|
|
417
|
+
<DataRow row={item} columns={columns} widths={resolved} onPress={onRowPress} />
|
|
418
|
+
),
|
|
419
|
+
[columns, onRowPress, resolved]
|
|
189
420
|
);
|
|
190
421
|
return (
|
|
191
422
|
<View
|
|
423
|
+
onLayout={resizable ? onLayout : undefined}
|
|
192
424
|
className={cn(
|
|
193
425
|
"overflow-hidden rounded-lg border border-border dark:border-neutral-800",
|
|
194
426
|
className
|
|
195
427
|
)}
|
|
196
428
|
>
|
|
197
|
-
<HeaderRow
|
|
429
|
+
<HeaderRow
|
|
430
|
+
columns={columns}
|
|
431
|
+
widths={resolved}
|
|
432
|
+
onResize={resizable && resolved ? handleResize : undefined}
|
|
433
|
+
/>
|
|
198
434
|
{mode === "loading" ? (
|
|
199
435
|
<View>
|
|
200
436
|
{Array.from({ length: loadingRowCount }).map((_, i) => (
|