@roomle/web-sdk 3.7.0 → 3.8.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (132) hide show
  1. package/lib/{BufferGeometry-BzmfTBQt.mjs → BufferGeometry-ltw0XkYt.mjs} +7 -4
  2. package/lib/BufferGeometry-ltw0XkYt.mjs.map +1 -0
  3. package/lib/ConfiguratorKernel.js +6 -6
  4. package/lib/ConfiguratorKernel.wasm +0 -0
  5. package/lib/{GLTFExporter-CyhgWPq0.mjs → GLTFExporter-BqjC9LhS.mjs} +9 -14
  6. package/lib/GLTFExporter-BqjC9LhS.mjs.map +1 -0
  7. package/lib/{Object3D-C3wqWk6O.mjs → Object3D-BZaiqQIE.mjs} +24 -12
  8. package/lib/Object3D-BZaiqQIE.mjs.map +1 -0
  9. package/lib/{PointLightHelper-DwIXACyT.mjs → PointLightHelper-AxCe6I00.mjs} +4 -4
  10. package/lib/PointLightHelper-AxCe6I00.mjs.map +1 -0
  11. package/lib/RoomleCore.js +8 -8
  12. package/lib/RoomleCore.wasm +0 -0
  13. package/lib/RoomleToolsCore.wasm +0 -0
  14. package/lib/{SpotLightHelper-CfLHM7LU.mjs → SpotLightHelper-DpMerFPv.mjs} +3 -3
  15. package/lib/{SpotLightHelper-CfLHM7LU.mjs.map → SpotLightHelper-DpMerFPv.mjs.map} +1 -1
  16. package/lib/{USDZExporter-kmxcTvnQ.mjs → USDZExporter-qUD2VgwK.mjs} +2 -2
  17. package/lib/{USDZExporter-kmxcTvnQ.mjs.map → USDZExporter-qUD2VgwK.mjs.map} +1 -1
  18. package/lib/{Vector4-DUqY3Egg.mjs → Vector4-BfZH1ecw.mjs} +7 -4
  19. package/lib/Vector4-BfZH1ecw.mjs.map +1 -0
  20. package/lib/{api-X1dDTDvL.mjs → api-CbHAzwVm.mjs} +2 -2
  21. package/lib/{api-X1dDTDvL.mjs.map → api-CbHAzwVm.mjs.map} +1 -1
  22. package/lib/asset-loader.worker-A7nEeQB4.mjs.map +1 -1
  23. package/lib/{banana-for-scale-Bpf8RfLi.mjs → banana-for-scale-DiBCpVNM.mjs} +3 -3
  24. package/lib/{banana-for-scale-Bpf8RfLi.mjs.map → banana-for-scale-DiBCpVNM.mjs.map} +1 -1
  25. package/lib/budgeteer.sw-CQWYbQSc.mjs.map +1 -1
  26. package/lib/{common-utils-DMI8Yuhe.mjs → common-utils-AB4Lnet3.mjs} +2 -2
  27. package/lib/{common-utils-DMI8Yuhe.mjs.map → common-utils-AB4Lnet3.mjs.map} +1 -1
  28. package/lib/{component-dimensioning-MtS9xiY-.mjs → component-dimensioning-LUnZnpqG.mjs} +5 -5
  29. package/lib/{component-dimensioning-MtS9xiY-.mjs.map → component-dimensioning-LUnZnpqG.mjs.map} +1 -1
  30. package/lib/{component-raycast-helper-C1qWqpRH.mjs → component-raycast-helper-Bl0mWPcj.mjs} +4 -4
  31. package/lib/{component-raycast-helper-C1qWqpRH.mjs.map → component-raycast-helper-Bl0mWPcj.mjs.map} +1 -1
  32. package/lib/configurator-BmJX0gB5.mjs +2 -0
  33. package/lib/configurator-CP80d0HI.mjs +45 -0
  34. package/lib/{configurator-Cg1a9XSL.mjs.map → configurator-CP80d0HI.mjs.map} +1 -1
  35. package/lib/{continuous-drawing-helper-CQx5Sbns.mjs → continuous-drawing-helper-BlRy7u2t.mjs} +3 -3
  36. package/lib/{continuous-drawing-helper-CQx5Sbns.mjs.map → continuous-drawing-helper-BlRy7u2t.mjs.map} +1 -1
  37. package/lib/dimensioning-helper-5xsc6I7Y.mjs +2 -0
  38. package/lib/{dimensioning-helper-GPn7Z8GE.mjs → dimensioning-helper-vPhGfHd-.mjs} +3 -3
  39. package/lib/{dimensioning-helper-GPn7Z8GE.mjs.map → dimensioning-helper-vPhGfHd-.mjs.map} +1 -1
  40. package/lib/{glb-viewer-tgKOPCaI.mjs → glb-viewer-B7pA8K_w.mjs} +71 -54
  41. package/lib/glb-viewer-B7pA8K_w.mjs.map +1 -0
  42. package/lib/glb-viewer-XFEP993c.mjs +2 -0
  43. package/lib/{highlight-coordinator-DRHeEU-E.mjs → highlight-coordinator-DeB46jQq.mjs} +9 -3
  44. package/lib/highlight-coordinator-DeB46jQq.mjs.map +1 -0
  45. package/lib/{homag-intelligence-D5mCTWgG.mjs → homag-intelligence-f1JD0An1.mjs} +3 -3
  46. package/lib/homag-intelligence-f1JD0An1.mjs.map +1 -0
  47. package/lib/{imos-ix-poc-export-helper-BKFs_Yhm.mjs → imos-ix-poc-export-helper-Vyv-uuNs.mjs} +3 -3
  48. package/lib/{imos-ix-poc-export-helper-BKFs_Yhm.mjs.map → imos-ix-poc-export-helper-Vyv-uuNs.mjs.map} +1 -1
  49. package/lib/kernel-C7YDLxq8.mjs.map +1 -1
  50. package/lib/{kernel-utils-B80amC-l.mjs → kernel-utils-BG1uqfT_.mjs} +2 -2
  51. package/lib/{kernel-utils-B80amC-l.mjs.map → kernel-utils-BG1uqfT_.mjs.map} +1 -1
  52. package/lib/{main-CJ5TNhBt.mjs → main-CuqGqemT.mjs} +2916 -2605
  53. package/lib/main-CuqGqemT.mjs.map +1 -0
  54. package/lib/{material-viewer-DCqZzMZN.mjs → material-viewer-Cij9aWpI.mjs} +23 -23
  55. package/lib/{material-viewer-DCqZzMZN.mjs.map → material-viewer-Cij9aWpI.mjs.map} +1 -1
  56. package/lib/packages-DALvuVA_.mjs +4 -0
  57. package/lib/planner-CVn2Lls0.mjs +2 -0
  58. package/lib/planner-DKbmQVSf.mjs +44 -0
  59. package/lib/{planner-CSboZram.mjs.map → planner-DKbmQVSf.mjs.map} +1 -1
  60. package/lib/{plugin-system-DD0Z9Jvt.mjs → plugin-system-BEZnFUyT.mjs} +2 -2
  61. package/lib/{plugin-system-DD0Z9Jvt.mjs.map → plugin-system-BEZnFUyT.mjs.map} +1 -1
  62. package/lib/{roomle-headless-setup-nsoGENQV.mjs → roomle-headless-setup-CMK-quZI.mjs} +131 -77
  63. package/lib/roomle-headless-setup-CMK-quZI.mjs.map +1 -0
  64. package/lib/roomle-headless.d.ts +333 -44
  65. package/lib/roomle-headless.js +196 -80
  66. package/lib/roomle-headless.js.map +1 -1
  67. package/lib/{roomle-renderer-BEJNPCKx.mjs → roomle-renderer-BgT28pfp.mjs} +2 -2
  68. package/lib/{roomle-renderer-BEJNPCKx.mjs.map → roomle-renderer-BgT28pfp.mjs.map} +1 -1
  69. package/lib/roomle-sdk.d.ts +168 -37
  70. package/lib/roomle-sdk.js +7 -7
  71. package/lib/roomle-webgpu-renderer-BdCItfH1.mjs +2243 -0
  72. package/lib/roomle-webgpu-renderer-BdCItfH1.mjs.map +1 -0
  73. package/lib/{scene-renderer-Dm1kij1z.mjs → scene-renderer-Bdl7umAf.mjs} +6 -6
  74. package/lib/{scene-renderer-Dm1kij1z.mjs.map → scene-renderer-Bdl7umAf.mjs.map} +1 -1
  75. package/lib/{script-loader-DqaDm1FG.mjs → script-loader-BtWHegD-.mjs} +2 -2
  76. package/lib/{script-loader-DqaDm1FG.mjs.map → script-loader-BtWHegD-.mjs.map} +1 -1
  77. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/package.json +1 -1
  78. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/embind/configuratorCallback.d.ts +2 -2
  79. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/embind/configuratorCallback.js +2 -2
  80. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/embind/configuratorCallback.js.map +1 -1
  81. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/embind/configuratorCoreInterface.d.ts +12 -3
  82. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/embind/configuratorCoreInterface.js +1 -0
  83. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/embind/configuratorCoreInterface.js.map +1 -1
  84. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/embind/plannerCoreInterface.d.ts +43 -2
  85. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/embind/plannerCoreInterface.js +20 -1
  86. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/embind/plannerCoreInterface.js.map +1 -1
  87. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/loader/configurationLoader.d.ts +1 -1
  88. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/loader/configurationLoader.js +1 -1
  89. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/src/loader/configurationLoader.js.map +1 -1
  90. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/wasm_modern/ConfiguratorKernel.js +6 -6
  91. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/wasm_modern/ConfiguratorKernel.wasm +0 -0
  92. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/wasm_modern/RoomleCore.js +8 -8
  93. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/wasm_modern/RoomleCore.wasm +0 -0
  94. package/lib/static/roomle-core-hsc/node_modules/roomle-core-hsc/wasm_modern/RoomleToolsCore.wasm +0 -0
  95. package/lib/{stats-helper-D7a7oxnj.mjs → stats-helper-BvDfWWfq.mjs} +2 -2
  96. package/lib/{stats-helper-D7a7oxnj.mjs.map → stats-helper-BvDfWWfq.mjs.map} +1 -1
  97. package/lib/{three.core-BmQnspOL.mjs → three.core-K1JzUaep.mjs} +748 -706
  98. package/lib/three.core-K1JzUaep.mjs.map +1 -0
  99. package/lib/{three.module-DkrZwaid.mjs → three.module-Q2K9uyhi.mjs} +1022 -965
  100. package/lib/three.module-Q2K9uyhi.mjs.map +1 -0
  101. package/lib/{three.webgpu-DLZjhIYv.mjs → three.webgpu-7v7o6Pxs.mjs} +3804 -3481
  102. package/lib/three.webgpu-7v7o6Pxs.mjs.map +1 -0
  103. package/lib/three.webgpu-ChguPx4k.mjs +3 -0
  104. package/lib/{threejs-utils-CrK_gp1x.mjs → threejs-utils-BzXU2M3w.mjs} +67 -47
  105. package/lib/threejs-utils-BzXU2M3w.mjs.map +1 -0
  106. package/lib/{tools-core-CZWgXTFV.mjs → tools-core-BoxckhTR.mjs} +6 -6
  107. package/lib/{tools-core-CZWgXTFV.mjs.map → tools-core-BoxckhTR.mjs.map} +1 -1
  108. package/package.json +4 -4
  109. package/lib/BufferGeometry-BzmfTBQt.mjs.map +0 -1
  110. package/lib/GLTFExporter-CyhgWPq0.mjs.map +0 -1
  111. package/lib/Object3D-C3wqWk6O.mjs.map +0 -1
  112. package/lib/PointLightHelper-DwIXACyT.mjs.map +0 -1
  113. package/lib/Vector4-DUqY3Egg.mjs.map +0 -1
  114. package/lib/configurator-C5t3clCx.mjs +0 -2
  115. package/lib/configurator-Cg1a9XSL.mjs +0 -45
  116. package/lib/dimensioning-helper-Bfe0fImX.mjs +0 -2
  117. package/lib/glb-viewer-DIEpkrvY.mjs +0 -2
  118. package/lib/glb-viewer-tgKOPCaI.mjs.map +0 -1
  119. package/lib/highlight-coordinator-DRHeEU-E.mjs.map +0 -1
  120. package/lib/homag-intelligence-D5mCTWgG.mjs.map +0 -1
  121. package/lib/main-CJ5TNhBt.mjs.map +0 -1
  122. package/lib/packages-DuOz6rk6.mjs +0 -4
  123. package/lib/planner-CSboZram.mjs +0 -44
  124. package/lib/planner-CWPqJktz.mjs +0 -2
  125. package/lib/roomle-headless-setup-nsoGENQV.mjs.map +0 -1
  126. package/lib/roomle-webgpu-renderer-D5flithq.mjs +0 -1502
  127. package/lib/roomle-webgpu-renderer-D5flithq.mjs.map +0 -1
  128. package/lib/three.core-BmQnspOL.mjs.map +0 -1
  129. package/lib/three.module-DkrZwaid.mjs.map +0 -1
  130. package/lib/three.webgpu-DLZjhIYv.mjs.map +0 -1
  131. package/lib/three.webgpu-RkQxSIwG.mjs +0 -3
  132. package/lib/threejs-utils-CrK_gp1x.mjs.map +0 -1
@@ -1,1502 +0,0 @@
1
- import { Ar as e, C as t, J as n, Ui as r, Vi as i, Zt as a, bi as o, nt as s, si as c, st as l, zr as u } from "./three.core-BmQnspOL.mjs";
2
- import { t as d } from "./scene-renderer-Dm1kij1z.mjs";
3
- import { n as f, r as p, t as m } from "./decorate-Bck1_lG8.mjs";
4
- import { n as h } from "./roomle-renderer-BEJNPCKx.mjs";
5
- import { Ht as g, Lt as _, Un as v, Wn as y, X as ee, bn as b, ln as x, vn as te, x as ne } from "./three.webgpu-DLZjhIYv.mjs";
6
- v.BRDF_GGX, v.BRDF_Lambert, v.BasicPointShadowFilter, v.BasicShadowFilter, v.Break, v.Const, v.Continue, v.DFGLUT, v.D_GGX, v.Discard, v.EPSILON, v.F_Schlick;
7
- var S = v.Fn;
8
- v.INFINITY, v.If;
9
- var re = v.Loop;
10
- v.NodeAccess, v.NodeShaderStage, v.NodeType, v.NodeUpdateType, v.PCFShadowFilter, v.PCFSoftShadowFilter, v.PI, v.PI2, v.TWO_PI, v.HALF_PI, v.PointShadowFilter, v.Return, v.Schlick_to_F0, v.ShaderNode, v.Stack, v.Switch, v.TBNViewMatrix, v.VSMShadowFilter, v.V_GGX_SmithCorrelated, v.Var, v.VarIntent, v.abs, v.acesFilmicToneMapping, v.acos, v.add, v.addMethodChaining, v.addNodeElement, v.agxToneMapping, v.all, v.alphaT, v.and, v.anisotropy, v.anisotropyB, v.anisotropyT, v.any, v.append, v.array, v.arrayBuffer, v.asin, v.assign, v.atan, v.atomicAdd, v.atomicAnd, v.atomicFunc, v.atomicLoad, v.atomicMax, v.atomicMin, v.atomicOr, v.atomicStore, v.atomicSub, v.atomicXor, v.attenuationColor, v.attenuationDistance, v.attribute, v.attributeArray, v.backgroundBlurriness, v.backgroundIntensity, v.backgroundRotation, v.batch, v.bentNormalView, v.billboarding, v.bitAnd, v.bitNot, v.bitOr, v.bitXor, v.bitangentGeometry, v.bitangentLocal, v.bitangentView, v.bitangentWorld, v.bitcast, v.blendBurn, v.blendColor, v.blendDodge, v.blendOverlay, v.blendScreen, v.blur, v.bool, v.buffer, v.bufferAttribute, v.bumpMap, v.builtin, v.builtinAOContext, v.builtinShadowContext, v.bvec2, v.bvec3, v.bvec4, v.bypass, v.cache, v.call, v.cameraFar, v.cameraIndex, v.cameraNear, v.cameraNormalMatrix, v.cameraPosition, v.cameraProjectionMatrix, v.cameraProjectionMatrixInverse, v.cameraViewMatrix, v.cameraViewport, v.cameraWorldMatrix, v.cbrt, v.cdl, v.ceil, v.checker, v.cineonToneMapping, v.clamp, v.clearcoat, v.clearcoatNormalView, v.clearcoatRoughness, v.clipSpace, v.code, v.color, v.colorSpaceToWorking, v.colorToDirection, v.compute, v.computeKernel, v.computeSkinning, v.context, v.convert, v.convertColorSpace, v.convertToTexture, v.countLeadingZeros, v.countOneBits, v.countTrailingZeros, v.cos, v.cross, v.cubeTexture, v.cubeTextureBase, v.dFdx, v.dFdy, v.dashSize, v.debug, v.decrement, v.decrementBefore, v.defaultBuildStages, v.defaultShaderStages, v.defined, v.degrees, v.deltaTime, v.densityFog, v.densityFogFactor, v.depth, v.depthPass, v.determinant, v.difference, v.diffuseColor, v.directPointLight, v.directionToColor, v.directionToFaceDirection, v.dispersion, v.distance, v.div, v.dot, v.drawIndex, v.dynamicBufferAttribute, v.element, v.emissive, v.equal, v.equirectUV;
11
- var ie = v.exp;
12
- v.exp2, v.exponentialHeightFogFactor, v.expression, v.faceDirection, v.faceForward, v.faceforward;
13
- var C = v.float;
14
- v.floatBitsToInt, v.floatBitsToUint, v.floor, v.fog, v.fract, v.frameGroup, v.frameId, v.frontFacing, v.fwidth, v.gain, v.gapSize, v.getConstNodeType, v.getCurrentStack, v.getDirection, v.getDistanceAttenuation, v.getGeometryRoughness, v.getNormalFromDepth, v.interleavedGradientNoise, v.vogelDiskSample, v.getParallaxCorrectNormal, v.getRoughness, v.getScreenPosition, v.getShIrradianceAt, v.getShadowMaterial, v.getShadowRenderObjectFunction, v.getTextureIndex, v.getViewPosition, v.globalId, v.glsl, v.glslFn, v.grayscale, v.greaterThan, v.greaterThanEqual, v.hash, v.highpModelNormalViewMatrix, v.highpModelViewMatrix, v.hue, v.increment, v.incrementBefore, v.instance, v.instanceIndex, v.instancedArray, v.instancedBufferAttribute, v.instancedDynamicBufferAttribute, v.instancedMesh;
15
- var w = v.int;
16
- v.intBitsToFloat, v.inverse, v.inverseSqrt, v.inversesqrt, v.invocationLocalIndex, v.invocationSubgroupIndex, v.ior, v.iridescence, v.iridescenceIOR, v.iridescenceThickness, v.ivec2, v.ivec3, v.ivec4, v.js, v.label, v.length, v.lengthSq, v.lessThan, v.lessThanEqual, v.lightPosition, v.lightProjectionUV, v.lightShadowMatrix, v.lightTargetDirection, v.lightTargetPosition, v.lightViewPosition, v.lightingContext, v.lights, v.linearDepth, v.linearToneMapping, v.localId, v.log, v.log2, v.logarithmicDepthToViewZ, v.luminance, v.mat2, v.mat3, v.mat4, v.matcapUV, v.materialAO, v.materialAlphaTest, v.materialAnisotropy, v.materialAnisotropyVector, v.materialAttenuationColor, v.materialAttenuationDistance, v.materialClearcoat, v.materialClearcoatNormal, v.materialClearcoatRoughness, v.materialColor, v.materialDispersion, v.materialEmissive, v.materialEnvIntensity, v.materialEnvRotation, v.materialIOR, v.materialIridescence, v.materialIridescenceIOR, v.materialIridescenceThickness, v.materialLightMap, v.materialLineDashOffset, v.materialLineDashSize, v.materialLineGapSize, v.materialLineScale, v.materialLineWidth, v.materialMetalness, v.materialNormal, v.materialOpacity, v.materialPointSize, v.materialReference, v.materialReflectivity, v.materialRefractionRatio, v.materialRotation, v.materialRoughness, v.materialSheen, v.materialSheenRoughness, v.materialShininess, v.materialSpecular, v.materialSpecularColor, v.materialSpecularIntensity, v.materialSpecularStrength, v.materialThickness, v.materialTransmission, v.max, v.maxMipLevel, v.mediumpModelViewMatrix, v.metalness;
17
- var T = v.min;
18
- v.mix, v.mixElement, v.mod, v.modInt, v.modelDirection, v.modelNormalMatrix, v.modelPosition, v.modelRadius, v.modelScale, v.modelViewMatrix, v.modelViewPosition, v.modelViewProjection, v.modelWorldMatrix, v.modelWorldMatrixInverse, v.morphReference, v.mrt;
19
- var E = v.mul;
20
- v.mx_aastep, v.mx_add, v.mx_atan2, v.mx_cell_noise_float, v.mx_contrast, v.mx_divide, v.mx_fractal_noise_float, v.mx_fractal_noise_vec2, v.mx_fractal_noise_vec3, v.mx_fractal_noise_vec4, v.mx_frame, v.mx_heighttonormal, v.mx_hsvtorgb, v.mx_ifequal, v.mx_ifgreater, v.mx_ifgreatereq, v.mx_invert, v.mx_modulo, v.mx_multiply, v.mx_noise_float, v.mx_noise_vec3, v.mx_noise_vec4, v.mx_place2d, v.mx_power, v.mx_ramp4, v.mx_ramplr, v.mx_ramptb, v.mx_rgbtohsv, v.mx_rotate2d, v.mx_rotate3d, v.mx_safepower, v.mx_separate, v.mx_splitlr, v.mx_splittb, v.mx_srgb_texture_to_lin_rec709, v.mx_subtract, v.mx_timer, v.mx_transform_uv, v.mx_unifiednoise2d, v.mx_unifiednoise3d, v.mx_worley_noise_float, v.mx_worley_noise_vec2, v.mx_worley_noise_vec3, v.negate, v.neutralToneMapping, v.nodeArray, v.nodeImmutable;
21
- var D = v.nodeObject;
22
- v.nodeObjectIntent, v.nodeObjects, v.nodeProxy, v.nodeProxyIntent, v.normalFlat, v.normalGeometry, v.normalLocal, v.normalMap, v.normalView, v.normalViewGeometry, v.normalWorld, v.normalWorldGeometry, v.normalize, v.not, v.notEqual, v.numWorkgroups, v.objectDirection, v.objectGroup, v.objectPosition, v.objectRadius, v.objectScale, v.objectViewPosition, v.objectWorldMatrix, v.OnBeforeObjectUpdate, v.OnBeforeMaterialUpdate, v.OnObjectUpdate;
23
- var ae = v.OnMaterialUpdate;
24
- v.oneMinus, v.or;
25
- var oe = v.orthographicDepthToViewZ;
26
- v.oscSawtooth, v.oscSine, v.oscSquare, v.oscTriangle, v.output, v.outputStruct, v.overloadingFn, v.packHalf2x16, v.packSnorm2x16, v.packUnorm2x16, v.parabola, v.parallaxDirection, v.parallaxUV, v.parameter;
27
- var se = v.pass, ce = v.passTexture;
28
- v.pcurve;
29
- var O = v.perspectiveDepthToViewZ;
30
- v.pmremTexture, v.pointShadow, v.pointUV, v.pointWidth, v.positionGeometry, v.positionLocal, v.positionPrevious;
31
- var le = v.positionView;
32
- v.positionViewDirection, v.positionWorld, v.positionWorldDirection, v.posterize, v.pow, v.pow2, v.pow3, v.pow4, v.premultiplyAlpha, v.property, v.radians, v.rand, v.range, v.rangeFog, v.rangeFogFactor, v.reciprocal;
33
- var k = v.reference;
34
- v.referenceBuffer, v.reflect, v.reflectVector, v.reflectView, v.reflector, v.refract, v.refractVector, v.refractView, v.reinhardToneMapping, v.remap, v.remapClamp, v.renderGroup;
35
- var ue = v.renderOutput;
36
- v.rendererReference, v.replaceDefaultUV, v.rotate, v.rotateUV, v.roughness, v.round, v.rtt, v.sRGBTransferEOTF, v.sRGBTransferOETF, v.sample, v.sampler, v.samplerComparison, v.saturate, v.saturation, v.screen, v.screenCoordinate, v.screenDPR, v.screenSize;
37
- var A = v.screenUV;
38
- v.select, v.setCurrentStack, v.setName, v.shaderStages, v.shadow, v.shadowPositionWorld, v.shapeCircle, v.sharedUniformGroup, v.sheen, v.sheenRoughness, v.shiftLeft, v.shiftRight, v.shininess, v.sign, v.sin, v.sinc, v.skinning, v.smoothstep, v.smoothstepElement, v.specularColor, v.specularF90, v.spherizeUV, v.split, v.spritesheetUV, v.sqrt, v.stack;
39
- var j = v.step;
40
- v.stepElement, v.storage, v.storageBarrier, v.storageTexture, v.string, v.struct, v.sub, v.subgroupAdd, v.subgroupAll, v.subgroupAnd, v.subgroupAny, v.subgroupBallot, v.subgroupBroadcast, v.subgroupBroadcastFirst, v.subBuild, v.subgroupElect, v.subgroupExclusiveAdd, v.subgroupExclusiveMul, v.subgroupInclusiveAdd, v.subgroupInclusiveMul, v.subgroupIndex, v.subgroupMax, v.subgroupMin, v.subgroupMul, v.subgroupOr, v.subgroupShuffle, v.subgroupShuffleDown, v.subgroupShuffleUp, v.subgroupShuffleXor, v.subgroupSize, v.subgroupXor, v.tan, v.tangentGeometry, v.tangentLocal, v.tangentView, v.tangentWorld;
41
- var M = v.texture;
42
- v.texture3D, v.textureBarrier, v.textureBicubic, v.textureBicubicLevel, v.textureCubeUV, v.textureLoad;
43
- var N = v.textureSize;
44
- v.textureLevel, v.textureStore, v.thickness, v.time, v.toneMapping, v.toneMappingExposure, v.toonOutlinePass, v.transformDirection, v.transformNormal, v.transformNormalToView, v.transformedClearcoatNormalView, v.transformedNormalView, v.transformedNormalWorld, v.transmission, v.transpose, v.triNoise3D, v.triplanarTexture, v.triplanarTextures, v.trunc, v.uint, v.uintBitsToFloat;
45
- var P = v.uniform;
46
- v.uniformArray, v.uniformCubeTexture, v.uniformGroup, v.uniformFlow, v.uniformTexture, v.unpackHalf2x16, v.unpackSnorm2x16, v.unpackUnorm2x16, v.unpremultiplyAlpha, v.userData;
47
- var F = v.uv;
48
- v.uvec2, v.uvec3, v.uvec4, v.varying, v.varyingProperty;
49
- var I = v.vec2, L = v.vec3, R = v.vec4;
50
- v.vectorComponents, v.velocity, v.vertexColor, v.vertexIndex, v.vertexStage, v.vibrance, v.viewZToLogarithmicDepth, v.viewZToOrthographicDepth, v.viewZToPerspectiveDepth, v.viewZToReversedOrthographicDepth, v.viewZToReversedPerspectiveDepth, v.viewport, v.viewportCoordinate, v.viewportDepthTexture, v.viewportLinearDepth, v.viewportMipTexture, v.viewportOpaqueMipTexture, v.viewportResolution, v.viewportSafeUV, v.viewportSharedTexture, v.viewportSize, v.viewportTexture, v.viewportUV, v.wgsl, v.wgslFn, v.workgroupArray, v.workgroupBarrier, v.workgroupId, v.workingToColorSpace, v.xor;
51
- //#endregion
52
- //#region ../../node_modules/three/examples/jsm/tsl/display/OutlineNode.js
53
- var z = /* @__PURE__ */ new x(), de = /* @__PURE__ */ new o(), B = /* @__PURE__ */ new o(1, 0), V = /* @__PURE__ */ new o(0, 1), H, fe = class extends y {
54
- static get type() {
55
- return "OutlineNode";
56
- }
57
- constructor(t, r, i = {}) {
58
- super("vec4");
59
- let { selectedObjects: a = [], edgeThickness: s = C(1), edgeGlow: c = C(0), downSampleRatio: u = 2 } = i;
60
- this.scene = t, this.camera = r, this.selectedObjects = a, this.edgeThicknessNode = D(s), this.edgeGlowNode = D(c), this.downSampleRatio = u, this.updateBeforeType = g.FRAME, this._renderTargetDepthBuffer = new e(), this._renderTargetDepthBuffer.depthTexture = new n(), this._renderTargetDepthBuffer.depthTexture.type = l, this._renderTargetMaskBuffer = new e(), this._renderTargetMaskDownSampleBuffer = new e(1, 1, { depthBuffer: !1 }), this._renderTargetEdgeBuffer1 = new e(1, 1, { depthBuffer: !1 }), this._renderTargetEdgeBuffer2 = new e(1, 1, { depthBuffer: !1 }), this._renderTargetBlurBuffer1 = new e(1, 1, { depthBuffer: !1 }), this._renderTargetBlurBuffer2 = new e(1, 1, { depthBuffer: !1 }), this._renderTargetComposite = new e(1, 1, { depthBuffer: !1 }), this._cameraNear = k("near", "float", r), this._cameraFar = k("far", "float", r), this._blurDirection = P(new o()), this._depthTextureUniform = M(this._renderTargetDepthBuffer.depthTexture), this._maskTextureUniform = M(this._renderTargetMaskBuffer.texture), this._maskTextureDownsSampleUniform = M(this._renderTargetMaskDownSampleBuffer.texture), this._edge1TextureUniform = M(this._renderTargetEdgeBuffer1.texture), this._edge2TextureUniform = M(this._renderTargetEdgeBuffer2.texture), this._blurColorTextureUniform = M(this._renderTargetEdgeBuffer1.texture), this._visibleEdgeColor = L(1, 0, 0), this._hiddenEdgeColor = L(0, 1, 0), this._depthMaterial = new _(), this._depthMaterial.fragmentNode = R(0, 0, 0, 1), this._depthMaterial.name = "OutlineNode.depth", this._prepareMaskMaterial = new _(), this._prepareMaskMaterial.name = "OutlineNode.prepareMask", this._materialCopy = new _(), this._materialCopy.name = "OutlineNode.copy", this._edgeDetectionMaterial = new _(), this._edgeDetectionMaterial.name = "OutlineNode.edgeDetection", this._separableBlurMaterial = new _(), this._separableBlurMaterial.name = "OutlineNode.separableBlur", this._separableBlurMaterial2 = new _(), this._separableBlurMaterial2.name = "OutlineNode.separableBlur2", this._compositeMaterial = new _(), this._compositeMaterial.name = "OutlineNode.composite", this._selectionCache = /* @__PURE__ */ new Set(), this._textureNode = ce(this, this._renderTargetComposite.texture);
61
- }
62
- get visibleEdge() {
63
- return this.r;
64
- }
65
- get hiddenEdge() {
66
- return this.g;
67
- }
68
- getTextureNode() {
69
- return this._textureNode;
70
- }
71
- setSize(e, t) {
72
- this._renderTargetDepthBuffer.setSize(e, t), this._renderTargetMaskBuffer.setSize(e, t), this._renderTargetComposite.setSize(e, t);
73
- let n = Math.round(e / this.downSampleRatio), r = Math.round(t / this.downSampleRatio);
74
- this._renderTargetMaskDownSampleBuffer.setSize(n, r), this._renderTargetEdgeBuffer1.setSize(n, r), this._renderTargetBlurBuffer1.setSize(n, r), n = Math.round(n / 2), r = Math.round(r / 2), this._renderTargetEdgeBuffer2.setSize(n, r), this._renderTargetBlurBuffer2.setSize(n, r);
75
- }
76
- updateBefore(e) {
77
- let { renderer: t } = e, { camera: n, scene: r } = this;
78
- H = b.resetRendererAndSceneState(t, r, H);
79
- let i = t.getDrawingBufferSize(de);
80
- this.setSize(i.width, i.height), t.setClearColor(16777215, 1), this._updateSelectionCache();
81
- let a = r.name;
82
- r.overrideMaterial = this._depthMaterial, t.setRenderTarget(this._renderTargetDepthBuffer), t.setRenderObjectFunction((e, ...n) => {
83
- this._selectionCache.has(e) === !1 && t.renderObject(e, ...n);
84
- }), r.name = "Outline [ Non-Selected Objects Pass ]", t.render(r, n), r.overrideMaterial = this._prepareMaskMaterial, t.setRenderTarget(this._renderTargetMaskBuffer), t.setRenderObjectFunction((e, ...n) => {
85
- this._selectionCache.has(e) === !0 && t.renderObject(e, ...n);
86
- }), r.name = "Outline [ Selected Objects Pass ]", t.render(r, n), t.setRenderObjectFunction(H.renderObjectFunction), this._selectionCache.clear(), r.name = a, z.material = this._materialCopy, z.name = "Outline [ Downsample ]", t.setRenderTarget(this._renderTargetMaskDownSampleBuffer), z.render(t), z.material = this._edgeDetectionMaterial, z.name = "Outline [ Edge Detection ]", t.setRenderTarget(this._renderTargetEdgeBuffer1), z.render(t), this._blurColorTextureUniform.value = this._renderTargetEdgeBuffer1.texture, this._blurDirection.value.copy(B), z.material = this._separableBlurMaterial, z.name = "Outline [ Blur Half Resolution ]", t.setRenderTarget(this._renderTargetBlurBuffer1), z.render(t), this._blurColorTextureUniform.value = this._renderTargetBlurBuffer1.texture, this._blurDirection.value.copy(V), t.setRenderTarget(this._renderTargetEdgeBuffer1), z.render(t), this._blurColorTextureUniform.value = this._renderTargetEdgeBuffer1.texture, this._blurDirection.value.copy(B), z.material = this._separableBlurMaterial2, z.name = "Outline [ Blur Quarter Resolution ]", t.setRenderTarget(this._renderTargetBlurBuffer2), z.render(t), this._blurColorTextureUniform.value = this._renderTargetBlurBuffer2.texture, this._blurDirection.value.copy(V), t.setRenderTarget(this._renderTargetEdgeBuffer2), z.render(t), z.material = this._compositeMaterial, z.name = "Outline [ Blur Quarter Resolution ]", t.setRenderTarget(this._renderTargetComposite), z.render(t), b.restoreRendererAndSceneState(t, r, H);
87
- }
88
- setup() {
89
- let e = () => {
90
- let e = this._depthTextureUniform.sample(A), t;
91
- return t = this.camera.isPerspectiveCamera ? O(e, this._cameraNear, this._cameraFar) : oe(e, this._cameraNear, this._cameraFar), R(0, le.z.lessThanEqual(t).select(1, 0), 1, 1);
92
- };
93
- this._prepareMaskMaterial.fragmentNode = e(), this._prepareMaskMaterial.needsUpdate = !0, this._materialCopy.fragmentNode = this._maskTextureUniform, this._materialCopy.needsUpdate = !0;
94
- let t = S(() => {
95
- let e = N(this._maskTextureDownsSampleUniform), t = I(1).div(e).toVar(), n = R(1, 0, 0, 1).mul(R(t, t)), r = F(), i = this._maskTextureDownsSampleUniform.sample(r.add(n.xy)).toVar(), a = this._maskTextureDownsSampleUniform.sample(r.sub(n.xy)).toVar(), o = this._maskTextureDownsSampleUniform.sample(r.add(n.yw)).toVar(), s = this._maskTextureDownsSampleUniform.sample(r.sub(n.yw)).toVar(), c = I(E(i.r.sub(a.r), .5), E(o.r.sub(s.r), .5)).length();
96
- return R(T(T(i.g, a.g), T(o.g, s.g)).oneMinus().greaterThan(.001).select(this._visibleEdgeColor, this._hiddenEdgeColor), 1).mul(c);
97
- });
98
- this._edgeDetectionMaterial.fragmentNode = t(), this._edgeDetectionMaterial.needsUpdate = !0;
99
- let n = S(([e, t]) => C(.39894).mul(ie(C(-.5).mul(e).mul(e).div(t.mul(t))).div(t))), r = S(([e]) => {
100
- let t = N(this._maskTextureDownsSampleUniform), r = I(1).div(t).toVar(), i = F(), a = e.div(2).toVar(), o = n(0, a).toVar(), s = this._blurColorTextureUniform.sample(i).mul(o).toVar(), c = this._blurDirection.mul(r).mul(e).div(4).toVar(), l = c.toVar();
101
- return re({
102
- start: w(1),
103
- end: w(4),
104
- type: "int",
105
- condition: "<="
106
- }, ({ i: t }) => {
107
- let r = n(e.mul(C(t)).div(4), a), u = this._blurColorTextureUniform.sample(i.add(l)), d = this._blurColorTextureUniform.sample(i.sub(l));
108
- s.addAssign(u.add(d).mul(r)), o.addAssign(r.mul(2)), l.addAssign(c);
109
- }), s.div(o);
110
- });
111
- this._separableBlurMaterial.fragmentNode = r(this.edgeThicknessNode), this._separableBlurMaterial.needsUpdate = !0, this._separableBlurMaterial2.fragmentNode = r(4), this._separableBlurMaterial2.needsUpdate = !0;
112
- let i = S(() => {
113
- let e = this._edge1TextureUniform, t = this._edge2TextureUniform, n = this._maskTextureUniform, r = e.add(t.mul(this.edgeGlowNode));
114
- return n.r.mul(r);
115
- });
116
- return this._compositeMaterial.fragmentNode = i(), this._compositeMaterial.needsUpdate = !0, this._textureNode;
117
- }
118
- dispose() {
119
- this.selectedObjects.length = 0, this._renderTargetDepthBuffer.dispose(), this._renderTargetMaskBuffer.dispose(), this._renderTargetMaskDownSampleBuffer.dispose(), this._renderTargetEdgeBuffer1.dispose(), this._renderTargetEdgeBuffer2.dispose(), this._renderTargetBlurBuffer1.dispose(), this._renderTargetBlurBuffer2.dispose(), this._renderTargetComposite.dispose(), this._depthMaterial.dispose(), this._prepareMaskMaterial.dispose(), this._materialCopy.dispose(), this._edgeDetectionMaterial.dispose(), this._separableBlurMaterial.dispose(), this._separableBlurMaterial2.dispose(), this._compositeMaterial.dispose();
120
- }
121
- _updateSelectionCache() {
122
- for (let e = 0; e < this.selectedObjects.length; e++) this.selectedObjects[e].traverse((e) => {
123
- e.isMesh && this._selectionCache.add(e);
124
- });
125
- }
126
- }, pe = (e, t, n) => new fe(e, t, n), me = class {}, U = class e extends me {
127
- static {
128
- this.passId = "OutlineRenderPass";
129
- }
130
- constructor(n) {
131
- super(), this.passId = e.passId, this.selectedObjects = n.selectedObjects, this.edgeStrength = P(n.edgeStrength), this.edgeGlow = P(n.edgeGlow), this.edgeThickness = P(n.edgeThickness), this.visibleEdgeColor = P(new t(n.visibleEdgeColor)), this.hiddenEdgeColor = P(new t(n.hiddenEdgeColor));
132
- }
133
- highlightObjects(e) {
134
- this.selectedObjects.splice(0, this.selectedObjects.length, ...e);
135
- }
136
- setOutlineColors(e, n) {
137
- this.visibleEdgeColor.value = new t(e), this.hiddenEdgeColor.value = new t(n);
138
- }
139
- areObjectsSelected() {
140
- return this.selectedObjects.length !== 0;
141
- }
142
- assemble(e, t, n, r) {
143
- if (!this.areObjectsSelected()) return e;
144
- let { visibleEdge: i, hiddenEdge: a } = pe(t, n, {
145
- selectedObjects: this.selectedObjects,
146
- edgeThickness: this.edgeThickness,
147
- edgeGlow: this.edgeGlow
148
- }), o = i.mul(this.visibleEdgeColor).add(a.mul(this.hiddenEdgeColor)).mul(this.edgeStrength);
149
- return r === "outline" ? R(0, 0, 0, 0).add(o) : e.add(o);
150
- }
151
- addParametersToGUI(e, t) {
152
- let n = e.addFolder("Outline Settings");
153
- n.add(this.edgeStrength, "value", .01, 10).name("edgeStrength").onChange(() => t()), n.add(this.edgeGlow, "value", 0, 1).name("edgeGlow").onChange(() => t()), n.add(this.edgeThickness, "value", 1, 4).name("edgeThickness").onChange(() => t()), n.addColor({ color: this.visibleEdgeColor.value.getHex(u) }, "color").name("visibleEdgeColor").onChange((e) => {
154
- this.visibleEdgeColor.value.set(e), t();
155
- }), n.addColor({ color: this.hiddenEdgeColor.value.getHex(u) }, "color").name("hiddenEdgeColor").onChange((e) => {
156
- this.hiddenEdgeColor.value.set(e), t();
157
- });
158
- }
159
- }, W = class {
160
- constructor(e, t) {
161
- this.uid = e, this.cid = e.match(/^(.*):f(\d+)$/)[1], this.name = t, this.timestamp = 0, this.cpu = 0, this.gpu = 0, this.fps = 0, this.children = [], this.parent = null;
162
- }
163
- }, he = class extends W {
164
- constructor(e, t, n, r) {
165
- let i = t.name;
166
- i === "" && (t.isScene ? i = "Scene" : t.isQuadMesh && (i = "QuadMesh")), super(e, i), this.scene = t, this.camera = n, this.renderTarget = r, this.isRenderStats = !0;
167
- }
168
- }, ge = class extends W {
169
- constructor(e, t) {
170
- super(e, t.name), this.computeNode = t, this.isComputeStats = !0;
171
- }
172
- }, _e = class extends ee {
173
- constructor() {
174
- super(), this.currentFrame = null, this.currentRender = null, this.currentNodes = null, this.lastFrame = null, this.frames = [], this.framesLib = {}, this.maxFrames = 512, this._lastFinishTime = 0, this._resolveTimestampPromise = null, this.isRendererInspector = !0;
175
- }
176
- getParent() {
177
- return this.currentRender || this.getFrame();
178
- }
179
- begin() {
180
- this.currentFrame = this._createFrame(), this.currentRender = this.currentFrame, this.currentNodes = [];
181
- }
182
- finish() {
183
- let e = performance.now(), t = this.currentFrame;
184
- t.finishTime = e, t.deltaTime = e - (this._lastFinishTime > 0 ? this._lastFinishTime : e), this.addFrame(t), this.fps = this._getFPS(), this.lastFrame = t, this.currentFrame = null, this.currentRender = null, this.currentNodes = null, this._lastFinishTime = e;
185
- }
186
- _getFPS() {
187
- let e = 0, t = 0;
188
- for (let n = this.frames.length - 1; n >= 0; n--) {
189
- let r = this.frames[n];
190
- if (e++, t += r.deltaTime, t >= 1e3) break;
191
- }
192
- return e * 1e3 / t;
193
- }
194
- _createFrame() {
195
- return {
196
- frameId: this.nodeFrame.frameId,
197
- resolvedCompute: !1,
198
- resolvedRender: !1,
199
- deltaTime: 0,
200
- startTime: performance.now(),
201
- finishTime: 0,
202
- miscellaneous: 0,
203
- children: [],
204
- renders: [],
205
- computes: []
206
- };
207
- }
208
- getFrame() {
209
- return this.currentFrame || this.lastFrame;
210
- }
211
- getFrameById(e) {
212
- return this.framesLib[e] || null;
213
- }
214
- resolveViewer() {}
215
- resolveFrame() {}
216
- async resolveTimestamp() {
217
- return this._resolveTimestampPromise === null && (this._resolveTimestampPromise = new Promise((e) => {
218
- requestAnimationFrame(async () => {
219
- let t = this.getRenderer();
220
- await t.resolveTimestampsAsync(c.COMPUTE), await t.resolveTimestampsAsync(c.RENDER);
221
- let n = t.backend.getTimestampFrames(c.COMPUTE), r = t.backend.getTimestampFrames(c.RENDER), i = [...new Set([...n, ...r])];
222
- for (let e of i) {
223
- let i = this.getFrameById(e);
224
- if (i !== null) {
225
- if (i.resolvedCompute === !1) if (i.computes.length > 0) {
226
- if (n.includes(e)) {
227
- for (let e of i.computes) t.backend.hasTimestamp(e.uid) ? e.gpu = t.backend.getTimestamp(e.uid) : (e.gpu = 0, e.gpuNotAvailable = !0);
228
- i.resolvedCompute = !0;
229
- }
230
- } else i.resolvedCompute = !0;
231
- if (i.resolvedRender === !1) if (i.renders.length > 0) {
232
- if (r.includes(e)) {
233
- for (let e of i.renders) t.backend.hasTimestamp(e.uid) ? e.gpu = t.backend.getTimestamp(e.uid) : (e.gpu = 0, e.gpuNotAvailable = !0);
234
- i.resolvedRender = !0;
235
- }
236
- } else i.resolvedRender = !0;
237
- i.resolvedCompute === !0 && i.resolvedRender === !0 && this.resolveFrame(i);
238
- }
239
- }
240
- this._resolveTimestampPromise = null, e();
241
- });
242
- })), this._resolveTimestampPromise;
243
- }
244
- get isAvailable() {
245
- return this.getRenderer() !== null;
246
- }
247
- addFrame(e) {
248
- if (this.frames.length >= this.maxFrames) {
249
- let e = this.frames.shift();
250
- delete this.framesLib[e.frameId];
251
- }
252
- this.frames.push(e), this.framesLib[e.frameId] = e, this.isAvailable && (this.resolveViewer(), this.resolveTimestamp());
253
- }
254
- inspect(e) {
255
- let t = this.currentNodes;
256
- t === null ? r("RendererInspector: Unable to inspect node outside of frame scope. Use \"renderer.setAnimationLoop()\".") : t.push(e);
257
- }
258
- beginCompute(e, t) {
259
- let n = this.getFrame();
260
- if (!n) return;
261
- let r = new ge(e, t);
262
- r.timestamp = performance.now(), r.parent = this.currentCompute || this.getParent(), n.computes.push(r), this.currentRender === null ? n.children.push(r) : this.currentRender.children.push(r), this.currentCompute = r;
263
- }
264
- finishCompute() {
265
- if (!this.getFrame()) return;
266
- let e = this.currentCompute;
267
- e.cpu = performance.now() - e.timestamp, this.currentCompute = e.parent.isComputeStats ? e.parent : null;
268
- }
269
- beginRender(e, t, n, r) {
270
- let i = this.getFrame();
271
- if (!i) return;
272
- let a = new he(e, t, n, r);
273
- a.timestamp = performance.now(), a.parent = this.getParent(), i.renders.push(a), this.currentRender === null ? i.children.push(a) : this.currentRender.children.push(a), this.currentRender = a;
274
- }
275
- finishRender() {
276
- if (!this.getFrame()) return;
277
- let e = this.currentRender;
278
- e.cpu = performance.now() - e.timestamp, this.currentRender = e.parent;
279
- }
280
- }, ve = class {
281
- static init() {
282
- if (document.getElementById("profiler-styles")) return;
283
- let e = document.createElement("style");
284
- e.id = "profiler-styles", e.textContent = "\n:root {\n --profiler-bg: #1e1e24f5;\n --profiler-header-bg: #2a2a33aa;\n --profiler-header: #2a2a33;\n --profiler-border: #4a4a5a;\n --text-primary: #e0e0e0;\n --text-secondary: #9a9aab;\n --accent-color: #00aaff;\n --color-green: #4caf50;\n --color-yellow: #ffc107;\n --color-red: #f44336;\n --font-family: 'Inter', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n --font-mono: 'Fira Code', 'Courier New', Courier, monospace;\n}\n\n@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&family=Fira+Code&display=swap');\n\n#profiler-panel *, #profiler-toggle * {\n text-transform: initial;\n line-height: normal;\n box-sizing: border-box;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n#profiler-toggle {\n position: fixed;\n top: 15px;\n right: 15px;\n background-color: rgba(30, 30, 36, 0.85);\n border: 1px solid #4a4a5a54;\n border-radius: 12px 6px 6px 12px;\n color: var(--text-primary);\n cursor: pointer;\n z-index: 1001;\n transition: all 0.2s ease-in-out;\n /*font-size: 14px;*/\n font-size: 15px;\n backdrop-filter: blur(8px);\n box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);\n display: flex;\n align-items: stretch;\n padding: 0;\n overflow: hidden;\n font-family: var(--font-family);\n}\n\n#profiler-toggle:hover {\n border-color: var(--accent-color);\n}\n\n#profiler-toggle.hidden {\n opacity: 0;\n pointer-events: none;\n}\n\n#toggle-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 40px;\n font-size: 20px;\n transition: background-color 0.2s;\n}\n\n#profiler-toggle:hover #toggle-icon {\n background-color: rgba(255, 255, 255, 0.05);\n}\n\n.toggle-separator {\n width: 1px;\n background-color: var(--profiler-border);\n}\n\n#toggle-text {\n display: flex;\n align-items: baseline;\n padding: 8px 14px;\n min-width: 80px;\n justify-content: right;\n}\n\n#toggle-text .fps-label {\n font-size: 0.7em;\n margin-left: 10px;\n color: #999;\n}\n\n#builtin-tabs-container {\n display: flex;\n align-items: stretch;\n gap: 0;\n border-right: 1px solid #262636;\n order: -1;\n}\n\n.builtin-tab-btn {\n background: transparent;\n border: none;\n color: var(--text-secondary);\n cursor: pointer;\n padding: 8px 14px;\n font-family: var(--font-family);\n font-size: 13px;\n font-weight: 600;\n transition: all 0.2s;\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: 32px;\n position: relative;\n}\n\n.builtin-tab-btn svg {\n width: 20px;\n height: 20px;\n stroke: currentColor;\n}\n\n.builtin-tab-btn:hover {\n background-color: rgba(255, 255, 255, 0.08);\n color: var(--accent-color);\n}\n\n.builtin-tab-btn:active {\n background-color: rgba(255, 255, 255, 0.12);\n}\n\n.builtin-tab-btn.active {\n background-color: rgba(0, 170, 255, 0.2);\n color: var(--accent-color);\n}\n\n.builtin-tab-btn.active:hover {\n background-color: rgba(0, 170, 255, 0.3);\n}\n\n#profiler-mini-panel {\n position: fixed;\n top: 60px;\n right: 15px;\n background-color: rgba(30, 30, 36, 0.85);\n border: 1px solid #4a4a5a54;\n border-radius: 8px;\n color: var(--text-primary);\n z-index: 9999;\n backdrop-filter: blur(8px);\n box-shadow: 0 6px 24px rgba(0, 0, 0, 0.5);\n font-family: var(--font-family);\n font-size: 11px;\n width: 350px;\n max-height: calc(100vh - 100px);\n overflow-y: auto;\n overflow-x: hidden;\n display: none;\n opacity: 0;\n transform: translateY(-10px) scale(0.98);\n transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1), \n transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n#profiler-mini-panel.visible {\n display: block;\n opacity: 1;\n transform: translateY(0) scale(1);\n}\n\n#profiler-mini-panel::-webkit-scrollbar {\n width: 6px;\n}\n\n#profiler-mini-panel::-webkit-scrollbar-track {\n background: transparent;\n}\n\n#profiler-mini-panel::-webkit-scrollbar-thumb {\n background: rgba(255, 255, 255, 0.15);\n border-radius: 3px;\n transition: background 0.2s;\n}\n\n#profiler-mini-panel::-webkit-scrollbar-thumb:hover {\n background: rgba(255, 255, 255, 0.25);\n}\n\n.mini-panel-content {\n padding: 0;\n font-size: 11px;\n line-height: 1.5;\n font-family: var(--font-mono);\n letter-spacing: 0.3px;\n user-select: none;\n -webkit-user-select: none;\n}\n\n.mini-panel-content .profiler-content {\n display: block !important;\n background: transparent;\n}\n\n.mini-panel-content .list-scroll-wrapper {\n max-height: calc(100vh - 120px);\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n.mini-panel-content .list-scroll-wrapper::-webkit-scrollbar {\n width: 4px;\n}\n\n.mini-panel-content .list-scroll-wrapper::-webkit-scrollbar-track {\n background: transparent;\n}\n\n.mini-panel-content .list-scroll-wrapper::-webkit-scrollbar-thumb {\n background: rgba(255, 255, 255, 0.1);\n border-radius: 2px;\n}\n\n.mini-panel-content .list-scroll-wrapper::-webkit-scrollbar-thumb:hover {\n background: rgba(255, 255, 255, 0.2);\n}\n\n.mini-panel-content .parameters {\n background: transparent;\n border: none;\n box-shadow: none;\n padding: 4px;\n}\n\n.mini-panel-content .list-container.parameters {\n padding: 2px 6px 0px 6px !important;\n}\n\n.mini-panel-content .list-header {\n display: none;\n padding: 2px 4px;\n font-size: 11px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.mini-panel-content .list-item {\n border-bottom: 1px solid rgba(74, 74, 90, 0.2);\n transition: background-color 0.15s;\n}\n\n.mini-panel-content .list-item:last-child {\n border-bottom: none;\n}\n\n.mini-panel-content .list-item:hover {\n background-color: rgba(255, 255, 255, 0.04);\n}\n\n.mini-panel-content .list-item.actionable:hover {\n background-color: rgba(255, 255, 255, 0.06);\n cursor: pointer;\n}\n\n/* Style adjustments for lil-gui look */\n.mini-panel-content .item-row {\n padding: 3px 8px;\n min-height: 24px;\n}\n\n.mini-panel-content .list-item-row {\n padding: 1px 4px;\n gap: 8px;\n min-height: 21px;\n align-items: center;\n}\n\n.mini-panel-content input[type=\"checkbox\"] {\n width: 12px;\n height: 12px;\n}\n\n.mini-panel-content input[type=\"range\"] {\n height: 18px;\n}\n\n.mini-panel-content .value-number input,\n.mini-panel-content .value-slider input {\n background-color: rgba(0, 0, 0, 0.3);\n border: 1px solid rgba(74, 74, 90, 0.5);\n font-size: 10px;\n}\n\n.mini-panel-content .value-number input:focus,\n.mini-panel-content .value-slider input:focus {\n border-color: var(--accent-color);\n}\n\n.mini-panel-content .value-slider {\n gap: 6px;\n}\n\n/* Compact nested items */\n.mini-panel-content .list-item .list-item {\n margin-left: 8px;\n}\n\n.mini-panel-content .list-item .list-item .item-row,\n.mini-panel-content .list-item .list-item .list-item-row {\n padding: 2px 6px;\n min-height: 22px;\n}\n\n/* Compact collapsible headers */\n.mini-panel-content .collapsible .item-row,\n.mini-panel-content .list-item-row.collapsible {\n padding: 2px 8px;\n font-weight: 600;\n min-height: 16px;\n display: flex;\n align-items: center;\n}\n\n.mini-panel-content .collapsible-icon {\n font-size: 10px;\n width: 14px;\n height: 14px;\n}\n\n.mini-panel-content .param-control input[type=\"range\"] {\n height: 12px;\n margin-top: 1px;\n padding-top: 5px;\n user-select: none;\n -webkit-user-select: none;\n outline: none;\n}\n\n.mini-panel-content .param-control input[type=\"range\"]::-webkit-slider-thumb {\n width: 14px;\n height: 14px;\n margin-top: -5px;\n user-select: none;\n -webkit-user-select: none;\n}\n\n.mini-panel-content .param-control input[type=\"range\"]::-moz-range-thumb {\n width: 14px;\n height: 14px;\n user-select: none;\n -moz-user-select: none;\n}\n\n.mini-panel-content .list-children-container {\n padding-left: 0;\n}\n\n.mini-panel-content .param-control input[type=\"number\"] {\n flex-basis: 60px !important;\n}\n\n.mini-panel-content .param-control {\n align-items: center;\n}\n\n.mini-panel-content .param-control select {\n font-size: 11px;\n}\n\n.mini-panel-content .list-item-wrapper {\n margin-top: 0;\n margin-bottom: 0;\n}\n\n#profiler-panel {\n position: fixed;\n z-index: 1001 !important;\n bottom: 0;\n left: 0;\n right: 0;\n height: 350px;\n background-color: var(--profiler-bg);\n backdrop-filter: blur(8px);\n border-top: 2px solid var(--profiler-border);\n color: var(--text-primary);\n display: flex;\n flex-direction: column;\n z-index: 1000;\n /*box-shadow: 0 -5px 25px rgba(0, 0, 0, 0.5);*/\n transform: translateY(100%);\n transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), height 0.3s ease-out, width 0.3s ease-out;\n font-family: var(--font-mono);\n}\n\n#profiler-panel.resizing,\n#profiler-panel.dragging {\n transition: none;\n}\n\n#profiler-panel.visible {\n transform: translateY(0);\n}\n\n#profiler-panel.maximized {\n height: 100vh;\n}\n\n/* Position-specific styles */\n#profiler-panel.position-top {\n bottom: auto;\n top: 0;\n border-top: none;\n border-bottom: 2px solid var(--profiler-border);\n transform: translateY(-100%);\n}\n\n#profiler-panel.position-top.visible {\n transform: translateY(0);\n}\n\n#profiler-panel.position-bottom {\n /* Default position - already defined above */\n}\n\n#profiler-panel.position-left {\n top: 0;\n bottom: 0;\n left: 0;\n right: auto;\n width: 350px;\n height: 100%;\n border-top: none;\n border-right: 2px solid var(--profiler-border);\n transform: translateX(-100%);\n}\n\n#profiler-panel.position-left.visible {\n transform: translateX(0);\n}\n\n#profiler-panel.position-right {\n top: 0;\n bottom: 0;\n left: auto;\n right: 0;\n width: 350px;\n height: 100%;\n border-top: none;\n border-left: 2px solid var(--profiler-border);\n transform: translateX(100%);\n}\n\n#profiler-panel.position-right.visible {\n transform: translateX(0);\n}\n\n#profiler-panel.position-floating {\n border: 2px solid var(--profiler-border);\n border-radius: 8px;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);\n transform: none !important;\n overflow: hidden;\n}\n\n#profiler-panel.position-floating.visible {\n transform: none !important;\n}\n\n#profiler-panel.position-floating .profiler-header {\n border-radius: 6px 6px 0 0;\n}\n\n#profiler-panel.position-floating .panel-resizer {\n bottom: 0;\n right: 0;\n top: auto;\n left: auto;\n width: 16px;\n height: 16px;\n cursor: nwse-resize;\n border-radius: 0 0 6px 0;\n}\n\n#profiler-panel.position-floating .panel-resizer::after {\n content: '';\n position: absolute;\n right: 2px;\n bottom: 2px;\n width: 10px;\n height: 10px;\n background: linear-gradient(135deg, transparent 0%, transparent 45%, var(--profiler-border) 45%, var(--profiler-border) 55%, transparent 55%);\n}\n\n\n.panel-resizer {\n position: absolute;\n top: -2px;\n left: 0;\n width: 100%;\n height: 5px;\n cursor: ns-resize;\n z-index: 1001;\n touch-action: none;\n}\n\n#profiler-panel.position-top .panel-resizer {\n top: auto;\n bottom: -2px;\n}\n\n#profiler-panel.position-left .panel-resizer {\n top: 0;\n left: auto;\n right: -2px;\n width: 5px;\n height: 100%;\n cursor: ew-resize;\n}\n\n#profiler-panel.position-right .panel-resizer {\n top: 0;\n left: -2px;\n right: auto;\n width: 5px;\n height: 100%;\n cursor: ew-resize;\n}\n\n.profiler-header {\n display: flex;\n background-color: var(--profiler-header-bg);\n border-bottom: 1px solid var(--profiler-border);\n flex-shrink: 0;\n justify-content: space-between;\n align-items: stretch;\n\n overflow-x: auto;\n overflow-y: hidden;\n width: calc(100% - 134px);\n height: 38px;\n user-select: none;\n -webkit-user-select: none;\n}\n\n/* Adjust header width based on panel position */\n#profiler-panel.position-right .profiler-header,\n#profiler-panel.position-left .profiler-header {\n width: calc(100% - 134px);\n}\n\n#profiler-panel.position-bottom .profiler-header,\n#profiler-panel.position-top .profiler-header {\n width: calc(100% - 134px);\n}\n\n/* Adjust header width when position toggle button is hidden (mobile) */\n#profiler-panel.hide-position-toggle .profiler-header {\n width: calc(100% - 90px);\n}\n\n/* ===== RULES FOR WHEN THERE ARE NO TABS ===== */\n\n/* Horizontal mode (bottom/top) without tabs */\n#profiler-panel.position-bottom.no-tabs:not(.maximized),\n#profiler-panel.position-top.no-tabs:not(.maximized) {\n height: 38px !important;\n min-height: 38px !important;\n}\n\n#profiler-panel.position-bottom.no-tabs .profiler-header,\n#profiler-panel.position-top.no-tabs .profiler-header {\n width: 100%;\n height: 38px;\n border-bottom: none;\n}\n\n#profiler-panel.position-bottom.no-tabs .profiler-content-wrapper,\n#profiler-panel.position-top.no-tabs .profiler-content-wrapper {\n display: none;\n}\n\n#profiler-panel.position-bottom.no-tabs .panel-resizer,\n#profiler-panel.position-top.no-tabs .panel-resizer {\n display: none;\n}\n\n/* Vertical mode (right/left) without tabs */\n#profiler-panel.position-right.no-tabs:not(.maximized),\n#profiler-panel.position-left.no-tabs:not(.maximized) {\n width: 45px !important;\n min-width: 45px !important;\n}\n\n/* Vertical layout for header when no tabs */\n#profiler-panel.position-right.no-tabs .profiler-header,\n#profiler-panel.position-left.no-tabs .profiler-header {\n width: 100%;\n flex-direction: column;\n height: 100%;\n border-bottom: none;\n}\n\n/* Vertical layout for controls when no tabs */\n#profiler-panel.position-right.no-tabs .profiler-controls,\n#profiler-panel.position-left.no-tabs .profiler-controls {\n position: static;\n flex-direction: column-reverse;\n justify-content: flex-end;\n width: 100%;\n height: 100%;\n border-bottom: none;\n border-left: none;\n background: transparent;\n}\n\n#profiler-panel.position-right.no-tabs .profiler-controls button,\n#profiler-panel.position-left.no-tabs .profiler-controls button {\n width: 100%;\n height: 45px;\n border-left: none;\n border-top: none;\n border-bottom: 1px solid var(--profiler-border);\n}\n\n#profiler-panel.position-right.no-tabs .profiler-content-wrapper,\n#profiler-panel.position-left.no-tabs .profiler-content-wrapper {\n display: none;\n}\n\n#profiler-panel.position-right.no-tabs .profiler-tabs,\n#profiler-panel.position-left.no-tabs .profiler-tabs {\n display: none;\n}\n\n#profiler-panel.position-right.no-tabs .panel-resizer,\n#profiler-panel.position-left.no-tabs .panel-resizer {\n display: none;\n}\n\n/* Hide position toggle on mobile without tabs */\n#profiler-panel.hide-position-toggle.position-right.no-tabs:not(.maximized),\n#profiler-panel.hide-position-toggle.position-left.no-tabs:not(.maximized) {\n width: 45px !important;\n min-width: 45px !important;\n}\n\n/* Hide drag indicator on mobile devices */\n#profiler-panel.hide-position-toggle .tab-btn.active::before {\n display: none;\n}\n\n.profiler-header::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n}\n\n.profiler-header::-webkit-scrollbar-track {\n background: transparent;\n}\n\n.profiler-header::-webkit-scrollbar-thumb {\n background-color: rgba(0, 0, 0, 0.25);\n border-radius: 10px;\n transition: background 0.3s ease;\n}\n\n.profiler-header::-webkit-scrollbar-thumb:hover {\n background-color: rgba(0, 0, 0, 0.4);\n}\n\n.profiler-header::-webkit-scrollbar-corner {\n background: transparent;\n}\n\n#profiler-panel.dragging .profiler-header {\n cursor: grabbing !important;\n}\n\n#profiler-panel.dragging {\n opacity: 0.8;\n}\n\n.profiler-tabs {\n display: flex;\n cursor: grab;\n position: relative;\n}\n\n.profiler-tabs:active {\n cursor: grabbing;\n}\n\n.profiler-tabs::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n}\n\n.profiler-tabs::-webkit-scrollbar-track {\n background: transparent;\n}\n\n.profiler-tabs::-webkit-scrollbar-thumb {\n background-color: rgba(0, 0, 0, 0.25);\n border-radius: 10px;\n transition: background 0.3s ease;\n}\n\n.profiler-tabs::-webkit-scrollbar-thumb:hover {\n background-color: rgba(0, 0, 0, 0.4);\n}\n\n.profiler-tabs::-webkit-scrollbar-corner {\n background: transparent;\n}\n\n.profiler-controls {\n display: flex;\n position: absolute;\n right: 0;\n top: 0;\n height: 38px;\n background: var(--profiler-header-bg);\n border-bottom: 1px solid var(--profiler-border);\n}\n\n.tab-btn {\n position: relative;\n background: transparent;\n border: none;\n /*border-right: 1px solid var(--profiler-border);*/\n color: var(--text-secondary);\n padding: 8px 18px;\n cursor: default;\n display: flex;\n align-items: center;\n font-family: var(--font-family);\n font-weight: 600;\n font-size: 14px;\n user-select: none;\n transition: opacity 0.2s, transform 0.2s;\n touch-action: none;\n}\n\n.tab-btn.active {\n border-bottom: 2px solid var(--accent-color);\n color: white;\n}\n\n.tab-btn.active::before {\n content: '⋮⋮';\n position: absolute;\n left: 3px;\n top: calc(50% - 2px);\n transform: translateY(-50%);\n color: var(--profiler-border);\n font-size: 18px;\n letter-spacing: -2px;\n opacity: 0.6;\n}\n\n.tab-btn.no-detach.active::before {\n display: none;\n}\n\n#floating-btn,\n#maximize-btn,\n#hide-panel-btn {\n background: transparent;\n border: none;\n border-left: 1px solid var(--profiler-border);\n color: var(--text-secondary);\n width: 45px;\n height: 100%;\n cursor: pointer;\n transition: all 0.2s;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n/* Disable transitions in vertical mode to avoid broken animations */\n#profiler-panel.position-right #floating-btn,\n#profiler-panel.position-right #maximize-btn,\n#profiler-panel.position-right #hide-panel-btn,\n#profiler-panel.position-left #floating-btn,\n#profiler-panel.position-left #maximize-btn,\n#profiler-panel.position-left #hide-panel-btn {\n transition: background-color 0.2s, color 0.2s;\n}\n\n#floating-btn:hover,\n#maximize-btn:hover,\n#hide-panel-btn:hover {\n background-color: rgba(255, 255, 255, 0.1);\n color: var(--text-primary);\n}\n\n/* Hide maximize button when there are no tabs */\n#profiler-panel.position-right.no-tabs #maximize-btn,\n#profiler-panel.position-left.no-tabs #maximize-btn,\n#profiler-panel.position-bottom.no-tabs #maximize-btn,\n#profiler-panel.position-top.no-tabs #maximize-btn {\n display: none !important;\n}\n\n.profiler-content-wrapper {\n flex-grow: 1;\n overflow: hidden;\n position: relative;\n}\n\n.profiler-content {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n overflow-y: auto;\n font-size: 13px;\n visibility: hidden;\n opacity: 0;\n transition: opacity 0.2s, visibility 0.2s;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n user-select: none;\n -webkit-user-select: none;\n}\n\n.profiler-content.active {\n visibility: visible;\n opacity: 1;\n}\n\n.profiler-content {\n overflow: auto; /* make sure scrollbars can appear */\n}\n\n.profiler-content::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n}\n\n.profiler-content::-webkit-scrollbar-track {\n background: transparent;\n}\n\n.profiler-content::-webkit-scrollbar-thumb {\n background-color: rgba(0, 0, 0, 0.25);\n border-radius: 10px;\n transition: background 0.3s ease;\n}\n\n.profiler-content::-webkit-scrollbar-thumb:hover {\n background-color: rgba(0, 0, 0, 0.4);\n}\n\n.profiler-content::-webkit-scrollbar-corner {\n background: transparent;\n}\n\n.profiler-content {\n scrollbar-width: thin; /* \"auto\" | \"thin\" */\n scrollbar-color: rgba(0, 0, 0, 0.25) transparent;\n}\n\n.list-item-row {\n display: grid;\n align-items: center;\n padding: 4px 8px;\n border-radius: 3px;\n transition: background-color 0.2s;\n gap: 10px;\n border-bottom: none;\n user-select: none;\n -webkit-user-select: none;\n}\n\n.parameters .list-item-row {\n min-height: 31px;\n}\n\n.mini-panel-content .parameters .list-item-row {\n min-height: 21px;\n}\n\n.list-item-wrapper {\n margin-top: 2px;\n margin-bottom: 2px;\n user-select: none;\n -webkit-user-select: none;\n}\n\n.list-item-wrapper:first-child {\n /*margin-top: 0;*/\n}\n\n.list-item-wrapper:not(.header-wrapper):nth-child(odd) > .list-item-row {\n background-color: rgba(0,0,0,0.1);\n}\n\n.list-item-wrapper.header-wrapper>.list-item-row {\n color: var(--accent-color);\n background-color: rgba(0, 170, 255, 0.1);\n}\n\n.list-item-wrapper.header-wrapper>.list-item-row>.list-item-cell:first-child {\n font-weight: 600;\n line-height: 1;\n}\n\n.list-item-row.collapsible,\n.list-item-row.actionable {\n cursor: pointer;\n}\n\n.list-item-row.collapsible {\n background-color: rgba(0, 170, 255, 0.15) !important;\n min-height: 23px;\n}\n\n.list-item-row.collapsible.alert,\n.list-item-row.alert {\n background-color: rgba(244, 67, 54, 0.1) !important;\n}\n\n@media (hover: hover) {\n\n .list-item-row:hover:not(.collapsible):not(.no-hover),\n .list-item-row:hover:not(.no-hover),\n .list-item-row.actionable:hover,\n .list-item-row.collapsible.actionable:hover {\n background-color: rgba(255, 255, 255, 0.05) !important;\n }\n\n .list-item-row.collapsible:hover {\n background-color: rgba(0, 170, 255, 0.25) !important;\n }\n\n}\n\n.list-item-cell {\n white-space: pre;\n display: flex;\n align-items: center;\n user-select: none;\n -webkit-user-select: none;\n}\n\n.list-item-cell:not(:first-child) {\n justify-content: flex-end;\n font-weight: 600;\n}\n\n.list-header {\n display: grid;\n align-items: center;\n padding: 4px 8px;\n font-weight: 600;\n color: var(--text-secondary);\n padding-bottom: 6px;\n border-bottom: 1px solid var(--profiler-border);\n margin-bottom: 5px;\n gap: 10px;\n user-select: none;\n -webkit-user-select: none;\n}\n\n.list-item-wrapper.section-start {\n margin-top: 5px;\n margin-bottom: 5px;\n}\n\n.list-header .list-header-cell:not(:first-child) {\n text-align: right;\n}\n\n.list-children-container {\n padding-left: 1.5em;\n overflow: hidden;\n transition: max-height 0.1s ease-out;\n margin-top: 2px;\n}\n\n.list-children-container.closed {\n max-height: 0;\n}\n\n.item-toggler {\n display: inline-block;\n margin-right: 0.8em;\n text-align: left;\n}\n\n.list-item-row.open .item-toggler::before {\n content: '-';\n}\n\n.list-item-row:not(.open) .item-toggler::before {\n content: '+';\n}\n\n.list-item-cell .value.good {\n color: var(--color-green);\n}\n\n.list-item-cell .value.warn {\n color: var(--color-yellow);\n}\n\n.list-item-cell .value.bad {\n color: var(--color-red);\n}\n\n.list-scroll-wrapper {\n overflow-x: auto;\n width: 100%;\n user-select: none;\n -webkit-user-select: none;\n}\n\n.list-container.parameters .list-item-row:not(.collapsible) {\n}\n\n.graph-container {\n width: 100%;\n box-sizing: border-box;\n padding: 8px 0;\n position: relative;\n}\n\n.graph-svg {\n width: 100%;\n height: 80px;\n background-color: var(--profiler-header);\n border: 1px solid var(--profiler-border);\n border-radius: 4px;\n}\n\n.graph-path {\n stroke-width: 2;\n fill-opacity: 0.4;\n}\n\n.console-header {\n padding: 10px;\n border-bottom: 1px solid var(--profiler-border);\n display: flex;\n gap: 20px;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n}\n\n.console-buttons-group {\n display: flex;\n gap: 20px;\n}\n\n.console-filter-input {\n background-color: var(--profiler-bg);\n border: 1px solid var(--profiler-border);\n color: var(--text-primary);\n border-radius: 4px;\n padding: 4px 8px;\n font-family: var(--font-mono);\n flex-grow: 1;\n max-width: 300px;\n border-radius: 15px;\n}\n\n.console-copy-button {\n background: transparent;\n border: none;\n color: var(--text-secondary);\n cursor: pointer;\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n transition: color 0.2s, background-color 0.2s;\n}\n\n.console-copy-button:hover {\n color: var(--text-primary);\n background-color: var(--profiler-hover);\n}\n\n.console-copy-button.copied {\n color: var(--color-green);\n}\n\n#console-log {\n display: flex;\n flex-direction: column;\n gap: 4px;\n padding: 10px;\n overflow-y: auto;\n flex-grow: 1;\n user-select: text;\n -webkit-user-select: text;\n}\n\n.log-message {\n padding: 2px 5px;\n white-space: pre-wrap;\n word-break: break-all;\n border-radius: 3px;\n line-height: 1.5 !important;\n}\n\n.log-message.hidden {\n display: none;\n}\n\n.log-message.info {\n color: var(--text-primary);\n}\n\n.log-message.warn {\n color: var(--color-yellow);\n}\n\n.log-message.error {\n color: #f9dedc;\n background-color: rgba(244, 67, 54, 0.1);\n}\n\n.log-prefix {\n color: var(--text-secondary);\n margin-right: 8px;\n}\n\n.log-code {\n background-color: rgba(255, 255, 255, 0.1);\n border-radius: 3px;\n padding: 1px 4px;\n}\n\n.thumbnail-container {\n display: flex;\n align-items: center;\n}\n\n.thumbnail-svg {\n width: 40px;\n height: 22.5px;\n flex-shrink: 0;\n margin-right: 8px;\n}\n\n.param-control {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 10px;\n width: 100%;\n}\n\n.param-control input,\n.param-control select,\n.param-control button {\n background-color: var(--profiler-bg);\n border: 1px solid var(--profiler-border);\n color: var(--text-primary);\n border-radius: 4px;\n padding: 4px 6px;\n padding-bottom: 2px;\n font-family: var(--font-mono);\n width: 100%;\n box-sizing: border-box;\n}\n\n.param-control select {\n padding-top: 3px;\n padding-bottom: 1px;\n}\n\n.param-control input[type=\"number\"] {\n cursor: ns-resize;\n}\n\n.param-control input[type=\"color\"] {\n padding: 2px;\n}\n\n.param-control button {\n cursor: pointer;\n transition: background-color 0.2s;\n}\n\n.param-control button:hover {\n background-color: var(--profiler-header);\n}\n\n.param-control-vector {\n display: flex;\n gap: 5px;\n}\n\n.custom-checkbox {\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n gap: 8px;\n will-change: transform;\n}\n\n.custom-checkbox input {\n display: none;\n}\n\n.custom-checkbox .checkmark {\n width: 14px;\n height: 14px;\n border: 1px solid var(--accent-color);\n border-radius: 3px;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n transition: background-color 0.2s, border-color 0.2s;\n}\n\n.custom-checkbox .checkmark::after {\n content: '';\n width: 6px;\n height: 6px;\n background-color: var(--accent-color);\n border-radius: 1px;\n display: block;\n transform: scale(0);\n transition: transform 0.2s;\n}\n\n.custom-checkbox input:checked+.checkmark {\n border-color: var(--accent-color);\n}\n\n.custom-checkbox input:checked+.checkmark::after {\n transform: scale(1);\n}\n\n.param-control input[type=\"range\"] {\n -webkit-appearance: none;\n appearance: none;\n width: 100%;\n height: 16px;\n background: var(--profiler-header);\n border-radius: 5px;\n border: 1px solid var(--profiler-border);\n outline: none;\n padding: 0px;\n padding-top: 8px;\n}\n\n.param-control input[type=\"range\"]::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 18px;\n height: 18px;\n background: var(--profiler-bg);\n border: 1px solid var(--accent-color);\n border-radius: 3px;\n cursor: pointer;\n margin-top: -8px;\n}\n\n.param-control input[type=\"range\"]::-moz-range-thumb {\n width: 18px;\n height: 18px;\n background: var(--profiler-bg);\n border: 2px solid var(--accent-color);\n border-radius: 3px;\n cursor: pointer;\n}\n\n.param-control input[type=\"range\"]::-moz-range-track {\n width: 100%;\n height: 16px;\n background: var(--profiler-header);\n border-radius: 5px;\n border: 1px solid var(--profiler-border);\n}\n\n/* Override .param-control styles for mini-panel-content */\n.mini-panel-content input,\n.mini-panel-content select,\n.mini-panel-content button {\n padding: 2px 4px;\n height: 21px;\n line-height: 1.4;\n padding-top: 4px;\n}\n\n.mini-panel-content .param-control input,\n.mini-panel-content .param-control select,\n.mini-panel-content .param-control button {\n background-color: #1e1e24c2;\n line-height: 1.0;\n}\n\n.mini-panel-content .param-control select {\n padding: 2px 2px;\n padding-top: 3px;\n}\n\n.mini-panel-content .param-control input[type=\"number\"]::-webkit-outer-spin-button,\n.mini-panel-content .param-control input[type=\"number\"]::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n\n.mini-panel-content .param-control input[type=\"number\"] {\n -moz-appearance: textfield;\n}\n\n.mini-panel-content .list-item-cell span {\n position: relative;\n top: 1px;\n margin-left: 2px;\n}\n\n.mini-panel-content .custom-checkbox .checkmark {\n width: 12px;\n height: 12px;\n margin-bottom: 2px;\n will-change: transform;\n}\n\n.mini-panel-content .list-container.parameters .list-item-row:not(.collapsible) {\n margin-bottom: 2px;\n}\n\n@media screen and (max-width: 450px) and (orientation: portrait) {\n\n .console-filter-input {\n max-width: 100px;\n }\n\n}\n\n/* Touch device optimizations */\n@media (hover: none) and (pointer: coarse) {\n\n .panel-resizer {\n top: -10px !important;\n height: 20px !important;\n }\n\n #profiler-panel.position-top .panel-resizer {\n top: auto !important;\n bottom: -10px !important;\n height: 20px !important;\n }\n\n #profiler-panel.position-left .panel-resizer {\n right: -10px !important;\n width: 20px !important;\n height: 100% !important;\n }\n\n #profiler-panel.position-right .panel-resizer {\n left: -10px !important;\n width: 20px !important;\n height: 100% !important;\n }\n\n .detached-tab-resizer-top,\n .detached-tab-resizer-bottom {\n height: 10px !important;\n }\n\n .detached-tab-resizer-left,\n .detached-tab-resizer-right {\n width: 10px !important;\n }\n\n}\n\n.drag-preview-indicator {\n position: fixed;\n background-color: rgba(0, 170, 255, 0.2);\n border: 2px dashed var(--accent-color);\n z-index: 999;\n pointer-events: none;\n transition: all 0.2s ease-out;\n}\n\n/* Detached Tab Windows */\n.detached-tab-panel {\n position: fixed;\n width: 500px;\n height: 400px;\n background: var(--profiler-bg);\n border: 1px solid var(--profiler-border);\n border-radius: 8px;\n box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);\n z-index: 1002;\n display: flex;\n flex-direction: column;\n backdrop-filter: blur(10px);\n overflow: hidden;\n opacity: 1;\n visibility: visible;\n transition: opacity 0.2s, visibility 0.2s;\n}\n\n#profiler-panel:not(.visible) ~ * .detached-tab-panel,\nbody:has(#profiler-panel:not(.visible)) .detached-tab-panel {\n opacity: 0;\n visibility: hidden;\n pointer-events: none;\n}\n\n.detached-tab-header {\n background: var(--profiler-header-bg);\n padding: 0 7px 0 15px;\n font-family: var(--font-family);\n font-size: 14px;\n color: var(--text-primary);\n font-weight: 600;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-bottom: 1px solid var(--profiler-border);\n cursor: grab;\n user-select: none;\n height: 38px;\n flex-shrink: 0;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n touch-action: none;\n}\n\n.detached-tab-header:active {\n cursor: grabbing;\n}\n\n.detached-header-controls {\n display: flex;\n gap: 5px;\n}\n\n.detached-reattach-btn {\n background: transparent;\n border: none;\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: 18px;\n line-height: 1;\n cursor: pointer;\n padding: 4px 8px;\n border-radius: 4px;\n transition: all 0.2s;\n display: flex;\n align-items: center;\n justify-content: center;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n.detached-reattach-btn:hover {\n background: rgba(0, 170, 255, 0.2);\n color: var(--accent-color);\n}\n\n.detached-tab-content {\n flex: 1;\n overflow: auto;\n position: relative;\n background: var(--profiler-bg);\n}\n\n.detached-tab-content::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n}\n\n.detached-tab-content::-webkit-scrollbar-track {\n background: transparent;\n}\n\n.detached-tab-content::-webkit-scrollbar-thumb {\n background-color: rgba(0, 0, 0, 0.25);\n border-radius: 10px;\n transition: background 0.3s ease;\n}\n\n.detached-tab-content::-webkit-scrollbar-thumb:hover {\n background-color: rgba(0, 0, 0, 0.4);\n}\n\n.detached-tab-content::-webkit-scrollbar-corner {\n background: transparent;\n}\n\n.detached-tab-content .profiler-content {\n display: block !important;\n height: 100%;\n visibility: visible !important;\n opacity: 1 !important;\n position: relative !important;\n}\n\n.detached-tab-content .profiler-content > * {\n font-family: var(--font-mono);\n color: var(--text-primary);\n}\n\n.detached-tab-resizer {\n position: absolute;\n bottom: 0;\n right: 0;\n width: 20px;\n height: 20px;\n cursor: nwse-resize;\n z-index: 10;\n touch-action: none;\n}\n\n.detached-tab-resizer::after {\n content: '';\n position: absolute;\n bottom: 2px;\n right: 2px;\n width: 12px;\n height: 12px;\n border-right: 2px solid var(--profiler-border);\n border-bottom: 2px solid var(--profiler-border);\n border-bottom-right-radius: 6px;\n opacity: 0.5;\n}\n\n.detached-tab-resizer:hover::after {\n opacity: 1;\n border-color: var(--accent-color);\n}\n\n/* Edge resizers */\n.detached-tab-resizer-top {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 5px;\n cursor: ns-resize;\n z-index: 10;\n touch-action: none;\n}\n\n.detached-tab-resizer-right {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: 5px;\n cursor: ew-resize;\n z-index: 10;\n touch-action: none;\n}\n\n.detached-tab-resizer-bottom {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 5px;\n cursor: ns-resize;\n z-index: 10;\n touch-action: none;\n}\n\n.detached-tab-resizer-left {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: 5px;\n cursor: ew-resize;\n z-index: 10;\n touch-action: none;\n}\n\n/* Input number spin buttons - hide arrows */\n/* Chrome, Safari, Edge, Opera */\n#profiler-panel input[type=\"number\"]::-webkit-outer-spin-button,\n#profiler-panel input[type=\"number\"]::-webkit-inner-spin-button,\n.detached-tab-content input[type=\"number\"]::-webkit-outer-spin-button,\n.detached-tab-content input[type=\"number\"]::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n\n/* Firefox */\n#profiler-panel input[type=\"number\"],\n.detached-tab-content input[type=\"number\"] {\n -moz-appearance: textfield;\n}\n", document.head.appendChild(e);
285
- }
286
- }, ye = class {
287
- constructor() {
288
- this.tabs = {}, this.activeTabId = null, this.isResizing = !1, this.lastHeightBottom = 350, this.lastWidthRight = 450, this.position = "bottom", this.detachedWindows = [], this.isMobile = this.detectMobile(), this.maxZIndex = 1002, this.nextTabOriginalIndex = 0, ve.init(), this.setupShell(), this.setupResizing(), this.isMobile && this.setupOrientationListener(), this.setupWindowResizeListener();
289
- }
290
- detectMobile() {
291
- let e = navigator.userAgent || navigator.vendor || window.opera, t = /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(e), n = "ontouchstart" in window || navigator.maxTouchPoints > 0, r = window.innerWidth <= 768;
292
- return t || n && r;
293
- }
294
- setupOrientationListener() {
295
- let e = () => {
296
- let e = window.innerWidth > window.innerHeight ? "right" : "bottom";
297
- this.position !== e && this.setPosition(e);
298
- };
299
- e(), window.addEventListener("orientationchange", e), window.addEventListener("resize", e);
300
- }
301
- setupWindowResizeListener() {
302
- let e = () => {
303
- this.detachedWindows.forEach((e) => {
304
- this.constrainWindowToBounds(e.panel);
305
- });
306
- }, t = () => {
307
- if (this.panel.classList.contains("maximized")) return;
308
- let e = window.innerWidth, t = window.innerHeight;
309
- if (this.position === "bottom") {
310
- let e = this.panel.offsetHeight, n = t - 50;
311
- e > n && (this.panel.style.height = `${n}px`, this.lastHeightBottom = n);
312
- } else if (this.position === "right") {
313
- let t = this.panel.offsetWidth, n = e - 50;
314
- t > n && (this.panel.style.width = `${n}px`, this.lastWidthRight = n);
315
- }
316
- };
317
- window.addEventListener("resize", () => {
318
- e(), t();
319
- });
320
- }
321
- constrainWindowToBounds(e) {
322
- let t = window.innerWidth, n = window.innerHeight, r = e.offsetWidth, i = e.offsetHeight, a = parseFloat(e.style.left) || e.offsetLeft || 0, o = parseFloat(e.style.top) || e.offsetTop || 0, s = r / 2, c = i / 2;
323
- a + r > t + s && (a = t + s - r), a < -s && (a = -s), o + i > n + c && (o = n + c - i), o < -c && (o = -c), e.style.left = `${a}px`, e.style.top = `${o}px`;
324
- }
325
- setupShell() {
326
- this.domElement = document.createElement("div"), this.domElement.id = "profiler-shell", this.toggleButton = document.createElement("button"), this.toggleButton.id = "profiler-toggle", this.toggleButton.innerHTML = "\n<span id=\"builtin-tabs-container\"></span>\n<span id=\"toggle-text\">\n <span id=\"fps-counter\">-</span>\n <span class=\"fps-label\">FPS</span>\n</span>\n<span id=\"toggle-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"icon icon-tabler icons-tabler-outline icon-tabler-device-ipad-horizontal-search\"><path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M11.5 20h-6.5a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v5.5\" /><path d=\"M9 17h2\" /><path d=\"M18 18m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" /><path d=\"M20.2 20.2l1.8 1.8\" /></svg>\n</span>\n", this.toggleButton.onclick = () => this.togglePanel(), this.builtinTabsContainer = this.toggleButton.querySelector("#builtin-tabs-container"), this.miniPanel = document.createElement("div"), this.miniPanel.id = "profiler-mini-panel", this.miniPanel.className = "profiler-mini-panel", this.panel = document.createElement("div"), this.panel.id = "profiler-panel";
327
- let e = document.createElement("div");
328
- e.className = "profiler-header", this.tabsContainer = document.createElement("div"), this.tabsContainer.className = "profiler-tabs";
329
- let t = document.createElement("div");
330
- t.className = "profiler-controls", this.floatingBtn = document.createElement("button"), this.floatingBtn.id = "floating-btn", this.floatingBtn.title = "Switch to Right Side", this.floatingBtn.innerHTML = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"></rect><line x1=\"15\" y1=\"3\" x2=\"15\" y2=\"21\"></line></svg>", this.floatingBtn.onclick = () => this.togglePosition(), this.isMobile && (this.floatingBtn.style.display = "none", this.panel.classList.add("hide-position-toggle")), this.maximizeBtn = document.createElement("button"), this.maximizeBtn.id = "maximize-btn", this.maximizeBtn.innerHTML = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3\"/></svg>", this.maximizeBtn.onclick = () => this.toggleMaximize();
331
- let n = document.createElement("button");
332
- n.id = "hide-panel-btn", n.textContent = "-", n.onclick = () => this.togglePanel(), t.append(this.floatingBtn, this.maximizeBtn, n), e.append(this.tabsContainer, t), this.contentWrapper = document.createElement("div"), this.contentWrapper.className = "profiler-content-wrapper";
333
- let r = document.createElement("div");
334
- r.className = "panel-resizer", this.panel.append(r, e, this.contentWrapper), this.domElement.append(this.toggleButton, this.miniPanel, this.panel), this.panel.classList.add(`position-${this.position}`);
335
- }
336
- setupResizing() {
337
- let e = this.panel.querySelector(".panel-resizer");
338
- e.addEventListener("pointerdown", (t) => {
339
- this.isResizing = !0, this.panel.classList.add("resizing"), e.setPointerCapture(t.pointerId);
340
- let n = t.clientX, r = t.clientY, i = this.panel.offsetHeight, a = this.panel.offsetWidth, o = (e) => {
341
- if (!this.isResizing) return;
342
- e.preventDefault();
343
- let t = e.clientX, o = e.clientY;
344
- if (this.position === "bottom") {
345
- let e = i - (o - r);
346
- e > 100 && e < window.innerHeight - 50 && (this.panel.style.height = `${e}px`);
347
- } else if (this.position === "right") {
348
- let e = a - (t - n);
349
- e > 200 && e < window.innerWidth - 50 && (this.panel.style.width = `${e}px`);
350
- }
351
- }, s = () => {
352
- this.isResizing = !1, this.panel.classList.remove("resizing"), e.removeEventListener("pointermove", o), e.removeEventListener("pointerup", s), e.removeEventListener("pointercancel", s), this.panel.classList.contains("maximized") || (this.position === "bottom" ? this.lastHeightBottom = this.panel.offsetHeight : this.position === "right" && (this.lastWidthRight = this.panel.offsetWidth), this.saveLayout());
353
- };
354
- e.addEventListener("pointermove", o), e.addEventListener("pointerup", s), e.addEventListener("pointercancel", s);
355
- });
356
- }
357
- toggleMaximize() {
358
- this.panel.classList.contains("maximized") ? (this.panel.classList.remove("maximized"), this.position === "bottom" ? (this.panel.style.height = `${this.lastHeightBottom}px`, this.panel.style.width = "100%") : this.position === "right" && (this.panel.style.height = "100%", this.panel.style.width = `${this.lastWidthRight}px`), this.maximizeBtn.innerHTML = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3\"/></svg>") : (this.position === "bottom" ? this.lastHeightBottom = this.panel.offsetHeight : this.position === "right" && (this.lastWidthRight = this.panel.offsetWidth), this.panel.classList.add("maximized"), this.position === "bottom" ? (this.panel.style.height = "100vh", this.panel.style.width = "100%") : this.position === "right" && (this.panel.style.height = "100%", this.panel.style.width = "100vw"), this.maximizeBtn.innerHTML = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"8\" y=\"8\" width=\"12\" height=\"12\" rx=\"2\" ry=\"2\"></rect><path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\"></path></svg>");
359
- }
360
- addTab(e) {
361
- this.tabs[e.id] = e, e.originalIndex = this.nextTabOriginalIndex++, e.allowDetach === !1 && e.button.classList.add("no-detach"), e.onVisibilityChange = () => this.updatePanelSize(), this.setupTabDragAndDrop(e), this.tabsContainer.appendChild(e.button), this.contentWrapper.appendChild(e.content), e.isVisible || (e.button.style.display = "none", e.content.style.display = "none"), e.builtin && this.addBuiltinTab(e), this.updatePanelSize();
362
- }
363
- addBuiltinTab(e) {
364
- let t = document.createElement("button");
365
- t.className = "builtin-tab-btn", e.icon ? t.innerHTML = e.icon : t.textContent = e.button.textContent.charAt(0).toUpperCase(), t.title = e.button.textContent;
366
- let n = document.createElement("div");
367
- n.className = "mini-panel-content", n.style.display = "none", e.builtinButton = t, e.miniContent = n, this.miniPanel.appendChild(n), t.onclick = (r) => {
368
- if (r.stopPropagation(), this.panel.classList.contains("visible")) e.isVisible || e.show(), e.isDetached ? e.detachedWindow && this.bringWindowToFront(e.detachedWindow.panel) : this.setActiveTab(e.id);
369
- else {
370
- let r = n.style.display !== "none" && n.children.length > 0;
371
- if (this.miniPanel.querySelectorAll(".mini-panel-content").forEach((e) => {
372
- e.style.display = "none";
373
- }), this.builtinTabsContainer.querySelectorAll(".builtin-tab-btn").forEach((e) => {
374
- e.classList.remove("active");
375
- }), r) this.miniPanel.classList.remove("visible"), n.style.display = "none", n.firstChild && e.content.appendChild(n.firstChild);
376
- else {
377
- if (t.classList.add("active"), !n.firstChild) {
378
- let t = e.content.querySelector(".list-scroll-wrapper") || e.content.firstElementChild;
379
- t && n.appendChild(t);
380
- }
381
- n.style.display = "block", this.miniPanel.classList.add("visible");
382
- }
383
- }
384
- }, this.builtinTabsContainer.appendChild(t), e.builtinButton = t, e.miniContent = n, e.profiler = this, e.isVisible || (t.style.display = "none", n.style.display = "none", Array.from(this.builtinTabsContainer.querySelectorAll(".builtin-tab-btn")).some((e) => e.style.display !== "none") || (this.builtinTabsContainer.style.display = "none"));
385
- }
386
- updatePanelSize() {
387
- Object.values(this.tabs).some((e) => !e.isDetached && e.isVisible) ? (this.panel.classList.remove("no-tabs"), Object.keys(this.tabs).length > 0 && (this.position === "bottom" ? parseInt(this.panel.style.height) === 38 && (this.panel.style.height = `${this.lastHeightBottom}px`) : this.position === "right" && parseInt(this.panel.style.width) === 45 && (this.panel.style.width = `${this.lastWidthRight}px`))) : (this.panel.classList.add("no-tabs"), this.panel.classList.contains("maximized") && (this.panel.classList.remove("maximized"), this.maximizeBtn.innerHTML = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3\"/></svg>"), this.position === "bottom" ? this.panel.style.height = "38px" : this.position === "right" && (this.panel.style.width = "45px"));
388
- }
389
- setupTabDragAndDrop(e) {
390
- if (this.isMobile) {
391
- e.button.addEventListener("click", () => {
392
- this.setActiveTab(e.id);
393
- });
394
- return;
395
- }
396
- if (e.allowDetach === !1) {
397
- e.button.addEventListener("click", () => {
398
- this.setActiveTab(e.id);
399
- }), e.button.style.cursor = "default";
400
- return;
401
- }
402
- let t = !1, n, r, i = !1, a = null, o = (a) => {
403
- n = a.clientX, r = a.clientY, t = !1, i = !1, e.button.setPointerCapture(a.pointerId);
404
- }, s = (o) => {
405
- let s = o.clientX, c = o.clientY, l = Math.abs(s - n), u = Math.abs(c - r);
406
- !t && (l > 10 || u > 10) && (t = !0, e.button.style.cursor = "grabbing", e.button.style.opacity = "0.5", e.button.style.transform = "scale(1.05)", a = this.createPreviewWindow(e, s, c), a.style.opacity = "0.8"), t && a && (i = !0, o.preventDefault(), a.style.left = `${s - 200}px`, a.style.top = `${c - 20}px`);
407
- }, c = () => {
408
- if (t && i && a) {
409
- a.parentNode && a.parentNode.removeChild(a);
410
- let t = parseInt(a.style.left) + 200, n = parseInt(a.style.top) + 20;
411
- this.detachTab(e, t, n);
412
- } else i || this.setActiveTab(e.id), a && a.parentNode && a.parentNode.removeChild(a);
413
- e.button.style.opacity = "", e.button.style.transform = "", e.button.style.cursor = "", t = !1, i = !1, a = null, e.button.removeEventListener("pointermove", s), e.button.removeEventListener("pointerup", c), e.button.removeEventListener("pointercancel", c);
414
- };
415
- e.button.addEventListener("pointerdown", (t) => {
416
- o(t), e.button.addEventListener("pointermove", s), e.button.addEventListener("pointerup", c), e.button.addEventListener("pointercancel", c);
417
- }), e.button.style.cursor = "grab";
418
- }
419
- createPreviewWindow(e, t, n) {
420
- let r = document.createElement("div");
421
- r.className = "detached-tab-panel", r.style.left = `${t - 200}px`, r.style.top = `${n - 20}px`, r.style.pointerEvents = "none", this.maxZIndex++, r.style.setProperty("z-index", this.maxZIndex, "important");
422
- let i = document.createElement("div");
423
- i.className = "detached-tab-header";
424
- let a = document.createElement("span");
425
- a.textContent = e.button.textContent.replace("⇱", "").trim(), i.appendChild(a);
426
- let o = document.createElement("div");
427
- o.className = "detached-header-controls";
428
- let s = document.createElement("button");
429
- s.className = "detached-reattach-btn", s.innerHTML = "↩", o.appendChild(s), i.appendChild(o);
430
- let c = document.createElement("div");
431
- c.className = "detached-tab-content";
432
- let l = document.createElement("div");
433
- return l.className = "detached-tab-resizer", r.appendChild(l), r.appendChild(i), r.appendChild(c), document.body.appendChild(r), r;
434
- }
435
- detachTab(e, t, n) {
436
- if (e.isDetached || e.allowDetach === !1) return;
437
- let r = Array.from(this.tabsContainer.children).map((e) => Object.keys(this.tabs).find((t) => this.tabs[t].button === e)).filter((e) => e !== void 0), i = r.indexOf(e.id), a = null;
438
- if (this.activeTabId === e.id) {
439
- e.setActive(!1);
440
- let t = r.filter((t) => t !== e.id && !this.tabs[t].isDetached && this.tabs[t].isVisible);
441
- if (t.length > 0) {
442
- for (let e = i - 1; e >= 0; e--) if (t.includes(r[e])) {
443
- a = r[e];
444
- break;
445
- }
446
- if (!a) {
447
- for (let e = i + 1; e < r.length; e++) if (t.includes(r[e])) {
448
- a = r[e];
449
- break;
450
- }
451
- }
452
- a ||= t[0];
453
- }
454
- }
455
- e.button.parentNode && e.button.parentNode.removeChild(e.button), e.content.parentNode && e.content.parentNode.removeChild(e.content);
456
- let o = this.createDetachedWindow(e, t, n);
457
- this.detachedWindows.push(o), e.isDetached = !0, e.detachedWindow = o, a ? this.setActiveTab(a) : this.activeTabId === e.id && (this.activeTabId = null), this.updatePanelSize(), this.saveLayout();
458
- }
459
- createDetachedWindow(e, t, n) {
460
- let r = window.innerWidth, i = window.innerHeight, a = t - 200, o = n - 20;
461
- a + 400 > r && (a = r - 400), a < 0 && (a = 0), o + 300 > i && (o = i - 300), o < 0 && (o = 0);
462
- let s = document.createElement("div");
463
- s.className = "detached-tab-panel", s.style.left = `${a}px`, s.style.top = `${o}px`, this.panel.classList.contains("visible") || (s.style.opacity = "0", s.style.visibility = "hidden", s.style.pointerEvents = "none"), e.isVisible || (s.style.display = "none");
464
- let c = document.createElement("div");
465
- c.className = "detached-tab-header";
466
- let l = document.createElement("span");
467
- l.textContent = e.button.textContent.replace("⇱", "").trim(), c.appendChild(l);
468
- let u = document.createElement("div");
469
- u.className = "detached-header-controls";
470
- let d = document.createElement("button");
471
- d.className = "detached-reattach-btn", d.innerHTML = "↩", d.title = "Reattach to main panel", d.onclick = () => this.reattachTab(e), u.appendChild(d), c.appendChild(u);
472
- let f = document.createElement("div");
473
- f.className = "detached-tab-content", f.appendChild(e.content), e.content.style.display = "block", e.content.classList.add("active");
474
- let p = document.createElement("div");
475
- p.className = "detached-tab-resizer-top";
476
- let m = document.createElement("div");
477
- m.className = "detached-tab-resizer-right";
478
- let h = document.createElement("div");
479
- h.className = "detached-tab-resizer-bottom";
480
- let g = document.createElement("div");
481
- g.className = "detached-tab-resizer-left";
482
- let _ = document.createElement("div");
483
- return _.className = "detached-tab-resizer", s.appendChild(p), s.appendChild(m), s.appendChild(h), s.appendChild(g), s.appendChild(_), s.appendChild(c), s.appendChild(f), document.body.appendChild(s), this.setupDetachedWindowDrag(s, c, e), this.setupDetachedWindowResize(s, p, m, h, g, _), s.style.setProperty("z-index", this.maxZIndex, "important"), {
484
- panel: s,
485
- tab: e
486
- };
487
- }
488
- bringWindowToFront(e) {
489
- this.maxZIndex++, e.style.setProperty("z-index", this.maxZIndex, "important");
490
- }
491
- setupDetachedWindowDrag(e, t, n) {
492
- let r = !1, i, a, o, s;
493
- e.addEventListener("pointerdown", () => {
494
- this.bringWindowToFront(e);
495
- });
496
- let c = (n) => {
497
- if (n.target.classList.contains("detached-reattach-btn")) return;
498
- this.bringWindowToFront(e), r = !0, t.style.cursor = "grabbing", t.setPointerCapture(n.pointerId), i = n.clientX, a = n.clientY;
499
- let c = e.getBoundingClientRect();
500
- o = c.left, s = c.top;
501
- }, l = (t) => {
502
- if (!r) return;
503
- t.preventDefault();
504
- let n = t.clientX, c = t.clientY, l = n - i, u = c - a, d = o + l, f = s + u, p = window.innerWidth, m = window.innerHeight, h = e.offsetWidth, g = e.offsetHeight, _ = h / 2, v = g / 2;
505
- d + h > p + _ && (d = p + _ - h), d < -_ && (d = -_), f + g > m + v && (f = m + v - g), f < -v && (f = -v), e.style.left = `${d}px`, e.style.top = `${f}px`;
506
- let y = this.panel.getBoundingClientRect();
507
- n >= y.left && n <= y.right && c >= y.top && c <= y.bottom ? (e.style.opacity = "0.5", this.panel.style.outline = "2px solid var(--accent-color)") : (e.style.opacity = "", this.panel.style.outline = "");
508
- }, u = (i) => {
509
- if (!r) return;
510
- r = !1, t.style.cursor = "", e.style.opacity = "", this.panel.style.outline = "";
511
- let a = i.clientX, o = i.clientY;
512
- if (a !== void 0 && o !== void 0) {
513
- let e = this.panel.getBoundingClientRect();
514
- a >= e.left && a <= e.right && o >= e.top && o <= e.bottom && n ? this.reattachTab(n) : this.saveLayout();
515
- }
516
- t.removeEventListener("pointermove", l), t.removeEventListener("pointerup", u), t.removeEventListener("pointercancel", u);
517
- };
518
- t.addEventListener("pointerdown", (e) => {
519
- c(e), t.addEventListener("pointermove", l), t.addEventListener("pointerup", u), t.addEventListener("pointercancel", u);
520
- }), t.style.cursor = "grab";
521
- }
522
- setupDetachedWindowResize(e, t, n, r, i, a) {
523
- let o = (t, n) => {
524
- let r = !1, i, a, o, s, c, l, u = (n) => {
525
- n.preventDefault(), n.stopPropagation(), r = !0, this.bringWindowToFront(e), t.setPointerCapture(n.pointerId), i = n.clientX, a = n.clientY, o = e.offsetWidth, s = e.offsetHeight, c = e.offsetLeft, l = e.offsetTop;
526
- }, d = (t) => {
527
- if (!r) return;
528
- t.preventDefault();
529
- let u = t.clientX, d = t.clientY, f = u - i, p = d - a, m = window.innerWidth, h = window.innerHeight;
530
- if (n === "right" || n === "corner") {
531
- let t = o + f, n = m - c;
532
- t >= 250 && t <= n && (e.style.width = `${t}px`);
533
- }
534
- if (n === "bottom" || n === "corner") {
535
- let t = s + p, n = h - l;
536
- t >= 150 && t <= n && (e.style.height = `${t}px`);
537
- }
538
- if (n === "left") {
539
- let t = o - f, n = c + o - 250;
540
- if (t >= 250) {
541
- let r = c + f;
542
- r >= 0 && r <= n && (e.style.width = `${t}px`, e.style.left = `${r}px`);
543
- }
544
- }
545
- if (n === "top") {
546
- let t = s - p, n = l + s - 150;
547
- if (t >= 150) {
548
- let r = l + p;
549
- r >= 0 && r <= n && (e.style.height = `${t}px`, e.style.top = `${r}px`);
550
- }
551
- }
552
- }, f = () => {
553
- r = !1, t.removeEventListener("pointermove", d), t.removeEventListener("pointerup", f), t.removeEventListener("pointercancel", f), this.saveLayout();
554
- };
555
- t.addEventListener("pointerdown", (e) => {
556
- u(e), t.addEventListener("pointermove", d), t.addEventListener("pointerup", f), t.addEventListener("pointercancel", f);
557
- });
558
- };
559
- o(t, "top"), o(n, "right"), o(r, "bottom"), o(i, "left"), o(a, "corner");
560
- }
561
- reattachTab(e) {
562
- if (!e.isDetached) return;
563
- if (e.detachedWindow) {
564
- let t = this.detachedWindows.indexOf(e.detachedWindow);
565
- t > -1 && this.detachedWindows.splice(t, 1), e.detachedWindow.panel.parentNode && e.detachedWindow.panel.parentNode.removeChild(e.detachedWindow.panel), e.detachedWindow = null;
566
- }
567
- e.isDetached = !1;
568
- let t = Object.values(this.tabs).filter((e) => e.originalIndex !== void 0 && e.isVisible).sort((e, t) => e.originalIndex - t.originalIndex), n = Array.from(this.tabsContainer.children), r = 0;
569
- for (let n of t) {
570
- if (n.id === e.id) break;
571
- n.isDetached || r++;
572
- }
573
- r >= n.length || n.length === 0 ? this.tabsContainer.appendChild(e.button) : this.tabsContainer.insertBefore(e.button, n[r]), this.contentWrapper.appendChild(e.content), this.setActiveTab(e.id), this.updatePanelSize(), this.saveLayout();
574
- }
575
- setActiveTab(e) {
576
- this.activeTabId && this.tabs[this.activeTabId] && !this.tabs[this.activeTabId].isDetached && this.tabs[this.activeTabId].setActive(!1), this.activeTabId = e, this.tabs[e] && this.tabs[e].setActive(!0);
577
- }
578
- togglePanel() {
579
- this.panel.classList.toggle("visible"), this.toggleButton.classList.toggle("hidden");
580
- let e = this.panel.classList.contains("visible");
581
- if (e) this.savedMiniPanelState = {
582
- isVisible: this.miniPanel.classList.contains("visible"),
583
- activeTabId: null,
584
- contentMap: {}
585
- }, this.miniPanel.querySelectorAll(".mini-panel-content").forEach((e) => {
586
- e.style.display !== "none" && e.firstChild && Object.values(this.tabs).forEach((t) => {
587
- t.miniContent === e && (this.savedMiniPanelState.activeTabId = t.id, t.content.appendChild(e.firstChild));
588
- });
589
- }), this.miniPanel.classList.remove("visible"), this.miniPanel.querySelectorAll(".mini-panel-content").forEach((e) => {
590
- e.style.display = "none";
591
- }), this.builtinTabsContainer.querySelectorAll(".builtin-tab-btn").forEach((e) => {
592
- e.classList.remove("active");
593
- });
594
- else if (this.savedMiniPanelState && this.savedMiniPanelState.isVisible && this.savedMiniPanelState.activeTabId) {
595
- let e = this.tabs[this.savedMiniPanelState.activeTabId];
596
- if (e && e.miniContent && e.builtinButton) {
597
- this.miniPanel.classList.add("visible"), e.miniContent.style.display = "block", e.builtinButton.classList.add("active");
598
- let t = e.content.querySelector(".list-scroll-wrapper, .profiler-content > *");
599
- t && e.miniContent.appendChild(t);
600
- }
601
- }
602
- this.detachedWindows.forEach((t) => {
603
- e ? (t.panel.style.opacity = "", t.panel.style.visibility = "", t.panel.style.pointerEvents = "") : (t.panel.style.opacity = "0", t.panel.style.visibility = "hidden", t.panel.style.pointerEvents = "none");
604
- });
605
- }
606
- togglePosition() {
607
- let e = this.position === "bottom" ? "right" : "bottom";
608
- this.setPosition(e);
609
- }
610
- setPosition(e) {
611
- if (this.position === e) return;
612
- this.panel.style.transition = "none";
613
- let t = this.panel.classList.contains("maximized");
614
- e === "right" ? (this.position = "right", this.floatingBtn.classList.add("active"), this.floatingBtn.innerHTML = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"></rect><path d=\"M3 15h18\"></path></svg>", this.floatingBtn.title = "Switch to Bottom", this.panel.classList.remove("position-bottom"), this.panel.classList.add("position-right"), this.panel.style.bottom = "", this.panel.style.top = "0", this.panel.style.right = "0", this.panel.style.left = "", t ? (this.panel.style.width = "100vw", this.panel.style.height = "100%") : (this.panel.style.width = `${this.lastWidthRight}px`, this.panel.style.height = "100%")) : (this.position = "bottom", this.floatingBtn.classList.remove("active"), this.floatingBtn.innerHTML = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"></rect><line x1=\"15\" y1=\"3\" x2=\"15\" y2=\"21\"></line></svg>", this.floatingBtn.title = "Switch to Right Side", this.panel.classList.remove("position-right"), this.panel.classList.add("position-bottom"), this.panel.style.top = "", this.panel.style.right = "", this.panel.style.bottom = "0", this.panel.style.left = "0", t ? (this.panel.style.width = "100%", this.panel.style.height = "100vh") : (this.panel.style.width = "100%", this.panel.style.height = `${this.lastHeightBottom}px`)), setTimeout(() => {
615
- this.panel.style.transition = "";
616
- }, 50), this.updatePanelSize(), this.saveLayout();
617
- }
618
- saveLayout() {
619
- let e = {
620
- position: this.position,
621
- lastHeightBottom: this.lastHeightBottom,
622
- lastWidthRight: this.lastWidthRight,
623
- activeTabId: this.activeTabId,
624
- detachedTabs: []
625
- };
626
- this.detachedWindows.forEach((t) => {
627
- let n = t.tab, r = t.panel, i = parseFloat(r.style.left) || r.offsetLeft || 0, a = parseFloat(r.style.top) || r.offsetTop || 0, o = r.offsetWidth, s = r.offsetHeight;
628
- e.detachedTabs.push({
629
- tabId: n.id,
630
- originalIndex: n.originalIndex === void 0 ? 0 : n.originalIndex,
631
- left: i,
632
- top: a,
633
- width: o,
634
- height: s
635
- });
636
- });
637
- try {
638
- localStorage.setItem("profiler-layout", JSON.stringify(e));
639
- } catch (e) {
640
- console.warn("Failed to save profiler layout:", e);
641
- }
642
- }
643
- loadLayout() {
644
- try {
645
- let e = localStorage.getItem("profiler-layout");
646
- if (!e) return;
647
- let t = JSON.parse(e);
648
- if (t.detachedTabs && t.detachedTabs.length > 0) {
649
- let e = window.innerWidth, n = window.innerHeight;
650
- t.detachedTabs = t.detachedTabs.map((t) => {
651
- let { left: r, top: i, width: a, height: o } = t;
652
- a > e && (a = e - 100), o > n && (o = n - 100);
653
- let s = a / 2, c = o / 2;
654
- return r + a > e + s && (r = e + s - a), r < -s && (r = -s), i + o > n + c && (i = n + c - o), i < -c && (i = -c), {
655
- ...t,
656
- left: r,
657
- top: i,
658
- width: a,
659
- height: o
660
- };
661
- });
662
- }
663
- t.position && (this.position = t.position), t.lastHeightBottom && (this.lastHeightBottom = t.lastHeightBottom), t.lastWidthRight && (this.lastWidthRight = t.lastWidthRight);
664
- let n = window.innerWidth, r = window.innerHeight;
665
- this.lastHeightBottom > r - 50 && (this.lastHeightBottom = r - 50), this.lastWidthRight > n - 50 && (this.lastWidthRight = n - 50), this.position === "right" ? (this.floatingBtn.classList.add("active"), this.floatingBtn.innerHTML = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"></rect><path d=\"M3 15h18\"></path></svg>", this.floatingBtn.title = "Switch to Bottom", this.panel.classList.remove("position-bottom"), this.panel.classList.add("position-right"), this.panel.style.bottom = "", this.panel.style.top = "0", this.panel.style.right = "0", this.panel.style.left = "", this.panel.style.width = `${this.lastWidthRight}px`, this.panel.style.height = "100%") : this.panel.style.height = `${this.lastHeightBottom}px`, t.activeTabId && t.detachedTabs && t.detachedTabs.some((e) => e.tabId === t.activeTabId) && this.setActiveTab(t.activeTabId), t.detachedTabs && t.detachedTabs.length > 0 && (this.pendingDetachedTabs = t.detachedTabs, this.restoreDetachedTabs()), this.updatePanelSize();
666
- } catch (e) {
667
- console.warn("Failed to load profiler layout:", e);
668
- }
669
- }
670
- restoreDetachedTabs() {
671
- if (!(!this.pendingDetachedTabs || this.pendingDetachedTabs.length === 0)) {
672
- if (this.pendingDetachedTabs.forEach((e) => {
673
- let t = this.tabs[e.tabId];
674
- if (!t || t.isDetached) return;
675
- e.originalIndex !== void 0 && (t.originalIndex = e.originalIndex), t.button.parentNode && t.button.parentNode.removeChild(t.button), t.content.parentNode && t.content.parentNode.removeChild(t.content);
676
- let n = this.createDetachedWindow(t, 0, 0);
677
- n.panel.style.left = `${e.left}px`, n.panel.style.top = `${e.top}px`, n.panel.style.width = `${e.width}px`, n.panel.style.height = `${e.height}px`, this.constrainWindowToBounds(n.panel), this.detachedWindows.push(n), t.isDetached = !0, t.detachedWindow = n;
678
- }), this.pendingDetachedTabs = null, this.detachedWindows.forEach((e) => {
679
- let t = parseInt(getComputedStyle(e.panel).zIndex) || 0;
680
- t > this.maxZIndex && (this.maxZIndex = t);
681
- }), !this.activeTabId || !this.tabs[this.activeTabId] || this.tabs[this.activeTabId].isDetached || !this.tabs[this.activeTabId].isVisible) {
682
- let e = Object.keys(this.tabs).filter((e) => !this.tabs[e].isDetached && this.tabs[e].isVisible);
683
- if (e.length > 0) {
684
- let t = Array.from(this.tabsContainer.children).map((e) => Object.keys(this.tabs).find((t) => this.tabs[t].button === e)).filter((e) => e !== void 0 && !this.tabs[e].isDetached && this.tabs[e].isVisible);
685
- this.setActiveTab(t[0] || e[0]);
686
- } else this.activeTabId = null;
687
- }
688
- this.updatePanelSize();
689
- }
690
- }
691
- }, G = class {
692
- constructor(e, t = {}) {
693
- this.id = e.toLowerCase(), this.button = document.createElement("button"), this.button.className = "tab-btn", this.button.textContent = e, this.content = document.createElement("div"), this.content.id = `${this.id}-content`, this.content.className = "profiler-content", this.isActive = !1, this.isVisible = !0, this.isDetached = !1, this.detachedWindow = null, this.allowDetach = t.allowDetach === void 0 ? !0 : t.allowDetach, this.builtin = t.builtin === void 0 ? !1 : t.builtin, this.icon = t.icon || null, this.builtinButton = null, this.miniContent = null, this.profiler = null, this.onVisibilityChange = null;
694
- }
695
- setActive(e) {
696
- this.button.classList.toggle("active", e), this.content.classList.toggle("active", e), this.isActive = e;
697
- }
698
- show() {
699
- this.content.style.display = "", this.button.style.display = "", this.isVisible = !0, this.isDetached && this.detachedWindow && (this.detachedWindow.panel.style.display = ""), this.onVisibilityChange && this.onVisibilityChange(), this.showBuiltin();
700
- }
701
- hide() {
702
- this.content.style.display = "none", this.button.style.display = "none", this.isVisible = !1, this.isDetached && this.detachedWindow && (this.detachedWindow.panel.style.display = "none"), this.onVisibilityChange && this.onVisibilityChange(), this.hideBuiltin();
703
- }
704
- showBuiltin() {
705
- if (this.builtin && (this.profiler && this.profiler.builtinTabsContainer && (this.profiler.builtinTabsContainer.style.display = ""), this.builtinButton && (this.builtinButton.style.display = ""), this.miniContent && this.profiler)) {
706
- if (this.profiler.miniPanel.querySelectorAll(".mini-panel-content").forEach((e) => {
707
- e.style.display = "none";
708
- }), this.profiler.builtinTabsContainer.querySelectorAll(".builtin-tab-btn").forEach((e) => {
709
- e.classList.remove("active");
710
- }), this.builtinButton && this.builtinButton.classList.add("active"), !this.miniContent.firstChild) {
711
- let e = this.content.querySelector(".list-scroll-wrapper") || this.content.firstElementChild;
712
- e && this.miniContent.appendChild(e);
713
- }
714
- this.miniContent.style.display = "block", this.profiler.miniPanel.classList.add("visible");
715
- }
716
- }
717
- hideBuiltin() {
718
- this.builtin && (this.builtinButton && (this.builtinButton.style.display = "none"), this.miniContent && (this.miniContent.style.display = "none", this.miniContent.firstChild && this.content.appendChild(this.miniContent.firstChild)), this.builtinButton && this.builtinButton.classList.remove("active"), this.profiler && (Array.from(this.profiler.miniPanel.querySelectorAll(".mini-panel-content")).some((e) => e.style.display !== "none") || this.profiler.miniPanel.classList.remove("visible"), Array.from(this.profiler.builtinTabsContainer.querySelectorAll(".builtin-tab-btn")).some((e) => e.style.display !== "none") || (this.profiler.builtinTabsContainer.style.display = "none")));
719
- }
720
- }, K = class {
721
- constructor(...e) {
722
- this.headers = e, this.children = [], this.domElement = document.createElement("div"), this.domElement.className = "list-container", this.domElement.style.padding = "10px", this.id = `list-${Math.random().toString(36).substr(2, 9)}`, this.domElement.dataset.listId = this.id, this.gridStyleElement = document.createElement("style"), this.domElement.appendChild(this.gridStyleElement);
723
- let t = document.createElement("div");
724
- t.className = "list-header", this.headers.forEach((e) => {
725
- let n = document.createElement("div");
726
- n.className = "list-header-cell", n.textContent = e, t.appendChild(n);
727
- }), this.domElement.appendChild(t);
728
- }
729
- setGridStyle(e) {
730
- this.gridStyleElement.textContent = `
731
- [data-list-id="${this.id}"] > .list-header,
732
- [data-list-id="${this.id}"] .list-item-row {
733
- grid-template-columns: ${e};
734
- }
735
- `;
736
- }
737
- add(e) {
738
- e.parent !== null && e.parent.remove(e), e.domElement.classList.add("header-wrapper", "section-start"), e.parent = this, this.children.push(e), this.domElement.appendChild(e.domElement);
739
- }
740
- remove(e) {
741
- let t = this.children.indexOf(e);
742
- return t !== -1 && (this.children.splice(t, 1), this.domElement.removeChild(e.domElement), e.parent = null), this;
743
- }
744
- }, be = class {
745
- constructor(e = 512) {
746
- this.maxPoints = e, this.lines = {}, this.limit = 0, this.limitIndex = 0, this.domElement = document.createElementNS("http://www.w3.org/2000/svg", "svg"), this.domElement.setAttribute("class", "graph-svg");
747
- }
748
- addLine(e, t) {
749
- let n = document.createElementNS("http://www.w3.org/2000/svg", "path");
750
- n.setAttribute("class", "graph-path"), n.style.stroke = `var(${t})`, n.style.fill = `var(${t})`, this.domElement.appendChild(n), this.lines[e] = {
751
- path: n,
752
- color: t,
753
- points: []
754
- };
755
- }
756
- addPoint(e, t) {
757
- let n = this.lines[e];
758
- n && (n.points.push(t), n.points.length > this.maxPoints && n.points.shift(), t > this.limit && (this.limit = t, this.limitIndex = 0));
759
- }
760
- resetLimit() {
761
- this.limit = 0, this.limitIndex = 0;
762
- }
763
- update() {
764
- let e = this.domElement.clientWidth, t = this.domElement.clientHeight;
765
- if (e === 0) return;
766
- let n = e / (this.maxPoints - 1);
767
- for (let r in this.lines) {
768
- let i = this.lines[r], a = `M 0,${t}`;
769
- for (let e = 0; e < i.points.length; e++) {
770
- let r = e * n, o = t - i.points[e] / this.limit * t;
771
- a += ` L ${r},${o}`;
772
- }
773
- a += ` L ${(i.points.length - 1) * n},${t} Z`;
774
- let o = e - (i.points.length - 1) * n;
775
- i.path.setAttribute("transform", `translate(${o}, 0)`), i.path.setAttribute("d", a);
776
- }
777
- this.limitIndex++ > this.maxPoints && this.resetLimit();
778
- }
779
- }, q = class {
780
- constructor(...e) {
781
- this.children = [], this.isOpen = !0, this.childrenContainer = null, this.parent = null, this.domElement = document.createElement("div"), this.domElement.className = "list-item-wrapper", this.itemRow = document.createElement("div"), this.itemRow.className = "list-item-row", this.userData = {}, this.data = e, this.data.forEach((e) => {
782
- let t = document.createElement("div");
783
- t.className = "list-item-cell", e instanceof HTMLElement ? t.appendChild(e) : t.append(String(e)), this.itemRow.appendChild(t);
784
- }), this.domElement.appendChild(this.itemRow), this.onItemClick = this.onItemClick.bind(this);
785
- }
786
- onItemClick(e) {
787
- e.target.closest("button, a, input, label") || this.toggle();
788
- }
789
- add(e, t = this.children.length) {
790
- return e.parent !== null && e.parent.remove(e), e.parent = this, this.children.splice(t, 0, e), this.itemRow.classList.add("collapsible"), this.childrenContainer || (this.childrenContainer = document.createElement("div"), this.childrenContainer.className = "list-children-container", this.childrenContainer.classList.toggle("closed", !this.isOpen), this.domElement.appendChild(this.childrenContainer), this.itemRow.addEventListener("click", this.onItemClick)), this.childrenContainer.insertBefore(e.domElement, this.childrenContainer.children[t] || null), this.updateToggler(), this;
791
- }
792
- remove(e) {
793
- let t = this.children.indexOf(e);
794
- return t !== -1 && (this.children.splice(t, 1), this.childrenContainer.removeChild(e.domElement), e.parent = null, this.children.length === 0 && (this.itemRow.classList.remove("collapsible"), this.itemRow.removeEventListener("click", this.onItemClick), this.childrenContainer.remove(), this.childrenContainer = null), this.updateToggler()), this;
795
- }
796
- updateToggler() {
797
- let e = this.itemRow.querySelector(".list-item-cell:first-child"), t = this.itemRow.querySelector(".item-toggler");
798
- this.children.length > 0 ? (t || (t = document.createElement("span"), t.className = "item-toggler", e.prepend(t)), this.isOpen && this.itemRow.classList.add("open")) : t && t.remove();
799
- }
800
- toggle() {
801
- return this.isOpen = !this.isOpen, this.itemRow.classList.toggle("open", this.isOpen), this.childrenContainer && this.childrenContainer.classList.toggle("closed", !this.isOpen), this;
802
- }
803
- close() {
804
- return this.isOpen && this.toggle(), this;
805
- }
806
- };
807
- //#endregion
808
- //#region ../../node_modules/three/examples/jsm/inspector/ui/utils.js
809
- function J(e = null) {
810
- let t = document.createElement("span");
811
- return t.className = "value", e !== null && (t.id = e), t;
812
- }
813
- function Y(e, t) {
814
- let n = e instanceof HTMLElement ? e : document.getElementById(e);
815
- n && n.textContent !== t && (n.textContent = t);
816
- }
817
- function xe(e) {
818
- let t = e.lastIndexOf("/");
819
- return t === -1 ? {
820
- path: "",
821
- name: e.trim()
822
- } : {
823
- path: e.substring(0, t).trim(),
824
- name: e.substring(t + 1).trim()
825
- };
826
- }
827
- function Se(e) {
828
- return e.replace(/([a-z0-9])([A-Z])/g, "$1 $2").trim();
829
- }
830
- //#endregion
831
- //#region ../../node_modules/three/examples/jsm/inspector/tabs/Performance.js
832
- var Ce = class extends G {
833
- constructor(e = {}) {
834
- super("Performance", e);
835
- let t = new K("Name", "CPU", "GPU", "Total");
836
- t.setGridStyle("minmax(200px, 2fr) 80px 80px 80px"), t.domElement.style.minWidth = "600px";
837
- let n = document.createElement("div");
838
- n.className = "list-scroll-wrapper", n.appendChild(t.domElement), this.content.appendChild(n);
839
- let r = document.createElement("div");
840
- r.className = "graph-container";
841
- let i = new be();
842
- i.addLine("fps", "--accent-color"), r.append(i.domElement);
843
- let a = new q("Graph Stats", J(), J(), J("graph-fps-counter"));
844
- t.add(a);
845
- let o = new q(r);
846
- o.itemRow.childNodes[0].style.gridColumn = "1 / -1", a.add(o);
847
- let s = new q("Frame Stats", J(), J(), J());
848
- t.add(s);
849
- let c = new q("Miscellaneous & Idle", J(), J(), J());
850
- c.domElement.firstChild.style.backgroundColor = "#00ff0b1a", c.domElement.firstChild.classList.add("no-hover"), s.add(c), this.notInUse = /* @__PURE__ */ new Map(), this.frameStats = s, this.graphStats = a, this.graph = i, this.miscellaneous = c, this.currentRender = null, this.currentItem = null, this.frameItems = /* @__PURE__ */ new Map();
851
- }
852
- resolveStats(e, t) {
853
- let n = e.getStatsData(t.cid), r = n.item;
854
- if (r === void 0) r = new q(J(), J(), J(), J()), t.name ? t.isComputeStats === !0 && (t.name = `${t.name} [ Compute ]`) : t.name = `Unnamed ${t.cid}`, r.userData.name = t.name, this.currentItem.add(r), n.item = r;
855
- else {
856
- r.userData.name = t.name, this.notInUse.has(t.cid) && (r.domElement.firstElementChild.classList.remove("alert"), this.notInUse.delete(t.cid));
857
- let e = t.parent.children.indexOf(t);
858
- (r.parent === null || r.parent.children.indexOf(r) !== e) && this.currentItem.add(r, e);
859
- }
860
- let i = r.userData.name;
861
- t.isComputeStats && (i += " [ Compute ]"), Y(r.data[0], i), Y(r.data[1], n.cpu.toFixed(2)), Y(r.data[2], t.gpuNotAvailable === !0 ? "-" : n.gpu.toFixed(2)), Y(r.data[3], n.total.toFixed(2));
862
- let a = this.currentItem;
863
- this.currentItem = r;
864
- for (let n of t.children) this.resolveStats(e, n);
865
- this.currentItem = a, this.frameItems.set(t.cid, r);
866
- }
867
- updateGraph(e) {
868
- this.graph.addPoint("fps", e.fps), this.graph.update();
869
- }
870
- addNotInUse(e, t) {
871
- t.domElement.firstElementChild.classList.add("alert"), this.notInUse.set(e, {
872
- item: t,
873
- time: performance.now()
874
- }), this.updateNotInUse(e);
875
- }
876
- updateNotInUse(e) {
877
- let { item: t, time: n } = this.notInUse.get(e), r = performance.now(), i = 5 - Math.floor((r - n) / 1e3);
878
- if (i >= 0) {
879
- let e = "*".repeat(Math.max(0, i));
880
- Y(t.domElement.querySelector(".list-item-cell .value"), t.userData.name + " (not in use) " + e);
881
- } else t.domElement.firstElementChild.classList.remove("alert"), t.parent.remove(t), this.notInUse.delete(e);
882
- }
883
- updateText(e, t) {
884
- let n = new Map(this.frameItems);
885
- this.frameItems.clear(), this.currentItem = this.frameStats;
886
- for (let n of t.children) this.resolveStats(e, n);
887
- for (let [e, t] of n) this.frameItems.has(e) || (this.addNotInUse(e, t), n.delete(e));
888
- for (let e of this.notInUse.keys()) this.updateNotInUse(e);
889
- Y("graph-fps-counter", e.fps.toFixed() + " FPS"), Y(this.frameStats.data[1], t.cpu.toFixed(2)), Y(this.frameStats.data[2], t.gpu.toFixed(2)), Y(this.frameStats.data[3], t.total.toFixed(2)), Y(this.miscellaneous.data[1], t.miscellaneous.toFixed(2)), Y(this.miscellaneous.data[2], "-"), Y(this.miscellaneous.data[3], t.miscellaneous.toFixed(2)), this.currentItem = null;
890
- }
891
- }, we = class extends G {
892
- constructor(e = {}) {
893
- super("Console", e), this.filters = {
894
- info: !0,
895
- warn: !0,
896
- error: !0
897
- }, this.filterText = "", this.buildHeader(), this.logContainer = document.createElement("div"), this.logContainer.id = "console-log", this.content.appendChild(this.logContainer);
898
- }
899
- buildHeader() {
900
- let e = document.createElement("div");
901
- e.className = "console-header";
902
- let t = document.createElement("input");
903
- t.type = "text", t.className = "console-filter-input", t.placeholder = "Filter...", t.addEventListener("input", (e) => {
904
- this.filterText = e.target.value.toLowerCase(), this.applyFilters();
905
- });
906
- let n = document.createElement("button");
907
- n.className = "console-copy-button", n.title = "Copy all", n.innerHTML = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"9\" y=\"9\" width=\"13\" height=\"13\" rx=\"2\" ry=\"2\"></rect><path d=\"M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1\"></path></svg>", n.addEventListener("click", () => this.copyAll(n));
908
- let r = document.createElement("div");
909
- r.className = "console-buttons-group", Object.keys(this.filters).forEach((e) => {
910
- let t = document.createElement("label");
911
- t.className = "custom-checkbox", t.style.color = `var(--${e === "info" ? "text-primary" : "color-" + (e === "warn" ? "yellow" : "red")})`;
912
- let n = document.createElement("input");
913
- n.type = "checkbox", n.checked = this.filters[e], n.dataset.type = e;
914
- let i = document.createElement("span");
915
- i.className = "checkmark", t.appendChild(n), t.appendChild(i), t.append(e.charAt(0).toUpperCase() + e.slice(1)), r.appendChild(t);
916
- }), r.addEventListener("change", (e) => {
917
- let t = e.target.dataset.type;
918
- t in this.filters && (this.filters[t] = e.target.checked, this.applyFilters());
919
- }), r.appendChild(n), e.appendChild(t), e.appendChild(r), this.content.appendChild(e);
920
- }
921
- applyFilters() {
922
- this.logContainer.querySelectorAll(".log-message").forEach((e) => {
923
- let t = e.dataset.type, n = e.dataset.rawText.toLowerCase(), r = this.filters[t], i = n.includes(this.filterText);
924
- e.classList.toggle("hidden", !(r && i));
925
- });
926
- }
927
- copyAll(e) {
928
- let t = this.logContainer.ownerDocument.defaultView.getSelection(), n = t.toString(), r = n && this.logContainer.contains(t.anchorNode), i;
929
- if (r) i = n;
930
- else {
931
- let e = this.logContainer.querySelectorAll(".log-message:not(.hidden)");
932
- i = Array.from(e).map((e) => e.dataset.rawText).join("\n");
933
- }
934
- navigator.clipboard.writeText(i), e.classList.add("copied"), setTimeout(() => e.classList.remove("copied"), 350);
935
- }
936
- _getIcon(e, t) {
937
- let n;
938
- return t === "tip" ? n = "💭" : t === "tsl" ? n = "✨" : t === "webgpurenderer" ? n = "🎨" : e === "warn" ? n = "⚠️" : e === "error" ? n = "🔴" : e === "info" && (n = "ℹ️"), n;
939
- }
940
- _formatMessage(e, t) {
941
- let n = document.createDocumentFragment(), r = t.match(/^([\w\.]+:\s)/), i = t;
942
- if (r) {
943
- let a = r[0], o = a.slice(0, -2).split("."), s = (o.length > 1 ? o[o.length - 1] : o[0]) + ":", c = this._getIcon(e, s.split(":")[0].toLowerCase());
944
- n.appendChild(document.createTextNode(c + " "));
945
- let l = document.createElement("span");
946
- l.className = "log-prefix", l.textContent = s, n.appendChild(l), i = t.substring(a.length);
947
- }
948
- let a = i.split(/(".*?"|'.*?'|`.*?`)/g).map((e) => e.trim()).filter(Boolean);
949
- return a.forEach((e, t) => {
950
- if (/^("|'|`)/.test(e)) {
951
- let t = document.createElement("span");
952
- t.className = "log-code", t.textContent = e.slice(1, -1), n.appendChild(t);
953
- } else t > 0 && (e = " " + e), t < a.length - 1 && (e += " "), n.appendChild(document.createTextNode(e));
954
- }), n;
955
- }
956
- addMessage(e, t) {
957
- let n = document.createElement("div");
958
- n.className = `log-message ${e}`, n.dataset.type = e, n.dataset.rawText = t, n.appendChild(this._formatMessage(e, t));
959
- let r = this.filters[e], i = t.toLowerCase().includes(this.filterText);
960
- n.classList.toggle("hidden", !(r && i)), this.logContainer.appendChild(n), this.logContainer.scrollTop = this.logContainer.scrollHeight, this.logContainer.children.length > 200 && this.logContainer.removeChild(this.logContainer.firstChild);
961
- }
962
- }, X = class extends s {
963
- constructor() {
964
- super(), this.domElement = document.createElement("div"), this.domElement.className = "param-control", this._onChangeFunction = null, this.addEventListener("change", (e) => {
965
- requestAnimationFrame(() => {
966
- this._onChangeFunction && this._onChangeFunction(e.value);
967
- });
968
- });
969
- }
970
- setValue() {
971
- return this.dispatchChange(), this;
972
- }
973
- getValue() {
974
- return null;
975
- }
976
- dispatchChange() {
977
- this.dispatchEvent({
978
- type: "change",
979
- value: this.getValue()
980
- });
981
- }
982
- onChange(e) {
983
- return this._onChangeFunction = e, this;
984
- }
985
- }, Z = class extends X {
986
- constructor({ value: e = 0, step: t = .1, min: n = -Infinity, max: r = Infinity }) {
987
- super(), this.input = document.createElement("input"), this.input.type = "number", this.input.value = e, this.input.step = t, this.input.min = n, this.input.max = r, this.input.addEventListener("change", this._onChangeValue.bind(this)), this.domElement.appendChild(this.input), this.addDragHandler();
988
- }
989
- _onChangeValue() {
990
- let e = parseFloat(this.input.value), t = parseFloat(this.input.min), n = parseFloat(this.input.max);
991
- e > n ? this.input.value = n : (e < t || isNaN(e)) && (this.input.value = t), this.dispatchChange();
992
- }
993
- addDragHandler() {
994
- let e = !1, t, n;
995
- this.input.addEventListener("mousedown", (r) => {
996
- e = !0, t = r.clientY, n = parseFloat(this.input.value), document.body.style.cursor = "ns-resize";
997
- }), document.addEventListener("mousemove", (r) => {
998
- if (e) {
999
- let e = t - r.clientY, i = parseFloat(this.input.step) || 1, a = parseFloat(this.input.min), o = parseFloat(this.input.max), s = i;
1000
- !isNaN(o) && isFinite(a) && (s = (o - a) / 100);
1001
- let c = e * s, l = n + c;
1002
- l = Math.max(a, Math.min(l, o));
1003
- let u = (String(i).split(".")[1] || []).length;
1004
- this.input.value = l.toFixed(u), this.input.dispatchEvent(new Event("input")), this.dispatchChange();
1005
- }
1006
- }), document.addEventListener("mouseup", () => {
1007
- e && (e = !1, document.body.style.cursor = "default");
1008
- });
1009
- }
1010
- setValue(e) {
1011
- return this.input.value = e, super.setValue(e);
1012
- }
1013
- getValue() {
1014
- return parseFloat(this.input.value);
1015
- }
1016
- }, Te = class extends X {
1017
- constructor({ value: e = !1 }) {
1018
- super();
1019
- let t = document.createElement("label");
1020
- t.className = "custom-checkbox";
1021
- let n = document.createElement("input");
1022
- n.type = "checkbox", n.checked = e, this.checkbox = n;
1023
- let r = document.createElement("span");
1024
- r.className = "checkmark", t.appendChild(n), t.appendChild(r), this.domElement.appendChild(t), n.addEventListener("change", () => {
1025
- this.dispatchChange();
1026
- });
1027
- }
1028
- setValue(e) {
1029
- return this.checkbox.value = e, super.setValue(e);
1030
- }
1031
- getValue() {
1032
- return this.checkbox.checked;
1033
- }
1034
- }, Ee = class extends X {
1035
- constructor({ value: e = 0, min: t = 0, max: n = 1, step: r = .01 }) {
1036
- super(), this.slider = document.createElement("input"), this.slider.type = "range", this.slider.min = t, this.slider.max = n, this.slider.step = r;
1037
- let i = new Z({
1038
- value: e,
1039
- min: t,
1040
- max: n,
1041
- step: r
1042
- });
1043
- this.numberInput = i.input, this.numberInput.style.flexBasis = "80px", this.numberInput.style.flexShrink = "0", this.slider.value = e, this.domElement.append(this.slider, this.numberInput), this.slider.addEventListener("input", () => {
1044
- this.numberInput.value = this.slider.value, this.dispatchChange();
1045
- }), i.addEventListener("change", () => {
1046
- this.slider.value = parseFloat(this.numberInput.value), this.dispatchChange();
1047
- });
1048
- }
1049
- setValue(e) {
1050
- return this.slider.value = e, this.numberInput.value = e, super.setValue(e);
1051
- }
1052
- getValue() {
1053
- return parseFloat(this.slider.value);
1054
- }
1055
- step(e) {
1056
- return this.slider.step = e, this.numberInput.step = e, this;
1057
- }
1058
- }, De = class extends X {
1059
- constructor({ options: e = [], value: t = "" }) {
1060
- super();
1061
- let n = document.createElement("select"), r = (e, r) => {
1062
- let i = document.createElement("option");
1063
- return i.value = e, i.textContent = e, r == t && (i.selected = !0), n.appendChild(i), i;
1064
- };
1065
- Array.isArray(e) ? e.forEach((e) => r(e, e)) : Object.entries(e).forEach(([e, t]) => r(e, t)), this.domElement.appendChild(n), n.addEventListener("change", () => {
1066
- this.dispatchChange();
1067
- }), this.options = e, this.select = n;
1068
- }
1069
- getValue() {
1070
- let e = this.options;
1071
- return Array.isArray(e) ? e[this.select.selectedIndex] : e[this.select.value];
1072
- }
1073
- }, Oe = class extends X {
1074
- constructor({ value: e = "#ffffff" }) {
1075
- super();
1076
- let t = document.createElement("input");
1077
- t.type = "color", t.value = this._getColorHex(e), this.colorInput = t, this._value = e, t.addEventListener("input", () => {
1078
- let e = t.value;
1079
- this._value.isColor ? this._value.setHex(parseInt(e.slice(1), 16)) : this._value = e, this.dispatchChange();
1080
- }), this.domElement.appendChild(t);
1081
- }
1082
- _getColorHex(e) {
1083
- return e.isColor && (e = e.getHex()), typeof e == "number" ? e = `#${e.toString(16)}` : e[0] !== "#" && (e = "#" + e), e;
1084
- }
1085
- getValue() {
1086
- let e = this._value;
1087
- return typeof e == "string" && (e = parseInt(e.slice(1), 16)), e;
1088
- }
1089
- }, ke = class extends X {
1090
- constructor({ text: e = "Button", value: t = () => {} }) {
1091
- super();
1092
- let n = document.createElement("button");
1093
- n.textContent = e, n.onclick = t, this.domElement.appendChild(n);
1094
- }
1095
- }, Ae = class e {
1096
- constructor(e, t) {
1097
- this.parameters = e, this.name = t, this.paramList = new q(t), this.objects = [];
1098
- }
1099
- close() {
1100
- return this.paramList.close(), this;
1101
- }
1102
- add(e, t, ...n) {
1103
- let r = typeof e[t], i = null;
1104
- return typeof n[0] == "object" ? i = this.addSelect(e, t, n[0]) : r === "number" ? i = n.length >= 2 ? this.addSlider(e, t, ...n) : this.addNumber(e, t, ...n) : r === "boolean" ? i = this.addBoolean(e, t) : r === "function" && (i = this.addButton(e, t, ...n)), i;
1105
- }
1106
- _addParameter(e, t, n, r) {
1107
- n.name = (e) => (r.data[0].textContent = e, n), n.listen = () => {
1108
- let r = () => {
1109
- let i = n.getValue(), a = e[t];
1110
- i !== a && n.setValue(a), requestAnimationFrame(r);
1111
- };
1112
- return requestAnimationFrame(r), n;
1113
- }, this._registerParameter(e, t, n, r);
1114
- }
1115
- _registerParameter(e, t, n, r) {
1116
- this.objects.push({
1117
- object: e,
1118
- key: t,
1119
- editor: n,
1120
- subItem: r
1121
- });
1122
- }
1123
- addFolder(t) {
1124
- let n = new e(this.parameters, t);
1125
- return this.paramList.add(n.paramList), n;
1126
- }
1127
- addBoolean(e, t) {
1128
- let n = e[t], r = new Te({ value: n });
1129
- r.addEventListener("change", ({ value: n }) => {
1130
- e[t] = n;
1131
- });
1132
- let i = J();
1133
- i.textContent = t;
1134
- let a = new q(i, r.domElement);
1135
- this.paramList.add(a);
1136
- let o = a.domElement.firstChild;
1137
- return o.classList.add("actionable"), o.addEventListener("click", (e) => {
1138
- if (e.target.closest("label")) return;
1139
- let t = o.querySelector("input[type=\"checkbox\"]");
1140
- t && (t.checked = !t.checked, t.dispatchEvent(new Event("change")));
1141
- }), this._addParameter(e, t, r, a), r;
1142
- }
1143
- addSelect(e, t, n) {
1144
- let r = e[t], i = new De({
1145
- options: n,
1146
- value: r
1147
- });
1148
- i.addEventListener("change", ({ value: n }) => {
1149
- e[t] = n;
1150
- });
1151
- let a = J();
1152
- a.textContent = t;
1153
- let o = new q(a, i.domElement);
1154
- return this.paramList.add(o), o.domElement.firstChild.classList.add("actionable"), this._addParameter(e, t, i, o), i;
1155
- }
1156
- addColor(e, t) {
1157
- let n = e[t], r = new Oe({ value: n });
1158
- r.addEventListener("change", ({ value: n }) => {
1159
- e[t] = n;
1160
- });
1161
- let i = J();
1162
- i.textContent = t;
1163
- let a = new q(i, r.domElement);
1164
- return this.paramList.add(a), a.domElement.firstChild.classList.add("actionable"), this._addParameter(e, t, r, a), r;
1165
- }
1166
- addSlider(e, t, n = 0, r = 1, i = .01) {
1167
- let a = e[t], o = new Ee({
1168
- value: a,
1169
- min: n,
1170
- max: r,
1171
- step: i
1172
- });
1173
- o.addEventListener("change", ({ value: n }) => {
1174
- e[t] = n;
1175
- });
1176
- let s = J();
1177
- s.textContent = t;
1178
- let c = new q(s, o.domElement);
1179
- return this.paramList.add(c), c.domElement.firstChild.classList.add("actionable"), this._addParameter(e, t, o, c), o;
1180
- }
1181
- addNumber(e, t, ...n) {
1182
- let r = e[t], [i, a] = n, o = new Z({
1183
- value: r,
1184
- min: i,
1185
- max: a
1186
- });
1187
- o.addEventListener("change", ({ value: n }) => {
1188
- e[t] = n;
1189
- });
1190
- let s = J();
1191
- s.textContent = t;
1192
- let c = new q(s, o.domElement);
1193
- return this.paramList.add(c), c.domElement.firstChild.classList.add("actionable"), this._addParameter(e, t, o, c), o;
1194
- }
1195
- addButton(e, t) {
1196
- let n = e[t], r = new ke({
1197
- text: t,
1198
- value: n
1199
- });
1200
- r.addEventListener("change", ({ value: n }) => {
1201
- e[t] = n;
1202
- });
1203
- let i = new q(r.domElement);
1204
- return i.itemRow.childNodes[0].style.gridColumn = "1 / -1", this.paramList.add(i), i.domElement.firstChild.classList.add("actionable"), r.name = (e) => (r.domElement.childNodes[0].textContent = e, r), this._registerParameter(e, t, r, i), r;
1205
- }
1206
- }, je = class extends G {
1207
- constructor(e = {}) {
1208
- super("Parameters", e);
1209
- let t = new K("Property", "Value");
1210
- t.domElement.classList.add("parameters"), t.setGridStyle(".5fr 1fr"), t.domElement.style.minWidth = "300px";
1211
- let n = document.createElement("div");
1212
- n.className = "list-scroll-wrapper", n.appendChild(t.domElement), this.content.appendChild(n), this.paramList = t, this.groups = [];
1213
- }
1214
- createGroup(e) {
1215
- let t = new Ae(this, e);
1216
- return this.paramList.add(t.paramList), this.groups.push(t), t;
1217
- }
1218
- }, Me = class extends G {
1219
- constructor(e = {}) {
1220
- super("Viewer", e);
1221
- let t = new K("Viewer", "Name");
1222
- t.setGridStyle("150px minmax(200px, 2fr)"), t.domElement.style.minWidth = "400px";
1223
- let n = document.createElement("div");
1224
- n.className = "list-scroll-wrapper", n.appendChild(t.domElement), this.content.appendChild(n);
1225
- let r = new q("Nodes");
1226
- t.add(r), this.itemLibrary = /* @__PURE__ */ new Map(), this.folderLibrary = /* @__PURE__ */ new Map(), this.currentDataList = [], this.nodeList = t, this.nodes = r;
1227
- }
1228
- getFolder(e) {
1229
- let t = this.folderLibrary.get(e);
1230
- return t === void 0 && (t = new q(e), this.folderLibrary.set(e, t), this.nodeList.add(t)), t;
1231
- }
1232
- addNodeItem(e) {
1233
- let t = this.itemLibrary.get(e.id);
1234
- if (t === void 0) {
1235
- let n = e.name, r = e.canvasTarget.domElement;
1236
- t = new q(r, n), t.itemRow.children[1].style["justify-content"] = "flex-start", this.itemLibrary.set(e.id, t);
1237
- }
1238
- return t;
1239
- }
1240
- update(e, t) {
1241
- if (!this.isActive && !this.isDetached) return;
1242
- let n = [...this.currentDataList];
1243
- for (let e of n) if (this.itemLibrary.has(e.id) && t.indexOf(e) === -1) {
1244
- let t = this.itemLibrary.get(e.id), n = t.parent;
1245
- n.remove(t), this.folderLibrary.has(n.data[0]) && n.children.length === 0 && (n.parent.remove(n), this.folderLibrary.delete(n.data[0])), this.itemLibrary.delete(e.id);
1246
- }
1247
- let r = {};
1248
- for (let n of t) {
1249
- let i = this.addNodeItem(n), o = e.getCanvasTarget(), s = n.path;
1250
- if (s) {
1251
- let e = this.getFolder(s);
1252
- r[s] === void 0 && (r[s] = 0), (e.parent === null || i.parent !== e || e.children.indexOf(i) !== r[s]) && e.add(i), r[s]++;
1253
- } else i.parent || this.nodes.add(i);
1254
- this.currentDataList = t;
1255
- let c = b.resetRendererState(e);
1256
- e.toneMapping = 0, e.outputColorSpace = a, e.setCanvasTarget(n.canvasTarget), n.quad.render(e), e.setCanvasTarget(o), b.restoreRendererState(e, c);
1257
- }
1258
- }
1259
- }, Ne = /* @__PURE__ */ S(([e, t]) => {
1260
- let n = P(0);
1261
- ae(() => {
1262
- let { width: e, height: r } = t.value;
1263
- n.value = e / r;
1264
- });
1265
- let r = e.sub(.5), i = I(r.x.div(n), r.y).add(.5);
1266
- return L(i, j(0, i.x).mul(j(i.x, 1)).mul(j(0, i.y)).mul(j(i.y, 1)));
1267
- }), Q = class extends _e {
1268
- constructor() {
1269
- super();
1270
- let e = new ye(), t = new je({
1271
- builtin: !0,
1272
- icon: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M14 6m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0\" /><path d=\"M4 6l8 0\" /><path d=\"M16 6l4 0\" /><path d=\"M8 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0\" /><path d=\"M4 12l2 0\" /><path d=\"M10 12l10 0\" /><path d=\"M17 18m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0\" /><path d=\"M4 18l11 0\" /><path d=\"M19 18l1 0\" /></svg>"
1273
- });
1274
- t.hide(), e.addTab(t);
1275
- let n = new Me();
1276
- n.hide(), e.addTab(n);
1277
- let r = new Ce();
1278
- e.addTab(r);
1279
- let i = new we();
1280
- e.addTab(i), e.loadLayout(), e.activeTabId || e.setActiveTab(r.id), this.statsData = /* @__PURE__ */ new Map(), this.canvasNodes = /* @__PURE__ */ new Map(), this.profiler = e, this.performance = r, this.console = i, this.parameters = t, this.viewer = n, this.once = {}, this.displayCycle = {
1281
- text: {
1282
- needsUpdate: !1,
1283
- duration: .25,
1284
- time: 0
1285
- },
1286
- graph: {
1287
- needsUpdate: !1,
1288
- duration: .02,
1289
- time: 0
1290
- }
1291
- };
1292
- }
1293
- get domElement() {
1294
- return this.profiler.domElement;
1295
- }
1296
- resolveConsoleOnce(e, t) {
1297
- let n = e + t;
1298
- this.once[n] !== !0 && (this.resolveConsole(e, t), this.once[n] = !0);
1299
- }
1300
- resolveConsole(e, t, n = null) {
1301
- switch (e) {
1302
- case "log":
1303
- this.console.addMessage("info", t), console.log(t);
1304
- break;
1305
- case "warn":
1306
- this.console.addMessage("warn", t), n && n.isStackTrace ? console.warn(n.getError(t)) : console.warn(t);
1307
- break;
1308
- case "error":
1309
- this.console.addMessage("error", t), n && n.isStackTrace ? console.error(n.getError(t)) : console.error(t);
1310
- break;
1311
- }
1312
- }
1313
- init() {
1314
- let e = this.getRenderer(), t = "THREE.WebGPURenderer: 183 [ \"";
1315
- e.backend.isWebGPUBackend ? t += "WebGPU" : e.backend.isWebGLBackend && (t += "WebGL2"), t += "\" ]", this.console.addMessage("info", t), e.inspector.domElement.parentElement === null && e.domElement.parentElement !== null && e.domElement.parentElement.appendChild(e.inspector.domElement);
1316
- }
1317
- setRenderer(e) {
1318
- return super.setRenderer(e), e !== null && (i(this.resolveConsole.bind(this)), this.isAvailable && (e.backend.trackTimestamp = !0, e.init().then(() => {
1319
- e.hasFeature("timestamp-query") !== !0 && this.console.addMessage("error", "THREE.Inspector: GPU Timestamp Queries not available.");
1320
- }))), this;
1321
- }
1322
- createParameters(e) {
1323
- return this.parameters.isVisible === !1 && (this.parameters.show(), this.parameters.isDetached === !1 && this.profiler.setActiveTab(this.parameters.id)), this.parameters.createGroup(e);
1324
- }
1325
- getStatsData(e) {
1326
- let t = this.statsData.get(e);
1327
- return t === void 0 && (t = {}, this.statsData.set(e, t)), t;
1328
- }
1329
- resolveStats(e) {
1330
- let t = this.getStatsData(e.cid);
1331
- t.initialized !== !0 && (t.cpu = e.cpu, t.gpu = e.gpu, t.stats = [], t.initialized = !0), t.stats.length > this.maxFrames && t.stats.shift(), t.stats.push(e), t.cpu = this.getAverageDeltaTime(t, "cpu"), t.gpu = this.getAverageDeltaTime(t, "gpu"), t.total = t.cpu + t.gpu;
1332
- for (let n of e.children) {
1333
- this.resolveStats(n);
1334
- let e = this.getStatsData(n.cid);
1335
- t.cpu += e.cpu, t.gpu += e.gpu, t.total += e.total;
1336
- }
1337
- }
1338
- getCanvasDataByNode(e) {
1339
- let t = this.canvasNodes.get(e);
1340
- if (t === void 0) {
1341
- let n = this.getRenderer(), r = new ne(document.createElement("canvas"));
1342
- r.setPixelRatio(window.devicePixelRatio), r.setSize(140, 140);
1343
- let i = e.id, { path: a, name: o } = xe(Se(e.getName() || "(unnamed)")), s = R(L(e.context({ getUV: (e) => {
1344
- let t = Ne(A, e), n = t.xy, r = t.z;
1345
- return n.mul(r);
1346
- } })), 1);
1347
- s = ue(s, 0, n.outputColorSpace), s = s.context({ inspector: !0 });
1348
- let c = new _();
1349
- c.outputNode = s;
1350
- let l = new x(c);
1351
- l.name = "Viewer - " + o, t = {
1352
- id: i,
1353
- name: o,
1354
- path: a,
1355
- node: e,
1356
- quad: l,
1357
- canvasTarget: r,
1358
- material: c
1359
- }, this.canvasNodes.set(e, t);
1360
- }
1361
- return t;
1362
- }
1363
- resolveViewer() {
1364
- let e = this.currentNodes, t = this.getRenderer();
1365
- if (e.length === 0) return;
1366
- if (!t.backend.isWebGPUBackend) {
1367
- this.resolveConsoleOnce("warn", "Inspector: Viewer is only available with WebGPU.");
1368
- return;
1369
- }
1370
- this.viewer.isVisible || this.viewer.show();
1371
- let n = e.map((e) => this.getCanvasDataByNode(e));
1372
- this.viewer.update(t, n);
1373
- }
1374
- getAverageDeltaTime(e, t, n = this.fps) {
1375
- let r = e.stats, i = 0, a = 0;
1376
- for (let e = r.length - 1; e >= 0 && a < n; e--) {
1377
- let n = r[e][t];
1378
- n > 0 && (i += n, a++);
1379
- }
1380
- return a > 0 ? i / a : 0;
1381
- }
1382
- resolveFrame(e) {
1383
- let t = this.getFrameById(e.frameId + 1);
1384
- if (t) {
1385
- e.cpu = 0, e.gpu = 0, e.total = 0;
1386
- for (let t of e.children) {
1387
- this.resolveStats(t);
1388
- let n = this.getStatsData(t.cid);
1389
- e.cpu += n.cpu, e.gpu += n.gpu, e.total += n.total;
1390
- }
1391
- e.deltaTime = t.startTime - e.startTime, e.miscellaneous = e.deltaTime - e.total, e.miscellaneous < 0 && (e.miscellaneous = 0), this.updateCycle(this.displayCycle.text), this.updateCycle(this.displayCycle.graph), this.displayCycle.text.needsUpdate && (Y("fps-counter", this.fps.toFixed()), this.performance.updateText(this, e)), this.displayCycle.graph.needsUpdate && this.performance.updateGraph(this, e), this.displayCycle.text.needsUpdate = !1, this.displayCycle.graph.needsUpdate = !1;
1392
- }
1393
- }
1394
- updateCycle(e) {
1395
- e.time += this.nodeFrame.deltaTime, e.time >= e.duration && (e.needsUpdate = !0, e.time = 0);
1396
- }
1397
- }, $ = class extends h {
1398
- constructor(e, t, n) {
1399
- super(e, t), this.passNeedsReassembly = !0, this.debugMode = "off", this.renderPasses = /* @__PURE__ */ new Map(), this.guiParameterGroups = /* @__PURE__ */ new Map(), this.renderPipeline = new te(t), n && this.enableOutline(n.outlineVisibleEdgeColor, n.outlineHiddenEdgeColor);
1400
- }
1401
- addRenderPass(e) {
1402
- this.renderPasses.set(e.passId, e), this.passNeedsReassembly = !0;
1403
- }
1404
- clearCache() {
1405
- console.error("RoomleWebGPURenderer.clearCache is not implemented yet");
1406
- }
1407
- disableUiInteractionMode() {
1408
- console.error("RoomleWebGPURenderer.disableUiInteractionMode is not implemented yet");
1409
- }
1410
- enableUiInteractionMode() {
1411
- console.error("RoomleWebGPURenderer.enableUiInteractionMode is not implemented yet");
1412
- }
1413
- getQualityLevel() {
1414
- return console.error("RoomleWebGPURenderer.getQualityLevel is not implemented yet"), d.HIGHEST;
1415
- }
1416
- highlightObjects(e) {
1417
- let t = this.getOutlinePassOrUndefined();
1418
- t && (this.passNeedsReassembly = this.passNeedsReassembly || t.areObjectsSelected() && e.length === 0 || !t.areObjectsSelected() && e.length > 0), t?.highlightObjects(e);
1419
- }
1420
- loadLutImages(e) {
1421
- console.error("RoomleWebGPURenderer.loadLutImages is not implemented yet");
1422
- }
1423
- render(e, t) {
1424
- this.passNeedsReassembly &&= (this.renderPipeline.outputNode = this.assembleRenderPasses(e, t), this.renderPipeline.needsUpdate = !0, !1), this.renderPipeline.render(e, t);
1425
- }
1426
- assembleRenderPasses(e, t) {
1427
- let n = se(e, t);
1428
- for (let r of this.renderPasses.values()) n = r.assemble(n, e, t, this.debugMode);
1429
- return n;
1430
- }
1431
- setAutoQuality(e) {
1432
- console.error("RoomleWebGPURenderer.setAutoQuality is not implemented yet");
1433
- }
1434
- setCustomShadingParameters(e, t) {
1435
- console.error("RoomleWebGPURenderer.setCustomShadingParameters is not implemented yet");
1436
- }
1437
- setCustomOutlineParameters(e) {
1438
- let t = this.getOutlinePassOrUndefined();
1439
- t && (t.setOutlineColors(e.outlineVisibleEdgeColor, e.outlineHiddenEdgeColor), this.passNeedsReassembly = !0);
1440
- }
1441
- setGroundShadow(e) {
1442
- console.error("RoomleWebGPURenderer.setGroundShadow is not implemented yet");
1443
- }
1444
- setOnQualityLevelChangeCallback(e) {
1445
- console.error("RoomleWebGPURenderer.setOnQualityLevelChangeCallback is not implemented yet");
1446
- }
1447
- enableOutline(e, t) {
1448
- this.renderPasses.get(U.passId) || this.addRenderPass(new U({
1449
- selectedObjects: [],
1450
- visibleEdgeColor: e,
1451
- hiddenEdgeColor: t,
1452
- edgeStrength: 3,
1453
- edgeGlow: 0,
1454
- edgeThickness: 1
1455
- }));
1456
- }
1457
- getOutlinePassOrUndefined() {
1458
- let e = this.renderPasses.get(U.passId);
1459
- if (e && e instanceof U) return e;
1460
- }
1461
- setQualityLevel(e) {
1462
- console.error("RoomleWebGPURenderer.setQualityLevel is not implemented yet");
1463
- }
1464
- setQualityMap(e) {
1465
- console.error("RoomleWebGPURenderer.setQualityMap is not implemented yet");
1466
- }
1467
- setShadingType(e) {
1468
- console.error("RoomleWebGPURenderer.setShadingType is not implemented yet");
1469
- }
1470
- showGUI(e) {
1471
- if (this.renderer.inspector instanceof Q) return;
1472
- let t = document.createElement("style");
1473
- t.innerText = "#profiler-toggle,\n #profiler-mini-panel {\n left: 15px;\n right: auto !important;\n }", document.head.appendChild(t);
1474
- let n = new Q();
1475
- this.renderer.inspector = n, this._domHelper.element?.appendChild(n.domElement), this.addDebugGUI(n, e);
1476
- let r = n.createParameters("Render Pass Settings");
1477
- for (let t of this.renderPasses.values()) t.addParametersToGUI(r, e);
1478
- }
1479
- addDebugGUI(e, t) {
1480
- let n = e.createParameters("Debug Settings"), r = { debugMode: this.debugMode };
1481
- n.add(r, "debugMode", {
1482
- Off: "off",
1483
- Outline: "outline"
1484
- }).onChange((e) => {
1485
- this.debugMode = e, this.passNeedsReassembly = !0, t();
1486
- });
1487
- }
1488
- getOrCreateGUIParameters(e) {
1489
- let t = this.renderer.inspector;
1490
- if (t instanceof Q) return this.guiParameterGroups.get(e) ?? this.createAndCacheGUIParameters(t, e);
1491
- throw Error("Inspector GUI is not initialized. Call showGUI() before creating parameter groups.");
1492
- }
1493
- createAndCacheGUIParameters(e, t) {
1494
- let n = e.createParameters(t);
1495
- return this.guiParameterGroups.set(t, n), n;
1496
- }
1497
- };
1498
- m([p, f("design:type", Object)], $.prototype, "_domHelper", void 0);
1499
- //#endregion
1500
- export { $ as RoomleWebGPURenderer };
1501
-
1502
- //# sourceMappingURL=roomle-webgpu-renderer-D5flithq.mjs.map