Build NapCat Artifacts / Windows Loader Test (push) Canceled after 0s
Build NapCat Artifacts / Type Check & Test (push) Canceled after 0s
Build NapCat Artifacts / Build NapCat.Framework (push) Canceled after 0s
Build NapCat Artifacts / Build NapCat.Shell (push) Canceled after 0s
105 lines
2.9 KiB
Plaintext
105 lines
2.9 KiB
Plaintext
// src/use-accordion-item.ts
|
|
import { focusSafely } from "@react-aria/focus";
|
|
import { useId, useCallback, useEffect } from "react";
|
|
import { useButton } from "@react-aria/button";
|
|
function useReactAriaAccordionItem(props, state, ref) {
|
|
let { item, isDisabled: isDisabledProp } = props;
|
|
let key = item.key;
|
|
let manager = state.selectionManager;
|
|
let buttonId = useId();
|
|
let regionId = useId();
|
|
let isDisabled = state.disabledKeys.has(item.key) || isDisabledProp;
|
|
useEffect(() => {
|
|
let isFocused = key === state.focusedKey;
|
|
if (isFocused && document.activeElement !== ref.current) {
|
|
ref.current && focusSafely(ref.current);
|
|
}
|
|
}, [ref, key, state.focusedKey]);
|
|
let onSelect = useCallback(
|
|
(e) => {
|
|
if (!manager.canSelectItem(key)) {
|
|
return;
|
|
}
|
|
manager.select(key, e);
|
|
state.toggleKey(key);
|
|
},
|
|
[key, manager]
|
|
);
|
|
const extendFocusSelection = useCallback(
|
|
(toKey) => {
|
|
if (manager.selectionBehavior === "replace") {
|
|
manager.extendSelection(toKey);
|
|
}
|
|
manager.setFocusedKey(toKey);
|
|
},
|
|
[manager]
|
|
);
|
|
const onKeyDown = useCallback(
|
|
(event) => {
|
|
const keyMap = {
|
|
ArrowDown: () => {
|
|
const nextKey = state.collection.getKeyAfter(key);
|
|
if (nextKey && state.disabledKeys.has(nextKey)) {
|
|
const nextEnabledKey = state.collection.getKeyAfter(nextKey);
|
|
nextEnabledKey && extendFocusSelection(nextEnabledKey);
|
|
} else {
|
|
nextKey && extendFocusSelection(nextKey);
|
|
}
|
|
},
|
|
ArrowUp: () => {
|
|
const prevKey = state.collection.getKeyBefore(key);
|
|
if (prevKey && state.disabledKeys.has(prevKey)) {
|
|
const prevEnabledKey = state.collection.getKeyBefore(prevKey);
|
|
prevEnabledKey && extendFocusSelection(prevEnabledKey);
|
|
} else {
|
|
prevKey && extendFocusSelection(prevKey);
|
|
}
|
|
},
|
|
Home: () => {
|
|
const firstKey = state.collection.getFirstKey();
|
|
firstKey && extendFocusSelection(firstKey);
|
|
},
|
|
End: () => {
|
|
const lastKey = state.collection.getLastKey();
|
|
lastKey && extendFocusSelection(lastKey);
|
|
}
|
|
};
|
|
const action = keyMap[event.key];
|
|
if (action) {
|
|
event.preventDefault();
|
|
if (manager.canSelectItem(key)) {
|
|
action(event);
|
|
}
|
|
}
|
|
},
|
|
[key, manager]
|
|
);
|
|
let { buttonProps } = useButton(
|
|
{
|
|
id: buttonId,
|
|
elementType: "button",
|
|
isDisabled,
|
|
onKeyDown,
|
|
onPress: onSelect
|
|
},
|
|
ref
|
|
);
|
|
let isExpanded = state.selectionManager.isSelected(item.key);
|
|
return {
|
|
buttonProps: {
|
|
...buttonProps,
|
|
"aria-expanded": isExpanded,
|
|
"aria-controls": isExpanded ? regionId : void 0
|
|
},
|
|
regionProps: {
|
|
id: regionId,
|
|
role: "region",
|
|
"aria-labelledby": buttonId
|
|
}
|
|
};
|
|
}
|
|
|
|
export {
|
|
useReactAriaAccordionItem
|
|
};
|