Function: useResolvedPortalContainer()

useResolvedPortalContainer(containerProp?): HTMLElement | Element | DocumentFragment | null | undefined

Resolves the final portal container from explicit prop or context.

This hook enables Portal components to work seamlessly in isolated rendering contexts (like iframes, shadow DOM, or isolated component previews) by accepting a container from either:

1. An explicit container prop (highest priority)
2. A PortalContainerProvider context (fallback)
3. undefined (lets Radix UI use document.body as default)

Parameters

containerProp?

HTMLElement | Element | DocumentFragment | null

Optional explicit container element from props

Returns

HTMLElement | Element | DocumentFragment | null | undefined

The resolved container element to use for portal rendering

Example

function MyPortal({ container, ...props }) {
  return (
    <RadixPortal container={useResolvedPortalContainer(container)} {...props}>
      <MyContent />
    </RadixPortal>
  );
}