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

<Meta of={Stories} />

# ProductSelectField

A card-based selection for product categories with subcategory pills.

## Usage

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

<ProductSelectField
  categories={[
    {
      id: 'electronics',
      title: 'Electronics',
      subcategories: ['Phones', 'Laptops', 'Tablets'],
    },
  ]}
  selectedIds={selected}
  onChange={setSelected}
/>
```

## Examples

### Default

<Canvas of={Stories.Default} />

### With Selections

<Canvas of={Stories.WithSelections} />

### Disabled

<Canvas of={Stories.Disabled} />