src/components/Sidebar/Overlay.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

import { useEffect, useRef } from "react";
import ReactDOM from "react-dom";

function SidebarOverlay({ children }) {
  const overlay = useRef(document.createElement("div"));

  useEffect(() => {
    const node = overlay.current;
    const rootNode = document.getElementById("___a11y");
    rootNode.appendChild(node);

    return () => rootNode.removeChild(node);
  }, []);

  return ReactDOM.createPortal(children, overlay.current);
}

export default SidebarOverlay;