latest version

Slider

Slider option type.

Config

Name Type Default Description
min number 0 Specifies the minimum value allowed.
max number 100 Specifies the maximum value allowed.
inputMin number  
Specifies a different minimum value for input compared to slider.
The value should be always lower or equal then min.
inputMax number  
Specifies a different minimum value for input compared to slider.
The value should be always equal or greater then max.
step number 1 Specifies the legal number intervals.
units array   An list of legal units for value, if it has any. Please checkout Unit structure.
debounceUpdate boolean false Trigger option update only when slider drag ends.
updateRate number 16
Provide the update rate of the option.
Useful for performance reasons to prevent unnecessary element renderings.
Note: debounceUpdate should be false.

DefaultValue

Name Type Description
value number Specifies the slider current value.
unit string Specifies current selected unit.

Unit structure

Name Type Description
value string Specifies unit id. This value should be unique.
title string Specifies unit title. For presentation only.

Minimal Usage

{
  id: "width",
  type: "slider"
}

Usage

{
  id: "width",
  type: "slider",
  config: {
    min: 100,
    max: 1000,
    step: 5,
    debounceUpdate: true,
    units: [
      { value: "px", title: "px" },
      { value: "%", title: "%" },
    ]
  },
  defaultValue: {
    value: 500,
    unit: "px",
  }
},