import { Meta, StoryObj } from "@storybook/nextjs-vite";
import { fn } from "storybook/test";
import { TrialOption } from "./TrialOption";
import type { TrialOptionProps } from "./TrialOption";

/** Reusable TrialOption component matching Figma states */
const meta: Meta<typeof TrialOption> = {
  title: "UI/TrialOption",
  component: TrialOption,
  parameters: {
    layout: "centered",
  },
  tags: ["autodocs"],
  args: {
    value: "$1",
    title: "Basic",
    state: "default",
    error: false,
    onClick: fn(),
  } satisfies TrialOptionProps,
  argTypes: {
    state: {
      control: { type: "select" },
      options: ["default", "selected", "accent"],
    },
    error: { control: { type: "boolean" } },
  },
};

export default meta;

type Story = StoryObj<typeof meta>;

export const Default: Story = {};

export const Selected: Story = {
  args: { state: "selected" },
};

export const Accent: Story = {
  args: { state: "accent" },
};

export const ErrorDefault: Story = {
  args: { state: "default", error: true },
};

export const ErrorAccent: Story = {
  args: { state: "accent", error: true },
};

export const Playground: Story = {
  args: {},
};
