{ "$schema": "https://hyperframes.heygen.com/schema/registry-item.json", "name": "number-pop-in", "type": "hyperframes:component", "title": "Number Pop In", "description": "A transitions.dev-inspired digit pop-in with blur, lift, and staggered value reveal", "tags": ["video-primitive", "transition-primitive", "transitions-dev-port", "number", "pop"], "files": [ { "path": "number-pop-in.html", "target": "compositions/components/number-pop-in.html", "type": "hyperframes:snippet" } ], "variables": [ { "id": "value", "type": "string", "role": "content", "label": "Value", "description": "The number itself. Every character becomes its own span, so the stagger still lands character by character.", "default": "5.7" }, { "id": "unit", "type": "string", "role": "content", "label": "Unit", "description": "Small suffix printed after the number. Pass an empty string to drop it.", "default": "k" }, { "id": "lift", "type": "enum", "role": "motion", "label": "Lift", "description": "Scales the offset the timeline drives, so the characters cover a shorter or longer run in the same time.", "default": "standard", "options": [ { "value": "close", "label": "Close" }, { "value": "standard", "label": "Standard" }, { "value": "far", "label": "Far" } ] }, { "id": "tone", "type": "enum", "role": "style", "label": "Tone", "description": "Number colour: ink for light frames, paper for dark ones, accent rides --brand.", "default": "ink", "options": [ { "value": "ink", "label": "Ink" }, { "value": "paper", "label": "Paper" }, { "value": "accent", "label": "Accent" } ] } ], "preview": { "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/number-pop-in.png" } }