@economic/taco 2.45.4 → 2.46.1

package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js.map

@@ -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            setDataFocusAttribute(focusManager.focusFirst());\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 attributes = {\n        'data-row-editing-invalid':\n            tableMeta.editing.isEnabled && tableMeta.editing.hasRowErrors(row.id)\n                ? !tableMeta.editing.hasRowErrorsSeen(row.id)\n                    ? 'unseen'\n                    : true\n                : undefined,\n        'data-row-editing-status':\n            tableMeta.editing.isEnabled && tableMeta.editing.getRowSaveStatus(row.id)\n                ? tableMeta.editing.getRowSaveStatus(row.id)\n                : undefined,\n        onFocus: handleFocus,\n    };\n\n    return (\n        <DisplayRow<TType> {...props} {...attributes}>\n            {tableMeta.editing.getRowSaveStatus(row.id) ? <SaveStatus rowId={row.id} table={table} /> : null}\n        </DisplayRow>\n    );\n}\n"],"names":["Row","props","row","index","table","focusManager","useAugmentedFocusManager","tableMeta","options","meta","isActiveRow","rowActive","rowActiveIndex","React","useEffect","editing","isEditing","lastFocusedCellIndex","undefined","setDataFocusAttribute","focusFirst","handleFocus","useCallback","event","_event$target$closest","_event$target$closest2","cellIndex","Number","target","closest","getAttribute","isNaN","setLastFocusedCellIndex","attributes","isEnabled","hasRowErrors","id","hasRowErrorsSeen","getRowSaveStatus","onFocus","DisplayRow","SaveStatus","rowId"],"mappings":";;;;;;SAOgBA,GAAGA,CAAkBC,KAA6B;EAC9D,MAAM;IAAEC,GAAG;IAAEC,KAAK;IAAEC;GAAO,GAAGH,KAAK;EACnC,MAAMI,YAAY,GAAGC,wBAAwB,EAAE;EAC/C,MAAMC,SAAS,GAAGH,KAAK,CAACI,OAAO,CAACC,IAA6B;EAC7D,MAAMC,WAAW,GAAGH,SAAS,CAACI,SAAS,CAACC,cAAc,KAAKT,KAAK;EAEhEU,cAAK,CAACC,SAAS,CAAC;IACZ,IAAIP,SAAS,CAACQ,OAAO,CAACC,SAAS,IAAIN,WAAW,IAAIH,SAAS,CAACQ,OAAO,CAACE,oBAAoB,KAAKC,SAAS,EAAE;MACpGC,qBAAqB,CAACd,YAAY,CAACe,UAAU,EAAE,CAAC;;GAEvD,EAAE,CAACb,SAAS,CAACQ,OAAO,CAACC,SAAS,EAAET,SAAS,CAACI,SAAS,CAACC,cAAc,EAAEL,SAAS,CAACQ,OAAO,CAACE,oBAAoB,CAAC,CAAC;EAE7G,MAAMI,WAAW,GAAGR,cAAK,CAACS,WAAW,CAChCC,KAA4C;IACzC,IAAIhB,SAAS,CAACQ,OAAO,CAACC,SAAS,EAAE;MAAA,IAAAQ,qBAAA,EAAAC,sBAAA;MAC7B,MAAMC,SAAS,GAAGC,MAAM,EAAAH,qBAAA,IAAAC,sBAAA,GAACF,KAAK,CAACK,MAAM,CAACC,OAAO,CAAC,IAAI,CAAC,cAAAJ,sBAAA,uBAA1BA,sBAAA,CAA4BK,YAAY,CAAC,iBAAiB,CAAC,cAAAN,qBAAA,cAAAA,qBAAA,GAAIN,SAAS,CAAC;MAElG,IAAI,CAACa,KAAK,CAACL,SAAS,CAAC,EAAE;QACnBnB,SAAS,CAACQ,OAAO,CAACiB,uBAAuB,CAACL,MAAM,CAACD,SAAS,CAAC,CAAC;;;GAGvE,EACD,CAACnB,SAAS,CAACQ,OAAO,CAACC,SAAS,EAAEN,WAAW,CAAC,CAC7C;EAED,MAAMuB,UAAU,GAAG;IACf,0BAA0B,EACtB1B,SAAS,CAACQ,OAAO,CAACmB,SAAS,IAAI3B,SAAS,CAACQ,OAAO,CAACoB,YAAY,CAACjC,GAAG,CAACkC,EAAE,CAAC,GAC/D,CAAC7B,SAAS,CAACQ,OAAO,CAACsB,gBAAgB,CAACnC,GAAG,CAACkC,EAAE,CAAC,GACvC,QAAQ,GACR,IAAI,GACRlB,SAAS;IACnB,yBAAyB,EACrBX,SAAS,CAACQ,OAAO,CAACmB,SAAS,IAAI3B,SAAS,CAACQ,OAAO,CAACuB,gBAAgB,CAACpC,GAAG,CAACkC,EAAE,CAAC,GACnE7B,SAAS,CAACQ,OAAO,CAACuB,gBAAgB,CAACpC,GAAG,CAACkC,EAAE,CAAC,GAC1ClB,SAAS;IACnBqB,OAAO,EAAElB;GACZ;EAED,oBACIR,6BAAC2B,UAAU,oBAAYvC,KAAK,EAAMgC,UAAU,GACvC1B,SAAS,CAACQ,OAAO,CAACuB,gBAAgB,CAACpC,GAAG,CAACkC,EAAE,CAAC,gBAAGvB,6BAAC4B,UAAU;IAACC,KAAK,EAAExC,GAAG,CAACkC,EAAE;IAAEhC,KAAK,EAAEA;IAAS,GAAG,IAAI,CACvF;AAErB;;;;"}
+{"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            setDataFocusAttribute(focusManager.focusFirst());\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","setDataFocusAttribute","focusFirst","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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"}

package/dist/esm/packages/taco/src/components/Table3/components/Toolbar/Editing/Editing.js

@@ -1,9 +1,9 @@
 import React__default from 'react';
-import { useGlobalKeyDown } from '../../../../../hooks/useGlobalKeyDown.js';
 import { Tooltip } from '../../../../Tooltip/Tooltip.js';
 import { useLocalization } from '../../../../Provider/Localization.js';
 import { Shortcut } from '../../../../Shortcut/Shortcut.js';
 import { ModeSwitch } from '../../../../ModeSwitch/ModeSwitch.js';
+import { shortcut } from '../../../util/editing.js';
 
 function Editing(props) {
   const {
@@ -15,30 +15,17 @@ function Editing(props) {
   } = useLocalization();
   const ref = React__default.useRef(null);
   const tableMeta = table.options.meta;
-  const shortcut = {
-    key: 'e',
-    meta: true,
-    shift: false
+  const handleChange = enabled => {
+    tableMeta.editing.toggleEditing(enabled, table, scrollToIndex);
   };
   const tooltip = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, texts.table3.editing.buttons.edit.tooltip, /*#__PURE__*/React__default.createElement(Shortcut, {
     className: "ml-2",
     keys: shortcut
   }));
-  useGlobalKeyDown(shortcut, event => {
-    var _ref$current;
-    event.preventDefault();
-    (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.click();
-  });
-  const handleChange = enabled => {
-    tableMeta.editing.toggleEditing(enabled);
-    requestAnimationFrame(() => {
-      var _tableMeta$rowActive$;
-      return scrollToIndex((_tableMeta$rowActive$ = tableMeta.rowActive.rowActiveIndex) !== null && _tableMeta$rowActive$ !== void 0 ? _tableMeta$rowActive$ : 0);
-    });
-  };
   return /*#__PURE__*/React__default.createElement(Tooltip, {
     title: tooltip
   }, /*#__PURE__*/React__default.createElement(ModeSwitch, {
+    "data-table": "editing-toggle",
     checked: tableMeta.editing.isEditing,
     onChange: handleChange,
     ref: ref

package/dist/esm/packages/taco/src/components/Table3/components/Toolbar/Editing/Editing.js.map

@@ -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 { useGlobalKeyDown } from '../../../../../hooks/useGlobalKeyDown';\nimport { Shortcut } from '../../../../Shortcut/Shortcut';\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 shortcut = { key: 'e', meta: true, shift: false };\n    const tooltip = (\n        <>\n            {texts.table3.editing.buttons.edit.tooltip}\n            <Shortcut className=\"ml-2\" keys={shortcut} />\n        </>\n    );\n\n    useGlobalKeyDown(shortcut, (event: KeyboardEvent) => {\n        event.preventDefault();\n        ref.current?.click();\n    });\n\n    const handleChange = (enabled: boolean) => {\n        tableMeta.editing.toggleEditing(enabled);\n        requestAnimationFrame(() => scrollToIndex(tableMeta.rowActive.rowActiveIndex ?? 0));\n    };\n\n    return (\n        <Tooltip title={tooltip}>\n            <ModeSwitch 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","shortcut","key","shift","tooltip","table3","editing","buttons","edit","Shortcut","className","keys","useGlobalKeyDown","event","preventDefault","_ref$current","current","click","handleChange","enabled","toggleEditing","requestAnimationFrame","_tableMeta$rowActive$","rowActive","rowActiveIndex","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,QAAQ,GAAG;IAAEC,GAAG,EAAE,GAAG;IAAEF,IAAI,EAAE,IAAI;IAAEG,KAAK,EAAE;GAAO;EACvD,MAAMC,OAAO,gBACTR,4DACKH,KAAK,CAACY,MAAM,CAACC,OAAO,CAACC,OAAO,CAACC,IAAI,CAACJ,OAAO,eAC1CR,6BAACa,QAAQ;IAACC,SAAS,EAAC,MAAM;IAACC,IAAI,EAAEV;IAAY,CAEpD;EAEDW,gBAAgB,CAACX,QAAQ,EAAGY,KAAoB;;IAC5CA,KAAK,CAACC,cAAc,EAAE;IACtB,CAAAC,YAAA,GAAApB,GAAG,CAACqB,OAAO,cAAAD,YAAA,uBAAXA,YAAA,CAAaE,KAAK,EAAE;GACvB,CAAC;EAEF,MAAMC,YAAY,GAAIC,OAAgB;IAClCrB,SAAS,CAACQ,OAAO,CAACc,aAAa,CAACD,OAAO,CAAC;IACxCE,qBAAqB,CAAC;MAAA,IAAAC,qBAAA;MAAA,OAAM/B,aAAa,EAAA+B,qBAAA,GAACxB,SAAS,CAACyB,SAAS,CAACC,cAAc,cAAAF,qBAAA,cAAAA,qBAAA,GAAI,CAAC,CAAC;MAAC;GACtF;EAED,oBACI1B,6BAAC6B,OAAO;IAACC,KAAK,EAAEtB;kBACZR,6BAAC+B,UAAU;IAACC,OAAO,EAAE9B,SAAS,CAACQ,OAAO,CAACuB,SAAS;IAAEC,QAAQ,EAAEZ,YAAY;IAAEvB,GAAG,EAAEA;IAAO,CAChF;AAElB;;;;"}
+{"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;;;;"}

package/dist/esm/packages/taco/src/components/Table3/features/useEditingState.js

@@ -0,0 +1,519 @@
+import React__default from 'react';
+import { useLocalization } from '../../Provider/Localization.js';
+import { v4 } from 'uuid';
+import { _forOf, _catch } from '../../../../../../node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js';
+import { isTemporaryRow, willRowMove, TEMPORARY_ROW_ID_PREFIX } from '../util/editing.js';
+import omit from 'lodash-es/omit';
+import setWith from 'lodash-es/setWith';
+
+const DELAY_BEFORE_REMOVING_SAVE_STATUS = 3000;
+function reducer(state, action) {
+  const {
+    type,
+    rowId,
+    payload
+  } = action;
+  switch (type) {
+    case 'setCellValue':
+      {
+        const {
+          columnId,
+          row,
+          value
+        } = payload;
+        return {
+          ...state,
+          changes: {
+            ...state.changes,
+            rows: setWith(state.changes.rows, `${rowId}.${columnId}`, value, Object),
+            originals: setWith(state.changes.originals, rowId, row, Object)
+          }
+        };
+      }
+    case 'removeCellValue':
+      {
+        const {
+          columnId,
+          rowIdentityAccessor
+        } = payload;
+        const changes = omit(state.changes.rows, `${rowId}.${columnId}`);
+        // if there are no changes left, remove the row
+        if (!Object.keys(changes[rowId]).length) {
+          return reducer(state, {
+            type: 'removeRow',
+            rowId,
+            payload: {
+              rowIdentityAccessor
+            }
+          });
+        }
+        return {
+          ...state,
+          changes: {
+            ...state.changes,
+            rows: omit(state.changes.rows, `${rowId}.${columnId}`),
+            errors: omit(state.changes.errors, `${rowId}.cells.${columnId}`),
+            moveReasons: omit(state.changes.moveReasons, `${rowId}.${columnId}`)
+          }
+        };
+      }
+    case 'updateRow':
+      {
+        const {
+          cellErrors,
+          moveReasons,
+          original,
+          value
+        } = payload;
+        return {
+          ...state,
+          changes: {
+            ...state.changes,
+            rows: setWith(state.changes.rows, rowId, value, Object),
+            errors: setWith(state.changes.errors, `${rowId}.cells`, cellErrors !== null && cellErrors !== void 0 ? cellErrors : state.changes.errors.cells[rowId], Object),
+            originals: setWith(state.changes.originals, rowId, original !== null && original !== void 0 ? original : state.changes.originals[rowId], Object),
+            moveReasons: setWith(state.changes.moveReasons, rowId, moveReasons !== null && moveReasons !== void 0 ? moveReasons : state.changes.moveReasons[rowId], Object),
+            // status can be undefined, so don't use ??
+            status: setWith(state.changes.status, rowId, undefined, Object)
+          }
+        };
+      }
+    case 'removeRow':
+      {
+        const {
+          rowIdentityAccessor
+        } = payload;
+        return {
+          ...state,
+          changes: {
+            ...state.changes,
+            rows: omit(state.changes.rows, rowId),
+            errors: omit(state.changes.errors, rowId),
+            moveReasons: omit(state.changes.moveReasons, rowId),
+            originals: omit(state.changes.originals, rowId),
+            status: omit(state.changes.status, rowId)
+          },
+          temporaryRows: state.temporaryRows.filter(row => row[rowIdentityAccessor] !== rowId)
+        };
+      }
+    case 'setRowStatus':
+      {
+        const {
+          status
+        } = payload;
+        return {
+          ...state,
+          changes: {
+            ...state.changes,
+            status: status ? setWith(state.changes.status, rowId, status, Object) : omit(state.changes.status, rowId)
+          }
+        };
+      }
+    case 'setRowErrors':
+      {
+        const {
+          ...errors
+        } = payload;
+        return {
+          ...state,
+          changes: {
+            ...state.changes,
+            errors: setWith(state.changes.errors, rowId, errors, Object)
+          }
+        };
+      }
+    case 'createRow':
+      {
+        const {
+          value
+        } = payload;
+        return {
+          ...state,
+          temporaryRows: state.temporaryRows.concat(value),
+          changes: {
+            ...state.changes,
+            rows: setWith(state.changes.rows, rowId, value, Object),
+            originals: setWith(state.changes.originals, rowId, value, Object)
+          }
+        };
+      }
+    default:
+      return state;
+  }
+}
+function usePendingChangesState(handleSave, handleChange, rowIdentityAccessor, validator) {
+  const saveChanges = function (table, rowId = undefined) {
+    try {
+      let _exit = false;
+      if (!handleSave) {
+        console.warn('Tried to save, but Table has no onEditingSave handler');
+        return Promise.resolve(false);
+      }
+      // sometimes we only want to save one row
+      const changes = rowId ? {
+        [rowId]: state.changes.rows[rowId]
+      } : state.changes.rows;
+      let completed = true;
+      const _temp9 = _forOf(Object.keys(changes), function (rowId) {
+        const status = getRowStatus(rowId);
+        return _catch(function () {
+          function _temp8(_result) {
+            return _exit ? _result : Promise.resolve(handleSave(changeSet)).then(function () {
+              // cleanup changes, we don't need them after saving
+              discardChanges(rowId, table);
+              // show the saved status, then remove it after a delay
+              setRowStatus(rowId, 'saved');
+              setTimeout(() => {
+                setRowStatus(rowId, undefined);
+              }, DELAY_BEFORE_REMOVING_SAVE_STATUS);
+            });
+          }
+          // don't try to save if - already saving, or there are known errors
+          if (status === 'saving' || status === 'errored') {
+            return;
+          }
+          setRowStatus(rowId, 'saving');
+          const changeSet = {
+            ...state.changes.originals[rowId],
+            ...changes[rowId]
+          };
+          // if we had to create a temporary id, delete it first - it's our data, not theirs
+          if (isTemporaryRow(changeSet[rowIdentityAccessor])) {
+            delete changeSet[rowIdentityAccessor];
+          }
+          // re-run validation, maybe a cell is already invalid but has never been blurred
+          const _temp7 = function () {
+            if (validator) {
+              return Promise.resolve(validator(changeSet)).then(function (errors) {
+                if (errors && Object.keys(errors).length) {
+                  throw errors;
+                }
+              });
+            }
+          }();
+          return _temp7 && _temp7.then ? _temp7.then(_temp8) : _temp8(_temp7); // send new data to the server
+        }, function (error) {
+          var _error$response;
+          if (error instanceof ReferenceError || error instanceof TypeError || (error === null || error === void 0 ? void 0 : (_error$response = error.response) === null || _error$response === void 0 ? void 0 : _error$response.status) >= 500) {
+            console.error(error);
+          }
+          // the onEditingSave handler should throw errors when something fails, e.g. validation, network errors etc
+          // this code handles those errors and maps them either to row errors or cell specific errors
+          let rowError;
+          let cellErrors;
+          if (typeof error === 'string') {
+            rowError = error;
+          } else if (error instanceof Error) {
+            var _error$response2;
+            rowError = error.message;
+            // most of our apis return error objects within this shape
+            if (typeof ((_error$response2 = error.response) === null || _error$response2 === void 0 ? void 0 : _error$response2.data) === 'object') {
+              var _error$response3;
+              cellErrors = (_error$response3 = error.response) === null || _error$response3 === void 0 ? void 0 : _error$response3.data;
+            }
+          } else if (typeof error === 'object') {
+            cellErrors = error;
+          }
+          if (rowError || cellErrors) {
+            dispatch({
+              type: 'setRowErrors',
+              rowId,
+              payload: {
+                row: rowError,
+                cells: cellErrors,
+                shouldShowErrorAlert: true
+              }
+            });
+          }
+          setRowStatus(rowId, 'errored');
+          completed = false;
+        });
+      }, function () {
+        return _exit;
+      });
+      return Promise.resolve(_temp9 && _temp9.then ? _temp9.then(function (_result3) {
+        return _exit ? _result3 : completed;
+      }) : _exit ? _temp9 : completed);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  const onCellChanged = function (cell, rowIndex, shouldRunUpdaters = true) {
+    try {
+      function _temp6() {
+        var _state$changes$errors11;
+        function _temp4() {
+          // only set errors and move reasons for the cells we're currently acting on
+          // why? because the UX is not good if we set them for cells the user hasn't touched yet
+          const cellsToActOn = [cell.column.id, ...Object.keys(updatesForOtherCells)];
+          const allCells = cell.row._getAllCellsByColumnId();
+          cellsToActOn.forEach(accessor => {
+            if (validationErrors[accessor]) {
+              nextCellErrors[accessor] = validationErrors[accessor];
+              // don't show move indicator for cells with errors, they aren't valid and can't be saved
+              delete nextMoveReasons[accessor];
+            } else {
+              var _allCells$accessor;
+              // there isn't any error in this run, remove any error set in state
+              delete nextCellErrors[accessor];
+              if ((_allCells$accessor = allCells[accessor]) !== null && _allCells$accessor !== void 0 && _allCells$accessor.column.getIsSorted()) {
+                // run row move determination
+                const reason = willRowMove(cell, nextChanges[accessor], rowIndex, localization);
+                // if the row will move based on this change save why, otherwise delete any existing state
+                if (reason) {
+                  nextMoveReasons[accessor] = reason;
+                } else {
+                  delete nextMoveReasons[accessor];
+                }
+              }
+            }
+          });
+          dispatch({
+            type: 'updateRow',
+            rowId: cell.row.id,
+            payload: {
+              cellErrors: nextCellErrors,
+              moveReasons: nextMoveReasons,
+              value: nextChanges
+            }
+          });
+        }
+        // create a projection of the next state, so we can act against it
+        const nextChanges = {
+          ...state.changes.rows[cell.row.id],
+          ...updatesForOtherCells
+        };
+        const nextMoveReasons = {
+          ...state.changes.moveReasons[cell.row.id]
+        };
+        const nextCellErrors = {
+          ...((_state$changes$errors11 = state.changes.errors[cell.row.id]) === null || _state$changes$errors11 === void 0 ? void 0 : _state$changes$errors11.cells)
+        };
+        // run validation
+        let validationErrors = {};
+        const _temp3 = function () {
+          if (validator) {
+            const nextRowValue = {
+              ...state.changes.originals[cell.row.id],
+              ...changes,
+              ...updatesForOtherCells
+            };
+            return Promise.resolve(validator(nextRowValue)).then(function (_validator2) {
+              validationErrors = _validator2 !== null && _validator2 !== void 0 ? _validator2 : {};
+            });
+          }
+        }();
+        return _temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3);
+      }
+      const changes = state.changes.rows[cell.row.id];
+      if (!changes) {
+        return Promise.resolve();
+      }
+      let updatesForOtherCells = {};
+      // run the updater handler if there is one, to see if there are any other cells to update
+      const _temp5 = function () {
+        if (typeof handleChange === 'function' && shouldRunUpdaters) {
+          const previousRowValue = {
+            ...state.changes.originals[cell.row.id]
+          };
+          const nextRowValue = {
+            ...state.changes.originals[cell.row.id],
+            ...changes
+          };
+          return Promise.resolve(handleChange(cell.column.id, changes[cell.column.id], nextRowValue, previousRowValue)).then(function (_handleChange) {
+            updatesForOtherCells = _handleChange !== null && _handleChange !== void 0 ? _handleChange : {};
+          });
+        }
+      }();
+      return Promise.resolve(_temp5 && _temp5.then ? _temp5.then(_temp6) : _temp6(_temp5));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }; // general
+  // rows
+  const setRowValue = function (rowId, original, value) {
+    try {
+      function _temp2() {
+        dispatch({
+          type: 'updateRow',
+          rowId,
+          payload: {
+            cellErrors,
+            original,
+            value
+          }
+        });
+      }
+      let cellErrors;
+      const _temp = function () {
+        if (validator) {
+          const row = {
+            ...original,
+            ...value
+          };
+          return Promise.resolve(validator(row)).then(function (_validator) {
+            cellErrors = _validator !== null && _validator !== void 0 ? _validator : {};
+          });
+        }
+      }();
+      return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  const localization = useLocalization();
+  const [state, dispatch] = React__default.useReducer(reducer, {
+    changes: {
+      rows: {},
+      errors: {},
+      moveReasons: {},
+      originals: {},
+      status: {}
+    },
+    temporaryRows: []
+  });
+  function getRowValue(rowId) {
+    var _state$changes$rows$r, _state$changes$rows;
+    return (_state$changes$rows$r = (_state$changes$rows = state.changes.rows) === null || _state$changes$rows === void 0 ? void 0 : _state$changes$rows[rowId]) !== null && _state$changes$rows$r !== void 0 ? _state$changes$rows$r : undefined;
+  }
+  function getRowMoveReason(rowId) {
+    var _Object$values$, _state$changes$moveRe, _state$changes$moveRe2;
+    return (_Object$values$ = Object.values((_state$changes$moveRe = (_state$changes$moveRe2 = state.changes.moveReasons) === null || _state$changes$moveRe2 === void 0 ? void 0 : _state$changes$moveRe2[rowId]) !== null && _state$changes$moveRe !== void 0 ? _state$changes$moveRe : {})[0]) !== null && _Object$values$ !== void 0 ? _Object$values$ : undefined;
+  }
+  function hasRowErrors(rowId) {
+    var _state$changes$errors, _state$changes$errors2, _state$changes$errors3;
+    return !!((_state$changes$errors = state.changes.errors[rowId]) !== null && _state$changes$errors !== void 0 && _state$changes$errors.row) || !!Object.keys((_state$changes$errors2 = (_state$changes$errors3 = state.changes.errors[rowId]) === null || _state$changes$errors3 === void 0 ? void 0 : _state$changes$errors3.cells) !== null && _state$changes$errors2 !== void 0 ? _state$changes$errors2 : {}).length;
+  }
+  function hasRowErrorsShownInAlert(rowId) {
+    var _state$changes$errors4;
+    return hasRowErrors(rowId) && !!((_state$changes$errors4 = state.changes.errors[rowId]) !== null && _state$changes$errors4 !== void 0 && _state$changes$errors4.shouldShowErrorAlert);
+  }
+  function hasTemporaryRowErrors() {
+    var _state$temporaryRows, _state$changes$errors5, _state$changes$errors6, _state$changes$errors7;
+    const newRow = (_state$temporaryRows = state.temporaryRows) === null || _state$temporaryRows === void 0 ? void 0 : _state$temporaryRows[0];
+    if (!newRow) {
+      return false;
+    }
+    const rowId = newRow[rowIdentityAccessor];
+    return !!((_state$changes$errors5 = state.changes.errors[rowId]) !== null && _state$changes$errors5 !== void 0 && _state$changes$errors5.row) || !!Object.keys((_state$changes$errors6 = (_state$changes$errors7 = state.changes.errors[rowId]) === null || _state$changes$errors7 === void 0 ? void 0 : _state$changes$errors7.cells) !== null && _state$changes$errors6 !== void 0 ? _state$changes$errors6 : {}).length;
+  }
+  function getRowStatus(rowId) {
+    return state.changes.status[rowId];
+  }
+  function setRowStatus(rowId, status) {
+    dispatch({
+      type: 'setRowStatus',
+      rowId,
+      payload: {
+        status
+      }
+    });
+  }
+  function createRow(data) {
+    const newRowId = `${TEMPORARY_ROW_ID_PREFIX}${v4()}`;
+    const value = {
+      ...data,
+      [rowIdentityAccessor]: newRowId
+    };
+    dispatch({
+      type: 'createRow',
+      rowId: newRowId,
+      payload: {
+        value
+      }
+    });
+    return newRowId;
+  }
+  // cells
+  function setCellValue(cell, value) {
+    const rowId = cell.row.id;
+    const columnId = cell.column.id;
+    // update if the change is different to the original value
+    if (value !== cell.row.original[columnId]) {
+      dispatch({
+        type: 'setCellValue',
+        rowId,
+        payload: {
+          columnId,
+          row: cell.row.original,
+          value
+        }
+      });
+    }
+    // otherwise remove any previous change - no point saving the same value
+    else if (cell.row.id in state.changes.rows) {
+      dispatch({
+        type: 'removeCellValue',
+        rowId,
+        payload: {
+          columnId,
+          rowIdentityAccessor
+        }
+      });
+    }
+  }
+  function getCellValue(cell) {
+    var _state$changes$rows2, _state$changes$rows2$;
+    return (_state$changes$rows2 = state.changes.rows) === null || _state$changes$rows2 === void 0 ? void 0 : (_state$changes$rows2$ = _state$changes$rows2[cell.row.id]) === null || _state$changes$rows2$ === void 0 ? void 0 : _state$changes$rows2$[cell.column.id];
+  }
+  function getCellError(cell) {
+    var _state$changes$errors8, _state$changes$errors9, _state$changes$errors10;
+    return (_state$changes$errors8 = state.changes.errors) === null || _state$changes$errors8 === void 0 ? void 0 : (_state$changes$errors9 = _state$changes$errors8[cell.row.id]) === null || _state$changes$errors9 === void 0 ? void 0 : (_state$changes$errors10 = _state$changes$errors9.cells) === null || _state$changes$errors10 === void 0 ? void 0 : _state$changes$errors10[cell.column.id];
+  }
+  function getErrorsShownInAlert() {
+    const rowsWithErrors = Object.keys(state.changes.errors);
+    if (!rowsWithErrors.length) {
+      return [];
+    }
+    return rowsWithErrors.filter(hasRowErrorsShownInAlert).map(rowId => ({
+      rowId,
+      changes: state.changes.rows[rowId],
+      errors: state.changes.errors[rowId]
+    }));
+  }
+  function hasSaved() {
+    return !!Object.values(state.changes.status).filter(value => value === 'saved').length;
+  }
+  function hasChanges(rowId) {
+    return rowId ? !!state.changes.rows[rowId] : !!Object.keys(state.changes.rows).length;
+  }
+  function discardChanges(rowId, table) {
+    // remove any new rows from pinned state before discarding them
+    table.resetRowPinning(true);
+    dispatch({
+      type: 'removeRow',
+      rowId,
+      payload: {
+        rowIdentityAccessor
+      }
+    });
+  }
+  return {
+    // row
+    setRowValue,
+    getRowValue,
+    getRowMoveReason,
+    hasRowErrors,
+    hasRowErrorsShownInAlert,
+    hasTemporaryRowErrors,
+    getRowStatus,
+    setRowStatus,
+    // cells
+    setCellValue,
+    getCellValue,
+    getCellError,
+    onCellChanged,
+    // general
+    getErrorsShownInAlert,
+    hasChanges,
+    saveChanges,
+    discardChanges,
+    hasSaved,
+    // new rows
+    createRow,
+    temporaryRows: state.temporaryRows
+  };
+}
+
+export { usePendingChangesState };
+//# sourceMappingURL=useEditingState.js.map