28 lines
613 B
TypeScript
28 lines
613 B
TypeScript
"use client";
|
|
|
|
import { ReactNode, useState } from "react";
|
|
|
|
export default function Tabs({
|
|
tabs,
|
|
}: {
|
|
tabs: { label: string; content: ReactNode }[];
|
|
}) {
|
|
const [active, setActive] = useState(0);
|
|
return (
|
|
<div>
|
|
<div className="tabs__list">
|
|
{tabs.map((t, i) => (
|
|
<button
|
|
key={t.label}
|
|
onClick={() => setActive(i)}
|
|
className={`tabs__tab ${active === i ? "tabs__tab--active" : ""}`}
|
|
>
|
|
{t.label}
|
|
</button>
|
|
))}
|
|
</div>
|
|
<div className="tabs__panel">{tabs[active].content}</div>
|
|
</div>
|
|
);
|
|
}
|