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

feat(registry): add Code Animations catalog section (9 blocks, incl. GPU)

Browse Source 
Adds a Code Animations catalog section — 9 self-contained, installable blocks:
morph, snippet-flight, typing, diff, highlight, scroll (DOM/GSAP) and 3d-extrude,
shader-dissolve, particle-assemble (WebGL). Each block ships only its own effect and
renders deterministically (paused GSAP timeline seeked per frame, seeded RNG, no
render-time data fetch). Wires the catalog nav, registry.json, a new code-animation
Studio category, and preview assets.
This commit is contained in:
Miguel Ángel
2026-06-15 21:32:45 -04:00
committed by GitHub
parent 8f15e9f09b
commit 07030294e0
32 changed files with 8029 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/core/src/registry/types.ts
+4 -1
View File
@@ -182,7 +182,8 @@ export type BlockCategory =
| "scenes"
| "captions"
| "effects"
| "text-effects";
| "text-effects"
| "code-animation";
export interface BlockCategoryMeta {
id: BlockCategory;
@@ -192,6 +193,7 @@ export interface BlockCategoryMeta {
export const BLOCK_CATEGORIES: BlockCategoryMeta[] = [
{ id: "captions", label: "Captions", color: "cyan" },
{ id: "code-animation", label: "Code Animations", color: "emerald" },
{ id: "vfx", label: "VFX", color: "purple" },
{ id: "transitions", label: "Transitions", color: "blue" },
{ id: "effects", label: "Effects", color: "rose" },
@@ -205,6 +207,7 @@ export function resolveBlockCategory(tags: string[] | undefined): BlockCategory
if (!tags || tags.length === 0) return "scenes";
const set = new Set(tags);
if (set.has("captions") || set.has("caption-style")) return "captions";
if (set.has("code-animation")) return "code-animation";
if (set.has("transition")) return "transitions";
if (set.has("social") || set.has("overlay")) return "social";
if (set.has("data") || set.has("chart") || set.has("map")) return "data";
packages/studio/src/utils/blockCategories.ts
+2 -2
View File
@@ -1,11 +1,10 @@
import {
type BlockCategory,
type BlockCategoryMeta,
BLOCK_CATEGORIES,
resolveBlockCategory,
} from "@hyperframes/core/registry";
export type { BlockCategory, BlockCategoryMeta };
export type { BlockCategory };
export { BLOCK_CATEGORIES, resolveBlockCategory };
const COLOR_MAP: Record<BlockCategory, { bg: string; text: string; dot: string }> = {
@@ -17,6 +16,7 @@ const COLOR_MAP: Record<BlockCategory, { bg: string; text: string; dot: string }
captions: { bg: "bg-cyan-500/15", text: "text-cyan-400", dot: "bg-cyan-400" },
effects: { bg: "bg-rose-500/15", text: "text-rose-400", dot: "bg-rose-400" },
"text-effects": { bg: "bg-violet-500/15", text: "text-violet-400", dot: "bg-violet-400" },
"code-animation": { bg: "bg-emerald-500/15", text: "text-emerald-400", dot: "bg-emerald-400" },
};
export function getCategoryColors(category: BlockCategory) {