From 283be292c17daa2df015ffefe9f94be8227a4e87 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miguel=20=C3=81ngel?= <miguel.sierra@heygen.com>
Date: Sat, 6 Jun 2026 20:37:33 +0000
Subject: [PATCH] feat(gsap): add innerText support to GSAP inspector for
 counter animations

Adds 'innerText' as a supported GSAP property so number roll-up animations
(count-up from 0 to some value) are visible and editable in the GSAP inspector
panel.

- Add 'innerText' to SUPPORTED_PROPS in gsapConstants.ts
- Add label 'Counter Value', tooltip, and step constraint (1) in
  gsapAnimationConstants.ts

The snap modifier that controls integer rounding is already preserved
verbatim via the EXTRAS_KEYS round-trip, so rounding behavior survives
edits without any additional UI changes.

Closes #1179
---
 packages/core/src/parsers/gsapConstants.ts                     | 2 ++
 .../studio/src/components/editor/gsapAnimationConstants.ts     | 3 +++
 2 files changed, 5 insertions(+)

diff --git a/packages/core/src/parsers/gsapConstants.ts b/packages/core/src/parsers/gsapConstants.ts
index 62feac775..902e32fce 100644
--- a/packages/core/src/parsers/gsapConstants.ts
+++ b/packages/core/src/parsers/gsapConstants.ts
@@ -41,6 +41,8 @@ export const SUPPORTED_PROPS = [
   // Filter & Clipping
   "filter",
   "clipPath",
+  // DOM content (number counters, text roll-ups)
+  "innerText",
 ];
 
 export const SUPPORTED_EASES = [
diff --git a/packages/studio/src/components/editor/gsapAnimationConstants.ts b/packages/studio/src/components/editor/gsapAnimationConstants.ts
index 70f9602a6..04a401d89 100644
--- a/packages/studio/src/components/editor/gsapAnimationConstants.ts
+++ b/packages/studio/src/components/editor/gsapAnimationConstants.ts
@@ -37,6 +37,7 @@ export const PROP_LABELS: Record<string, string> = {
   letterSpacing: "Tracking",
   skewX: "Skew X",
   skewY: "Skew Y",
+  innerText: "Counter Value",
 };
 
 export const PROP_UNITS: Record<string, string> = {
@@ -65,6 +66,7 @@ export const PROP_TOOLTIPS: Record<string, string> = {
   height: "Element height",
   autoAlpha: "Like opacity but hides element completely at 0",
   visibility: "Show or hide the element",
+  innerText: "End value for a number roll-up (the number it counts up/down to)",
 };
 
 export const EASE_LABELS: Record<string, string> = {
@@ -154,6 +156,7 @@ export const PROP_CONSTRAINTS: Record<string, { min?: number; max?: number; step
   y: { step: 1 },
   fontSize: { min: 1, step: 1 },
   letterSpacing: { step: 0.1 },
+  innerText: { step: 1 },
 };
 
 export function clampPropertyValue(prop: string, value: number): number {