@react-three/fiber 9.6.0 → 9.6.1
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.
- package/CHANGELOG.md +1204 -1198
- package/dist/declarations/src/core/events.d.ts +94 -92
- package/dist/declarations/src/core/hooks.d.ts +53 -53
- package/dist/declarations/src/core/index.d.ts +13 -13
- package/dist/declarations/src/core/loop.d.ts +31 -31
- package/dist/declarations/src/core/reconciler.d.ts +50 -50
- package/dist/declarations/src/core/renderer.d.ts +89 -89
- package/dist/declarations/src/core/store.d.ts +130 -130
- package/dist/declarations/src/core/utils.d.ts +262 -262
- package/dist/declarations/src/index.d.ts +6 -6
- package/dist/declarations/src/native/Canvas.d.ts +13 -13
- package/dist/declarations/src/native/events.d.ts +4 -4
- package/dist/declarations/src/native.d.ts +6 -6
- package/dist/declarations/src/three-types.d.ts +68 -68
- package/dist/declarations/src/web/Canvas.d.ts +23 -23
- package/dist/declarations/src/web/events.d.ts +4 -4
- package/dist/{events-11ca7a92.cjs.prod.js → events-583399dd.cjs.prod.js} +118 -87
- package/dist/{events-760a1017.esm.js → events-b389eeca.esm.js} +118 -87
- package/dist/{events-508aad4b.cjs.dev.js → events-f19bcc32.cjs.dev.js} +118 -87
- package/dist/react-three-fiber.cjs.dev.js +4 -4
- package/dist/react-three-fiber.cjs.prod.js +4 -4
- package/dist/react-three-fiber.esm.js +5 -5
- package/native/dist/react-three-fiber-native.cjs.dev.js +4 -4
- package/native/dist/react-three-fiber-native.cjs.prod.js +4 -4
- package/native/dist/react-three-fiber-native.esm.js +5 -5
- package/native/package.json +5 -5
- package/package.json +1 -1
- package/readme.md +253 -253
|
@@ -1,68 +1,68 @@
|
|
|
1
|
-
import type * as THREE from 'three';
|
|
2
|
-
import type { Args, EventHandlers, InstanceProps, ConstructorRepresentation } from "./core/index.js";
|
|
3
|
-
import type { Overwrite, Mutable } from "./core/utils.js";
|
|
4
|
-
type MutableOrReadonlyParameters<T extends (...args: any) => any> = Parameters<T> | Readonly<Parameters<T>>;
|
|
5
|
-
export interface MathRepresentation {
|
|
6
|
-
set(...args: number[]): any;
|
|
7
|
-
}
|
|
8
|
-
export interface VectorRepresentation extends MathRepresentation {
|
|
9
|
-
setScalar(value: number): any;
|
|
10
|
-
}
|
|
11
|
-
export type MathTypes = MathRepresentation | THREE.Euler | THREE.Color;
|
|
12
|
-
export type MathType<T extends MathTypes> = T extends THREE.Color ? Args<typeof THREE.Color> | THREE.ColorRepresentation : T extends VectorRepresentation | THREE.Layers | THREE.Euler ? T | MutableOrReadonlyParameters<T['set']> | number : T | MutableOrReadonlyParameters<T['set']>;
|
|
13
|
-
export type MathProps<P> = {
|
|
14
|
-
[K in keyof P as P[K] extends MathTypes ? K : never]: P[K] extends MathTypes ? MathType<P[K]> : never;
|
|
15
|
-
};
|
|
16
|
-
export type Vector2 = MathType<THREE.Vector2>;
|
|
17
|
-
export type Vector3 = MathType<THREE.Vector3>;
|
|
18
|
-
export type Vector4 = MathType<THREE.Vector4>;
|
|
19
|
-
export type Color = MathType<THREE.Color>;
|
|
20
|
-
export type Layers = MathType<THREE.Layers>;
|
|
21
|
-
export type Quaternion = MathType<THREE.Quaternion>;
|
|
22
|
-
export type Euler = MathType<THREE.Euler>;
|
|
23
|
-
export type Matrix3 = MathType<THREE.Matrix3>;
|
|
24
|
-
export type Matrix4 = MathType<THREE.Matrix4>;
|
|
25
|
-
export interface RaycastableRepresentation {
|
|
26
|
-
raycast(raycaster: THREE.Raycaster, intersects: THREE.Intersection[]): void;
|
|
27
|
-
}
|
|
28
|
-
export type EventProps<P> = P extends RaycastableRepresentation ? Partial<EventHandlers> : {};
|
|
29
|
-
export interface ReactProps<P> {
|
|
30
|
-
children?: React.ReactNode;
|
|
31
|
-
ref?: React.Ref<P>;
|
|
32
|
-
key?: React.Key;
|
|
33
|
-
}
|
|
34
|
-
export type ElementProps<T extends ConstructorRepresentation, P = InstanceType<T>> = Partial<Overwrite<P, MathProps<P> & ReactProps<P> & EventProps<P>>>;
|
|
35
|
-
export type ThreeElement<T extends ConstructorRepresentation> = Mutable<Overwrite<ElementProps<T>, Omit<InstanceProps<InstanceType<T>, T>, 'object'>>>;
|
|
36
|
-
export type ThreeToJSXElements<T extends Record<string, any>> = {
|
|
37
|
-
[K in keyof T & string as Uncapitalize<K>]: T[K] extends ConstructorRepresentation ? ThreeElement<T[K]> : never;
|
|
38
|
-
};
|
|
39
|
-
type ThreeExports = typeof THREE;
|
|
40
|
-
type ThreeElementsImpl = ThreeToJSXElements<ThreeExports>;
|
|
41
|
-
export interface ThreeElements extends Omit<ThreeElementsImpl, 'audio' | 'source' | 'line' | 'path'> {
|
|
42
|
-
primitive: Omit<ThreeElement<any>, 'args'> & {
|
|
43
|
-
object: object;
|
|
44
|
-
};
|
|
45
|
-
threeAudio: ThreeElementsImpl['audio'];
|
|
46
|
-
threeSource: ThreeElementsImpl['source'];
|
|
47
|
-
threeLine: ThreeElementsImpl['line'];
|
|
48
|
-
threePath: ThreeElementsImpl['path'];
|
|
49
|
-
}
|
|
50
|
-
declare module 'react' {
|
|
51
|
-
namespace JSX {
|
|
52
|
-
interface IntrinsicElements extends ThreeElements {
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
declare module 'react/jsx-runtime' {
|
|
57
|
-
namespace JSX {
|
|
58
|
-
interface IntrinsicElements extends ThreeElements {
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
declare module 'react/jsx-dev-runtime' {
|
|
63
|
-
namespace JSX {
|
|
64
|
-
interface IntrinsicElements extends ThreeElements {
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
export {};
|
|
1
|
+
import type * as THREE from 'three';
|
|
2
|
+
import type { Args, EventHandlers, InstanceProps, ConstructorRepresentation } from "./core/index.js";
|
|
3
|
+
import type { Overwrite, Mutable } from "./core/utils.js";
|
|
4
|
+
type MutableOrReadonlyParameters<T extends (...args: any) => any> = Parameters<T> | Readonly<Parameters<T>>;
|
|
5
|
+
export interface MathRepresentation {
|
|
6
|
+
set(...args: number[]): any;
|
|
7
|
+
}
|
|
8
|
+
export interface VectorRepresentation extends MathRepresentation {
|
|
9
|
+
setScalar(value: number): any;
|
|
10
|
+
}
|
|
11
|
+
export type MathTypes = MathRepresentation | THREE.Euler | THREE.Color;
|
|
12
|
+
export type MathType<T extends MathTypes> = T extends THREE.Color ? Args<typeof THREE.Color> | THREE.ColorRepresentation : T extends VectorRepresentation | THREE.Layers | THREE.Euler ? T | MutableOrReadonlyParameters<T['set']> | number : T | MutableOrReadonlyParameters<T['set']>;
|
|
13
|
+
export type MathProps<P> = {
|
|
14
|
+
[K in keyof P as P[K] extends MathTypes ? K : never]: P[K] extends MathTypes ? MathType<P[K]> : never;
|
|
15
|
+
};
|
|
16
|
+
export type Vector2 = MathType<THREE.Vector2>;
|
|
17
|
+
export type Vector3 = MathType<THREE.Vector3>;
|
|
18
|
+
export type Vector4 = MathType<THREE.Vector4>;
|
|
19
|
+
export type Color = MathType<THREE.Color>;
|
|
20
|
+
export type Layers = MathType<THREE.Layers>;
|
|
21
|
+
export type Quaternion = MathType<THREE.Quaternion>;
|
|
22
|
+
export type Euler = MathType<THREE.Euler>;
|
|
23
|
+
export type Matrix3 = MathType<THREE.Matrix3>;
|
|
24
|
+
export type Matrix4 = MathType<THREE.Matrix4>;
|
|
25
|
+
export interface RaycastableRepresentation {
|
|
26
|
+
raycast(raycaster: THREE.Raycaster, intersects: THREE.Intersection[]): void;
|
|
27
|
+
}
|
|
28
|
+
export type EventProps<P> = P extends RaycastableRepresentation ? Partial<EventHandlers> : {};
|
|
29
|
+
export interface ReactProps<P> {
|
|
30
|
+
children?: React.ReactNode;
|
|
31
|
+
ref?: React.Ref<P>;
|
|
32
|
+
key?: React.Key;
|
|
33
|
+
}
|
|
34
|
+
export type ElementProps<T extends ConstructorRepresentation, P = InstanceType<T>> = Partial<Overwrite<P, MathProps<P> & ReactProps<P> & EventProps<P>>>;
|
|
35
|
+
export type ThreeElement<T extends ConstructorRepresentation> = Mutable<Overwrite<ElementProps<T>, Omit<InstanceProps<InstanceType<T>, T>, 'object'>>>;
|
|
36
|
+
export type ThreeToJSXElements<T extends Record<string, any>> = {
|
|
37
|
+
[K in keyof T & string as Uncapitalize<K>]: T[K] extends ConstructorRepresentation ? ThreeElement<T[K]> : never;
|
|
38
|
+
};
|
|
39
|
+
type ThreeExports = typeof THREE;
|
|
40
|
+
type ThreeElementsImpl = ThreeToJSXElements<ThreeExports>;
|
|
41
|
+
export interface ThreeElements extends Omit<ThreeElementsImpl, 'audio' | 'source' | 'line' | 'path'> {
|
|
42
|
+
primitive: Omit<ThreeElement<any>, 'args'> & {
|
|
43
|
+
object: object;
|
|
44
|
+
};
|
|
45
|
+
threeAudio: ThreeElementsImpl['audio'];
|
|
46
|
+
threeSource: ThreeElementsImpl['source'];
|
|
47
|
+
threeLine: ThreeElementsImpl['line'];
|
|
48
|
+
threePath: ThreeElementsImpl['path'];
|
|
49
|
+
}
|
|
50
|
+
declare module 'react' {
|
|
51
|
+
namespace JSX {
|
|
52
|
+
interface IntrinsicElements extends ThreeElements {
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
declare module 'react/jsx-runtime' {
|
|
57
|
+
namespace JSX {
|
|
58
|
+
interface IntrinsicElements extends ThreeElements {
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
declare module 'react/jsx-dev-runtime' {
|
|
63
|
+
namespace JSX {
|
|
64
|
+
interface IntrinsicElements extends ThreeElements {
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
export {};
|
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { Options as ResizeOptions } from 'react-use-measure';
|
|
3
|
-
import { RenderProps } from "../core/index.js";
|
|
4
|
-
export interface CanvasProps extends Omit<RenderProps<HTMLCanvasElement>, 'size'>, React.HTMLAttributes<HTMLDivElement> {
|
|
5
|
-
children?: React.ReactNode;
|
|
6
|
-
ref?: React.Ref<HTMLCanvasElement>;
|
|
7
|
-
/** Canvas fallback content, similar to img's alt prop */
|
|
8
|
-
fallback?: React.ReactNode;
|
|
9
|
-
/**
|
|
10
|
-
* Options to pass to useMeasure.
|
|
11
|
-
* @see https://github.com/pmndrs/react-use-measure#api
|
|
12
|
-
*/
|
|
13
|
-
resize?: ResizeOptions;
|
|
14
|
-
/** The target where events are being subscribed to, default: the div that wraps canvas */
|
|
15
|
-
eventSource?: HTMLElement | React.RefObject<HTMLElement>;
|
|
16
|
-
/** The event prefix that is cast into canvas pointer x/y events, default: "offset" */
|
|
17
|
-
eventPrefix?: 'offset' | 'client' | 'page' | 'layer' | 'screen';
|
|
18
|
-
}
|
|
19
|
-
/**
|
|
20
|
-
* A DOM canvas which accepts threejs elements as children.
|
|
21
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/canvas
|
|
22
|
-
*/
|
|
23
|
-
export declare function Canvas(props: CanvasProps): import("react/jsx-runtime").JSX.Element;
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Options as ResizeOptions } from 'react-use-measure';
|
|
3
|
+
import { RenderProps } from "../core/index.js";
|
|
4
|
+
export interface CanvasProps extends Omit<RenderProps<HTMLCanvasElement>, 'size'>, React.HTMLAttributes<HTMLDivElement> {
|
|
5
|
+
children?: React.ReactNode;
|
|
6
|
+
ref?: React.Ref<HTMLCanvasElement>;
|
|
7
|
+
/** Canvas fallback content, similar to img's alt prop */
|
|
8
|
+
fallback?: React.ReactNode;
|
|
9
|
+
/**
|
|
10
|
+
* Options to pass to useMeasure.
|
|
11
|
+
* @see https://github.com/pmndrs/react-use-measure#api
|
|
12
|
+
*/
|
|
13
|
+
resize?: ResizeOptions;
|
|
14
|
+
/** The target where events are being subscribed to, default: the div that wraps canvas */
|
|
15
|
+
eventSource?: HTMLElement | React.RefObject<HTMLElement>;
|
|
16
|
+
/** The event prefix that is cast into canvas pointer x/y events, default: "offset" */
|
|
17
|
+
eventPrefix?: 'offset' | 'client' | 'page' | 'layer' | 'screen';
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* A DOM canvas which accepts threejs elements as children.
|
|
21
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/canvas
|
|
22
|
+
*/
|
|
23
|
+
export declare function Canvas(props: CanvasProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { RootStore } from "../core/store.js";
|
|
2
|
-
import { EventManager } from "../core/events.js";
|
|
3
|
-
/** Default R3F event manager for web */
|
|
4
|
-
export declare function createPointerEvents(store: RootStore): EventManager<HTMLElement>;
|
|
1
|
+
import { RootStore } from "../core/store.js";
|
|
2
|
+
import { EventManager } from "../core/events.js";
|
|
3
|
+
/** Default R3F event manager for web */
|
|
4
|
+
export declare function createPointerEvents(store: RootStore): EventManager<HTMLElement>;
|
|
@@ -36,17 +36,17 @@ var threeTypes = /*#__PURE__*/Object.freeze({
|
|
|
36
36
|
__proto__: null
|
|
37
37
|
});
|
|
38
38
|
|
|
39
|
-
/**
|
|
40
|
-
* Returns the instance's initial (outmost) root.
|
|
39
|
+
/**
|
|
40
|
+
* Returns the instance's initial (outmost) root.
|
|
41
41
|
*/
|
|
42
42
|
function findInitialRoot(instance) {
|
|
43
43
|
let root = instance.root;
|
|
44
44
|
while (root.getState().previousRoot) root = root.getState().previousRoot;
|
|
45
45
|
return root;
|
|
46
46
|
}
|
|
47
|
-
/**
|
|
48
|
-
* Safely flush async effects when testing, simulating a legacy root.
|
|
49
|
-
* @deprecated Import from React instead. import { act } from 'react'
|
|
47
|
+
/**
|
|
48
|
+
* Safely flush async effects when testing, simulating a legacy root.
|
|
49
|
+
* @deprecated Import from React instead. import { act } from 'react'
|
|
50
50
|
*/
|
|
51
51
|
// Reference with computed key to break Webpack static analysis
|
|
52
52
|
// https://github.com/webpack/webpack/issues/14814
|
|
@@ -55,14 +55,14 @@ const isOrthographicCamera = def => def && def.isOrthographicCamera;
|
|
|
55
55
|
const isRef = obj => obj && obj.hasOwnProperty('current');
|
|
56
56
|
const isColorRepresentation = value => value != null && (typeof value === 'string' || typeof value === 'number' || value.isColor);
|
|
57
57
|
|
|
58
|
-
/**
|
|
59
|
-
* An SSR-friendly useLayoutEffect.
|
|
60
|
-
*
|
|
61
|
-
* React currently throws a warning when using useLayoutEffect on the server.
|
|
62
|
-
* To get around it, we can conditionally useEffect on the server (no-op) and
|
|
63
|
-
* useLayoutEffect elsewhere.
|
|
64
|
-
*
|
|
65
|
-
* @see https://github.com/facebook/react/issues/14927
|
|
58
|
+
/**
|
|
59
|
+
* An SSR-friendly useLayoutEffect.
|
|
60
|
+
*
|
|
61
|
+
* React currently throws a warning when using useLayoutEffect on the server.
|
|
62
|
+
* To get around it, we can conditionally useEffect on the server (no-op) and
|
|
63
|
+
* useLayoutEffect elsewhere.
|
|
64
|
+
*
|
|
65
|
+
* @see https://github.com/facebook/react/issues/14927
|
|
66
66
|
*/
|
|
67
67
|
const useIsomorphicLayoutEffect = /* @__PURE__ */((_window$document, _window$navigator) => typeof window !== 'undefined' && (((_window$document = window.document) == null ? void 0 : _window$document.createElement) || ((_window$navigator = window.navigator) == null ? void 0 : _window$navigator.product) === 'ReactNative'))() ? React__namespace.useLayoutEffect : React__namespace.useEffect;
|
|
68
68
|
function useMutableCallback(fn) {
|
|
@@ -70,8 +70,8 @@ function useMutableCallback(fn) {
|
|
|
70
70
|
useIsomorphicLayoutEffect(() => void (ref.current = fn), [fn]);
|
|
71
71
|
return ref;
|
|
72
72
|
}
|
|
73
|
-
/**
|
|
74
|
-
* Bridges renderer Context and StrictMode from a primary renderer.
|
|
73
|
+
/**
|
|
74
|
+
* Bridges renderer Context and StrictMode from a primary renderer.
|
|
75
75
|
*/
|
|
76
76
|
function useBridge() {
|
|
77
77
|
const fiber = itsFine.useFiber();
|
|
@@ -123,8 +123,8 @@ function calculateDpr(dpr) {
|
|
|
123
123
|
return Array.isArray(dpr) ? Math.min(Math.max(dpr[0], target), dpr[1]) : dpr;
|
|
124
124
|
}
|
|
125
125
|
|
|
126
|
-
/**
|
|
127
|
-
* Returns instance root state
|
|
126
|
+
/**
|
|
127
|
+
* Returns instance root state
|
|
128
128
|
*/
|
|
129
129
|
function getRootState(obj) {
|
|
130
130
|
var _r3f;
|
|
@@ -527,9 +527,9 @@ function makeId(event) {
|
|
|
527
527
|
return (event.eventObject || event.object).uuid + '/' + event.index + event.instanceId;
|
|
528
528
|
}
|
|
529
529
|
|
|
530
|
-
/**
|
|
531
|
-
* Release pointer captures.
|
|
532
|
-
* This is called by releasePointerCapture in the API, and when an object is removed.
|
|
530
|
+
/**
|
|
531
|
+
* Release pointer captures.
|
|
532
|
+
* This is called by releasePointerCapture in the API, and when an object is removed.
|
|
533
533
|
*/
|
|
534
534
|
function releaseInternalPointerCapture(capturedMap, obj, captures, pointerId) {
|
|
535
535
|
const captureData = captures.get(obj);
|
|
@@ -542,6 +542,37 @@ function releaseInternalPointerCapture(capturedMap, obj, captures, pointerId) {
|
|
|
542
542
|
}
|
|
543
543
|
}
|
|
544
544
|
}
|
|
545
|
+
|
|
546
|
+
/** This function transfers all interactivity state from one object instance to another. Used when swapping instances due to reconstruction. */
|
|
547
|
+
function swapInteractivity(store, object, newObject) {
|
|
548
|
+
const {
|
|
549
|
+
internal
|
|
550
|
+
} = store.getState();
|
|
551
|
+
for (let i = 0; i < internal.interaction.length; i++) {
|
|
552
|
+
if (internal.interaction[i] === object) internal.interaction[i] = newObject;
|
|
553
|
+
}
|
|
554
|
+
for (let i = 0; i < internal.initialHits.length; i++) {
|
|
555
|
+
if (internal.initialHits[i] === object) internal.initialHits[i] = newObject;
|
|
556
|
+
}
|
|
557
|
+
internal.hovered.forEach((value, key) => {
|
|
558
|
+
if (value.eventObject === object || value.object === object) {
|
|
559
|
+
internal.hovered.delete(key);
|
|
560
|
+
const next = {
|
|
561
|
+
...value,
|
|
562
|
+
eventObject: value.eventObject === object ? newObject : value.eventObject,
|
|
563
|
+
object: value.object === object ? newObject : value.object
|
|
564
|
+
};
|
|
565
|
+
internal.hovered.set(makeId(next), next);
|
|
566
|
+
}
|
|
567
|
+
});
|
|
568
|
+
internal.capturedMap.forEach(captures => {
|
|
569
|
+
const captureData = captures.get(object);
|
|
570
|
+
if (captureData) {
|
|
571
|
+
captures.delete(object);
|
|
572
|
+
captures.set(newObject, captureData);
|
|
573
|
+
}
|
|
574
|
+
});
|
|
575
|
+
}
|
|
545
576
|
function removeInteractivity(store, object) {
|
|
546
577
|
const {
|
|
547
578
|
internal
|
|
@@ -876,19 +907,19 @@ function createEvents(store) {
|
|
|
876
907
|
if (!(instance != null && instance.eventCount)) return;
|
|
877
908
|
const handlers = instance.handlers;
|
|
878
909
|
|
|
879
|
-
/*
|
|
880
|
-
MAYBE TODO, DELETE IF NOT:
|
|
881
|
-
Check if the object is captured, captured events should not have intersects running in parallel
|
|
882
|
-
But wouldn't it be better to just replace capturedMap with a single entry?
|
|
883
|
-
Also, are we OK with straight up making picking up multiple objects impossible?
|
|
884
|
-
|
|
885
|
-
const pointerId = (data as ThreeEvent<PointerEvent>).pointerId
|
|
886
|
-
if (pointerId !== undefined) {
|
|
887
|
-
const capturedMeshSet = internal.capturedMap.get(pointerId)
|
|
888
|
-
if (capturedMeshSet) {
|
|
889
|
-
const captured = capturedMeshSet.get(eventObject)
|
|
890
|
-
if (captured && captured.localState.stopped) return
|
|
891
|
-
}
|
|
910
|
+
/*
|
|
911
|
+
MAYBE TODO, DELETE IF NOT:
|
|
912
|
+
Check if the object is captured, captured events should not have intersects running in parallel
|
|
913
|
+
But wouldn't it be better to just replace capturedMap with a single entry?
|
|
914
|
+
Also, are we OK with straight up making picking up multiple objects impossible?
|
|
915
|
+
|
|
916
|
+
const pointerId = (data as ThreeEvent<PointerEvent>).pointerId
|
|
917
|
+
if (pointerId !== undefined) {
|
|
918
|
+
const capturedMeshSet = internal.capturedMap.get(pointerId)
|
|
919
|
+
if (capturedMeshSet) {
|
|
920
|
+
const captured = capturedMeshSet.get(eventObject)
|
|
921
|
+
if (captured && captured.localState.stopped) return
|
|
922
|
+
}
|
|
892
923
|
}*/
|
|
893
924
|
|
|
894
925
|
if (isPointerMove) {
|
|
@@ -1179,11 +1210,11 @@ const createStore = (invalidate, advance) => {
|
|
|
1179
1210
|
return rootStore;
|
|
1180
1211
|
};
|
|
1181
1212
|
|
|
1182
|
-
/**
|
|
1183
|
-
* Exposes an object's {@link Instance}.
|
|
1184
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#useInstanceHandle
|
|
1185
|
-
*
|
|
1186
|
-
* **Note**: this is an escape hatch to react-internal fields. Expect this to change significantly between versions.
|
|
1213
|
+
/**
|
|
1214
|
+
* Exposes an object's {@link Instance}.
|
|
1215
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#useInstanceHandle
|
|
1216
|
+
*
|
|
1217
|
+
* **Note**: this is an escape hatch to react-internal fields. Expect this to change significantly between versions.
|
|
1187
1218
|
*/
|
|
1188
1219
|
function useInstanceHandle(ref) {
|
|
1189
1220
|
const instance = React__namespace.useRef(null);
|
|
@@ -1191,9 +1222,9 @@ function useInstanceHandle(ref) {
|
|
|
1191
1222
|
return instance;
|
|
1192
1223
|
}
|
|
1193
1224
|
|
|
1194
|
-
/**
|
|
1195
|
-
* Returns the R3F Canvas' Zustand store. Useful for [transient updates](https://github.com/pmndrs/zustand#transient-updates-for-often-occurring-state-changes).
|
|
1196
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usestore
|
|
1225
|
+
/**
|
|
1226
|
+
* Returns the R3F Canvas' Zustand store. Useful for [transient updates](https://github.com/pmndrs/zustand#transient-updates-for-often-occurring-state-changes).
|
|
1227
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usestore
|
|
1197
1228
|
*/
|
|
1198
1229
|
function useStore() {
|
|
1199
1230
|
const store = React__namespace.useContext(context);
|
|
@@ -1201,18 +1232,18 @@ function useStore() {
|
|
|
1201
1232
|
return store;
|
|
1202
1233
|
}
|
|
1203
1234
|
|
|
1204
|
-
/**
|
|
1205
|
-
* Accesses R3F's internal state, containing renderer, canvas, scene, etc.
|
|
1206
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usethree
|
|
1235
|
+
/**
|
|
1236
|
+
* Accesses R3F's internal state, containing renderer, canvas, scene, etc.
|
|
1237
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usethree
|
|
1207
1238
|
*/
|
|
1208
1239
|
function useThree(selector = state => state, equalityFn) {
|
|
1209
1240
|
return useStore()(selector, equalityFn);
|
|
1210
1241
|
}
|
|
1211
1242
|
|
|
1212
|
-
/**
|
|
1213
|
-
* Executes a callback before render in a shared frame loop.
|
|
1214
|
-
* Can order effects with render priority or manually render with a positive priority.
|
|
1215
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useframe
|
|
1243
|
+
/**
|
|
1244
|
+
* Executes a callback before render in a shared frame loop.
|
|
1245
|
+
* Can order effects with render priority or manually render with a positive priority.
|
|
1246
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useframe
|
|
1216
1247
|
*/
|
|
1217
1248
|
function useFrame(callback, renderPriority = 0) {
|
|
1218
1249
|
const store = useStore();
|
|
@@ -1224,9 +1255,9 @@ function useFrame(callback, renderPriority = 0) {
|
|
|
1224
1255
|
return null;
|
|
1225
1256
|
}
|
|
1226
1257
|
|
|
1227
|
-
/**
|
|
1228
|
-
* Returns a node graph of an object with named nodes & materials.
|
|
1229
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usegraph
|
|
1258
|
+
/**
|
|
1259
|
+
* Returns a node graph of an object with named nodes & materials.
|
|
1260
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/hooks#usegraph
|
|
1230
1261
|
*/
|
|
1231
1262
|
function useGraph(object) {
|
|
1232
1263
|
return React__namespace.useMemo(() => buildGraph(object), [object]);
|
|
@@ -1262,11 +1293,11 @@ function loadingFn(extensions, onProgress) {
|
|
|
1262
1293
|
};
|
|
1263
1294
|
}
|
|
1264
1295
|
|
|
1265
|
-
/**
|
|
1266
|
-
* Synchronously loads and caches assets with a three loader.
|
|
1267
|
-
*
|
|
1268
|
-
* Note: this hook's caller must be wrapped with `React.Suspense`
|
|
1269
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useloader
|
|
1296
|
+
/**
|
|
1297
|
+
* Synchronously loads and caches assets with a three loader.
|
|
1298
|
+
*
|
|
1299
|
+
* Note: this hook's caller must be wrapped with `React.Suspense`
|
|
1300
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useloader
|
|
1270
1301
|
*/
|
|
1271
1302
|
function useLoader(loader, input, extensions, onProgress) {
|
|
1272
1303
|
// Use suspense to load async assets
|
|
@@ -1278,16 +1309,16 @@ function useLoader(loader, input, extensions, onProgress) {
|
|
|
1278
1309
|
return Array.isArray(input) ? results : results[0];
|
|
1279
1310
|
}
|
|
1280
1311
|
|
|
1281
|
-
/**
|
|
1282
|
-
* Preloads an asset into cache as a side-effect.
|
|
1312
|
+
/**
|
|
1313
|
+
* Preloads an asset into cache as a side-effect.
|
|
1283
1314
|
*/
|
|
1284
1315
|
useLoader.preload = function (loader, input, extensions) {
|
|
1285
1316
|
const keys = Array.isArray(input) ? input : [input];
|
|
1286
1317
|
return suspendReact.preload(loadingFn(extensions), [loader, ...keys]);
|
|
1287
1318
|
};
|
|
1288
1319
|
|
|
1289
|
-
/**
|
|
1290
|
-
* Removes a loaded asset from cache.
|
|
1320
|
+
/**
|
|
1321
|
+
* Removes a loaded asset from cache.
|
|
1291
1322
|
*/
|
|
1292
1323
|
useLoader.clear = function (loader, input) {
|
|
1293
1324
|
const keys = Array.isArray(input) ? input : [input];
|
|
@@ -1309,7 +1340,7 @@ useLoader.clear = function (loader, input) {
|
|
|
1309
1340
|
|
|
1310
1341
|
var packageData = {
|
|
1311
1342
|
name: "@react-three/fiber",
|
|
1312
|
-
version: "9.6.
|
|
1343
|
+
version: "9.6.1",
|
|
1313
1344
|
description: "A React renderer for Threejs",
|
|
1314
1345
|
keywords: [
|
|
1315
1346
|
"react",
|
|
@@ -7078,11 +7109,11 @@ function swapInstances() {
|
|
|
7078
7109
|
const target = catalogue[toPascalCase(instance.type)];
|
|
7079
7110
|
|
|
7080
7111
|
// Create object
|
|
7112
|
+
const prevObject = instance.object;
|
|
7081
7113
|
instance.object = (_instance$props$objec = instance.props.object) != null ? _instance$props$objec : new target(...((_instance$props$args = instance.props.args) != null ? _instance$props$args : []));
|
|
7082
7114
|
instance.object.__r3f = instance;
|
|
7083
7115
|
setFiberRef(fiber, instance.object);
|
|
7084
|
-
|
|
7085
|
-
// Set initial props
|
|
7116
|
+
swapInteractivity(findInitialRoot(instance), prevObject, instance.object);
|
|
7086
7117
|
applyProps(instance.object, instance.props);
|
|
7087
7118
|
if (instance.props.attach) {
|
|
7088
7119
|
attach(parent, instance);
|
|
@@ -7692,10 +7723,10 @@ function Portal({
|
|
|
7692
7723
|
children,
|
|
7693
7724
|
container
|
|
7694
7725
|
}) {
|
|
7695
|
-
/** This has to be a component because it would not be able to call useThree/useStore otherwise since
|
|
7696
|
-
* if this is our environment, then we are not in r3f's renderer but in react-dom, it would trigger
|
|
7697
|
-
* the "R3F hooks can only be used within the Canvas component!" warning:
|
|
7698
|
-
* <Canvas>
|
|
7726
|
+
/** This has to be a component because it would not be able to call useThree/useStore otherwise since
|
|
7727
|
+
* if this is our environment, then we are not in r3f's renderer but in react-dom, it would trigger
|
|
7728
|
+
* the "R3F hooks can only be used within the Canvas component!" warning:
|
|
7729
|
+
* <Canvas>
|
|
7699
7730
|
* {createPortal(...)} */
|
|
7700
7731
|
const {
|
|
7701
7732
|
events,
|
|
@@ -7776,11 +7807,11 @@ function Portal({
|
|
|
7776
7807
|
);
|
|
7777
7808
|
}
|
|
7778
7809
|
|
|
7779
|
-
/**
|
|
7780
|
-
* Force React to flush any updates inside the provided callback synchronously and immediately.
|
|
7781
|
-
* All the same caveats documented for react-dom's `flushSync` apply here (see https://react.dev/reference/react-dom/flushSync).
|
|
7782
|
-
* Nevertheless, sometimes one needs to render synchronously, for example to keep DOM and 3D changes in lock-step without
|
|
7783
|
-
* having to revert to a non-React solution. Note: this will only flush updates within the `Canvas` root.
|
|
7810
|
+
/**
|
|
7811
|
+
* Force React to flush any updates inside the provided callback synchronously and immediately.
|
|
7812
|
+
* All the same caveats documented for react-dom's `flushSync` apply here (see https://react.dev/reference/react-dom/flushSync).
|
|
7813
|
+
* Nevertheless, sometimes one needs to render synchronously, for example to keep DOM and 3D changes in lock-step without
|
|
7814
|
+
* having to revert to a non-React solution. Note: this will only flush updates within the `Canvas` root.
|
|
7784
7815
|
*/
|
|
7785
7816
|
function flushSync(fn) {
|
|
7786
7817
|
// @ts-ignore - reconciler types are not maintained
|
|
@@ -7798,21 +7829,21 @@ const globalEffects = new Set();
|
|
|
7798
7829
|
const globalAfterEffects = new Set();
|
|
7799
7830
|
const globalTailEffects = new Set();
|
|
7800
7831
|
|
|
7801
|
-
/**
|
|
7802
|
-
* Adds a global render callback which is called each frame.
|
|
7803
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addEffect
|
|
7832
|
+
/**
|
|
7833
|
+
* Adds a global render callback which is called each frame.
|
|
7834
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addEffect
|
|
7804
7835
|
*/
|
|
7805
7836
|
const addEffect = callback => createSubs(callback, globalEffects);
|
|
7806
7837
|
|
|
7807
|
-
/**
|
|
7808
|
-
* Adds a global after-render callback which is called each frame.
|
|
7809
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addAfterEffect
|
|
7838
|
+
/**
|
|
7839
|
+
* Adds a global after-render callback which is called each frame.
|
|
7840
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addAfterEffect
|
|
7810
7841
|
*/
|
|
7811
7842
|
const addAfterEffect = callback => createSubs(callback, globalAfterEffects);
|
|
7812
7843
|
|
|
7813
|
-
/**
|
|
7814
|
-
* Adds a global callback which is called when rendering stops.
|
|
7815
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addTail
|
|
7844
|
+
/**
|
|
7845
|
+
* Adds a global callback which is called when rendering stops.
|
|
7846
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#addTail
|
|
7816
7847
|
*/
|
|
7817
7848
|
const addTail = callback => createSubs(callback, globalTailEffects);
|
|
7818
7849
|
function run(effects, timestamp) {
|
|
@@ -7900,9 +7931,9 @@ function loop(timestamp) {
|
|
|
7900
7931
|
}
|
|
7901
7932
|
}
|
|
7902
7933
|
|
|
7903
|
-
/**
|
|
7904
|
-
* Invalidates the view, requesting a frame to be rendered. Will globally invalidate unless passed a root's state.
|
|
7905
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#invalidate
|
|
7934
|
+
/**
|
|
7935
|
+
* Invalidates the view, requesting a frame to be rendered. Will globally invalidate unless passed a root's state.
|
|
7936
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#invalidate
|
|
7906
7937
|
*/
|
|
7907
7938
|
function invalidate(state, frames = 1) {
|
|
7908
7939
|
var _state$gl$xr2;
|
|
@@ -7929,9 +7960,9 @@ function invalidate(state, frames = 1) {
|
|
|
7929
7960
|
}
|
|
7930
7961
|
}
|
|
7931
7962
|
|
|
7932
|
-
/**
|
|
7933
|
-
* Advances the frameloop and runs render effects, useful for when manually rendering via `frameloop="never"`.
|
|
7934
|
-
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#advance
|
|
7963
|
+
/**
|
|
7964
|
+
* Advances the frameloop and runs render effects, useful for when manually rendering via `frameloop="never"`.
|
|
7965
|
+
* @see https://docs.pmnd.rs/react-three-fiber/api/additional-exports#advance
|
|
7935
7966
|
*/
|
|
7936
7967
|
function advance(timestamp, runGlobalEffects = true, state, frame) {
|
|
7937
7968
|
if (runGlobalEffects) flushGlobalEffects('before', timestamp);
|