@blaze-react/range-slider

0.7.0 • Public • Published

Description

Range slider allows the input of numeric values within a specific range. It can accept a single value, or a range of values (min/max).

Usage

  • With one moveable hander
<RangeSlider
    name="oneValue"
    maxValue={20}
    minValue={0}
    onChange={() => { }}
    value={15} />
  • With one moveable handler and custom step value
<RangeSlider
    name="step"
    maxValue={20}
    minValue={0}
    onChange={() => { }}
    step={5}
    value={15} />
  • With two moveable handlers
<RangeSlider
    name="twoValue"
    maxValue={20}
    minValue={0}
    onChange={() => { }}
    value={{ min: 3, max: 7 }} />
  • With two moveable handlers and draggable track
<RangeSlider
    draggableTrack
    name="draggableTrack"
    maxValue={20}
    minValue={0}
    onChange={() => { }}
    value={{ min: 3, max: 7 }} />

API

RangeSlider can receive a number of props as follow:
NAME TYPE DEFAULT
allowSameValues Boolean false
disabled Boolean false
draggableTrack Boolean false
maxValue Number 10
minValue Number 0
name String ''
onChange Function () => {}
step Number 1
value Number/Object 0

Readme

Keywords

none

Package Sidebar

Install

npm i @blaze-react/range-slider

Weekly Downloads

4

Version

0.7.0

License

ISC

Unpacked Size

5.7 kB

Total Files

4

Last publish

Collaborators

  • mcabrerapf
  • tanane
  • daoyong
  • marekb9
  • grzegorzi
  • ishrat
  • andypail