Range slider
A native range control with a formatted value, clear bounds and keyboard adjustment.
Implementation
1"use client";2 3import {4 useId,5 useState,6 type CSSProperties,7 type InputHTMLAttributes,8} from "react";9 10export type RangeSliderProps = Omit<11 InputHTMLAttributes<HTMLInputElement>,12 | "type"13 | "value"14 | "defaultValue"15 | "onChange"16 | "min"17 | "max"18 | "step"19 | "children"20 | "size"21> & {22 label: string;23 description?: string;24 value?: number;25 defaultValue?: number;26 min?: number;27 max?: number;28 step?: number | "any";