@react-aria/gridlist 3.14.2 → 3.14.4
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/types.d.ts.map +1 -1
- package/dist/useGridListItem.main.js +29 -13
- package/dist/useGridListItem.main.js.map +1 -1
- package/dist/useGridListItem.mjs +30 -14
- package/dist/useGridListItem.module.js +30 -14
- package/dist/useGridListItem.module.js.map +1 -1
- package/package.json +11 -11
- package/src/useGridListItem.ts +33 -13
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;ACgCA,+BAA+B,CAAC,CAAE,SAAQ,eAAe,CAAC,CAAC,EAAE,iBAAiB;IAC5E,uDAAuD;IACvD,SAAS,CAAC,EAAE,OAAO,GAAG,aAAa,CAAC;IACpC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,wEAAwE;IACxE,qBAAqB,CAAC,EAAE,OAAO,CAAA;CAChC;AAED,mCAAmC,CAAC,CAAE,SAAQ,cAAc,CAAC,CAAC,EAAE,QAAQ,EAAE,iBAAiB;IACzF;;;;OAIG;IACH,0BAA0B,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAC7C;;;;;;;OAOG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,GAAG,MAAM,CAAA;CAC9C;AAED,qCAAqC,CAAC,CAAE,SAAQ,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,UAAU,CAAC;IACpF,+CAA+C;IAC/C,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC;;;;OAIG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,QAAQ,GAAG,WAAW,GAAG,UAAU,CAAA;CACnD;AAED;IACE,kCAAkC;IAClC,SAAS,EAAE,aAAa,CAAA;CACzB;AAED;;;;;;GAMG;AACH,4BAA4B,CAAC,EAAE,KAAK,EAAE,oBAAoB,CAAC,CAAC,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,UAAU,WAAW,GAAG,IAAI,CAAC,GAAG,YAAY,CAoEnI;AC9JD;IACE,8GAA8G;IAC9G,IAAI,EAAE,KAAO,OAAO,CAAC,CAAC;IACtB,+DAA+D;IAC/D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,wEAAwE;IACxE,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,8DAA8D;IAC9D,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB;AAED,iCAAkC,SAAQ,oBAAoB;IAC5D,sCAAsC;IACtC,QAAQ,EAAE,aAAa,CAAC;IACxB,2DAA2D;IAC3D,aAAa,EAAE,aAAa,CAAC;IAC7B,2DAA2D;IAC3D,gBAAgB,EAAE,aAAa,CAAA;CAChC;AAaD;;;;;GAKG;AACH,gCAAgC,CAAC,EAAE,KAAK,EAAE,uBAAuB,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,UAAU,gBAAgB,GAAG,IAAI,CAAC,GAAG,gBAAgB,
|
|
1
|
+
{"mappings":";;;;;ACgCA,+BAA+B,CAAC,CAAE,SAAQ,eAAe,CAAC,CAAC,EAAE,iBAAiB;IAC5E,uDAAuD;IACvD,SAAS,CAAC,EAAE,OAAO,GAAG,aAAa,CAAC;IACpC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,wEAAwE;IACxE,qBAAqB,CAAC,EAAE,OAAO,CAAA;CAChC;AAED,mCAAmC,CAAC,CAAE,SAAQ,cAAc,CAAC,CAAC,EAAE,QAAQ,EAAE,iBAAiB;IACzF;;;;OAIG;IACH,0BAA0B,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAC7C;;;;;;;OAOG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,GAAG,MAAM,CAAA;CAC9C;AAED,qCAAqC,CAAC,CAAE,SAAQ,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,UAAU,CAAC;IACpF,+CAA+C;IAC/C,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC;;;;OAIG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,QAAQ,GAAG,WAAW,GAAG,UAAU,CAAA;CACnD;AAED;IACE,kCAAkC;IAClC,SAAS,EAAE,aAAa,CAAA;CACzB;AAED;;;;;;GAMG;AACH,4BAA4B,CAAC,EAAE,KAAK,EAAE,oBAAoB,CAAC,CAAC,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,UAAU,WAAW,GAAG,IAAI,CAAC,GAAG,YAAY,CAoEnI;AC9JD;IACE,8GAA8G;IAC9G,IAAI,EAAE,KAAO,OAAO,CAAC,CAAC;IACtB,+DAA+D;IAC/D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,wEAAwE;IACxE,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,8DAA8D;IAC9D,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB;AAED,iCAAkC,SAAQ,oBAAoB;IAC5D,sCAAsC;IACtC,QAAQ,EAAE,aAAa,CAAC;IACxB,2DAA2D;IAC3D,aAAa,EAAE,aAAa,CAAC;IAC7B,2DAA2D;IAC3D,gBAAgB,EAAE,aAAa,CAAA;CAChC;AAaD;;;;;GAKG;AACH,gCAAgC,CAAC,EAAE,KAAK,EAAE,uBAAuB,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,UAAU,gBAAgB,GAAG,IAAI,CAAC,GAAG,gBAAgB,CAmQhK;AC/SD;;;;GAIG;AACH,6CAA6C,CAAC,EAAE,KAAK,EAAE,8BAA8B,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,GAAG,yBAAyB,CAUrI;ACfD;IACE,oFAAoF;IACpF,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED;IACE,uCAAuC;IACvC,QAAQ,EAAE,aAAa,CAAC;IAExB,6CAA6C;IAC7C,cAAc,EAAE,aAAa,CAAC;IAE9B,8CAA8C;IAC9C,aAAa,EAAE,aAAa,CAAA;CAC7B;AAED;;;;GAIG;AAEH,mCAAmC,CAAC,EAAE,KAAK,EAAE,wBAAwB,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,UAAU,WAAW,GAAG,IAAI,CAAC,GAAG,mBAAmB,CAqBnJ;ACxCD,YAAY,EAAC,8BAA8B,EAAE,yBAAyB,EAAC,MAAM,kBAAkB,CAAC","sources":["packages/@react-aria/gridlist/src/packages/@react-aria/gridlist/src/utils.ts","packages/@react-aria/gridlist/src/packages/@react-aria/gridlist/src/useGridList.ts","packages/@react-aria/gridlist/src/packages/@react-aria/gridlist/src/useGridListItem.ts","packages/@react-aria/gridlist/src/packages/@react-aria/gridlist/src/useGridListSelectionCheckbox.ts","packages/@react-aria/gridlist/src/packages/@react-aria/gridlist/src/useGridListSection.ts","packages/@react-aria/gridlist/src/packages/@react-aria/gridlist/src/index.ts","packages/@react-aria/gridlist/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,"/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport {useGridList} from './useGridList';\nexport {useGridListItem} from './useGridListItem';\nexport {useGridListSelectionCheckbox} from './useGridListSelectionCheckbox';\nexport {useGridListSection} from './useGridListSection';\n\nexport type {AriaGridListOptions, AriaGridListProps, GridListAria, GridListProps} from './useGridList';\nexport type {AriaGridListItemOptions, GridListItemAria} from './useGridListItem';\nexport type {AriaGridSelectionCheckboxProps, GridSelectionCheckboxAria} from '@react-aria/grid';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
|
@@ -51,10 +51,9 @@ function $f7116f5928c03f32$export$9610e69494fadfd2(props, state, ref) {
|
|
|
51
51
|
// focus to go to the item when the DOM node is reused for a different item in a virtualizer.
|
|
52
52
|
let keyWhenFocused = (0, $911qM$react.useRef)(null);
|
|
53
53
|
let focus = ()=>{
|
|
54
|
-
var _ref_current;
|
|
55
54
|
// Don't shift focus to the row if the active element is a element within the row already
|
|
56
55
|
// (e.g. clicking on a row button)
|
|
57
|
-
if (ref.current !== null && (keyWhenFocused.current != null && node.key !== keyWhenFocused.current || !(
|
|
56
|
+
if (ref.current !== null && (keyWhenFocused.current != null && node.key !== keyWhenFocused.current || !(0, $911qM$reactariautils.isFocusWithin)(ref.current))) (0, $911qM$reactariafocus.focusSafely)(ref.current);
|
|
58
57
|
};
|
|
59
58
|
let treeGridRowProps = {};
|
|
60
59
|
let hasChildRows = props.hasChildItems;
|
|
@@ -70,15 +69,16 @@ function $f7116f5928c03f32$export$9610e69494fadfd2(props, state, ref) {
|
|
|
70
69
|
if (onAction == null && !hasLink && state.selectionManager.selectionMode === 'none' && hasChildRows) onAction = ()=>state.toggleKey(node.key);
|
|
71
70
|
let isExpanded = hasChildRows ? state.expandedKeys.has(node.key) : undefined;
|
|
72
71
|
let setSize = 1;
|
|
73
|
-
|
|
72
|
+
let index = node.index;
|
|
73
|
+
if (node.level >= 0 && (node === null || node === void 0 ? void 0 : node.parentKey) != null) {
|
|
74
74
|
let parent = state.collection.getItem(node.parentKey);
|
|
75
75
|
if (parent) {
|
|
76
|
-
var _state_collection_getChildren1, _state_collection1;
|
|
77
76
|
// siblings must exist because our original node exists
|
|
78
|
-
let siblings = (
|
|
77
|
+
let siblings = $f7116f5928c03f32$var$getDirectChildren(parent, state.collection);
|
|
79
78
|
setSize = [
|
|
80
79
|
...siblings
|
|
81
80
|
].filter((row)=>row.type === 'item').length;
|
|
81
|
+
if (index > 0 && siblings[0].type !== 'item') index -= 1; // subtract one for the parent item's content node
|
|
82
82
|
}
|
|
83
83
|
} else setSize = [
|
|
84
84
|
...state.collection
|
|
@@ -86,7 +86,7 @@ function $f7116f5928c03f32$export$9610e69494fadfd2(props, state, ref) {
|
|
|
86
86
|
treeGridRowProps = {
|
|
87
87
|
'aria-expanded': isExpanded,
|
|
88
88
|
'aria-level': node.level + 1,
|
|
89
|
-
'aria-posinset':
|
|
89
|
+
'aria-posinset': index + 1,
|
|
90
90
|
'aria-setsize': setSize
|
|
91
91
|
};
|
|
92
92
|
}
|
|
@@ -101,10 +101,11 @@ function $f7116f5928c03f32$export$9610e69494fadfd2(props, state, ref) {
|
|
|
101
101
|
linkBehavior: linkBehavior
|
|
102
102
|
});
|
|
103
103
|
let onKeyDownCapture = (e)=>{
|
|
104
|
-
|
|
104
|
+
let activeElement = (0, $911qM$reactariautils.getActiveElement)();
|
|
105
|
+
if (!(0, $911qM$reactariautils.nodeContains)(e.currentTarget, (0, $911qM$reactariautils.getEventTarget)(e)) || !ref.current || !activeElement) return;
|
|
105
106
|
let walker = (0, $911qM$reactariafocus.getFocusableTreeWalker)(ref.current);
|
|
106
|
-
walker.currentNode =
|
|
107
|
-
if ('expandedKeys' in state &&
|
|
107
|
+
walker.currentNode = activeElement;
|
|
108
|
+
if ('expandedKeys' in state && activeElement === ref.current) {
|
|
108
109
|
if (e.key === $f7116f5928c03f32$var$EXPANSION_KEYS['expand'][direction] && state.selectionManager.focusedKey === node.key && hasChildRows && !state.expandedKeys.has(node.key)) {
|
|
109
110
|
state.toggleKey(node.key);
|
|
110
111
|
e.stopPropagation();
|
|
@@ -185,7 +186,7 @@ function $f7116f5928c03f32$export$9610e69494fadfd2(props, state, ref) {
|
|
|
185
186
|
// Prevent this event from reaching row children, e.g. menu buttons. We want arrow keys to navigate
|
|
186
187
|
// to the row above/below instead. We need to re-dispatch the event from a higher parent so it still
|
|
187
188
|
// bubbles and gets handled by useSelectableCollection.
|
|
188
|
-
if (!e.altKey && ref.current.
|
|
189
|
+
if (!e.altKey && (0, $911qM$reactariautils.nodeContains)(ref.current, (0, $911qM$reactariautils.getEventTarget)(e))) {
|
|
189
190
|
var _ref_current_parentElement;
|
|
190
191
|
e.stopPropagation();
|
|
191
192
|
e.preventDefault();
|
|
@@ -196,7 +197,7 @@ function $f7116f5928c03f32$export$9610e69494fadfd2(props, state, ref) {
|
|
|
196
197
|
};
|
|
197
198
|
let onFocus = (e)=>{
|
|
198
199
|
keyWhenFocused.current = node.key;
|
|
199
|
-
if (e
|
|
200
|
+
if ((0, $911qM$reactariautils.getEventTarget)(e) !== ref.current) {
|
|
200
201
|
// useSelectableItem only handles setting the focused key when
|
|
201
202
|
// the focused element is the row itself. We also want to
|
|
202
203
|
// set the focused key when a child element receives focus.
|
|
@@ -208,7 +209,8 @@ function $f7116f5928c03f32$export$9610e69494fadfd2(props, state, ref) {
|
|
|
208
209
|
}
|
|
209
210
|
};
|
|
210
211
|
let onKeyDown = (e)=>{
|
|
211
|
-
|
|
212
|
+
let activeElement = (0, $911qM$reactariautils.getActiveElement)();
|
|
213
|
+
if (!(0, $911qM$reactariautils.nodeContains)(e.currentTarget, (0, $911qM$reactariautils.getEventTarget)(e)) || !ref.current || !activeElement) return;
|
|
212
214
|
switch(e.key){
|
|
213
215
|
case 'Tab':
|
|
214
216
|
if (keyboardNavigationBehavior === 'tab') {
|
|
@@ -217,7 +219,7 @@ function $f7116f5928c03f32$export$9610e69494fadfd2(props, state, ref) {
|
|
|
217
219
|
let walker = (0, $911qM$reactariafocus.getFocusableTreeWalker)(ref.current, {
|
|
218
220
|
tabbable: true
|
|
219
221
|
});
|
|
220
|
-
walker.currentNode =
|
|
222
|
+
walker.currentNode = activeElement;
|
|
221
223
|
let next = e.shiftKey ? walker.previousNode() : walker.nextNode();
|
|
222
224
|
if (next) e.stopPropagation();
|
|
223
225
|
}
|
|
@@ -284,6 +286,20 @@ function $f7116f5928c03f32$var$last(walker) {
|
|
|
284
286
|
}while (last);
|
|
285
287
|
return next;
|
|
286
288
|
}
|
|
289
|
+
function $f7116f5928c03f32$var$getDirectChildren(parent, collection) {
|
|
290
|
+
var _collection_getChildren;
|
|
291
|
+
// We can't assume that we can use firstChildKey because if a person builds a tree using hooks, they would not have access to that property (using type Node vs CollectionNode)
|
|
292
|
+
// Instead, get all children and start at the first node (rather than just using firstChildKey) and only look at its siblings
|
|
293
|
+
let children = (_collection_getChildren = collection.getChildren) === null || _collection_getChildren === void 0 ? void 0 : _collection_getChildren.call(collection, parent.key);
|
|
294
|
+
let childArray = children ? Array.from(children) : [];
|
|
295
|
+
let node = childArray.length > 0 ? childArray[0] : null;
|
|
296
|
+
let siblings = [];
|
|
297
|
+
while(node){
|
|
298
|
+
siblings.push(node);
|
|
299
|
+
node = node.nextKey != null ? collection.getItem(node.nextKey) : null;
|
|
300
|
+
}
|
|
301
|
+
return siblings;
|
|
302
|
+
}
|
|
287
303
|
|
|
288
304
|
|
|
289
305
|
//# sourceMappingURL=useGridListItem.main.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-aria/gridlist/src/useGridListItem.ts"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {chain, getScrollParent, mergeProps, scrollIntoViewport, useSlotId, useSyntheticLinkProps} from '@react-aria/utils';\nimport {DOMAttributes, FocusableElement, Key, RefObject, Node as RSNode} from '@react-types/shared';\nimport {focusSafely, getFocusableTreeWalker} from '@react-aria/focus';\nimport {getRowId, listMap} from './utils';\nimport {HTMLAttributes, KeyboardEvent as ReactKeyboardEvent, useRef} from 'react';\nimport {isFocusVisible} from '@react-aria/interactions';\nimport type {ListState} from '@react-stately/list';\nimport {SelectableItemStates, useSelectableItem} from '@react-aria/selection';\nimport type {TreeState} from '@react-stately/tree';\nimport {useLocale} from '@react-aria/i18n';\n\nexport interface AriaGridListItemOptions {\n /** An object representing the list item. Contains all the relevant information that makes up the list row. */\n node: RSNode<unknown>,\n /** Whether the list row is contained in a virtual scroller. */\n isVirtualized?: boolean,\n /** Whether selection should occur on press up instead of press down. */\n shouldSelectOnPressUp?: boolean,\n /** Whether this item has children, even if not loaded yet. */\n hasChildItems?: boolean\n}\n\nexport interface GridListItemAria extends SelectableItemStates {\n /** Props for the list row element. */\n rowProps: DOMAttributes,\n /** Props for the grid cell element within the list row. */\n gridCellProps: DOMAttributes,\n /** Props for the list item description element, if any. */\n descriptionProps: DOMAttributes\n}\n\nconst EXPANSION_KEYS = {\n 'expand': {\n ltr: 'ArrowRight',\n rtl: 'ArrowLeft'\n },\n 'collapse': {\n ltr: 'ArrowLeft',\n rtl: 'ArrowRight'\n }\n};\n\n/**\n * Provides the behavior and accessibility implementation for a row in a grid list.\n * @param props - Props for the row.\n * @param state - State of the parent list, as returned by `useListState`.\n * @param ref - The ref attached to the row element.\n */\nexport function useGridListItem<T>(props: AriaGridListItemOptions, state: ListState<T> | TreeState<T>, ref: RefObject<FocusableElement | null>): GridListItemAria {\n // Copied from useGridCell + some modifications to make it not so grid specific\n let {\n node,\n isVirtualized\n } = props;\n\n // let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/gridlist');\n let {direction} = useLocale();\n let {onAction, linkBehavior, keyboardNavigationBehavior, shouldSelectOnPressUp} = listMap.get(state)!;\n let descriptionId = useSlotId();\n\n // We need to track the key of the item at the time it was last focused so that we force\n // focus to go to the item when the DOM node is reused for a different item in a virtualizer.\n let keyWhenFocused = useRef<Key | null>(null);\n let focus = () => {\n // Don't shift focus to the row if the active element is a element within the row already\n // (e.g. clicking on a row button)\n if (\n ref.current !== null &&\n ((keyWhenFocused.current != null && node.key !== keyWhenFocused.current) ||\n !ref.current?.contains(document.activeElement))\n ) {\n focusSafely(ref.current);\n }\n };\n\n let treeGridRowProps: HTMLAttributes<HTMLElement> = {};\n let hasChildRows = props.hasChildItems;\n let hasLink = state.selectionManager.isLink(node.key);\n if (node != null && 'expandedKeys' in state) {\n // TODO: ideally node.hasChildNodes would be a way to tell if a row has child nodes, but the row's contents make it so that value is always\n // true...\n let children = state.collection.getChildren?.(node.key);\n hasChildRows = hasChildRows || [...(children ?? [])].length > 1;\n\n if (onAction == null && !hasLink && state.selectionManager.selectionMode === 'none' && hasChildRows) {\n onAction = () => state.toggleKey(node.key);\n }\n\n let isExpanded = hasChildRows ? state.expandedKeys.has(node.key) : undefined;\n let setSize = 1;\n if (node.level > 0 && node?.parentKey != null) {\n let parent = state.collection.getItem(node.parentKey);\n if (parent) {\n // siblings must exist because our original node exists\n let siblings = state.collection.getChildren?.(parent.key)!;\n setSize = [...siblings].filter(row => row.type === 'item').length;\n }\n } else {\n setSize = [...state.collection].filter(row => row.level === 0 && row.type === 'item').length;\n }\n\n treeGridRowProps = {\n 'aria-expanded': isExpanded,\n 'aria-level': node.level + 1,\n 'aria-posinset': node?.index + 1,\n 'aria-setsize': setSize\n };\n }\n\n let {itemProps, ...itemStates} = useSelectableItem({\n selectionManager: state.selectionManager,\n key: node.key,\n ref,\n isVirtualized,\n shouldSelectOnPressUp: props.shouldSelectOnPressUp || shouldSelectOnPressUp,\n onAction: onAction || node.props?.onAction ? chain(node.props?.onAction, onAction ? () => onAction(node.key) : undefined) : undefined,\n focus,\n linkBehavior\n });\n\n let onKeyDownCapture = (e: ReactKeyboardEvent) => {\n if (!e.currentTarget.contains(e.target as Element) || !ref.current || !document.activeElement) {\n return;\n }\n\n let walker = getFocusableTreeWalker(ref.current);\n walker.currentNode = document.activeElement;\n\n if ('expandedKeys' in state && document.activeElement === ref.current) {\n if ((e.key === EXPANSION_KEYS['expand'][direction]) && state.selectionManager.focusedKey === node.key && hasChildRows && !state.expandedKeys.has(node.key)) {\n state.toggleKey(node.key);\n e.stopPropagation();\n return;\n } else if ((e.key === EXPANSION_KEYS['collapse'][direction]) && state.selectionManager.focusedKey === node.key && hasChildRows && state.expandedKeys.has(node.key)) {\n state.toggleKey(node.key);\n e.stopPropagation();\n return;\n }\n }\n\n switch (e.key) {\n case 'ArrowLeft': {\n if (keyboardNavigationBehavior === 'arrow') {\n // Find the next focusable element within the row.\n let focusable = direction === 'rtl'\n ? walker.nextNode() as FocusableElement\n : walker.previousNode() as FocusableElement;\n\n if (focusable) {\n e.preventDefault();\n e.stopPropagation();\n focusSafely(focusable);\n scrollIntoViewport(focusable, {containingElement: getScrollParent(ref.current)});\n } else {\n // If there is no next focusable child, then return focus back to the row\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n focusSafely(ref.current);\n scrollIntoViewport(ref.current, {containingElement: getScrollParent(ref.current)});\n } else {\n walker.currentNode = ref.current;\n let lastElement = last(walker);\n if (lastElement) {\n focusSafely(lastElement);\n scrollIntoViewport(lastElement, {containingElement: getScrollParent(ref.current)});\n }\n }\n }\n }\n break;\n }\n case 'ArrowRight': {\n if (keyboardNavigationBehavior === 'arrow') {\n let focusable = direction === 'rtl'\n ? walker.previousNode() as FocusableElement\n : walker.nextNode() as FocusableElement;\n\n if (focusable) {\n e.preventDefault();\n e.stopPropagation();\n focusSafely(focusable);\n scrollIntoViewport(focusable, {containingElement: getScrollParent(ref.current)});\n } else {\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'ltr') {\n focusSafely(ref.current);\n scrollIntoViewport(ref.current, {containingElement: getScrollParent(ref.current)});\n } else {\n walker.currentNode = ref.current;\n let lastElement = last(walker);\n if (lastElement) {\n focusSafely(lastElement);\n scrollIntoViewport(lastElement, {containingElement: getScrollParent(ref.current)});\n }\n }\n }\n }\n break;\n }\n case 'ArrowUp':\n case 'ArrowDown':\n // Prevent this event from reaching row children, e.g. menu buttons. We want arrow keys to navigate\n // to the row above/below instead. We need to re-dispatch the event from a higher parent so it still\n // bubbles and gets handled by useSelectableCollection.\n if (!e.altKey && ref.current.contains(e.target as Element)) {\n e.stopPropagation();\n e.preventDefault();\n ref.current.parentElement?.dispatchEvent(\n new KeyboardEvent(e.nativeEvent.type, e.nativeEvent)\n );\n }\n break;\n }\n };\n\n let onFocus = (e) => {\n keyWhenFocused.current = node.key;\n if (e.target !== ref.current) {\n // useSelectableItem only handles setting the focused key when\n // the focused element is the row itself. We also want to\n // set the focused key when a child element receives focus.\n // If focus is currently visible (e.g. the user is navigating with the keyboard),\n // then skip this. We want to restore focus to the previously focused row\n // in that case since the list should act like a single tab stop.\n if (!isFocusVisible()) {\n state.selectionManager.setFocusedKey(node.key);\n }\n return;\n }\n };\n\n let onKeyDown = (e) => {\n if (!e.currentTarget.contains(e.target as Element) || !ref.current || !document.activeElement) {\n return;\n }\n\n switch (e.key) {\n case 'Tab': {\n if (keyboardNavigationBehavior === 'tab') {\n // If there is another focusable element within this item, stop propagation so the tab key\n // is handled by the browser and not by useSelectableCollection (which would take us out of the list).\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n walker.currentNode = document.activeElement;\n let next = e.shiftKey ? walker.previousNode() : walker.nextNode();\n\n if (next) {\n e.stopPropagation();\n }\n }\n }\n }\n };\n\n let syntheticLinkProps = useSyntheticLinkProps(node.props);\n let linkProps = itemStates.hasAction ? syntheticLinkProps : {};\n // TODO: re-add when we get translations and fix this for iOS VO\n // let rowAnnouncement;\n // if (onAction) {\n // rowAnnouncement = stringFormatter.format('hasActionAnnouncement');\n // } else if (hasLink) {\n // rowAnnouncement = stringFormatter.format('hasLinkAnnouncement', {\n // link: node.props.href\n // });\n // }\n\n let rowProps: DOMAttributes = mergeProps(itemProps, linkProps, {\n role: 'row',\n onKeyDownCapture,\n onKeyDown,\n onFocus,\n // 'aria-label': [(node.textValue || undefined), rowAnnouncement].filter(Boolean).join(', '),\n 'aria-label': node['aria-label'] || node.textValue || undefined,\n 'aria-selected': state.selectionManager.canSelectItem(node.key) ? state.selectionManager.isSelected(node.key) : undefined,\n 'aria-disabled': state.selectionManager.isDisabled(node.key) || undefined,\n 'aria-labelledby': descriptionId && (node['aria-label'] || node.textValue) ? `${getRowId(state, node.key)} ${descriptionId}` : undefined,\n id: getRowId(state, node.key)\n });\n\n if (isVirtualized) {\n let {collection} = state;\n let nodes = [...collection];\n // TODO: refactor ListCollection to store an absolute index of a node's position?\n rowProps['aria-rowindex'] = nodes.find(node => node.type === 'section') ? [...collection.getKeys()].filter((key) => collection.getItem(key)?.type !== 'section').findIndex((key) => key === node.key) + 1 : node.index + 1;\n }\n\n let gridCellProps = {\n role: 'gridcell',\n 'aria-colindex': 1\n };\n\n // TODO: should isExpanded and hasChildRows be a item state that gets returned by the hook?\n return {\n rowProps: {...mergeProps(rowProps, treeGridRowProps)},\n gridCellProps,\n descriptionProps: {\n id: descriptionId\n },\n ...itemStates\n };\n}\n\nfunction last(walker: TreeWalker) {\n let next: FocusableElement | null = null;\n let last: FocusableElement | null = null;\n do {\n last = walker.lastChild() as FocusableElement | null;\n if (last) {\n next = last;\n }\n } while (last);\n return next;\n}\n"],"names":[],"version":3,"file":"useGridListItem.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/gridlist/src/useGridListItem.ts"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {chain, getActiveElement, getEventTarget, getScrollParent, isFocusWithin, mergeProps, nodeContains, scrollIntoViewport, useSlotId, useSyntheticLinkProps} from '@react-aria/utils';\nimport {Collection, DOMAttributes, FocusableElement, Key, RefObject, Node as RSNode} from '@react-types/shared';\nimport {focusSafely, getFocusableTreeWalker} from '@react-aria/focus';\nimport {getRowId, listMap} from './utils';\nimport {HTMLAttributes, KeyboardEvent as ReactKeyboardEvent, useRef} from 'react';\nimport {isFocusVisible} from '@react-aria/interactions';\nimport type {ListState} from '@react-stately/list';\nimport {SelectableItemStates, useSelectableItem} from '@react-aria/selection';\nimport type {TreeState} from '@react-stately/tree';\nimport {useLocale} from '@react-aria/i18n';\n\nexport interface AriaGridListItemOptions {\n /** An object representing the list item. Contains all the relevant information that makes up the list row. */\n node: RSNode<unknown>,\n /** Whether the list row is contained in a virtual scroller. */\n isVirtualized?: boolean,\n /** Whether selection should occur on press up instead of press down. */\n shouldSelectOnPressUp?: boolean,\n /** Whether this item has children, even if not loaded yet. */\n hasChildItems?: boolean\n}\n\nexport interface GridListItemAria extends SelectableItemStates {\n /** Props for the list row element. */\n rowProps: DOMAttributes,\n /** Props for the grid cell element within the list row. */\n gridCellProps: DOMAttributes,\n /** Props for the list item description element, if any. */\n descriptionProps: DOMAttributes\n}\n\nconst EXPANSION_KEYS = {\n 'expand': {\n ltr: 'ArrowRight',\n rtl: 'ArrowLeft'\n },\n 'collapse': {\n ltr: 'ArrowLeft',\n rtl: 'ArrowRight'\n }\n};\n\n/**\n * Provides the behavior and accessibility implementation for a row in a grid list.\n * @param props - Props for the row.\n * @param state - State of the parent list, as returned by `useListState`.\n * @param ref - The ref attached to the row element.\n */\nexport function useGridListItem<T>(props: AriaGridListItemOptions, state: ListState<T> | TreeState<T>, ref: RefObject<FocusableElement | null>): GridListItemAria {\n // Copied from useGridCell + some modifications to make it not so grid specific\n let {\n node,\n isVirtualized\n } = props;\n\n // let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/gridlist');\n let {direction} = useLocale();\n let {onAction, linkBehavior, keyboardNavigationBehavior, shouldSelectOnPressUp} = listMap.get(state)!;\n let descriptionId = useSlotId();\n\n // We need to track the key of the item at the time it was last focused so that we force\n // focus to go to the item when the DOM node is reused for a different item in a virtualizer.\n let keyWhenFocused = useRef<Key | null>(null);\n let focus = () => {\n // Don't shift focus to the row if the active element is a element within the row already\n // (e.g. clicking on a row button)\n if (\n ref.current !== null &&\n ((keyWhenFocused.current != null && node.key !== keyWhenFocused.current) ||\n !isFocusWithin(ref.current))\n ) {\n focusSafely(ref.current);\n }\n };\n\n let treeGridRowProps: HTMLAttributes<HTMLElement> = {};\n let hasChildRows = props.hasChildItems;\n let hasLink = state.selectionManager.isLink(node.key);\n if (node != null && 'expandedKeys' in state) {\n // TODO: ideally node.hasChildNodes would be a way to tell if a row has child nodes, but the row's contents make it so that value is always\n // true...\n let children = state.collection.getChildren?.(node.key);\n hasChildRows = hasChildRows || [...(children ?? [])].length > 1;\n\n if (onAction == null && !hasLink && state.selectionManager.selectionMode === 'none' && hasChildRows) {\n onAction = () => state.toggleKey(node.key);\n }\n\n let isExpanded = hasChildRows ? state.expandedKeys.has(node.key) : undefined;\n let setSize = 1;\n let index = node.index;\n if (node.level >= 0 && node?.parentKey != null) {\n let parent = state.collection.getItem(node.parentKey);\n if (parent) {\n // siblings must exist because our original node exists\n let siblings = getDirectChildren(parent, state.collection);\n setSize = [...siblings].filter(row => row.type === 'item').length;\n if (index > 0 && siblings[0].type !== 'item') {\n index -= 1; // subtract one for the parent item's content node\n }\n }\n } else {\n setSize = [...state.collection].filter(row => row.level === 0 && row.type === 'item').length;\n }\n\n treeGridRowProps = {\n 'aria-expanded': isExpanded,\n 'aria-level': node.level + 1,\n 'aria-posinset': index + 1,\n 'aria-setsize': setSize\n };\n }\n\n let {itemProps, ...itemStates} = useSelectableItem({\n selectionManager: state.selectionManager,\n key: node.key,\n ref,\n isVirtualized,\n shouldSelectOnPressUp: props.shouldSelectOnPressUp || shouldSelectOnPressUp,\n onAction: onAction || node.props?.onAction ? chain(node.props?.onAction, onAction ? () => onAction(node.key) : undefined) : undefined,\n focus,\n linkBehavior\n });\n\n let onKeyDownCapture = (e: ReactKeyboardEvent) => {\n let activeElement = getActiveElement();\n if (!nodeContains(e.currentTarget, getEventTarget(e) as Element) || !ref.current || !activeElement) {\n return;\n }\n\n let walker = getFocusableTreeWalker(ref.current);\n walker.currentNode = activeElement;\n\n if ('expandedKeys' in state && activeElement === ref.current) {\n if ((e.key === EXPANSION_KEYS['expand'][direction]) && state.selectionManager.focusedKey === node.key && hasChildRows && !state.expandedKeys.has(node.key)) {\n state.toggleKey(node.key);\n e.stopPropagation();\n return;\n } else if ((e.key === EXPANSION_KEYS['collapse'][direction]) && state.selectionManager.focusedKey === node.key && hasChildRows && state.expandedKeys.has(node.key)) {\n state.toggleKey(node.key);\n e.stopPropagation();\n return;\n }\n }\n\n switch (e.key) {\n case 'ArrowLeft': {\n if (keyboardNavigationBehavior === 'arrow') {\n // Find the next focusable element within the row.\n let focusable = direction === 'rtl'\n ? walker.nextNode() as FocusableElement\n : walker.previousNode() as FocusableElement;\n\n if (focusable) {\n e.preventDefault();\n e.stopPropagation();\n focusSafely(focusable);\n scrollIntoViewport(focusable, {containingElement: getScrollParent(ref.current)});\n } else {\n // If there is no next focusable child, then return focus back to the row\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n focusSafely(ref.current);\n scrollIntoViewport(ref.current, {containingElement: getScrollParent(ref.current)});\n } else {\n walker.currentNode = ref.current;\n let lastElement = last(walker);\n if (lastElement) {\n focusSafely(lastElement);\n scrollIntoViewport(lastElement, {containingElement: getScrollParent(ref.current)});\n }\n }\n }\n }\n break;\n }\n case 'ArrowRight': {\n if (keyboardNavigationBehavior === 'arrow') {\n let focusable = direction === 'rtl'\n ? walker.previousNode() as FocusableElement\n : walker.nextNode() as FocusableElement;\n\n if (focusable) {\n e.preventDefault();\n e.stopPropagation();\n focusSafely(focusable);\n scrollIntoViewport(focusable, {containingElement: getScrollParent(ref.current)});\n } else {\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'ltr') {\n focusSafely(ref.current);\n scrollIntoViewport(ref.current, {containingElement: getScrollParent(ref.current)});\n } else {\n walker.currentNode = ref.current;\n let lastElement = last(walker);\n if (lastElement) {\n focusSafely(lastElement);\n scrollIntoViewport(lastElement, {containingElement: getScrollParent(ref.current)});\n }\n }\n }\n }\n break;\n }\n case 'ArrowUp':\n case 'ArrowDown':\n // Prevent this event from reaching row children, e.g. menu buttons. We want arrow keys to navigate\n // to the row above/below instead. We need to re-dispatch the event from a higher parent so it still\n // bubbles and gets handled by useSelectableCollection.\n if (!e.altKey && nodeContains(ref.current, getEventTarget(e) as Element)) {\n e.stopPropagation();\n e.preventDefault();\n ref.current.parentElement?.dispatchEvent(\n new KeyboardEvent(e.nativeEvent.type, e.nativeEvent)\n );\n }\n break;\n }\n };\n\n let onFocus = (e) => {\n keyWhenFocused.current = node.key;\n if (getEventTarget(e) !== ref.current) {\n // useSelectableItem only handles setting the focused key when\n // the focused element is the row itself. We also want to\n // set the focused key when a child element receives focus.\n // If focus is currently visible (e.g. the user is navigating with the keyboard),\n // then skip this. We want to restore focus to the previously focused row\n // in that case since the list should act like a single tab stop.\n if (!isFocusVisible()) {\n state.selectionManager.setFocusedKey(node.key);\n }\n return;\n }\n };\n\n let onKeyDown = (e) => {\n let activeElement = getActiveElement();\n if (!nodeContains(e.currentTarget, getEventTarget(e) as Element) || !ref.current || !activeElement) {\n return;\n }\n\n switch (e.key) {\n case 'Tab': {\n if (keyboardNavigationBehavior === 'tab') {\n // If there is another focusable element within this item, stop propagation so the tab key\n // is handled by the browser and not by useSelectableCollection (which would take us out of the list).\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n walker.currentNode = activeElement;\n let next = e.shiftKey ? walker.previousNode() : walker.nextNode();\n\n if (next) {\n e.stopPropagation();\n }\n }\n }\n }\n };\n\n let syntheticLinkProps = useSyntheticLinkProps(node.props);\n let linkProps = itemStates.hasAction ? syntheticLinkProps : {};\n // TODO: re-add when we get translations and fix this for iOS VO\n // let rowAnnouncement;\n // if (onAction) {\n // rowAnnouncement = stringFormatter.format('hasActionAnnouncement');\n // } else if (hasLink) {\n // rowAnnouncement = stringFormatter.format('hasLinkAnnouncement', {\n // link: node.props.href\n // });\n // }\n\n let rowProps: DOMAttributes = mergeProps(itemProps, linkProps, {\n role: 'row',\n onKeyDownCapture,\n onKeyDown,\n onFocus,\n // 'aria-label': [(node.textValue || undefined), rowAnnouncement].filter(Boolean).join(', '),\n 'aria-label': node['aria-label'] || node.textValue || undefined,\n 'aria-selected': state.selectionManager.canSelectItem(node.key) ? state.selectionManager.isSelected(node.key) : undefined,\n 'aria-disabled': state.selectionManager.isDisabled(node.key) || undefined,\n 'aria-labelledby': descriptionId && (node['aria-label'] || node.textValue) ? `${getRowId(state, node.key)} ${descriptionId}` : undefined,\n id: getRowId(state, node.key)\n });\n\n if (isVirtualized) {\n let {collection} = state;\n let nodes = [...collection];\n // TODO: refactor ListCollection to store an absolute index of a node's position?\n rowProps['aria-rowindex'] = nodes.find(node => node.type === 'section') ? [...collection.getKeys()].filter((key) => collection.getItem(key)?.type !== 'section').findIndex((key) => key === node.key) + 1 : node.index + 1;\n }\n\n let gridCellProps = {\n role: 'gridcell',\n 'aria-colindex': 1\n };\n\n // TODO: should isExpanded and hasChildRows be a item state that gets returned by the hook?\n return {\n rowProps: {...mergeProps(rowProps, treeGridRowProps)},\n gridCellProps,\n descriptionProps: {\n id: descriptionId\n },\n ...itemStates\n };\n}\n\nfunction last(walker: TreeWalker) {\n let next: FocusableElement | null = null;\n let last: FocusableElement | null = null;\n do {\n last = walker.lastChild() as FocusableElement | null;\n if (last) {\n next = last;\n }\n } while (last);\n return next;\n}\n\nfunction getDirectChildren<T>(parent: RSNode<T>, collection: Collection<RSNode<T>>) {\n // We can't assume that we can use firstChildKey because if a person builds a tree using hooks, they would not have access to that property (using type Node vs CollectionNode)\n // Instead, get all children and start at the first node (rather than just using firstChildKey) and only look at its siblings\n let children = collection.getChildren?.(parent.key);\n let childArray = children ? Array.from(children) : [];\n let node = childArray.length > 0 ? childArray[0] : null;\n let siblings: RSNode<T>[] = [];\n while (node) {\n siblings.push(node);\n node = node.nextKey != null ? collection.getItem(node.nextKey) : null;\n }\n return siblings;\n}\n"],"names":[],"version":3,"file":"useGridListItem.main.js.map"}
|
package/dist/useGridListItem.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {getRowId as $ce9b18daab526bbd$export$f45c25170b9a99c2, listMap as $ce9b18daab526bbd$export$5b9bb410392e3991} from "./utils.mjs";
|
|
2
|
-
import {useSlotId as $lxFUG$useSlotId, chain as $lxFUG$chain, scrollIntoViewport as $lxFUG$scrollIntoViewport, getScrollParent as $lxFUG$getScrollParent, useSyntheticLinkProps as $lxFUG$useSyntheticLinkProps, mergeProps as $lxFUG$mergeProps} from "@react-aria/utils";
|
|
2
|
+
import {useSlotId as $lxFUG$useSlotId, isFocusWithin as $lxFUG$isFocusWithin, chain as $lxFUG$chain, getActiveElement as $lxFUG$getActiveElement, nodeContains as $lxFUG$nodeContains, getEventTarget as $lxFUG$getEventTarget, scrollIntoViewport as $lxFUG$scrollIntoViewport, getScrollParent as $lxFUG$getScrollParent, useSyntheticLinkProps as $lxFUG$useSyntheticLinkProps, mergeProps as $lxFUG$mergeProps} from "@react-aria/utils";
|
|
3
3
|
import {focusSafely as $lxFUG$focusSafely, getFocusableTreeWalker as $lxFUG$getFocusableTreeWalker} from "@react-aria/focus";
|
|
4
4
|
import {useRef as $lxFUG$useRef} from "react";
|
|
5
5
|
import {isFocusVisible as $lxFUG$isFocusVisible} from "@react-aria/interactions";
|
|
@@ -45,10 +45,9 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
45
45
|
// focus to go to the item when the DOM node is reused for a different item in a virtualizer.
|
|
46
46
|
let keyWhenFocused = (0, $lxFUG$useRef)(null);
|
|
47
47
|
let focus = ()=>{
|
|
48
|
-
var _ref_current;
|
|
49
48
|
// Don't shift focus to the row if the active element is a element within the row already
|
|
50
49
|
// (e.g. clicking on a row button)
|
|
51
|
-
if (ref.current !== null && (keyWhenFocused.current != null && node.key !== keyWhenFocused.current || !((
|
|
50
|
+
if (ref.current !== null && (keyWhenFocused.current != null && node.key !== keyWhenFocused.current || !(0, $lxFUG$isFocusWithin)(ref.current))) (0, $lxFUG$focusSafely)(ref.current);
|
|
52
51
|
};
|
|
53
52
|
let treeGridRowProps = {};
|
|
54
53
|
let hasChildRows = props.hasChildItems;
|
|
@@ -64,15 +63,16 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
64
63
|
if (onAction == null && !hasLink && state.selectionManager.selectionMode === 'none' && hasChildRows) onAction = ()=>state.toggleKey(node.key);
|
|
65
64
|
let isExpanded = hasChildRows ? state.expandedKeys.has(node.key) : undefined;
|
|
66
65
|
let setSize = 1;
|
|
67
|
-
|
|
66
|
+
let index = node.index;
|
|
67
|
+
if (node.level >= 0 && (node === null || node === void 0 ? void 0 : node.parentKey) != null) {
|
|
68
68
|
let parent = state.collection.getItem(node.parentKey);
|
|
69
69
|
if (parent) {
|
|
70
|
-
var _state_collection_getChildren1, _state_collection1;
|
|
71
70
|
// siblings must exist because our original node exists
|
|
72
|
-
let siblings = (
|
|
71
|
+
let siblings = $4e8b0456ef72939f$var$getDirectChildren(parent, state.collection);
|
|
73
72
|
setSize = [
|
|
74
73
|
...siblings
|
|
75
74
|
].filter((row)=>row.type === 'item').length;
|
|
75
|
+
if (index > 0 && siblings[0].type !== 'item') index -= 1; // subtract one for the parent item's content node
|
|
76
76
|
}
|
|
77
77
|
} else setSize = [
|
|
78
78
|
...state.collection
|
|
@@ -80,7 +80,7 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
80
80
|
treeGridRowProps = {
|
|
81
81
|
'aria-expanded': isExpanded,
|
|
82
82
|
'aria-level': node.level + 1,
|
|
83
|
-
'aria-posinset':
|
|
83
|
+
'aria-posinset': index + 1,
|
|
84
84
|
'aria-setsize': setSize
|
|
85
85
|
};
|
|
86
86
|
}
|
|
@@ -95,10 +95,11 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
95
95
|
linkBehavior: linkBehavior
|
|
96
96
|
});
|
|
97
97
|
let onKeyDownCapture = (e)=>{
|
|
98
|
-
|
|
98
|
+
let activeElement = (0, $lxFUG$getActiveElement)();
|
|
99
|
+
if (!(0, $lxFUG$nodeContains)(e.currentTarget, (0, $lxFUG$getEventTarget)(e)) || !ref.current || !activeElement) return;
|
|
99
100
|
let walker = (0, $lxFUG$getFocusableTreeWalker)(ref.current);
|
|
100
|
-
walker.currentNode =
|
|
101
|
-
if ('expandedKeys' in state &&
|
|
101
|
+
walker.currentNode = activeElement;
|
|
102
|
+
if ('expandedKeys' in state && activeElement === ref.current) {
|
|
102
103
|
if (e.key === $4e8b0456ef72939f$var$EXPANSION_KEYS['expand'][direction] && state.selectionManager.focusedKey === node.key && hasChildRows && !state.expandedKeys.has(node.key)) {
|
|
103
104
|
state.toggleKey(node.key);
|
|
104
105
|
e.stopPropagation();
|
|
@@ -179,7 +180,7 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
179
180
|
// Prevent this event from reaching row children, e.g. menu buttons. We want arrow keys to navigate
|
|
180
181
|
// to the row above/below instead. We need to re-dispatch the event from a higher parent so it still
|
|
181
182
|
// bubbles and gets handled by useSelectableCollection.
|
|
182
|
-
if (!e.altKey && ref.current
|
|
183
|
+
if (!e.altKey && (0, $lxFUG$nodeContains)(ref.current, (0, $lxFUG$getEventTarget)(e))) {
|
|
183
184
|
var _ref_current_parentElement;
|
|
184
185
|
e.stopPropagation();
|
|
185
186
|
e.preventDefault();
|
|
@@ -190,7 +191,7 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
190
191
|
};
|
|
191
192
|
let onFocus = (e)=>{
|
|
192
193
|
keyWhenFocused.current = node.key;
|
|
193
|
-
if (e
|
|
194
|
+
if ((0, $lxFUG$getEventTarget)(e) !== ref.current) {
|
|
194
195
|
// useSelectableItem only handles setting the focused key when
|
|
195
196
|
// the focused element is the row itself. We also want to
|
|
196
197
|
// set the focused key when a child element receives focus.
|
|
@@ -202,7 +203,8 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
202
203
|
}
|
|
203
204
|
};
|
|
204
205
|
let onKeyDown = (e)=>{
|
|
205
|
-
|
|
206
|
+
let activeElement = (0, $lxFUG$getActiveElement)();
|
|
207
|
+
if (!(0, $lxFUG$nodeContains)(e.currentTarget, (0, $lxFUG$getEventTarget)(e)) || !ref.current || !activeElement) return;
|
|
206
208
|
switch(e.key){
|
|
207
209
|
case 'Tab':
|
|
208
210
|
if (keyboardNavigationBehavior === 'tab') {
|
|
@@ -211,7 +213,7 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
211
213
|
let walker = (0, $lxFUG$getFocusableTreeWalker)(ref.current, {
|
|
212
214
|
tabbable: true
|
|
213
215
|
});
|
|
214
|
-
walker.currentNode =
|
|
216
|
+
walker.currentNode = activeElement;
|
|
215
217
|
let next = e.shiftKey ? walker.previousNode() : walker.nextNode();
|
|
216
218
|
if (next) e.stopPropagation();
|
|
217
219
|
}
|
|
@@ -278,6 +280,20 @@ function $4e8b0456ef72939f$var$last(walker) {
|
|
|
278
280
|
}while (last);
|
|
279
281
|
return next;
|
|
280
282
|
}
|
|
283
|
+
function $4e8b0456ef72939f$var$getDirectChildren(parent, collection) {
|
|
284
|
+
var _collection_getChildren;
|
|
285
|
+
// We can't assume that we can use firstChildKey because if a person builds a tree using hooks, they would not have access to that property (using type Node vs CollectionNode)
|
|
286
|
+
// Instead, get all children and start at the first node (rather than just using firstChildKey) and only look at its siblings
|
|
287
|
+
let children = (_collection_getChildren = collection.getChildren) === null || _collection_getChildren === void 0 ? void 0 : _collection_getChildren.call(collection, parent.key);
|
|
288
|
+
let childArray = children ? Array.from(children) : [];
|
|
289
|
+
let node = childArray.length > 0 ? childArray[0] : null;
|
|
290
|
+
let siblings = [];
|
|
291
|
+
while(node){
|
|
292
|
+
siblings.push(node);
|
|
293
|
+
node = node.nextKey != null ? collection.getItem(node.nextKey) : null;
|
|
294
|
+
}
|
|
295
|
+
return siblings;
|
|
296
|
+
}
|
|
281
297
|
|
|
282
298
|
|
|
283
299
|
export {$4e8b0456ef72939f$export$9610e69494fadfd2 as useGridListItem};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {getRowId as $ce9b18daab526bbd$export$f45c25170b9a99c2, listMap as $ce9b18daab526bbd$export$5b9bb410392e3991} from "./utils.module.js";
|
|
2
|
-
import {useSlotId as $lxFUG$useSlotId, chain as $lxFUG$chain, scrollIntoViewport as $lxFUG$scrollIntoViewport, getScrollParent as $lxFUG$getScrollParent, useSyntheticLinkProps as $lxFUG$useSyntheticLinkProps, mergeProps as $lxFUG$mergeProps} from "@react-aria/utils";
|
|
2
|
+
import {useSlotId as $lxFUG$useSlotId, isFocusWithin as $lxFUG$isFocusWithin, chain as $lxFUG$chain, getActiveElement as $lxFUG$getActiveElement, nodeContains as $lxFUG$nodeContains, getEventTarget as $lxFUG$getEventTarget, scrollIntoViewport as $lxFUG$scrollIntoViewport, getScrollParent as $lxFUG$getScrollParent, useSyntheticLinkProps as $lxFUG$useSyntheticLinkProps, mergeProps as $lxFUG$mergeProps} from "@react-aria/utils";
|
|
3
3
|
import {focusSafely as $lxFUG$focusSafely, getFocusableTreeWalker as $lxFUG$getFocusableTreeWalker} from "@react-aria/focus";
|
|
4
4
|
import {useRef as $lxFUG$useRef} from "react";
|
|
5
5
|
import {isFocusVisible as $lxFUG$isFocusVisible} from "@react-aria/interactions";
|
|
@@ -45,10 +45,9 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
45
45
|
// focus to go to the item when the DOM node is reused for a different item in a virtualizer.
|
|
46
46
|
let keyWhenFocused = (0, $lxFUG$useRef)(null);
|
|
47
47
|
let focus = ()=>{
|
|
48
|
-
var _ref_current;
|
|
49
48
|
// Don't shift focus to the row if the active element is a element within the row already
|
|
50
49
|
// (e.g. clicking on a row button)
|
|
51
|
-
if (ref.current !== null && (keyWhenFocused.current != null && node.key !== keyWhenFocused.current || !((
|
|
50
|
+
if (ref.current !== null && (keyWhenFocused.current != null && node.key !== keyWhenFocused.current || !(0, $lxFUG$isFocusWithin)(ref.current))) (0, $lxFUG$focusSafely)(ref.current);
|
|
52
51
|
};
|
|
53
52
|
let treeGridRowProps = {};
|
|
54
53
|
let hasChildRows = props.hasChildItems;
|
|
@@ -64,15 +63,16 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
64
63
|
if (onAction == null && !hasLink && state.selectionManager.selectionMode === 'none' && hasChildRows) onAction = ()=>state.toggleKey(node.key);
|
|
65
64
|
let isExpanded = hasChildRows ? state.expandedKeys.has(node.key) : undefined;
|
|
66
65
|
let setSize = 1;
|
|
67
|
-
|
|
66
|
+
let index = node.index;
|
|
67
|
+
if (node.level >= 0 && (node === null || node === void 0 ? void 0 : node.parentKey) != null) {
|
|
68
68
|
let parent = state.collection.getItem(node.parentKey);
|
|
69
69
|
if (parent) {
|
|
70
|
-
var _state_collection_getChildren1, _state_collection1;
|
|
71
70
|
// siblings must exist because our original node exists
|
|
72
|
-
let siblings = (
|
|
71
|
+
let siblings = $4e8b0456ef72939f$var$getDirectChildren(parent, state.collection);
|
|
73
72
|
setSize = [
|
|
74
73
|
...siblings
|
|
75
74
|
].filter((row)=>row.type === 'item').length;
|
|
75
|
+
if (index > 0 && siblings[0].type !== 'item') index -= 1; // subtract one for the parent item's content node
|
|
76
76
|
}
|
|
77
77
|
} else setSize = [
|
|
78
78
|
...state.collection
|
|
@@ -80,7 +80,7 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
80
80
|
treeGridRowProps = {
|
|
81
81
|
'aria-expanded': isExpanded,
|
|
82
82
|
'aria-level': node.level + 1,
|
|
83
|
-
'aria-posinset':
|
|
83
|
+
'aria-posinset': index + 1,
|
|
84
84
|
'aria-setsize': setSize
|
|
85
85
|
};
|
|
86
86
|
}
|
|
@@ -95,10 +95,11 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
95
95
|
linkBehavior: linkBehavior
|
|
96
96
|
});
|
|
97
97
|
let onKeyDownCapture = (e)=>{
|
|
98
|
-
|
|
98
|
+
let activeElement = (0, $lxFUG$getActiveElement)();
|
|
99
|
+
if (!(0, $lxFUG$nodeContains)(e.currentTarget, (0, $lxFUG$getEventTarget)(e)) || !ref.current || !activeElement) return;
|
|
99
100
|
let walker = (0, $lxFUG$getFocusableTreeWalker)(ref.current);
|
|
100
|
-
walker.currentNode =
|
|
101
|
-
if ('expandedKeys' in state &&
|
|
101
|
+
walker.currentNode = activeElement;
|
|
102
|
+
if ('expandedKeys' in state && activeElement === ref.current) {
|
|
102
103
|
if (e.key === $4e8b0456ef72939f$var$EXPANSION_KEYS['expand'][direction] && state.selectionManager.focusedKey === node.key && hasChildRows && !state.expandedKeys.has(node.key)) {
|
|
103
104
|
state.toggleKey(node.key);
|
|
104
105
|
e.stopPropagation();
|
|
@@ -179,7 +180,7 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
179
180
|
// Prevent this event from reaching row children, e.g. menu buttons. We want arrow keys to navigate
|
|
180
181
|
// to the row above/below instead. We need to re-dispatch the event from a higher parent so it still
|
|
181
182
|
// bubbles and gets handled by useSelectableCollection.
|
|
182
|
-
if (!e.altKey && ref.current
|
|
183
|
+
if (!e.altKey && (0, $lxFUG$nodeContains)(ref.current, (0, $lxFUG$getEventTarget)(e))) {
|
|
183
184
|
var _ref_current_parentElement;
|
|
184
185
|
e.stopPropagation();
|
|
185
186
|
e.preventDefault();
|
|
@@ -190,7 +191,7 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
190
191
|
};
|
|
191
192
|
let onFocus = (e)=>{
|
|
192
193
|
keyWhenFocused.current = node.key;
|
|
193
|
-
if (e
|
|
194
|
+
if ((0, $lxFUG$getEventTarget)(e) !== ref.current) {
|
|
194
195
|
// useSelectableItem only handles setting the focused key when
|
|
195
196
|
// the focused element is the row itself. We also want to
|
|
196
197
|
// set the focused key when a child element receives focus.
|
|
@@ -202,7 +203,8 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
202
203
|
}
|
|
203
204
|
};
|
|
204
205
|
let onKeyDown = (e)=>{
|
|
205
|
-
|
|
206
|
+
let activeElement = (0, $lxFUG$getActiveElement)();
|
|
207
|
+
if (!(0, $lxFUG$nodeContains)(e.currentTarget, (0, $lxFUG$getEventTarget)(e)) || !ref.current || !activeElement) return;
|
|
206
208
|
switch(e.key){
|
|
207
209
|
case 'Tab':
|
|
208
210
|
if (keyboardNavigationBehavior === 'tab') {
|
|
@@ -211,7 +213,7 @@ function $4e8b0456ef72939f$export$9610e69494fadfd2(props, state, ref) {
|
|
|
211
213
|
let walker = (0, $lxFUG$getFocusableTreeWalker)(ref.current, {
|
|
212
214
|
tabbable: true
|
|
213
215
|
});
|
|
214
|
-
walker.currentNode =
|
|
216
|
+
walker.currentNode = activeElement;
|
|
215
217
|
let next = e.shiftKey ? walker.previousNode() : walker.nextNode();
|
|
216
218
|
if (next) e.stopPropagation();
|
|
217
219
|
}
|
|
@@ -278,6 +280,20 @@ function $4e8b0456ef72939f$var$last(walker) {
|
|
|
278
280
|
}while (last);
|
|
279
281
|
return next;
|
|
280
282
|
}
|
|
283
|
+
function $4e8b0456ef72939f$var$getDirectChildren(parent, collection) {
|
|
284
|
+
var _collection_getChildren;
|
|
285
|
+
// We can't assume that we can use firstChildKey because if a person builds a tree using hooks, they would not have access to that property (using type Node vs CollectionNode)
|
|
286
|
+
// Instead, get all children and start at the first node (rather than just using firstChildKey) and only look at its siblings
|
|
287
|
+
let children = (_collection_getChildren = collection.getChildren) === null || _collection_getChildren === void 0 ? void 0 : _collection_getChildren.call(collection, parent.key);
|
|
288
|
+
let childArray = children ? Array.from(children) : [];
|
|
289
|
+
let node = childArray.length > 0 ? childArray[0] : null;
|
|
290
|
+
let siblings = [];
|
|
291
|
+
while(node){
|
|
292
|
+
siblings.push(node);
|
|
293
|
+
node = node.nextKey != null ? collection.getItem(node.nextKey) : null;
|
|
294
|
+
}
|
|
295
|
+
return siblings;
|
|
296
|
+
}
|
|
281
297
|
|
|
282
298
|
|
|
283
299
|
export {$4e8b0456ef72939f$export$9610e69494fadfd2 as useGridListItem};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-aria/gridlist/src/useGridListItem.ts"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {chain, getScrollParent, mergeProps, scrollIntoViewport, useSlotId, useSyntheticLinkProps} from '@react-aria/utils';\nimport {DOMAttributes, FocusableElement, Key, RefObject, Node as RSNode} from '@react-types/shared';\nimport {focusSafely, getFocusableTreeWalker} from '@react-aria/focus';\nimport {getRowId, listMap} from './utils';\nimport {HTMLAttributes, KeyboardEvent as ReactKeyboardEvent, useRef} from 'react';\nimport {isFocusVisible} from '@react-aria/interactions';\nimport type {ListState} from '@react-stately/list';\nimport {SelectableItemStates, useSelectableItem} from '@react-aria/selection';\nimport type {TreeState} from '@react-stately/tree';\nimport {useLocale} from '@react-aria/i18n';\n\nexport interface AriaGridListItemOptions {\n /** An object representing the list item. Contains all the relevant information that makes up the list row. */\n node: RSNode<unknown>,\n /** Whether the list row is contained in a virtual scroller. */\n isVirtualized?: boolean,\n /** Whether selection should occur on press up instead of press down. */\n shouldSelectOnPressUp?: boolean,\n /** Whether this item has children, even if not loaded yet. */\n hasChildItems?: boolean\n}\n\nexport interface GridListItemAria extends SelectableItemStates {\n /** Props for the list row element. */\n rowProps: DOMAttributes,\n /** Props for the grid cell element within the list row. */\n gridCellProps: DOMAttributes,\n /** Props for the list item description element, if any. */\n descriptionProps: DOMAttributes\n}\n\nconst EXPANSION_KEYS = {\n 'expand': {\n ltr: 'ArrowRight',\n rtl: 'ArrowLeft'\n },\n 'collapse': {\n ltr: 'ArrowLeft',\n rtl: 'ArrowRight'\n }\n};\n\n/**\n * Provides the behavior and accessibility implementation for a row in a grid list.\n * @param props - Props for the row.\n * @param state - State of the parent list, as returned by `useListState`.\n * @param ref - The ref attached to the row element.\n */\nexport function useGridListItem<T>(props: AriaGridListItemOptions, state: ListState<T> | TreeState<T>, ref: RefObject<FocusableElement | null>): GridListItemAria {\n // Copied from useGridCell + some modifications to make it not so grid specific\n let {\n node,\n isVirtualized\n } = props;\n\n // let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/gridlist');\n let {direction} = useLocale();\n let {onAction, linkBehavior, keyboardNavigationBehavior, shouldSelectOnPressUp} = listMap.get(state)!;\n let descriptionId = useSlotId();\n\n // We need to track the key of the item at the time it was last focused so that we force\n // focus to go to the item when the DOM node is reused for a different item in a virtualizer.\n let keyWhenFocused = useRef<Key | null>(null);\n let focus = () => {\n // Don't shift focus to the row if the active element is a element within the row already\n // (e.g. clicking on a row button)\n if (\n ref.current !== null &&\n ((keyWhenFocused.current != null && node.key !== keyWhenFocused.current) ||\n !ref.current?.contains(document.activeElement))\n ) {\n focusSafely(ref.current);\n }\n };\n\n let treeGridRowProps: HTMLAttributes<HTMLElement> = {};\n let hasChildRows = props.hasChildItems;\n let hasLink = state.selectionManager.isLink(node.key);\n if (node != null && 'expandedKeys' in state) {\n // TODO: ideally node.hasChildNodes would be a way to tell if a row has child nodes, but the row's contents make it so that value is always\n // true...\n let children = state.collection.getChildren?.(node.key);\n hasChildRows = hasChildRows || [...(children ?? [])].length > 1;\n\n if (onAction == null && !hasLink && state.selectionManager.selectionMode === 'none' && hasChildRows) {\n onAction = () => state.toggleKey(node.key);\n }\n\n let isExpanded = hasChildRows ? state.expandedKeys.has(node.key) : undefined;\n let setSize = 1;\n if (node.level > 0 && node?.parentKey != null) {\n let parent = state.collection.getItem(node.parentKey);\n if (parent) {\n // siblings must exist because our original node exists\n let siblings = state.collection.getChildren?.(parent.key)!;\n setSize = [...siblings].filter(row => row.type === 'item').length;\n }\n } else {\n setSize = [...state.collection].filter(row => row.level === 0 && row.type === 'item').length;\n }\n\n treeGridRowProps = {\n 'aria-expanded': isExpanded,\n 'aria-level': node.level + 1,\n 'aria-posinset': node?.index + 1,\n 'aria-setsize': setSize\n };\n }\n\n let {itemProps, ...itemStates} = useSelectableItem({\n selectionManager: state.selectionManager,\n key: node.key,\n ref,\n isVirtualized,\n shouldSelectOnPressUp: props.shouldSelectOnPressUp || shouldSelectOnPressUp,\n onAction: onAction || node.props?.onAction ? chain(node.props?.onAction, onAction ? () => onAction(node.key) : undefined) : undefined,\n focus,\n linkBehavior\n });\n\n let onKeyDownCapture = (e: ReactKeyboardEvent) => {\n if (!e.currentTarget.contains(e.target as Element) || !ref.current || !document.activeElement) {\n return;\n }\n\n let walker = getFocusableTreeWalker(ref.current);\n walker.currentNode = document.activeElement;\n\n if ('expandedKeys' in state && document.activeElement === ref.current) {\n if ((e.key === EXPANSION_KEYS['expand'][direction]) && state.selectionManager.focusedKey === node.key && hasChildRows && !state.expandedKeys.has(node.key)) {\n state.toggleKey(node.key);\n e.stopPropagation();\n return;\n } else if ((e.key === EXPANSION_KEYS['collapse'][direction]) && state.selectionManager.focusedKey === node.key && hasChildRows && state.expandedKeys.has(node.key)) {\n state.toggleKey(node.key);\n e.stopPropagation();\n return;\n }\n }\n\n switch (e.key) {\n case 'ArrowLeft': {\n if (keyboardNavigationBehavior === 'arrow') {\n // Find the next focusable element within the row.\n let focusable = direction === 'rtl'\n ? walker.nextNode() as FocusableElement\n : walker.previousNode() as FocusableElement;\n\n if (focusable) {\n e.preventDefault();\n e.stopPropagation();\n focusSafely(focusable);\n scrollIntoViewport(focusable, {containingElement: getScrollParent(ref.current)});\n } else {\n // If there is no next focusable child, then return focus back to the row\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n focusSafely(ref.current);\n scrollIntoViewport(ref.current, {containingElement: getScrollParent(ref.current)});\n } else {\n walker.currentNode = ref.current;\n let lastElement = last(walker);\n if (lastElement) {\n focusSafely(lastElement);\n scrollIntoViewport(lastElement, {containingElement: getScrollParent(ref.current)});\n }\n }\n }\n }\n break;\n }\n case 'ArrowRight': {\n if (keyboardNavigationBehavior === 'arrow') {\n let focusable = direction === 'rtl'\n ? walker.previousNode() as FocusableElement\n : walker.nextNode() as FocusableElement;\n\n if (focusable) {\n e.preventDefault();\n e.stopPropagation();\n focusSafely(focusable);\n scrollIntoViewport(focusable, {containingElement: getScrollParent(ref.current)});\n } else {\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'ltr') {\n focusSafely(ref.current);\n scrollIntoViewport(ref.current, {containingElement: getScrollParent(ref.current)});\n } else {\n walker.currentNode = ref.current;\n let lastElement = last(walker);\n if (lastElement) {\n focusSafely(lastElement);\n scrollIntoViewport(lastElement, {containingElement: getScrollParent(ref.current)});\n }\n }\n }\n }\n break;\n }\n case 'ArrowUp':\n case 'ArrowDown':\n // Prevent this event from reaching row children, e.g. menu buttons. We want arrow keys to navigate\n // to the row above/below instead. We need to re-dispatch the event from a higher parent so it still\n // bubbles and gets handled by useSelectableCollection.\n if (!e.altKey && ref.current.contains(e.target as Element)) {\n e.stopPropagation();\n e.preventDefault();\n ref.current.parentElement?.dispatchEvent(\n new KeyboardEvent(e.nativeEvent.type, e.nativeEvent)\n );\n }\n break;\n }\n };\n\n let onFocus = (e) => {\n keyWhenFocused.current = node.key;\n if (e.target !== ref.current) {\n // useSelectableItem only handles setting the focused key when\n // the focused element is the row itself. We also want to\n // set the focused key when a child element receives focus.\n // If focus is currently visible (e.g. the user is navigating with the keyboard),\n // then skip this. We want to restore focus to the previously focused row\n // in that case since the list should act like a single tab stop.\n if (!isFocusVisible()) {\n state.selectionManager.setFocusedKey(node.key);\n }\n return;\n }\n };\n\n let onKeyDown = (e) => {\n if (!e.currentTarget.contains(e.target as Element) || !ref.current || !document.activeElement) {\n return;\n }\n\n switch (e.key) {\n case 'Tab': {\n if (keyboardNavigationBehavior === 'tab') {\n // If there is another focusable element within this item, stop propagation so the tab key\n // is handled by the browser and not by useSelectableCollection (which would take us out of the list).\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n walker.currentNode = document.activeElement;\n let next = e.shiftKey ? walker.previousNode() : walker.nextNode();\n\n if (next) {\n e.stopPropagation();\n }\n }\n }\n }\n };\n\n let syntheticLinkProps = useSyntheticLinkProps(node.props);\n let linkProps = itemStates.hasAction ? syntheticLinkProps : {};\n // TODO: re-add when we get translations and fix this for iOS VO\n // let rowAnnouncement;\n // if (onAction) {\n // rowAnnouncement = stringFormatter.format('hasActionAnnouncement');\n // } else if (hasLink) {\n // rowAnnouncement = stringFormatter.format('hasLinkAnnouncement', {\n // link: node.props.href\n // });\n // }\n\n let rowProps: DOMAttributes = mergeProps(itemProps, linkProps, {\n role: 'row',\n onKeyDownCapture,\n onKeyDown,\n onFocus,\n // 'aria-label': [(node.textValue || undefined), rowAnnouncement].filter(Boolean).join(', '),\n 'aria-label': node['aria-label'] || node.textValue || undefined,\n 'aria-selected': state.selectionManager.canSelectItem(node.key) ? state.selectionManager.isSelected(node.key) : undefined,\n 'aria-disabled': state.selectionManager.isDisabled(node.key) || undefined,\n 'aria-labelledby': descriptionId && (node['aria-label'] || node.textValue) ? `${getRowId(state, node.key)} ${descriptionId}` : undefined,\n id: getRowId(state, node.key)\n });\n\n if (isVirtualized) {\n let {collection} = state;\n let nodes = [...collection];\n // TODO: refactor ListCollection to store an absolute index of a node's position?\n rowProps['aria-rowindex'] = nodes.find(node => node.type === 'section') ? [...collection.getKeys()].filter((key) => collection.getItem(key)?.type !== 'section').findIndex((key) => key === node.key) + 1 : node.index + 1;\n }\n\n let gridCellProps = {\n role: 'gridcell',\n 'aria-colindex': 1\n };\n\n // TODO: should isExpanded and hasChildRows be a item state that gets returned by the hook?\n return {\n rowProps: {...mergeProps(rowProps, treeGridRowProps)},\n gridCellProps,\n descriptionProps: {\n id: descriptionId\n },\n ...itemStates\n };\n}\n\nfunction last(walker: TreeWalker) {\n let next: FocusableElement | null = null;\n let last: FocusableElement | null = null;\n do {\n last = walker.lastChild() as FocusableElement | null;\n if (last) {\n next = last;\n }\n } while (last);\n return next;\n}\n"],"names":[],"version":3,"file":"useGridListItem.module.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/gridlist/src/useGridListItem.ts"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {chain, getActiveElement, getEventTarget, getScrollParent, isFocusWithin, mergeProps, nodeContains, scrollIntoViewport, useSlotId, useSyntheticLinkProps} from '@react-aria/utils';\nimport {Collection, DOMAttributes, FocusableElement, Key, RefObject, Node as RSNode} from '@react-types/shared';\nimport {focusSafely, getFocusableTreeWalker} from '@react-aria/focus';\nimport {getRowId, listMap} from './utils';\nimport {HTMLAttributes, KeyboardEvent as ReactKeyboardEvent, useRef} from 'react';\nimport {isFocusVisible} from '@react-aria/interactions';\nimport type {ListState} from '@react-stately/list';\nimport {SelectableItemStates, useSelectableItem} from '@react-aria/selection';\nimport type {TreeState} from '@react-stately/tree';\nimport {useLocale} from '@react-aria/i18n';\n\nexport interface AriaGridListItemOptions {\n /** An object representing the list item. Contains all the relevant information that makes up the list row. */\n node: RSNode<unknown>,\n /** Whether the list row is contained in a virtual scroller. */\n isVirtualized?: boolean,\n /** Whether selection should occur on press up instead of press down. */\n shouldSelectOnPressUp?: boolean,\n /** Whether this item has children, even if not loaded yet. */\n hasChildItems?: boolean\n}\n\nexport interface GridListItemAria extends SelectableItemStates {\n /** Props for the list row element. */\n rowProps: DOMAttributes,\n /** Props for the grid cell element within the list row. */\n gridCellProps: DOMAttributes,\n /** Props for the list item description element, if any. */\n descriptionProps: DOMAttributes\n}\n\nconst EXPANSION_KEYS = {\n 'expand': {\n ltr: 'ArrowRight',\n rtl: 'ArrowLeft'\n },\n 'collapse': {\n ltr: 'ArrowLeft',\n rtl: 'ArrowRight'\n }\n};\n\n/**\n * Provides the behavior and accessibility implementation for a row in a grid list.\n * @param props - Props for the row.\n * @param state - State of the parent list, as returned by `useListState`.\n * @param ref - The ref attached to the row element.\n */\nexport function useGridListItem<T>(props: AriaGridListItemOptions, state: ListState<T> | TreeState<T>, ref: RefObject<FocusableElement | null>): GridListItemAria {\n // Copied from useGridCell + some modifications to make it not so grid specific\n let {\n node,\n isVirtualized\n } = props;\n\n // let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/gridlist');\n let {direction} = useLocale();\n let {onAction, linkBehavior, keyboardNavigationBehavior, shouldSelectOnPressUp} = listMap.get(state)!;\n let descriptionId = useSlotId();\n\n // We need to track the key of the item at the time it was last focused so that we force\n // focus to go to the item when the DOM node is reused for a different item in a virtualizer.\n let keyWhenFocused = useRef<Key | null>(null);\n let focus = () => {\n // Don't shift focus to the row if the active element is a element within the row already\n // (e.g. clicking on a row button)\n if (\n ref.current !== null &&\n ((keyWhenFocused.current != null && node.key !== keyWhenFocused.current) ||\n !isFocusWithin(ref.current))\n ) {\n focusSafely(ref.current);\n }\n };\n\n let treeGridRowProps: HTMLAttributes<HTMLElement> = {};\n let hasChildRows = props.hasChildItems;\n let hasLink = state.selectionManager.isLink(node.key);\n if (node != null && 'expandedKeys' in state) {\n // TODO: ideally node.hasChildNodes would be a way to tell if a row has child nodes, but the row's contents make it so that value is always\n // true...\n let children = state.collection.getChildren?.(node.key);\n hasChildRows = hasChildRows || [...(children ?? [])].length > 1;\n\n if (onAction == null && !hasLink && state.selectionManager.selectionMode === 'none' && hasChildRows) {\n onAction = () => state.toggleKey(node.key);\n }\n\n let isExpanded = hasChildRows ? state.expandedKeys.has(node.key) : undefined;\n let setSize = 1;\n let index = node.index;\n if (node.level >= 0 && node?.parentKey != null) {\n let parent = state.collection.getItem(node.parentKey);\n if (parent) {\n // siblings must exist because our original node exists\n let siblings = getDirectChildren(parent, state.collection);\n setSize = [...siblings].filter(row => row.type === 'item').length;\n if (index > 0 && siblings[0].type !== 'item') {\n index -= 1; // subtract one for the parent item's content node\n }\n }\n } else {\n setSize = [...state.collection].filter(row => row.level === 0 && row.type === 'item').length;\n }\n\n treeGridRowProps = {\n 'aria-expanded': isExpanded,\n 'aria-level': node.level + 1,\n 'aria-posinset': index + 1,\n 'aria-setsize': setSize\n };\n }\n\n let {itemProps, ...itemStates} = useSelectableItem({\n selectionManager: state.selectionManager,\n key: node.key,\n ref,\n isVirtualized,\n shouldSelectOnPressUp: props.shouldSelectOnPressUp || shouldSelectOnPressUp,\n onAction: onAction || node.props?.onAction ? chain(node.props?.onAction, onAction ? () => onAction(node.key) : undefined) : undefined,\n focus,\n linkBehavior\n });\n\n let onKeyDownCapture = (e: ReactKeyboardEvent) => {\n let activeElement = getActiveElement();\n if (!nodeContains(e.currentTarget, getEventTarget(e) as Element) || !ref.current || !activeElement) {\n return;\n }\n\n let walker = getFocusableTreeWalker(ref.current);\n walker.currentNode = activeElement;\n\n if ('expandedKeys' in state && activeElement === ref.current) {\n if ((e.key === EXPANSION_KEYS['expand'][direction]) && state.selectionManager.focusedKey === node.key && hasChildRows && !state.expandedKeys.has(node.key)) {\n state.toggleKey(node.key);\n e.stopPropagation();\n return;\n } else if ((e.key === EXPANSION_KEYS['collapse'][direction]) && state.selectionManager.focusedKey === node.key && hasChildRows && state.expandedKeys.has(node.key)) {\n state.toggleKey(node.key);\n e.stopPropagation();\n return;\n }\n }\n\n switch (e.key) {\n case 'ArrowLeft': {\n if (keyboardNavigationBehavior === 'arrow') {\n // Find the next focusable element within the row.\n let focusable = direction === 'rtl'\n ? walker.nextNode() as FocusableElement\n : walker.previousNode() as FocusableElement;\n\n if (focusable) {\n e.preventDefault();\n e.stopPropagation();\n focusSafely(focusable);\n scrollIntoViewport(focusable, {containingElement: getScrollParent(ref.current)});\n } else {\n // If there is no next focusable child, then return focus back to the row\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n focusSafely(ref.current);\n scrollIntoViewport(ref.current, {containingElement: getScrollParent(ref.current)});\n } else {\n walker.currentNode = ref.current;\n let lastElement = last(walker);\n if (lastElement) {\n focusSafely(lastElement);\n scrollIntoViewport(lastElement, {containingElement: getScrollParent(ref.current)});\n }\n }\n }\n }\n break;\n }\n case 'ArrowRight': {\n if (keyboardNavigationBehavior === 'arrow') {\n let focusable = direction === 'rtl'\n ? walker.previousNode() as FocusableElement\n : walker.nextNode() as FocusableElement;\n\n if (focusable) {\n e.preventDefault();\n e.stopPropagation();\n focusSafely(focusable);\n scrollIntoViewport(focusable, {containingElement: getScrollParent(ref.current)});\n } else {\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'ltr') {\n focusSafely(ref.current);\n scrollIntoViewport(ref.current, {containingElement: getScrollParent(ref.current)});\n } else {\n walker.currentNode = ref.current;\n let lastElement = last(walker);\n if (lastElement) {\n focusSafely(lastElement);\n scrollIntoViewport(lastElement, {containingElement: getScrollParent(ref.current)});\n }\n }\n }\n }\n break;\n }\n case 'ArrowUp':\n case 'ArrowDown':\n // Prevent this event from reaching row children, e.g. menu buttons. We want arrow keys to navigate\n // to the row above/below instead. We need to re-dispatch the event from a higher parent so it still\n // bubbles and gets handled by useSelectableCollection.\n if (!e.altKey && nodeContains(ref.current, getEventTarget(e) as Element)) {\n e.stopPropagation();\n e.preventDefault();\n ref.current.parentElement?.dispatchEvent(\n new KeyboardEvent(e.nativeEvent.type, e.nativeEvent)\n );\n }\n break;\n }\n };\n\n let onFocus = (e) => {\n keyWhenFocused.current = node.key;\n if (getEventTarget(e) !== ref.current) {\n // useSelectableItem only handles setting the focused key when\n // the focused element is the row itself. We also want to\n // set the focused key when a child element receives focus.\n // If focus is currently visible (e.g. the user is navigating with the keyboard),\n // then skip this. We want to restore focus to the previously focused row\n // in that case since the list should act like a single tab stop.\n if (!isFocusVisible()) {\n state.selectionManager.setFocusedKey(node.key);\n }\n return;\n }\n };\n\n let onKeyDown = (e) => {\n let activeElement = getActiveElement();\n if (!nodeContains(e.currentTarget, getEventTarget(e) as Element) || !ref.current || !activeElement) {\n return;\n }\n\n switch (e.key) {\n case 'Tab': {\n if (keyboardNavigationBehavior === 'tab') {\n // If there is another focusable element within this item, stop propagation so the tab key\n // is handled by the browser and not by useSelectableCollection (which would take us out of the list).\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n walker.currentNode = activeElement;\n let next = e.shiftKey ? walker.previousNode() : walker.nextNode();\n\n if (next) {\n e.stopPropagation();\n }\n }\n }\n }\n };\n\n let syntheticLinkProps = useSyntheticLinkProps(node.props);\n let linkProps = itemStates.hasAction ? syntheticLinkProps : {};\n // TODO: re-add when we get translations and fix this for iOS VO\n // let rowAnnouncement;\n // if (onAction) {\n // rowAnnouncement = stringFormatter.format('hasActionAnnouncement');\n // } else if (hasLink) {\n // rowAnnouncement = stringFormatter.format('hasLinkAnnouncement', {\n // link: node.props.href\n // });\n // }\n\n let rowProps: DOMAttributes = mergeProps(itemProps, linkProps, {\n role: 'row',\n onKeyDownCapture,\n onKeyDown,\n onFocus,\n // 'aria-label': [(node.textValue || undefined), rowAnnouncement].filter(Boolean).join(', '),\n 'aria-label': node['aria-label'] || node.textValue || undefined,\n 'aria-selected': state.selectionManager.canSelectItem(node.key) ? state.selectionManager.isSelected(node.key) : undefined,\n 'aria-disabled': state.selectionManager.isDisabled(node.key) || undefined,\n 'aria-labelledby': descriptionId && (node['aria-label'] || node.textValue) ? `${getRowId(state, node.key)} ${descriptionId}` : undefined,\n id: getRowId(state, node.key)\n });\n\n if (isVirtualized) {\n let {collection} = state;\n let nodes = [...collection];\n // TODO: refactor ListCollection to store an absolute index of a node's position?\n rowProps['aria-rowindex'] = nodes.find(node => node.type === 'section') ? [...collection.getKeys()].filter((key) => collection.getItem(key)?.type !== 'section').findIndex((key) => key === node.key) + 1 : node.index + 1;\n }\n\n let gridCellProps = {\n role: 'gridcell',\n 'aria-colindex': 1\n };\n\n // TODO: should isExpanded and hasChildRows be a item state that gets returned by the hook?\n return {\n rowProps: {...mergeProps(rowProps, treeGridRowProps)},\n gridCellProps,\n descriptionProps: {\n id: descriptionId\n },\n ...itemStates\n };\n}\n\nfunction last(walker: TreeWalker) {\n let next: FocusableElement | null = null;\n let last: FocusableElement | null = null;\n do {\n last = walker.lastChild() as FocusableElement | null;\n if (last) {\n next = last;\n }\n } while (last);\n return next;\n}\n\nfunction getDirectChildren<T>(parent: RSNode<T>, collection: Collection<RSNode<T>>) {\n // We can't assume that we can use firstChildKey because if a person builds a tree using hooks, they would not have access to that property (using type Node vs CollectionNode)\n // Instead, get all children and start at the first node (rather than just using firstChildKey) and only look at its siblings\n let children = collection.getChildren?.(parent.key);\n let childArray = children ? Array.from(children) : [];\n let node = childArray.length > 0 ? childArray[0] : null;\n let siblings: RSNode<T>[] = [];\n while (node) {\n siblings.push(node);\n node = node.nextKey != null ? collection.getItem(node.nextKey) : null;\n }\n return siblings;\n}\n"],"names":[],"version":3,"file":"useGridListItem.module.js.map"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-aria/gridlist",
|
|
3
|
-
"version": "3.14.
|
|
3
|
+
"version": "3.14.4",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -26,15 +26,15 @@
|
|
|
26
26
|
"url": "https://github.com/adobe/react-spectrum"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@react-aria/focus": "^3.21.
|
|
30
|
-
"@react-aria/grid": "^3.14.
|
|
31
|
-
"@react-aria/i18n": "^3.12.
|
|
32
|
-
"@react-aria/interactions": "^3.
|
|
33
|
-
"@react-aria/selection": "^3.27.
|
|
34
|
-
"@react-aria/utils": "^3.
|
|
35
|
-
"@react-stately/list": "^3.13.
|
|
36
|
-
"@react-stately/tree": "^3.9.
|
|
37
|
-
"@react-types/shared": "^3.
|
|
29
|
+
"@react-aria/focus": "^3.21.5",
|
|
30
|
+
"@react-aria/grid": "^3.14.8",
|
|
31
|
+
"@react-aria/i18n": "^3.12.16",
|
|
32
|
+
"@react-aria/interactions": "^3.27.1",
|
|
33
|
+
"@react-aria/selection": "^3.27.2",
|
|
34
|
+
"@react-aria/utils": "^3.33.1",
|
|
35
|
+
"@react-stately/list": "^3.13.4",
|
|
36
|
+
"@react-stately/tree": "^3.9.6",
|
|
37
|
+
"@react-types/shared": "^3.33.1",
|
|
38
38
|
"@swc/helpers": "^0.5.0"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
@@ -44,5 +44,5 @@
|
|
|
44
44
|
"publishConfig": {
|
|
45
45
|
"access": "public"
|
|
46
46
|
},
|
|
47
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "8df187370053aa35f553cb388ad670f65e1ab371"
|
|
48
48
|
}
|
package/src/useGridListItem.ts
CHANGED
|
@@ -10,8 +10,8 @@
|
|
|
10
10
|
* governing permissions and limitations under the License.
|
|
11
11
|
*/
|
|
12
12
|
|
|
13
|
-
import {chain, getScrollParent, mergeProps, scrollIntoViewport, useSlotId, useSyntheticLinkProps} from '@react-aria/utils';
|
|
14
|
-
import {DOMAttributes, FocusableElement, Key, RefObject, Node as RSNode} from '@react-types/shared';
|
|
13
|
+
import {chain, getActiveElement, getEventTarget, getScrollParent, isFocusWithin, mergeProps, nodeContains, scrollIntoViewport, useSlotId, useSyntheticLinkProps} from '@react-aria/utils';
|
|
14
|
+
import {Collection, DOMAttributes, FocusableElement, Key, RefObject, Node as RSNode} from '@react-types/shared';
|
|
15
15
|
import {focusSafely, getFocusableTreeWalker} from '@react-aria/focus';
|
|
16
16
|
import {getRowId, listMap} from './utils';
|
|
17
17
|
import {HTMLAttributes, KeyboardEvent as ReactKeyboardEvent, useRef} from 'react';
|
|
@@ -79,7 +79,7 @@ export function useGridListItem<T>(props: AriaGridListItemOptions, state: ListSt
|
|
|
79
79
|
if (
|
|
80
80
|
ref.current !== null &&
|
|
81
81
|
((keyWhenFocused.current != null && node.key !== keyWhenFocused.current) ||
|
|
82
|
-
!ref.current
|
|
82
|
+
!isFocusWithin(ref.current))
|
|
83
83
|
) {
|
|
84
84
|
focusSafely(ref.current);
|
|
85
85
|
}
|
|
@@ -100,12 +100,16 @@ export function useGridListItem<T>(props: AriaGridListItemOptions, state: ListSt
|
|
|
100
100
|
|
|
101
101
|
let isExpanded = hasChildRows ? state.expandedKeys.has(node.key) : undefined;
|
|
102
102
|
let setSize = 1;
|
|
103
|
-
|
|
103
|
+
let index = node.index;
|
|
104
|
+
if (node.level >= 0 && node?.parentKey != null) {
|
|
104
105
|
let parent = state.collection.getItem(node.parentKey);
|
|
105
106
|
if (parent) {
|
|
106
107
|
// siblings must exist because our original node exists
|
|
107
|
-
let siblings = state.collection
|
|
108
|
+
let siblings = getDirectChildren(parent, state.collection);
|
|
108
109
|
setSize = [...siblings].filter(row => row.type === 'item').length;
|
|
110
|
+
if (index > 0 && siblings[0].type !== 'item') {
|
|
111
|
+
index -= 1; // subtract one for the parent item's content node
|
|
112
|
+
}
|
|
109
113
|
}
|
|
110
114
|
} else {
|
|
111
115
|
setSize = [...state.collection].filter(row => row.level === 0 && row.type === 'item').length;
|
|
@@ -114,7 +118,7 @@ export function useGridListItem<T>(props: AriaGridListItemOptions, state: ListSt
|
|
|
114
118
|
treeGridRowProps = {
|
|
115
119
|
'aria-expanded': isExpanded,
|
|
116
120
|
'aria-level': node.level + 1,
|
|
117
|
-
'aria-posinset':
|
|
121
|
+
'aria-posinset': index + 1,
|
|
118
122
|
'aria-setsize': setSize
|
|
119
123
|
};
|
|
120
124
|
}
|
|
@@ -131,14 +135,15 @@ export function useGridListItem<T>(props: AriaGridListItemOptions, state: ListSt
|
|
|
131
135
|
});
|
|
132
136
|
|
|
133
137
|
let onKeyDownCapture = (e: ReactKeyboardEvent) => {
|
|
134
|
-
|
|
138
|
+
let activeElement = getActiveElement();
|
|
139
|
+
if (!nodeContains(e.currentTarget, getEventTarget(e) as Element) || !ref.current || !activeElement) {
|
|
135
140
|
return;
|
|
136
141
|
}
|
|
137
142
|
|
|
138
143
|
let walker = getFocusableTreeWalker(ref.current);
|
|
139
|
-
walker.currentNode =
|
|
144
|
+
walker.currentNode = activeElement;
|
|
140
145
|
|
|
141
|
-
if ('expandedKeys' in state &&
|
|
146
|
+
if ('expandedKeys' in state && activeElement === ref.current) {
|
|
142
147
|
if ((e.key === EXPANSION_KEYS['expand'][direction]) && state.selectionManager.focusedKey === node.key && hasChildRows && !state.expandedKeys.has(node.key)) {
|
|
143
148
|
state.toggleKey(node.key);
|
|
144
149
|
e.stopPropagation();
|
|
@@ -216,7 +221,7 @@ export function useGridListItem<T>(props: AriaGridListItemOptions, state: ListSt
|
|
|
216
221
|
// Prevent this event from reaching row children, e.g. menu buttons. We want arrow keys to navigate
|
|
217
222
|
// to the row above/below instead. We need to re-dispatch the event from a higher parent so it still
|
|
218
223
|
// bubbles and gets handled by useSelectableCollection.
|
|
219
|
-
if (!e.altKey && ref.current
|
|
224
|
+
if (!e.altKey && nodeContains(ref.current, getEventTarget(e) as Element)) {
|
|
220
225
|
e.stopPropagation();
|
|
221
226
|
e.preventDefault();
|
|
222
227
|
ref.current.parentElement?.dispatchEvent(
|
|
@@ -229,7 +234,7 @@ export function useGridListItem<T>(props: AriaGridListItemOptions, state: ListSt
|
|
|
229
234
|
|
|
230
235
|
let onFocus = (e) => {
|
|
231
236
|
keyWhenFocused.current = node.key;
|
|
232
|
-
if (e
|
|
237
|
+
if (getEventTarget(e) !== ref.current) {
|
|
233
238
|
// useSelectableItem only handles setting the focused key when
|
|
234
239
|
// the focused element is the row itself. We also want to
|
|
235
240
|
// set the focused key when a child element receives focus.
|
|
@@ -244,7 +249,8 @@ export function useGridListItem<T>(props: AriaGridListItemOptions, state: ListSt
|
|
|
244
249
|
};
|
|
245
250
|
|
|
246
251
|
let onKeyDown = (e) => {
|
|
247
|
-
|
|
252
|
+
let activeElement = getActiveElement();
|
|
253
|
+
if (!nodeContains(e.currentTarget, getEventTarget(e) as Element) || !ref.current || !activeElement) {
|
|
248
254
|
return;
|
|
249
255
|
}
|
|
250
256
|
|
|
@@ -254,7 +260,7 @@ export function useGridListItem<T>(props: AriaGridListItemOptions, state: ListSt
|
|
|
254
260
|
// If there is another focusable element within this item, stop propagation so the tab key
|
|
255
261
|
// is handled by the browser and not by useSelectableCollection (which would take us out of the list).
|
|
256
262
|
let walker = getFocusableTreeWalker(ref.current, {tabbable: true});
|
|
257
|
-
walker.currentNode =
|
|
263
|
+
walker.currentNode = activeElement;
|
|
258
264
|
let next = e.shiftKey ? walker.previousNode() : walker.nextNode();
|
|
259
265
|
|
|
260
266
|
if (next) {
|
|
@@ -324,3 +330,17 @@ function last(walker: TreeWalker) {
|
|
|
324
330
|
} while (last);
|
|
325
331
|
return next;
|
|
326
332
|
}
|
|
333
|
+
|
|
334
|
+
function getDirectChildren<T>(parent: RSNode<T>, collection: Collection<RSNode<T>>) {
|
|
335
|
+
// We can't assume that we can use firstChildKey because if a person builds a tree using hooks, they would not have access to that property (using type Node vs CollectionNode)
|
|
336
|
+
// Instead, get all children and start at the first node (rather than just using firstChildKey) and only look at its siblings
|
|
337
|
+
let children = collection.getChildren?.(parent.key);
|
|
338
|
+
let childArray = children ? Array.from(children) : [];
|
|
339
|
+
let node = childArray.length > 0 ? childArray[0] : null;
|
|
340
|
+
let siblings: RSNode<T>[] = [];
|
|
341
|
+
while (node) {
|
|
342
|
+
siblings.push(node);
|
|
343
|
+
node = node.nextKey != null ? collection.getItem(node.nextKey) : null;
|
|
344
|
+
}
|
|
345
|
+
return siblings;
|
|
346
|
+
}
|