دکمه

import { Button, type ButtonVariant } from "@/components/ui/button.tsx";
import { useLogger } from "@/components/pages/tests/experiment.tsx";

const VARIANTS: { variant: ButtonVariant; label: string }[] = [
  { variant: "primary", label: "اصلی" },
  { variant: "secondary", label: "فرعی" },
  { variant: "ghost", label: "خنثی" },
];

export function ButtonDemo() {
  const { log } = useLogger();

  return (
    <div className="flex flex-wrap gap-3">
      {VARIANTS.map(({ variant, label }) => (
        <Button key={variant} variant={variant} onClick={() => log("click", variant)}>
          {label}
        </Button>
      ))}
    </div>
  );
}