@volter/game-editor 0.5.131 → 0.5.132

package/dist/assets/{index-DhjCepUi.js → index-B-3voSn5.js}

@@ -1,4 +1,4 @@
-import{_ as Ie}from"./extends-CF3RwP-h.js";import{r as A,a as Vn}from"./index-nmcBqr7Y.js";import{a as Jy}from"./client-DNXj_opT.js";import{U as Id,S as No,W as Zx}from"./three.module-BLhyNg0e.js";import{u as ue,a as He,I as Jx,q as _d,G as vi,s as ir,J as e4,K as Hu,e as xi,o as Wn,v as Xr,F as t4,l as ev,k as S0,L as i4}from"./events-156d8d12.esm-DmeaOP4r.js";import{fo as W,aI as bi,fd as Be,d9 as ci,d5 as Bi,az as ql,da as wr,cm as we,dp as rt,cl as Ln,ez as Vu,fp as Ei,_ as qe,aV as Pn,cj as Ze,co as ze,bu as tv,au as Ir,dw as Ti,b0 as si,ed as Ns,cE as Xt,N as Ji,M as Ai,aM as nn,ex as xn,em as hi,B as Ar,fe as Ko,K as cr,bl as n4,f1 as Hr,cW as yi,e6 as Wu,cp as ta,bX as ul,aq as Qn,a$ as $i,bV as It,db as an,cZ as Rr,ey as iv,e$ as Xl,cg as Th,bh as jo,I as Kt,aP as wh,bg as s4,fx as Fi,c1 as ni,cN as C0,Z as r4,aY as o4,b5 as nv,am as a4,ca as ia,cb as l4,aZ as ks,eX as _r,Y as Yn,eW as cn,cv as bh,cs as T0,aT as sv,F as Zm,dk as Eu,dd as Jm,eC as c4,aE as u4,ev as rv,et as h4,j as f4,f7 as d4,l as m4,fq as g4,dq as p4,cV as A4,eq as ur,a3 as Yu,aa as ov,ff as Gi,c5 as w0,dI as eg,e8 as Ms,e2 as zo,bi as fi,e0 as y4,d$ as v4,dZ as E4,dY as x4,dS as I4,dP as _4,dN as S4,dM as C4,dE as T4,av,aw as Qo,H as w4,er as b4,eo as R4,d8 as Rh,bs as b0,bt as Sd,bA as Go,fA as D4,bW as Fs,dn as L4,ag as P4,V as lv,x as M4,y as B4,cr as k4,cq as cv,dv as uv,br as xu,fb as pn,du as Ku,aO as F4,c_ as hv,cR as O4,ao as fv,dx as Iu,fj as Wr,fw as ju,a9 as dv,an as U4,el as br,T as mv,ad as R0,fs as N4,ej as gv,aC as pv,aA as Av,fm as D0,R as yv,b4 as _u,E as z4,e5 as Fl,by as ou,P as Cd,es as vv,e3 as Ev,e9 as Q4,n as G4,ch as $4,cw as xv,cx as Iv,cP as H4,dg as V4,f6 as Su,c7 as Td,cc as W4,c3 as tg,eG as Y4,cu as K4,S as j4,d as q4,ee as Dh,i as X4,bI as Lh,cU as Z4,aS as J4,aW as eI}from"./three.core-3arARmh6.js";import{v as Ol,d as _v,C as tI,u as BM}from"./Gltf-CRUmmFxv.js";import{G as VF}from"./Gltf-CRUmmFxv.js";import{m as iI,t as nI}from"./BufferGeometryUtils-FJZNEiJN.js";import{OrthographicCamera as sI}from"./OrthographicCamera-Bv8_A2mi.js";import{PerspectiveCamera as YF}from"./PerspectiveCamera-D3r6Hnc8.js";import{E as na,M as rI}from"./OrbitControls-C6LQ4Pxi.js";import{O as jF}from"./OrbitControls-C6LQ4Pxi.js";import{_ as Sv}from"./index-D-G1ZsCu.js";import{g as oI}from"./_commonjsHelpers-D6-XlEtG.js";import{u as ds}from"./Fbo-Biv6Lrhl.js";import{F as XF}from"./Fbo-Biv6Lrhl.js";import{RoundedBox as JF,RoundedBoxGeometry as eO}from"./RoundedBox-DrJK5JOI.js";import"./index-D_NuPfjr.js";import"./index-CinJrH5C.js";import"./jsx-runtime-DPjLkJKQ.js";import"./index-DzuOGwVB.js";import"./index-CtzuWnCS.js";import"./index-FUuS4qwW.js";const Ul=new W,L0=new W,aI=new W,ig=new Be;function lI(r,e,t){const i=Ul.setFromMatrixPosition(r.matrixWorld);i.project(e);const n=t.width/2,s=t.height/2;return[i.x*n+n,-(i.y*s)+s]}function cI(r,e){const t=Ul.setFromMatrixPosition(r.matrixWorld),i=L0.setFromMatrixPosition(e.matrixWorld),n=t.sub(i),s=e.getWorldDirection(aI);return n.angleTo(s)>Math.PI/2}function uI(r,e,t,i){const n=Ul.setFromMatrixPosition(r.matrixWorld),s=n.clone();s.project(e),ig.set(s.x,s.y),t.setFromCamera(ig,e);const o=t.intersectObjects(i,!0);if(o.length){const a=o[0].distance;return n.distanceTo(t.ray.origin)<a}return!0}function hI(r,e){if(e instanceof Bi)return e.zoom;if(e instanceof ci){const t=Ul.setFromMatrixPosition(r.matrixWorld),i=L0.setFromMatrixPosition(e.matrixWorld),n=e.fov*Math.PI/180,s=t.distanceTo(i);return 1/(2*Math.tan(n/2)*s)}else return 1}function fI(r,e,t){if(e instanceof ci||e instanceof Bi){const i=Ul.setFromMatrixPosition(r.matrixWorld),n=L0.setFromMatrixPosition(e.matrixWorld),s=i.distanceTo(n),o=(t[1]-t[0])/(e.far-e.near),a=t[1]-o*e.far;return Math.round(o*s+a)}}const wd=r=>Math.abs(r)<1e-10?0:r;function Cv(r,e,t=""){let i="matrix3d(";for(let n=0;n!==16;n++)i+=wd(e[n]*r.elements[n])+(n!==15?",":")");return t+i}const dI=(r=>e=>Cv(e,r))([1,-1,1,1,1,-1,1,1,1,-1,1,1,1,-1,1,1]),mI=(r=>(e,t)=>Cv(e,r(t),"translate(-50%,-50%)"))(r=>[1/r,1/r,1/r,1,-1/r,-1/r,-1/r,-1,1/r,1/r,1/r,1,1,1,1,1]);function gI(r){return r&&typeof r=="object"&&"current"in r}const qu=A.forwardRef(({children:r,eps:e=.001,style:t,className:i,prepend:n,center:s,fullscreen:o,portal:a,distanceFactor:l,sprite:c=!1,transform:u=!1,occlude:h,onOcclude:f,castShadow:d,receiveShadow:g,material:m,geometry:p,zIndexRange:E=[16777271,0],calculatePosition:v=lI,as:y="div",wrapperClass:x,pointerEvents:I="auto",..._},S)=>{const{gl:C,camera:w,scene:T,size:D,raycaster:b,events:R,viewport:P}=ue(),[O]=A.useState(()=>document.createElement(y)),Q=A.useRef(null),V=A.useRef(null),K=A.useRef(0),k=A.useRef([0,0]),G=A.useRef(null),M=A.useRef(null),H=a?.current||R.connected||C.domElement.parentNode,Y=A.useRef(null),N=A.useRef(!1),z=A.useMemo(()=>h&&h!=="blending"||Array.isArray(h)&&h.length&&gI(h[0]),[h]);A.useLayoutEffect(()=>{const ee=C.domElement;h&&h==="blending"?(ee.style.zIndex=`${Math.floor(E[0]/2)}`,ee.style.position="absolute",ee.style.pointerEvents="none"):(ee.style.zIndex=null,ee.style.position=null,ee.style.pointerEvents=null)},[h]),A.useLayoutEffect(()=>{if(V.current){const ee=Q.current=Jy.createRoot(O);if(T.updateMatrixWorld(),u)O.style.cssText="position:absolute;top:0;left:0;pointer-events:none;overflow:hidden;";else{const Z=v(V.current,w,D);O.style.cssText=`position:absolute;top:0;left:0;transform:translate3d(${Z[0]}px,${Z[1]}px,0);transform-origin:0 0;`}return H&&(n?H.prepend(O):H.appendChild(O)),()=>{H&&H.removeChild(O),ee.unmount()}}},[H,u]),A.useLayoutEffect(()=>{x&&(O.className=x)},[x]);const B=A.useMemo(()=>u?{position:"absolute",top:0,left:0,width:D.width,height:D.height,transformStyle:"preserve-3d",pointerEvents:"none"}:{position:"absolute",transform:s?"translate3d(-50%,-50%,0)":"none",...o&&{top:-D.height/2,left:-D.width/2,width:D.width,height:D.height},...t},[t,s,o,D,u]),F=A.useMemo(()=>({position:"absolute",pointerEvents:I}),[I]);A.useLayoutEffect(()=>{if(N.current=!1,u){var ee;(ee=Q.current)==null||ee.render(A.createElement("div",{ref:G,style:B},A.createElement("div",{ref:M,style:F},A.createElement("div",{ref:S,className:i,style:t,children:r}))))}else{var Z;(Z=Q.current)==null||Z.render(A.createElement("div",{ref:S,style:B,className:i,children:r}))}});const U=A.useRef(!0);He(ee=>{if(V.current){w.updateMatrixWorld(),V.current.updateWorldMatrix(!0,!1);const Z=u?k.current:v(V.current,w,D);if(u||Math.abs(K.current-w.zoom)>e||Math.abs(k.current[0]-Z[0])>e||Math.abs(k.current[1]-Z[1])>e){const ne=cI(V.current,w);let ce=!1;z&&(Array.isArray(h)?ce=h.map(le=>le.current):h!=="blending"&&(ce=[T]));const me=U.current;if(ce){const le=uI(V.current,w,b,ce);U.current=le&&!ne}else U.current=!ne;me!==U.current&&(f?f(!U.current):O.style.display=U.current?"block":"none");const re=Math.floor(E[0]/2),te=h?z?[E[0],re]:[re-1,0]:E;if(O.style.zIndex=`${fI(V.current,w,te)}`,u){const[le,se]=[D.width/2,D.height/2],X=w.projectionMatrix.elements[5]*se,{isOrthographicCamera:j,top:oe,left:pe,bottom:_e,right:Ce}=w,ye=dI(w.matrixWorldInverse),Ne=j?`scale(${X})translate(${wd(-(Ce+pe)/2)}px,${wd((oe+_e)/2)}px)`:`translateZ(${X}px)`;let Te=V.current.matrixWorld;c&&(Te=w.matrixWorldInverse.clone().transpose().copyPosition(Te).scale(V.current.scale),Te.elements[3]=Te.elements[7]=Te.elements[11]=0,Te.elements[15]=1),O.style.width=D.width+"px",O.style.height=D.height+"px",O.style.perspective=j?"":`${X}px`,G.current&&M.current&&(G.current.style.transform=`${Ne}${ye}translate(${le}px,${se}px)`,M.current.style.transform=mI(Te,1/((l||10)/400)))}else{const le=l===void 0?1:hI(V.current,w)*l;O.style.transform=`translate3d(${Z[0]}px,${Z[1]}px,0) scale(${le})`}k.current=Z,K.current=w.zoom}}if(!z&&Y.current&&!N.current)if(u){if(G.current){const Z=G.current.children[0];if(Z!=null&&Z.clientWidth&&Z!=null&&Z.clientHeight){const{isOrthographicCamera:ne}=w;if(ne||p)_.scale&&(Array.isArray(_.scale)?_.scale instanceof W?Y.current.scale.copy(_.scale.clone().divideScalar(1)):Y.current.scale.set(1/_.scale[0],1/_.scale[1],1/_.scale[2]):Y.current.scale.setScalar(1/_.scale));else{const ce=(l||10)/400,me=Z.clientWidth*ce,re=Z.clientHeight*ce;Y.current.scale.set(me,re,1)}N.current=!0}}}else{const Z=O.children[0];if(Z!=null&&Z.clientWidth&&Z!=null&&Z.clientHeight){const ne=1/P.factor,ce=Z.clientWidth*ne,me=Z.clientHeight*ne;Y.current.scale.set(ce,me,1),N.current=!0}Y.current.lookAt(ee.camera.position)}});const J=A.useMemo(()=>({vertexShader:u?void 0:`
+import{_ as Ie}from"./extends-CF3RwP-h.js";import{r as A,a as Vn}from"./index-nmcBqr7Y.js";import{a as Jy}from"./client-DNXj_opT.js";import{U as Id,S as No,W as Zx}from"./three.module-BLhyNg0e.js";import{u as ue,a as He,I as Jx,q as _d,G as vi,s as ir,J as e4,K as Hu,e as xi,o as Wn,v as Xr,F as t4,l as ev,k as S0,L as i4}from"./events-156d8d12.esm-DmeaOP4r.js";import{fo as W,aI as bi,fd as Be,d9 as ci,d5 as Bi,az as ql,da as wr,cm as we,dp as rt,cl as Ln,ez as Vu,fp as Ei,_ as qe,aV as Pn,cj as Ze,co as ze,bu as tv,au as Ir,dw as Ti,b0 as si,ed as Ns,cE as Xt,N as Ji,M as Ai,aM as nn,ex as xn,em as hi,B as Ar,fe as Ko,K as cr,bl as n4,f1 as Hr,cW as yi,e6 as Wu,cp as ta,bX as ul,aq as Qn,a$ as $i,bV as It,db as an,cZ as Rr,ey as iv,e$ as Xl,cg as Th,bh as jo,I as Kt,aP as wh,bg as s4,fx as Fi,c1 as ni,cN as C0,Z as r4,aY as o4,b5 as nv,am as a4,ca as ia,cb as l4,aZ as ks,eX as _r,Y as Yn,eW as cn,cv as bh,cs as T0,aT as sv,F as Zm,dk as Eu,dd as Jm,eC as c4,aE as u4,ev as rv,et as h4,j as f4,f7 as d4,l as m4,fq as g4,dq as p4,cV as A4,eq as ur,a3 as Yu,aa as ov,ff as Gi,c5 as w0,dI as eg,e8 as Ms,e2 as zo,bi as fi,e0 as y4,d$ as v4,dZ as E4,dY as x4,dS as I4,dP as _4,dN as S4,dM as C4,dE as T4,av,aw as Qo,H as w4,er as b4,eo as R4,d8 as Rh,bs as b0,bt as Sd,bA as Go,fA as D4,bW as Fs,dn as L4,ag as P4,V as lv,x as M4,y as B4,cr as k4,cq as cv,dv as uv,br as xu,fb as pn,du as Ku,aO as F4,c_ as hv,cR as O4,ao as fv,dx as Iu,fj as Wr,fw as ju,a9 as dv,an as U4,el as br,T as mv,ad as R0,fs as N4,ej as gv,aC as pv,aA as Av,fm as D0,R as yv,b4 as _u,E as z4,e5 as Fl,by as ou,P as Cd,es as vv,e3 as Ev,e9 as Q4,n as G4,ch as $4,cw as xv,cx as Iv,cP as H4,dg as V4,f6 as Su,c7 as Td,cc as W4,c3 as tg,eG as Y4,cu as K4,S as j4,d as q4,ee as Dh,i as X4,bI as Lh,cU as Z4,aS as J4,aW as eI}from"./three.core-3arARmh6.js";import{v as Ol,d as _v,C as tI,u as BM}from"./Gltf-CRUmmFxv.js";import{G as VF}from"./Gltf-CRUmmFxv.js";import{m as iI,t as nI}from"./BufferGeometryUtils-FJZNEiJN.js";import{OrthographicCamera as sI}from"./OrthographicCamera-Bv8_A2mi.js";import{PerspectiveCamera as YF}from"./PerspectiveCamera-D3r6Hnc8.js";import{E as na,M as rI}from"./OrbitControls-C6LQ4Pxi.js";import{O as jF}from"./OrbitControls-C6LQ4Pxi.js";import{_ as Sv}from"./index-Bg3AEnyx.js";import{g as oI}from"./_commonjsHelpers-D6-XlEtG.js";import{u as ds}from"./Fbo-Biv6Lrhl.js";import{F as XF}from"./Fbo-Biv6Lrhl.js";import{RoundedBox as JF,RoundedBoxGeometry as eO}from"./RoundedBox-DrJK5JOI.js";import"./index-D_NuPfjr.js";import"./index-CinJrH5C.js";import"./jsx-runtime-DPjLkJKQ.js";import"./index-DzuOGwVB.js";import"./index-CtzuWnCS.js";import"./index-FUuS4qwW.js";const Ul=new W,L0=new W,aI=new W,ig=new Be;function lI(r,e,t){const i=Ul.setFromMatrixPosition(r.matrixWorld);i.project(e);const n=t.width/2,s=t.height/2;return[i.x*n+n,-(i.y*s)+s]}function cI(r,e){const t=Ul.setFromMatrixPosition(r.matrixWorld),i=L0.setFromMatrixPosition(e.matrixWorld),n=t.sub(i),s=e.getWorldDirection(aI);return n.angleTo(s)>Math.PI/2}function uI(r,e,t,i){const n=Ul.setFromMatrixPosition(r.matrixWorld),s=n.clone();s.project(e),ig.set(s.x,s.y),t.setFromCamera(ig,e);const o=t.intersectObjects(i,!0);if(o.length){const a=o[0].distance;return n.distanceTo(t.ray.origin)<a}return!0}function hI(r,e){if(e instanceof Bi)return e.zoom;if(e instanceof ci){const t=Ul.setFromMatrixPosition(r.matrixWorld),i=L0.setFromMatrixPosition(e.matrixWorld),n=e.fov*Math.PI/180,s=t.distanceTo(i);return 1/(2*Math.tan(n/2)*s)}else return 1}function fI(r,e,t){if(e instanceof ci||e instanceof Bi){const i=Ul.setFromMatrixPosition(r.matrixWorld),n=L0.setFromMatrixPosition(e.matrixWorld),s=i.distanceTo(n),o=(t[1]-t[0])/(e.far-e.near),a=t[1]-o*e.far;return Math.round(o*s+a)}}const wd=r=>Math.abs(r)<1e-10?0:r;function Cv(r,e,t=""){let i="matrix3d(";for(let n=0;n!==16;n++)i+=wd(e[n]*r.elements[n])+(n!==15?",":")");return t+i}const dI=(r=>e=>Cv(e,r))([1,-1,1,1,1,-1,1,1,1,-1,1,1,1,-1,1,1]),mI=(r=>(e,t)=>Cv(e,r(t),"translate(-50%,-50%)"))(r=>[1/r,1/r,1/r,1,-1/r,-1/r,-1/r,-1,1/r,1/r,1/r,1,1,1,1,1]);function gI(r){return r&&typeof r=="object"&&"current"in r}const qu=A.forwardRef(({children:r,eps:e=.001,style:t,className:i,prepend:n,center:s,fullscreen:o,portal:a,distanceFactor:l,sprite:c=!1,transform:u=!1,occlude:h,onOcclude:f,castShadow:d,receiveShadow:g,material:m,geometry:p,zIndexRange:E=[16777271,0],calculatePosition:v=lI,as:y="div",wrapperClass:x,pointerEvents:I="auto",..._},S)=>{const{gl:C,camera:w,scene:T,size:D,raycaster:b,events:R,viewport:P}=ue(),[O]=A.useState(()=>document.createElement(y)),Q=A.useRef(null),V=A.useRef(null),K=A.useRef(0),k=A.useRef([0,0]),G=A.useRef(null),M=A.useRef(null),H=a?.current||R.connected||C.domElement.parentNode,Y=A.useRef(null),N=A.useRef(!1),z=A.useMemo(()=>h&&h!=="blending"||Array.isArray(h)&&h.length&&gI(h[0]),[h]);A.useLayoutEffect(()=>{const ee=C.domElement;h&&h==="blending"?(ee.style.zIndex=`${Math.floor(E[0]/2)}`,ee.style.position="absolute",ee.style.pointerEvents="none"):(ee.style.zIndex=null,ee.style.position=null,ee.style.pointerEvents=null)},[h]),A.useLayoutEffect(()=>{if(V.current){const ee=Q.current=Jy.createRoot(O);if(T.updateMatrixWorld(),u)O.style.cssText="position:absolute;top:0;left:0;pointer-events:none;overflow:hidden;";else{const Z=v(V.current,w,D);O.style.cssText=`position:absolute;top:0;left:0;transform:translate3d(${Z[0]}px,${Z[1]}px,0);transform-origin:0 0;`}return H&&(n?H.prepend(O):H.appendChild(O)),()=>{H&&H.removeChild(O),ee.unmount()}}},[H,u]),A.useLayoutEffect(()=>{x&&(O.className=x)},[x]);const B=A.useMemo(()=>u?{position:"absolute",top:0,left:0,width:D.width,height:D.height,transformStyle:"preserve-3d",pointerEvents:"none"}:{position:"absolute",transform:s?"translate3d(-50%,-50%,0)":"none",...o&&{top:-D.height/2,left:-D.width/2,width:D.width,height:D.height},...t},[t,s,o,D,u]),F=A.useMemo(()=>({position:"absolute",pointerEvents:I}),[I]);A.useLayoutEffect(()=>{if(N.current=!1,u){var ee;(ee=Q.current)==null||ee.render(A.createElement("div",{ref:G,style:B},A.createElement("div",{ref:M,style:F},A.createElement("div",{ref:S,className:i,style:t,children:r}))))}else{var Z;(Z=Q.current)==null||Z.render(A.createElement("div",{ref:S,style:B,className:i,children:r}))}});const U=A.useRef(!0);He(ee=>{if(V.current){w.updateMatrixWorld(),V.current.updateWorldMatrix(!0,!1);const Z=u?k.current:v(V.current,w,D);if(u||Math.abs(K.current-w.zoom)>e||Math.abs(k.current[0]-Z[0])>e||Math.abs(k.current[1]-Z[1])>e){const ne=cI(V.current,w);let ce=!1;z&&(Array.isArray(h)?ce=h.map(le=>le.current):h!=="blending"&&(ce=[T]));const me=U.current;if(ce){const le=uI(V.current,w,b,ce);U.current=le&&!ne}else U.current=!ne;me!==U.current&&(f?f(!U.current):O.style.display=U.current?"block":"none");const re=Math.floor(E[0]/2),te=h?z?[E[0],re]:[re-1,0]:E;if(O.style.zIndex=`${fI(V.current,w,te)}`,u){const[le,se]=[D.width/2,D.height/2],X=w.projectionMatrix.elements[5]*se,{isOrthographicCamera:j,top:oe,left:pe,bottom:_e,right:Ce}=w,ye=dI(w.matrixWorldInverse),Ne=j?`scale(${X})translate(${wd(-(Ce+pe)/2)}px,${wd((oe+_e)/2)}px)`:`translateZ(${X}px)`;let Te=V.current.matrixWorld;c&&(Te=w.matrixWorldInverse.clone().transpose().copyPosition(Te).scale(V.current.scale),Te.elements[3]=Te.elements[7]=Te.elements[11]=0,Te.elements[15]=1),O.style.width=D.width+"px",O.style.height=D.height+"px",O.style.perspective=j?"":`${X}px`,G.current&&M.current&&(G.current.style.transform=`${Ne}${ye}translate(${le}px,${se}px)`,M.current.style.transform=mI(Te,1/((l||10)/400)))}else{const le=l===void 0?1:hI(V.current,w)*l;O.style.transform=`translate3d(${Z[0]}px,${Z[1]}px,0) scale(${le})`}k.current=Z,K.current=w.zoom}}if(!z&&Y.current&&!N.current)if(u){if(G.current){const Z=G.current.children[0];if(Z!=null&&Z.clientWidth&&Z!=null&&Z.clientHeight){const{isOrthographicCamera:ne}=w;if(ne||p)_.scale&&(Array.isArray(_.scale)?_.scale instanceof W?Y.current.scale.copy(_.scale.clone().divideScalar(1)):Y.current.scale.set(1/_.scale[0],1/_.scale[1],1/_.scale[2]):Y.current.scale.setScalar(1/_.scale));else{const ce=(l||10)/400,me=Z.clientWidth*ce,re=Z.clientHeight*ce;Y.current.scale.set(me,re,1)}N.current=!0}}}else{const Z=O.children[0];if(Z!=null&&Z.clientWidth&&Z!=null&&Z.clientHeight){const ne=1/P.factor,ce=Z.clientWidth*ne,me=Z.clientHeight*ne;Y.current.scale.set(ce,me,1),N.current=!0}Y.current.lookAt(ee.camera.position)}});const J=A.useMemo(()=>({vertexShader:u?void 0:`
           /*
             This shader is from the THREE's SpriteMaterial.
             We need to turn the backing plane into a Sprite