MultiRangeSlider

MultiRangeSlider is a React component that allows users to select a range of values using multiple sliders.

Installation

You can install MultiRangeSlider via npm:

npm install @abhilaksharora/multi-range-slider

Usage

import React, { useState } from 'react';
import MultiRangeSlider from '@abhilaksharora/multi-range-slider';

const App = () => {
  const [range, setRange] = useState({ min: 0, max: 100 });

  const handleRangeChange = (values) => {
    setRange(values);
  };

  return (
    <div>
      <h1>Multi Range Slider Example</h1>
      <MultiRangeSlider min={0} max={100} onChange={handleRangeChange} />
      <p>Selected Range: {range.min} - {range.max}</p>
    </div>
  );
};

export default App;

Props

• min (number, required): The minimum value of the slider.
• max (number, required): The maximum value of the slider.
• onChange (function, required): A callback function called whenever the selected range changes. It receives an object containing the min and max values of the range.

Contributing

Contributions are welcome! Please feel free to submit issues or pull requests.

License

This project is licensed under the MIT License - see the LICENSE file for details.