@navikt/ds-react 8.4.0 → 8.5.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/accordion/Accordion.d.ts +10 -0
- package/cjs/accordion/Accordion.js +2 -2
- package/cjs/accordion/Accordion.js.map +1 -1
- package/cjs/data/table/helpers/table-cell.d.ts +2 -2
- package/cjs/data/table/helpers/table-cell.js +2 -5
- package/cjs/data/table/helpers/table-cell.js.map +1 -1
- package/cjs/data/table/helpers/table-focus.d.ts +26 -2
- package/cjs/data/table/helpers/table-focus.js +60 -9
- package/cjs/data/table/helpers/table-focus.js.map +1 -1
- package/cjs/data/table/helpers/table-grid-nav.d.ts +45 -9
- package/cjs/data/table/helpers/table-grid-nav.js +108 -24
- package/cjs/data/table/helpers/table-grid-nav.js.map +1 -1
- package/cjs/data/table/helpers/table-keyboard.d.ts +24 -3
- package/cjs/data/table/helpers/table-keyboard.js +30 -5
- package/cjs/data/table/helpers/table-keyboard.js.map +1 -1
- package/cjs/data/table/hooks/useGridCache.d.ts +17 -0
- package/cjs/data/table/hooks/useGridCache.js +65 -0
- package/cjs/data/table/hooks/useGridCache.js.map +1 -0
- package/cjs/data/table/root/DataTableRoot.d.ts +1 -1
- package/cjs/data/table/root/DataTableRoot.js +2 -2
- package/cjs/data/table/root/DataTableRoot.js.map +1 -1
- package/cjs/data/table/root/useTableKeyboardNav.d.ts +9 -3
- package/cjs/data/table/root/useTableKeyboardNav.js +53 -95
- package/cjs/data/table/root/useTableKeyboardNav.js.map +1 -1
- package/cjs/data/table/th/DataTableTh.d.ts +1 -1
- package/cjs/data/table/th/DataTableTh.js +3 -1
- package/cjs/data/table/th/DataTableTh.js.map +1 -1
- package/cjs/data/table/tr/DataTableTr.d.ts +6 -2
- package/cjs/data/table/tr/DataTableTr.js +4 -2
- package/cjs/data/table/tr/DataTableTr.js.map +1 -1
- package/cjs/link-card/LinkCard.d.ts +13 -0
- package/cjs/link-card/LinkCard.js +2 -2
- package/cjs/link-card/LinkCard.js.map +1 -1
- package/cjs/process/Process.d.ts +1 -1
- package/cjs/utils/i18n/locales/nb.d.ts +154 -75
- package/cjs/utils/i18n/locales/nb.js +154 -75
- package/cjs/utils/i18n/locales/nb.js.map +1 -1
- package/esm/accordion/Accordion.d.ts +10 -0
- package/esm/accordion/Accordion.js +2 -2
- package/esm/accordion/Accordion.js.map +1 -1
- package/esm/data/table/helpers/table-cell.d.ts +2 -2
- package/esm/data/table/helpers/table-cell.js +2 -5
- package/esm/data/table/helpers/table-cell.js.map +1 -1
- package/esm/data/table/helpers/table-focus.d.ts +26 -2
- package/esm/data/table/helpers/table-focus.js +55 -9
- package/esm/data/table/helpers/table-focus.js.map +1 -1
- package/esm/data/table/helpers/table-grid-nav.d.ts +45 -9
- package/esm/data/table/helpers/table-grid-nav.js +102 -23
- package/esm/data/table/helpers/table-grid-nav.js.map +1 -1
- package/esm/data/table/helpers/table-keyboard.d.ts +24 -3
- package/esm/data/table/helpers/table-keyboard.js +29 -4
- package/esm/data/table/helpers/table-keyboard.js.map +1 -1
- package/esm/data/table/hooks/useGridCache.d.ts +17 -0
- package/esm/data/table/hooks/useGridCache.js +63 -0
- package/esm/data/table/hooks/useGridCache.js.map +1 -0
- package/esm/data/table/root/DataTableRoot.d.ts +1 -1
- package/esm/data/table/root/DataTableRoot.js +2 -2
- package/esm/data/table/root/DataTableRoot.js.map +1 -1
- package/esm/data/table/root/useTableKeyboardNav.d.ts +9 -3
- package/esm/data/table/root/useTableKeyboardNav.js +58 -100
- package/esm/data/table/root/useTableKeyboardNav.js.map +1 -1
- package/esm/data/table/th/DataTableTh.d.ts +1 -1
- package/esm/data/table/th/DataTableTh.js +3 -1
- package/esm/data/table/th/DataTableTh.js.map +1 -1
- package/esm/data/table/tr/DataTableTr.d.ts +6 -2
- package/esm/data/table/tr/DataTableTr.js +4 -2
- package/esm/data/table/tr/DataTableTr.js.map +1 -1
- package/esm/link-card/LinkCard.d.ts +13 -0
- package/esm/link-card/LinkCard.js +2 -2
- package/esm/link-card/LinkCard.js.map +1 -1
- package/esm/process/Process.d.ts +1 -1
- package/esm/utils/i18n/locales/nb.d.ts +154 -75
- package/esm/utils/i18n/locales/nb.js +154 -75
- package/esm/utils/i18n/locales/nb.js.map +1 -1
- package/package.json +3 -3
- package/src/accordion/Accordion.tsx +19 -2
- package/src/data/table/helpers/table-cell.ts +2 -7
- package/src/data/table/helpers/table-focus.ts +70 -9
- package/src/data/table/helpers/table-grid-nav.ts +146 -31
- package/src/data/table/helpers/table-keyboard.test.ts +27 -27
- package/src/data/table/helpers/table-keyboard.ts +43 -4
- package/src/data/table/hooks/useGridCache.ts +73 -0
- package/src/data/table/root/DataTableRoot.tsx +2 -3
- package/src/data/table/root/useTableKeyboardNav.ts +95 -125
- package/src/data/table/th/DataTableTh.tsx +7 -3
- package/src/data/table/tr/DataTableTr.tsx +7 -3
- package/src/link-card/LinkCard.tsx +15 -1
- package/src/process/Process.tsx +1 -1
- package/src/utils/i18n/locales/nb.ts +83 -4
|
@@ -1,33 +1,69 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Builds a utility grid allowing for easier keyboard-navigation between cells on columns and rows
|
|
3
3
|
*/
|
|
4
|
-
declare function
|
|
4
|
+
declare function buildTableGridMap(tableRef: HTMLTableElement): {
|
|
5
5
|
grid: (Element | undefined)[][];
|
|
6
6
|
positions: Map<Element, {
|
|
7
7
|
x: number;
|
|
8
8
|
y: number;
|
|
9
9
|
}>;
|
|
10
|
-
maxCols: number;
|
|
11
10
|
};
|
|
12
|
-
type TableGrid = ReturnType<typeof buildTableGrid>;
|
|
13
11
|
type GridCache = {
|
|
14
|
-
grid:
|
|
12
|
+
grid: ReturnType<typeof buildTableGridMap> | null;
|
|
15
13
|
dirty: boolean;
|
|
16
14
|
};
|
|
17
15
|
/**
|
|
18
|
-
*
|
|
16
|
+
* Pure function that calculates the next grid position given a current position and delta.
|
|
17
|
+
* Returns the position if valid, or null if out of bounds.
|
|
19
18
|
*/
|
|
20
|
-
declare function
|
|
19
|
+
declare function getNextGridPosition(grid: (Element | undefined)[][], currentPos: {
|
|
20
|
+
x: number;
|
|
21
|
+
y: number;
|
|
22
|
+
}, delta: {
|
|
23
|
+
x: number;
|
|
24
|
+
y: number;
|
|
25
|
+
}): {
|
|
26
|
+
x: number;
|
|
27
|
+
y: number;
|
|
28
|
+
} | null;
|
|
29
|
+
/**
|
|
30
|
+
* Checks if a cell is focusable (not the same as current cell and contains focusable elements).
|
|
31
|
+
* Type guard that narrows Element | undefined to Element.
|
|
32
|
+
*/
|
|
33
|
+
declare function isCellFocusable(cell: Element | undefined, currentCell: Element): cell is Element;
|
|
21
34
|
/**
|
|
22
35
|
* Finds the next cell in the given direction, starting from the current position.
|
|
23
36
|
* Skips over cells that are not focusable or are the same as the current cell.
|
|
24
37
|
* Returns null if no next cell is found in the given direction.
|
|
25
38
|
*/
|
|
26
|
-
declare function
|
|
39
|
+
declare function findNextFocusableCell(grid: (Element | undefined)[][], currentPos: {
|
|
27
40
|
x: number;
|
|
28
41
|
y: number;
|
|
29
42
|
}, delta: {
|
|
30
43
|
x: number;
|
|
31
44
|
y: number;
|
|
32
|
-
}, currentCell: Element
|
|
33
|
-
|
|
45
|
+
}, currentCell: Element): Element | null;
|
|
46
|
+
/**
|
|
47
|
+
* Finds the first focusable cell in the same row as the current position.
|
|
48
|
+
*/
|
|
49
|
+
declare function findFirstCellInRow(grid: (Element | undefined)[][], positions: Map<Element, {
|
|
50
|
+
x: number;
|
|
51
|
+
y: number;
|
|
52
|
+
}>, currentCell: Element): Element | null;
|
|
53
|
+
/**
|
|
54
|
+
* Finds the last focusable cell in the same row as the current position.
|
|
55
|
+
*/
|
|
56
|
+
declare function findLastCellInRow(grid: (Element | undefined)[][], positions: Map<Element, {
|
|
57
|
+
x: number;
|
|
58
|
+
y: number;
|
|
59
|
+
}>, currentCell: Element): Element | null;
|
|
60
|
+
/**
|
|
61
|
+
* Finds the first focusable cell in the entire table.
|
|
62
|
+
*/
|
|
63
|
+
declare function findFirstCell(grid: (Element | undefined)[][], currentCell: Element): Element | null;
|
|
64
|
+
/**
|
|
65
|
+
* Finds the last focusable cell in the entire table.
|
|
66
|
+
*/
|
|
67
|
+
declare function findLastCell(grid: (Element | undefined)[][], currentCell: Element): Element | null;
|
|
68
|
+
export { buildTableGridMap, findFirstCell, findFirstCellInRow, findLastCell, findLastCellInRow, findNextFocusableCell, getNextGridPosition, isCellFocusable, };
|
|
69
|
+
export type { GridCache };
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { findFocusableElementInCell } from "./table-focus.js";
|
|
2
2
|
/**
|
|
3
3
|
* Builds a utility grid allowing for easier keyboard-navigation between cells on columns and rows
|
|
4
4
|
*/
|
|
5
|
-
function
|
|
5
|
+
function buildTableGridMap(tableRef) {
|
|
6
6
|
const rows = tableRef.rows;
|
|
7
7
|
const grid = [];
|
|
8
8
|
const positions = new Map();
|
|
9
|
-
let maxCols = 0;
|
|
10
9
|
/* Walk trough each row in order */
|
|
11
10
|
for (let rowIndex = 0; rowIndex < rows.length; rowIndex += 1) {
|
|
12
11
|
const row = rows[rowIndex];
|
|
@@ -38,43 +37,123 @@ function buildTableGrid(tableRef) {
|
|
|
38
37
|
positions.set(cell, { x: colIndex, y: rowIndex });
|
|
39
38
|
}
|
|
40
39
|
colIndex += colSpan;
|
|
41
|
-
if (colIndex > maxCols) {
|
|
42
|
-
maxCols = colIndex;
|
|
43
|
-
}
|
|
44
40
|
}
|
|
45
41
|
}
|
|
46
|
-
return { grid, positions
|
|
42
|
+
return { grid, positions };
|
|
47
43
|
}
|
|
48
44
|
/**
|
|
49
|
-
*
|
|
45
|
+
* Pure function that calculates the next grid position given a current position and delta.
|
|
46
|
+
* Returns the position if valid, or null if out of bounds.
|
|
50
47
|
*/
|
|
51
|
-
function
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
48
|
+
function getNextGridPosition(grid, currentPos, delta) {
|
|
49
|
+
var _a;
|
|
50
|
+
const x = currentPos.x + delta.x;
|
|
51
|
+
const y = currentPos.y + delta.y;
|
|
52
|
+
if (y < 0 || y >= grid.length) {
|
|
53
|
+
return null;
|
|
54
|
+
}
|
|
55
|
+
const row = (_a = grid[y]) !== null && _a !== void 0 ? _a : [];
|
|
56
|
+
if (x < 0 || x >= row.length) {
|
|
57
|
+
return null;
|
|
55
58
|
}
|
|
56
|
-
return
|
|
59
|
+
return { x, y };
|
|
60
|
+
}
|
|
61
|
+
/**
|
|
62
|
+
* Checks if a cell is focusable (not the same as current cell and contains focusable elements).
|
|
63
|
+
* Type guard that narrows Element | undefined to Element.
|
|
64
|
+
*/
|
|
65
|
+
function isCellFocusable(cell, currentCell) {
|
|
66
|
+
if (!cell || cell === currentCell) {
|
|
67
|
+
return false;
|
|
68
|
+
}
|
|
69
|
+
return !!findFocusableElementInCell(cell);
|
|
57
70
|
}
|
|
58
71
|
/**
|
|
59
72
|
* Finds the next cell in the given direction, starting from the current position.
|
|
60
73
|
* Skips over cells that are not focusable or are the same as the current cell.
|
|
61
74
|
* Returns null if no next cell is found in the given direction.
|
|
62
75
|
*/
|
|
63
|
-
function
|
|
76
|
+
function findNextFocusableCell(grid, currentPos, delta, currentCell) {
|
|
77
|
+
let position = currentPos;
|
|
78
|
+
while (true) {
|
|
79
|
+
const nextPos = getNextGridPosition(grid, position, delta);
|
|
80
|
+
if (!nextPos) {
|
|
81
|
+
return null;
|
|
82
|
+
}
|
|
83
|
+
const cell = grid[nextPos.y][nextPos.x];
|
|
84
|
+
if (isCellFocusable(cell, currentCell)) {
|
|
85
|
+
return cell;
|
|
86
|
+
}
|
|
87
|
+
position = nextPos;
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
/**
|
|
91
|
+
* Finds the first focusable cell in the same row as the current position.
|
|
92
|
+
*/
|
|
93
|
+
function findFirstCellInRow(grid, positions, currentCell) {
|
|
64
94
|
var _a;
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
95
|
+
const currentPos = positions.get(currentCell);
|
|
96
|
+
if (!currentPos) {
|
|
97
|
+
return null;
|
|
98
|
+
}
|
|
99
|
+
const row = (_a = grid[currentPos.y]) !== null && _a !== void 0 ? _a : [];
|
|
100
|
+
for (let x = 0; x < row.length; x += 1) {
|
|
101
|
+
const cell = row[x];
|
|
102
|
+
if (isCellFocusable(cell, currentCell)) {
|
|
103
|
+
return cell;
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
return null;
|
|
107
|
+
}
|
|
108
|
+
/**
|
|
109
|
+
* Finds the last focusable cell in the same row as the current position.
|
|
110
|
+
*/
|
|
111
|
+
function findLastCellInRow(grid, positions, currentCell) {
|
|
112
|
+
var _a;
|
|
113
|
+
const currentPos = positions.get(currentCell);
|
|
114
|
+
if (!currentPos) {
|
|
115
|
+
return null;
|
|
116
|
+
}
|
|
117
|
+
const row = (_a = grid[currentPos.y]) !== null && _a !== void 0 ? _a : [];
|
|
118
|
+
for (let x = row.length - 1; x >= 0; x -= 1) {
|
|
70
119
|
const cell = row[x];
|
|
71
|
-
if (cell
|
|
120
|
+
if (isCellFocusable(cell, currentCell)) {
|
|
72
121
|
return cell;
|
|
73
122
|
}
|
|
74
|
-
x += delta.x;
|
|
75
|
-
y += delta.y;
|
|
76
123
|
}
|
|
77
124
|
return null;
|
|
78
125
|
}
|
|
79
|
-
|
|
126
|
+
/**
|
|
127
|
+
* Finds the first focusable cell in the entire table.
|
|
128
|
+
*/
|
|
129
|
+
function findFirstCell(grid, currentCell) {
|
|
130
|
+
var _a;
|
|
131
|
+
for (let y = 0; y < grid.length; y += 1) {
|
|
132
|
+
const row = (_a = grid[y]) !== null && _a !== void 0 ? _a : [];
|
|
133
|
+
for (let x = 0; x < row.length; x += 1) {
|
|
134
|
+
const cell = row[x];
|
|
135
|
+
if (isCellFocusable(cell, currentCell)) {
|
|
136
|
+
return cell;
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
return null;
|
|
141
|
+
}
|
|
142
|
+
/**
|
|
143
|
+
* Finds the last focusable cell in the entire table.
|
|
144
|
+
*/
|
|
145
|
+
function findLastCell(grid, currentCell) {
|
|
146
|
+
var _a;
|
|
147
|
+
for (let y = grid.length - 1; y >= 0; y -= 1) {
|
|
148
|
+
const row = (_a = grid[y]) !== null && _a !== void 0 ? _a : [];
|
|
149
|
+
for (let x = row.length - 1; x >= 0; x -= 1) {
|
|
150
|
+
const cell = row[x];
|
|
151
|
+
if (isCellFocusable(cell, currentCell)) {
|
|
152
|
+
return cell;
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
return null;
|
|
157
|
+
}
|
|
158
|
+
export { buildTableGridMap, findFirstCell, findFirstCellInRow, findLastCell, findLastCellInRow, findNextFocusableCell, getNextGridPosition, isCellFocusable, };
|
|
80
159
|
//# sourceMappingURL=table-grid-nav.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-grid-nav.js","sourceRoot":"","sources":["../../../../src/data/table/helpers/table-grid-nav.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"table-grid-nav.js","sourceRoot":"","sources":["../../../../src/data/table/helpers/table-grid-nav.ts"],"names":[],"mappings":"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"}
|
|
@@ -2,8 +2,28 @@ type Delta = {
|
|
|
2
2
|
x: number;
|
|
3
3
|
y: number;
|
|
4
4
|
};
|
|
5
|
-
|
|
5
|
+
type NavigationAction = {
|
|
6
|
+
type: "delta";
|
|
7
|
+
delta: Delta;
|
|
8
|
+
} | {
|
|
9
|
+
type: "home";
|
|
10
|
+
} | {
|
|
11
|
+
type: "end";
|
|
12
|
+
} | {
|
|
13
|
+
type: "tableStart";
|
|
14
|
+
} | {
|
|
15
|
+
type: "tableEnd";
|
|
16
|
+
};
|
|
17
|
+
/**
|
|
18
|
+
* Maps keyboard events to navigation actions.
|
|
19
|
+
* Supports arrow keys, Home/End (row navigation), Ctrl/Cmd+Home/End (table navigation),
|
|
20
|
+
* and PageUp/PageDown (multi-row navigation).
|
|
21
|
+
*/
|
|
22
|
+
declare function getNavigationAction(event: KeyboardEvent): NavigationAction | null;
|
|
6
23
|
/**
|
|
24
|
+
* Determines if keyboard navigation should be blocked based on the current focus context.
|
|
25
|
+
* Allows for custom blocking logic via an optional callback.
|
|
26
|
+
*
|
|
7
27
|
* Tries to make assumptions of what the user is currently doing inside a table cell
|
|
8
28
|
* Should block navigation if:
|
|
9
29
|
* - Input has selection, caret is not at start/end
|
|
@@ -11,5 +31,6 @@ declare function getDeltaFromKey(key: string): Delta | null;
|
|
|
11
31
|
* - User is navigating inside multiline textarea
|
|
12
32
|
* - contenteditable attrb is in use
|
|
13
33
|
*/
|
|
14
|
-
declare function
|
|
15
|
-
export {
|
|
34
|
+
declare function shouldBlockNavigation(event: KeyboardEvent, customBlockFn?: (event: KeyboardEvent) => boolean): boolean;
|
|
35
|
+
export { getNavigationAction, shouldBlockNavigation };
|
|
36
|
+
export type { Delta, NavigationAction };
|
|
@@ -4,13 +4,34 @@ const keyToCoord = {
|
|
|
4
4
|
ArrowLeft: { x: -1, y: 0 },
|
|
5
5
|
ArrowRight: { x: 1, y: 0 },
|
|
6
6
|
};
|
|
7
|
-
|
|
7
|
+
/**
|
|
8
|
+
* Maps keyboard events to navigation actions.
|
|
9
|
+
* Supports arrow keys, Home/End (row navigation), Ctrl/Cmd+Home/End (table navigation),
|
|
10
|
+
* and PageUp/PageDown (multi-row navigation).
|
|
11
|
+
*/
|
|
12
|
+
function getNavigationAction(event) {
|
|
13
|
+
const key = event.key;
|
|
14
|
+
/* Arrow keys -> directional navigation */
|
|
8
15
|
if (key in keyToCoord) {
|
|
9
|
-
return keyToCoord[key];
|
|
16
|
+
return { type: "delta", delta: keyToCoord[key] };
|
|
17
|
+
}
|
|
18
|
+
// Home/End keys
|
|
19
|
+
if (key === "Home") {
|
|
20
|
+
return event.ctrlKey || event.metaKey
|
|
21
|
+
? { type: "tableStart" }
|
|
22
|
+
: { type: "home" };
|
|
23
|
+
}
|
|
24
|
+
if (key === "End") {
|
|
25
|
+
return event.ctrlKey || event.metaKey
|
|
26
|
+
? { type: "tableEnd" }
|
|
27
|
+
: { type: "end" };
|
|
10
28
|
}
|
|
11
29
|
return null;
|
|
12
30
|
}
|
|
13
31
|
/**
|
|
32
|
+
* Determines if keyboard navigation should be blocked based on the current focus context.
|
|
33
|
+
* Allows for custom blocking logic via an optional callback.
|
|
34
|
+
*
|
|
14
35
|
* Tries to make assumptions of what the user is currently doing inside a table cell
|
|
15
36
|
* Should block navigation if:
|
|
16
37
|
* - Input has selection, caret is not at start/end
|
|
@@ -18,7 +39,11 @@ function getDeltaFromKey(key) {
|
|
|
18
39
|
* - User is navigating inside multiline textarea
|
|
19
40
|
* - contenteditable attrb is in use
|
|
20
41
|
*/
|
|
21
|
-
function
|
|
42
|
+
function shouldBlockNavigation(event, customBlockFn) {
|
|
43
|
+
/* Check custom block function first */
|
|
44
|
+
if (customBlockFn === null || customBlockFn === void 0 ? void 0 : customBlockFn(event)) {
|
|
45
|
+
return true;
|
|
46
|
+
}
|
|
22
47
|
const key = event.key;
|
|
23
48
|
if (!(key in keyToCoord)) {
|
|
24
49
|
return false;
|
|
@@ -91,5 +116,5 @@ function isTextInputType(type) {
|
|
|
91
116
|
return false;
|
|
92
117
|
}
|
|
93
118
|
}
|
|
94
|
-
export {
|
|
119
|
+
export { getNavigationAction, shouldBlockNavigation };
|
|
95
120
|
//# sourceMappingURL=table-keyboard.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-keyboard.js","sourceRoot":"","sources":["../../../../src/data/table/helpers/table-keyboard.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,GAAG;IACjB,OAAO,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE;IACxB,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IACzB,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IAC1B,UAAU,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;CAClB,CAAC;
|
|
1
|
+
{"version":3,"file":"table-keyboard.js","sourceRoot":"","sources":["../../../../src/data/table/helpers/table-keyboard.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Manages the table grid cache and observes DOM changes that require grid rebuilding.
|
|
3
|
+
* Watches for structural changes (rows/cells added/removed) and attribute changes
|
|
4
|
+
* (colspan, rowspan, hidden, style) that affect grid layout and focusability.
|
|
5
|
+
*/
|
|
6
|
+
declare function useGridCache(tableRef: HTMLTableElement | null, enabled: boolean): {
|
|
7
|
+
getTableGrid: (_tableRef: HTMLTableElement) => {
|
|
8
|
+
grid: (Element | undefined)[][];
|
|
9
|
+
positions: Map<Element, {
|
|
10
|
+
x: number;
|
|
11
|
+
y: number;
|
|
12
|
+
}>;
|
|
13
|
+
};
|
|
14
|
+
activeCell: Element | null;
|
|
15
|
+
setActiveCell: import("react").Dispatch<import("react").SetStateAction<Element | null>>;
|
|
16
|
+
};
|
|
17
|
+
export { useGridCache };
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { useCallback, useEffect, useRef, useState } from "react";
|
|
2
|
+
import { useValueAsRef } from "../../../utils/hooks/index.js";
|
|
3
|
+
import { buildTableGridMap } from "../helpers/table-grid-nav.js";
|
|
4
|
+
/**
|
|
5
|
+
* Manages the table grid cache and observes DOM changes that require grid rebuilding.
|
|
6
|
+
* Watches for structural changes (rows/cells added/removed) and attribute changes
|
|
7
|
+
* (colspan, rowspan, hidden, style) that affect grid layout and focusability.
|
|
8
|
+
*/
|
|
9
|
+
function useGridCache(tableRef, enabled) {
|
|
10
|
+
const gridCacheRef = useRef({
|
|
11
|
+
grid: null,
|
|
12
|
+
dirty: true,
|
|
13
|
+
});
|
|
14
|
+
const [activeCell, setActiveCell] = useState(null);
|
|
15
|
+
const activeCellRef = useValueAsRef(activeCell).current;
|
|
16
|
+
const observerRef = useRef(null);
|
|
17
|
+
useEffect(() => {
|
|
18
|
+
if (!tableRef || !enabled) {
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
21
|
+
observerRef.current = new MutationObserver(() => {
|
|
22
|
+
gridCacheRef.current.dirty = true;
|
|
23
|
+
if (activeCellRef && !activeCellRef.isConnected) {
|
|
24
|
+
setActiveCell(null);
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
observerRef.current.observe(tableRef, {
|
|
28
|
+
subtree: true,
|
|
29
|
+
childList: true,
|
|
30
|
+
attributes: true,
|
|
31
|
+
attributeFilter: ["colspan", "rowspan", "hidden", "style"],
|
|
32
|
+
});
|
|
33
|
+
return () => {
|
|
34
|
+
if (observerRef.current) {
|
|
35
|
+
observerRef.current.disconnect();
|
|
36
|
+
observerRef.current = null;
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
}, [tableRef, enabled, activeCellRef]);
|
|
40
|
+
/**
|
|
41
|
+
* If keyboard-nav is re-enabled, mark grid as dirty since
|
|
42
|
+
* the table might have changed while it was disabled.
|
|
43
|
+
*/
|
|
44
|
+
useEffect(() => {
|
|
45
|
+
if (enabled) {
|
|
46
|
+
gridCacheRef.current.dirty = true;
|
|
47
|
+
}
|
|
48
|
+
}, [enabled]);
|
|
49
|
+
const getTableGrid = useCallback((_tableRef) => {
|
|
50
|
+
if (gridCacheRef.current.dirty || !gridCacheRef.current.grid) {
|
|
51
|
+
gridCacheRef.current.grid = buildTableGridMap(_tableRef);
|
|
52
|
+
gridCacheRef.current.dirty = false;
|
|
53
|
+
}
|
|
54
|
+
return gridCacheRef.current.grid;
|
|
55
|
+
}, []);
|
|
56
|
+
return {
|
|
57
|
+
getTableGrid,
|
|
58
|
+
activeCell,
|
|
59
|
+
setActiveCell,
|
|
60
|
+
};
|
|
61
|
+
}
|
|
62
|
+
export { useGridCache };
|
|
63
|
+
//# sourceMappingURL=useGridCache.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useGridCache.js","sourceRoot":"","sources":["../../../../src/data/table/hooks/useGridCache.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAkB,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9E;;;;GAIG;AACH,SAAS,YAAY,CAAC,QAAiC,EAAE,OAAgB;IACvE,MAAM,YAAY,GAAG,MAAM,CAAY;QACrC,IAAI,EAAE,IAAI;QACV,KAAK,EAAE,IAAI;KACZ,CAAC,CAAC;IAEH,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC,CAAC;IACnE,MAAM,aAAa,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC;IACxD,MAAM,WAAW,GAAG,MAAM,CAA0B,IAAI,CAAC,CAAC;IAE1D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ,IAAI,CAAC,OAAO,EAAE,CAAC;YAC1B,OAAO;QACT,CAAC;QAED,WAAW,CAAC,OAAO,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE;YAC9C,YAAY,CAAC,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC;YAClC,IAAI,aAAa,IAAI,CAAC,aAAa,CAAC,WAAW,EAAE,CAAC;gBAChD,aAAa,CAAC,IAAI,CAAC,CAAC;YACtB,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,EAAE;YACpC,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,IAAI;YACf,UAAU,EAAE,IAAI;YAChB,eAAe,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,CAAC;SAC3D,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE;YACV,IAAI,WAAW,CAAC,OAAO,EAAE,CAAC;gBACxB,WAAW,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;gBACjC,WAAW,CAAC,OAAO,GAAG,IAAI,CAAC;YAC7B,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC;IAEvC;;;OAGG;IACH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO,EAAE,CAAC;YACZ,YAAY,CAAC,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC;QACpC,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,YAAY,GAAG,WAAW,CAAC,CAAC,SAA2B,EAAE,EAAE;QAC/D,IAAI,YAAY,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;YAC7D,YAAY,CAAC,OAAO,CAAC,IAAI,GAAG,iBAAiB,CAAC,SAAS,CAAC,CAAC;YACzD,YAAY,CAAC,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC;QACrC,CAAC;QAED,OAAO,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC;IACnC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO;QACL,YAAY;QACZ,UAAU;QACV,aAAa;KACd,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,YAAY,EAAE,CAAC"}
|
|
@@ -21,7 +21,7 @@ interface DataTableProps extends React.HTMLAttributes<HTMLTableElement> {
|
|
|
21
21
|
zebraStripes?: boolean;
|
|
22
22
|
truncateContent?: boolean;
|
|
23
23
|
}
|
|
24
|
-
interface DataTableRootComponent extends React.ForwardRefExoticComponent<DataTableProps & React.RefAttributes<
|
|
24
|
+
interface DataTableRootComponent extends React.ForwardRefExoticComponent<DataTableProps & React.RefAttributes<HTMLTableElement>> {
|
|
25
25
|
/**
|
|
26
26
|
* @see 🏷️ {@link DataTableCaptionProps}
|
|
27
27
|
* @example
|
|
@@ -24,7 +24,7 @@ const DataTable = forwardRef((_a, forwardedRef) => {
|
|
|
24
24
|
var { className, rowDensity = "normal", withKeyboardNav = false, zebraStripes = false, truncateContent = true } = _a, rest = __rest(_a, ["className", "rowDensity", "withKeyboardNav", "zebraStripes", "truncateContent"]);
|
|
25
25
|
const [tableRef, setTableRef] = useState(null);
|
|
26
26
|
const mergedRef = useMergeRefs(forwardedRef, setTableRef);
|
|
27
|
-
const {
|
|
27
|
+
const { tableTabIndex } = useTableKeyboardNav(tableRef, {
|
|
28
28
|
enabled: withKeyboardNav,
|
|
29
29
|
});
|
|
30
30
|
return (React.createElement("div", { className: "aksel-data-table__border-wrapper" },
|
|
@@ -32,7 +32,7 @@ const DataTable = forwardRef((_a, forwardedRef) => {
|
|
|
32
32
|
React.createElement("table", Object.assign({}, rest, { ref: mergedRef, className: cl("aksel-data-table", className, {
|
|
33
33
|
"aksel-data-table--zebra-stripes": zebraStripes,
|
|
34
34
|
"aksel-data-table--truncate-content": truncateContent,
|
|
35
|
-
}), "data-density": rowDensity, tabIndex: tableTabIndex
|
|
35
|
+
}), "data-density": rowDensity, tabIndex: tableTabIndex })))));
|
|
36
36
|
});
|
|
37
37
|
DataTable.Caption = DataTableCaption;
|
|
38
38
|
DataTable.Thead = DataTableThead;
|
|
@@ -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,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,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAiH5D,MAAM,SAAS,GAAG,UAAU,CAC1B,CACE,EAOC,EACD,YAAY,EACZ,EAAE;QATF,EACE,SAAS,EACT,UAAU,GAAG,QAAQ,EACrB,eAAe,GAAG,KAAK,EACvB,YAAY,GAAG,KAAK,EACpB,eAAe,GAAG,IAAI,OAEvB,EADI,IAAI,cANT,iFAOC,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,
|
|
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,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,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAiH5D,MAAM,SAAS,GAAG,UAAU,CAC1B,CACE,EAOC,EACD,YAAY,EACZ,EAAE;QATF,EACE,SAAS,EACT,UAAU,GAAG,QAAQ,EACrB,eAAe,GAAG,KAAK,EACvB,YAAY,GAAG,KAAK,EACpB,eAAe,GAAG,IAAI,OAEvB,EADI,IAAI,cANT,iFAOC,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,aAAa,EAAE,GAAG,mBAAmB,CAAC,QAAQ,EAAE;QACtD,OAAO,EAAE,eAAe;KACzB,CAAC,CAAC;IAEH,OAAO,CACL,6BAAK,SAAS,EAAC,kCAAkC;QAC/C,6BAAK,SAAS,EAAC,kCAAkC;YAC/C,+CACM,IAAI,IACR,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,EAAE,CAAC,kBAAkB,EAAE,SAAS,EAAE;oBAC3C,iCAAiC,EAAE,YAAY;oBAC/C,oCAAoC,EAAE,eAAe;iBACtD,CAAC,kBACY,UAAU,EACxB,QAAQ,EAAE,aAAa,IACvB,CACE,CACF,CACP,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;AAEjC,OAAO,EACL,SAAS,EACT,gBAAgB,EAChB,cAAc,EACd,WAAW,EACX,cAAc,EACd,WAAW,EACX,cAAc,EACd,WAAW,GACZ,CAAC;AACF,eAAe,SAAS,CAAC"}
|
|
@@ -1,7 +1,13 @@
|
|
|
1
|
-
|
|
1
|
+
type UseTableKeyboardNavOptions = {
|
|
2
2
|
enabled: boolean;
|
|
3
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Custom callback to determine if navigation should be blocked.
|
|
5
|
+
* Called before default blocking logic.
|
|
6
|
+
*/
|
|
7
|
+
shouldBlockNavigation?: (event: KeyboardEvent) => boolean;
|
|
8
|
+
};
|
|
9
|
+
declare function useTableKeyboardNav(tableRef: HTMLTableElement | null, { enabled, shouldBlockNavigation: customBlockFn }: UseTableKeyboardNavOptions): {
|
|
4
10
|
tableTabIndex: number | undefined;
|
|
5
|
-
onFocus: () => Element | null | undefined;
|
|
6
11
|
};
|
|
7
12
|
export { useTableKeyboardNav };
|
|
13
|
+
export type { UseTableKeyboardNavOptions };
|