@ohos-ports/react-three-drei 10.7.7-beta.0

package/core/CameraControls.js

@@ -0,0 +1,151 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import { Box3, MathUtils, Matrix4, Quaternion, Raycaster, Sphere, Spherical, Vector2, Vector3, Vector4 } from 'three';
+import * as React from 'react';
+import { forwardRef, useMemo, useEffect } from 'react';
+import { extend, useThree, useFrame } from '@react-three/fiber';
+import CameraControlsImpl from 'camera-controls';
+export { default as CameraControlsImpl } from 'camera-controls';
+
+const CameraControls = /* @__PURE__ */forwardRef((props, ref) => {
+  const {
+    impl: SubclassImpl,
+    camera,
+    domElement,
+    makeDefault,
+    onControlStart,
+    onControl,
+    onControlEnd,
+    onTransitionStart,
+    onUpdate,
+    onWake,
+    onRest,
+    onSleep,
+    onStart,
+    onEnd,
+    onChange,
+    regress,
+    ...restProps
+  } = props;
+  const Impl = SubclassImpl !== null && SubclassImpl !== void 0 ? SubclassImpl : CameraControlsImpl;
+
+  // useMemo is used here instead of useEffect, otherwise the useMemo below runs first and throws
+  useMemo(() => {
+    // to allow for tree shaking, we only import the subset of THREE that is used by camera-controls
+    // see https://github.com/yomotsu/camera-controls#important
+    const subsetOfTHREE = {
+      Box3,
+      MathUtils: {
+        clamp: MathUtils.clamp
+      },
+      Matrix4,
+      Quaternion,
+      Raycaster,
+      Sphere,
+      Spherical,
+      Vector2,
+      Vector3,
+      Vector4
+    };
+    Impl.install({
+      THREE: subsetOfTHREE
+    });
+    extend({
+      CameraControlsImpl: Impl
+    });
+  }, [Impl]);
+  const defaultCamera = useThree(state => state.camera);
+  const gl = useThree(state => state.gl);
+  const invalidate = useThree(state => state.invalidate);
+  const events = useThree(state => state.events);
+  const setEvents = useThree(state => state.setEvents);
+  const set = useThree(state => state.set);
+  const get = useThree(state => state.get);
+  const performance = useThree(state => state.performance);
+  const explCamera = camera || defaultCamera;
+  const explDomElement = domElement || events.connected || gl.domElement;
+  const controls = useMemo(() => new Impl(explCamera), [Impl, explCamera]);
+  useFrame((state, delta) => {
+    controls.update(delta);
+  }, -1);
+  useEffect(() => {
+    controls.connect(explDomElement);
+    return () => void controls.disconnect();
+  }, [explDomElement, controls]);
+  useEffect(() => {
+    function invalidateAndRegress() {
+      invalidate();
+      if (regress) performance.regress();
+    }
+    const handleControlStart = e => {
+      invalidateAndRegress();
+      onControlStart == null || onControlStart(e);
+      onStart == null || onStart(e); // backwards compatibility
+    };
+    const handleControl = e => {
+      invalidateAndRegress();
+      onControl == null || onControl(e);
+      onChange == null || onChange(e); // backwards compatibility
+    };
+    const handleControlEnd = e => {
+      onControlEnd == null || onControlEnd(e);
+      onEnd == null || onEnd(e); // backwards compatibility
+    };
+    const handleTransitionStart = e => {
+      invalidateAndRegress();
+      onTransitionStart == null || onTransitionStart(e);
+      onChange == null || onChange(e); // backwards compatibility
+    };
+    const handleUpdate = e => {
+      invalidateAndRegress();
+      onUpdate == null || onUpdate(e);
+      onChange == null || onChange(e); // backwards compatibility
+    };
+    const handleWake = e => {
+      invalidateAndRegress();
+      onWake == null || onWake(e);
+      onChange == null || onChange(e); // backwards compatibility
+    };
+    const handleRest = e => {
+      onRest == null || onRest(e);
+    };
+    const handleSleep = e => {
+      onSleep == null || onSleep(e);
+    };
+    controls.addEventListener('controlstart', handleControlStart);
+    controls.addEventListener('control', handleControl);
+    controls.addEventListener('controlend', handleControlEnd);
+    controls.addEventListener('transitionstart', handleTransitionStart);
+    controls.addEventListener('update', handleUpdate);
+    controls.addEventListener('wake', handleWake);
+    controls.addEventListener('rest', handleRest);
+    controls.addEventListener('sleep', handleSleep);
+    return () => {
+      controls.removeEventListener('controlstart', handleControlStart);
+      controls.removeEventListener('control', handleControl);
+      controls.removeEventListener('controlend', handleControlEnd);
+      controls.removeEventListener('transitionstart', handleTransitionStart);
+      controls.removeEventListener('update', handleUpdate);
+      controls.removeEventListener('wake', handleWake);
+      controls.removeEventListener('rest', handleRest);
+      controls.removeEventListener('sleep', handleSleep);
+    };
+  }, [controls, invalidate, setEvents, regress, performance, onControlStart, onControl, onControlEnd, onTransitionStart, onUpdate, onWake, onRest, onSleep, onChange, onStart, onEnd]);
+  useEffect(() => {
+    if (makeDefault) {
+      const old = get().controls;
+      set({
+        controls: controls
+      });
+      return () => set({
+        controls: old
+      });
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [makeDefault, controls]);
+  return /*#__PURE__*/React.createElement("primitive", _extends({
+    ref: ref,
+    object: controls
+  }, restProps));
+});
+
+export { CameraControls };

package/core/CameraShake.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("@react-three/fiber"),t=require("three-stdlib");function n(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var c=n(e);const u=c.forwardRef((({intensity:e=1,decay:n,decayRate:u=.65,maxYaw:a=.1,maxPitch:o=.1,maxRoll:s=.1,yawFrequency:i=.1,pitchFrequency:l=.1,rollFrequency:f=.1},d)=>{const m=r.useThree((e=>e.camera)),p=r.useThree((e=>e.controls)),y=c.useRef(e),h=c.useRef(m.rotation.clone()),[b]=c.useState((()=>new t.SimplexNoise)),[v]=c.useState((()=>new t.SimplexNoise)),[x]=c.useState((()=>new t.SimplexNoise)),w=()=>{(y.current<0||y.current>1)&&(y.current=y.current<0?0:1)};return c.useImperativeHandle(d,(()=>({getIntensity:()=>y.current,setIntensity:e=>{y.current=e,w()}})),[]),c.useEffect((()=>{if(p){const e=()=>{h.current=m.rotation.clone()};return p.addEventListener("change",e),e(),()=>{p.removeEventListener("change",e)}}}),[m,p]),r.useFrame(((e,r)=>{const t=Math.pow(y.current,2),c=a*t*b.noise(e.clock.elapsedTime*i,1),d=o*t*v.noise(e.clock.elapsedTime*l,1),p=s*t*x.noise(e.clock.elapsedTime*f,1);m.rotation.set(h.current.x+d,h.current.y+c,h.current.z+p),n&&y.current>0&&(y.current-=u*r,w())})),null}));exports.CameraShake=u;

package/core/CameraShake.d.ts

@@ -0,0 +1,17 @@
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export interface ShakeController {
+    getIntensity: () => number;
+    setIntensity: (val: number) => void;
+}
+export interface CameraShakeProps {
+    intensity?: number;
+    decay?: boolean;
+    decayRate?: number;
+    maxYaw?: number;
+    maxPitch?: number;
+    maxRoll?: number;
+    yawFrequency?: number;
+    pitchFrequency?: number;
+    rollFrequency?: number;
+}
+export declare const CameraShake: ForwardRefComponent<CameraShakeProps, ShakeController | undefined>;

package/core/CameraShake.js

@@ -0,0 +1,57 @@
+import * as React from 'react';
+import { useThree, useFrame } from '@react-three/fiber';
+import { SimplexNoise } from 'three-stdlib';
+
+const CameraShake = /* @__PURE__ */React.forwardRef(({
+  intensity = 1,
+  decay,
+  decayRate = 0.65,
+  maxYaw = 0.1,
+  maxPitch = 0.1,
+  maxRoll = 0.1,
+  yawFrequency = 0.1,
+  pitchFrequency = 0.1,
+  rollFrequency = 0.1
+}, ref) => {
+  const camera = useThree(state => state.camera);
+  const defaultControls = useThree(state => state.controls);
+  const intensityRef = React.useRef(intensity);
+  const initialRotation = React.useRef(camera.rotation.clone());
+  const [yawNoise] = React.useState(() => new SimplexNoise());
+  const [pitchNoise] = React.useState(() => new SimplexNoise());
+  const [rollNoise] = React.useState(() => new SimplexNoise());
+  const constrainIntensity = () => {
+    if (intensityRef.current < 0 || intensityRef.current > 1) {
+      intensityRef.current = intensityRef.current < 0 ? 0 : 1;
+    }
+  };
+  React.useImperativeHandle(ref, () => ({
+    getIntensity: () => intensityRef.current,
+    setIntensity: val => {
+      intensityRef.current = val;
+      constrainIntensity();
+    }
+  }), []);
+  React.useEffect(() => {
+    if (defaultControls) {
+      const callback = () => void (initialRotation.current = camera.rotation.clone());
+      defaultControls.addEventListener('change', callback);
+      callback();
+      return () => void defaultControls.removeEventListener('change', callback);
+    }
+  }, [camera, defaultControls]);
+  useFrame((state, delta) => {
+    const shake = Math.pow(intensityRef.current, 2);
+    const yaw = maxYaw * shake * yawNoise.noise(state.clock.elapsedTime * yawFrequency, 1);
+    const pitch = maxPitch * shake * pitchNoise.noise(state.clock.elapsedTime * pitchFrequency, 1);
+    const roll = maxRoll * shake * rollNoise.noise(state.clock.elapsedTime * rollFrequency, 1);
+    camera.rotation.set(initialRotation.current.x + pitch, initialRotation.current.y + yaw, initialRotation.current.z + roll);
+    if (decay && intensityRef.current > 0) {
+      intensityRef.current -= decayRate * delta;
+      constrainIntensity();
+    }
+  });
+  return null;
+});
+
+export { CameraShake };

package/core/CatmullRomLine.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),n=require("./Line.cjs.js");function o(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)}require("@react-three/fiber"),require("three-stdlib");var s=o(e),c=u(t);const l=c.forwardRef((function({points:e,closed:t=!1,curveType:o="centripetal",tension:u=.5,segments:l=20,vertexColors:i,...f},a){const p=c.useMemo((()=>{const n=e.map((e=>e instanceof r.Vector3?e:new r.Vector3(...e)));return new r.CatmullRomCurve3(n,t,o,u)}),[e,t,o,u]),d=c.useMemo((()=>p.getPoints(l)),[p,l]),h=c.useMemo((()=>{if(!i||i.length<2)return;if(i.length===l+1)return i;const e=i.map((e=>e instanceof r.Color?e:new r.Color(...e)));t&&e.push(e[0].clone());const n=[e[0]],o=l/(e.length-1);for(let t=1;t<l;t++){const r=t%o/o,u=Math.floor(t/o);n.push(e[u].clone().lerp(e[u+1],r))}return n.push(e[e.length-1]),n}),[i,l]);return c.createElement(n.Line,s.default({ref:a,points:d,vertexColors:h},f))}));exports.CatmullRomLine=l;

package/core/CatmullRomLine.d.ts

@@ -0,0 +1,10 @@
+import { Line2 } from 'three-stdlib';
+import { LineProps } from './Line';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export type CatmullRomLineProps = Omit<LineProps, 'ref' | 'segments'> & {
+    closed?: boolean;
+    curveType?: 'centripetal' | 'chordal' | 'catmullrom';
+    tension?: number;
+    segments?: number;
+};
+export declare const CatmullRomLine: ForwardRefComponent<CatmullRomLineProps, Line2>;

package/core/CatmullRomLine.js

@@ -0,0 +1,42 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import { Vector3, CatmullRomCurve3, Color } from 'three';
+import { Line } from './Line.js';
+
+const CatmullRomLine = /* @__PURE__ */React.forwardRef(function CatmullRomLine({
+  points,
+  closed = false,
+  curveType = 'centripetal',
+  tension = 0.5,
+  segments = 20,
+  vertexColors,
+  ...rest
+}, ref) {
+  const curve = React.useMemo(() => {
+    const mappedPoints = points.map(pt => pt instanceof Vector3 ? pt : new Vector3(...pt));
+    return new CatmullRomCurve3(mappedPoints, closed, curveType, tension);
+  }, [points, closed, curveType, tension]);
+  const segmentedPoints = React.useMemo(() => curve.getPoints(segments), [curve, segments]);
+  const interpolatedVertexColors = React.useMemo(() => {
+    if (!vertexColors || vertexColors.length < 2) return undefined;
+    if (vertexColors.length === segments + 1) return vertexColors;
+    const mappedColors = vertexColors.map(color => color instanceof Color ? color : new Color(...color));
+    if (closed) mappedColors.push(mappedColors[0].clone());
+    const iColors = [mappedColors[0]];
+    const divisions = segments / (mappedColors.length - 1);
+    for (let i = 1; i < segments; i++) {
+      const alpha = i % divisions / divisions;
+      const colorIndex = Math.floor(i / divisions);
+      iColors.push(mappedColors[colorIndex].clone().lerp(mappedColors[colorIndex + 1], alpha));
+    }
+    iColors.push(mappedColors[mappedColors.length - 1]);
+    return iColors;
+  }, [vertexColors, segments]);
+  return /*#__PURE__*/React.createElement(Line, _extends({
+    ref: ref,
+    points: segmentedPoints,
+    vertexColors: interpolatedVertexColors
+  }, rest));
+});
+
+export { CatmullRomLine };

package/core/Caustics.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("three"),t=require("react"),n=require("@react-three/fiber"),o=require("./Fbo.cjs.js"),i=require("./Helper.cjs.js"),a=require("./shaderMaterial.cjs.js"),l=require("./Edges.cjs.js"),c=require("three-stdlib"),s=require("../helpers/constants.cjs.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function d(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}require("./Line.cjs.js");var m=u(e),p=d(r),v=d(t);function f(e=p.FrontSide){const r={value:new p.Matrix4};return Object.assign(new p.MeshNormalMaterial({side:e}),{viewMatrix:r,onBeforeCompile:e=>{e.uniforms.viewMatrix=r,e.fragmentShader="vec3 inverseTransformDirection( in vec3 dir, in mat4 matrix ) {\n           return normalize( ( vec4( dir, 0.0 ) * matrix ).xyz );\n         }\n"+e.fragmentShader.replace("#include <normal_fragment_maps>","#include <normal_fragment_maps>\n           normal = inverseTransformDirection( normal, viewMatrix );\n")}})}const x=a.shaderMaterial({causticsTexture:null,causticsTextureB:null,color:new p.Color,lightProjMatrix:new p.Matrix4,lightViewMatrix:new p.Matrix4},"varying vec3 vWorldPosition;\n   void main() {\n     gl_Position = projectionMatrix * viewMatrix * modelMatrix * vec4(position, 1.);\n     vec4 worldPosition = modelMatrix * vec4(position, 1.);\n     vWorldPosition = worldPosition.xyz;\n   }",`varying vec3 vWorldPosition;\n  uniform vec3 color;\n  uniform sampler2D causticsTexture;\n  uniform sampler2D causticsTextureB;\n  uniform mat4 lightProjMatrix;\n  uniform mat4 lightViewMatrix;\n   void main() {\n    // Apply caustics\n    vec4 lightSpacePos = lightProjMatrix * lightViewMatrix * vec4(vWorldPosition, 1.0);\n    lightSpacePos.xyz /= lightSpacePos.w;\n    lightSpacePos.xyz = lightSpacePos.xyz * 0.5 + 0.5;\n    vec3 front = texture2D(causticsTexture, lightSpacePos.xy).rgb;\n    vec3 back = texture2D(causticsTextureB, lightSpacePos.xy).rgb;\n    gl_FragColor = vec4((front + back) * color, 1.0);\n    #include <tonemapping_fragment>\n    #include <${s.version>=154?"colorspace_fragment":"encodings_fragment"}>\n   }`),h=a.shaderMaterial({cameraMatrixWorld:new p.Matrix4,cameraProjectionMatrixInv:new p.Matrix4,normalTexture:null,depthTexture:null,lightDir:new p.Vector3(0,1,0),lightPlaneNormal:new p.Vector3(0,1,0),lightPlaneConstant:0,near:.1,far:100,modelMatrix:new p.Matrix4,worldRadius:1/40,ior:1.1,bounces:0,resolution:1024,size:10,intensity:.5},"\n  varying vec2 vUv;\n  void main() {\n      vUv = uv;\n      gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n  }","\n  uniform mat4 cameraMatrixWorld;\n  uniform mat4 cameraProjectionMatrixInv;\n  uniform vec3 lightDir;\n  uniform vec3 lightPlaneNormal;\n  uniform float lightPlaneConstant;\n  uniform float near;\n  uniform float far;\n  uniform float time;\n  uniform float worldRadius;\n  uniform float resolution;\n  uniform float size;\n  uniform float intensity;\n  uniform float ior;\n  precision highp isampler2D;\n  precision highp usampler2D;\n  uniform sampler2D normalTexture;\n  uniform sampler2D depthTexture;\n  uniform float bounces;\n  varying vec2 vUv;\n  vec3 WorldPosFromDepth(float depth, vec2 coord) {\n    float z = depth * 2.0 - 1.0;\n    vec4 clipSpacePosition = vec4(coord * 2.0 - 1.0, z, 1.0);\n    vec4 viewSpacePosition = cameraProjectionMatrixInv * clipSpacePosition;\n    // Perspective division\n    viewSpacePosition /= viewSpacePosition.w;\n    vec4 worldSpacePosition = cameraMatrixWorld * viewSpacePosition;\n    return worldSpacePosition.xyz;\n  }\n  float sdPlane( vec3 p, vec3 n, float h ) {\n    // n must be normalized\n    return dot(p,n) + h;\n  }\n  float planeIntersect( vec3 ro, vec3 rd, vec4 p ) {\n    return -(dot(ro,p.xyz)+p.w)/dot(rd,p.xyz);\n  }\n  vec3 totalInternalReflection(vec3 ro, vec3 rd, vec3 pos, vec3 normal, float ior, out vec3 rayOrigin, out vec3 rayDirection) {\n    rayOrigin = ro;\n    rayDirection = rd;\n    rayDirection = refract(rayDirection, normal, 1.0 / ior);\n    rayOrigin = pos + rayDirection * 0.1;\n    return rayDirection;\n  }\n  void main() {\n    // Each sample consists of random offset in the x and y direction\n    float caustic = 0.0;\n    float causticTexelSize = (1.0 / resolution) * size * 2.0;\n    float texelsNeeded = worldRadius / causticTexelSize;\n    float sampleRadius = texelsNeeded / resolution;\n    float sum = 0.0;\n    if (texture2D(depthTexture, vUv).x == 1.0) {\n      gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);\n      return;\n    }\n    vec2 offset1 = vec2(-0.5, -0.5);//vec2(rand() - 0.5, rand() - 0.5);\n    vec2 offset2 = vec2(-0.5, 0.5);//vec2(rand() - 0.5, rand() - 0.5);\n    vec2 offset3 = vec2(0.5, 0.5);//vec2(rand() - 0.5, rand() - 0.5);\n    vec2 offset4 = vec2(0.5, -0.5);//vec2(rand() - 0.5, rand() - 0.5);\n    vec2 uv1 = vUv + offset1 * sampleRadius;\n    vec2 uv2 = vUv + offset2 * sampleRadius;\n    vec2 uv3 = vUv + offset3 * sampleRadius;\n    vec2 uv4 = vUv + offset4 * sampleRadius;\n    vec3 normal1 = texture2D(normalTexture, uv1, -10.0).rgb * 2.0 - 1.0;\n    vec3 normal2 = texture2D(normalTexture, uv2, -10.0).rgb * 2.0 - 1.0;\n    vec3 normal3 = texture2D(normalTexture, uv3, -10.0).rgb * 2.0 - 1.0;\n    vec3 normal4 = texture2D(normalTexture, uv4, -10.0).rgb * 2.0 - 1.0;\n    float depth1 = texture2D(depthTexture, uv1, -10.0).x;\n    float depth2 = texture2D(depthTexture, uv2, -10.0).x;\n    float depth3 = texture2D(depthTexture, uv3, -10.0).x;\n    float depth4 = texture2D(depthTexture, uv4, -10.0).x;\n    // Sanity check the depths\n    if (depth1 == 1.0 || depth2 == 1.0 || depth3 == 1.0 || depth4 == 1.0) {\n      gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);\n      return;\n    }\n    vec3 pos1 = WorldPosFromDepth(depth1, uv1);\n    vec3 pos2 = WorldPosFromDepth(depth2, uv2);\n    vec3 pos3 = WorldPosFromDepth(depth3, uv3);\n    vec3 pos4 = WorldPosFromDepth(depth4, uv4);\n    vec3 originPos1 = WorldPosFromDepth(0.0, uv1);\n    vec3 originPos2 = WorldPosFromDepth(0.0, uv2);\n    vec3 originPos3 = WorldPosFromDepth(0.0, uv3);\n    vec3 originPos4 = WorldPosFromDepth(0.0, uv4);\n    vec3 endPos1, endPos2, endPos3, endPos4;\n    vec3 endDir1, endDir2, endDir3, endDir4;\n    totalInternalReflection(originPos1, lightDir, pos1, normal1, ior, endPos1, endDir1);\n    totalInternalReflection(originPos2, lightDir, pos2, normal2, ior, endPos2, endDir2);\n    totalInternalReflection(originPos3, lightDir, pos3, normal3, ior, endPos3, endDir3);\n    totalInternalReflection(originPos4, lightDir, pos4, normal4, ior, endPos4, endDir4);\n    float lightPosArea = length(cross(originPos2 - originPos1, originPos3 - originPos1)) + length(cross(originPos3 - originPos1, originPos4 - originPos1));\n    float t1 = planeIntersect(endPos1, endDir1, vec4(lightPlaneNormal, lightPlaneConstant));\n    float t2 = planeIntersect(endPos2, endDir2, vec4(lightPlaneNormal, lightPlaneConstant));\n    float t3 = planeIntersect(endPos3, endDir3, vec4(lightPlaneNormal, lightPlaneConstant));\n    float t4 = planeIntersect(endPos4, endDir4, vec4(lightPlaneNormal, lightPlaneConstant));\n    vec3 finalPos1 = endPos1 + endDir1 * t1;\n    vec3 finalPos2 = endPos2 + endDir2 * t2;\n    vec3 finalPos3 = endPos3 + endDir3 * t3;\n    vec3 finalPos4 = endPos4 + endDir4 * t4;\n    float finalArea = length(cross(finalPos2 - finalPos1, finalPos3 - finalPos1)) + length(cross(finalPos3 - finalPos1, finalPos4 - finalPos1));\n    caustic += intensity * (lightPosArea / finalArea);\n    // Calculate the area of the triangle in light spaces\n    gl_FragColor = vec4(vec3(max(caustic, 0.0)), 1.0);\n  }"),g={depth:!0,minFilter:p.LinearFilter,magFilter:p.LinearFilter,type:p.UnsignedByteType},P={minFilter:p.LinearMipmapLinearFilter,magFilter:p.LinearFilter,type:p.FloatType,generateMipmaps:!0},y=v.forwardRef((({debug:e,children:r,frames:t=1,ior:a=1.1,color:s="white",causticsOnly:u=!1,backside:d=!1,backsideIOR:y=1.1,worldRadius:M=.3125,intensity:D=.05,resolution:w=2024,lightSource:T=[5,5,5],...j},b)=>{n.extend({CausticsProjectionMaterial:x});const S=v.useRef(null),F=v.useRef(null),z=v.useRef(null),W=v.useRef(null),R=n.useThree((e=>e.gl)),I=i.useHelper(e&&F,p.CameraHelper),C=o.useFBO(w,w,g),O=o.useFBO(w,w,g),_=o.useFBO(w,w,P),V=o.useFBO(w,w,P),[B]=v.useState((()=>f())),[E]=v.useState((()=>f(p.BackSide))),[q]=v.useState((()=>new h)),[A]=v.useState((()=>new c.FullScreenQuad(q)));v.useLayoutEffect((()=>{S.current.updateWorldMatrix(!1,!0)}));let N=0;const k=new p.Vector3,U=new p.Frustum,L=new p.Matrix4,H=new p.Plane,G=new p.Vector3,Q=new p.Vector3,$=new p.Box3,J=new p.Vector3,K=[],X=[],Y=[],Z=[],ee=new p.Vector3;for(let e=0;e<8;e++)K.push(new p.Vector3),X.push(new p.Vector3),Y.push(new p.Vector3),Z.push(new p.Vector3);return n.useFrame((()=>{if(t===1/0||N++<t){var r,n;Array.isArray(T)?G.fromArray(T).normalize():G.copy(S.current.worldToLocal(T.current.getWorldPosition(k)).normalize()),Q.copy(G).multiplyScalar(-1),null==(r=z.current.parent)||r.matrixWorld.identity(),$.setFromObject(z.current,!0),K[0].set($.min.x,$.min.y,$.min.z),K[1].set($.min.x,$.min.y,$.max.z),K[2].set($.min.x,$.max.y,$.min.z),K[3].set($.min.x,$.max.y,$.max.z),K[4].set($.max.x,$.min.y,$.min.z),K[5].set($.max.x,$.min.y,$.max.z),K[6].set($.max.x,$.max.y,$.min.z),K[7].set($.max.x,$.max.y,$.max.z);for(let e=0;e<8;e++)X[e].copy(K[e]);$.getCenter(J),K.map((e=>e.sub(J)));const t=H.set(Q,0);K.map(((e,r)=>t.projectPoint(e,Y[r])));const o=Y.reduce(((e,r)=>e.add(r)),k.set(0,0,0)).divideScalar(Y.length),i=Y.map((e=>e.distanceTo(o))).reduce(((e,r)=>Math.max(e,r))),l=K.map((e=>e.dot(G))).reduce(((e,r)=>Math.max(e,r)));F.current.position.copy(ee.copy(G).multiplyScalar(l).add(J)),F.current.lookAt(z.current.localToWorld(J));const c=L.lookAt(F.current.position,J,k.set(0,1,0));F.current.left=-i,F.current.right=i,F.current.top=i,F.current.bottom=-i;const s=k.set(0,i,0).applyMatrix4(c),m=(F.current.position.y+s.y)/G.y;F.current.near=.1,F.current.far=m,F.current.updateProjectionMatrix(),F.current.updateMatrixWorld();const p=X.map(((e,r)=>e.add(Z[r].copy(G).multiplyScalar(-e.y/G.y)))),v=p.reduce(((e,r)=>e.add(r)),k.set(0,0,0)).divideScalar(p.length),f=2*p.map((e=>Math.hypot(e.x-v.x,e.z-v.z))).reduce(((e,r)=>Math.max(e,r)));W.current.scale.setScalar(f),W.current.position.copy(v),e&&(null==(n=I.current)||n.update()),E.viewMatrix.value=B.viewMatrix.value=F.current.matrixWorldInverse;const x=U.setFromProjectionMatrix(L.multiplyMatrices(F.current.projectionMatrix,F.current.matrixWorldInverse)).planes[4];q.cameraMatrixWorld=F.current.matrixWorld,q.cameraProjectionMatrixInv=F.current.projectionMatrixInverse,q.lightDir=Q,q.lightPlaneNormal=x.normal,q.lightPlaneConstant=x.constant,q.near=F.current.near,q.far=F.current.far,q.resolution=w,q.size=i,q.intensity=D,q.worldRadius=M,z.current.visible=!0,R.setRenderTarget(C),R.clear(),z.current.overrideMaterial=B,R.render(z.current,F.current),R.setRenderTarget(O),R.clear(),d&&(z.current.overrideMaterial=E,R.render(z.current,F.current)),z.current.overrideMaterial=null,q.ior=a,W.current.material.lightProjMatrix=F.current.projectionMatrix,W.current.material.lightViewMatrix=F.current.matrixWorldInverse,q.normalTexture=C.texture,q.depthTexture=C.depthTexture,R.setRenderTarget(_),R.clear(),A.render(R),q.ior=y,q.normalTexture=O.texture,q.depthTexture=O.depthTexture,R.setRenderTarget(V),R.clear(),d&&A.render(R),R.setRenderTarget(null),u&&(z.current.visible=!1)}})),v.useImperativeHandle(b,(()=>S.current),[]),v.createElement("group",m.default({ref:S},j),v.createElement("scene",{ref:z},v.createElement("orthographicCamera",{ref:F,up:[0,1,0]}),r),v.createElement("mesh",{renderOrder:2,ref:W,"rotation-x":-Math.PI/2},v.createElement("planeGeometry",null),v.createElement("causticsProjectionMaterial",{transparent:!0,color:s,causticsTexture:_.texture,causticsTextureB:V.texture,blending:p.CustomBlending,blendSrc:p.OneFactor,blendDst:p.SrcAlphaFactor,depthWrite:!1}),e&&v.createElement(l.Edges,null,v.createElement("lineBasicMaterial",{color:"#ffff00",toneMapped:!1}))))}));exports.Caustics=y;

package/core/Caustics.d.ts

@@ -0,0 +1,32 @@
+import * as THREE from 'three';
+import * as React from 'react';
+import { ReactThreeFiber, ThreeElements } from '@react-three/fiber';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export type CausticsProps = Omit<ThreeElements['group'], 'ref'> & {
+    frames?: number;
+    debug?: boolean;
+    causticsOnly: boolean;
+    backside: boolean;
+    ior?: number;
+    backsideIOR?: number;
+    worldRadius?: number;
+    intensity?: number;
+    color?: ReactThreeFiber.Color;
+    resolution?: number;
+    lightSource?: [x: number, y: number, z: number] | React.RefObject<THREE.Object3D>;
+};
+declare module '@react-three/fiber' {
+    interface ThreeElements {
+        causticsProjectionMaterial: ThreeElements['meshNormalMaterial'] & {
+            viewMatrix?: {
+                value: THREE.Matrix4;
+            };
+            color?: ReactThreeFiber.Color;
+            causticsTexture?: THREE.Texture;
+            causticsTextureB?: THREE.Texture;
+            lightProjMatrix?: THREE.Matrix4;
+            lightViewMatrix?: THREE.Matrix4;
+        };
+    }
+}
+export declare const Caustics: ForwardRefComponent<CausticsProps, THREE.Group>;