rp

react-proslider

A react slider component

Showing:

Popularity

Downloads/wk

3

GitHub Stars

2

Maintenance

Last Commit

4yrs ago

Contributors

0

Package

Dependencies

2

Size (min+gzip)

2.2KB

License

ISC

Type Definitions

Tree-Shakeable

Yes?

Readme

react-proslider

A slider component in react

Installation

npm install react-proslider

Usage

import React from 'react';
import ReactDOM from 'react-dom';

import Slider from 'react-proslider';
    
ReactDOM.render(
  <Slider
    thumbClass="slider__thumb--small"
  />, document.querySelector('#container')
);

Properties

NameTypeDefaultDescription
sliderConfigobject{'value': 20, 'max': 50, 'min': 1, 'thumbSize': 15 }contains the value of the range
onSlideFunctionreturns the current value of the slider
onChangeSliderFunctiononChangeSlider will be triggered on onMouseUp
thumbClassstringGive class slider__thumb--small, slider__thumb--grey & slider__thumb--large to give appropriate styles to range thumb. You can pass your custom class and specify your styles
rangeClassstringGive class slider--grey & slider--large for appropriate styles. You can pass your custom class and specify your styles
showLeftBarbooleanfalseset true to show grey bar on the left side of thumb. Incase of false the entire range will have same styles

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100