ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-07 01:56:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

Revert "feat(registry): the video-primitive moves, documented and customisable (#3090)" (#3162)

Browse Source 
This reverts commit 3b53bfd2f7.
This commit is contained in:
Miguel Ángel
2026-08-10 14:47:47 -04:00
committed by GitHub
parent 3b53bfd2f7
commit c86d4013f5
2328 changed files with 5906 additions and 458525 deletions
Download Patch File Download Diff File Expand all files Collapse all files
registry/components/grid-card-assemble/README.md
-58
View File
@@ -1,58 +0,0 @@
# grid-card-assemble
Layout / feature-tour primitive: N capability cards stagger-assemble into a
grid or a vertical list, then hold perfectly still. Each card is a real token
card: surface fill with a subtle top light, hairline border, contract radius,
generous padding, a thin-line icon that draws on as the card lands, a
wide-tracked mono label, and an optional one-line muted body. Entrances are a
fade plus a short slide directly into the card's own slot: no scatter from
center, no overshoot, a smooth long-tail settle.
Six generic thin-line icons (shield, chart, cloud, bolt, layers, doc) cycle
deterministically by item index and draw on with a getTotalLength dash inside
each card's settle window.
Authored at 4.5s with an elastic HOLD: the IN cascade is fixed, everything
after it is still frame until the (optional) exit.
## Variables
| id | type | default | notes |
| --------- | ---------------------------------- | -------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `items` | string | `Capture,Compose,Render,Publish` | Comma list of cards (3 to 12; extras past 12 are dropped). An entry formatted `Label: body text` renders a one-line muted body under the label; a plain entry is label-only. Body text must not contain commas. |
| `layout` | enum `grid` \| `list` | `grid` | Grid wraps by `columns`; list stacks horizontal icon-left rows in one column. |
| `columns` | number 0-4 | `0` | Grid only. `0` = auto: one row up to 3 items, then `ceil(sqrt(N))` (4 items form 2x2, 9 items form 3x3). |
| `cues` | string | `""` | Comma-separated per-item entrance times in seconds relative to mount start. Blank or invalid entries fall back to that item's default cascade slot: the cascade spreads so the last card lands near 60% of the authored duration (short mounts compress toward ~0.1s gaps). Values are clamped so every card lands before any exit begins. |
| `accent` | enum `green` \| `blue` \| `violet` | `green` | Icon stroke family: green rides `--brand`, blue `--accent`, violet `--accent-2`. |
| `exit` | enum `none` \| `fade` \| `up` | `none` | Frame roots own transitions; the default hold ends the film. |
## Content override (items slot)
The stage grid is the `[data-slot="items"]` element inside the template. A
fork that wants custom card content authors its own children there; when that
element already has children the script animates them as the cards instead of
generating capability cards from `items` (layout, `cues`, and `exit` still
apply, and `items` then only feeds the stage's aria-label). Any
`.gca-icon path` elements inside slotted cards still dash-draw as the card
lands.
## Usage
```html
<div
class="clip"
data-composition-id="grid-card-assemble"
data-composition-src="./components/grid-card-assemble.html"
data-variable-values='{"items":"Permissions: Scoped by your policies,Audit trail: Every action logged,Deploy: Your cloud or on-prem","accent":"blue"}'
data-start="0"
data-duration="4.5"
data-track-index="0"
></div>
```
Golden refs: scramble-reveal (token consumption), toggle-flip (mount-contract
structure).
Note: icon dash draws are driven through the `stroke-dashoffset` attribute
(GSAP attr plugin), not CSS style. Chrome under-invalidates the path region
for CSS dash changes, which leaves stale stroke fragments on reverse seeks.