@vuu-ui/vuu-table 0.8.55 → 0.8.57

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 (49) hide show
  1. package/cjs/bulk-edit/bulk-edit-panel/BulkEditPanel.css.js +6 -0
  2. package/cjs/bulk-edit/bulk-edit-panel/BulkEditPanel.css.js.map +1 -0
  3. package/cjs/bulk-edit/bulk-edit-panel/BulkEditPanel.js +58 -0
  4. package/cjs/bulk-edit/bulk-edit-panel/BulkEditPanel.js.map +1 -0
  5. package/cjs/bulk-edit/bulk-edit-row/BulkEditRow.css +4 -0
  6. package/cjs/bulk-edit/bulk-edit-row/BulkEditRow.js +20 -0
  7. package/cjs/bulk-edit/bulk-edit-row/BulkEditRow.js.map +1 -0
  8. package/cjs/header-cell/HeaderCell.css.js +1 -1
  9. package/cjs/index.js +4 -0
  10. package/cjs/index.js.map +1 -1
  11. package/cjs/table-dom-utils.js +7 -0
  12. package/cjs/table-dom-utils.js.map +1 -1
  13. package/cjs/useKeyboardNavigation.js +4 -0
  14. package/cjs/useKeyboardNavigation.js.map +1 -1
  15. package/cjs/useTableAndColumnSettings.js +17 -10
  16. package/cjs/useTableAndColumnSettings.js.map +1 -1
  17. package/cjs/useTableScroll.js +0 -1
  18. package/cjs/useTableScroll.js.map +1 -1
  19. package/esm/bulk-edit/bulk-edit-panel/BulkEditPanel.css.js +4 -0
  20. package/esm/bulk-edit/bulk-edit-panel/BulkEditPanel.css.js.map +1 -0
  21. package/esm/bulk-edit/bulk-edit-panel/BulkEditPanel.js +56 -0
  22. package/esm/bulk-edit/bulk-edit-panel/BulkEditPanel.js.map +1 -0
  23. package/esm/bulk-edit/bulk-edit-row/BulkEditRow.css +4 -0
  24. package/esm/bulk-edit/bulk-edit-row/BulkEditRow.js +18 -0
  25. package/esm/bulk-edit/bulk-edit-row/BulkEditRow.js.map +1 -0
  26. package/esm/header-cell/HeaderCell.css.js +1 -1
  27. package/esm/index.js +2 -0
  28. package/esm/index.js.map +1 -1
  29. package/esm/table-dom-utils.js +7 -1
  30. package/esm/table-dom-utils.js.map +1 -1
  31. package/esm/useKeyboardNavigation.js +6 -2
  32. package/esm/useKeyboardNavigation.js.map +1 -1
  33. package/esm/useTableAndColumnSettings.js +18 -11
  34. package/esm/useTableAndColumnSettings.js.map +1 -1
  35. package/esm/useTableScroll.js +0 -1
  36. package/esm/useTableScroll.js.map +1 -1
  37. package/package.json +9 -9
  38. package/types/bulk-edit/bulk-edit-panel/BulkEditPanel.d.ts +13 -0
  39. package/types/bulk-edit/bulk-edit-panel/index.d.ts +1 -0
  40. package/types/bulk-edit/bulk-edit-row/BulkEditRow.d.ts +14 -0
  41. package/types/bulk-edit/bulk-edit-row/index.d.ts +1 -0
  42. package/types/bulk-edit/index.d.ts +2 -0
  43. package/types/index.d.ts +1 -0
  44. package/types/table-dom-utils.d.ts +1 -0
  45. package/types/table-header/useTableHeader.d.ts +3 -3
  46. package/types/useCellEditing.d.ts +2 -2
  47. package/types/useControlledTableNavigation.d.ts +1 -1
  48. package/types/useRowHeight.d.ts +2 -1
  49. package/types/useTable.d.ts +3 -3
@@ -0,0 +1,6 @@
1
+ 'use strict';
2
+
3
+ var bulkEditPanelCss = ".vuuBulkEditPanel{\n display: flex;\n flex-direction: column;\n}\n.vuuBulkEditPanel-table {\n align-items: center;\n flex: 1 1 auto;\n padding: 10px;\n}\n.vuuBulkEditPanel-buttonBar {\n align-items: center;\n display: flex;\n flex: 0 0 36px;\n justify-content: flex-end;\n gap: var(--salt-spacing-100);\n}";
4
+
5
+ module.exports = bulkEditPanelCss;
6
+ //# sourceMappingURL=BulkEditPanel.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"BulkEditPanel.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -0,0 +1,58 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ require('react');
5
+ require('@vuu-ui/vuu-ui-controls');
6
+ require('@vuu-ui/vuu-utils');
7
+ var styles = require('@salt-ds/styles');
8
+ var window = require('@salt-ds/window');
9
+ require('clsx');
10
+ require('@vuu-ui/vuu-popups');
11
+ var Table = require('../../Table.js');
12
+ require('../../cell-renderers/checkbox-cell/CheckboxCell.js');
13
+ require('../../cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js');
14
+ require('../../cell-renderers/input-cell/InputCell.js');
15
+ require('../../cell-renderers/toggle-cell/ToggleCell.js');
16
+ require('../../useTableModel.js');
17
+ require('../../Row.js');
18
+ var core = require('@salt-ds/core');
19
+ var BulkEditPanel$1 = require('./BulkEditPanel.css.js');
20
+
21
+ const classBase = "vuuBulkEditPanel";
22
+ const BulkEditPanel = (props) => {
23
+ const { tableConfig, dataSource, onCancel, onEditMultiple, onSubmit } = props;
24
+ const targetWindow = window.useWindow();
25
+ styles.useComponentCssInjection({
26
+ testId: "vuu-checkbox-cell",
27
+ css: BulkEditPanel$1,
28
+ window: targetWindow
29
+ });
30
+ return /* @__PURE__ */ jsxRuntime.jsxs(
31
+ "div",
32
+ {
33
+ className: classBase,
34
+ style: { display: "flex", flexDirection: "column" },
35
+ children: [
36
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-table`, children: /* @__PURE__ */ jsxRuntime.jsx(
37
+ Table.Table,
38
+ {
39
+ config: tableConfig,
40
+ dataSource,
41
+ height: 400,
42
+ width: 600,
43
+ showColumnHeaderMenus: false,
44
+ selectionModel: "none"
45
+ }
46
+ ) }),
47
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${classBase}-buttonBar`, children: [
48
+ /* @__PURE__ */ jsxRuntime.jsx(core.Button, { onClick: onCancel, children: "Cancel" }),
49
+ /* @__PURE__ */ jsxRuntime.jsx(core.Button, { onClick: onSubmit, children: "Save" }),
50
+ /* @__PURE__ */ jsxRuntime.jsx(core.Button, { onClick: onEditMultiple, children: "Edit Multiple" })
51
+ ] })
52
+ ]
53
+ }
54
+ );
55
+ };
56
+
57
+ exports.BulkEditPanel = BulkEditPanel;
58
+ //# sourceMappingURL=BulkEditPanel.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"BulkEditPanel.js","sources":["../../../src/bulk-edit/bulk-edit-panel/BulkEditPanel.tsx"],"sourcesContent":["import { DataSource } from \"@vuu-ui/vuu-data-types\";\nimport { Table } from \"@vuu-ui/vuu-table\";\nimport { TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport { Button } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport bulkEditPanelCss from \"./BulkEditPanel.css\";\n\nconst classBase = \"vuuBulkEditPanel\";\n\ntype BulkEditPanelProps = {\n className?: string;\n tableConfig: TableConfig;\n dataSource: DataSource;\n onCancel: () => void;\n onEditMultiple: () => void;\n onSubmit: () => void;\n};\n\nexport const BulkEditPanel = (props: BulkEditPanelProps): JSX.Element => {\n const { tableConfig, dataSource, onCancel, onEditMultiple, onSubmit } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-checkbox-cell\",\n css: bulkEditPanelCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={classBase}\n style={{ display: \"flex\", flexDirection: \"column\" }}\n >\n {/* <BulkEditRow columnMap={inputColMap} columns={inputColDescriptor} row={dataSource.data[0]} offset={1}></BulkEditRow> */}\n <div className={`${classBase}-table`}>\n <Table\n config={tableConfig}\n dataSource={dataSource}\n height={400}\n width={600}\n showColumnHeaderMenus={false}\n selectionModel=\"none\"\n />\n </div>\n\n <div className={`${classBase}-buttonBar`}>\n <Button onClick={onCancel}>Cancel</Button>\n <Button onClick={onSubmit}>Save</Button>\n <Button onClick={onEditMultiple}>Edit Multiple</Button>\n </div>\n </div>\n );\n};\n"],"names":["useWindow","useComponentCssInjection","bulkEditPanelCss","jsxs","jsx","Table","Button"],"mappings":";;;;;;;;;;;;;;;;;;;;AASA,MAAM,SAAY,GAAA,kBAAA,CAAA;AAWL,MAAA,aAAA,GAAgB,CAAC,KAA2C,KAAA;AACvE,EAAA,MAAM,EAAE,WAAa,EAAA,UAAA,EAAY,QAAU,EAAA,cAAA,EAAgB,UAAa,GAAA,KAAA,CAAA;AACxE,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,eAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EACE,uBAAAC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,SAAA;AAAA,MACX,KAAO,EAAA,EAAE,OAAS,EAAA,MAAA,EAAQ,eAAe,QAAS,EAAA;AAAA,MAGlD,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,CAC1B,MAAA,CAAA,EAAA,QAAA,kBAAAA,cAAA;AAAA,UAACC,WAAA;AAAA,UAAA;AAAA,YACC,MAAQ,EAAA,WAAA;AAAA,YACR,UAAA;AAAA,YACA,MAAQ,EAAA,GAAA;AAAA,YACR,KAAO,EAAA,GAAA;AAAA,YACP,qBAAuB,EAAA,KAAA;AAAA,YACvB,cAAe,EAAA,MAAA;AAAA,WAAA;AAAA,SAEnB,EAAA,CAAA;AAAA,wBAECF,eAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,SAAS,CAC1B,UAAA,CAAA,EAAA,QAAA,EAAA;AAAA,0BAACC,cAAA,CAAAE,WAAA,EAAA,EAAO,OAAS,EAAA,QAAA,EAAU,QAAM,EAAA,QAAA,EAAA,CAAA;AAAA,0BAChCF,cAAA,CAAAE,WAAA,EAAA,EAAO,OAAS,EAAA,QAAA,EAAU,QAAI,EAAA,MAAA,EAAA,CAAA;AAAA,0BAC9BF,cAAA,CAAAE,WAAA,EAAA,EAAO,OAAS,EAAA,cAAA,EAAgB,QAAa,EAAA,eAAA,EAAA,CAAA;AAAA,SAChD,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ;;;;"}
@@ -0,0 +1,4 @@
1
+ .vuuBulkEditRow{
2
+ display: flex;
3
+ flex-direction: column;
4
+ }
@@ -0,0 +1,20 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var Row = require('../../Row.js');
5
+
6
+ const BulkEditRow = (props) => {
7
+ const { columnMap, columns, row, offset } = props;
8
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "vuuBulkEditRow", children: /* @__PURE__ */ jsxRuntime.jsx(
9
+ Row.Row,
10
+ {
11
+ columnMap,
12
+ columns,
13
+ row,
14
+ offset
15
+ }
16
+ ) });
17
+ };
18
+
19
+ exports.BulkEditRow = BulkEditRow;
20
+ //# sourceMappingURL=BulkEditRow.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"BulkEditRow.js","sources":["../../../src/bulk-edit/bulk-edit-row/BulkEditRow.tsx"],"sourcesContent":["import { DataSourceRow } from \"@vuu-ui/vuu-data-types\";\nimport { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { ColumnMap } from \"@vuu-ui/vuu-utils\";\nimport { Row } from \"../../Row\";\n\nimport \"./BulkEditRow.css\";\n\ntype BulkEditRowProps = {\n className?: string;\n columnMap: ColumnMap;\n columns: RuntimeColumnDescriptor[];\n row: DataSourceRow;\n offset: number;\n};\n\nexport const BulkEditRow = (props: BulkEditRowProps): JSX.Element => {\n const { columnMap, columns, row, offset } = props;\n\n return (\n <div className=\"vuuBulkEditRow\">\n <Row\n columnMap={columnMap}\n columns={columns}\n row={row}\n offset={offset}\n ></Row>\n </div>\n );\n};\n"],"names":["jsx","Row"],"mappings":";;;;;AAea,MAAA,WAAA,GAAc,CAAC,KAAyC,KAAA;AACnE,EAAA,MAAM,EAAE,SAAA,EAAW,OAAS,EAAA,GAAA,EAAK,QAAW,GAAA,KAAA,CAAA;AAE5C,EACE,uBAAAA,cAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,gBACb,EAAA,QAAA,kBAAAA,cAAA;AAAA,IAACC,OAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,OAAA;AAAA,MACA,GAAA;AAAA,MACA,MAAA;AAAA,KAAA;AAAA,GAEJ,EAAA,CAAA,CAAA;AAEJ;;;;"}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var headerCellCss = ".vuuTableGroupHeaderCell,\n.vuuTableHeaderCell {\n --cell-align: 'flex-start';\n --vuuColumnHeaderPill-margin: 0;\n --vuuColumnHeaderPill-flex: 0 0 24px;\n\n align-items: center;\n background-color: var(--vuuTableHeaderCell-background, inherit);\n border-bottom: 1px solid #ccc;\n border-right-color: var(--cell-borderColor);\n border-right-style: solid;\n border-right-width: 1px;\n box-sizing: border-box;\n cursor: default;\n display: inline-flex;\n gap: 4px;\n height: var(--header-height);\n padding: 0 12px 0 4px;\n position: relative;\n vertical-align: top;\n}\n\n.vuuTableHeaderCell:focus {\n outline: var(--vuuTableCell-outline, solid var(--salt-focused-outlineColor) 2px);\n outline-offset: -3px;\n}\n\n.vuuTableHeaderCell-right {\n --columnResizer-left: 0;\n --vuuTable-columnMenu-margin: 0;\n --vuuColumnHeaderPill-margin: 0 3px 0 0;\n --column-menu-left: 2px;\n justify-content: flex-end;\n padding: 0 3px 0 12px;\n}\n\n.vuuTableHeaderCell-noMenu {\n padding-left: var(--salt-spacing-300)\n}\n\n.vuuTableHeaderCell-label {\n flex: 0 1 auto;\n line-height: calc(var(--header-height) - 1px);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.vuuTableHeaderCell-right .vuuTableHeaderCell-label {\n text-align: right;\n}\n\n.vuuTableHeaderCell-resizing {\n --columnResizeThumb-color: var(--vuu-color-purple-10);\n --columnResizer-color: var(--vuu-color-purple-10);\n --columnResizer-height: var(--table-height);\n}\n\n.vuuTableHeaderCell.vuuPinLeft {\n padding-left: 2px;\n}\n\n .vuuTableHeaderCell.vuuPinLeft.vuuEndPin .vuuColumnResizer:before {\n --height: calc(var(--table-height) - var(--horizontal-scrollbar-height));\n --inset-r: calc(var(--pin-width) - 2px);\n --inset-b: calc(var(--height) - 2px);\n --clip-path: polygon(\n 0% 0%, \n 0% 120%, \n 2px 120%, \n 2px 2px, \n var(--inset-r) 2px, \n var(--inset-r) var(--inset-b), \n 2px var(--inset-b), \n 2px 120%, \n 120% 120%, \n 120% 0% \n );\n background-color: transparent;\n border-color: var(--vuuTablePinnedColumn-borderColor, var(--salt-container-primary-borderColor));\n border-width: 1px;\n border-style: solid solid solid solid;\n /* border-radius: 0 6px 6px 0; */\n border-radius: 4px;\n box-shadow: 2px 1px 4px 0px rgba(0, 0, 0, 0.10);\n /* clip-path: inset(10px 10px 10px 10px); */\n clip-path: var(--clip-path);\n content: '';\n position: absolute;\n width: var(--pin-width);\n top:0;\n bottom:0;\n right: 3px;\n height: var(--height);\n z-index: -5;\n}\n\n.vuuTableHeaderCell.vuuPinRight.vuuEndPin .vuuColumnResizer:before {\n --height: calc(var(--table-height) - var(--horizontal-scrollbar-height));\n --inset-r: calc(var(--pin-width) - 2px);\n --inset-b: calc(var(--height) - 2px);\n --clip-path: polygon(\n -20% 0%, \n -20% 120%, \n 2px 120%, \n 2px 2px, \n var(--inset-r) 2px, \n var(--inset-r) var(--inset-b), \n 2px var(--inset-b), \n 2px 120%, \n 120% 120%, \n 120% 0% \n );\n background-color: transparent;\n border-color: #A9AAAD;\n border-width: 1px;\n border-style: solid solid solid solid;\n /* border-radius: 0 6px 6px 0; */\n border-radius: 4px;\n box-shadow: -2px 1px 4px 0px rgba(0, 0, 0, 0.10);\n /* clip-path: inset(10px 10px 10px 10px); */\n clip-path: var(--clip-path);\n content: '';\n position: absolute;\n width: var(--pin-width);\n top:0;\n bottom:0;\n right: 0px;\n height: var(--height);\n z-index: -5;\n}\n\n.vuuTableHeaderCell.vuuDraggable-dragAway {\n display: none;\n}\n\n.vuuTable-headingCell {\n background: var(--dataTable-background);\n border-color: var(--salt-separable-tertiary-borderColor);\n border-style: solid solid solid none;\n border-width: 1px;\n color: var(--salt-text-secondary-foreground);\n display: inline-block;\n height: var(--header-height);\n padding: 0 !important;\n}\n";
3
+ var headerCellCss = ".vuuTableGroupHeaderCell,\n.vuuTableHeaderCell {\n --cell-align: 'flex-start';\n --vuuColumnHeaderPill-margin: 0;\n --vuuColumnHeaderPill-flex: 0 0 24px;\n\n align-items: center;\n background-color: var(--vuuTableHeaderCell-background, inherit);\n border-bottom: 1px solid #ccc;\n border-right-color: var(--cell-borderColor);\n border-right-style: solid;\n border-right-width: 1px;\n box-sizing: border-box;\n cursor: default;\n display: inline-flex;\n gap: 4px;\n height: var(--header-height);\n padding: 0 12px 0 4px;\n position: relative;\n vertical-align: top;\n}\n\n.vuuTableHeaderCell:focus {\n outline: var(--vuuTableCell-outline, solid var(--salt-focused-outlineColor) 2px);\n outline-offset: -3px;\n}\n\n.vuuTableHeaderCell-right {\n --columnResizer-left: 0;\n --vuuTable-columnMenu-margin: 0;\n --vuuColumnHeaderPill-margin: 0 3px 0 0;\n --column-menu-left: 2px;\n justify-content: flex-end;\n padding: 0 3px 0 12px;\n}\n\n.vuuTableHeaderCell-noMenu {\n padding-left: var(--salt-spacing-300)\n}\n\n.vuuTableHeaderCell-label {\n flex: 0 1 auto;\n line-height: calc(var(--header-height) - 1px);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.vuuTableHeaderCell-right .vuuTableHeaderCell-label {\n text-align: right;\n}\n\n.vuuTableHeaderCell-resizing {\n --columnResizeThumb-color: var(--vuu-color-purple-10);\n --columnResizer-color: var(--vuu-color-purple-10);\n --columnResizer-height: var(--table-height);\n}\n\n.vuuTableHeaderCell.vuuPinLeft {\n padding-left: 2px;\n}\n\n .vuuTableHeaderCell.vuuPinLeft.vuuEndPin .vuuColumnResizer:before {\n --height: calc(var(--table-height) - var(--horizontal-scrollbar-height));\n --inset-r: calc(var(--pin-width) - 2px);\n --inset-b: calc(var(--height) - 2px);\n --clip-path: polygon(\n 0% 0%, \n 0% 120%, \n 2px 120%, \n 2px 2px, \n var(--inset-r) 2px, \n var(--inset-r) var(--inset-b), \n 2px var(--inset-b), \n 2px 120%, \n 120% 120%, \n 120% 0% \n );\n background-color: transparent;\n border-color: var(--vuuTablePinnedColumn-borderColor, var(--salt-container-primary-borderColor));\n border-width: 1px;\n border-style: solid solid solid solid;\n /* border-radius: 0 6px 6px 0; */\n border-radius: 4px;\n box-shadow: 2px 1px 4px 0px rgba(0, 0, 0, 0.10);\n /* clip-path: inset(10px 10px 10px 10px); */\n clip-path: var(--clip-path);\n content: '';\n position: absolute;\n width: var(--pin-width);\n top:0;\n bottom:0;\n right: 3px;\n height: var(--height);\n z-index: -5;\n}\n\n.vuuTableHeaderCell.vuuPinRight.vuuEndPin .vuuColumnResizer:before {\n --height: calc(var(--table-height) - var(--horizontal-scrollbar-height));\n --inset-r: calc(var(--pin-width) - 2px);\n --inset-b: calc(var(--height) - 2px);\n --clip-path: polygon(\n -20% 0%, \n -20% 120%, \n 2px 120%, \n 2px 2px, \n var(--inset-r) 2px, \n var(--inset-r) var(--inset-b), \n 2px var(--inset-b), \n 2px 120%, \n 120% 120%, \n 120% 0% \n );\n background-color: transparent;\n border-color: #A9AAAD;\n border-width: 1px;\n border-style: solid solid solid solid;\n /* border-radius: 0 6px 6px 0; */\n border-radius: 4px;\n box-shadow: -2px 1px 4px 0px rgba(0, 0, 0, 0.10);\n /* clip-path: inset(10px 10px 10px 10px); */\n clip-path: var(--clip-path);\n content: '';\n position: absolute;\n width: var(--pin-width);\n top:0;\n bottom:0;\n right: 0px;\n height: var(--height);\n z-index: -5;\n}\n\n.vuuTableHeaderCell.vuuDraggable-dragAway {\n display: none;\n}\n\n.vuuTable-headingCell {\n background: var(--dataTable-background);\n border-color: var(--salt-separable-tertiary-borderColor);\n border-style: solid solid solid none;\n border-width: 1px;\n color: var(--salt-content-secondary-foreground);\n display: inline-block;\n height: var(--header-height);\n padding: 0 !important;\n}\n";
4
4
 
5
5
  module.exports = headerCellCss;
6
6
  //# sourceMappingURL=HeaderCell.css.js.map
package/cjs/index.js CHANGED
@@ -14,6 +14,8 @@ var useControlledTableNavigation = require('./useControlledTableNavigation.js');
14
14
  var useTableModel = require('./useTableModel.js');
15
15
  var useTableScroll = require('./useTableScroll.js');
16
16
  var useTableViewport = require('./useTableViewport.js');
17
+ var BulkEditRow = require('./bulk-edit/bulk-edit-row/BulkEditRow.js');
18
+ var BulkEditPanel = require('./bulk-edit/bulk-edit-panel/BulkEditPanel.js');
17
19
 
18
20
 
19
21
 
@@ -35,4 +37,6 @@ exports.useTableModel = useTableModel.useTableModel;
35
37
  exports.noScrolling = useTableScroll.noScrolling;
36
38
  exports.useTableScroll = useTableScroll.useTableScroll;
37
39
  exports.useTableViewport = useTableViewport.useTableViewport;
40
+ exports.BulkEditRow = BulkEditRow.BulkEditRow;
41
+ exports.BulkEditPanel = BulkEditPanel.BulkEditPanel;
38
42
  //# sourceMappingURL=index.js.map
package/cjs/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -15,6 +15,12 @@ const getTableCell = (containerRef, [rowIdx, colIdx]) => {
15
15
  }
16
16
  };
17
17
  const cellIsEditable = (cell) => cell?.classList.contains("vuuTableCell-editable");
18
+ const cellDropdownShowing = (cell) => {
19
+ if (cellIsEditable(cell)) {
20
+ return cell?.querySelector('.saltDropdown[aria-expanded="true"]') !== null;
21
+ }
22
+ return false;
23
+ };
18
24
  const cellIsTextInput = (cell) => cell.querySelector(".vuuTableInputCell") !== null;
19
25
  function getRowIndex(rowEl) {
20
26
  if (rowEl) {
@@ -49,6 +55,7 @@ const howFarIsRowOutsideViewport = (rowEl, totalHeaderHeight, contentContainer =
49
55
  }
50
56
  };
51
57
 
58
+ exports.cellDropdownShowing = cellDropdownShowing;
52
59
  exports.cellIsEditable = cellIsEditable;
53
60
  exports.cellIsTextInput = cellIsTextInput;
54
61
  exports.closestRowIndex = closestRowIndex;
@@ -1 +1 @@
1
- {"version":3,"file":"table-dom-utils.js","sources":["../src/table-dom-utils.ts"],"sourcesContent":["import { RefObject } from \"react\";\nimport { ScrollDirection } from \"./useTableScroll\";\n\n/**\n * [rowIndex, colIndex\n */\nexport type CellPos = [number, number];\n\nexport const headerCellQuery = (colIdx: number) =>\n `.vuuTable-col-headers .vuuTableHeaderCell:nth-child(${colIdx})`;\n\nexport const dataCellQuery = (rowIdx: number, colIdx: number) =>\n `.vuuTable-body > [aria-rowindex='${rowIdx + 1}'] > [role='cell']:nth-child(${\n colIdx + 1\n })`;\n\nexport const getTableCell = (\n containerRef: RefObject<HTMLElement>,\n\n [rowIdx, colIdx]: CellPos\n) => {\n const cssQuery =\n rowIdx === -1 ? headerCellQuery(colIdx) : dataCellQuery(rowIdx, colIdx);\n const cell = containerRef.current?.querySelector(\n cssQuery\n ) as HTMLTableCellElement;\n\n if (cellIsEditable(cell)) {\n // Dropdown gets focus, Input does not\n const focusableContent = cell.querySelector(\"button\") as HTMLElement;\n return focusableContent || cell;\n } else {\n return cell;\n }\n};\n\nexport const cellIsEditable = (cell: HTMLDivElement | null) =>\n cell?.classList.contains(\"vuuTableCell-editable\");\n\nexport const cellIsTextInput = (cell: HTMLElement) =>\n cell.querySelector(\".vuuTableInputCell\") !== null;\n\nexport function getRowIndex(rowEl?: HTMLElement) {\n if (rowEl) {\n const idx: string | null = rowEl.ariaRowIndex;\n if (idx !== null) {\n return parseInt(idx, 10) - 1;\n }\n }\n return -1;\n}\n\nconst closestRow = (el: HTMLElement) =>\n el.closest('[role=\"row\"]') as HTMLElement;\n\nexport const closestRowIndex = (el: HTMLElement) => getRowIndex(closestRow(el));\n\nconst NO_SCROLL_NECESSARY = [undefined, undefined] as const;\n\nexport const howFarIsRowOutsideViewport = (\n rowEl: HTMLElement,\n totalHeaderHeight: number,\n contentContainer = rowEl.closest(\".vuuTable-contentContainer\")\n): readonly [ScrollDirection | undefined, number | undefined] => {\n //TODO lots of scope for optimisation here\n if (contentContainer) {\n // TODO take totalHeaderHeight into consideration\n const viewport = contentContainer?.getBoundingClientRect();\n const upperBoundary = viewport.top + totalHeaderHeight;\n const row = rowEl.getBoundingClientRect();\n if (row) {\n if (row.bottom > viewport.bottom) {\n return [\"down\", row.bottom - viewport.bottom];\n } else if (row.top < upperBoundary) {\n return [\"up\", row.top - upperBoundary];\n } else {\n return NO_SCROLL_NECESSARY;\n }\n } else {\n throw Error(\"Whats going on, row not found\");\n }\n } else {\n throw Error(\"Whats going on, scrollbar container not found\");\n }\n};\n"],"names":[],"mappings":";;AAQO,MAAM,eAAkB,GAAA,CAAC,MAC9B,KAAA,CAAA,oDAAA,EAAuD,MAAM,CAAA,CAAA,EAAA;AAElD,MAAA,aAAA,GAAgB,CAAC,MAAgB,EAAA,MAAA,KAC5C,oCAAoC,MAAS,GAAA,CAAC,CAC5C,6BAAA,EAAA,MAAA,GAAS,CACX,CAAA,CAAA,EAAA;AAEK,MAAM,eAAe,CAC1B,YAAA,EAEA,CAAC,MAAA,EAAQ,MAAM,CACZ,KAAA;AACH,EAAM,MAAA,QAAA,GACJ,WAAW,CAAK,CAAA,GAAA,eAAA,CAAgB,MAAM,CAAI,GAAA,aAAA,CAAc,QAAQ,MAAM,CAAA,CAAA;AACxE,EAAM,MAAA,IAAA,GAAO,aAAa,OAAS,EAAA,aAAA;AAAA,IACjC,QAAA;AAAA,GACF,CAAA;AAEA,EAAI,IAAA,cAAA,CAAe,IAAI,CAAG,EAAA;AAExB,IAAM,MAAA,gBAAA,GAAmB,IAAK,CAAA,aAAA,CAAc,QAAQ,CAAA,CAAA;AACpD,IAAA,OAAO,gBAAoB,IAAA,IAAA,CAAA;AAAA,GACtB,MAAA;AACL,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AACF,EAAA;AAEO,MAAM,iBAAiB,CAAC,IAAA,KAC7B,IAAM,EAAA,SAAA,CAAU,SAAS,uBAAuB,EAAA;AAE3C,MAAM,kBAAkB,CAAC,IAAA,KAC9B,IAAK,CAAA,aAAA,CAAc,oBAAoB,CAAM,KAAA,KAAA;AAExC,SAAS,YAAY,KAAqB,EAAA;AAC/C,EAAA,IAAI,KAAO,EAAA;AACT,IAAA,MAAM,MAAqB,KAAM,CAAA,YAAA,CAAA;AACjC,IAAA,IAAI,QAAQ,IAAM,EAAA;AAChB,MAAO,OAAA,QAAA,CAAS,GAAK,EAAA,EAAE,CAAI,GAAA,CAAA,CAAA;AAAA,KAC7B;AAAA,GACF;AACA,EAAO,OAAA,CAAA,CAAA,CAAA;AACT,CAAA;AAEA,MAAM,UAAa,GAAA,CAAC,EAClB,KAAA,EAAA,CAAG,QAAQ,cAAc,CAAA,CAAA;AAEpB,MAAM,kBAAkB,CAAC,EAAA,KAAoB,WAAY,CAAA,UAAA,CAAW,EAAE,CAAC,EAAA;AAE9E,MAAM,mBAAA,GAAsB,CAAC,KAAA,CAAA,EAAW,KAAS,CAAA,CAAA,CAAA;AAEpC,MAAA,0BAAA,GAA6B,CACxC,KACA,EAAA,iBAAA,EACA,mBAAmB,KAAM,CAAA,OAAA,CAAQ,4BAA4B,CACE,KAAA;AAE/D,EAAA,IAAI,gBAAkB,EAAA;AAEpB,IAAM,MAAA,QAAA,GAAW,kBAAkB,qBAAsB,EAAA,CAAA;AACzD,IAAM,MAAA,aAAA,GAAgB,SAAS,GAAM,GAAA,iBAAA,CAAA;AACrC,IAAM,MAAA,GAAA,GAAM,MAAM,qBAAsB,EAAA,CAAA;AACxC,IAAA,IAAI,GAAK,EAAA;AACP,MAAI,IAAA,GAAA,CAAI,MAAS,GAAA,QAAA,CAAS,MAAQ,EAAA;AAChC,QAAA,OAAO,CAAC,MAAA,EAAQ,GAAI,CAAA,MAAA,GAAS,SAAS,MAAM,CAAA,CAAA;AAAA,OAC9C,MAAA,IAAW,GAAI,CAAA,GAAA,GAAM,aAAe,EAAA;AAClC,QAAA,OAAO,CAAC,IAAA,EAAM,GAAI,CAAA,GAAA,GAAM,aAAa,CAAA,CAAA;AAAA,OAChC,MAAA;AACL,QAAO,OAAA,mBAAA,CAAA;AAAA,OACT;AAAA,KACK,MAAA;AACL,MAAA,MAAM,MAAM,+BAA+B,CAAA,CAAA;AAAA,KAC7C;AAAA,GACK,MAAA;AACL,IAAA,MAAM,MAAM,+CAA+C,CAAA,CAAA;AAAA,GAC7D;AACF;;;;;;;;;;;"}
1
+ {"version":3,"file":"table-dom-utils.js","sources":["../src/table-dom-utils.ts"],"sourcesContent":["import { RefObject } from \"react\";\nimport { ScrollDirection } from \"./useTableScroll\";\n\n/**\n * [rowIndex, colIndex\n */\nexport type CellPos = [number, number];\n\nexport const headerCellQuery = (colIdx: number) =>\n `.vuuTable-col-headers .vuuTableHeaderCell:nth-child(${colIdx})`;\n\nexport const dataCellQuery = (rowIdx: number, colIdx: number) =>\n `.vuuTable-body > [aria-rowindex='${rowIdx + 1}'] > [role='cell']:nth-child(${\n colIdx + 1\n })`;\n\nexport const getTableCell = (\n containerRef: RefObject<HTMLElement>,\n\n [rowIdx, colIdx]: CellPos\n) => {\n const cssQuery =\n rowIdx === -1 ? headerCellQuery(colIdx) : dataCellQuery(rowIdx, colIdx);\n const cell = containerRef.current?.querySelector(\n cssQuery\n ) as HTMLTableCellElement;\n\n if (cellIsEditable(cell)) {\n // Dropdown gets focus, Input does not\n const focusableContent = cell.querySelector(\"button\") as HTMLElement;\n return focusableContent || cell;\n } else {\n return cell;\n }\n};\n\nexport const cellIsEditable = (cell: HTMLDivElement | null) =>\n cell?.classList.contains(\"vuuTableCell-editable\");\n\nexport const cellDropdownShowing = (cell: HTMLDivElement | null) => {\n if (cellIsEditable(cell)) {\n return cell?.querySelector('.saltDropdown[aria-expanded=\"true\"]') !== null;\n }\n return false;\n};\n\nexport const cellIsTextInput = (cell: HTMLElement) =>\n cell.querySelector(\".vuuTableInputCell\") !== null;\n\nexport function getRowIndex(rowEl?: HTMLElement) {\n if (rowEl) {\n const idx: string | null = rowEl.ariaRowIndex;\n if (idx !== null) {\n return parseInt(idx, 10) - 1;\n }\n }\n return -1;\n}\n\nconst closestRow = (el: HTMLElement) =>\n el.closest('[role=\"row\"]') as HTMLElement;\n\nexport const closestRowIndex = (el: HTMLElement) => getRowIndex(closestRow(el));\n\nconst NO_SCROLL_NECESSARY = [undefined, undefined] as const;\n\nexport const howFarIsRowOutsideViewport = (\n rowEl: HTMLElement,\n totalHeaderHeight: number,\n contentContainer = rowEl.closest(\".vuuTable-contentContainer\")\n): readonly [ScrollDirection | undefined, number | undefined] => {\n //TODO lots of scope for optimisation here\n if (contentContainer) {\n // TODO take totalHeaderHeight into consideration\n const viewport = contentContainer?.getBoundingClientRect();\n const upperBoundary = viewport.top + totalHeaderHeight;\n const row = rowEl.getBoundingClientRect();\n if (row) {\n if (row.bottom > viewport.bottom) {\n return [\"down\", row.bottom - viewport.bottom];\n } else if (row.top < upperBoundary) {\n return [\"up\", row.top - upperBoundary];\n } else {\n return NO_SCROLL_NECESSARY;\n }\n } else {\n throw Error(\"Whats going on, row not found\");\n }\n } else {\n throw Error(\"Whats going on, scrollbar container not found\");\n }\n};\n"],"names":[],"mappings":"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"}
@@ -237,6 +237,10 @@ const useKeyboardNavigation = ({
237
237
  }, [highlightedIndexProp, scrollRowIntoViewIfNecessary]);
238
238
  const handleKeyDown = react.useCallback(
239
239
  (e) => {
240
+ const cell = vuuUtils.queryClosest(e.target, ".vuuTableCell");
241
+ if (tableDomUtils.cellDropdownShowing(cell)) {
242
+ return;
243
+ }
240
244
  if (rowCount > 0 && isNavigationKey(e.key, navigationStyle)) {
241
245
  e.preventDefault();
242
246
  e.stopPropagation();
@@ -1 +1 @@
1
- {"version":3,"file":"useKeyboardNavigation.js","sources":["../src/useKeyboardNavigation.ts"],"sourcesContent":["import { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { getIndexFromRowElement } from \"@vuu-ui/vuu-utils\";\nimport { useControlled } from \"@salt-ds/core\";\nimport {\n KeyboardEvent,\n MouseEvent,\n RefObject,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\nimport { TableNavigationStyle } from \"./Table\";\nimport {\n CellPos,\n closestRowIndex,\n dataCellQuery,\n getTableCell,\n headerCellQuery,\n} from \"./table-dom-utils\";\nimport { ScrollRequestHandler } from \"./useTableScroll\";\n\nconst rowNavigationKeys = new Set<NavigationKey>([\n \"Home\",\n \"End\",\n \"PageUp\",\n \"PageDown\",\n \"ArrowDown\",\n \"ArrowUp\",\n]);\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 return cellNavigationKeys.has(key as NavigationKey);\n case \"row\":\n return rowNavigationKeys.has(key as NavigationKey);\n default:\n return false;\n }\n};\n\ntype ArrowKey = \"ArrowUp\" | \"ArrowDown\" | \"ArrowLeft\" | \"ArrowRight\";\ntype PageKey = \"Home\" | \"End\" | \"PageUp\" | \"PageDown\";\ntype NavigationKey = PageKey | ArrowKey;\n\nconst PageKeys = [\"Home\", \"End\", \"PageUp\", \"PageDown\"];\nexport const isPagingKey = (key: string): key is PageKey =>\n PageKeys.includes(key);\n\nconst NULL_CELL_POS: CellPos = [-1, -1];\n\nfunction nextCellPos(\n key: ArrowKey,\n [rowIdx, colIdx]: CellPos,\n columnCount: number,\n rowCount: number\n): CellPos {\n if (key === \"ArrowUp\") {\n if (rowIdx > -1) {\n return [rowIdx - 1, colIdx];\n } else {\n return [rowIdx, colIdx];\n }\n } else if (key === \"ArrowDown\") {\n if (rowIdx === -1) {\n return [0, colIdx];\n } else if (rowIdx === rowCount - 1) {\n return [rowIdx, colIdx];\n } else {\n return [rowIdx + 1, colIdx];\n }\n } else if (key === \"ArrowRight\") {\n // The colIdx is 1 based, because of the selection decorator\n if (colIdx < columnCount) {\n return [rowIdx, colIdx + 1];\n } else {\n return [rowIdx, colIdx];\n }\n } else if (key === \"ArrowLeft\") {\n if (colIdx > 1) {\n return [rowIdx, colIdx - 1];\n } else {\n return [rowIdx, colIdx];\n }\n }\n return [rowIdx, colIdx];\n}\n\nexport interface NavigationHookProps {\n containerRef: RefObject<HTMLElement>;\n columnCount?: number;\n defaultHighlightedIndex?: number;\n disableFocus?: boolean;\n disableHighlightOnFocus?: boolean;\n highlightedIndex?: number;\n label?: string;\n navigationStyle: TableNavigationStyle;\n viewportRange: VuuRange;\n onHighlight?: (idx: number) => void;\n requestScroll?: ScrollRequestHandler;\n restoreLastFocus?: boolean;\n rowCount?: number;\n selected?: unknown;\n viewportRowCount: number;\n}\n\nexport const useKeyboardNavigation = ({\n columnCount = 0,\n containerRef,\n disableFocus = false,\n defaultHighlightedIndex,\n disableHighlightOnFocus,\n highlightedIndex: highlightedIndexProp,\n navigationStyle,\n requestScroll,\n onHighlight,\n rowCount = 0,\n viewportRowCount,\n}: // viewportRange,\nNavigationHookProps) => {\n // const { from: viewportFirstRow, to: viewportLastRow } = viewportRange;\n const focusedCellPos = useRef<CellPos>([-1, -1]);\n const focusableCell = useRef<HTMLElement>();\n const activeCellPos = useRef<CellPos>([-1, 0]);\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>();\n\n const [highlightedIndex, setHighlightedIdx] = useControlled({\n controlled: highlightedIndexProp,\n default: defaultHighlightedIndex,\n name: \"UseKeyboardNavigation\",\n });\n highlightedIndexRef.current = highlightedIndex;\n const setHighlightedIndex = useCallback(\n (idx: number, fromKeyboard = false) => {\n onHighlight?.(idx);\n setHighlightedIdx(idx);\n if (fromKeyboard) {\n // lastFocus.current = idx;\n }\n },\n [onHighlight, setHighlightedIdx]\n );\n\n const getFocusedCell = (element: HTMLElement | Element | null) =>\n element?.closest(\n \"[role='columnHeader'],[role='cell']\"\n ) as HTMLDivElement | null;\n\n const getTableCellPos = (tableCell: HTMLDivElement): CellPos => {\n if (tableCell.role === \"columnHeader\") {\n const colIdx = parseInt(tableCell.dataset.idx ?? \"-1\", 10);\n return [-1, colIdx];\n } else {\n const focusedRow = tableCell.closest(\"[role='row']\") as HTMLElement;\n if (focusedRow) {\n const rowIdx = getIndexFromRowElement(focusedRow);\n // TODO will get trickier when we introduce horizontal virtualisation\n const colIdx = Array.from(focusedRow.childNodes).indexOf(tableCell);\n return [rowIdx, colIdx];\n }\n }\n return NULL_CELL_POS;\n };\n\n const focusCell = useCallback(\n (cellPos: CellPos) => {\n if (containerRef.current) {\n const activeCell = getTableCell(containerRef, cellPos);\n if (activeCell) {\n if (activeCell !== focusableCell.current) {\n focusableCell.current?.removeAttribute(\"tabindex\");\n focusableCell.current = activeCell;\n activeCell.setAttribute(\"tabindex\", \"0\");\n }\n // TODO needs to be scroll cell\n requestScroll?.({ type: \"scroll-row\", rowIndex: cellPos[0] });\n activeCell.focus({ preventScroll: true });\n }\n }\n },\n // TODO we recreate this function whenever viewportRange changes, which will\n // be often whilst scrolling - store range in a a ref ?\n [containerRef, requestScroll]\n );\n\n const setActiveCell = useCallback(\n (rowIdx: number, colIdx: number, fromKeyboard = false) => {\n const pos: CellPos = [rowIdx, colIdx];\n activeCellPos.current = pos;\n if (navigationStyle === \"row\") {\n setHighlightedIdx(rowIdx);\n } else {\n focusCell(pos);\n }\n if (fromKeyboard) {\n focusedCellPos.current = pos;\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 switch (key) {\n case \"PageDown\": {\n newRowIdx = Math.min(rowCount - 1, rowIdx + viewportRowCount);\n if (newRowIdx !== rowIdx) {\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 requestScroll?.({ type: \"scroll-page\", direction: \"up\" });\n }\n break;\n }\n case \"Home\": {\n newRowIdx = 0;\n if (newRowIdx !== rowIdx) {\n requestScroll?.({ type: \"scroll-end\", direction: \"home\" });\n }\n break;\n }\n case \"End\": {\n newRowIdx = rowCount - 1;\n if (newRowIdx !== rowIdx) {\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 [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 focusedCellPos.current = getTableCellPos(focusedCell);\n if (navigationStyle === \"row\") {\n setHighlightedIdx(focusedCellPos.current[0]);\n }\n }\n }\n }\n }, [\n disableHighlightOnFocus,\n containerRef,\n navigationStyle,\n setHighlightedIdx,\n ]);\n\n const navigateChildItems = useCallback(\n async (key: NavigationKey) => {\n const [nextRowIdx, nextColIdx] = isPagingKey(key)\n ? await nextPageItemIdx(key, activeCellPos.current)\n : nextCellPos(key, activeCellPos.current, columnCount, rowCount);\n const [rowIdx, colIdx] = activeCellPos.current;\n if (nextRowIdx !== rowIdx || nextColIdx !== colIdx) {\n setActiveCell(nextRowIdx, nextColIdx, true);\n }\n },\n [columnCount, nextPageItemIdx, rowCount, setActiveCell]\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 : nextCellPos(key, [highlighted ?? -1, 0], columnCount, rowCount);\n if (nextRowIdx !== highlighted) {\n setHighlightedIndex(nextRowIdx);\n // TO(DO make this a scroll request)\n scrollRowIntoViewIfNecessary(nextRowIdx);\n }\n },\n [\n columnCount,\n nextPageItemIdx,\n rowCount,\n scrollRowIntoViewIfNecessary,\n setHighlightedIndex,\n ]\n );\n\n useEffect(() => {\n if (highlightedIndexProp !== undefined && highlightedIndexProp !== -1) {\n scrollRowIntoViewIfNecessary(highlightedIndexProp);\n }\n }, [highlightedIndexProp, scrollRowIntoViewIfNecessary]);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (rowCount > 0 && isNavigationKey(e.key, navigationStyle)) {\n e.preventDefault();\n e.stopPropagation();\n if (navigationStyle === \"row\") {\n moveHighlightedRow(e.key);\n } else {\n void navigateChildItems(e.key);\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 = evt.target as HTMLElement;\n const focusedCell = getFocusedCell(target);\n if (focusedCell) {\n const [rowIdx, colIdx] = getTableCellPos(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 idx = closestRowIndex(evt.target as HTMLElement);\n if (idx !== -1 && idx !== highlightedIndexRef.current) {\n setHighlightedIndex(idx);\n }\n },\n [setHighlightedIndex]\n );\n\n const navigate = useCallback(() => {\n navigateChildItems(\"ArrowDown\");\n }, [navigateChildItems]);\n\n // First render will only render the outer container when explicit\n // sizing has not been provided. Outer container is measured and\n // only then, on second render, is content rendered.\n const fullyRendered = containerRef.current?.firstChild != null;\n useEffect(() => {\n if (fullyRendered && focusableCell.current === undefined && !disableFocus) {\n const { current: container } = containerRef;\n const cell = (container?.querySelector(headerCellQuery(0)) ||\n container?.querySelector(dataCellQuery(0, 0))) as HTMLElement;\n if (cell) {\n cell.setAttribute(\"tabindex\", \"0\");\n focusableCell.current = cell;\n }\n }\n }, [containerRef, disableFocus, fullyRendered]);\n\n return {\n highlightedIndexRef,\n navigate,\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":["useRef","useControlled","useCallback","getIndexFromRowElement","getTableCell","useEffect","closestRowIndex","headerCellQuery","dataCellQuery"],"mappings":"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"}
1
+ {"version":3,"file":"useKeyboardNavigation.js","sources":["../src/useKeyboardNavigation.ts"],"sourcesContent":["import { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { getIndexFromRowElement, queryClosest } from \"@vuu-ui/vuu-utils\";\nimport { useControlled } from \"@salt-ds/core\";\nimport {\n KeyboardEvent,\n MouseEvent,\n RefObject,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\nimport { TableNavigationStyle } from \"./Table\";\nimport {\n CellPos,\n cellDropdownShowing,\n closestRowIndex,\n dataCellQuery,\n getTableCell,\n headerCellQuery,\n} from \"./table-dom-utils\";\nimport { ScrollRequestHandler } from \"./useTableScroll\";\n\nconst rowNavigationKeys = new Set<NavigationKey>([\n \"Home\",\n \"End\",\n \"PageUp\",\n \"PageDown\",\n \"ArrowDown\",\n \"ArrowUp\",\n]);\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 return cellNavigationKeys.has(key as NavigationKey);\n case \"row\":\n return rowNavigationKeys.has(key as NavigationKey);\n default:\n return false;\n }\n};\n\ntype ArrowKey = \"ArrowUp\" | \"ArrowDown\" | \"ArrowLeft\" | \"ArrowRight\";\ntype PageKey = \"Home\" | \"End\" | \"PageUp\" | \"PageDown\";\ntype NavigationKey = PageKey | ArrowKey;\n\nconst PageKeys = [\"Home\", \"End\", \"PageUp\", \"PageDown\"];\nexport const isPagingKey = (key: string): key is PageKey =>\n PageKeys.includes(key);\n\nconst NULL_CELL_POS: CellPos = [-1, -1];\n\nfunction nextCellPos(\n key: ArrowKey,\n [rowIdx, colIdx]: CellPos,\n columnCount: number,\n rowCount: number\n): CellPos {\n if (key === \"ArrowUp\") {\n if (rowIdx > -1) {\n return [rowIdx - 1, colIdx];\n } else {\n return [rowIdx, colIdx];\n }\n } else if (key === \"ArrowDown\") {\n if (rowIdx === -1) {\n return [0, colIdx];\n } else if (rowIdx === rowCount - 1) {\n return [rowIdx, colIdx];\n } else {\n return [rowIdx + 1, colIdx];\n }\n } else if (key === \"ArrowRight\") {\n // The colIdx is 1 based, because of the selection decorator\n if (colIdx < columnCount) {\n return [rowIdx, colIdx + 1];\n } else {\n return [rowIdx, colIdx];\n }\n } else if (key === \"ArrowLeft\") {\n if (colIdx > 1) {\n return [rowIdx, colIdx - 1];\n } else {\n return [rowIdx, colIdx];\n }\n }\n return [rowIdx, colIdx];\n}\n\nexport interface NavigationHookProps {\n containerRef: RefObject<HTMLElement>;\n columnCount?: number;\n defaultHighlightedIndex?: number;\n disableFocus?: boolean;\n disableHighlightOnFocus?: boolean;\n highlightedIndex?: number;\n label?: string;\n navigationStyle: TableNavigationStyle;\n viewportRange: VuuRange;\n onHighlight?: (idx: number) => void;\n requestScroll?: ScrollRequestHandler;\n restoreLastFocus?: boolean;\n rowCount?: number;\n selected?: unknown;\n viewportRowCount: number;\n}\n\nexport const useKeyboardNavigation = ({\n columnCount = 0,\n containerRef,\n disableFocus = false,\n defaultHighlightedIndex,\n disableHighlightOnFocus,\n highlightedIndex: highlightedIndexProp,\n navigationStyle,\n requestScroll,\n onHighlight,\n rowCount = 0,\n viewportRowCount,\n}: // viewportRange,\nNavigationHookProps) => {\n // const { from: viewportFirstRow, to: viewportLastRow } = viewportRange;\n const focusedCellPos = useRef<CellPos>([-1, -1]);\n const focusableCell = useRef<HTMLElement>();\n const activeCellPos = useRef<CellPos>([-1, 0]);\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>();\n\n const [highlightedIndex, setHighlightedIdx] = useControlled({\n controlled: highlightedIndexProp,\n default: defaultHighlightedIndex,\n name: \"UseKeyboardNavigation\",\n });\n highlightedIndexRef.current = highlightedIndex;\n const setHighlightedIndex = useCallback(\n (idx: number, fromKeyboard = false) => {\n onHighlight?.(idx);\n setHighlightedIdx(idx);\n if (fromKeyboard) {\n // lastFocus.current = idx;\n }\n },\n [onHighlight, setHighlightedIdx]\n );\n\n const getFocusedCell = (element: HTMLElement | Element | null) =>\n element?.closest(\n \"[role='columnHeader'],[role='cell']\"\n ) as HTMLDivElement | null;\n\n const getTableCellPos = (tableCell: HTMLDivElement): CellPos => {\n if (tableCell.role === \"columnHeader\") {\n const colIdx = parseInt(tableCell.dataset.idx ?? \"-1\", 10);\n return [-1, colIdx];\n } else {\n const focusedRow = tableCell.closest(\"[role='row']\") as HTMLElement;\n if (focusedRow) {\n const rowIdx = getIndexFromRowElement(focusedRow);\n // TODO will get trickier when we introduce horizontal virtualisation\n const colIdx = Array.from(focusedRow.childNodes).indexOf(tableCell);\n return [rowIdx, colIdx];\n }\n }\n return NULL_CELL_POS;\n };\n\n const focusCell = useCallback(\n (cellPos: CellPos) => {\n if (containerRef.current) {\n const activeCell = getTableCell(containerRef, cellPos);\n if (activeCell) {\n if (activeCell !== focusableCell.current) {\n focusableCell.current?.removeAttribute(\"tabindex\");\n focusableCell.current = activeCell;\n activeCell.setAttribute(\"tabindex\", \"0\");\n }\n // TODO needs to be scroll cell\n requestScroll?.({ type: \"scroll-row\", rowIndex: cellPos[0] });\n activeCell.focus({ preventScroll: true });\n }\n }\n },\n // TODO we recreate this function whenever viewportRange changes, which will\n // be often whilst scrolling - store range in a a ref ?\n [containerRef, requestScroll]\n );\n\n const setActiveCell = useCallback(\n (rowIdx: number, colIdx: number, fromKeyboard = false) => {\n const pos: CellPos = [rowIdx, colIdx];\n activeCellPos.current = pos;\n if (navigationStyle === \"row\") {\n setHighlightedIdx(rowIdx);\n } else {\n focusCell(pos);\n }\n if (fromKeyboard) {\n focusedCellPos.current = pos;\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 switch (key) {\n case \"PageDown\": {\n newRowIdx = Math.min(rowCount - 1, rowIdx + viewportRowCount);\n if (newRowIdx !== rowIdx) {\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 requestScroll?.({ type: \"scroll-page\", direction: \"up\" });\n }\n break;\n }\n case \"Home\": {\n newRowIdx = 0;\n if (newRowIdx !== rowIdx) {\n requestScroll?.({ type: \"scroll-end\", direction: \"home\" });\n }\n break;\n }\n case \"End\": {\n newRowIdx = rowCount - 1;\n if (newRowIdx !== rowIdx) {\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 [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 focusedCellPos.current = getTableCellPos(focusedCell);\n if (navigationStyle === \"row\") {\n setHighlightedIdx(focusedCellPos.current[0]);\n }\n }\n }\n }\n }, [\n disableHighlightOnFocus,\n containerRef,\n navigationStyle,\n setHighlightedIdx,\n ]);\n\n const navigateChildItems = useCallback(\n async (key: NavigationKey) => {\n const [nextRowIdx, nextColIdx] = isPagingKey(key)\n ? await nextPageItemIdx(key, activeCellPos.current)\n : nextCellPos(key, activeCellPos.current, columnCount, rowCount);\n const [rowIdx, colIdx] = activeCellPos.current;\n if (nextRowIdx !== rowIdx || nextColIdx !== colIdx) {\n setActiveCell(nextRowIdx, nextColIdx, true);\n }\n },\n [columnCount, nextPageItemIdx, rowCount, setActiveCell]\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 : nextCellPos(key, [highlighted ?? -1, 0], columnCount, rowCount);\n if (nextRowIdx !== highlighted) {\n setHighlightedIndex(nextRowIdx);\n // TO(DO make this a scroll request)\n scrollRowIntoViewIfNecessary(nextRowIdx);\n }\n },\n [\n columnCount,\n nextPageItemIdx,\n rowCount,\n scrollRowIntoViewIfNecessary,\n setHighlightedIndex,\n ]\n );\n\n useEffect(() => {\n if (highlightedIndexProp !== undefined && highlightedIndexProp !== -1) {\n scrollRowIntoViewIfNecessary(highlightedIndexProp);\n }\n }, [highlightedIndexProp, scrollRowIntoViewIfNecessary]);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n const cell = queryClosest<HTMLDivElement>(e.target, \".vuuTableCell\");\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 {\n void navigateChildItems(e.key);\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 = evt.target as HTMLElement;\n const focusedCell = getFocusedCell(target);\n if (focusedCell) {\n const [rowIdx, colIdx] = getTableCellPos(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 idx = closestRowIndex(evt.target as HTMLElement);\n if (idx !== -1 && idx !== highlightedIndexRef.current) {\n setHighlightedIndex(idx);\n }\n },\n [setHighlightedIndex]\n );\n\n const navigate = useCallback(() => {\n navigateChildItems(\"ArrowDown\");\n }, [navigateChildItems]);\n\n // First render will only render the outer container when explicit\n // sizing has not been provided. Outer container is measured and\n // only then, on second render, is content rendered.\n const fullyRendered = containerRef.current?.firstChild != null;\n useEffect(() => {\n if (fullyRendered && focusableCell.current === undefined && !disableFocus) {\n const { current: container } = containerRef;\n const cell = (container?.querySelector(headerCellQuery(0)) ||\n container?.querySelector(dataCellQuery(0, 0))) as HTMLElement;\n if (cell) {\n cell.setAttribute(\"tabindex\", \"0\");\n focusableCell.current = cell;\n }\n }\n }, [containerRef, disableFocus, fullyRendered]);\n\n return {\n highlightedIndexRef,\n navigate,\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":["useRef","useControlled","useCallback","getIndexFromRowElement","getTableCell","useEffect","queryClosest","cellDropdownShowing","closestRowIndex","headerCellQuery","dataCellQuery"],"mappings":"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"}
@@ -41,16 +41,23 @@ const useTableAndColumnSettings = ({
41
41
  }, []);
42
42
  const handleCreateCalculatedColumn = react.useCallback(
43
43
  (column) => {
44
- const newAvailableColumns = availableColumns.concat({
45
- name: column.name,
46
- serverDataType: vuuUtils.getCalculatedColumnType(column)
47
- });
48
- setAvailableColumns(newAvailableColumns);
49
- onAvailableColumnsChange?.(newAvailableColumns);
50
- requestAnimationFrame(() => {
51
- showTableSettingsRef.current?.();
52
- });
53
- onCreateCalculatedColumn(column);
44
+ const { serverDataType } = vuuUtils.getCalculatedColumnDetails(column);
45
+ if (serverDataType) {
46
+ const newAvailableColumns = availableColumns.concat({
47
+ name: column.name,
48
+ serverDataType
49
+ });
50
+ setAvailableColumns(newAvailableColumns);
51
+ onAvailableColumnsChange?.(newAvailableColumns);
52
+ requestAnimationFrame(() => {
53
+ showTableSettingsRef.current?.();
54
+ });
55
+ onCreateCalculatedColumn(column);
56
+ } else {
57
+ throw Error(
58
+ "Cannot create calculatec columns without valis serverDataType"
59
+ );
60
+ }
54
61
  },
55
62
  [availableColumns, onAvailableColumnsChange, onCreateCalculatedColumn]
56
63
  );
@@ -1 +1 @@
1
- {"version":3,"file":"useTableAndColumnSettings.js","sources":["../src/useTableAndColumnSettings.ts"],"sourcesContent":["import { DataSourceConfig, SchemaColumn } from \"@vuu-ui/vuu-data-types\";\nimport { useLayoutProviderDispatch } from \"@vuu-ui/vuu-layout\";\nimport {\n ColumnDescriptor,\n ColumnSettingsProps,\n TableConfig,\n TableSettingsProps,\n} from \"@vuu-ui/vuu-table-types\";\nimport { getCalculatedColumnType } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useRef, useState } from \"react\";\nimport { ColumnActionColumnSettings } from \"./useTableModel\";\n\nexport interface TableAndColumnSettingsHookProps {\n availableColumns: SchemaColumn[];\n onAvailableColumnsChange?: (columns: SchemaColumn[]) => void;\n onConfigChange: (config: TableConfig) => void;\n onCreateCalculatedColumn: (column: ColumnDescriptor) => void;\n onDataSourceConfigChange: (dataSourceConfig: DataSourceConfig) => void;\n tableConfig: TableConfig;\n}\nexport const useTableAndColumnSettings = ({\n availableColumns: availableColumnsProps,\n onAvailableColumnsChange,\n onConfigChange,\n onCreateCalculatedColumn,\n onDataSourceConfigChange,\n tableConfig,\n}: TableAndColumnSettingsHookProps) => {\n const dispatchLayoutAction = useLayoutProviderDispatch();\n const showTableSettingsRef = useRef<() => void>();\n\n const [availableColumns, setAvailableColumns] = useState<SchemaColumn[]>(\n availableColumnsProps\n );\n\n const showContextPanel = useCallback(\n (\n componentType: string,\n title: string,\n props: TableSettingsProps | ColumnSettingsProps\n ) => {\n dispatchLayoutAction({\n type: \"set-props\",\n path: \"#context-panel\",\n props: {\n expanded: true,\n content: {\n type: componentType,\n props,\n },\n title,\n },\n });\n },\n [dispatchLayoutAction]\n );\n\n const handleCancelCreateColumn = useCallback(() => {\n requestAnimationFrame(() => {\n showTableSettingsRef.current?.();\n });\n }, []);\n\n const handleCreateCalculatedColumn = useCallback(\n (column: ColumnDescriptor) => {\n const newAvailableColumns = availableColumns.concat({\n name: column.name,\n serverDataType: getCalculatedColumnType(column),\n });\n setAvailableColumns(newAvailableColumns);\n onAvailableColumnsChange?.(newAvailableColumns);\n requestAnimationFrame(() => {\n showTableSettingsRef.current?.();\n });\n onCreateCalculatedColumn(column);\n },\n [availableColumns, onAvailableColumnsChange, onCreateCalculatedColumn]\n );\n\n const showColumnSettingsPanel = useCallback(\n (action: ColumnActionColumnSettings) => {\n showContextPanel(\"ColumnSettings\", \"Column Settings\", {\n column: action.column,\n onCancelCreateColumn: handleCancelCreateColumn,\n onConfigChange,\n onCreateCalculatedColumn: handleCreateCalculatedColumn,\n tableConfig,\n vuuTable: action.vuuTable,\n } as ColumnSettingsProps);\n },\n [\n handleCancelCreateColumn,\n handleCreateCalculatedColumn,\n onConfigChange,\n showContextPanel,\n tableConfig,\n ]\n );\n\n const handleAddCalculatedColumn = useCallback(() => {\n showColumnSettingsPanel({\n column: {\n name: \"::\",\n serverDataType: \"string\",\n },\n type: \"columnSettings\",\n vuuTable: { module: \"SIMUL\", table: \"instruments\" },\n });\n }, [showColumnSettingsPanel]);\n\n const handleNavigateToColumn = useCallback(\n (columnName: string) => {\n const column = tableConfig.columns.find((c) => c.name === columnName);\n if (column) {\n showColumnSettingsPanel({\n type: \"columnSettings\",\n column,\n //TODO where do we get this from\n vuuTable: { module: \"SIMUL\", table: \"instruments\" },\n });\n }\n },\n [showColumnSettingsPanel, tableConfig.columns]\n );\n\n showTableSettingsRef.current = useCallback(() => {\n showContextPanel(\"TableSettings\", \"DataGrid Settings\", {\n availableColumns:\n availableColumns ??\n tableConfig.columns.map(({ name, serverDataType }) => ({\n name,\n serverDataType,\n })),\n onAddCalculatedColumn: handleAddCalculatedColumn,\n onConfigChange,\n onDataSourceConfigChange,\n onNavigateToColumn: handleNavigateToColumn,\n tableConfig,\n } as TableSettingsProps);\n }, [\n availableColumns,\n handleAddCalculatedColumn,\n handleNavigateToColumn,\n onConfigChange,\n onDataSourceConfigChange,\n showContextPanel,\n tableConfig,\n ]);\n\n return {\n showColumnSettingsPanel,\n showTableSettingsPanel: showTableSettingsRef.current,\n };\n};\n"],"names":["useLayoutProviderDispatch","useRef","useState","useCallback","getCalculatedColumnType"],"mappings":"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"}
1
+ {"version":3,"file":"useTableAndColumnSettings.js","sources":["../src/useTableAndColumnSettings.ts"],"sourcesContent":["import { DataSourceConfig, SchemaColumn } from \"@vuu-ui/vuu-data-types\";\nimport { useLayoutProviderDispatch } from \"@vuu-ui/vuu-layout\";\nimport {\n ColumnDescriptor,\n ColumnSettingsProps,\n TableConfig,\n TableSettingsProps,\n} from \"@vuu-ui/vuu-table-types\";\nimport { getCalculatedColumnDetails } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useRef, useState } from \"react\";\nimport { ColumnActionColumnSettings } from \"./useTableModel\";\n\nexport interface TableAndColumnSettingsHookProps {\n availableColumns: SchemaColumn[];\n onAvailableColumnsChange?: (columns: SchemaColumn[]) => void;\n onConfigChange: (config: TableConfig) => void;\n onCreateCalculatedColumn: (column: ColumnDescriptor) => void;\n onDataSourceConfigChange: (dataSourceConfig: DataSourceConfig) => void;\n tableConfig: TableConfig;\n}\nexport const useTableAndColumnSettings = ({\n availableColumns: availableColumnsProps,\n onAvailableColumnsChange,\n onConfigChange,\n onCreateCalculatedColumn,\n onDataSourceConfigChange,\n tableConfig,\n}: TableAndColumnSettingsHookProps) => {\n const dispatchLayoutAction = useLayoutProviderDispatch();\n const showTableSettingsRef = useRef<() => void>();\n\n const [availableColumns, setAvailableColumns] = useState<SchemaColumn[]>(\n availableColumnsProps\n );\n\n const showContextPanel = useCallback(\n (\n componentType: string,\n title: string,\n props: TableSettingsProps | ColumnSettingsProps\n ) => {\n dispatchLayoutAction({\n type: \"set-props\",\n path: \"#context-panel\",\n props: {\n expanded: true,\n content: {\n type: componentType,\n props,\n },\n title,\n },\n });\n },\n [dispatchLayoutAction]\n );\n\n const handleCancelCreateColumn = useCallback(() => {\n requestAnimationFrame(() => {\n showTableSettingsRef.current?.();\n });\n }, []);\n\n const handleCreateCalculatedColumn = useCallback(\n (column: ColumnDescriptor) => {\n const { serverDataType } = getCalculatedColumnDetails(column);\n if (serverDataType) {\n const newAvailableColumns = availableColumns.concat({\n name: column.name,\n serverDataType,\n });\n setAvailableColumns(newAvailableColumns);\n onAvailableColumnsChange?.(newAvailableColumns);\n requestAnimationFrame(() => {\n showTableSettingsRef.current?.();\n });\n onCreateCalculatedColumn(column);\n } else {\n throw Error(\n \"Cannot create calculatec columns without valis serverDataType\"\n );\n }\n },\n [availableColumns, onAvailableColumnsChange, onCreateCalculatedColumn]\n );\n\n const showColumnSettingsPanel = useCallback(\n (action: ColumnActionColumnSettings) => {\n showContextPanel(\"ColumnSettings\", \"Column Settings\", {\n column: action.column,\n onCancelCreateColumn: handleCancelCreateColumn,\n onConfigChange,\n onCreateCalculatedColumn: handleCreateCalculatedColumn,\n tableConfig,\n vuuTable: action.vuuTable,\n } as ColumnSettingsProps);\n },\n [\n handleCancelCreateColumn,\n handleCreateCalculatedColumn,\n onConfigChange,\n showContextPanel,\n tableConfig,\n ]\n );\n\n const handleAddCalculatedColumn = useCallback(() => {\n showColumnSettingsPanel({\n column: {\n name: \"::\",\n serverDataType: \"string\",\n },\n type: \"columnSettings\",\n vuuTable: { module: \"SIMUL\", table: \"instruments\" },\n });\n }, [showColumnSettingsPanel]);\n\n const handleNavigateToColumn = useCallback(\n (columnName: string) => {\n const column = tableConfig.columns.find((c) => c.name === columnName);\n if (column) {\n showColumnSettingsPanel({\n type: \"columnSettings\",\n column,\n //TODO where do we get this from\n vuuTable: { module: \"SIMUL\", table: \"instruments\" },\n });\n }\n },\n [showColumnSettingsPanel, tableConfig.columns]\n );\n\n showTableSettingsRef.current = useCallback(() => {\n showContextPanel(\"TableSettings\", \"DataGrid Settings\", {\n availableColumns:\n availableColumns ??\n tableConfig.columns.map(({ name, serverDataType }) => ({\n name,\n serverDataType,\n })),\n onAddCalculatedColumn: handleAddCalculatedColumn,\n onConfigChange,\n onDataSourceConfigChange,\n onNavigateToColumn: handleNavigateToColumn,\n tableConfig,\n } as TableSettingsProps);\n }, [\n availableColumns,\n handleAddCalculatedColumn,\n handleNavigateToColumn,\n onConfigChange,\n onDataSourceConfigChange,\n showContextPanel,\n tableConfig,\n ]);\n\n return {\n showColumnSettingsPanel,\n showTableSettingsPanel: showTableSettingsRef.current,\n };\n};\n"],"names":["useLayoutProviderDispatch","useRef","useState","useCallback","getCalculatedColumnDetails"],"mappings":"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"}
@@ -265,7 +265,6 @@ const useTableScroll = ({
265
265
  activeRow,
266
266
  totalHeaderHeight
267
267
  );
268
- console.log(`outside viewport ? ${direction} ${distance}`);
269
268
  if (direction && distance) {
270
269
  if (isVirtualScroll) {
271
270
  const offset = direction === "down" ? 1 : -1;
@@ -1 +1 @@
1
- {"version":3,"file":"useTableScroll.js","sources":["../src/useTableScroll.ts"],"sourcesContent":["import {\n getColumnsInViewport,\n getRowElementAtIndex,\n itemsChanged,\n RowAtPositionFunc,\n} from \"@vuu-ui/vuu-utils\";\nimport type { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n ForwardedRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport type { ViewportMeasurements } from \"./useTableViewport\";\nimport { howFarIsRowOutsideViewport } from \"./table-dom-utils\";\nimport type { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\n\nexport type ScrollDirectionVertical = \"up\" | \"down\";\nexport type ScrollDirectionHorizontal = \"left\" | \"right\";\nexport type ScrollDirection =\n | ScrollDirectionVertical\n | ScrollDirectionHorizontal;\n\n/**\n * scroll into view the row at given index posiiton.\n */\nexport interface ScrollRequestRow {\n rowIndex: number;\n type: \"scroll-row\";\n}\nexport interface ScrollRequestEnd {\n type: \"scroll-end\";\n direction: \"home\" | \"end\";\n}\n\nexport interface ScrollRequestPage {\n type: \"scroll-page\";\n direction: ScrollDirectionVertical;\n}\n\nexport type ScrollRequest =\n | ScrollRequestPage\n | ScrollRequestEnd\n | ScrollRequestRow;\n\nexport type ScrollRequestHandler = (request: ScrollRequest) => void;\n\nexport interface ScrollingAPI {\n scrollToIndex: (itemIndex: number) => void;\n scrollToKey: (rowKey: string) => void;\n}\n\n/** How far we allow horizontal scroll movement before we recheck the rendered columns */\nconst SCROLL_MOVE_CHECK_THRESHOLD = 100;\n\n/** The buffer size in pixels that we allow for rendering columns just outside the viewport */\nconst HORIZONTAL_SCROLL_BUFFER = 200;\n\n/**\n * Return the maximum scroll positions for gioven container\n * @param container\n * @returns [maxScrollLeft, maxScrollTop]\n */\nconst getMaxScroll = (container: HTMLElement) => {\n const { clientHeight, clientWidth, scrollHeight, scrollWidth } = container;\n return [scrollWidth - clientWidth, scrollHeight - clientHeight];\n};\n\nconst getScrollDirection = (\n prevScrollPositions: ScrollPos | undefined,\n scrollPos: number\n) => {\n if (prevScrollPositions === undefined) {\n return undefined;\n } else {\n const { scrollTop: prevTop } = prevScrollPositions;\n return scrollPos > prevTop ? \"fwd\" : \"bwd\";\n }\n};\n\nconst getPctScroll = (container: HTMLElement, currentScrollPos?: ScrollPos) => {\n const {\n clientHeight,\n clientWidth,\n scrollHeight,\n scrollLeft,\n scrollTop,\n scrollWidth,\n } = container;\n\n const maxScrollLeft = scrollWidth - clientWidth;\n const pctScrollLeft = scrollLeft / (scrollWidth - clientWidth);\n const maxScrollTop = scrollHeight - clientHeight;\n let pctScrollTop = scrollTop / (scrollHeight - clientHeight);\n\n const scrollDirection = getScrollDirection(currentScrollPos, scrollTop);\n\n if (scrollDirection === \"fwd\" && pctScrollTop > 0.99) {\n pctScrollTop = 1;\n } else if (scrollDirection === \"bwd\" && pctScrollTop < 0.02) {\n pctScrollTop = 0;\n }\n\n return [\n scrollLeft,\n pctScrollLeft,\n maxScrollLeft,\n scrollTop,\n pctScrollTop,\n maxScrollTop,\n ];\n};\n\nexport const noScrolling: ScrollingAPI = {\n scrollToIndex: () => undefined,\n scrollToKey: () => undefined,\n};\n\ninterface CallbackRefHookProps<T = HTMLElement> {\n onAttach?: (el: T) => void;\n onDetach: (el: T) => void;\n label?: string;\n}\n\nconst useCallbackRef = <T = HTMLElement>({\n onAttach,\n onDetach,\n}: CallbackRefHookProps<T>) => {\n const ref = useRef<T | null>(null);\n const callbackRef = useCallback(\n (el: T | null) => {\n if (el) {\n ref.current = el;\n onAttach?.(el);\n } else if (ref.current) {\n const { current: originalRef } = ref;\n ref.current = el;\n onDetach?.(originalRef);\n }\n },\n [onAttach, onDetach]\n );\n return callbackRef;\n};\n\ntype ScrollPos = {\n scrollLeft: number;\n scrollTop: number;\n};\n\nexport interface TableScrollHookProps {\n columns: RuntimeColumnDescriptor[];\n getRowAtPosition: RowAtPositionFunc;\n onHorizontalScroll?: (scrollLeft: number) => void;\n onVerticalScroll?: (scrollTop: number, pctScrollTop: number) => void;\n /**\n * When we have a virtualized scroll container, keyboard navigation is\n * performed `in situ`. We shift the range of rows rendered within the\n * viewport, whithout actually moving the scroll position\n */\n onVerticalScrollInSitu?: (rowIndexOffsetCount: number) => void;\n rowHeight: number;\n scrollingApiRef?: ForwardedRef<ScrollingAPI>;\n setRange: (range: VuuRange) => void;\n viewportMeasurements: ViewportMeasurements;\n}\n\nexport const useTableScroll = ({\n columns,\n getRowAtPosition,\n onHorizontalScroll,\n onVerticalScroll,\n onVerticalScrollInSitu,\n rowHeight,\n scrollingApiRef,\n setRange,\n viewportMeasurements,\n}: TableScrollHookProps) => {\n const firstRowRef = useRef<number>(0);\n const rowHeightRef = useRef(rowHeight);\n const contentContainerScrolledRef = useRef(false);\n const contentContainerPosRef = useRef<ScrollPos>({\n scrollTop: 0,\n scrollLeft: 0,\n });\n const scrollbarContainerScrolledRef = useRef(false);\n const scrollbarContainerPosRef = useRef<ScrollPos>({\n scrollTop: 0,\n scrollLeft: 0,\n });\n const scrollbarContainerRef = useRef<HTMLDivElement | null>(null);\n const contentContainerRef = useRef<HTMLDivElement | null>(null);\n const lastHorizontalScrollCheckPoint = useRef(0);\n\n const {\n appliedPageSize,\n isVirtualScroll,\n rowCount: viewportRowCount,\n totalHeaderHeight,\n viewportWidth,\n } = viewportMeasurements;\n\n const columnsWithinViewportRef = useRef<RuntimeColumnDescriptor[]>([]);\n const [, forceRefresh] = useState({});\n\n const preSpanRef = useRef(0);\n\n useMemo(() => {\n const [visibleColumns, offset] = getColumnsInViewport(\n columns,\n contentContainerPosRef.current.scrollLeft,\n contentContainerPosRef.current.scrollLeft +\n viewportWidth +\n HORIZONTAL_SCROLL_BUFFER\n );\n preSpanRef.current = offset;\n columnsWithinViewportRef.current = visibleColumns;\n }, [viewportWidth, columns]);\n\n const handleHorizontalScroll = useCallback(\n (scrollLeft: number) => {\n contentContainerPosRef.current.scrollLeft = scrollLeft;\n onHorizontalScroll?.(scrollLeft);\n\n if (\n Math.abs(scrollLeft - lastHorizontalScrollCheckPoint.current) >\n SCROLL_MOVE_CHECK_THRESHOLD\n ) {\n lastHorizontalScrollCheckPoint.current = scrollLeft;\n\n const [visibleColumns, pre] = getColumnsInViewport(\n columns,\n scrollLeft,\n scrollLeft + viewportWidth + HORIZONTAL_SCROLL_BUFFER\n );\n\n if (itemsChanged(columnsWithinViewportRef.current, visibleColumns)) {\n preSpanRef.current = pre;\n columnsWithinViewportRef.current = visibleColumns;\n forceRefresh({});\n }\n }\n },\n [columns, onHorizontalScroll, viewportWidth]\n );\n const handleVerticalScroll = useCallback(\n (scrollTop: number, pctScrollTop: number) => {\n contentContainerPosRef.current.scrollTop = scrollTop;\n\n onVerticalScroll?.(scrollTop, pctScrollTop);\n const firstRow = getRowAtPosition(scrollTop);\n if (firstRow !== firstRowRef.current) {\n firstRowRef.current = firstRow;\n setRange({ from: firstRow, to: firstRow + viewportRowCount });\n }\n onVerticalScrollInSitu?.(0);\n },\n [\n getRowAtPosition,\n onVerticalScroll,\n onVerticalScrollInSitu,\n setRange,\n viewportRowCount,\n ]\n );\n\n const handleScrollbarContainerScroll = useCallback(() => {\n const { current: contentContainer } = contentContainerRef;\n const { current: scrollbarContainer } = scrollbarContainerRef;\n const { current: contentContainerScrolled } = contentContainerScrolledRef;\n const { current: scrollPos } = scrollbarContainerPosRef;\n\n if (contentContainerScrolled) {\n contentContainerScrolledRef.current = false;\n } else if (contentContainer && scrollbarContainer) {\n scrollbarContainerScrolledRef.current = true;\n const [scrollLeft, pctScrollLeft, , scrollTop, pctScrollTop] =\n getPctScroll(scrollbarContainer, scrollPos);\n\n scrollPos.scrollLeft = scrollLeft;\n scrollPos.scrollTop = scrollTop;\n\n const [maxScrollLeft, maxScrollTop] = getMaxScroll(scrollbarContainer);\n const contentScrollLeft = Math.round(pctScrollLeft * maxScrollLeft);\n const contentScrollTop = pctScrollTop * maxScrollTop;\n\n contentContainer.scrollTo({\n left: contentScrollLeft,\n top: contentScrollTop,\n behavior: \"auto\",\n });\n }\n onVerticalScrollInSitu?.(0);\n }, [onVerticalScrollInSitu]);\n\n const handleContentContainerScroll = useCallback(() => {\n const { current: scrollbarContainerScrolled } =\n scrollbarContainerScrolledRef;\n const { current: contentContainer } = contentContainerRef;\n const { current: scrollbarContainer } = scrollbarContainerRef;\n const { current: scrollPos } = contentContainerPosRef;\n\n if (contentContainer && scrollbarContainer) {\n const [\n scrollLeft,\n pctScrollLeft,\n maxScrollLeft,\n scrollTop,\n pctScrollTop,\n maxScrollTop,\n ] = getPctScroll(contentContainer);\n\n contentContainerScrolledRef.current = true;\n\n if (scrollbarContainerScrolled) {\n scrollbarContainerScrolledRef.current = false;\n } else {\n scrollbarContainer.scrollLeft = Math.round(\n pctScrollLeft * maxScrollLeft\n );\n scrollbarContainer.scrollTop = pctScrollTop * maxScrollTop;\n }\n\n if (scrollPos.scrollTop !== scrollTop) {\n handleVerticalScroll(scrollTop, pctScrollTop);\n }\n if (scrollPos.scrollLeft !== scrollLeft) {\n handleHorizontalScroll(scrollLeft);\n }\n }\n }, [handleVerticalScroll, handleHorizontalScroll]);\n\n const handleAttachScrollbarContainer = useCallback(\n (el: HTMLDivElement) => {\n scrollbarContainerRef.current = el;\n el.addEventListener(\"scroll\", handleScrollbarContainerScroll, {\n passive: true,\n });\n },\n [handleScrollbarContainerScroll]\n );\n\n const handleDetachScrollbarContainer = useCallback(\n (el: HTMLDivElement) => {\n scrollbarContainerRef.current = null;\n el.removeEventListener(\"scroll\", handleScrollbarContainerScroll);\n },\n [handleScrollbarContainerScroll]\n );\n\n const handleAttachContentContainer = useCallback(\n (el: HTMLDivElement) => {\n contentContainerRef.current = el;\n el.addEventListener(\"scroll\", handleContentContainerScroll, {\n passive: true,\n });\n },\n [handleContentContainerScroll]\n );\n\n const handleDetachContentContainer = useCallback(\n (el: HTMLDivElement) => {\n contentContainerRef.current = null;\n el.removeEventListener(\"scroll\", handleContentContainerScroll);\n },\n [handleContentContainerScroll]\n );\n\n const contentContainerCallbackRef = useCallbackRef({\n onAttach: handleAttachContentContainer,\n onDetach: handleDetachContentContainer,\n });\n\n const scrollbarContainerCallbackRef = useCallbackRef({\n onAttach: handleAttachScrollbarContainer,\n onDetach: handleDetachScrollbarContainer,\n });\n\n const requestScroll: ScrollRequestHandler = useCallback(\n (scrollRequest) => {\n const { current: contentContainer } = contentContainerRef;\n if (contentContainer) {\n const [maxScrollLeft, maxScrollTop] = getMaxScroll(contentContainer);\n const { scrollLeft, scrollTop } = contentContainer;\n contentContainerScrolledRef.current = false;\n if (scrollRequest.type === \"scroll-row\") {\n const activeRow = getRowElementAtIndex(\n contentContainer,\n scrollRequest.rowIndex\n );\n\n if (activeRow !== null) {\n const [direction, distance] = howFarIsRowOutsideViewport(\n activeRow,\n totalHeaderHeight\n );\n console.log(`outside viewport ? ${direction} ${distance}`);\n if (direction && distance) {\n if (isVirtualScroll) {\n const offset = direction === \"down\" ? 1 : -1;\n onVerticalScrollInSitu?.(offset);\n const firstRow = firstRowRef.current + offset;\n firstRowRef.current = firstRow;\n setRange({\n from: firstRow,\n to: firstRow + viewportRowCount,\n });\n } else {\n let newScrollLeft = scrollLeft;\n let newScrollTop = scrollTop;\n if (direction === \"up\" || direction === \"down\") {\n newScrollTop = Math.min(\n Math.max(0, scrollTop + distance),\n maxScrollTop\n );\n } else {\n newScrollLeft = Math.min(\n Math.max(0, scrollLeft + distance),\n maxScrollLeft\n );\n }\n contentContainer.scrollTo({\n top: newScrollTop,\n left: newScrollLeft,\n behavior: \"smooth\",\n });\n }\n }\n }\n } else if (scrollRequest.type === \"scroll-page\") {\n const { direction } = scrollRequest;\n if (isVirtualScroll) {\n const offset =\n direction === \"down\" ? viewportRowCount : -viewportRowCount;\n onVerticalScrollInSitu?.(offset);\n const firstRow = firstRowRef.current + offset;\n firstRowRef.current = firstRow;\n setRange({ from: firstRow, to: firstRow + viewportRowCount });\n } else {\n const scrollBy =\n direction === \"down\" ? appliedPageSize : -appliedPageSize;\n const newScrollTop = Math.min(\n Math.max(0, scrollTop + scrollBy),\n maxScrollTop\n );\n contentContainer.scrollTo({\n top: newScrollTop,\n left: scrollLeft,\n behavior: \"auto\",\n });\n }\n } else if (scrollRequest.type === \"scroll-end\") {\n const { direction } = scrollRequest;\n const scrollTo = direction === \"end\" ? maxScrollTop : 0;\n contentContainer.scrollTo({\n top: scrollTo,\n left: contentContainer.scrollLeft,\n behavior: \"auto\",\n });\n }\n }\n },\n [\n appliedPageSize,\n isVirtualScroll,\n onVerticalScrollInSitu,\n setRange,\n totalHeaderHeight,\n viewportRowCount,\n ]\n );\n\n const scrollHandles: ScrollingAPI = useMemo(\n // TODO not complete yet\n () => ({\n scrollToIndex: (rowIndex: number) => {\n if (scrollbarContainerRef.current) {\n // TODO hardcoded rowHeight\n const scrollPos = (rowIndex - 30) * 20;\n scrollbarContainerRef.current.scrollTop = scrollPos;\n }\n },\n scrollToKey: (rowKey: string) => {\n console.log(`scrollToKey ${rowKey}`);\n },\n }),\n []\n );\n\n useImperativeHandle(\n scrollingApiRef,\n () => {\n if (scrollbarContainerRef.current) {\n return scrollHandles;\n } else {\n return noScrolling;\n }\n },\n [scrollHandles]\n );\n\n useEffect(() => {\n if (rowHeight !== rowHeightRef.current) {\n rowHeightRef.current = rowHeight;\n if (contentContainerPosRef.current.scrollTop > 0) {\n if (contentContainerRef.current) {\n contentContainerRef.current.scrollTop = 0;\n }\n }\n } else {\n const { current: from } = firstRowRef;\n const rowRange = { from, to: from + viewportRowCount };\n setRange(rowRange);\n }\n }, [rowHeight, setRange, viewportRowCount]);\n\n return {\n columnsWithinViewport: columnsWithinViewportRef.current,\n /** Ref to be assigned to ScrollbarContainer */\n scrollbarContainerRef: scrollbarContainerCallbackRef,\n /** Ref to be assigned to ContentContainer */\n contentContainerRef: contentContainerCallbackRef,\n /** Scroll the table */\n requestScroll,\n /** number of leading columns not rendered because of virtualization */\n virtualColSpan: preSpanRef.current,\n };\n};\n"],"names":["useRef","useCallback","useState","useMemo","getColumnsInViewport","itemsChanged","getRowElementAtIndex","howFarIsRowOutsideViewport","useImperativeHandle","useEffect"],"mappings":"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"}
1
+ {"version":3,"file":"useTableScroll.js","sources":["../src/useTableScroll.ts"],"sourcesContent":["import {\n getColumnsInViewport,\n getRowElementAtIndex,\n itemsChanged,\n RowAtPositionFunc,\n} from \"@vuu-ui/vuu-utils\";\nimport type { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n ForwardedRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport type { ViewportMeasurements } from \"./useTableViewport\";\nimport { howFarIsRowOutsideViewport } from \"./table-dom-utils\";\nimport type { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\n\nexport type ScrollDirectionVertical = \"up\" | \"down\";\nexport type ScrollDirectionHorizontal = \"left\" | \"right\";\nexport type ScrollDirection =\n | ScrollDirectionVertical\n | ScrollDirectionHorizontal;\n\n/**\n * scroll into view the row at given index posiiton.\n */\nexport interface ScrollRequestRow {\n rowIndex: number;\n type: \"scroll-row\";\n}\nexport interface ScrollRequestEnd {\n type: \"scroll-end\";\n direction: \"home\" | \"end\";\n}\n\nexport interface ScrollRequestPage {\n type: \"scroll-page\";\n direction: ScrollDirectionVertical;\n}\n\nexport type ScrollRequest =\n | ScrollRequestPage\n | ScrollRequestEnd\n | ScrollRequestRow;\n\nexport type ScrollRequestHandler = (request: ScrollRequest) => void;\n\nexport interface ScrollingAPI {\n scrollToIndex: (itemIndex: number) => void;\n scrollToKey: (rowKey: string) => void;\n}\n\n/** How far we allow horizontal scroll movement before we recheck the rendered columns */\nconst SCROLL_MOVE_CHECK_THRESHOLD = 100;\n\n/** The buffer size in pixels that we allow for rendering columns just outside the viewport */\nconst HORIZONTAL_SCROLL_BUFFER = 200;\n\n/**\n * Return the maximum scroll positions for gioven container\n * @param container\n * @returns [maxScrollLeft, maxScrollTop]\n */\nconst getMaxScroll = (container: HTMLElement) => {\n const { clientHeight, clientWidth, scrollHeight, scrollWidth } = container;\n return [scrollWidth - clientWidth, scrollHeight - clientHeight];\n};\n\nconst getScrollDirection = (\n prevScrollPositions: ScrollPos | undefined,\n scrollPos: number\n) => {\n if (prevScrollPositions === undefined) {\n return undefined;\n } else {\n const { scrollTop: prevTop } = prevScrollPositions;\n return scrollPos > prevTop ? \"fwd\" : \"bwd\";\n }\n};\n\nconst getPctScroll = (container: HTMLElement, currentScrollPos?: ScrollPos) => {\n const {\n clientHeight,\n clientWidth,\n scrollHeight,\n scrollLeft,\n scrollTop,\n scrollWidth,\n } = container;\n\n const maxScrollLeft = scrollWidth - clientWidth;\n const pctScrollLeft = scrollLeft / (scrollWidth - clientWidth);\n const maxScrollTop = scrollHeight - clientHeight;\n let pctScrollTop = scrollTop / (scrollHeight - clientHeight);\n\n const scrollDirection = getScrollDirection(currentScrollPos, scrollTop);\n\n if (scrollDirection === \"fwd\" && pctScrollTop > 0.99) {\n pctScrollTop = 1;\n } else if (scrollDirection === \"bwd\" && pctScrollTop < 0.02) {\n pctScrollTop = 0;\n }\n\n return [\n scrollLeft,\n pctScrollLeft,\n maxScrollLeft,\n scrollTop,\n pctScrollTop,\n maxScrollTop,\n ];\n};\n\nexport const noScrolling: ScrollingAPI = {\n scrollToIndex: () => undefined,\n scrollToKey: () => undefined,\n};\n\ninterface CallbackRefHookProps<T = HTMLElement> {\n onAttach?: (el: T) => void;\n onDetach: (el: T) => void;\n label?: string;\n}\n\nconst useCallbackRef = <T = HTMLElement>({\n onAttach,\n onDetach,\n}: CallbackRefHookProps<T>) => {\n const ref = useRef<T | null>(null);\n const callbackRef = useCallback(\n (el: T | null) => {\n if (el) {\n ref.current = el;\n onAttach?.(el);\n } else if (ref.current) {\n const { current: originalRef } = ref;\n ref.current = el;\n onDetach?.(originalRef);\n }\n },\n [onAttach, onDetach]\n );\n return callbackRef;\n};\n\ntype ScrollPos = {\n scrollLeft: number;\n scrollTop: number;\n};\n\nexport interface TableScrollHookProps {\n columns: RuntimeColumnDescriptor[];\n getRowAtPosition: RowAtPositionFunc;\n onHorizontalScroll?: (scrollLeft: number) => void;\n onVerticalScroll?: (scrollTop: number, pctScrollTop: number) => void;\n /**\n * When we have a virtualized scroll container, keyboard navigation is\n * performed `in situ`. We shift the range of rows rendered within the\n * viewport, whithout actually moving the scroll position\n */\n onVerticalScrollInSitu?: (rowIndexOffsetCount: number) => void;\n rowHeight: number;\n scrollingApiRef?: ForwardedRef<ScrollingAPI>;\n setRange: (range: VuuRange) => void;\n viewportMeasurements: ViewportMeasurements;\n}\n\nexport const useTableScroll = ({\n columns,\n getRowAtPosition,\n onHorizontalScroll,\n onVerticalScroll,\n onVerticalScrollInSitu,\n rowHeight,\n scrollingApiRef,\n setRange,\n viewportMeasurements,\n}: TableScrollHookProps) => {\n const firstRowRef = useRef<number>(0);\n const rowHeightRef = useRef(rowHeight);\n const contentContainerScrolledRef = useRef(false);\n const contentContainerPosRef = useRef<ScrollPos>({\n scrollTop: 0,\n scrollLeft: 0,\n });\n const scrollbarContainerScrolledRef = useRef(false);\n const scrollbarContainerPosRef = useRef<ScrollPos>({\n scrollTop: 0,\n scrollLeft: 0,\n });\n const scrollbarContainerRef = useRef<HTMLDivElement | null>(null);\n const contentContainerRef = useRef<HTMLDivElement | null>(null);\n const lastHorizontalScrollCheckPoint = useRef(0);\n\n const {\n appliedPageSize,\n isVirtualScroll,\n rowCount: viewportRowCount,\n totalHeaderHeight,\n viewportWidth,\n } = viewportMeasurements;\n\n const columnsWithinViewportRef = useRef<RuntimeColumnDescriptor[]>([]);\n const [, forceRefresh] = useState({});\n\n const preSpanRef = useRef(0);\n\n useMemo(() => {\n const [visibleColumns, offset] = getColumnsInViewport(\n columns,\n contentContainerPosRef.current.scrollLeft,\n contentContainerPosRef.current.scrollLeft +\n viewportWidth +\n HORIZONTAL_SCROLL_BUFFER\n );\n preSpanRef.current = offset;\n columnsWithinViewportRef.current = visibleColumns;\n }, [viewportWidth, columns]);\n\n const handleHorizontalScroll = useCallback(\n (scrollLeft: number) => {\n contentContainerPosRef.current.scrollLeft = scrollLeft;\n onHorizontalScroll?.(scrollLeft);\n\n if (\n Math.abs(scrollLeft - lastHorizontalScrollCheckPoint.current) >\n SCROLL_MOVE_CHECK_THRESHOLD\n ) {\n lastHorizontalScrollCheckPoint.current = scrollLeft;\n\n const [visibleColumns, pre] = getColumnsInViewport(\n columns,\n scrollLeft,\n scrollLeft + viewportWidth + HORIZONTAL_SCROLL_BUFFER\n );\n\n if (itemsChanged(columnsWithinViewportRef.current, visibleColumns)) {\n preSpanRef.current = pre;\n columnsWithinViewportRef.current = visibleColumns;\n forceRefresh({});\n }\n }\n },\n [columns, onHorizontalScroll, viewportWidth]\n );\n const handleVerticalScroll = useCallback(\n (scrollTop: number, pctScrollTop: number) => {\n contentContainerPosRef.current.scrollTop = scrollTop;\n\n onVerticalScroll?.(scrollTop, pctScrollTop);\n const firstRow = getRowAtPosition(scrollTop);\n if (firstRow !== firstRowRef.current) {\n firstRowRef.current = firstRow;\n setRange({ from: firstRow, to: firstRow + viewportRowCount });\n }\n onVerticalScrollInSitu?.(0);\n },\n [\n getRowAtPosition,\n onVerticalScroll,\n onVerticalScrollInSitu,\n setRange,\n viewportRowCount,\n ]\n );\n\n const handleScrollbarContainerScroll = useCallback(() => {\n const { current: contentContainer } = contentContainerRef;\n const { current: scrollbarContainer } = scrollbarContainerRef;\n const { current: contentContainerScrolled } = contentContainerScrolledRef;\n const { current: scrollPos } = scrollbarContainerPosRef;\n\n if (contentContainerScrolled) {\n contentContainerScrolledRef.current = false;\n } else if (contentContainer && scrollbarContainer) {\n scrollbarContainerScrolledRef.current = true;\n const [scrollLeft, pctScrollLeft, , scrollTop, pctScrollTop] =\n getPctScroll(scrollbarContainer, scrollPos);\n\n scrollPos.scrollLeft = scrollLeft;\n scrollPos.scrollTop = scrollTop;\n\n const [maxScrollLeft, maxScrollTop] = getMaxScroll(scrollbarContainer);\n const contentScrollLeft = Math.round(pctScrollLeft * maxScrollLeft);\n const contentScrollTop = pctScrollTop * maxScrollTop;\n\n contentContainer.scrollTo({\n left: contentScrollLeft,\n top: contentScrollTop,\n behavior: \"auto\",\n });\n }\n onVerticalScrollInSitu?.(0);\n }, [onVerticalScrollInSitu]);\n\n const handleContentContainerScroll = useCallback(() => {\n const { current: scrollbarContainerScrolled } =\n scrollbarContainerScrolledRef;\n const { current: contentContainer } = contentContainerRef;\n const { current: scrollbarContainer } = scrollbarContainerRef;\n const { current: scrollPos } = contentContainerPosRef;\n\n if (contentContainer && scrollbarContainer) {\n const [\n scrollLeft,\n pctScrollLeft,\n maxScrollLeft,\n scrollTop,\n pctScrollTop,\n maxScrollTop,\n ] = getPctScroll(contentContainer);\n\n contentContainerScrolledRef.current = true;\n\n if (scrollbarContainerScrolled) {\n scrollbarContainerScrolledRef.current = false;\n } else {\n scrollbarContainer.scrollLeft = Math.round(\n pctScrollLeft * maxScrollLeft\n );\n scrollbarContainer.scrollTop = pctScrollTop * maxScrollTop;\n }\n\n if (scrollPos.scrollTop !== scrollTop) {\n handleVerticalScroll(scrollTop, pctScrollTop);\n }\n if (scrollPos.scrollLeft !== scrollLeft) {\n handleHorizontalScroll(scrollLeft);\n }\n }\n }, [handleVerticalScroll, handleHorizontalScroll]);\n\n const handleAttachScrollbarContainer = useCallback(\n (el: HTMLDivElement) => {\n scrollbarContainerRef.current = el;\n el.addEventListener(\"scroll\", handleScrollbarContainerScroll, {\n passive: true,\n });\n },\n [handleScrollbarContainerScroll]\n );\n\n const handleDetachScrollbarContainer = useCallback(\n (el: HTMLDivElement) => {\n scrollbarContainerRef.current = null;\n el.removeEventListener(\"scroll\", handleScrollbarContainerScroll);\n },\n [handleScrollbarContainerScroll]\n );\n\n const handleAttachContentContainer = useCallback(\n (el: HTMLDivElement) => {\n contentContainerRef.current = el;\n el.addEventListener(\"scroll\", handleContentContainerScroll, {\n passive: true,\n });\n },\n [handleContentContainerScroll]\n );\n\n const handleDetachContentContainer = useCallback(\n (el: HTMLDivElement) => {\n contentContainerRef.current = null;\n el.removeEventListener(\"scroll\", handleContentContainerScroll);\n },\n [handleContentContainerScroll]\n );\n\n const contentContainerCallbackRef = useCallbackRef({\n onAttach: handleAttachContentContainer,\n onDetach: handleDetachContentContainer,\n });\n\n const scrollbarContainerCallbackRef = useCallbackRef({\n onAttach: handleAttachScrollbarContainer,\n onDetach: handleDetachScrollbarContainer,\n });\n\n const requestScroll: ScrollRequestHandler = useCallback(\n (scrollRequest) => {\n const { current: contentContainer } = contentContainerRef;\n if (contentContainer) {\n const [maxScrollLeft, maxScrollTop] = getMaxScroll(contentContainer);\n const { scrollLeft, scrollTop } = contentContainer;\n contentContainerScrolledRef.current = false;\n if (scrollRequest.type === \"scroll-row\") {\n const activeRow = getRowElementAtIndex(\n contentContainer,\n scrollRequest.rowIndex\n );\n\n if (activeRow !== null) {\n const [direction, distance] = howFarIsRowOutsideViewport(\n activeRow,\n totalHeaderHeight\n );\n if (direction && distance) {\n if (isVirtualScroll) {\n const offset = direction === \"down\" ? 1 : -1;\n onVerticalScrollInSitu?.(offset);\n const firstRow = firstRowRef.current + offset;\n firstRowRef.current = firstRow;\n setRange({\n from: firstRow,\n to: firstRow + viewportRowCount,\n });\n } else {\n let newScrollLeft = scrollLeft;\n let newScrollTop = scrollTop;\n if (direction === \"up\" || direction === \"down\") {\n newScrollTop = Math.min(\n Math.max(0, scrollTop + distance),\n maxScrollTop\n );\n } else {\n newScrollLeft = Math.min(\n Math.max(0, scrollLeft + distance),\n maxScrollLeft\n );\n }\n contentContainer.scrollTo({\n top: newScrollTop,\n left: newScrollLeft,\n behavior: \"smooth\",\n });\n }\n }\n }\n } else if (scrollRequest.type === \"scroll-page\") {\n const { direction } = scrollRequest;\n if (isVirtualScroll) {\n const offset =\n direction === \"down\" ? viewportRowCount : -viewportRowCount;\n onVerticalScrollInSitu?.(offset);\n const firstRow = firstRowRef.current + offset;\n firstRowRef.current = firstRow;\n setRange({ from: firstRow, to: firstRow + viewportRowCount });\n } else {\n const scrollBy =\n direction === \"down\" ? appliedPageSize : -appliedPageSize;\n const newScrollTop = Math.min(\n Math.max(0, scrollTop + scrollBy),\n maxScrollTop\n );\n contentContainer.scrollTo({\n top: newScrollTop,\n left: scrollLeft,\n behavior: \"auto\",\n });\n }\n } else if (scrollRequest.type === \"scroll-end\") {\n const { direction } = scrollRequest;\n const scrollTo = direction === \"end\" ? maxScrollTop : 0;\n contentContainer.scrollTo({\n top: scrollTo,\n left: contentContainer.scrollLeft,\n behavior: \"auto\",\n });\n }\n }\n },\n [\n appliedPageSize,\n isVirtualScroll,\n onVerticalScrollInSitu,\n setRange,\n totalHeaderHeight,\n viewportRowCount,\n ]\n );\n\n const scrollHandles: ScrollingAPI = useMemo(\n // TODO not complete yet\n () => ({\n scrollToIndex: (rowIndex: number) => {\n if (scrollbarContainerRef.current) {\n // TODO hardcoded rowHeight\n const scrollPos = (rowIndex - 30) * 20;\n scrollbarContainerRef.current.scrollTop = scrollPos;\n }\n },\n scrollToKey: (rowKey: string) => {\n console.log(`scrollToKey ${rowKey}`);\n },\n }),\n []\n );\n\n useImperativeHandle(\n scrollingApiRef,\n () => {\n if (scrollbarContainerRef.current) {\n return scrollHandles;\n } else {\n return noScrolling;\n }\n },\n [scrollHandles]\n );\n\n useEffect(() => {\n if (rowHeight !== rowHeightRef.current) {\n rowHeightRef.current = rowHeight;\n if (contentContainerPosRef.current.scrollTop > 0) {\n if (contentContainerRef.current) {\n contentContainerRef.current.scrollTop = 0;\n }\n }\n } else {\n const { current: from } = firstRowRef;\n const rowRange = { from, to: from + viewportRowCount };\n setRange(rowRange);\n }\n }, [rowHeight, setRange, viewportRowCount]);\n\n return {\n columnsWithinViewport: columnsWithinViewportRef.current,\n /** Ref to be assigned to ScrollbarContainer */\n scrollbarContainerRef: scrollbarContainerCallbackRef,\n /** Ref to be assigned to ContentContainer */\n contentContainerRef: contentContainerCallbackRef,\n /** Scroll the table */\n requestScroll,\n /** number of leading columns not rendered because of virtualization */\n virtualColSpan: preSpanRef.current,\n };\n};\n"],"names":["useRef","useCallback","useState","useMemo","getColumnsInViewport","itemsChanged","getRowElementAtIndex","howFarIsRowOutsideViewport","useImperativeHandle","useEffect"],"mappings":"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"}
@@ -0,0 +1,4 @@
1
+ var bulkEditPanelCss = ".vuuBulkEditPanel{\n display: flex;\n flex-direction: column;\n}\n.vuuBulkEditPanel-table {\n align-items: center;\n flex: 1 1 auto;\n padding: 10px;\n}\n.vuuBulkEditPanel-buttonBar {\n align-items: center;\n display: flex;\n flex: 0 0 36px;\n justify-content: flex-end;\n gap: var(--salt-spacing-100);\n}";
2
+
3
+ export { bulkEditPanelCss as default };
4
+ //# sourceMappingURL=BulkEditPanel.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"BulkEditPanel.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}