@pixerate/editor 0.135.0 → 0.137.0

package/dist/{chunk-EM3FMJWE.js → chunk-5FSRTP6E.js}

@@ -1,18 +1,28 @@
+import {
+  BRUSHSTROKE_MAX_SCALE,
+  BRUSHSTROKE_MIN_SCALE
+} from "./chunk-63AZAUSN.js";
 import {
   PIGMENT_BANDS,
   TILE,
+  TiledSurface,
   blendPixel,
   createPigment,
+  emptySurface,
+  finishTile,
   lerpPigmentInto,
   mixPigment8,
   mixPigmentRgb,
   pigment8,
+  pngDataUrl,
+  readRegion,
   setPigmentColor,
   srgbDecode,
   srgbEncode,
   tileCoord,
-  tileKey
-} from "./chunk-BR7EKQUP.js";
+  tileKey,
+  tilesInRect
+} from "./chunk-3G6J7UFV.js";
 
 // src/paint/rand.ts
 function mix32(h) {
@@ -1090,6 +1100,302 @@ function coverageTileCoord(key) {
   return tileCoord(key);
 }
 
+// src/paint/path-stroke.ts
+function lean(s) {
+  if (typeof s.altitude === "number" && Number.isFinite(s.altitude)) {
+    return { amount: 1 - Math.min(1, Math.max(0, s.altitude / (Math.PI / 2))), azimuth: s.azimuth ?? 0 };
+  }
+  if (typeof s.tiltX === "number" || typeof s.tiltY === "number") {
+    const tx = (s.tiltX ?? 0) * Math.PI / 180;
+    const ty = (s.tiltY ?? 0) * Math.PI / 180;
+    if (tx === 0 && ty === 0) return { amount: 0, azimuth: 0 };
+    const az = Math.atan2(Math.tan(ty), Math.tan(tx));
+    const alt = Math.atan(1 / Math.hypot(Math.tan(tx), Math.tan(ty)));
+    return { amount: 1 - alt / (Math.PI / 2), azimuth: az };
+  }
+  return null;
+}
+function pathStrokeDabs(samples, options) {
+  const brush = normalizeBrush(options.brush);
+  const pts = options.closed && samples.length > 2 ? [...samples, samples[0]] : [...samples];
+  if (!pts.length) return [];
+  const tilt = options.tilt ?? {};
+  const minSize = Math.min(1, Math.max(0, options.minSize ?? 0));
+  let index = 0;
+  const t0 = pts.find((s) => typeof s.t === "number" && Number.isFinite(s.t))?.t ?? null;
+  const dab = (x, y, p, l, dir, travel = 0, time = null, speed = null) => {
+    const pr = Math.min(1, Math.max(0, p));
+    const lean0 = l?.amount ?? 0;
+    const size = brush.size * (brush.pressureSize ? minSize + (1 - minSize) * pr : 1) * (1 + 1.5 * (tilt.size ?? 0) * lean0);
+    let angle = brush.angle * Math.PI / 180;
+    if (options.followPath) angle += dir;
+    if (tilt.followAzimuth && l) angle = -l.azimuth;
+    const roundness = Math.max(0.05, brush.roundness * (1 - 0.85 * (tilt.roundness ?? 0) * lean0));
+    const op = brush.pressureOpacity ? pr : 1;
+    const params = { travel, index: index++, pressure: pr, lean: lean0, speed, direction: dir, time: time === null || t0 === null ? null : time - t0 };
+    return { x, y, radius: Math.max(0.5, size / 2), alpha: brush.flow, opacity: brush.opacity * op, angle, roundness, params };
+  };
+  const out = [];
+  const pressure = (s) => typeof s.pressure === "number" && Number.isFinite(s.pressure) ? s.pressure : 1;
+  if (pts.length === 1) {
+    out.push(dab(pts[0].x, pts[0].y, pressure(pts[0]), lean(pts[0]), 0));
+    return out;
+  }
+  let carry = 0;
+  let along = 0;
+  const timeOf = (s) => typeof s.t === "number" && Number.isFinite(s.t) ? s.t : null;
+  out.push(dab(pts[0].x, pts[0].y, pressure(pts[0]), lean(pts[0]), Math.atan2(-(pts[1].y - pts[0].y), pts[1].x - pts[0].x), 0, timeOf(pts[0])));
+  for (let i = 0; i + 1 < pts.length; i++) {
+    const a = pts[i];
+    const b = pts[i + 1];
+    const dx = b.x - a.x;
+    const dy = b.y - a.y;
+    const len = Math.hypot(dx, dy);
+    if (len === 0) continue;
+    const dir = Math.atan2(-dy, dx);
+    const la = lean(a);
+    const lb = lean(b);
+    const ta = timeOf(a);
+    const tb = timeOf(b);
+    const speed = ta !== null && tb !== null && tb > ta ? len / (tb - ta) : null;
+    let t = carry;
+    for (; ; ) {
+      const f = t / len;
+      if (f > 1) break;
+      const p = pressure(a) + (pressure(b) - pressure(a)) * f;
+      const l = la && lb ? { amount: la.amount + (lb.amount - la.amount) * f, azimuth: la.azimuth + (lb.azimuth - la.azimuth) * f } : la ?? lb;
+      const size = brush.size * (brush.pressureSize ? minSize + (1 - minSize) * p : 1);
+      const step = Math.max(0.5, size * brush.spacing);
+      if (t > 0 || i > 0) out.push(dab(a.x + dx * f, a.y + dy * f, p, l, dir, along + t, ta !== null && tb !== null ? ta + (tb - ta) * f : null, speed));
+      t += step;
+    }
+    carry = t - len;
+    along += len;
+  }
+  return out;
+}
+function pathStrokeCoverage(samples, options) {
+  const brush = normalizeBrush(options.brush);
+  const coverage = new CoverageMap();
+  const dabs = pathStrokeDabs(samples, options);
+  const g = options.gradient?.paint.type === "gradient" ? options.gradient : null;
+  const sampler = g ? new PaintGradientSampler(resolvePaintGradient(g.paint, g.colors ?? { paint: "#000000", secondary: "#ffffff" }), g.seed ?? 0) : null;
+  const tipTable = sampler?.acrossTip ? sampler.tipTable(TIP_GRADIENT_STEPS) : null;
+  const scratch = { field: new Float32Array(0), sample: { rgb: [0, 0, 0], alpha: 1 } };
+  let buf = new Float32Array(0);
+  let bounds = null;
+  for (const d of dabs) {
+    const rect = dabRect(d, brush.hardness);
+    const n = rect.width * rect.height;
+    if (n <= 0) continue;
+    if (buf.length < n) buf = new Float32Array(n);
+    const vals = buf.subarray(0, n);
+    rasterizeDab(d, brush.hardness, rect, vals);
+    if (sampler) {
+      const { color, field } = gradientDabColor(sampler, tipTable, d, d.params, rect, vals, scratch);
+      coverage.accumulate(rect, vals, d.opacity, color, field);
+    } else coverage.accumulate(rect, vals, d.opacity);
+    if (!bounds) bounds = { ...rect };
+    else {
+      const x = Math.min(bounds.x, rect.x);
+      const y = Math.min(bounds.y, rect.y);
+      bounds = { x, y, width: Math.max(bounds.x + bounds.width, rect.x + rect.width) - x, height: Math.max(bounds.y + bounds.height, rect.y + rect.height) - y };
+    }
+  }
+  return { coverage, bounds, dabs: dabs.length };
+}
+function paintPathStroke(surface, samples, options) {
+  if (surface.channels !== 4) throw new Error("paintPathStroke paints RGBA surfaces (4 channels).");
+  const brush = normalizeBrush(options.brush);
+  const hex = (c) => "#" + [0, 1, 2].map((i) => Math.round(Math.min(255, Math.max(0, c[i]))).toString(16).padStart(2, "0")).join("");
+  let color = options.color;
+  if (options.paint?.paint.type === "color") {
+    const rgb = hexToPaintRgb(options.paint.paint.color).map((v) => Math.round(v * 255));
+    color = [rgb[0], rgb[1], rgb[2], color[3]];
+  }
+  const gradient = options.paint?.paint.type === "gradient" ? { ...options.paint, colors: options.paint.colors ?? { paint: hex(color), secondary: "#ffffff" } } : null;
+  const { coverage, bounds, dabs } = pathStrokeCoverage(samples, { ...options, gradient });
+  if (!bounds) return { surface, bounds: null, dabs };
+  const offset = options.offset ?? { x: 0, y: 0 };
+  const apply = {
+    mode: options.mode ?? "paint",
+    color,
+    background: [0, 0, 0, 0],
+    opacity: brush.opacity,
+    blend: options.blend ?? brush.blend,
+    lockTransparency: options.lockTransparency ?? false,
+    selection: options.selection ?? null,
+    offset
+  };
+  const tiles = new Map(surface.tiles);
+  for (const { tx, ty } of tilesInRect({ x: bounds.x - offset.x, y: bounds.y - offset.y, width: bounds.width, height: bounds.height })) {
+    const key = tileKey(tx, ty);
+    const src = surface.tiles.get(key)?.data;
+    const base = src && src.length === TILE * TILE * 4 ? src : new Uint8ClampedArray(TILE * TILE * 4);
+    const t = finishTile(applyStrokeToTile(coverage, base, 4, tx, ty, apply), 4, surface.defaultValue);
+    if (t) tiles.set(key, t);
+    else tiles.delete(key);
+  }
+  return { surface: new TiledSurface(4, tiles, surface.defaultValue), bounds, dabs };
+}
+
+// src/paint/brushstroke.ts
+var DEFAULT_MAX_PIXELS = 4096 * 4096;
+var isProfilePath = (input) => !Array.isArray(input) && typeof input === "object" && input !== null && "points" in input;
+function profileAt(profile, f) {
+  if (!profile || !profile.length) return void 0;
+  if (profile.length === 1) return profile[0];
+  const u = Math.min(1, Math.max(0, f)) * (profile.length - 1);
+  const i = Math.min(profile.length - 2, Math.floor(u));
+  return profile[i] + (profile[i + 1] - profile[i]) * (u - i);
+}
+function brushstrokeSamples(input) {
+  if (!isProfilePath(input)) return input.map((s) => ({ ...s }));
+  const pts = input.points;
+  const lengths = [0];
+  for (let i = 1; i < pts.length; i++) lengths.push(lengths[i - 1] + Math.hypot(pts[i].x - pts[i - 1].x, pts[i].y - pts[i - 1].y));
+  const total = lengths.at(-1) ?? 0;
+  return pts.map((p, i) => {
+    const f = total > 0 ? lengths[i] / total : pts.length > 1 ? i / (pts.length - 1) : 0;
+    const s = { x: p.x, y: p.y };
+    const pressure = profileAt(input.pressure, f);
+    const tiltX = profileAt(input.tiltX, f);
+    const tiltY = profileAt(input.tiltY, f);
+    if (pressure !== void 0) s.pressure = pressure;
+    if (tiltX !== void 0) s.tiltX = tiltX;
+    if (tiltY !== void 0) s.tiltY = tiltY;
+    return s;
+  });
+}
+var REFUSED_ENGINES = {
+  wet: "is a wet brush, and wet paint needs an area to flow in (paint it on a wet layer in the paint editor)",
+  mixer: "is a Mixer Brush, which picks up paint from under the tip and has none on a standalone stroke",
+  blender: "is a blender, which only moves paint that is already there",
+  smudge: "is a smudge brush, which only moves paint that is already there",
+  eraser: "is an eraser, which has nothing to remove on a standalone stroke"
+};
+function brushstrokeStrokeOptions(brush) {
+  if (!brush || typeof brush !== "object") throw new Error("A brushstroke needs a brush: tip settings ({ size, hardness, \u2026 }) or a paint brush preset.");
+  if (!("tip" in brush) || !brush.tip) return { brush: normalizeBrush(brush) };
+  const engine = brush.engine ?? "dab";
+  if (engine !== "dab") {
+    const label = brush.name ?? brush.id ?? "This brush";
+    const why = REFUSED_ENGINES[engine] ?? `uses the '${engine}' engine, which renderBrushstroke does not draw`;
+    throw new Error(`Brushstrokes render dry media only: '${label}' ${why}. Pick a dry brush (a dab-engine preset such as a pencil, pastel, charcoal, marker, ink or airbrush) or plain tip settings.`);
+  }
+  const d = brush.dynamics ?? {};
+  const tilt = { size: d.tiltSize ?? 0, roundness: d.tiltRoundness ?? 0 };
+  return {
+    brush: normalizeBrush(brush.tip),
+    followPath: brush.rotation === "stroke",
+    minSize: d.minSize ?? 0,
+    ...tilt.size || tilt.roundness ? { tilt } : {}
+  };
+}
+function isBrushstrokeBrush(brush) {
+  return !("tip" in brush) || !brush.tip || (brush.engine ?? "dab") === "dab";
+}
+var finite2 = (v) => typeof v === "number" && Number.isFinite(v);
+function renderBrushstroke(input, brush, options = {}) {
+  const strokeOptions = brushstrokeStrokeOptions(brush);
+  const samples = brushstrokeSamples(input);
+  for (const s of samples) if (!finite2(s.x) || !finite2(s.y)) throw new Error("Brushstroke samples need finite x and y.");
+  const solid = options.paint && !("type" in options.paint) ? options.paint.color : null;
+  const source = options.paint && "type" in options.paint ? options.paint : null;
+  const color = solid ?? options.color ?? [0, 0, 0, 255];
+  let scale = finite2(options.scale) && options.scale > 0 ? Math.min(BRUSHSTROKE_MAX_SCALE, Math.max(BRUSHSTROKE_MIN_SCALE, options.scale)) : 1;
+  if (!samples.length) return { image: { width: 0, height: 0, data: new Uint8ClampedArray(0) }, bounds: null, scale, dabs: 0 };
+  const tip = strokeOptions.brush;
+  const reach = tip.size * (1 + 1.5 * (strokeOptions.tilt?.size ?? 0)) + 4;
+  let x0 = Infinity, y0 = Infinity, x1 = -Infinity, y1 = -Infinity;
+  for (const s of samples) {
+    x0 = Math.min(x0, s.x);
+    y0 = Math.min(y0, s.y);
+    x1 = Math.max(x1, s.x);
+    y1 = Math.max(y1, s.y);
+  }
+  const maxPixels = finite2(options.maxPixels) && options.maxPixels > 0 ? options.maxPixels : DEFAULT_MAX_PIXELS;
+  const area = (x1 - x0 + reach) * (y1 - y0 + reach);
+  if (area * scale * scale > maxPixels) scale = Math.max(BRUSHSTROKE_MIN_SCALE, Math.sqrt(maxPixels / area));
+  const scaled = samples.map((s) => ({ ...s, x: s.x * scale, y: s.y * scale }));
+  const { surface, bounds, dabs } = paintPathStroke(emptySurface(4), scaled, {
+    ...strokeOptions,
+    brush: { ...tip, size: tip.size * scale },
+    closed: options.closed ?? strokeOptions.closed,
+    color,
+    // Gradient lengths are in path units: scale them with the image.
+    ...source ? { paint: { paint: source.type === "gradient" ? scalePaintGradient(source, scale) : source, seed: options.seed ?? 0 } } : {}
+  });
+  if (!bounds) return { image: { width: 0, height: 0, data: new Uint8ClampedArray(0) }, bounds: null, scale, dabs };
+  const rect = bounds;
+  const data = readRegion(surface, rect);
+  return {
+    image: { width: rect.width, height: rect.height, data },
+    bounds: { x: rect.x / scale, y: rect.y / scale, width: rect.width / scale, height: rect.height / scale },
+    scale,
+    dabs
+  };
+}
+function brushstrokeDataUrl(stroke) {
+  const { width, height, data } = stroke.image;
+  return width && height ? pngDataUrl(width, height, data) : "";
+}
+function brushstrokeToCanvas(stroke, createCanvas) {
+  const { width, height, data } = stroke.image;
+  if (!width || !height) return null;
+  const canvas = createCanvas(width, height);
+  const ctx = canvas.getContext("2d");
+  if (!ctx) return null;
+  const img = ctx.createImageData(width, height);
+  img.data.set(data);
+  ctx.putImageData(img, 0, 0);
+  return canvas;
+}
+function hashString(s, h = 2166136261) {
+  for (let i = 0; i < s.length; i++) {
+    h ^= s.charCodeAt(i);
+    h = Math.imul(h, 16777619) >>> 0;
+  }
+  return h;
+}
+function brushstrokeKey(input, brush, options = {}) {
+  const path = JSON.stringify(input);
+  const { brush: tip, ...rest } = brushstrokeStrokeOptions(brush);
+  const rest2 = JSON.stringify([tip, rest, options.paint ?? options.color ?? null, options.seed ?? 0, options.closed ?? false, options.maxPixels ?? null]);
+  const scale = finite2(options.scale) ? options.scale : 1;
+  return `${hashString(path).toString(16)}:${path.length}:${hashString(rest2).toString(16)}:${scale}`;
+}
+var BrushstrokeCache = class {
+  constructor(capacity = 64) {
+    this.capacity = capacity;
+  }
+  capacity;
+  entries = /* @__PURE__ */ new Map();
+  /** Renders that missed the cache (for tests and stats). */
+  misses = 0;
+  get size() {
+    return this.entries.size;
+  }
+  /** The cached stroke for these arguments, rendering (and caching) it on a miss. */
+  render(input, brush, options = {}) {
+    const key = brushstrokeKey(input, brush, options);
+    const hit = this.entries.get(key);
+    if (hit) {
+      this.entries.delete(key);
+      this.entries.set(key, hit);
+      return hit;
+    }
+    this.misses++;
+    const out = renderBrushstroke(input, brush, options);
+    this.entries.set(key, out);
+    while (this.entries.size > Math.max(1, this.capacity)) this.entries.delete(this.entries.keys().next().value);
+    return out;
+  }
+  clear() {
+    this.entries.clear();
+  }
+};
+
 // src/paint/exchange.ts
 var MIXING_MODELS = ["rgb", "pigment"];
 var EMPTY_MIXER_LOAD = { reservoir: null, amount: 0, pickup: null };
@@ -1756,6 +2062,17 @@ export {
   applyStrokeToTile,
   applyStrokeToDeepTile,
   coverageTileCoord,
+  pathStrokeDabs,
+  pathStrokeCoverage,
+  paintPathStroke,
+  brushstrokeSamples,
+  brushstrokeStrokeOptions,
+  isBrushstrokeBrush,
+  renderBrushstroke,
+  brushstrokeDataUrl,
+  brushstrokeToCanvas,
+  brushstrokeKey,
+  BrushstrokeCache,
   MIXING_MODELS,
   EMPTY_MIXER_LOAD,
   MIXER_PICKUP_RATE,
@@ -1779,4 +2096,4 @@ export {
   cleanMixer,
   MixerStroke
 };
-//# sourceMappingURL=chunk-EM3FMJWE.js.map
+//# sourceMappingURL=chunk-5FSRTP6E.js.map