aboutsummaryrefslogtreecommitdiff
path: root/src/components/ControlSlider.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/ControlSlider.tsx')
-rw-r--r--src/components/ControlSlider.tsx36
1 files changed, 36 insertions, 0 deletions
diff --git a/src/components/ControlSlider.tsx b/src/components/ControlSlider.tsx
new file mode 100644
index 0000000..34d3c82
--- /dev/null
+++ b/src/components/ControlSlider.tsx
@@ -0,0 +1,36 @@
+import React from "react";
+
+interface ControlSliderProps {
+ label: string;
+ name: string;
+ value: number;
+ min: number;
+ max: number;
+ step: number;
+ onChange: (value: string) => void;
+}
+
+export const ControlSlider: React.FC<ControlSliderProps> = ({
+ label,
+ name,
+ value,
+ min,
+ max,
+ step,
+ onChange,
+}) => {
+ return (
+ <div className="control-row">
+ <label>{label}</label>
+ <input
+ type="range"
+ name={name}
+ min={min}
+ max={max}
+ value={value}
+ onChange={(event) => onChange(event.target.value)}
+ step={step}
+ />
+ </div>
+ );
+};