hyperframes 0.6.54 → 0.6.55

package/dist/cli.js

@@ -50,7 +50,7 @@ var VERSION;
 var init_version = __esm({
   "src/version.ts"() {
     "use strict";
-    VERSION = true ? "0.6.54" : "0.0.0-dev";
+    VERSION = true ? "0.6.55" : "0.0.0-dev";
   }
 });
 
@@ -3094,18 +3094,18 @@ function serializeValue(value) {
 }
 function serializeObject(obj) {
   const entries2 = Object.entries(obj).map(([key2, value]) => {
-    const safeKey = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(key2) ? key2 : JSON.stringify(key2);
-    return `${safeKey}: ${serializeValue(value)}`;
+    const safeKey2 = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(key2) ? key2 : JSON.stringify(key2);
+    return `${safeKey2}: ${serializeValue(value)}`;
   });
   return `{ ${entries2.join(", ")} }`;
 }
 function serializeExtras(extras) {
   return Object.entries(extras).map(([key2, value]) => {
-    const safeKey = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(key2) ? key2 : JSON.stringify(key2);
-    return `${safeKey}: ${serializeValue(value)}`;
+    const safeKey2 = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(key2) ? key2 : JSON.stringify(key2);
+    return `${safeKey2}: ${serializeValue(value)}`;
   }).join(", ");
 }
-function getAnimationsForElement(animations, elementId) {
+function getAnimationsForElementId(animations, elementId) {
   const selector = `#${elementId}`;
   return animations.filter((a) => a.targetSelector === selector);
 }
@@ -35082,7 +35082,7 @@ __export(gsapParser_exports, {
   SUPPORTED_EASES: () => SUPPORTED_EASES,
   SUPPORTED_PROPS: () => SUPPORTED_PROPS,
   addAnimationToScript: () => addAnimationToScript,
-  getAnimationsForElement: () => getAnimationsForElement,
+  getAnimationsForElementId: () => getAnimationsForElementId,
   gsapAnimationsToKeyframes: () => gsapAnimationsToKeyframes,
   keyframesToGsapAnimations: () => keyframesToGsapAnimations,
   parseGsapScript: () => parseGsapScript,
@@ -35156,6 +35156,112 @@ function resolveNode(node, scope) {
 function extractLiteralValue(node, scope) {
   return resolveNode(node, scope);
 }
+function selectorFromQueryCall(node, scope) {
+  if (node?.type !== "CallExpression") return null;
+  const callee = node.callee;
+  if (callee?.type !== "MemberExpression" || callee.property?.type !== "Identifier") return null;
+  const method = callee.property.name;
+  const argValue = resolveNode(node.arguments?.[0], scope);
+  if (typeof argValue !== "string" || argValue.length === 0) return null;
+  if (QUERY_METHODS.has(method) || method === "toArray") return argValue;
+  if (method === "getElementById") return `#${argValue}`;
+  return null;
+}
+function enclosingScopeNode(path2) {
+  let p2 = path2?.parentPath;
+  while (p2) {
+    if (SCOPE_NODE_TYPES.has(p2.node?.type)) return p2.node;
+    p2 = p2.parentPath;
+  }
+  return null;
+}
+function scopeChainOf(path2) {
+  const chain = [];
+  let p2 = path2;
+  while (p2) {
+    if (SCOPE_NODE_TYPES.has(p2.node?.type)) chain.push(p2.node);
+    p2 = p2.parentPath;
+  }
+  return chain;
+}
+function addBinding(bindings, scopeNode, name, selector) {
+  let scoped = bindings.get(scopeNode);
+  if (!scoped) {
+    scoped = /* @__PURE__ */ new Map();
+    bindings.set(scopeNode, scoped);
+  }
+  if (!scoped.has(name)) scoped.set(name, selector);
+}
+function collectTargetBindings(ast, scope) {
+  const bindings = /* @__PURE__ */ new Map();
+  recast.types.visit(ast, {
+    visitVariableDeclarator(path2) {
+      const name = path2.node.id?.name;
+      const selector = selectorFromQueryCall(path2.node.init, scope);
+      if (name && selector !== null) addBinding(bindings, enclosingScopeNode(path2), name, selector);
+      this.traverse(path2);
+    },
+    visitAssignmentExpression(path2) {
+      const left = path2.node.left;
+      const selector = selectorFromQueryCall(path2.node.right, scope);
+      if (left?.type === "Identifier" && selector !== null) {
+        addBinding(bindings, enclosingScopeNode(path2), left.name, selector);
+      }
+      this.traverse(path2);
+    }
+  });
+  recast.types.visit(ast, {
+    visitCallExpression(path2) {
+      const node = path2.node;
+      const callee = node.callee;
+      if (callee?.type === "MemberExpression" && callee.property?.type === "Identifier" && ITERATION_METHODS.has(callee.property.name)) {
+        const collectionSelector = resolveCollectionSelector(callee.object, path2, scope, bindings);
+        const fn = node.arguments?.[0];
+        const param = fn?.params?.[0];
+        if (collectionSelector && param?.type === "Identifier" && isFunctionNode(fn)) {
+          addBinding(bindings, fn, param.name, collectionSelector);
+        }
+      }
+      this.traverse(path2);
+    }
+  });
+  return bindings;
+}
+function isFunctionNode(node) {
+  return node?.type === "ArrowFunctionExpression" || node?.type === "FunctionExpression" || node?.type === "FunctionDeclaration";
+}
+function resolveCollectionSelector(node, callPath, scope, bindings) {
+  if (node?.type === "Identifier") return lookupBinding(node.name, callPath, bindings);
+  if (node?.type === "CallExpression") return selectorFromQueryCall(node, scope);
+  return null;
+}
+function lookupBinding(name, path2, bindings) {
+  for (const scopeNode of scopeChainOf(path2)) {
+    const selector = bindings.get(scopeNode)?.get(name);
+    if (selector !== void 0) return selector;
+  }
+  return null;
+}
+function resolveTargetSelector(node, path2, scope, bindings) {
+  if (!node) return null;
+  if (node.type === "StringLiteral" || node.type === "Literal") {
+    return typeof node.value === "string" ? node.value : null;
+  }
+  if (node.type === "Identifier") {
+    return lookupBinding(node.name, path2, bindings);
+  }
+  if (node.type === "CallExpression") {
+    return selectorFromQueryCall(node, scope);
+  }
+  if (node.type === "ArrayExpression") {
+    const parts = node.elements.map((el) => resolveTargetSelector(el, path2, scope, bindings)).filter((s2) => typeof s2 === "string" && s2.length > 0);
+    return parts.length > 0 ? parts.join(", ") : null;
+  }
+  if (node.type === "MemberExpression" && node.object?.type === "Identifier") {
+    return lookupBinding(node.object.name, path2, bindings);
+  }
+  return null;
+}
 function objectExpressionToRecord(node, scope) {
   const result = {};
   if (node?.type !== "ObjectExpression") return result;
@@ -35199,13 +35305,20 @@ function findTimelineVar(ast) {
   });
   return { timelineVar, timelineCount };
 }
-function findAllTweenCalls(ast, timelineVar) {
+function isTimelineRootedCall(callNode, timelineVar) {
+  let obj = callNode.callee?.object;
+  while (obj?.type === "CallExpression") {
+    obj = obj.callee?.object;
+  }
+  return obj?.type === "Identifier" && obj.name === timelineVar;
+}
+function findAllTweenCalls(ast, timelineVar, scope, targetBindings) {
   const results = [];
   recast.types.visit(ast, {
     visitCallExpression(path2) {
       const node = path2.node;
       const callee = node.callee;
-      if (callee?.type === "MemberExpression" && callee.object?.type === "Identifier" && callee.object.name === timelineVar && callee.property?.type === "Identifier") {
+      if (callee?.type === "MemberExpression" && callee.property?.type === "Identifier" && isTimelineRootedCall(node, timelineVar)) {
         const method = callee.property.name;
         if (!GSAP_METHODS.has(method)) {
           this.traverse(path2);
@@ -35216,8 +35329,7 @@ function findAllTweenCalls(ast, timelineVar) {
           this.traverse(path2);
           return;
         }
-        const selectorArg = args[0];
-        const selectorValue = selectorArg.type === "StringLiteral" || selectorArg.type === "Literal" ? String(selectorArg.value) : null;
+        const selectorValue = resolveTargetSelector(args[0], path2, scope, targetBindings);
         if (!selectorValue) {
           this.traverse(path2);
           return;
@@ -35316,14 +35428,25 @@ function assignStableIds(anims) {
     return { ...anim, id };
   });
 }
+function parseGsapAst(script) {
+  const ast = parseScript(script);
+  const scope = collectScopeBindings(ast);
+  const targetBindings = collectTargetBindings(ast, scope);
+  const detection = findTimelineVar(ast);
+  const timelineVar = detection.timelineVar ?? "tl";
+  const calls = findAllTweenCalls(ast, timelineVar, scope, targetBindings);
+  const animations = assignStableIds(calls.map((call) => tweenCallToAnimation(call, scope)));
+  const located = animations.map((animation, i2) => ({
+    id: animation.id,
+    call: calls[i2],
+    animation
+  }));
+  return { ast, scope, timelineVar, detection, located };
+}
 function parseGsapScript(script) {
   try {
-    const ast = parseScript(script);
-    const scope = collectScopeBindings(ast);
-    const detection = findTimelineVar(ast);
-    const timelineVar = detection.timelineVar ?? "tl";
-    const calls = findAllTweenCalls(ast, timelineVar);
-    const animations = assignStableIds(calls.map((call) => tweenCallToAnimation(call, scope)));
+    const { detection, timelineVar, located } = parseGsapAst(script);
+    const animations = located.map((l) => l.animation);
     const timelineMatch = script.match(
       new RegExp(
         `^[\\s\\S]*?(?:const|let|var)\\s+${timelineVar}\\s*=\\s*gsap\\.timeline\\s*\\([^)]*\\)\\s*;?`
@@ -35348,52 +35471,203 @@ function parseGsapScript(script) {
     return { animations: [], timelineVar: "tl", preamble: "", postamble: "" };
   }
 }
-function isParseFailure(parsed) {
-  return parsed.animations.length === 0 && !parsed.preamble;
+function valueToCode(value) {
+  if (typeof value === "string" && value.startsWith("__raw:")) return value.slice(6);
+  if (typeof value === "string") return JSON.stringify(value);
+  return String(value);
 }
-function updateAnimationInScript(script, animationId, updates) {
-  const parsed = parseGsapScript(script);
-  if (isParseFailure(parsed)) return script;
-  const updated = parsed.animations.map(
-    (anim) => anim.id === animationId ? { ...anim, ...updates } : anim
+function safeKey(key2) {
+  return /^[A-Za-z_$][\w$]*$/.test(key2) ? key2 : JSON.stringify(key2);
+}
+function parseExpr(code) {
+  return parseScript(`__hf__ = ${code};`).program.body[0].expression.right;
+}
+function propKeyName(prop2) {
+  return prop2?.key?.name ?? prop2?.key?.value;
+}
+function isObjectProperty(prop2) {
+  return prop2?.type === "ObjectProperty" || prop2?.type === "Property";
+}
+function isEditablePropertyKey(key2) {
+  return !BUILTIN_VAR_KEYS.has(key2) && !DROPPED_VAR_KEYS.has(key2) && !EXTRAS_KEYS.has(key2);
+}
+function makeObjectProperty(key2, value) {
+  const obj = parseExpr(`{ ${safeKey(key2)}: ${valueToCode(value)} }`);
+  return obj.properties[0];
+}
+function setVarsKey(varsArg, key2, value) {
+  if (varsArg?.type !== "ObjectExpression") return;
+  const existing = varsArg.properties.find(
+    (p2) => isObjectProperty(p2) && propKeyName(p2) === key2
   );
-  return serializeGsapAnimations(updated, parsed.timelineVar, {
-    preamble: parsed.preamble,
-    postamble: parsed.postamble
+  if (existing) {
+    existing.value = parseExpr(valueToCode(value));
+  } else {
+    varsArg.properties.push(makeObjectProperty(key2, value));
+  }
+}
+function reconcileEditableProperties(varsArg, newProps) {
+  if (varsArg?.type !== "ObjectExpression") return;
+  varsArg.properties = varsArg.properties.filter((p2) => {
+    if (!isObjectProperty(p2)) return true;
+    const key2 = propKeyName(p2);
+    if (typeof key2 !== "string") return true;
+    if (!isEditablePropertyKey(key2)) return true;
+    return key2 in newProps;
   });
+  for (const [key2, value] of Object.entries(newProps)) {
+    setVarsKey(varsArg, key2, value);
+  }
+}
+function applyUpdatesToCall(call, updates) {
+  if (updates.properties) reconcileEditableProperties(call.varsArg, updates.properties);
+  if (updates.fromProperties && call.method === "fromTo") {
+    reconcileEditableProperties(call.fromArg, updates.fromProperties);
+  }
+  if (updates.duration !== void 0) setVarsKey(call.varsArg, "duration", updates.duration);
+  if (updates.ease !== void 0) setVarsKey(call.varsArg, "ease", updates.ease);
+  if (updates.position !== void 0) {
+    const posIdx = call.method === "fromTo" ? 3 : 2;
+    call.node.arguments[posIdx] = parseExpr(valueToCode(updates.position));
+  }
+}
+function findStatementPath(path2) {
+  let p2 = path2;
+  while (p2) {
+    if (p2.node?.type === "ExpressionStatement") return p2;
+    p2 = p2.parentPath;
+  }
+  return null;
+}
+function buildTweenStatementCode(timelineVar, anim) {
+  const selector = JSON.stringify(anim.targetSelector);
+  const props = { ...anim.properties };
+  if (anim.method !== "set" && anim.duration !== void 0) props.duration = anim.duration;
+  if (anim.ease) props.ease = anim.ease;
+  const entries2 = Object.entries(props).map(([k2, v2]) => `${safeKey(k2)}: ${valueToCode(v2)}`);
+  if (anim.extras) {
+    for (const [k2, v2] of Object.entries(anim.extras)) {
+      entries2.push(`${safeKey(k2)}: ${valueToCode(v2)}`);
+    }
+  }
+  const objCode = `{ ${entries2.join(", ")} }`;
+  const posCode = valueToCode(
+    typeof anim.position === "number" ? anim.position : anim.position ?? 0
+  );
+  if (anim.method === "fromTo") {
+    const fromEntries = Object.entries(anim.fromProperties ?? {}).map(
+      ([k2, v2]) => `${safeKey(k2)}: ${valueToCode(v2)}`
+    );
+    const fromCode = `{ ${fromEntries.join(", ")} }`;
+    return `${timelineVar}.fromTo(${selector}, ${fromCode}, ${objCode}, ${posCode});`;
+  }
+  return `${timelineVar}.${anim.method}(${selector}, ${objCode}, ${posCode});`;
+}
+function updateAnimationInScript(script, animationId, updates) {
+  let parsed;
+  try {
+    parsed = parseGsapAst(script);
+  } catch (e3) {
+    console.warn("[gsap-parser] updateAnimationInScript parse failed:", e3);
+    return script;
+  }
+  const target = parsed.located.find((l) => l.id === animationId);
+  if (!target) return script;
+  applyUpdatesToCall(target.call, updates);
+  return recast.print(parsed.ast).code;
 }
 function addAnimationToScript(script, animation) {
-  const parsed = parseGsapScript(script);
-  if (isParseFailure(parsed)) return { script, id: "" };
+  let parsed;
+  try {
+    parsed = parseGsapAst(script);
+  } catch (e3) {
+    console.warn("[gsap-parser] addAnimationToScript parse failed:", e3);
+    return { script, id: "" };
+  }
+  if (parsed.located.length === 0 && parsed.detection.timelineVar === null) {
+    return { script, id: "" };
+  }
   const id = `anim-${Date.now()}`;
-  const newAnim = { ...animation, id };
-  const allAnimations = [...parsed.animations, newAnim];
-  return {
-    script: serializeGsapAnimations(allAnimations, parsed.timelineVar, {
-      preamble: parsed.preamble,
-      postamble: parsed.postamble
-    }),
-    id
-  };
+  const statementCode = buildTweenStatementCode(parsed.timelineVar, animation);
+  const newStatement = parseScript(statementCode).program.body[0];
+  const lastCall = parsed.located[parsed.located.length - 1]?.call;
+  const anchorPath = lastCall ? findStatementPath(lastCall.path) : findTimelineDeclarationPath(parsed.ast, parsed.timelineVar);
+  if (anchorPath) {
+    anchorPath.insertAfter(newStatement);
+  } else {
+    parsed.ast.program.body.push(newStatement);
+  }
+  return { script: recast.print(parsed.ast).code, id };
 }
-function removeAnimationFromScript(script, animationId) {
-  const parsed = parseGsapScript(script);
-  if (isParseFailure(parsed)) return script;
-  const filtered = parsed.animations.filter((a) => a.id !== animationId);
-  return serializeGsapAnimations(filtered, parsed.timelineVar, {
-    preamble: parsed.preamble,
-    postamble: parsed.postamble
+function findTimelineDeclarationPath(ast, timelineVar) {
+  let found = null;
+  recast.types.visit(ast, {
+    visitVariableDeclaration(path2) {
+      if (found) return false;
+      for (const decl of path2.node.declarations ?? []) {
+        if (decl.id?.name === timelineVar && isGsapTimelineCall(decl.init)) {
+          found = path2;
+          return false;
+        }
+      }
+      this.traverse(path2);
+    }
+  });
+  return found;
+}
+function findChainParentCall(stmtNode, targetNode) {
+  let found = null;
+  recast.types.visit(stmtNode, {
+    visitCallExpression(p2) {
+      if (found) return false;
+      if (p2.node.callee?.type === "MemberExpression" && p2.node.callee.object === targetNode) {
+        found = p2.node;
+        return false;
+      }
+      this.traverse(p2);
+    }
   });
+  return found;
+}
+function removeAnimationFromScript(script, animationId) {
+  let parsed;
+  try {
+    parsed = parseGsapAst(script);
+  } catch (e3) {
+    console.warn("[gsap-parser] removeAnimationFromScript parse failed:", e3);
+    return script;
+  }
+  const target = parsed.located.find((l) => l.id === animationId);
+  if (!target) return script;
+  const node = target.call.node;
+  const stmtPath = findStatementPath(target.call.path);
+  if (!stmtPath) return script;
+  const parentCall = findChainParentCall(stmtPath.node, node);
+  if (parentCall) {
+    parentCall.callee.object = node.callee.object;
+  } else if (node.callee?.object?.type === "CallExpression") {
+    stmtPath.node.expression = node.callee.object;
+  } else {
+    stmtPath.prune();
+  }
+  return recast.print(parsed.ast).code;
 }
-var recast, import_parser, GSAP_METHODS, BUILTIN_VAR_KEYS, DROPPED_VAR_KEYS, EXTRAS_KEYS;
+var recast, import_parser, GSAP_METHODS, QUERY_METHODS, ITERATION_METHODS, SCOPE_NODE_TYPES, BUILTIN_VAR_KEYS, DROPPED_VAR_KEYS, EXTRAS_KEYS;
 var init_gsapParser = __esm({
   "../core/src/parsers/gsapParser.ts"() {
     "use strict";
     recast = __toESM(require_main2(), 1);
     import_parser = __toESM(require_lib(), 1);
     init_gsapSerialize();
-    init_gsapSerialize();
     GSAP_METHODS = /* @__PURE__ */ new Set(["set", "to", "from", "fromTo"]);
+    QUERY_METHODS = /* @__PURE__ */ new Set(["querySelector", "querySelectorAll"]);
+    ITERATION_METHODS = /* @__PURE__ */ new Set(["forEach", "map"]);
+    SCOPE_NODE_TYPES = /* @__PURE__ */ new Set([
+      "Program",
+      "FunctionDeclaration",
+      "FunctionExpression",
+      "ArrowFunctionExpression"
+    ]);
     BUILTIN_VAR_KEYS = /* @__PURE__ */ new Set(["duration", "ease", "delay"]);
     DROPPED_VAR_KEYS = /* @__PURE__ */ new Set(["keyframes", "onComplete", "onStart", "onUpdate", "onRepeat"]);
     EXTRAS_KEYS = /* @__PURE__ */ new Set([
@@ -37086,122 +37360,51 @@ function readRegisteredTimelineCompositionId(script) {
   const match = script.match(WINDOW_TIMELINE_ASSIGN_PATTERN);
   return match?.[1] || null;
 }
+function unwrapRaw(value) {
+  if (typeof value === "number") return value;
+  if (typeof value !== "string") return void 0;
+  const code = value.startsWith("__raw:") ? value.slice(6) : value;
+  return code.replace(/^\s*["']|["']\s*$/g, "");
+}
+function extrasNumber(value) {
+  const unwrapped = unwrapRaw(value);
+  const numeric = typeof unwrapped === "number" ? unwrapped : Number(unwrapped);
+  return Number.isFinite(numeric) ? numeric : 0;
+}
+function synthesizeWindowRaw(timelineVar, anim) {
+  const entries2 = Object.entries(anim.properties).map(([k2, v2]) => {
+    if (typeof v2 === "string" && v2.startsWith("__raw:")) return `${k2}: ${v2.slice(6)}`;
+    return `${k2}: ${typeof v2 === "string" ? JSON.stringify(v2) : v2}`;
+  });
+  if (anim.duration !== void 0) entries2.push(`duration: ${anim.duration}`);
+  if (anim.ease) entries2.push(`ease: ${JSON.stringify(anim.ease)}`);
+  const pos = typeof anim.position === "number" ? anim.position : JSON.stringify(anim.position);
+  return `${timelineVar}.${anim.method}("${anim.targetSelector}", { ${entries2.join(", ")} }, ${pos})`;
+}
 async function extractGsapWindows(script) {
   if (!/gsap\.timeline/.test(script)) return [];
   const parseGsapScript2 = await loadParseGsapScript();
   const parsed = parseGsapScript2(script);
   if (parsed.animations.length === 0) return [];
   const windows = [];
-  const timelineVar = parsed.timelineVar;
-  const methodPattern = new RegExp(
-    `${timelineVar}\\.(set|to|from|fromTo)\\s*\\(([^)]+(?:\\{[^}]*\\}[^)]*)+)\\)`,
-    "g"
-  );
-  let match;
-  let index = 0;
-  while ((match = methodPattern.exec(script)) !== null && index < parsed.animations.length) {
-    const raw = match[0];
-    const args = match[2] ?? "";
-    if (!/^\s*["']/.test(args)) continue;
-    const meta = parseGsapWindowMeta(match[1] ?? "", args);
-    const animation = parsed.animations[index];
-    index += 1;
-    if (!animation) continue;
+  for (const animation of parsed.animations) {
     if (typeof animation.position !== "number") continue;
+    const repeat = extrasNumber(animation.extras?.repeat);
+    const cycleCount = repeat > 0 ? repeat + 1 : 1;
+    const effectiveDuration = animation.method === "set" ? 0 : (animation.duration ?? 0) * cycleCount;
     windows.push({
       targetSelector: animation.targetSelector,
       position: animation.position,
-      end: animation.position + meta.effectiveDuration,
-      properties: meta.properties.length > 0 ? meta.properties : Object.keys(animation.properties),
-      propertyValues: meta.propertyValues,
-      overwriteAuto: meta.overwriteAuto,
-      method: match[1] ?? "to",
-      raw
+      end: animation.position + effectiveDuration,
+      properties: Object.keys(animation.properties),
+      propertyValues: animation.properties,
+      overwriteAuto: unwrapRaw(animation.extras?.overwrite) === "auto",
+      method: animation.method,
+      raw: synthesizeWindowRaw(parsed.timelineVar, animation)
     });
   }
   return windows;
 }
-function parseGsapWindowMeta(method, argsStr) {
-  const emptyMeta = {
-    effectiveDuration: 0,
-    properties: [],
-    propertyValues: {},
-    overwriteAuto: false
-  };
-  const selectorMatch = argsStr.match(/^\s*["']([^"']+)["']\s*,/);
-  if (!selectorMatch) return emptyMeta;
-  const afterSelector = argsStr.slice(selectorMatch[0].length);
-  let properties = {};
-  let fromProperties = {};
-  if (method === "fromTo") {
-    const firstBrace = afterSelector.indexOf("{");
-    const firstEnd = findMatchingBrace(afterSelector, firstBrace);
-    if (firstBrace !== -1 && firstEnd !== -1) {
-      fromProperties = parseLooseObjectLiteral(afterSelector.slice(firstBrace, firstEnd + 1));
-      const secondPart = afterSelector.slice(firstEnd + 1);
-      const secondBrace = secondPart.indexOf("{");
-      const secondEnd = findMatchingBrace(secondPart, secondBrace);
-      if (secondBrace !== -1 && secondEnd !== -1) {
-        properties = parseLooseObjectLiteral(secondPart.slice(secondBrace, secondEnd + 1));
-      }
-    }
-  } else {
-    const braceStart = afterSelector.indexOf("{");
-    const braceEnd = findMatchingBrace(afterSelector, braceStart);
-    if (braceStart !== -1 && braceEnd !== -1) {
-      properties = parseLooseObjectLiteral(afterSelector.slice(braceStart, braceEnd + 1));
-    }
-  }
-  const duration = numberValue(properties.duration) || 0;
-  const repeat = numberValue(properties.repeat) || 0;
-  const cycleCount = repeat > 0 ? repeat + 1 : 1;
-  const effectiveDuration = duration * cycleCount;
-  const overwriteAuto = stringValue(properties.overwrite) === "auto";
-  const propertyNames = /* @__PURE__ */ new Set();
-  for (const key2 of Object.keys(fromProperties)) {
-    if (!META_GSAP_KEYS.has(key2)) propertyNames.add(key2);
-  }
-  for (const key2 of Object.keys(properties)) {
-    if (!META_GSAP_KEYS.has(key2)) propertyNames.add(key2);
-  }
-  return {
-    effectiveDuration: method === "set" ? 0 : effectiveDuration,
-    properties: [...propertyNames],
-    propertyValues: properties,
-    overwriteAuto
-  };
-}
-function parseLooseObjectLiteral(source) {
-  const result = {};
-  const cleaned = source.replace(/^\{|\}$/g, "").trim();
-  if (!cleaned) return result;
-  const propertyPattern = /(\w+)\s*:\s*("[^"]*"|'[^']*'|true|false|-?[\d.]+|[a-zA-Z_][\w.]*)/g;
-  let match;
-  while ((match = propertyPattern.exec(cleaned)) !== null) {
-    const key2 = match[1];
-    const rawValue = match[2];
-    if (!key2 || rawValue == null) continue;
-    if (rawValue.startsWith('"') && rawValue.endsWith('"') || rawValue.startsWith("'") && rawValue.endsWith("'")) {
-      result[key2] = rawValue.slice(1, -1);
-      continue;
-    }
-    const numeric = Number(rawValue);
-    result[key2] = Number.isFinite(numeric) ? numeric : rawValue;
-  }
-  return result;
-}
-function findMatchingBrace(source, startIndex) {
-  if (startIndex < 0) return -1;
-  let depth = 0;
-  for (let i2 = startIndex; i2 < source.length; i2++) {
-    if (source[i2] === "{") depth += 1;
-    else if (source[i2] === "}") {
-      depth -= 1;
-      if (depth === 0) return i2;
-    }
-  }
-  return -1;
-}
 function numberValue(value) {
   if (typeof value === "number") return value;
   if (typeof value === "string" && value.trim()) {
@@ -37341,12 +37544,11 @@ function cssTransformToGsapProps(cssTransform) {
   }
   return parts.length > 0 ? parts.join(", ") : null;
 }
-var META_GSAP_KEYS, SCENE_BOUNDARY_EPSILON_SECONDS, gsapRules;
+var SCENE_BOUNDARY_EPSILON_SECONDS, gsapRules;
 var init_gsap = __esm({
   "../core/src/lint/rules/gsap.ts"() {
     "use strict";
     init_utils2();
-    META_GSAP_KEYS = /* @__PURE__ */ new Set(["duration", "ease", "repeat", "yoyo", "overwrite", "delay"]);
     SCENE_BOUNDARY_EPSILON_SECONDS = 0.05;
     gsapRules = [
       // overlapping_gsap_tweens + gsap_animates_clip_element + unscoped_gsap_selector
@@ -42355,7 +42557,7 @@ __export(src_exports, {
   generateGsapTimelineScript: () => generateGsapTimelineScript,
   generateHyperframesHtml: () => generateHyperframesHtml,
   generateHyperframesStyles: () => generateHyperframesStyles,
-  getAnimationsForElement: () => getAnimationsForElement,
+  getAnimationsForElementId: () => getAnimationsForElementId,
   getDefaultStageZoom: () => getDefaultStageZoom,
   getHyperframeRuntimeScript: () => getHyperframeRuntimeScript,
   getStageStyles: () => getStageStyles,
@@ -58183,7 +58385,12 @@ function updateReferences(projectDir, oldPath, newPath) {
 }
 function extractGsapScriptBlock(html) {
   const { document: document2 } = parseHTML(html);
-  const scripts = document2.querySelectorAll("script:not([src])");
+  const scripts = [
+    ...document2.querySelectorAll("script:not([src])"),
+    ...Array.from(document2.querySelectorAll("template")).flatMap(
+      (tmpl) => Array.from(tmpl.querySelectorAll("script:not([src])"))
+    )
+  ];
   for (const script of scripts) {
     const content = script.textContent || "";
     if (content.includes("gsap.timeline") || content.includes(".set(") || content.includes(".to(")) {
@@ -71428,9 +71635,9 @@ function collectExternalAssets(html, projectDir) {
       return null;
     }
     if (!existsSync35(absPath)) return null;
-    const safeKey = toExternalAssetKey(absPath);
-    externalAssets.set(safeKey, absPath);
-    return safeKey;
+    const safeKey2 = toExternalAssetKey(absPath);
+    externalAssets.set(safeKey2, absPath);
+    return safeKey2;
   }
   const { document: document2 } = parseHTML(html);
   for (const el of document2.querySelectorAll("[src], [href]")) {

package/dist/studio/assets/{index-CKJCBFsG.js → index-D6EwK2hA.js}

@@ -92,7 +92,7 @@ ${c}
 ${r}
 </style>`;return/<\/head>/i.test(t)?t.replace(/<\/head>/i,`  ${o}
   </head>`):`${o}
-${t}`}function KZ({activeCompPath:t,previewIframeRef:e,domEditSelection:n,applyDomSelection:r,refreshDomEditSelectionFromPreview:i,buildDomSelectionFromTarget:l,persistDomEditOperations:o,resolveImportedFontAsset:c}){const f=d.useRef(0),h=d.useCallback(async(k,T)=>{if(!n||eZ(k)||!n.capabilities.canEditStyles)return;const E=k==="font-family"?c(T):null,C=e.current,M=C==null?void 0:C.contentDocument;if(M){const Z=Bn(M,n,t);Z&&(Z.style.setProperty(k,Bm(k,T)),k==="font-family"&&(d3(M,T),E&&h3(M,E)),k==="background-image"&&e3(T)&&(Z.style.setProperty("background-position","center"),Z.style.setProperty("background-repeat","no-repeat"),Z.style.setProperty("background-size","contain")))}const P=[d1(k,Bm(k,T))];k==="background-image"&&e3(T)&&P.push(d1("background-position","center"),d1("background-repeat","no-repeat"),d1("background-size","contain"));const $=k!=="z-index";try{await o(n,P,{label:"Edit layer style",skipRefresh:$,prepareContent:E?(Z,V)=>m3(Z,E,V):void 0})}catch(Z){console.warn("[Studio] Style persist failed:",Z instanceof Error?Z.message:Z)}i(n)},[t,n,o,i,c,e]),g=d.useCallback(async(k,T)=>{if(!n)return;const E=e.current,C=E==null?void 0:E.contentDocument;if(C){const P=Bn(C,n,t);P&&P.setAttribute(`data-${k}`,T)}const M={type:"attribute",property:k,value:T};try{await o(n,[M],{label:`Edit ${k.replace(/-/g," ")}`,coalesceKey:`attr:${k}:${Ir(n)}`,skipRefresh:!1})}catch(P){console.warn("[Studio] Attribute persist failed:",P instanceof Error?P.message:P)}i(n)},[t,n,o,i,e]),O=d.useCallback(async(k,T)=>{if(!n)return;const E=e.current,C=E==null?void 0:E.contentDocument;if(C){const P=Bn(C,n,t);P&&(T===null||T===""||T==="false"?P.removeAttribute(k):P.setAttribute(k,T))}const M={type:"html-attribute",property:k,value:T};try{await o(n,[M],{label:`Edit ${k}`,coalesceKey:`html-attr:${k}:${Ir(n)}`,skipRefresh:!1})}catch(P){console.warn("[Studio] HTML attribute persist failed:",P instanceof Error?P.message:P)}i(n)},[t,n,o,i,e]),x=d.useCallback(async(k,T)=>{if(!n||!t8(n))return;const E=f.current+1;f.current=E;const C=n.textFields.length>0?n.textFields.map(Z=>Z.key===T?{...Z,value:k}:Z):[],M=C.length>1||C.some(Z=>Z.source==="child")?o3(C):k,P=e.current,$=P==null?void 0:P.contentDocument;if($){const Z=Bn($,n,t);Z&&(C.length>1||C.some(V=>V.source==="child")?Z.innerHTML=M:Z.textContent=k)}if(await o(n,[c3(M)],{label:"Edit text",skipRefresh:!0,shouldSave:()=>f.current===E}),f.current===E&&$){const Z=Bn($,n,t);if(Z){const V=await l(Z);V&&r(V,{revealPanel:!1,preserveGroup:!0})}}},[t,r,l,n,o,e]),b=d.useCallback(async(k,T,E)=>{var Z;const C=T.length>1||T.some(V=>V.source==="child")?o3(T):((Z=T[0])==null?void 0:Z.value)??"",M=e.current,P=M==null?void 0:M.contentDocument;if(P){const V=Bn(P,k,t);V&&(T.length>1||T.some(z=>z.source==="child")?V.innerHTML=C:V.textContent=C)}const $=(E==null?void 0:E.importedFont)??null;if(await o(k,[c3(C)],{label:"Edit text",skipRefresh:!0,prepareContent:$?(V,z)=>m3(V,$,z):void 0}),P){const V=Bn(P,k,t);if(V){const z=await l(V);z&&r(z,{revealPanel:!1,preserveGroup:!0})}}},[t,r,l,o,e]),S=d.useCallback(async(k,T,E)=>{var Z;if(!n)return;const C=n.textFields.find(V=>V.key===k);if(!C)return;if(C.source==="self"){await h(T,E);return}const M=Bm(T,E),P=T==="font-family"?c(E):null;if(T==="font-family"){const V=(Z=e.current)==null?void 0:Z.contentDocument;V&&(d3(V,M),P&&h3(V,P))}const $=n.textFields.map(V=>V.key===k?{...V,inlineStyles:{...V.inlineStyles,[T]:M},computedStyles:{...V.computedStyles,[T]:M}}:V);await b(n,$,{importedFont:P})},[b,n,h,c,e]),w=d.useCallback(async k=>{if(!n||!n.textFields.some(P=>P.source==="child"))return null;const T=n.textFields.findIndex(P=>P.key===k),E=n.textFields[T>=0?T:0]??n.textFields[0],C=$Z(E),M=[...n.textFields];return M.splice(T>=0?T+1:M.length,0,C),await b(n,M),C.key},[b,n]),A=d.useCallback(async k=>{if(!n)return;const T=n.textFields.find(C=>C.key===k);if(!T)return;if(T.source==="self"){await x("",k);return}const E=n.textFields.filter(C=>C.key!==k);await b(n,E)},[b,n,x]);return{handleDomStyleCommit:h,handleDomAttributeCommit:g,handleDomHtmlAttributeCommit:O,handleDomTextCommit:x,commitDomTextFields:b,handleDomTextFieldStyleCommit:S,handleDomAddTextField:w,handleDomRemoveTextField:A}}function JZ({activeCompPath:t,previewIframeRef:e,showToast:n,queueDomEditSave:r,writeProjectFile:i,domEditSaveTimestampRef:l,editHistory:o,fileTree:c,importedFontAssetsRef:f,projectId:h,projectIdRef:g,reloadPreview:O,domEditSelection:x,applyDomSelection:b,clearDomSelection:S,refreshDomEditSelectionFromPreview:w,buildDomSelectionFromTarget:A}){const k=d.useCallback(_=>{const Q=GZ(_);if(!Q)return null;const R=f.current.find(B=>B.family.toLowerCase()===Q.toLowerCase());if(R)return R;const X=c.find(B=>q1.test(B)&&Ws(B).toLowerCase()===Q.toLowerCase());return X?{family:Ws(X),path:X,url:`/api/projects/${h}/preview/${X}`}:null},[c,h,f]),T=d.useCallback(async(_,Q,R)=>{const X=g.current;if(!X)throw new Error("No active project");if(R!=null&&R.shouldSave&&!R.shouldSave())return;const B=_.sourceFile||t||"index.html",q=await fetch(`/api/projects/${X}/files/${encodeURIComponent(B)}`);if(!q.ok)throw new Error(`Failed to read ${B}`);const ne=(await q.json()).content;if(typeof ne!="string")throw new Error(`Missing file contents for ${B}`);if(R!=null&&R.shouldSave&&!R.shouldSave())return;const ae={id:_.id,selector:_.selector,selectorIndex:_.selectorIndex};l.current=Date.now();const ue=await fetch(`/api/projects/${X}/file-mutations/patch-element/${encodeURIComponent(B)}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({target:ae,operations:Q})});if(!ue.ok)throw new Error(`Failed to patch ${B}`);const xe=await ue.json();if(!xe.changed)throw new Error(`Unable to patch ${_.selector??_.id??"selection"}`);const fe=typeof xe.content=="string"?xe.content:ne;let ge=fe;R!=null&&R.prepareContent&&(ge=R.prepareContent(fe,B),ge!==fe&&await i(B,ge)),await o.recordEdit({label:(R==null?void 0:R.label)??"Edit layer",kind:"manual",coalesceKey:R==null?void 0:R.coalesceKey,files:{[B]:{before:ne,after:ge}}}),R!=null&&R.skipRefresh||O()},[t,o,i,g,l,O]),{handleDomStyleCommit:E,handleDomAttributeCommit:C,handleDomHtmlAttributeCommit:M,handleDomTextCommit:P,commitDomTextFields:$,handleDomTextFieldStyleCommit:Z,handleDomAddTextField:V,handleDomRemoveTextField:z}=KZ({activeCompPath:t,previewIframeRef:e,domEditSelection:x,applyDomSelection:b,refreshDomEditSelectionFromPreview:w,buildDomSelectionFromTarget:A,persistDomEditOperations:T,resolveImportedFontAsset:k}),L=d.useCallback((_,Q,R)=>{r(async()=>{await T(_,Q,{label:R.label,coalesceKey:R.coalesceKey,skipRefresh:R.skipRefresh??!0})}).catch(X=>{const B=X instanceof Error?X.message:"Failed to save position";n(B),Tt("save_failure",{source:"dom_edit",label:R.label,error_message:B,target_id:_.id??void 0,target_selector:_.selector??void 0,target_source_file:_.sourceFile??void 0})})},[T,r,n]),D=d.useCallback((_,Q)=>{mf(_.element,Q),L(_,Ux(_.element),{label:"Move layer",coalesceKey:`path-offset:${Ir(_)}`})},[L]),I=d.useCallback(_=>{if(_.length===0)return;const Q=_.map(R=>Ir(R.selection)).sort().join(":");for(const{selection:R,next:X}of _)mf(R.element,X),L(R,Ux(R.element),{label:`Move ${_.length} layers`,coalesceKey:`group-path-offset:${Q}`})},[L]),te=d.useCallback((_,Q)=>{Bg(_.element,Q),L(_,xP(_.element),{label:"Resize layer box",coalesceKey:`box-size:${Ir(_)}`})},[L]),J=d.useCallback((_,Q)=>{Ig(_.element,Q),L(_,SP(_.element),{label:"Rotate layer",coalesceKey:`rotation:${Ir(_)}`})},[L]),H=d.useCallback(_=>{const Q=_.element,R=[...gP(Q),...yP(Q),...wP(Q)];BP(Q),IP(Q),YP(Q),L(_,R,{label:"Reset layer edits",coalesceKey:`manual-reset:${Ir(_)}`,skipRefresh:!1})},[L]),G=d.useCallback((_,Q)=>{var B;dP(_.element,Q);let R=null;try{R=((B=e.current)==null?void 0:B.contentDocument)??null}catch{}R&&Op(R);const X=kP(_.element);L(_,X,{label:"Set GSAP motion",coalesceKey:`motion:${Ir(_)}`}),w(_)},[L,e,w]),F=d.useCallback(_=>{var B,q,W;const Q=MP(_.element);let R;try{R=(q=(B=e.current)==null?void 0:B.contentWindow)==null?void 0:q.gsap}catch{}hP(_.element,R);let X=null;try{X=((W=e.current)==null?void 0:W.contentDocument)??null}catch{}X&&Op(X),L(_,Q,{label:"Clear GSAP motion",coalesceKey:`motion:${Ir(_)}`,skipRefresh:!1}),w(_)},[L,e,w]),Y=d.useCallback(async _=>{const Q=g.current;if(!Q)return;const R=_.label||_.id||_.selector||_.tagName,X=_.sourceFile||t||"index.html";try{const B=await fetch(`/api/projects/${Q}/files/${encodeURIComponent(X)}`);if(!B.ok)throw new Error(`Failed to read ${X}`);const W=(await B.json()).content;if(typeof W!="string")throw new Error(`Missing file contents for ${X}`);const ne=_.id?{id:_.id,selector:_.selector,selectorIndex:_.selectorIndex}:_.selector?{selector:_.selector,selectorIndex:_.selectorIndex}:{};if(!ne.id&&!ne.selector)throw new Error("Selected element has no patchable target");l.current=Date.now();const ae=await fetch(`/api/projects/${Q}/file-mutations/remove-element/${encodeURIComponent(X)}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({target:ne})});if(!ae.ok)throw new Error(`Failed to delete element from ${X}`);const ue=await ae.json(),xe=typeof ue.content=="string"?ue.content:W;await El({projectId:Q,label:"Delete element",kind:"timeline",files:{[X]:xe},readFile:async()=>W,writeFile:i,recordEdit:o.recordEdit}),S(),pe.getState().setSelectedElementId(null),O(),n(`Deleted ${R}. Use Undo to restore it.`,"info")}catch(B){const q=B instanceof Error?B.message:"Failed to delete element";n(q)}},[t,S,l,o.recordEdit,g,O,n,i]);return{resolveImportedFontAsset:k,handleDomStyleCommit:E,handleDomAttributeCommit:C,handleDomHtmlAttributeCommit:M,handleDomTextCommit:P,commitDomTextFields:$,handleDomTextFieldStyleCommit:Z,handleDomAddTextField:V,handleDomRemoveTextField:z,handleDomPathOffsetCommit:D,handleDomGroupPathOffsetCommit:I,handleDomBoxSizeCommit:te,handleDomRotationCommit:J,handleDomManualEditsReset:H,handleDomMotionCommit:G,handleDomMotionClear:F,handleDomEditElementDelete:Y}}const eR={opacity:1,x:0,y:0,scale:1,scaleX:1,scaleY:1,rotation:0,width:100,height:100};function tR(t){if(t.id)return{selector:`#${t.id}`};if(t.selector)return{selector:t.selector};const e=t.element,n=e.ownerDocument,r=e.tagName.toLowerCase();let i=r,l=1;for(;n.getElementById(i);)l+=1,i=`${r}-${l}`;return e.setAttribute("id",i),{selector:`#${i}`,autoId:i}}async function nR(t,e,n){try{const r=await fetch(`/api/projects/${encodeURIComponent(t)}/gsap-mutations/${encodeURIComponent(e)}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(n)});return r.ok?await r.json():null}catch{return null}}const rR=150;function iR({projectIdRef:t,activeCompPath:e,editHistory:n,domEditSaveTimestampRef:r,reloadPreview:i,onCacheInvalidate:l}){const o=d.useRef(null),c=d.useRef(null),f=d.useCallback(async(A,k,T)=>{const E=t.current;if(!E)return;const C=A.sourceFile||e||"index.html",M=await nR(E,C,k);M!=null&&M.ok&&(r.current=Date.now(),M.before!=null&&M.after!=null&&await n.recordEdit({label:T.label,kind:"manual",coalesceKey:T.coalesceKey,files:{[C]:{before:M.before,after:M.after}}}),l(),T.softReload||i())},[t,e,n,r,i,l]),h=d.useCallback(()=>{const A=o.current;if(!A)return;o.current=null;const{selection:k,animationId:T,property:E,value:C}=A;f(k,{type:"update-property",animationId:T,property:E,value:C},{label:`Edit GSAP ${E}`,coalesceKey:`gsap:${T}:${E}`})},[f]),g=d.useCallback((A,k,T,E)=>{o.current={selection:A,animationId:k,property:T,value:E},c.current&&clearTimeout(c.current),c.current=setTimeout(h,rR)},[h]);d.useEffect(()=>()=>{c.current&&clearTimeout(c.current),h()},[h]);const O=d.useCallback((A,k,T)=>{f(A,{type:"update-meta",animationId:k,updates:T},{label:"Edit GSAP animation",coalesceKey:`gsap:${k}:meta`})},[f]),x=d.useCallback((A,k)=>{f(A,{type:"delete",animationId:k},{label:"Delete GSAP animation"})},[f]),b=d.useCallback(async(A,k,T)=>{const{selector:E,autoId:C}=tR(A);if(C){const $=t.current,Z=A.sourceFile||e||"index.html";if(!$)return;const V=await fetch(`/api/projects/${encodeURIComponent($)}/file-mutations/patch-element/${encodeURIComponent(Z)}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({target:{id:A.id,selector:A.selector,selectorIndex:A.selectorIndex},operations:[{type:"html-attribute",property:"id",value:C}]})});if(!V.ok||!(await V.json()).changed)return}const M=T??(Number.parseFloat(A.dataAttributes.start??"0")||0);await f(A,{type:"add",targetSelector:E,method:k,position:M,duration:k==="set"?void 0:.5,ease:k==="set"?void 0:"power2.out",properties:{from:{opacity:0},to:{opacity:1},set:{opacity:1}}[k]??{opacity:1}},{label:`Add GSAP ${k} animation`})},[f,t,e]),S=d.useCallback((A,k,T)=>{var M;let E=eR[T]??0;const C=A.element;if(T==="width"||T==="height"){const P=C.getBoundingClientRect();E=Math.round(T==="width"?P.width:P.height)}else if(T==="opacity"||T==="autoAlpha"){const P=(M=C.ownerDocument.defaultView)==null?void 0:M.getComputedStyle(C);E=P&&Number.parseFloat(P.opacity)||1}f(A,{type:"add-property",animationId:k,property:T,defaultValue:E},{label:`Add GSAP ${T}`})},[f]),w=d.useCallback((A,k,T)=>{f(A,{type:"remove-property",animationId:k,property:T},{label:`Remove GSAP ${T}`})},[f]);return{updateGsapProperty:g,updateGsapMeta:O,deleteGsapAnimation:x,addGsapAnimation:b,addGsapProperty:S,removeGsapProperty:w}}function aR(t,e){return t.filter(n=>n.targetSelector===`#${e}`)}async function lR(t,e){try{const n=await fetch(`/api/projects/${encodeURIComponent(t)}/gsap-animations/${encodeURIComponent(e)}`);return n.ok?await n.json():null}catch{return null}}function sR(t,e,n,r){const[i,l]=d.useState([]),[o,c]=d.useState(!1),[f,h]=d.useState(!1),g=d.useRef("");return d.useEffect(()=>{const x=`${t}:${e}:${r}`;if(x===g.current)return;if(g.current=x,!t){l([]),c(!1),h(!1);return}let b=!1;return lR(t,e).then(S=>{if(!b){if(!S){l([]),c(!1),h(!1);return}l(S.animations),c(S.multipleTimelines===!0),h(S.unsupportedTimelinePattern===!0)}}),()=>{b=!0}},[t,e,r]),{animations:d.useMemo(()=>n?aR(i,n):[],[i,n]),multipleTimelines:o,unsupportedTimelinePattern:f}}function oR(){const[t,e]=d.useState(0),n=d.useCallback(()=>e(r=>r+1),[]);return{version:t,bump:n}}function cR({projectId:t,activeCompPath:e,isMasterView:n,compIdToSrc:r,captionEditMode:i,compositionLoading:l,previewIframeRef:o,timelineElements:c,currentTime:f,setSelectedTimelineElementId:h,setRightCollapsed:g,setRightPanelTab:O,showToast:x,refreshPreviewDocumentVersion:b,queueDomEditSave:S,readProjectFile:w,writeProjectFile:A,domEditSaveTimestampRef:k,editHistory:T,fileTree:E,importedFontAssetsRef:C,projectDir:M,projectIdRef:P,previewIframe:$,refreshKey:Z,rightPanelTab:V,applyStudioManualEditsToPreviewRef:z,syncPreviewHistoryHotkey:L,reloadPreview:D,setRefreshKey:I,openSourceForSelection:te,selectSidebarTab:J,getSidebarTab:H}){const G=d.useCallback(ft=>{!te||!J||ft.sourceFile&&(J("code"),te(ft.sourceFile,{id:ft.id,selector:ft.selector,selectorIndex:ft.selectorIndex}))},[te,J]),{domEditSelection:F,domEditGroupSelections:Y,domEditHoverSelection:_,domEditSelectionRef:Q,applyDomSelection:R,clearDomSelection:X,buildDomSelectionFromTarget:B,resolveDomSelectionFromPreviewPoint:q,updateDomEditHoverSelection:W,buildDomSelectionForTimelineElement:ne,handleTimelineElementSelect:ae,refreshDomEditSelectionFromPreview:ue}=IZ({projectId:t,activeCompPath:e,isMasterView:n,compIdToSrc:r,captionEditMode:i,previewIframeRef:o,timelineElements:c,setSelectedTimelineElementId:h,setRightCollapsed:g,setRightPanelTab:O,previewIframe:$,refreshKey:Z,rightPanelTab:V}),{agentModalOpen:xe,agentModalAnchorPoint:fe,copiedAgentPrompt:ge,agentPromptSelectionContext:ke,setAgentModalOpen:je,setAgentPromptSelectionContext:Ie,setAgentModalAnchorPoint:Xe,handleAskAgent:xt,handleAgentModalSubmit:et}=VZ({activeCompPath:e,projectDir:M,projectIdRef:P,currentTime:f,showToast:x,domEditSelectionRef:Q,domEditSelection:F}),{handlePreviewCanvasMouseDown:ve,handlePreviewCanvasPointerMove:jt,handlePreviewCanvasPointerLeave:yt,handleBlockedDomMove:Le,handleDomManualDragStart:Zt}=qZ({captionEditMode:i,compositionLoading:l,previewIframeRef:o,showToast:x,applyDomSelection:R,resolveDomSelectionFromPreviewPoint:q,updateDomEditHoverSelection:W,onClickToSource:G}),{version:Ke,bump:Sn}=oR(),{animations:Ht,multipleTimelines:at,unsupportedTimelinePattern:an}=sR(b7?t??null:null,(F==null?void 0:F.sourceFile)||e||"index.html",(F==null?void 0:F.id)??null,Ke),{updateGsapProperty:ri,updateGsapMeta:Jn,deleteGsapAnimation:Pe,addGsapAnimation:At,addGsapProperty:St,removeGsapProperty:He}=iR({projectIdRef:P,activeCompPath:e,editHistory:T,domEditSaveTimestampRef:k,reloadPreview:D,onCacheInvalidate:Sn}),{resolveImportedFontAsset:tt,handleDomStyleCommit:ze,handleDomAttributeCommit:ln,handleDomHtmlAttributeCommit:Rn,handleDomTextCommit:xr,handleDomTextFieldStyleCommit:er,handleDomAddTextField:yr,handleDomRemoveTextField:br,handleDomPathOffsetCommit:wn,handleDomGroupPathOffsetCommit:ii,handleDomBoxSizeCommit:Hr,handleDomRotationCommit:el,handleDomManualEditsReset:ki,handleDomMotionCommit:tr,handleDomMotionClear:Nn,handleDomEditElementDelete:fa}=JZ({activeCompPath:e,previewIframeRef:o,showToast:x,queueDomEditSave:S,writeProjectFile:A,domEditSaveTimestampRef:k,editHistory:T,fileTree:E,importedFontAssetsRef:C,projectId:t,projectIdRef:P,reloadPreview:D,domEditSelection:F,applyDomSelection:R,clearDomSelection:X,refreshDomEditSelectionFromPreview:ue,buildDomSelectionFromTarget:B}),ye=d.useCallback((ft,mt,en)=>{F&&ri(F,ft,mt,en)},[F,ri]),Ne=d.useCallback((ft,mt)=>{F&&Jn(F,ft,mt)},[F,Jn]),lt=d.useCallback(ft=>{F&&Pe(F,ft)},[F,Pe]),Oe=d.useCallback(ft=>{F&&At(F,ft,f)},[F,At,f]),qe=d.useCallback((ft,mt)=>{F&&St(F,ft,mt)},[F,St]),vr=d.useCallback((ft,mt)=>{F&&He(F,ft,mt)},[F,He]);d.useEffect(()=>{if(!$)return;const ft=async()=>{if(!fn||i)return;const en=Q.current;if(!en)return;let Xr=null;try{Xr=$.contentDocument}catch{return}if(!Xr)return;pf(Xr);const _l=Bn(Xr,en,e);if(!_l){R(null,{revealPanel:!1});return}const Lu=await B(_l);Lu&&R(Lu,{revealPanel:!1,preserveGroup:!0})};L($),z.current($),ft(),b();const mt=()=>{L($),z.current($),ft(),b()};return $.addEventListener("load",mt),()=>{$.removeEventListener("load",mt)}},[e,R,B,i,Q,$,b,L,z]);const Sr=d.useRef(te);return Sr.current=te,d.useEffect(()=>{!F||!Sr.current||!H||F.sourceFile&&H()==="code"&&Sr.current(F.sourceFile,{id:F.id,selector:F.selector,selectorIndex:F.selectorIndex})},[F,H]),{domEditSelection:F,domEditGroupSelections:Y,domEditHoverSelection:_,agentModalOpen:xe,agentModalAnchorPoint:fe,copiedAgentPrompt:ge,agentPromptSelectionContext:ke,domEditSelectionRef:Q,handleTimelineElementSelect:ae,handlePreviewCanvasMouseDown:ve,handlePreviewCanvasPointerMove:jt,handlePreviewCanvasPointerLeave:yt,applyDomSelection:R,clearDomSelection:X,handleDomStyleCommit:ze,handleDomAttributeCommit:ln,handleDomHtmlAttributeCommit:Rn,handleDomPathOffsetCommit:wn,handleDomGroupPathOffsetCommit:ii,handleDomBoxSizeCommit:Hr,handleDomRotationCommit:el,handleDomManualEditsReset:ki,handleDomMotionCommit:tr,handleDomMotionClear:Nn,handleDomTextCommit:xr,handleDomTextFieldStyleCommit:er,handleDomAddTextField:yr,handleDomRemoveTextField:br,handleAskAgent:xt,handleAgentModalSubmit:et,handleBlockedDomMove:Le,handleDomManualDragStart:Zt,handleDomEditElementDelete:fa,buildDomSelectionFromTarget:B,buildDomSelectionForTimelineElement:ne,updateDomEditHoverSelection:W,resolveImportedFontAsset:tt,setAgentModalOpen:je,setAgentPromptSelectionContext:Ie,setAgentModalAnchorPoint:Xe,selectedGsapAnimations:Ht,gsapMultipleTimelines:at,gsapUnsupportedTimelinePattern:an,handleGsapUpdateProperty:ye,handleGsapUpdateMeta:Ne,handleGsapDeleteAnimation:lt,handleGsapAddAnimation:Oe,handleGsapAddProperty:qe,handleGsapRemoveProperty:vr}}const j7="Shift+T";function Es(t){var i,l,o;if(!t||typeof t!="object")return!1;const e=t,n=(i=e.tagName)==null?void 0:i.toLowerCase();if(n==="input"||n==="textarea"||n==="select"||e.isContentEditable)return!0;const r=(l=e.getAttribute)==null?void 0:l.call(e,"role");return r==="textbox"||r==="searchbox"||r==="combobox"?!0:!!((o=e.closest)!=null&&o.call(e,"input, textarea, select, [contenteditable='true'], [role='textbox'], .cm-editor"))}function uR(t){return t.metaKey||t.ctrlKey||t.altKey||!t.shiftKey||t.key.toLowerCase()!=="t"?!1:!Es(t.target)}function P7(t){return`${t?"Hide":"Show"} timeline editor (${j7})`}function p3(t){try{return(t==null?void 0:t.contentWindow)??null}catch{return null}}function g3(t,e,n){const r=t.key.toLowerCase();return r==="z"&&!t.shiftKey?(t.preventDefault(),e(),!0):r==="z"&&t.shiftKey||t.ctrlKey&&!t.metaKey&&r==="y"?(t.preventDefault(),n(),!0):!1}function fR({toggleTimelineVisibility:t,handleTimelineElementDelete:e,handleDomEditElementDelete:n,domEditSelectionRef:r,editHistory:i,readOptionalProjectFile:l,readProjectFile:o,writeProjectFile:c,domEditSaveTimestampRef:f,showToast:h,syncHistoryPreviewAfterApply:g,waitForPendingDomEditSaves:O,leftSidebarRef:x,handleCopy:b,handlePaste:S,handleCut:w}){const A=d.useRef(null),k=d.useRef(void 0),T=d.useRef(null),E=d.useCallback(_=>{uR(_)&&(_.preventDefault(),t())},[t]),C=d.useCallback(async _=>_===pp?l(_):o(_),[l,o]),M=d.useCallback(async(_,Q)=>{f.current=Date.now(),await c(_,Q)},[f,c]),P=d.useCallback(async()=>{await O();const _=await i.undo({readFile:C,writeFile:M});if(!_.ok&&_.reason==="content-mismatch"){h("File changed outside Studio. Undo history was not applied.","info");return}_.ok&&_.label&&(await g(_.paths),h(`Undid ${_.label}`,"info"))},[i,C,h,g,O,M]),$=d.useCallback(async()=>{await O();const _=await i.redo({readFile:C,writeFile:M});if(!_.ok&&_.reason==="content-mismatch"){h("File changed outside Studio. Redo history was not applied.","info");return}_.ok&&_.label&&(await g(_.paths),h(`Redid ${_.label}`,"info"))},[i,C,h,g,O,M]),Z=d.useRef(E);Z.current=E;const V=d.useRef(e);V.current=e;const z=d.useRef(n);z.current=n;const L=d.useRef(P);L.current=P;const D=d.useRef($);D.current=$;const I=d.useRef(b);I.current=b;const te=d.useRef(S);te.current=S;const J=d.useRef(w);J.current=w,k.current=_=>{var Q,R,X;if(Z.current(_),_.metaKey||_.ctrlKey){if(!t3(_.target)&&g3(_,()=>void L.current(),()=>void D.current()))return;if(_.key==="1"){_.preventDefault(),(Q=x.current)==null||Q.selectTab("compositions");return}if(_.key==="2"){_.preventDefault(),(R=x.current)==null||R.selectTab("assets");return}const B=_.key.toLowerCase();if(B==="c"&&!_.shiftKey&&!_.altKey&&!Es(_.target)){I.current()&&_.preventDefault();return}if(B==="v"&&!_.shiftKey&&!_.altKey&&!Es(_.target)){_.preventDefault(),te.current();return}if(B==="x"&&!_.shiftKey&&!_.altKey&&!Es(_.target)){(!!pe.getState().selectedElementId||!!r.current)&&(_.preventDefault(),J.current());return}}if(_.key.toLowerCase()==="f"&&!_.metaKey&&!_.ctrlKey&&!_.altKey&&!_.shiftKey&&!Es(_.target)){_.preventDefault(),document.fullscreenElement?document.exitFullscreen():(X=document.querySelector("[data-studio-fullscreen-target]"))==null||X.requestFullscreen();return}if((_.key==="Delete"||_.key==="Backspace")&&!_.metaKey&&!_.ctrlKey&&!_.altKey&&!Es(_.target)){const{selectedElementId:B,elements:q}=pe.getState();if(B){const ne=q.find(ae=>(ae.key??ae.id)===B);if(ne){_.preventDefault(),V.current(ne);return}}const W=r.current;W&&(_.preventDefault(),z.current(W))}},d.useEffect(()=>{function _(Q){var R;(R=k.current)==null||R.call(k,Q)}return window.addEventListener("keydown",_,!0),()=>window.removeEventListener("keydown",_,!0)},[]);const H=d.useCallback(_=>{var Q;(Q=k.current)==null||Q.call(k,_)},[]),G=d.useCallback(_=>{const Q=p3(_);if(A.current!==Q){if(A.current)try{A.current.removeEventListener("keydown",H)}catch{}A.current=Q;try{Q==null||Q.addEventListener("keydown",H,!0)}catch{}}},[H]);d.useEffect(()=>()=>{if(A.current){try{A.current.removeEventListener("keydown",H)}catch{}A.current=null}},[H]);const F=d.useCallback(_=>{(_.metaKey||_.ctrlKey)&&(t3(_.target)||g3(_,()=>void L.current(),()=>void D.current()))},[]),Y=d.useCallback(_=>{var X;(X=T.current)==null||X.call(T),T.current=null;const Q=p3(_);let R=null;try{R=(_==null?void 0:_.contentDocument)??null}catch{R=null}if(!(!Q&&!R)){try{Q==null||Q.addEventListener("keydown",F,!0)}catch{}R==null||R.addEventListener("keydown",F,!0),T.current=()=>{try{Q==null||Q.removeEventListener("keydown",F,!0)}catch{}R==null||R.removeEventListener("keydown",F,!0)}}},[F]);return d.useEffect(()=>()=>{var _;(_=T.current)==null||_.call(T),T.current=null},[]),{handleUndo:P,handleRedo:$,syncPreviewTimelineHotkey:G,syncPreviewHistoryHotkey:Y,handleTimelineToggleHotkey:E}}function dR(t,e,n,r){if(n){const o=r??0;let c=0,f=null;if(n.startsWith("#")){const h=n.slice(1);f=new RegExp(`<[a-z][^>]*\\bid="${h}"[^>]*>`,"gi")}else if(n.startsWith(".")){const h=n.slice(1);f=new RegExp(`<[a-z][^>]*\\bclass="[^"]*\\b${h}\\b[^"]*"[^>]*>`,"gi")}else if(n.startsWith("[")){const h=n.slice(1,-1);f=new RegExp(`<[a-z][^>]*\\b${h}[^>]*>`,"gi")}if(f){let h;for(;(h=f.exec(t))!==null;){if(c===o){const g=hR(t,h.index);if(g>0)return t.slice(0,g)+`
+${t}`}function KZ({activeCompPath:t,previewIframeRef:e,domEditSelection:n,applyDomSelection:r,refreshDomEditSelectionFromPreview:i,buildDomSelectionFromTarget:l,persistDomEditOperations:o,resolveImportedFontAsset:c}){const f=d.useRef(0),h=d.useCallback(async(k,T)=>{if(!n||eZ(k)||!n.capabilities.canEditStyles)return;const E=k==="font-family"?c(T):null,C=e.current,M=C==null?void 0:C.contentDocument;if(M){const Z=Bn(M,n,t);Z&&(Z.style.setProperty(k,Bm(k,T)),k==="font-family"&&(d3(M,T),E&&h3(M,E)),k==="background-image"&&e3(T)&&(Z.style.setProperty("background-position","center"),Z.style.setProperty("background-repeat","no-repeat"),Z.style.setProperty("background-size","contain")))}const P=[d1(k,Bm(k,T))];k==="background-image"&&e3(T)&&P.push(d1("background-position","center"),d1("background-repeat","no-repeat"),d1("background-size","contain"));const $=k!=="z-index";try{await o(n,P,{label:"Edit layer style",skipRefresh:$,prepareContent:E?(Z,V)=>m3(Z,E,V):void 0})}catch(Z){console.warn("[Studio] Style persist failed:",Z instanceof Error?Z.message:Z)}i(n)},[t,n,o,i,c,e]),g=d.useCallback(async(k,T)=>{if(!n)return;const E=e.current,C=E==null?void 0:E.contentDocument;if(C){const P=Bn(C,n,t);P&&P.setAttribute(`data-${k}`,T)}const M={type:"attribute",property:k,value:T};try{await o(n,[M],{label:`Edit ${k.replace(/-/g," ")}`,coalesceKey:`attr:${k}:${Ir(n)}`,skipRefresh:!1})}catch(P){console.warn("[Studio] Attribute persist failed:",P instanceof Error?P.message:P)}i(n)},[t,n,o,i,e]),O=d.useCallback(async(k,T)=>{if(!n)return;const E=e.current,C=E==null?void 0:E.contentDocument;if(C){const P=Bn(C,n,t);P&&(T===null||T===""||T==="false"?P.removeAttribute(k):P.setAttribute(k,T))}const M={type:"html-attribute",property:k,value:T};try{await o(n,[M],{label:`Edit ${k}`,coalesceKey:`html-attr:${k}:${Ir(n)}`,skipRefresh:!1})}catch(P){console.warn("[Studio] HTML attribute persist failed:",P instanceof Error?P.message:P)}i(n)},[t,n,o,i,e]),x=d.useCallback(async(k,T)=>{if(!n||!t8(n))return;const E=f.current+1;f.current=E;const C=n.textFields.length>0?n.textFields.map(Z=>Z.key===T?{...Z,value:k}:Z):[],M=C.length>1||C.some(Z=>Z.source==="child")?o3(C):k,P=e.current,$=P==null?void 0:P.contentDocument;if($){const Z=Bn($,n,t);Z&&(C.length>1||C.some(V=>V.source==="child")?Z.innerHTML=M:Z.textContent=k)}if(await o(n,[c3(M)],{label:"Edit text",skipRefresh:!0,shouldSave:()=>f.current===E}),f.current===E&&$){const Z=Bn($,n,t);if(Z){const V=await l(Z);V&&r(V,{revealPanel:!1,preserveGroup:!0})}}},[t,r,l,n,o,e]),b=d.useCallback(async(k,T,E)=>{var Z;const C=T.length>1||T.some(V=>V.source==="child")?o3(T):((Z=T[0])==null?void 0:Z.value)??"",M=e.current,P=M==null?void 0:M.contentDocument;if(P){const V=Bn(P,k,t);V&&(T.length>1||T.some(z=>z.source==="child")?V.innerHTML=C:V.textContent=C)}const $=(E==null?void 0:E.importedFont)??null;if(await o(k,[c3(C)],{label:"Edit text",skipRefresh:!0,prepareContent:$?(V,z)=>m3(V,$,z):void 0}),P){const V=Bn(P,k,t);if(V){const z=await l(V);z&&r(z,{revealPanel:!1,preserveGroup:!0})}}},[t,r,l,o,e]),S=d.useCallback(async(k,T,E)=>{var Z;if(!n)return;const C=n.textFields.find(V=>V.key===k);if(!C)return;if(C.source==="self"){await h(T,E);return}const M=Bm(T,E),P=T==="font-family"?c(E):null;if(T==="font-family"){const V=(Z=e.current)==null?void 0:Z.contentDocument;V&&(d3(V,M),P&&h3(V,P))}const $=n.textFields.map(V=>V.key===k?{...V,inlineStyles:{...V.inlineStyles,[T]:M},computedStyles:{...V.computedStyles,[T]:M}}:V);await b(n,$,{importedFont:P})},[b,n,h,c,e]),w=d.useCallback(async k=>{if(!n||!n.textFields.some(P=>P.source==="child"))return null;const T=n.textFields.findIndex(P=>P.key===k),E=n.textFields[T>=0?T:0]??n.textFields[0],C=$Z(E),M=[...n.textFields];return M.splice(T>=0?T+1:M.length,0,C),await b(n,M),C.key},[b,n]),A=d.useCallback(async k=>{if(!n)return;const T=n.textFields.find(C=>C.key===k);if(!T)return;if(T.source==="self"){await x("",k);return}const E=n.textFields.filter(C=>C.key!==k);await b(n,E)},[b,n,x]);return{handleDomStyleCommit:h,handleDomAttributeCommit:g,handleDomHtmlAttributeCommit:O,handleDomTextCommit:x,commitDomTextFields:b,handleDomTextFieldStyleCommit:S,handleDomAddTextField:w,handleDomRemoveTextField:A}}function JZ({activeCompPath:t,previewIframeRef:e,showToast:n,queueDomEditSave:r,writeProjectFile:i,domEditSaveTimestampRef:l,editHistory:o,fileTree:c,importedFontAssetsRef:f,projectId:h,projectIdRef:g,reloadPreview:O,domEditSelection:x,applyDomSelection:b,clearDomSelection:S,refreshDomEditSelectionFromPreview:w,buildDomSelectionFromTarget:A}){const k=d.useCallback(_=>{const Q=GZ(_);if(!Q)return null;const R=f.current.find(B=>B.family.toLowerCase()===Q.toLowerCase());if(R)return R;const X=c.find(B=>q1.test(B)&&Ws(B).toLowerCase()===Q.toLowerCase());return X?{family:Ws(X),path:X,url:`/api/projects/${h}/preview/${X}`}:null},[c,h,f]),T=d.useCallback(async(_,Q,R)=>{const X=g.current;if(!X)throw new Error("No active project");if(R!=null&&R.shouldSave&&!R.shouldSave())return;const B=_.sourceFile||t||"index.html",q=await fetch(`/api/projects/${X}/files/${encodeURIComponent(B)}`);if(!q.ok)throw new Error(`Failed to read ${B}`);const ne=(await q.json()).content;if(typeof ne!="string")throw new Error(`Missing file contents for ${B}`);if(R!=null&&R.shouldSave&&!R.shouldSave())return;const ae={id:_.id,selector:_.selector,selectorIndex:_.selectorIndex};l.current=Date.now();const ue=await fetch(`/api/projects/${X}/file-mutations/patch-element/${encodeURIComponent(B)}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({target:ae,operations:Q})});if(!ue.ok)throw new Error(`Failed to patch ${B}`);const xe=await ue.json();if(!xe.changed)throw new Error(`Unable to patch ${_.selector??_.id??"selection"}`);const fe=typeof xe.content=="string"?xe.content:ne;let ge=fe;R!=null&&R.prepareContent&&(ge=R.prepareContent(fe,B),ge!==fe&&await i(B,ge)),await o.recordEdit({label:(R==null?void 0:R.label)??"Edit layer",kind:"manual",coalesceKey:R==null?void 0:R.coalesceKey,files:{[B]:{before:ne,after:ge}}}),R!=null&&R.skipRefresh||O()},[t,o,i,g,l,O]),{handleDomStyleCommit:E,handleDomAttributeCommit:C,handleDomHtmlAttributeCommit:M,handleDomTextCommit:P,commitDomTextFields:$,handleDomTextFieldStyleCommit:Z,handleDomAddTextField:V,handleDomRemoveTextField:z}=KZ({activeCompPath:t,previewIframeRef:e,domEditSelection:x,applyDomSelection:b,refreshDomEditSelectionFromPreview:w,buildDomSelectionFromTarget:A,persistDomEditOperations:T,resolveImportedFontAsset:k}),L=d.useCallback((_,Q,R)=>{r(async()=>{await T(_,Q,{label:R.label,coalesceKey:R.coalesceKey,skipRefresh:R.skipRefresh??!0})}).catch(X=>{const B=X instanceof Error?X.message:"Failed to save position";n(B),Tt("save_failure",{source:"dom_edit",label:R.label,error_message:B,target_id:_.id??void 0,target_selector:_.selector??void 0,target_source_file:_.sourceFile??void 0})})},[T,r,n]),D=d.useCallback((_,Q)=>{mf(_.element,Q),L(_,Ux(_.element),{label:"Move layer",coalesceKey:`path-offset:${Ir(_)}`})},[L]),I=d.useCallback(_=>{if(_.length===0)return;const Q=_.map(R=>Ir(R.selection)).sort().join(":");for(const{selection:R,next:X}of _)mf(R.element,X),L(R,Ux(R.element),{label:`Move ${_.length} layers`,coalesceKey:`group-path-offset:${Q}`})},[L]),te=d.useCallback((_,Q)=>{Bg(_.element,Q),L(_,xP(_.element),{label:"Resize layer box",coalesceKey:`box-size:${Ir(_)}`})},[L]),J=d.useCallback((_,Q)=>{Ig(_.element,Q),L(_,SP(_.element),{label:"Rotate layer",coalesceKey:`rotation:${Ir(_)}`})},[L]),H=d.useCallback(_=>{const Q=_.element,R=[...gP(Q),...yP(Q),...wP(Q)];BP(Q),IP(Q),YP(Q),L(_,R,{label:"Reset layer edits",coalesceKey:`manual-reset:${Ir(_)}`,skipRefresh:!1})},[L]),G=d.useCallback((_,Q)=>{var B;dP(_.element,Q);let R=null;try{R=((B=e.current)==null?void 0:B.contentDocument)??null}catch{}R&&Op(R);const X=kP(_.element);L(_,X,{label:"Set GSAP motion",coalesceKey:`motion:${Ir(_)}`}),w(_)},[L,e,w]),F=d.useCallback(_=>{var B,q,W;const Q=MP(_.element);let R;try{R=(q=(B=e.current)==null?void 0:B.contentWindow)==null?void 0:q.gsap}catch{}hP(_.element,R);let X=null;try{X=((W=e.current)==null?void 0:W.contentDocument)??null}catch{}X&&Op(X),L(_,Q,{label:"Clear GSAP motion",coalesceKey:`motion:${Ir(_)}`,skipRefresh:!1}),w(_)},[L,e,w]),Y=d.useCallback(async _=>{const Q=g.current;if(!Q)return;const R=_.label||_.id||_.selector||_.tagName,X=_.sourceFile||t||"index.html";try{const B=await fetch(`/api/projects/${Q}/files/${encodeURIComponent(X)}`);if(!B.ok)throw new Error(`Failed to read ${X}`);const W=(await B.json()).content;if(typeof W!="string")throw new Error(`Missing file contents for ${X}`);const ne=_.id?{id:_.id,selector:_.selector,selectorIndex:_.selectorIndex}:_.selector?{selector:_.selector,selectorIndex:_.selectorIndex}:{};if(!ne.id&&!ne.selector)throw new Error("Selected element has no patchable target");l.current=Date.now();const ae=await fetch(`/api/projects/${Q}/file-mutations/remove-element/${encodeURIComponent(X)}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({target:ne})});if(!ae.ok)throw new Error(`Failed to delete element from ${X}`);const ue=await ae.json(),xe=typeof ue.content=="string"?ue.content:W;await El({projectId:Q,label:"Delete element",kind:"timeline",files:{[X]:xe},readFile:async()=>W,writeFile:i,recordEdit:o.recordEdit}),S(),pe.getState().setSelectedElementId(null),O(),n(`Deleted ${R}. Use Undo to restore it.`,"info")}catch(B){const q=B instanceof Error?B.message:"Failed to delete element";n(q)}},[t,S,l,o.recordEdit,g,O,n,i]);return{resolveImportedFontAsset:k,handleDomStyleCommit:E,handleDomAttributeCommit:C,handleDomHtmlAttributeCommit:M,handleDomTextCommit:P,commitDomTextFields:$,handleDomTextFieldStyleCommit:Z,handleDomAddTextField:V,handleDomRemoveTextField:z,handleDomPathOffsetCommit:D,handleDomGroupPathOffsetCommit:I,handleDomBoxSizeCommit:te,handleDomRotationCommit:J,handleDomManualEditsReset:H,handleDomMotionCommit:G,handleDomMotionClear:F,handleDomEditElementDelete:Y}}const eR={opacity:1,x:0,y:0,scale:1,scaleX:1,scaleY:1,rotation:0,width:100,height:100};function tR(t){if(t.id)return{selector:`#${t.id}`};if(t.selector)return{selector:t.selector};const e=t.element,n=e.ownerDocument,r=e.tagName.toLowerCase();let i=r,l=1;for(;n.getElementById(i);)l+=1,i=`${r}-${l}`;return e.setAttribute("id",i),{selector:`#${i}`,autoId:i}}async function nR(t,e,n){try{const r=await fetch(`/api/projects/${encodeURIComponent(t)}/gsap-mutations/${encodeURIComponent(e)}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(n)});return r.ok?await r.json():null}catch{return null}}const rR=150;function iR({projectIdRef:t,activeCompPath:e,editHistory:n,domEditSaveTimestampRef:r,reloadPreview:i,onCacheInvalidate:l}){const o=d.useRef(null),c=d.useRef(null),f=d.useCallback(async(A,k,T)=>{const E=t.current;if(!E)return;const C=A.sourceFile||e||"index.html",M=await nR(E,C,k);M!=null&&M.ok&&(r.current=Date.now(),M.before!=null&&M.after!=null&&await n.recordEdit({label:T.label,kind:"manual",coalesceKey:T.coalesceKey,files:{[C]:{before:M.before,after:M.after}}}),l(),T.softReload||i())},[t,e,n,r,i,l]),h=d.useCallback(()=>{const A=o.current;if(!A)return;o.current=null;const{selection:k,animationId:T,property:E,value:C}=A;f(k,{type:"update-property",animationId:T,property:E,value:C},{label:`Edit GSAP ${E}`,coalesceKey:`gsap:${T}:${E}`})},[f]),g=d.useCallback((A,k,T,E)=>{o.current={selection:A,animationId:k,property:T,value:E},c.current&&clearTimeout(c.current),c.current=setTimeout(h,rR)},[h]);d.useEffect(()=>()=>{c.current&&clearTimeout(c.current),h()},[h]);const O=d.useCallback((A,k,T)=>{f(A,{type:"update-meta",animationId:k,updates:T},{label:"Edit GSAP animation",coalesceKey:`gsap:${k}:meta`})},[f]),x=d.useCallback((A,k)=>{f(A,{type:"delete",animationId:k},{label:"Delete GSAP animation"})},[f]),b=d.useCallback(async(A,k,T)=>{const{selector:E,autoId:C}=tR(A);if(C){const $=t.current,Z=A.sourceFile||e||"index.html";if(!$)return;const V=await fetch(`/api/projects/${encodeURIComponent($)}/file-mutations/patch-element/${encodeURIComponent(Z)}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({target:{id:A.id,selector:A.selector,selectorIndex:A.selectorIndex},operations:[{type:"html-attribute",property:"id",value:C}]})});if(!V.ok||!(await V.json()).changed)return}const M=T??(Number.parseFloat(A.dataAttributes.start??"0")||0);await f(A,{type:"add",targetSelector:E,method:k,position:M,duration:k==="set"?void 0:.5,ease:k==="set"?void 0:"power2.out",properties:{from:{opacity:0},to:{opacity:1},set:{opacity:1}}[k]??{opacity:1}},{label:`Add GSAP ${k} animation`})},[f,t,e]),S=d.useCallback((A,k,T)=>{var M;let E=eR[T]??0;const C=A.element;if(T==="width"||T==="height"){const P=C.getBoundingClientRect();E=Math.round(T==="width"?P.width:P.height)}else if(T==="opacity"||T==="autoAlpha"){const P=(M=C.ownerDocument.defaultView)==null?void 0:M.getComputedStyle(C);E=P&&Number.parseFloat(P.opacity)||1}f(A,{type:"add-property",animationId:k,property:T,defaultValue:E},{label:`Add GSAP ${T}`})},[f]),w=d.useCallback((A,k,T)=>{f(A,{type:"remove-property",animationId:k,property:T},{label:`Remove GSAP ${T}`})},[f]);return{updateGsapProperty:g,updateGsapMeta:O,deleteGsapAnimation:x,addGsapAnimation:b,addGsapProperty:S,removeGsapProperty:w}}function aR(t,e){const n=new Set;return e.id&&n.add(`#${e.id}`),e.selector&&n.add(e.selector),n.size===0?[]:t.filter(r=>r.targetSelector.split(",").some(i=>n.has(i.trim())))}async function lR(t,e){try{const n=await fetch(`/api/projects/${encodeURIComponent(t)}/gsap-animations/${encodeURIComponent(e)}`);return n.ok?await n.json():null}catch{return null}}function sR(t,e,n,r){const[i,l]=d.useState([]),[o,c]=d.useState(!1),[f,h]=d.useState(!1),g=d.useRef("");d.useEffect(()=>{const S=`${t}:${e}:${r}`;if(S===g.current)return;if(g.current=S,!t){l([]),c(!1),h(!1);return}let w=!1;return lR(t,e).then(A=>{if(!w){if(!A){l([]),c(!1),h(!1);return}l(A.animations),c(A.multipleTimelines===!0),h(A.unsupportedTimelinePattern===!0)}}),()=>{w=!0}},[t,e,r]);const O=(n==null?void 0:n.id)??null,x=(n==null?void 0:n.selector)??null;return{animations:d.useMemo(()=>O||x?aR(i,{id:O,selector:x}):[],[i,O,x]),multipleTimelines:o,unsupportedTimelinePattern:f}}function oR(){const[t,e]=d.useState(0),n=d.useCallback(()=>e(r=>r+1),[]);return{version:t,bump:n}}function cR({projectId:t,activeCompPath:e,isMasterView:n,compIdToSrc:r,captionEditMode:i,compositionLoading:l,previewIframeRef:o,timelineElements:c,currentTime:f,setSelectedTimelineElementId:h,setRightCollapsed:g,setRightPanelTab:O,showToast:x,refreshPreviewDocumentVersion:b,queueDomEditSave:S,readProjectFile:w,writeProjectFile:A,domEditSaveTimestampRef:k,editHistory:T,fileTree:E,importedFontAssetsRef:C,projectDir:M,projectIdRef:P,previewIframe:$,refreshKey:Z,rightPanelTab:V,applyStudioManualEditsToPreviewRef:z,syncPreviewHistoryHotkey:L,reloadPreview:D,setRefreshKey:I,openSourceForSelection:te,selectSidebarTab:J,getSidebarTab:H}){const G=d.useCallback(ft=>{!te||!J||ft.sourceFile&&(J("code"),te(ft.sourceFile,{id:ft.id,selector:ft.selector,selectorIndex:ft.selectorIndex}))},[te,J]),{domEditSelection:F,domEditGroupSelections:Y,domEditHoverSelection:_,domEditSelectionRef:Q,applyDomSelection:R,clearDomSelection:X,buildDomSelectionFromTarget:B,resolveDomSelectionFromPreviewPoint:q,updateDomEditHoverSelection:W,buildDomSelectionForTimelineElement:ne,handleTimelineElementSelect:ae,refreshDomEditSelectionFromPreview:ue}=IZ({projectId:t,activeCompPath:e,isMasterView:n,compIdToSrc:r,captionEditMode:i,previewIframeRef:o,timelineElements:c,setSelectedTimelineElementId:h,setRightCollapsed:g,setRightPanelTab:O,previewIframe:$,refreshKey:Z,rightPanelTab:V}),{agentModalOpen:xe,agentModalAnchorPoint:fe,copiedAgentPrompt:ge,agentPromptSelectionContext:ke,setAgentModalOpen:je,setAgentPromptSelectionContext:Ie,setAgentModalAnchorPoint:Xe,handleAskAgent:xt,handleAgentModalSubmit:et}=VZ({activeCompPath:e,projectDir:M,projectIdRef:P,currentTime:f,showToast:x,domEditSelectionRef:Q,domEditSelection:F}),{handlePreviewCanvasMouseDown:ve,handlePreviewCanvasPointerMove:jt,handlePreviewCanvasPointerLeave:yt,handleBlockedDomMove:Le,handleDomManualDragStart:Zt}=qZ({captionEditMode:i,compositionLoading:l,previewIframeRef:o,showToast:x,applyDomSelection:R,resolveDomSelectionFromPreviewPoint:q,updateDomEditHoverSelection:W,onClickToSource:G}),{version:Ke,bump:Sn}=oR(),{animations:Ht,multipleTimelines:at,unsupportedTimelinePattern:an}=sR(b7?t??null:null,(F==null?void 0:F.sourceFile)||e||"index.html",F?{id:F.id??null,selector:F.selector??null}:null,Ke),{updateGsapProperty:ri,updateGsapMeta:Jn,deleteGsapAnimation:Pe,addGsapAnimation:At,addGsapProperty:St,removeGsapProperty:He}=iR({projectIdRef:P,activeCompPath:e,editHistory:T,domEditSaveTimestampRef:k,reloadPreview:D,onCacheInvalidate:Sn}),{resolveImportedFontAsset:tt,handleDomStyleCommit:ze,handleDomAttributeCommit:ln,handleDomHtmlAttributeCommit:Rn,handleDomTextCommit:xr,handleDomTextFieldStyleCommit:er,handleDomAddTextField:yr,handleDomRemoveTextField:br,handleDomPathOffsetCommit:wn,handleDomGroupPathOffsetCommit:ii,handleDomBoxSizeCommit:Hr,handleDomRotationCommit:el,handleDomManualEditsReset:ki,handleDomMotionCommit:tr,handleDomMotionClear:Nn,handleDomEditElementDelete:fa}=JZ({activeCompPath:e,previewIframeRef:o,showToast:x,queueDomEditSave:S,writeProjectFile:A,domEditSaveTimestampRef:k,editHistory:T,fileTree:E,importedFontAssetsRef:C,projectId:t,projectIdRef:P,reloadPreview:D,domEditSelection:F,applyDomSelection:R,clearDomSelection:X,refreshDomEditSelectionFromPreview:ue,buildDomSelectionFromTarget:B}),ye=d.useCallback((ft,mt,en)=>{F&&ri(F,ft,mt,en)},[F,ri]),Ne=d.useCallback((ft,mt)=>{F&&Jn(F,ft,mt)},[F,Jn]),lt=d.useCallback(ft=>{F&&Pe(F,ft)},[F,Pe]),Oe=d.useCallback(ft=>{F&&At(F,ft,f)},[F,At,f]),qe=d.useCallback((ft,mt)=>{F&&St(F,ft,mt)},[F,St]),vr=d.useCallback((ft,mt)=>{F&&He(F,ft,mt)},[F,He]);d.useEffect(()=>{if(!$)return;const ft=async()=>{if(!fn||i)return;const en=Q.current;if(!en)return;let Xr=null;try{Xr=$.contentDocument}catch{return}if(!Xr)return;pf(Xr);const _l=Bn(Xr,en,e);if(!_l){R(null,{revealPanel:!1});return}const Lu=await B(_l);Lu&&R(Lu,{revealPanel:!1,preserveGroup:!0})};L($),z.current($),ft(),b();const mt=()=>{L($),z.current($),ft(),b()};return $.addEventListener("load",mt),()=>{$.removeEventListener("load",mt)}},[e,R,B,i,Q,$,b,L,z]);const Sr=d.useRef(te);return Sr.current=te,d.useEffect(()=>{!F||!Sr.current||!H||F.sourceFile&&H()==="code"&&Sr.current(F.sourceFile,{id:F.id,selector:F.selector,selectorIndex:F.selectorIndex})},[F,H]),{domEditSelection:F,domEditGroupSelections:Y,domEditHoverSelection:_,agentModalOpen:xe,agentModalAnchorPoint:fe,copiedAgentPrompt:ge,agentPromptSelectionContext:ke,domEditSelectionRef:Q,handleTimelineElementSelect:ae,handlePreviewCanvasMouseDown:ve,handlePreviewCanvasPointerMove:jt,handlePreviewCanvasPointerLeave:yt,applyDomSelection:R,clearDomSelection:X,handleDomStyleCommit:ze,handleDomAttributeCommit:ln,handleDomHtmlAttributeCommit:Rn,handleDomPathOffsetCommit:wn,handleDomGroupPathOffsetCommit:ii,handleDomBoxSizeCommit:Hr,handleDomRotationCommit:el,handleDomManualEditsReset:ki,handleDomMotionCommit:tr,handleDomMotionClear:Nn,handleDomTextCommit:xr,handleDomTextFieldStyleCommit:er,handleDomAddTextField:yr,handleDomRemoveTextField:br,handleAskAgent:xt,handleAgentModalSubmit:et,handleBlockedDomMove:Le,handleDomManualDragStart:Zt,handleDomEditElementDelete:fa,buildDomSelectionFromTarget:B,buildDomSelectionForTimelineElement:ne,updateDomEditHoverSelection:W,resolveImportedFontAsset:tt,setAgentModalOpen:je,setAgentPromptSelectionContext:Ie,setAgentModalAnchorPoint:Xe,selectedGsapAnimations:Ht,gsapMultipleTimelines:at,gsapUnsupportedTimelinePattern:an,handleGsapUpdateProperty:ye,handleGsapUpdateMeta:Ne,handleGsapDeleteAnimation:lt,handleGsapAddAnimation:Oe,handleGsapAddProperty:qe,handleGsapRemoveProperty:vr}}const j7="Shift+T";function Es(t){var i,l,o;if(!t||typeof t!="object")return!1;const e=t,n=(i=e.tagName)==null?void 0:i.toLowerCase();if(n==="input"||n==="textarea"||n==="select"||e.isContentEditable)return!0;const r=(l=e.getAttribute)==null?void 0:l.call(e,"role");return r==="textbox"||r==="searchbox"||r==="combobox"?!0:!!((o=e.closest)!=null&&o.call(e,"input, textarea, select, [contenteditable='true'], [role='textbox'], .cm-editor"))}function uR(t){return t.metaKey||t.ctrlKey||t.altKey||!t.shiftKey||t.key.toLowerCase()!=="t"?!1:!Es(t.target)}function P7(t){return`${t?"Hide":"Show"} timeline editor (${j7})`}function p3(t){try{return(t==null?void 0:t.contentWindow)??null}catch{return null}}function g3(t,e,n){const r=t.key.toLowerCase();return r==="z"&&!t.shiftKey?(t.preventDefault(),e(),!0):r==="z"&&t.shiftKey||t.ctrlKey&&!t.metaKey&&r==="y"?(t.preventDefault(),n(),!0):!1}function fR({toggleTimelineVisibility:t,handleTimelineElementDelete:e,handleDomEditElementDelete:n,domEditSelectionRef:r,editHistory:i,readOptionalProjectFile:l,readProjectFile:o,writeProjectFile:c,domEditSaveTimestampRef:f,showToast:h,syncHistoryPreviewAfterApply:g,waitForPendingDomEditSaves:O,leftSidebarRef:x,handleCopy:b,handlePaste:S,handleCut:w}){const A=d.useRef(null),k=d.useRef(void 0),T=d.useRef(null),E=d.useCallback(_=>{uR(_)&&(_.preventDefault(),t())},[t]),C=d.useCallback(async _=>_===pp?l(_):o(_),[l,o]),M=d.useCallback(async(_,Q)=>{f.current=Date.now(),await c(_,Q)},[f,c]),P=d.useCallback(async()=>{await O();const _=await i.undo({readFile:C,writeFile:M});if(!_.ok&&_.reason==="content-mismatch"){h("File changed outside Studio. Undo history was not applied.","info");return}_.ok&&_.label&&(await g(_.paths),h(`Undid ${_.label}`,"info"))},[i,C,h,g,O,M]),$=d.useCallback(async()=>{await O();const _=await i.redo({readFile:C,writeFile:M});if(!_.ok&&_.reason==="content-mismatch"){h("File changed outside Studio. Redo history was not applied.","info");return}_.ok&&_.label&&(await g(_.paths),h(`Redid ${_.label}`,"info"))},[i,C,h,g,O,M]),Z=d.useRef(E);Z.current=E;const V=d.useRef(e);V.current=e;const z=d.useRef(n);z.current=n;const L=d.useRef(P);L.current=P;const D=d.useRef($);D.current=$;const I=d.useRef(b);I.current=b;const te=d.useRef(S);te.current=S;const J=d.useRef(w);J.current=w,k.current=_=>{var Q,R,X;if(Z.current(_),_.metaKey||_.ctrlKey){if(!t3(_.target)&&g3(_,()=>void L.current(),()=>void D.current()))return;if(_.key==="1"){_.preventDefault(),(Q=x.current)==null||Q.selectTab("compositions");return}if(_.key==="2"){_.preventDefault(),(R=x.current)==null||R.selectTab("assets");return}const B=_.key.toLowerCase();if(B==="c"&&!_.shiftKey&&!_.altKey&&!Es(_.target)){I.current()&&_.preventDefault();return}if(B==="v"&&!_.shiftKey&&!_.altKey&&!Es(_.target)){_.preventDefault(),te.current();return}if(B==="x"&&!_.shiftKey&&!_.altKey&&!Es(_.target)){(!!pe.getState().selectedElementId||!!r.current)&&(_.preventDefault(),J.current());return}}if(_.key.toLowerCase()==="f"&&!_.metaKey&&!_.ctrlKey&&!_.altKey&&!_.shiftKey&&!Es(_.target)){_.preventDefault(),document.fullscreenElement?document.exitFullscreen():(X=document.querySelector("[data-studio-fullscreen-target]"))==null||X.requestFullscreen();return}if((_.key==="Delete"||_.key==="Backspace")&&!_.metaKey&&!_.ctrlKey&&!_.altKey&&!Es(_.target)){const{selectedElementId:B,elements:q}=pe.getState();if(B){const ne=q.find(ae=>(ae.key??ae.id)===B);if(ne){_.preventDefault(),V.current(ne);return}}const W=r.current;W&&(_.preventDefault(),z.current(W))}},d.useEffect(()=>{function _(Q){var R;(R=k.current)==null||R.call(k,Q)}return window.addEventListener("keydown",_,!0),()=>window.removeEventListener("keydown",_,!0)},[]);const H=d.useCallback(_=>{var Q;(Q=k.current)==null||Q.call(k,_)},[]),G=d.useCallback(_=>{const Q=p3(_);if(A.current!==Q){if(A.current)try{A.current.removeEventListener("keydown",H)}catch{}A.current=Q;try{Q==null||Q.addEventListener("keydown",H,!0)}catch{}}},[H]);d.useEffect(()=>()=>{if(A.current){try{A.current.removeEventListener("keydown",H)}catch{}A.current=null}},[H]);const F=d.useCallback(_=>{(_.metaKey||_.ctrlKey)&&(t3(_.target)||g3(_,()=>void L.current(),()=>void D.current()))},[]),Y=d.useCallback(_=>{var X;(X=T.current)==null||X.call(T),T.current=null;const Q=p3(_);let R=null;try{R=(_==null?void 0:_.contentDocument)??null}catch{R=null}if(!(!Q&&!R)){try{Q==null||Q.addEventListener("keydown",F,!0)}catch{}R==null||R.addEventListener("keydown",F,!0),T.current=()=>{try{Q==null||Q.removeEventListener("keydown",F,!0)}catch{}R==null||R.removeEventListener("keydown",F,!0)}}},[F]);return d.useEffect(()=>()=>{var _;(_=T.current)==null||_.call(T),T.current=null},[]),{handleUndo:P,handleRedo:$,syncPreviewTimelineHotkey:G,syncPreviewHistoryHotkey:Y,handleTimelineToggleHotkey:E}}function dR(t,e,n,r){if(n){const o=r??0;let c=0,f=null;if(n.startsWith("#")){const h=n.slice(1);f=new RegExp(`<[a-z][^>]*\\bid="${h}"[^>]*>`,"gi")}else if(n.startsWith(".")){const h=n.slice(1);f=new RegExp(`<[a-z][^>]*\\bclass="[^"]*\\b${h}\\b[^"]*"[^>]*>`,"gi")}else if(n.startsWith("[")){const h=n.slice(1,-1);f=new RegExp(`<[a-z][^>]*\\b${h}[^>]*>`,"gi")}if(f){let h;for(;(h=f.exec(t))!==null;){if(c===o){const g=hR(t,h.index);if(g>0)return t.slice(0,g)+`
 `+e+t.slice(g)}c++}}}const l=/<[^>]*data-composition-id="[^"]+"[^>]*>/i.exec(t);if(l&&l.index!=null){const o=l.index+l[0].length;return t.slice(0,o)+e+t.slice(o)}return t+e}function hR(t,e){const n=t.indexOf(">",e);if(n<0)return-1;if(t[n-1]==="/")return n+1;const r=t.slice(e).match(/^<([a-z][a-z0-9]*)/i);if(!r)return-1;const i=r[1];let l=1,o=n+1;const c=new RegExp(`<${i}(?:\\s|>|/>)`,"gi"),f=new RegExp(`</${i}\\s*>`,"gi");for(;l>0&&o<t.length;){c.lastIndex=o,f.lastIndex=o;const h=c.exec(t),g=f.exec(t);if(!g)return-1;if(h&&h.index<g.index)t.lastIndexOf("/",t.indexOf(">",h.index))>h.index||l++,o=t.indexOf(">",h.index)+1;else{if(l--,l===0)return g.index+g[0].length;o=g.index+g[0].length}}return-1}function mR(t,e){const n=new Set(e);return t.replace(new RegExp('(?<=\\s)id="([^"]+)"',"g"),(r,i)=>{if(!n.has(i))return r;let l=2;for(;n.has(`${i}-${l}`);)l++;const o=`${i}-${l}`;return n.add(o),`id="${o}"`})}async function pR(t,e){const n=await fetch(`/api/projects/${t}/files/${encodeURIComponent(e)}`);if(!n.ok)throw new Error(`Failed to read ${e}`);const r=await n.json();if(typeof r.content!="string")throw new Error(`Missing file contents for ${e}`);return r.content}function gR(t,e){var i;let n=null;try{n=((i=t.current)==null?void 0:i.contentDocument)??null}catch{return null}if(!n)return null;let r=null;return e.id&&(r=n.getElementById(e.id)),!r&&e.selector&&(r=n.querySelectorAll(e.selector)[e.selectorIndex??0]??null),r&&"outerHTML"in r?r.outerHTML:null}function OR({projectId:t,activeCompPath:e,domEditSelectionRef:n,showToast:r,writeProjectFile:i,recordEdit:l,domEditSaveTimestampRef:o,reloadPreview:c,handleTimelineElementDelete:f,handleDomEditElementDelete:h,previewIframeRef:g}){const O=d.useRef(null),x=d.useRef(t);x.current=t;const b=d.useCallback(()=>{var E;const{selectedElementId:A,elements:k}=pe.getState();if(A){const C=k.find(Z=>(Z.key??Z.id)===A);if(!C)return!1;const M=C.sourceFile||e||"index.html";let P=null;try{const Z=(E=g.current)==null?void 0:E.contentDocument;if(Z){let V=null;C.domId&&(V=Z.getElementById(C.domId)),!V&&C.selector&&(V=Z.querySelectorAll(C.selector)[C.selectorIndex??0]??null),V&&"outerHTML"in V&&(P=V.outerHTML)}}catch{}if(!P)return r("Unable to copy this element.","info"),!1;const $={kind:"timeline-clip",html:P,sourceFile:M};return O.current=$,r("Copied clip","info"),!0}const T=n.current;if(T){const C=gR(g,T);if(!C)return r("Unable to copy this element.","info"),!1;const M=T.sourceFile||e||"index.html",P={kind:"dom-element",html:C,sourceFile:M,originSelector:T.selector,originSelectorIndex:T.selectorIndex};return O.current=P,r("Copied element","info"),!0}return!1},[e,n,g,r]),S=d.useCallback(async()=>{const A=O.current;if(!A){r("Nothing to paste.","info");return}const k=x.current;if(!k)return;const T=e||"index.html";try{const E=await pR(k,T),C=Kg(E),M=mR(A.html,C);let P;if(A.kind==="timeline-clip"){const{currentTime:$}=pe.getState(),Z=M.indexOf(">"),L=(Z>=0?M.slice(0,Z+1):M).replace(/data-start="[^"]*"/,`data-start="${kn($)}"`)+M.slice(Z+1);P=Lg(E,L)}else P=dR(E,M,A.originSelector,A.originSelectorIndex);o.current=Date.now(),await El({projectId:k,label:A.kind==="timeline-clip"?"Paste clip":"Paste element",kind:"timeline",files:{[T]:P},readFile:async()=>E,writeFile:i,recordEdit:l}),c(),r(A.kind==="timeline-clip"?"Pasted clip":"Pasted element","info")}catch(E){const C=E instanceof Error?E.message:"Failed to paste";r(C)}},[e,o,l,c,r,i]),w=d.useCallback(async()=>{if(!b())return!1;const{selectedElementId:k,elements:T}=pe.getState();if(k){const C=T.find(M=>(M.key??M.id)===k);if(C)return await f(C),!0}const E=n.current;return E&&await h(E),!0},[b,n,f,h]);return{handleCopy:b,handlePaste:S,handleCut:w}}const Z7={fontFamily:"sans-serif",fontSize:48,fontWeight:700,fontStyle:"normal",textDecoration:"none",textTransform:"none",letterSpacing:0,lineHeight:1.2,color:"#ffffff",activeColor:"#ffffff",dimColor:"rgba(255, 255, 255, 0.3)",opacity:1,gradientFill:null,strokeWidth:0,strokeColor:"#000000",shadows:[],glow:null,x:0,y:0,rotation:0,scaleX:1,scaleY:1,skewX:0,skewY:0,transformOrigin:"center center",blendMode:"normal"},xR={backgroundColor:"transparent",backgroundOpacity:0,paddingTop:0,paddingRight:0,paddingBottom:0,paddingLeft:0,borderRadius:0,borderWidth:0,borderColor:"transparent",borderStyle:"solid",boxShadow:"none"},O3={preset:"fade",duration:.2,ease:"power2.out",stagger:0,staggerDirection:"start",intensity:1},Ts={entrance:O3,highlight:null,exit:{...O3}};function yR(t,e){const{width:n,height:r,duration:i,wordsPerGroup:l=5}=e,o=new Map,c=new Map,f=[];for(let h=0;h<t.length;h+=l){const g=t.slice(h,h+l),O=`group-${h/l}`,x=[];g.forEach((S,w)=>{const A=`segment-${h+w}`,k={id:A,wordId:S.id??`w${h+w}`,text:S.text,start:S.start,end:S.end,groupIndex:w,style:{},animation:{}};o.set(A,k),x.push(A)});const b={id:O,segmentIds:x,style:{...Z7},animation:{entrance:{...Ts.entrance},highlight:Ts.highlight,exit:{...Ts.exit}},containerStyle:{...xR}};c.set(O,b),f.push(O)}return{width:n,height:r,duration:i,segments:o,groups:c,groupOrder:f,defaultAnimation:{entrance:{...Ts.entrance},highlight:Ts.highlight,exit:{...Ts.exit}}}}function bR(t){const e=/(?:const|let|var)\s+(?:TRANSCRIPT|script)\s*=\s*(\[[\s\S]*?\]);/,n=t.match(e);if(!n)return[];const r=n[1];try{return SR(r)}catch{return[]}}function vR(t,e,n,r,i,l){const o=bR(n);if(o.length===0)return null;const c=t.querySelectorAll(".caption-group, .caption-line, .caption-block"),f=t.querySelectorAll(".word, .caption-word");let h=5;c.length>0&&f.length>0&&(h=Math.round(f.length/c.length),h<1&&(h=1));const g=yR(o,{width:r,height:i,duration:l,wordsPerGroup:h}),O=f.item(0),x=c.item(0),b=O??x;if(b){const S=e.getComputedStyle(b),w={},A=parseFloat(S.fontSize);!isNaN(A)&&A>0&&(w.fontSize=A);const k=S.fontWeight;if(k){const $=parseInt(k,10);w.fontWeight=isNaN($)?k:$}const T=S.fontFamily;T&&(w.fontFamily=T);const E=S.color;E&&(w.color=E);const C=S.textTransform;(C==="none"||C==="uppercase"||C==="lowercase"||C==="capitalize")&&(w.textTransform=C);const M=S.letterSpacing;if(M&&M!=="normal"){const $=parseFloat(M),Z=w.fontSize??Z7.fontSize;!isNaN($)&&Z>0&&(w.letterSpacing=$/Z)}const P={};if(x){const $=e.getComputedStyle(x),Z=$.backgroundColor;Z&&Z!=="rgba(0, 0, 0, 0)"&&Z!=="transparent"&&(P.backgroundColor=Z,P.backgroundOpacity=1);const V=parseFloat($.borderRadius);!isNaN(V)&&V>0&&(P.borderRadius=V);const z=parseFloat($.paddingTop),L=parseFloat($.paddingRight),D=parseFloat($.paddingBottom),I=parseFloat($.paddingLeft);isNaN(z)||(P.paddingTop=z),isNaN(L)||(P.paddingRight=L),isNaN(D)||(P.paddingBottom=D),isNaN(I)||(P.paddingLeft=I)}for(const $ of g.groupOrder){const Z=g.groups.get($);Z&&(Z.style={...Z.style,...w},Z.containerStyle={...Z.containerStyle,...P})}}return g}function SR(t){let e;try{e=JSON.parse(t)}catch{let r=t;r=r.replace(/'((?:[^'\\]|\\.)*)'/g,(i,l)=>`"${l.replace(/\\'/g,"'").replace(/"/g,'\\"')}"`),r=r.replace(/([{,]\s*)([a-zA-Z_$][a-zA-Z0-9_$]*)\s*:/g,'$1"$2":'),r=r.replace(/,(\s*[}\]])/g,"$1"),e=JSON.parse(r)}if(!Array.isArray(e))return[];const n=[];for(const r of e)if(r!==null&&typeof r=="object"&&typeof r.text=="string"&&typeof r.start=="number"&&typeof r.end=="number"){const i=r;n.push({...typeof i.id=="string"?{id:i.id}:{},text:i.text,start:i.start,end:i.end})}return n}function wR({projectId:t,activeCompPath:e,compIdToSrc:n,captionEditMode:r,captionHasSelection:i,previewIframeRef:l,captionSync:o,setRightCollapsed:c}){d.useEffect(()=>{if(!t)return;let f=!1;const h=()=>{if(rt.getState().isEditMode||f)return;const O=l.current;let x=null,b=null;try{x=(O==null?void 0:O.contentDocument)??null,b=(O==null?void 0:O.contentWindow)??null}catch{return}if(!x||!b||x.querySelectorAll(".caption-group").length===0)return;let w=null;const A=x.querySelectorAll("[data-composition-src], [data-composition-file]");for(const T of A){const E=T.getAttribute("data-composition-src")||T.getAttribute("data-composition-file");if(E&&E.includes("captions")){w=E;break}}if(!w){for(const[T,E]of n)if(T.includes("caption")||E.includes("caption")){w=E;break}}if(!w&&(e!=null&&e.includes("captions"))&&(w=e),!w){const T=x.querySelector('[data-composition-id*="caption"]');if(T){const E=T.getAttribute("data-composition-id")||"";w=n.get(E)||null}}if(!w)return;f=!0;const k=w;fetch(`/api/projects/${t}/files/${encodeURIComponent(k)}`).then(T=>T.json()).then(T=>{if(!T.content||!x||!b||rt.getState().isEditMode)return;const E=x.querySelector("[data-composition-id]"),C=parseInt((E==null?void 0:E.getAttribute("data-width"))??"1920",10),M=parseInt((E==null?void 0:E.getAttribute("data-height"))??"1080",10),P=parseFloat((E==null?void 0:E.getAttribute("data-duration"))??"0"),$=vR(x,b,T.content,C,M,P);if(!$)return;const Z=rt.getState();Z.setModel($),Z.setSourceFilePath(k),Z.setEditMode(!0),o.loadOverrides()}).catch(()=>{}).finally(()=>{f=!1})},g=O=>{const x=O.data;(x==null?void 0:x.source)==="hf-preview"&&((x==null?void 0:x.type)==="state"||(x==null?void 0:x.type)==="timeline")&&h()};return window.addEventListener("message",g),h(),()=>{window.removeEventListener("message",g)}},[e,t,n,o,l]),d.useEffect(()=>{r&&c(!i)},[i,r,c])}const R7=2,AR=1,x3=R7+AR;function kR(t,e){const n=[],r=Math.floor(t.length/e);if(r===0)return Array(e).fill(0);for(let l=0;l<e;l++){let o=0;const c=l*r,f=Math.min(c+r,t.length);for(let h=c;h<f;h++){const g=Math.abs(t[h]??0);g>o&&(o=g)}n.push(o)}const i=Math.max(...n,.001);return n.map(l=>l/i)}function MR(t,e){let n=0;for(let l=0;l<t.length;l++)n=(n<<5)-n+t.charCodeAt(l)|0;n=Math.abs(n)||42;const r=()=>(n=n*16807%2147483647,(n&2147483647)/2147483647),i=[];for(let l=0;l<e;l++){const o=l/e,c=.3+.3*Math.sin(o*Math.PI*3.2)+.2*Math.sin(o*Math.PI*7.1);i.push(Math.max(.05,Math.min(1,c*(.4+.6*r()))))}return i}const y3=new Map,Km=new Map,TR=d.memo(function({audioUrl:e,waveformUrl:n,label:r,labelColor:i}){const l=d.useRef(null),o=d.useRef(null),c=d.useRef(null),f=n??e,[h,g]=d.useState(y3.get(f)??null);d.useEffect(()=>{if(h||!f)return;let b=!1,S=Km.get(f);return S||(S=(n?fetch(n).then(w=>w.json()).then(w=>{if(!Array.isArray(w.peaks))throw new Error("bad response");return w.peaks}):fetch(e).then(w=>w.arrayBuffer()).then(w=>{const A=new AudioContext;return A.decodeAudioData(w).finally(()=>A.close())}).then(w=>kR(w.getChannelData(0),4e3))).catch(()=>MR(f,4e3)).then(w=>(y3.set(f,w),w)).finally(()=>Km.delete(f)),Km.set(f,S)),S.then(w=>{b||g(w)}),()=>{b=!0}},[e,n,f,h]);const O=d.useCallback(()=>{const b=l.current,S=o.current;if(!b||!S||!h)return;const w=b.clientWidth||400,A=Math.min(Math.floor(w/x3),h.length);let k="";for(let T=0;T<A;T++){const E=Math.floor(T/A*h.length),C=h[E]??0,M=Math.max(3,Math.round(C*100)),P=(.45+C*.4).toFixed(2);k+=`<div style="position:absolute;bottom:0;left:${T*x3}px;width:${R7}px;height:${M}%;background:rgba(75,163,210,${P})"></div>`}S.innerHTML=k},[h]),x=d.useCallback(b=>{var S;(S=c.current)==null||S.disconnect(),l.current=b,b&&(O(),c.current=new ResizeObserver(()=>O()),c.current.observe(b))},[O]);return d.useEffect(()=>{O()},[O]),d.useEffect(()=>()=>{var b;(b=c.current)==null||b.disconnect()},[]),p.jsxs("div",{ref:x,className:"absolute inset-0 overflow-hidden",children:[p.jsx("div",{ref:o,className:"absolute left-0 right-0 bottom-0",style:{top:16}}),!h&&p.jsx("div",{className:"absolute left-0 right-0 bottom-0 animate-pulse",style:{top:16,background:"linear-gradient(90deg, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.05) 50%, rgba(255,255,255,0.02) 100%)"}}),p.jsx("div",{className:"absolute top-0 left-0 right-0 px-1.5 py-0.5 z-10",children:p.jsx("span",{className:"text-[9px] font-semibold truncate block leading-tight",style:{color:i,textShadow:"0 1px 3px rgba(0,0,0,0.9)"},children:r})})]})});function CR(t,e,n){try{const r=new URL(t,n),i=`/api/projects/${e}/preview/`;if(r.pathname.startsWith(i))return r.pathname.slice(i.length)}catch{}return t}function ER({projectIdRef:t,compIdToSrc:e,activePreviewUrl:n,effectiveTimelineDuration:r}){return d.useCallback((i,l)=>{var h;const o=t.current;if(!o)return null;let c=i.compositionSrc;if(c&&(c=CR(c,o,window.location.origin)),c&&e.size>0){const g=e.get(i.id)||e.get(c.replace(/^compositions\//,"").replace(/\.html$/,""));g&&(c=g)}if(c)return d.createElement(Lm,{previewUrl:`/api/projects/${o}/preview/comp/${c}`,label:Cs(i),labelColor:l.label,seekTime:0,duration:i.duration});if(n&&i.duration>0)return d.createElement(Lm,{previewUrl:n,label:Cs(i),labelColor:l.label,selector:i.selector,selectorIndex:i.selectorIndex,seekTime:i.start,duration:i.duration});const f=i.duration>0&&r>0&&i.duration<r*.92&&!/(backdrop|background|overlay|scrim|mask)/i.test(i.id);if(i.tag==="audio"){const g=`/api/projects/${o}/preview/`,O=(h=i.src)!=null&&h.startsWith("http")?i.src.indexOf(g):-1,x=i.src?O!==-1?decodeURIComponent(i.src.slice(O+g.length)):i.src.startsWith("http")?null:i.src:null,b=x?`/api/projects/${o}/preview/${x}`:i.src??"",S=x?`/api/projects/${o}/waveform/${x}`:void 0;return d.createElement(TR,{audioUrl:b,waveformUrl:S,label:Cs(i),labelColor:l.label})}if((i.tag==="video"||i.tag==="img")&&i.src){const g=i.src.startsWith("http")?i.src:`/api/projects/${o}/preview/${i.src}`;return d.createElement(v$,{videoSrc:g,label:Cs(i),labelColor:l.label,duration:i.duration})}return f?d.createElement(Lm,{previewUrl:`/api/projects/${o}/preview`,label:Cs(i),labelColor:l.label,selector:i.selector,selectorIndex:i.selectorIndex,seekTime:i.start,duration:i.duration}):null},[t,e,n,r])}function $R(t){const[e,n]=d.useState(null),r=d.useRef([]),i=d.useCallback(()=>{r.current=[],n(null)},[]);return d.useEffect(()=>{if(!t)return;const l=()=>{try{const c=t.contentWindow;if(!c||c.__hfErrorCapture)return;c.__hfErrorCapture=!0;const f=c.console.error.bind(c.console);c.console.error=function(...h){f(...h);const g=h.map(O=>O instanceof Error?O.message:String(O)).join(" ");g.includes("favicon")||(r.current=[...r.current,{severity:"error",message:g}],n([...r.current]))},c.addEventListener("error",h=>{const g=h.message||String(h);r.current=[...r.current,{severity:"error",message:g}],n([...r.current])})}catch{}};l();const o=()=>{r.current=[],n(null),l()};return t.addEventListener("load",o),()=>t.removeEventListener("load",o)},[t]),{consoleErrors:e,setConsoleErrors:n,resetErrors:i}}const Ep="#project/";function QR(t){try{return decodeURIComponent(t)}catch{return t}}function jR(t){if(!t)return new URLSearchParams;if(t instanceof URLSearchParams)return t;const e=new URLSearchParams;for(const[n,r]of Object.entries(t))!n||r==null||r===""||e.set(n,r);return e}function N7(t){return encodeURIComponent(t)}function V7(t,e){const n=jR(e).toString();return`${Ep}${N7(t)}${n?`?${n}`:""}`}function L7(t){if(!t.startsWith(Ep))return null;const e=t.slice(Ep.length),n=e.indexOf("?"),r=n>=0?e.slice(0,n):e;if(!r||r.includes("/"))return null;const i=n>=0?e.slice(n+1):"";return{projectId:QR(r),params:new URLSearchParams(i)}}function b3(t){var e;return((e=L7(t))==null?void 0:e.projectId)??null}function PR(t,e=""){const n=e&&!e.startsWith("/")?`/${e}`:e;return`/api/projects/${N7(t)}${n}`}function _7(t){return t&&t!=="master"?t:"index.html"}function v3({projectId:t,compositionPath:e,currentTime:n,origin:r=window.location.origin}){const i=_7(e),l=new URL(PR(t,`/thumbnail/${encodeURIComponent(i)}`),r);return l.searchParams.set("t",Math.max(0,n).toFixed(3)),l.searchParams.set("format","png"),l.searchParams.set("v",String(Date.now())),l.toString()}function S3(t,e){var l;const r=((l=_7(t).split("/").pop())==null?void 0:l.replace(/\.html$/i,""))||"frame",i=Math.max(0,e).toFixed(3).replace(".","-");return`${r}-${i}s.png`}function ZR({projectId:t,activeCompPath:e,showToast:n,waitForPendingDomEditSaves:r}){const[i,l]=d.useState(0);Pt(()=>(l(pe.getState().currentTime),Zr.subscribe(l)));const o=d.useCallback(()=>{l(pe.getState().currentTime)},[]),c=d.useCallback(async g=>{if(t){g.preventDefault();try{const O=pe.getState().currentTime;l(O),await Promise.race([r(),new Promise((A,k)=>setTimeout(()=>k(new Error("Save queue timed out")),5e3))]);const x=v3({projectId:t,compositionPath:e,currentTime:O}),b=S3(e,O),S=new AbortController,w=setTimeout(()=>S.abort(),3e4);try{const A=await fetch(x,{cache:"no-store",signal:S.signal});if(clearTimeout(w),!A.ok){let C=`Capture failed (${A.status})`;try{const M=await A.json();M!=null&&M.error&&(C=M.error)}catch{}throw new Error(C)}const k=await A.blob(),T=URL.createObjectURL(k),E=document.createElement("a");E.href=T,E.download=b,document.body.appendChild(E),E.click(),E.remove(),setTimeout(()=>URL.revokeObjectURL(T),0)}catch(A){throw clearTimeout(w),A instanceof DOMException&&A.name==="AbortError"?new Error("Capture timed out — the server took too long to respond"):A}}catch(O){n(O instanceof Error?O.message:"Capture failed","error")}}},[e,t,n,r]),f=t?v3({projectId:t,compositionPath:e,currentTime:i}):"#",h=S3(e,i);return{captureFrameHref:f,captureFrameFilename:h,handleCaptureFrameClick:c,refreshCaptureFrameTime:o}}function RR(t){const[e,n]=d.useState(null),[r,i]=d.useState(!1),l=d.useCallback(async()=>{if(t){i(!0);try{const f=await(await fetch(`/api/projects/${t}/lint`)).json();n((f.findings??[]).map(h=>({severity:h.severity==="error"?"error":"warning",message:h.message??"",file:h.file,fixHint:h.fixHint})))}catch(c){const f=c instanceof Error?c.message:String(c);n([{severity:"error",message:`Failed to run lint: ${f}`}])}finally{i(!1)}}},[t]),o=d.useCallback(()=>n(null),[]);return{lintModal:e,linting:r,handleLint:l,closeLintModal:o}}function NR(){const[t,e]=d.useState(null);return Pt(()=>{const n=r=>{const i=r.data;if((i==null?void 0:i.source)!=="hf-preview"||(i==null?void 0:i.type)!=="stage-size")return;const{width:l,height:o}=i;!(l>0)||!(o>0)||e(c=>c&&c.width===l&&c.height===o?c:{width:l,height:o})};return window.addEventListener("message",n),()=>window.removeEventListener("message",n)}),t}function VR(){const[t,e]=d.useState(null),n=d.useRef(null),r=d.useCallback((i,l="error")=>{n.current&&clearTimeout(n.current),e({message:i,tone:l}),n.current=setTimeout(()=>e(null),4e3)},[]);return Pt(()=>()=>{n.current&&clearTimeout(n.current)}),{appToast:t,showToast:r}}const D7=["layers","design","motion","renders"];function LR(t,e={}){if(!t||!D7.includes(t))return null;const n=e.inspectorPanelsEnabled??fn,r=e.motionPanelEnabled??Jg;return!n&&t!=="renders"?"renders":t==="motion"&&!r?"design":t}function _R(t,e){return!t||t==="index.html"?null:e.includes(t)?t:null}function w3(t){return t==="1"?!0:t==="0"?!1:null}function H7(t){if(t==null||t==="")return null;const e=Number(t);return Number.isFinite(e)?e:null}function DR(t){return D7.includes(t)?t:null}function HR(t){const e=t.get("selFile")||void 0,n=t.get("selId")||void 0,r=t.get("selSelector")||void 0,i=H7(t.get("selIndex"));return!e&&!n&&!r?null:{sourceFile:e,id:n,selector:r,selectorIndex:i!=null?Math.max(0,Math.floor(i)):void 0}}function X7(){return{activeCompPath:null,currentTime:null,rightPanelTab:null,rightCollapsed:null,timelineVisible:null,selection:null}}function XR(t){const e=L7(t);if(!e)return X7();const{params:n}=e;return{activeCompPath:n.get("comp")||null,currentTime:H7(n.get("t")),rightPanelTab:LR(DR(n.get("tab"))),rightCollapsed:w3(n.get("rc")),timelineVisible:w3(n.get("tv")),selection:HR(n)}}function zR(){return typeof window>"u"?X7():XR(window.location.hash)}function A3(t,e){const n=new URLSearchParams;return n.set("v","1"),e.activeCompPath&&n.set("comp",e.activeCompPath),e.currentTime!=null&&Number.isFinite(e.currentTime)&&n.set("t",String(Math.max(0,Math.round(e.currentTime*1e3)/1e3))),e.rightPanelTab&&n.set("tab",e.rightPanelTab),e.rightCollapsed!=null&&n.set("rc",e.rightCollapsed?"1":"0"),e.timelineVisible!=null&&n.set("tv",e.timelineVisible?"1":"0"),e.selection&&(e.selection.sourceFile&&n.set("selFile",e.selection.sourceFile),e.selection.id&&n.set("selId",e.selection.id),e.selection.selector&&n.set("selSelector",e.selection.selector),typeof e.selection.selectorIndex=="number"&&n.set("selIndex",String(Math.max(0,Math.floor(e.selection.selectorIndex))))),V7(t,n)}function FR(t){return!t||!t.id&&!t.selector?null:{sourceFile:t.sourceFile||void 0,id:t.id||void 0,selector:t.selector||void 0,selectorIndex:t.selectorIndex??void 0}}function k3(t){typeof window>"u"||window.location.hash!==t&&window.history.replaceState(null,"",t)}function BR({projectId:t,activeCompPath:e,currentTime:n,duration:r,isPlaying:i,compositionLoading:l,refreshKey:o,previewIframeRef:c,rightPanelTab:f,rightCollapsed:h,timelineVisible:g,activeCompPathHydrated:O,domEditSelection:x,buildDomSelectionFromTarget:b,applyDomSelection:S,initialState:w}){const A=d.useRef(w.currentTime==null),k=d.useRef(w.currentTime==null),T=d.useRef(w.selection==null),E=d.useRef(w.selection),C=d.useRef(w.currentTime),M=d.useCallback(()=>({activeCompPath:e,currentTime:C.current,rightPanelTab:f,rightCollapsed:h,timelineVisible:g,selection:T.current?FR(x):E.current}),[e,x,h,f,g]);d.useEffect(()=>{if(!t||A.current||l)return;const P=r>0?Jc(w.currentTime??0,0,r):Math.max(0,w.currentTime??0);pe.getState().requestSeek(P),C.current=P,A.current=!0},[t,l,r,w.currentTime]),d.useEffect(()=>{var z;if(!t||T.current||l||!A.current||w.currentTime!=null&&Math.abs(n-C.current)>.05)return;const $=E.current;if(!$){T.current=!0;return}let Z=null;try{Z=((z=c.current)==null?void 0:z.contentDocument)??null}catch{return}if(!Z)return;const V=Bn(Z,{sourceFile:$.sourceFile??"",id:$.id,selector:$.selector,selectorIndex:$.selectorIndex},e);if(!V){S(null,{revealPanel:!1}),T.current=!0,E.current=null;return}T.current=!0,E.current=null,b(V,{preferClipAncestor:!1}).then(L=>{S(L,{revealPanel:!1})})},[e,S,b,l,n,w.currentTime,c,t,o]),d.useEffect(()=>{if(k.current)return;const P=C.current;if(P==null){k.current=!0;return}Math.abs(n-P)>.05||(k.current=!0)},[n]),d.useEffect(()=>{if(!O||!A.current||!k.current||!t||i)return;const P=window.setTimeout(()=>{C.current=Jc(n,0,Math.max(0,r)),k3(A3(t,M()))},200);return()=>window.clearTimeout(P)},[O,M,n,r,i,t]),d.useEffect(()=>{O&&t&&k3(A3(t,M()))},[O,M,t])}function YR(t){if(!t||typeof window>"u")return;const e=480,n=270,r=16,i=Jc(t.x,r+e/2,window.innerWidth-r-e/2),l=Jc(t.y+12,r,window.innerHeight-r-n);return{left:i,top:l,transform:"translateX(-50%)"}}function IR({selectionLabel:t,anchorPoint:e=null,onSubmit:n,onClose:r}){const[i,l]=d.useState(""),o=d.useRef(null),c=YR(e);Pt(()=>{requestAnimationFrame(()=>{var h;return(h=o.current)==null?void 0:h.focus()})});const f=()=>{i.trim()&&n(i.trim())};return p.jsx("div",{className:e?"fixed inset-0 z-[100] bg-black/60 backdrop-blur-sm":"fixed inset-0 z-[100] flex items-center justify-center bg-black/60 backdrop-blur-sm",onClick:r,children:p.jsxs("div",{className:`w-[480px] rounded-2xl border border-neutral-800 bg-neutral-950 shadow-2xl ${e?"fixed":""}`,style:c,onClick:h=>h.stopPropagation(),children:[p.jsxs("div",{className:"flex items-center justify-between px-5 py-4 border-b border-neutral-800/60",children:[p.jsxs("div",{children:[p.jsx("h3",{className:"text-sm font-medium text-neutral-200",children:"Ask agent"}),p.jsx("p",{className:"text-xs text-neutral-500 mt-0.5",children:t.length>50?`${t.slice(0,49)}…`:t})]}),p.jsx("button",{className:"p-1 rounded-md text-neutral-500 hover:text-neutral-300 hover:bg-neutral-800/50",onClick:r,children:p.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:[p.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),p.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]}),p.jsx("div",{className:"px-5 py-4",children:p.jsx("textarea",{ref:o,className:"w-full h-24 px-3 py-2 rounded-lg border border-neutral-800 bg-neutral-900/60 text-sm text-neutral-200 placeholder-neutral-600 resize-none focus:outline-none focus:border-studio-accent/60 focus:ring-1 focus:ring-studio-accent/30",placeholder:"Describe what you want to change…",value:i,onChange:h=>l(h.target.value),onKeyDown:h=>{h.key==="Enter"&&(h.metaKey||h.ctrlKey)&&f(),h.key==="Escape"&&r()}})}),p.jsxs("div",{className:"flex items-center justify-between px-5 py-3 border-t border-neutral-800/60",children:[p.jsxs("span",{className:"text-[11px] text-neutral-600",children:[navigator.platform.includes("Mac")?"⌘":"Ctrl","+Enter to copy"]}),p.jsx("button",{className:"px-4 py-1.5 rounded-lg bg-studio-accent/90 text-xs font-medium text-neutral-950 hover:bg-studio-accent disabled:opacity-40 disabled:cursor-not-allowed",disabled:!i.trim(),onClick:f,children:"Copy prompt"})]})]})})}function qR(){return p.jsx("div",{className:"absolute inset-0 z-[90] flex items-center justify-center bg-black/50 backdrop-blur-sm pointer-events-none",children:p.jsxs("div",{className:"flex flex-col items-center gap-3 px-8 py-6 rounded-xl border-2 border-dashed border-studio-accent/60 bg-studio-accent/[0.06]",children:[p.jsxs("svg",{width:"32",height:"32",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round",className:"text-studio-accent",children:[p.jsx("path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"}),p.jsx("polyline",{points:"7 10 12 15 17 10"}),p.jsx("line",{x1:"12",y1:"15",x2:"12",y2:"3"})]}),p.jsx("span",{className:"text-sm font-medium text-studio-accent",children:"Drop files to import into project"})]})})}const It=t=>({title:n,...r})=>p.jsx(t,{alt:n,"aria-label":n,"aria-hidden":n?void 0:!0,...r}),UR=It(FQ),WR=It(YQ),z7=It(qQ),F7=It(cj),gf=It(xj),GR=It(zQ),KR=It(DQ),JR=It(mj),eN=It(pj),n8=It(FS),tN=It(Oj),M3=It(bj),Jf=It(wj),r8=It(hj),nN=It(XQ),rN=It(uS),iN=It(BQ),i8=It(LQ),aN=It(HQ),lN=It(VQ),sN=It(fj),B7=d.createContext(null);function mo(){const t=d.useContext(B7);if(!t)throw new Error("useStudioContext must be used within StudioProvider");return t}function oN({value:t,children:e}){const{projectId:n,activeCompPath:r,setActiveCompPath:i,showToast:l,previewIframeRef:o,captionEditMode:c,compositionLoading:f,refreshKey:h,setRefreshKey:g,currentTime:O,timelineElements:x,isPlaying:b,editHistory:S,handleUndo:w,handleRedo:A,renderQueue:k,compositionDimensions:T,waitForPendingDomEditSaves:E,handlePreviewIframeRef:C,refreshPreviewDocumentVersion:M,timelineVisible:P,toggleTimelineVisibility:$}=t,Z=d.useMemo(()=>({projectId:n,activeCompPath:r,setActiveCompPath:i,showToast:l,previewIframeRef:o,captionEditMode:c,compositionLoading:f,refreshKey:h,setRefreshKey:g,currentTime:O,timelineElements:x,isPlaying:b,editHistory:S,handleUndo:w,handleRedo:A,renderQueue:k,compositionDimensions:T,waitForPendingDomEditSaves:E,handlePreviewIframeRef:C,refreshPreviewDocumentVersion:M,timelineVisible:P,toggleTimelineVisibility:$}),[n,r,c,f,h,O,b,T,P,S,x,k,i,l,o,g,w,A,E,C,M,$]);return p.jsx(B7,{value:Z,children:e})}const Y7=d.createContext(null);function a8(){const t=d.useContext(Y7);if(!t)throw new Error("usePanelLayoutContext must be used within PanelLayoutProvider");return t}function cN({value:{leftWidth:t,setLeftWidth:e,rightWidth:n,leftCollapsed:r,setLeftCollapsed:i,rightCollapsed:l,setRightCollapsed:o,rightPanelTab:c,setRightPanelTab:f,toggleLeftSidebar:h,handlePanelResizeStart:g,handlePanelResizeMove:O,handlePanelResizeEnd:x},children:b}){const S=d.useMemo(()=>({leftWidth:t,setLeftWidth:e,rightWidth:n,leftCollapsed:r,setLeftCollapsed:i,rightCollapsed:l,setRightCollapsed:o,rightPanelTab:c,setRightPanelTab:f,toggleLeftSidebar:h,handlePanelResizeStart:g,handlePanelResizeMove:O,handlePanelResizeEnd:x}),[t,e,n,r,i,l,o,c,f,h,g,O,x]);return p.jsx(Y7,{value:S,children:b})}const I7=d.createContext(null);function ed(){const t=d.useContext(I7);if(!t)throw new Error("useDomEditContext must be used within DomEditProvider");return t}function uN({value:{domEditSelection:t,domEditGroupSelections:e,domEditHoverSelection:n,agentModalOpen:r,agentModalAnchorPoint:i,copiedAgentPrompt:l,agentPromptSelectionContext:o,domEditSelectionRef:c,handleTimelineElementSelect:f,handlePreviewCanvasMouseDown:h,handlePreviewCanvasPointerMove:g,handlePreviewCanvasPointerLeave:O,applyDomSelection:x,clearDomSelection:b,handleDomStyleCommit:S,handleDomAttributeCommit:w,handleDomHtmlAttributeCommit:A,handleDomPathOffsetCommit:k,handleDomGroupPathOffsetCommit:T,handleDomBoxSizeCommit:E,handleDomRotationCommit:C,handleDomManualEditsReset:M,handleDomMotionCommit:P,handleDomMotionClear:$,handleDomTextCommit:Z,handleDomTextFieldStyleCommit:V,handleDomAddTextField:z,handleDomRemoveTextField:L,handleAskAgent:D,handleAgentModalSubmit:I,handleBlockedDomMove:te,handleDomManualDragStart:J,handleDomEditElementDelete:H,buildDomSelectionFromTarget:G,buildDomSelectionForTimelineElement:F,updateDomEditHoverSelection:Y,resolveImportedFontAsset:_,setAgentModalOpen:Q,setAgentPromptSelectionContext:R,setAgentModalAnchorPoint:X,selectedGsapAnimations:B,gsapMultipleTimelines:q,gsapUnsupportedTimelinePattern:W,handleGsapUpdateProperty:ne,handleGsapUpdateMeta:ae,handleGsapDeleteAnimation:ue,handleGsapAddAnimation:xe,handleGsapAddProperty:fe,handleGsapRemoveProperty:ge},children:ke}){const je=d.useMemo(()=>({domEditSelection:t,domEditGroupSelections:e,domEditHoverSelection:n,agentModalOpen:r,agentModalAnchorPoint:i,copiedAgentPrompt:l,agentPromptSelectionContext:o,domEditSelectionRef:c,handleTimelineElementSelect:f,handlePreviewCanvasMouseDown:h,handlePreviewCanvasPointerMove:g,handlePreviewCanvasPointerLeave:O,applyDomSelection:x,clearDomSelection:b,handleDomStyleCommit:S,handleDomAttributeCommit:w,handleDomHtmlAttributeCommit:A,handleDomPathOffsetCommit:k,handleDomGroupPathOffsetCommit:T,handleDomBoxSizeCommit:E,handleDomRotationCommit:C,handleDomManualEditsReset:M,handleDomMotionCommit:P,handleDomMotionClear:$,handleDomTextCommit:Z,handleDomTextFieldStyleCommit:V,handleDomAddTextField:z,handleDomRemoveTextField:L,handleAskAgent:D,handleAgentModalSubmit:I,handleBlockedDomMove:te,handleDomManualDragStart:J,handleDomEditElementDelete:H,buildDomSelectionFromTarget:G,buildDomSelectionForTimelineElement:F,updateDomEditHoverSelection:Y,resolveImportedFontAsset:_,setAgentModalOpen:Q,setAgentPromptSelectionContext:R,setAgentModalAnchorPoint:X,selectedGsapAnimations:B,gsapMultipleTimelines:q,gsapUnsupportedTimelinePattern:W,handleGsapUpdateProperty:ne,handleGsapUpdateMeta:ae,handleGsapDeleteAnimation:ue,handleGsapAddAnimation:xe,handleGsapAddProperty:fe,handleGsapRemoveProperty:ge}),[t,e,n,r,i,l,o,c,f,h,g,O,x,b,S,w,A,k,T,E,C,M,P,$,Z,V,z,L,D,I,te,J,H,G,F,Y,_,Q,R,X,B,q,W,ne,ae,ue,xe,fe,ge]);return p.jsx(I7,{value:je,children:ke})}function fN(){const e=Math.round(93.21518987341773);return p.jsxs("svg",{width:e,height:28,viewBox:"0 0 263 79",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-label":"Hyperframes",children:[p.jsxs("defs",{children:[p.jsxs("linearGradient",{id:"hf-g0",x1:"225.869",y1:"0",x2:"222.845",y2:"37.482",gradientUnits:"userSpaceOnUse",children:[p.jsx("stop",{stopColor:"#06E3FA"}),p.jsx("stop",{offset:"1",stopColor:"#4FDB5E"})]}),p.jsxs("linearGradient",{id:"hf-g1",x1:"230.87",y1:"39",x2:"244.661",y2:"6.303",gradientUnits:"userSpaceOnUse",children:[p.jsx("stop",{stopColor:"#06E3FA"}),p.jsx("stop",{offset:"1",stopColor:"#4FDB5E"})]})]}),p.jsx("path",{d:"M0 16.6738H4.96V23.3838H11.53V16.6738H16.49V35.4538H11.53V27.6738H4.96V35.4538H0V16.6738Z",fill:"white"}),p.jsx("path",{d:"M17.8899 28.0137C17.8899 23.4237 21.2399 20.0237 25.7999 20.0237C30.0099 20.0237 32.9399 23.0837 32.9399 27.5637C32.9399 28.2037 32.8599 28.8237 32.8299 29.3337H22.6099C23.0399 31.1337 24.6199 32.1237 27.1399 32.1237C28.7199 32.1237 30.2199 31.7237 31.2999 31.0237V34.6737C30.1699 35.3937 28.2999 35.8537 26.3599 35.8537C21.2599 35.8537 17.8799 32.6037 17.8799 28.0237L17.8899 28.0137ZM28.5699 26.1937C28.4899 24.5337 27.3899 23.5637 25.7499 23.5637C24.1099 23.5637 22.9599 24.5337 22.6099 26.1937H28.5699Z",fill:"white"}),p.jsx("path",{d:"M37.85 33.8638L32 20.4238H37.29L40.46 28.1538L43.6 20.4238H48.48L40.33 39.5738H35.26L37.86 33.8638H37.85Z",fill:"white"}),p.jsx("path",{d:"M48.1797 26.1138C48.1797 20.4238 52.7097 16.2438 58.9397 16.2438C61.2997 16.2438 63.5297 16.8038 64.8197 17.7238V21.9338C63.5597 20.9138 61.6797 20.2938 59.7497 20.2938C55.7797 20.2938 53.2597 22.6238 53.2597 26.1438C53.2597 29.6638 55.5697 31.8838 58.8897 31.8838C59.6397 31.8838 60.4997 31.7538 61.1997 31.5038V27.8838H57.4697V24.2338H65.5197V33.7038C63.6697 35.0938 61.1997 35.8738 58.5997 35.8738C52.5397 35.8738 48.1897 31.7438 48.1897 26.1138H48.1797Z",fill:"white"}),p.jsx("path",{d:"M66.6604 28.0137C66.6604 23.4237 70.0104 20.0237 74.5704 20.0237C78.7804 20.0237 81.7104 23.0837 81.7104 27.5637C81.7104 28.2037 81.6304 28.8237 81.6004 29.3337H71.3804C71.8104 31.1337 73.3904 32.1237 75.9104 32.1237C77.4904 32.1237 78.9904 31.7237 80.0704 31.0237V34.6737C78.9404 35.3937 77.0704 35.8537 75.1304 35.8537C70.0304 35.8537 66.6504 32.6037 66.6504 28.0237L66.6604 28.0137ZM77.3404 26.1937C77.2604 24.5337 76.1604 23.5637 74.5204 23.5637C72.8804 23.5637 71.7304 24.5337 71.3804 26.1937H77.3404Z",fill:"white"}),p.jsx("path",{d:"M82.9688 20.4238H87.8488V22.4138C88.7588 20.9638 90.3488 20.1038 92.3288 20.1038C95.4988 20.1038 97.3988 22.3338 97.3988 25.8138V35.4438H92.5188V26.8638C92.5188 25.0438 91.8188 24.1838 90.4788 24.1838C88.9488 24.1838 87.8488 25.3638 87.8488 27.2638V35.4438H82.9688V20.4238Z",fill:"white"}),p.jsx("path",{d:"M195.219 26.1937L213.529 38.9937C216.009 40.7237 220.239 38.7637 221.009 35.5337L228.419 4.33374C229.189 1.10374 225.879 -0.856262 222.589 0.873738L198.199 13.6737C192.649 16.5837 191.059 23.2837 195.219 26.1937Z",fill:"url(#hf-g0)"}),p.jsx("path",{d:"M256.97 25.9638L232.58 38.7638C229.28 40.4938 225.98 38.5338 226.75 35.3038L234.16 4.10376C234.93 0.873757 239.16 -1.08624 241.64 0.643757L259.95 13.4438C264.12 16.3538 262.52 23.0538 256.97 25.9638Z",fill:"url(#hf-g1)"}),p.jsx("path",{d:"M0 71.9996V42.7256H7.7367V53.1806H17.9826V42.7256H25.7193V71.9996H17.9826V59.8718H7.7367V71.9996H0Z",fill:"white"}),p.jsx("path",{d:"M31.9606 78.4405L36.0171 69.5329L26.9004 48.5811H35.1389L40.0737 60.6252L44.9666 48.5811H52.5779L39.8646 78.4405H31.9606Z",fill:"white"}),p.jsx("path",{d:"M53.3711 78.4404V48.5809H60.9823V52.052C62.446 49.501 65.0807 48.0791 68.3008 48.0791C74.3647 48.0791 78.9649 53.3066 78.9649 60.2487C78.9649 67.2745 74.3229 72.4602 68.259 72.4602C65.0807 72.4602 62.446 71.1637 60.9823 68.78V78.4404H53.3711ZM66.1262 66.1872C69.2627 66.1872 71.3119 63.7616 71.3119 60.2905C71.3119 56.8195 69.2627 54.4357 66.1262 54.4357C62.7388 54.4357 60.9823 57.2795 60.9823 59.7051V60.9178C60.9823 63.3434 62.7388 66.1872 66.1262 66.1872Z",fill:"white"}),p.jsx("path",{d:"M93.4397 72.6269C85.4939 72.6269 80.2246 67.5667 80.2246 60.4155C80.2246 53.2643 85.4521 47.9531 92.5615 47.9531C99.1273 47.9531 103.686 52.7206 103.686 59.7045C103.686 60.7082 103.56 61.6701 103.518 62.4647H87.5849C88.2541 65.2666 90.7214 66.8139 94.6525 66.8139C97.1199 66.8139 99.4618 66.1866 101.135 65.0993V70.7868C99.3782 71.916 96.4508 72.6269 93.4397 72.6269ZM87.5849 57.5717H96.869C96.7435 54.9789 95.0289 53.4734 92.4779 53.4734C89.9687 53.4734 88.1286 54.9789 87.5849 57.5717Z",fill:"white"}),p.jsx("path",{d:"M105.645 72V48.5808H113.214V52.9719C114.218 50.0445 116.183 48.2881 118.692 48.2881C119.361 48.2881 119.989 48.4135 120.407 48.6645V55.8993C119.822 55.5648 119.111 55.4393 118.274 55.4393C115.138 55.4393 113.256 57.6558 113.256 61.2941V72H105.645Z",fill:"white"}),p.jsx("path",{d:"M122.643 71.9996V42.7256H139.371V49.124H130.379V54.477H138.911V60.5827H130.379V71.9996H122.643Z",fill:"white"}),p.jsx("path",{d:"M141.258 72V48.5808H148.827V52.9719C149.831 50.0445 151.796 48.2881 154.306 48.2881C154.975 48.2881 155.602 48.4135 156.02 48.6645V55.8993C155.435 55.5648 154.724 55.4393 153.887 55.4393C150.751 55.4393 148.869 57.6558 148.869 61.2941V72H141.258Z",fill:"white"}),p.jsx("path",{d:"M167.26 72.4602C161.154 72.4602 156.596 67.2745 156.596 60.3324C156.596 53.3066 161.196 48.0791 167.302 48.0791C170.438 48.0791 173.031 49.4173 174.536 51.8429V48.5809H182.148V72.0001H174.536V68.4873C173.031 71.0801 170.438 72.4602 167.26 72.4602ZM169.393 66.1872C172.78 66.1872 174.536 63.3434 174.536 60.876V59.6632C174.536 57.2377 172.78 54.4357 169.393 54.4357C166.298 54.4357 164.207 56.7777 164.207 60.2905C164.207 63.7616 166.298 66.1872 169.393 66.1872Z",fill:"white"}),p.jsx("path",{d:"M184.998 72.0001V48.5809H192.609V51.6756C193.989 49.4173 196.373 48.0791 199.426 48.0791C202.521 48.0791 204.779 49.5428 206.075 52.052C207.497 49.5846 210.132 48.0791 213.352 48.0791C218.245 48.0791 221.214 51.592 221.214 57.0286V72.0001H213.603V58.5341C213.603 55.774 212.557 54.4357 210.634 54.4357C208.459 54.4357 206.912 56.234 206.912 59.0778V72.0001H199.3V58.5341C199.3 55.774 198.255 54.4357 196.373 54.4357C194.157 54.4357 192.609 56.234 192.609 59.0778V72.0001H184.998Z",fill:"white"}),p.jsx("path",{d:"M236.338 72.6269C228.392 72.6269 223.123 67.5667 223.123 60.4155C223.123 53.2643 228.351 47.9531 235.46 47.9531C242.026 47.9531 246.584 52.7206 246.584 59.7045C246.584 60.7082 246.459 61.6701 246.417 62.4647H230.483C231.152 65.2666 233.62 66.8139 237.551 66.8139C240.018 66.8139 242.36 66.1866 244.033 65.0993V70.7868C242.277 71.916 239.349 72.6269 236.338 72.6269ZM230.483 57.5717H239.767C239.642 54.9789 237.927 53.4734 235.376 53.4734C232.867 53.4734 231.027 54.9789 230.483 57.5717Z",fill:"white"}),p.jsx("path",{d:"M252.115 72.502C250.192 72.502 248.268 72.0838 246.93 71.3728V65.6853C247.808 66.3126 248.937 66.689 250.066 66.689C251.739 66.689 252.784 65.8526 252.784 64.5562C252.784 63.8452 252.492 63.0925 251.655 62.0888L249.899 59.956C248.728 58.4923 248.226 56.9031 248.226 55.2721C248.226 51.0065 251.864 48.0791 256.883 48.0791C258.723 48.0791 260.438 48.4555 261.65 49.0828V54.7703C260.898 54.2266 259.768 53.8503 258.723 53.8503C257.092 53.8503 256.046 54.6867 256.046 55.8994C256.046 56.6522 256.423 57.405 257.259 58.4086L258.974 60.4996C260.187 62.047 260.73 63.5943 260.73 65.2671C260.73 69.5746 257.05 72.502 252.115 72.502Z",fill:"white"})]})}function dN({captureFrameHref:t,captureFrameFilename:e,handleCaptureFrameClick:n,refreshCaptureFrameTime:r,inspectorButtonActive:i,inspectorPanelActive:l}){const{projectId:o,editHistory:c,handleUndo:f,handleRedo:h}=mo(),{rightCollapsed:g,setRightCollapsed:O,setRightPanelTab:x}=a8(),{clearDomSelection:b}=ed();return p.jsxs("div",{className:"flex items-center justify-between h-10 px-3 bg-neutral-900 border-b border-neutral-800 flex-shrink-0",children:[p.jsxs("div",{className:"flex items-center gap-3",children:[p.jsx(fN,{}),p.jsx("span",{className:"text-neutral-700 select-none","aria-hidden":"true",children:"|"}),p.jsx("span",{className:"text-[11px] font-medium text-neutral-300",children:o})]}),p.jsxs("div",{className:"flex items-center gap-1.5",children:[p.jsx("button",{type:"button",onClick:()=>{Tt("toolbar_action",{action:"undo"}),f()},disabled:!c.canUndo,className:`h-7 w-7 flex items-center justify-center rounded-md border transition-colors ${c.canUndo?"border-neutral-700 text-neutral-300 hover:border-neutral-500 hover:bg-neutral-800":"border-neutral-900 text-neutral-700"}`,title:c.undoLabel?`Undo ${c.undoLabel} (${c1("undo")})`:`Undo (${c1("undo")})`,"aria-label":"Undo",children:p.jsx(i8,{size:14})}),p.jsx("button",{type:"button",onClick:()=>{Tt("toolbar_action",{action:"redo"}),h()},disabled:!c.canRedo,className:`h-7 w-7 flex items-center justify-center rounded-md border transition-colors ${c.canRedo?"border-neutral-700 text-neutral-300 hover:border-neutral-500 hover:bg-neutral-800":"border-neutral-900 text-neutral-700"}`,title:c.redoLabel?`Redo ${c.redoLabel} (${c1("redo")})`:`Redo (${c1("redo")})`,"aria-label":"Redo",children:p.jsx(lN,{size:14})}),p.jsxs("a",{href:t,download:e,onClick:S=>{Tt("toolbar_action",{action:"capture_frame"}),n(S)},onFocus:r,onPointerDown:r,className:"h-7 flex items-center gap-1.5 px-2.5 rounded-md text-[11px] font-medium border border-neutral-700 text-neutral-300 transition-colors hover:border-neutral-500 hover:bg-neutral-800",title:"Capture current frame","aria-label":"Capture current frame",children:[p.jsx(aN,{size:14}),p.jsx("span",{children:"Capture"})]}),p.jsxs("button",{type:"button",onClick:()=>{if(fn){if(g||!l){Tt("panel_toggle",{panel:"inspector",collapsed:!1}),x("design"),O(!1);return}Tt("panel_toggle",{panel:"inspector",collapsed:!0}),b(),O(!0)}},disabled:!fn,className:`h-7 flex items-center gap-1.5 px-2.5 rounded-md text-[11px] font-medium border transition-colors ${i?"text-studio-accent bg-studio-accent/10 border-studio-accent/30":fn?"text-neutral-500 hover:text-neutral-300 hover:bg-neutral-800 border-transparent":"cursor-not-allowed border-transparent text-neutral-700"}`,title:fn?"Inspector":i3,"aria-label":fn?"Inspector":i3,children:[p.jsxs("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[p.jsx("circle",{cx:"12",cy:"12",r:"10"}),p.jsx("polygon",{points:"10 8 16 12 10 16",fill:"currentColor",stroke:"none"})]}),"Inspector"]})]})]})}let $p=[],q7=[];(()=>{let t="lc,34,7n,7,7b,19,,,,2,,2,,,20,b,1c,l,g,,2t,7,2,6,2,2,,4,z,,u,r,2j,b,1m,9,9,,o,4,,9,,3,,5,17,3,3b,f,,w,1j,,,,4,8,4,,3,7,a,2,t,,1m,,,,2,4,8,,9,,a,2,q,,2,2,1l,,4,2,4,2,2,3,3,,u,2,3,,b,2,1l,,4,5,,2,4,,k,2,m,6,,,1m,,,2,,4,8,,7,3,a,2,u,,1n,,,,c,,9,,14,,3,,1l,3,5,3,,4,7,2,b,2,t,,1m,,2,,2,,3,,5,2,7,2,b,2,s,2,1l,2,,,2,4,8,,9,,a,2,t,,20,,4,,2,3,,,8,,29,,2,7,c,8,2q,,2,9,b,6,22,2,r,,,,,,1j,e,,5,,2,5,b,,10,9,,2u,4,,6,,2,2,2,p,2,4,3,g,4,d,,2,2,6,,f,,jj,3,qa,3,t,3,t,2,u,2,1s,2,,7,8,,2,b,9,,19,3,3b,2,y,,3a,3,4,2,9,,6,3,63,2,2,,1m,,,7,,,,,2,8,6,a,2,,1c,h,1r,4,1c,7,,,5,,14,9,c,2,w,4,2,2,,3,1k,,,2,3,,,3,1m,8,2,2,48,3,,d,,7,4,,6,,3,2,5i,1m,,5,ek,,5f,x,2da,3,3x,,2o,w,fe,6,2x,2,n9w,4,,a,w,2,28,2,7k,,3,,4,,p,2,5,,47,2,q,i,d,,12,8,p,b,1a,3,1c,,2,4,2,2,13,,1v,6,2,2,2,2,c,,8,,1b,,1f,,,3,2,2,5,2,,,16,2,8,,6m,,2,,4,,fn4,,kh,g,g,g,a6,2,gt,,6a,,45,5,1ae,3,,2,5,4,14,3,4,,4l,2,fx,4,ar,2,49,b,4w,,1i,f,1k,3,1d,4,2,2,1x,3,10,5,,8,1q,,c,2,1g,9,a,4,2,,2n,3,2,,,2,6,,4g,,3,8,l,2,1l,2,,,,,m,,e,7,3,5,5f,8,2,3,,,n,,29,,2,6,,,2,,,2,,2,6j,,2,4,6,2,,2,r,2,2d,8,2,,,2,2y,,,,2,6,,,2t,3,2,4,,5,77,9,,2,6t,,a,2,,,4,,40,4,2,2,4,,w,a,14,6,2,4,8,,9,6,2,3,1a,d,,2,ba,7,,6,,,2a,m,2,7,,2,,2,3e,6,3,,,2,,7,,,20,2,3,,,,9n,2,f0b,5,1n,7,t4,,1r,4,29,,f5k,2,43q,,,3,4,5,8,8,2,7,u,4,44,3,1iz,1j,4,1e,8,,e,,m,5,,f,11s,7,,h,2,7,,2,,5,79,7,c5,4,15s,7,31,7,240,5,gx7k,2o,3k,6o".split(",").map(e=>e?parseInt(e,36):1);for(let e=0,n=0;e<t.length;e++)(e%2?q7:$p).push(n=n+t[e])})();function hN(t){if(t<768)return!1;for(let e=0,n=$p.length;;){let r=e+n>>1;if(t<$p[r])n=r;else if(t>=q7[r])e=r+1;else return!0;if(e==n)return!1}}function T3(t){return t>=127462&&t<=127487}const C3=8205;function mN(t,e,n=!0,r=!0){return(n?U7:pN)(t,e,r)}function U7(t,e,n){if(e==t.length)return e;e&&W7(t.charCodeAt(e))&&G7(t.charCodeAt(e-1))&&e--;let r=Jm(t,e);for(e+=E3(r);e<t.length;){let i=Jm(t,e);if(r==C3||i==C3||n&&hN(i))e+=E3(i),r=i;else if(T3(i)){let l=0,o=e-2;for(;o>=0&&T3(Jm(t,o));)l++,o-=2;if(l%2==0)break;e+=2}else break}return e}function pN(t,e,n){for(;e>0;){let r=U7(t,e-2,n);if(r<e)return r;e--}return 0}function Jm(t,e){let n=t.charCodeAt(e);if(!G7(n)||e+1==t.length)return n;let r=t.charCodeAt(e+1);return W7(r)?(n-55296<<10)+(r-56320)+65536:n}function W7(t){return t>=56320&&t<57344}function G7(t){return t>=55296&&t<56320}function E3(t){return t<65536?1:2}class Je{lineAt(e){if(e<0||e>this.length)throw new RangeError(`Invalid position ${e} in document of length ${this.length}`);return this.lineInner(e,!1,1,0)}line(e){if(e<1||e>this.lines)throw new RangeError(`Invalid line number ${e} in ${this.lines}-line document`);return this.lineInner(e,!0,1,0)}replace(e,n,r){[e,n]=Js(this,e,n);let i=[];return this.decompose(0,e,i,2),r.length&&r.decompose(0,r.length,i,3),this.decompose(n,this.length,i,1),mi.from(i,this.length-(n-e)+r.length)}append(e){return this.replace(this.length,this.length,e)}slice(e,n=this.length){[e,n]=Js(this,e,n);let r=[];return this.decompose(e,n,r,0),mi.from(r,n-e)}eq(e){if(e==this)return!0;if(e.length!=this.length||e.lines!=this.lines)return!1;let n=this.scanIdentical(e,1),r=this.length-this.scanIdentical(e,-1),i=new $c(this),l=new $c(e);for(let o=n,c=n;;){if(i.next(o),l.next(o),o=0,i.lineBreak!=l.lineBreak||i.done!=l.done||i.value!=l.value)return!1;if(c+=i.value.length,i.done||c>=r)return!0}}iter(e=1){return new $c(this,e)}iterRange(e,n=this.length){return new K7(this,e,n)}iterLines(e,n){let r;if(e==null)r=this.iter();else{n==null&&(n=this.lines+1);let i=this.line(e).from;r=this.iterRange(i,Math.max(i,n==this.lines+1?this.length:n<=1?0:this.line(n-1).to))}return new J7(r)}toString(){return this.sliceString(0)}toJSON(){let e=[];return this.flatten(e),e}constructor(){}static of(e){if(e.length==0)throw new RangeError("A document must have at least one line");return e.length==1&&!e[0]?Je.empty:e.length<=32?new Ft(e):mi.from(Ft.split(e,[]))}}class Ft extends Je{constructor(e,n=gN(e)){super(),this.text=e,this.length=n}get lines(){return this.text.length}get children(){return null}lineInner(e,n,r,i){for(let l=0;;l++){let o=this.text[l],c=i+o.length;if((n?r:c)>=e)return new ON(i,c,r,o);i=c+1,r++}}decompose(e,n,r,i){let l=e<=0&&n>=this.length?this:new Ft($3(this.text,e,n),Math.min(n,this.length)-Math.max(0,e));if(i&1){let o=r.pop(),c=G1(l.text,o.text.slice(),0,l.length);if(c.length<=32)r.push(new Ft(c,o.length+l.length));else{let f=c.length>>1;r.push(new Ft(c.slice(0,f)),new Ft(c.slice(f)))}}else r.push(l)}replace(e,n,r){if(!(r instanceof Ft))return super.replace(e,n,r);[e,n]=Js(this,e,n);let i=G1(this.text,G1(r.text,$3(this.text,0,e)),n),l=this.length+r.length-(n-e);return i.length<=32?new Ft(i,l):mi.from(Ft.split(i,[]),l)}sliceString(e,n=this.length,r=`
 `){[e,n]=Js(this,e,n);let i="";for(let l=0,o=0;l<=n&&o<this.text.length;o++){let c=this.text[o],f=l+c.length;l>e&&o&&(i+=r),e<f&&n>l&&(i+=c.slice(Math.max(0,e-l),n-l)),l=f+1}return i}flatten(e){for(let n of this.text)e.push(n)}scanIdentical(){return 0}static split(e,n){let r=[],i=-1;for(let l of e)r.push(l),i+=l.length+1,r.length==32&&(n.push(new Ft(r,i)),r=[],i=-1);return i>-1&&n.push(new Ft(r,i)),n}}class mi extends Je{constructor(e,n){super(),this.children=e,this.length=n,this.lines=0;for(let r of e)this.lines+=r.lines}lineInner(e,n,r,i){for(let l=0;;l++){let o=this.children[l],c=i+o.length,f=r+o.lines-1;if((n?f:c)>=e)return o.lineInner(e,n,r,i);i=c+1,r=f+1}}decompose(e,n,r,i){for(let l=0,o=0;o<=n&&l<this.children.length;l++){let c=this.children[l],f=o+c.length;if(e<=f&&n>=o){let h=i&((o<=e?1:0)|(f>=n?2:0));o>=e&&f<=n&&!h?r.push(c):c.decompose(e-o,n-o,r,h)}o=f+1}}replace(e,n,r){if([e,n]=Js(this,e,n),r.lines<this.lines)for(let i=0,l=0;i<this.children.length;i++){let o=this.children[i],c=l+o.length;if(e>=l&&n<=c){let f=o.replace(e-l,n-l,r),h=this.lines-o.lines+f.lines;if(f.lines<h>>4&&f.lines>h>>6){let g=this.children.slice();return g[i]=f,new mi(g,this.length-(n-e)+r.length)}return super.replace(l,c,f)}l=c+1}return super.replace(e,n,r)}sliceString(e,n=this.length,r=`
 `){[e,n]=Js(this,e,n);let i="";for(let l=0,o=0;l<this.children.length&&o<=n;l++){let c=this.children[l],f=o+c.length;o>e&&l&&(i+=r),e<f&&n>o&&(i+=c.sliceString(e-o,n-o,r)),o=f+1}return i}flatten(e){for(let n of this.children)n.flatten(e)}scanIdentical(e,n){if(!(e instanceof mi))return 0;let r=0,[i,l,o,c]=n>0?[0,0,this.children.length,e.children.length]:[this.children.length-1,e.children.length-1,-1,-1];for(;;i+=n,l+=n){if(i==o||l==c)return r;let f=this.children[i],h=e.children[l];if(f!=h)return r+f.scanIdentical(h,n);r+=f.length+1}}static from(e,n=e.reduce((r,i)=>r+i.length+1,-1)){let r=0;for(let b of e)r+=b.lines;if(r<32){let b=[];for(let S of e)S.flatten(b);return new Ft(b,n)}let i=Math.max(32,r>>5),l=i<<1,o=i>>1,c=[],f=0,h=-1,g=[];function O(b){let S;if(b.lines>l&&b instanceof mi)for(let w of b.children)O(w);else b.lines>o&&(f>o||!f)?(x(),c.push(b)):b instanceof Ft&&f&&(S=g[g.length-1])instanceof Ft&&b.lines+S.lines<=32?(f+=b.lines,h+=b.length+1,g[g.length-1]=new Ft(S.text.concat(b.text),S.length+1+b.length)):(f+b.lines>i&&x(),f+=b.lines,h+=b.length+1,g.push(b))}function x(){f!=0&&(c.push(g.length==1?g[0]:mi.from(g,h)),h=-1,f=g.length=0)}for(let b of e)O(b);return x(),c.length==1?c[0]:new mi(c,n)}}Je.empty=new Ft([""],0);function gN(t){let e=-1;for(let n of t)e+=n.length+1;return e}function G1(t,e,n=0,r=1e9){for(let i=0,l=0,o=!0;l<t.length&&i<=r;l++){let c=t[l],f=i+c.length;f>=n&&(f>r&&(c=c.slice(0,r-i)),i<n&&(c=c.slice(n-i)),o?(e[e.length-1]+=c,o=!1):e.push(c)),i=f+1}return e}function $3(t,e,n){return G1(t,[""],e,n)}class $c{constructor(e,n=1){this.dir=n,this.done=!1,this.lineBreak=!1,this.value="",this.nodes=[e],this.offsets=[n>0?1:(e instanceof Ft?e.text.length:e.children.length)<<1]}nextInner(e,n){for(this.done=this.lineBreak=!1;;){let r=this.nodes.length-1,i=this.nodes[r],l=this.offsets[r],o=l>>1,c=i instanceof Ft?i.text.length:i.children.length;if(o==(n>0?c:0)){if(r==0)return this.done=!0,this.value="",this;n>0&&this.offsets[r-1]++,this.nodes.pop(),this.offsets.pop()}else if((l&1)==(n>0?0:1)){if(this.offsets[r]+=n,e==0)return this.lineBreak=!0,this.value=`

package/dist/studio/index.html

@@ -5,7 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <title>HyperFrames Studio</title>
-    <script type="module" crossorigin src="/assets/index-CKJCBFsG.js"></script>
+    <script type="module" crossorigin src="/assets/index-D6EwK2hA.js"></script>
     <link rel="stylesheet" crossorigin href="/assets/index-ZdgB8MFr.css">
   </head>
   <body>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hyperframes",
-  "version": "0.6.54",
+  "version": "0.6.55",
   "description": "HyperFrames CLI — create, preview, and render HTML video compositions",
   "repository": {
     "type": "git",