@vuu-ui/vuu-table 2.1.17 → 2.1.19-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (288) hide show
  1. package/package.json +12 -14
  2. package/types/VirtualColSpan.d.ts +2 -2
  3. package/types/cell-renderers/toggle-cell/ToggleCell.d.ts +1 -1
  4. package/types/useTable.d.ts +3 -3
  5. package/cjs/CellFocusState.js +0 -45
  6. package/cjs/CellFocusState.js.map +0 -1
  7. package/cjs/Row.js +0 -116
  8. package/cjs/Row.js.map +0 -1
  9. package/cjs/Table.css.js +0 -6
  10. package/cjs/Table.css.js.map +0 -1
  11. package/cjs/Table.js +0 -455
  12. package/cjs/Table.js.map +0 -1
  13. package/cjs/VirtualColSpan.js +0 -19
  14. package/cjs/VirtualColSpan.js.map +0 -1
  15. package/cjs/applyHighlighting.js +0 -33
  16. package/cjs/applyHighlighting.js.map +0 -1
  17. package/cjs/bulk-edit/BulkEditPanel.css.js +0 -6
  18. package/cjs/bulk-edit/BulkEditPanel.css.js.map +0 -1
  19. package/cjs/bulk-edit/BulkEditPanel.js +0 -107
  20. package/cjs/bulk-edit/BulkEditPanel.js.map +0 -1
  21. package/cjs/bulk-edit/ColumnCascadingUpdateEditor.css.js +0 -6
  22. package/cjs/bulk-edit/ColumnCascadingUpdateEditor.css.js.map +0 -1
  23. package/cjs/bulk-edit/ColumnCascadingUpdateEditor.js +0 -80
  24. package/cjs/bulk-edit/ColumnCascadingUpdateEditor.js.map +0 -1
  25. package/cjs/bulk-edit/InsertNewRowEditor.css.js +0 -6
  26. package/cjs/bulk-edit/InsertNewRowEditor.css.js.map +0 -1
  27. package/cjs/bulk-edit/InsertNewRowEditor.js +0 -80
  28. package/cjs/bulk-edit/InsertNewRowEditor.js.map +0 -1
  29. package/cjs/bulk-edit/useBulkEditPanel.js +0 -70
  30. package/cjs/bulk-edit/useBulkEditPanel.js.map +0 -1
  31. package/cjs/bulk-edit/useColumnCascadingEditor.js +0 -143
  32. package/cjs/bulk-edit/useColumnCascadingEditor.js.map +0 -1
  33. package/cjs/cell-block/CellBlock.css.js +0 -6
  34. package/cjs/cell-block/CellBlock.css.js.map +0 -1
  35. package/cjs/cell-block/CellBlock.js +0 -45
  36. package/cjs/cell-block/CellBlock.js.map +0 -1
  37. package/cjs/cell-block/cellblock-utils.js +0 -125
  38. package/cjs/cell-block/cellblock-utils.js.map +0 -1
  39. package/cjs/cell-block/useCellBlockSelection.js +0 -257
  40. package/cjs/cell-block/useCellBlockSelection.js.map +0 -1
  41. package/cjs/cell-renderers/checkbox-cell/CheckboxCell.css.js +0 -6
  42. package/cjs/cell-renderers/checkbox-cell/CheckboxCell.css.js.map +0 -1
  43. package/cjs/cell-renderers/checkbox-cell/CheckboxCell.js +0 -67
  44. package/cjs/cell-renderers/checkbox-cell/CheckboxCell.js.map +0 -1
  45. package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js +0 -6
  46. package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js.map +0 -1
  47. package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js +0 -51
  48. package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js.map +0 -1
  49. package/cjs/cell-renderers/input-cell/InputCell.css.js +0 -6
  50. package/cjs/cell-renderers/input-cell/InputCell.css.js.map +0 -1
  51. package/cjs/cell-renderers/input-cell/InputCell.js +0 -63
  52. package/cjs/cell-renderers/input-cell/InputCell.js.map +0 -1
  53. package/cjs/cell-renderers/input-cell/useInputCell.js +0 -211
  54. package/cjs/cell-renderers/input-cell/useInputCell.js.map +0 -1
  55. package/cjs/cell-renderers/toggle-cell/ToggleCell.css.js +0 -6
  56. package/cjs/cell-renderers/toggle-cell/ToggleCell.css.js.map +0 -1
  57. package/cjs/cell-renderers/toggle-cell/ToggleCell.js +0 -66
  58. package/cjs/cell-renderers/toggle-cell/ToggleCell.js.map +0 -1
  59. package/cjs/column-header-pill/ColumnHeaderPill.css.js +0 -6
  60. package/cjs/column-header-pill/ColumnHeaderPill.css.js.map +0 -1
  61. package/cjs/column-header-pill/ColumnHeaderPill.js +0 -53
  62. package/cjs/column-header-pill/ColumnHeaderPill.js.map +0 -1
  63. package/cjs/column-header-pill/GroupColumnPill.css.js +0 -6
  64. package/cjs/column-header-pill/GroupColumnPill.css.js.map +0 -1
  65. package/cjs/column-header-pill/GroupColumnPill.js +0 -29
  66. package/cjs/column-header-pill/GroupColumnPill.js.map +0 -1
  67. package/cjs/column-header-pill/SortIndicator.css.js +0 -6
  68. package/cjs/column-header-pill/SortIndicator.css.js.map +0 -1
  69. package/cjs/column-header-pill/SortIndicator.js +0 -27
  70. package/cjs/column-header-pill/SortIndicator.js.map +0 -1
  71. package/cjs/column-resizing/ColumnResizer.css.js +0 -6
  72. package/cjs/column-resizing/ColumnResizer.css.js.map +0 -1
  73. package/cjs/column-resizing/ColumnResizer.js +0 -82
  74. package/cjs/column-resizing/ColumnResizer.js.map +0 -1
  75. package/cjs/column-resizing/useTableColumnResize.js +0 -55
  76. package/cjs/column-resizing/useTableColumnResize.js.map +0 -1
  77. package/cjs/data-row/DataRow.js +0 -262
  78. package/cjs/data-row/DataRow.js.map +0 -1
  79. package/cjs/header-cell/GroupHeaderCell.css.js +0 -6
  80. package/cjs/header-cell/GroupHeaderCell.css.js.map +0 -1
  81. package/cjs/header-cell/GroupHeaderCell.js +0 -127
  82. package/cjs/header-cell/GroupHeaderCell.js.map +0 -1
  83. package/cjs/header-cell/HeaderCell.css.js +0 -6
  84. package/cjs/header-cell/HeaderCell.css.js.map +0 -1
  85. package/cjs/header-cell/HeaderCell.js +0 -139
  86. package/cjs/header-cell/HeaderCell.js.map +0 -1
  87. package/cjs/index.js +0 -64
  88. package/cjs/index.js.map +0 -1
  89. package/cjs/pagination/PaginationControl.css.js +0 -6
  90. package/cjs/pagination/PaginationControl.css.js.map +0 -1
  91. package/cjs/pagination/PaginationControl.js +0 -38
  92. package/cjs/pagination/PaginationControl.js.map +0 -1
  93. package/cjs/pagination/usePagination.js +0 -36
  94. package/cjs/pagination/usePagination.js.map +0 -1
  95. package/cjs/table-cell/TableCell.css.js +0 -6
  96. package/cjs/table-cell/TableCell.css.js.map +0 -1
  97. package/cjs/table-cell/TableCell.js +0 -75
  98. package/cjs/table-cell/TableCell.js.map +0 -1
  99. package/cjs/table-cell/TableGroupCell.css.js +0 -6
  100. package/cjs/table-cell/TableGroupCell.css.js.map +0 -1
  101. package/cjs/table-cell/TableGroupCell.js +0 -65
  102. package/cjs/table-cell/TableGroupCell.js.map +0 -1
  103. package/cjs/table-config/useTableConfig.js +0 -67
  104. package/cjs/table-config/useTableConfig.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-data-source/DataRowMovingWindow.js +0 -99
  108. package/cjs/table-data-source/DataRowMovingWindow.js.map +0 -1
  109. package/cjs/table-data-source/useDataSource.js +0 -236
  110. package/cjs/table-data-source/useDataSource.js.map +0 -1
  111. package/cjs/table-dom-utils.js +0 -206
  112. package/cjs/table-dom-utils.js.map +0 -1
  113. package/cjs/table-header/HeaderProvider.js +0 -18
  114. package/cjs/table-header/HeaderProvider.js.map +0 -1
  115. package/cjs/table-header/TableHeader.js +0 -180
  116. package/cjs/table-header/TableHeader.js.map +0 -1
  117. package/cjs/table-header/useTableHeader.js +0 -87
  118. package/cjs/table-header/useTableHeader.js.map +0 -1
  119. package/cjs/useCell.js +0 -26
  120. package/cjs/useCell.js.map +0 -1
  121. package/cjs/useCellEditing.js +0 -77
  122. package/cjs/useCellEditing.js.map +0 -1
  123. package/cjs/useCellFocus.js +0 -119
  124. package/cjs/useCellFocus.js.map +0 -1
  125. package/cjs/useControlledTableNavigation.js +0 -46
  126. package/cjs/useControlledTableNavigation.js.map +0 -1
  127. package/cjs/useEditableCell.js +0 -27
  128. package/cjs/useEditableCell.js.map +0 -1
  129. package/cjs/useKeyboardNavigation.js +0 -323
  130. package/cjs/useKeyboardNavigation.js.map +0 -1
  131. package/cjs/useMeasuredHeight.js +0 -51
  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 -130
  136. package/cjs/useSelection.js.map +0 -1
  137. package/cjs/useTable.js +0 -742
  138. package/cjs/useTable.js.map +0 -1
  139. package/cjs/useTableContextMenu.js +0 -76
  140. package/cjs/useTableContextMenu.js.map +0 -1
  141. package/cjs/useTableModel.js +0 -421
  142. package/cjs/useTableModel.js.map +0 -1
  143. package/cjs/useTableScroll.js +0 -464
  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.js +0 -114
  150. package/esm/Row.js.map +0 -1
  151. package/esm/Table.css.js +0 -4
  152. package/esm/Table.css.js.map +0 -1
  153. package/esm/Table.js +0 -453
  154. package/esm/Table.js.map +0 -1
  155. package/esm/VirtualColSpan.js +0 -17
  156. package/esm/VirtualColSpan.js.map +0 -1
  157. package/esm/applyHighlighting.js +0 -31
  158. package/esm/applyHighlighting.js.map +0 -1
  159. package/esm/bulk-edit/BulkEditPanel.css.js +0 -4
  160. package/esm/bulk-edit/BulkEditPanel.css.js.map +0 -1
  161. package/esm/bulk-edit/BulkEditPanel.js +0 -105
  162. package/esm/bulk-edit/BulkEditPanel.js.map +0 -1
  163. package/esm/bulk-edit/ColumnCascadingUpdateEditor.css.js +0 -4
  164. package/esm/bulk-edit/ColumnCascadingUpdateEditor.css.js.map +0 -1
  165. package/esm/bulk-edit/ColumnCascadingUpdateEditor.js +0 -78
  166. package/esm/bulk-edit/ColumnCascadingUpdateEditor.js.map +0 -1
  167. package/esm/bulk-edit/InsertNewRowEditor.css.js +0 -4
  168. package/esm/bulk-edit/InsertNewRowEditor.css.js.map +0 -1
  169. package/esm/bulk-edit/InsertNewRowEditor.js +0 -78
  170. package/esm/bulk-edit/InsertNewRowEditor.js.map +0 -1
  171. package/esm/bulk-edit/useBulkEditPanel.js +0 -68
  172. package/esm/bulk-edit/useBulkEditPanel.js.map +0 -1
  173. package/esm/bulk-edit/useColumnCascadingEditor.js +0 -141
  174. package/esm/bulk-edit/useColumnCascadingEditor.js.map +0 -1
  175. package/esm/cell-block/CellBlock.css.js +0 -4
  176. package/esm/cell-block/CellBlock.css.js.map +0 -1
  177. package/esm/cell-block/CellBlock.js +0 -43
  178. package/esm/cell-block/CellBlock.js.map +0 -1
  179. package/esm/cell-block/cellblock-utils.js +0 -116
  180. package/esm/cell-block/cellblock-utils.js.map +0 -1
  181. package/esm/cell-block/useCellBlockSelection.js +0 -255
  182. package/esm/cell-block/useCellBlockSelection.js.map +0 -1
  183. package/esm/cell-renderers/checkbox-cell/CheckboxCell.css.js +0 -4
  184. package/esm/cell-renderers/checkbox-cell/CheckboxCell.css.js.map +0 -1
  185. package/esm/cell-renderers/checkbox-cell/CheckboxCell.js +0 -65
  186. package/esm/cell-renderers/checkbox-cell/CheckboxCell.js.map +0 -1
  187. package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js +0 -4
  188. package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js.map +0 -1
  189. package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js +0 -49
  190. package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js.map +0 -1
  191. package/esm/cell-renderers/input-cell/InputCell.css.js +0 -4
  192. package/esm/cell-renderers/input-cell/InputCell.css.js.map +0 -1
  193. package/esm/cell-renderers/input-cell/InputCell.js +0 -61
  194. package/esm/cell-renderers/input-cell/InputCell.js.map +0 -1
  195. package/esm/cell-renderers/input-cell/useInputCell.js +0 -209
  196. package/esm/cell-renderers/input-cell/useInputCell.js.map +0 -1
  197. package/esm/cell-renderers/toggle-cell/ToggleCell.css.js +0 -4
  198. package/esm/cell-renderers/toggle-cell/ToggleCell.css.js.map +0 -1
  199. package/esm/cell-renderers/toggle-cell/ToggleCell.js +0 -64
  200. package/esm/cell-renderers/toggle-cell/ToggleCell.js.map +0 -1
  201. package/esm/column-header-pill/ColumnHeaderPill.css.js +0 -4
  202. package/esm/column-header-pill/ColumnHeaderPill.css.js.map +0 -1
  203. package/esm/column-header-pill/ColumnHeaderPill.js +0 -51
  204. package/esm/column-header-pill/ColumnHeaderPill.js.map +0 -1
  205. package/esm/column-header-pill/GroupColumnPill.css.js +0 -4
  206. package/esm/column-header-pill/GroupColumnPill.css.js.map +0 -1
  207. package/esm/column-header-pill/GroupColumnPill.js +0 -27
  208. package/esm/column-header-pill/GroupColumnPill.js.map +0 -1
  209. package/esm/column-header-pill/SortIndicator.css.js +0 -4
  210. package/esm/column-header-pill/SortIndicator.css.js.map +0 -1
  211. package/esm/column-header-pill/SortIndicator.js +0 -25
  212. package/esm/column-header-pill/SortIndicator.js.map +0 -1
  213. package/esm/column-resizing/ColumnResizer.css.js +0 -4
  214. package/esm/column-resizing/ColumnResizer.css.js.map +0 -1
  215. package/esm/column-resizing/ColumnResizer.js +0 -80
  216. package/esm/column-resizing/ColumnResizer.js.map +0 -1
  217. package/esm/column-resizing/useTableColumnResize.js +0 -53
  218. package/esm/column-resizing/useTableColumnResize.js.map +0 -1
  219. package/esm/data-row/DataRow.js +0 -260
  220. package/esm/data-row/DataRow.js.map +0 -1
  221. package/esm/header-cell/GroupHeaderCell.css.js +0 -4
  222. package/esm/header-cell/GroupHeaderCell.css.js.map +0 -1
  223. package/esm/header-cell/GroupHeaderCell.js +0 -125
  224. package/esm/header-cell/GroupHeaderCell.js.map +0 -1
  225. package/esm/header-cell/HeaderCell.css.js +0 -4
  226. package/esm/header-cell/HeaderCell.css.js.map +0 -1
  227. package/esm/header-cell/HeaderCell.js +0 -137
  228. package/esm/header-cell/HeaderCell.js.map +0 -1
  229. package/esm/index.js +0 -27
  230. package/esm/index.js.map +0 -1
  231. package/esm/pagination/PaginationControl.css.js +0 -4
  232. package/esm/pagination/PaginationControl.css.js.map +0 -1
  233. package/esm/pagination/PaginationControl.js +0 -36
  234. package/esm/pagination/PaginationControl.js.map +0 -1
  235. package/esm/pagination/usePagination.js +0 -34
  236. package/esm/pagination/usePagination.js.map +0 -1
  237. package/esm/table-cell/TableCell.css.js +0 -4
  238. package/esm/table-cell/TableCell.css.js.map +0 -1
  239. package/esm/table-cell/TableCell.js +0 -73
  240. package/esm/table-cell/TableCell.js.map +0 -1
  241. package/esm/table-cell/TableGroupCell.css.js +0 -4
  242. package/esm/table-cell/TableGroupCell.css.js.map +0 -1
  243. package/esm/table-cell/TableGroupCell.js +0 -63
  244. package/esm/table-cell/TableGroupCell.js.map +0 -1
  245. package/esm/table-config/useTableConfig.js +0 -65
  246. package/esm/table-config/useTableConfig.js.map +0 -1
  247. package/esm/table-config.js +0 -33
  248. package/esm/table-config.js.map +0 -1
  249. package/esm/table-data-source/DataRowMovingWindow.js +0 -97
  250. package/esm/table-data-source/DataRowMovingWindow.js.map +0 -1
  251. package/esm/table-data-source/useDataSource.js +0 -234
  252. package/esm/table-data-source/useDataSource.js.map +0 -1
  253. package/esm/table-dom-utils.js +0 -188
  254. package/esm/table-dom-utils.js.map +0 -1
  255. package/esm/table-header/HeaderProvider.js +0 -15
  256. package/esm/table-header/HeaderProvider.js.map +0 -1
  257. package/esm/table-header/TableHeader.js +0 -178
  258. package/esm/table-header/TableHeader.js.map +0 -1
  259. package/esm/table-header/useTableHeader.js +0 -85
  260. package/esm/table-header/useTableHeader.js.map +0 -1
  261. package/esm/useCell.js +0 -24
  262. package/esm/useCell.js.map +0 -1
  263. package/esm/useCellEditing.js +0 -75
  264. package/esm/useCellEditing.js.map +0 -1
  265. package/esm/useCellFocus.js +0 -117
  266. package/esm/useCellFocus.js.map +0 -1
  267. package/esm/useControlledTableNavigation.js +0 -43
  268. package/esm/useControlledTableNavigation.js.map +0 -1
  269. package/esm/useEditableCell.js +0 -25
  270. package/esm/useEditableCell.js.map +0 -1
  271. package/esm/useKeyboardNavigation.js +0 -319
  272. package/esm/useKeyboardNavigation.js.map +0 -1
  273. package/esm/useMeasuredHeight.js +0 -49
  274. package/esm/useMeasuredHeight.js.map +0 -1
  275. package/esm/useRowClassNameGenerators.js +0 -32
  276. package/esm/useRowClassNameGenerators.js.map +0 -1
  277. package/esm/useSelection.js +0 -128
  278. package/esm/useSelection.js.map +0 -1
  279. package/esm/useTable.js +0 -740
  280. package/esm/useTable.js.map +0 -1
  281. package/esm/useTableContextMenu.js +0 -73
  282. package/esm/useTableContextMenu.js.map +0 -1
  283. package/esm/useTableModel.js +0 -419
  284. package/esm/useTableModel.js.map +0 -1
  285. package/esm/useTableScroll.js +0 -461
  286. package/esm/useTableScroll.js.map +0 -1
  287. package/esm/useTableViewport.js +0 -135
  288. package/esm/useTableViewport.js.map +0 -1
@@ -1,137 +0,0 @@
1
- 'use strict';
2
-
3
- var vuuUtils = require('@vuu-ui/vuu-utils');
4
- var react = require('react');
5
-
6
- const MAX_PIXEL_HEIGHT = 1e7;
7
- const UNMEASURED_VIEWPORT = {
8
- appliedPageSize: 0,
9
- contentHeight: 0,
10
- contentWidth: 0,
11
- getRowAtPosition: () => -1,
12
- getRowOffset: () => -1,
13
- horizontalScrollbarHeight: 0,
14
- isVirtualScroll: false,
15
- pinnedWidthLeft: 0,
16
- pinnedWidthRight: 0,
17
- rowCount: 0,
18
- setInSituRowOffset: () => void 0,
19
- setScrollTop: () => void 0,
20
- totalHeaderHeight: 0,
21
- usesMeasuredHeaderHeight: false,
22
- verticalScrollbarWidth: 0,
23
- viewportBodyHeight: 0,
24
- viewportWidth: 0
25
- };
26
- const getViewportHeightProps = (rowCount, rowHeight, size, showPaginationControls = false) => {
27
- if (showPaginationControls) {
28
- return {
29
- pixelContentHeight: size.height,
30
- virtualContentHeight: size.height,
31
- virtualisedExtent: 0
32
- };
33
- } else {
34
- const virtualContentHeight = rowCount * rowHeight;
35
- const pixelContentHeight = Math.min(virtualContentHeight, MAX_PIXEL_HEIGHT);
36
- const virtualisedExtent = virtualContentHeight - pixelContentHeight;
37
- return {
38
- pixelContentHeight,
39
- virtualContentHeight,
40
- virtualisedExtent
41
- };
42
- }
43
- };
44
- const useTableViewport = ({
45
- columns,
46
- headerHeight,
47
- rowCount,
48
- rowHeight,
49
- selectionEndSize = 4,
50
- showPaginationControls,
51
- size
52
- }) => {
53
- const inSituRowOffsetRef = react.useRef(0);
54
- const pctScrollTopRef = react.useRef(0);
55
- const { virtualContentHeight, pixelContentHeight, virtualisedExtent } = getViewportHeightProps(rowCount, rowHeight, size, showPaginationControls);
56
- const { pinnedWidthLeft, pinnedWidthRight, unpinnedWidth } = react.useMemo(
57
- () => vuuUtils.measurePinnedColumns(columns, selectionEndSize),
58
- [columns, selectionEndSize]
59
- );
60
- const [getRowOffset, getRowAtPosition, isVirtualScroll] = react.useMemo(() => {
61
- if (virtualisedExtent) {
62
- const [_getRowOffset, getRowAtPosition2, _isVirtual] = vuuUtils.virtualRowPositioning(rowHeight, virtualisedExtent, pctScrollTopRef);
63
- const getOffset = (dataRow) => {
64
- return _getRowOffset(dataRow, inSituRowOffsetRef.current);
65
- };
66
- return [getOffset, getRowAtPosition2, _isVirtual];
67
- } else {
68
- return vuuUtils.actualRowPositioning(rowHeight);
69
- }
70
- }, [virtualisedExtent, rowHeight]);
71
- const setScrollTop = react.useCallback((_, scrollPct) => {
72
- pctScrollTopRef.current = scrollPct;
73
- }, []);
74
- const setInSituRowOffset = react.useCallback((rowIndexOffset) => {
75
- if (rowIndexOffset === 0) {
76
- inSituRowOffsetRef.current = 0;
77
- } else {
78
- inSituRowOffsetRef.current = Math.max(
79
- 0,
80
- inSituRowOffsetRef.current + rowIndexOffset
81
- );
82
- }
83
- }, []);
84
- return react.useMemo(() => {
85
- if (size) {
86
- const scrollbarSize = 10;
87
- const contentWidth = pinnedWidthLeft + unpinnedWidth + pinnedWidthRight;
88
- const horizontalScrollbarHeight = contentWidth > size.width ? scrollbarSize : 0;
89
- const measuredHeaderHeight = headerHeight === -1 ? 0 : headerHeight;
90
- const visibleRows = showPaginationControls ? Math.floor((pixelContentHeight - headerHeight) / rowHeight) : (size.height - headerHeight) / rowHeight;
91
- const count = Number.isInteger(visibleRows) ? visibleRows : Math.ceil(visibleRows);
92
- const viewportBodyHeight = size.height - measuredHeaderHeight;
93
- const verticalScrollbarWidth = showPaginationControls ? 0 : pixelContentHeight > viewportBodyHeight ? scrollbarSize : 0;
94
- const appliedPageSize = count * rowHeight * (pixelContentHeight / virtualContentHeight);
95
- const viewportWidth = size.width;
96
- return {
97
- usesMeasuredHeaderHeight: headerHeight !== -1,
98
- appliedPageSize,
99
- contentHeight: pixelContentHeight,
100
- contentWidth,
101
- getRowAtPosition,
102
- getRowOffset,
103
- isVirtualScroll,
104
- horizontalScrollbarHeight,
105
- pinnedWidthLeft,
106
- pinnedWidthRight,
107
- rowCount: count,
108
- setInSituRowOffset,
109
- setScrollTop,
110
- totalHeaderHeight: headerHeight,
111
- verticalScrollbarWidth,
112
- viewportBodyHeight,
113
- viewportWidth
114
- };
115
- } else {
116
- return UNMEASURED_VIEWPORT;
117
- }
118
- }, [
119
- size,
120
- pinnedWidthLeft,
121
- unpinnedWidth,
122
- pinnedWidthRight,
123
- headerHeight,
124
- rowHeight,
125
- showPaginationControls,
126
- pixelContentHeight,
127
- virtualContentHeight,
128
- getRowAtPosition,
129
- getRowOffset,
130
- isVirtualScroll,
131
- setInSituRowOffset,
132
- setScrollTop
133
- ]);
134
- };
135
-
136
- exports.useTableViewport = useTableViewport;
137
- //# sourceMappingURL=useTableViewport.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useTableViewport.js","sources":["../../../packages/vuu-table/src/useTableViewport.ts"],"sourcesContent":["/**\n * This hook measures and calculates the values needed to manage layout\n * and virtualisation of the table. This includes measurements required\n * to support pinned columns.\n */\nimport { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { MeasuredSize } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n actualRowPositioning,\n measurePinnedColumns,\n RowAtPositionFunc,\n RowOffsetFunc,\n RowPositioning,\n virtualRowPositioning,\n} from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useMemo, useRef } from \"react\";\n\nexport interface TableViewportHookProps {\n columns: RuntimeColumnDescriptor[];\n headerHeight: number;\n rowCount: number;\n rowHeight: number;\n /**\n * this is the solid left/right `border` rendered on the selection block\n */\n selectionEndSize?: number;\n showPaginationControls?: boolean;\n size: MeasuredSize;\n}\n\nexport interface ViewportMeasurements {\n appliedPageSize: number;\n contentHeight: number;\n horizontalScrollbarHeight: number;\n isVirtualScroll: boolean;\n pinnedWidthLeft: number;\n pinnedWidthRight: number;\n rowCount: number;\n contentWidth: number;\n totalHeaderHeight: number;\n usesMeasuredHeaderHeight: boolean;\n verticalScrollbarWidth: number;\n viewportBodyHeight: number;\n viewportWidth: number;\n}\n\nexport interface TableViewportHookResult extends ViewportMeasurements {\n getRowAtPosition: RowAtPositionFunc;\n getRowOffset: RowOffsetFunc;\n setInSituRowOffset: (rowIndexOffset: number) => void;\n setScrollTop: (scrollTop: number, scrollPct: number) => void;\n}\n\n// Too simplistic, it depends on rowHeight\nconst MAX_PIXEL_HEIGHT = 10_000_000;\n\nconst UNMEASURED_VIEWPORT: TableViewportHookResult = {\n appliedPageSize: 0,\n contentHeight: 0,\n contentWidth: 0,\n getRowAtPosition: () => -1,\n getRowOffset: () => -1,\n horizontalScrollbarHeight: 0,\n isVirtualScroll: false,\n pinnedWidthLeft: 0,\n pinnedWidthRight: 0,\n rowCount: 0,\n setInSituRowOffset: () => undefined,\n setScrollTop: () => undefined,\n totalHeaderHeight: 0,\n usesMeasuredHeaderHeight: false,\n verticalScrollbarWidth: 0,\n viewportBodyHeight: 0,\n viewportWidth: 0,\n};\n\nconst getViewportHeightProps = (\n rowCount: number,\n rowHeight: number,\n size: MeasuredSize,\n showPaginationControls = false,\n) => {\n if (showPaginationControls) {\n return {\n pixelContentHeight: size.height,\n virtualContentHeight: size.height,\n virtualisedExtent: 0,\n };\n } else {\n const virtualContentHeight = rowCount * rowHeight;\n const pixelContentHeight = Math.min(virtualContentHeight, MAX_PIXEL_HEIGHT);\n const virtualisedExtent = virtualContentHeight - pixelContentHeight;\n return {\n pixelContentHeight,\n virtualContentHeight,\n virtualisedExtent,\n };\n }\n};\n\nexport const useTableViewport = ({\n columns,\n headerHeight,\n rowCount,\n rowHeight,\n selectionEndSize = 4,\n showPaginationControls,\n size,\n}: TableViewportHookProps): TableViewportHookResult => {\n const inSituRowOffsetRef = useRef(0);\n const pctScrollTopRef = useRef(0);\n\n const { virtualContentHeight, pixelContentHeight, virtualisedExtent } =\n getViewportHeightProps(rowCount, rowHeight, size, showPaginationControls);\n\n const { pinnedWidthLeft, pinnedWidthRight, unpinnedWidth } = useMemo(\n () => measurePinnedColumns(columns, selectionEndSize),\n [columns, selectionEndSize],\n );\n\n const [getRowOffset, getRowAtPosition, isVirtualScroll] =\n useMemo<RowPositioning>(() => {\n if (virtualisedExtent) {\n const [_getRowOffset, getRowAtPosition, _isVirtual] =\n virtualRowPositioning(rowHeight, virtualisedExtent, pctScrollTopRef);\n const getOffset: RowOffsetFunc = (dataRow) => {\n return _getRowOffset(dataRow, inSituRowOffsetRef.current);\n };\n return [getOffset, getRowAtPosition, _isVirtual];\n } else {\n return actualRowPositioning(rowHeight);\n }\n }, [virtualisedExtent, rowHeight]);\n\n const setScrollTop = useCallback((_: number, scrollPct: number) => {\n pctScrollTopRef.current = scrollPct;\n }, []);\n\n /**\n * The inSituRowOffset is used to simulate scrolling through a very large dataset\n * without actually moving the scroll position. It is triggered by keyboard\n * navigation. A simulated scroll operation will always be of one or more rows.\n * A value of zero is a request to reset the offset.\n */\n const setInSituRowOffset = useCallback((rowIndexOffset: number) => {\n if (rowIndexOffset === 0) {\n inSituRowOffsetRef.current = 0;\n } else {\n inSituRowOffsetRef.current = Math.max(\n 0,\n inSituRowOffsetRef.current + rowIndexOffset,\n );\n }\n }, []);\n\n return useMemo(() => {\n if (size) {\n // TODO determine this at runtime\n const scrollbarSize = 10;\n const contentWidth = pinnedWidthLeft + unpinnedWidth + pinnedWidthRight;\n const horizontalScrollbarHeight =\n contentWidth > size.width ? scrollbarSize : 0;\n const measuredHeaderHeight = headerHeight === -1 ? 0 : headerHeight;\n const visibleRows = showPaginationControls\n ? Math.floor((pixelContentHeight - headerHeight) / rowHeight)\n : (size.height - headerHeight) / rowHeight;\n const count = Number.isInteger(visibleRows)\n ? visibleRows\n : Math.ceil(visibleRows);\n const viewportBodyHeight = size.height - measuredHeaderHeight;\n const verticalScrollbarWidth = showPaginationControls\n ? 0\n : pixelContentHeight > viewportBodyHeight\n ? scrollbarSize\n : 0;\n\n const appliedPageSize =\n count * rowHeight * (pixelContentHeight / virtualContentHeight);\n\n const viewportWidth = size.width;\n\n return {\n usesMeasuredHeaderHeight: headerHeight !== -1,\n appliedPageSize,\n contentHeight: pixelContentHeight,\n contentWidth,\n getRowAtPosition,\n getRowOffset,\n isVirtualScroll,\n horizontalScrollbarHeight,\n pinnedWidthLeft,\n pinnedWidthRight,\n rowCount: count,\n setInSituRowOffset,\n setScrollTop,\n totalHeaderHeight: headerHeight,\n verticalScrollbarWidth,\n viewportBodyHeight,\n viewportWidth,\n };\n } else {\n return UNMEASURED_VIEWPORT;\n }\n }, [\n size,\n pinnedWidthLeft,\n unpinnedWidth,\n pinnedWidthRight,\n headerHeight,\n rowHeight,\n showPaginationControls,\n pixelContentHeight,\n virtualContentHeight,\n getRowAtPosition,\n getRowOffset,\n isVirtualScroll,\n setInSituRowOffset,\n setScrollTop,\n ]);\n};\n"],"names":["useRef","useMemo","measurePinnedColumns","getRowAtPosition","virtualRowPositioning","actualRowPositioning","useCallback"],"mappings":"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"}
@@ -1,43 +0,0 @@
1
- import { getAriaCellPos } from './table-dom-utils.js';
2
-
3
- var __defProp = Object.defineProperty;
4
- var __typeError = (msg) => {
5
- throw TypeError(msg);
6
- };
7
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8
- var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
9
- var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
10
- var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
11
- var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
12
- var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
13
- var _cellPos, _el;
14
- class CellFocusState {
15
- constructor() {
16
- __privateAdd(this, _cellPos);
17
- __privateAdd(this, _el, null);
18
- __publicField(this, "outsideViewport", false);
19
- __publicField(this, "placeholderEl", null);
20
- __publicField(this, "pos");
21
- }
22
- set cell(cell) {
23
- __privateSet(this, _el, cell);
24
- __privateSet(this, _cellPos, getAriaCellPos(cell));
25
- }
26
- get cellPos() {
27
- return __privateGet(this, _cellPos);
28
- }
29
- set cellPos(cellPos) {
30
- __privateSet(this, _cellPos, cellPos);
31
- }
32
- get el() {
33
- return __privateGet(this, _el);
34
- }
35
- set el(el) {
36
- __privateSet(this, _el, el);
37
- }
38
- }
39
- _cellPos = new WeakMap();
40
- _el = new WeakMap();
41
-
42
- export { CellFocusState };
43
- //# sourceMappingURL=CellFocusState.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CellFocusState.js","sources":["../../../packages/vuu-table/src/CellFocusState.ts"],"sourcesContent":["import { CellPos } from \"@vuu-ui/vuu-table-types\";\nimport { getAriaCellPos } from \"./table-dom-utils\";\n\n/**\n * Used to track the Table cell (if any) with focus.\n */\nexport interface ICellFocusState {\n el: HTMLElement | null;\n outsideViewport: \"above\" | \"below\" | false;\n placeholderEl: HTMLDivElement | null;\n pos: { top: number } | undefined;\n cellPos: CellPos | undefined;\n}\n\nexport class CellFocusState implements ICellFocusState {\n #cellPos: CellPos | undefined = undefined;\n #el: HTMLElement | null = null;\n outsideViewport: \"above\" | \"below\" | false = false;\n placeholderEl: HTMLDivElement | null = null;\n pos: { top: number } | undefined = undefined;\n\n set cell(cell: HTMLDivElement) {\n this.#el = cell;\n this.#cellPos = getAriaCellPos(cell);\n }\n\n get cellPos() {\n return this.#cellPos;\n }\n set cellPos(cellPos) {\n this.#cellPos = cellPos;\n }\n\n get el() {\n return this.#el;\n }\n set el(el) {\n this.#el = el;\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;AAAA,IAAA,QAAA,EAAA,GAAA;AAcO,MAAM,cAA0C,CAAA;AAAA,EAAhD,WAAA,GAAA;AACL,IAAA,YAAA,CAAA,IAAA,EAAA,QAAA,CAAA;AACA,IAA0B,YAAA,CAAA,IAAA,EAAA,GAAA,EAAA,IAAA,CAAA;AAC1B,IAA6C,aAAA,CAAA,IAAA,EAAA,iBAAA,EAAA,KAAA,CAAA;AAC7C,IAAuC,aAAA,CAAA,IAAA,EAAA,eAAA,EAAA,IAAA,CAAA;AACvC,IAAA,aAAA,CAAA,IAAA,EAAA,KAAA,CAAA;AAAA;AAAA,EAEA,IAAI,KAAK,IAAsB,EAAA;AAC7B,IAAA,YAAA,CAAA,IAAA,EAAK,GAAM,EAAA,IAAA,CAAA;AACX,IAAK,YAAA,CAAA,IAAA,EAAA,QAAA,EAAW,eAAe,IAAI,CAAA,CAAA;AAAA;AACrC,EAEA,IAAI,OAAU,GAAA;AACZ,IAAA,OAAO,YAAK,CAAA,IAAA,EAAA,QAAA,CAAA;AAAA;AACd,EACA,IAAI,QAAQ,OAAS,EAAA;AACnB,IAAA,YAAA,CAAA,IAAA,EAAK,QAAW,EAAA,OAAA,CAAA;AAAA;AAClB,EAEA,IAAI,EAAK,GAAA;AACP,IAAA,OAAO,YAAK,CAAA,IAAA,EAAA,GAAA,CAAA;AAAA;AACd,EACA,IAAI,GAAG,EAAI,EAAA;AACT,IAAA,YAAA,CAAA,IAAA,EAAK,GAAM,EAAA,EAAA,CAAA;AAAA;AAEf;AAxBE,QAAA,GAAA,IAAA,OAAA,EAAA;AACA,GAAA,GAAA,IAAA,OAAA,EAAA;;;;"}
package/esm/Row.js DELETED
@@ -1,114 +0,0 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { isGroupColumn, isJsonGroup, queryClosest, isNotHidden, isJsonColumn } from '@vuu-ui/vuu-utils';
3
- import cx from 'clsx';
4
- import { memo, useCallback } from 'react';
5
- import { TableCell } from './table-cell/TableCell.js';
6
- import { TableGroupCell } from './table-cell/TableGroupCell.js';
7
- import { VirtualColSpan } from './VirtualColSpan.js';
8
-
9
- const classBase = "vuuTableRow";
10
- const Row = memo(
11
- ({
12
- className: classNameProp,
13
- classNameGenerator,
14
- columns,
15
- dataRow,
16
- groupToggleTarget = "group-column",
17
- highlighted,
18
- offset,
19
- onCellEdit,
20
- onClick,
21
- onDataEdited,
22
- onToggleGroup,
23
- searchPattern,
24
- showBookends = true,
25
- virtualColSpan = 0,
26
- zebraStripes = false,
27
- ...htmlAttributes
28
- }) => {
29
- const {
30
- childCount,
31
- depth,
32
- index: rowIndex,
33
- isExpanded,
34
- isLeaf,
35
- isSelected
36
- } = dataRow;
37
- const handleRowClick = useCallback(
38
- (evt) => {
39
- const rangeSelect = evt.shiftKey;
40
- const keepExistingSelection = evt.ctrlKey || evt.metaKey;
41
- onClick?.(evt, dataRow, rangeSelect, keepExistingSelection);
42
- },
43
- [dataRow, onClick]
44
- );
45
- const className = cx(
46
- classBase,
47
- classNameProp,
48
- classNameGenerator?.(dataRow),
49
- {
50
- [`${classBase}-even`]: zebraStripes && rowIndex % 2 === 0,
51
- [`${classBase}-highlighted`]: highlighted
52
- }
53
- );
54
- const canExpand = isLeaf === false && childCount > 0;
55
- const ariaExpanded = isExpanded ? true : canExpand ? false : void 0;
56
- const ariaLevel = isLeaf && depth === 1 ? void 0 : depth;
57
- const style = { top: offset };
58
- const handleGroupCellClick = useCallback(
59
- (evt, column) => {
60
- if (isGroupColumn(column) || isJsonGroup(column, dataRow)) {
61
- const toggleIconClicked = queryClosest(evt.target, ".vuuToggleIconButton") !== null;
62
- if (groupToggleTarget === "toggle-icon") {
63
- if (!toggleIconClicked) {
64
- return;
65
- }
66
- }
67
- if (toggleIconClicked) {
68
- evt.stopPropagation();
69
- }
70
- onToggleGroup?.(dataRow, column);
71
- }
72
- },
73
- [dataRow, groupToggleTarget, onToggleGroup]
74
- );
75
- return /* @__PURE__ */ jsxs(
76
- "div",
77
- {
78
- ...htmlAttributes,
79
- "aria-expanded": ariaExpanded,
80
- "aria-selected": isSelected ? "true" : void 0,
81
- "aria-level": ariaLevel,
82
- role: "row",
83
- className,
84
- onClick: handleRowClick,
85
- style,
86
- children: [
87
- showBookends ? /* @__PURE__ */ jsx("div", { className: "vuuSelectionDecorator vuuStickyLeft", children: /* @__PURE__ */ jsx("div", { className: "vuuTableRowBookend" }) }) : null,
88
- /* @__PURE__ */ jsx(VirtualColSpan, { width: virtualColSpan }),
89
- columns.filter(isNotHidden).map((column) => {
90
- const isGroup = isGroupColumn(column);
91
- const isJsonCell = isJsonColumn(column);
92
- const Cell = isGroup && !isJsonCell ? TableGroupCell : TableCell;
93
- return /* @__PURE__ */ jsx(
94
- Cell,
95
- {
96
- column,
97
- dataRow,
98
- onClick: isGroup || isJsonCell ? handleGroupCellClick : void 0,
99
- onDataEdited,
100
- searchPattern
101
- },
102
- column.name
103
- );
104
- }),
105
- showBookends ? /* @__PURE__ */ jsx("div", { className: "vuuSelectionDecorator vuuStickyRight", children: /* @__PURE__ */ jsx("div", { className: "vuuTableRowBookend" }) }) : null
106
- ]
107
- }
108
- );
109
- }
110
- );
111
- Row.displayName = "Row";
112
-
113
- export { Row };
114
- //# sourceMappingURL=Row.js.map
package/esm/Row.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"Row.js","sources":["../../../packages/vuu-table/src/Row.tsx"],"sourcesContent":["import { RowProps, RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport {\n isGroupColumn,\n isJsonColumn,\n isJsonGroup,\n isNotHidden,\n queryClosest,\n} from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { MouseEvent, memo, useCallback } from \"react\";\nimport { TableCell, TableGroupCell } from \"./table-cell\";\n\nimport { VirtualColSpan } from \"./VirtualColSpan\";\n\nconst classBase = \"vuuTableRow\";\n\nexport const Row = memo(\n ({\n className: classNameProp,\n classNameGenerator,\n columns,\n dataRow,\n groupToggleTarget = \"group-column\",\n highlighted,\n offset,\n onCellEdit,\n onClick,\n onDataEdited,\n onToggleGroup,\n searchPattern,\n showBookends = true,\n virtualColSpan = 0,\n zebraStripes = false,\n ...htmlAttributes\n }: RowProps) => {\n const {\n childCount,\n depth,\n index: rowIndex,\n isExpanded,\n isLeaf,\n isSelected,\n } = dataRow;\n\n const handleRowClick = useCallback(\n (evt: MouseEvent<HTMLDivElement>) => {\n const rangeSelect = evt.shiftKey;\n const keepExistingSelection = evt.ctrlKey || evt.metaKey; /* mac only */\n onClick?.(evt, dataRow, rangeSelect, keepExistingSelection);\n },\n [dataRow, onClick],\n );\n\n const className = cx(\n classBase,\n classNameProp,\n classNameGenerator?.(dataRow),\n {\n [`${classBase}-even`]: zebraStripes && rowIndex % 2 === 0,\n [`${classBase}-highlighted`]: highlighted,\n },\n );\n\n const canExpand = isLeaf === false && childCount > 0;\n const ariaExpanded = isExpanded ? true : canExpand ? false : undefined;\n const ariaLevel = isLeaf && depth === 1 ? undefined : depth;\n\n // const style = { transform: `translate3d(0px, ${offset}px, 0px)` };\n const style = { top: offset };\n\n const handleGroupCellClick = useCallback(\n (evt: MouseEvent, column: RuntimeColumnDescriptor) => {\n if (isGroupColumn(column) || isJsonGroup(column, dataRow)) {\n const toggleIconClicked =\n queryClosest(evt.target, \".vuuToggleIconButton\") !== null;\n if (groupToggleTarget === \"toggle-icon\") {\n if (!toggleIconClicked) {\n return;\n }\n }\n if (toggleIconClicked) {\n // prevent evt bubbling, will suppress selection hook.\n // Clicking the toggle icon directly never triggers row selection\n evt.stopPropagation();\n }\n onToggleGroup?.(dataRow, column);\n }\n },\n [dataRow, groupToggleTarget, onToggleGroup],\n );\n\n return (\n <div\n {...htmlAttributes}\n aria-expanded={ariaExpanded}\n aria-selected={isSelected ? \"true\" : undefined}\n aria-level={ariaLevel}\n role=\"row\"\n className={className}\n onClick={handleRowClick}\n style={style}\n >\n {showBookends ? (\n <div className=\"vuuSelectionDecorator vuuStickyLeft\">\n <div className=\"vuuTableRowBookend\" />\n </div>\n ) : null}\n <VirtualColSpan width={virtualColSpan} />\n {columns.filter(isNotHidden).map((column) => {\n const isGroup = isGroupColumn(column);\n const isJsonCell = isJsonColumn(column);\n const Cell = isGroup && !isJsonCell ? TableGroupCell : TableCell;\n\n return (\n <Cell\n column={column}\n dataRow={dataRow}\n key={column.name}\n onClick={isGroup || isJsonCell ? handleGroupCellClick : undefined}\n onDataEdited={onDataEdited}\n searchPattern={searchPattern}\n />\n );\n })}\n {showBookends ? (\n <div className=\"vuuSelectionDecorator vuuStickyRight\">\n <div className=\"vuuTableRowBookend\" />\n </div>\n ) : null}\n </div>\n );\n },\n);\nRow.displayName = \"Row\";\n"],"names":[],"mappings":"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"}
package/esm/Table.css.js DELETED
@@ -1,4 +0,0 @@
1
- var tableCss = ".vuuTable {\n --vuu-table-cell-outlineWidth: 1px;\n --vuu-table-col-header-row-height: var(--salt-size-base, 32px);\n --vuu-table-col-heading-height: 25px;\n --vuu-table-footer-height: 0px;\n --vuu-table-row-background-selected: var(--vuuTableRow-background-selected, var(--salt-selectable-background-selected));\n --vuu-table-row-background-highlighted: var(--vuuTableRow-background-highlighted, var(--salt-selectable-background-hover));\n --vuu-table-row-borderColor-selected: var(--vuuTableRow-borderColor-selected, var(--salt-selectable-borderColor-selected));\n --vuu-table-row-bookend-background-selected: var(--vuuTableRow-bookend-background-selected, var(--salt-selectable-background-selected));\n --vuu-table-row-height: var(--salt-size-base, 32px);\n --vuu-table-row-selection-borderRadius: var(--vuuTable-row-selection-borderRadius, 5px); \n\n --table-background: var(--vuuTable-background, var(--salt-container-primary-background));\n --table-height: var(--measured-px-height);\n --table-width: var(--measured-px-width);\n\n --columnResizer-color: transparent;\n --row-height: var(\n --row-height-prop,\n var(--vuu-table-row-height, var(--salt-size-base))\n );\n --col-header-row-height: var(\n --col-header-row-height-prop,\n var(--vuu-table-col-header-row-height, var(--salt-size-base))\n );\n\n --cell-borderColor: transparent;\n --row-borderColor: var(--row-background);\n --vuu-table-embedded-control-height: calc(var(--row-height) - 3px);\n\n background: var(--table-background);\n font-family: var(\n --vuuTable-fontFamily,\n var(--salt-typography-fontFamily, sans-serif)\n );\n position: relative;\n user-select: none;\n\n &.vuuTable-viewportRowLimit {\n height: fit-content;\n /* With a viewportRowLimit, table is content sized, not container sized. */\n .vuuTable-contentContainer {\n height: calc(var(--measured-px-height) + var(--total-header-height));\n }\n .vuuTable-scrollbarContainer {\n height: calc(\n var(--measured-px-height) + var(--horizontal-scrollbar-height)\n );\n }\n .vuuTable-scrollbarFiller {\n height: var(--horizontal-scrollbar-height);\n }\n }\n\n &.vuuTable-maxViewportRowLimit {\n /* With a maxVviewportRowLimit, table is content sized, not container sized. */\n height: fit-content;\n padding-bottom: var(--horizontal-scrollbar-height);\n\n .vuuTable-contentContainer {\n height: min(\n calc(var(--measured-px-height) + var(--total-header-height)),\n calc(var(--content-height) + var(--total-header-height))\n );\n }\n .vuuTable-scrollbarContainer {\n height: min(\n calc(var(--measured-px-height) + var(--horizontal-scrollbar-height)),\n calc(var(--content-height) + var(--horizontal-scrollbar-height))\n );\n }\n\n .vuuTable-scrollbarFiller {\n height: var(--horizontal-scrollbar-height);\n }\n }\n\n .vuuTable-editing {\n --vuu-table-row-background-highlighted: transparent;\n }\n\n}\n\n.vuuTable-zebra {\n --table-zebraColor: var(--vuuTable-zebraColor, var(--salt-container-secondary-background));\n}\n\n.vuuTable-colLines {\n --cell-borderColor: var(--salt-separable-tertiary-borderColor);\n}\n\n.vuuTable-rowLines {\n --row-borderColor: var(--salt-separable-tertiary-borderColor);\n}\n\n.vuuTable-scrollbarContainer {\n border-bottom: none !important;\n border-top: none !important;\n height: var(--viewport-body-height);\n left: 0px;\n overflow: auto;\n position: absolute;\n top: var(--total-header-height);\n width: var(--table-width);\n}\n\n.vuuTable-scrollbarContainer::-webkit-scrollbar {\n width: 10px;\n}\n\n.vuuTable-scrollbarContainer::-webkit-scrollbar:horizontal {\n height: 10px;\n}\n\n.vuuTable-scrollbarContainer::-webkit-scrollbar-track {\n background-color: transparent;\n}\n.vuuTable-scrollbarContainer::-webkit-scrollbar-thumb {\n background-clip: padding-box;\n border-radius: 10px;\n border: 2px solid rgba(0, 0, 0, 0);\n background-color: var(--vuu-color-gray-30);\n}\n\n.vuuTable-scrollbarContent {\n height: calc(var(--content-height) + var(--horizontal-scrollbar-height));\n position: absolute;\n width: var(--content-width);\n}\n\n.vuuTable-contentContainer {\n --table-content-container-width: calc(var(--table-width) - var(--vertical-scrollbar-width));\n background: var(--table-background);\n height: calc(\n 100% - var(--horizontal-scrollbar-height) - var(--vuu-table-footer-height)\n );\n position: relative;\n overflow: auto;\n overscroll-behavior: none;\n width: var(--table-content-container-width);\n}\n\n.vuuTable-contentContainer::-webkit-scrollbar {\n display: none;\n}\n\n.vuuTable-table {\n border: none;\n border-collapse: separate;\n border-spacing: 0;\n left: 0;\n margin: 0;\n position: absolute;\n top: 0;\n table-layout: fixed;\n width: var(--content-width);\n}\n\n.vuuTable-body {\n height: var(--content-height);\n position: relative;\n}\n\n.vuuTable-focusCellPlaceholder {\n height: var(--row-height);\n position: absolute;\n width: 50px;\n z-index: -1;\n}\n\n.vuuPinLeft,\n.vuuPinRight {\n background-color: inherit;\n position: sticky;\n z-index: 1;\n}\n\n.vuuPinRight {\n .vuuColumnResizer {\n cursor: default;\n pointer-events: none;\n }\n}\n\n.vuuTableHeaderCell.vuuPinLeft,\n.vuuTableHeaderCell.vuuPinRight {\n z-index: 2;\n}\n\n.vuuTableHeader {\n --row-height: var(--vuu-table-col-header-row-height);\n background-color: var(\n --vuuTableHeader-background,\n var(--table-background)\n );\n border-bottom: solid 1px\n var(\n --vuuTableHeader-borderColor,\n var(--salt-separable-tertiary-borderColor)\n );\n color: var(--salt-content-secondary-foreground);\n font-size: var(--VuuTableHeader-fontSize, vasr(--salt-text-label-fontSize));\n position: sticky;\n top: 0;\n white-space: nowrap;\n\n /* ensure header row sits atop everything else when scrolling down */\n z-index: 1;\n\n .vuuDraggable-spacer {\n border-bottom: solid 1px #ccc;\n display: var(--vuuDraggable-display, inline-block);\n height: var(--vuu-table-col-header-row-height);\n }\n\n .vuuStickyLeft {\n z-index: 1;\n }\n .vuuStickyRight {\n z-index: 0;\n }\n}\n\n.vuuTableHeader:hover {\n --columnResizer-height: var(--vuu-table-col-header-row-height);\n --columnResizer-color: var(--salt-separable-tertiary-borderColor);\n}\n\n.vuuTable-heading {\n height: var(--vuu-table-col-heading-height);\n}\n\n.sizer-cell {\n border: none !important;\n height: 0px;\n}\n\n.vuuDraggable-vuuTable {\n --cell-borderColor: transparent;\n --vuu-table-col-header-row-height: var(--vuuTableHeaderCell-height, 25px);\n --vuuTableHeaderCell-background: var(--salt-container-secondary-background);\n}\n.vuuDraggable-vuuTable {\n --row-height: 25px;\n}\n\n.vuuTable-pagination {\n --vuu-table-footer-height: 32px;\n .vuuTableHeader {\n position: relative;\n }\n\n .vuuTable-body {\n height: calc(var(--content-height) - var(--total-header-height));\n position: relative;\n }\n\n .vuuTableRow {\n position: relative;\n top: auto;\n }\n}\n\n.vuuTable-footer {\n align-items: center;\n display: flex;\n height: var(--vuu-table-footer-height);\n justify-content: flex-end;\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n}\n\n.vuuHighlight {\n color: blue;\n}\n\n.DragColumn {\n box-shadow: var(--salt-overlayable-shadow-drag);\n}\n\n@keyframes fadeIn {\n 0% {\n opacity: 0;\n }\n 90% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.vuuTable-emptyDisplay {\n animation: fadeIn .8s;\n align-items: center;\n display: flex;\n inset:0;\n justify-content: center;\n position: absolute\n}\n\n.vuuTable-emptyDisplay ~ .vuuTable-contentContainer {\n visibility: hidden;\n}\n\n.vuuRowProxy {\n position: absolute !important;\n visibility: hidden;\n}\n\n.vuuTableColHeaderRow {\n height: var(--col-header-row-height);\n}\n\n.vuuTableRow {\n \n background: var(--row-background, var(--table-background));\n border-bottom: 1px solid var(--row-borderColor, var(--table-background));\n box-sizing: border-box;\n color: var(--salt-content-primary-foreground);\n contain: layout;\n font-size: var(--VuuTableRow-fontSize, vasr(--salt-text-fontSize));\n height: var(--row-height);\n line-height: var(--row-height);\n position: absolute;\n top: 0;\n white-space: nowrap;\n width: 100%;\n}\n\n.vuuTableRow-even {\n --row-background: var(--table-zebraColor);\n}\n\n.vuuTableRow-highlighted {\n background: var(--vuu-table-row-background-highlighted);\n}\n\n.vuuTableRow[aria-selected=\"true\"] {\n background-color: var(--vuu-table-row-background-selected);\n}\n\n.vuuTableRow[aria-expanded=\"true\"] {\n --toggle-icon-transform: rotate(90deg);\n}\n\n.vuuDraggable .vuuTableRow {\n --cell-borderColor: transparent;\n --vuu-selection-decorator-bg: transparent;\n transform: none !important;\n z-index: 1;\n}\n\n.vuuSelectionDecorator {\n background: var(--table-background);\n display: inline-block;\n height: var(--row-height);\n position: relative;\n width: var(--table-selection-bookend-width,4px);\n z-index: 2;\n}\n\n.vuuTableRow:not([aria-selected=\"true\"]){\n .vuuTableRowBookend {\n display: none;\n }\n}\n\n.vuuSelectionDecorator.vuuStickyLeft {\n left: 0;\n position: sticky;\n}\n\n.vuuSelectionDecorator.vuuStickyRight {\n right: 0;\n position: sticky;\n}\n\n .vuuTableRowBookend {\n position: absolute;\n top: -1px;\n right:0;\n bottom:0;\n left:0;\n }\n\n.vuuTable-rowSelection-bordered {\n\n .vuuSelectionDecorator {\n\n .vuuTableRowBookend {\n background-color: var(--vuu-table-row-bookend-background-selected);\n border-color: var(--vuu-table-row-borderColor-selected);\n border-width: 1px;\n width: var(--table-selection-bookend-width,4px);\n\n &:before {\n content: none !important;\n }\n }\n\n &.vuuStickyLeft {\n .vuuTableRowBookend {\n border-left-style: solid;\n }\n }\n &.vuuStickyRight {\n .vuuTableRowBookend {\n border-right-style: solid;\n }\n }\n }\n\n .vuuTableRow[aria-selected=\"true\"]{\n .vuuSelectionDecorator {\n background-color: var(--table-background);\n border: none;\n }\n\n }\n\n /* non-selected row immediately followed by a selected row */\n .vuuTableRow:not([aria-selected=\"true\"]):has( + .vuuTableRow[aria-selected=\"true\"]) {\n border-bottom-color: transparent;\n }\n\n /* first row in a selection block, including a selection block of one row */\n .vuuTableRow:not([aria-selected=\"true\"]) + .vuuTableRow[aria-selected=\"true\"],\n .vuuTableRow[aria-selected=\"true\"][data-first-row=\"true\"]\n {\n border-radius: 0;\n\n &:after {\n background: var(--vuu-table-row-borderColor-selected);\n content: \"\";\n position: absolute;\n top: 0px;\n left: 4px;\n height: 1px;\n width: calc(var(--content-width) - 8px);\n z-index: 1;\n }\n\n .vuuStickyLeft .vuuTableRowBookend {\n border-top-left-radius: var(--vuu-table-row-selection-borderRadius);\n border-top-style: solid;\n margin-top: 1px;\n }\n\n .vuuStickyRight .vuuTableRowBookend {\n border-top-right-radius: var(--vuu-table-row-selection-borderRadius);\n border-top-style: solid;\n margin-top: 1px;\n }\n\n }\n\n /* Last row in a selection block, including a selection block of one row */\n .vuuTableRow[aria-selected=\"true\"]:has( + .vuuTableRow:not([aria-selected=\"true\"])) {\n border-bottom-color: var(--vuu-table-row-borderColor-selected);\n\n .vuuStickyLeft .vuuTableRowBookend {\n border-bottom-left-radius: var(--vuu-table-row-selection-borderRadius);\n border-bottom-style: solid;\n }\n .vuuStickyRight .vuuTableRowBookend {\n border-bottom-right-radius: var(--vuu-table-row-selection-borderRadius);\n border-bottom-style: solid;\n }\n }\n\n}";
2
-
3
- export { tableCss as default };
4
- //# sourceMappingURL=Table.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Table.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}