@economic/taco 2.46.4 → 2.46.6
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.
- package/dist/components/RadioGroup/RadioGroup.d.ts +2 -2
- package/dist/components/Table3/features/useEditingState.d.ts +1 -1
- package/dist/components/Table3/features/useTableEditing.d.ts +4 -3
- package/dist/esm/packages/taco/src/components/Input/util.js +1 -1
- package/dist/esm/packages/taco/src/components/Input/util.js.map +1 -1
- package/dist/esm/packages/taco/src/components/RadioGroup/RadioGroup.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/Table3.js +0 -1
- package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateNewRow.js +4 -33
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateNewRow.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/features/useEditingState.js +4 -4
- package/dist/esm/packages/taco/src/components/Table3/features/useEditingState.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js +32 -1
- 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 +7 -5
- package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/useTable3.js +4 -1
- package/dist/esm/packages/taco/src/components/Table3/useTable3.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js +5 -4
- package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/EmptyStateBody.js +6 -0
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/EmptyStateBody.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js +2 -2
- 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/Columns/Internal/Drag.js +7 -0
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Drag.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Expansion.js +7 -0
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Expansion.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Selection.js +2 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Selection.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/Row.js +3 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/Row.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/RowContext.js +3 -2
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/RowContext.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableRenderer.js +5 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableRenderer.js.map +1 -1
- package/dist/primitives/Table/Core/components/Body/EmptyStateBody.d.ts +1 -0
- package/dist/primitives/Table/Core/components/Row/RowContext.d.ts +2 -1
- package/dist/primitives/Table/Core/types.d.ts +1 -0
- package/dist/taco.cjs.development.js +91 -58
- 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/package.json +2 -2
|
@@ -2,7 +2,37 @@ import React__default from 'react';
|
|
|
2
2
|
import { isTemporaryRow } from '../util/editing.js';
|
|
3
3
|
import { usePendingChangesState } from './useEditingState.js';
|
|
4
4
|
|
|
5
|
-
function useTableEditing(isEnabled = false, handleSave, handleChange, rowIdentityAccessor, validator) {
|
|
5
|
+
function useTableEditing(isEnabled = false, handleSave, handleChange, handleCreate, rowIdentityAccessor, validator) {
|
|
6
|
+
const createRow = function (table, scrollToIndex, row) {
|
|
7
|
+
try {
|
|
8
|
+
if (!handleCreate) {
|
|
9
|
+
return Promise.resolve();
|
|
10
|
+
}
|
|
11
|
+
const tableMeta = table.options.meta;
|
|
12
|
+
return Promise.resolve(tableMeta.editing.saveChanges(table)).then(function (saved) {
|
|
13
|
+
if (!saved) {
|
|
14
|
+
return;
|
|
15
|
+
}
|
|
16
|
+
const changeset = row !== null && row !== void 0 ? row : handleCreate();
|
|
17
|
+
try {
|
|
18
|
+
if (changeset) {
|
|
19
|
+
const rowId = pendingChangesFns.insertTemporaryRow(changeset);
|
|
20
|
+
table.getRow(rowId).pin('bottom');
|
|
21
|
+
// set the active row to the new row before toggling editing on
|
|
22
|
+
const temporaryRows = tableMeta.editing.temporaryRows;
|
|
23
|
+
const nextRowIndex = temporaryRows.length ? tableMeta.length + 1 : tableMeta.length;
|
|
24
|
+
tableMeta.rowActive.setRowActiveIndex(nextRowIndex);
|
|
25
|
+
toggleEditing(true, table, scrollToIndex);
|
|
26
|
+
setLastFocusedCellIndex(undefined);
|
|
27
|
+
}
|
|
28
|
+
} catch (error) {
|
|
29
|
+
console.error(error);
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
} catch (e) {
|
|
33
|
+
return Promise.reject(e);
|
|
34
|
+
}
|
|
35
|
+
};
|
|
6
36
|
// used to switch the table into editing mode
|
|
7
37
|
const [isEditing, setEditing] = React__default.useState(false);
|
|
8
38
|
// used to switch the editing between "detailed" mode
|
|
@@ -40,6 +70,7 @@ function useTableEditing(isEnabled = false, handleSave, handleChange, rowIdentit
|
|
|
40
70
|
toggleEditing: isEnabled ? toggleEditing : () => undefined,
|
|
41
71
|
lastFocusedCellIndex,
|
|
42
72
|
setLastFocusedCellIndex,
|
|
73
|
+
createRow,
|
|
43
74
|
createRowButtonRef,
|
|
44
75
|
...pendingChangesFns
|
|
45
76
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTableEditing.js","sources":["../../../../../../../../src/components/Table3/features/useTableEditing.ts"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport {
|
|
1
|
+
{"version":3,"file":"useTableEditing.js","sources":["../../../../../../../../src/components/Table3/features/useTableEditing.ts"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport {\n Table3EditingChangeHandler,\n Table3EditingCreateHandler,\n Table3EditingSaveHandler,\n Table3EditingValidatorFn,\n} from '../types';\nimport { usePendingChangesState } from './useEditingState';\nimport { isTemporaryRow } from '../util/editing';\n\nexport function useTableEditing<TType = unknown>(\n isEnabled = false,\n handleSave: Table3EditingSaveHandler<TType> | undefined,\n handleChange: Table3EditingChangeHandler<TType> | undefined,\n handleCreate: Table3EditingCreateHandler<TType> | undefined,\n rowIdentityAccessor: keyof TType | undefined,\n validator: Table3EditingValidatorFn<TType> | undefined\n) {\n // used to switch the table into editing mode\n const [isEditing, setEditing] = React.useState(false);\n\n // used to switch the editing between \"detailed\" mode\n const [isDetailedMode, toggleDetailedMode] = React.useState(false);\n\n // used to contain ref to the create button\n const createRowButtonRef = React.useRef<HTMLButtonElement>(null);\n\n // store the last focused cell, so that up/down arrow key navigation remains in the same column\n const [lastFocusedCellIndex, setLastFocusedCellIndex] = React.useState<number | undefined>(undefined);\n\n const pendingChangesFns = usePendingChangesState<TType>(\n handleSave,\n handleChange,\n rowIdentityAccessor as keyof TType,\n validator\n );\n\n function toggleEditing<T extends TType>(\n enabled: React.SetStateAction<boolean>,\n table: ReactTable<T>,\n scrollToIndex: (index: number) => void\n ) {\n if (!enabled) {\n // save\n pendingChangesFns.saveChanges(table);\n // reset detailed mode\n toggleDetailedMode(false);\n // reset the last index back to the first focusable element, when editing gets turned off\n setLastFocusedCellIndex(undefined);\n }\n\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const index = tableMeta.rowActive.rowActiveIndex ?? 0;\n\n if (tableMeta.rowActive.rowActiveIndex === undefined) {\n tableMeta.rowActive.setRowActiveIndex(index);\n }\n\n setEditing(enabled);\n\n if (!isTemporaryRow(table.getRowModel().rows[index]?.id)) {\n scrollToIndex(index);\n }\n }\n\n async function createRow<T extends TType>(table: ReactTable<T>, scrollToIndex: (index: number) => void, row?: Partial<T>) {\n if (!handleCreate) {\n return;\n }\n\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const saved = await tableMeta.editing.saveChanges(table);\n\n if (!saved) {\n return;\n }\n\n const changeset = row ?? handleCreate();\n\n try {\n if (changeset) {\n const rowId = pendingChangesFns.insertTemporaryRow(changeset);\n table.getRow(rowId).pin('bottom');\n\n // set the active row to the new row before toggling editing on\n const temporaryRows = tableMeta.editing.temporaryRows as TType[];\n const nextRowIndex = temporaryRows.length ? tableMeta.length + 1 : tableMeta.length;\n tableMeta.rowActive.setRowActiveIndex(nextRowIndex);\n\n toggleEditing(true, table, scrollToIndex);\n setLastFocusedCellIndex(undefined);\n }\n } catch (error) {\n console.error(error);\n }\n }\n\n return {\n isEnabled,\n isEditing,\n isDetailedMode,\n toggleDetailedMode: isEnabled ? toggleDetailedMode : () => undefined,\n toggleEditing: isEnabled ? toggleEditing : () => undefined,\n lastFocusedCellIndex,\n setLastFocusedCellIndex,\n createRow,\n createRowButtonRef,\n ...pendingChangesFns,\n };\n}\n"],"names":["useTableEditing","isEnabled","handleSave","handleChange","handleCreate","rowIdentityAccessor","validator","createRow","table","scrollToIndex","row","Promise","resolve","tableMeta","options","meta","editing","saveChanges","then","saved","changeset","rowId","pendingChangesFns","insertTemporaryRow","getRow","pin","temporaryRows","nextRowIndex","length","rowActive","setRowActiveIndex","toggleEditing","setLastFocusedCellIndex","undefined","error","console","e","reject","isEditing","setEditing","React","useState","isDetailedMode","toggleDetailedMode","createRowButtonRef","useRef","lastFocusedCellIndex","usePendingChangesState","enabled","index","_tableMeta$rowActive$","rowActiveIndex","isTemporaryRow","_table$getRowModel$ro","getRowModel","rows","id"],"mappings":"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"}
|
|
@@ -13,11 +13,13 @@ function useTableEditingListener(table, tableRef, scrollToIndex) {
|
|
|
13
13
|
// store the last row active index, otherwise everytime tableMeta.editing.saveChanges changes the hook runs again
|
|
14
14
|
const lastRowActiveIndexRef = React__default.useRef(tableMeta.rowActive.rowActiveIndex);
|
|
15
15
|
useLazyEffect(() => {
|
|
16
|
-
if (tableMeta.
|
|
16
|
+
if (tableMeta.rowActive.rowActiveIndex !== lastRowActiveIndexRef.current) {
|
|
17
17
|
lastRowActiveIndexRef.current = tableMeta.rowActive.rowActiveIndex;
|
|
18
|
-
tableMeta.editing.
|
|
18
|
+
if (tableMeta.editing.isEditing && lastRowActiveIndexRef.current !== undefined) {
|
|
19
|
+
tableMeta.editing.saveChanges(table);
|
|
20
|
+
}
|
|
19
21
|
}
|
|
20
|
-
}, [tableMeta.rowActive.rowActiveIndex
|
|
22
|
+
}, [tableMeta.rowActive.rowActiveIndex]);
|
|
21
23
|
// show a warning if the user navigates away without triggering save, such as using the browser back/forward button
|
|
22
24
|
const hasChanges = tableMeta.editing.hasChanges();
|
|
23
25
|
React__default.useEffect(() => {
|
|
@@ -43,9 +45,9 @@ function useTableEditingListener(table, tableRef, scrollToIndex) {
|
|
|
43
45
|
const onClickOutside = event => {
|
|
44
46
|
if (tableMeta.editing.isEditing) {
|
|
45
47
|
const element = event.target;
|
|
46
|
-
const
|
|
48
|
+
const isTableOrIsInsideTable = element.tagName === 'TABLE' || element.tagName === 'TBODY' || element.getAttribute('data-taco') === 'backdrop' || element.getAttribute('data-table') === 'editing-toggle' || !document.body.contains(element) || isElementInsideOrTriggeredFromContainer(element, tableRef.current);
|
|
47
49
|
// users can click the white space below rows which could be inside the table, but a valid scenario to save
|
|
48
|
-
if (!
|
|
50
|
+
if (!isTableOrIsInsideTable) {
|
|
49
51
|
tableMeta.editing.saveChanges(table);
|
|
50
52
|
}
|
|
51
53
|
}
|
package/dist/esm/packages/taco/src/components/Table3/listeners/useTableEditingListener.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTableEditingListener.js","sources":["../../../../../../../../src/components/Table3/listeners/useTableEditingListener.ts"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { useLazyEffect } from '../../../hooks/useLazyEffect';\nimport { isElementInsideOrTriggeredFromContainer } from '../../../utils/dom';\nimport { TableRef } from '../../../primitives/Table/types';\nimport { resetHighlightedColumnIndexes } from '../../../primitives/Table/useTableManager/util/search';\nimport { useLocalization } from '../../Provider/Localization';\nimport { useGlobalKeyDown } from '../../../hooks/useGlobalKeyDown';\nimport { shortcut } from '../util/editing';\n\nexport function useTableEditingListener<TType = unknown>(\n table: ReactTable<TType>,\n tableRef: React.RefObject<TableRef>,\n scrollToIndex: (index: number) => void\n) {\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const localization = useLocalization();\n\n // save when the row changes\n // store the last row active index, otherwise everytime tableMeta.editing.saveChanges changes the hook runs again\n const lastRowActiveIndexRef = React.useRef<number | undefined>(tableMeta.rowActive.rowActiveIndex);\n\n useLazyEffect(() => {\n if (
|
|
1
|
+
{"version":3,"file":"useTableEditingListener.js","sources":["../../../../../../../../src/components/Table3/listeners/useTableEditingListener.ts"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { useLazyEffect } from '../../../hooks/useLazyEffect';\nimport { isElementInsideOrTriggeredFromContainer } from '../../../utils/dom';\nimport { TableRef } from '../../../primitives/Table/types';\nimport { resetHighlightedColumnIndexes } from '../../../primitives/Table/useTableManager/util/search';\nimport { useLocalization } from '../../Provider/Localization';\nimport { useGlobalKeyDown } from '../../../hooks/useGlobalKeyDown';\nimport { shortcut } from '../util/editing';\n\nexport function useTableEditingListener<TType = unknown>(\n table: ReactTable<TType>,\n tableRef: React.RefObject<TableRef>,\n scrollToIndex: (index: number) => void\n) {\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const localization = useLocalization();\n\n // save when the row changes\n // store the last row active index, otherwise everytime tableMeta.editing.saveChanges changes the hook runs again\n const lastRowActiveIndexRef = React.useRef<number | undefined>(tableMeta.rowActive.rowActiveIndex);\n\n useLazyEffect(() => {\n if (tableMeta.rowActive.rowActiveIndex !== lastRowActiveIndexRef.current) {\n lastRowActiveIndexRef.current = tableMeta.rowActive.rowActiveIndex;\n\n if (tableMeta.editing.isEditing && lastRowActiveIndexRef.current !== undefined) {\n tableMeta.editing.saveChanges(table);\n }\n }\n }, [tableMeta.rowActive.rowActiveIndex]);\n\n // show a warning if the user navigates away without triggering save, such as using the browser back/forward button\n const hasChanges = tableMeta.editing.hasChanges();\n\n React.useEffect(() => {\n function showUnsavedChangesWarning(event: BeforeUnloadEvent) {\n if (tableMeta.editing.isEditing && hasChanges) {\n event.returnValue = true;\n return true;\n }\n\n return false;\n }\n\n window.addEventListener('beforeunload', showUnsavedChangesWarning);\n\n return () => {\n window.removeEventListener('beforeunload', showUnsavedChangesWarning);\n };\n }, [tableMeta.editing.isEditing, hasChanges]);\n\n const hasSavedChanges = tableMeta.editing.hasSaved();\n\n useLazyEffect(() => {\n if (hasSavedChanges) {\n resetHighlightedColumnIndexes(table.getState().globalFilter, table, localization);\n }\n }, [hasSavedChanges]);\n\n React.useEffect(() => {\n const onClickOutside = (event: MouseEvent) => {\n if (tableMeta.editing.isEditing) {\n const element = event.target as Element;\n const isTableOrIsInsideTable =\n element.tagName === 'TABLE' ||\n element.tagName === 'TBODY' ||\n element.getAttribute('data-taco') === 'backdrop' ||\n element.getAttribute('data-table') === 'editing-toggle' ||\n !document.body.contains(element) ||\n isElementInsideOrTriggeredFromContainer(element, tableRef.current);\n\n // users can click the white space below rows which could be inside the table, but a valid scenario to save\n if (!isTableOrIsInsideTable) {\n tableMeta.editing.saveChanges(table);\n }\n }\n };\n\n document.addEventListener('click', onClickOutside);\n\n return () => document.removeEventListener('click', onClickOutside);\n }, [tableMeta.editing.isEditing, tableMeta.editing.saveChanges]);\n\n const rows = table.getRowModel().rows;\n\n // make sure pending changes are removed for rows that no longer exist\n useLazyEffect(() => {\n const pendingChanges = tableMeta.editing.getErrorsShownInAlert();\n\n pendingChanges.forEach(pendingChange => {\n try {\n table.getRow(pendingChange.rowId);\n } catch {\n tableMeta.editing.discardChanges(pendingChange.rowId, table);\n }\n });\n }, [rows.length]);\n\n // shortcuts\n useGlobalKeyDown(tableMeta.editing.isEnabled ? shortcut : undefined, (event: KeyboardEvent) => {\n event.preventDefault();\n tableMeta.editing.toggleEditing(!tableMeta.editing.isEditing, table, scrollToIndex);\n });\n\n useGlobalKeyDown(tableMeta.editing.isEditing ? { key: 's', meta: true, shift: false } : undefined, event => {\n event.preventDefault();\n tableMeta.editing.saveChanges(table);\n });\n}\n"],"names":["useTableEditingListener","table","tableRef","scrollToIndex","tableMeta","options","meta","localization","useLocalization","lastRowActiveIndexRef","React","useRef","rowActive","rowActiveIndex","useLazyEffect","current","editing","isEditing","undefined","saveChanges","hasChanges","useEffect","showUnsavedChangesWarning","event","returnValue","window","addEventListener","removeEventListener","hasSavedChanges","hasSaved","resetHighlightedColumnIndexes","getState","globalFilter","onClickOutside","element","target","isTableOrIsInsideTable","tagName","getAttribute","document","body","contains","isElementInsideOrTriggeredFromContainer","rows","getRowModel","pendingChanges","getErrorsShownInAlert","forEach","pendingChange","getRow","rowId","discardChanges","length","useGlobalKeyDown","isEnabled","shortcut","preventDefault","toggleEditing","key","shift"],"mappings":"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"}
|
|
@@ -11,7 +11,7 @@ const RENDERERS = {
|
|
|
11
11
|
cell: Cell
|
|
12
12
|
};
|
|
13
13
|
function useTable3(props, ref) {
|
|
14
|
-
const editing = useTableEditing(props.enableEditing, props.onEditingSave, props.onEditingChange, props.rowIdentityAccessor, props.validator);
|
|
14
|
+
const editing = useTableEditing(props.enableEditing, props.onEditingSave, props.onEditingChange, props.onEditingCreate, props.rowIdentityAccessor, props.validator);
|
|
15
15
|
const creationEnabled = editing.isEnabled && !!props.onEditingCreate;
|
|
16
16
|
// this gives me the performance heeby jeebies, but can't think of a better way to internalise the state
|
|
17
17
|
const data = React__default.useMemo(() => {
|
|
@@ -64,6 +64,9 @@ function useTable3(props, ref) {
|
|
|
64
64
|
React__default.useEffect(() => {
|
|
65
65
|
if (table.ref.current) {
|
|
66
66
|
table.ref.current.instance.toggleEditing = enabled => table.meta.editing.toggleEditing(enabled !== null && enabled !== void 0 ? enabled : editing => !editing, table.instance, table.renderer.scrollToIndex);
|
|
67
|
+
if (props.onEditingCreate) {
|
|
68
|
+
table.ref.current.instance.createRow = row => table.meta.editing.createRow(table.instance, table.renderer.scrollToIndex, row);
|
|
69
|
+
}
|
|
67
70
|
}
|
|
68
71
|
}, [table.ref.current]);
|
|
69
72
|
return table;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTable3.js","sources":["../../../../../../../src/components/Table3/useTable3.tsx"],"sourcesContent":["import React from 'react';\nimport { RowData, Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { useTable } from '../../primitives/Table/Core/useTable';\nimport { useTableEditingListener } from './listeners/useTableEditingListener';\nimport { useTableEditing } from './features/useTableEditing';\nimport { Table3Props, Table3Ref } from './types';\nimport { TableRowActionRenderer } from '../../primitives/Table/types';\nimport { Cell } from './components/Columns/Cell/Cell';\nimport { EditingActionsMenu } from './components/Columns/Internal/EditingActionsMenu';\nimport { Row } from './components/Row/Row';\nimport { useTableRenderOptions } from '../../primitives/Table/Core/types';\n\nexport const RENDERERS = {\n row: Row,\n cell: Cell,\n};\n\ndeclare module '@tanstack/table-core' {\n interface TableMeta<TData extends RowData> {\n editing: ReturnType<typeof useTableEditing>;\n }\n}\n\ntype Table3Meta = {\n editing: ReturnType<typeof useTableEditing>;\n};\n\nexport function useTable3<TType>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const editing = useTableEditing(\n props.enableEditing,\n props.onEditingSave,\n props.onEditingChange,\n props.rowIdentityAccessor,\n props.validator\n );\n const creationEnabled = editing.isEnabled && !!props.onEditingCreate;\n\n // this gives me the performance heeby jeebies, but can't think of a better way to internalise the state\n const data: TType[] = React.useMemo(() => {\n if (editing.temporaryRows.length) {\n return (props.data ?? []).concat(editing.temporaryRows as TType[]);\n }\n\n return props.data;\n }, [JSON.stringify(props.data), editing.temporaryRows.length]);\n\n const extendedProps: Table3Props<TType> = {\n ...props,\n data,\n enableRowActions: editing.isEditing ? true : props.enableRowActions,\n // Display EditingActionMenu instead of row actions while editing\n rowActions: editing.isEditing\n ? ([\n (_, rowId, table: ReactTable<TType>) => {\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n return (\n <EditingActionsMenu\n hasChanges={editing.hasChanges(rowId)}\n hasErrors={editing.hasRowErrors(rowId)}\n onDiscard={() => {\n if (editing.temporaryRows.length) {\n tableMeta.rowActive.setRowActiveIndex(undefined);\n setTimeout(() => editing.createRowButtonRef.current?.focus(), 50);\n }\n\n editing.discardChanges(rowId, table);\n }}\n onEditingSave={async () => {\n await editing.saveChanges(table, rowId);\n }}\n isLastRow={!creationEnabled && tableMeta.rowActive.rowActiveIndex === tableMeta.length - 1}\n />\n );\n },\n ] as TableRowActionRenderer<TType>[])\n : props.rowActions,\n };\n const meta = { editing };\n\n const options: useTableRenderOptions = {\n virtualiserPaddingEndOffset:\n props.enableEditing && props.onEditingCreate ? (editing.hasTemporaryRowErrors() ? 1.4 : 1) : 0,\n };\n\n const table = useTable<TType, Table3Meta>(extendedProps, ref, RENDERERS, meta, options);\n\n // listeners\n useTableEditingListener<TType>(table.instance, table.ref, table.renderer.scrollToIndex);\n\n React.useEffect(() => {\n if (table.ref.current) {\n (table.ref.current as Table3Ref).instance.toggleEditing = (enabled: boolean | undefined) =>\n table.meta.editing.toggleEditing(enabled ?? (editing => !editing), table.instance, table.renderer.scrollToIndex);\n }\n }, [table.ref.current]);\n\n return table;\n}\n"],"names":["RENDERERS","row","Row","cell","Cell","useTable3","props","ref","editing","useTableEditing","enableEditing","onEditingSave","onEditingChange","rowIdentityAccessor","validator","creationEnabled","isEnabled","
|
|
1
|
+
{"version":3,"file":"useTable3.js","sources":["../../../../../../../src/components/Table3/useTable3.tsx"],"sourcesContent":["import React from 'react';\nimport { RowData, Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { useTable } from '../../primitives/Table/Core/useTable';\nimport { useTableEditingListener } from './listeners/useTableEditingListener';\nimport { useTableEditing } from './features/useTableEditing';\nimport { Table3Props, Table3Ref } from './types';\nimport { TableRowActionRenderer } from '../../primitives/Table/types';\nimport { Cell } from './components/Columns/Cell/Cell';\nimport { EditingActionsMenu } from './components/Columns/Internal/EditingActionsMenu';\nimport { Row } from './components/Row/Row';\nimport { useTableRenderOptions } from '../../primitives/Table/Core/types';\n\nexport const RENDERERS = {\n row: Row,\n cell: Cell,\n};\n\ndeclare module '@tanstack/table-core' {\n interface TableMeta<TData extends RowData> {\n editing: ReturnType<typeof useTableEditing>;\n }\n}\n\ntype Table3Meta = {\n editing: ReturnType<typeof useTableEditing>;\n};\n\nexport function useTable3<TType>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const editing = useTableEditing(\n props.enableEditing,\n props.onEditingSave,\n props.onEditingChange,\n props.onEditingCreate,\n props.rowIdentityAccessor,\n props.validator\n );\n const creationEnabled = editing.isEnabled && !!props.onEditingCreate;\n\n // this gives me the performance heeby jeebies, but can't think of a better way to internalise the state\n const data: TType[] = React.useMemo(() => {\n if (editing.temporaryRows.length) {\n return (props.data ?? []).concat(editing.temporaryRows as TType[]);\n }\n\n return props.data;\n }, [JSON.stringify(props.data), editing.temporaryRows.length]);\n\n const extendedProps: Table3Props<TType> = {\n ...props,\n data,\n enableRowActions: editing.isEditing ? true : props.enableRowActions,\n // Display EditingActionMenu instead of row actions while editing\n rowActions: editing.isEditing\n ? ([\n (_, rowId, table: ReactTable<TType>) => {\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n return (\n <EditingActionsMenu\n hasChanges={editing.hasChanges(rowId)}\n hasErrors={editing.hasRowErrors(rowId)}\n onDiscard={() => {\n if (editing.temporaryRows.length) {\n tableMeta.rowActive.setRowActiveIndex(undefined);\n setTimeout(() => editing.createRowButtonRef.current?.focus(), 50);\n }\n\n editing.discardChanges(rowId, table);\n }}\n onEditingSave={async () => {\n await editing.saveChanges(table, rowId);\n }}\n isLastRow={!creationEnabled && tableMeta.rowActive.rowActiveIndex === tableMeta.length - 1}\n />\n );\n },\n ] as TableRowActionRenderer<TType>[])\n : props.rowActions,\n };\n const meta = { editing };\n\n const options: useTableRenderOptions = {\n virtualiserPaddingEndOffset:\n props.enableEditing && props.onEditingCreate ? (editing.hasTemporaryRowErrors() ? 1.4 : 1) : 0,\n };\n\n const table = useTable<TType, Table3Meta>(extendedProps, ref, RENDERERS, meta, options);\n\n // listeners\n useTableEditingListener<TType>(table.instance, table.ref, table.renderer.scrollToIndex);\n\n React.useEffect(() => {\n if (table.ref.current) {\n (table.ref.current as Table3Ref).instance.toggleEditing = (enabled: boolean | undefined) =>\n table.meta.editing.toggleEditing(enabled ?? (editing => !editing), table.instance, table.renderer.scrollToIndex);\n\n if (props.onEditingCreate) {\n (table.ref.current as Table3Ref).instance.createRow = (row: unknown) =>\n table.meta.editing.createRow(table.instance, table.renderer.scrollToIndex, row as Partial<TType>);\n }\n }\n }, [table.ref.current]);\n\n return table;\n}\n"],"names":["RENDERERS","row","Row","cell","Cell","useTable3","props","ref","editing","useTableEditing","enableEditing","onEditingSave","onEditingChange","onEditingCreate","rowIdentityAccessor","validator","creationEnabled","isEnabled","data","React","useMemo","temporaryRows","length","_props$data","concat","JSON","stringify","extendedProps","enableRowActions","isEditing","rowActions","_","rowId","table","tableMeta","options","meta","EditingActionsMenu","hasChanges","hasErrors","hasRowErrors","onDiscard","rowActive","setRowActiveIndex","undefined","setTimeout","_editing$createRowBut","createRowButtonRef","current","focus","discardChanges","saveChanges","then","e","Promise","reject","isLastRow","rowActiveIndex","virtualiserPaddingEndOffset","hasTemporaryRowErrors","useTable","useTableEditingListener","instance","renderer","scrollToIndex","useEffect","toggleEditing","enabled","createRow"],"mappings":"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"}
|
|
@@ -12,7 +12,7 @@ function Table(props) {
|
|
|
12
12
|
}
|
|
13
13
|
Table.Toolbar = TableToolbar;
|
|
14
14
|
Table.Grid = TableGrid;
|
|
15
|
-
function
|
|
15
|
+
function getEmptyStateReason(table) {
|
|
16
16
|
if (table.instance.getFilteredRowModel().rows.length === 0 && table.instance.getCoreRowModel().rows.length !== 0) {
|
|
17
17
|
const state = table.instance.getState();
|
|
18
18
|
if (table.meta.search.enableGlobalFilter && !!state.globalFilter) {
|
|
@@ -35,7 +35,7 @@ function TableGrid(props) {
|
|
|
35
35
|
const handleFocus = table.meta.rowActive.rowActiveIndex === undefined ? event => {
|
|
36
36
|
table.meta.rowActive.handleFocus(event, table.meta.length, table.renderer.scrollToIndex);
|
|
37
37
|
} : undefined;
|
|
38
|
-
const
|
|
38
|
+
const emptyStateReason = getEmptyStateReason(table);
|
|
39
39
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("style", null, table.stylesheet), /*#__PURE__*/React__default.createElement(FocusScope, null, /*#__PURE__*/React__default.createElement("table", Object.assign({}, attributes, {
|
|
40
40
|
id: table.id,
|
|
41
41
|
"data-table-font-size": table.meta.fontSize.size,
|
|
@@ -56,9 +56,10 @@ function TableGrid(props) {
|
|
|
56
56
|
key: props.id,
|
|
57
57
|
header: props,
|
|
58
58
|
scrollToIndex: table.renderer.scrollToIndex
|
|
59
|
-
}))))))),
|
|
59
|
+
}))))))), emptyStateReason ? (/*#__PURE__*/React__default.createElement(EmptyStateBody, {
|
|
60
60
|
emptyState: props.table.props.emptyState,
|
|
61
|
-
|
|
61
|
+
isReady: table.meta.server.isEnabled ? table.meta.server.isReady : true,
|
|
62
|
+
reason: emptyStateReason
|
|
62
63
|
})) : (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Body, {
|
|
63
64
|
enableHorizontalArrowKeyNavigation: enableHorizontalArrowKeyNavigation,
|
|
64
65
|
table: table.instance,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.js","sources":["../../../../../../../../src/primitives/Table/Core/Table.tsx"],"sourcesContent":["import React from 'react';\nimport { FocusScope } from '@react-aria/focus';\nimport { Header } from './components/Header/Header';\nimport { Body } from './components/Body/Body';\nimport { Foot } from './components/Footer/Footer';\nimport { EmptyStateBody } from './components/Body/EmptyStateBody';\nimport { useTableReturnValue } from './useTable';\nimport { TableToolbar } from './components/Toolbar/Toolbar';\nimport { TableEmptyStateReason } from '../types';\nimport { ROW_HEIGHT_ESTIMATES } from './util/rows';\nimport './style.css';\n\ntype TableProps = {\n children: JSX.Element | Array<JSX.Element | null>;\n};\n\nexport function Table(props: TableProps) {\n return <>{props.children}</>;\n}\nTable.Toolbar = TableToolbar;\nTable.Grid = TableGrid;\n\nexport type TableGridProps<TType = unknown> = React.TableHTMLAttributes<HTMLTableElement> & {\n 'data-taco': string;\n enableHorizontalArrowKeyNavigation?: boolean;\n table: useTableReturnValue<TType>;\n};\n\nfunction
|
|
1
|
+
{"version":3,"file":"Table.js","sources":["../../../../../../../../src/primitives/Table/Core/Table.tsx"],"sourcesContent":["import React from 'react';\nimport { FocusScope } from '@react-aria/focus';\nimport { Header } from './components/Header/Header';\nimport { Body } from './components/Body/Body';\nimport { Foot } from './components/Footer/Footer';\nimport { EmptyStateBody } from './components/Body/EmptyStateBody';\nimport { useTableReturnValue } from './useTable';\nimport { TableToolbar } from './components/Toolbar/Toolbar';\nimport { TableEmptyStateReason } from '../types';\nimport { ROW_HEIGHT_ESTIMATES } from './util/rows';\nimport './style.css';\n\ntype TableProps = {\n children: JSX.Element | Array<JSX.Element | null>;\n};\n\nexport function Table(props: TableProps) {\n return <>{props.children}</>;\n}\nTable.Toolbar = TableToolbar;\nTable.Grid = TableGrid;\n\nexport type TableGridProps<TType = unknown> = React.TableHTMLAttributes<HTMLTableElement> & {\n 'data-taco': string;\n enableHorizontalArrowKeyNavigation?: boolean;\n table: useTableReturnValue<TType>;\n};\n\nfunction getEmptyStateReason<TType = unknown>(table: useTableReturnValue<TType>): TableEmptyStateReason | null {\n if (table.instance.getFilteredRowModel().rows.length === 0 && table.instance.getCoreRowModel().rows.length !== 0) {\n const state = table.instance.getState();\n\n if (table.meta.search.enableGlobalFilter && !!state.globalFilter) {\n return 'searching';\n }\n\n return 'filtering';\n }\n if (table.instance.getCoreRowModel().rows.length === 0) {\n return 'empty';\n }\n\n return null;\n}\n\nexport function TableGrid<TType = unknown>(props: TableGridProps<TType>) {\n const { enableHorizontalArrowKeyNavigation, table, ...attributes } = props;\n const handleFocus =\n table.meta.rowActive.rowActiveIndex === undefined\n ? (event: React.FocusEvent) => {\n table.meta.rowActive.handleFocus(event, table.meta.length, table.renderer.scrollToIndex);\n }\n : undefined;\n const emptyStateReason = getEmptyStateReason(table);\n\n return (\n <>\n <style>{table.stylesheet}</style>\n <FocusScope>\n <table\n {...attributes}\n id={table.id}\n data-table-font-size={table.meta.fontSize.size}\n data-table-grouped={!!table.state.grouping?.length}\n data-table-horizontally-scrolled={table.meta.columnFreezing.isHorizontallyScrolled ? true : undefined}\n data-table-status={table.meta.server.isEnabled ? (table.meta.server.isReady ? 'ready' : undefined) : 'ready'}\n data-table-pause-hover={table.meta.rowActive.isHoverStatePaused ? true : undefined}\n data-table-resizing={table.state.columnSizingInfo.isResizingColumn ? true : undefined}\n data-table-row-height={table.meta.rowHeight.height}\n onFocus={handleFocus}\n onScroll={table.meta.columnFreezing.handleScroll}\n ref={table.ref}\n style={table.style}\n tabIndex={-1}>\n <thead>\n {table.instance.getHeaderGroups().map(headerGroup => (\n <tr key={headerGroup.id}>\n {headerGroup.headers.map(props => (\n <Header key={props.id} header={props} scrollToIndex={table.renderer.scrollToIndex} />\n ))}\n </tr>\n ))}\n </thead>\n {emptyStateReason ? (\n <EmptyStateBody\n emptyState={props.table.props.emptyState}\n isReady={table.meta.server.isEnabled ? table.meta.server.isReady : true}\n reason={emptyStateReason}\n />\n ) : (\n <>\n <Body\n enableHorizontalArrowKeyNavigation={enableHorizontalArrowKeyNavigation}\n table={table.instance}\n tableElement={table.ref.current}\n scrollToIndex={table.renderer.scrollToIndex}\n style={\n props.children\n ? {\n ...table.renderer.style,\n height:\n (table.renderer.style.height as number) +\n ROW_HEIGHT_ESTIMATES[table.meta.rowHeight.height],\n }\n : table.renderer.style\n }>\n {table.renderer.rows}\n {props.children}\n </Body>\n {table.meta.footer.isEnabled ? <Foot table={table.instance} /> : null}\n </>\n )}\n </table>\n </FocusScope>\n </>\n );\n}\n"],"names":["Table","props","React","children","Toolbar","TableToolbar","Grid","TableGrid","getEmptyStateReason","table","instance","getFilteredRowModel","rows","length","getCoreRowModel","state","getState","meta","search","enableGlobalFilter","globalFilter","enableHorizontalArrowKeyNavigation","attributes","handleFocus","rowActive","rowActiveIndex","undefined","event","renderer","scrollToIndex","emptyStateReason","stylesheet","FocusScope","id","fontSize","size","_table$state$grouping","grouping","columnFreezing","isHorizontallyScrolled","server","isEnabled","isReady","isHoverStatePaused","columnSizingInfo","isResizingColumn","rowHeight","height","onFocus","onScroll","handleScroll","ref","style","tabIndex","getHeaderGroups","map","headerGroup","key","headers","Header","header","EmptyStateBody","emptyState","reason","Body","tableElement","current","ROW_HEIGHT_ESTIMATES","footer","Foot"],"mappings":"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"}
|
|
@@ -3,9 +3,15 @@ import React__default from 'react';
|
|
|
3
3
|
function EmptyStateBody(props) {
|
|
4
4
|
const {
|
|
5
5
|
emptyState: Placeholder,
|
|
6
|
+
isReady,
|
|
6
7
|
reason,
|
|
7
8
|
...attributes
|
|
8
9
|
} = props;
|
|
10
|
+
if (!isReady) {
|
|
11
|
+
return /*#__PURE__*/React__default.createElement("tbody", Object.assign({}, attributes, {
|
|
12
|
+
className: "!auto-rows-fr"
|
|
13
|
+
}));
|
|
14
|
+
}
|
|
9
15
|
return /*#__PURE__*/React__default.createElement("tbody", Object.assign({}, attributes, {
|
|
10
16
|
className: "!auto-rows-fr"
|
|
11
17
|
}), /*#__PURE__*/React__default.createElement("tr", {
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/EmptyStateBody.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmptyStateBody.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Body/EmptyStateBody.tsx"],"sourcesContent":["import React from 'react';\nimport { TableEmptyStateReason, TableEmptyStateRenderer } from '../../../types';\n\ntype EmptyStateProps = React.HTMLAttributes<HTMLTableSectionElement> & {\n emptyState?: TableEmptyStateRenderer;\n reason: TableEmptyStateReason;\n};\n\nexport function EmptyStateBody(props: EmptyStateProps) {\n const { emptyState: Placeholder, reason, ...attributes } = props;\n\n return (\n <tbody {...attributes} className=\"!auto-rows-fr\">\n <tr className=\"!auto-rows-fr\">\n <td className=\"col-span-full !border-0 !p-0 hover:!bg-white\">\n {Placeholder ? <Placeholder reason={reason} /> : undefined}\n </td>\n </tr>\n </tbody>\n );\n}\n"],"names":["EmptyStateBody","props","emptyState","Placeholder","reason","attributes","React","className","undefined"],"mappings":";;
|
|
1
|
+
{"version":3,"file":"EmptyStateBody.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Body/EmptyStateBody.tsx"],"sourcesContent":["import React from 'react';\nimport { TableEmptyStateReason, TableEmptyStateRenderer } from '../../../types';\n\ntype EmptyStateProps = React.HTMLAttributes<HTMLTableSectionElement> & {\n emptyState?: TableEmptyStateRenderer;\n isReady: boolean;\n reason: TableEmptyStateReason;\n};\n\nexport function EmptyStateBody(props: EmptyStateProps) {\n const { emptyState: Placeholder, isReady, reason, ...attributes } = props;\n\n if (!isReady) {\n return <tbody {...attributes} className=\"!auto-rows-fr\" />;\n }\n\n return (\n <tbody {...attributes} className=\"!auto-rows-fr\">\n <tr className=\"!auto-rows-fr\">\n <td className=\"col-span-full !border-0 !p-0 hover:!bg-white\">\n {Placeholder ? <Placeholder reason={reason} /> : undefined}\n </td>\n </tr>\n </tbody>\n );\n}\n"],"names":["EmptyStateBody","props","emptyState","Placeholder","isReady","reason","attributes","React","className","undefined"],"mappings":";;SASgBA,cAAcA,CAACC,KAAsB;EACjD,MAAM;IAAEC,UAAU,EAAEC,WAAW;IAAEC,OAAO;IAAEC,MAAM;IAAE,GAAGC;GAAY,GAAGL,KAAK;EAEzE,IAAI,CAACG,OAAO,EAAE;IACV,oBAAOG,wDAAWD,UAAU;MAAEE,SAAS,EAAC;OAAkB;;EAG9D,oBACID,wDAAWD,UAAU;IAAEE,SAAS,EAAC;mBAC7BD;IAAIC,SAAS,EAAC;kBACVD;IAAIC,SAAS,EAAC;KACTL,WAAW,gBAAGI,6BAACJ,WAAW;IAACE,MAAM,EAAEA;IAAU,GAAGI,SAAS,CACzD,CACJ,CACD;AAEhB;;;;"}
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js
CHANGED
|
@@ -58,9 +58,9 @@ const Cell = /*#__PURE__*/React__default.memo(function MemoedCell(context) {
|
|
|
58
58
|
table
|
|
59
59
|
} = context;
|
|
60
60
|
const {
|
|
61
|
+
hideRowActions,
|
|
61
62
|
isHovered,
|
|
62
|
-
rowIndex
|
|
63
|
-
hideRowActions
|
|
63
|
+
rowIndex
|
|
64
64
|
} = React__default.useContext(RowContext);
|
|
65
65
|
const tableMeta = table.options.meta;
|
|
66
66
|
const actions = tableMeta.rowActions.rowActions;
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Actions.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Actions.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, CellContext as ReactTableCellContext, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { IconButton } from '../../../../../../components/IconButton/IconButton';\nimport { Menu } from '../../../../../../components/Menu/Menu';\nimport { Shortcut } from '../../../../../../components/Shortcut/Shortcut';\nimport { RowContext } from '../../Row/RowContext';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\nimport { TableRowActionRenderer } from '../../../../types';\n\nexport type ActionsProps<TType = unknown> = {\n actions: TableRowActionRenderer<TType>[];\n actionsLength: number;\n data: any;\n isActiveRow: boolean;\n rowId: string;\n table: ReactTable<TType>;\n};\nexport function Actions<TType = unknown>(props: ActionsProps<TType>) {\n const { actions, actionsLength, data, isActiveRow, rowId, table } = props;\n const { texts } = useLocalization();\n // we don't want to document passing table, so it isn't on the type\n const visibleActions = (actions as ((row: TType, internalRowId: string, table: ReactTable<TType>) => JSX.Element | null)[])\n .map(action => action(data, rowId, table))\n .filter(action => !!action) as JSX.Element[];\n\n const actionsOnRow = visibleActions.length === actionsLength ? visibleActions : visibleActions.slice(0, actionsLength - 1);\n const actionsInMenu = visibleActions.slice(visibleActions.length === actionsLength ? actionsLength : actionsLength - 1);\n\n const className = cn(\n 'flex justify-end text-right bg-[inherit] shadow-[-6px_0px_6px_var(--table-row-actions-shadow)] print:hidden'\n );\n\n return (\n <span className={className}>\n {actionsOnRow.map((button, index) => {\n const tooltip = String(button.props.tooltip ?? button.props['aria-label'] ?? '');\n\n return React.cloneElement(button, {\n appearance: 'transparent',\n key: index,\n tabIndex: isActiveRow ? 0 : -1,\n tooltip: button.props.shortcut ? (\n <>\n {tooltip}\n <Shortcut className=\"ml-2\" keys={button.props.shortcut} />\n </>\n ) : (\n tooltip\n ),\n });\n })}\n {actionsInMenu.length ? (\n <IconButton\n appearance=\"transparent\"\n aria-label={texts.table.columns.actions.tooltip}\n icon=\"more\"\n tabIndex={isActiveRow ? 0 : -1}\n menu={menuProps => (\n <Menu {...menuProps}>\n <Menu.Content>\n {actionsInMenu.map((action, i) => (\n <Menu.Item key={i} {...action.props} shortcut={action.props.shortcut}>\n {action.props['aria-label']}\n </Menu.Item>\n ))}\n </Menu.Content>\n </Menu>\n )}\n />\n ) : null}\n </span>\n );\n}\n\nfunction Header() {\n return null;\n}\n\nconst Cell = React.memo(function MemoedCell<TType = unknown>(context: ReactTableCellContext<TType, unknown>) {\n const { row, table } = context;\n const { isHovered, rowIndex
|
|
1
|
+
{"version":3,"file":"Actions.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Actions.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, CellContext as ReactTableCellContext, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { IconButton } from '../../../../../../components/IconButton/IconButton';\nimport { Menu } from '../../../../../../components/Menu/Menu';\nimport { Shortcut } from '../../../../../../components/Shortcut/Shortcut';\nimport { RowContext } from '../../Row/RowContext';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\nimport { TableRowActionRenderer } from '../../../../types';\n\nexport type ActionsProps<TType = unknown> = {\n actions: TableRowActionRenderer<TType>[];\n actionsLength: number;\n data: any;\n isActiveRow: boolean;\n rowId: string;\n table: ReactTable<TType>;\n};\nexport function Actions<TType = unknown>(props: ActionsProps<TType>) {\n const { actions, actionsLength, data, isActiveRow, rowId, table } = props;\n const { texts } = useLocalization();\n // we don't want to document passing table, so it isn't on the type\n const visibleActions = (actions as ((row: TType, internalRowId: string, table: ReactTable<TType>) => JSX.Element | null)[])\n .map(action => action(data, rowId, table))\n .filter(action => !!action) as JSX.Element[];\n\n const actionsOnRow = visibleActions.length === actionsLength ? visibleActions : visibleActions.slice(0, actionsLength - 1);\n const actionsInMenu = visibleActions.slice(visibleActions.length === actionsLength ? actionsLength : actionsLength - 1);\n\n const className = cn(\n 'flex justify-end text-right bg-[inherit] shadow-[-6px_0px_6px_var(--table-row-actions-shadow)] print:hidden'\n );\n\n return (\n <span className={className}>\n {actionsOnRow.map((button, index) => {\n const tooltip = String(button.props.tooltip ?? button.props['aria-label'] ?? '');\n\n return React.cloneElement(button, {\n appearance: 'transparent',\n key: index,\n tabIndex: isActiveRow ? 0 : -1,\n tooltip: button.props.shortcut ? (\n <>\n {tooltip}\n <Shortcut className=\"ml-2\" keys={button.props.shortcut} />\n </>\n ) : (\n tooltip\n ),\n });\n })}\n {actionsInMenu.length ? (\n <IconButton\n appearance=\"transparent\"\n aria-label={texts.table.columns.actions.tooltip}\n icon=\"more\"\n tabIndex={isActiveRow ? 0 : -1}\n menu={menuProps => (\n <Menu {...menuProps}>\n <Menu.Content>\n {actionsInMenu.map((action, i) => (\n <Menu.Item key={i} {...action.props} shortcut={action.props.shortcut}>\n {action.props['aria-label']}\n </Menu.Item>\n ))}\n </Menu.Content>\n </Menu>\n )}\n />\n ) : null}\n </span>\n );\n}\n\nfunction Header() {\n return null;\n}\n\nconst Cell = React.memo(function MemoedCell<TType = unknown>(context: ReactTableCellContext<TType, unknown>) {\n const { row, table } = context;\n const { hideRowActions, isHovered, rowIndex } = React.useContext(RowContext);\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n const actions = tableMeta.rowActions.rowActions;\n const actionsLength = tableMeta.rowActions.rowActionsLength;\n\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n const isResizingColumn = !!table.getState().columnSizingInfo.isResizingColumn;\n const isHoverStatePaused = tableMeta.rowActive.isHoverStatePaused;\n const isRowGrouped = row.getIsGrouped();\n\n if (\n !hideRowActions &&\n !isRowGrouped &&\n actions?.length &&\n (isActiveRow || (isHovered && !isHoverStatePaused && !isResizingColumn))\n ) {\n return (\n <Actions<TType>\n actions={actions}\n actionsLength={actionsLength}\n data={row.original}\n isActiveRow={isActiveRow}\n rowId={row.id}\n table={table}\n />\n );\n }\n\n return null;\n}) as <TType = unknown>(context: ReactTableCellContext<TType, unknown>) => JSX.Element;\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n meta: {\n align: 'right',\n className: cn(\n 'print:opacity-0 !px-0 !pr-1 overflow-hidden [table_&]:group-[[data-row-active=\"true\"]]/row:sticky right-0',\n 'group-[[data-row-active=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n 'group-[[data-row-selected=\"true\"]]/row:text-blue-100',\n 'group-[[data-row-selected=\"false\"]:hover]/row:text-grey-100'\n ),\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n },\n};\n"],"names":["Actions","props","actions","actionsLength","data","isActiveRow","rowId","table","texts","useLocalization","visibleActions","map","action","filter","actionsOnRow","length","slice","actionsInMenu","className","cn","React","button","index","tooltip","String","_ref","_button$props$tooltip","cloneElement","appearance","key","tabIndex","shortcut","Shortcut","keys","IconButton","columns","icon","menu","menuProps","Menu","Content","i","Item","Header","Cell","memo","MemoedCell","context","row","hideRowActions","isHovered","rowIndex","useContext","RowContext","tableMeta","options","meta","rowActions","rowActionsLength","rowActive","rowActiveIndex","isResizingColumn","getState","columnSizingInfo","isHoverStatePaused","isRowGrouped","getIsGrouped","original","id","renderer","header","align","enableSearch"],"mappings":"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"}
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Drag.js
CHANGED
|
@@ -2,6 +2,7 @@ import React__default from 'react';
|
|
|
2
2
|
import cn from 'clsx';
|
|
3
3
|
import { Icon } from '../../../../../../components/Icon/Icon.js';
|
|
4
4
|
import { useLocalization } from '../../../../../../components/Provider/Localization.js';
|
|
5
|
+
import { RowContext } from '../../Row/RowContext.js';
|
|
5
6
|
|
|
6
7
|
function Header() {
|
|
7
8
|
return null;
|
|
@@ -10,6 +11,12 @@ function Cell() {
|
|
|
10
11
|
const {
|
|
11
12
|
texts
|
|
12
13
|
} = useLocalization();
|
|
14
|
+
const {
|
|
15
|
+
hideInternalColumns
|
|
16
|
+
} = React__default.useContext(RowContext);
|
|
17
|
+
if (hideInternalColumns) {
|
|
18
|
+
return null;
|
|
19
|
+
}
|
|
13
20
|
return /*#__PURE__*/React__default.createElement(Icon, {
|
|
14
21
|
"aria-label": texts.table.columns.drag.tooltip,
|
|
15
22
|
name: "drag",
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Drag.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drag.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Drag.tsx"],"sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\n\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\nimport { Icon } from '../../../../../../components/Icon/Icon';\n\nfunction Header() {\n return null;\n}\n\nfunction Cell() {\n const { texts } = useLocalization();\n\n return (\n <Icon\n aria-label={texts.table.columns.drag.tooltip}\n name=\"drag\"\n className={clsx(\n \"text-grey-darkest invisible -mt-1 ml-[2px] cursor-grab active:cursor-grabbing group-hover/row:visible group-[[aria-grabbed='true']]/row:text-white\",\n '[[data-table-editing-mode]_&]:!invisible'\n )}\n />\n );\n}\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n size: 20,\n meta: {\n align: 'center',\n className: '!px-0 !pb-0 justify-end',\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n headerClassName: '!p-0',\n },\n};\n"],"names":["Header","Cell","texts","useLocalization","React","Icon","table","columns","drag","tooltip","name","className","clsx","renderer","header","size","meta","align","enableSearch","headerClassName"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Drag.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Drag.tsx"],"sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\n\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\nimport { Icon } from '../../../../../../components/Icon/Icon';\nimport { RowContext } from '../../Row/RowContext';\n\nfunction Header() {\n return null;\n}\n\nfunction Cell() {\n const { texts } = useLocalization();\n const { hideInternalColumns } = React.useContext(RowContext);\n\n if (hideInternalColumns) {\n return null;\n }\n\n return (\n <Icon\n aria-label={texts.table.columns.drag.tooltip}\n name=\"drag\"\n className={clsx(\n \"text-grey-darkest invisible -mt-1 ml-[2px] cursor-grab active:cursor-grabbing group-hover/row:visible group-[[aria-grabbed='true']]/row:text-white\",\n '[[data-table-editing-mode]_&]:!invisible'\n )}\n />\n );\n}\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n size: 20,\n meta: {\n align: 'center',\n className: '!px-0 !pb-0 justify-end',\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n headerClassName: '!p-0',\n },\n};\n"],"names":["Header","Cell","texts","useLocalization","hideInternalColumns","React","useContext","RowContext","Icon","table","columns","drag","tooltip","name","className","clsx","renderer","header","size","meta","align","enableSearch","headerClassName"],"mappings":";;;;;;AAQA,SAASA,MAAMA;EACX,OAAO,IAAI;AACf;AAEA,SAASC,IAAIA;EACT,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAM;IAAEC;GAAqB,GAAGC,cAAK,CAACC,UAAU,CAACC,UAAU,CAAC;EAE5D,IAAIH,mBAAmB,EAAE;IACrB,OAAO,IAAI;;EAGf,oBACIC,6BAACG,IAAI;kBACWN,KAAK,CAACO,KAAK,CAACC,OAAO,CAACC,IAAI,CAACC,OAAO;IAC5CC,IAAI,EAAC,MAAM;IACXC,SAAS,EAAEC,EAAI,CACX,oJAAoJ,EACpJ,0CAA0C;IAEhD;AAEV;MAEaC,QAAQ,GAAkC;EACnDC,MAAM,EAAEjB,MAAM;EACdgB,QAAQ,EAAEf,IAAI;EACdiB,IAAI,EAAE,EAAE;EACRC,IAAI,EAAE;IACFC,KAAK,EAAE,QAAQ;IACfN,SAAS,EAAE,yBAAyB;;IAEpCO,YAAY,EAAE,KAAK;IACnBJ,MAAM,EAAE,EAAE;IACVK,eAAe,EAAE;;;;;;"}
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Expansion.js
CHANGED
|
@@ -2,6 +2,7 @@ import React__default from 'react';
|
|
|
2
2
|
import { Tooltip } from '../../../../../../components/Tooltip/Tooltip.js';
|
|
3
3
|
import { IconButton } from '../../../../../../components/IconButton/IconButton.js';
|
|
4
4
|
import { useLocalization } from '../../../../../../components/Provider/Localization.js';
|
|
5
|
+
import { RowContext } from '../../Row/RowContext.js';
|
|
5
6
|
|
|
6
7
|
function Header(context) {
|
|
7
8
|
const {
|
|
@@ -31,7 +32,13 @@ function Cell(context) {
|
|
|
31
32
|
const {
|
|
32
33
|
texts
|
|
33
34
|
} = useLocalization();
|
|
35
|
+
const {
|
|
36
|
+
hideInternalColumns
|
|
37
|
+
} = React__default.useContext(RowContext);
|
|
34
38
|
const tableMeta = context.table.options.meta;
|
|
39
|
+
if (hideInternalColumns) {
|
|
40
|
+
return null;
|
|
41
|
+
}
|
|
35
42
|
const hasExpandedRow = (_tableMeta$rowExpansi = (_tableMeta$rowExpansi2 = tableMeta.rowExpansion).rowExpansionRenderer) === null || _tableMeta$rowExpansi === void 0 ? void 0 : _tableMeta$rowExpansi.call(_tableMeta$rowExpansi2, context.row.original);
|
|
36
43
|
if (hasExpandedRow) {
|
|
37
44
|
const isActiveRow = tableMeta.rowActive.rowActiveIndex === context.row.index;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Expansion.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Expansion.tsx"],"sourcesContent":["import React from 'react';\nimport {\n HeaderContext as ReactTableHeaderContext,\n CellContext as ReactTableCellContext,\n TableMeta as ReactTableMeta,\n} from '@tanstack/react-table';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { Tooltip } from '../../../../../../components/Tooltip/Tooltip';\nimport { IconButton } from '../../../../../../components/IconButton/IconButton';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\n\nfunction Header<TType = unknown>(context: ReactTableHeaderContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { table } = context;\n\n const isSomeRowsExpanded = table.getIsSomeRowsExpanded();\n\n const handleClick = event => {\n event.stopPropagation();\n table.toggleAllRowsExpanded(!isSomeRowsExpanded);\n };\n\n const title = isSomeRowsExpanded ? texts.table.columns.expansion.collapseAll : texts.table.columns.expansion.expandAll;\n\n return (\n <Tooltip title={title}>\n <IconButton\n appearance=\"transparent\"\n icon={isSomeRowsExpanded ? 'chevron-down-double' : 'chevron-right-double'}\n onClick={handleClick}\n tabIndex={-1}\n title={title}\n />\n </Tooltip>\n );\n}\n\nfunction Cell<TType = unknown>(context: ReactTableCellContext<TType, unknown>) {\n const { texts } = useLocalization();\n const tableMeta = context.table.options.meta as ReactTableMeta<TType>;\n\n const hasExpandedRow = tableMeta.rowExpansion.rowExpansionRenderer?.(context.row.original);\n\n if (hasExpandedRow) {\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === context.row.index;\n const isExpanded = context.row.getIsExpanded();\n\n const handleClick = event => {\n event.stopPropagation();\n context.row.toggleExpanded();\n };\n\n const title = isExpanded ? texts.table.columns.expansion.collapse : texts.table.columns.expansion.expand;\n const tabIndex = isActiveRow ? 0 : -1;\n\n return (\n <Tooltip title={title}>\n <IconButton\n appearance=\"discrete\"\n icon={isExpanded ? 'chevron-down' : 'chevron-right'}\n onClick={handleClick}\n tabIndex={tabIndex}\n title={title}\n />\n </Tooltip>\n );\n }\n\n return null;\n}\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n size: 40,\n meta: {\n align: 'center',\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n headerClassName: '!p-0',\n },\n};\n"],"names":["Header","context","texts","useLocalization","table","isSomeRowsExpanded","getIsSomeRowsExpanded","handleClick","event","stopPropagation","toggleAllRowsExpanded","title","columns","expansion","collapseAll","expandAll","React","Tooltip","IconButton","appearance","icon","onClick","tabIndex","Cell","tableMeta","options","meta","hasExpandedRow","_tableMeta$rowExpansi","_tableMeta$rowExpansi2","rowExpansion","rowExpansionRenderer","call","row","original","isActiveRow","rowActive","rowActiveIndex","index","isExpanded","getIsExpanded","toggleExpanded","collapse","expand","renderer","header","size","align","enableSearch","headerClassName"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Expansion.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Expansion.tsx"],"sourcesContent":["import React from 'react';\nimport {\n HeaderContext as ReactTableHeaderContext,\n CellContext as ReactTableCellContext,\n TableMeta as ReactTableMeta,\n} from '@tanstack/react-table';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { Tooltip } from '../../../../../../components/Tooltip/Tooltip';\nimport { IconButton } from '../../../../../../components/IconButton/IconButton';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\nimport { RowContext } from '../../Row/RowContext';\n\nfunction Header<TType = unknown>(context: ReactTableHeaderContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { table } = context;\n\n const isSomeRowsExpanded = table.getIsSomeRowsExpanded();\n\n const handleClick = event => {\n event.stopPropagation();\n table.toggleAllRowsExpanded(!isSomeRowsExpanded);\n };\n\n const title = isSomeRowsExpanded ? texts.table.columns.expansion.collapseAll : texts.table.columns.expansion.expandAll;\n\n return (\n <Tooltip title={title}>\n <IconButton\n appearance=\"transparent\"\n icon={isSomeRowsExpanded ? 'chevron-down-double' : 'chevron-right-double'}\n onClick={handleClick}\n tabIndex={-1}\n title={title}\n />\n </Tooltip>\n );\n}\n\nfunction Cell<TType = unknown>(context: ReactTableCellContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { hideInternalColumns } = React.useContext(RowContext);\n const tableMeta = context.table.options.meta as ReactTableMeta<TType>;\n\n if (hideInternalColumns) {\n return null;\n }\n\n const hasExpandedRow = tableMeta.rowExpansion.rowExpansionRenderer?.(context.row.original);\n\n if (hasExpandedRow) {\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === context.row.index;\n const isExpanded = context.row.getIsExpanded();\n\n const handleClick = event => {\n event.stopPropagation();\n context.row.toggleExpanded();\n };\n\n const title = isExpanded ? texts.table.columns.expansion.collapse : texts.table.columns.expansion.expand;\n const tabIndex = isActiveRow ? 0 : -1;\n\n return (\n <Tooltip title={title}>\n <IconButton\n appearance=\"discrete\"\n icon={isExpanded ? 'chevron-down' : 'chevron-right'}\n onClick={handleClick}\n tabIndex={tabIndex}\n title={title}\n />\n </Tooltip>\n );\n }\n\n return null;\n}\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n size: 40,\n meta: {\n align: 'center',\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n headerClassName: '!p-0',\n },\n};\n"],"names":["Header","context","texts","useLocalization","table","isSomeRowsExpanded","getIsSomeRowsExpanded","handleClick","event","stopPropagation","toggleAllRowsExpanded","title","columns","expansion","collapseAll","expandAll","React","Tooltip","IconButton","appearance","icon","onClick","tabIndex","Cell","hideInternalColumns","useContext","RowContext","tableMeta","options","meta","hasExpandedRow","_tableMeta$rowExpansi","_tableMeta$rowExpansi2","rowExpansion","rowExpansionRenderer","call","row","original","isActiveRow","rowActive","rowActiveIndex","index","isExpanded","getIsExpanded","toggleExpanded","collapse","expand","renderer","header","size","align","enableSearch","headerClassName"],"mappings":";;;;;;AAYA,SAASA,MAAMA,CAAkBC,OAAgD;EAC7E,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAM;IAAEC;GAAO,GAAGH,OAAO;EAEzB,MAAMI,kBAAkB,GAAGD,KAAK,CAACE,qBAAqB,EAAE;EAExD,MAAMC,WAAW,GAAGC,KAAK;IACrBA,KAAK,CAACC,eAAe,EAAE;IACvBL,KAAK,CAACM,qBAAqB,CAAC,CAACL,kBAAkB,CAAC;GACnD;EAED,MAAMM,KAAK,GAAGN,kBAAkB,GAAGH,KAAK,CAACE,KAAK,CAACQ,OAAO,CAACC,SAAS,CAACC,WAAW,GAAGZ,KAAK,CAACE,KAAK,CAACQ,OAAO,CAACC,SAAS,CAACE,SAAS;EAEtH,oBACIC,6BAACC,OAAO;IAACN,KAAK,EAAEA;kBACZK,6BAACE,UAAU;IACPC,UAAU,EAAC,aAAa;IACxBC,IAAI,EAAEf,kBAAkB,GAAG,qBAAqB,GAAG,sBAAsB;IACzEgB,OAAO,EAAEd,WAAW;IACpBe,QAAQ,EAAE,CAAC,CAAC;IACZX,KAAK,EAAEA;IACT,CACI;AAElB;AAEA,SAASY,IAAIA,CAAkBtB,OAA8C;;EACzE,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAM;IAAEqB;GAAqB,GAAGR,cAAK,CAACS,UAAU,CAACC,UAAU,CAAC;EAC5D,MAAMC,SAAS,GAAG1B,OAAO,CAACG,KAAK,CAACwB,OAAO,CAACC,IAA6B;EAErE,IAAIL,mBAAmB,EAAE;IACrB,OAAO,IAAI;;EAGf,MAAMM,cAAc,IAAAC,qBAAA,GAAG,CAAAC,sBAAA,GAAAL,SAAS,CAACM,YAAY,EAACC,oBAAoB,cAAAH,qBAAA,uBAA3CA,qBAAA,CAAAI,IAAA,CAAAH,sBAAA,EAA8C/B,OAAO,CAACmC,GAAG,CAACC,QAAQ,CAAC;EAE1F,IAAIP,cAAc,EAAE;IAChB,MAAMQ,WAAW,GAAGX,SAAS,CAACY,SAAS,CAACC,cAAc,KAAKvC,OAAO,CAACmC,GAAG,CAACK,KAAK;IAC5E,MAAMC,UAAU,GAAGzC,OAAO,CAACmC,GAAG,CAACO,aAAa,EAAE;IAE9C,MAAMpC,WAAW,GAAGC,KAAK;MACrBA,KAAK,CAACC,eAAe,EAAE;MACvBR,OAAO,CAACmC,GAAG,CAACQ,cAAc,EAAE;KAC/B;IAED,MAAMjC,KAAK,GAAG+B,UAAU,GAAGxC,KAAK,CAACE,KAAK,CAACQ,OAAO,CAACC,SAAS,CAACgC,QAAQ,GAAG3C,KAAK,CAACE,KAAK,CAACQ,OAAO,CAACC,SAAS,CAACiC,MAAM;IACxG,MAAMxB,QAAQ,GAAGgB,WAAW,GAAG,CAAC,GAAG,CAAC,CAAC;IAErC,oBACItB,6BAACC,OAAO;MAACN,KAAK,EAAEA;oBACZK,6BAACE,UAAU;MACPC,UAAU,EAAC,UAAU;MACrBC,IAAI,EAAEsB,UAAU,GAAG,cAAc,GAAG,eAAe;MACnDrB,OAAO,EAAEd,WAAW;MACpBe,QAAQ,EAAEA,QAAQ;MAClBX,KAAK,EAAEA;MACT,CACI;;EAIlB,OAAO,IAAI;AACf;MAEaoC,QAAQ,GAAkC;EACnDC,MAAM,EAAEhD,MAAM;EACd+C,QAAQ,EAAExB,IAAI;EACd0B,IAAI,EAAE,EAAE;EACRpB,IAAI,EAAE;IACFqB,KAAK,EAAE,QAAQ;;IAEfC,YAAY,EAAE,KAAK;IACnBH,MAAM,EAAE,EAAE;IACVI,eAAe,EAAE;;;;;;"}
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Selection.js
CHANGED
|
@@ -60,10 +60,11 @@ function Cell(context) {
|
|
|
60
60
|
table
|
|
61
61
|
} = context;
|
|
62
62
|
const {
|
|
63
|
+
hideInternalColumns,
|
|
63
64
|
rowIndex
|
|
64
65
|
} = React__default.useContext(RowContext);
|
|
65
66
|
const tableMeta = table.options.meta;
|
|
66
|
-
if (table.options.enableGrouping && (_table$getState$group = table.getState().grouping) !== null && _table$getState$group !== void 0 && _table$getState$group.length && !row.getIsGrouped()) {
|
|
67
|
+
if (hideInternalColumns || table.options.enableGrouping && (_table$getState$group = table.getState().grouping) !== null && _table$getState$group !== void 0 && _table$getState$group.length && !row.getIsGrouped()) {
|
|
67
68
|
return null;
|
|
68
69
|
}
|
|
69
70
|
const isSelected = row.getIsGrouped() ? row.getIsAllSubRowsSelected() : row.getIsSelected();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Selection.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Selection.tsx"],"sourcesContent":["import React from 'react';\nimport {\n HeaderContext as ReactTableHeaderContext,\n CellContext as ReactTableCellContext,\n TableMeta as ReactTableMeta,\n RowSelectionState,\n} from '@tanstack/react-table';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { Tooltip } from '../../../../../../components/Tooltip/Tooltip';\nimport { Checkbox } from '../../../../../../components/Checkbox/Checkbox';\nimport { Shortcut } from '../../../../../../components/Shortcut/Shortcut';\nimport { TableServerLoadAllState } from '../../../../types';\nimport { RowContext } from '../../Row/RowContext';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\n\nfunction Header<TType = unknown>(context: ReactTableHeaderContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { table } = context;\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n const isAllRowsSelected = table.getIsAllRowsSelected();\n const isSomeRowsSelected = table.getIsSomeRowsSelected();\n const title = isAllRowsSelected ? texts.table.columns.select.deselectAll : texts.table.columns.select.selectAll;\n\n const handleChange = async (checked: boolean) => {\n // load all data if that is possible\n if (tableMeta.server.loadAllIfNeeded) {\n // don't pass the search query because we need all data - not filtered data\n await tableMeta.server.loadAllIfNeeded(table.getState().sorting, table.getState().columnFilters);\n }\n\n table.toggleAllRowsSelected(checked);\n };\n\n return (\n <Tooltip title={title}>\n <Checkbox\n aria-label={title}\n className=\"hover:border-blue !-mt-px\"\n checked={isAllRowsSelected}\n indeterminate={isSomeRowsSelected && !isAllRowsSelected}\n loading={tableMeta.server.loadAllStatus === TableServerLoadAllState.Loading}\n onChange={handleChange}\n />\n </Tooltip>\n );\n}\n\nconst toggleBetween = (fromRowIndex: number, toRowIndex: number): [number, number] => {\n const fromIndex = toRowIndex < fromRowIndex ? toRowIndex : fromRowIndex;\n const toIndex = toRowIndex > fromRowIndex ? toRowIndex : fromRowIndex;\n\n return [fromIndex, toIndex];\n};\n\nfunction Cell<TType = unknown>(context: ReactTableCellContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { row, table } = context;\n const { rowIndex } = React.useContext(RowContext);\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n if (table.options.enableGrouping && table.getState().grouping?.length && !row.getIsGrouped()) {\n return null;\n }\n\n const isSelected = row.getIsGrouped() ? row.getIsAllSubRowsSelected() : row.getIsSelected();\n const canSelect = row.getCanSelect();\n const title = isSelected ? texts.table.columns.select.deselect : texts.table.columns.select.select;\n\n const handleClick = async (event: React.MouseEvent) => {\n event.stopPropagation();\n\n if (row.getIsGrouped()) {\n row.subRows.forEach(row => row.toggleSelected());\n } else if (event.shiftKey) {\n const [fromIndex, toIndex] = toggleBetween(tableMeta.rowSelection.lastSelectedRowIndex.current ?? 0, rowIndex);\n const selectedRows = table.getRowModel().rows.slice(fromIndex, toIndex + 1);\n\n if (tableMeta.server.loadAllIfNeeded && selectedRows.some(row => row.original === undefined)) {\n // don't pass the search query because we need all data - not filtered data\n await tableMeta.server.loadAllIfNeeded(table.getState().sorting, table.getState().columnFilters);\n }\n\n table.setRowSelection((currentRowSelection: RowSelectionState) => ({\n ...currentRowSelection,\n ...selectedRows.filter(row => row.getCanSelect()).reduce((state, row) => ({ ...state, [row.id]: true }), {}),\n }));\n } else {\n row.toggleSelected();\n }\n\n tableMeta.rowSelection.lastSelectedRowIndex.current = row.index;\n };\n\n return (\n <Tooltip\n hidden={!canSelect}\n title={\n <>\n {title}\n <Shortcut className=\"ml-2\" keys=\"Space\" />\n </>\n }>\n <Checkbox\n aria-label={title}\n className=\"!mt-0\"\n checked={isSelected}\n onClick={handleClick}\n disabled={!canSelect}\n // this is necessary to remove console spam from eslint\n onChange={() => false}\n />\n </Tooltip>\n );\n}\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n size: 40,\n meta: {\n align: 'center',\n className: '!px-1',\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n headerClassName: '!px-1',\n },\n};\n"],"names":["Header","context","texts","useLocalization","table","tableMeta","options","meta","isAllRowsSelected","getIsAllRowsSelected","isSomeRowsSelected","getIsSomeRowsSelected","title","columns","select","deselectAll","selectAll","handleChange","checked","toggleAllRowsSelected","_temp","server","loadAllIfNeeded","Promise","resolve","getState","sorting","columnFilters","then","_temp2","e","reject","React","Tooltip","Checkbox","className","indeterminate","loading","loadAllStatus","TableServerLoadAllState","Loading","onChange","toggleBetween","fromRowIndex","toRowIndex","fromIndex","toIndex","Cell","row","rowIndex","useContext","RowContext","enableGrouping","_table$getState$group","grouping","length","getIsGrouped","isSelected","getIsAllSubRowsSelected","getIsSelected","canSelect","getCanSelect","deselect","handleClick","event","rowSelection","lastSelectedRowIndex","current","index","stopPropagation","_temp6","subRows","forEach","toggleSelected","_temp5","shiftKey","_tableMeta$rowSelecti","_temp4","setRowSelection","currentRowSelection","selectedRows","filter","reduce","state","id","getRowModel","rows","slice","_temp3","some","original","undefined","_temp7","hidden","Shortcut","keys","onClick","disabled","renderer","header","size","align","enableSearch","headerClassName"],"mappings":";;;;;;;;AAeA,SAASA,MAAMA,CAAkBC,OAAgD;EAC7E,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAM;IAAEC;GAAO,GAAGH,OAAO;EACzB,MAAMI,SAAS,GAAGD,KAAK,CAACE,OAAO,CAACC,IAA6B;EAE7D,MAAMC,iBAAiB,GAAGJ,KAAK,CAACK,oBAAoB,EAAE;EACtD,MAAMC,kBAAkB,GAAGN,KAAK,CAACO,qBAAqB,EAAE;EACxD,MAAMC,KAAK,GAAGJ,iBAAiB,GAAGN,KAAK,CAACE,KAAK,CAACS,OAAO,CAACC,MAAM,CAACC,WAAW,GAAGb,KAAK,CAACE,KAAK,CAACS,OAAO,CAACC,MAAM,CAACE,SAAS;EAE/G,MAAMC,YAAY,aAAUC,OAAgB;IAAA;;QAOxCd,KAAK,CAACe,qBAAqB,CAACD,OAAO,CAAC;;MAAC,MAAAE,KAAA;QAAA,IALjCf,SAAS,CAACgB,MAAM,CAACC,eAAe;;UAChC,OAAAC,OAAA,CAAAC,OAAA,CACMnB,SAAS,CAACgB,MAAM,CAACC,eAAe,CAAClB,KAAK,CAACqB,QAAQ,EAAE,CAACC,OAAO,EAAEtB,KAAK,CAACqB,QAAQ,EAAE,CAACE,aAAa,CAAC,EAAAC,IAAA;;;;MAHpG,OAAAL,OAAA,CAAAC,OAAA,CAAAJ,KAAA,IAAAA,KAAA,CAAAQ,IAAA,GAAAR,KAAA,CAAAQ,IAAA,CAAAC,MAAA,IAAAA,MAAA,CAAAT,KAAA;KAOH,QAAAU,CAAA;MAAA,OAAAP,OAAA,CAAAQ,MAAA,CAAAD,CAAA;;;EAED,oBACIE,6BAACC,OAAO;IAACrB,KAAK,EAAEA;kBACZoB,6BAACE,QAAQ;kBACOtB,KAAK;IACjBuB,SAAS,EAAC,2BAA2B;IACrCjB,OAAO,EAAEV,iBAAiB;IAC1B4B,aAAa,EAAE1B,kBAAkB,IAAI,CAACF,iBAAiB;IACvD6B,OAAO,EAAEhC,SAAS,CAACgB,MAAM,CAACiB,aAAa,KAAKC,uBAAuB,CAACC,OAAO;IAC3EC,QAAQ,EAAExB;IACZ,CACI;AAElB;AAEA,MAAMyB,aAAa,GAAGA,CAACC,YAAoB,EAAEC,UAAkB;EAC3D,MAAMC,SAAS,GAAGD,UAAU,GAAGD,YAAY,GAAGC,UAAU,GAAGD,YAAY;EACvE,MAAMG,OAAO,GAAGF,UAAU,GAAGD,YAAY,GAAGC,UAAU,GAAGD,YAAY;EAErE,OAAO,CAACE,SAAS,EAAEC,OAAO,CAAC;AAC/B,CAAC;AAED,SAASC,IAAIA,CAAkB9C,OAA8C;;EACzE,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAM;IAAE6C,GAAG;IAAE5C;GAAO,GAAGH,OAAO;EAC9B,MAAM;IAAEgD;GAAU,GAAGjB,cAAK,CAACkB,UAAU,CAACC,UAAU,CAAC;EACjD,MAAM9C,SAAS,GAAGD,KAAK,CAACE,OAAO,CAACC,IAA6B;EAE7D,IAAIH,KAAK,CAACE,OAAO,CAAC8C,cAAc,KAAAC,qBAAA,GAAIjD,KAAK,CAACqB,QAAQ,EAAE,CAAC6B,QAAQ,cAAAD,qBAAA,eAAzBA,qBAAA,CAA2BE,MAAM,IAAI,CAACP,GAAG,CAACQ,YAAY,EAAE,EAAE;IAC1F,OAAO,IAAI;;EAGf,MAAMC,UAAU,GAAGT,GAAG,CAACQ,YAAY,EAAE,GAAGR,GAAG,CAACU,uBAAuB,EAAE,GAAGV,GAAG,CAACW,aAAa,EAAE;EAC3F,MAAMC,SAAS,GAAGZ,GAAG,CAACa,YAAY,EAAE;EACpC,MAAMjD,KAAK,GAAG6C,UAAU,GAAGvD,KAAK,CAACE,KAAK,CAACS,OAAO,CAACC,MAAM,CAACgD,QAAQ,GAAG5D,KAAK,CAACE,KAAK,CAACS,OAAO,CAACC,MAAM,CAACA,MAAM;EAElG,MAAMiD,WAAW,aAAUC,KAAuB;IAAA;;QAsB9C3D,SAAS,CAAC4D,YAAY,CAACC,oBAAoB,CAACC,OAAO,GAAGnB,GAAG,CAACoB,KAAK;;MArB/DJ,KAAK,CAACK,eAAe,EAAE;MAAC,MAAAC,MAAA;QAAA,IAEpBtB,GAAG,CAACQ,YAAY,EAAE;UAClBR,GAAG,CAACuB,OAAO,CAACC,OAAO,CAACxB,GAAG,IAAIA,GAAG,CAACyB,cAAc,EAAE,CAAC;;UAAC,MAAAC,MAAA;YAAA,IAC1CV,KAAK,CAACW,QAAQ;cAAA,IAAAC,qBAAA;cAAA,SAAAC;gBASrBzE,KAAK,CAAC0E,eAAe,CAAEC,mBAAsC,KAAM;kBAC/D,GAAGA,mBAAmB;kBACtB,GAAGC,YAAY,CAACC,MAAM,CAACjC,GAAG,IAAIA,GAAG,CAACa,YAAY,EAAE,CAAC,CAACqB,MAAM,CAAC,CAACC,KAAK,EAAEnC,GAAG,MAAM;oBAAE,GAAGmC,KAAK;oBAAE,CAACnC,GAAG,CAACoC,EAAE,GAAG;mBAAM,CAAC,EAAE,EAAE;iBAC9G,CAAC,CAAC;;cAXH,MAAM,CAACvC,SAAS,EAAEC,OAAO,CAAC,GAAGJ,aAAa,EAAAkC,qBAAA,GAACvE,SAAS,CAAC4D,YAAY,CAACC,oBAAoB,CAACC,OAAO,cAAAS,qBAAA,cAAAA,qBAAA,GAAI,CAAC,EAAE3B,QAAQ,CAAC;cAC9G,MAAM+B,YAAY,GAAG5E,KAAK,CAACiF,WAAW,EAAE,CAACC,IAAI,CAACC,KAAK,CAAC1C,SAAS,EAAEC,OAAO,GAAG,CAAC,CAAC;cAAC,MAAA0C,MAAA;gBAAA,IAExEnF,SAAS,CAACgB,MAAM,CAACC,eAAe,IAAI0D,YAAY,CAACS,IAAI,CAACzC,GAAG,IAAIA,GAAG,CAAC0C,QAAQ,KAAKC,SAAS,CAAC;;kBACxF,OAAApE,OAAA,CAAAC,OAAA,CACMnB,SAAS,CAACgB,MAAM,CAACC,eAAe,CAAClB,KAAK,CAACqB,QAAQ,EAAE,CAACC,OAAO,EAAEtB,KAAK,CAACqB,QAAQ,EAAE,CAACE,aAAa,CAAC,EAAAC,IAAA;;;cAAA,OAAA4D,MAAA,IAAAA,MAAA,CAAA5D,IAAA,GAAA4D,MAAA,CAAA5D,IAAA,CAAAiD,MAAA,IAAAA,MAAA,CAAAW,MAAA;;cAQpGxC,GAAG,CAACyB,cAAc,EAAE;;;UAAC,IAAAC,MAAA,IAAAA,MAAA,CAAA9C,IAAA,SAAA8C,MAAA,CAAA9C,IAAA;;;MAAA,OAAAL,OAAA,CAAAC,OAAA,CAAA8C,MAAA,IAAAA,MAAA,CAAA1C,IAAA,GAAA0C,MAAA,CAAA1C,IAAA,CAAAgE,MAAA,IAAAA,MAAA,CAAAtB,MAAA;KAI5B,QAAAxC,CAAA;MAAA,OAAAP,OAAA,CAAAQ,MAAA,CAAAD,CAAA;;;EAED,oBACIE,6BAACC,OAAO;IACJ4D,MAAM,EAAE,CAACjC,SAAS;IAClBhD,KAAK,eACDoB,4DACKpB,KAAK,eACNoB,6BAAC8D,QAAQ;MAAC3D,SAAS,EAAC,MAAM;MAAC4D,IAAI,EAAC;MAAU;kBAGlD/D,6BAACE,QAAQ;kBACOtB,KAAK;IACjBuB,SAAS,EAAC,OAAO;IACjBjB,OAAO,EAAEuC,UAAU;IACnBuC,OAAO,EAAEjC,WAAW;IACpBkC,QAAQ,EAAE,CAACrC,SAAS;;IAEpBnB,QAAQ,EAAEA,MAAM;IAClB,CACI;AAElB;MAEayD,QAAQ,GAAkC;EACnDC,MAAM,EAAEnG,MAAM;EACdkG,QAAQ,EAAEnD,IAAI;EACdqD,IAAI,EAAE,EAAE;EACR7F,IAAI,EAAE;IACF8F,KAAK,EAAE,QAAQ;IACflE,SAAS,EAAE,OAAO;;IAElBmE,YAAY,EAAE,KAAK;IACnBH,MAAM,EAAE,EAAE;IACVI,eAAe,EAAE;;;;;;"}
|
|
1
|
+
{"version":3,"file":"Selection.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Selection.tsx"],"sourcesContent":["import React from 'react';\nimport {\n HeaderContext as ReactTableHeaderContext,\n CellContext as ReactTableCellContext,\n TableMeta as ReactTableMeta,\n RowSelectionState,\n} from '@tanstack/react-table';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { Tooltip } from '../../../../../../components/Tooltip/Tooltip';\nimport { Checkbox } from '../../../../../../components/Checkbox/Checkbox';\nimport { Shortcut } from '../../../../../../components/Shortcut/Shortcut';\nimport { TableServerLoadAllState } from '../../../../types';\nimport { RowContext } from '../../Row/RowContext';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\n\nfunction Header<TType = unknown>(context: ReactTableHeaderContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { table } = context;\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n const isAllRowsSelected = table.getIsAllRowsSelected();\n const isSomeRowsSelected = table.getIsSomeRowsSelected();\n const title = isAllRowsSelected ? texts.table.columns.select.deselectAll : texts.table.columns.select.selectAll;\n\n const handleChange = async (checked: boolean) => {\n // load all data if that is possible\n if (tableMeta.server.loadAllIfNeeded) {\n // don't pass the search query because we need all data - not filtered data\n await tableMeta.server.loadAllIfNeeded(table.getState().sorting, table.getState().columnFilters);\n }\n\n table.toggleAllRowsSelected(checked);\n };\n\n return (\n <Tooltip title={title}>\n <Checkbox\n aria-label={title}\n className=\"hover:border-blue !-mt-px\"\n checked={isAllRowsSelected}\n indeterminate={isSomeRowsSelected && !isAllRowsSelected}\n loading={tableMeta.server.loadAllStatus === TableServerLoadAllState.Loading}\n onChange={handleChange}\n />\n </Tooltip>\n );\n}\n\nconst toggleBetween = (fromRowIndex: number, toRowIndex: number): [number, number] => {\n const fromIndex = toRowIndex < fromRowIndex ? toRowIndex : fromRowIndex;\n const toIndex = toRowIndex > fromRowIndex ? toRowIndex : fromRowIndex;\n\n return [fromIndex, toIndex];\n};\n\nfunction Cell<TType = unknown>(context: ReactTableCellContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { row, table } = context;\n const { hideInternalColumns, rowIndex } = React.useContext(RowContext);\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n if (hideInternalColumns || (table.options.enableGrouping && table.getState().grouping?.length && !row.getIsGrouped())) {\n return null;\n }\n\n const isSelected = row.getIsGrouped() ? row.getIsAllSubRowsSelected() : row.getIsSelected();\n const canSelect = row.getCanSelect();\n const title = isSelected ? texts.table.columns.select.deselect : texts.table.columns.select.select;\n\n const handleClick = async (event: React.MouseEvent) => {\n event.stopPropagation();\n\n if (row.getIsGrouped()) {\n row.subRows.forEach(row => row.toggleSelected());\n } else if (event.shiftKey) {\n const [fromIndex, toIndex] = toggleBetween(tableMeta.rowSelection.lastSelectedRowIndex.current ?? 0, rowIndex);\n const selectedRows = table.getRowModel().rows.slice(fromIndex, toIndex + 1);\n\n if (tableMeta.server.loadAllIfNeeded && selectedRows.some(row => row.original === undefined)) {\n // don't pass the search query because we need all data - not filtered data\n await tableMeta.server.loadAllIfNeeded(table.getState().sorting, table.getState().columnFilters);\n }\n\n table.setRowSelection((currentRowSelection: RowSelectionState) => ({\n ...currentRowSelection,\n ...selectedRows.filter(row => row.getCanSelect()).reduce((state, row) => ({ ...state, [row.id]: true }), {}),\n }));\n } else {\n row.toggleSelected();\n }\n\n tableMeta.rowSelection.lastSelectedRowIndex.current = row.index;\n };\n\n return (\n <Tooltip\n hidden={!canSelect}\n title={\n <>\n {title}\n <Shortcut className=\"ml-2\" keys=\"Space\" />\n </>\n }>\n <Checkbox\n aria-label={title}\n className=\"!mt-0\"\n checked={isSelected}\n onClick={handleClick}\n disabled={!canSelect}\n // this is necessary to remove console spam from eslint\n onChange={() => false}\n />\n </Tooltip>\n );\n}\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n size: 40,\n meta: {\n align: 'center',\n className: '!px-1',\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n headerClassName: '!px-1',\n },\n};\n"],"names":["Header","context","texts","useLocalization","table","tableMeta","options","meta","isAllRowsSelected","getIsAllRowsSelected","isSomeRowsSelected","getIsSomeRowsSelected","title","columns","select","deselectAll","selectAll","handleChange","checked","toggleAllRowsSelected","_temp","server","loadAllIfNeeded","Promise","resolve","getState","sorting","columnFilters","then","_temp2","e","reject","React","Tooltip","Checkbox","className","indeterminate","loading","loadAllStatus","TableServerLoadAllState","Loading","onChange","toggleBetween","fromRowIndex","toRowIndex","fromIndex","toIndex","Cell","row","hideInternalColumns","rowIndex","useContext","RowContext","enableGrouping","_table$getState$group","grouping","length","getIsGrouped","isSelected","getIsAllSubRowsSelected","getIsSelected","canSelect","getCanSelect","deselect","handleClick","event","rowSelection","lastSelectedRowIndex","current","index","stopPropagation","_temp6","subRows","forEach","toggleSelected","_temp5","shiftKey","_tableMeta$rowSelecti","_temp4","setRowSelection","currentRowSelection","selectedRows","filter","reduce","state","id","getRowModel","rows","slice","_temp3","some","original","undefined","_temp7","hidden","Shortcut","keys","onClick","disabled","renderer","header","size","align","enableSearch","headerClassName"],"mappings":"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"}
|