Render Preact components into any DOM element, useful for modals, tooltips, and overlays.
Preact-portal is a library for Preact that allows components to render their children into a different DOM element than their parent. It solves the problem of UI elements like modals or tooltips needing to break out of the normal component hierarchy to ensure proper visual layering and positioning.
Preact developers building applications that require modals, overlays, tooltips, or any UI components that must render outside their parent DOM container.
It provides a simple, lightweight, and Preact-optimized way to implement DOM portals, avoiding the overhead of larger UI libraries while ensuring compatibility with Preact's ecosystem.
:satellite: Render Preact components in (a) SPACE :milky_way: :stars:
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Provides a straightforward <Portal> component with minimal boilerplate, as shown in the README's usage example for modals and popups.
Allows changing the target DOM element via the `into` prop on the fly, demonstrated in Demo #1 with moving portal content.
Explicitly optimized for modal dialogs and overlays, with examples rendering into <body> to handle z-index and positioning issues.
Follows Preact's minimalistic philosophy, offering a focused solution without unnecessary bloat, as mentioned in the Philosophy section.
The README does not mention server-side rendering, making it unsuitable for projects that require hydration or initial render on the server.
Lacks advanced portal features like automatic focus management, event handling, or built-in animations, requiring additional custom code.
Only works with Preact, creating vendor lock-in and incompatibility with React or other JavaScript frameworks.