@react-three/fiber 10.0.0-canary.2b511a5 → 10.0.0-canary.aecbafb

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/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as three_webgpu from 'three/webgpu';
2
- import { RenderTarget, WebGPURenderer, CanvasTarget, Node, ShaderNodeObject, Euler as Euler$2, Color as Color$2, ColorRepresentation as ColorRepresentation$1, Layers as Layers$1, Raycaster, Intersection as Intersection$1, BufferGeometry, Matrix4 as Matrix4$1, Quaternion as Quaternion$1, Vector2 as Vector2$1, Vector3 as Vector3$1, Vector4 as Vector4$1, Matrix3 as Matrix3$1, Loader as Loader$1, ColorSpace, Texture as Texture$1, CubeTexture, Scene, Object3D, Frustum, OrthographicCamera } from 'three/webgpu';
2
+ import { RenderTarget, WebGPURenderer, Node, StorageTexture, Data3DTexture, CanvasTarget, ShaderNodeObject, Euler as Euler$2, Color as Color$2, ColorRepresentation as ColorRepresentation$1, Layers as Layers$1, Raycaster, Intersection as Intersection$1, BufferGeometry, Matrix4 as Matrix4$1, Quaternion as Quaternion$1, Vector2 as Vector2$1, Vector3 as Vector3$1, Vector4 as Vector4$1, Matrix3 as Matrix3$1, Loader as Loader$1, ColorSpace, Texture as Texture$1, CubeTexture, Scene, Object3D, Frustum, OrthographicCamera } from 'three/webgpu';
3
3
  import * as THREE$1 from 'three';
4
4
  import { WebGLRenderTarget, WebGLRenderer, Color as Color$1, ColorRepresentation, Euler as Euler$1, Loader, RenderTargetOptions as RenderTargetOptions$1 } from 'three';
5
5
  import { WebGLRendererParameters } from 'three/src/renderers/WebGLRenderer.js';
@@ -149,6 +149,8 @@ interface IntersectionEvent<TSourceEvent> extends Intersection {
149
149
  unprojectedPoint: THREE$1.Vector3
150
150
  /** Normalized event coordinates */
151
151
  pointer: THREE$1.Vector2
152
+ /** pointerId of the original event for multiple pointer events */
153
+ pointerId: number
152
154
  /** Delta between first click and this event */
153
155
  delta: number
154
156
  /** The ray that pierced it */
@@ -225,6 +227,18 @@ interface EventHandlers {
225
227
  type FilterFunction = (items: THREE$1.Intersection[], state: RootState) => THREE$1.Intersection[]
226
228
  type ComputeFunction = (event: DomEvent, root: RootState, previous?: RootState) => void
227
229
 
230
+ /** Configuration for XR pointer registration (controllers/hands) */
231
+ interface XRPointerConfig {
232
+ /** Ray origin (updated each frame by XR system) */
233
+ ray: THREE$1.Ray
234
+ /** Optional: custom compute function for this pointer */
235
+ compute?: (state: RootState) => void
236
+ /** Pointer type identifier */
237
+ type: 'controller' | 'hand' | 'gaze'
238
+ /** Which hand (for controller/hand types) */
239
+ handedness?: 'left' | 'right'
240
+ }
241
+
228
242
  interface EventManager<TTarget> {
229
243
  /** Determines if the event layer is active */
230
244
  enabled: boolean
@@ -244,8 +258,21 @@ interface EventManager<TTarget> {
244
258
  disconnect?: () => void
245
259
  /** Triggers a onPointerMove with the last known event. This can be useful to enable raycasting without
246
260
  * explicit user interaction, for instance when the camera moves a hoverable object underneath the cursor.
261
+ * @param pointerId - Optional pointer ID to update specific pointer only
247
262
  */
248
- update?: () => void
263
+ update?: (pointerId?: number) => void
264
+ /** Defer pointer move raycasting to frame start (default: true) */
265
+ frameTimedRaycasts?: boolean
266
+ /** Always fire raycaster immediately on scroll events (default: true) */
267
+ alwaysFireOnScroll?: boolean
268
+ /** Automatically re-raycast every frame to detect hover changes from moving objects/camera (default: false) */
269
+ updateOnFrame?: boolean
270
+ /** Flush deferred pointer raycasts. Called by scheduler at frame start (input phase). */
271
+ flush?: () => void
272
+ /** Register an XR pointer (controller/hand). Returns assigned pointerId */
273
+ registerPointer?: (config: XRPointerConfig) => number
274
+ /** Unregister an XR pointer */
275
+ unregisterPointer?: (pointerId: number) => void
249
276
  }
250
277
 
251
278
  interface PointerCaptureTarget {
@@ -487,6 +514,68 @@ interface SchedulerApi {
487
514
  subscribeJobState(id: string, listener: () => void): () => void
488
515
  }
489
516
 
517
+ //* Buffer Types (useBuffers) ========================================
518
+
519
+ /**
520
+ * Buffer-like types for GPU compute and storage operations.
521
+ * Includes raw CPU arrays, Three.js buffer attributes, and TSL buffer nodes.
522
+ *
523
+ * @example
524
+ * ```tsx
525
+ * const { positions, velocities } = useBuffers(() => ({
526
+ * positions: instancedArray(count, 'vec3'), // StorageBufferNode
527
+ * velocities: new Float32Array(count * 3), // TypedArray
528
+ * }), 'particles')
529
+ * ```
530
+ */
531
+ type BufferLike =
532
+ | Float32Array
533
+ | Uint32Array
534
+ | Int32Array
535
+ | Float64Array
536
+ | Uint8Array
537
+ | Int8Array
538
+ | Uint16Array
539
+ | Int16Array
540
+ | THREE$1.BufferAttribute // Base class for all buffer attributes
541
+ | Node // TSL buffer nodes (instancedArray, storage)
542
+
543
+ /** Flat record of buffer-like values (no nested scopes) */
544
+ type BufferRecord = Record<string, BufferLike>
545
+
546
+ /**
547
+ * Buffer store that can contain both root-level buffers and scoped buffer objects.
548
+ * Structure: { positions: Float32Array, particles: { vel: StorageBufferNode } }
549
+ */
550
+ type BufferStore = Record<string, BufferLike | BufferRecord>
551
+
552
+ //* Storage Types (useGPUStorage) ========================================
553
+
554
+ /**
555
+ * GPU storage types for texture-based storage operations.
556
+ * Includes Three.js storage textures and TSL storage texture nodes.
557
+ *
558
+ * @example
559
+ * ```tsx
560
+ * const { heightMap } = useGPUStorage(() => ({
561
+ * heightMap: new StorageTexture(512, 512),
562
+ * }), 'terrain')
563
+ * ```
564
+ */
565
+ type StorageLike =
566
+ | StorageTexture // GPU storage texture
567
+ | Data3DTexture // 3D texture (can be used as storage)
568
+ | Node // TSL storage texture nodes (storageTexture)
569
+
570
+ /** Flat record of storage-like values (no nested scopes) */
571
+ type StorageRecord = Record<string, StorageLike>
572
+
573
+ /**
574
+ * Storage store that can contain both root-level storage and scoped storage objects.
575
+ * Structure: { heightMap: StorageTexture, terrain: { normal: StorageTextureNode } }
576
+ */
577
+ type StorageStore = Record<string, StorageLike | StorageRecord>
578
+
490
579
  //* Renderer Types ========================================
491
580
 
492
581
  /** Default renderer type - union of WebGL and WebGPU renderers */
@@ -500,6 +589,18 @@ type Subscription = {
500
589
  store: RootStore
501
590
  }
502
591
 
592
+ /** Per-pointer state for multi-touch and XR support */
593
+ type PointerState = {
594
+ /** Objects currently hovered by this pointer */
595
+ hovered: Map<string, ThreeEvent<DomEvent>>
596
+ /** Objects capturing this pointer */
597
+ captured: Map<THREE$1.Object3D, PointerCaptureTarget>
598
+ /** Initial click position [x, y] */
599
+ initialClick: [x: number, y: number]
600
+ /** Objects hit on initial click */
601
+ initialHits: THREE$1.Object3D[]
602
+ }
603
+
503
604
  type Dpr = number | [min: number, max: number]
504
605
 
505
606
  interface Size {
@@ -541,12 +642,21 @@ interface Performance {
541
642
 
542
643
  interface InternalState {
543
644
  interaction: THREE$1.Object3D[]
544
- hovered: Map<string, ThreeEvent<DomEvent>>
545
645
  subscribers: Subscription[]
646
+ /** Per-pointer state (hover, capture, click tracking) - replaces hovered, capturedMap, initialClick, initialHits */
647
+ pointerMap: Map<number, PointerState>
648
+ /** Pointers needing raycast this frame (used with frameTimedRaycasts) */
649
+ pointerDirty: Map<number, DomEvent>
650
+ /** Last event received (for events.update() compatibility) */
651
+ lastEvent: React$1.RefObject<DomEvent | null>
652
+ /** @deprecated Use pointerMap.get(pointerId).hovered instead */
653
+ hovered: Map<string, ThreeEvent<DomEvent>>
654
+ /** @deprecated Use pointerMap.get(pointerId).captured instead */
546
655
  capturedMap: Map<number, Map<THREE$1.Object3D, PointerCaptureTarget>>
656
+ /** @deprecated Use pointerMap.get(pointerId).initialClick instead */
547
657
  initialClick: [x: number, y: number]
658
+ /** @deprecated Use pointerMap.get(pointerId).initialHits instead */
548
659
  initialHits: THREE$1.Object3D[]
549
- lastEvent: React$1.RefObject<DomEvent | null>
550
660
  /** Visibility event registry (onFramed, onOccluded, onVisible) */
551
661
  visibilityRegistry: Map<string, VisibilityEntry>
552
662
  /** Whether occlusion queries are enabled (WebGPU only) */
@@ -687,11 +797,15 @@ interface RootState {
687
797
  uniforms: UniformStore
688
798
  /** Global TSL nodes - root-level nodes + scoped sub-objects. Use useNodes() hook */
689
799
  nodes: Record<string, any>
800
+ /** Global TSL buffer nodes - root-level buffers + scoped sub-objects. Use useBuffers() hook */
801
+ buffers: BufferStore
802
+ /** Global GPU storage (textures, etc.) - root-level storage + scoped sub-objects. Use useGPUStorage() hook */
803
+ gpuStorage: StorageStore
690
804
  /** Global TSL texture nodes - use useTextures() hook for operations */
691
805
  textures: Map<string, any>
692
- /** WebGPU PostProcessing instance - use usePostProcessing() hook */
693
- postProcessing: any | null // THREE.PostProcessing when available
694
- /** Global TSL pass nodes for post-processing - use usePostProcessing() hook */
806
+ /** WebGPU RenderPipeline instance - use useRenderPipeline() hook */
807
+ renderPipeline: any | null // THREE.PostProcessing (will be THREE.RenderPipeline in future Three.js release)
808
+ /** Global TSL pass nodes for render pipeline - use useRenderPipeline() hook */
695
809
  passes: Record<string, any>
696
810
  /** Internal version counter for HMR - incremented by rebuildNodes/rebuildUniforms to bust memoization */
697
811
  _hmrVersion: number
@@ -1312,6 +1426,7 @@ declare global {
1312
1426
  | three_webgpu.Euler
1313
1427
  | three_webgpu.Quaternion
1314
1428
  | { x: number; y?: number; z?: number; w?: number } // Plain objects converted to vectors
1429
+ | { r: number; g: number; b: number; a?: number } // Plain objects converted to Color
1315
1430
  | Node // TSL nodes like color(), vec3(), float() for type casting
1316
1431
  | UniformNode
1317
1432
 
@@ -1357,34 +1472,34 @@ declare module 'three/tsl' {
1357
1472
  }
1358
1473
 
1359
1474
  /**
1360
- * PostProcessing Types for usePostProcessing hook (WebGPU only)
1475
+ * RenderPipeline Types for useRenderPipeline hook (WebGPU only)
1361
1476
  */
1362
1477
 
1363
1478
 
1364
1479
 
1365
1480
  declare global {
1366
- /** Pass record - stores TSL pass nodes for post-processing */
1481
+ /** Pass record - stores TSL pass nodes for render pipeline */
1367
1482
  type PassRecord = Record<string, any>
1368
1483
 
1369
1484
  /** Setup callback - runs first to configure MRT, create additional passes */
1370
- type PostProcessingSetupCallback = (state: RootState) => PassRecord | void
1485
+ type RenderPipelineSetupCallback = (state: RootState) => PassRecord | void
1371
1486
 
1372
1487
  /** Main callback - runs second to configure outputNode, create effect passes */
1373
- type PostProcessingMainCallback = (state: RootState) => PassRecord | void
1488
+ type RenderPipelineMainCallback = (state: RootState) => PassRecord | void
1374
1489
 
1375
- /** Return type for usePostProcessing hook */
1376
- interface UsePostProcessingReturn {
1490
+ /** Return type for useRenderPipeline hook */
1491
+ interface UseRenderPipelineReturn {
1377
1492
  /** Current passes from state */
1378
1493
  passes: PassRecord
1379
- /** PostProcessing instance (null if not initialized) */
1380
- postProcessing: any | null // THREE.PostProcessing
1494
+ /** RenderPipeline instance (null if not initialized) */
1495
+ renderPipeline: any | null // THREE.PostProcessing (will be THREE.RenderPipeline in future Three.js release)
1381
1496
  /** Clear all passes from state */
1382
1497
  clearPasses: () => void
1383
- /** Reset PostProcessing entirely (clears PP + passes) */
1498
+ /** Reset RenderPipeline entirely (clears PP + passes) */
1384
1499
  reset: () => void
1385
1500
  /** Re-run setup/main callbacks with current closure values */
1386
1501
  rebuild: () => void
1387
- /** True when PostProcessing is configured and ready */
1502
+ /** True when RenderPipeline is configured and ready */
1388
1503
  isReady: boolean
1389
1504
  }
1390
1505
  }
@@ -2004,6 +2119,8 @@ declare function Environment(props: EnvironmentProps): react_jsx_runtime.JSX.Ele
2004
2119
  declare function removeInteractivity(store: RootStore, object: Object3D): void;
2005
2120
  declare function createEvents(store: RootStore): {
2006
2121
  handlePointer: (name: string) => (event: DomEvent) => void;
2122
+ flushDeferredPointers: () => void;
2123
+ processDeferredPointer: (event: DomEvent, pointerId: number) => void;
2007
2124
  };
2008
2125
  /** Default R3F event manager for web */
2009
2126
  declare function createPointerEvents(store: RootStore): EventManager<HTMLElement>;
@@ -2583,9 +2700,9 @@ declare function useTextures(): UseTexturesReturn;
2583
2700
  * const fbo = useRenderTarget(512, 256, { samples: 4 })
2584
2701
  * ```
2585
2702
  */
2586
- declare function useRenderTarget(options?: RenderTargetOptions): RenderTarget | WebGLRenderTarget;
2587
- declare function useRenderTarget(size: number, options?: RenderTargetOptions): RenderTarget | WebGLRenderTarget;
2588
- declare function useRenderTarget(width: number, height: number, options?: RenderTargetOptions): RenderTarget | WebGLRenderTarget;
2703
+ declare function useRenderTarget(options?: RenderTargetOptions): RenderTarget;
2704
+ declare function useRenderTarget(size: number, options?: RenderTargetOptions): RenderTarget;
2705
+ declare function useRenderTarget(width: number, height: number, options?: RenderTargetOptions): RenderTarget;
2589
2706
 
2590
2707
  /**
2591
2708
  * Returns the R3F Canvas' Zustand store. Useful for [transient updates](https://github.com/pmndrs/zustand#transient-updates-for-often-occurring-state-changes).
@@ -4250,4 +4367,4 @@ declare function isOnce(value: unknown): value is {
4250
4367
  declare function Canvas(props: CanvasProps): react_jsx_runtime.JSX.Element;
4251
4368
 
4252
4369
  export { Block, Canvas, Environment, EnvironmentCube, EnvironmentMap, EnvironmentPortal, ErrorBoundary, FROM_REF, IsObject, ONCE, Portal, R3F_BUILD_LEGACY, R3F_BUILD_WEBGPU, REACT_INTERNAL_PROPS, RESERVED_PROPS, three_d as ReactThreeFiber, Scheduler, Texture, _roots, act, addAfterEffect, addEffect, addTail, advance, applyProps, attach, buildGraph, calculateDpr, context, createEvents, createPointerEvents, createPortal, createRoot, createStore, detach, diffProps, dispose, createPointerEvents as events, extend, findInitialRoot, flushSync, fromRef, getInstanceProps, getPrimary, getPrimaryIds, getRootState, getScheduler, getUuidPrefix, hasConstructor, hasPrimary, invalidate, invalidateInstance, is, isColorRepresentation, isCopyable, isFromRef, isObject3D, isOnce, isOrthographicCamera, isRef, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, reconciler, registerPrimary, removeInteractivity, resolve, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useEnvironment, useFrame, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useMutableCallback, useRenderTarget, useStore, useTexture, useTextures, useThree, waitForPrimary };
4253
- export type { Act, AddPhaseOptions, Args, ArgsProp, AttachFnType, AttachType, BackgroundConfig, BackgroundProp, BaseRendererProps, Bridge, Camera, CameraProps, CanvasProps, CanvasSchedulerConfig, Catalogue, Color, ComputeFunction, ConstructorRepresentation, DefaultGLProps, DefaultRendererProps, Disposable, DomEvent, Dpr, ElementProps, EnvironmentLoaderProps, EnvironmentProps, EquConfig, Euler, EventHandlers, EventManager, EventProps, Events, Extensions, FiberRoot, FilterFunction, FrameCallback, FrameControls, FrameNextCallback, FrameNextControls, FrameNextState, FrameState, FrameTimingState, Frameloop, GLProps, GLTFLike, GeometryProps, GeometryTransformProps, GlobalEffectType, GlobalRenderCallback, HostConfig, InferLoadResult, InjectState, InputLike, Instance, InstanceProps, InternalState, Intersection, IntersectionEvent, IsAllOptional, IsOptional, Layers, LegacyInternalState, LegacyRenderer, LegacyRootState, LoaderInstance, LoaderLike, LoaderResult, MappedTextureType, MathProps, MathRepresentation, MathType, MathTypes, Matrix3, Matrix4, Mutable, MutableOrReadonlyParameters, NodeProps, NonFunctionKeys, ObjectMap, OffscreenCanvas$1 as OffscreenCanvas, Overwrite, Performance, PointerCaptureTarget, PresetsType, PrimaryCanvasEntry, Properties, Quaternion, R3FRenderer, RaycastableRepresentation, ReactProps, ReconcilerRoot, RenderCallback, RenderProps, RenderTargetOptions, Renderer, RendererConfigExtended, RendererFactory, RendererProps, Root, RootOptions, RootState, RootStore, SchedulerApi, SetBlock, Size, Subscription, TSLNodeInput, TextureEntry, ThreeCamera, ThreeElement, ThreeElements, ThreeElementsImpl, ThreeEvent, ThreeExports, ThreeToJSXElements, UnblockProps, UseFrameNextOptions, UseFrameOptions, UseTextureOptions, UseTexturesReturn, Vector2, Vector3, Vector4, VectorRepresentation, Viewport, VisibilityEntry, WebGLDefaultProps, WebGLProps, WebGLShadowConfig, XRManager };
4370
+ export type { Act, AddPhaseOptions, Args, ArgsProp, AttachFnType, AttachType, BackgroundConfig, BackgroundProp, BaseRendererProps, Bridge, BufferLike, BufferRecord, BufferStore, Camera, CameraProps, CanvasProps, CanvasSchedulerConfig, Catalogue, Color, ComputeFunction, ConstructorRepresentation, DefaultGLProps, DefaultRendererProps, Disposable, DomEvent, Dpr, ElementProps, EnvironmentLoaderProps, EnvironmentProps, EquConfig, Euler, EventHandlers, EventManager, EventProps, Events, Extensions, FiberRoot, FilterFunction, FrameCallback, FrameControls, FrameNextCallback, FrameNextControls, FrameNextState, FrameState, FrameTimingState, Frameloop, GLProps, GLTFLike, GeometryProps, GeometryTransformProps, GlobalEffectType, GlobalRenderCallback, HostConfig, InferLoadResult, InjectState, InputLike, Instance, InstanceProps, InternalState, Intersection, IntersectionEvent, IsAllOptional, IsOptional, Layers, LegacyInternalState, LegacyRenderer, LegacyRootState, LoaderInstance, LoaderLike, LoaderResult, MappedTextureType, MathProps, MathRepresentation, MathType, MathTypes, Matrix3, Matrix4, Mutable, MutableOrReadonlyParameters, NodeProps, NonFunctionKeys, ObjectMap, OffscreenCanvas$1 as OffscreenCanvas, Overwrite, Performance, PointerCaptureTarget, PointerState, PresetsType, PrimaryCanvasEntry, Properties, Quaternion, R3FRenderer, RaycastableRepresentation, ReactProps, ReconcilerRoot, RenderCallback, RenderProps, RenderTargetOptions, Renderer, RendererConfigExtended, RendererFactory, RendererProps, Root, RootOptions, RootState, RootStore, SchedulerApi, SetBlock, Size, StorageLike, StorageRecord, StorageStore, Subscription, TSLNodeInput, TextureEntry, ThreeCamera, ThreeElement, ThreeElements, ThreeElementsImpl, ThreeEvent, ThreeExports, ThreeToJSXElements, UnblockProps, UseFrameNextOptions, UseFrameOptions, UseTextureOptions, UseTexturesReturn, Vector2, Vector3, Vector4, VectorRepresentation, Viewport, VisibilityEntry, WebGLDefaultProps, WebGLProps, WebGLShadowConfig, XRManager, XRPointerConfig };