mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-03 12:54:29 +00:00
Vance Ingalls
94ecaa3ca1
**Group lane labels drifted off the curves they name.** The labels iterated raw `elementAutomationLanes` while the curves and the reserved height both use `groupAutomationLanes` — deduped by property and filtered for resolvability — and the old `if (!parts) return null` consumed an index without drawing a row. So one unresolvable target slid every later label one row off its own curve. Both sides read the same source now, and the label takes its name and parameter from the group entry rather than re-deriving them (the second of the two duplicate `automationLaneLabelParts` calls the review counted). **`useEffectiveTimelineDuration` restated `getEffectiveTimelineDuration`** with weaker guards: no non-finite check on the stored duration or the result, so an element carrying NaN timing returned NaN and every downstream width became NaN with it. It delegates now. **`createStableContext` warns on a genuine name collision.** Two modules asking for one name silently share ONE context, so a provider's value is read by the other's consumers and the symptom appears far from either file. Told apart from an HMR re-evaluation by the default value: a re-evaluated module registers the same default, a collision does not. **Documented that `groupNormalizeOptionUnsupported` is live, not dead regex.** A review pass claimed the `amix` normalize fallback could never match; ffmpeg 8.1.1 emits `Error applying option 'X' to filter 'amix': Option not found`, which the second test matches. Verified against the binary, and the comment now says so with the one wording that would miss (pre-4.4 libavfilter, which predates `normalize` existing). **Left alone deliberately:** the leftover wrapper `<div>` in `PlayerControls`. It is genuinely redundant — `PreviewPane` supplies its own flex wrapper — but removing it is a pure-cosmetic JSX re-indent of a 300-line component with no test that would catch a mistake, which is a bad trade against the rest of this batch. Noted for whoever is next in that file. studio 1356 player tests, engine grouping 11. fallow 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