Provides a React context and hook for controlling where Radix UI overlay components (dropdowns, tooltips, etc.) are portaled, enabling stacking-context-aware positioning without z-index escalation. ## Key Components - **`PortalContainerContext`** — React context holding an `HTMLElement | null` value. When `null`, Radix falls back to its default `document.body` portal target. When set to a specific DOM node, overlays portal into that node and naturally inherit its stacking context. - **`usePortalContainer()`** — Convenience hook that reads the current portal container from context. ## Usage Example ```typescript // Wrap a high-z surface (e.g. a chat drawer) with a provider pointing // at a ref inside that same surface, then consume it in overlay components. function ChatDrawer() { const [container, setContainer] = React.useState(null) return (
) } // Inside DrawerContent — pass the container to Radix portal props: function DropdownExample() { const portalContainer = usePortalContainer() return ( ... ) } ``` ## Notes - Radix uses `position: fixed` internally, so portaling into a nested node does **not** re-introduce `overflow: hidden` clipping — content still escapes ancestor scroll containers. - Providing `null` (the default) leaves Radix behavior unchanged everywhere a provider is absent. - Source: [`portal-container.tsx`](https://github.com/flamingo-stack/openframe-oss-lib/blob/main/portal-container.tsx)