import { Canvas, Meta } from '@storybook/blocks'
import * as Stories from './TextInputField.stories'

<Meta of={Stories} />

# TextInputField

A text input field with label, description, and error states.

## Usage

```tsx
import { TextInputField } from '@/components/onboarding'

<TextInputField
  id="email"
  label="Email"
  type="email"
  placeholder="you@example.com.ai"
  value={email}
  onChange={setEmail}
  required
/>
```

## Examples

### Default

<Canvas of={Stories.Default} />

### With Value

<Canvas of={Stories.WithValue} />

### With Description

<Canvas of={Stories.WithDescription} />

### Required

<Canvas of={Stories.Required} />

### With Error

<Canvas of={Stories.WithError} />

### Disabled

<Canvas of={Stories.Disabled} />