import { Input } from './Input';
import { I18nProvider } from '../../../providers/I18nProvider';

export default {
  title: 'Inputs/Input',
  component: Input,
  tags: ['autodocs'],
  decorators: [
    (Story) => (
      <I18nProvider>
        <Story />
      </I18nProvider>
    ),
  ],
  argTypes: {
    type: {
      control: 'select',
      options: ['text', 'email', 'password', 'number', 'tel', 'url'],
    },
  },
};

export const Default = {
  args: {
    label: 'Label',
    placeholder: 'Enter text...',
  },
};

export const WithError = {
  args: {
    label: 'Email',
    type: 'email',
    placeholder: 'Enter your email',
    error: 'Please enter a valid email address',
  },
};

export const WithHelperText = {
  args: {
    label: 'Password',
    type: 'password',
    placeholder: 'Enter password',
    helperText: 'Must be at least 8 characters',
  },
};

export const Disabled = {
  args: {
    label: 'Disabled Input',
    placeholder: 'This input is disabled',
    disabled: true,
  },
};

export const Required = {
  args: {
    label: 'Required Field',
    placeholder: 'This field is required',
    required: true,
  },
};

