@mirage-engine/core 0.3.19 → 0.3.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/dist/mirage-engine.js +59 -58
- package/dist/mirage-engine.umd.js +12 -11
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
package/dist/mirage-engine.js
CHANGED
|
@@ -259,8 +259,8 @@ class $e extends w.MeshBasicMaterial {
|
|
|
259
259
|
const h = this.wrapText(t, s), d = r.lineHeight, p = ke.getBaseline(r.font);
|
|
260
260
|
h.forEach((f, L) => {
|
|
261
261
|
const m = L * d + p;
|
|
262
|
-
let
|
|
263
|
-
r.textAlign === "center" ?
|
|
262
|
+
let y = 0;
|
|
263
|
+
r.textAlign === "center" ? y = s / 2 : r.textAlign === "right" && (y = s), this.ctx.textAlign = r.textAlign, this.ctx.fillText(f, y, m);
|
|
264
264
|
}), this.map && (this.map.needsUpdate = !0);
|
|
265
265
|
}
|
|
266
266
|
dispose() {
|
|
@@ -553,19 +553,20 @@ function rt(i, e, t, r = null, s) {
|
|
|
553
553
|
let o = "";
|
|
554
554
|
const a = {};
|
|
555
555
|
if (s != null && s.uniforms)
|
|
556
|
-
for (const [
|
|
557
|
-
typeof S == "number" ? (o += `uniform float ${
|
|
558
|
-
`, a[
|
|
559
|
-
`, a[
|
|
560
|
-
`, a[
|
|
561
|
-
`, a[
|
|
562
|
-
`, a[
|
|
556
|
+
for (const [b, S] of Object.entries(s.uniforms))
|
|
557
|
+
typeof S == "number" ? (o += `uniform float ${b};
|
|
558
|
+
`, a[b] = { value: S }) : Array.isArray(S) ? S.length === 2 ? (o += `uniform vec2 ${b};
|
|
559
|
+
`, a[b] = { value: new w.Vector2(...S) }) : S.length === 3 ? (o += `uniform vec3 ${b};
|
|
560
|
+
`, a[b] = { value: new w.Vector3(...S) }) : S.length === 4 && (o += `uniform vec4 ${b};
|
|
561
|
+
`, a[b] = { value: new w.Vector4(...S) }) : S && typeof S == "object" && S.type ? (o += `uniform ${S.type} ${b};
|
|
562
|
+
`, a[b] = S) : (o += `uniform float ${b};
|
|
563
|
+
`, a[b] = { value: S });
|
|
563
564
|
const l = s !== void 0, n = (c || l ? De.declChunk : "") + `
|
|
564
565
|
` + o, u = `vec2 screenUv = (vScreenPos.xy / vScreenPos.w) * 0.5 + 0.5;
|
|
565
566
|
`, h = i.isTraveler ? `vec2 resultUv = screenUv;
|
|
566
567
|
` : `vec2 localUv = (p / uSize) + 0.5;
|
|
567
568
|
vec2 resultUv = localUv * uTextureRepeat + uTextureOffset;
|
|
568
|
-
`, 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),
|
|
569
|
+
`, 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 = {
|
|
569
570
|
uSize: { value: new w.Vector2(e, t) },
|
|
570
571
|
uMeshSize: { value: new w.Vector2(e, t) },
|
|
571
572
|
uShadowColor: { value: new w.Vector4(0, 0, 0, 0) },
|
|
@@ -582,10 +583,10 @@ vec2 resultUv = localUv * uTextureRepeat + uTextureOffset;
|
|
|
582
583
|
},
|
|
583
584
|
uBorderColor: {
|
|
584
585
|
value: new w.Vector4(
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
586
|
+
y.color.r,
|
|
587
|
+
y.color.g,
|
|
588
|
+
y.color.b,
|
|
589
|
+
y.alpha
|
|
589
590
|
)
|
|
590
591
|
},
|
|
591
592
|
uBorderRadius: { value: new w.Vector4(0, 0, 0, 0) },
|
|
@@ -1045,11 +1046,11 @@ class ot {
|
|
|
1045
1046
|
f.rect.width,
|
|
1046
1047
|
f.rect.height,
|
|
1047
1048
|
this.qualityFactor
|
|
1048
|
-
),
|
|
1049
|
+
), y = new w.PlaneGeometry(1, 1), E = new w.Mesh(y, m);
|
|
1049
1050
|
E.name = `TEXT_CHILD_${L}`;
|
|
1050
1051
|
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;
|
|
1051
1052
|
E.scale.set(A, C, 1);
|
|
1052
|
-
const
|
|
1053
|
+
const b = f.rect.x + f.rect.width / 2, S = f.rect.y + f.rect.height / 2, X = b - d, z = -(S - p);
|
|
1053
1054
|
E.position.set(
|
|
1054
1055
|
t.rect.width === 0 ? 0 : X / t.rect.width,
|
|
1055
1056
|
t.rect.height === 0 ? 0 : z / t.rect.height,
|
|
@@ -1076,7 +1077,7 @@ class ot {
|
|
|
1076
1077
|
});
|
|
1077
1078
|
}
|
|
1078
1079
|
updateMeshProperties(e, t) {
|
|
1079
|
-
var C,
|
|
1080
|
+
var C, b, S, X, z;
|
|
1080
1081
|
const { rect: r, styles: s } = t, c = this.renderer.getPixelRatio(), o = this.renderer.domElement.width / c, a = this.renderer.domElement.height / c;
|
|
1081
1082
|
e.material = e.userData.baseMaterial;
|
|
1082
1083
|
let l = ((C = e.material.userData) == null ? void 0 : C.shadowPadding) || 0;
|
|
@@ -1103,10 +1104,10 @@ class ot {
|
|
|
1103
1104
|
);
|
|
1104
1105
|
const f = r.x, L = r.y;
|
|
1105
1106
|
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 };
|
|
1106
|
-
const m = t.element.nodeType === Node.TEXT_NODE ? t.element.parentElement : t.element,
|
|
1107
|
+
const m = t.element.nodeType === Node.TEXT_NODE ? t.element.parentElement : t.element, y = window.getComputedStyle(m);
|
|
1107
1108
|
let E = 0, A = 0;
|
|
1108
|
-
if (
|
|
1109
|
-
const U = new DOMMatrix(
|
|
1109
|
+
if (y.transform && y.transform !== "none") {
|
|
1110
|
+
const U = new DOMMatrix(y.transform);
|
|
1110
1111
|
E = U.m41, A = U.m42;
|
|
1111
1112
|
}
|
|
1112
1113
|
if (e.userData.baseTransform = { x: E, y: A }, delete e.userData.originRatioX, delete e.userData.originRatioY, W.update(
|
|
@@ -1117,7 +1118,7 @@ class ot {
|
|
|
1117
1118
|
r.width,
|
|
1118
1119
|
r.height,
|
|
1119
1120
|
this.qualityFactor,
|
|
1120
|
-
t.isTraveler ? (
|
|
1121
|
+
t.isTraveler ? (b = this.renderTargets[t.captureLayer - 2]) == null ? void 0 : b.texture : this.textureManager.get(t.element)
|
|
1121
1122
|
), t.nativeStyles && t.nativeRect) {
|
|
1122
1123
|
if (!e.userData.nativeMesh) {
|
|
1123
1124
|
const B = W.create(
|
|
@@ -1220,8 +1221,8 @@ class ot {
|
|
|
1220
1221
|
const h = (o.x + 1) / 2 * a, d = (o.y + 1) / 2 * l;
|
|
1221
1222
|
let p = 0, f = 1;
|
|
1222
1223
|
typeof this.clipArea == "number" ? f = this.clipArea : this.clipArea.endsWith("%") ? f = parseFloat(this.clipArea) / 100 : this.clipArea.endsWith("px") && (p = parseFloat(this.clipArea));
|
|
1223
|
-
const L = u.scale.x * f + 0.5, m = u.scale.y * f + 0.5,
|
|
1224
|
-
this.renderer.setScissor(A, C,
|
|
1224
|
+
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;
|
|
1225
|
+
this.renderer.setScissor(A, C, b, S), this.renderer.render(this.scene, this.camera);
|
|
1225
1226
|
}
|
|
1226
1227
|
this.renderer.setScissorTest(!1), this.renderer.autoClear = !0, this.renderer.setRenderTarget(null), this.camera.layers.set(this.getSceneLayer()), this.renderer.setClearColor(s, c);
|
|
1227
1228
|
}
|
|
@@ -1283,15 +1284,15 @@ class ot {
|
|
|
1283
1284
|
};
|
|
1284
1285
|
const p = a.userData.clipElements;
|
|
1285
1286
|
if (p && p.length > 0) {
|
|
1286
|
-
let
|
|
1287
|
-
for (const
|
|
1288
|
-
const S =
|
|
1289
|
-
|
|
1287
|
+
let y = -1 / 0, E = -1 / 0, A = 1 / 0, C = 1 / 0;
|
|
1288
|
+
for (const b of p) {
|
|
1289
|
+
const S = b.getBoundingClientRect();
|
|
1290
|
+
y = Math.max(y, S.left), E = Math.max(E, S.top), A = Math.min(A, S.right), C = Math.min(C, S.bottom);
|
|
1290
1291
|
}
|
|
1291
1292
|
a.userData.scissorRect = {
|
|
1292
|
-
x:
|
|
1293
|
+
x: y,
|
|
1293
1294
|
y: E,
|
|
1294
|
-
width: Math.max(0, A -
|
|
1295
|
+
width: Math.max(0, A - y),
|
|
1295
1296
|
height: Math.max(0, C - E)
|
|
1296
1297
|
};
|
|
1297
1298
|
} else
|
|
@@ -1300,8 +1301,8 @@ class ot {
|
|
|
1300
1301
|
if (this.isViewport)
|
|
1301
1302
|
f = n.x - window.innerWidth / 2 + n.width / 2, L = -n.y + window.innerHeight / 2 - n.height / 2;
|
|
1302
1303
|
else {
|
|
1303
|
-
const
|
|
1304
|
-
f =
|
|
1304
|
+
const y = n.x - e, E = n.y - t;
|
|
1305
|
+
f = y - s / 2 + n.width / 2, L = -E + c / 2 - n.height / 2;
|
|
1305
1306
|
}
|
|
1306
1307
|
a.position.setX(f), a.position.setY(L);
|
|
1307
1308
|
let m = ((h = a.material.userData) == null ? void 0 : h.shadowPadding) || 0;
|
|
@@ -1309,8 +1310,8 @@ class ot {
|
|
|
1309
1310
|
width: n.width,
|
|
1310
1311
|
height: n.height
|
|
1311
1312
|
}), a.userData.nativeMesh) {
|
|
1312
|
-
const
|
|
1313
|
-
let E = n.width, A = n.height, C = f,
|
|
1313
|
+
const y = a.userData.nativeMesh;
|
|
1314
|
+
let E = n.width, A = n.height, C = f, b = L;
|
|
1314
1315
|
if (a.userData.nativeTransform) {
|
|
1315
1316
|
const X = a.userData.nativeTransform, z = X.match(/scale\(([\d.]+%?)\)/);
|
|
1316
1317
|
if (z) {
|
|
@@ -1333,7 +1334,7 @@ class ot {
|
|
|
1333
1334
|
let K = parseFloat(M);
|
|
1334
1335
|
M.includes("%") && (K = K / 100 * n.width);
|
|
1335
1336
|
let B = parseFloat(O);
|
|
1336
|
-
O.includes("%") && (B = B / 100 * n.height), C += K,
|
|
1337
|
+
O.includes("%") && (B = B / 100 * n.height), C += K, b -= B;
|
|
1337
1338
|
}
|
|
1338
1339
|
const J = X.match(/translateX\(([^)]+)\)/);
|
|
1339
1340
|
if (J) {
|
|
@@ -1345,11 +1346,11 @@ class ot {
|
|
|
1345
1346
|
if (Z) {
|
|
1346
1347
|
const M = Z[1].trim();
|
|
1347
1348
|
let O = parseFloat(M);
|
|
1348
|
-
M.includes("%") && (O = O / 100 * n.height),
|
|
1349
|
+
M.includes("%") && (O = O / 100 * n.height), b -= O;
|
|
1349
1350
|
}
|
|
1350
1351
|
}
|
|
1351
|
-
let S = ((d =
|
|
1352
|
-
|
|
1352
|
+
let S = ((d = y.material.userData) == null ? void 0 : d.shadowPadding) || 0;
|
|
1353
|
+
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, {
|
|
1353
1354
|
width: E,
|
|
1354
1355
|
height: A
|
|
1355
1356
|
});
|
|
@@ -1567,7 +1568,7 @@ function Fe(i, e = re | ue | Pe | ye | pe, t, r = 1, s = 0, c = 2, o, a, l) {
|
|
|
1567
1568
|
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);
|
|
1568
1569
|
}
|
|
1569
1570
|
const f = n.dataset[N.KEY];
|
|
1570
|
-
let L = !1, m = a ? te({}, a) : {},
|
|
1571
|
+
let L = !1, m = a ? te({}, a) : {}, y = o;
|
|
1571
1572
|
if (f) {
|
|
1572
1573
|
let v = 1;
|
|
1573
1574
|
const x = f.indexOf("{"), T = f.lastIndexOf("}");
|
|
@@ -1600,10 +1601,10 @@ function Fe(i, e = re | ue | Pe | ye | pe, t, r = 1, s = 0, c = 2, o, a, l) {
|
|
|
1600
1601
|
if (Q !== -1) {
|
|
1601
1602
|
const k = D[Q + 1];
|
|
1602
1603
|
if (k && !isNaN(parseInt(k, 10)))
|
|
1603
|
-
|
|
1604
|
+
y = parseInt(k, 10);
|
|
1604
1605
|
else if (!L) {
|
|
1605
1606
|
const R = D.find((ne) => !isNaN(parseInt(ne, 10)));
|
|
1606
|
-
R && (
|
|
1607
|
+
R && (y = parseInt(R, 10));
|
|
1607
1608
|
}
|
|
1608
1609
|
}
|
|
1609
1610
|
if (q) {
|
|
@@ -1618,12 +1619,12 @@ function Fe(i, e = re | ue | Pe | ye | pe, t, r = 1, s = 0, c = 2, o, a, l) {
|
|
|
1618
1619
|
const E = n.dataset[We.KEY];
|
|
1619
1620
|
let A;
|
|
1620
1621
|
E && (A = JSON.parse(E));
|
|
1621
|
-
const C = n.getBoundingClientRect(),
|
|
1622
|
-
if (C.width === 0 || C.height === 0 ||
|
|
1622
|
+
const C = n.getBoundingClientRect(), b = window.getComputedStyle(n);
|
|
1623
|
+
if (C.width === 0 || C.height === 0 || b.display === "none")
|
|
1623
1624
|
return null;
|
|
1624
1625
|
let S = n.getAttribute("data-mid");
|
|
1625
1626
|
S || (S = Math.random().toString(36).substring(2, 11), n.setAttribute("data-mid", S));
|
|
1626
|
-
const X = parseInt(
|
|
1627
|
+
const X = parseInt(b.zIndex), z = (isNaN(X) ? 0 : X) + s;
|
|
1627
1628
|
let U;
|
|
1628
1629
|
if (n.tagName === "IMG")
|
|
1629
1630
|
U = n.src;
|
|
@@ -1648,24 +1649,24 @@ function Fe(i, e = re | ue | Pe | ye | pe, t, r = 1, s = 0, c = 2, o, a, l) {
|
|
|
1648
1649
|
"<svg",
|
|
1649
1650
|
'<svg xmlns="http://www.w3.org/2000/svg"'
|
|
1650
1651
|
)), U = `data:image/svg+xml;utf8,${encodeURIComponent(k)}`;
|
|
1651
|
-
} else if (
|
|
1652
|
-
const v =
|
|
1652
|
+
} else if (b.backgroundImage && b.backgroundImage !== "none") {
|
|
1653
|
+
const v = b.backgroundImage.match(/url\(['"]?(.*?)['"]?\)/);
|
|
1653
1654
|
v && (U = v[1]);
|
|
1654
1655
|
}
|
|
1655
1656
|
const I = {
|
|
1656
|
-
backgroundColor:
|
|
1657
|
-
backgroundImage:
|
|
1658
|
-
opacity: n.dataset[ee.KEY] === ee.VALUES.HIDE ? 1 : parseFloat(
|
|
1657
|
+
backgroundColor: b.backgroundColor,
|
|
1658
|
+
backgroundImage: b.backgroundImage,
|
|
1659
|
+
opacity: n.dataset[ee.KEY] === ee.VALUES.HIDE ? 1 : parseFloat(b.opacity),
|
|
1659
1660
|
zIndex: z,
|
|
1660
|
-
borderRadius:
|
|
1661
|
-
borderColor:
|
|
1662
|
-
borderWidth:
|
|
1663
|
-
boxShadow:
|
|
1661
|
+
borderRadius: b.borderRadius,
|
|
1662
|
+
borderColor: b.borderColor,
|
|
1663
|
+
borderWidth: b.borderWidth,
|
|
1664
|
+
boxShadow: b.boxShadow,
|
|
1664
1665
|
imageSrc: U,
|
|
1665
1666
|
isTraveler: L
|
|
1666
1667
|
}, j = I;
|
|
1667
1668
|
let J, Z;
|
|
1668
|
-
const M = [], O =
|
|
1669
|
+
const M = [], O = b.overflow === "hidden" ? [...l || [], n] : l;
|
|
1669
1670
|
return n.tagName.toLowerCase() !== "svg" && Array.from(n.childNodes).forEach((v) => {
|
|
1670
1671
|
const x = v.nodeType === Node.TEXT_NODE ? d : h, T = Fe(
|
|
1671
1672
|
v,
|
|
@@ -1674,7 +1675,7 @@ function Fe(i, e = re | ue | Pe | ye | pe, t, r = 1, s = 0, c = 2, o, a, l) {
|
|
|
1674
1675
|
r,
|
|
1675
1676
|
z,
|
|
1676
1677
|
c,
|
|
1677
|
-
v.nodeType === Node.TEXT_NODE ?
|
|
1678
|
+
v.nodeType === Node.TEXT_NODE ? y : void 0,
|
|
1678
1679
|
v.nodeType === Node.TEXT_NODE && Object.keys(m).length > 0 ? m : void 0,
|
|
1679
1680
|
O
|
|
1680
1681
|
);
|
|
@@ -1696,8 +1697,8 @@ function Fe(i, e = re | ue | Pe | ye | pe, t, r = 1, s = 0, c = 2, o, a, l) {
|
|
|
1696
1697
|
visibility: d,
|
|
1697
1698
|
isTraveler: L,
|
|
1698
1699
|
captureLayer: r,
|
|
1699
|
-
nativeLayer:
|
|
1700
|
-
nativeStyles:
|
|
1700
|
+
nativeLayer: y,
|
|
1701
|
+
nativeStyles: y !== void 0 ? Ce(te({}, I), {
|
|
1701
1702
|
backgroundColor: (K = m.backgroundColor) != null ? K : I.backgroundColor,
|
|
1702
1703
|
backgroundImage: (B = m.backgroundImage) != null ? B : I.backgroundImage,
|
|
1703
1704
|
opacity: (V = m.opacity) != null ? V : I.opacity,
|
|
@@ -1709,13 +1710,13 @@ function Fe(i, e = re | ue | Pe | ye | pe, t, r = 1, s = 0, c = 2, o, a, l) {
|
|
|
1709
1710
|
isTraveler: I.isTraveler,
|
|
1710
1711
|
transform: m.transform
|
|
1711
1712
|
}) : void 0,
|
|
1712
|
-
nativeRect:
|
|
1713
|
+
nativeRect: y !== void 0 ? {
|
|
1713
1714
|
x: m.x !== void 0 ? parseFloat(m.x) : C.left + window.scrollX,
|
|
1714
1715
|
y: m.y !== void 0 ? parseFloat(m.y) : C.top + window.scrollY,
|
|
1715
1716
|
width: m.width !== void 0 ? parseFloat(m.width) : C.width,
|
|
1716
1717
|
height: m.height !== void 0 ? parseFloat(m.height) : C.height
|
|
1717
1718
|
} : void 0,
|
|
1718
|
-
isFixed:
|
|
1719
|
+
isFixed: b.position === "fixed",
|
|
1719
1720
|
clipElements: l,
|
|
1720
1721
|
children: M,
|
|
1721
1722
|
shaderHooks: A
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
(function(b,D){typeof exports=="object"&&typeof module!="undefined"?D(exports,require("three")):typeof define=="function"&&define.amd?define(["exports","three"],D):(b=typeof globalThis!="undefined"?globalThis:b||self,D(b.MirageEngine={},b.THREE))})(this,function(b,D){"use strict";var dt=Object.defineProperty,ut=Object.defineProperties;var ft=Object.getOwnPropertyDescriptors;var Ye=Object.getOwnPropertySymbols;var gt=Object.prototype.hasOwnProperty,pt=Object.prototype.propertyIsEnumerable;var Me=(b,D,O)=>D in b?dt(b,D,{enumerable:!0,configurable:!0,writable:!0,value:O}):b[D]=O,
|
|
2
|
-
`),c=[];return i.forEach(s=>{const a=s.match(/[^\s\-]+\-?|\-|\s+/g)||[];if(a.length===0){c.push("");return}let l=a[0];for(let
|
|
1
|
+
(function(b,D){typeof exports=="object"&&typeof module!="undefined"?D(exports,require("three")):typeof define=="function"&&define.amd?define(["exports","three"],D):(b=typeof globalThis!="undefined"?globalThis:b||self,D(b.MirageEngine={},b.THREE))})(this,function(b,D){"use strict";var dt=Object.defineProperty,ut=Object.defineProperties;var ft=Object.getOwnPropertyDescriptors;var Ye=Object.getOwnPropertySymbols;var gt=Object.prototype.hasOwnProperty,pt=Object.prototype.propertyIsEnumerable;var Me=(b,D,O)=>D in b?dt(b,D,{enumerable:!0,configurable:!0,writable:!0,value:O}):b[D]=O,ne=(b,D)=>{for(var O in D||(D={}))gt.call(D,O)&&Me(b,O,D[O]);if(Ye)for(var O of Ye(D))pt.call(D,O)&&Me(b,O,D[O]);return b},ze=(b,D)=>ut(b,ft(D));var g=(b,D,O)=>(Me(b,typeof D!="symbol"?D+"":D,O),O);var Ve=(b,D,O)=>new Promise((v,ge)=>{var K=B=>{try{F(O.next(B))}catch(V){ge(V)}},pe=B=>{try{F(O.throw(B))}catch(V){ge(V)}},F=B=>B.done?v(B.value):Promise.resolve(B.value).then(K,pe);F((O=O.apply(b,D)).next())});function O(o){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const t in o)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(o,t);Object.defineProperty(e,t,r.get?r:{enumerable:!0,get:()=>o[t]})}}return e.default=o,Object.freeze(e)}const v=O(D),ge={INCLUDE_TREE:"include-tree",EXCLUDE_TREE:"exclude-tree",INCLUDE_SELF:"include-self",EXCLUDE_SELF:"exclude-self",END:"end"},K={NAME:"data-mirage-dom",KEY:"mirageDom",VALUES:{HIDE:"hide",SHOW:"show"}},pe={TRAVELER:"traveler",NATIVE:"native",CAPTURE_1:"1",CAPTURE_2:"2",CAPTURE_3:"3",CAPTURE_4:"4",CAPTURE_5:"5",CAPTURE_6:"6",CAPTURE_7:"7",CAPTURE_8:"8",CAPTURE_9:"9",CAPTURE_10:"10"},F={NAME:"data-mirage-travel",KEY:"mirageTravel",VALUES:pe,MAX_LAYERS:Object.keys(pe).length-1},B={NAME:"data-mirage-filter",KEY:"mirageFilter",VALUES:ge},V={NAME:"data-mirage-select",KEY:"mirageSelect",VALUES:ge},Le={NAME:"data-mirage-shader",KEY:"mirageShader"},Pe={NAME:"data-mirage-sandwich",KEY:"mirageSandwich",VALUES:{FRONT:"front"}},me=0,te=1,ae=2,De=4,ve=8,ye=16;function We(o){const e=o.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)/);return e?{r:parseInt(e[1])/255,g:parseInt(e[2])/255,b:parseInt(e[3])/255,a:e[4]!==void 0?parseFloat(e[4]):1}:{r:1,g:1,b:1,a:1}}function Ae(o){const e={};if(o.opacity&&(e.opacity=parseFloat(o.opacity)),o.backgroundColor){const t=We(o.backgroundColor);e.backgroundColor=[t.r,t.g,t.b,t.a]}if(o.backgroundImage?e.backgroundImage=o.backgroundImage:o.background&&(e.backgroundImage=o.background),o.boxShadow&&(e.boxShadow=o.boxShadow),o.borderRadius&&(e.borderRadius=parseFloat(o.borderRadius)),o.width&&(e.width=parseFloat(o.width)),o.height&&(e.height=parseFloat(o.height)),o.transform&&o.transform!=="none"){const t=new DOMMatrix(o.transform);e.x=t.m41,e.y=t.m42,e.z=t.m43}return e}class Ie{constructor(e,t){g(this,"target");g(this,"observer");g(this,"pendingDeletions",new Set);g(this,"pendingStyles",new Map);g(this,"isDomDirty",!1);g(this,"isRunning",!1);g(this,"pendingMask",me);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",new Set);g(this,"onLayoutChange",new Set);g(this,"onStyleChange",new Set);g(this,"onScrollChange",new Set);g(this,"onRender",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|=te|ae,this.cssTimer=window.setTimeout(()=>{this.isDomDirty=!0,this.cssTimer=null},50)))});g(this,"onWindowResize",()=>{if(!this.resizeConfig.enabled){this.isDomDirty=!0;return}this.isResizing||(this.isResizing=!0,this.resizeConfig.onStart&&this.resizeConfig.onStart()),this.resizeTimer&&clearTimeout(this.resizeTimer),this.resizeTimer=window.setTimeout(()=>{this.isDomDirty=!0,this.resizeConfig.onEnd&&this.resizeConfig.onEnd(),this.isResizing=!1,this.resizeTimer=null},this.resizeConfig.delay)});g(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=me);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|=te,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 i,c;this.target=e;const r=(i=t.resizeDebounce)!=null?i:!0;r===!1?this.resizeConfig={enabled:!1,delay:0}:r===!0?this.resizeConfig={enabled:!0,delay:150}:this.resizeConfig={enabled:!0,delay:(c=r.delay)!=null?c:150,onStart:r.onStart,onEnd:r.onEnd},this.observer=new MutationObserver(s=>{let a=me;for(const l of s)if(l.type==="childList")a|=ve,l.removedNodes.length>0&&l.removedNodes.forEach(n=>{n instanceof HTMLElement&&this.pendingDeletions.add(n)});else if(l.type==="attributes")if(l.attributeName==="style"){a|=te|ae;const n=l.target,u=Ae(n.style);this.pendingStyles.set(n,u)}else l.attributeName==="class"?a|=te|ae:l.attributeName&&l.attributeName.startsWith("data-")&&(a|=te|ae,l.attributeName.startsWith("data-mirage")&&(a|=ve));else l.type==="characterData"&&(a|=ye|te);if(a!==me){if(this.pendingMask|=a,a&ve){this.clearTimers(),this.isDomDirty=!0;return}this.mutationTimer&&clearTimeout(this.mutationTimer),this.mutationTimer=window.setTimeout(()=>{this.mutationTimer=null,this.isDomDirty=!0},200)}})}start(){this.isRunning||(this.isRunning=!0,this.observer.observe(this.target,{childList:!0,subtree:!0,attributes:!0,characterData:!0}),this.target.addEventListener("transitionend",this.onTransitionFinished),this.target.addEventListener("animationend",this.onTransitionFinished),window.addEventListener("resize",this.onWindowResize),this.isDomDirty=!0,this.lastScrollX=window.scrollX,this.lastScrollY=window.scrollY,this.renderLoop())}stop(){this.isRunning=!1,this.observer.disconnect(),this.clearTimers(),this.target.removeEventListener("transitionend",this.onTransitionFinished),this.target.removeEventListener("animationend",this.onTransitionFinished),window.removeEventListener("resize",this.onWindowResize)}clearTimers(){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 H=1,oe=2,He=0,N={BASE:0,SELECTED:1,getCaptureLayer:o=>31-o,HIDDEN:31},Ee=Object.values(B.VALUES);class ke{static getBaseline(e){if(this.cache.has(e))return this.cache.get(e);const t=this.calculateBaselineFromDOM(e);return this.cache.set(e,t),t}static calculateBaselineFromDOM(e){if(typeof document=="undefined")return 0;const t=document.createElement("div"),r=document.createElement("span"),i=document.createElement("img");t.style.visibility="hidden",t.style.position="absolute",t.style.top="0px",t.style.left="0px",t.style.font=e,t.style.margin="0",t.style.padding="0",t.style.border="none",r.style.margin="0",r.style.padding="0",r.style.border="none",r.style.lineHeight="normal",i.width=1,i.height=1,i.style.verticalAlign="baseline",r.appendChild(document.createTextNode("Hidden Text")),t.appendChild(r),t.appendChild(i),document.body.appendChild(t);const c=i.offsetTop-r.offsetTop;return document.body.removeChild(t),c}}g(ke,"cache",new Map);class Ge extends v.MeshBasicMaterial{constructor(t,r,i,c,s=2){super({transparent:!0,side:v.FrontSide,color:16777215});g(this,"canvas");g(this,"ctx");g(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=s,this.map=new v.CanvasTexture(this.canvas),this.map.colorSpace=v.LinearSRGBColorSpace,this.map.minFilter=v.LinearFilter,this.map.magFilter=v.LinearFilter,this.updateText(t,r,i,c)}wrapText(t,r){const i=t.split(`
|
|
2
|
+
`),c=[];return i.forEach(s=>{const a=s.match(/[^\s\-]+\-?|\-|\s+/g)||[];if(a.length===0){c.push("");return}let l=a[0];for(let n=1;n<a.length;n++){const u=a[n];this.ctx.measureText(l+u).width<=r+2?l+=u:(l&&c.push(l),l=u.trimStart())}l&&c.push(l)}),c}updateText(t,r,i,c,s){s!==void 0&&(this.qualityFactor=s);const l=(window.devicePixelRatio||1)*this.qualityFactor,n=i*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,i),d=r.lineHeight,p=ke.getBaseline(r.font);h.forEach((f,A)=>{const m=A*d+p;let S=0;r.textAlign==="center"?S=i/2:r.textAlign==="right"&&(S=i),this.ctx.textAlign=r.textAlign,this.ctx.fillText(f,S,m)}),this.map&&(this.map.needsUpdate=!0)}dispose(){this.map&&this.map.dispose(),super.dispose()}}function le(o,e=0){if(typeof o=="number")return o;const t=parseFloat(o)||0;return typeof o=="string"&&o.includes("%")?t/100*e:t}function ce(o){if(!o||o==="transparent")return{color:new v.Color(16777215),alpha:0};const e=o.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)/);if(e){const t=parseInt(e[1],10),r=parseInt(e[2],10),i=parseInt(e[3],10),c=e[4]!==void 0?parseFloat(e[4]):1;return{color:new v.Color(`rgb(${t}, ${r}, ${i})`),alpha:c}}return{color:new v.Color(o),alpha:1}}function Ue(o){const e=[];let t="",r=0;for(let i=0;i<o.length;i++){const c=o[i];if(c==="(")r++;else if(c===")")r--;else if(c===","&&r===0){e.push(t.trim()),t="";continue}t+=c}return t&&e.push(t.trim()),e}function qe(o){if(!o||typeof o!="string"||!o.includes("linear-gradient"))return null;const e=o.match(/linear-gradient\((.*)\)/);if(!e)return null;const t=e[1],r=Ue(t);let i=Math.PI,c=0;const s=r[0].trim();if(s.startsWith("to "))s==="to top"?i=0:s==="to right"?i=Math.PI/2:s==="to bottom"?i=Math.PI:s==="to left"?i=Math.PI*1.5:s==="to top right"||s==="to right top"?i=Math.PI/4:s==="to bottom right"||s==="to right bottom"?i=Math.PI*.75:s==="to bottom left"||s==="to left bottom"?i=Math.PI*1.25:(s==="to top left"||s==="to left top")&&(i=Math.PI*1.75),c=1;else if(s.endsWith("deg")||s.endsWith("rad")||s.endsWith("turn")){const l=parseFloat(s);s.endsWith("deg")?i=l*(Math.PI/180):s.endsWith("rad")?i=l:s.endsWith("turn")&&(i=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 p=ce(h);a.push({color:p.color,alpha:p.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);let l=0;for(let n=1;n<a.length;n++)if(a[n].rawStop!==null||n===a.length-1){const u=n-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}l=n}}return{angle:i,stops:a}}function $e(o){if(!o||o==="none")return null;const e=Ue(o);if(e.length===0)return null;const t=e[0].trim(),r=/(rgba?\([^)]+\)|#[0-9a-fA-F]+|[a-zA-Z]+)/,i=t.match(r);let c="transparent",s=t;if(i&&i[1]!=="inset"){const p=i[1];(p.startsWith("rgb")||p.startsWith("#")||p==="black"||p==="white"||p==="transparent")&&(c=p,s=t.replace(p,"").trim())}s=s.replace("inset","").trim();const a=s.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 je=`varying vec2 vUv;
|
|
3
3
|
varying vec4 vScreenPos;
|
|
4
4
|
void main() {
|
|
5
5
|
vUv = uv;
|
|
@@ -171,18 +171,19 @@ uniform vec2 uTextureOffset;`,Ze=`vec2 screenUv = (vScreenPos.xy / vScreenPos.w)
|
|
|
171
171
|
vec2 resultUv = screenUv;
|
|
172
172
|
|
|
173
173
|
`,Qe=`vec4 texColor = texture2D(uTexture, resultUv);
|
|
174
|
-
baseColor = blendSrcOver(baseColor, texColor);`,_e={vertexShader:je,fragmentShader:Ke},Oe={declChunk:Je,uvChunk:Ze,baseColorChunk:Qe};function et(
|
|
175
|
-
`,a[
|
|
176
|
-
`,a[
|
|
177
|
-
`,a[
|
|
178
|
-
`,a[
|
|
179
|
-
`,a[
|
|
174
|
+
baseColor = blendSrcOver(baseColor, texColor);`,_e={vertexShader:je,fragmentShader:Ke},Oe={declChunk:Je,uvChunk:Ze,baseColorChunk:Qe};function et(o,e,t,r=null,i){var C;const c=r!==null||!!o.imageSrc;let s="";const a={};if(i!=null&&i.uniforms)for(const[y,x]of Object.entries(i.uniforms))typeof x=="number"?(s+=`uniform float ${y};
|
|
175
|
+
`,a[y]={value:x}):Array.isArray(x)?x.length===2?(s+=`uniform vec2 ${y};
|
|
176
|
+
`,a[y]={value:new v.Vector2(...x)}):x.length===3?(s+=`uniform vec3 ${y};
|
|
177
|
+
`,a[y]={value:new v.Vector3(...x)}):x.length===4&&(s+=`uniform vec4 ${y};
|
|
178
|
+
`,a[y]={value:new v.Vector4(...x)}):x&&typeof x=="object"&&x.type?(s+=`uniform ${x.type} ${y};
|
|
179
|
+
`,a[y]=x):(s+=`uniform float ${y};
|
|
180
|
+
`,a[y]={value:x});const l=i!==void 0,n=(c||l?Oe.declChunk:"")+`
|
|
180
181
|
`+s,u=`vec2 screenUv = (vScreenPos.xy / vScreenPos.w) * 0.5 + 0.5;
|
|
181
|
-
`,h=
|
|
182
|
+
`,h=o.isTraveler?`vec2 resultUv = screenUv;
|
|
182
183
|
`:`vec2 localUv = (p / uSize) + 0.5;
|
|
183
184
|
vec2 resultUv = localUv * uTextureRepeat + uTextureOffset;
|
|
184
|
-
`,d=c||l?u+h+((i==null?void 0:i.uvModifier)||""):"",p=c||l?Oe.baseColorChunk:"",f=(i==null?void 0:i.colorModifier)||"",A=_e.fragmentShader.replace("#INJECT_DECLARATIONS",o).replace("#INJECT_UV_MODIFIER",d).replace("#INJECT_BASE_COLOR",p).replace("#INJECT_COLOR_MODIFIER",f),m=ce(n.backgroundColor),y=ce(n.borderColor),T={uSize:{value:new v.Vector2(e,t)},uMeshSize:{value:new v.Vector2(e,t)},uShadowColor:{value:new v.Vector4(0,0,0,0)},uShadowOffset:{value:new v.Vector2(0,0)},uShadowBlur:{value:0},uShadowSpread:{value:0},uBgColor:{value:new v.Vector4(m.color.r,m.color.g,m.color.b,m.alpha)},uBorderColor:{value:new v.Vector4(y.color.r,y.color.g,y.color.b,y.alpha)},uBorderRadius:{value:new v.Vector4(0,0,0,0)},uBorderWidth:{value:le(n.borderWidth)},uOpacity:{value:(C=n.opacity)!=null?C:1},uTexture:{value:null},uTextureRepeat:{value:new v.Vector2(1,1)},uTextureOffset:{value:new v.Vector2(0,0)},uGradientCount:{value:0},uGradientAngle:{value:0},uGradientColors:{value:Array.from({length:8},()=>new v.Vector4(0,0,0,0))},uGradientStops:{value:new Float32Array(8)}};Be(T.uBorderRadius.value,n.borderRadius,Math.min(e,t)),c&&(T.uTexture.value=r);const k=new v.ShaderMaterial({uniforms:oe(oe({},T),a),vertexShader:_e.vertexShader,fragmentShader:A,transparent:!0,side:v.FrontSide});return n.backgroundImage&&xe(k,{backgroundImage:n.backgroundImage}),k}function tt(n,e,t,r,i){const c=le(e.borderWidth);xe(n,{width:t,height:r,borderRadius:e.borderRadius,borderWidth:c,backgroundColor:e.backgroundColor,borderColor:e.borderColor,opacity:e.opacity,texture:i,backgroundImage:e.backgroundImage,boxShadow:e.boxShadow})}function xe(n,e){var r,i,c;if(e.boxShadow!==void 0){const s=$e(e.boxShadow);s?(n.uniforms.uShadowColor.value.set(s.color.r,s.color.g,s.color.b,s.alpha),n.uniforms.uShadowOffset.value.set(s.offsetX,s.offsetY),n.uniforms.uShadowBlur.value=s.blurRadius,n.uniforms.uShadowSpread.value=s.spreadRadius,n.userData.shadowPadding=s.blurRadius+s.spreadRadius+Math.max(Math.abs(s.offsetX),Math.abs(s.offsetY))):(n.uniforms.uShadowColor.value.w=0,n.userData.shadowPadding=0)}if(e.width!==void 0&&e.height!==void 0&&n.uniforms.uSize.value.set(e.width,e.height),n.uniforms.uMeshSize){const s=n.userData.shadowPadding||0,a=e.width!==void 0?e.width:n.uniforms.uSize.value.x,l=e.height!==void 0?e.height:n.uniforms.uSize.value.y;n.uniforms.uMeshSize.value.set(a+s*2,l+s*2)}if(e.borderRadius!==void 0){const s=e.width!==void 0&&e.height!==void 0?Math.min(e.width,e.height):Math.min(n.uniforms.uSize.value.x,n.uniforms.uSize.value.y);Be(n.uniforms.uBorderRadius.value,e.borderRadius,s)}if(e.borderWidth!==void 0&&(n.uniforms.uBorderWidth.value=e.borderWidth),e.backgroundColor!==void 0)if(Array.isArray(e.backgroundColor)){const s=e.backgroundColor[3]!==void 0?e.backgroundColor[3]:n.uniforms.uBgColor.value.w;n.uniforms.uBgColor.value.set(e.backgroundColor[0],e.backgroundColor[1],e.backgroundColor[2],s)}else if(typeof e.backgroundColor=="string"){const s=ce(e.backgroundColor);n.uniforms.uBgColor.value.set(s.color.r,s.color.g,s.color.b,s.alpha)}else{const s=n.uniforms.uBgColor.value.w;n.uniforms.uBgColor.value.set(e.backgroundColor.r,e.backgroundColor.g,e.backgroundColor.b,s)}if(e.borderColor!==void 0)if(Array.isArray(e.borderColor)){const s=n.uniforms.uBorderColor.value.w;n.uniforms.uBorderColor.value.set(e.borderColor[0],e.borderColor[1],e.borderColor[2],s)}else if(typeof e.borderColor=="string"){const s=ce(e.borderColor);n.uniforms.uBorderColor.value.set(s.color.r,s.color.g,s.color.b,s.alpha)}else{const s=n.uniforms.uBorderColor.value.w;n.uniforms.uBorderColor.value.set(e.borderColor.r,e.borderColor.g,e.borderColor.b,s)}e.opacity!==void 0&&(n.uniforms.uOpacity.value=e.opacity),e.bgOpacity!==void 0&&(n.uniforms.uBgColor.value.w=e.bgOpacity),e.borderOpacity!==void 0&&(n.uniforms.uBorderColor.value.w=e.borderOpacity),n.uniforms.uTexture&&e.texture!==void 0&&(n.uniforms.uTexture.value=e.texture);const t=e.texture!==void 0?e.texture:(r=n.uniforms.uTexture)==null?void 0:r.value;if(t&&(t.image instanceof ImageBitmap||t.image instanceof HTMLImageElement||t.image instanceof HTMLCanvasElement)){const s=t.image.naturalWidth||t.image.videoWidth||t.image.width,a=t.image.naturalHeight||t.image.videoHeight||t.image.height,l=(i=e.width)!=null?i:n.uniforms.uSize.value.x,o=(c=e.height)!=null?c:n.uniforms.uSize.value.y;if(s&&a&&l&&o){const u=s/a,h=l/o;if(u>h){const d=h/u;n.uniforms.uTextureRepeat.value.set(d,1),n.uniforms.uTextureOffset.value.set((1-d)/2,0)}else{const d=u/h;n.uniforms.uTextureRepeat.value.set(1,d),n.uniforms.uTextureOffset.value.set(0,(1-d)/2)}}}else n.uniforms.uTextureRepeat&&(n.uniforms.uTextureRepeat.value.set(1,1),n.uniforms.uTextureOffset.value.set(0,0));if(e.backgroundImage!==void 0){const s=qe(e.backgroundImage);if(s){n.uniforms.uGradientCount.value=s.stops.length,n.uniforms.uGradientAngle.value=s.angle;for(let a=0;a<8;a++)if(a<s.stops.length){const l=s.stops[a];n.uniforms.uGradientColors.value[a].set(l.color.r,l.color.g,l.color.b,l.alpha),n.uniforms.uGradientStops.value[a]=l.stop}else n.uniforms.uGradientColors.value[a].set(0,0,0,0),n.uniforms.uGradientStops.value[a]=1}else n.uniforms.uGradientCount.value=0}for(const s of Object.keys(e))s!=="width"&&s!=="height"&&s!=="borderRadius"&&s!=="borderWidth"&&s!=="backgroundColor"&&s!=="borderColor"&&s!=="opacity"&&s!=="bgOpacity"&&s!=="borderOpacity"&&s!=="texture"&&s!=="backgroundImage"&&s!=="boxShadow"&&n.uniforms[s]!==void 0&&(n.uniforms[s].value!==void 0&&n.uniforms[s].value!==null&&typeof n.uniforms[s].value.set=="function"?Array.isArray(e[s])?n.uniforms[s].value.set(...e[s]):e[s]!==void 0&&(e[s].copy?n.uniforms[s].value.copy(e[s]):n.uniforms[s].value=e[s]):n.uniforms[s].value=e[s])}function Be(n,e,t=0){var l,o,u,h;if(e==null){n.set(0,0,0,0);return}if(typeof e=="number"){n.set(e,e,e,e);return}if(Array.isArray(e)){n.set(e[0],e[1],e[2],e[3]);return}const r=e.split("/")[0].trim().split(/\s+/),i=le(r[0],t),c=le((l=r[1])!=null?l:r[0],t),s=le((o=r[2])!=null?o:r[0],t),a=le((h=(u=r[3])!=null?u:r[1])!=null?h:r[0],t);n.set(i,c,s,a)}const G={create(n,e,t,r,i,c=2,s=null,a){return n==="BOX"?et(e,r,i,s,a):n==="TEXT"?new Ge(t||"",e,r,i,c):new v.MeshBasicMaterial({visible:!1})},update(n,e,t,r,i,c,s=2,a){e==="BOX"?tt(n,t,i,c,a):e==="TEXT"&&n.updateText(r||"",t,i,c,s)},forceUpdateUniforms(n,e){xe(n,e)}};class rt{constructor(e,t=!0){g(this,"observer");g(this,"textures",new WeakMap);g(this,"loadStatus",new WeakMap);g(this,"elementUrls",new WeakMap);g(this,"onUpdate");this.onUpdate=e,t&&(this.observer=new IntersectionObserver(r=>{for(const i of r){const c=i.target;i.isIntersecting?this.loadTexture(c):this.disposeTexture(c)}},{rootMargin:"300px"}))}register(e,t){if(e.nodeType!==Node.ELEMENT_NODE)return;this.elementUrls.get(e)!==t&&(this.elementUrls.set(e,t),this.observer?(this.observer.unobserve(e),this.observer.observe(e)):this.loadTexture(e))}unregister(e){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 Ve(this,null,function*(){if(this.loadStatus.get(e)||this.textures.has(e))return;const t=this.elementUrls.get(e);if(t){this.loadStatus.set(e,!0);try{let r;if(t.startsWith("data:image/svg+xml"))r=yield new Promise((c,s)=>{const a=new Image;a.onload=()=>c(a),a.onerror=s,a.src=t});else{const s=yield(yield fetch(t)).blob();r=yield createImageBitmap(s,{imageOrientation:"flipY"})}if(this.elementUrls.get(e)!==t){"close"in r&&r.close();return}const i=new v.Texture(r);r instanceof HTMLImageElement||(i.flipY=!1),i.colorSpace=v.LinearSRGBColorSpace,i.needsUpdate=!0,this.textures.set(e,i),this.onUpdate(e,i)}catch(r){console.warn("[MirageEngine] Failed to load texture:",t,r)}finally{this.elementUrls.has(e)&&this.loadStatus.set(e,!1)}}})}disposeTexture(e){const t=this.textures.get(e);t&&(t.dispose(),this.textures.delete(e),this.onUpdate(e,null)),this.loadStatus.set(e,!1)}get(e){return this.textures.get(e)}disposeAll(){this.observer&&this.observer.disconnect()}}class it{constructor(e,t,r,i){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:F.MAX_LAYERS},()=>new Set));g(this,"textureManager");g(this,"fixedMeshes",new Set);var a,l,o,u,h;this.target=e,this.mountContainer=r,this.registry=i,this.mode=(a=t.mode)!=null?a:"overlay",this.canvasSize=(l=t.canvasSize)!=null?l:"viewport",this.clipArea=(o=t.travelerClipArea)!=null?o:1,this.targetLayer=(u=t.layer)!=null?u:"base",this.textureManager=new rt((d,p)=>{const f=this.registry.get(d);f&&f.material instanceof v.ShaderMaterial&&G.forceUpdateUniforms(f.material,{texture:p})},this.isViewport),this.canvas=document.createElement("canvas"),this.scene=new v.Scene,this.targetRect=this.target.getBoundingClientRect();const c=this.isViewport?window.innerWidth+this.overscan*2:this.targetRect.width,s=this.isViewport?window.innerHeight+this.overscan*2:this.targetRect.height;this.camera=new v.OrthographicCamera(c/-2,c/2,s/2,s/-2,1,1e3),this.camera.position.z=100,this.camera.layers.set(this.getSceneLayer()),this.renderer=new v.WebGLRenderer({canvas:this.canvas,alpha:!0,antialias:!0}),v.ColorManagement.enabled=!1,this.renderer.outputColorSpace=v.LinearSRGBColorSpace,this.renderer.setPixelRatio(window.devicePixelRatio),this.renderer.setSize(c,s),this.applyTextQuality((h=t.quality)!=null?h:"medium")}get isViewport(){return this.mode==="overlay"&&this.canvasSize==="viewport"}getSceneLayer(){return typeof this.targetLayer=="number"?this.targetLayer:this.targetLayer==="selected"?N.SELECTED:N.BASE}createRenderTarget(){for(let e=0;e<F.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 v.WebGLRenderTarget(t*this.qualityFactor,r*this.qualityFactor,{minFilter:v.LinearFilter,magFilter:v.LinearFilter,format:v.RGBAFormat,stencilBuffer:!1,depthBuffer:!0}))}}applyTextQuality(e){if(typeof e=="number"){this.qualityFactor=Math.max(.1,e);return}switch(e){case"low":this.qualityFactor=1;break;case"high":this.qualityFactor=4;break;case"medium":this.qualityFactor=2;break;default:this.qualityFactor=2;break}}mount(){this.mountContainer.prepend(this.canvas),this.canvas.style.pointerEvents=this.mode==="overlay"?"none":"auto",this.updateCanvasLayout()}updateCanvasLayout(){const e=this.isViewport?window.innerWidth+this.overscan*2:this.targetRect.width,t=this.isViewport?window.innerHeight+this.overscan*2:this.targetRect.height;this.canvas.style.width=`${e}px`,this.canvas.style.height=`${t}px`,this.mode==="duplicate"?(this.canvas.style.position="",this.canvas.style.top="",this.canvas.style.left="",this.canvas.style.display="block"):(this.canvas.style.position=this.isViewport?"fixed":"absolute",this.canvas.style.top=this.isViewport?`-${this.overscan}px`:`${this.target.offsetTop}px`,this.canvas.style.left=this.isViewport?`-${this.overscan}px`:`${this.target.offsetLeft}px`,this.canvas.style.display="block")}updateUniforms(e,t){const r=this.registry.get(e);r&&(r.traverse(i=>{i.isMesh&&i.material&&G.forceUpdateUniforms(i.material,t)}),r.userData.nativeMesh&&r.userData.nativeMesh.traverse(i=>{i.isMesh&&i.material&&G.forceUpdateUniforms(i.material,t)}))}dispose(){this.renderer.dispose(),this.canvas.remove(),this.textureManager.disposeAll()}setSize(e,t){this.renderer.setSize(e,t);for(const r of this.renderTargets)r.setSize(e*this.qualityFactor,t*this.qualityFactor);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(),i=this.isViewport?window.innerWidth+this.overscan*2:r.width,c=this.isViewport?window.innerHeight+this.overscan*2:r.height,s=this.isViewport?this.canvas.clientWidth:this.targetRect.width,a=this.isViewport?this.canvas.clientHeight:this.targetRect.height,l=Math.abs(i-s)>.1||Math.abs(c-a)>.1,o=this.mode==="overlay"&&(Math.abs(r.top-this.targetRect.top)>.1||Math.abs(r.left-this.targetRect.left)>.1);l?(this.targetRect=r,this.setSize(i,c),this.updateCanvasLayout()):o?(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);for(const d of this.travelersByLayer)d.delete(h);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 v.Mesh&&(d.geometry&&d.geometry.dispose(),d.material&&(Array.isArray(d.material)?d.material.forEach(p=>p.dispose()):d.material.dispose()))}),this.registry.remove(u),this.textureManager.unregister(u)}})}reconcileNode(e){var i,c;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 v.Material&&t.material.dispose(),this.registry.remove(e.element),t=void 0),!t){const s=new v.PlaneGeometry(1,1),a=e.isTraveler?(i=this.renderTargets[e.captureLayer-2])==null?void 0:i.texture:this.textureManager.get(e.element),l=G.create("BOX",e.styles,"",e.rect.width,e.rect.height,this.qualityFactor,a,e.shaderHooks);t=new v.Mesh(s,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 s=0;s<F.MAX_LAYERS;s++)s===e.captureLayer-2?this.travelersByLayer[s].add(t):this.travelersByLayer[s].delete(t);else for(const s of this.travelersByLayer)s.delete(t);if(e.isFixed?this.fixedMeshes.add(t):this.fixedMeshes.delete(t),e.styles.imageSrc?this.textureManager.register(e.element,e.styles.imageSrc):this.textureManager.unregister(e.element),e.type==="BOX")for(const s of e.children)this.reconcileNode(s);else e.type==="TEXT"&&(this.reconcileTextChild(t,e,!1),t.userData.nativeMesh&&e.nativeStyles&&this.reconcileTextChild(t.userData.nativeMesh,e,!0))}reconcileTextChild(e,t,r){var o;const i=t.textLines||[{text:t.textContent||"",rect:t.rect}],c=r?t.nativeStyles:t.textStyles,s=JSON.stringify(c)+t.textContent+i.map(u=>u.text).join("|"),a=(o=e.userData)==null?void 0:o.textChildStyleHash;if(t.dirtyMask&ye||s!==a){e.children.filter(f=>f.name.startsWith("TEXT_CHILD")).forEach(f=>{var m;const A=f;(m=A.material.map)==null||m.dispose(),A.geometry.dispose(),e.remove(A)});const h=t.rect,d=h.x+h.width/2,p=h.y+h.height/2;i.forEach((f,A)=>{const m=G.create("TEXT",c,f.text,f.rect.width,f.rect.height,this.qualityFactor),y=new v.PlaneGeometry(1,1),T=new v.Mesh(y,m);T.name=`TEXT_CHILD_${A}`;const k=t.rect.width===0?1:f.rect.width/t.rect.width,C=t.rect.height===0?1:f.rect.height/t.rect.height;T.scale.set(k,C,1);const S=f.rect.x+f.rect.width/2,x=f.rect.y+f.rect.height/2,W=S-d,q=-(x-p);T.position.set(t.rect.width===0?0:W/t.rect.width,t.rect.height===0?0:q/t.rect.height,.005),e.add(T)}),e.userData.textChildStyleHash=s}e.children.forEach(u=>{if(!u.name.startsWith("TEXT_CHILD"))return;const h=u;if(r&&t.nativeLayer!==void 0)h.layers.set(N.HIDDEN),t.visibility&H&&h.layers.enable(N.getCaptureLayer(t.nativeLayer));else{const d=t.visibility&H?N.BASE:N.HIDDEN;if(h.layers.set(d),t.visibility&ne&&h.layers.enable(N.SELECTED),t.visibility&H)if(!r&&t.nativeLayer!==void 0&&t.nativeStyles!==void 0)for(let p=t.captureLayer;p<=F.MAX_LAYERS+1;p++)p!==t.nativeLayer&&h.layers.enable(N.getCaptureLayer(p));else for(let p=t.captureLayer;p<=F.MAX_LAYERS+1;p++)h.layers.enable(N.getCaptureLayer(p))}})}updateMeshProperties(e,t){var C,S,x,W,q;const{rect:r,styles:i}=t,c=this.renderer.getPixelRatio(),s=this.renderer.domElement.width/c,a=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={x:r.x,y:r.y,width:r.width,height:r.height};const o=.001;this.renderOrder++;const u=this.targetRect.left+window.scrollX,h=this.targetRect.top+window.scrollY;let d,p;if(this.isViewport)d=r.x-window.innerWidth/2+r.width/2,p=-r.y+window.innerHeight/2-r.height/2;else{const X=r.x-u,U=r.y-h;d=X-s/2+r.width/2,p=-U+a/2-r.height/2}e.position.set(d,p,i.zIndex+this.renderOrder*o);const f=r.x,A=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:A},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 T=0,k=0;if(y.transform&&y.transform!=="none"){const X=new DOMMatrix(y.transform);T=X.m41,k=X.m42}if(e.userData.baseTransform={x:T,y:k},delete e.userData.originRatioX,delete e.userData.originRatioY,G.update(e.userData.baseMaterial,"BOX",i,"",r.width,r.height,this.qualityFactor,t.isTraveler?(S=this.renderTargets[t.captureLayer-2])==null?void 0:S.texture:this.textureManager.get(t.element)),t.nativeStyles&&t.nativeRect){if(!e.userData.nativeMesh){const Y=G.create("BOX",t.nativeStyles,"",t.nativeRect.width,t.nativeRect.height,this.qualityFactor,t.isTraveler?(x=this.renderTargets[t.captureLayer-2])==null?void 0:x.texture:this.textureManager.get(t.element),t.shaderHooks),$=new v.Mesh(e.geometry,Y);t.type==="TEXT"&&($.name="BG_MESH"),this.scene.add($),e.userData.nativeMesh=$}const X=e.userData.nativeMesh;let U,Q;if(this.isViewport)U=t.nativeRect.x-window.innerWidth/2+t.nativeRect.width/2,Q=-t.nativeRect.y+window.innerHeight/2-t.nativeRect.height/2;else{const Y=t.nativeRect.x-u,$=t.nativeRect.y-h;U=Y-s/2+t.nativeRect.width/2,Q=-$+a/2-t.nativeRect.height/2}let re=t.nativeRect.width,ie=t.nativeRect.height,L=U,z=Q;if(t.nativeStyles.transform){const Y=t.nativeStyles.transform,$=Y.match(/scale\(([\d.]+%?)\)/);if($){let E=parseFloat($[1]);$[1].includes("%")&&(E/=100),re*=E,ie*=E}const he=Y.match(/scaleX\(([\d.]+%?)\)/);if(he){let E=parseFloat(he[1]);he[1].includes("%")&&(E/=100),re*=E}const de=Y.match(/scaleY\(([\d.]+%?)\)/);if(de){let E=parseFloat(de[1]);de[1].includes("%")&&(E/=100),ie*=E}const ue=Y.match(/translate\(([^,]+),\s*([^)]+)\)/);if(ue){const E=ue[1].trim(),R=ue[2].trim();let P=parseFloat(E);E.includes("%")&&(P=P/100*t.nativeRect.width);let I=parseFloat(R);R.includes("%")&&(I=I/100*t.nativeRect.height),L+=P,z-=I}const we=Y.match(/translateX\(([^)]+)\)/);if(we){const E=we[1].trim();let R=parseFloat(E);E.includes("%")&&(R=R/100*t.nativeRect.width),L+=R}const w=Y.match(/translateY\(([^)]+)\)/);if(w){const E=w[1].trim();let R=parseFloat(E);E.includes("%")&&(R=R/100*t.nativeRect.height),z-=R}}let ee=((W=X.material.userData)==null?void 0:W.shadowPadding)||0;X.scale.set(re+ee*2,ie+ee*2,1),X.position.set(L,z,t.nativeStyles.zIndex+this.renderOrder*o),G.update(X.material,"BOX",t.nativeStyles,"",t.nativeRect.width,t.nativeRect.height,this.qualityFactor,t.isTraveler?(q=this.renderTargets[t.captureLayer-2])==null?void 0:q.texture:this.textureManager.get(t.element))}else e.userData.nativeMesh&&(this.scene.remove(e.userData.nativeMesh),e.userData.nativeMesh.material instanceof v.Material&&e.userData.nativeMesh.material.dispose(),delete e.userData.nativeMesh)}updateMeshLayers(e,t){const r=t.visibility&H?N.BASE:N.HIDDEN;if(e.layers.set(r),t.visibility&ne&&e.layers.enable(N.SELECTED),e.userData.nativeMesh&&t.nativeLayer!==void 0){const i=e.userData.nativeMesh;if(i.layers.set(N.HIDDEN),t.visibility&H){i.layers.enable(N.getCaptureLayer(t.nativeLayer));for(let c=t.captureLayer;c<=F.MAX_LAYERS+1;c++)c!==t.nativeLayer&&e.layers.enable(N.getCaptureLayer(c))}}else if(t.visibility&H)for(let i=t.captureLayer;i<=F.MAX_LAYERS+1;i++)e.layers.enable(N.getCaptureLayer(i))}captureRenderTarget(e,t,r){if(e.size===0||!r)return;const i=new v.Color,c=this.renderer.getClearAlpha();this.renderer.getClearColor(i),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 s=new v.Vector3,a=this.isViewport?window.innerWidth+this.overscan*2:this.targetRect.width,l=this.isViewport?window.innerHeight+this.overscan*2:this.targetRect.height,o=this.renderer.getPixelRatio();for(const u of e){s.setFromMatrixPosition(u.matrixWorld),s.project(this.camera);const h=(s.x+1)/2*a,d=(s.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 A=u.scale.x*f+.5,m=u.scale.y*f+.5,y=h-A/2,T=d-m/2,k=(y*this.qualityFactor-p)/o,C=(T*this.qualityFactor-p)/o,S=(A*this.qualityFactor+p*2)/o,x=(m*this.qualityFactor+p*2)/o;this.renderer.setScissor(k,C,S,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(i,c)}render(){for(let l=0;l<F.MAX_LAYERS;l++){const o=l+1;this.captureRenderTarget(this.travelersByLayer[l],N.getCaptureLayer(o),this.renderTargets[l])}const e=this.renderer.getContext(),t=this.renderer.getPixelRatio(),r=this.renderer.domElement.height/t,i=this.renderer.domElement,c=i.getBoundingClientRect().top,s=i.getBoundingClientRect().left,a=(l,o)=>{if(o&&o.width>0&&o.height>0){const u=Math.floor((o.x-s)*t),h=Math.floor((r-(o.y-c+o.height))*t),d=Math.ceil(o.width*t),p=Math.ceil(o.height*t);l.onBeforeRender=()=>{e.enable(e.SCISSOR_TEST),e.scissor(u,h,d,p)},l.onAfterRender=()=>{e.disable(e.SCISSOR_TEST)},l.__hasScissorHook=!0}else l.__hasScissorHook&&(l.onBeforeRender=()=>{},l.onAfterRender=()=>{},l.__hasScissorHook=!1)};this.scene.children.forEach(l=>{var h;const o=l,u=(h=o.userData)==null?void 0:h.scissorRect;a(o,u),o.children.forEach(d=>{d.name.startsWith("TEXT_CHILD")&&a(d,u)})}),this.renderer.render(this.scene,this.camera)}syncMeshesByDOM(){const e=this.targetRect.left+window.scrollX,t=this.targetRect.top+window.scrollY,r=this.renderer.getPixelRatio(),i=this.renderer.domElement.width/r,c=this.renderer.domElement.height/r;this.scene.children.forEach(s=>{var h,d;const a=s;if(!a.userData||!a.userData.domElement)return;const l=a.userData.domElement;if(!l.isConnected)return;let o;if(l.nodeType===Node.TEXT_NODE){const p=document.createRange();p.selectNode(l),o=p.getBoundingClientRect()}else o=l.getBoundingClientRect();const u=a.userData.domRect;if(!u||Math.abs(o.x-u.x)>.5||Math.abs(o.y-u.y)>.5||Math.abs(o.width-u.width)>.5||Math.abs(o.height-u.height)>.5){a.userData.domRect={x:o.x,y:o.y,width:o.width,height:o.height};const p=a.userData.clipElements;if(p&&p.length>0){let y=-1/0,T=-1/0,k=1/0,C=1/0;for(const S of p){const x=S.getBoundingClientRect();y=Math.max(y,x.left),T=Math.max(T,x.top),k=Math.min(k,x.right),C=Math.min(C,x.bottom)}a.userData.scissorRect={x:y,y:T,width:Math.max(0,k-y),height:Math.max(0,C-T)}}else a.userData.scissorRect=void 0;let f,A;if(this.isViewport)f=o.x-window.innerWidth/2+o.width/2,A=-o.y+window.innerHeight/2-o.height/2;else{const y=o.x-e,T=o.y-t;f=y-i/2+o.width/2,A=-T+c/2-o.height/2}a.position.setX(f),a.position.setY(A);let m=((h=a.material.userData)==null?void 0:h.shadowPadding)||0;if(a.scale.set(o.width+m*2,o.height+m*2,1),a.updateMatrixWorld(),a.material instanceof v.ShaderMaterial&&G.forceUpdateUniforms(a.material,{width:o.width,height:o.height}),a.userData.nativeMesh){const y=a.userData.nativeMesh;let T=o.width,k=o.height,C=f,S=A;if(a.userData.nativeTransform){const W=a.userData.nativeTransform,q=W.match(/scale\(([\d.]+%?)\)/);if(q){let L=parseFloat(q[1]);q[1].includes("%")&&(L/=100),T*=L,k*=L}const X=W.match(/scaleX\(([\d.]+%?)\)/);if(X){let L=parseFloat(X[1]);X[1].includes("%")&&(L/=100),T*=L}const U=W.match(/scaleY\(([\d.]+%?)\)/);if(U){let L=parseFloat(U[1]);U[1].includes("%")&&(L/=100),k*=L}const Q=W.match(/translate\(([^,]+),\s*([^)]+)\)/);if(Q){const L=Q[1].trim(),z=Q[2].trim();let ee=parseFloat(L);L.includes("%")&&(ee=ee/100*o.width);let Y=parseFloat(z);z.includes("%")&&(Y=Y/100*o.height),C+=ee,S-=Y}const re=W.match(/translateX\(([^)]+)\)/);if(re){const L=re[1].trim();let z=parseFloat(L);L.includes("%")&&(z=z/100*o.width),C+=z}const ie=W.match(/translateY\(([^)]+)\)/);if(ie){const L=ie[1].trim();let z=parseFloat(L);L.includes("%")&&(z=z/100*o.height),S-=z}}let x=((d=y.material.userData)==null?void 0:d.shadowPadding)||0;y.position.setX(C),y.position.setY(S),y.scale.set(T+x*2,k+x*2,1),y.updateMatrixWorld(),y.material instanceof v.ShaderMaterial&&G.forceUpdateUniforms(y.material,{width:T,height:k})}}})}}function st(n){const e=n.textContent||"",t=[];let r="",i=null,c=-1;const s=(o,u)=>{for(let h=0;h<o.length;h++){const d=o[h],p=document.createRange();p.setStart(n,u+h),p.setEnd(n,u+h+1);const f=p.getBoundingClientRect();if(f.width===0&&f.height===0){r+=d;continue}c===-1||Math.abs(f.top-c)>f.height/2?(r&&i&&t.push({text:r,rect:{left:i.left,top:i.top,width:i.right-i.left,height:i.bottom-i.top}}),r=d,i={left:f.left,top:f.top,right:f.right,bottom:f.bottom},c=f.top):(r+=d,i&&(i.left=Math.min(i.left,f.left),i.top=Math.min(i.top,f.top),i.right=Math.max(i.right,f.right),i.bottom=Math.max(i.bottom,f.bottom)))}},a=e.match(/[^\s\-]+\-?|\-|\s+/g)||[];let l=0;for(const o of a){const u=document.createRange();u.setStart(n,l),u.setEnd(n,l+o.length);const h=u.getClientRects();if(h.length>1)s(o,l);else{const d=h.length===1?h[0]:u.getBoundingClientRect();if(d.width===0&&d.height===0){r+=o,l+=o.length;continue}c===-1||Math.abs(d.top-c)>d.height/2?(r&&i&&t.push({text:r,rect:{left:i.left,top:i.top,width:i.right-i.left,height:i.bottom-i.top}}),r=o,i={left:d.left,top:d.top,right:d.right,bottom:d.bottom},c=d.top):(r+=o,i&&(i.left=Math.min(i.left,d.left),i.top=Math.min(i.top,d.top),i.right=Math.max(i.right,d.right),i.bottom=Math.max(i.bottom,d.bottom)))}l+=o.length}return r&&i&&t.push({text:r,rect:{left:i.left,top:i.top,width:i.right-i.left,height:i.bottom-i.top}}),t.filter(o=>o.text.trim().length>0&&o.rect.width>0&&o.rect.height>0)}function Fe(n){const e=parseFloat(n.fontSize);let t=parseFloat(n.lineHeight);isNaN(t)&&(t=e*1.2);let r=parseFloat(n.letterSpacing);return isNaN(r)&&(r=0),{font:`${n.fontStyle} ${n.fontWeight} ${n.fontSize} ${n.fontFamily}`,fontSize:n.fontSize,color:n.color,textAlign:n.textAlign||"start",textBaseline:"alphabetic",direction:n.direction||"inherit",lineHeight:t,letterSpacing:r}}function Ne(n,e=te|ae|De|ye|ve,t,r=1,i=0,c=2,s,a,l){var ee,Y,$,he,de,ue,we;if(n.nodeType===Node.TEXT_NODE){const w=n;if(!w.textContent||!w.textContent.trim())return null;const E=w.textContent.replace(/\s+/g," ");if(E.length===0)return null;const R=st(w);if(R.length===0)return null;const P=w.parentElement,I=P?window.getComputedStyle(P):null;if(!I)return null;const Z=Math.min(...R.map(M=>M.rect.left)),j=Math.min(...R.map(M=>M.rect.top)),se=Math.max(...R.map(M=>M.rect.left+M.rect.width)),_=Math.max(...R.map(M=>M.rect.top+M.rect.height));return{id:Math.random().toString(36).substring(2,9),type:"TEXT",element:w,rect:{x:Z+window.scrollX,y:j+window.scrollY,width:se-Z,height:_-j},styles:{backgroundColor:"transparent",backgroundImage:"",opacity:P&&P.dataset[K.KEY]===K.VALUES.HIDE?1:parseFloat(I.opacity),zIndex:(isNaN(parseInt(I.zIndex))?0:parseInt(I.zIndex))+i,borderRadius:"0px",borderColor:"transparent",borderWidth:"0px",isTraveler:!1},textContent:E,textLines:R.map(M=>({text:M.text.trim(),rect:{x:M.rect.left+window.scrollX,y:M.rect.top+window.scrollY,width:M.rect.width,height:M.rect.height}})),textStyles:Fe(I),dirtyMask:e,visibility:t,isTraveler:!1,captureLayer:r,isFixed:I.position==="fixed",nativeLayer:s,nativeStyles:a?oe(oe({backgroundColor:"transparent",backgroundImage:"",opacity:P&&P.dataset[K.KEY]===K.VALUES.HIDE?1:parseFloat(I.opacity),zIndex:(isNaN(parseInt(I.zIndex))?0:parseInt(I.zIndex))+i,borderRadius:"0px",borderColor:"transparent",borderWidth:"0px",isTraveler:!1},Fe(I)),a):void 0,nativeRect:a?{x:Z+window.scrollX,y:j+window.scrollY,width:se-Z,height:_-j}:void 0,clipElements:l,children:[]}}if(n.nodeType!==Node.ELEMENT_NODE)return null;const o=n,u=o.dataset[B.KEY];let h=t,d=t;if(u){const w=new Set(u.split(/\s+/));for(const E of w)if(!Ee.includes(E))throw new Error(`[MirageEngine] Invalid filter token: '${E}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`);if(w.has(B.VALUES.END))return null;if(w.has(B.VALUES.INCLUDE_TREE)&&w.has(B.VALUES.EXCLUDE_TREE))throw new Error("[MirageEngine] Conflicting filters: 'include-tree' and 'exclude-tree' cannot be used together on the same element.");if(w.has(B.VALUES.INCLUDE_SELF)&&w.has(B.VALUES.EXCLUDE_SELF))throw new Error("[MirageEngine] Conflicting filters: 'include-self' and 'exclude-self' cannot be used together on the same element.");w.has(B.VALUES.INCLUDE_TREE)?h=h|H:w.has(B.VALUES.EXCLUDE_TREE)&&(h=h&~H),d=h,w.has(B.VALUES.INCLUDE_SELF)?d=d|H:w.has(B.VALUES.EXCLUDE_SELF)&&(d=d&~H)}const p=o.dataset[V.KEY];if(p){const w=new Set(p.split(/\s+/));for(const E of w)if(!Ee.includes(E))throw new Error(`[MirageEngine] Invalid select token: '${E}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`);if(w.has(V.VALUES.END))return null;if(w.has(V.VALUES.INCLUDE_TREE)&&w.has(V.VALUES.EXCLUDE_TREE))throw new Error("[MirageEngine] Conflicting selects: 'include-tree' and 'exclude-tree' cannot be used together on the same element.");if(w.has(V.VALUES.INCLUDE_SELF)&&w.has(V.VALUES.EXCLUDE_SELF))throw new Error("[MirageEngine] Conflicting selects: 'include-self' and 'exclude-self' cannot be used together on the same element.");w.has(V.VALUES.INCLUDE_TREE)?h=h|ne:w.has(V.VALUES.EXCLUDE_TREE)&&(h=h&~ne),d=h,w.has(V.VALUES.INCLUDE_SELF)?d=d|ne:w.has(V.VALUES.EXCLUDE_SELF)&&(d=d&~ne)}const f=o.dataset[F.KEY];let A=!1,m=a?oe({},a):{},y=s;if(f){let w=1;const E=f.indexOf("{"),R=f.lastIndexOf("}");let P=f;if(E!==-1&&R!==-1&&R>E){P=f.substring(0,E).trim();const _=f.substring(E,R+1);try{m=new Function("return "+_)()}catch(M){console.warn(`[MirageEngine] Failed to parse travel styles JSON: ${_}`)}}const I=P.split(/\s+/);let Z=!1;const j=I.indexOf(F.VALUES.TRAVELER);if(j!==-1){A=!0,Z=!0;const _=I[j+1];if(_&&!isNaN(parseInt(_,10)))w=parseInt(_,10);else{const M=I.find(fe=>!isNaN(parseInt(fe,10)));M&&(w=parseInt(M,10))}}const se=I.indexOf(F.VALUES.NATIVE);if(se!==-1){const _=I[se+1];if(_&&!isNaN(parseInt(_,10)))y=parseInt(_,10);else if(!A){const M=I.find(fe=>!isNaN(parseInt(fe,10)));M&&(y=parseInt(M,10))}}if(Z){const _=w+1;if(_<r)throw new Error(`[MirageEngine] Traveler layer (${w}) cannot be smaller than inherited capture layer (${r-1}).`);r=Math.min(_,F.MAX_LAYERS+1)}}const T=o.dataset[Le.KEY];let k;T&&(k=JSON.parse(T));const C=o.getBoundingClientRect(),S=window.getComputedStyle(o);if(C.width===0||C.height===0||S.display==="none")return null;let x=o.getAttribute("data-mid");x||(x=Math.random().toString(36).substring(2,11),o.setAttribute("data-mid",x));const W=parseInt(S.zIndex),q=(isNaN(W)?0:W)+i;let X;if(o.tagName==="IMG")X=o.src;else if(o.tagName.toLowerCase()==="svg"){const w=o.cloneNode(!0),E=m==null?void 0:m.color,R=m==null?void 0:m.fill,P=m==null?void 0:m.stroke,I=m==null?void 0:m.opacity,Z=(M,fe)=>{const J=window.getComputedStyle(M),be=fe,ct=J.fill===J.color,ht=J.stroke===J.color,Te=R||(ct?E:void 0)||J.fill;Te&&Te!=="none"&&(be.style.fill=Te);const Ce=P||(ht?E:void 0)||J.stroke;Ce&&Ce!=="none"&&(be.style.stroke=Ce),J.strokeWidth&&J.strokeWidth!=="0px"&&(be.style.strokeWidth=J.strokeWidth);const Xe=E||J.color;Xe&&(be.style.color=Xe);const Re=I||J.opacity;Re&&Re!=="1"&&(be.style.opacity=Re);for(let Se=0;Se<M.children.length;Se++)Z(M.children[Se],fe.children[Se])};Z(o,w);const j=o.getBoundingClientRect(),se=window.devicePixelRatio*c;w.hasAttribute("viewBox")||w.setAttribute("viewBox",`0 0 ${j.width} ${j.height}`),w.setAttribute("width",(j.width*se).toString()),w.setAttribute("height",(j.height*se).toString());let _=new XMLSerializer().serializeToString(w);_.includes("xmlns=")||(_=_.replace("<svg",'<svg xmlns="http://www.w3.org/2000/svg"')),X=`data:image/svg+xml;utf8,${encodeURIComponent(_)}`}else if(S.backgroundImage&&S.backgroundImage!=="none"){const w=S.backgroundImage.match(/url\(['"]?(.*?)['"]?\)/);w&&(X=w[1])}const U={backgroundColor:S.backgroundColor,backgroundImage:S.backgroundImage,opacity:o.dataset[K.KEY]===K.VALUES.HIDE?1:parseFloat(S.opacity),zIndex:q,borderRadius:S.borderRadius,borderColor:S.borderColor,borderWidth:S.borderWidth,boxShadow:S.boxShadow,imageSrc:X,isTraveler:A},Q=U;let re,ie;const L=[],z=S.overflow==="hidden"?[...l||[],o]:l;return o.tagName.toLowerCase()!=="svg"&&Array.from(o.childNodes).forEach(w=>{const E=w.nodeType===Node.TEXT_NODE?d:h,R=Ne(w,e,E,r,q,c,w.nodeType===Node.TEXT_NODE?y:void 0,w.nodeType===Node.TEXT_NODE&&Object.keys(m).length>0?m:void 0,z);R&&L.push(R)}),{id:x,type:"BOX",element:o,rect:{x:C.left+window.scrollX,y:C.top+window.scrollY,width:C.width,height:C.height},styles:Q,textContent:re,textStyles:ie,dirtyMask:e,visibility:d,isTraveler:A,captureLayer:r,nativeLayer:y,nativeStyles:y!==void 0?ze(oe({},U),{backgroundColor:(ee=m.backgroundColor)!=null?ee:U.backgroundColor,backgroundImage:(Y=m.backgroundImage)!=null?Y:U.backgroundImage,opacity:($=m.opacity)!=null?$:U.opacity,zIndex:m.zIndex!==void 0?m.zIndex+q:U.zIndex,borderRadius:(he=m.borderRadius)!=null?he:U.borderRadius,borderColor:(de=m.borderColor)!=null?de:U.borderColor,borderWidth:(ue=m.borderWidth)!=null?ue:U.borderWidth,boxShadow:(we=m.boxShadow)!=null?we:U.boxShadow,isTraveler:U.isTraveler,transform:m.transform}):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}:void 0,isFixed:S.position==="fixed",clipElements:l,children:L,shaderHooks:k}}function nt(n,e){e.size!==0&&e.forEach((t,r)=>{var c,s,a,l;const i=n.get(r);!i||!i.userData.basePosition||(G.forceUpdateUniforms(i.material,{backgroundColor:t.backgroundColor,backgroundImage:t.backgroundImage,boxShadow:t.boxShadow,opacity:t.opacity,borderRadius:(s=t.borderRadius)!=null?s:(c=i.userData.baseStyles)==null?void 0:c.borderRadius}),i.userData.nativeMesh&&G.forceUpdateUniforms(i.userData.nativeMesh.material,{backgroundColor:t.backgroundColor,backgroundImage:t.backgroundImage,boxShadow:t.boxShadow,opacity:t.opacity,borderRadius:(l=t.borderRadius)!=null?l:(a=i.userData.baseStyles)==null?void 0:a.borderRadius}))})}class ot{constructor(e,t,r,i){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 Ie(e,{resizeDebounce:i.resizeDebounce}),this.tracker.onLayoutChange.add((c,s)=>{document.querySelector(`[${F.NAME}~='${F.VALUES.TRAVELER}']`)!==null&&!this.isTravelEnabled&&(this.isTravelEnabled=!0,this.renderer.createRenderTarget());const l=Ne(this.target,c,H,1,0,this.renderer.qualityFactor);l&&this.renderer.syncScene(l,s)}),this.tracker.onStyleChange.add(c=>{nt(this.registry,c)}),this.tracker.onRender.add(()=>{this.renderer.syncMeshesByDOM(),this.renderer.render()})}start(){this.tracker.start()}stop(){this.tracker.stop()}}class at{constructor(){g(this,"store");this.store=new WeakMap}register(e,t){this.store.set(e,t)}get(e){return this.store.get(e)}has(e){return this.store.has(e)}remove(e){this.store.delete(e)}}class lt{constructor(e,t){g(this,"renderer");g(this,"syncer");g(this,"target");g(this,"registry");var i,c,s;if(this.target=e,this.registry=new at,!document.getElementById("mirage-engine-styles")){const a=document.createElement("style");a.id="mirage-engine-styles",a.textContent=`
|
|
185
|
+
`,d=c||l?u+h+((i==null?void 0:i.uvModifier)||""):"",p=c||l?Oe.baseColorChunk:"",f=(i==null?void 0:i.colorModifier)||"",A=_e.fragmentShader.replace("#INJECT_DECLARATIONS",n).replace("#INJECT_UV_MODIFIER",d).replace("#INJECT_BASE_COLOR",p).replace("#INJECT_COLOR_MODIFIER",f),m=ce(o.backgroundColor),S=ce(o.borderColor),T={uSize:{value:new v.Vector2(e,t)},uMeshSize:{value:new v.Vector2(e,t)},uShadowColor:{value:new v.Vector4(0,0,0,0)},uShadowOffset:{value:new v.Vector2(0,0)},uShadowBlur:{value:0},uShadowSpread:{value:0},uBgColor:{value:new v.Vector4(m.color.r,m.color.g,m.color.b,m.alpha)},uBorderColor:{value:new v.Vector4(S.color.r,S.color.g,S.color.b,S.alpha)},uBorderRadius:{value:new v.Vector4(0,0,0,0)},uBorderWidth:{value:le(o.borderWidth)},uOpacity:{value:(C=o.opacity)!=null?C:1},uTexture:{value:null},uTextureRepeat:{value:new v.Vector2(1,1)},uTextureOffset:{value:new v.Vector2(0,0)},uGradientCount:{value:0},uGradientAngle:{value:0},uGradientColors:{value:Array.from({length:8},()=>new v.Vector4(0,0,0,0))},uGradientStops:{value:new Float32Array(8)}};Be(T.uBorderRadius.value,o.borderRadius,Math.min(e,t)),c&&(T.uTexture.value=r);const k=new v.ShaderMaterial({uniforms:ne(ne({},T),a),vertexShader:_e.vertexShader,fragmentShader:A,transparent:!0,side:v.FrontSide});return o.backgroundImage&&xe(k,{backgroundImage:o.backgroundImage}),k}function tt(o,e,t,r,i){const c=le(e.borderWidth);xe(o,{width:t,height:r,borderRadius:e.borderRadius,borderWidth:c,backgroundColor:e.backgroundColor,borderColor:e.borderColor,opacity:e.opacity,texture:i,backgroundImage:e.backgroundImage,boxShadow:e.boxShadow})}function xe(o,e){var r,i,c;if(e.boxShadow!==void 0){const s=$e(e.boxShadow);s?(o.uniforms.uShadowColor.value.set(s.color.r,s.color.g,s.color.b,s.alpha),o.uniforms.uShadowOffset.value.set(s.offsetX,s.offsetY),o.uniforms.uShadowBlur.value=s.blurRadius,o.uniforms.uShadowSpread.value=s.spreadRadius,o.userData.shadowPadding=s.blurRadius+s.spreadRadius+Math.max(Math.abs(s.offsetX),Math.abs(s.offsetY))):(o.uniforms.uShadowColor.value.w=0,o.userData.shadowPadding=0)}if(e.width!==void 0&&e.height!==void 0&&o.uniforms.uSize.value.set(e.width,e.height),o.uniforms.uMeshSize){const s=o.userData.shadowPadding||0,a=e.width!==void 0?e.width:o.uniforms.uSize.value.x,l=e.height!==void 0?e.height:o.uniforms.uSize.value.y;o.uniforms.uMeshSize.value.set(a+s*2,l+s*2)}if(e.borderRadius!==void 0){const s=e.width!==void 0&&e.height!==void 0?Math.min(e.width,e.height):Math.min(o.uniforms.uSize.value.x,o.uniforms.uSize.value.y);Be(o.uniforms.uBorderRadius.value,e.borderRadius,s)}if(e.borderWidth!==void 0&&(o.uniforms.uBorderWidth.value=e.borderWidth),e.backgroundColor!==void 0)if(Array.isArray(e.backgroundColor)){const s=e.backgroundColor[3]!==void 0?e.backgroundColor[3]:o.uniforms.uBgColor.value.w;o.uniforms.uBgColor.value.set(e.backgroundColor[0],e.backgroundColor[1],e.backgroundColor[2],s)}else if(typeof e.backgroundColor=="string"){const s=ce(e.backgroundColor);o.uniforms.uBgColor.value.set(s.color.r,s.color.g,s.color.b,s.alpha)}else{const s=o.uniforms.uBgColor.value.w;o.uniforms.uBgColor.value.set(e.backgroundColor.r,e.backgroundColor.g,e.backgroundColor.b,s)}if(e.borderColor!==void 0)if(Array.isArray(e.borderColor)){const s=o.uniforms.uBorderColor.value.w;o.uniforms.uBorderColor.value.set(e.borderColor[0],e.borderColor[1],e.borderColor[2],s)}else if(typeof e.borderColor=="string"){const s=ce(e.borderColor);o.uniforms.uBorderColor.value.set(s.color.r,s.color.g,s.color.b,s.alpha)}else{const s=o.uniforms.uBorderColor.value.w;o.uniforms.uBorderColor.value.set(e.borderColor.r,e.borderColor.g,e.borderColor.b,s)}e.opacity!==void 0&&(o.uniforms.uOpacity.value=e.opacity),e.bgOpacity!==void 0&&(o.uniforms.uBgColor.value.w=e.bgOpacity),e.borderOpacity!==void 0&&(o.uniforms.uBorderColor.value.w=e.borderOpacity),o.uniforms.uTexture&&e.texture!==void 0&&(o.uniforms.uTexture.value=e.texture);const t=e.texture!==void 0?e.texture:(r=o.uniforms.uTexture)==null?void 0:r.value;if(t&&(t.image instanceof ImageBitmap||t.image instanceof HTMLImageElement||t.image instanceof HTMLCanvasElement)){const s=t.image.naturalWidth||t.image.videoWidth||t.image.width,a=t.image.naturalHeight||t.image.videoHeight||t.image.height,l=(i=e.width)!=null?i:o.uniforms.uSize.value.x,n=(c=e.height)!=null?c:o.uniforms.uSize.value.y;if(s&&a&&l&&n){const u=s/a,h=l/n;if(u>h){const d=h/u;o.uniforms.uTextureRepeat.value.set(d,1),o.uniforms.uTextureOffset.value.set((1-d)/2,0)}else{const d=u/h;o.uniforms.uTextureRepeat.value.set(1,d),o.uniforms.uTextureOffset.value.set(0,(1-d)/2)}}}else o.uniforms.uTextureRepeat&&(o.uniforms.uTextureRepeat.value.set(1,1),o.uniforms.uTextureOffset.value.set(0,0));if(e.backgroundImage!==void 0){const s=qe(e.backgroundImage);if(s){o.uniforms.uGradientCount.value=s.stops.length,o.uniforms.uGradientAngle.value=s.angle;for(let a=0;a<8;a++)if(a<s.stops.length){const l=s.stops[a];o.uniforms.uGradientColors.value[a].set(l.color.r,l.color.g,l.color.b,l.alpha),o.uniforms.uGradientStops.value[a]=l.stop}else o.uniforms.uGradientColors.value[a].set(0,0,0,0),o.uniforms.uGradientStops.value[a]=1}else o.uniforms.uGradientCount.value=0}for(const s of Object.keys(e))s!=="width"&&s!=="height"&&s!=="borderRadius"&&s!=="borderWidth"&&s!=="backgroundColor"&&s!=="borderColor"&&s!=="opacity"&&s!=="bgOpacity"&&s!=="borderOpacity"&&s!=="texture"&&s!=="backgroundImage"&&s!=="boxShadow"&&o.uniforms[s]!==void 0&&(o.uniforms[s].value!==void 0&&o.uniforms[s].value!==null&&typeof o.uniforms[s].value.set=="function"?Array.isArray(e[s])?o.uniforms[s].value.set(...e[s]):e[s]!==void 0&&(e[s].copy?o.uniforms[s].value.copy(e[s]):o.uniforms[s].value=e[s]):o.uniforms[s].value=e[s])}function Be(o,e,t=0){var l,n,u,h;if(e==null){o.set(0,0,0,0);return}if(typeof e=="number"){o.set(e,e,e,e);return}if(Array.isArray(e)){o.set(e[0],e[1],e[2],e[3]);return}const r=e.split("/")[0].trim().split(/\s+/),i=le(r[0],t),c=le((l=r[1])!=null?l:r[0],t),s=le((n=r[2])!=null?n:r[0],t),a=le((h=(u=r[3])!=null?u:r[1])!=null?h:r[0],t);o.set(i,c,s,a)}const G={create(o,e,t,r,i,c=2,s=null,a){return o==="BOX"?et(e,r,i,s,a):o==="TEXT"?new Ge(t||"",e,r,i,c):new v.MeshBasicMaterial({visible:!1})},update(o,e,t,r,i,c,s=2,a){e==="BOX"?tt(o,t,i,c,a):e==="TEXT"&&o.updateText(r||"",t,i,c,s)},forceUpdateUniforms(o,e){xe(o,e)}};class rt{constructor(e,t=!0){g(this,"observer");g(this,"textures",new WeakMap);g(this,"loadStatus",new WeakMap);g(this,"elementUrls",new WeakMap);g(this,"onUpdate");this.onUpdate=e,t&&(this.observer=new IntersectionObserver(r=>{for(const i of r){const c=i.target;i.isIntersecting?this.loadTexture(c):this.disposeTexture(c)}},{rootMargin:"300px"}))}register(e,t){if(e.nodeType!==Node.ELEMENT_NODE)return;this.elementUrls.get(e)!==t&&(this.elementUrls.set(e,t),this.observer?(this.observer.unobserve(e),this.observer.observe(e)):this.loadTexture(e))}unregister(e){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 Ve(this,null,function*(){if(this.loadStatus.get(e)||this.textures.has(e))return;const t=this.elementUrls.get(e);if(t){this.loadStatus.set(e,!0);try{let r;if(t.startsWith("data:image/svg+xml"))r=yield new Promise((c,s)=>{const a=new Image;a.onload=()=>c(a),a.onerror=s,a.src=t});else{const s=yield(yield fetch(t)).blob();r=yield createImageBitmap(s,{imageOrientation:"flipY"})}if(this.elementUrls.get(e)!==t){"close"in r&&r.close();return}const i=new v.Texture(r);r instanceof HTMLImageElement||(i.flipY=!1),i.colorSpace=v.LinearSRGBColorSpace,i.needsUpdate=!0,this.textures.set(e,i),this.onUpdate(e,i)}catch(r){console.warn("[MirageEngine] Failed to load texture:",t,r)}finally{this.elementUrls.has(e)&&this.loadStatus.set(e,!1)}}})}disposeTexture(e){const t=this.textures.get(e);t&&(t.dispose(),this.textures.delete(e),this.onUpdate(e,null)),this.loadStatus.set(e,!1)}get(e){return this.textures.get(e)}disposeAll(){this.observer&&this.observer.disconnect()}}class it{constructor(e,t,r,i){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:F.MAX_LAYERS},()=>new Set));g(this,"textureManager");g(this,"fixedMeshes",new Set);var a,l,n,u,h;this.target=e,this.mountContainer=r,this.registry=i,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 rt((d,p)=>{const f=this.registry.get(d);f&&f.material instanceof v.ShaderMaterial&&G.forceUpdateUniforms(f.material,{texture:p})},this.isViewport),this.canvas=document.createElement("canvas"),this.scene=new v.Scene,this.targetRect=this.target.getBoundingClientRect();const c=this.isViewport?window.innerWidth+this.overscan*2:this.targetRect.width,s=this.isViewport?window.innerHeight+this.overscan*2:this.targetRect.height;this.camera=new v.OrthographicCamera(c/-2,c/2,s/2,s/-2,1,1e3),this.camera.position.z=100,this.camera.layers.set(this.getSceneLayer()),this.renderer=new v.WebGLRenderer({canvas:this.canvas,alpha:!0,antialias:!0}),v.ColorManagement.enabled=!1,this.renderer.outputColorSpace=v.LinearSRGBColorSpace,this.renderer.setPixelRatio(window.devicePixelRatio),this.renderer.setSize(c,s),this.applyTextQuality((h=t.quality)!=null?h:"medium")}get isViewport(){return this.mode==="overlay"&&this.canvasSize==="viewport"}getSceneLayer(){return typeof this.targetLayer=="number"?this.targetLayer:this.targetLayer==="selected"?N.SELECTED:N.BASE}createRenderTarget(){for(let e=0;e<F.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 v.WebGLRenderTarget(t*this.qualityFactor,r*this.qualityFactor,{minFilter:v.LinearFilter,magFilter:v.LinearFilter,format:v.RGBAFormat,stencilBuffer:!1,depthBuffer:!0}))}}applyTextQuality(e){if(typeof e=="number"){this.qualityFactor=Math.max(.1,e);return}switch(e){case"low":this.qualityFactor=1;break;case"high":this.qualityFactor=4;break;case"medium":this.qualityFactor=2;break;default:this.qualityFactor=2;break}}mount(){this.mountContainer.prepend(this.canvas),this.canvas.style.pointerEvents=this.mode==="overlay"?"none":"auto",this.updateCanvasLayout()}updateCanvasLayout(){const e=this.isViewport?window.innerWidth+this.overscan*2:this.targetRect.width,t=this.isViewport?window.innerHeight+this.overscan*2:this.targetRect.height;this.canvas.style.width=`${e}px`,this.canvas.style.height=`${t}px`,this.mode==="duplicate"?(this.canvas.style.position="",this.canvas.style.top="",this.canvas.style.left="",this.canvas.style.display="block"):(this.canvas.style.position=this.isViewport?"fixed":"absolute",this.canvas.style.top=this.isViewport?`-${this.overscan}px`:`${this.target.offsetTop}px`,this.canvas.style.left=this.isViewport?`-${this.overscan}px`:`${this.target.offsetLeft}px`,this.canvas.style.display="block")}updateUniforms(e,t){const r=this.registry.get(e);r&&(r.traverse(i=>{i.isMesh&&i.material&&G.forceUpdateUniforms(i.material,t)}),r.userData.nativeMesh&&r.userData.nativeMesh.traverse(i=>{i.isMesh&&i.material&&G.forceUpdateUniforms(i.material,t)}))}dispose(){this.renderer.dispose(),this.canvas.remove(),this.textureManager.disposeAll()}setSize(e,t){this.renderer.setSize(e,t);for(const r of this.renderTargets)r.setSize(e*this.qualityFactor,t*this.qualityFactor);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(),i=this.isViewport?window.innerWidth+this.overscan*2:r.width,c=this.isViewport?window.innerHeight+this.overscan*2:r.height,s=this.isViewport?this.canvas.clientWidth:this.targetRect.width,a=this.isViewport?this.canvas.clientHeight:this.targetRect.height,l=Math.abs(i-s)>.1||Math.abs(c-a)>.1,n=this.mode==="overlay"&&(Math.abs(r.top-this.targetRect.top)>.1||Math.abs(r.left-this.targetRect.left)>.1);l?(this.targetRect=r,this.setSize(i,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 h=this.registry.get(u);if(h){this.scene.remove(h);for(const d of this.travelersByLayer)d.delete(h);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 v.Mesh&&(d.geometry&&d.geometry.dispose(),d.material&&(Array.isArray(d.material)?d.material.forEach(p=>p.dispose()):d.material.dispose()))}),this.registry.remove(u),this.textureManager.unregister(u)}})}reconcileNode(e){var i,c;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 v.Material&&t.material.dispose(),this.registry.remove(e.element),t=void 0),!t){const s=new v.PlaneGeometry(1,1),a=e.isTraveler?(i=this.renderTargets[e.captureLayer-2])==null?void 0:i.texture:this.textureManager.get(e.element),l=G.create("BOX",e.styles,"",e.rect.width,e.rect.height,this.qualityFactor,a,e.shaderHooks);t=new v.Mesh(s,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 s=0;s<F.MAX_LAYERS;s++)s===e.captureLayer-2?this.travelersByLayer[s].add(t):this.travelersByLayer[s].delete(t);else for(const s of this.travelersByLayer)s.delete(t);if(e.isFixed?this.fixedMeshes.add(t):this.fixedMeshes.delete(t),e.styles.imageSrc?this.textureManager.register(e.element,e.styles.imageSrc):this.textureManager.unregister(e.element),e.type==="BOX")for(const s of e.children)this.reconcileNode(s);else e.type==="TEXT"&&(this.reconcileTextChild(t,e,!1),t.userData.nativeMesh&&e.nativeStyles&&this.reconcileTextChild(t.userData.nativeMesh,e,!0))}reconcileTextChild(e,t,r){var n;const i=t.textLines||[{text:t.textContent||"",rect:t.rect}],c=r?t.nativeStyles:t.textStyles,s=JSON.stringify(c)+t.textContent+i.map(u=>u.text).join("|"),a=(n=e.userData)==null?void 0:n.textChildStyleHash;if(t.dirtyMask&ye||s!==a){e.children.filter(f=>f.name.startsWith("TEXT_CHILD")).forEach(f=>{var m;const A=f;(m=A.material.map)==null||m.dispose(),A.geometry.dispose(),e.remove(A)});const h=t.rect,d=h.x+h.width/2,p=h.y+h.height/2;i.forEach((f,A)=>{const m=G.create("TEXT",c,f.text,f.rect.width,f.rect.height,this.qualityFactor),S=new v.PlaneGeometry(1,1),T=new v.Mesh(S,m);T.name=`TEXT_CHILD_${A}`;const k=t.rect.width===0?1:f.rect.width/t.rect.width,C=t.rect.height===0?1:f.rect.height/t.rect.height;T.scale.set(k,C,1);const y=f.rect.x+f.rect.width/2,x=f.rect.y+f.rect.height/2,W=y-d,q=-(x-p);T.position.set(t.rect.width===0?0:W/t.rect.width,t.rect.height===0?0:q/t.rect.height,.005),e.add(T)}),e.userData.textChildStyleHash=s}e.children.forEach(u=>{if(!u.name.startsWith("TEXT_CHILD"))return;const h=u;if(r&&t.nativeLayer!==void 0)h.layers.set(N.HIDDEN),t.visibility&H&&h.layers.enable(N.getCaptureLayer(t.nativeLayer));else{const d=t.visibility&H?N.BASE:N.HIDDEN;if(h.layers.set(d),t.visibility&oe&&h.layers.enable(N.SELECTED),t.visibility&H)if(!r&&t.nativeLayer!==void 0&&t.nativeStyles!==void 0)for(let p=t.captureLayer;p<=F.MAX_LAYERS+1;p++)p!==t.nativeLayer&&h.layers.enable(N.getCaptureLayer(p));else for(let p=t.captureLayer;p<=F.MAX_LAYERS+1;p++)h.layers.enable(N.getCaptureLayer(p))}})}updateMeshProperties(e,t){var C,y,x,W,q;const{rect:r,styles:i}=t,c=this.renderer.getPixelRatio(),s=this.renderer.domElement.width/c,a=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={x:r.x,y:r.y,width:r.width,height:r.height};const n=.001;this.renderOrder++;const u=this.targetRect.left+window.scrollX,h=this.targetRect.top+window.scrollY;let d,p;if(this.isViewport)d=r.x-window.innerWidth/2+r.width/2,p=-r.y+window.innerHeight/2-r.height/2;else{const X=r.x-u,U=r.y-h;d=X-s/2+r.width/2,p=-U+a/2-r.height/2}e.position.set(d,p,i.zIndex+this.renderOrder*n);const f=r.x,A=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:A},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,S=window.getComputedStyle(m);let T=0,k=0;if(S.transform&&S.transform!=="none"){const X=new DOMMatrix(S.transform);T=X.m41,k=X.m42}if(e.userData.baseTransform={x:T,y:k},delete e.userData.originRatioX,delete e.userData.originRatioY,G.update(e.userData.baseMaterial,"BOX",i,"",r.width,r.height,this.qualityFactor,t.isTraveler?(y=this.renderTargets[t.captureLayer-2])==null?void 0:y.texture:this.textureManager.get(t.element)),t.nativeStyles&&t.nativeRect){if(!e.userData.nativeMesh){const Y=G.create("BOX",t.nativeStyles,"",t.nativeRect.width,t.nativeRect.height,this.qualityFactor,t.isTraveler?(x=this.renderTargets[t.captureLayer-2])==null?void 0:x.texture:this.textureManager.get(t.element),t.shaderHooks),$=new v.Mesh(e.geometry,Y);t.type==="TEXT"&&($.name="BG_MESH"),this.scene.add($),e.userData.nativeMesh=$}const X=e.userData.nativeMesh;let U,Q;if(this.isViewport)U=t.nativeRect.x-window.innerWidth/2+t.nativeRect.width/2,Q=-t.nativeRect.y+window.innerHeight/2-t.nativeRect.height/2;else{const Y=t.nativeRect.x-u,$=t.nativeRect.y-h;U=Y-s/2+t.nativeRect.width/2,Q=-$+a/2-t.nativeRect.height/2}let re=t.nativeRect.width,ie=t.nativeRect.height,L=U,z=Q;if(t.nativeStyles.transform){const Y=t.nativeStyles.transform,$=Y.match(/scale\(([\d.]+%?)\)/);if($){let E=parseFloat($[1]);$[1].includes("%")&&(E/=100),re*=E,ie*=E}const he=Y.match(/scaleX\(([\d.]+%?)\)/);if(he){let E=parseFloat(he[1]);he[1].includes("%")&&(E/=100),re*=E}const de=Y.match(/scaleY\(([\d.]+%?)\)/);if(de){let E=parseFloat(de[1]);de[1].includes("%")&&(E/=100),ie*=E}const ue=Y.match(/translate\(([^,]+),\s*([^)]+)\)/);if(ue){const E=ue[1].trim(),R=ue[2].trim();let P=parseFloat(E);E.includes("%")&&(P=P/100*t.nativeRect.width);let I=parseFloat(R);R.includes("%")&&(I=I/100*t.nativeRect.height),L+=P,z-=I}const we=Y.match(/translateX\(([^)]+)\)/);if(we){const E=we[1].trim();let R=parseFloat(E);E.includes("%")&&(R=R/100*t.nativeRect.width),L+=R}const w=Y.match(/translateY\(([^)]+)\)/);if(w){const E=w[1].trim();let R=parseFloat(E);E.includes("%")&&(R=R/100*t.nativeRect.height),z-=R}}let ee=((W=X.material.userData)==null?void 0:W.shadowPadding)||0;X.scale.set(re+ee*2,ie+ee*2,1),X.position.set(L,z,t.nativeStyles.zIndex+this.renderOrder*n),G.update(X.material,"BOX",t.nativeStyles,"",t.nativeRect.width,t.nativeRect.height,this.qualityFactor,t.isTraveler?(q=this.renderTargets[t.captureLayer-2])==null?void 0:q.texture:this.textureManager.get(t.element))}else e.userData.nativeMesh&&(this.scene.remove(e.userData.nativeMesh),e.userData.nativeMesh.material instanceof v.Material&&e.userData.nativeMesh.material.dispose(),delete e.userData.nativeMesh)}updateMeshLayers(e,t){const r=t.visibility&H?N.BASE:N.HIDDEN;if(e.layers.set(r),t.visibility&oe&&e.layers.enable(N.SELECTED),e.userData.nativeMesh&&t.nativeLayer!==void 0){const i=e.userData.nativeMesh;if(i.layers.set(N.HIDDEN),t.visibility&H){i.layers.enable(N.getCaptureLayer(t.nativeLayer));for(let c=t.captureLayer;c<=F.MAX_LAYERS+1;c++)c!==t.nativeLayer&&e.layers.enable(N.getCaptureLayer(c))}}else if(t.visibility&H)for(let i=t.captureLayer;i<=F.MAX_LAYERS+1;i++)e.layers.enable(N.getCaptureLayer(i))}captureRenderTarget(e,t,r){if(e.size===0||!r)return;const i=new v.Color,c=this.renderer.getClearAlpha();this.renderer.getClearColor(i),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 s=new v.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();for(const u of e){s.setFromMatrixPosition(u.matrixWorld),s.project(this.camera);const h=(s.x+1)/2*a,d=(s.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 A=u.scale.x*f+.5,m=u.scale.y*f+.5,S=h-A/2,T=d-m/2,k=(S*this.qualityFactor-p)/n,C=(T*this.qualityFactor-p)/n,y=(A*this.qualityFactor+p*2)/n,x=(m*this.qualityFactor+p*2)/n;this.renderer.setScissor(k,C,y,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(i,c)}render(){for(let l=0;l<F.MAX_LAYERS;l++){const n=l+1;this.captureRenderTarget(this.travelersByLayer[l],N.getCaptureLayer(n),this.renderTargets[l])}const e=this.renderer.getContext(),t=this.renderer.getPixelRatio(),r=this.renderer.domElement.height/t,i=this.renderer.domElement,c=i.getBoundingClientRect().top,s=i.getBoundingClientRect().left,a=(l,n)=>{if(n&&n.width>0&&n.height>0){const u=Math.floor((n.x-s)*t),h=Math.floor((r-(n.y-c+n.height))*t),d=Math.ceil(n.width*t),p=Math.ceil(n.height*t);l.onBeforeRender=()=>{e.enable(e.SCISSOR_TEST),e.scissor(u,h,d,p)},l.onAfterRender=()=>{e.disable(e.SCISSOR_TEST)},l.__hasScissorHook=!0}else l.__hasScissorHook&&(l.onBeforeRender=()=>{},l.onAfterRender=()=>{},l.__hasScissorHook=!1)};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)})}),this.renderer.render(this.scene,this.camera)}syncMeshesByDOM(){const e=this.targetRect.left+window.scrollX,t=this.targetRect.top+window.scrollY,r=this.renderer.getPixelRatio(),i=this.renderer.domElement.width/r,c=this.renderer.domElement.height/r;this.scene.children.forEach(s=>{var h,d;const a=s;if(!a.userData||!a.userData.domElement)return;const l=a.userData.domElement;if(!l.isConnected)return;let n;if(l.nodeType===Node.TEXT_NODE){const p=document.createRange();p.selectNode(l),n=p.getBoundingClientRect()}else n=l.getBoundingClientRect();const u=a.userData.domRect;if(!u||Math.abs(n.x-u.x)>.5||Math.abs(n.y-u.y)>.5||Math.abs(n.width-u.width)>.5||Math.abs(n.height-u.height)>.5){a.userData.domRect={x:n.x,y:n.y,width:n.width,height:n.height};const p=a.userData.clipElements;if(p&&p.length>0){let S=-1/0,T=-1/0,k=1/0,C=1/0;for(const y of p){const x=y.getBoundingClientRect();S=Math.max(S,x.left),T=Math.max(T,x.top),k=Math.min(k,x.right),C=Math.min(C,x.bottom)}a.userData.scissorRect={x:S,y:T,width:Math.max(0,k-S),height:Math.max(0,C-T)}}else a.userData.scissorRect=void 0;let f,A;if(this.isViewport)f=n.x-window.innerWidth/2+n.width/2,A=-n.y+window.innerHeight/2-n.height/2;else{const S=n.x-e,T=n.y-t;f=S-i/2+n.width/2,A=-T+c/2-n.height/2}a.position.setX(f),a.position.setY(A);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 v.ShaderMaterial&&G.forceUpdateUniforms(a.material,{width:n.width,height:n.height}),a.userData.nativeMesh){const S=a.userData.nativeMesh;let T=n.width,k=n.height,C=f,y=A;if(a.userData.nativeTransform){const W=a.userData.nativeTransform,q=W.match(/scale\(([\d.]+%?)\)/);if(q){let L=parseFloat(q[1]);q[1].includes("%")&&(L/=100),T*=L,k*=L}const X=W.match(/scaleX\(([\d.]+%?)\)/);if(X){let L=parseFloat(X[1]);X[1].includes("%")&&(L/=100),T*=L}const U=W.match(/scaleY\(([\d.]+%?)\)/);if(U){let L=parseFloat(U[1]);U[1].includes("%")&&(L/=100),k*=L}const Q=W.match(/translate\(([^,]+),\s*([^)]+)\)/);if(Q){const L=Q[1].trim(),z=Q[2].trim();let ee=parseFloat(L);L.includes("%")&&(ee=ee/100*n.width);let Y=parseFloat(z);z.includes("%")&&(Y=Y/100*n.height),C+=ee,y-=Y}const re=W.match(/translateX\(([^)]+)\)/);if(re){const L=re[1].trim();let z=parseFloat(L);L.includes("%")&&(z=z/100*n.width),C+=z}const ie=W.match(/translateY\(([^)]+)\)/);if(ie){const L=ie[1].trim();let z=parseFloat(L);L.includes("%")&&(z=z/100*n.height),y-=z}}let x=((d=S.material.userData)==null?void 0:d.shadowPadding)||0;S.position.setX(C),S.position.setY(y),S.scale.set(T+x*2,k+x*2,1),S.updateMatrixWorld(),S.material instanceof v.ShaderMaterial&&G.forceUpdateUniforms(S.material,{width:T,height:k})}}})}}function st(o){const e=o.textContent||"",t=[];let r="",i=null,c=-1;const s=(n,u)=>{for(let h=0;h<n.length;h++){const d=n[h],p=document.createRange();p.setStart(o,u+h),p.setEnd(o,u+h+1);const f=p.getBoundingClientRect();if(f.width===0&&f.height===0){r+=d;continue}c===-1||Math.abs(f.top-c)>f.height/2?(r&&i&&t.push({text:r,rect:{left:i.left,top:i.top,width:i.right-i.left,height:i.bottom-i.top}}),r=d,i={left:f.left,top:f.top,right:f.right,bottom:f.bottom},c=f.top):(r+=d,i&&(i.left=Math.min(i.left,f.left),i.top=Math.min(i.top,f.top),i.right=Math.max(i.right,f.right),i.bottom=Math.max(i.bottom,f.bottom)))}},a=e.match(/[^\s\-]+\-?|\-|\s+/g)||[];let l=0;for(const n of a){const u=document.createRange();u.setStart(o,l),u.setEnd(o,l+n.length);const h=u.getClientRects();if(h.length>1)s(n,l);else{const d=h.length===1?h[0]:u.getBoundingClientRect();if(d.width===0&&d.height===0){r+=n,l+=n.length;continue}c===-1||Math.abs(d.top-c)>d.height/2?(r&&i&&t.push({text:r,rect:{left:i.left,top:i.top,width:i.right-i.left,height:i.bottom-i.top}}),r=n,i={left:d.left,top:d.top,right:d.right,bottom:d.bottom},c=d.top):(r+=n,i&&(i.left=Math.min(i.left,d.left),i.top=Math.min(i.top,d.top),i.right=Math.max(i.right,d.right),i.bottom=Math.max(i.bottom,d.bottom)))}l+=n.length}return r&&i&&t.push({text:r,rect:{left:i.left,top:i.top,width:i.right-i.left,height:i.bottom-i.top}}),t.filter(n=>n.text.trim().length>0&&n.rect.width>0&&n.rect.height>0)}function Fe(o){const e=parseFloat(o.fontSize);let t=parseFloat(o.lineHeight);isNaN(t)&&(t=e*1.2);let r=parseFloat(o.letterSpacing);return isNaN(r)&&(r=0),{font:`${o.fontStyle} ${o.fontWeight} ${o.fontSize} ${o.fontFamily}`,fontSize:o.fontSize,color:o.color,textAlign:o.textAlign||"start",textBaseline:"alphabetic",direction:o.direction||"inherit",lineHeight:t,letterSpacing:r}}function Ne(o,e=te|ae|De|ye|ve,t,r=1,i=0,c=2,s,a,l){var ee,Y,$,he,de,ue,we;if(o.nodeType===Node.TEXT_NODE){const w=o;if(!w.textContent||!w.textContent.trim())return null;const E=w.textContent.replace(/\s+/g," ");if(E.length===0)return null;const R=st(w);if(R.length===0)return null;const P=w.parentElement,I=P?window.getComputedStyle(P):null;if(!I)return null;const Z=Math.min(...R.map(M=>M.rect.left)),j=Math.min(...R.map(M=>M.rect.top)),se=Math.max(...R.map(M=>M.rect.left+M.rect.width)),_=Math.max(...R.map(M=>M.rect.top+M.rect.height));return{id:Math.random().toString(36).substring(2,9),type:"TEXT",element:w,rect:{x:Z+window.scrollX,y:j+window.scrollY,width:se-Z,height:_-j},styles:{backgroundColor:"transparent",backgroundImage:"",opacity:P&&P.dataset[K.KEY]===K.VALUES.HIDE?1:parseFloat(I.opacity),zIndex:(isNaN(parseInt(I.zIndex))?0:parseInt(I.zIndex))+i,borderRadius:"0px",borderColor:"transparent",borderWidth:"0px",isTraveler:!1},textContent:E,textLines:R.map(M=>({text:M.text.trim(),rect:{x:M.rect.left+window.scrollX,y:M.rect.top+window.scrollY,width:M.rect.width,height:M.rect.height}})),textStyles:Fe(I),dirtyMask:e,visibility:t,isTraveler:!1,captureLayer:r,isFixed:I.position==="fixed",nativeLayer:s,nativeStyles:a?ne(ne({backgroundColor:"transparent",backgroundImage:"",opacity:P&&P.dataset[K.KEY]===K.VALUES.HIDE?1:parseFloat(I.opacity),zIndex:(isNaN(parseInt(I.zIndex))?0:parseInt(I.zIndex))+i,borderRadius:"0px",borderColor:"transparent",borderWidth:"0px",isTraveler:!1},Fe(I)),a):void 0,nativeRect:a?{x:Z+window.scrollX,y:j+window.scrollY,width:se-Z,height:_-j}:void 0,clipElements:l,children:[]}}if(o.nodeType!==Node.ELEMENT_NODE)return null;const n=o,u=n.dataset[B.KEY];let h=t,d=t;if(u){const w=new Set(u.split(/\s+/));for(const E of w)if(!Ee.includes(E))throw new Error(`[MirageEngine] Invalid filter token: '${E}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`);if(w.has(B.VALUES.END))return null;if(w.has(B.VALUES.INCLUDE_TREE)&&w.has(B.VALUES.EXCLUDE_TREE))throw new Error("[MirageEngine] Conflicting filters: 'include-tree' and 'exclude-tree' cannot be used together on the same element.");if(w.has(B.VALUES.INCLUDE_SELF)&&w.has(B.VALUES.EXCLUDE_SELF))throw new Error("[MirageEngine] Conflicting filters: 'include-self' and 'exclude-self' cannot be used together on the same element.");w.has(B.VALUES.INCLUDE_TREE)?h=h|H:w.has(B.VALUES.EXCLUDE_TREE)&&(h=h&~H),d=h,w.has(B.VALUES.INCLUDE_SELF)?d=d|H:w.has(B.VALUES.EXCLUDE_SELF)&&(d=d&~H)}const p=n.dataset[V.KEY];if(p){const w=new Set(p.split(/\s+/));for(const E of w)if(!Ee.includes(E))throw new Error(`[MirageEngine] Invalid select token: '${E}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`);if(w.has(V.VALUES.END))return null;if(w.has(V.VALUES.INCLUDE_TREE)&&w.has(V.VALUES.EXCLUDE_TREE))throw new Error("[MirageEngine] Conflicting selects: 'include-tree' and 'exclude-tree' cannot be used together on the same element.");if(w.has(V.VALUES.INCLUDE_SELF)&&w.has(V.VALUES.EXCLUDE_SELF))throw new Error("[MirageEngine] Conflicting selects: 'include-self' and 'exclude-self' cannot be used together on the same element.");w.has(V.VALUES.INCLUDE_TREE)?h=h|oe:w.has(V.VALUES.EXCLUDE_TREE)&&(h=h&~oe),d=h,w.has(V.VALUES.INCLUDE_SELF)?d=d|oe:w.has(V.VALUES.EXCLUDE_SELF)&&(d=d&~oe)}const f=n.dataset[F.KEY];let A=!1,m=a?ne({},a):{},S=s;if(f){let w=1;const E=f.indexOf("{"),R=f.lastIndexOf("}");let P=f;if(E!==-1&&R!==-1&&R>E){P=f.substring(0,E).trim();const _=f.substring(E,R+1);try{m=new Function("return "+_)()}catch(M){console.warn(`[MirageEngine] Failed to parse travel styles JSON: ${_}`)}}const I=P.split(/\s+/);let Z=!1;const j=I.indexOf(F.VALUES.TRAVELER);if(j!==-1){A=!0,Z=!0;const _=I[j+1];if(_&&!isNaN(parseInt(_,10)))w=parseInt(_,10);else{const M=I.find(fe=>!isNaN(parseInt(fe,10)));M&&(w=parseInt(M,10))}}const se=I.indexOf(F.VALUES.NATIVE);if(se!==-1){const _=I[se+1];if(_&&!isNaN(parseInt(_,10)))S=parseInt(_,10);else if(!A){const M=I.find(fe=>!isNaN(parseInt(fe,10)));M&&(S=parseInt(M,10))}}if(Z){const _=w+1;if(_<r)throw new Error(`[MirageEngine] Traveler layer (${w}) cannot be smaller than inherited capture layer (${r-1}).`);r=Math.min(_,F.MAX_LAYERS+1)}}const T=n.dataset[Le.KEY];let k;T&&(k=JSON.parse(T));const C=n.getBoundingClientRect(),y=window.getComputedStyle(n);if(C.width===0||C.height===0||y.display==="none")return null;let x=n.getAttribute("data-mid");x||(x=Math.random().toString(36).substring(2,11),n.setAttribute("data-mid",x));const W=parseInt(y.zIndex),q=(isNaN(W)?0:W)+i;let X;if(n.tagName==="IMG")X=n.src;else if(n.tagName.toLowerCase()==="svg"){const w=n.cloneNode(!0),E=m==null?void 0:m.color,R=m==null?void 0:m.fill,P=m==null?void 0:m.stroke,I=m==null?void 0:m.opacity,Z=(M,fe)=>{const J=window.getComputedStyle(M),be=fe,ct=J.fill===J.color,ht=J.stroke===J.color,Te=R||(ct?E:void 0)||J.fill;Te&&Te!=="none"&&(be.style.fill=Te);const Ce=P||(ht?E:void 0)||J.stroke;Ce&&Ce!=="none"&&(be.style.stroke=Ce),J.strokeWidth&&J.strokeWidth!=="0px"&&(be.style.strokeWidth=J.strokeWidth);const Xe=E||J.color;Xe&&(be.style.color=Xe);const Re=I||J.opacity;Re&&Re!=="1"&&(be.style.opacity=Re);for(let Se=0;Se<M.children.length;Se++)Z(M.children[Se],fe.children[Se])};Z(n,w);const j=n.getBoundingClientRect(),se=window.devicePixelRatio*c;w.hasAttribute("viewBox")||w.setAttribute("viewBox",`0 0 ${j.width} ${j.height}`),w.setAttribute("width",(j.width*se).toString()),w.setAttribute("height",(j.height*se).toString());let _=new XMLSerializer().serializeToString(w);_.includes("xmlns=")||(_=_.replace("<svg",'<svg xmlns="http://www.w3.org/2000/svg"')),X=`data:image/svg+xml;utf8,${encodeURIComponent(_)}`}else if(y.backgroundImage&&y.backgroundImage!=="none"){const w=y.backgroundImage.match(/url\(['"]?(.*?)['"]?\)/);w&&(X=w[1])}const U={backgroundColor:y.backgroundColor,backgroundImage:y.backgroundImage,opacity:n.dataset[K.KEY]===K.VALUES.HIDE?1:parseFloat(y.opacity),zIndex:q,borderRadius:y.borderRadius,borderColor:y.borderColor,borderWidth:y.borderWidth,boxShadow:y.boxShadow,imageSrc:X,isTraveler:A},Q=U;let re,ie;const L=[],z=y.overflow==="hidden"?[...l||[],n]:l;return n.tagName.toLowerCase()!=="svg"&&Array.from(n.childNodes).forEach(w=>{const E=w.nodeType===Node.TEXT_NODE?d:h,R=Ne(w,e,E,r,q,c,w.nodeType===Node.TEXT_NODE?S:void 0,w.nodeType===Node.TEXT_NODE&&Object.keys(m).length>0?m:void 0,z);R&&L.push(R)}),{id:x,type:"BOX",element:n,rect:{x:C.left+window.scrollX,y:C.top+window.scrollY,width:C.width,height:C.height},styles:Q,textContent:re,textStyles:ie,dirtyMask:e,visibility:d,isTraveler:A,captureLayer:r,nativeLayer:S,nativeStyles:S!==void 0?ze(ne({},U),{backgroundColor:(ee=m.backgroundColor)!=null?ee:U.backgroundColor,backgroundImage:(Y=m.backgroundImage)!=null?Y:U.backgroundImage,opacity:($=m.opacity)!=null?$:U.opacity,zIndex:m.zIndex!==void 0?m.zIndex+q:U.zIndex,borderRadius:(he=m.borderRadius)!=null?he:U.borderRadius,borderColor:(de=m.borderColor)!=null?de:U.borderColor,borderWidth:(ue=m.borderWidth)!=null?ue:U.borderWidth,boxShadow:(we=m.boxShadow)!=null?we:U.boxShadow,isTraveler:U.isTraveler,transform:m.transform}):void 0,nativeRect:S!==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}:void 0,isFixed:y.position==="fixed",clipElements:l,children:L,shaderHooks:k}}function ot(o,e){e.size!==0&&e.forEach((t,r)=>{var c,s,a,l;const i=o.get(r);!i||!i.userData.basePosition||(G.forceUpdateUniforms(i.material,{backgroundColor:t.backgroundColor,backgroundImage:t.backgroundImage,boxShadow:t.boxShadow,opacity:t.opacity,borderRadius:(s=t.borderRadius)!=null?s:(c=i.userData.baseStyles)==null?void 0:c.borderRadius}),i.userData.nativeMesh&&G.forceUpdateUniforms(i.userData.nativeMesh.material,{backgroundColor:t.backgroundColor,backgroundImage:t.backgroundImage,boxShadow:t.boxShadow,opacity:t.opacity,borderRadius:(l=t.borderRadius)!=null?l:(a=i.userData.baseStyles)==null?void 0:a.borderRadius}))})}class nt{constructor(e,t,r,i){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 Ie(e,{resizeDebounce:i.resizeDebounce}),this.tracker.onLayoutChange.add((c,s)=>{document.querySelector(`[${F.NAME}~='${F.VALUES.TRAVELER}']`)!==null&&!this.isTravelEnabled&&(this.isTravelEnabled=!0,this.renderer.createRenderTarget());const l=Ne(this.target,c,H,1,0,this.renderer.qualityFactor);l&&this.renderer.syncScene(l,s)}),this.tracker.onStyleChange.add(c=>{ot(this.registry,c)}),this.tracker.onRender.add(()=>{this.renderer.syncMeshesByDOM(),this.renderer.render()})}start(){this.tracker.start()}stop(){this.tracker.stop()}}class at{constructor(){g(this,"store");this.store=new WeakMap}register(e,t){this.store.set(e,t)}get(e){return this.store.get(e)}has(e){return this.store.has(e)}remove(e){this.store.delete(e)}}class lt{constructor(e,t){g(this,"renderer");g(this,"syncer");g(this,"target");g(this,"registry");var i,c,s;if(this.target=e,this.registry=new at,!document.getElementById("mirage-engine-styles")){const a=document.createElement("style");a.id="mirage-engine-styles",a.textContent=`
|
|
185
186
|
[${K.NAME}="${K.VALUES.HIDE}"] {
|
|
186
187
|
opacity: 0 !important;
|
|
187
188
|
}
|
|
188
|
-
`,document.head.appendChild(a)}let r;if(t.mode==="duplicate"?r=(c=(i=t.container)!=null?i:this.target.parentElement)!=null?c:void 0:r=(s=this.target.parentElement)!=null?s:void 0,!r)throw new Error("[Mirage] Cannot find a container (parent or option).");this.renderer=new it(this.target,t,r,this.registry),this.renderer.mount(),this.syncer=new
|
|
189
|
+
`,document.head.appendChild(a)}let r;if(t.mode==="duplicate"?r=(c=(i=t.container)!=null?i:this.target.parentElement)!=null?c:void 0:r=(s=this.target.parentElement)!=null?s:void 0,!r)throw new Error("[Mirage] Cannot find a container (parent or option).");this.renderer=new it(this.target,t,r,this.registry),this.renderer.mount(),this.syncer=new nt(this.target,this.renderer,this.registry,t)}start(){this.syncer.start()}stop(){this.syncer.stop()}dispose(){this.syncer.stop(),this.renderer.dispose()}getTracker(){return this.syncer.tracker}updateUniforms(e,t){this.renderer.updateUniforms(e,t)}getCanvas(){return this.renderer.canvas}test(){const e=this.registry.get(document.querySelector("#box2"));if(!e)return;const t={ArrowRight:!1,ArrowLeft:!1,ArrowUp:!1,ArrowDown:!1};window.addEventListener("keydown",c=>{t[c.key]!==void 0&&(t[c.key]=!0)}),window.addEventListener("keyup",c=>{t[c.key]!==void 0&&(t[c.key]=!1)});const r=2,i=()=>{requestAnimationFrame(i),t.ArrowRight&&e.position.setX(e.position.x+r),t.ArrowLeft&&e.position.setX(e.position.x-r),t.ArrowUp&&e.position.setY(e.position.y+r),t.ArrowDown&&e.position.setY(e.position.y-r)};i()}}b.ALLOWED_FILTERS=Ee,b.ATTR_DOM=K,b.ATTR_FILTER=B,b.ATTR_SANDWICH=Pe,b.ATTR_SELECT=V,b.ATTR_SHADER=Le,b.ATTR_TRAVEL=F,b.DIRTY_CONTENT=ye,b.DIRTY_NONE=me,b.DIRTY_RECT=te,b.DIRTY_STRUCTURE=ve,b.DIRTY_STYLE=ae,b.DIRTY_ZINDEX=De,b.EXCLUDED=He,b.Engine=lt,b.SELECT_LAYER=oe,b.THREE_LAYERS=N,b.TRAVEL_VALUES=pe,b.Tracker=Ie,b.USER_LAYER=H,b.extractFromStyle=Ae,Object.defineProperty(b,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mirage-engine/core",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.20",
|
|
4
4
|
"main": "src/index.ts",
|
|
5
5
|
"types": "src/index.ts",
|
|
6
6
|
"peerDependencies": {
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
},
|
|
14
14
|
"dependencies": {
|
|
15
15
|
"@types/three": "^0.181.0",
|
|
16
|
-
"@mirage-engine/painter": "1.0.
|
|
16
|
+
"@mirage-engine/painter": "1.0.10",
|
|
17
17
|
"@mirage-engine/dom-tracker": "0.3.10"
|
|
18
18
|
},
|
|
19
19
|
"private": false,
|