Function PopoverInner

packages/react-aria-components/src/Popover.tsx:222–397

({
  state,
  isExiting,
  UNSTABLE_portalContainer,
  clearContexts,
  ...props
}: PopoverInnerProps)

}

function PopoverInner({
  state,
  isExiting,
  UNSTABLE_portalContainer,
  clearContexts,
  ...props
}: PopoverInnerProps) {
  // Calculate the arrow size internally (and remove props.arrowSize from PopoverProps)
  // Referenced from: packages/@react-spectrum/tooltip/src/TooltipTrigger.tsx
  let arrowRef = useRef<HTMLDivElement>(null);
  let containerRef = useRef<HTMLDivElement | null>(null);
  let groupCtx = useContext(PopoverGroupContext);
  let isSubPopover = groupCtx && props.trigger === 'SubmenuTrigger';

  let {popoverProps, underlayProps, arrowProps, placement, triggerAnchorPoint} = usePopover(
    {
      ...props,
      offset: props.offset ?? 8,
      arrowRef,
      // If this is a submenu/subdialog, use the root popover's container
      // to detect outside interaction and add aria-hidden.
      groupRef: isSubPopover ? groupCtx! : containerRef
    },
    state
  );

  let ref = props.popoverRef as RefObject<HTMLDivElement | null>;
  // Skip the automatic entry animation when opening instantly (e.g. swapping between previews
  // during warmup). An explicitly provided isEntering prop still takes precedence.
  let enterAnimation = useEnterAnimation(ref, !!placement);
  // oxlint-disable-next-line react/react-compiler
  let isEntering = props.isEntering || (!props.shouldSkipAnimation && enterAnimation) || false;
  // oxlint-disable-next-line react/react-compiler
  let renderProps = useRenderProps({
    // oxlint-disable-next-line react/react-compiler
    ...props,
    defaultClassName: 'react-aria-Popover',
    // oxlint-disable-next-line react/react-compiler
    values: {
      // oxlint-disable-next-line react/react-compiler
      trigger: props.trigger || null,
      placement,
      // oxlint-disable-next-line react/react-compiler
      isEntering,
      isExiting
    }
  });

  // Automatically render Popover with role=dialog except when isNonModal is true,
  // or a dialog is already nested inside the popover.
  let shouldBeDialog =
    // oxlint-disable-next-line react/react-compiler
    !props.isNonModal || props.trigger === 'SubmenuTrigger' || props.trigger === 'PreviewTrigger';
  // oxlint-disable-next-line react/react-compiler
  let [isDialog, setDialog] = useState(props.trigger === 'PreviewTrigger');
  useLayoutEffect(() => {
    if (ref.current) {
      setDialog(shouldBeDialog && !ref.current.querySelector('[role=dialog]'));