Skip to main content

usePortal()

Creates and manages a DOM portal for rendering content outside the component hierarchy. Ideal for modals, tooltips, or overlays in React applications.

Import​

import { usePortal } from "reactuals";

Demo​

Loading...

Usage​

import { usePortal } from "reactuals";
import { createPortal } from "react-dom";

function PortalDemo() {
  const portalRoot = usePortal("my-portal");

  return createPortal(
    <div className="fixed top-10 left-10 bg-blue-500 text-white p-4 rounded">
      This is rendered in a portal!
    </div>,
    portalRoot
  );
}