38 lines
1.0 KiB
TypeScript
38 lines
1.0 KiB
TypeScript
|
import { Slider } from '@/components/ui/slider';
|
||
|
|
|
||
|
|
interface SliderRowProps {
|
||
|
|
label: string;
|
||
|
|
display: string;
|
||
|
|
value: number;
|
||
|
|
min: number;
|
||
|
|
max: number;
|
||
|
|
step?: number;
|
||
|
|
onChange: (v: number) => void;
|
||
|
|
disabled?: boolean;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Shared label+display header + Slider.
|
||
|
|
* For the keyframe editor's slider+number-input variant, use the local SliderRow in KeyframeProperties.tsx.
|
||
|
|
*/
|
||
|
|
export function SliderRow({ label, display, value, min, max, step = 1, onChange, disabled }: SliderRowProps) {
|
||
|
|
return (
|
||
|
|
<div className="space-y-1.5">
|
||
|
|
<div className="flex items-center justify-between">
|
||
|
|
<span className="text-[10px] font-semibold text-muted-foreground uppercase tracking-widest">
|
||
|
|
{label}
|
||
|
|
</span>
|
||
|
|
<span className="text-[10px] text-muted-foreground/40 font-mono tabular-nums">{display}</span>
|
||
|
|
</div>
|
||
|
|
<Slider
|
||
|
|
min={min}
|
||
|
|
max={max}
|
||
|
|
step={step}
|
||
|
|
value={[value]}
|
||
|
|
onValueChange={([v]) => onChange(v)}
|
||
|
|
disabled={disabled}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|