@vuu-ui/vuu-table 0.13.6 → 0.13.8

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 (278) hide show
  1. package/cjs/index.js +5236 -61
  2. package/cjs/index.js.map +1 -1
  3. package/esm/index.js +5205 -26
  4. package/esm/index.js.map +1 -1
  5. package/package.json +10 -10
  6. package/types/Table.d.ts +0 -1
  7. package/types/column-resizing/ColumnResizer.d.ts +6 -1
  8. package/types/column-resizing/useTableColumnResize.d.ts +3 -3
  9. package/types/header-cell/GroupHeaderCell.d.ts +2 -1
  10. package/types/header-cell/HeaderCell.d.ts +1 -1
  11. package/types/table-dom-utils.d.ts +1 -0
  12. package/types/table-header/TableHeader.d.ts +2 -2
  13. package/types/table-header/useTableHeader.d.ts +11 -7
  14. package/types/useTable.d.ts +2 -2
  15. package/cjs/CellFocusState.js +0 -45
  16. package/cjs/CellFocusState.js.map +0 -1
  17. package/cjs/Row.css.js +0 -6
  18. package/cjs/Row.css.js.map +0 -1
  19. package/cjs/Row.js +0 -151
  20. package/cjs/Row.js.map +0 -1
  21. package/cjs/Table.css.js +0 -6
  22. package/cjs/Table.css.js.map +0 -1
  23. package/cjs/Table.js +0 -433
  24. package/cjs/Table.js.map +0 -1
  25. package/cjs/VirtualColSpan.js +0 -19
  26. package/cjs/VirtualColSpan.js.map +0 -1
  27. package/cjs/bulk-edit/BulkEditDialog.js +0 -57
  28. package/cjs/bulk-edit/BulkEditDialog.js.map +0 -1
  29. package/cjs/bulk-edit/BulkEditPanel.css.js +0 -6
  30. package/cjs/bulk-edit/BulkEditPanel.css.js.map +0 -1
  31. package/cjs/bulk-edit/BulkEditPanel.js +0 -72
  32. package/cjs/bulk-edit/BulkEditPanel.js.map +0 -1
  33. package/cjs/bulk-edit/BulkEditRow.css.js +0 -6
  34. package/cjs/bulk-edit/BulkEditRow.css.js.map +0 -1
  35. package/cjs/bulk-edit/BulkEditRow.js +0 -81
  36. package/cjs/bulk-edit/BulkEditRow.js.map +0 -1
  37. package/cjs/bulk-edit/useBulkEditPanel.js +0 -101
  38. package/cjs/bulk-edit/useBulkEditPanel.js.map +0 -1
  39. package/cjs/bulk-edit/useBulkEditRow.js +0 -144
  40. package/cjs/bulk-edit/useBulkEditRow.js.map +0 -1
  41. package/cjs/cell-block/CellBlock.css.js +0 -6
  42. package/cjs/cell-block/CellBlock.css.js.map +0 -1
  43. package/cjs/cell-block/CellBlock.js +0 -45
  44. package/cjs/cell-block/CellBlock.js.map +0 -1
  45. package/cjs/cell-block/cellblock-utils.js +0 -125
  46. package/cjs/cell-block/cellblock-utils.js.map +0 -1
  47. package/cjs/cell-block/useCellBlockSelection.js +0 -254
  48. package/cjs/cell-block/useCellBlockSelection.js.map +0 -1
  49. package/cjs/cell-renderers/checkbox-cell/CheckboxCell.css.js +0 -6
  50. package/cjs/cell-renderers/checkbox-cell/CheckboxCell.css.js.map +0 -1
  51. package/cjs/cell-renderers/checkbox-cell/CheckboxCell.js +0 -68
  52. package/cjs/cell-renderers/checkbox-cell/CheckboxCell.js.map +0 -1
  53. package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js +0 -6
  54. package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js.map +0 -1
  55. package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js +0 -33
  56. package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js.map +0 -1
  57. package/cjs/cell-renderers/input-cell/InputCell.css.js +0 -6
  58. package/cjs/cell-renderers/input-cell/InputCell.css.js.map +0 -1
  59. package/cjs/cell-renderers/input-cell/InputCell.js +0 -52
  60. package/cjs/cell-renderers/input-cell/InputCell.js.map +0 -1
  61. package/cjs/cell-renderers/toggle-cell/ToggleCell.css.js +0 -6
  62. package/cjs/cell-renderers/toggle-cell/ToggleCell.css.js.map +0 -1
  63. package/cjs/cell-renderers/toggle-cell/ToggleCell.js +0 -67
  64. package/cjs/cell-renderers/toggle-cell/ToggleCell.js.map +0 -1
  65. package/cjs/column-header-pill/ColumnHeaderPill.css.js +0 -6
  66. package/cjs/column-header-pill/ColumnHeaderPill.css.js.map +0 -1
  67. package/cjs/column-header-pill/ColumnHeaderPill.js +0 -53
  68. package/cjs/column-header-pill/ColumnHeaderPill.js.map +0 -1
  69. package/cjs/column-header-pill/GroupColumnPill.css.js +0 -6
  70. package/cjs/column-header-pill/GroupColumnPill.css.js.map +0 -1
  71. package/cjs/column-header-pill/GroupColumnPill.js +0 -29
  72. package/cjs/column-header-pill/GroupColumnPill.js.map +0 -1
  73. package/cjs/column-header-pill/SortIndicator.css.js +0 -6
  74. package/cjs/column-header-pill/SortIndicator.css.js.map +0 -1
  75. package/cjs/column-header-pill/SortIndicator.js +0 -27
  76. package/cjs/column-header-pill/SortIndicator.js.map +0 -1
  77. package/cjs/column-resizing/ColumnResizer.css.js +0 -6
  78. package/cjs/column-resizing/ColumnResizer.css.js.map +0 -1
  79. package/cjs/column-resizing/ColumnResizer.js +0 -72
  80. package/cjs/column-resizing/ColumnResizer.js.map +0 -1
  81. package/cjs/column-resizing/useTableColumnResize.js +0 -55
  82. package/cjs/column-resizing/useTableColumnResize.js.map +0 -1
  83. package/cjs/header-cell/GroupHeaderCell.css.js +0 -6
  84. package/cjs/header-cell/GroupHeaderCell.css.js.map +0 -1
  85. package/cjs/header-cell/GroupHeaderCell.js +0 -127
  86. package/cjs/header-cell/GroupHeaderCell.js.map +0 -1
  87. package/cjs/header-cell/HeaderCell.css.js +0 -6
  88. package/cjs/header-cell/HeaderCell.css.js.map +0 -1
  89. package/cjs/header-cell/HeaderCell.js +0 -107
  90. package/cjs/header-cell/HeaderCell.js.map +0 -1
  91. package/cjs/pagination/PaginationControl.css.js +0 -6
  92. package/cjs/pagination/PaginationControl.css.js.map +0 -1
  93. package/cjs/pagination/PaginationControl.js +0 -38
  94. package/cjs/pagination/PaginationControl.js.map +0 -1
  95. package/cjs/pagination/usePagination.js +0 -36
  96. package/cjs/pagination/usePagination.js.map +0 -1
  97. package/cjs/table-cell/TableCell.css.js +0 -6
  98. package/cjs/table-cell/TableCell.css.js.map +0 -1
  99. package/cjs/table-cell/TableCell.js +0 -95
  100. package/cjs/table-cell/TableCell.js.map +0 -1
  101. package/cjs/table-cell/TableGroupCell.css.js +0 -6
  102. package/cjs/table-cell/TableGroupCell.css.js.map +0 -1
  103. package/cjs/table-cell/TableGroupCell.js +0 -66
  104. package/cjs/table-cell/TableGroupCell.js.map +0 -1
  105. package/cjs/table-config.js +0 -35
  106. package/cjs/table-config.js.map +0 -1
  107. package/cjs/table-dom-utils.js +0 -198
  108. package/cjs/table-dom-utils.js.map +0 -1
  109. package/cjs/table-header/HeaderProvider.js +0 -18
  110. package/cjs/table-header/HeaderProvider.js.map +0 -1
  111. package/cjs/table-header/TableHeader.js +0 -154
  112. package/cjs/table-header/TableHeader.js.map +0 -1
  113. package/cjs/table-header/useTableHeader.js +0 -87
  114. package/cjs/table-header/useTableHeader.js.map +0 -1
  115. package/cjs/useCell.js +0 -28
  116. package/cjs/useCell.js.map +0 -1
  117. package/cjs/useCellEditing.js +0 -79
  118. package/cjs/useCellEditing.js.map +0 -1
  119. package/cjs/useCellFocus.js +0 -115
  120. package/cjs/useCellFocus.js.map +0 -1
  121. package/cjs/useControlledTableNavigation.js +0 -46
  122. package/cjs/useControlledTableNavigation.js.map +0 -1
  123. package/cjs/useDataSource.js +0 -146
  124. package/cjs/useDataSource.js.map +0 -1
  125. package/cjs/useEditableCell.js +0 -32
  126. package/cjs/useEditableCell.js.map +0 -1
  127. package/cjs/useHighlighting.js +0 -33
  128. package/cjs/useHighlighting.js.map +0 -1
  129. package/cjs/useKeyboardNavigation.js +0 -318
  130. package/cjs/useKeyboardNavigation.js.map +0 -1
  131. package/cjs/useMeasuredHeight.js +0 -41
  132. package/cjs/useMeasuredHeight.js.map +0 -1
  133. package/cjs/useRowClassNameGenerators.js +0 -34
  134. package/cjs/useRowClassNameGenerators.js.map +0 -1
  135. package/cjs/useSelection.js +0 -74
  136. package/cjs/useSelection.js.map +0 -1
  137. package/cjs/useTable.js +0 -714
  138. package/cjs/useTable.js.map +0 -1
  139. package/cjs/useTableContextMenu.js +0 -59
  140. package/cjs/useTableContextMenu.js.map +0 -1
  141. package/cjs/useTableModel.js +0 -383
  142. package/cjs/useTableModel.js.map +0 -1
  143. package/cjs/useTableScroll.js +0 -446
  144. package/cjs/useTableScroll.js.map +0 -1
  145. package/cjs/useTableViewport.js +0 -137
  146. package/cjs/useTableViewport.js.map +0 -1
  147. package/esm/CellFocusState.js +0 -43
  148. package/esm/CellFocusState.js.map +0 -1
  149. package/esm/Row.css.js +0 -4
  150. package/esm/Row.css.js.map +0 -1
  151. package/esm/Row.js +0 -148
  152. package/esm/Row.js.map +0 -1
  153. package/esm/Table.css.js +0 -4
  154. package/esm/Table.css.js.map +0 -1
  155. package/esm/Table.js +0 -431
  156. package/esm/Table.js.map +0 -1
  157. package/esm/VirtualColSpan.js +0 -17
  158. package/esm/VirtualColSpan.js.map +0 -1
  159. package/esm/bulk-edit/BulkEditDialog.js +0 -55
  160. package/esm/bulk-edit/BulkEditDialog.js.map +0 -1
  161. package/esm/bulk-edit/BulkEditPanel.css.js +0 -4
  162. package/esm/bulk-edit/BulkEditPanel.css.js.map +0 -1
  163. package/esm/bulk-edit/BulkEditPanel.js +0 -70
  164. package/esm/bulk-edit/BulkEditPanel.js.map +0 -1
  165. package/esm/bulk-edit/BulkEditRow.css.js +0 -4
  166. package/esm/bulk-edit/BulkEditRow.css.js.map +0 -1
  167. package/esm/bulk-edit/BulkEditRow.js +0 -79
  168. package/esm/bulk-edit/BulkEditRow.js.map +0 -1
  169. package/esm/bulk-edit/useBulkEditPanel.js +0 -99
  170. package/esm/bulk-edit/useBulkEditPanel.js.map +0 -1
  171. package/esm/bulk-edit/useBulkEditRow.js +0 -142
  172. package/esm/bulk-edit/useBulkEditRow.js.map +0 -1
  173. package/esm/cell-block/CellBlock.css.js +0 -4
  174. package/esm/cell-block/CellBlock.css.js.map +0 -1
  175. package/esm/cell-block/CellBlock.js +0 -43
  176. package/esm/cell-block/CellBlock.js.map +0 -1
  177. package/esm/cell-block/cellblock-utils.js +0 -116
  178. package/esm/cell-block/cellblock-utils.js.map +0 -1
  179. package/esm/cell-block/useCellBlockSelection.js +0 -252
  180. package/esm/cell-block/useCellBlockSelection.js.map +0 -1
  181. package/esm/cell-renderers/checkbox-cell/CheckboxCell.css.js +0 -4
  182. package/esm/cell-renderers/checkbox-cell/CheckboxCell.css.js.map +0 -1
  183. package/esm/cell-renderers/checkbox-cell/CheckboxCell.js +0 -66
  184. package/esm/cell-renderers/checkbox-cell/CheckboxCell.js.map +0 -1
  185. package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js +0 -4
  186. package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js.map +0 -1
  187. package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js +0 -31
  188. package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js.map +0 -1
  189. package/esm/cell-renderers/input-cell/InputCell.css.js +0 -4
  190. package/esm/cell-renderers/input-cell/InputCell.css.js.map +0 -1
  191. package/esm/cell-renderers/input-cell/InputCell.js +0 -50
  192. package/esm/cell-renderers/input-cell/InputCell.js.map +0 -1
  193. package/esm/cell-renderers/toggle-cell/ToggleCell.css.js +0 -4
  194. package/esm/cell-renderers/toggle-cell/ToggleCell.css.js.map +0 -1
  195. package/esm/cell-renderers/toggle-cell/ToggleCell.js +0 -65
  196. package/esm/cell-renderers/toggle-cell/ToggleCell.js.map +0 -1
  197. package/esm/column-header-pill/ColumnHeaderPill.css.js +0 -4
  198. package/esm/column-header-pill/ColumnHeaderPill.css.js.map +0 -1
  199. package/esm/column-header-pill/ColumnHeaderPill.js +0 -51
  200. package/esm/column-header-pill/ColumnHeaderPill.js.map +0 -1
  201. package/esm/column-header-pill/GroupColumnPill.css.js +0 -4
  202. package/esm/column-header-pill/GroupColumnPill.css.js.map +0 -1
  203. package/esm/column-header-pill/GroupColumnPill.js +0 -27
  204. package/esm/column-header-pill/GroupColumnPill.js.map +0 -1
  205. package/esm/column-header-pill/SortIndicator.css.js +0 -4
  206. package/esm/column-header-pill/SortIndicator.css.js.map +0 -1
  207. package/esm/column-header-pill/SortIndicator.js +0 -25
  208. package/esm/column-header-pill/SortIndicator.js.map +0 -1
  209. package/esm/column-resizing/ColumnResizer.css.js +0 -4
  210. package/esm/column-resizing/ColumnResizer.css.js.map +0 -1
  211. package/esm/column-resizing/ColumnResizer.js +0 -70
  212. package/esm/column-resizing/ColumnResizer.js.map +0 -1
  213. package/esm/column-resizing/useTableColumnResize.js +0 -53
  214. package/esm/column-resizing/useTableColumnResize.js.map +0 -1
  215. package/esm/header-cell/GroupHeaderCell.css.js +0 -4
  216. package/esm/header-cell/GroupHeaderCell.css.js.map +0 -1
  217. package/esm/header-cell/GroupHeaderCell.js +0 -125
  218. package/esm/header-cell/GroupHeaderCell.js.map +0 -1
  219. package/esm/header-cell/HeaderCell.css.js +0 -4
  220. package/esm/header-cell/HeaderCell.css.js.map +0 -1
  221. package/esm/header-cell/HeaderCell.js +0 -105
  222. package/esm/header-cell/HeaderCell.js.map +0 -1
  223. package/esm/pagination/PaginationControl.css.js +0 -4
  224. package/esm/pagination/PaginationControl.css.js.map +0 -1
  225. package/esm/pagination/PaginationControl.js +0 -36
  226. package/esm/pagination/PaginationControl.js.map +0 -1
  227. package/esm/pagination/usePagination.js +0 -34
  228. package/esm/pagination/usePagination.js.map +0 -1
  229. package/esm/table-cell/TableCell.css.js +0 -4
  230. package/esm/table-cell/TableCell.css.js.map +0 -1
  231. package/esm/table-cell/TableCell.js +0 -93
  232. package/esm/table-cell/TableCell.js.map +0 -1
  233. package/esm/table-cell/TableGroupCell.css.js +0 -4
  234. package/esm/table-cell/TableGroupCell.css.js.map +0 -1
  235. package/esm/table-cell/TableGroupCell.js +0 -64
  236. package/esm/table-cell/TableGroupCell.js.map +0 -1
  237. package/esm/table-config.js +0 -33
  238. package/esm/table-config.js.map +0 -1
  239. package/esm/table-dom-utils.js +0 -181
  240. package/esm/table-dom-utils.js.map +0 -1
  241. package/esm/table-header/HeaderProvider.js +0 -15
  242. package/esm/table-header/HeaderProvider.js.map +0 -1
  243. package/esm/table-header/TableHeader.js +0 -152
  244. package/esm/table-header/TableHeader.js.map +0 -1
  245. package/esm/table-header/useTableHeader.js +0 -85
  246. package/esm/table-header/useTableHeader.js.map +0 -1
  247. package/esm/useCell.js +0 -26
  248. package/esm/useCell.js.map +0 -1
  249. package/esm/useCellEditing.js +0 -77
  250. package/esm/useCellEditing.js.map +0 -1
  251. package/esm/useCellFocus.js +0 -113
  252. package/esm/useCellFocus.js.map +0 -1
  253. package/esm/useControlledTableNavigation.js +0 -43
  254. package/esm/useControlledTableNavigation.js.map +0 -1
  255. package/esm/useDataSource.js +0 -144
  256. package/esm/useDataSource.js.map +0 -1
  257. package/esm/useEditableCell.js +0 -30
  258. package/esm/useEditableCell.js.map +0 -1
  259. package/esm/useHighlighting.js +0 -31
  260. package/esm/useHighlighting.js.map +0 -1
  261. package/esm/useKeyboardNavigation.js +0 -314
  262. package/esm/useKeyboardNavigation.js.map +0 -1
  263. package/esm/useMeasuredHeight.js +0 -39
  264. package/esm/useMeasuredHeight.js.map +0 -1
  265. package/esm/useRowClassNameGenerators.js +0 -32
  266. package/esm/useRowClassNameGenerators.js.map +0 -1
  267. package/esm/useSelection.js +0 -72
  268. package/esm/useSelection.js.map +0 -1
  269. package/esm/useTable.js +0 -712
  270. package/esm/useTable.js.map +0 -1
  271. package/esm/useTableContextMenu.js +0 -56
  272. package/esm/useTableContextMenu.js.map +0 -1
  273. package/esm/useTableModel.js +0 -381
  274. package/esm/useTableModel.js.map +0 -1
  275. package/esm/useTableScroll.js +0 -443
  276. package/esm/useTableScroll.js.map +0 -1
  277. package/esm/useTableViewport.js +0 -135
  278. package/esm/useTableViewport.js.map +0 -1
@@ -1,318 +0,0 @@
1
- 'use strict';
2
-
3
- var vuuUtils = require('@vuu-ui/vuu-utils');
4
- var core = require('@salt-ds/core');
5
- var react = require('react');
6
- var tableDomUtils = require('./table-dom-utils.js');
7
-
8
- const rowNavigationKeys = /* @__PURE__ */ new Set([
9
- "Home",
10
- "End",
11
- "PageUp",
12
- "PageDown",
13
- "ArrowDown",
14
- "ArrowUp"
15
- ]);
16
- const CellLocator = ".vuuTableCell,.vuuTableHeaderCell,.vuuTableGroupHeaderCell";
17
- const CellControlLocator = ".vuuColumnMenu,.vuuColumnHeaderPill";
18
- const cellNavigationKeys = new Set(rowNavigationKeys);
19
- cellNavigationKeys.add("ArrowLeft");
20
- cellNavigationKeys.add("ArrowRight");
21
- const isNavigationKey = (key, navigationStyle) => {
22
- switch (navigationStyle) {
23
- case "cell":
24
- case "tree":
25
- return cellNavigationKeys.has(key);
26
- case "row":
27
- return rowNavigationKeys.has(key);
28
- default:
29
- return false;
30
- }
31
- };
32
- const focusControlWithinCell = (e, el) => {
33
- if (e.shiftKey && e.key.match(/Arrow(Left|Right)/)) {
34
- if (el?.classList.contains("vuuTableHeaderCell")) {
35
- const menuButton = el?.querySelector(".vuuColumnMenu");
36
- if (menuButton) {
37
- menuButton.focus();
38
- return true;
39
- }
40
- } else if (el?.classList.contains("vuuTableGroupHeaderCell")) {
41
- const headerPill = el?.querySelector(
42
- ".vuuColumnHeaderPill"
43
- );
44
- if (headerPill) {
45
- headerPill.focus();
46
- return true;
47
- }
48
- } else if (el?.classList.contains("vuuColumnHeaderPill")) {
49
- const nextPill = el.parentElement?.nextElementSibling?.firstChild;
50
- if (nextPill?.classList.contains("vuuColumnHeaderPill")) {
51
- nextPill.focus();
52
- return true;
53
- } else {
54
- const removeButton = vuuUtils.queryClosest(
55
- el,
56
- ".vuuTableGroupHeaderCell",
57
- true
58
- ).querySelector(".vuuTableGroupHeaderCell-removeAll");
59
- if (removeButton) {
60
- removeButton.focus();
61
- return true;
62
- }
63
- }
64
- }
65
- }
66
- return false;
67
- };
68
- const PageKeys = ["Home", "End", "PageUp", "PageDown"];
69
- const isPagingKey = (key) => PageKeys.includes(key);
70
- const useKeyboardNavigation = ({
71
- cellFocusStateRef,
72
- columnCount = 0,
73
- containerRef,
74
- defaultHighlightedIndex,
75
- disableHighlightOnFocus,
76
- focusCell,
77
- headerCount,
78
- highlightedIndex: highlightedIndexProp,
79
- navigationStyle,
80
- requestScroll,
81
- onHighlight,
82
- onToggleGroup,
83
- rowCount = 0,
84
- viewportRowCount
85
- }) => {
86
- const highlightedIndexRef = react.useRef(void 0);
87
- const [highlightedIndex, setHighlightedIdx] = core.useControlled({
88
- controlled: highlightedIndexProp,
89
- default: defaultHighlightedIndex,
90
- name: "UseKeyboardNavigation"
91
- });
92
- highlightedIndexRef.current = highlightedIndex;
93
- const maxRowIndex = rowCount + headerCount;
94
- const setHighlightedIndex = react.useCallback(
95
- (idx) => {
96
- onHighlight?.(idx);
97
- setHighlightedIdx(idx);
98
- highlightedIndexRef.current = idx;
99
- },
100
- [onHighlight, setHighlightedIdx]
101
- );
102
- const setActiveCell = react.useCallback(
103
- (rowIdx, colIdx, fromKeyboard = false) => {
104
- const pos = [rowIdx, colIdx];
105
- if (navigationStyle === "row") {
106
- setHighlightedIdx(rowIdx);
107
- } else {
108
- focusCell(pos, fromKeyboard);
109
- }
110
- },
111
- [focusCell, navigationStyle, setHighlightedIdx]
112
- );
113
- const nextPageItemIdx = react.useCallback(
114
- (key, [rowIdx, colIdx]) => new Promise((resolve) => {
115
- let newRowIdx = rowIdx;
116
- const { current: focusState } = cellFocusStateRef;
117
- switch (key) {
118
- case "PageDown": {
119
- newRowIdx = Math.min(rowCount - 1, rowIdx + viewportRowCount);
120
- if (newRowIdx !== rowIdx) {
121
- focusState.cellPos = [newRowIdx, colIdx];
122
- requestScroll?.({ type: "scroll-page", direction: "down" });
123
- }
124
- break;
125
- }
126
- case "PageUp": {
127
- newRowIdx = Math.max(0, rowIdx - viewportRowCount);
128
- if (newRowIdx !== rowIdx) {
129
- focusState.cellPos = [newRowIdx, colIdx];
130
- requestScroll?.({ type: "scroll-page", direction: "up" });
131
- }
132
- break;
133
- }
134
- case "Home": {
135
- newRowIdx = headerCount + 1;
136
- if (newRowIdx !== rowIdx) {
137
- focusState.cellPos = [newRowIdx, colIdx];
138
- requestScroll?.({ type: "scroll-end", direction: "home" });
139
- }
140
- break;
141
- }
142
- case "End": {
143
- newRowIdx = rowCount + headerCount;
144
- if (newRowIdx !== rowIdx) {
145
- focusState.cellPos = [newRowIdx, colIdx];
146
- requestScroll?.({ type: "scroll-end", direction: "end" });
147
- }
148
- break;
149
- }
150
- }
151
- setTimeout(() => {
152
- resolve([newRowIdx, colIdx]);
153
- }, 35);
154
- }),
155
- [cellFocusStateRef, headerCount, requestScroll, rowCount, viewportRowCount]
156
- );
157
- const handleFocus = react.useCallback(() => {
158
- if (disableHighlightOnFocus !== true) {
159
- if (containerRef.current?.contains(document.activeElement)) {
160
- const focusedCell = tableDomUtils.getFocusedCell(document.activeElement);
161
- if (focusedCell) {
162
- cellFocusStateRef.current.cell = focusedCell;
163
- if (navigationStyle === "row") {
164
- setHighlightedIdx(cellFocusStateRef.current.cellPos?.[0]);
165
- }
166
- }
167
- }
168
- }
169
- }, [
170
- disableHighlightOnFocus,
171
- containerRef,
172
- cellFocusStateRef,
173
- navigationStyle,
174
- setHighlightedIdx
175
- ]);
176
- const navigateChildItems = react.useCallback(
177
- async (navigationStyle2 = "cell", key, shiftKey = false) => {
178
- const { cellPos } = cellFocusStateRef.current;
179
- if (cellPos === void 0) {
180
- throw Error("navigateChildItems called before cellPos is set");
181
- }
182
- const [rowIdx, colIdx] = cellPos;
183
- let nextRowIdx = -1, nextColIdx = -1;
184
- if (isPagingKey(key)) {
185
- [nextRowIdx, nextColIdx] = await nextPageItemIdx(key, cellPos);
186
- } else {
187
- const treeNodeOperation = tableDomUtils.getTreeNodeOperation(
188
- containerRef,
189
- navigationStyle2,
190
- cellPos,
191
- key,
192
- shiftKey
193
- );
194
- if (treeNodeOperation === "expand" || treeNodeOperation === "collapse") {
195
- onToggleGroup(treeNodeOperation, rowIdx - headerCount - 1);
196
- } else if (treeNodeOperation === "level-up") {
197
- [nextRowIdx, nextColIdx] = tableDomUtils.getLevelUp(containerRef, cellPos);
198
- } else {
199
- [nextRowIdx, nextColIdx] = tableDomUtils.getNextCellPos(
200
- key,
201
- cellPos,
202
- columnCount,
203
- maxRowIndex
204
- );
205
- }
206
- }
207
- if (nextRowIdx !== rowIdx || nextColIdx !== colIdx) {
208
- setActiveCell(nextRowIdx, nextColIdx, true);
209
- setHighlightedIndex(nextRowIdx);
210
- }
211
- },
212
- [
213
- cellFocusStateRef,
214
- nextPageItemIdx,
215
- containerRef,
216
- onToggleGroup,
217
- headerCount,
218
- columnCount,
219
- maxRowIndex,
220
- setActiveCell,
221
- setHighlightedIndex
222
- ]
223
- );
224
- const scrollRowIntoViewIfNecessary = react.useCallback(
225
- (rowIndex) => {
226
- requestScroll?.({ type: "scroll-row", rowIndex });
227
- },
228
- [requestScroll]
229
- );
230
- const moveHighlightedRow = react.useCallback(
231
- async (key) => {
232
- const { current: highlighted } = highlightedIndexRef;
233
- const [nextRowIdx] = isPagingKey(key) ? await nextPageItemIdx(key, [highlighted ?? -1, 0]) : tableDomUtils.getNextCellPos(key, [highlighted ?? -1, 0], columnCount, maxRowIndex);
234
- if (nextRowIdx !== highlighted) {
235
- setHighlightedIndex(nextRowIdx);
236
- scrollRowIntoViewIfNecessary(nextRowIdx);
237
- }
238
- },
239
- [
240
- columnCount,
241
- maxRowIndex,
242
- nextPageItemIdx,
243
- scrollRowIntoViewIfNecessary,
244
- setHighlightedIndex
245
- ]
246
- );
247
- react.useEffect(() => {
248
- if (highlightedIndexProp !== void 0 && highlightedIndexProp !== -1) {
249
- requestAnimationFrame(() => {
250
- scrollRowIntoViewIfNecessary(highlightedIndexProp);
251
- });
252
- }
253
- }, [highlightedIndexProp, scrollRowIntoViewIfNecessary]);
254
- const handleKeyDown = react.useCallback(
255
- (e) => {
256
- const cell = vuuUtils.queryClosest(
257
- e.target,
258
- `${CellLocator},${CellControlLocator}`
259
- );
260
- if (tableDomUtils.cellDropdownShowing(cell)) {
261
- return;
262
- }
263
- if (rowCount > 0 && isNavigationKey(e.key, navigationStyle)) {
264
- e.preventDefault();
265
- e.stopPropagation();
266
- if (navigationStyle === "row") {
267
- moveHighlightedRow(e.key);
268
- } else if (navigationStyle !== "none") {
269
- if (!focusControlWithinCell(e, cell)) {
270
- navigateChildItems(navigationStyle, e.key, e.shiftKey);
271
- }
272
- }
273
- }
274
- },
275
- [rowCount, navigationStyle, moveHighlightedRow, navigateChildItems]
276
- );
277
- const handleClick = react.useCallback(
278
- // Might not be a cell e.g the Settings button
279
- (evt) => {
280
- const target = vuuUtils.queryClosest(evt.target, CellLocator);
281
- const focusedCell = tableDomUtils.getFocusedCell(target);
282
- if (focusedCell) {
283
- const [rowIdx, colIdx] = tableDomUtils.getAriaCellPos(focusedCell);
284
- setActiveCell(rowIdx, colIdx);
285
- }
286
- },
287
- [setActiveCell]
288
- );
289
- const handleMouseLeave = react.useCallback(() => {
290
- setHighlightedIndex(-1);
291
- }, [setHighlightedIndex]);
292
- const handleMouseMove = react.useCallback(
293
- (evt) => {
294
- const rowIdx = tableDomUtils.closestRowIndex(evt.target);
295
- if (rowIdx !== -1 && rowIdx !== highlightedIndexRef.current) {
296
- setHighlightedIndex(rowIdx);
297
- }
298
- },
299
- [setHighlightedIndex]
300
- );
301
- const navigateCell = react.useCallback(() => {
302
- navigateChildItems("cell", "ArrowDown");
303
- }, [navigateChildItems]);
304
- return {
305
- highlightedIndexRef,
306
- navigateCell,
307
- onClick: handleClick,
308
- onFocus: handleFocus,
309
- onKeyDown: handleKeyDown,
310
- onMouseLeave: navigationStyle === "row" ? handleMouseLeave : void 0,
311
- onMouseMove: navigationStyle === "row" ? handleMouseMove : void 0
312
- };
313
- };
314
-
315
- exports.isNavigationKey = isNavigationKey;
316
- exports.isPagingKey = isPagingKey;
317
- exports.useKeyboardNavigation = useKeyboardNavigation;
318
- //# sourceMappingURL=useKeyboardNavigation.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useKeyboardNavigation.js","sources":["../src/useKeyboardNavigation.ts"],"sourcesContent":["import { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { PageKey, queryClosest } from \"@vuu-ui/vuu-utils\";\nimport { useControlled } from \"@salt-ds/core\";\nimport {\n KeyboardEvent,\n MouseEvent,\n MutableRefObject,\n RefObject,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\nimport { TableNavigationStyle } from \"./Table\";\nimport {\n NavigationKey,\n cellDropdownShowing,\n closestRowIndex,\n getAriaCellPos,\n getFocusedCell,\n getNextCellPos,\n getTreeNodeOperation,\n getLevelUp as getLevelUp,\n} from \"./table-dom-utils\";\nimport { ScrollRequestHandler } from \"./useTableScroll\";\nimport { FocusCell } from \"./useCellFocus\";\nimport { CellPos } from \"@vuu-ui/vuu-table-types\";\nimport { CellFocusState } from \"./CellFocusState\";\n\nconst rowNavigationKeys = new Set<NavigationKey>([\n \"Home\",\n \"End\",\n \"PageUp\",\n \"PageDown\",\n \"ArrowDown\",\n \"ArrowUp\",\n]);\n\nconst CellLocator =\n \".vuuTableCell,.vuuTableHeaderCell,.vuuTableGroupHeaderCell\";\n\nconst CellControlLocator = \".vuuColumnMenu,.vuuColumnHeaderPill\";\n\nconst cellNavigationKeys = new Set(rowNavigationKeys);\ncellNavigationKeys.add(\"ArrowLeft\");\ncellNavigationKeys.add(\"ArrowRight\");\n\nexport const isNavigationKey = (\n key: string,\n navigationStyle: TableNavigationStyle,\n): key is NavigationKey => {\n switch (navigationStyle) {\n case \"cell\":\n case \"tree\":\n return cellNavigationKeys.has(key as NavigationKey);\n case \"row\":\n return rowNavigationKeys.has(key as NavigationKey);\n default:\n return false;\n }\n};\n\nconst focusControlWithinCell = (e: KeyboardEvent, el: HTMLElement | null) => {\n if (e.shiftKey && e.key.match(/Arrow(Left|Right)/)) {\n if (el?.classList.contains(\"vuuTableHeaderCell\")) {\n const menuButton = el?.querySelector<HTMLButtonElement>(\".vuuColumnMenu\");\n if (menuButton) {\n menuButton.focus();\n return true;\n }\n } else if (el?.classList.contains(\"vuuTableGroupHeaderCell\")) {\n const headerPill = el?.querySelector<HTMLButtonElement>(\n \".vuuColumnHeaderPill\",\n );\n if (headerPill) {\n headerPill.focus();\n return true;\n }\n } else if (el?.classList.contains(\"vuuColumnHeaderPill\")) {\n const nextPill = el.parentElement?.nextElementSibling\n ?.firstChild as HTMLElement;\n if (nextPill?.classList.contains(\"vuuColumnHeaderPill\")) {\n nextPill.focus();\n return true;\n } else {\n const removeButton = queryClosest(\n el,\n \".vuuTableGroupHeaderCell\",\n true,\n ).querySelector(\".vuuTableGroupHeaderCell-removeAll\") as HTMLElement;\n if (removeButton) {\n removeButton.focus();\n return true;\n }\n }\n }\n }\n return false;\n};\n\nconst PageKeys = [\"Home\", \"End\", \"PageUp\", \"PageDown\"];\nexport const isPagingKey = (key: string): key is PageKey =>\n PageKeys.includes(key);\n\nexport type GroupToggleHandler = (\n treeNodeOperation: \"expand\" | \"collapse\",\n rowIndex: number,\n) => void;\n\nexport interface NavigationHookProps {\n cellFocusStateRef: MutableRefObject<CellFocusState>;\n containerRef: RefObject<HTMLElement | null>;\n columnCount?: number;\n headerCount: number;\n defaultHighlightedIndex?: number;\n disableFocus?: boolean;\n disableHighlightOnFocus?: boolean;\n focusCell: FocusCell;\n highlightedIndex?: number;\n label?: string;\n navigationStyle: TableNavigationStyle;\n viewportRange: VuuRange;\n onHighlight?: (idx: number) => void;\n onToggleGroup: GroupToggleHandler;\n requestScroll?: ScrollRequestHandler;\n restoreLastFocus?: boolean;\n rowCount?: number;\n selected?: unknown;\n viewportRowCount: number;\n}\n\nexport const useKeyboardNavigation = ({\n cellFocusStateRef,\n columnCount = 0,\n containerRef,\n defaultHighlightedIndex,\n disableHighlightOnFocus,\n focusCell,\n headerCount,\n highlightedIndex: highlightedIndexProp,\n navigationStyle,\n requestScroll,\n onHighlight,\n onToggleGroup,\n rowCount = 0,\n viewportRowCount,\n}: NavigationHookProps) => {\n // Keep this in sync with state value. This can be used by functions that need\n // to reference highlightedIndex at call time but do not need to be regenerated\n // every time it changes (i.e keep highlightedIndex out of their dependency\n // arrays, as it can update frequently)\n const highlightedIndexRef = useRef<number | undefined>(undefined);\n\n const [highlightedIndex, setHighlightedIdx] = useControlled({\n controlled: highlightedIndexProp,\n default: defaultHighlightedIndex,\n name: \"UseKeyboardNavigation\",\n });\n highlightedIndexRef.current = highlightedIndex;\n\n // We use aria row index for tracking rows\n const maxRowIndex = rowCount + headerCount;\n\n const setHighlightedIndex = useCallback(\n (idx: number) => {\n onHighlight?.(idx);\n setHighlightedIdx(idx);\n highlightedIndexRef.current = idx;\n },\n [onHighlight, setHighlightedIdx],\n );\n\n const setActiveCell = useCallback(\n (rowIdx: number, colIdx: number, fromKeyboard = false) => {\n const pos: CellPos = [rowIdx, colIdx];\n if (navigationStyle === \"row\") {\n setHighlightedIdx(rowIdx);\n } else {\n focusCell(pos, fromKeyboard);\n }\n },\n [focusCell, navigationStyle, setHighlightedIdx],\n );\n\n const nextPageItemIdx = useCallback(\n (\n key: \"PageDown\" | \"PageUp\" | \"Home\" | \"End\",\n [rowIdx, colIdx]: CellPos,\n ): Promise<CellPos> =>\n new Promise((resolve) => {\n let newRowIdx = rowIdx;\n const { current: focusState } = cellFocusStateRef;\n switch (key) {\n case \"PageDown\": {\n newRowIdx = Math.min(rowCount - 1, rowIdx + viewportRowCount);\n if (newRowIdx !== rowIdx) {\n focusState.cellPos = [newRowIdx, colIdx];\n requestScroll?.({ type: \"scroll-page\", direction: \"down\" });\n }\n break;\n }\n case \"PageUp\": {\n newRowIdx = Math.max(0, rowIdx - viewportRowCount);\n if (newRowIdx !== rowIdx) {\n focusState.cellPos = [newRowIdx, colIdx];\n requestScroll?.({ type: \"scroll-page\", direction: \"up\" });\n }\n break;\n }\n case \"Home\": {\n newRowIdx = headerCount + 1;\n if (newRowIdx !== rowIdx) {\n focusState.cellPos = [newRowIdx, colIdx];\n requestScroll?.({ type: \"scroll-end\", direction: \"home\" });\n }\n break;\n }\n case \"End\": {\n newRowIdx = rowCount + headerCount;\n if (newRowIdx !== rowIdx) {\n focusState.cellPos = [newRowIdx, colIdx];\n requestScroll?.({ type: \"scroll-end\", direction: \"end\" });\n }\n break;\n }\n }\n // Introduce a delay to allow the scroll operation to complete,\n // which will trigger a range reset and rerender of rows. We\n // might need to tweak how this works. If we introduce too big\n // a delay, we risk seeing the newly rendered rows, with the focus\n // still on the old cell, which will be apparent as a brief flash\n // of the old cell focus before switching to correct cell. If we were\n // to change the way re assign keys such that we can guarantee that\n // when we page down, rows in same position get same keys, then same\n // cell would be focussed in new page as previous and issue would not\n // arise.\n setTimeout(() => {\n resolve([newRowIdx, colIdx]);\n }, 35);\n }),\n [cellFocusStateRef, headerCount, requestScroll, rowCount, viewportRowCount],\n );\n\n const handleFocus = useCallback(() => {\n if (disableHighlightOnFocus !== true) {\n if (containerRef.current?.contains(document.activeElement)) {\n // IF focus arrives via keyboard, a cell will have received focus,\n // we handle that here. If focus arrives via click on a cell with\n // no tabindex (i.e all cells except one) we leave that to the\n // click handler.\n const focusedCell = getFocusedCell(document.activeElement);\n if (focusedCell) {\n cellFocusStateRef.current.cell = focusedCell;\n if (navigationStyle === \"row\") {\n setHighlightedIdx(cellFocusStateRef.current.cellPos?.[0]);\n }\n }\n }\n }\n }, [\n disableHighlightOnFocus,\n containerRef,\n cellFocusStateRef,\n navigationStyle,\n setHighlightedIdx,\n ]);\n\n const navigateChildItems = useCallback(\n async (\n navigationStyle: \"cell\" | \"tree\" = \"cell\",\n key: NavigationKey,\n shiftKey = false,\n ): Promise<undefined> => {\n const { cellPos } = cellFocusStateRef.current;\n if (cellPos === undefined) {\n throw Error(\"navigateChildItems called before cellPos is set\");\n }\n const [rowIdx, colIdx] = cellPos;\n let nextRowIdx = -1,\n nextColIdx = -1;\n\n if (isPagingKey(key)) {\n [nextRowIdx, nextColIdx] = await nextPageItemIdx(key, cellPos);\n } else {\n const treeNodeOperation = getTreeNodeOperation(\n containerRef,\n navigationStyle,\n cellPos,\n key,\n shiftKey,\n );\n if (\n treeNodeOperation === \"expand\" ||\n treeNodeOperation === \"collapse\"\n ) {\n onToggleGroup(treeNodeOperation, rowIdx - headerCount - 1);\n } else if (treeNodeOperation === \"level-up\") {\n [nextRowIdx, nextColIdx] = getLevelUp(containerRef, cellPos);\n } else {\n [nextRowIdx, nextColIdx] = getNextCellPos(\n key,\n cellPos,\n columnCount,\n maxRowIndex,\n );\n }\n }\n\n if (nextRowIdx !== rowIdx || nextColIdx !== colIdx) {\n setActiveCell(nextRowIdx, nextColIdx, true);\n setHighlightedIndex(nextRowIdx);\n }\n },\n [\n cellFocusStateRef,\n nextPageItemIdx,\n containerRef,\n onToggleGroup,\n headerCount,\n columnCount,\n maxRowIndex,\n setActiveCell,\n setHighlightedIndex,\n ],\n );\n\n const scrollRowIntoViewIfNecessary = useCallback(\n (rowIndex: number) => {\n requestScroll?.({ type: \"scroll-row\", rowIndex });\n },\n [requestScroll],\n );\n\n const moveHighlightedRow = useCallback(\n async (key: NavigationKey) => {\n const { current: highlighted } = highlightedIndexRef;\n const [nextRowIdx] = isPagingKey(key)\n ? await nextPageItemIdx(key, [highlighted ?? -1, 0])\n : getNextCellPos(key, [highlighted ?? -1, 0], columnCount, maxRowIndex);\n if (nextRowIdx !== highlighted) {\n setHighlightedIndex(nextRowIdx);\n // TO(DO make this a scroll request)\n scrollRowIntoViewIfNecessary(nextRowIdx);\n }\n },\n [\n columnCount,\n maxRowIndex,\n nextPageItemIdx,\n scrollRowIntoViewIfNecessary,\n setHighlightedIndex,\n ],\n );\n\n useEffect(() => {\n if (highlightedIndexProp !== undefined && highlightedIndexProp !== -1) {\n requestAnimationFrame(() => {\n // deferred call, ensuring table has fully rendered\n scrollRowIntoViewIfNecessary(highlightedIndexProp);\n });\n }\n }, [highlightedIndexProp, scrollRowIntoViewIfNecessary]);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n const cell = queryClosest<HTMLDivElement>(\n e.target,\n `${CellLocator},${CellControlLocator}`,\n );\n if (cellDropdownShowing(cell)) {\n return;\n }\n if (rowCount > 0 && isNavigationKey(e.key, navigationStyle)) {\n e.preventDefault();\n e.stopPropagation();\n if (navigationStyle === \"row\") {\n moveHighlightedRow(e.key);\n } else if (navigationStyle !== \"none\") {\n if (!focusControlWithinCell(e, cell)) {\n navigateChildItems(navigationStyle, e.key, e.shiftKey);\n }\n }\n }\n },\n [rowCount, navigationStyle, moveHighlightedRow, navigateChildItems],\n );\n\n const handleClick = useCallback(\n // Might not be a cell e.g the Settings button\n (evt: MouseEvent) => {\n const target = queryClosest<HTMLDivElement>(evt.target, CellLocator);\n const focusedCell = getFocusedCell(target);\n if (focusedCell) {\n const [rowIdx, colIdx] = getAriaCellPos(focusedCell);\n setActiveCell(rowIdx, colIdx);\n }\n },\n [setActiveCell],\n );\n\n const handleMouseLeave = useCallback(() => {\n setHighlightedIndex(-1);\n }, [setHighlightedIndex]);\n\n const handleMouseMove = useCallback(\n (evt: MouseEvent) => {\n const rowIdx = closestRowIndex(evt.target as HTMLElement);\n if (rowIdx !== -1 && rowIdx !== highlightedIndexRef.current) {\n setHighlightedIndex(rowIdx);\n }\n },\n [setHighlightedIndex],\n );\n\n /**\n * used when editing cells\n */\n const navigateCell = useCallback(() => {\n navigateChildItems(\"cell\", \"ArrowDown\");\n }, [navigateChildItems]);\n\n return {\n highlightedIndexRef,\n navigateCell,\n onClick: handleClick,\n onFocus: handleFocus,\n onKeyDown: handleKeyDown,\n onMouseLeave: navigationStyle === \"row\" ? handleMouseLeave : undefined,\n onMouseMove: navigationStyle === \"row\" ? handleMouseMove : undefined,\n };\n};\n"],"names":["queryClosest","useRef","useControlled","useCallback","getFocusedCell","navigationStyle","getTreeNodeOperation","getLevelUp","getNextCellPos","useEffect","cellDropdownShowing","getAriaCellPos","closestRowIndex"],"mappings":"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"}
@@ -1,41 +0,0 @@
1
- 'use strict';
2
-
3
- var vuuUtils = require('@vuu-ui/vuu-utils');
4
- var react = require('react');
5
-
6
- const useMeasuredHeight = ({
7
- onHeightMeasured,
8
- height: heightProp = 0
9
- }) => {
10
- const [measuredHeight, setMeasuredHeight] = react.useState(heightProp);
11
- const resizeObserver = react.useMemo(() => {
12
- return new ResizeObserver((entries) => {
13
- for (const entry of entries) {
14
- const [{ blockSize: measuredSize }] = entry.borderBoxSize;
15
- const newHeight = Math.round(measuredSize);
16
- if (vuuUtils.isValidNumber(newHeight)) {
17
- setMeasuredHeight(newHeight);
18
- onHeightMeasured?.(newHeight);
19
- }
20
- }
21
- });
22
- }, [onHeightMeasured]);
23
- const measuredRef = react.useCallback(
24
- (el) => {
25
- if (el) {
26
- if (heightProp === 0) {
27
- const { height } = el.getBoundingClientRect();
28
- resizeObserver.observe(el);
29
- setMeasuredHeight(Math.round(height));
30
- }
31
- } else {
32
- resizeObserver.disconnect();
33
- }
34
- },
35
- [resizeObserver, heightProp]
36
- );
37
- return { measuredHeight, measuredRef };
38
- };
39
-
40
- exports.useMeasuredHeight = useMeasuredHeight;
41
- //# sourceMappingURL=useMeasuredHeight.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useMeasuredHeight.js","sources":["../src/useMeasuredHeight.ts"],"sourcesContent":["import { isValidNumber } from \"@vuu-ui/vuu-utils\";\nimport { RefCallback, useCallback, useMemo, useState } from \"react\";\n\ninterface MeasuredHeightHookProps {\n onHeightMeasured?: (height: number) => void;\n height?: number;\n}\n\nexport const useMeasuredHeight = ({\n onHeightMeasured,\n height: heightProp = 0,\n}: MeasuredHeightHookProps) => {\n const [measuredHeight, setMeasuredHeight] = useState(heightProp);\n\n const resizeObserver = useMemo(() => {\n return new ResizeObserver((entries: ResizeObserverEntry[]) => {\n for (const entry of entries) {\n const [{ blockSize: measuredSize }] = entry.borderBoxSize;\n const newHeight = Math.round(measuredSize);\n if (isValidNumber(newHeight)) {\n setMeasuredHeight(newHeight);\n onHeightMeasured?.(newHeight);\n }\n }\n });\n }, [onHeightMeasured]);\n\n const measuredRef = useCallback<RefCallback<HTMLDivElement>>(\n (el) => {\n if (el) {\n if (heightProp === 0) {\n const { height } = el.getBoundingClientRect();\n resizeObserver.observe(el);\n // avoids tiny sub-pixel discrepancies\n setMeasuredHeight(Math.round(height));\n }\n } else {\n resizeObserver.disconnect();\n }\n },\n [resizeObserver, heightProp],\n );\n return { measuredHeight, measuredRef };\n};\n"],"names":["useState","useMemo","isValidNumber","useCallback"],"mappings":";;;;;AAQO,MAAM,oBAAoB,CAAC;AAAA,EAChC,gBAAA;AAAA,EACA,QAAQ,UAAa,GAAA;AACvB,CAA+B,KAAA;AAC7B,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAIA,eAAS,UAAU,CAAA;AAE/D,EAAM,MAAA,cAAA,GAAiBC,cAAQ,MAAM;AACnC,IAAO,OAAA,IAAI,cAAe,CAAA,CAAC,OAAmC,KAAA;AAC5D,MAAA,KAAA,MAAW,SAAS,OAAS,EAAA;AAC3B,QAAA,MAAM,CAAC,EAAE,SAAA,EAAW,YAAa,EAAC,IAAI,KAAM,CAAA,aAAA;AAC5C,QAAM,MAAA,SAAA,GAAY,IAAK,CAAA,KAAA,CAAM,YAAY,CAAA;AACzC,QAAI,IAAAC,sBAAA,CAAc,SAAS,CAAG,EAAA;AAC5B,UAAA,iBAAA,CAAkB,SAAS,CAAA;AAC3B,UAAA,gBAAA,GAAmB,SAAS,CAAA;AAAA;AAC9B;AACF,KACD,CAAA;AAAA,GACH,EAAG,CAAC,gBAAgB,CAAC,CAAA;AAErB,EAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,IAClB,CAAC,EAAO,KAAA;AACN,MAAA,IAAI,EAAI,EAAA;AACN,QAAA,IAAI,eAAe,CAAG,EAAA;AACpB,UAAA,MAAM,EAAE,MAAA,EAAW,GAAA,EAAA,CAAG,qBAAsB,EAAA;AAC5C,UAAA,cAAA,CAAe,QAAQ,EAAE,CAAA;AAEzB,UAAkB,iBAAA,CAAA,IAAA,CAAK,KAAM,CAAA,MAAM,CAAC,CAAA;AAAA;AACtC,OACK,MAAA;AACL,QAAA,cAAA,CAAe,UAAW,EAAA;AAAA;AAC5B,KACF;AAAA,IACA,CAAC,gBAAgB,UAAU;AAAA,GAC7B;AACA,EAAO,OAAA,EAAE,gBAAgB,WAAY,EAAA;AACvC;;;;"}
@@ -1,34 +0,0 @@
1
- 'use strict';
2
-
3
- var vuuUtils = require('@vuu-ui/vuu-utils');
4
- var react = require('react');
5
-
6
- const createClassNameGenerator = (ids) => {
7
- const functions = [];
8
- ids?.forEach((id) => {
9
- const fn = vuuUtils.getRowClassNameGenerator(id);
10
- if (fn) {
11
- functions.push(fn.fn);
12
- }
13
- });
14
- return (row, columnMap) => {
15
- const classNames = [];
16
- functions?.forEach((fn) => {
17
- const className = fn(row, columnMap);
18
- if (className) {
19
- classNames.push(className);
20
- }
21
- });
22
- return classNames.join(" ");
23
- };
24
- };
25
- const useRowClassNameGenerators = ({
26
- rowClassNameGenerators
27
- }) => {
28
- return react.useMemo(() => {
29
- return createClassNameGenerator(rowClassNameGenerators);
30
- }, [rowClassNameGenerators]);
31
- };
32
-
33
- exports.useRowClassNameGenerators = useRowClassNameGenerators;
34
- //# sourceMappingURL=useRowClassNameGenerators.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useRowClassNameGenerators.js","sources":["../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,74 +0,0 @@
1
- 'use strict';
2
-
3
- var vuuUtils = require('@vuu-ui/vuu-utils');
4
- var react = require('react');
5
- var tableDomUtils = require('./table-dom-utils.js');
6
-
7
- const { IDX } = vuuUtils.metadataKeys;
8
- const NO_SELECTION = [];
9
- const defaultSelectionKeys = ["Enter", " "];
10
- const useSelection = ({
11
- containerRef,
12
- defaultSelectedIndexValues = NO_SELECTION,
13
- highlightedIndexRef,
14
- selectionKeys = defaultSelectionKeys,
15
- selectionModel,
16
- onSelect,
17
- onSelectionChange
18
- }) => {
19
- const lastActiveRef = react.useRef(-1);
20
- const selectedRef = react.useRef(defaultSelectedIndexValues);
21
- const isSelectionEvent = react.useCallback(
22
- (evt) => selectionKeys.includes(evt.key),
23
- [selectionKeys]
24
- );
25
- const handleRowClick = react.useCallback(
26
- (e, row, rangeSelect, keepExistingSelection) => {
27
- const { [IDX]: idx } = row;
28
- const { current: active } = lastActiveRef;
29
- const { current: selected } = selectedRef;
30
- const selectOperation = vuuUtils.isRowSelected(row) ? vuuUtils.deselectItem : vuuUtils.selectItem;
31
- if (selectionModel === "checkbox") {
32
- const cell = vuuUtils.queryClosest(e.target, ".vuuTableCell");
33
- if (!cell?.querySelector(".vuuCheckboxRowSelector")) {
34
- return;
35
- }
36
- }
37
- const newSelected = selectOperation(
38
- selectionModel,
39
- selected,
40
- idx,
41
- rangeSelect,
42
- keepExistingSelection,
43
- active
44
- );
45
- selectedRef.current = newSelected;
46
- lastActiveRef.current = idx;
47
- onSelect?.(selectOperation === vuuUtils.selectItem ? row : null);
48
- onSelectionChange?.(newSelected);
49
- },
50
- [onSelect, onSelectionChange, selectionModel]
51
- );
52
- const handleKeyDown = react.useCallback(
53
- (e) => {
54
- if (isSelectionEvent(e)) {
55
- const { current: rowIndex } = highlightedIndexRef;
56
- const { current: container } = containerRef;
57
- if (rowIndex !== void 0 && rowIndex !== -1 && container) {
58
- const rowEl = tableDomUtils.getRowElementByAriaIndex(container, rowIndex);
59
- if (rowEl) {
60
- vuuUtils.dispatchMouseEvent(rowEl, "click");
61
- }
62
- }
63
- }
64
- },
65
- [containerRef, highlightedIndexRef, isSelectionEvent]
66
- );
67
- return {
68
- onKeyDown: handleKeyDown,
69
- onRowClick: handleRowClick
70
- };
71
- };
72
-
73
- exports.useSelection = useSelection;
74
- //# sourceMappingURL=useSelection.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useSelection.js","sources":["../src/useSelection.ts"],"sourcesContent":["import {\n TableRowClickHandlerInternal,\n TableRowSelectHandlerInternal,\n TableSelectionModel,\n} from \"@vuu-ui/vuu-table-types\";\nimport {\n deselectItem,\n dispatchMouseEvent,\n isRowSelected,\n metadataKeys,\n queryClosest,\n selectItem,\n} from \"@vuu-ui/vuu-utils\";\nimport { Selection } from \"@vuu-ui/vuu-data-types\";\nimport {\n KeyboardEvent,\n KeyboardEventHandler,\n RefObject,\n useCallback,\n useRef,\n} from \"react\";\nimport { getRowElementByAriaIndex } from \"./table-dom-utils\";\nimport { TableProps } from \"./Table\";\n\nconst { IDX } = metadataKeys;\n\nconst NO_SELECTION: Selection = [];\n\nconst defaultSelectionKeys = [\"Enter\", \" \"];\n\nexport interface SelectionHookProps\n extends Pick<TableProps, \"defaultSelectedIndexValues\" | \"onSelectionChange\"> {\n containerRef: RefObject<HTMLElement | null>;\n highlightedIndexRef: RefObject<number | undefined>;\n selectionKeys?: string[];\n selectionModel: TableSelectionModel;\n onSelect?: TableRowSelectHandlerInternal;\n}\n\nexport const useSelection = ({\n containerRef,\n defaultSelectedIndexValues = NO_SELECTION,\n highlightedIndexRef,\n selectionKeys = defaultSelectionKeys,\n selectionModel,\n onSelect,\n onSelectionChange,\n}: SelectionHookProps) => {\n selectionModel === \"extended\" || selectionModel === \"checkbox\";\n const lastActiveRef = useRef(-1);\n const selectedRef = useRef<Selection>(defaultSelectedIndexValues);\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]: idx } = row;\n const { current: active } = lastActiveRef;\n const { current: selected } = selectedRef;\n\n const selectOperation = isRowSelected(row) ? deselectItem : selectItem;\n\n if (selectionModel === \"checkbox\") {\n const cell = queryClosest(e.target, \".vuuTableCell\");\n if (!cell?.querySelector(\".vuuCheckboxRowSelector\")) {\n return;\n }\n }\n\n const newSelected = selectOperation(\n selectionModel,\n selected,\n idx,\n rangeSelect,\n keepExistingSelection,\n active,\n );\n\n selectedRef.current = newSelected;\n lastActiveRef.current = idx;\n\n onSelect?.(selectOperation === selectItem ? row : null);\n onSelectionChange?.(newSelected);\n },\n [onSelect, onSelectionChange, selectionModel],\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 return {\n onKeyDown: handleKeyDown,\n onRowClick: handleRowClick,\n };\n};\n"],"names":["metadataKeys","useRef","useCallback","isRowSelected","deselectItem","selectItem","queryClosest","getRowElementByAriaIndex","dispatchMouseEvent"],"mappings":";;;;;;AAwBA,MAAM,EAAE,KAAQ,GAAAA,qBAAA;AAEhB,MAAM,eAA0B,EAAC;AAEjC,MAAM,oBAAA,GAAuB,CAAC,OAAA,EAAS,GAAG,CAAA;AAWnC,MAAM,eAAe,CAAC;AAAA,EAC3B,YAAA;AAAA,EACA,0BAA6B,GAAA,YAAA;AAAA,EAC7B,mBAAA;AAAA,EACA,aAAgB,GAAA,oBAAA;AAAA,EAChB,cAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAA0B,KAAA;AAExB,EAAM,MAAA,aAAA,GAAgBC,aAAO,CAAE,CAAA,CAAA;AAC/B,EAAM,MAAA,WAAA,GAAcA,aAAkB,0BAA0B,CAAA;AAEhE,EAAA,MAAM,gBAAmB,GAAAC,iBAAA;AAAA,IACvB,CAAC,GAAA,KAAoC,aAAc,CAAA,QAAA,CAAS,IAAI,GAAG,CAAA;AAAA,IACnE,CAAC,aAAa;AAAA,GAChB;AAEA,EAAA,MAAM,cAAiB,GAAAA,iBAAA;AAAA,IACrB,CAAC,CAAA,EAAG,GAAK,EAAA,WAAA,EAAa,qBAA0B,KAAA;AAC9C,MAAA,MAAM,EAAE,CAAC,GAAG,GAAG,KAAQ,GAAA,GAAA;AACvB,MAAM,MAAA,EAAE,OAAS,EAAA,MAAA,EAAW,GAAA,aAAA;AAC5B,MAAM,MAAA,EAAE,OAAS,EAAA,QAAA,EAAa,GAAA,WAAA;AAE9B,MAAA,MAAM,eAAkB,GAAAC,sBAAA,CAAc,GAAG,CAAA,GAAIC,qBAAe,GAAAC,mBAAA;AAE5D,MAAA,IAAI,mBAAmB,UAAY,EAAA;AACjC,QAAA,MAAM,IAAO,GAAAC,qBAAA,CAAa,CAAE,CAAA,MAAA,EAAQ,eAAe,CAAA;AACnD,QAAA,IAAI,CAAC,IAAA,EAAM,aAAc,CAAA,yBAAyB,CAAG,EAAA;AACnD,UAAA;AAAA;AACF;AAGF,MAAA,MAAM,WAAc,GAAA,eAAA;AAAA,QAClB,cAAA;AAAA,QACA,QAAA;AAAA,QACA,GAAA;AAAA,QACA,WAAA;AAAA,QACA,qBAAA;AAAA,QACA;AAAA,OACF;AAEA,MAAA,WAAA,CAAY,OAAU,GAAA,WAAA;AACtB,MAAA,aAAA,CAAc,OAAU,GAAA,GAAA;AAExB,MAAW,QAAA,GAAA,eAAA,KAAoBD,mBAAa,GAAA,GAAA,GAAM,IAAI,CAAA;AACtD,MAAA,iBAAA,GAAoB,WAAW,CAAA;AAAA,KACjC;AAAA,IACA,CAAC,QAAU,EAAA,iBAAA,EAAmB,cAAc;AAAA,GAC9C;AAEA,EAAA,MAAM,aAAgB,GAAAH,iBAAA;AAAA,IACpB,CAAC,CAAM,KAAA;AACL,MAAI,IAAA,gBAAA,CAAiB,CAAC,CAAG,EAAA;AACvB,QAAM,MAAA,EAAE,OAAS,EAAA,QAAA,EAAa,GAAA,mBAAA;AAC9B,QAAM,MAAA,EAAE,OAAS,EAAA,SAAA,EAAc,GAAA,YAAA;AAC/B,QAAA,IAAI,QAAa,KAAA,KAAA,CAAA,IAAa,QAAa,KAAA,CAAA,CAAA,IAAM,SAAW,EAAA;AAC1D,UAAM,MAAA,KAAA,GAAQK,sCAAyB,CAAA,SAAA,EAAW,QAAQ,CAAA;AAC1D,UAAA,IAAI,KAAO,EAAA;AACT,YAAAC,2BAAA,CAAmB,OAAO,OAAO,CAAA;AAAA;AACnC;AACF;AACF,KACF;AAAA,IACA,CAAC,YAAc,EAAA,mBAAA,EAAqB,gBAAgB;AAAA,GACtD;AAEA,EAAO,OAAA;AAAA,IACL,SAAW,EAAA,aAAA;AAAA,IACX,UAAY,EAAA;AAAA,GACd;AACF;;;;"}