@beeintel/batch-image 0.0.0-stage → 1.0.1

package/dist/chunks/BatchMaterials-niGKrga3.js

@@ -0,0 +1,806 @@
+import { defineComponent as we, ref as pe, watch as U, onBeforeUnmount as xe, openBlock as ee, createElementBlock as ye, withModifiers as Be, normalizeStyle as De, Fragment as Te, renderList as Ae, createElementVNode as Fe, toDisplayString as ze, createCommentVNode as Ie, nextTick as We, computed as He, onMounted as Ne, createBlock as qe } from "vue";
+import { D as Xe, E as _e } from "./entry-DK9FjQZ_.js";
+const V = {
+  regular: {
+    refractionCssPx: 9,
+    edgeWidthCssPx: 20,
+    transmission: 0.25,
+    blurCssPx: 5,
+    highlight: 0.075
+  }
+};
+function Ke(n, i, r) {
+  return {
+    ...n,
+    transmission: Math.min(n.transmission, r, i ? 0.32 : 0.38)
+  };
+}
+function W(n, i, r) {
+  return Math.min(r, Math.max(i, Number.isFinite(n) ? n : i));
+}
+function Oe(n, i, r, o = n === "toolbar-clear" ? 0.38 : 0.16, f = {
+  cssWidth: 0,
+  cssHeight: 0,
+  radiusCssPx: 0
+}) {
+  const a = W((i.meanLuminance + i.localLuminance) / 2, 0, 1), s = W(i.edgeDensity, 0, 1), c = W(i.textDensity, 0, 1), h = i.dark, u = n === "toolbar-clear", b = u ? Math.min(o, h ? 0.32 : 0.38) : Math.min(o, 0.16), d = r.refractionCssPx === V.regular.refractionCssPx && r.edgeWidthCssPx === V.regular.edgeWidthCssPx, y = u ? 1 : 1 - Math.max(0, c - 0.6) * 0.35, g = W(
+    Math.min(r.transmission, b * y),
+    0,
+    b
+  ), v = W(
+    u && d ? r.refractionCssPx * (1 + s * 0.28) : r.refractionCssPx,
+    0,
+    24
+  ), w = W(
+    u && d ? r.blurCssPx * (0.8 + a * 0.2) : r.blurCssPx,
+    0,
+    12
+  ), L = W(
+    u && d ? r.highlight * (1.15 + s * 0.35) : r.highlight,
+    0,
+    0.12
+  ), T = {
+    refractionCssPx: v,
+    edgeWidthCssPx: W(
+      u && d ? r.edgeWidthCssPx * 0.88 : r.edgeWidthCssPx,
+      4,
+      48
+    ),
+    transmission: g,
+    blurCssPx: w,
+    highlight: L
+  };
+  return {
+    ...f,
+    role: n,
+    dark: h,
+    environment: i,
+    params: T,
+    material: T,
+    cssWidth: f.cssWidth,
+    cssHeight: f.cssHeight,
+    radiusCssPx: f.radiusCssPx
+  };
+}
+function Ee(n) {
+  return n.closest("[data-batch-theme]") ?? document.documentElement;
+}
+const Z = ".lc-result, .basic-preview-overlay, .brand-mark-draft-layer, .resize-draft-preview, .shadow-draft-preview", j = 2048, $e = 4e6;
+function te(n) {
+  const i = n.getBoundingClientRect();
+  return {
+    x: i.left,
+    y: i.top,
+    width: Math.max(0, i.width),
+    height: Math.max(0, i.height)
+  };
+}
+function Ue(n, i) {
+  const r = i.map(te).filter((u) => u.width > 0 && u.height > 0), o = te(n), f = r.length ? r : [o], a = Math.min(...f.map((u) => u.x)), s = Math.min(...f.map((u) => u.y)), c = Math.max(...f.map((u) => u.x + u.width)), h = Math.max(...f.map((u) => u.y + u.height));
+  return {
+    x: a,
+    y: s,
+    width: Math.max(1, c - a),
+    height: Math.max(1, h - s)
+  };
+}
+function Ve(n, i, r, o) {
+  const f = getComputedStyle(i), a = f.backgroundColor || "#151515";
+  if (n.fillStyle = a, n.fillRect(o.x - r.x, o.y - r.y, o.width, o.height), !i.matches(".lc-bg-checker")) {
+    if (f.backgroundImage !== "none" && f.backgroundImage)
+      throw new Error("background-unavailable");
+    return;
+  }
+  const s = Number.parseFloat(f.backgroundSize) / 2;
+  if (!Number.isFinite(s) || s < 1) throw new Error("background-unavailable");
+  const c = f.backgroundImage.match(/rgba?\([^)]*\)/);
+  if (!c) throw new Error("background-unavailable");
+  n.fillStyle = c[0];
+  const h = Math.floor((o.x - r.x) / s), u = Math.floor((o.y - r.y) / s);
+  for (let b = u; r.y + b * s < o.y + o.height; b++)
+    for (let d = h; r.x + d * s < o.x + o.width; d++)
+      (d + b) % 2 !== 0 && n.fillRect(
+        r.x + d * s - r.x,
+        r.y + b * s - r.y,
+        s,
+        s
+      );
+}
+function Ge(n, i, r) {
+  if (!i.complete || !i.naturalWidth || !i.currentSrc) return;
+  const o = i.getBoundingClientRect();
+  if (o.right <= r.x || o.left >= r.x + r.width || o.bottom <= r.y || o.top >= r.y + r.height)
+    return;
+  const f = i.closest(".lc-image-viewport, .card-media"), a = f?.getBoundingClientRect() ?? o, s = i.closest(".lc-scroll")?.getBoundingClientRect() ?? a, c = Math.max(o.left, a.left, s.left, r.x), h = Math.max(o.top, a.top, s.top, r.y), u = Math.min(
+    o.right,
+    a.right,
+    s.right,
+    r.x + r.width
+  ), b = Math.min(
+    o.bottom,
+    a.bottom,
+    s.bottom,
+    r.y + r.height
+  );
+  if (u <= c || b <= h) return;
+  n.save(), n.beginPath(), n.rect(c - r.x, h - r.y, u - c, b - h), n.clip(), f && Ve(n, f, r, {
+    x: c,
+    y: h,
+    width: u - c,
+    height: b - h
+  });
+  const d = getComputedStyle(i).objectFit, y = d === "contain" ? Math.min(o.width / i.naturalWidth, o.height / i.naturalHeight) : d === "cover" ? Math.max(o.width / i.naturalWidth, o.height / i.naturalHeight) : null, g = y === null ? o.width : i.naturalWidth * y, v = y === null ? o.height : i.naturalHeight * y;
+  n.drawImage(
+    i,
+    o.left - r.x + (o.width - g) / 2,
+    o.top - r.y + (o.height - v) / 2,
+    g,
+    v
+  ), n.restore();
+}
+function Ye(n, i) {
+  if (!n.getContext("2d") || n.width < 1 || n.height < 1)
+    return {
+      meanLuminance: 0.5,
+      localLuminance: 0.5,
+      edgeDensity: 0,
+      textDensity: 0,
+      dark: i,
+      pressStrength: 0
+    };
+  const o = Math.min(64, n.width), f = Math.min(64, n.height), a = document.createElement("canvas");
+  a.width = o, a.height = f;
+  const s = a.getContext("2d");
+  if (!s)
+    return {
+      meanLuminance: 0.5,
+      localLuminance: 0.5,
+      edgeDensity: 0,
+      textDensity: 0,
+      dark: i,
+      pressStrength: 0
+    };
+  s.drawImage(n, 0, 0, o, f);
+  const c = s.getImageData(0, 0, o, f).data;
+  let h = 0, u = 0, b = 0;
+  for (let w = 0; w < c.length; w += 4) {
+    const L = (c[w] * 0.2126 + c[w + 1] * 0.7152 + c[w + 2] * 0.0722) / 255;
+    h += L, w > 0 && Math.abs(L - b) > 0.12 && u++, b = L;
+  }
+  const d = Math.max(1, c.length / 4), y = h / d, g = (Math.floor(f / 2) * o + Math.floor(o / 2)) * 4, v = (c[g] * 0.2126 + c[g + 1] * 0.7152 + c[g + 2] * 0.0722) / 255;
+  return {
+    meanLuminance: y,
+    localLuminance: v,
+    edgeDensity: u / d,
+    textDensity: 0,
+    dark: i,
+    pressStrength: 0
+  };
+}
+function Je(n, i, r = 0) {
+  const o = n.querySelector(".focus-surface");
+  if (o?.querySelector(Z)) throw new Error("complex-preview");
+  const f = i.filter(({ element: g }) => {
+    const v = g.getBoundingClientRect(), w = getComputedStyle(g);
+    return v.width > 0 && v.height > 0 && w.display !== "none" && w.visibility !== "hidden";
+  });
+  if (!f.length) throw new Error("offscreen");
+  const a = Ue(
+    n,
+    f.map(({ element: g }) => g)
+  ), s = Math.min(
+    1.5,
+    typeof devicePixelRatio == "number" && devicePixelRatio > 0 ? devicePixelRatio : 1,
+    j / Math.max(a.width, a.height, 1)
+  ), c = document.createElement("canvas");
+  for (c.width = Math.max(1, Math.min(j, Math.round(a.width * s))), c.height = Math.max(1, Math.min(j, Math.round(a.height * s))); c.width * c.height > $e; )
+    c.width = Math.max(1, Math.floor(c.width * 0.9)), c.height = Math.max(1, Math.floor(c.height * 0.9));
+  const h = c.getContext("2d");
+  if (!h) throw new Error("background-unavailable");
+  h.scale(c.width / a.width, c.height / a.height);
+  const u = getComputedStyle(f[0].element).getPropertyValue("--panel").trim() || "#151515";
+  h.fillStyle = u, h.fillRect(0, 0, a.width, a.height), (o ? o.querySelectorAll("img.lc-source") : n.querySelectorAll(".card-media img")).forEach((g) => Ge(h, g, a));
+  const d = f.map(({ key: g, role: v, element: w }) => {
+    const L = te(w), T = w.matches(Z) || !!w.querySelector(Z);
+    return {
+      key: g,
+      role: v,
+      element: w,
+      rect: L,
+      fallbackReason: T ? "complex-preview" : void 0,
+      uv: {
+        x: (L.x - a.x) / a.width,
+        y: (L.y - a.y) / a.height,
+        width: L.width / a.width,
+        height: L.height / a.height
+      }
+    };
+  }), y = Ee(n).dataset.batchTheme === "dark";
+  return {
+    canvas: c,
+    sourceRevision: r,
+    viewport: a,
+    pixelRatio: c.width / a.width,
+    surfaces: d,
+    environment: Ye(c, y)
+  };
+}
+const be = [
+  {
+    key: "toolbar",
+    selector: ".view-controls:not([data-material-static])",
+    role: "toolbar-clear",
+    transmission: 0.38,
+    portal: !1
+  },
+  {
+    key: "filmstrip",
+    selector: ".filmstrip",
+    role: "content-regular",
+    transmission: 0.12,
+    portal: !1
+  },
+  {
+    key: "task-popover",
+    selector: ".task-popover",
+    role: "content-regular",
+    transmission: 0.16,
+    portal: !0
+  },
+  {
+    key: "task-drawer",
+    selector: ".task-drawer:not([data-material-static])",
+    role: "content-regular",
+    transmission: 0.12,
+    portal: !1
+  },
+  {
+    key: "shortcut-help",
+    selector: ".shortcut-help",
+    role: "content-regular",
+    transmission: 0.12,
+    portal: !0
+  },
+  {
+    key: "import-dialog",
+    selector: ".import-modal:not([data-material-static])",
+    role: "content-regular",
+    transmission: 0.12,
+    portal: !1
+  },
+  {
+    key: "export-dialog",
+    selector: ".compression-dialog:not([data-material-static])",
+    role: "content-regular",
+    transmission: 0.12,
+    portal: !1
+  },
+  {
+    key: "file-tooltip",
+    selector: ".file-tooltip",
+    role: "content-regular",
+    transmission: 0.16,
+    portal: !1
+  },
+  {
+    key: "image-menu",
+    selector: ".material-image-menu",
+    role: "content-regular",
+    transmission: 0.16,
+    portal: !1
+  }
+], ve = async (n, i) => (await import("./gpu-CScw5MNG.js")).createGpuMaterialSession(n, i);
+function Ze(n, i) {
+  if (i === "toolbar-clear") return 0.08;
+  const r = n.getBoundingClientRect(), o = Math.max(1, r.width * r.height), f = n.textContent?.trim().length ?? 0, a = Math.min(1, f / 240);
+  return Math.min(0.82, Math.max(0.12, a * 0.5 + 1800 / o));
+}
+function Q(n, i, r, o) {
+  return r.opaque ? { effective: "solid", reason: "display-preference" } : r.forced ? { effective: "solid", reason: "forced-colors" } : n === "solid" ? { effective: "solid", reason: null } : r.busy ? {
+    effective: i ? "frost" : "solid",
+    reason: "busy"
+  } : o ? {
+    effective: i ? "frost" : "solid",
+    reason: "hidden"
+  } : i ? { effective: "frost", reason: null } : { effective: "solid", reason: "no-backdrop-filter" };
+}
+function je(n, i, r = ve) {
+  const o = Ee(n), f = o === document.documentElement ? document.body : o, a = /* @__PURE__ */ new Map(), s = /* @__PURE__ */ new Map(), c = /* @__PURE__ */ new Map(), h = CSS.supports("backdrop-filter", "blur(1px)") || CSS.supports("-webkit-backdrop-filter", "blur(1px)");
+  let u = "gpu", b = "none", d = V.regular, y = { busy: !1, reduced: !1, opaque: !1 }, g = !1, v = 0, w = 0, L = 0, T = 0, z = 0, q = !1, l = !1, k = !0, x = null, P, I, B, X, G = new AbortController();
+  function ne() {
+    X?.close(), X = void 0, B = void 0;
+  }
+  function A() {
+    v++, G.abort(), G = new AbortController(), P?.dispose(), P = void 0, I = void 0, ne();
+    for (const { canvas: e } of a.values()) e.hidden = !0;
+  }
+  function re(e, t) {
+    g || i({
+      requested: u,
+      effective: e,
+      reason: t,
+      surfaces: a.size,
+      paints: T
+    });
+  }
+  function F(e) {
+    const t = Q(u, h, y, document.hidden);
+    for (const [m, { canvas: p }] of a)
+      m.dataset.material = t.effective, p.hidden = !0;
+    re(t.effective, e ?? t.reason);
+  }
+  function Y(e, t) {
+    const m = o.dataset.batchTheme === "dark", p = Ke(d, m, t);
+    e.style.setProperty("--material-panel", `${(1 - p.transmission) * 100}%`), e.style.setProperty("--material-blur", `${p.blurCssPx}px`), e.style.setProperty("--material-highlight", `${p.highlight}`);
+  }
+  function ae(e) {
+    delete e.dataset.material, delete e.dataset.materialSurface, delete e.dataset.materialReason;
+    for (const t of ["--material-panel", "--material-blur", "--material-highlight"])
+      e.style.removeProperty(t);
+  }
+  function ke() {
+    const e = be.flatMap((t) => {
+      const m = t.portal ? f.querySelector(t.selector) : n.querySelector(t.selector);
+      return m && _(m) ? [{ host: m, surface: t }] : [];
+    });
+    for (const [t, m] of a)
+      e.some((p) => p.host === t) || (P?.release(m.canvas), m.canvas.remove(), ae(t), O.unobserve(t), K(t), a.delete(t), k = !0);
+    for (const { host: t, surface: m } of e) {
+      if (a.has(t)) continue;
+      const p = document.createElement("canvas");
+      p.className = "ui-material-layer", p.setAttribute("aria-hidden", "true"), p.hidden = !0, t.dataset.materialSurface = m.key, t.dataset.material = Q(
+        u,
+        h,
+        y,
+        document.hidden
+      ).effective, Y(t, m.transmission), t.prepend(p), a.set(t, { ...m, canvas: p }), O.observe(t), k = !0;
+    }
+  }
+  function _(e) {
+    if (e.closest('[data-material-docked="true"], [inert], [aria-hidden="true"], [hidden]'))
+      return !1;
+    for (let m = e; m; m = m.parentElement) {
+      const p = getComputedStyle(m);
+      if (p.display === "none" || p.visibility === "hidden" || p.visibility === "collapse" || p.opacity === "0")
+        return !1;
+    }
+    const t = e.getBoundingClientRect();
+    return e.isConnected && t.width > 0 && t.height > 0 && t.bottom > 0 && t.top < innerHeight && t.right > 0 && t.left < innerWidth;
+  }
+  function oe(e) {
+    g || (x = e, A(), F(e));
+  }
+  async function Me(e) {
+    if (!I) {
+      const t = b === "none" || b === "unsupported" ? void 0 : b, m = G.signal, p = r((R) => {
+        !g && e === v && oe(R);
+      }, t).then((R) => {
+        if (g || e !== v)
+          throw R.dispose(), new Error("stale");
+        return P = R, R;
+      });
+      I = new Promise((R, H) => {
+        const N = () => {
+          clearTimeout(S), m.removeEventListener("abort", E);
+        }, E = () => {
+          N(), H(new Error("stale"));
+        }, S = setTimeout(() => {
+          N(), H(new Error("init-timeout"));
+        }, 5e3);
+        m.addEventListener("abort", E, { once: !0 }), p.then(
+          (M) => {
+            N(), R(M);
+          },
+          (M) => {
+            N(), H(M);
+          }
+        );
+      });
+    }
+    return I;
+  }
+  function Ce(e, t) {
+    if (y.reduced) return { ...t, pointer: void 0, pressStrength: 0 };
+    const m = s.get(e);
+    return m ? { ...t, pointer: m, pressStrength: m.strength } : t;
+  }
+  async function Se() {
+    if (z = 0, !g) {
+      if (q) {
+        l = !0;
+        return;
+      }
+      q = !0, l = !1;
+      try {
+        ke();
+        const e = Q(u, h, y, document.hidden);
+        if (u !== "gpu" || e.reason || x)
+          A(), F(x ?? void 0);
+        else {
+          const t = v, m = w;
+          try {
+            if (b === "unsupported") {
+              x = "unsupported", A(), F(x);
+              return;
+            }
+            if (r === ve && (typeof window > "u" || !window.navigator.gpu || typeof window.createImageBitmap != "function")) {
+              x = "unsupported", A(), F(x);
+              return;
+            }
+            const p = be.flatMap(
+              (E) => [...a.entries()].filter(([, S]) => S.key === E.key)
+            ).filter(([E]) => _(E)).map(([E, S]) => ({
+              key: S.key,
+              role: S.role,
+              element: E
+            }));
+            if (k || !B) {
+              L++, ne();
+              try {
+                B = Je(n, p, L);
+              } catch (E) {
+                for (const [, S] of a)
+                  P?.release(S.canvas), S.canvas.hidden = !0, S.canvas.parentElement?.setAttribute(
+                    "data-material-reason",
+                    E instanceof Error ? E.message : "background-unavailable"
+                  );
+                F(E instanceof Error ? E.message : "background-unavailable");
+                return;
+              }
+              k = !1;
+            }
+            if (!B) throw new Error("background-unavailable");
+            const R = /* @__PURE__ */ new Map();
+            for (const [E, S] of a) {
+              const M = B.surfaces.find(
+                (D) => D.key === S.key
+              );
+              M && !M.fallbackReason && _(E) || (S.canvas.hidden = !0, P?.release(S.canvas), E.dataset.material = e.effective, M?.fallbackReason && (R.set(S.key, M.fallbackReason), E.dataset.materialReason = M.fallbackReason));
+            }
+            if (!X) {
+              const E = await window.createImageBitmap(B.canvas);
+              if (g || t !== v || m !== w) {
+                E.close();
+                return;
+              }
+              X = E;
+            }
+            const H = await Me(t);
+            let N = 0;
+            for (const E of B.surfaces) {
+              const S = [...a.entries()].find(
+                ([, Pe]) => Pe.key === E.key
+              );
+              if (!S) continue;
+              const [M, D] = S;
+              if (R.get(E.key)) continue;
+              if (g || t !== v || m !== w) return;
+              if (!_(M)) {
+                D.canvas.hidden = !0, H.release(D.canvas);
+                continue;
+              }
+              const he = Ce(M, B.environment), Re = {
+                meanLuminance: B.environment.meanLuminance,
+                localLuminance: B.environment.localLuminance,
+                edgeDensity: B.environment.edgeDensity,
+                textDensity: Ze(M, D.role),
+                dark: B.environment.dark,
+                pressStrength: he.pressStrength,
+                pointer: he.pointer
+              }, ge = M.getBoundingClientRect(), Le = Oe(
+                D.role,
+                Re,
+                d,
+                D.transmission,
+                {
+                  key: D.key,
+                  sceneRect: E.rect,
+                  sceneUV: E.uv,
+                  cssWidth: ge.width,
+                  cssHeight: ge.height,
+                  radiusCssPx: Number.parseFloat(getComputedStyle(M).borderRadius) || 0
+                }
+              ), J = await H.paint(D.canvas, X, Le);
+              if (g || t !== v || m !== w) return;
+              if (!_(M)) {
+                D.canvas.hidden = !0, H.release(D.canvas);
+                continue;
+              }
+              if (J.kind === "local-fallback") {
+                D.canvas.hidden = !0, M.dataset.material = e.effective, M.dataset.materialReason = J.reason, R.set(D.key, J.reason);
+                continue;
+              }
+              D.canvas.hidden = !1, M.dataset.material = "gpu", delete M.dataset.materialReason, T++, N++;
+            }
+            !g && t === v && m === w && re(N ? "gpu" : e.effective, R.values().next().value ?? null);
+          } catch (p) {
+            if (!g && t === v) {
+              const R = p instanceof Error && "reason" in p && typeof p.reason == "string" ? p.reason : p instanceof Error ? p.message : "render-failed";
+              oe(R);
+            }
+          }
+        }
+      } finally {
+        q = !1, l && !g && C(!0);
+      }
+    }
+  }
+  function C(e = !0) {
+    w++, k ||= e, !g && !z && (z = requestAnimationFrame(() => {
+      Se();
+    }));
+  }
+  function ie() {
+    A(), F(), C(!0);
+  }
+  const O = new ResizeObserver(() => C(!0)), se = new MutationObserver((e) => {
+    e.some((t) => !(!(t.target instanceof Element) || t.target.matches(".ui-material-layer") || t.type === "attributes" && t.attributeName === "style" && t.target.matches("[data-material-surface]"))) && C(!0);
+  });
+  se.observe(n, {
+    subtree: !0,
+    childList: !0,
+    attributes: !0,
+    attributeFilter: [
+      "src",
+      "style",
+      "class",
+      "hidden",
+      "inert",
+      "aria-hidden",
+      "data-material-docked"
+    ]
+  });
+  const ce = new MutationObserver(() => C(!0));
+  ce.observe(f, { childList: !0 });
+  const le = new MutationObserver(() => {
+    for (const [e, t] of a) Y(e, t.transmission);
+    A(), F(), C(!0);
+  });
+  le.observe(o, {
+    attributes: !0,
+    attributeFilter: ["data-batch-theme"]
+  }), O.observe(n), n.dataset.materials = "true";
+  const ue = [
+    "pointerover",
+    "pointermove",
+    "pointerout",
+    "focusin",
+    "focusout",
+    "pointerdown",
+    "pointerup"
+  ];
+  function K(e) {
+    s.delete(e);
+    const t = c.get(e);
+    t !== void 0 && clearTimeout(t), c.delete(e);
+  }
+  function $(e) {
+    if (!(e.target instanceof Element)) return;
+    const t = e.target.closest("[data-material-surface]");
+    if (!t) {
+      (e.type === "focusin" || e.type === "focusout") && C(!0);
+      return;
+    }
+    if (y.reduced) {
+      K(t);
+      return;
+    }
+    if (e.type === "pointerout" && e instanceof PointerEvent) {
+      const m = e.relatedTarget;
+      if (m instanceof Node && t.contains(m)) return;
+      K(t), C(!1);
+      return;
+    }
+    if (e instanceof PointerEvent) {
+      const m = t.getBoundingClientRect(), p = e.type === "pointerdown" ? 1 : e.type === "pointerup" ? 0.25 : 0.65;
+      if (s.set(t, {
+        x: Math.max(0, Math.min(1, (e.clientX - m.left) / Math.max(1, m.width))),
+        y: Math.max(0, Math.min(1, (e.clientY - m.top) / Math.max(1, m.height))),
+        strength: p
+      }), e.type === "pointerup") {
+        const R = c.get(t);
+        R !== void 0 && clearTimeout(R), c.set(
+          t,
+          setTimeout(() => {
+            K(t), C(!1);
+          }, 180)
+        );
+      }
+    }
+    C(e.type === "focusin" || e.type === "focusout");
+  }
+  ue.forEach((e) => {
+    n.addEventListener(e, $, !0), document.addEventListener(e, $, !0);
+  });
+  const de = () => C(!0), fe = () => C(!0), me = () => C(!0);
+  return n.addEventListener("load", de, !0), n.addEventListener("scroll", fe, !0), window.addEventListener("resize", me), document.addEventListener("visibilitychange", ie), C(!0), {
+    setMode(e) {
+      u = e, x = null, A(), F(), C(!0);
+    },
+    setParams(e) {
+      d = e;
+      for (const [t, m] of a) Y(t, m.transmission);
+      C(!1);
+    },
+    setFault(e) {
+      b = e, x = null, A(), F(), C(!0);
+    },
+    setPolicy(e) {
+      if (JSON.stringify(y) !== JSON.stringify(e)) {
+        if (y = e, y.reduced)
+          for (const t of s.keys()) K(t);
+        A(), F(), C(!0);
+      }
+    },
+    loseDevice() {
+      P?.loseDevice();
+    },
+    dispose() {
+      if (!g) {
+        g = !0, A(), cancelAnimationFrame(z), O.disconnect(), se.disconnect(), ce.disconnect(), le.disconnect(), ue.forEach((e) => {
+          n.removeEventListener(e, $, !0), document.removeEventListener(e, $, !0);
+        }), n.removeEventListener("load", de, !0), n.removeEventListener("scroll", fe, !0), window.removeEventListener("resize", me), document.removeEventListener("visibilitychange", ie);
+        for (const [e, t] of a)
+          t.canvas.remove(), ae(e);
+        a.clear();
+        for (const e of c.values()) clearTimeout(e);
+        s.clear(), c.clear(), delete n.dataset.materials, delete n.dataset.materialRequested, delete n.dataset.materialEffective, delete n.dataset.materialReason;
+      }
+    }
+  };
+}
+const Qe = ["aria-label"], et = ["onClick"], tt = /* @__PURE__ */ we({
+  __name: "MaterialImageMenu",
+  props: {
+    root: {},
+    ready: { type: Boolean },
+    viewerKey: {},
+    labels: {}
+  },
+  emits: ["action"],
+  setup(n, { emit: i }) {
+    const r = n, o = i, f = ["fit", "zoom-in", "zoom-out"], a = pe(), s = pe();
+    let c, h, u, b = 0;
+    function d(l = !0) {
+      b++, s.value && (s.value = void 0, l && c?.isConnected && c.focus({ preventScroll: !0 }));
+    }
+    function y(l) {
+      a.value?.querySelectorAll('[role="menuitem"]')[l]?.focus();
+    }
+    async function g(l, k) {
+      l.preventDefault(), l.stopPropagation(), c = l instanceof KeyboardEvent && document.activeElement instanceof HTMLElement ? document.activeElement : k;
+      const x = k.getBoundingClientRect();
+      s.value = l instanceof MouseEvent ? { x: l.clientX, y: l.clientY } : {
+        x: x.left + x.width / 2,
+        y: x.top + Math.min(100, x.height / 2)
+      };
+      const P = ++b;
+      if (await We(), P !== b || !a.value || !s.value) return;
+      const I = a.value.getBoundingClientRect(), B = getComputedStyle(a.value).direction === "rtl";
+      s.value = {
+        x: Math.max(
+          8,
+          Math.min(s.value.x - (B ? I.width : 0), innerWidth - I.width - 8)
+        ),
+        y: Math.max(8, Math.min(s.value.y, innerHeight - I.height - 8))
+      }, y(0);
+    }
+    function v(l) {
+      if (!r.ready || !(l.target instanceof Element)) return;
+      const k = l.target.closest(".focus-surface");
+      !k || !r.root?.contains(k) || l.target.closest(
+        'button,input,select,textarea,a,[role="button"],[role="slider"],[contenteditable]'
+      ) || l instanceof KeyboardEvent && !(l.key === "F10" && l.shiftKey) || g(l, k);
+    }
+    function w(l) {
+      l.stopPropagation();
+      const x = [...a.value?.querySelectorAll('[role="menuitem"]') ?? []].findIndex((P) => P === document.activeElement);
+      if (l.key === "Escape")
+        l.preventDefault(), d();
+      else if (l.key === "Tab") d(!1);
+      else if (["ArrowDown", "ArrowUp", "Home", "End"].includes(l.key)) {
+        l.preventDefault();
+        const P = l.key === "Home" ? 0 : l.key === "End" ? f.length - 1 : (x + (l.key === "ArrowDown" ? 1 : -1) + f.length) % f.length;
+        y(P);
+      }
+    }
+    function L(l) {
+      d(), o("action", l);
+    }
+    function T(l) {
+      l.target instanceof Node && !a.value?.contains(l.target) && d(l.type !== "focusin");
+    }
+    function z() {
+      d();
+    }
+    function q() {
+      h?.removeEventListener("contextmenu", v), h?.removeEventListener("keydown", v), u?.(), h = r.root, h?.addEventListener("contextmenu", v), h?.addEventListener("keydown", v);
+      const l = r.ready ? h?.querySelector(".focus-surface") : void 0;
+      if (l) {
+        const k = l.getAttribute("tabindex");
+        l.tabIndex = 0, u = () => {
+          k === null ? l.removeAttribute("tabindex") : l.setAttribute("tabindex", k);
+        };
+      } else u = void 0;
+    }
+    return U(
+      () => [r.root, r.ready, r.viewerKey],
+      () => {
+        d(), q();
+      },
+      { immediate: !0, flush: "post" }
+    ), U(s, (l, k) => {
+      if (!!l == !!k) return;
+      const x = l ? "addEventListener" : "removeEventListener";
+      document[x]("pointerdown", T, !0), document[x]("focusin", T, !0), window[x]("resize", z), window[x]("blur", z);
+    }), xe(() => {
+      d(!1), h?.removeEventListener("contextmenu", v), h?.removeEventListener("keydown", v), u?.(), document.removeEventListener("pointerdown", T, !0), document.removeEventListener("focusin", T, !0), window.removeEventListener("resize", z), window.removeEventListener("blur", z);
+    }), (l, k) => s.value ? (ee(), ye("div", {
+      key: 0,
+      ref_key: "menu",
+      ref: a,
+      class: "material-image-menu",
+      role: "menu",
+      "aria-label": n.labels.menu,
+      style: De({ left: `${s.value.x}px`, top: `${s.value.y}px` }),
+      onKeydown: w,
+      onContextmenu: k[0] || (k[0] = Be(() => {
+      }, ["prevent", "stop"]))
+    }, [
+      (ee(), ye(Te, null, Ae(f, (x) => Fe("button", {
+        key: x,
+        type: "button",
+        role: "menuitem",
+        tabindex: "-1",
+        onClick: (P) => L(x)
+      }, ze(n.labels[x]), 9, et)), 64))
+    ], 44, Qe)) : Ie("", !0);
+  }
+}), ot = /* @__PURE__ */ we({
+  __name: "BatchMaterials",
+  props: {
+    root: {},
+    busy: { type: Boolean },
+    viewerReady: { type: Boolean },
+    viewerKey: {}
+  },
+  emits: ["viewer-action"],
+  setup(n, { emit: i }) {
+    const { displayState: r } = Xe(), o = n, f = i, a = _e();
+    let s, c = [];
+    const h = He(
+      () => r.value.uiLocale === "zh-CN" ? { menu: "图片视图", fit: "适应画布", "zoom-in": "放大", "zoom-out": "缩小" } : r.value.uiLocale === "ar" ? { menu: "عرض الصورة", fit: "ملاءمة اللوحة", "zoom-in": "تكبير", "zoom-out": "تصغير" } : { menu: "Image view", fit: "Fit to canvas", "zoom-in": "Zoom in", "zoom-out": "Zoom out" }
+    );
+    function u() {
+      s?.setPolicy({
+        busy: o.busy,
+        reduced: a.value,
+        opaque: c.some((d) => d.matches)
+      });
+    }
+    function b() {
+      s?.dispose(), s = void 0;
+      const d = o.root;
+      d && (s = je(d, (y) => {
+        d.dataset.materialRequested = y.requested, d.dataset.materialEffective = y.effective, d.dataset.materialReason = y.reason ?? "";
+      }), s.setParams(V.regular), u(), s.setMode("gpu"));
+    }
+    return U(() => o.root, b), U(() => [o.busy, a.value], u), Ne(() => {
+      c = [
+        matchMedia("(prefers-reduced-transparency: reduce)"),
+        matchMedia("(forced-colors: active)")
+      ], c.forEach((d) => d.addEventListener("change", u)), b();
+    }), xe(() => {
+      c.forEach((d) => d.removeEventListener("change", u)), s?.dispose();
+    }), (d, y) => (ee(), qe(tt, {
+      root: n.root,
+      ready: n.viewerReady,
+      "viewer-key": n.viewerKey,
+      labels: h.value,
+      onAction: y[0] || (y[0] = (g) => f("viewer-action", g))
+    }, null, 8, ["root", "ready", "viewer-key", "labels"]));
+  }
+});
+export {
+  ot as default
+};