UNPKG

@adhiban/three-mesh-ui

Version:

a library on top of three.js to help in creating 3D user interfaces, with minor changes ;)

1 lines 67.1 kB
(()=>{"use strict";var e={d:(t,r)=>{for(var s in r)e.o(r,s)&&!e.o(t,s)&&Object.defineProperty(t,s,{enumerable:!0,get:r[s]})}};e.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),e.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),e.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var t={};e.r(t),e.d(t,{COLUMN:()=>c,COLUMN_REVERSE:()=>l,ROW:()=>o,ROW_REVERSE:()=>h,contentDirection:()=>d});var r={};e.r(r),e.d(r,{CENTER:()=>p,END:()=>w,START:()=>u,STRETCH:()=>C,alignItems:()=>g,warnAboutDeprecatedAlignItems:()=>f});var s={};e.r(s),e.d(s,{CENTER:()=>v,END:()=>y,SPACE_AROUND:()=>k,SPACE_BETWEEN:()=>_,SPACE_EVENLY:()=>U,START:()=>x,justifyContent:()=>S});var a={};e.r(a),e.d(a,{NORMAL:()=>B,NOWRAP:()=>O,PRE:()=>P,PRE_LINE:()=>F,PRE_WRAP:()=>E,WHITE_CHARS:()=>I,collapseWhitespaceOnInlines:()=>L,collapseWhitespaceOnString:()=>z,newlineBreakability:()=>H,shouldBreak:()=>D});var i={};e.r(i),e.d(i,{CENTER:()=>N,JUSTIFY:()=>X,JUSTIFY_CENTER:()=>q,JUSTIFY_LEFT:()=>V,JUSTIFY_RIGHT:()=>Y,LEFT:()=>G,RIGHT:()=>j,textAlign:()=>J});const n=THREE,o="row",h="row-reverse",c="column",l="column-reverse";function d(e,t,r,s){let a=r,i="getWidth",n="x",o="y";0===t.indexOf(c)&&(i="getHeight",n="y",o="x");for(let t=0;t<e.childrenBoxes.length;t++){const r=e.childrenBoxes[t],h=r.id,c=r[i](),l=r.margin||0;a+=l*s,e.childrenPos[h]={[n]:a+c/2*s,[o]:0},a+=s*(c+l)}}const u="start",p="center",w="end",C="stretch";function g(e,t){const r=e.getAlignItems();-1===m.indexOf(r)&&console.warn(`alignItems === '${r}' is not supported`);let s="getWidth",a="x";0===t.indexOf(o)&&(s="getHeight",a="y");const i=e[s]()/2-(e.padding||0);e.childrenBoxes.forEach((n=>{let h;switch(r){case w:case"right":case"bottom":h=0===t.indexOf(o)?-i+n[s]()/2+(n.margin||0):i-n[s]()/2-(n.margin||0);break;case u:case"left":case"top":h=0===t.indexOf(o)?i-n[s]()/2-(n.margin||0):-i+n[s]()/2+(n.margin||0)}e.childrenPos[n.id][a]=h||0}))}function f(e){-1!==b.indexOf(e)&&console.warn(`alignItems === '${e}' is deprecated and will be remove in 7.x.x. Fallback are 'start'|'end'`)}const m=[u,p,w,C,"top","right","bottom","left"],b=["top","right","bottom","left"],x="start",v="center",y="end",k="space-around",_="space-between",U="space-evenly";function S(e,t,r,s){const a=e.getJustifyContent();-1===R.indexOf(a)&&console.warn(`justifyContent === '${a}' is not supported`);const i=0===t.indexOf("row")?"width":"height",n=e.getChildrenSideSum(i),o=("width"===i?e.getInnerWidth():e.getInnerHeight())-n,h=function(e,t){switch(e){case y:return t;case v:return t/2}return 0}(a,2*r-n*Math.sign(r)),c=function(e,t,r,s){const a=Array(e.length).fill(0);if(t>0)switch(r){case _:if(e.length>1){const r=t/(e.length-1)*s;a[0]=0;for(let t=1;t<e.length;t++)a[t]=r*t}break;case U:if(e.length>1){const r=t/(e.length+1)*s;for(let t=0;t<e.length;t++)a[t]=r*(t+1)}break;case k:if(e.length>1){const r=t/e.length*s,i=r/2;a[0]=i;for(let t=1;t<e.length;t++)a[t]=i+r*t}}return a}(e.childrenBoxes,o,a,s),l=0===t.indexOf("row")?"x":"y";e.childrenBoxes.forEach(((t,r)=>{e.childrenPos[t.id][l]-=h-c[r]}))}const R=[x,v,y,k,_,U];function T(e){return class extends e{constructor(e){super(e),this.isBoxComponent=!0,this.childrenPos={}}getInnerWidth(){const e=this.getContentDirection();switch(e){case"row":case"row-reverse":return this.width-(2*this.padding||0)||this.getChildrenSideSum("width");case"column":case"column-reverse":return this.getHighestChildSizeOn("width");default:console.error(`Invalid contentDirection : ${e}`)}}getInnerHeight(){const e=this.getContentDirection();switch(e){case"row":case"row-reverse":return this.getHighestChildSizeOn("height");case"column":case"column-reverse":return this.height-(2*this.padding||0)||this.getChildrenSideSum("height");default:console.error(`Invalid contentDirection : ${e}`)}}getChildrenSideSum(e){return this.childrenBoxes.reduce(((t,r)=>{const s=2*r.margin||0;return t+("width"===e?r.getWidth()+s:r.getHeight()+s)}),0)}setPosFromParentRecords(){this.parentUI&&this.parentUI.childrenPos[this.id]&&(this.position.x=this.parentUI.childrenPos[this.id].x,this.position.y=this.parentUI.childrenPos[this.id].y)}computeChildrenPosition(){if(this.children.length>0){const e=this.getContentDirection();let t;switch(e){case o:t=-this.getInnerWidth()/2;break;case h:t=this.getInnerWidth()/2;break;case c:t=this.getInnerHeight()/2;break;case l:t=-this.getInnerHeight()/2}const r=-Math.sign(t);d(this,e,t,r),S(this,e,t,r),g(this,e)}}getHighestChildSizeOn(e){return this.childrenBoxes.reduce(((t,r)=>{const s=r.margin||0,a="width"===e?r.getWidth()+2*s:r.getHeight()+2*s;return Math.max(t,a)}),0)}getWidth(){return this.parentUI&&"stretch"===this.parentUI.getAlignItems()&&-1!==this.parentUI.getContentDirection().indexOf("column")?this.parentUI.getWidth()-(2*this.parentUI.padding||0):this.width||this.getInnerWidth()+(2*this.padding||0)}getHeight(){return this.parentUI&&"stretch"===this.parentUI.getAlignItems()&&-1!==this.parentUI.getContentDirection().indexOf("row")?this.parentUI.getHeight()-(2*this.parentUI.padding||0):this.height||this.getInnerHeight()+(2*this.padding||0)}}}const I={"\t":"\t","\n":"\n","\r":"\r"," ":" "},B="normal",O="nowrap",P="pre",F="pre-line",E="pre-wrap",z=function(e,t){switch(t){case O:case B:e=e.replace(/\n/g," ");case F:e=e.replace(/[ ]{2,}/g," ")}return e},H=function(e){switch(e){case P:case E:case F:return"mandatory"}},D=function(e,t,r,s){const a=e[t];switch(s.WHITESPACE){case B:case F:case E:if("mandatory"===a.lineBreak)return!0;const i=a.kerning?a.kerning:0,n=a.xoffset?a.xoffset:0;if(r+(a.xadvance?a.xadvance:a.width)+n+i>s.INNER_WIDTH)return!0;const o=W(e,t,s);return function(e,t,r,s){return!(!e||!e.glyph)&&(!(t+r<s.INNER_WIDTH)&&s.BREAKON.indexOf(e.glyph)>-1)}(e[t-1],r,o,s);case P:return"mandatory"===a.lineBreak;default:return!1}},L=function(e,t){const r=e[0],s=e[e.length-1];switch(t){case E:r.glyph&&"\n"===r.glyph&&e.length>1&&M([r],e[1]),s.glyph&&"\n"===s.glyph&&e.length>1&&A([s],e[e.length-2]);break;case F:case O:case B:let a,i=[];for(let t=0;t<e.length;t++){const r=e[t];if(!(r.glyph&&I[r.glyph]&&e.length>t))break;i.push(r),a=e[t+1]}M(i,a),i=[],a=null;for(let t=e.length-1;t>0;t--){const r=e[t];if(!(r.glyph&&I[r.glyph]&&t>0))break;i.push(r),a=e[t-1]}A(i,a);break;case P:break;default:return console.warn(`whiteSpace: '${t}' is not valid`),0}return r.offsetX};function A(e,t){if(t)for(let r=0;r<e.length;r++){const s=e[r];s.width=0,s.height=0,s.offsetX=t.offsetX+t.width}}function M(e,t){if(t)for(let r=0;r<e.length;r++){const s=e[r];s.width=0,s.height=0,s.offsetX=t.offsetX}}function W(e,t,r,s){if(s=s||0,!e[t])return s;const a=e[t],i=a.kerning?a.kerning:0,n=a.xoffset?a.xoffset:0,o=a.xadvance?a.xadvance:a.width;return a.lineBreak?s+o:W(e,t+1,r,s+o+r.LETTERSPACING+n+i)}const G="left",j="right",N="center",X="justify",V="justify-left",Y="justify-right",q="justify-center";function J(e,t,r){for(let s=0;s<e.length;s++){const a=e[s],i=K(a,t,r,s===e.length-1);for(let e=0;e<a.length;e++)a[e].offsetX+=i}if(0===t.indexOf(X))for(let s=0;s<e.length;s++){const a=e[s];if(-1!==t.indexOf("-")&&s===e.length-1)return;const i=r-a.width;if(i<=0)return;let n=0;for(let e=1;e<a.length-1;e++)n+=" "===a[e].glyph?1:0;const o=i/n;let h=1;t===Y&&(a.reverse(),h=-1);let c=0;for(let e=1;e<=a.length-1;e++){const t=a[e];t.offsetX+=c*h,c+=" "===t.glyph?o:0}t===Y&&a.reverse()}}const K=(e,t,r,s)=>{switch(t){case V:case X:case G:return-r/2;case Y:case j:return-e.width+r/2;case N:return-e.width/2;case q:return s?-e.width/2:-r/2;default:console.warn(`textAlign: '${t}' is not valid`)}};function $(e){return class extends e{computeInlinesPosition(){const e=this.getWidth()-(2*this.padding||0),t=this.getHeight()-(2*this.padding||0),r=this.getJustifyContent(),s=this.getTextAlign(),a=this.getInterLine(),i=this.computeLines();let n=i.reduce(((e,t,r,s)=>{const i=t.lineHeight-t.lineBase;return t.forEach((r=>{r.offsetY=e-t.lineHeight+i+s[0].lineHeight})),e-t.lineHeight-a}),0)+a;n=Math.abs(n);const o=(()=>{switch(r){case"start":return t/2-i[0].lineHeight;case"end":return n-i[0].lineHeight-t/2+(i[i.length-1].lineHeight-i[i.length-1].lineHeight);case"center":return n/2-i[0].lineHeight;default:console.warn(`justifyContent: '${r}' is not valid`)}})();i.forEach((e=>{e.forEach((e=>{e.offsetY+=o}))})),J(i,s,e),this.lines=i}calculateBestFit(e){if(0!==this.childrenInlines.length)switch(e){case"grow":this.calculateGrowFit();break;case"shrink":this.calculateShrinkFit();break;case"auto":this.calculateAutoFit()}}calculateGrowFit(){const e=this.getHeight()-(2*this.padding||0);let t=1;const r=this.childrenInlines.find((e=>e.isText));let s,a=1,i=2,n=r._fitFontSize?r._fitFontSize/r.getFontSize():1;do{if(s=this.calculateHeight(n),s>e){if(n<=a){this.childrenInlines.forEach((e=>{e.isInlineBlock||(e._fitFontSize=e.getFontSize())}));break}i=n,n-=(i-a)/2}else{if(Math.abs(e-s)<.075)break;Math.abs(n-i)<5e-10&&(i*=2),a=n,n+=(i-a)/2}}while(++t<=10)}calculateShrinkFit(){const e=this.getHeight()-(2*this.padding||0);let t=1;const r=this.childrenInlines.find((e=>e.isText));let s,a=0,i=1,n=r._fitFontSize?r._fitFontSize/r.getFontSize():1;do{if(s=this.calculateHeight(n),s>e)i=n,n-=(i-a)/2;else{if(n>=i){this.childrenInlines.forEach((e=>{e.isInlineBlock||(e._fitFontSize=e.getFontSize())}));break}if(Math.abs(e-s)<.075)break;a=n,n+=(i-a)/2}}while(++t<=10)}calculateAutoFit(){const e=this.getHeight()-(2*this.padding||0);let t=1;const r=this.childrenInlines.find((e=>e.isText));let s,a=0,i=2,n=r._fitFontSize?r._fitFontSize/r.getFontSize():1;do{if(s=this.calculateHeight(n),s>e)i=n,n-=(i-a)/2;else{if(Math.abs(e-s)<.075)break;Math.abs(n-i)<5e-10&&(i*=2),a=n,n+=(i-a)/2}}while(++t<=10)}computeLines(){const e=this.getWidth()-(2*this.padding||0),t=[[]];return this.childrenInlines.reduce(((r,s)=>{if(!s.inlines)return;const a=s._fitFontSize||s.getFontSize(),i=s.isText?s.getLetterSpacing()*a:0,n=s.getWhiteSpace(),o=s.getBreakOn(),h={WHITESPACE:n,LETTERSPACING:i,BREAKON:o,INNER_WIDTH:e};return s.inlines.reduce(((e,r,s,a)=>{const n=r.kerning?r.kerning:0,o=r.xoffset?r.xoffset:0,c=r.xadvance?r.xadvance:r.width;return D(a,s,e,h)?(t.push([r]),r.offsetX=o,0===r.width?0:c+i):(t[t.length-1].push(r),r.offsetX=e+o+n,e+c+n+i)}),r)}),0),t.forEach((e=>{e.lineHeight=e.reduce(((e,t)=>{const r=void 0!==t.lineHeight?t.lineHeight:t.height;return Math.max(e,r)}),0),e.lineBase=e.reduce(((e,t)=>{const r=void 0!==t.lineBase?t.lineBase:t.height;return Math.max(e,r)}),0),e.width=0;if(e[0]){const t=this.getWhiteSpace(),r=L(e,t);e.forEach((e=>{e.offsetX-=r})),e.width=this.computeLineWidth(e)}})),t}calculateHeight(e){this.childrenInlines.forEach((t=>{t.isInlineBlock||(t._fitFontSize=t.getFontSize()*e,t.calculateInlines(t._fitFontSize))}));const t=this.computeLines(),r=this.getInterLine(),s=t.reduce(((e,t)=>e-t.lineHeight-r),0)+r;return Math.abs(s)}computeLineWidth(e){const t=e[0],r=e[e.length-1];return r.offsetX+r.width+t.offsetX}}}const Q=new n.FileLoader,Z=[],ee={},te=new n.TextureLoader,re=[],se={},ae={};function ie(e){if(e._kernings)return;const t={};for(let r=0;r<e.kernings.length;r++){const s=e.kernings[r];if(0===s.amount)continue;t[String.fromCharCode(s.first,s.second)]=s.amount}e._kernings=t}const ne={setFontFamily:function(e,t){"string"==typeof t?function(e,t){-1===Z.indexOf(t)&&(Z.push(t),Q.load(t,(e=>{const r=JSON.parse(e);ie(r),ee[t]=r;for(const e of Object.keys(ae))t===ae[e].jsonURL&&ae[e].component._updateFontFamily(r)})));ae[e.id]||(ae[e.id]={component:e});ae[e.id].jsonURL=t,ee[t]&&e._updateFontFamily(ee[t])}(e,t):(ae[e.id]||(ae[e.id]={component:e}),ie(t),ae[e.id].json=t,e._updateFontFamily(t))},setFontTexture:function(e,t){-1===re.indexOf(t)&&(re.push(t),te.load(t,(e=>{e.generateMipmaps=!1,e.minFilter=n.LinearFilter,e.magFilter=n.LinearFilter,se[t]=e;for(const r of Object.keys(ae))t===ae[r].textureURL&&ae[r].component._updateFontTexture(e)}))),ae[e.id]||(ae[e.id]={component:e}),ae[e.id].textureURL=t,se[t]&&e._updateFontTexture(se[t])},getFontOf:function e(t){const r=ae[t.id];return!r&&t.parentUI?e(t.parentUI):r},addFont:function(e,t,r){r.generateMipmaps=!1,r.minFilter=n.LinearFilter,r.magFilter=n.LinearFilter,Z.push(e),ee[e]=t,ie(t),r&&(re.push(e),se[e]=r)}},oe=ne;class he{static requestUpdate(e,t,r,s){e.traverse((e=>{e.isUI&&(this.requestedUpdates[e.id]?(t&&(this.requestedUpdates[e.id].updateParsing=!0),r&&(this.requestedUpdates[e.id].updateLayout=!0),s&&(this.requestedUpdates[e.id].updateInner=!0)):this.requestedUpdates[e.id]={updateParsing:t,updateLayout:r,updateInner:s,needCallback:t||r||s})}))}static register(e){this.components.includes(e)||this.components.push(e)}static disposeOf(e){const t=this.components.indexOf(e);t>-1&&this.components.splice(t,1)}static update(){if(Object.keys(this.requestedUpdates).length>0){const e=this.components.filter((e=>!e.parentUI));e.forEach((e=>this.traverseParsing(e))),e.forEach((e=>this.traverseUpdates(e)))}}static traverseParsing(e){const t=this.requestedUpdates[e.id];t&&t.updateParsing&&(e.parseParams(),t.updateParsing=!1),e.childrenUIs.forEach((e=>this.traverseParsing(e)))}static traverseUpdates(e){const t=this.requestedUpdates[e.id];delete this.requestedUpdates[e.id],t&&t.updateLayout&&(t.updateLayout=!1,e.updateLayout()),t&&t.updateInner&&(t.updateInner=!1,e.updateInner()),e.childrenUIs.forEach((e=>{this.traverseUpdates(e)})),t&&t.needCallback&&e.onAfterUpdate()}}he.components=[],he.requestedUpdates={};const ce={container:null,fontFamily:null,fontSize:.05,fontKerning:"normal",bestFit:"none",offset:.01,interLine:.01,breakOn:"- ,.:?!\n",whiteSpace:F,contentDirection:c,alignItems:p,justifyContent:x,textAlign:N,textType:"MSDF",fontColor:new n.Color(16777215),fontOpacity:1,fontPXRange:4,fontSupersampling:!0,borderRadius:.01,borderWidth:0,borderColor:new n.Color("black"),borderOpacity:1,backgroundSize:"cover",backgroundColor:new n.Color(2236962),backgroundWhiteColor:new n.Color(16777215),backgroundOpacity:.8,backgroundOpaqueOpacity:1,getDefaultTexture:function(){if(!le){const e=document.createElement("canvas").getContext("2d");e.canvas.width=1,e.canvas.height=1,e.fillStyle="#ffffff",e.fillRect(0,0,1,1),le=new n.CanvasTexture(e.canvas),le.isDefault=!0}return le},hiddenOverflow:!1,letterSpacing:0};let le;function de(e){return class extends e{constructor(e){super(e),this.states={},this.currentState=void 0,this.isUI=!0,this.autoLayout=!0,this.childrenUIs=[],this.childrenBoxes=[],this.childrenTexts=[],this.childrenInlines=[],this.parentUI=null,this.addEventListener("added",this._rebuildParentUI),this.addEventListener("removed",this._rebuildParentUI)}getClippingPlanes(){const e=[];if(this.parentUI){if(this.isBlock&&this.parentUI.getHiddenOverflow()){const t=this.parentUI.getHeight()/2-(this.parentUI.padding||0),r=this.parentUI.getWidth()/2-(this.parentUI.padding||0),s=[new n.Plane(new n.Vector3(0,1,0),t),new n.Plane(new n.Vector3(0,-1,0),t),new n.Plane(new n.Vector3(1,0,0),r),new n.Plane(new n.Vector3(-1,0,0),r)];s.forEach((e=>{e.applyMatrix4(this.parent.matrixWorld)})),e.push(...s)}this.parentUI.parentUI&&e.push(...this.parentUI.getClippingPlanes())}return e}getHighestParent(){return this.parentUI?this.parent.getHighestParent():this}_getProperty(e){return void 0===this[e]&&this.parentUI?this.parent._getProperty(e):void 0!==this[e]?this[e]:ce[e]}getFontSize(){return this._getProperty("fontSize")}getFontKerning(){return this._getProperty("fontKerning")}getLetterSpacing(){return this._getProperty("letterSpacing")}getFontTexture(){return void 0===this.fontTexture&&this.parentUI?this.parent._getProperty("fontTexture"):void 0!==this.fontTexture?this.fontTexture:ce.getDefaultTexture()}getFontFamily(){return this._getProperty("fontFamily")}getBreakOn(){return this._getProperty("breakOn")}getWhiteSpace(){return this._getProperty("whiteSpace")}getTextAlign(){return this._getProperty("textAlign")}getTextType(){return this._getProperty("textType")}getFontColor(){return this._getProperty("fontColor")}getFontSupersampling(){return this._getProperty("fontSupersampling")}getFontOpacity(){return this._getProperty("fontOpacity")}getFontPXRange(){return this._getProperty("fontPXRange")}getBorderRadius(){return this._getProperty("borderRadius")}getBorderWidth(){return this._getProperty("borderWidth")}getBorderColor(){return this._getProperty("borderColor")}getBorderOpacity(){return this._getProperty("borderOpacity")}getContainer(){return!this.threeOBJ&&this.parent?this.parent.getContainer():this.threeOBJ?this:ce.container}getParentsNumber(e){return e=e||0,this.parentUI?this.parentUI.getParentsNumber(e+1):e}getBackgroundOpacity(){return this.backgroundOpacity||0===this.backgroundOpacity?this.backgroundOpacity:ce.backgroundOpacity}getBackgroundColor(){return this.backgroundColor||ce.backgroundColor}getBackgroundTexture(){return this.backgroundTexture||ce.getDefaultTexture()}getAlignContent(){return this.alignContent||ce.alignContent}getAlignItems(){return this.alignItems||ce.alignItems}getContentDirection(){return this.contentDirection||ce.contentDirection}getJustifyContent(){return this.justifyContent||ce.justifyContent}getInterLine(){return void 0===this.interLine?ce.interLine:this.interLine}getOffset(){return void 0===this.offset?ce.offset:this.offset}getBackgroundSize(){return void 0===this.backgroundSize?ce.backgroundSize:this.backgroundSize}getHiddenOverflow(){return void 0===this.hiddenOverflow?ce.hiddenOverflow:this.hiddenOverflow}getBestFit(){return void 0===this.bestFit?ce.bestFit:this.bestFit}_rebuildChildrenLists(){this.childrenUIs=this.children.filter((e=>e.isUI)),this.childrenBoxes=this.children.filter((e=>e.isBoxComponent)),this.childrenInlines=this.children.filter((e=>e.isInline)),this.childrenTexts=this.children.filter((e=>e.isText))}_rebuildParentUI=()=>{this.parent&&this.parent.isUI?this.parentUI=this.parent:this.parentUI=null};add(){for(const e of Object.keys(arguments))arguments[e].isInline&&this.update(null,!0);const e=super.add(...arguments);return this._rebuildChildrenLists(),e}remove(){for(const e of Object.keys(arguments))arguments[e].isInline&&this.update(null,!0);const e=super.remove(...arguments);return this._rebuildChildrenLists(),e}update(e,t,r){he.requestUpdate(this,e,t,r)}onAfterUpdate(){}_updateFontFamily(e){this.fontFamily=e,this.traverse((e=>{e.isUI&&e.update(!0,!0,!1)})),this.getHighestParent().update(!1,!0,!1)}_updateFontTexture(e){this.fontTexture=e,this.getHighestParent().update(!1,!0,!1)}set(e){let t,r,s;if(he.register(this),e&&JSON.stringify(e)!==JSON.stringify({})){e.alignContent&&(e.alignItems=e.alignContent,e.textAlign||(e.textAlign=e.alignContent),console.warn("`alignContent` property has been deprecated, please rely on `alignItems` and `textAlign` instead."),delete e.alignContent),e.alignItems&&f(e.alignItems);for(const a of Object.keys(e))if(this[a]!=e[a])switch(a){case"content":case"fontSize":case"fontKerning":case"breakOn":case"whiteSpace":this.isText&&(t=!0),r=!0,this[a]=e[a];break;case"bestFit":this.isBlock&&(t=!0,r=!0),this[a]=e[a];break;case"width":case"height":case"padding":(this.isInlineBlock||this.isBlock&&"none"!=this.getBestFit())&&(t=!0),r=!0,this[a]=e[a];break;case"letterSpacing":case"interLine":this.isBlock&&"none"!=this.getBestFit()&&(t=!0),r=!0,this[a]=e[a];break;case"margin":case"contentDirection":case"justifyContent":case"alignContent":case"alignItems":case"textAlign":case"textType":r=!0,this[a]=e[a];break;case"fontColor":case"fontOpacity":case"fontSupersampling":case"offset":case"backgroundColor":case"backgroundOpacity":case"backgroundTexture":case"backgroundSize":case"borderRadius":case"borderWidth":case"borderColor":case"borderOpacity":s=!0,this[a]=e[a];break;case"hiddenOverflow":this[a]=e[a]}e.fontFamily&&oe.setFontFamily(this,e.fontFamily),e.fontTexture&&oe.setFontTexture(this,e.fontTexture),this.parentUI&&"none"!=this.parentUI.getBestFit()&&this.parentUI.update(!0,!0,!1),this.update(t,r,s),r&&this.getHighestParent().update(!1,!0,!1)}}setupState(e){this.states[e.state]={attributes:e.attributes,onSet:e.onSet}}setState(e){const t=this.states[e];t?e!==this.currentState&&(this.currentState=e,t.onSet&&t.onSet(),t.attributes&&this.set(t.attributes)):console.warn(`state "${e}" does not exist within this component:`,this.name)}clear(){this.traverse((e=>{he.disposeOf(e),e.material&&e.material.dispose(),e.geometry&&e.geometry.dispose()}))}}}function ue(e){return class extends e{constructor(e){super(e),this.textUniforms={u_texture:{value:this.getFontTexture()},u_color:{value:this.getFontColor()},u_opacity:{value:this.getFontOpacity()},u_pxRange:{value:this.getFontPXRange()},u_useRGSS:{value:this.getFontSupersampling()}},this.backgroundUniforms={u_texture:{value:this.getBackgroundTexture()},u_color:{value:this.getBackgroundColor()},u_opacity:{value:this.getBackgroundOpacity()},u_backgroundMapping:{value:this.getBackgroundSize()},u_borderWidth:{value:this.getBorderWidth()},u_borderColor:{value:this.getBorderColor()},u_borderRadiusTopLeft:{value:this.getBorderRadius()},u_borderRadiusTopRight:{value:this.getBorderRadius()},u_borderRadiusBottomRight:{value:this.getBorderRadius()},u_borderRadiusBottomLeft:{value:this.getBorderRadius()},u_borderOpacity:{value:this.getBorderOpacity()},u_size:{value:new n.Vector2(1,1)},u_tSize:{value:new n.Vector2(1,1)}}}updateBackgroundMaterial(){this.backgroundUniforms.u_texture.value=this.getBackgroundTexture(),this.backgroundUniforms.u_tSize.value.set(this.backgroundUniforms.u_texture.value.image.width,this.backgroundUniforms.u_texture.value.image.height),this.size&&this.backgroundUniforms.u_size.value.copy(this.size),this.backgroundUniforms.u_texture.value.isDefault?(this.backgroundUniforms.u_color.value=this.getBackgroundColor(),this.backgroundUniforms.u_opacity.value=this.getBackgroundOpacity()):(this.backgroundUniforms.u_color.value=this.backgroundColor||ce.backgroundWhiteColor,this.backgroundUniforms.u_opacity.value=this.backgroundOpacity||0===this.backgroundOpacity?this.backgroundOpacity:ce.backgroundOpaqueOpacity),this.backgroundUniforms.u_backgroundMapping.value=(()=>{switch(this.getBackgroundSize()){case"stretch":return 0;case"contain":return 1;case"cover":return 2}})();const e=this.getBorderRadius();this.backgroundUniforms.u_borderWidth.value=this.getBorderWidth(),this.backgroundUniforms.u_borderColor.value=this.getBorderColor(),this.backgroundUniforms.u_borderOpacity.value=this.getBorderOpacity(),Array.isArray(e)?(this.backgroundUniforms.u_borderRadiusTopLeft.value=e[0],this.backgroundUniforms.u_borderRadiusTopRight.value=e[1],this.backgroundUniforms.u_borderRadiusBottomRight.value=e[2],this.backgroundUniforms.u_borderRadiusBottomLeft.value=e[3]):(this.backgroundUniforms.u_borderRadiusTopLeft.value=e,this.backgroundUniforms.u_borderRadiusTopRight.value=e,this.backgroundUniforms.u_borderRadiusBottomRight.value=e,this.backgroundUniforms.u_borderRadiusBottomLeft.value=e)}updateTextMaterial(){this.textUniforms.u_texture.value=this.getFontTexture(),this.textUniforms.u_color.value=this.getFontColor(),this.textUniforms.u_opacity.value=this.getFontOpacity(),this.textUniforms.u_pxRange.value=this.getFontPXRange(),this.textUniforms.u_useRGSS.value=this.getFontSupersampling()}getBackgroundMaterial(){return this.backgroundMaterial&&this.backgroundUniforms||(this.backgroundMaterial=this._makeBackgroundMaterial()),this.backgroundMaterial}getFontMaterial(){return this.fontMaterial&&this.textUniforms||(this.fontMaterial=this._makeTextMaterial()),this.fontMaterial}_makeTextMaterial(){return new n.ShaderMaterial({uniforms:this.textUniforms,transparent:!0,clipping:!0,vertexShader:pe,fragmentShader:we,extensions:{derivatives:!0}})}_makeBackgroundMaterial(){return new n.ShaderMaterial({uniforms:this.backgroundUniforms,transparent:!0,clipping:!0,vertexShader:Ce,fragmentShader:ge,extensions:{derivatives:!0}})}updateClippingPlanes(e){const t=void 0!==e?e:this.getClippingPlanes();JSON.stringify(t)!==JSON.stringify(this.clippingPlanes)&&(this.clippingPlanes=t,this.fontMaterial&&(this.fontMaterial.clippingPlanes=this.clippingPlanes),this.backgroundMaterial&&(this.backgroundMaterial.clippingPlanes=this.clippingPlanes))}}}const pe="\nvarying vec2 vUv;\n\n#include <clipping_planes_pars_vertex>\n\nvoid main() {\n\n\tvUv = uv;\n\tvec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );\n\tgl_Position = projectionMatrix * mvPosition;\n\tgl_Position.z -= 0.00001;\n\n\t#include <clipping_planes_vertex>\n\n}\n",we="\n\nuniform sampler2D u_texture;\nuniform vec3 u_color;\nuniform float u_opacity;\nuniform float u_pxRange;\nuniform bool u_useRGSS;\n\nvarying vec2 vUv;\n\n#include <clipping_planes_pars_fragment>\n\n// functions from the original msdf repo:\n// https://github.com/Chlumsky/msdfgen#using-a-multi-channel-distance-field\n\nfloat median(float r, float g, float b) {\n\treturn max(min(r, g), min(max(r, g), b));\n}\n\nfloat screenPxRange() {\n\tvec2 unitRange = vec2(u_pxRange)/vec2(textureSize(u_texture, 0));\n\tvec2 screenTexSize = vec2(1.0)/fwidth(vUv);\n\treturn max(0.5*dot(unitRange, screenTexSize), 1.0);\n}\n\nfloat tap(vec2 offsetUV) {\n\tvec3 msd = texture( u_texture, offsetUV ).rgb;\n\tfloat sd = median(msd.r, msd.g, msd.b);\n\tfloat screenPxDistance = screenPxRange() * (sd - 0.5);\n\tfloat alpha = clamp(screenPxDistance + 0.5, 0.0, 1.0);\n\treturn alpha;\n}\n\nvoid main() {\n\n\tfloat alpha;\n\n\tif ( u_useRGSS ) {\n\n\t\t// shader-based supersampling based on https://bgolus.medium.com/sharper-mipmapping-using-shader-based-supersampling-ed7aadb47bec\n\t\t// per pixel partial derivatives\n\t\tvec2 dx = dFdx(vUv);\n\t\tvec2 dy = dFdy(vUv);\n\n\t\t// rotated grid uv offsets\n\t\tvec2 uvOffsets = vec2(0.125, 0.375);\n\t\tvec2 offsetUV = vec2(0.0, 0.0);\n\n\t\t// supersampled using 2x2 rotated grid\n\t\talpha = 0.0;\n\t\toffsetUV.xy = vUv + uvOffsets.x * dx + uvOffsets.y * dy;\n\t\talpha += tap(offsetUV);\n\t\toffsetUV.xy = vUv - uvOffsets.x * dx - uvOffsets.y * dy;\n\t\talpha += tap(offsetUV);\n\t\toffsetUV.xy = vUv + uvOffsets.y * dx - uvOffsets.x * dy;\n\t\talpha += tap(offsetUV);\n\t\toffsetUV.xy = vUv - uvOffsets.y * dx + uvOffsets.x * dy;\n\t\talpha += tap(offsetUV);\n\t\talpha *= 0.25;\n\n\t} else {\n\n\t\talpha = tap( vUv );\n\n\t}\n\n\n\t// apply the opacity\n\talpha *= u_opacity;\n\n\t// this is useful to avoid z-fighting when quads overlap because of kerning\n\tif ( alpha < 0.02) discard;\n\n\n\tgl_FragColor = vec4( u_color, alpha );\n\n\t#include <clipping_planes_fragment>\n\n}\n",Ce="\nvarying vec2 vUv;\n\n#include <clipping_planes_pars_vertex>\n\nvoid main() {\n\n\tvUv = uv;\n\tvec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );\n\tgl_Position = projectionMatrix * mvPosition;\n\n\t#include <clipping_planes_vertex>\n\n}\n",ge="\n\nuniform sampler2D u_texture;\nuniform vec3 u_color;\nuniform float u_opacity;\n\nuniform float u_borderRadiusTopLeft;\nuniform float u_borderRadiusTopRight;\nuniform float u_borderRadiusBottomLeft;\nuniform float u_borderRadiusBottomRight;\nuniform float u_borderWidth;\nuniform vec3 u_borderColor;\nuniform float u_borderOpacity;\nuniform vec2 u_size;\nuniform vec2 u_tSize;\nuniform int u_backgroundMapping;\n\nvarying vec2 vUv;\n\n#include <clipping_planes_pars_fragment>\n\nfloat getEdgeDist() {\n\tvec2 ndc = vec2( vUv.x * 2.0 - 1.0, vUv.y * 2.0 - 1.0 );\n\tvec2 planeSpaceCoord = vec2( u_size.x * 0.5 * ndc.x, u_size.y * 0.5 * ndc.y );\n\tvec2 corner = u_size * 0.5;\n\tvec2 offsetCorner = corner - abs( planeSpaceCoord );\n\tfloat innerRadDist = min( offsetCorner.x, offsetCorner.y ) * -1.0;\n\tif (vUv.x < 0.5 && vUv.y >= 0.5) {\n\t\tfloat roundedDist = length( max( abs( planeSpaceCoord ) - u_size * 0.5 + u_borderRadiusTopLeft, 0.0 ) ) - u_borderRadiusTopLeft;\n\t\tfloat s = step( innerRadDist * -1.0, u_borderRadiusTopLeft );\n\t\treturn mix( innerRadDist, roundedDist, s );\n\t}\n\tif (vUv.x >= 0.5 && vUv.y >= 0.5) {\n\t\tfloat roundedDist = length( max( abs( planeSpaceCoord ) - u_size * 0.5 + u_borderRadiusTopRight, 0.0 ) ) - u_borderRadiusTopRight;\n\t\tfloat s = step( innerRadDist * -1.0, u_borderRadiusTopRight );\n\t\treturn mix( innerRadDist, roundedDist, s );\n\t}\n\tif (vUv.x >= 0.5 && vUv.y < 0.5) {\n\t\tfloat roundedDist = length( max( abs( planeSpaceCoord ) - u_size * 0.5 + u_borderRadiusBottomRight, 0.0 ) ) - u_borderRadiusBottomRight;\n\t\tfloat s = step( innerRadDist * -1.0, u_borderRadiusBottomRight );\n\t\treturn mix( innerRadDist, roundedDist, s );\n\t}\n\tif (vUv.x < 0.5 && vUv.y < 0.5) {\n\t\tfloat roundedDist = length( max( abs( planeSpaceCoord ) - u_size * 0.5 + u_borderRadiusBottomLeft, 0.0 ) ) - u_borderRadiusBottomLeft;\n\t\tfloat s = step( innerRadDist * -1.0, u_borderRadiusBottomLeft );\n\t\treturn mix( innerRadDist, roundedDist, s );\n\t}\n}\n\nvec4 sampleTexture() {\n\tfloat textureRatio = u_tSize.x / u_tSize.y;\n\tfloat panelRatio = u_size.x / u_size.y;\n\tvec2 uv = vUv;\n\tif ( u_backgroundMapping == 1 ) { // contain\n\t\tif ( textureRatio < panelRatio ) { // repeat on X\n\t\t\tfloat newX = uv.x * ( panelRatio / textureRatio );\n\t\t\tnewX += 0.5 - 0.5 * ( panelRatio / textureRatio );\n\t\t\tuv.x = newX;\n\t\t} else { // repeat on Y\n\t\t\tfloat newY = uv.y * ( textureRatio / panelRatio );\n\t\t\tnewY += 0.5 - 0.5 * ( textureRatio / panelRatio );\n\t\t\tuv.y = newY;\n\t\t}\n\t} else if ( u_backgroundMapping == 2 ) { // cover\n\t\tif ( textureRatio < panelRatio ) { // stretch on Y\n\t\t\tfloat newY = uv.y * ( textureRatio / panelRatio );\n\t\t\tnewY += 0.5 - 0.5 * ( textureRatio / panelRatio );\n\t\t\tuv.y = newY;\n\t\t} else { // stretch on X\n\t\t\tfloat newX = uv.x * ( panelRatio / textureRatio );\n\t\t\tnewX += 0.5 - 0.5 * ( panelRatio / textureRatio );\n\t\t\tuv.x = newX;\n\t\t}\n\t}\n\treturn texture2D( u_texture, uv ).rgba;\n}\n\nvoid main() {\n\n\tfloat edgeDist = getEdgeDist();\n\tfloat change = fwidth( edgeDist );\n\n\tvec4 textureSample = sampleTexture();\n\tvec3 blendedColor = textureSample.rgb * u_color;\n\n\tfloat alpha = smoothstep( change, 0.0, edgeDist );\n\tfloat blendedOpacity = u_opacity * textureSample.a * alpha;\n\n\tvec4 frameColor = vec4( blendedColor, blendedOpacity );\n\n\tif ( u_borderWidth <= 0.0 ) {\n\t\tgl_FragColor = frameColor;\n\t} else {\n\t\tvec4 borderColor = vec4( u_borderColor, u_borderOpacity * alpha );\n\t\tfloat stp = smoothstep( edgeDist + change, edgeDist, u_borderWidth * -1.0 );\n\t\tgl_FragColor = mix( frameColor, borderColor, stp );\n\t}\n\n\t#include <clipping_planes_fragment>\n}\n";class fe extends n.Mesh{constructor(e){super(new n.PlaneGeometry,e),this.name="MeshUI-Frame"}}let me=null;function be(...e){if(!me)throw new Error("Cannot use mixins with Base null");let t=me;me=null;let r,s=e.length;for(;--s>=0;)r=e[s],t=r(t);return t}be.withBase=e=>(me=e,be);class xe extends(be.withBase(n.Object3D)(T,$,ue,de)){constructor(e){super(e),this.isBlock=!0,this.size=new n.Vector2(1,1),this.frame=new fe(this.getBackgroundMaterial()),this.frame.onBeforeRender=()=>{this.updateClippingPlanes&&this.updateClippingPlanes()},this.add(this.frame),this.set(e)}parseParams(){const e=this.getBestFit();"none"!=e&&this.childrenTexts.length?this.calculateBestFit(e):this.childrenTexts.forEach((e=>{e._fitFontSize=void 0}))}updateLayout(){const e=this.getWidth(),t=this.getHeight();e&&t?(this.size.set(e,t),this.frame.scale.set(e,t,1),this.frame&&this.updateBackgroundMaterial(),this.frame.renderOrder=this.getParentsNumber(),this.autoLayout&&this.setPosFromParentRecords(),this.childrenInlines.length&&this.computeInlinesPosition(),this.computeChildrenPosition(),this.parentUI&&(this.position.z=this.getOffset())):console.warn("Block got no dimension from its parameters or from children parameters")}updateInner(){this.parentUI&&(this.position.z=this.getOffset()),this.frame&&this.updateBackgroundMaterial()}}function ve(e){return class extends e{constructor(e){super(e),this.isInline=!0}}}function ye(e){let t,r,s,a=0;for(let i=0;i<e.length;++i){const n=e[i];if(n.isInterleavedBufferAttribute)return console.error("THREE.BufferGeometryUtils: .mergeBufferAttributes() failed. InterleavedBufferAttributes are not supported."),null;if(void 0===t&&(t=n.array.constructor),t!==n.array.constructor)return console.error("THREE.BufferGeometryUtils: .mergeBufferAttributes() failed. BufferAttribute.array must be of consistent array types across matching attributes."),null;if(void 0===r&&(r=n.itemSize),r!==n.itemSize)return console.error("THREE.BufferGeometryUtils: .mergeBufferAttributes() failed. BufferAttribute.itemSize must be consistent across matching attributes."),null;if(void 0===s&&(s=n.normalized),s!==n.normalized)return console.error("THREE.BufferGeometryUtils: .mergeBufferAttributes() failed. BufferAttribute.normalized must be consistent across matching attributes."),null;a+=n.array.length}const i=new t(a);let o=0;for(let t=0;t<e.length;++t)i.set(e[t].array,o),o+=e[t].array.length;return new n.BufferAttribute(i,r,s)}class ke extends n.PlaneGeometry{constructor(e,t){const r=e.glyph,s=e.fontSize;super(s,s),null===r.match(/\s/g)?(-1===t.info.charset.indexOf(r)&&console.error(`The character '${r}' is not included in the font characters set.`),this.mapUVs(t,r),this.transformGeometry(t,s,r,e)):(this.nullifyUVs(),this.scale(0,0,1),this.translate(0,s/2,0))}mapUVs(e,t){const r=e.chars.find((e=>e.char===t)),s=e.common,a=r.x/s.scaleW,i=(r.x+r.width)/s.scaleW,n=1-(r.y+r.height)/s.scaleH,o=1-r.y/s.scaleH,h=this.attributes.uv;for(let e=0;e<h.count;e++){let t=h.getX(e),r=h.getY(e);[t,r]=(()=>{switch(e){case 0:return[a,o];case 1:return[i,o];case 2:return[a,n];case 3:return[i,n]}})(),h.setXY(e,t,r)}}nullifyUVs(){const e=this.attributes.uv;for(let t=0;t<e.count;t++)e.setXY(t,0,0)}transformGeometry(e,t,r,s){const a=e.chars.find((e=>e.char===r)),i=e.common,n=a.height/i.lineHeight,o=a.width*n/a.height;this.scale(o,n,1),this.translate(s.width/2,s.height/2-s.anchor,0)}}const _e={getGlyphDimensions:function(e){const t=e.font,r=e.fontSize,s=e.glyph,a=r/t.info.size,i=t.chars.find((e=>e.char===s));let n=i?i.width*a:r/3,o=i?i.height*a:0;0===n&&(n=i?i.xadvance*a:r),0===o&&(o=.7*r),"\n"===s&&(n=0);const h=i?i.xadvance*a:n,c=i?i.xoffset*a:0;return{width:n,height:o,anchor:i?(i.yoffset+i.height-t.common.base)*r/t.common.lineHeight:0,xadvance:h,xoffset:c}},getGlyphPairKerning:function(e,t){const r=e._kernings;return r[t]?r[t]:0},buildText:function(){const e=[];this.inlines.forEach(((t,r)=>{e[r]=new ke(t,this.getFontFamily()),e[r].translate(t.offsetX,t.offsetY,0)}));const t=function(e,t=!1){const r=null!==e[0].index,s=new Set(Object.keys(e[0].attributes)),a=new Set(Object.keys(e[0].morphAttributes)),i={},o={},h=e[0].morphTargetsRelative,c=new n.BufferGeometry;let l=0;for(let n=0;n<e.length;++n){const d=e[n];let u=0;if(r!==(null!==d.index))return console.error("THREE.BufferGeometryUtils: .mergeBufferGeometries() failed with geometry at index "+n+". All geometries must have compatible attributes; make sure index attribute exists among all geometries, or in none of them."),null;for(const e in d.attributes){if(!s.has(e))return console.error("THREE.BufferGeometryUtils: .mergeBufferGeometries() failed with geometry at index "+n+'. All geometries must have compatible attributes; make sure "'+e+'" attribute exists among all geometries, or in none of them.'),null;void 0===i[e]&&(i[e]=[]),i[e].push(d.attributes[e]),u++}if(u!==s.size)return console.error("THREE.BufferGeometryUtils: .mergeBufferGeometries() failed with geometry at index "+n+". Make sure all geometries have the same number of attributes."),null;if(h!==d.morphTargetsRelative)return console.error("THREE.BufferGeometryUtils: .mergeBufferGeometries() failed with geometry at index "+n+". .morphTargetsRelative must be consistent throughout all geometries."),null;for(const e in d.morphAttributes){if(!a.has(e))return console.error("THREE.BufferGeometryUtils: .mergeBufferGeometries() failed with geometry at index "+n+". .morphAttributes must be consistent throughout all geometries."),null;void 0===o[e]&&(o[e]=[]),o[e].push(d.morphAttributes[e])}if(c.userData.mergedUserData=c.userData.mergedUserData||[],c.userData.mergedUserData.push(d.userData),t){let e;if(r)e=d.index.count;else{if(void 0===d.attributes.position)return console.error("THREE.BufferGeometryUtils: .mergeBufferGeometries() failed with geometry at index "+n+". The geometry must have either an index or a position attribute"),null;e=d.attributes.position.count}c.addGroup(l,e,n),l+=e}}if(r){let t=0;const r=[];for(let s=0;s<e.length;++s){const a=e[s].index;for(let e=0;e<a.count;++e)r.push(a.getX(e)+t);t+=e[s].attributes.position.count}c.setIndex(r)}for(const e in i){const t=ye(i[e]);if(!t)return console.error("THREE.BufferGeometryUtils: .mergeBufferGeometries() failed while trying to merge the "+e+" attribute."),null;c.setAttribute(e,t)}for(const e in o){const t=o[e][0].length;if(0===t)break;c.morphAttributes=c.morphAttributes||{},c.morphAttributes[e]=[];for(let r=0;r<t;++r){const t=[];for(let s=0;s<o[e].length;++s)t.push(o[e][s][r]);const s=ye(t);if(!s)return console.error("THREE.BufferGeometryUtils: .mergeBufferGeometries() failed while trying to merge the "+e+" morphAttribute."),null;c.morphAttributes[e].push(s)}}return c}(e);return new n.Mesh(t,this.getFontMaterial())}};function Ue(e){return class extends e{createText(){const e=this,t=(()=>{if("MSDF"===this.getTextType())return _e.buildText.call(this);console.warn(`'${this.getTextType()}' is not a supported text type.\nSee https://github.com/felixmariotto/three-mesh-ui/wiki/Using-a-custom-text-type`)})();return t.renderOrder=1/0,t.onBeforeRender=function(){e.updateClippingPlanes&&e.updateClippingPlanes()},t}getGlyphDimensions(e){if("MSDF"===e.textType)return _e.getGlyphDimensions(e);console.warn(`'${e.textType}' is not a supported text type.\nSee https://github.com/felixmariotto/three-mesh-ui/wiki/Using-a-custom-text-type`)}getGlyphPairKerning(e,t,r){if("MSDF"===e)return _e.getGlyphPairKerning(t,r);console.warn(`'${e}' is not a supported text type.\nSee https://github.com/felixmariotto/three-mesh-ui/wiki/Using-a-custom-text-type`)}}}const Se=function e(t){t.children.forEach((r=>{r.children.length>0&&e(r),t.remove(r),he.disposeOf(r),r.material&&r.material.dispose(),r.geometry&&r.geometry.dispose()})),t.children=[]};class Re extends(be.withBase(n.Object3D)(ve,Ue,ue,de)){constructor(e){super(e),this.isText=!0,this.set(e)}parseParams(){this.calculateInlines(this._fitFontSize||this.getFontSize())}updateLayout(){Se(this),this.inlines&&(this.textContent=this.createText(),this.updateTextMaterial(),this.add(this.textContent)),this.position.z=this.getOffset()}updateInner(){this.position.z=this.getOffset(),this.textContent&&this.updateTextMaterial()}calculateInlines(e){const t=this.content,r=this.getFontFamily(),s=this.getBreakOn(),a=this.getTextType(),i=this.getWhiteSpace();if(!r||"string"==typeof r)return void(oe.getFontOf(this)||console.warn("no font was found"));if(!this.content)return void(this.inlines=null);if(!a)return void console.error("You must provide a 'textType' attribute so three-mesh-ui knows how to render your text.\n See https://github.com/felixmariotto/three-mesh-ui/wiki/Using-a-custom-text-type");const n=z(t,i),o=Array.from?Array.from(n):String(n).split(""),h=e/r.info.size,c=r.common.lineHeight*h,l=r.common.base*h,d=o.map((t=>{const n=this.getGlyphDimensions({textType:a,glyph:t,font:r,fontSize:e});let o=null;return i!==O&&(s.includes(t)||t.match(/\s/g))&&(o="possible"),t.match(/\n/g)&&(o=H(i)),{height:n.height,width:n.width,anchor:n.anchor,xadvance:n.xadvance,xoffset:n.xoffset,lineBreak:o,glyph:t,fontSize:e,lineHeight:c,lineBase:l}}));if("none"!==this.getFontKerning())for(let t=1;t<d.length;t++){const s=d[t],i=d[t-1].glyph+d[t].glyph,n=this.getGlyphPairKerning(a,r,i);s.kerning=n*(e/r.info.size)}this.inlines=d}}class Te extends(be.withBase(n.Object3D)(ve,T,$,ue,de)){constructor(e){super(e),this.isInlineBlock=!0,this.size=new n.Vector2(1,1),this.frame=new fe(this.getBackgroundMaterial()),this.frame.onBeforeRender=()=>{this.updateClippingPlanes&&this.updateClippingPlanes()},this.add(this.frame),this.set(e)}parseParams(){this.width||console.warn("inlineBlock has no width. Set to 0.3 by default"),this.height||console.warn("inlineBlock has no height. Set to 0.3 by default"),this.inlines=[{height:this.height||.3,width:this.width||.3,anchor:0,lineBreak:"possible"}]}updateLayout(){const e=this.getWidth(),t=this.getHeight();if(this.inlines){const e=this.inlines[0];this.position.set(e.width/2,e.height/2,0),this.position.x+=e.offsetX,this.position.y+=e.offsetY}this.size.set(e,t),this.frame.scale.set(e,t,1),this.frame&&this.updateBackgroundMaterial(),this.frame.renderOrder=this.getParentsNumber(),this.childrenInlines.length&&this.computeInlinesPosition(),this.computeChildrenPosition(),this.position.z=this.getOffset()}updateInner(){this.position.z=this.getOffset(),this.frame&&this.updateBackgroundMaterial()}}const Ie=[[[{width:.1,chars:[{lowerCase:"a",upperCase:"A"}]},{width:.1,chars:[{lowerCase:"z",upperCase:"Z"}]},{width:.1,chars:[{lowerCase:"e",upperCase:"E"}]},{width:.1,chars:[{lowerCase:"r",upperCase:"R"}]},{width:.1,chars:[{lowerCase:"t",upperCase:"T"}]},{width:.1,chars:[{lowerCase:"y",upperCase:"Y"}]},{width:.1,chars:[{lowerCase:"u",upperCase:"U"}]},{width:.1,chars:[{lowerCase:"i",upperCase:"I"}]},{width:.1,chars:[{lowerCase:"o",upperCase:"O"}]},{width:.1,chars:[{lowerCase:"p",upperCase:"P"}]}],[{width:.1,chars:[{lowerCase:"q",upperCase:"Q"}]},{width:.1,chars:[{lowerCase:"s",upperCase:"S"}]},{width:.1,chars:[{lowerCase:"d",upperCase:"D"}]},{width:.1,chars:[{lowerCase:"f",upperCase:"F"}]},{width:.1,chars:[{lowerCase:"g",upperCase:"G"}]},{width:.1,chars:[{lowerCase:"h",upperCase:"H"}]},{width:.1,chars:[{lowerCase:"j",upperCase:"J"}]},{width:.1,chars:[{lowerCase:"k",upperCase:"K"}]},{width:.1,chars:[{lowerCase:"l",upperCase:"L"}]},{width:.1,chars:[{lowerCase:"m",upperCase:"M"}]}],[{width:.2,command:"shift",chars:[{icon:"shift"}]},{width:.1,chars:[{lowerCase:"w",upperCase:"W"}]},{width:.1,chars:[{lowerCase:"x",upperCase:"X"}]},{width:.1,chars:[{lowerCase:"c",upperCase:"C"}]},{width:.1,chars:[{lowerCase:"v",upperCase:"V"}]},{width:.1,chars:[{lowerCase:"b",upperCase:"B"}]},{width:.1,chars:[{lowerCase:"n",upperCase:"N"}]},{width:.2,command:"backspace",chars:[{icon:"backspace"}]}],[{width:.2,command:"switch",chars:[{lowerCase:".?12"}]},{width:.1,chars:[{lowerCase:","}]},{width:.4,command:"space",chars:[{icon:"space"}]},{width:.1,chars:[{lowerCase:"."}]},{width:.2,command:"enter",chars:[{icon:"enter"}]}]],[[{width:.1,chars:[{lowerCase:"1"}]},{width:.1,chars:[{lowerCase:"2"}]},{width:.1,chars:[{lowerCase:"3"}]},{width:.1,chars:[{lowerCase:"4"}]},{width:.1,chars:[{lowerCase:"5"}]},{width:.1,chars:[{lowerCase:"6"}]},{width:.1,chars:[{lowerCase:"7"}]},{width:.1,chars:[{lowerCase:"8"}]},{width:.1,chars:[{lowerCase:"9"}]},{width:.1,chars:[{lowerCase:"0"}]}],[{width:.1,chars:[{lowerCase:"@"}]},{width:.1,chars:[{lowerCase:"#"}]},{width:.1,chars:[{lowerCase:"|"}]},{width:.1,chars:[{lowerCase:"_"}]},{width:.1,chars:[{lowerCase:"&"}]},{width:.1,chars:[{lowerCase:"-"}]},{width:.1,chars:[{lowerCase:"+"}]},{width:.1,chars:[{lowerCase:"("}]},{width:.1,chars:[{lowerCase:")"}]},{width:.1,chars:[{lowerCase:"/"}]}],[{width:.1,chars:[{lowerCase:"="}]},{width:.1,chars:[{lowerCase:"*"}]},{width:.1,chars:[{lowerCase:'"'}]},{width:.1,chars:[{lowerCase:"'"}]},{width:.1,chars:[{lowerCase:":"}]},{width:.1,chars:[{lowerCase:";"}]},{width:.1,chars:[{lowerCase:"!"}]},{width:.1,chars:[{lowerCase:"?"}]},{width:.2,command:"backspace",chars:[{icon:"backspace"}]}],[{width:.2,command:"switch",chars:[{lowerCase:".?12"}]},{width:.1,chars:[{lowerCase:","}]},{width:.4,command:"space",chars:[{icon:"space"}]},{width:.1,chars:[{lowerCase:"."}]},{width:.2,command:"enter",chars:[{icon:"enter"}]}]]],Be=[[[{width:.1,chars:[{lowerCase:"q",upperCase:"Q"}]},{width:.1,chars:[{lowerCase:"w",upperCase:"W"}]},{width:.1,chars:[{lowerCase:"e",upperCase:"E"}]},{width:.1,chars:[{lowerCase:"r",upperCase:"R"}]},{width:.1,chars:[{lowerCase:"t",upperCase:"T"}]},{width:.1,chars:[{lowerCase:"y",upperCase:"Y"}]},{width:.1,chars:[{lowerCase:"u",upperCase:"U"}]},{width:.1,chars:[{lowerCase:"i",upperCase:"I"}]},{width:.1,chars:[{lowerCase:"o",upperCase:"O"}]},{width:.1,chars:[{lowerCase:"p",upperCase:"P"}]}],[{width:.1,chars:[{lowerCase:"a",upperCase:"A"}]},{width:.1,chars:[{lowerCase:"s",upperCase:"S"}]},{width:.1,chars:[{lowerCase:"d",upperCase:"D"}]},{width:.1,chars:[{lowerCase:"f",upperCase:"F"}]},{width:.1,chars:[{lowerCase:"g",upperCase:"G"}]},{width:.1,chars:[{lowerCase:"h",upperCase:"H"}]},{width:.1,chars:[{lowerCase:"j",upperCase:"J"}]},{width:.1,chars:[{lowerCase:"k",upperCase:"K"}]},{width:.1,chars:[{lowerCase:"l",upperCase:"L"}]}],[{width:.15,command:"shift",chars:[{icon:"shift"}]},{width:.1,chars:[{lowerCase:"z",upperCase:"Z"}]},{width:.1,chars:[{lowerCase:"x",upperCase:"X"}]},{width:.1,chars:[{lowerCase:"c",upperCase:"C"}]},{width:.1,chars:[{lowerCase:"v",upperCase:"V"}]},{width:.1,chars:[{lowerCase:"b",upperCase:"B"}]},{width:.1,chars:[{lowerCase:"n",upperCase:"N"}]},{width:.1,chars:[{lowerCase:"m",upperCase:"M"}]},{width:.15,command:"backspace",chars:[{icon:"backspace"}]}],[{width:.2,command:"switch",chars:[{lowerCase:".?12"}]},{width:.1,chars:[{lowerCase:","}]},{width:.4,command:"space",chars:[{icon:"space"}]},{width:.1,chars:[{lowerCase:"."}]},{width:.2,command:"enter",chars:[{icon:"enter"}]}]],[[{width:.1,chars:[{lowerCase:"1"}]},{width:.1,chars:[{lowerCase:"2"}]},{width:.1,chars:[{lowerCase:"3"}]},{width:.1,chars:[{lowerCase:"4"}]},{width:.1,chars:[{lowerCase:"5"}]},{width:.1,chars:[{lowerCase:"6"}]},{width:.1,chars:[{lowerCase:"7"}]},{width:.1,chars:[{lowerCase:"8"}]},{width:.1,chars:[{lowerCase:"9"}]},{width:.1,chars:[{lowerCase:"0"}]}],[{width:.1,chars:[{lowerCase:"@"}]},{width:.1,chars:[{lowerCase:"#"}]},{width:.1,chars:[{lowerCase:"|"}]},{width:.1,chars:[{lowerCase:"_"}]},{width:.1,chars:[{lowerCase:"&"}]},{width:.1,chars:[{lowerCase:"-"}]},{width:.1,chars:[{lowerCase:"+"}]},{width:.1,chars:[{lowerCase:"("}]},{width:.1,chars:[{lowerCase:")"}]},{width:.1,chars:[{lowerCase:"/"}]}],[{width:.1,chars:[{lowerCase:"="}]},{width:.1,chars:[{lowerCase:"*"}]},{width:.1,chars:[{lowerCase:'"'}]},{width:.1,chars:[{lowerCase:"'"}]},{width:.1,chars:[{lowerCase:":"}]},{width:.1,chars:[{lowerCase:";"}]},{width:.1,chars:[{lowerCase:"!"}]},{width:.1,chars:[{lowerCase:"?"}]},{width:.2,command:"backspace",chars:[{icon:"backspace"}]}],[{width:.2,command:"switch",chars:[{lowerCase:".?12"}]},{width:.1,chars:[{lowerCase:","}]},{width:.4,command:"space",chars:[{icon:"space"}]},{width:.1,chars:[{lowerCase:"."}]},{width:.2,command:"enter",chars:[{icon:"enter"}]}]]],Oe=[[[{width:1/12,chars:[{lowerCase:"й",upperCase:"Й"},{lowerCase:"q",upperCase:"Q"}]},{width:1/12,chars:[{lowerCase:"ц",upperCase:"Ц"},{lowerCase:"w",upperCase:"W"}]},{width:1/12,chars:[{lowerCase:"у",upperCase:"У"},{lowerCase:"e",upperCase:"E"}]},{width:1/12,chars:[{lowerCase:"к",upperCase:"К"},{lowerCase:"r",upperCase:"R"}]},{width:1/12,chars:[{lowerCase:"е",upperCase:"Е"},{lowerCase:"t",upperCase:"T"}]},{width:1/12,chars:[{lowerCase:"н",upperCase:"Н"},{lowerCase:"y",upperCase:"Y"}]},{width:1/12,chars:[{lowerCase:"г",upperCase:"Г"},{lowerCase:"u",upperCase:"U"}]},{width:1/12,chars:[{lowerCase:"ш",upperCase:"Ш"},{lowerCase:"i",upperCase:"I"}]},{width:1/12,chars:[{lowerCase:"щ",upperCase:"Щ"},{lowerCase:"o",upperCase:"O"}]},{width:1/12,chars:[{lowerCase:"з",upperCase:"З"},{lowerCase:"p",upperCase:"P"}]},{width:1/12,chars:[{lowerCase:"х",upperCase:"Х"},{lowerCase:"{",upperCase:"["}]},{width:1/12,chars:[{lowerCase:"ъ",upperCase:"Ъ"},{lowerCase:"}",upperCase:"]"}]}],[{width:1/12,chars:[{lowerCase:"ф",upperCase:"Ф"},{lowerCase:"a",upperCase:"A"}]},{width:1/12,chars:[{lowerCase:"ы",upperCase:"Ы"},{lowerCase:"s",upperCase:"S"}]},{width:1/12,chars:[{lowerCase:"в",upperCase:"В"},{lowerCase:"d",upperCase:"D"}]},{width:1/12,chars:[{lowerCase:"а",upperCase:"А"},{lowerCase:"f",upperCase:"F"}]},{width:1/12,chars:[{lowerCase:"п",upperCase:"П"},{lowerCase:"g",upperCase:"G"}]},{width:1/12,chars:[{lowerCase:"р",upperCase:"Р"},{lowerCase:"h",upperCase:"H"}]},{width:1/12,chars:[{lowerCase:"о",upperCase:"О"},{lowerCase:"j",upperCase:"J"}]},{width:1/12,chars:[{lowerCase:"л",upperCase:"Л"},{lowerCase:"k",upperCase:"K"}]},{width:1/12,chars:[{lowerCase:"д",upperCase:"Д"},{lowerCase:"l",upperCase:"L"}]},{width:1/12,chars:[{lowerCase:"ж",upperCase:"Ж"},{lowerCase:":",upperCase:";"}]},{width:1/12,chars:[{lowerCase:"э",upperCase:"Э"},{lowerCase:'"',upperCase:"'"}]},{width:1/12,chars:[{lowerCase:"ё",upperCase:"Ё"},{lowerCase:"|",upperCase:"\\"}]}],[{width:.125,command:"shift",chars:[{icon:"shift"}]},{width:1/12,chars:[{lowerCase:"я",upperCase:"Я"},{lowerCase:"z",upperCase:"Z"}]},{width:1/12,chars:[{lowerCase:"ч",upperCase:"Ч"},{lowerCase:"x",upperCase:"X"}]},{width:1/12,chars:[{lowerCase:"с",upperCase:"С"},{lowerCase:"c",upperCase:"C"}]},{width:1/12,chars:[{lowerCase:"м",upperCase:"М"},{lowerCase:"v",upperCase:"V"}]},{width:1/12,chars:[{lowerCase:"и",upperCase:"И"},{lowerCase:"b",upperCase:"B"}]},{width:1/12,chars:[{lowerCase:"т",upperCase:"Т"},{lowerCase:"n",upperCase:"N"}]},{width:1/12,chars:[{lowerCase:"ь",upperCase:"Ь"},{lowerCase:"m",upperCase:"M"}]},{width:1/12,chars:[{lowerCase:"б",upperCase:"Б"},{lowerCase:",",upperCase:""}]},{width:1/12,chars:[{lowerCase:"ю",upperCase:"Ю"},{lowerCase:".",upperCase:""}]},{width:.125,command:"backspace",chars:[{icon:"backspace"}]}],[{width:.15,command:"switch-set",chars:[{lowerCase:"eng"}]},{width:.15,command:"switch",chars:[{lowerCase:".?12"}]},{width:.4,command:"space",chars:[{icon:"space"}]},{width:.1,chars:[{lowerCase:"?"}]},{width:.2,command:"enter",chars:[{icon:"enter"}]}]],[[{width:.1,chars:[{lowerCase:"1"}]},{width:.1,chars:[{lowerCase:"2"}]},{width:.1,chars:[{lowerCase:"3"}]},{width:.1,chars:[{lowerCase:"4"}]},{width:.1,chars:[{lowerCase:"5"}]},{width:.1,chars:[{lowerCase:"6"}]},{width:.1,chars:[{lowerCase:"7"}]},{width:.1,chars:[{lowe