import { cx, Link } from "zeb/react";
export function StudioTabNav({ children }: any) {
return (
<nav className="shrink-0 flex items-stretch border-b border-border bg-card px-[0.625rem]">
{/* tw-variants hint: active StudioTabLink classes always scanned by RWE Tailwind engine */}
<span hidden tw-variants="text-primary border-primary bg-primary/10 bg-card border-transparent" />
{children}
</nav>
);
}
export function StudioTabLink({ href, active, children }: any) {
return (
<Link
href={href ?? "#"}
className={cx(
"inline-flex items-center gap-1 px-[0.8rem] py-0.5 border-b-2",
"text-xs font-mono uppercase tracking-widest",
active
? "text-primary border-primary bg-primary/10 font-medium"
: "text-muted-foreground border-transparent hover:text-primary hover:border-primary hover:bg-primary/10"
)}
>
{children}
</Link>
);
}