@pixerate/editor 0.219.2 → 0.221.0

package/dist/image-editor/index.js

@@ -91,6 +91,7 @@ import {
   TINT_SCALE,
   TONE_LUT_SIZE,
   TRANSFORM_ANCHORS,
+  VECTOR_MASK_EDGE_DEFAULTS,
   VIBRANCE_GREY,
   XYZ_D50_TO_SRGB,
   activeAdjustmentLayers,
@@ -201,6 +202,7 @@ import {
   hueRangeTables,
   hueRangeWeight,
   hueSaturation,
+  hybridVectorMaskCoverage,
   identityCurve,
   identityLevels,
   identityTransform,
@@ -224,6 +226,7 @@ import {
   isValidWarp,
   kelvinToTemperature,
   layerEffectsOf,
+  layerGuide,
   layerMaskCoverage,
   layerMaskFromSelection,
   layerMaskKey,
@@ -383,8 +386,10 @@ import {
   updateTypeLayer,
   userErrorMessage,
   uvToXy,
+  validVectorMaskEdges,
   vectorMaskBounds,
   vectorMaskCoverage,
+  vectorMaskSegments,
   vectorMaskThumbnail,
   versionedDescriptorBytes,
   vibranceLinear,
@@ -400,7 +405,7 @@ import {
   writePsd,
   xyToTempTint,
   xyToUv
-} from "../chunk-F7Z2MKY2.js";
+} from "../chunk-S6KKLFZO.js";
 import {
   parseCssColor
 } from "../chunk-3CI7FRMK.js";
@@ -1333,10 +1338,10 @@ function emptyHistogram() {
     max: 0
   };
 }
-function addToHistogram(h, data, stride, rect2) {
-  for (let y = rect2.y; y < rect2.y + rect2.height; y++) {
-    let i = (y * stride + rect2.x) * 4;
-    for (let x = 0; x < rect2.width; x++, i += 4) {
+function addToHistogram(h, data, stride, rect3) {
+  for (let y = rect3.y; y < rect3.y + rect3.height; y++) {
+    let i = (y * stride + rect3.x) * 4;
+    for (let x = 0; x < rect3.width; x++, i += 4) {
       if (!(data[i + 3] > 0)) {
         h.transparent++;
         continue;
@@ -1822,10 +1827,22 @@ var ImageEditorRenderer = class {
           else ctx.lineTo(b.x, b.y);
         };
         ctx.beginPath();
-        e.curves.forEach(trace2);
+        e.curves.forEach((c, i) => (e.curveModes?.[i] ?? "hard") === "hard" && trace2(c));
         ctx.lineWidth = 1.5 * u;
         ctx.strokeStyle = OVERLAY_HANDLE_EDGE;
         ctx.stroke();
+        for (const [mode, color, width, dash] of [["feather", "#f59e0b", 2, [5, 3]], ["matte", "#d946ef", 3, []]]) {
+          if (!e.curveModes?.includes(mode)) continue;
+          ctx.beginPath();
+          e.curves.forEach((c, i) => e.curveModes[i] === mode && trace2(c));
+          ctx.lineWidth = width * u;
+          ctx.strokeStyle = color;
+          ctx.setLineDash(dash.map((d) => d * u));
+          ctx.stroke();
+          ctx.setLineDash([]);
+        }
+        ctx.lineWidth = 1.5 * u;
+        ctx.strokeStyle = OVERLAY_HANDLE_EDGE;
         if (e.preview) {
           ctx.beginPath();
           trace2(e.preview);
@@ -1970,7 +1987,7 @@ var ImageEditorRenderer = class {
         if (!source.enabled || !source.maskSource) return null;
         return this.depthMaps.get(`${source.maskSource}|${width}x${height}`) ?? null;
       },
-      rasterizeAnnotation: (annotation, rect2) => this.rasterizeAnnotation(annotation, rect2),
+      rasterizeAnnotation: (annotation, rect3) => this.rasterizeAnnotation(annotation, rect3),
       version: `${host?.version() ?? ""}:${this.assetVersion}`,
       globalLight: host?.globalLight?.(),
       pattern: host?.pattern ? (id) => host.pattern(id) : void 0
@@ -2011,34 +2028,34 @@ var ImageEditorRenderer = class {
     return Boolean(ctx && typeof ctx.getImageData === "function");
   }
   /** One annotation drawn into a tile-sized RGBA buffer at `rect` (document space), or `null` without a canvas. */
-  rasterizeAnnotation(annotation, rect2) {
-    if (!this.scratch) this.scratch = this.createCanvas(rect2.width, rect2.height);
+  rasterizeAnnotation(annotation, rect3) {
+    if (!this.scratch) this.scratch = this.createCanvas(rect3.width, rect3.height);
     const canvas = this.scratch;
-    if (canvas.width !== rect2.width || canvas.height !== rect2.height) {
-      canvas.width = rect2.width;
-      canvas.height = rect2.height;
+    if (canvas.width !== rect3.width || canvas.height !== rect3.height) {
+      canvas.width = rect3.width;
+      canvas.height = rect3.height;
     }
     const ctx = canvas.getContext("2d");
     if (!ctx || typeof ctx.getImageData !== "function") return null;
     try {
       ctx.setTransform(1, 0, 0, 1, 0, 0);
-      ctx.clearRect(0, 0, rect2.width, rect2.height);
-      ctx.setTransform(1, 0, 0, 1, -rect2.x, -rect2.y);
+      ctx.clearRect(0, 0, rect3.width, rect3.height);
+      ctx.setTransform(1, 0, 0, 1, -rect3.x, -rect3.y);
       const img = annotation.type === "image" ? this.imageCache.peek(annotation.src) ?? null : null;
       this.drawAnnotationShape(ctx, annotation, img);
       ctx.setTransform(1, 0, 0, 1, 0, 0);
-      return new Uint8ClampedArray(ctx.getImageData(0, 0, rect2.width, rect2.height).data);
+      return new Uint8ClampedArray(ctx.getImageData(0, 0, rect3.width, rect3.height).data);
     } catch {
       return null;
     }
   }
-  putTile(ctx, data, tx, ty, rect2) {
-    const ox = tx * TILE - rect2.x;
-    const oy = ty * TILE - rect2.y;
+  putTile(ctx, data, tx, ty, rect3) {
+    const ox = tx * TILE - rect3.x;
+    const oy = ty * TILE - rect3.y;
     const x0 = Math.max(0, -ox);
     const y0 = Math.max(0, -oy);
-    const x1 = Math.min(TILE, rect2.width - ox);
-    const y1 = Math.min(TILE, rect2.height - oy);
+    const x1 = Math.min(TILE, rect3.width - ox);
+    const y1 = Math.min(TILE, rect3.height - oy);
     if (x1 <= x0 || y1 <= y0) return;
     const img = ctx.createImageData(TILE, TILE);
     img.data.set(data);
@@ -2050,23 +2067,23 @@ var ImageEditorRenderer = class {
    * uploading only the tiles that changed since the last render.
    */
   updateComposite(layers, region, width, height, options = {}) {
-    const rect2 = coveringRect(region);
+    const rect3 = coveringRect(region);
     let comp = this.comp;
     let fresh = false;
-    if (!comp || comp.rect.x !== rect2.x || comp.rect.y !== rect2.y || comp.rect.width !== rect2.width || comp.rect.height !== rect2.height) {
-      const canvas = this.createCanvas(rect2.width, rect2.height);
-      comp = this.comp = new CompositeCanvas(canvas, rect2);
+    if (!comp || comp.rect.x !== rect3.x || comp.rect.y !== rect3.y || comp.rect.width !== rect3.width || comp.rect.height !== rect3.height) {
+      const canvas = this.createCanvas(rect3.width, rect3.height);
+      comp = this.comp = new CompositeCanvas(canvas, rect3);
       fresh = true;
     }
     const ctx = comp.canvas.getContext("2d");
     if (!ctx || typeof ctx.createImageData !== "function") return null;
     let changed = false;
-    this.compositor.compositeTiles(layers, rect2, this.compositorSources(width, height), (tx, ty, data) => {
+    this.compositor.compositeTiles(layers, rect3, this.compositorSources(width, height), (tx, ty, data) => {
       const key2 = tileKey(tx, ty);
       if (comp.tiles.get(key2) === data) return;
       comp.tiles.set(key2, data);
       comp.histograms.delete(key2);
-      this.putTile(ctx, data, tx, ty, rect2);
+      this.putTile(ctx, data, tx, ty, rect3);
       changed = true;
     }, { checkpointLayerId: options.checkpointLayerId, dirty: fresh ? void 0 : options.dirty });
     if (changed) comp.version++;
@@ -2346,15 +2363,15 @@ var ImageEditorRenderer = class {
         break;
       }
       case "rect": {
-        const rect2 = ann;
-        ctx.strokeStyle = rect2.strokeColor;
-        ctx.lineWidth = rect2.strokeWidth;
-        if (rect2.fillColor) {
-          ctx.fillStyle = rect2.fillColor;
-          ctx.fillRect(rect2.x, rect2.y, rect2.width, rect2.height);
+        const rect3 = ann;
+        ctx.strokeStyle = rect3.strokeColor;
+        ctx.lineWidth = rect3.strokeWidth;
+        if (rect3.fillColor) {
+          ctx.fillStyle = rect3.fillColor;
+          ctx.fillRect(rect3.x, rect3.y, rect3.width, rect3.height);
         }
-        if (rect2.strokeWidth > 0) {
-          ctx.strokeRect(rect2.x, rect2.y, rect2.width, rect2.height);
+        if (rect3.strokeWidth > 0) {
+          ctx.strokeRect(rect3.x, rect3.y, rect3.width, rect3.height);
         }
         break;
       }
@@ -2545,12 +2562,12 @@ var ImageEditorRenderer = class {
       const split = splitOverlayAnnotations(layers);
       overlay = split.overlay.map((l) => l.annotation);
       await this.prepareLayerAssets(split.composite, naturalWidth, naturalHeight);
-      const rect2 = coveringRect(region);
-      const comp = this.createCanvas(rect2.width, rect2.height);
+      const rect3 = coveringRect(region);
+      const comp = this.createCanvas(rect3.width, rect3.height);
       const cctx = comp.getContext("2d");
       if (cctx && typeof cctx.createImageData === "function") {
-        this.exportCompositor.compositeTiles(split.composite, rect2, this.compositorSources(naturalWidth, naturalHeight), (tx, ty, data) => {
-          this.putTile(cctx, data, tx, ty, rect2);
+        this.exportCompositor.compositeTiles(split.composite, rect3, this.compositorSources(naturalWidth, naturalHeight), (tx, ty, data) => {
+          this.putTile(cctx, data, tx, ty, rect3);
         });
       }
       baseCanvas = this.createCanvas(baseW, baseH);
@@ -2561,7 +2578,7 @@ var ImageEditorRenderer = class {
         bctx.beginPath();
         bctx.rect(region.x, region.y, region.width, region.height);
         bctx.clip();
-        bctx.drawImage(comp, rect2.x, rect2.y);
+        bctx.drawImage(comp, rect3.x, rect3.y);
         bctx.restore();
         this.applyPost(bctx, baseW, baseH, state);
       }
@@ -2689,10 +2706,10 @@ function getBaseProjection(region, transform, baseW, baseH) {
   };
 }
 var CompositeCanvas = class {
-  constructor(canvas, rect2) {
+  constructor(canvas, rect3) {
     this.canvas = canvas;
-    this.rect = rect2;
-    this.region = rect2;
+    this.rect = rect3;
+    this.region = rect3;
   }
   canvas;
   rect;
@@ -2985,7 +3002,7 @@ function traceLoops(a, W, H, rx0, ry0, rx1, ry1) {
   };
   const on = (i, j) => f(i, j) >= 128;
   const V = w * h;
-  const point = (id) => {
+  const point2 = (id) => {
     const vertical = id >= V;
     const k = vertical ? id - V : id;
     const i = k % w;
@@ -3070,7 +3087,7 @@ function traceLoops(a, W, H, rx0, ry0, rx1, ry1) {
     let from = segs[s * 2];
     while (!used[s]) {
       used[s] = 1;
-      loop.push(point(from));
+      loop.push(point2(from));
       const to = segs[s * 2] === from ? segs[s * 2 + 1] : segs[s * 2];
       const next = touch.get(to).find((t) => !used[t]);
       from = to;
@@ -3159,133 +3176,648 @@ function regions(a, W, H, b, minArea) {
   };
 }
 
-// src/image-editor/selection/uncertainty.ts
-var BACKED = 0.2;
-function selectionUncertainty(mask, image, options = {}) {
-  const W = mask.width;
-  const H = mask.height;
-  const empty = () => ({ unknown: createSelectionMask(W, H), regions: [], count: 0, confidence: 1 });
-  const b = mask.bounds;
-  if (!b) return empty();
-  const band = Math.max(1, Math.round(options.band ?? Math.max(2, Math.min(W, H) / 200)));
-  const minArea = Math.max(1, options.minArea ?? 16);
-  const maxRegions = Math.max(1, options.maxRegions ?? 20);
-  const a = mask.data;
-  const gradient = createGradientSampler(image, W);
-  const x0 = Math.max(0, b.x - band - 1);
-  const y0 = Math.max(0, b.y - band - 1);
-  const x1 = Math.min(W, b.x + b.width + band + 1);
-  const y1 = Math.min(H, b.y + b.height + band + 1);
-  const w = x1 - x0;
-  const h = y1 - y0;
-  const evidence = new Float32Array(w * h).fill(NaN);
-  const seeds = new Uint8Array(w * h);
-  let sum = 0;
-  let n = 0;
-  const on = (x, y) => a[y * W + x] >= 128;
+// src/image-editor/selection/wand.ts
+function checkPixels(p) {
+  const n = p.width * p.height;
+  if (!Number.isInteger(p.width) || !Number.isInteger(p.height) || p.width < 1 || p.height < 1) {
+    throw new Error("Invalid pixel buffer size");
+  }
+  if (p.data.length < n * 4) throw new Error("Pixel data is shorter than width \xD7 height \xD7 4");
+  return n;
+}
+var SRGB_TO_LINEAR2 = (() => {
+  const t = new Float32Array(256);
+  for (let i = 0; i < 256; i++) {
+    const v = i / 255;
+    t[i] = v <= 0.04045 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
+  }
+  return t;
+})();
+var labF = (t) => t > 216 / 24389 ? Math.cbrt(t) : (24389 / 27 * t + 16) / 116;
+function srgb8ToLab(r, g, b) {
+  const rl = SRGB_TO_LINEAR2[r & 255];
+  const gl = SRGB_TO_LINEAR2[g & 255];
+  const bl = SRGB_TO_LINEAR2[b & 255];
+  const x = (0.4124564 * rl + 0.3575761 * gl + 0.1804375 * bl) / 0.95047;
+  const y = 0.2126729 * rl + 0.7151522 * gl + 0.072175 * bl;
+  const z = (0.0193339 * rl + 0.119192 * gl + 0.9503041 * bl) / 1.08883;
+  const fx = labF(x);
+  const fy = labF(y);
+  const fz = labF(z);
+  return [116 * fy - 16, 500 * (fx - fy), 200 * (fy - fz)];
+}
+function similarity(pixels, seed, tolerance, distance) {
+  const d = pixels.data;
+  const tr = d[seed * 4];
+  const tg = d[seed * 4 + 1];
+  const tb = d[seed * 4 + 2];
+  const ta = d[seed * 4 + 3];
+  const tol = Math.max(0, Math.floor(tolerance + 1e-3));
+  if (distance === "perceptual") {
+    const [tl, taa, tbb] = srgb8ToLab(tr, tg, tb);
+    const de = Math.max(0, tolerance) * 100 / 255;
+    const de2 = de * de + 1e-6;
+    return (i) => {
+      const p = i * 4;
+      const a = d[p + 3];
+      if (ta === 0 && a === 0) return true;
+      if (Math.abs(a - ta) > tol) return false;
+      const [l, aa, bb] = srgb8ToLab(d[p], d[p + 1], d[p + 2]);
+      return (l - tl) ** 2 + (aa - taa) ** 2 + (bb - tbb) ** 2 <= de2;
+    };
+  }
+  return (i) => {
+    const p = i * 4;
+    const a = d[p + 3];
+    if (ta === 0 && a === 0) return true;
+    return Math.abs(d[p] - tr) <= tol && Math.abs(d[p + 1] - tg) <= tol && Math.abs(d[p + 2] - tb) <= tol && Math.abs(a - ta) <= tol;
+  };
+}
+function antialiasMarks(marks, w, h, x0, y0, x1, y1) {
+  const out = marks.slice();
   for (let y = y0; y < y1; y++) {
     for (let x = x0; x < x1; x++) {
-      const v = on(x, y);
-      const differs = (nx, ny) => nx >= 0 && ny >= 0 && nx < W && ny < H && on(nx, ny) !== v;
-      if (!(differs(x - 1, y) || differs(x + 1, y) || differs(x, y - 1) || differs(x, y + 1))) continue;
-      let g = 0;
-      for (let dy = -2; dy <= 2; dy++) {
-        for (let dx = -2; dx <= 2; dx++) {
+      const i = y * w + x;
+      const v = marks[i];
+      let sum = 0;
+      let edge = false;
+      for (let dy = -1; dy <= 1; dy++) {
+        const ny = y + dy;
+        for (let dx = -1; dx <= 1; dx++) {
           const nx = x + dx;
-          const ny = y + dy;
-          if (nx >= 0 && ny >= 0 && nx < W && ny < H) g = Math.max(g, gradient(nx, ny));
+          const n = nx < 0 || ny < 0 || nx >= w || ny >= h ? v : marks[ny * w + nx];
+          if (n !== v) edge = true;
+          sum += n;
         }
       }
-      const e = Math.min(1, g / BACKED);
-      const k = (y - y0) * w + (x - x0);
-      evidence[k] = e;
-      sum += e;
-      n++;
-      if (e < 0.5) seeds[k] = 1;
+      if (edge) {
+        const avg = sum / (9 * 255);
+        out[i] = Math.round((v > 127 ? 0.5 + 0.5 * avg : 0.5 * avg) * 255);
+      }
     }
   }
-  if (!n) return empty();
-  const rows = new Uint8Array(w * h);
-  for (let y = 0; y < h; y++) {
-    let last = -Infinity;
-    for (let x = 0; x < w; x++) {
-      if (seeds[y * w + x]) last = x;
-      if (x - last <= band) rows[y * w + x] = 1;
-    }
-    last = Infinity;
-    for (let x = w - 1; x >= 0; x--) {
-      if (seeds[y * w + x]) last = x;
-      if (last - x <= band) rows[y * w + x] = 1;
+  return out;
+}
+function magicWand(pixels, seed, options = {}) {
+  const n = checkPixels(pixels);
+  const { width: w, height: h } = pixels;
+  const sx = Math.floor(seed.x);
+  const sy = Math.floor(seed.y);
+  if (!(sx >= 0 && sy >= 0 && sx < w && sy < h)) return createSelectionMask(w, h);
+  const similar = similarity(pixels, sy * w + sx, options.tolerance ?? 32, options.distance ?? "rgb");
+  const marks = new Uint8Array(n);
+  let bx0 = w;
+  let by0 = h;
+  let bx1 = -1;
+  let by1 = -1;
+  if (options.contiguous ?? true) {
+    const stack = [sy * w + sx];
+    while (stack.length) {
+      const idx = stack.pop();
+      if (marks[idx]) continue;
+      const y = idx / w | 0;
+      const row = y * w;
+      let l = idx - row;
+      let r = l;
+      while (l > 0 && !marks[row + l - 1] && similar(row + l - 1)) l--;
+      while (r + 1 < w && !marks[row + r + 1] && similar(row + r + 1)) r++;
+      marks.fill(255, row + l, row + r + 1);
+      if (l < bx0) bx0 = l;
+      if (r > bx1) bx1 = r;
+      if (y < by0) by0 = y;
+      if (y > by1) by1 = y;
+      for (const ny of [y - 1, y + 1]) {
+        if (ny < 0 || ny >= h) continue;
+        const nrow = ny * w;
+        let inRun = false;
+        for (let nx = l; nx <= r; nx++) {
+          const ok = !marks[nrow + nx] && similar(nrow + nx);
+          if (ok && !inRun) stack.push(nrow + nx);
+          inRun = ok;
+        }
+      }
     }
-  }
-  const grown = new Uint8Array(w * h);
-  for (let x = 0; x < w; x++) {
-    let last = -Infinity;
+  } else {
     for (let y = 0; y < h; y++) {
-      if (rows[y * w + x]) last = y;
-      if (y - last <= band) grown[y * w + x] = 1;
-    }
-    last = Infinity;
-    for (let y = h - 1; y >= 0; y--) {
-      if (rows[y * w + x]) last = y;
-      if (last - y <= band) grown[y * w + x] = 1;
-    }
-  }
-  const label = new Int32Array(w * h);
-  const stack = new Int32Array(w * h);
-  const found = [];
-  for (let start = 0; start < w * h; start++) {
-    if (!grown[start] || label[start]) continue;
-    const r = { area: 0, e: 0, en: 0, bx0: w, by0: h, bx1: -1, by1: -1 };
-    const id = found.length + 1;
-    let top = 0;
-    stack[top++] = start;
-    label[start] = id;
-    while (top) {
-      const k = stack[--top];
-      const i = k % w;
-      const j = (k - i) / w;
-      r.area++;
-      if (!Number.isNaN(evidence[k])) {
-        r.e += evidence[k];
-        r.en++;
-      }
-      if (i < r.bx0) r.bx0 = i;
-      if (i > r.bx1) r.bx1 = i;
-      if (j < r.by0) r.by0 = j;
-      if (j > r.by1) r.by1 = j;
-      for (let dy = -1; dy <= 1; dy++) {
-        for (let dx = -1; dx <= 1; dx++) {
-          const ni = i + dx;
-          const nj = j + dy;
-          if (ni < 0 || nj < 0 || ni >= w || nj >= h) continue;
-          const nk = nj * w + ni;
-          if (!grown[nk] || label[nk]) continue;
-          label[nk] = id;
-          stack[top++] = nk;
+      const row = y * w;
+      for (let x = 0; x < w; x++) {
+        if (similar(row + x)) {
+          marks[row + x] = 255;
+          if (x < bx0) bx0 = x;
+          if (x > bx1) bx1 = x;
+          if (y < by0) by0 = y;
+          if (y > by1) by1 = y;
         }
       }
     }
-    found.push(r);
   }
-  const unknownData = new Uint8Array(W * H);
-  for (let y = 0; y < h; y++) {
-    for (let x = 0; x < w; x++) {
-      const id = label[y * w + x];
-      if (id && found[id - 1].area >= minArea) unknownData[(y + y0) * W + x + x0] = 255;
-    }
+  if (bx1 < 0) return createSelectionMask(w, h);
+  if (!(options.antiAlias ?? true)) return createSelectionMask(w, h, marks);
+  return createSelectionMask(
+    w,
+    h,
+    antialiasMarks(marks, w, h, Math.max(0, bx0 - 1), Math.max(0, by0 - 1), Math.min(w, bx1 + 2), Math.min(h, by1 + 2))
+  );
+}
+function sampleColor(c) {
+  if (typeof c === "string") {
+    const m = /^#?([0-9a-f]{6})$/i.exec(c.trim());
+    if (!m) throw new Error(`Invalid colour "${c}"`);
+    const v = parseInt(m[1], 16);
+    return [v >> 16 & 255, v >> 8 & 255, v & 255];
   }
-  const kept = found.filter((r) => r.area >= minArea).map((r) => ({
-    bounds: { x: x0 + r.bx0, y: y0 + r.by0, width: r.bx1 - r.bx0 + 1, height: r.by1 - r.by0 + 1 },
-    area: r.area,
-    confidence: Math.round((r.en ? r.e / r.en : 0) * 1e3) / 1e3
-  })).sort((p, q) => p.confidence - q.confidence || q.area - p.area);
-  return {
-    unknown: createSelectionMask(W, H, unknownData),
-    regions: kept.slice(0, maxRegions),
-    count: kept.length,
-    confidence: Math.round(sum / n * 1e3) / 1e3
-  };
+  return [c[0], c[1], c[2]];
+}
+function colorRange(pixels, samples, options = {}) {
+  const n = checkPixels(pixels);
+  const { width: w, height: h, data } = pixels;
+  const f = Math.max(0, options.fuzziness ?? 40) + 1;
+  const parsed = samples.map((s) => ({ c: sampleColor(s.color), at: s.at }));
+  const radius = options.localized !== void 0 ? Math.max(1, options.localized) : void 0;
+  const out = new Uint8Array(n);
+  if (!parsed.length) return createSelectionMask(w, h, out);
+  for (let i = 0; i < n; i++) {
+    const p = i * 4;
+    if (data[p + 3] <= 0) continue;
+    const x = i % w;
+    const y = (i - x) / w;
+    let best = 0;
+    for (const s of parsed) {
+      const d = Math.max(Math.abs(data[p] - s.c[0]), Math.abs(data[p + 1] - s.c[1]), Math.abs(data[p + 2] - s.c[2]));
+      let k = Math.min(1, Math.max(0, 1 - d / f));
+      if (k > 0 && radius !== void 0 && s.at) {
+        const dist2 = Math.hypot(x - s.at.x, y - s.at.y);
+        k *= Math.min(1, Math.max(0, 1 - dist2 / radius));
+      }
+      if (k > best) best = k;
+    }
+    out[i] = coverageToByte(best);
+  }
+  return createSelectionMask(w, h, out);
+}
+var TONE_RANGE_PRESETS = {
+  shadows: [0, 65],
+  midtones: [105, 150],
+  highlights: [190, 255]
+};
+function toneRange(pixels, range, falloff = 20) {
+  const n = checkPixels(pixels);
+  const [lo, hi] = typeof range === "string" ? TONE_RANGE_PRESETS[range] : range;
+  const ramp2 = Math.max(1e-3, falloff);
+  const out = new Uint8Array(n);
+  const d = pixels.data;
+  for (let i = 0; i < n; i++) {
+    const p = i * 4;
+    if (d[p + 3] <= 0) continue;
+    const l = Math.min(255, Math.max(0, 0.299 * d[p] + 0.587 * d[p + 1] + 0.114 * d[p + 2]));
+    const outside = l < lo ? lo - l : l > hi ? l - hi : 0;
+    out[i] = coverageToByte(1 - outside / ramp2);
+  }
+  return createSelectionMask(pixels.width, pixels.height, out);
+}
+function hueRange(pixels, center) {
+  const n = checkPixels(pixels);
+  const out = new Uint8Array(n);
+  const d = pixels.data;
+  for (let i = 0; i < n; i++) {
+    const p = i * 4;
+    if (d[p + 3] <= 0) continue;
+    const r = d[p] / 255;
+    const g = d[p + 1] / 255;
+    const b = d[p + 2] / 255;
+    const mx = Math.max(r, g, b);
+    const mn = Math.min(r, g, b);
+    const chroma = mx - mn;
+    if (chroma <= 0) continue;
+    let hue;
+    if (mx === r) hue = ((g - b) / chroma % 6 + 6) % 6;
+    else if (mx === g) hue = (b - r) / chroma + 2;
+    else hue = (r - g) / chroma + 4;
+    hue *= 60;
+    let dh = ((hue - center) % 360 + 360) % 360;
+    dh = Math.min(dh, 360 - dh);
+    out[i] = coverageToByte(Math.min(1, Math.max(0, 1 - dh / 60)) * chroma * (2 - mx));
+  }
+  return createSelectionMask(pixels.width, pixels.height, out);
+}
+var HUE_RANGE_PRESETS = { reds: 0, yellows: 60, greens: 120, cyans: 180, blues: 240, magentas: 300 };
+var COLOR_RANGE_PRESETS = [
+  ...Object.keys(HUE_RANGE_PRESETS),
+  "highlights",
+  "midtones",
+  "shadows",
+  "skinTones"
+];
+function isColorRangePreset(v) {
+  return typeof v === "string" && COLOR_RANGE_PRESETS.includes(v);
+}
+var ramp = (v, lo, hi, soft) => v < lo ? Math.max(0, 1 - (lo - v) / soft) : v > hi ? Math.max(0, 1 - (v - hi) / soft) : 1;
+function skinToneRange(pixels) {
+  const n = checkPixels(pixels);
+  const out = new Uint8Array(n);
+  const d = pixels.data;
+  for (let i = 0; i < n; i++) {
+    const p = i * 4;
+    if (d[p + 3] <= 0) continue;
+    const r = d[p] / 255;
+    const g = d[p + 1] / 255;
+    const b = d[p + 2] / 255;
+    const mx = Math.max(r, g, b);
+    const mn = Math.min(r, g, b);
+    const chroma = mx - mn;
+    if (chroma <= 0 || mx <= 0) continue;
+    let hue;
+    if (mx === r) hue = ((g - b) / chroma % 6 + 6) % 6;
+    else if (mx === g) hue = (b - r) / chroma + 2;
+    else hue = (r - g) / chroma + 4;
+    hue *= 60;
+    if (hue > 180) hue -= 360;
+    const k = ramp(hue, 5, 40, 20) * ramp(chroma / mx, 0.12, 0.8, 0.1) * ramp(mx, 0.3, 1, 0.15);
+    out[i] = coverageToByte(k);
+  }
+  return createSelectionMask(pixels.width, pixels.height, out);
+}
+function colorRangePreset(pixels, preset, options = {}) {
+  if (preset === "skinTones") return skinToneRange(pixels);
+  if (preset === "highlights" || preset === "midtones" || preset === "shadows") return toneRange(pixels, preset, options.falloff ?? 20);
+  if (preset in HUE_RANGE_PRESETS) return hueRange(pixels, HUE_RANGE_PRESETS[preset]);
+  throw new Error(`Unknown Color Range preset "${String(preset)}". Use one of ${COLOR_RANGE_PRESETS.join(", ")}.`);
+}
+function selectedColorBins(pixels, sel, tolerance) {
+  const S = 64;
+  let bins = new Uint8Array(S * S * S);
+  const d = pixels.data;
+  const n = pixels.width * pixels.height;
+  for (let i = 0; i < n; i++) {
+    if (sel.data[i] < 128 || d[i * 4 + 3] === 0) continue;
+    bins[((d[i * 4] >> 2) * S + (d[i * 4 + 1] >> 2)) * S + (d[i * 4 + 2] >> 2)] = 1;
+  }
+  const r = Math.round(Math.max(0, tolerance) / 4);
+  if (r === 0) return bins;
+  for (const stride of [1, S, S * S]) {
+    const out = new Uint8Array(bins.length);
+    for (let i = 0; i < bins.length; i++) {
+      if (!bins[i]) continue;
+      const c = Math.floor(i / stride) % S;
+      const lo = Math.max(0, c - r);
+      const hi = Math.min(S - 1, c + r);
+      const base = i - c * stride;
+      for (let k = lo; k <= hi; k++) out[base + k * stride] = 1;
+    }
+    bins = out;
+  }
+  return bins;
+}
+function matcher(pixels, sel, options) {
+  if (sel.width !== pixels.width || sel.height !== pixels.height) throw new Error("The selection and the pixels differ in size");
+  const bins = selectedColorBins(pixels, sel, options.tolerance ?? 32);
+  const d = pixels.data;
+  return (i) => d[i * 4 + 3] > 0 && bins[((d[i * 4] >> 2 << 6) + (d[i * 4 + 1] >> 2)) * 64 + (d[i * 4 + 2] >> 2)] === 1;
+}
+function growSelection(pixels, sel, options = {}) {
+  checkPixels(pixels);
+  const match = matcher(pixels, sel, options);
+  const { width: w, height: h } = pixels;
+  const out = new Uint8Array(sel.data);
+  const stack = [];
+  for (let i = 0; i < out.length; i++) if (out[i] >= 128) stack.push(i);
+  while (stack.length) {
+    const i = stack.pop();
+    const x = i % w;
+    const y = (i - x) / w;
+    const visit = (j) => {
+      if (out[j] < 255 && match(j)) {
+        out[j] = 255;
+        stack.push(j);
+      }
+    };
+    if (x > 0) visit(i - 1);
+    if (x < w - 1) visit(i + 1);
+    if (y > 0) visit(i - w);
+    if (y < h - 1) visit(i + w);
+  }
+  return createSelectionMask(w, h, out);
+}
+function selectSimilar(pixels, sel, options = {}) {
+  const n = checkPixels(pixels);
+  const match = matcher(pixels, sel, options);
+  const out = new Uint8Array(sel.data);
+  for (let i = 0; i < n; i++) if (match(i)) out[i] = 255;
+  return createSelectionMask(pixels.width, pixels.height, out);
+}
+
+// src/image-editor/selection/recipe.ts
+var SELECTION_RECIPE_OPS = ["rect", "ellipse", "polygon", "magic-wand", "color-range", "color-range-preset", "all", "invert", "modify", "refine"];
+function isShapeStep(step) {
+  return step.op !== "all" && step.op !== "invert" && step.op !== "modify" && step.op !== "refine";
+}
+function stepNeedsPixels(step) {
+  return step.op === "magic-wand" || step.op === "color-range" || step.op === "color-range-preset" || step.op === "refine" && (step.params.radius ?? 8) > 0;
+}
+function samplingKey(step) {
+  const s = step;
+  return `${s.sample ?? "composite"}:${s.sampleMerged === true}`;
+}
+var fail = (msg) => {
+  throw new Error(msg);
+};
+var finite = (v) => typeof v === "number" && Number.isFinite(v);
+var point = (v, at) => {
+  const p = v;
+  if (!p || !finite(p.x) || !finite(p.y)) fail(`${at} must be { x, y } in natural image pixels.`);
+  return { x: p.x, y: p.y };
+};
+var rect = (v, at) => {
+  const r = v;
+  if (!r || !finite(r.x) || !finite(r.y) || !finite(r.width) || !finite(r.height) || r.width <= 0 || r.height <= 0) fail(`${at} must be { x, y, width, height } with a positive size.`);
+  return { x: r.x, y: r.y, width: r.width, height: r.height };
+};
+function readRecipeStep(raw, at = "step") {
+  const s = raw;
+  if (!s || typeof s !== "object") return fail(`${at} must be an object with an op.`);
+  const combine = () => {
+    const out = {};
+    if (s.mode !== void 0) {
+      if (s.mode !== "replace" && s.mode !== "add" && s.mode !== "subtract" && s.mode !== "intersect") fail(`${at}.mode must be replace, add, subtract or intersect.`);
+      out.mode = s.mode;
+    }
+    if (s.feather !== void 0) {
+      if (!finite(s.feather) || s.feather < 0 || s.feather > 1e3) fail(`${at}.feather must be 0 to 1000 px.`);
+      if (s.feather > 0) out.feather = s.feather;
+    }
+    if (s.invert === true) out.invert = true;
+    return out;
+  };
+  const sampling = () => {
+    const out = {};
+    if (s.sample !== void 0) {
+      if (s.sample !== "composite" && s.sample !== "active-layer") fail(`${at}.sample must be composite or active-layer.`);
+      out.sample = s.sample;
+    }
+    if (s.sampleMerged === true) out.sampleMerged = true;
+    return out;
+  };
+  const options = () => s.options && typeof s.options === "object" ? { options: JSON.parse(JSON.stringify(s.options)) } : {};
+  switch (s.op) {
+    case "rect":
+    case "ellipse":
+      return { op: s.op, rect: rect(s.rect, `${at}.rect`), ...s.antiAlias === false ? { antiAlias: false } : {}, ...combine() };
+    case "polygon": {
+      if (!Array.isArray(s.points) || s.points.length < 3) fail(`${at}.points must be at least 3 { x, y } points.`);
+      return { op: "polygon", points: s.points.map((p, i) => point(p, `${at}.points[${i}]`)), ...s.antiAlias === false ? { antiAlias: false } : {}, ...combine() };
+    }
+    case "magic-wand":
+      return { op: "magic-wand", point: point(s.point, `${at}.point`), ...options(), ...combine(), ...sampling() };
+    case "color-range":
+      if (!Array.isArray(s.samples) || !s.samples.length) fail(`${at}.samples must be a non-empty list of colour samples.`);
+      return { op: "color-range", samples: JSON.parse(JSON.stringify(s.samples)), ...options(), ...combine(), ...sampling() };
+    case "color-range-preset":
+      if (typeof s.preset !== "string" || !isColorRangePreset(s.preset)) fail(`${at}.preset is not a Color Range preset.`);
+      return { op: "color-range-preset", preset: s.preset, ...finite(s.falloff) ? { falloff: s.falloff } : {}, ...combine(), ...sampling() };
+    case "all":
+      return { op: "all" };
+    case "invert":
+      return { op: "invert" };
+    case "modify":
+      if (!SELECTION_MODIFY_OPS.includes(s.modify)) fail(`${at}.modify must be one of ${SELECTION_MODIFY_OPS.join(", ")}.`);
+      if (!finite(s.radius) || s.radius < 0 || s.radius > 500) fail(`${at}.radius must be 0 to 500 px.`);
+      return { op: "modify", modify: s.modify, radius: s.radius };
+    case "refine":
+      if (!s.params || typeof s.params !== "object") fail(`${at}.params must be the refine settings (radius, smooth, feather, contrast, shiftEdge).`);
+      return { op: "refine", params: JSON.parse(JSON.stringify(s.params)), ...sampling() };
+    default:
+      return fail(`${at}.op "${String(s.op)}" is not a recipe step; use ${SELECTION_RECIPE_OPS.join(", ")}.`);
+  }
+}
+function replaySelectionRecipe(steps, width, height, pixelsFor) {
+  let sel = null;
+  steps.forEach((step, i) => {
+    const shape = (mask) => {
+      const st = step;
+      let m = st.feather && st.feather > 0 ? modifySelection(mask, "feather", st.feather) : mask;
+      if (st.invert) m = invertSelection(m);
+      return combineSelections(sel, m, st.mode ?? "replace");
+    };
+    let next;
+    switch (step.op) {
+      case "rect":
+        next = shape(rectSelection(width, height, step.rect, { antiAlias: step.antiAlias }));
+        break;
+      case "ellipse":
+        next = shape(ellipseSelection(width, height, step.rect, { antiAlias: step.antiAlias }));
+        break;
+      case "polygon":
+        next = shape(polygonSelection(width, height, step.points, { antiAlias: step.antiAlias }));
+        break;
+      case "magic-wand":
+        next = shape(magicWand(pixelsFor(step), step.point, step.options ?? {}));
+        break;
+      case "color-range":
+        next = shape(colorRange(pixelsFor(step), step.samples, step.options ?? {}));
+        break;
+      case "color-range-preset":
+        next = shape(colorRangePreset(pixelsFor(step), step.preset, step.falloff !== void 0 ? { falloff: step.falloff } : {}));
+        break;
+      case "all":
+        next = fullSelection(width, height);
+        break;
+      case "invert":
+        next = sel ? invertSelection(sel) : fullSelection(width, height);
+        break;
+      case "modify":
+        if (!sel?.bounds) throw new Error(`Step ${i} (modify) has nothing selected to ${step.modify}; an earlier step must select something.`);
+        next = modifySelection(sel, step.modify, step.radius);
+        break;
+      case "refine":
+        if (!sel?.bounds) throw new Error(`Step ${i} (refine) has nothing selected to refine; an earlier step must select something.`);
+        next = refineSelection(stepNeedsPixels(step) ? pixelsFor(step) : null, sel, step.params);
+        break;
+    }
+    sel = next?.bounds ? next : null;
+  });
+  return sel;
+}
+function describeRecipe(steps) {
+  return steps.map((s, index) => ({ index, ...JSON.parse(JSON.stringify(s)) }));
+}
+var SHAPE_LABELS = { rect: "Rectangle", ellipse: "Ellipse" };
+var MODIFY_LABELS = { expand: "Expand", grow: "Expand", contract: "Contract", shrink: "Contract", feather: "Feather", border: "Border", smooth: "Smooth" };
+function describeRecipeStep(step) {
+  const r = (n) => Math.round(n);
+  switch (step.op) {
+    case "rect":
+    case "ellipse":
+      return `${SHAPE_LABELS[step.op]} ${r(step.rect.width)} \xD7 ${r(step.rect.height)} at ${r(step.rect.x)}, ${r(step.rect.y)}`;
+    case "polygon":
+      return `Polygon, ${step.points.length} points`;
+    case "magic-wand":
+      return `Magic Wand at ${r(step.point.x)}, ${r(step.point.y)}`;
+    case "color-range":
+      return `Color Range, ${step.samples.length} sample${step.samples.length === 1 ? "" : "s"}`;
+    case "color-range-preset":
+      return `Color Range: ${step.preset}`;
+    case "all":
+      return "Select All";
+    case "invert":
+      return "Inverse";
+    case "modify":
+      return `${MODIFY_LABELS[step.modify] ?? step.modify} ${step.radius} px`;
+    case "refine":
+      return "Refine Edge";
+  }
+}
+function recipeStepSetting(step) {
+  switch (step.op) {
+    case "rect":
+    case "ellipse":
+    case "polygon":
+      return { label: "feather", value: step.feather ?? 0, min: 0, max: 1e3, change: (v) => ({ feather: v }) };
+    case "magic-wand": {
+      const options = step.options ?? {};
+      return { label: "tolerance", value: Number(options.tolerance ?? 32), min: 0, max: 255, change: (v) => ({ options: { ...options, tolerance: v } }) };
+    }
+    case "color-range": {
+      const options = step.options ?? {};
+      return { label: "fuzziness", value: Number(options.fuzziness ?? 40), min: 0, max: 200, change: (v) => ({ options: { ...options, fuzziness: v } }) };
+    }
+    case "color-range-preset":
+      return step.preset === "highlights" || step.preset === "midtones" || step.preset === "shadows" ? { label: "falloff", value: step.falloff ?? 20, min: 0, max: 255, change: (v) => ({ falloff: v }) } : null;
+    case "modify":
+      return { label: "radius", value: step.radius, min: 0, max: 500, change: (v) => ({ radius: v }) };
+    case "refine":
+      return { label: "radius", value: step.params.radius ?? 8, min: 0, max: 64, change: (v) => ({ params: { ...step.params, radius: v } }) };
+    default:
+      return null;
+  }
+}
+
+// src/image-editor/selection/uncertainty.ts
+var BACKED = 0.2;
+function selectionUncertainty(mask, image, options = {}) {
+  const W = mask.width;
+  const H = mask.height;
+  const empty = () => ({ unknown: createSelectionMask(W, H), regions: [], count: 0, confidence: 1 });
+  const b = mask.bounds;
+  if (!b) return empty();
+  const band = Math.max(1, Math.round(options.band ?? Math.max(2, Math.min(W, H) / 200)));
+  const minArea = Math.max(1, options.minArea ?? 16);
+  const maxRegions = Math.max(1, options.maxRegions ?? 20);
+  const a = mask.data;
+  const gradient = createGradientSampler(image, W);
+  const x0 = Math.max(0, b.x - band - 1);
+  const y0 = Math.max(0, b.y - band - 1);
+  const x1 = Math.min(W, b.x + b.width + band + 1);
+  const y1 = Math.min(H, b.y + b.height + band + 1);
+  const w = x1 - x0;
+  const h = y1 - y0;
+  const evidence = new Float32Array(w * h).fill(NaN);
+  const seeds = new Uint8Array(w * h);
+  let sum = 0;
+  let n = 0;
+  const on = (x, y) => a[y * W + x] >= 128;
+  for (let y = y0; y < y1; y++) {
+    for (let x = x0; x < x1; x++) {
+      const v = on(x, y);
+      const differs = (nx, ny) => nx >= 0 && ny >= 0 && nx < W && ny < H && on(nx, ny) !== v;
+      if (!(differs(x - 1, y) || differs(x + 1, y) || differs(x, y - 1) || differs(x, y + 1))) continue;
+      let g = 0;
+      for (let dy = -2; dy <= 2; dy++) {
+        for (let dx = -2; dx <= 2; dx++) {
+          const nx = x + dx;
+          const ny = y + dy;
+          if (nx >= 0 && ny >= 0 && nx < W && ny < H) g = Math.max(g, gradient(nx, ny));
+        }
+      }
+      const e = Math.min(1, g / BACKED);
+      const k = (y - y0) * w + (x - x0);
+      evidence[k] = e;
+      sum += e;
+      n++;
+      if (e < 0.5) seeds[k] = 1;
+    }
+  }
+  if (!n) return empty();
+  const rows = new Uint8Array(w * h);
+  for (let y = 0; y < h; y++) {
+    let last = -Infinity;
+    for (let x = 0; x < w; x++) {
+      if (seeds[y * w + x]) last = x;
+      if (x - last <= band) rows[y * w + x] = 1;
+    }
+    last = Infinity;
+    for (let x = w - 1; x >= 0; x--) {
+      if (seeds[y * w + x]) last = x;
+      if (last - x <= band) rows[y * w + x] = 1;
+    }
+  }
+  const grown = new Uint8Array(w * h);
+  for (let x = 0; x < w; x++) {
+    let last = -Infinity;
+    for (let y = 0; y < h; y++) {
+      if (rows[y * w + x]) last = y;
+      if (y - last <= band) grown[y * w + x] = 1;
+    }
+    last = Infinity;
+    for (let y = h - 1; y >= 0; y--) {
+      if (rows[y * w + x]) last = y;
+      if (last - y <= band) grown[y * w + x] = 1;
+    }
+  }
+  const label = new Int32Array(w * h);
+  const stack = new Int32Array(w * h);
+  const found = [];
+  for (let start = 0; start < w * h; start++) {
+    if (!grown[start] || label[start]) continue;
+    const r = { area: 0, e: 0, en: 0, bx0: w, by0: h, bx1: -1, by1: -1 };
+    const id = found.length + 1;
+    let top = 0;
+    stack[top++] = start;
+    label[start] = id;
+    while (top) {
+      const k = stack[--top];
+      const i = k % w;
+      const j = (k - i) / w;
+      r.area++;
+      if (!Number.isNaN(evidence[k])) {
+        r.e += evidence[k];
+        r.en++;
+      }
+      if (i < r.bx0) r.bx0 = i;
+      if (i > r.bx1) r.bx1 = i;
+      if (j < r.by0) r.by0 = j;
+      if (j > r.by1) r.by1 = j;
+      for (let dy = -1; dy <= 1; dy++) {
+        for (let dx = -1; dx <= 1; dx++) {
+          const ni = i + dx;
+          const nj = j + dy;
+          if (ni < 0 || nj < 0 || ni >= w || nj >= h) continue;
+          const nk = nj * w + ni;
+          if (!grown[nk] || label[nk]) continue;
+          label[nk] = id;
+          stack[top++] = nk;
+        }
+      }
+    }
+    found.push(r);
+  }
+  const unknownData = new Uint8Array(W * H);
+  for (let y = 0; y < h; y++) {
+    for (let x = 0; x < w; x++) {
+      const id = label[y * w + x];
+      if (id && found[id - 1].area >= minArea) unknownData[(y + y0) * W + x + x0] = 255;
+    }
+  }
+  const kept = found.filter((r) => r.area >= minArea).map((r) => ({
+    bounds: { x: x0 + r.bx0, y: y0 + r.by0, width: r.bx1 - r.bx0 + 1, height: r.by1 - r.by0 + 1 },
+    area: r.area,
+    confidence: Math.round((r.en ? r.e / r.en : 0) * 1e3) / 1e3
+  })).sort((p, q) => p.confidence - q.confidence || q.area - p.area);
+  return {
+    unknown: createSelectionMask(W, H, unknownData),
+    regions: kept.slice(0, maxRegions),
+    count: kept.length,
+    confidence: Math.round(sum / n * 1e3) / 1e3
+  };
 }
 
 // src/image-editor/selection/path.ts
@@ -3339,12 +3871,12 @@ function pathToSelection(components, width, height, options = {}) {
   const rx1 = Math.min(width, Math.ceil(x1));
   const ry1 = Math.min(height, Math.ceil(y1));
   if (!(rx1 > rx0 && ry1 > ry0)) return createSelectionMask(width, height);
-  const rect2 = { x: rx0, y: ry0, width: rx1 - rx0, height: ry1 - ry0 };
-  const cov = componentsCoverage(components, rect2, options.fillRule ?? "nonzero");
+  const rect3 = { x: rx0, y: ry0, width: rx1 - rx0, height: ry1 - ry0 };
+  const cov = componentsCoverage(components, rect3, options.fillRule ?? "nonzero");
   const hard = options.antiAlias === false;
   const bytes = new Uint8Array(cov.length);
   for (let i = 0; i < cov.length; i++) bytes[i] = hard ? cov[i] >= 0.5 ? 255 : 0 : coverageToByte(cov[i]);
-  const mask = selectionFromRegion(width, height, rect2, bytes);
+  const mask = selectionFromRegion(width, height, rect3, bytes);
   const feather = options.feather ?? 0;
   return feather > 0 && mask.bounds ? modifySelection(mask, "feather", feather) : mask;
 }
@@ -3454,9 +3986,9 @@ var EdgeMap = class {
   }
 };
 var clampPixel = (v, max) => Math.min(max - 1, Math.max(0, Math.floor(v)));
-function snapToEdge(map, point, width = 10) {
-  const cx = clampPixel(point.x, map.width);
-  const cy = clampPixel(point.y, map.height);
+function snapToEdge(map, point2, width = 10) {
+  const cx = clampPixel(point2.x, map.width);
+  const cy = clampPixel(point2.y, map.height);
   const r = Math.max(0, Math.round(width));
   let best = 0;
   let bestD = Infinity;
@@ -3475,7 +4007,7 @@ function snapToEdge(map, point, width = 10) {
       }
     }
   }
-  return best > 0 ? { x: bx + 0.5, y: by + 0.5 } : point;
+  return best > 0 ? { x: bx + 0.5, y: by + 0.5 } : point2;
 }
 var Heap = class {
   ids = new Int32Array(256);
@@ -3810,681 +4342,351 @@ var ShapeDrawGesture = class {
     this.start = null;
     return this.layerId;
   }
-  cancel() {
-    this.start = null;
-  }
-};
-function applyShapeOptions(controller, layerId, change) {
-  const info = controller.getShapeLayer(layerId);
-  const style = {};
-  if ("fill" in change) style.fill = change.fill ?? null;
-  if ("stroke" in change || "strokeWidth" in change) {
-    const color = "stroke" in change ? change.stroke : info.stroke?.paint.type === "color" ? info.stroke.paint.color : null;
-    style.stroke = color ? { width: change.strokeWidth ?? info.stroke?.width ?? 2, paint: color } : null;
-  }
-  if (Object.keys(style).length) controller.setShapeStyle(layerId, style);
-  const live = info.components[0]?.live;
-  if (!live) return;
-  const shape = {};
-  if (live.kind === "rect" && change.radius !== void 0) shape.radius = change.radius;
-  if (live.kind === "polygon" && change.sides !== void 0) shape.sides = change.sides;
-  if (live.kind === "star" && change.points !== void 0) shape.points = change.points;
-  if (live.kind === "star" && change.innerRatio !== void 0) shape.innerRatio = change.innerRatio;
-  if (live.kind === "line" && change.weight !== void 0) shape.weight = change.weight;
-  if (live.kind === "line" && change.arrow !== void 0) shape.endArrow = change.arrow ? { width: (live.weight || 1) * 4, length: (live.weight || 1) * 4 } : null;
-  if (Object.keys(shape).length) controller.setShapeComponent(layerId, 0, { shape });
-}
-var TextEditSession = class {
-  constructor(controller, layerId, index) {
-    this.controller = controller;
-    this.layerId = layerId;
-    const n = this.text.length;
-    this.anchor = this.focus = Math.max(0, Math.min(n, index ?? n));
-  }
-  controller;
-  layerId;
-  anchor;
-  focus;
-  changed = false;
-  listeners = /* @__PURE__ */ new Set();
-  error = null;
-  get layer() {
-    const l = findLayer(this.controller.getLayers(), this.layerId)?.layer;
-    if (!l || l.type !== "type") throw new Error("The type layer being edited is gone.");
-    return l;
-  }
-  get text() {
-    return this.layer.text;
-  }
-  get start() {
-    return Math.min(this.anchor, this.focus);
-  }
-  get end() {
-    return Math.max(this.anchor, this.focus);
-  }
-  /** Whether the layer still exists (it can be deleted or undone away while editing). */
-  get alive() {
-    return findLayer(this.controller.getLayers(), this.layerId)?.layer.type === "type";
-  }
-  subscribe(fn) {
-    this.listeners.add(fn);
-    return () => this.listeners.delete(fn);
-  }
-  emit() {
-    for (const l of this.listeners) l();
-  }
-  layout() {
-    return this.controller.getTextLayout(this.layerId);
-  }
-  run(fn) {
-    this.error = null;
-    try {
-      const out = fn(!this.changed);
-      this.changed = true;
-      return out;
-    } catch (e) {
-      this.error = e instanceof Error ? e.message : String(e);
-      return void 0;
-    } finally {
-      this.emit();
-    }
-  }
-  /** Replaces the selection with `text` (typing and pasting). */
-  insert(text) {
-    if (!text) return;
-    const s = this.start;
-    const e = this.end;
-    const done = this.run((commit) => this.controller.setText(this.layerId, text, { start: s, end: e }, commit));
-    if (done) this.anchor = this.focus = s + text.replace(/\r\n?/g, "\n").length;
-  }
-  /** Backspace: the selection, else the character before the caret. */
-  deleteBackward() {
-    if (this.start === this.end && this.start === 0) return;
-    const s = this.start === this.end ? Math.max(0, this.start - this.surrogate(this.start - 1, -1)) : this.start;
-    const e = this.end;
-    if (this.run((commit) => this.controller.setText(this.layerId, "", { start: s, end: e }, commit))) this.anchor = this.focus = s;
-  }
-  /** Delete: the selection, else the character after the caret. */
-  deleteForward() {
-    const n = this.text.length;
-    if (this.start === this.end && this.end >= n) return;
-    const s = this.start;
-    const e = this.start === this.end ? Math.min(n, this.end + this.surrogate(this.end, 1)) : this.end;
-    if (this.run((commit) => this.controller.setText(this.layerId, "", { start: s, end: e }, commit))) this.anchor = this.focus = s;
-  }
-  /** 2 when the code unit at `i` is half of a surrogate pair (moving `dir`), else 1. */
-  surrogate(i, dir) {
-    const t = this.text;
-    const c = t.charCodeAt(i);
-    if (dir < 0 && c >= 56320 && c <= 57343 && i > 0) return 2;
-    if (dir > 0 && c >= 55296 && c <= 56319 && i + 1 < t.length) return 2;
-    return 1;
-  }
-  /**
-   * Moves the caret (Shift extends the selection): `left` / `right` along the line, `up` / `down`
-   * between lines, `home` / `end` of the line, `start` / `finish` of the text. Arrow keys of vertical
-   * text map onto these through `textArrowStep` in `handleKey`.
-   */
-  move(to, extend = false) {
-    const n = this.text.length;
-    let f = this.focus;
-    const collapsedJump = !extend && this.start !== this.end;
-    if (to === "left") f = collapsedJump ? this.start : Math.max(0, f - this.surrogate(f - 1, -1));
-    else if (to === "right") f = collapsedJump ? this.end : Math.min(n, f + this.surrogate(f, 1));
-    else if (to === "start") f = 0;
-    else if (to === "finish") f = n;
-    else {
-      const layout = this.layout();
-      if (layout && layout.lines.length) {
-        const c = caretAt(layout, f);
-        const line = layout.lines[c.line];
-        if (to === "home") f = line.start;
-        else if (to === "end") {
-          const last = line.chars[line.chars.length - 1];
-          f = last ? Math.min(n, last.index + 1) : line.start;
-          if (last && this.text[last.index] === " " && c.line < layout.lines.length - 1) f = last.index;
-        } else f = textLineMove(layout, f, to === "up" ? -1 : 1, n);
-      }
-    }
-    this.focus = f;
-    if (!extend) this.anchor = f;
-    this.emit();
-  }
-  selectAll() {
-    this.anchor = 0;
-    this.focus = this.text.length;
-    this.emit();
-  }
-  /** Places the caret at a document point (Shift-click extends). */
-  pointAt(p, extend = false) {
-    this.focus = this.controller.textIndexAt(this.layerId, p);
-    if (!extend) this.anchor = this.focus;
-    this.emit();
-  }
-  /** Handles a key; returns `true` when it was the session's (the caller then prevents the default). */
-  handleKey(e) {
-    const mod2 = e.metaKey || e.ctrlKey;
-    if (mod2 && e.key.toLowerCase() === "a") {
-      this.selectAll();
-      return true;
-    }
-    switch (e.key) {
-      case "Backspace":
-        this.deleteBackward();
-        return true;
-      case "Delete":
-        this.deleteForward();
-        return true;
-      case "Enter":
-        this.insert("\n");
-        return true;
-      case "ArrowLeft":
-      case "ArrowRight":
-      case "ArrowUp":
-      case "ArrowDown": {
-        const step = textArrowStep(this.layer.orientation, e.key);
-        if (step === "previous") this.move(mod2 ? "home" : "left", e.shiftKey);
-        else if (step === "next") this.move(mod2 ? "end" : "right", e.shiftKey);
-        else if (step === "line-before") this.move(mod2 ? "start" : "up", e.shiftKey);
-        else this.move(mod2 ? "finish" : "down", e.shiftKey);
-        return true;
-      }
-      case "Home":
-        this.move("home", e.shiftKey);
-        return true;
-      case "End":
-        this.move("end", e.shiftKey);
-        return true;
-      case "Tab":
-        this.insert("	");
-        return true;
-    }
-    if (!mod2 && !e.altKey && e.key.length >= 1 && [...e.key].length === 1) {
-      this.insert(e.key);
-      return true;
-    }
-    return false;
-  }
-  /** Sets character style fields on the selection, or on the whole text when nothing is selected. */
-  setStyle(style) {
-    const s = this.start;
-    const e = this.end;
-    const range = s === e ? {} : { start: s, end: e };
-    this.run((commit) => this.controller.setTextStyle(this.layerId, style, range, commit));
-  }
-  /** Sets paragraph fields on the paragraphs the selection touches. */
-  setParagraph(style) {
-    const s = this.start;
-    const e = this.end;
-    this.run((commit) => this.controller.setParagraphStyle(this.layerId, style, { start: s, end: e }, commit));
-  }
-  /** The style at the caret (or the selection's start), for the options bar. */
-  styleHere() {
-    const layer = this.layer;
-    const at = this.start > 0 && this.start === this.end ? this.start - 1 : this.start;
-    return styleAt(layer.runs, at, DEFAULT_TEXT_STYLE);
-  }
-  info() {
-    return this.controller.getTextLayer(this.layerId);
-  }
-  /** The caret, the selection and the frame in natural pixels, for `RenderOptions.textEdit`. */
-  overlay() {
-    const layer = this.layer;
-    const layout = this.layout();
-    const m = textMatrix(layer);
-    const at = (x, y) => applyMatrix(m, { x, y });
-    let frame = null;
-    if (layer.frame.kind === "box") frame = [at(0, 0), at(layer.frame.width, 0), at(layer.frame.width, layer.frame.height), at(0, layer.frame.height)];
-    else if (layout) {
-      const b = layout.bounds;
-      frame = [at(b.x, b.y), at(b.x + b.width, b.y), at(b.x + b.width, b.y + b.height), at(b.x, b.y + b.height)];
-    }
-    if (!layout) return { caret: null, selection: [], frame };
-    const selection = textSelectionQuads(layout, this.start, this.end).map((q) => q.map((p) => at(p.x, p.y)));
-    const c = caretAt(layout, this.focus);
-    return { caret: [at(c.from.x, c.from.y), at(c.to.x, c.to.y)], selection, frame };
-  }
-  /** Ends editing: an empty layer made for this session is deleted (as Photoshop does). Returns whether the layer remains. */
-  close() {
-    if (!this.alive) return false;
-    if (!this.text.trim().length) {
-      try {
-        this.controller.removeLayer(this.layerId);
-      } catch {
-      }
-      return false;
-    }
-    if (this.layer.name === "Text" && this.changed) {
-      try {
-        this.controller.setLayerProperties(this.layerId, { name: typeLayerName(this.text) }, false);
-      } catch {
-      }
-    }
-    return true;
+  cancel() {
+    this.start = null;
   }
 };
-function typeLayerAt(controller, p, slop = 4) {
-  const layers = [...flattenTypeLayers(controller.getLayers())].reverse();
-  for (const l of layers) {
-    if (!l.visible) continue;
-    const inv = invert(textMatrix(l));
-    const q = applyMatrix(inv, p);
-    let b = null;
-    if (l.frame.kind === "box") b = { x: 0, y: 0, width: l.frame.width, height: l.frame.height };
-    else {
-      const layout = controller.getTextLayout(l.id);
-      if (layout) b = layout.bounds;
-    }
-    if (b && q.x >= b.x - slop && q.x <= b.x + b.width + slop && q.y >= b.y - slop && q.y <= b.y + b.height + slop) return l.id;
+function applyShapeOptions(controller, layerId, change) {
+  const info = controller.getShapeLayer(layerId);
+  const style = {};
+  if ("fill" in change) style.fill = change.fill ?? null;
+  if ("stroke" in change || "strokeWidth" in change) {
+    const color = "stroke" in change ? change.stroke : info.stroke?.paint.type === "color" ? info.stroke.paint.color : null;
+    style.stroke = color ? { width: change.strokeWidth ?? info.stroke?.width ?? 2, paint: color } : null;
   }
-  return null;
-}
-function flattenTypeLayers(layers) {
-  const out = [];
-  const walk = (list) => {
-    for (const l of list) {
-      if (l.type === "type") out.push(l);
-      else if (l.type === "group") walk(l.children);
-    }
-  };
-  walk(layers);
-  return out;
-}
-function invert(m) {
-  const [a, b, c, d, e, f] = m;
-  const det = a * d - b * c || 1;
-  return [d / det, -b / det, -c / det, a / det, (c * f - d * e) / det, (b * e - a * f) / det];
+  if (Object.keys(style).length) controller.setShapeStyle(layerId, style);
+  const live = info.components[0]?.live;
+  if (!live) return;
+  const shape = {};
+  if (live.kind === "rect" && change.radius !== void 0) shape.radius = change.radius;
+  if (live.kind === "polygon" && change.sides !== void 0) shape.sides = change.sides;
+  if (live.kind === "star" && change.points !== void 0) shape.points = change.points;
+  if (live.kind === "star" && change.innerRatio !== void 0) shape.innerRatio = change.innerRatio;
+  if (live.kind === "line" && change.weight !== void 0) shape.weight = change.weight;
+  if (live.kind === "line" && change.arrow !== void 0) shape.endArrow = change.arrow ? { width: (live.weight || 1) * 4, length: (live.weight || 1) * 4 } : null;
+  if (Object.keys(shape).length) controller.setShapeComponent(layerId, 0, { shape });
 }
-var TypeToolGesture = class {
-  constructor(controller, options) {
+var TextEditSession = class {
+  constructor(controller, layerId, index) {
     this.controller = controller;
-    this.options = options;
+    this.layerId = layerId;
+    const n = this.text.length;
+    this.anchor = this.focus = Math.max(0, Math.min(n, index ?? n));
   }
   controller;
-  options;
-  session = null;
-  dragStart = null;
+  layerId;
+  anchor;
+  focus;
+  changed = false;
+  listeners = /* @__PURE__ */ new Set();
   error = null;
-  down(p, mods = {}) {
-    this.error = null;
-    const hit = typeLayerAt(this.controller, p);
-    if (this.session && this.session.alive && hit === this.session.layerId) {
-      this.session.pointAt(p, mods.shift);
-      this.dragStart = null;
-      return;
-    }
-    this.finish();
-    if (hit) {
-      this.controller.setActiveLayer(hit);
-      this.session = new TextEditSession(this.controller, hit, this.controller.textIndexAt(hit, p));
-      this.dragStart = null;
-      return;
-    }
-    this.dragStart = { x: p.x, y: p.y };
+  get layer() {
+    const l = findLayer(this.controller.getLayers(), this.layerId)?.layer;
+    if (!l || l.type !== "type") throw new Error("The type layer being edited is gone.");
+    return l;
   }
-  /** Releases a click or drag that did not land on type: adds a new text layer (point text, or a box for a drag). */
-  up(p) {
-    const start = this.dragStart;
-    this.dragStart = null;
-    if (!start) return this.session;
-    const o = this.options();
-    const w = Math.abs(p.x - start.x);
-    const h = Math.abs(p.y - start.y);
+  get text() {
+    return this.layer.text;
+  }
+  get start() {
+    return Math.min(this.anchor, this.focus);
+  }
+  get end() {
+    return Math.max(this.anchor, this.focus);
+  }
+  /** Whether the layer still exists (it can be deleted or undone away while editing). */
+  get alive() {
+    return findLayer(this.controller.getLayers(), this.layerId)?.layer.type === "type";
+  }
+  subscribe(fn) {
+    this.listeners.add(fn);
+    return () => this.listeners.delete(fn);
+  }
+  emit() {
+    for (const l of this.listeners) l();
+  }
+  layout() {
+    return this.controller.getTextLayout(this.layerId);
+  }
+  run(fn) {
+    this.error = null;
     try {
-      const box = w >= 8 && h >= 8 ? { width: w, height: h } : void 0;
-      const id = this.controller.addTextLayer({
-        text: "",
-        x: box ? Math.min(start.x, p.x) : start.x,
-        y: box ? Math.min(start.y, p.y) : start.y,
-        ...box ? { box } : {},
-        style: { fontFamily: o.fontFamily, fontSize: o.fontSize, fontWeight: o.fontWeight, italic: o.italic, color: o.color },
-        paragraph: o.align !== "left" ? { align: o.align } : {},
-        ...o.orientation === "vertical" ? { orientation: "vertical" } : {},
-        name: "Text"
-      });
-      this.session = new TextEditSession(this.controller, id, 0);
+      const out = fn(!this.changed);
+      this.changed = true;
+      return out;
     } catch (e) {
       this.error = e instanceof Error ? e.message : String(e);
+      return void 0;
+    } finally {
+      this.emit();
     }
-    return this.session;
   }
-  /** Ends the open session (an empty new layer is removed). */
-  finish() {
-    const s = this.session;
-    this.session = null;
-    s?.close();
+  /** Replaces the selection with `text` (typing and pasting). */
+  insert(text) {
+    if (!text) return;
+    const s = this.start;
+    const e = this.end;
+    const done = this.run((commit) => this.controller.setText(this.layerId, text, { start: s, end: e }, commit));
+    if (done) this.anchor = this.focus = s + text.replace(/\r\n?/g, "\n").length;
   }
-};
-
-// src/image-editor/selection/wand.ts
-function checkPixels(p) {
-  const n = p.width * p.height;
-  if (!Number.isInteger(p.width) || !Number.isInteger(p.height) || p.width < 1 || p.height < 1) {
-    throw new Error("Invalid pixel buffer size");
+  /** Backspace: the selection, else the character before the caret. */
+  deleteBackward() {
+    if (this.start === this.end && this.start === 0) return;
+    const s = this.start === this.end ? Math.max(0, this.start - this.surrogate(this.start - 1, -1)) : this.start;
+    const e = this.end;
+    if (this.run((commit) => this.controller.setText(this.layerId, "", { start: s, end: e }, commit))) this.anchor = this.focus = s;
   }
-  if (p.data.length < n * 4) throw new Error("Pixel data is shorter than width \xD7 height \xD7 4");
-  return n;
-}
-var SRGB_TO_LINEAR2 = (() => {
-  const t = new Float32Array(256);
-  for (let i = 0; i < 256; i++) {
-    const v = i / 255;
-    t[i] = v <= 0.04045 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
+  /** Delete: the selection, else the character after the caret. */
+  deleteForward() {
+    const n = this.text.length;
+    if (this.start === this.end && this.end >= n) return;
+    const s = this.start;
+    const e = this.start === this.end ? Math.min(n, this.end + this.surrogate(this.end, 1)) : this.end;
+    if (this.run((commit) => this.controller.setText(this.layerId, "", { start: s, end: e }, commit))) this.anchor = this.focus = s;
   }
-  return t;
-})();
-var labF = (t) => t > 216 / 24389 ? Math.cbrt(t) : (24389 / 27 * t + 16) / 116;
-function srgb8ToLab(r, g, b) {
-  const rl = SRGB_TO_LINEAR2[r & 255];
-  const gl = SRGB_TO_LINEAR2[g & 255];
-  const bl = SRGB_TO_LINEAR2[b & 255];
-  const x = (0.4124564 * rl + 0.3575761 * gl + 0.1804375 * bl) / 0.95047;
-  const y = 0.2126729 * rl + 0.7151522 * gl + 0.072175 * bl;
-  const z = (0.0193339 * rl + 0.119192 * gl + 0.9503041 * bl) / 1.08883;
-  const fx = labF(x);
-  const fy = labF(y);
-  const fz = labF(z);
-  return [116 * fy - 16, 500 * (fx - fy), 200 * (fy - fz)];
-}
-function similarity(pixels, seed, tolerance, distance) {
-  const d = pixels.data;
-  const tr = d[seed * 4];
-  const tg = d[seed * 4 + 1];
-  const tb = d[seed * 4 + 2];
-  const ta = d[seed * 4 + 3];
-  const tol = Math.max(0, Math.floor(tolerance + 1e-3));
-  if (distance === "perceptual") {
-    const [tl, taa, tbb] = srgb8ToLab(tr, tg, tb);
-    const de = Math.max(0, tolerance) * 100 / 255;
-    const de2 = de * de + 1e-6;
-    return (i) => {
-      const p = i * 4;
-      const a = d[p + 3];
-      if (ta === 0 && a === 0) return true;
-      if (Math.abs(a - ta) > tol) return false;
-      const [l, aa, bb] = srgb8ToLab(d[p], d[p + 1], d[p + 2]);
-      return (l - tl) ** 2 + (aa - taa) ** 2 + (bb - tbb) ** 2 <= de2;
-    };
+  /** 2 when the code unit at `i` is half of a surrogate pair (moving `dir`), else 1. */
+  surrogate(i, dir) {
+    const t = this.text;
+    const c = t.charCodeAt(i);
+    if (dir < 0 && c >= 56320 && c <= 57343 && i > 0) return 2;
+    if (dir > 0 && c >= 55296 && c <= 56319 && i + 1 < t.length) return 2;
+    return 1;
   }
-  return (i) => {
-    const p = i * 4;
-    const a = d[p + 3];
-    if (ta === 0 && a === 0) return true;
-    return Math.abs(d[p] - tr) <= tol && Math.abs(d[p + 1] - tg) <= tol && Math.abs(d[p + 2] - tb) <= tol && Math.abs(a - ta) <= tol;
-  };
-}
-function antialiasMarks(marks, w, h, x0, y0, x1, y1) {
-  const out = marks.slice();
-  for (let y = y0; y < y1; y++) {
-    for (let x = x0; x < x1; x++) {
-      const i = y * w + x;
-      const v = marks[i];
-      let sum = 0;
-      let edge = false;
-      for (let dy = -1; dy <= 1; dy++) {
-        const ny = y + dy;
-        for (let dx = -1; dx <= 1; dx++) {
-          const nx = x + dx;
-          const n = nx < 0 || ny < 0 || nx >= w || ny >= h ? v : marks[ny * w + nx];
-          if (n !== v) edge = true;
-          sum += n;
-        }
-      }
-      if (edge) {
-        const avg = sum / (9 * 255);
-        out[i] = Math.round((v > 127 ? 0.5 + 0.5 * avg : 0.5 * avg) * 255);
+  /**
+   * Moves the caret (Shift extends the selection): `left` / `right` along the line, `up` / `down`
+   * between lines, `home` / `end` of the line, `start` / `finish` of the text. Arrow keys of vertical
+   * text map onto these through `textArrowStep` in `handleKey`.
+   */
+  move(to, extend = false) {
+    const n = this.text.length;
+    let f = this.focus;
+    const collapsedJump = !extend && this.start !== this.end;
+    if (to === "left") f = collapsedJump ? this.start : Math.max(0, f - this.surrogate(f - 1, -1));
+    else if (to === "right") f = collapsedJump ? this.end : Math.min(n, f + this.surrogate(f, 1));
+    else if (to === "start") f = 0;
+    else if (to === "finish") f = n;
+    else {
+      const layout = this.layout();
+      if (layout && layout.lines.length) {
+        const c = caretAt(layout, f);
+        const line = layout.lines[c.line];
+        if (to === "home") f = line.start;
+        else if (to === "end") {
+          const last = line.chars[line.chars.length - 1];
+          f = last ? Math.min(n, last.index + 1) : line.start;
+          if (last && this.text[last.index] === " " && c.line < layout.lines.length - 1) f = last.index;
+        } else f = textLineMove(layout, f, to === "up" ? -1 : 1, n);
       }
     }
+    this.focus = f;
+    if (!extend) this.anchor = f;
+    this.emit();
   }
-  return out;
-}
-function magicWand(pixels, seed, options = {}) {
-  const n = checkPixels(pixels);
-  const { width: w, height: h } = pixels;
-  const sx = Math.floor(seed.x);
-  const sy = Math.floor(seed.y);
-  if (!(sx >= 0 && sy >= 0 && sx < w && sy < h)) return createSelectionMask(w, h);
-  const similar = similarity(pixels, sy * w + sx, options.tolerance ?? 32, options.distance ?? "rgb");
-  const marks = new Uint8Array(n);
-  let bx0 = w;
-  let by0 = h;
-  let bx1 = -1;
-  let by1 = -1;
-  if (options.contiguous ?? true) {
-    const stack = [sy * w + sx];
-    while (stack.length) {
-      const idx = stack.pop();
-      if (marks[idx]) continue;
-      const y = idx / w | 0;
-      const row = y * w;
-      let l = idx - row;
-      let r = l;
-      while (l > 0 && !marks[row + l - 1] && similar(row + l - 1)) l--;
-      while (r + 1 < w && !marks[row + r + 1] && similar(row + r + 1)) r++;
-      marks.fill(255, row + l, row + r + 1);
-      if (l < bx0) bx0 = l;
-      if (r > bx1) bx1 = r;
-      if (y < by0) by0 = y;
-      if (y > by1) by1 = y;
-      for (const ny of [y - 1, y + 1]) {
-        if (ny < 0 || ny >= h) continue;
-        const nrow = ny * w;
-        let inRun = false;
-        for (let nx = l; nx <= r; nx++) {
-          const ok = !marks[nrow + nx] && similar(nrow + nx);
-          if (ok && !inRun) stack.push(nrow + nx);
-          inRun = ok;
-        }
-      }
+  selectAll() {
+    this.anchor = 0;
+    this.focus = this.text.length;
+    this.emit();
+  }
+  /** Places the caret at a document point (Shift-click extends). */
+  pointAt(p, extend = false) {
+    this.focus = this.controller.textIndexAt(this.layerId, p);
+    if (!extend) this.anchor = this.focus;
+    this.emit();
+  }
+  /** Handles a key; returns `true` when it was the session's (the caller then prevents the default). */
+  handleKey(e) {
+    const mod2 = e.metaKey || e.ctrlKey;
+    if (mod2 && e.key.toLowerCase() === "a") {
+      this.selectAll();
+      return true;
     }
-  } else {
-    for (let y = 0; y < h; y++) {
-      const row = y * w;
-      for (let x = 0; x < w; x++) {
-        if (similar(row + x)) {
-          marks[row + x] = 255;
-          if (x < bx0) bx0 = x;
-          if (x > bx1) bx1 = x;
-          if (y < by0) by0 = y;
-          if (y > by1) by1 = y;
-        }
+    switch (e.key) {
+      case "Backspace":
+        this.deleteBackward();
+        return true;
+      case "Delete":
+        this.deleteForward();
+        return true;
+      case "Enter":
+        this.insert("\n");
+        return true;
+      case "ArrowLeft":
+      case "ArrowRight":
+      case "ArrowUp":
+      case "ArrowDown": {
+        const step = textArrowStep(this.layer.orientation, e.key);
+        if (step === "previous") this.move(mod2 ? "home" : "left", e.shiftKey);
+        else if (step === "next") this.move(mod2 ? "end" : "right", e.shiftKey);
+        else if (step === "line-before") this.move(mod2 ? "start" : "up", e.shiftKey);
+        else this.move(mod2 ? "finish" : "down", e.shiftKey);
+        return true;
       }
+      case "Home":
+        this.move("home", e.shiftKey);
+        return true;
+      case "End":
+        this.move("end", e.shiftKey);
+        return true;
+      case "Tab":
+        this.insert("	");
+        return true;
+    }
+    if (!mod2 && !e.altKey && e.key.length >= 1 && [...e.key].length === 1) {
+      this.insert(e.key);
+      return true;
     }
+    return false;
   }
-  if (bx1 < 0) return createSelectionMask(w, h);
-  if (!(options.antiAlias ?? true)) return createSelectionMask(w, h, marks);
-  return createSelectionMask(
-    w,
-    h,
-    antialiasMarks(marks, w, h, Math.max(0, bx0 - 1), Math.max(0, by0 - 1), Math.min(w, bx1 + 2), Math.min(h, by1 + 2))
-  );
-}
-function sampleColor(c) {
-  if (typeof c === "string") {
-    const m = /^#?([0-9a-f]{6})$/i.exec(c.trim());
-    if (!m) throw new Error(`Invalid colour "${c}"`);
-    const v = parseInt(m[1], 16);
-    return [v >> 16 & 255, v >> 8 & 255, v & 255];
+  /** Sets character style fields on the selection, or on the whole text when nothing is selected. */
+  setStyle(style) {
+    const s = this.start;
+    const e = this.end;
+    const range = s === e ? {} : { start: s, end: e };
+    this.run((commit) => this.controller.setTextStyle(this.layerId, style, range, commit));
   }
-  return [c[0], c[1], c[2]];
-}
-function colorRange(pixels, samples, options = {}) {
-  const n = checkPixels(pixels);
-  const { width: w, height: h, data } = pixels;
-  const f = Math.max(0, options.fuzziness ?? 40) + 1;
-  const parsed = samples.map((s) => ({ c: sampleColor(s.color), at: s.at }));
-  const radius = options.localized !== void 0 ? Math.max(1, options.localized) : void 0;
-  const out = new Uint8Array(n);
-  if (!parsed.length) return createSelectionMask(w, h, out);
-  for (let i = 0; i < n; i++) {
-    const p = i * 4;
-    if (data[p + 3] <= 0) continue;
-    const x = i % w;
-    const y = (i - x) / w;
-    let best = 0;
-    for (const s of parsed) {
-      const d = Math.max(Math.abs(data[p] - s.c[0]), Math.abs(data[p + 1] - s.c[1]), Math.abs(data[p + 2] - s.c[2]));
-      let k = Math.min(1, Math.max(0, 1 - d / f));
-      if (k > 0 && radius !== void 0 && s.at) {
-        const dist2 = Math.hypot(x - s.at.x, y - s.at.y);
-        k *= Math.min(1, Math.max(0, 1 - dist2 / radius));
+  /** Sets paragraph fields on the paragraphs the selection touches. */
+  setParagraph(style) {
+    const s = this.start;
+    const e = this.end;
+    this.run((commit) => this.controller.setParagraphStyle(this.layerId, style, { start: s, end: e }, commit));
+  }
+  /** The style at the caret (or the selection's start), for the options bar. */
+  styleHere() {
+    const layer = this.layer;
+    const at = this.start > 0 && this.start === this.end ? this.start - 1 : this.start;
+    return styleAt(layer.runs, at, DEFAULT_TEXT_STYLE);
+  }
+  info() {
+    return this.controller.getTextLayer(this.layerId);
+  }
+  /** The caret, the selection and the frame in natural pixels, for `RenderOptions.textEdit`. */
+  overlay() {
+    const layer = this.layer;
+    const layout = this.layout();
+    const m = textMatrix(layer);
+    const at = (x, y) => applyMatrix(m, { x, y });
+    let frame = null;
+    if (layer.frame.kind === "box") frame = [at(0, 0), at(layer.frame.width, 0), at(layer.frame.width, layer.frame.height), at(0, layer.frame.height)];
+    else if (layout) {
+      const b = layout.bounds;
+      frame = [at(b.x, b.y), at(b.x + b.width, b.y), at(b.x + b.width, b.y + b.height), at(b.x, b.y + b.height)];
+    }
+    if (!layout) return { caret: null, selection: [], frame };
+    const selection = textSelectionQuads(layout, this.start, this.end).map((q) => q.map((p) => at(p.x, p.y)));
+    const c = caretAt(layout, this.focus);
+    return { caret: [at(c.from.x, c.from.y), at(c.to.x, c.to.y)], selection, frame };
+  }
+  /** Ends editing: an empty layer made for this session is deleted (as Photoshop does). Returns whether the layer remains. */
+  close() {
+    if (!this.alive) return false;
+    if (!this.text.trim().length) {
+      try {
+        this.controller.removeLayer(this.layerId);
+      } catch {
       }
-      if (k > best) best = k;
+      return false;
     }
-    out[i] = coverageToByte(best);
+    if (this.layer.name === "Text" && this.changed) {
+      try {
+        this.controller.setLayerProperties(this.layerId, { name: typeLayerName(this.text) }, false);
+      } catch {
+      }
+    }
+    return true;
   }
-  return createSelectionMask(w, h, out);
-}
-var TONE_RANGE_PRESETS = {
-  shadows: [0, 65],
-  midtones: [105, 150],
-  highlights: [190, 255]
 };
-function toneRange(pixels, range, falloff = 20) {
-  const n = checkPixels(pixels);
-  const [lo, hi] = typeof range === "string" ? TONE_RANGE_PRESETS[range] : range;
-  const ramp2 = Math.max(1e-3, falloff);
-  const out = new Uint8Array(n);
-  const d = pixels.data;
-  for (let i = 0; i < n; i++) {
-    const p = i * 4;
-    if (d[p + 3] <= 0) continue;
-    const l = Math.min(255, Math.max(0, 0.299 * d[p] + 0.587 * d[p + 1] + 0.114 * d[p + 2]));
-    const outside = l < lo ? lo - l : l > hi ? l - hi : 0;
-    out[i] = coverageToByte(1 - outside / ramp2);
-  }
-  return createSelectionMask(pixels.width, pixels.height, out);
-}
-function hueRange(pixels, center) {
-  const n = checkPixels(pixels);
-  const out = new Uint8Array(n);
-  const d = pixels.data;
-  for (let i = 0; i < n; i++) {
-    const p = i * 4;
-    if (d[p + 3] <= 0) continue;
-    const r = d[p] / 255;
-    const g = d[p + 1] / 255;
-    const b = d[p + 2] / 255;
-    const mx = Math.max(r, g, b);
-    const mn = Math.min(r, g, b);
-    const chroma = mx - mn;
-    if (chroma <= 0) continue;
-    let hue;
-    if (mx === r) hue = ((g - b) / chroma % 6 + 6) % 6;
-    else if (mx === g) hue = (b - r) / chroma + 2;
-    else hue = (r - g) / chroma + 4;
-    hue *= 60;
-    let dh = ((hue - center) % 360 + 360) % 360;
-    dh = Math.min(dh, 360 - dh);
-    out[i] = coverageToByte(Math.min(1, Math.max(0, 1 - dh / 60)) * chroma * (2 - mx));
+function typeLayerAt(controller, p, slop = 4) {
+  const layers = [...flattenTypeLayers(controller.getLayers())].reverse();
+  for (const l of layers) {
+    if (!l.visible) continue;
+    const inv = invert(textMatrix(l));
+    const q = applyMatrix(inv, p);
+    let b = null;
+    if (l.frame.kind === "box") b = { x: 0, y: 0, width: l.frame.width, height: l.frame.height };
+    else {
+      const layout = controller.getTextLayout(l.id);
+      if (layout) b = layout.bounds;
+    }
+    if (b && q.x >= b.x - slop && q.x <= b.x + b.width + slop && q.y >= b.y - slop && q.y <= b.y + b.height + slop) return l.id;
   }
-  return createSelectionMask(pixels.width, pixels.height, out);
-}
-var HUE_RANGE_PRESETS = { reds: 0, yellows: 60, greens: 120, cyans: 180, blues: 240, magentas: 300 };
-var COLOR_RANGE_PRESETS = [
-  ...Object.keys(HUE_RANGE_PRESETS),
-  "highlights",
-  "midtones",
-  "shadows",
-  "skinTones"
-];
-function isColorRangePreset(v) {
-  return typeof v === "string" && COLOR_RANGE_PRESETS.includes(v);
+  return null;
 }
-var ramp = (v, lo, hi, soft) => v < lo ? Math.max(0, 1 - (lo - v) / soft) : v > hi ? Math.max(0, 1 - (v - hi) / soft) : 1;
-function skinToneRange(pixels) {
-  const n = checkPixels(pixels);
-  const out = new Uint8Array(n);
-  const d = pixels.data;
-  for (let i = 0; i < n; i++) {
-    const p = i * 4;
-    if (d[p + 3] <= 0) continue;
-    const r = d[p] / 255;
-    const g = d[p + 1] / 255;
-    const b = d[p + 2] / 255;
-    const mx = Math.max(r, g, b);
-    const mn = Math.min(r, g, b);
-    const chroma = mx - mn;
-    if (chroma <= 0 || mx <= 0) continue;
-    let hue;
-    if (mx === r) hue = ((g - b) / chroma % 6 + 6) % 6;
-    else if (mx === g) hue = (b - r) / chroma + 2;
-    else hue = (r - g) / chroma + 4;
-    hue *= 60;
-    if (hue > 180) hue -= 360;
-    const k = ramp(hue, 5, 40, 20) * ramp(chroma / mx, 0.12, 0.8, 0.1) * ramp(mx, 0.3, 1, 0.15);
-    out[i] = coverageToByte(k);
-  }
-  return createSelectionMask(pixels.width, pixels.height, out);
+function flattenTypeLayers(layers) {
+  const out = [];
+  const walk = (list) => {
+    for (const l of list) {
+      if (l.type === "type") out.push(l);
+      else if (l.type === "group") walk(l.children);
+    }
+  };
+  walk(layers);
+  return out;
 }
-function colorRangePreset(pixels, preset, options = {}) {
-  if (preset === "skinTones") return skinToneRange(pixels);
-  if (preset === "highlights" || preset === "midtones" || preset === "shadows") return toneRange(pixels, preset, options.falloff ?? 20);
-  if (preset in HUE_RANGE_PRESETS) return hueRange(pixels, HUE_RANGE_PRESETS[preset]);
-  throw new Error(`Unknown Color Range preset "${String(preset)}". Use one of ${COLOR_RANGE_PRESETS.join(", ")}.`);
+function invert(m) {
+  const [a, b, c, d, e, f] = m;
+  const det = a * d - b * c || 1;
+  return [d / det, -b / det, -c / det, a / det, (c * f - d * e) / det, (b * e - a * f) / det];
 }
-function selectedColorBins(pixels, sel, tolerance) {
-  const S = 64;
-  let bins = new Uint8Array(S * S * S);
-  const d = pixels.data;
-  const n = pixels.width * pixels.height;
-  for (let i = 0; i < n; i++) {
-    if (sel.data[i] < 128 || d[i * 4 + 3] === 0) continue;
-    bins[((d[i * 4] >> 2) * S + (d[i * 4 + 1] >> 2)) * S + (d[i * 4 + 2] >> 2)] = 1;
+var TypeToolGesture = class {
+  constructor(controller, options) {
+    this.controller = controller;
+    this.options = options;
   }
-  const r = Math.round(Math.max(0, tolerance) / 4);
-  if (r === 0) return bins;
-  for (const stride of [1, S, S * S]) {
-    const out = new Uint8Array(bins.length);
-    for (let i = 0; i < bins.length; i++) {
-      if (!bins[i]) continue;
-      const c = Math.floor(i / stride) % S;
-      const lo = Math.max(0, c - r);
-      const hi = Math.min(S - 1, c + r);
-      const base = i - c * stride;
-      for (let k = lo; k <= hi; k++) out[base + k * stride] = 1;
+  controller;
+  options;
+  session = null;
+  dragStart = null;
+  error = null;
+  down(p, mods = {}) {
+    this.error = null;
+    const hit = typeLayerAt(this.controller, p);
+    if (this.session && this.session.alive && hit === this.session.layerId) {
+      this.session.pointAt(p, mods.shift);
+      this.dragStart = null;
+      return;
     }
-    bins = out;
+    this.finish();
+    if (hit) {
+      this.controller.setActiveLayer(hit);
+      this.session = new TextEditSession(this.controller, hit, this.controller.textIndexAt(hit, p));
+      this.dragStart = null;
+      return;
+    }
+    this.dragStart = { x: p.x, y: p.y };
   }
-  return bins;
-}
-function matcher(pixels, sel, options) {
-  if (sel.width !== pixels.width || sel.height !== pixels.height) throw new Error("The selection and the pixels differ in size");
-  const bins = selectedColorBins(pixels, sel, options.tolerance ?? 32);
-  const d = pixels.data;
-  return (i) => d[i * 4 + 3] > 0 && bins[((d[i * 4] >> 2 << 6) + (d[i * 4 + 1] >> 2)) * 64 + (d[i * 4 + 2] >> 2)] === 1;
-}
-function growSelection(pixels, sel, options = {}) {
-  checkPixels(pixels);
-  const match = matcher(pixels, sel, options);
-  const { width: w, height: h } = pixels;
-  const out = new Uint8Array(sel.data);
-  const stack = [];
-  for (let i = 0; i < out.length; i++) if (out[i] >= 128) stack.push(i);
-  while (stack.length) {
-    const i = stack.pop();
-    const x = i % w;
-    const y = (i - x) / w;
-    const visit = (j) => {
-      if (out[j] < 255 && match(j)) {
-        out[j] = 255;
-        stack.push(j);
-      }
-    };
-    if (x > 0) visit(i - 1);
-    if (x < w - 1) visit(i + 1);
-    if (y > 0) visit(i - w);
-    if (y < h - 1) visit(i + w);
+  /** Releases a click or drag that did not land on type: adds a new text layer (point text, or a box for a drag). */
+  up(p) {
+    const start = this.dragStart;
+    this.dragStart = null;
+    if (!start) return this.session;
+    const o = this.options();
+    const w = Math.abs(p.x - start.x);
+    const h = Math.abs(p.y - start.y);
+    try {
+      const box = w >= 8 && h >= 8 ? { width: w, height: h } : void 0;
+      const id = this.controller.addTextLayer({
+        text: "",
+        x: box ? Math.min(start.x, p.x) : start.x,
+        y: box ? Math.min(start.y, p.y) : start.y,
+        ...box ? { box } : {},
+        style: { fontFamily: o.fontFamily, fontSize: o.fontSize, fontWeight: o.fontWeight, italic: o.italic, color: o.color },
+        paragraph: o.align !== "left" ? { align: o.align } : {},
+        ...o.orientation === "vertical" ? { orientation: "vertical" } : {},
+        name: "Text"
+      });
+      this.session = new TextEditSession(this.controller, id, 0);
+    } catch (e) {
+      this.error = e instanceof Error ? e.message : String(e);
+    }
+    return this.session;
   }
-  return createSelectionMask(w, h, out);
-}
-function selectSimilar(pixels, sel, options = {}) {
-  const n = checkPixels(pixels);
-  const match = matcher(pixels, sel, options);
-  const out = new Uint8Array(sel.data);
-  for (let i = 0; i < n; i++) if (match(i)) out[i] = 255;
-  return createSelectionMask(pixels.width, pixels.height, out);
-}
+  /** Ends the open session (an empty new layer is removed). */
+  finish() {
+    const s = this.session;
+    this.session = null;
+    s?.close();
+  }
+};
 
 // src/image-editor/selection/segmentation.ts
 var isPoint = (p) => !!p && typeof p === "object" && Number.isFinite(p.x) && Number.isFinite(p.y);
@@ -4769,7 +4971,7 @@ var ImageEffectsEngine = class {
 
 // src/image-editor/free-transform.ts
 var FREE_TRANSFORM_CONTENTS = ["auto", "layer", "selection", "selection-copy", "selection-outline"];
-var fail = (message) => {
+var fail2 = (message) => {
   throw new LayerOperationError(message);
 };
 var T = (x, y) => [1, 0, x, 0, 1, y, 0, 0, 1];
@@ -4850,20 +5052,20 @@ function liftMask(mask, sel, o) {
 var FreeTransformSession = class {
   constructor(host, init = {}) {
     this.host = host;
-    if (init.interpolation !== void 0 && !isInterpolation(init.interpolation)) fail(`Unknown interpolation "${String(init.interpolation)}"; use nearest, bilinear or bicubic.`);
+    if (init.interpolation !== void 0 && !isInterpolation(init.interpolation)) fail2(`Unknown interpolation "${String(init.interpolation)}"; use nearest, bilinear or bicubic.`);
     this.interp = init.interpolation ?? "bicubic";
     const sel = host.selection();
     const selected = Boolean(sel?.bounds);
     let content = init.content ?? "auto";
     if (!["auto", "layer", "selection", "selection-copy", "selection-outline"].includes(content)) {
-      fail(`Unknown content "${String(content)}"; use auto, layer, selection, selection-copy or selection-outline.`);
+      fail2(`Unknown content "${String(content)}"; use auto, layer, selection, selection-copy or selection-outline.`);
     }
     const targetId = init.layerId ?? host.activeLayerId();
     const target = targetId && content !== "selection-outline" ? findLayer(host.layers(), targetId)?.layer : void 0;
     const smartTarget = (target?.type === "smart" || target?.type === "shape" || target?.type === "type") && (init.channel ?? (target.id === host.activeLayerId() ? host.activeTarget() : "pixels")) !== "mask";
     if (content === "auto") content = selected && !smartTarget ? "selection" : "layer";
     this.content = content;
-    if (content !== "layer" && !selected) fail(`Nothing is selected; ${content} needs a selection. Select first, or use content layer.`);
+    if (content !== "layer" && !selected) fail2(`Nothing is selected; ${content} needs a selection. Select first, or use content layer.`);
     const layers = host.layers();
     this.startLayers = layers;
     this.startSelection = sel;
@@ -4878,17 +5080,17 @@ var FreeTransformSession = class {
       box = { ...sel.bounds };
     } else {
       const id = init.layerId ?? host.activeLayerId();
-      if (!id) fail("No layer given and none is active; pass layerId (see list_layers).");
+      if (!id) fail2("No layer given and none is active; pass layerId (see list_layers).");
       const layer = requireLayer(layers, id).layer;
       this.layerId = layer.id;
       const mask = layer.mask && !layer.mask.source ? layer.mask : void 0;
       const channel = init.channel ?? (layer.id === host.activeLayerId() ? host.activeTarget() : "pixels");
-      if (channel !== "pixels" && channel !== "mask") fail(`Unknown channel "${String(channel)}"; use pixels or mask.`);
+      if (channel !== "pixels" && channel !== "mask") fail2(`Unknown channel "${String(channel)}"; use pixels or mask.`);
       const linked = mask?.linked !== false;
       const maskAlone = channel === "mask" && (!linked || layer.type !== "pixel");
-      if (channel === "mask" && !mask) fail(layer.mask?.source ? `Layer "${layer.name || id}" has a depth mask, which is generated, not transformed.` : `Layer "${layer.name || id}" has no mask to transform; add one with add_layer_mask, or transform its pixels.`);
-      if (!maskAlone && layer.type !== "pixel" && layer.type !== "smart" && layer.type !== "shape" && layer.type !== "type") fail(`Layer "${layer.name || id}" is a ${layer.type} layer; Free Transform works on pixel, shape, type and smart object layers, layer masks (channel mask) and selections.`);
-      if (!layer.visible && content !== "selection-copy") fail(`Layer "${layer.name || id}" is hidden; show it before you transform it.`);
+      if (channel === "mask" && !mask) fail2(layer.mask?.source ? `Layer "${layer.name || id}" has a depth mask, which is generated, not transformed.` : `Layer "${layer.name || id}" has no mask to transform; add one with add_layer_mask, or transform its pixels.`);
+      if (!maskAlone && layer.type !== "pixel" && layer.type !== "smart" && layer.type !== "shape" && layer.type !== "type") fail2(`Layer "${layer.name || id}" is a ${layer.type} layer; Free Transform works on pixel, shape, type and smart object layers, layer masks (channel mask) and selections.`);
+      if (!layer.visible && content !== "selection-copy") fail2(`Layer "${layer.name || id}" is hidden; show it before you transform it.`);
       if (content !== "selection-copy") {
         requireUnlocked(layer, "position", "transform it");
         if (!maskAlone) requireUnlocked(layer, "pixels", "transform it");
@@ -4896,8 +5098,8 @@ var FreeTransformSession = class {
       const o = layer.type === "pixel" ? layer.offset : { x: 0, y: 0 };
       const pixels = layer.type === "pixel" ? host.pixelsOf(layer) : null;
       if (layer.type === "smart" && !maskAlone) {
-        if (content !== "layer") fail(`Layer "${layer.name || id}" is a smart object, which transforms as a whole; use content layer (or rasterize it to transform part of it).`);
-        if (!isContentsDecoded(layer.contents)) fail(`The contents of "${layer.name || id}" are not decoded here, so it cannot be transformed; run prepareSmartObjects() first.`);
+        if (content !== "layer") fail2(`Layer "${layer.name || id}" is a smart object, which transforms as a whole; use content layer (or rasterize it to transform part of it).`);
+        if (!isContentsDecoded(layer.contents)) fail2(`The contents of "${layer.name || id}" are not decoded here, so it cannot be transformed; run prepareSmartObjects() first.`);
         this.smart = layer;
         this.smartObject = true;
         this.startGeometry = placementGeometry(layer);
@@ -4910,7 +5112,7 @@ var FreeTransformSession = class {
         return;
       }
       if (layer.type === "type" && !maskAlone) {
-        if (content !== "layer") fail(`Layer "${layer.name || id}" is a type layer, which transforms as a whole; use content layer (or rasterize it to transform part of it).`);
+        if (content !== "layer") fail2(`Layer "${layer.name || id}" is a type layer, which transforms as a whole; use content layer (or rasterize it to transform part of it).`);
         const frame = typeFrame(layer, host.textEnv().shaper);
         const m = textMatrix(layer);
         const at = (x, y) => ({ x: m[0] * x + m[2] * y + m[4], y: m[1] * x + m[3] * y + m[5] });
@@ -4930,9 +5132,9 @@ var FreeTransformSession = class {
         return;
       }
       if (layer.type === "shape" && !maskAlone) {
-        if (content !== "layer") fail(`Layer "${layer.name || id}" is a shape layer, which transforms as a whole; use content layer (or rasterize it to transform part of it).`);
+        if (content !== "layer") fail2(`Layer "${layer.name || id}" is a shape layer, which transforms as a whole; use content layer (or rasterize it to transform part of it).`);
         const g = shapeGeometryBounds(layer);
-        if (!g) fail(`Shape layer "${layer.name || id}" has no path to transform.`);
+        if (!g) fail2(`Shape layer "${layer.name || id}" has no path to transform.`);
         const w = Math.max(g.width, 1);
         const h = Math.max(g.height, 1);
         box = { x: g.x + (g.width - w) / 2, y: g.y + (g.height - h) / 2, width: w, height: h };
@@ -4944,7 +5146,7 @@ var FreeTransformSession = class {
           moves.push("mask");
         }
       } else if (maskAlone) {
-        if (content === "selection-copy") fail("Layer via Copy copies pixels; transform a mask with content layer or selection.");
+        if (content === "selection-copy") fail2("Layer via Copy copies pixels; transform a mask with content layer or selection.");
         if (content === "selection") {
           const { lifted, rest } = liftMask(mask.surface, sel, o);
           this.parts.push({ what: "mask", offset: o, moving: lifted, base: rest, reduced: /* @__PURE__ */ new Map() });
@@ -4999,8 +5201,8 @@ var FreeTransformSession = class {
         moves.push("selection");
       }
     }
-    if (!box && moves[0] === "mask") fail("The mask holds nothing but its default value, so there is nothing to transform; paint it first, or transform the pixels (channel pixels).");
-    if (!box) fail(content === "layer" ? "The layer has no pixels to transform." : "The selection holds no pixels of this layer; select some, or transform the outline (content selection-outline).");
+    if (!box && moves[0] === "mask") fail2("The mask holds nothing but its default value, so there is nothing to transform; paint it first, or transform the pixels (channel pixels).");
+    if (!box) fail2(content === "layer" ? "The layer has no pixels to transform." : "The selection holds no pixels of this layer; select some, or transform the outline (content selection-outline).");
     this.box = box;
     this.moves = moves;
     this.startGeometry = identityTransform(box);
@@ -5059,10 +5261,10 @@ var FreeTransformSession = class {
     return !this.closed;
   }
   check() {
-    if (this.closed) fail("This transform has already been committed or cancelled; begin a new one.");
+    if (this.closed) fail2("This transform has already been committed or cancelled; begin a new one.");
     if (this.host.layers() !== this.shown) {
       this.closed = true;
-      fail("The document changed while the transform was open, so it was abandoned; begin a new one.");
+      fail2("The document changed while the transform was open, so it was abandoned; begin a new one.");
     }
   }
   /**
@@ -5072,7 +5274,7 @@ var FreeTransformSession = class {
   update(changes, preview = {}) {
     this.check();
     if (changes.interpolation !== void 0) {
-      if (!isInterpolation(changes.interpolation)) fail(`Unknown interpolation "${String(changes.interpolation)}"; use nearest, bilinear or bicubic.`);
+      if (!isInterpolation(changes.interpolation)) fail2(`Unknown interpolation "${String(changes.interpolation)}"; use nearest, bilinear or bicubic.`);
       this.interp = changes.interpolation;
     }
     const next = {
@@ -5080,10 +5282,10 @@ var FreeTransformSession = class {
       corners: (changes.corners ?? this.geometryValue.corners).map((p) => ({ x: p.x, y: p.y })),
       warp: changes.warp === void 0 ? this.geometryValue.warp ?? null : changes.warp
     };
-    if (next.corners.length !== 4 || !next.corners.every((p) => Number.isFinite(p.x) && Number.isFinite(p.y))) fail("corners must be four finite points: top-left, top-right, bottom-right, bottom-left.");
-    if (!transformMap(next)) fail("These corners fold the frame over itself or through the horizon; keep the quad convex.");
+    if (next.corners.length !== 4 || !next.corners.every((p) => Number.isFinite(p.x) && Number.isFinite(p.y))) fail2("corners must be four finite points: top-left, top-right, bottom-right, bottom-left.");
+    if (!transformMap(next)) fail2("These corners fold the frame over itself or through the horizon; keep the quad convex.");
     if (this.typeTarget && (hasWarp(next) || !matrixFromCorners(next.box, next.corners))) {
-      fail("Type layers take scale, rotate, skew and flips only (the corners must stay a parallelogram, no warp); rasterize the layer (rasterize_layer) for distort, perspective or warp.");
+      fail2("Type layers take scale, rotate, skew and flips only (the corners must stay a parallelogram, no warp); rasterize the layer (rasterize_layer) for distort, perspective or warp.");
     }
     this.geometryValue = next;
     if (preview !== false) this.render(preview);
@@ -5151,7 +5353,7 @@ var FreeTransformSession = class {
             moved = transformSurface(src, hl, opts);
           }
         } catch (e) {
-          if (e instanceof TransformTooLargeError) fail(e.message);
+          if (e instanceof TransformTooLargeError) fail2(e.message);
           throw e;
         }
       }
@@ -5197,9 +5399,9 @@ var FreeTransformSession = class {
   resampleType() {
     const layer = this.typeTarget;
     const g = this.geometryValue;
-    if (hasWarp(g)) fail("Type layers cannot be warped here; rasterize the layer first (rasterize_layer), or transform it with scale, rotate and skew.");
+    if (hasWarp(g)) fail2("Type layers cannot be warped here; rasterize the layer first (rasterize_layer), or transform it with scale, rotate and skew.");
     const m = matrixFromCorners(g.box, g.corners);
-    if (!m) fail("Type layers take scale, rotate, skew and flips only (the corners must stay a parallelogram); rasterize the layer for distort or perspective.");
+    if (!m) fail2("Type layers take scale, rotate, skew and flips only (the corners must stay a parallelogram); rasterize the layer for distort or perspective.");
     const next = { ...layer, transform: m };
     delete next.annotation;
     let layers = mapLayer(this.startLayers, layer.id, () => rerenderText(next, this.host.textEnv()));
@@ -5227,7 +5429,7 @@ var FreeTransformSession = class {
       const surface = renderSmartObject({ ...layer, placement }, canvas, { step, clip: preview.clip, skipFilters: true, reduced: this.smartReduced });
       return mapLayer(this.startLayers, layer.id, (l) => ({ ...l, placement, surface }));
     } catch (e) {
-      if (e instanceof TransformTooLargeError) fail(e.message);
+      if (e instanceof TransformTooLargeError) fail2(e.message);
       throw e;
     }
   }
@@ -5774,9 +5976,9 @@ var PaintStrokeSession = class {
     this.controller._strokeCommit(this.before, this.target.id, this.target.channel, null);
   }
 };
-function workRegionOf(surface, rect2, depth) {
-  if (!depth) return Float32Array.from(readRegion(surface, rect2));
-  const d = readDeepRegion(surface, rect2, depth);
+function workRegionOf(surface, rect3, depth) {
+  if (!depth) return Float32Array.from(readRegion(surface, rect3));
+  const d = readDeepRegion(surface, rect3, depth);
   const out = new Float32Array(d.length);
   if (d instanceof Uint16Array) {
     for (let i = 0; i < d.length; i++) out[i] = d[i] / 257;
@@ -5926,6 +6128,32 @@ function migrateToLayeredState(data, size) {
 var DEFAULT_TRANSFORM = DEFAULT_TRANSFORM_VALUES;
 var DEFAULT_DEPTH_MASK = DEFAULT_DEPTH_MASK_VALUES;
 var DEVELOP_KEYS = ["brightness", "contrast", "saturation", "exposure", "temperature", "tint"];
+function combineFields(o) {
+  return { ...o.mode && o.mode !== "replace" ? { mode: o.mode } : {}, ...o.feather && o.feather > 0 ? { feather: o.feather } : {}, ...o.invert ? { invert: true } : {} };
+}
+function shapeStepFields(o) {
+  return { ...o.antiAlias === false ? { antiAlias: false } : {}, ...combineFields(o) };
+}
+function samplingFields(o) {
+  return { ...o.sample && o.sample !== "composite" ? { sample: o.sample } : {}, ...o.sampleMerged ? { sampleMerged: true } : {} };
+}
+function stepOptions(o) {
+  const { mode: _m, feather: _f, invert: _i, sample: _s, sampleMerged: _sm, pixels: _p, ...rest } = o;
+  return JSON.parse(JSON.stringify(rest));
+}
+function recipeAfter(prev, prevSel, step) {
+  const replaces = step.op === "all" || isShapeStep(step) && (step.mode ?? "replace") === "replace";
+  if (replaces || !prevSel?.bounds) return [step];
+  return prev ? [...prev, step] : null;
+}
+function readStoredRecipe(raw) {
+  if (!Array.isArray(raw) || !raw.length) return null;
+  try {
+    return raw.map((s, i) => readRecipeStep(s, `selectionRecipe[${i}]`));
+  } catch {
+    return null;
+  }
+}
 var ImageEditorController = class {
   state;
   renderer;
@@ -6013,6 +6241,7 @@ var ImageEditorController = class {
     if (options.initialState?.selection) {
       try {
         this.state.selection = normalizeSelection(deserializeSelection(options.initialState.selection));
+        if (this.state.selection) this.state.selectionRecipe = readStoredRecipe(options.initialState.selectionRecipe);
       } catch {
       }
     }
@@ -6492,6 +6721,7 @@ var ImageEditorController = class {
       transform: { ...s.transform },
       outputOpacity: s.outputOpacity,
       selection: s.selection ?? null,
+      ...s.selectionRecipe ? { selectionRecipe: s.selectionRecipe } : {},
       ...s.channels?.length ? { channels: s.channels } : {},
       ...s.paths?.length ? { paths: s.paths } : {},
       source: {
@@ -6529,6 +6759,7 @@ var ImageEditorController = class {
     if (entry.colorMode) s.colorMode = entry.colorMode;
     else delete s.colorMode;
     s.selection = entry.selection;
+    s.selectionRecipe = entry.selectionRecipe ?? null;
     if (entry.channels?.length) s.channels = entry.channels;
     else delete s.channels;
     if (entry.paths?.length) s.paths = entry.paths;
@@ -6796,7 +7027,7 @@ var ImageEditorController = class {
   getLayerFrame(id) {
     const layer = this.getLayer(id);
     if (!layer) return null;
-    const rect2 = (b2) => [
+    const rect3 = (b2) => [
       { x: b2.x, y: b2.y },
       { x: b2.x + b2.width, y: b2.y },
       { x: b2.x + b2.width, y: b2.y + b2.height },
@@ -6811,16 +7042,16 @@ var ImageEditorController = class {
     }
     if (layer.type === "shape") {
       const g = shapeGeometryBounds(layer);
-      return g ? rect2(g) : null;
+      return g ? rect3(g) : null;
     }
     const b = this.getLayerBounds(id);
-    return b ? rect2(b) : null;
+    return b ? rect3(b) : null;
   }
   /**
    * Hit-tests the layer stack at `point` (in document space) and returns the id of the topmost
    * matching visible layer, or `null`. Skips adjustment layers.
    */
-  layerAt(point, opts = {}) {
+  layerAt(point2, opts = {}) {
     const { includeHidden = false, includeLocked = false, alphaThreshold = 1 } = opts;
     const layers = this.state.layers;
     const testLayer = (layer) => {
@@ -6837,20 +7068,20 @@ var ImageEditorController = class {
         return null;
       }
       if (layer.type === "type") {
-        const hitId = typeLayerAt(this, point);
+        const hitId = typeLayerAt(this, point2);
         if (hitId === layer.id) return layer.id;
         return null;
       }
       if (layer.type === "annotation") {
-        if (hitTestAnnotation(point, layer.annotation)) return layer.id;
+        if (hitTestAnnotation(point2, layer.annotation)) return layer.id;
         return null;
       }
       if (layer.type === "shape") {
         const bounds = this.getLayerBounds(layer.id);
-        if (bounds && point.x >= bounds.x && point.x <= bounds.x + bounds.width && point.y >= bounds.y && point.y <= bounds.y + bounds.height) {
+        if (bounds && point2.x >= bounds.x && point2.x <= bounds.x + bounds.width && point2.y >= bounds.y && point2.y <= bounds.y + bounds.height) {
           const surface = this.surfaceOf(layer);
-          const px2 = Math.floor(point.x - layer.offset.x);
-          const py = Math.floor(point.y - layer.offset.y);
+          const px2 = Math.floor(point2.x - layer.offset.x);
+          const py = Math.floor(point2.y - layer.offset.y);
           const pixel = readPixel(surface, px2, py);
           if (pixel.length >= 4 && pixel[3] >= alphaThreshold) return layer.id;
         }
@@ -6859,12 +7090,12 @@ var ImageEditorController = class {
       if (layer.type === "pixel" || layer.type === "smart") {
         const bounds = this.getLayerBounds(layer.id);
         if (!bounds) return null;
-        if (point.x < bounds.x || point.x > bounds.x + bounds.width || point.y < bounds.y || point.y > bounds.y + bounds.height) {
+        if (point2.x < bounds.x || point2.x > bounds.x + bounds.width || point2.y < bounds.y || point2.y > bounds.y + bounds.height) {
           return null;
         }
         const surface = this.surfaceOf(layer);
-        const px2 = Math.floor(point.x - layer.offset.x);
-        const py = Math.floor(point.y - layer.offset.y);
+        const px2 = Math.floor(point2.x - layer.offset.x);
+        const py = Math.floor(point2.y - layer.offset.y);
         const pixel = readPixel(surface, px2, py);
         if (pixel.length >= 4 && pixel[3] >= alphaThreshold) {
           return layer.id;
@@ -6895,9 +7126,9 @@ var ImageEditorController = class {
    * and are left out): `rect` (default: the canvas) as RGBA, straight alpha. Crop, rotation and
    * output opacity are not applied. With `layerIds`, only those layers are composited.
    */
-  compositePixels(rect2, options = {}) {
+  compositePixels(rect3, options = {}) {
     const { width, height } = this.naturalSize;
-    const r = rect2 ?? { x: 0, y: 0, width, height };
+    const r = rect3 ?? { x: 0, y: 0, width, height };
     let layers = this.state.layers;
     if (options.layerIds) {
       const keep = new Set(options.layerIds);
@@ -6931,6 +7162,8 @@ var ImageEditorController = class {
     return String(id);
   }
   /** The pixels a pixel layer, smart object or shape composites (the decoded source for the Background). */
+  /** A layer's real pixels for hybrid vector masks' matte guide (the Background's from the source). */
+  guideSurfaceOf = (layer) => layer.type === "pixel" || layer.type === "smart" || layer.type === "shape" || layer.type === "type" ? this.surfaceOf(layer) : void 0;
   surfaceOf(layer) {
     if (layer.type !== "pixel" || layer.source !== "document") return layer.surface;
     return this.sourceSurface() ?? layer.surface;
@@ -7149,7 +7382,7 @@ var ImageEditorController = class {
   /** Whether the layer's mask (painted and vector, with feather) has a soft band. */
   maskHasSoftBand(layer) {
     const { width, height } = this.naturalSize;
-    const mask = effectiveLayerMask(layer, width, height);
+    const mask = effectiveLayerMask(layer, width, height, this.guideSurfaceOf);
     if (!mask || mask.enabled === false || mask.source) return false;
     const ox = layer.type === "pixel" ? layer.offset.x : 0;
     const oy = layer.type === "pixel" ? layer.offset.y : 0;
@@ -7523,7 +7756,11 @@ var ImageEditorController = class {
       this.commitLayers(layers, void 0, commitToHistory);
     } else {
       const { vm } = this.requireVectorMask(target.layerId);
-      this.commitLayers(mapLayer(this.state.layers, target.layerId, (l) => ({ ...l, vectorMask: { ...vm, components: next } })), void 0, commitToHistory);
+      const edges = validVectorMaskEdges(vm.edges, next);
+      const nextVm = { ...vm, components: next };
+      if (edges.length) nextVm.edges = edges;
+      else delete nextVm.edges;
+      this.commitLayers(mapLayer(this.state.layers, target.layerId, (l) => ({ ...l, vectorMask: nextVm })), void 0, commitToHistory);
     }
   }
   /**
@@ -7618,6 +7855,9 @@ var ImageEditorController = class {
   setVectorMaskPath(id, path) {
     const { vm } = this.requireVectorMask(id);
     const next = { ...vm, components: this.vectorMaskComponents(path) };
+    const kept = validVectorMaskEdges(vm.edges, next.components);
+    if (kept.length) next.edges = kept;
+    else delete next.edges;
     if (path.fillRule === "evenodd") next.fillRule = "evenodd";
     else if (path.fillRule === "nonzero") delete next.fillRule;
     this.commitLayers(mapLayer(this.state.layers, id, (l) => ({ ...l, vectorMask: next })));
@@ -7667,7 +7907,7 @@ var ImageEditorController = class {
     const { width, height } = this.canvasSize;
     const raster = layer.mask;
     const plain3 = { ...layer, vectorMask: { ...layer.vectorMask, enabled: true }, mask: raster ? { surface: raster.surface, defaultValue: raster.defaultValue } : void 0 };
-    const baked = effectiveLayerMask(plain3, width, height);
+    const baked = effectiveLayerMask(plain3, width, height, this.guideSurfaceOf);
     const mask = raster ? { ...raster, surface: baked.surface, defaultValue: baked.defaultValue } : baked;
     this.commitLayers(
       mapLayer(this.state.layers, id, (l) => {
@@ -7703,8 +7943,55 @@ var ImageEditorController = class {
       density: vm.density ?? 1,
       feather: vm.feather ?? 0,
       bounds: b ? { x: r(b.x), y: r(b.y), width: r(b.width), height: r(b.height) } : null,
-      components: vm.components.map((c, index) => ({ index, op: c.op, live: c.live ? JSON.parse(JSON.stringify(c.live)) : null, subpaths: roundSubpaths(c.subpaths) }))
+      components: vm.components.map((c, index) => ({ index, op: c.op, live: c.live ? JSON.parse(JSON.stringify(c.live)) : null, subpaths: roundSubpaths(c.subpaths) })),
+      edges: validVectorMaskEdges(vm.edges, vm.components).map((e) => ({ ...e })),
+      segmentCount: vectorMaskSegments(vm.components).length
+    };
+  }
+  /**
+   * Hybrid mask: a vector mask segment's edge mode. `hard` (the default) is the path's own sharp
+   * edge; `feather` blurs across it by `radius` px (default 4); `matte` solves a corridor from
+   * `inner` px inside to `outer` px outside (defaults 4 and 8) from the layer's colours, for hair
+   * and fur. Modes blend where they meet. One undo step. Returns the vector mask's info.
+   */
+  setVectorMaskEdge(id, at, mode, options = {}, commitToHistory = true) {
+    const { layer, vm } = this.requireVectorMask(id);
+    const name = layer.name || id;
+    const sp = vm.components[at.component]?.subpaths[at.subpath];
+    const count = sp ? subpathSegmentCount(sp) : 0;
+    if (!sp || !Number.isInteger(at.segment) || at.segment < 0 || at.segment >= count) {
+      const where = vm.components.map((c, ci) => c.subpaths.map((p, si) => `component ${ci} subpath ${si}: segments 0..${subpathSegmentCount(p) - 1}`).join("; ")).join("; ");
+      throw new LayerOperationError(`The vector mask of "${name}" has no segment ${at.component}/${at.subpath}/${at.segment}; it has ${where || "no segments"} (see get_vector_mask).`);
+    }
+    if (mode !== "hard" && mode !== "feather" && mode !== "matte") throw new LayerOperationError(`mode must be hard, feather or matte, got "${String(mode)}".`);
+    const num3 = (v, what, lo, hi) => {
+      if (v === void 0) return void 0;
+      if (!(typeof v === "number" && Number.isFinite(v) && v >= lo && v <= hi)) throw new LayerOperationError(`${what} must be ${lo} to ${hi} px, got ${String(v)}.`);
+      return v;
     };
+    const radius = num3(options.radius, "radius", 0.5, 250);
+    const inner = num3(options.inner, "inner", 0.5, 200);
+    const outer = num3(options.outer, "outer", 0.5, 200);
+    if (mode !== "feather" && radius !== void 0) throw new LayerOperationError("radius is for feather edges; matte edges take inner and outer.");
+    if (mode !== "matte" && (inner !== void 0 || outer !== void 0)) throw new LayerOperationError("inner and outer are for matte edges; feather edges take radius.");
+    const same = (e) => e.component === at.component && e.subpath === at.subpath && e.segment === at.segment;
+    const edges = validVectorMaskEdges(vm.edges, vm.components).filter((e) => !same(e));
+    if (mode === "feather") edges.push({ ...at, mode, radius: radius ?? VECTOR_MASK_EDGE_DEFAULTS.radius });
+    else if (mode === "matte") edges.push({ ...at, mode, inner: inner ?? VECTOR_MASK_EDGE_DEFAULTS.inner, outer: outer ?? VECTOR_MASK_EDGE_DEFAULTS.outer });
+    const next = { ...vm };
+    if (edges.length) next.edges = edges;
+    else delete next.edges;
+    this.commitLayers(mapLayer(this.state.layers, layer.id, (l) => ({ ...l, vectorMask: next })), void 0, commitToHistory);
+    return this.getVectorMask(layer.id);
+  }
+  /** A layer's vector mask over the canvas as a selection mask, hybrid edges, feather and density included. */
+  vectorMaskSelection(layer) {
+    const { width, height } = this.naturalSize;
+    const vm = layer.vectorMask;
+    const v = vectorMaskCoverage(vm, width, height, vm.edges?.length ? layerGuide(layer, width, height, this.guideSurfaceOf) : null);
+    const bytes = new Uint8Array(v.length);
+    for (let i = 0; i < v.length; i++) bytes[i] = Math.round(v[i] * 255);
+    return createSelectionMask(width, height, bytes);
   }
   /** Changes any layer mask's density, feather, enabled or linked flag (pixels kept). Returns the mask. */
   setLayerMaskProps(id, props, commitToHistory = true) {
@@ -8418,7 +8705,7 @@ var ImageEditorController = class {
     return this.getGlobalLight();
   }
   /** Composites `layers` (in isolation) over `rect` into a surface, loading depth maps first. */
-  async compositeToSurface(layers, rect2) {
+  async compositeToSurface(layers, rect3) {
     const { width, height } = this.naturalSize;
     if (flattenLayers(layers).some((l) => l.type === "annotation" && l.visible) && !this.renderer.canRasterize()) {
       throw new LayerOperationError("Merging annotation layers needs a canvas (a browser); hide or delete them first, or merge in the browser.");
@@ -8427,20 +8714,20 @@ var ImageEditorController = class {
     const sources = this.renderer.compositorSources(width, height);
     const depth = this.bitDepth;
     if (depth !== 8) {
-      const samples = workingToSamples(compositeDeep(layers, rect2, sources, depth), depth);
-      return surfaceFromDeepPixels({ width: rect2.width, height: rect2.height, data: samples }, 4, rect2.x, rect2.y);
+      const samples = workingToSamples(compositeDeep(layers, rect3, sources, depth), depth);
+      return surfaceFromDeepPixels({ width: rect3.width, height: rect3.height, data: samples }, 4, rect3.x, rect3.y);
     }
-    const data = new LayerCompositor().composite(layers, rect2, sources);
-    return surfaceFromPixels({ width: rect2.width, height: rect2.height, data }, 4, rect2.x, rect2.y);
+    const data = new LayerCompositor().composite(layers, rect3, sources);
+    return surfaceFromPixels({ width: rect3.width, height: rect3.height, data }, 4, rect3.x, rect3.y);
   }
   /**
    * The composite of the layer stack at the document's bit depth (as `compositePixels`, no
    * canvas): 16-bit sRGB samples, or 32-bit linear float, over `rect` (default the canvas). At 8
    * bits, the 8-bit composite widened to 16 bits.
    */
-  compositeDeepPixels(rect2) {
+  compositeDeepPixels(rect3) {
     const { width, height } = this.naturalSize;
-    const r = rect2 ?? { x: 0, y: 0, width, height };
+    const r = rect3 ?? { x: 0, y: 0, width, height };
     const depth = this.bitDepth;
     if (depth === 8) return { width: r.width, height: r.height, depth: 16, data: to16From8(this.compositePixels(r).data) };
     const data = workingToSamples(compositeDeep(this.state.layers, r, this.compositorSources(), depth), depth);
@@ -8478,12 +8765,12 @@ var ImageEditorController = class {
     if (!upper.visible) throw new LayerOperationError(`Layer "${upper.name || id}" is hidden; show it or delete it instead of merging.`);
     requireUnlocked(upper, "all", "merge it");
     requireUnlocked(lower, "pixels", "merge into it");
-    let rect2 = unionRect(this.paintBounds(lower), upper.type === "adjustment" ? null : this.paintBounds(upper)) ?? { x: 0, y: 0, width: 1, height: 1 };
+    let rect3 = unionRect(this.paintBounds(lower), upper.type === "adjustment" ? null : this.paintBounds(upper)) ?? { x: 0, y: 0, width: 1, height: 1 };
     const reach = Math.max(effectsMargin(lower.effects), upper.type === "adjustment" ? 0 : effectsMargin(upper.effects));
-    if (reach) rect2 = { x: rect2.x - reach, y: rect2.y - reach, width: rect2.width + 2 * reach, height: rect2.height + 2 * reach };
+    if (reach) rect3 = { x: rect3.x - reach, y: rect3.y - reach, width: rect3.width + 2 * reach, height: rect3.height + 2 * reach };
     const base = { ...lower, blend: "normal", opacity: 1 };
     delete base.clipped;
-    const surface = await this.compositeToSurface([base, upper], rect2);
+    const surface = await this.compositeToSurface([base, upper], rect3);
     const merged = { ...lower, surface, offset: { x: 0, y: 0 } };
     delete merged.mask;
     delete merged.fillOpacity;
@@ -8656,9 +8943,9 @@ var ImageEditorController = class {
    * Sets (Alt-click) or clears the Clone Stamp and Healing Brush source point, in document
    * pixels. The next stroke fixes the offset from its first point. View state, no undo.
    */
-  setCloneSource(point) {
-    if (point && (!Number.isFinite(point.x) || !Number.isFinite(point.y))) throw new LayerOperationError("The clone source needs finite x and y (document pixels).");
-    const source = point ? { x: Math.round(point.x), y: Math.round(point.y), offset: null } : null;
+  setCloneSource(point2) {
+    if (point2 && (!Number.isFinite(point2.x) || !Number.isFinite(point2.y))) throw new LayerOperationError("The clone source needs finite x and y (document pixels).");
+    const source = point2 ? { x: Math.round(point2.x), y: Math.round(point2.y), offset: null } : null;
     this.state.paint = { ...this.state.paint, cloneSource: source };
     this.notify();
     return source;
@@ -9226,27 +9513,27 @@ var ImageEditorController = class {
   copyPixels(options = {}) {
     const { width, height } = this.naturalSize;
     const sel = this.state.selection?.bounds ? this.state.selection : null;
-    const rect2 = sel?.bounds ?? { x: 0, y: 0, width, height };
+    const rect3 = sel?.bounds ?? { x: 0, y: 0, width, height };
     let data;
     if (options.merged) {
-      data = new Uint8ClampedArray(this.compositePixels(rect2).data);
+      data = new Uint8ClampedArray(this.compositePixels(rect3).data);
     } else {
       const id = options.layerId ?? this.state.activeLayerId;
       if (!id) throw new LayerOperationError("No layer given and none is active; pass layerId, or merged: true to copy the visible image.");
       const layer = requireLayer(this.state.layers, id).layer;
       if (layer.type !== "pixel") throw new LayerOperationError(`Layer "${layer.name || id}" is not a pixel layer; copy merged, or rasterize it first.`);
-      data = readRegion(this.surfaceOf(layer), { x: rect2.x - layer.offset.x, y: rect2.y - layer.offset.y, width: rect2.width, height: rect2.height });
+      data = readRegion(this.surfaceOf(layer), { x: rect3.x - layer.offset.x, y: rect3.y - layer.offset.y, width: rect3.width, height: rect3.height });
     }
     if (sel) {
-      for (let y = 0; y < rect2.height; y++) {
-        for (let x = 0; x < rect2.width; x++) {
-          const k = sel.data[(rect2.y + y) * sel.width + rect2.x + x];
-          const p = (y * rect2.width + x) * 4 + 3;
+      for (let y = 0; y < rect3.height; y++) {
+        for (let x = 0; x < rect3.width; x++) {
+          const k = sel.data[(rect3.y + y) * sel.width + rect3.x + x];
+          const p = (y * rect3.width + x) * 4 + 3;
           data[p] = Math.round(data[p] * k / 255);
         }
       }
     }
-    this.clipboard = { width: rect2.width, height: rect2.height, x: rect2.x, y: rect2.y, data };
+    this.clipboard = { width: rect3.width, height: rect3.height, x: rect3.x, y: rect3.y, data };
     return this.clipboard;
   }
   /** Edit › Cut: Copy, then clear the selected pixels, as one undo step. */
@@ -9671,6 +9958,8 @@ var ImageEditorController = class {
    * Returns false when nothing changed.
    */
   setSelection(mask, mode = "replace") {
+    const step = this.pendingStep;
+    this.pendingStep = null;
     const { width, height } = this.naturalSize;
     let next = null;
     if (mask) {
@@ -9684,9 +9973,91 @@ var ImageEditorController = class {
     this.recordHistory();
     if (!next && prev?.bounds) this.lastSelection = prev;
     this.state.selection = next;
+    this.state.selectionRecipe = step && next ? recipeAfter(this.state.selectionRecipe ?? null, prev, step) : null;
+    this.notify();
+    return true;
+  }
+  /** The recipe step of the selection command now running, taken by `setSelection`. */
+  pendingStep = null;
+  /** Runs a selection command whose change `step` describes, so the selection's recipe records it. */
+  withRecipeStep(step, fn) {
+    this.pendingStep = step;
+    try {
+      return fn();
+    } finally {
+      this.pendingStep = null;
+    }
+  }
+  /** The selection's recipe as agents and panels read it (empty and not live when frozen or empty). */
+  getSelectionRecipe() {
+    const steps = this.state.selection?.bounds ? this.state.selectionRecipe ?? null : null;
+    return { live: Boolean(steps), steps: describeRecipe(steps ?? []) };
+  }
+  requireRecipe(action) {
+    const steps = this.state.selection?.bounds ? this.state.selectionRecipe : null;
+    if (!steps) {
+      throw new LayerOperationError(
+        `The selection has no recipe to ${action}: it is frozen, or it was made or changed by a command recipes do not describe (quick, object, subject, sky and focus selections, Quick Mask painting, loaded masks and channels). Select again with marquees, polygons, the magic wand, Color Range, modify, invert or refine to start one.`
+      );
+    }
+    return steps;
+  }
+  /**
+   * Replaces the selection's recipe with `steps` (checked first) and the selection with what they
+   * make, from nothing. One undo step; nothing changes on an error. Returns the recipe.
+   */
+  async setSelectionRecipe(steps) {
+    if (!Array.isArray(steps) || !steps.length) throw new LayerOperationError("A recipe needs at least one step; use deselect to select nothing.");
+    const parsed = steps.map((s, i) => readRecipeStep(s, `steps[${i}]`));
+    const { width, height } = this.naturalSize;
+    const images = /* @__PURE__ */ new Map();
+    for (const step of parsed) {
+      if (!stepNeedsPixels(step)) continue;
+      const key2 = samplingKey(step);
+      if (!images.has(key2)) images.set(key2, await this.requirePixels(step));
+    }
+    const result = replaySelectionRecipe(parsed, width, height, (step) => images.get(samplingKey(step)));
+    this.recordHistory();
+    if (!result && this.state.selection?.bounds) this.lastSelection = this.state.selection;
+    this.state.selection = result;
+    this.state.selectionRecipe = result ? parsed : null;
+    this.notify();
+    return this.getSelectionRecipe();
+  }
+  /** Changes step `index` of the selection's recipe (fields given replace its own; `op` replaces it whole) and replays. One undo step. */
+  editSelectionStep(index, changes) {
+    const steps = this.requireRecipe("edit");
+    const i = this.recipeIndex(steps, index, false);
+    const next = steps.map((s) => s);
+    next[i] = changes.op !== void 0 && changes.op !== steps[i].op ? changes : { ...steps[i], ...changes };
+    return this.setSelectionRecipe(next);
+  }
+  /** Inserts a step at `index` (0..length; length appends) and replays. One undo step. */
+  insertSelectionStep(index, step) {
+    const steps = this.requireRecipe("insert into");
+    const i = this.recipeIndex(steps, index, true);
+    return this.setSelectionRecipe([...steps.slice(0, i), step, ...steps.slice(i)]);
+  }
+  /** Removes step `index` and replays (the last step cannot go: deselect instead). One undo step. */
+  removeSelectionStep(index) {
+    const steps = this.requireRecipe("remove from");
+    const i = this.recipeIndex(steps, index, false);
+    if (steps.length === 1) throw new LayerOperationError("That is the recipe's only step; deselect to select nothing.");
+    return this.setSelectionRecipe(steps.filter((_, k) => k !== i));
+  }
+  /** Drops the selection's recipe, keeping the selection as it is (a plain bitmap). One undo step. */
+  freezeSelection() {
+    if (!this.state.selectionRecipe) return false;
+    this.recordHistory();
+    this.state.selectionRecipe = null;
     this.notify();
     return true;
   }
+  recipeIndex(steps, index, insert) {
+    const max = insert ? steps.length : steps.length - 1;
+    if (!Number.isInteger(index) || index < 0 || index > max) throw new LayerOperationError(`index must be 0..${max} (the recipe has ${steps.length} step${steps.length === 1 ? "" : "s"}; see get_selection_recipe), got ${String(index)}.`);
+    return index;
+  }
   /**
    * Shows `mask` in place of the selection while a gesture runs (Quick Selection as the brush
    * moves; `null` shows nothing selected), or with `undefined` stops. View state only: no undo
@@ -9701,7 +10072,7 @@ var ImageEditorController = class {
   /** Select › All. */
   selectAll() {
     const { width, height } = this.naturalSize;
-    return this.setSelection(fullSelection(width, height));
+    return this.withRecipeStep({ op: "all" }, () => this.setSelection(fullSelection(width, height)));
   }
   /** Select › Deselect. */
   deselect() {
@@ -9730,8 +10101,8 @@ var ImageEditorController = class {
     if (!Number.isFinite(position) || at < 0 || at >= max) {
       throw new RangeError(`${orientation === "row" ? "y" : "x"} ${position} is outside the image (0..${max - 1}).`);
     }
-    const rect2 = orientation === "row" ? { x: 0, y: at, width, height: 1 } : { x: at, y: 0, width: 1, height };
-    return this.shapeCommand(rectSelection(width, height, rect2, { antiAlias: false }), options);
+    const rect3 = orientation === "row" ? { x: 0, y: at, width, height: 1 } : { x: at, y: 0, width: 1, height };
+    return this.shapeCommand(rectSelection(width, height, rect3, { antiAlias: false }), options);
   }
   /** Select › Grow: adds connected pixels within `tolerance` of a selected colour (one undo step). */
   async growSelection(options = {}) {
@@ -9779,7 +10150,7 @@ var ImageEditorController = class {
   invertSelection() {
     const { width, height } = this.naturalSize;
     const current = this.state.selection ?? createSelectionMask(width, height);
-    return this.setSelection(invertSelection(current));
+    return this.withRecipeStep({ op: "invert" }, () => this.setSelection(invertSelection(current)));
   }
   shapeCommand(mask, options) {
     const feathered = options.feather && options.feather > 0 ? modifySelection(mask, "feather", options.feather) : mask;
@@ -9787,19 +10158,20 @@ var ImageEditorController = class {
     return this.setSelection(shaped, options.mode ?? "replace");
   }
   /** Rectangular marquee in natural image pixels. */
-  selectRect(rect2, options = {}) {
+  selectRect(rect3, options = {}) {
     const { width, height } = this.naturalSize;
-    return this.shapeCommand(rectSelection(width, height, rect2, options), options);
+    return this.withRecipeStep({ op: "rect", rect: { ...rect3 }, ...shapeStepFields(options) }, () => this.shapeCommand(rectSelection(width, height, rect3, options), options));
   }
   /** Elliptical marquee inscribed in `rect`. */
-  selectEllipse(rect2, options = {}) {
+  selectEllipse(rect3, options = {}) {
     const { width, height } = this.naturalSize;
-    return this.shapeCommand(ellipseSelection(width, height, rect2, options), options);
+    return this.withRecipeStep({ op: "ellipse", rect: { ...rect3 }, ...shapeStepFields(options) }, () => this.shapeCommand(ellipseSelection(width, height, rect3, options), options));
   }
   /** Lasso / polygonal lasso. */
   selectPolygon(points, options = {}) {
     const { width, height } = this.naturalSize;
-    return this.shapeCommand(polygonSelection(width, height, points, options), options);
+    const step = { op: "polygon", points: points.map((p) => ({ x: p.x, y: p.y })), ...shapeStepFields(options) };
+    return this.withRecipeStep(step, () => this.shapeCommand(polygonSelection(width, height, points, options), options));
   }
   /**
    * Magnetic Lasso for a given outline: each point snaps to the strongest edge within `width` px
@@ -10023,15 +10395,17 @@ var ImageEditorController = class {
    * Magic wand at `point` (natural image pixels). Resolves to the resulting selection (null when
    * nothing is selected).
    */
-  async magicWand(point, options = {}) {
+  async magicWand(point2, options = {}) {
     const pixels = await this.requirePixels(options);
-    this.shapeCommand(magicWand(pixels, point, options), options);
+    const step = { op: "magic-wand", point: { x: point2.x, y: point2.y }, options: stepOptions(options), ...combineFields(options), ...samplingFields(options) };
+    this.withRecipeStep(step, () => this.shapeCommand(magicWand(pixels, point2, options), options));
     return this.getSelection();
   }
   /** Select › Color Range with colour samples (`#rrggbb` or `[r, g, b]`, optionally where they were picked). */
   async selectColorRange(samples, options = {}) {
     const pixels = await this.requirePixels(options);
-    this.shapeCommand(colorRange(pixels, samples, options), options);
+    const step = { op: "color-range", samples: JSON.parse(JSON.stringify(samples)), options: stepOptions(options), ...combineFields(options), ...samplingFields(options) };
+    this.withRecipeStep(step, () => this.shapeCommand(colorRange(pixels, samples, options), options));
     return this.getSelection();
   }
   /**
@@ -10040,14 +10414,15 @@ var ImageEditorController = class {
    */
   async selectColorRangePreset(preset, options = {}) {
     const pixels = await this.requirePixels(options);
-    this.shapeCommand(colorRangePreset(pixels, preset, options), options);
+    const step = { op: "color-range-preset", preset, ...options.falloff !== void 0 ? { falloff: options.falloff } : {}, ...combineFields(options), ...samplingFields(options) };
+    this.withRecipeStep(step, () => this.shapeCommand(colorRangePreset(pixels, preset, options), options));
     return this.getSelection();
   }
   /** Select › Modify: grow, shrink, feather, border or smooth by `radius` pixels (one undo step). */
   modifySelection(op, radius) {
     const sel = this.state.selection;
     if (!sel?.bounds) return false;
-    return this.setSelection(modifySelection(sel, op, radius));
+    return this.withRecipeStep({ op: "modify", modify: op, radius }, () => this.setSelection(modifySelection(sel, op, radius)));
   }
   /**
    * Refine Edge: snaps the selection (e.g. a coarse AI mask loaded with `loadSelectionFromImage`)
@@ -10057,7 +10432,7 @@ var ImageEditorController = class {
     const sel = this.state.selection;
     if (!sel?.bounds) return false;
     const pixels = (params.radius ?? 0) > 0 ? await this.requirePixels(options) : null;
-    return this.setSelection(refineSelection(pixels, sel, params));
+    return this.withRecipeStep({ op: "refine", params: { ...params }, ...samplingFields(options) }, () => this.setSelection(refineSelection(pixels, sel, params)));
   }
   /**
    * Select and Mask's output: refines the selection with `params`, then puts the result where
@@ -10127,7 +10502,9 @@ var ImageEditorController = class {
       return { output, layerId, refineMode, ...documentId ? { documentId } : {} };
     }
     return this.asOneStep(() => {
-      this.setSelection(refined);
+      const plain3 = output === "selection" && !edits.length && !regions2 && refineMode === "color";
+      if (plain3) this.withRecipeStep({ op: "refine", params: { ...params }, ...samplingFields(options) }, () => this.setSelection(refined));
+      else this.setSelection(refined);
       if (output === "selection") return { output, refineMode };
       if (output === "layer-mask") {
         this.addLayerMask(layerId, "selection");
@@ -10546,9 +10923,8 @@ var ImageEditorController = class {
         mask = this.layerMaskCoverage(layer.id);
         if (!mask) throw new LayerOperationError(`Layer "${layer.name || layer.id}" has no painted mask; add one with add_layer_mask, or inspect its vector-mask.`);
       } else {
-        const { vm } = this.requireVectorMask(layer.id);
-        mask = pathToSelection(vm.components, width, height, { fillRule: vm.fillRule });
-        if (vm.inverted) mask = invertSelection(mask);
+        this.requireVectorMask(layer.id);
+        mask = this.vectorMaskSelection(layer);
       }
       if (!mask.bounds) throw new LayerOperationError(`The ${target} of "${layer.name || layer.id}" hides everything: there is no edge to inspect.`);
     } else {
@@ -10622,9 +10998,8 @@ var ImageEditorController = class {
       case "vector-mask": {
         const layer = this.getLayer(source.layerId);
         if (!layer) throw new LayerOperationError(`There is no layer "${source.layerId}" (see list_layers).`);
-        const { vm } = this.requireVectorMask(layer.id);
-        const mask = pathToSelection(vm.components, width, height, { fillRule: vm.fillRule });
-        return vm.inverted ? invertSelection(mask) : mask;
+        this.requireVectorMask(layer.id);
+        return this.vectorMaskSelection(layer);
       }
       default:
         throw new LayerOperationError(`Unknown selection source ${JSON.stringify(source)}. Use selection, history, channel, layer-mask or vector-mask.`);
@@ -11149,15 +11524,15 @@ var ImageEditorController = class {
     let mask;
     if (!b || x1 <= x0 || y1 <= y0) mask = createSelectionMask(width, height);
     else {
-      const rect2 = { x: x0, y: y0, width: x1 - x0, height: y1 - y0 };
-      const rgba = readRegion(layer.surface, rect2);
-      const bytes = new Uint8Array(rect2.width * rect2.height);
+      const rect3 = { x: x0, y: y0, width: x1 - x0, height: y1 - y0 };
+      const rgba = readRegion(layer.surface, rect3);
+      const bytes = new Uint8Array(rect3.width * rect3.height);
       const hard = init.antiAlias === false;
       for (let i = 0; i < bytes.length; i++) {
         const a = rgba[i * 4 + 3];
         bytes[i] = hard ? a >= 128 ? 255 : 0 : a;
       }
-      mask = selectionFromRegion(width, height, rect2, bytes);
+      mask = selectionFromRegion(width, height, rect3, bytes);
     }
     if ((init.feather ?? 0) > 0 && mask.bounds) mask = modifySelection(mask, "feather", init.feather);
     return this.setSelection(mask.bounds ? mask : null, init.mode ?? "replace");
@@ -11335,10 +11710,10 @@ var ImageEditorController = class {
     return shaper ? layoutText(layer, shaper) : null;
   }
   /** The text index nearest a document point (for clicks on a type layer). */
-  textIndexAt(id, point) {
+  textIndexAt(id, point2) {
     const layer = requireTypeLayer(this.state.layers, id);
     const layout = this.getTextLayout(id);
-    return layout ? textIndexAt(layout, toTextSpace(layer, point)) : layer.text.length;
+    return layout ? textIndexAt(layout, toTextSpace(layer, point2)) : layer.text.length;
   }
   /** The caret at text index `index` as a document-space segment (top to bottom), for drawing it. */
   textCaret(id, index) {
@@ -11516,8 +11891,8 @@ var ImageEditorController = class {
       delete content.mask;
       delete content.clipped;
       delete content.fillOpacity;
-      const rect2 = spatial ? canvas : this.getLayerBounds(id) ?? canvas;
-      const surface = await this.compositeToSurface([content], rect2);
+      const rect3 = spatial ? canvas : this.getLayerBounds(id) ?? canvas;
+      const surface = await this.compositeToSurface([content], rect3);
       next = { ...layer, surface, offset: { x: 0, y: 0 } };
       delete next.filters;
       delete next.source;
@@ -11905,6 +12280,12 @@ var ImageEditorController = class {
       if (layer.edge?.ambient) add2("The live edge cast (set_edge_ambient) has no PSD equivalent and was left out", layer.name);
       const p = await prepareLayer(layer);
       if (p?.edge) delete p.edge;
+      if (p && isActiveVectorMask(layer.vectorMask) && layer.vectorMask.edges?.length) {
+        add2("Hybrid vector masks (soft edge segments) were baked into pixel masks", layer.name);
+        const baked = effectiveLayerMask(layer, width, height, this.guideSurfaceOf);
+        if (baked) p.mask = baked;
+        delete p.vectorMask;
+      }
       if (p?.blend === "pigment") add2("The Pigment blend mode has no PSD equivalent and was written as Normal", layer.name);
       return p;
     };
@@ -11980,7 +12361,7 @@ var ImageEditorController = class {
       }
       if (layer.filters?.some((f) => !f.enabled)) add2("Disabled layer filters were left out", layer.name);
       delete out.filters;
-      const unmixMask = hasEdgeUnmix(layer.edge) ? effectiveLayerMask(layer, width, height) : void 0;
+      const unmixMask = hasEdgeUnmix(layer.edge) ? effectiveLayerMask(layer, width, height, this.guideSurfaceOf) : void 0;
       if (unmixMask && !unmixMask.source && unmixMask.enabled !== false) {
         add2("Edge decontamination and despill were baked into the pixels", layer.name);
         const { x: ox, y: oy } = layer.offset;
@@ -12089,6 +12470,7 @@ var ImageEditorController = class {
     try {
       out = this.serializeState();
       if (this.state.selection?.bounds) out.selection = serializeSelection(this.state.selection);
+      if (this.state.selection?.bounds && this.state.selectionRecipe) out.selectionRecipe = JSON.parse(JSON.stringify(this.state.selectionRecipe));
       if (this.state.channels?.length) out.channels = serializeChannels(this.state.channels);
       if (this.state.paths?.length) out.paths = serializePaths(this.state.paths);
     } finally {
@@ -12130,6 +12512,7 @@ var ImageEditorController = class {
       }
     }
     this.state.selection = selection;
+    this.state.selectionRecipe = selection ? readStoredRecipe(data.selectionRecipe) : null;
     this.dropMismatchedSelection();
     const problems = [];
     const channels = deserializeChannels(data.channels, this.naturalSize, problems);
@@ -13360,10 +13743,10 @@ function sampleOptions(args) {
   return { sampleMerged: args.sampleMerged === true, sample: args.sample ?? "composite" };
 }
 function rectOf(args) {
-  const rect2 = { x: num2(args.x, NaN), y: num2(args.y, NaN), width: num2(args.width, NaN), height: num2(args.height, NaN) };
-  if (![rect2.x, rect2.y, rect2.width, rect2.height].every(Number.isFinite)) throw new Error("Pass numeric x, y, width and height in natural image pixels.");
-  if (rect2.width <= 0 || rect2.height <= 0) throw new Error("width and height must be greater than 0.");
-  return rect2;
+  const rect3 = { x: num2(args.x, NaN), y: num2(args.y, NaN), width: num2(args.width, NaN), height: num2(args.height, NaN) };
+  if (![rect3.x, rect3.y, rect3.width, rect3.height].every(Number.isFinite)) throw new Error("Pass numeric x, y, width and height in natural image pixels.");
+  if (rect3.width <= 0 || rect3.height <= 0) throw new Error("width and height must be greater than 0.");
+  return rect3;
 }
 function uncertainty(controller) {
   const u = controller.selectionUncertainty();
@@ -13477,6 +13860,83 @@ function createImageSelectionTools(controller) {
       show: show !== false
     })
   };
+  const stepProperties = {
+    op: { type: "string", enum: ["rect", "ellipse", "polygon", "magic-wand", "color-range", "color-range-preset", "all", "invert", "modify", "refine"], description: "The step: a marquee (rect / ellipse with rect), polygon (points), magic-wand (point, options), color-range (samples, options), color-range-preset (preset, falloff), all, invert, modify (modify, radius) or refine (params)." },
+    rect: { ...rectSchemaStrict, description: "rect and ellipse: the box in natural image pixels." },
+    points: { type: "array", minItems: 3, items: pointSchema, description: "polygon: the outline, natural image pixels." },
+    point: { ...pointSchema, description: "magic-wand: where to click." },
+    samples: { type: "array", minItems: 1, items: {}, description: "color-range: colour samples, as select_color_range takes them." },
+    options: { type: "object", description: "magic-wand and color-range: their own options (tolerance, contiguous, fuzziness, \u2026) as those tools take them." },
+    preset: { type: "string", description: "color-range-preset: the preset (reds \u2026 magentas, highlights, midtones, shadows, skinTones)." },
+    falloff: { type: "number", minimum: 0, maximum: 255, description: "color-range-preset (tones): falloff in levels (default 20)." },
+    modify: { type: "string", enum: [...SELECTION_MODIFY_OPS], description: "modify: expand, contract, feather, border or smooth (grow and shrink are older names)." },
+    radius: { type: "number", minimum: 0, maximum: 500, description: "modify: radius in pixels." },
+    params: { type: "object", description: "refine: radius, smartRadius, smooth, feather, contrast, shiftEdge as refine_selection takes them." },
+    mode: modeSchema,
+    feather: featherSchema,
+    invert: { type: "boolean", description: "Shape steps: invert the new shape before combining (default false)." },
+    antiAlias: antiAliasSchema,
+    sample: sampleSchema,
+    sampleMerged: sampleMergedSchema
+  };
+  const RECIPE_RETURNS = "Returns the selection summary and the recipe { live, steps (each with its index) }.";
+  const withRecipe = async (p) => {
+    await p;
+    return { ...summary(controller), recipe: controller.getSelectionRecipe() };
+  };
+  const getRecipeTool = {
+    name: "get_selection_recipe",
+    title: "Read the selection recipe",
+    description: `Live selections: the steps that made the current selection (marquees, polygons, magic wand, Color Range, modify, invert, refine), so one can be changed afterwards with edit_selection_step, insert_selection_step or remove_selection_step instead of selecting again. live false means it is frozen (made or changed by a command a recipe cannot describe, e.g. quick_select, select_subject, Quick Mask painting). ${RECIPE_RETURNS}`,
+    inputSchema: { type: "object", properties: {}, additionalProperties: false },
+    annotations: { title: "Read the selection recipe", readOnlyHint: true, destructiveHint: false, idempotentHint: true, openWorldHint: false },
+    handler: () => ({ ...summary(controller), recipe: controller.getSelectionRecipe() })
+  };
+  const editStepTool = {
+    name: "edit_selection_step",
+    title: "Edit a selection recipe step",
+    description: `Changes one step of the selection's recipe (index from get_selection_recipe) and replays the recipe: the fields given replace the step's own (e.g. tolerance in options, the rect, the modify radius, mode); giving a different op replaces the step whole. One undo step; nothing changes on an error. ${RECIPE_RETURNS}`,
+    inputSchema: {
+      type: "object",
+      properties: { index: { type: "integer", minimum: 0, description: "The step to change (see get_selection_recipe)." }, changes: { type: "object", properties: stepProperties, additionalProperties: false, description: "The step fields to set." } },
+      required: ["index", "changes"],
+      additionalProperties: false
+    },
+    annotations: writeAnnotations("Edit a selection recipe step"),
+    handler: ({ index, changes }) => withRecipe(controller.editSelectionStep(index, changes))
+  };
+  const insertStepTool = {
+    name: "insert_selection_step",
+    title: "Insert a selection recipe step",
+    description: `Inserts a step into the selection's recipe at index (its length appends) and replays it, e.g. a subtract rectangle before a refine, or a modify smooth after a magic wand. One undo step; nothing changes on an error. ${RECIPE_RETURNS}`,
+    inputSchema: {
+      type: "object",
+      properties: { index: { type: "integer", minimum: 0, description: "Where to insert (0..number of steps)." }, step: { type: "object", properties: stepProperties, required: ["op"], additionalProperties: false, description: "The step to insert." } },
+      required: ["index", "step"],
+      additionalProperties: false
+    },
+    annotations: writeAnnotations("Insert a selection recipe step"),
+    handler: ({ index, step }) => withRecipe(controller.insertSelectionStep(index, step))
+  };
+  const removeStepTool = {
+    name: "remove_selection_step",
+    title: "Remove a selection recipe step",
+    description: `Removes one step of the selection's recipe and replays the rest (the only step cannot go: deselect instead). One undo step. ${RECIPE_RETURNS}`,
+    inputSchema: { type: "object", properties: { index: { type: "integer", minimum: 0, description: "The step to remove (see get_selection_recipe)." } }, required: ["index"], additionalProperties: false },
+    annotations: writeAnnotations("Remove a selection recipe step"),
+    handler: ({ index }) => withRecipe(controller.removeSelectionStep(index))
+  };
+  const freezeTool = {
+    name: "freeze_selection",
+    title: "Freeze the selection",
+    description: `Drops the selection's recipe and keeps the selection exactly as it is (a plain bitmap), so later edits start from it. One undo step; a frozen or empty selection is unchanged. ${RECIPE_RETURNS}`,
+    inputSchema: { type: "object", properties: {}, additionalProperties: false },
+    annotations: { title: "Freeze the selection", readOnlyHint: false, destructiveHint: false, idempotentHint: true, openWorldHint: false },
+    handler: () => {
+      controller.freezeSelection();
+      return { ...summary(controller), recipe: controller.getSelectionRecipe() };
+    }
+  };
   const selectRegion = {
     name: "select_region",
     title: "Select a region",
@@ -13521,12 +13981,12 @@ function createImageSelectionTools(controller) {
           break;
         case "rect":
         case "ellipse": {
-          const rect2 = { x: num2(x, NaN), y: num2(y, NaN), width: num2(width, NaN), height: num2(height, NaN) };
-          if (![rect2.x, rect2.y, rect2.width, rect2.height].every(Number.isFinite)) {
+          const rect3 = { x: num2(x, NaN), y: num2(y, NaN), width: num2(width, NaN), height: num2(height, NaN) };
+          if (![rect3.x, rect3.y, rect3.width, rect3.height].every(Number.isFinite)) {
             throw new Error("rect and ellipse need numeric x, y, width and height.");
           }
-          if (shape === "rect") controller.selectRect(rect2, opts);
-          else controller.selectEllipse(rect2, opts);
+          if (shape === "rect") controller.selectRect(rect3, opts);
+          else controller.selectEllipse(rect3, opts);
           break;
         }
         case "polygon": {
@@ -13905,10 +14365,10 @@ function createImageSelectionTools(controller) {
     },
     annotations: { ...writeAnnotations("Object Selection"), openWorldHint: true },
     handler: async (args, context) => {
-      const rect2 = args.rect;
-      const point = args.point;
-      if (!rect2 && !point) throw new Error("Pass rect (a box around the object) or point (a point on it).");
-      if (rect2 && point) throw new Error("Pass rect or point, not both.");
+      const rect3 = args.rect;
+      const point2 = args.point;
+      if (!rect3 && !point2) throw new Error("Pass rect (a box around the object) or point (a point on it).");
+      if (rect3 && point2) throw new Error("Pass rect or point, not both.");
       const options = {
         mode: parseSelectionMode(args.mode),
         sampleAllLayers: args.sampleAllLayers,
@@ -13916,7 +14376,7 @@ function createImageSelectionTools(controller) {
         useModel: args.useModel,
         signal: context?.signal
       };
-      const { method } = rect2 ? await controller.selectObject({ rect: { x: num2(rect2.x, NaN), y: num2(rect2.y, NaN), width: num2(rect2.width, NaN), height: num2(rect2.height, NaN) } }, options) : await controller.selectObject({ point: { x: num2(point.x, NaN), y: num2(point.y, NaN) } }, options);
+      const { method } = rect3 ? await controller.selectObject({ rect: { x: num2(rect3.x, NaN), y: num2(rect3.y, NaN), width: num2(rect3.width, NaN), height: num2(rect3.height, NaN) } }, options) : await controller.selectObject({ point: { x: num2(point2.x, NaN), y: num2(point2.y, NaN) } }, options);
       return { ...summary(controller), method, ...uncertainty(controller) };
     }
   };
@@ -14555,6 +15015,11 @@ function createImageSelectionTools(controller) {
     getSelection,
     inspectEdge,
     compareTool,
+    getRecipeTool,
+    editStepTool,
+    insertStepTool,
+    removeStepTool,
+    freezeTool,
     selectAll,
     deselect,
     invert2,
@@ -14694,7 +15159,7 @@ async function renderImageRegion(controller, request) {
   out.height = request.height;
   const context = out.getContext("2d");
   if (!context) throw new Error(NO_CANVAS);
-  const { rect: rect2 } = request;
+  const { rect: rect3 } = request;
   context.imageSmoothingEnabled = request.scale < 1;
   if (request.format === "jpeg") {
     context.fillStyle = "#ffffff";
@@ -14702,22 +15167,22 @@ async function renderImageRegion(controller, request) {
   }
   const kx = view.width / state.imageDimensions.width;
   const ky = view.height / state.imageDimensions.height;
-  context.drawImage(view, rect2.x * kx, rect2.y * ky, rect2.width * kx, rect2.height * ky, 0, 0, out.width, out.height);
+  context.drawImage(view, rect3.x * kx, rect3.y * ky, rect3.width * kx, rect3.height * ky, 0, 0, out.width, out.height);
   if (request.includeOverlays) {
     const s = request.scale;
     const maskView = maskViewCanvas(controller, document);
-    if (maskView) context.drawImage(maskView, rect2.x, rect2.y, rect2.width, rect2.height, 0, 0, out.width, out.height);
+    if (maskView) context.drawImage(maskView, rect3.x, rect3.y, rect3.width, rect3.height, 0, 0, out.width, out.height);
     const selection = state.selection;
     if (selection?.bounds && selection.width === state.imageDimensions.width && selection.height === state.imageDimensions.height) {
       const shade = selectionShade(selection, document);
-      if (shade) context.drawImage(shade, rect2.x, rect2.y, rect2.width, rect2.height, 0, 0, out.width, out.height);
+      if (shade) context.drawImage(shade, rect3.x, rect3.y, rect3.width, rect3.height, 0, 0, out.width, out.height);
     }
     if (state.crop) {
       context.save();
       context.strokeStyle = "#ffd400";
       context.lineWidth = 2;
       context.setLineDash([6, 4]);
-      context.strokeRect((state.crop.x - rect2.x) * s, (state.crop.y - rect2.y) * s, state.crop.width * s, state.crop.height * s);
+      context.strokeRect((state.crop.x - rect3.x) * s, (state.crop.y - rect3.y) * s, state.crop.width * s, state.crop.height * s);
       context.restore();
     }
   }
@@ -15974,11 +16439,11 @@ function createImageEffectTools(controller) {
 }
 
 // src/image-editor/selection/gesture.ts
-function snapTo45(from, point) {
-  const dx = point.x - from.x;
-  const dy = point.y - from.y;
+function snapTo45(from, point2) {
+  const dx = point2.x - from.x;
+  const dy = point2.y - from.y;
   const len = Math.hypot(dx, dy);
-  if (len === 0) return point;
+  if (len === 0) return point2;
   const a = Math.round(Math.atan2(dy, dx) / (Math.PI / 4)) * (Math.PI / 4);
   return { x: from.x + Math.cos(a) * len, y: from.y + Math.sin(a) * len };
 }
@@ -16066,38 +16531,38 @@ var SelectionGesture = class {
     const { tool } = this.getOptions();
     if (tool === "quick") return null;
     if (tool === "lasso") return this.points.length > 1 ? this.points.slice() : null;
-    const rect2 = normalizeRect({
+    const rect3 = normalizeRect({
       x: this.start.x,
       y: this.start.y,
       width: this.current.x - this.start.x,
       height: this.current.y - this.start.y
     });
-    if (rect2.width < 1 && rect2.height < 1) return null;
-    if (tool === "ellipse") return ellipsePoints(rect2);
+    if (rect3.width < 1 && rect3.height < 1) return null;
+    if (tool === "ellipse") return ellipsePoints(rect3);
     return [
-      { x: rect2.x, y: rect2.y },
-      { x: rect2.x + rect2.width, y: rect2.y },
-      { x: rect2.x + rect2.width, y: rect2.y + rect2.height },
-      { x: rect2.x, y: rect2.y + rect2.height }
+      { x: rect3.x, y: rect3.y },
+      { x: rect3.x + rect3.width, y: rect3.y },
+      { x: rect3.x + rect3.width, y: rect3.y + rect3.height },
+      { x: rect3.x, y: rect3.y + rect3.height }
     ];
   }
   /** Pointer down. Resolves once a wand click has been applied. */
-  async begin(point, modifiers = {}) {
+  async begin(point2, modifiers = {}) {
     const options = this.getOptions();
     this.error = null;
     if (this.polygon && options.tool !== "polygon" || this.magnetic && options.tool !== "magnetic") this.cancel();
-    if (options.tool === "magnetic") return this.magneticClick(point, modifiers, options);
+    if (options.tool === "magnetic") return this.magneticClick(point2, modifiers, options);
     if (options.tool === "polygon") {
-      this.pressedAt = point;
+      this.pressedAt = point2;
       this.freehand = false;
       if (!this.polygon) {
         this.modifiers = modifiers;
-        this.polygon = [point];
-        this.current = point;
+        this.polygon = [point2];
+        this.current = point2;
         return;
       }
       const last = this.polygon[this.polygon.length - 1];
-      const p = modifiers.shiftKey ? snapTo45(last, point) : point;
+      const p = modifiers.shiftKey ? snapTo45(last, point2) : point2;
       const first = this.polygon[0];
       if (this.polygon.length >= 3 && Math.hypot(p.x - first.x, p.y - first.y) <= this.closeRadius) {
         this.close();
@@ -16112,7 +16577,7 @@ var SelectionGesture = class {
     if (options.tool === "row" || options.tool === "column") {
       this.start = null;
       try {
-        this.controller.selectLine(options.tool, options.tool === "row" ? point.y : point.x, {
+        this.controller.selectLine(options.tool, options.tool === "row" ? point2.y : point2.x, {
           mode: selectionModeFromModifiers(modifiers, options.mode),
           feather: options.feather ?? 0
         });
@@ -16126,8 +16591,8 @@ var SelectionGesture = class {
       try {
         this.controller.selectTextShape({
           text: options.typeText || "Type",
-          x: point.x,
-          y: point.y,
+          x: point2.x,
+          y: point2.y,
           orientation: options.tool === "type-vertical" ? "vertical" : "horizontal",
           style: { fontSize: options.typeSize ?? 72, fontFamily: options.typeFamily || "sans-serif" },
           mode: selectionModeFromModifiers(modifiers, options.mode),
@@ -16151,11 +16616,11 @@ var SelectionGesture = class {
         if (options.tool === "range") {
           const pixels = await this.controller.getSamplePixels(common);
           if (!pixels) throw new Error("The image pixels are not available to sample.");
-          const x = Math.min(pixels.width - 1, Math.max(0, Math.floor(point.x)));
-          const y = Math.min(pixels.height - 1, Math.max(0, Math.floor(point.y)));
+          const x = Math.min(pixels.width - 1, Math.max(0, Math.floor(point2.x)));
+          const y = Math.min(pixels.height - 1, Math.max(0, Math.floor(point2.y)));
           const p = (y * pixels.width + x) * 4;
           const color = [pixels.data[p], pixels.data[p + 1], pixels.data[p + 2]];
-          await this.controller.selectColorRange([{ color, at: point }], {
+          await this.controller.selectColorRange([{ color, at: point2 }], {
             ...common,
             fuzziness: options.fuzziness ?? 40,
             localized: options.localized ? options.localized : void 0,
@@ -16163,7 +16628,7 @@ var SelectionGesture = class {
           });
           return;
         }
-        await this.controller.magicWand(point, {
+        await this.controller.magicWand(point2, {
           ...common,
           tolerance: options.tolerance,
           contiguous: options.contiguous,
@@ -16175,9 +16640,9 @@ var SelectionGesture = class {
       }
       return;
     }
-    this.start = point;
-    this.current = point;
-    this.points = [point];
+    this.start = point2;
+    this.current = point2;
+    this.points = [point2];
     if (options.tool === "quick") {
       const picked = selectionModeFromModifiers(modifiers, options.mode);
       const base = this.controller.getSelection();
@@ -16192,53 +16657,53 @@ var SelectionGesture = class {
     }
   }
   /** Pointer move; returns true when the draft changed (re-render). */
-  move(point, modifiers = {}) {
+  move(point2, modifiers = {}) {
     if (this.magnetic) {
-      this.current = point;
-      this.followEdges(point);
+      this.current = point2;
+      this.followEdges(point2);
       return true;
     }
     if (this.polygon) {
       const last = this.polygon[this.polygon.length - 1];
-      if (this.pressedAt && (this.freehand || Math.hypot(point.x - this.pressedAt.x, point.y - this.pressedAt.y) >= 3)) {
+      if (this.pressedAt && (this.freehand || Math.hypot(point2.x - this.pressedAt.x, point2.y - this.pressedAt.y) >= 3)) {
         this.freehand = true;
-        if (Math.hypot(point.x - last.x, point.y - last.y) >= 0.5) this.polygon.push(point);
+        if (Math.hypot(point2.x - last.x, point2.y - last.y) >= 0.5) this.polygon.push(point2);
         this.current = null;
         return true;
       }
-      this.current = modifiers.shiftKey ? snapTo45(last, point) : point;
+      this.current = modifiers.shiftKey ? snapTo45(last, point2) : point2;
       return true;
     }
     if (!this.start) return false;
-    this.current = point;
+    this.current = point2;
     const drawn = this.getOptions().tool;
     if (drawn === "lasso" || drawn === "quick") {
       const last = this.points[this.points.length - 1];
-      if (Math.hypot(point.x - last.x, point.y - last.y) < 0.5) return false;
-      this.points.push(point);
+      if (Math.hypot(point2.x - last.x, point2.y - last.y) < 0.5) return false;
+      this.points.push(point2);
       if (drawn === "quick") this.growPreview();
     }
     return true;
   }
   /** Pointer up: commits the shape. Returns true when the selection changed. */
-  end(point, modifiers) {
+  end(point2, modifiers) {
     if (this.magnetic) return false;
     if (this.polygon) {
-      if (point && this.freehand) this.move(point);
+      if (point2 && this.freehand) this.move(point2);
       this.pressedAt = null;
       this.freehand = false;
       return false;
     }
     if (!this.start) return false;
-    if (point) this.move(point);
+    if (point2) this.move(point2);
     const options = this.getOptions();
     const mode = selectionModeFromModifiers(modifiers ?? this.modifiers, options.mode);
     if (options.tool === "object") {
-      const rect3 = normalizeRect({ x: this.start.x, y: this.start.y, width: this.current.x - this.start.x, height: this.current.y - this.start.y });
+      const rect4 = normalizeRect({ x: this.start.x, y: this.start.y, width: this.current.x - this.start.x, height: this.current.y - this.start.y });
       this.start = null;
       this.current = null;
       this.points = [];
-      const target = rect3.width >= 4 && rect3.height >= 4 ? { rect: rect3 } : { point: { x: rect3.x + rect3.width / 2, y: rect3.y + rect3.height / 2 } };
+      const target = rect4.width >= 4 && rect4.height >= 4 ? { rect: rect4 } : { point: { x: rect4.x + rect4.width / 2, y: rect4.y + rect4.height / 2 } };
       this.pending = this.controller.selectObject(target, { mode, sampleAllLayers: options.objectSampleAll ?? true, enhanceEdge: options.objectEnhance ?? false }).then(
         () => void 0,
         (err) => {
@@ -16268,7 +16733,7 @@ var SelectionGesture = class {
       return false;
     }
     const path = this.draftPath;
-    const rect2 = normalizeRect({
+    const rect3 = normalizeRect({
       x: this.start.x,
       y: this.start.y,
       width: this.current.x - this.start.x,
@@ -16280,7 +16745,7 @@ var SelectionGesture = class {
     if (!path) return mode === "replace" ? this.controller.deselect() : false;
     const opts = { mode, antiAlias: options.antiAlias, feather: options.feather ?? 0 };
     if (options.tool === "lasso") return path.length >= 3 ? this.controller.selectPolygon(path, opts) : false;
-    return options.tool === "ellipse" ? this.controller.selectEllipse(rect2, opts) : this.controller.selectRect(rect2, opts);
+    return options.tool === "ellipse" ? this.controller.selectEllipse(rect3, opts) : this.controller.selectRect(rect3, opts);
   }
   /** Closes a polygonal lasso and selects it. Returns true when the selection changed. */
   close() {
@@ -16329,19 +16794,19 @@ var SelectionGesture = class {
   corridor(a, b) {
     return Math.max(2 * (this.getOptions().magneticWidth ?? 10), 16, Math.hypot(b.x - a.x, b.y - a.y) / 4);
   }
-  async magneticClick(point, modifiers, options) {
+  async magneticClick(point2, modifiers, options) {
     const m = this.magnetic;
     if (!m) {
       this.modifiers = modifiers;
-      const draft = { fixed: [point], anchors: [0], live: [], edges: null };
+      const draft = { fixed: [point2], anchors: [0], live: [], edges: null };
       this.magnetic = draft;
-      this.current = point;
+      this.current = point2;
       try {
         const pixels = await this.controller.getSamplePixels({ sampleMerged: options.sampleMerged, sample: options.sample });
         if (!pixels) throw new Error("The image pixels are not available to find edges in.");
         if (this.magnetic !== draft) return;
         draft.edges = new EdgeMap(pixels, { contrast: (options.magneticContrast ?? 10) / 100 });
-        draft.fixed = [snapToEdge(draft.edges, point, options.magneticWidth ?? 10)];
+        draft.fixed = [snapToEdge(draft.edges, point2, options.magneticWidth ?? 10)];
         if (this.current) this.followEdges(this.current);
       } catch (err) {
         this.error = err instanceof Error ? err.message : String(err);
@@ -16350,12 +16815,12 @@ var SelectionGesture = class {
       return;
     }
     const first = m.fixed[0];
-    if (m.anchors.length >= 2 && Math.hypot(point.x - first.x, point.y - first.y) <= this.closeRadius) {
+    if (m.anchors.length >= 2 && Math.hypot(point2.x - first.x, point2.y - first.y) <= this.closeRadius) {
       this.close();
       return;
     }
-    this.current = point;
-    this.followEdges(point);
+    this.current = point2;
+    this.followEdges(point2);
     if (m.live.length > 1) {
       m.fixed.push(...m.live.slice(1));
       m.anchors.push(m.fixed.length - 1);
@@ -16364,15 +16829,15 @@ var SelectionGesture = class {
     if ((modifiers.detail ?? 1) >= 2) this.close();
   }
   /** Updates the live path to `point`, fixing anchors along it every `frequency` px (with `place`). */
-  followEdges(point, place = true) {
+  followEdges(point2, place = true) {
     const m = this.magnetic;
     const last = () => m.fixed[m.fixed.length - 1];
     if (!m.edges) {
-      m.live = [last(), point];
+      m.live = [last(), point2];
       return;
     }
     const options = this.getOptions();
-    const target = snapToEdge(m.edges, point, options.magneticWidth ?? 10);
+    const target = snapToEdge(m.edges, point2, options.magneticWidth ?? 10);
     const spacing = magneticAnchorSpacing(options.magneticFrequency ?? 57);
     for (let guard = 0; guard < 64; guard++) {
       const path = liveWire(m.edges, last(), target, this.corridor(last(), target));
@@ -18645,6 +19110,37 @@ function createImageShapeTools(controller) {
       return { vectorMask: controller.getVectorMask(id) };
     }
   };
+  const setVectorMaskEdge = {
+    name: "set_vector_mask_edge",
+    title: "Set a vector mask segment's edge",
+    description: "Hybrid mask: gives one segment of a layer's vector mask its own edge, so one mask holds sharp edges and hair or fur. hard (default) is the path's sharp edge; feather blurs across it by radius px; matte solves a corridor from inner px inside the path to outer px outside it from the layer's colours (the colour-guided filter), so strands keep their detail. Modes blend where they meet. Address the segment with component, subpath and segment (the segment from anchor segment to the next; see get_vector_mask segmentCount and components). Check the result with inspect_mask_edge target vector-mask. One undo step. Returns the vector mask with its edges.",
+    inputSchema: {
+      type: "object",
+      properties: {
+        layerId: LAYER,
+        component: { type: "integer", minimum: 0, description: "Component index of the path (0 for a single shape)." },
+        subpath: { type: "integer", minimum: 0, description: "Subpath index in the component (0 for a single outline)." },
+        segment: { type: "integer", minimum: 0, description: "Segment index in the subpath: from anchor segment to the next (the last closes back to anchor 0)." },
+        mode: { type: "string", enum: ["hard", "feather", "matte"], description: "hard (sharp, the default), feather (a soft falloff) or matte (a solved corridor for hair and fur)." },
+        radius: { type: "number", minimum: 0.5, maximum: 250, description: "feather only: Gaussian falloff in px across the curve (default 4)." },
+        inner: { type: "number", minimum: 0.5, maximum: 200, description: "matte only: how far inside the path the unsure corridor reaches, in px (default 4)." },
+        outer: { type: "number", minimum: 0.5, maximum: 200, description: "matte only: how far outside the path the unsure corridor reaches, in px (default 8; cover the longest strands)." }
+      },
+      required: ["layerId", "component", "subpath", "segment", "mode"],
+      additionalProperties: false
+    },
+    annotations: { title: "Set a vector mask segment's edge", ...WRITE_IDEMPOTENT5 },
+    handler: ({ layerId, component, subpath, segment, mode, radius, inner, outer }) => {
+      const id = layerArg(layerId);
+      const vectorMask = controller.setVectorMaskEdge(
+        id,
+        { component, subpath, segment },
+        mode,
+        { radius, inner, outer }
+      );
+      return { vectorMask };
+    }
+  };
   const rasterizeVectorMask = {
     name: "rasterize_vector_mask",
     title: "Rasterize a vector mask",
@@ -18787,6 +19283,7 @@ function createImageShapeTools(controller) {
     addVectorMask,
     setVectorMaskPath,
     setVectorMaskProps,
+    setVectorMaskEdge,
     rasterizeVectorMask,
     removeVectorMask,
     selectionToPath,
@@ -19313,11 +19810,11 @@ function hitTestCurvePoint(points, x, y, width, height, radius = 8) {
   return best;
 }
 function insertCurvePoint(points, p) {
-  const point = { input: clampLevel(p.input), output: clampLevel(p.output) };
-  const out = points.filter((q) => q.input !== point.input).map((q) => ({ ...q }));
-  let index = out.findIndex((q) => q.input > point.input);
+  const point2 = { input: clampLevel(p.input), output: clampLevel(p.output) };
+  const out = points.filter((q) => q.input !== point2.input).map((q) => ({ ...q }));
+  let index = out.findIndex((q) => q.input > point2.input);
   if (index === -1) index = out.length;
-  out.splice(index, 0, point);
+  out.splice(index, 0, point2);
   return { points: out, index };
 }
 function moveCurvePoint(points, index, p) {
@@ -19686,25 +20183,25 @@ var SelectAndMaskSession = class {
    * Selection, brushes, lasso) or a box (Object Selection). Alt (or the subtract mode) removes.
    * Hand and Zoom are the UI's own; they return false here.
    */
-  begin(point, modifiers = {}) {
+  begin(point2, modifiers = {}) {
     const s = this.settingsValue;
     const mode = modifiers.altKey ? s.brushMode === "add" ? "subtract" : "add" : s.brushMode;
-    this.dragStart = point;
+    this.dragStart = point2;
     switch (s.tool) {
       case "quick-select":
-        this.live = { kind: "quick-select", points: [point], size: s.brushSize, mode };
+        this.live = { kind: "quick-select", points: [point2], size: s.brushSize, mode };
         break;
       case "brush":
-        this.live = { kind: "brush", points: [point], size: s.brushSize, mode };
+        this.live = { kind: "brush", points: [point2], size: s.brushSize, mode };
         break;
       case "refine-brush":
-        this.live = { kind: "refine-brush", points: [point], size: s.brushSize };
+        this.live = { kind: "refine-brush", points: [point2], size: s.brushSize };
         break;
       case "lasso":
-        this.live = { kind: "lasso", points: [point], mode };
+        this.live = { kind: "lasso", points: [point2], mode };
         break;
       case "object":
-        this.live = { kind: "object", point, mode };
+        this.live = { kind: "object", point: point2, mode };
         break;
       default:
         this.dragStart = null;
@@ -19714,18 +20211,18 @@ var SelectAndMaskSession = class {
     return true;
   }
   /** Pointer move while a stroke is down. */
-  move(point) {
+  move(point2) {
     const live = this.live;
     if (!live || !this.dragStart) return;
     if (live.kind === "object") {
       const a = this.dragStart;
-      const rect2 = { x: Math.min(a.x, point.x), y: Math.min(a.y, point.y), width: Math.abs(point.x - a.x), height: Math.abs(point.y - a.y) };
-      this.live = rect2.width >= 4 && rect2.height >= 4 ? { kind: "object", rect: rect2, mode: live.mode } : { kind: "object", point: a, mode: live.mode };
+      const rect3 = { x: Math.min(a.x, point2.x), y: Math.min(a.y, point2.y), width: Math.abs(point2.x - a.x), height: Math.abs(point2.y - a.y) };
+      this.live = rect3.width >= 4 && rect3.height >= 4 ? { kind: "object", rect: rect3, mode: live.mode } : { kind: "object", point: a, mode: live.mode };
       return;
     }
     const last = live.points[live.points.length - 1];
-    if (Math.hypot(point.x - last.x, point.y - last.y) < 1) return;
-    live.points.push(point);
+    if (Math.hypot(point2.x - last.x, point2.y - last.y) < 1) return;
+    live.points.push(point2);
     if (this.settingsValue.realTime && live.kind !== "lasso") this.recompute();
   }
   /** Pointer up: the stroke becomes an edit (one step of the workspace's own undo). */
@@ -21649,6 +22146,7 @@ var PathEditGesture = class {
       return;
     }
     const seg = this.segmentAt(cs, p);
+    if (seg && mods.alt && mods.shift && this.target?.kind === "vector-mask") return this.cycleEdge(this.target.layerId, seg.ref);
     if (seg) {
       if (!mods.shift) this.selected.clear();
       this.drag = { kind: "segment", ...seg, base: cloneComponents(cs), moved: false };
@@ -21657,6 +22155,17 @@ var PathEditGesture = class {
     this.drag = { kind: "marquee", start: pt(p), end: pt(p), keep: mods.shift ? new Set(this.selected) : /* @__PURE__ */ new Set() };
     if (!mods.shift) this.selected.clear();
   }
+  /** Alt+Shift-click on a vector mask's segment: hard → feather → matte → hard (one undo step). */
+  cycleEdge(layerId, r) {
+    const at = { component: r.component, subpath: r.subpath, segment: r.anchor };
+    const now = this.controller.getVectorMask(layerId)?.edges.find((e) => e.component === at.component && e.subpath === at.subpath && e.segment === at.segment)?.mode ?? "hard";
+    const next = now === "hard" ? "feather" : now === "feather" ? "matte" : "hard";
+    try {
+      this.controller.setVectorMaskEdge(layerId, at, next);
+    } catch (e) {
+      this.error = e instanceof Error ? e.message : String(e);
+    }
+  }
   /** Alt-click: a corner anchor becomes smooth, a smooth one a corner (one undo step). */
   convert(cs, r) {
     const next = cloneComponents(cs);
@@ -21745,7 +22254,7 @@ var PathEditGesture = class {
     if (!g) return;
     if (g.kind === "marquee") {
       g.end = pt(p);
-      const box = rect(g.start, g.end);
+      const box = rect2(g.start, g.end);
       const cs = this.target ? this.controller.getPathEditComponents(this.target) : [];
       this.selected = new Set(g.keep);
       cs.forEach(
@@ -21852,12 +22361,18 @@ var PathEditGesture = class {
     const cs = this.components();
     if (!cs) return null;
     const curves = [];
+    const curveModes = [];
+    const edges = this.target?.kind === "vector-mask" ? this.controller.getVectorMask(this.target.layerId)?.edges ?? [] : [];
+    const modeOf = (ci, si, k) => edges.find((e) => e.component === ci && e.subpath === si && e.segment === k)?.mode ?? "hard";
     const anchors = [];
     const handles = [];
     const selectedComponents = new Set(this.selection.map((r) => r.component));
     cs.forEach(
       (c, ci) => c.subpaths.forEach((sp, si) => {
-        for (let i = 0; i < subpathSegmentCount(sp); i++) curves.push(subpathSegment(sp, i).map(([x, y]) => ({ x, y })));
+        for (let i = 0; i < subpathSegmentCount(sp); i++) {
+          curves.push(subpathSegment(sp, i).map(([x, y]) => ({ x, y })));
+          curveModes.push(modeOf(ci, si, i));
+        }
         sp.anchors.forEach((a, ai) => {
           const selected = this.selected.has(key({ component: ci, subpath: si, anchor: ai }));
           if (tool === "path-select" && !selectedComponents.has(ci)) return;
@@ -21874,11 +22389,11 @@ var PathEditGesture = class {
       const last = sp?.anchors[sp.anchors.length - 1];
       if (last) preview = last.out ? [pt(last), pt(last.out), this.pointer, this.pointer] : [pt(last), this.pointer];
     }
-    const marquee = this.drag?.kind === "marquee" ? rect(this.drag.start, this.drag.end) : null;
-    return { curves, anchors, handles, marquee, preview };
+    const marquee = this.drag?.kind === "marquee" ? rect2(this.drag.start, this.drag.end) : null;
+    return { curves, ...edges.length ? { curveModes } : {}, anchors, handles, marquee, preview };
   }
 };
-function rect(a, b) {
+function rect2(a, b) {
   return { x: Math.min(a.x, b.x), y: Math.min(a.y, b.y), width: Math.abs(b.x - a.x), height: Math.abs(b.y - a.y) };
 }
 function prune(cs) {
@@ -22079,21 +22594,21 @@ var ContentAwareFillSession = class _ContentAwareFillSession {
     }
   }
   /** Pointer down with the Sampling Brush (Alt flips add and subtract). Returns false for other tools. */
-  begin(point, modifiers = {}) {
+  begin(point2, modifiers = {}) {
     if (this.settingsValue.tool !== "sampling-brush" || !this.win) return false;
     const add2 = this.settingsValue.brushMode === "add" !== Boolean(modifiers.altKey);
     this.settingsValue = { ...this.settingsValue, sampling: "custom" };
-    this.lastPoint = point;
+    this.lastPoint = point2;
     this.strokeAdds = add2;
-    this.paint(point, point, add2);
+    this.paint(point2, point2, add2);
     this.emit();
     return true;
   }
   strokeAdds = true;
-  move(point) {
+  move(point2) {
     if (!this.lastPoint) return;
-    this.paint(this.lastPoint, point, this.strokeAdds);
-    this.lastPoint = point;
+    this.paint(this.lastPoint, point2, this.strokeAdds);
+    this.lastPoint = point2;
     this.emit();
   }
   /** Pointer up: the preview follows the new area when live. */
@@ -22407,6 +22922,7 @@ export {
   SELECTION_MODES,
   SELECTION_MODE_LABELS,
   SELECTION_MODIFY_OPS,
+  SELECTION_RECIPE_OPS,
   SELECTION_TOOLS,
   SELECT_AND_MASK_TOOLS,
   SELECT_AND_MASK_VIEWS,
@@ -22453,6 +22969,7 @@ export {
   TypeToolGesture,
   UNITS,
   U_MAX,
+  VECTOR_MASK_EDGE_DEFAULTS,
   VIBRANCE_GREY,
   W9,
   WARP_GRID_OPTIONS,
@@ -22671,6 +23188,8 @@ export {
   describeChannel,
   describeLayer,
   describeLayerEffects,
+  describeRecipe,
+  describeRecipeStep,
   describeSelection,
   describeTransform,
   deserializeChannels,
@@ -22801,6 +23320,7 @@ export {
   hueRangeTables,
   hueRangeWeight,
   hueSaturation,
+  hybridVectorMaskCoverage,
   identityCurve,
   identityLevels,
   identityTransform,
@@ -22854,6 +23374,7 @@ export {
   isSelectionEmpty,
   isSelectionMode,
   isSeparableBlendMode,
+  isShapeStep,
   isSmartSurfaceIncomplete,
   isSpatialFilter,
   isSrgb,
@@ -22871,6 +23392,7 @@ export {
   layerEffectsBadge,
   layerEffectsOf,
   layerEffectsPanel,
+  layerGuide,
   layerHasThumbnail,
   layerLabel,
   layerMaskCoverage,
@@ -23060,9 +23582,11 @@ export {
   readPaths,
   readPixel,
   readPsd,
+  readRecipeStep,
   readRegion,
   readShapeComponents,
   readSourceRegion,
+  recipeStepSetting,
   rectSelection,
   rectToQuad,
   reduceSurface,
@@ -23087,6 +23611,7 @@ export {
   renderText,
   replaceContents,
   replaceTextRange,
+  replaySelectionRecipe,
   requireLayer,
   requireOperation,
   requireShapeLayer,
@@ -23119,6 +23644,7 @@ export {
   sameCanvasViewport,
   sampleLut,
   sampleToneLut,
+  samplingKey,
   saturationOf,
   scaleLayerEffect,
   scalePaintGradient,
@@ -23206,6 +23732,7 @@ export {
   standardBlendMode,
   startMarchingAnts,
   startSelectionWorker,
+  stepNeedsPixels,
   stepSlotTs,
   strokeGrainCatch,
   styleAt,
@@ -23276,11 +23803,13 @@ export {
   upscaleRegion,
   userErrorMessage,
   uvToXy,
+  validVectorMaskEdges,
   validateEffectGradient,
   validateLayerEffect,
   validateLayerEffects,
   vectorMaskBounds,
   vectorMaskCoverage,
+  vectorMaskSegments,
   vectorMaskThumbnail,
   vectorMaskThumbnailClick,
   versionedDescriptorBytes,