@react-three/drei 9.23.6 → 9.24.0

package/README.md

@@ -135,6 +135,7 @@ The `native` route of the library **does not** export `Html` or `Loader`. The de
           <li><a href="#adaptivedpr">AdaptiveDpr</a></li>
           <li><a href="#adaptiveevents">AdaptiveEvents</a></li>
           <li><a href="#usebvh">useBVH</a></li>
+          <li><a href="#performancemonitor">PerformanceMonitor</a></li>          
         </ul>
         <li><a href="#portals">Portals</a></li>        
         <ul>
@@ -1914,6 +1915,81 @@ useBVH(mesh)
 <mesh ref={mesh} ... />
 ```
 
+#### PerformanceMonitor
+
+```tsx
+type PerformanceMonitorProps = {
+  /** How much time in milliseconds to collect an average fps, 250 */
+  ms?: number
+  /** How many interations of averages to collect, 10 */
+  iterations?: number
+  /** The percentage of iterations that are matched against the lower and upper bounds, 0.75 */
+  threshold?: number
+  /** A function that receive the max device refreshrate to determine lower and upper bounds which create a margin where neither incline nor decline should happen, (refreshrate) => (refreshrate > 90 ? [50, 90] : [50, 60]) */
+  bounds: (refreshrate: number) => [lower: number, upper: number]
+  /** How many times it can inline or decline before onFallback is called, Infinity */
+  flipflops?: number
+  /** The factor increases and decreases between 0-1, this prop sets the initial value, 0.5 */
+  factor?: number
+  /** The step that gets added or subtracted to or from the factor on each incline/decline, 0.1 */
+  step?: number
+  /** When performance is higher than the upper bound (good!) */
+  onIncline?: (api: PerformanceMonitorApi) => void
+  /** When performance is lower than the upper bound (bad!) */
+  onDecline?: (api: PerformanceMonitorApi) => void
+  /** Incline and decline will change the factor, this will trigger when that happened */
+  onChange?: (api: PerformanceMonitorApi) => void
+  /** Called after when the number of flipflops is reached, it indicates instability, use the function to set a fixed baseline */
+  onFallback?: (api: PerformanceMonitorApi) => void
+  /** Children may use the usePerformanceMonitor hook */
+  children?: React.ReactNode
+}
+```
+
+This component will collect the average fps (frames per second) over time. If after a couple of iterations the averages are below or above a threshold it will trigger onIncline and onDecline callbacks that allow you to respond. Typically you would reduce the quality of your scene, the resolution, effects, the amount of stuff to render, or, increase it if you have enough framerate to fill.
+
+Since this would normally cause ping-ponging between the two callbacks you define upper and lower framerate bounds, as long as you stay within that margin nothing will trigger. Ideally your app should find its way into that margin by gradually altering quality.
+
+A simple example for regulating the resolution. It starts out with 1.5, if the system falls below the bounds it goes to 1, if it's fast enough it goes to 2.
+
+```jsx
+function App() {
+  const [dpr, set] = useState(1.5)
+  return (
+    <Canvas dpr={dpr}>
+      <PerformanceMonitor onIncline={() => set(2)} onDecline={() => set(1)} >
+```
+
+You can also use the `onChange` callback to get notified when the average changes in whichever direction. This allows you to make gradual changes. It gives you a factor between 0 and 1, which is increased by incline and decreased by decline. The factor is initially 0.5 by default.
+
+```jsx
+import round from 'lodash/round'
+
+const [dpr, set] = useState(1)
+return (
+ <Canvas dpr={dpr}>
+  <PerformanceMonitor onChange={({ factor }) => set(round(0.5 + 1.5 * factor, 1))} >
+```
+
+If you still experience flip flops despite the bounds you can define a limit of `flipflops`. If it is met `onFallback` will be triggered which typically sets a lowest possible baseline for the app. After the fallback has been called PerformanceMonitor will shut down.
+
+```jsx
+<PerformanceMonitor flipflops={3} onFallback={() => ...}>
+```
+
+PerformanceMonitor can also have children, if you wrap your an in it you get to use `usePerformanceMonitor` which allows individual components down the nested tree to respond to performance changes.
+
+```jsx
+;<PerformanceMonitor>
+  <Scene />
+</PerformanceMonitor>
+
+function Scene() {
+  usePerformanceMonitor({ onIncline, onDecline, onFallback, onChange })
+  // ...
+}
+```
+
 # Portals
 
 #### View

package/core/ContactShadows.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),t=require("three"),a=require("@react-three/fiber"),n=require("three-stdlib");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var u=o(e),l=i(r),s=i(t);const c=l.forwardRef((({scale:e=10,frames:r=1/0,opacity:t=1,width:o=1,height:i=1,blur:c=1,far:d=10,resolution:f=512,smooth:h=!0,color:m="#000000",depthWrite:g=!1,renderOrder:p,...v},b)=>{const M=a.useThree((e=>e.scene)),y=a.useThree((e=>e.gl)),w=l.useRef(null);o*=Array.isArray(e)?e[0]:e||1,i*=Array.isArray(e)?e[1]:e||1;const[T,S,x,O,R,j,C]=l.useMemo((()=>{const e=new s.WebGLRenderTarget(f,f),r=new s.WebGLRenderTarget(f,f);r.texture.generateMipmaps=e.texture.generateMipmaps=!1;const t=new s.PlaneGeometry(o,i).rotateX(Math.PI/2),a=new s.Mesh(t),u=new s.MeshDepthMaterial;u.depthTest=u.depthWrite=!1,u.onBeforeCompile=e=>{e.uniforms={...e.uniforms,ucolor:{value:new s.Color(m)}},e.fragmentShader=e.fragmentShader.replace("void main() {","uniform vec3 ucolor;\n           void main() {\n          "),e.fragmentShader=e.fragmentShader.replace("vec4( vec3( 1.0 - fragCoordZ ), opacity );","vec4( ucolor * fragCoordZ * 2.0, ( 1.0 - fragCoordZ ) * 1.0 );"),console.log(e.fragmentShader)};const l=new s.ShaderMaterial(n.HorizontalBlurShader),c=new s.ShaderMaterial(n.VerticalBlurShader);return c.depthTest=l.depthTest=!1,[e,t,u,a,l,c,r]}),[f,o,i,e,m]),P=e=>{O.visible=!0,O.material=R,R.uniforms.tDiffuse.value=T.texture,R.uniforms.h.value=1*e/256,y.setRenderTarget(C),y.render(O,w.current),O.material=j,j.uniforms.tDiffuse.value=C.texture,j.uniforms.v.value=1*e/256,y.setRenderTarget(T),y.render(O,w.current),O.visible=!1};let E=0;return a.useFrame((()=>{if(w.current&&(r===1/0||E<r)){const e=M.background;M.background=null;const r=M.overrideMaterial;M.overrideMaterial=x,y.setRenderTarget(T),y.render(M,w.current),M.overrideMaterial=r,P(c),h&&P(.4*c),y.setRenderTarget(null),M.background=e,E++}})),l.createElement("group",u.default({"rotation-x":Math.PI/2},v,{ref:b}),l.createElement("mesh",{renderOrder:p,geometry:S,scale:[1,-1,1],rotation:[-Math.PI/2,0,0]},l.createElement("meshBasicMaterial",{map:T.texture,"map-encoding":y.outputEncoding,transparent:!0,opacity:t,depthWrite:g})),l.createElement("orthographicCamera",{ref:w,args:[-o/2,o/2,i/2,-i/2,0,d]}))}));exports.ContactShadows=c;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),t=require("three"),a=require("@react-three/fiber"),n=require("three-stdlib");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var u=o(e),l=i(r),s=i(t);const c=l.forwardRef((({scale:e=10,frames:r=1/0,opacity:t=1,width:o=1,height:i=1,blur:c=1,far:d=10,resolution:f=512,smooth:h=!0,color:m="#000000",depthWrite:p=!1,renderOrder:g,...v},b)=>{const M=a.useThree((e=>e.scene)),y=a.useThree((e=>e.gl)),w=l.useRef(null);o*=Array.isArray(e)?e[0]:e||1,i*=Array.isArray(e)?e[1]:e||1;const[T,x,O,S,R,j,C]=l.useMemo((()=>{const e=new s.WebGLRenderTarget(f,f),r=new s.WebGLRenderTarget(f,f);r.texture.generateMipmaps=e.texture.generateMipmaps=!1;const t=new s.PlaneGeometry(o,i).rotateX(Math.PI/2),a=new s.Mesh(t),u=new s.MeshDepthMaterial;u.depthTest=u.depthWrite=!1,u.onBeforeCompile=e=>{e.uniforms={...e.uniforms,ucolor:{value:new s.Color(m)}},e.fragmentShader=e.fragmentShader.replace("void main() {","uniform vec3 ucolor;\n           void main() {\n          "),e.fragmentShader=e.fragmentShader.replace("vec4( vec3( 1.0 - fragCoordZ ), opacity );","vec4( ucolor * fragCoordZ * 2.0, ( 1.0 - fragCoordZ ) * 1.0 );")};const l=new s.ShaderMaterial(n.HorizontalBlurShader),c=new s.ShaderMaterial(n.VerticalBlurShader);return c.depthTest=l.depthTest=!1,[e,t,u,a,l,c,r]}),[f,o,i,e,m]),P=e=>{S.visible=!0,S.material=R,R.uniforms.tDiffuse.value=T.texture,R.uniforms.h.value=1*e/256,y.setRenderTarget(C),y.render(S,w.current),S.material=j,j.uniforms.tDiffuse.value=C.texture,j.uniforms.v.value=1*e/256,y.setRenderTarget(T),y.render(S,w.current),S.visible=!1};let E=0;return a.useFrame((()=>{if(w.current&&(r===1/0||E<r)){const e=M.background;M.background=null;const r=M.overrideMaterial;M.overrideMaterial=O,y.setRenderTarget(T),y.render(M,w.current),M.overrideMaterial=r,P(c),h&&P(.4*c),y.setRenderTarget(null),M.background=e,E++}})),l.createElement("group",u.default({"rotation-x":Math.PI/2},v,{ref:b}),l.createElement("mesh",{renderOrder:g,geometry:x,scale:[1,-1,1],rotation:[-Math.PI/2,0,0]},l.createElement("meshBasicMaterial",{map:T.texture,"map-encoding":y.outputEncoding,transparent:!0,opacity:t,depthWrite:p})),l.createElement("orthographicCamera",{ref:w,args:[-o/2,o/2,i/2,-i/2,0,d]}))}));exports.ContactShadows=c;

package/core/ContactShadows.js

@@ -45,7 +45,6 @@ const ContactShadows = /*#__PURE__*/React.forwardRef(({
           `);
       shader.fragmentShader = shader.fragmentShader.replace('vec4( vec3( 1.0 - fragCoordZ ), opacity );', // Colorize the shadow, multiply by the falloff so that the center can remain darker
       'vec4( ucolor * fragCoordZ * 2.0, ( 1.0 - fragCoordZ ) * 1.0 );');
-      console.log(shader.fragmentShader);
     };
 
     const horizontalBlurMaterial = new THREE.ShaderMaterial(HorizontalBlurShader);

package/core/PerformanceMonitor.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("@react-three/fiber");function r(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,t.get?t:{enumerable:!0,get:function(){return e[r]}})}})),n.default=e,Object.freeze(n)}var t=r(e);const o=e.createContext(null);exports.PerformanceMonitor=function({iterations:r=10,ms:a=250,threshold:c=.75,step:s=.1,factor:l=.5,flipflops:i=1/0,bounds:f=(e=>e>100?[60,100]:[40,60]),onIncline:u,onDecline:p,onChange:b,onFallback:h,children:d}){const g=Math.pow(10,0),[m,k]=e.useState((()=>({fps:0,index:0,factor:l,flipped:0,refreshrate:0,fallback:!1,frames:[],averages:[],subscriptions:new Map,subscribe:e=>{const n=Symbol();return m.subscriptions.set(n,e.current),()=>{m.subscriptions.delete(n)}}})));let v=0;return n.useFrame((()=>{const{frames:e,averages:n}=m;if(!m.fallback&&n.length<r){e.push(performance.now());const t=e[e.length-1]-e[0];if(t>=a){if(m.fps=Math.round(e.length/t*1e3*g)/g,m.refreshrate=Math.max(m.refreshrate,m.fps),n[m.index++%r]=m.fps,n.length===r){const[e,t]=f(m.refreshrate),o=n.filter((e=>e>=t)),a=n.filter((n=>n<e));o.length>r*c&&(m.factor=Math.min(1,m.factor+s),m.flipped++,u&&u(m),m.subscriptions.forEach((e=>e.onIncline&&e.onIncline(m)))),a.length>r*c&&(m.factor=Math.max(0,m.factor-s),m.flipped++,p&&p(m),m.subscriptions.forEach((e=>e.onDecline&&e.onDecline(m)))),v!==m.factor&&(v=m.factor,b&&b(m),m.subscriptions.forEach((e=>e.onChange&&e.onChange(m)))),m.flipped>i&&!m.fallback&&(m.fallback=!0,h&&h(m),m.subscriptions.forEach((e=>e.onFallback&&e.onFallback(m)))),m.averages=[]}m.frames=[]}}})),t.createElement(o.Provider,{value:m},d)},exports.usePerformanceMonitor=function({onIncline:n,onDecline:r,onChange:t,onFallback:a}){const c=e.useContext(o),s=e.useRef({onIncline:n,onDecline:r,onChange:t,onFallback:a});e.useLayoutEffect((()=>{s.current.onIncline=n,s.current.onDecline=r,s.current.onChange=t,s.current.onFallback=a}),[n,r,t,a]),e.useLayoutEffect((()=>c.subscribe(s)),[c])};

package/core/PerformanceMonitor.d.ts

@@ -0,0 +1,41 @@
+import * as React from 'react';
+declare type PerformanceMonitorHookApi = {
+    onIncline: (api: PerformanceMonitorApi) => void;
+    onDecline: (api: PerformanceMonitorApi) => void;
+    onChange: (api: PerformanceMonitorApi) => void;
+    onFallback: (api: PerformanceMonitorApi) => void;
+};
+declare type PerformanceMonitorApi = {
+    fps: number;
+    index: number;
+    factor: number;
+    flipped: number;
+    refreshrate: number;
+    fallback: boolean;
+    frames: number[];
+    averages: number[];
+    subscriptions: Map<Symbol, PerformanceMonitorHookApi>;
+    subscribe: (ref: React.MutableRefObject<PerformanceMonitorHookApi>) => () => void;
+};
+declare type PerformanceMonitorProps = {
+    ms?: number;
+    iterations?: number;
+    threshold?: number;
+    bounds: (refreshrate: number) => [lower: number, upper: number];
+    flipflops?: number;
+    factor?: number;
+    step?: number;
+    onIncline?: (api: PerformanceMonitorApi) => void;
+    onDecline?: (api: PerformanceMonitorApi) => void;
+    onChange?: (api: PerformanceMonitorApi) => void;
+    onFallback?: (api: PerformanceMonitorApi) => void;
+    children?: React.ReactNode;
+};
+export declare function PerformanceMonitor({ iterations, ms, threshold, step, factor: _factor, flipflops, bounds, onIncline, onDecline, onChange, onFallback, children, }: PerformanceMonitorProps): JSX.Element;
+export declare function usePerformanceMonitor({ onIncline, onDecline, onChange, onFallback }: {
+    onIncline: any;
+    onDecline: any;
+    onChange: any;
+    onFallback: any;
+}): void;
+export {};

package/core/PerformanceMonitor.js

@@ -0,0 +1,121 @@
+import * as React from 'react';
+import { useState, useContext, useRef, useLayoutEffect, createContext } from 'react';
+import { useFrame } from '@react-three/fiber';
+
+const context = /*#__PURE__*/createContext(null);
+function PerformanceMonitor({
+  iterations = 10,
+  ms = 250,
+  threshold = 0.75,
+  step = 0.1,
+  factor: _factor = 0.5,
+  flipflops = Infinity,
+  bounds = refreshrate => refreshrate > 100 ? [60, 100] : [40, 60],
+  onIncline,
+  onDecline,
+  onChange,
+  onFallback,
+  children
+}) {
+  const decimalPlacesRatio = Math.pow(10, 0);
+  const [api, _] = useState(() => ({
+    fps: 0,
+    index: 0,
+    factor: _factor,
+    flipped: 0,
+    refreshrate: 0,
+    fallback: false,
+    frames: [],
+    averages: [],
+    subscriptions: new Map(),
+    subscribe: ref => {
+      const key = Symbol();
+      api.subscriptions.set(key, ref.current);
+      return () => void api.subscriptions.delete(key);
+    }
+  }));
+  let lastFactor = 0;
+  useFrame(() => {
+    const {
+      frames,
+      averages
+    } = api; // If the fallback has been reached do not continue running samples
+
+    if (api.fallback) return;
+
+    if (averages.length < iterations) {
+      frames.push(performance.now());
+      const msPassed = frames[frames.length - 1] - frames[0];
+
+      if (msPassed >= ms) {
+        api.fps = Math.round(frames.length / msPassed * 1000 * decimalPlacesRatio) / decimalPlacesRatio;
+        api.refreshrate = Math.max(api.refreshrate, api.fps);
+        averages[api.index++ % iterations] = api.fps;
+
+        if (averages.length === iterations) {
+          const [lower, upper] = bounds(api.refreshrate);
+          const upperBounds = averages.filter(value => value >= upper);
+          const lowerBounds = averages.filter(value => value < lower); // Trigger incline when more than -threshold- avgs exceed the upper bound
+
+          if (upperBounds.length > iterations * threshold) {
+            api.factor = Math.min(1, api.factor + step);
+            api.flipped++;
+            if (onIncline) onIncline(api);
+            api.subscriptions.forEach(value => value.onIncline && value.onIncline(api));
+          } // Trigger decline when more than -threshold- avgs are below the lower bound
+
+
+          if (lowerBounds.length > iterations * threshold) {
+            api.factor = Math.max(0, api.factor - step);
+            api.flipped++;
+            if (onDecline) onDecline(api);
+            api.subscriptions.forEach(value => value.onDecline && value.onDecline(api));
+          }
+
+          if (lastFactor !== api.factor) {
+            lastFactor = api.factor;
+            if (onChange) onChange(api);
+            api.subscriptions.forEach(value => value.onChange && value.onChange(api));
+          }
+
+          if (api.flipped > flipflops && !api.fallback) {
+            api.fallback = true;
+            if (onFallback) onFallback(api);
+            api.subscriptions.forEach(value => value.onFallback && value.onFallback(api));
+          }
+
+          api.averages = []; // Resetting the refreshrate creates more problems than it solves atm
+          // api.refreshrate = 0
+        }
+
+        api.frames = [];
+      }
+    }
+  });
+  return /*#__PURE__*/React.createElement(context.Provider, {
+    value: api
+  }, children);
+}
+function usePerformanceMonitor({
+  onIncline,
+  onDecline,
+  onChange,
+  onFallback
+}) {
+  const api = useContext(context);
+  const ref = useRef({
+    onIncline,
+    onDecline,
+    onChange,
+    onFallback
+  });
+  useLayoutEffect(() => {
+    ref.current.onIncline = onIncline;
+    ref.current.onDecline = onDecline;
+    ref.current.onChange = onChange;
+    ref.current.onFallback = onFallback;
+  }, [onIncline, onDecline, onChange, onFallback]);
+  useLayoutEffect(() => api.subscribe(ref), [api]);
+}
+
+export { PerformanceMonitor, usePerformanceMonitor };

package/core/Text3D.d.ts

@@ -28,7 +28,7 @@ declare type FontData = {
 };
 export declare const Text3D: React.ForwardRefExoticComponent<Pick<React.PropsWithChildren<{
     font: FontData | string;
-    bevelSegments: number;
+    bevelSegments?: number | undefined;
 } & Omit<TextGeometryParameters, "font"> & Omit<import("@react-three/fiber").ExtendedColors<import("@react-three/fiber").Overwrite<Partial<THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>>, import("@react-three/fiber").NodeProps<THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>, typeof THREE.Mesh>>>, import("@react-three/fiber").NonFunctionKeys<{
     position?: import("@react-three/fiber").Vector3 | undefined;
     up?: import("@react-three/fiber").Vector3 | undefined;

package/core/index.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Billboard.cjs.js"),r=require("./QuadraticBezierLine.cjs.js"),s=require("./CubicBezierLine.cjs.js"),t=require("./CatmullRomLine.cjs.js"),o=require("./Line.cjs.js"),i=require("./PositionalAudio.cjs.js"),u=require("./Text.cjs.js"),a=require("./Text3D.cjs.js"),n=require("./Effects.cjs.js"),c=require("./GradientTexture.cjs.js"),j=require("./Image.cjs.js"),p=require("./Edges.cjs.js"),x=require("./Trail.cjs.js"),l=require("./Sampler.cjs.js"),q=require("./ComputedAttribute.cjs.js"),d=require("./Clone.cjs.js"),m=require("./MarchingCubes.cjs.js"),C=require("./Decal.cjs.js"),h=require("./OrthographicCamera.cjs.js"),S=require("./PerspectiveCamera.cjs.js"),b=require("./CubeCamera.cjs.js"),M=require("./DeviceOrientationControls.cjs.js"),B=require("./FlyControls.cjs.js"),g=require("./MapControls.cjs.js"),P=require("./OrbitControls.cjs.js"),T=require("./TrackballControls.cjs.js"),v=require("./ArcballControls.cjs.js"),f=require("./TransformControls.cjs.js"),A=require("./PointerLockControls.cjs.js"),L=require("./FirstPersonControls.cjs.js"),k=require("./GizmoHelper.cjs.js"),D=require("./GizmoViewcube.cjs.js"),E=require("./GizmoViewport.cjs.js"),G=require("./useCubeTexture.cjs.js"),w=require("./useFBX.cjs.js"),z=require("./useGLTF.cjs.js"),F=require("./useProgress.cjs.js"),R=require("./useTexture.cjs.js"),O=require("./useKTX2.cjs.js"),I=require("./Stats.cjs.js"),y=require("./useDepthBuffer.cjs.js"),H=require("./useAspect.cjs.js"),V=require("./useCamera.cjs.js"),Q=require("./useDetectGPU.cjs.js"),X=require("./useHelper.cjs.js"),K=require("./useBVH.cjs.js"),W=require("./useContextBridge.cjs.js"),N=require("./useAnimations.cjs.js"),U=require("./useFBO.cjs.js"),_=require("./useIntersect.cjs.js"),J=require("./useBoxProjectedEnv.cjs.js"),Y=require("./BBAnchor.cjs.js"),Z=require("./CurveModifier.cjs.js"),$=require("./MeshDistortMaterial.cjs.js"),ee=require("./MeshWobbleMaterial.cjs.js"),re=require("./MeshReflectorMaterial.cjs.js"),se=require("./PointMaterial.cjs.js"),te=require("./shaderMaterial.cjs.js"),oe=require("./softShadows.cjs.js"),ie=require("./shapes.cjs.js"),ue=require("./RoundedBox.cjs.js"),ae=require("./ScreenQuad.cjs.js"),ne=require("./Center.cjs.js"),ce=require("./Bounds.cjs.js"),je=require("./CameraShake.cjs.js"),pe=require("./Float.cjs.js"),xe=require("./Stage.cjs.js"),le=require("./Backdrop.cjs.js"),qe=require("./Shadow.cjs.js"),de=require("./ContactShadows.cjs.js"),me=require("./AccumulativeShadows.cjs.js"),Ce=require("./Reflector.cjs.js"),he=require("./SpotLight.cjs.js"),Se=require("./Environment.cjs.js"),be=require("./Lightformer.cjs.js"),Me=require("./Sky.cjs.js"),Be=require("./Stars.cjs.js"),ge=require("./Cloud.cjs.js"),Pe=require("./Sparkles.cjs.js"),Te=require("./useMatcapTexture.cjs.js"),ve=require("./useNormalTexture.cjs.js"),fe=require("./Points.cjs.js"),Ae=require("./Instances.cjs.js"),Le=require("./Segments.cjs.js"),ke=require("./Detailed.cjs.js"),De=require("./Preload.cjs.js"),Ee=require("./BakeShadows.cjs.js"),Ge=require("./meshBounds.cjs.js"),we=require("./AdaptiveDpr.cjs.js"),ze=require("./AdaptiveEvents.cjs.js"),Fe=require("./RenderTexture.cjs.js"),Re=require("./Mask.cjs.js");require("@babel/runtime/helpers/extends"),require("react"),require("@react-three/fiber"),require("react-merge-refs"),require("three"),require("three-stdlib"),require("troika-three-text"),require("suspend-react"),require("meshline"),require("lodash.pick"),require("lodash.omit"),require("zustand"),require("stats.js"),require("../helpers/useEffectfulState.cjs.js"),require("detect-gpu"),require("three-mesh-bvh"),require("../materials/BlurPass.cjs.js"),require("../materials/ConvolutionMaterial.cjs.js"),require("../materials/MeshReflectorMaterial.cjs.js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("../helpers/Position.cjs.js"),require("react-composer"),exports.Billboard=e.Billboard,exports.QuadraticBezierLine=r.QuadraticBezierLine,exports.CubicBezierLine=s.CubicBezierLine,exports.CatmullRomLine=t.CatmullRomLine,exports.Line=o.Line,exports.PositionalAudio=i.PositionalAudio,exports.Text=u.Text,exports.Text3D=a.Text3D,exports.Effects=n.Effects,exports.isWebGL2Available=n.isWebGL2Available,exports.GradientTexture=c.GradientTexture,exports.Image=j.Image,exports.Edges=p.Edges,exports.Trail=x.Trail,exports.useTrail=x.useTrail,exports.Sampler=l.Sampler,exports.useSurfaceSampler=l.useSurfaceSampler,exports.ComputedAttribute=q.ComputedAttribute,exports.Clone=d.Clone,exports.MarchingCube=m.MarchingCube,exports.MarchingCubes=m.MarchingCubes,exports.MarchingPlane=m.MarchingPlane,exports.Decal=C.Decal,exports.OrthographicCamera=h.OrthographicCamera,exports.PerspectiveCamera=S.PerspectiveCamera,exports.CubeCamera=b.CubeCamera,exports.DeviceOrientationControls=M.DeviceOrientationControls,exports.FlyControls=B.FlyControls,exports.MapControls=g.MapControls,exports.OrbitControls=P.OrbitControls,exports.TrackballControls=T.TrackballControls,exports.ArcballControls=v.ArcballControls,exports.TransformControls=f.TransformControls,exports.PointerLockControls=A.PointerLockControls,exports.FirstPersonControls=L.FirstPersonControls,exports.GizmoHelper=k.GizmoHelper,exports.useGizmoContext=k.useGizmoContext,exports.GizmoViewcube=D.GizmoViewcube,exports.GizmoViewport=E.GizmoViewport,exports.useCubeTexture=G.useCubeTexture,exports.useFBX=w.useFBX,exports.useGLTF=z.useGLTF,exports.useProgress=F.useProgress,exports.IsObject=R.IsObject,exports.useTexture=R.useTexture,exports.useKTX2=O.useKTX2,exports.Stats=I.Stats,exports.useDepthBuffer=y.useDepthBuffer,exports.useAspect=H.useAspect,exports.useCamera=V.useCamera,exports.useDetectGPU=Q.useDetectGPU,exports.useHelper=X.useHelper,exports.useBVH=K.useBVH,exports.useContextBridge=W.useContextBridge,exports.useAnimations=N.useAnimations,exports.useFBO=U.useFBO,exports.useIntersect=_.useIntersect,exports.useBoxProjectedEnv=J.useBoxProjectedEnv,exports.BBAnchor=Y.BBAnchor,exports.CurveModifier=Z.CurveModifier,exports.MeshDistortMaterial=$.MeshDistortMaterial,exports.MeshWobbleMaterial=ee.MeshWobbleMaterial,exports.MeshReflectorMaterial=re.MeshReflectorMaterial,exports.PointMaterial=se.PointMaterial,exports.PointMaterialImpl=se.PointMaterialImpl,exports.shaderMaterial=te.shaderMaterial,exports.softShadows=oe.softShadows,exports.Box=ie.Box,exports.Capsule=ie.Capsule,exports.Circle=ie.Circle,exports.Cone=ie.Cone,exports.Cylinder=ie.Cylinder,exports.Dodecahedron=ie.Dodecahedron,exports.Extrude=ie.Extrude,exports.Icosahedron=ie.Icosahedron,exports.Lathe=ie.Lathe,exports.Octahedron=ie.Octahedron,exports.Plane=ie.Plane,exports.Polyhedron=ie.Polyhedron,exports.Ring=ie.Ring,exports.Sphere=ie.Sphere,exports.Tetrahedron=ie.Tetrahedron,exports.Torus=ie.Torus,exports.TorusKnot=ie.TorusKnot,exports.Tube=ie.Tube,exports.RoundedBox=ue.RoundedBox,exports.ScreenQuad=ae.ScreenQuad,exports.Center=ne.Center,exports.Bounds=ce.Bounds,exports.useBounds=ce.useBounds,exports.CameraShake=je.CameraShake,exports.Float=pe.Float,exports.Stage=xe.Stage,exports.Backdrop=le.Backdrop,exports.Shadow=qe.Shadow,exports.ContactShadows=de.ContactShadows,exports.AccumulativeShadows=me.AccumulativeShadows,exports.RandomizedLight=me.RandomizedLight,exports.accumulativeContext=me.accumulativeContext,exports.Reflector=Ce.Reflector,exports.SpotLight=he.SpotLight,exports.Environment=Se.Environment,exports.EnvironmentCube=Se.EnvironmentCube,exports.EnvironmentMap=Se.EnvironmentMap,exports.EnvironmentPortal=Se.EnvironmentPortal,exports.useEnvironment=Se.useEnvironment,exports.Lightformer=be.Lightformer,exports.Sky=Me.Sky,exports.calcPosFromAngles=Me.calcPosFromAngles,exports.Stars=Be.Stars,exports.Cloud=ge.Cloud,exports.Sparkles=Pe.Sparkles,exports.useMatcapTexture=Te.useMatcapTexture,exports.useNormalTexture=ve.useNormalTexture,exports.Point=fe.Point,exports.Points=fe.Points,exports.PointsBuffer=fe.PointsBuffer,exports.Instance=Ae.Instance,exports.Instances=Ae.Instances,exports.Merged=Ae.Merged,exports.Segment=Le.Segment,exports.SegmentObject=Le.SegmentObject,exports.Segments=Le.Segments,exports.Detailed=ke.Detailed,exports.Preload=De.Preload,exports.BakeShadows=Ee.BakeShadows,exports.meshBounds=Ge.meshBounds,exports.AdaptiveDpr=we.AdaptiveDpr,exports.AdaptiveEvents=ze.AdaptiveEvents,exports.RenderTexture=Fe.RenderTexture,exports.Mask=Re.Mask,exports.useMask=Re.useMask;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./Billboard.cjs.js"),r=require("./QuadraticBezierLine.cjs.js"),s=require("./CubicBezierLine.cjs.js"),t=require("./CatmullRomLine.cjs.js"),o=require("./Line.cjs.js"),i=require("./PositionalAudio.cjs.js"),u=require("./Text.cjs.js"),a=require("./Text3D.cjs.js"),n=require("./Effects.cjs.js"),c=require("./GradientTexture.cjs.js"),j=require("./Image.cjs.js"),p=require("./Edges.cjs.js"),x=require("./Trail.cjs.js"),l=require("./Sampler.cjs.js"),q=require("./ComputedAttribute.cjs.js"),d=require("./Clone.cjs.js"),m=require("./MarchingCubes.cjs.js"),C=require("./Decal.cjs.js"),h=require("./OrthographicCamera.cjs.js"),M=require("./PerspectiveCamera.cjs.js"),S=require("./CubeCamera.cjs.js"),b=require("./DeviceOrientationControls.cjs.js"),B=require("./FlyControls.cjs.js"),P=require("./MapControls.cjs.js"),g=require("./OrbitControls.cjs.js"),T=require("./TrackballControls.cjs.js"),f=require("./ArcballControls.cjs.js"),v=require("./TransformControls.cjs.js"),A=require("./PointerLockControls.cjs.js"),L=require("./FirstPersonControls.cjs.js"),k=require("./GizmoHelper.cjs.js"),D=require("./GizmoViewcube.cjs.js"),E=require("./GizmoViewport.cjs.js"),G=require("./useCubeTexture.cjs.js"),w=require("./useFBX.cjs.js"),z=require("./useGLTF.cjs.js"),F=require("./useProgress.cjs.js"),R=require("./useTexture.cjs.js"),O=require("./useKTX2.cjs.js"),I=require("./Stats.cjs.js"),y=require("./useDepthBuffer.cjs.js"),H=require("./useAspect.cjs.js"),V=require("./useCamera.cjs.js"),Q=require("./useDetectGPU.cjs.js"),X=require("./useHelper.cjs.js"),K=require("./useBVH.cjs.js"),W=require("./useContextBridge.cjs.js"),N=require("./useAnimations.cjs.js"),U=require("./useFBO.cjs.js"),_=require("./useIntersect.cjs.js"),J=require("./useBoxProjectedEnv.cjs.js"),Y=require("./BBAnchor.cjs.js"),Z=require("./CurveModifier.cjs.js"),$=require("./MeshDistortMaterial.cjs.js"),ee=require("./MeshWobbleMaterial.cjs.js"),re=require("./MeshReflectorMaterial.cjs.js"),se=require("./PointMaterial.cjs.js"),te=require("./shaderMaterial.cjs.js"),oe=require("./softShadows.cjs.js"),ie=require("./shapes.cjs.js"),ue=require("./RoundedBox.cjs.js"),ae=require("./ScreenQuad.cjs.js"),ne=require("./Center.cjs.js"),ce=require("./Bounds.cjs.js"),je=require("./CameraShake.cjs.js"),pe=require("./Float.cjs.js"),xe=require("./Stage.cjs.js"),le=require("./Backdrop.cjs.js"),qe=require("./Shadow.cjs.js"),de=require("./ContactShadows.cjs.js"),me=require("./AccumulativeShadows.cjs.js"),Ce=require("./Reflector.cjs.js"),he=require("./SpotLight.cjs.js"),Me=require("./Environment.cjs.js"),Se=require("./Lightformer.cjs.js"),be=require("./Sky.cjs.js"),Be=require("./Stars.cjs.js"),Pe=require("./Cloud.cjs.js"),ge=require("./Sparkles.cjs.js"),Te=require("./useMatcapTexture.cjs.js"),fe=require("./useNormalTexture.cjs.js"),ve=require("./Points.cjs.js"),Ae=require("./Instances.cjs.js"),Le=require("./Segments.cjs.js"),ke=require("./Detailed.cjs.js"),De=require("./Preload.cjs.js"),Ee=require("./BakeShadows.cjs.js"),Ge=require("./meshBounds.cjs.js"),we=require("./AdaptiveDpr.cjs.js"),ze=require("./AdaptiveEvents.cjs.js"),Fe=require("./PerformanceMonitor.cjs.js"),Re=require("./RenderTexture.cjs.js"),Oe=require("./Mask.cjs.js");require("@babel/runtime/helpers/extends"),require("react"),require("@react-three/fiber"),require("react-merge-refs"),require("three"),require("three-stdlib"),require("troika-three-text"),require("suspend-react"),require("meshline"),require("lodash.pick"),require("lodash.omit"),require("zustand"),require("stats.js"),require("../helpers/useEffectfulState.cjs.js"),require("detect-gpu"),require("three-mesh-bvh"),require("../materials/BlurPass.cjs.js"),require("../materials/ConvolutionMaterial.cjs.js"),require("../materials/MeshReflectorMaterial.cjs.js"),require("../helpers/environment-assets.cjs.js"),require("../materials/SpotLightMaterial.cjs.js"),require("../helpers/Position.cjs.js"),require("react-composer"),exports.Billboard=e.Billboard,exports.QuadraticBezierLine=r.QuadraticBezierLine,exports.CubicBezierLine=s.CubicBezierLine,exports.CatmullRomLine=t.CatmullRomLine,exports.Line=o.Line,exports.PositionalAudio=i.PositionalAudio,exports.Text=u.Text,exports.Text3D=a.Text3D,exports.Effects=n.Effects,exports.isWebGL2Available=n.isWebGL2Available,exports.GradientTexture=c.GradientTexture,exports.Image=j.Image,exports.Edges=p.Edges,exports.Trail=x.Trail,exports.useTrail=x.useTrail,exports.Sampler=l.Sampler,exports.useSurfaceSampler=l.useSurfaceSampler,exports.ComputedAttribute=q.ComputedAttribute,exports.Clone=d.Clone,exports.MarchingCube=m.MarchingCube,exports.MarchingCubes=m.MarchingCubes,exports.MarchingPlane=m.MarchingPlane,exports.Decal=C.Decal,exports.OrthographicCamera=h.OrthographicCamera,exports.PerspectiveCamera=M.PerspectiveCamera,exports.CubeCamera=S.CubeCamera,exports.DeviceOrientationControls=b.DeviceOrientationControls,exports.FlyControls=B.FlyControls,exports.MapControls=P.MapControls,exports.OrbitControls=g.OrbitControls,exports.TrackballControls=T.TrackballControls,exports.ArcballControls=f.ArcballControls,exports.TransformControls=v.TransformControls,exports.PointerLockControls=A.PointerLockControls,exports.FirstPersonControls=L.FirstPersonControls,exports.GizmoHelper=k.GizmoHelper,exports.useGizmoContext=k.useGizmoContext,exports.GizmoViewcube=D.GizmoViewcube,exports.GizmoViewport=E.GizmoViewport,exports.useCubeTexture=G.useCubeTexture,exports.useFBX=w.useFBX,exports.useGLTF=z.useGLTF,exports.useProgress=F.useProgress,exports.IsObject=R.IsObject,exports.useTexture=R.useTexture,exports.useKTX2=O.useKTX2,exports.Stats=I.Stats,exports.useDepthBuffer=y.useDepthBuffer,exports.useAspect=H.useAspect,exports.useCamera=V.useCamera,exports.useDetectGPU=Q.useDetectGPU,exports.useHelper=X.useHelper,exports.useBVH=K.useBVH,exports.useContextBridge=W.useContextBridge,exports.useAnimations=N.useAnimations,exports.useFBO=U.useFBO,exports.useIntersect=_.useIntersect,exports.useBoxProjectedEnv=J.useBoxProjectedEnv,exports.BBAnchor=Y.BBAnchor,exports.CurveModifier=Z.CurveModifier,exports.MeshDistortMaterial=$.MeshDistortMaterial,exports.MeshWobbleMaterial=ee.MeshWobbleMaterial,exports.MeshReflectorMaterial=re.MeshReflectorMaterial,exports.PointMaterial=se.PointMaterial,exports.PointMaterialImpl=se.PointMaterialImpl,exports.shaderMaterial=te.shaderMaterial,exports.softShadows=oe.softShadows,exports.Box=ie.Box,exports.Capsule=ie.Capsule,exports.Circle=ie.Circle,exports.Cone=ie.Cone,exports.Cylinder=ie.Cylinder,exports.Dodecahedron=ie.Dodecahedron,exports.Extrude=ie.Extrude,exports.Icosahedron=ie.Icosahedron,exports.Lathe=ie.Lathe,exports.Octahedron=ie.Octahedron,exports.Plane=ie.Plane,exports.Polyhedron=ie.Polyhedron,exports.Ring=ie.Ring,exports.Sphere=ie.Sphere,exports.Tetrahedron=ie.Tetrahedron,exports.Torus=ie.Torus,exports.TorusKnot=ie.TorusKnot,exports.Tube=ie.Tube,exports.RoundedBox=ue.RoundedBox,exports.ScreenQuad=ae.ScreenQuad,exports.Center=ne.Center,exports.Bounds=ce.Bounds,exports.useBounds=ce.useBounds,exports.CameraShake=je.CameraShake,exports.Float=pe.Float,exports.Stage=xe.Stage,exports.Backdrop=le.Backdrop,exports.Shadow=qe.Shadow,exports.ContactShadows=de.ContactShadows,exports.AccumulativeShadows=me.AccumulativeShadows,exports.RandomizedLight=me.RandomizedLight,exports.accumulativeContext=me.accumulativeContext,exports.Reflector=Ce.Reflector,exports.SpotLight=he.SpotLight,exports.Environment=Me.Environment,exports.EnvironmentCube=Me.EnvironmentCube,exports.EnvironmentMap=Me.EnvironmentMap,exports.EnvironmentPortal=Me.EnvironmentPortal,exports.useEnvironment=Me.useEnvironment,exports.Lightformer=Se.Lightformer,exports.Sky=be.Sky,exports.calcPosFromAngles=be.calcPosFromAngles,exports.Stars=Be.Stars,exports.Cloud=Pe.Cloud,exports.Sparkles=ge.Sparkles,exports.useMatcapTexture=Te.useMatcapTexture,exports.useNormalTexture=fe.useNormalTexture,exports.Point=ve.Point,exports.Points=ve.Points,exports.PointsBuffer=ve.PointsBuffer,exports.Instance=Ae.Instance,exports.Instances=Ae.Instances,exports.Merged=Ae.Merged,exports.Segment=Le.Segment,exports.SegmentObject=Le.SegmentObject,exports.Segments=Le.Segments,exports.Detailed=ke.Detailed,exports.Preload=De.Preload,exports.BakeShadows=Ee.BakeShadows,exports.meshBounds=Ge.meshBounds,exports.AdaptiveDpr=we.AdaptiveDpr,exports.AdaptiveEvents=ze.AdaptiveEvents,exports.PerformanceMonitor=Fe.PerformanceMonitor,exports.usePerformanceMonitor=Fe.usePerformanceMonitor,exports.RenderTexture=Re.RenderTexture,exports.Mask=Oe.Mask,exports.useMask=Oe.useMask;

package/core/index.d.ts

@@ -88,5 +88,6 @@ export * from './BakeShadows';
 export * from './meshBounds';
 export * from './AdaptiveDpr';
 export * from './AdaptiveEvents';
+export * from './PerformanceMonitor';
 export * from './RenderTexture';
 export * from './Mask';

package/core/index.js

@@ -88,6 +88,7 @@ export { BakeShadows } from './BakeShadows.js';
 export { meshBounds } from './meshBounds.js';
 export { AdaptiveDpr } from './AdaptiveDpr.js';
 export { AdaptiveEvents } from './AdaptiveEvents.js';
+export { PerformanceMonitor, usePerformanceMonitor } from './PerformanceMonitor.js';
 export { RenderTexture } from './RenderTexture.js';
 export { Mask, useMask } from './Mask.js';
 import '@babel/runtime/helpers/esm/extends';