@navikt/ds-react 8.10.5 → 8.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js +0 -1
- package/cjs/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js.map +1 -1
- package/cjs/data/drag-and-drop/root/DragAndDropRoot.d.ts +6 -6
- package/cjs/data/drag-and-drop/root/DragAndDropRoot.js +6 -29
- package/cjs/data/drag-and-drop/root/DragAndDropRoot.js.map +1 -1
- package/cjs/data/stories/Data.test-data.d.ts +3 -6
- package/cjs/data/stories/Data.test-data.js +46 -59
- package/cjs/data/stories/Data.test-data.js.map +1 -1
- package/cjs/data/table/base-cell/DataTableBaseCell.d.ts +18 -18
- 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 +19 -13
- package/cjs/data/table/column-header/DataTableColumnHeader.js +26 -28
- 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 +30 -28
- 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 +2 -2
- package/cjs/data/table/helpers/selection/getMultipleSelectProps.d.ts +14 -11
- package/cjs/data/table/helpers/selection/getMultipleSelectProps.js +45 -51
- 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 +24 -32
- 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/hooks/useColumnOptions.d.ts +17 -6
- package/cjs/data/table/hooks/useColumnOptions.js +26 -8
- package/cjs/data/table/hooks/useColumnOptions.js.map +1 -1
- package/cjs/data/table/hooks/useTableDetailsPanel.d.ts +10 -14
- package/cjs/data/table/hooks/useTableDetailsPanel.js +6 -5
- package/cjs/data/table/hooks/useTableDetailsPanel.js.map +1 -1
- package/cjs/data/table/hooks/useTableItems.d.ts +32 -19
- package/cjs/data/table/hooks/useTableItems.js +13 -15
- 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 +1 -4
- package/cjs/data/table/hooks/useTableKeyboardNav.js.map +1 -1
- package/cjs/data/table/hooks/useTableSelection.d.ts +7 -6
- package/cjs/data/table/hooks/useTableSelection.js +52 -35
- package/cjs/data/table/hooks/useTableSelection.js.map +1 -1
- package/cjs/data/table/hooks/useTableSort.d.ts +15 -9
- package/cjs/data/table/hooks/useTableSort.js +9 -11
- package/cjs/data/table/hooks/useTableSort.js.map +1 -1
- package/cjs/data/table/index.d.ts +1 -1
- package/cjs/data/table/index.js +3 -23
- package/cjs/data/table/index.js.map +1 -1
- package/cjs/data/table/root/DataGridTable.types.d.ts +65 -0
- package/cjs/data/table/root/DataGridTable.types.js +3 -0
- package/cjs/data/table/root/DataGridTable.types.js.map +1 -0
- package/cjs/data/table/root/DataGridTableRoot.d.ts +104 -0
- package/cjs/data/table/root/DataGridTableRoot.js +237 -0
- package/cjs/data/table/root/DataGridTableRoot.js.map +1 -0
- package/cjs/data/table/root/DataTableRoot.context.d.ts +17 -7
- package/cjs/data/table/root/DataTableRoot.context.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 +7 -5
- package/cjs/data/table/tr/DataTableTr.js +69 -32
- package/cjs/data/table/tr/DataTableTr.js.map +1 -1
- package/cjs/data/token-filter/TokenFilter.d.ts +0 -6
- package/cjs/data/token-filter/TokenFilter.js +1 -1
- package/cjs/data-grid/index.d.ts +2 -0
- package/cjs/data-grid/index.js +9 -0
- package/cjs/data-grid/index.js.map +1 -0
- package/cjs/data-grid/root/DataGrid.types.d.ts +35 -0
- package/cjs/{data/table/root/DataTable.types.js → data-grid/root/DataGrid.types.js} +1 -1
- package/cjs/data-grid/root/DataGrid.types.js.map +1 -0
- package/cjs/data-grid/root/DataGridRoot.context.d.ts +16 -0
- package/cjs/data-grid/root/DataGridRoot.context.js +11 -0
- package/cjs/data-grid/root/DataGridRoot.context.js.map +1 -0
- package/cjs/data-grid/root/DataGridRoot.d.ts +89 -0
- package/cjs/data-grid/root/DataGridRoot.js +93 -0
- package/cjs/data-grid/root/DataGridRoot.js.map +1 -0
- package/cjs/preview.d.ts +1 -0
- package/cjs/preview.js +7 -0
- package/cjs/preview.js.map +1 -0
- package/cjs/table/ColumnHeader.js +2 -1
- package/cjs/table/ColumnHeader.js.map +1 -1
- package/esm/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js +0 -1
- package/esm/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js.map +1 -1
- package/esm/data/drag-and-drop/root/DragAndDropRoot.d.ts +6 -6
- package/esm/data/drag-and-drop/root/DragAndDropRoot.js +6 -29
- package/esm/data/drag-and-drop/root/DragAndDropRoot.js.map +1 -1
- package/esm/data/stories/Data.test-data.d.ts +3 -6
- package/esm/data/stories/Data.test-data.js +46 -59
- package/esm/data/stories/Data.test-data.js.map +1 -1
- package/esm/data/table/base-cell/DataTableBaseCell.d.ts +18 -18
- 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 +19 -13
- package/esm/data/table/column-header/DataTableColumnHeader.js +27 -29
- 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 +30 -28
- 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 +2 -2
- package/esm/data/table/helpers/selection/getMultipleSelectProps.d.ts +14 -11
- package/esm/data/table/helpers/selection/getMultipleSelectProps.js +45 -51
- 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 +24 -32
- 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/hooks/useColumnOptions.d.ts +17 -6
- package/esm/data/table/hooks/useColumnOptions.js +26 -8
- package/esm/data/table/hooks/useColumnOptions.js.map +1 -1
- package/esm/data/table/hooks/useTableDetailsPanel.d.ts +10 -14
- package/esm/data/table/hooks/useTableDetailsPanel.js +6 -5
- package/esm/data/table/hooks/useTableDetailsPanel.js.map +1 -1
- package/esm/data/table/hooks/useTableItems.d.ts +32 -19
- package/esm/data/table/hooks/useTableItems.js +14 -13
- 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 +1 -4
- package/esm/data/table/hooks/useTableKeyboardNav.js.map +1 -1
- package/esm/data/table/hooks/useTableSelection.d.ts +7 -6
- package/esm/data/table/hooks/useTableSelection.js +52 -35
- package/esm/data/table/hooks/useTableSelection.js.map +1 -1
- package/esm/data/table/hooks/useTableSort.d.ts +15 -9
- package/esm/data/table/hooks/useTableSort.js +10 -12
- package/esm/data/table/hooks/useTableSort.js.map +1 -1
- package/esm/data/table/index.d.ts +1 -1
- package/esm/data/table/index.js +1 -21
- package/esm/data/table/index.js.map +1 -1
- package/esm/data/table/root/DataGridTable.types.d.ts +65 -0
- package/esm/data/table/root/DataGridTable.types.js +2 -0
- package/esm/data/table/root/DataGridTable.types.js.map +1 -0
- package/esm/data/table/root/DataGridTableRoot.d.ts +104 -0
- package/esm/data/table/root/DataGridTableRoot.js +202 -0
- package/esm/data/table/root/DataGridTableRoot.js.map +1 -0
- package/esm/data/table/root/DataTableRoot.context.d.ts +17 -7
- package/esm/data/table/root/DataTableRoot.context.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 +7 -5
- package/esm/data/table/tr/DataTableTr.js +68 -32
- package/esm/data/table/tr/DataTableTr.js.map +1 -1
- package/esm/data/token-filter/TokenFilter.d.ts +0 -6
- package/esm/data/token-filter/TokenFilter.js +1 -1
- package/esm/data-grid/index.d.ts +2 -0
- package/esm/data-grid/index.js +4 -0
- package/esm/data-grid/index.js.map +1 -0
- package/esm/data-grid/root/DataGrid.types.d.ts +35 -0
- package/esm/data-grid/root/DataGrid.types.js +2 -0
- package/esm/data-grid/root/DataGrid.types.js.map +1 -0
- package/esm/data-grid/root/DataGridRoot.context.d.ts +16 -0
- package/esm/data-grid/root/DataGridRoot.context.js +7 -0
- package/esm/data-grid/root/DataGridRoot.context.js.map +1 -0
- package/esm/data-grid/root/DataGridRoot.d.ts +89 -0
- package/esm/data-grid/root/DataGridRoot.js +57 -0
- package/esm/data-grid/root/DataGridRoot.js.map +1 -0
- package/esm/preview.d.ts +1 -0
- package/esm/preview.js +3 -0
- package/esm/preview.js.map +1 -0
- package/esm/table/ColumnHeader.js +2 -1
- package/esm/table/ColumnHeader.js.map +1 -1
- package/package.json +23 -3
- package/src/data/drag-and-drop/drag-handler/DragAndDropDragHandler.tsx +0 -1
- package/src/data/drag-and-drop/root/DragAndDropRoot.tsx +18 -52
- package/src/data/stories/Data.test-data.tsx +76 -65
- package/src/data/table/base-cell/DataTableBaseCell.tsx +36 -26
- package/src/data/table/column-header/DataTableColumnHeader.tsx +62 -62
- package/src/data/table/column-header/useTableColumnResize.ts +63 -79
- package/src/data/table/details-panel-row/DataTableDetailsPanelRow.tsx +3 -3
- package/src/data/table/helpers/collectTableRowEntries.ts +1 -2
- package/src/data/table/helpers/selection/getMultipleSelectProps.ts +69 -83
- package/src/data/table/helpers/selection/getSingleSelectProps.ts +35 -17
- package/src/data/table/helpers/selection/selection.types.ts +23 -33
- 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/hooks/__tests__/useTableItems.test.ts +2 -1
- package/src/data/table/hooks/useColumnOptions.ts +49 -15
- package/src/data/table/hooks/useTableDetailsPanel.tsx +21 -28
- package/src/data/table/hooks/useTableItems.ts +60 -38
- package/src/data/table/hooks/useTableKeyboardNav.ts +1 -13
- package/src/data/table/hooks/useTableSelection.ts +80 -68
- package/src/data/table/hooks/useTableSort.ts +36 -23
- package/src/data/table/index.tsx +4 -21
- package/src/data/table/root/DataGridTable.types.ts +82 -0
- package/src/data/table/root/DataGridTableRoot.tsx +566 -0
- package/src/data/table/root/DataTableRoot.context.ts +24 -10
- package/src/data/table/sub-row-toggle/DataTableSubRowToggle.tsx +6 -5
- package/src/data/table/tbody/DataTableTbody.tsx +6 -2
- package/src/data/table/tr/DataTableTr.tsx +145 -47
- package/src/data/token-filter/TokenFilter.tsx +1 -1
- package/src/data-grid/index.ts +3 -0
- package/src/data-grid/root/DataGrid.types.ts +36 -0
- package/src/data-grid/root/DataGridRoot.context.ts +21 -0
- package/src/data-grid/root/DataGridRoot.tsx +152 -0
- package/src/preview.ts +2 -0
- package/src/table/ColumnHeader.tsx +3 -1
- package/cjs/data/drag-and-drop-legacy/drag-handler/DragAndDropDragHandlerLegacy.d.ts +0 -22
- package/cjs/data/drag-and-drop-legacy/drag-handler/DragAndDropDragHandlerLegacy.js +0 -35
- package/cjs/data/drag-and-drop-legacy/drag-handler/DragAndDropDragHandlerLegacy.js.map +0 -1
- package/cjs/data/drag-and-drop-legacy/item/DragAndDropItemLegacy.d.ts +0 -27
- package/cjs/data/drag-and-drop-legacy/item/DragAndDropItemLegacy.js +0 -86
- package/cjs/data/drag-and-drop-legacy/item/DragAndDropItemLegacy.js.map +0 -1
- package/cjs/data/drag-and-drop-legacy/root/DragAndDropLegacy.context.d.ts +0 -5
- package/cjs/data/drag-and-drop-legacy/root/DragAndDropLegacy.context.js +0 -6
- package/cjs/data/drag-and-drop-legacy/root/DragAndDropLegacy.context.js.map +0 -1
- package/cjs/data/drag-and-drop-legacy/root/DragAndDropLegacyRoot.d.ts +0 -24
- package/cjs/data/drag-and-drop-legacy/root/DragAndDropLegacyRoot.js +0 -108
- package/cjs/data/drag-and-drop-legacy/root/DragAndDropLegacyRoot.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/cjs/data/table/root/DataTable.types.d.ts +0 -63
- package/cjs/data/table/root/DataTable.types.js.map +0 -1
- package/cjs/data/table/root/DataTableRoot.d.ts +0 -141
- package/cjs/data/table/root/DataTableRoot.js +0 -229
- package/cjs/data/table/root/DataTableRoot.js.map +0 -1
- package/cjs/data/table/root/DataTableRoot.legacy.d.ts +0 -177
- package/cjs/data/table/root/DataTableRoot.legacy.js +0 -104
- package/cjs/data/table/root/DataTableRoot.legacy.js.map +0 -1
- package/esm/data/drag-and-drop-legacy/drag-handler/DragAndDropDragHandlerLegacy.d.ts +0 -22
- package/esm/data/drag-and-drop-legacy/drag-handler/DragAndDropDragHandlerLegacy.js +0 -29
- package/esm/data/drag-and-drop-legacy/drag-handler/DragAndDropDragHandlerLegacy.js.map +0 -1
- package/esm/data/drag-and-drop-legacy/item/DragAndDropItemLegacy.d.ts +0 -27
- package/esm/data/drag-and-drop-legacy/item/DragAndDropItemLegacy.js +0 -50
- package/esm/data/drag-and-drop-legacy/item/DragAndDropItemLegacy.js.map +0 -1
- package/esm/data/drag-and-drop-legacy/root/DragAndDropLegacy.context.d.ts +0 -5
- package/esm/data/drag-and-drop-legacy/root/DragAndDropLegacy.context.js +0 -3
- package/esm/data/drag-and-drop-legacy/root/DragAndDropLegacy.context.js.map +0 -1
- package/esm/data/drag-and-drop-legacy/root/DragAndDropLegacyRoot.d.ts +0 -24
- package/esm/data/drag-and-drop-legacy/root/DragAndDropLegacyRoot.js +0 -68
- package/esm/data/drag-and-drop-legacy/root/DragAndDropLegacyRoot.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/esm/data/table/root/DataTable.types.d.ts +0 -63
- package/esm/data/table/root/DataTable.types.js +0 -2
- package/esm/data/table/root/DataTable.types.js.map +0 -1
- package/esm/data/table/root/DataTableRoot.d.ts +0 -141
- package/esm/data/table/root/DataTableRoot.js +0 -193
- package/esm/data/table/root/DataTableRoot.js.map +0 -1
- package/esm/data/table/root/DataTableRoot.legacy.d.ts +0 -177
- package/esm/data/table/root/DataTableRoot.legacy.js +0 -59
- package/esm/data/table/root/DataTableRoot.legacy.js.map +0 -1
- package/src/data/drag-and-drop-legacy/drag-handler/DragAndDropDragHandlerLegacy.tsx +0 -104
- package/src/data/drag-and-drop-legacy/item/DragAndDropItemLegacy.tsx +0 -74
- package/src/data/drag-and-drop-legacy/root/DragAndDropLegacy.context.tsx +0 -11
- package/src/data/drag-and-drop-legacy/root/DragAndDropLegacyRoot.tsx +0 -94
- package/src/data/table/Readme.md +0 -11
- 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
- package/src/data/table/root/DataTable.types.ts +0 -87
- package/src/data/table/root/DataTableRoot.legacy.tsx +0 -297
- package/src/data/table/root/DataTableRoot.tsx +0 -562
- package/src/data/table/root/agent-feature-gap.md +0 -96
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import type { RadioInputProps } from "../../../../form/radio/radio-input/RadioInput";
|
|
2
|
-
type
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
import type { TableRowEntryId } from "../../root/DataGridTable.types";
|
|
3
|
+
import type { SelectionProps } from "./selection.types";
|
|
4
|
+
type GetSingleSelectPropsArgs<T> = {
|
|
5
|
+
selectedKeysSet: Set<TableRowEntryId>;
|
|
6
|
+
setSelectedKeys: (keys: string[]) => void;
|
|
6
7
|
name: string;
|
|
7
|
-
}
|
|
8
|
-
declare function getSingleSelectProps({ selectedKeysSet, setSelectedKeys,
|
|
9
|
-
getRowRadioProps: (key:
|
|
10
|
-
toggleSelection: (key:
|
|
8
|
+
} & Pick<SelectionProps<T>, "enableRowSelection">;
|
|
9
|
+
declare function getSingleSelectProps<T>({ selectedKeysSet, setSelectedKeys, name, enableRowSelection, }: GetSingleSelectPropsArgs<T>): {
|
|
10
|
+
getRowRadioProps: (key: TableRowEntryId, row: T) => RadioInputProps;
|
|
11
|
+
toggleSelection: (key: TableRowEntryId, row: T) => void;
|
|
11
12
|
};
|
|
12
13
|
export { getSingleSelectProps };
|
|
@@ -1,21 +1,34 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.getSingleSelectProps = getSingleSelectProps;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
4
|
+
const consoleWarning_1 = require("../../../../utils/helpers/consoleWarning");
|
|
5
|
+
const selection_utils_1 = require("./selection.utils");
|
|
6
|
+
function getSingleSelectProps({ selectedKeysSet, setSelectedKeys, name, enableRowSelection, }) {
|
|
7
|
+
const handleSelectionChange = (key, row) => {
|
|
8
|
+
if (!row) {
|
|
9
|
+
(0, consoleWarning_1.consoleWarning)(`DataGrid.Table: Row data is undefined for key ${key}. This may cause issues with selection if enableRowSelection is used.`);
|
|
10
|
+
}
|
|
11
|
+
if (!(0, selection_utils_1.canSelectTableRow)(enableRowSelection, { row, id: key })) {
|
|
7
12
|
return;
|
|
8
13
|
}
|
|
9
14
|
setSelectedKeys([key]);
|
|
10
15
|
};
|
|
11
16
|
return {
|
|
12
|
-
getRowRadioProps: (key) =>
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
17
|
+
getRowRadioProps: (key, row) => {
|
|
18
|
+
const isSelectionDisabled = !(0, selection_utils_1.canSelectTableRow)(enableRowSelection, {
|
|
19
|
+
row,
|
|
20
|
+
id: key,
|
|
21
|
+
});
|
|
22
|
+
return {
|
|
23
|
+
checked: selectedKeysSet.has(key),
|
|
24
|
+
onChange: isSelectionDisabled
|
|
25
|
+
? () => null
|
|
26
|
+
: () => handleSelectionChange(key, row),
|
|
27
|
+
disabled: isSelectionDisabled,
|
|
28
|
+
value: key,
|
|
29
|
+
name,
|
|
30
|
+
};
|
|
31
|
+
},
|
|
19
32
|
toggleSelection: handleSelectionChange,
|
|
20
33
|
};
|
|
21
34
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getSingleSelectProps.js","sourceRoot":"","sources":["../../../../../src/data/table/helpers/selection/getSingleSelectProps.ts"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"getSingleSelectProps.js","sourceRoot":"","sources":["../../../../../src/data/table/helpers/selection/getSingleSelectProps.ts"],"names":[],"mappings":";;AAoDS,oDAAoB;AAnD7B,6EAA0E;AAG1E,uDAAsD;AAQtD,SAAS,oBAAoB,CAAI,EAC/B,eAAe,EACf,eAAe,EACf,IAAI,EACJ,kBAAkB,GACU;IAC5B,MAAM,qBAAqB,GAAG,CAAC,GAAoB,EAAE,GAAM,EAAE,EAAE;QAC7D,IAAI,CAAC,GAAG,EAAE,CAAC;YACT,IAAA,+BAAc,EACZ,iDAAiD,GAAG,uEAAuE,CAC5H,CAAC;QACJ,CAAC;QACD,IAAI,CAAC,IAAA,mCAAiB,EAAC,kBAAkB,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC;YAC7D,OAAO;QACT,CAAC;QAED,eAAe,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO;QACL,gBAAgB,EAAE,CAAC,GAAoB,EAAE,GAAM,EAAmB,EAAE;YAClE,MAAM,mBAAmB,GAAG,CAAC,IAAA,mCAAiB,EAAC,kBAAkB,EAAE;gBACjE,GAAG;gBACH,EAAE,EAAE,GAAG;aACR,CAAC,CAAC;YAEH,OAAO;gBACL,OAAO,EAAE,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC;gBACjC,QAAQ,EAAE,mBAAmB;oBAC3B,CAAC,CAAC,GAAG,EAAE,CAAC,IAAI;oBACZ,CAAC,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,GAAG,EAAE,GAAG,CAAC;gBACzC,QAAQ,EAAE,mBAAmB;gBAC7B,KAAK,EAAE,GAAG;gBACV,IAAI;aACL,CAAC;QACJ,CAAC;QACD,eAAe,EAAE,qBAAqB;KACvC,CAAC;AACJ,CAAC"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import type { CheckboxInputProps } from "../../../../form/checkbox/checkbox-input/CheckboxInput";
|
|
2
2
|
import type { RadioInputProps } from "../../../../form/radio/radio-input/RadioInput";
|
|
3
|
-
type
|
|
4
|
-
type SelectionProps = {
|
|
3
|
+
type SelectionProps<T = unknown> = {
|
|
5
4
|
/**
|
|
6
5
|
* Enables selection of rows.
|
|
7
6
|
*
|
|
@@ -12,55 +11,48 @@ type SelectionProps = {
|
|
|
12
11
|
*
|
|
13
12
|
* @default "none"
|
|
14
13
|
*/
|
|
15
|
-
|
|
14
|
+
mode: "none" | "single" | "multiple";
|
|
16
15
|
/**
|
|
17
|
-
* Controlled selected keys. Should be used in conjunction with `
|
|
16
|
+
* Controlled selected keys. Should be used in conjunction with `onSelectedRowIdsChange`.
|
|
18
17
|
*/
|
|
19
|
-
|
|
18
|
+
selectedRowIds?: string[];
|
|
20
19
|
/**
|
|
21
20
|
* Default selected keys when using uncontrolled selection. Should not be used together with `selectedKeys`.
|
|
22
21
|
*/
|
|
23
|
-
|
|
22
|
+
defaultSelectedRowIds?: string[];
|
|
24
23
|
/**
|
|
25
24
|
* Callback with array of selected keys.
|
|
26
25
|
*/
|
|
27
|
-
|
|
26
|
+
onSelectedRowIdsChange?: (ids: string[]) => void;
|
|
28
27
|
/**
|
|
29
|
-
*
|
|
28
|
+
* Callback to determine if a row should be enabled for selection.
|
|
30
29
|
*
|
|
31
|
-
*
|
|
32
|
-
* TODO: Consider making this optionally a callback with (rowData:T) => boolean, to allow for more dynamic disabling of selection based on row data.
|
|
33
|
-
*/
|
|
34
|
-
disabledSelectionKeys?: SelectedKeysT;
|
|
35
|
-
/**
|
|
36
|
-
* If true, stops clicking a row from toggling its selection state. This can be used if you want to only allow selection through the checkboxes/radios, and not have the entire row be clickable for selection.
|
|
37
|
-
*
|
|
38
|
-
* @default false
|
|
30
|
+
* If set to a boolean, it will enable selection for all rows when true, and disable selection for all rows when false.
|
|
39
31
|
*/
|
|
40
|
-
|
|
32
|
+
enableRowSelection?: (({ row, id }: {
|
|
33
|
+
row: T;
|
|
34
|
+
id: string;
|
|
35
|
+
}) => boolean) | boolean;
|
|
41
36
|
};
|
|
42
37
|
type NoneSelection = {
|
|
43
|
-
|
|
44
|
-
selectedKeys:
|
|
45
|
-
disabledSelectionKeys: SelectedKeysT;
|
|
38
|
+
mode: "none";
|
|
39
|
+
selectedKeys: string[];
|
|
46
40
|
};
|
|
47
41
|
type SingleSelection = {
|
|
48
|
-
|
|
49
|
-
selectedKeys:
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
toggleSelection: (key: string | number) => void;
|
|
42
|
+
mode: "single";
|
|
43
|
+
selectedKeys: string[];
|
|
44
|
+
getRowRadioProps: (key: string, row: any) => RadioInputProps;
|
|
45
|
+
toggleSelection: (key: string, row: any) => void;
|
|
53
46
|
};
|
|
54
47
|
type MultipleSelection = {
|
|
55
|
-
|
|
56
|
-
selectedKeys:
|
|
57
|
-
disabledSelectionKeys: SelectedKeysT;
|
|
48
|
+
mode: "multiple";
|
|
49
|
+
selectedKeys: string[];
|
|
58
50
|
getTheadCheckboxProps: () => CheckboxInputProps;
|
|
59
|
-
getRowCheckboxProps: (key: string
|
|
60
|
-
toggleSelection: (key: string
|
|
51
|
+
getRowCheckboxProps: (key: string, row: any) => CheckboxInputProps;
|
|
52
|
+
toggleSelection: (key: string, row: any) => void;
|
|
61
53
|
};
|
|
62
54
|
type TableSelectionBase = {
|
|
63
|
-
isRowSelected: (rowId: string
|
|
55
|
+
isRowSelected: (rowId: string) => boolean;
|
|
64
56
|
};
|
|
65
57
|
type TableSelection = TableSelectionBase & (NoneSelection | SingleSelection | MultipleSelection);
|
|
66
|
-
export type { MultipleSelection, NoneSelection, SelectionProps, SingleSelection, TableSelection,
|
|
58
|
+
export type { MultipleSelection, NoneSelection, SelectionProps, SingleSelection, TableSelection, };
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { TableRowEntryId } from "../../root/DataGridTable.types";
|
|
2
|
+
import type { ItemDetail } from "../collectTableRowEntries";
|
|
3
|
+
import type { SelectionProps } from "./selection.types";
|
|
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,46 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.canSelectTableRow = canSelectTableRow;
|
|
4
|
+
exports.mutateRowSelection = mutateRowSelection;
|
|
5
|
+
function canSelectTableRow(enableRowSelection, args) {
|
|
6
|
+
if (typeof enableRowSelection === "function") {
|
|
7
|
+
return enableRowSelection(args);
|
|
8
|
+
}
|
|
9
|
+
return enableRowSelection !== null && enableRowSelection !== void 0 ? enableRowSelection : true;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Traverses the row and its children and updates selected-state directly on given selectedRowIds set.
|
|
13
|
+
* Returns true if any changes were made to the set, false otherwise.
|
|
14
|
+
*/
|
|
15
|
+
function mutateRowSelection({ selectedRowIds, rowId, checked, childRowIdsById, itemDetails, enableRowSelection, }) {
|
|
16
|
+
let changed = false;
|
|
17
|
+
const item = itemDetails.get(rowId);
|
|
18
|
+
if (item &&
|
|
19
|
+
canSelectTableRow(enableRowSelection, { row: item.rowData, id: rowId })) {
|
|
20
|
+
if (checked && !selectedRowIds.has(rowId)) {
|
|
21
|
+
selectedRowIds.add(rowId);
|
|
22
|
+
changed = true;
|
|
23
|
+
}
|
|
24
|
+
else if (!checked && selectedRowIds.has(rowId)) {
|
|
25
|
+
selectedRowIds.delete(rowId);
|
|
26
|
+
changed = true;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
const children = childRowIdsById.get(rowId);
|
|
30
|
+
if (children) {
|
|
31
|
+
for (const childId of children) {
|
|
32
|
+
if (mutateRowSelection({
|
|
33
|
+
selectedRowIds,
|
|
34
|
+
rowId: childId,
|
|
35
|
+
checked,
|
|
36
|
+
childRowIdsById,
|
|
37
|
+
itemDetails,
|
|
38
|
+
enableRowSelection,
|
|
39
|
+
})) {
|
|
40
|
+
changed = true;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
return changed;
|
|
45
|
+
}
|
|
46
|
+
//# 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":";;AAwES,8CAAiB;AAAE,gDAAkB;AApE9C,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"}
|
|
@@ -1,19 +1,30 @@
|
|
|
1
|
-
import type { ColumnDefinition, ColumnDefinitions } from "../root/
|
|
2
|
-
import type { SelectionProps } from "./useTableSelection";
|
|
1
|
+
import type { ColumnDefinition, ColumnDefinitions } from "../root/DataGridTable.types";
|
|
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 };
|
|
@@ -2,31 +2,49 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useColumnOptions = useColumnOptions;
|
|
4
4
|
const react_1 = require("react");
|
|
5
|
+
const DataTableTr_1 = require("../tr/DataTableTr");
|
|
5
6
|
function useColumnOptions(columnDefinitions, options) {
|
|
6
|
-
const { stickyColumns,
|
|
7
|
-
const
|
|
7
|
+
const { stickyColumns, hasSelection, hasDetailsPanel, layout } = options;
|
|
8
|
+
const hasStickyStart = (stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.start) === 1;
|
|
9
|
+
const stickyExpansion = hasStickyStart && hasDetailsPanel;
|
|
10
|
+
const stickySelection = hasStickyStart && hasSelection;
|
|
11
|
+
const stickySelectionOffset = stickyExpansion ? DataTableTr_1.ACTION_CELL_WIDTH : 0;
|
|
12
|
+
const stickyFirstColumnOffset = (stickyExpansion ? DataTableTr_1.ACTION_CELL_WIDTH : 0) +
|
|
13
|
+
(stickySelection ? DataTableTr_1.ACTION_CELL_WIDTH : 0);
|
|
8
14
|
const columns = (0, react_1.useMemo)(() => {
|
|
9
15
|
return columnDefinitions.map((colDef, index) => {
|
|
10
|
-
const isFirstSticky =
|
|
11
|
-
const isLastSticky = (stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.
|
|
16
|
+
const isFirstSticky = hasStickyStart && index === 0;
|
|
17
|
+
const isLastSticky = (stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.end) === 1 && index === columnDefinitions.length - 1;
|
|
12
18
|
return {
|
|
13
19
|
isSticky: isFirstSticky
|
|
14
20
|
? "start"
|
|
15
21
|
: isLastSticky
|
|
16
22
|
? "end"
|
|
17
23
|
: false,
|
|
24
|
+
isStickyLast: isFirstSticky && !isLastSticky,
|
|
25
|
+
stickyLeftOffset: isFirstSticky ? stickyFirstColumnOffset : undefined,
|
|
18
26
|
colDef,
|
|
19
27
|
};
|
|
20
28
|
});
|
|
21
29
|
}, [
|
|
22
30
|
columnDefinitions,
|
|
23
|
-
|
|
24
|
-
stickyColumns
|
|
25
|
-
|
|
31
|
+
hasStickyStart,
|
|
32
|
+
stickyColumns,
|
|
33
|
+
stickyFirstColumnOffset,
|
|
26
34
|
]);
|
|
35
|
+
const totalColSpan = columns.length +
|
|
36
|
+
(layout === "fixed" ? 1 : 0) +
|
|
37
|
+
(hasSelection ? 1 : 0) +
|
|
38
|
+
(hasDetailsPanel ? 1 : 0);
|
|
27
39
|
return {
|
|
28
|
-
|
|
40
|
+
stickyStart: {
|
|
41
|
+
selection: stickySelection,
|
|
42
|
+
expansion: stickyExpansion,
|
|
43
|
+
selectionOffset: stickySelectionOffset,
|
|
44
|
+
firstColumnOffset: stickyFirstColumnOffset,
|
|
45
|
+
},
|
|
29
46
|
columns,
|
|
47
|
+
totalColSpan,
|
|
30
48
|
};
|
|
31
49
|
}
|
|
32
50
|
//# sourceMappingURL=useColumnOptions.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColumnOptions.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useColumnOptions.ts"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"useColumnOptions.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useColumnOptions.ts"],"names":[],"mappings":";;AA6FS,4CAAgB;AA7FzB,iCAAgC;AAKhC,mDAAsD;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,CAAC,CAAC;IAElD,MAAM,eAAe,GAAG,cAAc,IAAI,eAAe,CAAC;IAC1D,MAAM,eAAe,GAAG,cAAc,IAAI,YAAY,CAAC;IAEvD,MAAM,qBAAqB,GAAG,eAAe,CAAC,CAAC,CAAC,+BAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;IACtE,MAAM,uBAAuB,GAC3B,CAAC,eAAe,CAAC,CAAC,CAAC,+BAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;QACzC,CAAC,eAAe,CAAC,CAAC,CAAC,+BAAiB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAE5C,MAAM,OAAO,GAAG,IAAA,eAAO,EAAC,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,CAAC,IAAI,KAAK,KAAK,iBAAiB,CAAC,MAAM,GAAG,CAAC,CAAC;YAErE,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"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
type DetailsPanelProps<T> = {
|
|
3
3
|
/**
|
|
4
|
-
*
|
|
4
|
+
* Function to get the content to show in the details panel for a given row.
|
|
5
5
|
* When provided, an expand toggle column is added automatically.
|
|
6
6
|
*/
|
|
7
|
-
getContent
|
|
7
|
+
getContent: (rowData: T) => React.ReactNode;
|
|
8
8
|
/**
|
|
9
9
|
* Determines whether a row can be expanded to show details panel content.
|
|
10
10
|
* @default () => true
|
|
@@ -12,22 +12,18 @@ type DetailsPanelProps<T> = {
|
|
|
12
12
|
isRowExpandable?: (rowData: T) => boolean;
|
|
13
13
|
/**
|
|
14
14
|
* Controlled list of expanded row IDs.
|
|
15
|
-
* Use with `
|
|
15
|
+
* Use with `onExpandedRowIdsChange` for controlled usage, or `defaultExpandedRowIds` for uncontrolled.
|
|
16
16
|
*/
|
|
17
|
-
expandedRowIds?:
|
|
17
|
+
expandedRowIds?: string[];
|
|
18
18
|
/**
|
|
19
19
|
* Initial list of expanded row IDs for uncontrolled usage.
|
|
20
20
|
* @default []
|
|
21
21
|
*/
|
|
22
|
-
defaultExpandedRowIds?:
|
|
22
|
+
defaultExpandedRowIds?: string[];
|
|
23
23
|
/**
|
|
24
24
|
* 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
25
|
*/
|
|
30
|
-
onExpandedRowIdsChange?: (ids:
|
|
26
|
+
onExpandedRowIdsChange?: (ids: string[]) => void;
|
|
31
27
|
/**
|
|
32
28
|
* Returns the height (in px) or `"auto"` for a row's details panel.
|
|
33
29
|
* When a number is returned, the panel scrolls within that fixed height.
|
|
@@ -41,9 +37,9 @@ type DetailsPanelProps<T> = {
|
|
|
41
37
|
showExpandAll?: boolean;
|
|
42
38
|
};
|
|
43
39
|
type DataTableDetailsPanelContextT = {
|
|
44
|
-
isExpanded: (id: string
|
|
45
|
-
isDetailsPanelExpandable: (id: string
|
|
46
|
-
toggleExpansion: (id: string
|
|
40
|
+
isExpanded: (id: string) => boolean;
|
|
41
|
+
isDetailsPanelExpandable: (id: string) => boolean;
|
|
42
|
+
toggleExpansion: (id: string) => void;
|
|
47
43
|
toggleAll: () => void;
|
|
48
44
|
isAllExpanded: boolean;
|
|
49
45
|
getDetailsPanelContent?: (row: unknown) => React.ReactNode;
|
|
@@ -57,6 +53,6 @@ declare function DataTableDetailsPanelProvider<T>({ children, detailsPanel, }: {
|
|
|
57
53
|
} & {
|
|
58
54
|
children: React.ReactNode;
|
|
59
55
|
}): React.JSX.Element;
|
|
60
|
-
declare function getDataTableDetailsPanelId(tableId: string, rowId: string
|
|
56
|
+
declare function getDataTableDetailsPanelId(tableId: string, rowId: string): string;
|
|
61
57
|
export { DataTableDetailsPanelProvider, getDataTableDetailsPanelId, useDataTableDetailsPanel, };
|
|
62
58
|
export type { DetailsPanelProps };
|
|
@@ -39,22 +39,23 @@ exports.getDataTableDetailsPanelId = getDataTableDetailsPanelId;
|
|
|
39
39
|
const react_1 = __importStar(require("react"));
|
|
40
40
|
const helpers_1 = require("../../../utils/helpers");
|
|
41
41
|
const hooks_1 = require("../../../utils/hooks");
|
|
42
|
-
const
|
|
42
|
+
const DataTableRoot_context_1 = require("../root/DataTableRoot.context");
|
|
43
43
|
const { Provider: DataTableDetailsPanelContextProvider, useContext: useDataTableDetailsPanel, } = (0, helpers_1.createStrictContext)({
|
|
44
44
|
name: "DataTableDetailsPanelContext",
|
|
45
45
|
errorMessage: "useDataTableDetailsPanel must be used within a DataTableDetailsPanelProvider.",
|
|
46
46
|
});
|
|
47
47
|
exports.useDataTableDetailsPanel = useDataTableDetailsPanel;
|
|
48
|
-
function DataTableDetailsPanelProvider({ children, detailsPanel
|
|
49
|
-
|
|
48
|
+
function DataTableDetailsPanelProvider({ children, detailsPanel, }) {
|
|
49
|
+
var _a;
|
|
50
|
+
const { expandedRowIds, defaultExpandedRowIds = [], onExpandedRowIdsChange, getContent, isRowExpandable, getHeight, showExpandAll = false, } = detailsPanel || {};
|
|
50
51
|
const [expandedIds, setExpandedIds] = (0, hooks_1.useControllableState)({
|
|
51
52
|
value: expandedRowIds,
|
|
52
53
|
defaultValue: defaultExpandedRowIds,
|
|
53
54
|
onChange: onExpandedRowIdsChange,
|
|
54
55
|
});
|
|
55
56
|
/* TODO: False is just fallback until auto and root is merged */
|
|
56
|
-
const
|
|
57
|
-
const { itemDetails } =
|
|
57
|
+
const tableContext = (0, DataTableRoot_context_1.useDataTableContext)(false);
|
|
58
|
+
const { itemDetails } = (_a = tableContext === null || tableContext === void 0 ? void 0 : tableContext.tableItems) !== null && _a !== void 0 ? _a : {
|
|
58
59
|
itemDetails: new Map(),
|
|
59
60
|
};
|
|
60
61
|
const expandableIds = react_1.default.useMemo(() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTableDetailsPanel.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableDetailsPanel.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"useTableDetailsPanel.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableDetailsPanel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,30 +1,43 @@
|
|
|
1
|
-
import { type ItemDetail
|
|
1
|
+
import { type ItemDetail } from "../helpers/collectTableRowEntries";
|
|
2
2
|
type SubRowsProps<T> = {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Function to get sub-rows for a given row.
|
|
5
|
+
*/
|
|
6
|
+
getRows: (rowData: T) => T[];
|
|
7
|
+
/**
|
|
8
|
+
* Controlled list of IDs of rows that should be expanded.
|
|
9
|
+
*/
|
|
10
|
+
expandedRowIds?: string[];
|
|
11
|
+
/**
|
|
12
|
+
* IDs of rows that should be initially expanded.
|
|
13
|
+
* Only used when `expandedRowIds` is not provided, i.e. when the expanded state is uncontrolled.
|
|
14
|
+
*/
|
|
15
|
+
defaultExpandedRowIds?: string[];
|
|
16
|
+
/**
|
|
17
|
+
* Called when the list of expanded row IDs changes.
|
|
18
|
+
*/
|
|
19
|
+
onExpandedRowIdsChange?: (ids: string[]) => void;
|
|
20
|
+
/**
|
|
21
|
+
* Determines whether a row should be expandable.
|
|
22
|
+
* By default, all rows are expandable when `getRows` is provided.
|
|
23
|
+
*/
|
|
6
24
|
isRowExpandable?: (rowData: T) => boolean;
|
|
7
|
-
onExpandedRowIdsChange?: (ids: (string | number)[]) => void;
|
|
8
25
|
};
|
|
9
26
|
type UseTableItemsArgs<T> = {
|
|
10
27
|
items: T[];
|
|
11
|
-
getRowId?: (rowData: T) =>
|
|
28
|
+
getRowId?: (rowData: T) => string;
|
|
12
29
|
subRows?: SubRowsProps<T>;
|
|
13
30
|
};
|
|
14
|
-
type
|
|
31
|
+
type UseTableItemsReturn<T> = {
|
|
15
32
|
items: T[];
|
|
16
|
-
itemDetails: Map<
|
|
33
|
+
itemDetails: Map<string, ItemDetail<T>>;
|
|
17
34
|
/** Row ids for the rows currently rendered in the table body. */
|
|
18
|
-
visibleRowIds:
|
|
35
|
+
visibleRowIds: string[];
|
|
19
36
|
/** Direct child ids for each row, used to traverse selection groups lazily. */
|
|
20
|
-
childRowIdsById: Map<
|
|
21
|
-
onExpandedRowIdsChange: (id: string
|
|
22
|
-
isSubRowExpanded: (id: string
|
|
37
|
+
childRowIdsById: Map<string, string[]>;
|
|
38
|
+
onExpandedRowIdsChange: (id: string) => void;
|
|
39
|
+
isSubRowExpanded: (id: string) => boolean;
|
|
23
40
|
};
|
|
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"> : Omit<useTableItemsReturn<any>, "childRowIdsById"> | undefined;
|
|
29
|
-
export { useTableItems, TableItemsProvider, useTableItemsContext };
|
|
30
|
-
export type { ItemDetail, SubRowsProps };
|
|
41
|
+
declare function useTableItems<T>(args: UseTableItemsArgs<T>): UseTableItemsReturn<T>;
|
|
42
|
+
export { useTableItems };
|
|
43
|
+
export type { ItemDetail, SubRowsProps, UseTableItemsReturn };
|
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useTableItemsContext = exports.TableItemsProvider = void 0;
|
|
4
3
|
exports.useTableItems = useTableItems;
|
|
5
4
|
const react_1 = require("react");
|
|
6
|
-
const helpers_1 = require("../../../utils/helpers");
|
|
7
5
|
const hooks_1 = require("../../../utils/hooks");
|
|
8
6
|
const collectTableRowEntries_1 = require("../helpers/collectTableRowEntries");
|
|
9
7
|
function useTableItems(args) {
|
|
10
|
-
const { items, subRows
|
|
11
|
-
const { expandedRowIds, defaultExpandedRowIds, getRows, onExpandedRowIdsChange, isRowExpandable, } = subRows;
|
|
8
|
+
const { items, subRows, getRowId } = args;
|
|
9
|
+
const { expandedRowIds, defaultExpandedRowIds, getRows, onExpandedRowIdsChange, isRowExpandable, } = subRows || {};
|
|
12
10
|
const [nestedSubRowsExpandedIds, setNestedSubRowsExpandedIds] = (0, hooks_1.useControllableState)({
|
|
13
11
|
value: expandedRowIds,
|
|
14
12
|
defaultValue: defaultExpandedRowIds !== null && defaultExpandedRowIds !== void 0 ? defaultExpandedRowIds : [],
|
|
@@ -55,21 +53,21 @@ function useTableItems(args) {
|
|
|
55
53
|
? prev.filter((expandedId) => expandedId !== id)
|
|
56
54
|
: [...prev, id]);
|
|
57
55
|
}, [setNestedSubRowsExpandedIds]);
|
|
58
|
-
|
|
56
|
+
const isSubRowExpanded = (0, react_1.useCallback)((id) => expandedIdsSet.has(id), [expandedIdsSet]);
|
|
57
|
+
return (0, react_1.useMemo)(() => ({
|
|
59
58
|
items: visibleItems,
|
|
60
59
|
itemDetails,
|
|
61
60
|
visibleRowIds,
|
|
62
61
|
childRowIdsById,
|
|
63
62
|
onExpandedRowIdsChange: handleExpandedSubRowIdChange,
|
|
64
|
-
isSubRowExpanded
|
|
65
|
-
}
|
|
63
|
+
isSubRowExpanded,
|
|
64
|
+
}), [
|
|
65
|
+
visibleItems,
|
|
66
|
+
itemDetails,
|
|
67
|
+
visibleRowIds,
|
|
68
|
+
childRowIdsById,
|
|
69
|
+
handleExpandedSubRowIdChange,
|
|
70
|
+
isSubRowExpanded,
|
|
71
|
+
]);
|
|
66
72
|
}
|
|
67
|
-
const { Provider: TableItemsProvider, useContext: useTableItemsContext } =
|
|
68
|
-
/* TODO: Can we type this better? */
|
|
69
|
-
(0, helpers_1.createStrictContext)({
|
|
70
|
-
name: "TableItemsContext",
|
|
71
|
-
errorMessage: "useTableItemsContext must be used within a TableItemsProvider",
|
|
72
|
-
});
|
|
73
|
-
exports.TableItemsProvider = TableItemsProvider;
|
|
74
|
-
exports.useTableItemsContext = useTableItemsContext;
|
|
75
73
|
//# sourceMappingURL=useTableItems.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTableItems.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableItems.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useTableItems.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableItems.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,12 +1,7 @@
|
|
|
1
1
|
type UseTableKeyboardNavOptions = {
|
|
2
2
|
enabled: boolean;
|
|
3
|
-
/**
|
|
4
|
-
* Custom callback to determine if navigation should be blocked.
|
|
5
|
-
* Called before default blocking logic.
|
|
6
|
-
*/
|
|
7
|
-
shouldBlockNavigation?: (event: KeyboardEvent) => boolean;
|
|
8
3
|
};
|
|
9
|
-
declare function useTableKeyboardNav({ enabled
|
|
4
|
+
declare function useTableKeyboardNav({ enabled }: UseTableKeyboardNavOptions): {
|
|
10
5
|
tabIndex: number | undefined;
|
|
11
6
|
setTableRef: import("react").Dispatch<import("react").SetStateAction<HTMLTableElement | null>>;
|
|
12
7
|
};
|
|
@@ -8,7 +8,7 @@ const table_focus_1 = require("../helpers/table-focus");
|
|
|
8
8
|
const table_grid_nav_1 = require("../helpers/table-grid-nav");
|
|
9
9
|
const table_keyboard_1 = require("../helpers/table-keyboard");
|
|
10
10
|
const useGridCache_1 = require("./useGridCache");
|
|
11
|
-
function useTableKeyboardNav({ enabled
|
|
11
|
+
function useTableKeyboardNav({ enabled }) {
|
|
12
12
|
const [tableRef, setTableRef] = (0, react_1.useState)(null);
|
|
13
13
|
const { getTableGrid, activeCell, setActiveCell } = (0, useGridCache_1.useGridCache)(tableRef, enabled);
|
|
14
14
|
/**
|
|
@@ -67,9 +67,6 @@ function useTableKeyboardNav({ enabled, shouldBlockNavigation: customBlockFn, })
|
|
|
67
67
|
* Checks if navigation should be blocked based on current focus context.
|
|
68
68
|
*/
|
|
69
69
|
const handleTableKeyDown = (0, hooks_1.useEventCallback)((event) => {
|
|
70
|
-
if (customBlockFn === null || customBlockFn === void 0 ? void 0 : customBlockFn(event)) {
|
|
71
|
-
return;
|
|
72
|
-
}
|
|
73
70
|
const action = (0, table_keyboard_1.getNavigationAction)(event);
|
|
74
71
|
if (!action) {
|
|
75
72
|
return;
|