DevControlSlider
components/dev/ControlSlider.vue
Range input with label and optional value suffix. Blue-themed thumb on dark track.
components/dev/ControlSlider.vue
Usage
<DevControlSlider
label = "required"
:modelValue = "required"
:min = "0"
:max = "100"
:step = "1"
suffix = "undefined"
/>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| label | String | required | Control label |
| modelValue | Number | required | Current value (v-model) |
| min | Number | 0 | Minimum value |
| max | Number | 100 | Maximum value |
| step | Number | 1 | Step increment |
| suffix | String | undefined | Unit suffix shown after value (e.g. "px", "%") |
Events
| Event | Description |
|---|---|
| update:modelValue | When slider value changes |