@pixerate/editor 0.181.0 → 0.183.0

package/dist/image-editor/index.js

@@ -3105,7 +3105,7 @@ function hueRange(pixels, center) {
 
 // src/image-editor/selection/segmentation.ts
 var isPoint = (p) => !!p && typeof p === "object" && Number.isFinite(p.x) && Number.isFinite(p.y);
-function polygonsOf(result) {
+function segmentationOutlines(result) {
   const p = result.polygon;
   if (!Array.isArray(p) || !p.length) return [];
   const rings = Array.isArray(p[0]) ? p : [p];
@@ -3113,7 +3113,7 @@ function polygonsOf(result) {
 }
 function segmentToSelection(width, height, result) {
   let out = null;
-  for (const ring of polygonsOf(result)) {
+  for (const ring of segmentationOutlines(result)) {
     out = combineSelections(out, polygonSelection(width, height, ring), "add");
   }
   if (result.mask && result.mask.width > 0 && result.mask.height > 0) {
@@ -7719,6 +7719,15 @@ var ImageEditorController = class {
       return { label: r.label || description, bounds: one?.bounds ?? null, ...r.score !== void 0 ? { score: r.score } : {} };
     });
     const mask = segmentsToSelection(width, height, decoded);
+    if (mask && options.beforeApply) {
+      const outlines = decoded.flatMap((r, i) => {
+        const rings = segmentationOutlines(r);
+        const b = segments[i]?.bounds;
+        return rings.length ? rings : b ? [[{ x: b.x, y: b.y }, { x: b.x + b.width, y: b.y }, { x: b.x + b.width, y: b.y + b.height }, { x: b.x, y: b.y + b.height }]] : [];
+      });
+      await options.beforeApply(outlines);
+      options.signal?.throwIfAborted();
+    }
     if (mask) this.shapeCommand(mask, options);
     return { segments: segments.filter((s) => s.bounds) };
   }
@@ -10134,20 +10143,24 @@ function createImagePlaybackLocator(controller) {
 }
 var num = (v) => typeof v === "number" && Number.isFinite(v);
 var isPoint2 = (p) => !!p && typeof p === "object" && num(p.x) && num(p.y);
-function trace(points, max = 32) {
+function trace(points, max = 32, ms = 900) {
   const list = points.length <= max ? points : Array.from({ length: max }, (_, i) => points[Math.round(i * (points.length - 1) / (max - 1))]);
   if (!list.length) return [];
   if (list.length === 1) return [{ type: "move", to: list[0] }, { type: "press" }, { type: "release" }];
   let total = 0;
   for (let i = 1; i < list.length; i++) total += Math.hypot(list[i].x - list[i - 1].x, list[i].y - list[i - 1].y);
-  const ms = (i) => total > 0 ? Math.max(16, 900 * Math.hypot(list[i].x - list[i - 1].x, list[i].y - list[i - 1].y) / total) : 16;
+  const stepMs = (i) => total > 0 ? Math.max(16, ms * Math.hypot(list[i].x - list[i - 1].x, list[i].y - list[i - 1].y) / total) : 16;
   return [
     { type: "move", to: list[0] },
-    { type: "press" },
-    ...list.slice(1).map((to, i) => ({ type: "drag", to, ms: ms(i + 1) })),
+    { type: "press", gesture: "path" },
+    ...list.slice(1).map((to, i) => ({ type: "drag", to, ms: stepMs(i + 1) })),
     { type: "release" }
   ];
 }
+function planOutlineTrace(outlines, options = {}) {
+  const rings = outlines.map((ring) => ring.filter(isPoint2)).filter((ring) => ring.length >= 3);
+  return rings.slice(0, options.maxOutlines ?? 4).flatMap((ring) => trace([...ring, ring[0]], options.maxPoints ?? 32, rings.length > 1 ? 700 : 1100));
+}
 function boxOf(args) {
   for (const o of [args, args.shape, args.box, args.rect, args.bounds]) {
     if (!o || typeof o !== "object") continue;
@@ -10197,6 +10210,7 @@ function withImagePlayback(provider, surface) {
 }
 function agentDragDraft(mode, box, image) {
   if (mode === "select") {
+    if ("gesture" in box && box.gesture === "path" && box.path.length >= 2) return { selectionPath: box.path.map((p) => ({ x: p.x, y: p.y })) };
     return {
       selectionPath: [
         { x: box.x, y: box.y },
@@ -10522,12 +10536,16 @@ function createImageSubjectSelectionTool(controller) {
       additionalProperties: false
     },
     annotations: { ...writeAnnotations("Select a subject"), openWorldHint: true },
-    handler: async ({ target, maxSegments, mode, feather }) => {
+    handler: async ({ target, maxSegments, mode, feather }, context) => {
       if (typeof target !== "string" || !target.trim()) throw new Error("target must describe what to select.");
+      const perform = context?.perform;
       const { segments } = await controller.selectSubject(target, {
         mode: parseSelectionMode(mode),
         feather: num2(feather, 0),
-        maxSegments: typeof maxSegments === "number" ? Math.max(1, Math.round(maxSegments)) : void 0
+        maxSegments: typeof maxSegments === "number" ? Math.max(1, Math.round(maxSegments)) : void 0,
+        signal: context?.signal,
+        // Under playback the cursor traces what the model found, as a lasso, before it is selected.
+        beforeApply: perform ? (outlines) => perform(planOutlineTrace(outlines)) : void 0
       });
       return { ...summary(controller), found: segments };
     }
@@ -16665,6 +16683,7 @@ export {
   placementBounds,
   placementGeometry,
   planImageToolPlayback,
+  planOutlineTrace,
   pngDataUrl,
   pointerPressure,
   pointerStrokeSample,
@@ -16763,6 +16782,7 @@ export {
   seamlessClone,
   seedFromString,
   segmentToSelection,
+  segmentationOutlines,
   segmentsToSelection,
   selectionArea,
   selectionFromCoverage,

package/dist/image-editor/playback.d.cts

@@ -1,6 +1,6 @@
 import type { AgentToolProvider } from '../tools/registry.cjs';
 import type { PlaybackPoint, PlaybackRect, PlaybackRef, PlaybackStep } from '../tools/playback.cjs';
-import type { PresenceDragBox } from '../tools/presence.cjs';
+import type { PresenceDrag, PresenceDragBox } from '../tools/presence.cjs';
 import type { ImageEditorController } from './controller.cjs';
 /** The playback kind of an image layer (`{ kind: 'layer', id }`, as in `data-layer-id`). */
 export declare const IMAGE_PLAYBACK_KIND = "layer";
@@ -10,6 +10,15 @@ export type ImagePlaybackPanel = 'crop' | 'adjust' | 'layers' | 'paint' | 'selec
 export declare function imagePlaybackPanel(tool: string): ImagePlaybackPanel | null;
 /** Finds `{ kind: 'layer', id }` (the layer's pixels, in document pixels) for agent playback. */
 export declare function createImagePlaybackLocator(controller: Pick<ImageEditorController, 'getLayerBounds'>): (ref: PlaybackRef) => PlaybackRect | null;
+/**
+ * Cursor steps that trace closed outlines (document pixels) as lasso drags, one after another: how
+ * playback shows a selection whose shape a tool learns mid-call (`select_subject`, through
+ * `context.perform`). Long outlines are thinned to `maxPoints`; at most `maxOutlines` are traced.
+ */
+export declare function planOutlineTrace(outlines: readonly (readonly PlaybackPoint[])[], options?: {
+    maxOutlines?: number;
+    maxPoints?: number;
+}): PlaybackStep[];
 /**
  * The cursor steps for one image tool call (by bare name), or null to fall back to the ids it names.
  * Steps open the tool's panel first, then act on the canvas or on the panel's controls.
@@ -23,10 +32,11 @@ export declare function planImageToolPlayback(tool: string, args: Record<string,
 export declare function withImagePlayback(provider: AgentToolProvider, surface?: string): AgentToolProvider;
 /**
  * What a canvas draws while an agent drags on it (see `trackPresenceDrag`): in crop mode, the crop
- * box being pulled out (clamped to the image); in select mode, the marquee as a selection path.
- * The tool call that follows sets the real crop or selection.
+ * box being pulled out (clamped to the image); in select mode, the lasso traced so far (a drag
+ * with the `path` gesture) or else the marquee, as a selection path. The tool call that follows
+ * sets the real crop or selection.
  */
-export declare function agentDragDraft(mode: string, box: PresenceDragBox, image: {
+export declare function agentDragDraft(mode: string, box: PresenceDragBox | PresenceDrag, image: {
     width: number;
     height: number;
 }): {

package/dist/image-editor/playback.d.ts

@@ -1,6 +1,6 @@
 import type { AgentToolProvider } from '../tools/registry.js';
 import type { PlaybackPoint, PlaybackRect, PlaybackRef, PlaybackStep } from '../tools/playback.js';
-import type { PresenceDragBox } from '../tools/presence.js';
+import type { PresenceDrag, PresenceDragBox } from '../tools/presence.js';
 import type { ImageEditorController } from './controller.js';
 /** The playback kind of an image layer (`{ kind: 'layer', id }`, as in `data-layer-id`). */
 export declare const IMAGE_PLAYBACK_KIND = "layer";
@@ -10,6 +10,15 @@ export type ImagePlaybackPanel = 'crop' | 'adjust' | 'layers' | 'paint' | 'selec
 export declare function imagePlaybackPanel(tool: string): ImagePlaybackPanel | null;
 /** Finds `{ kind: 'layer', id }` (the layer's pixels, in document pixels) for agent playback. */
 export declare function createImagePlaybackLocator(controller: Pick<ImageEditorController, 'getLayerBounds'>): (ref: PlaybackRef) => PlaybackRect | null;
+/**
+ * Cursor steps that trace closed outlines (document pixels) as lasso drags, one after another: how
+ * playback shows a selection whose shape a tool learns mid-call (`select_subject`, through
+ * `context.perform`). Long outlines are thinned to `maxPoints`; at most `maxOutlines` are traced.
+ */
+export declare function planOutlineTrace(outlines: readonly (readonly PlaybackPoint[])[], options?: {
+    maxOutlines?: number;
+    maxPoints?: number;
+}): PlaybackStep[];
 /**
  * The cursor steps for one image tool call (by bare name), or null to fall back to the ids it names.
  * Steps open the tool's panel first, then act on the canvas or on the panel's controls.
@@ -23,10 +32,11 @@ export declare function planImageToolPlayback(tool: string, args: Record<string,
 export declare function withImagePlayback(provider: AgentToolProvider, surface?: string): AgentToolProvider;
 /**
  * What a canvas draws while an agent drags on it (see `trackPresenceDrag`): in crop mode, the crop
- * box being pulled out (clamped to the image); in select mode, the marquee as a selection path.
- * The tool call that follows sets the real crop or selection.
+ * box being pulled out (clamped to the image); in select mode, the lasso traced so far (a drag
+ * with the `path` gesture) or else the marquee, as a selection path. The tool call that follows
+ * sets the real crop or selection.
  */
-export declare function agentDragDraft(mode: string, box: PresenceDragBox, image: {
+export declare function agentDragDraft(mode: string, box: PresenceDragBox | PresenceDrag, image: {
     width: number;
     height: number;
 }): {

package/dist/image-editor/selection/segmentation.d.cts

@@ -40,6 +40,9 @@ export interface SegmentationProvider {
 export type DecodedSegmentationResult = Omit<SegmentationResult, 'mask'> & {
     mask?: PixelBuffer;
 };
+/** A result's polygons as lists of at least three points. */
+/** A result's polygon outlines (rings of at least 3 points), in image pixels. */
+export declare function segmentationOutlines(result: Pick<SegmentationResult, 'polygon'>): ImagePoint[][];
 /**
  * One segmentation result as a selection over a `width × height` image, or null when it has no
  * usable shape. Polygons are anti-aliased; several polygons and a mask are added together.

package/dist/image-editor/selection/segmentation.d.ts

@@ -40,6 +40,9 @@ export interface SegmentationProvider {
 export type DecodedSegmentationResult = Omit<SegmentationResult, 'mask'> & {
     mask?: PixelBuffer;
 };
+/** A result's polygons as lists of at least three points. */
+/** A result's polygon outlines (rings of at least 3 points), in image pixels. */
+export declare function segmentationOutlines(result: Pick<SegmentationResult, 'polygon'>): ImagePoint[][];
 /**
  * One segmentation result as a selection over a `width × height` image, or null when it has no
  * usable shape. Polygons are anti-aliased; several polygons and a mask are added together.

package/dist/paint-editor/index.cjs

@@ -53,7 +53,7 @@ var _chunkJLWLX52Lcjs = require('../chunk-JLWLX52L.cjs');
 
 
 
-var _chunkSWTUM32Hcjs = require('../chunk-SWTUM32H.cjs');
+var _chunkK7ENM55Pcjs = require('../chunk-K7ENM55P.cjs');
 require('../chunk-EGZM52EO.cjs');
 
 
@@ -6006,7 +6006,7 @@ function resampleInto(src, rect, width, height) {
 }
 
 // src/paint-editor/presence.ts
-var PaintPresence = class extends _chunkSWTUM32Hcjs.PresenceStore {
+var PaintPresence = class extends _chunkK7ENM55Pcjs.PresenceStore {
 };
 var FRAME = 16;
 function strokeSchedule(points) {
@@ -6050,8 +6050,8 @@ var PaintDirector = class {
     this.controller = controller;
     this.presence = presence;
     this.options = options;
-    this.clock = _nullishCoalesce(options.clock, () => ( _chunkSWTUM32Hcjs.realPresenceClock));
-    this.queue = new (0, _chunkSWTUM32Hcjs.PerformanceQueue)(presence, { clock: this.clock, linger: options.linger });
+    this.clock = _nullishCoalesce(options.clock, () => ( _chunkK7ENM55Pcjs.realPresenceClock));
+    this.queue = new (0, _chunkK7ENM55Pcjs.PerformanceQueue)(presence, { clock: this.clock, linger: options.linger });
   }
   
   
@@ -6086,7 +6086,7 @@ var PaintDirector = class {
       this.presence.set({ id, x: to.x, y: to.y });
       return;
     }
-    await _chunkSWTUM32Hcjs.tweenPresenceCursor.call(void 0, this.presence, this.clock, id, this.where(id), to, this.ms(ms));
+    await _chunkK7ENM55Pcjs.tweenPresenceCursor.call(void 0, this.presence, this.clock, id, this.where(id), to, this.ms(ms));
   }
   async say(id, text, ms) {
     if (!text) return;
@@ -6116,7 +6116,7 @@ var PaintDirector = class {
         await this.glide(id, path[0]);
         this.presence.set({ id, pressed: true });
         try {
-          for (let i = 1; i < path.length; i++) await _chunkSWTUM32Hcjs.tweenPresenceCursor.call(void 0, this.presence, this.clock, id, path[i - 1], path[i], this.ms(i % 2 ? 260 : 90));
+          for (let i = 1; i < path.length; i++) await _chunkK7ENM55Pcjs.tweenPresenceCursor.call(void 0, this.presence, this.clock, id, path[i - 1], path[i], this.ms(i % 2 ? 260 : 90));
         } finally {
           this.presence.set({ id, pressed: false });
         }

package/dist/paint-editor/index.js

@@ -53,7 +53,7 @@ import {
   PresenceStore,
   realPresenceClock,
   tweenPresenceCursor
-} from "../chunk-O2ANJFUF.js";
+} from "../chunk-IVSWRVB4.js";
 import "../chunk-LPIKXPBM.js";
 import {
   BRUSH_ID,

package/dist/tools/index.cjs

@@ -8,7 +8,7 @@
 
 
 
-var _chunkNJGFSOPPcjs = require('../chunk-NJGFSOPP.cjs');
+var _chunkU4QN36YTcjs = require('../chunk-U4QN36YT.cjs');
 
 
 
@@ -46,7 +46,7 @@ var _chunkAMX23CSNcjs = require('../chunk-AMX23CSN.cjs');
 
 
 
-var _chunk5EMS4BZGcjs = require('../chunk-5EMS4BZG.cjs');
+var _chunk3SLBXKAWcjs = require('../chunk-3SLBXKAW.cjs');
 
 
 
@@ -92,7 +92,7 @@ var _chunkN2FGYZ4Qcjs = require('../chunk-N2FGYZ4Q.cjs');
 
 
 
-var _chunkSWTUM32Hcjs = require('../chunk-SWTUM32H.cjs');
+var _chunkK7ENM55Pcjs = require('../chunk-K7ENM55P.cjs');
 
 
 var _chunkWOFXZ3XUcjs = require('../chunk-WOFXZ3XU.cjs');
@@ -189,4 +189,4 @@ var _chunk2BSBFBOAcjs = require('../chunk-2BSBFBOA.cjs');
 
 
 
-exports.AgentPlayback = _chunk5EMS4BZGcjs.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 = _chunkAMX23CSNcjs.JSON_RPC_ERRORS; exports.MCP_PROTOCOL_VERSIONS = _chunkAMX23CSNcjs.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 = _chunkSWTUM32Hcjs.PRESENCE_COLORS; exports.PerformanceQueue = _chunkSWTUM32Hcjs.PerformanceQueue; exports.PresenceStore = _chunkSWTUM32Hcjs.PresenceStore; exports.TOOL_BRIDGE_DEFAULT_PORT = _chunkAMX23CSNcjs.TOOL_BRIDGE_DEFAULT_PORT; exports.TOOL_BRIDGE_PROTOCOL = _chunkAMX23CSNcjs.TOOL_BRIDGE_PROTOCOL; exports.TOOL_DISCOVERY_TOOLS = _chunkAMX23CSNcjs.TOOL_DISCOVERY_TOOLS; exports.TOOL_NAMESPACE_SEPARATOR = _chunkAMX23CSNcjs.TOOL_NAMESPACE_SEPARATOR; exports.ToolRegistry = _chunkAMX23CSNcjs.ToolRegistry; exports.ToolRegistryError = _chunkAMX23CSNcjs.ToolRegistryError; exports.ToolRegistryView = _chunkAMX23CSNcjs.ToolRegistryView; exports.UNSAFE_JSON_KEYS = _chunk2BSBFBOAcjs.UNSAFE_JSON_KEYS; exports.baseToolName = _chunkAMX23CSNcjs.baseToolName; exports.captureInputSchema = _chunkN2FGYZ4Qcjs.captureInputSchema; exports.captureOutputSize = _chunkN2FGYZ4Qcjs.captureOutputSize; exports.cloneElementWithStyles = _chunkSVFEVKLFcjs.cloneElementWithStyles; exports.connectToolBridge = _chunkAMX23CSNcjs.connectToolBridge; exports.createAgentPlayback = _chunk5EMS4BZGcjs.createAgentPlayback; exports.createCaptureTool = _chunkN2FGYZ4Qcjs.createCaptureTool; exports.createCaptureToolProvider = _chunkN2FGYZ4Qcjs.createCaptureToolProvider; exports.createElementCaptureSurface = _chunkSVFEVKLFcjs.createElementCaptureSurface; exports.createInstantPresenceClock = _chunkSWTUM32Hcjs.createInstantPresenceClock; exports.createMcpServer = _chunkAMX23CSNcjs.createMcpServer; exports.createPlaybackToolProvider = _chunk5EMS4BZGcjs.createPlaybackToolProvider; exports.createStyleResolver = _chunkNJGFSOPPcjs.createStyleResolver; exports.createStyleToolProvider = _chunkNJGFSOPPcjs.createStyleToolProvider; exports.createToolRegistry = _chunkAMX23CSNcjs.createToolRegistry; exports.derivePlaybackSteps = _chunk5EMS4BZGcjs.derivePlaybackSteps; exports.elementToSvg = _chunkSVFEVKLFcjs.elementToSvg; exports.errorResult = _chunkAMX23CSNcjs.errorResult; exports.isUnsafeJsonKey = _chunk2BSBFBOAcjs.isUnsafeJsonKey; exports.listSkills = _chunkAMX23CSNcjs.listSkills; exports.locatePlaybackChrome = _chunk5EMS4BZGcjs.locatePlaybackChrome; exports.memoryStyleStore = _chunkNJGFSOPPcjs.memoryStyleStore; exports.parseSkillFrontmatter = _chunkAMX23CSNcjs.parseSkillFrontmatter; exports.parseStyleDomains = _chunkNJGFSOPPcjs.parseStyleDomains; exports.playbackRectFromClient = _chunk5EMS4BZGcjs.playbackRectFromClient; exports.playbackRefsFromArgs = _chunk5EMS4BZGcjs.playbackRefsFromArgs; exports.playbackRefsFromResult = _chunk5EMS4BZGcjs.playbackRefsFromResult; exports.rasterizeElement = _chunkSVFEVKLFcjs.rasterizeElement; exports.readSkillFile = _chunkAMX23CSNcjs.readSkillFile; exports.readingTime = _chunk5EMS4BZGcjs.readingTime; exports.realPresenceClock = _chunkSWTUM32Hcjs.realPresenceClock; exports.renderStyle = _chunkNJGFSOPPcjs.renderStyle; exports.resolveCaptureRequest = _chunkN2FGYZ4Qcjs.resolveCaptureRequest; exports.runStyleChecks = _chunkNJGFSOPPcjs.runStyleChecks; exports.runToolScript = _chunkNJGFSOPPcjs.runToolScript; exports.searchTokens = _chunkAMX23CSNcjs.searchTokens; exports.searchTools = _chunkAMX23CSNcjs.searchTools; exports.stripPrototypeKeys = _chunk2BSBFBOAcjs.stripPrototypeKeys; exports.summarize = _chunkAMX23CSNcjs.summarize; exports.toCapturedImageData = _chunkN2FGYZ4Qcjs.toCapturedImageData; exports.toToolResult = _chunkAMX23CSNcjs.toToolResult; exports.toolResultError = _chunkNJGFSOPPcjs.toolResultError; exports.toolResultValue = _chunkNJGFSOPPcjs.toolResultValue; exports.toolsetInstructions = _chunkAMX23CSNcjs.toolsetInstructions; exports.toolsetName = _chunkAMX23CSNcjs.toolsetName; exports.trackPresenceDrag = _chunkSWTUM32Hcjs.trackPresenceDrag; exports.tweenPresenceCursor = _chunkSWTUM32Hcjs.tweenPresenceCursor; exports.unionCaptureRects = _chunkN2FGYZ4Qcjs.unionCaptureRects; exports.unionRects = _chunk5EMS4BZGcjs.unionRects; exports.unknownToolMessage = _chunkAMX23CSNcjs.unknownToolMessage; exports.validateJsonSchema = _chunkWOFXZ3XUcjs.validateJsonSchema;
+exports.AgentPlayback = _chunk3SLBXKAWcjs.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 = _chunkAMX23CSNcjs.JSON_RPC_ERRORS; exports.MCP_PROTOCOL_VERSIONS = _chunkAMX23CSNcjs.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 = _chunkK7ENM55Pcjs.PRESENCE_COLORS; exports.PerformanceQueue = _chunkK7ENM55Pcjs.PerformanceQueue; exports.PresenceStore = _chunkK7ENM55Pcjs.PresenceStore; exports.TOOL_BRIDGE_DEFAULT_PORT = _chunkAMX23CSNcjs.TOOL_BRIDGE_DEFAULT_PORT; exports.TOOL_BRIDGE_PROTOCOL = _chunkAMX23CSNcjs.TOOL_BRIDGE_PROTOCOL; exports.TOOL_DISCOVERY_TOOLS = _chunkAMX23CSNcjs.TOOL_DISCOVERY_TOOLS; exports.TOOL_NAMESPACE_SEPARATOR = _chunkAMX23CSNcjs.TOOL_NAMESPACE_SEPARATOR; exports.ToolRegistry = _chunkAMX23CSNcjs.ToolRegistry; exports.ToolRegistryError = _chunkAMX23CSNcjs.ToolRegistryError; exports.ToolRegistryView = _chunkAMX23CSNcjs.ToolRegistryView; exports.UNSAFE_JSON_KEYS = _chunk2BSBFBOAcjs.UNSAFE_JSON_KEYS; exports.baseToolName = _chunkAMX23CSNcjs.baseToolName; exports.captureInputSchema = _chunkN2FGYZ4Qcjs.captureInputSchema; exports.captureOutputSize = _chunkN2FGYZ4Qcjs.captureOutputSize; exports.cloneElementWithStyles = _chunkSVFEVKLFcjs.cloneElementWithStyles; exports.connectToolBridge = _chunkAMX23CSNcjs.connectToolBridge; exports.createAgentPlayback = _chunk3SLBXKAWcjs.createAgentPlayback; exports.createCaptureTool = _chunkN2FGYZ4Qcjs.createCaptureTool; exports.createCaptureToolProvider = _chunkN2FGYZ4Qcjs.createCaptureToolProvider; exports.createElementCaptureSurface = _chunkSVFEVKLFcjs.createElementCaptureSurface; exports.createInstantPresenceClock = _chunkK7ENM55Pcjs.createInstantPresenceClock; exports.createMcpServer = _chunkAMX23CSNcjs.createMcpServer; exports.createPlaybackToolProvider = _chunk3SLBXKAWcjs.createPlaybackToolProvider; exports.createStyleResolver = _chunkU4QN36YTcjs.createStyleResolver; exports.createStyleToolProvider = _chunkU4QN36YTcjs.createStyleToolProvider; exports.createToolRegistry = _chunkAMX23CSNcjs.createToolRegistry; exports.derivePlaybackSteps = _chunk3SLBXKAWcjs.derivePlaybackSteps; exports.elementToSvg = _chunkSVFEVKLFcjs.elementToSvg; exports.errorResult = _chunkAMX23CSNcjs.errorResult; exports.isUnsafeJsonKey = _chunk2BSBFBOAcjs.isUnsafeJsonKey; exports.listSkills = _chunkAMX23CSNcjs.listSkills; exports.locatePlaybackChrome = _chunk3SLBXKAWcjs.locatePlaybackChrome; exports.memoryStyleStore = _chunkU4QN36YTcjs.memoryStyleStore; exports.parseSkillFrontmatter = _chunkAMX23CSNcjs.parseSkillFrontmatter; exports.parseStyleDomains = _chunkU4QN36YTcjs.parseStyleDomains; exports.playbackRectFromClient = _chunk3SLBXKAWcjs.playbackRectFromClient; exports.playbackRefsFromArgs = _chunk3SLBXKAWcjs.playbackRefsFromArgs; exports.playbackRefsFromResult = _chunk3SLBXKAWcjs.playbackRefsFromResult; exports.rasterizeElement = _chunkSVFEVKLFcjs.rasterizeElement; exports.readSkillFile = _chunkAMX23CSNcjs.readSkillFile; exports.readingTime = _chunk3SLBXKAWcjs.readingTime; exports.realPresenceClock = _chunkK7ENM55Pcjs.realPresenceClock; exports.renderStyle = _chunkU4QN36YTcjs.renderStyle; exports.resolveCaptureRequest = _chunkN2FGYZ4Qcjs.resolveCaptureRequest; exports.runStyleChecks = _chunkU4QN36YTcjs.runStyleChecks; exports.runToolScript = _chunkU4QN36YTcjs.runToolScript; exports.searchTokens = _chunkAMX23CSNcjs.searchTokens; exports.searchTools = _chunkAMX23CSNcjs.searchTools; exports.stripPrototypeKeys = _chunk2BSBFBOAcjs.stripPrototypeKeys; exports.summarize = _chunkAMX23CSNcjs.summarize; exports.toCapturedImageData = _chunkN2FGYZ4Qcjs.toCapturedImageData; exports.toToolResult = _chunkAMX23CSNcjs.toToolResult; exports.toolResultError = _chunkU4QN36YTcjs.toolResultError; exports.toolResultValue = _chunkU4QN36YTcjs.toolResultValue; exports.toolsetInstructions = _chunkAMX23CSNcjs.toolsetInstructions; exports.toolsetName = _chunkAMX23CSNcjs.toolsetName; exports.trackPresenceDrag = _chunkK7ENM55Pcjs.trackPresenceDrag; exports.tweenPresenceCursor = _chunkK7ENM55Pcjs.tweenPresenceCursor; exports.unionCaptureRects = _chunkN2FGYZ4Qcjs.unionCaptureRects; exports.unionRects = _chunk3SLBXKAWcjs.unionRects; exports.unknownToolMessage = _chunkAMX23CSNcjs.unknownToolMessage; exports.validateJsonSchema = _chunkWOFXZ3XUcjs.validateJsonSchema;

package/dist/tools/index.js

@@ -8,7 +8,7 @@ import {
   runToolScript,
   toolResultError,
   toolResultValue
-} from "../chunk-ZXTO6U7T.js";
+} from "../chunk-GI3AVES4.js";
 import {
   JSON_RPC_ERRORS,
   MCP_PROTOCOL_VERSIONS,
@@ -46,7 +46,7 @@ import {
   playbackRefsFromResult,
   readingTime,
   unionRects
-} from "../chunk-WL4IN36A.js";
+} from "../chunk-EHTX34RE.js";
 import {
   CAPTURE_EXCLUDE_SELECTOR,
   CAPTURE_OVERLAY_SELECTORS,
@@ -92,7 +92,7 @@ import {
   realPresenceClock,
   trackPresenceDrag,
   tweenPresenceCursor
-} from "../chunk-O2ANJFUF.js";
+} from "../chunk-IVSWRVB4.js";
 import {
   validateJsonSchema
 } from "../chunk-V2ZCJRDM.js";

package/dist/tools/playback.d.cts

@@ -36,8 +36,11 @@ export type PlaybackStep = {
     type: 'say';
     text: string;
     ms?: number;
-} | {
+}
+/** Button down. `gesture: 'path'` tells the surface the drag that follows traces an outline (a lasso), not a box. */
+ | {
     type: 'press';
+    gesture?: 'path';
 } | {
     type: 'release';
 }

package/dist/tools/playback.d.ts

@@ -36,8 +36,11 @@ export type PlaybackStep = {
     type: 'say';
     text: string;
     ms?: number;
-} | {
+}
+/** Button down. `gesture: 'path'` tells the surface the drag that follows traces an outline (a lasso), not a box. */
+ | {
     type: 'press';
+    gesture?: 'path';
 } | {
     type: 'release';
 }

package/dist/tools/presence.d.cts

@@ -7,6 +7,8 @@ export interface PresenceActor {
     y: number;
     /** The button is down (dragging). */
     pressed: boolean;
+    /** What a drag traces while `pressed`: `path` for a freehand outline (a lasso), else a box from the press. */
+    gesture?: 'path';
     /** A short note shown next to the cursor (what the agent is doing). */
     message?: string;
     /** A rectangle (surface coordinates) the agent is working on, drawn as a highlight ring. */
@@ -87,13 +89,23 @@ export interface PresenceDragBox {
     width: number;
     height: number;
 }
+/** An agent's drag so far: the box from the press to the cursor, and the points it passed through. */
+export interface PresenceDrag extends PresenceDragBox {
+    /** The cursor positions since the press, in order (the press first). */
+    path: readonly {
+        x: number;
+        y: number;
+    }[];
+    /** `path` when the agent traces an outline (see `PresenceActor.gesture`); a box drag otherwise. */
+    gesture?: 'path';
+}
 /**
  * Follows a presence store for an agent's drag (press, move, release) and reports the box from
- * the press to the cursor, so a surface can draw its own drag feedback (a crop box or a marquee
- * being pulled out) under the agent's cursor. `onEnd` runs on release, or when the cursor leaves
+ * the press to the cursor and the path it took, so a surface can draw its own drag feedback (a crop
+ * box, a marquee being pulled out or a lasso being traced) under the agent's cursor. `onEnd` runs on release, or when the cursor leaves
  * the surface mid-drag. Pass the result to `PresenceStore.subscribe`.
  */
 export declare function trackPresenceDrag(handlers: {
-    onDrag: (box: PresenceDragBox) => void;
+    onDrag: (drag: PresenceDrag) => void;
     onEnd: () => void;
 }): (state: PresenceState) => void;

package/dist/tools/presence.d.ts

@@ -7,6 +7,8 @@ export interface PresenceActor {
     y: number;
     /** The button is down (dragging). */
     pressed: boolean;
+    /** What a drag traces while `pressed`: `path` for a freehand outline (a lasso), else a box from the press. */
+    gesture?: 'path';
     /** A short note shown next to the cursor (what the agent is doing). */
     message?: string;
     /** A rectangle (surface coordinates) the agent is working on, drawn as a highlight ring. */
@@ -87,13 +89,23 @@ export interface PresenceDragBox {
     width: number;
     height: number;
 }
+/** An agent's drag so far: the box from the press to the cursor, and the points it passed through. */
+export interface PresenceDrag extends PresenceDragBox {
+    /** The cursor positions since the press, in order (the press first). */
+    path: readonly {
+        x: number;
+        y: number;
+    }[];
+    /** `path` when the agent traces an outline (see `PresenceActor.gesture`); a box drag otherwise. */
+    gesture?: 'path';
+}
 /**
  * Follows a presence store for an agent's drag (press, move, release) and reports the box from
- * the press to the cursor, so a surface can draw its own drag feedback (a crop box or a marquee
- * being pulled out) under the agent's cursor. `onEnd` runs on release, or when the cursor leaves
+ * the press to the cursor and the path it took, so a surface can draw its own drag feedback (a crop
+ * box, a marquee being pulled out or a lasso being traced) under the agent's cursor. `onEnd` runs on release, or when the cursor leaves
  * the surface mid-drag. Pass the result to `PresenceStore.subscribe`.
  */
 export declare function trackPresenceDrag(handlers: {
-    onDrag: (box: PresenceDragBox) => void;
+    onDrag: (drag: PresenceDrag) => void;
     onEnd: () => void;
 }): (state: PresenceState) => void;

package/dist/tools/registry.d.cts

@@ -1,6 +1,6 @@
 import { type JsonSchema, type SchemaValidationError } from './schema.cjs';
 import { ToolRegistryView, type ToolViewOptions } from './view.cjs';
-import type { ToolPlanner } from './playback.cjs';
+import type { PlaybackStep, ToolPlanner } from './playback.cjs';
 import type { PresenceActorInfo } from './presence.cjs';
 /**
  * MCP-shaped tool definition, as returned by `tools/list`.
@@ -57,6 +57,12 @@ export interface ToolCallContext {
      * (`await context.stage?.()`), so they appear one by one; without playback it is absent.
      */
     stage?: () => Promise<void>;
+    /**
+     * Set by agent playback while the handler runs: acts out cursor steps (surface coordinates) the
+     * handler only learns mid-call, such as the outline a model returned, before it lands its change.
+     * `commit`, `stage` and `open` steps are ignored. Without playback it is absent.
+     */
+    perform?: (steps: readonly PlaybackStep[]) => Promise<void>;
 }
 /** Options for `callTool`. */
 export interface ToolCallOptions {

package/dist/tools/registry.d.ts

@@ -1,6 +1,6 @@
 import { type JsonSchema, type SchemaValidationError } from './schema.js';
 import { ToolRegistryView, type ToolViewOptions } from './view.js';
-import type { ToolPlanner } from './playback.js';
+import type { PlaybackStep, ToolPlanner } from './playback.js';
 import type { PresenceActorInfo } from './presence.js';
 /**
  * MCP-shaped tool definition, as returned by `tools/list`.
@@ -57,6 +57,12 @@ export interface ToolCallContext {
      * (`await context.stage?.()`), so they appear one by one; without playback it is absent.
      */
     stage?: () => Promise<void>;
+    /**
+     * Set by agent playback while the handler runs: acts out cursor steps (surface coordinates) the
+     * handler only learns mid-call, such as the outline a model returned, before it lands its change.
+     * `commit`, `stage` and `open` steps are ignored. Without playback it is absent.
+     */
+    perform?: (steps: readonly PlaybackStep[]) => Promise<void>;
 }
 /** Options for `callTool`. */
 export interface ToolCallOptions {

package/dist/vector/controller.d.cts

@@ -703,6 +703,19 @@ export declare function vectorToolLabel(tool: VectorTool): string;
 export declare const VECTOR_TOOL_SHORTCUTS: Readonly<Record<VectorTool, string>>;
 /** Short glyphs for tool buttons (pair them with `vectorToolLabel` for the accessible name). */
 export declare const VECTOR_TOOL_GLYPHS: Readonly<Record<VectorTool, string>>;
+/** A toolbar slot: related tools sharing one button, the first of them its default. */
+export interface VectorToolGroup {
+    id: string;
+    label: string;
+    tools: readonly VectorTool[];
+}
+/**
+ * Every tool in `VECTOR_TOOLS`, each in exactly one group, in toolbar order. Compact toolbars
+ * show one button per group and offer the rest of its tools in a flyout.
+ */
+export declare const VECTOR_TOOL_GROUPS: readonly VectorToolGroup[];
+/** The group holding `tool`. */
+export declare function vectorToolGroup(tool: VectorTool): VectorToolGroup;
 /** Names of the Pathfinder operations (undo steps, groups and buttons). */
 export declare const VECTOR_PATHFINDER_LABELS: Readonly<Record<VectorPathfinderOperation, string>>;
 /**

package/dist/vector/controller.d.ts

@@ -703,6 +703,19 @@ export declare function vectorToolLabel(tool: VectorTool): string;
 export declare const VECTOR_TOOL_SHORTCUTS: Readonly<Record<VectorTool, string>>;
 /** Short glyphs for tool buttons (pair them with `vectorToolLabel` for the accessible name). */
 export declare const VECTOR_TOOL_GLYPHS: Readonly<Record<VectorTool, string>>;
+/** A toolbar slot: related tools sharing one button, the first of them its default. */
+export interface VectorToolGroup {
+    id: string;
+    label: string;
+    tools: readonly VectorTool[];
+}
+/**
+ * Every tool in `VECTOR_TOOLS`, each in exactly one group, in toolbar order. Compact toolbars
+ * show one button per group and offer the rest of its tools in a flyout.
+ */
+export declare const VECTOR_TOOL_GROUPS: readonly VectorToolGroup[];
+/** The group holding `tool`. */
+export declare function vectorToolGroup(tool: VectorTool): VectorToolGroup;
 /** Names of the Pathfinder operations (undo steps, groups and buttons). */
 export declare const VECTOR_PATHFINDER_LABELS: Readonly<Record<VectorPathfinderOperation, string>>;
 /**