import 'react-material-symbols/rounded'

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

import { Select } from './Select'

const meta: Meta<typeof Select> = {
  title: 'Components/Select',
  component: Select,
  argTypes: {},
}

export default meta

type Story = StoryObj<typeof Select>

export const Default: Story = {
  args: {
    icon: 'star',
    itemIcon: 'check',
    items: ['Foo', 'Bar', 'Baz'],
    label: 'Select an item',
    name: 'foo',
  },
}

export const ObjectItem: Story = {
  args: {
    icon: 'star',
    itemIcon: 'check',
    items: [
      { label: 'Foo', value: 'foo' },
      { label: 'Bar', value: 'bar' },
      { label: 'Baz', value: 'baz' },
    ],
    label: 'Select an item',
    name: 'foo',
  },
}

export const Filtering: Story = {
  args: {
    icon: 'star',
    itemIcon: 'check',
    items: ['Foo', 'Bar', 'Baz'],
    label: 'Select an item',
    name: 'foo',
    enableFiltering: true,
  },
}