@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

/@blaze-react/range-slider/

    Package Sidebar

    Install

    npm i @blaze-react/range-slider

    Weekly Downloads

    34

    Version

    0.7.0

    License

    ISC

    Unpacked Size

    5.7 kB

    Total Files

    4

    Last publish

    Collaborators

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