import type { Meta, StoryObj } from '@storybook/vue3'
import { UAvatar } from '../components'

const meta: Meta<typeof UAvatar> = {
  title: 'Example/Avatar',
  component: UAvatar,
  tags: ['autodocs'],
  argTypes: {
    variant: {
      control: 'select',
      options: ['default'],
    },
    size: { control: 'select', options: ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'] },
    imagePath: { control: 'text' },
    avatarIcon: {
      control: 'select',
      options: [null, 'imageUserPlus', 'imageUserX', 'user3'],
    },
  },
}

export default meta

type Story = StoryObj<typeof UAvatar>

export const Default: Story = {
  render: (args: any) => ({
    components: { UAvatar },
    setup() {
      return { args }
    },
    template: '<UAvatar v-bind="args">OR</UAvatar>',
  }),
  args: {
    variant: 'default',
    size: 'sm',
  },
}