import type { Meta, StoryObj } from "@storybook/react";

import { ThemeProviderDecorators } from "@/storybook/Decorator";

import { Button } from "./button";

const meta = {
  title: "UI/Button",
  component: Button,
  tags: ["autodocs"],
  decorators: ThemeProviderDecorators,
} satisfies Meta<typeof Button>;

export default meta;

type Story = StoryObj<typeof Button>;

export const DefaultButton: Story = {
  args: {
    children: "Default Button",
  },
};

export const DestructiveButton: Story = {
  args: {
    children: "Destructive Button",
    variant: "destructive",
  },
};

export const OutlineButton: Story = {
  args: {
    children: "Outline Button",
    variant: "outline",
  },
};

export const SecondaryButton: Story = {
  args: {
    children: "Secondary Button",
    variant: "secondary",
  },
};

export const GhostButton: Story = {
  args: {
    children: "Ghost Button",
    variant: "ghost",
  },
};

export const LinkButton: Story = {
  args: {
    children: "Link Button",
    variant: "link",
  },
};

export const PrimaryButton: Story = {
  args: {
    children: "Primary Button",
    variant: "primary",
  },
};

export const OutlinePrimaryButton: Story = {
  args: {
    children: "Outline Primary Button",
    variant: "outline-primary",
  },
};

export const PrimaryTextButton: Story = {
  args: {
    children: "Primary Text Button",
    variant: "primary-text",
  },
};

export const SuccessButton: Story = {
  args: {
    children: "Success Button",
    variant: "success",
  },
};

export const OutlineSuccessButton: Story = {
  args: {
    children: "Outline Success Button",
    variant: "outline-success",
  },
};

export const ErrorButton: Story = {
  args: {
    children: "Error Button",
    variant: "error",
  },
};

export const OutlineErrorButton: Story = {
  args: {
    children: "Outline Error Button",
    variant: "outline-error",
  },
};

export const LoadingButton: Story = {
  args: {
    children: "Loading Button",
    variant: "primary",
    loading: true,
  },
};

export const DisabledButton: Story = {
  args: {
    children: "Disabled Button",
    isDisabled: true,
  },
};

export const ButtonWithRightIcon = {
  args: {
    children: "Right Icon",
    variant: "primary",
    rightIcon: {
      name: "ArrowRight",
    },
  },
};

export const ButtonWithLeftIcon = {
  args: {
    children: "Left Icon",
    variant: "primary",
    leftIcon: {
      name: "Circle",
    },
  },
};

export const IconButton = {
  args: {
    variant: "primary",
    leftIcon: {
      name: "Circle",
    },
  },
};