@pixerate/editor 0.140.4 → 0.142.1

package/dist/agent/canvasPlayback.d.cts

@@ -0,0 +1,15 @@
+import { type NodeRectOptions } from '../canvas/arrange.cjs';
+import type { CanvasEdge, CanvasNode } from '../canvas/types.cjs';
+import { type PlaybackStep } from '../tools/playback.cjs';
+import { type planToolCall } from './planner.cjs';
+import type { AgentStep, EditorSnapshot } from './types.cjs';
+/**
+ * Turns the planner's model steps into cursor steps (flow coordinates), against the nodes as they
+ * are before the call. Steps after `commit` play once the change is on the canvas.
+ */
+export declare function planCanvasPlaybackSteps<TNode extends CanvasNode = CanvasNode, TEdge extends CanvasEdge = CanvasEdge>(steps: readonly AgentStep<TNode, TEdge>[], nodes: readonly TNode[], rectOptions?: NodeRectOptions): PlaybackStep[];
+/**
+ * The cursor steps for one canvas edit tool call (`canvas_add_node`, `edit_canvas`, ...), or `null`
+ * when the call is invalid (the handler then reports the error) or is not a canvas edit.
+ */
+export declare function planCanvasToolPlayback<TNode extends CanvasNode = CanvasNode, TEdge extends CanvasEdge = CanvasEdge>(name: string, args: Record<string, any>, snapshot: EditorSnapshot<TNode, TEdge>, plannerOptions?: Parameters<typeof planToolCall>[3], rectOptions?: NodeRectOptions): PlaybackStep[] | null;

package/dist/agent/canvasPlayback.d.ts

@@ -0,0 +1,15 @@
+import { type NodeRectOptions } from '../canvas/arrange.js';
+import type { CanvasEdge, CanvasNode } from '../canvas/types.js';
+import { type PlaybackStep } from '../tools/playback.js';
+import { type planToolCall } from './planner.js';
+import type { AgentStep, EditorSnapshot } from './types.js';
+/**
+ * Turns the planner's model steps into cursor steps (flow coordinates), against the nodes as they
+ * are before the call. Steps after `commit` play once the change is on the canvas.
+ */
+export declare function planCanvasPlaybackSteps<TNode extends CanvasNode = CanvasNode, TEdge extends CanvasEdge = CanvasEdge>(steps: readonly AgentStep<TNode, TEdge>[], nodes: readonly TNode[], rectOptions?: NodeRectOptions): PlaybackStep[];
+/**
+ * The cursor steps for one canvas edit tool call (`canvas_add_node`, `edit_canvas`, ...), or `null`
+ * when the call is invalid (the handler then reports the error) or is not a canvas edit.
+ */
+export declare function planCanvasToolPlayback<TNode extends CanvasNode = CanvasNode, TEdge extends CanvasEdge = CanvasEdge>(name: string, args: Record<string, any>, snapshot: EditorSnapshot<TNode, TEdge>, plannerOptions?: Parameters<typeof planToolCall>[3], rectOptions?: NodeRectOptions): PlaybackStep[] | null;

package/dist/agent/index.cjs

@@ -10,9 +10,18 @@ var _chunkGLQQ2VILcjs = require('../chunk-GLQQ2VIL.cjs');
 
 
 
-var _chunkMRD3NXKRcjs = require('../chunk-MRD3NXKR.cjs');
+
+
+var _chunkUBRYHNRUcjs = require('../chunk-UBRYHNRU.cjs');
 require('../chunk-4EFNS2HV.cjs');
-require('../chunk-LACYURUW.cjs');
+
+
+
+
+var _chunkXH32BATEcjs = require('../chunk-XH32BATE.cjs');
+
+
+
 
 
 
@@ -35,10 +44,16 @@ require('../chunk-LACYURUW.cjs');
 
 
 
+var _chunkY4BWZB6Jcjs = require('../chunk-Y4BWZB6J.cjs');
 
 
 
-var _chunkHDK3T2QScjs = require('../chunk-HDK3T2QS.cjs');
+
+
+
+
+
+var _chunkX2HQP7DFcjs = require('../chunk-X2HQP7DF.cjs');
 
 
 
@@ -121,7 +136,8 @@ var _chunk2BSBFBOAcjs = require('../chunk-2BSBFBOA.cjs');
 
 
 
-var _chunk2RUNJYOXcjs = require('../chunk-2RUNJYOX.cjs');
+
+var _chunkQZFEX2N4cjs = require('../chunk-QZFEX2N4.cjs');
 
 
 
@@ -130,6 +146,14 @@ var _chunk55AKPTLMcjs = require('../chunk-55AKPTLM.cjs');
 require('../chunk-N3KJFGXT.cjs');
 
 
+
+
+
+
+
+var _chunkUJGAA6AKcjs = require('../chunk-UJGAA6AK.cjs');
+
+
 var _chunkWOFXZ3XUcjs = require('../chunk-WOFXZ3XU.cjs');
 require('../chunk-FJ2MSI43.cjs');
 
@@ -170,10 +194,10 @@ function planAgentCommand(command, snapshot, options = {}) {
           };
         }
         if (anchorId) {
-          pos = _chunkMRD3NXKRcjs.placeBeside.call(void 0, rects, defaultNodeSize, normalizeSide(command.side), anchorId);
+          pos = _chunkUBRYHNRUcjs.placeBeside.call(void 0, rects, defaultNodeSize, normalizeSide(command.side), anchorId);
         } else if (nodes.length > 0) {
           const lastNode = nodes[nodes.length - 1];
-          pos = _chunkMRD3NXKRcjs.placeBeside.call(void 0, rects, defaultNodeSize, "right", lastNode.id);
+          pos = _chunkUBRYHNRUcjs.placeBeside.call(void 0, rects, defaultNodeSize, "right", lastNode.id);
         } else {
           pos = { x: 100, y: 100 };
         }
@@ -241,12 +265,12 @@ function planAgentCommand(command, snapshot, options = {}) {
             stored[n.id] = { ...n.position };
           }
         }
-        layouted = _chunkMRD3NXKRcjs.ensureLayout.call(void 0, nodes, edges, {
+        layouted = _chunkUBRYHNRUcjs.ensureLayout.call(void 0, nodes, edges, {
           direction: dir,
           storedPositions: stored
         });
       } else {
-        layouted = _chunkMRD3NXKRcjs.getLayoutedNodes.call(void 0, nodes, edges, void 0, { direction: dir });
+        layouted = _chunkUBRYHNRUcjs.getLayoutedNodes.call(void 0, nodes, edges, void 0, { direction: dir });
       }
       const positions = {};
       for (const node of layouted) {
@@ -459,6 +483,87 @@ function planToolCall(name, args, snapshot, options) {
 var _state = require('@tiptap/pm/state');
 var _history = require('@tiptap/pm/history');
 
+// src/agent/canvasPlayback.ts
+var centre = (r) => ({ x: r.x + r.width / 2, y: r.y + r.height / 2 });
+var labelOf = (data) => {
+  const label = _nullishCoalesce(_nullishCoalesce(_optionalChain([data, 'optionalAccess', _16 => _16.label]), () => ( _optionalChain([data, 'optionalAccess', _17 => _17.title]))), () => ( _optionalChain([data, 'optionalAccess', _18 => _18.text])));
+  return typeof label === "string" && label.trim() ? label : null;
+};
+function planCanvasPlaybackSteps(steps, nodes, rectOptions) {
+  const placed = new Map(_chunkUBRYHNRUcjs.createNodeLookup.call(void 0, nodes));
+  const rectOf = (id) => {
+    const node = placed.get(id);
+    return node ? _chunkUBRYHNRUcjs.getNodeRect.call(void 0, node, placed, rectOptions) : null;
+  };
+  const before = [];
+  const after = [];
+  const click = (rect) => rect ? [{ type: "move", to: centre(rect) }, { type: "focus", rect }, { type: "press" }, { type: "release" }] : [];
+  for (const step of steps) {
+    switch (step.type) {
+      case "step:canvas_add_node": {
+        placed.set(step.node.id, step.node);
+        const rect = rectOf(step.node.id);
+        const label = labelOf(step.node.data);
+        before.push(...click(rect), ...label ? [{ type: "type", text: label }] : []);
+        break;
+      }
+      case "step:canvas_add_edge": {
+        const a = rectOf(step.edge.source);
+        const b = rectOf(step.edge.target);
+        if (!a || !b) break;
+        const label = typeof step.edge.label === "string" ? step.edge.label : labelOf(step.edge.data);
+        before.push(
+          { type: "move", to: { x: a.x + a.width, y: a.y + a.height / 2 } },
+          { type: "press" },
+          { type: "drag", to: { x: b.x, y: b.y + b.height / 2 } },
+          { type: "release" },
+          ...label ? [{ type: "type", text: label }] : []
+        );
+        break;
+      }
+      case "step:canvas_update_node": {
+        const rect = rectOf(step.id);
+        const label = labelOf(step.data);
+        before.push(...click(rect), ...rect && label ? [{ type: "type", text: label }] : []);
+        break;
+      }
+      case "step:canvas_remove_nodes":
+        for (const id of step.nodeIds.slice(0, 8)) before.push(...click(rectOf(id)));
+        break;
+      case "step:canvas_select":
+        for (const id of step.nodeIds.slice(0, 8)) before.push(...click(rectOf(id)));
+        break;
+      case "step:canvas_highlight":
+        for (const id of step.nodeIds.slice(0, 8)) {
+          const rect = rectOf(id);
+          if (rect) before.push({ type: "move", to: centre(rect) }, { type: "focus", rect });
+        }
+        break;
+      case "step:canvas_move_nodes": {
+        const moved = Object.entries(step.positions);
+        for (const [id, position] of moved) {
+          const node = placed.get(id);
+          if (node) placed.set(id, { ...node, position });
+        }
+        const rect = _chunkX2HQP7DFcjs.unionRects.call(void 0, moved.map(([id]) => rectOf(id)));
+        if (rect) after.push({ type: "move", to: centre(rect) }, { type: "focus", rect }, { type: "wait", ms: 450 });
+        break;
+      }
+      default:
+        break;
+    }
+  }
+  if (!before.length && !after.length) return [];
+  return [...before, { type: "commit" }, ...after];
+}
+function planCanvasToolPlayback(name, args, snapshot, plannerOptions, rectOptions) {
+  const command = toolCallToAgentCommand(name, args);
+  if (!command || !command.type.startsWith("canvas:") || validateAgentCommand(command, snapshot)) return null;
+  const steps = planAgentCommand(command, snapshot, plannerOptions);
+  const planned = planCanvasPlaybackSteps(steps, _nullishCoalesce(_optionalChain([snapshot, 'access', _19 => _19.canvas, 'optionalAccess', _20 => _20.nodes]), () => ( [])), rectOptions);
+  return planned.length ? planned : null;
+}
+
 // src/agent/documentChartTools.ts
 
 var READ = { readOnlyHint: true, destructiveHint: false, idempotentHint: true, openWorldHint: false };
@@ -573,7 +678,7 @@ function createDocumentChartTools(editor) {
       const ed = editor();
       checkPosition(ed, at);
       const spec = checkedSpec(input);
-      const id = _nullishCoalesce(_optionalChain([ed, 'access', _16 => _16.extensionManager, 'access', _17 => _17.extensions, 'access', _18 => _18.find, 'call', _19 => _19((e) => e.name === "chart"), 'optionalAccess', _20 => _20.options, 'access', _21 => _21.generateId, 'optionalCall', _22 => _22()]), () => ( `chart-${Date.now().toString(36)}`));
+      const id = _nullishCoalesce(_optionalChain([ed, 'access', _21 => _21.extensionManager, 'access', _22 => _22.extensions, 'access', _23 => _23.find, 'call', _24 => _24((e) => e.name === "chart"), 'optionalAccess', _25 => _25.options, 'access', _26 => _26.generateId, 'optionalCall', _27 => _27()]), () => ( `chart-${Date.now().toString(36)}`));
       const node = { type: "chart", attrs: { id, spec, width, ...height !== void 0 ? { height } : {} } };
       const chain = ed.chain().command(({ tr }) => (_history.closeHistory.call(void 0, tr), true));
       const ok = (at !== void 0 ? chain.insertContentAt(at, node) : chain.insertContent(node)).run();
@@ -788,7 +893,7 @@ function createDocumentFormatTools(editor, changed) {
   const formatText = (ed) => {
     const { schema } = ed;
     const has = (name) => !!schema.marks[name];
-    const hasAttr = (mark, attr) => !!_optionalChain([schema, 'access', _23 => _23.marks, 'access', _24 => _24[mark], 'optionalAccess', _25 => _25.spec, 'access', _26 => _26.attrs, 'optionalAccess', _27 => _27[attr]]);
+    const hasAttr = (mark, attr) => !!_optionalChain([schema, 'access', _28 => _28.marks, 'access', _29 => _29[mark], 'optionalAccess', _30 => _30.spec, 'access', _31 => _31.attrs, 'optionalAccess', _32 => _32[attr]]);
     const properties = { ...RANGE_PROPERTIES };
     for (const [arg, mark, what] of TOGGLE_MARKS) {
       if (has(mark)) properties[arg] = { type: "boolean", description: `${what} true sets it, false clears it; omit to leave it.` };
@@ -863,7 +968,7 @@ function createDocumentFormatTools(editor, changed) {
   const blockTypes = (ed) => BLOCK_TYPES.filter(([, node]) => !!ed.schema.nodes[node] && (!LIST_ITEMS[node] || !!ed.schema.nodes[LIST_ITEMS[node]]));
   const headingLevels = (ed) => {
     const ext = ed.extensionManager.extensions.find((e) => e.name === "heading");
-    return _nullishCoalesce(_optionalChain([ext, 'optionalAccess', _28 => _28.options, 'optionalAccess', _29 => _29.levels]), () => ( [1, 2, 3, 4, 5, 6]));
+    return _nullishCoalesce(_optionalChain([ext, 'optionalAccess', _33 => _33.options, 'optionalAccess', _34 => _34.levels]), () => ( [1, 2, 3, 4, 5, 6]));
   };
   const setBlockType = (ed) => {
     const types = blockTypes(ed);
@@ -913,8 +1018,8 @@ function createDocumentFormatTools(editor, changed) {
   const setTextAlign = (ed) => {
     const ext = ed.extensionManager.extensions.find((e) => e.name === "textAlign");
     if (!ext) return null;
-    const alignments = (_nullishCoalesce(_optionalChain([ext, 'access', _30 => _30.options, 'optionalAccess', _31 => _31.alignments]), () => ( ["left", "center", "right", "justify"]))).slice();
-    const types = _nullishCoalesce(_optionalChain([ext, 'access', _32 => _32.options, 'optionalAccess', _33 => _33.types]), () => ( ["heading", "paragraph"]));
+    const alignments = (_nullishCoalesce(_optionalChain([ext, 'access', _35 => _35.options, 'optionalAccess', _36 => _36.alignments]), () => ( ["left", "center", "right", "justify"]))).slice();
+    const types = _nullishCoalesce(_optionalChain([ext, 'access', _37 => _37.options, 'optionalAccess', _38 => _38.types]), () => ( ["heading", "paragraph"]));
     return {
       name: "set_text_align",
       title: "Align text",
@@ -981,13 +1086,13 @@ function textBlocks(editor) {
 function createTextPresence(editor, providerId, option) {
   const config = option === false ? null : option === true || option === void 0 ? {} : option;
   const caret = {
-    id: _nullishCoalesce(_optionalChain([config, 'optionalAccess', _34 => _34.id]), () => ( providerId)),
-    name: _nullishCoalesce(_optionalChain([config, 'optionalAccess', _35 => _35.name]), () => ( _chunkL434J57Vcjs.DEFAULT_AGENT_CARET_NAME)),
-    color: _nullishCoalesce(_optionalChain([config, 'optionalAccess', _36 => _36.color]), () => ( _chunkL434J57Vcjs.DEFAULT_AGENT_CARET_COLOR))
+    id: _nullishCoalesce(_optionalChain([config, 'optionalAccess', _39 => _39.id]), () => ( providerId)),
+    name: _nullishCoalesce(_optionalChain([config, 'optionalAccess', _40 => _40.name]), () => ( _chunkL434J57Vcjs.DEFAULT_AGENT_CARET_NAME)),
+    color: _nullishCoalesce(_optionalChain([config, 'optionalAccess', _41 => _41.color]), () => ( _chunkL434J57Vcjs.DEFAULT_AGENT_CARET_COLOR))
   };
-  const typing = !_optionalChain([config, 'optionalAccess', _37 => _37.typing]) ? null : config.typing === true ? {} : config.typing;
-  const idleMs = _nullishCoalesce(_optionalChain([config, 'optionalAccess', _38 => _38.idleMs]), () => ( 12e3));
-  const changedMs = _nullishCoalesce(_optionalChain([config, 'optionalAccess', _39 => _39.changedMs]), () => ( 1500));
+  const typing = !_optionalChain([config, 'optionalAccess', _42 => _42.typing]) ? null : config.typing === true ? {} : config.typing;
+  const idleMs = _nullishCoalesce(_optionalChain([config, 'optionalAccess', _43 => _43.idleMs]), () => ( 12e3));
+  const changedMs = _nullishCoalesce(_optionalChain([config, 'optionalAccess', _44 => _44.changedMs]), () => ( 1500));
   let idleTimer;
   let tintTimer;
   const live = () => {
@@ -1065,6 +1170,13 @@ function findMatches(editor, query, args, replacement) {
 function createRichTextToolProvider(target, options) {
   const editor = () => toEditor(target);
   const charts = createDocumentChartTools(editor);
+  const withCaret = (tool) => tool.name !== "insert_chart" ? tool : {
+    ...tool,
+    handler: (args, context) => {
+      if (typeof args.at === "number") presence.show(args.at);
+      return tool.handler(args, context);
+    }
+  };
   const presence = createTextPresence(editor, options.id, options.presence);
   const formatting = createDocumentFormatTools(editor, (ranges) => presence.changed(ranges.filter((r) => r.from < r.to)));
   const getText = {
@@ -1366,7 +1478,7 @@ function createRichTextToolProvider(target, options) {
       if (!ed || ed.isDestroyed) return [];
       if (!ed.isEditable) return [getText, findText, ...charts.read()];
       const tools = [getText, findText, insertText, replaceText, replaceRange, replaceSelection, setSelection, ...formatting.tools(ed)];
-      return [...tools, ..._chunkL434J57Vcjs.isTableEnabled.call(void 0, ed) ? [editTable] : [], ...charts.read(), ...charts.write()];
+      return [...tools, ..._chunkL434J57Vcjs.isTableEnabled.call(void 0, ed) ? [editTable] : [], ...charts.read(), ...charts.write().map(withCaret)];
     },
     subscribe: (notify) => {
       const ed = editor();
@@ -1396,7 +1508,7 @@ function parseRange(ref) {
   if (extra !== void 0) throw new Error(`Invalid range "${ref}". Use A1 notation, e.g. "A1:C5".`);
   const start = parseCell(startRef);
   const end = parseCell(endRef);
-  return _chunk2RUNJYOXcjs.normalizeRange.call(void 0, { startRow: start.row, startCol: start.col, endRow: end.row, endCol: end.col });
+  return _chunkQZFEX2N4cjs.normalizeRange.call(void 0, { startRow: start.row, startCol: start.col, endRow: end.row, endCol: end.col });
 }
 var formatRange = (r) => `${_chunk55AKPTLMcjs.indexToColName.call(void 0, r.startCol)}${r.startRow + 1}:${_chunk55AKPTLMcjs.indexToColName.call(void 0, r.endCol)}${r.endRow + 1}`;
 var CELL_INPUT = { type: ["string", "number", "boolean", "null"] };
@@ -1458,7 +1570,7 @@ function createSpreadsheetToolProvider(controller, options) {
         values,
         raw,
         errors,
-        merges: controller.getMerges().filter((m) => _chunk2RUNJYOXcjs.rangesIntersect.call(void 0, m, read)).map(formatRange),
+        merges: controller.getMerges().filter((m) => _chunkQZFEX2N4cjs.rangesIntersect.call(void 0, m, read)).map(formatRange),
         sheet: { rows: rowCount, columns: colCount }
       };
     }
@@ -1653,8 +1765,8 @@ function createSpreadsheetToolProvider(controller, options) {
     ({ range }) => {
       const r = parseRange(range);
       inSheet(r, range);
-      if (_chunk2RUNJYOXcjs.isSingleCellRange.call(void 0, r)) throw new Error(`${range} is a single cell; give a range of at least two cells.`);
-      const partial = controller.getMerges().find((m) => _chunk2RUNJYOXcjs.rangesIntersect.call(void 0, m, r) && !_chunk2RUNJYOXcjs.rangeContainsRange.call(void 0, r, m));
+      if (_chunkQZFEX2N4cjs.isSingleCellRange.call(void 0, r)) throw new Error(`${range} is a single cell; give a range of at least two cells.`);
+      const partial = controller.getMerges().find((m) => _chunkQZFEX2N4cjs.rangesIntersect.call(void 0, m, r) && !_chunkQZFEX2N4cjs.rangeContainsRange.call(void 0, r, m));
       if (partial) throw new Error(`${range} partly overlaps the merged range ${formatRange(partial)}; include all of it or unmerge it first.`);
       const readOnly = readOnlyIn(r);
       if (readOnly.length) throw new Error(`Read-only cells: ${readOnly.slice(0, 20).join(", ")}. Nothing was merged.`);
@@ -1679,7 +1791,7 @@ function createSpreadsheetToolProvider(controller, options) {
     false,
     ({ range }) => {
       const r = parseRange(range);
-      const touched = controller.getMerges().filter((m) => _chunk2RUNJYOXcjs.rangesIntersect.call(void 0, m, r));
+      const touched = controller.getMerges().filter((m) => _chunkQZFEX2N4cjs.rangesIntersect.call(void 0, m, r));
       if (!touched.length) throw new Error(`No merged cells in ${range}. get_range lists the merges in a range.`);
       controller.unmergeCells(r);
       return { unmerged: touched.map(formatRange) };
@@ -1695,14 +1807,14 @@ function createSpreadsheetToolProvider(controller, options) {
     ({ range }) => {
       const s = parseRange(range);
       inSheet(s, range);
-      if (_chunk2RUNJYOXcjs.isSingleCellRange.call(void 0, s)) throw new Error(`${range} is a single cell; give a range of at least two cells.`);
+      if (_chunkQZFEX2N4cjs.isSingleCellRange.call(void 0, s)) throw new Error(`${range} is a single cell; give a range of at least two cells.`);
       const t = {
         startRow: s.startRow,
         startCol: s.startCol,
         endRow: s.startRow + (s.endCol - s.startCol),
         endCol: s.startCol + (s.endRow - s.startRow)
       };
-      const merge = controller.getMerges().find((m) => _chunk2RUNJYOXcjs.rangesIntersect.call(void 0, m, s) || _chunk2RUNJYOXcjs.rangesIntersect.call(void 0, m, t));
+      const merge = controller.getMerges().find((m) => _chunkQZFEX2N4cjs.rangesIntersect.call(void 0, m, s) || _chunkQZFEX2N4cjs.rangesIntersect.call(void 0, m, t));
       if (merge) throw new Error(`Cannot transpose ${range}: the merged range ${formatRange(merge)} is in the way; unmerge it first.`);
       const readOnly = [.../* @__PURE__ */ new Set([...readOnlyIn(s), ...readOnlyIn(t)])];
       if (readOnly.length) throw new Error(`Read-only cells: ${readOnly.slice(0, 20).join(", ")}. Nothing was transposed.`);
@@ -1716,14 +1828,18 @@ function createSpreadsheetToolProvider(controller, options) {
     title: "Spreadsheet",
     description: "A spreadsheet: read and set cells and ranges, insert and delete rows and columns, merge and transpose.",
     skill: "pixerate-spreadsheet",
-    tools: [getRange, setCell, setRange, insertRows, deleteRows, insertColumns, deleteColumns, mergeCells, unmergeCells, transposeRange]
+    // Agent playback: `<SpreadsheetEditor playback>` attaches as `spreadsheet` and finds the cells.
+    playbackSurface: _nullishCoalesce(options.playbackSurface, () => ( "spreadsheet")),
+    tools: [getRange, setCell, setRange, insertRows, deleteRows, insertColumns, deleteColumns, mergeCells, unmergeCells, transposeRange].map(
+      (tool) => ({ ...tool, plan: (args) => _chunkQZFEX2N4cjs.planSpreadsheetToolPlayback.call(void 0, tool.name, args) })
+    )
   };
 }
 function missingArgumentsMessage(name, args) {
   const required = _chunkSVFEVKLFcjs.EDIT_OPERATION_REQUIRED_ARGUMENTS[name][args.operation];
   if (!required) return `Unknown operation "${args.operation}".`;
   const missing = required.filter(
-    (key) => key === "id" ? args.id === void 0 && _optionalChain([args, 'access', _40 => _40.node, 'optionalAccess', _41 => _41.id]) === void 0 : args[key] === void 0
+    (key) => key === "id" ? args.id === void 0 && _optionalChain([args, 'access', _45 => _45.node, 'optionalAccess', _46 => _46.id]) === void 0 : args[key] === void 0
   );
   return missing.length ? `Operation "${args.operation}" requires ${required.join(", ")}; missing: ${missing.join(", ")}.` : `Operation "${args.operation}" has invalid arguments (expected ${required.join(", ")} with the types in the schema).`;
 }
@@ -1755,8 +1871,8 @@ function createEditorMcpToolProvider(options) {
     await options.applySteps(steps);
     return describeSteps(steps);
   };
-  const canvas = _nullishCoalesce(_optionalChain([options, 'access', _42 => _42.surfaces, 'optionalAccess', _43 => _43.canvas]), () => ( true));
-  const prompt = _nullishCoalesce(_optionalChain([options, 'access', _44 => _44.surfaces, 'optionalAccess', _45 => _45.prompt]), () => ( true));
+  const canvas = _nullishCoalesce(_optionalChain([options, 'access', _47 => _47.surfaces, 'optionalAccess', _48 => _48.canvas]), () => ( true));
+  const prompt = _nullishCoalesce(_optionalChain([options, 'access', _49 => _49.surfaces, 'optionalAccess', _50 => _50.prompt]), () => ( true));
   const editTools = options.toolStyle === "combined" ? [...canvas ? [_chunkSVFEVKLFcjs.MCP_TOOL_EDIT_CANVAS] : [], ...prompt ? [_chunkSVFEVKLFcjs.MCP_TOOL_EDIT_PROMPT] : []] : [...canvas ? _chunkSVFEVKLFcjs.EDITOR_CANVAS_TOOLS : [], ...prompt ? _chunkSVFEVKLFcjs.EDITOR_PROMPT_TOOLS : []];
   const tools = [
     {
@@ -1769,7 +1885,12 @@ function createEditorMcpToolProvider(options) {
         };
       }
     },
-    ...editTools.map((definition) => ({ ...definition, handler: edit(definition.name) }))
+    ...editTools.map((definition) => ({
+      ...definition,
+      handler: edit(definition.name),
+      // The cursor goes where the planner puts the change (see `planCanvasToolPlayback`).
+      plan: (args) => planCanvasToolPlayback(definition.name, args, options.getSnapshot(), options.plannerOptions, options.rectOptions)
+    }))
   ];
   if (options.captureView) {
     const capture = options.captureView;
@@ -1787,6 +1908,7 @@ function createEditorMcpToolProvider(options) {
     title: "Canvas and prompt editor",
     description: "The node canvas and the prompt: editor state, nodes and edges, layout, prompt text, and a view of the editor.",
     skill: "pixerate-canvas",
+    ...options.playbackSurface ? { playbackSurface: options.playbackSurface } : {},
     tools
   };
 }
@@ -2065,4 +2187,22 @@ function createCanvasComponentToolProvider(controller, options = { id: "canvas-c
 
 
 
-exports.CAPTURE_EXCLUDE_SELECTOR = _chunkSVFEVKLFcjs.CAPTURE_EXCLUDE_SELECTOR; exports.CAPTURE_OVERLAY_SELECTORS = _chunkSVFEVKLFcjs.CAPTURE_OVERLAY_SELECTORS; exports.EDITOR_CANVAS_TOOLS = _chunkSVFEVKLFcjs.EDITOR_CANVAS_TOOLS; exports.EDITOR_MCP_TOOLS = _chunkSVFEVKLFcjs.EDITOR_MCP_TOOLS; exports.EDITOR_PROMPT_TOOLS = _chunkSVFEVKLFcjs.EDITOR_PROMPT_TOOLS; exports.EDIT_OPERATION_REQUIRED_ARGUMENTS = _chunkSVFEVKLFcjs.EDIT_OPERATION_REQUIRED_ARGUMENTS; exports.EXPORT_EXCLUDED_SELECTORS = _chunkSVFEVKLFcjs.EXPORT_EXCLUDED_SELECTORS; exports.JSON_RPC_ERRORS = _chunkHDK3T2QScjs.JSON_RPC_ERRORS; exports.MCP_PROTOCOL_VERSIONS = _chunkHDK3T2QScjs.MCP_PROTOCOL_VERSIONS; exports.MCP_TOOL_CANVAS_ADD_NODE = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_ADD_NODE; exports.MCP_TOOL_CANVAS_CONNECT = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_CONNECT; exports.MCP_TOOL_CANVAS_HIGHLIGHT = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_HIGHLIGHT; exports.MCP_TOOL_CANVAS_LAYOUT = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_LAYOUT; exports.MCP_TOOL_CANVAS_REMOVE_NODES = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_REMOVE_NODES; exports.MCP_TOOL_CANVAS_SELECT = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_SELECT; exports.MCP_TOOL_CANVAS_UPDATE_NODE = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_UPDATE_NODE; exports.MCP_TOOL_EDIT_CANVAS = _chunkSVFEVKLFcjs.MCP_TOOL_EDIT_CANVAS; exports.MCP_TOOL_EDIT_PROMPT = _chunkSVFEVKLFcjs.MCP_TOOL_EDIT_PROMPT; exports.MCP_TOOL_GET_EDITOR_STATE = _chunkSVFEVKLFcjs.MCP_TOOL_GET_EDITOR_STATE; exports.MCP_TOOL_PROMPT_INSERT_TEXT = _chunkSVFEVKLFcjs.MCP_TOOL_PROMPT_INSERT_TEXT; exports.MCP_TOOL_PROMPT_REPLACE_RANGE = _chunkSVFEVKLFcjs.MCP_TOOL_PROMPT_REPLACE_RANGE; exports.MCP_TOOL_PROMPT_SELECT = _chunkSVFEVKLFcjs.MCP_TOOL_PROMPT_SELECT; exports.MCP_TOOL_PROMPT_SET_VARIABLE = _chunkSVFEVKLFcjs.MCP_TOOL_PROMPT_SET_VARIABLE; exports.MCP_TOOL_VIEW_EDITOR = _chunkSVFEVKLFcjs.MCP_TOOL_VIEW_EDITOR; exports.TOOL_BRIDGE_DEFAULT_PORT = _chunkHDK3T2QScjs.TOOL_BRIDGE_DEFAULT_PORT; exports.TOOL_BRIDGE_PROTOCOL = _chunkHDK3T2QScjs.TOOL_BRIDGE_PROTOCOL; exports.TOOL_DISCOVERY_TOOLS = _chunkHDK3T2QScjs.TOOL_DISCOVERY_TOOLS; exports.TOOL_NAMESPACE_SEPARATOR = _chunkHDK3T2QScjs.TOOL_NAMESPACE_SEPARATOR; exports.ToolRegistry = _chunkHDK3T2QScjs.ToolRegistry; exports.ToolRegistryError = _chunkHDK3T2QScjs.ToolRegistryError; exports.ToolRegistryView = _chunkHDK3T2QScjs.ToolRegistryView; exports.UNSAFE_JSON_KEYS = _chunk2BSBFBOAcjs.UNSAFE_JSON_KEYS; exports.baseToolName = _chunkHDK3T2QScjs.baseToolName; exports.captureInputSchema = _chunkN2FGYZ4Qcjs.captureInputSchema; exports.captureOutputSize = _chunkN2FGYZ4Qcjs.captureOutputSize; exports.cloneElementWithStyles = _chunkSVFEVKLFcjs.cloneElementWithStyles; exports.connectToolBridge = _chunkHDK3T2QScjs.connectToolBridge; exports.createCanvasComponentToolProvider = createCanvasComponentToolProvider; exports.createCaptureTool = _chunkN2FGYZ4Qcjs.createCaptureTool; exports.createCaptureToolProvider = _chunkN2FGYZ4Qcjs.createCaptureToolProvider; exports.createDocumentChartTools = createDocumentChartTools; exports.createEditorMcpToolProvider = createEditorMcpToolProvider; exports.createElementCaptureSurface = _chunkSVFEVKLFcjs.createElementCaptureSurface; exports.createMcpServer = _chunkHDK3T2QScjs.createMcpServer; exports.createRichTextToolProvider = createRichTextToolProvider; exports.createSpreadsheetToolProvider = createSpreadsheetToolProvider; exports.createToolRegistry = _chunkHDK3T2QScjs.createToolRegistry; exports.elementToSvg = _chunkSVFEVKLFcjs.elementToSvg; exports.errorResult = _chunkHDK3T2QScjs.errorResult; exports.isUnsafeJsonKey = _chunk2BSBFBOAcjs.isUnsafeJsonKey; exports.listSkills = _chunkHDK3T2QScjs.listSkills; exports.normalizeSide = normalizeSide; exports.parseSkillFrontmatter = _chunkHDK3T2QScjs.parseSkillFrontmatter; exports.planAgentCommand = planAgentCommand; exports.planToolCall = planToolCall; exports.rasterizeElement = _chunkSVFEVKLFcjs.rasterizeElement; exports.readSkillFile = _chunkHDK3T2QScjs.readSkillFile; exports.resolveCaptureRequest = _chunkN2FGYZ4Qcjs.resolveCaptureRequest; exports.searchTokens = _chunkHDK3T2QScjs.searchTokens; exports.searchTools = _chunkHDK3T2QScjs.searchTools; exports.stripPrototypeKeys = _chunk2BSBFBOAcjs.stripPrototypeKeys; exports.summarize = _chunkHDK3T2QScjs.summarize; exports.toCapturedImageData = _chunkN2FGYZ4Qcjs.toCapturedImageData; exports.toToolResult = _chunkHDK3T2QScjs.toToolResult; exports.toolCallToAgentCommand = toolCallToAgentCommand; exports.toolsetInstructions = _chunkHDK3T2QScjs.toolsetInstructions; exports.toolsetName = _chunkHDK3T2QScjs.toolsetName; exports.unionCaptureRects = _chunkN2FGYZ4Qcjs.unionCaptureRects; exports.unknownToolMessage = _chunkHDK3T2QScjs.unknownToolMessage; exports.validateAgentCommand = validateAgentCommand; exports.validateJsonSchema = _chunkWOFXZ3XUcjs.validateJsonSchema;
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+exports.AgentPlayback = _chunkX2HQP7DFcjs.AgentPlayback; exports.CAPTURE_EXCLUDE_SELECTOR = _chunkSVFEVKLFcjs.CAPTURE_EXCLUDE_SELECTOR; exports.CAPTURE_OVERLAY_SELECTORS = _chunkSVFEVKLFcjs.CAPTURE_OVERLAY_SELECTORS; exports.EDITOR_CANVAS_TOOLS = _chunkSVFEVKLFcjs.EDITOR_CANVAS_TOOLS; exports.EDITOR_MCP_TOOLS = _chunkSVFEVKLFcjs.EDITOR_MCP_TOOLS; exports.EDITOR_PROMPT_TOOLS = _chunkSVFEVKLFcjs.EDITOR_PROMPT_TOOLS; exports.EDIT_OPERATION_REQUIRED_ARGUMENTS = _chunkSVFEVKLFcjs.EDIT_OPERATION_REQUIRED_ARGUMENTS; exports.EXPORT_EXCLUDED_SELECTORS = _chunkSVFEVKLFcjs.EXPORT_EXCLUDED_SELECTORS; exports.JSON_RPC_ERRORS = _chunkY4BWZB6Jcjs.JSON_RPC_ERRORS; exports.MCP_PROTOCOL_VERSIONS = _chunkY4BWZB6Jcjs.MCP_PROTOCOL_VERSIONS; exports.MCP_TOOL_CANVAS_ADD_NODE = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_ADD_NODE; exports.MCP_TOOL_CANVAS_CONNECT = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_CONNECT; exports.MCP_TOOL_CANVAS_HIGHLIGHT = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_HIGHLIGHT; exports.MCP_TOOL_CANVAS_LAYOUT = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_LAYOUT; exports.MCP_TOOL_CANVAS_REMOVE_NODES = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_REMOVE_NODES; exports.MCP_TOOL_CANVAS_SELECT = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_SELECT; exports.MCP_TOOL_CANVAS_UPDATE_NODE = _chunkSVFEVKLFcjs.MCP_TOOL_CANVAS_UPDATE_NODE; exports.MCP_TOOL_EDIT_CANVAS = _chunkSVFEVKLFcjs.MCP_TOOL_EDIT_CANVAS; exports.MCP_TOOL_EDIT_PROMPT = _chunkSVFEVKLFcjs.MCP_TOOL_EDIT_PROMPT; exports.MCP_TOOL_GET_EDITOR_STATE = _chunkSVFEVKLFcjs.MCP_TOOL_GET_EDITOR_STATE; exports.MCP_TOOL_PROMPT_INSERT_TEXT = _chunkSVFEVKLFcjs.MCP_TOOL_PROMPT_INSERT_TEXT; exports.MCP_TOOL_PROMPT_REPLACE_RANGE = _chunkSVFEVKLFcjs.MCP_TOOL_PROMPT_REPLACE_RANGE; exports.MCP_TOOL_PROMPT_SELECT = _chunkSVFEVKLFcjs.MCP_TOOL_PROMPT_SELECT; exports.MCP_TOOL_PROMPT_SET_VARIABLE = _chunkSVFEVKLFcjs.MCP_TOOL_PROMPT_SET_VARIABLE; exports.MCP_TOOL_VIEW_EDITOR = _chunkSVFEVKLFcjs.MCP_TOOL_VIEW_EDITOR; exports.PRESENCE_COLORS = _chunkUJGAA6AKcjs.PRESENCE_COLORS; exports.PerformanceQueue = _chunkUJGAA6AKcjs.PerformanceQueue; exports.PresenceStore = _chunkUJGAA6AKcjs.PresenceStore; exports.TOOL_BRIDGE_DEFAULT_PORT = _chunkY4BWZB6Jcjs.TOOL_BRIDGE_DEFAULT_PORT; exports.TOOL_BRIDGE_PROTOCOL = _chunkY4BWZB6Jcjs.TOOL_BRIDGE_PROTOCOL; exports.TOOL_DISCOVERY_TOOLS = _chunkY4BWZB6Jcjs.TOOL_DISCOVERY_TOOLS; exports.TOOL_NAMESPACE_SEPARATOR = _chunkY4BWZB6Jcjs.TOOL_NAMESPACE_SEPARATOR; exports.ToolRegistry = _chunkY4BWZB6Jcjs.ToolRegistry; exports.ToolRegistryError = _chunkY4BWZB6Jcjs.ToolRegistryError; exports.ToolRegistryView = _chunkY4BWZB6Jcjs.ToolRegistryView; exports.UNSAFE_JSON_KEYS = _chunk2BSBFBOAcjs.UNSAFE_JSON_KEYS; exports.baseToolName = _chunkY4BWZB6Jcjs.baseToolName; exports.captureInputSchema = _chunkN2FGYZ4Qcjs.captureInputSchema; exports.captureOutputSize = _chunkN2FGYZ4Qcjs.captureOutputSize; exports.cloneElementWithStyles = _chunkSVFEVKLFcjs.cloneElementWithStyles; exports.connectToolBridge = _chunkY4BWZB6Jcjs.connectToolBridge; exports.createAgentPlayback = _chunkX2HQP7DFcjs.createAgentPlayback; exports.createCanvasComponentToolProvider = createCanvasComponentToolProvider; exports.createCaptureTool = _chunkN2FGYZ4Qcjs.createCaptureTool; exports.createCaptureToolProvider = _chunkN2FGYZ4Qcjs.createCaptureToolProvider; exports.createDocumentChartTools = createDocumentChartTools; exports.createEditorMcpToolProvider = createEditorMcpToolProvider; exports.createElementCaptureSurface = _chunkSVFEVKLFcjs.createElementCaptureSurface; exports.createInstantPresenceClock = _chunkUJGAA6AKcjs.createInstantPresenceClock; exports.createMcpServer = _chunkY4BWZB6Jcjs.createMcpServer; exports.createRichTextToolProvider = createRichTextToolProvider; exports.createSpreadsheetToolProvider = createSpreadsheetToolProvider; exports.createToolRegistry = _chunkY4BWZB6Jcjs.createToolRegistry; exports.derivePlaybackSteps = _chunkX2HQP7DFcjs.derivePlaybackSteps; exports.elementToSvg = _chunkSVFEVKLFcjs.elementToSvg; exports.errorResult = _chunkY4BWZB6Jcjs.errorResult; exports.isUnsafeJsonKey = _chunk2BSBFBOAcjs.isUnsafeJsonKey; exports.listSkills = _chunkY4BWZB6Jcjs.listSkills; exports.normalizeSide = normalizeSide; exports.parseSkillFrontmatter = _chunkY4BWZB6Jcjs.parseSkillFrontmatter; exports.planAgentCommand = planAgentCommand; exports.planCanvasPlaybackSteps = planCanvasPlaybackSteps; exports.planCanvasToolPlayback = planCanvasToolPlayback; exports.planToolCall = planToolCall; exports.playbackRefsFromArgs = _chunkX2HQP7DFcjs.playbackRefsFromArgs; exports.playbackRefsFromResult = _chunkX2HQP7DFcjs.playbackRefsFromResult; exports.rasterizeElement = _chunkSVFEVKLFcjs.rasterizeElement; exports.readSkillFile = _chunkY4BWZB6Jcjs.readSkillFile; exports.readingTime = _chunkX2HQP7DFcjs.readingTime; exports.realPresenceClock = _chunkUJGAA6AKcjs.realPresenceClock; exports.resolveCaptureRequest = _chunkN2FGYZ4Qcjs.resolveCaptureRequest; exports.runToolScript = _chunkXH32BATEcjs.runToolScript; exports.searchTokens = _chunkY4BWZB6Jcjs.searchTokens; exports.searchTools = _chunkY4BWZB6Jcjs.searchTools; exports.stripPrototypeKeys = _chunk2BSBFBOAcjs.stripPrototypeKeys; exports.summarize = _chunkY4BWZB6Jcjs.summarize; exports.toCapturedImageData = _chunkN2FGYZ4Qcjs.toCapturedImageData; exports.toToolResult = _chunkY4BWZB6Jcjs.toToolResult; exports.toolCallToAgentCommand = toolCallToAgentCommand; exports.toolResultError = _chunkXH32BATEcjs.toolResultError; exports.toolResultValue = _chunkXH32BATEcjs.toolResultValue; exports.toolsetInstructions = _chunkY4BWZB6Jcjs.toolsetInstructions; exports.toolsetName = _chunkY4BWZB6Jcjs.toolsetName; exports.tweenPresenceCursor = _chunkUJGAA6AKcjs.tweenPresenceCursor; exports.unionCaptureRects = _chunkN2FGYZ4Qcjs.unionCaptureRects; exports.unionRects = _chunkX2HQP7DFcjs.unionRects; exports.unknownToolMessage = _chunkY4BWZB6Jcjs.unknownToolMessage; exports.validateAgentCommand = validateAgentCommand; exports.validateJsonSchema = _chunkWOFXZ3XUcjs.validateJsonSchema;

package/dist/agent/index.d.cts

@@ -4,3 +4,4 @@ export * from '../tools/index.cjs';
 export * from './providers.cjs';
 export * from './documentChartTools.cjs';
 export * from './componentTools.cjs';
+export * from './canvasPlayback.cjs';

package/dist/agent/index.d.ts

@@ -4,3 +4,4 @@ export * from '../tools/index.js';
 export * from './providers.js';
 export * from './documentChartTools.js';
 export * from './componentTools.js';
+export * from './canvasPlayback.js';