@michaelyagi/kiri 0.1.0-alpha.2

package/dist/kiri.mjs

@@ -0,0 +1,613 @@
+var T = Object.defineProperty;
+var U = (i, t, e) => t in i ? T(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e;
+var p = (i, t, e) => U(i, typeof t != "symbol" ? t + "" : t, e);
+const L = {
+  brightness: 1,
+  contrast: 1,
+  saturation: 1,
+  grayscale: !1,
+  sepia: !1
+};
+function M(i, t) {
+  return {
+    brightness: Math.max(0, t.brightness ?? i.brightness),
+    contrast: Math.max(0, t.contrast ?? i.contrast),
+    saturation: Math.max(0, t.saturation ?? i.saturation),
+    grayscale: t.grayscale ?? i.grayscale,
+    sepia: t.sepia ?? i.sepia
+  };
+}
+function C(i) {
+  const t = [
+    `brightness(${i.brightness})`,
+    `contrast(${i.contrast})`,
+    `saturate(${i.saturation})`
+  ];
+  return i.grayscale && t.push("grayscale(1)"), i.sepia && t.push("sepia(1)"), t.join(" ");
+}
+function $(i, t, e, s, o) {
+  i.innerHTML = "";
+  const n = document.createElement("div");
+  n.className = "kiri-stage";
+  const r = document.createElement("div");
+  r.className = "kiri-image-layer";
+  const c = document.createElement("img");
+  c.draggable = !1, r.appendChild(c);
+  const d = document.createElement("div");
+  d.className = t === "circle" ? "kiri-frame kiri-frame--circle" : "kiri-frame", H(d, e, s), n.appendChild(r), n.appendChild(d);
+  let h = null;
+  if (o.show) {
+    const m = document.createElement("div");
+    m.className = `kiri-root kiri-root--${o.position}`, h = document.createElement("input"), h.type = "range", h.className = "kiri-zoomer", h.min = String(o.min), h.max = String(o.max), h.step = "0.01", h.value = String(o.value), m.appendChild(n), m.appendChild(h), i.appendChild(m);
+  } else
+    i.appendChild(n);
+  return { stageEl: n, frameEl: d, imageLayerEl: r, imgEl: c, zoomerEl: h };
+}
+function H(i, t, e) {
+  i.style.width = `${t}px`, i.style.height = `${e}px`;
+}
+const F = 20;
+function R(i, t, e) {
+  i.style.width = `${t}px`, i.style.height = `${e}px`;
+}
+function N(i, t, e) {
+  const s = e * (t.flip.horizontal ? -1 : 1), o = e * (t.flip.vertical ? -1 : 1);
+  i.style.transform = `translate(-50%, -50%) translate(${t.offset.x}px, ${t.offset.y}px) rotate(${t.rotation}deg) scale(${s}, ${o})`;
+}
+function Z(i, t) {
+  i.style.filter = C(t);
+}
+function D(i, t) {
+  return (t / 90 % 2 + 2) % 2 === 1 ? { width: i.height, height: i.width } : { width: i.width, height: i.height };
+}
+function b(i, t, e) {
+  const s = D(i, e);
+  return s.width <= 0 || s.height <= 0 ? 1 : Math.max(t.width / s.width, t.height / s.height);
+}
+function z(i, t, e, s) {
+  const o = D(i, e), n = b(i, t, e) * s;
+  return { width: o.width * n, height: o.height * n };
+}
+function E(i, t, e) {
+  return Math.min(Math.max(i, t), e);
+}
+function w(i, t, e) {
+  const s = Math.max(0, (t.width - e.width) / 2), o = Math.max(0, (t.height - e.height) / 2);
+  return {
+    x: Math.min(Math.max(i.x, -s), s) || 0,
+    y: Math.min(Math.max(i.y, -o), o) || 0
+  };
+}
+function S(i) {
+  return (i % 360 + 360) % 360;
+}
+function I(i, t) {
+  return Math.hypot(i.clientX - t.clientX, i.clientY - t.clientY);
+}
+function _(i, t, e) {
+  const s = /* @__PURE__ */ new Map();
+  let o = null, n = 0, r = 1;
+  function c(a) {
+    const { min: l, max: f } = t.getMinMaxZoom(), g = E(a.zoom, l, f), v = z(
+      t.getNaturalSize(),
+      t.getFrameSize(),
+      a.rotation,
+      g
+    ), x = w(a.offset, v, t.getFrameSize());
+    t.setState({
+      zoom: g,
+      offset: x,
+      rotation: S(a.rotation),
+      flip: a.flip,
+      filters: a.filters
+    });
+  }
+  function d(a) {
+    if (i.setPointerCapture(a.pointerId), s.set(a.pointerId, a), s.size === 1) {
+      const l = t.getState();
+      o = { x: a.clientX, y: a.clientY, offset: l.offset }, i.classList.add("kiri-dragging");
+    } else if (s.size === 2) {
+      o = null;
+      const [l, f] = [...s.values()];
+      n = I(l, f), r = t.getState().zoom;
+    }
+  }
+  function h(a) {
+    if (s.has(a.pointerId)) {
+      if (s.set(a.pointerId, a), s.size === 2) {
+        const [l, f] = [...s.values()], g = I(l, f);
+        if (n > 0) {
+          const v = g / n, x = t.getState();
+          c({ ...x, zoom: r * v });
+        }
+        return;
+      }
+      if (o) {
+        const l = a.clientX - o.x, f = a.clientY - o.y, g = t.getState();
+        c({
+          ...g,
+          offset: { x: o.offset.x + l, y: o.offset.y + f }
+        });
+      }
+    }
+  }
+  function m(a) {
+    s.delete(a.pointerId), s.size < 2 && (n = 0), s.size === 0 && (o = null, i.classList.remove("kiri-dragging"));
+  }
+  function u(a) {
+    if (!e.mouseWheelZoom || e.mouseWheelZoom === "ctrl" && !a.ctrlKey) return;
+    a.preventDefault();
+    const l = t.getState(), f = -a.deltaY * 15e-4;
+    c({ ...l, zoom: l.zoom * (1 + f) });
+  }
+  return i.addEventListener("pointerdown", d), i.addEventListener("pointermove", h), i.addEventListener("pointerup", m), i.addEventListener("pointercancel", m), i.addEventListener("wheel", u, { passive: !1 }), {
+    destroy() {
+      i.removeEventListener("pointerdown", d), i.removeEventListener("pointermove", h), i.removeEventListener("pointerup", m), i.removeEventListener("pointercancel", m), i.removeEventListener("wheel", u);
+    }
+  };
+}
+function A(i) {
+  const t = new DataView(i);
+  if (t.byteLength < 4 || t.getUint16(0, !1) !== 65496) return 1;
+  let e = 2;
+  for (; e + 4 <= t.byteLength; ) {
+    const s = t.getUint16(e, !1), o = t.getUint16(e + 2, !1);
+    if (s === 65505) {
+      const n = e + 4;
+      return t.getUint32(n, !1) !== 1165519206 ? 1 : K(t, n + 6);
+    }
+    if ((s & 65280) !== 65280) break;
+    e += 2 + o;
+  }
+  return 1;
+}
+function K(i, t) {
+  const e = i.getUint16(t, !1) === 18761, s = i.getUint32(t + 4, e), o = t + s;
+  if (o + 2 > i.byteLength) return 1;
+  const n = i.getUint16(o, e);
+  for (let r = 0; r < n; r++) {
+    const c = o + 2 + r * 12;
+    if (c + 12 > i.byteLength) break;
+    if (i.getUint16(c, e) === 274) {
+      const h = i.getUint16(c + 8, e);
+      return h >= 1 && h <= 8 ? h : 1;
+    }
+  }
+  return 1;
+}
+function j(i) {
+  switch (i) {
+    case 2:
+      return { rotation: 0, flipHorizontal: !0 };
+    case 3:
+      return { rotation: 180, flipHorizontal: !1 };
+    case 4:
+      return { rotation: 180, flipHorizontal: !0 };
+    case 5:
+      return { rotation: 90, flipHorizontal: !0 };
+    case 6:
+      return { rotation: 90, flipHorizontal: !1 };
+    case 7:
+      return { rotation: 270, flipHorizontal: !0 };
+    case 8:
+      return { rotation: 270, flipHorizontal: !1 };
+    default:
+      return { rotation: 0, flipHorizontal: !1 };
+  }
+}
+function y(i, t, e, s) {
+  return i === void 0 ? e : t.includes(i) ? i : (console.warn(
+    `Kiri: invalid ${s} "${i}" — defaulting to "${e}". Valid values: ${t.join(", ")}.`
+  ), e);
+}
+const X = ["base64", "blob", "canvas"], Y = ["image/jpeg", "image/png", "image/webp"];
+function V(i, t, e) {
+  return {
+    left: i.width / 2 - t.x - e.width / 2,
+    top: i.height / 2 - t.y - e.height / 2
+  };
+}
+function W(i, t, e, s, o, n) {
+  const r = { width: i.naturalWidth, height: i.naturalHeight }, c = b(r, e, t.rotation) * t.zoom, d = z(r, e, t.rotation, t.zoom), h = document.createElement("canvas");
+  h.width = Math.max(1, Math.round(d.width)), h.height = Math.max(1, Math.round(d.height));
+  const m = h.getContext("2d");
+  if (!m) throw new Error("Kiri: unable to get 2D canvas context");
+  m.translate(h.width / 2, h.height / 2), m.rotate(t.rotation * Math.PI / 180), m.scale(c * (t.flip.horizontal ? -1 : 1), c * (t.flip.vertical ? -1 : 1)), m.filter = C(t.filters), m.drawImage(i, -r.width / 2, -r.height / 2, r.width, r.height);
+  const { left: u, top: a } = V(
+    d,
+    t.offset,
+    e
+  ), l = document.createElement("canvas");
+  l.width = s, l.height = o;
+  const f = l.getContext("2d");
+  if (!f) throw new Error("Kiri: unable to get 2D canvas context");
+  return n === "circle" && (f.save(), f.beginPath(), f.ellipse(
+    s / 2,
+    o / 2,
+    s / 2,
+    o / 2,
+    0,
+    0,
+    Math.PI * 2
+  ), f.clip()), f.drawImage(
+    h,
+    u,
+    a,
+    e.width,
+    e.height,
+    0,
+    0,
+    s,
+    o
+  ), n === "circle" && f.restore(), l;
+}
+async function k(i, t, e, s, o) {
+  const n = y(o.type, X, "base64", "export type"), r = y(o.format, Y, "image/png", "export format"), c = o.quality, d = o.width ?? e.width, h = o.height ?? e.height;
+  s === "circle" && r === "image/jpeg" && console.warn(
+    "Kiri: exporting a circle-shaped frame as image/jpeg — JPEG has no alpha channel, so the area outside the circle will render as solid black instead of transparent. Use image/png or image/webp instead."
+  );
+  const m = W(i, t, e, d, h, s);
+  return n === "canvas" ? m : n === "base64" ? m.toDataURL(r, c) : new Promise((u, a) => {
+    m.toBlob(
+      (l) => l ? u(l) : a(new Error("Kiri: canvas.toBlob failed")),
+      r,
+      c
+    );
+  });
+}
+async function B(i, t) {
+  const e = t.fieldName ?? "file", s = t.fileName ?? `crop.${G(t.format ?? "image/png")}`, o = new FormData();
+  o.append(e, i, s);
+  for (const [n, r] of Object.entries(t.extraFields ?? {}))
+    o.append(n, r);
+  return fetch(t.url, {
+    ...t.fetchOptions,
+    method: "POST",
+    body: o
+  });
+}
+function G(i) {
+  switch (i) {
+    case "image/jpeg":
+      return "jpg";
+    case "image/webp":
+      return "webp";
+    default:
+      return "png";
+  }
+}
+const P = 200, O = 20, q = ["rectangle", "circle"], J = ["top", "bottom", "left", "right"];
+function Q(i) {
+  return i === void 0 ? !0 : typeof i == "boolean" || i === "ctrl" ? i : (console.warn(
+    `Kiri: invalid mouseWheelZoom "${String(i)}" — defaulting to true. Valid values: true, false, "ctrl".`
+  ), !0);
+}
+class tt {
+  /**
+   * @param container An element already present in the DOM. Passing
+   * `null`/`undefined`, or an element that isn't in the DOM yet, throws.
+   * @param options See the {@link KiriOptions} fields for defaults.
+   */
+  constructor(t, e = {}) {
+    p(this, "container");
+    p(this, "opts");
+    p(this, "stage");
+    p(this, "gestureHandle");
+    p(this, "resizeHandle", null);
+    p(this, "zoomerHandle", null);
+    p(this, "naturalSize", { width: 0, height: 0 });
+    p(this, "state", {
+      zoom: 1,
+      offset: { x: 0, y: 0 },
+      rotation: 0,
+      flip: { horizontal: !1, vertical: !1 },
+      filters: L
+    });
+    p(this, "listeners", { change: [] });
+    var s, o, n;
+    if (!t || typeof t.appendChild != "function")
+      throw new Error(
+        "Kiri: container element is null/undefined or not a DOM element. This usually means the element wasn't in the DOM yet when `new Kiri(...)` ran — e.g. document.getElementById() was called before the element existed. Place the <script> after the element, or construct inside a DOMContentLoaded listener."
+      );
+    this.container = t, this.opts = {
+      frame: {
+        shape: y(
+          (s = e.frame) == null ? void 0 : s.shape,
+          q,
+          "rectangle",
+          "frame.shape"
+        ),
+        width: ((o = e.frame) == null ? void 0 : o.width) ?? P,
+        height: ((n = e.frame) == null ? void 0 : n.height) ?? P
+      },
+      minZoom: e.minZoom ?? 1,
+      maxZoom: e.maxZoom ?? 4,
+      rotatable: e.rotatable ?? !0,
+      flippable: e.flippable ?? !0,
+      resizableFrame: e.resizableFrame ?? !1,
+      mouseWheelZoom: Q(e.mouseWheelZoom),
+      useExifOrientation: e.useExifOrientation ?? !0,
+      uploader: e.uploader,
+      autoSizeStage: e.autoSizeStage ?? !0,
+      showZoomer: e.showZoomer ?? !1,
+      zoomerPosition: y(
+        e.zoomerPosition,
+        J,
+        "bottom",
+        "zoomerPosition"
+      )
+    }, this.state.filters = M(L, e.filters ?? {}), this.stage = $(
+      this.container,
+      this.opts.frame.shape,
+      this.opts.frame.width,
+      this.opts.frame.height,
+      {
+        show: this.opts.showZoomer,
+        position: this.opts.zoomerPosition,
+        min: this.opts.minZoom,
+        max: this.opts.maxZoom,
+        value: this.state.zoom
+      }
+    ), this.opts.autoSizeStage && this.syncStageSize(), Z(this.stage.imgEl, this.state.filters), this.stage.zoomerEl && this.enableZoomer(this.stage.zoomerEl), this.gestureHandle = _(
+      this.stage.stageEl,
+      {
+        getNaturalSize: () => this.naturalSize,
+        getFrameSize: () => this.getFrameSize(),
+        getState: () => this.state,
+        getMinMaxZoom: () => ({ min: this.opts.minZoom, max: this.opts.maxZoom }),
+        setState: (r) => this.commitState(r)
+      },
+      { mouseWheelZoom: this.opts.mouseWheelZoom }
+    ), this.opts.resizableFrame && this.enableFrameResize();
+  }
+  /**
+   * Loads an image, replacing whatever was loaded before. EXIF orientation
+   * (rotation + horizontal flip) is corrected automatically unless
+   * `useExifOrientation: false` was passed to the constructor — only for
+   * `File`/`Blob` sources, since a plain URL string can't be read for EXIF
+   * data without an extra fetch.
+   * @param source A `File` (e.g. from a file input), a `Blob`, or a URL string.
+   * @param loadOptions Initial `zoom`/`offset`/`rotation`/`flip`.
+   */
+  async load(t, e = {}) {
+    var u, a;
+    let s = S(e.rotation ?? 0), o = ((u = e.flip) == null ? void 0 : u.horizontal) ?? !1;
+    const n = ((a = e.flip) == null ? void 0 : a.vertical) ?? !1;
+    let r = null, c;
+    if (typeof t == "string")
+      c = t;
+    else {
+      if (this.opts.useExifOrientation) {
+        const l = await t.arrayBuffer(), f = A(l), g = j(f);
+        s = S(s + g.rotation), o = o !== g.flipHorizontal;
+      }
+      r = URL.createObjectURL(t), c = r;
+    }
+    await new Promise((l, f) => {
+      this.stage.imgEl.onload = () => l(), this.stage.imgEl.onerror = () => f(new Error("Kiri: failed to load image")), this.stage.imgEl.src = c;
+    }), r && URL.revokeObjectURL(r), this.naturalSize = {
+      width: this.stage.imgEl.naturalWidth,
+      height: this.stage.imgEl.naturalHeight
+    };
+    const d = E(
+      e.zoom ?? this.opts.minZoom,
+      this.opts.minZoom,
+      this.opts.maxZoom
+    ), h = z(this.naturalSize, this.getFrameSize(), s, d), m = w(e.offset ?? { x: 0, y: 0 }, h, this.getFrameSize());
+    this.commitState({
+      zoom: d,
+      offset: m,
+      rotation: s,
+      flip: { horizontal: o, vertical: n },
+      filters: this.state.filters
+    });
+  }
+  /** A snapshot of the current state — mutating the returned object has no effect. */
+  getState() {
+    return {
+      zoom: this.state.zoom,
+      offset: { ...this.state.offset },
+      rotation: this.state.rotation,
+      flip: { ...this.state.flip },
+      filters: { ...this.state.filters }
+    };
+  }
+  /** Sets the zoom to an absolute value, clamped to `[minZoom, maxZoom]`. */
+  setZoom(t) {
+    const e = E(t, this.opts.minZoom, this.opts.maxZoom), s = z(
+      this.naturalSize,
+      this.getFrameSize(),
+      this.state.rotation,
+      e
+    ), o = w(this.state.offset, s, this.getFrameSize());
+    this.commitState({ ...this.state, zoom: e, offset: o });
+  }
+  /**
+   * Rotates relative to the current rotation, snapped to the nearest 90°.
+   * No-op if `rotatable: false` was passed to the constructor.
+   */
+  rotate(t) {
+    if (!this.opts.rotatable) return;
+    const e = Math.round(t / 90) * 90, s = S(this.state.rotation + e), o = z(
+      this.naturalSize,
+      this.getFrameSize(),
+      s,
+      this.state.zoom
+    ), n = w(this.state.offset, o, this.getFrameSize());
+    this.commitState({ ...this.state, rotation: s, offset: n });
+  }
+  /** Toggles horizontal flip, independent of rotation. No-op if `flippable: false`. */
+  flipHorizontal() {
+    if (!this.opts.flippable) return;
+    const t = { ...this.state.flip, horizontal: !this.state.flip.horizontal };
+    this.commitState({ ...this.state, flip: t });
+  }
+  /** Toggles vertical flip, independent of rotation. No-op if `flippable: false`. */
+  flipVertical() {
+    if (!this.opts.flippable) return;
+    const t = { ...this.state.flip, vertical: !this.state.flip.vertical };
+    this.commitState({ ...this.state, flip: t });
+  }
+  /**
+   * Resizes the frame. Also resizes the stage to match, if
+   * `autoSizeStage: true` (the default). Each axis is clamped to a 20px
+   * minimum.
+   */
+  setFrameSize(t, e) {
+    this.opts.frame.width = Math.max(O, t), this.opts.frame.height = Math.max(O, e), H(this.stage.frameEl, this.opts.frame.width, this.opts.frame.height), this.opts.autoSizeStage && this.syncStageSize();
+    const s = z(
+      this.naturalSize,
+      this.getFrameSize(),
+      this.state.rotation,
+      this.state.zoom
+    ), o = w(this.state.offset, s, this.getFrameSize());
+    this.commitState({ ...this.state, offset: o });
+  }
+  /**
+   * Merges a partial update into the current filters (omitted fields are
+   * left as they are). Numeric values are clamped to `>= 0`.
+   */
+  setFilters(t) {
+    this.commitState({ ...this.state, filters: M(this.state.filters, t) });
+  }
+  /**
+   * Renders the current crop. A circle frame is a real clip in the output
+   * (transparent corners on PNG/WebP); a circle exported as JPEG warns and
+   * renders solid black corners instead, since JPEG has no alpha channel.
+   * @returns A data URL string (`type: "base64"`, the default), a `Blob`, or an `HTMLCanvasElement`.
+   */
+  async export(t = {}) {
+    return k(
+      this.stage.imgEl,
+      this.state,
+      this.getFrameSize(),
+      this.opts.frame.shape,
+      t
+    );
+  }
+  /**
+   * Exports the current crop as a blob, then uploads it — a default
+   * FormData/`fetch` POST, or a custom `uploader` (per-call `options.uploader`
+   * wins over the constructor's, which wins over the built-in default).
+   */
+  async upload(t, e = {}) {
+    const s = await this.export({ ...e, type: "blob" });
+    return (e.uploader ?? this.opts.uploader ?? B)(s, { ...e, url: t });
+  }
+  /** Subscribes to `"change"` — fires on every state update (drag/zoom/rotate/flip/filters), and once after `load()` resolves. */
+  on(t, e) {
+    this.listeners[t].push(e);
+  }
+  /** Unsubscribes a callback previously passed to {@link on}. */
+  off(t, e) {
+    this.listeners[t] = this.listeners[t].filter((s) => s !== e);
+  }
+  /**
+   * Tears the instance down: removes all pointer/wheel event listeners
+   * (drag/zoom gestures), the resize-handle listener (if `resizableFrame`),
+   * and the zoom-slider listener (if `showZoomer`); clears the container's
+   * `innerHTML`, leaving an empty container element; and clears all
+   * `"change"` listeners. Call this when you're done with an instance (e.g.
+   * unmounting) to avoid leaking listeners.
+   */
+  destroy() {
+    var t, e;
+    this.gestureHandle.destroy(), (t = this.resizeHandle) == null || t.destroy(), (e = this.zoomerHandle) == null || e.destroy(), this.container.innerHTML = "", this.listeners.change = [];
+  }
+  getFrameSize() {
+    return { width: this.opts.frame.width, height: this.opts.frame.height };
+  }
+  syncStageSize() {
+    R(
+      this.stage.stageEl,
+      this.opts.frame.width + F * 2,
+      this.opts.frame.height + F * 2
+    );
+  }
+  commitState(t) {
+    this.state = t;
+    const e = b(this.naturalSize, this.getFrameSize(), t.rotation) * t.zoom;
+    N(this.stage.imageLayerEl, t, e), Z(this.stage.imgEl, t.filters), this.stage.zoomerEl && (this.stage.zoomerEl.value = String(t.zoom));
+    for (const s of this.listeners.change) s(this.getState());
+  }
+  enableZoomer(t) {
+    const e = () => this.setZoom(Number(t.value));
+    t.addEventListener("input", e), this.zoomerHandle = {
+      destroy() {
+        t.removeEventListener("input", e);
+      }
+    };
+  }
+  enableFrameResize() {
+    const t = document.createElement("div");
+    t.className = "kiri-frame-handle", t.style.right = "-5px", t.style.bottom = "-5px", this.stage.frameEl.appendChild(t);
+    let e = null;
+    const s = (r) => {
+      r.stopPropagation(), t.setPointerCapture(r.pointerId), e = {
+        x: r.clientX,
+        y: r.clientY,
+        width: this.opts.frame.width,
+        height: this.opts.frame.height
+      };
+    }, o = (r) => {
+      if (!e) return;
+      const c = (r.clientX - e.x) * 2, d = (r.clientY - e.y) * 2;
+      this.setFrameSize(e.width + c, e.height + d);
+    }, n = () => {
+      e = null;
+    };
+    t.addEventListener("pointerdown", s), t.addEventListener("pointermove", o), t.addEventListener("pointerup", n), t.addEventListener("pointercancel", n), this.resizeHandle = {
+      destroy() {
+        t.removeEventListener("pointerdown", s), t.removeEventListener("pointermove", o), t.removeEventListener("pointerup", n), t.removeEventListener("pointercancel", n), t.remove();
+      }
+    };
+  }
+}
+class it {
+  /** @param items An initial queue; more can be added later via `add()`. */
+  constructor(t, e = {}, s = []) {
+    /** The shared `Kiri` instance. Use its normal methods (drag/zoom/rotate/filters/etc.) to adjust the currently-loaded item. */
+    p(this, "cropper");
+    p(this, "items");
+    p(this, "index", -1);
+    p(this, "captures", []);
+    this.cropper = new tt(t, e), this.items = [...s];
+  }
+  /** Appends an item to the queue. */
+  add(t) {
+    this.items.push(t);
+  }
+  /** Total number of queued items. */
+  get length() {
+    return this.items.length;
+  }
+  /** Loads the next queued image into `cropper`. Returns false once the queue is exhausted. */
+  async next() {
+    if (this.index + 1 >= this.items.length) return !1;
+    this.index += 1;
+    const t = this.items[this.index];
+    return await this.cropper.load(t.source, t.loadOptions), !0;
+  }
+  /** Metadata for the currently loaded item, or null before the first next() / after exhaustion. */
+  current() {
+    return this.items[this.index] ?? null;
+  }
+  /** Exports the current crop and stores it, indexed by item order. */
+  async capture(t) {
+    const e = await this.cropper.export(t);
+    return this.captures[this.index] = e, e;
+  }
+  /** All captures made so far, in item order (sparse where an item hasn't been captured yet). */
+  results() {
+    return [...this.captures];
+  }
+  /** Tears down the shared `Kiri` instance. */
+  destroy() {
+    this.cropper.destroy();
+  }
+}
+export {
+  tt as Kiri,
+  it as KiriBatch
+};
+//# sourceMappingURL=kiri.mjs.map