@economic/taco 2.45.0-alpha.0 → 2.45.0-alpha.2
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/Layout/components/Top.d.ts +3 -3
- package/dist/components/Popover/Popover.d.ts +1 -1
- package/dist/components/Provider/Localization.d.ts +2 -0
- package/dist/components/Report/Report.d.ts +1 -1
- package/dist/components/Select2/components/Search.d.ts +0 -6
- package/dist/components/Select2/utilities.d.ts +2 -0
- package/dist/components/Table3/Table3.d.ts +2 -14
- package/dist/components/Table3/components/Columns/Internal/EditingActionsMenu.d.ts +1 -2
- package/dist/components/Table3/components/Editing/DiscardChangesConfirmationDialog.d.ts +7 -0
- package/dist/components/Table3/components/Row/Editing/CreateNewRow.d.ts +14 -0
- package/dist/components/Table3/components/Row/Editing/TemporaryRow.d.ts +11 -0
- package/dist/components/Table3/features/useEditingState.d.ts +29 -0
- package/dist/components/Table3/features/useTableEditing.d.ts +26 -36
- package/dist/components/Table3/listeners/useTableEditingListener.d.ts +1 -1
- package/dist/components/Table3/types.d.ts +24 -8
- package/dist/components/Table3/useTable3.d.ts +6 -0
- package/dist/components/Table3/util/editing.d.ts +7 -1
- package/dist/esm/index.css +35 -4
- package/dist/esm/packages/taco/src/components/Layout/components/Top.js +2 -2
- package/dist/esm/packages/taco/src/components/Layout/components/Top.js.map +1 -1
- package/dist/esm/packages/taco/src/components/ModeSwitch/ModeSwitch.js +2 -2
- package/dist/esm/packages/taco/src/components/ModeSwitch/ModeSwitch.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Popover/Popover.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Provider/Localization.js +5 -3
- package/dist/esm/packages/taco/src/components/Provider/Localization.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/Select2.js +50 -45
- package/dist/esm/packages/taco/src/components/Select2/Select2.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Option.js +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Option.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Search.js +3 -13
- package/dist/esm/packages/taco/src/components/Select2/components/Search.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Trigger.js +19 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Trigger.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/hooks/useChildren.js +1 -10
- package/dist/esm/packages/taco/src/components/Select2/hooks/useChildren.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/utilities.js +11 -1
- package/dist/esm/packages/taco/src/components/Select2/utilities.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Switch/Switch.js +1 -1
- package/dist/esm/packages/taco/src/components/Switch/Switch.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/Table3.js +14 -6
- package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/Editing/RowMoveIndicator.js +1 -2
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/Editing/RowMoveIndicator.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js +33 -11
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js +5 -37
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Editing/Alert.js +17 -12
- package/dist/esm/packages/taco/src/components/Table3/components/Editing/Alert.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.js +34 -0
- package/dist/esm/packages/taco/src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.js.map +1 -0
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateNewRow.js +103 -0
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateNewRow.js.map +1 -0
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/SaveStatus.js +2 -14
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/SaveStatus.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js +96 -0
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js.map +1 -0
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js +39 -6
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Toolbar/Editing/Editing.js +4 -17
- package/dist/esm/packages/taco/src/components/Table3/components/Toolbar/Editing/Editing.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/features/useEditingState.js +519 -0
- package/dist/esm/packages/taco/src/components/Table3/features/useEditingState.js.map +1 -0
- package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js +29 -406
- package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js +44 -33
- package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/useTable3.js +34 -13
- package/dist/esm/packages/taco/src/components/Table3/useTable3.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/util/editing.js +11 -23
- package/dist/esm/packages/taco/src/components/Table3/util/editing.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Collection/components/Root.js +20 -4
- package/dist/esm/packages/taco/src/primitives/Collection/components/Root.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Listbox2/components/Option.js +0 -4
- package/dist/esm/packages/taco/src/primitives/Listbox2/components/Option.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Listbox2/components/Root.js +1 -0
- package/dist/esm/packages/taco/src/primitives/Listbox2/components/Root.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js +1 -3
- package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Cell/BuiltIns/GroupedCell.js +9 -3
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Cell/BuiltIns/GroupedCell.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js +9 -7
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Footer/Footer.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/BuiltIns/DisplayRow.js +2 -2
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/BuiltIns/DisplayRow.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/Row.js +4 -2
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/Row.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/RowContext.js +2 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/RowContext.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterValue.js +8 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterValue.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableRenderer.js +29 -7
- package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableRenderer.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/useTable.js +2 -2
- package/dist/esm/packages/taco/src/primitives/Table/Core/useTable.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/types.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableRowSelection.js +2 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableRowSelection.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableSearch.js +3 -3
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableSearch.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js +11 -0
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js.map +1 -1
- package/dist/esm/packages/taco/src/utils/dom.js +23 -12
- package/dist/esm/packages/taco/src/utils/dom.js.map +1 -1
- package/dist/index.css +35 -4
- package/dist/primitives/Collection/components/Root.d.ts +3 -1
- package/dist/primitives/Table/Core/components/Columns/Internal/Actions.d.ts +3 -1
- package/dist/primitives/Table/Core/components/Footer/Footer.d.ts +1 -1
- package/dist/primitives/Table/Core/components/Row/RowContext.d.ts +1 -0
- package/dist/primitives/Table/Core/features/useTableRenderer.d.ts +2 -2
- package/dist/primitives/Table/Core/features/useTableStyle.d.ts +3 -3
- package/dist/primitives/Table/Core/types.d.ts +4 -0
- package/dist/primitives/Table/Core/useTable.d.ts +2 -2
- package/dist/primitives/Table/types.d.ts +2 -2
- package/dist/primitives/Table/useTableManager/useTableManager.d.ts +1 -1
- package/dist/taco.cjs.development.js +1130 -756
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/dist/utils/dom.d.ts +2 -1
- package/package.json +16 -16
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js +0 -90
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js.map +0 -1
@@ -0,0 +1,96 @@
|
|
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
|
+
const {
|
10
|
+
createRowButtonRef,
|
11
|
+
table,
|
12
|
+
tableMeta,
|
13
|
+
tableRef
|
14
|
+
} = props;
|
15
|
+
const handleKeyDown = function (event) {
|
16
|
+
try {
|
17
|
+
const _temp2 = function () {
|
18
|
+
if (event.key === 'ArrowDown') {
|
19
|
+
event.preventDefault();
|
20
|
+
const _temp = function () {
|
21
|
+
if (!isElementTriggeredFromContainer(event.target, event.currentTarget)) {
|
22
|
+
return Promise.resolve(tableMeta.editing.saveChanges(table)).then(function (saved) {
|
23
|
+
if (saved) {
|
24
|
+
var _createRowButtonRef$c;
|
25
|
+
(_createRowButtonRef$c = createRowButtonRef.current) === null || _createRowButtonRef$c === void 0 ? void 0 : _createRowButtonRef$c.focus();
|
26
|
+
}
|
27
|
+
});
|
28
|
+
}
|
29
|
+
}();
|
30
|
+
if (_temp && _temp.then) return _temp.then(function () {});
|
31
|
+
} else if (event.key === 'ArrowUp') {
|
32
|
+
event.preventDefault();
|
33
|
+
event.stopPropagation();
|
34
|
+
if (tableRef.current) {
|
35
|
+
var _tableRef$current$que, _tableRef$current$que2, _tableRef$current$que3;
|
36
|
+
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 : []);
|
37
|
+
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;
|
38
|
+
const newRowHeight = event.currentTarget.getBoundingClientRect().height;
|
39
|
+
const visibleHeight = tableRef.current.clientHeight - footerHeight - newRowHeight;
|
40
|
+
const tableTopOffset = tableRef.current.getBoundingClientRect().top;
|
41
|
+
let nextRowIndex;
|
42
|
+
// iterate available rows in reverse order, since we're working at the bottom
|
43
|
+
for (let index = availableRows.length - 1; index >= 0; index--) {
|
44
|
+
const rowRect = availableRows[index].getBoundingClientRect();
|
45
|
+
const topPlusHalfRow = rowRect.top + rowRect.height / 2;
|
46
|
+
if (topPlusHalfRow - tableTopOffset <= visibleHeight) {
|
47
|
+
nextRowIndex = index;
|
48
|
+
break;
|
49
|
+
}
|
50
|
+
}
|
51
|
+
if (nextRowIndex) {
|
52
|
+
tableMeta.rowActive.setRowActiveIndex(Number(availableRows[nextRowIndex < 0 ? 0 : nextRowIndex].getAttribute('data-row-index')));
|
53
|
+
}
|
54
|
+
}
|
55
|
+
}
|
56
|
+
}();
|
57
|
+
return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
|
58
|
+
} catch (e) {
|
59
|
+
return Promise.reject(e);
|
60
|
+
}
|
61
|
+
};
|
62
|
+
const handleKeyDownCapture = event => {
|
63
|
+
if (event.key === 'ArrowLeft' && tableMeta.editing.lastFocusedCellIndex === 0) {
|
64
|
+
event.preventDefault();
|
65
|
+
event.stopPropagation();
|
66
|
+
} else if (event.key === 'ArrowRight' && tableMeta.editing.lastFocusedCellIndex) {
|
67
|
+
if (tableMeta.editing.lastFocusedCellIndex === table.getVisibleFlatColumns().length - 1) {
|
68
|
+
event.preventDefault();
|
69
|
+
event.stopPropagation();
|
70
|
+
}
|
71
|
+
}
|
72
|
+
};
|
73
|
+
const isScrolled = tableRef.current ? tableRef.current.scrollHeight > tableRef.current.clientHeight : false;
|
74
|
+
const className = cn('group/row border-grey-300 !sticky z-[22]', {
|
75
|
+
'bottom-[calc(5rem_+_3px)] data-[row-editing-move]:bottom-[calc(5rem_+_2px)]': tableMeta.footer.isEnabled,
|
76
|
+
'bottom-[calc(2.5rem_+_3px)] data-[row-editing-move]:bottom-[calc(2.5rem_+_2px)]': !tableMeta.footer.isEnabled,
|
77
|
+
'border-t-2 shadow-[0px_-5px_20px_0px_rgba(0,0,0,0.1)] [&>td]:!border-b-0': isScrolled
|
78
|
+
});
|
79
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, table.getBottomRows().map(row => (/*#__PURE__*/React__default.createElement(Row, {
|
80
|
+
key: row.id,
|
81
|
+
cellRenderer: RENDERERS.cell,
|
82
|
+
index: tableMeta.length,
|
83
|
+
measureRow: () => null,
|
84
|
+
renderer: RENDERERS.row,
|
85
|
+
row: row,
|
86
|
+
table: table,
|
87
|
+
className: className,
|
88
|
+
onKeyDown: handleKeyDown,
|
89
|
+
onKeyDownCapture: handleKeyDownCapture,
|
90
|
+
// Row actions should only be hidden on temporary rows when editing is turned off
|
91
|
+
hideRowActions: !tableMeta.editing.isEditing
|
92
|
+
}))));
|
93
|
+
}
|
94
|
+
|
95
|
+
export { TemporaryRow };
|
96
|
+
//# sourceMappingURL=TemporaryRow.js.map
|
package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js.map
ADDED
@@ -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 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 isScrolled = tableRef.current ? tableRef.current.scrollHeight > tableRef.current.clientHeight : false;\n\n const className = clsx('group/row border-grey-300 !sticky z-[22]', {\n 'bottom-[calc(5rem_+_3px)] data-[row-editing-move]:bottom-[calc(5rem_+_2px)]': tableMeta.footer.isEnabled,\n 'bottom-[calc(2.5rem_+_3px)] data-[row-editing-move]:bottom-[calc(2.5rem_+_2px)]': !tableMeta.footer.isEnabled,\n 'border-t-2 shadow-[0px_-5px_20px_0px_rgba(0,0,0,0.1)] [&>td]:!border-b-0': 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 // Row actions should only be hidden on temporary rows when editing is turned off\n hideRowActions={!tableMeta.editing.isEditing}\n />\n ))}\n </>\n );\n}\n"],"names":["TemporaryRow","props","createRowButtonRef","table","tableMeta","tableRef","handleKeyDown","event","key","preventDefault","_temp","isElementTriggeredFromContainer","target","currentTarget","Promise","resolve","editing","saveChanges","then","saved","_createRowButtonRef$c","current","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","clientHeight","tableTopOffset","top","nextRowIndex","index","length","rowRect","topPlusHalfRow","rowActive","setRowActiveIndex","Number","getAttribute","_temp2","e","reject","handleKeyDownCapture","lastFocusedCellIndex","getVisibleFlatColumns","isScrolled","scrollHeight","className","clsx","footer","isEnabled","React","getBottomRows","map","row","Row","id","cellRenderer","RENDERERS","cell","measureRow","renderer","onKeyDown","onKeyDownCapture","hideRowActions","isEditing"],"mappings":"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"}
|
@@ -1,7 +1,9 @@
|
|
1
1
|
import React__default from 'react';
|
2
|
-
import { setDataFocusAttribute } from '../../../../utils/dom.js';
|
2
|
+
import { setDataFocusAttribute, isElementTriggeredFromContainer } from '../../../../utils/dom.js';
|
3
3
|
import { DisplayRow } from '../../../../primitives/Table/Core/components/Row/BuiltIns/DisplayRow.js';
|
4
4
|
import { useAugmentedFocusManager } from '../../../../primitives/Table/Core/components/Body/util.js';
|
5
|
+
import { isTemporaryRow } from '../../util/editing.js';
|
6
|
+
import { DiscardChangesConfirmationDialog } from '../Editing/DiscardChangesConfirmationDialog.js';
|
5
7
|
import { SaveStatus } from './Editing/SaveStatus.js';
|
6
8
|
|
7
9
|
function Row(props) {
|
@@ -30,15 +32,46 @@ function Row(props) {
|
|
30
32
|
}
|
31
33
|
}
|
32
34
|
}, [tableMeta.editing.isEditing, isActiveRow]);
|
35
|
+
const rowStatus = tableMeta.editing.getRowStatus(row.id);
|
36
|
+
// discard new row
|
37
|
+
const [showDiscardDialog, setShowDiscardDialog] = React__default.useState(false);
|
38
|
+
function handleDiscard() {
|
39
|
+
tableMeta.editing.discardChanges(row.id, table);
|
40
|
+
requestAnimationFrame(() => {
|
41
|
+
if (isTemporaryRow(row.id)) {
|
42
|
+
var _tableMeta$editing$cr;
|
43
|
+
(_tableMeta$editing$cr = tableMeta.editing.createRowButtonRef.current) === null || _tableMeta$editing$cr === void 0 ? void 0 : _tableMeta$editing$cr.focus();
|
44
|
+
} else {
|
45
|
+
focusManager.focusFirst();
|
46
|
+
}
|
47
|
+
});
|
48
|
+
}
|
49
|
+
function handleKeyDown(event) {
|
50
|
+
if (props.onKeyDown) {
|
51
|
+
props.onKeyDown(event);
|
52
|
+
}
|
53
|
+
if (event.isDefaultPrevented() || event.isPropagationStopped()) {
|
54
|
+
return;
|
55
|
+
}
|
56
|
+
if (event.key === 'Escape' && tableMeta.editing.hasChanges(row.id) && !isElementTriggeredFromContainer(event.target, event.currentTarget)) {
|
57
|
+
event.preventDefault();
|
58
|
+
setShowDiscardDialog(true);
|
59
|
+
}
|
60
|
+
}
|
33
61
|
const attributes = {
|
34
|
-
'data-row-editing-invalid': tableMeta.editing.
|
35
|
-
'data-row-editing-status':
|
36
|
-
onFocus: handleFocus
|
62
|
+
'data-row-editing-invalid': tableMeta.editing.hasRowErrors(row.id) ? !tableMeta.editing.hasRowErrorsShownInAlert(row.id) ? 'unseen' : true : undefined,
|
63
|
+
'data-row-editing-status': rowStatus,
|
64
|
+
onFocus: handleFocus,
|
65
|
+
onKeyDown: handleKeyDown
|
37
66
|
};
|
38
|
-
return /*#__PURE__*/React__default.createElement(DisplayRow, Object.assign({}, props, attributes),
|
67
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(DisplayRow, Object.assign({}, props, attributes), rowStatus === 'saving' || rowStatus === 'saved' ? /*#__PURE__*/React__default.createElement(SaveStatus, {
|
39
68
|
rowId: row.id,
|
40
69
|
table: table
|
41
|
-
}) : null)
|
70
|
+
}) : null), /*#__PURE__*/React__default.createElement(DiscardChangesConfirmationDialog, {
|
71
|
+
open: showDiscardDialog,
|
72
|
+
onChange: setShowDiscardDialog,
|
73
|
+
onDiscard: handleDiscard
|
74
|
+
}));
|
42
75
|
}
|
43
76
|
|
44
77
|
export { Row };
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Row.js","sources":["../../../../../../../../../src/components/Table3/components/Row/Row.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { DisplayRow, DisplayRowProps } from '../../../../primitives/Table/Core/components/Row/BuiltIns/DisplayRow';\nimport { SaveStatus } from './Editing/SaveStatus';\nimport { useAugmentedFocusManager } from '../../../../primitives/Table/Core/components/Body/util';\nimport { setDataFocusAttribute } from '../../../../utils/dom';\n\nexport function Row<TType = unknown>(props: DisplayRowProps<TType>) {\n const { row, index, table } = props;\n const focusManager = useAugmentedFocusManager();\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === index;\n\n React.useEffect(() => {\n if (tableMeta.editing.isEditing && isActiveRow && tableMeta.editing.lastFocusedCellIndex === undefined) {\n const element = focusManager.focusFirst();\n if (element) {\n setDataFocusAttribute(element);\n }\n }\n }, [tableMeta.editing.isEditing, tableMeta.rowActive.rowActiveIndex, tableMeta.editing.lastFocusedCellIndex]);\n\n const handleFocus = React.useCallback(\n (event: React.FocusEvent<HTMLTableRowElement>) => {\n if (tableMeta.editing.isEditing) {\n const cellIndex = Number(event.target.closest('td')?.getAttribute('data-cell-index') ?? undefined);\n\n if (!isNaN(cellIndex)) {\n tableMeta.editing.setLastFocusedCellIndex(Number(cellIndex));\n }\n }\n },\n [tableMeta.editing.isEditing, isActiveRow]\n );\n\n const
|
1
|
+
{"version":3,"file":"Row.js","sources":["../../../../../../../../../src/components/Table3/components/Row/Row.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { DisplayRow, DisplayRowProps } from '../../../../primitives/Table/Core/components/Row/BuiltIns/DisplayRow';\nimport { SaveStatus } from './Editing/SaveStatus';\nimport { useAugmentedFocusManager } from '../../../../primitives/Table/Core/components/Body/util';\nimport { isElementTriggeredFromContainer, setDataFocusAttribute } from '../../../../utils/dom';\nimport { DiscardChangesConfirmationDialog } from '../Editing/DiscardChangesConfirmationDialog';\nimport { isTemporaryRow } from '../../util/editing';\n\nexport function Row<TType = unknown>(props: DisplayRowProps<TType>) {\n const { row, index, table } = props;\n const focusManager = useAugmentedFocusManager();\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === index;\n\n React.useEffect(() => {\n if (tableMeta.editing.isEditing && isActiveRow && tableMeta.editing.lastFocusedCellIndex === undefined) {\n const element = focusManager.focusFirst();\n if (element) {\n setDataFocusAttribute(element);\n }\n }\n }, [tableMeta.editing.isEditing, tableMeta.rowActive.rowActiveIndex, tableMeta.editing.lastFocusedCellIndex]);\n\n const handleFocus = React.useCallback(\n (event: React.FocusEvent<HTMLTableRowElement>) => {\n if (tableMeta.editing.isEditing) {\n const cellIndex = Number(event.target.closest('td')?.getAttribute('data-cell-index') ?? undefined);\n\n if (!isNaN(cellIndex)) {\n tableMeta.editing.setLastFocusedCellIndex(Number(cellIndex));\n }\n }\n },\n [tableMeta.editing.isEditing, isActiveRow]\n );\n\n const rowStatus = tableMeta.editing.getRowStatus(row.id);\n\n // discard new row\n const [showDiscardDialog, setShowDiscardDialog] = React.useState(false);\n\n function handleDiscard() {\n tableMeta.editing.discardChanges(row.id, table);\n requestAnimationFrame(() => {\n if (isTemporaryRow(row.id)) {\n tableMeta.editing.createRowButtonRef.current?.focus();\n } else {\n focusManager.focusFirst();\n }\n });\n }\n\n function handleKeyDown(event: React.KeyboardEvent<HTMLTableRowElement>) {\n if (props.onKeyDown) {\n props.onKeyDown(event);\n }\n\n if (event.isDefaultPrevented() || event.isPropagationStopped()) {\n return;\n }\n\n if (\n event.key === 'Escape' &&\n tableMeta.editing.hasChanges(row.id) &&\n !isElementTriggeredFromContainer(event.target as HTMLElement, event.currentTarget)\n ) {\n event.preventDefault();\n setShowDiscardDialog(true);\n }\n }\n\n const attributes = {\n 'data-row-editing-invalid': tableMeta.editing.hasRowErrors(row.id)\n ? !tableMeta.editing.hasRowErrorsShownInAlert(row.id)\n ? 'unseen'\n : true\n : undefined,\n 'data-row-editing-status': rowStatus,\n onFocus: handleFocus,\n onKeyDown: handleKeyDown,\n };\n\n return (\n <>\n <DisplayRow<TType> {...props} {...attributes}>\n {rowStatus === 'saving' || rowStatus === 'saved' ? <SaveStatus rowId={row.id} table={table} /> : null}\n </DisplayRow>\n <DiscardChangesConfirmationDialog\n open={showDiscardDialog}\n onChange={setShowDiscardDialog}\n onDiscard={handleDiscard}\n />\n </>\n );\n}\n"],"names":["Row","props","row","index","table","focusManager","useAugmentedFocusManager","tableMeta","options","meta","isActiveRow","rowActive","rowActiveIndex","React","useEffect","editing","isEditing","lastFocusedCellIndex","undefined","element","focusFirst","setDataFocusAttribute","handleFocus","useCallback","event","_event$target$closest","_event$target$closest2","cellIndex","Number","target","closest","getAttribute","isNaN","setLastFocusedCellIndex","rowStatus","getRowStatus","id","showDiscardDialog","setShowDiscardDialog","useState","handleDiscard","discardChanges","requestAnimationFrame","isTemporaryRow","_tableMeta$editing$cr","createRowButtonRef","current","focus","handleKeyDown","onKeyDown","isDefaultPrevented","isPropagationStopped","key","hasChanges","isElementTriggeredFromContainer","currentTarget","preventDefault","attributes","hasRowErrors","hasRowErrorsShownInAlert","onFocus","DisplayRow","SaveStatus","rowId","DiscardChangesConfirmationDialog","open","onChange","onDiscard"],"mappings":"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"}
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import React__default from 'react';
|
2
|
-
import { useGlobalKeyDown } from '../../../../../hooks/useGlobalKeyDown.js';
|
3
2
|
import { Tooltip } from '../../../../Tooltip/Tooltip.js';
|
4
3
|
import { useLocalization } from '../../../../Provider/Localization.js';
|
5
4
|
import { Shortcut } from '../../../../Shortcut/Shortcut.js';
|
6
5
|
import { ModeSwitch } from '../../../../ModeSwitch/ModeSwitch.js';
|
6
|
+
import { shortcut } from '../../../util/editing.js';
|
7
7
|
|
8
8
|
function Editing(props) {
|
9
9
|
const {
|
@@ -15,30 +15,17 @@ function Editing(props) {
|
|
15
15
|
} = useLocalization();
|
16
16
|
const ref = React__default.useRef(null);
|
17
17
|
const tableMeta = table.options.meta;
|
18
|
-
const
|
19
|
-
|
20
|
-
meta: true,
|
21
|
-
shift: false
|
18
|
+
const handleChange = enabled => {
|
19
|
+
tableMeta.editing.toggleEditing(enabled, table, scrollToIndex);
|
22
20
|
};
|
23
21
|
const tooltip = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, texts.table3.editing.buttons.edit.tooltip, /*#__PURE__*/React__default.createElement(Shortcut, {
|
24
22
|
className: "ml-2",
|
25
23
|
keys: shortcut
|
26
24
|
}));
|
27
|
-
useGlobalKeyDown(shortcut, event => {
|
28
|
-
var _ref$current;
|
29
|
-
event.preventDefault();
|
30
|
-
(_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.click();
|
31
|
-
});
|
32
|
-
const handleChange = enabled => {
|
33
|
-
tableMeta.editing.toggleEditing(enabled);
|
34
|
-
requestAnimationFrame(() => {
|
35
|
-
var _tableMeta$rowActive$;
|
36
|
-
return scrollToIndex((_tableMeta$rowActive$ = tableMeta.rowActive.rowActiveIndex) !== null && _tableMeta$rowActive$ !== void 0 ? _tableMeta$rowActive$ : 0);
|
37
|
-
});
|
38
|
-
};
|
39
25
|
return /*#__PURE__*/React__default.createElement(Tooltip, {
|
40
26
|
title: tooltip
|
41
27
|
}, /*#__PURE__*/React__default.createElement(ModeSwitch, {
|
28
|
+
"data-table": "editing-toggle",
|
42
29
|
checked: tableMeta.editing.isEditing,
|
43
30
|
onChange: handleChange,
|
44
31
|
ref: ref
|
package/dist/esm/packages/taco/src/components/Table3/components/Toolbar/Editing/Editing.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Editing.js","sources":["../../../../../../../../../../src/components/Table3/components/Toolbar/Editing/Editing.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { ModeSwitch } from '../../../../ModeSwitch/ModeSwitch';\nimport {
|
1
|
+
{"version":3,"file":"Editing.js","sources":["../../../../../../../../../../src/components/Table3/components/Toolbar/Editing/Editing.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { ModeSwitch } from '../../../../ModeSwitch/ModeSwitch';\nimport { Shortcut } from '../../../../Shortcut/Shortcut';\nimport { shortcut } from '../../../util/editing';\n\ntype EditingProps<TType = unknown> = React.HTMLAttributes<HTMLButtonElement> & {\n scrollToIndex: any;\n table: ReactTable<TType>;\n};\n\nexport function Editing<TType = unknown>(props: EditingProps<TType>) {\n const { scrollToIndex, table } = props;\n const { texts } = useLocalization();\n const ref = React.useRef<HTMLButtonElement>(null);\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n const handleChange = (enabled: boolean) => {\n tableMeta.editing.toggleEditing(enabled, table, scrollToIndex);\n };\n\n const tooltip = (\n <>\n {texts.table3.editing.buttons.edit.tooltip}\n <Shortcut className=\"ml-2\" keys={shortcut} />\n </>\n );\n\n return (\n <Tooltip title={tooltip}>\n <ModeSwitch data-table=\"editing-toggle\" checked={tableMeta.editing.isEditing} onChange={handleChange} ref={ref} />\n </Tooltip>\n );\n}\n"],"names":["Editing","props","scrollToIndex","table","texts","useLocalization","ref","React","useRef","tableMeta","options","meta","handleChange","enabled","editing","toggleEditing","tooltip","table3","buttons","edit","Shortcut","className","keys","shortcut","Tooltip","title","ModeSwitch","checked","isEditing","onChange"],"mappings":";;;;;;;SAagBA,OAAOA,CAAkBC,KAA0B;EAC/D,MAAM;IAAEC,aAAa;IAAEC;GAAO,GAAGF,KAAK;EACtC,MAAM;IAAEG;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,GAAG,GAAGC,cAAK,CAACC,MAAM,CAAoB,IAAI,CAAC;EACjD,MAAMC,SAAS,GAAGN,KAAK,CAACO,OAAO,CAACC,IAA6B;EAE7D,MAAMC,YAAY,GAAIC,OAAgB;IAClCJ,SAAS,CAACK,OAAO,CAACC,aAAa,CAACF,OAAO,EAAEV,KAAK,EAAED,aAAa,CAAC;GACjE;EAED,MAAMc,OAAO,gBACTT,4DACKH,KAAK,CAACa,MAAM,CAACH,OAAO,CAACI,OAAO,CAACC,IAAI,CAACH,OAAO,eAC1CT,6BAACa,QAAQ;IAACC,SAAS,EAAC,MAAM;IAACC,IAAI,EAAEC;IAAY,CAEpD;EAED,oBACIhB,6BAACiB,OAAO;IAACC,KAAK,EAAET;kBACZT,6BAACmB,UAAU;kBAAY,gBAAgB;IAACC,OAAO,EAAElB,SAAS,CAACK,OAAO,CAACc,SAAS;IAAEC,QAAQ,EAAEjB,YAAY;IAAEN,GAAG,EAAEA;IAAO,CAC5G;AAElB;;;;"}
|