@navikt/ds-react 8.8.0 → 8.9.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.d.ts +12 -0
- package/cjs/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js +57 -0
- package/cjs/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js.map +1 -0
- package/cjs/data/drag-and-drop/item/DragAndDropItem.d.ts +27 -0
- package/cjs/data/drag-and-drop/item/DragAndDropItem.js +52 -0
- package/cjs/data/drag-and-drop/item/DragAndDropItem.js.map +1 -0
- package/cjs/data/drag-and-drop/root/DragAndDrop.context.d.ts +16 -0
- package/cjs/data/drag-and-drop/root/DragAndDrop.context.js +10 -0
- package/cjs/data/drag-and-drop/root/DragAndDrop.context.js.map +1 -0
- package/cjs/data/drag-and-drop/root/{DataDragAndDropRoot.d.ts → DragAndDropRoot.d.ts} +11 -9
- package/cjs/data/drag-and-drop/root/DragAndDropRoot.js +187 -0
- package/cjs/data/drag-and-drop/root/DragAndDropRoot.js.map +1 -0
- package/cjs/data/drag-and-drop/types.d.ts +4 -0
- package/cjs/data/drag-and-drop/types.js +3 -0
- package/cjs/data/drag-and-drop/types.js.map +1 -0
- package/cjs/data/table/helpers/selection/getMultipleSelectProps.d.ts +14 -0
- package/cjs/data/table/helpers/selection/getMultipleSelectProps.js +48 -0
- package/cjs/data/table/helpers/selection/getMultipleSelectProps.js.map +1 -0
- package/cjs/data/table/helpers/selection/getSingleSelectProps.d.ts +10 -0
- package/cjs/data/table/helpers/selection/getSingleSelectProps.js +23 -0
- package/cjs/data/table/helpers/selection/getSingleSelectProps.js.map +1 -0
- package/cjs/data/table/helpers/selection/selection.types.d.ts +42 -0
- package/cjs/data/table/helpers/selection/selection.types.js +3 -0
- package/cjs/data/table/helpers/selection/selection.types.js.map +1 -0
- package/cjs/data/table/{root → hooks}/useTableKeyboardNav.js +1 -1
- package/cjs/data/table/hooks/useTableKeyboardNav.js.map +1 -0
- package/cjs/data/table/hooks/useTableSelection.d.ts +8 -0
- package/cjs/data/table/hooks/useTableSelection.js +49 -0
- package/cjs/data/table/hooks/useTableSelection.js.map +1 -0
- package/cjs/data/table/root/DataTableAuto.d.ts +4 -4
- package/cjs/data/table/root/DataTableAuto.js +24 -10
- package/cjs/data/table/root/DataTableAuto.js.map +1 -1
- package/cjs/data/table/root/DataTableRoot.d.ts +1 -1
- package/cjs/data/table/root/DataTableRoot.js +1 -1
- package/cjs/data/table/root/DataTableRoot.js.map +1 -1
- package/cjs/data/token-filter/AutoSuggest.js +37 -4
- package/cjs/data/token-filter/AutoSuggest.js.map +1 -1
- package/cjs/data/token-filter/TokenFilter.d.ts +1 -0
- package/cjs/data/token-filter/TokenFilter.js +1 -0
- package/cjs/data/token-filter/TokenFilter.js.map +1 -1
- package/cjs/data/toolbar/root/DataToolbarRoot.d.ts +6 -23
- package/cjs/data/toolbar/root/DataToolbarRoot.js +42 -7
- package/cjs/data/toolbar/root/DataToolbarRoot.js.map +1 -1
- package/cjs/date/Date.Input.js +8 -9
- package/cjs/date/Date.Input.js.map +1 -1
- package/cjs/date/datepicker/hooks/useDatepicker.js +4 -3
- package/cjs/date/datepicker/hooks/useDatepicker.js.map +1 -1
- package/cjs/date/monthpicker/hooks/useMonthPicker.js +3 -2
- package/cjs/date/monthpicker/hooks/useMonthPicker.js.map +1 -1
- package/cjs/internal-header/InternalHeaderButton.d.ts +5 -0
- package/cjs/internal-header/InternalHeaderButton.js +2 -2
- package/cjs/internal-header/InternalHeaderButton.js.map +1 -1
- package/cjs/utils/components/Listbox/group/ListboxGroup.js +2 -1
- package/cjs/utils/components/Listbox/group/ListboxGroup.js.map +1 -1
- package/esm/data/drag-and-drop/drag-handler/DragAndDropDragHandler.d.ts +12 -0
- package/esm/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js +51 -0
- package/esm/data/drag-and-drop/drag-handler/DragAndDropDragHandler.js.map +1 -0
- package/esm/data/drag-and-drop/item/DragAndDropItem.d.ts +27 -0
- package/esm/data/drag-and-drop/item/DragAndDropItem.js +46 -0
- package/esm/data/drag-and-drop/item/DragAndDropItem.js.map +1 -0
- package/esm/data/drag-and-drop/root/DragAndDrop.context.d.ts +16 -0
- package/esm/data/drag-and-drop/root/DragAndDrop.context.js +6 -0
- package/esm/data/drag-and-drop/root/DragAndDrop.context.js.map +1 -0
- package/esm/data/drag-and-drop/root/{DataDragAndDropRoot.d.ts → DragAndDropRoot.d.ts} +11 -9
- package/esm/data/drag-and-drop/root/DragAndDropRoot.js +147 -0
- package/esm/data/drag-and-drop/root/DragAndDropRoot.js.map +1 -0
- package/esm/data/drag-and-drop/types.d.ts +4 -0
- package/esm/data/drag-and-drop/types.js +2 -0
- package/esm/data/drag-and-drop/types.js.map +1 -0
- package/esm/data/table/helpers/selection/getMultipleSelectProps.d.ts +14 -0
- package/esm/data/table/helpers/selection/getMultipleSelectProps.js +46 -0
- package/esm/data/table/helpers/selection/getMultipleSelectProps.js.map +1 -0
- package/esm/data/table/helpers/selection/getSingleSelectProps.d.ts +10 -0
- package/esm/data/table/helpers/selection/getSingleSelectProps.js +21 -0
- package/esm/data/table/helpers/selection/getSingleSelectProps.js.map +1 -0
- package/esm/data/table/helpers/selection/selection.types.d.ts +42 -0
- package/esm/data/table/helpers/selection/selection.types.js +2 -0
- package/esm/data/table/helpers/selection/selection.types.js.map +1 -0
- package/esm/data/table/{root → hooks}/useTableKeyboardNav.js +1 -1
- package/esm/data/table/hooks/useTableKeyboardNav.js.map +1 -0
- package/esm/data/table/hooks/useTableSelection.d.ts +8 -0
- package/esm/data/table/hooks/useTableSelection.js +47 -0
- package/esm/data/table/hooks/useTableSelection.js.map +1 -0
- package/esm/data/table/root/DataTableAuto.d.ts +4 -4
- package/esm/data/table/root/DataTableAuto.js +24 -10
- package/esm/data/table/root/DataTableAuto.js.map +1 -1
- package/esm/data/table/root/DataTableRoot.d.ts +1 -1
- package/esm/data/table/root/DataTableRoot.js +1 -1
- package/esm/data/table/root/DataTableRoot.js.map +1 -1
- package/esm/data/token-filter/AutoSuggest.js +38 -5
- package/esm/data/token-filter/AutoSuggest.js.map +1 -1
- package/esm/data/token-filter/TokenFilter.d.ts +1 -0
- package/esm/data/token-filter/TokenFilter.js +1 -0
- package/esm/data/token-filter/TokenFilter.js.map +1 -1
- package/esm/data/toolbar/root/DataToolbarRoot.d.ts +6 -23
- package/esm/data/toolbar/root/DataToolbarRoot.js +9 -7
- package/esm/data/toolbar/root/DataToolbarRoot.js.map +1 -1
- package/esm/date/Date.Input.js +9 -10
- package/esm/date/Date.Input.js.map +1 -1
- package/esm/date/datepicker/hooks/useDatepicker.js +4 -3
- package/esm/date/datepicker/hooks/useDatepicker.js.map +1 -1
- package/esm/date/monthpicker/hooks/useMonthPicker.js +3 -2
- package/esm/date/monthpicker/hooks/useMonthPicker.js.map +1 -1
- package/esm/internal-header/InternalHeaderButton.d.ts +5 -0
- package/esm/internal-header/InternalHeaderButton.js +2 -2
- package/esm/internal-header/InternalHeaderButton.js.map +1 -1
- package/esm/utils/components/Listbox/group/ListboxGroup.js +2 -1
- package/esm/utils/components/Listbox/group/ListboxGroup.js.map +1 -1
- package/package.json +4 -4
- package/src/data/drag-and-drop/drag-handler/DragAndDropDragHandler.tsx +90 -0
- package/src/data/drag-and-drop/item/DragAndDropItem.tsx +71 -0
- package/src/data/drag-and-drop/root/DragAndDrop.context.tsx +25 -0
- package/src/data/drag-and-drop/root/DragAndDropRoot.tsx +245 -0
- package/src/data/drag-and-drop/types.ts +4 -0
- package/src/data/table/helpers/selection/getMultipleSelectProps.ts +70 -0
- package/src/data/table/helpers/selection/getSingleSelectProps.ts +33 -0
- package/src/data/table/helpers/selection/selection.types.ts +56 -0
- package/src/data/table/hooks/__tests__/useTableSelection.test.ts +327 -0
- package/src/data/table/{root → hooks}/useTableKeyboardNav.ts +1 -1
- package/src/data/table/hooks/useTableSelection.ts +78 -0
- package/src/data/table/root/DataTableAuto.tsx +46 -23
- package/src/data/table/root/DataTableRoot.tsx +2 -2
- package/src/data/token-filter/AutoSuggest.tsx +65 -3
- package/src/data/token-filter/TokenFilter.tsx +1 -0
- package/src/data/toolbar/root/DataToolbarRoot.tsx +29 -32
- package/src/date/Date.Input.tsx +17 -16
- package/src/date/datepicker/hooks/useDatepicker.tsx +4 -5
- package/src/date/monthpicker/hooks/useMonthPicker.tsx +3 -4
- package/src/internal-header/InternalHeaderButton.tsx +18 -9
- package/src/utils/components/Listbox/group/ListboxGroup.tsx +9 -2
- package/cjs/data/action-bar/root/DataActionBarRoot.d.ts +0 -27
- package/cjs/data/action-bar/root/DataActionBarRoot.js +0 -49
- package/cjs/data/action-bar/root/DataActionBarRoot.js.map +0 -1
- package/cjs/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.d.ts +0 -21
- package/cjs/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.js +0 -24
- package/cjs/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.js.map +0 -1
- package/cjs/data/drag-and-drop/item/DataDragAndDropItem.d.ts +0 -27
- package/cjs/data/drag-and-drop/item/DataDragAndDropItem.js +0 -41
- package/cjs/data/drag-and-drop/item/DataDragAndDropItem.js.map +0 -1
- package/cjs/data/drag-and-drop/root/DataDragAndDrop.context.d.ts +0 -8
- package/cjs/data/drag-and-drop/root/DataDragAndDrop.context.js +0 -10
- package/cjs/data/drag-and-drop/root/DataDragAndDrop.context.js.map +0 -1
- package/cjs/data/drag-and-drop/root/DataDragAndDropRoot.js +0 -61
- package/cjs/data/drag-and-drop/root/DataDragAndDropRoot.js.map +0 -1
- package/cjs/data/table/root/useTableKeyboardNav.js.map +0 -1
- package/cjs/data/table/root/useTableSelection.d.ts +0 -55
- package/cjs/data/table/root/useTableSelection.js +0 -79
- package/cjs/data/table/root/useTableSelection.js.map +0 -1
- package/esm/data/action-bar/root/DataActionBarRoot.d.ts +0 -27
- package/esm/data/action-bar/root/DataActionBarRoot.js +0 -43
- package/esm/data/action-bar/root/DataActionBarRoot.js.map +0 -1
- package/esm/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.d.ts +0 -21
- package/esm/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.js +0 -18
- package/esm/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.js.map +0 -1
- package/esm/data/drag-and-drop/item/DataDragAndDropItem.d.ts +0 -27
- package/esm/data/drag-and-drop/item/DataDragAndDropItem.js +0 -35
- package/esm/data/drag-and-drop/item/DataDragAndDropItem.js.map +0 -1
- package/esm/data/drag-and-drop/root/DataDragAndDrop.context.d.ts +0 -8
- package/esm/data/drag-and-drop/root/DataDragAndDrop.context.js +0 -6
- package/esm/data/drag-and-drop/root/DataDragAndDrop.context.js.map +0 -1
- package/esm/data/drag-and-drop/root/DataDragAndDropRoot.js +0 -21
- package/esm/data/drag-and-drop/root/DataDragAndDropRoot.js.map +0 -1
- package/esm/data/table/root/useTableKeyboardNav.js.map +0 -1
- package/esm/data/table/root/useTableSelection.d.ts +0 -55
- package/esm/data/table/root/useTableSelection.js +0 -77
- package/esm/data/table/root/useTableSelection.js.map +0 -1
- package/src/data/action-bar/root/DataActionBarRoot.tsx +0 -59
- package/src/data/drag-and-drop/drag-handler/DataDragAndDropDragHandler.tsx +0 -63
- package/src/data/drag-and-drop/item/DataDragAndDropItem.tsx +0 -54
- package/src/data/drag-and-drop/root/DataDragAndDrop.context.tsx +0 -14
- package/src/data/drag-and-drop/root/DataDragAndDropRoot.tsx +0 -54
- package/src/data/table/root/useTableSelection.ts +0 -126
- /package/cjs/data/table/{root → hooks}/useTableKeyboardNav.d.ts +0 -0
- /package/esm/data/table/{root → hooks}/useTableKeyboardNav.d.ts +0 -0
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import type { CheckboxProps } from "../../../../form/checkbox/types.js";
|
|
2
|
+
import type { RadioProps } from "../../../../form/radio/types.js";
|
|
3
|
+
type SelectionT = (string | number)[] | "all";
|
|
4
|
+
type SelectionProps = {
|
|
5
|
+
/**
|
|
6
|
+
* Enables selection of rows.
|
|
7
|
+
*
|
|
8
|
+
* When set to "single", only one row can be selected at a time (renders radio buttons).
|
|
9
|
+
*
|
|
10
|
+
* When set to "multiple", multiple rows can be selected (renders checkboxes).
|
|
11
|
+
*
|
|
12
|
+
* @default "none"
|
|
13
|
+
*/
|
|
14
|
+
selectionMode?: "none" | "single" | "multiple";
|
|
15
|
+
selectedKeys?: SelectionT;
|
|
16
|
+
defaultSelectedKeys?: SelectionT;
|
|
17
|
+
onSelectionChange?: (keys: SelectionT) => void;
|
|
18
|
+
disabledKeys?: (string | number)[];
|
|
19
|
+
};
|
|
20
|
+
type NoneSelection = {
|
|
21
|
+
selectionMode: "none";
|
|
22
|
+
allKeys: (string | number)[];
|
|
23
|
+
selectedKeys: (string | number)[];
|
|
24
|
+
disabledKeys: (string | number)[];
|
|
25
|
+
};
|
|
26
|
+
type SingleSelection = {
|
|
27
|
+
selectionMode: "single";
|
|
28
|
+
allKeys: (string | number)[];
|
|
29
|
+
selectedKeys: (string | number)[];
|
|
30
|
+
disabledKeys: (string | number)[];
|
|
31
|
+
getRowRadioProps: (key: string | number) => RadioProps;
|
|
32
|
+
};
|
|
33
|
+
type MultipleSelection = {
|
|
34
|
+
selectionMode: "multiple";
|
|
35
|
+
allKeys: (string | number)[];
|
|
36
|
+
selectedKeys: SelectionT;
|
|
37
|
+
disabledKeys: (string | number)[];
|
|
38
|
+
getTheadCheckboxProps: () => CheckboxProps;
|
|
39
|
+
getRowCheckboxProps: (key: string | number) => CheckboxProps;
|
|
40
|
+
};
|
|
41
|
+
type TableSelection = NoneSelection | SingleSelection | MultipleSelection;
|
|
42
|
+
export type { MultipleSelection, NoneSelection, SelectionProps, SelectionT, SingleSelection, TableSelection, };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"selection.types.js","sourceRoot":"","sources":["../../../../../src/data/table/helpers/selection/selection.types.ts"],"names":[],"mappings":""}
|
|
@@ -4,7 +4,7 @@ import { focusInitialTableTarget } from "../helpers/table-cell.js";
|
|
|
4
4
|
import { focusCellAndUpdateTabIndex } from "../helpers/table-focus.js";
|
|
5
5
|
import { findFirstCell, findFirstCellInRow, findLastCell, findLastCellInRow, findNextFocusableCell, } from "../helpers/table-grid-nav.js";
|
|
6
6
|
import { getNavigationAction, shouldBlockNavigation, } from "../helpers/table-keyboard.js";
|
|
7
|
-
import { useGridCache } from "
|
|
7
|
+
import { useGridCache } from "./useGridCache.js";
|
|
8
8
|
function useTableKeyboardNav(tableRef, { enabled, shouldBlockNavigation: customBlockFn }) {
|
|
9
9
|
const { getTableGrid, activeCell, setActiveCell } = useGridCache(tableRef, enabled);
|
|
10
10
|
/**
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableKeyboardNav.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableKeyboardNav.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { SelectionProps, SelectionT, TableSelection } from "../helpers/selection/selection.types.js";
|
|
2
|
+
type UseTableSelectionArgs<T> = SelectionProps & {
|
|
3
|
+
data: T[];
|
|
4
|
+
getRowId: (rowData: T, index: number) => string | number;
|
|
5
|
+
};
|
|
6
|
+
declare function useTableSelection<T>({ selectionMode, defaultSelectedKeys, selectedKeys: selectedKeysProp, onSelectionChange, disabledKeys, data, getRowId, }: UseTableSelectionArgs<T>): TableSelection;
|
|
7
|
+
export { useTableSelection };
|
|
8
|
+
export type { SelectionProps, SelectionT };
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { useMemo } from "react";
|
|
2
|
+
import { useControllableState } from "../../../utils/hooks/index.js";
|
|
3
|
+
import { getMultipleSelectProps } from "../helpers/selection/getMultipleSelectProps.js";
|
|
4
|
+
import { getSingleSelectProps } from "../helpers/selection/getSingleSelectProps.js";
|
|
5
|
+
function useTableSelection({ selectionMode = "none", defaultSelectedKeys, selectedKeys: selectedKeysProp, onSelectionChange, disabledKeys = [], data, getRowId, }) {
|
|
6
|
+
const allKeys = useMemo(() => data.map((item, index) => getRowId(item, index)), [data, getRowId]);
|
|
7
|
+
const [selectedKeys, setSelectedKeys] = useControllableState({
|
|
8
|
+
value: selectionMode !== "none" ? selectedKeysProp : undefined,
|
|
9
|
+
defaultValue: defaultSelectedKeys !== null && defaultSelectedKeys !== void 0 ? defaultSelectedKeys : [],
|
|
10
|
+
onChange: onSelectionChange,
|
|
11
|
+
});
|
|
12
|
+
if (selectionMode === "none") {
|
|
13
|
+
return { selectionMode, allKeys, selectedKeys: [], disabledKeys };
|
|
14
|
+
}
|
|
15
|
+
if (selectionMode === "single") {
|
|
16
|
+
const arrayKeys = Array.isArray(selectedKeys) ? selectedKeys : [];
|
|
17
|
+
const { getRowRadioProps } = getSingleSelectProps({
|
|
18
|
+
selectedKeys: arrayKeys,
|
|
19
|
+
setSelectedKeys,
|
|
20
|
+
disabledKeys,
|
|
21
|
+
});
|
|
22
|
+
return {
|
|
23
|
+
selectionMode,
|
|
24
|
+
allKeys,
|
|
25
|
+
selectedKeys: arrayKeys,
|
|
26
|
+
disabledKeys,
|
|
27
|
+
getRowRadioProps,
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
const { getTheadCheckboxProps, getRowCheckboxProps } = getMultipleSelectProps({
|
|
31
|
+
selectedKeys,
|
|
32
|
+
setSelectedKeys,
|
|
33
|
+
disabledKeys,
|
|
34
|
+
allKeys,
|
|
35
|
+
totalCount: data.length,
|
|
36
|
+
});
|
|
37
|
+
return {
|
|
38
|
+
selectionMode,
|
|
39
|
+
allKeys,
|
|
40
|
+
selectedKeys,
|
|
41
|
+
disabledKeys,
|
|
42
|
+
getTheadCheckboxProps,
|
|
43
|
+
getRowCheckboxProps,
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
export { useTableSelection };
|
|
47
|
+
//# sourceMappingURL=useTableSelection.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableSelection.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useTableSelection.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAC5D,OAAO,EAAE,sBAAsB,EAAE,MAAM,6CAA6C,CAAC;AACrF,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AAYjF,SAAS,iBAAiB,CAAI,EAC5B,aAAa,GAAG,MAAM,EACtB,mBAAmB,EACnB,YAAY,EAAE,gBAAgB,EAC9B,iBAAiB,EACjB,YAAY,GAAG,EAAE,EACjB,IAAI,EACJ,QAAQ,GACiB;IACzB,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,EACtD,CAAC,IAAI,EAAE,QAAQ,CAAC,CACjB,CAAC;IAEF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,oBAAoB,CAAa;QACvE,KAAK,EAAE,aAAa,KAAK,MAAM,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS;QAC9D,YAAY,EAAE,mBAAmB,aAAnB,mBAAmB,cAAnB,mBAAmB,GAAI,EAAE;QACvC,QAAQ,EAAE,iBAAiB;KAC5B,CAAC,CAAC;IAEH,IAAI,aAAa,KAAK,MAAM,EAAE,CAAC;QAC7B,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,YAAY,EAAE,EAAE,EAAE,YAAY,EAAE,CAAC;IACpE,CAAC;IAED,IAAI,aAAa,KAAK,QAAQ,EAAE,CAAC;QAC/B,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;QAClE,MAAM,EAAE,gBAAgB,EAAE,GAAG,oBAAoB,CAAC;YAChD,YAAY,EAAE,SAAS;YACvB,eAAe;YACf,YAAY;SACb,CAAC,CAAC;QAEH,OAAO;YACL,aAAa;YACb,OAAO;YACP,YAAY,EAAE,SAAS;YACvB,YAAY;YACZ,gBAAgB;SACjB,CAAC;IACJ,CAAC;IAED,MAAM,EAAE,qBAAqB,EAAE,mBAAmB,EAAE,GAAG,sBAAsB,CAC3E;QACE,YAAY;QACZ,eAAe;QACf,YAAY;QACZ,OAAO;QACP,UAAU,EAAE,IAAI,CAAC,MAAM;KACxB,CACF,CAAC;IAEF,OAAO;QACL,aAAa;QACb,OAAO;QACP,YAAY;QACZ,YAAY;QACZ,qBAAqB;QACrB,mBAAmB;KACpB,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
/** biome-ignore-all lint/correctness/useHookAtTopLevel: False positive because of the way forwardRef() is added */
|
|
1
2
|
import React from "react";
|
|
3
|
+
import { type SelectionProps } from "../hooks/useTableSelection.js";
|
|
2
4
|
import type { ColumnDefinitions } from "./DataTable.types.js";
|
|
3
|
-
import { type SelectionProps } from "./useTableSelection.js";
|
|
4
5
|
interface DataTableProps<T> extends React.HTMLAttributes<HTMLTableElement>, SelectionProps {
|
|
5
6
|
children?: never;
|
|
6
7
|
/**
|
|
@@ -50,9 +51,8 @@ interface DataTableProps<T> extends React.HTMLAttributes<HTMLTableElement>, Sele
|
|
|
50
51
|
*
|
|
51
52
|
*/
|
|
52
53
|
columnDefinitions: ColumnDefinitions<T>;
|
|
53
|
-
data:
|
|
54
|
-
|
|
55
|
-
})[];
|
|
54
|
+
data: T[];
|
|
55
|
+
getRowId?: (rowData: T, index: number) => string | number;
|
|
56
56
|
}
|
|
57
57
|
declare const DataTableAuto: <T>(props: DataTableProps<T> & React.RefAttributes<HTMLTableElement>) => React.ReactElement | null;
|
|
58
58
|
export { DataTableAuto };
|
|
@@ -9,33 +9,36 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
9
9
|
}
|
|
10
10
|
return t;
|
|
11
11
|
};
|
|
12
|
+
/** biome-ignore-all lint/correctness/useHookAtTopLevel: False positive because of the way forwardRef() is added */
|
|
12
13
|
import React, { forwardRef, useState } from "react";
|
|
13
14
|
import { Checkbox } from "../../../form/checkbox/index.js";
|
|
14
15
|
import { cl } from "../../../utils/helpers/index.js";
|
|
15
16
|
import { useMergeRefs } from "../../../utils/hooks/index.js";
|
|
17
|
+
import { useTableKeyboardNav } from "../hooks/useTableKeyboardNav.js";
|
|
18
|
+
import { useTableSelection, } from "../hooks/useTableSelection.js";
|
|
16
19
|
import { DataTableTbody } from "../tbody/DataTableTbody.js";
|
|
17
20
|
import { DataTableTd } from "../td/DataTableTd.js";
|
|
18
21
|
import { DataTableTh } from "../th/DataTableTh.js";
|
|
19
22
|
import { DataTableThead } from "../thead/DataTableThead.js";
|
|
20
23
|
import { DataTableTr } from "../tr/DataTableTr.js";
|
|
21
24
|
import { DataTableContextProvider } from "./DataTableRoot.context.js";
|
|
22
|
-
import { useTableKeyboardNav } from "./useTableKeyboardNav.js";
|
|
23
|
-
import { useTableSelection } from "./useTableSelection.js";
|
|
24
25
|
function DataTableAutoInner(_a, forwardedRef) {
|
|
25
|
-
var { className, rowDensity = "normal", withKeyboardNav = false, zebraStripes = false, truncateContent = true, shouldBlockNavigation, layout = "fixed", selectionMode: selectionModeProp = "none", selectedKeys, defaultSelectedKeys, onSelectionChange, disabledKeys = [], data, columnDefinitions } = _a, rest = __rest(_a, ["className", "rowDensity", "withKeyboardNav", "zebraStripes", "truncateContent", "shouldBlockNavigation", "layout", "selectionMode", "selectedKeys", "defaultSelectedKeys", "onSelectionChange", "disabledKeys", "data", "columnDefinitions"]);
|
|
26
|
+
var { className, rowDensity = "normal", withKeyboardNav = false, zebraStripes = false, truncateContent = true, shouldBlockNavigation, layout = "fixed", selectionMode: selectionModeProp = "none", selectedKeys, defaultSelectedKeys, onSelectionChange, disabledKeys = [], data, columnDefinitions, getRowId } = _a, rest = __rest(_a, ["className", "rowDensity", "withKeyboardNav", "zebraStripes", "truncateContent", "shouldBlockNavigation", "layout", "selectionMode", "selectedKeys", "defaultSelectedKeys", "onSelectionChange", "disabledKeys", "data", "columnDefinitions", "getRowId"]);
|
|
26
27
|
const [tableRef, setTableRef] = useState(null);
|
|
27
28
|
const mergedRef = useMergeRefs(forwardedRef, setTableRef);
|
|
28
29
|
const { tabIndex } = useTableKeyboardNav(tableRef, {
|
|
29
30
|
enabled: withKeyboardNav,
|
|
30
31
|
shouldBlockNavigation,
|
|
31
32
|
});
|
|
32
|
-
const
|
|
33
|
+
const resolvedGetRowId = getRowId !== null && getRowId !== void 0 ? getRowId : ((_row, index) => index);
|
|
34
|
+
const selection = useTableSelection({
|
|
33
35
|
selectionMode: selectionModeProp,
|
|
34
36
|
selectedKeys,
|
|
35
37
|
defaultSelectedKeys,
|
|
36
38
|
onSelectionChange,
|
|
37
39
|
disabledKeys,
|
|
38
40
|
data,
|
|
41
|
+
getRowId: resolvedGetRowId,
|
|
39
42
|
});
|
|
40
43
|
return (React.createElement(DataTableContextProvider, { layout: layout, withKeyboardNav: withKeyboardNav },
|
|
41
44
|
React.createElement("div", { className: "aksel-data-table__border-wrapper" },
|
|
@@ -43,15 +46,26 @@ function DataTableAutoInner(_a, forwardedRef) {
|
|
|
43
46
|
React.createElement("table", Object.assign({}, rest, { ref: mergedRef, className: cl("aksel-data-table", className), "data-zebra-stripes": zebraStripes, "data-truncate-content": truncateContent, "data-density": rowDensity, "data-layout": layout, tabIndex: tabIndex }),
|
|
44
47
|
React.createElement(DataTableThead, null,
|
|
45
48
|
React.createElement(DataTableTr, null,
|
|
46
|
-
|
|
47
|
-
|
|
49
|
+
selection.selectionMode === "multiple" && (
|
|
50
|
+
/* TODO: Overflow/focus is clipped. Alignment is off */
|
|
51
|
+
/* TODO: Should not be resizable */
|
|
52
|
+
React.createElement(DataTableTh, { textAlign: "center", width: "60px" },
|
|
53
|
+
React.createElement(Checkbox, Object.assign({}, selection.getTheadCheckboxProps())))),
|
|
54
|
+
selection.selectionMode === "single" && (React.createElement(DataTableTd, { align: "center", width: "60px" })),
|
|
48
55
|
columnDefinitions.map((colDef, colDefIndex) => {
|
|
49
|
-
return (React.createElement(DataTableTh
|
|
56
|
+
return (React.createElement(DataTableTh
|
|
57
|
+
/* TODO: Make these user-changable */
|
|
58
|
+
, {
|
|
59
|
+
/* TODO: Make these user-changable */
|
|
60
|
+
maxWidth: "400px", minWidth: "100px", defaultWidth: "100%", textAlign: "left", key: colDef.id || colDefIndex }, colDef.header));
|
|
50
61
|
}))),
|
|
51
62
|
React.createElement(DataTableTbody, null, data.map((rowData, rowIndex) => {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
63
|
+
const rowId = selection.allKeys[rowIndex];
|
|
64
|
+
return (React.createElement(DataTableTr, { key: rowId },
|
|
65
|
+
selection.selectionMode === "multiple" && (React.createElement(DataTableTd, { align: "center", width: "60px" },
|
|
66
|
+
React.createElement(Checkbox, Object.assign({}, selection.getRowCheckboxProps(rowId))))),
|
|
67
|
+
selection.selectionMode === "single" && (React.createElement(DataTableTd, { align: "center", width: "60px" },
|
|
68
|
+
React.createElement(Checkbox, Object.assign({}, selection.getRowRadioProps(rowId))))),
|
|
55
69
|
columnDefinitions.map((colDef, colDefIndex) => {
|
|
56
70
|
return (React.createElement(DataTableTd, { textAlign: "left", key: colDef.id || colDefIndex }, colDef.cell(rowData)));
|
|
57
71
|
})));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTableAuto.js","sourceRoot":"","sources":["../../../../src/data/table/root/DataTableAuto.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAClD,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"DataTableAuto.js","sourceRoot":"","sources":["../../../../src/data/table/root/DataTableAuto.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { DataTableCaption, type DataTableCaptionProps } from "../caption/DataTableCaption.js";
|
|
3
3
|
import { DataTableEmptyState, type DataTableEmptyStateProps } from "../empty-state/DataTableEmptyState.js";
|
|
4
|
+
import { type SelectionProps } from "../hooks/useTableSelection.js";
|
|
4
5
|
import { DataTableLoadingState, type DataTableLoadingStateProps } from "../loading-state/DataTableLoadingState.js";
|
|
5
6
|
import { DataTableTbody, type DataTableTbodyProps } from "../tbody/DataTableTbody.js";
|
|
6
7
|
import { DataTableTd, type DataTableTdProps } from "../td/DataTableTd.js";
|
|
@@ -8,7 +9,6 @@ import { DataTableTfoot, type DataTableTfootProps } from "../tfoot/DataTableTfoo
|
|
|
8
9
|
import { DataTableTh, type DataTableThProps } from "../th/DataTableTh.js";
|
|
9
10
|
import { DataTableThead, type DataTableTheadProps } from "../thead/DataTableThead.js";
|
|
10
11
|
import { DataTableTr, type DataTableTrProps } from "../tr/DataTableTr.js";
|
|
11
|
-
import { type SelectionProps } from "./useTableSelection.js";
|
|
12
12
|
interface DataTableProps extends React.HTMLAttributes<HTMLTableElement>, SelectionProps {
|
|
13
13
|
children: React.ReactNode;
|
|
14
14
|
/**
|
|
@@ -14,6 +14,7 @@ import { cl } from "../../../utils/helpers/index.js";
|
|
|
14
14
|
import { useMergeRefs } from "../../../utils/hooks/index.js";
|
|
15
15
|
import { DataTableCaption, } from "../caption/DataTableCaption.js";
|
|
16
16
|
import { DataTableEmptyState, } from "../empty-state/DataTableEmptyState.js";
|
|
17
|
+
import { useTableKeyboardNav } from "../hooks/useTableKeyboardNav.js";
|
|
17
18
|
import { DataTableLoadingState, } from "../loading-state/DataTableLoadingState.js";
|
|
18
19
|
import { DataTableTbody, } from "../tbody/DataTableTbody.js";
|
|
19
20
|
import { DataTableTd } from "../td/DataTableTd.js";
|
|
@@ -22,7 +23,6 @@ import { DataTableTh } from "../th/DataTableTh.js";
|
|
|
22
23
|
import { DataTableThead, } from "../thead/DataTableThead.js";
|
|
23
24
|
import { DataTableTr } from "../tr/DataTableTr.js";
|
|
24
25
|
import { DataTableContextProvider } from "./DataTableRoot.context.js";
|
|
25
|
-
import { useTableKeyboardNav } from "./useTableKeyboardNav.js";
|
|
26
26
|
/**
|
|
27
27
|
* TODO Component description etc.
|
|
28
28
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTableRoot.js","sourceRoot":"","sources":["../../../../src/data/table/root/DataTableRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EACL,gBAAgB,GAEjB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,mBAAmB,GAEpB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EACL,qBAAqB,GAEtB,MAAM,wCAAwC,CAAC;AAChD,OAAO,EACL,cAAc,GAEf,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,WAAW,EAAyB,MAAM,mBAAmB,CAAC;AACvE,OAAO,EACL,cAAc,GAEf,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,WAAW,EAAyB,MAAM,mBAAmB,CAAC;AACvE,OAAO,EACL,cAAc,GAEf,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,WAAW,EAAyB,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"DataTableRoot.js","sourceRoot":"","sources":["../../../../src/data/table/root/DataTableRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EACL,gBAAgB,GAEjB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,mBAAmB,GAEpB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAEnE,OAAO,EACL,qBAAqB,GAEtB,MAAM,wCAAwC,CAAC;AAChD,OAAO,EACL,cAAc,GAEf,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,WAAW,EAAyB,MAAM,mBAAmB,CAAC;AACvE,OAAO,EACL,cAAc,GAEf,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,WAAW,EAAyB,MAAM,mBAAmB,CAAC;AACvE,OAAO,EACL,cAAc,GAEf,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,WAAW,EAAyB,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAyKnE;;;;;GAKG;AACH,MAAM,SAAS,GAAG,UAAU,CAC1B,CACE,EASC,EACD,YAAY,EACZ,EAAE;QAXF,EACE,SAAS,EACT,UAAU,GAAG,QAAQ,EACrB,eAAe,GAAG,KAAK,EACvB,YAAY,GAAG,KAAK,EACpB,eAAe,GAAG,IAAI,EACtB,qBAAqB,EACrB,MAAM,GAAG,OAAO,OAEjB,EADI,IAAI,cART,oHASC,CADQ;IAIT,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAA0B,IAAI,CAAC,CAAC;IACxE,MAAM,SAAS,GAAG,YAAY,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC;IAE1D,MAAM,EAAE,QAAQ,EAAE,GAAG,mBAAmB,CAAC,QAAQ,EAAE;QACjD,OAAO,EAAE,eAAe;QACxB,qBAAqB;KACtB,CAAC,CAAC;IAEH,OAAO,CACL,oBAAC,wBAAwB,IACvB,MAAM,EAAE,MAAM,EACd,eAAe,EAAE,eAAe;QAEhC,6BAAK,SAAS,EAAC,kCAAkC;YAC/C,6BAAK,SAAS,EAAC,kCAAkC;gBAC/C,+CACM,IAAI,IACR,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,EAAE,CAAC,kBAAkB,EAAE,SAAS,CAAC,wBACxB,YAAY,2BACT,eAAe,kBACxB,UAAU,iBACX,MAAM,EACnB,QAAQ,EAAE,QAAQ,IAClB,CACE,CACF,CACmB,CAC5B,CAAC;AACJ,CAAC,CACwB,CAAC;AAE5B,SAAS,CAAC,OAAO,GAAG,gBAAgB,CAAC;AACrC,SAAS,CAAC,KAAK,GAAG,cAAc,CAAC;AACjC,SAAS,CAAC,KAAK,GAAG,cAAc,CAAC;AACjC,SAAS,CAAC,EAAE,GAAG,WAAW,CAAC;AAC3B,SAAS,CAAC,EAAE,GAAG,WAAW,CAAC;AAC3B,SAAS,CAAC,EAAE,GAAG,WAAW,CAAC;AAC3B,SAAS,CAAC,KAAK,GAAG,cAAc,CAAC;AACjC,SAAS,CAAC,UAAU,GAAG,mBAAmB,CAAC;AAC3C,SAAS,CAAC,YAAY,GAAG,qBAAqB,CAAC;AAE/C,OAAO,EACL,SAAS,EACT,gBAAgB,EAChB,mBAAmB,EACnB,qBAAqB,EACrB,cAAc,EACd,WAAW,EACX,cAAc,EACd,WAAW,EACX,cAAc,EACd,WAAW,GACZ,CAAC;AACF,eAAe,SAAS,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React, { forwardRef, useState } from "react";
|
|
2
2
|
import { Search } from "../../form/search/index.js";
|
|
3
3
|
import { VStack } from "../../primitives/stack/index.js";
|
|
4
|
-
import {
|
|
4
|
+
import { BodyShort, Detail } from "../../typography/index.js";
|
|
5
5
|
import Listbox from "../../utils/components/Listbox/root/ListboxRoot.js";
|
|
6
6
|
import { DismissableLayer } from "../../utils/components/dismissablelayer/DismissableLayer.js";
|
|
7
7
|
import { Floating } from "../../utils/components/floating/Floating.js";
|
|
@@ -31,17 +31,50 @@ const AutoSuggest = forwardRef(({ options, onSelect, value, onChange, open, setO
|
|
|
31
31
|
React.createElement(Listbox.InputSlot, null,
|
|
32
32
|
React.createElement(Search, { label: "Tabells\u00F8k", variant: "simple", className: "aksel-property-filter__input", placeholder: "Type to filter...", ref: mergedRef, value: value, onChange: handleChange, onClick: () => {
|
|
33
33
|
setOpen(true);
|
|
34
|
-
}, onFocus: () => setOpen(true) }))),
|
|
35
|
-
open && (React.createElement(AutoSuggestPopup, { options: options, onSelect: handleSelectOption, focusedValue: virtuallyFocusedOptionId, setFocusedValue: setVirtuallyFocusedOptionId, onClose: handleClose, safeZoneAnchor: inputRef })))));
|
|
34
|
+
}, onFocus: () => setOpen(true), size: "small", autoComplete: "off" }))),
|
|
35
|
+
open && (React.createElement(AutoSuggestPopup, { options: options, onSelect: handleSelectOption, focusedValue: virtuallyFocusedOptionId, setFocusedValue: setVirtuallyFocusedOptionId, onClose: handleClose, safeZoneAnchor: inputRef, autoSuggestValue: value })))));
|
|
36
36
|
});
|
|
37
|
-
const AutoSuggestPopup = forwardRef(({ options, onSelect, focusedValue, setFocusedValue, onClose, safeZoneAnchor, }, ref) => {
|
|
37
|
+
const AutoSuggestPopup = forwardRef(({ options, onSelect, focusedValue, setFocusedValue, onClose, safeZoneAnchor, autoSuggestValue, }, ref) => {
|
|
38
38
|
return (React.createElement(DismissableLayer, { asChild: true, onDismiss: onClose, safeZone: { anchor: safeZoneAnchor } },
|
|
39
39
|
React.createElement(Floating.Content, { ref: ref, align: "start", side: "bottom", fallbackPlacements: [], sideOffset: 8, className: "aksel-property-filter__popup" },
|
|
40
40
|
React.createElement("div", { className: "aksel-property-filter__popup-inner" },
|
|
41
41
|
React.createElement(Listbox.Options, { setVirtuallyFocusedOptionId: setFocusedValue }, options.map((group) => (React.createElement(Listbox.Group, { key: group.label, label: group.label }, group.options.map((item) => (React.createElement(Listbox.Option, { key: item.value, id: item.value, onClick: () => onSelect(item), hasVirtualFocus: focusedValue === item.value },
|
|
42
42
|
React.createElement(VStack, { gap: "space-0" },
|
|
43
|
-
React.createElement(
|
|
43
|
+
React.createElement(BodyShort, { as: "div", size: "small" },
|
|
44
|
+
React.createElement(HighlightText, { text: item.label, highlightText: autoSuggestValue })),
|
|
44
45
|
item.description && (React.createElement(Detail, { as: "div" }, item.description))))))))))))));
|
|
45
46
|
});
|
|
47
|
+
function HighlightText({ text, highlightText, }) {
|
|
48
|
+
if (!text || !highlightText) {
|
|
49
|
+
return React.createElement("span", null, text);
|
|
50
|
+
}
|
|
51
|
+
if (text === highlightText) {
|
|
52
|
+
return React.createElement(Highlight, { text: text });
|
|
53
|
+
}
|
|
54
|
+
const { noMatches, matches } = highlightSplit(text, highlightText);
|
|
55
|
+
const highlighted = [];
|
|
56
|
+
noMatches.forEach((noMatch, idx) => {
|
|
57
|
+
highlighted.push(React.createElement("span", { key: `noMatch-${idx}` }, noMatch));
|
|
58
|
+
if (matches && idx < matches.length) {
|
|
59
|
+
highlighted.push(React.createElement(Highlight, { key: `match-${idx}`, text: matches[idx] }));
|
|
60
|
+
}
|
|
61
|
+
});
|
|
62
|
+
return React.createElement("span", null, highlighted);
|
|
63
|
+
}
|
|
64
|
+
function Highlight({ text }) {
|
|
65
|
+
return React.createElement("mark", { className: "aksel-listbox__highlight" }, text);
|
|
66
|
+
}
|
|
67
|
+
function highlightSplit(text, highlightText) {
|
|
68
|
+
/* Skip loooong texts */
|
|
69
|
+
if (highlightText.length > 1000) {
|
|
70
|
+
return { noMatches: [text], matches: null };
|
|
71
|
+
}
|
|
72
|
+
/* Case insensitive filtering */
|
|
73
|
+
const filteringPattern = highlightText.replace(/[-[\]/{}()*+?.\\^$|]/g, "\\$&");
|
|
74
|
+
const regexp = new RegExp(filteringPattern, "gi");
|
|
75
|
+
const noMatches = text.split(regexp);
|
|
76
|
+
const matches = text.match(regexp);
|
|
77
|
+
return { noMatches, matches };
|
|
78
|
+
}
|
|
46
79
|
export { AutoSuggest };
|
|
47
80
|
//# sourceMappingURL=AutoSuggest.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AutoSuggest.js","sourceRoot":"","sources":["../../../src/data/token-filter/AutoSuggest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"AutoSuggest.js","sourceRoot":"","sources":["../../../src/data/token-filter/AutoSuggest.tsx"],"names":[],"mappings":"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"}
|
|
@@ -11,6 +11,7 @@ type TokenFilterProps = {
|
|
|
11
11
|
* TODO:
|
|
12
12
|
* - Implement onChange handler to update query state when user selects an autocomplete option.
|
|
13
13
|
* - Handle token rendering and editing (e.g., show tokens for matched properties/operators/values, allow deleting tokens).
|
|
14
|
+
* - Writing "stance" still shows status and hostname options
|
|
14
15
|
*/
|
|
15
16
|
export declare const TokenFilter: React.ForwardRefExoticComponent<TokenFilterProps & React.RefAttributes<HTMLDivElement>>;
|
|
16
17
|
export {};
|
|
@@ -9,6 +9,7 @@ import { parseQueryText } from "./helpers/parse-query-text.js";
|
|
|
9
9
|
* TODO:
|
|
10
10
|
* - Implement onChange handler to update query state when user selects an autocomplete option.
|
|
11
11
|
* - Handle token rendering and editing (e.g., show tokens for matched properties/operators/values, allow deleting tokens).
|
|
12
|
+
* - Writing "stance" still shows status and hostname options
|
|
12
13
|
*/
|
|
13
14
|
export const TokenFilter = forwardRef(({ query, className, propertyDefinitions, options, onChange }, ref) => {
|
|
14
15
|
const [filterText, setFilterText] = useState("");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TokenFilter.js","sourceRoot":"","sources":["../../../src/data/token-filter/TokenFilter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,EAAE,EAAE,MAAM,qBAAqB,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAW5C,OAAO,EAAE,2BAA2B,EAAE,MAAM,yCAAyC,CAAC;AACtF,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAU5D
|
|
1
|
+
{"version":3,"file":"TokenFilter.js","sourceRoot":"","sources":["../../../src/data/token-filter/TokenFilter.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,19 +3,12 @@ import DataToolbarButton, { DataToolbarButtonProps } from "../button/DataToolbar
|
|
|
3
3
|
import { DataToolbarSearchField, type DataToolbarSearchFieldProps } from "../search-field/DataToolbarSearchField.js";
|
|
4
4
|
import DataToolbarToggleButton, { type DataToolbarToggleButtonProps } from "../toggle-button/DataToolbarToggleButton.js";
|
|
5
5
|
interface DataToolbarProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
6
|
-
children
|
|
6
|
+
children?: never;
|
|
7
|
+
renderInput?: React.ReactNode;
|
|
8
|
+
renderPreferences?: React.ReactNode;
|
|
9
|
+
renderPagination?: React.ReactNode;
|
|
7
10
|
}
|
|
8
11
|
interface DataToolbarRootComponent extends React.ForwardRefExoticComponent<DataToolbarProps & React.RefAttributes<HTMLDivElement>> {
|
|
9
|
-
/**
|
|
10
|
-
* @see 🏷️ {@link DataToolbarSearchFieldProps}
|
|
11
|
-
* @example
|
|
12
|
-
* ```tsx
|
|
13
|
-
* <DataToolbar>
|
|
14
|
-
* <DataToolbar.SearchField />
|
|
15
|
-
* </DataToolbar>
|
|
16
|
-
* ```
|
|
17
|
-
*/
|
|
18
|
-
SearchField: typeof DataToolbarSearchField;
|
|
19
12
|
/**
|
|
20
13
|
* @see 🏷️ {@link DataToolbarButtonProps}
|
|
21
14
|
* @example
|
|
@@ -26,18 +19,8 @@ interface DataToolbarRootComponent extends React.ForwardRefExoticComponent<DataT
|
|
|
26
19
|
* ```
|
|
27
20
|
*/
|
|
28
21
|
Button: typeof DataToolbarButton;
|
|
29
|
-
/**
|
|
30
|
-
* @see 🏷️ {@link DataToolbarToggleButtonProps}
|
|
31
|
-
* @example
|
|
32
|
-
* ```tsx
|
|
33
|
-
* <DataToolbar>
|
|
34
|
-
* <DataToolbar.ToggleButton />
|
|
35
|
-
* </DataToolbar>
|
|
36
|
-
* ```
|
|
37
|
-
*/
|
|
38
|
-
ToggleButton: typeof DataToolbarToggleButton;
|
|
39
22
|
}
|
|
40
23
|
declare const DataToolbar: DataToolbarRootComponent;
|
|
41
|
-
export { DataToolbar,
|
|
24
|
+
export { DataToolbar, DataToolbarButton, DataToolbarSearchField, DataToolbarToggleButton, };
|
|
42
25
|
export default DataToolbar;
|
|
43
|
-
export type { DataToolbarProps, DataToolbarSearchFieldProps,
|
|
26
|
+
export type { DataToolbarButtonProps, DataToolbarProps, DataToolbarSearchFieldProps, DataToolbarToggleButtonProps, };
|
|
@@ -9,18 +9,20 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
9
9
|
}
|
|
10
10
|
return t;
|
|
11
11
|
};
|
|
12
|
-
import React from "react";
|
|
12
|
+
import React, { forwardRef } from "react";
|
|
13
13
|
import { cl } from "../../../utils/helpers/index.js";
|
|
14
14
|
import DataToolbarButton from "../button/DataToolbarButton.js";
|
|
15
15
|
import { DataToolbarSearchField, } from "../search-field/DataToolbarSearchField.js";
|
|
16
16
|
import DataToolbarToggleButton from "../toggle-button/DataToolbarToggleButton.js";
|
|
17
|
-
const DataToolbar =
|
|
18
|
-
var {
|
|
19
|
-
return (React.createElement("div", Object.assign({ ref:
|
|
17
|
+
const DataToolbar = forwardRef((_a, forwardedRef) => {
|
|
18
|
+
var { className, renderInput, renderPreferences, renderPagination } = _a, rest = __rest(_a, ["className", "renderInput", "renderPreferences", "renderPagination"]);
|
|
19
|
+
return (React.createElement("div", Object.assign({ ref: forwardedRef }, rest, { className: cl("aksel-data-toolbar", className), role: "toolbar" }),
|
|
20
|
+
renderInput && (React.createElement("div", { className: "aksel-data-toolbar__input" }, renderInput)),
|
|
21
|
+
React.createElement("div", { className: "aksel-data-toolbar__actions" },
|
|
22
|
+
renderPagination && (React.createElement("div", { className: "aksel-data-toolbar__pagination" }, renderPagination)),
|
|
23
|
+
renderPreferences && (React.createElement("div", { className: "aksel-data-toolbar__preferences" }, renderPreferences)))));
|
|
20
24
|
});
|
|
21
|
-
DataToolbar.SearchField = DataToolbarSearchField;
|
|
22
25
|
DataToolbar.Button = DataToolbarButton;
|
|
23
|
-
DataToolbar
|
|
24
|
-
export { DataToolbar, DataToolbarSearchField, DataToolbarButton, DataToolbarToggleButton, };
|
|
26
|
+
export { DataToolbar, DataToolbarButton, DataToolbarSearchField, DataToolbarToggleButton, };
|
|
25
27
|
export default DataToolbar;
|
|
26
28
|
//# sourceMappingURL=DataToolbarRoot.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataToolbarRoot.js","sourceRoot":"","sources":["../../../../src/data/toolbar/root/DataToolbarRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"DataToolbarRoot.js","sourceRoot":"","sources":["../../../../src/data/toolbar/root/DataToolbarRoot.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAC5C,OAAO,iBAEN,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,sBAAsB,GAEvB,MAAM,wCAAwC,CAAC;AAChD,OAAO,uBAEN,MAAM,0CAA0C,CAAC;AAwBlD,MAAM,WAAW,GAAG,UAAU,CAC5B,CACE,EAAwE,EACxE,YAAY,EACZ,EAAE;QAFF,EAAE,SAAS,EAAE,WAAW,EAAE,iBAAiB,EAAE,gBAAgB,OAAW,EAAN,IAAI,cAAtE,qEAAwE,CAAF;IAGtE,OAAO,CACL,2CACE,GAAG,EAAE,YAAY,IACb,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,oBAAoB,EAAE,SAAS,CAAC,EAC9C,IAAI,EAAC,SAAS;QAEb,WAAW,IAAI,CACd,6BAAK,SAAS,EAAC,2BAA2B,IAAE,WAAW,CAAO,CAC/D;QAED,6BAAK,SAAS,EAAC,6BAA6B;YACzC,gBAAgB,IAAI,CACnB,6BAAK,SAAS,EAAC,gCAAgC,IAC5C,gBAAgB,CACb,CACP;YACA,iBAAiB,IAAI,CACpB,6BAAK,SAAS,EAAC,iCAAiC,IAC7C,iBAAiB,CACd,CACP,CACG,CACF,CACP,CAAC;AACJ,CAAC,CAC0B,CAAC;AAE9B,WAAW,CAAC,MAAM,GAAG,iBAAiB,CAAC;AAEvC,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,sBAAsB,EACtB,uBAAuB,GACxB,CAAC;AACF,eAAe,WAAW,CAAC"}
|
package/esm/date/Date.Input.js
CHANGED
|
@@ -9,8 +9,9 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
9
9
|
}
|
|
10
10
|
return t;
|
|
11
11
|
};
|
|
12
|
-
import React, { forwardRef
|
|
12
|
+
import React, { forwardRef } from "react";
|
|
13
13
|
import { CalendarIcon } from "@navikt/aksel-icons";
|
|
14
|
+
import { Button } from "../button/index.js";
|
|
14
15
|
import { ReadOnlyIcon } from "../form/ReadOnlyIcon.js";
|
|
15
16
|
import { useFormField } from "../form/useFormField.js";
|
|
16
17
|
import { BodyShort, ErrorMessage, Label } from "../typography/index.js";
|
|
@@ -22,8 +23,7 @@ export const { Provider: DateInputContextProvider, useContext: useDateInputConte
|
|
|
22
23
|
errorMessage: "useDateInputContext must be used with DateInputContext",
|
|
23
24
|
});
|
|
24
25
|
const DateInput = forwardRef((props, ref) => {
|
|
25
|
-
const { className, hideLabel = false, label, description, variant = "datepicker", setAnchorRef } = props, rest = __rest(props, ["className", "hideLabel", "label", "description", "variant", "setAnchorRef"]);
|
|
26
|
-
const buttonRef = useRef(null);
|
|
26
|
+
const { className, hideLabel = false, label, description, variant = "datepicker", setAnchorRef, "data-color": dataColor } = props, rest = __rest(props, ["className", "hideLabel", "label", "description", "variant", "setAnchorRef", "data-color"]);
|
|
27
27
|
const translate = useDateTranslationContext().translate;
|
|
28
28
|
const isDatepickerVariant = variant === "datepicker";
|
|
29
29
|
const conditionalVariables = {
|
|
@@ -43,7 +43,7 @@ const DateInput = forwardRef((props, ref) => {
|
|
|
43
43
|
"aksel-form-field--readonly": readOnly,
|
|
44
44
|
"aksel-text-field--readonly": readOnly,
|
|
45
45
|
"aksel-date__field--readonly": readOnly,
|
|
46
|
-
}) },
|
|
46
|
+
}), "data-color": dataColor },
|
|
47
47
|
React.createElement(Label, { htmlFor: inputProps.id, size: size, className: cl("aksel-form-field__label", {
|
|
48
48
|
"aksel-sr-only": hideLabel,
|
|
49
49
|
}) },
|
|
@@ -53,12 +53,11 @@ const DateInput = forwardRef((props, ref) => {
|
|
|
53
53
|
"aksel-sr-only": hideLabel,
|
|
54
54
|
}), id: inputDescriptionId, size: size }, description)),
|
|
55
55
|
React.createElement("div", { className: "aksel-date__field-wrapper" },
|
|
56
|
-
React.createElement("input", Object.assign({ ref: ref }, omit(rest, ["error", "errorId", "size"]), inputProps, { autoComplete: "off", "aria-controls":
|
|
57
|
-
React.createElement(
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
React.createElement(CalendarIcon, { title: translate(conditionalVariables.iconTitle[(context === null || context === void 0 ? void 0 : context.open) ? "close" : "open"]) }))),
|
|
56
|
+
React.createElement("input", Object.assign({ ref: ref }, omit(rest, ["error", "errorId", "size"]), inputProps, { autoComplete: "off", "aria-controls": context.open ? context.ariaId : undefined, readOnly: readOnly, className: cl("aksel-date__field-input", "aksel-text-field__input", "aksel-body-short", `aksel-body-short--${size}`), size: isDatepickerVariant ? 11 : 14 })),
|
|
57
|
+
React.createElement(Button, { disabled: inputProps.disabled || readOnly, tabIndex: readOnly ? -1 : undefined, onClick: context.onOpen, type: "button", className: "aksel-date__field-button", ref: setAnchorRef, icon: React.createElement(CalendarIcon, { "aria-hidden": true }),
|
|
58
|
+
// If we have the title on the icon, NVDA will read "close" when focusing
|
|
59
|
+
// the button after closing the popup, even if we wait a tick.
|
|
60
|
+
title: translate(conditionalVariables.iconTitle[context.open ? "close" : "open"]), variant: "secondary", size: size })),
|
|
62
61
|
React.createElement("div", { className: "aksel-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (React.createElement(ErrorMessage, { size: size, showIcon: true }, props.error)))));
|
|
63
62
|
});
|
|
64
63
|
export const DatePickerInput = forwardRef((props, ref) => React.createElement(DateInput, Object.assign({}, props, { ref: ref })));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Date.Input.js","sourceRoot":"","sources":["../../src/date/Date.Input.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAuB,UAAU,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"Date.Input.js","sourceRoot":"","sources":["../../src/date/Date.Input.tsx"],"names":[],"mappings":"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"}
|