@elucim/dsl 0.1.3 → 0.2.1

package/dist/index.js

@@ -1,14 +1,14 @@
-import { easeOutBounce as K, easeOutElastic as X, easeOutBack as Y, easeInBack as J, easeInOutExpo as Z, easeOutExpo as ee, easeInExpo as te, easeInOutSine as re, easeOutSine as ae, easeInSine as ie, easeInOutQuart as ne, easeOutQuart as se, easeInQuart as ce, easeInOutCubic as le, easeOutCubic as ue, easeInCubic as he, easeInOutQuad as fe, easeOutQuad as oe, easeInQuad as ye, linear as ge, spring as me, cubicBezier as be, Presentation as de, Player as xe, Scene as ve, Slide as we, Parallel as ke, Stagger as $e, Morph as Se, Transform as Ie, Write as Ce, Draw as Ae, FadeOut as Ee, FadeIn as Oe, BarChart as ze, LaTeX as Fe, Graph as Pe, Matrix as Me, VectorField as We, Vector as Ne, FunctionPlot as _e, Axes as Re, Text as De, Polygon as Te, Rect as Le, Arrow as je, Line as pe, Circle as qe, Sequence as Ue } from "@elucim/core";
+import { easeOutBounce as J, easeOutElastic as Z, easeOutBack as ee, easeInBack as te, easeInOutExpo as ae, easeOutExpo as ie, easeInExpo as re, easeInOutSine as ne, easeOutSine as se, easeInSine as ce, easeInOutQuart as le, easeOutQuart as ue, easeInQuart as he, easeInOutCubic as fe, easeOutCubic as ge, easeInCubic as oe, easeInOutQuad as ye, easeOutQuad as me, easeInQuad as be, linear as xe, spring as ve, cubicBezier as de, Presentation as we, Player as ke, Scene as Ie, Slide as $e, Parallel as Se, Stagger as Oe, Morph as Ae, Transform as Ce, Write as ze, Draw as Ee, FadeOut as Fe, FadeIn as Pe, BarChart as Re, LaTeX as pe, Graph as Ne, Matrix as Me, VectorField as We, Vector as _e, FunctionPlot as De, Axes as Te, Image as Le, Text as je, Polygon as qe, Rect as Be, Arrow as Ue, Line as Ve, Circle as He, Group as Ge, Sequence as Qe } from "@elucim/core";
 import { jsxs as L, jsx as s } from "react/jsx-runtime";
-import z from "react";
-const M = {
+import j from "react";
+const N = {
   sin: Math.sin,
   cos: Math.cos,
   tan: Math.tan,
   asin: Math.asin,
   acos: Math.acos,
   atan: Math.atan,
-  atan2: (e, r) => Math.atan2(e, r),
+  atan2: (e, a) => Math.atan2(e, a),
   sqrt: Math.sqrt,
   abs: Math.abs,
   log: Math.log10,
@@ -21,133 +21,133 @@ const M = {
   max: (...e) => Math.max(...e),
   sign: Math.sign,
   pow: Math.pow
-}, j = {
+}, q = {
   PI: Math.PI,
   E: Math.E,
   TAU: Math.PI * 2
 };
-function _(e) {
-  const r = [];
+function W(e) {
+  const a = [];
   let t = 0;
   for (; t < e.length; ) {
-    const a = e[t];
-    if (/\s/.test(a)) {
+    const i = e[t];
+    if (/\s/.test(i)) {
       t++;
       continue;
     }
-    if (/[0-9]/.test(a) || a === "." && t + 1 < e.length && /[0-9]/.test(e[t + 1])) {
+    if (/[0-9]/.test(i) || i === "." && t + 1 < e.length && /[0-9]/.test(e[t + 1])) {
       let n = "";
-      const l = t;
+      const u = t;
       for (; t < e.length && /[0-9.]/.test(e[t]); )
         n += e[t++];
-      r.push({ type: "NUMBER", value: n, pos: l });
+      a.push({ type: "NUMBER", value: n, pos: u });
       continue;
     }
-    if (/[a-zA-Z_]/.test(a)) {
+    if (/[a-zA-Z_]/.test(i)) {
       let n = "";
-      const l = t;
+      const u = t;
       for (; t < e.length && /[a-zA-Z0-9_]/.test(e[t]); )
         n += e[t++];
-      r.push({ type: "IDENT", value: n, pos: l });
+      a.push({ type: "IDENT", value: n, pos: u });
       continue;
     }
-    const i = t;
-    switch (t++, a) {
+    const r = t;
+    switch (t++, i) {
       case "+":
-        r.push({ type: "PLUS", value: "+", pos: i });
+        a.push({ type: "PLUS", value: "+", pos: r });
         break;
       case "-":
-        r.push({ type: "MINUS", value: "-", pos: i });
+        a.push({ type: "MINUS", value: "-", pos: r });
         break;
       case "*":
-        r.push({ type: "STAR", value: "*", pos: i });
+        a.push({ type: "STAR", value: "*", pos: r });
         break;
       case "/":
-        r.push({ type: "SLASH", value: "/", pos: i });
+        a.push({ type: "SLASH", value: "/", pos: r });
         break;
       case "^":
-        r.push({ type: "CARET", value: "^", pos: i });
+        a.push({ type: "CARET", value: "^", pos: r });
         break;
       case "(":
-        r.push({ type: "LPAREN", value: "(", pos: i });
+        a.push({ type: "LPAREN", value: "(", pos: r });
         break;
       case ")":
-        r.push({ type: "RPAREN", value: ")", pos: i });
+        a.push({ type: "RPAREN", value: ")", pos: r });
         break;
       case "[":
-        r.push({ type: "LBRACKET", value: "[", pos: i });
+        a.push({ type: "LBRACKET", value: "[", pos: r });
         break;
       case "]":
-        r.push({ type: "RBRACKET", value: "]", pos: i });
+        a.push({ type: "RBRACKET", value: "]", pos: r });
         break;
       case ",":
-        r.push({ type: "COMMA", value: ",", pos: i });
+        a.push({ type: "COMMA", value: ",", pos: r });
         break;
       default:
-        throw new b(`Unexpected character '${a}'`, i);
+        throw new x(`Unexpected character '${i}'`, r);
     }
   }
-  return r.push({ type: "EOF", value: "", pos: t }), r;
+  return a.push({ type: "EOF", value: "", pos: t }), a;
 }
-class R {
-  constructor(r) {
-    this.pos = 0, this.tokens = r;
+class _ {
+  constructor(a) {
+    this.pos = 0, this.tokens = a;
   }
   peek() {
     return this.tokens[this.pos];
   }
   advance() {
-    const r = this.tokens[this.pos];
-    return this.pos++, r;
+    const a = this.tokens[this.pos];
+    return this.pos++, a;
   }
-  expect(r) {
+  expect(a) {
     const t = this.peek();
-    if (t.type !== r)
-      throw new b(
-        `Expected ${r} but got ${t.type} ('${t.value}')`,
+    if (t.type !== a)
+      throw new x(
+        `Expected ${a} but got ${t.type} ('${t.value}')`,
         t.pos
       );
     return this.advance();
   }
   // Entry point
   parse() {
-    const r = this.parseExpression();
+    const a = this.parseExpression();
     if (this.peek().type !== "EOF") {
       const t = this.peek();
-      throw new b(
+      throw new x(
         `Unexpected token '${t.value}' after expression`,
         t.pos
       );
     }
-    return r;
+    return a;
   }
   // expression = term (('+' | '-') term)*
   parseExpression() {
-    let r = this.parseTerm();
+    let a = this.parseTerm();
     for (; this.peek().type === "PLUS" || this.peek().type === "MINUS"; ) {
-      const t = this.advance().value, a = this.parseTerm();
-      r = { kind: "binary", op: t, left: r, right: a };
+      const t = this.advance().value, i = this.parseTerm();
+      a = { kind: "binary", op: t, left: a, right: i };
     }
-    return r;
+    return a;
   }
   // term = power (('*' | '/') power)*
   parseTerm() {
-    let r = this.parsePower();
+    let a = this.parsePower();
     for (; this.peek().type === "STAR" || this.peek().type === "SLASH"; ) {
-      const t = this.advance().value, a = this.parsePower();
-      r = { kind: "binary", op: t, left: r, right: a };
+      const t = this.advance().value, i = this.parsePower();
+      a = { kind: "binary", op: t, left: a, right: i };
     }
-    return r;
+    return a;
   }
   // power = unary ('^' power)?  (right-associative)
   parsePower() {
-    const r = this.parseUnary();
+    const a = this.parseUnary();
     if (this.peek().type === "CARET") {
       this.advance();
       const t = this.parsePower();
-      return { kind: "binary", op: "^", left: r, right: t };
+      return { kind: "binary", op: "^", left: a, right: t };
     }
-    return r;
+    return a;
   }
   // unary = ('+' | '-') unary | primary
   parseUnary() {
@@ -155,33 +155,33 @@ class R {
   }
   // primary = NUMBER | IDENT ('(' args ')')? | '(' expression ')' | '[' elements ']'
   parsePrimary() {
-    const r = this.peek();
-    if (r.type === "NUMBER")
-      return this.advance(), { kind: "number", value: parseFloat(r.value) };
-    if (r.type === "IDENT") {
+    const a = this.peek();
+    if (a.type === "NUMBER")
+      return this.advance(), { kind: "number", value: parseFloat(a.value) };
+    if (a.type === "IDENT") {
       this.advance();
-      const t = r.value;
+      const t = a.value;
       if (this.peek().type === "LPAREN") {
         this.advance();
-        const a = [];
+        const i = [];
         if (this.peek().type !== "RPAREN")
-          for (a.push(this.parseExpression()); this.peek().type === "COMMA"; )
-            this.advance(), a.push(this.parseExpression());
-        if (this.expect("RPAREN"), !Object.prototype.hasOwnProperty.call(M, t))
-          throw new b(
-            `Unknown function '${t}'. Available: ${Object.keys(M).join(", ")}`,
-            r.pos
+          for (i.push(this.parseExpression()); this.peek().type === "COMMA"; )
+            this.advance(), i.push(this.parseExpression());
+        if (this.expect("RPAREN"), !Object.prototype.hasOwnProperty.call(N, t))
+          throw new x(
+            `Unknown function '${t}'. Available: ${Object.keys(N).join(", ")}`,
+            a.pos
           );
-        return { kind: "call", name: t, args: a };
+        return { kind: "call", name: t, args: i };
       }
-      return Object.prototype.hasOwnProperty.call(j, t) ? { kind: "number", value: j[t] } : { kind: "variable", name: t };
+      return Object.prototype.hasOwnProperty.call(q, t) ? { kind: "number", value: q[t] } : { kind: "variable", name: t };
     }
-    if (r.type === "LPAREN") {
+    if (a.type === "LPAREN") {
       this.advance();
       const t = this.parseExpression();
       return this.expect("RPAREN"), t;
     }
-    if (r.type === "LBRACKET") {
+    if (a.type === "LBRACKET") {
       this.advance();
       const t = [];
       if (this.peek().type !== "RBRACKET")
@@ -189,128 +189,128 @@ class R {
           this.advance(), t.push(this.parseExpression());
       return this.expect("RBRACKET"), { kind: "array", elements: t };
     }
-    throw new b(
-      `Unexpected token '${r.value}'`,
-      r.pos
+    throw new x(
+      `Unexpected token '${a.value}'`,
+      a.pos
     );
   }
 }
-function d(e, r) {
+function w(e, a) {
   switch (e.kind) {
     case "number":
       return e.value;
     case "variable":
-      if (Object.prototype.hasOwnProperty.call(r, e.name)) return r[e.name];
-      throw new b(`Unknown variable '${e.name}'`, 0);
+      if (Object.prototype.hasOwnProperty.call(a, e.name)) return a[e.name];
+      throw new x(`Unknown variable '${e.name}'`, 0);
     case "unary":
-      const t = d(e.operand, r);
+      const t = w(e.operand, a);
       return e.op === "-" ? -t : t;
     case "binary": {
-      const a = d(e.left, r), i = d(e.right, r);
+      const i = w(e.left, a), r = w(e.right, a);
       switch (e.op) {
         case "+":
-          return a + i;
+          return i + r;
         case "-":
-          return a - i;
+          return i - r;
         case "*":
-          return a * i;
+          return i * r;
         case "/":
-          return i === 0 ? 1 / 0 : a / i;
+          return r === 0 ? 1 / 0 : i / r;
         case "^":
-          return Math.pow(a, i);
+          return Math.pow(i, r);
       }
       break;
     }
     case "call": {
-      const a = M[e.name], i = e.args.map((n) => d(n, r));
-      return a(...i);
+      const i = N[e.name], r = e.args.map((n) => w(n, a));
+      return i(...r);
     }
     case "array":
-      return e.elements.map((a) => d(a, r));
+      return e.elements.map((i) => w(i, a));
   }
-  throw new b("Invalid AST node", 0);
+  throw new x("Invalid AST node", 0);
 }
-class b extends Error {
-  constructor(r, t) {
-    super(r), this.name = "ExpressionError", this.position = t;
+class x extends Error {
+  constructor(a, t) {
+    super(a), this.name = "ExpressionError", this.position = t;
   }
 }
-function Be(e) {
-  const r = _(e), t = new R(r).parse();
-  return (a) => d(t, a);
+function Ke(e) {
+  const a = W(e), t = new _(a).parse();
+  return (i) => w(t, i);
 }
-function Ve(e) {
-  const r = _(e), t = new R(r).parse();
+function Xe(e) {
+  const a = W(e), t = new _(a).parse();
   if (t.kind !== "array" || t.elements.length !== 2)
-    throw new b(
+    throw new x(
       'Vector expression must be an array of 2 elements, e.g. "[-y, x]"',
       0
     );
-  return (a) => d(t, a);
+  return (i) => w(t, i);
 }
-function U(e) {
+function H(e) {
   try {
-    const r = _(e);
-    return new R(r).parse(), null;
-  } catch (r) {
-    return r instanceof b ? `${r.message} (at position ${r.position})` : String(r);
+    const a = W(e);
+    return new _(a).parse(), null;
+  } catch (a) {
+    return a instanceof x ? `${a.message} (at position ${a.position})` : String(a);
   }
 }
-const W = {
-  linear: ge,
-  easeInQuad: ye,
-  easeOutQuad: oe,
-  easeInOutQuad: fe,
-  easeInCubic: he,
-  easeOutCubic: ue,
-  easeInOutCubic: le,
-  easeInQuart: ce,
-  easeOutQuart: se,
-  easeInOutQuart: ne,
-  easeInSine: ie,
-  easeOutSine: ae,
-  easeInOutSine: re,
-  easeInExpo: te,
-  easeOutExpo: ee,
-  easeInOutExpo: Z,
-  easeInBack: J,
-  easeOutBack: Y,
-  easeOutElastic: X,
-  easeOutBounce: K
+const M = {
+  linear: xe,
+  easeInQuad: be,
+  easeOutQuad: me,
+  easeInOutQuad: ye,
+  easeInCubic: oe,
+  easeOutCubic: ge,
+  easeInOutCubic: fe,
+  easeInQuart: he,
+  easeOutQuart: ue,
+  easeInOutQuart: le,
+  easeInSine: ce,
+  easeOutSine: se,
+  easeInOutSine: ne,
+  easeInExpo: re,
+  easeOutExpo: ie,
+  easeInOutExpo: ae,
+  easeInBack: te,
+  easeOutBack: ee,
+  easeOutElastic: Z,
+  easeOutBounce: J
 };
 function c(e) {
   if (e !== void 0) {
     if (typeof e == "string") {
-      const r = W[e];
-      if (!r) {
-        const t = Object.keys(W), a = t.find((n) => n.toLowerCase() === e.toLowerCase()), i = a ? ` Did you mean '${a}'?` : "";
-        throw new Error(`Unknown easing '${e}'.${i} Available: ${t.join(", ")}`);
+      const a = M[e];
+      if (!a) {
+        const t = Object.keys(M), i = t.find((n) => n.toLowerCase() === e.toLowerCase()), r = i ? ` Did you mean '${i}'?` : "";
+        throw new Error(`Unknown easing '${e}'.${r} Available: ${t.join(", ")}`);
       }
-      return r;
+      return a;
     }
     if (e.type === "spring")
-      return me({
+      return ve({
         stiffness: e.stiffness,
         damping: e.damping,
         mass: e.mass
       });
     if (e.type === "cubicBezier")
-      return be(e.x1, e.y1, e.x2, e.y2);
+      return de(e.x1, e.y1, e.x2, e.y2);
     throw new Error(`Unknown easing type: ${e.type}`);
   }
 }
-const F = Object.keys(W);
-function He(e) {
-  const r = [];
+const R = Object.keys(M);
+function Ye(e) {
+  const a = [];
   if (!e || typeof e != "object")
-    return r.push({ path: "", message: "Document must be an object", severity: "error" }), { valid: !1, errors: r };
+    return a.push({ path: "", message: "Document must be an object", severity: "error" }), { valid: !1, errors: a };
   const t = e;
-  return t.version !== "1.0" && r.push({ path: "version", message: `Expected version "1.0", got "${t.version}"`, severity: "error" }), !t.root || typeof t.root != "object" ? (r.push({ path: "root", message: 'Missing or invalid "root" node', severity: "error" }), { valid: r.filter((a) => a.severity === "error").length === 0, errors: r }) : (Ge(t.root, "root", r), {
-    valid: r.filter((a) => a.severity === "error").length === 0,
-    errors: r
+  return t.version !== "1.0" && a.push({ path: "version", message: `Expected version "1.0", got "${t.version}"`, severity: "error" }), !t.root || typeof t.root != "object" ? (a.push({ path: "root", message: 'Missing or invalid "root" node', severity: "error" }), { valid: a.filter((i) => i.severity === "error").length === 0, errors: a }) : (Je(t.root, "root", a), {
+    valid: a.filter((i) => i.severity === "error").length === 0,
+    errors: a
   });
 }
-const p = ["scene", "player", "presentation"], P = [
+const B = ["scene", "player", "presentation"], p = [
   "sequence",
   "group",
   "circle",
@@ -319,6 +319,7 @@ const p = ["scene", "player", "presentation"], P = [
   "rect",
   "polygon",
   "text",
+  "image",
   "axes",
   "functionPlot",
   "vectorField",
@@ -337,336 +338,373 @@ const p = ["scene", "player", "presentation"], P = [
   "parallel",
   "player",
   "scene"
-], q = ["none", "fade", "slide-left", "slide-up", "zoom"];
-function Ge(e, r, t) {
-  const a = e.type;
-  if (!p.includes(a)) {
-    t.push({ path: `${r}.type`, message: `Root type must be one of: ${p.join(", ")}. Got "${a}"`, severity: "error" });
+], U = ["none", "fade", "slide-left", "slide-up", "zoom"];
+function Je(e, a, t) {
+  const i = e.type;
+  if (!B.includes(i)) {
+    t.push({ path: `${a}.type`, message: `Root type must be one of: ${B.join(", ")}. Got "${i}"`, severity: "error" });
     return;
   }
-  a === "scene" || a === "player" ? B(e, r, a, t) : a === "presentation" && Qe(e, r, t);
+  i === "scene" || i === "player" ? G(e, a, i, t) : i === "presentation" && Ze(e, a, t);
 }
-function B(e, r, t, a) {
-  gt(e, "durationInFrames", r, a), o(e, "width", r, a), o(e, "height", r, a), o(e, "fps", r, a), x(e, "background", r, a), t === "player" && ($(e, "controls", r, a), $(e, "loop", r, a), $(e, "autoPlay", r, a)), w(e, r, a);
+function G(e, a, t, i) {
+  St(e, "durationInFrames", a, i), h(e, "width", a, i), h(e, "height", a, i), h(e, "fps", a, i), v(e, "background", a, i), t === "player" && (S(e, "controls", a, i), S(e, "loop", a, i), S(e, "autoPlay", a, i)), d(e, a, i);
 }
-function Qe(e, r, t) {
-  if (o(e, "width", r, t), o(e, "height", r, t), x(e, "background", r, t), o(e, "transitionDuration", r, t), $(e, "showHud", r, t), $(e, "showNotes", r, t), e.transition !== void 0 && (q.includes(e.transition) || t.push({
-    path: `${r}.transition`,
-    message: `Invalid transition "${e.transition}". Must be one of: ${q.join(", ")}`,
+function Ze(e, a, t) {
+  if (h(e, "width", a, t), h(e, "height", a, t), v(e, "background", a, t), h(e, "transitionDuration", a, t), S(e, "showHud", a, t), S(e, "showNotes", a, t), e.transition !== void 0 && (U.includes(e.transition) || t.push({
+    path: `${a}.transition`,
+    message: `Invalid transition "${e.transition}". Must be one of: ${U.join(", ")}`,
     severity: "error"
   })), !Array.isArray(e.slides)) {
-    t.push({ path: `${r}.slides`, message: 'Presentation must have a "slides" array', severity: "error" });
+    t.push({ path: `${a}.slides`, message: 'Presentation must have a "slides" array', severity: "error" });
     return;
   }
-  e.slides.length === 0 && t.push({ path: `${r}.slides`, message: "Presentation must have at least one slide", severity: "warning" }), e.slides.forEach((a, i) => {
-    Ke(a, `${r}.slides[${i}]`, t);
+  e.slides.length === 0 && t.push({ path: `${a}.slides`, message: "Presentation must have at least one slide", severity: "warning" }), e.slides.forEach((i, r) => {
+    et(i, `${a}.slides[${r}]`, t);
   });
 }
-function Ke(e, r, t) {
+function et(e, a, t) {
   if (!e || typeof e != "object") {
-    t.push({ path: r, message: "Slide must be an object", severity: "error" });
+    t.push({ path: a, message: "Slide must be an object", severity: "error" });
     return;
   }
-  x(e, "title", r, t), x(e, "notes", r, t), x(e, "background", r, t), e.children !== void 0 && (Array.isArray(e.children) ? e.children.forEach((a, i) => {
-    V(a, `${r}.children[${i}]`, t);
-  }) : t.push({ path: `${r}.children`, message: "Slide children must be an array", severity: "error" }));
+  v(e, "title", a, t), v(e, "notes", a, t), v(e, "background", a, t), e.children !== void 0 && (Array.isArray(e.children) ? e.children.forEach((i, r) => {
+    Q(i, `${a}.children[${r}]`, t);
+  }) : t.push({ path: `${a}.children`, message: "Slide children must be an array", severity: "error" }));
 }
-function w(e, r, t) {
+function d(e, a, t) {
   if (!Array.isArray(e.children)) {
-    t.push({ path: `${r}.children`, message: 'Expected "children" array', severity: "error" });
+    t.push({ path: `${a}.children`, message: 'Expected "children" array', severity: "error" });
     return;
   }
-  e.children.forEach((a, i) => {
-    V(a, `${r}.children[${i}]`, t);
+  e.children.forEach((i, r) => {
+    Q(i, `${a}.children[${r}]`, t);
   });
 }
-function V(e, r, t) {
+function Q(e, a, t) {
   if (!e || typeof e != "object") {
-    t.push({ path: r, message: "Element must be an object", severity: "error" });
+    t.push({ path: a, message: "Element must be an object", severity: "error" });
     return;
   }
-  const a = e.type;
-  if (!a || !P.includes(a)) {
-    const i = a ? H(a, P) : "";
+  const i = e.type;
+  if (!i || !p.includes(i)) {
+    const r = i ? K(i, p) : "";
     t.push({
-      path: `${r}.type`,
-      message: `Unknown element type "${a}".${i} Valid types: ${P.join(", ")}`,
+      path: `${a}.type`,
+      message: `Unknown element type "${i}".${r} Valid types: ${p.join(", ")}`,
       severity: "error"
     });
     return;
   }
-  switch (a) {
+  switch (i) {
     case "circle":
-      Xe(e, r, t);
+      tt(e, a, t);
       break;
     case "line":
-      Ye(e, r, t);
+      at(e, a, t);
       break;
     case "arrow":
-      Je(e, r, t);
+      it(e, a, t);
       break;
     case "rect":
-      Ze(e, r, t);
+      rt(e, a, t);
       break;
     case "polygon":
-      et(e, r, t);
+      nt(e, a, t);
       break;
     case "text":
-      tt(e, r, t);
+      st(e, a, t);
+      break;
+    case "image":
+      kt(e, a, t);
       break;
     case "axes":
-      rt(e, r, t);
+      ct(e, a, t);
       break;
     case "functionPlot":
-      at(e, r, t);
+      lt(e, a, t);
       break;
     case "vector":
-      it(e, r, t);
+      ut(e, a, t);
       break;
     case "vectorField":
-      nt(e, r, t);
+      ht(e, a, t);
       break;
     case "matrix":
-      st(e, r, t);
+      ft(e, a, t);
       break;
     case "graph":
-      ct(e, r, t);
+      gt(e, a, t);
       break;
     case "latex":
-      lt(e, r, t);
+      ot(e, a, t);
+      break;
+    case "barChart":
+      $t(e, a, t);
       break;
     case "sequence":
-      ut(e, r, t);
+      yt(e, a, t);
       break;
     case "group":
+      It(e, a, t);
+      break;
     case "parallel":
-      w(e, r, t);
+      d(e, a, t);
       break;
     case "fadeIn":
     case "fadeOut":
     case "draw":
     case "write":
-      ht(e, r, t);
+      mt(e, a, t);
       break;
     case "transform":
-      ft(e, r, t);
+      bt(e, a, t);
       break;
     case "morph":
-      ot(e, r, t);
+      xt(e, a, t);
       break;
     case "stagger":
-      yt(e, r, t);
+      vt(e, a, t);
       break;
     case "scene":
     case "player":
-      B(e, r, a, t);
+      G(e, a, i, t);
       break;
   }
 }
-function Xe(e, r, t) {
-  u(e, "cx", r, t), u(e, "cy", r, t), N(e, "r", r, t), y(e, r, t);
+function tt(e, a, t) {
+  l(e, "cx", a, t), l(e, "cy", a, t), k(e, "r", a, t), o(e, a, t);
 }
-function Ye(e, r, t) {
-  u(e, "x1", r, t), u(e, "y1", r, t), u(e, "x2", r, t), u(e, "y2", r, t), y(e, r, t);
+function at(e, a, t) {
+  l(e, "x1", a, t), l(e, "y1", a, t), l(e, "x2", a, t), l(e, "y2", a, t), o(e, a, t);
 }
-function Je(e, r, t) {
-  u(e, "x1", r, t), u(e, "y1", r, t), u(e, "x2", r, t), u(e, "y2", r, t), y(e, r, t);
+function it(e, a, t) {
+  l(e, "x1", a, t), l(e, "y1", a, t), l(e, "x2", a, t), l(e, "y2", a, t), o(e, a, t);
 }
-function Ze(e, r, t) {
-  u(e, "x", r, t), u(e, "y", r, t), N(e, "width", r, t), N(e, "height", r, t), y(e, r, t);
+function rt(e, a, t) {
+  l(e, "x", a, t), l(e, "y", a, t), k(e, "width", a, t), k(e, "height", a, t), o(e, a, t);
 }
-function et(e, r, t) {
-  Array.isArray(e.points) ? e.points.length < 3 ? t.push({ path: `${r}.points`, message: "Polygon requires at least 3 points", severity: "error" }) : e.points.forEach((a, i) => {
-    (!Array.isArray(a) || a.length !== 2 || typeof a[0] != "number" || typeof a[1] != "number") && t.push({ path: `${r}.points[${i}]`, message: "Each point must be [number, number]", severity: "error" });
-  }) : t.push({ path: `${r}.points`, message: 'Polygon requires a "points" array', severity: "error" }), y(e, r, t);
+function nt(e, a, t) {
+  Array.isArray(e.points) ? e.points.length < 3 ? t.push({ path: `${a}.points`, message: "Polygon requires at least 3 points", severity: "error" }) : e.points.forEach((i, r) => {
+    (!Array.isArray(i) || i.length !== 2 || typeof i[0] != "number" || typeof i[1] != "number") && t.push({ path: `${a}.points[${r}]`, message: "Each point must be [number, number]", severity: "error" });
+  }) : t.push({ path: `${a}.points`, message: 'Polygon requires a "points" array', severity: "error" }), o(e, a, t);
 }
-function tt(e, r, t) {
-  u(e, "x", r, t), u(e, "y", r, t), typeof e.content != "string" && t.push({ path: `${r}.content`, message: 'Text requires a "content" string', severity: "error" }), y(e, r, t);
+function st(e, a, t) {
+  l(e, "x", a, t), l(e, "y", a, t), typeof e.content != "string" && t.push({ path: `${a}.content`, message: 'Text requires a "content" string', severity: "error" }), o(e, a, t);
 }
-function rt(e, r, t) {
-  v(e, "domain", r, t), v(e, "range", r, t), v(e, "origin", r, t), y(e, r, t);
+function ct(e, a, t) {
+  y(e, "domain", a, t), y(e, "range", a, t), y(e, "origin", a, t), P(e, a, t);
 }
-function at(e, r, t) {
+function lt(e, a, t) {
   if (typeof e.fn != "string")
-    t.push({ path: `${r}.fn`, message: 'FunctionPlot requires a "fn" expression string', severity: "error" });
+    t.push({ path: `${a}.fn`, message: 'FunctionPlot requires a "fn" expression string', severity: "error" });
   else {
-    const a = U(e.fn);
-    a && t.push({ path: `${r}.fn`, message: `Invalid expression: ${a}`, severity: "error" });
+    const i = H(e.fn);
+    i && t.push({ path: `${a}.fn`, message: `Invalid expression: ${i}`, severity: "error" });
   }
-  v(e, "domain", r, t), y(e, r, t);
+  y(e, "domain", a, t), P(e, a, t);
 }
-function it(e, r, t) {
-  (!Array.isArray(e.to) || e.to.length !== 2) && t.push({ path: `${r}.to`, message: 'Vector requires a "to" array of [number, number]', severity: "error" }), v(e, "from", r, t), y(e, r, t);
+function ut(e, a, t) {
+  (!Array.isArray(e.to) || e.to.length !== 2) && t.push({ path: `${a}.to`, message: 'Vector requires a "to" array of [number, number]', severity: "error" }), y(e, "from", a, t), P(e, a, t);
 }
-function nt(e, r, t) {
+function ht(e, a, t) {
   if (typeof e.fn != "string")
-    t.push({ path: `${r}.fn`, message: 'VectorField requires a "fn" expression string', severity: "error" });
+    t.push({ path: `${a}.fn`, message: 'VectorField requires a "fn" expression string', severity: "error" });
   else {
-    const a = U(e.fn);
-    a && t.push({ path: `${r}.fn`, message: `Invalid vector expression: ${a}`, severity: "error" });
+    const i = H(e.fn);
+    i && t.push({ path: `${a}.fn`, message: `Invalid vector expression: ${i}`, severity: "error" });
   }
-  v(e, "domain", r, t), v(e, "range", r, t), y(e, r, t);
+  y(e, "domain", a, t), y(e, "range", a, t), P(e, a, t);
 }
-function st(e, r, t) {
-  Array.isArray(e.values) ? e.values.forEach((a, i) => {
-    Array.isArray(a) || t.push({ path: `${r}.values[${i}]`, message: "Each matrix row must be an array", severity: "error" });
-  }) : t.push({ path: `${r}.values`, message: 'Matrix requires a "values" 2D array', severity: "error" }), y(e, r, t);
+function ft(e, a, t) {
+  Array.isArray(e.values) ? e.values.forEach((i, r) => {
+    Array.isArray(i) || t.push({ path: `${a}.values[${r}]`, message: "Each matrix row must be an array", severity: "error" });
+  }) : t.push({ path: `${a}.values`, message: 'Matrix requires a "values" 2D array', severity: "error" }), o(e, a, t);
 }
-function ct(e, r, t) {
+function gt(e, a, t) {
   if (!Array.isArray(e.nodes))
-    t.push({ path: `${r}.nodes`, message: 'Graph requires a "nodes" array', severity: "error" });
+    t.push({ path: `${a}.nodes`, message: 'Graph requires a "nodes" array', severity: "error" });
   else {
-    const a = /* @__PURE__ */ new Set();
-    e.nodes.forEach((i, n) => {
-      typeof i.id != "string" ? t.push({ path: `${r}.nodes[${n}].id`, message: 'Graph node requires a string "id"', severity: "error" }) : (a.has(i.id) && t.push({ path: `${r}.nodes[${n}].id`, message: `Duplicate node id "${i.id}"`, severity: "error" }), a.add(i.id)), u(i, "x", `${r}.nodes[${n}]`, t), u(i, "y", `${r}.nodes[${n}]`, t);
-    }), Array.isArray(e.edges) && e.edges.forEach((i, n) => {
-      (typeof i.from != "string" || !a.has(i.from)) && t.push({ path: `${r}.edges[${n}].from`, message: `Edge "from" references unknown node "${i.from}"`, severity: "error" }), (typeof i.to != "string" || !a.has(i.to)) && t.push({ path: `${r}.edges[${n}].to`, message: `Edge "to" references unknown node "${i.to}"`, severity: "error" });
+    const i = /* @__PURE__ */ new Set();
+    e.nodes.forEach((r, n) => {
+      typeof r.id != "string" ? t.push({ path: `${a}.nodes[${n}].id`, message: 'Graph node requires a string "id"', severity: "error" }) : (i.has(r.id) && t.push({ path: `${a}.nodes[${n}].id`, message: `Duplicate node id "${r.id}"`, severity: "error" }), i.add(r.id)), l(r, "x", `${a}.nodes[${n}]`, t), l(r, "y", `${a}.nodes[${n}]`, t);
+    }), Array.isArray(e.edges) && e.edges.forEach((r, n) => {
+      (typeof r.from != "string" || !i.has(r.from)) && t.push({ path: `${a}.edges[${n}].from`, message: `Edge "from" references unknown node "${r.from}"`, severity: "error" }), (typeof r.to != "string" || !i.has(r.to)) && t.push({ path: `${a}.edges[${n}].to`, message: `Edge "to" references unknown node "${r.to}"`, severity: "error" });
     });
   }
-  y(e, r, t);
+  o(e, a, t);
 }
-function lt(e, r, t) {
-  typeof e.expression != "string" && t.push({ path: `${r}.expression`, message: 'LaTeX requires an "expression" string', severity: "error" }), u(e, "x", r, t), u(e, "y", r, t), y(e, r, t);
+function ot(e, a, t) {
+  typeof e.expression != "string" && t.push({ path: `${a}.expression`, message: 'LaTeX requires an "expression" string', severity: "error" }), l(e, "x", a, t), l(e, "y", a, t), o(e, a, t);
 }
-function ut(e, r, t) {
-  u(e, "from", r, t), mt(e, "durationInFrames", r, t), w(e, r, t);
+function yt(e, a, t) {
+  l(e, "from", a, t), Ot(e, "durationInFrames", a, t), d(e, a, t);
 }
-function ht(e, r, t) {
-  o(e, "duration", r, t), S(e, r, t), w(e, r, t);
+function mt(e, a, t) {
+  h(e, "duration", a, t), $(e, a, t), d(e, a, t);
 }
-function ft(e, r, t) {
-  if (o(e, "duration", r, t), S(e, r, t), e.translate !== void 0) {
-    const a = e.translate;
-    (!a || typeof a != "object") && t.push({ path: `${r}.translate`, message: "translate must be { from: [x,y], to: [x,y] }", severity: "error" });
+function bt(e, a, t) {
+  if (h(e, "duration", a, t), $(e, a, t), e.translate !== void 0) {
+    const i = e.translate;
+    (!i || typeof i != "object") && t.push({ path: `${a}.translate`, message: "translate must be { from: [x,y], to: [x,y] }", severity: "error" });
   }
   if (e.scale !== void 0) {
-    const a = e.scale;
-    (!a || typeof a != "object" || typeof a.from != "number" || typeof a.to != "number") && t.push({ path: `${r}.scale`, message: "scale must be { from: number, to: number }", severity: "error" });
+    const i = e.scale;
+    (!i || typeof i != "object" || typeof i.from != "number" || typeof i.to != "number") && t.push({ path: `${a}.scale`, message: "scale must be { from: number, to: number }", severity: "error" });
   }
   if (e.rotate !== void 0) {
-    const a = e.rotate;
-    (!a || typeof a != "object" || typeof a.from != "number" || typeof a.to != "number") && t.push({ path: `${r}.rotate`, message: "rotate must be { from: number, to: number }", severity: "error" });
+    const i = e.rotate;
+    (!i || typeof i != "object" || typeof i.from != "number" || typeof i.to != "number") && t.push({ path: `${a}.rotate`, message: "rotate must be { from: number, to: number }", severity: "error" });
   }
   if (e.opacity !== void 0) {
-    const a = e.opacity;
-    (!a || typeof a != "object" || typeof a.from != "number" || typeof a.to != "number") && t.push({ path: `${r}.opacity`, message: "opacity must be { from: number, to: number }", severity: "error" });
+    const i = e.opacity;
+    (!i || typeof i != "object" || typeof i.from != "number" || typeof i.to != "number") && t.push({ path: `${a}.opacity`, message: "opacity must be { from: number, to: number }", severity: "error" });
+  }
+  d(e, a, t);
+}
+function xt(e, a, t) {
+  h(e, "duration", a, t), $(e, a, t), v(e, "fromColor", a, t), v(e, "toColor", a, t), d(e, a, t);
+}
+function vt(e, a, t) {
+  h(e, "staggerDelay", a, t), $(e, a, t), d(e, a, t);
+}
+function o(e, a, t) {
+  h(e, "fadeIn", a, t), h(e, "fadeOut", a, t), h(e, "draw", a, t), $(e, a, t), dt(e, a, t);
+}
+function P(e, a, t) {
+  h(e, "fadeIn", a, t), h(e, "fadeOut", a, t), h(e, "draw", a, t), $(e, a, t), wt(e, a, t);
+}
+const V = ["none", "circle", "ellipse"];
+function dt(e, a, t) {
+  if (F(e, "rotation", a, t), y(e, "rotationOrigin", a, t), y(e, "translate", a, t), F(e, "zIndex", a, t), e.scale !== void 0) {
+    const i = e.scale;
+    typeof i == "number" || Array.isArray(i) && i.length === 2 && typeof i[0] == "number" && typeof i[1] == "number" || t.push({ path: `${a}.scale`, message: '"scale" must be a number or [number, number]', severity: "error" });
   }
-  w(e, r, t);
 }
-function ot(e, r, t) {
-  o(e, "duration", r, t), S(e, r, t), x(e, "fromColor", r, t), x(e, "toColor", r, t), w(e, r, t);
+function wt(e, a, t) {
+  F(e, "rotation", a, t), y(e, "rotationOrigin", a, t), y(e, "translate", a, t), F(e, "zIndex", a, t);
+}
+function kt(e, a, t) {
+  typeof e.src != "string" && t.push({ path: `${a}.src`, message: 'Image requires a "src" string', severity: "error" }), l(e, "x", a, t), l(e, "y", a, t), k(e, "width", a, t), k(e, "height", a, t), v(e, "preserveAspectRatio", a, t), e.borderRadius !== void 0 && (typeof e.borderRadius != "number" || e.borderRadius < 0) && t.push({ path: `${a}.borderRadius`, message: '"borderRadius" must be a number >= 0', severity: "error" }), e.clipShape !== void 0 && (V.includes(e.clipShape) || t.push({
+    path: `${a}.clipShape`,
+    message: `Invalid clipShape "${e.clipShape}". Must be one of: ${V.join(", ")}`,
+    severity: "error"
+  })), o(e, a, t);
 }
-function yt(e, r, t) {
-  o(e, "staggerDelay", r, t), S(e, r, t), w(e, r, t);
+function It(e, a, t) {
+  d(e, a, t), o(e, a, t);
 }
-function y(e, r, t) {
-  o(e, "fadeIn", r, t), o(e, "fadeOut", r, t), o(e, "draw", r, t), S(e, r, t);
+function $t(e, a, t) {
+  l(e, "x", a, t), l(e, "y", a, t), k(e, "width", a, t), k(e, "height", a, t), Array.isArray(e.bars) || t.push({ path: `${a}.bars`, message: 'BarChart requires a "bars" array', severity: "error" }), o(e, a, t);
 }
-function S(e, r, t) {
+function $(e, a, t) {
   if (e.easing !== void 0) {
     if (typeof e.easing == "string") {
-      if (!F.includes(e.easing)) {
-        const a = H(e.easing, F);
+      if (!R.includes(e.easing)) {
+        const i = K(e.easing, R);
         t.push({
-          path: `${r}.easing`,
-          message: `Unknown easing "${e.easing}".${a} Available: ${F.join(", ")}`,
+          path: `${a}.easing`,
+          message: `Unknown easing "${e.easing}".${i} Available: ${R.join(", ")}`,
           severity: "error"
         });
       }
       return;
     }
     if (typeof e.easing == "object" && e.easing !== null) {
-      const a = e.easing;
-      if (a.type === "spring") return;
-      if (a.type === "cubicBezier") {
-        for (const i of ["x1", "y1", "x2", "y2"])
-          typeof a[i] != "number" && t.push({ path: `${r}.easing.${i}`, message: `cubicBezier requires numeric "${i}"`, severity: "error" });
+      const i = e.easing;
+      if (i.type === "spring") return;
+      if (i.type === "cubicBezier") {
+        for (const r of ["x1", "y1", "x2", "y2"])
+          typeof i[r] != "number" && t.push({ path: `${a}.easing.${r}`, message: `cubicBezier requires numeric "${r}"`, severity: "error" });
         return;
       }
-      t.push({ path: `${r}.easing.type`, message: 'Easing object type must be "spring" or "cubicBezier"', severity: "error" });
+      t.push({ path: `${a}.easing.type`, message: 'Easing object type must be "spring" or "cubicBezier"', severity: "error" });
       return;
     }
-    t.push({ path: `${r}.easing`, message: 'Easing must be a string name or { type: "spring"|"cubicBezier", ... }', severity: "error" });
+    t.push({ path: `${a}.easing`, message: 'Easing must be a string name or { type: "spring"|"cubicBezier", ... }', severity: "error" });
   }
 }
-function u(e, r, t, a) {
-  typeof e[r] != "number" && a.push({ path: `${t}.${r}`, message: `Required numeric field "${r}" is missing or not a number`, severity: "error" });
+function l(e, a, t, i) {
+  typeof e[a] != "number" && i.push({ path: `${t}.${a}`, message: `Required numeric field "${a}" is missing or not a number`, severity: "error" });
 }
-function N(e, r, t, a) {
-  (typeof e[r] != "number" || e[r] <= 0) && a.push({ path: `${t}.${r}`, message: `"${r}" must be a positive number`, severity: "error" });
+function k(e, a, t, i) {
+  (typeof e[a] != "number" || e[a] <= 0) && i.push({ path: `${t}.${a}`, message: `"${a}" must be a positive number`, severity: "error" });
 }
-function gt(e, r, t, a) {
-  const i = e[r];
-  (typeof i != "number" || i <= 0 || !Number.isInteger(i)) && a.push({ path: `${t}.${r}`, message: `"${r}" must be a positive integer`, severity: "error" });
+function St(e, a, t, i) {
+  const r = e[a];
+  (typeof r != "number" || r <= 0 || !Number.isInteger(r)) && i.push({ path: `${t}.${a}`, message: `"${a}" must be a positive integer`, severity: "error" });
 }
-function o(e, r, t, a) {
-  e[r] !== void 0 && (typeof e[r] != "number" || e[r] <= 0) && a.push({ path: `${t}.${r}`, message: `"${r}" must be a positive number`, severity: "error" });
+function h(e, a, t, i) {
+  e[a] !== void 0 && (typeof e[a] != "number" || e[a] <= 0) && i.push({ path: `${t}.${a}`, message: `"${a}" must be a positive number`, severity: "error" });
 }
-function mt(e, r, t, a) {
-  const i = e[r];
-  i !== void 0 && (typeof i != "number" || i <= 0 || !Number.isInteger(i)) && a.push({ path: `${t}.${r}`, message: `"${r}" must be a positive integer`, severity: "error" });
+function Ot(e, a, t, i) {
+  const r = e[a];
+  r !== void 0 && (typeof r != "number" || r <= 0 || !Number.isInteger(r)) && i.push({ path: `${t}.${a}`, message: `"${a}" must be a positive integer`, severity: "error" });
 }
-function x(e, r, t, a) {
-  e[r] !== void 0 && typeof e[r] != "string" && a.push({ path: `${t}.${r}`, message: `"${r}" must be a string`, severity: "error" });
+function v(e, a, t, i) {
+  e[a] !== void 0 && typeof e[a] != "string" && i.push({ path: `${t}.${a}`, message: `"${a}" must be a string`, severity: "error" });
 }
-function $(e, r, t, a) {
-  e[r] !== void 0 && typeof e[r] != "boolean" && a.push({ path: `${t}.${r}`, message: `"${r}" must be a boolean`, severity: "error" });
+function F(e, a, t, i) {
+  e[a] !== void 0 && typeof e[a] != "number" && i.push({ path: `${t}.${a}`, message: `"${a}" must be a number`, severity: "error" });
 }
-function v(e, r, t, a) {
-  const i = e[r];
-  i !== void 0 && (!Array.isArray(i) || i.length !== 2 || typeof i[0] != "number" || typeof i[1] != "number") && a.push({ path: `${t}.${r}`, message: `"${r}" must be [number, number]`, severity: "error" });
+function S(e, a, t, i) {
+  e[a] !== void 0 && typeof e[a] != "boolean" && i.push({ path: `${t}.${a}`, message: `"${a}" must be a boolean`, severity: "error" });
 }
-function H(e, r) {
-  const t = e.toLowerCase(), a = r.find((n) => n.toLowerCase() === t);
-  if (a) return ` Did you mean '${a}'?`;
-  const i = r.find((n) => n.toLowerCase().startsWith(t.slice(0, 4)));
-  return i ? ` Did you mean '${i}'?` : "";
+function y(e, a, t, i) {
+  const r = e[a];
+  r !== void 0 && (!Array.isArray(r) || r.length !== 2 || typeof r[0] != "number" || typeof r[1] != "number") && i.push({ path: `${t}.${a}`, message: `"${a}" must be [number, number]`, severity: "error" });
 }
-function Ct({ dsl: e, className: r, style: t }) {
-  const a = He(e);
-  return a.valid ? /* @__PURE__ */ s("div", { className: r, style: t, "data-testid": "dsl-root", children: bt(e.root) }) : /* @__PURE__ */ L(
+function K(e, a) {
+  const t = e.toLowerCase(), i = a.find((n) => n.toLowerCase() === t);
+  if (i) return ` Did you mean '${i}'?`;
+  const r = a.find((n) => n.toLowerCase().startsWith(t.slice(0, 4)));
+  return r ? ` Did you mean '${r}'?` : "";
+}
+function Mt({ dsl: e, className: a, style: t }) {
+  const i = Ye(e);
+  return i.valid ? /* @__PURE__ */ s("div", { className: a, style: t, "data-testid": "dsl-root", children: At(e.root) }) : /* @__PURE__ */ L(
     "div",
     {
-      className: r,
+      className: a,
       style: { color: "#ff6b6b", fontFamily: "monospace", padding: 16, ...t },
       "data-testid": "dsl-error",
       children: [
         /* @__PURE__ */ s("strong", { children: "Elucim DSL Validation Errors:" }),
-        /* @__PURE__ */ s("ul", { children: a.errors.filter((i) => i.severity === "error").map((i, n) => /* @__PURE__ */ L("li", { children: [
-          i.path,
+        /* @__PURE__ */ s("ul", { children: i.errors.filter((r) => r.severity === "error").map((r, n) => /* @__PURE__ */ L("li", { children: [
+          r.path,
           ": ",
-          i.message
+          r.message
         ] }, n)) })
       ]
     }
   );
 }
-function bt(e) {
+function At(e) {
   switch (e.type) {
     case "scene":
-      return G(e);
+      return X(e);
     case "player":
-      return Q(e);
+      return Y(e);
     case "presentation":
-      return dt(e);
+      return Ct(e);
   }
 }
-function G(e) {
+function X(e) {
   return /* @__PURE__ */ s(
-    ve,
+    Ie,
     {
       width: e.width,
       height: e.height,
       fps: e.fps,
       durationInFrames: e.durationInFrames,
       background: e.background,
-      children: e.children.map((r, t) => f(r, t))
+      children: e.children.map((a, t) => g(a, t))
     }
   );
 }
-function Q(e) {
+function Y(e) {
   return /* @__PURE__ */ s(
-    xe,
+    ke,
     {
       width: e.width,
       height: e.height,
@@ -676,13 +714,13 @@ function Q(e) {
       controls: e.controls,
       loop: e.loop,
       autoPlay: e.autoPlay,
-      children: e.children.map((r, t) => f(r, t))
+      children: e.children.map((a, t) => g(a, t))
     }
   );
 }
-function dt(e) {
+function Ct(e) {
   return /* @__PURE__ */ s(
-    de,
+    we,
     {
       width: e.width,
       height: e.height,
@@ -691,23 +729,37 @@ function dt(e) {
       transitionDuration: e.transitionDuration,
       showHUD: e.showHud,
       showNotes: e.showNotes,
-      children: e.slides.map((r, t) => xt(r, t))
+      children: e.slides.map((a, t) => zt(a, t))
     }
   );
 }
-function xt(e, r) {
+function zt(e, a) {
   var t;
-  return /* @__PURE__ */ s(we, { title: e.title, notes: e.notes, background: e.background, children: (t = e.children) == null ? void 0 : t.map((a, i) => f(a, i)) }, r);
+  return /* @__PURE__ */ s($e, { title: e.title, notes: e.notes, background: e.background, children: (t = e.children) == null ? void 0 : t.map((i, r) => g(i, r)) }, a);
 }
-function f(e, r) {
+function g(e, a) {
   switch (e.type) {
     case "sequence":
-      return /* @__PURE__ */ s(Ue, { from: e.from, durationInFrames: e.durationInFrames, name: e.name, children: e.children.map((t, a) => f(t, a)) }, r);
+      return /* @__PURE__ */ s(Qe, { from: e.from, durationInFrames: e.durationInFrames, name: e.name, children: e.children.map((t, i) => g(t, i)) }, a);
     case "group":
-      return /* @__PURE__ */ s(z.Fragment, { children: e.children.map((t, a) => f(t, a)) }, r);
+      return /* @__PURE__ */ s(
+        Ge,
+        {
+          fadeIn: e.fadeIn,
+          fadeOut: e.fadeOut,
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex,
+          children: e.children.map((t, i) => g(t, i))
+        },
+        a
+      );
     case "circle":
       return /* @__PURE__ */ s(
-        qe,
+        He,
         {
           cx: e.cx,
           cy: e.cy,
@@ -719,13 +771,18 @@ function f(e, r) {
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
           draw: e.draw,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "line":
       return /* @__PURE__ */ s(
-        pe,
+        Ve,
         {
           x1: e.x1,
           y1: e.y1,
@@ -738,13 +795,18 @@ function f(e, r) {
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
           draw: e.draw,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "arrow":
       return /* @__PURE__ */ s(
-        je,
+        Ue,
         {
           x1: e.x1,
           y1: e.y1,
@@ -758,13 +820,18 @@ function f(e, r) {
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
           draw: e.draw,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "rect":
       return /* @__PURE__ */ s(
-        Le,
+        Be,
         {
           x: e.x,
           y: e.y,
@@ -780,13 +847,18 @@ function f(e, r) {
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
           draw: e.draw,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "polygon":
       return /* @__PURE__ */ s(
-        Te,
+        qe,
         {
           points: e.points,
           fill: e.fill,
@@ -797,13 +869,18 @@ function f(e, r) {
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
           draw: e.draw,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "text":
       return /* @__PURE__ */ s(
-        De,
+        je,
         {
           x: e.x,
           y: e.y,
@@ -817,13 +894,42 @@ function f(e, r) {
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
           easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex,
           children: e.content
         },
-        r
+        a
+      );
+    case "image":
+      return /* @__PURE__ */ s(
+        Le,
+        {
+          src: e.src,
+          x: e.x,
+          y: e.y,
+          width: e.width,
+          height: e.height,
+          preserveAspectRatio: e.preserveAspectRatio,
+          borderRadius: e.borderRadius,
+          clipShape: e.clipShape,
+          opacity: e.opacity,
+          fadeIn: e.fadeIn,
+          fadeOut: e.fadeOut,
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex
+        },
+        a
       );
     case "axes":
       return /* @__PURE__ */ s(
-        Re,
+        Te,
         {
           domain: e.domain,
           range: e.range,
@@ -840,16 +946,20 @@ function f(e, r) {
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
           draw: e.draw,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "functionPlot": {
-      const t = Be(e.fn);
+      const t = Ke(e.fn);
       return /* @__PURE__ */ s(
-        _e,
+        De,
         {
-          fn: (a) => t({ x: a }),
+          fn: (i) => t({ x: i }),
           domain: e.domain,
           yClamp: e.yClamp,
           origin: e.origin,
@@ -859,14 +969,18 @@ function f(e, r) {
           samples: e.samples,
           draw: e.draw,
           easing: c(e.easing),
-          opacity: e.opacity
+          opacity: e.opacity,
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     }
     case "vector":
       return /* @__PURE__ */ s(
-        Ne,
+        _e,
         {
           from: e.from,
           to: e.to,
@@ -882,16 +996,20 @@ function f(e, r) {
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
           draw: e.draw,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "vectorField": {
-      const t = Ve(e.fn);
+      const t = Xe(e.fn);
       return /* @__PURE__ */ s(
         We,
         {
-          fn: (a, i) => t({ x: a, y: i }),
+          fn: (i, r) => t({ x: i, y: r }),
           domain: e.domain,
           range: e.range,
           step: e.step,
@@ -905,9 +1023,13 @@ function f(e, r) {
           maxLength: e.maxLength,
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     }
     case "matrix":
@@ -923,13 +1045,18 @@ function f(e, r) {
           fontSize: e.fontSize,
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "graph":
       return /* @__PURE__ */ s(
-        Pe,
+        Ne,
         {
           nodes: e.nodes,
           edges: e.edges,
@@ -941,13 +1068,18 @@ function f(e, r) {
           labelFontSize: e.labelFontSize,
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "latex":
       return /* @__PURE__ */ s(
-        Fe,
+        pe,
         {
           expression: e.expression,
           x: e.x,
@@ -957,13 +1089,18 @@ function f(e, r) {
           align: e.align,
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "barChart":
       return /* @__PURE__ */ s(
-        ze,
+        Re,
         {
           bars: e.bars,
           x: e.x,
@@ -979,21 +1116,26 @@ function f(e, r) {
           valueFormat: e.valueFormat,
           fadeIn: e.fadeIn,
           fadeOut: e.fadeOut,
-          easing: c(e.easing)
+          easing: c(e.easing),
+          rotation: e.rotation,
+          rotationOrigin: e.rotationOrigin,
+          scale: e.scale,
+          translate: e.translate,
+          zIndex: e.zIndex
         },
-        r
+        a
       );
     case "fadeIn":
-      return /* @__PURE__ */ s(Oe, { duration: e.duration, easing: c(e.easing), children: e.children.map((t, a) => f(t, a)) }, r);
+      return /* @__PURE__ */ s(Pe, { duration: e.duration, easing: c(e.easing), children: e.children.map((t, i) => g(t, i)) }, a);
     case "fadeOut":
-      return /* @__PURE__ */ s(Ee, { duration: e.duration, totalFrames: e.totalFrames, easing: c(e.easing), children: e.children.map((t, a) => f(t, a)) }, r);
+      return /* @__PURE__ */ s(Fe, { duration: e.duration, totalFrames: e.totalFrames, easing: c(e.easing), children: e.children.map((t, i) => g(t, i)) }, a);
     case "draw":
-      return /* @__PURE__ */ s(Ae, { duration: e.duration, pathLength: e.pathLength, easing: c(e.easing), children: f(e.children[0], 0) }, r);
+      return /* @__PURE__ */ s(Ee, { duration: e.duration, pathLength: e.pathLength, easing: c(e.easing), children: g(e.children[0], 0) }, a);
     case "write":
-      return /* @__PURE__ */ s(Ce, { duration: e.duration, easing: c(e.easing), children: e.children.map((t, a) => f(t, a)) }, r);
+      return /* @__PURE__ */ s(ze, { duration: e.duration, easing: c(e.easing), children: e.children.map((t, i) => g(t, i)) }, a);
     case "transform":
       return /* @__PURE__ */ s(
-        Ie,
+        Ce,
         {
           duration: e.duration,
           easing: c(e.easing),
@@ -1001,13 +1143,13 @@ function f(e, r) {
           scale: e.scale,
           rotate: e.rotate,
           opacity: e.opacity,
-          children: e.children.map((t, a) => f(t, a))
+          children: e.children.map((t, i) => g(t, i))
         },
-        r
+        a
       );
     case "morph":
       return /* @__PURE__ */ s(
-        Se,
+        Ae,
         {
           duration: e.duration,
           easing: c(e.easing),
@@ -1017,25 +1159,25 @@ function f(e, r) {
           toOpacity: e.toOpacity,
           fromScale: e.fromScale,
           toScale: e.toScale,
-          children: e.children.map((t, a) => f(t, a))
+          children: e.children.map((t, i) => g(t, i))
         },
-        r
+        a
       );
     case "stagger":
-      return /* @__PURE__ */ s($e, { staggerDelay: e.staggerDelay, easing: c(e.easing), children: e.children.map((t, a) => f(t, a)) }, r);
+      return /* @__PURE__ */ s(Oe, { staggerDelay: e.staggerDelay, easing: c(e.easing), children: e.children.map((t, i) => g(t, i)) }, a);
     case "parallel":
-      return /* @__PURE__ */ s(ke, { children: e.children.map((t, a) => f(t, a)) }, r);
+      return /* @__PURE__ */ s(Se, { children: e.children.map((t, i) => g(t, i)) }, a);
     case "scene":
-      return /* @__PURE__ */ s(z.Fragment, { children: G(e) }, r);
+      return /* @__PURE__ */ s(j.Fragment, { children: X(e) }, a);
     case "player":
-      return /* @__PURE__ */ s(z.Fragment, { children: Q(e) }, r);
+      return /* @__PURE__ */ s(j.Fragment, { children: Y(e) }, a);
     default:
       return null;
   }
 }
-class vt {
-  constructor(r, t = 30, a = 900, i = 640) {
-    this.elements = [], this.cursor = 0, this.theme = r, this._fps = t, this._width = a, this._height = i;
+class Et {
+  constructor(a, t = 30, i = 900, r = 640) {
+    this.elements = [], this.cursor = 0, this.theme = a, this._fps = t, this._width = i, this._height = r;
   }
   get width() {
     return this._width;
@@ -1057,16 +1199,16 @@ class vt {
     return this.cursor;
   }
   /** Advance the cursor by N frames */
-  wait(r) {
-    return this.cursor += r, this;
+  wait(a) {
+    return this.cursor += a, this;
   }
   /** Set cursor to an absolute frame */
-  at(r) {
-    return this.cursor = r, this;
+  at(a) {
+    return this.cursor = a, this;
   }
   // ─── High-level helpers ──────────────────────────────────────────────
   /** Large centered title text */
-  title(r, t) {
+  title(a, t) {
     return this.addAtCursor({
       type: "fadeIn",
       duration: 15,
@@ -1074,7 +1216,7 @@ class vt {
         type: "text",
         x: this.cx,
         y: (t == null ? void 0 : t.y) ?? 55,
-        content: r,
+        content: a,
         fontSize: (t == null ? void 0 : t.fontSize) ?? 28,
         fill: (t == null ? void 0 : t.color) ?? this.theme.title,
         textAnchor: "middle",
@@ -1083,7 +1225,7 @@ class vt {
     }, 15);
   }
   /** Smaller subtitle text */
-  subtitle(r, t) {
+  subtitle(a, t) {
     return this.addAtCursor({
       type: "fadeIn",
       duration: 12,
@@ -1091,7 +1233,7 @@ class vt {
         type: "text",
         x: this.cx,
         y: (t == null ? void 0 : t.y) ?? 95,
-        content: r,
+        content: a,
         fontSize: (t == null ? void 0 : t.fontSize) ?? 16,
         fill: (t == null ? void 0 : t.color) ?? this.theme.subtitle,
         textAnchor: "middle"
@@ -1099,14 +1241,14 @@ class vt {
     }, 10);
   }
   /** Add a LaTeX expression */
-  latex(r, t) {
-    const a = (t == null ? void 0 : t.fadeIn) ?? 15;
+  latex(a, t) {
+    const i = (t == null ? void 0 : t.fadeIn) ?? 15;
     return this.addAtCursor({
       type: "fadeIn",
-      duration: a,
+      duration: i,
       children: [{
         type: "latex",
-        expression: r,
+        expression: a,
         x: (t == null ? void 0 : t.x) ?? this.cx,
         y: (t == null ? void 0 : t.y) ?? 300,
         fontSize: (t == null ? void 0 : t.fontSize) ?? 28,
@@ -1116,92 +1258,92 @@ class vt {
     }, (t == null ? void 0 : t.advance) ?? 10);
   }
   /** Add text at a position */
-  text(r, t) {
-    const a = t.fadeIn ?? 15, i = t.advance ?? 5;
+  text(a, t) {
+    const i = t.fadeIn ?? 15, r = t.advance ?? 5;
     return this.addAtCursor({
       type: "fadeIn",
-      duration: a,
+      duration: i,
       children: [{
         type: "text",
         x: t.x,
         y: t.y,
-        content: r,
+        content: a,
         fontSize: t.fontSize ?? 14,
         fill: t.color ?? this.theme.text,
         textAnchor: t.anchor ?? "middle",
         fontWeight: t.fontWeight,
         fontFamily: t.fontFamily
       }]
-    }, i);
+    }, r);
   }
   /** Add an arrow */
-  arrow(r, t, a, i, n) {
-    const l = (n == null ? void 0 : n.fadeIn) ?? 12, k = {
+  arrow(a, t, i, r, n) {
+    const u = (n == null ? void 0 : n.fadeIn) ?? 12, I = {
       type: "arrow",
-      x1: r,
+      x1: a,
       y1: t,
-      x2: a,
-      y2: i,
+      x2: i,
+      y2: r,
       stroke: (n == null ? void 0 : n.color) ?? this.theme.primary,
       strokeWidth: (n == null ? void 0 : n.strokeWidth) ?? 2,
       headSize: (n == null ? void 0 : n.headSize) ?? 8,
       strokeDasharray: n != null && n.dashed ? "6 3" : void 0,
-      fadeIn: l
+      fadeIn: u
     };
-    return this.addAtCursor(k, (n == null ? void 0 : n.advance) ?? 3);
+    return this.addAtCursor(I, (n == null ? void 0 : n.advance) ?? 3);
   }
   /** Add a line */
-  line(r, t, a, i, n) {
-    const l = (n == null ? void 0 : n.fadeIn) ?? 12;
+  line(a, t, i, r, n) {
+    const u = (n == null ? void 0 : n.fadeIn) ?? 12;
     return this.addAtCursor({
       type: "line",
-      x1: r,
+      x1: a,
       y1: t,
-      x2: a,
-      y2: i,
+      x2: i,
+      y2: r,
       stroke: (n == null ? void 0 : n.color) ?? this.theme.muted,
       strokeWidth: (n == null ? void 0 : n.strokeWidth) ?? 1,
       strokeDasharray: n != null && n.dashed ? "6 3" : void 0,
-      fadeIn: l
+      fadeIn: u
     }, (n == null ? void 0 : n.advance) ?? 3);
   }
   /** Add a rectangle */
-  rect(r, t, a, i, n) {
-    const l = (n == null ? void 0 : n.fadeIn) ?? 12;
+  rect(a, t, i, r, n) {
+    const u = (n == null ? void 0 : n.fadeIn) ?? 12;
     return this.addAtCursor({
       type: "rect",
-      x: r,
+      x: a,
       y: t,
-      width: a,
-      height: i,
+      width: i,
+      height: r,
       fill: (n == null ? void 0 : n.fill) ?? "none",
       stroke: (n == null ? void 0 : n.stroke) ?? this.theme.boxStroke,
       strokeWidth: (n == null ? void 0 : n.strokeWidth) ?? 1.5,
       rx: (n == null ? void 0 : n.rx) ?? 6,
       strokeDasharray: n != null && n.dashed ? "6 3" : void 0,
-      fadeIn: l
+      fadeIn: u
     }, (n == null ? void 0 : n.advance) ?? 5);
   }
   /** Add a circle */
-  circle(r, t, a, i) {
-    const n = (i == null ? void 0 : i.fadeIn) ?? 12;
+  circle(a, t, i, r) {
+    const n = (r == null ? void 0 : r.fadeIn) ?? 12;
     return this.addAtCursor({
       type: "circle",
-      cx: r,
+      cx: a,
       cy: t,
-      r: a,
-      fill: (i == null ? void 0 : i.fill) ?? "none",
-      stroke: (i == null ? void 0 : i.stroke) ?? this.theme.primary,
-      strokeWidth: (i == null ? void 0 : i.strokeWidth) ?? 2,
+      r: i,
+      fill: (r == null ? void 0 : r.fill) ?? "none",
+      stroke: (r == null ? void 0 : r.stroke) ?? this.theme.primary,
+      strokeWidth: (r == null ? void 0 : r.strokeWidth) ?? 2,
       fadeIn: n
-    }, (i == null ? void 0 : i.advance) ?? 5);
+    }, (r == null ? void 0 : r.advance) ?? 5);
   }
   /** Add a bar chart */
-  barChart(r, t) {
-    const a = t.fadeIn ?? 20;
+  barChart(a, t) {
+    const i = t.fadeIn ?? 20;
     return this.addAtCursor({
       type: "barChart",
-      bars: r,
+      bars: a,
       x: t.x,
       y: t.y,
       width: t.width,
@@ -1213,37 +1355,37 @@ class vt {
       valueFormat: t.valueFormat,
       gap: t.gap,
       showValues: t.showValues,
-      fadeIn: a
+      fadeIn: i
     }, 10);
   }
   /** Add a matrix visualization */
-  matrix(r, t) {
-    const a = (t == null ? void 0 : t.fadeIn) ?? 20;
+  matrix(a, t) {
+    const i = (t == null ? void 0 : t.fadeIn) ?? 20;
     return this.addAtCursor({
       type: "matrix",
-      values: r,
+      values: a,
       x: (t == null ? void 0 : t.x) ?? this.cx,
       y: (t == null ? void 0 : t.y) ?? 300,
       cellSize: (t == null ? void 0 : t.cellSize) ?? 50,
       color: (t == null ? void 0 : t.color) ?? this.theme.text,
       bracketColor: (t == null ? void 0 : t.bracketColor) ?? this.theme.primary,
       fontSize: t == null ? void 0 : t.fontSize,
-      fadeIn: a
+      fadeIn: i
     }, 10);
   }
   /** Add a graph (nodes + edges) */
-  graph(r, t, a) {
-    const i = (a == null ? void 0 : a.fadeIn) ?? 20;
+  graph(a, t, i) {
+    const r = (i == null ? void 0 : i.fadeIn) ?? 20;
     return this.addAtCursor({
       type: "graph",
-      nodes: r,
+      nodes: a,
       edges: t,
-      nodeColor: (a == null ? void 0 : a.nodeColor) ?? this.theme.secondary,
-      edgeColor: (a == null ? void 0 : a.edgeColor) ?? this.theme.muted,
-      labelColor: (a == null ? void 0 : a.labelColor) ?? "#fff",
-      nodeRadius: a == null ? void 0 : a.nodeRadius,
-      edgeWidth: a == null ? void 0 : a.edgeWidth,
-      fadeIn: i
+      nodeColor: (i == null ? void 0 : i.nodeColor) ?? this.theme.secondary,
+      edgeColor: (i == null ? void 0 : i.edgeColor) ?? this.theme.muted,
+      labelColor: (i == null ? void 0 : i.labelColor) ?? "#fff",
+      nodeRadius: i == null ? void 0 : i.nodeRadius,
+      edgeWidth: i == null ? void 0 : i.edgeWidth,
+      fadeIn: r
     }, 10);
   }
   // ─── Layout helpers ──────────────────────────────────────────────────
@@ -1251,34 +1393,34 @@ class vt {
    * Render a horizontal row of labeled boxes.
    * Returns the box positions for follow-up arrows, etc.
    */
-  boxRow(r, t) {
-    const a = (t == null ? void 0 : t.boxWidth) ?? 80, i = (t == null ? void 0 : t.boxHeight) ?? 40, n = (t == null ? void 0 : t.gap) ?? 12, l = (t == null ? void 0 : t.y) ?? 250, k = r.length * a + (r.length - 1) * n, I = (this._width - k) / 2;
+  boxRow(a, t) {
+    const i = (t == null ? void 0 : t.boxWidth) ?? 80, r = (t == null ? void 0 : t.boxHeight) ?? 40, n = (t == null ? void 0 : t.gap) ?? 12, u = (t == null ? void 0 : t.y) ?? 250, I = a.length * i + (a.length - 1) * n, O = (this._width - I) / 2;
     t == null || t.fadeIn;
-    const C = r.map((m, h) => {
-      const g = I + h * (a + n);
-      return { x: g, y: l, w: a, h: i, cx: g + a / 2, cy: l + i / 2 };
-    }), A = r.map((m, h) => {
+    const A = a.map((b, f) => {
+      const m = O + f * (i + n);
+      return { x: m, y: u, w: i, h: r, cx: m + i / 2, cy: u + r / 2 };
+    }), C = a.map((b, f) => {
       var D, T;
-      const g = C[h], E = ((D = t == null ? void 0 : t.colors) == null ? void 0 : D[h]) ?? this.theme.boxFill, O = ((T = t == null ? void 0 : t.strokeColors) == null ? void 0 : T[h]) ?? this.theme.boxStroke;
+      const m = A[f], z = ((D = t == null ? void 0 : t.colors) == null ? void 0 : D[f]) ?? this.theme.boxFill, E = ((T = t == null ? void 0 : t.strokeColors) == null ? void 0 : T[f]) ?? this.theme.boxStroke;
       return {
         type: "group",
         children: [
           {
             type: "rect",
-            x: g.x,
-            y: g.y,
-            width: a,
-            height: i,
-            fill: E,
-            stroke: O,
+            x: m.x,
+            y: m.y,
+            width: i,
+            height: r,
+            fill: z,
+            stroke: E,
             strokeWidth: 1.5,
             rx: 6
           },
           {
             type: "text",
-            x: g.cx,
-            y: g.cy + 5,
-            content: m,
+            x: m.cx,
+            y: m.cy + 5,
+            content: b,
             fontSize: (t == null ? void 0 : t.fontSize) ?? 13,
             fill: (t == null ? void 0 : t.textColor) ?? this.theme.text,
             textAnchor: "middle",
@@ -1290,40 +1432,40 @@ class vt {
     return this.addAtCursor({
       type: "stagger",
       staggerDelay: 3,
-      children: A
-    }, 8 + r.length * 2), C;
+      children: C
+    }, 8 + a.length * 2), A;
   }
   /**
    * Render a vertical stack of labeled boxes.
    */
-  boxColumn(r, t) {
-    const a = (t == null ? void 0 : t.boxWidth) ?? 160, i = (t == null ? void 0 : t.boxHeight) ?? 36, n = (t == null ? void 0 : t.gap) ?? 8, l = (t == null ? void 0 : t.y) ?? 150, k = (t == null ? void 0 : t.x) ?? this.cx;
+  boxColumn(a, t) {
+    const i = (t == null ? void 0 : t.boxWidth) ?? 160, r = (t == null ? void 0 : t.boxHeight) ?? 36, n = (t == null ? void 0 : t.gap) ?? 8, u = (t == null ? void 0 : t.y) ?? 150, I = (t == null ? void 0 : t.x) ?? this.cx;
     t == null || t.fadeIn;
-    const I = r.map((A, m) => {
-      const h = l + m * (i + n);
-      return { x: k - a / 2, y: h, w: a, h: i, cx: k, cy: h + i / 2 };
-    }), C = r.map((A, m) => {
-      var E, O;
-      const h = I[m], g = ((E = t == null ? void 0 : t.colors) == null ? void 0 : E[m]) ?? this.theme.boxFill;
+    const O = a.map((C, b) => {
+      const f = u + b * (r + n);
+      return { x: I - i / 2, y: f, w: i, h: r, cx: I, cy: f + r / 2 };
+    }), A = a.map((C, b) => {
+      var z, E;
+      const f = O[b], m = ((z = t == null ? void 0 : t.colors) == null ? void 0 : z[b]) ?? this.theme.boxFill;
       return {
         type: "group",
         children: [
           {
             type: "rect",
-            x: h.x,
-            y: h.y,
-            width: a,
-            height: i,
-            fill: g,
-            stroke: (O = t == null ? void 0 : t.colors) != null && O[m] ? t.colors[m] : this.theme.boxStroke,
+            x: f.x,
+            y: f.y,
+            width: i,
+            height: r,
+            fill: m,
+            stroke: (E = t == null ? void 0 : t.colors) != null && E[b] ? t.colors[b] : this.theme.boxStroke,
             strokeWidth: 1.5,
             rx: 6
           },
           {
             type: "text",
-            x: h.cx,
-            y: h.cy + 5,
-            content: A,
+            x: f.cx,
+            y: f.cy + 5,
+            content: C,
             fontSize: (t == null ? void 0 : t.fontSize) ?? 13,
             fill: (t == null ? void 0 : t.textColor) ?? this.theme.text,
             textAnchor: "middle"
@@ -1334,22 +1476,22 @@ class vt {
     return this.addAtCursor({
       type: "stagger",
       staggerDelay: 3,
-      children: C
-    }, 8 + r.length * 2), I;
+      children: A
+    }, 8 + a.length * 2), O;
   }
   /**
    * Draw arrows connecting sequential positions (e.g., output of boxRow/boxColumn).
    */
-  connectDown(r, t) {
-    const a = [];
-    for (let i = 0; i < r.length - 1; i++) {
-      const n = r[i], l = r[i + 1];
-      a.push({
+  connectDown(a, t) {
+    const i = [];
+    for (let r = 0; r < a.length - 1; r++) {
+      const n = a[r], u = a[r + 1];
+      i.push({
         type: "arrow",
         x1: n.cx,
         y1: n.y + n.h + 2,
-        x2: l.cx,
-        y2: l.y - 2,
+        x2: u.cx,
+        y2: u.y - 2,
         stroke: (t == null ? void 0 : t.color) ?? this.theme.muted,
         strokeWidth: 1.5,
         headSize: (t == null ? void 0 : t.headSize) ?? 6
@@ -1358,67 +1500,67 @@ class vt {
     return this.addAtCursor({
       type: "stagger",
       staggerDelay: 2,
-      children: a
-    }, 5 + r.length * 2);
+      children: i
+    }, 5 + a.length * 2);
   }
   /**
    * Draw arrows between two rows of boxes (fan-out pattern).
    */
-  connectRows(r, t, a) {
-    const i = [];
-    if (r.length === t.length)
-      for (let n = 0; n < r.length; n++)
-        i.push({
+  connectRows(a, t, i) {
+    const r = [];
+    if (a.length === t.length)
+      for (let n = 0; n < a.length; n++)
+        r.push({
           type: "arrow",
-          x1: r[n].cx,
-          y1: r[n].y + r[n].h + 2,
+          x1: a[n].cx,
+          y1: a[n].y + a[n].h + 2,
           x2: t[n].cx,
           y2: t[n].y - 2,
-          stroke: (a == null ? void 0 : a.color) ?? this.theme.muted,
+          stroke: (i == null ? void 0 : i.color) ?? this.theme.muted,
           strokeWidth: 1.5,
-          headSize: (a == null ? void 0 : a.headSize) ?? 6
+          headSize: (i == null ? void 0 : i.headSize) ?? 6
         });
     return this.addAtCursor({
       type: "fadeIn",
       duration: 15,
-      children: i
+      children: r
     }, 15);
   }
   // ─── Raw element access ──────────────────────────────────────────────
   /** Add any raw ElementNode at the current cursor position */
-  add(r, t = 0) {
-    return this.addAtCursor(r, t);
+  add(a, t = 0) {
+    return this.addAtCursor(a, t);
   }
   /** Add a raw element at a specific frame (doesn't move cursor) */
-  addAt(r, t) {
+  addAt(a, t) {
     return this.elements.push({
       type: "sequence",
-      from: r,
+      from: a,
       children: [t]
     }), this;
   }
   /** Add multiple raw elements simultaneously at current cursor */
-  addAll(r, t = 0) {
+  addAll(a, t = 0) {
     return this.addAtCursor({
       type: "group",
-      children: r
+      children: a
     }, t);
   }
   // ─── Internal ────────────────────────────────────────────────────────
-  addAtCursor(r, t) {
+  addAtCursor(a, t) {
     return this.elements.push({
       type: "sequence",
       from: this.cursor,
-      children: [r]
+      children: [a]
     }), this.cursor += t, this;
   }
   /** Build the slide's player node with all timed elements */
   _build() {
-    const r = Math.max(this.cursor + 60, 90);
-    return { elements: this.elements, durationInFrames: r };
+    const a = Math.max(this.cursor + 60, 90);
+    return { elements: this.elements, durationInFrames: a };
   }
 }
-const wt = {
+const Ft = {
   background: "#0a0a1e",
   title: "#e0e7ff",
   subtitle: "#94a3b8",
@@ -1433,7 +1575,7 @@ const wt = {
   warning: "#fbbf24",
   error: "#f87171",
   palette: ["#4fc3f7", "#a78bfa", "#f472b6", "#34d399", "#fbbf24", "#fb923c", "#6366f1", "#22d3ee"]
-}, At = {
+}, Wt = {
   background: "#f8fafc",
   title: "#1e293b",
   subtitle: "#64748b",
@@ -1449,9 +1591,9 @@ const wt = {
   error: "#dc2626",
   palette: ["#2563eb", "#7c3aed", "#db2777", "#16a34a", "#d97706", "#ea580c", "#4f46e5", "#0891b2"]
 };
-class kt {
-  constructor(r, t, a) {
-    this._slides = [], this._title = r, this._theme = t ?? wt, this._opts = {
+class Pt {
+  constructor(a, t, i) {
+    this._slides = [], this._title = a, this._theme = t ?? Ft, this._opts = {
       width: 900,
       height: 640,
       fps: 30,
@@ -1459,35 +1601,35 @@ class kt {
       transitionDuration: 10,
       showHud: !0,
       showNotes: !0,
-      ...a
+      ...i
     };
   }
   /** Add a slide */
-  slide(r, t, a) {
-    return this._slides.push({ title: r, build: t, notes: a == null ? void 0 : a.notes, background: a == null ? void 0 : a.background }), this;
+  slide(a, t, i) {
+    return this._slides.push({ title: a, build: t, notes: i == null ? void 0 : i.notes, background: i == null ? void 0 : i.background }), this;
   }
   /** Build the final ElucimDocument */
   build() {
-    const r = this._slides.map((a) => {
-      const i = new vt(
+    const a = this._slides.map((i) => {
+      const r = new Et(
         this._theme,
         this._opts.fps,
         this._opts.width,
         this._opts.height
       );
-      a.build(i);
-      const { elements: n, durationInFrames: l } = i._build();
+      i.build(r);
+      const { elements: n, durationInFrames: u } = r._build();
       return {
         type: "slide",
-        title: a.title,
-        notes: a.notes,
-        background: a.background,
+        title: i.title,
+        notes: i.notes,
+        background: i.background,
         children: [{
           type: "player",
           width: this._opts.width,
           height: this._opts.height,
           fps: this._opts.fps,
-          durationInFrames: l,
+          durationInFrames: u,
           controls: !1,
           loop: !1,
           autoPlay: !0,
@@ -1506,28 +1648,28 @@ class kt {
         transitionDuration: this._opts.transitionDuration,
         showHud: this._opts.showHud,
         showNotes: this._opts.showNotes,
-        slides: r
+        slides: a
       }
     };
   }
   /** Build and return as JSON string (for saving to file) */
-  toJSON(r = !0) {
-    return JSON.stringify(this.build(), null, r ? 2 : void 0);
+  toJSON(a = !0) {
+    return JSON.stringify(this.build(), null, a ? 2 : void 0);
   }
 }
-function Et(e, r, t) {
-  return new kt(e, r, t);
+function _t(e, a, t) {
+  return new Pt(e, a, t);
 }
 export {
-  Ct as DslRenderer,
-  kt as PresentationBuilder,
-  vt as SlideBuilder,
-  Be as compileExpression,
-  Ve as compileVectorExpression,
-  wt as darkTheme,
-  At as lightTheme,
-  Et as presentation,
+  Mt as DslRenderer,
+  Pt as PresentationBuilder,
+  Et as SlideBuilder,
+  Ke as compileExpression,
+  Xe as compileVectorExpression,
+  Ft as darkTheme,
+  Wt as lightTheme,
+  _t as presentation,
   c as resolveEasing,
-  He as validate,
-  U as validateExpression
+  Ye as validate,
+  H as validateExpression
 };