28 lines
622 B
TypeScript
28 lines
622 B
TypeScript
import "./RangeSlider.css";
|
|
import type { Component, JSX } from "solid-js";
|
|
|
|
export const RangeSlider: Component<{
|
|
name: string;
|
|
min: number;
|
|
max: number;
|
|
step: number;
|
|
value: number;
|
|
children?: JSX.Element;
|
|
onChange?: (value: number) => void;
|
|
onInput?: (value: number) => void;
|
|
}> = (props) => (
|
|
<label class="range-slider">
|
|
{props.children}
|
|
<input
|
|
type="range"
|
|
name={props.name}
|
|
min={props.min}
|
|
max={props.max}
|
|
step={props.step}
|
|
value={props.value}
|
|
onChange={(e) => props.onChange?.(e.target.valueAsNumber)}
|
|
onInput={(e) => props.onInput?.(e.target.valueAsNumber)}
|
|
/>
|
|
</label>
|
|
);
|