@react-aria/grid 3.0.0-beta.0 → 3.0.0-nightly-641446f65-240905
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/GridKeyboardDelegate.main.js +247 -0
- package/dist/GridKeyboardDelegate.main.js.map +1 -0
- package/dist/GridKeyboardDelegate.mjs +242 -0
- package/dist/GridKeyboardDelegate.module.js +242 -0
- package/dist/GridKeyboardDelegate.module.js.map +1 -0
- package/dist/ar-AE.main.js +15 -0
- package/dist/ar-AE.main.js.map +1 -0
- package/dist/ar-AE.mjs +17 -0
- package/dist/ar-AE.module.js +17 -0
- package/dist/ar-AE.module.js.map +1 -0
- package/dist/bg-BG.main.js +15 -0
- package/dist/bg-BG.main.js.map +1 -0
- package/dist/bg-BG.mjs +17 -0
- package/dist/bg-BG.module.js +17 -0
- package/dist/bg-BG.module.js.map +1 -0
- package/dist/cs-CZ.main.js +15 -0
- package/dist/cs-CZ.main.js.map +1 -0
- package/dist/cs-CZ.mjs +17 -0
- package/dist/cs-CZ.module.js +17 -0
- package/dist/cs-CZ.module.js.map +1 -0
- package/dist/da-DK.main.js +15 -0
- package/dist/da-DK.main.js.map +1 -0
- package/dist/da-DK.mjs +17 -0
- package/dist/da-DK.module.js +17 -0
- package/dist/da-DK.module.js.map +1 -0
- package/dist/de-DE.main.js +15 -0
- package/dist/de-DE.main.js.map +1 -0
- package/dist/de-DE.mjs +17 -0
- package/dist/de-DE.module.js +17 -0
- package/dist/de-DE.module.js.map +1 -0
- package/dist/el-GR.main.js +15 -0
- package/dist/el-GR.main.js.map +1 -0
- package/dist/el-GR.mjs +17 -0
- package/dist/el-GR.module.js +17 -0
- package/dist/el-GR.module.js.map +1 -0
- package/dist/en-US.main.js +15 -0
- package/dist/en-US.main.js.map +1 -0
- package/dist/en-US.mjs +17 -0
- package/dist/en-US.module.js +17 -0
- package/dist/en-US.module.js.map +1 -0
- package/dist/es-ES.main.js +15 -0
- package/dist/es-ES.main.js.map +1 -0
- package/dist/es-ES.mjs +17 -0
- package/dist/es-ES.module.js +17 -0
- package/dist/es-ES.module.js.map +1 -0
- package/dist/et-EE.main.js +15 -0
- package/dist/et-EE.main.js.map +1 -0
- package/dist/et-EE.mjs +17 -0
- package/dist/et-EE.module.js +17 -0
- package/dist/et-EE.module.js.map +1 -0
- package/dist/fi-FI.main.js +15 -0
- package/dist/fi-FI.main.js.map +1 -0
- package/dist/fi-FI.mjs +17 -0
- package/dist/fi-FI.module.js +17 -0
- package/dist/fi-FI.module.js.map +1 -0
- package/dist/fr-FR.main.js +15 -0
- package/dist/fr-FR.main.js.map +1 -0
- package/dist/fr-FR.mjs +17 -0
- package/dist/fr-FR.module.js +17 -0
- package/dist/fr-FR.module.js.map +1 -0
- package/dist/he-IL.main.js +15 -0
- package/dist/he-IL.main.js.map +1 -0
- package/dist/he-IL.mjs +17 -0
- package/dist/he-IL.module.js +17 -0
- package/dist/he-IL.module.js.map +1 -0
- package/dist/hr-HR.main.js +15 -0
- package/dist/hr-HR.main.js.map +1 -0
- package/dist/hr-HR.mjs +17 -0
- package/dist/hr-HR.module.js +17 -0
- package/dist/hr-HR.module.js.map +1 -0
- package/dist/hu-HU.main.js +15 -0
- package/dist/hu-HU.main.js.map +1 -0
- package/dist/hu-HU.mjs +17 -0
- package/dist/hu-HU.module.js +17 -0
- package/dist/hu-HU.module.js.map +1 -0
- package/dist/import.mjs +31 -0
- package/dist/intlStrings.main.js +108 -0
- package/dist/intlStrings.main.js.map +1 -0
- package/dist/intlStrings.mjs +110 -0
- package/dist/intlStrings.module.js +110 -0
- package/dist/intlStrings.module.js.map +1 -0
- package/dist/it-IT.main.js +15 -0
- package/dist/it-IT.main.js.map +1 -0
- package/dist/it-IT.mjs +17 -0
- package/dist/it-IT.module.js +17 -0
- package/dist/it-IT.module.js.map +1 -0
- package/dist/ja-JP.main.js +15 -0
- package/dist/ja-JP.main.js.map +1 -0
- package/dist/ja-JP.mjs +17 -0
- package/dist/ja-JP.module.js +17 -0
- package/dist/ja-JP.module.js.map +1 -0
- package/dist/ko-KR.main.js +15 -0
- package/dist/ko-KR.main.js.map +1 -0
- package/dist/ko-KR.mjs +17 -0
- package/dist/ko-KR.module.js +17 -0
- package/dist/ko-KR.module.js.map +1 -0
- package/dist/lt-LT.main.js +15 -0
- package/dist/lt-LT.main.js.map +1 -0
- package/dist/lt-LT.mjs +17 -0
- package/dist/lt-LT.module.js +17 -0
- package/dist/lt-LT.module.js.map +1 -0
- package/dist/lv-LV.main.js +15 -0
- package/dist/lv-LV.main.js.map +1 -0
- package/dist/lv-LV.mjs +17 -0
- package/dist/lv-LV.module.js +17 -0
- package/dist/lv-LV.module.js.map +1 -0
- package/dist/main.js +23 -825
- package/dist/main.js.map +1 -1
- package/dist/module.js +10 -775
- package/dist/module.js.map +1 -1
- package/dist/nb-NO.main.js +15 -0
- package/dist/nb-NO.main.js.map +1 -0
- package/dist/nb-NO.mjs +17 -0
- package/dist/nb-NO.module.js +17 -0
- package/dist/nb-NO.module.js.map +1 -0
- package/dist/nl-NL.main.js +15 -0
- package/dist/nl-NL.main.js.map +1 -0
- package/dist/nl-NL.mjs +17 -0
- package/dist/nl-NL.module.js +17 -0
- package/dist/nl-NL.module.js.map +1 -0
- package/dist/pl-PL.main.js +15 -0
- package/dist/pl-PL.main.js.map +1 -0
- package/dist/pl-PL.mjs +17 -0
- package/dist/pl-PL.module.js +17 -0
- package/dist/pl-PL.module.js.map +1 -0
- package/dist/pt-BR.main.js +15 -0
- package/dist/pt-BR.main.js.map +1 -0
- package/dist/pt-BR.mjs +17 -0
- package/dist/pt-BR.module.js +17 -0
- package/dist/pt-BR.module.js.map +1 -0
- package/dist/pt-PT.main.js +15 -0
- package/dist/pt-PT.main.js.map +1 -0
- package/dist/pt-PT.mjs +17 -0
- package/dist/pt-PT.module.js +17 -0
- package/dist/pt-PT.module.js.map +1 -0
- package/dist/ro-RO.main.js +15 -0
- package/dist/ro-RO.main.js.map +1 -0
- package/dist/ro-RO.mjs +17 -0
- package/dist/ro-RO.module.js +17 -0
- package/dist/ro-RO.module.js.map +1 -0
- package/dist/ru-RU.main.js +15 -0
- package/dist/ru-RU.main.js.map +1 -0
- package/dist/ru-RU.mjs +17 -0
- package/dist/ru-RU.module.js +17 -0
- package/dist/ru-RU.module.js.map +1 -0
- package/dist/sk-SK.main.js +15 -0
- package/dist/sk-SK.main.js.map +1 -0
- package/dist/sk-SK.mjs +17 -0
- package/dist/sk-SK.module.js +17 -0
- package/dist/sk-SK.module.js.map +1 -0
- package/dist/sl-SI.main.js +15 -0
- package/dist/sl-SI.main.js.map +1 -0
- package/dist/sl-SI.mjs +17 -0
- package/dist/sl-SI.module.js +17 -0
- package/dist/sl-SI.module.js.map +1 -0
- package/dist/sr-SP.main.js +15 -0
- package/dist/sr-SP.main.js.map +1 -0
- package/dist/sr-SP.mjs +17 -0
- package/dist/sr-SP.module.js +17 -0
- package/dist/sr-SP.module.js.map +1 -0
- package/dist/sv-SE.main.js +15 -0
- package/dist/sv-SE.main.js.map +1 -0
- package/dist/sv-SE.mjs +17 -0
- package/dist/sv-SE.module.js +17 -0
- package/dist/sv-SE.module.js.map +1 -0
- package/dist/tr-TR.main.js +15 -0
- package/dist/tr-TR.main.js.map +1 -0
- package/dist/tr-TR.mjs +17 -0
- package/dist/tr-TR.module.js +17 -0
- package/dist/tr-TR.module.js.map +1 -0
- package/dist/types.d.ts +115 -48
- package/dist/types.d.ts.map +1 -1
- package/dist/uk-UA.main.js +15 -0
- package/dist/uk-UA.main.js.map +1 -0
- package/dist/uk-UA.mjs +17 -0
- package/dist/uk-UA.module.js +17 -0
- package/dist/uk-UA.module.js.map +1 -0
- package/dist/useGrid.main.js +132 -0
- package/dist/useGrid.main.js.map +1 -0
- package/dist/useGrid.mjs +127 -0
- package/dist/useGrid.module.js +127 -0
- package/dist/useGrid.module.js.map +1 -0
- package/dist/useGridCell.main.js +220 -0
- package/dist/useGridCell.main.js.map +1 -0
- package/dist/useGridCell.mjs +215 -0
- package/dist/useGridCell.module.js +215 -0
- package/dist/useGridCell.module.js.map +1 -0
- package/dist/useGridRow.main.js +53 -0
- package/dist/useGridRow.main.js.map +1 -0
- package/dist/useGridRow.mjs +48 -0
- package/dist/useGridRow.module.js +48 -0
- package/dist/useGridRow.module.js.map +1 -0
- package/dist/useGridRowGroup.main.js +26 -0
- package/dist/useGridRowGroup.main.js.map +1 -0
- package/dist/useGridRowGroup.mjs +21 -0
- package/dist/useGridRowGroup.module.js +21 -0
- package/dist/useGridRowGroup.module.js.map +1 -0
- package/dist/useGridSelectionAnnouncement.main.js +94 -0
- package/dist/useGridSelectionAnnouncement.main.js.map +1 -0
- package/dist/useGridSelectionAnnouncement.mjs +89 -0
- package/dist/useGridSelectionAnnouncement.module.js +89 -0
- package/dist/useGridSelectionAnnouncement.module.js.map +1 -0
- package/dist/useGridSelectionCheckbox.main.js +39 -0
- package/dist/useGridSelectionCheckbox.main.js.map +1 -0
- package/dist/useGridSelectionCheckbox.mjs +34 -0
- package/dist/useGridSelectionCheckbox.module.js +34 -0
- package/dist/useGridSelectionCheckbox.module.js.map +1 -0
- package/dist/useHighlightSelectionDescription.main.js +55 -0
- package/dist/useHighlightSelectionDescription.main.js.map +1 -0
- package/dist/useHighlightSelectionDescription.mjs +50 -0
- package/dist/useHighlightSelectionDescription.module.js +50 -0
- package/dist/useHighlightSelectionDescription.module.js.map +1 -0
- package/dist/utils.main.js +20 -0
- package/dist/utils.main.js.map +1 -0
- package/dist/utils.mjs +15 -0
- package/dist/utils.module.js +15 -0
- package/dist/utils.module.js.map +1 -0
- package/dist/zh-CN.main.js +15 -0
- package/dist/zh-CN.main.js.map +1 -0
- package/dist/zh-CN.mjs +17 -0
- package/dist/zh-CN.module.js +17 -0
- package/dist/zh-CN.module.js.map +1 -0
- package/dist/zh-TW.main.js +15 -0
- package/dist/zh-TW.main.js.map +1 -0
- package/dist/zh-TW.mjs +17 -0
- package/dist/zh-TW.module.js +17 -0
- package/dist/zh-TW.module.js.map +1 -0
- package/package.json +23 -15
- package/src/GridKeyboardDelegate.ts +93 -83
- package/src/index.ts +17 -5
- package/src/useGrid.ts +78 -81
- package/src/useGridCell.ts +96 -51
- package/src/useGridRow.ts +33 -28
- package/src/useGridRowGroup.ts +3 -3
- package/src/useGridSelectionAnnouncement.ts +115 -0
- package/src/useGridSelectionCheckbox.ts +48 -0
- package/src/useHighlightSelectionDescription.ts +52 -0
- package/src/utils.ts +13 -3
- package/LICENSE +0 -201
package/dist/module.js
CHANGED
|
@@ -1,376 +1,11 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
9
|
-
import _babelRuntimeHelpersEsmExtends from "@babel/runtime/helpers/esm/extends";
|
|
10
|
-
import { Rect } from "@react-stately/virtualizer";
|
|
11
|
-
export class GridKeyboardDelegate {
|
|
12
|
-
constructor(options) {
|
|
13
|
-
this.collection = void 0;
|
|
14
|
-
this.disabledKeys = void 0;
|
|
15
|
-
this.ref = void 0;
|
|
16
|
-
this.direction = void 0;
|
|
17
|
-
this.collator = void 0;
|
|
18
|
-
this.layout = void 0;
|
|
19
|
-
this.focusMode = void 0;
|
|
20
|
-
this.collection = options.collection;
|
|
21
|
-
this.disabledKeys = options.disabledKeys;
|
|
22
|
-
this.ref = options.ref;
|
|
23
|
-
this.direction = options.direction;
|
|
24
|
-
this.collator = options.collator;
|
|
25
|
-
this.layout = options.layout;
|
|
26
|
-
this.focusMode = options.focusMode || 'row';
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
isCell(node) {
|
|
30
|
-
return node.type === 'cell';
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
isRow(node) {
|
|
34
|
-
return node.type === 'row' || node.type === 'item';
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
findPreviousKey(fromKey, pred) {
|
|
38
|
-
let key = fromKey != null ? this.collection.getKeyBefore(fromKey) : this.collection.getLastKey();
|
|
39
|
-
|
|
40
|
-
while (key != null) {
|
|
41
|
-
let item = this.collection.getItem(key);
|
|
42
|
-
|
|
43
|
-
if (!pred || pred(item)) {
|
|
44
|
-
return key;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
key = this.collection.getKeyBefore(key);
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
findNextKey(fromKey, pred) {
|
|
52
|
-
let key = fromKey != null ? this.collection.getKeyAfter(fromKey) : this.collection.getFirstKey();
|
|
53
|
-
|
|
54
|
-
while (key != null) {
|
|
55
|
-
let item = this.collection.getItem(key);
|
|
56
|
-
|
|
57
|
-
if (!pred || pred(item)) {
|
|
58
|
-
return key;
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
key = this.collection.getKeyAfter(key);
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
getKeyBelow(key) {
|
|
66
|
-
let startItem = this.collection.getItem(key);
|
|
67
|
-
|
|
68
|
-
if (!startItem) {
|
|
69
|
-
return;
|
|
70
|
-
} // If focus was on a cell, start searching from the parent row
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
if (this.isCell(startItem)) {
|
|
74
|
-
key = startItem.parentKey;
|
|
75
|
-
} // Find the next item
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
key = this.findNextKey(key);
|
|
79
|
-
|
|
80
|
-
if (key != null) {
|
|
81
|
-
// If focus was on a cell, focus the cell with the same index in the next row.
|
|
82
|
-
if (this.isCell(startItem)) {
|
|
83
|
-
let item = this.collection.getItem(key);
|
|
84
|
-
return [...item.childNodes][startItem.index].key;
|
|
85
|
-
} // Otherwise, focus the next row
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
if (this.focusMode === 'row') {
|
|
89
|
-
return key;
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
getKeyAbove(key) {
|
|
95
|
-
let startItem = this.collection.getItem(key);
|
|
96
|
-
|
|
97
|
-
if (!startItem) {
|
|
98
|
-
return;
|
|
99
|
-
} // If focus is on a cell, start searching from the parent row
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
if (this.isCell(startItem)) {
|
|
103
|
-
key = startItem.parentKey;
|
|
104
|
-
} // Find the previous item
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
key = this.findPreviousKey(key);
|
|
108
|
-
|
|
109
|
-
if (key != null) {
|
|
110
|
-
// If focus was on a cell, focus the cell with the same index in the previous row.
|
|
111
|
-
if (this.isCell(startItem)) {
|
|
112
|
-
let item = this.collection.getItem(key);
|
|
113
|
-
return [...item.childNodes][startItem.index].key;
|
|
114
|
-
} // Otherwise, focus the previous row
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
if (this.focusMode === 'row') {
|
|
118
|
-
return key;
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
getKeyRightOf(key) {
|
|
124
|
-
let item = this.collection.getItem(key);
|
|
125
|
-
|
|
126
|
-
if (!item) {
|
|
127
|
-
return;
|
|
128
|
-
} // If focus is on a row, focus the first child cell.
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
if (this.isRow(item)) {
|
|
132
|
-
let children = [...item.childNodes];
|
|
133
|
-
return this.direction === 'rtl' ? children[children.length - 1].key : children[0].key;
|
|
134
|
-
} // If focus is on a cell, focus the next cell if any,
|
|
135
|
-
// otherwise focus the parent row.
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
if (this.isCell(item)) {
|
|
139
|
-
let parent = this.collection.getItem(item.parentKey);
|
|
140
|
-
let children = [...parent.childNodes];
|
|
141
|
-
let next = this.direction === 'rtl' ? children[item.index - 1] : children[item.index + 1];
|
|
142
|
-
|
|
143
|
-
if (next) {
|
|
144
|
-
return next.key;
|
|
145
|
-
} // focus row only if focusMode is set to row
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
if (this.focusMode === 'row') {
|
|
149
|
-
return item.parentKey;
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
return this.direction === 'rtl' ? this.getFirstKey(key) : this.getLastKey(key);
|
|
153
|
-
}
|
|
154
|
-
}
|
|
155
|
-
|
|
156
|
-
getKeyLeftOf(key) {
|
|
157
|
-
let item = this.collection.getItem(key);
|
|
158
|
-
|
|
159
|
-
if (!item) {
|
|
160
|
-
return;
|
|
161
|
-
} // If focus is on a row, focus the last child cell.
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
if (this.isRow(item)) {
|
|
165
|
-
let children = [...item.childNodes];
|
|
166
|
-
return this.direction === 'rtl' ? children[0].key : children[children.length - 1].key;
|
|
167
|
-
} // If focus is on a cell, focus the previous cell if any,
|
|
168
|
-
// otherwise focus the parent row.
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
if (this.isCell(item)) {
|
|
172
|
-
let parent = this.collection.getItem(item.parentKey);
|
|
173
|
-
let children = [...parent.childNodes];
|
|
174
|
-
let prev = this.direction === 'rtl' ? children[item.index + 1] : children[item.index - 1];
|
|
175
|
-
|
|
176
|
-
if (prev) {
|
|
177
|
-
return prev.key;
|
|
178
|
-
} // focus row only if focusMode is set to row
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
if (this.focusMode === 'row') {
|
|
182
|
-
return item.parentKey;
|
|
183
|
-
}
|
|
184
|
-
|
|
185
|
-
return this.direction === 'rtl' ? this.getLastKey(key) : this.getFirstKey(key);
|
|
186
|
-
}
|
|
187
|
-
}
|
|
188
|
-
|
|
189
|
-
getFirstKey(key, global) {
|
|
190
|
-
let item;
|
|
191
|
-
|
|
192
|
-
if (key != null) {
|
|
193
|
-
item = this.collection.getItem(key);
|
|
194
|
-
|
|
195
|
-
if (!item) {
|
|
196
|
-
return;
|
|
197
|
-
} // If global flag is not set, and a cell is currently focused,
|
|
198
|
-
// move focus to the first cell in the parent row.
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
if (this.isCell(item) && !global) {
|
|
202
|
-
let parent = this.collection.getItem(item.parentKey);
|
|
203
|
-
return [...parent.childNodes][0].key;
|
|
204
|
-
}
|
|
205
|
-
} // Find the first row
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
key = this.findNextKey(); // If global flag is set (or if focus mode is cell), focus the first cell in the first row.
|
|
209
|
-
|
|
210
|
-
if (key != null && item && this.isCell(item) && global || this.focusMode === 'cell') {
|
|
211
|
-
let item = this.collection.getItem(key);
|
|
212
|
-
key = [...item.childNodes][0].key;
|
|
213
|
-
} // Otherwise, focus the row itself.
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
return key;
|
|
217
|
-
}
|
|
218
|
-
|
|
219
|
-
getLastKey(key, global) {
|
|
220
|
-
let item;
|
|
221
|
-
|
|
222
|
-
if (key != null) {
|
|
223
|
-
item = this.collection.getItem(key);
|
|
224
|
-
|
|
225
|
-
if (!item) {
|
|
226
|
-
return;
|
|
227
|
-
} // If global flag is not set, and a cell is currently focused,
|
|
228
|
-
// move focus to the last cell in the parent row.
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
if (this.isCell(item) && !global) {
|
|
232
|
-
let parent = this.collection.getItem(item.parentKey);
|
|
233
|
-
let children = [...parent.childNodes];
|
|
234
|
-
return children[children.length - 1].key;
|
|
235
|
-
}
|
|
236
|
-
} // Find the last row
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
key = this.findPreviousKey(); // If global flag is set (or if focus mode is cell), focus the last cell in the last row.
|
|
240
|
-
|
|
241
|
-
if (key != null && item && this.isCell(item) && global || this.focusMode === 'cell') {
|
|
242
|
-
let item = this.collection.getItem(key);
|
|
243
|
-
let children = [...item.childNodes];
|
|
244
|
-
key = children[children.length - 1].key;
|
|
245
|
-
} // Otherwise, focus the row itself.
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
return key;
|
|
249
|
-
}
|
|
250
|
-
|
|
251
|
-
getItem(key) {
|
|
252
|
-
return this.ref.current.querySelector("[data-key=\"" + key + "\"]");
|
|
253
|
-
}
|
|
254
|
-
|
|
255
|
-
getItemRect(key) {
|
|
256
|
-
if (this.layout) {
|
|
257
|
-
var _this$layout$getLayou;
|
|
258
|
-
|
|
259
|
-
return (_this$layout$getLayou = this.layout.getLayoutInfo(key)) == null ? void 0 : _this$layout$getLayou.rect;
|
|
260
|
-
}
|
|
261
|
-
|
|
262
|
-
let item = this.getItem(key);
|
|
263
|
-
|
|
264
|
-
if (item) {
|
|
265
|
-
return new Rect(item.offsetLeft, item.offsetTop, item.offsetWidth, item.offsetHeight);
|
|
266
|
-
}
|
|
267
|
-
}
|
|
268
|
-
|
|
269
|
-
getPageHeight() {
|
|
270
|
-
var _this$ref, _this$ref$current;
|
|
271
|
-
|
|
272
|
-
if (this.layout) {
|
|
273
|
-
var _this$layout$virtuali;
|
|
274
|
-
|
|
275
|
-
return (_this$layout$virtuali = this.layout.virtualizer) == null ? void 0 : _this$layout$virtuali.visibleRect.height;
|
|
276
|
-
}
|
|
277
|
-
|
|
278
|
-
return (_this$ref = this.ref) == null ? void 0 : (_this$ref$current = _this$ref.current) == null ? void 0 : _this$ref$current.offsetHeight;
|
|
279
|
-
}
|
|
280
|
-
|
|
281
|
-
getContentHeight() {
|
|
282
|
-
var _this$ref2, _this$ref2$current;
|
|
283
|
-
|
|
284
|
-
if (this.layout) {
|
|
285
|
-
return this.layout.getContentSize().height;
|
|
286
|
-
}
|
|
287
|
-
|
|
288
|
-
return (_this$ref2 = this.ref) == null ? void 0 : (_this$ref2$current = _this$ref2.current) == null ? void 0 : _this$ref2$current.scrollHeight;
|
|
289
|
-
}
|
|
290
|
-
|
|
291
|
-
getKeyPageAbove(key) {
|
|
292
|
-
let itemRect = this.getItemRect(key);
|
|
293
|
-
|
|
294
|
-
if (!itemRect) {
|
|
295
|
-
return null;
|
|
296
|
-
}
|
|
297
|
-
|
|
298
|
-
let pageY = Math.max(0, itemRect.maxY - this.getPageHeight());
|
|
299
|
-
|
|
300
|
-
while (itemRect && itemRect.y > pageY) {
|
|
301
|
-
key = this.getKeyAbove(key);
|
|
302
|
-
itemRect = this.getItemRect(key);
|
|
303
|
-
}
|
|
304
|
-
|
|
305
|
-
return key;
|
|
306
|
-
}
|
|
307
|
-
|
|
308
|
-
getKeyPageBelow(key) {
|
|
309
|
-
let itemRect = this.getItemRect(key);
|
|
310
|
-
|
|
311
|
-
if (!itemRect) {
|
|
312
|
-
return null;
|
|
313
|
-
}
|
|
314
|
-
|
|
315
|
-
let pageHeight = this.getPageHeight();
|
|
316
|
-
let pageY = Math.min(this.getContentHeight(), itemRect.y + pageHeight);
|
|
317
|
-
|
|
318
|
-
while (itemRect && itemRect.maxY < pageY) {
|
|
319
|
-
let nextKey = this.getKeyBelow(key);
|
|
320
|
-
itemRect = this.getItemRect(nextKey); // Guard against case where maxY of the last key is barely less than pageY due to rounding
|
|
321
|
-
// and thus it attempts to set key to null
|
|
322
|
-
|
|
323
|
-
if (nextKey != null) {
|
|
324
|
-
key = nextKey;
|
|
325
|
-
}
|
|
326
|
-
}
|
|
327
|
-
|
|
328
|
-
return key;
|
|
329
|
-
}
|
|
330
|
-
|
|
331
|
-
getKeyForSearch(search, fromKey) {
|
|
332
|
-
if (!this.collator) {
|
|
333
|
-
return null;
|
|
334
|
-
}
|
|
335
|
-
|
|
336
|
-
let collection = this.collection;
|
|
337
|
-
let key = fromKey != null ? fromKey : this.getFirstKey(); // If the starting key is a cell, search from its parent row.
|
|
338
|
-
|
|
339
|
-
let startItem = collection.getItem(key);
|
|
340
|
-
|
|
341
|
-
if (startItem.type === 'cell') {
|
|
342
|
-
key = startItem.parentKey;
|
|
343
|
-
}
|
|
344
|
-
|
|
345
|
-
let hasWrapped = false;
|
|
346
|
-
|
|
347
|
-
while (key != null) {
|
|
348
|
-
let item = collection.getItem(key); // check row text value for match
|
|
349
|
-
|
|
350
|
-
if (item.textValue) {
|
|
351
|
-
let substring = item.textValue.slice(0, search.length);
|
|
352
|
-
|
|
353
|
-
if (this.collator.compare(substring, search) === 0) {
|
|
354
|
-
if (this.isRow(item) && this.focusMode === 'cell') {
|
|
355
|
-
return [...item.childNodes][0].key;
|
|
356
|
-
}
|
|
357
|
-
|
|
358
|
-
return item.key;
|
|
359
|
-
}
|
|
360
|
-
}
|
|
361
|
-
|
|
362
|
-
key = this.findNextKey(key); // Wrap around when reaching the end of the collection
|
|
363
|
-
|
|
364
|
-
if (key == null && !hasWrapped) {
|
|
365
|
-
key = this.getFirstKey();
|
|
366
|
-
hasWrapped = true;
|
|
367
|
-
}
|
|
368
|
-
}
|
|
369
|
-
|
|
370
|
-
return null;
|
|
371
|
-
}
|
|
372
|
-
|
|
373
|
-
}
|
|
1
|
+
import {GridKeyboardDelegate as $d1c300d9c497e402$export$de9feff04fda126e} from "./GridKeyboardDelegate.module.js";
|
|
2
|
+
import {useGrid as $83c6e2eafa584c67$export$f6b86a04e5d66d90} from "./useGrid.module.js";
|
|
3
|
+
import {useGridRowGroup as $e45487f8ba1cbdbf$export$d3037f5d3f3e51bf} from "./useGridRowGroup.module.js";
|
|
4
|
+
import {useGridRow as $4159a7a9cbb0cc18$export$96357d5a73f686fa} from "./useGridRow.module.js";
|
|
5
|
+
import {useGridCell as $ab90dcbc1b5466d0$export$c7e10bfc0c59f67c} from "./useGridCell.module.js";
|
|
6
|
+
import {useGridSelectionCheckbox as $7cb39d07f245a780$export$70e2eed1a92976ad} from "./useGridSelectionCheckbox.module.js";
|
|
7
|
+
import {useHighlightSelectionDescription as $5b9b5b5723db6ae1$export$be42ebdab07ae4c2} from "./useHighlightSelectionDescription.module.js";
|
|
8
|
+
import {useGridSelectionAnnouncement as $92599c3fd427b763$export$137e594ef3218a10} from "./useGridSelectionAnnouncement.module.js";
|
|
374
9
|
|
|
375
10
|
/*
|
|
376
11
|
* Copyright 2020 Adobe. All rights reserved.
|
|
@@ -382,415 +17,15 @@ export class GridKeyboardDelegate {
|
|
|
382
17
|
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
383
18
|
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
384
19
|
* governing permissions and limitations under the License.
|
|
385
|
-
*/
|
|
386
|
-
// Used to share keyboard delegate between useGrid and useGridCell
|
|
387
|
-
const $c7c16c1fc27e25a205a277212c8e7cfd$export$gridKeyboardDelegates = new WeakMap();
|
|
388
|
-
// ASSET: /Users/govett/dev/react-spectrum-v3/packages/@react-aria/grid/intl/en-US.json
|
|
389
|
-
var $c220079f51d67fa1d00cfe9981441af$exports = {};
|
|
390
|
-
$c220079f51d67fa1d00cfe9981441af$exports = JSON.parse("{\"selectedCount\":\"{count, plural, =0 {No items selected} one {# item selected} other {# items selected}}.\",\"selectedAll\":\"All items selected.\",\"selectedItem\":\"{item} selected.\",\"deselectedItem\":\"{item} not selected.\"}");
|
|
391
|
-
// @ts-ignore
|
|
392
|
-
const $e3c4cce891c32069b0b54eddd405e76$var$intlMessages = {
|
|
393
|
-
"en-US": _babelRuntimeHelpersEsmInteropRequireDefault($c220079f51d67fa1d00cfe9981441af$exports).default
|
|
394
|
-
};
|
|
395
|
-
|
|
396
|
-
/**
|
|
397
|
-
* Provides the behavior and accessibility implementation for a grid component.
|
|
398
|
-
* A grid displays data in one or more rows and columns and enables a user to navigate its contents via directional navigation keys.
|
|
399
|
-
* @param props - Props for the grid.
|
|
400
|
-
* @param state - State for the grid, as returned by `useGridState`.
|
|
401
|
-
*/
|
|
402
|
-
export function useGrid(props, state) {
|
|
403
|
-
let {
|
|
404
|
-
ref,
|
|
405
|
-
isVirtualized,
|
|
406
|
-
keyboardDelegate,
|
|
407
|
-
focusMode,
|
|
408
|
-
getRowText = key => {
|
|
409
|
-
var _state$collection$get;
|
|
410
|
-
|
|
411
|
-
return (_state$collection$get = state.collection.getItem(key)) == null ? void 0 : _state$collection$get.textValue;
|
|
412
|
-
}
|
|
413
|
-
} = props;
|
|
414
|
-
let formatMessage = useMessageFormatter($e3c4cce891c32069b0b54eddd405e76$var$intlMessages);
|
|
415
|
-
|
|
416
|
-
if (!props['aria-label'] && !props['aria-labelledby']) {
|
|
417
|
-
console.warn('An aria-label or aria-labelledby prop is required for accessibility.');
|
|
418
|
-
} // By default, a KeyboardDelegate is provided which uses the DOM to query layout information (e.g. for page up/page down).
|
|
419
|
-
// When virtualized, the layout object will be passed in as a prop and override this.
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
let collator = useCollator({
|
|
423
|
-
usage: 'search',
|
|
424
|
-
sensitivity: 'base'
|
|
425
|
-
});
|
|
426
|
-
let {
|
|
427
|
-
direction
|
|
428
|
-
} = useLocale();
|
|
429
|
-
let delegate = useMemo(() => keyboardDelegate || new GridKeyboardDelegate({
|
|
430
|
-
collection: state.collection,
|
|
431
|
-
disabledKeys: state.disabledKeys,
|
|
432
|
-
ref,
|
|
433
|
-
direction,
|
|
434
|
-
collator,
|
|
435
|
-
focusMode
|
|
436
|
-
}), [keyboardDelegate, state.collection, state.disabledKeys, ref, direction, collator, focusMode]);
|
|
437
|
-
let {
|
|
438
|
-
collectionProps
|
|
439
|
-
} = useSelectableCollection({
|
|
440
|
-
ref,
|
|
441
|
-
selectionManager: state.selectionManager,
|
|
442
|
-
keyboardDelegate: delegate
|
|
443
|
-
});
|
|
444
|
-
let id = useId();
|
|
445
|
-
$c7c16c1fc27e25a205a277212c8e7cfd$export$gridKeyboardDelegates.set(state, delegate);
|
|
446
|
-
let domProps = filterDOMProps(props, {
|
|
447
|
-
labelable: true
|
|
448
|
-
});
|
|
449
|
-
let gridProps = mergeProps(domProps, _babelRuntimeHelpersEsmExtends({
|
|
450
|
-
role: 'grid',
|
|
451
|
-
id,
|
|
452
|
-
'aria-multiselectable': state.selectionManager.selectionMode === 'multiple' ? 'true' : undefined
|
|
453
|
-
}, collectionProps));
|
|
454
|
-
|
|
455
|
-
if (isVirtualized) {
|
|
456
|
-
gridProps['aria-rowcount'] = state.collection.size;
|
|
457
|
-
gridProps['aria-colcount'] = state.collection.columnCount;
|
|
458
|
-
} // Many screen readers do not announce when items in a grid are selected/deselected.
|
|
459
|
-
// We do this using an ARIA live region.
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
let selection = state.selectionManager.rawSelection;
|
|
463
|
-
let lastSelection = useRef(selection);
|
|
464
|
-
useUpdateEffect(() => {
|
|
465
|
-
if (!state.selectionManager.isFocused) {
|
|
466
|
-
return;
|
|
467
|
-
}
|
|
468
|
-
|
|
469
|
-
let addedKeys = $e3c4cce891c32069b0b54eddd405e76$var$diffSelection(selection, lastSelection.current);
|
|
470
|
-
let removedKeys = $e3c4cce891c32069b0b54eddd405e76$var$diffSelection(lastSelection.current, selection); // If adding or removing a single row from the selection, announce the name of that item.
|
|
471
|
-
|
|
472
|
-
let messages = [];
|
|
473
|
-
|
|
474
|
-
if (addedKeys.size === 1 && removedKeys.size === 0) {
|
|
475
|
-
let addedText = getRowText(addedKeys.keys().next().value);
|
|
476
|
-
|
|
477
|
-
if (addedText) {
|
|
478
|
-
messages.push(formatMessage('selectedItem', {
|
|
479
|
-
item: addedText
|
|
480
|
-
}));
|
|
481
|
-
}
|
|
482
|
-
} else if (removedKeys.size === 1 && addedKeys.size === 0) {
|
|
483
|
-
let removedText = getRowText(removedKeys.keys().next().value);
|
|
484
|
-
|
|
485
|
-
if (removedText) {
|
|
486
|
-
messages.push(formatMessage('deselectedItem', {
|
|
487
|
-
item: removedText
|
|
488
|
-
}));
|
|
489
|
-
}
|
|
490
|
-
} // Announce how many items are selected, except when selecting the first item.
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
if (state.selectionManager.selectionMode === 'multiple') {
|
|
494
|
-
if (messages.length === 0 || selection === 'all' || selection.size > 1 || lastSelection.current === 'all' || lastSelection.current.size > 1) {
|
|
495
|
-
messages.push(selection === 'all' ? formatMessage('selectedAll') : formatMessage('selectedCount', {
|
|
496
|
-
count: selection.size
|
|
497
|
-
}));
|
|
498
|
-
}
|
|
499
|
-
}
|
|
500
|
-
|
|
501
|
-
if (messages.length > 0) {
|
|
502
|
-
announce(messages.join(' '));
|
|
503
|
-
}
|
|
504
|
-
|
|
505
|
-
lastSelection.current = selection;
|
|
506
|
-
}, [selection]);
|
|
507
|
-
return {
|
|
508
|
-
gridProps
|
|
509
|
-
};
|
|
510
|
-
}
|
|
511
|
-
|
|
512
|
-
function $e3c4cce891c32069b0b54eddd405e76$var$diffSelection(a, b) {
|
|
513
|
-
let res = new Set();
|
|
514
|
-
|
|
515
|
-
if (a === 'all' || b === 'all') {
|
|
516
|
-
return res;
|
|
517
|
-
}
|
|
518
|
-
|
|
519
|
-
for (let key of a.keys()) {
|
|
520
|
-
if (!b.has(key)) {
|
|
521
|
-
res.add(key);
|
|
522
|
-
}
|
|
523
|
-
}
|
|
524
|
-
|
|
525
|
-
return res;
|
|
526
|
-
}
|
|
527
|
-
|
|
528
|
-
/**
|
|
529
|
-
* Provides the accessibility implementation for a row group in a grid.
|
|
530
|
-
*/
|
|
531
|
-
export function useGridRowGroup() {
|
|
532
|
-
return {
|
|
533
|
-
rowGroupProps: {
|
|
534
|
-
role: 'rowgroup'
|
|
535
|
-
}
|
|
536
|
-
};
|
|
537
|
-
}
|
|
538
|
-
|
|
539
|
-
/**
|
|
540
|
-
* Provides the behavior and accessibility implementation for a row in a grid.
|
|
541
|
-
* @param props - Props for the row.
|
|
542
|
-
* @param state - State of the parent grid, as returned by `useGridState`.
|
|
543
|
-
*/
|
|
544
|
-
export function useGridRow(props, state) {
|
|
545
|
-
let {
|
|
546
|
-
node,
|
|
547
|
-
ref,
|
|
548
|
-
isVirtualized,
|
|
549
|
-
isSelected,
|
|
550
|
-
isDisabled,
|
|
551
|
-
shouldSelectOnPressUp
|
|
552
|
-
} = props;
|
|
553
|
-
let {
|
|
554
|
-
itemProps
|
|
555
|
-
} = useSelectableItem({
|
|
556
|
-
selectionManager: state.selectionManager,
|
|
557
|
-
key: node.key,
|
|
558
|
-
ref,
|
|
559
|
-
isVirtualized,
|
|
560
|
-
shouldSelectOnPressUp
|
|
561
|
-
}); // TODO: move into useSelectableItem?
|
|
562
|
-
|
|
563
|
-
let {
|
|
564
|
-
pressProps
|
|
565
|
-
} = usePress(_babelRuntimeHelpersEsmExtends({}, itemProps, {
|
|
566
|
-
isDisabled
|
|
567
|
-
}));
|
|
568
|
-
|
|
569
|
-
let rowProps = _babelRuntimeHelpersEsmExtends({
|
|
570
|
-
role: 'row',
|
|
571
|
-
'aria-selected': isSelected
|
|
572
|
-
}, pressProps);
|
|
573
|
-
|
|
574
|
-
if (isVirtualized) {
|
|
575
|
-
rowProps['aria-rowindex'] = node.index + 1; // aria-rowindex is 1 based
|
|
576
|
-
}
|
|
577
|
-
|
|
578
|
-
return {
|
|
579
|
-
rowProps
|
|
580
|
-
};
|
|
581
|
-
}
|
|
582
|
-
|
|
583
|
-
/**
|
|
584
|
-
* Provides the behavior and accessibility implementation for a cell in a grid.
|
|
585
|
-
* @param props - Props for the cell.
|
|
586
|
-
* @param state - State of the parent grid, as returned by `useGridState`.
|
|
587
|
-
*/
|
|
588
|
-
export function useGridCell(props, state) {
|
|
589
|
-
let {
|
|
590
|
-
node,
|
|
591
|
-
ref,
|
|
592
|
-
isVirtualized,
|
|
593
|
-
isDisabled,
|
|
594
|
-
focusMode = 'child',
|
|
595
|
-
shouldSelectOnPressUp
|
|
596
|
-
} = props;
|
|
597
|
-
let {
|
|
598
|
-
direction
|
|
599
|
-
} = useLocale();
|
|
600
|
-
let keyboardDelegate = $c7c16c1fc27e25a205a277212c8e7cfd$export$gridKeyboardDelegates.get(state); // Handles focusing the cell. If there is a focusable child,
|
|
601
|
-
// it is focused, otherwise the cell itself is focused.
|
|
602
|
-
|
|
603
|
-
let focus = () => {
|
|
604
|
-
let treeWalker = getFocusableTreeWalker(ref.current);
|
|
605
|
-
|
|
606
|
-
if (focusMode === 'child') {
|
|
607
|
-
let focusable = state.selectionManager.childFocusStrategy === 'last' ? $c46764dc2253b1b174632a30143c6340$var$last(treeWalker) : treeWalker.firstChild();
|
|
608
|
-
|
|
609
|
-
if (focusable) {
|
|
610
|
-
focusSafely(focusable);
|
|
611
|
-
return;
|
|
612
|
-
}
|
|
613
|
-
}
|
|
614
|
-
|
|
615
|
-
if (!ref.current.contains(document.activeElement)) {
|
|
616
|
-
focusSafely(ref.current);
|
|
617
|
-
}
|
|
618
|
-
};
|
|
619
|
-
|
|
620
|
-
let {
|
|
621
|
-
itemProps
|
|
622
|
-
} = useSelectableItem({
|
|
623
|
-
selectionManager: state.selectionManager,
|
|
624
|
-
key: node.key,
|
|
625
|
-
ref,
|
|
626
|
-
isVirtualized,
|
|
627
|
-
focus,
|
|
628
|
-
shouldSelectOnPressUp
|
|
629
|
-
}); // TODO: move into useSelectableItem?
|
|
630
|
-
|
|
631
|
-
let {
|
|
632
|
-
pressProps
|
|
633
|
-
} = usePress(_babelRuntimeHelpersEsmExtends({}, itemProps, {
|
|
634
|
-
isDisabled
|
|
635
|
-
}));
|
|
636
|
-
|
|
637
|
-
let onKeyDown = e => {
|
|
638
|
-
if (!e.currentTarget.contains(e.target)) {
|
|
639
|
-
return;
|
|
640
|
-
}
|
|
641
|
-
|
|
642
|
-
let walker = getFocusableTreeWalker(ref.current);
|
|
643
|
-
walker.currentNode = document.activeElement;
|
|
644
|
-
|
|
645
|
-
switch (e.key) {
|
|
646
|
-
case 'ArrowLeft':
|
|
647
|
-
{
|
|
648
|
-
// Find the next focusable element within the cell.
|
|
649
|
-
let focusable = direction === 'rtl' ? walker.nextNode() : walker.previousNode(); // Don't focus the cell itself if focusMode is "child"
|
|
650
|
-
|
|
651
|
-
if (focusMode === 'child' && focusable === ref.current) {
|
|
652
|
-
focusable = null;
|
|
653
|
-
}
|
|
654
|
-
|
|
655
|
-
if (focusable) {
|
|
656
|
-
e.preventDefault();
|
|
657
|
-
e.stopPropagation();
|
|
658
|
-
focusSafely(focusable);
|
|
659
|
-
} else {
|
|
660
|
-
// If there is no next focusable child, then move to the next cell to the left of this one.
|
|
661
|
-
// This will be handled by useSelectableCollection. However, if there is no cell to the left
|
|
662
|
-
// of this one, only one column, and the grid doesn't focus rows, then the next key will be the
|
|
663
|
-
// same as this one. In that case we need to handle focusing either the cell or the first/last
|
|
664
|
-
// child, depending on the focus mode.
|
|
665
|
-
let prev = keyboardDelegate.getKeyLeftOf(node.key);
|
|
666
|
-
|
|
667
|
-
if (prev !== node.key) {
|
|
668
|
-
break;
|
|
669
|
-
}
|
|
670
|
-
|
|
671
|
-
e.preventDefault();
|
|
672
|
-
e.stopPropagation();
|
|
673
|
-
|
|
674
|
-
if (focusMode === 'cell' && direction === 'rtl') {
|
|
675
|
-
focusSafely(ref.current);
|
|
676
|
-
} else {
|
|
677
|
-
walker.currentNode = ref.current;
|
|
678
|
-
focusable = direction === 'rtl' ? walker.firstChild() : $c46764dc2253b1b174632a30143c6340$var$last(walker);
|
|
679
|
-
|
|
680
|
-
if (focusable) {
|
|
681
|
-
focusSafely(focusable);
|
|
682
|
-
}
|
|
683
|
-
}
|
|
684
|
-
}
|
|
685
|
-
|
|
686
|
-
break;
|
|
687
|
-
}
|
|
688
|
-
|
|
689
|
-
case 'ArrowRight':
|
|
690
|
-
{
|
|
691
|
-
let focusable = direction === 'rtl' ? walker.previousNode() : walker.nextNode();
|
|
692
|
-
|
|
693
|
-
if (focusMode === 'child' && focusable === ref.current) {
|
|
694
|
-
focusable = null;
|
|
695
|
-
}
|
|
696
|
-
|
|
697
|
-
if (focusable) {
|
|
698
|
-
e.preventDefault();
|
|
699
|
-
e.stopPropagation();
|
|
700
|
-
focusSafely(focusable);
|
|
701
|
-
} else {
|
|
702
|
-
let next = keyboardDelegate.getKeyRightOf(node.key);
|
|
703
|
-
|
|
704
|
-
if (next !== node.key) {
|
|
705
|
-
break;
|
|
706
|
-
}
|
|
707
|
-
|
|
708
|
-
e.preventDefault();
|
|
709
|
-
e.stopPropagation();
|
|
710
|
-
|
|
711
|
-
if (focusMode === 'cell' && direction === 'ltr') {
|
|
712
|
-
focusSafely(ref.current);
|
|
713
|
-
} else {
|
|
714
|
-
walker.currentNode = ref.current;
|
|
715
|
-
focusable = direction === 'rtl' ? $c46764dc2253b1b174632a30143c6340$var$last(walker) : walker.firstChild();
|
|
716
|
-
|
|
717
|
-
if (focusable) {
|
|
718
|
-
focusSafely(focusable);
|
|
719
|
-
}
|
|
720
|
-
}
|
|
721
|
-
}
|
|
722
|
-
|
|
723
|
-
break;
|
|
724
|
-
}
|
|
725
|
-
|
|
726
|
-
case 'ArrowUp':
|
|
727
|
-
case 'ArrowDown':
|
|
728
|
-
// Prevent this event from reaching cell children, e.g. menu buttons. We want arrow keys to navigate
|
|
729
|
-
// to the cell above/below instead. We need to re-dispatch the event from a higher parent so it still
|
|
730
|
-
// bubbles and gets handled by useSelectableCollection.
|
|
731
|
-
if (!e.altKey && ref.current.contains(e.target)) {
|
|
732
|
-
e.stopPropagation();
|
|
733
|
-
e.preventDefault();
|
|
734
|
-
ref.current.parentElement.dispatchEvent(new KeyboardEvent(e.nativeEvent.type, e.nativeEvent));
|
|
735
|
-
}
|
|
736
|
-
|
|
737
|
-
break;
|
|
738
|
-
}
|
|
739
|
-
}; // Grid cells can have focusable elements inside them. In this case, focus should
|
|
740
|
-
// be marshalled to that element rather than focusing the cell itself.
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
let onFocus = e => {
|
|
744
|
-
if (e.target !== ref.current) {
|
|
745
|
-
// useSelectableItem only handles setting the focused key when
|
|
746
|
-
// the focused element is the gridcell itself. We also want to
|
|
747
|
-
// set the focused key when a child element receives focus.
|
|
748
|
-
// If focus is currently visible (e.g. the user is navigating with the keyboard),
|
|
749
|
-
// then skip this. We want to restore focus to the previously focused row/cell
|
|
750
|
-
// in that case since the table should act like a single tab stop.
|
|
751
|
-
if (!isFocusVisible()) {
|
|
752
|
-
state.selectionManager.setFocusedKey(node.key);
|
|
753
|
-
}
|
|
754
|
-
|
|
755
|
-
return;
|
|
756
|
-
} // If the cell itself is focused, wait a frame so that focus finishes propagatating
|
|
757
|
-
// up to the tree, and move focus to a focusable child if possible.
|
|
20
|
+
*/
|
|
758
21
|
|
|
759
22
|
|
|
760
|
-
requestAnimationFrame(() => {
|
|
761
|
-
if (focusMode === 'child' && document.activeElement === ref.current) {
|
|
762
|
-
focus();
|
|
763
|
-
}
|
|
764
|
-
});
|
|
765
|
-
};
|
|
766
23
|
|
|
767
|
-
let gridCellProps = mergeProps(pressProps, {
|
|
768
|
-
role: 'gridcell',
|
|
769
|
-
onKeyDownCapture: onKeyDown,
|
|
770
|
-
onFocus
|
|
771
|
-
});
|
|
772
24
|
|
|
773
|
-
if (isVirtualized) {
|
|
774
|
-
gridCellProps['aria-colindex'] = node.index + 1; // aria-colindex is 1-based
|
|
775
|
-
}
|
|
776
25
|
|
|
777
|
-
return {
|
|
778
|
-
gridCellProps
|
|
779
|
-
};
|
|
780
|
-
}
|
|
781
26
|
|
|
782
|
-
function $c46764dc2253b1b174632a30143c6340$var$last(walker) {
|
|
783
|
-
let next;
|
|
784
|
-
let last;
|
|
785
27
|
|
|
786
|
-
do {
|
|
787
|
-
last = walker.lastChild();
|
|
788
28
|
|
|
789
|
-
if (last) {
|
|
790
|
-
next = last;
|
|
791
|
-
}
|
|
792
|
-
} while (last);
|
|
793
29
|
|
|
794
|
-
|
|
795
|
-
}
|
|
30
|
+
export {$d1c300d9c497e402$export$de9feff04fda126e as GridKeyboardDelegate, $83c6e2eafa584c67$export$f6b86a04e5d66d90 as useGrid, $e45487f8ba1cbdbf$export$d3037f5d3f3e51bf as useGridRowGroup, $4159a7a9cbb0cc18$export$96357d5a73f686fa as useGridRow, $ab90dcbc1b5466d0$export$c7e10bfc0c59f67c as useGridCell, $7cb39d07f245a780$export$70e2eed1a92976ad as useGridSelectionCheckbox, $5b9b5b5723db6ae1$export$be42ebdab07ae4c2 as useHighlightSelectionDescription, $92599c3fd427b763$export$137e594ef3218a10 as useGridSelectionAnnouncement};
|
|
796
31
|
//# sourceMappingURL=module.js.map
|