Function useGridListItem

packages/react-aria/src/gridlist/useGridListItem.ts:98–477

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

 * @param ref - The ref attached to the row element.
 */
export function useGridListItem<T>(
  props: AriaGridListItemOptions,
  state: ListState<T> | TreeState<T>,
  ref: RefObject<FocusableElement | null>
): GridListItemAria {
  // Copied from useGridCell + some modifications to make it not so grid specific
  let {node, isVirtualized, focusMode = 'row', allowsArrowNavigation} = props;

  // let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/gridlist');
  let {direction} = useLocale();
  let {onAction, linkBehavior, keyboardNavigationBehavior, shouldSelectOnPressUp} =
    listMap.get(state)!;
  let descriptionId = useSlotId();

  // We need to track the key of the item at the time it was last focused so that we force
  // focus to go to the item when the DOM node is reused for a different item in a virtualizer.
  let keyWhenFocused = useRef<Key | null>(null);
  let focus = () => {
    if (ref.current === null) {
      return;
    }

    if (focusMode === 'child') {
      // If focus is already on a focusable child within the row, early return so we don't shift focus
      if (
        isFocusWithin(ref.current) &&
        ref.current !== getActiveElement(getOwnerDocument(ref.current))
      ) {
        return;
      }

      let treeWalker = getFocusableTreeWalker(ref.current, {tabbable: true});
      let focusable = treeWalker.firstChild() as FocusableElement;
      if (focusable) {
        focusSafely(focusable);
        scrollIntoViewport(focusable, {containingElement: getScrollParent(focusable)});
        return;
      }
    }

    // Don't shift focus to the row if the active element is a element within the row already
    // (e.g. clicking on a row button)
    if (
      (keyWhenFocused.current != null && node.key !== keyWhenFocused.current) ||
      !isFocusWithin(ref.current)
    ) {
      focusSafely(ref.current);
    }
  };

  let treeGridRowProps: HTMLAttributes<HTMLElement> = {};
  let hasChildRows = props.hasChildItems;
  let hasLink = state.selectionManager.isLink(node.key);
  if (node != null && 'expandedKeys' in state) {
    // 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
    // true...
    let children = state.collection.getChildren?.(node.key);
    hasChildRows = hasChildRows || [...(children ?? [])].length > 1;