@pixerate/editor 0.248.0 → 0.250.0

package/dist/chunk-ATK6ABN3.cjs

@@ -0,0 +1,303 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } async function _asyncNullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return await rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class;
+
+
+
+
+
+var _chunk4JNWA3VTcjs = require('./chunk-4JNWA3VT.cjs');
+
+
+var _chunkU67EN7GGcjs = require('./chunk-U67EN7GG.cjs');
+
+
+var _chunkW5M3J7PVcjs = require('./chunk-W5M3J7PV.cjs');
+
+// src/stickers/editor.ts
+var BOX = 100;
+var GRID = 128;
+var SHAPE_SEED = 7;
+var LICENCE = { spdx: "MIT", name: "MIT", commercial: true };
+var META = {
+  dot: { name: "Dot", category: "shapes", tags: ["circle", "round", "spot"], colour: "#2563eb", description: "A round dot." },
+  star: { name: "Star", category: "shapes", tags: ["five-pointed", "favourite", "rating"], colour: "#f59e0b", description: "A five-pointed star, one point up." },
+  heart: { name: "Heart", category: "shapes", tags: ["love", "like"], colour: "#e11d48", description: "A heart." },
+  leaf: { name: "Leaf", category: "nature", tags: ["plant", "green"], colour: "#16a34a", description: "A pointed leaf with a midrib." },
+  flower: { name: "Flower", category: "nature", tags: ["petals", "blossom"], colour: "#db2777", description: "A five-petal flower." },
+  confetti: { name: "Confetti", category: "party", tags: ["celebration", "rectangle"], colour: "#7c3aed", description: "A small strip of confetti." },
+  splat: { name: "Splat", category: "party", tags: ["paint", "splash", "blob"], colour: "#0891b2", description: "A paint splat with drops." },
+  sparkle: { name: "Sparkle", category: "party", tags: ["twinkle", "shine", "glint"], colour: "#eab308", description: "A four-pointed twinkle." },
+  ring: { name: "Ring", category: "shapes", tags: ["circle", "outline", "hoop"], colour: "#0f766e", description: "A ring." }
+};
+var HEX = /^#[0-9a-fA-F]{6}$/;
+function stampOutline(kind) {
+  const n = GRID;
+  const f = new Float32Array((n + 1) * (n + 1));
+  for (let j = 0; j <= n; j++) for (let i = 0; i <= n; i++) f[j * (n + 1) + i] = _chunk4JNWA3VTcjs.stampCoverage.call(void 0, kind, i / n * 2 - 1, j / n * 2 - 1, SHAPE_SEED) - 0.5;
+  const at = (i, j) => f[j * (n + 1) + i];
+  const points = /* @__PURE__ */ new Map();
+  const point = (key, i0, j0, i1, j1) => {
+    if (!points.has(key)) {
+      const a = at(i0, j0);
+      const b = at(i1, j1);
+      const t = a / (a - b);
+      points.set(key, [(i0 + (i1 - i0) * t) / n * BOX, (j0 + (j1 - j0) * t) / n * BOX]);
+    }
+    return key;
+  };
+  const next = /* @__PURE__ */ new Map();
+  for (let j = 0; j < n; j++) {
+    for (let i = 0; i < n; i++) {
+      const tl = at(i, j) > 0 ? 1 : 0;
+      const tr = at(i + 1, j) > 0 ? 1 : 0;
+      const br = at(i + 1, j + 1) > 0 ? 1 : 0;
+      const bl = at(i, j + 1) > 0 ? 1 : 0;
+      const code = tl << 3 | tr << 2 | br << 1 | bl;
+      if (code === 0 || code === 15) continue;
+      const top = () => point(`h${i},${j}`, i, j, i + 1, j);
+      const right = () => point(`v${i + 1},${j}`, i + 1, j, i + 1, j + 1);
+      const bottom = () => point(`h${i},${j + 1}`, i, j + 1, i + 1, j + 1);
+      const left = () => point(`v${i},${j}`, i, j, i, j + 1);
+      const seg = (a, b) => next.set(a, b);
+      const centre = at(i, j) + at(i + 1, j) + at(i + 1, j + 1) + at(i, j + 1) > 0;
+      switch (code) {
+        case 1:
+          seg(left(), bottom());
+          break;
+        case 2:
+          seg(bottom(), right());
+          break;
+        case 3:
+          seg(left(), right());
+          break;
+        case 4:
+          seg(right(), top());
+          break;
+        case 5:
+          if (centre) {
+            seg(left(), top());
+            seg(right(), bottom());
+          } else {
+            seg(left(), bottom());
+            seg(right(), top());
+          }
+          break;
+        case 6:
+          seg(bottom(), top());
+          break;
+        case 7:
+          seg(left(), top());
+          break;
+        case 8:
+          seg(top(), left());
+          break;
+        case 9:
+          seg(top(), bottom());
+          break;
+        case 10:
+          if (centre) {
+            seg(top(), right());
+            seg(bottom(), left());
+          } else {
+            seg(top(), left());
+            seg(bottom(), right());
+          }
+          break;
+        case 11:
+          seg(top(), right());
+          break;
+        case 12:
+          seg(right(), left());
+          break;
+        case 13:
+          seg(right(), bottom());
+          break;
+        case 14:
+          seg(bottom(), left());
+          break;
+      }
+    }
+  }
+  const loops = [];
+  const seen = /* @__PURE__ */ new Set();
+  for (const start of next.keys()) {
+    if (seen.has(start)) continue;
+    const loop = [];
+    let k = start;
+    while (k !== void 0 && !seen.has(k)) {
+      seen.add(k);
+      loop.push(points.get(k));
+      k = next.get(k);
+    }
+    if (loop.length >= 3) loops.push(simplify(loop, 0.12));
+  }
+  const fmt = (v) => String(Math.round(v * 100) / 100);
+  return loops.map((l) => "M" + l.map(([x, y]) => `${fmt(x)} ${fmt(y)}`).join("L") + "Z").join("");
+}
+function simplify(loop, eps) {
+  if (loop.length < 8) return loop;
+  const keep = new Uint8Array(loop.length);
+  const rdp = (a, b) => {
+    const [ax, ay] = loop[a];
+    const [bx, by] = loop[b];
+    const len = Math.hypot(bx - ax, by - ay) || 1e-9;
+    let worst = -1;
+    let far = 0;
+    for (let i = a + 1; i < b; i++) {
+      const d = Math.abs((bx - ax) * (ay - loop[i][1]) - (ax - loop[i][0]) * (by - ay)) / len;
+      if (d > far) {
+        far = d;
+        worst = i;
+      }
+    }
+    if (worst !== -1 && far > eps) {
+      keep[worst] = 1;
+      rdp(a, worst);
+      rdp(worst, b);
+    }
+  };
+  const mid = Math.floor(loop.length / 2);
+  keep[0] = keep[mid] = 1;
+  rdp(0, mid);
+  rdp(mid, loop.length - 1);
+  keep[loop.length - 1] = 1;
+  return loop.filter((_, i) => keep[i]);
+}
+function stampPixels(kind, size, colour) {
+  const out = new Uint8ClampedArray(size * size * 4);
+  const n = parseInt(colour.slice(1), 16);
+  const ss = size <= 128 ? 3 : 2;
+  for (let y = 0; y < size; y++) {
+    for (let x = 0; x < size; x++) {
+      let c = 0;
+      for (let sy = 0; sy < ss; sy++) for (let sx = 0; sx < ss; sx++) c += _chunk4JNWA3VTcjs.stampCoverage.call(void 0, kind, (x + (sx + 0.5) / ss) / size * 2 - 1, (y + (sy + 0.5) / ss) / size * 2 - 1, SHAPE_SEED);
+      const a = Math.round(c / (ss * ss) * 255);
+      if (!a) continue;
+      const i = (y * size + x) * 4;
+      out[i] = n >> 16 & 255;
+      out[i + 1] = n >> 8 & 255;
+      out[i + 2] = n & 255;
+      out[i + 3] = a;
+    }
+  }
+  return out;
+}
+function editorStickers() {
+  const outlines = /* @__PURE__ */ new Map();
+  const thumbs = /* @__PURE__ */ new Map();
+  const outline = (k) => _nullishCoalesce(outlines.get(k), () => ( (outlines.set(k, stampOutline(k)), outlines.get(k))));
+  const summary = (k) => {
+    const m = META[k];
+    if (!thumbs.has(k)) thumbs.set(k, _chunkW5M3J7PVcjs.pngDataUrl.call(void 0, 48, 48, stampPixels(k, 48, m.colour)));
+    return { id: k, name: m.name, category: m.category, tags: m.tags, description: m.description, width: BOX, height: BOX, thumbnail: thumbs.get(k), formats: ["svg", "png"], licence: { ...LICENCE }, tintable: true };
+  };
+  const kind = (id) => {
+    if (!_chunk4JNWA3VTcjs.STAMP_KINDS.includes(id)) throw new (0, _chunkU67EN7GGcjs.StickerError)("unknown_sticker", `The editor has no sticker "${id}"; its stickers are ${_chunk4JNWA3VTcjs.STAMP_KINDS.join(", ")}.`);
+    return id;
+  };
+  return {
+    id: _chunk4JNWA3VTcjs.EDITOR_STICKERS_ID,
+    name: "Editor stickers",
+    version: "1",
+    capabilities: { supportsSearch: true, supportsSvg: true, supportsRaster: true, maxSize: 1024 },
+    list: (options) => _chunk4JNWA3VTcjs.stickerPage.call(void 0, _chunk4JNWA3VTcjs.STAMP_KINDS.map(summary), options),
+    search: (query, options) => _chunk4JNWA3VTcjs.stickerPage.call(void 0, _chunk4JNWA3VTcjs.STAMP_KINDS.map(summary), options, query),
+    describe(id) {
+      if (!_chunk4JNWA3VTcjs.STAMP_KINDS.includes(id)) return void 0;
+      const k = id;
+      return { ...summary(k), silhouette: outline(k), colours: [META[k].colour] };
+    },
+    categories: () => [...new Set(_chunk4JNWA3VTcjs.STAMP_KINDS.map((k) => META[k].category))].map((c) => ({ id: c, name: c[0].toUpperCase() + c.slice(1), count: _chunk4JNWA3VTcjs.STAMP_KINDS.filter((k) => META[k].category === c).length })),
+    load(id, options = {}) {
+      const k = kind(id);
+      const colour = _nullishCoalesce(options.colour, () => ( META[k].colour));
+      if (!HEX.test(colour)) throw new (0, _chunkU67EN7GGcjs.StickerError)("invalid_argument", `colour ${JSON.stringify(colour)} must be #rrggbb.`);
+      if (options.format === "png") {
+        const size = _nullishCoalesce(options.size, () => ( 256));
+        if (!(Number.isInteger(size) && size >= 8 && size <= 1024)) throw new (0, _chunkU67EN7GGcjs.StickerError)("invalid_argument", `size must be a whole number of px from 8 to 1024, got ${size}.`);
+        return { kind: "image", url: _chunkW5M3J7PVcjs.pngDataUrl.call(void 0, size, size, stampPixels(k, size, colour.toLowerCase())), width: size, height: size };
+      }
+      if (options.format !== void 0 && options.format !== "svg") throw new (0, _chunkU67EN7GGcjs.StickerError)("unsupported_format", `format must be svg or png, got ${JSON.stringify(options.format)}.`);
+      const d = outline(k);
+      const svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${BOX} ${BOX}" width="${BOX}" height="${BOX}"><path fill="${colour.toLowerCase()}" fill-rule="evenodd" d="${d}"/></svg>`;
+      return { kind: "svg", svg, silhouette: d };
+    }
+  };
+}
+
+// src/stickers/browser.ts
+var StickerBrowser = (_class = class {
+  constructor(provider, pageSize = 24) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);
+    this.provider = provider;
+    this.pageSize = pageSize;
+    this.s = { query: "", category: "", items: [], total: 0, hasMore: false, loading: false, error: null, categories: [], provider: provider().name };
+  }
+  
+  
+  
+  
+  __init() {this.run = 0}
+  __init2() {this.listeners = /* @__PURE__ */ new Set()}
+  get state() {
+    return this.s;
+  }
+  subscribe(listener) {
+    this.listeners.add(listener);
+    return () => this.listeners.delete(listener);
+  }
+  set(patch) {
+    this.s = { ...this.s, ...patch };
+    for (const l of [...this.listeners]) l();
+  }
+  /** Loads the first page (and the categories) again, for the current provider. */
+  async refresh() {
+    const run = ++this.run;
+    const p = this.provider();
+    this.next = void 0;
+    this.set({ loading: true, error: null, items: [], total: 0, hasMore: false, provider: p.name });
+    try {
+      const categories = await _asyncNullishCoalesce(await _optionalChain([p, 'access', _2 => _2.categories, 'optionalCall', _3 => _3()]), async () => ( []));
+      if (run !== this.run) return;
+      this.set({ categories });
+      await this.page(run, p, true);
+    } catch (e) {
+      if (run === this.run) this.set({ loading: false, error: e instanceof Error ? e.message : String(e) });
+    }
+  }
+  /** Searches for `query` (words; `''` lists everything) from the first page. */
+  setQuery(query) {
+    this.s = { ...this.s, query };
+    return this.refresh();
+  }
+  /** Shows one category (`''` for all) from the first page. */
+  setCategory(category) {
+    this.s = { ...this.s, category };
+    return this.refresh();
+  }
+  /** Loads the next page onto the list. */
+  async more() {
+    if (!this.next || this.s.loading) return;
+    const run = this.run;
+    this.set({ loading: true });
+    try {
+      await this.page(run, this.provider(), false);
+    } catch (e) {
+      if (run === this.run) this.set({ loading: false, error: e instanceof Error ? e.message : String(e) });
+    }
+  }
+  async page(run, p, first) {
+    const options = { limit: this.pageSize, ...this.s.category ? { category: this.s.category } : {}, ...!first && this.next ? { after: this.next } : {} };
+    const q = this.s.query.trim();
+    const res = q && p.capabilities.supportsSearch ? await p.search(q, options) : await p.list(options);
+    if (run !== this.run) return;
+    this.next = res.next;
+    const items = res.items.map((s) => ({ ...s, ref: _chunk4JNWA3VTcjs.stickerRefOf.call(void 0, p, s.id) }));
+    this.set({ items: first ? items : [...this.s.items, ...items], total: res.total, hasMore: Boolean(res.next), loading: false });
+  }
+}, _class);
+
+
+
+
+
+
+exports.stampOutline = stampOutline; exports.stampPixels = stampPixels; exports.editorStickers = editorStickers; exports.StickerBrowser = StickerBrowser;

package/dist/{chunk-7T7JWTVE.cjs → chunk-BOHDJJ2O.cjs}

@@ -5,10 +5,10 @@
 
 
 
-var _chunkHB4ICNNAcjs = require('./chunk-HB4ICNNA.cjs');
+var _chunkDPYAO5U6cjs = require('./chunk-DPYAO5U6.cjs');
 
 
-var _chunkOLNIPTB3cjs = require('./chunk-OLNIPTB3.cjs');
+var _chunk2VX55NFMcjs = require('./chunk-2VX55NFM.cjs');
 
 // src/raster/effects/ui.ts
 function layerEffectsPanel(layer) {
@@ -23,18 +23,18 @@ function layerEffectsPanel(layer) {
     reason: readOnly ? "The layer is locked; unlock it to change its layer style." : void 0,
     enabled: _nullishCoalesce(_optionalChain([fx, 'optionalAccess', _3 => _3.enabled]), () => ( true)),
     scale: _nullishCoalesce(_optionalChain([fx, 'optionalAccess', _4 => _4.scale]), () => ( 1)),
-    rows: (_nullishCoalesce(_optionalChain([fx, 'optionalAccess', _5 => _5.items]), () => ( []))).map((e) => ({ id: e.id, kind: e.kind, label: _chunkHB4ICNNAcjs.layerEffectLabel.call(void 0, e.kind), enabled: e.enabled }))
+    rows: (_nullishCoalesce(_optionalChain([fx, 'optionalAccess', _5 => _5.items]), () => ( []))).map((e) => ({ id: e.id, kind: e.kind, label: _chunkDPYAO5U6cjs.layerEffectLabel.call(void 0, e.kind), enabled: e.enabled }))
   };
 }
 function layerEffectsBadge(layer) {
   if (!_optionalChain([layer, 'access', _6 => _6.effects, 'optionalAccess', _7 => _7.items, 'access', _8 => _8.length])) return null;
-  return _chunkHB4ICNNAcjs.hasActiveEffects.call(void 0, layer.effects) ? "on" : "off";
+  return _chunkDPYAO5U6cjs.hasActiveEffects.call(void 0, layer.effects) ? "on" : "off";
 }
-var LAYER_EFFECT_MENU = _chunkHB4ICNNAcjs.LAYER_EFFECT_KINDS.map((kind) => ({ kind, label: _chunkHB4ICNNAcjs.layerEffectLabel.call(void 0, kind) }));
-var BLENDS = _chunkOLNIPTB3cjs.BLEND_MODES.filter((m) => m.id !== "pigment").map((m) => ({ value: m.id, label: m.label }));
+var LAYER_EFFECT_MENU = _chunkDPYAO5U6cjs.LAYER_EFFECT_KINDS.map((kind) => ({ kind, label: _chunkDPYAO5U6cjs.layerEffectLabel.call(void 0, kind) }));
+var BLENDS = _chunk2VX55NFMcjs.BLEND_MODES.filter((m) => m.id !== "pigment").map((m) => ({ value: m.id, label: m.label }));
 var opt = (...pairs) => pairs.map(([value, label]) => ({ value, label }));
 function patternOptions(patterns) {
-  return [...patterns.map((p) => ({ value: p.id, label: p.name || p.id })), ..._chunkHB4ICNNAcjs.builtinPatternIds.call(void 0, ).map((id) => ({ value: id, label: _chunkHB4ICNNAcjs.builtinPattern.call(void 0, id).name }))];
+  return [...patterns.map((p) => ({ value: p.id, label: p.name || p.id })), ..._chunkDPYAO5U6cjs.builtinPatternIds.call(void 0, ).map((id) => ({ value: id, label: _chunkDPYAO5U6cjs.builtinPattern.call(void 0, id).name }))];
 }
 function getPath(o, path) {
   let v = o;
@@ -164,7 +164,7 @@ function layerEffectControls(e, patterns = []) {
   }
 }
 function fillOfType(current, type, patterns) {
-  if (type === "gradient") return { type: "gradient", gradient: _chunkHB4ICNNAcjs.defaultEffectGradient.call(void 0, ) };
+  if (type === "gradient") return { type: "gradient", gradient: _chunkDPYAO5U6cjs.defaultEffectGradient.call(void 0, ) };
   if (type === "pattern") return { type: "pattern", patternId: _nullishCoalesce(_optionalChain([patterns, 'access', _15 => _15[0], 'optionalAccess', _16 => _16.id]), () => ( "checker")), scale: 1 };
   return { type: "color", color: current.type === "color" ? current.color : "#000000" };
 }

package/dist/{chunk-2PBZBRP5.js → chunk-D5KGAO4Z.js}

@@ -1,3 +1,9 @@
+import {
+  TileableNoise,
+  hash2,
+  rand01,
+  randSigned
+} from "./chunk-4D6KP5BV.js";
 import {
   BRUSHSTROKE_MAX_SCALE,
   BRUSHSTROKE_MIN_SCALE
@@ -10,11 +16,13 @@ import {
   mixPigment8,
   mixPigmentRgb,
   pigment8,
-  pngDataUrl,
   setPigmentColor,
   srgbDecode,
   srgbEncode
-} from "./chunk-42TWUPNJ.js";
+} from "./chunk-IRSTHLQQ.js";
+import {
+  pngDataUrl
+} from "./chunk-OTTT5N3K.js";
 import {
   TILE,
   TiledSurface,
@@ -26,90 +34,6 @@ import {
   tilesInRect
 } from "./chunk-HVVR5PZW.js";
 
-// src/paint/rand.ts
-function mix32(h) {
-  h ^= h >>> 16;
-  h = Math.imul(h, 2246822507);
-  h ^= h >>> 13;
-  h = Math.imul(h, 3266489909);
-  h ^= h >>> 16;
-  return h >>> 0;
-}
-function hash2(x, y, salt) {
-  const h = mix32((Math.imul(x | 0, 668265261) ^ mix32((y | 0) + Math.imul(salt | 0, 374761393))) >>> 0);
-  return h / 4294967296;
-}
-function rand01(seed, index, stream) {
-  return hash2(index, stream, seed);
-}
-function randSigned(seed, index, stream) {
-  return rand01(seed, index, stream) * 2 - 1;
-}
-function seedFromString(text) {
-  let h = 2166136261;
-  for (let i = 0; i < text.length; i++) {
-    h ^= text.charCodeAt(i);
-    h = Math.imul(h, 16777619);
-  }
-  return mix32(h >>> 0);
-}
-var smooth = (t) => t * t * (3 - 2 * t);
-var Lattice = class {
-  constructor(px, py, salt) {
-    this.px = px;
-    this.py = py;
-    this.values = new Float32Array(px * py);
-    for (let j = 0; j < py; j++) for (let i = 0; i < px; i++) this.values[j * px + i] = hash2(i, j, salt);
-  }
-  px;
-  py;
-  values;
-  /** Value noise at (x, y) in lattice cells; wraps every `px` / `py` cells. */
-  at(x, y) {
-    const { px, py } = this;
-    const x0 = Math.floor(x);
-    const y0 = Math.floor(y);
-    const tx = smooth(x - x0);
-    const ty = smooth(y - y0);
-    const i0 = (x0 % px + px) % px;
-    const j0 = (y0 % py + py) % py;
-    const i1 = (i0 + 1) % px;
-    const j1 = (j0 + 1) % py;
-    const v = this.values;
-    const a = v[j0 * px + i0] + (v[j0 * px + i1] - v[j0 * px + i0]) * tx;
-    const b = v[j1 * px + i0] + (v[j1 * px + i1] - v[j1 * px + i0]) * tx;
-    return a + (b - a) * ty;
-  }
-};
-var TileableNoise = class {
-  constructor(size, cellsX, cellsY, octaves, salt) {
-    this.size = size;
-    let cx = Math.max(1, Math.round(cellsX));
-    let cy = Math.max(1, Math.round(cellsY));
-    for (let o = 0; o < octaves; o++) {
-      this.octaves.push(new Lattice(cx, cy, salt + o * 7919 | 0));
-      cx *= 2;
-      cy *= 2;
-    }
-  }
-  size;
-  octaves = [];
-  /** Fractal noise at pixel (x, y). */
-  at(x, y) {
-    let sum = 0;
-    let amp = 1;
-    let norm = 0;
-    const u = x / this.size;
-    const v = y / this.size;
-    for (const l of this.octaves) {
-      sum += l.at(u * l.px, v * l.py) * amp;
-      norm += amp;
-      amp *= 0.5;
-    }
-    return norm > 0 ? sum / norm : 0.5;
-  }
-};
-
 // src/paint/gradient-paint.ts
 var PAINT_GRADIENT_SPACES = ["pigment", "oklab", "srgb"];
 var PAINT_GRADIENT_REPEATS = ["clamp", "repeat", "mirror"];
@@ -2321,12 +2245,6 @@ function union(a, b) {
 }
 
 export {
-  mix32,
-  hash2,
-  rand01,
-  randSigned,
-  seedFromString,
-  TileableNoise,
   PAINT_GRADIENT_SPACES,
   PAINT_GRADIENT_REPEATS,
   PAINT_GRADIENT_MAPPINGS,