@react-three/drei 9.0.0-beta.3 → 9.0.0-beta.4

package/core/Stats.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@react-three/fiber"),r=require("stats.js"),n=require("../helpers/useEffectfulState.cjs.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function f(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var c=f(e),a=u(r);exports.Stats=function({showPanel:e=0,className:r,parent:u}){const f=n.useEffectfulState((()=>new a.default),[]);return c.useEffect((()=>{if(f){const n=u&&u.current||document.body;f.showPanel(e),null==n||n.appendChild(f.dom),r&&f.dom.classList.add(r);const c=t.addEffect((()=>f.begin())),a=t.addAfterEffect((()=>f.end()));return()=>{null==n||n.removeChild(f.dom),c(),a()}}}),[u,f,r,e]),null};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@react-three/fiber"),r=require("stats.js"),n=require("../helpers/useEffectfulState.cjs.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function f(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var c=f(e),a=u(r);exports.Stats=function({showPanel:e=0,className:r,parent:u}){const f=n.useEffectfulState((()=>new a.default),[]);return c.useEffect((()=>{if(f){const n=u&&u.current||document.body;f.showPanel(e),null==n||n.appendChild(f.dom),r&&f.dom.classList.add(...r.split(" ").filter((e=>e)));const c=t.addEffect((()=>f.begin())),a=t.addAfterEffect((()=>f.end()));return()=>{null==n||n.removeChild(f.dom),c(),a()}}}),[u,f,r,e]),null};

package/core/Stats.js

@@ -14,7 +14,7 @@ function Stats({
       const node = parent && parent.current || document.body;
       stats.showPanel(showPanel);
       node == null ? void 0 : node.appendChild(stats.dom);
-      if (className) stats.dom.classList.add(className);
+      if (className) stats.dom.classList.add(...className.split(' ').filter(cls => cls));
       const begin = addEffect(() => stats.begin());
       const end = addAfterEffect(() => stats.end());
       return () => {

package/core/Text.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("troika-three-text"),n=require("@react-three/fiber"),o=require("suspend-react");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function c(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var a=u(e),i=c(t);const f=i.forwardRef((({anchorX:e="center",anchorY:t="middle",font:u,children:c,onSync:f,...s},d)=>{const l=n.useThree((({invalidate:e})=>e)),[p]=i.useState((()=>new r.Text)),[h,b]=i.useMemo((()=>{const e=[];let t="";return i.Children.forEach(c,(r=>{"string"==typeof r||"number"==typeof r?t+=r:e.push(r)})),[e,t]}),[c]);return o.suspend((()=>new Promise((e=>r.preloadFont({font:u,characters:b},e)))),["troika-text",u,b]),i.useLayoutEffect((()=>{p.sync((()=>{l(),f&&f(p)}))})),i.useEffect((()=>()=>p.dispose()),[p]),i.createElement("primitive",a.default({object:p,ref:d,font:u,text:b,anchorX:e,anchorY:t},s),h)}));exports.Text=f;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("troika-three-text"),n=require("@react-three/fiber"),o=require("suspend-react");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function u(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var a=c(e),i=u(t);const f=i.forwardRef((({anchorX:e="center",anchorY:t="middle",font:c,children:u,characters:f,onSync:s,...d},l)=>{const p=n.useThree((({invalidate:e})=>e)),[h]=i.useState((()=>new r.Text)),[b,y]=i.useMemo((()=>{const e=[];let t="";return i.Children.forEach(u,(r=>{"string"==typeof r||"number"==typeof r?t+=r:e.push(r)})),[e,t]}),[u]);return o.suspend((()=>new Promise((e=>r.preloadFont({font:c,characters:f},e)))),["troika-text",c,f]),i.useLayoutEffect((()=>{h.sync((()=>{p(),s&&s(h)}))})),i.useEffect((()=>()=>h.dispose()),[h]),i.createElement("primitive",a.default({object:h,ref:l,font:c,text:y,anchorX:e,anchorY:t},d),b)}));exports.Text=f;

package/core/Text.d.ts

@@ -20,6 +20,7 @@ export declare const Text: React.ForwardRefExoticComponent<Pick<Omit<ReactThreeF
     dispose?: (() => void) | null | undefined;
 } & import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers & {
     children: React.ReactNode;
+    characters?: string | undefined;
     color?: ReactThreeFiber.Color | undefined;
     fontSize?: number | undefined;
     maxWidth?: number | undefined;
@@ -46,4 +47,4 @@ export declare const Text: React.ForwardRefExoticComponent<Pick<Omit<ReactThreeF
     fillOpacity?: number | undefined;
     debugSDF?: boolean | undefined;
     onSync?: ((troika: TextMeshImpl) => void) | undefined;
-}, "visible" | "attach" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "type" | "id" | "uuid" | "name" | "parent" | "modelViewMatrix" | "normalMatrix" | "matrixWorld" | "matrixAutoUpdate" | "matrixWorldNeedsUpdate" | "castShadow" | "receiveShadow" | "frustumCulled" | "renderOrder" | "animations" | "userData" | "customDepthMaterial" | "customDistanceMaterial" | "isObject3D" | "onBeforeRender" | "onAfterRender" | "applyMatrix4" | "applyQuaternion" | "setRotationFromAxisAngle" | "setRotationFromEuler" | "setRotationFromMatrix" | "setRotationFromQuaternion" | "rotateOnAxis" | "rotateOnWorldAxis" | "rotateX" | "rotateY" | "rotateZ" | "translateOnAxis" | "translateX" | "translateY" | "translateZ" | "localToWorld" | "worldToLocal" | "lookAt" | "add" | "remove" | "removeFromParent" | "clear" | "getObjectById" | "getObjectByName" | "getObjectByProperty" | "getWorldPosition" | "getWorldQuaternion" | "getWorldScale" | "getWorldDirection" | "raycast" | "traverse" | "traverseVisible" | "traverseAncestors" | "updateMatrix" | "updateMatrixWorld" | "updateWorldMatrix" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "color" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "font" | "material" | "direction" | "fontSize" | "letterSpacing" | "lineHeight" | "maxWidth" | "outlineColor" | "outlineWidth" | "overflowWrap" | "textAlign" | "whiteSpace" | "fillOpacity" | "strokeOpacity" | "strokeWidth" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "anchorX" | "anchorY" | "onSync" | "clipRect" | "depthOffset" | "outlineOffsetX" | "outlineOffsetY" | "outlineBlur" | "outlineOpacity" | "strokeColor" | "debugSDF"> & React.RefAttributes<unknown>>;
+}, "visible" | "attach" | "args" | "children" | "key" | "onUpdate" | "position" | "up" | "scale" | "rotation" | "matrix" | "quaternion" | "layers" | "dispose" | "type" | "id" | "uuid" | "name" | "parent" | "modelViewMatrix" | "normalMatrix" | "matrixWorld" | "matrixAutoUpdate" | "matrixWorldNeedsUpdate" | "castShadow" | "receiveShadow" | "frustumCulled" | "renderOrder" | "animations" | "userData" | "customDepthMaterial" | "customDistanceMaterial" | "isObject3D" | "onBeforeRender" | "onAfterRender" | "applyMatrix4" | "applyQuaternion" | "setRotationFromAxisAngle" | "setRotationFromEuler" | "setRotationFromMatrix" | "setRotationFromQuaternion" | "rotateOnAxis" | "rotateOnWorldAxis" | "rotateX" | "rotateY" | "rotateZ" | "translateOnAxis" | "translateX" | "translateY" | "translateZ" | "localToWorld" | "worldToLocal" | "lookAt" | "add" | "remove" | "removeFromParent" | "clear" | "getObjectById" | "getObjectByName" | "getObjectByProperty" | "getWorldPosition" | "getWorldQuaternion" | "getWorldScale" | "getWorldDirection" | "raycast" | "traverse" | "traverseVisible" | "traverseAncestors" | "updateMatrix" | "updateMatrixWorld" | "updateWorldMatrix" | "toJSON" | "clone" | "copy" | "addEventListener" | "hasEventListener" | "removeEventListener" | "dispatchEvent" | "color" | keyof import("@react-three/fiber/dist/declarations/src/core/events").EventHandlers | "font" | "material" | "direction" | "fontSize" | "letterSpacing" | "lineHeight" | "maxWidth" | "outlineColor" | "outlineWidth" | "overflowWrap" | "textAlign" | "whiteSpace" | "fillOpacity" | "strokeOpacity" | "strokeWidth" | "geometry" | "morphTargetInfluences" | "morphTargetDictionary" | "isMesh" | "updateMorphTargets" | "anchorX" | "anchorY" | "characters" | "onSync" | "clipRect" | "depthOffset" | "outlineOffsetX" | "outlineOffsetY" | "outlineBlur" | "outlineOpacity" | "strokeColor" | "debugSDF"> & React.RefAttributes<unknown>>;

package/core/Text.js

@@ -10,6 +10,7 @@ const Text = /*#__PURE__*/React.forwardRef(({
   anchorY = 'middle',
   font,
   children,
+  characters,
   onSync,
   ...props
 }, ref) => {
@@ -31,8 +32,8 @@ const Text = /*#__PURE__*/React.forwardRef(({
   }, [children]);
   suspend(() => new Promise(res => preloadFont({
     font,
-    characters: text
-  }, res)), ['troika-text', font, text]);
+    characters
+  }, res)), ['troika-text', font, characters]);
   React.useLayoutEffect(() => void troikaMesh.sync(() => {
     invalidate();
     if (onSync) onSync(troikaMesh);

package/core/TrackballControls.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("@react-three/fiber"),r=require("react"),n=require("three-stdlib");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function a(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=o(e),c=a(r);const u=c.forwardRef((({makeDefault:e,camera:r,domElement:o,regress:a,onChange:u,onStart:i,onEnd:l,...d},f)=>{const{invalidate:v,camera:b,gl:m,events:p,set:E,get:g,performance:h,viewport:j}=t.useThree(),O=r||b,y=o||("boolean"!=typeof p.connected?p.connected:m.domElement),L=c.useMemo((()=>new n.TrackballControls(O)),[O]);return t.useFrame((()=>{L.enabled&&L.update()})),c.useEffect((()=>{const e=e=>{v(),a&&h.regress(),u&&u(e)};return L.connect(y),L.addEventListener("change",e),i&&L.addEventListener("start",i),l&&L.addEventListener("end",l),()=>{L.removeEventListener("change",e),i&&L.removeEventListener("start",i),l&&L.removeEventListener("end",l),L.dispose()}}),[y,u,i,l,a,L,v]),c.useEffect((()=>{L.handleResize()}),[j]),c.useEffect((()=>{if(e){const e=g().controls;return E({controls:L}),()=>E({controls:e})}}),[e,L]),c.createElement("primitive",s.default({ref:f,object:L},d))}));exports.TrackballControls=u;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("@react-three/fiber"),r=require("react"),n=require("three-stdlib");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function a(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=o(e),c=a(r);const u=c.forwardRef((({makeDefault:e,camera:r,domElement:o,regress:a,onChange:u,onStart:i,onEnd:f,...l},d)=>{const{invalidate:v,camera:m,gl:b,events:E,set:p,get:g,performance:h,viewport:j}=t.useThree(),O=r||m,L=o||E.connected||b.domElement,y=c.useMemo((()=>new n.TrackballControls(O)),[O]);return t.useFrame((()=>{y.enabled&&y.update()})),c.useEffect((()=>(y.connect(L),()=>{y.dispose()})),[L,a,y,v]),c.useEffect((()=>{const e=e=>{v(),a&&h.regress(),u&&u(e)};return y.addEventListener("change",e),i&&y.addEventListener("start",i),f&&y.addEventListener("end",f),()=>{i&&y.removeEventListener("start",i),f&&y.removeEventListener("end",f),y.removeEventListener("change",e)}}),[u,i,f]),c.useEffect((()=>{y.handleResize()}),[j]),c.useEffect((()=>{if(e){const e=g().controls;return p({controls:y}),()=>p({controls:e})}}),[e,y]),c.createElement("primitive",s.default({ref:d,object:y},l))}));exports.TrackballControls=u;

package/core/TrackballControls.js

@@ -24,11 +24,15 @@ const TrackballControls = /*#__PURE__*/React.forwardRef(({
     viewport
   } = useThree();
   const explCamera = camera || defaultCamera;
-  const explDomElement = domElement || (typeof events.connected !== 'boolean' ? events.connected : gl.domElement);
+  const explDomElement = domElement || events.connected || gl.domElement;
   const controls = React.useMemo(() => new TrackballControls$1(explCamera), [explCamera]);
   useFrame(() => {
     if (controls.enabled) controls.update();
   });
+  React.useEffect(() => {
+    controls.connect(explDomElement);
+    return () => void controls.dispose();
+  }, [explDomElement, regress, controls, invalidate]);
   React.useEffect(() => {
     const callback = e => {
       invalidate();
@@ -36,17 +40,15 @@ const TrackballControls = /*#__PURE__*/React.forwardRef(({
       if (onChange) onChange(e);
     };
 
-    controls.connect(explDomElement);
     controls.addEventListener('change', callback);
     if (onStart) controls.addEventListener('start', onStart);
     if (onEnd) controls.addEventListener('end', onEnd);
     return () => {
-      controls.removeEventListener('change', callback);
       if (onStart) controls.removeEventListener('start', onStart);
       if (onEnd) controls.removeEventListener('end', onEnd);
-      controls.dispose();
+      controls.removeEventListener('change', callback);
     };
-  }, [explDomElement, onChange, onStart, onEnd, regress, controls, invalidate]);
+  }, [onChange, onStart, onEnd]);
   React.useEffect(() => {
     controls.handleResize();
   }, [viewport]);

package/core/Trail.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@react-three/fiber"),t=require("react"),r=require("three"),n=require("meshline");function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var i=o(t);const s={width:.2,length:1,decay:1,local:!1,stride:0,interval:1},u=(e,t=1)=>(e.set(e.subarray(t)),e.fill(-1/0,-t),e);function c(t,n){const{length:o,local:c,decay:l,interval:a,stride:f}={...s,...n},d=i.useRef(),[h]=i.useState((()=>new r.Vector3));i.useLayoutEffect((()=>{t&&(d.current=Float32Array.from({length:10*o*3},((e,r)=>t.position.getComponent(r%3))))}),[o,t]);const p=i.useRef(new r.Vector3),y=i.useRef(0);return e.useFrame((()=>{if(t&&d.current){if(0===y.current){let e;c?e=t.position:(t.getWorldPosition(h),e=h);const r=1*l;for(let t=0;t<r;t++)e.distanceTo(p.current)<f||(u(d.current,3),d.current.set(e.toArray(),d.current.length-3));p.current.copy(e)}y.current++,y.current=y.current%a}})),d}const l=i.forwardRef(((t,o)=>{const{children:u}=t,{width:l,length:a,decay:f,local:d,stride:h,interval:p}={...s,...t},{color:y="hotpink",attenuation:g,target:m}=t,v=e.useThree((e=>e.size)),b=i.useRef(null),[w,M]=i.useState(null),j=c(w,{length:a,decay:f,local:d,stride:h,interval:p});i.useEffect((()=>{const e=(null==m?void 0:m.current)||b.current.children.find((e=>e instanceof r.Object3D));e&&M(e)}),[j,m]);const O=i.useMemo((()=>new n.MeshLine),[]),E=i.useMemo((()=>{var e;const t=new n.MeshLineMaterial({lineWidth:.1*l,color:y,sizeAttenuation:1,resolution:new r.Vector2(v.width,v.height)});let o;if(u)if(Array.isArray(u))o=u.find((e=>{const t=e;return"string"==typeof t.type&&"meshLineMaterial"===t.type}));else{const e=u;"string"==typeof e.type&&"meshLineMaterial"===e.type&&(o=e)}return"object"==typeof(null==(e=o)?void 0:e.props)&&t.setValues(o.props),t}),[l,y,v,u]);return i.useEffect((()=>{E.uniforms.resolution.value.set(v.width,v.height)}),[v]),e.useFrame((()=>{j.current&&O.setPoints(j.current,g)})),i.createElement("group",null,i.createElement("mesh",{ref:o,geometry:O,material:E}),i.createElement("group",{ref:b},u))}));exports.Trail=l,exports.useTrail=c;

package/core/Trail.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { ColorRepresentation, Object3D } from 'three';
+import { MeshLine as MeshLineImpl } from 'meshline';
+declare type Settings = {
+    width: number;
+    length: number;
+    decay: number;
+    local: boolean;
+    stride: number;
+    interval: number;
+};
+export declare function useTrail(target: Object3D, settings: Partial<Settings>): React.MutableRefObject<Float32Array | undefined>;
+export declare type MeshLine = THREE.Mesh & MeshLineImpl;
+export declare const Trail: React.ForwardRefExoticComponent<{
+    color?: ColorRepresentation | undefined;
+    attenuation?: ((width: number) => number) | undefined;
+    target?: React.MutableRefObject<Object3D<import("three").Event>> | undefined;
+} & Partial<Settings> & {
+    children?: React.ReactNode;
+} & React.RefAttributes<MeshLine>>;
+export {};

package/core/Trail.js

@@ -0,0 +1,160 @@
+import { useFrame, useThree } from '@react-three/fiber';
+import * as React from 'react';
+import { Vector3, Object3D, Vector2 } from 'three';
+import { MeshLine, MeshLineMaterial } from 'meshline';
+
+const defaults = {
+  width: 0.2,
+  length: 1,
+  decay: 1,
+  local: false,
+  stride: 0,
+  interval: 1
+};
+
+const shiftLeft = (collection, steps = 1) => {
+  collection.set(collection.subarray(steps));
+  collection.fill(-Infinity, -steps);
+  return collection;
+};
+
+function useTrail(target, settings) {
+  const {
+    length,
+    local,
+    decay,
+    interval,
+    stride
+  } = { ...defaults,
+    ...settings
+  };
+  const points = React.useRef();
+  const [worldPosition] = React.useState(() => new Vector3());
+  React.useLayoutEffect(() => {
+    if (target) {
+      points.current = Float32Array.from({
+        length: length * 10 * 3
+      }, (_, i) => target.position.getComponent(i % 3));
+    }
+  }, [length, target]);
+  const prevPosition = React.useRef(new Vector3());
+  const frameCount = React.useRef(0);
+  useFrame(() => {
+    if (!target) return;
+    if (!points.current) return;
+
+    if (frameCount.current === 0) {
+      let newPosition;
+
+      if (local) {
+        newPosition = target.position;
+      } else {
+        target.getWorldPosition(worldPosition);
+        newPosition = worldPosition;
+      }
+
+      const steps = 1 * decay;
+
+      for (let i = 0; i < steps; i++) {
+        if (newPosition.distanceTo(prevPosition.current) < stride) continue;
+        shiftLeft(points.current, 3);
+        points.current.set(newPosition.toArray(), points.current.length - 3);
+      }
+
+      prevPosition.current.copy(newPosition);
+    }
+
+    frameCount.current++;
+    frameCount.current = frameCount.current % interval;
+  });
+  return points;
+}
+const Trail = /*#__PURE__*/React.forwardRef((props, forwardRef) => {
+  const {
+    children
+  } = props;
+  const {
+    width,
+    length,
+    decay,
+    local,
+    stride,
+    interval
+  } = { ...defaults,
+    ...props
+  };
+  const {
+    color = 'hotpink',
+    attenuation,
+    target
+  } = props;
+  const size = useThree(s => s.size);
+  const ref = React.useRef(null);
+  const [anchor, setAnchor] = React.useState(null);
+  const points = useTrail(anchor, {
+    length,
+    decay,
+    local,
+    stride,
+    interval
+  });
+  React.useEffect(() => {
+    const t = (target == null ? void 0 : target.current) || ref.current.children.find(o => {
+      return o instanceof Object3D;
+    });
+
+    if (t) {
+      setAnchor(t);
+    }
+  }, [points, target]);
+  const geo = React.useMemo(() => new MeshLine(), []);
+  const mat = React.useMemo(() => {
+    var _matOverride;
+
+    const m = new MeshLineMaterial({
+      lineWidth: 0.1 * width,
+      color: color,
+      sizeAttenuation: 1,
+      resolution: new Vector2(size.width, size.height)
+    }); // Get and apply first <meshLineMaterial /> from children
+
+    let matOverride;
+
+    if (children) {
+      if (Array.isArray(children)) {
+        matOverride = children.find(child => {
+          const c = child;
+          return typeof c.type === 'string' && c.type === 'meshLineMaterial';
+        });
+      } else {
+        const c = children;
+
+        if (typeof c.type === 'string' && c.type === 'meshLineMaterial') {
+          matOverride = c;
+        }
+      }
+    }
+
+    if (typeof ((_matOverride = matOverride) == null ? void 0 : _matOverride.props) === 'object') {
+      m.setValues(matOverride.props);
+    }
+
+    return m;
+  }, [width, color, size, children]);
+  React.useEffect(() => {
+    mat.uniforms.resolution.value.set(size.width, size.height);
+  }, [size]);
+  useFrame(() => {
+    if (!points.current) return;
+    geo.setPoints(points.current, attenuation);
+  });
+  return /*#__PURE__*/React.createElement("group", null, /*#__PURE__*/React.createElement("mesh", {
+    ref: forwardRef,
+    geometry: geo,
+    material: mat
+  }), /*#__PURE__*/React.createElement("group", {
+    ref: ref
+  }, children));
+});
+
+export { Trail, useTrail };

package/core/TransformControls.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),n=require("@react-three/fiber"),t=require("lodash.omit"),r=require("lodash.pick"),o=require("react"),a=require("three"),l=require("three-stdlib");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var i=u(e),c=u(t),d=u(r),f=s(o),v=s(a);const m=f.forwardRef((({children:e,domElement:t,onChange:r,onMouseDown:o,onMouseUp:a,onObjectChange:u,object:s,...m},E)=>{const h=["enabled","axis","mode","translationSnap","rotationSnap","scaleSnap","space","size","showX","showY","showZ"],{camera:b,...g}=m,p=d.default(g,h),L=c.default(g,h),j=n.useThree((e=>e.controls)),O=n.useThree((({gl:e})=>e)),w=n.useThree((({camera:e})=>e)),q=n.useThree((({invalidate:e})=>e)),y=b||w,C=f.useMemo((()=>new l.TransformControls(y,t||O.domElement)),[y,t,O.domElement]),D=f.useRef();return f.useLayoutEffect((()=>(s?C.attach(s instanceof v.Object3D?s:s.current):D.current instanceof v.Object3D&&C.attach(D.current),()=>{C.detach()})),[s,e,C]),f.useEffect((()=>{if(j){const e=e=>j.enabled=!e.value;return C.addEventListener("dragging-changed",e),()=>C.removeEventListener("dragging-changed",e)}}),[C,j]),f.useEffect((()=>{const e=e=>{q(),r&&r(e)};return null==C||null==C.addEventListener||C.addEventListener("change",e),o&&(null==C||null==C.addEventListener||C.addEventListener("mouseDown",o)),a&&(null==C||null==C.addEventListener||C.addEventListener("mouseUp",a)),u&&(null==C||null==C.addEventListener||C.addEventListener("objectChange",u)),()=>{null==C||null==C.removeEventListener||C.removeEventListener("change",e),o&&(null==C||null==C.removeEventListener||C.removeEventListener("mouseDown",o)),a&&(null==C||null==C.removeEventListener||C.removeEventListener("mouseUp",a)),u&&(null==C||null==C.removeEventListener||C.removeEventListener("objectChange",u))}}),[r,o,a,u,C,q]),C?f.createElement(f.Fragment,null,f.createElement("primitive",i.default({ref:E,dispose:void 0,object:C},p)),f.createElement("group",i.default({ref:D},L),e)):null}));exports.TransformControls=m;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),n=require("@react-three/fiber"),t=require("lodash.omit"),r=require("lodash.pick"),o=require("react"),a=require("three"),u=require("three-stdlib");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var i=l(e),c=l(t),d=l(r),v=s(o),f=s(a);const m=v.forwardRef((({children:e,domElement:t,onChange:r,onMouseDown:o,onMouseUp:a,onObjectChange:l,object:s,...m},h)=>{const E=["enabled","axis","mode","translationSnap","rotationSnap","scaleSnap","space","size","showX","showY","showZ"],{camera:b,...g}=m,p=d.default(g,E),L=c.default(g,E),j=n.useThree((e=>e.controls)),O=n.useThree((e=>e.gl)),w=n.useThree((e=>e.events)),q=n.useThree((e=>e.camera)),T=n.useThree((e=>e.invalidate)),y=b||q,C=t||w.connected||O.domElement,D=v.useMemo((()=>new u.TransformControls(y,C)),[y,C]),M=v.useRef();return v.useLayoutEffect((()=>(s?D.attach(s instanceof f.Object3D?s:s.current):M.current instanceof f.Object3D&&D.attach(M.current),()=>{D.detach()})),[s,e,D]),v.useEffect((()=>{if(j){const e=e=>j.enabled=!e.value;return D.addEventListener("dragging-changed",e),()=>D.removeEventListener("dragging-changed",e)}}),[D,j]),v.useEffect((()=>{const e=e=>{T(),r&&r(e)};return null==D||null==D.addEventListener||D.addEventListener("change",e),o&&(null==D||null==D.addEventListener||D.addEventListener("mouseDown",o)),a&&(null==D||null==D.addEventListener||D.addEventListener("mouseUp",a)),l&&(null==D||null==D.addEventListener||D.addEventListener("objectChange",l)),()=>{null==D||null==D.removeEventListener||D.removeEventListener("change",e),o&&(null==D||null==D.removeEventListener||D.removeEventListener("mouseDown",o)),a&&(null==D||null==D.removeEventListener||D.removeEventListener("mouseUp",a)),l&&(null==D||null==D.removeEventListener||D.removeEventListener("objectChange",l))}}),[r,o,a,l,D,T]),D?v.createElement(v.Fragment,null,v.createElement("primitive",i.default({ref:h,dispose:void 0,object:D},p)),v.createElement("group",i.default({ref:M},L),e)):null}));exports.TransformControls=m;

package/core/TransformControls.js

@@ -25,17 +25,13 @@ const TransformControls = /*#__PURE__*/React.forwardRef(({
   const objectProps = omit(rest, transformOnlyPropNames); // @ts-expect-error new in @react-three/fiber@7.0.5
 
   const defaultControls = useThree(state => state.controls);
-  const gl = useThree(({
-    gl
-  }) => gl);
-  const defaultCamera = useThree(({
-    camera
-  }) => camera);
-  const invalidate = useThree(({
-    invalidate
-  }) => invalidate);
+  const gl = useThree(state => state.gl);
+  const events = useThree(state => state.events);
+  const defaultCamera = useThree(state => state.camera);
+  const invalidate = useThree(state => state.invalidate);
   const explCamera = camera || defaultCamera;
-  const controls = React.useMemo(() => new TransformControls$1(explCamera, domElement || gl.domElement), [explCamera, domElement, gl.domElement]);
+  const explDomElement = domElement || events.connected || gl.domElement;
+  const controls = React.useMemo(() => new TransformControls$1(explCamera, explDomElement), [explCamera, explDomElement]);
   const group = React.useRef();
   React.useLayoutEffect(() => {
     if (object) {
@@ -44,9 +40,7 @@ const TransformControls = /*#__PURE__*/React.forwardRef(({
       controls.attach(group.current);
     }
 
-    return () => {
-      controls.detach();
-    };
+    return () => void controls.detach();
   }, [object, children, controls]);
   React.useEffect(() => {
     if (defaultControls) {

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("./Line.cjs.js"),o=require("./PositionalAudio.cjs.js"),i=require("./Text.cjs.js"),u=require("./Effects.cjs.js"),a=require("./GradientTexture.cjs.js"),c=require("./Image.cjs.js"),j=require("./Edges.cjs.js"),n=require("./OrthographicCamera.cjs.js"),p=require("./PerspectiveCamera.cjs.js"),l=require("./CubeCamera.cjs.js"),x=require("./DeviceOrientationControls.cjs.js"),q=require("./FlyControls.cjs.js"),d=require("./MapControls.cjs.js"),C=require("./OrbitControls.cjs.js"),h=require("./TrackballControls.cjs.js"),m=require("./ArcballControls.cjs.js"),B=require("./TransformControls.cjs.js"),b=require("./PointerLockControls.cjs.js"),M=require("./FirstPersonControls.cjs.js"),P=require("./GizmoHelper.cjs.js"),S=require("./GizmoViewcube.cjs.js"),f=require("./GizmoViewport.cjs.js"),T=require("./useCubeTexture.cjs.js"),g=require("./useFBX.cjs.js"),v=require("./useGLTF.cjs.js"),L=require("./useProgress.cjs.js"),A=require("./useTexture.cjs.js"),G=require("./useKTX2.cjs.js"),k=require("./Stats.cjs.js"),D=require("./useDepthBuffer.cjs.js"),F=require("./useAspect.cjs.js"),w=require("./useCamera.cjs.js"),z=require("./useDetectGPU.cjs.js"),I=require("./useHelper.cjs.js"),O=require("./useBVH.cjs.js"),E=require("./useContextBridge.cjs.js"),R=require("./useAnimations.cjs.js"),y=require("./useFBO.cjs.js"),H=require("./useIntersect.cjs.js"),V=require("./CurveModifier.cjs.js"),Q=require("./MeshDistortMaterial.cjs.js"),X=require("./MeshWobbleMaterial.cjs.js"),K=require("./MeshReflectorMaterial.cjs.js"),W=require("./PointMaterial.cjs.js"),N=require("./shaderMaterial.cjs.js"),U=require("./softShadows.cjs.js"),_=require("./shapes.cjs.js"),J=require("./RoundedBox.cjs.js"),Y=require("./ScreenQuad.cjs.js"),Z=require("./Center.cjs.js"),$=require("./Bounds.cjs.js"),ee=require("./CameraShake.cjs.js"),re=require("./Float.cjs.js"),se=require("./Stage.cjs.js"),te=require("./Backdrop.cjs.js"),oe=require("./Shadow.cjs.js"),ie=require("./ContactShadows.cjs.js"),ue=require("./Reflector.cjs.js"),ae=require("./SpotLight.cjs.js"),ce=require("./Environment.cjs.js"),je=require("./Sky.cjs.js"),ne=require("./Stars.cjs.js"),pe=require("./Cloud.cjs.js"),le=require("./useMatcapTexture.cjs.js"),xe=require("./useNormalTexture.cjs.js"),qe=require("./Points.cjs.js"),de=require("./Instances.cjs.js"),Ce=require("./Segments.cjs.js"),he=require("./Detailed.cjs.js"),me=require("./Preload.cjs.js"),Be=require("./BakeShadows.cjs.js"),be=require("./meshBounds.cjs.js"),Me=require("./AdaptiveDpr.cjs.js"),Pe=require("./AdaptiveEvents.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("lodash.omit"),require("lodash.pick"),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.Line=t.Line,exports.PositionalAudio=o.PositionalAudio,exports.Text=i.Text,exports.Effects=u.Effects,exports.isWebGL2Available=u.isWebGL2Available,exports.GradientTexture=a.GradientTexture,exports.Image=c.Image,exports.Edges=j.Edges,exports.OrthographicCamera=n.OrthographicCamera,exports.PerspectiveCamera=p.PerspectiveCamera,exports.CubeCamera=l.CubeCamera,exports.DeviceOrientationControls=x.DeviceOrientationControls,exports.FlyControls=q.FlyControls,exports.MapControls=d.MapControls,exports.OrbitControls=C.OrbitControls,exports.TrackballControls=h.TrackballControls,exports.ArcballControls=m.ArcballControls,exports.TransformControls=B.TransformControls,exports.PointerLockControls=b.PointerLockControls,exports.FirstPersonControls=M.FirstPersonControls,exports.GizmoHelper=P.GizmoHelper,exports.useGizmoContext=P.useGizmoContext,exports.GizmoViewcube=S.GizmoViewcube,exports.GizmoViewport=f.GizmoViewport,exports.useCubeTexture=T.useCubeTexture,exports.useFBX=g.useFBX,exports.useGLTF=v.useGLTF,exports.useProgress=L.useProgress,exports.IsObject=A.IsObject,exports.useTexture=A.useTexture,exports.useKTX2=G.useKTX2,exports.Stats=k.Stats,exports.useDepthBuffer=D.useDepthBuffer,exports.useAspect=F.useAspect,exports.useCamera=w.useCamera,exports.useDetectGPU=z.useDetectGPU,exports.useHelper=I.useHelper,exports.useBVH=O.useBVH,exports.useContextBridge=E.useContextBridge,exports.useAnimations=R.useAnimations,exports.useFBO=y.useFBO,exports.useIntersect=H.useIntersect,exports.CurveModifier=V.CurveModifier,exports.MeshDistortMaterial=Q.MeshDistortMaterial,exports.MeshWobbleMaterial=X.MeshWobbleMaterial,exports.MeshReflectorMaterial=K.MeshReflectorMaterial,exports.PointMaterial=W.PointMaterial,exports.PointMaterialImpl=W.PointMaterialImpl,exports.shaderMaterial=N.shaderMaterial,exports.softShadows=U.softShadows,exports.Box=_.Box,exports.Circle=_.Circle,exports.Cone=_.Cone,exports.Cylinder=_.Cylinder,exports.Dodecahedron=_.Dodecahedron,exports.Extrude=_.Extrude,exports.Icosahedron=_.Icosahedron,exports.Lathe=_.Lathe,exports.Octahedron=_.Octahedron,exports.Plane=_.Plane,exports.Polyhedron=_.Polyhedron,exports.Ring=_.Ring,exports.Sphere=_.Sphere,exports.Tetrahedron=_.Tetrahedron,exports.Torus=_.Torus,exports.TorusKnot=_.TorusKnot,exports.Tube=_.Tube,exports.RoundedBox=J.RoundedBox,exports.ScreenQuad=Y.ScreenQuad,exports.Center=Z.Center,exports.Bounds=$.Bounds,exports.useBounds=$.useBounds,exports.CameraShake=ee.CameraShake,exports.Float=re.Float,exports.Stage=se.Stage,exports.Backdrop=te.Backdrop,exports.Shadow=oe.Shadow,exports.ContactShadows=ie.ContactShadows,exports.Reflector=ue.Reflector,exports.SpotLight=ae.SpotLight,exports.Environment=ce.Environment,exports.Sky=je.Sky,exports.calcPosFromAngles=je.calcPosFromAngles,exports.Stars=ne.Stars,exports.Cloud=pe.Cloud,exports.useMatcapTexture=le.useMatcapTexture,exports.useNormalTexture=xe.useNormalTexture,exports.Point=qe.Point,exports.Points=qe.Points,exports.PointsBuffer=qe.PointsBuffer,exports.Instance=de.Instance,exports.Instances=de.Instances,exports.Merged=de.Merged,exports.Segment=Ce.Segment,exports.Segments=Ce.Segments,exports.Detailed=he.Detailed,exports.Preload=me.Preload,exports.BakeShadows=Be.BakeShadows,exports.meshBounds=be.meshBounds,exports.AdaptiveDpr=Me.AdaptiveDpr,exports.AdaptiveEvents=Pe.AdaptiveEvents;
+"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("./Line.cjs.js"),o=require("./PositionalAudio.cjs.js"),i=require("./Text.cjs.js"),u=require("./Effects.cjs.js"),a=require("./GradientTexture.cjs.js"),n=require("./Image.cjs.js"),j=require("./Edges.cjs.js"),c=require("./Trail.cjs.js"),p=require("./Sampler.cjs.js"),l=require("./ComputedAttribute.cjs.js"),x=require("./Clone.cjs.js"),q=require("./OrthographicCamera.cjs.js"),d=require("./PerspectiveCamera.cjs.js"),C=require("./CubeCamera.cjs.js"),m=require("./DeviceOrientationControls.cjs.js"),h=require("./FlyControls.cjs.js"),b=require("./MapControls.cjs.js"),B=require("./OrbitControls.cjs.js"),P=require("./TrackballControls.cjs.js"),S=require("./ArcballControls.cjs.js"),M=require("./TransformControls.cjs.js"),T=require("./PointerLockControls.cjs.js"),f=require("./FirstPersonControls.cjs.js"),g=require("./GizmoHelper.cjs.js"),v=require("./GizmoViewcube.cjs.js"),L=require("./GizmoViewport.cjs.js"),A=require("./useCubeTexture.cjs.js"),E=require("./useFBX.cjs.js"),G=require("./useGLTF.cjs.js"),k=require("./useProgress.cjs.js"),D=require("./useTexture.cjs.js"),F=require("./useKTX2.cjs.js"),w=require("./Stats.cjs.js"),z=require("./useDepthBuffer.cjs.js"),I=require("./useAspect.cjs.js"),O=require("./useCamera.cjs.js"),R=require("./useDetectGPU.cjs.js"),y=require("./useHelper.cjs.js"),H=require("./useBVH.cjs.js"),V=require("./useContextBridge.cjs.js"),Q=require("./useAnimations.cjs.js"),X=require("./useFBO.cjs.js"),K=require("./useIntersect.cjs.js"),W=require("./useBoxProjectedEnv.cjs.js"),N=require("./CurveModifier.cjs.js"),U=require("./MeshDistortMaterial.cjs.js"),_=require("./MeshWobbleMaterial.cjs.js"),J=require("./MeshReflectorMaterial.cjs.js"),Y=require("./PointMaterial.cjs.js"),Z=require("./shaderMaterial.cjs.js"),$=require("./softShadows.cjs.js"),ee=require("./shapes.cjs.js"),re=require("./RoundedBox.cjs.js"),se=require("./ScreenQuad.cjs.js"),te=require("./Center.cjs.js"),oe=require("./Bounds.cjs.js"),ie=require("./CameraShake.cjs.js"),ue=require("./Float.cjs.js"),ae=require("./Stage.cjs.js"),ne=require("./Backdrop.cjs.js"),je=require("./Shadow.cjs.js"),ce=require("./ContactShadows.cjs.js"),pe=require("./Reflector.cjs.js"),le=require("./SpotLight.cjs.js"),xe=require("./Environment.cjs.js"),qe=require("./Lightformer.cjs.js"),de=require("./Sky.cjs.js"),Ce=require("./Stars.cjs.js"),me=require("./Cloud.cjs.js"),he=require("./useMatcapTexture.cjs.js"),be=require("./useNormalTexture.cjs.js"),Be=require("./Points.cjs.js"),Pe=require("./Instances.cjs.js"),Se=require("./Segments.cjs.js"),Me=require("./Detailed.cjs.js"),Te=require("./Preload.cjs.js"),fe=require("./BakeShadows.cjs.js"),ge=require("./meshBounds.cjs.js"),ve=require("./AdaptiveDpr.cjs.js"),Le=require("./AdaptiveEvents.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.Line=t.Line,exports.PositionalAudio=o.PositionalAudio,exports.Text=i.Text,exports.Effects=u.Effects,exports.isWebGL2Available=u.isWebGL2Available,exports.GradientTexture=a.GradientTexture,exports.Image=n.Image,exports.Edges=j.Edges,exports.Trail=c.Trail,exports.useTrail=c.useTrail,exports.Sampler=p.Sampler,exports.ComputedAttribute=l.ComputedAttribute,exports.Clone=x.Clone,exports.OrthographicCamera=q.OrthographicCamera,exports.PerspectiveCamera=d.PerspectiveCamera,exports.CubeCamera=C.CubeCamera,exports.DeviceOrientationControls=m.DeviceOrientationControls,exports.FlyControls=h.FlyControls,exports.MapControls=b.MapControls,exports.OrbitControls=B.OrbitControls,exports.TrackballControls=P.TrackballControls,exports.ArcballControls=S.ArcballControls,exports.TransformControls=M.TransformControls,exports.PointerLockControls=T.PointerLockControls,exports.FirstPersonControls=f.FirstPersonControls,exports.GizmoHelper=g.GizmoHelper,exports.useGizmoContext=g.useGizmoContext,exports.GizmoViewcube=v.GizmoViewcube,exports.GizmoViewport=L.GizmoViewport,exports.useCubeTexture=A.useCubeTexture,exports.useFBX=E.useFBX,exports.useGLTF=G.useGLTF,exports.useProgress=k.useProgress,exports.IsObject=D.IsObject,exports.useTexture=D.useTexture,exports.useKTX2=F.useKTX2,exports.Stats=w.Stats,exports.useDepthBuffer=z.useDepthBuffer,exports.useAspect=I.useAspect,exports.useCamera=O.useCamera,exports.useDetectGPU=R.useDetectGPU,exports.useHelper=y.useHelper,exports.useBVH=H.useBVH,exports.useContextBridge=V.useContextBridge,exports.useAnimations=Q.useAnimations,exports.useFBO=X.useFBO,exports.useIntersect=K.useIntersect,exports.useBoxProjectedEnv=W.useBoxProjectedEnv,exports.CurveModifier=N.CurveModifier,exports.MeshDistortMaterial=U.MeshDistortMaterial,exports.MeshWobbleMaterial=_.MeshWobbleMaterial,exports.MeshReflectorMaterial=J.MeshReflectorMaterial,exports.PointMaterial=Y.PointMaterial,exports.PointMaterialImpl=Y.PointMaterialImpl,exports.shaderMaterial=Z.shaderMaterial,exports.softShadows=$.softShadows,exports.Box=ee.Box,exports.Circle=ee.Circle,exports.Cone=ee.Cone,exports.Cylinder=ee.Cylinder,exports.Dodecahedron=ee.Dodecahedron,exports.Extrude=ee.Extrude,exports.Icosahedron=ee.Icosahedron,exports.Lathe=ee.Lathe,exports.Octahedron=ee.Octahedron,exports.Plane=ee.Plane,exports.Polyhedron=ee.Polyhedron,exports.Ring=ee.Ring,exports.Sphere=ee.Sphere,exports.Tetrahedron=ee.Tetrahedron,exports.Torus=ee.Torus,exports.TorusKnot=ee.TorusKnot,exports.Tube=ee.Tube,exports.RoundedBox=re.RoundedBox,exports.ScreenQuad=se.ScreenQuad,exports.Center=te.Center,exports.Bounds=oe.Bounds,exports.useBounds=oe.useBounds,exports.CameraShake=ie.CameraShake,exports.Float=ue.Float,exports.Stage=ae.Stage,exports.Backdrop=ne.Backdrop,exports.Shadow=je.Shadow,exports.ContactShadows=ce.ContactShadows,exports.Reflector=pe.Reflector,exports.SpotLight=le.SpotLight,exports.Environment=xe.Environment,exports.EnvironmentCube=xe.EnvironmentCube,exports.EnvironmentMap=xe.EnvironmentMap,exports.EnvironmentPortal=xe.EnvironmentPortal,exports.Lightformer=qe.Lightformer,exports.Sky=de.Sky,exports.calcPosFromAngles=de.calcPosFromAngles,exports.Stars=Ce.Stars,exports.Cloud=me.Cloud,exports.useMatcapTexture=he.useMatcapTexture,exports.useNormalTexture=be.useNormalTexture,exports.Point=Be.Point,exports.Points=Be.Points,exports.PointsBuffer=Be.PointsBuffer,exports.Instance=Pe.Instance,exports.Instances=Pe.Instances,exports.Merged=Pe.Merged,exports.Segment=Se.Segment,exports.Segments=Se.Segments,exports.Detailed=Me.Detailed,exports.Preload=Te.Preload,exports.BakeShadows=fe.BakeShadows,exports.meshBounds=ge.meshBounds,exports.AdaptiveDpr=ve.AdaptiveDpr,exports.AdaptiveEvents=Le.AdaptiveEvents;

package/core/index.d.ts

@@ -8,6 +8,10 @@ export * from './Effects';
 export * from './GradientTexture';
 export * from './Image';
 export * from './Edges';
+export * from './Trail';
+export * from './Sampler';
+export * from './ComputedAttribute';
+export * from './Clone';
 export * from './OrthographicCamera';
 export * from './PerspectiveCamera';
 export * from './CubeCamera';
@@ -40,6 +44,7 @@ export * from './useContextBridge';
 export * from './useAnimations';
 export * from './useFBO';
 export * from './useIntersect';
+export * from './useBoxProjectedEnv';
 export * from './CurveModifier';
 export * from './MeshDistortMaterial';
 export * from './MeshWobbleMaterial';
@@ -61,6 +66,7 @@ export * from './ContactShadows';
 export * from './Reflector';
 export * from './SpotLight';
 export * from './Environment';
+export * from './Lightformer';
 export * from './Sky';
 export * from './Stars';
 export * from './Cloud';

package/core/index.js

@@ -8,6 +8,10 @@ export { Effects, isWebGL2Available } from './Effects.js';
 export { GradientTexture } from './GradientTexture.js';
 export { Image } from './Image.js';
 export { Edges } from './Edges.js';
+export { Trail, useTrail } from './Trail.js';
+export { Sampler } from './Sampler.js';
+export { ComputedAttribute } from './ComputedAttribute.js';
+export { Clone } from './Clone.js';
 export { OrthographicCamera } from './OrthographicCamera.js';
 export { PerspectiveCamera } from './PerspectiveCamera.js';
 export { CubeCamera } from './CubeCamera.js';
@@ -40,6 +44,7 @@ export { useContextBridge } from './useContextBridge.js';
 export { useAnimations } from './useAnimations.js';
 export { useFBO } from './useFBO.js';
 export { useIntersect } from './useIntersect.js';
+export { useBoxProjectedEnv } from './useBoxProjectedEnv.js';
 export { CurveModifier } from './CurveModifier.js';
 export { MeshDistortMaterial } from './MeshDistortMaterial.js';
 export { MeshWobbleMaterial } from './MeshWobbleMaterial.js';
@@ -60,7 +65,8 @@ export { Shadow } from './Shadow.js';
 export { ContactShadows } from './ContactShadows.js';
 export { Reflector } from './Reflector.js';
 export { SpotLight } from './SpotLight.js';
-export { Environment } from './Environment.js';
+export { Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal } from './Environment.js';
+export { Lightformer } from './Lightformer.js';
 export { Sky, calcPosFromAngles } from './Sky.js';
 export { Stars } from './Stars.js';
 export { Cloud } from './Cloud.js';
@@ -83,8 +89,9 @@ import 'three';
 import 'three-stdlib';
 import 'troika-three-text';
 import 'suspend-react';
-import 'lodash.omit';
+import 'meshline';
 import 'lodash.pick';
+import 'lodash.omit';
 import 'zustand';
 import 'stats.js';
 import '../helpers/useEffectfulState.js';

package/core/useBoxProjectedEnv.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three"),r=require("react"),n=require("@react-three/fiber");function i(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var i=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,i.get?i:{enumerable:!0,get:function(){return e[n]}})}})),r.default=e,Object.freeze(r)}var o=i(e),t=i(r);exports.useBoxProjectedEnv=function(e=new o.Vector3,r=new o.Vector3){const[i]=t.useState((()=>({position:new o.Vector3,size:new o.Vector3})));n.applyProps(i,{position:e,size:r});const a=t.useRef(null),c=t.useMemo((()=>({ref:a,onBeforeCompile:e=>function(e,r,n){e.defines.BOX_PROJECTED_ENV_MAP=!0,e.uniforms.envMapPosition={value:r},e.uniforms.envMapSize={value:n},e.vertexShader=`\n  varying vec3 vWorldPosition;\n  ${e.vertexShader.replace("#include <worldpos_vertex>","\n#if defined( USE_ENVMAP ) || defined( DISTANCE ) || defined ( USE_SHADOWMAP )\n  vec4 worldPosition = modelMatrix * vec4( transformed, 1.0 );\n  #ifdef BOX_PROJECTED_ENV_MAP\n    vWorldPosition = worldPosition.xyz;\n  #endif\n#endif\n")}`,e.fragmentShader=`\n    \n#ifdef BOX_PROJECTED_ENV_MAP\n  uniform vec3 envMapSize;\n  uniform vec3 envMapPosition;\n  varying vec3 vWorldPosition;\n    \n  vec3 parallaxCorrectNormal( vec3 v, vec3 cubeSize, vec3 cubePos ) {\n    vec3 nDir = normalize( v );\n    vec3 rbmax = ( .5 * cubeSize + cubePos - vWorldPosition ) / nDir;\n    vec3 rbmin = ( -.5 * cubeSize + cubePos - vWorldPosition ) / nDir;\n    vec3 rbminmax;\n    rbminmax.x = ( nDir.x > 0. ) ? rbmax.x : rbmin.x;\n    rbminmax.y = ( nDir.y > 0. ) ? rbmax.y : rbmin.y;\n    rbminmax.z = ( nDir.z > 0. ) ? rbmax.z : rbmin.z;\n    float correction = min( min( rbminmax.x, rbminmax.y ), rbminmax.z );\n    vec3 boxIntersection = vWorldPosition + nDir * correction;    \n    return boxIntersection - cubePos;\n  }\n#endif\n\n    ${e.fragmentShader.replace("#include <envmap_physical_pars_fragment>",o.ShaderChunk.envmap_physical_pars_fragment).replace("vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );","vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );\n         \n#ifdef BOX_PROJECTED_ENV_MAP\n  worldNormal = parallaxCorrectNormal( worldNormal, envMapSize, envMapPosition );\n#endif\n\n         ").replace("reflectVec = inverseTransformDirection( reflectVec, viewMatrix );","reflectVec = inverseTransformDirection( reflectVec, viewMatrix );\n         \n#ifdef BOX_PROJECTED_ENV_MAP\n  reflectVec = parallaxCorrectNormal( reflectVec, envMapSize, envMapPosition );\n#endif\n\n        ")}`}(e,i.position,i.size),customProgramCacheKey:()=>JSON.stringify(i.position.toArray())+JSON.stringify(i.size.toArray())})),[...i.position.toArray(),...i.size.toArray()]);return t.useLayoutEffect((()=>{a.current.needsUpdate=!0}),[i]),c};

package/core/useBoxProjectedEnv.d.ts

@@ -0,0 +1,8 @@
+import * as THREE from 'three';
+import * as React from 'react';
+import { ReactThreeFiber } from '@react-three/fiber';
+export declare function useBoxProjectedEnv(position?: ReactThreeFiber.Vector3, size?: ReactThreeFiber.Vector3): {
+    ref: React.MutableRefObject<THREE.Material>;
+    onBeforeCompile: (shader: THREE.Shader) => void;
+    customProgramCacheKey: () => string;
+};

package/core/useBoxProjectedEnv.js

@@ -0,0 +1,98 @@
+import * as THREE from 'three';
+import * as React from 'react';
+import { applyProps } from '@react-three/fiber';
+
+// and @0beqz https://gist.github.com/0beqz/8d51b4ae16d68021a09fb504af708fca
+
+const worldposReplace =
+/* glsl */
+`
+#if defined( USE_ENVMAP ) || defined( DISTANCE ) || defined ( USE_SHADOWMAP )
+  vec4 worldPosition = modelMatrix * vec4( transformed, 1.0 );
+  #ifdef BOX_PROJECTED_ENV_MAP
+    vWorldPosition = worldPosition.xyz;
+  #endif
+#endif
+`;
+const boxProjectDefinitions =
+/*glsl */
+`
+#ifdef BOX_PROJECTED_ENV_MAP
+  uniform vec3 envMapSize;
+  uniform vec3 envMapPosition;
+  varying vec3 vWorldPosition;
+    
+  vec3 parallaxCorrectNormal( vec3 v, vec3 cubeSize, vec3 cubePos ) {
+    vec3 nDir = normalize( v );
+    vec3 rbmax = ( .5 * cubeSize + cubePos - vWorldPosition ) / nDir;
+    vec3 rbmin = ( -.5 * cubeSize + cubePos - vWorldPosition ) / nDir;
+    vec3 rbminmax;
+    rbminmax.x = ( nDir.x > 0. ) ? rbmax.x : rbmin.x;
+    rbminmax.y = ( nDir.y > 0. ) ? rbmax.y : rbmin.y;
+    rbminmax.z = ( nDir.z > 0. ) ? rbmax.z : rbmin.z;
+    float correction = min( min( rbminmax.x, rbminmax.y ), rbminmax.z );
+    vec3 boxIntersection = vWorldPosition + nDir * correction;    
+    return boxIntersection - cubePos;
+  }
+#endif
+`; // will be inserted after "vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );"
+
+const getIBLIrradiance_patch =
+/* glsl */
+`
+#ifdef BOX_PROJECTED_ENV_MAP
+  worldNormal = parallaxCorrectNormal( worldNormal, envMapSize, envMapPosition );
+#endif
+`; // will be inserted after "reflectVec = inverseTransformDirection( reflectVec, viewMatrix );"
+
+const getIBLRadiance_patch =
+/* glsl */
+`
+#ifdef BOX_PROJECTED_ENV_MAP
+  reflectVec = parallaxCorrectNormal( reflectVec, envMapSize, envMapPosition );
+#endif
+`;
+
+function boxProjectedEnvMap(shader, envMapPosition, envMapSize) {
+  shader.defines.BOX_PROJECTED_ENV_MAP = true; // uniforms
+
+  shader.uniforms.envMapPosition = {
+    value: envMapPosition
+  };
+  shader.uniforms.envMapSize = {
+    value: envMapSize
+  }; // vertex shader
+
+  shader.vertexShader = `
+  varying vec3 vWorldPosition;
+  ${shader.vertexShader.replace('#include <worldpos_vertex>', worldposReplace)}`; // fragment shader
+
+  shader.fragmentShader = `
+    ${boxProjectDefinitions}
+    ${shader.fragmentShader.replace('#include <envmap_physical_pars_fragment>', THREE.ShaderChunk.envmap_physical_pars_fragment).replace('vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );', `vec3 worldNormal = inverseTransformDirection( normal, viewMatrix );
+         ${getIBLIrradiance_patch}
+         `).replace('reflectVec = inverseTransformDirection( reflectVec, viewMatrix );', `reflectVec = inverseTransformDirection( reflectVec, viewMatrix );
+         ${getIBLRadiance_patch}
+        `)}`;
+}
+
+function useBoxProjectedEnv(position = new THREE.Vector3(), size = new THREE.Vector3()) {
+  const [config] = React.useState(() => ({
+    position: new THREE.Vector3(),
+    size: new THREE.Vector3()
+  }));
+  applyProps(config, {
+    position,
+    size
+  });
+  const ref = React.useRef(null);
+  const spread = React.useMemo(() => ({
+    ref,
+    onBeforeCompile: shader => boxProjectedEnvMap(shader, config.position, config.size),
+    customProgramCacheKey: () => JSON.stringify(config.position.toArray()) + JSON.stringify(config.size.toArray())
+  }), [...config.position.toArray(), ...config.size.toArray()]);
+  React.useLayoutEffect(() => void (ref.current.needsUpdate = true), [config]);
+  return spread;
+}
+
+export { useBoxProjectedEnv };

package/core/useFBO.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("three"),r=require("@react-three/fiber");function u(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var u=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,u.get?u:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=u(t);exports.useFBO=function(t,u,i){const n=r.useThree((({gl:e})=>e)),o=r.useThree((({size:e})=>e)),a=e.useMemo((()=>n.getPixelRatio()),[n]),c="number"==typeof t?t:o.width*a,f="number"==typeof u?u:o.height*a,l=("number"==typeof t?i:t)||{},b=e.useMemo((()=>{const{multisample:e,samples:t,...r}=l;let u;return e&&n.capabilities.isWebGL2?(u=new s.WebGLMultisampleRenderTarget(c,f,r),t&&(u.samples=t)):u=new s.WebGLRenderTarget(c,f,r),u}),[]);return e.useEffect((()=>{b.setSize(c,f)}),[b,c,f]),e.useEffect((()=>()=>b.dispose()),[]),b};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("three"),r=require("@react-three/fiber");function u(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var u=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,u.get?u:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var n=u(e),i=u(t);exports.useFBO=function(e,t,u){const{gl:o,size:s}=r.useThree(),a=n.useMemo((()=>o.getPixelRatio()),[o]),c="number"==typeof e?e:s.width*a,f="number"==typeof t?t:s.height*a,l=("number"==typeof e?u:e)||{},{samples:p,...b}=l,d=n.useMemo((()=>{let e;return e=new i.WebGLRenderTarget(c,f,{minFilter:i.LinearFilter,magFilter:i.LinearFilter,encoding:o.outputEncoding,type:i.HalfFloatType,...b}),e.samples=p,e}),[]);return n.useLayoutEffect((()=>{d.setSize(c,f),p&&(d.samples=p)}),[p,d,c,f]),n.useEffect((()=>()=>d.dispose()),[]),d};

package/core/useFBO.d.ts

@@ -3,5 +3,5 @@ declare type FBOSettings<T extends boolean = false> = {
     multisample?: T;
     samples?: number;
 } & THREE.WebGLRenderTargetOptions;
-export declare function useFBO<T extends boolean = false>(width?: number | FBOSettings<T>, height?: number, settings?: FBOSettings<T>): T extends true ? THREE.WebGLRenderTarget | THREE.WebGLMultisampleRenderTarget : THREE.WebGLRenderTarget;
+export declare function useFBO<T extends boolean = false>(width?: number | FBOSettings<T>, height?: number, settings?: FBOSettings<T>): THREE.WebGLRenderTarget;
 export {};