import type { Meta, StoryObj } from "@storybook/vue3-vite"
import ButtonGroupAction from "./ButtonGroupAction.vue"
import { componentDoc } from "@/lib/storybook"

const meta = {
  title: "Elements/Action/ButtonGroupAction",
  component: ButtonGroupAction,
  tags: ["autodocs"],
  parameters: componentDoc("ButtonGroupAction", { barrel: "action" }),
  args: {
    items: [
      { label: "Edit", emit: "edit" },
      { label: "Delete", variant: "destructive", emit: "delete" },
    ],
  },
} satisfies Meta<typeof ButtonGroupAction>

export default meta
type Story = StoryObj<typeof meta>

export const Default: Story = {
  args: {
    items: [
      { label: "Edit", emit: "edit" },
      { label: "Delete", variant: "destructive", emit: "delete" },
    ],
  },
}

export const WithIcons: Story = {
  args: {
    items: [
      { label: "Edit", icon: "pencil", emit: "edit" },
      { label: "Duplicate", icon: "copy", variant: "secondary", emit: "dup" },
      { label: "Delete", icon: "trash", variant: "destructive", emit: "del" },
    ],
  },
}

export const Small: Story = {
  args: {
    size: "sm",
    items: [
      { label: "One" },
      { label: "Two" },
      { label: "Three" },
    ],
  },
}

export const FullWidth: Story = {
  args: {
    block: true,
    items: [
      { label: "Approve", variant: "success", emit: "approve" },
      { label: "Reject", variant: "destructive", emit: "reject" },
    ],
  },
}

export const Mixed: Story = {
  args: {
    items: [
      { label: "Docs", href: "https://example.com", target: "_blank" },
      { label: "Edit", emit: "edit" },
      { label: "Delete", variant: "destructive", emit: "delete" },
    ],
  },
}
