@pixerate/editor 0.59.0 → 0.61.0

package/dist/animation-editor/index.cjs

@@ -63,6 +63,7 @@ var MOTION_COMMAND_TYPES = [
   "fade",
   "style",
   "morph",
+  "match",
   "follow",
   "pulse",
   "shake",
@@ -74,6 +75,7 @@ var MOTION_COMMAND_TYPES = [
   "wait"
 ];
 var MOTION_ENTER_STYLES = ["fade", "pop", "grow", "slide", "draw", "zoom", "rise", "wipe", "iris", "split"];
+var MOTION_BLENDS = ["replace", "add"];
 var MOTION_REPEAT_MODES = ["loop", "mirror", "offset"];
 var MOTION_EXIT_STYLES = ["fade", "shrink", "slide", "undraw", "wipe"];
 var MOTION_IRIS_SHAPES = ["circle", "box"];
@@ -88,6 +90,7 @@ var MOTION_DEFAULT_DURATIONS = {
   fade: 400,
   style: 500,
   morph: 900,
+  match: 900,
   follow: 1400,
   pulse: 600,
   shake: 500,
@@ -132,6 +135,8 @@ var MOTION_ISSUE_CODES = {
   "not-a-path": { severity: "error", wording: "A follow path must be a path node, not a group." },
   "reveal-no-box": { severity: "warning", wording: "A wipe, iris or split cannot clip a node with no width or height (a lone straight line), so it fades instead." },
   "unknown-shape": { severity: "error", wording: "A morph names a shape the artwork does not have." },
+  "match-self": { severity: "error", wording: "A match turns a group into itself or into a group it holds (or that holds it)." },
+  "match-unpaired": { severity: "note", wording: `Parts of a match's "into" group have no partner in the target, so they do not appear.` },
   "unknown-effect": { severity: "error", wording: "An effect command names an effect the node does not have." },
   "unknown-effect-param": { severity: "error", wording: "An effect command names a parameter that is not a number of that effect." },
   "unknown-frame": { severity: "error", wording: "A camera frames a node the artwork does not have." },
@@ -209,18 +214,19 @@ var COMMAND_KEYS = {
   enter: [...BASE_KEYS, "style", "direction", "distance", "scale", "shape", "orientation"],
   exit: [...BASE_KEYS, "style", "direction", "distance"],
   draw: [...BASE_KEYS, "from", "to"],
-  move: [...BASE_KEYS, "by", "to"],
-  rotate: [...BASE_KEYS, "by", "to"],
-  scale: [...BASE_KEYS, "to", "geometric"],
+  move: [...BASE_KEYS, "by", "to", "blend"],
+  rotate: [...BASE_KEYS, "by", "to", "blend"],
+  scale: [...BASE_KEYS, "to", "geometric", "blend"],
   fade: [...BASE_KEYS, "to"],
   style: [...BASE_KEYS, "fill", "stroke", "strokeWidth"],
   morph: [...BASE_KEYS, "into"],
+  match: [...BASE_KEYS, "into"],
   follow: [...BASE_KEYS, "path", "rotate", "from", "to"],
-  pulse: [...BASE_KEYS, "amount", "count"],
-  shake: [...BASE_KEYS, "amount", "count", "axis"],
-  teeter: [...BASE_KEYS, "angle", "count"],
-  wave: [...BASE_KEYS, "amount", "count"],
-  wiggle: [...BASE_KEYS, "amount", "frequency", "octaves", "rotate", "seed"],
+  pulse: [...BASE_KEYS, "amount", "count", "blend"],
+  shake: [...BASE_KEYS, "amount", "count", "axis", "blend"],
+  teeter: [...BASE_KEYS, "angle", "count", "blend"],
+  wave: [...BASE_KEYS, "amount", "count", "blend"],
+  wiggle: [...BASE_KEYS, "amount", "frequency", "octaves", "rotate", "seed", "blend"],
   "color-pulse": [...BASE_KEYS, "color", "paint", "count"],
   effect: [...BASE_KEYS, "effect", "param", "to"],
   wait: ["type", "duration", "with", "note"]
@@ -264,6 +270,7 @@ function commandShapeProblems(command2, where) {
     if (type === "enter" || type === "exit") p(`"repeat" is not for ${type} (it brings things in or out once); repeat an emphasis or a move instead.`);
     else if (!(Number.isInteger(command2.repeat) && command2.repeat >= 1 && command2.repeat <= 1e3)) p(`"repeat" must be a whole number from 1 to 1000.`);
   }
+  if (command2.blend !== void 0 && !MOTION_BLENDS.includes(command2.blend)) p(`"blend" must be "replace" (the change takes over) or "add" (a layer on top).`);
   if (command2.repeatMode !== void 0 && !MOTION_REPEAT_MODES.includes(command2.repeatMode)) p(`"repeatMode" must be one of ${MOTION_REPEAT_MODES.join(", ")}.`);
   if (command2.steps !== void 0 && !(isNum(command2.steps) && command2.steps > 0 && command2.steps <= 120)) p(`"steps" must be frames per second from above 0 to 120 (12 holds each pose for two frames at 24 fps).`);
   switch (type) {
@@ -309,7 +316,8 @@ function commandShapeProblems(command2, where) {
       if (command2.strokeWidth !== void 0 && !(isNum(command2.strokeWidth) && command2.strokeWidth >= 0)) p(`"strokeWidth" must be a number \u2265 0.`);
       break;
     case "morph":
-      if (typeof command2.into !== "string" || !command2.into) p(`"into" must be the id of a node whose shape to take.`);
+    case "match":
+      if (typeof command2.into !== "string" || !command2.into) p(`"into" must be the id of a ${type === "match" ? "group to become" : "node whose shape to take"}.`);
       break;
     case "follow":
       if (typeof command2.path !== "string" || !command2.path) p(`"path" must be the id of a path node.`);
@@ -418,6 +426,53 @@ function motionSceneToJson(scene, space = 2) {
 var isMotionShot = (shot) => shotShapeProblems(shot, "Shot").length === 0;
 var isMotionCommand = (command2) => commandShapeProblems(command2, "Command").length === 0;
 
+// src/animation-editor/match.ts
+var SEPARATOR = /[-_/.:]/;
+function localId(id, groupId) {
+  if (groupId && id.includes(groupId)) return id.split(groupId).join("").replace(/^[-_/.:]+|[-_/.:]+$/g, "");
+  const parts = id.split(SEPARATOR);
+  return _nullishCoalesce(parts[parts.length - 1], () => ( id));
+}
+function matchMotionNodes(from, into) {
+  const out = { pairs: [], unpairedFrom: [], unpairedInto: [] };
+  const visit = (a, b) => {
+    const aKids = a.type === "group" ? a.children : [];
+    const bKids = b.type === "group" ? b.children : [];
+    if (!aKids.length || !bKids.length) {
+      out.pairs.push([a.id, b.id]);
+      return;
+    }
+    const left = new Set(aKids);
+    const right = new Set(bKids);
+    const pair = (key) => {
+      for (const x of [...left]) {
+        const k = key(x, a);
+        if (!k) continue;
+        const y = [...right].find((n) => key(n, b) === k);
+        if (!y) continue;
+        left.delete(x);
+        right.delete(y);
+        if (x.type === "group" && y.type === "group") visit(x, y);
+        else out.pairs.push([x.id, y.id]);
+      }
+    };
+    pair((n) => _optionalChain([n, 'access', _4 => _4.name, 'optionalAccess', _5 => _5.trim, 'call', _6 => _6()]) || void 0);
+    pair((n, g) => localId(n.id, g.id) || void 0);
+    for (const x of [...left]) {
+      const y = [...right].find((n) => n.type === x.type);
+      if (!y) continue;
+      left.delete(x);
+      right.delete(y);
+      if (x.type === "group" && y.type === "group") visit(x, y);
+      else out.pairs.push([x.id, y.id]);
+    }
+    out.unpairedFrom.push(...[...left].map((n) => n.id));
+    out.unpairedInto.push(...[...right].map((n) => n.id));
+  };
+  visit(from, into);
+  return out;
+}
+
 // src/animation-editor/compile.ts
 var indexCache = /* @__PURE__ */ new WeakMap();
 function indexMotionNodes(nodes) {
@@ -497,10 +552,10 @@ function motionRevealClip(entry, reveal) {
   }
 }
 function motionRestValue(entry, property, artwork) {
-  const node = _optionalChain([entry, 'optionalAccess', _4 => _4.node]);
+  const node = _optionalChain([entry, 'optionalAccess', _7 => _7.node]);
   switch (property) {
     case "opacity":
-      return _nullishCoalesce(_optionalChain([node, 'optionalAccess', _5 => _5.opacity]), () => ( 1));
+      return _nullishCoalesce(_optionalChain([node, 'optionalAccess', _8 => _8.opacity]), () => ( 1));
     case "x":
     case "y":
     case "rotation":
@@ -518,11 +573,11 @@ function motionRestValue(entry, property, artwork) {
     case "stroke":
       return _nullishCoalesce((node && firstPaint(node, property)), () => ( "transparent"));
     case "strokeWidth": {
-      const path = _optionalChain([node, 'optionalAccess', _6 => _6.type]) === "path" ? node : node ? _chunkYJLCBA7Vcjs.collectPathNodes.call(void 0, node)[0] : void 0;
-      return _nullishCoalesce(_optionalChain([path, 'optionalAccess', _7 => _7.strokeWidth]), () => ( 1));
+      const path = _optionalChain([node, 'optionalAccess', _9 => _9.type]) === "path" ? node : node ? _chunkYJLCBA7Vcjs.collectPathNodes.call(void 0, node)[0] : void 0;
+      return _nullishCoalesce(_optionalChain([path, 'optionalAccess', _10 => _10.strokeWidth]), () => ( 1));
     }
     case "shape":
-      return _nullishCoalesce(_optionalChain([node, 'optionalAccess', _8 => _8.id]), () => ( ""));
+      return _nullishCoalesce(_optionalChain([node, 'optionalAccess', _11 => _11.id]), () => ( ""));
     case "clipRect":
     case "clipCircle": {
       const pad = entry && motionRevealPadding(entry);
@@ -532,7 +587,7 @@ function motionRestValue(entry, property, artwork) {
       return [0, 0, artwork.width, artwork.height];
   }
   const [, effectId, param] = property.split(":");
-  const effect = _optionalChain([node, 'optionalAccess', _9 => _9.effects, 'optionalAccess', _10 => _10.find, 'call', _11 => _11((e) => e.id === effectId)]);
+  const effect = _optionalChain([node, 'optionalAccess', _12 => _12.effects, 'optionalAccess', _13 => _13.find, 'call', _14 => _14((e) => e.id === effectId)]);
   const v = effect ? effect.params[param] : void 0;
   return typeof v === "number" ? v : 0;
 }
@@ -581,13 +636,13 @@ function segmentValue(segment, time, raw = false) {
   return typeof segment.from === "string" ? interpolateMotionValue(segment.from, segment.to, Math.min(1, Math.max(0, p))) : interpolateMotionValue(segment.from, segment.to, p);
 }
 function activeSegment(track, time) {
-  if (!_optionalChain([track, 'optionalAccess', _12 => _12.length])) return void 0;
+  if (!_optionalChain([track, 'optionalAccess', _15 => _15.length])) return void 0;
   let found;
   for (const s of track) if (s.start <= time && (!found || s.start >= found.start)) found = s;
   return found;
 }
 function trackValue(track, time, raw = false) {
-  if (!_optionalChain([track, 'optionalAccess', _13 => _13.length])) return void 0;
+  if (!_optionalChain([track, 'optionalAccess', _16 => _16.length])) return void 0;
   const s = activeSegment(track, time);
   if (s) return segmentValue(s, time, raw);
   let first = track[0];
@@ -595,6 +650,20 @@ function trackValue(track, time, raw = false) {
   return first.from;
 }
 var motionTrackKey = (node, property) => `${node}\0${property}`;
+var motionAddTrackKey = (node, property) => `${node}\0${property}\0add`;
+var MOTION_ADDITIVE_PROPERTIES = ["x", "y", "rotation", "scaleX", "scaleY"];
+function withMotionLayers(timeline, node, property, base, time, raw = false) {
+  const layers = timeline.tracks.get(motionAddTrackKey(node, property));
+  if (!layers) return base;
+  const scale = property === "scaleX" || property === "scaleY";
+  let v = base;
+  for (const layer of layers) {
+    if (layer.start > time) continue;
+    const x = Number(segmentValue(layer, time, raw));
+    if (Number.isFinite(x)) v = scale ? v * x : v + x;
+  }
+  return v;
+}
 function fitMotionRect(rect, aspect) {
   const cx = rect.x + rect.width / 2;
   const cy = rect.y + rect.height / 2;
@@ -606,7 +675,7 @@ function fitMotionRect(rect, aspect) {
 function resolveMotionCamera(camera, scene) {
   if ("frame" in camera && typeof camera.frame === "string") {
     const entry = indexMotionNodes(scene.artwork.nodes).get(camera.frame);
-    if (!_optionalChain([entry, 'optionalAccess', _14 => _14.bounds])) return null;
+    if (!_optionalChain([entry, 'optionalAccess', _17 => _17.bounds])) return null;
     const pad = _nullishCoalesce(camera.padding, () => ( 24));
     const b = entry.bounds;
     const rect = { x: b.x - pad, y: b.y - pad, width: Math.max(1, b.width + pad * 2), height: Math.max(1, b.height + pad * 2) };
@@ -698,7 +767,7 @@ function compileMotionScene(scene) {
     return _nullishCoalesce(v, () => ( motionRestValue(nodes.get(node), property, artwork)));
   };
   const push = (segment) => {
-    const key = motionTrackKey(segment.node, segment.property);
+    const key = segment.blend === "add" ? motionAddTrackKey(segment.node, segment.property) : motionTrackKey(segment.node, segment.property);
     let track = tracks.get(key);
     if (!track) tracks.set(key, track = []);
     track.push(segment);
@@ -767,7 +836,7 @@ function compileMotionScene(scene) {
         const style = _nullishCoalesce(command2.style, () => ( "fade"));
         const opacity = rest("opacity");
         const reveal = style === "wipe" ? motionRevealClip(entry, { style, direction: command2.direction }) : style === "iris" ? motionRevealClip(entry, { style, shape: command2.shape }) : style === "split" ? motionRevealClip(entry, { style, orientation: command2.orientation }) : null;
-        for (const p of ["clipRect", "clipCircle"]) if (p !== _optionalChain([reveal, 'optionalAccess', _15 => _15.property]) && tracks.has(motionTrackKey(node, p))) seg(p, rest(p), "linear", start, start);
+        for (const p of ["clipRect", "clipCircle"]) if (p !== _optionalChain([reveal, 'optionalAccess', _18 => _18.property]) && tracks.has(motionTrackKey(node, p))) seg(p, rest(p), "linear", start, start);
         if (reveal) {
           seg("opacity", opacity, "linear", start, start);
           seg(reveal.property, reveal.to, _nullishCoalesce(ease, () => ( MOTION_EASE_OUT)), start, end, { from: reveal.from });
@@ -829,26 +898,34 @@ function compileMotionScene(scene) {
       }
       case "move": {
         const e = _nullishCoalesce(ease, () => ( MOTION_EASE_IN_OUT));
-        let dx = _nullishCoalesce(_optionalChain([command2, 'access', _16 => _16.by, 'optionalAccess', _17 => _17.x]), () => ( 0));
-        let dy = _nullishCoalesce(_optionalChain([command2, 'access', _18 => _18.by, 'optionalAccess', _19 => _19.y]), () => ( 0));
+        let dx = _nullishCoalesce(_optionalChain([command2, 'access', _19 => _19.by, 'optionalAccess', _20 => _20.x]), () => ( 0));
+        let dy = _nullishCoalesce(_optionalChain([command2, 'access', _21 => _21.by, 'optionalAccess', _22 => _22.y]), () => ( 0));
         if (command2.to) {
           const inv = _chunkYJLCBA7Vcjs.invertMatrix.call(void 0, entry.parentWorld);
           const target = _chunkYJLCBA7Vcjs.applyMatrix.call(void 0, inv, command2.to);
           dx = target.x - (entry.center.x + num("x"));
           dy = target.y - (entry.center.y + num("y"));
         }
-        seg("x", num("x") + dx, e);
-        seg("y", num("y") + dy, e);
+        if (command2.blend === "add") {
+          seg("x", dx, e, start, end, { from: 0, blend: "add" });
+          seg("y", dy, e, start, end, { from: 0, blend: "add" });
+        } else {
+          seg("x", num("x") + dx, e);
+          seg("y", num("y") + dy, e);
+        }
         break;
       }
-      case "rotate":
-        seg("rotation", _nullishCoalesce(command2.to, () => ( num("rotation") + (_nullishCoalesce(command2.by, () => ( 0))))), _nullishCoalesce(ease, () => ( MOTION_EASE_IN_OUT)));
+      case "rotate": {
+        const e = _nullishCoalesce(ease, () => ( MOTION_EASE_IN_OUT));
+        if (command2.blend === "add") seg("rotation", command2.to !== void 0 ? command2.to - num("rotation") : _nullishCoalesce(command2.by, () => ( 0)), e, start, end, { from: 0, blend: "add" });
+        else seg("rotation", _nullishCoalesce(command2.to, () => ( num("rotation") + (_nullishCoalesce(command2.by, () => ( 0))))), e);
         break;
+      }
       case "scale": {
         const to = typeof command2.to === "number" ? { x: command2.to, y: command2.to } : command2.to;
-        const geometric = command2.geometric ? { geometric: true } : {};
-        seg("scaleX", to.x, _nullishCoalesce(ease, () => ( MOTION_EASE_IN_OUT)), start, end, geometric);
-        seg("scaleY", to.y, _nullishCoalesce(ease, () => ( MOTION_EASE_IN_OUT)), start, end, geometric);
+        const extra = { ...command2.geometric ? { geometric: true } : {}, ...command2.blend === "add" ? { from: 1, blend: "add" } : {} };
+        seg("scaleX", to.x, _nullishCoalesce(ease, () => ( MOTION_EASE_IN_OUT)), start, end, extra);
+        seg("scaleY", to.y, _nullishCoalesce(ease, () => ( MOTION_EASE_IN_OUT)), start, end, extra);
         break;
       }
       case "fade":
@@ -862,34 +939,44 @@ function compileMotionScene(scene) {
       case "morph":
         seg("shape", command2.into, _nullishCoalesce(ease, () => ( MOTION_EASE_IN_OUT)));
         break;
+      case "match": {
+        const into = nodes.get(command2.into);
+        if (!into || command2.into === node) break;
+        const match = matchMotionNodes(entry.node, into.node);
+        const e = _nullishCoalesce(ease, () => ( MOTION_EASE_IN_OUT));
+        for (const [a, b] of match.pairs) push({ node: a, property: "shape", start, end, from: valueAt(a, "shape", start), to: b, ease: e, ...where });
+        for (const a of match.unpairedFrom) push({ node: a, property: "opacity", start, end, from: valueAt(a, "opacity", start), to: 0, ease: e, ...where });
+        break;
+      }
       case "follow":
         seg("follow", _nullishCoalesce(command2.to, () => ( 1)), _nullishCoalesce(ease, () => ( MOTION_EASE_IN_OUT)), start, end, { from: _nullishCoalesce(command2.from, () => ( 0)), path: command2.path, rotate: _nullishCoalesce(command2.rotate, () => ( false)) });
         break;
       // Emphasis: a change toward a peak that a behaviour swings round (as Flair's primitives do).
-      case "pulse": {
-        const behavior = { type: "pulse", count: _nullishCoalesce(command2.count, () => ( 1)) };
-        const k = 1 + (_nullishCoalesce(command2.amount, () => ( 0.15)));
-        seg("scaleX", num("scaleX") * k, _nullishCoalesce(ease, () => ( "linear")), start, end, { behavior });
-        seg("scaleY", num("scaleY") * k, _nullishCoalesce(ease, () => ( "linear")), start, end, { behavior });
-        break;
-      }
-      case "shake": {
-        const p = command2.axis === "vertical" ? "y" : "x";
-        seg(p, num(p) + (_nullishCoalesce(command2.amount, () => ( 8))), _nullishCoalesce(ease, () => ( "linear")), start, end, { behavior: { type: "oscillate", count: _nullishCoalesce(command2.count, () => ( 3)), decay: 1 } });
-        break;
-      }
+      case "pulse":
+      case "shake":
       case "teeter":
-        seg("rotation", num("rotation") + (_nullishCoalesce(command2.angle, () => ( 8))), _nullishCoalesce(ease, () => ( "linear")), start, end, { behavior: { type: "oscillate", count: _nullishCoalesce(command2.count, () => ( 3)), decay: 1 } });
-        break;
       case "wave":
-        seg("y", num("y") - (_nullishCoalesce(command2.amount, () => ( 6))), _nullishCoalesce(ease, () => ( "linear")), start, end, { behavior: { type: "oscillate", count: _nullishCoalesce(command2.count, () => ( 2)) } });
-        break;
       case "wiggle": {
-        const behavior = { type: "wriggle", frequency: _nullishCoalesce(command2.frequency, () => ( 3)), octaves: _nullishCoalesce(command2.octaves, () => ( 2)), seed: command2.seed || _chunkZCNLBRT6cjs.motionSeedFromId.call(void 0, node) };
-        const amount = _nullishCoalesce(command2.amount, () => ( 6));
-        seg("x", num("x") + amount, _nullishCoalesce(ease, () => ( "linear")), start, end, { behavior, index: 0 });
-        seg("y", num("y") + amount, _nullishCoalesce(ease, () => ( "linear")), start, end, { behavior, index: 1 });
-        if (command2.rotate) seg("rotation", num("rotation") + command2.rotate, _nullishCoalesce(ease, () => ( "linear")), start, end, { behavior, index: 2 });
+        const add = (_nullishCoalesce(command2.blend, () => ( "add"))) === "add";
+        const swing = (p, by, extra) => {
+          const scale = p === "scaleX" || p === "scaleY";
+          if (add) seg(p, by, _nullishCoalesce(ease, () => ( "linear")), start, end, { from: scale ? 1 : 0, blend: "add", ...extra });
+          else seg(p, scale ? num(p) * by : num(p) + by, _nullishCoalesce(ease, () => ( "linear")), start, end, extra);
+        };
+        if (command2.type === "pulse") {
+          const behavior = { type: "pulse", count: _nullishCoalesce(command2.count, () => ( 1)) };
+          swing("scaleX", 1 + (_nullishCoalesce(command2.amount, () => ( 0.15))), { behavior });
+          swing("scaleY", 1 + (_nullishCoalesce(command2.amount, () => ( 0.15))), { behavior });
+        } else if (command2.type === "shake") swing(command2.axis === "vertical" ? "y" : "x", _nullishCoalesce(command2.amount, () => ( 8)), { behavior: { type: "oscillate", count: _nullishCoalesce(command2.count, () => ( 3)), decay: 1 } });
+        else if (command2.type === "teeter") swing("rotation", _nullishCoalesce(command2.angle, () => ( 8)), { behavior: { type: "oscillate", count: _nullishCoalesce(command2.count, () => ( 3)), decay: 1 } });
+        else if (command2.type === "wave") swing("y", -(_nullishCoalesce(command2.amount, () => ( 6))), { behavior: { type: "oscillate", count: _nullishCoalesce(command2.count, () => ( 2)) } });
+        else {
+          const behavior = { type: "wriggle", frequency: _nullishCoalesce(command2.frequency, () => ( 3)), octaves: _nullishCoalesce(command2.octaves, () => ( 2)), seed: command2.seed || _chunkZCNLBRT6cjs.motionSeedFromId.call(void 0, node) };
+          const amount = _nullishCoalesce(command2.amount, () => ( 6));
+          swing("x", amount, { behavior, index: 0 });
+          swing("y", amount, { behavior, index: 1 });
+          if (command2.rotate) swing("rotation", command2.rotate, { behavior, index: 2 });
+        }
         break;
       }
       case "color-pulse":
@@ -916,7 +1003,7 @@ var MOTION_DRAW_EFFECT_ID = "~draw";
 var TRANSFORM_PROPS = ["x", "y", "rotation", "scaleX", "scaleY", "follow"];
 var tidy = (v) => Math.round(v * 1e6) / 1e6 || 0;
 function applyMotionControlValues(scene, values) {
-  if (!values || !_optionalChain([scene, 'access', _20 => _20.controls, 'optionalAccess', _21 => _21.length])) return scene;
+  if (!values || !_optionalChain([scene, 'access', _23 => _23.controls, 'optionalAccess', _24 => _24.length])) return scene;
   const map = /* @__PURE__ */ new Map();
   for (const control of scene.controls) {
     const value = values[control.name];
@@ -962,7 +1049,7 @@ function shapeIn(entry, shape) {
 }
 function shapeAt(entry, timeline, nodes, time) {
   const track = timeline.tracks.get(motionTrackKey(entry.node.id, "shape"));
-  if (!_optionalChain([track, 'optionalAccess', _22 => _22.length])) return null;
+  if (!_optionalChain([track, 'optionalAccess', _25 => _25.length])) return null;
   const s = activeSegment(track, time);
   const fromId = String(s ? s.from : track[0].from);
   if (!s) return fromId === entry.node.id ? null : nodes.get(fromId) ? shapeIn(entry, nodes.get(fromId)) : null;
@@ -985,8 +1072,8 @@ function motionFollowRoute(entry, path) {
 }
 function followAt(entry, timeline, nodes, time) {
   const track = timeline.tracks.get(motionTrackKey(entry.node.id, "follow"));
-  const s = _nullishCoalesce(activeSegment(track, time), () => ( _optionalChain([track, 'optionalAccess', _23 => _23[0]])));
-  if (!_optionalChain([s, 'optionalAccess', _24 => _24.path])) return null;
+  const s = _nullishCoalesce(activeSegment(track, time), () => ( _optionalChain([track, 'optionalAccess', _26 => _26[0]])));
+  if (!_optionalChain([s, 'optionalAccess', _27 => _27.path])) return null;
   const route = motionFollowRoute(entry, nodes.get(s.path));
   const progress = Number(trackValue(track, time));
   if (!route || !(progress >= 0)) return null;
@@ -1001,9 +1088,9 @@ function followAt(entry, timeline, nodes, time) {
 function motionNodeOffset(entry, timeline, time, nodes = indexMotionNodes([entry.node]), raw = false, follow = true) {
   const read = (p, rest) => {
     const v = trackValue(timeline.tracks.get(motionTrackKey(entry.node.id, p)), time, raw);
-    return typeof v === "number" ? v : rest;
+    return withMotionLayers(timeline, entry.node.id, p, typeof v === "number" ? v : rest, time, raw);
   };
-  if (!TRANSFORM_PROPS.some((p) => (follow || p !== "follow") && timeline.tracks.has(motionTrackKey(entry.node.id, p)))) return null;
+  if (!TRANSFORM_PROPS.some((p) => (follow || p !== "follow") && (timeline.tracks.has(motionTrackKey(entry.node.id, p)) || timeline.tracks.has(motionAddTrackKey(entry.node.id, p))))) return null;
   const dx = read("x", 0);
   const dy = read("y", 0);
   const rotation = read("rotation", 0);
@@ -1046,7 +1133,7 @@ function motionFrameAt(scene, time, options = {}) {
       if (out.visible === void 0) delete out.visible;
     }
     const effectTracks = [...timeline.tracks.keys()].filter((k) => k.startsWith(`${id}\0effect:`));
-    if (effectTracks.length && _optionalChain([out, 'access', _25 => _25.effects, 'optionalAccess', _26 => _26.length])) {
+    if (effectTracks.length && _optionalChain([out, 'access', _28 => _28.effects, 'optionalAccess', _29 => _29.length])) {
       out = {
         ...out,
         effects: out.effects.map((effect) => {
@@ -1124,7 +1211,7 @@ function withViewBox(svg, box) {
 // src/animation-editor/check.ts
 var MOTION_MIN_CHANGE_MS = 120;
 var NUMERIC_PARAMS = (node, effectId) => {
-  const effect = _optionalChain([node, 'access', _27 => _27.effects, 'optionalAccess', _28 => _28.find, 'call', _29 => _29((e) => e.id === effectId)]);
+  const effect = _optionalChain([node, 'access', _30 => _30.effects, 'optionalAccess', _31 => _31.find, 'call', _32 => _32((e) => e.id === effectId)]);
   if (!effect) return null;
   return Object.entries(effect.params).filter(([, v]) => typeof v === "number").map(([k]) => k);
 };
@@ -1201,6 +1288,19 @@ function checkMotionScene(scene) {
       if (command2.type === "follow" && known(command2.path, "unknown-path", "path", where) && nodes.get(command2.path).node.type !== "path")
         issues.push(motionIssue("not-a-path", `"${command2.path}" is a group; follow a single path node.`, { ...where, ids: [command2.path] }));
       if (command2.type === "morph") known(command2.into, "unknown-shape", "shape", where);
+      if (command2.type === "match" && known(command2.into, "unknown-shape", "group", where)) {
+        const into = nodes.get(command2.into);
+        for (const id of targets) {
+          const entry = nodes.get(id);
+          if (id === command2.into || into.ancestors.includes(id) || entry.ancestors.includes(command2.into)) {
+            issues.push(motionIssue("match-self", `"${id}" cannot match "${command2.into}": one is the other or holds it. Match two separate groups (the second usually hidden).`, { ...where, ids: [id, command2.into] }));
+            continue;
+          }
+          const m = matchMotionNodes(entry.node, into.node);
+          if (m.unpairedInto.length)
+            issues.push(motionIssue("match-unpaired", `${m.unpairedInto.map((x) => `"${x}"`).join(", ")} in "${command2.into}" ${m.unpairedInto.length > 1 ? "have" : "has"} no partner in "${id}", so ${m.unpairedInto.length > 1 ? "they do" : "it does"} not appear; add a part with the same name or id to "${id}" (it can start hidden or tiny).`, { ...where, ids: m.unpairedInto }));
+        }
+      }
       const style = command2.type === "enter" || command2.type === "exit" ? command2.style : void 0;
       if (style === "wipe" || style === "iris" || style === "split") {
         for (const id of targets)
@@ -1261,6 +1361,7 @@ function checkMotionScene(scene) {
     });
   });
   for (const [key, track] of timeline.tracks) {
+    if (key.endsWith("\0add")) continue;
     for (let i = 1; i < track.length; i++) {
       const a = track[i - 1];
       const b = track[i];
@@ -1285,7 +1386,7 @@ function checkMotionScene(scene) {
     const cam = frame.camera;
     const docIndex = indexMotionNodes(frame.document.nodes);
     for (const id of command2.targets) {
-      const b = _optionalChain([docIndex, 'access', _30 => _30.get, 'call', _31 => _31(id), 'optionalAccess', _32 => _32.bounds]);
+      const b = _optionalChain([docIndex, 'access', _33 => _33.get, 'call', _34 => _34(id), 'optionalAccess', _35 => _35.bounds]);
       if (!b || reported.has(id) || !visibleAt(timeline, id, timing.end, nodes.get(id).node)) continue;
       const outside = b.x + b.width < cam.x || b.y + b.height < cam.y || b.x > cam.x + cam.width || b.y > cam.y + cam.height;
       if (outside) {
@@ -1467,9 +1568,9 @@ function applyMotionEdits(scene, edits) {
   let next = scene;
   for (let i = 0; i < list.length; i++) {
     const edit = list[i];
-    const prefix = list.length > 1 ? `op ${i + 1} (${_optionalChain([edit, 'optionalAccess', _33 => _33.op])}): ` : "";
+    const prefix = list.length > 1 ? `op ${i + 1} (${_optionalChain([edit, 'optionalAccess', _36 => _36.op])}): ` : "";
     if (!edit || !MOTION_EDIT_OPS.includes(edit.op))
-      return { ok: false, error: `${prefix}Unknown op ${namedWithSuggestion(String(_optionalChain([edit, 'optionalAccess', _34 => _34.op])), MOTION_EDIT_OPS)}. Nothing was changed.` };
+      return { ok: false, error: `${prefix}Unknown op ${namedWithSuggestion(String(_optionalChain([edit, 'optionalAccess', _37 => _37.op])), MOTION_EDIT_OPS)}. Nothing was changed.` };
     try {
       next = applyOne(next, edit);
     } catch (error) {
@@ -1601,7 +1702,7 @@ function toFlairSvgMotion(scene, options = {}) {
         const wrapper = freshId(`${id}--follow`);
         const centre = freshId(`${id}--follow-centre`);
         const c = entry.center;
-        const at = _optionalChain([motionNodeOffset, 'call', _35 => _35(entry, timeline, 0, nodes), 'optionalAccess', _36 => _36.follow]);
+        const at = _optionalChain([motionNodeOffset, 'call', _38 => _38(entry, timeline, 0, nodes), 'optionalAccess', _39 => _39.follow]);
         const placed = at ? `translate(${f(at.x)} ${f(at.y)})${at.angle ? ` rotate(${f(at.angle)})` : ""}` : void 0;
         (wrap[id] ??= []).push({ id: wrapper, ...placed ? { transform: placed } : {} }, { id: centre, transform: `translate(${f(-c.x)} ${f(-c.y)})` });
         follows.push({ id, wrapper, routes: ids, segments: followSegments.filter((seg) => seg.path && ids.has(seg.path)) });
@@ -1610,7 +1711,7 @@ function toFlairSvgMotion(scene, options = {}) {
     if (timeline.tracks.has(motionTrackKey(id, "opacity")))
       channels.push({ id, kind: "attr", attr: "opacity", segments: [...track(id, "opacity")], exact: plays, value: (t) => round2(Math.min(1, Math.max(0, Number(trackValue(track(id, "opacity"), t))))) });
     const followed = follows.some((x) => x.id === id);
-    const transformSegments = TRANSFORM_PROPS2.flatMap((p) => followed && p === "follow" ? [] : track(id, p));
+    const transformSegments = TRANSFORM_PROPS2.flatMap((p) => followed && p === "follow" ? [] : [...track(id, p), ..._nullishCoalesce(timeline.tracks.get(motionAddTrackKey(id, p)), () => ( []))]);
     if (transformSegments.length) {
       const base = node.transform ? ` matrix(${node.transform.map(f).join(" ")})` : "";
       const c = entry.center;
@@ -1661,7 +1762,7 @@ function toFlairSvgMotion(scene, options = {}) {
           exact: () => false,
           value: (t) => {
             const frame = motionFrameAt(scene, t, { draw: false, offsets: false });
-            const now = _chunkYJLCBA7Vcjs.expandVectorAppearance.call(void 0, _optionalChain([indexMotionNodes, 'call', _37 => _37(frame.document.nodes), 'access', _38 => _38.get, 'call', _39 => _39(id), 'optionalAccess', _40 => _40.node]));
+            const now = _chunkYJLCBA7Vcjs.expandVectorAppearance.call(void 0, _optionalChain([indexMotionNodes, 'call', _40 => _40(frame.document.nodes), 'access', _41 => _41.get, 'call', _42 => _42(id), 'optionalAccess', _43 => _43.node]));
             if (!now || now.type !== "path") return "";
             const bezier = _chunkO2UH7LZEcjs.transformBezierPath.call(void 0, _chunkYJLCBA7Vcjs.vectorPathWorldBezier.call(void 0, now, _chunkYJLCBA7Vcjs.IDENTITY_MATRIX, { effects: false }), inverse);
             return _chunkO2UH7LZEcjs.bezierPathToSvg.call(void 0, bezier, { precision: Math.min(precision, 2) });
@@ -1682,8 +1783,8 @@ function toFlairSvgMotion(scene, options = {}) {
       ...delay > 0 ? { delay: round2(delay) } : {},
       ms: round2(ms),
       ease: written,
-      ..._optionalChain([segment, 'optionalAccess', _41 => _41.behavior]) ? { behavior: segment.behavior } : {},
-      ..._optionalChain([segment, 'optionalAccess', _42 => _42.steps]) ? { strobe: segment.steps } : {}
+      ..._optionalChain([segment, 'optionalAccess', _44 => _44.behavior]) ? { behavior: segment.behavior } : {},
+      ..._optionalChain([segment, 'optionalAccess', _45 => _45.steps]) ? { strobe: segment.steps } : {}
     };
     if (channel.kind === "view") animate.push({ ...base, view: to });
     else if (channel.kind === "draw") animate.push({ ...base, draw: [from, to] });
@@ -1756,7 +1857,7 @@ function toFlairSvgMotion(scene, options = {}) {
   if (routes.length) svg = svg.replace(/^(<svg[^>]*>)/, `$1<defs>${routes.join("")}</defs>`);
   const lastChange = animate.reduce((m, a) => Math.max(m, (_nullishCoalesce(a.delay, () => ( 0))) + (_nullishCoalesce(a.ms, () => ( 0)))), 0);
   let motion = { svg, animate };
-  if (_optionalChain([scene, 'access', _43 => _43.controls, 'optionalAccess', _44 => _44.length])) {
+  if (_optionalChain([scene, 'access', _46 => _46.controls, 'optionalAccess', _47 => _47.length])) {
     const declarations = scene.controls.map((c) => `{{${c.name}: color default=${c.default.toUpperCase()}${c.label ? ` label='${c.label.replace(/'/g, "\u2019")}'` : ""}}}`).join(" ");
     const swap = (text) => scene.controls.reduce((s, c) => s.replace(new RegExp(`${c.default}(?![0-9a-fA-F])`, "gi"), `{{${c.name}}}`), text);
     svg = svg.replace(/^(<svg[^>]*>)/, `$1<!-- ${declarations} -->`);
@@ -1778,7 +1879,7 @@ function toFlairVectorEffect(scene, options = {}) {
     tags: _nullishCoalesce(options.tags, () => ( [])),
     motion: out.motion,
     hold: out.hold,
-    ..._optionalChain([scene, 'access', _45 => _45.presets, 'optionalAccess', _46 => _46.length]) ? { presets: scene.presets } : {},
+    ..._optionalChain([scene, 'access', _48 => _48.presets, 'optionalAccess', _49 => _49.length]) ? { presets: scene.presets } : {},
     ...options.trigger ? { trigger: options.trigger } : {}
   };
 }
@@ -1821,7 +1922,7 @@ function resolvePlaceholders(motion, notes) {
   const filled = text.replace(PLACEHOLDER, (_, name) => {
     const d = declared.get(name);
     if (!d) unknown.add(name);
-    return (_nullishCoalesce(_optionalChain([d, 'optionalAccess', _47 => _47.value]), () => ( ""))).replace(/"/g, '\\"');
+    return (_nullishCoalesce(_optionalChain([d, 'optionalAccess', _50 => _50.value]), () => ( ""))).replace(/"/g, '\\"');
   });
   for (const name of unknown) notes.push(`Placeholder "{{${name}}}" has no declaration, so it was left empty.`);
   return { motion: JSON.parse(filled), controls };
@@ -1875,7 +1976,7 @@ function commandsFor(anim, nodes, entered, notes) {
   if (anim.along) {
     const path = nodes.get(anim.along);
     if (!path || path.node.type !== "path") notes.push(`${where} follows "${anim.along}", which is not a path in the artwork; the follow was skipped.`);
-    else out.push({ type: "follow", targets, path: anim.along, from: _nullishCoalesce(_optionalChain([anim, 'access', _48 => _48.at, 'optionalAccess', _49 => _49[0]]), () => ( 0)), to: _nullishCoalesce(_optionalChain([anim, 'access', _50 => _50.at, 'optionalAccess', _51 => _51[1]]), () => ( 1)), ...anim.orient ? { rotate: true } : {}, ...timing, ...ease(MOTION_EASE_IN_OUT) });
+    else out.push({ type: "follow", targets, path: anim.along, from: _nullishCoalesce(_optionalChain([anim, 'access', _51 => _51.at, 'optionalAccess', _52 => _52[0]]), () => ( 0)), to: _nullishCoalesce(_optionalChain([anim, 'access', _53 => _53.at, 'optionalAccess', _54 => _54[1]]), () => ( 1)), ...anim.orient ? { rotate: true } : {}, ...timing, ...ease(MOTION_EASE_IN_OUT) });
   }
   for (const [attr, [a, b]] of Object.entries(_nullishCoalesce(anim.attrs, () => ( {})))) {
     if (attr === "opacity") {
@@ -1886,7 +1987,7 @@ function commandsFor(anim, nodes, entered, notes) {
         out.push({ type: "enter", targets, style: "fade", ...timing, ...ease(MOTION_EASE_OUT) });
       } else out.push({ type: "fade", targets, to: Math.min(1, Math.max(0, to)), ...timing, ...ease(MOTION_EASE_IN_OUT) });
     } else if (attr === "fill" || attr === "stroke") {
-      if (_optionalChain([behavior, 'optionalAccess', _52 => _52.type]) === "pulse") out.push({ type: "color-pulse", targets, color: String(b), paint: attr, count: _nullishCoalesce(behavior.count, () => ( 1)), ...timing, ...ease("linear") });
+      if (_optionalChain([behavior, 'optionalAccess', _55 => _55.type]) === "pulse") out.push({ type: "color-pulse", targets, color: String(b), paint: attr, count: _nullishCoalesce(behavior.count, () => ( 1)), ...timing, ...ease("linear") });
       else {
         if (behavior) notes.push(`${where}: a ${attr} ${behavior.type} became a plain colour change.`);
         out.push({ type: "style", targets, [attr]: String(b), ...timing, ...ease(MOTION_EASE_IN_OUT) });
@@ -2053,7 +2154,7 @@ var AnimationEditorController = (_class = class {
       time: p.time,
       playing: p.playing,
       loop: p.loop,
-      currentShot: _nullishCoalesce(_optionalChain([motionShotAt, 'call', _53 => _53(timeline, p.time), 'optionalAccess', _54 => _54.id]), () => ( null)),
+      currentShot: _nullishCoalesce(_optionalChain([motionShotAt, 'call', _56 => _56(timeline, p.time), 'optionalAccess', _57 => _57.id]), () => ( null)),
       selection: this.selection,
       readOnly: this.readOnly,
       error: this.error,
@@ -2092,7 +2193,7 @@ var AnimationEditorController = (_class = class {
       this.applying = false;
     }
     this.notify();
-    _optionalChain([this, 'access', _55 => _55.onChange, 'optionalCall', _56 => _56(scene)]);
+    _optionalChain([this, 'access', _58 => _58.onChange, 'optionalCall', _59 => _59(scene)]);
   }
   commit(label, next) {
     const before = this.scene;
@@ -2269,6 +2370,11 @@ var BASE = {
   repeatMode: { type: "string", enum: [...MOTION_REPEAT_MODES], description: "loop (default) restarts each cycle, mirror plays every other one backwards, offset carries on from where the last ended (rotate by 90 with repeat 4 makes a full turn)." },
   steps: { type: "number", exclusiveMinimum: 0, maximum: 120, description: `Stepped time: hold on a grid of this many frames per second (12 = "on twos"). Default: the scene's steps, else smooth.` }
 };
+var BLEND = (fallback) => ({
+  type: "string",
+  enum: [...MOTION_BLENDS],
+  description: `"add" makes it a layer over the pose that stacks with other changes (a shake on a slide); "replace" makes it a change the next one takes over from (default ${fallback}).`
+});
 var command = (type, description, extra = {}, required = []) => object({ type: { const: type, description }, ...BASE, ...extra }, ["type", "targets", ...required], description);
 var MOTION_COMMAND_SCHEMA = {
   description: `A command (one of ${MOTION_COMMAND_TYPES.join(", ")}). Commands in a shot play one after another unless "with": "previous".`,
@@ -2291,15 +2397,16 @@ var MOTION_COMMAND_SCHEMA = {
       distance: { type: "number", description: "For slide: document units (default 40)." }
     }),
     command("draw", "Draws strokes on (or off) to a fraction of their length.", { to: FRACTION("Fraction drawn at the end (default 1)."), from: FRACTION("Fraction drawn at the start (default: what is drawn now).") }),
-    command("move", "Moves targets by an offset or so their centre lands on a point.", { by: POINT("Offset in document units."), to: POINT("Point (document coordinates) for the centre.") }),
-    command("rotate", "Turns targets about their centre (degrees, clockwise).", { by: { type: "number", description: "Degrees to turn by." }, to: { type: "number", description: "Angle to turn to, in degrees from rest." } }),
-    command("scale", "Scales targets about their centre (1 = rest size).", { to: { description: "A factor, or { x, y } factors.", anyOf: [{ type: "number" }, POINT("Factors per axis.")] }, geometric: { type: "boolean", description: "Grow by a steady factor, which reads as an even zoom (default false)." } }, ["to"]),
+    command("move", "Moves targets by an offset or so their centre lands on a point.", { blend: BLEND("replace"), by: POINT("Offset in document units."), to: POINT("Point (document coordinates) for the centre.") }),
+    command("rotate", "Turns targets about their centre (degrees, clockwise).", { blend: BLEND("replace"), by: { type: "number", description: "Degrees to turn by." }, to: { type: "number", description: "Angle to turn to, in degrees from rest." } }),
+    command("scale", "Scales targets about their centre (1 = rest size).", { blend: BLEND("replace"), to: { description: "A factor, or { x, y } factors.", anyOf: [{ type: "number" }, POINT("Factors per axis.")] }, geometric: { type: "boolean", description: "Grow by a steady factor, which reads as an even zoom (default false)." } }, ["to"]),
     command("fade", "Changes opacity.", { to: FRACTION("Opacity at the end (0\u20131).") }, ["to"]),
     command("style", "Blends solid fill / stroke colours (in OKLab) and stroke width. On a group it changes every path in it.", {
       fill: { type: "string", description: "CSS colour (hex, rgb(), rgba())." },
       stroke: { type: "string", description: "CSS colour (hex, rgb(), rgba())." },
       strokeWidth: { type: "number", minimum: 0, description: "Document units." }
     }),
+    command("match", `Smart Animate: tweens a group into another group (usually hidden), part by part. Parts pair by name, then by id with the group ids taken out (card-a-title \u2194 card-b-title), then by kind in order; each takes its partner's shape, paint and place. Unpaired parts fade out; parts of "into" with no partner do not appear (check_animation lists them).`, { into: { type: "string", minLength: 1, description: "Id of the group to become." } }, ["into"]),
     command("morph", "Morphs each target into the shape (and paint) of another node, which usually stays hidden.", { into: { type: "string", minLength: 1, description: "Id of the node whose shape to take." } }, ["into"]),
     command("follow", "Moves targets along a path node, centre on the path.", {
       path: { type: "string", minLength: 1, description: "Id of a path node (it can be hidden)." },
@@ -2307,15 +2414,17 @@ var MOTION_COMMAND_SCHEMA = {
       from: FRACTION("Where to start along the path (default 0)."),
       to: FRACTION("Where to end along the path (default 1).")
     }, ["path"]),
-    command("pulse", "Scales up and back to draw the eye.", { amount: { type: "number", description: "Extra scale at the peak (default 0.15)." }, count: { type: "integer", minimum: 1, description: "Pulses (default 1)." } }),
+    command("pulse", "Scales up and back to draw the eye.", { blend: BLEND("add"), amount: { type: "number", description: "Extra scale at the peak (default 0.15)." }, count: { type: "integer", minimum: 1, description: "Pulses (default 1)." } }),
     command("shake", "Shakes side to side (or up and down), settling.", {
+      blend: BLEND("add"),
       amount: { type: "number", description: "Document units (default 8)." },
       count: { type: "integer", minimum: 1, description: "Shakes (default 3)." },
       axis: { type: "string", enum: ["horizontal", "vertical"], description: "Default horizontal." }
     }),
-    command("teeter", "Rocks about the centre either way, settling.", { angle: { type: "number", description: "Degrees either way (default 8)." }, count: { type: "integer", minimum: 1, description: "Rocks (default 3)." } }),
-    command("wave", "Bobs up and down without settling, like something floating (default 1000 ms).", { amount: { type: "number", description: "Height in document units (default 6)." }, count: { type: "integer", minimum: 1, description: "Bobs (default 2)." } }),
+    command("teeter", "Rocks about the centre either way, settling.", { blend: BLEND("add"), angle: { type: "number", description: "Degrees either way (default 8)." }, count: { type: "integer", minimum: 1, description: "Rocks (default 3)." } }),
+    command("wave", "Bobs up and down without settling, like something floating (default 1000 ms).", { blend: BLEND("add"), amount: { type: "number", description: "Height in document units (default 6)." }, count: { type: "integer", minimum: 1, description: "Bobs (default 2)." } }),
     command("wiggle", "Wanders about its place as smooth seeded noise, easing out of and back to rest (default 1500 ms). The same seed always wanders the same way.", {
+      blend: BLEND("add"),
       amount: { type: "number", description: "Up to about this far, in document units (default 6)." },
       frequency: { type: "number", exclusiveMinimum: 0, description: "Wanders per second, in Hz (default 3)." },
       octaves: { type: "integer", minimum: 1, maximum: 8, description: "Layers of finer detail (default 2)." },
@@ -2671,7 +2780,7 @@ function createAnimationEditorToolProvider(controller, options = {}) {
     inputSchema: object({ shot: SHOT_ID, commands: { type: "array", items: MOTION_COMMAND_SCHEMA, minItems: 1, description: "Commands to add." }, at: { type: "integer", minimum: 0, description: "Index in the run (default: the end)." } }, ["shot", "commands"]),
     annotations: { title: "Add commands to a shot", ...WRITE },
     handler: ({ shot, commands, at }) => {
-      const before = _nullishCoalesce(_optionalChain([scene, 'call', _57 => _57(), 'access', _58 => _58.shots, 'access', _59 => _59.find, 'call', _60 => _60((s) => s.id === shot), 'optionalAccess', _61 => _61.run, 'access', _62 => _62.length]), () => ( 0));
+      const before = _nullishCoalesce(_optionalChain([scene, 'call', _60 => _60(), 'access', _61 => _61.shots, 'access', _62 => _62.find, 'call', _63 => _63((s) => s.id === shot), 'optionalAccess', _64 => _64.run, 'access', _65 => _65.length]), () => ( 0));
       const first = _nullishCoalesce(at, () => ( before));
       return apply({ op: "add_commands", shot, commands, at }, "Add commands", (s) => {
         const shots = describeMotionShots(s);
@@ -2819,8 +2928,9 @@ Commands
 - enter also reveals through a clip over the target's box: wipe (behind an edge travelling "direction", default right), iris (from the centre; "shape": circle or box) and split (from a line through the middle; "orientation": horizontal or vertical). exit wipe hides the same way. Reveals need a width and a height: use draw / undraw for a straight line.
 - draw draws strokes on to a fraction; move, rotate, scale and fade change the pose (about the centre); style blends solid colours and stroke width.
 - enter also has zoom (settles from larger) and rise (rises a short way, overshooting a touch); pop and zoom take a starting "scale".
-- morph turns a shape into another node's shape (keep the target hidden); follow moves along a path node (with "rotate", moves made meanwhile turn with the path).
+- morph turns a shape into another node's shape (keep the target hidden); match does the same for a whole group, part by part (Smart Animate: draw the end state as a second, hidden group whose parts share names with the first); follow moves along a path node (with "rotate", moves made meanwhile turn with the path).
 - Emphasis draws the eye and returns to rest: pulse (swell), shake (side to side, or "axis": "vertical"), teeter (rock), wave (bob, no settling), wiggle (seeded wander; the same seed wanders the same way) and color-pulse (tint and back).
+- Emphasis stacks on other motion: a shake during a slide shakes as it slides. Give move, rotate or scale "blend": "add" to stack them too (what they add stays); "blend": "replace" makes a change take over instead.
 - Any command but enter and exit can "repeat" (loop, mirror back and forth, or offset to carry on: rotate by 90, repeat 4 is a full turn); "duration" is one cycle.
 - Springs ("spring-gentle", "spring-quick", "spring-bouncy", "spring-slow" or { "type": "spring", \u2026 }) feel physical; leave "duration" out and the spring sets it.
 - "steps": 12 (on a command, or for the whole scene with set_animation_settings) holds poses "on twos" for a hand-drawn look. "geometric": true on scale or a camera zooms at an even rate.
@@ -2913,5 +3023,10 @@ Keep motion purposeful: one thing moving at a time reads best, ease-out for arri
 
 
 
-exports.ANIMATION_EDITOR_AGENT_INSTRUCTIONS = ANIMATION_EDITOR_AGENT_INSTRUCTIONS; exports.AnimationEditorController = AnimationEditorController; exports.FLAIR_EASES = FLAIR_EASES; exports.FLAIR_EXPORT_VERSION = FLAIR_EXPORT_VERSION; exports.MOTION_CAMERA_MS = MOTION_CAMERA_MS; exports.MOTION_COMMAND_SCHEMA = MOTION_COMMAND_SCHEMA; exports.MOTION_COMMAND_TYPES = MOTION_COMMAND_TYPES; exports.MOTION_DEFAULT_DURATIONS = MOTION_DEFAULT_DURATIONS; exports.MOTION_DEFAULT_HOLD = MOTION_DEFAULT_HOLD; exports.MOTION_DIRECTIONS = MOTION_DIRECTIONS; exports.MOTION_DRAW_EFFECT_ID = MOTION_DRAW_EFFECT_ID; exports.MOTION_DRAW_MS_PER_UNIT = MOTION_DRAW_MS_PER_UNIT; exports.MOTION_DRAW_RANGE = MOTION_DRAW_RANGE; exports.MOTION_EASE_IN_OUT = MOTION_EASE_IN_OUT; exports.MOTION_EASE_OUT = MOTION_EASE_OUT; exports.MOTION_EDIT_OPS = MOTION_EDIT_OPS; exports.MOTION_ENTER_STYLES = MOTION_ENTER_STYLES; exports.MOTION_EXIT_STYLES = MOTION_EXIT_STYLES; exports.MOTION_IRIS_SHAPES = MOTION_IRIS_SHAPES; exports.MOTION_ISSUE_CODES = MOTION_ISSUE_CODES; exports.MOTION_MIN_CHANGE_MS = MOTION_MIN_CHANGE_MS; exports.MOTION_REPEAT_MODES = MOTION_REPEAT_MODES; exports.MOTION_SPLIT_ORIENTATIONS = MOTION_SPLIT_ORIENTATIONS; exports.MotionSceneFormatError = MotionSceneFormatError; exports.activeSegment = activeSegment; exports.applyMotionControlValues = applyMotionControlValues; exports.applyMotionEdits = applyMotionEdits; exports.checkMotionScene = checkMotionScene; exports.commandShapeProblems = commandShapeProblems; exports.compileMotionScene = compileMotionScene; exports.createAnimationEditorToolProvider = createAnimationEditorToolProvider; exports.createMotionScene = createMotionScene; exports.describeMotionElements = describeMotionElements; exports.describeMotionShots = describeMotionShots; exports.fitMotionRect = fitMotionRect; exports.flairAtLeast = flairAtLeast; exports.flairCurveFor = flairCurveFor; exports.flairEaseFor = flairEaseFor; exports.freshShotId = freshShotId; exports.fromFlairSvgMotion = fromFlairSvgMotion; exports.fromFlairVectorEffect = fromFlairVectorEffect; exports.indexMotionNodes = indexMotionNodes; exports.interpolateMotionValue = interpolateMotionValue; exports.isMotionCommand = isMotionCommand; exports.isMotionShot = isMotionShot; exports.motionClipAttrs = motionClipAttrs; exports.motionCommandDuration = motionCommandDuration; exports.motionCommandRepeat = motionCommandRepeat; exports.motionCycleDuration = motionCycleDuration; exports.motionFlairPrimitive = motionFlairPrimitive; exports.motionFollowRoute = motionFollowRoute; exports.motionFrameAt = motionFrameAt; exports.motionFrameToSvg = motionFrameToSvg; exports.motionIssue = motionIssue; exports.motionIssueKey = motionIssueKey; exports.motionIssueLine = motionIssueLine; exports.motionNodeClips = motionNodeClips; exports.motionNodeOffset = motionNodeOffset; exports.motionPathLength = motionPathLength; exports.motionRestValue = motionRestValue; exports.motionRevealClip = motionRevealClip; exports.motionRevealPadding = motionRevealPadding; exports.motionSceneShapeProblems = motionSceneShapeProblems; exports.motionSceneToJson = motionSceneToJson; exports.motionShotAt = motionShotAt; exports.motionTrackKey = motionTrackKey; exports.namedWithSuggestion = namedWithSuggestion; exports.parseMotionScene = parseMotionScene; exports.resolveMotionCamera = resolveMotionCamera; exports.segmentProgress = segmentProgress; exports.segmentValue = segmentValue; exports.shotShapeProblems = shotShapeProblems; exports.suggestName = suggestName; exports.toFlairEffectDocument = toFlairEffectDocument; exports.toFlairSvgMotion = toFlairSvgMotion; exports.toFlairVectorEffect = toFlairVectorEffect; exports.trackValue = trackValue; exports.withViewBox = withViewBox;
+
+
+
+
+
+exports.ANIMATION_EDITOR_AGENT_INSTRUCTIONS = ANIMATION_EDITOR_AGENT_INSTRUCTIONS; exports.AnimationEditorController = AnimationEditorController; exports.FLAIR_EASES = FLAIR_EASES; exports.FLAIR_EXPORT_VERSION = FLAIR_EXPORT_VERSION; exports.MOTION_ADDITIVE_PROPERTIES = MOTION_ADDITIVE_PROPERTIES; exports.MOTION_BLENDS = MOTION_BLENDS; exports.MOTION_CAMERA_MS = MOTION_CAMERA_MS; exports.MOTION_COMMAND_SCHEMA = MOTION_COMMAND_SCHEMA; exports.MOTION_COMMAND_TYPES = MOTION_COMMAND_TYPES; exports.MOTION_DEFAULT_DURATIONS = MOTION_DEFAULT_DURATIONS; exports.MOTION_DEFAULT_HOLD = MOTION_DEFAULT_HOLD; exports.MOTION_DIRECTIONS = MOTION_DIRECTIONS; exports.MOTION_DRAW_EFFECT_ID = MOTION_DRAW_EFFECT_ID; exports.MOTION_DRAW_MS_PER_UNIT = MOTION_DRAW_MS_PER_UNIT; exports.MOTION_DRAW_RANGE = MOTION_DRAW_RANGE; exports.MOTION_EASE_IN_OUT = MOTION_EASE_IN_OUT; exports.MOTION_EASE_OUT = MOTION_EASE_OUT; exports.MOTION_EDIT_OPS = MOTION_EDIT_OPS; exports.MOTION_ENTER_STYLES = MOTION_ENTER_STYLES; exports.MOTION_EXIT_STYLES = MOTION_EXIT_STYLES; exports.MOTION_IRIS_SHAPES = MOTION_IRIS_SHAPES; exports.MOTION_ISSUE_CODES = MOTION_ISSUE_CODES; exports.MOTION_MIN_CHANGE_MS = MOTION_MIN_CHANGE_MS; exports.MOTION_REPEAT_MODES = MOTION_REPEAT_MODES; exports.MOTION_SPLIT_ORIENTATIONS = MOTION_SPLIT_ORIENTATIONS; exports.MotionSceneFormatError = MotionSceneFormatError; exports.activeSegment = activeSegment; exports.applyMotionControlValues = applyMotionControlValues; exports.applyMotionEdits = applyMotionEdits; exports.checkMotionScene = checkMotionScene; exports.commandShapeProblems = commandShapeProblems; exports.compileMotionScene = compileMotionScene; exports.createAnimationEditorToolProvider = createAnimationEditorToolProvider; exports.createMotionScene = createMotionScene; exports.describeMotionElements = describeMotionElements; exports.describeMotionShots = describeMotionShots; exports.fitMotionRect = fitMotionRect; exports.flairAtLeast = flairAtLeast; exports.flairCurveFor = flairCurveFor; exports.flairEaseFor = flairEaseFor; exports.freshShotId = freshShotId; exports.fromFlairSvgMotion = fromFlairSvgMotion; exports.fromFlairVectorEffect = fromFlairVectorEffect; exports.indexMotionNodes = indexMotionNodes; exports.interpolateMotionValue = interpolateMotionValue; exports.isMotionCommand = isMotionCommand; exports.isMotionShot = isMotionShot; exports.matchMotionNodes = matchMotionNodes; exports.motionAddTrackKey = motionAddTrackKey; exports.motionClipAttrs = motionClipAttrs; exports.motionCommandDuration = motionCommandDuration; exports.motionCommandRepeat = motionCommandRepeat; exports.motionCycleDuration = motionCycleDuration; exports.motionFlairPrimitive = motionFlairPrimitive; exports.motionFollowRoute = motionFollowRoute; exports.motionFrameAt = motionFrameAt; exports.motionFrameToSvg = motionFrameToSvg; exports.motionIssue = motionIssue; exports.motionIssueKey = motionIssueKey; exports.motionIssueLine = motionIssueLine; exports.motionNodeClips = motionNodeClips; exports.motionNodeOffset = motionNodeOffset; exports.motionPathLength = motionPathLength; exports.motionRestValue = motionRestValue; exports.motionRevealClip = motionRevealClip; exports.motionRevealPadding = motionRevealPadding; exports.motionSceneShapeProblems = motionSceneShapeProblems; exports.motionSceneToJson = motionSceneToJson; exports.motionShotAt = motionShotAt; exports.motionTrackKey = motionTrackKey; exports.namedWithSuggestion = namedWithSuggestion; exports.parseMotionScene = parseMotionScene; exports.resolveMotionCamera = resolveMotionCamera; exports.segmentProgress = segmentProgress; exports.segmentValue = segmentValue; exports.shotShapeProblems = shotShapeProblems; exports.suggestName = suggestName; exports.toFlairEffectDocument = toFlairEffectDocument; exports.toFlairSvgMotion = toFlairSvgMotion; exports.toFlairVectorEffect = toFlairVectorEffect; exports.trackValue = trackValue; exports.withMotionLayers = withMotionLayers; exports.withViewBox = withViewBox;
 //# sourceMappingURL=index.cjs.map