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

<Meta of={Stories} />

# DatePickerField

A date picker with calendar popup for selecting a single date.

## Usage

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

<DatePickerField
  id="start-date"
  label="Start Date"
  placeholder="Pick a date"
  value={date}
  onChange={setDate}
  minDate={new Date()}
/>
```

## Examples

### Default

<Canvas of={Stories.Default} />

### With Value

<Canvas of={Stories.WithValue} />

### With Description

<Canvas of={Stories.WithDescription} />

### With Min/Max Dates

<Canvas of={Stories.WithMinMaxDates} />

### With Error

<Canvas of={Stories.WithError} />

### Disabled

<Canvas of={Stories.Disabled} />
