feat(registry): mk-* family — 11 minimal presentation-style items (7 blocks, 4 components)

docs/catalog/blocks/mk-callout-highlight.mdx

@@ -0,0 +1,44 @@
+---
+title: "Word-Sweep Highlight"
+description: "A sentence whose word-by-word emphasis is driven by a single scalar — tween it to sync the highlight with a voiceover"
+---
+
+# Word-Sweep Highlight
+
+A sentence whose word-by-word emphasis is driven by a single scalar — tween it to sync the highlight with a voiceover
+
+`typography` `karaoke` `captions` `minimal`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-callout-highlight.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-callout-highlight.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add mk-callout-highlight
+```
+
+</CodeGroup>
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 8s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `mk-callout-highlight.html` | `compositions/mk-callout-highlight.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div data-composition-id="mk-callout-highlight" data-composition-src="compositions/mk-callout-highlight.html" data-start="0" data-duration="8" data-track-index="1" data-width="1920" data-height="1080"></div>
+```

docs/catalog/blocks/mk-clone-wall-transition.mdx

@@ -0,0 +1,44 @@
+---
+title: "Text Clone Wall Transition"
+description: "Overlay transition: a tiled word wall covers the frame, inverts via difference blending, and clears — hard-cut the content beneath while covered"
+---
+
+# Text Clone Wall Transition
+
+Overlay transition: a tiled word wall covers the frame, inverts via difference blending, and clears — hard-cut the content beneath while covered
+
+`transition` `typography` `wipe`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-clone-wall-transition.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-clone-wall-transition.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add mk-clone-wall-transition
+```
+
+</CodeGroup>
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 2.4s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `mk-clone-wall-transition.html` | `compositions/mk-clone-wall-transition.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div data-composition-id="mk-clone-wall-transition" data-composition-src="compositions/mk-clone-wall-transition.html" data-start="0" data-duration="2.4" data-track-index="1" data-width="1920" data-height="1080"></div>
+```

docs/catalog/blocks/mk-line-graph.mdx

@@ -0,0 +1,44 @@
+---
+title: "Minimal Line Graph"
+description: "One or two SVG series draw on with dots popping and value labels riding the draw front; dim baseline axis, x-labels, color-dot legend"
+---
+
+# Minimal Line Graph
+
+One or two SVG series draw on with dots popping and value labels riding the draw front; dim baseline axis, x-labels, color-dot legend
+
+`data-viz` `chart` `graph` `minimal`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-line-graph.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-line-graph.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add mk-line-graph
+```
+
+</CodeGroup>
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 7s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `mk-line-graph.html` | `compositions/mk-line-graph.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div data-composition-id="mk-line-graph" data-composition-src="compositions/mk-line-graph.html" data-start="0" data-duration="7" data-track-index="1" data-width="1920" data-height="1080"></div>
+```

docs/catalog/blocks/mk-logo-sting.mdx

@@ -0,0 +1,44 @@
+---
+title: "Outline Logo Sting"
+description: "A hairline rounded-square outline draws on and the logo lands inside — image or text wordmark in the same shell"
+---
+
+# Outline Logo Sting
+
+A hairline rounded-square outline draws on and the logo lands inside — image or text wordmark in the same shell
+
+`logo` `sting` `minimal`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-logo-sting.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-logo-sting.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add mk-logo-sting
+```
+
+</CodeGroup>
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 3.5s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `mk-logo-sting.html` | `compositions/mk-logo-sting.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div data-composition-id="mk-logo-sting" data-composition-src="compositions/mk-logo-sting.html" data-start="0" data-duration="3.5" data-track-index="1" data-width="1920" data-height="1080"></div>
+```

docs/catalog/blocks/mk-placeholder-grid.mdx

@@ -0,0 +1,44 @@
+---
+title: "Rounded Media Grid"
+description: "N-up rounded-corner media grid (2-up, 3-up, 4-up, 3x2, hero plus two): per-cell inside-scale framing, staggered box-in entrance, slow settle"
+---
+
+# Rounded Media Grid
+
+N-up rounded-corner media grid (2-up, 3-up, 4-up, 3x2, hero plus two): per-cell inside-scale framing, staggered box-in entrance, slow settle
+
+`placeholder` `media` `grid` `minimal`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-placeholder-grid.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-placeholder-grid.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add mk-placeholder-grid
+```
+
+</CodeGroup>
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 8s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `mk-placeholder-grid.html` | `compositions/mk-placeholder-grid.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div data-composition-id="mk-placeholder-grid" data-composition-src="compositions/mk-placeholder-grid.html" data-start="0" data-duration="8" data-track-index="1" data-width="1920" data-height="1080"></div>
+```

docs/catalog/blocks/mk-progress-stat.mdx

@@ -0,0 +1,44 @@
+---
+title: "Count-Up Stat Card"
+description: "Big-numeral statistic with count-up, label, thin progress track filling to value/max, and caption; light and dark schemes"
+---
+
+# Count-Up Stat Card
+
+Big-numeral statistic with count-up, label, thin progress track filling to value/max, and caption; light and dark schemes
+
+`data-viz` `stat` `minimal`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-progress-stat.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-progress-stat.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add mk-progress-stat
+```
+
+</CodeGroup>
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 7s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `mk-progress-stat.html` | `compositions/mk-progress-stat.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div data-composition-id="mk-progress-stat" data-composition-src="compositions/mk-progress-stat.html" data-start="0" data-duration="7" data-track-index="1" data-width="1920" data-height="1080"></div>
+```

docs/catalog/blocks/mk-specs-list.mdx

@@ -0,0 +1,44 @@
+---
+title: "Specs Checklist"
+description: "Left-aligned specs/traits checklist over footage or a board: rows slide in staggered with an accent underline sweep; light and dark schemes"
+---
+
+# Specs Checklist
+
+Left-aligned specs/traits checklist over footage or a board: rows slide in staggered with an accent underline sweep; light and dark schemes
+
+`data-viz` `list` `minimal` `professional`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-specs-list.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/mk-specs-list.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add mk-specs-list
+```
+
+</CodeGroup>
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 8s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `mk-specs-list.html` | `compositions/mk-specs-list.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div data-composition-id="mk-specs-list" data-composition-src="compositions/mk-specs-list.html" data-start="0" data-duration="8" data-track-index="1" data-width="1920" data-height="1080"></div>
+```

docs/catalog/components/mk-cta-button.mdx

@@ -0,0 +1,38 @@
+---
+title: "Pill CTA Button"
+description: "Rounded call-to-action button with arrow, optional outline frame with shadow, frosted variant, and an arrow-nudge helper"
+---
+
+# Pill CTA Button
+
+Rounded call-to-action button with arrow, optional outline frame with shadow, frosted variant, and an arrow-nudge helper
+
+`cta` `button` `minimal` `overlay`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/mk-cta-button.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/mk-cta-button.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add mk-cta-button
+```
+
+</CodeGroup>
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Component |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `mk-cta-button.html` | `compositions/components/mk-cta-button.html` | hyperframes:snippet |
+
+## Usage
+
+Read the installed file and copy its CSS, markup pattern, and helper functions into your host composition — the parent timeline owns all timing. The file's header comment documents the wiring calls.

docs/catalog/components/mk-emphasis-type.mdx

@@ -0,0 +1,38 @@
+---
+title: "Background Emphasis Type"
+description: "Oversized low-contrast background word drifting slowly behind the subject — typography as texture"
+---
+
+# Background Emphasis Type
+
+Oversized low-contrast background word drifting slowly behind the subject — typography as texture
+
+`typography` `text-treatment` `minimal`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/mk-emphasis-type.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/mk-emphasis-type.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add mk-emphasis-type
+```
+
+</CodeGroup>
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Component |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `mk-emphasis-type.html` | `compositions/components/mk-emphasis-type.html` | hyperframes:snippet |
+
+## Usage
+
+Read the installed file and copy its CSS, markup pattern, and helper functions into your host composition — the parent timeline owns all timing. The file's header comment documents the wiring calls.