Skip to content

feat: native Remotion chart picker, agent skill, and multi-frame CLI#85

Open
yasenchen-cmd wants to merge 2 commits into
nexu-io:mainfrom
yasenchen-cmd:fix/native-picker-and-agent-skill
Open

feat: native Remotion chart picker, agent skill, and multi-frame CLI#85
yasenchen-cmd wants to merge 2 commits into
nexu-io:mainfrom
yasenchen-cmd:fix/native-picker-and-agent-skill

Conversation

@yasenchen-cmd

Copy link
Copy Markdown

Summary

  • Ship 4 additional native Remotion data templates (donut / hbars / line / radar) alongside rollup, with Studio format-card + per-frame chart picker
  • Normalize content-graph series data per chart type (itemspoints / axes) and add list-native-templates + multi-frame CLI (set-graph / write-frame / enhance)
  • Add installable agent skill (SKILL.md, skills/html-video/, .cursor/skills/html-video/, scripts/install-agent-skill.sh) and sync README roadmap with Remotion shipped status

Test plan

  • pnpm --filter @html-video/core test (native-data normalize cases)
  • pnpm --filter @html-video/cli exec node --test test/project-frames.test.ts
  • html-video list-native-templates --json returns 5 templates, default frame-data-rollup
  • Studio: format card offers chart types; frame-strip ⚡ opens picker; enhance preview plays
  • bash scripts/install-agent-skill.sh installs to ~/.claude/skills/html-video/

Made with Cursor

chenys and others added 2 commits July 19, 2026 12:26
… radar

Adapted from Hermes Studio (chenys/hermes-studio) scene components:

- frame-data-donut (DataDonut.tsx): SVG donut/ring chart with spring-animated
  slices, center figure rollup, staggered legend. 382 lines.
  ← src/video/scenes.tsx SceneDonut

- frame-data-hbars (DataHBars.tsx): Horizontal bars with top/bottom grouping,
  spring growth, rollup values, log-scale fallback. 281 lines.
  ← src/video/scenes.tsx SceneDeptBars

- frame-data-line (DataLine.tsx): SVG line chart with stroke-dashoffset path
  drawing, gradient area fill, staggered data points, trend arrow. 320 lines.
  ← src/video/scenes.tsx SceneMonthlyTrend

- frame-data-radar (DataRadar.tsx): SVG radar/spider chart with concentric
  grid rings, spring polygon, warn-threshold coloring. 230 lines.
  ← src/video/scenes.tsx SceneRadar

All templates: pure system fonts, responsive layout (16:9/9:16/1:1 via
useVideoConfig), no external assets, offline-deterministic.

Co-Authored-By: chenys <noreply@github.com>
Expose all five native data templates in Studio (format card + per-frame
picker), remap series data per chart type, ship an installable agent skill,
and wire content-graph CLI commands (set-graph / write-frame / enhance).

Co-authored-by: Cursor <cursoragent@cursor.com>
@lefarcen

Copy link
Copy Markdown
Contributor

Heads-up: you also have #37 open against the same area — both PRs touch the templates/frame-data-{donut,hbars,line,radar}/** files. #85 looks like the broader slice because it carries the template set plus the CLI/studio/skill wiring, so it may be worth consolidating or closing one of them to keep review on a single merge path.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

risk/high High risk size/XXL Size XXL (1500+ LOC) type/feature Feature change

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants