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

<Meta of={Stories} />

# ScaleInputField

A numeric input with optional slider for selecting values within a range.

## Usage

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

<ScaleInputField
  id="storage"
  label="Storage"
  min={0}
  max={1000}
  step={10}
  value={storage}
  onChange={setStorage}
  unit="GB"
  showSlider
/>
```

## Examples

### Default

<Canvas of={Stories.Default} />

### With Slider

<Canvas of={Stories.WithSlider} />

### With Unit

<Canvas of={Stories.WithUnit} />

### Custom Formatter

<Canvas of={Stories.CustomFormatter} />

### Disabled

<Canvas of={Stories.Disabled} />