@pixerate/editor 0.10.0 → 0.11.0

package/dist/index.d.cts

@@ -9,8 +9,8 @@ export { Content, Editor, EditorOptions, Extensions } from '@tiptap/core';
 export { ASTNode, BinaryOpNode, CellCoordinate, CellData, CellDep, CellFormat, CellRange, CellRefNode, ColumnBinding, ColumnType, DataSourceBinder, DependencyGraph, EvaluationContext, FormulaEvaluator, FormulaParser, FormulaToken, FormulaTokenType, FunctionCallNode, LiteralNode, PropertyRefNode, RangeNode, RowType, SpreadsheetColumn, SpreadsheetController, SpreadsheetControllerOptions, SpreadsheetDataSource, SpreadsheetDataSourceField, SpreadsheetDocument, SpreadsheetRow, UnaryOpNode, colNameToIndex, extractCellDependencies, indexToColName, parseCellReference, parseFormula, parseRange, tokenizeFormula } from './spreadsheet/index.cjs';
 export { Command, HistoryManager, HistoryManagerOptions, HistoryState, MergedExecutionOptions, SnapshotCommandOptions, createHistoryManager } from './history/index.cjs';
 export { C as CanvasClipboardPayload, a as CanvasDockingCallbacks, b as CanvasEdge, c as CanvasLayoutOptions, d as CanvasNode, e as CollapseNodeOptions, D as DirectionalDisplacementOptions, f as DisplacementDirection, g as DockStrategy, E as ExplodeNodeOptions, h as ExplosionSnapshot, F as FanOutTrajectoryOptions, G as GraphDifferences, I as IncrementalLayoutOptions, N as NodeTransition, P as PlaceBesideOptions, i as Point, j as Position, R as Rect, k as ReflowDisplacementOptions, S as Side, T as TrajectoryFunction, l as TrajectoryPoint, X as XYPosition } from './types-lGtRobRV.cjs';
-export { DEFAULT_NODE_HEIGHT, DEFAULT_NODE_WIDTH, DEFAULT_PLACEMENT_GAP, StreamingLayoutManager, StreamingLayoutManagerOptions, boundsOf, calculateDagreReflowDisplacement, calculateDirectionalDisplacement, centerNodes, centre, computeNodesBoundingBox, createBezierTrajectory, createFanOutTrajectory, defaultEasing, ensureLayout, estimateNodeSize, flowSide, getCenteredNodePosition, getLayoutedNodes, isEventFromTextInput, isValidCanvasNode, isValidUrl, linearPositionTrajectory, linearTrajectory, overlaps, parseCanvasClipboardData, placeBeside, remapPastedNodes, repositionNodesTo, runMultiNodeTransition, serializeCanvasNodes } from './canvas/index.cjs';
-export { AgentCommand, AgentPresence, AgentStep, EDITOR_MCP_TOOLS, EditorSnapshot, MCP_TOOL_EDIT_CANVAS, MCP_TOOL_EDIT_PROMPT, MCP_TOOL_GET_EDITOR_STATE, planAgentCommand } from './agent/index.cjs';
+export { CanvasHeightOptions, Clock, DEFAULT_NODE_HEIGHT, DEFAULT_NODE_WIDTH, DEFAULT_PLACEMENT_GAP, ManualClock, StreamingLayoutManager, StreamingLayoutManagerOptions, blendLayout, boundsOf, calculateDagreReflowDisplacement, calculateDirectionalDisplacement, canvasHeight, centerNodes, centre, computeNodesBoundingBox, connectedOnly, createBezierTrajectory, createFanOutTrajectory, defaultEasing, ensureLayout, estimateCanvasHeight, estimateNodeSize, flowSide, getCenteredNodePosition, getLayoutedNodes, isEventFromTextInput, isValidCanvasNode, isValidUrl, layoutBounds, linearPositionTrajectory, linearTrajectory, overlaps, pageHidden, parseCanvasClipboardData, placeBeside, realClock, remapPastedNodes, repositionNodesTo, runMultiNodeTransition, serializeCanvasNodes } from './canvas/index.cjs';
+export { AgentCommand, AgentPresence, AgentStep, EDITOR_MCP_TOOLS, EXPORT_EXCLUDED_SELECTORS, EditorSnapshot, MCP_TOOL_EDIT_CANVAS, MCP_TOOL_EDIT_PROMPT, MCP_TOOL_GET_EDITOR_STATE, MCP_TOOL_VIEW_EDITOR, planAgentCommand } from './agent/index.cjs';
 export { MarkdownOptions } from 'tiptap-markdown';
 import '@tiptap/pm/view';
 import '@tiptap/pm/model';

package/dist/index.d.ts

@@ -9,8 +9,8 @@ export { Content, Editor, EditorOptions, Extensions } from '@tiptap/core';
 export { ASTNode, BinaryOpNode, CellCoordinate, CellData, CellDep, CellFormat, CellRange, CellRefNode, ColumnBinding, ColumnType, DataSourceBinder, DependencyGraph, EvaluationContext, FormulaEvaluator, FormulaParser, FormulaToken, FormulaTokenType, FunctionCallNode, LiteralNode, PropertyRefNode, RangeNode, RowType, SpreadsheetColumn, SpreadsheetController, SpreadsheetControllerOptions, SpreadsheetDataSource, SpreadsheetDataSourceField, SpreadsheetDocument, SpreadsheetRow, UnaryOpNode, colNameToIndex, extractCellDependencies, indexToColName, parseCellReference, parseFormula, parseRange, tokenizeFormula } from './spreadsheet/index.js';
 export { Command, HistoryManager, HistoryManagerOptions, HistoryState, MergedExecutionOptions, SnapshotCommandOptions, createHistoryManager } from './history/index.js';
 export { C as CanvasClipboardPayload, a as CanvasDockingCallbacks, b as CanvasEdge, c as CanvasLayoutOptions, d as CanvasNode, e as CollapseNodeOptions, D as DirectionalDisplacementOptions, f as DisplacementDirection, g as DockStrategy, E as ExplodeNodeOptions, h as ExplosionSnapshot, F as FanOutTrajectoryOptions, G as GraphDifferences, I as IncrementalLayoutOptions, N as NodeTransition, P as PlaceBesideOptions, i as Point, j as Position, R as Rect, k as ReflowDisplacementOptions, S as Side, T as TrajectoryFunction, l as TrajectoryPoint, X as XYPosition } from './types-lGtRobRV.js';
-export { DEFAULT_NODE_HEIGHT, DEFAULT_NODE_WIDTH, DEFAULT_PLACEMENT_GAP, StreamingLayoutManager, StreamingLayoutManagerOptions, boundsOf, calculateDagreReflowDisplacement, calculateDirectionalDisplacement, centerNodes, centre, computeNodesBoundingBox, createBezierTrajectory, createFanOutTrajectory, defaultEasing, ensureLayout, estimateNodeSize, flowSide, getCenteredNodePosition, getLayoutedNodes, isEventFromTextInput, isValidCanvasNode, isValidUrl, linearPositionTrajectory, linearTrajectory, overlaps, parseCanvasClipboardData, placeBeside, remapPastedNodes, repositionNodesTo, runMultiNodeTransition, serializeCanvasNodes } from './canvas/index.js';
-export { AgentCommand, AgentPresence, AgentStep, EDITOR_MCP_TOOLS, EditorSnapshot, MCP_TOOL_EDIT_CANVAS, MCP_TOOL_EDIT_PROMPT, MCP_TOOL_GET_EDITOR_STATE, planAgentCommand } from './agent/index.js';
+export { CanvasHeightOptions, Clock, DEFAULT_NODE_HEIGHT, DEFAULT_NODE_WIDTH, DEFAULT_PLACEMENT_GAP, ManualClock, StreamingLayoutManager, StreamingLayoutManagerOptions, blendLayout, boundsOf, calculateDagreReflowDisplacement, calculateDirectionalDisplacement, canvasHeight, centerNodes, centre, computeNodesBoundingBox, connectedOnly, createBezierTrajectory, createFanOutTrajectory, defaultEasing, ensureLayout, estimateCanvasHeight, estimateNodeSize, flowSide, getCenteredNodePosition, getLayoutedNodes, isEventFromTextInput, isValidCanvasNode, isValidUrl, layoutBounds, linearPositionTrajectory, linearTrajectory, overlaps, pageHidden, parseCanvasClipboardData, placeBeside, realClock, remapPastedNodes, repositionNodesTo, runMultiNodeTransition, serializeCanvasNodes } from './canvas/index.js';
+export { AgentCommand, AgentPresence, AgentStep, EDITOR_MCP_TOOLS, EXPORT_EXCLUDED_SELECTORS, EditorSnapshot, MCP_TOOL_EDIT_CANVAS, MCP_TOOL_EDIT_PROMPT, MCP_TOOL_GET_EDITOR_STATE, MCP_TOOL_VIEW_EDITOR, planAgentCommand } from './agent/index.js';
 export { MarkdownOptions } from 'tiptap-markdown';
 import '@tiptap/pm/view';
 import '@tiptap/pm/model';

package/dist/index.js

@@ -4453,6 +4453,79 @@ function placeBeside(rects, size, side, nearNodeId, options = {}) {
   };
 }
 
+// src/canvas/clock.ts
+var pageHidden = () => typeof document !== "undefined" && document.hidden;
+var realClock = {
+  live: true,
+  now: () => typeof performance !== "undefined" ? performance.now() : Date.now(),
+  frame: () => new Promise((resolve) => {
+    if (typeof requestAnimationFrame === "function" && !pageHidden()) {
+      requestAnimationFrame(() => resolve());
+    } else {
+      setTimeout(resolve, 16);
+    }
+  }),
+  sleep: (ms) => new Promise((resolve) => setTimeout(resolve, Math.max(0, ms)))
+};
+var settle = () => new Promise((resolve) => setTimeout(resolve, 0));
+var ManualClock = class {
+  live = false;
+  time;
+  frames = [];
+  sleepers = [];
+  seq = 0;
+  constructor(start = 0) {
+    this.time = start;
+  }
+  now() {
+    return this.time;
+  }
+  frame() {
+    return new Promise((resolve) => this.frames.push(resolve));
+  }
+  sleep(ms) {
+    return new Promise(
+      (resolve) => this.sleepers.push({
+        at: this.time + Math.max(0, ms),
+        seq: this.seq++,
+        resolve
+      })
+    );
+  }
+  /** Whether any frames or sleep timers are currently pending. */
+  get pending() {
+    return this.frames.length > 0 || this.sleepers.length > 0;
+  }
+  /** Advances time by `ms`, resolving due sleep timers in order, followed by queued frames. */
+  async advance(ms) {
+    const end = this.time + Math.max(0, ms);
+    await settle();
+    while (true) {
+      let next;
+      for (const s of this.sleepers) {
+        if (s.at <= end && (!next || s.at < next.at || s.at === next.at && s.seq < next.seq)) {
+          next = s;
+        }
+      }
+      if (!next) break;
+      this.sleepers.splice(this.sleepers.indexOf(next), 1);
+      this.time = Math.max(this.time, next.at);
+      next.resolve();
+      await settle();
+    }
+    this.time = end;
+    const dueFrames = this.frames.splice(0, this.frames.length);
+    for (const resolveFrame of dueFrames) {
+      resolveFrame();
+    }
+    await settle();
+  }
+  /** Convenience method to advance by 1 frame at a given fps (default: 60fps = 16.67ms). */
+  async tick(fps = 60) {
+    await this.advance(Math.round(1e3 / fps));
+  }
+};
+
 // src/canvas/trajectory.ts
 var defaultEasing = (t) => --t * t * t + 1;
 var linearTrajectory = (origin, target, progress) => {
@@ -4520,9 +4593,15 @@ function runMultiNodeTransition(transitions, options = {}) {
     return () => {
     };
   }
-  const { defaultDuration = 400, defaultEasing: easingFunc = defaultEasing, onUpdate, onComplete } = options;
+  const {
+    defaultDuration = 400,
+    defaultEasing: easingFunc = defaultEasing,
+    clock = realClock,
+    onUpdate,
+    onComplete
+  } = options;
   let isCancelled = false;
-  const startTime = Date.now();
+  const startTime = clock.now();
   const items = transitions.map((tr, i) => ({
     ...tr,
     index: tr.index ?? i,
@@ -4534,7 +4613,7 @@ function runMultiNodeTransition(transitions, options = {}) {
   }));
   function frame() {
     if (isCancelled) return;
-    const now = Date.now();
+    const now = clock.now();
     let allCompleted = true;
     for (let i = 0; i < items.length; i++) {
       const item = items[i];
@@ -4566,9 +4645,7 @@ function runMultiNodeTransition(transitions, options = {}) {
     }
     onUpdate?.();
     if (!allCompleted) {
-      if (typeof requestAnimationFrame !== "undefined") {
-        requestAnimationFrame(frame);
-      }
+      clock.frame().then(frame);
     } else {
       onComplete?.();
     }
@@ -4846,10 +4923,76 @@ function repositionNodesTo(nodes, targetOrigin) {
   }));
 }
 
+// src/canvas/view.ts
+function clampHeight(contentHeight, options = {}) {
+  const { min = 320, max = 560, padding = 48 } = options;
+  return Math.round(Math.min(max, Math.max(min, contentHeight + padding)));
+}
+function layoutBounds(nodes) {
+  if (nodes.length === 0) return null;
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  for (const node of nodes) {
+    const x = node.position.x;
+    const y = node.position.y;
+    const width = node.width ?? 180;
+    const height = node.height ?? 80;
+    minX = Math.min(minX, x);
+    minY = Math.min(minY, y);
+    maxX = Math.max(maxX, x + width);
+    maxY = Math.max(maxY, y + height);
+  }
+  if (minX === Infinity) return null;
+  return { x: minX, y: minY, width: maxX - minX, height: maxY - minY };
+}
+function canvasHeight(nodes, options) {
+  return clampHeight(layoutBounds(nodes)?.height ?? 0, options);
+}
+var DEFAULT_RANK_HEIGHT = 80 + 72;
+var NODES_PER_RANK = 2;
+function estimateCanvasHeight(nodes, edges, options) {
+  const ranks = Math.max(1, Math.ceil(nodes.length / NODES_PER_RANK));
+  return clampHeight(ranks * DEFAULT_RANK_HEIGHT, options);
+}
+function mix(a, b, t) {
+  return a + (b - a) * t;
+}
+function blendLayout(from, to, t) {
+  if (t >= 1) return to;
+  const fromMap = new Map(from.map((n) => [n.id, n]));
+  return to.map((target) => {
+    const origin = fromMap.get(target.id);
+    if (!origin) return target;
+    return {
+      ...target,
+      position: {
+        x: mix(origin.position.x, target.position.x, t),
+        y: mix(origin.position.y, target.position.y, t)
+      },
+      width: origin.width !== void 0 && target.width !== void 0 ? mix(origin.width, target.width, t) : target.width,
+      height: origin.height !== void 0 && target.height !== void 0 ? mix(origin.height, target.height, t) : target.height
+    };
+  });
+}
+function connectedOnly(nodes, edges) {
+  if (edges.length === 0) return nodes;
+  const linkedNodeIds = /* @__PURE__ */ new Set();
+  for (const edge of edges) {
+    linkedNodeIds.add(edge.source);
+    linkedNodeIds.add(edge.target);
+  }
+  const filtered = nodes.filter((node) => linkedNodeIds.has(node.id));
+  return filtered.length > 0 ? filtered : nodes;
+}
+
 // src/canvas/streaming.ts
 var StreamingLayoutManager = class {
   throttleMs;
   glideDurationMs;
+  connectedOnly;
+  clock;
   layoutOptions;
   onLayoutUpdated;
   pendingTimer = null;
@@ -4858,6 +5001,8 @@ var StreamingLayoutManager = class {
   constructor(options = {}) {
     this.throttleMs = options.throttleMs ?? 200;
     this.glideDurationMs = options.glideDurationMs ?? 300;
+    this.connectedOnly = options.connectedOnly ?? false;
+    this.clock = options.clock ?? realClock;
     this.layoutOptions = options.layoutOptions ?? { direction: "LR" };
     this.onLayoutUpdated = options.onLayoutUpdated;
   }
@@ -4885,7 +5030,8 @@ var StreamingLayoutManager = class {
     this.recalculateAndGlide(nodes, edges, currentPositions);
   }
   recalculateAndGlide(nodes, edges, currentPositions) {
-    if (nodes.length === 0) return;
+    const targetNodes = this.connectedOnly ? connectedOnly(nodes, edges) : nodes;
+    if (targetNodes.length === 0) return;
     if (this.activeTransitionCancel) {
       this.activeTransitionCancel();
       this.activeTransitionCancel = null;
@@ -4894,7 +5040,7 @@ var StreamingLayoutManager = class {
     for (const [id, pos] of currentPositions.entries()) {
       stored[id] = pos;
     }
-    const layouted = ensureLayout(nodes, edges, {
+    const layouted = ensureLayout(targetNodes, edges, {
       ...this.layoutOptions,
       storedPositions: stored
     });
@@ -4918,6 +5064,7 @@ var StreamingLayoutManager = class {
     this.targetPositions = nextPositions;
     if (transitions.length > 0) {
       this.activeTransitionCancel = runMultiNodeTransition(transitions, {
+        clock: this.clock,
         onUpdate: () => {
           const liveMap = new Map(currentPositions);
           for (const trans of transitions) {
@@ -5125,6 +5272,24 @@ function planAgentCommand(command, snapshot, options = {}) {
         }
       ];
     }
+    case "choreography:say": {
+      return [
+        {
+          type: "step:say",
+          text: command.text,
+          atNodeId: command.atNodeId,
+          position: command.position
+        }
+      ];
+    }
+    case "choreography:wait": {
+      return [
+        {
+          type: "step:wait",
+          ms: command.ms
+        }
+      ];
+    }
     default: {
       return [];
     }
@@ -5249,10 +5414,39 @@ var MCP_TOOL_EDIT_PROMPT = {
     required: ["operation"]
   }
 };
+var MCP_TOOL_VIEW_EDITOR = {
+  name: "view_editor",
+  description: "Captures a visual image snapshot (JPEG or PNG) of the editor canvas or viewport for multimodal evaluation. Active agent cursor indicators are automatically excluded from the snapshot.",
+  inputSchema: {
+    type: "object",
+    properties: {
+      scope: {
+        type: "string",
+        enum: ["viewport", "canvas"],
+        description: "Whether to capture only the visible viewport or the full canvas bounding box (default: viewport)."
+      },
+      format: {
+        type: "string",
+        enum: ["jpeg", "png"],
+        description: "Image format of the base64 snapshot (default: jpeg)."
+      },
+      maxEdge: {
+        type: "integer",
+        description: "Maximum width or height dimension in pixels (default: 1024)."
+      }
+    }
+  }
+};
+var EXPORT_EXCLUDED_SELECTORS = [
+  ".pixerate-presence",
+  ".agent-presence",
+  ".ursula-presence"
+];
 var EDITOR_MCP_TOOLS = [
   MCP_TOOL_GET_EDITOR_STATE,
   MCP_TOOL_EDIT_CANVAS,
-  MCP_TOOL_EDIT_PROMPT
+  MCP_TOOL_EDIT_PROMPT,
+  MCP_TOOL_VIEW_EDITOR
 ];
 export {
   ColorHighlighter,
@@ -5263,6 +5457,7 @@ export {
   DependencyGraph,
   DirtyTracker,
   EDITOR_MCP_TOOLS,
+  EXPORT_EXCLUDED_SELECTORS,
   EditorController,
   FontSize,
   FormulaEvaluator,
@@ -5276,7 +5471,9 @@ export {
   MCP_TOOL_EDIT_CANVAS,
   MCP_TOOL_EDIT_PROMPT,
   MCP_TOOL_GET_EDITOR_STATE,
+  MCP_TOOL_VIEW_EDITOR,
   MENTION_REGEX,
+  ManualClock,
   Markdown2 as Markdown,
   Mention,
   SlashCommands,
@@ -5286,13 +5483,16 @@ export {
   TEMPLATE_REGEX,
   TemplateSuggestions,
   VARIABLE_REGEX,
+  blendLayout,
   boundsOf,
   calculateDagreReflowDisplacement,
   calculateDirectionalDisplacement,
+  canvasHeight,
   centerNodes,
   centre,
   colNameToIndex,
   computeNodesBoundingBox,
+  connectedOnly,
   createBezierTrajectory,
   createDirtyTracker,
   createEditor,
@@ -5304,6 +5504,7 @@ export {
   defaultIsEqual,
   ensureLayout,
   escapeHtml,
+  estimateCanvasHeight,
   estimateNodeSize,
   extractCellDependencies,
   extractInstructionNames,
@@ -5327,12 +5528,14 @@ export {
   isEventFromTextInput,
   isValidCanvasNode,
   isValidUrl,
+  layoutBounds,
   linearPositionTrajectory,
   linearTrajectory,
   mapRawOffsetToResolved,
   mapResolvedOffsetToRaw,
   markdownToTipTapHtml,
   overlaps,
+  pageHidden,
   parseCanvasClipboardData,
   parseCellReference,
   parseFormula,
@@ -5343,6 +5546,7 @@ export {
   planAgentCommand,
   preprocessMarkdownFileLinks,
   preprocessMarkdownMentions,
+  realClock,
   remapPastedNodes,
   removeImageNode,
   repositionNodesTo,