mirror of
https://github.com/hanzoai/frames.git
synced 2026-09-24 00:08:03 +00:00
Vance IngallsandGitHub
023edecdbb
## Summary - Install oxlint, oxfmt, commitlint, lefthook, knip as dev dependencies - Add `.oxlintrc.json` (correctness rules + React plugin) - Add `.oxfmtrc.json` (double quotes, semicolons, 2-space indent, trailing commas) - Add `commitlint.config.js` (conventional commits) - Add `lefthook.yml` (pre-commit lint+format, commit-msg commitlint) - Add `.editorconfig` and `knip.config.ts` - Add scripts: `pnpm lint`, `pnpm format`, `pnpm format:check`, `pnpm knip` Part 1/4 of [VA-851](https://linear.app/heygen/issue/VA-851/pre-migration-configure-eslint-prettier-and-conventional-commits) ## Test plan - [x] `pnpm lint` runs (reports pre-existing errors, expected) - [x] `pnpm format:check` runs (reports pre-existing diffs, expected) - [x] `commitlint` validates and rejects messages correctly - [x] lefthook hooks install via `pnpm run prepare` - [x] `pnpm knip` runs
Hyperframes
Write HTML. Render video. Built for agents.
Hyperframes is an open-source video rendering framework that lets you create, preview, and render HTML-based video compositions — with first-class support for AI agents via MCP.
Why Hyperframes?
- HTML-native — AI agents already speak HTML. No React required.
- Frame Adapter pattern — bring your own animation runtime (GSAP, Lottie, CSS, Three.js).
- Deterministic rendering — same input = identical output. Built for automated pipelines.
- AI-first design — not a bolted-on afterthought.
Quick Start
npx create-hyperframe my-video
cd my-video
npx hyperframes dev # preview in browser
npx hyperframes render # render to MP4
How It Works
Define your video as HTML with data attributes:
<div id="stage" data-composition-id="my-video"
data-start="0" data-width="1920" data-height="1080">
<video id="clip-1" data-start="0" data-duration="5"
data-track="0" src="intro.mp4" muted playsinline></video>
<img id="overlay" data-start="2" data-duration="3"
data-track="1" src="logo.png" />
<audio id="bg-music" data-start="0" data-duration="9"
data-track="2" data-volume="0.5" src="music.wav"></audio>
</div>
Preview instantly in the browser. Render to MP4 locally. Let AI agents compose videos using tools they already understand.
Contributing
See CONTRIBUTING.md for guidelines on how to contribute.