react-rangeslider-topbottom-label v1.1.5

Installation

Using npm (use --save to include it in your package.json)

$ npm install react-rangeslider-dual-label --save

Using yarn (this command also adds react-rangeslider-dual-label to your package.json dependencies)

$ yarn add react-rangeslider-dual-label

Getting Started

React-Rangeslider-dual-label is bundled with a slider component & default styles which can be overridden depending on your design requirements.

With a module bundler like webpack that supports either CommonJS or ES2015 modules, use as you would anything else:

// Using an ES6 transpiler like Babel
import Slider from "react-rangeslider-dual-label";

// To include the default styles
import "react-rangeslider-dual-label/lib/index.css";

// Not using an ES6 transpiler
var Slider = require("react-rangeslider-dual-label");

API

Rangeslider is bundled as a single component, that accepts data and callbacks only as props.

Component

import Slider from "react-rangeslider-dual-label";

// inside render
<Slider
  min={Number}
  max={Number}
  step={Number}
  value={Number}
  orientation={String}
  reverse={Boolean}
  tooltip={Boolean}
  labels={Object}
  handleLabel={String}
  format={Function}
  onChangeStart={Function}
  onChange={Function}
  onChangeComplete={Function}
/>;

Props

License

MIT