@economic/taco 2.45.0-create.3 → 2.45.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/AlertDialog/AlertDialog.d.ts +2 -1
- package/dist/components/AlertDialog/components/Content.d.ts +2 -0
- package/dist/components/Menu/components/Content.d.ts +1 -1
- package/dist/components/Menu/components/SubMenu.d.ts +1 -1
- package/dist/components/Popover/Popover.d.ts +1 -1
- package/dist/components/Provider/Localization.d.ts +0 -2
- package/dist/components/Report/Report.d.ts +1 -1
- package/dist/components/Select2/components/Search.d.ts +0 -6
- package/dist/components/Table3/Table3.d.ts +14 -2
- package/dist/components/Table3/components/Columns/Internal/EditingActionsMenu.d.ts +2 -1
- package/dist/components/Table3/components/Row/Editing/CreateRowButton.d.ts +11 -0
- package/dist/components/Table3/features/useTableEditing.d.ts +36 -24
- package/dist/components/Table3/types.d.ts +8 -23
- package/dist/components/Table3/useTable3.d.ts +0 -6
- package/dist/components/Table3/util/editing.d.ts +1 -0
- package/dist/esm/index.css +2 -6
- package/dist/esm/node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js +17 -17
- package/dist/esm/node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js.map +1 -1
- package/dist/esm/packages/taco/src/components/AlertDialog/AlertDialog.js +2 -1
- package/dist/esm/packages/taco/src/components/AlertDialog/AlertDialog.js.map +1 -1
- package/dist/esm/packages/taco/src/components/AlertDialog/components/Content.js +7 -2
- package/dist/esm/packages/taco/src/components/AlertDialog/components/Content.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Dialog/components/Content.js +1 -0
- package/dist/esm/packages/taco/src/components/Dialog/components/Content.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Drawer/components/Content.js +1 -0
- package/dist/esm/packages/taco/src/components/Drawer/components/Content.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 +3 -5
- package/dist/esm/packages/taco/src/components/Provider/Localization.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/Select2.js +20 -39
- package/dist/esm/packages/taco/src/components/Select2/Select2.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Search.js +2 -12
- 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/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 +7 -21
- package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js +18 -24
- 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 +36 -5
- 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 +12 -17
- package/dist/esm/packages/taco/src/components/Table3/components/Editing/Alert.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js +90 -0
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js.map +1 -0
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/SaveStatus.js +14 -2
- 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/Row.js +3 -4
- 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 +2 -7
- 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/useTableEditing.js +406 -16
- 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 +32 -37
- package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/useTable3.js +7 -21
- package/dist/esm/packages/taco/src/components/Table3/useTable3.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/util/editing.js +25 -1
- package/dist/esm/packages/taco/src/components/Table3/util/editing.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/Table/Core/Table.js +4 -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 +3 -9
- 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 +3 -6
- 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 +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 +1 -1
- 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/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 +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableRenderer.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/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 +0 -11
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js.map +1 -1
- package/dist/esm/packages/taco/src/utils/dom.js +17 -13
- package/dist/esm/packages/taco/src/utils/dom.js.map +1 -1
- package/dist/index.css +2 -6
- package/dist/primitives/Table/Core/Table.d.ts +0 -1
- package/dist/primitives/Table/Core/components/Columns/Internal/Actions.d.ts +1 -3
- package/dist/primitives/Table/Core/components/Footer/Footer.d.ts +2 -2
- package/dist/primitives/Table/Core/features/useTableStyle.d.ts +3 -3
- 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 +691 -921
- 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 +0 -1
- package/package.json +17 -16
- package/dist/components/Table3/components/Editing/DiscardChangesConfirmationDialog.d.ts +0 -7
- package/dist/components/Table3/components/Row/Editing/CreateNewRow.d.ts +0 -13
- package/dist/components/Table3/components/Row/Editing/TemporaryRow.d.ts +0 -12
- package/dist/components/Table3/features/useEditingState.d.ts +0 -29
- package/dist/esm/packages/taco/src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.js +0 -34
- package/dist/esm/packages/taco/src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.js.map +0 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateNewRow.js +0 -88
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateNewRow.js.map +0 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js +0 -93
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js.map +0 -1
- package/dist/esm/packages/taco/src/components/Table3/features/useEditingState.js +0 -514
- package/dist/esm/packages/taco/src/components/Table3/features/useEditingState.js.map +0 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Alert.js","sources":["../../../../../../../../../src/components/Table3/components/Editing/Alert.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { ScrollToOptions as ReactVirtualScrollToOptions } from '@tanstack/react-virtual';\nimport { Alert as BaseAlert, AlertProps as BaseAlertProps } from '../../../Alert/Alert';\nimport { TableRef } from '../../../../primitives/Table/types';\nimport { Tooltip } from '../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { Group } from '../../../Group/Group';\nimport { Button } from '../../../Button/Button';\n\ntype AlertProps<TType = unknown> = Omit<BaseAlertProps, 'children'> & {\n scrollToIndex: (index: number, options: ReactVirtualScrollToOptions) => void;\n table: ReactTable<TType>;\n tableRef: React.RefObject<TableRef>;\n};\n\nexport function Alert<TType = unknown>(props: AlertProps<TType>) {\n const { scrollToIndex, table, tableRef, ...attributes } = props;\n const { texts } = useLocalization();\n const validationTexts = texts.table3.editing.validation;\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const [showFilterResetDialog, setShowFilterResetDialog] = React.useState<string | false>(false);\n const pendingChangesWithErrors = tableMeta.editing.getErrorsShownInAlert<TType>();\n\n function scrollToRow(rowIndex: number) {\n tableMeta.rowActive.setRowActiveIndex(rowIndex);\n scrollToIndex(rowIndex, { align: 'center' });\n\n requestAnimationFrame(() => {\n const cell = tableRef.current?.querySelector(\n 'tbody > tr[data-row-active=\"true\"] > td[data-cell-editing-invalid=\"true\"]'\n );\n\n if (cell) {\n (cell as HTMLElement).focus?.();\n }\n });\n }\n\n // generate the \"N unsaved entries\" title\n const title = (\n pendingChangesWithErrors.length === 1 ? validationTexts.alert.titleOne : validationTexts.alert.titlePlural\n ).replace('[COUNT]', String(pendingChangesWithErrors.length));\n\n // generate links to each invalid row, to go into the error message\n const links: React.ReactNode[] = [];\n const visibleColumns = table.getVisibleFlatColumns().map(c => c.id);\n const rowIdentityColumn =\n tableMeta.rowIdentityAccessor && visibleColumns.includes(String(tableMeta.rowIdentityAccessor))\n ? table.getColumn(String(tableMeta.rowIdentityAccessor))\n : undefined;\n\n pendingChangesWithErrors.forEach((pendingChangeWithError, index) => {\n // if appropriate, concatenate the item with the text \"and\"\n if (pendingChangesWithErrors.length > 1 && index === pendingChangesWithErrors.length - 1) {\n // Add space before and after `messageAnd` text\n links.push(` ${validationTexts.alert.messageAnd} `);\n }\n\n const rowIndex = table.getRowModel().rows.findIndex(row => row.id === pendingChangeWithError.rowId);\n\n const handleClick = () => {\n // if row is visible\n if (rowIndex > -1) {\n scrollToRow(rowIndex);\n }\n // if row is filtered out\n else {\n setShowFilterResetDialog(pendingChangeWithError.rowId);\n }\n };\n\n let tooltip;\n\n if (pendingChangeWithError.errors.row) {\n tooltip = pendingChangeWithError.errors.row;\n } else {\n const firstCellErrorColumnId = Object.keys(pendingChangeWithError.errors.cells)[0];\n const columnName = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)?.columnDef.meta?.header;\n tooltip = `${columnName}: ${pendingChangeWithError.errors.cells[firstCellErrorColumnId]}`;\n }\n\n const row = table.getRow(pendingChangeWithError.rowId).original;\n\n links.push(\n <Tooltip key={pendingChangeWithError.rowId} title={tooltip}>\n <span className=\"text-blue\" onClick={handleClick} role=\"button\">\n {rowIdentityColumn ? row[rowIdentityColumn.id] : rowIndex + 1}\n </span>\n </Tooltip>\n );\n\n // if appropriate, concatenate the item with the text \",\"\n if (pendingChangesWithErrors.length > 2 && index < pendingChangesWithErrors.length - 2) {\n links.push(', ');\n }\n });\n\n // generate the \"Row N is incomplete and hasn't been saved\" error message\n const message = (links.length === 1 ? validationTexts.alert.messageOne : validationTexts.alert.messagePlural)\n .split(/(\\[\\w+\\])/)\n .map(part => {\n if (part === '[COLUMN]') {\n return rowIdentityColumn?.columnDef.meta?.header ?? validationTexts.alert.messageRow;\n }\n\n if (part === '[ROW]') {\n return links;\n }\n\n return part;\n });\n\n const handleResetFilters = () => {\n table.resetGlobalFilter();\n table.resetColumnFilters();\n\n requestAnimationFrame(() => {\n const rowIndex = table.getRowModel().rows.findIndex(row => row.id === showFilterResetDialog);\n\n if (rowIndex > -1) {\n scrollToRow(rowIndex);\n }\n\n setShowFilterResetDialog(false);\n });\n };\n\n return (\n <>\n <BaseAlert {...attributes} state=\"error\">\n <span className=\"font-bold\">{title}</span> {message}\n </BaseAlert>\n <FilterResetDialog\n open={showFilterResetDialog !== false}\n onChange={() => setShowFilterResetDialog(false)}\n onSubmit={handleResetFilters}\n />\n </>\n );\n}\n\ntype FilterResetDialogProps = Omit<DialogProps, 'children'> & {\n onSubmit: () => void;\n};\n\nfunction FilterResetDialog(props: FilterResetDialogProps) {\n const { onSubmit: handleSubmit, ...dialogProps } = props;\n const { texts } = useLocalization();\n\n return (\n <Dialog {...dialogProps} size=\"xs\">\n <Dialog.Content aria-label=\"Create a new account\">\n <Dialog.Title>{texts.table3.editing.validation.resetFiltersDialog.title}</Dialog.Title>\n\n <p>{texts.table3.editing.validation.resetFiltersDialog.description}</p>\n\n <Dialog.Footer>\n <Group>\n <Dialog.Close>\n <Button>{texts.table3.editing.validation.resetFiltersDialog.cancel}</Button>\n </Dialog.Close>\n <Button appearance=\"primary\" onClick={handleSubmit}>\n {texts.table3.editing.validation.resetFiltersDialog.confirm}\n </Button>\n </Group>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog>\n );\n}\n"],"names":["Alert","props","scrollToIndex","table","tableRef","attributes","texts","useLocalization","validationTexts","table3","editing","validation","tableMeta","options","meta","showFilterResetDialog","setShowFilterResetDialog","React","useState","pendingChangesWithErrors","getErrorsShownInAlert","scrollToRow","rowIndex","rowActive","setRowActiveIndex","align","requestAnimationFrame","cell","_tableRef$current","current","querySelector","_cell$focus","focus","call","title","length","alert","titleOne","titlePlural","replace","String","links","visibleColumns","getVisibleFlatColumns","map","c","id","rowIdentityColumn","rowIdentityAccessor","includes","getColumn","undefined","forEach","pendingChangeWithError","index","push","messageAnd","getRowModel","rows","findIndex","row","rowId","handleClick","tooltip","errors","_table$getAllColumns$","_table$getAllColumns$2","firstCellErrorColumnId","Object","keys","cells","columnName","getAllColumns","find","column","columnDef","header","getRow","original","Tooltip","key","className","onClick","role","message","messageOne","messagePlural","split","part","_rowIdentityColumn$co","_rowIdentityColumn$co2","messageRow","handleResetFilters","resetGlobalFilter","resetColumnFilters","BaseAlert","state","FilterResetDialog","open","onChange","onSubmit","handleSubmit","dialogProps","Dialog","size","Content","Title","resetFiltersDialog","description","Footer","Group","Close","Button","cancel","appearance","confirm"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"Alert.js","sources":["../../../../../../../../../src/components/Table3/components/Editing/Alert.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { ScrollToOptions as ReactVirtualScrollToOptions } from '@tanstack/react-virtual';\nimport { Alert as BaseAlert, AlertProps as BaseAlertProps } from '../../../Alert/Alert';\nimport { TableRef } from '../../../../primitives/Table/types';\nimport { Tooltip } from '../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { Group } from '../../../Group/Group';\nimport { Button } from '../../../Button/Button';\n\ntype AlertProps<TType = unknown> = Omit<BaseAlertProps, 'children'> & {\n scrollToIndex: (index: number, options: ReactVirtualScrollToOptions) => void;\n table: ReactTable<TType>;\n tableRef: React.RefObject<TableRef>;\n};\n\nexport function Alert<TType = unknown>(props: AlertProps<TType>) {\n const { scrollToIndex, table, tableRef, ...attributes } = props;\n const { texts } = useLocalization();\n const validationTexts = texts.table3.editing.validation;\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const [showFilterResetDialog, setShowFilterResetDialog] = React.useState<string | false>(false);\n const pendingChangesWithErrors = tableMeta.editing.getAlertErrors<TType>();\n\n function scrollToRow(rowIndex: number) {\n tableMeta.rowActive.setRowActiveIndex(rowIndex);\n scrollToIndex(rowIndex, { align: 'center' });\n\n requestAnimationFrame(() => {\n const cell = tableRef.current?.querySelector(\n 'tbody > tr[data-row-active=\"true\"] > td[data-cell-editing-invalid=\"true\"]'\n );\n\n if (cell) {\n (cell as HTMLElement).focus?.();\n }\n });\n }\n\n // generate the \"N unsaved entries\" title\n const title = (\n pendingChangesWithErrors.length === 1 ? validationTexts.alert.titleOne : validationTexts.alert.titlePlural\n ).replace('[COUNT]', String(pendingChangesWithErrors.length));\n\n // generate links to each invalid row, to go into the error message\n const links: React.ReactNode[] = [];\n const rowIdentityColumn = tableMeta.rowIdentityColumnId ? table.getColumn(tableMeta.rowIdentityColumnId) : undefined;\n\n pendingChangesWithErrors.forEach((error, index) => {\n // if appropriate, concatenate the item with the text \"and\"\n if (pendingChangesWithErrors.length > 1 && index === pendingChangesWithErrors.length - 1) {\n // Add space before and after `messageAnd` text\n links.push(` ${validationTexts.alert.messageAnd} `);\n }\n const rowIndex = table.getRowModel().rows.findIndex(row => row.id === error.rowId);\n\n const handleClick = () => {\n if (rowIndex > -1) {\n scrollToRow(rowIndex);\n } else {\n setShowFilterResetDialog(error.rowId);\n }\n };\n\n let tooltip;\n\n if (error.pendingChange._meta.errors.row) {\n tooltip = error.pendingChange._meta.errors.row;\n } else {\n const firstCellErrorColumnId = Object.keys(error.pendingChange._meta.errors.cells)[0];\n const columnName = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)?.columnDef.meta?.header;\n tooltip = `${columnName}: ${error.pendingChange._meta.errors.cells[firstCellErrorColumnId]}`;\n }\n\n links.push(\n <Tooltip key={error.rowId} title={tooltip}>\n <span className=\"text-blue\" onClick={handleClick} role=\"button\">\n {rowIdentityColumn ? error.pendingChange._meta.original[rowIdentityColumn.id] : rowIndex + 1}\n </span>\n </Tooltip>\n );\n\n // if appropriate, concatenate the item with the text \",\"\n if (pendingChangesWithErrors.length > 2 && index < pendingChangesWithErrors.length - 2) {\n links.push(', ');\n }\n });\n\n // generate the \"Row N is incomplete and hasn't been saved\" error message\n const message = (links.length === 1 ? validationTexts.alert.messageOne : validationTexts.alert.messagePlural)\n .split(/(\\[\\w+\\])/)\n .map(part => {\n if (part === '[COLUMN]') {\n return rowIdentityColumn?.columnDef.meta?.header ?? validationTexts.alert.messageRow;\n }\n\n if (part === '[ROW]') {\n return links;\n }\n\n return part;\n });\n\n const handleResetFilters = () => {\n table.resetGlobalFilter();\n table.resetColumnFilters();\n\n requestAnimationFrame(() => {\n const rowIndex = table.getRowModel().rows.findIndex(row => row.id === showFilterResetDialog);\n\n if (rowIndex > -1) {\n scrollToRow(rowIndex);\n }\n\n setShowFilterResetDialog(false);\n });\n };\n\n return (\n <>\n <BaseAlert {...attributes} state=\"error\">\n <span className=\"font-bold\">{title}</span> {message}\n </BaseAlert>\n <FilterResetDialog\n open={showFilterResetDialog !== false}\n onChange={() => setShowFilterResetDialog(false)}\n onSubmit={handleResetFilters}\n />\n </>\n );\n}\n\ntype FilterResetDialogProps = Omit<DialogProps, 'children'> & {\n onSubmit: () => void;\n};\n\nfunction FilterResetDialog(props: FilterResetDialogProps) {\n const { onSubmit: handleSubmit, ...dialogProps } = props;\n const { texts } = useLocalization();\n\n return (\n <Dialog {...dialogProps} size=\"xs\">\n <Dialog.Content aria-label=\"Create a new account\">\n <Dialog.Title>{texts.table3.editing.validation.resetFiltersDialog.title}</Dialog.Title>\n\n <p>{texts.table3.editing.validation.resetFiltersDialog.description}</p>\n\n <Dialog.Footer>\n <Group>\n <Dialog.Close>\n <Button>{texts.table3.editing.validation.resetFiltersDialog.cancel}</Button>\n </Dialog.Close>\n <Button appearance=\"primary\" onClick={handleSubmit}>\n {texts.table3.editing.validation.resetFiltersDialog.confirm}\n </Button>\n </Group>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog>\n );\n}\n"],"names":["Alert","props","scrollToIndex","table","tableRef","attributes","texts","useLocalization","validationTexts","table3","editing","validation","tableMeta","options","meta","showFilterResetDialog","setShowFilterResetDialog","React","useState","pendingChangesWithErrors","getAlertErrors","scrollToRow","rowIndex","rowActive","setRowActiveIndex","align","requestAnimationFrame","cell","_tableRef$current","current","querySelector","_cell$focus","focus","call","title","length","alert","titleOne","titlePlural","replace","String","links","rowIdentityColumn","rowIdentityColumnId","getColumn","undefined","forEach","error","index","push","messageAnd","getRowModel","rows","findIndex","row","id","rowId","handleClick","tooltip","pendingChange","_meta","errors","_table$getAllColumns$","_table$getAllColumns$2","firstCellErrorColumnId","Object","keys","cells","columnName","getAllColumns","find","column","columnDef","header","Tooltip","key","className","onClick","role","original","message","messageOne","messagePlural","split","map","part","_rowIdentityColumn$co","_rowIdentityColumn$co2","messageRow","handleResetFilters","resetGlobalFilter","resetColumnFilters","BaseAlert","state","FilterResetDialog","open","onChange","onSubmit","handleSubmit","dialogProps","Dialog","size","Content","Title","resetFiltersDialog","description","Footer","Group","Close","Button","cancel","appearance","confirm"],"mappings":"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"}
|
package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js
ADDED
@@ -0,0 +1,90 @@
|
|
1
|
+
import React__default from 'react';
|
2
|
+
import { useLocalization } from '../../../../Provider/Localization.js';
|
3
|
+
import { Button } from '../../../../Button/Button.js';
|
4
|
+
import { animateCreateRow } from '../../../util/editing.js';
|
5
|
+
|
6
|
+
function CreateNewRowButton(props) {
|
7
|
+
const {
|
8
|
+
onEditingCreate,
|
9
|
+
scrollToIndex,
|
10
|
+
table,
|
11
|
+
tableMeta
|
12
|
+
} = props;
|
13
|
+
const {
|
14
|
+
texts
|
15
|
+
} = useLocalization();
|
16
|
+
const rows = table.getCoreRowModel().rows.filter(row => row.original !== undefined);
|
17
|
+
const [rowCreated, setRowCreated] = React__default.useState({
|
18
|
+
rowFinder: undefined
|
19
|
+
});
|
20
|
+
const handleKeyDown = event => {
|
21
|
+
if (!tableMeta.editing.hasChanges() && event.key === 'Tab') {
|
22
|
+
tableMeta.editing.saveChanges();
|
23
|
+
}
|
24
|
+
};
|
25
|
+
const handleCreate = function () {
|
26
|
+
try {
|
27
|
+
if (!onEditingCreate) {
|
28
|
+
return Promise.resolve();
|
29
|
+
}
|
30
|
+
const createdRow = rows.find(row => {
|
31
|
+
var _rowCreated$rowFinder;
|
32
|
+
return rowCreated === null || rowCreated === void 0 ? void 0 : (_rowCreated$rowFinder = rowCreated.rowFinder) === null || _rowCreated$rowFinder === void 0 ? void 0 : _rowCreated$rowFinder.call(rowCreated, row.original);
|
33
|
+
});
|
34
|
+
const _temp = function () {
|
35
|
+
if (createdRow) {
|
36
|
+
return Promise.resolve(tableMeta.editing.saveChanges()).then(function () {
|
37
|
+
if (!tableMeta.editing.hasRowErrors(createdRow.id)) {
|
38
|
+
const rowFinder = onEditingCreate();
|
39
|
+
setRowCreated({
|
40
|
+
rowFinder
|
41
|
+
});
|
42
|
+
}
|
43
|
+
});
|
44
|
+
} else {
|
45
|
+
const rowFinder = onEditingCreate();
|
46
|
+
setRowCreated({
|
47
|
+
rowFinder
|
48
|
+
});
|
49
|
+
}
|
50
|
+
}();
|
51
|
+
return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
|
52
|
+
} catch (e) {
|
53
|
+
return Promise.reject(e);
|
54
|
+
}
|
55
|
+
};
|
56
|
+
React__default.useEffect(() => {
|
57
|
+
if (typeof (rowCreated === null || rowCreated === void 0 ? void 0 : rowCreated.rowFinder) === 'function') {
|
58
|
+
const createdRow = rows.find(row => {
|
59
|
+
var _rowCreated$rowFinder2;
|
60
|
+
return rowCreated === null || rowCreated === void 0 ? void 0 : (_rowCreated$rowFinder2 = rowCreated.rowFinder) === null || _rowCreated$rowFinder2 === void 0 ? void 0 : _rowCreated$rowFinder2.call(rowCreated, row.original);
|
61
|
+
});
|
62
|
+
if (createdRow) {
|
63
|
+
const rowInTable = table.getRowModel().rows.filter(row => row.original !== undefined).find(row => {
|
64
|
+
var _rowCreated$rowFinder3;
|
65
|
+
return rowCreated === null || rowCreated === void 0 ? void 0 : (_rowCreated$rowFinder3 = rowCreated.rowFinder) === null || _rowCreated$rowFinder3 === void 0 ? void 0 : _rowCreated$rowFinder3.call(rowCreated, row.original);
|
66
|
+
});
|
67
|
+
if (rowInTable) {
|
68
|
+
tableMeta.editing.toggleEditing(true);
|
69
|
+
tableMeta.rowActive.setRowActiveIndex(createdRow.index);
|
70
|
+
scrollToIndex(createdRow.index);
|
71
|
+
requestAnimationFrame(() => animateCreateRow(createdRow.id));
|
72
|
+
}
|
73
|
+
requestAnimationFrame(() => tableMeta.editing.addCreatedRowChangeset(createdRow));
|
74
|
+
}
|
75
|
+
}
|
76
|
+
}, [rowCreated]);
|
77
|
+
return /*#__PURE__*/React__default.createElement("tr", {
|
78
|
+
onClick: handleCreate,
|
79
|
+
className: "border-grey-300 hover:bg-grey-100 group !sticky bottom-10 left-0 z-[21] !block cursor-pointer border-t"
|
80
|
+
}, /*#__PURE__*/React__default.createElement("td", {
|
81
|
+
className: "!border-t-0 !bg-transparent"
|
82
|
+
}, /*#__PURE__*/React__default.createElement(Button, {
|
83
|
+
onKeyDown: handleKeyDown,
|
84
|
+
className: "group-hover:bg-grey-200 sticky left-0",
|
85
|
+
appearance: "transparent"
|
86
|
+
}, "+ ", texts.table3.editing.buttons.create.label)));
|
87
|
+
}
|
88
|
+
|
89
|
+
export default CreateNewRowButton;
|
90
|
+
//# sourceMappingURL=CreateRowButton.js.map
|
package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js.map
ADDED
@@ -0,0 +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 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.filter(row => row.original !== undefined);\n\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\n .getRowModel()\n .rows.filter(row => row.original !== undefined)\n .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","filter","row","original","undefined","rowCreated","setRowCreated","React","useState","rowFinder","handleKeyDown","event","editing","hasChanges","key","saveChanges","handleCreate","Promise","resolve","createdRow","find","_rowCreated$rowFinder","call","_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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"}
|
@@ -5,6 +5,7 @@ import { Tooltip } from '../../../../Tooltip/Tooltip.js';
|
|
5
5
|
import { useLocalization } from '../../../../Provider/Localization.js';
|
6
6
|
import { Spinner } from '../../../../Spinner/Spinner.js';
|
7
7
|
|
8
|
+
const COMPLETE_INDICATOR_DELAY = 3000;
|
8
9
|
function SaveStatus(props) {
|
9
10
|
const {
|
10
11
|
rowId,
|
@@ -14,7 +15,18 @@ function SaveStatus(props) {
|
|
14
15
|
texts
|
15
16
|
} = useLocalization();
|
16
17
|
const tableMeta = table.options.meta;
|
17
|
-
const status = tableMeta.editing.
|
18
|
+
const status = tableMeta.editing.getRowSaveStatus(rowId);
|
19
|
+
React__default.useEffect(() => {
|
20
|
+
let timeout;
|
21
|
+
if (status === 'complete') {
|
22
|
+
timeout = setTimeout(() => {
|
23
|
+
tableMeta.editing.setRowSaveStatus(rowId, undefined);
|
24
|
+
}, COMPLETE_INDICATOR_DELAY);
|
25
|
+
}
|
26
|
+
return () => {
|
27
|
+
clearTimeout(timeout);
|
28
|
+
};
|
29
|
+
}, [status]);
|
18
30
|
const className = cn('col-span-full sticky ml-auto right-0 top-0 -mb-[100%] z-10 h-8 bg-[inherit] flex items-center px-1.5 shadow-[-6px_0px_6px_var(--table-row-actions-shadow)]', {
|
19
31
|
'mt-0.5': tableMeta.rowHeight.height === 'short',
|
20
32
|
'mt-1': tableMeta.rowHeight.height === 'medium',
|
@@ -25,7 +37,7 @@ function SaveStatus(props) {
|
|
25
37
|
className: "!contents"
|
26
38
|
}, /*#__PURE__*/React__default.createElement("span", {
|
27
39
|
className: className
|
28
|
-
}, status === '
|
40
|
+
}, status === 'pending' ? (/*#__PURE__*/React__default.createElement(Tooltip, {
|
29
41
|
title: texts.table3.editing.saving.progress
|
30
42
|
}, /*#__PURE__*/React__default.createElement(Spinner, {
|
31
43
|
delay: 0,
|
package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/SaveStatus.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SaveStatus.js","sources":["../../../../../../../../../../src/components/Table3/components/Row/Editing/SaveStatus.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport clsx from 'clsx';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { BadgeIcon } from '../../../../BadgeIcon/BadgeIcon';\nimport { Spinner } from '../../../../Spinner/Spinner';\n\ntype SaveStatusProps<TType = unknown> = {\n rowId: string;\n table: ReactTable<TType>;\n};\n\nexport function SaveStatus<TType = unknown>(props: SaveStatusProps<TType>) {\n const { rowId, table } = props;\n const { texts } = useLocalization();\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const status = tableMeta.editing.
|
1
|
+
{"version":3,"file":"SaveStatus.js","sources":["../../../../../../../../../../src/components/Table3/components/Row/Editing/SaveStatus.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport clsx from 'clsx';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { BadgeIcon } from '../../../../BadgeIcon/BadgeIcon';\nimport { Spinner } from '../../../../Spinner/Spinner';\n\nconst COMPLETE_INDICATOR_DELAY = 3000;\n\ntype SaveStatusProps<TType = unknown> = {\n rowId: string;\n table: ReactTable<TType>;\n};\n\nexport function SaveStatus<TType = unknown>(props: SaveStatusProps<TType>) {\n const { rowId, table } = props;\n const { texts } = useLocalization();\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const status = tableMeta.editing.getRowSaveStatus(rowId);\n\n React.useEffect(() => {\n let timeout;\n\n if (status === 'complete') {\n timeout = setTimeout(() => {\n tableMeta.editing.setRowSaveStatus(rowId, undefined);\n }, COMPLETE_INDICATOR_DELAY);\n }\n\n return () => {\n clearTimeout(timeout);\n };\n }, [status]);\n\n const className = clsx(\n 'col-span-full sticky ml-auto right-0 top-0 -mb-[100%] z-10 h-8 bg-[inherit] flex items-center px-1.5 shadow-[-6px_0px_6px_var(--table-row-actions-shadow)]',\n {\n 'mt-0.5': tableMeta.rowHeight.height === 'short',\n 'mt-1': tableMeta.rowHeight.height === 'medium',\n 'mt-1.5': tableMeta.rowHeight.height === 'tall',\n 'mt-2': tableMeta.rowHeight.height === 'extra-tall',\n }\n );\n\n return (\n <td className=\"!contents\">\n <span className={className}>\n {status === 'pending' ? (\n <Tooltip title={texts.table3.editing.saving.progress}>\n <Spinner delay={0} className=\"mr-1 !h-5 !w-5\" />\n </Tooltip>\n ) : (\n <Tooltip title={texts.table3.editing.saving.complete}>\n <BadgeIcon icon=\"tick\" color=\"green\" subtle className=\"mr-1\" />\n </Tooltip>\n )}\n </span>\n </td>\n );\n}\n"],"names":["COMPLETE_INDICATOR_DELAY","SaveStatus","props","rowId","table","texts","useLocalization","tableMeta","options","meta","status","editing","getRowSaveStatus","React","useEffect","timeout","setTimeout","setRowSaveStatus","undefined","clearTimeout","className","clsx","rowHeight","height","Tooltip","title","table3","saving","progress","Spinner","delay","complete","BadgeIcon","icon","color","subtle"],"mappings":";;;;;;;AAQA,MAAMA,wBAAwB,GAAG,IAAI;SAOrBC,UAAUA,CAAkBC,KAA6B;EACrE,MAAM;IAAEC,KAAK;IAAEC;GAAO,GAAGF,KAAK;EAC9B,MAAM;IAAEG;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,SAAS,GAAGH,KAAK,CAACI,OAAO,CAACC,IAA6B;EAC7D,MAAMC,MAAM,GAAGH,SAAS,CAACI,OAAO,CAACC,gBAAgB,CAACT,KAAK,CAAC;EAExDU,cAAK,CAACC,SAAS,CAAC;IACZ,IAAIC,OAAO;IAEX,IAAIL,MAAM,KAAK,UAAU,EAAE;MACvBK,OAAO,GAAGC,UAAU,CAAC;QACjBT,SAAS,CAACI,OAAO,CAACM,gBAAgB,CAACd,KAAK,EAAEe,SAAS,CAAC;OACvD,EAAElB,wBAAwB,CAAC;;IAGhC,OAAO;MACHmB,YAAY,CAACJ,OAAO,CAAC;KACxB;GACJ,EAAE,CAACL,MAAM,CAAC,CAAC;EAEZ,MAAMU,SAAS,GAAGC,EAAI,CAClB,4JAA4J,EAC5J;IACI,QAAQ,EAAEd,SAAS,CAACe,SAAS,CAACC,MAAM,KAAK,OAAO;IAChD,MAAM,EAAEhB,SAAS,CAACe,SAAS,CAACC,MAAM,KAAK,QAAQ;IAC/C,QAAQ,EAAEhB,SAAS,CAACe,SAAS,CAACC,MAAM,KAAK,MAAM;IAC/C,MAAM,EAAEhB,SAAS,CAACe,SAAS,CAACC,MAAM,KAAK;GAC1C,CACJ;EAED,oBACIV;IAAIO,SAAS,EAAC;kBACVP;IAAMO,SAAS,EAAEA;KACZV,MAAM,KAAK,SAAS,iBACjBG,6BAACW,OAAO;IAACC,KAAK,EAAEpB,KAAK,CAACqB,MAAM,CAACf,OAAO,CAACgB,MAAM,CAACC;kBACxCf,6BAACgB,OAAO;IAACC,KAAK,EAAE,CAAC;IAAEV,SAAS,EAAC;IAAmB,CAC1C,kBAEVP,6BAACW,OAAO;IAACC,KAAK,EAAEpB,KAAK,CAACqB,MAAM,CAACf,OAAO,CAACgB,MAAM,CAACI;kBACxClB,6BAACmB,SAAS;IAACC,IAAI,EAAC,MAAM;IAACC,KAAK,EAAC,OAAO;IAACC,MAAM;IAACf,SAAS,EAAC;IAAS,CACzD,CACb,CACE,CACN;AAEb;;;;"}
|
@@ -27,13 +27,12 @@ function Row(props) {
|
|
27
27
|
}
|
28
28
|
}
|
29
29
|
}, [tableMeta.editing.isEditing, isActiveRow]);
|
30
|
-
const rowStatus = tableMeta.editing.getRowStatus(row.id);
|
31
30
|
const attributes = {
|
32
|
-
'data-row-editing-invalid': tableMeta.editing.hasRowErrors(row.id) ? !tableMeta.editing.
|
33
|
-
'data-row-editing-status':
|
31
|
+
'data-row-editing-invalid': tableMeta.editing.isEnabled && tableMeta.editing.hasRowErrors(row.id) ? !tableMeta.editing.hasRowErrorsSeen(row.id) ? 'unseen' : true : undefined,
|
32
|
+
'data-row-editing-status': tableMeta.editing.isEnabled && tableMeta.editing.getRowSaveStatus(row.id) ? tableMeta.editing.getRowSaveStatus(row.id) : undefined,
|
34
33
|
onFocus: handleFocus
|
35
34
|
};
|
36
|
-
return /*#__PURE__*/React__default.createElement(DisplayRow, Object.assign({}, props, attributes),
|
35
|
+
return /*#__PURE__*/React__default.createElement(DisplayRow, Object.assign({}, props, attributes), tableMeta.editing.getRowSaveStatus(row.id) ? /*#__PURE__*/React__default.createElement(SaveStatus, {
|
37
36
|
rowId: row.id,
|
38
37
|
table: table
|
39
38
|
}) : null);
|
@@ -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 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
|
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;;;;"}
|
@@ -30,20 +30,15 @@ function Editing(props) {
|
|
30
30
|
(_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.click();
|
31
31
|
});
|
32
32
|
const handleChange = enabled => {
|
33
|
-
|
34
|
-
tableMeta.rowActive.setRowActiveIndex(0);
|
35
|
-
}
|
33
|
+
tableMeta.editing.toggleEditing(enabled);
|
36
34
|
requestAnimationFrame(() => {
|
37
35
|
var _tableMeta$rowActive$;
|
38
|
-
|
39
|
-
tableMeta.editing.toggleEditing(enabled, table);
|
40
|
-
scrollToIndex((_tableMeta$rowActive$ = tableMeta.rowActive.rowActiveIndex) !== null && _tableMeta$rowActive$ !== void 0 ? _tableMeta$rowActive$ : 0);
|
36
|
+
return scrollToIndex((_tableMeta$rowActive$ = tableMeta.rowActive.rowActiveIndex) !== null && _tableMeta$rowActive$ !== void 0 ? _tableMeta$rowActive$ : 0);
|
41
37
|
});
|
42
38
|
};
|
43
39
|
return /*#__PURE__*/React__default.createElement(Tooltip, {
|
44
40
|
title: tooltip
|
45
41
|
}, /*#__PURE__*/React__default.createElement(ModeSwitch, {
|
46
|
-
"data-table": "editing-toggle",
|
47
42
|
checked: tableMeta.editing.isEditing,
|
48
43
|
onChange: handleChange,
|
49
44
|
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 { 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
|
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;;;;"}
|