Function useSubmenuTrigger

packages/react-aria/src/menu/useSubmenuTrigger.ts:88–308

(
  props: AriaSubmenuTriggerProps,
  state: SubmenuTriggerState,
  ref: RefObject<FocusableElement | null>
)

 * @param ref - Ref to the submenu trigger element.
 */
export function useSubmenuTrigger<T>(
  props: AriaSubmenuTriggerProps,
  state: SubmenuTriggerState,
  ref: RefObject<FocusableElement | null>
): SubmenuTriggerAria<T> {
  let {
    parentMenuRef,
    submenuRef,
    type = 'menu',
    isDisabled,
    delay = 200,
    shouldUseVirtualFocus
  } = props;
  let submenuTriggerId = useId();
  let overlayId = useId();
  let {direction} = useLocale();
  let openTimeout = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);
  let cancelOpenTimeout = useCallback(() => {
    if (openTimeout.current) {
      clearTimeout(openTimeout.current);
      openTimeout.current = undefined;
    }
  }, [openTimeout]);

  let onSubmenuOpen = useCallback(
    (focusStrategy?: FocusStrategy) => {
      cancelOpenTimeout();
      state.open(focusStrategy);
    },
    [state, cancelOpenTimeout]
  );

  let onSubmenuClose = useCallback(() => {
    cancelOpenTimeout();
    state.close();
  }, [state, cancelOpenTimeout]);

  useLayoutEffect(() => {
    return () => {
      cancelOpenTimeout();
    };
  }, [cancelOpenTimeout]);

  let {keyboardProps} = useKeyboard({
    shortcuts: {
      ArrowLeft: e => {
        // If focus is not within the menu, assume virtual focus is being used.
        // This means some other input element is also within the popover, so we shouldn't close the menu.
        if (!isFocusWithin(e.currentTarget)) {
          return false;
        }
        if (direction === 'ltr' && nodeContains(e.currentTarget, getEventTarget(e) as Element)) {
          onSubmenuClose();
          if (!shouldUseVirtualFocus && ref.current) {
            focusWithoutScrolling(ref.current);
          }
          return;
        }