@vuu-ui/vuu-table 0.13.114 → 0.13.115-alpha.2

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.
Files changed (95) hide show
  1. package/cjs/Row.js +16 -19
  2. package/cjs/Row.js.map +1 -1
  3. package/cjs/Table.js +8 -15
  4. package/cjs/Table.js.map +1 -1
  5. package/cjs/bulk-edit/useBulkEditPanel.js +6 -7
  6. package/cjs/bulk-edit/useBulkEditPanel.js.map +1 -1
  7. package/cjs/cell-renderers/checkbox-cell/CheckboxCell.js +2 -3
  8. package/cjs/cell-renderers/checkbox-cell/CheckboxCell.js.map +1 -1
  9. package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js +2 -3
  10. package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js.map +1 -1
  11. package/cjs/cell-renderers/input-cell/InputCell.js +3 -5
  12. package/cjs/cell-renderers/input-cell/InputCell.js.map +1 -1
  13. package/cjs/cell-renderers/toggle-cell/ToggleCell.js +5 -6
  14. package/cjs/cell-renderers/toggle-cell/ToggleCell.js.map +1 -1
  15. package/cjs/data-row/DataRow.js +146 -0
  16. package/cjs/data-row/DataRow.js.map +1 -0
  17. package/cjs/index.js +2 -0
  18. package/cjs/index.js.map +1 -1
  19. package/cjs/table-cell/TableCell.js +6 -9
  20. package/cjs/table-cell/TableCell.js.map +1 -1
  21. package/cjs/table-cell/TableGroupCell.css.js +1 -1
  22. package/cjs/table-cell/TableGroupCell.js +7 -8
  23. package/cjs/table-cell/TableGroupCell.js.map +1 -1
  24. package/cjs/table-data-source/{moving-window.js → DataRowMovingWindow.js} +19 -29
  25. package/cjs/table-data-source/DataRowMovingWindow.js.map +1 -0
  26. package/cjs/table-data-source/useDataSource.js +77 -37
  27. package/cjs/table-data-source/useDataSource.js.map +1 -1
  28. package/cjs/useRowClassNameGenerators.js +2 -2
  29. package/cjs/useRowClassNameGenerators.js.map +1 -1
  30. package/cjs/useSelection.js +5 -6
  31. package/cjs/useSelection.js.map +1 -1
  32. package/cjs/useTable.js +26 -36
  33. package/cjs/useTable.js.map +1 -1
  34. package/cjs/useTableContextMenu.js +6 -10
  35. package/cjs/useTableContextMenu.js.map +1 -1
  36. package/cjs/useTableScroll.js +0 -1
  37. package/cjs/useTableScroll.js.map +1 -1
  38. package/cjs/useTableViewport.js +2 -2
  39. package/cjs/useTableViewport.js.map +1 -1
  40. package/esm/Row.js +17 -20
  41. package/esm/Row.js.map +1 -1
  42. package/esm/Table.js +9 -16
  43. package/esm/Table.js.map +1 -1
  44. package/esm/bulk-edit/useBulkEditPanel.js +7 -8
  45. package/esm/bulk-edit/useBulkEditPanel.js.map +1 -1
  46. package/esm/cell-renderers/checkbox-cell/CheckboxCell.js +2 -3
  47. package/esm/cell-renderers/checkbox-cell/CheckboxCell.js.map +1 -1
  48. package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js +3 -4
  49. package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js.map +1 -1
  50. package/esm/cell-renderers/input-cell/InputCell.js +3 -5
  51. package/esm/cell-renderers/input-cell/InputCell.js.map +1 -1
  52. package/esm/cell-renderers/toggle-cell/ToggleCell.js +5 -6
  53. package/esm/cell-renderers/toggle-cell/ToggleCell.js.map +1 -1
  54. package/esm/data-row/DataRow.js +144 -0
  55. package/esm/data-row/DataRow.js.map +1 -0
  56. package/esm/index.js +1 -0
  57. package/esm/index.js.map +1 -1
  58. package/esm/table-cell/TableCell.js +6 -9
  59. package/esm/table-cell/TableCell.js.map +1 -1
  60. package/esm/table-cell/TableGroupCell.css.js +1 -1
  61. package/esm/table-cell/TableGroupCell.js +8 -9
  62. package/esm/table-cell/TableGroupCell.js.map +1 -1
  63. package/esm/table-data-source/{moving-window.js → DataRowMovingWindow.js} +20 -30
  64. package/esm/table-data-source/DataRowMovingWindow.js.map +1 -0
  65. package/esm/table-data-source/useDataSource.js +78 -38
  66. package/esm/table-data-source/useDataSource.js.map +1 -1
  67. package/esm/useRowClassNameGenerators.js +2 -2
  68. package/esm/useRowClassNameGenerators.js.map +1 -1
  69. package/esm/useSelection.js +6 -7
  70. package/esm/useSelection.js.map +1 -1
  71. package/esm/useTable.js +27 -37
  72. package/esm/useTable.js.map +1 -1
  73. package/esm/useTableContextMenu.js +7 -11
  74. package/esm/useTableContextMenu.js.map +1 -1
  75. package/esm/useTableScroll.js +0 -1
  76. package/esm/useTableScroll.js.map +1 -1
  77. package/esm/useTableViewport.js +2 -2
  78. package/esm/useTableViewport.js.map +1 -1
  79. package/package.json +10 -10
  80. package/types/Row.d.ts +1 -1
  81. package/types/Table.d.ts +1 -12
  82. package/types/cell-renderers/checkbox-cell/CheckboxCell.d.ts +1 -1
  83. package/types/cell-renderers/input-cell/InputCell.d.ts +1 -1
  84. package/types/data-row/DataRow.d.ts +16 -0
  85. package/types/index.d.ts +1 -0
  86. package/types/table-cell/TableCell.d.ts +1 -1
  87. package/types/table-cell/TableGroupCell.d.ts +1 -1
  88. package/types/table-data-source/DataRowMovingWindow.d.ts +24 -0
  89. package/types/table-data-source/useDataSource.d.ts +5 -6
  90. package/types/useTable.d.ts +5 -7
  91. package/types/useTableContextMenu.d.ts +5 -7
  92. package/types/useTableScroll.d.ts +1 -3
  93. package/cjs/table-data-source/moving-window.js.map +0 -1
  94. package/esm/table-data-source/moving-window.js.map +0 -1
  95. package/types/table-data-source/moving-window.d.ts +0 -23
@@ -2,9 +2,10 @@
2
2
 
3
3
  var vuuUtils = require('@vuu-ui/vuu-utils');
4
4
  var react = require('react');
5
- var movingWindow = require('./moving-window.js');
5
+ var DataRowMovingWindow = require('./DataRowMovingWindow.js');
6
+ var DataRow = require('../data-row/DataRow.js');
6
7
 
7
- const { KEY } = vuuUtils.metadataKeys;
8
+ const NullDataRow = () => ({});
8
9
  const useDataSource = ({
9
10
  autoSelectFirstRow,
10
11
  autoSelectRowKey,
@@ -18,10 +19,14 @@ const useDataSource = ({
18
19
  suspenseProps
19
20
  }) => {
20
21
  const [, forceUpdate] = react.useState(null);
21
- const data = react.useRef([]);
22
+ const dataRows = react.useRef([]);
22
23
  const isMounted = react.useRef(true);
23
24
  const hasUpdated = react.useRef(false);
24
25
  const rangeRef = react.useRef(dataSource.range);
26
+ const dataRowRef = react.useRef(NullDataRow);
27
+ const setColumnsRef = react.useRef(
28
+ void 0
29
+ );
25
30
  const totalRowCountRef = react.useRef(0);
26
31
  const rowAutoSelected = react.useRef(false);
27
32
  const autoSelect = autoSelectRowKey ?? (autoSelectFirstRow || selectionModel === "single-no-deselect");
@@ -43,45 +48,63 @@ const useDataSource = ({
43
48
  }
44
49
  };
45
50
  }, [autoSelect, dataSource, handleConfigChange]);
46
- const dataWindow = react.useMemo(
47
- () => new movingWindow.MovingWindow(rangeRef.current.withBuffer),
51
+ const dataRowWindow = react.useMemo(
52
+ () => new DataRowMovingWindow.MovingDataRowWindow(rangeRef.current.withBuffer),
48
53
  []
49
54
  );
55
+ react.useMemo(() => {
56
+ dataSource.on("resumed", () => {
57
+ const { range } = dataSource;
58
+ if (range.to !== 0) {
59
+ dataRowWindow.setRange(dataSource.range.withBuffer);
60
+ }
61
+ });
62
+ }, [dataRowWindow, dataSource]);
50
63
  const setData = react.useCallback(
51
64
  (updates) => {
65
+ const { current: DataRow2 } = dataRowRef;
52
66
  for (const row of updates) {
53
- dataWindow.add(row);
67
+ dataRowWindow.add(DataRow2(row));
54
68
  }
55
- data.current = dataWindow.data;
69
+ dataRows.current = dataRowWindow.data;
56
70
  if (isMounted.current) {
57
71
  forceUpdate({});
58
72
  }
59
73
  },
60
- [dataWindow]
74
+ [dataRowWindow]
61
75
  );
62
76
  const selectRow = react.useCallback(
63
- (row) => {
64
- const rowKey = row[KEY];
77
+ (dataRow) => {
78
+ const rowKey = dataRow.key;
65
79
  dataSource.select?.({
66
80
  preserveExistingSelection: false,
67
81
  rowKey,
68
82
  type: "SELECT_ROW"
69
83
  });
70
- onSelect?.(row);
84
+ onSelect?.(dataRow);
71
85
  },
72
86
  [dataSource, onSelect]
73
87
  );
88
+ const createDataRow = react.useCallback(
89
+ (columns, schemaColumns) => {
90
+ const [DataRow2, setColumns] = DataRow.dataRowFactory(columns, schemaColumns);
91
+ dataRowRef.current = DataRow2;
92
+ setColumnsRef.current = setColumns;
93
+ },
94
+ []
95
+ );
74
96
  const datasourceMessageHandler = react.useCallback(
75
97
  (message) => {
76
98
  if (message.type === "subscribed") {
99
+ createDataRow(message.columns, message.tableSchema.columns);
77
100
  onSubscribed?.(message);
78
101
  } else if (message.type === "viewport-update") {
79
102
  if (typeof message.size === "number") {
80
103
  onSizeChange?.(message.size);
81
- const size = dataWindow.data.length;
82
- dataWindow.setRowCount(message.size);
104
+ const size = dataRowWindow.data.length;
105
+ dataRowWindow.setRowCount(message.size);
83
106
  totalRowCountRef.current = message.size;
84
- if (dataWindow.data.length < size) {
107
+ if (dataRowWindow.data.length < size) {
85
108
  if (isMounted.current === false) {
86
109
  console.log("setting state whilst unmounted");
87
110
  }
@@ -93,27 +116,27 @@ const useDataSource = ({
93
116
  if (autoSelect && rowAutoSelected.current === false) {
94
117
  rowAutoSelected.current = true;
95
118
  if (typeof autoSelect === "string") {
96
- const row = message.rows.find((row2) => row2[KEY] === autoSelect);
97
- if (row) {
98
- selectRow(row);
119
+ const dataRow = dataRowWindow.getByKey(autoSelect);
120
+ if (dataRow) {
121
+ selectRow(dataRow);
99
122
  } else {
100
123
  console.warn(
101
124
  `[useDataSource] autoSelect row key ${autoSelect} not in viewport`
102
125
  );
103
126
  }
104
- } else if (message.rows.length > 0) {
105
- selectRow(message.rows[0]);
127
+ } else if (dataRowWindow.hasData) {
128
+ selectRow(dataRowWindow.firstRow);
106
129
  }
107
130
  }
108
131
  } else if (message.size === 0) {
109
132
  setData([]);
110
133
  } else if (typeof message.size === "number") {
111
- data.current = dataWindow.data;
134
+ dataRows.current = dataRowWindow.data;
112
135
  hasUpdated.current = true;
113
136
  }
114
137
  } else if (message.type === "viewport-clear") {
115
138
  onSizeChange?.(0);
116
- dataWindow.setRowCount(0);
139
+ dataRowWindow.setRowCount(0);
117
140
  setData([]);
118
141
  if (isMounted.current === false) {
119
142
  console.log("setting state whilst unmounted");
@@ -123,16 +146,27 @@ const useDataSource = ({
123
146
  console.log(`useDataSource unexpected message ${message.type}`);
124
147
  }
125
148
  },
126
- [autoSelect, dataWindow, onSizeChange, onSubscribed, selectRow, setData]
149
+ [
150
+ autoSelect,
151
+ createDataRow,
152
+ dataRowWindow,
153
+ onSizeChange,
154
+ onSubscribed,
155
+ selectRow,
156
+ setData
157
+ ]
127
158
  );
128
159
  const getSelectedRows = react.useCallback(() => {
129
- return dataWindow.getSelectedRows();
130
- }, [dataWindow]);
160
+ return dataRowWindow.getSelectedRows();
161
+ }, [dataRowWindow]);
131
162
  react.useEffect(() => {
132
163
  if (dataSource.status === "disabled") {
133
164
  dataSource.enable?.(datasourceMessageHandler);
134
165
  }
135
166
  }, [dataSource, datasourceMessageHandler]);
167
+ react.useMemo(() => {
168
+ setColumnsRef.current?.(dataSource.columns);
169
+ }, [dataSource.columns]);
136
170
  const setRange = react.useCallback(
137
171
  (viewportRange) => {
138
172
  if (!rangeRef.current.equals(viewportRange)) {
@@ -141,7 +175,7 @@ const useDataSource = ({
141
175
  viewportRange.to,
142
176
  renderBufferSize
143
177
  );
144
- dataWindow.setRange(range.withBuffer);
178
+ dataRowWindow.setRange(range.withBuffer);
145
179
  if (dataSource.status !== "subscribed" && dataSource.status !== "subscribing" && dataSource.status !== "enabling") {
146
180
  dataSource?.subscribe(
147
181
  {
@@ -158,8 +192,8 @@ const useDataSource = ({
158
192
  },
159
193
  [
160
194
  autoSelectRowKey,
195
+ dataRowWindow,
161
196
  dataSource,
162
- dataWindow,
163
197
  datasourceMessageHandler,
164
198
  renderBufferSize,
165
199
  revealSelected
@@ -168,6 +202,14 @@ const useDataSource = ({
168
202
  react.useEffect(() => {
169
203
  isMounted.current = true;
170
204
  if (dataSource.status !== "initialising") {
205
+ const { columns, tableSchema } = dataSource;
206
+ if (tableSchema) {
207
+ createDataRow(columns, tableSchema.columns);
208
+ } else {
209
+ throw Error(
210
+ `[useDataSource] a resumed dataSource must have a tableSchema`
211
+ );
212
+ }
171
213
  dataSource.resume?.(datasourceMessageHandler);
172
214
  if (dataSource.range.from > 0) {
173
215
  const { from, to } = rangeRef.current.reset;
@@ -181,20 +223,18 @@ const useDataSource = ({
181
223
  suspenseProps?.escalateDelay
182
224
  );
183
225
  };
184
- }, [dataSource, datasourceMessageHandler, setRange, suspenseProps]);
185
- const removeColumnDataFromCache = react.useCallback(
186
- (indexOfRemovedColumn) => {
187
- dataWindow.spliceDataAtIndex(indexOfRemovedColumn);
188
- data.current = dataWindow.data;
189
- },
190
- [dataWindow]
191
- );
226
+ }, [
227
+ createDataRow,
228
+ dataSource,
229
+ datasourceMessageHandler,
230
+ setRange,
231
+ suspenseProps
232
+ ]);
192
233
  return {
193
- data: data.current,
194
- dataRef: data,
234
+ dataRows: dataRows.current,
235
+ dataRowsRef: dataRows,
195
236
  getSelectedRows,
196
237
  range: rangeRef.current,
197
- removeColumnDataFromCache,
198
238
  setRange
199
239
  };
200
240
  };
@@ -1 +1 @@
1
- {"version":3,"file":"useDataSource.js","sources":["../../../../packages/vuu-table/src/table-data-source/useDataSource.ts"],"sourcesContent":["import type {\n DataSourceConfigChangeHandler,\n DataSourceRow,\n DataSourceSubscribeCallback,\n DataSourceSubscribedMessage,\n DataSourceSuspenseProps,\n} from \"@vuu-ui/vuu-data-types\";\nimport { SelectRowRequest, VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { Range } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { TableProps } from \"../Table\";\nimport { metadataKeys } from \"@vuu-ui/vuu-utils\";\nimport { TableRowSelectHandlerInternal } from \"@vuu-ui/vuu-table-types\";\nimport { MovingWindow } from \"./moving-window\";\n\nconst { KEY } = metadataKeys;\n\nexport interface DataSourceHookProps\n extends Pick<\n TableProps,\n | \"autoSelectFirstRow\"\n | \"autoSelectRowKey\"\n | \"dataSource\"\n | \"renderBufferSize\"\n | \"revealSelected\"\n | \"selectionModel\"\n > {\n suspenseProps?: DataSourceSuspenseProps;\n onSelect: TableRowSelectHandlerInternal;\n onSizeChange: (size: number) => void;\n onSubscribed: (subscription: DataSourceSubscribedMessage) => void;\n}\n\nexport const useDataSource = ({\n autoSelectFirstRow,\n autoSelectRowKey,\n dataSource,\n onSizeChange,\n onSubscribed,\n renderBufferSize = 0,\n revealSelected,\n onSelect,\n selectionModel,\n suspenseProps,\n}: DataSourceHookProps) => {\n const [, forceUpdate] = useState<unknown>(null);\n const data = useRef<DataSourceRow[]>([]);\n const isMounted = useRef(true);\n const hasUpdated = useRef(false);\n const rangeRef = useRef<Range>(dataSource.range);\n const totalRowCountRef = useRef(0);\n const rowAutoSelected = useRef(false);\n\n const autoSelect =\n autoSelectRowKey ??\n (autoSelectFirstRow || selectionModel === \"single-no-deselect\");\n\n const handleConfigChange = useCallback<DataSourceConfigChangeHandler>(\n (_config, _range, _confirmed, configChanges) => {\n if (configChanges?.filterChanged) {\n rowAutoSelected.current = false;\n }\n },\n [],\n );\n\n useEffect(() => {\n if (autoSelect) {\n dataSource.on(\"config\", handleConfigChange);\n }\n return () => {\n if (autoSelect) {\n dataSource.removeListener(\"config\", handleConfigChange);\n }\n };\n }, [autoSelect, dataSource, handleConfigChange]);\n\n const dataWindow = useMemo(\n () => new MovingWindow(rangeRef.current.withBuffer),\n [],\n );\n\n const setData = useCallback(\n (updates: DataSourceRow[]) => {\n for (const row of updates) {\n dataWindow.add(row);\n }\n data.current = dataWindow.data;\n if (isMounted.current) {\n // TODO do we ever need to worry about missing updates here ?\n forceUpdate({});\n }\n },\n [dataWindow],\n );\n\n const selectRow = useCallback(\n (row: DataSourceRow) => {\n const rowKey = row[KEY];\n dataSource.select?.({\n preserveExistingSelection: false,\n rowKey,\n type: \"SELECT_ROW\",\n } as SelectRowRequest);\n onSelect?.(row);\n },\n [dataSource, onSelect],\n );\n\n const datasourceMessageHandler: DataSourceSubscribeCallback = useCallback(\n (message) => {\n if (message.type === \"subscribed\") {\n onSubscribed?.(message);\n } else if (message.type === \"viewport-update\") {\n if (typeof message.size === \"number\") {\n onSizeChange?.(message.size);\n const size = dataWindow.data.length;\n dataWindow.setRowCount(message.size);\n totalRowCountRef.current = message.size;\n\n if (dataWindow.data.length < size) {\n if (isMounted.current === false) {\n console.log(\"setting state whilst unmounted\");\n }\n\n forceUpdate({});\n }\n }\n if (message.rows) {\n setData(message.rows);\n if (autoSelect && rowAutoSelected.current === false) {\n // OR if no selected row in message.rows, e.g after a filter\n rowAutoSelected.current = true;\n if (typeof autoSelect === \"string\") {\n const row = message.rows.find((row) => row[KEY] === autoSelect);\n if (row) {\n selectRow(row);\n } else {\n console.warn(\n `[useDataSource] autoSelect row key ${autoSelect} not in viewport`,\n );\n }\n } else if (message.rows.length > 0) {\n selectRow(message.rows[0]);\n }\n }\n } else if (message.size === 0) {\n setData([]);\n } else if (typeof message.size === \"number\") {\n data.current = dataWindow.data;\n hasUpdated.current = true;\n }\n } else if (message.type === \"viewport-clear\") {\n onSizeChange?.(0);\n dataWindow.setRowCount(0);\n setData([]);\n\n if (isMounted.current === false) {\n console.log(\"setting state whilst unmounted\");\n }\n\n forceUpdate({});\n } else {\n console.log(`useDataSource unexpected message ${message.type}`);\n }\n },\n [autoSelect, dataWindow, onSizeChange, onSubscribed, selectRow, setData],\n );\n\n const getSelectedRows = useCallback(() => {\n return dataWindow.getSelectedRows();\n }, [dataWindow]);\n\n useEffect(() => {\n if (dataSource.status === \"disabled\") {\n dataSource.enable?.(datasourceMessageHandler);\n }\n }, [dataSource, datasourceMessageHandler]);\n\n const setRange = useCallback(\n (viewportRange: VuuRange) => {\n if (!rangeRef.current.equals(viewportRange)) {\n const range = Range(\n viewportRange.from,\n viewportRange.to,\n renderBufferSize,\n );\n\n dataWindow.setRange(range.withBuffer);\n\n if (\n dataSource.status !== \"subscribed\" &&\n dataSource.status !== \"subscribing\" &&\n dataSource.status !== \"enabling\"\n ) {\n dataSource?.subscribe(\n {\n range,\n revealSelected,\n selectedKeyValues: autoSelectRowKey\n ? [autoSelectRowKey]\n : undefined,\n },\n datasourceMessageHandler,\n );\n } else {\n dataSource.range = rangeRef.current = range;\n }\n }\n },\n [\n autoSelectRowKey,\n dataSource,\n dataWindow,\n datasourceMessageHandler,\n renderBufferSize,\n revealSelected,\n ],\n );\n\n useEffect(() => {\n isMounted.current = true;\n if (dataSource.status !== \"initialising\") {\n dataSource.resume?.(datasourceMessageHandler);\n\n if (dataSource.range.from > 0) {\n // UI does not currently restore scroll position, so always reset to top of dataset\n const { from, to } = rangeRef.current.reset;\n setRange({ from, to });\n }\n }\n return () => {\n isMounted.current = false;\n dataSource.suspend?.(\n suspenseProps?.escalateToDisable,\n suspenseProps?.escalateDelay,\n );\n };\n }, [dataSource, datasourceMessageHandler, setRange, suspenseProps]);\n\n const removeColumnDataFromCache = useCallback(\n (indexOfRemovedColumn: number) => {\n dataWindow.spliceDataAtIndex(indexOfRemovedColumn);\n data.current = dataWindow.data;\n },\n [dataWindow],\n );\n\n return {\n data: data.current,\n dataRef: data,\n getSelectedRows,\n range: rangeRef.current,\n removeColumnDataFromCache,\n setRange,\n };\n};\n"],"names":["metadataKeys","useState","useRef","useCallback","useEffect","useMemo","MovingWindow","row","Range"],"mappings":"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"}
1
+ {"version":3,"file":"useDataSource.js","sources":["../../../../packages/vuu-table/src/table-data-source/useDataSource.ts"],"sourcesContent":["import type {\n DataSourceConfigChangeHandler,\n DataSourceRow,\n DataSourceSubscribeCallback,\n DataSourceSubscribedMessage,\n DataSourceSuspenseProps,\n SchemaColumn,\n} from \"@vuu-ui/vuu-data-types\";\nimport { SelectRowRequest, VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { Range } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { TableProps } from \"../Table\";\nimport {\n DataRow,\n TableRowSelectHandlerInternal,\n} from \"@vuu-ui/vuu-table-types\";\nimport { MovingDataRowWindow } from \"./DataRowMovingWindow\";\nimport { dataRowFactory, DataRowFunc } from \"../data-row/DataRow\";\n\nconst NullDataRow = () => ({}) as DataRow;\n\nexport interface DataSourceHookProps\n extends Pick<\n TableProps,\n | \"autoSelectFirstRow\"\n | \"autoSelectRowKey\"\n | \"dataSource\"\n | \"renderBufferSize\"\n | \"revealSelected\"\n | \"selectionModel\"\n > {\n suspenseProps?: DataSourceSuspenseProps;\n onSelect: TableRowSelectHandlerInternal;\n onSizeChange: (size: number) => void;\n onSubscribed: (subscription: DataSourceSubscribedMessage) => void;\n}\n\nexport const useDataSource = ({\n autoSelectFirstRow,\n autoSelectRowKey,\n dataSource,\n onSizeChange,\n onSubscribed,\n renderBufferSize = 0,\n revealSelected,\n onSelect,\n selectionModel,\n suspenseProps,\n}: DataSourceHookProps) => {\n const [, forceUpdate] = useState<unknown>(null);\n const dataRows = useRef<DataRow[]>([]);\n const isMounted = useRef(true);\n const hasUpdated = useRef(false);\n const rangeRef = useRef<Range>(dataSource.range);\n const dataRowRef = useRef<DataRowFunc>(NullDataRow);\n const setColumnsRef = useRef<undefined | ((columns: string[]) => void)>(\n undefined,\n );\n const totalRowCountRef = useRef(0);\n const rowAutoSelected = useRef(false);\n\n const autoSelect =\n autoSelectRowKey ??\n (autoSelectFirstRow || selectionModel === \"single-no-deselect\");\n\n const handleConfigChange = useCallback<DataSourceConfigChangeHandler>(\n (_config, _range, _confirmed, configChanges) => {\n if (configChanges?.filterChanged) {\n rowAutoSelected.current = false;\n }\n },\n [],\n );\n\n useEffect(() => {\n if (autoSelect) {\n dataSource.on(\"config\", handleConfigChange);\n }\n return () => {\n if (autoSelect) {\n dataSource.removeListener(\"config\", handleConfigChange);\n }\n };\n }, [autoSelect, dataSource, handleConfigChange]);\n\n const dataRowWindow = useMemo(\n () => new MovingDataRowWindow(rangeRef.current.withBuffer),\n [],\n );\n\n useMemo(() => {\n dataSource.on(\"resumed\", () => {\n // When we resume a dataSource (after switching tabs etc)\n // client will receive rows. We may not have received any\n // setRange calls at this point so dataWindow range will\n //not yet be set. If the dataWindow range is already set,\n // this is a no-op.\n const { range } = dataSource;\n if (range.to !== 0) {\n dataRowWindow.setRange(dataSource.range.withBuffer);\n }\n });\n }, [dataRowWindow, dataSource]);\n\n const setData = useCallback(\n (updates: DataSourceRow[]) => {\n const { current: DataRow } = dataRowRef;\n for (const row of updates) {\n // for now, we create a new DataRow each time\n dataRowWindow.add(DataRow(row));\n }\n dataRows.current = dataRowWindow.data;\n if (isMounted.current) {\n // TODO do we ever need to worry about missing updates here ?\n forceUpdate({});\n }\n },\n [dataRowWindow],\n );\n\n const selectRow = useCallback(\n (dataRow: DataRow) => {\n const rowKey = dataRow.key;\n dataSource.select?.({\n preserveExistingSelection: false,\n rowKey,\n type: \"SELECT_ROW\",\n } as SelectRowRequest);\n onSelect?.(dataRow);\n },\n [dataSource, onSelect],\n );\n\n const createDataRow = useCallback(\n (columns: string[], schemaColumns: readonly SchemaColumn[]) => {\n const [DataRow, setColumns] = dataRowFactory(columns, schemaColumns);\n dataRowRef.current = DataRow;\n setColumnsRef.current = setColumns;\n },\n [],\n );\n\n const datasourceMessageHandler: DataSourceSubscribeCallback = useCallback(\n (message) => {\n if (message.type === \"subscribed\") {\n createDataRow(message.columns, message.tableSchema.columns);\n onSubscribed?.(message);\n } else if (message.type === \"viewport-update\") {\n if (typeof message.size === \"number\") {\n onSizeChange?.(message.size);\n const size = dataRowWindow.data.length;\n dataRowWindow.setRowCount(message.size);\n totalRowCountRef.current = message.size;\n\n if (dataRowWindow.data.length < size) {\n if (isMounted.current === false) {\n console.log(\"setting state whilst unmounted\");\n }\n\n forceUpdate({});\n }\n }\n if (message.rows) {\n setData(message.rows);\n if (autoSelect && rowAutoSelected.current === false) {\n // OR if no selected row in message.rows, e.g after a filter\n rowAutoSelected.current = true;\n if (typeof autoSelect === \"string\") {\n const dataRow = dataRowWindow.getByKey(autoSelect);\n if (dataRow) {\n selectRow(dataRow);\n } else {\n console.warn(\n `[useDataSource] autoSelect row key ${autoSelect} not in viewport`,\n );\n }\n } else if (dataRowWindow.hasData) {\n selectRow(dataRowWindow.firstRow);\n }\n }\n } else if (message.size === 0) {\n setData([]);\n } else if (typeof message.size === \"number\") {\n dataRows.current = dataRowWindow.data;\n hasUpdated.current = true;\n }\n } else if (message.type === \"viewport-clear\") {\n onSizeChange?.(0);\n dataRowWindow.setRowCount(0);\n setData([]);\n\n if (isMounted.current === false) {\n console.log(\"setting state whilst unmounted\");\n }\n\n forceUpdate({});\n } else {\n console.log(`useDataSource unexpected message ${message.type}`);\n }\n },\n [\n autoSelect,\n createDataRow,\n dataRowWindow,\n onSizeChange,\n onSubscribed,\n selectRow,\n setData,\n ],\n );\n\n const getSelectedRows = useCallback(() => {\n return dataRowWindow.getSelectedRows();\n }, [dataRowWindow]);\n\n useEffect(() => {\n if (dataSource.status === \"disabled\") {\n dataSource.enable?.(datasourceMessageHandler);\n }\n }, [dataSource, datasourceMessageHandler]);\n\n useMemo(() => {\n setColumnsRef.current?.(dataSource.columns);\n }, [dataSource.columns]);\n\n const setRange = useCallback(\n (viewportRange: VuuRange) => {\n if (!rangeRef.current.equals(viewportRange)) {\n const range = Range(\n viewportRange.from,\n viewportRange.to,\n renderBufferSize,\n );\n\n dataRowWindow.setRange(range.withBuffer);\n\n if (\n dataSource.status !== \"subscribed\" &&\n dataSource.status !== \"subscribing\" &&\n dataSource.status !== \"enabling\"\n ) {\n dataSource?.subscribe(\n {\n range,\n revealSelected,\n selectedKeyValues: autoSelectRowKey\n ? [autoSelectRowKey]\n : undefined,\n },\n datasourceMessageHandler,\n );\n } else {\n dataSource.range = rangeRef.current = range;\n }\n }\n },\n [\n autoSelectRowKey,\n dataRowWindow,\n dataSource,\n datasourceMessageHandler,\n renderBufferSize,\n revealSelected,\n ],\n );\n\n useEffect(() => {\n isMounted.current = true;\n if (dataSource.status !== \"initialising\") {\n const { columns, tableSchema } = dataSource;\n if (tableSchema) {\n createDataRow(columns, tableSchema.columns);\n } else {\n throw Error(\n `[useDataSource] a resumed dataSource must have a tableSchema`,\n );\n }\n\n dataSource.resume?.(datasourceMessageHandler);\n\n if (dataSource.range.from > 0) {\n // UI does not currently restore scroll position, so always reset to top of dataset\n const { from, to } = rangeRef.current.reset;\n setRange({ from, to });\n }\n }\n return () => {\n isMounted.current = false;\n dataSource.suspend?.(\n suspenseProps?.escalateToDisable,\n suspenseProps?.escalateDelay,\n );\n };\n }, [\n createDataRow,\n dataSource,\n datasourceMessageHandler,\n setRange,\n suspenseProps,\n ]);\n\n return {\n dataRows: dataRows.current,\n dataRowsRef: dataRows,\n getSelectedRows,\n range: rangeRef.current,\n setRange,\n };\n};\n"],"names":["useState","useRef","useCallback","useEffect","useMemo","MovingDataRowWindow","DataRow","dataRowFactory","Range"],"mappings":"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"}
@@ -11,10 +11,10 @@ const createClassNameGenerator = (ids) => {
11
11
  functions.push(fn.fn);
12
12
  }
13
13
  });
14
- return (row, columnMap) => {
14
+ return (dataRow) => {
15
15
  const classNames = [];
16
16
  functions?.forEach((fn) => {
17
- const className = fn(row, columnMap);
17
+ const className = fn(dataRow);
18
18
  if (className) {
19
19
  classNames.push(className);
20
20
  }
@@ -1 +1 @@
1
- {"version":3,"file":"useRowClassNameGenerators.js","sources":["../../../packages/vuu-table/src/useRowClassNameGenerators.ts"],"sourcesContent":["import { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport {\n getRowClassNameGenerator,\n RowClassNameGenerator,\n} from \"@vuu-ui/vuu-utils\";\nimport { useMemo } from \"react\";\n\nconst createClassNameGenerator = (\n ids?: string[],\n): RowClassNameGenerator | undefined => {\n const functions: RowClassNameGenerator[] = [];\n ids?.forEach((id) => {\n const fn = getRowClassNameGenerator(id);\n if (fn) {\n functions.push(fn.fn);\n }\n });\n return (row, columnMap) => {\n const classNames: string[] = [];\n functions?.forEach((fn) => {\n const className = fn(row, columnMap);\n if (className) {\n classNames.push(className);\n }\n });\n return classNames.join(\" \");\n };\n};\n\nexport const useRowClassNameGenerators = ({\n rowClassNameGenerators,\n}: TableConfig) => {\n return useMemo<RowClassNameGenerator | undefined>(() => {\n return createClassNameGenerator(rowClassNameGenerators);\n }, [rowClassNameGenerators]);\n};\n"],"names":["getRowClassNameGenerator","useMemo"],"mappings":";;;;;AAOA,MAAM,wBAAA,GAA2B,CAC/B,GACsC,KAAA;AACtC,EAAA,MAAM,YAAqC,EAAC;AAC5C,EAAK,GAAA,EAAA,OAAA,CAAQ,CAAC,EAAO,KAAA;AACnB,IAAM,MAAA,EAAA,GAAKA,kCAAyB,EAAE,CAAA;AACtC,IAAA,IAAI,EAAI,EAAA;AACN,MAAU,SAAA,CAAA,IAAA,CAAK,GAAG,EAAE,CAAA;AAAA;AACtB,GACD,CAAA;AACD,EAAO,OAAA,CAAC,KAAK,SAAc,KAAA;AACzB,IAAA,MAAM,aAAuB,EAAC;AAC9B,IAAW,SAAA,EAAA,OAAA,CAAQ,CAAC,EAAO,KAAA;AACzB,MAAM,MAAA,SAAA,GAAY,EAAG,CAAA,GAAA,EAAK,SAAS,CAAA;AACnC,MAAA,IAAI,SAAW,EAAA;AACb,QAAA,UAAA,CAAW,KAAK,SAAS,CAAA;AAAA;AAC3B,KACD,CAAA;AACD,IAAO,OAAA,UAAA,CAAW,KAAK,GAAG,CAAA;AAAA,GAC5B;AACF,CAAA;AAEO,MAAM,4BAA4B,CAAC;AAAA,EACxC;AACF,CAAmB,KAAA;AACjB,EAAA,OAAOC,cAA2C,MAAM;AACtD,IAAA,OAAO,yBAAyB,sBAAsB,CAAA;AAAA,GACxD,EAAG,CAAC,sBAAsB,CAAC,CAAA;AAC7B;;;;"}
1
+ {"version":3,"file":"useRowClassNameGenerators.js","sources":["../../../packages/vuu-table/src/useRowClassNameGenerators.ts"],"sourcesContent":["import { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport {\n getRowClassNameGenerator,\n RowClassNameGenerator,\n} from \"@vuu-ui/vuu-utils\";\nimport { useMemo } from \"react\";\n\nconst createClassNameGenerator = (\n ids?: string[],\n): RowClassNameGenerator | undefined => {\n const functions: RowClassNameGenerator[] = [];\n ids?.forEach((id) => {\n const fn = getRowClassNameGenerator(id);\n if (fn) {\n functions.push(fn.fn);\n }\n });\n return (dataRow) => {\n const classNames: string[] = [];\n functions?.forEach((fn) => {\n const className = fn(dataRow);\n if (className) {\n classNames.push(className);\n }\n });\n return classNames.join(\" \");\n };\n};\n\nexport const useRowClassNameGenerators = ({\n rowClassNameGenerators,\n}: TableConfig) => {\n return useMemo<RowClassNameGenerator | undefined>(() => {\n return createClassNameGenerator(rowClassNameGenerators);\n }, [rowClassNameGenerators]);\n};\n"],"names":["getRowClassNameGenerator","useMemo"],"mappings":";;;;;AAOA,MAAM,wBAAA,GAA2B,CAC/B,GACsC,KAAA;AACtC,EAAA,MAAM,YAAqC,EAAC;AAC5C,EAAK,GAAA,EAAA,OAAA,CAAQ,CAAC,EAAO,KAAA;AACnB,IAAM,MAAA,EAAA,GAAKA,kCAAyB,EAAE,CAAA;AACtC,IAAA,IAAI,EAAI,EAAA;AACN,MAAU,SAAA,CAAA,IAAA,CAAK,GAAG,EAAE,CAAA;AAAA;AACtB,GACD,CAAA;AACD,EAAA,OAAO,CAAC,OAAY,KAAA;AAClB,IAAA,MAAM,aAAuB,EAAC;AAC9B,IAAW,SAAA,EAAA,OAAA,CAAQ,CAAC,EAAO,KAAA;AACzB,MAAM,MAAA,SAAA,GAAY,GAAG,OAAO,CAAA;AAC5B,MAAA,IAAI,SAAW,EAAA;AACb,QAAA,UAAA,CAAW,KAAK,SAAS,CAAA;AAAA;AAC3B,KACD,CAAA;AACD,IAAO,OAAA,UAAA,CAAW,KAAK,GAAG,CAAA;AAAA,GAC5B;AACF,CAAA;AAEO,MAAM,4BAA4B,CAAC;AAAA,EACxC;AACF,CAAmB,KAAA;AACjB,EAAA,OAAOC,cAA2C,MAAM;AACtD,IAAA,OAAO,yBAAyB,sBAAsB,CAAA;AAAA,GACxD,EAAG,CAAC,sBAAsB,CAAC,CAAA;AAC7B;;;;"}
@@ -4,7 +4,6 @@ var vuuUtils = require('@vuu-ui/vuu-utils');
4
4
  var react = require('react');
5
5
  var tableDomUtils = require('./table-dom-utils.js');
6
6
 
7
- const { IDX, KEY, SELECTED } = vuuUtils.metadataKeys;
8
7
  const orderedRowKeys = (activeRowIdentifier, newRowIdentifier, rangeSelect = false) => {
9
8
  if (rangeSelect && activeRowIdentifier) {
10
9
  if (newRowIdentifier.rowIdx > activeRowIdentifier.rowIdx) {
@@ -46,14 +45,14 @@ const useSelection = ({
46
45
  [selectionKeys]
47
46
  );
48
47
  const handleRowClick = react.useCallback(
49
- (e, row, rangeSelect, keepExistingSelection) => {
50
- const { [IDX]: rowIdx, [KEY]: rowKey } = row;
48
+ (e, dataRow, rangeSelect, keepExistingSelection) => {
49
+ const { index: rowIdx, key: rowKey } = dataRow;
51
50
  const { current: activeRowKey } = lastActiveRef;
52
51
  const newRowIdentifier = { rowIdx, rowKey };
53
- if (row[SELECTED] && selectionModel === "single-no-deselect") {
52
+ if (dataRow.isSelected && selectionModel === "single-no-deselect") {
54
53
  return;
55
54
  }
56
- const selectOperation = row[SELECTED] ? vuuUtils.deselectItem : vuuUtils.selectItem;
55
+ const selectOperation = dataRow.isSelected ? vuuUtils.deselectItem : vuuUtils.selectItem;
57
56
  if (selectionModel === "checkbox" && allowSelectCheckboxRow !== true) {
58
57
  const cell = vuuUtils.queryClosest(e.target, ".vuuTableCell");
59
58
  if (!cell?.querySelector(".vuuCheckboxRowSelector")) {
@@ -74,7 +73,7 @@ const useSelection = ({
74
73
  );
75
74
  lastActiveRef.current = newRowIdentifier;
76
75
  if (selectRequest) {
77
- onSelect?.(selectOperation === vuuUtils.selectItem ? row : null);
76
+ onSelect?.(selectOperation === vuuUtils.selectItem ? dataRow : null);
78
77
  onSelectionChange?.(selectRequest);
79
78
  }
80
79
  if (allRowsSelected && selectOperation === vuuUtils.deselectItem) {
@@ -1 +1 @@
1
- {"version":3,"file":"useSelection.js","sources":["../../../packages/vuu-table/src/useSelection.ts"],"sourcesContent":["import {\n TableRowClickHandlerInternal,\n TableRowSelectHandlerInternal,\n SelectionChangeHandler,\n TableSelectionModel,\n} from \"@vuu-ui/vuu-table-types\";\nimport {\n deselectItem,\n dispatchMouseEvent,\n metadataKeys,\n queryClosest,\n selectItem,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n KeyboardEvent,\n KeyboardEventHandler,\n RefObject,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { getRowElementByAriaIndex } from \"./table-dom-utils\";\nimport { TableProps } from \"./Table\";\nimport { DataSource, RowSelectionEventHandler } from \"@vuu-ui/vuu-data-types\";\n\nconst { IDX, KEY, SELECTED } = metadataKeys;\n\nconst orderedRowKeys = (\n activeRowIdentifier: RowIdentifier | undefined,\n newRowIdentifier: RowIdentifier,\n rangeSelect = false,\n): [string, string] | [string] => {\n if (rangeSelect && activeRowIdentifier) {\n if (newRowIdentifier.rowIdx > activeRowIdentifier.rowIdx) {\n return [activeRowIdentifier.rowKey, newRowIdentifier.rowKey];\n } else {\n return [newRowIdentifier.rowKey, activeRowIdentifier.rowKey];\n }\n } else {\n return [newRowIdentifier.rowKey];\n }\n};\n\nconst defaultSelectionKeys = [\"Enter\", \" \"];\n\ntype RowIdentifier = {\n rowIdx: number;\n rowKey: string;\n};\n\nexport interface SelectionHookProps\n extends Pick<TableProps, \"allowSelectCheckboxRow\" | \"onSelectionChange\"> {\n containerRef: RefObject<HTMLElement | null>;\n dataSource: DataSource;\n highlightedIndexRef: RefObject<number | undefined>;\n selectionKeys?: string[];\n selectionModel: TableSelectionModel;\n onSelectionChange: SelectionChangeHandler;\n onSelect?: TableRowSelectHandlerInternal;\n}\n\nexport const useSelection = ({\n allowSelectCheckboxRow,\n containerRef,\n dataSource,\n highlightedIndexRef,\n selectionKeys = defaultSelectionKeys,\n selectionModel,\n onSelect,\n onSelectionChange,\n}: SelectionHookProps) => {\n const lastActiveRef = useRef<RowIdentifier | undefined>(undefined);\n const [allRowsSelected, setAllRowsSelected] = useState(false);\n\n const handleRowSelection = useCallback<RowSelectionEventHandler>(\n (selectedRowsCount) => {\n setAllRowsSelected((allSelected) =>\n allSelected && selectedRowsCount < dataSource.size\n ? false\n : allSelected,\n );\n },\n [dataSource.size],\n );\n\n useEffect(() => {\n dataSource.on(\"row-selection\", handleRowSelection);\n return () => dataSource.removeListener(\"row-selection\", handleRowSelection);\n }, [dataSource, handleRowSelection]);\n\n const isSelectionEvent = useCallback(\n (evt: KeyboardEvent<HTMLElement>) => selectionKeys.includes(evt.key),\n [selectionKeys],\n );\n\n const handleRowClick = useCallback<TableRowClickHandlerInternal>(\n (e, row, rangeSelect, keepExistingSelection) => {\n const { [IDX]: rowIdx, [KEY]: rowKey } = row;\n const { current: activeRowKey } = lastActiveRef;\n const newRowIdentifier = { rowIdx, rowKey } as RowIdentifier;\n\n if (row[SELECTED] && selectionModel === \"single-no-deselect\") {\n return;\n }\n\n const selectOperation = row[SELECTED] ? deselectItem : selectItem;\n\n if (selectionModel === \"checkbox\" && allowSelectCheckboxRow !== true) {\n const cell = queryClosest(e.target, \".vuuTableCell\");\n if (!cell?.querySelector(\".vuuCheckboxRowSelector\")) {\n return;\n }\n }\n\n const [fromRowKey, toRowKey] = orderedRowKeys(\n activeRowKey,\n newRowIdentifier,\n rangeSelect,\n );\n\n const selectRequest = selectOperation(\n selectionModel,\n fromRowKey,\n rangeSelect,\n keepExistingSelection,\n toRowKey,\n );\n\n lastActiveRef.current = newRowIdentifier;\n\n if (selectRequest) {\n onSelect?.(selectOperation === selectItem ? row : null);\n onSelectionChange?.(selectRequest);\n }\n\n if (allRowsSelected && selectOperation === deselectItem) {\n setAllRowsSelected(false);\n }\n },\n [\n allRowsSelected,\n allowSelectCheckboxRow,\n onSelect,\n onSelectionChange,\n selectionModel,\n ],\n );\n\n const handleKeyDown = useCallback<KeyboardEventHandler<HTMLElement>>(\n (e) => {\n if (isSelectionEvent(e)) {\n const { current: rowIndex } = highlightedIndexRef;\n const { current: container } = containerRef;\n if (rowIndex !== undefined && rowIndex !== -1 && container) {\n const rowEl = getRowElementByAriaIndex(container, rowIndex);\n if (rowEl) {\n dispatchMouseEvent(rowEl, \"click\");\n }\n }\n }\n },\n [containerRef, highlightedIndexRef, isSelectionEvent],\n );\n\n const handleCheckboxColumnHeaderClick = useCallback(() => {\n setAllRowsSelected((allSelected) => {\n if (allSelected) {\n onSelectionChange({\n type: \"DESELECT_ALL\",\n });\n } else {\n onSelectionChange({\n type: \"SELECT_ALL\",\n });\n }\n return !allSelected;\n });\n }, [onSelectionChange]);\n\n return {\n allRowsSelected,\n onCheckBoxColumnHeaderClick: handleCheckboxColumnHeaderClick,\n onKeyDown: handleKeyDown,\n onRowClick: handleRowClick,\n };\n};\n"],"names":["metadataKeys","useRef","useState","useCallback","useEffect","deselectItem","selectItem","queryClosest","getRowElementByAriaIndex","dispatchMouseEvent"],"mappings":"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"}
1
+ {"version":3,"file":"useSelection.js","sources":["../../../packages/vuu-table/src/useSelection.ts"],"sourcesContent":["import {\n TableRowClickHandlerInternal,\n TableRowSelectHandlerInternal,\n SelectionChangeHandler,\n TableSelectionModel,\n} from \"@vuu-ui/vuu-table-types\";\nimport {\n deselectItem,\n dispatchMouseEvent,\n queryClosest,\n selectItem,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n KeyboardEvent,\n KeyboardEventHandler,\n RefObject,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { getRowElementByAriaIndex } from \"./table-dom-utils\";\nimport { TableProps } from \"./Table\";\nimport { DataSource, RowSelectionEventHandler } from \"@vuu-ui/vuu-data-types\";\n\nconst orderedRowKeys = (\n activeRowIdentifier: RowIdentifier | undefined,\n newRowIdentifier: RowIdentifier,\n rangeSelect = false,\n): [string, string] | [string] => {\n if (rangeSelect && activeRowIdentifier) {\n if (newRowIdentifier.rowIdx > activeRowIdentifier.rowIdx) {\n return [activeRowIdentifier.rowKey, newRowIdentifier.rowKey];\n } else {\n return [newRowIdentifier.rowKey, activeRowIdentifier.rowKey];\n }\n } else {\n return [newRowIdentifier.rowKey];\n }\n};\n\nconst defaultSelectionKeys = [\"Enter\", \" \"];\n\ntype RowIdentifier = {\n rowIdx: number;\n rowKey: string;\n};\n\nexport interface SelectionHookProps\n extends Pick<TableProps, \"allowSelectCheckboxRow\" | \"onSelectionChange\"> {\n containerRef: RefObject<HTMLElement | null>;\n dataSource: DataSource;\n highlightedIndexRef: RefObject<number | undefined>;\n selectionKeys?: string[];\n selectionModel: TableSelectionModel;\n onSelectionChange: SelectionChangeHandler;\n onSelect?: TableRowSelectHandlerInternal;\n}\n\nexport const useSelection = ({\n allowSelectCheckboxRow,\n containerRef,\n dataSource,\n highlightedIndexRef,\n selectionKeys = defaultSelectionKeys,\n selectionModel,\n onSelect,\n onSelectionChange,\n}: SelectionHookProps) => {\n const lastActiveRef = useRef<RowIdentifier | undefined>(undefined);\n const [allRowsSelected, setAllRowsSelected] = useState(false);\n\n const handleRowSelection = useCallback<RowSelectionEventHandler>(\n (selectedRowsCount) => {\n setAllRowsSelected((allSelected) =>\n allSelected && selectedRowsCount < dataSource.size\n ? false\n : allSelected,\n );\n },\n [dataSource.size],\n );\n\n useEffect(() => {\n dataSource.on(\"row-selection\", handleRowSelection);\n return () => dataSource.removeListener(\"row-selection\", handleRowSelection);\n }, [dataSource, handleRowSelection]);\n\n const isSelectionEvent = useCallback(\n (evt: KeyboardEvent<HTMLElement>) => selectionKeys.includes(evt.key),\n [selectionKeys],\n );\n\n const handleRowClick = useCallback<TableRowClickHandlerInternal>(\n (e, dataRow, rangeSelect, keepExistingSelection) => {\n const { index: rowIdx, key: rowKey } = dataRow;\n const { current: activeRowKey } = lastActiveRef;\n const newRowIdentifier = { rowIdx, rowKey } as RowIdentifier;\n\n if (dataRow.isSelected && selectionModel === \"single-no-deselect\") {\n return;\n }\n\n const selectOperation = dataRow.isSelected ? deselectItem : selectItem;\n\n if (selectionModel === \"checkbox\" && allowSelectCheckboxRow !== true) {\n const cell = queryClosest(e.target, \".vuuTableCell\");\n if (!cell?.querySelector(\".vuuCheckboxRowSelector\")) {\n return;\n }\n }\n\n const [fromRowKey, toRowKey] = orderedRowKeys(\n activeRowKey,\n newRowIdentifier,\n rangeSelect,\n );\n\n const selectRequest = selectOperation(\n selectionModel,\n fromRowKey,\n rangeSelect,\n keepExistingSelection,\n toRowKey,\n );\n\n lastActiveRef.current = newRowIdentifier;\n\n if (selectRequest) {\n onSelect?.(selectOperation === selectItem ? dataRow : null);\n onSelectionChange?.(selectRequest);\n }\n\n if (allRowsSelected && selectOperation === deselectItem) {\n setAllRowsSelected(false);\n }\n },\n [\n allRowsSelected,\n allowSelectCheckboxRow,\n onSelect,\n onSelectionChange,\n selectionModel,\n ],\n );\n\n const handleKeyDown = useCallback<KeyboardEventHandler<HTMLElement>>(\n (e) => {\n if (isSelectionEvent(e)) {\n const { current: rowIndex } = highlightedIndexRef;\n const { current: container } = containerRef;\n if (rowIndex !== undefined && rowIndex !== -1 && container) {\n const rowEl = getRowElementByAriaIndex(container, rowIndex);\n if (rowEl) {\n dispatchMouseEvent(rowEl, \"click\");\n }\n }\n }\n },\n [containerRef, highlightedIndexRef, isSelectionEvent],\n );\n\n const handleCheckboxColumnHeaderClick = useCallback(() => {\n setAllRowsSelected((allSelected) => {\n if (allSelected) {\n onSelectionChange({\n type: \"DESELECT_ALL\",\n });\n } else {\n onSelectionChange({\n type: \"SELECT_ALL\",\n });\n }\n return !allSelected;\n });\n }, [onSelectionChange]);\n\n return {\n allRowsSelected,\n onCheckBoxColumnHeaderClick: handleCheckboxColumnHeaderClick,\n onKeyDown: handleKeyDown,\n onRowClick: handleRowClick,\n };\n};\n"],"names":["useRef","useState","useCallback","useEffect","deselectItem","selectItem","queryClosest","getRowElementByAriaIndex","dispatchMouseEvent"],"mappings":"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"}
package/cjs/useTable.js CHANGED
@@ -30,7 +30,7 @@ const zeroHeaderState = {
30
30
  const stripInternalProperties = (tableConfig) => {
31
31
  return tableConfig;
32
32
  };
33
- const { KEY, IS_EXPANDED, IS_LEAF } = vuuUtils.metadataKeys;
33
+ const { IS_EXPANDED, IS_LEAF } = vuuUtils.metadataKeys;
34
34
  const NULL_DRAG_DROP = {
35
35
  draggable: void 0,
36
36
  onMouseDown: void 0
@@ -68,7 +68,6 @@ const useTable = ({
68
68
  renderBufferSize = 0,
69
69
  revealSelected,
70
70
  rowHeight,
71
- rowToObject = vuuUtils.asDataSourceRowObject,
72
71
  scrollingApiRef,
73
72
  selectionModel,
74
73
  showColumnHeaderMenus = true,
@@ -145,9 +144,6 @@ const useTable = ({
145
144
  selectionModel
146
145
  ]
147
146
  );
148
- const columnMap = react.useMemo(() => {
149
- return vuuUtils.buildColumnMap(dataSource.columns);
150
- }, [dataSource.columns]);
151
147
  const handleSelectionChange = react.useCallback(
152
148
  (selectRequest) => {
153
149
  dataSource.select?.(selectRequest);
@@ -156,12 +152,12 @@ const useTable = ({
156
152
  [dataSource, onSelectionChange]
157
153
  );
158
154
  const handleSelect = react.useCallback(
159
- (row) => {
155
+ (dataRow) => {
160
156
  if (onSelect) {
161
- onSelect(row === null ? null : rowToObject(row, columnMap));
157
+ onSelect(dataRow);
162
158
  }
163
159
  },
164
- [columnMap, onSelect, rowToObject]
160
+ [onSelect]
165
161
  );
166
162
  const onSubscribed = react.useCallback(
167
163
  ({ tableSchema }) => {
@@ -192,11 +188,11 @@ const useTable = ({
192
188
  showPaginationControls
193
189
  });
194
190
  const {
195
- data,
196
- dataRef,
191
+ dataRows,
192
+ dataRowsRef,
197
193
  getSelectedRows,
198
194
  range,
199
- removeColumnDataFromCache,
195
+ // removeColumnDataFromCache,
200
196
  setRange
201
197
  } = useDataSource.useDataSource({
202
198
  autoSelectFirstRow,
@@ -212,7 +208,6 @@ const useTable = ({
212
208
  const { requestScroll, scrollTop, ...scrollProps } = useTableScroll.useTableScroll({
213
209
  cellFocusStateRef,
214
210
  columns,
215
- focusCell: focusCellRef.current,
216
211
  getRowAtPosition,
217
212
  rowHeight,
218
213
  scrollingApiRef,
@@ -292,14 +287,12 @@ const useTable = ({
292
287
  ...tableConfig$1,
293
288
  columns: tableConfig$1.columns.filter((col) => col.name !== column.name)
294
289
  };
295
- const indexOfRemovedColumn = columnMap[column.name];
296
- removeColumnDataFromCache(indexOfRemovedColumn);
297
290
  applyTableConfigChange(newTableConfig, {
298
291
  type: "column-removed",
299
292
  column
300
293
  });
301
294
  },
302
- [applyTableConfigChange, columnMap, removeColumnDataFromCache, tableConfig$1]
295
+ [applyTableConfigChange, tableConfig$1]
303
296
  );
304
297
  const hideColumns = react.useCallback(
305
298
  (action) => {
@@ -406,7 +399,6 @@ const useTable = ({
406
399
  const onResizeColumn = react.useCallback(
407
400
  (phase, columnName, width = 0) => {
408
401
  if (phase === "resize") {
409
- console.log(`resize column ${columnName}`);
410
402
  cellResizeState.current?.cells.forEach((cell) => {
411
403
  cell.style.width = `${width}px`;
412
404
  });
@@ -483,15 +475,15 @@ const useTable = ({
483
475
  ]
484
476
  );
485
477
  const onToggleGroup = react.useCallback(
486
- (row, column) => {
487
- const isJson = vuuUtils.isJsonGroup(column, row, columnMap);
488
- const key = row[KEY];
489
- if (row[IS_EXPANDED]) {
478
+ (dataRow, column) => {
479
+ const isJson = vuuUtils.isJsonGroup(column, dataRow);
480
+ const { key } = dataRow;
481
+ if (dataRow.isExpanded) {
490
482
  dataSource.closeTreeNode(key, true);
491
483
  if (isJson) {
492
484
  const idx = columns.indexOf(column);
493
485
  const rows = dataSource.getRowsAtDepth?.(idx + 1);
494
- if (rows && !rows.some((row2) => row2[IS_EXPANDED] || row2[IS_LEAF])) {
486
+ if (rows && !rows.some((row) => row[IS_EXPANDED] || row[IS_LEAF])) {
495
487
  dispatchTableModelAction({
496
488
  type: "hideColumns",
497
489
  columns: columns.slice(idx + 2)
@@ -504,7 +496,7 @@ const useTable = ({
504
496
  const childRows = dataSource.getChildRows?.(key);
505
497
  const idx = columns.indexOf(column) + 1;
506
498
  const columnsToShow = [columns[idx]];
507
- if (childRows && childRows.some((row2) => row2[IS_LEAF])) {
499
+ if (childRows && childRows.some((row) => row[IS_LEAF])) {
508
500
  columnsToShow.push(columns[idx + 1]);
509
501
  }
510
502
  if (columnsToShow.some((col) => col.hidden)) {
@@ -516,7 +508,7 @@ const useTable = ({
516
508
  }
517
509
  }
518
510
  },
519
- [columnMap, columns, dataSource, dispatchTableModelAction]
511
+ [columns, dataSource, dispatchTableModelAction]
520
512
  );
521
513
  const handleToggleGroup = react.useCallback(
522
514
  (treeNodeOperation, rowIdx) => {
@@ -582,9 +574,8 @@ const useTable = ({
582
574
  [editingFocus, navigationFocus]
583
575
  );
584
576
  const onContextMenu = useTableContextMenu.useTableContextMenu({
585
- columnMap,
586
577
  columns,
587
- data,
578
+ dataRows,
588
579
  dataSource,
589
580
  getSelectedRows,
590
581
  headerCount: headerState.count
@@ -644,11 +635,11 @@ const useTable = ({
644
635
  rowCount
645
636
  });
646
637
  const handleRowClick = react.useCallback(
647
- (evt, row, rangeSelect, keepExistingSelection) => {
648
- selectionHookOnRowClick(evt, row, rangeSelect, keepExistingSelection);
649
- onRowClickProp?.(evt, rowToObject(row, columnMap));
638
+ (evt, dataRow, rangeSelect, keepExistingSelection) => {
639
+ selectionHookOnRowClick(evt, dataRow, rangeSelect, keepExistingSelection);
640
+ onRowClickProp?.(evt, dataRow);
650
641
  },
651
- [columnMap, onRowClickProp, rowToObject, selectionHookOnRowClick]
642
+ [onRowClickProp, selectionHookOnRowClick]
652
643
  );
653
644
  const handleKeyDown = react.useCallback(
654
645
  (e) => {
@@ -720,17 +711,17 @@ const useTable = ({
720
711
  const {
721
712
  editType = "commit",
722
713
  isValid = true,
723
- row,
714
+ dataRow,
724
715
  columnName,
725
716
  value
726
717
  } = editState;
727
718
  if (editType === "commit" && isValid) {
728
719
  if (dataSource.rpcRequest) {
729
- if (columnName && row) {
720
+ if (columnName && dataRow) {
730
721
  const response = await dataSource.rpcRequest({
731
722
  params: {
732
723
  column: columnName,
733
- key: row[KEY],
724
+ key: dataRow.key,
734
725
  data: value
735
726
  },
736
727
  rpcName: "editCell",
@@ -757,13 +748,13 @@ const useTable = ({
757
748
  (dragDropState) => {
758
749
  const { initialDragElement } = dragDropState;
759
750
  const rowIndex = vuuUtils.getAriaRowIndex(initialDragElement) - headerState.count - 1;
760
- const row = dataRef.current.find((row2) => row2[0] === rowIndex);
751
+ const row = dataRowsRef.current.find((row2) => row2.index === rowIndex);
761
752
  if (row) {
762
753
  dragDropState.setPayload(row);
763
754
  }
764
755
  onDragStart?.(dragDropState);
765
756
  },
766
- [dataRef, headerState.count, onDragStart]
757
+ [dataRowsRef, headerState.count, onDragStart]
767
758
  );
768
759
  const onHeaderHeightMeasured = react.useCallback(
769
760
  (height, count) => {
@@ -795,9 +786,8 @@ const useTable = ({
795
786
  allRowsSelected,
796
787
  "aria-rowcount": dataSource.size,
797
788
  cellBlock,
798
- columnMap,
799
789
  columns,
800
- data,
790
+ dataRows,
801
791
  draggableRow,
802
792
  focusCellPlaceholderKeyDown,
803
793
  focusCellPlaceholderRef,