@navikt/ds-react 8.10.4 → 8.10.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/cjs/data/data-grid/index.d.ts +2 -0
- package/cjs/data/data-grid/index.js +7 -0
- package/cjs/data/data-grid/index.js.map +1 -0
- package/cjs/data/data-grid/root/DataGridRoot.context.d.ts +11 -0
- package/cjs/data/data-grid/root/DataGridRoot.context.js +11 -0
- package/cjs/data/data-grid/root/DataGridRoot.context.js.map +1 -0
- package/cjs/data/data-grid/root/DataGridRoot.d.ts +38 -0
- package/cjs/data/data-grid/root/DataGridRoot.js +68 -0
- package/cjs/data/data-grid/root/DataGridRoot.js.map +1 -0
- package/cjs/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js +11 -13
- package/cjs/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js.map +1 -1
- package/cjs/data/drag-and-drop/root/DragAndDrop.context.d.ts +4 -2
- package/cjs/data/drag-and-drop/root/DragAndDrop.context.js.map +1 -1
- package/cjs/data/drag-and-drop/root/DragAndDropRoot.js +44 -46
- package/cjs/data/drag-and-drop/root/DragAndDropRoot.js.map +1 -1
- package/cjs/data/drag-and-drop/types.d.ts +0 -4
- package/cjs/data/stories/Data.test-data.d.ts +2 -5
- package/cjs/data/stories/Data.test-data.js +30 -39
- package/cjs/data/stories/Data.test-data.js.map +1 -1
- package/cjs/data/table/base-cell/DataTableBaseCell.d.ts +15 -15
- package/cjs/data/table/base-cell/DataTableBaseCell.js +4 -8
- package/cjs/data/table/base-cell/DataTableBaseCell.js.map +1 -1
- package/cjs/data/table/column-header/DataTableColumnHeader.d.ts +24 -6
- package/cjs/data/table/column-header/DataTableColumnHeader.js +22 -27
- package/cjs/data/table/column-header/DataTableColumnHeader.js.map +1 -1
- package/cjs/data/table/column-header/useTableColumnResize.d.ts +19 -29
- package/cjs/data/table/column-header/useTableColumnResize.js +24 -22
- package/cjs/data/table/column-header/useTableColumnResize.js.map +1 -1
- package/cjs/data/table/details-panel-row/DataTableDetailsPanelRow.d.ts +1 -1
- package/cjs/data/table/details-panel-row/DataTableDetailsPanelRow.js +2 -2
- package/cjs/data/table/details-panel-row/DataTableDetailsPanelRow.js.map +1 -1
- package/cjs/data/table/helpers/collectTableRowEntries.d.ts +9 -7
- package/cjs/data/table/helpers/collectTableRowEntries.js +18 -10
- package/cjs/data/table/helpers/collectTableRowEntries.js.map +1 -1
- package/cjs/data/table/helpers/selection/getMultipleSelectProps.d.ts +13 -11
- package/cjs/data/table/helpers/selection/getMultipleSelectProps.js +43 -53
- package/cjs/data/table/helpers/selection/getMultipleSelectProps.js.map +1 -1
- package/cjs/data/table/helpers/selection/getSingleSelectProps.d.ts +9 -8
- package/cjs/data/table/helpers/selection/getSingleSelectProps.js +23 -10
- package/cjs/data/table/helpers/selection/getSingleSelectProps.js.map +1 -1
- package/cjs/data/table/helpers/selection/selection.types.d.ts +19 -19
- package/cjs/data/table/helpers/selection/selection.utils.d.ts +21 -0
- package/cjs/data/table/helpers/selection/selection.utils.js +46 -0
- package/cjs/data/table/helpers/selection/selection.utils.js.map +1 -0
- package/cjs/data/table/helpers/table-focus.d.ts +0 -3
- package/cjs/data/table/helpers/table-focus.js +38 -8
- package/cjs/data/table/helpers/table-focus.js.map +1 -1
- package/cjs/data/table/hooks/useColumnOptions.d.ts +16 -5
- package/cjs/data/table/hooks/useColumnOptions.js +26 -8
- package/cjs/data/table/hooks/useColumnOptions.js.map +1 -1
- package/cjs/data/table/hooks/useGridCache.js +2 -2
- package/cjs/data/table/hooks/useGridCache.js.map +1 -1
- package/cjs/data/table/hooks/useTableDetailsPanel.d.ts +10 -13
- package/cjs/data/table/hooks/useTableDetailsPanel.js +7 -6
- package/cjs/data/table/hooks/useTableDetailsPanel.js.map +1 -1
- package/cjs/data/table/hooks/useTableItems.d.ts +31 -17
- package/cjs/data/table/hooks/useTableItems.js +10 -20
- package/cjs/data/table/hooks/useTableItems.js.map +1 -1
- package/cjs/data/table/hooks/useTableKeyboardNav.d.ts +1 -6
- package/cjs/data/table/hooks/useTableKeyboardNav.js +6 -5
- package/cjs/data/table/hooks/useTableKeyboardNav.js.map +1 -1
- package/cjs/data/table/hooks/useTableSelection.d.ts +6 -6
- package/cjs/data/table/hooks/useTableSelection.js +13 -13
- package/cjs/data/table/hooks/useTableSelection.js.map +1 -1
- package/cjs/data/table/hooks/useTableSort.d.ts +2 -2
- package/cjs/data/table/hooks/useTableSort.js +4 -5
- package/cjs/data/table/hooks/useTableSort.js.map +1 -1
- package/cjs/data/table/root/DataTable.types.d.ts +22 -13
- package/cjs/data/table/root/DataTableRoot.context.d.ts +13 -7
- package/cjs/data/table/root/DataTableRoot.context.js.map +1 -1
- package/cjs/data/table/root/DataTableRoot.d.ts +49 -72
- package/cjs/data/table/root/DataTableRoot.js +56 -72
- package/cjs/data/table/root/DataTableRoot.js.map +1 -1
- package/cjs/data/table/root/DataTableRoot.legacy.d.ts +2 -7
- package/cjs/data/table/root/DataTableRoot.legacy.js +17 -3
- package/cjs/data/table/root/DataTableRoot.legacy.js.map +1 -1
- package/cjs/data/table/sub-row-toggle/DataTableSubRowToggle.js +4 -4
- package/cjs/data/table/sub-row-toggle/DataTableSubRowToggle.js.map +1 -1
- package/cjs/data/table/tbody/DataTableTbody.js +4 -2
- package/cjs/data/table/tbody/DataTableTbody.js.map +1 -1
- package/cjs/data/table/tr/DataTableTr.d.ts +5 -3
- package/cjs/data/table/tr/DataTableTr.js +36 -23
- package/cjs/data/table/tr/DataTableTr.js.map +1 -1
- package/cjs/table/ColumnHeader.js +2 -1
- package/cjs/table/ColumnHeader.js.map +1 -1
- package/esm/data/data-grid/index.d.ts +2 -0
- package/esm/data/data-grid/index.js +3 -0
- package/esm/data/data-grid/index.js.map +1 -0
- package/esm/data/data-grid/root/DataGridRoot.context.d.ts +11 -0
- package/esm/data/data-grid/root/DataGridRoot.context.js +7 -0
- package/esm/data/data-grid/root/DataGridRoot.context.js.map +1 -0
- package/esm/data/data-grid/root/DataGridRoot.d.ts +38 -0
- package/esm/data/data-grid/root/DataGridRoot.js +32 -0
- package/esm/data/data-grid/root/DataGridRoot.js.map +1 -0
- package/esm/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js +11 -13
- package/esm/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js.map +1 -1
- package/esm/data/drag-and-drop/root/DragAndDrop.context.d.ts +4 -2
- package/esm/data/drag-and-drop/root/DragAndDrop.context.js.map +1 -1
- package/esm/data/drag-and-drop/root/DragAndDropRoot.js +44 -46
- package/esm/data/drag-and-drop/root/DragAndDropRoot.js.map +1 -1
- package/esm/data/drag-and-drop/types.d.ts +0 -4
- package/esm/data/stories/Data.test-data.d.ts +2 -5
- package/esm/data/stories/Data.test-data.js +30 -39
- package/esm/data/stories/Data.test-data.js.map +1 -1
- package/esm/data/table/base-cell/DataTableBaseCell.d.ts +15 -15
- package/esm/data/table/base-cell/DataTableBaseCell.js +4 -8
- package/esm/data/table/base-cell/DataTableBaseCell.js.map +1 -1
- package/esm/data/table/column-header/DataTableColumnHeader.d.ts +24 -6
- package/esm/data/table/column-header/DataTableColumnHeader.js +23 -28
- package/esm/data/table/column-header/DataTableColumnHeader.js.map +1 -1
- package/esm/data/table/column-header/useTableColumnResize.d.ts +19 -29
- package/esm/data/table/column-header/useTableColumnResize.js +24 -22
- package/esm/data/table/column-header/useTableColumnResize.js.map +1 -1
- package/esm/data/table/details-panel-row/DataTableDetailsPanelRow.d.ts +1 -1
- package/esm/data/table/details-panel-row/DataTableDetailsPanelRow.js +2 -2
- package/esm/data/table/details-panel-row/DataTableDetailsPanelRow.js.map +1 -1
- package/esm/data/table/helpers/collectTableRowEntries.d.ts +9 -7
- package/esm/data/table/helpers/collectTableRowEntries.js +18 -10
- package/esm/data/table/helpers/collectTableRowEntries.js.map +1 -1
- package/esm/data/table/helpers/selection/getMultipleSelectProps.d.ts +13 -11
- package/esm/data/table/helpers/selection/getMultipleSelectProps.js +43 -53
- package/esm/data/table/helpers/selection/getMultipleSelectProps.js.map +1 -1
- package/esm/data/table/helpers/selection/getSingleSelectProps.d.ts +9 -8
- package/esm/data/table/helpers/selection/getSingleSelectProps.js +23 -10
- package/esm/data/table/helpers/selection/getSingleSelectProps.js.map +1 -1
- package/esm/data/table/helpers/selection/selection.types.d.ts +19 -19
- package/esm/data/table/helpers/selection/selection.utils.d.ts +21 -0
- package/esm/data/table/helpers/selection/selection.utils.js +43 -0
- package/esm/data/table/helpers/selection/selection.utils.js.map +1 -0
- package/esm/data/table/helpers/table-focus.d.ts +0 -3
- package/esm/data/table/helpers/table-focus.js +38 -8
- package/esm/data/table/helpers/table-focus.js.map +1 -1
- package/esm/data/table/hooks/useColumnOptions.d.ts +16 -5
- package/esm/data/table/hooks/useColumnOptions.js +26 -8
- package/esm/data/table/hooks/useColumnOptions.js.map +1 -1
- package/esm/data/table/hooks/useGridCache.js +2 -2
- package/esm/data/table/hooks/useGridCache.js.map +1 -1
- package/esm/data/table/hooks/useTableDetailsPanel.d.ts +10 -13
- package/esm/data/table/hooks/useTableDetailsPanel.js +7 -6
- package/esm/data/table/hooks/useTableDetailsPanel.js.map +1 -1
- package/esm/data/table/hooks/useTableItems.d.ts +31 -17
- package/esm/data/table/hooks/useTableItems.js +11 -18
- package/esm/data/table/hooks/useTableItems.js.map +1 -1
- package/esm/data/table/hooks/useTableKeyboardNav.d.ts +1 -6
- package/esm/data/table/hooks/useTableKeyboardNav.js +7 -6
- package/esm/data/table/hooks/useTableKeyboardNav.js.map +1 -1
- package/esm/data/table/hooks/useTableSelection.d.ts +6 -6
- package/esm/data/table/hooks/useTableSelection.js +13 -13
- package/esm/data/table/hooks/useTableSelection.js.map +1 -1
- package/esm/data/table/hooks/useTableSort.d.ts +2 -2
- package/esm/data/table/hooks/useTableSort.js +4 -5
- package/esm/data/table/hooks/useTableSort.js.map +1 -1
- package/esm/data/table/root/DataTable.types.d.ts +22 -13
- package/esm/data/table/root/DataTableRoot.context.d.ts +13 -7
- package/esm/data/table/root/DataTableRoot.context.js.map +1 -1
- package/esm/data/table/root/DataTableRoot.d.ts +49 -72
- package/esm/data/table/root/DataTableRoot.js +58 -74
- package/esm/data/table/root/DataTableRoot.js.map +1 -1
- package/esm/data/table/root/DataTableRoot.legacy.d.ts +2 -7
- package/esm/data/table/root/DataTableRoot.legacy.js +17 -3
- package/esm/data/table/root/DataTableRoot.legacy.js.map +1 -1
- package/esm/data/table/sub-row-toggle/DataTableSubRowToggle.js +4 -4
- package/esm/data/table/sub-row-toggle/DataTableSubRowToggle.js.map +1 -1
- package/esm/data/table/tbody/DataTableTbody.js +4 -2
- package/esm/data/table/tbody/DataTableTbody.js.map +1 -1
- package/esm/data/table/tr/DataTableTr.d.ts +5 -3
- package/esm/data/table/tr/DataTableTr.js +35 -23
- package/esm/data/table/tr/DataTableTr.js.map +1 -1
- package/esm/table/ColumnHeader.js +2 -1
- package/esm/table/ColumnHeader.js.map +1 -1
- package/package.json +8 -7
- package/src/data/data-grid/index.ts +3 -0
- package/src/data/data-grid/root/DataGridRoot.context.ts +16 -0
- package/src/data/data-grid/root/DataGridRoot.tsx +71 -0
- package/src/data/drag-and-drop/drag-handler/DragAndDropDragHandler.tsx +11 -17
- package/src/data/drag-and-drop/root/DragAndDrop.context.tsx +4 -2
- package/src/data/drag-and-drop/root/DragAndDropRoot.tsx +63 -52
- package/src/data/drag-and-drop/types.ts +0 -5
- package/src/data/stories/Data.test-data.tsx +52 -44
- package/src/data/table/agent-component-review.md +175 -0
- package/src/data/table/base-cell/DataTableBaseCell.tsx +31 -21
- package/src/data/table/column-header/DataTableColumnHeader.tsx +63 -58
- package/src/data/table/column-header/useTableColumnResize.ts +55 -71
- package/src/data/table/details-panel-row/DataTableDetailsPanelRow.tsx +7 -3
- package/src/data/table/helpers/collectTableRowEntries.ts +32 -19
- package/src/data/table/helpers/selection/getMultipleSelectProps.ts +65 -85
- package/src/data/table/helpers/selection/getSingleSelectProps.ts +35 -17
- package/src/data/table/helpers/selection/selection.types.ts +19 -19
- package/src/data/table/helpers/selection/selection.utils.test.ts +161 -0
- package/src/data/table/helpers/selection/selection.utils.ts +73 -0
- package/src/data/table/helpers/table-focus.ts +63 -9
- package/src/data/table/hooks/__tests__/useTableItems.test.ts +48 -8
- package/src/data/table/hooks/useColumnOptions.ts +48 -14
- package/src/data/table/hooks/useGridCache.ts +3 -2
- package/src/data/table/hooks/useTableDetailsPanel.tsx +25 -25
- package/src/data/table/hooks/useTableItems.ts +51 -42
- package/src/data/table/hooks/useTableKeyboardNav.ts +7 -15
- package/src/data/table/hooks/useTableSelection.ts +26 -31
- package/src/data/table/hooks/useTableSort.ts +10 -9
- package/src/data/table/root/DataTable.types.ts +30 -25
- package/src/data/table/root/DataTableRoot.context.ts +19 -7
- package/src/data/table/root/DataTableRoot.legacy.tsx +22 -14
- package/src/data/table/root/DataTableRoot.tsx +271 -320
- package/src/data/table/sub-row-toggle/DataTableSubRowToggle.tsx +5 -4
- package/src/data/table/tbody/DataTableTbody.tsx +6 -2
- package/src/data/table/tr/DataTableTr.tsx +98 -35
- package/src/table/ColumnHeader.tsx +2 -1
- package/cjs/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.d.ts +0 -22
- package/cjs/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.js +0 -35
- package/cjs/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.js.map +0 -1
- package/cjs/data/drag-and-drop-old/item/DataDragAndDropItem.d.ts +0 -27
- package/cjs/data/drag-and-drop-old/item/DataDragAndDropItem.js +0 -86
- package/cjs/data/drag-and-drop-old/item/DataDragAndDropItem.js.map +0 -1
- package/cjs/data/drag-and-drop-old/root/DataDragAndDrop.context.d.ts +0 -5
- package/cjs/data/drag-and-drop-old/root/DataDragAndDrop.context.js +0 -6
- package/cjs/data/drag-and-drop-old/root/DataDragAndDrop.context.js.map +0 -1
- package/cjs/data/drag-and-drop-old/root/DataDragAndDropRoot.d.ts +0 -24
- package/cjs/data/drag-and-drop-old/root/DataDragAndDropRoot.js +0 -108
- package/cjs/data/drag-and-drop-old/root/DataDragAndDropRoot.js.map +0 -1
- package/cjs/data/table/helpers/selection/SelectionSubtreeHelper.d.ts +0 -46
- package/cjs/data/table/helpers/selection/SelectionSubtreeHelper.js +0 -112
- package/cjs/data/table/helpers/selection/SelectionSubtreeHelper.js.map +0 -1
- package/esm/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.d.ts +0 -22
- package/esm/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.js +0 -29
- package/esm/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.js.map +0 -1
- package/esm/data/drag-and-drop-old/item/DataDragAndDropItem.d.ts +0 -27
- package/esm/data/drag-and-drop-old/item/DataDragAndDropItem.js +0 -50
- package/esm/data/drag-and-drop-old/item/DataDragAndDropItem.js.map +0 -1
- package/esm/data/drag-and-drop-old/root/DataDragAndDrop.context.d.ts +0 -5
- package/esm/data/drag-and-drop-old/root/DataDragAndDrop.context.js +0 -3
- package/esm/data/drag-and-drop-old/root/DataDragAndDrop.context.js.map +0 -1
- package/esm/data/drag-and-drop-old/root/DataDragAndDropRoot.d.ts +0 -24
- package/esm/data/drag-and-drop-old/root/DataDragAndDropRoot.js +0 -68
- package/esm/data/drag-and-drop-old/root/DataDragAndDropRoot.js.map +0 -1
- package/esm/data/table/helpers/selection/SelectionSubtreeHelper.d.ts +0 -46
- package/esm/data/table/helpers/selection/SelectionSubtreeHelper.js +0 -109
- package/esm/data/table/helpers/selection/SelectionSubtreeHelper.js.map +0 -1
- package/src/data/drag-and-drop-old/drag-handler/DataDragAndDropDragHandler.tsx +0 -104
- package/src/data/drag-and-drop-old/item/DataDragAndDropItem.tsx +0 -74
- package/src/data/drag-and-drop-old/root/DataDragAndDrop.context.tsx +0 -11
- package/src/data/drag-and-drop-old/root/DataDragAndDropRoot.tsx +0 -96
- package/src/data/table/helpers/selection/SelectionSubtreeHelper.test.ts +0 -66
- package/src/data/table/helpers/selection/SelectionSubtreeHelper.ts +0 -162
- package/src/data/table/hooks/__tests__/useTableSelection.test.ts +0 -488
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import type { CheckboxInputProps } from "../../../../form/checkbox/checkbox-input/CheckboxInput.js";
|
|
2
2
|
import type { RadioInputProps } from "../../../../form/radio/radio-input/RadioInput.js";
|
|
3
|
-
type
|
|
4
|
-
type
|
|
3
|
+
import type { TableRowEntryId } from "../../root/DataTable.types.js";
|
|
4
|
+
type SelectedKeysT = TableRowEntryId[];
|
|
5
|
+
type SelectionProps<T = any> = {
|
|
5
6
|
/**
|
|
6
7
|
* Enables selection of rows.
|
|
7
8
|
*
|
|
@@ -12,7 +13,7 @@ type SelectionProps = {
|
|
|
12
13
|
*
|
|
13
14
|
* @default "none"
|
|
14
15
|
*/
|
|
15
|
-
selectionMode
|
|
16
|
+
selectionMode: "none" | "single" | "multiple";
|
|
16
17
|
/**
|
|
17
18
|
* Controlled selected keys. Should be used in conjunction with `onSelectionChange`.
|
|
18
19
|
*/
|
|
@@ -26,41 +27,40 @@ type SelectionProps = {
|
|
|
26
27
|
*/
|
|
27
28
|
onSelectionChange?: (keys: SelectedKeysT) => void;
|
|
28
29
|
/**
|
|
29
|
-
*
|
|
30
|
+
* Callback to determine if a row should be enabled for selection.
|
|
30
31
|
*
|
|
31
32
|
*
|
|
32
|
-
*
|
|
33
|
+
* If set to a boolean, it will enable selection for all rows when true, and disable selection for all rows when false.
|
|
33
34
|
*/
|
|
34
|
-
|
|
35
|
+
enableRowSelection?: (({ row, id }: {
|
|
36
|
+
row: T;
|
|
37
|
+
id: TableRowEntryId;
|
|
38
|
+
}) => boolean) | boolean;
|
|
35
39
|
/**
|
|
36
|
-
*
|
|
37
|
-
*
|
|
38
|
-
* @default false
|
|
40
|
+
* Determines if selection is triggered by clicking the row or the selection control (checkbox/radio).
|
|
41
|
+
* @default "row"
|
|
39
42
|
*/
|
|
40
|
-
|
|
43
|
+
selectionTrigger?: "row" | "control";
|
|
41
44
|
};
|
|
42
45
|
type NoneSelection = {
|
|
43
46
|
selectionMode: "none";
|
|
44
47
|
selectedKeys: SelectedKeysT;
|
|
45
|
-
disabledSelectionKeys: SelectedKeysT;
|
|
46
48
|
};
|
|
47
49
|
type SingleSelection = {
|
|
48
50
|
selectionMode: "single";
|
|
49
51
|
selectedKeys: SelectedKeysT;
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
toggleSelection: (key: string | number) => void;
|
|
52
|
+
getRowRadioProps: (key: TableRowEntryId, row: any) => RadioInputProps;
|
|
53
|
+
toggleSelection: (key: TableRowEntryId, row: any) => void;
|
|
53
54
|
};
|
|
54
55
|
type MultipleSelection = {
|
|
55
56
|
selectionMode: "multiple";
|
|
56
57
|
selectedKeys: SelectedKeysT;
|
|
57
|
-
disabledSelectionKeys: SelectedKeysT;
|
|
58
58
|
getTheadCheckboxProps: () => CheckboxInputProps;
|
|
59
|
-
getRowCheckboxProps: (key:
|
|
60
|
-
toggleSelection: (key:
|
|
59
|
+
getRowCheckboxProps: (key: TableRowEntryId, row: any) => CheckboxInputProps;
|
|
60
|
+
toggleSelection: (key: TableRowEntryId, row: any) => void;
|
|
61
61
|
};
|
|
62
62
|
type TableSelectionBase = {
|
|
63
|
-
isRowSelected: (rowId:
|
|
63
|
+
isRowSelected: (rowId: TableRowEntryId) => boolean;
|
|
64
64
|
};
|
|
65
65
|
type TableSelection = TableSelectionBase & (NoneSelection | SingleSelection | MultipleSelection);
|
|
66
|
-
export type { MultipleSelection, NoneSelection, SelectionProps, SingleSelection, TableSelection,
|
|
66
|
+
export type { MultipleSelection, NoneSelection, SelectedKeysT, SelectionProps, SingleSelection, TableSelection, };
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { TableRowEntryId } from "../../root/DataTable.types.js";
|
|
2
|
+
import type { ItemDetail } from "../collectTableRowEntries.js";
|
|
3
|
+
import type { SelectionProps } from "./selection.types.js";
|
|
4
|
+
declare function canSelectTableRow<T>(enableRowSelection: SelectionProps<T>["enableRowSelection"], args: {
|
|
5
|
+
row: T;
|
|
6
|
+
id: TableRowEntryId;
|
|
7
|
+
}): boolean;
|
|
8
|
+
type MutateRowSelectionArgs<T> = {
|
|
9
|
+
selectedRowIds: Set<TableRowEntryId>;
|
|
10
|
+
rowId: TableRowEntryId;
|
|
11
|
+
checked: boolean;
|
|
12
|
+
childRowIdsById: Map<TableRowEntryId, TableRowEntryId[]>;
|
|
13
|
+
itemDetails: Map<TableRowEntryId, ItemDetail<T>>;
|
|
14
|
+
enableRowSelection?: SelectionProps<T>["enableRowSelection"];
|
|
15
|
+
};
|
|
16
|
+
/**
|
|
17
|
+
* Traverses the row and its children and updates selected-state directly on given selectedRowIds set.
|
|
18
|
+
* Returns true if any changes were made to the set, false otherwise.
|
|
19
|
+
*/
|
|
20
|
+
declare function mutateRowSelection<T>({ selectedRowIds, rowId, checked, childRowIdsById, itemDetails, enableRowSelection, }: MutateRowSelectionArgs<T>): boolean;
|
|
21
|
+
export { canSelectTableRow, mutateRowSelection };
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
function canSelectTableRow(enableRowSelection, args) {
|
|
2
|
+
if (typeof enableRowSelection === "function") {
|
|
3
|
+
return enableRowSelection(args);
|
|
4
|
+
}
|
|
5
|
+
return enableRowSelection !== null && enableRowSelection !== void 0 ? enableRowSelection : true;
|
|
6
|
+
}
|
|
7
|
+
/**
|
|
8
|
+
* Traverses the row and its children and updates selected-state directly on given selectedRowIds set.
|
|
9
|
+
* Returns true if any changes were made to the set, false otherwise.
|
|
10
|
+
*/
|
|
11
|
+
function mutateRowSelection({ selectedRowIds, rowId, checked, childRowIdsById, itemDetails, enableRowSelection, }) {
|
|
12
|
+
let changed = false;
|
|
13
|
+
const item = itemDetails.get(rowId);
|
|
14
|
+
if (item &&
|
|
15
|
+
canSelectTableRow(enableRowSelection, { row: item.rowData, id: rowId })) {
|
|
16
|
+
if (checked && !selectedRowIds.has(rowId)) {
|
|
17
|
+
selectedRowIds.add(rowId);
|
|
18
|
+
changed = true;
|
|
19
|
+
}
|
|
20
|
+
else if (!checked && selectedRowIds.has(rowId)) {
|
|
21
|
+
selectedRowIds.delete(rowId);
|
|
22
|
+
changed = true;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
const children = childRowIdsById.get(rowId);
|
|
26
|
+
if (children) {
|
|
27
|
+
for (const childId of children) {
|
|
28
|
+
if (mutateRowSelection({
|
|
29
|
+
selectedRowIds,
|
|
30
|
+
rowId: childId,
|
|
31
|
+
checked,
|
|
32
|
+
childRowIdsById,
|
|
33
|
+
itemDetails,
|
|
34
|
+
enableRowSelection,
|
|
35
|
+
})) {
|
|
36
|
+
changed = true;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
return changed;
|
|
41
|
+
}
|
|
42
|
+
export { canSelectTableRow, mutateRowSelection };
|
|
43
|
+
//# sourceMappingURL=selection.utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"selection.utils.js","sourceRoot":"","sources":["../../../../../src/data/table/helpers/selection/selection.utils.ts"],"names":[],"mappings":"AAIA,SAAS,iBAAiB,CACxB,kBAA2D,EAC3D,IAAqC;IAErC,IAAI,OAAO,kBAAkB,KAAK,UAAU,EAAE,CAAC;QAC7C,OAAO,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC;IACD,OAAO,kBAAkB,aAAlB,kBAAkB,cAAlB,kBAAkB,GAAI,IAAI,CAAC;AACpC,CAAC;AAWD;;;GAGG;AACH,SAAS,kBAAkB,CAAI,EAC7B,cAAc,EACd,KAAK,EACL,OAAO,EACP,eAAe,EACf,WAAW,EACX,kBAAkB,GACQ;IAC1B,IAAI,OAAO,GAAG,KAAK,CAAC;IACpB,MAAM,IAAI,GAAG,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;IAEpC,IACE,IAAI;QACJ,iBAAiB,CAAC,kBAAkB,EAAE,EAAE,GAAG,EAAE,IAAI,CAAC,OAAO,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EACvE,CAAC;QACD,IAAI,OAAO,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC;YAC1C,cAAc,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;YAC1B,OAAO,GAAG,IAAI,CAAC;QACjB,CAAC;aAAM,IAAI,CAAC,OAAO,IAAI,cAAc,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC;YACjD,cAAc,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAC7B,OAAO,GAAG,IAAI,CAAC;QACjB,CAAC;IACH,CAAC;IAED,MAAM,QAAQ,GAAG,eAAe,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;IAC5C,IAAI,QAAQ,EAAE,CAAC;QACb,KAAK,MAAM,OAAO,IAAI,QAAQ,EAAE,CAAC;YAC/B,IACE,kBAAkB,CAAC;gBACjB,cAAc;gBACd,KAAK,EAAE,OAAO;gBACd,OAAO;gBACP,eAAe;gBACf,WAAW;gBACX,kBAAkB;aACnB,CAAC,EACF,CAAC;gBACD,OAAO,GAAG,IAAI,CAAC;YACjB,CAAC;QACH,CAAC;IACH,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,CAAC"}
|
|
@@ -24,9 +24,6 @@ declare function isDisabledElement(el: HTMLElement): boolean;
|
|
|
24
24
|
* Returns null if no focusable target found.
|
|
25
25
|
*/
|
|
26
26
|
declare function prepareCellFocus(cell: Element): HTMLElement | null;
|
|
27
|
-
/**
|
|
28
|
-
* Applies focus and scroll to an element.
|
|
29
|
-
*/
|
|
30
27
|
declare function applyFocusAndScroll(element: HTMLElement): void;
|
|
31
28
|
/**
|
|
32
29
|
* Focuses a cell by finding its focusable target and applying focus with scroll.
|
|
@@ -97,15 +97,45 @@ function prepareCellFocus(cell) {
|
|
|
97
97
|
/**
|
|
98
98
|
* Applies focus and scroll to an element.
|
|
99
99
|
*/
|
|
100
|
+
function getStickyOffsets(element) {
|
|
101
|
+
var _a;
|
|
102
|
+
const table = element.closest(".aksel-data-table");
|
|
103
|
+
if (!table) {
|
|
104
|
+
return {
|
|
105
|
+
stickyOffsetStart: 0,
|
|
106
|
+
stickyOffsetEnd: 0,
|
|
107
|
+
stickyHeaderHeight: 0,
|
|
108
|
+
};
|
|
109
|
+
}
|
|
110
|
+
const stickyHeader = table.querySelector(`.aksel-data-table__tr[data-sticky="true"]`);
|
|
111
|
+
const stickyNodesStart = table.querySelectorAll(`.aksel-data-table__column-header[data-sticky="start"]`);
|
|
112
|
+
const stickyNodesEnd = table.querySelectorAll(`.aksel-data-table__column-header[data-sticky="end"]`);
|
|
113
|
+
return {
|
|
114
|
+
stickyOffsetStart: Array.from(stickyNodesStart).reduce((offset, node) => offset + node.getBoundingClientRect().width, 0),
|
|
115
|
+
stickyOffsetEnd: Array.from(stickyNodesEnd).reduce((offset, node) => offset + node.getBoundingClientRect().width, 0),
|
|
116
|
+
stickyHeaderHeight: (_a = stickyHeader === null || stickyHeader === void 0 ? void 0 : stickyHeader.getBoundingClientRect().height) !== null && _a !== void 0 ? _a : 0,
|
|
117
|
+
};
|
|
118
|
+
}
|
|
100
119
|
function applyFocusAndScroll(element) {
|
|
101
|
-
element
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
element.
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
120
|
+
const { stickyOffsetStart, stickyOffsetEnd, stickyHeaderHeight } = getStickyOffsets(element);
|
|
121
|
+
const originalScrollMarginInline = element.style.scrollMarginInline;
|
|
122
|
+
const originalScrollMarginBlockStart = element.style.scrollMarginBlockStart;
|
|
123
|
+
element.style.scrollMarginInline = `${stickyOffsetStart}px ${stickyOffsetEnd}px`;
|
|
124
|
+
element.style.scrollMarginBlockStart = `${stickyHeaderHeight}px`;
|
|
125
|
+
try {
|
|
126
|
+
element.focus({
|
|
127
|
+
preventScroll: true,
|
|
128
|
+
});
|
|
129
|
+
element.scrollIntoView({
|
|
130
|
+
behavior: "auto",
|
|
131
|
+
block: "nearest",
|
|
132
|
+
inline: "nearest",
|
|
133
|
+
});
|
|
134
|
+
}
|
|
135
|
+
finally {
|
|
136
|
+
element.style.scrollMarginBlockStart = originalScrollMarginBlockStart;
|
|
137
|
+
element.style.scrollMarginInline = originalScrollMarginInline;
|
|
138
|
+
}
|
|
109
139
|
}
|
|
110
140
|
/**
|
|
111
141
|
* Focuses a cell by finding its focusable target and applying focus with scroll.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-focus.js","sourceRoot":"","sources":["../../../../src/data/table/helpers/table-focus.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"table-focus.js","sourceRoot":"","sources":["../../../../src/data/table/helpers/table-focus.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,19 +1,30 @@
|
|
|
1
1
|
import type { ColumnDefinition, ColumnDefinitions } from "../root/DataTable.types.js";
|
|
2
|
-
import type { SelectionProps } from "./useTableSelection.js";
|
|
3
2
|
type UseColumnOptions = {
|
|
4
3
|
stickyColumns?: {
|
|
5
|
-
|
|
6
|
-
|
|
4
|
+
start?: "1";
|
|
5
|
+
end?: "1";
|
|
7
6
|
};
|
|
8
|
-
|
|
7
|
+
hasSelection: boolean;
|
|
8
|
+
hasDetailsPanel: boolean;
|
|
9
|
+
layout: "fixed" | "auto";
|
|
10
|
+
};
|
|
11
|
+
type StickyStartState = {
|
|
12
|
+
selection: boolean;
|
|
13
|
+
expansion: boolean;
|
|
14
|
+
selectionOffset: number;
|
|
15
|
+
firstColumnOffset: number;
|
|
9
16
|
};
|
|
10
17
|
type UseColumnOptionsResult<T> = {
|
|
11
18
|
columns: {
|
|
12
19
|
isSticky: "start" | "end" | false;
|
|
20
|
+
isStickyLast?: boolean;
|
|
21
|
+
stickyLeftOffset?: number;
|
|
13
22
|
colDef: ColumnDefinition<T>;
|
|
14
23
|
}[];
|
|
15
|
-
|
|
24
|
+
stickyStart: StickyStartState;
|
|
25
|
+
totalColSpan: number;
|
|
16
26
|
};
|
|
17
27
|
declare function useColumnOptions<T>(columnDefinitions: ColumnDefinitions<T>, options: UseColumnOptions): UseColumnOptionsResult<T>;
|
|
18
28
|
export { useColumnOptions };
|
|
29
|
+
export type { StickyStartState };
|
|
19
30
|
export type { UseColumnOptionsResult };
|
|
@@ -1,29 +1,47 @@
|
|
|
1
1
|
import { useMemo } from "react";
|
|
2
|
+
import { ACTION_CELL_WIDTH } from "../tr/DataTableTr.js";
|
|
2
3
|
function useColumnOptions(columnDefinitions, options) {
|
|
3
|
-
const { stickyColumns,
|
|
4
|
-
const
|
|
4
|
+
const { stickyColumns, hasSelection, hasDetailsPanel, layout } = options;
|
|
5
|
+
const hasStickyStart = (stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.start) === "1";
|
|
6
|
+
const stickyExpansion = hasStickyStart && hasDetailsPanel;
|
|
7
|
+
const stickySelection = hasStickyStart && hasSelection;
|
|
8
|
+
const stickySelectionOffset = stickyExpansion ? ACTION_CELL_WIDTH : 0;
|
|
9
|
+
const stickyFirstColumnOffset = (stickyExpansion ? ACTION_CELL_WIDTH : 0) +
|
|
10
|
+
(stickySelection ? ACTION_CELL_WIDTH : 0);
|
|
5
11
|
const columns = useMemo(() => {
|
|
6
12
|
return columnDefinitions.map((colDef, index) => {
|
|
7
|
-
const isFirstSticky =
|
|
8
|
-
const isLastSticky = (stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.
|
|
13
|
+
const isFirstSticky = hasStickyStart && index === 0;
|
|
14
|
+
const isLastSticky = (stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.end) === "1" && index === columnDefinitions.length - 1;
|
|
9
15
|
return {
|
|
10
16
|
isSticky: isFirstSticky
|
|
11
17
|
? "start"
|
|
12
18
|
: isLastSticky
|
|
13
19
|
? "end"
|
|
14
20
|
: false,
|
|
21
|
+
isStickyLast: isFirstSticky && !isLastSticky,
|
|
22
|
+
stickyLeftOffset: isFirstSticky ? stickyFirstColumnOffset : undefined,
|
|
15
23
|
colDef,
|
|
16
24
|
};
|
|
17
25
|
});
|
|
18
26
|
}, [
|
|
19
27
|
columnDefinitions,
|
|
20
|
-
|
|
21
|
-
stickyColumns
|
|
22
|
-
|
|
28
|
+
hasStickyStart,
|
|
29
|
+
stickyColumns,
|
|
30
|
+
stickyFirstColumnOffset,
|
|
23
31
|
]);
|
|
32
|
+
const totalColSpan = columns.length +
|
|
33
|
+
(layout === "fixed" ? 1 : 0) +
|
|
34
|
+
(hasSelection ? 1 : 0) +
|
|
35
|
+
(hasDetailsPanel ? 1 : 0);
|
|
24
36
|
return {
|
|
25
|
-
|
|
37
|
+
stickyStart: {
|
|
38
|
+
selection: stickySelection,
|
|
39
|
+
expansion: stickyExpansion,
|
|
40
|
+
selectionOffset: stickySelectionOffset,
|
|
41
|
+
firstColumnOffset: stickyFirstColumnOffset,
|
|
42
|
+
},
|
|
26
43
|
columns,
|
|
44
|
+
totalColSpan,
|
|
27
45
|
};
|
|
28
46
|
}
|
|
29
47
|
export { useColumnOptions };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColumnOptions.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useColumnOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"useColumnOptions.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useColumnOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAKhC,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AA8BtD,SAAS,gBAAgB,CACvB,iBAAuC,EACvC,OAAyB;IAEzB,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC;IAEzE,MAAM,cAAc,GAAG,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,MAAK,GAAG,CAAC;IAEpD,MAAM,eAAe,GAAG,cAAc,IAAI,eAAe,CAAC;IAC1D,MAAM,eAAe,GAAG,cAAc,IAAI,YAAY,CAAC;IAEvD,MAAM,qBAAqB,GAAG,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;IACtE,MAAM,uBAAuB,GAC3B,CAAC,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;QACzC,CAAC,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAE5C,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,OAAO,iBAAiB,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YAC7C,MAAM,aAAa,GAAG,cAAc,IAAI,KAAK,KAAK,CAAC,CAAC;YACpD,MAAM,YAAY,GAChB,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,GAAG,MAAK,GAAG,IAAI,KAAK,KAAK,iBAAiB,CAAC,MAAM,GAAG,CAAC,CAAC;YAEvE,OAAO;gBACL,QAAQ,EAAE,aAAa;oBACrB,CAAC,CAAE,OAAiB;oBACpB,CAAC,CAAC,YAAY;wBACZ,CAAC,CAAE,KAAe;wBAClB,CAAC,CAAE,KAAe;gBACtB,YAAY,EAAE,aAAa,IAAI,CAAC,YAAY;gBAC5C,gBAAgB,EAAE,aAAa,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,SAAS;gBACrE,MAAM;aACP,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,EAAE;QACD,iBAAiB;QACjB,cAAc;QACd,aAAa;QACb,uBAAuB;KACxB,CAAC,CAAC;IAEH,MAAM,YAAY,GAChB,OAAO,CAAC,MAAM;QACd,CAAC,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC5B,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACtB,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAE5B,OAAO;QACL,WAAW,EAAE;YACX,SAAS,EAAE,eAAe;YAC1B,SAAS,EAAE,eAAe;YAC1B,eAAe,EAAE,qBAAqB;YACtC,iBAAiB,EAAE,uBAAuB;SAC3C;QACD,OAAO;QACP,YAAY;KACb,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -12,7 +12,7 @@ function useGridCache(tableRef, enabled) {
|
|
|
12
12
|
dirty: true,
|
|
13
13
|
});
|
|
14
14
|
const [activeCell, setActiveCell] = useState(null);
|
|
15
|
-
const activeCellRef = useValueAsRef(activeCell)
|
|
15
|
+
const activeCellRef = useValueAsRef(activeCell);
|
|
16
16
|
const observerRef = useRef(null);
|
|
17
17
|
useEffect(() => {
|
|
18
18
|
if (!tableRef || !enabled) {
|
|
@@ -20,7 +20,7 @@ function useGridCache(tableRef, enabled) {
|
|
|
20
20
|
}
|
|
21
21
|
observerRef.current = new MutationObserver(() => {
|
|
22
22
|
gridCacheRef.current.dirty = true;
|
|
23
|
-
if (activeCellRef && !activeCellRef.isConnected) {
|
|
23
|
+
if (activeCellRef.current && !activeCellRef.current.isConnected) {
|
|
24
24
|
setActiveCell(null);
|
|
25
25
|
}
|
|
26
26
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGridCache.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useGridCache.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAkB,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9E;;;;GAIG;AACH,SAAS,YAAY,CAAC,QAAiC,EAAE,OAAgB;IACvE,MAAM,YAAY,GAAG,MAAM,CAAY;QACrC,IAAI,EAAE,IAAI;QACV,KAAK,EAAE,IAAI;KACZ,CAAC,CAAC;IAEH,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC,CAAC;IACnE,MAAM,aAAa,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC
|
|
1
|
+
{"version":3,"file":"useGridCache.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useGridCache.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAkB,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9E;;;;GAIG;AACH,SAAS,YAAY,CAAC,QAAiC,EAAE,OAAgB;IACvE,MAAM,YAAY,GAAG,MAAM,CAAY;QACrC,IAAI,EAAE,IAAI;QACV,KAAK,EAAE,IAAI;KACZ,CAAC,CAAC;IAEH,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC,CAAC;IACnE,MAAM,aAAa,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;IAChD,MAAM,WAAW,GAAG,MAAM,CAA0B,IAAI,CAAC,CAAC;IAE1D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ,IAAI,CAAC,OAAO,EAAE,CAAC;YAC1B,OAAO;QACT,CAAC;QAED,WAAW,CAAC,OAAO,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE;YAC9C,YAAY,CAAC,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC;YAElC,IAAI,aAAa,CAAC,OAAO,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;gBAChE,aAAa,CAAC,IAAI,CAAC,CAAC;YACtB,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,EAAE;YACpC,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,IAAI;YACf,UAAU,EAAE,IAAI;YAChB,eAAe,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,CAAC;SAC3D,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE;YACV,IAAI,WAAW,CAAC,OAAO,EAAE,CAAC;gBACxB,WAAW,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;gBACjC,WAAW,CAAC,OAAO,GAAG,IAAI,CAAC;YAC7B,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC;IAEvC;;;OAGG;IACH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO,EAAE,CAAC;YACZ,YAAY,CAAC,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC;QACpC,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,YAAY,GAAG,WAAW,CAAC,CAAC,SAA2B,EAAE,EAAE;QAC/D,IAAI,YAAY,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;YAC7D,YAAY,CAAC,OAAO,CAAC,IAAI,GAAG,iBAAiB,CAAC,SAAS,CAAC,CAAC;YACzD,YAAY,CAAC,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC;QACrC,CAAC;QAED,OAAO,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC;IACnC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO;QACL,YAAY;QACZ,UAAU;QACV,aAAa;KACd,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,YAAY,EAAE,CAAC"}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import type { TableRowEntryId } from "../root/DataTable.types.js";
|
|
2
3
|
type DetailsPanelProps<T> = {
|
|
3
4
|
/**
|
|
4
|
-
*
|
|
5
|
+
* Function to get the content to show in the details panel for a given row.
|
|
5
6
|
* When provided, an expand toggle column is added automatically.
|
|
6
7
|
*/
|
|
7
|
-
getContent
|
|
8
|
+
getContent: (rowData: T) => React.ReactNode;
|
|
8
9
|
/**
|
|
9
10
|
* Determines whether a row can be expanded to show details panel content.
|
|
10
11
|
* @default () => true
|
|
@@ -14,20 +15,16 @@ type DetailsPanelProps<T> = {
|
|
|
14
15
|
* Controlled list of expanded row IDs.
|
|
15
16
|
* Use with `onDetailsPanelChange` for controlled usage, or `defaultDetailsPanelRowIds` for uncontrolled.
|
|
16
17
|
*/
|
|
17
|
-
expandedRowIds?:
|
|
18
|
+
expandedRowIds?: TableRowEntryId[];
|
|
18
19
|
/**
|
|
19
20
|
* Initial list of expanded row IDs for uncontrolled usage.
|
|
20
21
|
* @default []
|
|
21
22
|
*/
|
|
22
|
-
defaultExpandedRowIds?:
|
|
23
|
+
defaultExpandedRowIds?: TableRowEntryId[];
|
|
23
24
|
/**
|
|
24
25
|
* Called when the list of expanded row IDs changes.
|
|
25
|
-
*
|
|
26
|
-
*
|
|
27
|
-
* TODO:
|
|
28
|
-
* - Docs: This pattern is called "Master / Detail" in general terms
|
|
29
26
|
*/
|
|
30
|
-
onExpandedRowIdsChange?: (ids:
|
|
27
|
+
onExpandedRowIdsChange?: (ids: TableRowEntryId[]) => void;
|
|
31
28
|
/**
|
|
32
29
|
* Returns the height (in px) or `"auto"` for a row's details panel.
|
|
33
30
|
* When a number is returned, the panel scrolls within that fixed height.
|
|
@@ -41,9 +38,9 @@ type DetailsPanelProps<T> = {
|
|
|
41
38
|
showExpandAll?: boolean;
|
|
42
39
|
};
|
|
43
40
|
type DataTableDetailsPanelContextT = {
|
|
44
|
-
isExpanded: (id:
|
|
45
|
-
isDetailsPanelExpandable: (id:
|
|
46
|
-
toggleExpansion: (id:
|
|
41
|
+
isExpanded: (id: TableRowEntryId) => boolean;
|
|
42
|
+
isDetailsPanelExpandable: (id: TableRowEntryId) => boolean;
|
|
43
|
+
toggleExpansion: (id: TableRowEntryId) => void;
|
|
47
44
|
toggleAll: () => void;
|
|
48
45
|
isAllExpanded: boolean;
|
|
49
46
|
getDetailsPanelContent?: (row: unknown) => React.ReactNode;
|
|
@@ -57,6 +54,6 @@ declare function DataTableDetailsPanelProvider<T>({ children, detailsPanel, }: {
|
|
|
57
54
|
} & {
|
|
58
55
|
children: React.ReactNode;
|
|
59
56
|
}): React.JSX.Element;
|
|
60
|
-
declare function getDataTableDetailsPanelId(tableId: string, rowId:
|
|
57
|
+
declare function getDataTableDetailsPanelId(tableId: string, rowId: TableRowEntryId): string;
|
|
61
58
|
export { DataTableDetailsPanelProvider, getDataTableDetailsPanelId, useDataTableDetailsPanel, };
|
|
62
59
|
export type { DetailsPanelProps };
|
|
@@ -1,21 +1,22 @@
|
|
|
1
1
|
import React, { useCallback } from "react";
|
|
2
2
|
import { createStrictContext } from "../../../utils/helpers/index.js";
|
|
3
3
|
import { useControllableState } from "../../../utils/hooks/index.js";
|
|
4
|
-
import {
|
|
4
|
+
import { useDataTableContext } from "../root/DataTableRoot.context.js";
|
|
5
5
|
const { Provider: DataTableDetailsPanelContextProvider, useContext: useDataTableDetailsPanel, } = createStrictContext({
|
|
6
6
|
name: "DataTableDetailsPanelContext",
|
|
7
7
|
errorMessage: "useDataTableDetailsPanel must be used within a DataTableDetailsPanelProvider.",
|
|
8
8
|
});
|
|
9
|
-
function DataTableDetailsPanelProvider({ children, detailsPanel
|
|
10
|
-
|
|
9
|
+
function DataTableDetailsPanelProvider({ children, detailsPanel, }) {
|
|
10
|
+
var _a;
|
|
11
|
+
const { expandedRowIds, defaultExpandedRowIds = [], onExpandedRowIdsChange, getContent, isRowExpandable, getHeight, showExpandAll = false, } = detailsPanel || {};
|
|
11
12
|
const [expandedIds, setExpandedIds] = useControllableState({
|
|
12
13
|
value: expandedRowIds,
|
|
13
14
|
defaultValue: defaultExpandedRowIds,
|
|
14
15
|
onChange: onExpandedRowIdsChange,
|
|
15
16
|
});
|
|
16
17
|
/* TODO: False is just fallback until auto and root is merged */
|
|
17
|
-
const
|
|
18
|
-
const { itemDetails } =
|
|
18
|
+
const tableContext = useDataTableContext(false);
|
|
19
|
+
const { itemDetails } = (_a = tableContext === null || tableContext === void 0 ? void 0 : tableContext.tableItems) !== null && _a !== void 0 ? _a : {
|
|
19
20
|
itemDetails: new Map(),
|
|
20
21
|
};
|
|
21
22
|
const expandableIds = React.useMemo(() => {
|
|
@@ -23,7 +24,7 @@ function DataTableDetailsPanelProvider({ children, detailsPanel = {}, }) {
|
|
|
23
24
|
return new Set();
|
|
24
25
|
}
|
|
25
26
|
const ids = new Set();
|
|
26
|
-
for (const
|
|
27
|
+
for (const { rowData, id, level } of itemDetails.values()) {
|
|
27
28
|
/* We only allow Master - Details pattern on top level rows */
|
|
28
29
|
if (level > 0) {
|
|
29
30
|
continue;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTableDetailsPanel.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableDetailsPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"useTableDetailsPanel.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableDetailsPanel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,30 +1,44 @@
|
|
|
1
|
-
import { type ItemDetail
|
|
1
|
+
import { type ItemDetail } from "../helpers/collectTableRowEntries.js";
|
|
2
|
+
import type { TableRowEntryId } from "../root/DataTable.types.js";
|
|
2
3
|
type SubRowsProps<T> = {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
/**
|
|
5
|
+
* Function to get sub-rows for a given row.
|
|
6
|
+
*/
|
|
7
|
+
getRows: (rowData: T) => T[];
|
|
8
|
+
/**
|
|
9
|
+
* Controlled list of IDs of rows that should be expanded.
|
|
10
|
+
*/
|
|
11
|
+
expandedRowIds?: TableRowEntryId[];
|
|
12
|
+
/**
|
|
13
|
+
* IDs of rows that should be initially expanded.
|
|
14
|
+
* Only used when `expandedRowIds` is not provided, i.e. when the expanded state is uncontrolled.
|
|
15
|
+
*/
|
|
16
|
+
defaultExpandedRowIds?: TableRowEntryId[];
|
|
17
|
+
/**
|
|
18
|
+
* Called when the list of expanded row IDs changes.
|
|
19
|
+
*/
|
|
20
|
+
onExpandedRowIdsChange?: (ids: TableRowEntryId[]) => void;
|
|
21
|
+
/**
|
|
22
|
+
* Function to get whether a row should be expandable.
|
|
23
|
+
* By default, all rows are expandable when `getRows` is provided.
|
|
24
|
+
*/
|
|
6
25
|
isRowExpandable?: (rowData: T) => boolean;
|
|
7
|
-
onExpandedRowIdsChange?: (ids: (string | number)[]) => void;
|
|
8
26
|
};
|
|
9
27
|
type UseTableItemsArgs<T> = {
|
|
10
28
|
items: T[];
|
|
11
|
-
getRowId
|
|
29
|
+
getRowId?: (rowData: T) => TableRowEntryId;
|
|
12
30
|
subRows?: SubRowsProps<T>;
|
|
13
31
|
};
|
|
14
|
-
type
|
|
32
|
+
type UseTableItemsReturn<T> = {
|
|
15
33
|
items: T[];
|
|
16
|
-
itemDetails: Map<
|
|
34
|
+
itemDetails: Map<TableRowEntryId, ItemDetail<T>>;
|
|
17
35
|
/** Row ids for the rows currently rendered in the table body. */
|
|
18
36
|
visibleRowIds: TableRowEntryId[];
|
|
19
37
|
/** Direct child ids for each row, used to traverse selection groups lazily. */
|
|
20
38
|
childRowIdsById: Map<TableRowEntryId, TableRowEntryId[]>;
|
|
21
|
-
onExpandedRowIdsChange: (id:
|
|
22
|
-
isSubRowExpanded: (id:
|
|
39
|
+
onExpandedRowIdsChange: (id: TableRowEntryId) => void;
|
|
40
|
+
isSubRowExpanded: (id: TableRowEntryId) => boolean;
|
|
23
41
|
};
|
|
24
|
-
declare function useTableItems<T>(args: UseTableItemsArgs<T>):
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
ref?: never;
|
|
28
|
-
}>, useTableItemsContext: <S extends boolean = true>(strict?: S | undefined) => S extends true ? Omit<useTableItemsReturn<any>, "childRowIdsById" | "visibleRowIds"> : Omit<useTableItemsReturn<any>, "childRowIdsById" | "visibleRowIds"> | undefined;
|
|
29
|
-
export { useTableItems, TableItemsProvider, useTableItemsContext };
|
|
30
|
-
export type { ItemDetail, SubRowsProps };
|
|
42
|
+
declare function useTableItems<T>(args: UseTableItemsArgs<T>): UseTableItemsReturn<T>;
|
|
43
|
+
export { useTableItems };
|
|
44
|
+
export type { ItemDetail, SubRowsProps, UseTableItemsReturn };
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { useCallback, useMemo } from "react";
|
|
2
|
-
import { createStrictContext } from "../../../utils/helpers/index.js";
|
|
3
2
|
import { useControllableState } from "../../../utils/hooks/index.js";
|
|
4
3
|
import { collectTableRowEntries, } from "../helpers/collectTableRowEntries.js";
|
|
5
4
|
function useTableItems(args) {
|
|
6
|
-
const { items, subRows
|
|
7
|
-
const { expandedRowIds, defaultExpandedRowIds, getRows, onExpandedRowIdsChange, isRowExpandable, } = subRows;
|
|
5
|
+
const { items, subRows, getRowId } = args;
|
|
6
|
+
const { expandedRowIds, defaultExpandedRowIds, getRows, onExpandedRowIdsChange, isRowExpandable, } = subRows || {};
|
|
8
7
|
const [nestedSubRowsExpandedIds, setNestedSubRowsExpandedIds] = useControllableState({
|
|
9
8
|
value: expandedRowIds,
|
|
10
9
|
defaultValue: defaultExpandedRowIds !== null && defaultExpandedRowIds !== void 0 ? defaultExpandedRowIds : [],
|
|
@@ -12,7 +11,7 @@ function useTableItems(args) {
|
|
|
12
11
|
});
|
|
13
12
|
const expandedIdsSet = useMemo(() => new Set(nestedSubRowsExpandedIds), [nestedSubRowsExpandedIds]);
|
|
14
13
|
const { itemDetails, visibleItems, visibleRowIds, childRowIdsById } = useMemo(() => {
|
|
15
|
-
const { itemDetails: rowEntriesMap, childRowIdsById: _childRowIdsById } = collectTableRowEntries({
|
|
14
|
+
const { itemDetails: rowEntriesMap, rootRowIds, childRowIdsById: _childRowIdsById, } = collectTableRowEntries({
|
|
16
15
|
items,
|
|
17
16
|
getRowId,
|
|
18
17
|
getRows,
|
|
@@ -20,24 +19,24 @@ function useTableItems(args) {
|
|
|
20
19
|
});
|
|
21
20
|
const localVisibleItems = [];
|
|
22
21
|
const localVisibleRowIds = [];
|
|
23
|
-
const addVisibleRows = (
|
|
24
|
-
const details = rowEntriesMap.get(
|
|
22
|
+
const addVisibleRows = (rowId) => {
|
|
23
|
+
const details = rowEntriesMap.get(rowId);
|
|
25
24
|
if (!details) {
|
|
26
25
|
return [];
|
|
27
26
|
}
|
|
28
|
-
localVisibleItems.push(rowData);
|
|
27
|
+
localVisibleItems.push(details.rowData);
|
|
29
28
|
localVisibleRowIds.push(details.id);
|
|
30
29
|
const visibleDescendantRowIds = [];
|
|
31
30
|
if (expandedIdsSet.has(details.id)) {
|
|
32
|
-
for (const
|
|
33
|
-
const childVisibleRowIds = addVisibleRows(
|
|
31
|
+
for (const childRowId of details.children) {
|
|
32
|
+
const childVisibleRowIds = addVisibleRows(childRowId);
|
|
34
33
|
visibleDescendantRowIds.push(...childVisibleRowIds);
|
|
35
34
|
}
|
|
36
35
|
}
|
|
37
36
|
return [details.id, ...visibleDescendantRowIds];
|
|
38
37
|
};
|
|
39
|
-
for (const
|
|
40
|
-
addVisibleRows(
|
|
38
|
+
for (const rowId of rootRowIds) {
|
|
39
|
+
addVisibleRows(rowId);
|
|
41
40
|
}
|
|
42
41
|
return {
|
|
43
42
|
visibleItems: localVisibleItems,
|
|
@@ -60,11 +59,5 @@ function useTableItems(args) {
|
|
|
60
59
|
isSubRowExpanded: (id) => expandedIdsSet.has(id),
|
|
61
60
|
};
|
|
62
61
|
}
|
|
63
|
-
|
|
64
|
-
/* TODO: Can we type this better? */
|
|
65
|
-
createStrictContext({
|
|
66
|
-
name: "TableItemsContext",
|
|
67
|
-
errorMessage: "useTableItemsContext must be used within a TableItemsProvider",
|
|
68
|
-
});
|
|
69
|
-
export { useTableItems, TableItemsProvider, useTableItemsContext };
|
|
62
|
+
export { useTableItems };
|
|
70
63
|
//# sourceMappingURL=useTableItems.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTableItems.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableItems.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"useTableItems.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableItems.ts"],"names":[],"mappings":"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"}
|