ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-10-30 17:27:09 +00:00
Code Issues Packages Projects Releases Wiki Activity
Files
57da627e76712e53031c820950fc2512bc1bf69d
hyperframes/packages/studio
T
History
Miguel Ángel 57da627e76 fix(studio): a hand edit after a preview reload draws on the element now on screen (#4856) 
* fix(studio): a hand edit after a preview reload draws on the element now on screen

* fix(studio): a preview reload waits for the gesture on screen to end

* fix(studio): a marquee after a reload selects from the preview on screen

* fix(studio): a reload requested before a canvas save loads again once the save lands
2026-10-01 11:32:06 -07:00
..
frontend
…
public
…
src
fix(studio): a hand edit after a preview reload draws on the element now on screen (#4856)
2026-10-01 11:32:06 -07:00
tests/e2e
test(studio): catch teleports and multi-step edit bugs in the edit accuracy bench (#4801)
2026-10-01 09:42:05 -07:00
.gitignore
…
AGENTS.md
…
index.html
feat(studio): a light and dark theme toggle in the header that remembers the choice (#4839)
2026-10-01 08:44:57 -07:00
package-subpaths.json
perf(studio): a host's first screen can import Studio's UI and Player without the editor (#4650)
2026-09-28 15:15:00 +00:00
package.json
feat(studio): the code editor follows studio's light and dark theme (#4862)
2026-10-01 10:13:48 -07:00
README.md
…
tsconfig.json
…
tsconfig.lib.json
…
tsup.config.ts
feat(studio): the code editor follows studio's light and dark theme (#4862)
2026-10-01 10:13:48 -07:00
vite.adapter.projects.test.ts
fix(studio): open projects named with a colon and keep preview assets for names with # (#4829)
2026-09-30 23:21:53 -07:00
vite.adapter.proxy.test.ts
…
vite.adapter.signature.test.ts
…
vite.adapter.ts
fix(studio): open projects named with a colon and keep preview assets for names with # (#4829)
2026-09-30 23:21:53 -07:00
vite.browser.test.ts
…
vite.browser.ts
fix(studio-server): uncopied HEVC clips no longer stall Studio while their preview copies are made (#4580)
2026-09-28 16:14:29 +00:00
vite.config.test.ts
…
vite.config.ts
fix(studio): reload the preview only when a file it loaded changes (#4570)
2026-09-27 10:05:53 +00:00
vite.preview-config.test.ts
…
vite.preview-config.ts
…
vite.preview-watch.test.ts
fix(studio): reload the preview only when a file it loaded changes (#4570)
2026-09-27 10:05:53 +00:00
vite.preview-watch.ts
fix(studio): reload the preview only when a file it loaded changes (#4570)
2026-09-27 10:05:53 +00:00
vite.producer.test.ts
…
vite.producer.ts
…
vite.request-body.test.ts
…
vite.request-body.ts
…
vite.studio-server-module.test.ts
…
vite.studio-server-module.ts
…
vite.studioMotion.test.ts
…
vite.studioMotion.ts
…
vite.thumbnail.test.ts
…
vite.thumbnail.ts
…

README.md

@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 19, Zustand 4/5 (state management; development uses Zustand 5)
  • CodeMirror 6 (editor)
  • Tailwind CSS (styling)
  • Vite (bundler)
  • Phosphor Icons

Documentation

Full documentation: hyperframes.heygen.com/packages/studio

Related packages

Reference in New Issue View Git Blame Copy Permalink