@react-aria/grid 3.0.0-beta.1 → 3.0.0-nightly-4980928d3-240906

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.
Files changed (239) hide show
  1. package/dist/GridKeyboardDelegate.main.js +247 -0
  2. package/dist/GridKeyboardDelegate.main.js.map +1 -0
  3. package/dist/GridKeyboardDelegate.mjs +242 -0
  4. package/dist/GridKeyboardDelegate.module.js +242 -0
  5. package/dist/GridKeyboardDelegate.module.js.map +1 -0
  6. package/dist/ar-AE.main.js +15 -0
  7. package/dist/ar-AE.main.js.map +1 -0
  8. package/dist/ar-AE.mjs +17 -0
  9. package/dist/ar-AE.module.js +17 -0
  10. package/dist/ar-AE.module.js.map +1 -0
  11. package/dist/bg-BG.main.js +15 -0
  12. package/dist/bg-BG.main.js.map +1 -0
  13. package/dist/bg-BG.mjs +17 -0
  14. package/dist/bg-BG.module.js +17 -0
  15. package/dist/bg-BG.module.js.map +1 -0
  16. package/dist/cs-CZ.main.js +15 -0
  17. package/dist/cs-CZ.main.js.map +1 -0
  18. package/dist/cs-CZ.mjs +17 -0
  19. package/dist/cs-CZ.module.js +17 -0
  20. package/dist/cs-CZ.module.js.map +1 -0
  21. package/dist/da-DK.main.js +15 -0
  22. package/dist/da-DK.main.js.map +1 -0
  23. package/dist/da-DK.mjs +17 -0
  24. package/dist/da-DK.module.js +17 -0
  25. package/dist/da-DK.module.js.map +1 -0
  26. package/dist/de-DE.main.js +15 -0
  27. package/dist/de-DE.main.js.map +1 -0
  28. package/dist/de-DE.mjs +17 -0
  29. package/dist/de-DE.module.js +17 -0
  30. package/dist/de-DE.module.js.map +1 -0
  31. package/dist/el-GR.main.js +15 -0
  32. package/dist/el-GR.main.js.map +1 -0
  33. package/dist/el-GR.mjs +17 -0
  34. package/dist/el-GR.module.js +17 -0
  35. package/dist/el-GR.module.js.map +1 -0
  36. package/dist/en-US.main.js +15 -0
  37. package/dist/en-US.main.js.map +1 -0
  38. package/dist/en-US.mjs +17 -0
  39. package/dist/en-US.module.js +17 -0
  40. package/dist/en-US.module.js.map +1 -0
  41. package/dist/es-ES.main.js +15 -0
  42. package/dist/es-ES.main.js.map +1 -0
  43. package/dist/es-ES.mjs +17 -0
  44. package/dist/es-ES.module.js +17 -0
  45. package/dist/es-ES.module.js.map +1 -0
  46. package/dist/et-EE.main.js +15 -0
  47. package/dist/et-EE.main.js.map +1 -0
  48. package/dist/et-EE.mjs +17 -0
  49. package/dist/et-EE.module.js +17 -0
  50. package/dist/et-EE.module.js.map +1 -0
  51. package/dist/fi-FI.main.js +15 -0
  52. package/dist/fi-FI.main.js.map +1 -0
  53. package/dist/fi-FI.mjs +17 -0
  54. package/dist/fi-FI.module.js +17 -0
  55. package/dist/fi-FI.module.js.map +1 -0
  56. package/dist/fr-FR.main.js +15 -0
  57. package/dist/fr-FR.main.js.map +1 -0
  58. package/dist/fr-FR.mjs +17 -0
  59. package/dist/fr-FR.module.js +17 -0
  60. package/dist/fr-FR.module.js.map +1 -0
  61. package/dist/he-IL.main.js +15 -0
  62. package/dist/he-IL.main.js.map +1 -0
  63. package/dist/he-IL.mjs +17 -0
  64. package/dist/he-IL.module.js +17 -0
  65. package/dist/he-IL.module.js.map +1 -0
  66. package/dist/hr-HR.main.js +15 -0
  67. package/dist/hr-HR.main.js.map +1 -0
  68. package/dist/hr-HR.mjs +17 -0
  69. package/dist/hr-HR.module.js +17 -0
  70. package/dist/hr-HR.module.js.map +1 -0
  71. package/dist/hu-HU.main.js +15 -0
  72. package/dist/hu-HU.main.js.map +1 -0
  73. package/dist/hu-HU.mjs +17 -0
  74. package/dist/hu-HU.module.js +17 -0
  75. package/dist/hu-HU.module.js.map +1 -0
  76. package/dist/import.mjs +31 -0
  77. package/dist/intlStrings.main.js +108 -0
  78. package/dist/intlStrings.main.js.map +1 -0
  79. package/dist/intlStrings.mjs +110 -0
  80. package/dist/intlStrings.module.js +110 -0
  81. package/dist/intlStrings.module.js.map +1 -0
  82. package/dist/it-IT.main.js +15 -0
  83. package/dist/it-IT.main.js.map +1 -0
  84. package/dist/it-IT.mjs +17 -0
  85. package/dist/it-IT.module.js +17 -0
  86. package/dist/it-IT.module.js.map +1 -0
  87. package/dist/ja-JP.main.js +15 -0
  88. package/dist/ja-JP.main.js.map +1 -0
  89. package/dist/ja-JP.mjs +17 -0
  90. package/dist/ja-JP.module.js +17 -0
  91. package/dist/ja-JP.module.js.map +1 -0
  92. package/dist/ko-KR.main.js +15 -0
  93. package/dist/ko-KR.main.js.map +1 -0
  94. package/dist/ko-KR.mjs +17 -0
  95. package/dist/ko-KR.module.js +17 -0
  96. package/dist/ko-KR.module.js.map +1 -0
  97. package/dist/lt-LT.main.js +15 -0
  98. package/dist/lt-LT.main.js.map +1 -0
  99. package/dist/lt-LT.mjs +17 -0
  100. package/dist/lt-LT.module.js +17 -0
  101. package/dist/lt-LT.module.js.map +1 -0
  102. package/dist/lv-LV.main.js +15 -0
  103. package/dist/lv-LV.main.js.map +1 -0
  104. package/dist/lv-LV.mjs +17 -0
  105. package/dist/lv-LV.module.js +17 -0
  106. package/dist/lv-LV.module.js.map +1 -0
  107. package/dist/main.js +23 -823
  108. package/dist/main.js.map +1 -1
  109. package/dist/module.js +10 -773
  110. package/dist/module.js.map +1 -1
  111. package/dist/nb-NO.main.js +15 -0
  112. package/dist/nb-NO.main.js.map +1 -0
  113. package/dist/nb-NO.mjs +17 -0
  114. package/dist/nb-NO.module.js +17 -0
  115. package/dist/nb-NO.module.js.map +1 -0
  116. package/dist/nl-NL.main.js +15 -0
  117. package/dist/nl-NL.main.js.map +1 -0
  118. package/dist/nl-NL.mjs +17 -0
  119. package/dist/nl-NL.module.js +17 -0
  120. package/dist/nl-NL.module.js.map +1 -0
  121. package/dist/pl-PL.main.js +15 -0
  122. package/dist/pl-PL.main.js.map +1 -0
  123. package/dist/pl-PL.mjs +17 -0
  124. package/dist/pl-PL.module.js +17 -0
  125. package/dist/pl-PL.module.js.map +1 -0
  126. package/dist/pt-BR.main.js +15 -0
  127. package/dist/pt-BR.main.js.map +1 -0
  128. package/dist/pt-BR.mjs +17 -0
  129. package/dist/pt-BR.module.js +17 -0
  130. package/dist/pt-BR.module.js.map +1 -0
  131. package/dist/pt-PT.main.js +15 -0
  132. package/dist/pt-PT.main.js.map +1 -0
  133. package/dist/pt-PT.mjs +17 -0
  134. package/dist/pt-PT.module.js +17 -0
  135. package/dist/pt-PT.module.js.map +1 -0
  136. package/dist/ro-RO.main.js +15 -0
  137. package/dist/ro-RO.main.js.map +1 -0
  138. package/dist/ro-RO.mjs +17 -0
  139. package/dist/ro-RO.module.js +17 -0
  140. package/dist/ro-RO.module.js.map +1 -0
  141. package/dist/ru-RU.main.js +15 -0
  142. package/dist/ru-RU.main.js.map +1 -0
  143. package/dist/ru-RU.mjs +17 -0
  144. package/dist/ru-RU.module.js +17 -0
  145. package/dist/ru-RU.module.js.map +1 -0
  146. package/dist/sk-SK.main.js +15 -0
  147. package/dist/sk-SK.main.js.map +1 -0
  148. package/dist/sk-SK.mjs +17 -0
  149. package/dist/sk-SK.module.js +17 -0
  150. package/dist/sk-SK.module.js.map +1 -0
  151. package/dist/sl-SI.main.js +15 -0
  152. package/dist/sl-SI.main.js.map +1 -0
  153. package/dist/sl-SI.mjs +17 -0
  154. package/dist/sl-SI.module.js +17 -0
  155. package/dist/sl-SI.module.js.map +1 -0
  156. package/dist/sr-SP.main.js +15 -0
  157. package/dist/sr-SP.main.js.map +1 -0
  158. package/dist/sr-SP.mjs +17 -0
  159. package/dist/sr-SP.module.js +17 -0
  160. package/dist/sr-SP.module.js.map +1 -0
  161. package/dist/sv-SE.main.js +15 -0
  162. package/dist/sv-SE.main.js.map +1 -0
  163. package/dist/sv-SE.mjs +17 -0
  164. package/dist/sv-SE.module.js +17 -0
  165. package/dist/sv-SE.module.js.map +1 -0
  166. package/dist/tr-TR.main.js +15 -0
  167. package/dist/tr-TR.main.js.map +1 -0
  168. package/dist/tr-TR.mjs +17 -0
  169. package/dist/tr-TR.module.js +17 -0
  170. package/dist/tr-TR.module.js.map +1 -0
  171. package/dist/types.d.ts +114 -36
  172. package/dist/types.d.ts.map +1 -1
  173. package/dist/uk-UA.main.js +15 -0
  174. package/dist/uk-UA.main.js.map +1 -0
  175. package/dist/uk-UA.mjs +17 -0
  176. package/dist/uk-UA.module.js +17 -0
  177. package/dist/uk-UA.module.js.map +1 -0
  178. package/dist/useGrid.main.js +132 -0
  179. package/dist/useGrid.main.js.map +1 -0
  180. package/dist/useGrid.mjs +127 -0
  181. package/dist/useGrid.module.js +127 -0
  182. package/dist/useGrid.module.js.map +1 -0
  183. package/dist/useGridCell.main.js +220 -0
  184. package/dist/useGridCell.main.js.map +1 -0
  185. package/dist/useGridCell.mjs +215 -0
  186. package/dist/useGridCell.module.js +215 -0
  187. package/dist/useGridCell.module.js.map +1 -0
  188. package/dist/useGridRow.main.js +53 -0
  189. package/dist/useGridRow.main.js.map +1 -0
  190. package/dist/useGridRow.mjs +48 -0
  191. package/dist/useGridRow.module.js +48 -0
  192. package/dist/useGridRow.module.js.map +1 -0
  193. package/dist/useGridRowGroup.main.js +26 -0
  194. package/dist/useGridRowGroup.main.js.map +1 -0
  195. package/dist/useGridRowGroup.mjs +21 -0
  196. package/dist/useGridRowGroup.module.js +21 -0
  197. package/dist/useGridRowGroup.module.js.map +1 -0
  198. package/dist/useGridSelectionAnnouncement.main.js +94 -0
  199. package/dist/useGridSelectionAnnouncement.main.js.map +1 -0
  200. package/dist/useGridSelectionAnnouncement.mjs +89 -0
  201. package/dist/useGridSelectionAnnouncement.module.js +89 -0
  202. package/dist/useGridSelectionAnnouncement.module.js.map +1 -0
  203. package/dist/useGridSelectionCheckbox.main.js +39 -0
  204. package/dist/useGridSelectionCheckbox.main.js.map +1 -0
  205. package/dist/useGridSelectionCheckbox.mjs +34 -0
  206. package/dist/useGridSelectionCheckbox.module.js +34 -0
  207. package/dist/useGridSelectionCheckbox.module.js.map +1 -0
  208. package/dist/useHighlightSelectionDescription.main.js +55 -0
  209. package/dist/useHighlightSelectionDescription.main.js.map +1 -0
  210. package/dist/useHighlightSelectionDescription.mjs +50 -0
  211. package/dist/useHighlightSelectionDescription.module.js +50 -0
  212. package/dist/useHighlightSelectionDescription.module.js.map +1 -0
  213. package/dist/utils.main.js +20 -0
  214. package/dist/utils.main.js.map +1 -0
  215. package/dist/utils.mjs +15 -0
  216. package/dist/utils.module.js +15 -0
  217. package/dist/utils.module.js.map +1 -0
  218. package/dist/zh-CN.main.js +15 -0
  219. package/dist/zh-CN.main.js.map +1 -0
  220. package/dist/zh-CN.mjs +17 -0
  221. package/dist/zh-CN.module.js +17 -0
  222. package/dist/zh-CN.module.js.map +1 -0
  223. package/dist/zh-TW.main.js +15 -0
  224. package/dist/zh-TW.main.js.map +1 -0
  225. package/dist/zh-TW.mjs +17 -0
  226. package/dist/zh-TW.module.js +17 -0
  227. package/dist/zh-TW.module.js.map +1 -0
  228. package/package.json +23 -15
  229. package/src/GridKeyboardDelegate.ts +93 -83
  230. package/src/index.ts +17 -5
  231. package/src/useGrid.ts +77 -78
  232. package/src/useGridCell.ts +96 -46
  233. package/src/useGridRow.ts +32 -21
  234. package/src/useGridRowGroup.ts +3 -3
  235. package/src/useGridSelectionAnnouncement.ts +115 -0
  236. package/src/useGridSelectionCheckbox.ts +48 -0
  237. package/src/useHighlightSelectionDescription.ts +52 -0
  238. package/src/utils.ts +13 -3
  239. package/LICENSE +0 -201
package/dist/module.js CHANGED
@@ -1,376 +1,11 @@
1
- import { focusSafely, getFocusableTreeWalker } from "@react-aria/focus";
2
- import { usePress, isFocusVisible } from "@react-aria/interactions";
3
- import { useSelectableCollection, useSelectableItem } from "@react-aria/selection";
4
- import { useCollator, useLocale, useMessageFormatter } from "@react-aria/i18n";
5
- import { useMemo, useRef } from "react";
6
- import { filterDOMProps, mergeProps, useId, useUpdateEffect } from "@react-aria/utils";
7
- import { announce } from "@react-aria/live-announcer";
8
- import _babelRuntimeHelpersEsmInteropRequireDefault from "@babel/runtime/helpers/esm/interopRequireDefault";
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,413 +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
- * @param ref - The ref attached to the grid element.
402
- */
403
- export function useGrid(props, state, ref) {
404
- let {
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, ref) {
545
- let {
546
- node,
547
- isVirtualized,
548
- shouldSelectOnPressUp
549
- } = props;
550
- let {
551
- itemProps
552
- } = useSelectableItem({
553
- selectionManager: state.selectionManager,
554
- key: node.key,
555
- ref,
556
- isVirtualized,
557
- shouldSelectOnPressUp
558
- });
559
- let isSelected = state.selectionManager.isSelected(node.key);
560
- let isDisabled = state.disabledKeys.has(node.key); // TODO: move into useSelectableItem?
561
-
562
- let {
563
- pressProps
564
- } = usePress(_babelRuntimeHelpersEsmExtends({}, itemProps, {
565
- isDisabled
566
- }));
567
-
568
- let rowProps = _babelRuntimeHelpersEsmExtends({
569
- role: 'row',
570
- 'aria-selected': isSelected
571
- }, pressProps);
572
-
573
- if (isVirtualized) {
574
- rowProps['aria-rowindex'] = node.index + 1; // aria-rowindex is 1 based
575
- }
576
-
577
- return {
578
- rowProps
579
- };
580
- }
581
-
582
- /**
583
- * Provides the behavior and accessibility implementation for a cell in a grid.
584
- * @param props - Props for the cell.
585
- * @param state - State of the parent grid, as returned by `useGridState`.
586
- */
587
- export function useGridCell(props, state, ref) {
588
- let {
589
- node,
590
- isVirtualized,
591
- focusMode = 'child',
592
- shouldSelectOnPressUp
593
- } = props;
594
- let {
595
- direction
596
- } = useLocale();
597
- let keyboardDelegate = $c7c16c1fc27e25a205a277212c8e7cfd$export$gridKeyboardDelegates.get(state); // Handles focusing the cell. If there is a focusable child,
598
- // it is focused, otherwise the cell itself is focused.
599
-
600
- let focus = () => {
601
- let treeWalker = getFocusableTreeWalker(ref.current);
602
-
603
- if (focusMode === 'child') {
604
- let focusable = state.selectionManager.childFocusStrategy === 'last' ? $c46764dc2253b1b174632a30143c6340$var$last(treeWalker) : treeWalker.firstChild();
605
-
606
- if (focusable) {
607
- focusSafely(focusable);
608
- return;
609
- }
610
- }
611
-
612
- if (!ref.current.contains(document.activeElement)) {
613
- focusSafely(ref.current);
614
- }
615
- };
616
-
617
- let {
618
- itemProps
619
- } = useSelectableItem({
620
- selectionManager: state.selectionManager,
621
- key: node.key,
622
- ref,
623
- isVirtualized,
624
- focus,
625
- shouldSelectOnPressUp
626
- }); // TODO: move into useSelectableItem?
627
-
628
- let isDisabled = state.disabledKeys.has(node.key) || state.disabledKeys.has(node.parentKey);
629
- let {
630
- pressProps
631
- } = usePress(_babelRuntimeHelpersEsmExtends({}, itemProps, {
632
- isDisabled
633
- }));
634
-
635
- let onKeyDown = e => {
636
- if (!e.currentTarget.contains(e.target)) {
637
- return;
638
- }
639
-
640
- let walker = getFocusableTreeWalker(ref.current);
641
- walker.currentNode = document.activeElement;
642
-
643
- switch (e.key) {
644
- case 'ArrowLeft':
645
- {
646
- // Find the next focusable element within the cell.
647
- let focusable = direction === 'rtl' ? walker.nextNode() : walker.previousNode(); // Don't focus the cell itself if focusMode is "child"
648
-
649
- if (focusMode === 'child' && focusable === ref.current) {
650
- focusable = null;
651
- }
652
-
653
- if (focusable) {
654
- e.preventDefault();
655
- e.stopPropagation();
656
- focusSafely(focusable);
657
- } else {
658
- // If there is no next focusable child, then move to the next cell to the left of this one.
659
- // This will be handled by useSelectableCollection. However, if there is no cell to the left
660
- // of this one, only one column, and the grid doesn't focus rows, then the next key will be the
661
- // same as this one. In that case we need to handle focusing either the cell or the first/last
662
- // child, depending on the focus mode.
663
- let prev = keyboardDelegate.getKeyLeftOf(node.key);
664
-
665
- if (prev !== node.key) {
666
- break;
667
- }
668
-
669
- e.preventDefault();
670
- e.stopPropagation();
671
-
672
- if (focusMode === 'cell' && direction === 'rtl') {
673
- focusSafely(ref.current);
674
- } else {
675
- walker.currentNode = ref.current;
676
- focusable = direction === 'rtl' ? walker.firstChild() : $c46764dc2253b1b174632a30143c6340$var$last(walker);
677
-
678
- if (focusable) {
679
- focusSafely(focusable);
680
- }
681
- }
682
- }
683
-
684
- break;
685
- }
686
-
687
- case 'ArrowRight':
688
- {
689
- let focusable = direction === 'rtl' ? walker.previousNode() : walker.nextNode();
690
-
691
- if (focusMode === 'child' && focusable === ref.current) {
692
- focusable = null;
693
- }
694
-
695
- if (focusable) {
696
- e.preventDefault();
697
- e.stopPropagation();
698
- focusSafely(focusable);
699
- } else {
700
- let next = keyboardDelegate.getKeyRightOf(node.key);
701
-
702
- if (next !== node.key) {
703
- break;
704
- }
705
-
706
- e.preventDefault();
707
- e.stopPropagation();
708
-
709
- if (focusMode === 'cell' && direction === 'ltr') {
710
- focusSafely(ref.current);
711
- } else {
712
- walker.currentNode = ref.current;
713
- focusable = direction === 'rtl' ? $c46764dc2253b1b174632a30143c6340$var$last(walker) : walker.firstChild();
714
-
715
- if (focusable) {
716
- focusSafely(focusable);
717
- }
718
- }
719
- }
720
-
721
- break;
722
- }
723
-
724
- case 'ArrowUp':
725
- case 'ArrowDown':
726
- // Prevent this event from reaching cell children, e.g. menu buttons. We want arrow keys to navigate
727
- // to the cell above/below instead. We need to re-dispatch the event from a higher parent so it still
728
- // bubbles and gets handled by useSelectableCollection.
729
- if (!e.altKey && ref.current.contains(e.target)) {
730
- e.stopPropagation();
731
- e.preventDefault();
732
- ref.current.parentElement.dispatchEvent(new KeyboardEvent(e.nativeEvent.type, e.nativeEvent));
733
- }
734
-
735
- break;
736
- }
737
- }; // Grid cells can have focusable elements inside them. In this case, focus should
738
- // be marshalled to that element rather than focusing the cell itself.
739
-
740
-
741
- let onFocus = e => {
742
- if (e.target !== ref.current) {
743
- // useSelectableItem only handles setting the focused key when
744
- // the focused element is the gridcell itself. We also want to
745
- // set the focused key when a child element receives focus.
746
- // If focus is currently visible (e.g. the user is navigating with the keyboard),
747
- // then skip this. We want to restore focus to the previously focused row/cell
748
- // in that case since the table should act like a single tab stop.
749
- if (!isFocusVisible()) {
750
- state.selectionManager.setFocusedKey(node.key);
751
- }
752
-
753
- return;
754
- } // If the cell itself is focused, wait a frame so that focus finishes propagatating
755
- // up to the tree, and move focus to a focusable child if possible.
20
+ */
756
21
 
757
22
 
758
- requestAnimationFrame(() => {
759
- if (focusMode === 'child' && document.activeElement === ref.current) {
760
- focus();
761
- }
762
- });
763
- };
764
23
 
765
- let gridCellProps = mergeProps(pressProps, {
766
- role: 'gridcell',
767
- onKeyDownCapture: onKeyDown,
768
- onFocus
769
- });
770
24
 
771
- if (isVirtualized) {
772
- gridCellProps['aria-colindex'] = node.index + 1; // aria-colindex is 1-based
773
- }
774
25
 
775
- return {
776
- gridCellProps
777
- };
778
- }
779
26
 
780
- function $c46764dc2253b1b174632a30143c6340$var$last(walker) {
781
- let next;
782
- let last;
783
27
 
784
- do {
785
- last = walker.lastChild();
786
28
 
787
- if (last) {
788
- next = last;
789
- }
790
- } while (last);
791
29
 
792
- return next;
793
- }
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};
794
31
  //# sourceMappingURL=module.js.map