import * as React from 'react';
import { TextInput as TextInputComponent } from '../textInput/TextInput';

export default {
  title: 'Components/inputs/Text Input',
  component: TextInputComponent,
  args: {
    disabled: false,
    invalid: false,
    valid: false,
    enhanceNativeSupport: false,
    required: false,
    type: 'text',
    inputSize: 'md',
    defaultValue: 'hello',
  },
  argTypes: {
    type: {
      name: 'Type',
      control: { type: 'radio' },
      options: ['text', 'email', 'password', 'number'],
    },
    inputSize: {
      name: 'Size',
      control: { type: 'radio' },
      options: ['md', 'sm'],
    },
  },
};

export const TextInput = (args) => (
  <TextInputComponent
    id="input-1"
    placeholder="Describe this input..."
    {...args}
  />
);
