@react-three/drei 8.18.9 → 9.0.0-beta.2

package/core/Lightformer.js

@@ -1,51 +0,0 @@
-import _extends from '@babel/runtime/helpers/esm/extends';
-import { applyProps } from '@react-three/fiber';
-import * as React from 'react';
-import * as THREE from 'three';
-import mergeRefs from 'react-merge-refs';
-
-const Lightformer = /*#__PURE__*/React.forwardRef(({
-  args,
-  map,
-  toneMapped = false,
-  color = 'white',
-  form: Form = 'rect',
-  intensity = 1,
-  scale = 1,
-  target,
-  children,
-  ...props
-}, forwardRef) => {
-  // Apply emissive power
-  const ref = React.useRef(null);
-  React.useLayoutEffect(() => {
-    if (!children && !props.material) {
-      applyProps(ref.current.material, {
-        color
-      });
-      ref.current.material.color.multiplyScalar(intensity);
-    }
-  }, [color, intensity, children, props.material]); // Target light
-
-  React.useLayoutEffect(() => {
-    if (target) ref.current.lookAt(Array.isArray(target) ? new THREE.Vector3(...target) : target);
-  }, [target]); // Fix 2-dimensional scale
-
-  scale = Array.isArray(scale) && scale.length === 2 ? [scale[0], scale[1], 1] : scale;
-  return /*#__PURE__*/React.createElement("mesh", _extends({
-    ref: mergeRefs([ref, forwardRef]),
-    scale: scale
-  }, props), Form === 'circle' ? /*#__PURE__*/React.createElement("ringGeometry", {
-    args: [0, 1, 64]
-  }) : Form === 'ring' ? /*#__PURE__*/React.createElement("ringGeometry", {
-    args: [0.5, 1, 64]
-  }) : Form === 'rect' ? /*#__PURE__*/React.createElement("planeGeometry", null) : /*#__PURE__*/React.createElement(Form, {
-    args: args
-  }), children ? children : !props.material ? /*#__PURE__*/React.createElement("meshBasicMaterial", {
-    toneMapped: toneMapped,
-    map: map,
-    side: THREE.DoubleSide
-  }) : null);
-});
-
-export { Lightformer };

package/core/Trail.cjs.js

@@ -1 +0,0 @@
-"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

@@ -1,20 +0,0 @@
-import * as React from 'react';
-import { ColorRepresentation, Object3D } from 'three';
-import { MeshLine } 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 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

@@ -1,160 +0,0 @@
-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/useBoxProjectedEnv.cjs.js

@@ -1 +0,0 @@
-"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

@@ -1,8 +0,0 @@
-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

@@ -1,98 +0,0 @@
-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 };