Dual Range Slider Single

1"use client";
2 
3import * as React from "react";
4import { DualRangeSlider } from "@/components/ui/dual-range-slider";
5import { useState } from "react";
6 
7const DualRangeSliderSingle = () => {
8  const [values, setValues] = useState([10]);
9 
10  return (
11    <div className="w-full space-y-5 px-10">
12      <div>With Label:</div>
13      <DualRangeSlider
14        label={(value) => value}
15        value={values}
16        onValueChange={setValues}
17        min={0}
18        max={100}
19        step={1}
20      />
21      <div>Without Label</div>
22      <DualRangeSlider
23        value={values}
24        onValueChange={setValues}
25        min={0}
26        max={100}
27        step={1}
28      />
29    </div>
30  );
31};
32export default DualRangeSliderSingle;