hyperframes 0.7.55 → 0.7.57
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cli.js +4220 -3036
- package/dist/commands/contrast-audit.browser.js +10 -0
- package/dist/commands/layout-audit.browser.js +394 -33
- package/dist/hyperframe-runtime.js +50 -30
- package/dist/hyperframe.manifest.json +1 -1
- package/dist/hyperframe.runtime.iife.js +50 -30
- package/dist/hyperframes-player.global.js +2 -2
- package/dist/hyperframes-slideshow.global.js +25 -25
- package/dist/skills/hyperframes-cli/SKILL.md +39 -10
- package/dist/skills/hyperframes-cli/references/cloud.md +123 -0
- package/dist/skills/hyperframes-cli/references/lint-validate-inspect.md +1 -1
- package/dist/studio/assets/hyperframes-player--Z69cEkE.js +459 -0
- package/dist/studio/assets/{index-CPetwHFV.js → index-Bf1x1y8H.js} +1 -1
- package/dist/studio/assets/index-DfmYkU44.js +423 -0
- package/dist/studio/assets/{index-BXaqaVKt.js → index-KsfE1bUu.js} +1 -1
- package/dist/studio/assets/index-_pqzyxB1.css +1 -0
- package/dist/studio/{chunk-SOTCF4DF.js → chunk-5QSIMBEJ.js} +2 -1
- package/dist/studio/chunk-5QSIMBEJ.js.map +1 -0
- package/dist/studio/{domEditingLayers-2ECJK24D.js → domEditingLayers-6LQGKPOI.js} +2 -2
- package/dist/studio/index.d.ts +172 -144
- package/dist/studio/index.html +2 -2
- package/dist/studio/index.js +43613 -40346
- package/dist/studio/index.js.map +1 -1
- package/package.json +2 -1
- package/dist/studio/assets/hyperframes-player-BBrKzTGd.js +0 -459
- package/dist/studio/assets/index-BRwkMj0w.js +0 -423
- package/dist/studio/assets/index-Dq7FEg0K.css +0 -1
- package/dist/studio/chunk-SOTCF4DF.js.map +0 -1
- /package/dist/studio/{domEditingLayers-2ECJK24D.js.map → domEditingLayers-6LQGKPOI.js.map} +0 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: hyperframes-cli
|
|
3
|
-
description: HyperFrames CLI dev loop. Use when running npx hyperframes init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, render, publish, feedback, lambda, doctor, browser, info, upgrade, skills, compositions, docs, benchmark, telemetry, transcribe, tts, or remove-background (validate/inspect/layout are deprecated aliases covered by check), or when troubleshooting the HyperFrames build/render environment. Entry point for AWS Lambda
|
|
3
|
+
description: HyperFrames CLI dev loop. Use when running npx hyperframes init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, render, publish, cloud, feedback, lambda, doctor, browser, info, upgrade, skills, compositions, docs, benchmark, telemetry, transcribe, tts, or remove-background (validate/inspect/layout are deprecated aliases covered by check), or when troubleshooting the HyperFrames build/render environment. Entry point for HeyGen-hosted cloud rendering (`hyperframes cloud render / list / get / delete`) and self-managed AWS Lambda rendering (`hyperframes lambda deploy / render / progress / destroy / policies / sites`).
|
|
4
4
|
---
|
|
5
5
|
|
|
6
6
|
# HyperFrames CLI
|
|
@@ -18,7 +18,8 @@ Everything runs through `npx hyperframes` unless project instructions specify a
|
|
|
18
18
|
- Iterate: `npx hyperframes render --quality draft`
|
|
19
19
|
- Deliver: `npx hyperframes render --quality high --output out.mp4`
|
|
20
20
|
- CI / cross-host repro: `npx hyperframes render --docker --strict --output out.mp4`
|
|
21
|
-
- Cloud
|
|
21
|
+
- Cloud, zero-infra: `npx hyperframes cloud render` (HeyGen hosts the render; no local Chrome/FFmpeg/AWS, see Cloud below)
|
|
22
|
+
- Cloud, bring-your-own-AWS: `npx hyperframes lambda render ./my-project --width 1920 --height 1080 --wait` (see Lambda below)
|
|
22
23
|
7. **Report feedback** — after verifying the output, `npx hyperframes feedback --rating <1-5> --comment "..."` once per task (see Agent Conventions).
|
|
23
24
|
|
|
24
25
|
Run `check` before preview. It runs the linter first (and skips the browser entirely on lint errors), then does everything the old validate → inspect → snapshot sequence did in **one** browser session and one seek pass: runtime console errors and failed requests, layout defects (text spilling out of bubbles/containers or off canvas, held overlaps, occlusion), motion-sidecar verification (`*.motion.json` — entrances under seek, stagger order, in-frame, liveness), and WCAG contrast. Contrast failures are errors and carry the sampled fg/bg colors, measured vs required ratio, and a suggested compliant color, so most contrast fixes need no screenshot. Every finding carries a selector, `data-*` identity, composition source file, bbox, and sample time — jump straight to the HTML. Single-sample transients demote to info; findings held across samples gate the exit code (`--strict` gates warnings too). `validate`, `inspect`, and `layout` still work but are deprecated aliases of parts of `check`.
|
|
@@ -50,14 +51,16 @@ Cross-cutting rules that hold for every command:
|
|
|
50
51
|
|
|
51
52
|
## Routing
|
|
52
53
|
|
|
53
|
-
| Want to… | Read
|
|
54
|
-
| ---------------------------------------------------------------------------------------------------------- |
|
|
55
|
-
| Scaffold a project (`init`, `capture`, `skills`) | `references/init-and-scaffold.md`
|
|
56
|
-
| Check correctness (`lint`, `check`, `snapshot`, deprecated `validate`/`inspect`) | `references/lint-validate-inspect.md`
|
|
57
|
-
| Preview or render (`preview`, `play`, `render`, `publish`) | `references/preview-render.md`
|
|
58
|
-
| Diagnose the environment (`doctor`, `browser`) | `references/doctor-browser.md`
|
|
59
|
-
| Cloud render
|
|
60
|
-
|
|
|
54
|
+
| Want to… | Read |
|
|
55
|
+
| ---------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- |
|
|
56
|
+
| Scaffold a project (`init`, `capture`, `skills`) | `references/init-and-scaffold.md` |
|
|
57
|
+
| Check correctness (`lint`, `check`, `snapshot`, deprecated `validate`/`inspect`) | `references/lint-validate-inspect.md` |
|
|
58
|
+
| Preview or render (`preview`, `play`, `render`, `publish`) | `references/preview-render.md` |
|
|
59
|
+
| Diagnose the environment (`doctor`, `browser`) | `references/doctor-browser.md` |
|
|
60
|
+
| Cloud render, zero-infra HeyGen-hosted (`cloud render / list / get / delete`, `auth`) | `references/cloud.md` |
|
|
61
|
+
| Cloud render on your own AWS Lambda (`lambda deploy / sites / render / progress / destroy / policies`) | `references/lambda.md` |
|
|
62
|
+
| Parametrize / template renders (`--variables`, `--variables-file`, `--strict-variables`, `--batch`) | `references/cloud.md` + `hyperframes-core` (`variables-and-media.md`) |
|
|
63
|
+
| Everything else (`info`, `upgrade`, `compositions`, `docs`, `benchmark`, `telemetry`, asset preprocessing) | `references/upgrade-info-misc.md` |
|
|
61
64
|
|
|
62
65
|
## Cross-Skill Hand-Offs
|
|
63
66
|
|
|
@@ -66,6 +69,32 @@ Cross-cutting rules that hold for every command:
|
|
|
66
69
|
- **Asset preprocessing** (`tts`, `transcribe`, `remove-background`) → use `media-use` for voice selection, Whisper model rules, captions, and TTS-to-captions chain.
|
|
67
70
|
- **Parametrized renders** (`--variables`) → declared via `data-composition-variables` on `<html>`; see `hyperframes-core` for the full schema.
|
|
68
71
|
|
|
72
|
+
## Cloud (HeyGen-hosted rendering)
|
|
73
|
+
|
|
74
|
+
`hyperframes cloud render` is the **zero-infra** render path: the CLI zips your project, uploads it, renders on HeyGen's cloud, and downloads the mp4. No Chrome, no FFmpeg, no AWS, and you pay per credit. This is the default answer to "render this in the cloud"; reach for Lambda only when you already own AWS and need distributed/chunked rendering.
|
|
75
|
+
|
|
76
|
+
```bash
|
|
77
|
+
npx hyperframes auth login # one-time sign-in (shared with the `heygen` CLI)
|
|
78
|
+
npx hyperframes cloud render # zip, upload, render, download to renders/<id>.mp4
|
|
79
|
+
```
|
|
80
|
+
|
|
81
|
+
Common flags: `--composition <html>`, `--output <path>`, `--quality draft|standard|high`, `--fps`, `--resolution 1080p|4k`, `--format mp4|webm|mov`, `--aspect-ratio` (auto-detected from `data-width`/`data-height`). Fire-and-forget with `--no-wait` + `--callback-url`; make retries safe with `--idempotency-key "$(uuidgen)"`. Manage jobs with `cloud list` / `cloud get <id>` / `cloud delete <id>`.
|
|
82
|
+
|
|
83
|
+
The idiomatic **template workflow is upload-once, re-render-many**: render a local project once to get its `asset_id`, then re-submit against that asset with different `--variables` (skips zip + upload). See `references/cloud.md` for the full flag set, the auth model, webhooks, and the template loop.
|
|
84
|
+
|
|
85
|
+
## Variables (parametrized / template renders)
|
|
86
|
+
|
|
87
|
+
Any render (local, cloud, or Lambda) can fill declared template slots at render time. Declarations live on the composition (`data-composition-variables`); the CLI surface is:
|
|
88
|
+
|
|
89
|
+
```bash
|
|
90
|
+
npx hyperframes render --variables '{"title":"Q4 Recap","theme":"dark"}' --output q4.mp4
|
|
91
|
+
npx hyperframes render --variables-file ./vars.json --output out.mp4
|
|
92
|
+
npx hyperframes render --batch rows.json --output "renders/{name}.mp4" --strict-variables
|
|
93
|
+
npx hyperframes cloud render --asset-id asst_abc123 --variables '{"name":"Ada"}'
|
|
94
|
+
```
|
|
95
|
+
|
|
96
|
+
`--strict-variables` fails the render on any undeclared key or type mismatch (use it in CI). `--batch <rows.json>` renders one output per data row with `{key}`/`{index}` path placeholders and writes a `manifest.json`. For the **full schema** (declaring types, `data-var-src`/`data-var-text` declarative bindings, per-instance `data-variable-values` for sub-compositions, and precedence) use the `hyperframes-core` skill (`references/variables-and-media.md`). The cloud template loop lives in `references/cloud.md`.
|
|
97
|
+
|
|
69
98
|
## Lambda (Cloud Rendering)
|
|
70
99
|
|
|
71
100
|
`hyperframes lambda` deploys distributed rendering to AWS Lambda and drives renders from your laptop or CI. End-to-end is three commands:
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
# cloud — HeyGen-hosted rendering (zero-infra)
|
|
2
|
+
|
|
3
|
+
`hyperframes cloud render` renders a composition on HeyGen's managed cloud. The CLI zips the project, uploads it, runs the render on HeyGen's infrastructure (Chromium + FFmpeg), and downloads the finished video. Nothing to deploy, and no Chrome/FFmpeg/AWS to manage; you pay per credit.
|
|
4
|
+
|
|
5
|
+
```bash
|
|
6
|
+
npx hyperframes auth login # one-time sign-in
|
|
7
|
+
npx hyperframes cloud render # zip, upload, render, download
|
|
8
|
+
```
|
|
9
|
+
|
|
10
|
+
## When to use cloud vs lambda vs local
|
|
11
|
+
|
|
12
|
+
- **`hyperframes render`** (local): fastest iteration loop, use while authoring.
|
|
13
|
+
- **`hyperframes cloud render`**: zero-infra. HeyGen runs the render and you pay per credit. This is the default answer to "render in the cloud" when you don't want to manage Chrome/FFmpeg/AWS.
|
|
14
|
+
- **`hyperframes lambda render`**: bring-your-own-AWS distributed rendering with chunked parallelism. Only worth it when you've already invested in AWS (see `lambda.md`).
|
|
15
|
+
|
|
16
|
+
## Authentication
|
|
17
|
+
|
|
18
|
+
Cloud rendering needs a HeyGen credential, stored at `~/.heygen/credentials` (`0600`) and shared with the [`heygen` CLI](https://github.com/heygen-com/heygen-cli): sign in with one and the other picks up the session.
|
|
19
|
+
|
|
20
|
+
```bash
|
|
21
|
+
npx hyperframes auth login # OAuth 2.0 + PKCE, opens the browser
|
|
22
|
+
npx hyperframes auth login --api-key # CI/headless: hidden prompt, or pipe: echo "$HEYGEN_API_KEY" | ... --api-key
|
|
23
|
+
npx hyperframes auth status # active credential source, identity, billing snapshot
|
|
24
|
+
npx hyperframes auth refresh # force-refresh an OAuth token before a long job
|
|
25
|
+
npx hyperframes auth logout # clear the stored credential
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
Credential resolution order (first match wins): `HEYGEN_API_KEY`, then `HYPERFRAMES_API_KEY`, then `~/.heygen/credentials`. Point at a different backend with `HEYGEN_API_URL` (default `https://api.heygen.com`).
|
|
29
|
+
|
|
30
|
+
## The render pipeline
|
|
31
|
+
|
|
32
|
+
`cloud render` runs end-to-end:
|
|
33
|
+
|
|
34
|
+
1. **Resolve the project**: a local directory (default `.`), or skip the upload with `--asset-id` / `--url`.
|
|
35
|
+
2. **Auto-detect aspect ratio** from the entry HTML's `data-width`/`data-height`.
|
|
36
|
+
3. **Zip** the project (same ignore set as `hyperframes publish`, so it excludes `.git`, `node_modules`, `dist`, and so on).
|
|
37
|
+
4. **Upload** the zip to `POST /v3/assets`, yielding an `asset_id`.
|
|
38
|
+
5. **Submit** the render to `POST /v3/hyperframes/renders`, yielding a `render_id`.
|
|
39
|
+
6. **Poll** `GET /v3/hyperframes/renders/{id}` until it completes or fails (skip with `--no-wait`).
|
|
40
|
+
7. **Download** the signed video URL to disk.
|
|
41
|
+
|
|
42
|
+
## Render options
|
|
43
|
+
|
|
44
|
+
| Flag | Default | Meaning |
|
|
45
|
+
| ---------------------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------ |
|
|
46
|
+
| `--fps` | `30` | Frames per second, 1–240. |
|
|
47
|
+
| `--quality` | `standard` | `draft`, `standard`, or `high`. |
|
|
48
|
+
| `--format` | `mp4` | `mp4`, `webm`, or `mov` (webm/mov carry alpha). |
|
|
49
|
+
| `--resolution` | `1080p` | `1080p` or `4k` (4k billed at 1.5×). |
|
|
50
|
+
| `--aspect-ratio` | auto | `16:9`, `9:16`, or `1:1`. Auto from a local project's `data-width`/`data-height`; defaults to `16:9` for `--asset-id`/`--url`. |
|
|
51
|
+
| `--composition` / `-c` | `index.html` | Entry HTML file inside the zip. |
|
|
52
|
+
| `--output` / `-o` | `renders/<render_id>.<ext>` | Local download destination. |
|
|
53
|
+
|
|
54
|
+
```bash
|
|
55
|
+
npx hyperframes cloud render . \
|
|
56
|
+
--composition compositions/intro.html \
|
|
57
|
+
--output ./renders/intro.mp4
|
|
58
|
+
|
|
59
|
+
npx hyperframes cloud render --quality high --fps 60
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
`--resolution 4k` cannot combine with `--format webm`/`mov`: the 4k supersampling path has no alpha channel. Render 4k as mp4, or render alpha at native resolution.
|
|
63
|
+
|
|
64
|
+
## Templates and variables
|
|
65
|
+
|
|
66
|
+
Cloud rendering supports [variables](../SKILL.md#variables-parametrized--template-renders): declare `data-composition-variables` on the composition, then fill them at render time.
|
|
67
|
+
|
|
68
|
+
```bash
|
|
69
|
+
npx hyperframes cloud render --variables '{"title":"Q4 Recap","theme":"dark"}'
|
|
70
|
+
npx hyperframes cloud render --variables-file ./vars.json
|
|
71
|
+
npx hyperframes cloud render --variables '{"title":"Q4 Recap"}' --strict-variables
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
For a **local project** the CLI validates `--variables` against the declared schema _before_ uploading. For `--asset-id`/`--url` the schema lives server-side, so mismatches surface as a `hyperframes_project_invalid` API error.
|
|
75
|
+
|
|
76
|
+
**Upload once, re-render many** is the idiomatic template loop: render a local project to get its `asset_id`, then re-submit against that asset with new values (no re-zip, no re-upload).
|
|
77
|
+
|
|
78
|
+
```bash
|
|
79
|
+
npx hyperframes cloud render ./card-template # note the asset_id printed on upload
|
|
80
|
+
npx hyperframes cloud render --asset-id asst_abc123 --variables '{"name":"Ada"}'
|
|
81
|
+
npx hyperframes cloud render --asset-id asst_abc123 --variables '{"name":"Linus"}'
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
For high-volume personalized batches, the Lambda path adds a JSONL fan-out (see `lambda.md`). The full variables schema (types, declarative bindings, sub-composition overrides, precedence) lives in the `hyperframes-core` skill.
|
|
85
|
+
|
|
86
|
+
## Fire-and-forget and webhooks
|
|
87
|
+
|
|
88
|
+
By default the CLI blocks, polls, and downloads. Combine `--no-wait` (submit and exit with just the `render_id`) with `--callback-url` (HTTPS webhook on terminal status) for true fire-and-forget:
|
|
89
|
+
|
|
90
|
+
```bash
|
|
91
|
+
npx hyperframes cloud render --callback-url https://example.com/hf-hook --no-wait
|
|
92
|
+
# Poll later with: hyperframes cloud get hfr_def456
|
|
93
|
+
```
|
|
94
|
+
|
|
95
|
+
| Flag | Meaning |
|
|
96
|
+
| ----------------- | --------------------------------------------------- |
|
|
97
|
+
| `--no-wait` | Submit and exit immediately; print the `render_id`. |
|
|
98
|
+
| `--callback-url` | HTTPS webhook fired when the render terminates. |
|
|
99
|
+
| `--callback-id` | Opaque tracking ID echoed in webhook payloads. |
|
|
100
|
+
| `--poll-interval` | Poll cadence in seconds (default `10`). |
|
|
101
|
+
| `--max-wait` | Max poll duration in minutes (default `60`). |
|
|
102
|
+
|
|
103
|
+
## Managing renders
|
|
104
|
+
|
|
105
|
+
```bash
|
|
106
|
+
npx hyperframes cloud list # recent renders (--limit, --token, --all)
|
|
107
|
+
npx hyperframes cloud get hfr_def456 # full detail + short-lived signed video_url
|
|
108
|
+
npx hyperframes cloud delete hfr_def456 # soft-delete (--no-confirm to skip the prompt)
|
|
109
|
+
```
|
|
110
|
+
|
|
111
|
+
`video_url` and `thumbnail_url` are short-lived presigned URLs, so re-fetch with `cloud get` rather than caching them.
|
|
112
|
+
|
|
113
|
+
## Safe retries
|
|
114
|
+
|
|
115
|
+
The CLI transparently retries a `401` by force-refreshing the OAuth token and replaying. That's harmless for reads, but the zip upload (`POST /v3/assets`) is **not** idempotent: a blind retry creates a duplicate asset and bills twice. Pass `--idempotency-key` so retries are safe:
|
|
116
|
+
|
|
117
|
+
```bash
|
|
118
|
+
npx hyperframes cloud render . --idempotency-key "$(uuidgen)"
|
|
119
|
+
```
|
|
120
|
+
|
|
121
|
+
The key is forwarded to both upload and submit (the server scopes idempotency per-endpoint, so reusing one value is safe). Use any opaque string in `[A-Za-z0-9_:.-]`, 1–255 chars.
|
|
122
|
+
|
|
123
|
+
Full flag reference: docs `/deploy/cloud` and `/packages/cli#hyperframes-cloud`.
|
|
@@ -56,7 +56,7 @@ One command, one Chrome boot. `check` runs the linter first and skips the browse
|
|
|
56
56
|
|
|
57
57
|
Every finding carries a selector, the element's `data-*` identity, the composition source file, a bbox, and the sample time: jump straight from the JSON to the HTML you must edit and re-run.
|
|
58
58
|
|
|
59
|
-
**Severity is persistence-aware.** A dynamic issue observed at a single grid sample (an entrance/exit transient) demotes to info and never gates. Issues held across samples gate the exit code,
|
|
59
|
+
**Severity is persistence-aware.** A dynamic issue observed at a single grid sample (an entrance/exit transient) demotes to info and never gates. Issues held across samples gate the exit code, a held `content_overlap` is an error, and a held, partially-visible `canvas_overflow` breaching ≥5% of the canvas promotes to warning. Coordinate-frame findings (`escaped_container`, `panel_out_of_canvas`, `connector_detached`) flag geometry computed in one frame but rendered in another — an element far outside its offset parent, a painted panel stuck across the canvas edge, a connector line detached from every node. If a 3s+ composition shows zero geometry change across every sample, `check` fails with `sweep_static`: a frozen timeline makes every green verdict unreliable, so it refuses to pass.
|
|
60
60
|
|
|
61
61
|
**Escape hatches** (mark intent in the HTML, then re-run):
|
|
62
62
|
|