feat(registry): imessage-chat — animated iMessage conversation block

[UveysUygul]

What

New registry block: imessage-chat (1080x1920, 10s) — an iMessage-style conversation for story-style social videos, sitting alongside the existing social overlays (instagram-follow, tiktok-follow, x-post, reddit-post, macos-notification). Chat-conversation videos are one of the most common faceless-shorts formats and the catalog had no chat block yet.

Features

• Data-driven dialogue — a single MESSAGES array (from: "in" | "out", text, start); agents can prompt new conversations without touching timeline logic
• Typing indicator before each incoming bubble — finite, seek-safe dot pulses (explicit tweens, no infinite repeats, no CSS animation)
• Spring bubble pops with iOS-style asymmetric radii and dark-mode palette that reads on any background footage
• Bottom-anchored auto-scroll — row heights measured after layout in the fixed render viewport, thread walks up as messages appear; masked window fade at the top
• Contact header pill (avatar initials + name) and a Delivered label under the last outgoing message

Validation

• hyperframes lint — 0 errors, 1 warning (google_fonts_import, same pattern as existing blocks like macos-notification)
• hyperframes validate --no-contrast — no console errors
• Rendered end-to-end (10.0s MP4) and snapshot-reviewed at 0.5s / 3.0s / 8.6s / 9.7s

Registry wiring

• registry/registry.json entry
• docs/catalog/blocks/imessage-chat.mdx via scripts/generate-catalog-pages.ts (only the new page committed — the script currently rewrites all sibling pages/indexes, so docs.json and catalog-index.json got surgical single-entry additions instead)

External contribution — preview MP4 will be attached in a comment below for the catalog image per the contributing flow.

🤖 Generated with Claude Code

[miguel-heygen]

@UveysUygul can you add a video of the block?

[UveysUygul]

@UveysUygul can you add a video of the block?

here

preview.mp4