@maniclang/workbench 0.1.11

package/examples/.manic-output/993f3788-f75e-445c-ba45-c401907b3c02/job.json

@@ -0,0 +1,26 @@
+{
+  "id": "993f3788-f75e-445c-ba45-c401907b3c02",
+  "file": "band.manic",
+  "format": "mp4",
+  "options": {
+    "format": "mp4",
+    "fps": 60,
+    "scale": 1,
+    "canvas": "auto",
+    "cpuShaders": false,
+    "branded": true
+  },
+  "status": "completed",
+  "startedAt": 1787648427552,
+  "finishedAt": 1787648437659,
+  "log": "Rendering with Manic…\n597 frames -> /Users/anish/git/maniclang-x/manic-workbench/examples/.manic-output/993f3788-f75e-445c-ba45-c401907b3c02/out.mp4\nmarkers: /Users/anish/git/maniclang-x/manic-workbench/examples/.manic-output/993f3788-f75e-445c-ba45-c401907b3c02/markers.json\nout.mp4 is ready.",
+  "outputName": "out.mp4",
+  "frameCount": 597,
+  "progress": {
+    "phase": "complete",
+    "percent": 100,
+    "framesRendered": 597,
+    "totalFrames": 597,
+    "elapsedMs": 10107
+  }
+}

package/examples/.manic-output/993f3788-f75e-445c-ba45-c401907b3c02/markers.json

@@ -0,0 +1,13 @@
+{
+  "fps": 60,
+  "source_range": {"from": 0.000, "to": 5.000, "duration": 5.000},
+  "stages": [
+
+  ],
+  "sections": [
+
+  ],
+  "marks": [
+
+  ]
+}

package/examples/.manic-workbench-threads/thread_3ce7448a13f64f9e887d1bc8106a97a8.json

@@ -0,0 +1,45 @@
+{
+  "protocolVersion": 1,
+  "threadId": "thread_3ce7448a13f64f9e887d1bc8106a97a8",
+  "target": {
+    "kind": "file",
+    "path": "ai-story.manic"
+  },
+  "turns": [
+    {
+      "runId": "agent_b0491f8a5b8145509a4c1391cc7621f2",
+      "userMessage": "show me a pulley animation",
+      "proposalSummary": "Replace the olympiad geometry scene with a new pulley-physics animation: a classic Atwood machine (two masses over a pulley) paired with an energy graph, followed by a block-and-tackle demo showing mechanical advantage.",
+      "status": "ready",
+      "appliedRevision": "23ff967903df26dc1dc44195206d4756bed875791ae32d433ff04c18dc689940",
+      "at": 1786271477001
+    },
+    {
+      "runId": "agent_88ab9482e0724fa9adde6461caf25f99",
+      "userMessage": "add three pulley ",
+      "proposalSummary": "Add a third act: a compound pulley system with three masses (fixed pulley + movable pulley) after the block-and-tackle demo.",
+      "status": "ready",
+      "appliedRevision": "96b25242942e4f2a1f1f3d5ac1deaaa59bb73b3d3f23a91acf38d71a5fc4729c",
+      "at": 1786271558034
+    },
+    {
+      "runId": "agent_8da51363ce384b8aa71160b3bb56e92e",
+      "userMessage": "Screen issues all jumbled do it on paper template ",
+      "proposalSummary": "Switch to the paper template and fix overlapping layout: give every title, diagram, equation, and caption clear vertical separation (title band, diagram band, equation band, caption band) and space the two Act-1 diagrams further apart horizontally; slightly reduce diagram scale so nothing collides.",
+      "status": "ready",
+      "appliedRevision": "b29efc1c9c9b2075e435165b75a45ba4801f35a9316198d3f7f77145b50b6210",
+      "at": 1786271731379
+    },
+    {
+      "runId": "agent_764bddd331984b0b90976882b7710dfc",
+      "userMessage": "visualzie this Let $O(0, 0), P(3, 4), Q(6, 0)$ be the vertices of the triangles $OPQ$. The point $R$ inside the triangle $OPQ$ is such that the triangles $OPR, PQR, OQR$ are of equal area. The coordinates of $R$ are",
+      "proposalSummary": "Replace the pulley-physics scene with a geo-kit visualization of the equal-area point problem: triangle OPQ is constructed, the centroid R is derived (not hand-plotted), the three equal-area sub-triangles are shaded, and the answer R=(3,4/3) is revealed with a supporting area equation.",
+      "status": "ready",
+      "appliedRevision": "f1c312285e435352130e3e36c980a9cdc0ac63bd09a232ade98741feb92d1c26",
+      "at": 1786272143314
+    }
+  ],
+  "lastAppliedRevision": "f1c312285e435352130e3e36c980a9cdc0ac63bd09a232ade98741feb92d1c26",
+  "createdAt": 1786271440067,
+  "updatedAt": 1786272146092
+}

package/examples/.manic-workbench-threads/thread_d494cda29249477591056234719e4a3a.json

@@ -0,0 +1,21 @@
+{
+  "protocolVersion": 1,
+  "threadId": "thread_d494cda29249477591056234719e4a3a",
+  "target": {
+    "kind": "draft",
+    "draftName": "ai-story.manic"
+  },
+  "turns": [
+    {
+      "runId": "agent_pending_1786271383441",
+      "userMessage": "show me a pulley animation ",
+      "proposalSummary": "Anthropic: invalid x-api-key",
+      "status": "failed",
+      "appliedRevision": null,
+      "at": 1786271384506
+    }
+  ],
+  "lastAppliedRevision": null,
+  "createdAt": 1786271383426,
+  "updatedAt": 1786271384507
+}

package/examples/.manic-workbench-threads/thread_e98ebdc225184ea5b8ddda8b44541f63.json

@@ -0,0 +1,29 @@
+{
+  "protocolVersion": 1,
+  "threadId": "thread_e98ebdc225184ea5b8ddda8b44541f63",
+  "target": {
+    "kind": "file",
+    "path": "some-story.manic"
+  },
+  "turns": [
+    {
+      "runId": "agent_b535cb79440a4bc19acec512e3e807fa",
+      "userMessage": "A straight line $L$ through the point $(3, -2)$ is inclined at an angle $60^\\circ$ to the line $\\sqrt{3x} + y = 1$. If $L$ also intersects the x-axis, then the equation of $L$ is\n\nYout goal is onl visulze the problem no answer is required ",
+      "proposalSummary": "Create a Manic scene visualizing the coordinate-geometry problem: a line L through (3,-2) inclined at 60° to √3x+y=1, meeting the x-axis. Pure visualization/setup — no final equation is stated.",
+      "status": "ready",
+      "appliedRevision": "014e89b9b563b7f75340d70fc24d751f2228a85ad93f90bad0b759c63fb7fdf7",
+      "at": 1786272454290
+    },
+    {
+      "runId": "agent_8ae574e9bb7441f3a613695529e44970",
+      "userMessage": "Nice work now Continue teh story with finding the solutions ",
+      "proposalSummary": "Continue the story: derive the slope of L from the 60° angle condition, reject the extraneous case that never meets the x-axis, build the point-slope equation into its final form, and reveal it on the original figure.",
+      "status": "ready",
+      "appliedRevision": "6dac258db5a44fef8576b0bd8e27e7428110d2668b376f0b0ca608391a2b2a41",
+      "at": 1786272695002
+    }
+  ],
+  "lastAppliedRevision": "6dac258db5a44fef8576b0bd8e27e7428110d2668b376f0b0ca608391a2b2a41",
+  "createdAt": 1786272272301,
+  "updatedAt": 1786272867273
+}

package/examples/README.md

@@ -0,0 +1,35 @@
+# Manic examples
+
+This directory is the default Workbench project when you run `npm start` or
+`npm run dev` with no path. It contains the public catalogue of Manic source
+examples: creator shorts, mathematics, geometry, physics, machine learning,
+motion graphics, reactive explanations, systems diagrams, 2D, and 3D.
+
+Open Workbench on these samples:
+
+```sh
+npm start
+# or
+npm run dev
+```
+
+The Files sidebar lists every `.manic` story here. Open one to edit, preview,
+or render.
+
+Run an example directly with the Manic Engine after installing it:
+
+```sh
+manic examples/reactive-math-notation.manic
+```
+
+Check it without opening a preview window:
+
+```sh
+manic check examples/reactive-math-notation.manic
+```
+
+Examples that reference `asset:` resources use the assets bundled with the
+official Manic installation. In Workbench Settings, set `MANIC_ASSETS_DIR` if
+you are using an extracted archive (auto-filled from `…/bin/manic`).
+
+Documentation: [docs.maniclang.com](https://docs.maniclang.com/).

package/examples/a-story-1.manic

@@ -0,0 +1,222 @@
+title("Can you reverse the spin of this tetrahedron?");
+canvas("9:16");
+template("black");
+
+// the single knob: 0 = orthographic, 1 = perspective. Every tetrahedron reads it.
+parameter(pv, (540, 3400), 0.0, 0.0, 1.0, "perspective", 2);
+
+text(brand, (540, 40), "maniclang.com");
+size(brand, 36);
+display(brand);
+color(brand, fg);
+opacity(brand, 0.8);
+
+caption(head, "Can you reverse the spin of this tetrahedron?", (540, 104), 38, lime);
+text(sub, (370, 179), "there is no right answer — the picture is genuinely ambiguous");
+size(sub, 27);
+color(sub, fg);
+opacity(sub, 0.62);
+
+text(sub2, (356, 278), "flat projection throws away the one thing that would tell you");
+size(sub2, 32);
+color(sub2, fg);
+opacity(sub2, 0.46);
+
+
+// ---- the ambiguous one ------------------------------------------------------------
+cloud(bige, 360, #f0f4f8, 1.0) {
+  let j = mod(i, 60);
+  let ed = (i - j)/60;
+  let s = j/59;
+  // the six edges of K4, from the index alone
+  let va = step(3, ed) + step(5, ed);
+  let vb = mix(ed + 1, mix(ed - 1, 3, step(4, ed)), step(3, ed));
+  // a tetrahedron is the four cube corners with xyz = +1, so z = x*y
+  let ax = 1 - 2*step(2, va);
+  let ay = 1 - 2*mod(va, 2);
+  let bx = 1 - 2*step(2, vb);
+  let by = 1 - 2*mod(vb, 2);
+  let qx = mix(ax, bx, s);
+  let qy = mix(ay, by, s);
+  let qz = mix(ax*ay, bx*by, s);
+  // TILT THE OBJECT, then spin it. Tilting the camera after the spin would
+  // destroy the very identity this scene is about.
+  let ty = qy*0.939373 - qz*0.342898;
+  let tz = (qy*0.342898 + qz*0.939373)*1;
+  let th = 0.55*t;
+  let rx = qx*cos(th) + tz*sin(th);
+  let rz = 0 - qx*sin(th) + tz*cos(th);
+  let kk = mix(0.75, 3.0/(4.0 - rz), pv);
+  let x = 540.0 + 170.0*kk*rx;
+  let y = 620.0 - 170.0*kk*ty;
+  let r = 1.7;
+  let alpha = 0.85;
+}
+cloud(bigv, 96, #9ec9e8, 1.0) {
+  let k = mod(i, 4);
+  let qx = 1 - 2*step(2, k);
+  let qy = 1 - 2*mod(k, 2);
+  let qz = qx*qy;
+  // TILT THE OBJECT, then spin it. Tilting the camera after the spin would
+  // destroy the very identity this scene is about.
+  let ty = qy*0.939373 - qz*0.342898;
+  let tz = (qy*0.342898 + qz*0.939373)*1;
+  let th = 0.55*t;
+  let rx = qx*cos(th) + tz*sin(th);
+  let rz = 0 - qx*sin(th) + tz*cos(th);
+  let kk = mix(0.75, 3.0/(4.0 - rz), pv);
+  // deterministic scatter rather than rand(), so the two mirrored copies are
+  // guaranteed identical by construction and the claim below is literally true
+  let ang = 6.283185*fract(i*0.381966);
+  let rr = 6*sqrt(fract(i*0.618034));
+  let x = 540.0 + 170.0*kk*rx + rr*cos(ang);
+  let y = 620.0 - 170.0*kk*ty + rr*sin(ang);
+  let r = 2.3;
+  let alpha = 0.95;
+}
+glow(bigv, 0.8);
+
+// ---- the proof: the same picture, from two different objects ----------------------
+// as shown
+cloud(p0e, 360, #f0f4f8, 1.0) {
+  let j = mod(i, 60);
+  let ed = (i - j)/60;
+  let s = j/59;
+  // the six edges of K4, from the index alone
+  let va = step(3, ed) + step(5, ed);
+  let vb = mix(ed + 1, mix(ed - 1, 3, step(4, ed)), step(3, ed));
+  // a tetrahedron is the four cube corners with xyz = +1, so z = x*y
+  let ax = 1 - 2*step(2, va);
+  let ay = 1 - 2*mod(va, 2);
+  let bx = 1 - 2*step(2, vb);
+  let by = 1 - 2*mod(vb, 2);
+  let qx = mix(ax, bx, s);
+  let qy = mix(ay, by, s);
+  let qz = mix(ax*ay, bx*by, s);
+  // TILT THE OBJECT, then spin it. Tilting the camera after the spin would
+  // destroy the very identity this scene is about.
+  let ty = qy*0.939373 - qz*0.342898;
+  let tz = (qy*0.342898 + qz*0.939373)*1;
+  let th = 0.55*t;
+  let rx = qx*cos(th) + tz*sin(th);
+  let rz = 0 - qx*sin(th) + tz*cos(th);
+  let kk = mix(0.75, 3.0/(4.0 - rz), pv);
+  let x = 300.0 + 85.0*kk*rx;
+  let y = 1300.0 - 85.0*kk*ty;
+  let r = 1.7;
+  let alpha = 0.85*clamp((t - 14.0)/1.2, 0, 1);
+}
+cloud(p0v, 96, #9ec9e8, 1.0) {
+  let k = mod(i, 4);
+  let qx = 1 - 2*step(2, k);
+  let qy = 1 - 2*mod(k, 2);
+  let qz = qx*qy;
+  // TILT THE OBJECT, then spin it. Tilting the camera after the spin would
+  // destroy the very identity this scene is about.
+  let ty = qy*0.939373 - qz*0.342898;
+  let tz = (qy*0.342898 + qz*0.939373)*1;
+  let th = 0.55*t;
+  let rx = qx*cos(th) + tz*sin(th);
+  let rz = 0 - qx*sin(th) + tz*cos(th);
+  let kk = mix(0.75, 3.0/(4.0 - rz), pv);
+  // deterministic scatter rather than rand(), so the two mirrored copies are
+  // guaranteed identical by construction and the claim below is literally true
+  let ang = 6.283185*fract(i*0.381966);
+  let rr = 6*sqrt(fract(i*0.618034));
+  let x = 300.0 + 85.0*kk*rx + rr*cos(ang);
+  let y = 1300.0 - 85.0*kk*ty + rr*sin(ang);
+  let r = 2.3;
+  let alpha = 0.95*clamp((t - 14.0)/1.2, 0, 1);
+}
+glow(p0v, 0.8);
+
+// its mirror, turning the other way
+cloud(p1e, 360, #f0f4f8, 1.0) {
+  let j = mod(i, 60);
+  let ed = (i - j)/60;
+  let s = j/59;
+  // the six edges of K4, from the index alone
+  let va = step(3, ed) + step(5, ed);
+  let vb = mix(ed + 1, mix(ed - 1, 3, step(4, ed)), step(3, ed));
+  // a tetrahedron is the four cube corners with xyz = +1, so z = x*y
+  let ax = 1 - 2*step(2, va);
+  let ay = 1 - 2*mod(va, 2);
+  let bx = 1 - 2*step(2, vb);
+  let by = 1 - 2*mod(vb, 2);
+  let qx = mix(ax, bx, s);
+  let qy = mix(ay, by, s);
+  let qz = mix(ax*ay, bx*by, s);
+  // TILT THE OBJECT, then spin it. Tilting the camera after the spin would
+  // destroy the very identity this scene is about.
+  let ty = qy*0.939373 - qz*0.342898;
+  let tz = (qy*0.342898 + qz*0.939373)*-1;
+  let th = -0.55*t;
+  let rx = qx*cos(th) + tz*sin(th);
+  let rz = 0 - qx*sin(th) + tz*cos(th);
+  let kk = mix(0.75, 3.0/(4.0 - rz), pv);
+  let x = 780.0 + 85.0*kk*rx;
+  let y = 1300.0 - 85.0*kk*ty;
+  let r = 1.7;
+  let alpha = 0.85*clamp((t - 14.0)/1.2, 0, 1);
+}
+cloud(p1v, 96, #9ec9e8, 1.0) {
+  let k = mod(i, 4);
+  let qx = 1 - 2*step(2, k);
+  let qy = 1 - 2*mod(k, 2);
+  let qz = qx*qy;
+  // TILT THE OBJECT, then spin it. Tilting the camera after the spin would
+  // destroy the very identity this scene is about.
+  let ty = qy*0.939373 - qz*0.342898;
+  let tz = (qy*0.342898 + qz*0.939373)*-1;
+  let th = -0.55*t;
+  let rx = qx*cos(th) + tz*sin(th);
+  let rz = 0 - qx*sin(th) + tz*cos(th);
+  let kk = mix(0.75, 3.0/(4.0 - rz), pv);
+  // deterministic scatter rather than rand(), so the two mirrored copies are
+  // guaranteed identical by construction and the claim below is literally true
+  let ang = 6.283185*fract(i*0.381966);
+  let rr = 6*sqrt(fract(i*0.618034));
+  let x = 780.0 + 85.0*kk*rx + rr*cos(ang);
+  let y = 1300.0 - 85.0*kk*ty + rr*sin(ang);
+  let r = 2.3;
+  let alpha = 0.95*clamp((t - 14.0)/1.2, 0, 1);
+}
+glow(p1v, 0.8);
+
+text(cp0, (540, 1050), "which way is it turning?");
+size(cp0, 22); color(cp0, #9ec9e8); opacity(cp0, 0.85);
+text(cp1, (540, 1050), "two different objects, turning opposite ways");
+size(cp1, 22); color(cp1, #9ec9e8); opacity(cp1, 0.0);
+text(cp2, (481, 1045), "one cue is enough — near things draw bigger");
+size(cp2, 35);
+color(cp2, #9ec9e8);
+opacity(cp2, 0);
+
+text(a2, (540, 1140), "the same picture, from two different objects");
+size(a2, 19); color(a2, #f0f4f8); opacity(a2, 0.0);
+text(l0, (300, 1470), "as shown");
+size(l0, 17); color(l0, fg); opacity(l0, 0.0);
+text(l1, (780, 1470), "mirrored, turning the other way");
+size(l1, 17); color(l1, fg); opacity(l1, 0.0);
+text(f1, (540, 1548), "flat: the two differ by exactly zero, every frame");
+size(f1, 19); color(f1, fg); opacity(f1, 0.0);
+text(f2, (540, 1586), "with perspective: by 54% of the figure's own radius");
+size(f2, 19); color(f2, #e8a33d); opacity(f2, 0.0);
+text(end, (540, 1676), "your eye is not failing — it is being handed two answers");
+size(end, 20); color(end, #f0f4f8); opacity(end, 0.0);
+glow(end, 0.4);
+
+// ---- the reveal ---------------------------------------------------------------------
+// Frame 0 is the tetrahedron already turning, which is the whole question. It is left
+// alone long enough to flip on its own before anything is explained.
+seq {
+  wait(13.4);
+  par { fade(cp0, 0.5); show(cp1, 0.6); show(a2, 0.5);
+        seq { wait(0.8); par { show(l0, 0.5); show(l1, 0.5); } } wait(5.2); }
+  par { show(f1, 0.6); wait(3.0); }
+  par { to(pv, value, 1.0, 4.0, smooth);
+        seq { wait(0.8); fade(cp1, 0.4); show(cp2, 0.6); } wait(5.0); }
+  par { show(f2, 0.7); wait(3.2); }
+  par { show(end, 0.8); wait(4.0); }
+}
+wait(2.4);

package/examples/a-story.manic

@@ -0,0 +1,100 @@
+title("Whiteboard flow");
+canvas(1280, 720);
+template("whiteboard");
+hand(pencil.right, 0.72, (5, 3), under);
+
+text(title, (640, 78), "How an idea becomes a result");
+size(title, 42);
+color(title, fg);
+handwritten(title);
+untraced(title);
+
+rect(ideaBox, (229, 349), 250, 150);
+outlined(ideaBox);
+stroke(ideaBox, 3);
+color(ideaBox, blue);
+rough(ideaBox, 1, 1);
+untraced(ideaBox);
+
+text(ideaLabel, (245, 350), "Idea");
+size(ideaLabel, 30);
+color(ideaLabel, fg);
+handwritten(ideaLabel);
+untraced(ideaLabel);
+
+arrow(toBuild, (380, 350), (500, 350));
+stroke(toBuild, 4);
+color(toBuild, coral);
+rough(toBuild, 1, 1);
+untraced(toBuild);
+
+smartdraw(build, (640, 350), "asset:smartdraw/database.svg", 210);
+untraced(build);
+
+text(buildLabel, (640, 505), "Build");
+size(buildLabel, 27);
+color(buildLabel, fg);
+handwritten(buildLabel);
+untraced(buildLabel);
+
+arrow(toResult, (780, 350), (900, 350));
+stroke(toResult, 4);
+color(toResult, coral);
+rough(toResult, 1, 1);
+untraced(toResult);
+
+rect(resultBox, (1035, 350), 250, 150);
+outlined(resultBox);
+stroke(resultBox, 3);
+color(resultBox, lime);
+rough(resultBox, 1, 1);
+untraced(resultBox);
+
+text(resultLabel, (1035, 350), "Result");
+size(resultLabel, 30);
+color(resultLabel, fg);
+handwritten(resultLabel);
+untraced(resultLabel);
+
+doodle(insight, (1100, 585), bulb, 105);
+color(insight, gold);
+rough(insight, 1, 1);
+untraced(insight);
+
+step("Write the question") {
+  seq {
+    write(title, 1.5);
+  }
+}
+
+step("Start with the idea") {
+  seq {
+    draw(ideaBox, 0.8);
+    write(ideaLabel, 0.65);
+  }
+}
+
+step("Build it") {
+  seq {
+    draw(toBuild, 0.5);
+    draw(build, 1.15);
+    write(buildLabel, 0.6);
+  }
+}
+
+step("Reach the result") {
+  seq {
+    draw(toResult, 0.5);
+    draw(resultBox, 0.8);
+    write(resultLabel, 0.7);
+  }
+}
+
+step("Finish with insight") {
+  seq {
+    draw(insight, 0.75);
+  }
+}
+
+plot(plot, (591, 668), 90, 60, "x^2", (-3, 3));
+color(plot, cyan);

package/examples/achromat-cinematic.manic

@@ -0,0 +1,105 @@
+// ============================================================================
+//  achromat-cinematic.manic  —  chromatic aberration & its fix (annotated, dark)
+// ----------------------------------------------------------------------------
+//  The `achromat` capstone on a dark bench, where the coloured foci glow.
+//  Elevation lens: the CAMERA magnifies the focal region so the red/blue split
+//  is dramatic, and a `bracelabel` marks the aberration gap — which then closes
+//  as `run` sweeps in the doublet and the colours merge to one point.
+// ============================================================================
+
+title("The Achromatic Doublet");
+canvas("16:9");
+
+
+achromat(ac, (540, 360));
+
+// bracket the axial gap between the two foci (fades as they merge)
+bracelabel(gap, (852, 406), (908, 406), "CA", 20); color(gap, red);
+
+text(cap, (cx, h - 46), ""); color(cap, fg); size(cap, 24); bold(cap); display(cap); sticky(cap);
+
+// ================= THE SCENE =================
+say(cap, "one simple lens — but the colours refuse to agree…", 0.5);
+seq {
+  wait(0.6);
+}
+
+par {
+  run(ac, 8);
+  seq {
+    par { cam((880, 360), 2.4, smooth); zoom(1.7, 2.4, smooth); }   // magnify the focal region
+    say(cap, "blue focuses NEARER, red FARTHER — chromatic aberration", 0.3);
+    wait(2.8);
+    say(cap, "now cement a flint element behind it — the achromat", 0.3);
+    fade(gap, 0.7);                                                  // the gap closes
+    wait(2.0);
+    say(cap, "…and the colours snap back to ONE sharp focus", 0.3);
+  }
+}
+par { cam((cx, 360), 1.3, smooth); zoom(1.0, 1.3, smooth); }
+wait(1.2);
+
+// BEGIN WORKBENCH CANVAS
+// Scene built visually. Every line is ordinary Manic — edit freely.
+template("blueprint");
+
+text(idea, (640, 126), "Start with an idea");
+size(idea, 52);
+align(idea, right);
+color(idea, fg);
+hidden(idea);
+
+circle(focus, (494, 401), 118);
+color(focus, cyan);
+hidden(focus, center);
+
+text(note, (640, 600), "Add, arrange, then animate.");
+size(note, 26);
+color(note, dim);
+hidden(note);
+
+text(label, (612, 367), "New text");
+size(label, 32);
+color(label, fg);
+hidden(label, center);
+
+step("Reveal") {
+  stagger(0.2) {
+    show(idea, 0.6);
+    show(focus, 0.7, overshoot);
+    show(note, 0.5);
+  }
+}
+
+step("Focus") {
+  pulse(focus, 0.9);
+  flash(idea, gold, 0.9);
+}
+// END WORKBENCH CANVAS
+
+label(gap, "label", (0, -48));
+color(gap.label, fg);
+
+caption(caption, "one word at a time", (291, 230), 24, gold);
+
+text(label2, (310, 372), "New textdas");
+size(label2, 32);
+color(label2, fg);
+
+dot(dot, (688, 408), 20);
+color(dot, cyan);
+
+dot(dot2, (995, 169), 2);
+color(dot2, cyan);
+
+text(label3, (616, 336), "New text");
+size(label3, 32);
+color(label3, fg);
+
+link(link, gap, cap);
+color(link, fg);
+
+framebox(framebox, gap, 8, gold);
+
+bracelabel(bracelabel, (582, 444), (802, 444), "label", 22);
+color(bracelabel, fg);

package/examples/achromat.manic

@@ -0,0 +1,32 @@
+// ============================================================================
+//  achromat.manic  —  chromatic aberration, and the fix (real optics)
+// ----------------------------------------------------------------------------
+//  The optics kit's capstone. A single lens can't focus all colours to one
+//  point: it bends blue more than red (its index is higher for blue — real
+//  dispersion), so blue focuses NEARER and red FARTHER. `run` then sweeps in the
+//  achromatic doublet (crown + flint) and the two foci slide back together to a
+//  single sharp point — the trick every camera and telescope lens uses.
+// ============================================================================
+
+title("The Achromatic Doublet");
+canvas("16:9");
+
+achromat(ac, (540, 360));
+
+text(cap, (cx, h - 46), ""); color(cap, fg); size(cap, 24); bold(cap); display(cap); sticky(cap);
+
+// ================= THE SCENE =================
+say(cap, "one simple lens — but the colours don't agree…", 0.5);
+wait(0.6);
+
+par {
+  run(ac, 7);
+  seq {
+    say(cap, "blue focuses NEARER, red FARTHER — chromatic aberration", 0.3);
+    wait(2.6);
+    say(cap, "now add a flint element behind it — the achromatic doublet", 0.3);
+    wait(2.2);
+    say(cap, "…and the colours snap back to ONE sharp focus", 0.3);
+  }
+}
+wait(1.2);