@react-three/fiber 8.0.0-beta-02 → 8.0.0-beta-03

package/CHANGELOG.md

@@ -1,5 +1,41 @@
 # @react-three/fiber
 
+## 7.0.23
+
+### Patch Changes
+
+- 30d38b1: remove logs
+
+## 7.0.22
+
+### Patch Changes
+
+- 259e1fa: add camera:manual
+
+## 7.0.21
+
+### Patch Changes
+
+- 65e4147: up usemeasure, add last event to internals"
+
+## 7.0.20
+
+### Patch Changes
+
+- 54cb0fd: update react-use-measure, allow it to use the offsetSize
+
+## 7.0.19
+
+### Patch Changes
+
+- 7aa2eab: fix: remove zustand subcribe selector
+
+## 7.0.18
+
+### Patch Changes
+
+- 6780f58: fix unmount pointer capture
+
 ## 7.0.17
 
 ### Patch Changes

package/dist/declarations/src/core/events.d.ts

@@ -4,7 +4,7 @@ import type { RootState } from './store';
 export interface Intersection extends THREE.Intersection {
     eventObject: THREE.Object3D;
 }
-export interface IntesectionEvent<TSourceEvent> extends Intersection {
+export interface IntersectionEvent<TSourceEvent> extends Intersection {
     intersections: Intersection[];
     stopped: boolean;
     unprojectedPoint: THREE.Vector3;
@@ -18,8 +18,8 @@ export interface IntesectionEvent<TSourceEvent> extends Intersection {
     spaceY: number;
 }
 export declare type Camera = THREE.OrthographicCamera | THREE.PerspectiveCamera;
-export declare type ThreeEvent<TEvent> = TEvent & IntesectionEvent<TEvent>;
-export declare type DomEvent = ThreeEvent<PointerEvent | MouseEvent | WheelEvent>;
+export declare type ThreeEvent<TEvent> = IntersectionEvent<TEvent>;
+export declare type DomEvent = PointerEvent | MouseEvent | WheelEvent;
 export declare type Events = {
     onClick: EventListener;
     onContextMenu: EventListener;
@@ -43,7 +43,7 @@ export declare type EventHandlers = {
     onPointerEnter?: (event: ThreeEvent<PointerEvent>) => void;
     onPointerLeave?: (event: ThreeEvent<PointerEvent>) => void;
     onPointerMove?: (event: ThreeEvent<PointerEvent>) => void;
-    onPointerMissed?: (event: ThreeEvent<PointerEvent>) => void;
+    onPointerMissed?: (event: MouseEvent) => void;
     onPointerCancel?: (event: ThreeEvent<PointerEvent>) => void;
     onWheel?: (event: ThreeEvent<WheelEvent>) => void;
 };

package/dist/declarations/src/core/renderer.d.ts

@@ -15,17 +15,17 @@ export declare type LocalState = {
     primitive?: boolean;
     eventCount: number;
     handlers: Partial<EventHandlers>;
+    attach?: AttachType;
+    previousAttach?: any;
     memoizedProps: {
         [key: string]: any;
     };
 };
-export declare type AttachFnType = (self: Instance, parent: Instance) => void;
-export declare type AttachFnsType = [attach: string | AttachFnType, detach: string | AttachFnType];
+export declare type AttachFnType = (parent: Instance, self: Instance) => void;
+export declare type AttachType = string | [attach: string | AttachFnType, detach: string | AttachFnType];
 export declare type BaseInstance = Omit<THREE.Object3D, 'children' | 'attach' | 'add' | 'remove' | 'raycast'> & {
     __r3f: LocalState;
     children: Instance[];
-    attach?: string;
-    attachFns?: AttachFnsType;
     remove: (...object: Instance[]) => Instance;
     add: (...object: Instance[]) => Instance;
     raycast?: (raycaster: THREE.Raycaster, intersects: THREE.Intersection[]) => void;
@@ -40,7 +40,7 @@ export declare type InstanceProps = {
     object?: object;
     visible?: boolean;
     dispose?: null;
-    attach?: string;
+    attach?: AttachType;
 };
 declare let extend: (objects: object) => void;
 declare function createRenderer<TCanvas>(roots: Map<TCanvas, Root>, getEventPriority?: () => any): {

package/dist/declarations/src/core/store.d.ts

@@ -47,8 +47,9 @@ export declare type InternalState = {
     priority: number;
     frames: number;
     lastProps: StoreProps;
+    lastEvent: React.MutableRefObject<DomEvent | null>;
     interaction: THREE.Object3D[];
-    hovered: Map<string, DomEvent>;
+    hovered: Map<string, ThreeEvent<DomEvent>>;
     subscribers: Subscription[];
     capturedMap: Map<number, Map<THREE.Object3D, PointerCaptureTarget>>;
     initialClick: [x: number, y: number];
@@ -62,7 +63,9 @@ export declare type InternalState = {
 export declare type RootState = {
     gl: THREE.WebGLRenderer;
     scene: THREE.Scene;
-    camera: Camera;
+    camera: Camera & {
+        manual?: boolean;
+    };
     controls: THREE.EventDispatcher | null;
     raycaster: Raycaster;
     mouse: THREE.Vector2;
@@ -81,7 +84,8 @@ export declare type RootState = {
     advance: (timestamp: number, runGlobalEffects?: boolean) => void;
     setSize: (width: number, height: number) => void;
     setDpr: (dpr: Dpr) => void;
-    onPointerMissed?: (event: ThreeEvent<PointerEvent>) => void;
+    setFrameloop: (frameloop?: 'always' | 'demand' | 'never') => void;
+    onPointerMissed?: (event: MouseEvent) => void;
     events: EventManager<any>;
     internal: InternalState;
 };
@@ -102,8 +106,10 @@ export declare type StoreProps = {
     dpr?: Dpr;
     clock?: THREE.Clock;
     raycaster?: Partial<Raycaster>;
-    camera?: Camera | Partial<ReactThreeFiber.Object3DNode<THREE.Camera, typeof THREE.Camera> & ReactThreeFiber.Object3DNode<THREE.PerspectiveCamera, typeof THREE.PerspectiveCamera> & ReactThreeFiber.Object3DNode<THREE.OrthographicCamera, typeof THREE.OrthographicCamera>>;
-    onPointerMissed?: (event: ThreeEvent<PointerEvent>) => void;
+    camera?: (Camera | Partial<ReactThreeFiber.Object3DNode<THREE.Camera, typeof THREE.Camera> & ReactThreeFiber.Object3DNode<THREE.PerspectiveCamera, typeof THREE.PerspectiveCamera> & ReactThreeFiber.Object3DNode<THREE.OrthographicCamera, typeof THREE.OrthographicCamera>>) & {
+        manual?: boolean;
+    };
+    onPointerMissed?: (event: MouseEvent) => void;
 };
 export declare type ApplyProps = (instance: Instance, newProps: InstanceProps) => void;
 declare const context: React.Context<UseStore<RootState>>;

package/dist/declarations/src/core/utils.d.ts

@@ -1,5 +1,5 @@
 import * as THREE from 'three';
-import { Instance, InstanceProps, LocalState } from './renderer';
+import { AttachType, Instance, InstanceProps, LocalState } from './renderer';
 import { Dpr } from './store';
 export declare const DEFAULT = "__default";
 export declare type DiffSet = {
@@ -21,6 +21,11 @@ export declare type ObjectMap = {
     };
 };
 export declare function calculateDpr(dpr: Dpr): number;
+export declare function filterKeys<TObj extends {
+    [key: string]: any;
+}, TOmit extends boolean, TKey extends keyof TObj>(obj: TObj, omit: TOmit, ...keys: TKey[]): TOmit extends true ? Omit<TObj, TKey> : Pick<TObj, TKey>;
+export declare const pick: <TObj>(obj: Partial<TObj>, keys: (keyof TObj)[]) => Pick<Partial<TObj>, keyof TObj>;
+export declare const omit: <TObj>(obj: Partial<TObj>, keys: (keyof TObj)[]) => Omit<Partial<TObj>, keyof TObj>;
 export declare const is: {
     obj: (a: any) => boolean;
     fun: (a: any) => a is Function;
@@ -37,6 +42,8 @@ export declare function dispose<TObj extends {
     [key: string]: any;
 }>(obj: TObj): void;
 export declare function prepare<T = THREE.Object3D>(object: T, state?: Partial<LocalState>): T;
+export declare function attach(parent: Instance, child: Instance, type: AttachType): void;
+export declare function detach(parent: Instance, child: Instance, type: AttachType): void;
 export declare function diffProps(instance: Instance, { children: cN, key: kN, ref: rN, ...props }: InstanceProps, { children: cP, key: kP, ref: rP, ...previous }?: InstanceProps, remove?: boolean): DiffSet;
 export declare function applyProps(instance: Instance, data: InstanceProps | DiffSet): void;
 export declare function invalidateInstance(instance: Instance): void;

package/dist/declarations/src/index.d.ts

@@ -3,5 +3,6 @@ import * as ReactThreeFiber from './three-types';
 export { ReactThreeFiber };
 export type { Intersection, Subscription, Dpr, Size, Viewport, Camera, RenderCallback, Performance, RootState, } from './core/store';
 export type { ThreeEvent, Events, EventManager } from './core/events';
-export type { Props } from './web/Canvas';
+export type { ObjectMap } from './core/utils';
+export * from './web/Canvas';
 export * from './web';

package/dist/declarations/src/native/index.d.ts

@@ -7,7 +7,6 @@ import { Renderer, StoreProps, context, RootState, Size } from '../core/store';
 import { extend, Root } from '../core/renderer';
 import { addEffect, addAfterEffect, addTail } from '../core/loop';
 import { createTouchEvents as events } from './events';
-import { Canvas } from './Canvas';
 import { EventManager } from '../core/events';
 import { View } from 'react-native';
 import { ExpoWebGLRenderingContext } from 'expo-gl';
@@ -29,9 +28,9 @@ declare function createRoot<TView extends View>(context: GLContext, config?: Ren
     render: (element: React.ReactNode) => UseStore<RootState>;
     unmount: () => void;
 };
-declare function render<TView extends View>(element: React.ReactNode, context: GLContext, { gl, size, events, onCreated, ...props }?: RenderProps<TView>): UseStore<RootState>;
+declare function render<TView extends View>(element: React.ReactNode, context: GLContext, config?: RenderProps<TView>): UseStore<RootState>;
 declare function unmountComponentAtNode(context: GLContext, callback?: (context: GLContext) => void): void;
-declare const act: (callback: () => import("react-reconciler").Thenable<unknown>) => import("react-reconciler").Thenable<void>;
+declare const act: any;
 declare function createPortal(children: React.ReactNode, container: THREE.Object3D): React.ReactNode;
 export * from './hooks';
-export { context, render, createRoot, unmountComponentAtNode, createPortal, events, reconciler, applyProps, dispose, invalidate, advance, extend, addEffect, addAfterEffect, addTail, Canvas, act, roots as _roots, };
+export { context, render, createRoot, unmountComponentAtNode, createPortal, events, reconciler, applyProps, dispose, invalidate, advance, extend, addEffect, addAfterEffect, addTail, act, roots as _roots, };

package/dist/declarations/src/native.d.ts

@@ -3,5 +3,6 @@ import * as ReactThreeFiber from './three-types';
 export { ReactThreeFiber };
 export type { Intersection, Subscription, Dpr, Size, Viewport, Camera, RenderCallback, Performance, RootState, } from './core/store';
 export type { ThreeEvent, Events, EventManager } from './core/events';
-export type { Props } from './native/Canvas';
+export type { ObjectMap } from './core/utils';
+export * from './native/Canvas';
 export * from './native/index';

package/dist/declarations/src/three-types.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
 import * as THREE from 'three';
 import { EventHandlers } from './core/events';
+import { AttachType } from './core/renderer';
 export declare type NonFunctionKeys<T> = {
     [K in keyof T]: T[K] extends Function ? never : K;
 }[keyof T];
@@ -17,13 +17,10 @@ export declare type Layers = THREE.Layers | Parameters<THREE.Layers['set']>[0];
 export declare type Quaternion = THREE.Quaternion | Parameters<THREE.Quaternion['set']>;
 export declare type AttachCallback = string | ((child: any, parentInstance: any) => void);
 export interface NodeProps<T, P> {
-    attach?: string;
-    attachArray?: string;
-    attachObject?: [target: string, name: string];
-    attachFns?: [AttachCallback, AttachCallback];
+    attach?: AttachType;
     args?: Args<P>;
     children?: React.ReactNode;
-    ref?: React.Ref<React.ReactNode>;
+    ref?: React.RefCallback<T> | React.RefObject<React.ReactNode> | null;
     key?: React.Key;
     onUpdate?: (self: T) => void;
 }
@@ -59,7 +56,6 @@ export declare type LineSegmentsProps = Object3DNode<THREE.LineSegments, typeof
 export declare type LineLoopProps = Object3DNode<THREE.LineLoop, typeof THREE.LineLoop>;
 export declare type PointsProps = Object3DNode<THREE.Points, typeof THREE.Points>;
 export declare type GroupProps = Object3DNode<THREE.Group, typeof THREE.Group>;
-export declare type ImmediateRenderObjectProps = Object3DNode<THREE.ImmediateRenderObject, typeof THREE.ImmediateRenderObject>;
 export declare type CameraProps = Object3DNode<THREE.Camera, typeof THREE.Camera>;
 export declare type PerspectiveCameraProps = Object3DNode<THREE.PerspectiveCamera, typeof THREE.PerspectiveCamera>;
 export declare type OrthographicCameraProps = Object3DNode<THREE.OrthographicCamera, typeof THREE.OrthographicCamera>;
@@ -76,19 +72,16 @@ export declare type ExtrudeBufferGeometryProps = BufferGeometryNode<THREE.Extrud
 export declare type IcosahedronBufferGeometryProps = BufferGeometryNode<THREE.IcosahedronBufferGeometry, typeof THREE.IcosahedronBufferGeometry>;
 export declare type LatheBufferGeometryProps = BufferGeometryNode<THREE.LatheBufferGeometry, typeof THREE.LatheBufferGeometry>;
 export declare type OctahedronBufferGeometryProps = BufferGeometryNode<THREE.OctahedronBufferGeometry, typeof THREE.OctahedronBufferGeometry>;
-export declare type ParametricBufferGeometryProps = BufferGeometryNode<THREE.ParametricBufferGeometry, typeof THREE.ParametricBufferGeometry>;
 export declare type PlaneBufferGeometryProps = BufferGeometryNode<THREE.PlaneBufferGeometry, typeof THREE.PlaneBufferGeometry>;
 export declare type PolyhedronBufferGeometryProps = BufferGeometryNode<THREE.PolyhedronBufferGeometry, typeof THREE.PolyhedronBufferGeometry>;
 export declare type RingBufferGeometryProps = BufferGeometryNode<THREE.RingBufferGeometry, typeof THREE.RingBufferGeometry>;
 export declare type ShapeBufferGeometryProps = BufferGeometryNode<THREE.ShapeBufferGeometry, typeof THREE.ShapeBufferGeometry>;
 export declare type SphereBufferGeometryProps = BufferGeometryNode<THREE.SphereBufferGeometry, typeof THREE.SphereBufferGeometry>;
 export declare type TetrahedronBufferGeometryProps = BufferGeometryNode<THREE.TetrahedronBufferGeometry, typeof THREE.TetrahedronBufferGeometry>;
-export declare type TextBufferGeometryProps = BufferGeometryNode<THREE.TextBufferGeometry, typeof THREE.TextBufferGeometry>;
 export declare type TorusBufferGeometryProps = BufferGeometryNode<THREE.TorusBufferGeometry, typeof THREE.TorusBufferGeometry>;
 export declare type TorusKnotBufferGeometryProps = BufferGeometryNode<THREE.TorusKnotBufferGeometry, typeof THREE.TorusKnotBufferGeometry>;
 export declare type TubeBufferGeometryProps = BufferGeometryNode<THREE.TubeBufferGeometry, typeof THREE.TubeBufferGeometry>;
 export declare type WireframeGeometryProps = BufferGeometryNode<THREE.WireframeGeometry, typeof THREE.WireframeGeometry>;
-export declare type ParametricGeometryProps = BufferGeometryNode<THREE.ParametricGeometry, typeof THREE.ParametricGeometry>;
 export declare type TetrahedronGeometryProps = BufferGeometryNode<THREE.TetrahedronGeometry, typeof THREE.TetrahedronGeometry>;
 export declare type OctahedronGeometryProps = BufferGeometryNode<THREE.OctahedronGeometry, typeof THREE.OctahedronGeometry>;
 export declare type IcosahedronGeometryProps = BufferGeometryNode<THREE.IcosahedronGeometry, typeof THREE.IcosahedronGeometry>;
@@ -97,7 +90,6 @@ export declare type PolyhedronGeometryProps = BufferGeometryNode<THREE.Polyhedro
 export declare type TubeGeometryProps = BufferGeometryNode<THREE.TubeGeometry, typeof THREE.TubeGeometry>;
 export declare type TorusKnotGeometryProps = BufferGeometryNode<THREE.TorusKnotGeometry, typeof THREE.TorusKnotGeometry>;
 export declare type TorusGeometryProps = BufferGeometryNode<THREE.TorusGeometry, typeof THREE.TorusGeometry>;
-export declare type TextGeometryProps = BufferGeometryNode<THREE.TextGeometry, typeof THREE.TextGeometry>;
 export declare type SphereGeometryProps = BufferGeometryNode<THREE.SphereGeometry, typeof THREE.SphereGeometry>;
 export declare type RingGeometryProps = BufferGeometryNode<THREE.RingGeometry, typeof THREE.RingGeometry>;
 export declare type PlaneGeometryProps = BufferGeometryNode<THREE.PlaneGeometry, typeof THREE.PlaneGeometry>;
@@ -175,6 +167,7 @@ export declare type Matrix3Props = Node<THREE.Matrix3, typeof THREE.Matrix3>;
 export declare type Matrix4Props = Node<THREE.Matrix4, typeof THREE.Matrix4>;
 export declare type QuaternionProps = Node<THREE.Quaternion, typeof THREE.Quaternion>;
 export declare type BufferAttributeProps = Node<THREE.BufferAttribute, typeof THREE.BufferAttribute>;
+export declare type Float32BufferAttributeProps = Node<THREE.Float32BufferAttribute, typeof THREE.Float32BufferAttribute>;
 export declare type InstancedBufferAttributeProps = Node<THREE.InstancedBufferAttribute, typeof THREE.InstancedBufferAttribute>;
 export declare type ColorProps = Node<THREE.Color, ColorArray>;
 export declare type FogProps = Node<THREE.Fog, typeof THREE.Fog>;
@@ -197,7 +190,6 @@ declare global {
             lineLoop: LineLoopProps;
             points: PointsProps;
             group: GroupProps;
-            immediateRenderObject: ImmediateRenderObjectProps;
             camera: CameraProps;
             perspectiveCamera: PerspectiveCameraProps;
             orthographicCamera: OrthographicCameraProps;
@@ -214,19 +206,16 @@ declare global {
             icosahedronBufferGeometry: IcosahedronBufferGeometryProps;
             latheBufferGeometry: LatheBufferGeometryProps;
             octahedronBufferGeometry: OctahedronBufferGeometryProps;
-            parametricBufferGeometry: ParametricBufferGeometryProps;
             planeBufferGeometry: PlaneBufferGeometryProps;
             polyhedronBufferGeometry: PolyhedronBufferGeometryProps;
             ringBufferGeometry: RingBufferGeometryProps;
             shapeBufferGeometry: ShapeBufferGeometryProps;
             sphereBufferGeometry: SphereBufferGeometryProps;
             tetrahedronBufferGeometry: TetrahedronBufferGeometryProps;
-            textBufferGeometry: TextBufferGeometryProps;
             torusBufferGeometry: TorusBufferGeometryProps;
             torusKnotBufferGeometry: TorusKnotBufferGeometryProps;
             tubeBufferGeometry: TubeBufferGeometryProps;
             wireframeGeometry: WireframeGeometryProps;
-            parametricGeometry: ParametricGeometryProps;
             tetrahedronGeometry: TetrahedronGeometryProps;
             octahedronGeometry: OctahedronGeometryProps;
             icosahedronGeometry: IcosahedronGeometryProps;
@@ -235,7 +224,6 @@ declare global {
             tubeGeometry: TubeGeometryProps;
             torusKnotGeometry: TorusKnotGeometryProps;
             torusGeometry: TorusGeometryProps;
-            textGeometry: TextGeometryProps;
             sphereGeometry: SphereGeometryProps;
             ringGeometry: RingGeometryProps;
             planeGeometry: PlaneGeometryProps;
@@ -309,6 +297,7 @@ declare global {
             matrix4: Matrix4Props;
             quaternion: QuaternionProps;
             bufferAttribute: BufferAttributeProps;
+            float32BufferAttribute: Float32BufferAttributeProps;
             instancedBufferAttribute: InstancedBufferAttributeProps;
             color: ColorProps;
             fog: FogProps;

package/dist/declarations/src/web/Canvas.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Options as ResizeOptions } from 'react-use-measure';
+import type { Options as ResizeOptions } from 'react-use-measure';
 import { UseStore } from 'zustand';
 import { RenderProps } from './index';
 import { RootState } from '../core/store';

package/dist/declarations/src/web/index.d.ts

@@ -7,7 +7,6 @@ import { Renderer, StoreProps, context, RootState, Size } from '../core/store';
 import { extend, Root } from '../core/renderer';
 import { addEffect, addAfterEffect, addTail } from '../core/loop';
 import { createPointerEvents as events } from './events';
-import { Canvas } from './Canvas';
 import { EventManager } from '../core/events';
 declare const roots: Map<Element, Root>;
 declare const invalidate: (state?: RootState | undefined) => void, advance: (timestamp: number, runGlobalEffects?: boolean, state?: RootState | undefined) => void;
@@ -26,9 +25,9 @@ declare function createRoot<TCanvas extends Element>(canvas: TCanvas, config?: R
     render: (element: React.ReactNode) => UseStore<RootState>;
     unmount: () => void;
 };
-declare function render<TCanvas extends Element>(element: React.ReactNode, canvas: TCanvas, { gl, size, events, onCreated, ...props }?: RenderProps<TCanvas>): UseStore<RootState>;
+declare function render<TCanvas extends Element>(element: React.ReactNode, canvas: TCanvas, config?: RenderProps<TCanvas>): UseStore<RootState>;
 declare function unmountComponentAtNode<TElement extends Element>(canvas: TElement, callback?: (canvas: TElement) => void): void;
-declare const act: (callback: () => import("react-reconciler").Thenable<unknown>) => import("react-reconciler").Thenable<void>;
+declare const act: any;
 declare function createPortal(children: React.ReactNode, container: THREE.Object3D): React.ReactNode;
 export * from '../core/hooks';
-export { context, render, createRoot, unmountComponentAtNode, createPortal, events, reconciler, applyProps, dispose, invalidate, advance, extend, addEffect, addAfterEffect, addTail, Canvas, act, roots as _roots, };
+export { context, render, createRoot, unmountComponentAtNode, createPortal, events, reconciler, applyProps, dispose, invalidate, advance, extend, addEffect, addAfterEffect, addTail, act, roots as _roots, };