.
This commit is contained in:
+18
@@ -0,0 +1,18 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { createPortal } from 'react-dom';
|
||||
export const Portal = ({ children, type })=>{
|
||||
const [portalNode, setPortalNode] = useState(null);
|
||||
useEffect(()=>{
|
||||
const element = document.createElement(type);
|
||||
document.body.appendChild(element);
|
||||
setPortalNode(element);
|
||||
return ()=>{
|
||||
document.body.removeChild(element);
|
||||
};
|
||||
}, [
|
||||
type
|
||||
]);
|
||||
return portalNode ? /*#__PURE__*/ createPortal(children, portalNode) : null;
|
||||
};
|
||||
|
||||
//# sourceMappingURL=index.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["../../../../src/client/portal/index.tsx"],"sourcesContent":["import { useEffect, useState } from 'react'\nimport { createPortal } from 'react-dom'\n\ntype PortalProps = {\n children: React.ReactNode\n type: string\n}\n\nexport const Portal = ({ children, type }: PortalProps) => {\n const [portalNode, setPortalNode] = useState<HTMLElement | null>(null)\n\n useEffect(() => {\n const element = document.createElement(type)\n document.body.appendChild(element)\n setPortalNode(element)\n return () => {\n document.body.removeChild(element)\n }\n }, [type])\n\n return portalNode ? createPortal(children, portalNode) : null\n}\n"],"names":["useEffect","useState","createPortal","Portal","children","type","portalNode","setPortalNode","element","document","createElement","body","appendChild","removeChild"],"mappings":"AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAC3C,SAASC,YAAY,QAAQ,YAAW;AAOxC,OAAO,MAAMC,SAAS,CAAC,EAAEC,QAAQ,EAAEC,IAAI,EAAe;IACpD,MAAM,CAACC,YAAYC,cAAc,GAAGN,SAA6B;IAEjED,UAAU;QACR,MAAMQ,UAAUC,SAASC,aAAa,CAACL;QACvCI,SAASE,IAAI,CAACC,WAAW,CAACJ;QAC1BD,cAAcC;QACd,OAAO;YACLC,SAASE,IAAI,CAACE,WAAW,CAACL;QAC5B;IACF,GAAG;QAACH;KAAK;IAET,OAAOC,2BAAaJ,aAAaE,UAAUE,cAAc;AAC3D,EAAC","ignoreList":[0]}
|
||||
Reference in New Issue
Block a user