Slider

A themed numeric slider.

Import

import { Slider } from '@bedrock-core/ore-styled';

Usage

Render it inside a <Form>. The value arrives in the form's onSubmit, keyed by name.

<Form onSubmit={({ values }) => console.warn(values.volume)}>
  <Slider name={'volume'} label={'Volume'} min={0} max={100} step={5} />
  <Form.Button type={'submit'}>{'Save'}</Form.Button>
</Form>

It is Slider with the theme's track, progress fill and thumb textures applied, plus a caption above it. The widget is the engine's: the player drags it while the form is open, and the value comes back with every other field on submit.

Props

Prop	Type	Default	Description
name*	string	—	Result key — the value appears at values[name] in the form's onSubmit
label	string	—	Caption rendered above the slider
min*	number	—	Minimum selectable value; the left end of the track
max*	number	—	Maximum selectable value; the right end of the track
step	number	1	Increment between selectable values
defaultValue	number	min	Initial value

Inherits every prop of Slider — the track, progress and thumb textures, trackHeight, thumbWidth / thumbHeight — with the theme's values as defaults rather than a lock. Through it, control props as well.

Examples

A settings form

<Form onSubmit={({ values }) => apply(values)}>
  <Slider name={'volume'} label={'Volume'} min={0} max={100} step={5} defaultValue={70} />
  <Slider name={'render'} label={'Render distance'} min={2} max={32} />
  <Form.Button type={'submit'}>{'Apply'}</Form.Button>
</Form>

Disabled

<Slider name={'locked'} label={'Volume'} min={0} max={10} defaultValue={5} enabled={false} />

Notes

The interactive hitbox of the thumb is a fixed 16 × 16, so keep the visual thumb at its default size unless a mismatch is acceptable — a larger one looks draggable in places it is not.

There is no onChange: a native modal is atomic, so nothing reaches script while the form is open.

Limits

Modal-only. The engine draws no slider on an action form or a container screen, so useMechanism('Slider') refuses it there at build, naming the fix.