r3f-performance 0.1.2 → 0.1.4

package/README.md

@@ -9,11 +9,14 @@ A lightweight and easy-to-use tool to monitor the performance of your
   <tr>
     <td>Add the <code>&lt;PerformanceMonitor /&gt;</code> component anywhere in your R3F Canvas.</td>
     <td>
-        <img src="https://bf3xu0otcy.ufs.sh/f/lSBP1EY5xRSnLHNlxKuvoRAdugXS39mBlIzpHEcwjKqeLFNJ" alt="R3F Performance Monitor" />
-    </td>
+<a href="https://codesandbox.io/p/sandbox/3sqpy4">
+  <img src="https://bf3xu0otcy.ufs.sh/f/lSBP1EY5xRSnLHNlxKuvoRAdugXS39mBlIzpHEcwjKqeLFNJ" /></td>
+</a>
   </tr>
 </table>
 
+**[View Example](https://codesandbox.io/p/sandbox/3sqpy4)**
+
 ## Features
 
 - FPS and render performance monitoring
@@ -70,6 +73,8 @@ position?: Sets the position of the panel. Options: 'top-right', 'top-left', 'bo
 
 ## Usage
 
+**[View Example](https://codesandbox.io/p/sandbox/3sqpy4)**
+
 ```jsx
 import { Canvas } from "@react-three/fiber";
 import { PerformanceMonitor } from "r3f-performance";

package/dist/components/PerfMonitor.d.ts

@@ -8,5 +8,5 @@ export declare const colorsGraph: {
     memory: string;
     vram: string;
 };
-export declare const PerformanceMonitor: FC<PerfPropsGui>;
+export declare const PerfMonitor: FC<PerfPropsGui>;
 //# sourceMappingURL=PerfMonitor.d.ts.map

package/dist/components/PerfMonitor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PerfMonitor.d.ts","sourceRoot":"","sources":["../../src/components/PerfMonitor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,EAAoB,MAAM,OAAO,CAAC;AAMlD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AA2B7C,eAAO,MAAM,WAAW;;;;;;;CAOvB,CAAC;AAyRF,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,YAAY,CA4D/C,CAAC"}
+{"version":3,"file":"PerfMonitor.d.ts","sourceRoot":"","sources":["../../src/components/PerfMonitor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,EAAoB,MAAM,OAAO,CAAC;AAMlD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AA2B7C,eAAO,MAAM,WAAW;;;;;;;CAOvB,CAAC;AAyRF,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,YAAY,CA4DxC,CAAC"}

package/dist/components/Program.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Program.d.ts","sourceRoot":"","sources":["../../src/components/Program.tsx"],"names":[],"mappings":"AAmYA,OAAO,EAAE,KAAK,EAAE,EAAuB,MAAM,OAAO,CAAC;AAErD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAkZ1C,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,SAAS,CAiBpC,CAAC"}
+{"version":3,"file":"Program.d.ts","sourceRoot":"","sources":["../../src/components/Program.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,EAAuB,MAAM,OAAO,CAAC;AAErD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAkZ1C,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,SAAS,CAiBpC,CAAC"}

package/dist/index.cjs

@@ -1,2 +1,34 @@
 (function(){"use strict";try{if(typeof document<"u"){var i=document.createElement("style");i.appendChild(document.createTextNode('._perfS_ans5i_1{position:fixed;z-index:9999;font-family:Roboto Mono,-apple-system,BlinkMacSystemFont,monospace;background-color:#000c;color:#fff;padding:6px 0 6px 6px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-user-select:none;user-select:none;display:flex;flex-direction:column}._containerHeight_ans5i_16{min-height:110px}._topLeft_ans5i_21{top:0;left:0}._topRight_ans5i_22{top:0;right:0}._bottomLeft_ans5i_23{bottom:0;left:0}._bottomRight_ans5i_24{bottom:0;right:0}._minimal_ans5i_26{background-color:#242424d9}._perfIContainer_ans5i_30{display:flex;flex-wrap:wrap;gap:5px 10px}._perfIContainer_ans5i_30{display:flex;flex-wrap:wrap;gap:6px 12px;width:100%;padding-right:6px;box-sizing:border-box}._perfI_ans5i_30{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;width:55px;height:auto;position:relative;margin-right:4px}._perfI_ans5i_30 small{font-size:12px;color:#e0e0e0;font-weight:500;padding-left:0;margin-bottom:2px;white-space:nowrap}._perfB_ans5i_69{position:relative;bottom:auto;right:auto;text-align:left;font-size:8px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:#65c5bc;width:100%;opacity:.9}._toggleContainer_ans5i_83{display:flex;justify-content:flex-end;padding-right:4px}._toggle_ans5i_83{cursor:pointer;font-size:10px;background-color:#ffffff1a;color:#fff;padding:4px 8px;border-radius:2px;margin-left:4px;transition:all .2s}._toggle_ans5i_83:hover{background-color:#fff3;color:#fff}._activeTab_ans5i_105{background-color:#65c5bc4d;color:#fff}._containerScroll_ans5i_110{max-height:50vh;overflow-y:auto}._programGeo_ans5i_115{margin-bottom:2px;pointer-events:auto}._programHeader_ans5i_120{display:flex;align-items:center;justify-content:space-between;background-color:#ffffff0f;padding:6px 8px;border-radius:4px;cursor:pointer;transition:background-color .2s;min-height:24px;border:1px solid transparent}._programHeader_ans5i_120:hover{background-color:#ffffff1a;border-color:#ffffff1a}._programHeader_ans5i_120 *{cursor:pointer!important}._programHeader_ans5i_120 small{font-size:9px}._programHeader_ans5i_120>b{margin-right:4px;cursor:pointer}._headerLeft_ans5i_149{display:flex;align-items:center;flex:1;overflow:hidden}._programTitle_ans5i_156{font-weight:700;font-size:12px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:10px}._toggleArrow_ans5i_166{font-size:10px;margin-right:8px;color:#888;width:12px;text-align:center;transition:transform .2s}._toggleVisible_ans5i_175{pointer-events:auto;justify-content:center;cursor:pointer;font-size:12px;background-color:#292b2d;width:auto;margin:0;color:#919191;text-align:center;display:inline-block;vertical-align:middle;padding:4px 6px}._toggleVisible_ans5i_175:hover{background-color:#1f1f1f}._toggleVisible_ans5i_175 svg{width:12px;height:12px;float:left}._programConsole_ans5i_200{font-weight:700;letter-spacing:.02em;background-color:#292b2d;color:#d3d3d3;overflow:hidden;text-overflow:ellipsis;cursor:pointer;display:block;font-size:11px;padding:5px;margin:4px auto;border:none;width:100%;text-align:center}._programsContainer_ans5i_218{margin-top:0}._headerRight_ans5i_222{display:flex;align-items:center;gap:6px}._metricBadge_ans5i_228{display:flex;align-items:center;background-color:#0000004d;padding:2px 6px;border-radius:3px;font-size:10px;color:#aaa;white-space:nowrap}._metricBadge_ans5i_228 b{color:#4fd1c5;margin-right:4px;font-weight:600;font-size:11px}._programsULHeader_ans5i_246{display:flex;position:relative;font-weight:700;color:#fff;line-height:14px;margin:4px 0}._programsULHeader_ans5i_246 svg{margin-right:4px;display:inline-block}._programsUL_ans5i_246{display:block;position:relative;padding-left:10px;margin:6px;list-style:none}._programsUL_ans5i_246 img{max-height:60px;max-width:100%;margin:6px auto;display:block}._programsUL_ans5i_246:after{content:"";position:absolute;left:0;top:0;width:1px;height:100%;background-color:gray;transform:translate(-50%);max-height:50vh;overflow-y:auto}._programsUL_ans5i_246 li{border-bottom:1px solid #313131;display:block;padding:4px;margin:0;line-height:1}._programsUL_ans5i_246 b{font-weight:700}._programsUL_ans5i_246 small{text-align:revert;letter-spacing:1px;font-size:10px;font-weight:500;margin-left:2px;color:#65c5bc}._programsGeoLi_ans5i_309{display:flex!important;height:auto!important}._programsGeoLi_ans5i_309 span{display:block;position:relative}._programsGeoLi_ans5i_309 b{padding-left:12px}._graph_ans5i_324{width:100%;height:66px;overflow:hidden;position:absolute;pointer-events:none;display:flex;top:0;left:0;justify-content:center;z-index:0}._graphpc_ans5i_336{text-align:center;font-weight:700;font-size:12px;line-height:12px;display:flex;justify-content:center;align-items:center;vertical-align:middle;color:#f1f1f1;padding:7px;width:100%;background-color:#242425cc;z-index:1;position:absolute;height:100%}._visibilityBtn_ans5i_354{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:3px;margin-left:4px;color:#666;background:transparent;transition:all .2s}._visibilityBtn_ans5i_354:hover{background-color:#fff3;color:#fff}._visibilityBtn_ans5i_354._active_ans5i_105{color:#fff}')),document.head.appendChild(i)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),j=require("react"),F=require("@react-three/fiber"),be=require("react-dom/client"),he=require("three"),_e=require("zustand/traditional"),Ee=require("zustand/shallow"),Ce=require("eventemitter3");function Me(r){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const s in r)if(s!=="default"){const i=Object.getOwnPropertyDescriptor(r,s);Object.defineProperty(e,s,i.get?i:{enumerable:!0,get:()=>r[s]})}}return e.default=r,Object.freeze(e)}const E=Me(he),ge=j.forwardRef(({portal:r,className:e,children:s,name:i,...m},o)=>{const a=F.useThree(d=>d.gl),c=j.useRef(null),x=j.useRef(null),n=(r==null?void 0:r.current)!=null?r.current:a.domElement.parentNode;return j.useLayoutEffect(()=>{if(!c.current||!n)return;const d=document.createElement("div"),p=x.current=be.createRoot(d);return n.appendChild(d),()=>{p.unmount(),x.current=null,n.removeChild(d)}},[n]),j.useLayoutEffect(()=>{const d=x.current;d&&d.render(t.jsx("div",{ref:o,className:e,children:s}))}),t.jsx("group",{name:i,...m,ref:c})});ge.displayName="HtmlMinimal";const Y=_e.createWithEqualityFn((r,e)=>{function s(){var v;const{accumulated:i,startTime:m,infos:o,estimatedMemory:a}=e(),c=(v=e().log)==null?void 0:v.maxMemory,{totalFrames:x,log:n,gl:d,max:p}=i,f={calls:d.calls/x,triangles:d.triangles/x,points:d.points/x,lines:d.lines/x},h={gpu:n.gpu/x,cpu:n.cpu/x,mem:n.mem/x,fps:n.fps/x};return{sessionTime:(window.performance.now()-m)/1e3,infos:o,memory:a,log:h,gl:f,max:p,maxMemory:c,totalFrames:x}}return{log:null,paused:!1,triggerProgramsUpdate:0,startTime:0,customData:0,fpsLimit:60,overclockingFps:!1,estimatedMemory:{vram:0,tex:0,geo:0,ram:0},accumulated:{totalFrames:0,gl:{calls:0,triangles:0,points:0,lines:0,counts:0},log:{gpu:0,cpu:0,mem:0,fps:0},max:{gl:{calls:0,triangles:0,points:0,lines:0,counts:0},log:{gpu:0,cpu:0,mem:0,fps:0}}},chart:{data:{fps:[],cpu:[],gpu:[],mem:[]},circularId:0},gl:void 0,objectWithMaterials:null,scene:void 0,programs:new Map,sceneLength:void 0,tab:"infos",getReport:s}}),M=r=>Y(r,Ee.shallow);Object.assign(M,Y);const{getState:S,setState:C}=Y,T={value:0,fpsLimit:60,isOverLimit:0},O=r=>(r==null?void 0:r.reduce((e,s)=>e+s,0))/r.length;class Ie{constructor(e={}){this.names=[""],this.finished=[],this.paused=!1,this.overClock=!1,this.queryHasResult=!1,this.queryCreated=!1,this.isWebGL2=!0,this.memAccums=[],this.gpuAccums=[],this.activeAccums=[],this.logsAccums={mem:[],gpu:[],cpu:[],fps:[],fpsFixed:[]},this.fpsChart=[],this.gpuChart=[],this.cpuChart=[],this.memChart=[],this.paramLogger=()=>{},this.glFinish=()=>{},this.chartLogger=()=>{},this.chartLen=60,this.logsPerSecond=10,this.maxMemory=1500,this.chartHz=10,this.startCpuProfiling=!1,this.lastCalculateFixed=0,this.chartFrame=0,this.gpuTimeProcess=0,this.chartTime=0,this.activeQueries=0,this.circularId=0,this.detected=0,this.frameId=0,this.rafId=0,this.idleCbId=0,this.checkQueryId=0,this.uuid=void 0,this.currentCpu=0,this.currentMem=0,this.paramFrame=0,this.paramTime=0,this.now=()=>{},this.t0=0,window.GLPerf=window.GLPerf||{},Object.assign(this,e),this.fpsChart=new Array(this.chartLen).fill(0),this.gpuChart=new Array(this.chartLen).fill(0),this.cpuChart=new Array(this.chartLen).fill(0),this.memChart=new Array(this.chartLen).fill(0),this.now=()=>window.performance&&window.performance.now?window.performance.now():Date.now(),this.initGpu(),this.is120hz()}initGpu(){this.uuid=he.MathUtils.generateUUID(),this.gl&&(this.isWebGL2=!0,this.extension||(this.extension=this.gl.getExtension("EXT_disjoint_timer_query_webgl2")),this.extension===null&&(this.isWebGL2=!1))}is120hz(){let e=0;const s=i=>{++e<20?this.rafId=window.requestAnimationFrame(s):(this.detected=Math.ceil(1e3*e/(i-this.t0)/70),window.cancelAnimationFrame(this.rafId)),this.t0||(this.t0=i)};this.rafId=window.requestAnimationFrame(s)}addUI(e){this.names.indexOf(e)===-1&&(this.names.push(e),this.gpuAccums.push(0),this.activeAccums.push(!1))}nextFps(e){const s=16.666666666666668,i=s-e.timeRemaining(),m=s*T.fpsLimit/10/i;m<0||(T.value=m,T.isOverLimit<25?T.isOverLimit++:C({overclockingFps:!0}))}nextFrame(e){this.frameId++;const s=e||this.now(),i=s-this.paramTime;let m=0;if(this.frameId<=1)this.paramFrame=this.frameId,this.paramTime=s;else if(s>=this.paramTime){this.maxMemory=window.performance.memory?window.performance.memory.jsHeapSizeLimit/1048576:0;const o=this.frameId-this.paramFrame,a=o*1e3/i,c=S().overclockingFps?T.value:a;if(m=this.isWebGL2?this.gpuAccums[0]:this.gpuAccums[0]/i,this.isWebGL2?this.gpuAccums[0]=0:Promise.all(this.finished).then(()=>{this.gpuAccums[0]=0,this.finished=[]}),this.currentMem=Math.round(window.performance&&window.performance.memory?window.performance.memory.usedJSHeapSize/1048576:0),window.performance&&this.startCpuProfiling){window.performance.mark("cpu-finished");const x=performance.measure("cpu-duration","cpu-started","cpu-finished");this.currentCpu=(x==null?void 0:x.duration)||0,this.logsAccums.cpu.push(this.currentCpu),this.startCpuProfiling=!1}this.logsAccums.mem.push(this.currentMem),this.logsAccums.fpsFixed.push(a),this.logsAccums.fps.push(c),this.logsAccums.gpu.push(m),this.overClock&&typeof window.requestIdleCallback<"u"&&(T.isOverLimit>0&&c>a?T.isOverLimit--:S().overclockingFps&&C({overclockingFps:!1})),s>=this.paramTime+1e3/this.logsPerSecond&&(this.paramLogger({cpu:O(this.logsAccums.cpu),gpu:O(this.logsAccums.gpu),mem:O(this.logsAccums.mem),fps:O(this.logsAccums.fps),duration:Math.round(i),maxMemory:this.maxMemory,frameCount:o}),this.logsAccums.mem=[],this.logsAccums.fps=[],this.logsAccums.gpu=[],this.logsAccums.cpu=[],this.paramFrame=this.frameId,this.paramTime=s),this.overClock&&s-this.lastCalculateFixed>=2*1e3&&(this.lastCalculateFixed=e,T.fpsLimit=Math.round(O(this.logsAccums.fpsFixed)/10)*100,C({fpsLimit:T.fpsLimit/10}),this.logsAccums.fpsFixed=[],this.paramFrame=this.frameId,this.paramTime=s)}if(!this.detected||!this.chartFrame)this.chartFrame=this.frameId,this.chartTime=s,this.circularId=0;else{const o=s-this.chartTime;let a=this.chartHz*o/1e3;for(;--a>0&&this.detected;){const x=(this.frameId-this.chartFrame)/o*1e3,n=S().overclockingFps?T.value:x;this.fpsChart[this.circularId%this.chartLen]=n;const d=1e3/this.currentMem,p=this.currentCpu,f=(this.isWebGL2?this.gpuAccums[1]*2:Math.round(this.gpuAccums[1]/i*100))+4;f>0&&(this.gpuChart[this.circularId%this.chartLen]=f),p>0&&(this.cpuChart[this.circularId%this.chartLen]=p),d>0&&(this.memChart[this.circularId%this.chartLen]=d);for(let h=0;h<this.names.length;h++)this.chartLogger({i:h,data:{fps:this.fpsChart,gpu:this.gpuChart,cpu:this.cpuChart,mem:this.memChart},circularId:this.circularId});this.circularId++,this.chartFrame=this.frameId,this.chartTime=s}}}startGpu(){const e=this.gl,s=this.extension;if(!(!e||!s)&&this.isWebGL2){let i=!1,m,o;if(this.query){this.queryHasResult=!1;let a=this.query;if(i=e.getQueryParameter(a,e.QUERY_RESULT_AVAILABLE),m=e.getParameter(s.GPU_DISJOINT_EXT),i&&!m){o=e.getQueryParameter(this.query,e.QUERY_RESULT);const c=o*1e-6;(i||m)&&(e.deleteQuery(this.query),a=null),i&&c>0&&(m||this.activeAccums.forEach((x,n)=>{this.gpuAccums[n]=c}))}}(i||!this.query)&&(this.queryCreated=!0,this.query=e.createQuery(),e.beginQuery(s.TIME_ELAPSED_EXT,this.query))}}endGpu(){const e=this.extension,s=this.gl;this.isWebGL2&&this.queryCreated&&s.getQuery(e.TIME_ELAPSED_EXT,s.CURRENT_QUERY)&&s.endQuery(e.TIME_ELAPSED_EXT)}begin(e){this.startGpu(),this.updateAccums(e)}end(e){this.endGpu(),this.updateAccums(e)}updateAccums(e){let s=this.names.indexOf(e);s===-1&&(s=this.names.length,this.addUI(e));const i=this.now();this.activeAccums[s]=!this.activeAccums[s],this.t0=i}dispose(){const e=this.gl,s=this.extension;try{this.isWebGL2&&e&&s&&e.getQuery(s.TIME_ELAPSED_EXT,e.CURRENT_QUERY)&&e.endQuery(s.TIME_ELAPSED_EXT)}catch{}if(e&&this.query){try{e.deleteQuery(this.query)}catch{}this.query=null}this.queryCreated=!1,this.queryHasResult=!1}}const Le=r=>{r.forEach(e=>{const{meshes:s}=e;if(!s)return;const i={total:0,type:"Triangle",data:[]};Object.keys(s).forEach(m=>{const o=s[m],{geometry:a,material:c}=o,x=a.index,n=a.attributes.position;if(!n)return;let d=1;c.wireframe===!0&&(d=0);const p=x!==null?x.count:n.count,f=a.drawRange.start*d,h=a.drawRange.count*d,u=f,v=Math.min(p,f+h)-1;let g=1;const w=o.count||1;let y="Triangle",b=0;o.isMesh?c.wireframe===!0?(y="Line",g=g/2):(y="Triangle",g=g/3):o.isLine?(y="Line",o.isLineSegments?g=g/2:o.isLineLoop?g=g:g=g-1):o.isPoints?(y="Point",g=g):o.isSprite&&(y="Triangle",g=g/3);const _=Math.round(Math.max(0,v-u+1)*(g*w));_>b&&(b=_,i.type=y),i.total+=_,i.data.push({drawCount:_,type:y}),o.userData.drawCount={type:y,count:_}}),e.drawCounts=i})},K=new Ce;function Te(r,e,s){return K.on(r,e)}function Re(r,e,s){K.removeListener(r,e,(s==null?void 0:s.context)??null,s==null?void 0:s.once)}function Se(r,e){K.emit(r,e)}function Ae(r){let e=0,s=0;const i=new Set,m=new Set;return r.traverse(o=>{if(o.isMesh){const a=o;if(a.geometry&&!i.has(a.geometry.uuid)){i.add(a.geometry.uuid);const n=a.geometry.attributes;for(const d in n){const p=n[d];p.array&&(s+=p.array.byteLength)}a.geometry.index&&a.geometry.index.array&&(s+=a.geometry.index.array.byteLength)}const c=a.material;(Array.isArray(c)?c:[c]).forEach(n=>{if(n)for(const d in n){const p=n[d];if(p&&p.isTexture){const f=p;if(!m.has(f.uuid)){if(m.add(f.uuid),f.isCompressedTexture&&f.mipmaps)f.mipmaps.forEach(h=>{h.data&&(e+=h.data.byteLength)});else if(f.image){const h=f.image,u=h.width||0,v=h.height||0,g=f.generateMipmaps?1.33:1;e+=u*v*4*g}}}}})}}),{geometry:s,texture:e,total:s+e}}const re=E.Object3D.prototype.updateMatrixWorld,ne=E.Object3D.prototype.updateWorldMatrix,ie=E.Object3D.prototype.updateMatrix,ae=["calls","triangles","points","lines"],oe=["gpu","cpu","mem","fps"],Ne=r=>/^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}$/.test(r),ce=(r,e)=>{r.defines||(r.defines={}),r.defines.muiPerf||(r.defines=Object.assign(r.defines||{},{muiPerf:r.uuid}),r.needsUpdate=!0);const s=r.uuid;return e[s]||(e[s]={meshes:{},material:r}),r.needsUpdate=!1,s},Fe=r=>r==="muiPerf",Pe=({overClock:r,logsPerSecond:e,chart:s,deepAnalyze:i,matrixUpdate:m})=>{const{gl:o,scene:a}=F.useThree();C({gl:o,scene:a});const c=1e3;let x=0;const n=j.useMemo(()=>{const d=new Ie({trackGPU:!0,overClock:r,chartLen:s?s.length:120,chartHz:s?s.hz:60,logsPerSecond:e||10,gl:o.getContext(),chartLogger:g=>{C({chart:g})},paramLogger:g=>{var I;const w={maxMemory:g.maxMemory,gpu:g.gpu,cpu:g.cpu,mem:g.mem,fps:g.fps,totalTime:g.duration,frameCount:g.frameCount};C({log:w});const{accumulated:y}=S(),b=o.info.render;y.totalFrames++,y.gl.calls+=b.calls,y.gl.triangles+=b.triangles,y.gl.points+=b.points,y.gl.lines+=b.lines,y.log.gpu+=g.gpu,y.log.cpu+=g.cpu,y.log.mem+=g.mem,y.log.fps+=g.fps;for(let A=0;A<ae.length;A++){const L=ae[A],N=b[L];N>y.max.gl[L]&&(y.max.gl[L]=N)}for(let A=0;A<oe.length;A++){const L=oe[A],N=g[L];N>y.max.log[L]&&(y.max.log[L]=N)}C({accumulated:y});const _={calls:o.info.render.calls,triangles:o.info.render.triangles,points:o.info.render.points,lines:o.info.render.lines,geometries:o.info.memory.geometries,textures:o.info.memory.textures,programs:((I=o.info.programs)==null?void 0:I.length)||0};Se("log",[w,_])}}),p=o.getContext();let f=null,h=null;const u=p.getExtension("WEBGL_debug_renderer_info"),v=p.getParameter(p.VERSION);return u&&(f=p.getParameter(u.UNMASKED_RENDERER_WEBGL),h=p.getParameter(u.UNMASKED_VENDOR_WEBGL)),h||(h="Unknown vendor"),f||(f=p.getParameter(p.RENDERER)),C({startTime:window.performance.now(),infos:{version:v,renderer:f,vendor:h}}),d},[r,s,e,o]);return j.useEffect(()=>{n&&(n.overClock=r||!1,r===!1&&(C({overclockingFps:!1}),T.value=0,T.isOverLimit=0),n.chartHz=(s==null?void 0:s.hz)||60,n.chartLen=(s==null?void 0:s.length)||120)},[n,r,s==null?void 0:s.hz,s==null?void 0:s.length]),j.useEffect(()=>{if(!o.info)return;o.info.autoReset=!1,m&&(E.Object3D.prototype.updateMatrixWorld=function(...f){return this.matrixWorldNeedsUpdate||f[0],re.apply(this,f)},E.Object3D.prototype.updateWorldMatrix=function(...f){return ne.apply(this,f)},E.Object3D.prototype.updateMatrix=function(...f){return ie.apply(this,f)});const d=F.addEffect(()=>{S().paused&&C({paused:!1}),n==null||n.begin("profiler"),window.performance&&(window.performance.mark("cpu-started"),n.startCpuProfiling=!0),o.info.reset()}),p=F.addAfterEffect(()=>{var v,g;n==null||n.end("profiler"),n&&!n.paused&&(n.nextFrame(window.performance.now()),r&&typeof window.requestIdleCallback<"u"&&(n.idleCbId=requestIdleCallback(n.nextFps)));const f=window.performance.now();if(f-x>c){x=f;const w=Ae(a),y=n.currentMem||0;C({estimatedMemory:{vram:w.total/1024/1024,tex:w.texture/1024/1024,geo:w.geometry/1024/1024,ram:y}})}if(!i)return;const h={},u=new Map;a.traverse(w=>{if(w instanceof E.Mesh||w instanceof E.Points){if(!w.material)return;let y=w.material.uuid;const b=Array.isArray(w.material)&&w.material.length>1;y=ce(b?w.material[1]:w.material,h),h[y].meshes[w.uuid]=w}}),(g=(v=o==null?void 0:o.info)==null?void 0:v.programs)==null||g.forEach(w=>{const y=w.cacheKey.split(","),b=y[y.findIndex(Fe)+1];if(Ne(b)&&h[b]){const{material:_,meshes:I}=h[b];u.set(b,{program:w,material:_,meshes:I,drawCounts:{total:0,type:"triangle",data:[]},expand:!1,visible:!0})}}),u.size!==S().programs.size&&(Le(u),C({programs:u,triggerProgramsUpdate:S().triggerProgramsUpdate+1}))});return()=>{var f;n&&typeof window.cancelIdleCallback<"u"&&window.cancelIdleCallback(n.idleCbId),(f=n==null?void 0:n.dispose)==null||f.call(n),m&&(E.Object3D.prototype.updateMatrixWorld=re,E.Object3D.prototype.updateWorldMatrix=ne,E.Object3D.prototype.updateMatrix=ie),d(),p()}},[n,o,a,i,r,m]),j.useEffect(()=>{const d=F.addTail(()=>(n&&(n.paused=!0,C({paused:!0,log:{maxMemory:0,gpu:0,mem:0,cpu:0,fps:0,totalTime:0,frameCount:0}})),!1));return()=>d()},[n]),null};function J(r,e,s=[],i){const m=j.useRef(e);j.useEffect(()=>{m.current=e},[e]),j.useEffect(()=>{const o=c=>{var x;return(x=m.current)==null?void 0:x.call(m,c)},a=Te(r,o);return()=>Re(r,o,{...i,context:a})},[r,i==null?void 0:i.once,...s])}function Ue(r){let e=0;for(const i in r.attributes){const m=r.getAttribute(i);e+=m.count*m.itemSize*m.array.BYTES_PER_ELEMENT}const s=r.getIndex();return e+=s?s.count*s.itemSize*s.array.BYTES_PER_ELEMENT:0,e}const Ge="_perfS_ans5i_1",De="_containerHeight_ans5i_16",Be="_topLeft_ans5i_21",Oe="_topRight_ans5i_22",We="_bottomLeft_ans5i_23",qe="_bottomRight_ans5i_24",ke="_minimal_ans5i_26",He="_perfIContainer_ans5i_30",ze="_perfI_ans5i_30",Ve="_perfB_ans5i_69",$e="_toggleContainer_ans5i_83",Qe="_toggle_ans5i_83",Xe="_activeTab_ans5i_105",Ye="_containerScroll_ans5i_110",Ke="_programGeo_ans5i_115",Je="_programHeader_ans5i_120",Ze="_headerLeft_ans5i_149",et="_programTitle_ans5i_156",tt="_toggleArrow_ans5i_166",st="_programConsole_ans5i_200",rt="_programsContainer_ans5i_218",nt="_headerRight_ans5i_222",it="_metricBadge_ans5i_228",at="_programsULHeader_ans5i_246",ot="_programsUL_ans5i_246",ct="_programsGeoLi_ans5i_309",lt="_graph_ans5i_324",ut="_visibilityBtn_ans5i_354",mt="_active_ans5i_105",l={perfS:Ge,containerHeight:De,topLeft:Be,topRight:Oe,bottomLeft:We,bottomRight:qe,minimal:ke,perfIContainer:He,perfI:ze,perfB:Ve,toggleContainer:$e,toggle:Qe,activeTab:Xe,containerScroll:Ye,programGeo:Ke,programHeader:Je,headerLeft:Ze,programTitle:et,toggleArrow:tt,programConsole:st,programsContainer:rt,headerRight:nt,metricBadge:it,programsULHeader:at,programsUL:ot,programsGeoLi:ct,graph:lt,visibilityBtn:ut,active:mt},le=(r,e)=>{var m,o;const s=a=>{switch(a){case 1e3:return"RepeatWrapping";case 1001:return"ClampToEdgeWrapping";case 1002:return"MirroredRepeatWrapping";default:return"ClampToEdgeWrapping"}},i=a=>{switch(a){case 3e3:return"LinearEncoding";case 3001:return"sRGBEncoding";case 3002:return"RGBEEncoding";case 3003:return"LogLuvEncoding";case 3004:return"RGBM7Encoding";case 3005:return"RGBM16Encoding";case 3006:return"RGBDEncoding";case 3007:return"GammaEncoding";default:return"ClampToEdgeWrapping"}};return{name:r,url:(m=e==null?void 0:e.image)==null?void 0:m.currentSrc,encoding:i(e.encoding),wrapT:s(e.wrapT),flipY:(o=e.flipY)==null?void 0:o.toString()}},X=({value:r,label:e,unit:s,title:i})=>r==null||r===0||r==="0"?null:t.jsxs("div",{className:l.metricBadge,title:i,children:[t.jsx("b",{children:r})," ",s||e]}),dt=({program:r,material:e,setTexNumber:s})=>{const i=M(a=>a.gl),[m,o]=j.useState(null);return j.useEffect(()=>{if(i){const a=r==null?void 0:r.getUniforms();let c=0;const x=new Map;a&&a.seq&&a.seq.forEach(n=>{if(!n.id.includes("uTroika")&&!["isOrthographic","uvTransform","lightProbe","projectionMatrix","viewMatrix","normalMatrix","modelMatrix","modelViewMatrix"].includes(n.id)){const d=[],p={name:n.id};n.cache&&(n.cache.forEach(f=>{typeof f<"u"&&d.push(f.toString().substring(0,4))}),p.value=d.join(),e[n.id]&&e[n.id].image&&(c++,p.value=le(n.id,e[n.id])),p.value||(p.value="empty"),x.set(n.id,p))}}),e.uniforms&&Object.keys(e.uniforms).forEach(n=>{const d=e.uniforms[n];if(d.value){const{value:p}=d,f={name:n};if(n.includes("uTroika"))return;if(p.isTexture)c++,f.value=le(n,p);else{let h=JSON.stringify(p);try{h=JSON.stringify(p)}catch{h=p.toString()}f.value=h}x.set(n,f)}}),s(c),o(x)}},[i,e,r,s]),t.jsx("ul",{className:l.programsUL,children:m&&Array.from(m.values()).map(a=>t.jsx("span",{children:typeof a.value=="string"?t.jsx("li",{children:t.jsxs("span",{children:[a.name," :"," ",t.jsxs("b",{children:[a.value.substring(0,30),a.value.length>30?"...":""]})]})}):t.jsxs(t.Fragment,{children:[t.jsx("li",{children:t.jsxs("b",{children:[a.value.name,":"]})}),t.jsxs("div",{children:[Object.keys(a.value).map(c=>c!=="name"?t.jsx("div",{children:c==="url"?t.jsx("a",{href:a.value[c],target:"_blank",rel:"noreferrer",children:t.jsx("img",{src:a.value[c],alt:"texture"})}):t.jsxs("li",{children:[c,": ",t.jsx("b",{children:a.value[c]})]})},c):null),t.jsxs("button",{className:l.programConsole,onClick:()=>{var c;console.info(e[a.value.name]||((c=e==null?void 0:e.uniforms[a.value.name])==null?void 0:c.value))},children:["console.info(",a.value.name,");"]})]})]})},a.name))})},ft=({el:r})=>{const[e,s]=j.useState(r.visible),[i,m]=j.useState(r.expand),[o,a]=j.useState(0),{meshes:c,program:x,material:n}=r,d=M(u=>u.gl),p=()=>{if(!d||!d.info||!d.info.render)return 0;const u=d.info.render.triangles+d.info.render.lines+d.info.render.points;if(u===0)return 0;const v=Math.round(r.drawCounts.total/u*100*10)/10;return isFinite(v)&&v||0},f=Object.keys(c).length,h=p();return t.jsxs("div",{className:l.programGeo,children:[t.jsxs("div",{className:l.programHeader,onClick:()=>{Object.keys(c).forEach(u=>{c[u].material.wireframe=!1}),m(!i)},children:[t.jsxs("div",{className:l.headerLeft,children:[t.jsx("div",{className:l.toggleArrow,style:{transform:i?"rotate(90deg)":"rotate(0deg)"},children:"▶"}),x&&t.jsx("span",{className:l.programTitle,children:x.name})]}),t.jsxs("div",{className:l.headerRight,children:[t.jsx(X,{value:f,unit:f>1?"users":"user"}),t.jsx(X,{value:o,unit:"tex"}),r.drawCounts.total>0&&t.jsxs("div",{className:l.metricBadge,title:`${h}% of total render`,children:[t.jsx("b",{children:r.drawCounts.total}),r.drawCounts.type==="Triangle"?"tris":r.drawCounts.type,r.visible&&!r.material.wireframe&&t.jsxs("span",{style:{marginLeft:"4px",opacity:.6,fontSize:"9px"},children:["(",h,"%)"]})]}),n.glslVersion==="300 es"&&t.jsx(X,{value:"300",unit:"es"}),t.jsx("div",{className:`${l.visibilityBtn} ${e?l.active:""}`,onPointerEnter:()=>{Object.keys(c).forEach(u=>c[u].material.wireframe=!0)},onPointerLeave:()=>{Object.keys(c).forEach(u=>c[u].material.wireframe=!1)},onClick:u=>{u.stopPropagation();const v=!e;Object.keys(c).forEach(g=>{c[g]&&(c[g].visible=v)}),s(v)},children:e?"👁":"×"})]})]}),t.jsxs("div",{style:{display:i?"block":"none"},children:[t.jsx("div",{className:l.programsULHeader,style:{marginTop:"4px"},children:"Uniforms"}),t.jsx(dt,{program:x,material:n,setTexNumber:a}),t.jsx("div",{className:l.programsULHeader,children:"Geometries"}),t.jsx("ul",{className:l.programsUL,children:c&&Object.keys(c).map(u=>c[u]&&c[u].geometry&&t.jsx("li",{className:l.programsGeoLi,children:t.jsxs("div",{style:{width:"100%",display:"flex",justifyContent:"space-between",alignItems:"center"},children:[t.jsx("span",{children:c[u].geometry.type}),c[u].userData&&c[u].userData.drawCount&&t.jsxs("span",{style:{color:"#aaa",fontSize:"10px",display:"flex",gap:"6px"},children:[t.jsxs("span",{children:[t.jsx("b",{children:c[u].userData.drawCount.count})," ",c[u].userData.drawCount.type,"s"]}),t.jsx("span",{style:{opacity:.3},children:"|"}),t.jsxs("span",{children:[t.jsx("b",{children:Math.round(Ue(c[u].geometry)/1024*100)/100})," ","KB"]})]})]})},u))}),t.jsxs("button",{className:l.programConsole,onClick:()=>console.info(n),children:["Log Material (",n.type,")"]})]})]})},pt=()=>{M(e=>e.triggerProgramsUpdate);const r=M(e=>e.programs);return t.jsx("div",{className:l.programsContainer,onWheel:e=>e.stopPropagation(),children:r&&Array.from(r.values()).map(e=>e?t.jsx(ft,{el:e},e.material.uuid):null)})},ht=({minimal:r,chart:e={length:120,hz:60}})=>{const s=j.useMemo(()=>({fps:new Float32Array(e.length*3),cpu:new Float32Array(e.length*3),gpu:new Float32Array(e.length*3)}),[e]),i=j.useRef(null),m=j.useRef(null),o=j.useRef(null),a=j.useRef(null),c=j.useMemo(()=>new E.Vector3(0,0,0),[]),x=(n,d=1,p,f)=>{let h=0;const{width:u,height:v}=f,g=S().chart.data[n];if(!g||g.length===0)return;const w=r?2:6,y=r?12:50,b=g.length;for(let _=0;_<b;_++){const I=(S().chart.circularId+_+1)%b;g[I]!==void 0&&(g[I]>h&&(h=g[I]*d),c.set(w+_/(b-1)*(u-w*2)-u/2,Math.min(100,g[I])*d/100*(v-w*2-y)-v/2,0),c.toArray(p.attributes.position.array,_*3))}p.attributes.position.needsUpdate=!0};return F.useFrame(function({viewport:d}){x("fps",1,i.current,d),m.current&&m.current.color.set(S().overclockingFps?R.overClock:R.fps),x("gpu",5,o.current,d),x("cpu",5,a.current,d)}),t.jsxs(t.Fragment,{children:[t.jsxs("line",{onUpdate:n=>{n.updateMatrix(),n.matrixWorld.copy(n.matrix)},children:[t.jsx("bufferGeometry",{ref:i,children:t.jsx("bufferAttribute",{attach:"attributes-position",count:e.length,args:[s.fps,3],array:s.fps,itemSize:3,usage:E.DynamicDrawUsage,needsUpdate:!0})}),t.jsx("lineBasicMaterial",{ref:m,color:R.fps,transparent:!0,opacity:.5})]}),t.jsxs("line",{onUpdate:n=>{n.updateMatrix(),n.matrixWorld.copy(n.matrix)},children:[t.jsx("bufferGeometry",{ref:o,children:t.jsx("bufferAttribute",{attach:"attributes-position",count:e.length,array:s.gpu,args:[s.gpu,3],itemSize:3,usage:E.DynamicDrawUsage,needsUpdate:!0})}),t.jsx("lineBasicMaterial",{color:R.gpu,transparent:!0,opacity:.5})]}),t.jsxs("line",{onUpdate:n=>{n.updateMatrix(),n.matrixWorld.copy(n.matrix)},children:[t.jsx("bufferGeometry",{ref:a,children:t.jsx("bufferAttribute",{attach:"attributes-position",count:e.length,array:s.cpu,args:[s.cpu,3],itemSize:3,usage:E.DynamicDrawUsage,needsUpdate:!0})}),t.jsx("lineBasicMaterial",{color:R.cpu,transparent:!0,opacity:.5})]})]})},gt=({chart:r,showGraph:e=!0,antialias:s=!0,minimal:i})=>{const m=j.useRef(void 0),o=M(a=>a.paused);return t.jsx("div",{className:l.graph,style:{display:"flex",marginTop:6,position:"absolute",width:"100%",height:`${i?37:e?100:60}px`},children:t.jsx(F.Canvas,{ref:m,orthographic:!0,camera:{rotation:[0,0,0]},dpr:s?[1,2]:1,gl:{antialias:!0,alpha:!0,stencil:!1,depth:!1},onCreated:({scene:a})=>{a.traverse(c=>{c.matrixWorldAutoUpdate=!1,c.matrixAutoUpdate=!1})},flat:!0,style:{marginBottom:"-42px",position:"relative",pointerEvents:"none",background:"transparent !important",width:"100%",height:`${i?37:e?100:60}px`},children:o?null:t.jsxs(t.Fragment,{children:[t.jsx(xt,{}),e&&t.jsx(ht,{minimal:i,chart:r})]})})})},xt=()=>(F.useFrame(function({gl:e,scene:s,camera:i}){i.updateMatrix(),i.matrixWorld.copy(i.matrix),i.matrixWorldInverse.copy(i.matrixWorld).invert(),e.render(s,i)},1/0),null),ue={fps:{fg:"#00ffff",bg:"#000022"},cpu:{fg:"#00ff00",bg:"#002200"},gpu:{fg:"#ff0080",bg:"#220011"}},G=[{key:"fps",label:"FPS",maxVal:120},{key:"cpu",label:"CPU",maxVal:40},{key:"gpu",label:"GPU",maxVal:40}],D=48,xe=15,z=2,q=xe,W=D-q-2,V=6,yt=15,me=1e3/yt;function jt({show:r=!0,opacity:e=1,className:s,style:i}){const m=M(h=>h.paused),o=j.useRef(null),a=j.useRef(null),[c,x]=j.useState(300),n=j.useMemo(()=>Math.max(1,Math.round(window.devicePixelRatio||1)),[]);j.useEffect(()=>{if(!a.current)return;const h=new ResizeObserver(u=>{for(const v of u)x(v.contentRect.width)});return h.observe(a.current),()=>h.disconnect()},[]);const d=(G.length-1)*V,p=Math.max(0,(c-d)/G.length),f=Math.max(0,p-z);return j.useEffect(()=>{const h=o.current;if(!h)return;h.width=c*n,h.height=D*n,h.style.width="100%",h.style.height=`${D}px`;const u=h.getContext("2d");if(u){u.setTransform(1,0,0,1,0,0),u.scale(n,n),u.imageSmoothingEnabled=!1,u.font="bold 9px Roboto Mono, monospace",u.textBaseline="top",u.clearRect(0,0,c,D);for(let v=0;v<G.length;v++){const{key:g}=G[v],w=v*(p+V),{bg:y}=ue[g];u.fillStyle=y,u.globalAlpha=e,u.fillRect(w,0,p,D),u.globalAlpha=1}}},[n,c,p,e]),j.useEffect(()=>{if(!r)return;const h=o.current;if(!h)return;const u=h.getContext("2d");if(!u)return;let v=0,g=0;const w={fps:{min:1/0,max:0},cpu:{min:1/0,max:0},gpu:{min:1/0,max:0}};function y(b){if(!h||!u||(v=requestAnimationFrame(y),m))return;const _=b-g;if(_<me)return;g=b-_%me;const I=S(),A=I.chart.circularId;for(let L=0;L<G.length;L++){const{key:N,label:ye,maxVal:Z}=G[L],B=L*(p+V),{fg:ee,bg:te}=ue[N],k=I.chart.data[N],$=(k==null?void 0:k.length)||0;let H=0;if($>0){const we=(A-1+$)%$;H=k[we]??0}const U=w[N];U.min=Math.min(U.min,H),U.max=Math.max(U.max,H),u.fillStyle=te,u.globalAlpha=1,u.fillRect(B,0,p,xe),u.fillStyle=ee;const je=`${ye} (${Math.round(U.min)}-${Math.round(U.max)})`;u.fillText(je,B+3,2),f>1&&u.drawImage(h,(B+z+1)*n,q*n,(f-1)*n,W*n,B+z,q,f-1,W);const se=B+z+f-1;u.fillStyle=te,u.globalAlpha=1,u.fillRect(se,q,1,W),u.fillStyle=ee,u.globalAlpha=1;const ve=Math.min(H,Z)/Z,Q=Math.round(ve*W);Q>0&&u.fillRect(se,q+W-Q,1,Q)}}return v=requestAnimationFrame(y),()=>cancelAnimationFrame(v)},[m,r,n,p,f]),r?t.jsx("div",{ref:a,className:s,style:{width:"100%",...i,marginTop:V},children:t.jsx("canvas",{ref:o,style:{display:"block",pointerEvents:"none",width:"100%",height:`${D}px`}})}):null}const R={overClock:"#ff6eff",fps:"#00FFFF",cpu:"#00FF00",gpu:"#FD007F",memory:"#FFD000",vram:"#FF8C00"},de=({metric:r,decimal:e=0,suffix:s=""})=>{const i=j.useRef(null);return J("log",m=>{const[o]=m;if(o&&i.current){const a=o[r];i.current.innerText=(typeof a=="number"?a.toFixed(e):"0")+s}}),t.jsxs("span",{ref:i,children:["0",s]})},P=({metric:r,suffix:e=""})=>{const s=j.useRef(null);return J("log",i=>{const[,m]=i;if(m&&s.current){let o=m[r];r==="calls"&&o===1&&(o="--"),s.current.innerText=o+e}}),t.jsxs("span",{ref:s,children:["0",e]})},fe=({type:r})=>{const e=M(s=>s.estimatedMemory[r]);return t.jsxs("span",{children:[e.toFixed(0)," MB"]})},vt=()=>{const r=M(m=>m.overclockingFps),e=M(m=>m.fpsLimit),s=j.useRef(null);J("log",m=>{const[o]=m;o&&s.current&&(s.current.innerText=Math.round(o.fps).toString())});const i=r?R.overClock:R.fps;return t.jsxs("div",{className:l.perfI,children:[t.jsxs("span",{className:l.perfB,style:{color:i},children:["FPS ",r?` ${e}🚀`:""]}),t.jsx("small",{className:l.perfSmallI,ref:s,children:"0"})]})},wt=({showGraph:r,minimal:e})=>M(i=>i.gl)?t.jsxs("div",{className:l.perfIContainer,children:[t.jsx(vt,{showGraph:r}),t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,style:{color:R.cpu},children:"CPU"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(de,{metric:"cpu",decimal:2,suffix:" ms"})})]}),t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,style:{color:R.gpu},children:"GPU"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(de,{metric:"gpu",decimal:2,suffix:" ms"})})]}),t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,style:{color:R.memory},children:"MEMORY"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(fe,{type:"ram"})})]}),t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,style:{color:R.vram},children:"VRAM"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(fe,{type:"vram"})})]}),!e&&t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,children:"Calls"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(P,{metric:"calls"})})]})]}):null,bt=({matrixUpdate:r})=>t.jsxs("div",{className:l.perfIContainer,children:[t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,children:"Geometries"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(P,{metric:"geometries"})})]}),t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,children:"Textures"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(P,{metric:"textures"})})]}),t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,children:"Shaders"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(P,{metric:"programs"})})]}),t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,children:"Triangles"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(P,{metric:"triangles"})})]}),t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,children:"Lines"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(P,{metric:"lines"})})]}),t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,children:"Points"}),t.jsx("small",{className:l.perfSmallI,children:t.jsx(P,{metric:"points"})})]}),r&&t.jsxs("div",{className:l.perfI,children:[t.jsx("span",{className:l.perfB,children:"Matrices"}),t.jsx("small",{className:l.perfSmallI,children:r})]})]}),pe=({tab:r,title:e,set:s})=>{const i=M(m=>m.tab);return t.jsx("div",{className:`${l.toggle} ${i===r?l.activeTab:""}`,onClick:()=>{s(!0),C({tab:r})},children:e})},_t=({openByDefault:r,showGraph:e,deepAnalyze:s,matrixUpdate:i,graphType:m,perfContainerRef:o,antialias:a,chart:c,minimal:x})=>{const[n,d]=j.useState(r||!1),p=M(f=>f.tab);return t.jsxs(t.Fragment,{children:[t.jsxs("div",{style:{display:n?"block":"none",marginTop:"4px"},children:[t.jsx(bt,{matrixUpdate:i}),e&&(m==="bar"?t.jsx(jt,{}):t.jsx(gt,{perfContainerRef:o,chart:c,showGraph:e,antialias:a,minimal:x,matrixUpdate:i})),n&&t.jsx("div",{className:l.containerScroll,children:p==="programs"&&t.jsx(pt,{})})]}),r&&!s?null:t.jsxs("div",{className:l.toggleContainer,style:n&&e&&m==="line"?{marginTop:50}:{marginTop:6},children:[s&&t.jsx(pe,{tab:"programs",title:"Programs",set:d}),s&&t.jsx(pe,{tab:"infos",title:"Infos",set:d}),t.jsx("div",{className:l.toggle,onClick:()=>d(!n),children:n?"Minimize":"More"})]})]})},Et=({showGraph:r=!0,openByDefault:e=!0,className:s,overClock:i=!1,graphType:m="bar",style:o,position:a="top-right",chart:c,logsPerSecond:x,deepAnalyze:n=!1,antialias:d=!0,matrixUpdate:p,minimal:f})=>{const h=j.useRef(null),u=a==="top-left"?l.topLeft:a==="bottom-left"?l.bottomLeft:a==="bottom-right"?l.bottomRight:l.topRight,v=r&&m==="line"&&!n;return t.jsxs(t.Fragment,{children:[t.jsx(Pe,{logsPerSecond:x,chart:c,overClock:i,deepAnalyze:n,matrixUpdate:p}),t.jsx(ge,{name:"r3f-perf",children:t.jsxs("div",{className:`${l.perfS} ${u} ${f?l.minimal:""} ${s||""} ${v?l.containerHeight:""}`,style:o,ref:h,children:[t.jsx(wt,{showGraph:r,minimal:f}),!f&&t.jsx(_t,{showGraph:r,deepAnalyze:n,matrixUpdate:p,openByDefault:e,graphType:m,perfContainerRef:h,antialias:d,chart:c,minimal:f})]})})]})};exports.PerformanceMonitor=Et;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),j=require("react"),N=require("@react-three/fiber"),Be=require("react-dom/client"),Te=require("three");function He(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const r in t)if(r!=="default"){const o=Object.getOwnPropertyDescriptor(t,r);Object.defineProperty(e,r,o.get?o:{enumerable:!0,get:()=>t[r]})}}return e.default=t,Object.freeze(e)}const O=He(Te),Re=j.forwardRef(({portal:t,className:e,children:r,name:o,...p},m)=>{const h=N.useThree(c=>c.gl),f=j.useRef(null),g=j.useRef(null),s=(t==null?void 0:t.current)!=null?t.current:h.domElement.parentNode;return j.useLayoutEffect(()=>{if(!f.current||!s)return;const c=document.createElement("div"),a=g.current=Be.createRoot(c);return s.appendChild(c),()=>{a.unmount(),g.current=null,s.removeChild(c)}},[s]),j.useLayoutEffect(()=>{const c=g.current;c&&c.render(n.jsx("div",{ref:m,className:e,children:r}))}),n.jsx("group",{name:o,...p,ref:f})});Re.displayName="HtmlMinimal";function Ae(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var te={exports:{}},Y={},q={exports:{}},X={};/**
+ * @license React
+ * use-sync-external-store-shim.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var le;function Ve(){if(le)return X;le=1;var t=j;function e(a,d){return a===d&&(a!==0||1/a===1/d)||a!==a&&d!==d}var r=typeof Object.is=="function"?Object.is:e,o=t.useState,p=t.useEffect,m=t.useLayoutEffect,h=t.useDebugValue;function f(a,d){var l=d(),i=o({inst:{value:l,getSnapshot:d}}),x=i[0].inst,u=i[1];return m(function(){x.value=l,x.getSnapshot=d,g(x)&&u({inst:x})},[a,l,d]),p(function(){return g(x)&&u({inst:x}),a(function(){g(x)&&u({inst:x})})},[a]),h(l),l}function g(a){var d=a.getSnapshot;a=a.value;try{var l=d();return!r(a,l)}catch{return!0}}function s(a,d){return d()}var c=typeof window>"u"||typeof window.document>"u"||typeof window.document.createElement>"u"?s:f;return X.useSyncExternalStore=t.useSyncExternalStore!==void 0?t.useSyncExternalStore:c,X}var J={};/**
+ * @license React
+ * use-sync-external-store-shim.development.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var ue;function ke(){return ue||(ue=1,process.env.NODE_ENV!=="production"&&function(){function t(l,i){return l===i&&(l!==0||1/l===1/i)||l!==l&&i!==i}function e(l,i){c||p.startTransition===void 0||(c=!0,console.error("You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."));var x=i();if(!a){var u=i();m(x,u)||(console.error("The result of getSnapshot should be cached to avoid an infinite loop"),a=!0)}u=h({inst:{value:x,getSnapshot:i}});var _=u[0].inst,v=u[1];return g(function(){_.value=x,_.getSnapshot=i,r(_)&&v({inst:_})},[l,x,i]),f(function(){return r(_)&&v({inst:_}),l(function(){r(_)&&v({inst:_})})},[l]),s(x),x}function r(l){var i=l.getSnapshot;l=l.value;try{var x=i();return!m(l,x)}catch{return!0}}function o(l,i){return i()}typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<"u"&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart=="function"&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());var p=j,m=typeof Object.is=="function"?Object.is:t,h=p.useState,f=p.useEffect,g=p.useLayoutEffect,s=p.useDebugValue,c=!1,a=!1,d=typeof window>"u"||typeof window.document>"u"||typeof window.document.createElement>"u"?o:e;J.useSyncExternalStore=p.useSyncExternalStore!==void 0?p.useSyncExternalStore:d,typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<"u"&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop=="function"&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error())}()),J}var fe;function Ne(){return fe||(fe=1,process.env.NODE_ENV==="production"?q.exports=Ve():q.exports=ke()),q.exports}/**
+ * @license React
+ * use-sync-external-store-shim/with-selector.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var me;function qe(){if(me)return Y;me=1;var t=j,e=Ne();function r(s,c){return s===c&&(s!==0||1/s===1/c)||s!==s&&c!==c}var o=typeof Object.is=="function"?Object.is:r,p=e.useSyncExternalStore,m=t.useRef,h=t.useEffect,f=t.useMemo,g=t.useDebugValue;return Y.useSyncExternalStoreWithSelector=function(s,c,a,d,l){var i=m(null);if(i.current===null){var x={hasValue:!1,value:null};i.current=x}else x=i.current;i=f(function(){function _(S){if(!v){if(v=!0,E=S,S=d(S),l!==void 0&&x.hasValue){var w=x.value;if(l(w,S))return b=w}return b=S}if(w=b,o(E,S))return w;var C=d(S);return l!==void 0&&l(w,C)?(E=S,w):(E=S,b=C)}var v=!1,E,b,L=a===void 0?null:a;return[function(){return _(c())},L===null?void 0:function(){return _(L())}]},[c,a,d,l]);var u=p(s,i[0],i[1]);return h(function(){x.hasValue=!0,x.value=u},[u]),g(u),u},Y}var Z={};/**
+ * @license React
+ * use-sync-external-store-shim/with-selector.development.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var de;function ze(){return de||(de=1,process.env.NODE_ENV!=="production"&&function(){function t(s,c){return s===c&&(s!==0||1/s===1/c)||s!==s&&c!==c}typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<"u"&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart=="function"&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());var e=j,r=Ne(),o=typeof Object.is=="function"?Object.is:t,p=r.useSyncExternalStore,m=e.useRef,h=e.useEffect,f=e.useMemo,g=e.useDebugValue;Z.useSyncExternalStoreWithSelector=function(s,c,a,d,l){var i=m(null);if(i.current===null){var x={hasValue:!1,value:null};i.current=x}else x=i.current;i=f(function(){function _(S){if(!v){if(v=!0,E=S,S=d(S),l!==void 0&&x.hasValue){var w=x.value;if(l(w,S))return b=w}return b=S}if(w=b,o(E,S))return w;var C=d(S);return l!==void 0&&l(w,C)?(E=S,w):(E=S,b=C)}var v=!1,E,b,L=a===void 0?null:a;return[function(){return _(c())},L===null?void 0:function(){return _(L())}]},[c,a,d,l]);var u=p(s,i[0],i[1]);return h(function(){x.hasValue=!0,x.value=u},[u]),g(u),u},typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<"u"&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop=="function"&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error())}()),Z}process.env.NODE_ENV==="production"?te.exports=qe():te.exports=ze();var $e=te.exports;const Ke=Ae($e),pe=t=>{let e;const r=new Set,o=(s,c)=>{const a=typeof s=="function"?s(e):s;if(!Object.is(a,e)){const d=e;e=c??(typeof a!="object"||a===null)?a:Object.assign({},e,a),r.forEach(l=>l(e,d))}},p=()=>e,f={setState:o,getState:p,getInitialState:()=>g,subscribe:s=>(r.add(s),()=>r.delete(s))},g=e=t(o,p,f);return f},Qe=t=>t?pe(t):pe,{useSyncExternalStoreWithSelector:Ye}=Ke,Xe=t=>t;function Je(t,e=Xe,r){const o=Ye(t.subscribe,t.getState,t.getInitialState,e,r);return j.useDebugValue(o),o}const he=(t,e)=>{const r=Qe(t),o=(p,m=e)=>Je(r,p,m);return Object.assign(o,r),o},Ze=(t,e)=>t?he(t,e):he,ge=t=>Symbol.iterator in t,xe=t=>"entries"in t,ye=(t,e)=>{const r=t instanceof Map?t:new Map(t.entries()),o=e instanceof Map?e:new Map(e.entries());if(r.size!==o.size)return!1;for(const[p,m]of r)if(!o.has(p)||!Object.is(m,o.get(p)))return!1;return!0},et=(t,e)=>{const r=t[Symbol.iterator](),o=e[Symbol.iterator]();let p=r.next(),m=o.next();for(;!p.done&&!m.done;){if(!Object.is(p.value,m.value))return!1;p=r.next(),m=o.next()}return!!p.done&&!!m.done};function tt(t,e){return Object.is(t,e)?!0:typeof t!="object"||t===null||typeof e!="object"||e===null||Object.getPrototypeOf(t)!==Object.getPrototypeOf(e)?!1:ge(t)&&ge(e)?xe(t)&&xe(e)?ye(t,e):et(t,e):ye({entries:()=>Object.entries(t)},{entries:()=>Object.entries(e)})}const re=Ze((t,e)=>{function r(){var x;const{accumulated:o,startTime:p,infos:m,estimatedMemory:h}=e(),f=(x=e().log)==null?void 0:x.maxMemory,{totalFrames:g,log:s,gl:c,max:a}=o,d={calls:c.calls/g,triangles:c.triangles/g,points:c.points/g,lines:c.lines/g},l={gpu:s.gpu/g,cpu:s.cpu/g,mem:s.mem/g,fps:s.fps/g};return{sessionTime:(window.performance.now()-p)/1e3,infos:m,memory:h,log:l,gl:d,max:a,maxMemory:f,totalFrames:g}}return{log:null,paused:!1,triggerProgramsUpdate:0,startTime:0,customData:0,fpsLimit:60,overclockingFps:!1,estimatedMemory:{vram:0,tex:0,geo:0,ram:0},accumulated:{totalFrames:0,gl:{calls:0,triangles:0,points:0,lines:0,counts:0},log:{gpu:0,cpu:0,mem:0,fps:0},max:{gl:{calls:0,triangles:0,points:0,lines:0,counts:0},log:{gpu:0,cpu:0,mem:0,fps:0}}},chart:{data:{fps:[],cpu:[],gpu:[],mem:[]},circularId:0},gl:void 0,objectWithMaterials:null,scene:void 0,programs:new Map,sceneLength:void 0,tab:"infos",getReport:r}}),I=t=>re(t,tt);Object.assign(I,re);const{getState:A,setState:M}=re,T={value:0,fpsLimit:60,isOverLimit:0},W=t=>(t==null?void 0:t.reduce((e,r)=>e+r,0))/t.length;class rt{constructor(e={}){this.names=[""],this.finished=[],this.paused=!1,this.overClock=!1,this.queryHasResult=!1,this.queryCreated=!1,this.isWebGL2=!0,this.memAccums=[],this.gpuAccums=[],this.activeAccums=[],this.logsAccums={mem:[],gpu:[],cpu:[],fps:[],fpsFixed:[]},this.fpsChart=[],this.gpuChart=[],this.cpuChart=[],this.memChart=[],this.paramLogger=()=>{},this.glFinish=()=>{},this.chartLogger=()=>{},this.chartLen=60,this.logsPerSecond=10,this.maxMemory=1500,this.chartHz=10,this.startCpuProfiling=!1,this.lastCalculateFixed=0,this.chartFrame=0,this.gpuTimeProcess=0,this.chartTime=0,this.activeQueries=0,this.circularId=0,this.detected=0,this.frameId=0,this.rafId=0,this.idleCbId=0,this.checkQueryId=0,this.uuid=void 0,this.currentCpu=0,this.currentMem=0,this.paramFrame=0,this.paramTime=0,this.now=()=>{},this.t0=0,window.GLPerf=window.GLPerf||{},Object.assign(this,e),this.fpsChart=new Array(this.chartLen).fill(0),this.gpuChart=new Array(this.chartLen).fill(0),this.cpuChart=new Array(this.chartLen).fill(0),this.memChart=new Array(this.chartLen).fill(0),this.now=()=>window.performance&&window.performance.now?window.performance.now():Date.now(),this.initGpu(),this.is120hz()}initGpu(){this.uuid=Te.MathUtils.generateUUID(),this.gl&&(this.isWebGL2=!0,this.extension||(this.extension=this.gl.getExtension("EXT_disjoint_timer_query_webgl2")),this.extension===null&&(this.isWebGL2=!1))}is120hz(){let e=0;const r=o=>{++e<20?this.rafId=window.requestAnimationFrame(r):(this.detected=Math.ceil(1e3*e/(o-this.t0)/70),window.cancelAnimationFrame(this.rafId)),this.t0||(this.t0=o)};this.rafId=window.requestAnimationFrame(r)}addUI(e){this.names.indexOf(e)===-1&&(this.names.push(e),this.gpuAccums.push(0),this.activeAccums.push(!1))}nextFps(e){const r=16.666666666666668,o=r-e.timeRemaining(),p=r*T.fpsLimit/10/o;p<0||(T.value=p,T.isOverLimit<25?T.isOverLimit++:M({overclockingFps:!0}))}nextFrame(e){this.frameId++;const r=e||this.now(),o=r-this.paramTime;let p=0;if(this.frameId<=1)this.paramFrame=this.frameId,this.paramTime=r;else if(r>=this.paramTime){this.maxMemory=window.performance.memory?window.performance.memory.jsHeapSizeLimit/1048576:0;const m=this.frameId-this.paramFrame,h=m*1e3/o,f=A().overclockingFps?T.value:h;if(p=this.isWebGL2?this.gpuAccums[0]:this.gpuAccums[0]/o,this.isWebGL2?this.gpuAccums[0]=0:Promise.all(this.finished).then(()=>{this.gpuAccums[0]=0,this.finished=[]}),this.currentMem=Math.round(window.performance&&window.performance.memory?window.performance.memory.usedJSHeapSize/1048576:0),window.performance&&this.startCpuProfiling){window.performance.mark("cpu-finished");const g=performance.measure("cpu-duration","cpu-started","cpu-finished");this.currentCpu=(g==null?void 0:g.duration)||0,this.logsAccums.cpu.push(this.currentCpu),this.startCpuProfiling=!1}this.logsAccums.mem.push(this.currentMem),this.logsAccums.fpsFixed.push(h),this.logsAccums.fps.push(f),this.logsAccums.gpu.push(p),this.overClock&&typeof window.requestIdleCallback<"u"&&(T.isOverLimit>0&&f>h?T.isOverLimit--:A().overclockingFps&&M({overclockingFps:!1})),r>=this.paramTime+1e3/this.logsPerSecond&&(this.paramLogger({cpu:W(this.logsAccums.cpu),gpu:W(this.logsAccums.gpu),mem:W(this.logsAccums.mem),fps:W(this.logsAccums.fps),duration:Math.round(o),maxMemory:this.maxMemory,frameCount:m}),this.logsAccums.mem=[],this.logsAccums.fps=[],this.logsAccums.gpu=[],this.logsAccums.cpu=[],this.paramFrame=this.frameId,this.paramTime=r),this.overClock&&r-this.lastCalculateFixed>=2*1e3&&(this.lastCalculateFixed=e,T.fpsLimit=Math.round(W(this.logsAccums.fpsFixed)/10)*100,M({fpsLimit:T.fpsLimit/10}),this.logsAccums.fpsFixed=[],this.paramFrame=this.frameId,this.paramTime=r)}if(!this.detected||!this.chartFrame)this.chartFrame=this.frameId,this.chartTime=r,this.circularId=0;else{const m=r-this.chartTime;let h=this.chartHz*m/1e3;for(;--h>0&&this.detected;){const g=(this.frameId-this.chartFrame)/m*1e3,s=A().overclockingFps?T.value:g;this.fpsChart[this.circularId%this.chartLen]=s;const c=1e3/this.currentMem,a=this.currentCpu,d=(this.isWebGL2?this.gpuAccums[1]*2:Math.round(this.gpuAccums[1]/o*100))+4;d>0&&(this.gpuChart[this.circularId%this.chartLen]=d),a>0&&(this.cpuChart[this.circularId%this.chartLen]=a),c>0&&(this.memChart[this.circularId%this.chartLen]=c);for(let l=0;l<this.names.length;l++)this.chartLogger({i:l,data:{fps:this.fpsChart,gpu:this.gpuChart,cpu:this.cpuChart,mem:this.memChart},circularId:this.circularId});this.circularId++,this.chartFrame=this.frameId,this.chartTime=r}}}startGpu(){const e=this.gl,r=this.extension;if(!(!e||!r)&&this.isWebGL2){let o=!1,p,m;if(this.query){this.queryHasResult=!1;let h=this.query;if(o=e.getQueryParameter(h,e.QUERY_RESULT_AVAILABLE),p=e.getParameter(r.GPU_DISJOINT_EXT),o&&!p){m=e.getQueryParameter(this.query,e.QUERY_RESULT);const f=m*1e-6;(o||p)&&(e.deleteQuery(this.query),h=null),o&&f>0&&(p||this.activeAccums.forEach((g,s)=>{this.gpuAccums[s]=f}))}}(o||!this.query)&&(this.queryCreated=!0,this.query=e.createQuery(),e.beginQuery(r.TIME_ELAPSED_EXT,this.query))}}endGpu(){const e=this.extension,r=this.gl;this.isWebGL2&&this.queryCreated&&r.getQuery(e.TIME_ELAPSED_EXT,r.CURRENT_QUERY)&&r.endQuery(e.TIME_ELAPSED_EXT)}begin(e){this.startGpu(),this.updateAccums(e)}end(e){this.endGpu(),this.updateAccums(e)}updateAccums(e){let r=this.names.indexOf(e);r===-1&&(r=this.names.length,this.addUI(e));const o=this.now();this.activeAccums[r]=!this.activeAccums[r],this.t0=o}dispose(){const e=this.gl,r=this.extension;try{this.isWebGL2&&e&&r&&e.getQuery(r.TIME_ELAPSED_EXT,e.CURRENT_QUERY)&&e.endQuery(r.TIME_ELAPSED_EXT)}catch{}if(e&&this.query){try{e.deleteQuery(this.query)}catch{}this.query=null}this.queryCreated=!1,this.queryHasResult=!1}}const st=t=>{t.forEach(e=>{const{meshes:r}=e;if(!r)return;const o={total:0,type:"Triangle",data:[]};Object.keys(r).forEach(p=>{const m=r[p],{geometry:h,material:f}=m,g=h.index,s=h.attributes.position;if(!s)return;let c=1;f.wireframe===!0&&(c=0);const a=g!==null?g.count:s.count,d=h.drawRange.start*c,l=h.drawRange.count*c,i=d,x=Math.min(a,d+l)-1;let u=1;const _=m.count||1;let v="Triangle",E=0;m.isMesh?f.wireframe===!0?(v="Line",u=u/2):(v="Triangle",u=u/3):m.isLine?(v="Line",m.isLineSegments?u=u/2:m.isLineLoop?u=u:u=u-1):m.isPoints?(v="Point",u=u):m.isSprite&&(v="Triangle",u=u/3);const b=Math.round(Math.max(0,x-i+1)*(u*_));b>E&&(E=b,o.type=v),o.total+=b,o.data.push({drawCount:b,type:v}),m.userData.drawCount={type:v,count:b}}),e.drawCounts=o})};var Fe={exports:{}};(function(t){var e=Object.prototype.hasOwnProperty,r="~";function o(){}Object.create&&(o.prototype=Object.create(null),new o().__proto__||(r=!1));function p(g,s,c){this.fn=g,this.context=s,this.once=c||!1}function m(g,s,c,a,d){if(typeof c!="function")throw new TypeError("The listener must be a function");var l=new p(c,a||g,d),i=r?r+s:s;return g._events[i]?g._events[i].fn?g._events[i]=[g._events[i],l]:g._events[i].push(l):(g._events[i]=l,g._eventsCount++),g}function h(g,s){--g._eventsCount===0?g._events=new o:delete g._events[s]}function f(){this._events=new o,this._eventsCount=0}f.prototype.eventNames=function(){var s=[],c,a;if(this._eventsCount===0)return s;for(a in c=this._events)e.call(c,a)&&s.push(r?a.slice(1):a);return Object.getOwnPropertySymbols?s.concat(Object.getOwnPropertySymbols(c)):s},f.prototype.listeners=function(s){var c=r?r+s:s,a=this._events[c];if(!a)return[];if(a.fn)return[a.fn];for(var d=0,l=a.length,i=new Array(l);d<l;d++)i[d]=a[d].fn;return i},f.prototype.listenerCount=function(s){var c=r?r+s:s,a=this._events[c];return a?a.fn?1:a.length:0},f.prototype.emit=function(s,c,a,d,l,i){var x=r?r+s:s;if(!this._events[x])return!1;var u=this._events[x],_=arguments.length,v,E;if(u.fn){switch(u.once&&this.removeListener(s,u.fn,void 0,!0),_){case 1:return u.fn.call(u.context),!0;case 2:return u.fn.call(u.context,c),!0;case 3:return u.fn.call(u.context,c,a),!0;case 4:return u.fn.call(u.context,c,a,d),!0;case 5:return u.fn.call(u.context,c,a,d,l),!0;case 6:return u.fn.call(u.context,c,a,d,l,i),!0}for(E=1,v=new Array(_-1);E<_;E++)v[E-1]=arguments[E];u.fn.apply(u.context,v)}else{var b=u.length,L;for(E=0;E<b;E++)switch(u[E].once&&this.removeListener(s,u[E].fn,void 0,!0),_){case 1:u[E].fn.call(u[E].context);break;case 2:u[E].fn.call(u[E].context,c);break;case 3:u[E].fn.call(u[E].context,c,a);break;case 4:u[E].fn.call(u[E].context,c,a,d);break;default:if(!v)for(L=1,v=new Array(_-1);L<_;L++)v[L-1]=arguments[L];u[E].fn.apply(u[E].context,v)}}return!0},f.prototype.on=function(s,c,a){return m(this,s,c,a,!1)},f.prototype.once=function(s,c,a){return m(this,s,c,a,!0)},f.prototype.removeListener=function(s,c,a,d){var l=r?r+s:s;if(!this._events[l])return this;if(!c)return h(this,l),this;var i=this._events[l];if(i.fn)i.fn===c&&(!d||i.once)&&(!a||i.context===a)&&h(this,l);else{for(var x=0,u=[],_=i.length;x<_;x++)(i[x].fn!==c||d&&!i[x].once||a&&i[x].context!==a)&&u.push(i[x]);u.length?this._events[l]=u.length===1?u[0]:u:h(this,l)}return this},f.prototype.removeAllListeners=function(s){var c;return s?(c=r?r+s:s,this._events[c]&&h(this,c)):(this._events=new o,this._eventsCount=0),this},f.prototype.off=f.prototype.removeListener,f.prototype.addListener=f.prototype.on,f.prefixed=r,f.EventEmitter=f,t.exports=f})(Fe);var nt=Fe.exports;const it=Ae(nt),se=new it;function at(t,e,r){return se.on(t,e)}function ot(t,e,r){se.removeListener(t,e,(r==null?void 0:r.context)??null,r==null?void 0:r.once)}function ct(t,e){se.emit(t,e)}function lt(t){let e=0,r=0;const o=new Set,p=new Set;return t.traverse(m=>{if(m.isMesh){const h=m;if(h.geometry&&!o.has(h.geometry.uuid)){o.add(h.geometry.uuid);const s=h.geometry.attributes;for(const c in s){const a=s[c];a.array&&(r+=a.array.byteLength)}h.geometry.index&&h.geometry.index.array&&(r+=h.geometry.index.array.byteLength)}const f=h.material;(Array.isArray(f)?f:[f]).forEach(s=>{if(s)for(const c in s){const a=s[c];if(a&&a.isTexture){const d=a;if(!p.has(d.uuid)){if(p.add(d.uuid),d.isCompressedTexture&&d.mipmaps)d.mipmaps.forEach(l=>{l.data&&(e+=l.data.byteLength)});else if(d.image){const l=d.image,i=l.width||0,x=l.height||0,u=d.generateMipmaps?1.33:1;e+=i*x*4*u}}}}})}}),{geometry:r,texture:e,total:r+e}}const ve=O.Object3D.prototype.updateMatrixWorld,_e=O.Object3D.prototype.updateWorldMatrix,Ee=O.Object3D.prototype.updateMatrix,je=["calls","triangles","points","lines"],be=["gpu","cpu","mem","fps"],ut=t=>/^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}$/.test(t),Se=(t,e)=>{t.defines||(t.defines={}),t.defines.muiPerf||(t.defines=Object.assign(t.defines||{},{muiPerf:t.uuid}),t.needsUpdate=!0);const r=t.uuid;return e[r]||(e[r]={meshes:{},material:t}),t.needsUpdate=!1,r},ft=t=>t==="muiPerf",mt=({overClock:t,logsPerSecond:e,chart:r,deepAnalyze:o,matrixUpdate:p})=>{const{gl:m,scene:h}=N.useThree();M({gl:m,scene:h});const f=1e3;let g=0;const s=j.useMemo(()=>{const c=new rt({trackGPU:!0,overClock:t,chartLen:r?r.length:120,chartHz:r?r.hz:60,logsPerSecond:e||10,gl:m.getContext(),chartLogger:u=>{M({chart:u})},paramLogger:u=>{var L;const _={maxMemory:u.maxMemory,gpu:u.gpu,cpu:u.cpu,mem:u.mem,fps:u.fps,totalTime:u.duration,frameCount:u.frameCount};M({log:_});const{accumulated:v}=A(),E=m.info.render;v.totalFrames++,v.gl.calls+=E.calls,v.gl.triangles+=E.triangles,v.gl.points+=E.points,v.gl.lines+=E.lines,v.log.gpu+=u.gpu,v.log.cpu+=u.cpu,v.log.mem+=u.mem,v.log.fps+=u.fps;for(let S=0;S<je.length;S++){const w=je[S],C=E[w];C>v.max.gl[w]&&(v.max.gl[w]=C)}for(let S=0;S<be.length;S++){const w=be[S],C=u[w];C>v.max.log[w]&&(v.max.log[w]=C)}M({accumulated:v});const b={calls:m.info.render.calls,triangles:m.info.render.triangles,points:m.info.render.points,lines:m.info.render.lines,geometries:m.info.memory.geometries,textures:m.info.memory.textures,programs:((L=m.info.programs)==null?void 0:L.length)||0};ct("log",[_,b])}}),a=m.getContext();let d=null,l=null;const i=a.getExtension("WEBGL_debug_renderer_info"),x=a.getParameter(a.VERSION);return i&&(d=a.getParameter(i.UNMASKED_RENDERER_WEBGL),l=a.getParameter(i.UNMASKED_VENDOR_WEBGL)),l||(l="Unknown vendor"),d||(d=a.getParameter(a.RENDERER)),M({startTime:window.performance.now(),infos:{version:x,renderer:d,vendor:l}}),c},[t,r,e,m]);return j.useEffect(()=>{s&&(s.overClock=t||!1,t===!1&&(M({overclockingFps:!1}),T.value=0,T.isOverLimit=0),s.chartHz=(r==null?void 0:r.hz)||60,s.chartLen=(r==null?void 0:r.length)||120)},[s,t,r==null?void 0:r.hz,r==null?void 0:r.length]),j.useEffect(()=>{if(!m.info)return;m.info.autoReset=!1,p&&(O.Object3D.prototype.updateMatrixWorld=function(...d){return this.matrixWorldNeedsUpdate||d[0],ve.apply(this,d)},O.Object3D.prototype.updateWorldMatrix=function(...d){return _e.apply(this,d)},O.Object3D.prototype.updateMatrix=function(...d){return Ee.apply(this,d)});const c=N.addEffect(()=>{A().paused&&M({paused:!1}),s==null||s.begin("profiler"),window.performance&&(window.performance.mark("cpu-started"),s.startCpuProfiling=!0),m.info.reset()}),a=N.addAfterEffect(()=>{var x,u;s==null||s.end("profiler"),s&&!s.paused&&(s.nextFrame(window.performance.now()),t&&typeof window.requestIdleCallback<"u"&&(s.idleCbId=requestIdleCallback(s.nextFps)));const d=window.performance.now();if(d-g>f){g=d;const _=lt(h),v=s.currentMem||0;M({estimatedMemory:{vram:_.total/1024/1024,tex:_.texture/1024/1024,geo:_.geometry/1024/1024,ram:v}})}if(!o)return;const l={},i=new Map;h.traverse(_=>{if(_ instanceof O.Mesh||_ instanceof O.Points){if(!_.material)return;let v=_.material.uuid;const E=Array.isArray(_.material)&&_.material.length>1;v=Se(E?_.material[1]:_.material,l),l[v].meshes[_.uuid]=_}}),(u=(x=m==null?void 0:m.info)==null?void 0:x.programs)==null||u.forEach(_=>{const v=_.cacheKey.split(","),E=v[v.findIndex(ft)+1];if(ut(E)&&l[E]){const{material:b,meshes:L}=l[E];i.set(E,{program:_,material:b,meshes:L,drawCounts:{total:0,type:"triangle",data:[]},expand:!1,visible:!0})}}),i.size!==A().programs.size&&(st(i),M({programs:i,triggerProgramsUpdate:A().triggerProgramsUpdate+1}))});return()=>{var d;s&&typeof window.cancelIdleCallback<"u"&&window.cancelIdleCallback(s.idleCbId),(d=s==null?void 0:s.dispose)==null||d.call(s),p&&(O.Object3D.prototype.updateMatrixWorld=ve,O.Object3D.prototype.updateWorldMatrix=_e,O.Object3D.prototype.updateMatrix=Ee),c(),a()}},[s,m,h,o,t,p]),j.useEffect(()=>{const c=N.addTail(()=>(s&&(s.paused=!0,M({paused:!0,log:{maxMemory:0,gpu:0,mem:0,cpu:0,fps:0,totalTime:0,frameCount:0}})),!1));return()=>c()},[s]),null};function ne(t,e,r=[],o){const p=j.useRef(e);j.useEffect(()=>{p.current=e},[e]),j.useEffect(()=>{const m=f=>{var g;return(g=p.current)==null?void 0:g.call(p,f)},h=at(t,m);return()=>ot(t,m,{...o,context:h})},[t,o==null?void 0:o.once,...r])}function dt(t){let e=0;for(const o in t.attributes){const p=t.getAttribute(o);e+=p.count*p.itemSize*p.array.BYTES_PER_ELEMENT}const r=t.getIndex();return e+=r?r.count*r.itemSize*r.array.BYTES_PER_ELEMENT:0,e}const pt="_perfS_ans5i_1",ht="_containerHeight_ans5i_16",gt="_topLeft_ans5i_21",xt="_topRight_ans5i_22",yt="_bottomLeft_ans5i_23",vt="_bottomRight_ans5i_24",_t="_minimal_ans5i_26",Et="_perfIContainer_ans5i_30",jt="_perfI_ans5i_30",bt="_perfB_ans5i_69",St="_toggleContainer_ans5i_83",wt="_toggle_ans5i_83",Lt="_activeTab_ans5i_105",Ct="_containerScroll_ans5i_110",Ot="_programGeo_ans5i_115",Mt="_programHeader_ans5i_120",It="_headerLeft_ans5i_149",Tt="_programTitle_ans5i_156",Rt="_toggleArrow_ans5i_166",At="_programConsole_ans5i_200",Nt="_programsContainer_ans5i_218",Ft="_headerRight_ans5i_222",Pt="_metricBadge_ans5i_228",Dt="_programsULHeader_ans5i_246",Ut="_programsUL_ans5i_246",Gt="_programsGeoLi_ans5i_309",Wt="_graph_ans5i_324",Bt="_visibilityBtn_ans5i_354",Ht="_active_ans5i_105",y={perfS:pt,containerHeight:ht,topLeft:gt,topRight:xt,bottomLeft:yt,bottomRight:vt,minimal:_t,perfIContainer:Et,perfI:jt,perfB:bt,toggleContainer:St,toggle:wt,activeTab:Lt,containerScroll:Ct,programGeo:Ot,programHeader:Mt,headerLeft:It,programTitle:Tt,toggleArrow:Rt,programConsole:At,programsContainer:Nt,headerRight:Ft,metricBadge:Pt,programsULHeader:Dt,programsUL:Ut,programsGeoLi:Gt,graph:Wt,visibilityBtn:Bt,active:Ht},we=(t,e)=>{var p,m;const r=h=>{switch(h){case 1e3:return"RepeatWrapping";case 1001:return"ClampToEdgeWrapping";case 1002:return"MirroredRepeatWrapping";default:return"ClampToEdgeWrapping"}},o=h=>{switch(h){case 3e3:return"LinearEncoding";case 3001:return"sRGBEncoding";case 3002:return"RGBEEncoding";case 3003:return"LogLuvEncoding";case 3004:return"RGBM7Encoding";case 3005:return"RGBM16Encoding";case 3006:return"RGBDEncoding";case 3007:return"GammaEncoding";default:return"ClampToEdgeWrapping"}};return{name:t,url:(p=e==null?void 0:e.image)==null?void 0:p.currentSrc,encoding:o(e.encoding),wrapT:r(e.wrapT),flipY:(m=e.flipY)==null?void 0:m.toString()}},ee=({value:t,label:e,unit:r,title:o})=>t==null||t===0||t==="0"?null:n.jsxs("div",{className:y.metricBadge,title:o,children:[n.jsx("b",{children:t})," ",r||e]}),Vt=({program:t,material:e,setTexNumber:r})=>{const o=I(h=>h.gl),[p,m]=j.useState(null);return j.useEffect(()=>{if(o){const h=t==null?void 0:t.getUniforms();let f=0;const g=new Map;h&&h.seq&&h.seq.forEach(s=>{if(!s.id.includes("uTroika")&&!["isOrthographic","uvTransform","lightProbe","projectionMatrix","viewMatrix","normalMatrix","modelMatrix","modelViewMatrix"].includes(s.id)){const c=[],a={name:s.id};s.cache&&(s.cache.forEach(d=>{typeof d<"u"&&c.push(d.toString().substring(0,4))}),a.value=c.join(),e[s.id]&&e[s.id].image&&(f++,a.value=we(s.id,e[s.id])),a.value||(a.value="empty"),g.set(s.id,a))}}),e.uniforms&&Object.keys(e.uniforms).forEach(s=>{const c=e.uniforms[s];if(c.value){const{value:a}=c,d={name:s};if(s.includes("uTroika"))return;if(a.isTexture)f++,d.value=we(s,a);else{let l=JSON.stringify(a);try{l=JSON.stringify(a)}catch{l=a.toString()}d.value=l}g.set(s,d)}}),r(f),m(g)}},[o,e,t,r]),n.jsx("ul",{className:y.programsUL,children:p&&Array.from(p.values()).map(h=>n.jsx("span",{children:typeof h.value=="string"?n.jsx("li",{children:n.jsxs("span",{children:[h.name," :"," ",n.jsxs("b",{children:[h.value.substring(0,30),h.value.length>30?"...":""]})]})}):n.jsxs(n.Fragment,{children:[n.jsx("li",{children:n.jsxs("b",{children:[h.value.name,":"]})}),n.jsxs("div",{children:[Object.keys(h.value).map(f=>f!=="name"?n.jsx("div",{children:f==="url"?n.jsx("a",{href:h.value[f],target:"_blank",rel:"noreferrer",children:n.jsx("img",{src:h.value[f],alt:"texture"})}):n.jsxs("li",{children:[f,": ",n.jsx("b",{children:h.value[f]})]})},f):null),n.jsxs("button",{className:y.programConsole,onClick:()=>{var f;console.info(e[h.value.name]||((f=e==null?void 0:e.uniforms[h.value.name])==null?void 0:f.value))},children:["console.info(",h.value.name,");"]})]})]})},h.name))})},kt=({el:t})=>{const[e,r]=j.useState(t.visible),[o,p]=j.useState(t.expand),[m,h]=j.useState(0),{meshes:f,program:g,material:s}=t,c=I(i=>i.gl),a=()=>{if(!c||!c.info||!c.info.render)return 0;const i=c.info.render.triangles+c.info.render.lines+c.info.render.points;if(i===0)return 0;const x=Math.round(t.drawCounts.total/i*100*10)/10;return isFinite(x)&&x||0},d=Object.keys(f).length,l=a();return n.jsxs("div",{className:y.programGeo,children:[n.jsxs("div",{className:y.programHeader,onClick:()=>{Object.keys(f).forEach(i=>{f[i].material.wireframe=!1}),p(!o)},children:[n.jsxs("div",{className:y.headerLeft,children:[n.jsx("div",{className:y.toggleArrow,style:{transform:o?"rotate(90deg)":"rotate(0deg)"},children:"▶"}),g&&n.jsx("span",{className:y.programTitle,children:g.name})]}),n.jsxs("div",{className:y.headerRight,children:[n.jsx(ee,{value:d,unit:d>1?"users":"user"}),n.jsx(ee,{value:m,unit:"tex"}),t.drawCounts.total>0&&n.jsxs("div",{className:y.metricBadge,title:`${l}% of total render`,children:[n.jsx("b",{children:t.drawCounts.total}),t.drawCounts.type==="Triangle"?"tris":t.drawCounts.type,t.visible&&!t.material.wireframe&&n.jsxs("span",{style:{marginLeft:"4px",opacity:.6,fontSize:"9px"},children:["(",l,"%)"]})]}),s.glslVersion==="300 es"&&n.jsx(ee,{value:"300",unit:"es"}),n.jsx("div",{className:`${y.visibilityBtn} ${e?y.active:""}`,onPointerEnter:()=>{Object.keys(f).forEach(i=>f[i].material.wireframe=!0)},onPointerLeave:()=>{Object.keys(f).forEach(i=>f[i].material.wireframe=!1)},onClick:i=>{i.stopPropagation();const x=!e;Object.keys(f).forEach(u=>{f[u]&&(f[u].visible=x)}),r(x)},children:e?"👁":"×"})]})]}),n.jsxs("div",{style:{display:o?"block":"none"},children:[n.jsx("div",{className:y.programsULHeader,style:{marginTop:"4px"},children:"Uniforms"}),n.jsx(Vt,{program:g,material:s,setTexNumber:h}),n.jsx("div",{className:y.programsULHeader,children:"Geometries"}),n.jsx("ul",{className:y.programsUL,children:f&&Object.keys(f).map(i=>f[i]&&f[i].geometry&&n.jsx("li",{className:y.programsGeoLi,children:n.jsxs("div",{style:{width:"100%",display:"flex",justifyContent:"space-between",alignItems:"center"},children:[n.jsx("span",{children:f[i].geometry.type}),f[i].userData&&f[i].userData.drawCount&&n.jsxs("span",{style:{color:"#aaa",fontSize:"10px",display:"flex",gap:"6px"},children:[n.jsxs("span",{children:[n.jsx("b",{children:f[i].userData.drawCount.count})," ",f[i].userData.drawCount.type,"s"]}),n.jsx("span",{style:{opacity:.3},children:"|"}),n.jsxs("span",{children:[n.jsx("b",{children:Math.round(dt(f[i].geometry)/1024*100)/100})," ","KB"]})]})]})},i))}),n.jsxs("button",{className:y.programConsole,onClick:()=>console.info(s),children:["Log Material (",s.type,")"]})]})]})},qt=()=>{I(e=>e.triggerProgramsUpdate);const t=I(e=>e.programs);return n.jsx("div",{className:y.programsContainer,onWheel:e=>e.stopPropagation(),children:t&&Array.from(t.values()).map(e=>e?n.jsx(kt,{el:e},e.material.uuid):null)})},zt=({minimal:t,chart:e={length:120,hz:60}})=>{const r=j.useMemo(()=>({fps:new Float32Array(e.length*3),cpu:new Float32Array(e.length*3),gpu:new Float32Array(e.length*3)}),[e]),o=j.useRef(null),p=j.useRef(null),m=j.useRef(null),h=j.useRef(null),f=j.useMemo(()=>new O.Vector3(0,0,0),[]),g=(s,c=1,a,d)=>{let l=0;const{width:i,height:x}=d,u=A().chart.data[s];if(!u||u.length===0)return;const _=t?2:6,v=t?12:50,E=u.length;for(let b=0;b<E;b++){const L=(A().chart.circularId+b+1)%E;u[L]!==void 0&&(u[L]>l&&(l=u[L]*c),f.set(_+b/(E-1)*(i-_*2)-i/2,Math.min(100,u[L])*c/100*(x-_*2-v)-x/2,0),f.toArray(a.attributes.position.array,b*3))}a.attributes.position.needsUpdate=!0};return N.useFrame(function({viewport:c}){g("fps",1,o.current,c),p.current&&p.current.color.set(A().overclockingFps?R.overClock:R.fps),g("gpu",5,m.current,c),g("cpu",5,h.current,c)}),n.jsxs(n.Fragment,{children:[n.jsxs("line",{onUpdate:s=>{s.updateMatrix(),s.matrixWorld.copy(s.matrix)},children:[n.jsx("bufferGeometry",{ref:o,children:n.jsx("bufferAttribute",{attach:"attributes-position",count:e.length,args:[r.fps,3],array:r.fps,itemSize:3,usage:O.DynamicDrawUsage,needsUpdate:!0})}),n.jsx("lineBasicMaterial",{ref:p,color:R.fps,transparent:!0,opacity:.5})]}),n.jsxs("line",{onUpdate:s=>{s.updateMatrix(),s.matrixWorld.copy(s.matrix)},children:[n.jsx("bufferGeometry",{ref:m,children:n.jsx("bufferAttribute",{attach:"attributes-position",count:e.length,array:r.gpu,args:[r.gpu,3],itemSize:3,usage:O.DynamicDrawUsage,needsUpdate:!0})}),n.jsx("lineBasicMaterial",{color:R.gpu,transparent:!0,opacity:.5})]}),n.jsxs("line",{onUpdate:s=>{s.updateMatrix(),s.matrixWorld.copy(s.matrix)},children:[n.jsx("bufferGeometry",{ref:h,children:n.jsx("bufferAttribute",{attach:"attributes-position",count:e.length,array:r.cpu,args:[r.cpu,3],itemSize:3,usage:O.DynamicDrawUsage,needsUpdate:!0})}),n.jsx("lineBasicMaterial",{color:R.cpu,transparent:!0,opacity:.5})]})]})},$t=({chart:t,showGraph:e=!0,antialias:r=!0,minimal:o})=>{const p=j.useRef(void 0),m=I(h=>h.paused);return n.jsx("div",{className:y.graph,style:{display:"flex",marginTop:6,position:"absolute",width:"100%",height:`${o?37:e?100:60}px`},children:n.jsx(N.Canvas,{ref:p,orthographic:!0,camera:{rotation:[0,0,0]},dpr:r?[1,2]:1,gl:{antialias:!0,alpha:!0,stencil:!1,depth:!1},onCreated:({scene:h})=>{h.traverse(f=>{f.matrixWorldAutoUpdate=!1,f.matrixAutoUpdate=!1})},flat:!0,style:{marginBottom:"-42px",position:"relative",pointerEvents:"none",background:"transparent !important",width:"100%",height:`${o?37:e?100:60}px`},children:m?null:n.jsxs(n.Fragment,{children:[n.jsx(Kt,{}),e&&n.jsx(zt,{minimal:o,chart:t})]})})})},Kt=()=>(N.useFrame(function({gl:e,scene:r,camera:o}){o.updateMatrix(),o.matrixWorld.copy(o.matrix),o.matrixWorldInverse.copy(o.matrixWorld).invert(),e.render(r,o)},1/0),null),Le={fps:{fg:"#00ffff",bg:"#000022"},cpu:{fg:"#00ff00",bg:"#002200"},gpu:{fg:"#ff0080",bg:"#220011"}},D=[{key:"fps",label:"FPS",maxVal:120},{key:"cpu",label:"CPU",maxVal:40},{key:"gpu",label:"GPU",maxVal:40}],U=48,Pe=15,z=2,H=Pe,B=U-H-2,$=6,Qt=15,Ce=1e3/Qt;function Yt({show:t=!0,opacity:e=1,className:r,style:o}){const p=I(l=>l.paused),m=j.useRef(null),h=j.useRef(null),[f,g]=j.useState(300),s=j.useMemo(()=>Math.max(1,Math.round(window.devicePixelRatio||1)),[]);j.useEffect(()=>{if(!h.current)return;const l=new ResizeObserver(i=>{for(const x of i)g(x.contentRect.width)});return l.observe(h.current),()=>l.disconnect()},[]);const c=(D.length-1)*$,a=Math.max(0,(f-c)/D.length),d=Math.max(0,a-z);return j.useEffect(()=>{const l=m.current;if(!l)return;l.width=f*s,l.height=U*s,l.style.width="100%",l.style.height=`${U}px`;const i=l.getContext("2d");if(i){i.setTransform(1,0,0,1,0,0),i.scale(s,s),i.imageSmoothingEnabled=!1,i.font="bold 9px Roboto Mono, monospace",i.textBaseline="top",i.clearRect(0,0,f,U);for(let x=0;x<D.length;x++){const{key:u}=D[x],_=x*(a+$),{bg:v}=Le[u];i.fillStyle=v,i.globalAlpha=e,i.fillRect(_,0,a,U),i.globalAlpha=1}}},[s,f,a,e]),j.useEffect(()=>{if(!t)return;const l=m.current;if(!l)return;const i=l.getContext("2d");if(!i)return;let x=0,u=0;const _={fps:{min:1/0,max:0},cpu:{min:1/0,max:0},gpu:{min:1/0,max:0}};function v(E){if(!l||!i||(x=requestAnimationFrame(v),p))return;const b=E-u;if(b<Ce)return;u=E-b%Ce;const L=A(),S=L.chart.circularId;for(let w=0;w<D.length;w++){const{key:C,label:De,maxVal:ie}=D[w],G=w*(a+$),{fg:ae,bg:oe}=Le[C],V=L.chart.data[C],K=(V==null?void 0:V.length)||0;let k=0;if(K>0){const We=(S-1+K)%K;k=V[We]??0}const P=_[C];P.min=Math.min(P.min,k),P.max=Math.max(P.max,k),i.fillStyle=oe,i.globalAlpha=1,i.fillRect(G,0,a,Pe),i.fillStyle=ae;const Ue=`${De} (${Math.round(P.min)}-${Math.round(P.max)})`;i.fillText(Ue,G+3,2),d>1&&i.drawImage(l,(G+z+1)*s,H*s,(d-1)*s,B*s,G+z,H,d-1,B);const ce=G+z+d-1;i.fillStyle=oe,i.globalAlpha=1,i.fillRect(ce,H,1,B),i.fillStyle=ae,i.globalAlpha=1;const Ge=Math.min(k,ie)/ie,Q=Math.round(Ge*B);Q>0&&i.fillRect(ce,H+B-Q,1,Q)}}return x=requestAnimationFrame(v),()=>cancelAnimationFrame(x)},[p,t,s,a,d]),t?n.jsx("div",{ref:h,className:r,style:{width:"100%",...o,marginTop:$},children:n.jsx("canvas",{ref:m,style:{display:"block",pointerEvents:"none",width:"100%",height:`${U}px`}})}):null}const R={overClock:"#ff6eff",fps:"#00FFFF",cpu:"#00FF00",gpu:"#FD007F",memory:"#FFD000",vram:"#FF8C00"},Oe=({metric:t,decimal:e=0,suffix:r=""})=>{const o=j.useRef(null);return ne("log",p=>{const[m]=p;if(m&&o.current){const h=m[t];o.current.innerText=(typeof h=="number"?h.toFixed(e):"0")+r}}),n.jsxs("span",{ref:o,children:["0",r]})},F=({metric:t,suffix:e=""})=>{const r=j.useRef(null);return ne("log",o=>{const[,p]=o;if(p&&r.current){let m=p[t];t==="calls"&&m===1&&(m="--"),r.current.innerText=m+e}}),n.jsxs("span",{ref:r,children:["0",e]})},Me=({type:t})=>{const e=I(r=>r.estimatedMemory[t]);return n.jsxs("span",{children:[e.toFixed(0)," MB"]})},Xt=()=>{const t=I(p=>p.overclockingFps),e=I(p=>p.fpsLimit),r=j.useRef(null);ne("log",p=>{const[m]=p;m&&r.current&&(r.current.innerText=Math.round(m.fps).toString())});const o=t?R.overClock:R.fps;return n.jsxs("div",{className:y.perfI,children:[n.jsxs("span",{className:y.perfB,style:{color:o},children:["FPS ",t?` ${e}🚀`:""]}),n.jsx("small",{className:y.perfSmallI,ref:r,children:"0"})]})},Jt=({showGraph:t,minimal:e})=>I(o=>o.gl)?n.jsxs("div",{className:y.perfIContainer,children:[n.jsx(Xt,{showGraph:t}),n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,style:{color:R.cpu},children:"CPU"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(Oe,{metric:"cpu",decimal:2,suffix:" ms"})})]}),n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,style:{color:R.gpu},children:"GPU"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(Oe,{metric:"gpu",decimal:2,suffix:" ms"})})]}),n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,style:{color:R.memory},children:"MEMORY"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(Me,{type:"ram"})})]}),n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,style:{color:R.vram},children:"VRAM"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(Me,{type:"vram"})})]}),!e&&n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,children:"Calls"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(F,{metric:"calls"})})]})]}):null,Zt=({matrixUpdate:t})=>n.jsxs("div",{className:y.perfIContainer,children:[n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,children:"Geometries"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(F,{metric:"geometries"})})]}),n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,children:"Textures"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(F,{metric:"textures"})})]}),n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,children:"Shaders"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(F,{metric:"programs"})})]}),n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,children:"Triangles"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(F,{metric:"triangles"})})]}),n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,children:"Lines"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(F,{metric:"lines"})})]}),n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,children:"Points"}),n.jsx("small",{className:y.perfSmallI,children:n.jsx(F,{metric:"points"})})]}),t&&n.jsxs("div",{className:y.perfI,children:[n.jsx("span",{className:y.perfB,children:"Matrices"}),n.jsx("small",{className:y.perfSmallI,children:t})]})]}),Ie=({tab:t,title:e,set:r})=>{const o=I(p=>p.tab);return n.jsx("div",{className:`${y.toggle} ${o===t?y.activeTab:""}`,onClick:()=>{r(!0),M({tab:t})},children:e})},er=({openByDefault:t,showGraph:e,deepAnalyze:r,matrixUpdate:o,graphType:p,perfContainerRef:m,antialias:h,chart:f,minimal:g})=>{const[s,c]=j.useState(t||!1),a=I(d=>d.tab);return n.jsxs(n.Fragment,{children:[n.jsxs("div",{style:{display:s?"block":"none",marginTop:"4px"},children:[n.jsx(Zt,{matrixUpdate:o}),e&&(p==="bar"?n.jsx(Yt,{}):n.jsx($t,{perfContainerRef:m,chart:f,showGraph:e,antialias:h,minimal:g,matrixUpdate:o})),s&&n.jsx("div",{className:y.containerScroll,children:a==="programs"&&n.jsx(qt,{})})]}),t&&!r?null:n.jsxs("div",{className:y.toggleContainer,style:s&&e&&p==="line"?{marginTop:50}:{marginTop:6},children:[r&&n.jsx(Ie,{tab:"programs",title:"Programs",set:c}),r&&n.jsx(Ie,{tab:"infos",title:"Infos",set:c}),n.jsx("div",{className:y.toggle,onClick:()=>c(!s),children:s?"Minimize":"More"})]})]})},tr=({showGraph:t=!0,openByDefault:e=!0,className:r,overClock:o=!1,graphType:p="bar",style:m,position:h="top-right",chart:f,logsPerSecond:g,deepAnalyze:s=!1,antialias:c=!0,matrixUpdate:a,minimal:d})=>{const l=j.useRef(null),i=h==="top-left"?y.topLeft:h==="bottom-left"?y.bottomLeft:h==="bottom-right"?y.bottomRight:y.topRight,x=t&&p==="line"&&!s;return n.jsxs(n.Fragment,{children:[n.jsx(mt,{logsPerSecond:g,chart:f,overClock:o,deepAnalyze:s,matrixUpdate:a}),n.jsx(Re,{name:"r3f-perf",children:n.jsxs("div",{className:`${y.perfS} ${i} ${d?y.minimal:""} ${r||""} ${x?y.containerHeight:""}`,style:m,ref:l,children:[n.jsx(Jt,{showGraph:t,minimal:d}),!d&&n.jsx(er,{showGraph:t,deepAnalyze:s,matrixUpdate:a,openByDefault:e,graphType:p,perfContainerRef:l,antialias:c,chart:f,minimal:d})]})})]})};exports.PerfMonitor=tr;

package/dist/index.d.ts

@@ -1,2 +1,2 @@
-export { PerformanceMonitor } from './components/PerfMonitor';
+export { PerfMonitor } from './components/PerfMonitor';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC"}