@react-three/drei 9.74.13 → 9.74.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (189) hide show
  1. package/core/CatmullRomLine.js +0 -2
  2. package/core/Cloud.js +0 -3
  3. package/core/CubeCamera.js +0 -1
  4. package/core/CubicBezierLine.js +0 -2
  5. package/core/Environment.js +0 -1
  6. package/core/Example.js +0 -6
  7. package/core/FaceControls.cjs.js +1 -1
  8. package/core/FaceControls.js +0 -2
  9. package/core/FaceLandmarker.cjs.js +1 -1
  10. package/core/FaceLandmarker.js +2 -3
  11. package/core/Facemesh.js +0 -2
  12. package/core/GizmoHelper.js +0 -3
  13. package/core/GizmoViewcube.js +0 -4
  14. package/core/GizmoViewport.js +0 -4
  15. package/core/Gltf.js +0 -4
  16. package/core/MeshDiscardMaterial.js +0 -2
  17. package/core/MeshDistortMaterial.js +1 -2
  18. package/core/MeshReflectorMaterial.js +0 -1
  19. package/core/MeshRefractionMaterial.js +0 -2
  20. package/core/MeshTransmissionMaterial.js +0 -1
  21. package/core/OrthographicCamera.js +0 -1
  22. package/core/PerspectiveCamera.js +0 -1
  23. package/core/QuadraticBezierLine.js +0 -2
  24. package/core/Reflector.js +0 -1
  25. package/core/SpotLight.js +1 -2
  26. package/core/Stage.js +0 -7
  27. package/core/Text3D.js +0 -1
  28. package/core/Wireframe.js +0 -1
  29. package/core/index.cjs.js +1 -1
  30. package/core/index.js +1 -0
  31. package/core/useKTX2.js +0 -1
  32. package/core/useMatcapTexture.js +0 -2
  33. package/core/useNormalTexture.js +0 -1
  34. package/index.cjs.js +1 -1
  35. package/materials/DiscardMaterial.js +0 -1
  36. package/materials/MeshRefractionMaterial.js +1 -1
  37. package/native/index.cjs.js +1 -1
  38. package/native/index.js +1 -0
  39. package/package.json +2 -2
  40. package/web/Loader.js +0 -2
  41. package/web/index.cjs.js +1 -1
  42. package/web/index.js +1 -0
  43. package/web/pivotControls/AxisArrow.js +0 -3
  44. package/web/pivotControls/AxisRotator.js +0 -3
  45. package/web/pivotControls/PlaneSlider.js +0 -3
  46. package/web/pivotControls/index.js +0 -5
  47. package/src/core/AccumulativeShadows.js +0 -311
  48. package/src/core/AdaptiveDpr.js +0 -28
  49. package/src/core/AdaptiveEvents.js +0 -20
  50. package/src/core/ArcballControls.js +0 -67
  51. package/src/core/AsciiRenderer.js +0 -60
  52. package/src/core/BBAnchor.js +0 -37
  53. package/src/core/Backdrop.js +0 -36
  54. package/src/core/BakeShadows.js +0 -16
  55. package/src/core/Billboard.js +0 -41
  56. package/src/core/Bounds.js +0 -245
  57. package/src/core/CameraControls.js +0 -92
  58. package/src/core/CameraShake.js +0 -61
  59. package/src/core/CatmullRomLine.js +0 -44
  60. package/src/core/Caustics.js +0 -375
  61. package/src/core/Center.js +0 -66
  62. package/src/core/Clone.js +0 -102
  63. package/src/core/Cloud.js +0 -59
  64. package/src/core/ComputedAttribute.js +0 -34
  65. package/src/core/ContactShadows.js +0 -114
  66. package/src/core/CubeCamera.js +0 -43
  67. package/src/core/CubicBezierLine.js +0 -28
  68. package/src/core/CurveModifier.js +0 -34
  69. package/src/core/Decal.js +0 -92
  70. package/src/core/Detailed.js +0 -34
  71. package/src/core/DeviceOrientationControls.js +0 -51
  72. package/src/core/Edges.js +0 -36
  73. package/src/core/Effects.js +0 -93
  74. package/src/core/Environment.js +0 -132
  75. package/src/core/Example.js +0 -42
  76. package/src/core/FaceControls.js +0 -315
  77. package/src/core/FaceLandmarker.js +0 -43
  78. package/src/core/Facemesh.js +0 -4545
  79. package/src/core/FirstPersonControls.js +0 -38
  80. package/src/core/Float.js +0 -36
  81. package/src/core/FlyControls.js +0 -55
  82. package/src/core/GizmoHelper.js +0 -111
  83. package/src/core/GizmoViewcube.js +0 -152
  84. package/src/core/GizmoViewport.js +0 -152
  85. package/src/core/Gltf.js +0 -20
  86. package/src/core/GradientTexture.js +0 -33
  87. package/src/core/Grid.js +0 -112
  88. package/src/core/Hud.js +0 -58
  89. package/src/core/Image.js +0 -119
  90. package/src/core/Instances.js +0 -215
  91. package/src/core/Lightformer.js +0 -51
  92. package/src/core/Line.js +0 -68
  93. package/src/core/MapControls.js +0 -64
  94. package/src/core/MarchingCubes.js +0 -76
  95. package/src/core/Mask.js +0 -42
  96. package/src/core/MeshDiscardMaterial.js +0 -15
  97. package/src/core/MeshDistortMaterial.js +0 -79
  98. package/src/core/MeshPortalMaterial.js +0 -381
  99. package/src/core/MeshReflectorMaterial.js +0 -182
  100. package/src/core/MeshRefractionMaterial.js +0 -79
  101. package/src/core/MeshTransmissionMaterial.js +0 -395
  102. package/src/core/MeshWobbleMaterial.js +0 -65
  103. package/src/core/OrbitControls.js +0 -82
  104. package/src/core/OrthographicCamera.js +0 -77
  105. package/src/core/PerformanceMonitor.js +0 -121
  106. package/src/core/PerspectiveCamera.js +0 -73
  107. package/src/core/PointMaterial.js +0 -36
  108. package/src/core/PointerLockControls.js +0 -90
  109. package/src/core/Points.js +0 -227
  110. package/src/core/PositionalAudio.js +0 -51
  111. package/src/core/Preload.js +0 -45
  112. package/src/core/QuadraticBezierLine.js +0 -44
  113. package/src/core/Reflector.js +0 -182
  114. package/src/core/RenderTexture.js +0 -96
  115. package/src/core/Resize.js +0 -39
  116. package/src/core/RoundedBox.js +0 -52
  117. package/src/core/Sampler.js +0 -85
  118. package/src/core/ScreenQuad.js +0 -24
  119. package/src/core/ScreenSpace.js +0 -25
  120. package/src/core/Segments.js +0 -102
  121. package/src/core/Shadow.js +0 -42
  122. package/src/core/Sky.js +0 -39
  123. package/src/core/Sparkles.js +0 -139
  124. package/src/core/SpotLight.js +0 -231
  125. package/src/core/SpriteAnimator.js +0 -342
  126. package/src/core/Stage.js +0 -135
  127. package/src/core/Stars.js +0 -108
  128. package/src/core/Stats.js +0 -30
  129. package/src/core/Svg.js +0 -59
  130. package/src/core/Text.js +0 -58
  131. package/src/core/Text3D.js +0 -76
  132. package/src/core/TrackballControls.js +0 -72
  133. package/src/core/Trail.js +0 -161
  134. package/src/core/TransformControls.js +0 -106
  135. package/src/core/Wireframe.js +0 -185
  136. package/src/core/meshBounds.js +0 -38
  137. package/src/core/shaderMaterial.js +0 -39
  138. package/src/core/shapes.js +0 -68
  139. package/src/core/softShadows.js +0 -161
  140. package/src/core/useAnimations.js +0 -56
  141. package/src/core/useAspect.js +0 -10
  142. package/src/core/useBVH.js +0 -90
  143. package/src/core/useBoxProjectedEnv.js +0 -98
  144. package/src/core/useCamera.js +0 -27
  145. package/src/core/useContextBridge.js +0 -21
  146. package/src/core/useCubeCamera.js +0 -49
  147. package/src/core/useCubeTexture.js +0 -18
  148. package/src/core/useDepthBuffer.js +0 -38
  149. package/src/core/useDetectGPU.js +0 -6
  150. package/src/core/useEnvironment.js +0 -48
  151. package/src/core/useFBO.js +0 -53
  152. package/src/core/useFBX.js +0 -12
  153. package/src/core/useFont.js +0 -20
  154. package/src/core/useGLTF.js +0 -37
  155. package/src/core/useHelper.js +0 -31
  156. package/src/core/useIntersect.js +0 -39
  157. package/src/core/useKTX2.js +0 -38
  158. package/src/core/useMatcapTexture.js +0 -45
  159. package/src/core/useNormalTexture.js +0 -30
  160. package/src/core/useProgress.js +0 -50
  161. package/src/core/useTexture.js +0 -35
  162. package/src/core/useTrailTexture.js +0 -164
  163. package/src/core/useVideoTexture.js +0 -41
  164. package/src/helpers/environment-assets.js +0 -14
  165. package/src/helpers/useEffectfulState.js +0 -18
  166. package/src/materials/BlurPass.js +0 -75
  167. package/src/materials/ConvolutionMaterial.js +0 -99
  168. package/src/materials/DiscardMaterial.js +0 -5
  169. package/src/materials/MeshReflectorMaterial.js +0 -290
  170. package/src/materials/MeshRefractionMaterial.js +0 -171
  171. package/src/materials/SpotLightMaterial.js +0 -111
  172. package/src/materials/WireframeMaterial.js +0 -235
  173. package/src/web/CycleRaycast.js +0 -97
  174. package/src/web/Html.js +0 -417
  175. package/src/web/KeyboardControls.js +0 -101
  176. package/src/web/Loader.js +0 -98
  177. package/src/web/PresentationControls.js +0 -86
  178. package/src/web/ScrollControls.js +0 -246
  179. package/src/web/Select.js +0 -175
  180. package/src/web/View.js +0 -206
  181. package/src/web/pivotControls/AxisArrow.js +0 -202
  182. package/src/web/pivotControls/AxisRotator.js +0 -235
  183. package/src/web/pivotControls/PlaneSlider.js +0 -211
  184. package/src/web/pivotControls/context.js +0 -5
  185. package/src/web/pivotControls/index.js +0 -223
  186. package/src/web/useCursor.js +0 -12
  187. /package/{src/helpers → helpers}/glsl/DefaultSpotlightShadowShadows.glsl.js +0 -0
  188. /package/{src/helpers → helpers}/glsl/distort.vert.glsl.js +0 -0
  189. /package/{src/index.js → index.js} +0 -0
@@ -1,67 +0,0 @@
1
- import _extends from '@babel/runtime/helpers/esm/extends';
2
- import { useThree, useFrame } from '@react-three/fiber';
3
- import * as React from 'react';
4
- import { forwardRef, useMemo, useEffect } from 'react';
5
- import { ArcballControls as ArcballControls$1 } from 'three-stdlib';
6
-
7
- const ArcballControls = /*#__PURE__*/forwardRef(({
8
- camera,
9
- makeDefault,
10
- regress,
11
- domElement,
12
- onChange,
13
- onStart,
14
- onEnd,
15
- ...restProps
16
- }, ref) => {
17
- const invalidate = useThree(state => state.invalidate);
18
- const defaultCamera = useThree(state => state.camera);
19
- const gl = useThree(state => state.gl);
20
- const events = useThree(state => state.events);
21
- const set = useThree(state => state.set);
22
- const get = useThree(state => state.get);
23
- const performance = useThree(state => state.performance);
24
- const explCamera = camera || defaultCamera;
25
- const explDomElement = domElement || events.connected || gl.domElement;
26
- const controls = useMemo(() => new ArcballControls$1(explCamera), [explCamera]);
27
- useFrame(() => {
28
- if (controls.enabled) controls.update();
29
- }, -1);
30
- useEffect(() => {
31
- controls.connect(explDomElement);
32
- return () => void controls.dispose();
33
- }, [explDomElement, regress, controls, invalidate]);
34
- useEffect(() => {
35
- const callback = e => {
36
- invalidate();
37
- if (regress) performance.regress();
38
- if (onChange) onChange(e);
39
- };
40
-
41
- controls.addEventListener('change', callback);
42
- if (onStart) controls.addEventListener('start', onStart);
43
- if (onEnd) controls.addEventListener('end', onEnd);
44
- return () => {
45
- controls.removeEventListener('change', callback);
46
- if (onStart) controls.removeEventListener('start', onStart);
47
- if (onEnd) controls.removeEventListener('end', onEnd);
48
- };
49
- }, [onChange, onStart, onEnd]);
50
- useEffect(() => {
51
- if (makeDefault) {
52
- const old = get().controls;
53
- set({
54
- controls
55
- });
56
- return () => set({
57
- controls: old
58
- });
59
- }
60
- }, [makeDefault, controls]);
61
- return /*#__PURE__*/React.createElement("primitive", _extends({
62
- ref: ref,
63
- object: controls
64
- }, restProps));
65
- });
66
-
67
- export { ArcballControls };
@@ -1,60 +0,0 @@
1
- import * as React from 'react';
2
- import { useThree, useFrame } from '@react-three/fiber';
3
- import { AsciiEffect } from 'three-stdlib';
4
-
5
- function AsciiRenderer({
6
- renderIndex = 1,
7
- bgColor = 'black',
8
- fgColor = 'white',
9
- characters = ' .:-+*=%@#',
10
- invert = true,
11
- color = false,
12
- resolution = 0.15
13
- }) {
14
- // Reactive state
15
- const {
16
- size,
17
- gl,
18
- scene,
19
- camera
20
- } = useThree(); // Create effect
21
-
22
- const effect = React.useMemo(() => {
23
- const effect = new AsciiEffect(gl, characters, {
24
- invert,
25
- color,
26
- resolution
27
- });
28
- effect.domElement.style.position = 'absolute';
29
- effect.domElement.style.top = '0px';
30
- effect.domElement.style.left = '0px';
31
- effect.domElement.style.pointerEvents = 'none';
32
- return effect;
33
- }, [characters, invert, color, resolution]); // Styling
34
-
35
- React.useLayoutEffect(() => {
36
- effect.domElement.style.color = fgColor;
37
- effect.domElement.style.backgroundColor = bgColor;
38
- }, [fgColor, bgColor]); // Append on mount, remove on unmount
39
-
40
- React.useEffect(() => {
41
- gl.domElement.style.opacity = '0';
42
- gl.domElement.parentNode.appendChild(effect.domElement);
43
- return () => {
44
- gl.domElement.style.opacity = '1';
45
- gl.domElement.parentNode.removeChild(effect.domElement);
46
- };
47
- }, [effect]); // Set size
48
-
49
- React.useEffect(() => {
50
- effect.setSize(size.width, size.height);
51
- }, [effect, size]); // Take over render-loop (that is what the index is for)
52
-
53
- useFrame(state => {
54
- effect.render(scene, camera);
55
- }, renderIndex); // return something to not break type signatures
56
-
57
- return /*#__PURE__*/React.createElement(React.Fragment, null);
58
- }
59
-
60
- export { AsciiRenderer };
@@ -1,37 +0,0 @@
1
- import _extends from '@babel/runtime/helpers/esm/extends';
2
- import * as React from 'react';
3
- import * as THREE from 'three';
4
- import { useFrame } from '@react-three/fiber';
5
-
6
- const boundingBox = new THREE.Box3();
7
- const boundingBoxSize = new THREE.Vector3();
8
- const BBAnchor = ({
9
- anchor,
10
- ...props
11
- }) => {
12
- const ref = React.useRef(null);
13
- const parentRef = React.useRef(null); // Reattach group created by this component to the parent's parent,
14
- // so it becomes a sibling of its initial parent.
15
- // We do that so the children have no impact on a bounding box of a parent.
16
-
17
- React.useEffect(() => {
18
- var _ref$current, _ref$current$parent;
19
-
20
- if ((_ref$current = ref.current) != null && (_ref$current$parent = _ref$current.parent) != null && _ref$current$parent.parent) {
21
- parentRef.current = ref.current.parent;
22
- ref.current.parent.parent.add(ref.current);
23
- }
24
- }, []);
25
- useFrame(() => {
26
- if (parentRef.current) {
27
- boundingBox.setFromObject(parentRef.current);
28
- boundingBox.getSize(boundingBoxSize);
29
- ref.current.position.set(parentRef.current.position.x + boundingBoxSize.x * anchor[0] / 2, parentRef.current.position.y + boundingBoxSize.y * anchor[1] / 2, parentRef.current.position.z + boundingBoxSize.z * anchor[2] / 2);
30
- }
31
- });
32
- return /*#__PURE__*/React.createElement("group", _extends({
33
- ref: ref
34
- }, props));
35
- };
36
-
37
- export { BBAnchor };
@@ -1,36 +0,0 @@
1
- import * as React from 'react';
2
-
3
- const easeInExpo = x => x === 0 ? 0 : Math.pow(2, 10 * x - 10);
4
-
5
- function Backdrop({
6
- children,
7
- floor = 0.25,
8
- segments = 20,
9
- receiveShadow,
10
- ...props
11
- }) {
12
- const ref = React.useRef(null);
13
- React.useLayoutEffect(() => {
14
- let i = 0;
15
- const offset = segments / segments / 2;
16
- const position = ref.current.attributes.position;
17
-
18
- for (let x = 0; x < segments + 1; x++) {
19
- for (let y = 0; y < segments + 1; y++) {
20
- position.setXYZ(i++, x / segments - offset + (x === 0 ? -floor : 0), y / segments - offset, easeInExpo(x / segments));
21
- }
22
- }
23
-
24
- position.needsUpdate = true;
25
- ref.current.computeVertexNormals();
26
- }, [segments, floor]);
27
- return /*#__PURE__*/React.createElement("group", props, /*#__PURE__*/React.createElement("mesh", {
28
- receiveShadow: receiveShadow,
29
- rotation: [-Math.PI / 2, 0, Math.PI / 2]
30
- }, /*#__PURE__*/React.createElement("planeGeometry", {
31
- ref: ref,
32
- args: [1, 1, segments, segments]
33
- }), children));
34
- }
35
-
36
- export { Backdrop };
@@ -1,16 +0,0 @@
1
- import { useEffect } from 'react';
2
- import { useThree } from '@react-three/fiber';
3
-
4
- function BakeShadows() {
5
- const gl = useThree(state => state.gl);
6
- useEffect(() => {
7
- gl.shadowMap.autoUpdate = false;
8
- gl.shadowMap.needsUpdate = true;
9
- return () => {
10
- gl.shadowMap.autoUpdate = gl.shadowMap.needsUpdate = true;
11
- };
12
- }, [gl.shadowMap]);
13
- return null;
14
- }
15
-
16
- export { BakeShadows };
@@ -1,41 +0,0 @@
1
- import _extends from '@babel/runtime/helpers/esm/extends';
2
- import * as React from 'react';
3
- import { useFrame } from '@react-three/fiber';
4
- import mergeRefs from 'react-merge-refs';
5
-
6
- /**
7
- * Wraps children in a billboarded group. Sample usage:
8
- *
9
- * ```js
10
- * <Billboard>
11
- * <Text>hi</Text>
12
- * </Billboard>
13
- * ```
14
- */
15
- const Billboard = /*#__PURE__*/React.forwardRef(function Billboard({
16
- follow = true,
17
- lockX = false,
18
- lockY = false,
19
- lockZ = false,
20
- ...props
21
- }, ref) {
22
- const localRef = React.useRef();
23
- useFrame(({
24
- camera
25
- }) => {
26
- if (!follow || !localRef.current) return; // save previous rotation in case we're locking an axis
27
-
28
- const prevRotation = localRef.current.rotation.clone(); // always face the camera
29
-
30
- camera.getWorldQuaternion(localRef.current.quaternion); // readjust any axis that is locked
31
-
32
- if (lockX) localRef.current.rotation.x = prevRotation.x;
33
- if (lockY) localRef.current.rotation.y = prevRotation.y;
34
- if (lockZ) localRef.current.rotation.z = prevRotation.z;
35
- });
36
- return /*#__PURE__*/React.createElement("group", _extends({
37
- ref: mergeRefs([localRef, ref])
38
- }, props));
39
- });
40
-
41
- export { Billboard };
@@ -1,245 +0,0 @@
1
- import * as React from 'react';
2
- import * as THREE from 'three';
3
- import { useThree, useFrame } from '@react-three/fiber';
4
-
5
- const isOrthographic = def => def && def.isOrthographicCamera;
6
-
7
- const isBox3 = def => def && def.isBox3;
8
-
9
- const context = /*#__PURE__*/React.createContext(null);
10
- function Bounds({
11
- children,
12
- damping = 6,
13
- fit,
14
- clip,
15
- observe,
16
- margin = 1.2,
17
- eps = 0.01,
18
- onFit
19
- }) {
20
- const ref = React.useRef(null);
21
- const {
22
- camera,
23
- invalidate,
24
- size,
25
- controls: controlsImpl
26
- } = useThree();
27
- const controls = controlsImpl;
28
- const onFitRef = React.useRef(onFit);
29
- onFitRef.current = onFit;
30
-
31
- function equals(a, b) {
32
- return Math.abs(a.x - b.x) < eps && Math.abs(a.y - b.y) < eps && Math.abs(a.z - b.z) < eps;
33
- }
34
-
35
- function damp(v, t, lambda, delta) {
36
- v.x = THREE.MathUtils.damp(v.x, t.x, lambda, delta);
37
- v.y = THREE.MathUtils.damp(v.y, t.y, lambda, delta);
38
- v.z = THREE.MathUtils.damp(v.z, t.z, lambda, delta);
39
- }
40
-
41
- const [current] = React.useState(() => ({
42
- animating: false,
43
- focus: new THREE.Vector3(),
44
- camera: new THREE.Vector3(),
45
- zoom: 1
46
- }));
47
- const [goal] = React.useState(() => ({
48
- focus: new THREE.Vector3(),
49
- camera: new THREE.Vector3(),
50
- zoom: 1
51
- }));
52
- const [box] = React.useState(() => new THREE.Box3());
53
- const api = React.useMemo(() => {
54
- function getSize() {
55
- const size = box.getSize(new THREE.Vector3());
56
- const center = box.getCenter(new THREE.Vector3());
57
- const maxSize = Math.max(size.x, size.y, size.z);
58
- const fitHeightDistance = isOrthographic(camera) ? maxSize * 4 : maxSize / (2 * Math.atan(Math.PI * camera.fov / 360));
59
- const fitWidthDistance = isOrthographic(camera) ? maxSize * 4 : fitHeightDistance / camera.aspect;
60
- const distance = margin * Math.max(fitHeightDistance, fitWidthDistance);
61
- return {
62
- box,
63
- size,
64
- center,
65
- distance
66
- };
67
- }
68
-
69
- return {
70
- getSize,
71
-
72
- refresh(object) {
73
- if (isBox3(object)) box.copy(object);else {
74
- const target = object || ref.current;
75
- target.updateWorldMatrix(true, true);
76
- box.setFromObject(target);
77
- }
78
-
79
- if (box.isEmpty()) {
80
- const max = camera.position.length() || 10;
81
- box.setFromCenterAndSize(new THREE.Vector3(), new THREE.Vector3(max, max, max));
82
- }
83
-
84
- if ((controls == null ? void 0 : controls.constructor.name) === 'OrthographicTrackballControls') {
85
- // Put camera on a sphere along which it should move
86
- const {
87
- distance
88
- } = getSize();
89
- const direction = camera.position.clone().sub(controls.target).normalize().multiplyScalar(distance);
90
- const newPos = controls.target.clone().add(direction);
91
- camera.position.copy(newPos);
92
- }
93
-
94
- return this;
95
- },
96
-
97
- clip() {
98
- const {
99
- distance
100
- } = getSize();
101
- if (controls) controls.maxDistance = distance * 10;
102
- camera.near = distance / 100;
103
- camera.far = distance * 100;
104
- camera.updateProjectionMatrix();
105
- if (controls) controls.update();
106
- invalidate();
107
- return this;
108
- },
109
-
110
- to({
111
- position,
112
- target
113
- }) {
114
- current.camera.copy(camera.position);
115
- const {
116
- center
117
- } = getSize();
118
- goal.camera.set(...position);
119
-
120
- if (target) {
121
- goal.focus.set(...target);
122
- } else {
123
- goal.focus.copy(center);
124
- }
125
-
126
- if (damping) {
127
- current.animating = true;
128
- } else {
129
- camera.position.set(...position);
130
- }
131
-
132
- return this;
133
- },
134
-
135
- fit() {
136
- current.camera.copy(camera.position);
137
- if (controls) current.focus.copy(controls.target);
138
- const {
139
- center,
140
- distance
141
- } = getSize();
142
- const direction = center.clone().sub(camera.position).normalize().multiplyScalar(distance);
143
- goal.camera.copy(center).sub(direction);
144
- goal.focus.copy(center);
145
-
146
- if (isOrthographic(camera)) {
147
- current.zoom = camera.zoom;
148
- let maxHeight = 0,
149
- maxWidth = 0;
150
- const vertices = [new THREE.Vector3(box.min.x, box.min.y, box.min.z), new THREE.Vector3(box.min.x, box.max.y, box.min.z), new THREE.Vector3(box.min.x, box.min.y, box.max.z), new THREE.Vector3(box.min.x, box.max.y, box.max.z), new THREE.Vector3(box.max.x, box.max.y, box.max.z), new THREE.Vector3(box.max.x, box.max.y, box.min.z), new THREE.Vector3(box.max.x, box.min.y, box.max.z), new THREE.Vector3(box.max.x, box.min.y, box.min.z)]; // Transform the center and each corner to camera space
151
-
152
- center.applyMatrix4(camera.matrixWorldInverse);
153
-
154
- for (const v of vertices) {
155
- v.applyMatrix4(camera.matrixWorldInverse);
156
- maxHeight = Math.max(maxHeight, Math.abs(v.y - center.y));
157
- maxWidth = Math.max(maxWidth, Math.abs(v.x - center.x));
158
- }
159
-
160
- maxHeight *= 2;
161
- maxWidth *= 2;
162
- const zoomForHeight = (camera.top - camera.bottom) / maxHeight;
163
- const zoomForWidth = (camera.right - camera.left) / maxWidth;
164
- goal.zoom = Math.min(zoomForHeight, zoomForWidth) / margin;
165
-
166
- if (!damping) {
167
- camera.zoom = goal.zoom;
168
- camera.updateProjectionMatrix();
169
- }
170
- }
171
-
172
- if (damping) {
173
- current.animating = true;
174
- } else {
175
- camera.position.copy(goal.camera);
176
- camera.lookAt(goal.focus);
177
-
178
- if (controls) {
179
- controls.target.copy(goal.focus);
180
- controls.update();
181
- }
182
- }
183
-
184
- if (onFitRef.current) onFitRef.current(this.getSize());
185
- invalidate();
186
- return this;
187
- }
188
-
189
- };
190
- }, [box, camera, controls, margin, damping, invalidate]);
191
- React.useLayoutEffect(() => {
192
- if (controls) {
193
- // Try to prevent drag hijacking
194
- const callback = () => current.animating = false;
195
-
196
- controls.addEventListener('start', callback);
197
- return () => controls.removeEventListener('start', callback);
198
- }
199
- }, [controls]); // Scale pointer on window resize
200
-
201
- const count = React.useRef(0);
202
- React.useLayoutEffect(() => {
203
- if (observe || count.current++ === 0) {
204
- api.refresh();
205
- if (fit) api.fit();
206
- if (clip) api.clip();
207
- }
208
- }, [size, clip, fit, observe, camera, controls]);
209
- useFrame((state, delta) => {
210
- if (current.animating) {
211
- damp(current.focus, goal.focus, damping, delta);
212
- damp(current.camera, goal.camera, damping, delta);
213
- current.zoom = THREE.MathUtils.damp(current.zoom, goal.zoom, damping, delta);
214
- camera.position.copy(current.camera);
215
-
216
- if (isOrthographic(camera)) {
217
- camera.zoom = current.zoom;
218
- camera.updateProjectionMatrix();
219
- }
220
-
221
- if (!controls) {
222
- camera.lookAt(current.focus);
223
- } else {
224
- controls.target.copy(current.focus);
225
- controls.update();
226
- }
227
-
228
- invalidate();
229
- if (isOrthographic(camera) && !(Math.abs(current.zoom - goal.zoom) < eps)) return;
230
- if (!isOrthographic(camera) && !equals(current.camera, goal.camera)) return;
231
- if (controls && !equals(current.focus, goal.focus)) return;
232
- current.animating = false;
233
- }
234
- });
235
- return /*#__PURE__*/React.createElement("group", {
236
- ref: ref
237
- }, /*#__PURE__*/React.createElement(context.Provider, {
238
- value: api
239
- }, children));
240
- }
241
- function useBounds() {
242
- return React.useContext(context);
243
- }
244
-
245
- export { Bounds, useBounds };
@@ -1,92 +0,0 @@
1
- import _extends from '@babel/runtime/helpers/esm/extends';
2
- import * as THREE from 'three';
3
- import * as React from 'react';
4
- import { forwardRef, useMemo, useEffect } from 'react';
5
- import { extend, useThree, useFrame } from '@react-three/fiber';
6
- import CameraControlsImpl from 'camera-controls';
7
-
8
- const CameraControls = /*#__PURE__*/forwardRef((props, ref) => {
9
- useMemo(() => {
10
- CameraControlsImpl.install({
11
- THREE
12
- });
13
- extend({
14
- CameraControlsImpl
15
- });
16
- }, []);
17
- const {
18
- camera,
19
- domElement,
20
- makeDefault,
21
- onStart,
22
- onEnd,
23
- onChange,
24
- regress,
25
- ...restProps
26
- } = props;
27
- const defaultCamera = useThree(state => state.camera);
28
- const gl = useThree(state => state.gl);
29
- const invalidate = useThree(state => state.invalidate);
30
- const events = useThree(state => state.events);
31
- const setEvents = useThree(state => state.setEvents);
32
- const set = useThree(state => state.set);
33
- const get = useThree(state => state.get);
34
- const performance = useThree(state => state.performance);
35
- const explCamera = camera || defaultCamera;
36
- const explDomElement = domElement || events.connected || gl.domElement;
37
- const controls = useMemo(() => new CameraControlsImpl(explCamera), [explCamera]);
38
- useFrame((state, delta) => {
39
- if (controls.enabled) controls.update(delta);
40
- }, -1);
41
- useEffect(() => {
42
- controls.connect(explDomElement);
43
- return () => void controls.disconnect();
44
- }, [explDomElement, controls]);
45
- React.useEffect(() => {
46
- const callback = e => {
47
- invalidate();
48
- if (regress) performance.regress();
49
- if (onChange) onChange(e);
50
- };
51
-
52
- const onStartCb = e => {
53
- if (onStart) onStart(e);
54
- };
55
-
56
- const onEndCb = e => {
57
- if (onEnd) onEnd(e);
58
- };
59
-
60
- controls.addEventListener('update', callback);
61
- controls.addEventListener('controlstart', onStartCb);
62
- controls.addEventListener('controlend', onEndCb);
63
- controls.addEventListener('control', callback);
64
- controls.addEventListener('transitionstart', callback);
65
- controls.addEventListener('wake', callback);
66
- return () => {
67
- controls.removeEventListener('update', callback);
68
- controls.removeEventListener('controlstart', onStartCb);
69
- controls.removeEventListener('controlend', onEndCb);
70
- controls.removeEventListener('control', callback);
71
- controls.removeEventListener('transitionstart', callback);
72
- controls.removeEventListener('wake', callback);
73
- };
74
- }, [controls, onStart, onEnd, invalidate, setEvents, regress, onChange]);
75
- useEffect(() => {
76
- if (makeDefault) {
77
- const old = get().controls;
78
- set({
79
- controls: controls
80
- });
81
- return () => set({
82
- controls: old
83
- });
84
- }
85
- }, [makeDefault, controls]);
86
- return /*#__PURE__*/React.createElement("primitive", _extends({
87
- ref: ref,
88
- object: controls
89
- }, restProps));
90
- });
91
-
92
- export { CameraControls };
@@ -1,61 +0,0 @@
1
- import * as React from 'react';
2
- import { useThree, useFrame } from '@react-three/fiber';
3
- import { SimplexNoise } from 'three-stdlib';
4
-
5
- const CameraShake = /*#__PURE__*/React.forwardRef(({
6
- intensity = 1,
7
- decay,
8
- decayRate = 0.65,
9
- maxYaw = 0.1,
10
- maxPitch = 0.1,
11
- maxRoll = 0.1,
12
- yawFrequency = 0.1,
13
- pitchFrequency = 0.1,
14
- rollFrequency = 0.1
15
- }, ref) => {
16
- const camera = useThree(state => state.camera);
17
- const defaultControls = useThree(state => state.controls);
18
- const intensityRef = React.useRef(intensity);
19
- const initialRotation = React.useRef(camera.rotation.clone());
20
- const [yawNoise] = React.useState(() => new SimplexNoise());
21
- const [pitchNoise] = React.useState(() => new SimplexNoise());
22
- const [rollNoise] = React.useState(() => new SimplexNoise());
23
-
24
- const constrainIntensity = () => {
25
- if (intensityRef.current < 0 || intensityRef.current > 1) {
26
- intensityRef.current = intensityRef.current < 0 ? 0 : 1;
27
- }
28
- };
29
-
30
- React.useImperativeHandle(ref, () => ({
31
- getIntensity: () => intensityRef.current,
32
- setIntensity: val => {
33
- intensityRef.current = val;
34
- constrainIntensity();
35
- }
36
- }), []);
37
- React.useEffect(() => {
38
- if (defaultControls) {
39
- const callback = () => void (initialRotation.current = camera.rotation.clone());
40
-
41
- defaultControls.addEventListener('change', callback);
42
- callback();
43
- return () => void defaultControls.removeEventListener('change', callback);
44
- }
45
- }, [camera, defaultControls]);
46
- useFrame((state, delta) => {
47
- const shake = Math.pow(intensityRef.current, 2);
48
- const yaw = maxYaw * shake * yawNoise.noise(state.clock.elapsedTime * yawFrequency, 1);
49
- const pitch = maxPitch * shake * pitchNoise.noise(state.clock.elapsedTime * pitchFrequency, 1);
50
- const roll = maxRoll * shake * rollNoise.noise(state.clock.elapsedTime * rollFrequency, 1);
51
- camera.rotation.set(initialRotation.current.x + pitch, initialRotation.current.y + yaw, initialRotation.current.z + roll);
52
-
53
- if (decay && intensityRef.current > 0) {
54
- intensityRef.current -= decayRate * delta;
55
- constrainIntensity();
56
- }
57
- });
58
- return null;
59
- });
60
-
61
- export { CameraShake };