import type { Meta, StoryObj } from '@storybook/vue3'
import Button from './Button.vue'

const meta: Meta<typeof Button> = {
  title: 'UI/Button',
  component: Button,
  render: (args) => ({
    components: { Button },
    setup() {
      return { args }
    },
    template: '<Button v-bind="args">{{ args.label }}</Button>'
  }),
  argTypes: {
    variant: {
      control: { type: 'select' },
      options: ['primary', 'outline']
    }
  },
  tags: ['autodocs']
}

export default meta
type Story = StoryObj<typeof meta>

export const Primary: Story = {
  args: {
    label: 'Primary button',
    variant: 'primary'
  }
}

export const Outline: Story = {
  args: {
    label: 'Outline button',
    variant: 'outline'
  }
}

export const FullWidth: Story = {
  args: {
    label: 'Full width',
    variant: 'primary',
    fullWidth: true
  }
}