@techzyapp/ui-library 1.0.42 → 1.0.44

package/dist/ImageEditor-DTFQZ6ON.js

@@ -0,0 +1,2709 @@
+import { jsxs as B, jsx as w, Fragment as he } from "react/jsx-runtime";
+import { forwardRef as Ke, useRef as O, useState as Q, useEffect as q, useLayoutEffect as ue, useMemo as mn, useImperativeHandle as fn, useSyncExternalStore as pn, useCallback as gn } from "react";
+import { clsx as K } from "clsx";
+import { B as Me } from "./Button-5LQtDA9d.js";
+import { b as et } from "./Icon-B7DJn8Tw.js";
+import { I as Et } from "./IconButton-EaExCXRq.js";
+import { L as _n } from "./Loader-D_Foo6Hj.js";
+import { O as bn } from "./Overlay-DiL0ZARH.js";
+import { g as wn, a as re } from "./ConfigProvider-CYgmMH4j.js";
+import { D as vn } from "./Dropdown-D-D_Z1Jo.js";
+import { L as Ue } from "./ListItem-Ezmdk7q-.js";
+const Se = [
+  1,
+  0,
+  0,
+  0,
+  0,
+  0,
+  1,
+  0,
+  0,
+  0,
+  0,
+  0,
+  1,
+  0,
+  0,
+  0,
+  0,
+  0,
+  1,
+  0
+], de = 0.2126, me = 0.7152, fe = 0.0722;
+function xn(t, e) {
+  const n = new Array(20);
+  for (let i = 0; i < 4; i++)
+    for (let o = 0; o < 5; o++) {
+      let r = 0;
+      for (let a = 0; a < 4; a++) r += t[i * 5 + a] * e[a * 5 + o];
+      o === 4 && (r += t[i * 5 + 4]), n[i * 5 + o] = r;
+    }
+  return n;
+}
+function ot(...t) {
+  return t.reduce((e, n) => xn(n, e), Se);
+}
+function Mn(t) {
+  return !t || t.every((e, n) => Math.abs(e - Se[n]) < 1e-6);
+}
+const He = (t) => [
+  1,
+  0,
+  0,
+  0,
+  t,
+  0,
+  1,
+  0,
+  0,
+  t,
+  0,
+  0,
+  1,
+  0,
+  t,
+  0,
+  0,
+  0,
+  1,
+  0
+], vt = (t) => {
+  const e = 0.5 * (1 - t);
+  return [t, 0, 0, 0, e, 0, t, 0, 0, e, 0, 0, t, 0, e, 0, 0, 0, 1, 0];
+}, St = (t) => {
+  const e = 1 - t;
+  return [
+    de * e + t,
+    me * e,
+    fe * e,
+    0,
+    0,
+    de * e,
+    me * e + t,
+    fe * e,
+    0,
+    0,
+    de * e,
+    me * e,
+    fe * e + t,
+    0,
+    0,
+    0,
+    0,
+    0,
+    1,
+    0
+  ];
+}, Ct = (t, e, n, i = 0, o = 0, r = 0) => [
+  t,
+  0,
+  0,
+  0,
+  i,
+  0,
+  e,
+  0,
+  0,
+  o,
+  0,
+  0,
+  n,
+  0,
+  r,
+  0,
+  0,
+  0,
+  1,
+  0
+], pe = (t, e) => {
+  const n = e - t;
+  return [n, 0, 0, 0, t, 0, n, 0, 0, t, 0, 0, n, 0, t, 0, 0, 0, 1, 0];
+}, Fe = [
+  0.393,
+  0.769,
+  0.189,
+  0,
+  0,
+  0.349,
+  0.686,
+  0.168,
+  0,
+  0,
+  0.272,
+  0.534,
+  0.131,
+  0,
+  0,
+  0,
+  0,
+  0,
+  1,
+  0
+], ye = [
+  ["default"],
+  ["chrome", "fade", "cold", "warm", "pastel"],
+  ["mono", "noir", "stark", "wash"],
+  ["sepia", "rust", "blues", "color"]
+], Ut = St(0), Ce = {
+  default: null,
+  // more contrast + saturation
+  chrome: ot(St(1.3), vt(1.15)),
+  // lifted blacks, softer whites, desaturated
+  fade: ot(St(0.7), pe(0.12, 0.92)),
+  // a blue shift
+  cold: ot(Ct(0.9, 0.98, 1.12, 0, 0.01, 0.03), vt(1.04)),
+  // a red / yellow shift
+  warm: ot(Ct(1.1, 1.03, 0.86, 0.03, 0.01, 0), vt(1.04)),
+  // brightened + desaturated
+  pastel: ot(St(0.6), pe(0.16, 1)),
+  // luminance grayscale
+  mono: Ut,
+  // high-contrast grayscale
+  noir: ot(Ut, vt(1.45), He(-0.04)),
+  // very high-contrast grayscale
+  stark: ot(Ut, vt(2.1)),
+  // low-contrast, bright grayscale
+  wash: ot(Ut, pe(0.22, 0.98)),
+  sepia: Fe,
+  // a warm, strong sepia
+  rust: ot(Fe, Ct(1.12, 0.9, 0.7), vt(1.12)),
+  // blue-tinted monochrome
+  blues: ot(Ut, Ct(0.72, 0.88, 1.08, 0, 0.02, 0.08)),
+  // boosted, vivid color
+  color: ot(St(1.65), vt(1.06))
+}, yn = [
+  "brightness",
+  "contrast",
+  "saturation",
+  "exposure",
+  "temperature",
+  "gamma",
+  "clarity",
+  "vignette"
+], Qe = {
+  brightness: 0,
+  contrast: 0,
+  saturation: 0,
+  exposure: 0,
+  temperature: 0,
+  gamma: 0,
+  clarity: 0,
+  vignette: 0
+}, ut = {
+  /** additive: −0.25…+0.25 */
+  brightness: (t) => t / 100 * 0.25,
+  /** multiply around the midpoint: 0.5…1.5 */
+  contrast: (t) => 1 + t / 100 * 0.5,
+  /** 0 (grayscale)…2 */
+  saturation: (t) => 1 + t / 100,
+  /** multiply: 0.5…1.5 */
+  exposure: (t) => 1 + t / 100 * 0.5,
+  /** −1…1, shifts R and B in opposite directions */
+  temperature: (t) => t / 100,
+  /** exponent 0.5…1.5 (applied as x^(1/γ), so positive brightens the midtones) */
+  gamma: (t) => 1 + t / 100 * 0.5,
+  /** −1…1 local-contrast amount (negative softens) */
+  clarity: (t) => t / 100,
+  /** −1…1 (positive darkens the edges, negative lightens them) */
+  vignette: (t) => t / 100
+};
+function En(t) {
+  const e = ut.temperature(t.temperature);
+  return ot(
+    Ct(
+      ut.exposure(t.exposure),
+      ut.exposure(t.exposure),
+      ut.exposure(t.exposure)
+    ),
+    He(ut.brightness(t.brightness)),
+    vt(ut.contrast(t.contrast)),
+    St(ut.saturation(t.saturation)),
+    Ct(1 + 0.12 * e, 1 + 0.02 * e, 1 - 0.12 * e)
+  );
+}
+function Tn(t, e) {
+  return ot(t ?? Se, En(e));
+}
+const ee = Math.PI / 2, Ze = 1e-6, ie = ([t, e], n) => {
+  const i = Math.cos(n), o = Math.sin(n);
+  return [t * i - e * o, t * o + e * i];
+};
+function Je(t, e, n) {
+  const i = Math.abs(Math.cos(n)), o = Math.abs(Math.sin(n));
+  return [t / 2 * i + e / 2 * o, t / 2 * o + e / 2 * i];
+}
+const Vt = (t) => [
+  t.x + t.width / 2,
+  t.y + t.height / 2
+];
+function oe(t, e, n, i) {
+  const [o, r] = Je(t, e, n);
+  return Math.max(2 * o / i.width, 2 * r / i.height);
+}
+function $t(t, e) {
+  const [n, i] = Vt(t.crop), [o, r] = ie([n - e.width / 2, i - e.height / 2], -t.rotation);
+  return [o / t.scale, r / t.scale];
+}
+function Gt([t, e], n, i, o, r, a) {
+  const [s, _] = Je(n, i, o), c = Math.max(0, a.width / 2 - s / r), M = Math.max(0, a.height / 2 - _ / r);
+  return [Math.min(c, Math.max(-c, t)), Math.min(M, Math.max(-M, e))];
+}
+function jt(t, e, n, i, o, r) {
+  const [a, s] = ie([t[0] * o, t[1] * o], i), _ = r.width / 2 + a, c = r.height / 2 + s;
+  return { x: _ - e / 2, y: c - n / 2, width: e, height: n };
+}
+function In(t, e, n, i) {
+  const o = [
+    [t.x, t.y],
+    [t.x + t.width, t.y],
+    [t.x, t.y + t.height],
+    [t.x + t.width, t.y + t.height]
+  ], r = 1e-6 * Math.max(i.width, i.height);
+  return o.every(([a, s]) => {
+    const [_, c] = ie([a - i.width / 2, s - i.height / 2], -e);
+    return Math.abs(_ / n) <= i.width / 2 + r / n && Math.abs(c / n) <= i.height / 2 + r / n;
+  });
+}
+function An(t, e) {
+  const { width: n, height: i } = t.crop, o = Math.max(t.scale, oe(n, i, t.rotation, e)), r = Gt($t({ ...t, scale: o }, e), n, i, t.rotation, o, e);
+  return { ...t, scale: o, crop: jt(r, n, i, t.rotation, o, e) };
+}
+function kt(t) {
+  return {
+    width: Math.max(1, Math.round(t.crop.width / t.scale)),
+    height: Math.max(1, Math.round(t.crop.height / t.scale))
+  };
+}
+function Rt(t) {
+  const e = kt(t);
+  return t.resize ? {
+    width: Math.max(1, Math.min(e.width, Math.round(t.resize.width))),
+    height: Math.max(1, Math.min(e.height, Math.round(t.resize.height)))
+  } : e;
+}
+function Xt(t) {
+  const { crop: e } = t, n = t.resize;
+  if (!n) return e;
+  const i = n.width / n.height, o = e.width / e.height;
+  if (Math.abs(o - i) < 1e-9 * Math.max(o, i)) return e;
+  if (o > i) {
+    const a = e.height * i;
+    return { ...e, x: e.x + (e.width - a) / 2, width: a };
+  }
+  const r = e.width / i;
+  return { ...e, y: e.y + (e.height - r) / 2, height: r };
+}
+function Sn(t, e) {
+  if (!e) return { ...t, resize: null };
+  const n = kt(t), i = Math.max(1, Math.min(n.width, Math.round(e.width))), o = Math.max(1, Math.min(n.height, Math.round(e.height))), r = Math.round(i * n.height / n.width) === o || Math.round(o * n.width / n.height) === i;
+  let a = t;
+  if (!r) {
+    const c = Xt({ ...t, resize: { width: i, height: o } });
+    a = { ...t, crop: c, cropRatio: null };
+  }
+  const s = kt(a), _ = i >= s.width && o >= s.height ? null : { width: Math.min(i, s.width), height: Math.min(o, s.height) };
+  return { ...a, resize: _ };
+}
+function Cn(t, e) {
+  const n = e.resize;
+  if (!n) return n;
+  const i = kt(t), o = kt(e);
+  if (i.width === o.width && i.height === o.height) return n;
+  const r = Math.max(
+    1,
+    Math.min(o.width, Math.round(n.width * o.width / i.width))
+  ), a = Math.max(
+    1,
+    Math.min(o.height, Math.round(n.height * o.height / i.height))
+  );
+  return r === o.width && a === o.height ? null : { width: r, height: a };
+}
+function Rn(t, e) {
+  let n = t.width, i = t.height;
+  return e && e > 0 && (n / i > e ? n = i * e : i = n / e), { x: (t.width - n) / 2, y: (t.height - i) / 2, width: n, height: i };
+}
+function Ln(t, e) {
+  return {
+    crop: Rn(t, e),
+    cropRatio: e && e > 0 ? e : null,
+    resize: null,
+    rotation: 0,
+    flipX: !1,
+    flipY: !1,
+    scale: 1,
+    filter: null,
+    colorMatrix: null,
+    finetune: { ...Qe },
+    redact: { effect: "blur", amount: 0 }
+  };
+}
+function ge(t, e) {
+  const n = (Math.round(t / ee) % 4 + 4) % 4, i = e ?? n * ee;
+  let o = t - i;
+  return o = Math.atan2(Math.sin(o), Math.cos(o)), { quarter: Ee(i), fine: o };
+}
+const Ee = (t) => {
+  const e = t % (2 * Math.PI), n = e < 0 ? e + 2 * Math.PI : e;
+  return Math.abs(n - 2 * Math.PI) < Ze ? 0 : n;
+};
+function Oe(t, e, n) {
+  const { width: i, height: o } = t.crop, r = $t(t, n), a = Math.max(t.scale, oe(i, o, e, n)), s = Gt(r, i, o, e, a, n);
+  return { ...t, rotation: e, scale: a, crop: jt(s, i, o, e, a, n) };
+}
+function kn(t, e) {
+  const [n, i] = Vt(t.crop), o = e.width / 2, r = e.height / 2, [a, s] = ie([n - o, i - r], -ee), _ = t.crop.height, c = t.crop.width;
+  return {
+    ...t,
+    rotation: t.rotation - ee,
+    crop: { x: o + a - _ / 2, y: r + s - c / 2, width: _, height: c },
+    cropRatio: t.cropRatio ? 1 / t.cropRatio : t.cropRatio
+  };
+}
+function Nn(t, e) {
+  return {
+    ...t,
+    rotation: -t.rotation,
+    flipX: !t.flipX,
+    crop: { ...t.crop, x: e.width - t.crop.x - t.crop.width }
+  };
+}
+function Jt(t, e) {
+  return t.scale / oe(t.crop.width, t.crop.height, t.rotation, e);
+}
+const Bt = 5;
+function Yt(t, e, n) {
+  const { width: i, height: o } = t.crop, r = $t(t, n), a = oe(i, o, t.rotation, n) * Math.min(Bt, Math.max(1, e)), s = Gt(r, i, o, t.rotation, a, n);
+  return { ...t, scale: a, crop: jt(s, i, o, t.rotation, a, n) };
+}
+function Pn(t, e, n, i) {
+  const { width: o, height: r } = t.crop, a = { ...t, crop: { ...t.crop, x: t.crop.x + e, y: t.crop.y + n } }, s = Gt($t(a, i), o, r, t.rotation, t.scale, i);
+  return { ...t, crop: jt(s, o, r, t.rotation, t.scale, i) };
+}
+function zn(t, e, n) {
+  if (!e || e <= 0) return { ...t, cropRatio: null };
+  const i = Math.abs(Math.cos(t.rotation)), o = Math.abs(Math.sin(t.rotation)), r = Math.min(
+    n.width * t.scale / (e * i + o),
+    n.height * t.scale / (e * o + i)
+  ), a = r * e, s = Gt($t(t, n), a, r, t.rotation, t.scale, n);
+  return {
+    ...t,
+    cropRatio: e,
+    crop: jt(s, a, r, t.rotation, t.scale, n)
+  };
+}
+function Dn(t, e, n, i, o, { aspectRatio: r, minSize: a }) {
+  const s = t.crop;
+  let _ = s.x, c = s.y, M = s.x + s.width, d = s.y + s.height;
+  const T = e.includes("n"), f = e.includes("s"), A = e.includes("w"), S = e.includes("e");
+  if (T && (c = Math.min(c + i, d - a)), f && (d = Math.max(d + i, c + a)), A && (_ = Math.min(_ + n, M - a)), S && (M = Math.max(M + n, _ + a)), r && r > 0) {
+    let v = M - _, N = d - c;
+    if ((T || f) && (A || S))
+      v / N > r ? N = v / r : v = N * r, A ? _ = M - v : M = _ + v, T ? c = d - N : d = c + N;
+    else if (T || f) {
+      v = N * r;
+      const G = s.x + s.width / 2;
+      _ = G - v / 2, M = G + v / 2;
+    } else {
+      N = v / r;
+      const G = s.y + s.height / 2;
+      c = G - N / 2, d = G + N / 2;
+    }
+  }
+  const y = { x: _, y: c, width: M - _, height: d - c }, x = (v) => In(v, t.rotation, t.scale, o);
+  if (x(y)) return { ...t, crop: y };
+  if (!(!(r && r > 0) && (T || f) && (A || S))) return { ...t, crop: Ft(s, y, x) };
+  const C = (v) => ({ ...v, x: _, width: M - _ }), u = (v) => ({ ...v, y: c, height: d - c }), R = Ft(Ft(s, C(s), x), u, x), m = Ft(Ft(s, u(s), x), C, x), E = (v) => Math.abs(v.x - y.x) + Math.abs(v.y - y.y) + Math.abs(v.width - y.width) + Math.abs(v.height - y.height);
+  return { ...t, crop: E(R) <= E(m) ? R : m };
+}
+function Ft(t, e, n) {
+  const i = typeof e == "function" ? e(t) : e;
+  if (n(i)) return i;
+  let o = 0, r = 1;
+  for (let a = 0; a < 24; a++) {
+    const s = (o + r) / 2;
+    n(Xe(t, i, s)) ? o = s : r = s;
+  }
+  return Xe(t, i, o);
+}
+const Xe = (t, e, n) => ({
+  x: t.x + (e.x - t.x) * n,
+  y: t.y + (e.y - t.y) * n,
+  width: t.width + (e.width - t.width) * n,
+  height: t.height + (e.height - t.height) * n
+});
+function Be(t, e) {
+  const n = {
+    ...t.crop,
+    width: Math.max(1, t.crop.width),
+    height: Math.max(1, t.crop.height)
+  };
+  return An({ ...t, crop: n, scale: Math.max(Ze, t.scale || 1) }, e);
+}
+const tn = 0.85, Un = (t, e, n) => {
+  const i = Math.min(1, Math.max(0, (n - t) / (e - t)));
+  return i * i * (3 - 2 * i);
+}, Fn = (t, e) => Un(0.3, 1, Math.hypot(t, e) / Math.SQRT2);
+function Re(t, e, n, i, o, r) {
+  const a = i.matrix, s = 1 / i.gamma, _ = Math.abs(i.gamma - 1) > 1e-4, c = Math.abs(i.clarity) > 1e-4 && !!o, M = Math.abs(i.vignette) > 1e-4 && !!r;
+  for (let d = 0; d < n; d++)
+    for (let T = 0; T < e; T++) {
+      const f = (d * e + T) * 4, A = t[f + 3] / 255;
+      if (A === 0) continue;
+      const S = t[f] / 255, y = t[f + 1] / 255, x = t[f + 2] / 255;
+      let l = a[0] * S + a[1] * y + a[2] * x + a[3] * A + a[4], C = a[5] * S + a[6] * y + a[7] * x + a[8] * A + a[9], u = a[10] * S + a[11] * y + a[12] * x + a[13] * A + a[14];
+      if (c) {
+        const R = o[f] / 255, m = o[f + 1] / 255, E = o[f + 2] / 255, v = o[f + 3] / 255, N = a[0] * R + a[1] * m + a[2] * E + a[3] * v + a[4], j = a[5] * R + a[6] * m + a[7] * E + a[8] * v + a[9], G = a[10] * R + a[11] * m + a[12] * E + a[13] * v + a[14];
+        l += i.clarity * (l - N), C += i.clarity * (C - j), u += i.clarity * (u - G);
+      }
+      if (_ && (l = Math.pow(Math.max(0, l), s), C = Math.pow(Math.max(0, C), s), u = Math.pow(Math.max(0, u), s)), M) {
+        const R = T + 0.5, m = d + 0.5, E = r[0] * R + r[1] * m + r[2], v = r[3] * R + r[4] * m + r[5], N = Fn(E, v) * tn * Math.abs(i.vignette);
+        i.vignette > 0 ? (l *= 1 - N, C *= 1 - N, u *= 1 - N) : (l += (1 - l) * N, C += (1 - C) * N, u += (1 - u) * N);
+      }
+      t[f] = l * 255, t[f + 1] = C * 255, t[f + 2] = u * 255;
+    }
+}
+function Le(t, e, n, i) {
+  const o = Math.max(1, Math.round(i)), r = new Uint8ClampedArray(t), a = new Uint8ClampedArray(t.length);
+  for (let _ = 0; _ < 3; _++)
+    s(r, a, e, n, o, !0), s(a, r, e, n, o, !1);
+  return r;
+  function s(_, c, M, d, T, f) {
+    const A = f ? d : M, S = f ? M : d, y = f ? 4 : M * 4, x = T * 2 + 1;
+    for (let l = 0; l < A; l++) {
+      const C = f ? l * M * 4 : l * 4;
+      for (let u = 0; u < 4; u++) {
+        let R = 0;
+        for (let m = -T; m <= T; m++) {
+          const E = Math.min(S - 1, Math.max(0, m));
+          R += _[C + E * y + u];
+        }
+        for (let m = 0; m < S; m++) {
+          c[C + m * y + u] = R / x;
+          const E = Math.max(0, m - T), v = Math.min(S - 1, m + T + 1);
+          R += _[C + v * y + u] - _[C + E * y + u];
+        }
+      }
+    }
+  }
+}
+const ke = 0.012, en = (t, e) => {
+  const n = document.createElement("canvas");
+  return n.width = Math.max(1, Math.round(t)), n.height = Math.max(1, Math.round(e)), n;
+};
+async function Ye(t) {
+  if (typeof createImageBitmap == "function")
+    try {
+      return await createImageBitmap(t, { imageOrientation: "from-image" });
+    } catch {
+    }
+  const e = URL.createObjectURL(t);
+  try {
+    return await nn(e, !1);
+  } finally {
+    URL.revokeObjectURL(e);
+  }
+}
+function nn(t, e) {
+  return new Promise((n, i) => {
+    const o = new Image();
+    e && (o.crossOrigin = "anonymous"), o.decoding = "async", o.onload = () => n(o), o.onerror = () => i(new Error(`Could not load image: ${t.slice(0, 80)}`)), o.src = t;
+  });
+}
+const On = (t) => t instanceof HTMLImageElement ? { width: t.naturalWidth, height: t.naturalHeight } : { width: t.width, height: t.height };
+async function Xn(t) {
+  let e, n = "";
+  if (typeof t == "string")
+    try {
+      const r = await fetch(t);
+      if (!r.ok) throw new Error(String(r.status));
+      const a = await r.blob();
+      n = a.type, e = await Ye(a);
+    } catch {
+      e = await nn(t, !t.startsWith("data:") && !t.startsWith("blob:"));
+      const r = /^data:([^;,]+)/.exec(t) ?? /\.(png|jpe?g|webp|gif|avif)(?:[?#]|$)/i.exec(t);
+      r && (n = r[1].includes("/") ? r[1] : `image/${r[1].toLowerCase().replace("jpg", "jpeg")}`);
+    }
+  else
+    n = t.type, e = await Ye(t);
+  const { width: i, height: o } = On(e);
+  if (!i || !o) throw new Error("The image has no size");
+  return { image: e, width: i, height: o, type: n };
+}
+function te(t, e, n, i) {
+  const o = Math.min(1, i / Math.max(e, n));
+  if (o >= 1) return { canvas: t, width: e, height: n };
+  const r = en(e * o, n * o), a = r.getContext("2d");
+  return a && (a.imageSmoothingQuality = "high", a.drawImage(t, 0, 0, r.width, r.height)), { canvas: r, width: r.width, height: r.height };
+}
+function rn(t, e, n, i, o = 384) {
+  const r = Math.min(1, o / Math.max(e, n)), a = en(e * r, n * r), s = a.getContext("2d", { willReadFrequently: !0 });
+  if (!s) return a;
+  s.drawImage(t, 0, 0, a.width, a.height);
+  try {
+    const _ = s.getImageData(0, 0, a.width, a.height);
+    _.data.set(Le(_.data, a.width, a.height, Math.max(1, i * r))), s.putImageData(_, 0, 0);
+  } catch {
+  }
+  return a;
+}
+function Bn(t, e) {
+  return t || (["image/jpeg", "image/png", "image/webp"].includes(e) ? e : "image/png");
+}
+const Yn = [1, 0, 0, 0, 1, 0], st = (t, e) => [1, 0, t, 0, 1, e], nt = (t, e = t) => [t, 0, 0, 0, e, 0], on = (t) => {
+  const e = Math.cos(t), n = Math.sin(t);
+  return [e, -n, 0, n, e, 0];
+};
+function Vn(t, e) {
+  return [
+    t[0] * e[0] + t[1] * e[3],
+    t[0] * e[1] + t[1] * e[4],
+    t[0] * e[2] + t[1] * e[5] + t[2],
+    t[3] * e[0] + t[4] * e[3],
+    t[3] * e[1] + t[4] * e[4],
+    t[3] * e[2] + t[4] * e[5] + t[5]
+  ];
+}
+const at = (...t) => t.reduce((e, n) => Vn(n, e), Yn);
+function Lt([t, e, n, i, o, r]) {
+  const a = t * o - e * i, s = Math.abs(a) < 1e-12 ? 1e12 : 1 / a;
+  return [o * s, -e * s, (e * r - n * o) * s, -i * s, t * s, (n * i - t * r) * s];
+}
+const ne = ([t, e, n, i, o, r], a, s) => [
+  t * a + e * s + n,
+  i * a + o * s + r
+], $n = { blur: 0.015, pixelate: 0.05 };
+function Te(t, e) {
+  var o, r;
+  const n = ((o = t.redact) == null ? void 0 : o.effect) ?? "blur";
+  return Math.max(0, Math.min(100, ((r = t.redact) == null ? void 0 : r.amount) ?? 0)) / 100 * ($n[n] ?? 0) * Math.max(e.width, e.height);
+}
+function an(t, e) {
+  const n = Math.max(1e-6, e);
+  return {
+    cols: Math.max(1, Math.round(t.width / n)),
+    rows: Math.max(1, Math.round(t.height / n))
+  };
+}
+const Gn = 4, ae = (t, e) => {
+  const n = document.createElement("canvas");
+  return n.width = Math.max(1, Math.round(t)), n.height = Math.max(1, Math.round(e)), n;
+};
+function sn(t, e, n, i, o) {
+  const r = Math.min(1, Gn / Math.max(1, i), o / Math.max(e, n)), a = ae(e * r, n * r), s = a.getContext("2d", { willReadFrequently: !0 });
+  if (!s) return a;
+  s.imageSmoothingQuality = "high", s.drawImage(t, 0, 0, a.width, a.height);
+  try {
+    const _ = s.getImageData(0, 0, a.width, a.height);
+    _.data.set(Le(_.data, a.width, a.height, Math.max(1, i * r))), s.putImageData(_, 0, 0);
+  } catch {
+  }
+  return a;
+}
+function jn(t, e, n, i) {
+  const o = ae(e, n), r = o.getContext("2d");
+  return r && (r.imageSmoothingQuality = "high", r.drawImage(sn(t, e, n, i, 1024), 0, 0, e, n)), o;
+}
+function cn(t, e, n) {
+  const i = ae(e, n), o = i.getContext("2d"), r = t.getContext("2d");
+  !o || !r || (o.imageSmoothingQuality = "high", o.drawImage(t, 0, 0, i.width, i.height), r.save(), r.setTransform(1, 0, 0, 1, 0, 0), r.globalCompositeOperation = "copy", r.imageSmoothingEnabled = !1, r.drawImage(i, 0, 0, t.width, t.height), r.restore());
+}
+function qn(t, e, n, i) {
+  const o = ae(e, n), r = o.getContext("2d");
+  return r && (r.drawImage(t, 0, 0, e, n), cn(
+    o,
+    Math.max(1, Math.round(e / Math.max(2, i))),
+    Math.max(1, Math.round(n / Math.max(2, i)))
+  )), o;
+}
+const ln = (t) => t.area ? [t.area.x + t.area.width / 2, t.area.y + t.area.height / 2] : [t.width / 2, t.height / 2];
+function Ne(t, e) {
+  const n = e.width / 2, i = e.height / 2;
+  return at(
+    st(-n, -i),
+    nt(t.flipX ? -1 : 1, t.flipY ? -1 : 1),
+    on(t.rotation),
+    nt(t.scale),
+    st(n, i)
+  );
+}
+function hn(t, e) {
+  const n = Math.abs(t.flip) < 0.02 ? 0.02 * Math.sign(t.flip || 1) : t.flip, [i, o] = ln(e);
+  return at(
+    st(-t.center[0], -t.center[1]),
+    on(t.rotation),
+    nt(t.scale * n, t.scale),
+    st(i, o)
+  );
+}
+function Wn(t) {
+  const [e, n] = Vt(t);
+  return at(st(-e, -n), nt(2 / t.width, 2 / t.height));
+}
+function Kn(t, e, n, i) {
+  const o = at(nt(1 / i.dpr), Lt(hn(n, i))), r = at(
+    o,
+    Lt(Ne(t, e)),
+    nt(1 / e.width, 1 / e.height)
+  );
+  return { toUV: r, toBlurUV: r, toCrop: at(o, Wn(t.crop)) };
+}
+function Ve(t, e, n) {
+  const i = Math.max(1, e.width - n * 2), o = Math.max(1, e.height - n * 2);
+  return {
+    center: Vt(t),
+    scale: Math.min(i / t.width, o / t.height),
+    rotation: 0,
+    flip: 1
+  };
+}
+const Hn = `
+attribute vec2 a_pos;
+void main() { gl_Position = vec4(a_pos, 0.0, 1.0); }
+`, Qn = `
+#ifdef GL_FRAGMENT_PRECISION_HIGH
+precision highp float;
+#else
+precision mediump float;
+#endif
+uniform sampler2D u_image;
+uniform sampler2D u_blur;
+uniform vec2 u_size;
+uniform vec3 u_uvX; uniform vec3 u_uvY;
+uniform vec3 u_blurX; uniform vec3 u_blurY;
+uniform vec3 u_cropX; uniform vec3 u_cropY;
+uniform bool u_clip;
+uniform float u_dim;
+uniform vec3 u_dimColor;
+uniform mat4 u_cm; uniform vec4 u_co;
+uniform float u_gamma; uniform float u_clarity; uniform float u_vignette;
+uniform vec2 u_pixel; uniform vec3 u_cuvX; uniform vec3 u_cuvY;
+
+vec3 grade(vec4 c) { return (u_cm * c + u_co).rgb; }
+
+void main() {
+  vec3 px = vec3(gl_FragCoord.x, u_size.y - gl_FragCoord.y, 1.0);
+  vec2 cn = vec2(dot(u_cropX, px), dot(u_cropY, px));
+  if (u_clip && (abs(cn.x) > 1.0 || abs(cn.y) > 1.0)) { gl_FragColor = vec4(0.0); return; }
+  vec2 uv = vec2(dot(u_uvX, px), dot(u_uvY, px));
+  vec2 buv = vec2(dot(u_blurX, px), dot(u_blurY, px));
+  if (u_pixel.x > 0.0) {
+    // the center of this pixel's block (whole blocks across the crop; the edge pixel stays in the last)
+    vec2 cell = 2.0 / u_pixel;
+    vec2 idx = floor((cn + 1.0) / cell);
+    if (abs(cn.x) <= 1.0) idx.x = min(idx.x, u_pixel.x - 1.0);
+    if (abs(cn.y) <= 1.0) idx.y = min(idx.y, u_pixel.y - 1.0);
+    cn = (idx + 0.5) * cell - 1.0;
+    vec3 q = vec3(cn, 1.0);
+    uv = vec2(dot(u_cuvX, q), dot(u_cuvY, q));
+    buv = uv;
+  }
+  if (uv.x < 0.0 || uv.y < 0.0 || uv.x > 1.0 || uv.y > 1.0) { gl_FragColor = vec4(0.0); return; }
+  vec4 c = texture2D(u_image, uv);
+  if (c.a <= 0.0) { gl_FragColor = vec4(0.0); return; }
+  vec3 rgb = grade(c);
+  if (u_clarity != 0.0) {
+    vec4 bl = texture2D(u_blur, buv);
+    rgb += u_clarity * (rgb - grade(bl));
+  }
+  if (u_gamma != 1.0) rgb = pow(max(rgb, 0.0), vec3(1.0 / u_gamma));
+  if (u_vignette != 0.0) {
+    float f = smoothstep(0.3, 1.0, length(cn) / 1.41421356) * ${tn.toFixed(2)} * abs(u_vignette);
+    rgb = u_vignette > 0.0 ? rgb * (1.0 - f) : rgb + (1.0 - rgb) * f;
+  }
+  rgb = clamp(rgb, 0.0, 1.0);
+  if (abs(cn.x) > 1.0 || abs(cn.y) > 1.0) rgb = mix(u_dimColor, rgb, u_dim);
+  gl_FragColor = vec4(rgb * c.a, c.a);
+}
+`;
+class se {
+  constructor(e, n) {
+    this.loc = {}, this.canvas = e, this.gl = n, this.maxTextureSize = n.getParameter(n.MAX_TEXTURE_SIZE), this.program = this.link(), n.useProgram(this.program);
+    const i = n.createBuffer();
+    n.bindBuffer(n.ARRAY_BUFFER, i), n.bufferData(n.ARRAY_BUFFER, new Float32Array([-1, -1, 1, -1, -1, 1, 1, 1]), n.STATIC_DRAW);
+    const o = n.getAttribLocation(this.program, "a_pos");
+    n.enableVertexAttribArray(o), n.vertexAttribPointer(o, 2, n.FLOAT, !1, 0, 0);
+    for (const r of [
+      "u_image",
+      "u_blur",
+      "u_size",
+      "u_uvX",
+      "u_uvY",
+      "u_blurX",
+      "u_blurY",
+      "u_cropX",
+      "u_cropY",
+      "u_clip",
+      "u_dim",
+      "u_dimColor",
+      "u_cm",
+      "u_co",
+      "u_gamma",
+      "u_clarity",
+      "u_vignette",
+      "u_pixel",
+      "u_cuvX",
+      "u_cuvY"
+    ])
+      this.loc[r] = n.getUniformLocation(this.program, r);
+    this.image = this.texture(), this.blur = this.texture(), n.uniform1i(this.loc.u_image, 0), n.uniform1i(this.loc.u_blur, 1);
+  }
+  /** Create a renderer on `canvas`, or `null` when WebGL is unavailable. */
+  static create(e) {
+    try {
+      const n = {
+        premultipliedAlpha: !0,
+        alpha: !0,
+        antialias: !1,
+        preserveDrawingBuffer: !0
+      }, i = e.getContext("webgl2", n) ?? e.getContext("webgl", n);
+      return i ? new se(e, i) : null;
+    } catch {
+      return null;
+    }
+  }
+  link() {
+    const e = this.gl, n = (o, r) => {
+      const a = e.createShader(o);
+      if (e.shaderSource(a, r), e.compileShader(a), !e.getShaderParameter(a, e.COMPILE_STATUS))
+        throw new Error(e.getShaderInfoLog(a) ?? "shader compile failed");
+      return a;
+    }, i = e.createProgram();
+    if (e.attachShader(i, n(e.VERTEX_SHADER, Hn)), e.attachShader(i, n(e.FRAGMENT_SHADER, Qn)), e.linkProgram(i), !e.getProgramParameter(i, e.LINK_STATUS))
+      throw new Error(e.getProgramInfoLog(i) ?? "program link failed");
+    return i;
+  }
+  texture() {
+    const e = this.gl, n = e.createTexture();
+    return e.bindTexture(e.TEXTURE_2D, n), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, e.CLAMP_TO_EDGE), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, e.CLAMP_TO_EDGE), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.LINEAR), n;
+  }
+  upload(e, n, i, o) {
+    const r = this.gl;
+    r.activeTexture(r.TEXTURE0 + e), r.bindTexture(r.TEXTURE_2D, n), r.pixelStorei(r.UNPACK_PREMULTIPLY_ALPHA_WEBGL, !1), r.texImage2D(r.TEXTURE_2D, 0, r.RGBA, r.RGBA, r.UNSIGNED_BYTE, i);
+    const a = typeof WebGL2RenderingContext < "u" && r instanceof WebGL2RenderingContext;
+    o && a ? (r.generateMipmap(r.TEXTURE_2D), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_MIN_FILTER, r.LINEAR_MIPMAP_LINEAR)) : r.texParameteri(r.TEXTURE_2D, r.TEXTURE_MIN_FILTER, r.LINEAR);
+  }
+  /** Upload the image (and its blurred copy for clarity). */
+  setImage(e, n, i = !0) {
+    this.upload(0, this.image, e, i), this.upload(1, this.blur, n, !1);
+  }
+  /**
+   * Swap just the image texture (e.g. for a coarser copy) — the blurred copy stays. `mipmap: false` for
+   * a pixelation's texture: its blocks sample one point each, and mip levels would seam their borders.
+   */
+  setSource(e, n = !0) {
+    this.upload(0, this.image, e, n);
+  }
+  /** Draw one frame at the canvas's current pixel size. */
+  render(e) {
+    const n = this.gl, { width: i, height: o } = this.canvas;
+    n.viewport(0, 0, i, o), n.clearColor(0, 0, 0, 0), n.clear(n.COLOR_BUFFER_BIT), n.uniform2f(this.loc.u_size, i, o);
+    const r = (f, A, S) => {
+      n.uniform3f(this.loc[A], f[0], f[1], f[2]), n.uniform3f(this.loc[S], f[3], f[4], f[5]);
+    };
+    r(e.toUV, "u_uvX", "u_uvY"), r(e.toBlurUV, "u_blurX", "u_blurY"), r(e.toCrop, "u_cropX", "u_cropY"), n.uniform1i(this.loc.u_clip, e.clip ? 1 : 0), n.uniform1f(this.loc.u_dim, e.dim ?? 1);
+    const [a, s, _] = e.dimColor ?? [0, 0, 0];
+    n.uniform3f(this.loc.u_dimColor, a, s, _);
+    const c = e.matrix, M = new Float32Array(16);
+    for (let f = 0; f < 4; f++)
+      for (let A = 0; A < 4; A++) M[A * 4 + f] = c[f * 5 + A];
+    n.uniformMatrix4fv(this.loc.u_cm, !1, M), n.uniform4f(this.loc.u_co, c[4], c[9], c[14], c[19]), n.uniform1f(this.loc.u_gamma, e.gamma), n.uniform1f(this.loc.u_clarity, e.clarity), n.uniform1f(this.loc.u_vignette, e.vignette);
+    const [d, T] = e.pixel ?? [0, 0];
+    n.uniform2f(this.loc.u_pixel, d, T), e.pixel && e.cropToUV && r(e.cropToUV, "u_cuvX", "u_cuvY"), n.drawArrays(n.TRIANGLE_STRIP, 0, 4);
+  }
+  /**
+   * Release the GPU resources. `loseContext` also drops the context itself (a throwaway export canvas —
+   * browsers cap live contexts); a canvas that will be drawn on again keeps it.
+   */
+  dispose(e = !0) {
+    var i;
+    const n = this.gl;
+    n.deleteTexture(this.image), n.deleteTexture(this.blur), n.deleteProgram(this.program), e && ((i = n.getExtension("WEBGL_lose_context")) == null || i.loseContext());
+  }
+}
+function Pe(t, e = t.colorMatrix) {
+  const n = t.finetune;
+  return {
+    matrix: Tn(e, n),
+    gamma: ut.gamma(n.gamma),
+    clarity: ut.clarity(n.clarity),
+    vignette: ut.vignette(n.vignette)
+  };
+}
+const un = (t) => !Mn(t.matrix) || t.gamma !== 1 || t.clarity !== 0 || t.vignette !== 0, ze = (t, e) => {
+  const n = document.createElement("canvas");
+  return n.width = Math.max(1, Math.round(t)), n.height = Math.max(1, Math.round(e)), n;
+};
+function Zn(t, e, n, i, o, r) {
+  const a = t.getContext("2d", { willReadFrequently: !0 });
+  if (!a) return;
+  const { width: s, height: _ } = t;
+  a.setTransform(1, 0, 0, 1, 0, 0), a.clearRect(0, 0, s, _);
+  const c = (d, T, f, A) => {
+    const S = at(nt(1 / f.width, 1 / f.height), Lt(A));
+    if (d.save(), r.clip) {
+      const y = Lt(r.toCrop);
+      d.beginPath(), [
+        [-1, -1],
+        [1, -1],
+        [1, 1],
+        [-1, 1]
+      ].forEach(([x, l], C) => {
+        const [u, R] = ne(y, x, l);
+        C === 0 ? d.moveTo(u, R) : d.lineTo(u, R);
+      }), d.closePath(), d.clip();
+    }
+    d.setTransform(S[0], S[3], S[1], S[4], S[2], S[5]), d.imageSmoothingQuality = "high", d.drawImage(T, 0, 0, f.width, f.height), d.restore();
+  };
+  if (c(a, e, n, r.toUV), un(r) && M(), r.dim != null && r.dim < 1) {
+    const d = Lt(r.toCrop);
+    a.save(), a.globalCompositeOperation = "source-atop", a.beginPath(), a.rect(0, 0, s, _), [
+      [-1, -1],
+      [1, -1],
+      [1, 1],
+      [-1, 1]
+    ].forEach(([S, y], x) => {
+      const [l, C] = ne(d, S, y);
+      x === 0 ? a.moveTo(l, C) : a.lineTo(l, C);
+    }), a.closePath();
+    const [T, f, A] = (r.dimColor ?? [0, 0, 0]).map((S) => Math.round(S * 255));
+    a.fillStyle = `rgba(${T}, ${f}, ${A}, ${1 - r.dim})`, a.fill("evenodd"), a.restore();
+  }
+  function M() {
+    if (a)
+      try {
+        const d = a.getImageData(0, 0, s, _);
+        let T = null;
+        if (r.clarity !== 0) {
+          const A = ze(s, _).getContext("2d", { willReadFrequently: !0 });
+          A && (c(A, i, o, r.toBlurUV), T = A.getImageData(0, 0, s, _).data);
+        }
+        Re(d.data, s, _, r, T, r.toCrop), a.putImageData(d, 0, 0);
+      } catch {
+      }
+  }
+}
+const Jn = 16384, tr = 16384 * 16384, er = (t, e, n) => new Promise((i, o) => {
+  try {
+    t.toBlob(
+      (r) => r ? i(r) : o(new Error("Encoding failed")),
+      e,
+      n
+    );
+  } catch (r) {
+    o(r);
+  }
+});
+async function nr(t, e, n, i, o) {
+  var x;
+  const r = Rt(n), a = Xt(n), s = Math.min(
+    1,
+    Jn / Math.max(r.width, r.height),
+    Math.sqrt(tr / (r.width * r.height))
+  ), _ = Math.max(1, Math.round(r.width * s)), c = Math.max(1, Math.round(r.height * s)), M = ze(_, c), d = M.getContext("2d");
+  if (!d) throw new Error("Canvas 2D is unavailable");
+  const T = at(
+    Ne(n, e),
+    st(-a.x, -a.y),
+    nt(_ / a.width, c / a.height)
+  );
+  i === "image/jpeg" && (d.fillStyle = "#fff", d.fillRect(0, 0, _, c)), d.setTransform(T[0], T[3], T[1], T[4], T[2], T[5]), d.imageSmoothingEnabled = !0, d.imageSmoothingQuality = "high";
+  const f = Te(n, e), A = (x = n.redact) == null ? void 0 : x.effect, S = f > 0 && A === "blur" ? jn(t, e.width, e.height, f) : t;
+  d.drawImage(S, 0, 0, e.width, e.height), d.setTransform(1, 0, 0, 1, 0, 0);
+  const y = Pe(n);
+  if (un(y)) {
+    const l = ke * Math.max(e.width, e.height) * (_ / a.width) * n.scale, C = rn(M, _, c, l);
+    rr(M, C, y);
+  }
+  if (f > 0 && A === "pixelate") {
+    const { cols: l, rows: C } = an(a, f * n.scale);
+    cn(M, l, C);
+  }
+  return er(M, i, o);
+}
+function rr(t, e, n) {
+  const { width: i, height: o } = t, r = t.getContext("2d", { willReadFrequently: !0 }), a = document.createElement("canvas"), s = se.create(a), _ = s ? Math.min(2048, s.maxTextureSize) : 1024, c = ze(_, _), M = c.getContext("2d", { willReadFrequently: !0 });
+  try {
+    for (let d = 0; d < o; d += _)
+      for (let T = 0; T < i; T += _) {
+        const f = Math.min(_, i - T), A = Math.min(_, o - d), S = at(st(T, d), nt(2 / i, 2 / o), st(-1, -1)), y = at(st(T, d), nt(1 / i, 1 / o));
+        if (s)
+          c.width = f, c.height = A, M.clearRect(0, 0, f, A), M.drawImage(t, T, d, f, A, 0, 0, f, A), a.width = f, a.height = A, s.setImage(c, e, !1), s.render({ ...n, toUV: nt(1 / f, 1 / A), toBlurUV: y, toCrop: S, clip: !1 }), r.clearRect(T, d, f, A), r.drawImage(a, T, d);
+        else {
+          const x = r.getImageData(T, d, f, A);
+          let l = null;
+          n.clarity !== 0 && (c.width = f, c.height = A, M.drawImage(
+            e,
+            T / i * e.width,
+            d / o * e.height,
+            f / i * e.width,
+            A / o * e.height,
+            0,
+            0,
+            f,
+            A
+          ), l = M.getImageData(0, 0, f, A).data), Re(x.data, f, A, n, l, S), r.putImageData(x, T, d);
+        }
+      }
+  } finally {
+    s == null || s.dispose();
+  }
+}
+const ir = 50, _e = (t, e) => JSON.stringify(t) === JSON.stringify(e), or = (t, e) => t === e || !!t && !!e && t.width === e.width && t.height === e.height, _t = (t) => JSON.parse(JSON.stringify(t));
+class dn {
+  constructor() {
+    this.snapshot = {
+      status: "idle",
+      error: null,
+      state: null,
+      ui: { util: "crop", cropTab: "rotation", finetuneTab: "brightness", resizeLocked: !0 },
+      size: null,
+      canUndo: !1,
+      canRedo: !1,
+      canRevert: !1
+    }, this.storeListeners = /* @__PURE__ */ new Set(), this.events = /* @__PURE__ */ new Map(), this.history = [], this.index = -1, this.initial = null, this.loaded = null, this.options = null, this.openToken = 0, this.subscribe = (e) => (this.storeListeners.add(e), () => {
+      this.storeListeners.delete(e);
+    }), this.getSnapshot = () => this.snapshot;
+  }
+  patch(e) {
+    const n = e.state !== void 0 ? e.state : this.snapshot.state;
+    this.snapshot = {
+      ...this.snapshot,
+      ...e,
+      canUndo: this.index > 0,
+      canRedo: this.index < this.history.length - 1,
+      canRevert: !!n && !!this.initial && !_e(n, this.initial)
+    }, this.storeListeners.forEach((i) => i());
+  }
+  on(e, n) {
+    let i = this.events.get(e);
+    return i || this.events.set(e, i = /* @__PURE__ */ new Set()), i.add(n), () => {
+      i.delete(n);
+    };
+  }
+  emit(e, n) {
+    var i;
+    (i = this.events.get(e)) == null || i.forEach((o) => o(n));
+  }
+  // ── lifecycle ────────────────────────────────────────────────────────────────────────────────
+  /** The loaded image (full resolution) — for renderers. */
+  get image() {
+    return this.loaded;
+  }
+  /** The `open()` options. */
+  get openOptions() {
+    return this.options;
+  }
+  async open(e) {
+    const n = ++this.openToken;
+    this.options = e, this.history = [], this.index = -1, this.initial = null, this.loaded = null, this.patch({
+      status: "loading",
+      error: null,
+      state: null,
+      size: null,
+      ui: { ...this.snapshot.ui, util: e.util ?? "crop" }
+    });
+    try {
+      const i = await Xn(e.src);
+      if (n !== this.openToken) return;
+      this.loaded = i;
+      const o = { width: i.width, height: i.height }, r = Ln(o, e.cropAspectRatio), a = e.initialState ?? {}, s = {
+        ...r,
+        ...a,
+        crop: { ...r.crop, ...a.crop },
+        finetune: { ...Qe, ...a.finetune },
+        redact: { ...r.redact, ...a.redact }
+      };
+      s.filter && s.filter !== "default" && !s.colorMatrix && (s.colorMatrix = Ce[s.filter] ?? null);
+      const _ = Be(s, o);
+      this.initial = Be(r, o), this.history = [_t(_)], this.index = 0, this.patch({ status: "ready", state: _, size: o }), this.emit("load", { size: o });
+    } catch (i) {
+      if (n !== this.openToken) return;
+      throw this.patch({ status: "error", error: i }), i;
+    }
+  }
+  close() {
+    var n;
+    this.openToken++;
+    const e = (n = this.loaded) == null ? void 0 : n.image;
+    e && "close" in e && typeof e.close == "function" && e.close(), this.loaded = null, this.emit("close");
+  }
+  // ── state ────────────────────────────────────────────────────────────────────────────────────
+  getState() {
+    if (!this.snapshot.state) throw new Error("No image is open");
+    return _t(this.snapshot.state);
+  }
+  /** Replace part of the state and commit it (one undo step). */
+  setState(e) {
+    this.preview(e), this.commit();
+  }
+  /** Apply a live (uncommitted) change — e.g. while dragging. Call `commit()` when the interaction ends. */
+  preview(e) {
+    const n = this.snapshot.state, i = this.snapshot.size;
+    if (!n || !i) return;
+    const o = { ...n, ...e }, r = this.index >= 0 ? this.history[this.index] : n;
+    "resize" in e && !or(e.resize ?? null, r.resize) || (o.resize = Cn(r, { ...o, resize: r.resize })), this.patch({ state: o });
+  }
+  /** Push the current state onto the history (if it changed) and emit `update`. */
+  commit() {
+    const e = this.snapshot.state;
+    e && (this.index >= 0 && _e(e, this.history[this.index]) || (this.history = this.history.slice(0, this.index + 1), this.history.push(_t(e)), this.history.length > ir && this.history.shift(), this.index = this.history.length - 1, this.patch({}), this.emit("update", _t(e))));
+  }
+  undo() {
+    this.index <= 0 || (this.index--, this.patch({ state: _t(this.history[this.index]) }), this.emit("undo", this.getState()), this.emit("update", this.getState()));
+  }
+  redo() {
+    this.index >= this.history.length - 1 || (this.index++, this.patch({ state: _t(this.history[this.index]) }), this.emit("redo", this.getState()), this.emit("update", this.getState()));
+  }
+  /**
+   * Back to the original image — every edit dropped, including the ones an `initialState` re-opened with.
+   * It's one history step, so Undo brings the edits back.
+   */
+  revert() {
+    const e = this.snapshot.state;
+    !this.initial || !e || _e(e, this.initial) || (this.patch({ state: _t(this.initial) }), this.commit(), this.emit("revert", this.getState()));
+  }
+  setUi(e) {
+    e.util && e.util !== this.snapshot.ui.util && this.commit(), this.patch({ ui: { ...this.snapshot.ui, ...e } });
+  }
+  /** Render the current state at full resolution. */
+  async process() {
+    var a, s;
+    const e = this.loaded, n = this.snapshot.state;
+    if (!e || !n) throw new Error("No image is open");
+    const i = Bn((a = this.options) == null ? void 0 : a.outputType, e.type), r = { dest: await nr(
+      e.image,
+      { width: e.width, height: e.height },
+      n,
+      i,
+      ((s = this.options) == null ? void 0 : s.outputQuality) ?? 0.92
+    ), imageState: _t(n) };
+    return this.emit("process", r), r;
+  }
+}
+const po = () => new dn(), ar = () => typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+function $e(t, e, n, { stiffness: i = 240, damping: o = 30 } = {}, r) {
+  if (ar() || typeof requestAnimationFrame != "function") {
+    n(e), r == null || r();
+    const S = (() => {
+    });
+    return S.retarget = (y) => n(y), S;
+  }
+  const a = [...e], s = [...t], _ = t.map(() => 0), c = t.map((S, y) => Math.max(1e-5, Math.abs(a[y] - S) * 1e-3));
+  let M = performance.now(), d = 0, T = !1;
+  const f = (S) => {
+    if (T) return;
+    let y = Math.min(0.064, (S - M) / 1e3);
+    for (M = S; y > 0; ) {
+      const l = Math.min(y, 0.008333333333333333);
+      for (let C = 0; C < s.length; C++) {
+        const u = -i * (s[C] - a[C]) - o * _[C];
+        _[C] += u * l, s[C] += _[C] * l;
+      }
+      y -= l;
+    }
+    if (s.every(
+      (l, C) => Math.abs(l - a[C]) < c[C] && Math.abs(_[C]) < c[C] * 10
+    )) {
+      n(a), r == null || r();
+      return;
+    }
+    n([...s]), d = requestAnimationFrame(f);
+  };
+  d = requestAnimationFrame(f);
+  const A = (() => {
+    T = !0, cancelAnimationFrame(d);
+  });
+  return A.retarget = (S) => {
+    for (let y = 0; y < a.length; y++)
+      a[y] = S[y], c[y] = Math.max(c[y], 1e-5);
+  }, A;
+}
+const sr = "_overlay_2796b_6", cr = "_editor_2796b_11", lr = "_header_2796b_61", hr = "_headerStart_2796b_70", ur = "_headerCenter_2796b_74", dr = "_headerEnd_2796b_79", mr = "_group_2796b_84", fr = "_zoomLabel_2796b_97", pr = "_done_2796b_105", gr = "_closeIcon_2796b_116", _r = "_groupDivider_2796b_120", br = "_main_2796b_148", wr = "_nav_2796b_159", vr = "_stage_2796b_160", xr = "_toolbar_2796b_161", Mr = "_canvasArea_2796b_162", yr = "_footer_2796b_163", Er = "_footerInner_2796b_164", Tr = "_navList_2796b_169", Ir = "_toolbarRow_2796b_170", Ar = "_tool_2796b_161", Sr = "_toolActive_2796b_217", Cr = "_shapeSlot_2796b_263", Rr = "_shapePreview_2796b_270", Lr = "_shapeCustom_2796b_276", kr = "_shapeOrientation_2796b_281", Nr = "_orientButton_2796b_290", Pr = "_orientActive_2796b_313", zr = "_viewport_2796b_330", Dr = "_viewportCrop_2796b_339", Ur = "_viewportPannable_2796b_342", Fr = "_canvas_2796b_162", Or = "_scene_2796b_355", Xr = "_cropBox_2796b_362", Br = "_grid_2796b_369", Yr = "_cropInteracting_2796b_398", Vr = "_sizeBadge_2796b_404", $r = "_sizeBadgeActive_2796b_430", Gr = "_sizeTimes_2796b_433", jr = "_sizeUnit_2796b_434", qr = "_handle_2796b_444", Wr = "_handle_nw_2796b_448", Kr = "_handle_ne_2796b_449", Hr = "_handle_sw_2796b_450", Qr = "_handle_se_2796b_451", Zr = "_handle_n_2796b_448", Jr = "_handle_s_2796b_450", ti = "_handle_w_2796b_511", ei = "_handle_e_2796b_512", ni = "_status_2796b_527", ri = "_toastError_2796b_538", ii = "_tabs_2796b_571", oi = "_tab_2796b_571", ai = "_tabActive_2796b_606", si = "_tabDot_2796b_617", ci = "_resizePanel_2796b_628", li = "_resizeFields_2796b_634", hi = "_dimField_2796b_640", ui = "_dimLabel_2796b_658", di = "_dimLabelShort_2796b_662", mi = "_dimInput_2796b_665", fi = "_dimUnit_2796b_681", pi = "_lockButton_2796b_686", gi = "_lockActive_2796b_703", _i = "_strip_2796b_715", bi = "_fadeStart_2796b_730", wi = "_fadeEnd_2796b_734", vi = "_stripGroup_2796b_754", xi = "_filterTile_2796b_759", Mi = "_filterThumb_2796b_773", yi = "_filterActive_2796b_804", Ei = "_filterLabel_2796b_814", Ti = "_fadeIn_2796b_819", Ii = "_toolbarIconOnPhone_2796b_861", Ai = "_toolbarLabel_2796b_873", Si = "_dimLabelFull_2796b_882", Ci = "_toolLabel_2796b_918", b = {
+  overlay: sr,
+  editor: cr,
+  header: lr,
+  headerStart: hr,
+  headerCenter: ur,
+  headerEnd: dr,
+  group: mr,
+  zoomLabel: fr,
+  done: pr,
+  closeIcon: gr,
+  groupDivider: _r,
+  main: br,
+  nav: wr,
+  stage: vr,
+  toolbar: xr,
+  canvasArea: Mr,
+  footer: yr,
+  footerInner: Er,
+  navList: Tr,
+  toolbarRow: Ir,
+  tool: Ar,
+  toolActive: Sr,
+  shapeSlot: Cr,
+  shapePreview: Rr,
+  shapeCustom: Lr,
+  shapeOrientation: kr,
+  orientButton: Nr,
+  orientActive: Pr,
+  viewport: zr,
+  viewportCrop: Dr,
+  viewportPannable: Ur,
+  canvas: Fr,
+  scene: Or,
+  cropBox: Xr,
+  grid: Br,
+  cropInteracting: Yr,
+  sizeBadge: Vr,
+  "tz-ie-fade": "_tz-ie-fade_2796b_1",
+  sizeBadgeActive: $r,
+  sizeTimes: Gr,
+  sizeUnit: jr,
+  handle: qr,
+  handle_nw: Wr,
+  handle_ne: Kr,
+  handle_sw: Hr,
+  handle_se: Qr,
+  handle_n: Zr,
+  handle_s: Jr,
+  handle_w: ti,
+  handle_e: ei,
+  status: ni,
+  toastError: ri,
+  tabs: ii,
+  tab: oi,
+  tabActive: ai,
+  tabDot: si,
+  resizePanel: ci,
+  resizeFields: li,
+  dimField: hi,
+  dimLabel: ui,
+  dimLabelShort: di,
+  dimInput: mi,
+  dimUnit: fi,
+  lockButton: pi,
+  lockActive: gi,
+  strip: _i,
+  fadeStart: bi,
+  fadeEnd: wi,
+  stripGroup: vi,
+  filterTile: xi,
+  filterThumb: Mi,
+  filterActive: yi,
+  filterLabel: Ei,
+  fadeIn: Ti,
+  toolbarIconOnPhone: Ii,
+  toolbarLabel: Ai,
+  dimLabelFull: Si,
+  toolLabel: Ci
+}, Ri = 24, Li = 12, Ge = 4096, ki = 768, je = 0.35;
+function Ni(t) {
+  const e = t ? getComputedStyle(t).getPropertyValue("--tz-color-background-rgb") : "", [n, i, o] = e.split(",").map((r) => Number(r.trim()) / 255);
+  return [n, i, o].every((r) => Number.isFinite(r)) ? [n, i, o] : [0, 0, 0];
+}
+const Pi = 40, zi = ["nw", "ne", "sw", "se", "n", "s", "w", "e"], Ot = (t) => [t.center[0], t.center[1], Math.log(t.scale), t.rotation, t.flip], Di = (t) => ({
+  center: [t[0], t[1]],
+  scale: Math.exp(t[2]),
+  rotation: t[3],
+  flip: t[4]
+}), Ui = Ke(function({ core: e, snapshot: n, cropAspectRatio: i, viewZoom: o, onViewZoom: r, onZoomReport: a, areaRef: s }, _) {
+  const { state: c, size: M, ui: d } = n, T = wn(), f = d.util, A = O(null), S = O(null), [y, x] = Q(null), [l, C] = Q(null), u = O(null);
+  u.current = l;
+  const [R, m] = Q([0, 0]), [E, v] = Q(!1), [N, j] = Q(0), G = O(!1), W = O(null), V = O(null), ct = O(null), Z = O(/* @__PURE__ */ new Map()), dt = O(void 0);
+  q(() => {
+    const g = A.current;
+    if (!g) return;
+    const p = () => {
+      var F;
+      const D = g.getBoundingClientRect(), Y = (F = s == null ? void 0 : s.current) == null ? void 0 : F.getBoundingClientRect();
+      x({
+        width: D.width,
+        height: D.height,
+        dpr: window.devicePixelRatio || 1,
+        // horizontally the area is mirrored to the wider side, so the crop sits in the middle of the
+        // screen (not of the space right of the tool menu); vertically it's the space between the bars
+        area: Y ? Fi(D, Y) : void 0
+      });
+    };
+    if (p(), k.current = p, typeof ResizeObserver > "u") return;
+    const P = new ResizeObserver(p);
+    return P.observe(g), s != null && s.current && P.observe(s.current), () => P.disconnect();
+  }, [s]);
+  const k = O(null);
+  ue(() => {
+    var g;
+    (g = k.current) == null || g.call(k);
+  }, [f, n.status]);
+  const z = n.status === "ready" ? e.image : null, [L, $] = Q(null);
+  q(() => {
+    const g = S.current;
+    if (!z || !g) return;
+    const p = se.create(g), P = Math.min(Ge, (p == null ? void 0 : p.maxTextureSize) ?? Ge), D = te(z.image, z.width, z.height, P), Y = ke * Math.max(z.width, z.height) * (D.width / z.width), F = rn(D.canvas, D.width, D.height, Y);
+    return p == null || p.setImage(D.canvas, F), $({ gl: p, tex: D, blur: F }), () => {
+      p == null || p.dispose(!1), $(null);
+    };
+  }, [z]);
+  const H = c && M ? Rt(c).width * c.scale / Xt(c).width : 1, mt = M ? Math.max(1, Math.round(M.width * H)) : 0, lt = (c == null ? void 0 : c.redact.effect) ?? "blur", xt = (c == null ? void 0 : c.redact.amount) ?? 0, [J, rt] = Q(null);
+  q(() => {
+    if (!L || !M) {
+      rt(null);
+      return;
+    }
+    const g = requestAnimationFrame(() => {
+      let p = { ...L.tex, mipmap: !0, pixelate: !1 };
+      mt < p.width && (p = {
+        ...te(
+          p.canvas,
+          p.width,
+          p.height,
+          Math.max(1, Math.round(Math.max(M.width, M.height) * H))
+        ),
+        mipmap: !0,
+        pixelate: !1
+      });
+      const P = Te({ redact: { effect: lt, amount: xt } }, M);
+      if (P <= 0) return rt(p);
+      const D = P * (p.width / M.width);
+      if (lt === "blur") {
+        const F = sn(p.canvas, p.width, p.height, D, ki);
+        return rt({
+          canvas: F,
+          width: F.width,
+          height: F.height,
+          mipmap: !0,
+          pixelate: !1
+        });
+      }
+      if (!L.gl) {
+        const F = qn(p.canvas, p.width, p.height, D);
+        return rt({
+          canvas: F,
+          width: F.width,
+          height: F.height,
+          mipmap: !1,
+          pixelate: !1
+        });
+      }
+      const Y = te(
+        p.canvas,
+        p.width,
+        p.height,
+        Math.max(p.width, p.height) / Math.max(1, D)
+      );
+      rt({ ...Y, mipmap: !1, pixelate: !0 });
+    });
+    return () => cancelAnimationFrame(g);
+  }, [L, mt, lt, xt]), ue(() => {
+    L != null && L.gl && J && L.gl.setSource(J.canvas, J.mipmap);
+  }, [L, J]);
+  const tt = mn(() => {
+    if (!c || !y) return null;
+    const g = y.area ?? y;
+    if (f === "crop") return Ve(c.crop, g, Math.min(Ri, g.width * 0.06));
+    const p = Xt(c), P = Ve(p, g, Li), D = c.resize ? { ...P, scale: Math.min(P.scale, Rt(c).width / p.width) } : P;
+    if (o == null) return D;
+    const Y = o / c.scale, F = Math.max(0, p.width / 2 - g.width / 2 / Y), it = Math.max(0, p.height / 2 - g.height / 2 / Y), ht = Math.max(-F, Math.min(F, R[0])), yt = Math.max(-it, Math.min(it, R[1]));
+    return { ...D, scale: Y, center: [D.center[0] + ht, D.center[1] + yt] };
+  }, [c, y, f, o, R, N]), qt = O(f), It = O(!1), Mt = O({
+    stage: y,
+    state: c
+  }), Nt = (g, p) => {
+    var P;
+    (P = V.current) == null || P.call(V), It.current = !0, V.current = $e(
+      Ot(g),
+      Ot(p),
+      (D) => C(Di(D)),
+      void 0,
+      () => {
+        It.current = !1;
+      }
+    );
+  }, [ft, ce] = Q(f === "crop" ? je : 0), Wt = O(ft);
+  Wt.current = ft, q(() => {
+    const g = f === "crop" ? je : 0;
+    return $e([Wt.current], [g], ([p]) => ce(Math.max(0, p)));
+  }, [f]), ue(() => {
+    var it, ht, yt, De;
+    if (!tt) return;
+    qt.current !== f && (qt.current = f, u.current && !W.current && (W.current = "jump"));
+    const g = y !== Mt.current.stage && c === Mt.current.state, p = (it = Mt.current.state) == null ? void 0 : it.resize, P = f === "resize" && (((ht = c == null ? void 0 : c.resize) == null ? void 0 : ht.width) !== (p == null ? void 0 : p.width) || ((yt = c == null ? void 0 : c.resize) == null ? void 0 : yt.height) !== (p == null ? void 0 : p.height)), D = Mt.current.target, Y = !!D && Ot(D).every((Dt, le) => Math.abs(Dt - Ot(tt)[le]) < 1e-9);
+    Mt.current = { stage: y, state: c, target: tt };
+    const F = W.current;
+    if (F) {
+      W.current = null;
+      const Dt = u.current ?? tt, le = F === "rotate" ? { center: tt.center, scale: Dt.scale, rotation: Math.PI / 2, flip: 1 } : F === "flip" ? { center: tt.center, scale: Dt.scale, rotation: 0, flip: -1 } : Dt;
+      Nt(le, tt);
+      return;
+    }
+    if ((g || P || Y) && It.current && V.current) {
+      V.current.retarget(Ot(tt));
+      return;
+    }
+    if (P && u.current && !G.current) {
+      Nt(u.current, tt);
+      return;
+    }
+    G.current || ((De = V.current) == null || De.call(V), V.current = null, It.current = !1, C(tt));
+  }, [tt]), q(() => () => {
+    var g;
+    return (g = V.current) == null ? void 0 : g.call(V);
+  }, []), q(() => {
+    l && c && a(l.scale * c.scale);
+  }, [l, c, a]), q(() => {
+    const g = S.current;
+    if (!g || !y) return;
+    const p = Math.max(1, Math.round(y.width * y.dpr)), P = Math.max(1, Math.round(y.height * y.dpr));
+    g.width !== p && (g.width = p), g.height !== P && (g.height = P);
+  }, [y]), q(() => {
+    if (!L || !J || !c || !M || !l || !y) return;
+    const g = f === "crop" ? c : { ...c, crop: Xt(c) }, p = Kn(g, M, l, y), P = J.pixelate ? Te(c, M) : 0, D = P > 0 ? {
+      pixel: ((F) => [F.cols, F.rows])(
+        an(g.crop, P * c.scale)
+      ),
+      cropToUV: at(Lt(p.toCrop), p.toUV)
+    } : null, Y = requestAnimationFrame(() => {
+      const F = {
+        ...Pe(c),
+        ...p,
+        ...D,
+        // the image around the crop: dimmed in the Crop view, gone (faded into the background) in the
+        // others — `surround` springs between the two on a tool switch
+        clip: ft <= 1e-3,
+        dim: ft,
+        dimColor: Ni(A.current)
+      };
+      L.gl ? L.gl.render(F) : S.current && Zn(S.current, J.canvas, J, L.blur, L.blur, F);
+    });
+    return () => cancelAnimationFrame(Y);
+  }, [L, J, c, M, l, y, ft, T, f]), fn(_, () => ({
+    transition(g) {
+      W.current = g;
+    }
+  }));
+  const pt = (l == null ? void 0 : l.scale) ?? 1, Kt = O(r);
+  Kt.current = r;
+  const Pt = () => {
+    const [g, p] = [...Z.current.values()];
+    return g && p ? Math.hypot(g.x - p.x, g.y - p.y) : 0;
+  }, gt = (g) => {
+    var P, D;
+    if (!c || !M || g.pointerType === "mouse" && g.button !== 0 || g.target.closest("button")) return;
+    if (g.currentTarget.setPointerCapture(g.pointerId), Z.current.set(g.pointerId, { x: g.clientX, y: g.clientY }), (P = V.current) == null || P.call(V), Z.current.size === 2) {
+      ct.current = {
+        kind: "pinch",
+        dist: Pt(),
+        base: c,
+        zoom: Jt(c, M),
+        viewZoom: ((l == null ? void 0 : l.scale) ?? 1) * c.scale
+      };
+      return;
+    }
+    const p = (D = g.target.closest("[data-handle]")) == null ? void 0 : D.dataset.handle;
+    f === "crop" ? (ct.current = p ? { kind: "resize", id: g.pointerId, x: g.clientX, y: g.clientY, base: c, handle: p } : { kind: "pan", id: g.pointerId, x: g.clientX, y: g.clientY, base: c }, p && (G.current = !0), v(!0)) : o != null && (ct.current = { kind: "viewPan", id: g.pointerId, x: g.clientX, y: g.clientY, pan: R });
+  }, zt = (g) => {
+    if (!Z.current.has(g.pointerId) || !M) return;
+    Z.current.set(g.pointerId, { x: g.clientX, y: g.clientY });
+    const p = ct.current;
+    if (!p) return;
+    if (p.kind === "pinch") {
+      const Y = Pt() / Math.max(1, p.dist);
+      f === "crop" ? e.preview(Yt(p.base, Math.min(Bt, p.zoom * Y), M)) : r(be(p.viewZoom * Y));
+      return;
+    }
+    if (p.id !== g.pointerId) return;
+    const P = (g.clientX - p.x) / pt, D = (g.clientY - p.y) / pt;
+    if (p.kind === "pan") e.preview(Pn(p.base, -P, -D, M));
+    else if (p.kind === "resize") {
+      const Y = p.base.crop, it = i || p.base.cropRatio || g.shiftKey ? Y.width / Y.height : null;
+      e.preview(
+        Dn(p.base, p.handle, P, D, M, {
+          aspectRatio: it,
+          minSize: Math.max(p.base.scale, Pi / pt)
+        })
+      );
+    } else p.kind === "viewPan" && m([p.pan[0] - P, p.pan[1] - D]);
+  }, Ht = (g) => {
+    if (!Z.current.has(g.pointerId)) return;
+    Z.current.delete(g.pointerId);
+    const p = ct.current;
+    if (p) {
+      if (p.kind === "pinch") {
+        Z.current.size === 0 && (ct.current = null, f === "crop" && e.commit());
+        return;
+      }
+      p.id === g.pointerId && (ct.current = null, v(!1), p.kind === "resize" ? (G.current = !1, W.current = "jump", e.commit(), j((P) => P + 1)) : p.kind === "pan" && e.commit());
+    }
+  }, h = (g) => {
+    if (!c || !M) return;
+    const p = g.ctrlKey || g.metaKey;
+    if (!(p && I.current)) {
+      if (f === "crop") {
+        const P = Math.exp(-g.deltaY * (p ? 0.01 : 2e-3));
+        e.preview(Yt(c, Math.min(Bt, Jt(c, M) * P), M)), clearTimeout(dt.current), dt.current = setTimeout(() => e.commit(), 250);
+        return;
+      }
+      if (p) {
+        const P = ((l == null ? void 0 : l.scale) ?? 1) * c.scale;
+        r(be(P * Math.exp(-g.deltaY * 0.01)));
+      } else o != null && m(([P, D]) => [P + g.deltaX / pt, D + g.deltaY / pt]);
+    }
+  };
+  q(() => () => clearTimeout(dt.current), []);
+  const I = O(null), U = O({ state: c, size: M, util: f, view: l });
+  U.current = { state: c, size: M, util: f, view: l }, q(() => {
+    const g = A.current;
+    if (!g) return;
+    const p = (Y) => {
+      const { state: F, size: it, view: ht } = U.current;
+      Y.preventDefault(), !(!F || !it || Z.current.size > 0) && (I.current = { base: F, zoom: Jt(F, it), viewZoom: ((ht == null ? void 0 : ht.scale) ?? 1) * F.scale });
+    }, P = (Y) => {
+      const F = I.current, { size: it, util: ht } = U.current;
+      if (!F || !it) return;
+      Y.preventDefault();
+      const yt = Y.scale || 1;
+      ht === "crop" ? e.preview(Yt(F.base, Math.min(Bt, F.zoom * yt), it)) : Kt.current(be(F.viewZoom * yt));
+    }, D = (Y) => {
+      I.current && (Y.preventDefault(), I.current = null, U.current.util === "crop" && e.commit());
+    };
+    return g.addEventListener("gesturestart", p), g.addEventListener("gesturechange", P), g.addEventListener("gestureend", D), () => {
+      g.removeEventListener("gesturestart", p), g.removeEventListener("gesturechange", P), g.removeEventListener("gestureend", D);
+    };
+  }, [e]);
+  let X = null;
+  if (f === "crop" && c && y && l) {
+    const g = hn({ ...l, rotation: 0, flip: 1 }, y), [p, P] = ne(g, c.crop.x, c.crop.y), [D, Y] = ne(
+      g,
+      c.crop.x + c.crop.width,
+      c.crop.y + c.crop.height
+    );
+    X = { left: p, top: P, width: D - p, height: Y - P };
+  }
+  const At = l && y ? {
+    transform: `scaleX(${l.flip}) rotate(${l.rotation}rad)`,
+    transformOrigin: ln(y).map((g) => `${g}px`).join(" ")
+  } : void 0;
+  return /* @__PURE__ */ B(
+    "div",
+    {
+      ref: A,
+      className: K(
+        b.viewport,
+        f === "crop" ? b.viewportCrop : o != null && b.viewportPannable
+      ),
+      "data-part": "viewport",
+      onPointerDown: gt,
+      onPointerMove: zt,
+      onPointerUp: Ht,
+      onPointerCancel: Ht,
+      onWheel: h,
+      children: [
+        /* @__PURE__ */ w("canvas", { ref: S, className: b.canvas, "data-part": "canvas" }),
+        X && /* @__PURE__ */ w("div", { className: K(b.scene, b.fadeIn), style: At, children: /* @__PURE__ */ B(
+          "div",
+          {
+            className: K(b.cropBox, E && b.cropInteracting),
+            style: X,
+            "data-part": "crop",
+            children: [
+              /* @__PURE__ */ w("span", { className: b.grid, "aria-hidden": "true" }),
+              zi.map((g) => /* @__PURE__ */ w(
+                "span",
+                {
+                  className: K(b.handle, b[`handle_${g}`]),
+                  "data-handle": g,
+                  "aria-hidden": "true"
+                },
+                g
+              ))
+            ]
+          }
+        ) }),
+        X && c && l && l.rotation === 0 && l.flip === 1 && /* @__PURE__ */ B(
+          "div",
+          {
+            className: K(b.sizeBadge, E && b.sizeBadgeActive),
+            style: {
+              left: X.left + X.width / 2,
+              top: X.top + X.height
+            },
+            "data-part": "size",
+            children: [
+              Rt(c).width,
+              /* @__PURE__ */ w("span", { className: b.sizeTimes, children: "×" }),
+              Rt(c).height,
+              /* @__PURE__ */ w("span", { className: b.sizeUnit, children: "px" })
+            ]
+          }
+        )
+      ]
+    }
+  );
+});
+function Fi(t, e) {
+  const n = Math.max(0, e.left - t.left, t.right - e.right);
+  return {
+    x: n,
+    y: e.top - t.top,
+    width: Math.max(1, t.width - n * 2),
+    height: e.height
+  };
+}
+const Ie = 0.02, Ae = 8, be = (t) => Math.min(Ae, Math.max(Ie, t)), Oi = [
+  { label: "1:1", ratio: 1 },
+  { label: "2:1", ratio: 2 },
+  { label: "3:2", ratio: 3 / 2 },
+  { label: "4:3", ratio: 4 / 3 },
+  { label: "5:4", ratio: 5 / 4 },
+  { label: "16:10", ratio: 16 / 10 },
+  { label: "16:9", ratio: 16 / 9 }
+], Qt = (t, e) => Math.abs(t - e) < 1e-3, Xi = (t) => t.split(":").reverse().join(":");
+function qe({ ratio: t }) {
+  const n = t == null || t >= 1 ? 16 : Math.max(6, 16 * t), i = t == null || t <= 1 ? 16 : Math.max(6, 16 / t);
+  return /* @__PURE__ */ w("span", { className: b.shapeSlot, children: /* @__PURE__ */ w(
+    "span",
+    {
+      className: K(b.shapePreview, t == null && b.shapeCustom),
+      style: { width: n, height: i }
+    }
+  ) });
+}
+function Bi({ ratio: t, options: e, onChange: n }) {
+  const i = re(), [o, r] = Q(!1), [a, s] = Q(!1), _ = t != null && !Qt(t, 1) ? t < 1 : a, c = (d) => {
+    n(d), r(!1);
+  }, M = (d) => {
+    s(d), t != null && !Qt(t, 1) && t < 1 !== d && n(1 / t);
+  };
+  return /* @__PURE__ */ B(
+    vn,
+    {
+      open: o,
+      onOpenChange: r,
+      closeOnSelect: !1,
+      placement: "bottom-start",
+      size: "sm",
+      trigger: /* @__PURE__ */ w(
+        Me,
+        {
+          variant: "text",
+          color: "primary",
+          size: "sm",
+          startIcon: /* @__PURE__ */ w(et, { name: "MaximizeFormat" }),
+          title: i("imageEditor.cropShape"),
+          "aria-label": i("imageEditor.cropShape"),
+          className: b.toolbarIconOnPhone,
+          children: /* @__PURE__ */ w("span", { className: b.toolbarLabel, children: i("imageEditor.cropShape") })
+        }
+      ),
+      children: [
+        /* @__PURE__ */ w(
+          "div",
+          {
+            className: b.shapeOrientation,
+            role: "group",
+            "aria-label": i("imageEditor.orientation"),
+            children: [!1, !0].map((d) => /* @__PURE__ */ w(
+              "button",
+              {
+                type: "button",
+                className: K(b.orientButton, _ === d && b.orientActive),
+                "aria-pressed": _ === d,
+                "aria-label": i(d ? "imageEditor.portrait" : "imageEditor.landscape"),
+                title: i(d ? "imageEditor.portrait" : "imageEditor.landscape"),
+                onClick: () => M(d),
+                children: /* @__PURE__ */ w(et, { name: d ? "Mobile" : "Monitor", size: "sm" })
+              },
+              String(d)
+            ))
+          }
+        ),
+        /* @__PURE__ */ w(
+          Ue,
+          {
+            icon: /* @__PURE__ */ w(qe, { ratio: null }),
+            clickable: !0,
+            selected: t == null,
+            onClick: () => c(null),
+            children: i("imageEditor.custom")
+          }
+        ),
+        e.map((d) => {
+          const T = _ ? 1 / d.ratio : d.ratio;
+          return /* @__PURE__ */ w(
+            Ue,
+            {
+              icon: /* @__PURE__ */ w(qe, { ratio: T }),
+              clickable: !0,
+              selected: t != null && Qt(t, T),
+              onClick: () => c(T),
+              children: _ && !Qt(d.ratio, 1) ? Xi(d.label) : d.label
+            },
+            d.label
+          );
+        })
+      ]
+    }
+  );
+}
+const Yi = 52;
+function Vi(t, e, n) {
+  const i = Math.min(2, typeof window < "u" && window.devicePixelRatio || 1), o = Math.round(Yi * i), r = document.createElement("canvas");
+  r.width = r.height = o;
+  const a = r.getContext("2d", { willReadFrequently: !0 });
+  if (!a) return null;
+  const { crop: s } = n, _ = o / Math.min(s.width, s.height), [c, M] = Vt(s), d = at(
+    Ne(n, e),
+    st(-c, -M),
+    nt(_),
+    st(o / 2, o / 2)
+  );
+  a.setTransform(d[0], d[3], d[1], d[4], d[2], d[5]), a.imageSmoothingQuality = "high", a.drawImage(t, 0, 0, e.width, e.height), a.setTransform(1, 0, 0, 1, 0, 0);
+  let T;
+  try {
+    T = a.getImageData(0, 0, o, o);
+  } catch {
+    return null;
+  }
+  const f = ke * Math.max(e.width, e.height) * n.scale * _, A = n.finetune.clarity ? Le(T.data, o, o, f) : null, S = at(
+    st(-o / 2, -o / 2),
+    nt(1 / _),
+    nt(2 / s.width, 2 / s.height)
+  ), y = {};
+  for (const x of ye.flat()) {
+    const l = new ImageData(new Uint8ClampedArray(T.data), o, o);
+    Re(l.data, o, o, Pe(n, Ce[x]), A, S), a.putImageData(l, 0, 0), y[x] = r.toDataURL();
+  }
+  return y;
+}
+function $i({ image: t, size: e, state: n, onSelect: i }) {
+  var R;
+  const o = re(), r = O(null), [a, s] = Q({}), [_, c] = Q({ start: !1, end: !1 }), M = n.filter ?? "default", d = O(null);
+  ((R = d.current) == null ? void 0 : R.image) !== t && (d.current = { image: t, source: te(t, e.width, e.height, 512).canvas });
+  const T = JSON.stringify([
+    n.crop,
+    n.rotation,
+    n.flipX,
+    n.flipY,
+    n.scale,
+    n.finetune
+  ]);
+  q(() => {
+    const m = setTimeout(() => {
+      var N;
+      const E = (N = d.current) == null ? void 0 : N.source;
+      if (!E) return;
+      const v = Vi(E, e, n);
+      v && s(v);
+    }, 120);
+    return () => clearTimeout(m);
+  }, [T, t]);
+  const f = () => {
+    const m = r.current;
+    m && c({
+      start: m.scrollLeft > 2,
+      end: m.scrollLeft + m.clientWidth < m.scrollWidth - 2
+    });
+  };
+  q(() => {
+    f();
+    const m = r.current;
+    if (!m || typeof ResizeObserver > "u") return;
+    const E = new ResizeObserver(f);
+    return E.observe(m), () => E.disconnect();
+  }, []), q(() => {
+    var m, E, v;
+    (v = (E = (m = r.current) == null ? void 0 : m.querySelector(`[data-filter="${M}"]`)) == null ? void 0 : E.scrollIntoView) == null || v.call(E, { block: "nearest", inline: "nearest", behavior: "smooth" });
+  }, [M]), q(() => {
+    const m = r.current;
+    if (!m) return;
+    const E = (v) => {
+      Math.abs(v.deltaY) <= Math.abs(v.deltaX) || (v.preventDefault(), m.scrollLeft += v.deltaY);
+    };
+    return m.addEventListener("wheel", E, { passive: !1 }), () => m.removeEventListener("wheel", E);
+  }, []);
+  const A = O(
+    null
+  ), S = O(0), y = (m) => {
+    if (m.pointerType !== "mouse" || m.button !== 0) return;
+    cancelAnimationFrame(S.current);
+    const E = r.current;
+    A.current = { x: m.clientX, left: E.scrollLeft, v: 0, t: performance.now(), moved: !1 };
+  }, x = (m) => {
+    const E = A.current;
+    if (!E) return;
+    const v = r.current, N = m.clientX - E.x;
+    if (Math.abs(N) > 4 && !E.moved && (E.moved = !0, v.setPointerCapture(m.pointerId)), !E.moved) return;
+    const j = performance.now(), G = E.left - N;
+    E.v = (v.scrollLeft - G) / Math.max(1, j - E.t), E.t = j, v.scrollLeft = G;
+  }, l = () => {
+    const m = A.current;
+    if (A.current = null, !(m != null && m.moved)) return;
+    const E = r.current;
+    let v = -m.v, N = performance.now();
+    const j = (W) => {
+      const V = W - N;
+      N = W, E.scrollLeft += v * V, v *= Math.pow(0.995, V), Math.abs(v) > 0.02 && (S.current = requestAnimationFrame(j));
+    };
+    S.current = requestAnimationFrame(j);
+    const G = (W) => {
+      W.stopPropagation(), W.preventDefault();
+    };
+    E.addEventListener("click", G, { capture: !0, once: !0 }), setTimeout(() => E.removeEventListener("click", G, { capture: !0 }), 0);
+  };
+  q(() => () => cancelAnimationFrame(S.current), []);
+  const C = ye.flat(), u = (m) => {
+    var N, j;
+    if (m.key !== "ArrowLeft" && m.key !== "ArrowRight") return;
+    const E = C.indexOf(m.target.dataset.filter);
+    if (E === -1) return;
+    m.preventDefault();
+    const v = C[Math.min(C.length - 1, Math.max(0, E + (m.key === "ArrowRight" ? 1 : -1)))];
+    (j = (N = r.current) == null ? void 0 : N.querySelector(`[data-filter="${v}"]`)) == null || j.focus();
+  };
+  return /* @__PURE__ */ w(
+    "div",
+    {
+      ref: r,
+      className: K(b.strip, _.start && b.fadeStart, _.end && b.fadeEnd),
+      "data-part": "filters",
+      role: "group",
+      "aria-label": o("imageEditor.filters"),
+      onScroll: f,
+      onPointerDown: y,
+      onPointerMove: x,
+      onPointerUp: l,
+      onPointerCancel: l,
+      onKeyDown: u,
+      children: ye.map((m, E) => /* @__PURE__ */ w("div", { className: b.stripGroup, children: m.map((v) => /* @__PURE__ */ B(
+        "button",
+        {
+          type: "button",
+          className: K(b.filterTile, v === M && b.filterActive),
+          "data-filter": v,
+          "aria-pressed": v === M,
+          onClick: () => i(v),
+          children: [
+            /* @__PURE__ */ w("span", { className: b.filterThumb, children: a[v] && /* @__PURE__ */ w("img", { src: a[v], alt: "", draggable: !1 }) }),
+            /* @__PURE__ */ w("span", { className: b.filterLabel, children: o(`imageEditor.filter.${v}`) })
+          ]
+        },
+        v
+      )) }, E))
+    }
+  );
+}
+const Gi = [1, 0.75, 0.5, 0.25], bt = (t, e) => Math.max(1, Math.min(e, Math.round(t)));
+function ji({
+  max: t,
+  value: e,
+  locked: n,
+  onLockedChange: i,
+  onInput: o,
+  onChange: r
+}) {
+  const a = re(), s = e, [_, c] = Q({ w: String(s.width), h: String(s.height) });
+  q(() => {
+    c({ w: String(s.width), h: String(s.height) });
+  }, [s.width, s.height]);
+  const d = Math.round(s.width * t.height / t.width) === s.height || Math.round(s.height * t.width / t.height) === s.width ? t.width / t.height : s.width / s.height, T = O(null), f = T.current ?? d, A = (u, R) => {
+    const m = Number(R);
+    if (!R || !Number.isFinite(m) || m <= 0) return null;
+    if (u === "w") {
+      let N = bt(m, t.width);
+      if (!n) return { width: N, height: s.height };
+      const j = bt(N / f, t.height);
+      return j < N / f - 0.5 && (N = bt(j * f, t.width)), { width: N, height: j };
+    }
+    let E = bt(m, t.height);
+    if (!n) return { width: s.width, height: E };
+    const v = bt(E * f, t.width);
+    return v < E * f - 0.5 && (E = bt(v / f, t.height)), { width: v, height: E };
+  }, S = (u) => u.width === t.width && u.height === t.height ? null : u, y = (u, R) => {
+    const m = R.replace(/[^\d]/g, ""), E = A(u, m);
+    c(
+      (v) => E ? {
+        w: u === "w" ? m : String(E.width),
+        h: u === "h" ? m : String(E.height)
+      } : { ...v, [u]: m }
+    ), E && o(S(E));
+  }, x = () => {
+    const u = Number(_.w), R = Number(_.h);
+    let m = s;
+    u > 0 && R > 0 && (m = n ? A("w", _.w) ?? s : { width: bt(u, t.width), height: bt(R, t.height) }), c({ w: String(m.width), h: String(m.height) }), r(S(m));
+  }, l = (u, R) => {
+    if (u.key === "Enter") {
+      u.preventDefault(), x();
+      return;
+    }
+    if (u.key !== "ArrowUp" && u.key !== "ArrowDown") return;
+    u.preventDefault();
+    const m = (u.shiftKey ? 10 : 1) * (u.key === "ArrowUp" ? 1 : -1), E = R === "w" ? s.width : s.height, v = A(R, String(E + m));
+    v && (c({ w: String(v.width), h: String(v.height) }), r(S(v)));
+  }, C = (u) => s.width === Math.max(1, Math.round(t.width * u)) && s.height === Math.max(1, Math.round(t.height * u));
+  return /* @__PURE__ */ B("div", { className: b.resizePanel, "data-part": "resize", children: [
+    /* @__PURE__ */ B("div", { className: b.resizeFields, children: [
+      /* @__PURE__ */ B("label", { className: b.dimField, children: [
+        /* @__PURE__ */ B("span", { className: b.dimLabel, children: [
+          /* @__PURE__ */ w("span", { className: b.dimLabelFull, children: a("imageEditor.width") }),
+          /* @__PURE__ */ w("span", { className: b.dimLabelShort, "aria-hidden": "true", children: a("imageEditor.width").charAt(0) })
+        ] }),
+        /* @__PURE__ */ w(
+          "input",
+          {
+            className: b.dimInput,
+            inputMode: "numeric",
+            value: _.w,
+            "aria-label": a("imageEditor.width"),
+            onChange: (u) => y("w", u.target.value),
+            onBlur: () => {
+              x(), T.current = null;
+            },
+            onKeyDown: (u) => l(u, "w"),
+            onFocus: (u) => {
+              T.current = d, u.target.select();
+            }
+          }
+        ),
+        /* @__PURE__ */ w("span", { className: b.dimUnit, children: "px" })
+      ] }),
+      /* @__PURE__ */ w(
+        "button",
+        {
+          type: "button",
+          className: K(b.lockButton, n && b.lockActive),
+          "aria-pressed": n,
+          "aria-label": a("imageEditor.lockRatio"),
+          title: a("imageEditor.lockRatio"),
+          onClick: () => i(!n),
+          children: /* @__PURE__ */ w(et, { name: n ? "Unlock" : "LockSlash", size: "sm" })
+        }
+      ),
+      /* @__PURE__ */ B("label", { className: b.dimField, children: [
+        /* @__PURE__ */ B("span", { className: b.dimLabel, children: [
+          /* @__PURE__ */ w("span", { className: b.dimLabelFull, children: a("imageEditor.height") }),
+          /* @__PURE__ */ w("span", { className: b.dimLabelShort, "aria-hidden": "true", children: a("imageEditor.height").charAt(0) })
+        ] }),
+        /* @__PURE__ */ w(
+          "input",
+          {
+            className: b.dimInput,
+            inputMode: "numeric",
+            value: _.h,
+            "aria-label": a("imageEditor.height"),
+            onChange: (u) => y("h", u.target.value),
+            onBlur: () => {
+              x(), T.current = null;
+            },
+            onKeyDown: (u) => l(u, "h"),
+            onFocus: (u) => {
+              T.current = d, u.target.select();
+            }
+          }
+        ),
+        /* @__PURE__ */ w("span", { className: b.dimUnit, children: "px" })
+      ] })
+    ] }),
+    /* @__PURE__ */ w(
+      "div",
+      {
+        className: b.tabs,
+        role: "group",
+        "aria-label": a("imageEditor.resize"),
+        "data-part": "tabs",
+        children: Gi.map((u) => /* @__PURE__ */ w(
+          "button",
+          {
+            type: "button",
+            "aria-pressed": C(u),
+            className: K(b.tab, C(u) && b.tabActive),
+            onClick: () => r(
+              S({
+                width: Math.max(1, Math.round(t.width * u)),
+                height: Math.max(1, Math.round(t.height * u))
+              })
+            ),
+            children: u === 1 ? a("imageEditor.original") : `${Math.round(u * 100)}%`
+          },
+          u
+        ))
+      }
+    )
+  ] });
+}
+const qi = "_ruler_j6c34_4", Wi = "_viewport_j6c34_21", Ki = "_value_j6c34_26", Hi = "_track_j6c34_50", Qi = "_tick_j6c34_57", Zi = "_major_j6c34_66", Ji = "_origin_j6c34_73", to = "_indicator_j6c34_78", wt = {
+  ruler: qi,
+  viewport: Wi,
+  value: Ki,
+  track: Hi,
+  tick: Qi,
+  major: Zi,
+  origin: Ji,
+  indicator: to
+}, we = 9;
+function Zt({
+  min: t,
+  max: e,
+  value: n,
+  step: i = 1,
+  keyStep: o = 1,
+  snapPoints: r = [0],
+  snapThreshold: a = (e - t) * 0.02,
+  tickStep: s = (e - t) / 20,
+  majorEvery: _ = 5,
+  resetValue: c = 0,
+  format: M = (S) => String(Math.round(S)),
+  onInput: d,
+  onChange: T,
+  "aria-label": f,
+  className: A
+}) {
+  const S = we / s, y = O(null), x = O(0), l = O(void 0), C = O(n);
+  C.current = n;
+  const u = O(!1), R = O(T);
+  R.current = T;
+  const m = (k) => {
+    u.current = !1, T(k);
+  };
+  q(
+    () => () => {
+      cancelAnimationFrame(x.current), clearTimeout(l.current), u.current && (u.current = !1, R.current(C.current));
+    },
+    []
+  );
+  const E = (k, z = !0) => {
+    let L = Math.min(e, Math.max(t, k));
+    if (L = Math.round(L / i) * i, z) {
+      for (const $ of r)
+        if (Math.abs(L - $) <= a) {
+          L = $;
+          break;
+        }
+    }
+    return Number(L.toFixed(6));
+  }, v = (k) => {
+    k !== C.current && (C.current = k, u.current = !0, d(k));
+  }, N = (k) => {
+    k.button === 0 && (cancelAnimationFrame(x.current), k.currentTarget.setPointerCapture(k.pointerId), y.current = {
+      id: k.pointerId,
+      startX: k.clientX,
+      startValue: n,
+      lastX: k.clientX,
+      lastT: performance.now(),
+      velocity: 0,
+      moved: !1
+    });
+  }, j = (k) => {
+    const z = y.current;
+    if (!z || z.id !== k.pointerId) return;
+    const L = performance.now(), $ = Math.max(1, L - z.lastT);
+    z.velocity = 0.7 * (-(k.clientX - z.lastX) / S / $) + 0.3 * z.velocity, z.lastX = k.clientX, z.lastT = L, Math.abs(k.clientX - z.startX) > 2 && (z.moved = !0), v(E(z.startValue - (k.clientX - z.startX) / S));
+  }, G = (k) => {
+    const z = y.current;
+    if (!z || z.id !== k.pointerId) return;
+    y.current = null;
+    let L = C.current;
+    const $ = (e - t) / 1500;
+    let H = performance.now() - z.lastT < 80 ? Math.max(-$, Math.min($, z.velocity)) : 0;
+    if (!z.moved || Math.abs(H) < $ / 20) return m(E(L));
+    let mt = performance.now();
+    const lt = (xt) => {
+      const J = Math.min(32, Math.max(0, xt - mt));
+      mt = xt, L += H * J, H *= Math.pow(0.99, J);
+      const rt = E(L, Math.abs(H) < $ / 6);
+      if (v(rt), Math.abs(H) < $ / 40 || rt <= t || rt >= e) return m(rt);
+      x.current = requestAnimationFrame(lt);
+    };
+    x.current = requestAnimationFrame(lt);
+  }, W = (k) => {
+    const z = Math.abs(k.deltaX) > Math.abs(k.deltaY) ? k.deltaX : k.deltaY;
+    if (!z) return;
+    const L = E(C.current + z / S / 2);
+    v(L), clearTimeout(l.current), l.current = setTimeout(() => m(C.current), 220);
+  }, V = (k) => {
+    const z = k.shiftKey ? 10 : 1;
+    let L = null;
+    const $ = C.current;
+    if (k.key === "ArrowRight" || k.key === "ArrowUp" ? L = $ + o * z : k.key === "ArrowLeft" || k.key === "ArrowDown" ? L = $ - o * z : k.key === "Home" ? L = t : k.key === "End" && (L = e), L == null) return;
+    k.preventDefault();
+    const H = E(L, !1);
+    v(H), m(H);
+  }, ct = () => {
+    cancelAnimationFrame(x.current);
+    const k = E(c, !1);
+    v(k), m(k);
+  }, Z = Math.floor((e - t) / s), dt = M(n);
+  return /* @__PURE__ */ B(
+    "div",
+    {
+      role: "slider",
+      tabIndex: 0,
+      "aria-label": f,
+      "aria-valuemin": t,
+      "aria-valuemax": e,
+      "aria-valuenow": n,
+      "aria-valuetext": dt,
+      "aria-orientation": "horizontal",
+      className: K(wt.ruler, A),
+      "data-part": "ruler",
+      onPointerDown: N,
+      onPointerMove: j,
+      onPointerUp: G,
+      onPointerCancel: G,
+      onWheel: W,
+      onKeyDown: V,
+      onDoubleClick: ct,
+      children: [
+        /* @__PURE__ */ w("span", { className: wt.value, "aria-hidden": "true", children: dt }),
+        /* @__PURE__ */ B("span", { className: wt.viewport, "aria-hidden": "true", children: [
+          /* @__PURE__ */ w(
+            "span",
+            {
+              className: wt.track,
+              style: {
+                width: Z * we,
+                transform: `translateX(${-(n - t) * S}px)`
+              },
+              children: Array.from({ length: Z + 1 }, (k, z) => {
+                const L = t + z * s;
+                return /* @__PURE__ */ w(
+                  "span",
+                  {
+                    className: K(
+                      wt.tick,
+                      z % _ === 0 && wt.major,
+                      Math.abs(L - c) < 1e-9 && wt.origin
+                    ),
+                    style: { left: z * we }
+                  },
+                  z
+                );
+              })
+            }
+          ),
+          /* @__PURE__ */ w("span", { className: wt.indicator })
+        ] })
+      ]
+    }
+  );
+}
+const Tt = [
+  { id: "crop", icon: "Crop" },
+  { id: "filter", icon: "Colorfilter" },
+  { id: "finetune", icon: "Brush" },
+  { id: "redact", icon: "Blur" },
+  { id: "resize", icon: "Maximize3" }
+], eo = ["blur", "pixelate"], We = [0.05, 0.1, 0.15, 0.2, 0.25, 0.33, 0.5, 0.67, 0.75, 1, 1.5, 2, 3, 4, 6, 8], no = 'a[href]:not([tabindex="-1"]), button:not(:disabled):not([tabindex="-1"]), input:not(:disabled):not([tabindex="-1"]), [tabindex]:not([tabindex="-1"])', ve = Math.PI / 180, go = Ke(function({
+  open: e,
+  src: n,
+  initialState: i,
+  util: o = "crop",
+  cropAspectRatio: r,
+  cropRatioOptions: a,
+  outputType: s,
+  outputQuality: _,
+  onLoad: c,
+  onUpdate: M,
+  onProcess: d,
+  onClose: T,
+  className: f,
+  onKeyDown: A,
+  ...S
+}, y) {
+  const x = re(), [l] = Q(() => new dn()), C = pn(l.subscribe, l.getSnapshot, l.getSnapshot), { state: u, size: R, ui: m, status: E } = C, v = O(null), N = O(null), j = O(null), [G, W] = Q(null), [V, ct] = Q(1), [Z, dt] = Q(!1), [k, z] = Q(!1), L = O(0), $ = O(null), H = O(null), mt = O(null);
+  m.util !== "resize" || !u ? H.current = null : (!H.current || u !== mt.current && u !== H.current) && (H.current = u);
+  const lt = O({ onLoad: c, onUpdate: M });
+  lt.current = { onLoad: c, onUpdate: M }, q(() => {
+    const h = [
+      l.on(
+        "load",
+        (I) => {
+          var U, X;
+          return (X = (U = lt.current).onLoad) == null ? void 0 : X.call(U, I.size);
+        }
+      ),
+      l.on("update", (I) => {
+        var U, X;
+        return (X = (U = lt.current).onUpdate) == null ? void 0 : X.call(U, I);
+      }),
+      // a rotation drag's base is stale once history moves under it
+      ...["undo", "redo", "revert"].map(
+        (I) => l.on(I, () => {
+          $.current = null;
+        })
+      )
+    ];
+    return () => h.forEach((I) => I());
+  }, [l]), q(() => {
+    if (!(!e || !n))
+      return W(null), z(!1), l.open({ src: n, initialState: i, util: o, cropAspectRatio: r, outputType: s, outputQuality: _ }).then(() => {
+        const h = l.getSnapshot().state;
+        h && (L.current = ge(h.rotation).quarter);
+      }).catch(() => {
+      }), () => l.close();
+  }, [e, n, l]), q(() => {
+    if (!e) return;
+    const h = (X) => {
+      (X.ctrlKey || X.metaKey) && X.preventDefault();
+    }, I = (X) => X.preventDefault(), U = ["gesturestart", "gesturechange", "gestureend"];
+    return window.addEventListener("wheel", h, { passive: !1 }), U.forEach((X) => document.addEventListener(X, I)), () => {
+      window.removeEventListener("wheel", h), U.forEach((X) => document.removeEventListener(X, I));
+    };
+  }, [e]), q(() => {
+    if (!e) return;
+    const h = document.activeElement, I = requestAnimationFrame(() => {
+      var U;
+      return (U = N.current) == null ? void 0 : U.focus();
+    });
+    return () => {
+      var U;
+      cancelAnimationFrame(I), (U = h == null ? void 0 : h.focus) == null || U.call(h);
+    };
+  }, [e]);
+  const xt = (h) => {
+    N.current = h, typeof y == "function" ? y(h) : y && (y.current = h);
+  }, J = () => {
+    const h = l.getSnapshot().state;
+    h && (L.current = ge(h.rotation).quarter);
+  }, rt = () => {
+    var h;
+    (h = v.current) == null || h.transition("jump"), l.undo(), J();
+  }, tt = () => {
+    var h;
+    (h = v.current) == null || h.transition("jump"), l.redo(), J();
+  }, qt = () => {
+    var h;
+    (h = v.current) == null || h.transition("jump"), l.revert(), J();
+  }, It = () => {
+    var h;
+    !u || !R || ((h = v.current) == null || h.transition("rotate"), L.current = Ee(L.current - Math.PI / 2), l.setState(kn(u, R)));
+  }, Mt = () => {
+    var h;
+    !u || !R || ((h = v.current) == null || h.transition("flip"), L.current = Ee(-L.current), l.setState(Nn(u, R)));
+  }, Nt = gn(() => T(), [T]), ft = () => {
+    Z || Nt();
+  }, ce = async () => {
+    if (!(!u || Z)) {
+      dt(!0), z(!1);
+      try {
+        const h = await l.process();
+        d == null || d(h), Nt();
+      } catch {
+        z(!0);
+      } finally {
+        dt(!1);
+      }
+    }
+  }, Wt = (h) => {
+    if (A == null || A(h), h.defaultPrevented) return;
+    const I = h.metaKey || h.ctrlKey;
+    if (I && h.key.toLowerCase() === "z") {
+      h.preventDefault(), h.shiftKey ? tt() : rt();
+      return;
+    }
+    if (I && h.key.toLowerCase() === "y") {
+      h.preventDefault(), tt();
+      return;
+    }
+    if (h.key !== "Tab" || !N.current) return;
+    const U = [...N.current.querySelectorAll(no)].filter(
+      (g) => g.offsetParent !== null
+    );
+    if (U.length === 0) return;
+    const X = U[0], At = U[U.length - 1];
+    h.shiftKey && (document.activeElement === X || document.activeElement === N.current) ? (h.preventDefault(), At.focus()) : !h.shiftKey && document.activeElement === At && (h.preventDefault(), X.focus());
+  }, pt = (h) => {
+    const I = V, U = h > 0 ? We.find((X) => X > I * 1.01) ?? Ae : [...We].reverse().find((X) => X < I * 0.99) ?? Ie;
+    W(U);
+  }, Kt = u ? ge(u.rotation, L.current).fine / ve : 0, Pt = (h) => {
+    const I = H.current ?? l.getSnapshot().state;
+    I && (l.preview(Sn(I, h)), mt.current = l.getSnapshot().state);
+  };
+  let gt = null;
+  if (u && R) {
+    if (m.util === "crop")
+      gt = /* @__PURE__ */ B(he, { children: [
+        m.cropTab === "rotation" ? /* @__PURE__ */ w(
+          Zt,
+          {
+            "aria-label": x("imageEditor.rotation"),
+            min: -45,
+            max: 45,
+            step: 0.1,
+            tickStep: 1,
+            majorEvery: 5,
+            snapThreshold: 0.6,
+            value: Number(Kt.toFixed(1)),
+            format: (h) => `${Number(h.toFixed(1))}°`,
+            onInput: (h) => {
+              const I = l.getSnapshot().state;
+              I && ($.current ?? ($.current = I), l.preview(Oe($.current, L.current + h * ve, R)));
+            },
+            onChange: (h) => {
+              const I = $.current ?? l.getSnapshot().state;
+              $.current = null, I && (l.preview(Oe(I, L.current + h * ve, R)), l.commit());
+            }
+          },
+          "rotation"
+        ) : /* @__PURE__ */ w(
+          Zt,
+          {
+            "aria-label": x("imageEditor.scale"),
+            min: 100,
+            max: Bt * 100,
+            step: 1,
+            tickStep: 10,
+            majorEvery: 5,
+            snapPoints: [100],
+            snapThreshold: 4,
+            resetValue: 100,
+            value: Math.round(Jt(u, R) * 100),
+            format: (h) => `${Math.round(h)}%`,
+            onInput: (h) => {
+              const I = l.getSnapshot().state;
+              I && l.preview(Yt(I, h / 100, R));
+            },
+            onChange: (h) => {
+              const I = l.getSnapshot().state;
+              I && (l.preview(Yt(I, h / 100, R)), l.commit());
+            }
+          },
+          "scale"
+        ),
+        /* @__PURE__ */ w(
+          xe,
+          {
+            label: x("imageEditor.crop"),
+            value: m.cropTab,
+            options: [
+              { id: "rotation", label: x("imageEditor.rotation") },
+              { id: "scale", label: x("imageEditor.scale") }
+            ],
+            onChange: (h) => l.setUi({ cropTab: h })
+          }
+        )
+      ] });
+    else if (m.util === "filter" && l.image)
+      gt = /* @__PURE__ */ w(
+        $i,
+        {
+          image: l.image.image,
+          size: R,
+          state: u,
+          onSelect: (h) => l.setState({
+            filter: h === "default" ? null : h,
+            colorMatrix: Ce[h]
+          })
+        }
+      );
+    else if (m.util === "resize")
+      gt = /* @__PURE__ */ w(
+        ji,
+        {
+          max: kt(H.current ?? u),
+          value: Rt(u),
+          locked: m.resizeLocked,
+          onLockedChange: (h) => l.setUi({ resizeLocked: h }),
+          onInput: Pt,
+          onChange: (h) => {
+            Pt(h), l.commit();
+          }
+        }
+      );
+    else if (m.util === "redact") {
+      const h = u.redact;
+      gt = /* @__PURE__ */ B(he, { children: [
+        /* @__PURE__ */ w(
+          Zt,
+          {
+            "aria-label": x(`imageEditor.redact.${h.effect}`),
+            min: 0,
+            max: 100,
+            step: 1,
+            tickStep: 2.5,
+            majorEvery: 4,
+            snapThreshold: 0,
+            value: h.amount,
+            format: (I) => String(Math.round(I)),
+            onInput: (I) => l.preview({ redact: { ...h, amount: I } }),
+            onChange: (I) => {
+              l.preview({ redact: { ...h, amount: I } }), l.commit();
+            }
+          },
+          h.effect
+        ),
+        /* @__PURE__ */ w(
+          xe,
+          {
+            label: x("imageEditor.redact"),
+            value: h.effect,
+            options: eo.map((I) => ({
+              id: I,
+              label: x(`imageEditor.redact.${I}`)
+            })),
+            onChange: (I) => l.setState({ redact: { ...h, effect: I } })
+          }
+        )
+      ] });
+    } else if (m.util === "finetune") {
+      const h = m.finetuneTab;
+      gt = /* @__PURE__ */ B(he, { children: [
+        /* @__PURE__ */ w(
+          Zt,
+          {
+            "aria-label": x(`imageEditor.finetune.${h}`),
+            min: -100,
+            max: 100,
+            step: 1,
+            tickStep: 5,
+            majorEvery: 4,
+            snapThreshold: 3,
+            value: u.finetune[h],
+            format: (I) => String(Math.round(I)),
+            onInput: (I) => {
+              const U = l.getSnapshot().state;
+              U && l.preview({ finetune: { ...U.finetune, [h]: I } });
+            },
+            onChange: (I) => {
+              const U = l.getSnapshot().state;
+              U && (l.preview({ finetune: { ...U.finetune, [h]: I } }), l.commit());
+            }
+          },
+          h
+        ),
+        /* @__PURE__ */ w(
+          xe,
+          {
+            label: x("imageEditor.finetune"),
+            value: h,
+            options: yn.map((I) => ({
+              id: I,
+              label: x(`imageEditor.finetune.${I}`),
+              dot: u.finetune[I] !== 0
+            })),
+            onChange: (I) => l.setUi({ finetuneTab: I })
+          }
+        )
+      ] });
+    }
+  }
+  const zt = E === "ready" && !!u, Ht = zt && m.util !== "crop";
+  return /* @__PURE__ */ w(
+    bn,
+    {
+      open: e,
+      onClose: ft,
+      closeOnBackdrop: !1,
+      dim: 0,
+      className: b.overlay,
+      children: /* @__PURE__ */ B(
+        "div",
+        {
+          ref: xt,
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": x("imageEditor.title"),
+          tabIndex: -1,
+          className: K(b.editor, f),
+          "data-part": "editor",
+          onKeyDown: Wt,
+          ...S,
+          children: [
+            /* @__PURE__ */ w(
+              Ui,
+              {
+                ref: v,
+                core: l,
+                snapshot: C,
+                cropAspectRatio: r,
+                viewZoom: m.util === "crop" ? null : G,
+                onViewZoom: W,
+                onZoomReport: ct,
+                areaRef: j
+              }
+            ),
+            /* @__PURE__ */ B("header", { className: b.header, "data-part": "header", children: [
+              /* @__PURE__ */ w("div", { className: b.headerStart, children: /* @__PURE__ */ B("div", { className: b.group, children: [
+                /* @__PURE__ */ w(
+                  Et,
+                  {
+                    variant: "text",
+                    color: "primary",
+                    size: "sm",
+                    "aria-label": x("imageEditor.close"),
+                    title: x("imageEditor.close"),
+                    onClick: ft,
+                    children: /* @__PURE__ */ w(et, { name: "Close", className: b.closeIcon })
+                  }
+                ),
+                /* @__PURE__ */ w("span", { className: b.groupDivider, "aria-hidden": "true" }),
+                /* @__PURE__ */ w(
+                  Et,
+                  {
+                    variant: "text",
+                    color: "primary",
+                    size: "sm",
+                    "aria-label": x("imageEditor.revert"),
+                    title: x("imageEditor.revert"),
+                    disabled: !C.canRevert,
+                    onClick: qt,
+                    children: /* @__PURE__ */ w(et, { name: "ReverseTimeArrow" })
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ B("div", { className: b.headerCenter, children: [
+                /* @__PURE__ */ B("div", { className: b.group, children: [
+                  /* @__PURE__ */ w(
+                    Et,
+                    {
+                      variant: "text",
+                      color: "primary",
+                      size: "sm",
+                      "aria-label": x("imageEditor.undo"),
+                      title: x("imageEditor.undo"),
+                      disabled: !C.canUndo,
+                      onClick: rt,
+                      children: /* @__PURE__ */ w(et, { name: "UndoArrow" })
+                    }
+                  ),
+                  /* @__PURE__ */ w("span", { className: b.groupDivider, "aria-hidden": "true" }),
+                  /* @__PURE__ */ w(
+                    Et,
+                    {
+                      variant: "text",
+                      color: "primary",
+                      size: "sm",
+                      "aria-label": x("imageEditor.redo"),
+                      title: x("imageEditor.redo"),
+                      disabled: !C.canRedo,
+                      onClick: tt,
+                      children: /* @__PURE__ */ w(et, { name: "RedoArrow" })
+                    }
+                  )
+                ] }),
+                Ht && /* @__PURE__ */ B("div", { className: K(b.group, b.fadeIn), children: [
+                  /* @__PURE__ */ w(
+                    Et,
+                    {
+                      variant: "text",
+                      color: "primary",
+                      size: "sm",
+                      "aria-label": x("imageEditor.zoomOut"),
+                      title: x("imageEditor.zoomOut"),
+                      disabled: V <= Ie * 1.01,
+                      onClick: () => pt(-1),
+                      children: /* @__PURE__ */ w(et, { name: "Minus" })
+                    }
+                  ),
+                  /* @__PURE__ */ w("span", { className: b.groupDivider, "aria-hidden": "true" }),
+                  /* @__PURE__ */ B(
+                    "button",
+                    {
+                      type: "button",
+                      className: b.zoomLabel,
+                      "aria-label": x("imageEditor.zoom"),
+                      title: x("imageEditor.zoomFit"),
+                      onClick: () => W(null),
+                      children: [
+                        Math.round(V * 100),
+                        "%"
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ w("span", { className: b.groupDivider, "aria-hidden": "true" }),
+                  /* @__PURE__ */ w(
+                    Et,
+                    {
+                      variant: "text",
+                      color: "primary",
+                      size: "sm",
+                      "aria-label": x("imageEditor.zoomIn"),
+                      title: x("imageEditor.zoomIn"),
+                      disabled: V >= Ae * 0.99,
+                      onClick: () => pt(1),
+                      children: /* @__PURE__ */ w(et, { name: "Add" })
+                    }
+                  )
+                ] })
+              ] }),
+              /* @__PURE__ */ w("div", { className: b.headerEnd, children: /* @__PURE__ */ w(
+                Et,
+                {
+                  variant: "contained",
+                  color: "accent",
+                  size: "sm",
+                  loading: Z,
+                  disabled: !zt,
+                  "aria-label": x("imageEditor.done"),
+                  title: x("imageEditor.done"),
+                  onClick: ce,
+                  className: b.done,
+                  children: /* @__PURE__ */ w(et, { name: "CheckMarkTick" })
+                }
+              ) })
+            ] }),
+            /* @__PURE__ */ B("div", { className: b.main, "data-part": "main", children: [
+              /* @__PURE__ */ w("nav", { className: b.nav, "data-part": "nav", children: /* @__PURE__ */ w(
+                "div",
+                {
+                  role: "tablist",
+                  "aria-label": x("imageEditor.tools"),
+                  "aria-orientation": "vertical",
+                  className: b.navList,
+                  onKeyDown: (h) => {
+                    var X;
+                    const I = Tt.findIndex((At) => At.id === m.util), U = h.key === "ArrowDown" || h.key === "ArrowRight" ? Tt[(I + 1) % Tt.length] : h.key === "ArrowUp" || h.key === "ArrowLeft" ? Tt[(I + Tt.length - 1) % Tt.length] : null;
+                    U && (h.preventDefault(), l.setUi({ util: U.id }), (X = h.currentTarget.querySelector(`[data-util="${U.id}"]`)) == null || X.focus());
+                  },
+                  children: Tt.map((h) => {
+                    const I = m.util === h.id;
+                    return /* @__PURE__ */ B(
+                      "button",
+                      {
+                        type: "button",
+                        role: "tab",
+                        id: `tz-ie-tab-${h.id}`,
+                        "aria-selected": I,
+                        "aria-controls": "tz-ie-panel",
+                        tabIndex: I ? 0 : -1,
+                        title: x(`imageEditor.${h.id}`),
+                        className: K(b.tool, I && b.toolActive),
+                        "data-util": h.id,
+                        onClick: () => l.setUi({ util: h.id }),
+                        children: [
+                          /* @__PURE__ */ w(et, { name: h.icon, size: "sm" }),
+                          /* @__PURE__ */ w("span", { className: b.toolLabel, children: x(`imageEditor.${h.id}`) })
+                        ]
+                      },
+                      h.id
+                    );
+                  })
+                }
+              ) }),
+              /* @__PURE__ */ B(
+                "section",
+                {
+                  className: b.stage,
+                  id: "tz-ie-panel",
+                  role: "tabpanel",
+                  "aria-labelledby": `tz-ie-tab-${m.util}`,
+                  "data-part": "stage",
+                  "data-util": m.util,
+                  children: [
+                    /* @__PURE__ */ w("div", { className: b.toolbar, "data-part": "toolbar", children: zt && m.util === "crop" && /* @__PURE__ */ B("div", { className: K(b.toolbarRow, b.fadeIn), children: [
+                      /* @__PURE__ */ w(
+                        Me,
+                        {
+                          variant: "text",
+                          color: "primary",
+                          size: "sm",
+                          startIcon: /* @__PURE__ */ w(et, { name: "RotateLeft" }),
+                          title: x("imageEditor.rotateLeft"),
+                          "aria-label": x("imageEditor.rotateLeft"),
+                          onClick: It,
+                          className: b.toolbarIconOnPhone,
+                          children: /* @__PURE__ */ w("span", { className: b.toolbarLabel, children: x("imageEditor.rotateLeft") })
+                        }
+                      ),
+                      /* @__PURE__ */ w(
+                        Me,
+                        {
+                          variant: "text",
+                          color: "primary",
+                          size: "sm",
+                          startIcon: /* @__PURE__ */ w(et, { name: "FlipHorizontal" }),
+                          title: x("imageEditor.flipHorizontal"),
+                          "aria-label": x("imageEditor.flipHorizontal"),
+                          onClick: Mt,
+                          className: b.toolbarIconOnPhone,
+                          children: /* @__PURE__ */ w("span", { className: b.toolbarLabel, children: x("imageEditor.flipHorizontal") })
+                        }
+                      ),
+                      !r && u && /* @__PURE__ */ w(
+                        Bi,
+                        {
+                          ratio: u.cropRatio,
+                          options: a ?? Oi,
+                          onChange: (h) => {
+                            var U;
+                            const I = l.getSnapshot().state;
+                            !I || !R || ((U = v.current) == null || U.transition("jump"), l.setState(zn(I, h, R)));
+                          }
+                        }
+                      )
+                    ] }, "crop-toolbar") }),
+                    /* @__PURE__ */ B("div", { ref: j, className: b.canvasArea, "data-part": "area", children: [
+                      E === "loading" && /* @__PURE__ */ B("div", { className: b.status, role: "status", children: [
+                        /* @__PURE__ */ w(_n, { size: "lg" }),
+                        /* @__PURE__ */ w("span", { children: x("imageEditor.loading") })
+                      ] }),
+                      E === "error" && /* @__PURE__ */ B("div", { className: b.status, role: "alert", children: [
+                        /* @__PURE__ */ w(et, { name: "Gallery", size: "lg" }),
+                        /* @__PURE__ */ w("span", { children: x("imageEditor.loadError") })
+                      ] }),
+                      k && /* @__PURE__ */ w("div", { className: b.toastError, role: "alert", children: x("imageEditor.processError") })
+                    ] }),
+                    /* @__PURE__ */ w("div", { className: b.footer, "data-part": "footer", children: /* @__PURE__ */ w("div", { className: K(b.footerInner, b.fadeIn), children: gt }, m.util) })
+                  ]
+                }
+              )
+            ] })
+          ]
+        }
+      )
+    }
+  );
+});
+function xe({
+  label: t,
+  value: e,
+  options: n,
+  onChange: i
+}) {
+  const o = O(null);
+  return q(() => {
+    var r, a, s;
+    (s = (a = (r = o.current) == null ? void 0 : r.querySelector(`[data-tab="${e}"]`)) == null ? void 0 : a.scrollIntoView) == null || s.call(a, { block: "nearest", inline: "nearest", behavior: "smooth" });
+  }, [e]), /* @__PURE__ */ w(
+    "div",
+    {
+      ref: o,
+      role: "tablist",
+      "aria-label": t,
+      className: b.tabs,
+      "data-part": "tabs",
+      onKeyDown: (r) => {
+        var c;
+        const a = n.findIndex((M) => M.id === e), s = r.key === "ArrowRight" ? 1 : r.key === "ArrowLeft" ? -1 : 0;
+        if (!s) return;
+        r.preventDefault();
+        const _ = n[(a + s + n.length) % n.length];
+        i(_.id), (c = r.currentTarget.querySelector(`[data-tab="${_.id}"]`)) == null || c.focus();
+      },
+      children: n.map((r) => /* @__PURE__ */ B(
+        "button",
+        {
+          type: "button",
+          role: "tab",
+          "aria-selected": r.id === e,
+          tabIndex: r.id === e ? 0 : -1,
+          className: K(b.tab, r.id === e && b.tabActive),
+          "data-tab": r.id,
+          onClick: () => i(r.id),
+          children: [
+            r.label,
+            r.dot && /* @__PURE__ */ w("span", { className: b.tabDot, "aria-hidden": "true" })
+          ]
+        },
+        r.id
+      ))
+    }
+  );
+}
+export {
+  Ce as F,
+  go as I,
+  dn as a,
+  po as c
+};
+//# sourceMappingURL=ImageEditor-DTFQZ6ON.js.map