Skip to content

Portal

Portal physically relocates its child content to document.body (or a Container selector) via the engine’s teleport helper, escaping overflow: hidden, transforms, and z-index stacking contexts of every ancestor. It is self-contained: no service registration and no outlet mount are required, and the overlay primitives (Dialog, Popover, Tooltip, and so on) use it internally.

@using Navius.Primitives.Portal
<NaviusPortal>
@* teleported to document.body *@
</NaviusPortal>

Teleports its content to the body (or Container). Renders a display:contents wrapper element that is physically relocated in the real DOM.

Prop Type Default Description
Container string? document.body CSS selector for the element the portal mounts into. null mounts into document.body.
ChildContent RenderFragment? - Content teleported to the target.
Attributes IDictionary<string, object>? - Forwarded to the rendered wrapper div.

There is also a legacy outlet-based API, NaviusPortalOutlet + PortalService (registered by AddNavius()), for rendering into a fixed point in the Blazor tree. NaviusPortal needs neither.

Portal moves DOM but preserves the accessibility tree and focus; it wires no roles or attributes of its own. There are no keyboard interactions of its own: the primitive that portals its content (Dialog, Popover, and so on) owns focus and dismissal behavior. This mechanism is covered by the Playwright browser test suite.