refactor: examples/

1 files changed, 31 insertions, 0 deletions

diff --git a/examples/with-script-in-browser/components/sidebar/ExampleSidebar.tsx b/examples/with-script-in-browser/components/sidebar/ExampleSidebar.tsx
new file mode 100644
index 0000000..1939134
--- /dev/null
+++ b/examples/with-script-in-browser/components/sidebar/ExampleSidebar.tsx
@@ -0,0 +1,31 @@
+import React, { useState } from "react";
+import "./ExampleSidebar.scss";
+
+export default function Sidebar({ children }: { children: React.ReactNode }) {
+  const [open, setOpen] = useState(false);
+
+  return (
+    <>
+      <div id="mySidebar" className={`sidebar ${open ? "open" : ""}`}>
+        <button className="closebtn" onClick={() => setOpen(false)}>
+          x
+        </button>
+        <div className="sidebar-links">
+          <button>Empty Home</button>
+          <button>Empty About</button>
+        </div>
+      </div>
+      <div className={`${open ? "sidebar-open" : ""}`}>
+        <button
+          className="openbtn"
+          onClick={() => {
+            setOpen(!open);
+          }}
+        >
+          Open Sidebar
+        </button>
+        {children}
+      </div>
+    </>
+  );
+}