@economic/taco 2.36.3 → 2.37.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/dist/components/Table3/Table3.d.ts +6 -6
  2. package/dist/components/Table3/components/Columns/Internal/EditingActionsMenu.d.ts +1 -1
  3. package/dist/components/Table3/components/Row/Editing/CreateRowButton.d.ts +1 -1
  4. package/dist/components/Table3/features/useTableEditing.d.ts +3 -3
  5. package/dist/components/Table3/types.d.ts +5 -3
  6. package/dist/esm/packages/taco/src/components/Table3/Table3.js +2 -2
  7. package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
  8. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js +1 -1
  9. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js.map +1 -1
  10. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js +4 -4
  11. package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js.map +1 -1
  12. package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js +108 -52
  13. package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js.map +1 -1
  14. package/dist/esm/packages/taco/src/components/Table3/useTable3.js +3 -3
  15. package/dist/esm/packages/taco/src/components/Table3/useTable3.js.map +1 -1
  16. package/dist/esm/packages/taco/src/components/Table3/util/editing.js +15 -2
  17. package/dist/esm/packages/taco/src/components/Table3/util/editing.js.map +1 -1
  18. package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js +19 -4
  19. package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js.map +1 -1
  20. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/EmptyStateBody.js +5 -2
  21. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/EmptyStateBody.js.map +1 -1
  22. package/dist/esm/packages/taco/src/primitives/Table/types.js.map +1 -1
  23. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js +3 -2
  24. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js.map +1 -1
  25. package/dist/esm/packages/taco/src/types.js.map +1 -1
  26. package/dist/primitives/Table/Core/components/Body/EmptyStateBody.d.ts +2 -1
  27. package/dist/primitives/Table/types.d.ts +6 -3
  28. package/dist/taco.cjs.development.js +160 -72
  29. package/dist/taco.cjs.development.js.map +1 -1
  30. package/dist/taco.cjs.production.min.js +1 -1
  31. package/dist/taco.cjs.production.min.js.map +1 -1
  32. package/dist/types.d.ts +1 -0
  33. package/package.json +2 -2
@@ -11,15 +11,15 @@ declare namespace Group {
11
11
  }
12
12
  export declare const Table3: (<TType = unknown>(props: (import("../..").TableClientProps<TType> & {
13
13
  enableEditing?: boolean | undefined;
14
- enableCreation?: boolean | undefined;
15
- onSave?: import("./types").Table3EditingSaveHandler<TType> | undefined;
16
- onCreate?: (() => (row: Partial<TType>) => boolean) | undefined;
14
+ onEditingChange?: import("./types").Table3EditingChangeHandler<TType> | undefined;
15
+ onEditingCreate?: import("./types").Table3EditingCreateHandler<TType> | undefined;
16
+ onEditingSave?: import("./types").Table3EditingSaveHandler<TType> | undefined;
17
17
  validator?: import("./types").Table3EditingValidatorFn<TType> | undefined;
18
18
  } & React.RefAttributes<Table3Ref>) | (import("../..").TableServerProps<TType> & {
19
19
  enableEditing?: boolean | undefined;
20
- enableCreation?: boolean | undefined;
21
- onSave?: import("./types").Table3EditingSaveHandler<TType> | undefined;
22
- onCreate?: (() => (row: Partial<TType>) => boolean) | undefined;
20
+ onEditingChange?: import("./types").Table3EditingChangeHandler<TType> | undefined;
21
+ onEditingCreate?: import("./types").Table3EditingCreateHandler<TType> | undefined;
22
+ onEditingSave?: import("./types").Table3EditingSaveHandler<TType> | undefined;
23
23
  validator?: import("./types").Table3EditingValidatorFn<TType> | undefined;
24
24
  } & React.RefAttributes<Table3Ref>)) => JSX.Element) & {
25
25
  Column: typeof Column;
@@ -4,7 +4,7 @@ declare type EditingActionMenuProps = {
4
4
  hasErrors: boolean;
5
5
  onClear: () => void;
6
6
  onExit: () => void;
7
- onSave: () => Promise<void>;
7
+ onEditingSave: () => Promise<void>;
8
8
  isLastRow: boolean;
9
9
  };
10
10
  export declare function EditingActionMenu(props: EditingActionMenuProps): JSX.Element;
@@ -4,7 +4,7 @@ import { ScrollToOptions } from '@tanstack/react-virtual';
4
4
  declare type Props<TType = unknown> = {
5
5
  table: ReactTable<TType>;
6
6
  tableMeta: ReactTableMeta<TType>;
7
- onCreate: (() => (row: Partial<TType>) => boolean) | undefined;
7
+ onEditingCreate: (() => (row: Partial<TType>) => boolean) | undefined;
8
8
  scrollToIndex: (index: number, options?: ScrollToOptions) => void;
9
9
  };
10
10
  export default function CreateNewRowButton<TType = unknown>(props: Props<TType>): JSX.Element;
@@ -1,11 +1,11 @@
1
1
  import React from 'react';
2
2
  import { Cell as ReactTableCell, Table as ReactTable } from '@tanstack/react-table';
3
- import { Table3EditingSaveHandler, Table3EditingValidatorFn } from '../types';
3
+ import { Table3EditingChangeHandler, Table3EditingSaveHandler, Table3EditingValidatorFn } from '../types';
4
4
  import { TableRef } from '../../../primitives/Table/types';
5
- export declare function useTableEditing<TType = unknown>(isEnabled: boolean | undefined, handleSave: Table3EditingSaveHandler<TType> | undefined, validator: Table3EditingValidatorFn<TType> | undefined): {
5
+ export declare function useTableEditing<TType = unknown>(isEnabled: boolean | undefined, handleSave: Table3EditingSaveHandler<TType> | undefined, handleChange: Table3EditingChangeHandler<TType> | undefined, validator: Table3EditingValidatorFn<TType> | undefined): {
6
6
  getCellValue: <T extends TType>(cell: ReactTableCell<T, unknown>) => unknown;
7
7
  getCellError: <T_1 extends TType>(cell: ReactTableCell<T_1, unknown>) => string | undefined;
8
- setCellValue: <T_2 extends TType>(cell: ReactTableCell<T_2, unknown>, change: unknown, rowIndex: number) => void;
8
+ setCellValue: <T_2 extends TType>(cell: ReactTableCell<T_2, unknown>, change: unknown, rowIndex: number) => Promise<void>;
9
9
  validateCell: <T_3 extends TType>(cell: ReactTableCell<T_3, unknown>) => Promise<void>;
10
10
  addCreatedRowChangeset: (row: any) => Promise<void>;
11
11
  hasChanges: (rowId?: string | undefined) => boolean;
@@ -4,6 +4,8 @@ export declare type Table3Ref = TableRef & {
4
4
  toggleEditing: (enabled: boolean | undefined) => void;
5
5
  };
6
6
  };
7
+ export declare type Table3EditingChangeHandler<TType = unknown> = (accessor: string, value: unknown, row: TType, prevRow: TType) => Promise<Partial<TType>> | undefined;
8
+ export declare type Table3EditingCreateHandler<TType = unknown> = () => (row: Partial<TType>) => boolean;
7
9
  export declare type Table3EditingSaveHandler<TType = unknown> = (row: TType) => Promise<void>;
8
10
  export declare type Table3EditingValidatorFn<TType = unknown> = (row: TType) => Promise<Partial<Record<keyof TType, string>> | undefined> | Partial<Record<keyof TType, string>> | undefined;
9
11
  export declare type Table3FeatureProps = TableFeatureProps & {
@@ -11,9 +13,9 @@ export declare type Table3FeatureProps = TableFeatureProps & {
11
13
  };
12
14
  export declare type Table3Props<TType = unknown> = TableProps<TType> & {
13
15
  enableEditing?: boolean;
14
- enableCreation?: boolean;
15
- onSave?: Table3EditingSaveHandler<TType>;
16
- onCreate?: () => (row: Partial<TType>) => boolean;
16
+ onEditingChange?: Table3EditingChangeHandler<TType>;
17
+ onEditingCreate?: Table3EditingCreateHandler<TType>;
18
+ onEditingSave?: Table3EditingSaveHandler<TType>;
17
19
  validator?: Table3EditingValidatorFn<TType>;
18
20
  };
19
21
  export declare type Table3ColumnProps<TType = unknown> = TableColumnProps<TType>;
@@ -22,7 +22,7 @@ const BaseTable3 = /*#__PURE__*/fixedForwardRef(function BaseTable3(props, ref)
22
22
  enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing
23
23
  };
24
24
  const hasValidationErrors = table3.meta.editing.hasErrors(table3.instance, table3.ref);
25
- const showCreateRowButton = table3.meta.editing.isEnabled && props.enableCreation && props.onCreate;
25
+ const showCreateRowButton = table3.meta.editing.isEnabled && props.onEditingCreate;
26
26
  return /*#__PURE__*/React__default.createElement(Table, null, /*#__PURE__*/React__default.createElement(Table.Toolbar, {
27
27
  table: table3
28
28
  }, table3.meta.editing.isEnabled ? ( /*#__PURE__*/React__default.createElement(Editing, {
@@ -39,7 +39,7 @@ const BaseTable3 = /*#__PURE__*/fixedForwardRef(function BaseTable3(props, ref)
39
39
  }), showCreateRowButton && ( /*#__PURE__*/React__default.createElement(CreateNewRowButton, {
40
40
  table: table3.instance,
41
41
  tableMeta: table3.meta,
42
- onCreate: props.onCreate,
42
+ onEditingCreate: props.onEditingCreate,
43
43
  scrollToIndex: table3.renderer.scrollToIndex
44
44
  }))));
45
45
  });
@@ -1 +1 @@
1
- {"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport { fixedForwardRef } from '../../types';\nimport { useTable3 } from './useTable3';\nimport { Table } from '../../primitives/Table/Core/Table';\nimport { Alert } from './components/Editing/Alert';\nimport CreateNewRowButton from './components/Row/Editing/CreateRowButton';\nimport { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';\nimport { Editing } from './components/Toolbar/Editing/Editing';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\nColumn.displayName = 'Table3Column';\n\nfunction Group(_: Table3GroupProps) {\n return null;\n}\nGroup.displayName = 'Table3Group';\n\nconst BaseTable3 = fixedForwardRef(function BaseTable3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const table3 = useTable3<TType>(props, ref);\n\n const gridAttributes = {\n 'data-table-editing-mode': table3.meta.editing?.isEditing\n ? table3.meta.editing?.isDetailedMode\n ? 'detailed'\n : 'normal'\n : undefined,\n enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing,\n };\n\n const hasValidationErrors = table3.meta.editing.hasErrors(table3.instance, table3.ref);\n const showCreateRowButton = table3.meta.editing.isEnabled && props.enableCreation && props.onCreate;\n\n return (\n <Table>\n <Table.Toolbar<TType> table={table3}>\n {table3.meta.editing.isEnabled ? (\n <Editing scrollToIndex={table3.renderer.scrollToIndex} table={table3.instance} />\n ) : null}\n </Table.Toolbar>\n {hasValidationErrors ? (\n <Alert\n className=\"mb-4\"\n scrollToIndex={table3.renderer.scrollToIndex}\n table={table3.instance}\n tableRef={table3.ref}\n />\n ) : null}\n <Table.Grid<TType> {...gridAttributes} data-taco=\"table3\" table={table3}>\n {showCreateRowButton && (\n <CreateNewRowButton\n table={table3.instance}\n tableMeta={table3.meta}\n onCreate={props.onCreate}\n scrollToIndex={table3.renderer.scrollToIndex}\n />\n )}\n </Table.Grid>\n </Table>\n );\n});\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const stringifiedChildren = String(props.children);\n // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n // this is cheaper from a complexity perspective, and probably performance wise as well\n const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n return <BaseTable3<TType> {...props} key={key} ref={ref} />;\n}) as (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\n Group: typeof Group;\n};\nTable3.Column = Column;\nTable3.Group = Group;\n\nexport type {\n Table3Props,\n Table3Ref,\n Table3ColumnProps,\n Table3GroupProps,\n Table3EditingSaveHandler,\n Table3EditingValidatorFn,\n Table3FeatureProps,\n Table3Texts,\n} from './types';\n"],"names":["Column","_","displayName","Group","BaseTable3","fixedForwardRef","props","ref","table3","useTable3","gridAttributes","_table3$meta$editing","meta","editing","isEditing","_table3$meta$editing2","isDetailedMode","undefined","enableHorizontalArrowKeyNavigation","hasValidationErrors","hasErrors","instance","showCreateRowButton","isEnabled","enableCreation","onCreate","React","Table","Toolbar","table","Editing","scrollToIndex","renderer","Alert","className","tableRef","Grid","CreateNewRowButton","tableMeta","Table3","stringifiedChildren","String","children","key","useMemo"],"mappings":";;;;;;;;AAUA,SAASA,MAAMA,CAAkBC,CAA2B;EACxD,OAAO,IAAI;AACf;AACAD,MAAM,CAACE,WAAW,GAAG,cAAc;AAEnC,SAASC,KAAKA,CAACF,CAAmB;EAC9B,OAAO,IAAI;AACf;AACAE,KAAK,CAACD,WAAW,GAAG,aAAa;AAEjC,MAAME,UAAU,gBAAGC,eAAe,CAAC,SAASD,UAAUA,CAAkBE,KAAyB,EAAEC,GAAyB;;EACxH,MAAMC,MAAM,GAAGC,SAAS,CAAQH,KAAK,EAAEC,GAAG,CAAC;EAE3C,MAAMG,cAAc,GAAG;IACnB,yBAAyB,EAAE,CAAAC,oBAAA,GAAAH,MAAM,CAACI,IAAI,CAACC,OAAO,cAAAF,oBAAA,eAAnBA,oBAAA,CAAqBG,SAAS,GACnD,CAAAC,qBAAA,GAAAP,MAAM,CAACI,IAAI,CAACC,OAAO,cAAAE,qBAAA,eAAnBA,qBAAA,CAAqBC,cAAc,GAC/B,UAAU,GACV,QAAQ,GACZC,SAAS;IACfC,kCAAkC,EAAEV,MAAM,CAACI,IAAI,CAACC,OAAO,CAACC;GAC3D;EAED,MAAMK,mBAAmB,GAAGX,MAAM,CAACI,IAAI,CAACC,OAAO,CAACO,SAAS,CAACZ,MAAM,CAACa,QAAQ,EAAEb,MAAM,CAACD,GAAG,CAAC;EACtF,MAAMe,mBAAmB,GAAGd,MAAM,CAACI,IAAI,CAACC,OAAO,CAACU,SAAS,IAAIjB,KAAK,CAACkB,cAAc,IAAIlB,KAAK,CAACmB,QAAQ;EAEnG,oBACIC,6BAACC,KAAK,qBACFD,6BAACC,KAAK,CAACC,OAAO;IAAQC,KAAK,EAAErB;KACxBA,MAAM,CAACI,IAAI,CAACC,OAAO,CAACU,SAAS,kBAC1BG,6BAACI,OAAO;IAACC,aAAa,EAAEvB,MAAM,CAACwB,QAAQ,CAACD,aAAa;IAAEF,KAAK,EAAErB,MAAM,CAACa;IAAY,IACjF,IAAI,CACI,EACfF,mBAAmB,kBAChBO,6BAACO,KAAK;IACFC,SAAS,EAAC,MAAM;IAChBH,aAAa,EAAEvB,MAAM,CAACwB,QAAQ,CAACD,aAAa;IAC5CF,KAAK,EAAErB,MAAM,CAACa,QAAQ;IACtBc,QAAQ,EAAE3B,MAAM,CAACD;IACnB,IACF,IAAI,eACRmB,6BAACC,KAAK,CAACS,IAAI,oBAAY1B,cAAc;iBAAY,QAAQ;IAACmB,KAAK,EAAErB;MAC5Dc,mBAAmB,mBAChBI,6BAACW,kBAAkB;IACfR,KAAK,EAAErB,MAAM,CAACa,QAAQ;IACtBiB,SAAS,EAAE9B,MAAM,CAACI,IAAI;IACtBa,QAAQ,EAAEnB,KAAK,CAACmB,QAAQ;IACxBM,aAAa,EAAEvB,MAAM,CAACwB,QAAQ,CAACD;IACjC,CACL,CACQ,CACT;AAEhB,CAAC,CAAC;MAEWQ,MAAM,gBAAGlC,eAAe,CAAC,SAASkC,MAAMA,CAAkBjC,KAAyB,EAAEC,GAAyB;EACvH,MAAMiC,mBAAmB,GAAGC,MAAM,CAACnC,KAAK,CAACoC,QAAQ,CAAC;;;EAGlD,MAAMC,GAAG,GAAGjB,cAAK,CAACkB,OAAO,CAAC,MAAMH,MAAM,CAAC,WAAW,GAAGD,mBAAmB,CAAC,EAAE,CAACA,mBAAmB,CAAC,CAAC;EACjG,oBAAOd,6BAACtB,UAAU,oBAAYE,KAAK;IAAEqC,GAAG,EAAEA,GAAG;IAAEpC,GAAG,EAAEA;KAAO;AAC/D,CAAC;AAIDgC,MAAM,CAACvC,MAAM,GAAGA,MAAM;AACtBuC,MAAM,CAACpC,KAAK,GAAGA,KAAK;;;;"}
1
+ {"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport { fixedForwardRef } from '../../types';\nimport { useTable3 } from './useTable3';\nimport { Table } from '../../primitives/Table/Core/Table';\nimport { Alert } from './components/Editing/Alert';\nimport CreateNewRowButton from './components/Row/Editing/CreateRowButton';\nimport { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';\nimport { Editing } from './components/Toolbar/Editing/Editing';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\nColumn.displayName = 'Table3Column';\n\nfunction Group(_: Table3GroupProps) {\n return null;\n}\nGroup.displayName = 'Table3Group';\n\nconst BaseTable3 = fixedForwardRef(function BaseTable3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const table3 = useTable3<TType>(props, ref);\n\n const gridAttributes = {\n 'data-table-editing-mode': table3.meta.editing?.isEditing\n ? table3.meta.editing?.isDetailedMode\n ? 'detailed'\n : 'normal'\n : undefined,\n enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing,\n };\n\n const hasValidationErrors = table3.meta.editing.hasErrors(table3.instance, table3.ref);\n const showCreateRowButton = table3.meta.editing.isEnabled && props.onEditingCreate;\n\n return (\n <Table>\n <Table.Toolbar<TType> table={table3}>\n {table3.meta.editing.isEnabled ? (\n <Editing scrollToIndex={table3.renderer.scrollToIndex} table={table3.instance} />\n ) : null}\n </Table.Toolbar>\n {hasValidationErrors ? (\n <Alert\n className=\"mb-4\"\n scrollToIndex={table3.renderer.scrollToIndex}\n table={table3.instance}\n tableRef={table3.ref}\n />\n ) : null}\n <Table.Grid<TType> {...gridAttributes} data-taco=\"table3\" table={table3}>\n {showCreateRowButton && (\n <CreateNewRowButton\n table={table3.instance}\n tableMeta={table3.meta}\n onEditingCreate={props.onEditingCreate}\n scrollToIndex={table3.renderer.scrollToIndex}\n />\n )}\n </Table.Grid>\n </Table>\n );\n});\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const stringifiedChildren = String(props.children);\n // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n // this is cheaper from a complexity perspective, and probably performance wise as well\n const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n return <BaseTable3<TType> {...props} key={key} ref={ref} />;\n}) as (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\n Group: typeof Group;\n};\nTable3.Column = Column;\nTable3.Group = Group;\n\nexport type {\n Table3Props,\n Table3Ref,\n Table3ColumnProps,\n Table3GroupProps,\n Table3EditingSaveHandler,\n Table3EditingValidatorFn,\n Table3FeatureProps,\n Table3Texts,\n} from './types';\n"],"names":["Column","_","displayName","Group","BaseTable3","fixedForwardRef","props","ref","table3","useTable3","gridAttributes","_table3$meta$editing","meta","editing","isEditing","_table3$meta$editing2","isDetailedMode","undefined","enableHorizontalArrowKeyNavigation","hasValidationErrors","hasErrors","instance","showCreateRowButton","isEnabled","onEditingCreate","React","Table","Toolbar","table","Editing","scrollToIndex","renderer","Alert","className","tableRef","Grid","CreateNewRowButton","tableMeta","Table3","stringifiedChildren","String","children","key","useMemo"],"mappings":";;;;;;;;AAUA,SAASA,MAAMA,CAAkBC,CAA2B;EACxD,OAAO,IAAI;AACf;AACAD,MAAM,CAACE,WAAW,GAAG,cAAc;AAEnC,SAASC,KAAKA,CAACF,CAAmB;EAC9B,OAAO,IAAI;AACf;AACAE,KAAK,CAACD,WAAW,GAAG,aAAa;AAEjC,MAAME,UAAU,gBAAGC,eAAe,CAAC,SAASD,UAAUA,CAAkBE,KAAyB,EAAEC,GAAyB;;EACxH,MAAMC,MAAM,GAAGC,SAAS,CAAQH,KAAK,EAAEC,GAAG,CAAC;EAE3C,MAAMG,cAAc,GAAG;IACnB,yBAAyB,EAAE,CAAAC,oBAAA,GAAAH,MAAM,CAACI,IAAI,CAACC,OAAO,cAAAF,oBAAA,eAAnBA,oBAAA,CAAqBG,SAAS,GACnD,CAAAC,qBAAA,GAAAP,MAAM,CAACI,IAAI,CAACC,OAAO,cAAAE,qBAAA,eAAnBA,qBAAA,CAAqBC,cAAc,GAC/B,UAAU,GACV,QAAQ,GACZC,SAAS;IACfC,kCAAkC,EAAEV,MAAM,CAACI,IAAI,CAACC,OAAO,CAACC;GAC3D;EAED,MAAMK,mBAAmB,GAAGX,MAAM,CAACI,IAAI,CAACC,OAAO,CAACO,SAAS,CAACZ,MAAM,CAACa,QAAQ,EAAEb,MAAM,CAACD,GAAG,CAAC;EACtF,MAAMe,mBAAmB,GAAGd,MAAM,CAACI,IAAI,CAACC,OAAO,CAACU,SAAS,IAAIjB,KAAK,CAACkB,eAAe;EAElF,oBACIC,6BAACC,KAAK,qBACFD,6BAACC,KAAK,CAACC,OAAO;IAAQC,KAAK,EAAEpB;KACxBA,MAAM,CAACI,IAAI,CAACC,OAAO,CAACU,SAAS,kBAC1BE,6BAACI,OAAO;IAACC,aAAa,EAAEtB,MAAM,CAACuB,QAAQ,CAACD,aAAa;IAAEF,KAAK,EAAEpB,MAAM,CAACa;IAAY,IACjF,IAAI,CACI,EACfF,mBAAmB,kBAChBM,6BAACO,KAAK;IACFC,SAAS,EAAC,MAAM;IAChBH,aAAa,EAAEtB,MAAM,CAACuB,QAAQ,CAACD,aAAa;IAC5CF,KAAK,EAAEpB,MAAM,CAACa,QAAQ;IACtBa,QAAQ,EAAE1B,MAAM,CAACD;IACnB,IACF,IAAI,eACRkB,6BAACC,KAAK,CAACS,IAAI,oBAAYzB,cAAc;iBAAY,QAAQ;IAACkB,KAAK,EAAEpB;MAC5Dc,mBAAmB,mBAChBG,6BAACW,kBAAkB;IACfR,KAAK,EAAEpB,MAAM,CAACa,QAAQ;IACtBgB,SAAS,EAAE7B,MAAM,CAACI,IAAI;IACtBY,eAAe,EAAElB,KAAK,CAACkB,eAAe;IACtCM,aAAa,EAAEtB,MAAM,CAACuB,QAAQ,CAACD;IACjC,CACL,CACQ,CACT;AAEhB,CAAC,CAAC;MAEWQ,MAAM,gBAAGjC,eAAe,CAAC,SAASiC,MAAMA,CAAkBhC,KAAyB,EAAEC,GAAyB;EACvH,MAAMgC,mBAAmB,GAAGC,MAAM,CAAClC,KAAK,CAACmC,QAAQ,CAAC;;;EAGlD,MAAMC,GAAG,GAAGjB,cAAK,CAACkB,OAAO,CAAC,MAAMH,MAAM,CAAC,WAAW,GAAGD,mBAAmB,CAAC,EAAE,CAACA,mBAAmB,CAAC,CAAC;EACjG,oBAAOd,6BAACrB,UAAU,oBAAYE,KAAK;IAAEoC,GAAG,EAAEA,GAAG;IAAEnC,GAAG,EAAEA;KAAO;AAC/D,CAAC;AAID+B,MAAM,CAACtC,MAAM,GAAGA,MAAM;AACtBsC,MAAM,CAACnC,KAAK,GAAGA,KAAK;;;;"}
@@ -12,7 +12,7 @@ function EditingActionMenu(props) {
12
12
  hasErrors,
13
13
  onClear: handleClear,
14
14
  onExit: handleExit,
15
- onSave: handleSave,
15
+ onEditingSave: handleSave,
16
16
  isLastRow
17
17
  } = props;
18
18
  const {
@@ -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 onSave: () => Promise<void>;\n isLastRow: boolean;\n};\n\nexport function EditingActionMenu(props: EditingActionMenuProps) {\n const { hasChanges, hasErrors, onClear: handleClear, onExit: handleExit, onSave: 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 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>\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 return (\n <Dialog {...dialogProps}>\n <Dialog.Content aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}>\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 tabIndex={0} appearance=\"primary\" autoFocus 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","onSave","handleSave","isLastRow","texts","useLocalization","handleKeyDown","event","key","React","IconButton","appearance","table3","editing","actions","tooltip","className","icon","onKeyDown","menu","menuProps","Menu","Content","Item","disabled","onClick","save","dialog","ConfirmClearChangesDialog","clear","exit","dialogProps","Dialog","clearChangesConfirmationDialog","title","Title","description","Footer","Group","Close","Button","tabIndex","cancel","autoFocus","confirm"],"mappings":";;;;;;;;SAiBgBA,iBAAiBA,CAACC,KAA6B;EAC3D,MAAM;IAAEC,UAAU;IAAEC,SAAS;IAAEC,OAAO,EAAEC,WAAW;IAAEC,MAAM,EAAEC,UAAU;IAAEC,MAAM,EAAEC,UAAU;IAAEC;GAAW,GAAGT,KAAK;EAChH,MAAM;IAAEU;GAAO,GAAGC,eAAe,EAAE;EAEnC,MAAMC,aAAa,GAAGC,KAAK;;IAEvB,IAAIJ,SAAS,IAAIR,UAAU,IAAIY,KAAK,CAACC,GAAG,KAAK,KAAK,EAAE;MAChDN,UAAU,EAAE;;GAEnB;EAED,oBACIO,6BAACC,UAAU;IACPC,UAAU,EAAC,aAAa;kBACZP,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,OAAO,CAACC,OAAO;IAChDC,SAAS,EAAC,8CAA8C;IACxDC,IAAI,EAAC,MAAM;IACXC,SAAS,EAAEZ,aAAa;IACxBa,IAAI,EAAEC,SAAS,mBACXX,6BAACY,IAAI,oBAAKD,SAAS,gBACfX,6BAACY,IAAI,CAACC,OAAO,qBACTb,6BAACY,IAAI,CAACE,IAAI;MAACN,IAAI,EAAC,MAAM;MAACO,QAAQ,EAAE,CAAC7B,UAAU,IAAIC,SAAS;MAAE6B,OAAO,EAAEvB;OAC/DE,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,OAAO,CAACY,IAAI,CAC1B,eACZjB,6BAACY,IAAI,CAACE,IAAI;MACNN,IAAI,EAAC,OAAO;MACZO,QAAQ,EAAE,CAAC7B,UAAU;MACrBgC,MAAM,EAAEjC,KAAK,iBAAIe,6BAACmB,yBAAyB,oBAAKlC,KAAK;QAAEG,OAAO,EAAEC;;OAC/DM,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,OAAO,CAACe,KAAK,CAC3B,eACZpB,6BAACY,IAAI,CAACE,IAAI;MAACN,IAAI,EAAC,MAAM;MAACQ,OAAO,EAAEzB;OAC3BI,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,OAAO,CAACgB,IAAI,CAC1B,CACD,CACZ;IAEb;AAEV;AAMA,SAASF,yBAAyBA,CAAClC,KAAqC;EACpE,MAAM;IAAEG,OAAO,EAAEC,WAAW;IAAE,GAAGiC;GAAa,GAAGrC,KAAK;EACtD,MAAM;IAAEU;GAAO,GAAGC,eAAe,EAAE;EAEnC,oBACII,6BAACuB,MAAM,oBAAKD,WAAW,gBACnBtB,6BAACuB,MAAM,CAACV,OAAO;kBAAalB,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACoB,8BAA8B,CAACC;kBAC5EzB,6BAACuB,MAAM,CAACG,KAAK,QAAE/B,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACoB,8BAA8B,CAACC,KAAK,CAAgB,eAExFzB,wCAAIL,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACoB,8BAA8B,CAACG,WAAW,CAAK,eAExE3B,6BAACuB,MAAM,CAACK,MAAM,qBACV5B,6BAAC6B,KAAK,qBACF7B,6BAACuB,MAAM,CAACO,KAAK,qBACT9B,6BAAC+B,MAAM;IAACC,QAAQ,EAAE;KAAIrC,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACoB,8BAA8B,CAACS,MAAM,CAAU,CAC/E,eACfjC,6BAACuB,MAAM,CAACO,KAAK,qBACT9B,6BAAC+B,MAAM;IAACC,QAAQ,EAAE,CAAC;IAAE9B,UAAU,EAAC,SAAS;IAACgC,SAAS;IAAClB,OAAO,EAAE3B;KACxDM,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACoB,8BAA8B,CAACW,OAAO,CACvD,CACE,CACX,CACI,CACH,CACZ;AAEjB;;;;"}
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 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>\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 return (\n <Dialog {...dialogProps}>\n <Dialog.Content aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}>\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 tabIndex={0} appearance=\"primary\" autoFocus 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","React","IconButton","appearance","table3","editing","actions","tooltip","className","icon","onKeyDown","menu","menuProps","Menu","Content","Item","disabled","onClick","save","dialog","ConfirmClearChangesDialog","clear","exit","dialogProps","Dialog","clearChangesConfirmationDialog","title","Title","description","Footer","Group","Close","Button","tabIndex","cancel","autoFocus","confirm"],"mappings":";;;;;;;;SAiBgBA,iBAAiBA,CAACC,KAA6B;EAC3D,MAAM;IAAEC,UAAU;IAAEC,SAAS;IAAEC,OAAO,EAAEC,WAAW;IAAEC,MAAM,EAAEC,UAAU;IAAEC,aAAa,EAAEC,UAAU;IAAEC;GAAW,GAAGT,KAAK;EACvH,MAAM;IAAEU;GAAO,GAAGC,eAAe,EAAE;EAEnC,MAAMC,aAAa,GAAGC,KAAK;;IAEvB,IAAIJ,SAAS,IAAIR,UAAU,IAAIY,KAAK,CAACC,GAAG,KAAK,KAAK,EAAE;MAChDN,UAAU,EAAE;;GAEnB;EAED,oBACIO,6BAACC,UAAU;IACPC,UAAU,EAAC,aAAa;kBACZP,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,OAAO,CAACC,OAAO;IAChDC,SAAS,EAAC,8CAA8C;IACxDC,IAAI,EAAC,MAAM;IACXC,SAAS,EAAEZ,aAAa;IACxBa,IAAI,EAAEC,SAAS,mBACXX,6BAACY,IAAI,oBAAKD,SAAS,gBACfX,6BAACY,IAAI,CAACC,OAAO,qBACTb,6BAACY,IAAI,CAACE,IAAI;MAACN,IAAI,EAAC,MAAM;MAACO,QAAQ,EAAE,CAAC7B,UAAU,IAAIC,SAAS;MAAE6B,OAAO,EAAEvB;OAC/DE,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,OAAO,CAACY,IAAI,CAC1B,eACZjB,6BAACY,IAAI,CAACE,IAAI;MACNN,IAAI,EAAC,OAAO;MACZO,QAAQ,EAAE,CAAC7B,UAAU;MACrBgC,MAAM,EAAEjC,KAAK,iBAAIe,6BAACmB,yBAAyB,oBAAKlC,KAAK;QAAEG,OAAO,EAAEC;;OAC/DM,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,OAAO,CAACe,KAAK,CAC3B,eACZpB,6BAACY,IAAI,CAACE,IAAI;MAACN,IAAI,EAAC,MAAM;MAACQ,OAAO,EAAEzB;OAC3BI,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,OAAO,CAACgB,IAAI,CAC1B,CACD,CACZ;IAEb;AAEV;AAMA,SAASF,yBAAyBA,CAAClC,KAAqC;EACpE,MAAM;IAAEG,OAAO,EAAEC,WAAW;IAAE,GAAGiC;GAAa,GAAGrC,KAAK;EACtD,MAAM;IAAEU;GAAO,GAAGC,eAAe,EAAE;EAEnC,oBACII,6BAACuB,MAAM,oBAAKD,WAAW,gBACnBtB,6BAACuB,MAAM,CAACV,OAAO;kBAAalB,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACoB,8BAA8B,CAACC;kBAC5EzB,6BAACuB,MAAM,CAACG,KAAK,QAAE/B,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACoB,8BAA8B,CAACC,KAAK,CAAgB,eAExFzB,wCAAIL,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACoB,8BAA8B,CAACG,WAAW,CAAK,eAExE3B,6BAACuB,MAAM,CAACK,MAAM,qBACV5B,6BAAC6B,KAAK,qBACF7B,6BAACuB,MAAM,CAACO,KAAK,qBACT9B,6BAAC+B,MAAM;IAACC,QAAQ,EAAE;KAAIrC,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACoB,8BAA8B,CAACS,MAAM,CAAU,CAC/E,eACfjC,6BAACuB,MAAM,CAACO,KAAK,qBACT9B,6BAAC+B,MAAM;IAACC,QAAQ,EAAE,CAAC;IAAE9B,UAAU,EAAC,SAAS;IAACgC,SAAS;IAAClB,OAAO,EAAE3B;KACxDM,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACoB,8BAA8B,CAACW,OAAO,CACvD,CACE,CACX,CACI,CACH,CACZ;AAEjB;;;;"}
@@ -5,7 +5,7 @@ import { animateCreateRow } from '../../../util/editing.js';
5
5
 
6
6
  function CreateNewRowButton(props) {
7
7
  const {
8
- onCreate,
8
+ onEditingCreate,
9
9
  scrollToIndex,
10
10
  table,
11
11
  tableMeta
@@ -24,7 +24,7 @@ function CreateNewRowButton(props) {
24
24
  };
25
25
  const handleCreate = function () {
26
26
  try {
27
- if (!onCreate) {
27
+ if (!onEditingCreate) {
28
28
  return Promise.resolve();
29
29
  }
30
30
  const createdRow = rows.find(row => {
@@ -35,14 +35,14 @@ function CreateNewRowButton(props) {
35
35
  if (createdRow) {
36
36
  return Promise.resolve(tableMeta.editing.saveChanges()).then(function () {
37
37
  if (!tableMeta.editing.hasRowErrors(createdRow.id)) {
38
- const rowFinder = onCreate();
38
+ const rowFinder = onEditingCreate();
39
39
  setRowCreated({
40
40
  rowFinder
41
41
  });
42
42
  }
43
43
  });
44
44
  } else {
45
- const rowFinder = onCreate();
45
+ const rowFinder = onEditingCreate();
46
46
  setRowCreated({
47
47
  rowFinder
48
48
  });
@@ -1 +1 @@
1
- {"version":3,"file":"CreateRowButton.js","sources":["../../../../../../../../../../src/components/Table3/components/Row/Editing/CreateRowButton.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { ScrollToOptions } from '@tanstack/react-virtual';\nimport { Button } from '../../../../Button/Button';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { animateCreateRow } from '../../../util/editing';\n\ntype Props<TType = unknown> = {\n table: ReactTable<TType>;\n tableMeta: ReactTableMeta<TType>;\n onCreate: (() => (row: Partial<TType>) => boolean) | undefined;\n scrollToIndex: (index: number, options?: ScrollToOptions) => void;\n};\n\nexport default function CreateNewRowButton<TType = unknown>(props: Props<TType>) {\n const { onCreate, scrollToIndex, table, tableMeta } = props;\n const { texts } = useLocalization();\n const rows = table.getCoreRowModel().rows;\n const [rowCreated, setRowCreated] = React.useState<{ rowFinder: ((row: Partial<TType>) => boolean) | undefined }>({\n rowFinder: undefined,\n });\n\n const handleKeyDown = event => {\n if (!tableMeta.editing.hasChanges() && event.key === 'Tab') {\n !tableMeta.editing.saveChanges();\n }\n };\n\n const handleCreate = async () => {\n if (!onCreate) {\n return;\n }\n const createdRow = rows.find(row => rowCreated?.rowFinder?.(row.original));\n\n if (createdRow) {\n await tableMeta.editing.saveChanges();\n\n if (!tableMeta.editing.hasRowErrors(createdRow.id)) {\n const rowFinder = onCreate();\n\n setRowCreated({ rowFinder });\n }\n } else {\n const rowFinder = onCreate();\n setRowCreated({ rowFinder });\n }\n };\n\n React.useEffect(() => {\n if (typeof rowCreated?.rowFinder === 'function') {\n const createdRow = rows.find(row => rowCreated?.rowFinder?.(row.original));\n\n if (createdRow) {\n const rowInTable = table.getRowModel().rows.find(row => rowCreated?.rowFinder?.(row.original));\n if (rowInTable) {\n tableMeta.editing.toggleEditing(true);\n tableMeta.rowActive.setRowActiveIndex(createdRow.index);\n scrollToIndex(createdRow.index);\n requestAnimationFrame(() => animateCreateRow(createdRow.id));\n }\n requestAnimationFrame(() => tableMeta.editing.addCreatedRowChangeset(createdRow));\n }\n }\n }, [rowCreated]);\n\n return (\n <tr\n onClick={handleCreate}\n className=\"border-grey-300 hover:bg-grey-100 group !sticky bottom-10 left-0 z-[21] !block cursor-pointer border-t\">\n <td className=\"!border-t-0 !bg-transparent\">\n <Button onKeyDown={handleKeyDown} className=\"group-hover:bg-grey-200 sticky left-0\" appearance=\"transparent\">\n + {texts.table3.editing.buttons.create.label}\n </Button>\n </td>\n </tr>\n );\n}\n"],"names":["CreateNewRowButton","props","onCreate","scrollToIndex","table","tableMeta","texts","useLocalization","rows","getCoreRowModel","rowCreated","setRowCreated","React","useState","rowFinder","undefined","handleKeyDown","event","editing","hasChanges","key","saveChanges","handleCreate","Promise","resolve","createdRow","find","row","_rowCreated$rowFinder","call","original","_temp","then","hasRowErrors","id","e","reject","useEffect","_rowCreated$rowFinder2","rowInTable","getRowModel","_rowCreated$rowFinder3","toggleEditing","rowActive","setRowActiveIndex","index","requestAnimationFrame","animateCreateRow","addCreatedRowChangeset","onClick","className","Button","onKeyDown","appearance","table3","buttons","create","label"],"mappings":";;;;;SAcwBA,kBAAkBA,CAAkBC,KAAmB;EAC3E,MAAM;IAAEC,QAAQ;IAAEC,aAAa;IAAEC,KAAK;IAAEC;GAAW,GAAGJ,KAAK;EAC3D,MAAM;IAAEK;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,IAAI,GAAGJ,KAAK,CAACK,eAAe,EAAE,CAACD,IAAI;EACzC,MAAM,CAACE,UAAU,EAAEC,aAAa,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAgE;IAC9GC,SAAS,EAAEC;GACd,CAAC;EAEF,MAAMC,aAAa,GAAGC,KAAK;IACvB,IAAI,CAACZ,SAAS,CAACa,OAAO,CAACC,UAAU,EAAE,IAAIF,KAAK,CAACG,GAAG,KAAK,KAAK,EAAE;MACxD,CAACf,SAAS,CAACa,OAAO,CAACG,WAAW,EAAE;;GAEvC;EAED,MAAMC,YAAY;IAAA;MACd,IAAI,CAACpB,QAAQ,EAAE;QACX,OAAAqB,OAAA,CAAAC,OAAA;;MAEJ,MAAMC,UAAU,GAAGjB,IAAI,CAACkB,IAAI,CAACC,GAAG;QAAA,IAAAC,qBAAA;QAAA,OAAIlB,UAAU,aAAVA,UAAU,wBAAAkB,qBAAA,GAAVlB,UAAU,CAAEI,SAAS,cAAAc,qBAAA,uBAArBA,qBAAA,CAAAC,IAAA,CAAAnB,UAAU,EAAciB,GAAG,CAACG,QAAQ,CAAC;QAAC;MAAC,MAAAC,KAAA;QAAA,IAEvEN,UAAU;UAAA,OAAAF,OAAA,CAAAC,OAAA,CACJnB,SAAS,CAACa,OAAO,CAACG,WAAW,EAAE,EAAAW,IAAA;YAAA,IAEjC,CAAC3B,SAAS,CAACa,OAAO,CAACe,YAAY,CAACR,UAAU,CAACS,EAAE,CAAC;cAC9C,MAAMpB,SAAS,GAAGZ,QAAQ,EAAE;cAE5BS,aAAa,CAAC;gBAAEG;eAAW,CAAC;;;;UAGhC,MAAMA,SAAS,GAAGZ,QAAQ,EAAE;UAC5BS,aAAa,CAAC;YAAEG;WAAW,CAAC;;;MAAC,OAAAS,OAAA,CAAAC,OAAA,CAAAO,KAAA,IAAAA,KAAA,CAAAC,IAAA,GAAAD,KAAA,CAAAC,IAAA;KAEpC,QAAAG,CAAA;MAAA,OAAAZ,OAAA,CAAAa,MAAA,CAAAD,CAAA;;;EAEDvB,cAAK,CAACyB,SAAS,CAAC;IACZ,IAAI,QAAO3B,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEI,SAAS,MAAK,UAAU,EAAE;MAC7C,MAAMW,UAAU,GAAGjB,IAAI,CAACkB,IAAI,CAACC,GAAG;QAAA,IAAAW,sBAAA;QAAA,OAAI5B,UAAU,aAAVA,UAAU,wBAAA4B,sBAAA,GAAV5B,UAAU,CAAEI,SAAS,cAAAwB,sBAAA,uBAArBA,sBAAA,CAAAT,IAAA,CAAAnB,UAAU,EAAciB,GAAG,CAACG,QAAQ,CAAC;QAAC;MAE1E,IAAIL,UAAU,EAAE;QACZ,MAAMc,UAAU,GAAGnC,KAAK,CAACoC,WAAW,EAAE,CAAChC,IAAI,CAACkB,IAAI,CAACC,GAAG;UAAA,IAAAc,sBAAA;UAAA,OAAI/B,UAAU,aAAVA,UAAU,wBAAA+B,sBAAA,GAAV/B,UAAU,CAAEI,SAAS,cAAA2B,sBAAA,uBAArBA,sBAAA,CAAAZ,IAAA,CAAAnB,UAAU,EAAciB,GAAG,CAACG,QAAQ,CAAC;UAAC;QAC9F,IAAIS,UAAU,EAAE;UACZlC,SAAS,CAACa,OAAO,CAACwB,aAAa,CAAC,IAAI,CAAC;UACrCrC,SAAS,CAACsC,SAAS,CAACC,iBAAiB,CAACnB,UAAU,CAACoB,KAAK,CAAC;UACvD1C,aAAa,CAACsB,UAAU,CAACoB,KAAK,CAAC;UAC/BC,qBAAqB,CAAC,MAAMC,gBAAgB,CAACtB,UAAU,CAACS,EAAE,CAAC,CAAC;;QAEhEY,qBAAqB,CAAC,MAAMzC,SAAS,CAACa,OAAO,CAAC8B,sBAAsB,CAACvB,UAAU,CAAC,CAAC;;;GAG5F,EAAE,CAACf,UAAU,CAAC,CAAC;EAEhB,oBACIE;IACIqC,OAAO,EAAE3B,YAAY;IACrB4B,SAAS,EAAC;kBACVtC;IAAIsC,SAAS,EAAC;kBACVtC,6BAACuC,MAAM;IAACC,SAAS,EAAEpC,aAAa;IAAEkC,SAAS,EAAC,uCAAuC;IAACG,UAAU,EAAC;WACxF/C,KAAK,CAACgD,MAAM,CAACpC,OAAO,CAACqC,OAAO,CAACC,MAAM,CAACC,KAAK,CACvC,CACR,CACJ;AAEb;;;;"}
1
+ {"version":3,"file":"CreateRowButton.js","sources":["../../../../../../../../../../src/components/Table3/components/Row/Editing/CreateRowButton.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { ScrollToOptions } from '@tanstack/react-virtual';\nimport { Button } from '../../../../Button/Button';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { animateCreateRow } from '../../../util/editing';\n\ntype Props<TType = unknown> = {\n table: ReactTable<TType>;\n tableMeta: ReactTableMeta<TType>;\n onEditingCreate: (() => (row: Partial<TType>) => boolean) | undefined;\n scrollToIndex: (index: number, options?: ScrollToOptions) => void;\n};\n\nexport default function CreateNewRowButton<TType = unknown>(props: Props<TType>) {\n const { onEditingCreate, scrollToIndex, table, tableMeta } = props;\n const { texts } = useLocalization();\n const rows = table.getCoreRowModel().rows;\n const [rowCreated, setRowCreated] = React.useState<{ rowFinder: ((row: Partial<TType>) => boolean) | undefined }>({\n rowFinder: undefined,\n });\n\n const handleKeyDown = event => {\n if (!tableMeta.editing.hasChanges() && event.key === 'Tab') {\n !tableMeta.editing.saveChanges();\n }\n };\n\n const handleCreate = async () => {\n if (!onEditingCreate) {\n return;\n }\n const createdRow = rows.find(row => rowCreated?.rowFinder?.(row.original));\n\n if (createdRow) {\n await tableMeta.editing.saveChanges();\n\n if (!tableMeta.editing.hasRowErrors(createdRow.id)) {\n const rowFinder = onEditingCreate();\n\n setRowCreated({ rowFinder });\n }\n } else {\n const rowFinder = onEditingCreate();\n setRowCreated({ rowFinder });\n }\n };\n\n React.useEffect(() => {\n if (typeof rowCreated?.rowFinder === 'function') {\n const createdRow = rows.find(row => rowCreated?.rowFinder?.(row.original));\n\n if (createdRow) {\n const rowInTable = table.getRowModel().rows.find(row => rowCreated?.rowFinder?.(row.original));\n if (rowInTable) {\n tableMeta.editing.toggleEditing(true);\n tableMeta.rowActive.setRowActiveIndex(createdRow.index);\n scrollToIndex(createdRow.index);\n requestAnimationFrame(() => animateCreateRow(createdRow.id));\n }\n requestAnimationFrame(() => tableMeta.editing.addCreatedRowChangeset(createdRow));\n }\n }\n }, [rowCreated]);\n\n return (\n <tr\n onClick={handleCreate}\n className=\"border-grey-300 hover:bg-grey-100 group !sticky bottom-10 left-0 z-[21] !block cursor-pointer border-t\">\n <td className=\"!border-t-0 !bg-transparent\">\n <Button onKeyDown={handleKeyDown} className=\"group-hover:bg-grey-200 sticky left-0\" appearance=\"transparent\">\n + {texts.table3.editing.buttons.create.label}\n </Button>\n </td>\n </tr>\n );\n}\n"],"names":["CreateNewRowButton","props","onEditingCreate","scrollToIndex","table","tableMeta","texts","useLocalization","rows","getCoreRowModel","rowCreated","setRowCreated","React","useState","rowFinder","undefined","handleKeyDown","event","editing","hasChanges","key","saveChanges","handleCreate","Promise","resolve","createdRow","find","row","_rowCreated$rowFinder","call","original","_temp","then","hasRowErrors","id","e","reject","useEffect","_rowCreated$rowFinder2","rowInTable","getRowModel","_rowCreated$rowFinder3","toggleEditing","rowActive","setRowActiveIndex","index","requestAnimationFrame","animateCreateRow","addCreatedRowChangeset","onClick","className","Button","onKeyDown","appearance","table3","buttons","create","label"],"mappings":"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"}
@@ -2,8 +2,9 @@ import React__default from 'react';
2
2
  import { useGlobalKeyDown } from '../../../hooks/useGlobalKeyDown.js';
3
3
  import { _forOf, _catch } from '../../../../../../node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js';
4
4
  import { willRowMove } from '../util/editing.js';
5
+ import { debounce } from 'lodash-es';
5
6
 
6
- function useTableEditing(isEnabled = false, handleSave, validator) {
7
+ function useTableEditing(isEnabled = false, handleSave, handleChange, validator) {
7
8
  // used to switch the table into editing mode
8
9
  const [isEditing, toggleEditing] = React__default.useState(false);
9
10
  // used to switch the editing between "detailed" mode
@@ -13,7 +14,7 @@ function useTableEditing(isEnabled = false, handleSave, validator) {
13
14
  // store pending changes for each row
14
15
  // changes are saved as soon as the active row changes, so in most cases this will only contain the active row's changes
15
16
  // but not always - if validation or server requests fail when saving, those rows remain until the failure is resolved
16
- const pendingChangesFns = usePendingChanges(isEnabled, handleSave, validator);
17
+ const pendingChangesFns = usePendingChanges(isEnabled, handleSave, handleChange, validator);
17
18
  useGlobalKeyDown(isEnabled && isEditing ? {
18
19
  key: 's',
19
20
  meta: true,
@@ -33,12 +34,12 @@ function useTableEditing(isEnabled = false, handleSave, validator) {
33
34
  ...pendingChangesFns
34
35
  };
35
36
  }
36
- function usePendingChanges(isEnabled, handleSave, validator) {
37
+ function usePendingChanges(isEnabled, handleSave, handleChange, validator) {
37
38
  const saveChanges = function (rowId = undefined) {
38
39
  try {
39
40
  let _exit = false;
40
41
  if (!handleSave) {
41
- console.warn('Tried to save, but Table has no onSave handler');
42
+ console.warn('Tried to save, but Table has no onEditingSave handler');
42
43
  return Promise.resolve();
43
44
  }
44
45
  // we save back to pendingChanges, so make a copy of it's state when save was triggered
@@ -79,7 +80,7 @@ function usePendingChanges(isEnabled, handleSave, validator) {
79
80
  }();
80
81
  return _temp2 && _temp2.then ? _temp2.then(_temp3) : _temp3(_temp2); // send new data to the server
81
82
  }, function (error) {
82
- // the onSave handler should throw errors when something fails, e.g. validation, network errors etc
83
+ // the onEditingSave handler should throw errors when something fails, e.g. validation, network errors etc
83
84
  // this code handles those errors and maps them either to row errors or cell specific errors
84
85
  let rowError;
85
86
  let cellErrors;
@@ -153,26 +154,42 @@ function usePendingChanges(isEnabled, handleSave, validator) {
153
154
  return Promise.reject(e);
154
155
  }
155
156
  };
157
+ const setCellValue = function (cell, change, rowIndex) {
158
+ try {
159
+ const changes = {
160
+ [cell.column.id]: change
161
+ };
162
+ setPendingChanges(currentChanges => {
163
+ const nextChanges = createPendingChangesSetter(currentChanges, cell.row, rowIndex, changes);
164
+ pendingChangesUpdater.syncCellChanges(nextChanges);
165
+ return nextChanges;
166
+ });
167
+ pendingChangesUpdater.runCellUpdates(changes, cell, rowIndex);
168
+ return Promise.resolve();
169
+ } catch (e) {
170
+ return Promise.reject(e);
171
+ }
172
+ };
156
173
  const addCreatedRowChangeset = function (row) {
157
174
  try {
158
175
  const cells = row.getAllCells();
159
176
  setPendingChanges(currentChanges => {
160
177
  return cells.reduce((changes, cell) => {
161
178
  if (cell.getValue()) {
162
- var _currentChanges$cell$4, _currentChanges$cell$5, _currentChanges$cell$6;
179
+ var _currentChanges$cell$, _currentChanges$cell$2, _currentChanges$cell$3;
163
180
  return {
164
181
  ...changes,
165
182
  [cell.row.id]: {
166
183
  ...changes[cell.row.id],
167
184
  [cell.column.id]: cell.getValue(),
168
185
  _meta: {
169
- ...((_currentChanges$cell$4 = currentChanges[cell.row.id]) === null || _currentChanges$cell$4 === void 0 ? void 0 : _currentChanges$cell$4._meta),
186
+ ...((_currentChanges$cell$ = currentChanges[cell.row.id]) === null || _currentChanges$cell$ === void 0 ? void 0 : _currentChanges$cell$._meta),
170
187
  original: cell.row.original,
171
188
  moveReason: {
172
- ...((_currentChanges$cell$5 = currentChanges[cell.row.id]) === null || _currentChanges$cell$5 === void 0 ? void 0 : _currentChanges$cell$5._meta.moveReason)
189
+ ...((_currentChanges$cell$2 = currentChanges[cell.row.id]) === null || _currentChanges$cell$2 === void 0 ? void 0 : _currentChanges$cell$2._meta.moveReason)
173
190
  },
174
191
  errors: {
175
- ...((_currentChanges$cell$6 = currentChanges[cell.row.id]) === null || _currentChanges$cell$6 === void 0 ? void 0 : _currentChanges$cell$6._meta.errors)
192
+ ...((_currentChanges$cell$3 = currentChanges[cell.row.id]) === null || _currentChanges$cell$3 === void 0 ? void 0 : _currentChanges$cell$3._meta.errors)
176
193
  }
177
194
  }
178
195
  }
@@ -198,49 +215,7 @@ function usePendingChanges(isEnabled, handleSave, validator) {
198
215
  var _pendingChanges$cell$2, _pendingChanges$cell$3, _pendingChanges$cell$4;
199
216
  return (_pendingChanges$cell$2 = pendingChanges[cell.row.id]) === null || _pendingChanges$cell$2 === void 0 ? void 0 : (_pendingChanges$cell$3 = _pendingChanges$cell$2._meta.errors) === null || _pendingChanges$cell$3 === void 0 ? void 0 : (_pendingChanges$cell$4 = _pendingChanges$cell$3.cells) === null || _pendingChanges$cell$4 === void 0 ? void 0 : _pendingChanges$cell$4[cell.column.id];
200
217
  }
201
- const setCellValue = React__default.useCallback(function (cell, change, rowIndex) {
202
- setPendingChanges(currentChanges => {
203
- var _currentChanges$cell$, _currentChanges$cell$2, _currentChanges$cell$3;
204
- const nextChanges = {
205
- ...currentChanges
206
- };
207
- const rowChanges = {
208
- ...currentChanges[cell.row.id],
209
- _meta: {
210
- ...((_currentChanges$cell$ = currentChanges[cell.row.id]) === null || _currentChanges$cell$ === void 0 ? void 0 : _currentChanges$cell$._meta),
211
- original: cell.row.original,
212
- moveReason: {
213
- ...((_currentChanges$cell$2 = currentChanges[cell.row.id]) === null || _currentChanges$cell$2 === void 0 ? void 0 : _currentChanges$cell$2._meta.moveReason)
214
- },
215
- errors: {
216
- ...((_currentChanges$cell$3 = currentChanges[cell.row.id]) === null || _currentChanges$cell$3 === void 0 ? void 0 : _currentChanges$cell$3._meta.errors)
217
- }
218
- }
219
- };
220
- // update if the change is different to the original (saved) value,
221
- // otherwise remove any change - no point saving the same value
222
- if (change !== cell.row.original[cell.column.id]) {
223
- rowChanges[cell.column.id] = change;
224
- // determine if the row will move position based on this change, and save why it will move
225
- const reason = willRowMove(cell, change, rowIndex);
226
- if (reason) {
227
- rowChanges._meta.moveReason[cell.column.id] = reason;
228
- } else {
229
- delete rowChanges._meta.moveReason[cell.column.id];
230
- }
231
- } else {
232
- delete rowChanges[cell.column.id];
233
- }
234
- // set the changes for the row...
235
- // or delete if there are no changes left, so that we don't store changes with unchanged data
236
- if (Object.keys(rowChanges).filter(k => k !== '_meta').length) {
237
- nextChanges[cell.row.id] = rowChanges;
238
- } else {
239
- delete nextChanges[cell.row.id];
240
- }
241
- return nextChanges;
242
- });
243
- }, []);
218
+ const pendingChangesUpdater = usePendingChangesUpdater(handleChange, setPendingChanges);
244
219
  function hasRowErrors(rowId) {
245
220
  var _pendingChanges$rowId, _pendingChanges$rowId2, _pendingChanges$rowId3, _pendingChanges$rowId4, _pendingChanges$rowId5;
246
221
  if (!isEnabled) {
@@ -361,6 +336,87 @@ function useLastFocusedCellIndex() {
361
336
  }, []);
362
337
  return [lastFocusedCellIndexRef.current, setLastFocusedCellIndex];
363
338
  }
339
+ function usePendingChangesUpdater(handleChange, setPendingChanges) {
340
+ const updatersRef = React__default.useRef({});
341
+ const runCellUpdates = React__default.useCallback(debounce(function (changes, cell, rowIndex) {
342
+ try {
343
+ const _temp4 = function () {
344
+ if (typeof handleChange === 'function') {
345
+ const previousValues = {
346
+ ...cell.row.original,
347
+ ...getChangesetFromChanges(updatersRef.current[cell.row.id])
348
+ };
349
+ const nextValues = {
350
+ ...previousValues,
351
+ ...changes
352
+ };
353
+ return Promise.resolve(handleChange(cell.column.id, changes[cell.column.id], nextValues, previousValues)).then(function (updates) {
354
+ if (updates && Object.keys(updates).length) {
355
+ setPendingChanges(currentChanges => createPendingChangesSetter(currentChanges, cell.row, rowIndex, updates));
356
+ }
357
+ });
358
+ }
359
+ }();
360
+ return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(function () {}) : void 0);
361
+ } catch (e) {
362
+ return Promise.reject(e);
363
+ }
364
+ }, 250), []);
365
+ function syncCellChanges(changes) {
366
+ updatersRef.current = changes;
367
+ }
368
+ return {
369
+ syncCellChanges,
370
+ runCellUpdates
371
+ };
372
+ }
373
+ function createPendingChangesSetter(currentChanges, row, rowIndex, changes) {
374
+ var _currentChanges$row$i, _currentChanges$row$i2, _currentChanges$row$i3;
375
+ // prepare
376
+ const nextChanges = {
377
+ ...currentChanges
378
+ };
379
+ const rowChanges = {
380
+ ...currentChanges[row.id],
381
+ _meta: {
382
+ ...((_currentChanges$row$i = currentChanges[row.id]) === null || _currentChanges$row$i === void 0 ? void 0 : _currentChanges$row$i._meta),
383
+ original: row.original,
384
+ moveReason: {
385
+ ...((_currentChanges$row$i2 = currentChanges[row.id]) === null || _currentChanges$row$i2 === void 0 ? void 0 : _currentChanges$row$i2._meta.moveReason)
386
+ },
387
+ errors: {
388
+ ...((_currentChanges$row$i3 = currentChanges[row.id]) === null || _currentChanges$row$i3 === void 0 ? void 0 : _currentChanges$row$i3._meta.errors)
389
+ }
390
+ }
391
+ };
392
+ // run changes
393
+ const cells = row._getAllCellsByColumnId();
394
+ for (const [accessor, change] of Object.entries(changes)) {
395
+ // update if the change is different to the original (saved) value,
396
+ // otherwise remove any change - no point saving the same value
397
+ if (change !== row.original[accessor]) {
398
+ rowChanges[accessor] = change;
399
+ // determine if the row will move position based on this change, and save why it will move
400
+ const reason = willRowMove(cells[accessor], change, rowIndex);
401
+ if (reason) {
402
+ rowChanges._meta.moveReason[accessor] = reason;
403
+ } else {
404
+ delete rowChanges._meta.moveReason[accessor];
405
+ }
406
+ } else {
407
+ delete rowChanges[accessor];
408
+ delete rowChanges._meta.moveReason[accessor];
409
+ }
410
+ }
411
+ // set changes
412
+ // or delete if there are no changes left, so that we don't store changes with unchanged data
413
+ if (Object.keys(rowChanges).filter(k => k !== '_meta').length) {
414
+ nextChanges[row.id] = rowChanges;
415
+ } else {
416
+ delete nextChanges[row.id];
417
+ }
418
+ return nextChanges;
419
+ }
364
420
  function getChangesetFromChanges(changes) {
365
421
  // extract the original data from the row changes
366
422
  const {