mirage-engine 0.3.13 → 0.3.14

package/dist/mirage-engine.umd.js

@@ -1,5 +1,5 @@
-(function(D,T){typeof exports=="object"&&typeof module!="undefined"?T(exports,require("three")):typeof define=="function"&&define.amd?define(["exports","three"],T):(D=typeof globalThis!="undefined"?globalThis:D||self,T(D.MirageEngine={},D.THREE))})(this,function(D,T){"use strict";var ct=Object.defineProperty,lt=Object.defineProperties;var ht=Object.getOwnPropertyDescriptors;var Oe=Object.getOwnPropertySymbols;var dt=Object.prototype.hasOwnProperty,ut=Object.prototype.propertyIsEnumerable;var Ce=(D,T,U)=>T in D?ct(D,T,{enumerable:!0,configurable:!0,writable:!0,value:U}):D[T]=U,Z=(D,T)=>{for(var U in T||(T={}))dt.call(T,U)&&Ce(D,U,T[U]);if(Oe)for(var U of Oe(T))ut.call(T,U)&&Ce(D,U,T[U]);return D},_e=(D,T)=>lt(D,ht(T));var u=(D,T,U)=>(Ce(D,typeof T!="symbol"?T+"":T,U),U);var Be=(D,T,U)=>new Promise((y,oe)=>{var q=O=>{try{F(U.next(O))}catch(V){oe(V)}},ge=O=>{try{F(U.throw(O))}catch(V){oe(V)}},F=O=>O.done?y(O.value):Promise.resolve(O.value).then(q,ge);F((U=U.apply(D,T)).next())});function U(s){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const t in s)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(s,t);Object.defineProperty(e,t,r.get?r:{enumerable:!0,get:()=>s[t]})}}return e.default=s,Object.freeze(e)}const y=U(T),oe={INCLUDE_TREE:"include-tree",EXCLUDE_TREE:"exclude-tree",INCLUDE_SELF:"include-self",EXCLUDE_SELF:"exclude-self",END:"end"},q={NAME:"data-mirage-dom",KEY:"mirageDom",VALUES:{HIDE:"hide",SHOW:"show"}},ge={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:ge,MAX_LAYERS:Object.keys(ge).length-1},O={NAME:"data-mirage-filter",KEY:"mirageFilter",VALUES:oe},V={NAME:"data-mirage-select",KEY:"mirageSelect",VALUES:oe},Fe={NAME:"data-mirage-shader",KEY:"mirageShader"},Se={NAME:"data-mirage-sandwich",KEY:"mirageSandwich",VALUES:{FRONT:"front"}},pe=0,Q=1,ae=2,Ne=4,me=8,ye=16;function ze(s){const e=s.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/);return e?{r:parseInt(e[1])/255,g:parseInt(e[2])/255,b:parseInt(e[3])/255}:{r:1,g:1,b:1}}function Xe(s){const e={};if(s.opacity&&(e.opacity=parseFloat(s.opacity)),s.backgroundColor&&s.backgroundColor!=="rgba(0, 0, 0, 0)"){const t=ze(s.backgroundColor);e.backgroundColor=[t.r,t.g,t.b]}if(s.backgroundImage?e.backgroundImage=s.backgroundImage:s.background&&(e.backgroundImage=s.background),s.borderRadius&&(e.borderRadius=parseFloat(s.borderRadius)),s.width&&(e.width=parseFloat(s.width)),s.height&&(e.height=parseFloat(s.height)),s.transform&&s.transform!=="none"){const t=new DOMMatrix(s.transform);e.x=t.m41,e.y=t.m42,e.z=t.m43}return e}class Te{constructor(e,t){u(this,"target");u(this,"observer");u(this,"pendingDeletions",new Set);u(this,"pendingStyles",new Map);u(this,"isDomDirty",!1);u(this,"isRunning",!1);u(this,"pendingMask",pe);u(this,"mutationTimer",null);u(this,"cssTimer",null);u(this,"resizeConfig");u(this,"resizeTimer",null);u(this,"isResizing",!1);u(this,"lastScrollX",0);u(this,"lastScrollY",0);u(this,"scrollTimer",null);u(this,"onBeforeRender",new Set);u(this,"onLayoutChange",new Set);u(this,"onStyleChange",new Set);u(this,"onScrollChange",new Set);u(this,"onRender",new Set);u(this,"onTransitionFinished",e=>{this.target.contains(e.target)&&this.mutationTimer===null&&(this.cssTimer&&clearTimeout(this.cssTimer),this.pendingStyles.size==0&&(this.pendingMask|=Q|ae,this.cssTimer=window.setTimeout(()=>{this.isDomDirty=!0,this.cssTimer=null},50)))});u(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)});u(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=pe);const e=window.scrollX,t=window.scrollY;(e!==this.lastScrollX||t!==this.lastScrollY)&&(this.onScrollChange.forEach(r=>r(e,t)),this.lastScrollX=e,this.lastScrollY=t,this.scrollTimer&&clearTimeout(this.scrollTimer),this.scrollTimer=window.setTimeout(()=>{this.pendingMask|=Q,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(n=>{let o=pe;for(const a of n)if(a.type==="childList")o|=me,a.removedNodes.length>0&&a.removedNodes.forEach(l=>{l instanceof HTMLElement&&this.pendingDeletions.add(l)});else if(a.type==="attributes")if(a.attributeName==="style"){o|=Q|ae;const l=a.target,d=Xe(l.style);this.pendingStyles.set(l,d)}else a.attributeName==="class"?o|=Q|ae:a.attributeName&&a.attributeName.startsWith("data-")&&(o|=Q|ae,a.attributeName.startsWith("data-mirage")&&(o|=me));else a.type==="characterData"&&(o|=ye|Q);if(o!==pe){if(this.pendingMask|=o,o&me){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 P=1,ee=2,z={BASE:0,SELECTED:1,getCaptureLayer:s=>31-s,HIDDEN:31},Re=Object.values(O.VALUES);class Le{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}}u(Le,"cache",new Map);class Ve extends y.MeshBasicMaterial{constructor(t,r,i,c,n=2){super({transparent:!0,side:y.FrontSide,color:16777215});u(this,"canvas");u(this,"ctx");u(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=n,this.map=new y.CanvasTexture(this.canvas),this.map.colorSpace=y.LinearSRGBColorSpace,this.map.minFilter=y.LinearFilter,this.map.magFilter=y.LinearFilter,this.updateText(t,r,i,c)}wrapText(t,r){const i=t.split(`
-`),c=[];return i.forEach(n=>{const o=n.match(/[^\s\-]+\-?|\-|\s+/g)||[];if(o.length===0){c.push("");return}let a=o[0];for(let l=1;l<o.length;l++){const d=o[l];this.ctx.measureText(a+d).width<=r+2?a+=d:(a&&c.push(a),a=d.trimStart())}a&&c.push(a)}),c}updateText(t,r,i,c,n){n!==void 0&&(this.qualityFactor=n);const a=(window.devicePixelRatio||1)*this.qualityFactor,l=i*a,d=c*a;this.canvas.width!==l||this.canvas.height!==d?(this.canvas.width=l,this.canvas.height=d):this.ctx.clearRect(0,0,this.canvas.width,this.canvas.height),this.ctx.setTransform(a,0,0,a,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),g=r.lineHeight,v=Le.getBaseline(r.font);h.forEach((p,m)=>{const w=m*g+v;let M=0;r.textAlign==="center"?M=i/2:r.textAlign==="right"&&(M=i),this.ctx.textAlign=r.textAlign,this.ctx.fillText(p,M,w)}),this.map&&(this.map.needsUpdate=!0)}dispose(){this.map&&this.map.dispose(),super.dispose()}}function te(s,e=0){if(typeof s=="number")return s;const t=parseFloat(s)||0;return typeof s=="string"&&s.includes("%")?t/100*e:t}function ce(s){if(!s||s==="transparent")return{color:new y.Color(16777215),alpha:0};const e=s.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 y.Color(`rgb(${t}, ${r}, ${i})`),alpha:c}}return{color:new y.Color(s),alpha:1}}function Ye(s){const e=[];let t="",r=0;for(let i=0;i<s.length;i++){const c=s[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 We(s){if(!s||typeof s!="string"||!s.includes("linear-gradient"))return null;const e=s.match(/linear-gradient\((.*)\)/);if(!e)return null;const t=e[1],r=Ye(t);let i=Math.PI,c=0;const n=r[0].trim();if(n.startsWith("to "))n==="to top"?i=0:n==="to right"?i=Math.PI/2:n==="to bottom"?i=Math.PI:n==="to left"?i=Math.PI*1.5:n==="to top right"||n==="to right top"?i=Math.PI/4:n==="to bottom right"||n==="to right bottom"?i=Math.PI*.75:n==="to bottom left"||n==="to left bottom"?i=Math.PI*1.25:(n==="to top left"||n==="to left top")&&(i=Math.PI*1.75),c=1;else if(n.endsWith("deg")||n.endsWith("rad")||n.endsWith("turn")){const a=parseFloat(n);n.endsWith("deg")?i=a*(Math.PI/180):n.endsWith("rad")?i=a:n.endsWith("turn")&&(i=a*Math.PI*2),c=1}const o=[];for(let a=c;a<r.length&&!(o.length>=8);a++){const l=r[a].trim(),d=l.lastIndexOf(" ");let h=l,g=null;if(d!==-1&&!l.endsWith(")")){const p=l.substring(d+1);(p.endsWith("%")||p.endsWith("px")||!isNaN(parseFloat(p)))&&(h=l.substring(0,d).trim(),g=p)}const v=ce(h);o.push({color:v.color,alpha:v.alpha,rawStop:g,stop:0})}if(o.length>0){for(let l=0;l<o.length;l++)o[l].rawStop!==null&&(o[l].stop=parseFloat(o[l].rawStop)/100);o[0].rawStop===null&&(o[0].stop=0),o.length>1&&o[o.length-1].rawStop===null&&(o[o.length-1].stop=1);let a=0;for(let l=1;l<o.length;l++)if(o[l].rawStop!==null||l===o.length-1){const d=l-a;if(d>1){const h=o[a].stop,v=(o[l].stop-h)/d;for(let p=1;p<d;p++)o[a+p].stop=h+v*p}a=l}}return{angle:i,stops:o}}const He=`varying vec2 vUv;
+(function(A,R){typeof exports=="object"&&typeof module!="undefined"?R(exports,require("three")):typeof define=="function"&&define.amd?define(["exports","three"],R):(A=typeof globalThis!="undefined"?globalThis:A||self,R(A.MirageEngine={},A.THREE))})(this,function(A,R){"use strict";var ct=Object.defineProperty,lt=Object.defineProperties;var ht=Object.getOwnPropertyDescriptors;var Oe=Object.getOwnPropertySymbols;var dt=Object.prototype.hasOwnProperty,ut=Object.prototype.propertyIsEnumerable;var Ce=(A,R,I)=>R in A?ct(A,R,{enumerable:!0,configurable:!0,writable:!0,value:I}):A[R]=I,te=(A,R)=>{for(var I in R||(R={}))dt.call(R,I)&&Ce(A,I,R[I]);if(Oe)for(var I of Oe(R))ut.call(R,I)&&Ce(A,I,R[I]);return A},Fe=(A,R)=>lt(A,ht(R));var u=(A,R,I)=>(Ce(A,typeof R!="symbol"?R+"":R,I),I);var _e=(A,R,I)=>new Promise((y,ce)=>{var j=U=>{try{_(I.next(U))}catch(X){ce(X)}},ge=U=>{try{_(I.throw(U))}catch(X){ce(X)}},_=U=>U.done?y(U.value):Promise.resolve(U.value).then(j,ge);_((I=I.apply(A,R)).next())});function I(s){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const t in s)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(s,t);Object.defineProperty(e,t,r.get?r:{enumerable:!0,get:()=>s[t]})}}return e.default=s,Object.freeze(e)}const y=I(R),ce={INCLUDE_TREE:"include-tree",EXCLUDE_TREE:"exclude-tree",INCLUDE_SELF:"include-self",EXCLUDE_SELF:"exclude-self",END:"end"},j={NAME:"data-mirage-dom",KEY:"mirageDom",VALUES:{HIDE:"hide",SHOW:"show"}},ge={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"},_={NAME:"data-mirage-travel",KEY:"mirageTravel",VALUES:ge,MAX_LAYERS:Object.keys(ge).length-1},U={NAME:"data-mirage-filter",KEY:"mirageFilter",VALUES:ce},X={NAME:"data-mirage-select",KEY:"mirageSelect",VALUES:ce},Be={NAME:"data-mirage-shader",KEY:"mirageShader"},Se={NAME:"data-mirage-sandwich",KEY:"mirageSandwich",VALUES:{FRONT:"front"}},pe=0,ee=1,le=2,Ne=4,me=8,ye=16;function ze(s){const e=s.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/);return e?{r:parseInt(e[1])/255,g:parseInt(e[2])/255,b:parseInt(e[3])/255}:{r:1,g:1,b:1}}function Xe(s){const e={};if(s.opacity&&(e.opacity=parseFloat(s.opacity)),s.backgroundColor&&s.backgroundColor!=="rgba(0, 0, 0, 0)"){const t=ze(s.backgroundColor);e.backgroundColor=[t.r,t.g,t.b]}if(s.backgroundImage?e.backgroundImage=s.backgroundImage:s.background&&(e.backgroundImage=s.background),s.borderRadius&&(e.borderRadius=parseFloat(s.borderRadius)),s.width&&(e.width=parseFloat(s.width)),s.height&&(e.height=parseFloat(s.height)),s.transform&&s.transform!=="none"){const t=new DOMMatrix(s.transform);e.x=t.m41,e.y=t.m42,e.z=t.m43}return e}class Te{constructor(e,t){u(this,"target");u(this,"observer");u(this,"pendingDeletions",new Set);u(this,"pendingStyles",new Map);u(this,"isDomDirty",!1);u(this,"isRunning",!1);u(this,"pendingMask",pe);u(this,"mutationTimer",null);u(this,"cssTimer",null);u(this,"resizeConfig");u(this,"resizeTimer",null);u(this,"isResizing",!1);u(this,"lastScrollX",0);u(this,"lastScrollY",0);u(this,"scrollTimer",null);u(this,"onBeforeRender",new Set);u(this,"onLayoutChange",new Set);u(this,"onStyleChange",new Set);u(this,"onScrollChange",new Set);u(this,"onRender",new Set);u(this,"onTransitionFinished",e=>{this.target.contains(e.target)&&this.mutationTimer===null&&(this.cssTimer&&clearTimeout(this.cssTimer),this.pendingStyles.size==0&&(this.pendingMask|=ee|le,this.cssTimer=window.setTimeout(()=>{this.isDomDirty=!0,this.cssTimer=null},50)))});u(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)});u(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=pe);const e=window.scrollX,t=window.scrollY;(e!==this.lastScrollX||t!==this.lastScrollY)&&(this.onScrollChange.forEach(r=>r(e,t)),this.lastScrollX=e,this.lastScrollY=t,this.scrollTimer&&clearTimeout(this.scrollTimer),this.scrollTimer=window.setTimeout(()=>{this.pendingMask|=ee,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(n=>{let a=pe;for(const o of n)if(o.type==="childList")a|=me,o.removedNodes.length>0&&o.removedNodes.forEach(l=>{l instanceof HTMLElement&&this.pendingDeletions.add(l)});else if(o.type==="attributes")if(o.attributeName==="style"){a|=ee|le;const l=o.target,d=Xe(l.style);this.pendingStyles.set(l,d)}else o.attributeName==="class"?a|=ee|le:o.attributeName&&o.attributeName.startsWith("data-")&&(a|=ee|le,o.attributeName.startsWith("data-mirage")&&(a|=me));else o.type==="characterData"&&(a|=ye|ee);if(a!==pe){if(this.pendingMask|=a,a&me){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 $=1,re=2,B={BASE:0,SELECTED:1,getCaptureLayer:s=>31-s,HIDDEN:31},Re=Object.values(U.VALUES);class Le{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}}u(Le,"cache",new Map);class Ve extends y.MeshBasicMaterial{constructor(t,r,i,c,n=2){super({transparent:!0,side:y.FrontSide,color:16777215});u(this,"canvas");u(this,"ctx");u(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=n,this.map=new y.CanvasTexture(this.canvas),this.map.colorSpace=y.LinearSRGBColorSpace,this.map.minFilter=y.LinearFilter,this.map.magFilter=y.LinearFilter,this.updateText(t,r,i,c)}wrapText(t,r){const i=t.split(`
+`),c=[];return i.forEach(n=>{const a=n.match(/[^\s\-]+\-?|\-|\s+/g)||[];if(a.length===0){c.push("");return}let o=a[0];for(let l=1;l<a.length;l++){const d=a[l];this.ctx.measureText(o+d).width<=r+2?o+=d:(o&&c.push(o),o=d.trimStart())}o&&c.push(o)}),c}updateText(t,r,i,c,n){n!==void 0&&(this.qualityFactor=n);const o=(window.devicePixelRatio||1)*this.qualityFactor,l=i*o,d=c*o;this.canvas.width!==l||this.canvas.height!==d?(this.canvas.width=l,this.canvas.height=d):this.ctx.clearRect(0,0,this.canvas.width,this.canvas.height),this.ctx.setTransform(o,0,0,o,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),g=r.lineHeight,v=Le.getBaseline(r.font);h.forEach((p,m)=>{const E=m*g+v;let D=0;r.textAlign==="center"?D=i/2:r.textAlign==="right"&&(D=i),this.ctx.textAlign=r.textAlign,this.ctx.fillText(p,D,E)}),this.map&&(this.map.needsUpdate=!0)}dispose(){this.map&&this.map.dispose(),super.dispose()}}function ie(s,e=0){if(typeof s=="number")return s;const t=parseFloat(s)||0;return typeof s=="string"&&s.includes("%")?t/100*e:t}function he(s){if(!s||s==="transparent")return{color:new y.Color(16777215),alpha:0};const e=s.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 y.Color(`rgb(${t}, ${r}, ${i})`),alpha:c}}return{color:new y.Color(s),alpha:1}}function Ye(s){const e=[];let t="",r=0;for(let i=0;i<s.length;i++){const c=s[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 We(s){if(!s||typeof s!="string"||!s.includes("linear-gradient"))return null;const e=s.match(/linear-gradient\((.*)\)/);if(!e)return null;const t=e[1],r=Ye(t);let i=Math.PI,c=0;const n=r[0].trim();if(n.startsWith("to "))n==="to top"?i=0:n==="to right"?i=Math.PI/2:n==="to bottom"?i=Math.PI:n==="to left"?i=Math.PI*1.5:n==="to top right"||n==="to right top"?i=Math.PI/4:n==="to bottom right"||n==="to right bottom"?i=Math.PI*.75:n==="to bottom left"||n==="to left bottom"?i=Math.PI*1.25:(n==="to top left"||n==="to left top")&&(i=Math.PI*1.75),c=1;else if(n.endsWith("deg")||n.endsWith("rad")||n.endsWith("turn")){const o=parseFloat(n);n.endsWith("deg")?i=o*(Math.PI/180):n.endsWith("rad")?i=o:n.endsWith("turn")&&(i=o*Math.PI*2),c=1}const a=[];for(let o=c;o<r.length&&!(a.length>=8);o++){const l=r[o].trim(),d=l.lastIndexOf(" ");let h=l,g=null;if(d!==-1&&!l.endsWith(")")){const p=l.substring(d+1);(p.endsWith("%")||p.endsWith("px")||!isNaN(parseFloat(p)))&&(h=l.substring(0,d).trim(),g=p)}const v=he(h);a.push({color:v.color,alpha:v.alpha,rawStop:g,stop:0})}if(a.length>0){for(let l=0;l<a.length;l++)a[l].rawStop!==null&&(a[l].stop=parseFloat(a[l].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 o=0;for(let l=1;l<a.length;l++)if(a[l].rawStop!==null||l===a.length-1){const d=l-o;if(d>1){const h=a[o].stop,v=(a[l].stop-h)/d;for(let p=1;p<d;p++)a[o+p].stop=h+v*p}o=l}}return{angle:i,stops:a}}const He=`varying vec2 vUv;
 varying vec4 vScreenPos;
 void main() {
   vUv = uv;
@@ -152,17 +152,17 @@ uniform vec2 uTextureOffset;`,$e=`vec2 screenUv = (vScreenPos.xy / vScreenPos.w)
 vec2 resultUv = screenUv;
 
 `,qe=`vec4 texColor = texture2D(uTexture, resultUv);
-baseColor = blendSrcOver(baseColor, texColor);`,Me={vertexShader:He,fragmentShader:Pe},De={declChunk:Ge,uvChunk:$e,baseColorChunk:qe};function je(s,e,t,r=null,i){var E;const c=r!==null||!!s.imageSrc;let n="";const o={};if(i!=null&&i.uniforms)for(const[S,x]of Object.entries(i.uniforms))typeof x=="number"?(n+=`uniform float ${S};
-`,o[S]={value:x}):Array.isArray(x)?x.length===2?(n+=`uniform vec2 ${S};
-`,o[S]={value:new y.Vector2(...x)}):x.length===3?(n+=`uniform vec3 ${S};
-`,o[S]={value:new y.Vector3(...x)}):x.length===4&&(n+=`uniform vec4 ${S};
-`,o[S]={value:new y.Vector4(...x)}):(n+=`uniform float ${S};
-`,o[S]={value:x});const a=i!==void 0,l=(c||a?De.declChunk:"")+`
+baseColor = blendSrcOver(baseColor, texColor);`,Me={vertexShader:He,fragmentShader:Pe},De={declChunk:Ge,uvChunk:$e,baseColorChunk:qe};function je(s,e,t,r=null,i){var C;const c=r!==null||!!s.imageSrc;let n="";const a={};if(i!=null&&i.uniforms)for(const[S,w]of Object.entries(i.uniforms))typeof w=="number"?(n+=`uniform float ${S};
+`,a[S]={value:w}):Array.isArray(w)?w.length===2?(n+=`uniform vec2 ${S};
+`,a[S]={value:new y.Vector2(...w)}):w.length===3?(n+=`uniform vec3 ${S};
+`,a[S]={value:new y.Vector3(...w)}):w.length===4&&(n+=`uniform vec4 ${S};
+`,a[S]={value:new y.Vector4(...w)}):(n+=`uniform float ${S};
+`,a[S]={value:w});const o=i!==void 0,l=(c||o?De.declChunk:"")+`
 `+n,d=`vec2 screenUv = (vScreenPos.xy / vScreenPos.w) * 0.5 + 0.5;
 `,h=s.isTraveler?`vec2 resultUv = screenUv;
 `:`vec2 resultUv = vUv * uTextureRepeat + uTextureOffset;
-`,g=c||a?d+h+((i==null?void 0:i.uvModifier)||""):"",v=c||a?De.baseColorChunk:"",p=(i==null?void 0:i.colorModifier)||"",m=Me.fragmentShader.replace("#INJECT_DECLARATIONS",l).replace("#INJECT_UV_MODIFIER",g).replace("#INJECT_BASE_COLOR",v).replace("#INJECT_COLOR_MODIFIER",p),w=ce(s.backgroundColor),M=ce(s.borderColor),A={uSize:{value:new y.Vector2(e,t)},uBgColor:{value:new y.Vector4(w.color.r,w.color.g,w.color.b,w.alpha)},uBorderColor:{value:new y.Vector4(M.color.r,M.color.g,M.color.b,M.alpha)},uBorderRadius:{value:new y.Vector4(0,0,0,0)},uBorderWidth:{value:te(s.borderWidth)},uOpacity:{value:(E=s.opacity)!=null?E:1},uTexture:{value:null},uTextureRepeat:{value:new y.Vector2(1,1)},uTextureOffset:{value:new y.Vector2(0,0)},uGradientCount:{value:0},uGradientAngle:{value:0},uGradientColors:{value:Array.from({length:8},()=>new y.Vector4(0,0,0,0))},uGradientStops:{value:new Float32Array(8)}};Ae(A.uBorderRadius.value,s.borderRadius,Math.min(e,t)),c&&(A.uTexture.value=r);const R=new y.ShaderMaterial({uniforms:Z(Z({},A),o),vertexShader:Me.vertexShader,fragmentShader:m,transparent:!0,side:y.FrontSide});return s.backgroundImage&&be(R,{backgroundImage:s.backgroundImage}),R}function Ke(s,e,t,r,i){const c=te(e.borderWidth);be(s,{width:t,height:r,borderRadius:e.borderRadius,borderWidth:c,backgroundColor:e.backgroundColor,borderColor:e.borderColor,opacity:e.opacity,texture:i,backgroundImage:e.backgroundImage})}function be(s,e){var r,i,c;if(e.width!==void 0&&e.height!==void 0&&s.uniforms.uSize.value.set(e.width,e.height),e.borderRadius!==void 0){const n=e.width!==void 0&&e.height!==void 0?Math.min(e.width,e.height):Math.min(s.uniforms.uSize.value.x,s.uniforms.uSize.value.y);Ae(s.uniforms.uBorderRadius.value,e.borderRadius,n)}if(e.borderWidth!==void 0&&(s.uniforms.uBorderWidth.value=e.borderWidth),e.backgroundColor!==void 0)if(Array.isArray(e.backgroundColor)){const n=s.uniforms.uBgColor.value.w;s.uniforms.uBgColor.value.set(e.backgroundColor[0],e.backgroundColor[1],e.backgroundColor[2],n)}else if(typeof e.backgroundColor=="string"){const n=ce(e.backgroundColor);s.uniforms.uBgColor.value.set(n.color.r,n.color.g,n.color.b,n.alpha)}else{const n=s.uniforms.uBgColor.value.w;s.uniforms.uBgColor.value.set(e.backgroundColor.r,e.backgroundColor.g,e.backgroundColor.b,n)}if(e.borderColor!==void 0)if(Array.isArray(e.borderColor)){const n=s.uniforms.uBorderColor.value.w;s.uniforms.uBorderColor.value.set(e.borderColor[0],e.borderColor[1],e.borderColor[2],n)}else if(typeof e.borderColor=="string"){const n=ce(e.borderColor);s.uniforms.uBorderColor.value.set(n.color.r,n.color.g,n.color.b,n.alpha)}else{const n=s.uniforms.uBorderColor.value.w;s.uniforms.uBorderColor.value.set(e.borderColor.r,e.borderColor.g,e.borderColor.b,n)}e.opacity!==void 0&&(s.uniforms.uOpacity.value=e.opacity),e.bgOpacity!==void 0&&(s.uniforms.uBgColor.value.w=e.bgOpacity),e.borderOpacity!==void 0&&(s.uniforms.uBorderColor.value.w=e.borderOpacity),s.uniforms.uTexture&&e.texture!==void 0&&(s.uniforms.uTexture.value=e.texture);const t=e.texture!==void 0?e.texture:(r=s.uniforms.uTexture)==null?void 0:r.value;if(t&&(t.image instanceof ImageBitmap||t.image instanceof HTMLImageElement||t.image instanceof HTMLCanvasElement)){const n=t.image.naturalWidth||t.image.videoWidth||t.image.width,o=t.image.naturalHeight||t.image.videoHeight||t.image.height,a=(i=e.width)!=null?i:s.uniforms.uSize.value.x,l=(c=e.height)!=null?c:s.uniforms.uSize.value.y;if(n&&o&&a&&l){const d=n/o,h=a/l;if(d>h){const g=h/d;s.uniforms.uTextureRepeat.value.set(g,1),s.uniforms.uTextureOffset.value.set((1-g)/2,0)}else{const g=d/h;s.uniforms.uTextureRepeat.value.set(1,g),s.uniforms.uTextureOffset.value.set(0,(1-g)/2)}}}else s.uniforms.uTextureRepeat&&(s.uniforms.uTextureRepeat.value.set(1,1),s.uniforms.uTextureOffset.value.set(0,0));if(e.backgroundImage!==void 0){const n=We(e.backgroundImage);if(n){s.uniforms.uGradientCount.value=n.stops.length,s.uniforms.uGradientAngle.value=n.angle;for(let o=0;o<8;o++)if(o<n.stops.length){const a=n.stops[o];s.uniforms.uGradientColors.value[o].set(a.color.r,a.color.g,a.color.b,a.alpha),s.uniforms.uGradientStops.value[o]=a.stop}else s.uniforms.uGradientColors.value[o].set(0,0,0,0),s.uniforms.uGradientStops.value[o]=1}else s.uniforms.uGradientCount.value=0}for(const n of Object.keys(e))n!=="width"&&n!=="height"&&n!=="borderRadius"&&n!=="borderWidth"&&n!=="backgroundColor"&&n!=="borderColor"&&n!=="opacity"&&n!=="bgOpacity"&&n!=="borderOpacity"&&n!=="texture"&&n!=="backgroundImage"&&s.uniforms[n]!==void 0&&(s.uniforms[n].value!==void 0&&s.uniforms[n].value!==null&&typeof s.uniforms[n].value.set=="function"?Array.isArray(e[n])?s.uniforms[n].value.set(...e[n]):e[n]!==void 0&&(e[n].copy?s.uniforms[n].value.copy(e[n]):s.uniforms[n].value=e[n]):s.uniforms[n].value=e[n])}function Ae(s,e,t=0){var a,l,d,h;if(e==null){s.set(0,0,0,0);return}if(typeof e=="number"){s.set(e,e,e,e);return}if(Array.isArray(e)){s.set(e[0],e[1],e[2],e[3]);return}const r=e.split("/")[0].trim().split(/\s+/),i=te(r[0],t),c=te((a=r[1])!=null?a:r[0],t),n=te((l=r[2])!=null?l:r[0],t),o=te((h=(d=r[3])!=null?d:r[1])!=null?h:r[0],t);s.set(i,c,n,o)}const G={create(s,e,t,r,i,c=2,n=null,o){return s==="BOX"?je(e,r,i,n,o):s==="TEXT"?new Ve(t||"",e,r,i,c):new y.MeshBasicMaterial({visible:!1})},update(s,e,t,r,i,c,n=2,o){e==="BOX"?Ke(s,t,i,c,o):e==="TEXT"&&s.updateText(r||"",t,i,c,n)},forceUpdateUniforms(s,e){be(s,e)}};class Je{constructor(e,t=!0){u(this,"observer");u(this,"textures",new WeakMap);u(this,"loadStatus",new WeakMap);u(this,"elementUrls",new WeakMap);u(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 Be(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,n)=>{const o=new Image;o.onload=()=>c(o),o.onerror=n,o.src=t});else{const n=yield(yield fetch(t)).blob();r=yield createImageBitmap(n,{imageOrientation:"flipY"})}if(this.elementUrls.get(e)!==t){"close"in r&&r.close();return}const i=new y.Texture(r);r instanceof HTMLImageElement||(i.flipY=!1),i.colorSpace=y.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 Qe{constructor(e,t,r,i){u(this,"canvas");u(this,"scene");u(this,"camera");u(this,"renderer");u(this,"renderTargets",[]);u(this,"renderOrder",0);u(this,"qualityFactor",2);u(this,"mode","overlay");u(this,"canvasSize","viewport");u(this,"clipArea",1);u(this,"targetLayer","base");u(this,"overscan",200);u(this,"target");u(this,"mountContainer");u(this,"registry");u(this,"targetRect");u(this,"travelersByLayer",Array.from({length:F.MAX_LAYERS},()=>new Set));u(this,"textureManager");u(this,"fixedMeshes",new Set);var o,a,l,d,h;this.target=e,this.mountContainer=r,this.registry=i,this.mode=(o=t.mode)!=null?o:"overlay",this.canvasSize=(a=t.canvasSize)!=null?a:"viewport",this.clipArea=(l=t.travelerClipArea)!=null?l:1,this.targetLayer=(d=t.layer)!=null?d:"base",this.textureManager=new Je((g,v)=>{const p=this.registry.get(g);p&&p.material instanceof y.ShaderMaterial&&G.forceUpdateUniforms(p.material,{texture:v})},this.isViewport),this.canvas=document.createElement("canvas"),this.scene=new y.Scene,this.targetRect=this.target.getBoundingClientRect();const c=this.isViewport?window.innerWidth+this.overscan*2:this.targetRect.width,n=this.isViewport?window.innerHeight+this.overscan*2:this.targetRect.height;this.camera=new y.OrthographicCamera(c/-2,c/2,n/2,n/-2,1,1e3),this.camera.position.z=100,this.camera.layers.set(this.getSceneLayer()),this.renderer=new y.WebGLRenderer({canvas:this.canvas,alpha:!0,antialias:!0}),y.ColorManagement.enabled=!1,this.renderer.outputColorSpace=y.LinearSRGBColorSpace,this.renderer.setPixelRatio(window.devicePixelRatio),this.renderer.setSize(c,n),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"?z.SELECTED:z.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 y.WebGLRenderTarget(t*this.qualityFactor,r*this.qualityFactor,{minFilter:y.LinearFilter,magFilter:y.LinearFilter,format:y.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,n=this.isViewport?this.canvas.clientWidth:this.targetRect.width,o=this.isViewport?this.canvas.clientHeight:this.targetRect.height,a=Math.abs(i-n)>.1||Math.abs(c-o)>.1,l=this.mode==="overlay"&&(Math.abs(r.top-this.targetRect.top)>.1||Math.abs(r.left-this.targetRect.left)>.1);a?(this.targetRect=r,this.setSize(i,c),this.updateCanvasLayout()):l?(this.targetRect=r,this.updateCanvasLayout()):this.targetRect=r,this.renderOrder=0,this.reconcileNode(e),t.size>0&&t.forEach(d=>{const h=this.registry.get(d);if(h){this.scene.remove(h);for(const g of this.travelersByLayer)g.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(g=>g.dispose()):h.userData.nativeMesh.material.dispose(),h.userData.nativeMesh.geometry.dispose()),h.traverse(g=>{g instanceof y.Mesh&&(g.geometry&&g.geometry.dispose(),g.material&&(Array.isArray(g.material)?g.material.forEach(v=>v.dispose()):g.material.dispose()))}),this.registry.remove(d),this.textureManager.unregister(d)}})}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 y.Material&&t.material.dispose(),this.registry.remove(e.element),t=void 0),!t){const n=new y.PlaneGeometry(1,1),o=e.isTraveler?(i=this.renderTargets[e.captureLayer-2])==null?void 0:i.texture:this.textureManager.get(e.element),a=G.create("BOX",e.styles,"",e.rect.width,e.rect.height,this.qualityFactor,o,e.shaderHooks);t=new y.Mesh(n,a),e.type==="TEXT"&&(t.name="BG_MESH"),this.scene.add(t),this.registry.register(e.element,t),t.userData.baseMaterial=a,t.userData.domElement=e.element,t.userData.shaderHash=r}if((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 n=0;n<F.MAX_LAYERS;n++)n===e.captureLayer-2?this.travelersByLayer[n].add(t):this.travelersByLayer[n].delete(t);else for(const n of this.travelersByLayer)n.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 n of e.children)this.reconcileNode(n);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 l;const i=t.textLines||[{text:t.textContent||"",rect:t.rect}],c=r?t.nativeStyles:t.textStyles,n=JSON.stringify(c)+t.textContent+i.map(d=>d.text).join("|"),o=(l=e.userData)==null?void 0:l.textChildStyleHash;if(t.dirtyMask&ye||n!==o){e.children.filter(p=>p.name.startsWith("TEXT_CHILD")).forEach(p=>{var w;const m=p;(w=m.material.map)==null||w.dispose(),m.geometry.dispose(),e.remove(m)});const h=t.rect,g=h.x+h.width/2,v=h.y+h.height/2;i.forEach((p,m)=>{const w=G.create("TEXT",c,p.text,p.rect.width,p.rect.height,this.qualityFactor),M=new y.PlaneGeometry(1,1),A=new y.Mesh(M,w);A.name=`TEXT_CHILD_${m}`;const R=t.rect.width===0?1:p.rect.width/t.rect.width,E=t.rect.height===0?1:p.rect.height/t.rect.height;A.scale.set(R,E,1);const S=p.rect.x+p.rect.width/2,x=p.rect.y+p.rect.height/2,L=S-g,k=-(x-v);A.position.set(t.rect.width===0?0:L/t.rect.width,t.rect.height===0?0:k/t.rect.height,.005),e.add(A)}),e.userData.textChildStyleHash=n}e.children.forEach(d=>{if(!d.name.startsWith("TEXT_CHILD"))return;const h=d;if(r&&t.nativeLayer!==void 0)h.layers.set(z.HIDDEN),t.visibility&P&&h.layers.enable(z.getCaptureLayer(t.nativeLayer));else{const g=t.visibility&P?z.BASE:z.HIDDEN;if(h.layers.set(g),t.visibility&ee&&h.layers.enable(z.SELECTED),t.visibility&P)if(!r&&t.nativeLayer!==void 0&&t.nativeStyles!==void 0)for(let v=t.captureLayer;v<=F.MAX_LAYERS+1;v++)v!==t.nativeLayer&&h.layers.enable(z.getCaptureLayer(v));else for(let v=t.captureLayer;v<=F.MAX_LAYERS+1;v++)h.layers.enable(z.getCaptureLayer(v))}})}updateMeshProperties(e,t){var R,E,S;const{rect:r,styles:i}=t,c=this.renderer.getPixelRatio(),n=this.renderer.domElement.width/c,o=this.renderer.domElement.height/c;e.material=e.userData.baseMaterial,e.scale.set(r.width,r.height,1),e.userData.domRect={x:r.x,y:r.y,width:r.width,height:r.height};const a=.001;this.renderOrder++;const l=this.targetRect.left+window.scrollX,d=this.targetRect.top+window.scrollY;let h,g;if(this.isViewport)h=r.x-window.innerWidth/2+r.width/2,g=-r.y+window.innerHeight/2-r.height/2;else{const x=r.x-l,L=r.y-d;h=x-n/2+r.width/2,g=-L+o/2-r.height/2}e.position.set(h,g,i.zIndex+this.renderOrder*a);const v=r.x,p=r.y;e.userData.basePosition={x:h,y:g},e.userData.originalBasePosition={x:h,y:g},e.userData.baseSize={width:r.width,height:r.height},e.userData.baseDOM={x:v,y:p},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,w=window.getComputedStyle(m);let M=0,A=0;if(w.transform&&w.transform!=="none"){const x=new DOMMatrix(w.transform);M=x.m41,A=x.m42}if(e.userData.baseTransform={x:M,y:A},delete e.userData.originRatioX,delete e.userData.originRatioY,G.update(e.userData.baseMaterial,"BOX",i,"",r.width,r.height,this.qualityFactor,t.isTraveler?(R=this.renderTargets[t.captureLayer-2])==null?void 0:R.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?(E=this.renderTargets[t.captureLayer-2])==null?void 0:E.texture:this.textureManager.get(t.element),t.shaderHooks),W=new y.Mesh(e.geometry,Y);t.type==="TEXT"&&(W.name="BG_MESH"),this.scene.add(W),e.userData.nativeMesh=W}const x=e.userData.nativeMesh;let L,k;if(this.isViewport)L=t.nativeRect.x-window.innerWidth/2+t.nativeRect.width/2,k=-t.nativeRect.y+window.innerHeight/2-t.nativeRect.height/2;else{const Y=t.nativeRect.x-l,W=t.nativeRect.y-d;L=Y-n/2+t.nativeRect.width/2,k=-W+o/2-t.nativeRect.height/2}let N=t.nativeRect.width,K=t.nativeRect.height,le=L,he=k;if(t.nativeStyles.transform){const Y=t.nativeStyles.transform,W=Y.match(/scale\(([\d.]+%?)\)/);if(W){let f=parseFloat(W[1]);W[1].includes("%")&&(f/=100),N*=f,K*=f}const re=Y.match(/scaleX\(([\d.]+%?)\)/);if(re){let f=parseFloat(re[1]);re[1].includes("%")&&(f/=100),N*=f}const ie=Y.match(/scaleY\(([\d.]+%?)\)/);if(ie){let f=parseFloat(ie[1]);ie[1].includes("%")&&(f/=100),K*=f}const se=Y.match(/translate\(([^,]+),\s*([^)]+)\)/);if(se){const f=se[1].trim(),b=se[2].trim();let _=parseFloat(f);f.includes("%")&&(_=_/100*t.nativeRect.width);let X=parseFloat(b);b.includes("%")&&(X=X/100*t.nativeRect.height),le+=_,he-=X}const de=Y.match(/translateX\(([^)]+)\)/);if(de){const f=de[1].trim();let b=parseFloat(f);f.includes("%")&&(b=b/100*t.nativeRect.width),le+=b}const ue=Y.match(/translateY\(([^)]+)\)/);if(ue){const f=ue[1].trim();let b=parseFloat(f);f.includes("%")&&(b=b/100*t.nativeRect.height),he-=b}}x.scale.set(N,K,1),x.position.set(le,he,t.nativeStyles.zIndex+this.renderOrder*a),G.update(x.material,"BOX",t.nativeStyles,"",t.nativeRect.width,t.nativeRect.height,this.qualityFactor,t.isTraveler?(S=this.renderTargets[t.captureLayer-2])==null?void 0:S.texture:this.textureManager.get(t.element))}else e.userData.nativeMesh&&(this.scene.remove(e.userData.nativeMesh),e.userData.nativeMesh.material instanceof y.Material&&e.userData.nativeMesh.material.dispose(),delete e.userData.nativeMesh)}updateMeshLayers(e,t){const r=t.visibility&P?z.BASE:z.HIDDEN;if(e.layers.set(r),t.visibility&ee&&e.layers.enable(z.SELECTED),e.userData.nativeMesh&&t.nativeLayer!==void 0){const i=e.userData.nativeMesh;if(i.layers.set(z.HIDDEN),t.visibility&P){i.layers.enable(z.getCaptureLayer(t.nativeLayer));for(let c=t.captureLayer;c<=F.MAX_LAYERS+1;c++)c!==t.nativeLayer&&e.layers.enable(z.getCaptureLayer(c))}}else if(t.visibility&P)for(let i=t.captureLayer;i<=F.MAX_LAYERS+1;i++)e.layers.enable(z.getCaptureLayer(i))}captureRenderTarget(e,t,r){if(e.size===0||!r)return;const i=new y.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 n=new y.Vector3,o=this.isViewport?window.innerWidth+this.overscan*2:this.targetRect.width,a=this.isViewport?window.innerHeight+this.overscan*2:this.targetRect.height,l=this.renderer.getPixelRatio();for(const d of e){n.setFromMatrixPosition(d.matrixWorld),n.project(this.camera);const h=(n.x+1)/2*o,g=(n.y+1)/2*a;let v=0,p=1;typeof this.clipArea=="number"?p=this.clipArea:this.clipArea.endsWith("%")?p=parseFloat(this.clipArea)/100:this.clipArea.endsWith("px")&&(v=parseFloat(this.clipArea));const m=d.scale.x*p+.5,w=d.scale.y*p+.5,M=h-m/2,A=g-w/2,R=(M*this.qualityFactor-v)/l,E=(A*this.qualityFactor-v)/l,S=(m*this.qualityFactor+v*2)/l,x=(w*this.qualityFactor+v*2)/l;this.renderer.setScissor(R,E,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 e=0;e<F.MAX_LAYERS;e++){const t=e+1;this.captureRenderTarget(this.travelersByLayer[e],z.getCaptureLayer(t),this.renderTargets[e])}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(n=>{const o=n;if(!o.userData||!o.userData.domElement)return;const a=o.userData.domElement;if(!a.isConnected)return;let l;if(a.nodeType===Node.TEXT_NODE){const h=document.createRange();h.selectNode(a),l=h.getBoundingClientRect()}else l=a.getBoundingClientRect();const d=o.userData.domRect;if(!d||Math.abs(l.x-d.x)>.5||Math.abs(l.y-d.y)>.5||Math.abs(l.width-d.width)>.5||Math.abs(l.height-d.height)>.5){o.userData.domRect={x:l.x,y:l.y,width:l.width,height:l.height};let h,g;if(this.isViewport)h=l.x-window.innerWidth/2+l.width/2,g=-l.y+window.innerHeight/2-l.height/2;else{const v=l.x-e,p=l.y-t;h=v-i/2+l.width/2,g=-p+c/2-l.height/2}if(o.position.setX(h),o.position.setY(g),o.scale.set(l.width,l.height,1),o.updateMatrixWorld(),o.material instanceof y.ShaderMaterial&&G.forceUpdateUniforms(o.material,{width:l.width,height:l.height}),o.userData.nativeMesh){const v=o.userData.nativeMesh;let p=l.width,m=l.height,w=h,M=g;if(o.userData.nativeTransform){const A=o.userData.nativeTransform,R=A.match(/scale\(([\d.]+%?)\)/);if(R){let L=parseFloat(R[1]);R[1].includes("%")&&(L/=100),p*=L,m*=L}const E=A.match(/translate\(([^,]+),\s*([^)]+)\)/);if(E){const L=E[1].trim(),k=E[2].trim();let N=parseFloat(L);L.includes("%")&&(N=N/100*l.width);let K=parseFloat(k);k.includes("%")&&(K=K/100*l.height),w+=N,M-=K}const S=A.match(/translateX\(([^)]+)\)/);if(S){const L=S[1].trim();let k=parseFloat(L);L.includes("%")&&(k=k/100*l.width),w+=k}const x=A.match(/translateY\(([^)]+)\)/);if(x){const L=x[1].trim();let k=parseFloat(L);L.includes("%")&&(k=k/100*l.height),M-=k}}v.position.setX(w),v.position.setY(M),v.scale.set(p,m,1),v.updateMatrixWorld()}}})}}function Ze(s){const e=s.textContent||"",t=[];let r="",i=null,c=-1;const n=(l,d)=>{for(let h=0;h<l.length;h++){const g=l[h],v=document.createRange();v.setStart(s,d+h),v.setEnd(s,d+h+1);const p=v.getBoundingClientRect();if(p.width===0&&p.height===0){r+=g;continue}c===-1||Math.abs(p.top-c)>p.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=g,i={left:p.left,top:p.top,right:p.right,bottom:p.bottom},c=p.top):(r+=g,i&&(i.left=Math.min(i.left,p.left),i.top=Math.min(i.top,p.top),i.right=Math.max(i.right,p.right),i.bottom=Math.max(i.bottom,p.bottom)))}},o=e.match(/[^\s\-]+\-?|\-|\s+/g)||[];let a=0;for(const l of o){const d=document.createRange();d.setStart(s,a),d.setEnd(s,a+l.length);const h=d.getClientRects();if(h.length>1)n(l,a);else{const g=h.length===1?h[0]:d.getBoundingClientRect();if(g.width===0&&g.height===0){r+=l,a+=l.length;continue}c===-1||Math.abs(g.top-c)>g.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=l,i={left:g.left,top:g.top,right:g.right,bottom:g.bottom},c=g.top):(r+=l,i&&(i.left=Math.min(i.left,g.left),i.top=Math.min(i.top,g.top),i.right=Math.max(i.right,g.right),i.bottom=Math.max(i.bottom,g.bottom)))}a+=l.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(l=>l.text.trim().length>0&&l.rect.width>0&&l.rect.height>0)}function ke(s){const e=parseFloat(s.fontSize);let t=parseFloat(s.lineHeight);isNaN(t)&&(t=e*1.2);let r=parseFloat(s.letterSpacing);return isNaN(r)&&(r=0),{font:`${s.fontStyle} ${s.fontWeight} ${s.fontSize} ${s.fontFamily}`,fontSize:s.fontSize,color:s.color,textAlign:s.textAlign||"start",textBaseline:"alphabetic",direction:s.direction||"inherit",lineHeight:t,letterSpacing:r}}function Ie(s,e=Q|ae|Ne|ye|me,t,r=1,i=0,c=2,n,o){var W,re,ie,se,de,ue;if(s.nodeType===Node.TEXT_NODE){const f=s;if(!f.textContent||!f.textContent.trim())return null;const b=f.textContent.replace(/\s+/g," ");if(b.length===0)return null;const _=Ze(f);if(_.length===0)return null;const X=f.parentElement,B=X?window.getComputedStyle(X):null;if(!B)return null;const j=Math.min(..._.map(C=>C.rect.left)),H=Math.min(..._.map(C=>C.rect.top)),J=Math.max(..._.map(C=>C.rect.left+C.rect.width)),I=Math.max(..._.map(C=>C.rect.top+C.rect.height));return{id:Math.random().toString(36).substring(2,9),type:"TEXT",element:f,rect:{x:j+window.scrollX,y:H+window.scrollY,width:J-j,height:I-H},styles:{backgroundColor:"transparent",backgroundImage:"",opacity:X&&X.dataset[q.KEY]===q.VALUES.HIDE?1:parseFloat(B.opacity),zIndex:(isNaN(parseInt(B.zIndex))?0:parseInt(B.zIndex))+i,borderRadius:"0px",borderColor:"transparent",borderWidth:"0px",isTraveler:!1},textContent:b,textLines:_.map(C=>({text:C.text.trim(),rect:{x:C.rect.left+window.scrollX,y:C.rect.top+window.scrollY,width:C.rect.width,height:C.rect.height}})),textStyles:ke(B),dirtyMask:e,visibility:t,isTraveler:!1,captureLayer:r,isFixed:B.position==="fixed",nativeLayer:n,nativeStyles:o?Z(Z({backgroundColor:"transparent",backgroundImage:"",opacity:X&&X.dataset[q.KEY]===q.VALUES.HIDE?1:parseFloat(B.opacity),zIndex:(isNaN(parseInt(B.zIndex))?0:parseInt(B.zIndex))+i,borderRadius:"0px",borderColor:"transparent",borderWidth:"0px",isTraveler:!1},ke(B)),o):void 0,nativeRect:o?{x:j+window.scrollX,y:H+window.scrollY,width:J-j,height:I-H}:void 0,children:[]}}if(s.nodeType!==Node.ELEMENT_NODE)return null;const a=s,l=a.dataset[O.KEY];let d=t,h=t;if(l){const f=new Set(l.split(/\s+/));for(const b of f)if(!Re.includes(b))throw new Error(`[MirageEngine] Invalid filter token: '${b}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`);if(f.has(O.VALUES.END))return null;if(f.has(O.VALUES.INCLUDE_TREE)&&f.has(O.VALUES.EXCLUDE_TREE))throw new Error("[MirageEngine] Conflicting filters: 'include-tree' and 'exclude-tree' cannot be used together on the same element.");if(f.has(O.VALUES.INCLUDE_SELF)&&f.has(O.VALUES.EXCLUDE_SELF))throw new Error("[MirageEngine] Conflicting filters: 'include-self' and 'exclude-self' cannot be used together on the same element.");f.has(O.VALUES.INCLUDE_TREE)?d=d|P:f.has(O.VALUES.EXCLUDE_TREE)&&(d=d&~P),h=d,f.has(O.VALUES.INCLUDE_SELF)?h=h|P:f.has(O.VALUES.EXCLUDE_SELF)&&(h=h&~P)}const g=a.dataset[V.KEY];if(g){const f=new Set(g.split(/\s+/));for(const b of f)if(!Re.includes(b))throw new Error(`[MirageEngine] Invalid select token: '${b}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`);if(f.has(V.VALUES.END))return null;if(f.has(V.VALUES.INCLUDE_TREE)&&f.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(f.has(V.VALUES.INCLUDE_SELF)&&f.has(V.VALUES.EXCLUDE_SELF))throw new Error("[MirageEngine] Conflicting selects: 'include-self' and 'exclude-self' cannot be used together on the same element.");f.has(V.VALUES.INCLUDE_TREE)?d=d|ee:f.has(V.VALUES.EXCLUDE_TREE)&&(d=d&~ee),h=d,f.has(V.VALUES.INCLUDE_SELF)?h=h|ee:f.has(V.VALUES.EXCLUDE_SELF)&&(h=h&~ee)}const v=a.dataset[F.KEY];let p=!1,m=o?Z({},o):{},w=n;if(v){let f=1;const b=v.indexOf("{"),_=v.lastIndexOf("}");let X=v;if(b!==-1&&_!==-1&&_>b){X=v.substring(0,b).trim();const I=v.substring(b,_+1);try{m=new Function("return "+I)()}catch(C){console.warn(`[MirageEngine] Failed to parse travel styles JSON: ${I}`)}}const B=X.split(/\s+/);let j=!1;const H=B.indexOf(F.VALUES.TRAVELER);if(H!==-1){p=!0,j=!0;const I=B[H+1];if(I&&!isNaN(parseInt(I,10)))f=parseInt(I,10);else{const C=B.find(ne=>!isNaN(parseInt(ne,10)));C&&(f=parseInt(C,10))}}const J=B.indexOf(F.VALUES.NATIVE);if(J!==-1){const I=B[J+1];if(I&&!isNaN(parseInt(I,10)))w=parseInt(I,10);else if(!p){const C=B.find(ne=>!isNaN(parseInt(ne,10)));C&&(w=parseInt(C,10))}}if(j){const I=f+1;if(I<r)throw new Error(`[MirageEngine] Traveler layer (${f}) cannot be smaller than inherited capture layer (${r-1}).`);r=Math.min(I,F.MAX_LAYERS+1)}}const M=a.dataset[Fe.KEY];let A;M&&(A=JSON.parse(M));const R=a.getBoundingClientRect(),E=window.getComputedStyle(a);if(R.width===0||R.height===0||E.display==="none")return null;let S=a.getAttribute("data-mid");S||(S=Math.random().toString(36).substring(2,11),a.setAttribute("data-mid",S));const x=parseInt(E.zIndex),L=(isNaN(x)?0:x)+i;let k;if(a.tagName==="IMG")k=a.src;else if(a.tagName.toLowerCase()==="svg"){const f=a.cloneNode(!0),b=m==null?void 0:m.color,_=m==null?void 0:m.fill,X=m==null?void 0:m.stroke,B=m==null?void 0:m.opacity,j=(C,ne)=>{const $=window.getComputedStyle(C),fe=ne,ot=$.fill===$.color,at=$.stroke===$.color,we=_||(ot?b:void 0)||$.fill;we&&we!=="none"&&(fe.style.fill=we);const xe=X||(at?b:void 0)||$.stroke;xe&&xe!=="none"&&(fe.style.stroke=xe),$.strokeWidth&&$.strokeWidth!=="0px"&&(fe.style.strokeWidth=$.strokeWidth);const Ue=b||$.color;Ue&&(fe.style.color=Ue);const Ee=B||$.opacity;Ee&&Ee!=="1"&&(fe.style.opacity=Ee);for(let ve=0;ve<C.children.length;ve++)j(C.children[ve],ne.children[ve])};j(a,f);const H=a.getBoundingClientRect(),J=window.devicePixelRatio*c;f.hasAttribute("viewBox")||f.setAttribute("viewBox",`0 0 ${H.width} ${H.height}`),f.setAttribute("width",(H.width*J).toString()),f.setAttribute("height",(H.height*J).toString());let I=new XMLSerializer().serializeToString(f);I.includes("xmlns=")||(I=I.replace("<svg",'<svg xmlns="http://www.w3.org/2000/svg"')),k=`data:image/svg+xml;utf8,${encodeURIComponent(I)}`}else if(E.backgroundImage&&E.backgroundImage!=="none"){const f=E.backgroundImage.match(/url\(['"]?(.*?)['"]?\)/);f&&(k=f[1])}const N={backgroundColor:E.backgroundColor,backgroundImage:E.backgroundImage,opacity:a.dataset[q.KEY]===q.VALUES.HIDE?1:parseFloat(E.opacity),zIndex:L,borderRadius:E.borderRadius,borderColor:E.borderColor,borderWidth:E.borderWidth,imageSrc:k,isTraveler:p},K=N;let le,he;const Y=[];return a.tagName.toLowerCase()!=="svg"&&Array.from(a.childNodes).forEach(f=>{const b=f.nodeType===Node.TEXT_NODE?h:d,_=Ie(f,e,b,r,L,c,f.nodeType===Node.TEXT_NODE?w:void 0,f.nodeType===Node.TEXT_NODE&&Object.keys(m).length>0?m:void 0);_&&Y.push(_)}),{id:S,type:"BOX",element:a,rect:{x:R.left+window.scrollX,y:R.top+window.scrollY,width:R.width,height:R.height},styles:K,textContent:le,textStyles:he,dirtyMask:e,visibility:h,isTraveler:p,captureLayer:r,nativeLayer:w,nativeStyles:w!==void 0?_e(Z({},N),{backgroundColor:(W=m.backgroundColor)!=null?W:N.backgroundColor,backgroundImage:(re=m.backgroundImage)!=null?re:N.backgroundImage,opacity:(ie=m.opacity)!=null?ie:N.opacity,zIndex:m.zIndex!==void 0?m.zIndex+L:N.zIndex,borderRadius:(se=m.borderRadius)!=null?se:N.borderRadius,borderColor:(de=m.borderColor)!=null?de:N.borderColor,borderWidth:(ue=m.borderWidth)!=null?ue:N.borderWidth,isTraveler:N.isTraveler,transform:m.transform}):void 0,nativeRect:w!==void 0?{x:m.x!==void 0?parseFloat(m.x):R.left+window.scrollX,y:m.y!==void 0?parseFloat(m.y):R.top+window.scrollY,width:m.width!==void 0?parseFloat(m.width):R.width,height:m.height!==void 0?parseFloat(m.height):R.height}:void 0,isFixed:E.position==="fixed",children:Y,shaderHooks:A}}function et(s,e){e.size!==0&&e.forEach((t,r)=>{var c,n,o,a;const i=s.get(r);!i||!i.userData.basePosition||(G.forceUpdateUniforms(i.material,{backgroundColor:t.backgroundColor,backgroundImage:t.backgroundImage,opacity:t.opacity,borderRadius:(n=t.borderRadius)!=null?n:(c=i.userData.baseStyles)==null?void 0:c.borderRadius}),i.userData.nativeMesh&&G.forceUpdateUniforms(i.userData.nativeMesh.material,{backgroundColor:t.backgroundColor,backgroundImage:t.backgroundImage,opacity:t.opacity,borderRadius:(a=t.borderRadius)!=null?a:(o=i.userData.baseStyles)==null?void 0:o.borderRadius}))})}class tt{constructor(e,t,r,i){u(this,"target");u(this,"renderer");u(this,"registry");u(this,"isTravelEnabled",!1);u(this,"tracker");this.target=e,this.renderer=t,this.registry=r,this.tracker=new Te(e,{resizeDebounce:i.resizeDebounce}),this.tracker.onLayoutChange.add((c,n)=>{document.querySelector(`[${F.NAME}~='${F.VALUES.TRAVELER}']`)!==null&&!this.isTravelEnabled&&(this.isTravelEnabled=!0,this.renderer.createRenderTarget());const a=Ie(this.target,c,P,1,0,this.renderer.qualityFactor);a&&this.renderer.syncScene(a,n)}),this.tracker.onStyleChange.add(c=>{et(this.registry,c)}),this.tracker.onRender.add(()=>{this.renderer.syncMeshesByDOM(),this.renderer.render()})}start(){this.tracker.start()}stop(){this.tracker.stop()}}class rt{constructor(){u(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 it{constructor(e,t){u(this,"renderer");u(this,"syncer");u(this,"target");u(this,"registry");var i,c,n;if(this.target=e,this.registry=new rt,!document.getElementById("mirage-engine-styles")){const o=document.createElement("style");o.id="mirage-engine-styles",o.textContent=`
-        [${q.NAME}="${q.VALUES.HIDE}"] {
+`,g=c||o?d+h+((i==null?void 0:i.uvModifier)||""):"",v=c||o?De.baseColorChunk:"",p=(i==null?void 0:i.colorModifier)||"",m=Me.fragmentShader.replace("#INJECT_DECLARATIONS",l).replace("#INJECT_UV_MODIFIER",g).replace("#INJECT_BASE_COLOR",v).replace("#INJECT_COLOR_MODIFIER",p),E=he(s.backgroundColor),D=he(s.borderColor),M={uSize:{value:new y.Vector2(e,t)},uBgColor:{value:new y.Vector4(E.color.r,E.color.g,E.color.b,E.alpha)},uBorderColor:{value:new y.Vector4(D.color.r,D.color.g,D.color.b,D.alpha)},uBorderRadius:{value:new y.Vector4(0,0,0,0)},uBorderWidth:{value:ie(s.borderWidth)},uOpacity:{value:(C=s.opacity)!=null?C:1},uTexture:{value:null},uTextureRepeat:{value:new y.Vector2(1,1)},uTextureOffset:{value:new y.Vector2(0,0)},uGradientCount:{value:0},uGradientAngle:{value:0},uGradientColors:{value:Array.from({length:8},()=>new y.Vector4(0,0,0,0))},uGradientStops:{value:new Float32Array(8)}};Ae(M.uBorderRadius.value,s.borderRadius,Math.min(e,t)),c&&(M.uTexture.value=r);const L=new y.ShaderMaterial({uniforms:te(te({},M),a),vertexShader:Me.vertexShader,fragmentShader:m,transparent:!0,side:y.FrontSide});return s.backgroundImage&&be(L,{backgroundImage:s.backgroundImage}),L}function Ke(s,e,t,r,i){const c=ie(e.borderWidth);be(s,{width:t,height:r,borderRadius:e.borderRadius,borderWidth:c,backgroundColor:e.backgroundColor,borderColor:e.borderColor,opacity:e.opacity,texture:i,backgroundImage:e.backgroundImage})}function be(s,e){var r,i,c;if(e.width!==void 0&&e.height!==void 0&&s.uniforms.uSize.value.set(e.width,e.height),e.borderRadius!==void 0){const n=e.width!==void 0&&e.height!==void 0?Math.min(e.width,e.height):Math.min(s.uniforms.uSize.value.x,s.uniforms.uSize.value.y);Ae(s.uniforms.uBorderRadius.value,e.borderRadius,n)}if(e.borderWidth!==void 0&&(s.uniforms.uBorderWidth.value=e.borderWidth),e.backgroundColor!==void 0)if(Array.isArray(e.backgroundColor)){const n=s.uniforms.uBgColor.value.w;s.uniforms.uBgColor.value.set(e.backgroundColor[0],e.backgroundColor[1],e.backgroundColor[2],n)}else if(typeof e.backgroundColor=="string"){const n=he(e.backgroundColor);s.uniforms.uBgColor.value.set(n.color.r,n.color.g,n.color.b,n.alpha)}else{const n=s.uniforms.uBgColor.value.w;s.uniforms.uBgColor.value.set(e.backgroundColor.r,e.backgroundColor.g,e.backgroundColor.b,n)}if(e.borderColor!==void 0)if(Array.isArray(e.borderColor)){const n=s.uniforms.uBorderColor.value.w;s.uniforms.uBorderColor.value.set(e.borderColor[0],e.borderColor[1],e.borderColor[2],n)}else if(typeof e.borderColor=="string"){const n=he(e.borderColor);s.uniforms.uBorderColor.value.set(n.color.r,n.color.g,n.color.b,n.alpha)}else{const n=s.uniforms.uBorderColor.value.w;s.uniforms.uBorderColor.value.set(e.borderColor.r,e.borderColor.g,e.borderColor.b,n)}e.opacity!==void 0&&(s.uniforms.uOpacity.value=e.opacity),e.bgOpacity!==void 0&&(s.uniforms.uBgColor.value.w=e.bgOpacity),e.borderOpacity!==void 0&&(s.uniforms.uBorderColor.value.w=e.borderOpacity),s.uniforms.uTexture&&e.texture!==void 0&&(s.uniforms.uTexture.value=e.texture);const t=e.texture!==void 0?e.texture:(r=s.uniforms.uTexture)==null?void 0:r.value;if(t&&(t.image instanceof ImageBitmap||t.image instanceof HTMLImageElement||t.image instanceof HTMLCanvasElement)){const n=t.image.naturalWidth||t.image.videoWidth||t.image.width,a=t.image.naturalHeight||t.image.videoHeight||t.image.height,o=(i=e.width)!=null?i:s.uniforms.uSize.value.x,l=(c=e.height)!=null?c:s.uniforms.uSize.value.y;if(n&&a&&o&&l){const d=n/a,h=o/l;if(d>h){const g=h/d;s.uniforms.uTextureRepeat.value.set(g,1),s.uniforms.uTextureOffset.value.set((1-g)/2,0)}else{const g=d/h;s.uniforms.uTextureRepeat.value.set(1,g),s.uniforms.uTextureOffset.value.set(0,(1-g)/2)}}}else s.uniforms.uTextureRepeat&&(s.uniforms.uTextureRepeat.value.set(1,1),s.uniforms.uTextureOffset.value.set(0,0));if(e.backgroundImage!==void 0){const n=We(e.backgroundImage);if(n){s.uniforms.uGradientCount.value=n.stops.length,s.uniforms.uGradientAngle.value=n.angle;for(let a=0;a<8;a++)if(a<n.stops.length){const o=n.stops[a];s.uniforms.uGradientColors.value[a].set(o.color.r,o.color.g,o.color.b,o.alpha),s.uniforms.uGradientStops.value[a]=o.stop}else s.uniforms.uGradientColors.value[a].set(0,0,0,0),s.uniforms.uGradientStops.value[a]=1}else s.uniforms.uGradientCount.value=0}for(const n of Object.keys(e))n!=="width"&&n!=="height"&&n!=="borderRadius"&&n!=="borderWidth"&&n!=="backgroundColor"&&n!=="borderColor"&&n!=="opacity"&&n!=="bgOpacity"&&n!=="borderOpacity"&&n!=="texture"&&n!=="backgroundImage"&&s.uniforms[n]!==void 0&&(s.uniforms[n].value!==void 0&&s.uniforms[n].value!==null&&typeof s.uniforms[n].value.set=="function"?Array.isArray(e[n])?s.uniforms[n].value.set(...e[n]):e[n]!==void 0&&(e[n].copy?s.uniforms[n].value.copy(e[n]):s.uniforms[n].value=e[n]):s.uniforms[n].value=e[n])}function Ae(s,e,t=0){var o,l,d,h;if(e==null){s.set(0,0,0,0);return}if(typeof e=="number"){s.set(e,e,e,e);return}if(Array.isArray(e)){s.set(e[0],e[1],e[2],e[3]);return}const r=e.split("/")[0].trim().split(/\s+/),i=ie(r[0],t),c=ie((o=r[1])!=null?o:r[0],t),n=ie((l=r[2])!=null?l:r[0],t),a=ie((h=(d=r[3])!=null?d:r[1])!=null?h:r[0],t);s.set(i,c,n,a)}const H={create(s,e,t,r,i,c=2,n=null,a){return s==="BOX"?je(e,r,i,n,a):s==="TEXT"?new Ve(t||"",e,r,i,c):new y.MeshBasicMaterial({visible:!1})},update(s,e,t,r,i,c,n=2,a){e==="BOX"?Ke(s,t,i,c,a):e==="TEXT"&&s.updateText(r||"",t,i,c,n)},forceUpdateUniforms(s,e){be(s,e)}};class Je{constructor(e,t=!0){u(this,"observer");u(this,"textures",new WeakMap);u(this,"loadStatus",new WeakMap);u(this,"elementUrls",new WeakMap);u(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 _e(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,n)=>{const a=new Image;a.onload=()=>c(a),a.onerror=n,a.src=t});else{const n=yield(yield fetch(t)).blob();r=yield createImageBitmap(n,{imageOrientation:"flipY"})}if(this.elementUrls.get(e)!==t){"close"in r&&r.close();return}const i=new y.Texture(r);r instanceof HTMLImageElement||(i.flipY=!1),i.colorSpace=y.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 Qe{constructor(e,t,r,i){u(this,"canvas");u(this,"scene");u(this,"camera");u(this,"renderer");u(this,"renderTargets",[]);u(this,"renderOrder",0);u(this,"qualityFactor",2);u(this,"mode","overlay");u(this,"canvasSize","viewport");u(this,"clipArea",1);u(this,"targetLayer","base");u(this,"overscan",200);u(this,"target");u(this,"mountContainer");u(this,"registry");u(this,"targetRect");u(this,"travelersByLayer",Array.from({length:_.MAX_LAYERS},()=>new Set));u(this,"textureManager");u(this,"fixedMeshes",new Set);var a,o,l,d,h;this.target=e,this.mountContainer=r,this.registry=i,this.mode=(a=t.mode)!=null?a:"overlay",this.canvasSize=(o=t.canvasSize)!=null?o:"viewport",this.clipArea=(l=t.travelerClipArea)!=null?l:1,this.targetLayer=(d=t.layer)!=null?d:"base",this.textureManager=new Je((g,v)=>{const p=this.registry.get(g);p&&p.material instanceof y.ShaderMaterial&&H.forceUpdateUniforms(p.material,{texture:v})},this.isViewport),this.canvas=document.createElement("canvas"),this.scene=new y.Scene,this.targetRect=this.target.getBoundingClientRect();const c=this.isViewport?window.innerWidth+this.overscan*2:this.targetRect.width,n=this.isViewport?window.innerHeight+this.overscan*2:this.targetRect.height;this.camera=new y.OrthographicCamera(c/-2,c/2,n/2,n/-2,1,1e3),this.camera.position.z=100,this.camera.layers.set(this.getSceneLayer()),this.renderer=new y.WebGLRenderer({canvas:this.canvas,alpha:!0,antialias:!0}),y.ColorManagement.enabled=!1,this.renderer.outputColorSpace=y.LinearSRGBColorSpace,this.renderer.setPixelRatio(window.devicePixelRatio),this.renderer.setSize(c,n),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"?B.SELECTED:B.BASE}createRenderTarget(){for(let e=0;e<_.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 y.WebGLRenderTarget(t*this.qualityFactor,r*this.qualityFactor,{minFilter:y.LinearFilter,magFilter:y.LinearFilter,format:y.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&&H.forceUpdateUniforms(i.material,t)}),r.userData.nativeMesh&&r.userData.nativeMesh.traverse(i=>{i.isMesh&&i.material&&H.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,n=this.isViewport?this.canvas.clientWidth:this.targetRect.width,a=this.isViewport?this.canvas.clientHeight:this.targetRect.height,o=Math.abs(i-n)>.1||Math.abs(c-a)>.1,l=this.mode==="overlay"&&(Math.abs(r.top-this.targetRect.top)>.1||Math.abs(r.left-this.targetRect.left)>.1);o?(this.targetRect=r,this.setSize(i,c),this.updateCanvasLayout()):l?(this.targetRect=r,this.updateCanvasLayout()):this.targetRect=r,this.renderOrder=0,this.reconcileNode(e),t.size>0&&t.forEach(d=>{const h=this.registry.get(d);if(h){this.scene.remove(h);for(const g of this.travelersByLayer)g.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(g=>g.dispose()):h.userData.nativeMesh.material.dispose(),h.userData.nativeMesh.geometry.dispose()),h.traverse(g=>{g instanceof y.Mesh&&(g.geometry&&g.geometry.dispose(),g.material&&(Array.isArray(g.material)?g.material.forEach(v=>v.dispose()):g.material.dispose()))}),this.registry.remove(d),this.textureManager.unregister(d)}})}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 y.Material&&t.material.dispose(),this.registry.remove(e.element),t=void 0),!t){const n=new y.PlaneGeometry(1,1),a=e.isTraveler?(i=this.renderTargets[e.captureLayer-2])==null?void 0:i.texture:this.textureManager.get(e.element),o=H.create("BOX",e.styles,"",e.rect.width,e.rect.height,this.qualityFactor,a,e.shaderHooks);t=new y.Mesh(n,o),e.type==="TEXT"&&(t.name="BG_MESH"),this.scene.add(t),this.registry.register(e.element,t),t.userData.baseMaterial=o,t.userData.domElement=e.element,t.userData.shaderHash=r}if((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 n=0;n<_.MAX_LAYERS;n++)n===e.captureLayer-2?this.travelersByLayer[n].add(t):this.travelersByLayer[n].delete(t);else for(const n of this.travelersByLayer)n.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 n of e.children)this.reconcileNode(n);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 l;const i=t.textLines||[{text:t.textContent||"",rect:t.rect}],c=r?t.nativeStyles:t.textStyles,n=JSON.stringify(c)+t.textContent+i.map(d=>d.text).join("|"),a=(l=e.userData)==null?void 0:l.textChildStyleHash;if(t.dirtyMask&ye||n!==a){e.children.filter(p=>p.name.startsWith("TEXT_CHILD")).forEach(p=>{var E;const m=p;(E=m.material.map)==null||E.dispose(),m.geometry.dispose(),e.remove(m)});const h=t.rect,g=h.x+h.width/2,v=h.y+h.height/2;i.forEach((p,m)=>{const E=H.create("TEXT",c,p.text,p.rect.width,p.rect.height,this.qualityFactor),D=new y.PlaneGeometry(1,1),M=new y.Mesh(D,E);M.name=`TEXT_CHILD_${m}`;const L=t.rect.width===0?1:p.rect.width/t.rect.width,C=t.rect.height===0?1:p.rect.height/t.rect.height;M.scale.set(L,C,1);const S=p.rect.x+p.rect.width/2,w=p.rect.y+p.rect.height/2,V=S-g,Y=-(w-v);M.position.set(t.rect.width===0?0:V/t.rect.width,t.rect.height===0?0:Y/t.rect.height,.005),e.add(M)}),e.userData.textChildStyleHash=n}e.children.forEach(d=>{if(!d.name.startsWith("TEXT_CHILD"))return;const h=d;if(r&&t.nativeLayer!==void 0)h.layers.set(B.HIDDEN),t.visibility&$&&h.layers.enable(B.getCaptureLayer(t.nativeLayer));else{const g=t.visibility&$?B.BASE:B.HIDDEN;if(h.layers.set(g),t.visibility&re&&h.layers.enable(B.SELECTED),t.visibility&$)if(!r&&t.nativeLayer!==void 0&&t.nativeStyles!==void 0)for(let v=t.captureLayer;v<=_.MAX_LAYERS+1;v++)v!==t.nativeLayer&&h.layers.enable(B.getCaptureLayer(v));else for(let v=t.captureLayer;v<=_.MAX_LAYERS+1;v++)h.layers.enable(B.getCaptureLayer(v))}})}updateMeshProperties(e,t){var L,C,S;const{rect:r,styles:i}=t,c=this.renderer.getPixelRatio(),n=this.renderer.domElement.width/c,a=this.renderer.domElement.height/c;e.material=e.userData.baseMaterial,e.scale.set(r.width,r.height,1),e.userData.domRect={x:r.x,y:r.y,width:r.width,height:r.height};const o=.001;this.renderOrder++;const l=this.targetRect.left+window.scrollX,d=this.targetRect.top+window.scrollY;let h,g;if(this.isViewport)h=r.x-window.innerWidth/2+r.width/2,g=-r.y+window.innerHeight/2-r.height/2;else{const w=r.x-l,V=r.y-d;h=w-n/2+r.width/2,g=-V+a/2-r.height/2}e.position.set(h,g,i.zIndex+this.renderOrder*o);const v=r.x,p=r.y;e.userData.basePosition={x:h,y:g},e.userData.originalBasePosition={x:h,y:g},e.userData.baseSize={width:r.width,height:r.height},e.userData.baseDOM={x:v,y:p},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,E=window.getComputedStyle(m);let D=0,M=0;if(E.transform&&E.transform!=="none"){const w=new DOMMatrix(E.transform);D=w.m41,M=w.m42}if(e.userData.baseTransform={x:D,y:M},delete e.userData.originRatioX,delete e.userData.originRatioY,H.update(e.userData.baseMaterial,"BOX",i,"",r.width,r.height,this.qualityFactor,t.isTraveler?(L=this.renderTargets[t.captureLayer-2])==null?void 0:L.texture:this.textureManager.get(t.element)),t.nativeStyles&&t.nativeRect){if(!e.userData.nativeMesh){const W=H.create("BOX",t.nativeStyles,"",t.nativeRect.width,t.nativeRect.height,this.qualityFactor,t.isTraveler?(C=this.renderTargets[t.captureLayer-2])==null?void 0:C.texture:this.textureManager.get(t.element),t.shaderHooks),P=new y.Mesh(e.geometry,W);t.type==="TEXT"&&(P.name="BG_MESH"),this.scene.add(P),e.userData.nativeMesh=P}const w=e.userData.nativeMesh;let V,Y;if(this.isViewport)V=t.nativeRect.x-window.innerWidth/2+t.nativeRect.width/2,Y=-t.nativeRect.y+window.innerHeight/2-t.nativeRect.height/2;else{const W=t.nativeRect.x-l,P=t.nativeRect.y-d;V=W-n/2+t.nativeRect.width/2,Y=-P+a/2-t.nativeRect.height/2}let b=t.nativeRect.width,N=t.nativeRect.height,J=V,Q=Y;if(t.nativeStyles.transform){const W=t.nativeStyles.transform,P=W.match(/scale\(([\d.]+%?)\)/);if(P){let f=parseFloat(P[1]);P[1].includes("%")&&(f/=100),b*=f,N*=f}const se=W.match(/scaleX\(([\d.]+%?)\)/);if(se){let f=parseFloat(se[1]);se[1].includes("%")&&(f/=100),b*=f}const ne=W.match(/scaleY\(([\d.]+%?)\)/);if(ne){let f=parseFloat(ne[1]);ne[1].includes("%")&&(f/=100),N*=f}const ae=W.match(/translate\(([^,]+),\s*([^)]+)\)/);if(ae){const f=ae[1].trim(),x=ae[2].trim();let O=parseFloat(f);f.includes("%")&&(O=O/100*t.nativeRect.width);let z=parseFloat(x);x.includes("%")&&(z=z/100*t.nativeRect.height),J+=O,Q-=z}const de=W.match(/translateX\(([^)]+)\)/);if(de){const f=de[1].trim();let x=parseFloat(f);f.includes("%")&&(x=x/100*t.nativeRect.width),J+=x}const ue=W.match(/translateY\(([^)]+)\)/);if(ue){const f=ue[1].trim();let x=parseFloat(f);f.includes("%")&&(x=x/100*t.nativeRect.height),Q-=x}}w.scale.set(b,N,1),w.position.set(J,Q,t.nativeStyles.zIndex+this.renderOrder*o),H.update(w.material,"BOX",t.nativeStyles,"",t.nativeRect.width,t.nativeRect.height,this.qualityFactor,t.isTraveler?(S=this.renderTargets[t.captureLayer-2])==null?void 0:S.texture:this.textureManager.get(t.element))}else e.userData.nativeMesh&&(this.scene.remove(e.userData.nativeMesh),e.userData.nativeMesh.material instanceof y.Material&&e.userData.nativeMesh.material.dispose(),delete e.userData.nativeMesh)}updateMeshLayers(e,t){const r=t.visibility&$?B.BASE:B.HIDDEN;if(e.layers.set(r),t.visibility&re&&e.layers.enable(B.SELECTED),e.userData.nativeMesh&&t.nativeLayer!==void 0){const i=e.userData.nativeMesh;if(i.layers.set(B.HIDDEN),t.visibility&$){i.layers.enable(B.getCaptureLayer(t.nativeLayer));for(let c=t.captureLayer;c<=_.MAX_LAYERS+1;c++)c!==t.nativeLayer&&e.layers.enable(B.getCaptureLayer(c))}}else if(t.visibility&$)for(let i=t.captureLayer;i<=_.MAX_LAYERS+1;i++)e.layers.enable(B.getCaptureLayer(i))}captureRenderTarget(e,t,r){if(e.size===0||!r)return;const i=new y.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 n=new y.Vector3,a=this.isViewport?window.innerWidth+this.overscan*2:this.targetRect.width,o=this.isViewport?window.innerHeight+this.overscan*2:this.targetRect.height,l=this.renderer.getPixelRatio();for(const d of e){n.setFromMatrixPosition(d.matrixWorld),n.project(this.camera);const h=(n.x+1)/2*a,g=(n.y+1)/2*o;let v=0,p=1;typeof this.clipArea=="number"?p=this.clipArea:this.clipArea.endsWith("%")?p=parseFloat(this.clipArea)/100:this.clipArea.endsWith("px")&&(v=parseFloat(this.clipArea));const m=d.scale.x*p+.5,E=d.scale.y*p+.5,D=h-m/2,M=g-E/2,L=(D*this.qualityFactor-v)/l,C=(M*this.qualityFactor-v)/l,S=(m*this.qualityFactor+v*2)/l,w=(E*this.qualityFactor+v*2)/l;this.renderer.setScissor(L,C,S,w),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 e=0;e<_.MAX_LAYERS;e++){const t=e+1;this.captureRenderTarget(this.travelersByLayer[e],B.getCaptureLayer(t),this.renderTargets[e])}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(n=>{const a=n;if(!a.userData||!a.userData.domElement)return;const o=a.userData.domElement;if(!o.isConnected)return;let l;if(o.nodeType===Node.TEXT_NODE){const h=document.createRange();h.selectNode(o),l=h.getBoundingClientRect()}else l=o.getBoundingClientRect();const d=a.userData.domRect;if(!d||Math.abs(l.x-d.x)>.5||Math.abs(l.y-d.y)>.5||Math.abs(l.width-d.width)>.5||Math.abs(l.height-d.height)>.5){a.userData.domRect={x:l.x,y:l.y,width:l.width,height:l.height};let h,g;if(this.isViewport)h=l.x-window.innerWidth/2+l.width/2,g=-l.y+window.innerHeight/2-l.height/2;else{const v=l.x-e,p=l.y-t;h=v-i/2+l.width/2,g=-p+c/2-l.height/2}if(a.position.setX(h),a.position.setY(g),a.scale.set(l.width,l.height,1),a.updateMatrixWorld(),a.material instanceof y.ShaderMaterial&&H.forceUpdateUniforms(a.material,{width:l.width,height:l.height}),a.userData.nativeMesh){const v=a.userData.nativeMesh;let p=l.width,m=l.height,E=h,D=g;if(a.userData.nativeTransform){const M=a.userData.nativeTransform,L=M.match(/scale\(([\d.]+%?)\)/);if(L){let b=parseFloat(L[1]);L[1].includes("%")&&(b/=100),p*=b,m*=b}const C=M.match(/scaleX\(([\d.]+%?)\)/);if(C){let b=parseFloat(C[1]);C[1].includes("%")&&(b/=100),p*=b}const S=M.match(/scaleY\(([\d.]+%?)\)/);if(S){let b=parseFloat(S[1]);S[1].includes("%")&&(b/=100),m*=b}const w=M.match(/translate\(([^,]+),\s*([^)]+)\)/);if(w){const b=w[1].trim(),N=w[2].trim();let J=parseFloat(b);b.includes("%")&&(J=J/100*l.width);let Q=parseFloat(N);N.includes("%")&&(Q=Q/100*l.height),E+=J,D-=Q}const V=M.match(/translateX\(([^)]+)\)/);if(V){const b=V[1].trim();let N=parseFloat(b);b.includes("%")&&(N=N/100*l.width),E+=N}const Y=M.match(/translateY\(([^)]+)\)/);if(Y){const b=Y[1].trim();let N=parseFloat(b);b.includes("%")&&(N=N/100*l.height),D-=N}}v.position.setX(E),v.position.setY(D),v.scale.set(p,m,1),v.updateMatrixWorld(),v.material instanceof y.ShaderMaterial&&H.forceUpdateUniforms(v.material,{width:p,height:m})}}})}}function Ze(s){const e=s.textContent||"",t=[];let r="",i=null,c=-1;const n=(l,d)=>{for(let h=0;h<l.length;h++){const g=l[h],v=document.createRange();v.setStart(s,d+h),v.setEnd(s,d+h+1);const p=v.getBoundingClientRect();if(p.width===0&&p.height===0){r+=g;continue}c===-1||Math.abs(p.top-c)>p.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=g,i={left:p.left,top:p.top,right:p.right,bottom:p.bottom},c=p.top):(r+=g,i&&(i.left=Math.min(i.left,p.left),i.top=Math.min(i.top,p.top),i.right=Math.max(i.right,p.right),i.bottom=Math.max(i.bottom,p.bottom)))}},a=e.match(/[^\s\-]+\-?|\-|\s+/g)||[];let o=0;for(const l of a){const d=document.createRange();d.setStart(s,o),d.setEnd(s,o+l.length);const h=d.getClientRects();if(h.length>1)n(l,o);else{const g=h.length===1?h[0]:d.getBoundingClientRect();if(g.width===0&&g.height===0){r+=l,o+=l.length;continue}c===-1||Math.abs(g.top-c)>g.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=l,i={left:g.left,top:g.top,right:g.right,bottom:g.bottom},c=g.top):(r+=l,i&&(i.left=Math.min(i.left,g.left),i.top=Math.min(i.top,g.top),i.right=Math.max(i.right,g.right),i.bottom=Math.max(i.bottom,g.bottom)))}o+=l.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(l=>l.text.trim().length>0&&l.rect.width>0&&l.rect.height>0)}function ke(s){const e=parseFloat(s.fontSize);let t=parseFloat(s.lineHeight);isNaN(t)&&(t=e*1.2);let r=parseFloat(s.letterSpacing);return isNaN(r)&&(r=0),{font:`${s.fontStyle} ${s.fontWeight} ${s.fontSize} ${s.fontFamily}`,fontSize:s.fontSize,color:s.color,textAlign:s.textAlign||"start",textBaseline:"alphabetic",direction:s.direction||"inherit",lineHeight:t,letterSpacing:r}}function Ie(s,e=ee|le|Ne|ye|me,t,r=1,i=0,c=2,n,a){var P,se,ne,ae,de,ue;if(s.nodeType===Node.TEXT_NODE){const f=s;if(!f.textContent||!f.textContent.trim())return null;const x=f.textContent.replace(/\s+/g," ");if(x.length===0)return null;const O=Ze(f);if(O.length===0)return null;const z=f.parentElement,F=z?window.getComputedStyle(z):null;if(!F)return null;const K=Math.min(...O.map(T=>T.rect.left)),G=Math.min(...O.map(T=>T.rect.top)),Z=Math.max(...O.map(T=>T.rect.left+T.rect.width)),k=Math.max(...O.map(T=>T.rect.top+T.rect.height));return{id:Math.random().toString(36).substring(2,9),type:"TEXT",element:f,rect:{x:K+window.scrollX,y:G+window.scrollY,width:Z-K,height:k-G},styles:{backgroundColor:"transparent",backgroundImage:"",opacity:z&&z.dataset[j.KEY]===j.VALUES.HIDE?1:parseFloat(F.opacity),zIndex:(isNaN(parseInt(F.zIndex))?0:parseInt(F.zIndex))+i,borderRadius:"0px",borderColor:"transparent",borderWidth:"0px",isTraveler:!1},textContent:x,textLines:O.map(T=>({text:T.text.trim(),rect:{x:T.rect.left+window.scrollX,y:T.rect.top+window.scrollY,width:T.rect.width,height:T.rect.height}})),textStyles:ke(F),dirtyMask:e,visibility:t,isTraveler:!1,captureLayer:r,isFixed:F.position==="fixed",nativeLayer:n,nativeStyles:a?te(te({backgroundColor:"transparent",backgroundImage:"",opacity:z&&z.dataset[j.KEY]===j.VALUES.HIDE?1:parseFloat(F.opacity),zIndex:(isNaN(parseInt(F.zIndex))?0:parseInt(F.zIndex))+i,borderRadius:"0px",borderColor:"transparent",borderWidth:"0px",isTraveler:!1},ke(F)),a):void 0,nativeRect:a?{x:K+window.scrollX,y:G+window.scrollY,width:Z-K,height:k-G}:void 0,children:[]}}if(s.nodeType!==Node.ELEMENT_NODE)return null;const o=s,l=o.dataset[U.KEY];let d=t,h=t;if(l){const f=new Set(l.split(/\s+/));for(const x of f)if(!Re.includes(x))throw new Error(`[MirageEngine] Invalid filter token: '${x}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`);if(f.has(U.VALUES.END))return null;if(f.has(U.VALUES.INCLUDE_TREE)&&f.has(U.VALUES.EXCLUDE_TREE))throw new Error("[MirageEngine] Conflicting filters: 'include-tree' and 'exclude-tree' cannot be used together on the same element.");if(f.has(U.VALUES.INCLUDE_SELF)&&f.has(U.VALUES.EXCLUDE_SELF))throw new Error("[MirageEngine] Conflicting filters: 'include-self' and 'exclude-self' cannot be used together on the same element.");f.has(U.VALUES.INCLUDE_TREE)?d=d|$:f.has(U.VALUES.EXCLUDE_TREE)&&(d=d&~$),h=d,f.has(U.VALUES.INCLUDE_SELF)?h=h|$:f.has(U.VALUES.EXCLUDE_SELF)&&(h=h&~$)}const g=o.dataset[X.KEY];if(g){const f=new Set(g.split(/\s+/));for(const x of f)if(!Re.includes(x))throw new Error(`[MirageEngine] Invalid select token: '${x}'. Expected one of: 'include-tree', 'exclude-tree', 'include-self', 'exclude-self', 'end'.`);if(f.has(X.VALUES.END))return null;if(f.has(X.VALUES.INCLUDE_TREE)&&f.has(X.VALUES.EXCLUDE_TREE))throw new Error("[MirageEngine] Conflicting selects: 'include-tree' and 'exclude-tree' cannot be used together on the same element.");if(f.has(X.VALUES.INCLUDE_SELF)&&f.has(X.VALUES.EXCLUDE_SELF))throw new Error("[MirageEngine] Conflicting selects: 'include-self' and 'exclude-self' cannot be used together on the same element.");f.has(X.VALUES.INCLUDE_TREE)?d=d|re:f.has(X.VALUES.EXCLUDE_TREE)&&(d=d&~re),h=d,f.has(X.VALUES.INCLUDE_SELF)?h=h|re:f.has(X.VALUES.EXCLUDE_SELF)&&(h=h&~re)}const v=o.dataset[_.KEY];let p=!1,m=a?te({},a):{},E=n;if(v){let f=1;const x=v.indexOf("{"),O=v.lastIndexOf("}");let z=v;if(x!==-1&&O!==-1&&O>x){z=v.substring(0,x).trim();const k=v.substring(x,O+1);try{m=new Function("return "+k)()}catch(T){console.warn(`[MirageEngine] Failed to parse travel styles JSON: ${k}`)}}const F=z.split(/\s+/);let K=!1;const G=F.indexOf(_.VALUES.TRAVELER);if(G!==-1){p=!0,K=!0;const k=F[G+1];if(k&&!isNaN(parseInt(k,10)))f=parseInt(k,10);else{const T=F.find(oe=>!isNaN(parseInt(oe,10)));T&&(f=parseInt(T,10))}}const Z=F.indexOf(_.VALUES.NATIVE);if(Z!==-1){const k=F[Z+1];if(k&&!isNaN(parseInt(k,10)))E=parseInt(k,10);else if(!p){const T=F.find(oe=>!isNaN(parseInt(oe,10)));T&&(E=parseInt(T,10))}}if(K){const k=f+1;if(k<r)throw new Error(`[MirageEngine] Traveler layer (${f}) cannot be smaller than inherited capture layer (${r-1}).`);r=Math.min(k,_.MAX_LAYERS+1)}}const D=o.dataset[Be.KEY];let M;D&&(M=JSON.parse(D));const L=o.getBoundingClientRect(),C=window.getComputedStyle(o);if(L.width===0||L.height===0||C.display==="none")return null;let S=o.getAttribute("data-mid");S||(S=Math.random().toString(36).substring(2,11),o.setAttribute("data-mid",S));const w=parseInt(C.zIndex),V=(isNaN(w)?0:w)+i;let Y;if(o.tagName==="IMG")Y=o.src;else if(o.tagName.toLowerCase()==="svg"){const f=o.cloneNode(!0),x=m==null?void 0:m.color,O=m==null?void 0:m.fill,z=m==null?void 0:m.stroke,F=m==null?void 0:m.opacity,K=(T,oe)=>{const q=window.getComputedStyle(T),fe=oe,at=q.fill===q.color,ot=q.stroke===q.color,we=O||(at?x:void 0)||q.fill;we&&we!=="none"&&(fe.style.fill=we);const xe=z||(ot?x:void 0)||q.stroke;xe&&xe!=="none"&&(fe.style.stroke=xe),q.strokeWidth&&q.strokeWidth!=="0px"&&(fe.style.strokeWidth=q.strokeWidth);const Ue=x||q.color;Ue&&(fe.style.color=Ue);const Ee=F||q.opacity;Ee&&Ee!=="1"&&(fe.style.opacity=Ee);for(let ve=0;ve<T.children.length;ve++)K(T.children[ve],oe.children[ve])};K(o,f);const G=o.getBoundingClientRect(),Z=window.devicePixelRatio*c;f.hasAttribute("viewBox")||f.setAttribute("viewBox",`0 0 ${G.width} ${G.height}`),f.setAttribute("width",(G.width*Z).toString()),f.setAttribute("height",(G.height*Z).toString());let k=new XMLSerializer().serializeToString(f);k.includes("xmlns=")||(k=k.replace("<svg",'<svg xmlns="http://www.w3.org/2000/svg"')),Y=`data:image/svg+xml;utf8,${encodeURIComponent(k)}`}else if(C.backgroundImage&&C.backgroundImage!=="none"){const f=C.backgroundImage.match(/url\(['"]?(.*?)['"]?\)/);f&&(Y=f[1])}const b={backgroundColor:C.backgroundColor,backgroundImage:C.backgroundImage,opacity:o.dataset[j.KEY]===j.VALUES.HIDE?1:parseFloat(C.opacity),zIndex:V,borderRadius:C.borderRadius,borderColor:C.borderColor,borderWidth:C.borderWidth,imageSrc:Y,isTraveler:p},N=b;let J,Q;const W=[];return o.tagName.toLowerCase()!=="svg"&&Array.from(o.childNodes).forEach(f=>{const x=f.nodeType===Node.TEXT_NODE?h:d,O=Ie(f,e,x,r,V,c,f.nodeType===Node.TEXT_NODE?E:void 0,f.nodeType===Node.TEXT_NODE&&Object.keys(m).length>0?m:void 0);O&&W.push(O)}),{id:S,type:"BOX",element:o,rect:{x:L.left+window.scrollX,y:L.top+window.scrollY,width:L.width,height:L.height},styles:N,textContent:J,textStyles:Q,dirtyMask:e,visibility:h,isTraveler:p,captureLayer:r,nativeLayer:E,nativeStyles:E!==void 0?Fe(te({},b),{backgroundColor:(P=m.backgroundColor)!=null?P:b.backgroundColor,backgroundImage:(se=m.backgroundImage)!=null?se:b.backgroundImage,opacity:(ne=m.opacity)!=null?ne:b.opacity,zIndex:m.zIndex!==void 0?m.zIndex+V:b.zIndex,borderRadius:(ae=m.borderRadius)!=null?ae:b.borderRadius,borderColor:(de=m.borderColor)!=null?de:b.borderColor,borderWidth:(ue=m.borderWidth)!=null?ue:b.borderWidth,isTraveler:b.isTraveler,transform:m.transform}):void 0,nativeRect:E!==void 0?{x:m.x!==void 0?parseFloat(m.x):L.left+window.scrollX,y:m.y!==void 0?parseFloat(m.y):L.top+window.scrollY,width:m.width!==void 0?parseFloat(m.width):L.width,height:m.height!==void 0?parseFloat(m.height):L.height}:void 0,isFixed:C.position==="fixed",children:W,shaderHooks:M}}function et(s,e){e.size!==0&&e.forEach((t,r)=>{var c,n,a,o;const i=s.get(r);!i||!i.userData.basePosition||(H.forceUpdateUniforms(i.material,{backgroundColor:t.backgroundColor,backgroundImage:t.backgroundImage,opacity:t.opacity,borderRadius:(n=t.borderRadius)!=null?n:(c=i.userData.baseStyles)==null?void 0:c.borderRadius}),i.userData.nativeMesh&&H.forceUpdateUniforms(i.userData.nativeMesh.material,{backgroundColor:t.backgroundColor,backgroundImage:t.backgroundImage,opacity:t.opacity,borderRadius:(o=t.borderRadius)!=null?o:(a=i.userData.baseStyles)==null?void 0:a.borderRadius}))})}class tt{constructor(e,t,r,i){u(this,"target");u(this,"renderer");u(this,"registry");u(this,"isTravelEnabled",!1);u(this,"tracker");this.target=e,this.renderer=t,this.registry=r,this.tracker=new Te(e,{resizeDebounce:i.resizeDebounce}),this.tracker.onLayoutChange.add((c,n)=>{document.querySelector(`[${_.NAME}~='${_.VALUES.TRAVELER}']`)!==null&&!this.isTravelEnabled&&(this.isTravelEnabled=!0,this.renderer.createRenderTarget());const o=Ie(this.target,c,$,1,0,this.renderer.qualityFactor);o&&this.renderer.syncScene(o,n)}),this.tracker.onStyleChange.add(c=>{et(this.registry,c)}),this.tracker.onRender.add(()=>{this.renderer.syncMeshesByDOM(),this.renderer.render()})}start(){this.tracker.start()}stop(){this.tracker.stop()}}class rt{constructor(){u(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 it{constructor(e,t){u(this,"renderer");u(this,"syncer");u(this,"target");u(this,"registry");var i,c,n;if(this.target=e,this.registry=new rt,!document.getElementById("mirage-engine-styles")){const a=document.createElement("style");a.id="mirage-engine-styles",a.textContent=`
+        [${j.NAME}="${j.VALUES.HIDE}"] {
           opacity: 0 !important;
         }
-      `,document.head.appendChild(o)}let r;if(t.mode==="duplicate"?r=(c=(i=t.container)!=null?i:this.target.parentElement)!=null?c:void 0:r=(n=this.target.parentElement)!=null?n:void 0,!r)throw new Error("[Mirage] Cannot find a container (parent or option).");this.renderer=new Qe(this.target,t,r,this.registry),this.renderer.mount(),this.syncer=new tt(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()}}class st{constructor(e={}){u(this,"frontSelector");u(this,"midLayerElement");u(this,"items",[]);u(this,"isInitialized",!1);u(this,"midLayer",null);u(this,"frontLayer",null);u(this,"tracker",null);this.frontSelector=e.frontSelector||".front",this.midLayerElement=e.midLayerElement||null,this.items=[],this.isInitialized=!1,this.tracker=new Te(document.body,e.trackerConfig||{resizeDebounce:!0})}init(){var e;this.isInitialized||(this.createLayers(),this.setupMidLayer(),this.hijackFrontElements(),this.setupHooks(),(e=this.tracker)==null||e.start(),this.isInitialized=!0,console.log("🥪 sand-telepochi initialized!"))}useTracker(e){this.tracker=e,this.setupHooks()}createLayers(){this.midLayer=document.createElement("div"),this.midLayer.id="sand-layer-mid",Object.assign(this.midLayer.style,{position:"fixed",inset:"0",zIndex:"9998",pointerEvents:"none"}),this.frontLayer=document.createElement("div"),this.frontLayer.id="sand-layer-front",Object.assign(this.frontLayer.style,{position:"fixed",inset:"0",zIndex:"9999",pointerEvents:"none"}),document.body.appendChild(this.midLayer),document.body.appendChild(this.frontLayer)}setupMidLayer(){this.midLayerElement&&this.midLayer&&(this.midLayer.appendChild(this.midLayerElement),this.midLayerElement.style.pointerEvents="auto")}hijackFrontElements(){const e=document.querySelectorAll(this.frontSelector);this.frontLayer&&e.forEach(t=>{var n;const r=t.getBoundingClientRect(),i=window.getComputedStyle(t),c=document.createElement("div");c.className="sand-placeholder",Object.assign(c.style,{display:i.display==="inline"?"inline-block":i.display,width:`${r.width}px`,height:`${r.height}px`,boxSizing:"border-box",marginTop:i.marginTop,marginBottom:i.marginBottom,marginLeft:i.marginLeft,marginRight:i.marginRight,visibility:"hidden",pointerEvents:"none"}),(n=t.parentNode)==null||n.insertBefore(c,t),this.frontLayer.appendChild(t),Object.assign(t.style,{position:"fixed",margin:"0",boxSizing:"border-box",width:`${r.width}px`,height:`${r.height}px`,pointerEvents:"auto"}),this.items.push({placeholder:c,original:t})})}setupHooks(){this.tracker&&this.tracker.onBeforeRender.add(()=>{const e=this.items.map(({placeholder:t})=>t.getBoundingClientRect());this.items.forEach(({original:t},r)=>{const i=e[r];t.style.top=`${i.top}px`,t.style.left=`${i.left}px`,t.style.width=`${i.width}px`,t.style.height=`${i.height}px`})})}}class nt{constructor(e,t){u(this,"_engine");u(this,"_sandwich");if(!e)throw new Error("[Mirage] Target element is required.");if(this._engine=new it(e,t),t.sandwich!==!1){const r=typeof t.sandwich=="object"?t.sandwich:{};this._sandwich=new st({frontSelector:r.frontSelector||`[${Se.NAME}='${Se.VALUES.FRONT}']`}),this._sandwich.useTracker(this._engine.getTracker())}}start(){this._engine.start(),this._sandwich&&this._sandwich.init()}stop(){this._engine.stop()}destroy(){this._engine.dispose()}getTracker(){return this._engine.getTracker()}getCanvas(){return this._engine.getCanvas()}updateUniforms(e,t){this._engine.updateUniforms(e,t)}test(){this._engine.test()}}D.Mirage=nt,Object.defineProperty(D,Symbol.toStringTag,{value:"Module"})});
+      `,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=(n=this.target.parentElement)!=null?n:void 0,!r)throw new Error("[Mirage] Cannot find a container (parent or option).");this.renderer=new Qe(this.target,t,r,this.registry),this.renderer.mount(),this.syncer=new tt(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()}}class st{constructor(e={}){u(this,"frontSelector");u(this,"midLayerElement");u(this,"items",[]);u(this,"isInitialized",!1);u(this,"midLayer",null);u(this,"frontLayer",null);u(this,"tracker",null);this.frontSelector=e.frontSelector||".front",this.midLayerElement=e.midLayerElement||null,this.items=[],this.isInitialized=!1,this.tracker=new Te(document.body,e.trackerConfig||{resizeDebounce:!0})}init(){var e;this.isInitialized||(this.createLayers(),this.setupMidLayer(),this.hijackFrontElements(),this.setupHooks(),(e=this.tracker)==null||e.start(),this.isInitialized=!0,console.log("🥪 sand-telepochi initialized!"))}useTracker(e){this.tracker=e,this.setupHooks()}createLayers(){this.midLayer=document.createElement("div"),this.midLayer.id="sand-layer-mid",Object.assign(this.midLayer.style,{position:"fixed",inset:"0",zIndex:"9998",pointerEvents:"none"}),this.frontLayer=document.createElement("div"),this.frontLayer.id="sand-layer-front",Object.assign(this.frontLayer.style,{position:"fixed",inset:"0",zIndex:"9999",pointerEvents:"none"}),document.body.appendChild(this.midLayer),document.body.appendChild(this.frontLayer)}setupMidLayer(){this.midLayerElement&&this.midLayer&&(this.midLayer.appendChild(this.midLayerElement),this.midLayerElement.style.pointerEvents="auto")}hijackFrontElements(){const e=document.querySelectorAll(this.frontSelector);this.frontLayer&&e.forEach(t=>{var n;const r=t.getBoundingClientRect(),i=window.getComputedStyle(t),c=document.createElement("div");c.className="sand-placeholder",Object.assign(c.style,{display:i.display==="inline"?"inline-block":i.display,width:`${r.width}px`,height:`${r.height}px`,boxSizing:"border-box",marginTop:i.marginTop,marginBottom:i.marginBottom,marginLeft:i.marginLeft,marginRight:i.marginRight,visibility:"hidden",pointerEvents:"none"}),(n=t.parentNode)==null||n.insertBefore(c,t),this.frontLayer.appendChild(t),Object.assign(t.style,{position:"fixed",margin:"0",boxSizing:"border-box",width:`${r.width}px`,height:`${r.height}px`,pointerEvents:"auto"}),this.items.push({placeholder:c,original:t})})}setupHooks(){this.tracker&&this.tracker.onBeforeRender.add(()=>{const e=this.items.map(({placeholder:t})=>t.getBoundingClientRect());this.items.forEach(({original:t},r)=>{const i=e[r];t.style.top=`${i.top}px`,t.style.left=`${i.left}px`,t.style.width=`${i.width}px`,t.style.height=`${i.height}px`})})}}class nt{constructor(e,t){u(this,"_engine");u(this,"_sandwich");if(!e)throw new Error("[Mirage] Target element is required.");if(this._engine=new it(e,t),t.sandwich!==!1){const r=typeof t.sandwich=="object"?t.sandwich:{};this._sandwich=new st({frontSelector:r.frontSelector||`[${Se.NAME}='${Se.VALUES.FRONT}']`}),this._sandwich.useTracker(this._engine.getTracker())}}start(){this._engine.start(),this._sandwich&&this._sandwich.init()}stop(){this._engine.stop()}destroy(){this._engine.dispose()}getTracker(){return this._engine.getTracker()}getCanvas(){return this._engine.getCanvas()}updateUniforms(e,t){this._engine.updateUniforms(e,t)}test(){this._engine.test()}}A.Mirage=nt,Object.defineProperty(A,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mirage-engine",
-  "version": "0.3.13",
+  "version": "0.3.14",
   "description": "An engine that mirrors HTML DOM elements to a WebGL scene in real-time.",
   "type": "module",
   "types": "./dist/index.d.ts",
@@ -23,7 +23,7 @@
   "dependencies": {
     "@mirage-engine/painter": "1.0.4",
     "@mirage-engine/sandwich": "0.2.8",
-    "@mirage-engine/core": "0.3.13"
+    "@mirage-engine/core": "0.3.14"
   },
   "peerDependencies": {
     "three": "^0.160.0"