Wondering what’s next for npm?Check out our public roadmap! »

    circular-slider-react

    1.0.6 • Public • Published

    React Circular Slider Component

    Installation

    npm install --save circular-slider-react

    How To Use

    First import this component where you want to use it

    import ReactCircularSlider from "circular-slider-react"

    Then just renders it

    <ReactCircularSlider />

    Props

    Prop Description Default value
    circleColor Sets background color black
    knobColor Sets knob color blue
    radius Sets circle radius 100
    halfCircle Sets if circle is half or not false
    min Sets min value 0
    max Sets max value 100
    stepSize Sets step size 1
    value Sets initial value 0
    onChange callback function on value change null

    Example

    import React, { Component } from "react";
    import ReactCircularSlider from "circular-slider-react";
    
    class App extends Component {
      render() {
        return (
            <ReactCircularSlider size={500} circleColor="black" value={10} stepSize={2} />
        );
      }
    }
    
    export default App;
    

    Install

    npm i circular-slider-react

    DownloadsWeekly Downloads

    10

    Version

    1.0.6

    License

    ISC

    Unpacked Size

    23 kB

    Total Files

    8

    Last publish

    Collaborators

    • avatar