@vectara/vectara-ui
Version:
Vectara's design system, codified as a React and Sass component library
20 lines (19 loc) • 816 B
JavaScript
import { useEffect, useRef } from "react";
import { createPortal } from "react-dom";
import { useVuiContext } from "../context/Context";
export const VuiPortal = ({ children }) => {
// Initialize ref synchronously during the first render, ensuring portalRef.current
// is immediately available for createPortal.
const portalRef = useRef(document.createElement("div"));
const { portalContainer } = useVuiContext();
useEffect(() => {
if (!portalContainer)
return;
portalContainer.appendChild(portalRef.current);
return () => {
var _a;
(_a = portalRef.current.parentNode) === null || _a === void 0 ? void 0 : _a.removeChild(portalRef.current);
};
}, [portalContainer]);
return createPortal(children, portalRef.current);
};