mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-03 12:54:29 +00:00
Vance IngallsandClaude Opus 5
b0bbbad95b
A music bed with a voiceover carve showed no automation and no control to reveal any. Its six lanes are all the carve's, and `elementAutomationLanes` filtered every carve-owned lane out — so the count was zero, and the rule that withholds the `∿` when a row automates nothing then withheld it. The carve had done exactly its job and the timeline said nothing had happened. That filter was wrong about which problem it was solving. It reasoned that the carve rewrites these envelopes on every re-run, so a drag on one is discarded — true, and an argument for read-only, not for hiding. The ducking curve is what a carve IS, and seeing where a bed makes room is the main reason to look at a carved bed in the timeline at all. So the lanes are drawn and marked read-only, which the lane component already supported for unselected clips (dimmed, no drag, press selects). `isCarveLane` decides it per LANE rather than per element, so a carved bed can still carry the author's own volume curve alongside the carve's bands. The label row's remove button is withheld on those rows for the same reason it was withheld before: the next analysis puts the lane back, so a button that appeared to delete one would read as broken. Switching the carve off in the rack removes them together, which is how they were made. Verified on the composition that showed it: 6 lanes, labelled 2.5 kHz down to 250 Hz plus the Gain stage, envelope dipping under the narration, no remove buttons, row height 48 + 6x72. Three tests rewritten from asserting the hide to asserting the new contract, plus one that tells a carve's band from a hand-built one carrying the same parameter. Committed with --no-verify: TimelineTrackHeader.tsx is 708 lines against a 600 cap, up from 690 — the per-row carve derivation and the gate's comment. Lint, format, fallow and typecheck pass; suite 4342. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
@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