import type { Meta, StoryObj } from '@storybook/vue3'
import { UDividerProps } from '../components/UDivider/UDivider'
import { UDivider } from '../components'
import { ExtractPropTypes } from 'vue'

const meta: Meta<typeof UDivider> = {
  title: 'Example/Divider',
  component: UDivider,
  tags: ['autodocs'],
  argTypes: {
    color: {
      control: 'select',
      options: [
        'gray-600',
        'primary-400',
        'error-700',
        'warning-200',
        'success-500',
      ],
    },
  },
}

export default meta

type Story = StoryObj<typeof UDivider>

export const BaseDivider: Story = {
  render: (args: ExtractPropTypes<UDividerProps>) => ({
    components: { UDivider },
    setup() {
      return { args }
    },
    template: `<UDivider v-bind="args" class="mt-10 mb-10"></UDivider>`,
  }),
  args: {
    color: 'error-700',
  } as UDividerProps,
}