useOutsideClickRef

import "./styles.css";
import { useOutsideClickRef } from "rooks";

function App() {
  function myComponent() {
    alert("Clicked outside");
  }
  const [ref] = useOutsideClickRef(myComponent);
  return (
    <div
      className="App"
      style={{ display: "flex", flexDirection: "column", alignItems: "center" }}
    >
      <h1>Rooks : useOutsideClick Example</h1>

      <div
        style={{
          display: "flex",
          flexDirection: "column",
          alignItems: "center",
          width: "100%",
          backgroundColor: "lightblue",
        }}
        ref={ref}
      >
        <h2 className="inside">This is inside</h2>
      </div>
    </div>
  );
}

export default App;