wip: search modal (link, category, or Google) with keybinds

components/Modal/Modal.tsx

@@ -0,0 +1,32 @@
+import { ReactNode } from "react";
+import { createPortal } from "react-dom";
+
+import styles from "./modal.module.scss";
+
+interface ModalProps {
+  close?: (...args: any) => void | Promise<void>;
+
+  title?: string;
+  children: ReactNode;
+
+  showCloseBtn?: boolean;
+}
+export default function Modal({
+  close,
+  title,
+  children,
+  showCloseBtn = true,
+}: ModalProps) {
+  return createPortal(
+    <div className={styles["modal-wrapper"]}>
+      <div className={styles["modal-container"]}>
+        <div className={styles["modal-header"]}>
+          <h3>{title}</h3>
+          {showCloseBtn && <button onClick={close}>close</button>}
+        </div>
+        <div className={styles["modal-body"]}>{children}</div>
+      </div>
+    </div>,
+    document.body
+  );
+}