Function useMenuItem

packages/react-aria/src/menu/useMenuItem.ts:142–408

(
  props: AriaMenuItemProps,
  state: TreeState<T>,
  ref: RefObject<FocusableElement | null>
)

 * @param state - State for the menu, as returned by `useTreeState`.
 */
export function useMenuItem<T>(
  props: AriaMenuItemProps,
  state: TreeState<T>,
  ref: RefObject<FocusableElement | null>
): MenuItemAria {
  let {
    id,
    key,
    closeOnSelect,
    shouldCloseOnSelect,
    isVirtualized,
    'aria-haspopup': hasPopup,
    onPressStart,
    onPressUp: pressUpProp,
    onPress,
    onPressChange: pressChangeProp,
    onPressEnd,
    onClick: onClickProp,
    onHoverStart: hoverStartProp,
    onHoverChange,
    onHoverEnd,
    onKeyDown,
    onKeyUp,
    onFocus,
    onFocusChange,
    onBlur,
    selectionManager = state.selectionManager
  } = props;

  let isTrigger = !!hasPopup;
  let isTriggerExpanded = isTrigger && props['aria-expanded'] === 'true';
  let isDisabled = props.isDisabled ?? selectionManager.isDisabled(key);
  let isSelected = props.isSelected ?? selectionManager.isSelected(key);
  let data = menuData.get(state)!;
  let item = state.collection.getItem(key);
  let onClose = props.onClose || data.onClose;
  let router = useRouter();
  let performAction = () => {
    if (isTrigger) {
      return;
    }

    if (item?.props?.onAction) {
      item.props.onAction();
    } else if (props.onAction) {
      props.onAction(key);
    }

    if (data.onAction) {
      // Must reassign to variable otherwise `this` binding gets messed up. Something to do with WeakMap.
      let onAction = data.onAction;
      onAction(key, item?.value);
    }
  };

  let role = 'menuitem';
  if (!isTrigger) {
    if (selectionManager.selectionMode === 'single') {