@mirage-engine/core 0.3.20 → 0.3.21

package/dist/mirage-engine.js

@@ -1,47 +1,47 @@
-var Xe = Object.defineProperty, Ne = Object.defineProperties;
-var ze = Object.getOwnPropertyDescriptors;
-var Ee = Object.getOwnPropertySymbols;
-var Ve = Object.prototype.hasOwnProperty, Ye = Object.prototype.propertyIsEnumerable;
-var be = (i, e, t) => e in i ? Xe(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t, te = (i, e) => {
+var Ve = Object.defineProperty, Ye = Object.defineProperties;
+var We = Object.getOwnPropertyDescriptors;
+var Re = Object.getOwnPropertySymbols;
+var Pe = Object.prototype.hasOwnProperty, He = Object.prototype.propertyIsEnumerable;
+var xe = (i, e, t) => e in i ? Ve(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t, re = (i, e) => {
   for (var t in e || (e = {}))
-    Ve.call(e, t) && be(i, t, e[t]);
-  if (Ee)
-    for (var t of Ee(e))
-      Ye.call(e, t) && be(i, t, e[t]);
+    Pe.call(e, t) && xe(i, t, e[t]);
+  if (Re)
+    for (var t of Re(e))
+      He.call(e, t) && xe(i, t, e[t]);
   return i;
-}, Ce = (i, e) => Ne(i, ze(e));
-var g = (i, e, t) => (be(i, typeof e != "symbol" ? e + "" : e, t), t);
-var Te = (i, e, t) => new Promise((r, s) => {
+}, Me = (i, e) => Ye(i, We(e));
+var p = (i, e, t) => (xe(i, typeof e != "symbol" ? e + "" : e, t), t);
+var Le = (i, e, t) => new Promise((r, s) => {
   var c = (l) => {
     try {
-      a(t.next(l));
-    } catch (n) {
-      s(n);
+      n(t.next(l));
+    } catch (a) {
+      s(a);
     }
   }, o = (l) => {
     try {
-      a(t.throw(l));
-    } catch (n) {
-      s(n);
+      n(t.throw(l));
+    } catch (a) {
+      s(a);
     }
-  }, a = (l) => l.done ? r(l.value) : Promise.resolve(l.value).then(c, o);
-  a((t = t.apply(i, e)).next());
+  }, n = (l) => l.done ? r(l.value) : Promise.resolve(l.value).then(c, o);
+  n((t = t.apply(i, e)).next());
 });
 import * as w from "three";
-const Ie = {
+const Be = {
   INCLUDE_TREE: "include-tree",
   EXCLUDE_TREE: "exclude-tree",
   INCLUDE_SELF: "include-self",
   EXCLUDE_SELF: "exclude-self",
   END: "end"
-}, ee = {
+}, te = {
   NAME: "data-mirage-dom",
   KEY: "mirageDom",
   VALUES: {
     HIDE: "hide",
     SHOW: "show"
   }
-}, Re = {
+}, De = {
   TRAVELER: "traveler",
   NATIVE: "native",
   CAPTURE_1: "1",
@@ -54,30 +54,30 @@ const Ie = {
   CAPTURE_8: "8",
   CAPTURE_9: "9",
   CAPTURE_10: "10"
-}, N = {
+}, V = {
   NAME: "data-mirage-travel",
   KEY: "mirageTravel",
-  VALUES: Re,
-  MAX_LAYERS: Object.keys(Re).length - 1
-}, H = {
+  VALUES: De,
+  MAX_LAYERS: Object.keys(De).length - 1
+}, q = {
   NAME: "data-mirage-filter",
   KEY: "mirageFilter",
-  VALUES: Ie
-}, $ = {
+  VALUES: Be
+}, j = {
   NAME: "data-mirage-select",
   KEY: "mirageSelect",
-  VALUES: Ie
-}, We = {
+  VALUES: Be
+}, Ge = {
   NAME: "data-mirage-shader",
   KEY: "mirageShader"
-}, dt = {
+}, gt = {
   NAME: "data-mirage-sandwich",
   KEY: "mirageSandwich",
   VALUES: {
     FRONT: "front"
   }
-}, ge = 0, re = 1, ue = 2, Pe = 4, pe = 8, ye = 16;
-function He(i) {
+}, pe = 0, ie = 1, fe = 2, qe = 4, me = 8, Se = 16;
+function $e(i) {
   const e = i.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)/);
   return e ? {
     r: parseInt(e[1]) / 255,
@@ -86,10 +86,10 @@ function He(i) {
     a: e[4] !== void 0 ? parseFloat(e[4]) : 1
   } : { r: 1, g: 1, b: 1, a: 1 };
 }
-function Ge(i) {
+function je(i) {
   const e = {};
   if (i.opacity && (e.opacity = parseFloat(i.opacity)), i.backgroundColor) {
-    const t = He(i.backgroundColor);
+    const t = $e(i.backgroundColor);
     e.backgroundColor = [t.r, t.g, t.b, t.a];
   }
   if (i.backgroundImage ? e.backgroundImage = i.backgroundImage : i.background && (e.backgroundImage = i.background), i.boxShadow && (e.boxShadow = i.boxShadow), i.borderRadius && (e.borderRadius = parseFloat(i.borderRadius)), i.width && (e.width = parseFloat(i.width)), i.height && (e.height = parseFloat(i.height)), i.transform && i.transform !== "none") {
@@ -98,34 +98,34 @@ function Ge(i) {
   }
   return e;
 }
-class qe {
+class Ke {
   constructor(e, t) {
-    g(this, "target");
-    g(this, "observer");
-    g(this, "pendingDeletions", /* @__PURE__ */ new Set());
-    g(this, "pendingStyles", /* @__PURE__ */ new Map());
-    g(this, "isDomDirty", !1);
-    g(this, "isRunning", !1);
-    g(this, "pendingMask", ge);
-    g(this, "mutationTimer", null);
-    g(this, "cssTimer", null);
-    g(this, "resizeConfig");
-    g(this, "resizeTimer", null);
-    g(this, "isResizing", !1);
-    g(this, "lastScrollX", 0);
-    g(this, "lastScrollY", 0);
-    g(this, "scrollTimer", null);
-    g(this, "onBeforeRender", /* @__PURE__ */ new Set());
-    g(this, "onLayoutChange", /* @__PURE__ */ new Set());
-    g(this, "onStyleChange", /* @__PURE__ */ new Set());
-    g(this, "onScrollChange", /* @__PURE__ */ new Set());
-    g(this, "onRender", /* @__PURE__ */ new Set());
-    g(this, "onTransitionFinished", (e) => {
-      this.target.contains(e.target) && this.mutationTimer === null && (this.cssTimer && clearTimeout(this.cssTimer), this.pendingStyles.size == 0 && (this.pendingMask |= re | ue, this.cssTimer = window.setTimeout(() => {
+    p(this, "target");
+    p(this, "observer");
+    p(this, "pendingDeletions", /* @__PURE__ */ new Set());
+    p(this, "pendingStyles", /* @__PURE__ */ new Map());
+    p(this, "isDomDirty", !1);
+    p(this, "isRunning", !1);
+    p(this, "pendingMask", pe);
+    p(this, "mutationTimer", null);
+    p(this, "cssTimer", null);
+    p(this, "resizeConfig");
+    p(this, "resizeTimer", null);
+    p(this, "isResizing", !1);
+    p(this, "lastScrollX", 0);
+    p(this, "lastScrollY", 0);
+    p(this, "scrollTimer", null);
+    p(this, "onBeforeRender", /* @__PURE__ */ new Set());
+    p(this, "onLayoutChange", /* @__PURE__ */ new Set());
+    p(this, "onStyleChange", /* @__PURE__ */ new Set());
+    p(this, "onScrollChange", /* @__PURE__ */ new Set());
+    p(this, "onRender", /* @__PURE__ */ new Set());
+    p(this, "onTransitionFinished", (e) => {
+      this.target.contains(e.target) && this.mutationTimer === null && (this.cssTimer && clearTimeout(this.cssTimer), this.pendingStyles.size == 0 && (this.pendingMask |= ie | fe, this.cssTimer = window.setTimeout(() => {
         this.isDomDirty = !0, this.cssTimer = null;
       }, 50)));
     });
-    g(this, "onWindowResize", () => {
+    p(this, "onWindowResize", () => {
       if (!this.resizeConfig.enabled) {
         this.isDomDirty = !0;
         return;
@@ -134,13 +134,13 @@ class qe {
         this.isDomDirty = !0, this.resizeConfig.onEnd && this.resizeConfig.onEnd(), this.isResizing = !1, this.resizeTimer = null;
       }, this.resizeConfig.delay);
     });
-    g(this, "renderLoop", () => {
+    p(this, "renderLoop", () => {
       if (!this.isRunning)
         return;
-      this.onBeforeRender.forEach((r) => r()), this.isDomDirty && (this.isDomDirty = !1, this.onLayoutChange.forEach((r) => r(this.pendingMask, this.pendingDeletions)), this.pendingDeletions.clear(), this.pendingMask = ge);
+      this.onBeforeRender.forEach((r) => r()), this.isDomDirty && (this.isDomDirty = !1, this.onLayoutChange.forEach((r) => r(this.pendingMask, this.pendingDeletions)), this.pendingDeletions.clear(), this.pendingMask = pe);
       const e = window.scrollX, t = window.scrollY;
       (e !== this.lastScrollX || t !== this.lastScrollY) && (this.onScrollChange.forEach((r) => r(e, t)), this.lastScrollX = e, this.lastScrollY = t, this.scrollTimer && clearTimeout(this.scrollTimer), this.scrollTimer = window.setTimeout(() => {
-        this.pendingMask |= re, this.isDomDirty = !0, this.scrollTimer = null;
+        this.pendingMask |= ie, this.isDomDirty = !0, this.scrollTimer = null;
       }, 150)), this.pendingStyles.size > 0 && (this.onStyleChange.forEach((r) => r(this.pendingStyles)), this.pendingStyles.clear()), this.onRender.forEach((r) => r()), requestAnimationFrame(this.renderLoop);
     });
     var s, c;
@@ -152,23 +152,23 @@ class qe {
       onStart: r.onStart,
       onEnd: r.onEnd
     }, this.observer = new MutationObserver((o) => {
-      let a = ge;
+      let n = pe;
       for (const l of o)
         if (l.type === "childList")
-          a |= pe, l.removedNodes.length > 0 && l.removedNodes.forEach((n) => {
-            n instanceof HTMLElement && this.pendingDeletions.add(n);
+          n |= me, l.removedNodes.length > 0 && l.removedNodes.forEach((a) => {
+            a instanceof HTMLElement && this.pendingDeletions.add(a);
           });
         else if (l.type === "attributes")
           if (l.attributeName === "style") {
-            a |= re | ue;
-            const n = l.target, u = Ge(n.style);
-            this.pendingStyles.set(n, u);
+            n |= ie | fe;
+            const a = l.target, u = je(a.style);
+            this.pendingStyles.set(a, u);
           } else
-            l.attributeName === "class" ? a |= re | ue : l.attributeName && l.attributeName.startsWith("data-") && (a |= re | ue, l.attributeName.startsWith("data-mirage") && (a |= pe));
+            l.attributeName === "class" ? n |= ie | fe : l.attributeName && l.attributeName.startsWith("data-") && (n |= ie | fe, l.attributeName.startsWith("data-mirage") && (n |= me));
         else
-          l.type === "characterData" && (a |= ye | re);
-      if (a !== ge) {
-        if (this.pendingMask |= a, a & pe) {
+          l.type === "characterData" && (n |= Se | ie);
+      if (n !== pe) {
+        if (this.pendingMask |= n, n & me) {
           this.clearTimers(), this.isDomDirty = !0;
           return;
         }
@@ -193,13 +193,13 @@ class qe {
     this.mutationTimer && (clearTimeout(this.mutationTimer), this.mutationTimer = null), this.cssTimer && (clearTimeout(this.cssTimer), this.cssTimer = null), this.scrollTimer && (clearTimeout(this.scrollTimer), this.scrollTimer = null);
   }
 }
-const G = 1, ae = 2, ut = 0, F = {
+const $ = 1, ne = 2, pt = 0, O = {
   BASE: 0,
   SELECTED: 1,
   getCaptureLayer: (i) => 31 - i,
   HIDDEN: 31
-}, Me = Object.values(H.VALUES);
-class ke {
+}, Ae = Object.values(q.VALUES);
+class Fe {
   /**
    * Calculates or retrieves the exact alphabetic baseline (in pixels) for the given font.
    * @param font CSS font shorthand string (e.g., "400 16px Inter")
@@ -220,17 +220,17 @@ class ke {
     return document.body.removeChild(t), c;
   }
 }
-g(ke, "cache", /* @__PURE__ */ new Map());
-class $e extends w.MeshBasicMaterial {
+p(Fe, "cache", /* @__PURE__ */ new Map());
+class Je extends w.MeshBasicMaterial {
   constructor(t, r, s, c, o = 2) {
     super({
       transparent: !0,
       side: w.FrontSide,
       color: 16777215
     });
-    g(this, "canvas");
-    g(this, "ctx");
-    g(this, "qualityFactor");
+    p(this, "canvas");
+    p(this, "ctx");
+    p(this, "qualityFactor");
     if (this.canvas = document.createElement("canvas"), this.ctx = this.canvas.getContext("2d"), !this.ctx)
       throw new Error("[Mirage] Failed to create canvas context");
     this.qualityFactor = o, this.map = new w.CanvasTexture(this.canvas), this.map.colorSpace = w.LinearSRGBColorSpace, this.map.minFilter = w.LinearFilter, this.map.magFilter = w.LinearFilter, this.updateText(t, r, s, c);
@@ -239,14 +239,14 @@ class $e extends w.MeshBasicMaterial {
     const s = t.split(`
 `), c = [];
     return s.forEach((o) => {
-      const a = o.match(/[^\s\-]+\-?|\-|\s+/g) || [];
-      if (a.length === 0) {
+      const n = o.match(/[^\s\-]+\-?|\-|\s+/g) || [];
+      if (n.length === 0) {
         c.push("");
         return;
       }
-      let l = a[0];
-      for (let n = 1; n < a.length; n++) {
-        const u = a[n];
+      let l = n[0];
+      for (let a = 1; a < n.length; a++) {
+        const u = n[a];
         this.ctx.measureText(l + u).width <= r + 2 ? l += u : (l && c.push(l), l = u.trimStart());
       }
       l && c.push(l);
@@ -254,13 +254,13 @@ class $e extends w.MeshBasicMaterial {
   }
   updateText(t, r, s, c, o) {
     o !== void 0 && (this.qualityFactor = o);
-    const l = (window.devicePixelRatio || 1) * this.qualityFactor, n = s * l, u = c * l;
-    this.canvas.width !== n || this.canvas.height !== u ? (this.canvas.width = n, this.canvas.height = u) : this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height), this.ctx.setTransform(l, 0, 0, l, 0, 0), this.ctx.font = r.font, this.ctx.fillStyle = r.color, this.ctx.textBaseline = "alphabetic", this.ctx.globalAlpha = 1;
-    const h = this.wrapText(t, s), d = r.lineHeight, p = ke.getBaseline(r.font);
-    h.forEach((f, L) => {
-      const m = L * d + p;
+    const l = (window.devicePixelRatio || 1) * this.qualityFactor, a = s * l, u = c * l;
+    this.canvas.width !== a || this.canvas.height !== u ? (this.canvas.width = a, this.canvas.height = u) : this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height), this.ctx.setTransform(l, 0, 0, l, 0, 0), this.ctx.font = r.font, this.ctx.fillStyle = r.color, this.ctx.textBaseline = "alphabetic", this.ctx.globalAlpha = 1;
+    const h = this.wrapText(t, s), d = r.lineHeight, m = Fe.getBaseline(r.font);
+    h.forEach((g, R) => {
+      const v = R * d + m;
       let y = 0;
-      r.textAlign === "center" ? y = s / 2 : r.textAlign === "right" && (y = s), this.ctx.textAlign = r.textAlign, this.ctx.fillText(f, y, m);
+      r.textAlign === "center" ? y = s / 2 : r.textAlign === "right" && (y = s), this.ctx.textAlign = r.textAlign, this.ctx.fillText(g, y, v);
     }), this.map && (this.map.needsUpdate = !0);
   }
   dispose() {
@@ -285,7 +285,7 @@ function ce(i) {
   }
   return { color: new w.Color(i), alpha: 1 };
 }
-function Ue(i) {
+function Oe(i) {
   const e = [];
   let t = "", r = 0;
   for (let s = 0; s < i.length; s++) {
@@ -302,13 +302,13 @@ function Ue(i) {
   }
   return t && e.push(t.trim()), e;
 }
-function je(i) {
+function Ze(i) {
   if (!i || typeof i != "string" || !i.includes("linear-gradient"))
     return null;
   const e = i.match(/linear-gradient\((.*)\)/);
   if (!e)
     return null;
-  const t = e[1], r = Ue(t);
+  const t = e[1], r = Oe(t);
   let s = Math.PI, c = 0;
   const o = r[0].trim();
   if (o.startsWith("to "))
@@ -317,63 +317,63 @@ function je(i) {
     const l = parseFloat(o);
     o.endsWith("deg") ? s = l * (Math.PI / 180) : o.endsWith("rad") ? s = l : o.endsWith("turn") && (s = l * Math.PI * 2), c = 1;
   }
-  const a = [];
-  for (let l = c; l < r.length && !(a.length >= 8); l++) {
-    const n = r[l].trim(), u = n.lastIndexOf(" ");
-    let h = n, d = null;
-    if (u !== -1 && !n.endsWith(")")) {
-      const f = n.substring(u + 1);
-      (f.endsWith("%") || f.endsWith("px") || !isNaN(parseFloat(f))) && (h = n.substring(0, u).trim(), d = f);
+  const n = [];
+  for (let l = c; l < r.length && !(n.length >= 8); l++) {
+    const a = r[l].trim(), u = a.lastIndexOf(" ");
+    let h = a, d = null;
+    if (u !== -1 && !a.endsWith(")")) {
+      const g = a.substring(u + 1);
+      (g.endsWith("%") || g.endsWith("px") || !isNaN(parseFloat(g))) && (h = a.substring(0, u).trim(), d = g);
     }
-    const p = ce(h);
-    a.push({
-      color: p.color,
-      alpha: p.alpha,
+    const m = ce(h);
+    n.push({
+      color: m.color,
+      alpha: m.alpha,
       rawStop: d,
       stop: 0
     });
   }
-  if (a.length > 0) {
-    for (let n = 0; n < a.length; n++)
-      a[n].rawStop !== null && (a[n].stop = parseFloat(a[n].rawStop) / 100);
-    a[0].rawStop === null && (a[0].stop = 0), a.length > 1 && a[a.length - 1].rawStop === null && (a[a.length - 1].stop = 1);
+  if (n.length > 0) {
+    for (let a = 0; a < n.length; a++)
+      n[a].rawStop !== null && (n[a].stop = parseFloat(n[a].rawStop) / 100);
+    n[0].rawStop === null && (n[0].stop = 0), n.length > 1 && n[n.length - 1].rawStop === null && (n[n.length - 1].stop = 1);
     let l = 0;
-    for (let n = 1; n < a.length; n++)
-      if (a[n].rawStop !== null || n === a.length - 1) {
-        const u = n - l;
+    for (let a = 1; a < n.length; a++)
+      if (n[a].rawStop !== null || a === n.length - 1) {
+        const u = a - l;
         if (u > 1) {
-          const h = a[l].stop, p = (a[n].stop - h) / u;
-          for (let f = 1; f < u; f++)
-            a[l + f].stop = h + p * f;
+          const h = n[l].stop, m = (n[a].stop - h) / u;
+          for (let g = 1; g < u; g++)
+            n[l + g].stop = h + m * g;
         }
-        l = n;
+        l = a;
       }
   }
-  return { angle: s, stops: a };
+  return { angle: s, stops: n };
 }
-function Ke(i) {
+function Qe(i) {
   if (!i || i === "none")
     return null;
-  const e = Ue(i);
+  const e = Oe(i);
   if (e.length === 0)
     return null;
   const t = e[0].trim(), r = /(rgba?\([^)]+\)|#[0-9a-fA-F]+|[a-zA-Z]+)/, s = t.match(r);
   let c = "transparent", o = t;
   if (s && s[1] !== "inset") {
-    const p = s[1];
-    (p.startsWith("rgb") || p.startsWith("#") || p === "black" || p === "white" || p === "transparent") && (c = p, o = t.replace(p, "").trim());
+    const m = s[1];
+    (m.startsWith("rgb") || m.startsWith("#") || m === "black" || m === "white" || m === "transparent") && (c = m, o = t.replace(m, "").trim());
   }
   o = o.replace("inset", "").trim();
-  const a = o.split(/\s+/).map((p) => parseFloat(p) || 0), l = a[0] || 0, n = a[1] || 0, u = a[2] || 0, h = a[3] || 0, d = ce(c);
-  return { offsetX: l, offsetY: n, blurRadius: u, spreadRadius: h, color: d.color, alpha: d.alpha };
+  const n = o.split(/\s+/).map((m) => parseFloat(m) || 0), l = n[0] || 0, a = n[1] || 0, u = n[2] || 0, h = n[3] || 0, d = ce(c);
+  return { offsetX: l, offsetY: a, blurRadius: u, spreadRadius: h, color: d.color, alpha: d.alpha };
 }
-const Je = `varying vec2 vUv;
+const et = `varying vec2 vUv;
 varying vec4 vScreenPos;
 void main() {
   vUv = uv;
   gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
   vScreenPos = gl_Position;
-}`, Ze = `varying vec2 vUv;
+}`, tt = `varying vec2 vUv;
 uniform vec2 uSize;
 uniform vec2 uMeshSize;
 uniform vec4 uShadowColor;
@@ -532,41 +532,41 @@ void main() {
 
   // #include <colorspace_fragment>
 }
-`, Qe = `uniform sampler2D uTexture;
+`, rt = `uniform sampler2D uTexture;
 varying vec4 vScreenPos;
 uniform vec2 uTextureRepeat;
-uniform vec2 uTextureOffset;`, et = `vec2 screenUv = (vScreenPos.xy / vScreenPos.w) * 0.5 + 0.5;
+uniform vec2 uTextureOffset;`, it = `vec2 screenUv = (vScreenPos.xy / vScreenPos.w) * 0.5 + 0.5;
 vec2 resultUv = screenUv;
 
-`, tt = `vec4 texColor = texture2D(uTexture, resultUv);
-baseColor = blendSrcOver(baseColor, texColor);`, Le = {
-  vertexShader: Je,
-  fragmentShader: Ze
-}, De = {
-  declChunk: Qe,
-  uvChunk: et,
-  baseColorChunk: tt
+`, st = `vec4 texColor = texture2D(uTexture, resultUv);
+baseColor = blendSrcOver(baseColor, texColor);`, Ie = {
+  vertexShader: et,
+  fragmentShader: tt
+}, ke = {
+  declChunk: rt,
+  uvChunk: it,
+  baseColorChunk: st
 };
-function rt(i, e, t, r = null, s) {
+function ot(i, e, t, r = null, s) {
   var C;
   const c = r !== null || !!i.imageSrc;
   let o = "";
-  const a = {};
+  const n = {};
   if (s != null && s.uniforms)
-    for (const [b, S] of Object.entries(s.uniforms))
-      typeof S == "number" ? (o += `uniform float ${b};
-`, a[b] = { value: S }) : Array.isArray(S) ? S.length === 2 ? (o += `uniform vec2 ${b};
-`, a[b] = { value: new w.Vector2(...S) }) : S.length === 3 ? (o += `uniform vec3 ${b};
-`, a[b] = { value: new w.Vector3(...S) }) : S.length === 4 && (o += `uniform vec4 ${b};
-`, a[b] = { value: new w.Vector4(...S) }) : S && typeof S == "object" && S.type ? (o += `uniform ${S.type} ${b};
-`, a[b] = S) : (o += `uniform float ${b};
-`, a[b] = { value: S });
-  const l = s !== void 0, n = (c || l ? De.declChunk : "") + `
+    for (const [b, x] of Object.entries(s.uniforms))
+      typeof x == "number" ? (o += `uniform float ${b};
+`, n[b] = { value: x }) : Array.isArray(x) ? x.length === 2 ? (o += `uniform vec2 ${b};
+`, n[b] = { value: new w.Vector2(...x) }) : x.length === 3 ? (o += `uniform vec3 ${b};
+`, n[b] = { value: new w.Vector3(...x) }) : x.length === 4 && (o += `uniform vec4 ${b};
+`, n[b] = { value: new w.Vector4(...x) }) : x && typeof x == "object" && x.type ? (o += `uniform ${x.type} ${b};
+`, n[b] = x) : (o += `uniform float ${b};
+`, n[b] = { value: x });
+  const l = s !== void 0, a = (c || l ? ke.declChunk : "") + `
 ` + o, u = `vec2 screenUv = (vScreenPos.xy / vScreenPos.w) * 0.5 + 0.5;
 `, h = i.isTraveler ? `vec2 resultUv = screenUv;
 ` : `vec2 localUv = (p / uSize) + 0.5;
 vec2 resultUv = localUv * uTextureRepeat + uTextureOffset;
-`, d = c || l ? u + h + ((s == null ? void 0 : s.uvModifier) || "") : "", p = c || l ? De.baseColorChunk : "", f = (s == null ? void 0 : s.colorModifier) || "", L = Le.fragmentShader.replace("#INJECT_DECLARATIONS", n).replace("#INJECT_UV_MODIFIER", d).replace("#INJECT_BASE_COLOR", p).replace("#INJECT_COLOR_MODIFIER", f), m = ce(i.backgroundColor), y = ce(i.borderColor), E = {
+`, d = c || l ? u + h + ((s == null ? void 0 : s.uvModifier) || "") : "", m = c || l ? ke.baseColorChunk : "", g = (s == null ? void 0 : s.colorModifier) || "", R = Ie.fragmentShader.replace("#INJECT_DECLARATIONS", a).replace("#INJECT_UV_MODIFIER", d).replace("#INJECT_BASE_COLOR", m).replace("#INJECT_COLOR_MODIFIER", g), v = ce(i.backgroundColor), y = ce(i.borderColor), E = {
     uSize: { value: new w.Vector2(e, t) },
     uMeshSize: { value: new w.Vector2(e, t) },
     uShadowColor: { value: new w.Vector4(0, 0, 0, 0) },
@@ -575,10 +575,10 @@ vec2 resultUv = localUv * uTextureRepeat + uTextureOffset;
     uShadowSpread: { value: 0 },
     uBgColor: {
       value: new w.Vector4(
-        m.color.r,
-        m.color.g,
-        m.color.b,
-        m.alpha
+        v.color.r,
+        v.color.g,
+        v.color.b,
+        v.alpha
       )
     },
     uBorderColor: {
@@ -602,20 +602,20 @@ vec2 resultUv = localUv * uTextureRepeat + uTextureOffset;
     },
     uGradientStops: { value: new Float32Array(8) }
   };
-  Be(E.uBorderRadius.value, i.borderRadius, Math.min(e, t)), c && (E.uTexture.value = r);
-  const A = new w.ShaderMaterial({
-    uniforms: te(te({}, E), a),
-    vertexShader: Le.vertexShader,
-    fragmentShader: L,
+  _e(E.uBorderRadius.value, i.borderRadius, Math.min(e, t)), c && (E.uTexture.value = r);
+  const L = new w.ShaderMaterial({
+    uniforms: re(re({}, E), n),
+    vertexShader: Ie.vertexShader,
+    fragmentShader: R,
     transparent: !0,
     side: w.FrontSide
     // for better performance
   });
-  return i.backgroundImage && xe(A, { backgroundImage: i.backgroundImage }), A;
+  return i.backgroundImage && Ee(L, { backgroundImage: i.backgroundImage }), L;
 }
-function it(i, e, t, r, s) {
+function at(i, e, t, r, s) {
   const c = le(e.borderWidth);
-  xe(i, {
+  Ee(i, {
     width: t,
     height: r,
     borderRadius: e.borderRadius,
@@ -628,19 +628,19 @@ function it(i, e, t, r, s) {
     boxShadow: e.boxShadow
   });
 }
-function xe(i, e) {
+function Ee(i, e) {
   var r, s, c;
   if (e.boxShadow !== void 0) {
-    const o = Ke(e.boxShadow);
+    const o = Qe(e.boxShadow);
     o ? (i.uniforms.uShadowColor.value.set(o.color.r, o.color.g, o.color.b, o.alpha), i.uniforms.uShadowOffset.value.set(o.offsetX, o.offsetY), i.uniforms.uShadowBlur.value = o.blurRadius, i.uniforms.uShadowSpread.value = o.spreadRadius, i.userData.shadowPadding = o.blurRadius + o.spreadRadius + Math.max(Math.abs(o.offsetX), Math.abs(o.offsetY))) : (i.uniforms.uShadowColor.value.w = 0, i.userData.shadowPadding = 0);
   }
   if (e.width !== void 0 && e.height !== void 0 && i.uniforms.uSize.value.set(e.width, e.height), i.uniforms.uMeshSize) {
-    const o = i.userData.shadowPadding || 0, a = e.width !== void 0 ? e.width : i.uniforms.uSize.value.x, l = e.height !== void 0 ? e.height : i.uniforms.uSize.value.y;
-    i.uniforms.uMeshSize.value.set(a + o * 2, l + o * 2);
+    const o = i.userData.shadowPadding || 0, n = e.width !== void 0 ? e.width : i.uniforms.uSize.value.x, l = e.height !== void 0 ? e.height : i.uniforms.uSize.value.y;
+    i.uniforms.uMeshSize.value.set(n + o * 2, l + o * 2);
   }
   if (e.borderRadius !== void 0) {
     const o = e.width !== void 0 && e.height !== void 0 ? Math.min(e.width, e.height) : Math.min(i.uniforms.uSize.value.x, i.uniforms.uSize.value.y);
-    Be(i.uniforms.uBorderRadius.value, e.borderRadius, o);
+    _e(i.uniforms.uBorderRadius.value, e.borderRadius, o);
   }
   if (e.borderWidth !== void 0 && (i.uniforms.uBorderWidth.value = e.borderWidth), e.backgroundColor !== void 0)
     if (Array.isArray(e.backgroundColor)) {
@@ -697,9 +697,9 @@ function xe(i, e) {
   e.opacity !== void 0 && (i.uniforms.uOpacity.value = e.opacity), e.bgOpacity !== void 0 && (i.uniforms.uBgColor.value.w = e.bgOpacity), e.borderOpacity !== void 0 && (i.uniforms.uBorderColor.value.w = e.borderOpacity), i.uniforms.uTexture && e.texture !== void 0 && (i.uniforms.uTexture.value = e.texture);
   const t = e.texture !== void 0 ? e.texture : (r = i.uniforms.uTexture) == null ? void 0 : r.value;
   if (t && (t.image instanceof ImageBitmap || t.image instanceof HTMLImageElement || t.image instanceof HTMLCanvasElement)) {
-    const o = t.image.naturalWidth || t.image.videoWidth || t.image.width, a = t.image.naturalHeight || t.image.videoHeight || t.image.height, l = (s = e.width) != null ? s : i.uniforms.uSize.value.x, n = (c = e.height) != null ? c : i.uniforms.uSize.value.y;
-    if (o && a && l && n) {
-      const u = o / a, h = l / n;
+    const o = t.image.naturalWidth || t.image.videoWidth || t.image.width, n = t.image.naturalHeight || t.image.videoHeight || t.image.height, l = (s = e.width) != null ? s : i.uniforms.uSize.value.x, a = (c = e.height) != null ? c : i.uniforms.uSize.value.y;
+    if (o && n && l && a) {
+      const u = o / n, h = l / a;
       if (u > h) {
         const d = h / u;
         i.uniforms.uTextureRepeat.value.set(d, 1), i.uniforms.uTextureOffset.value.set((1 - d) / 2, 0);
@@ -711,28 +711,28 @@ function xe(i, e) {
   } else
     i.uniforms.uTextureRepeat && (i.uniforms.uTextureRepeat.value.set(1, 1), i.uniforms.uTextureOffset.value.set(0, 0));
   if (e.backgroundImage !== void 0) {
-    const o = je(e.backgroundImage);
+    const o = Ze(e.backgroundImage);
     if (o) {
       i.uniforms.uGradientCount.value = o.stops.length, i.uniforms.uGradientAngle.value = o.angle;
-      for (let a = 0; a < 8; a++)
-        if (a < o.stops.length) {
-          const l = o.stops[a];
-          i.uniforms.uGradientColors.value[a].set(
+      for (let n = 0; n < 8; n++)
+        if (n < o.stops.length) {
+          const l = o.stops[n];
+          i.uniforms.uGradientColors.value[n].set(
             l.color.r,
             l.color.g,
             l.color.b,
             l.alpha
-          ), i.uniforms.uGradientStops.value[a] = l.stop;
+          ), i.uniforms.uGradientStops.value[n] = l.stop;
         } else
-          i.uniforms.uGradientColors.value[a].set(0, 0, 0, 0), i.uniforms.uGradientStops.value[a] = 1;
+          i.uniforms.uGradientColors.value[n].set(0, 0, 0, 0), i.uniforms.uGradientStops.value[n] = 1;
     } else
       i.uniforms.uGradientCount.value = 0;
   }
   for (const o of Object.keys(e))
     o !== "width" && o !== "height" && o !== "borderRadius" && o !== "borderWidth" && o !== "backgroundColor" && o !== "borderColor" && o !== "opacity" && o !== "bgOpacity" && o !== "borderOpacity" && o !== "texture" && o !== "backgroundImage" && o !== "boxShadow" && i.uniforms[o] !== void 0 && (i.uniforms[o].value !== void 0 && i.uniforms[o].value !== null && typeof i.uniforms[o].value.set == "function" ? Array.isArray(e[o]) ? i.uniforms[o].value.set(...e[o]) : e[o] !== void 0 && (e[o].copy ? i.uniforms[o].value.copy(e[o]) : i.uniforms[o].value = e[o]) : i.uniforms[o].value = e[o]);
 }
-function Be(i, e, t = 0) {
-  var l, n, u, h;
+function _e(i, e, t = 0) {
+  var l, a, u, h;
   if (e == null) {
     i.set(0, 0, 0, 0);
     return;
@@ -745,18 +745,18 @@ function Be(i, e, t = 0) {
     i.set(e[0], e[1], e[2], e[3]);
     return;
   }
-  const r = e.split("/")[0].trim().split(/\s+/), s = le(r[0], t), c = le((l = r[1]) != null ? l : r[0], t), o = le((n = r[2]) != null ? n : r[0], t), a = le((h = (u = r[3]) != null ? u : r[1]) != null ? h : r[0], t);
-  i.set(s, c, o, a);
+  const r = e.split("/")[0].trim().split(/\s+/), s = le(r[0], t), c = le((l = r[1]) != null ? l : r[0], t), o = le((a = r[2]) != null ? a : r[0], t), n = le((h = (u = r[3]) != null ? u : r[1]) != null ? h : r[0], t);
+  i.set(s, c, o, n);
 }
-const W = {
-  create(i, e, t, r, s, c = 2, o = null, a) {
-    return i === "BOX" ? rt(
+const H = {
+  create(i, e, t, r, s, c = 2, o = null, n) {
+    return i === "BOX" ? ot(
       e,
       r,
       s,
       o,
-      a
-    ) : i === "TEXT" ? new $e(
+      n
+    ) : i === "TEXT" ? new Je(
       t || "",
       e,
       r,
@@ -764,13 +764,13 @@ const W = {
       c
     ) : new w.MeshBasicMaterial({ visible: !1 });
   },
-  update(i, e, t, r, s, c, o = 2, a) {
-    e === "BOX" ? it(
+  update(i, e, t, r, s, c, o = 2, n) {
+    e === "BOX" ? at(
       i,
       t,
       s,
       c,
-      a
+      n
     ) : e === "TEXT" && i.updateText(
       r || "",
       t,
@@ -780,16 +780,16 @@ const W = {
     );
   },
   forceUpdateUniforms(i, e) {
-    xe(i, e);
+    Ee(i, e);
   }
 };
-class st {
+class nt {
   constructor(e, t = !0) {
-    g(this, "observer");
-    g(this, "textures", /* @__PURE__ */ new WeakMap());
-    g(this, "loadStatus", /* @__PURE__ */ new WeakMap());
-    g(this, "elementUrls", /* @__PURE__ */ new WeakMap());
-    g(this, "onUpdate");
+    p(this, "observer");
+    p(this, "textures", /* @__PURE__ */ new WeakMap());
+    p(this, "loadStatus", /* @__PURE__ */ new WeakMap());
+    p(this, "elementUrls", /* @__PURE__ */ new WeakMap());
+    p(this, "onUpdate");
     this.onUpdate = e, t && (this.observer = new IntersectionObserver(
       (r) => {
         for (const s of r) {
@@ -809,7 +809,7 @@ class st {
     e.nodeType === Node.ELEMENT_NODE && this.observer && this.observer.unobserve(e), this.disposeTexture(e), this.elementUrls.delete(e), this.loadStatus.delete(e);
   }
   loadTexture(e) {
-    return Te(this, null, function* () {
+    return Le(this, null, function* () {
       if (this.loadStatus.get(e) || this.textures.has(e))
         return;
       const t = this.elementUrls.get(e);
@@ -819,8 +819,8 @@ class st {
           let r;
           if (t.startsWith("data:image/svg+xml"))
             r = yield new Promise((c, o) => {
-              const a = new Image();
-              a.onload = () => c(a), a.onerror = o, a.src = t;
+              const n = new Image();
+              n.onload = () => c(n), n.onerror = o, n.src = t;
             });
           else {
             const o = yield (yield fetch(t)).blob();
@@ -851,35 +851,35 @@ class st {
     this.observer && this.observer.disconnect();
   }
 }
-class ot {
+class lt {
   constructor(e, t, r, s) {
-    g(this, "canvas");
-    g(this, "scene");
-    g(this, "camera");
-    g(this, "renderer");
-    g(this, "renderTargets", []);
-    g(this, "renderOrder", 0);
-    g(this, "qualityFactor", 2);
-    g(this, "mode", "overlay");
-    g(this, "canvasSize", "viewport");
-    g(this, "clipArea", 1);
-    g(this, "targetLayer", "base");
-    g(this, "overscan", 200);
-    g(this, "target");
-    g(this, "mountContainer");
-    g(this, "registry");
-    g(this, "targetRect");
-    g(this, "travelersByLayer", Array.from(
-      { length: N.MAX_LAYERS },
+    p(this, "canvas");
+    p(this, "scene");
+    p(this, "camera");
+    p(this, "renderer");
+    p(this, "renderTargets", []);
+    p(this, "renderOrder", 0);
+    p(this, "qualityFactor", 2);
+    p(this, "mode", "overlay");
+    p(this, "canvasSize", "viewport");
+    p(this, "clipArea", 1);
+    p(this, "targetLayer", "base");
+    p(this, "overscan", 200);
+    p(this, "target");
+    p(this, "mountContainer");
+    p(this, "registry");
+    p(this, "targetRect");
+    p(this, "travelersByLayer", Array.from(
+      { length: V.MAX_LAYERS },
       () => /* @__PURE__ */ new Set()
     ));
-    g(this, "textureManager");
+    p(this, "textureManager");
     // private meshMap: Map<HTMLElement, THREE.Mesh> = new Map();
-    g(this, "fixedMeshes", /* @__PURE__ */ new Set());
-    var a, l, n, u, h;
-    this.target = e, this.mountContainer = r, this.registry = s, this.mode = (a = t.mode) != null ? a : "overlay", this.canvasSize = (l = t.canvasSize) != null ? l : "viewport", this.clipArea = (n = t.travelerClipArea) != null ? n : 1, this.targetLayer = (u = t.layer) != null ? u : "base", this.textureManager = new st((d, p) => {
-      const f = this.registry.get(d);
-      f && f.material instanceof w.ShaderMaterial && W.forceUpdateUniforms(f.material, { texture: p });
+    p(this, "fixedMeshes", /* @__PURE__ */ new Set());
+    var n, l, a, u, h;
+    this.target = e, this.mountContainer = r, this.registry = s, this.mode = (n = t.mode) != null ? n : "overlay", this.canvasSize = (l = t.canvasSize) != null ? l : "viewport", this.clipArea = (a = t.travelerClipArea) != null ? a : 1, this.targetLayer = (u = t.layer) != null ? u : "base", this.textureManager = new nt((d, m) => {
+      const g = this.registry.get(d);
+      g && g.material instanceof w.ShaderMaterial && H.forceUpdateUniforms(g.material, { texture: m });
     }, this.isViewport), this.canvas = document.createElement("canvas"), this.scene = new w.Scene(), this.targetRect = this.target.getBoundingClientRect();
     const c = this.isViewport ? window.innerWidth + this.overscan * 2 : this.targetRect.width, o = this.isViewport ? window.innerHeight + this.overscan * 2 : this.targetRect.height;
     this.camera = new w.OrthographicCamera(
@@ -901,10 +901,10 @@ class ot {
     return this.mode === "overlay" && this.canvasSize === "viewport";
   }
   getSceneLayer() {
-    return typeof this.targetLayer == "number" ? this.targetLayer : this.targetLayer === "selected" ? F.SELECTED : F.BASE;
+    return typeof this.targetLayer == "number" ? this.targetLayer : this.targetLayer === "selected" ? O.SELECTED : O.BASE;
   }
   createRenderTarget() {
-    for (let e = 0; e < N.MAX_LAYERS; e++) {
+    for (let e = 0; e < V.MAX_LAYERS; e++) {
       const t = this.isViewport ? window.innerWidth + this.overscan * 2 : this.targetRect.width, r = this.isViewport ? window.innerHeight + this.overscan * 2 : this.targetRect.height;
       this.renderTargets.push(
         new w.WebGLRenderTarget(
@@ -951,12 +951,12 @@ class ot {
   updateUniforms(e, t) {
     const r = this.registry.get(e);
     r && (r.traverse((s) => {
-      s.isMesh && s.material && W.forceUpdateUniforms(
+      s.isMesh && s.material && H.forceUpdateUniforms(
         s.material,
         t
       );
     }), r.userData.nativeMesh && r.userData.nativeMesh.traverse((s) => {
-      s.isMesh && s.material && W.forceUpdateUniforms(
+      s.isMesh && s.material && H.forceUpdateUniforms(
         s.material,
         t
       );
@@ -972,8 +972,8 @@ class ot {
     this.camera.left = e / -2, this.camera.right = e / 2, this.camera.top = t / 2, this.camera.bottom = t / -2, this.camera.updateProjectionMatrix();
   }
   syncScene(e, t) {
-    const r = this.target.getBoundingClientRect(), s = this.isViewport ? window.innerWidth + this.overscan * 2 : r.width, c = this.isViewport ? window.innerHeight + this.overscan * 2 : r.height, o = this.isViewport ? this.canvas.clientWidth : this.targetRect.width, a = this.isViewport ? this.canvas.clientHeight : this.targetRect.height, l = Math.abs(s - o) > 0.1 || Math.abs(c - a) > 0.1, n = this.mode === "overlay" && (Math.abs(r.top - this.targetRect.top) > 0.1 || Math.abs(r.left - this.targetRect.left) > 0.1);
-    l ? (this.targetRect = r, this.setSize(s, c), this.updateCanvasLayout()) : n ? (this.targetRect = r, this.updateCanvasLayout()) : this.targetRect = r, this.renderOrder = 0, this.reconcileNode(e), t.size > 0 && t.forEach((u) => {
+    const r = this.target.getBoundingClientRect(), s = this.isViewport ? window.innerWidth + this.overscan * 2 : r.width, c = this.isViewport ? window.innerHeight + this.overscan * 2 : r.height, o = this.isViewport ? this.canvas.clientWidth : this.targetRect.width, n = this.isViewport ? this.canvas.clientHeight : this.targetRect.height, l = Math.abs(s - o) > 0.1 || Math.abs(c - n) > 0.1, a = this.mode === "overlay" && (Math.abs(r.top - this.targetRect.top) > 0.1 || Math.abs(r.left - this.targetRect.left) > 0.1);
+    l ? (this.targetRect = r, this.setSize(s, c), this.updateCanvasLayout()) : a ? (this.targetRect = r, this.updateCanvasLayout()) : this.targetRect = r, this.renderOrder = 0, this.reconcileNode(e), t.size > 0 && t.forEach((u) => {
       const h = this.registry.get(u);
       if (h) {
         this.scene.remove(h);
@@ -982,7 +982,7 @@ class ot {
         this.fixedMeshes.delete(h), h.geometry.dispose(), h.userData.nativeMesh && (this.scene.remove(h.userData.nativeMesh), Array.isArray(h.userData.nativeMesh.material) ? h.userData.nativeMesh.material.forEach(
           (d) => d.dispose()
         ) : h.userData.nativeMesh.material.dispose(), h.userData.nativeMesh.geometry.dispose()), h.traverse((d) => {
-          d instanceof w.Mesh && (d.geometry && d.geometry.dispose(), d.material && (Array.isArray(d.material) ? d.material.forEach((p) => p.dispose()) : d.material.dispose()));
+          d instanceof w.Mesh && (d.geometry && d.geometry.dispose(), d.material && (Array.isArray(d.material) ? d.material.forEach((m) => m.dispose()) : d.material.dispose()));
         }), this.registry.remove(u), this.textureManager.unregister(u);
       }
     });
@@ -996,20 +996,20 @@ class ot {
     let t = this.registry.get(e.element);
     const r = JSON.stringify(e.shaderHooks || null);
     if (t && t.userData.shaderHash !== r && (this.scene.remove(t), t.geometry.dispose(), t.material instanceof w.Material && t.material.dispose(), this.registry.remove(e.element), t = void 0), !t) {
-      const o = new w.PlaneGeometry(1, 1), a = e.isTraveler ? (s = this.renderTargets[e.captureLayer - 2]) == null ? void 0 : s.texture : this.textureManager.get(e.element), l = W.create(
+      const o = new w.PlaneGeometry(1, 1), n = e.isTraveler ? (s = this.renderTargets[e.captureLayer - 2]) == null ? void 0 : s.texture : this.textureManager.get(e.element), l = H.create(
         "BOX",
         e.styles,
         "",
         e.rect.width,
         e.rect.height,
         this.qualityFactor,
-        a,
+        n,
         e.shaderHooks
       );
       t = new w.Mesh(o, l), e.type === "TEXT" && (t.name = "BG_MESH"), this.scene.add(t), this.registry.register(e.element, t), t.userData.baseMaterial = l, t.userData.domElement = e.element, t.userData.shaderHash = r;
     }
     if (t.userData.clipElements = e.clipElements, (c = e.nativeStyles) != null && c.transform ? t.userData.nativeTransform = e.nativeStyles.transform : t.userData.nativeTransform = void 0, this.updateMeshProperties(t, e), this.updateMeshLayers(t, e), e.isTraveler)
-      for (let o = 0; o < N.MAX_LAYERS; o++)
+      for (let o = 0; o < V.MAX_LAYERS; o++)
         o === e.captureLayer - 2 ? this.travelersByLayer[o].add(t) : this.travelersByLayer[o].delete(t);
     else
       for (const o of this.travelersByLayer)
@@ -1025,35 +1025,35 @@ class ot {
       ));
   }
   reconcileTextChild(e, t, r) {
-    var n;
+    var a;
     const s = t.textLines || [
       { text: t.textContent || "", rect: t.rect }
-    ], c = r ? t.nativeStyles : t.textStyles, o = JSON.stringify(c) + t.textContent + s.map((u) => u.text).join("|"), a = (n = e.userData) == null ? void 0 : n.textChildStyleHash;
-    if (t.dirtyMask & ye || o !== a) {
+    ], c = r ? t.nativeStyles : t.textStyles, o = JSON.stringify(c) + t.textContent + s.map((u) => u.text).join("|"), n = (a = e.userData) == null ? void 0 : a.textChildStyleHash;
+    if (t.dirtyMask & Se || o !== n) {
       e.children.filter(
-        (f) => f.name.startsWith("TEXT_CHILD")
-      ).forEach((f) => {
-        var m;
-        const L = f;
-        (m = L.material.map) == null || m.dispose(), L.geometry.dispose(), e.remove(L);
+        (g) => g.name.startsWith("TEXT_CHILD")
+      ).forEach((g) => {
+        var v;
+        const R = g;
+        (v = R.material.map) == null || v.dispose(), R.geometry.dispose(), e.remove(R);
       });
-      const h = t.rect, d = h.x + h.width / 2, p = h.y + h.height / 2;
-      s.forEach((f, L) => {
-        const m = W.create(
+      const h = t.rect, d = h.x + h.width / 2, m = h.y + h.height / 2;
+      s.forEach((g, R) => {
+        const v = H.create(
           "TEXT",
           c,
-          f.text,
-          f.rect.width,
-          f.rect.height,
+          g.text,
+          g.rect.width,
+          g.rect.height,
           this.qualityFactor
-        ), y = new w.PlaneGeometry(1, 1), E = new w.Mesh(y, m);
-        E.name = `TEXT_CHILD_${L}`;
-        const A = t.rect.width === 0 ? 1 : f.rect.width / t.rect.width, C = t.rect.height === 0 ? 1 : f.rect.height / t.rect.height;
-        E.scale.set(A, C, 1);
-        const b = f.rect.x + f.rect.width / 2, S = f.rect.y + f.rect.height / 2, X = b - d, z = -(S - p);
+        ), y = new w.PlaneGeometry(1, 1), E = new w.Mesh(y, v);
+        E.name = `TEXT_CHILD_${R}`;
+        const L = t.rect.width === 0 ? 1 : g.rect.width / t.rect.width, C = t.rect.height === 0 ? 1 : g.rect.height / t.rect.height;
+        E.scale.set(L, C, 1);
+        const b = g.rect.x + g.rect.width / 2, x = g.rect.y + g.rect.height / 2, X = b - d, Y = -(x - m);
         E.position.set(
           t.rect.width === 0 ? 0 : X / t.rect.width,
-          t.rect.height === 0 ? 0 : z / t.rect.height,
+          t.rect.height === 0 ? 0 : Y / t.rect.height,
           5e-3
         ), e.add(E);
       }), e.userData.textChildStyleHash = o;
@@ -1063,22 +1063,22 @@ class ot {
         return;
       const h = u;
       if (r && t.nativeLayer !== void 0)
-        h.layers.set(F.HIDDEN), t.visibility & G && h.layers.enable(F.getCaptureLayer(t.nativeLayer));
+        h.layers.set(O.HIDDEN), t.visibility & $ && h.layers.enable(O.getCaptureLayer(t.nativeLayer));
       else {
-        const d = t.visibility & G ? F.BASE : F.HIDDEN;
-        if (h.layers.set(d), t.visibility & ae && h.layers.enable(F.SELECTED), t.visibility & G)
+        const d = t.visibility & $ ? O.BASE : O.HIDDEN;
+        if (h.layers.set(d), t.visibility & ne && h.layers.enable(O.SELECTED), t.visibility & $)
           if (!r && t.nativeLayer !== void 0 && t.nativeStyles !== void 0)
-            for (let p = t.captureLayer; p <= N.MAX_LAYERS + 1; p++)
-              p !== t.nativeLayer && h.layers.enable(F.getCaptureLayer(p));
+            for (let m = t.captureLayer; m <= V.MAX_LAYERS + 1; m++)
+              m !== t.nativeLayer && h.layers.enable(O.getCaptureLayer(m));
           else
-            for (let p = t.captureLayer; p <= N.MAX_LAYERS + 1; p++)
-              h.layers.enable(F.getCaptureLayer(p));
+            for (let m = t.captureLayer; m <= V.MAX_LAYERS + 1; m++)
+              h.layers.enable(O.getCaptureLayer(m));
       }
     });
   }
   updateMeshProperties(e, t) {
-    var C, b, S, X, z;
-    const { rect: r, styles: s } = t, c = this.renderer.getPixelRatio(), o = this.renderer.domElement.width / c, a = this.renderer.domElement.height / c;
+    var C, b, x, X, Y;
+    const { rect: r, styles: s } = t, c = this.renderer.getPixelRatio(), o = this.renderer.domElement.width / c, n = this.renderer.domElement.height / c;
     e.material = e.userData.baseMaterial;
     let l = ((C = e.material.userData) == null ? void 0 : C.shadowPadding) || 0;
     e.scale.set(r.width + l * 2, r.height + l * 2, 1), e.userData.domRect = {
@@ -1087,30 +1087,30 @@ class ot {
       width: r.width,
       height: r.height
     };
-    const n = 1e-3;
+    const a = 1e-3;
     this.renderOrder++;
     const u = this.targetRect.left + window.scrollX, h = this.targetRect.top + window.scrollY;
-    let d, p;
+    let d, m;
     if (this.isViewport)
-      d = r.x - window.innerWidth / 2 + r.width / 2, p = -r.y + window.innerHeight / 2 - r.height / 2;
+      d = r.x - window.innerWidth / 2 + r.width / 2, m = -r.y + window.innerHeight / 2 - r.height / 2;
     else {
-      const U = r.x - u, I = r.y - h;
-      d = U - o / 2 + r.width / 2, p = -I + a / 2 - r.height / 2;
+      const A = r.x - u, N = r.y - h;
+      d = A - o / 2 + r.width / 2, m = -N + n / 2 - r.height / 2;
     }
     e.position.set(
       d,
-      p,
-      s.zIndex + this.renderOrder * n
+      m,
+      s.zIndex + this.renderOrder * a
     );
-    const f = r.x, L = r.y;
-    e.userData.basePosition = { x: d, y: p }, e.userData.originalBasePosition = { x: d, y: p }, e.userData.baseSize = { width: r.width, height: r.height }, e.userData.baseDOM = { x: f, y: L }, e.userData.isFixed = t.isFixed, e.userData.initialScroll = { x: window.scrollX, y: window.scrollY };
-    const m = t.element.nodeType === Node.TEXT_NODE ? t.element.parentElement : t.element, y = window.getComputedStyle(m);
-    let E = 0, A = 0;
+    const g = r.x, R = r.y;
+    e.userData.basePosition = { x: d, y: m }, e.userData.originalBasePosition = { x: d, y: m }, e.userData.baseSize = { width: r.width, height: r.height }, e.userData.baseDOM = { x: g, y: R }, e.userData.isFixed = t.isFixed, e.userData.initialScroll = { x: window.scrollX, y: window.scrollY };
+    const v = t.element.nodeType === Node.TEXT_NODE ? t.element.parentElement : t.element, y = window.getComputedStyle(v);
+    let E = 0, L = 0;
     if (y.transform && y.transform !== "none") {
-      const U = new DOMMatrix(y.transform);
-      E = U.m41, A = U.m42;
+      const A = new DOMMatrix(y.transform);
+      E = A.m41, L = A.m42;
     }
-    if (e.userData.baseTransform = { x: E, y: A }, delete e.userData.originRatioX, delete e.userData.originRatioY, W.update(
+    if (e.userData.baseTransform = { x: E, y: L }, delete e.userData.originRatioX, delete e.userData.originRatioY, H.update(
       e.userData.baseMaterial,
       "BOX",
       s,
@@ -1121,127 +1121,127 @@ class ot {
       t.isTraveler ? (b = this.renderTargets[t.captureLayer - 2]) == null ? void 0 : b.texture : this.textureManager.get(t.element)
     ), t.nativeStyles && t.nativeRect) {
       if (!e.userData.nativeMesh) {
-        const B = W.create(
+        const F = H.create(
           "BOX",
           t.nativeStyles,
           "",
           t.nativeRect.width,
           t.nativeRect.height,
           this.qualityFactor,
-          t.isTraveler ? (S = this.renderTargets[t.captureLayer - 2]) == null ? void 0 : S.texture : this.textureManager.get(t.element),
+          t.isTraveler ? (x = this.renderTargets[t.captureLayer - 2]) == null ? void 0 : x.texture : t.nativeStyles.imageSrc && t.nativeStyles.imageSrc !== t.styles.imageSrc ? new w.TextureLoader().load(t.nativeStyles.imageSrc) : this.textureManager.get(t.element),
           t.shaderHooks
-        ), V = new w.Mesh(e.geometry, B);
-        t.type === "TEXT" && (V.name = "BG_MESH"), this.scene.add(V), e.userData.nativeMesh = V;
+        ), W = new w.Mesh(e.geometry, F);
+        t.type === "TEXT" && (W.name = "BG_MESH"), this.scene.add(W), e.userData.nativeMesh = W;
       }
-      const U = e.userData.nativeMesh;
-      let I, j;
+      const A = e.userData.nativeMesh;
+      let N, U;
       if (this.isViewport)
-        I = t.nativeRect.x - window.innerWidth / 2 + t.nativeRect.width / 2, j = -t.nativeRect.y + window.innerHeight / 2 - t.nativeRect.height / 2;
+        N = t.nativeRect.x - window.innerWidth / 2 + t.nativeRect.width / 2, U = -t.nativeRect.y + window.innerHeight / 2 - t.nativeRect.height / 2;
       else {
-        const B = t.nativeRect.x - u, V = t.nativeRect.y - h;
-        I = B - o / 2 + t.nativeRect.width / 2, j = -V + a / 2 - t.nativeRect.height / 2;
+        const F = t.nativeRect.x - u, W = t.nativeRect.y - h;
+        N = F - o / 2 + t.nativeRect.width / 2, U = -W + n / 2 - t.nativeRect.height / 2;
       }
-      let J = t.nativeRect.width, Z = t.nativeRect.height, M = I, O = j;
+      let K = t.nativeRect.width, J = t.nativeRect.height, M = N, B = U;
       if (t.nativeStyles.transform) {
-        const B = t.nativeStyles.transform, V = B.match(/scale\(([\d.]+%?)\)/);
-        if (V) {
-          let x = parseFloat(V[1]);
-          V[1].includes("%") && (x /= 100), J *= x, Z *= x;
-        }
-        const ie = B.match(/scaleX\(([\d.]+%?)\)/);
-        if (ie) {
-          let x = parseFloat(ie[1]);
-          ie[1].includes("%") && (x /= 100), J *= x;
+        const F = t.nativeStyles.transform, W = F.match(/scale\(([\d.]+%?)\)/);
+        if (W) {
+          let f = parseFloat(W[1]);
+          W[1].includes("%") && (f /= 100), K *= f, J *= f;
         }
-        const se = B.match(/scaleY\(([\d.]+%?)\)/);
+        const se = F.match(/scaleX\(([\d.]+%?)\)/);
         if (se) {
-          let x = parseFloat(se[1]);
-          se[1].includes("%") && (x /= 100), Z *= x;
+          let f = parseFloat(se[1]);
+          se[1].includes("%") && (f /= 100), K *= f;
         }
-        const oe = B.match(/translate\(([^,]+),\s*([^)]+)\)/);
+        const oe = F.match(/scaleY\(([\d.]+%?)\)/);
         if (oe) {
-          const x = oe[1].trim(), T = oe[2].trim();
-          let _ = parseFloat(x);
-          x.includes("%") && (_ = _ / 100 * t.nativeRect.width);
-          let D = parseFloat(T);
-          T.includes("%") && (D = D / 100 * t.nativeRect.height), M += _, O -= D;
+          let f = parseFloat(oe[1]);
+          oe[1].includes("%") && (f /= 100), J *= f;
         }
-        const he = B.match(/translateX\(([^)]+)\)/);
+        const ae = F.match(/translate\(([^,]+),\s*([^)]+)\)/);
+        if (ae) {
+          const f = ae[1].trim(), S = ae[2].trim();
+          let I = parseFloat(f);
+          f.includes("%") && (I = I / 100 * t.nativeRect.width);
+          let _ = parseFloat(S);
+          S.includes("%") && (_ = _ / 100 * t.nativeRect.height), M += I, B -= _;
+        }
+        const he = F.match(/translateX\(([^)]+)\)/);
         if (he) {
-          const x = he[1].trim();
-          let T = parseFloat(x);
-          x.includes("%") && (T = T / 100 * t.nativeRect.width), M += T;
+          const f = he[1].trim();
+          let S = parseFloat(f);
+          f.includes("%") && (S = S / 100 * t.nativeRect.width), M += S;
         }
-        const v = B.match(/translateY\(([^)]+)\)/);
-        if (v) {
-          const x = v[1].trim();
-          let T = parseFloat(x);
-          x.includes("%") && (T = T / 100 * t.nativeRect.height), O -= T;
+        const de = F.match(/translateY\(([^)]+)\)/);
+        if (de) {
+          const f = de[1].trim();
+          let S = parseFloat(f);
+          f.includes("%") && (S = S / 100 * t.nativeRect.height), B -= S;
         }
       }
-      let K = ((X = U.material.userData) == null ? void 0 : X.shadowPadding) || 0;
-      U.scale.set(J + K * 2, Z + K * 2, 1), U.position.set(
+      let Z = ((X = A.material.userData) == null ? void 0 : X.shadowPadding) || 0;
+      A.scale.set(K + Z * 2, J + Z * 2, 1), A.position.set(
         M,
-        O,
-        t.nativeStyles.zIndex + this.renderOrder * n
-      ), W.update(
-        U.material,
+        B,
+        t.nativeStyles.zIndex + this.renderOrder * a
+      ), H.update(
+        A.material,
         "BOX",
         t.nativeStyles,
         "",
         t.nativeRect.width,
         t.nativeRect.height,
         this.qualityFactor,
-        t.isTraveler ? (z = this.renderTargets[t.captureLayer - 2]) == null ? void 0 : z.texture : this.textureManager.get(t.element)
+        t.isTraveler ? (Y = this.renderTargets[t.captureLayer - 2]) == null ? void 0 : Y.texture : A.material.uniforms.uTexture.value || this.textureManager.get(t.element)
       );
     } else
       e.userData.nativeMesh && (this.scene.remove(e.userData.nativeMesh), e.userData.nativeMesh.material instanceof w.Material && e.userData.nativeMesh.material.dispose(), delete e.userData.nativeMesh);
   }
   updateMeshLayers(e, t) {
-    const r = t.visibility & G ? F.BASE : F.HIDDEN;
-    if (e.layers.set(r), t.visibility & ae && e.layers.enable(F.SELECTED), e.userData.nativeMesh && t.nativeLayer !== void 0) {
+    const r = t.visibility & $ ? O.BASE : O.HIDDEN;
+    if (e.layers.set(r), t.visibility & ne && e.layers.enable(O.SELECTED), e.userData.nativeMesh && t.nativeLayer !== void 0) {
       const s = e.userData.nativeMesh;
-      if (s.layers.set(F.HIDDEN), t.visibility & G) {
-        s.layers.enable(F.getCaptureLayer(t.nativeLayer));
-        for (let c = t.captureLayer; c <= N.MAX_LAYERS + 1; c++)
-          c !== t.nativeLayer && e.layers.enable(F.getCaptureLayer(c));
+      if (s.layers.set(O.HIDDEN), t.visibility & $) {
+        s.layers.enable(O.getCaptureLayer(t.nativeLayer));
+        for (let c = t.captureLayer; c <= V.MAX_LAYERS + 1; c++)
+          c !== t.nativeLayer && e.layers.enable(O.getCaptureLayer(c));
       }
-    } else if (t.visibility & G)
-      for (let s = t.captureLayer; s <= N.MAX_LAYERS + 1; s++)
-        e.layers.enable(F.getCaptureLayer(s));
+    } else if (t.visibility & $)
+      for (let s = t.captureLayer; s <= V.MAX_LAYERS + 1; s++)
+        e.layers.enable(O.getCaptureLayer(s));
   }
   captureRenderTarget(e, t, r) {
     if (e.size === 0 || !r)
       return;
     const s = new w.Color(), c = this.renderer.getClearAlpha();
     this.renderer.getClearColor(s), this.renderer.setClearColor(0, 0), this.renderer.setRenderTarget(r), this.renderer.clear(), this.renderer.autoClear = !1, this.renderer.setScissorTest(!0), this.camera.layers.set(t);
-    const o = new w.Vector3(), a = this.isViewport ? window.innerWidth + this.overscan * 2 : this.targetRect.width, l = this.isViewport ? window.innerHeight + this.overscan * 2 : this.targetRect.height, n = this.renderer.getPixelRatio();
+    const o = new w.Vector3(), n = this.isViewport ? window.innerWidth + this.overscan * 2 : this.targetRect.width, l = this.isViewport ? window.innerHeight + this.overscan * 2 : this.targetRect.height, a = this.renderer.getPixelRatio();
     for (const u of e) {
       o.setFromMatrixPosition(u.matrixWorld), o.project(this.camera);
-      const h = (o.x + 1) / 2 * a, d = (o.y + 1) / 2 * l;
-      let p = 0, f = 1;
-      typeof this.clipArea == "number" ? f = this.clipArea : this.clipArea.endsWith("%") ? f = parseFloat(this.clipArea) / 100 : this.clipArea.endsWith("px") && (p = parseFloat(this.clipArea));
-      const L = u.scale.x * f + 0.5, m = u.scale.y * f + 0.5, y = h - L / 2, E = d - m / 2, A = (y * this.qualityFactor - p) / n, C = (E * this.qualityFactor - p) / n, b = (L * this.qualityFactor + p * 2) / n, S = (m * this.qualityFactor + p * 2) / n;
-      this.renderer.setScissor(A, C, b, S), this.renderer.render(this.scene, this.camera);
+      const h = (o.x + 1) / 2 * n, d = (o.y + 1) / 2 * l;
+      let m = 0, g = 1;
+      typeof this.clipArea == "number" ? g = this.clipArea : this.clipArea.endsWith("%") ? g = parseFloat(this.clipArea) / 100 : this.clipArea.endsWith("px") && (m = parseFloat(this.clipArea));
+      const R = u.scale.x * g + 0.5, v = u.scale.y * g + 0.5, y = h - R / 2, E = d - v / 2, L = (y * this.qualityFactor - m) / a, C = (E * this.qualityFactor - m) / a, b = (R * this.qualityFactor + m * 2) / a, x = (v * this.qualityFactor + m * 2) / a;
+      this.renderer.setScissor(L, C, b, x), this.renderer.render(this.scene, this.camera);
     }
     this.renderer.setScissorTest(!1), this.renderer.autoClear = !0, this.renderer.setRenderTarget(null), this.camera.layers.set(this.getSceneLayer()), this.renderer.setClearColor(s, c);
   }
   render() {
-    for (let l = 0; l < N.MAX_LAYERS; l++) {
-      const n = l + 1;
+    for (let l = 0; l < V.MAX_LAYERS; l++) {
+      const a = l + 1;
       this.captureRenderTarget(
         this.travelersByLayer[l],
-        F.getCaptureLayer(n),
+        O.getCaptureLayer(a),
         this.renderTargets[l]
       );
     }
-    const e = this.renderer.getContext(), t = this.renderer.getPixelRatio(), r = this.renderer.domElement.height / t, s = this.renderer.domElement, c = s.getBoundingClientRect().top, o = s.getBoundingClientRect().left, a = (l, n) => {
-      if (n && n.width > 0 && n.height > 0) {
-        const u = Math.floor((n.x - o) * t), h = Math.floor(
-          (r - (n.y - c + n.height)) * t
-        ), d = Math.ceil(n.width * t), p = Math.ceil(n.height * t);
+    const e = this.renderer.getContext(), t = this.renderer.getPixelRatio(), r = this.renderer.domElement.height / t, s = this.renderer.domElement, c = s.getBoundingClientRect().top, o = s.getBoundingClientRect().left, n = (l, a) => {
+      if (a && a.width > 0 && a.height > 0) {
+        const u = Math.floor((a.x - o) * t), h = Math.floor(
+          (r - (a.y - c + a.height)) * t
+        ), d = Math.ceil(a.width * t), m = Math.ceil(a.height * t);
         l.onBeforeRender = () => {
-          e.enable(e.SCISSOR_TEST), e.scissor(u, h, d, p);
+          e.enable(e.SCISSOR_TEST), e.scissor(u, h, d, m);
         }, l.onAfterRender = () => {
           e.disable(e.SCISSOR_TEST);
         }, l.__hasScissorHook = !0;
@@ -1252,9 +1252,9 @@ class ot {
     };
     this.scene.children.forEach((l) => {
       var h;
-      const n = l, u = (h = n.userData) == null ? void 0 : h.scissorRect;
-      a(n, u), n.children.forEach((d) => {
-        d.name.startsWith("TEXT_CHILD") && a(d, u);
+      const a = l, u = (h = a.userData) == null ? void 0 : h.scissorRect;
+      n(a, u), a.children.forEach((d) => {
+        d.name.startsWith("TEXT_CHILD") && n(d, u);
       });
     }), this.renderer.render(this.scene, this.camera);
   }
@@ -1262,116 +1262,116 @@ class ot {
     const e = this.targetRect.left + window.scrollX, t = this.targetRect.top + window.scrollY, r = this.renderer.getPixelRatio(), s = this.renderer.domElement.width / r, c = this.renderer.domElement.height / r;
     this.scene.children.forEach((o) => {
       var h, d;
-      const a = o;
-      if (!a.userData || !a.userData.domElement)
+      const n = o;
+      if (!n.userData || !n.userData.domElement)
         return;
-      const l = a.userData.domElement;
+      const l = n.userData.domElement;
       if (!l.isConnected)
         return;
-      let n;
+      let a;
       if (l.nodeType === Node.TEXT_NODE) {
-        const p = document.createRange();
-        p.selectNode(l), n = p.getBoundingClientRect();
+        const m = document.createRange();
+        m.selectNode(l), a = m.getBoundingClientRect();
       } else
-        n = l.getBoundingClientRect();
-      const u = a.userData.domRect;
-      if (!u || Math.abs(n.x - u.x) > 0.5 || Math.abs(n.y - u.y) > 0.5 || Math.abs(n.width - u.width) > 0.5 || Math.abs(n.height - u.height) > 0.5) {
-        a.userData.domRect = {
-          x: n.x,
-          y: n.y,
-          width: n.width,
-          height: n.height
+        a = l.getBoundingClientRect();
+      const u = n.userData.domRect;
+      if (!u || Math.abs(a.x - u.x) > 0.5 || Math.abs(a.y - u.y) > 0.5 || Math.abs(a.width - u.width) > 0.5 || Math.abs(a.height - u.height) > 0.5) {
+        n.userData.domRect = {
+          x: a.x,
+          y: a.y,
+          width: a.width,
+          height: a.height
         };
-        const p = a.userData.clipElements;
-        if (p && p.length > 0) {
-          let y = -1 / 0, E = -1 / 0, A = 1 / 0, C = 1 / 0;
-          for (const b of p) {
-            const S = b.getBoundingClientRect();
-            y = Math.max(y, S.left), E = Math.max(E, S.top), A = Math.min(A, S.right), C = Math.min(C, S.bottom);
+        const m = n.userData.clipElements;
+        if (m && m.length > 0) {
+          let y = -1 / 0, E = -1 / 0, L = 1 / 0, C = 1 / 0;
+          for (const b of m) {
+            const x = b.getBoundingClientRect();
+            y = Math.max(y, x.left), E = Math.max(E, x.top), L = Math.min(L, x.right), C = Math.min(C, x.bottom);
           }
-          a.userData.scissorRect = {
+          n.userData.scissorRect = {
             x: y,
             y: E,
-            width: Math.max(0, A - y),
+            width: Math.max(0, L - y),
             height: Math.max(0, C - E)
           };
         } else
-          a.userData.scissorRect = void 0;
-        let f, L;
+          n.userData.scissorRect = void 0;
+        let g, R;
         if (this.isViewport)
-          f = n.x - window.innerWidth / 2 + n.width / 2, L = -n.y + window.innerHeight / 2 - n.height / 2;
+          g = a.x - window.innerWidth / 2 + a.width / 2, R = -a.y + window.innerHeight / 2 - a.height / 2;
         else {
-          const y = n.x - e, E = n.y - t;
-          f = y - s / 2 + n.width / 2, L = -E + c / 2 - n.height / 2;
+          const y = a.x - e, E = a.y - t;
+          g = y - s / 2 + a.width / 2, R = -E + c / 2 - a.height / 2;
         }
-        a.position.setX(f), a.position.setY(L);
-        let m = ((h = a.material.userData) == null ? void 0 : h.shadowPadding) || 0;
-        if (a.scale.set(n.width + m * 2, n.height + m * 2, 1), a.updateMatrixWorld(), a.material instanceof w.ShaderMaterial && W.forceUpdateUniforms(a.material, {
-          width: n.width,
-          height: n.height
-        }), a.userData.nativeMesh) {
-          const y = a.userData.nativeMesh;
-          let E = n.width, A = n.height, C = f, b = L;
-          if (a.userData.nativeTransform) {
-            const X = a.userData.nativeTransform, z = X.match(/scale\(([\d.]+%?)\)/);
-            if (z) {
-              let M = parseFloat(z[1]);
-              z[1].includes("%") && (M /= 100), E *= M, A *= M;
+        n.position.setX(g), n.position.setY(R);
+        let v = ((h = n.material.userData) == null ? void 0 : h.shadowPadding) || 0;
+        if (n.scale.set(a.width + v * 2, a.height + v * 2, 1), n.updateMatrixWorld(), n.material instanceof w.ShaderMaterial && H.forceUpdateUniforms(n.material, {
+          width: a.width,
+          height: a.height
+        }), n.userData.nativeMesh) {
+          const y = n.userData.nativeMesh;
+          let E = a.width, L = a.height, C = g, b = R;
+          if (n.userData.nativeTransform) {
+            const X = n.userData.nativeTransform, Y = X.match(/scale\(([\d.]+%?)\)/);
+            if (Y) {
+              let M = parseFloat(Y[1]);
+              Y[1].includes("%") && (M /= 100), E *= M, L *= M;
             }
-            const U = X.match(/scaleX\(([\d.]+%?)\)/);
-            if (U) {
-              let M = parseFloat(U[1]);
-              U[1].includes("%") && (M /= 100), E *= M;
+            const A = X.match(/scaleX\(([\d.]+%?)\)/);
+            if (A) {
+              let M = parseFloat(A[1]);
+              A[1].includes("%") && (M /= 100), E *= M;
             }
-            const I = X.match(/scaleY\(([\d.]+%?)\)/);
-            if (I) {
-              let M = parseFloat(I[1]);
-              I[1].includes("%") && (M /= 100), A *= M;
+            const N = X.match(/scaleY\(([\d.]+%?)\)/);
+            if (N) {
+              let M = parseFloat(N[1]);
+              N[1].includes("%") && (M /= 100), L *= M;
+            }
+            const U = X.match(/translate\(([^,]+),\s*([^)]+)\)/);
+            if (U) {
+              const M = U[1].trim(), B = U[2].trim();
+              let Z = parseFloat(M);
+              M.includes("%") && (Z = Z / 100 * a.width);
+              let F = parseFloat(B);
+              B.includes("%") && (F = F / 100 * a.height), C += Z, b -= F;
             }
-            const j = X.match(/translate\(([^,]+),\s*([^)]+)\)/);
-            if (j) {
-              const M = j[1].trim(), O = j[2].trim();
-              let K = parseFloat(M);
-              M.includes("%") && (K = K / 100 * n.width);
-              let B = parseFloat(O);
-              O.includes("%") && (B = B / 100 * n.height), C += K, b -= B;
+            const K = X.match(/translateX\(([^)]+)\)/);
+            if (K) {
+              const M = K[1].trim();
+              let B = parseFloat(M);
+              M.includes("%") && (B = B / 100 * a.width), C += B;
             }
-            const J = X.match(/translateX\(([^)]+)\)/);
+            const J = X.match(/translateY\(([^)]+)\)/);
             if (J) {
               const M = J[1].trim();
-              let O = parseFloat(M);
-              M.includes("%") && (O = O / 100 * n.width), C += O;
-            }
-            const Z = X.match(/translateY\(([^)]+)\)/);
-            if (Z) {
-              const M = Z[1].trim();
-              let O = parseFloat(M);
-              M.includes("%") && (O = O / 100 * n.height), b -= O;
+              let B = parseFloat(M);
+              M.includes("%") && (B = B / 100 * a.height), b -= B;
             }
           }
-          let S = ((d = y.material.userData) == null ? void 0 : d.shadowPadding) || 0;
-          y.position.setX(C), y.position.setY(b), y.scale.set(E + S * 2, A + S * 2, 1), y.updateMatrixWorld(), y.material instanceof w.ShaderMaterial && W.forceUpdateUniforms(y.material, {
+          let x = ((d = y.material.userData) == null ? void 0 : d.shadowPadding) || 0;
+          y.position.setX(C), y.position.setY(b), y.scale.set(E + x * 2, L + x * 2, 1), y.updateMatrixWorld(), y.material instanceof w.ShaderMaterial && H.forceUpdateUniforms(y.material, {
             width: E,
-            height: A
+            height: L
           });
         }
       }
     });
   }
 }
-function nt(i) {
+function ct(i) {
   const e = i.textContent || "", t = [];
   let r = "", s = null, c = -1;
-  const o = (n, u) => {
-    for (let h = 0; h < n.length; h++) {
-      const d = n[h], p = document.createRange();
-      p.setStart(i, u + h), p.setEnd(i, u + h + 1);
-      const f = p.getBoundingClientRect();
-      if (f.width === 0 && f.height === 0) {
+  const o = (a, u) => {
+    for (let h = 0; h < a.length; h++) {
+      const d = a[h], m = document.createRange();
+      m.setStart(i, u + h), m.setEnd(i, u + h + 1);
+      const g = m.getBoundingClientRect();
+      if (g.width === 0 && g.height === 0) {
         r += d;
         continue;
       }
-      c === -1 || Math.abs(f.top - c) > f.height / 2 ? (r && s && t.push({
+      c === -1 || Math.abs(g.top - c) > g.height / 2 ? (r && s && t.push({
         text: r,
         rect: {
           left: s.left,
@@ -1380,27 +1380,27 @@ function nt(i) {
           height: s.bottom - s.top
         }
       }), r = d, s = {
-        left: f.left,
-        top: f.top,
-        right: f.right,
-        bottom: f.bottom
-      }, c = f.top) : (r += d, s && (s.left = Math.min(s.left, f.left), s.top = Math.min(s.top, f.top), s.right = Math.max(s.right, f.right), s.bottom = Math.max(
+        left: g.left,
+        top: g.top,
+        right: g.right,
+        bottom: g.bottom
+      }, c = g.top) : (r += d, s && (s.left = Math.min(s.left, g.left), s.top = Math.min(s.top, g.top), s.right = Math.max(s.right, g.right), s.bottom = Math.max(
         s.bottom,
-        f.bottom
+        g.bottom
       )));
     }
-  }, a = e.match(/[^\s\-]+\-?|\-|\s+/g) || [];
+  }, n = e.match(/[^\s\-]+\-?|\-|\s+/g) || [];
   let l = 0;
-  for (const n of a) {
+  for (const a of n) {
     const u = document.createRange();
-    u.setStart(i, l), u.setEnd(i, l + n.length);
+    u.setStart(i, l), u.setEnd(i, l + a.length);
     const h = u.getClientRects();
     if (h.length > 1)
-      o(n, l);
+      o(a, l);
     else {
       const d = h.length === 1 ? h[0] : u.getBoundingClientRect();
       if (d.width === 0 && d.height === 0) {
-        r += n, l += n.length;
+        r += a, l += a.length;
         continue;
       }
       c === -1 || Math.abs(d.top - c) > d.height / 2 ? (r && s && t.push({
@@ -1411,17 +1411,17 @@ function nt(i) {
           width: s.right - s.left,
           height: s.bottom - s.top
         }
-      }), r = n, s = {
+      }), r = a, s = {
         left: d.left,
         top: d.top,
         right: d.right,
         bottom: d.bottom
-      }, c = d.top) : (r += n, s && (s.left = Math.min(s.left, d.left), s.top = Math.min(s.top, d.top), s.right = Math.max(s.right, d.right), s.bottom = Math.max(
+      }, c = d.top) : (r += a, s && (s.left = Math.min(s.left, d.left), s.top = Math.min(s.top, d.top), s.right = Math.max(s.right, d.right), s.bottom = Math.max(
         s.bottom,
         d.bottom
       )));
     }
-    l += n.length;
+    l += a.length;
   }
   return r && s && t.push({
     text: r,
@@ -1432,10 +1432,10 @@ function nt(i) {
       height: s.bottom - s.top
     }
   }), t.filter(
-    (n) => n.text.trim().length > 0 && n.rect.width > 0 && n.rect.height > 0
+    (a) => a.text.trim().length > 0 && a.rect.width > 0 && a.rect.height > 0
   );
 }
-function Ae(i) {
+function Ue(i) {
   const e = parseFloat(i.fontSize);
   let t = parseFloat(i.lineHeight);
   isNaN(t) && (t = e * 1.2);
@@ -1451,74 +1451,74 @@ function Ae(i) {
     letterSpacing: r
   };
 }
-function Fe(i, e = re | ue | Pe | ye | pe, t, r = 1, s = 0, c = 2, o, a, l) {
-  var K, B, V, ie, se, oe, he;
+function Xe(i, e = ie | fe | qe | Se | me, t, r = 1, s = 0, c = 2, o, n, l) {
+  var F, W, se, oe, ae, he, de;
   if (i.nodeType === Node.TEXT_NODE) {
-    const v = i;
-    if (!v.textContent || !v.textContent.trim())
+    const f = i;
+    if (!f.textContent || !f.textContent.trim())
       return null;
-    const x = v.textContent.replace(/\s+/g, " ");
-    if (x.length === 0)
+    const S = f.textContent.replace(/\s+/g, " ");
+    if (S.length === 0)
       return null;
-    const T = nt(v);
-    if (T.length === 0)
+    const I = ct(f);
+    if (I.length === 0)
       return null;
-    const _ = v.parentElement, D = _ ? window.getComputedStyle(_) : null;
-    if (!D)
+    const _ = f.parentElement, k = _ ? window.getComputedStyle(_) : null;
+    if (!k)
       return null;
-    const q = Math.min(...T.map((R) => R.rect.left)), Y = Math.min(...T.map((R) => R.rect.top)), Q = Math.max(...T.map((R) => R.rect.left + R.rect.width)), k = Math.max(...T.map((R) => R.rect.top + R.rect.height));
+    const P = Math.min(...I.map((T) => T.rect.left)), z = Math.min(...I.map((T) => T.rect.top)), Q = Math.max(...I.map((T) => T.rect.left + T.rect.width)), D = Math.max(...I.map((T) => T.rect.top + T.rect.height));
     return {
       id: Math.random().toString(36).substring(2, 9),
       type: "TEXT",
-      element: v,
+      element: f,
       rect: {
-        x: q + window.scrollX,
-        y: Y + window.scrollY,
-        width: Q - q,
-        height: k - Y
+        x: P + window.scrollX,
+        y: z + window.scrollY,
+        width: Q - P,
+        height: D - z
       },
       styles: {
         backgroundColor: "transparent",
         backgroundImage: "",
-        opacity: _ && _.dataset[ee.KEY] === ee.VALUES.HIDE ? 1 : parseFloat(D.opacity),
-        zIndex: (isNaN(parseInt(D.zIndex)) ? 0 : parseInt(D.zIndex)) + s,
+        opacity: _ && _.dataset[te.KEY] === te.VALUES.HIDE ? 1 : parseFloat(k.opacity),
+        zIndex: (isNaN(parseInt(k.zIndex)) ? 0 : parseInt(k.zIndex)) + s,
         borderRadius: "0px",
         borderColor: "transparent",
         borderWidth: "0px",
         isTraveler: !1
       },
-      textContent: x,
-      textLines: T.map((R) => ({
-        text: R.text.trim(),
+      textContent: S,
+      textLines: I.map((T) => ({
+        text: T.text.trim(),
         rect: {
-          x: R.rect.left + window.scrollX,
-          y: R.rect.top + window.scrollY,
-          width: R.rect.width,
-          height: R.rect.height
+          x: T.rect.left + window.scrollX,
+          y: T.rect.top + window.scrollY,
+          width: T.rect.width,
+          height: T.rect.height
         }
       })),
-      textStyles: Ae(D),
+      textStyles: Ue(k),
       dirtyMask: e,
       visibility: t,
       isTraveler: !1,
       captureLayer: r,
-      isFixed: D.position === "fixed",
+      isFixed: k.position === "fixed",
       nativeLayer: o,
-      nativeStyles: a ? te(te({
+      nativeStyles: n ? re(re({
         backgroundColor: "transparent",
         backgroundImage: "",
-        opacity: _ && _.dataset[ee.KEY] === ee.VALUES.HIDE ? 1 : parseFloat(D.opacity),
-        zIndex: (isNaN(parseInt(D.zIndex)) ? 0 : parseInt(D.zIndex)) + s,
+        opacity: _ && _.dataset[te.KEY] === te.VALUES.HIDE ? 1 : parseFloat(k.opacity),
+        zIndex: (isNaN(parseInt(k.zIndex)) ? 0 : parseInt(k.zIndex)) + s,
         borderRadius: "0px",
         borderColor: "transparent",
         borderWidth: "0px",
         isTraveler: !1
-      }, Ae(D)), a) : void 0,
-      nativeRect: a ? {
-        x: q + window.scrollX,
-        y: Y + window.scrollY,
-        width: Q - q,
-        height: k - Y
+      }, Ue(k)), n) : void 0,
+      nativeRect: n ? {
+        x: P + window.scrollX,
+        y: z + window.scrollY,
+        width: Q - P,
+        height: D - z
       } : void 0,
       clipElements: l,
       children: []
@@ -1526,244 +1526,248 @@ function Fe(i, e = re | ue | Pe | ye | pe, t, r = 1, s = 0, c = 2, o, a, l) {
   }
   if (i.nodeType !== Node.ELEMENT_NODE)
     return null;
-  const n = i, u = n.dataset[H.KEY];
+  const a = i, u = a.dataset[q.KEY];
   let h = t, d = t;
   if (u) {
-    const v = new Set(u.split(/\s+/));
-    for (const x of v)
-      if (!Me.includes(x))
+    const f = new Set(u.split(/\s+/));
+    for (const S of f)
+      if (!Ae.includes(S))
         throw new Error(
-          `[MirageEngine] Invalid filter token: '${x}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`
+          `[MirageEngine] Invalid filter token: '${S}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`
         );
-    if (v.has(H.VALUES.END))
+    if (f.has(q.VALUES.END))
       return null;
-    if (v.has(H.VALUES.INCLUDE_TREE) && v.has(H.VALUES.EXCLUDE_TREE))
+    if (f.has(q.VALUES.INCLUDE_TREE) && f.has(q.VALUES.EXCLUDE_TREE))
       throw new Error(
         "[MirageEngine] Conflicting filters: 'include-tree' and 'exclude-tree' cannot be used together on the same element."
       );
-    if (v.has(H.VALUES.INCLUDE_SELF) && v.has(H.VALUES.EXCLUDE_SELF))
+    if (f.has(q.VALUES.INCLUDE_SELF) && f.has(q.VALUES.EXCLUDE_SELF))
       throw new Error(
         "[MirageEngine] Conflicting filters: 'include-self' and 'exclude-self' cannot be used together on the same element."
       );
-    v.has(H.VALUES.INCLUDE_TREE) ? h = h | G : v.has(H.VALUES.EXCLUDE_TREE) && (h = h & ~G), d = h, v.has(H.VALUES.INCLUDE_SELF) ? d = d | G : v.has(H.VALUES.EXCLUDE_SELF) && (d = d & ~G);
+    f.has(q.VALUES.INCLUDE_TREE) ? h = h | $ : f.has(q.VALUES.EXCLUDE_TREE) && (h = h & ~$), d = h, f.has(q.VALUES.INCLUDE_SELF) ? d = d | $ : f.has(q.VALUES.EXCLUDE_SELF) && (d = d & ~$);
   }
-  const p = n.dataset[$.KEY];
-  if (p) {
-    const v = new Set(p.split(/\s+/));
-    for (const x of v)
-      if (!Me.includes(x))
+  const m = a.dataset[j.KEY];
+  if (m) {
+    const f = new Set(m.split(/\s+/));
+    for (const S of f)
+      if (!Ae.includes(S))
         throw new Error(
-          `[MirageEngine] Invalid select token: '${x}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`
+          `[MirageEngine] Invalid select token: '${S}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`
         );
-    if (v.has($.VALUES.END))
+    if (f.has(j.VALUES.END))
       return null;
-    if (v.has($.VALUES.INCLUDE_TREE) && v.has($.VALUES.EXCLUDE_TREE))
+    if (f.has(j.VALUES.INCLUDE_TREE) && f.has(j.VALUES.EXCLUDE_TREE))
       throw new Error(
         "[MirageEngine] Conflicting selects: 'include-tree' and 'exclude-tree' cannot be used together on the same element."
       );
-    if (v.has($.VALUES.INCLUDE_SELF) && v.has($.VALUES.EXCLUDE_SELF))
+    if (f.has(j.VALUES.INCLUDE_SELF) && f.has(j.VALUES.EXCLUDE_SELF))
       throw new Error(
         "[MirageEngine] Conflicting selects: 'include-self' and 'exclude-self' cannot be used together on the same element."
       );
-    v.has($.VALUES.INCLUDE_TREE) ? h = h | ae : v.has($.VALUES.EXCLUDE_TREE) && (h = h & ~ae), d = h, v.has($.VALUES.INCLUDE_SELF) ? d = d | ae : v.has($.VALUES.EXCLUDE_SELF) && (d = d & ~ae);
-  }
-  const f = n.dataset[N.KEY];
-  let L = !1, m = a ? te({}, a) : {}, y = o;
-  if (f) {
-    let v = 1;
-    const x = f.indexOf("{"), T = f.lastIndexOf("}");
-    let _ = f;
-    if (x !== -1 && T !== -1 && T > x) {
-      _ = f.substring(0, x).trim();
-      const k = f.substring(x, T + 1);
+    f.has(j.VALUES.INCLUDE_TREE) ? h = h | ne : f.has(j.VALUES.EXCLUDE_TREE) && (h = h & ~ne), d = h, f.has(j.VALUES.INCLUDE_SELF) ? d = d | ne : f.has(j.VALUES.EXCLUDE_SELF) && (d = d & ~ne);
+  }
+  const g = a.dataset[V.KEY];
+  let R = !1, v = n ? re({}, n) : {}, y = o;
+  if (g) {
+    let f = 1;
+    const S = g.indexOf("{"), I = g.lastIndexOf("}");
+    let _ = g;
+    if (S !== -1 && I !== -1 && I > S) {
+      _ = g.substring(0, S).trim();
+      const D = g.substring(S, I + 1);
       try {
-        m = new Function("return " + k)();
-      } catch (R) {
+        v = new Function("return " + D)();
+      } catch (T) {
         console.warn(
-          `[MirageEngine] Failed to parse travel styles JSON: ${k}`
+          `[MirageEngine] Failed to parse travel styles JSON: ${D}`
         );
       }
     }
-    const D = _.split(/\s+/);
-    let q = !1;
-    const Y = D.indexOf(N.VALUES.TRAVELER);
-    if (Y !== -1) {
-      L = !0, q = !0;
-      const k = D[Y + 1];
-      if (k && !isNaN(parseInt(k, 10)))
-        v = parseInt(k, 10);
+    const k = _.split(/\s+/);
+    let P = !1;
+    const z = k.indexOf(V.VALUES.TRAVELER);
+    if (z !== -1) {
+      R = !0, P = !0;
+      const D = k[z + 1];
+      if (D && !isNaN(parseInt(D, 10)))
+        f = parseInt(D, 10);
       else {
-        const R = D.find((ne) => !isNaN(parseInt(ne, 10)));
-        R && (v = parseInt(R, 10));
+        const T = k.find((ee) => !isNaN(parseInt(ee, 10)));
+        T && (f = parseInt(T, 10));
       }
     }
-    const Q = D.indexOf(N.VALUES.NATIVE);
+    const Q = k.indexOf(V.VALUES.NATIVE);
     if (Q !== -1) {
-      const k = D[Q + 1];
-      if (k && !isNaN(parseInt(k, 10)))
-        y = parseInt(k, 10);
-      else if (!L) {
-        const R = D.find((ne) => !isNaN(parseInt(ne, 10)));
-        R && (y = parseInt(R, 10));
+      const D = k[Q + 1];
+      if (D && !isNaN(parseInt(D, 10)))
+        y = parseInt(D, 10);
+      else if (!R) {
+        const T = k.find((ee) => !isNaN(parseInt(ee, 10)));
+        T && (y = parseInt(T, 10));
       }
     }
-    if (q) {
-      const k = v + 1;
-      if (k < r)
+    if (P) {
+      const D = f + 1;
+      if (D < r)
         throw new Error(
-          `[MirageEngine] Traveler layer (${v}) cannot be smaller than inherited capture layer (${r - 1}).`
+          `[MirageEngine] Traveler layer (${f}) cannot be smaller than inherited capture layer (${r - 1}).`
         );
-      r = Math.min(k, N.MAX_LAYERS + 1);
+      r = Math.min(D, V.MAX_LAYERS + 1);
     }
   }
-  const E = n.dataset[We.KEY];
-  let A;
-  E && (A = JSON.parse(E));
-  const C = n.getBoundingClientRect(), b = window.getComputedStyle(n);
+  const E = a.dataset[Ge.KEY];
+  let L;
+  E && (L = JSON.parse(E));
+  const C = a.getBoundingClientRect(), b = window.getComputedStyle(a);
   if (C.width === 0 || C.height === 0 || b.display === "none")
     return null;
-  let S = n.getAttribute("data-mid");
-  S || (S = Math.random().toString(36).substring(2, 11), n.setAttribute("data-mid", S));
-  const X = parseInt(b.zIndex), z = (isNaN(X) ? 0 : X) + s;
-  let U;
-  if (n.tagName === "IMG")
-    U = n.src;
-  else if (n.tagName.toLowerCase() === "svg") {
-    const v = n.cloneNode(!0), x = m == null ? void 0 : m.color, T = m == null ? void 0 : m.fill, _ = m == null ? void 0 : m.stroke, D = m == null ? void 0 : m.opacity, q = (R, ne) => {
-      const P = window.getComputedStyle(R), de = ne, Oe = P.fill === P.color, _e = P.stroke === P.color, me = T || (Oe ? x : void 0) || P.fill;
-      me && me !== "none" && (de.style.fill = me);
-      const ve = _ || (_e ? x : void 0) || P.stroke;
-      ve && ve !== "none" && (de.style.stroke = ve), P.strokeWidth && P.strokeWidth !== "0px" && (de.style.strokeWidth = P.strokeWidth);
-      const Se = x || P.color;
-      Se && (de.style.color = Se);
-      const we = D || P.opacity;
-      we && we !== "1" && (de.style.opacity = we);
-      for (let fe = 0; fe < R.children.length; fe++)
-        q(R.children[fe], ne.children[fe]);
+  let x = a.getAttribute("data-mid");
+  x || (x = Math.random().toString(36).substring(2, 11), a.setAttribute("data-mid", x));
+  const X = parseInt(b.zIndex), Y = (isNaN(X) ? 0 : X) + s;
+  let A, N;
+  if (a.tagName === "IMG")
+    A = a.src;
+  else if (a.tagName.toLowerCase() === "svg") {
+    const f = v == null ? void 0 : v.color, S = v == null ? void 0 : v.fill, I = v == null ? void 0 : v.stroke, _ = v == null ? void 0 : v.opacity, k = (P) => {
+      const z = a.cloneNode(!0), Q = (ve, Ce) => {
+        const G = window.getComputedStyle(ve), ue = Ce, Ne = G.fill === G.color, ze = G.stroke === G.color, we = (P ? S || (Ne ? f : void 0) : void 0) || G.fill;
+        we && we !== "none" && (ue.style.fill = we);
+        const be = (P ? I || (ze ? f : void 0) : void 0) || G.stroke;
+        be && be !== "none" && (ue.style.stroke = be), G.strokeWidth && G.strokeWidth !== "0px" && (ue.style.strokeWidth = G.strokeWidth);
+        const Te = (P ? f : void 0) || G.color;
+        Te && (ue.style.color = Te);
+        const ye = (P ? _ : void 0) || G.opacity;
+        ye && ye !== "1" && (ue.style.opacity = ye);
+        for (let ge = 0; ge < ve.children.length; ge++)
+          Q(ve.children[ge], Ce.children[ge]);
+      };
+      Q(a, z);
+      const D = a.getBoundingClientRect(), T = window.devicePixelRatio * c;
+      z.hasAttribute("viewBox") || z.setAttribute("viewBox", `0 0 ${D.width} ${D.height}`), z.setAttribute("width", (D.width * T).toString()), z.setAttribute("height", (D.height * T).toString());
+      let ee = new XMLSerializer().serializeToString(z);
+      return ee.includes("xmlns=") || (ee = ee.replace(
+        "<svg",
+        '<svg xmlns="http://www.w3.org/2000/svg"'
+      )), `data:image/svg+xml;utf8,${encodeURIComponent(ee)}`;
     };
-    q(n, v);
-    const Y = n.getBoundingClientRect(), Q = window.devicePixelRatio * c;
-    v.hasAttribute("viewBox") || v.setAttribute("viewBox", `0 0 ${Y.width} ${Y.height}`), v.setAttribute("width", (Y.width * Q).toString()), v.setAttribute("height", (Y.height * Q).toString());
-    let k = new XMLSerializer().serializeToString(v);
-    k.includes("xmlns=") || (k = k.replace(
-      "<svg",
-      '<svg xmlns="http://www.w3.org/2000/svg"'
-    )), U = `data:image/svg+xml;utf8,${encodeURIComponent(k)}`;
+    A = k(!1), y !== void 0 && (f || S || I || _) && (N = k(!0));
   } else if (b.backgroundImage && b.backgroundImage !== "none") {
-    const v = b.backgroundImage.match(/url\(['"]?(.*?)['"]?\)/);
-    v && (U = v[1]);
+    const f = b.backgroundImage.match(/url\(['"]?(.*?)['"]?\)/);
+    f && (A = f[1]);
   }
-  const I = {
+  const U = {
     backgroundColor: b.backgroundColor,
     backgroundImage: b.backgroundImage,
-    opacity: n.dataset[ee.KEY] === ee.VALUES.HIDE ? 1 : parseFloat(b.opacity),
-    zIndex: z,
+    opacity: a.dataset[te.KEY] === te.VALUES.HIDE ? 1 : parseFloat(b.opacity),
+    zIndex: Y,
     borderRadius: b.borderRadius,
     borderColor: b.borderColor,
     borderWidth: b.borderWidth,
     boxShadow: b.boxShadow,
-    imageSrc: U,
-    isTraveler: L
-  }, j = I;
-  let J, Z;
-  const M = [], O = b.overflow === "hidden" ? [...l || [], n] : l;
-  return n.tagName.toLowerCase() !== "svg" && Array.from(n.childNodes).forEach((v) => {
-    const x = v.nodeType === Node.TEXT_NODE ? d : h, T = Fe(
-      v,
+    imageSrc: A,
+    isTraveler: R
+  }, K = U;
+  let J, M;
+  const B = [], Z = b.overflow === "hidden" ? [...l || [], a] : l;
+  return a.tagName.toLowerCase() !== "svg" && Array.from(a.childNodes).forEach((f) => {
+    const S = f.nodeType === Node.TEXT_NODE ? d : h, I = Xe(
+      f,
       e,
-      x,
+      S,
       r,
-      z,
+      Y,
       c,
-      v.nodeType === Node.TEXT_NODE ? y : void 0,
-      v.nodeType === Node.TEXT_NODE && Object.keys(m).length > 0 ? m : void 0,
-      O
+      f.nodeType === Node.TEXT_NODE ? y : void 0,
+      f.nodeType === Node.TEXT_NODE && Object.keys(v).length > 0 ? v : void 0,
+      Z
     );
-    T && M.push(T);
+    I && B.push(I);
   }), {
-    id: S,
+    id: x,
     type: "BOX",
-    element: n,
+    element: a,
     rect: {
       x: C.left + window.scrollX,
       y: C.top + window.scrollY,
       width: C.width,
       height: C.height
     },
-    styles: j,
+    styles: K,
     textContent: J,
-    textStyles: Z,
+    textStyles: M,
     dirtyMask: e,
     visibility: d,
-    isTraveler: L,
+    isTraveler: R,
     captureLayer: r,
     nativeLayer: y,
-    nativeStyles: y !== void 0 ? Ce(te({}, I), {
-      backgroundColor: (K = m.backgroundColor) != null ? K : I.backgroundColor,
-      backgroundImage: (B = m.backgroundImage) != null ? B : I.backgroundImage,
-      opacity: (V = m.opacity) != null ? V : I.opacity,
-      zIndex: m.zIndex !== void 0 ? m.zIndex + z : I.zIndex,
-      borderRadius: (ie = m.borderRadius) != null ? ie : I.borderRadius,
-      borderColor: (se = m.borderColor) != null ? se : I.borderColor,
-      borderWidth: (oe = m.borderWidth) != null ? oe : I.borderWidth,
-      boxShadow: (he = m.boxShadow) != null ? he : I.boxShadow,
-      isTraveler: I.isTraveler,
-      transform: m.transform
+    nativeStyles: y !== void 0 ? Me(re({}, U), {
+      backgroundColor: (F = v.backgroundColor) != null ? F : U.backgroundColor,
+      backgroundImage: (W = v.backgroundImage) != null ? W : U.backgroundImage,
+      opacity: (se = v.opacity) != null ? se : U.opacity,
+      zIndex: v.zIndex !== void 0 ? v.zIndex + Y : U.zIndex,
+      borderRadius: (oe = v.borderRadius) != null ? oe : U.borderRadius,
+      borderColor: (ae = v.borderColor) != null ? ae : U.borderColor,
+      borderWidth: (he = v.borderWidth) != null ? he : U.borderWidth,
+      boxShadow: (de = v.boxShadow) != null ? de : U.boxShadow,
+      isTraveler: U.isTraveler,
+      transform: v.transform,
+      imageSrc: N != null ? N : A
     }) : void 0,
     nativeRect: y !== void 0 ? {
-      x: m.x !== void 0 ? parseFloat(m.x) : C.left + window.scrollX,
-      y: m.y !== void 0 ? parseFloat(m.y) : C.top + window.scrollY,
-      width: m.width !== void 0 ? parseFloat(m.width) : C.width,
-      height: m.height !== void 0 ? parseFloat(m.height) : C.height
+      x: v.x !== void 0 ? parseFloat(v.x) : C.left + window.scrollX,
+      y: v.y !== void 0 ? parseFloat(v.y) : C.top + window.scrollY,
+      width: v.width !== void 0 ? parseFloat(v.width) : C.width,
+      height: v.height !== void 0 ? parseFloat(v.height) : C.height
     } : void 0,
     isFixed: b.position === "fixed",
     clipElements: l,
-    children: M,
-    shaderHooks: A
+    children: B,
+    shaderHooks: L
   };
 }
-function at(i, e) {
+function ht(i, e) {
   e.size !== 0 && e.forEach((t, r) => {
-    var c, o, a, l;
+    var c, o, n, l;
     const s = i.get(r);
-    !s || !s.userData.basePosition || (W.forceUpdateUniforms(s.material, {
+    !s || !s.userData.basePosition || (H.forceUpdateUniforms(s.material, {
       backgroundColor: t.backgroundColor,
       backgroundImage: t.backgroundImage,
       boxShadow: t.boxShadow,
       opacity: t.opacity,
       borderRadius: (o = t.borderRadius) != null ? o : (c = s.userData.baseStyles) == null ? void 0 : c.borderRadius
       // width and height are no longer updated here, they are updated in syncMeshesByDOM
-    }), s.userData.nativeMesh && W.forceUpdateUniforms(s.userData.nativeMesh.material, {
+    }), s.userData.nativeMesh && H.forceUpdateUniforms(s.userData.nativeMesh.material, {
       backgroundColor: t.backgroundColor,
       backgroundImage: t.backgroundImage,
       boxShadow: t.boxShadow,
       opacity: t.opacity,
-      borderRadius: (l = t.borderRadius) != null ? l : (a = s.userData.baseStyles) == null ? void 0 : a.borderRadius
+      borderRadius: (l = t.borderRadius) != null ? l : (n = s.userData.baseStyles) == null ? void 0 : n.borderRadius
     }));
   });
 }
-class lt {
+class dt {
   constructor(e, t, r, s) {
-    g(this, "target");
-    g(this, "renderer");
-    g(this, "registry");
-    g(this, "isTravelEnabled", !1);
-    g(this, "tracker");
-    this.target = e, this.renderer = t, this.registry = r, this.tracker = new qe(e, {
+    p(this, "target");
+    p(this, "renderer");
+    p(this, "registry");
+    p(this, "isTravelEnabled", !1);
+    p(this, "tracker");
+    this.target = e, this.renderer = t, this.registry = r, this.tracker = new Ke(e, {
       resizeDebounce: s.resizeDebounce
     }), this.tracker.onLayoutChange.add((c, o) => {
-      document.querySelector(`[${N.NAME}~='${N.VALUES.TRAVELER}']`) !== null && !this.isTravelEnabled && (this.isTravelEnabled = !0, this.renderer.createRenderTarget());
-      const l = Fe(
+      document.querySelector(`[${V.NAME}~='${V.VALUES.TRAVELER}']`) !== null && !this.isTravelEnabled && (this.isTravelEnabled = !0, this.renderer.createRenderTarget());
+      const l = Xe(
         this.target,
         c,
-        G,
+        $,
         1,
         0,
         this.renderer.qualityFactor
       );
       l && this.renderer.syncScene(l, o);
     }), this.tracker.onStyleChange.add((c) => {
-      at(this.registry, c);
+      ht(this.registry, c);
     }), this.tracker.onRender.add(() => {
       this.renderer.syncMeshesByDOM(), this.renderer.render();
     });
@@ -1775,9 +1779,9 @@ class lt {
     this.tracker.stop();
   }
 }
-class ct {
+class ut {
   constructor() {
-    g(this, "store");
+    p(this, "store");
     this.store = /* @__PURE__ */ new WeakMap();
   }
   register(e, t) {
@@ -1800,30 +1804,30 @@ class ct {
     this.store.delete(e);
   }
 }
-class ft {
+class mt {
   constructor(e, t) {
-    g(this, "renderer");
-    g(this, "syncer");
-    g(this, "target");
-    g(this, "registry");
+    p(this, "renderer");
+    p(this, "syncer");
+    p(this, "target");
+    p(this, "registry");
     var s, c, o;
-    if (this.target = e, this.registry = new ct(), !document.getElementById("mirage-engine-styles")) {
-      const a = document.createElement("style");
-      a.id = "mirage-engine-styles", a.textContent = `
-        [${ee.NAME}="${ee.VALUES.HIDE}"] {
+    if (this.target = e, this.registry = new ut(), !document.getElementById("mirage-engine-styles")) {
+      const n = document.createElement("style");
+      n.id = "mirage-engine-styles", n.textContent = `
+        [${te.NAME}="${te.VALUES.HIDE}"] {
           opacity: 0 !important;
         }
-      `, document.head.appendChild(a);
+      `, document.head.appendChild(n);
     }
     let r;
     if (t.mode === "duplicate" ? r = (c = (s = t.container) != null ? s : this.target.parentElement) != null ? c : void 0 : r = (o = this.target.parentElement) != null ? o : void 0, !r)
       throw new Error("[Mirage] Cannot find a container (parent or option).");
-    this.renderer = new ot(
+    this.renderer = new lt(
       this.target,
       t,
       r,
       this.registry
-    ), this.renderer.mount(), this.syncer = new lt(this.target, this.renderer, this.registry, t);
+    ), this.renderer.mount(), this.syncer = new dt(this.target, this.renderer, this.registry, t);
   }
   start() {
     this.syncer.start();
@@ -1867,25 +1871,25 @@ class ft {
   }
 }
 export {
-  Me as ALLOWED_FILTERS,
-  ee as ATTR_DOM,
-  H as ATTR_FILTER,
-  dt as ATTR_SANDWICH,
-  $ as ATTR_SELECT,
-  We as ATTR_SHADER,
-  N as ATTR_TRAVEL,
-  ye as DIRTY_CONTENT,
-  ge as DIRTY_NONE,
-  re as DIRTY_RECT,
-  pe as DIRTY_STRUCTURE,
-  ue as DIRTY_STYLE,
-  Pe as DIRTY_ZINDEX,
-  ut as EXCLUDED,
-  ft as Engine,
-  ae as SELECT_LAYER,
-  F as THREE_LAYERS,
-  Re as TRAVEL_VALUES,
-  qe as Tracker,
-  G as USER_LAYER,
-  Ge as extractFromStyle
+  Ae as ALLOWED_FILTERS,
+  te as ATTR_DOM,
+  q as ATTR_FILTER,
+  gt as ATTR_SANDWICH,
+  j as ATTR_SELECT,
+  Ge as ATTR_SHADER,
+  V as ATTR_TRAVEL,
+  Se as DIRTY_CONTENT,
+  pe as DIRTY_NONE,
+  ie as DIRTY_RECT,
+  me as DIRTY_STRUCTURE,
+  fe as DIRTY_STYLE,
+  qe as DIRTY_ZINDEX,
+  pt as EXCLUDED,
+  mt as Engine,
+  ne as SELECT_LAYER,
+  O as THREE_LAYERS,
+  De as TRAVEL_VALUES,
+  Ke as Tracker,
+  $ as USER_LAYER,
+  je as extractFromStyle
 };