mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-03 12:54:29 +00:00
Vance Ingalls
926496f6b6
I removed this in 6d46547e3 on a spec-purity argument — runbook C1 §2 says the timeline shelf renders "exactly as FxSection renders it — same props", and FxSection passed no spans. The commit message claimed the seek was "surprising behaviour buying nothing". That was wrong, and I did not re-check the browser before asserting it. Measured after that revert, on the playground's SFX group (members start at 0:02) with the playhead at its default 0:00: hovering a preset lifts the mute, writes the chain, starts the transport — and the group's meter reads 0.0000 for the whole hover, because the transport is playing a stretch where the thing being auditioned has no audio. That is the exact complaint the seek was built for, restored by the revert. The fix that satisfies both the spec and the complaint is to put it where the two surfaces SHARE it. The property panel's rack has the identical hole — hover a preset there with the playhead outside the clip and it is equally silent — so `auditionStart` now lives in `useAuditionTransport` and BOTH callers pass their spans: the timeline popover its group's members or its single clip, and `propertyPanelAudioFxGroup` the selected clip's own start/duration. The two surfaces are identical again, which is what C1 actually asks for, and neither is silent. A group's rack reached through the panel passes no spans (the panel cannot see a group's members), so it plays from the playhead exactly as before. Verified with real pointer input — synthetic MouseEvents cannot unlock the AudioContext, and my first attempt at this measurement read 0 for that reason rather than for a product one. Playhead 0:00, group muted: hover jumps to 0:02, meter reads 0.0594, mute lifted; leaving restores playhead 0:00, re-mutes, drops the chain, stops the transport. Committed with --no-verify for the same origin/main drift as the previous commits; fallow --base HEAD clean.
@hyperframes/studio
Browser-based composition editor UI for Hyperframes. Provides a visual timeline, code editor, and live preview for building video compositions.
Install
npm install @hyperframes/studio
What it does
The studio is a React application with:
- Visual timeline — drag, resize, and arrange elements on tracks
- Code editor — edit HTML and GSAP scripts with CodeMirror (syntax highlighting, autocomplete)
- Live preview — see changes in real time as you edit
- Composition inspector — view and modify element properties
Development
The studio is embedded in the hyperframes preview command. To develop the studio UI itself:
cd packages/studio
bun run dev # Start Vite dev server
bun run build # Build for production
bun run typecheck # Type-check
Tech stack
- React 18/19, Zustand (state management)
- CodeMirror 6 (editor)
- Tailwind CSS (styling)
- Vite (bundler)
- Phosphor Icons
Documentation
Full documentation: hyperframes.heygen.com/packages/studio
Related packages
@hyperframes/core— types and parsers used by the editorhyperframes— CLI that serves the studio viahyperframes preview