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

export default {
  title: 'Inputs/Textarea',
  component: Textarea,
  tags: ['autodocs'],
  decorators: [
    (Story) => (
      <I18nProvider>
        <Story />
      </I18nProvider>
    ),
  ],
};

export const Default = {
  args: {
    label: 'Descripción',
    placeholder: 'Escribe tu mensaje aquí...',
    rows: 4,
  },
};

export const WithError = {
  args: {
    label: 'Comentario',
    placeholder: 'Escribe tu comentario',
    error: 'Este campo es requerido',
  },
};

export const WithHelperText = {
  args: {
    label: 'Mensaje',
    placeholder: 'Escribe tu mensaje',
    helperText: 'Máximo 500 caracteres',
  },
};

export const Disabled = {
  args: {
    label: 'Texto deshabilitado',
    placeholder: 'Este campo está deshabilitado',
    disabled: true,
    defaultValue: 'Texto prellenado',
  },
};

export const Required = {
  args: {
    label: 'Campo requerido',
    placeholder: 'Este campo es obligatorio',
    required: true,
  },
};

export const Large = {
  args: {
    label: 'Mensaje largo',
    placeholder: 'Escribe un mensaje largo',
    rows: 8,
  },
};

