Skip to content

slider

Range-input slider bound to a number attribute, or — after range() — to a two-element [from, to] array attribute.

Builder F.slider(attribute: string): Slider
Wire type key slider
Class chain SliderNumericFieldField
Detail projection text-entry
Column counterpart number cell, i.e. C.number(attribute)

Example

import { F } from '@adonia/core'

F.slider('rating').label('Rating').min(0).max(10).step(0.5)
F.slider('priceBand').label('Price band').min(0).max(500).range()

Props

Beyond the shared field DSL:

Prop Declared on Behaviour
range(): this Slider Switches the control to two handles (§7.3 “single or range”). The form state becomes a [from, to] pair, and §11.1’s vine.number() base is lifted into a fixed-length array of the same constrained number — both ends obey min/max/decimal.
min(value: number): this NumericField Lower bound; compiles to Vine min (§11.1) and rides the wire for the input.
max(value: number): this NumericField Upper bound; compiles to Vine max (§11.1).
step(value: number): this NumericField Input granularity. A rendering affordance only — see the module note.
decimal(places: number): this NumericField Maximum decimal places (§11.1 decimal(places)). decimal(0) is the integer constraint; omitting it accepts any precision.

Introspection

Read-only members this type adds — used by the compiler, the table derivation and tests rather than by a schema author.

Member Declared on Behaviour
get isRange(): boolean Slider Whether this slider was switched to two-handle mode.

Validation

Vine base: vine.number().

§11.1 mapping: vine.number() + min/max/decimal, wrapped in a two-element vine.array in range mode. fixedLength(2) is what stops a client from submitting a one- or three-handle payload.

Contributed by Slider.vineSchema() in packages/core/src/schema/fields/slider.ts. The shared modifiers (required, nullable, requiredWhen, unique, optionality) are applied on top by Field.buildValidation, and a rules() override replaces the base entirely — the validator compiler never branches on the field class.

Declared in

  • packages/core/src/schema/fields/slider.tsSlider
  • packages/core/src/schema/fields/numeric.tsNumericField
Navigation

Type to search…

↑↓ navigate↵ selectEsc close