@economic/taco 2.44.3 → 2.44.5-create.10

Sign up to get free protection for your applications and to get access to all the features.
Files changed (101) hide show
  1. package/dist/components/Provider/Localization.d.ts +2 -0
  2. package/dist/components/Report/Report.d.ts +1 -1
  3. package/dist/components/Table3/Table3.d.ts +2 -14
  4. package/dist/components/Table3/components/Columns/Internal/EditingActionsMenu.d.ts +1 -2
  5. package/dist/components/Table3/components/Editing/DiscardChangesConfirmationDialog.d.ts +7 -0
  6. package/dist/components/Table3/components/Row/Editing/CreateNewRow.d.ts +14 -0
  7. package/dist/components/Table3/components/Row/Editing/TemporaryRow.d.ts +11 -0
  8. package/dist/components/Table3/features/useEditingState.d.ts +28 -0
  9. package/dist/components/Table3/features/useTableEditing.d.ts +25 -36
  10. package/dist/components/Table3/listeners/useTableEditingListener.d.ts +1 -1
  11. package/dist/components/Table3/types.d.ts +23 -8
  12. package/dist/components/Table3/useTable3.d.ts +6 -0
  13. package/dist/components/Table3/util/editing.d.ts +7 -1
  14. package/dist/esm/index.css +28 -4
  15. package/dist/esm/node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js +17 -17
  16. package/dist/esm/node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js.map +1 -1
  17. package/dist/esm/packages/taco/src/components/ModeSwitch/ModeSwitch.js +2 -2
  18. package/dist/esm/packages/taco/src/components/ModeSwitch/ModeSwitch.js.map +1 -1
  19. package/dist/esm/packages/taco/src/components/Provider/Localization.js +5 -3
  20. package/dist/esm/packages/taco/src/components/Provider/Localization.js.map +1 -1
  21. package/dist/esm/packages/taco/src/components/Switch/Switch.js +1 -1
  22. package/dist/esm/packages/taco/src/components/Switch/Switch.js.map +1 -1
  23. package/dist/esm/packages/taco/src/components/Table3/Table3.js +20 -7
  24. package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
  25. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/Editing/RowMoveIndicator.js +1 -2
  26. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/Editing/RowMoveIndicator.js.map +1 -1
  27. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js +25 -11
  28. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js.map +1 -1
  29. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js +5 -37
  30. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js.map +1 -1
  31. package/dist/esm/packages/taco/src/components/Table3/components/Editing/Alert.js +17 -12
  32. package/dist/esm/packages/taco/src/components/Table3/components/Editing/Alert.js.map +1 -1
  33. package/dist/esm/packages/taco/src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.js +34 -0
  34. package/dist/esm/packages/taco/src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.js.map +1 -0
  35. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateNewRow.js +82 -0
  36. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateNewRow.js.map +1 -0
  37. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/SaveStatus.js +2 -14
  38. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/SaveStatus.js.map +1 -1
  39. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js +95 -0
  40. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js.map +1 -0
  41. package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js +39 -6
  42. package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js.map +1 -1
  43. package/dist/esm/packages/taco/src/components/Table3/components/Toolbar/Editing/Editing.js +4 -17
  44. package/dist/esm/packages/taco/src/components/Table3/components/Toolbar/Editing/Editing.js.map +1 -1
  45. package/dist/esm/packages/taco/src/components/Table3/features/useEditingState.js +512 -0
  46. package/dist/esm/packages/taco/src/components/Table3/features/useEditingState.js.map +1 -0
  47. package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js +29 -406
  48. package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js.map +1 -1
  49. package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js +44 -33
  50. package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js.map +1 -1
  51. package/dist/esm/packages/taco/src/components/Table3/useTable3.js +26 -9
  52. package/dist/esm/packages/taco/src/components/Table3/useTable3.js.map +1 -1
  53. package/dist/esm/packages/taco/src/components/Table3/util/editing.js +13 -23
  54. package/dist/esm/packages/taco/src/components/Table3/util/editing.js.map +1 -1
  55. package/dist/esm/packages/taco/src/primitives/Collection/components/Root.js +18 -0
  56. package/dist/esm/packages/taco/src/primitives/Collection/components/Root.js.map +1 -1
  57. package/dist/esm/packages/taco/src/primitives/Listbox2/components/Option.js +0 -1
  58. package/dist/esm/packages/taco/src/primitives/Listbox2/components/Option.js.map +1 -1
  59. package/dist/esm/packages/taco/src/primitives/Listbox2/components/Root.js +1 -0
  60. package/dist/esm/packages/taco/src/primitives/Listbox2/components/Root.js.map +1 -1
  61. package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js +3 -4
  62. package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js.map +1 -1
  63. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Cell/BuiltIns/GroupedCell.js +9 -3
  64. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Cell/BuiltIns/GroupedCell.js.map +1 -1
  65. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js +6 -3
  66. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js.map +1 -1
  67. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Footer/Footer.js +1 -1
  68. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Footer/Footer.js.map +1 -1
  69. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/BuiltIns/DisplayRow.js +1 -1
  70. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/BuiltIns/DisplayRow.js.map +1 -1
  71. package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableRenderer.js +25 -7
  72. package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableRenderer.js.map +1 -1
  73. package/dist/esm/packages/taco/src/primitives/Table/Core/useTable.js +2 -2
  74. package/dist/esm/packages/taco/src/primitives/Table/Core/useTable.js.map +1 -1
  75. package/dist/esm/packages/taco/src/primitives/Table/types.js.map +1 -1
  76. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js +1 -1
  77. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js.map +1 -1
  78. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js +11 -0
  79. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js.map +1 -1
  80. package/dist/esm/packages/taco/src/utils/dom.js +7 -4
  81. package/dist/esm/packages/taco/src/utils/dom.js.map +1 -1
  82. package/dist/index.css +28 -4
  83. package/dist/primitives/Collection/components/Root.d.ts +2 -0
  84. package/dist/primitives/Table/Core/Table.d.ts +1 -0
  85. package/dist/primitives/Table/Core/components/Columns/Internal/Actions.d.ts +3 -1
  86. package/dist/primitives/Table/Core/components/Footer/Footer.d.ts +2 -2
  87. package/dist/primitives/Table/Core/features/useTableRenderer.d.ts +2 -2
  88. package/dist/primitives/Table/Core/features/useTableStyle.d.ts +1 -1
  89. package/dist/primitives/Table/Core/types.d.ts +3 -0
  90. package/dist/primitives/Table/Core/useTable.d.ts +2 -2
  91. package/dist/primitives/Table/types.d.ts +1 -1
  92. package/dist/primitives/Table/useTableManager/useTableManager.d.ts +1 -1
  93. package/dist/taco.cjs.development.js +983 -668
  94. package/dist/taco.cjs.development.js.map +1 -1
  95. package/dist/taco.cjs.production.min.js +1 -1
  96. package/dist/taco.cjs.production.min.js.map +1 -1
  97. package/dist/utils/dom.d.ts +1 -0
  98. package/package.json +3 -5
  99. package/dist/components/Table3/components/Row/Editing/CreateRowButton.d.ts +0 -11
  100. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js +0 -90
  101. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js.map +0 -1
@@ -1,17 +1,14 @@
1
1
  import React__default from 'react';
2
2
  import { IconButton } from '../../../../IconButton/IconButton.js';
3
3
  import { useLocalization } from '../../../../Provider/Localization.js';
4
- import { Button } from '../../../../Button/Button.js';
5
- import { Dialog } from '../../../../Dialog/Dialog.js';
6
- import { Group } from '../../../../Group/Group.js';
7
4
  import { Menu } from '../../../../Menu/Menu.js';
5
+ import { DiscardChangesConfirmationDialog } from '../../Editing/DiscardChangesConfirmationDialog.js';
8
6
 
9
7
  function EditingActionMenu(props) {
10
8
  const {
11
9
  hasChanges,
12
10
  hasErrors,
13
- onClear: handleClear,
14
- onExit: handleExit,
11
+ onDiscard: handleDiscard,
15
12
  onEditingSave: handleSave,
16
13
  isLastRow
17
14
  } = props;
@@ -33,7 +30,6 @@ function EditingActionMenu(props) {
33
30
  return /*#__PURE__*/React__default.createElement(IconButton, {
34
31
  appearance: "transparent",
35
32
  "aria-label": texts.table3.editing.actions.tooltip,
36
- className: "group-[[data-row-editing-status]]/row:hidden",
37
33
  icon: "more",
38
34
  onKeyDown: handleKeyDown,
39
35
  menu: menuProps => (/*#__PURE__*/React__default.createElement(Menu, Object.assign({}, menuProps), /*#__PURE__*/React__default.createElement(Menu.Content, {
@@ -45,40 +41,12 @@ function EditingActionMenu(props) {
45
41
  }, texts.table3.editing.actions.save), /*#__PURE__*/React__default.createElement(Menu.Item, {
46
42
  icon: "close",
47
43
  disabled: !hasChanges,
48
- dialog: props => /*#__PURE__*/React__default.createElement(ConfirmClearChangesDialog, Object.assign({}, props, {
49
- onClear: handleClear
44
+ dialog: props => /*#__PURE__*/React__default.createElement(DiscardChangesConfirmationDialog, Object.assign({}, props, {
45
+ onDiscard: handleDiscard
50
46
  }))
51
- }, texts.table3.editing.actions.clear), /*#__PURE__*/React__default.createElement(Menu.Item, {
52
- icon: "undo",
53
- onClick: handleExit
54
- }, texts.table3.editing.actions.exit))))
47
+ }, texts.table3.editing.actions.clear))))
55
48
  });
56
49
  }
57
- function ConfirmClearChangesDialog(props) {
58
- const {
59
- onClear: handleClear,
60
- ...dialogProps
61
- } = props;
62
- const {
63
- texts
64
- } = useLocalization();
65
- const handleClickInsideDialogContent = event => {
66
- // Prevents the click event from propagating to the table, ensuring the row isn't saved when a click occurs
67
- // inside the dialog
68
- event.stopPropagation();
69
- };
70
- return /*#__PURE__*/React__default.createElement(Dialog, Object.assign({}, dialogProps), /*#__PURE__*/React__default.createElement(Dialog.Content, {
71
- "aria-label": texts.table3.editing.clearChangesConfirmationDialog.title,
72
- onClick: handleClickInsideDialogContent
73
- }, /*#__PURE__*/React__default.createElement(Dialog.Title, null, texts.table3.editing.clearChangesConfirmationDialog.title), /*#__PURE__*/React__default.createElement("p", null, texts.table3.editing.clearChangesConfirmationDialog.description), /*#__PURE__*/React__default.createElement(Dialog.Footer, null, /*#__PURE__*/React__default.createElement(Group, null, /*#__PURE__*/React__default.createElement(Dialog.Close, null, /*#__PURE__*/React__default.createElement(Button, {
74
- tabIndex: 0
75
- }, texts.table3.editing.clearChangesConfirmationDialog.cancel)), /*#__PURE__*/React__default.createElement(Dialog.Close, null, /*#__PURE__*/React__default.createElement(Button, {
76
- autoFocus: true,
77
- tabIndex: 0,
78
- appearance: "primary",
79
- onClick: handleClear
80
- }, texts.table3.editing.clearChangesConfirmationDialog.confirm))))));
81
- }
82
50
 
83
51
  export { EditingActionMenu };
84
52
  //# sourceMappingURL=EditingActionsMenu.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"EditingActionsMenu.js","sources":["../../../../../../../../../../src/components/Table3/components/Columns/Internal/EditingActionsMenu.tsx"],"sourcesContent":["import React from 'react';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { Menu } from '../../../../Menu/Menu';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Dialog, DialogProps } from '../../../../Dialog/Dialog';\nimport { Group } from '../../../../Group/Group';\nimport { Button } from '../../../../Button/Button';\n\ntype EditingActionMenuProps = {\n hasChanges: boolean;\n hasErrors: boolean;\n onClear: () => void;\n onExit: () => void;\n onEditingSave: () => Promise<void>;\n isLastRow: boolean;\n};\n\nexport function EditingActionMenu(props: EditingActionMenuProps) {\n const { hasChanges, hasErrors, onClear: handleClear, onExit: handleExit, onEditingSave: handleSave, isLastRow } = props;\n const { texts } = useLocalization();\n\n const handleKeyDown = event => {\n // normally we handle this on change of active row, but when tabbing out of the last row the active row state stays on the last one.\n if (isLastRow && hasChanges && event.key === 'Tab') {\n handleSave();\n }\n };\n\n const handleMenuContentKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n // Stops the keyboard event from propagating to the Table when EditActionsMenu is open\n if (event.key === 'ArrowLeft' || event.key === 'ArrowRight') {\n event.stopPropagation();\n }\n };\n\n return (\n <IconButton\n appearance=\"transparent\"\n aria-label={texts.table3.editing.actions.tooltip}\n className=\"group-[[data-row-editing-status]]/row:hidden\"\n icon=\"more\"\n onKeyDown={handleKeyDown}\n menu={menuProps => (\n <Menu {...menuProps}>\n <Menu.Content onKeyDown={handleMenuContentKeyDown}>\n <Menu.Item icon=\"tick\" disabled={!hasChanges || hasErrors} onClick={handleSave}>\n {texts.table3.editing.actions.save}\n </Menu.Item>\n <Menu.Item\n icon=\"close\"\n disabled={!hasChanges}\n dialog={props => <ConfirmClearChangesDialog {...props} onClear={handleClear} />}>\n {texts.table3.editing.actions.clear}\n </Menu.Item>\n <Menu.Item icon=\"undo\" onClick={handleExit}>\n {texts.table3.editing.actions.exit}\n </Menu.Item>\n </Menu.Content>\n </Menu>\n )}\n />\n );\n}\n\ntype ConfirmClearChangesDialogProps = Partial<DialogProps> & {\n onClear: () => void;\n};\n\nfunction ConfirmClearChangesDialog(props: ConfirmClearChangesDialogProps) {\n const { onClear: handleClear, ...dialogProps } = props;\n const { texts } = useLocalization();\n\n const handleClickInsideDialogContent = (event: React.MouseEvent) => {\n // Prevents the click event from propagating to the table, ensuring the row isn't saved when a click occurs\n // inside the dialog\n event.stopPropagation();\n };\n\n return (\n <Dialog {...dialogProps}>\n <Dialog.Content\n aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}\n onClick={handleClickInsideDialogContent}>\n <Dialog.Title>{texts.table3.editing.clearChangesConfirmationDialog.title}</Dialog.Title>\n\n <p>{texts.table3.editing.clearChangesConfirmationDialog.description}</p>\n\n <Dialog.Footer>\n <Group>\n <Dialog.Close>\n <Button tabIndex={0}>{texts.table3.editing.clearChangesConfirmationDialog.cancel}</Button>\n </Dialog.Close>\n <Dialog.Close>\n <Button autoFocus tabIndex={0} appearance=\"primary\" onClick={handleClear}>\n {texts.table3.editing.clearChangesConfirmationDialog.confirm}\n </Button>\n </Dialog.Close>\n </Group>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog>\n );\n}\n"],"names":["EditingActionMenu","props","hasChanges","hasErrors","onClear","handleClear","onExit","handleExit","onEditingSave","handleSave","isLastRow","texts","useLocalization","handleKeyDown","event","key","handleMenuContentKeyDown","stopPropagation","React","IconButton","appearance","table3","editing","actions","tooltip","className","icon","onKeyDown","menu","menuProps","Menu","Content","Item","disabled","onClick","save","dialog","ConfirmClearChangesDialog","clear","exit","dialogProps","handleClickInsideDialogContent","Dialog","clearChangesConfirmationDialog","title","Title","description","Footer","Group","Close","Button","tabIndex","cancel","autoFocus","confirm"],"mappings":"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"}
1
+ {"version":3,"file":"EditingActionsMenu.js","sources":["../../../../../../../../../../src/components/Table3/components/Columns/Internal/EditingActionsMenu.tsx"],"sourcesContent":["import React from 'react';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { Menu } from '../../../../Menu/Menu';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { DiscardChangesConfirmationDialog } from '../../Editing/DiscardChangesConfirmationDialog';\n\ntype EditingActionMenuProps = {\n hasChanges: boolean;\n hasErrors: boolean;\n onDiscard: () => void;\n onEditingSave: () => Promise<void>;\n isLastRow: boolean;\n};\n\nexport function EditingActionMenu(props: EditingActionMenuProps) {\n const { hasChanges, hasErrors, onDiscard: handleDiscard, onEditingSave: handleSave, isLastRow } = props;\n const { texts } = useLocalization();\n\n const handleKeyDown = event => {\n // normally we handle this on change of active row, but when tabbing out of the last row the active row state stays on the last one.\n if (isLastRow && hasChanges && event.key === 'Tab') {\n handleSave();\n }\n };\n\n const handleMenuContentKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n // Stops the keyboard event from propagating to the Table when EditActionsMenu is open\n if (event.key === 'ArrowLeft' || event.key === 'ArrowRight') {\n event.stopPropagation();\n }\n };\n\n return (\n <IconButton\n appearance=\"transparent\"\n aria-label={texts.table3.editing.actions.tooltip}\n icon=\"more\"\n onKeyDown={handleKeyDown}\n menu={menuProps => (\n <Menu {...menuProps}>\n <Menu.Content onKeyDown={handleMenuContentKeyDown}>\n <Menu.Item icon=\"tick\" disabled={!hasChanges || hasErrors} onClick={handleSave}>\n {texts.table3.editing.actions.save}\n </Menu.Item>\n <Menu.Item\n icon=\"close\"\n disabled={!hasChanges}\n dialog={props => <DiscardChangesConfirmationDialog {...props} onDiscard={handleDiscard} />}>\n {texts.table3.editing.actions.clear}\n </Menu.Item>\n </Menu.Content>\n </Menu>\n )}\n />\n );\n}\n"],"names":["EditingActionMenu","props","hasChanges","hasErrors","onDiscard","handleDiscard","onEditingSave","handleSave","isLastRow","texts","useLocalization","handleKeyDown","event","key","handleMenuContentKeyDown","stopPropagation","React","IconButton","appearance","table3","editing","actions","tooltip","icon","onKeyDown","menu","menuProps","Menu","Content","Item","disabled","onClick","save","dialog","DiscardChangesConfirmationDialog","clear"],"mappings":";;;;;;SAcgBA,iBAAiBA,CAACC,KAA6B;EAC3D,MAAM;IAAEC,UAAU;IAAEC,SAAS;IAAEC,SAAS,EAAEC,aAAa;IAAEC,aAAa,EAAEC,UAAU;IAAEC;GAAW,GAAGP,KAAK;EACvG,MAAM;IAAEQ;GAAO,GAAGC,eAAe,EAAE;EAEnC,MAAMC,aAAa,GAAGC,KAAK;;IAEvB,IAAIJ,SAAS,IAAIN,UAAU,IAAIU,KAAK,CAACC,GAAG,KAAK,KAAK,EAAE;MAChDN,UAAU,EAAE;;GAEnB;EAED,MAAMO,wBAAwB,GAAIF,KAA0C;;IAExE,IAAIA,KAAK,CAACC,GAAG,KAAK,WAAW,IAAID,KAAK,CAACC,GAAG,KAAK,YAAY,EAAE;MACzDD,KAAK,CAACG,eAAe,EAAE;;GAE9B;EAED,oBACIC,6BAACC,UAAU;IACPC,UAAU,EAAC,aAAa;kBACZT,KAAK,CAACU,MAAM,CAACC,OAAO,CAACC,OAAO,CAACC,OAAO;IAChDC,IAAI,EAAC,MAAM;IACXC,SAAS,EAAEb,aAAa;IACxBc,IAAI,EAAEC,SAAS,kBACXV,6BAACW,IAAI,oBAAKD,SAAS,gBACfV,6BAACW,IAAI,CAACC,OAAO;MAACJ,SAAS,EAAEV;oBACrBE,6BAACW,IAAI,CAACE,IAAI;MAACN,IAAI,EAAC,MAAM;MAACO,QAAQ,EAAE,CAAC5B,UAAU,IAAIC,SAAS;MAAE4B,OAAO,EAAExB;OAC/DE,KAAK,CAACU,MAAM,CAACC,OAAO,CAACC,OAAO,CAACW,IAAI,CAC1B,eACZhB,6BAACW,IAAI,CAACE,IAAI;MACNN,IAAI,EAAC,OAAO;MACZO,QAAQ,EAAE,CAAC5B,UAAU;MACrB+B,MAAM,EAAEhC,KAAK,iBAAIe,6BAACkB,gCAAgC,oBAAKjC,KAAK;QAAEG,SAAS,EAAEC;;OACxEI,KAAK,CAACU,MAAM,CAACC,OAAO,CAACC,OAAO,CAACc,KAAK,CAC3B,CACD,CACZ;IAEb;AAEV;;;;"}
@@ -19,7 +19,7 @@ function Alert(props) {
19
19
  const validationTexts = texts.table3.editing.validation;
20
20
  const tableMeta = table.options.meta;
21
21
  const [showFilterResetDialog, setShowFilterResetDialog] = React__default.useState(false);
22
- const pendingChangesWithErrors = tableMeta.editing.getAlertErrors();
22
+ const pendingChangesWithErrors = tableMeta.editing.getErrorsShownInAlert();
23
23
  function scrollToRow(rowIndex) {
24
24
  tableMeta.rowActive.setRowActiveIndex(rowIndex);
25
25
  scrollToIndex(rowIndex, {
@@ -38,38 +38,43 @@ function Alert(props) {
38
38
  const title = (pendingChangesWithErrors.length === 1 ? validationTexts.alert.titleOne : validationTexts.alert.titlePlural).replace('[COUNT]', String(pendingChangesWithErrors.length));
39
39
  // generate links to each invalid row, to go into the error message
40
40
  const links = [];
41
- const rowIdentityColumn = tableMeta.rowIdentityColumnId ? table.getColumn(tableMeta.rowIdentityColumnId) : undefined;
42
- pendingChangesWithErrors.forEach((error, index) => {
41
+ const visibleColumns = table.getVisibleFlatColumns().map(c => c.id);
42
+ const rowIdentityColumn = tableMeta.rowIdentityAccessor && visibleColumns.includes(String(tableMeta.rowIdentityAccessor)) ? table.getColumn(String(tableMeta.rowIdentityAccessor)) : undefined;
43
+ pendingChangesWithErrors.forEach((pendingChangeWithError, index) => {
43
44
  // if appropriate, concatenate the item with the text "and"
44
45
  if (pendingChangesWithErrors.length > 1 && index === pendingChangesWithErrors.length - 1) {
45
46
  // Add space before and after `messageAnd` text
46
47
  links.push(` ${validationTexts.alert.messageAnd} `);
47
48
  }
48
- const rowIndex = table.getRowModel().rows.findIndex(row => row.id === error.rowId);
49
+ const rowIndex = table.getRowModel().rows.findIndex(row => row.id === pendingChangeWithError.rowId);
49
50
  const handleClick = () => {
51
+ // if row is visible
50
52
  if (rowIndex > -1) {
51
53
  scrollToRow(rowIndex);
52
- } else {
53
- setShowFilterResetDialog(error.rowId);
54
+ }
55
+ // if row is filtered out
56
+ else {
57
+ setShowFilterResetDialog(pendingChangeWithError.rowId);
54
58
  }
55
59
  };
56
60
  let tooltip;
57
- if (error.pendingChange._meta.errors.row) {
58
- tooltip = error.pendingChange._meta.errors.row;
61
+ if (pendingChangeWithError.errors.row) {
62
+ tooltip = pendingChangeWithError.errors.row;
59
63
  } else {
60
64
  var _table$getAllColumns$, _table$getAllColumns$2;
61
- const firstCellErrorColumnId = Object.keys(error.pendingChange._meta.errors.cells)[0];
65
+ const firstCellErrorColumnId = Object.keys(pendingChangeWithError.errors.cells)[0];
62
66
  const columnName = (_table$getAllColumns$ = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)) === null || _table$getAllColumns$ === void 0 ? void 0 : (_table$getAllColumns$2 = _table$getAllColumns$.columnDef.meta) === null || _table$getAllColumns$2 === void 0 ? void 0 : _table$getAllColumns$2.header;
63
- tooltip = `${columnName}: ${error.pendingChange._meta.errors.cells[firstCellErrorColumnId]}`;
67
+ tooltip = `${columnName}: ${pendingChangeWithError.errors.cells[firstCellErrorColumnId]}`;
64
68
  }
69
+ const row = table.getRow(pendingChangeWithError.rowId).original;
65
70
  links.push(/*#__PURE__*/React__default.createElement(Tooltip, {
66
- key: error.rowId,
71
+ key: pendingChangeWithError.rowId,
67
72
  title: tooltip
68
73
  }, /*#__PURE__*/React__default.createElement("span", {
69
74
  className: "text-blue",
70
75
  onClick: handleClick,
71
76
  role: "button"
72
- }, rowIdentityColumn ? error.pendingChange._meta.original[rowIdentityColumn.id] : rowIndex + 1)));
77
+ }, rowIdentityColumn ? row[rowIdentityColumn.id] : rowIndex + 1)));
73
78
  // if appropriate, concatenate the item with the text ","
74
79
  if (pendingChangesWithErrors.length > 2 && index < pendingChangesWithErrors.length - 2) {
75
80
  links.push(', ');
@@ -1 +1 @@
1
- {"version":3,"file":"Alert.js","sources":["../../../../../../../../../src/components/Table3/components/Editing/Alert.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { ScrollToOptions as ReactVirtualScrollToOptions } from '@tanstack/react-virtual';\nimport { Alert as BaseAlert, AlertProps as BaseAlertProps } from '../../../Alert/Alert';\nimport { TableRef } from '../../../../primitives/Table/types';\nimport { Tooltip } from '../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { Group } from '../../../Group/Group';\nimport { Button } from '../../../Button/Button';\n\ntype AlertProps<TType = unknown> = Omit<BaseAlertProps, 'children'> & {\n scrollToIndex: (index: number, options: ReactVirtualScrollToOptions) => void;\n table: ReactTable<TType>;\n tableRef: React.RefObject<TableRef>;\n};\n\nexport function Alert<TType = unknown>(props: AlertProps<TType>) {\n const { scrollToIndex, table, tableRef, ...attributes } = props;\n const { texts } = useLocalization();\n const validationTexts = texts.table3.editing.validation;\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const [showFilterResetDialog, setShowFilterResetDialog] = React.useState<string | false>(false);\n const pendingChangesWithErrors = tableMeta.editing.getAlertErrors<TType>();\n\n function scrollToRow(rowIndex: number) {\n tableMeta.rowActive.setRowActiveIndex(rowIndex);\n scrollToIndex(rowIndex, { align: 'center' });\n\n requestAnimationFrame(() => {\n const cell = tableRef.current?.querySelector(\n 'tbody > tr[data-row-active=\"true\"] > td[data-cell-editing-invalid=\"true\"]'\n );\n\n if (cell) {\n (cell as HTMLElement).focus?.();\n }\n });\n }\n\n // generate the \"N unsaved entries\" title\n const title = (\n pendingChangesWithErrors.length === 1 ? validationTexts.alert.titleOne : validationTexts.alert.titlePlural\n ).replace('[COUNT]', String(pendingChangesWithErrors.length));\n\n // generate links to each invalid row, to go into the error message\n const links: React.ReactNode[] = [];\n const rowIdentityColumn = tableMeta.rowIdentityColumnId ? table.getColumn(tableMeta.rowIdentityColumnId) : undefined;\n\n pendingChangesWithErrors.forEach((error, index) => {\n // if appropriate, concatenate the item with the text \"and\"\n if (pendingChangesWithErrors.length > 1 && index === pendingChangesWithErrors.length - 1) {\n // Add space before and after `messageAnd` text\n links.push(` ${validationTexts.alert.messageAnd} `);\n }\n const rowIndex = table.getRowModel().rows.findIndex(row => row.id === error.rowId);\n\n const handleClick = () => {\n if (rowIndex > -1) {\n scrollToRow(rowIndex);\n } else {\n setShowFilterResetDialog(error.rowId);\n }\n };\n\n let tooltip;\n\n if (error.pendingChange._meta.errors.row) {\n tooltip = error.pendingChange._meta.errors.row;\n } else {\n const firstCellErrorColumnId = Object.keys(error.pendingChange._meta.errors.cells)[0];\n const columnName = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)?.columnDef.meta?.header;\n tooltip = `${columnName}: ${error.pendingChange._meta.errors.cells[firstCellErrorColumnId]}`;\n }\n\n links.push(\n <Tooltip key={error.rowId} title={tooltip}>\n <span className=\"text-blue\" onClick={handleClick} role=\"button\">\n {rowIdentityColumn ? error.pendingChange._meta.original[rowIdentityColumn.id] : rowIndex + 1}\n </span>\n </Tooltip>\n );\n\n // if appropriate, concatenate the item with the text \",\"\n if (pendingChangesWithErrors.length > 2 && index < pendingChangesWithErrors.length - 2) {\n links.push(', ');\n }\n });\n\n // generate the \"Row N is incomplete and hasn't been saved\" error message\n const message = (links.length === 1 ? validationTexts.alert.messageOne : validationTexts.alert.messagePlural)\n .split(/(\\[\\w+\\])/)\n .map(part => {\n if (part === '[COLUMN]') {\n return rowIdentityColumn?.columnDef.meta?.header ?? validationTexts.alert.messageRow;\n }\n\n if (part === '[ROW]') {\n return links;\n }\n\n return part;\n });\n\n const handleResetFilters = () => {\n table.resetGlobalFilter();\n table.resetColumnFilters();\n\n requestAnimationFrame(() => {\n const rowIndex = table.getRowModel().rows.findIndex(row => row.id === showFilterResetDialog);\n\n if (rowIndex > -1) {\n scrollToRow(rowIndex);\n }\n\n setShowFilterResetDialog(false);\n });\n };\n\n return (\n <>\n <BaseAlert {...attributes} state=\"error\">\n <span className=\"font-bold\">{title}</span>&nbsp;{message}\n </BaseAlert>\n <FilterResetDialog\n open={showFilterResetDialog !== false}\n onChange={() => setShowFilterResetDialog(false)}\n onSubmit={handleResetFilters}\n />\n </>\n );\n}\n\ntype FilterResetDialogProps = Omit<DialogProps, 'children'> & {\n onSubmit: () => void;\n};\n\nfunction FilterResetDialog(props: FilterResetDialogProps) {\n const { onSubmit: handleSubmit, ...dialogProps } = props;\n const { texts } = useLocalization();\n\n return (\n <Dialog {...dialogProps} size=\"xs\">\n <Dialog.Content aria-label=\"Create a new account\">\n <Dialog.Title>{texts.table3.editing.validation.resetFiltersDialog.title}</Dialog.Title>\n\n <p>{texts.table3.editing.validation.resetFiltersDialog.description}</p>\n\n <Dialog.Footer>\n <Group>\n <Dialog.Close>\n <Button>{texts.table3.editing.validation.resetFiltersDialog.cancel}</Button>\n </Dialog.Close>\n <Button appearance=\"primary\" onClick={handleSubmit}>\n {texts.table3.editing.validation.resetFiltersDialog.confirm}\n </Button>\n </Group>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog>\n );\n}\n"],"names":["Alert","props","scrollToIndex","table","tableRef","attributes","texts","useLocalization","validationTexts","table3","editing","validation","tableMeta","options","meta","showFilterResetDialog","setShowFilterResetDialog","React","useState","pendingChangesWithErrors","getAlertErrors","scrollToRow","rowIndex","rowActive","setRowActiveIndex","align","requestAnimationFrame","cell","_tableRef$current","current","querySelector","_cell$focus","focus","call","title","length","alert","titleOne","titlePlural","replace","String","links","rowIdentityColumn","rowIdentityColumnId","getColumn","undefined","forEach","error","index","push","messageAnd","getRowModel","rows","findIndex","row","id","rowId","handleClick","tooltip","pendingChange","_meta","errors","_table$getAllColumns$","_table$getAllColumns$2","firstCellErrorColumnId","Object","keys","cells","columnName","getAllColumns","find","column","columnDef","header","Tooltip","key","className","onClick","role","original","message","messageOne","messagePlural","split","map","part","_rowIdentityColumn$co","_rowIdentityColumn$co2","messageRow","handleResetFilters","resetGlobalFilter","resetColumnFilters","BaseAlert","state","FilterResetDialog","open","onChange","onSubmit","handleSubmit","dialogProps","Dialog","size","Content","Title","resetFiltersDialog","description","Footer","Group","Close","Button","cancel","appearance","confirm"],"mappings":"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"}
1
+ {"version":3,"file":"Alert.js","sources":["../../../../../../../../../src/components/Table3/components/Editing/Alert.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { ScrollToOptions as ReactVirtualScrollToOptions } from '@tanstack/react-virtual';\nimport { Alert as BaseAlert, AlertProps as BaseAlertProps } from '../../../Alert/Alert';\nimport { TableRef } from '../../../../primitives/Table/types';\nimport { Tooltip } from '../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { Group } from '../../../Group/Group';\nimport { Button } from '../../../Button/Button';\n\ntype AlertProps<TType = unknown> = Omit<BaseAlertProps, 'children'> & {\n scrollToIndex: (index: number, options: ReactVirtualScrollToOptions) => void;\n table: ReactTable<TType>;\n tableRef: React.RefObject<TableRef>;\n};\n\nexport function Alert<TType = unknown>(props: AlertProps<TType>) {\n const { scrollToIndex, table, tableRef, ...attributes } = props;\n const { texts } = useLocalization();\n const validationTexts = texts.table3.editing.validation;\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const [showFilterResetDialog, setShowFilterResetDialog] = React.useState<string | false>(false);\n const pendingChangesWithErrors = tableMeta.editing.getErrorsShownInAlert<TType>();\n\n function scrollToRow(rowIndex: number) {\n tableMeta.rowActive.setRowActiveIndex(rowIndex);\n scrollToIndex(rowIndex, { align: 'center' });\n\n requestAnimationFrame(() => {\n const cell = tableRef.current?.querySelector(\n 'tbody > tr[data-row-active=\"true\"] > td[data-cell-editing-invalid=\"true\"]'\n );\n\n if (cell) {\n (cell as HTMLElement).focus?.();\n }\n });\n }\n\n // generate the \"N unsaved entries\" title\n const title = (\n pendingChangesWithErrors.length === 1 ? validationTexts.alert.titleOne : validationTexts.alert.titlePlural\n ).replace('[COUNT]', String(pendingChangesWithErrors.length));\n\n // generate links to each invalid row, to go into the error message\n const links: React.ReactNode[] = [];\n const visibleColumns = table.getVisibleFlatColumns().map(c => c.id);\n const rowIdentityColumn =\n tableMeta.rowIdentityAccessor && visibleColumns.includes(String(tableMeta.rowIdentityAccessor))\n ? table.getColumn(String(tableMeta.rowIdentityAccessor))\n : undefined;\n\n pendingChangesWithErrors.forEach((pendingChangeWithError, index) => {\n // if appropriate, concatenate the item with the text \"and\"\n if (pendingChangesWithErrors.length > 1 && index === pendingChangesWithErrors.length - 1) {\n // Add space before and after `messageAnd` text\n links.push(` ${validationTexts.alert.messageAnd} `);\n }\n\n const rowIndex = table.getRowModel().rows.findIndex(row => row.id === pendingChangeWithError.rowId);\n\n const handleClick = () => {\n // if row is visible\n if (rowIndex > -1) {\n scrollToRow(rowIndex);\n }\n // if row is filtered out\n else {\n setShowFilterResetDialog(pendingChangeWithError.rowId);\n }\n };\n\n let tooltip;\n\n if (pendingChangeWithError.errors.row) {\n tooltip = pendingChangeWithError.errors.row;\n } else {\n const firstCellErrorColumnId = Object.keys(pendingChangeWithError.errors.cells)[0];\n const columnName = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)?.columnDef.meta?.header;\n tooltip = `${columnName}: ${pendingChangeWithError.errors.cells[firstCellErrorColumnId]}`;\n }\n\n const row = table.getRow(pendingChangeWithError.rowId).original;\n\n links.push(\n <Tooltip key={pendingChangeWithError.rowId} title={tooltip}>\n <span className=\"text-blue\" onClick={handleClick} role=\"button\">\n {rowIdentityColumn ? row[rowIdentityColumn.id] : rowIndex + 1}\n </span>\n </Tooltip>\n );\n\n // if appropriate, concatenate the item with the text \",\"\n if (pendingChangesWithErrors.length > 2 && index < pendingChangesWithErrors.length - 2) {\n links.push(', ');\n }\n });\n\n // generate the \"Row N is incomplete and hasn't been saved\" error message\n const message = (links.length === 1 ? validationTexts.alert.messageOne : validationTexts.alert.messagePlural)\n .split(/(\\[\\w+\\])/)\n .map(part => {\n if (part === '[COLUMN]') {\n return rowIdentityColumn?.columnDef.meta?.header ?? validationTexts.alert.messageRow;\n }\n\n if (part === '[ROW]') {\n return links;\n }\n\n return part;\n });\n\n const handleResetFilters = () => {\n table.resetGlobalFilter();\n table.resetColumnFilters();\n\n requestAnimationFrame(() => {\n const rowIndex = table.getRowModel().rows.findIndex(row => row.id === showFilterResetDialog);\n\n if (rowIndex > -1) {\n scrollToRow(rowIndex);\n }\n\n setShowFilterResetDialog(false);\n });\n };\n\n return (\n <>\n <BaseAlert {...attributes} state=\"error\">\n <span className=\"font-bold\">{title}</span>&nbsp;{message}\n </BaseAlert>\n <FilterResetDialog\n open={showFilterResetDialog !== false}\n onChange={() => setShowFilterResetDialog(false)}\n onSubmit={handleResetFilters}\n />\n </>\n );\n}\n\ntype FilterResetDialogProps = Omit<DialogProps, 'children'> & {\n onSubmit: () => void;\n};\n\nfunction FilterResetDialog(props: FilterResetDialogProps) {\n const { onSubmit: handleSubmit, ...dialogProps } = props;\n const { texts } = useLocalization();\n\n return (\n <Dialog {...dialogProps} size=\"xs\">\n <Dialog.Content aria-label=\"Create a new account\">\n <Dialog.Title>{texts.table3.editing.validation.resetFiltersDialog.title}</Dialog.Title>\n\n <p>{texts.table3.editing.validation.resetFiltersDialog.description}</p>\n\n <Dialog.Footer>\n <Group>\n <Dialog.Close>\n <Button>{texts.table3.editing.validation.resetFiltersDialog.cancel}</Button>\n </Dialog.Close>\n <Button appearance=\"primary\" onClick={handleSubmit}>\n {texts.table3.editing.validation.resetFiltersDialog.confirm}\n </Button>\n </Group>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog>\n );\n}\n"],"names":["Alert","props","scrollToIndex","table","tableRef","attributes","texts","useLocalization","validationTexts","table3","editing","validation","tableMeta","options","meta","showFilterResetDialog","setShowFilterResetDialog","React","useState","pendingChangesWithErrors","getErrorsShownInAlert","scrollToRow","rowIndex","rowActive","setRowActiveIndex","align","requestAnimationFrame","cell","_tableRef$current","current","querySelector","_cell$focus","focus","call","title","length","alert","titleOne","titlePlural","replace","String","links","visibleColumns","getVisibleFlatColumns","map","c","id","rowIdentityColumn","rowIdentityAccessor","includes","getColumn","undefined","forEach","pendingChangeWithError","index","push","messageAnd","getRowModel","rows","findIndex","row","rowId","handleClick","tooltip","errors","_table$getAllColumns$","_table$getAllColumns$2","firstCellErrorColumnId","Object","keys","cells","columnName","getAllColumns","find","column","columnDef","header","getRow","original","Tooltip","key","className","onClick","role","message","messageOne","messagePlural","split","part","_rowIdentityColumn$co","_rowIdentityColumn$co2","messageRow","handleResetFilters","resetGlobalFilter","resetColumnFilters","BaseAlert","state","FilterResetDialog","open","onChange","onSubmit","handleSubmit","dialogProps","Dialog","size","Content","Title","resetFiltersDialog","description","Footer","Group","Close","Button","cancel","appearance","confirm"],"mappings":"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"}
@@ -0,0 +1,34 @@
1
+ import React__default from 'react';
2
+ import { useLocalization } from '../../../Provider/Localization.js';
3
+ import { Button } from '../../../Button/Button.js';
4
+ import { Dialog } from '../../../Dialog/Dialog.js';
5
+ import { Group } from '../../../Group/Group.js';
6
+
7
+ function DiscardChangesConfirmationDialog(props) {
8
+ const {
9
+ onDiscard: handleDiscard,
10
+ ...dialogProps
11
+ } = props;
12
+ const {
13
+ texts
14
+ } = useLocalization();
15
+ const handleClickInsideDialogContent = event => {
16
+ // Prevents the click event from propagating to the table, ensuring the row isn't saved when a click occurs
17
+ // inside the dialog
18
+ event.stopPropagation();
19
+ };
20
+ return /*#__PURE__*/React__default.createElement(Dialog, Object.assign({}, dialogProps), /*#__PURE__*/React__default.createElement(Dialog.Content, {
21
+ "aria-label": texts.table3.editing.clearChangesConfirmationDialog.title,
22
+ onClick: handleClickInsideDialogContent
23
+ }, /*#__PURE__*/React__default.createElement(Dialog.Title, null, texts.table3.editing.clearChangesConfirmationDialog.title), /*#__PURE__*/React__default.createElement("p", null, texts.table3.editing.clearChangesConfirmationDialog.description), /*#__PURE__*/React__default.createElement(Dialog.Footer, null, /*#__PURE__*/React__default.createElement(Group, null, /*#__PURE__*/React__default.createElement(Dialog.Close, null, /*#__PURE__*/React__default.createElement(Button, {
24
+ tabIndex: 0
25
+ }, texts.table3.editing.clearChangesConfirmationDialog.cancel)), /*#__PURE__*/React__default.createElement(Dialog.Close, null, /*#__PURE__*/React__default.createElement(Button, {
26
+ autoFocus: true,
27
+ tabIndex: 0,
28
+ appearance: "primary",
29
+ onClick: handleDiscard
30
+ }, texts.table3.editing.clearChangesConfirmationDialog.confirm))))));
31
+ }
32
+
33
+ export { DiscardChangesConfirmationDialog };
34
+ //# sourceMappingURL=DiscardChangesConfirmationDialog.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DiscardChangesConfirmationDialog.js","sources":["../../../../../../../../../src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Group } from '../../../Group/Group';\nimport { Button } from '../../../Button/Button';\n\ntype DiscardChangesConfirmationDialogProps = Partial<DialogProps> & {\n onDiscard: () => void;\n};\n\nexport function DiscardChangesConfirmationDialog(props: DiscardChangesConfirmationDialogProps) {\n const { onDiscard: handleDiscard, ...dialogProps } = props;\n const { texts } = useLocalization();\n\n const handleClickInsideDialogContent = (event: React.MouseEvent) => {\n // Prevents the click event from propagating to the table, ensuring the row isn't saved when a click occurs\n // inside the dialog\n event.stopPropagation();\n };\n\n return (\n <Dialog {...dialogProps}>\n <Dialog.Content\n aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}\n onClick={handleClickInsideDialogContent}>\n <Dialog.Title>{texts.table3.editing.clearChangesConfirmationDialog.title}</Dialog.Title>\n\n <p>{texts.table3.editing.clearChangesConfirmationDialog.description}</p>\n\n <Dialog.Footer>\n <Group>\n <Dialog.Close>\n <Button tabIndex={0}>{texts.table3.editing.clearChangesConfirmationDialog.cancel}</Button>\n </Dialog.Close>\n <Dialog.Close>\n <Button autoFocus tabIndex={0} appearance=\"primary\" onClick={handleDiscard}>\n {texts.table3.editing.clearChangesConfirmationDialog.confirm}\n </Button>\n </Dialog.Close>\n </Group>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog>\n );\n}\n"],"names":["DiscardChangesConfirmationDialog","props","onDiscard","handleDiscard","dialogProps","texts","useLocalization","handleClickInsideDialogContent","event","stopPropagation","React","Dialog","Content","table3","editing","clearChangesConfirmationDialog","title","onClick","Title","description","Footer","Group","Close","Button","tabIndex","cancel","autoFocus","appearance","confirm"],"mappings":";;;;;;SAUgBA,gCAAgCA,CAACC,KAA4C;EACzF,MAAM;IAAEC,SAAS,EAAEC,aAAa;IAAE,GAAGC;GAAa,GAAGH,KAAK;EAC1D,MAAM;IAAEI;GAAO,GAAGC,eAAe,EAAE;EAEnC,MAAMC,8BAA8B,GAAIC,KAAuB;;;IAG3DA,KAAK,CAACC,eAAe,EAAE;GAC1B;EAED,oBACIC,6BAACC,MAAM,oBAAKP,WAAW,gBACnBM,6BAACC,MAAM,CAACC,OAAO;kBACCP,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,8BAA8B,CAACC,KAAK;IACrEC,OAAO,EAAEV;kBACTG,6BAACC,MAAM,CAACO,KAAK,QAAEb,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,8BAA8B,CAACC,KAAK,CAAgB,eAExFN,wCAAIL,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,8BAA8B,CAACI,WAAW,CAAK,eAExET,6BAACC,MAAM,CAACS,MAAM,qBACVV,6BAACW,KAAK,qBACFX,6BAACC,MAAM,CAACW,KAAK,qBACTZ,6BAACa,MAAM;IAACC,QAAQ,EAAE;KAAInB,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,8BAA8B,CAACU,MAAM,CAAU,CAC/E,eACff,6BAACC,MAAM,CAACW,KAAK,qBACTZ,6BAACa,MAAM;IAACG,SAAS;IAACF,QAAQ,EAAE,CAAC;IAAEG,UAAU,EAAC,SAAS;IAACV,OAAO,EAAEd;KACxDE,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,8BAA8B,CAACa,OAAO,CACvD,CACE,CACX,CACI,CACH,CACZ;AAEjB;;;;"}
@@ -0,0 +1,82 @@
1
+ import React__default from 'react';
2
+ import { Icon } from '../../../../Icon/Icon.js';
3
+ import { useLocalization } from '../../../../Provider/Localization.js';
4
+ import { Button } from '../../../../Button/Button.js';
5
+ import { _catch } from '../../../../../../../../node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js';
6
+
7
+ function CreateNewRow(props) {
8
+ var _temporaryRows$0$tabl, _temporaryRows$, _table$getState$colum;
9
+ const {
10
+ buttonRef,
11
+ onEditingCreate: handleEditingCreate,
12
+ scrollToIndex,
13
+ table,
14
+ tableMeta
15
+ } = props;
16
+ const {
17
+ texts
18
+ } = useLocalization();
19
+ const temporaryRows = tableMeta.editing.temporaryRows;
20
+ const temporaryRowId = (_temporaryRows$0$tabl = (_temporaryRows$ = temporaryRows[0]) === null || _temporaryRows$ === void 0 ? void 0 : _temporaryRows$[tableMeta.rowIdentityAccessor]) !== null && _temporaryRows$0$tabl !== void 0 ? _temporaryRows$0$tabl : '';
21
+ const isDisabled = !!table.getState().globalFilter || !!((_table$getState$colum = table.getState().columnFilters) !== null && _table$getState$colum !== void 0 && _table$getState$colum.length) || !!temporaryRowId && !!tableMeta.editing.hasRowErrors(temporaryRowId);
22
+ const isSaving = !!temporaryRowId && tableMeta.editing.getRowStatus(temporaryRowId) === 'saving';
23
+ const handleCreate = function (event) {
24
+ try {
25
+ // prevent save being triggered by click outside - TODO: investigate why the button triggers clickoutside
26
+ event === null || event === void 0 ? void 0 : event.stopPropagation();
27
+ if (!handleEditingCreate || isDisabled) {
28
+ return Promise.resolve();
29
+ }
30
+ return Promise.resolve(tableMeta.editing.saveChanges(table)).then(function (saved) {
31
+ if (!saved) {
32
+ return;
33
+ }
34
+ return _catch(function () {
35
+ const changeset = handleEditingCreate();
36
+ const _temp = function () {
37
+ if (changeset) {
38
+ return Promise.resolve(tableMeta.editing.createRow(changeset)).then(function (rowId) {
39
+ table.getRow(rowId).pin('bottom');
40
+ // set the active row to the new row before toggling editing on
41
+ const nextRowIndex = temporaryRows.length ? tableMeta.length + 1 : tableMeta.length;
42
+ tableMeta.rowActive.setRowActiveIndex(nextRowIndex);
43
+ tableMeta.editing.toggleEditing(true, table, scrollToIndex);
44
+ tableMeta.editing.setLastFocusedCellIndex(0);
45
+ });
46
+ }
47
+ }();
48
+ if (_temp && _temp.then) return _temp.then(function () {});
49
+ }, function (error) {
50
+ console.error(error);
51
+ });
52
+ });
53
+ } catch (e) {
54
+ return Promise.reject(e);
55
+ }
56
+ };
57
+ let tooltip;
58
+ if (isSaving) {
59
+ tooltip = texts.table3.editing.buttons.create.saving;
60
+ } else if (isDisabled) {
61
+ tooltip = texts.table3.editing.buttons.create.disabled;
62
+ }
63
+ return /*#__PURE__*/React__default.createElement("tr", {
64
+ "data-row-create": true,
65
+ className: "border-grey-300 group/row",
66
+ tabIndex: -1
67
+ }, /*#__PURE__*/React__default.createElement("td", {
68
+ className: "!bg-grey-50 col-span-full !border-b-0 !px-1"
69
+ }, /*#__PURE__*/React__default.createElement(Button, {
70
+ appearance: "transparent",
71
+ className: "group-hover:bg-grey-200 sticky left-[4px]",
72
+ disabled: isDisabled,
73
+ onClick: handleCreate,
74
+ ref: buttonRef,
75
+ tooltip: tooltip
76
+ }, /*#__PURE__*/React__default.createElement(Icon, {
77
+ name: "circle-plus"
78
+ }), texts.table3.editing.buttons.create.label)));
79
+ }
80
+
81
+ export { CreateNewRow };
82
+ //# sourceMappingURL=CreateNewRow.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CreateNewRow.js","sources":["../../../../../../../../../../src/components/Table3/components/Row/Editing/CreateNewRow.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { Button } from '../../../../Button/Button';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Icon } from '../../../../Icon/Icon';\nimport { Table3EditingCreateHandler } from '../../../types';\nimport { TableRef } from '../../../../../primitives/Table/types';\n\ntype CreateNewRowProps<TType = unknown> = {\n buttonRef: React.Ref<HTMLButtonElement>;\n onEditingCreate?: Table3EditingCreateHandler<TType>;\n scrollToIndex: (index: number) => void;\n table: ReactTable<TType>;\n tableMeta: ReactTableMeta<TType>;\n tableRef: React.RefObject<TableRef>;\n};\n\nexport function CreateNewRow<TType = unknown>(props: CreateNewRowProps<TType>) {\n const { buttonRef, onEditingCreate: handleEditingCreate, scrollToIndex, table, tableMeta } = props;\n const { texts } = useLocalization();\n\n const temporaryRows = tableMeta.editing.temporaryRows as TType[];\n const temporaryRowId: string = temporaryRows[0]?.[tableMeta.rowIdentityAccessor as string] ?? '';\n\n const isDisabled =\n !!table.getState().globalFilter ||\n !!table.getState().columnFilters?.length ||\n (!!temporaryRowId && !!tableMeta.editing.hasRowErrors(temporaryRowId));\n const isSaving = !!temporaryRowId && tableMeta.editing.getRowStatus(temporaryRowId) === 'saving';\n\n const handleCreate = async event => {\n // prevent save being triggered by click outside - TODO: investigate why the button triggers clickoutside\n event?.stopPropagation();\n\n if (!handleEditingCreate || isDisabled) {\n return;\n }\n\n const saved = await tableMeta.editing.saveChanges(table);\n\n if (!saved) {\n return;\n }\n\n try {\n const changeset = handleEditingCreate();\n\n if (changeset) {\n const rowId = await tableMeta.editing.createRow(changeset);\n table.getRow(rowId).pin('bottom');\n\n // set the active row to the new row before toggling editing on\n const nextRowIndex = temporaryRows.length ? tableMeta.length + 1 : tableMeta.length;\n tableMeta.rowActive.setRowActiveIndex(nextRowIndex);\n\n tableMeta.editing.toggleEditing(true, table, scrollToIndex);\n tableMeta.editing.setLastFocusedCellIndex(0);\n }\n } catch (error) {\n console.error(error);\n }\n };\n\n let tooltip;\n\n if (isSaving) {\n tooltip = texts.table3.editing.buttons.create.saving;\n } else if (isDisabled) {\n tooltip = texts.table3.editing.buttons.create.disabled;\n }\n\n return (\n <tr data-row-create className=\"border-grey-300 group/row\" tabIndex={-1}>\n <td className=\"!bg-grey-50 col-span-full !border-b-0 !px-1\">\n <Button\n appearance=\"transparent\"\n className=\"group-hover:bg-grey-200 sticky left-[4px]\"\n disabled={isDisabled}\n onClick={handleCreate}\n ref={buttonRef}\n tooltip={tooltip}>\n <Icon name=\"circle-plus\" />\n {texts.table3.editing.buttons.create.label}\n </Button>\n </td>\n </tr>\n );\n}\n"],"names":["CreateNewRow","props","buttonRef","onEditingCreate","handleEditingCreate","scrollToIndex","table","tableMeta","texts","useLocalization","temporaryRows","editing","temporaryRowId","_temporaryRows$0$tabl","_temporaryRows$","rowIdentityAccessor","isDisabled","getState","globalFilter","_table$getState$colum","columnFilters","length","hasRowErrors","isSaving","getRowStatus","handleCreate","event","stopPropagation","Promise","resolve","saveChanges","then","saved","_catch","changeset","_temp","createRow","rowId","getRow","pin","nextRowIndex","rowActive","setRowActiveIndex","toggleEditing","setLastFocusedCellIndex","error","console","e","reject","tooltip","table3","buttons","create","saving","disabled","React","className","tabIndex","Button","appearance","onClick","ref","Icon","name","label"],"mappings":"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"}
@@ -5,7 +5,6 @@ import { Tooltip } from '../../../../Tooltip/Tooltip.js';
5
5
  import { useLocalization } from '../../../../Provider/Localization.js';
6
6
  import { Spinner } from '../../../../Spinner/Spinner.js';
7
7
 
8
- const COMPLETE_INDICATOR_DELAY = 3000;
9
8
  function SaveStatus(props) {
10
9
  const {
11
10
  rowId,
@@ -15,18 +14,7 @@ function SaveStatus(props) {
15
14
  texts
16
15
  } = useLocalization();
17
16
  const tableMeta = table.options.meta;
18
- const status = tableMeta.editing.getRowSaveStatus(rowId);
19
- React__default.useEffect(() => {
20
- let timeout;
21
- if (status === 'complete') {
22
- timeout = setTimeout(() => {
23
- tableMeta.editing.setRowSaveStatus(rowId, undefined);
24
- }, COMPLETE_INDICATOR_DELAY);
25
- }
26
- return () => {
27
- clearTimeout(timeout);
28
- };
29
- }, [status]);
17
+ const status = tableMeta.editing.getRowStatus(rowId);
30
18
  const className = cn('col-span-full sticky ml-auto right-0 top-0 -mb-[100%] z-10 h-8 bg-[inherit] flex items-center px-1.5 shadow-[-6px_0px_6px_var(--table-row-actions-shadow)]', {
31
19
  'mt-0.5': tableMeta.rowHeight.height === 'short',
32
20
  'mt-1': tableMeta.rowHeight.height === 'medium',
@@ -37,7 +25,7 @@ function SaveStatus(props) {
37
25
  className: "!contents"
38
26
  }, /*#__PURE__*/React__default.createElement("span", {
39
27
  className: className
40
- }, status === 'pending' ? (/*#__PURE__*/React__default.createElement(Tooltip, {
28
+ }, status === 'saving' ? (/*#__PURE__*/React__default.createElement(Tooltip, {
41
29
  title: texts.table3.editing.saving.progress
42
30
  }, /*#__PURE__*/React__default.createElement(Spinner, {
43
31
  delay: 0,
@@ -1 +1 @@
1
- {"version":3,"file":"SaveStatus.js","sources":["../../../../../../../../../../src/components/Table3/components/Row/Editing/SaveStatus.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport clsx from 'clsx';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { BadgeIcon } from '../../../../BadgeIcon/BadgeIcon';\nimport { Spinner } from '../../../../Spinner/Spinner';\n\nconst COMPLETE_INDICATOR_DELAY = 3000;\n\ntype SaveStatusProps<TType = unknown> = {\n rowId: string;\n table: ReactTable<TType>;\n};\n\nexport function SaveStatus<TType = unknown>(props: SaveStatusProps<TType>) {\n const { rowId, table } = props;\n const { texts } = useLocalization();\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const status = tableMeta.editing.getRowSaveStatus(rowId);\n\n React.useEffect(() => {\n let timeout;\n\n if (status === 'complete') {\n timeout = setTimeout(() => {\n tableMeta.editing.setRowSaveStatus(rowId, undefined);\n }, COMPLETE_INDICATOR_DELAY);\n }\n\n return () => {\n clearTimeout(timeout);\n };\n }, [status]);\n\n const className = clsx(\n 'col-span-full sticky ml-auto right-0 top-0 -mb-[100%] z-10 h-8 bg-[inherit] flex items-center px-1.5 shadow-[-6px_0px_6px_var(--table-row-actions-shadow)]',\n {\n 'mt-0.5': tableMeta.rowHeight.height === 'short',\n 'mt-1': tableMeta.rowHeight.height === 'medium',\n 'mt-1.5': tableMeta.rowHeight.height === 'tall',\n 'mt-2': tableMeta.rowHeight.height === 'extra-tall',\n }\n );\n\n return (\n <td className=\"!contents\">\n <span className={className}>\n {status === 'pending' ? (\n <Tooltip title={texts.table3.editing.saving.progress}>\n <Spinner delay={0} className=\"mr-1 !h-5 !w-5\" />\n </Tooltip>\n ) : (\n <Tooltip title={texts.table3.editing.saving.complete}>\n <BadgeIcon icon=\"tick\" color=\"green\" subtle className=\"mr-1\" />\n </Tooltip>\n )}\n </span>\n </td>\n );\n}\n"],"names":["COMPLETE_INDICATOR_DELAY","SaveStatus","props","rowId","table","texts","useLocalization","tableMeta","options","meta","status","editing","getRowSaveStatus","React","useEffect","timeout","setTimeout","setRowSaveStatus","undefined","clearTimeout","className","clsx","rowHeight","height","Tooltip","title","table3","saving","progress","Spinner","delay","complete","BadgeIcon","icon","color","subtle"],"mappings":";;;;;;;AAQA,MAAMA,wBAAwB,GAAG,IAAI;SAOrBC,UAAUA,CAAkBC,KAA6B;EACrE,MAAM;IAAEC,KAAK;IAAEC;GAAO,GAAGF,KAAK;EAC9B,MAAM;IAAEG;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,SAAS,GAAGH,KAAK,CAACI,OAAO,CAACC,IAA6B;EAC7D,MAAMC,MAAM,GAAGH,SAAS,CAACI,OAAO,CAACC,gBAAgB,CAACT,KAAK,CAAC;EAExDU,cAAK,CAACC,SAAS,CAAC;IACZ,IAAIC,OAAO;IAEX,IAAIL,MAAM,KAAK,UAAU,EAAE;MACvBK,OAAO,GAAGC,UAAU,CAAC;QACjBT,SAAS,CAACI,OAAO,CAACM,gBAAgB,CAACd,KAAK,EAAEe,SAAS,CAAC;OACvD,EAAElB,wBAAwB,CAAC;;IAGhC,OAAO;MACHmB,YAAY,CAACJ,OAAO,CAAC;KACxB;GACJ,EAAE,CAACL,MAAM,CAAC,CAAC;EAEZ,MAAMU,SAAS,GAAGC,EAAI,CAClB,4JAA4J,EAC5J;IACI,QAAQ,EAAEd,SAAS,CAACe,SAAS,CAACC,MAAM,KAAK,OAAO;IAChD,MAAM,EAAEhB,SAAS,CAACe,SAAS,CAACC,MAAM,KAAK,QAAQ;IAC/C,QAAQ,EAAEhB,SAAS,CAACe,SAAS,CAACC,MAAM,KAAK,MAAM;IAC/C,MAAM,EAAEhB,SAAS,CAACe,SAAS,CAACC,MAAM,KAAK;GAC1C,CACJ;EAED,oBACIV;IAAIO,SAAS,EAAC;kBACVP;IAAMO,SAAS,EAAEA;KACZV,MAAM,KAAK,SAAS,iBACjBG,6BAACW,OAAO;IAACC,KAAK,EAAEpB,KAAK,CAACqB,MAAM,CAACf,OAAO,CAACgB,MAAM,CAACC;kBACxCf,6BAACgB,OAAO;IAACC,KAAK,EAAE,CAAC;IAAEV,SAAS,EAAC;IAAmB,CAC1C,kBAEVP,6BAACW,OAAO;IAACC,KAAK,EAAEpB,KAAK,CAACqB,MAAM,CAACf,OAAO,CAACgB,MAAM,CAACI;kBACxClB,6BAACmB,SAAS;IAACC,IAAI,EAAC,MAAM;IAACC,KAAK,EAAC,OAAO;IAACC,MAAM;IAACf,SAAS,EAAC;IAAS,CACzD,CACb,CACE,CACN;AAEb;;;;"}
1
+ {"version":3,"file":"SaveStatus.js","sources":["../../../../../../../../../../src/components/Table3/components/Row/Editing/SaveStatus.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport clsx from 'clsx';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { BadgeIcon } from '../../../../BadgeIcon/BadgeIcon';\nimport { Spinner } from '../../../../Spinner/Spinner';\n\ntype SaveStatusProps<TType = unknown> = {\n rowId: string;\n table: ReactTable<TType>;\n};\n\nexport function SaveStatus<TType = unknown>(props: SaveStatusProps<TType>) {\n const { rowId, table } = props;\n const { texts } = useLocalization();\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const status = tableMeta.editing.getRowStatus(rowId);\n\n const className = clsx(\n 'col-span-full sticky ml-auto right-0 top-0 -mb-[100%] z-10 h-8 bg-[inherit] flex items-center px-1.5 shadow-[-6px_0px_6px_var(--table-row-actions-shadow)]',\n {\n 'mt-0.5': tableMeta.rowHeight.height === 'short',\n 'mt-1': tableMeta.rowHeight.height === 'medium',\n 'mt-1.5': tableMeta.rowHeight.height === 'tall',\n 'mt-2': tableMeta.rowHeight.height === 'extra-tall',\n }\n );\n\n return (\n <td className=\"!contents\">\n <span className={className}>\n {status === 'saving' ? (\n <Tooltip title={texts.table3.editing.saving.progress}>\n <Spinner delay={0} className=\"mr-1 !h-5 !w-5\" />\n </Tooltip>\n ) : (\n <Tooltip title={texts.table3.editing.saving.complete}>\n <BadgeIcon icon=\"tick\" color=\"green\" subtle className=\"mr-1\" />\n </Tooltip>\n )}\n </span>\n </td>\n );\n}\n"],"names":["SaveStatus","props","rowId","table","texts","useLocalization","tableMeta","options","meta","status","editing","getRowStatus","className","clsx","rowHeight","height","React","Tooltip","title","table3","saving","progress","Spinner","delay","complete","BadgeIcon","icon","color","subtle"],"mappings":";;;;;;;SAagBA,UAAUA,CAAkBC,KAA6B;EACrE,MAAM;IAAEC,KAAK;IAAEC;GAAO,GAAGF,KAAK;EAC9B,MAAM;IAAEG;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,SAAS,GAAGH,KAAK,CAACI,OAAO,CAACC,IAA6B;EAC7D,MAAMC,MAAM,GAAGH,SAAS,CAACI,OAAO,CAACC,YAAY,CAACT,KAAK,CAAC;EAEpD,MAAMU,SAAS,GAAGC,EAAI,CAClB,4JAA4J,EAC5J;IACI,QAAQ,EAAEP,SAAS,CAACQ,SAAS,CAACC,MAAM,KAAK,OAAO;IAChD,MAAM,EAAET,SAAS,CAACQ,SAAS,CAACC,MAAM,KAAK,QAAQ;IAC/C,QAAQ,EAAET,SAAS,CAACQ,SAAS,CAACC,MAAM,KAAK,MAAM;IAC/C,MAAM,EAAET,SAAS,CAACQ,SAAS,CAACC,MAAM,KAAK;GAC1C,CACJ;EAED,oBACIC;IAAIJ,SAAS,EAAC;kBACVI;IAAMJ,SAAS,EAAEA;KACZH,MAAM,KAAK,QAAQ,iBAChBO,6BAACC,OAAO;IAACC,KAAK,EAAEd,KAAK,CAACe,MAAM,CAACT,OAAO,CAACU,MAAM,CAACC;kBACxCL,6BAACM,OAAO;IAACC,KAAK,EAAE,CAAC;IAAEX,SAAS,EAAC;IAAmB,CAC1C,kBAEVI,6BAACC,OAAO;IAACC,KAAK,EAAEd,KAAK,CAACe,MAAM,CAACT,OAAO,CAACU,MAAM,CAACI;kBACxCR,6BAACS,SAAS;IAACC,IAAI,EAAC,MAAM;IAACC,KAAK,EAAC,OAAO;IAACC,MAAM;IAAChB,SAAS,EAAC;IAAS,CACzD,CACb,CACE,CACN;AAEb;;;;"}
@@ -0,0 +1,95 @@
1
+ import React__default from 'react';
2
+ import cn from 'clsx';
3
+ import { isElementTriggeredFromContainer } from '../../../../../utils/dom.js';
4
+ import { Row } from '../../../../../primitives/Table/Core/components/Row/Row.js';
5
+ import { TEMPORARY_ROW_ID_PREFIX } from '../../../util/editing.js';
6
+ import { RENDERERS } from '../../../useTable3.js';
7
+
8
+ function TemporaryRow(props) {
9
+ var _tableRef$current, _tableRef$current2;
10
+ const {
11
+ createRowButtonRef,
12
+ table,
13
+ tableMeta,
14
+ tableRef
15
+ } = props;
16
+ const isScrolled = tableRef.current ? ((_tableRef$current = tableRef.current) === null || _tableRef$current === void 0 ? void 0 : _tableRef$current.scrollHeight) > ((_tableRef$current2 = tableRef.current) === null || _tableRef$current2 === void 0 ? void 0 : _tableRef$current2.clientHeight) : false;
17
+ const handleKeyDown = function (event) {
18
+ try {
19
+ const _temp2 = function () {
20
+ if (event.key === 'ArrowDown') {
21
+ event.preventDefault();
22
+ const _temp = function () {
23
+ if (!isElementTriggeredFromContainer(event.target, event.currentTarget)) {
24
+ return Promise.resolve(tableMeta.editing.saveChanges(table)).then(function (saved) {
25
+ if (saved) {
26
+ var _createRowButtonRef$c;
27
+ (_createRowButtonRef$c = createRowButtonRef.current) === null || _createRowButtonRef$c === void 0 ? void 0 : _createRowButtonRef$c.focus();
28
+ }
29
+ });
30
+ }
31
+ }();
32
+ if (_temp && _temp.then) return _temp.then(function () {});
33
+ } else if (event.key === 'ArrowUp') {
34
+ event.preventDefault();
35
+ event.stopPropagation();
36
+ if (tableRef.current) {
37
+ var _tableRef$current$que, _tableRef$current$que2, _tableRef$current$que3;
38
+ const availableRows = Array.from((_tableRef$current$que = tableRef.current.querySelectorAll(`tbody tr:not([data-row-id^='${TEMPORARY_ROW_ID_PREFIX}'])`)) !== null && _tableRef$current$que !== void 0 ? _tableRef$current$que : []);
39
+ const footerHeight = (_tableRef$current$que2 = (_tableRef$current$que3 = tableRef.current.querySelector('tfoot')) === null || _tableRef$current$que3 === void 0 ? void 0 : _tableRef$current$que3.getBoundingClientRect().height) !== null && _tableRef$current$que2 !== void 0 ? _tableRef$current$que2 : 0;
40
+ const newRowHeight = event.currentTarget.getBoundingClientRect().height;
41
+ const visibleHeight = tableRef.current.clientHeight - footerHeight - newRowHeight;
42
+ const tableTopOffset = tableRef.current.getBoundingClientRect().top;
43
+ let nextRowIndex;
44
+ // iterate available rows in reverse order, since we're working at the bottom
45
+ for (let index = availableRows.length - 1; index >= 0; index--) {
46
+ const rowRect = availableRows[index].getBoundingClientRect();
47
+ const topPlusHalfRow = rowRect.top + rowRect.height / 2;
48
+ if (topPlusHalfRow - tableTopOffset <= visibleHeight) {
49
+ nextRowIndex = index;
50
+ break;
51
+ }
52
+ }
53
+ if (nextRowIndex) {
54
+ tableMeta.rowActive.setRowActiveIndex(Number(availableRows[nextRowIndex < 0 ? 0 : nextRowIndex].getAttribute('data-row-index')));
55
+ }
56
+ }
57
+ }
58
+ }();
59
+ return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
60
+ } catch (e) {
61
+ return Promise.reject(e);
62
+ }
63
+ };
64
+ const handleKeyDownCapture = event => {
65
+ if (event.key === 'ArrowLeft' && tableMeta.editing.lastFocusedCellIndex === 0) {
66
+ event.preventDefault();
67
+ event.stopPropagation();
68
+ } else if (event.key === 'ArrowRight' && tableMeta.editing.lastFocusedCellIndex) {
69
+ if (tableMeta.editing.lastFocusedCellIndex === table.getVisibleFlatColumns().length - 1) {
70
+ event.preventDefault();
71
+ event.stopPropagation();
72
+ }
73
+ }
74
+ };
75
+ const className = cn('group/row border-grey-300 !sticky z-[21]', {
76
+ 'bottom-20 data-[row-editing-move]:bottom-[calc(5rem_+_2px)]': tableMeta.footer.isEnabled,
77
+ 'bottom-10 data-[row-editing-move]:bottom-[calc(2.5rem_+_2px)]': !tableMeta.footer.isEnabled,
78
+ 'border-b border-t shadow-[0px_-5px_20px_0px_rgba(0,0,0,0.1)] border-t-grey-500/[0.75]': isScrolled
79
+ });
80
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, table.getBottomRows().map(row => (/*#__PURE__*/React__default.createElement(Row, {
81
+ key: row.id,
82
+ cellRenderer: RENDERERS.cell,
83
+ index: tableMeta.length,
84
+ measureRow: () => null,
85
+ renderer: RENDERERS.row,
86
+ row: row,
87
+ table: table,
88
+ className: className,
89
+ onKeyDown: handleKeyDown,
90
+ onKeyDownCapture: handleKeyDownCapture
91
+ }))));
92
+ }
93
+
94
+ export { TemporaryRow };
95
+ //# sourceMappingURL=TemporaryRow.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TemporaryRow.js","sources":["../../../../../../../../../../src/components/Table3/components/Row/Editing/TemporaryRow.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport clsx from 'clsx';\nimport { Row } from '../../../../../primitives/Table/Core/components/Row/Row';\nimport { RENDERERS } from '../../../useTable3';\nimport { isElementTriggeredFromContainer } from '../../../../../utils/dom';\nimport { TableRef } from '../../../../../primitives/Table/types';\nimport { TEMPORARY_ROW_ID_PREFIX } from '../../../util/editing';\n\ntype TemporaryRowProps<TType = unknown> = {\n createRowButtonRef: React.RefObject<HTMLButtonElement>;\n table: ReactTable<TType>;\n tableMeta: ReactTableMeta<TType>;\n tableRef: React.RefObject<TableRef>;\n};\n\nexport function TemporaryRow<TType = unknown>(props: TemporaryRowProps<TType>) {\n const { createRowButtonRef, table, tableMeta, tableRef } = props;\n\n const isScrolled = tableRef.current ? tableRef.current?.scrollHeight > tableRef.current?.clientHeight : false;\n\n const handleKeyDown = async (event: React.KeyboardEvent<HTMLTableRowElement>) => {\n if (event.key === 'ArrowDown') {\n event.preventDefault();\n\n if (!isElementTriggeredFromContainer(event.target as Element, event.currentTarget)) {\n const saved = await tableMeta.editing.saveChanges(table);\n\n if (saved) {\n createRowButtonRef.current?.focus();\n }\n }\n } else if (event.key === 'ArrowUp') {\n event.preventDefault();\n event.stopPropagation();\n\n if (tableRef.current) {\n const availableRows = Array.from(\n tableRef.current.querySelectorAll(`tbody tr:not([data-row-id^='${TEMPORARY_ROW_ID_PREFIX}'])`) ?? []\n );\n\n const footerHeight = tableRef.current.querySelector('tfoot')?.getBoundingClientRect().height ?? 0;\n const newRowHeight = event.currentTarget.getBoundingClientRect().height;\n const visibleHeight = tableRef.current.clientHeight - footerHeight - newRowHeight;\n const tableTopOffset = tableRef.current.getBoundingClientRect().top;\n\n let nextRowIndex;\n\n // iterate available rows in reverse order, since we're working at the bottom\n for (let index = availableRows.length - 1; index >= 0; index--) {\n const rowRect = availableRows[index].getBoundingClientRect();\n const topPlusHalfRow = rowRect.top + rowRect.height / 2;\n\n if (topPlusHalfRow - tableTopOffset <= visibleHeight) {\n nextRowIndex = index;\n break;\n }\n }\n\n if (nextRowIndex) {\n tableMeta.rowActive.setRowActiveIndex(\n Number(availableRows[nextRowIndex < 0 ? 0 : nextRowIndex].getAttribute('data-row-index'))\n );\n }\n }\n }\n };\n\n const handleKeyDownCapture = (event: React.KeyboardEvent<HTMLTableRowElement>) => {\n if (event.key === 'ArrowLeft' && tableMeta.editing.lastFocusedCellIndex === 0) {\n event.preventDefault();\n event.stopPropagation();\n } else if (event.key === 'ArrowRight' && tableMeta.editing.lastFocusedCellIndex) {\n if (tableMeta.editing.lastFocusedCellIndex === table.getVisibleFlatColumns().length - 1) {\n event.preventDefault();\n event.stopPropagation();\n }\n }\n };\n\n const className = clsx('group/row border-grey-300 !sticky z-[21]', {\n 'bottom-20 data-[row-editing-move]:bottom-[calc(5rem_+_2px)]': tableMeta.footer.isEnabled,\n 'bottom-10 data-[row-editing-move]:bottom-[calc(2.5rem_+_2px)]': !tableMeta.footer.isEnabled,\n 'border-b border-t shadow-[0px_-5px_20px_0px_rgba(0,0,0,0.1)] border-t-grey-500/[0.75]': isScrolled,\n });\n\n return (\n <>\n {table.getBottomRows().map(row => (\n <Row<TType>\n key={row.id}\n cellRenderer={RENDERERS.cell}\n index={tableMeta.length}\n measureRow={() => null}\n renderer={RENDERERS.row}\n row={row}\n table={table}\n className={className}\n onKeyDown={handleKeyDown}\n onKeyDownCapture={handleKeyDownCapture}\n />\n ))}\n </>\n );\n}\n"],"names":["TemporaryRow","props","createRowButtonRef","table","tableMeta","tableRef","isScrolled","current","_tableRef$current","scrollHeight","_tableRef$current2","clientHeight","handleKeyDown","event","key","preventDefault","_temp","isElementTriggeredFromContainer","target","currentTarget","Promise","resolve","editing","saveChanges","then","saved","_createRowButtonRef$c","focus","stopPropagation","_tableRef$current$que","_tableRef$current$que2","_tableRef$current$que3","availableRows","Array","from","querySelectorAll","TEMPORARY_ROW_ID_PREFIX","footerHeight","querySelector","getBoundingClientRect","height","newRowHeight","visibleHeight","tableTopOffset","top","nextRowIndex","index","length","rowRect","topPlusHalfRow","rowActive","setRowActiveIndex","Number","getAttribute","_temp2","e","reject","handleKeyDownCapture","lastFocusedCellIndex","getVisibleFlatColumns","className","clsx","footer","isEnabled","React","getBottomRows","map","row","Row","id","cellRenderer","RENDERERS","cell","measureRow","renderer","onKeyDown","onKeyDownCapture"],"mappings":"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"}