feat: auto-generate terminal demo SVGs and GIFs

[zrosenbauer]

Summary

New package (e.g. packages/demo or packages/recorder) for programmatically generating terminal-styled SVGs and GIFs for CLI demos and documentation banners — no real terminal recording needed.

Current state

Existing packages: core, cli, config, utils, bundler. No tooling exists for generating visual demo assets. CLI demos currently require manual recording or screenshots.

Proposed scope

A declarative, config-driven generator that:

• Takes a typed config describing a terminal session (commands, fake outputs, typing speed, delays, cursor behavior)
• Renders terminal-styled SVG frames (monospace font, theme colors, window chrome)
• Stitches frames into animated SVGs and/or GIFs (via sharp, ffmpeg, or similar)
• Outputs deterministic, reproducible assets suitable for README banners and docs

Possible API shape:

const demo = createDemo({
  title: 'my-cli',
  theme: 'dark',
  steps: [
    { type: 'command', text: 'kidd init', delay: 500 },
    { type: 'output', text: '✔ Project initialized', delay: 200 },
  ],
});

await demo.toSvg('demo.svg');
await demo.toGif('demo.gif');

Open questions

• Package name: @kidd-cli/demo, @kidd-cli/recorder, or something else?
• Should this support theming (e.g. match terminal themes like Dracula, Catppuccin)?
• SVG-only first, or GIF support from day one?
• Should it integrate with the CLI build pipeline to auto-regenerate on changes?