#49 ちょろちょろ

2025-06-26 07:59:08 +09:00
parent 6e6ee73857
commit f49640727f
12 changed files with 138 additions and 38 deletions
@@ -0,0 +1,25 @@
+import React, { useEffect, useState } from 'react'
+
+type Props = { tabs:  { [key: string]: React.ReactNode }
+               init?: string }
+
+
+export default ({ tabs, init }: Props) => {
+  const [current, setCurrent] = useState<string> (init
+                                                  ?? Object.keys (tabs)?.[0]
+                                                  ?? '')
+
+  return (
+      <div className="mt-4">
+        {Object.entries (tabs).map (([name, element]) => (
+            <a href="#"
+               className="text-blue-400 hover:underline cursor-pointer"
+               onClick={(event) => {
+                 event.preventDefault ()
+                 setCurrent (name)
+               }}>
+              {name}
+            </a>))}
+        {current && tabs[current]}
+      </div>)
+}