work in progress implementation of: - mixer with channel strips, faders, pan knobs, level meters - timeline with ruler, playhead, sections, keyframe tracks - pattern and progression pickers for drums/chords - automation lanes and mute tracks - loop bracket for loop region selection - export modal placeholder known issues: - drum pattern changes don't update audio engine - timeline keyframes not connected to scheduler - some UI bugs remain this is a checkpoint commit for further iteration
33 lines
856 B
TypeScript
33 lines
856 B
TypeScript
'use client';
|
|
|
|
import { Button } from '@/components/ui/button';
|
|
import { cn } from '@/lib/utils';
|
|
|
|
interface DurationSelectorProps {
|
|
value: number;
|
|
onChange: (bars: number) => void;
|
|
className?: string;
|
|
}
|
|
|
|
const presets = [8, 16, 32, 64];
|
|
|
|
export function DurationSelector({ value, onChange, className }: DurationSelectorProps) {
|
|
return (
|
|
<div className={cn('flex items-center gap-1', className)}>
|
|
<span className="text-xs text-muted-foreground mr-1">Duration:</span>
|
|
{presets.map((bars) => (
|
|
<Button
|
|
key={bars}
|
|
variant={value === bars ? 'default' : 'outline'}
|
|
size="sm"
|
|
className="h-6 px-2 text-xs"
|
|
onClick={() => onChange(bars)}
|
|
>
|
|
{bars}
|
|
</Button>
|
|
))}
|
|
<span className="text-xs text-muted-foreground ml-1">bars</span>
|
|
</div>
|
|
);
|
|
}
|