Function useSubmenuTrigger

packages/react-aria/src/menu/useSubmenuTrigger.ts:94–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 submenuKeyDown = (e: KeyboardEvent) => {
    // 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;
    }

    switch (e.key) {
      case 'ArrowLeft':
        if (direction === 'ltr' && nodeContains(e.currentTarget, getEventTarget(e) as Element)) {
          e.preventDefault();
          e.stopPropagation();
          onSubmenuClose();
          if (!shouldUseVirtualFocus && ref.current) {
            focusWithoutScrolling(ref.current);