Function TableRow

packages/@adobe/react-spectrum/src/table/TableViewBase.tsx:1278–1428

({
  item,
  children,
  layoutInfo,
  parent,
  ...otherProps
}: {
  item: GridNode<unknown>;
  children: ReactNode;
  layoutInfo: LayoutInfo;
  parent: LayoutInfo | null;
})

}

function TableRow({
  item,
  children,
  layoutInfo,
  parent,
  ...otherProps
}: {
  item: GridNode<unknown>;
  children: ReactNode;
  layoutInfo: LayoutInfo;
  parent: LayoutInfo | null;
}) {
  let ref = useRef<HTMLDivElement | null>(null);
  let {state, layout, dragAndDropHooks, isTableDraggable, isTableDroppable, dragState, dropState} =
    useTableContext();
  let isSelected = state.selectionManager.isSelected(item.key);
  let {rowProps, hasAction, allowsSelection} = useTableRow(
    {
      node: item,
      isVirtualized: true,
      shouldSelectOnPressUp: isTableDraggable
    },
    state,
    ref
  );

  let isDisabled = state.selectionManager.isDisabled(item.key);
  let isInteractive = !isDisabled && (hasAction || allowsSelection || isTableDraggable);
  let {pressProps, isPressed} = usePress({isDisabled: !isInteractive});

  // The row should show the focus background style when any cell inside it is focused.
  // If the row itself is focused, then it should have a blue focus indicator on the left.
  let {isFocusVisible: isFocusVisibleWithin, focusProps: focusWithinProps} = useFocusRing({
    within: true
  });
  let {isFocusVisible, focusProps} = useFocusRing();
  let {hoverProps, isHovered} = useHover({isDisabled: !isInteractive});
  let isFirstRow =
    state.collection.rows.find(row => row.type === 'item' && row.level === 0)?.key === item.key;
  let isLastRow = item.nextKey == null;
  // Figure out if the TableView content is equal or greater in height to the container. If so, we'll need to round the bottom
  // border corners of the last row when selected.
  let isFlushWithContainerBottom = false;
  if (isLastRow) {
    if (layout.getContentSize()?.height >= (layout.virtualizer?.visibleRect.height ?? 0)) {
      isFlushWithContainerBottom = true;
    }
  }

  let draggableItem: DraggableItemResult | null = null;
  if (isTableDraggable && dragAndDropHooks && dragState) {
    // oxlint-disable-next-line react/react-compiler
    draggableItem = dragAndDropHooks.useDraggableItem!(
      {key: item.key, hasDragButton: true},
      dragState
    );
    if (isDisabled) {
      draggableItem = null;