triiiceratops 0.3.4 → 0.5.0

package/dist/triiiceratops-element-image.js

@@ -0,0 +1,472 @@
+var M0 = Object.defineProperty;
+var h0 = (e) => {
+  throw TypeError(e);
+};
+var I0 = (e, a, t) => a in e ? M0(e, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[a] = t;
+var J = (e, a, t) => I0(e, typeof a != "symbol" ? a + "" : a, t), H0 = (e, a, t) => a.has(e) || h0("Cannot " + t);
+var N = (e, a, t) => (H0(e, a, "read from private field"), t ? t.call(e) : a.get(e)), i0 = (e, a, t) => a.has(e) ? h0("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(e) : a.set(e, t);
+import { p as $, h as V0, i as p, j as A0, k as o, u as P, b as n, l as m, s as f, r as l, d as s, e as a0, m as w0, n as x, o as y, q as Z0, t as d0, v as x0, w as C0, f as y0, X as k0, x as Q, y as F0, z as n0, A as l0, B as g0, C as u0, D as f0, E as L0, c as z0, a as o0, T as S0, g as v0 } from "./chunks/TriiiceratopsViewer-BardJ3c3.js";
+var T0 = p('<path d="M68,102.06V40a12,12,0,0,0-24,0v62.06a36,36,0,0,0,0,67.88V216a12,12,0,0,0,24,0V169.94a36,36,0,0,0,0-67.88ZM56,148a12,12,0,1,1,12-12A12,12,0,0,1,56,148ZM164,88a36.07,36.07,0,0,0-24-33.94V40a12,12,0,0,0-24,0V54.06a36,36,0,0,0,0,67.88V216a12,12,0,0,0,24,0V121.94A36.07,36.07,0,0,0,164,88Zm-36,12a12,12,0,1,1,12-12A12,12,0,0,1,128,100Zm108,68a36.07,36.07,0,0,0-24-33.94V40a12,12,0,0,0-24,0v94.06a36,36,0,0,0,0,67.88V216a12,12,0,0,0,24,0V201.94A36.07,36.07,0,0,0,236,168Zm-36,12a12,12,0,1,1,12-12A12,12,0,0,1,200,180Z"></path>'), O0 = p('<path d="M80,136a24,24,0,1,1-24-24A24,24,0,0,1,80,136Zm48-72a24,24,0,1,0,24,24A24,24,0,0,0,128,64Zm72,80a24,24,0,1,0,24,24A24,24,0,0,0,200,144Z" opacity="0.2"></path><path d="M64,105V40a8,8,0,0,0-16,0v65a32,32,0,0,0,0,62v49a8,8,0,0,0,16,0V167a32,32,0,0,0,0-62Zm-8,47a16,16,0,1,1,16-16A16,16,0,0,1,56,152Zm80-95V40a8,8,0,0,0-16,0V57a32,32,0,0,0,0,62v97a8,8,0,0,0,16,0V119a32,32,0,0,0,0-62Zm-8,47a16,16,0,1,1,16-16A16,16,0,0,1,128,104Zm104,64a32.06,32.06,0,0,0-24-31V40a8,8,0,0,0-16,0v97a32,32,0,0,0,0,62v17a8,8,0,0,0,16,0V199A32.06,32.06,0,0,0,232,168Zm-32,16a16,16,0,1,1,16-16A16,16,0,0,1,200,184Z"></path>', 1), P0 = p('<path d="M84,136a28,28,0,0,1-20,26.83V216a8,8,0,0,1-16,0V162.83a28,28,0,0,1,0-53.66V40a8,8,0,0,1,16,0v69.17A28,28,0,0,1,84,136Zm52-74.83V40a8,8,0,0,0-16,0V61.17a28,28,0,0,0,0,53.66V216a8,8,0,0,0,16,0V114.83a28,28,0,0,0,0-53.66Zm72,80V40a8,8,0,0,0-16,0V141.17a28,28,0,0,0,0,53.66V216a8,8,0,0,0,16,0V194.83a28,28,0,0,0,0-53.66Z"></path>'), R0 = p('<path d="M62,106.6V40a6,6,0,0,0-12,0v66.6a30,30,0,0,0,0,58.8V216a6,6,0,0,0,12,0V165.4a30,30,0,0,0,0-58.8ZM56,154a18,18,0,1,1,18-18A18,18,0,0,1,56,154Zm78-95.4V40a6,6,0,0,0-12,0V58.6a30,30,0,0,0,0,58.8V216a6,6,0,0,0,12,0V117.4a30,30,0,0,0,0-58.8ZM128,106a18,18,0,1,1,18-18A18,18,0,0,1,128,106Zm102,62a30.05,30.05,0,0,0-24-29.4V40a6,6,0,0,0-12,0v98.6a30,30,0,0,0,0,58.8V216a6,6,0,0,0,12,0V197.4A30.05,30.05,0,0,0,230,168Zm-30,18a18,18,0,1,1,18-18A18,18,0,0,1,200,186Z"></path>'), D0 = p('<path d="M64,105V40a8,8,0,0,0-16,0v65a32,32,0,0,0,0,62v49a8,8,0,0,0,16,0V167a32,32,0,0,0,0-62Zm-8,47a16,16,0,1,1,16-16A16,16,0,0,1,56,152Zm80-95V40a8,8,0,0,0-16,0V57a32,32,0,0,0,0,62v97a8,8,0,0,0,16,0V119a32,32,0,0,0,0-62Zm-8,47a16,16,0,1,1,16-16A16,16,0,0,1,128,104Zm104,64a32.06,32.06,0,0,0-24-31V40a8,8,0,0,0-16,0v97a32,32,0,0,0,0,62v17a8,8,0,0,0,16,0V199A32.06,32.06,0,0,0,232,168Zm-32,16a16,16,0,1,1,16-16A16,16,0,0,1,200,184Z"></path>'), E0 = p('<path d="M60,108.29V40a4,4,0,0,0-8,0v68.29a28,28,0,0,0,0,55.42V216a4,4,0,0,0,8,0V163.71a28,28,0,0,0,0-55.42ZM56,156a20,20,0,1,1,20-20A20,20,0,0,1,56,156Zm76-95.71V40a4,4,0,0,0-8,0V60.29a28,28,0,0,0,0,55.42V216a4,4,0,0,0,8,0V115.71a28,28,0,0,0,0-55.42ZM128,108a20,20,0,1,1,20-20A20,20,0,0,1,128,108Zm100,60a28,28,0,0,0-24-27.71V40a4,4,0,0,0-8,0V140.29a28,28,0,0,0,0,55.42V216a4,4,0,0,0,8,0V195.71A28,28,0,0,0,228,168Zm-28,20a20,20,0,1,1,20-20A20,20,0,0,1,200,188Z"></path>'), j0 = p('<svg><!><rect width="256" height="256" fill="none"></rect><!></svg>');
+function B0(e, a) {
+  $(a, !0);
+  const t = V0();
+  let v = w0(a, ["$$slots", "$$events", "$$legacy", "children"]), c = P(() => a.weight ?? t.weight ?? "regular"), k = P(() => a.color ?? t.color ?? "currentColor"), M = P(() => a.size ?? t.size ?? "1em"), F = P(() => a.mirrored ?? t.mirrored ?? !1);
+  function _(r) {
+    let { weight: i, color: V, size: L, mirrored: z, ...d } = r;
+    return d;
+  }
+  var b = j0();
+  A0(
+    b,
+    (r, i) => ({
+      xmlns: "http://www.w3.org/2000/svg",
+      role: "img",
+      width: o(M),
+      height: o(M),
+      fill: o(k),
+      transform: o(F) ? "scale(-1, 1)" : void 0,
+      viewBox: "0 0 256 256",
+      ...r,
+      ...i
+    }),
+    [() => _(t), () => _(v)]
+  );
+  var O = n(b);
+  {
+    var K = (r) => {
+      var i = x(), V = y(i);
+      Z0(V, () => a.children), s(r, i);
+    };
+    m(O, (r) => {
+      a.children && r(K);
+    });
+  }
+  var R = f(O, 2);
+  {
+    var D = (r) => {
+      var i = T0();
+      s(r, i);
+    }, E = (r) => {
+      var i = x(), V = y(i);
+      {
+        var L = (d) => {
+          var I = O0();
+          d0(), s(d, I);
+        }, z = (d) => {
+          var I = x(), j = y(I);
+          {
+            var B = (g) => {
+              var Z = P0();
+              s(g, Z);
+            }, q = (g) => {
+              var Z = x(), G = y(Z);
+              {
+                var U = (u) => {
+                  var H = R0();
+                  s(u, H);
+                }, X = (u) => {
+                  var H = x(), h = y(H);
+                  {
+                    var C = (A) => {
+                      var S = D0();
+                      s(A, S);
+                    }, t0 = (A) => {
+                      var S = x(), e0 = y(S);
+                      {
+                        var r0 = (w) => {
+                          var T = E0();
+                          s(w, T);
+                        }, s0 = (w) => {
+                          var T = x0();
+                          T.nodeValue = (console.error('Unsupported icon weight. Choose from "thin", "light", "regular", "bold", "fill", or "duotone".'), ""), s(w, T);
+                        };
+                        m(
+                          e0,
+                          (w) => {
+                            o(c) === "thin" ? w(r0) : w(s0, !1);
+                          },
+                          !0
+                        );
+                      }
+                      s(A, S);
+                    };
+                    m(
+                      h,
+                      (A) => {
+                        o(c) === "regular" ? A(C) : A(t0, !1);
+                      },
+                      !0
+                    );
+                  }
+                  s(u, H);
+                };
+                m(
+                  G,
+                  (u) => {
+                    o(c) === "light" ? u(U) : u(X, !1);
+                  },
+                  !0
+                );
+              }
+              s(g, Z);
+            };
+            m(
+              j,
+              (g) => {
+                o(c) === "fill" ? g(B) : g(q, !1);
+              },
+              !0
+            );
+          }
+          s(d, I);
+        };
+        m(
+          V,
+          (d) => {
+            o(c) === "duotone" ? d(L) : d(z, !1);
+          },
+          !0
+        );
+      }
+      s(r, i);
+    };
+    m(R, (r) => {
+      o(c) === "bold" ? r(D) : r(E, !1);
+    });
+  }
+  l(b), s(e, b), a0();
+}
+class U0 {
+  constructor() {
+    J(this, "context", null);
+  }
+  onRegister(a) {
+    this.context = a;
+  }
+  onDestroy() {
+    this.context = null;
+  }
+  /** Convenience getter for ViewerState */
+  get viewerState() {
+    if (!this.context)
+      throw new Error(
+        `Plugin ${this.id} accessed viewerState before registration`
+      );
+    return this.context.viewerState;
+  }
+  /** Convenience getter for OSD viewer */
+  get osdViewer() {
+    var a;
+    return ((a = this.context) == null ? void 0 : a.getOSDViewer()) ?? null;
+  }
+}
+function c0(e, a) {
+  const t = e.drawer.canvas;
+  if (!t) return;
+  const v = [];
+  a.brightness !== 100 && v.push(`brightness(${a.brightness / 100})`), a.contrast !== 100 && v.push(`contrast(${a.contrast / 100})`), a.saturation !== 100 && v.push(`saturate(${a.saturation / 100})`), a.invert && v.push("invert(1)"), a.grayscale && v.push("grayscale(1)"), t.style.filter = v.length > 0 ? v.join(" ") : "none";
+}
+function _0(e) {
+  const a = e.drawer.canvas;
+  a && (a.style.filter = "none");
+}
+function m0(e) {
+  return e.brightness !== 100 || e.contrast !== 100 || e.saturation !== 100 || e.invert || e.grayscale;
+}
+const p0 = {
+  brightness: 100,
+  contrast: 100,
+  saturation: 100,
+  invert: !1,
+  grayscale: !1
+};
+var q0 = p('<path d="M228,128a100,100,0,0,1-98.66,100H128a99.39,99.39,0,0,1-68.62-27.29,12,12,0,0,1,16.48-17.45,76,76,0,1,0-1.57-109c-.13.13-.25.25-.39.37L54.89,92H72a12,12,0,0,1,0,24H24a12,12,0,0,1-12-12V56a12,12,0,0,1,24,0V76.72L57.48,57.06A100,100,0,0,1,228,128Z"></path>'), G0 = p('<path d="M216,128a88,88,0,1,1-88-88A88,88,0,0,1,216,128Z" opacity="0.2"></path><path d="M224,128a96,96,0,0,1-94.71,96H128A95.38,95.38,0,0,1,62.1,197.8a8,8,0,0,1,11-11.63A80,80,0,1,0,71.43,71.39a3.07,3.07,0,0,1-.26.25L44.59,96H72a8,8,0,0,1,0,16H24a8,8,0,0,1-8-8V56a8,8,0,0,1,16,0V85.8L60.25,60A96,96,0,0,1,224,128Z"></path>', 1), X0 = p('<path d="M224,128a96,96,0,0,1-94.71,96H128A95.38,95.38,0,0,1,62.1,197.8a8,8,0,0,1,11-11.63A80,80,0,1,0,71.43,71.39a3.07,3.07,0,0,1-.26.25L60.63,81.29l17,17A8,8,0,0,1,72,112H24a8,8,0,0,1-8-8V56A8,8,0,0,1,29.66,50.3L49.31,70,60.25,60A96,96,0,0,1,224,128Z"></path>'), J0 = p('<path d="M222,128a94,94,0,0,1-92.74,94H128a93.43,93.43,0,0,1-64.5-25.65,6,6,0,1,1,8.24-8.72A82,82,0,1,0,70,70l-.19.19L39.44,98H72a6,6,0,0,1,0,12H24a6,6,0,0,1-6-6V56a6,6,0,0,1,12,0V90.34L61.63,61.4A94,94,0,0,1,222,128Z"></path>'), K0 = p('<path d="M224,128a96,96,0,0,1-94.71,96H128A95.38,95.38,0,0,1,62.1,197.8a8,8,0,0,1,11-11.63A80,80,0,1,0,71.43,71.39a3.07,3.07,0,0,1-.26.25L44.59,96H72a8,8,0,0,1,0,16H24a8,8,0,0,1-8-8V56a8,8,0,0,1,16,0V85.8L60.25,60A96,96,0,0,1,224,128Z"></path>'), N0 = p('<path d="M220,128a92,92,0,0,1-90.77,92H128a91.47,91.47,0,0,1-63.13-25.1,4,4,0,1,1,5.5-5.82A84,84,0,1,0,68.6,68.57l-.13.12L34.3,100H72a4,4,0,0,1,0,8H24a4,4,0,0,1-4-4V56a4,4,0,0,1,8,0V94.89l35-32A92,92,0,0,1,220,128Z"></path>'), Q0 = p('<svg><!><rect width="256" height="256" fill="none"></rect><!></svg>');
+function W0(e, a) {
+  $(a, !0);
+  const t = V0();
+  let v = w0(a, ["$$slots", "$$events", "$$legacy", "children"]), c = P(() => a.weight ?? t.weight ?? "regular"), k = P(() => a.color ?? t.color ?? "currentColor"), M = P(() => a.size ?? t.size ?? "1em"), F = P(() => a.mirrored ?? t.mirrored ?? !1);
+  function _(r) {
+    let { weight: i, color: V, size: L, mirrored: z, ...d } = r;
+    return d;
+  }
+  var b = Q0();
+  A0(
+    b,
+    (r, i) => ({
+      xmlns: "http://www.w3.org/2000/svg",
+      role: "img",
+      width: o(M),
+      height: o(M),
+      fill: o(k),
+      transform: o(F) ? "scale(-1, 1)" : void 0,
+      viewBox: "0 0 256 256",
+      ...r,
+      ...i
+    }),
+    [() => _(t), () => _(v)]
+  );
+  var O = n(b);
+  {
+    var K = (r) => {
+      var i = x(), V = y(i);
+      Z0(V, () => a.children), s(r, i);
+    };
+    m(O, (r) => {
+      a.children && r(K);
+    });
+  }
+  var R = f(O, 2);
+  {
+    var D = (r) => {
+      var i = q0();
+      s(r, i);
+    }, E = (r) => {
+      var i = x(), V = y(i);
+      {
+        var L = (d) => {
+          var I = G0();
+          d0(), s(d, I);
+        }, z = (d) => {
+          var I = x(), j = y(I);
+          {
+            var B = (g) => {
+              var Z = X0();
+              s(g, Z);
+            }, q = (g) => {
+              var Z = x(), G = y(Z);
+              {
+                var U = (u) => {
+                  var H = J0();
+                  s(u, H);
+                }, X = (u) => {
+                  var H = x(), h = y(H);
+                  {
+                    var C = (A) => {
+                      var S = K0();
+                      s(A, S);
+                    }, t0 = (A) => {
+                      var S = x(), e0 = y(S);
+                      {
+                        var r0 = (w) => {
+                          var T = N0();
+                          s(w, T);
+                        }, s0 = (w) => {
+                          var T = x0();
+                          T.nodeValue = (console.error('Unsupported icon weight. Choose from "thin", "light", "regular", "bold", "fill", or "duotone".'), ""), s(w, T);
+                        };
+                        m(
+                          e0,
+                          (w) => {
+                            o(c) === "thin" ? w(r0) : w(s0, !1);
+                          },
+                          !0
+                        );
+                      }
+                      s(A, S);
+                    };
+                    m(
+                      h,
+                      (A) => {
+                        o(c) === "regular" ? A(C) : A(t0, !1);
+                      },
+                      !0
+                    );
+                  }
+                  s(u, H);
+                };
+                m(
+                  G,
+                  (u) => {
+                    o(c) === "light" ? u(U) : u(X, !1);
+                  },
+                  !0
+                );
+              }
+              s(g, Z);
+            };
+            m(
+              j,
+              (g) => {
+                o(c) === "fill" ? g(B) : g(q, !1);
+              },
+              !0
+            );
+          }
+          s(d, I);
+        };
+        m(
+          V,
+          (d) => {
+            o(c) === "duotone" ? d(L) : d(z, !1);
+          },
+          !0
+        );
+      }
+      s(r, i);
+    };
+    m(R, (r) => {
+      o(c) === "bold" ? r(D) : r(E, !1);
+    });
+  }
+  l(b), s(e, b), a0();
+}
+var Y0 = y0('<div class="w-72 h-full bg-base-200 border-l border-base-300 shadow-xl flex flex-col"><div class="flex items-center justify-between p-4 border-b border-base-300"><h2 class="text-lg font-semibold">Image Adjustments</h2> <button class="btn btn-sm btn-ghost btn-circle" aria-label="Close panel"><!></button></div> <div class="flex-1 overflow-y-auto p-4 space-y-6"><div class="form-control"><label class="label" for="brightness-slider"><span class="label-text">Brightness</span> <span class="label-text-alt"> </span></label> <input id="brightness-slider" type="range" min="0" max="200" class="range range-sm range-primary"/></div> <div class="form-control"><label class="label" for="contrast-slider"><span class="label-text">Contrast</span> <span class="label-text-alt"> </span></label> <input id="contrast-slider" type="range" min="0" max="200" class="range range-sm range-secondary"/></div> <div class="form-control"><label class="label" for="saturation-slider"><span class="label-text">Saturation</span> <span class="label-text-alt"> </span></label> <input id="saturation-slider" type="range" min="0" max="200" class="range range-sm range-accent"/></div> <div class="divider">Effects</div> <div class="form-control"><label class="label cursor-pointer"><span class="label-text">Invert Colors</span> <input type="checkbox" class="toggle toggle-primary"/></label></div> <div class="form-control"><label class="label cursor-pointer"><span class="label-text">Grayscale</span> <input type="checkbox" class="toggle toggle-secondary"/></label></div></div> <div class="p-4 border-t border-base-300"><button class="btn btn-outline btn-block"><!> Reset to Default</button></div></div>');
+function $0(e, a) {
+  $(a, !0);
+  function t(h, C) {
+    a.onFilterChange({ ...a.filters, [h]: C });
+  }
+  var v = Y0(), c = n(v), k = f(n(c), 2);
+  k.__click = function(...h) {
+    var C;
+    (C = a.onClose) == null || C.apply(this, h);
+  };
+  var M = n(k);
+  k0(M, { size: 20 }), l(k), l(c);
+  var F = f(c, 2), _ = n(F), b = n(_), O = f(n(b), 2), K = n(O);
+  l(O), l(b);
+  var R = f(b, 2);
+  Q(R), R.__input = (h) => t("brightness", +h.currentTarget.value), l(_);
+  var D = f(_, 2), E = n(D), r = f(n(E), 2), i = n(r);
+  l(r), l(E);
+  var V = f(E, 2);
+  Q(V), V.__input = (h) => t("contrast", +h.currentTarget.value), l(D);
+  var L = f(D, 2), z = n(L), d = f(n(z), 2), I = n(d);
+  l(d), l(z);
+  var j = f(z, 2);
+  Q(j), j.__input = (h) => t("saturation", +h.currentTarget.value), l(L);
+  var B = f(L, 4), q = n(B), g = f(n(q), 2);
+  Q(g), g.__change = (h) => t("invert", h.currentTarget.checked), l(q), l(B);
+  var Z = f(B, 2), G = n(Z), U = f(n(G), 2);
+  Q(U), U.__change = (h) => t("grayscale", h.currentTarget.checked), l(G), l(Z), l(F);
+  var X = f(F, 2), u = n(X);
+  u.__click = function(...h) {
+    var C;
+    (C = a.onReset) == null || C.apply(this, h);
+  };
+  var H = n(u);
+  W0(H, { size: 20 }), d0(), l(u), l(X), l(v), F0(() => {
+    n0(K, `${a.filters.brightness ?? ""}%`), l0(R, a.filters.brightness), n0(i, `${a.filters.contrast ?? ""}%`), l0(V, a.filters.contrast), n0(I, `${a.filters.saturation ?? ""}%`), l0(j, a.filters.saturation), g0(g, a.filters.invert), g0(U, a.filters.grayscale);
+  }), s(e, v), a0();
+}
+C0(["click", "input", "change"]);
+var W, Y;
+class b0 extends U0 {
+  constructor() {
+    super(...arguments);
+    J(this, "id", "image-manipulation");
+    J(this, "name", "Image Manipulation");
+    J(this, "version", "1.0.0");
+    i0(
+      this,
+      W,
+      // Reactive state using Svelte 5 runes
+      u0(!1)
+    );
+    i0(this, Y, u0(L0({ ...p0 })));
+    J(this, "osd", null);
+  }
+  get _panelOpen() {
+    return o(N(this, W));
+  }
+  set _panelOpen(t) {
+    f0(N(this, W), t, !0);
+  }
+  get _filters() {
+    return o(N(this, Y));
+  }
+  set _filters(t) {
+    f0(N(this, Y), t, !0);
+  }
+  onRegister(t) {
+    super.onRegister(t), t.registerMenuButton({
+      id: `${this.id}:toggle`,
+      icon: B0,
+      tooltip: "Image Adjustments",
+      onClick: () => this.togglePanel(),
+      isActive: () => this._panelOpen,
+      activeClass: "btn-secondary",
+      order: 50
+    }), t.registerPanel({
+      id: `${this.id}:panel`,
+      component: $0,
+      position: "left",
+      isVisible: () => this._panelOpen,
+      props: {
+        filters: this._filters,
+        onFilterChange: (v) => this.setFilters(v),
+        onReset: () => this.resetFilters(),
+        onClose: () => this.togglePanel()
+      }
+    });
+  }
+  onViewerReady(t) {
+    this.osd = t, m0(this._filters) && c0(t, this._filters), this.osd.addHandler("open", () => {
+      this.osd && m0(this._filters) && c0(this.osd, this._filters);
+    });
+  }
+  onDestroy() {
+    this.osd && _0(this.osd), this.osd = null, super.onDestroy();
+  }
+  // Public API
+  togglePanel() {
+    this._panelOpen = !this._panelOpen;
+  }
+  setFilters(t) {
+    this._filters.brightness = t.brightness, this._filters.contrast = t.contrast, this._filters.saturation = t.saturation, this._filters.invert = t.invert, this._filters.grayscale = t.grayscale, this.osd && c0(this.osd, t);
+  }
+  resetFilters() {
+    Object.assign(this._filters, p0), this.osd && _0(this.osd);
+  }
+  getFilters() {
+    return { ...this._filters };
+  }
+}
+W = new WeakMap(), Y = new WeakMap();
+var aa = y0('<div class="w-full h-full"><!></div>');
+function ta(e, a) {
+  $(a, !0);
+  let t = o0(a, "manifestId", 7, ""), v = o0(a, "canvasId", 7, ""), c = o0(a, "plugins", 23, () => [new b0()]);
+  var k = {
+    get manifestId() {
+      return t();
+    },
+    set manifestId(_ = "") {
+      t(_), v0();
+    },
+    get canvasId() {
+      return v();
+    },
+    set canvasId(_ = "") {
+      v(_), v0();
+    },
+    get plugins() {
+      return c();
+    },
+    set plugins(_ = [new b0()]) {
+      c(_), v0();
+    }
+  }, M = aa(), F = n(M);
+  return S0(F, {
+    get manifestId() {
+      return t();
+    },
+    get canvasId() {
+      return v();
+    },
+    get plugins() {
+      return c();
+    }
+  }), l(M), s(e, M), a0(k);
+}
+customElements.define("triiiceratops-viewer-image", z0(
+  ta,
+  {
+    manifestId: { attribute: "manifest-id", reflect: !0, type: "String" },
+    canvasId: { attribute: "canvas-id", reflect: !0, type: "String" },
+    plugins: {}
+  },
+  [],
+  [],
+  !1
+));