import React from 'react';
import { Meta, Story } from '@storybook/react/types-6-0';
import { Select, SelectProps } from '.';

export default {
  title: 'Select',
  component: Select,
} as Meta;

const Template: Story<SelectProps> = (args) => <Select {...args} />;

const options = [
  { value: 'first', label: 'First' },
  { value: 'second', label: 'Second' },
];

export const Default = Template.bind({});
Default.args = { options, variant: 'primary' } as SelectProps;

export const AllVariants = () => {
  return (
    <>
      Normal:
      <Select options={options} isSearchable />
      NoIcons:
      <Select options={options} noIcon />
      Disabled:
      <Select options={options} isDisabled={true} noIcon />
      Ghost mode:
      <Select options={options} noIcon variant="ghost" />
      Ghost mode:
      <Select options={options} noIcon variant="ghost" isDisabled={true} />
    </>
  );
};
