@react-three/fiber 10.0.0-canary.07c4f9d → 10.0.0-canary.0ea97c0
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.cjs +19 -15
- package/dist/index.d.cts +137 -17
- package/dist/index.d.mts +137 -17
- package/dist/index.d.ts +137 -17
- package/dist/index.mjs +19 -15
- package/dist/legacy.cjs +16 -11
- package/dist/legacy.d.cts +137 -17
- package/dist/legacy.d.mts +137 -17
- package/dist/legacy.d.ts +137 -17
- package/dist/legacy.mjs +16 -11
- package/dist/webgpu/index.cjs +33 -28
- package/dist/webgpu/index.d.cts +141 -33
- package/dist/webgpu/index.d.mts +141 -33
- package/dist/webgpu/index.d.ts +141 -33
- package/dist/webgpu/index.mjs +33 -28
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -622,7 +622,12 @@ function diffProps(instance, newProps) {
|
|
|
622
622
|
const changedProps = {};
|
|
623
623
|
for (const prop in newProps) {
|
|
624
624
|
if (RESERVED_PROPS.includes(prop)) continue;
|
|
625
|
-
if (is.equ(newProps[prop], instance.props[prop]))
|
|
625
|
+
if (is.equ(newProps[prop], instance.props[prop])) {
|
|
626
|
+
const value = newProps[prop];
|
|
627
|
+
if (!isCopyable(value)) continue;
|
|
628
|
+
const { target } = resolve(instance.object, prop);
|
|
629
|
+
if (!isCopyable(target) || target.constructor !== value.constructor) continue;
|
|
630
|
+
}
|
|
626
631
|
changedProps[prop] = newProps[prop];
|
|
627
632
|
for (const other in newProps) {
|
|
628
633
|
if (other.startsWith(`${prop}-`)) changedProps[other] = newProps[other];
|
|
@@ -1068,7 +1073,8 @@ const createStore = (invalidate, advance) => {
|
|
|
1068
1073
|
const resizeTarget = canvasTarget ?? actualRenderer;
|
|
1069
1074
|
if (viewport.dpr > 0) resizeTarget.setPixelRatio(viewport.dpr);
|
|
1070
1075
|
resizeTarget.setSize(size.width, size.height, false);
|
|
1071
|
-
|
|
1076
|
+
const activeTarget = actualRenderer.getCanvasTarget?.();
|
|
1077
|
+
if (!canvasTarget || activeTarget !== canvasTarget) internal.canvasTargetSizeDirty = true;
|
|
1072
1078
|
}
|
|
1073
1079
|
if (camera !== oldCamera) {
|
|
1074
1080
|
oldCamera = camera;
|
|
@@ -14250,9 +14256,8 @@ function createRoot(canvas) {
|
|
|
14250
14256
|
if (!renderer.hasInitialized?.()) {
|
|
14251
14257
|
const size2 = computeInitialSize(canvas, propsSize);
|
|
14252
14258
|
if (size2.width > 0 && size2.height > 0) {
|
|
14253
|
-
|
|
14254
|
-
|
|
14255
|
-
canvas.height = size2.height * pixelRatio;
|
|
14259
|
+
renderer.setPixelRatio(calculateDpr(dpr));
|
|
14260
|
+
renderer.setSize(size2.width, size2.height, false);
|
|
14256
14261
|
}
|
|
14257
14262
|
await renderer.init();
|
|
14258
14263
|
}
|
|
@@ -14261,7 +14266,7 @@ function createRoot(canvas) {
|
|
|
14261
14266
|
state.internal.actualRenderer = renderer;
|
|
14262
14267
|
state.set({ webGPUSupported: isWebGPUBackend, renderer, primaryStore: store });
|
|
14263
14268
|
if (canvasId && !state.internal.isSecondary) {
|
|
14264
|
-
const canvasTarget =
|
|
14269
|
+
const canvasTarget = renderer.getCanvasTarget?.();
|
|
14265
14270
|
const unregisterPrimary = registerPrimary(canvasId, renderer, store);
|
|
14266
14271
|
state.set((prev) => ({
|
|
14267
14272
|
internal: {
|
|
@@ -14474,9 +14479,10 @@ function createRoot(canvas) {
|
|
|
14474
14479
|
const unregisterCanvasTarget = scheduler$1.register(
|
|
14475
14480
|
() => {
|
|
14476
14481
|
const state2 = store.getState();
|
|
14477
|
-
|
|
14482
|
+
const canvasTarget = state2.internal.canvasTarget;
|
|
14483
|
+
if (canvasTarget) {
|
|
14478
14484
|
const renderer2 = state2.internal.actualRenderer;
|
|
14479
|
-
renderer2.setCanvasTarget(
|
|
14485
|
+
if (renderer2.getCanvasTarget() !== canvasTarget) renderer2.setCanvasTarget(canvasTarget);
|
|
14480
14486
|
if (state2.internal.canvasTargetSizeDirty) {
|
|
14481
14487
|
state2.internal.canvasTargetSizeDirty = false;
|
|
14482
14488
|
renderer2.backend?.updateSize?.();
|
|
@@ -14640,7 +14646,7 @@ function unmountComponentAtNode(canvas, callback) {
|
|
|
14640
14646
|
const unregisterPrimary = state.internal.unregisterPrimary;
|
|
14641
14647
|
if (unregisterPrimary) unregisterPrimary();
|
|
14642
14648
|
const canvasTarget = state.internal.canvasTarget;
|
|
14643
|
-
if (canvasTarget?.dispose) canvasTarget.dispose();
|
|
14649
|
+
if (state.internal.isSecondary && canvasTarget?.dispose) canvasTarget.dispose();
|
|
14644
14650
|
state.events.disconnect?.();
|
|
14645
14651
|
cleanupHelperGroup(root.store);
|
|
14646
14652
|
if (state.isLegacy && renderer) {
|
|
@@ -15084,9 +15090,9 @@ function CanvasImpl({
|
|
|
15084
15090
|
React__namespace.useMemo(() => extend(THREE), []);
|
|
15085
15091
|
const Bridge = useBridge();
|
|
15086
15092
|
const backgroundProps = React__namespace.useMemo(() => parseBackground(background), [background]);
|
|
15087
|
-
const
|
|
15093
|
+
const [hasInitialSize, setHasInitialSize] = React__namespace.useState(false);
|
|
15088
15094
|
const measureConfig = React__namespace.useMemo(() => {
|
|
15089
|
-
if (!
|
|
15095
|
+
if (!hasInitialSize) {
|
|
15090
15096
|
return {
|
|
15091
15097
|
...resize,
|
|
15092
15098
|
scroll: resize?.scroll ?? true,
|
|
@@ -15098,7 +15104,7 @@ function CanvasImpl({
|
|
|
15098
15104
|
debounce: { scroll: 50, resize: 0 },
|
|
15099
15105
|
...resize
|
|
15100
15106
|
};
|
|
15101
|
-
}, [
|
|
15107
|
+
}, [hasInitialSize, resize]);
|
|
15102
15108
|
const [containerRef, containerRect] = useMeasure__default(measureConfig);
|
|
15103
15109
|
const effectiveSize = React__namespace.useMemo(() => {
|
|
15104
15110
|
let w = width ?? containerRect.width;
|
|
@@ -15114,9 +15120,7 @@ function CanvasImpl({
|
|
|
15114
15120
|
left: containerRect.left
|
|
15115
15121
|
};
|
|
15116
15122
|
}, [width, height, containerRect, forceEven]);
|
|
15117
|
-
if (!
|
|
15118
|
-
hasInitialSizeRef.current = true;
|
|
15119
|
-
}
|
|
15123
|
+
if (!hasInitialSize && effectiveSize.width > 0 && effectiveSize.height > 0) setHasInitialSize(true);
|
|
15120
15124
|
const canvasRef = React__namespace.useRef(null);
|
|
15121
15125
|
const divRef = React__namespace.useRef(null);
|
|
15122
15126
|
React__namespace.useImperativeHandle(ref, () => canvasRef.current);
|
package/dist/index.d.cts
CHANGED
|
@@ -363,6 +363,33 @@ type BufferRecord = Record<string, BufferLike>
|
|
|
363
363
|
*/
|
|
364
364
|
type BufferStore = Record<string, BufferLike | BufferRecord>
|
|
365
365
|
|
|
366
|
+
//* Node Types (useNodes) ========================================
|
|
367
|
+
|
|
368
|
+
/**
|
|
369
|
+
* Structural shape of a TSL node as stored on `state.nodes`.
|
|
370
|
+
*
|
|
371
|
+
* Deliberately minimal rather than three's nominal `Node`: in @types/three several node classes
|
|
372
|
+
* TSL hands back (OperatorNode, ConstNode, ...) do not extend `Node` cleanly, so a `Node` bound
|
|
373
|
+
* would reject values `useNodes` creators legitimately return. This is the same shape
|
|
374
|
+
* `useNodes` already constrains creators to (`TSLNodeLike`).
|
|
375
|
+
*/
|
|
376
|
+
interface NodeLike {
|
|
377
|
+
uuid?: string
|
|
378
|
+
nodeType?: string | null
|
|
379
|
+
/** label method for chaining - sets the node's label and returns self */
|
|
380
|
+
label?: ((label: string) => NodeLike) | string
|
|
381
|
+
setName?: (name: string) => this
|
|
382
|
+
}
|
|
383
|
+
|
|
384
|
+
/** Flat record of TSL nodes (no nested scopes) */
|
|
385
|
+
type NodeRecord = Record<string, NodeLike>
|
|
386
|
+
|
|
387
|
+
/**
|
|
388
|
+
* Node store that can contain both root-level nodes and scoped node objects.
|
|
389
|
+
* Structure: { wobble: OperatorNode, fx: { blur: ShaderCallable } }
|
|
390
|
+
*/
|
|
391
|
+
type NodeStore = Record<string, NodeLike | NodeRecord>
|
|
392
|
+
|
|
366
393
|
//* Storage Types (useGPUStorage) ========================================
|
|
367
394
|
|
|
368
395
|
/**
|
|
@@ -496,8 +523,13 @@ interface InternalState {
|
|
|
496
523
|
/** Container for child attachment (scene for root, original container for portals) */
|
|
497
524
|
container?: THREE$1.Object3D
|
|
498
525
|
/**
|
|
499
|
-
* CanvasTarget
|
|
500
|
-
*
|
|
526
|
+
* The CanvasTarget this root sizes and renders through.
|
|
527
|
+
*
|
|
528
|
+
* A primary (`<Canvas id>`) owns the renderer's default target -- the one three itself built
|
|
529
|
+
* around the canvas element -- so sizing it is sizing the renderer. A secondary owns a target
|
|
530
|
+
* R3F created for its own element. Either way there is exactly one target per canvas element,
|
|
531
|
+
* and the canvas-target job makes it the renderer's active one before this root renders.
|
|
532
|
+
* Absent on WebGL and on an id-less WebGPU canvas, where the renderer is sized directly.
|
|
501
533
|
* @see https://threejs.org/docs/#api/en/renderers/common/CanvasTarget
|
|
502
534
|
*/
|
|
503
535
|
canvasTarget?: CanvasTarget
|
|
@@ -622,7 +654,7 @@ interface RootState {
|
|
|
622
654
|
/** Global TSL uniform nodes - root-level uniforms + scoped sub-objects. Use useUniforms() hook */
|
|
623
655
|
uniforms: UniformStore
|
|
624
656
|
/** Global TSL nodes - root-level nodes + scoped sub-objects. Use useNodes() hook */
|
|
625
|
-
nodes:
|
|
657
|
+
nodes: NodeStore
|
|
626
658
|
/** Global TSL buffer nodes - root-level buffers + scoped sub-objects. Use useBuffers() hook */
|
|
627
659
|
buffers: BufferStore
|
|
628
660
|
/** Global GPU storage (textures, etc.) - root-level storage + scoped sub-objects. Use useGPUStorage() hook */
|
|
@@ -634,7 +666,7 @@ interface RootState {
|
|
|
634
666
|
/** WebGPU RenderPipeline instance - use useRenderPipeline() hook */
|
|
635
667
|
renderPipeline: ThreeRenderPipeline | null
|
|
636
668
|
/** Global TSL pass nodes for render pipeline - use useRenderPipeline() hook */
|
|
637
|
-
passes:
|
|
669
|
+
passes: PassRecord
|
|
638
670
|
/** Internal version counter for HMR - incremented by rebuildNodes/rebuildUniforms to bust memoization */
|
|
639
671
|
_hmrVersion: number
|
|
640
672
|
/** Internal: whether setSize() has taken ownership of canvas dimensions */
|
|
@@ -1182,7 +1214,33 @@ declare global {
|
|
|
1182
1214
|
* ergonomics. The result is three's structural type, so members stay in sync with the
|
|
1183
1215
|
* installed three instead of needing to be mirrored by hand.
|
|
1184
1216
|
*/
|
|
1185
|
-
type UniformNode<T = unknown> = three_webgpu.UniformNode<
|
|
1217
|
+
type UniformNode<T = unknown> = three_webgpu.UniformNode<UniformNodeTypeFor<T>, T>
|
|
1218
|
+
|
|
1219
|
+
/**
|
|
1220
|
+
* three's node type name for a uniform value type, mirroring the `uniform()` overloads.
|
|
1221
|
+
* A `UniformNode<number>` is a `Node<'float'>`, so TSL math (`.mul`, `.add`, ...) accepts it.
|
|
1222
|
+
* Unknown or unlisted value types resolve to `unknown`, which TSL math rejects: narrow with
|
|
1223
|
+
* `as UniformNode<number>` (or the matching value type) at the call site.
|
|
1224
|
+
*/
|
|
1225
|
+
type UniformNodeTypeFor<T> = T extends number
|
|
1226
|
+
? 'float'
|
|
1227
|
+
: T extends boolean
|
|
1228
|
+
? 'bool'
|
|
1229
|
+
: T extends three_webgpu.Color
|
|
1230
|
+
? 'color'
|
|
1231
|
+
: T extends three_webgpu.Vector2
|
|
1232
|
+
? 'vec2'
|
|
1233
|
+
: T extends three_webgpu.Vector3
|
|
1234
|
+
? 'vec3'
|
|
1235
|
+
: T extends three_webgpu.Vector4
|
|
1236
|
+
? 'vec4'
|
|
1237
|
+
: T extends three_webgpu.Matrix2
|
|
1238
|
+
? 'mat2'
|
|
1239
|
+
: T extends three_webgpu.Matrix3
|
|
1240
|
+
? 'mat3'
|
|
1241
|
+
: T extends three_webgpu.Matrix4
|
|
1242
|
+
? 'mat4'
|
|
1243
|
+
: unknown
|
|
1186
1244
|
|
|
1187
1245
|
/**
|
|
1188
1246
|
* ShaderCallable - the return type of Fn()
|
|
@@ -1335,35 +1393,97 @@ declare global {
|
|
|
1335
1393
|
*/
|
|
1336
1394
|
type ThreeRenderPipeline = three_webgpu.RenderPipeline
|
|
1337
1395
|
|
|
1338
|
-
/**
|
|
1339
|
-
|
|
1396
|
+
/**
|
|
1397
|
+
* The pass `useRenderPipeline` creates for you: three's own `PassNode`, as returned by
|
|
1398
|
+
* `pass(scene, camera)` from `three/tsl`. Referenced from three so members like
|
|
1399
|
+
* `getTextureNode`, `setMRT` and `dispose` track the installed version.
|
|
1400
|
+
*/
|
|
1401
|
+
type ScenePassNode = three_webgpu.PassNode
|
|
1402
|
+
|
|
1403
|
+
/**
|
|
1404
|
+
* Pass record - stores TSL pass nodes for render pipeline.
|
|
1405
|
+
*
|
|
1406
|
+
* `scenePass` is the only key the library owns. It is optional here because this is also the
|
|
1407
|
+
* shape of `state.passes`, which is `{}` before the pipeline exists and again after `reset()`
|
|
1408
|
+
* or `clearPasses()`. Inside the callbacks it is always present; see
|
|
1409
|
+
* {@link RenderPipelineCallbackState}.
|
|
1410
|
+
*
|
|
1411
|
+
* Every other key is user-registered, via a callback's return value. Those are TSL nodes of
|
|
1412
|
+
* any kind, not only passes: texture reads of an MRT attachment, effect nodes, extra
|
|
1413
|
+
* `pass()` instances. `Node` is the common base, so that is the bound. Narrow at the call
|
|
1414
|
+
* site when you need a member, e.g. `passes.velocity as TextureNode`.
|
|
1415
|
+
*/
|
|
1416
|
+
interface PassRecord {
|
|
1417
|
+
scenePass?: ScenePassNode
|
|
1418
|
+
[key: string]: three_webgpu.Node
|
|
1419
|
+
}
|
|
1340
1420
|
|
|
1341
|
-
/**
|
|
1421
|
+
/**
|
|
1422
|
+
* State passed to pipeline callbacks after the active pipeline has been created.
|
|
1423
|
+
*
|
|
1424
|
+
* `passes.scenePass` is required here: the hook installs the default scene pass before either
|
|
1425
|
+
* callback runs, so callbacks can use it without a guard or a cast.
|
|
1426
|
+
*
|
|
1427
|
+
* `renderer` is narrowed to `WebGPURenderer` and `isLegacy` to `false`: the hook throws under
|
|
1428
|
+
* the legacy renderer before either callback can run, so a callback never sees WebGL.
|
|
1429
|
+
*/
|
|
1342
1430
|
type RenderPipelineCallbackState = RootState & {
|
|
1343
1431
|
renderPipeline: ThreeRenderPipeline
|
|
1432
|
+
passes: PassRecord & { scenePass: ScenePassNode }
|
|
1433
|
+
renderer: three_webgpu.WebGPURenderer
|
|
1434
|
+
isLegacy: false
|
|
1344
1435
|
}
|
|
1345
1436
|
|
|
1437
|
+
/**
|
|
1438
|
+
* What a callback may return to register entries into `state.passes`.
|
|
1439
|
+
*
|
|
1440
|
+
* `scenePass` is reserved. The hook owns that entry and its lifecycle: it caches the pass it
|
|
1441
|
+
* created, and `rebuild()` / `reset()` dispose that cached pass. A callback overwriting the
|
|
1442
|
+
* store entry would leave the store pointing at a node the hook never disposes, and the hook
|
|
1443
|
+
* disposing a pass nothing references. So returning it is a type error.
|
|
1444
|
+
*/
|
|
1445
|
+
type RegisteredPasses = Record<string, three_webgpu.Node> & { scenePass?: never }
|
|
1446
|
+
|
|
1346
1447
|
/** Setup callback - runs first to configure MRT, create additional passes */
|
|
1347
|
-
type RenderPipelineSetupCallback = (state: RenderPipelineCallbackState) =>
|
|
1448
|
+
type RenderPipelineSetupCallback = (state: RenderPipelineCallbackState) => RegisteredPasses | void
|
|
1348
1449
|
|
|
1349
1450
|
/** Main callback - runs second to configure outputNode, create effect passes */
|
|
1350
|
-
type RenderPipelineMainCallback = (state: RenderPipelineCallbackState) =>
|
|
1451
|
+
type RenderPipelineMainCallback = (state: RenderPipelineCallbackState) => RegisteredPasses | void
|
|
1351
1452
|
|
|
1352
|
-
/**
|
|
1353
|
-
interface
|
|
1453
|
+
/** The imperative half of useRenderPipeline's return value, present in every state */
|
|
1454
|
+
interface UseRenderPipelineActions {
|
|
1354
1455
|
/** Current passes from state */
|
|
1355
1456
|
passes: PassRecord
|
|
1356
|
-
/** RenderPipeline instance (null if not initialized) */
|
|
1357
|
-
renderPipeline: ThreeRenderPipeline | null
|
|
1358
1457
|
/** Clear all passes from state */
|
|
1359
1458
|
clearPasses: () => void
|
|
1360
1459
|
/** Reset RenderPipeline entirely (clears PP + passes) */
|
|
1361
1460
|
reset: () => void
|
|
1362
1461
|
/** Re-run setup/main callbacks with current closure values */
|
|
1363
1462
|
rebuild: () => void
|
|
1364
|
-
/** True when RenderPipeline is configured and ready */
|
|
1365
|
-
isReady: boolean
|
|
1366
1463
|
}
|
|
1464
|
+
|
|
1465
|
+
/**
|
|
1466
|
+
* Return type for useRenderPipeline hook, discriminated on `isReady`.
|
|
1467
|
+
*
|
|
1468
|
+
* `if (isReady)` narrows `renderPipeline` to non-null, which is what the docs already tell
|
|
1469
|
+
* callers to check. `passes.scenePass` deliberately stays optional in the ready branch:
|
|
1470
|
+
* `clearPasses()` empties the record while leaving the pipeline in place.
|
|
1471
|
+
*/
|
|
1472
|
+
type UseRenderPipelineReturn = UseRenderPipelineActions &
|
|
1473
|
+
(
|
|
1474
|
+
| {
|
|
1475
|
+
/** True when RenderPipeline is configured and ready */
|
|
1476
|
+
isReady: true
|
|
1477
|
+
/** RenderPipeline instance */
|
|
1478
|
+
renderPipeline: ThreeRenderPipeline
|
|
1479
|
+
}
|
|
1480
|
+
| {
|
|
1481
|
+
/** False until the pipeline has been created */
|
|
1482
|
+
isReady: false
|
|
1483
|
+
/** Not initialized yet, or torn down by reset() */
|
|
1484
|
+
renderPipeline: null
|
|
1485
|
+
}
|
|
1486
|
+
)
|
|
1367
1487
|
}
|
|
1368
1488
|
|
|
1369
1489
|
type MutableOrReadonlyParameters<T extends (...args: any) => any> = Parameters<T> | Readonly<Parameters<T>>
|
|
@@ -3781,4 +3901,4 @@ declare function isOnce(value: unknown): value is {
|
|
|
3781
3901
|
declare function Canvas(props: CanvasProps): react_jsx_runtime.JSX.Element;
|
|
3782
3902
|
|
|
3783
3903
|
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, Texture, _roots, 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, getUuidPrefix, hasConstructor, hasPrimary, invalidate, invalidateInstance, is, isColorRepresentation, isCopyable, isFromRef, isObject3D, isOnce, isOrthographicCamera, isRef, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, reconciler, registerPrimary, removeInteractivity, resolve, swapInteractivity, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useEnvironment, useFrame, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useMutableCallback, useRenderTarget, useStore, useTexture, useTextures, useThree, waitForPrimary };
|
|
3784
|
-
export type { Act, Args, ArgsProp, AttachFnType, AttachType, BackgroundConfig, BackgroundProp, BaseRendererProps, Bridge, BufferLike, BufferRecord, BufferStore, Camera, CameraProps, CanvasProps, CanvasSchedulerConfig, Catalogue, Color, ColorManagementConfig, ComputeFunction, ConstructorRepresentation, DefaultGLProps, DefaultRendererProps, Disposable, DisposeOptions, DomEvent, Dpr, ElementProps, EnvironmentLoaderProps, EnvironmentProps, EquConfig, Euler, EventHandlers, EventManager, EventProps, Events, Extensions, FiberRoot, FilterFunction, FrameCallback, FrameNextCallback, FrameNextState, FrameState, 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, RootState, RootStore, SetBlock, Size, StorageLike, StorageRecord, StorageStore, Subscription, TSLNodeInput, TextureInput, TextureResult, ThreeCamera, ThreeElement, ThreeElements, ThreeElementsImpl, ThreeEvent, ThreeExports, ThreeToJSXElements, UnblockProps, UseTextureOptions, UseTexturesReturn, Vector2, Vector3, Vector4, VectorRepresentation, Viewport, VisibilityEntry, WebGLDefaultProps, WebGLProps, WebGLShadowConfig, XRManager, XRPointerConfig };
|
|
3904
|
+
export type { Act, Args, ArgsProp, AttachFnType, AttachType, BackgroundConfig, BackgroundProp, BaseRendererProps, Bridge, BufferLike, BufferRecord, BufferStore, Camera, CameraProps, CanvasProps, CanvasSchedulerConfig, Catalogue, Color, ColorManagementConfig, ComputeFunction, ConstructorRepresentation, DefaultGLProps, DefaultRendererProps, Disposable, DisposeOptions, DomEvent, Dpr, ElementProps, EnvironmentLoaderProps, EnvironmentProps, EquConfig, Euler, EventHandlers, EventManager, EventProps, Events, Extensions, FiberRoot, FilterFunction, FrameCallback, FrameNextCallback, FrameNextState, FrameState, 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, NodeLike, NodeProps, NodeRecord, NodeStore, 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, RootState, RootStore, SetBlock, Size, StorageLike, StorageRecord, StorageStore, Subscription, TSLNodeInput, TextureInput, TextureResult, ThreeCamera, ThreeElement, ThreeElements, ThreeElementsImpl, ThreeEvent, ThreeExports, ThreeToJSXElements, UnblockProps, UseTextureOptions, UseTexturesReturn, Vector2, Vector3, Vector4, VectorRepresentation, Viewport, VisibilityEntry, WebGLDefaultProps, WebGLProps, WebGLShadowConfig, XRManager, XRPointerConfig };
|
package/dist/index.d.mts
CHANGED
|
@@ -363,6 +363,33 @@ type BufferRecord = Record<string, BufferLike>
|
|
|
363
363
|
*/
|
|
364
364
|
type BufferStore = Record<string, BufferLike | BufferRecord>
|
|
365
365
|
|
|
366
|
+
//* Node Types (useNodes) ========================================
|
|
367
|
+
|
|
368
|
+
/**
|
|
369
|
+
* Structural shape of a TSL node as stored on `state.nodes`.
|
|
370
|
+
*
|
|
371
|
+
* Deliberately minimal rather than three's nominal `Node`: in @types/three several node classes
|
|
372
|
+
* TSL hands back (OperatorNode, ConstNode, ...) do not extend `Node` cleanly, so a `Node` bound
|
|
373
|
+
* would reject values `useNodes` creators legitimately return. This is the same shape
|
|
374
|
+
* `useNodes` already constrains creators to (`TSLNodeLike`).
|
|
375
|
+
*/
|
|
376
|
+
interface NodeLike {
|
|
377
|
+
uuid?: string
|
|
378
|
+
nodeType?: string | null
|
|
379
|
+
/** label method for chaining - sets the node's label and returns self */
|
|
380
|
+
label?: ((label: string) => NodeLike) | string
|
|
381
|
+
setName?: (name: string) => this
|
|
382
|
+
}
|
|
383
|
+
|
|
384
|
+
/** Flat record of TSL nodes (no nested scopes) */
|
|
385
|
+
type NodeRecord = Record<string, NodeLike>
|
|
386
|
+
|
|
387
|
+
/**
|
|
388
|
+
* Node store that can contain both root-level nodes and scoped node objects.
|
|
389
|
+
* Structure: { wobble: OperatorNode, fx: { blur: ShaderCallable } }
|
|
390
|
+
*/
|
|
391
|
+
type NodeStore = Record<string, NodeLike | NodeRecord>
|
|
392
|
+
|
|
366
393
|
//* Storage Types (useGPUStorage) ========================================
|
|
367
394
|
|
|
368
395
|
/**
|
|
@@ -496,8 +523,13 @@ interface InternalState {
|
|
|
496
523
|
/** Container for child attachment (scene for root, original container for portals) */
|
|
497
524
|
container?: THREE$1.Object3D
|
|
498
525
|
/**
|
|
499
|
-
* CanvasTarget
|
|
500
|
-
*
|
|
526
|
+
* The CanvasTarget this root sizes and renders through.
|
|
527
|
+
*
|
|
528
|
+
* A primary (`<Canvas id>`) owns the renderer's default target -- the one three itself built
|
|
529
|
+
* around the canvas element -- so sizing it is sizing the renderer. A secondary owns a target
|
|
530
|
+
* R3F created for its own element. Either way there is exactly one target per canvas element,
|
|
531
|
+
* and the canvas-target job makes it the renderer's active one before this root renders.
|
|
532
|
+
* Absent on WebGL and on an id-less WebGPU canvas, where the renderer is sized directly.
|
|
501
533
|
* @see https://threejs.org/docs/#api/en/renderers/common/CanvasTarget
|
|
502
534
|
*/
|
|
503
535
|
canvasTarget?: CanvasTarget
|
|
@@ -622,7 +654,7 @@ interface RootState {
|
|
|
622
654
|
/** Global TSL uniform nodes - root-level uniforms + scoped sub-objects. Use useUniforms() hook */
|
|
623
655
|
uniforms: UniformStore
|
|
624
656
|
/** Global TSL nodes - root-level nodes + scoped sub-objects. Use useNodes() hook */
|
|
625
|
-
nodes:
|
|
657
|
+
nodes: NodeStore
|
|
626
658
|
/** Global TSL buffer nodes - root-level buffers + scoped sub-objects. Use useBuffers() hook */
|
|
627
659
|
buffers: BufferStore
|
|
628
660
|
/** Global GPU storage (textures, etc.) - root-level storage + scoped sub-objects. Use useGPUStorage() hook */
|
|
@@ -634,7 +666,7 @@ interface RootState {
|
|
|
634
666
|
/** WebGPU RenderPipeline instance - use useRenderPipeline() hook */
|
|
635
667
|
renderPipeline: ThreeRenderPipeline | null
|
|
636
668
|
/** Global TSL pass nodes for render pipeline - use useRenderPipeline() hook */
|
|
637
|
-
passes:
|
|
669
|
+
passes: PassRecord
|
|
638
670
|
/** Internal version counter for HMR - incremented by rebuildNodes/rebuildUniforms to bust memoization */
|
|
639
671
|
_hmrVersion: number
|
|
640
672
|
/** Internal: whether setSize() has taken ownership of canvas dimensions */
|
|
@@ -1182,7 +1214,33 @@ declare global {
|
|
|
1182
1214
|
* ergonomics. The result is three's structural type, so members stay in sync with the
|
|
1183
1215
|
* installed three instead of needing to be mirrored by hand.
|
|
1184
1216
|
*/
|
|
1185
|
-
type UniformNode<T = unknown> = three_webgpu.UniformNode<
|
|
1217
|
+
type UniformNode<T = unknown> = three_webgpu.UniformNode<UniformNodeTypeFor<T>, T>
|
|
1218
|
+
|
|
1219
|
+
/**
|
|
1220
|
+
* three's node type name for a uniform value type, mirroring the `uniform()` overloads.
|
|
1221
|
+
* A `UniformNode<number>` is a `Node<'float'>`, so TSL math (`.mul`, `.add`, ...) accepts it.
|
|
1222
|
+
* Unknown or unlisted value types resolve to `unknown`, which TSL math rejects: narrow with
|
|
1223
|
+
* `as UniformNode<number>` (or the matching value type) at the call site.
|
|
1224
|
+
*/
|
|
1225
|
+
type UniformNodeTypeFor<T> = T extends number
|
|
1226
|
+
? 'float'
|
|
1227
|
+
: T extends boolean
|
|
1228
|
+
? 'bool'
|
|
1229
|
+
: T extends three_webgpu.Color
|
|
1230
|
+
? 'color'
|
|
1231
|
+
: T extends three_webgpu.Vector2
|
|
1232
|
+
? 'vec2'
|
|
1233
|
+
: T extends three_webgpu.Vector3
|
|
1234
|
+
? 'vec3'
|
|
1235
|
+
: T extends three_webgpu.Vector4
|
|
1236
|
+
? 'vec4'
|
|
1237
|
+
: T extends three_webgpu.Matrix2
|
|
1238
|
+
? 'mat2'
|
|
1239
|
+
: T extends three_webgpu.Matrix3
|
|
1240
|
+
? 'mat3'
|
|
1241
|
+
: T extends three_webgpu.Matrix4
|
|
1242
|
+
? 'mat4'
|
|
1243
|
+
: unknown
|
|
1186
1244
|
|
|
1187
1245
|
/**
|
|
1188
1246
|
* ShaderCallable - the return type of Fn()
|
|
@@ -1335,35 +1393,97 @@ declare global {
|
|
|
1335
1393
|
*/
|
|
1336
1394
|
type ThreeRenderPipeline = three_webgpu.RenderPipeline
|
|
1337
1395
|
|
|
1338
|
-
/**
|
|
1339
|
-
|
|
1396
|
+
/**
|
|
1397
|
+
* The pass `useRenderPipeline` creates for you: three's own `PassNode`, as returned by
|
|
1398
|
+
* `pass(scene, camera)` from `three/tsl`. Referenced from three so members like
|
|
1399
|
+
* `getTextureNode`, `setMRT` and `dispose` track the installed version.
|
|
1400
|
+
*/
|
|
1401
|
+
type ScenePassNode = three_webgpu.PassNode
|
|
1402
|
+
|
|
1403
|
+
/**
|
|
1404
|
+
* Pass record - stores TSL pass nodes for render pipeline.
|
|
1405
|
+
*
|
|
1406
|
+
* `scenePass` is the only key the library owns. It is optional here because this is also the
|
|
1407
|
+
* shape of `state.passes`, which is `{}` before the pipeline exists and again after `reset()`
|
|
1408
|
+
* or `clearPasses()`. Inside the callbacks it is always present; see
|
|
1409
|
+
* {@link RenderPipelineCallbackState}.
|
|
1410
|
+
*
|
|
1411
|
+
* Every other key is user-registered, via a callback's return value. Those are TSL nodes of
|
|
1412
|
+
* any kind, not only passes: texture reads of an MRT attachment, effect nodes, extra
|
|
1413
|
+
* `pass()` instances. `Node` is the common base, so that is the bound. Narrow at the call
|
|
1414
|
+
* site when you need a member, e.g. `passes.velocity as TextureNode`.
|
|
1415
|
+
*/
|
|
1416
|
+
interface PassRecord {
|
|
1417
|
+
scenePass?: ScenePassNode
|
|
1418
|
+
[key: string]: three_webgpu.Node
|
|
1419
|
+
}
|
|
1340
1420
|
|
|
1341
|
-
/**
|
|
1421
|
+
/**
|
|
1422
|
+
* State passed to pipeline callbacks after the active pipeline has been created.
|
|
1423
|
+
*
|
|
1424
|
+
* `passes.scenePass` is required here: the hook installs the default scene pass before either
|
|
1425
|
+
* callback runs, so callbacks can use it without a guard or a cast.
|
|
1426
|
+
*
|
|
1427
|
+
* `renderer` is narrowed to `WebGPURenderer` and `isLegacy` to `false`: the hook throws under
|
|
1428
|
+
* the legacy renderer before either callback can run, so a callback never sees WebGL.
|
|
1429
|
+
*/
|
|
1342
1430
|
type RenderPipelineCallbackState = RootState & {
|
|
1343
1431
|
renderPipeline: ThreeRenderPipeline
|
|
1432
|
+
passes: PassRecord & { scenePass: ScenePassNode }
|
|
1433
|
+
renderer: three_webgpu.WebGPURenderer
|
|
1434
|
+
isLegacy: false
|
|
1344
1435
|
}
|
|
1345
1436
|
|
|
1437
|
+
/**
|
|
1438
|
+
* What a callback may return to register entries into `state.passes`.
|
|
1439
|
+
*
|
|
1440
|
+
* `scenePass` is reserved. The hook owns that entry and its lifecycle: it caches the pass it
|
|
1441
|
+
* created, and `rebuild()` / `reset()` dispose that cached pass. A callback overwriting the
|
|
1442
|
+
* store entry would leave the store pointing at a node the hook never disposes, and the hook
|
|
1443
|
+
* disposing a pass nothing references. So returning it is a type error.
|
|
1444
|
+
*/
|
|
1445
|
+
type RegisteredPasses = Record<string, three_webgpu.Node> & { scenePass?: never }
|
|
1446
|
+
|
|
1346
1447
|
/** Setup callback - runs first to configure MRT, create additional passes */
|
|
1347
|
-
type RenderPipelineSetupCallback = (state: RenderPipelineCallbackState) =>
|
|
1448
|
+
type RenderPipelineSetupCallback = (state: RenderPipelineCallbackState) => RegisteredPasses | void
|
|
1348
1449
|
|
|
1349
1450
|
/** Main callback - runs second to configure outputNode, create effect passes */
|
|
1350
|
-
type RenderPipelineMainCallback = (state: RenderPipelineCallbackState) =>
|
|
1451
|
+
type RenderPipelineMainCallback = (state: RenderPipelineCallbackState) => RegisteredPasses | void
|
|
1351
1452
|
|
|
1352
|
-
/**
|
|
1353
|
-
interface
|
|
1453
|
+
/** The imperative half of useRenderPipeline's return value, present in every state */
|
|
1454
|
+
interface UseRenderPipelineActions {
|
|
1354
1455
|
/** Current passes from state */
|
|
1355
1456
|
passes: PassRecord
|
|
1356
|
-
/** RenderPipeline instance (null if not initialized) */
|
|
1357
|
-
renderPipeline: ThreeRenderPipeline | null
|
|
1358
1457
|
/** Clear all passes from state */
|
|
1359
1458
|
clearPasses: () => void
|
|
1360
1459
|
/** Reset RenderPipeline entirely (clears PP + passes) */
|
|
1361
1460
|
reset: () => void
|
|
1362
1461
|
/** Re-run setup/main callbacks with current closure values */
|
|
1363
1462
|
rebuild: () => void
|
|
1364
|
-
/** True when RenderPipeline is configured and ready */
|
|
1365
|
-
isReady: boolean
|
|
1366
1463
|
}
|
|
1464
|
+
|
|
1465
|
+
/**
|
|
1466
|
+
* Return type for useRenderPipeline hook, discriminated on `isReady`.
|
|
1467
|
+
*
|
|
1468
|
+
* `if (isReady)` narrows `renderPipeline` to non-null, which is what the docs already tell
|
|
1469
|
+
* callers to check. `passes.scenePass` deliberately stays optional in the ready branch:
|
|
1470
|
+
* `clearPasses()` empties the record while leaving the pipeline in place.
|
|
1471
|
+
*/
|
|
1472
|
+
type UseRenderPipelineReturn = UseRenderPipelineActions &
|
|
1473
|
+
(
|
|
1474
|
+
| {
|
|
1475
|
+
/** True when RenderPipeline is configured and ready */
|
|
1476
|
+
isReady: true
|
|
1477
|
+
/** RenderPipeline instance */
|
|
1478
|
+
renderPipeline: ThreeRenderPipeline
|
|
1479
|
+
}
|
|
1480
|
+
| {
|
|
1481
|
+
/** False until the pipeline has been created */
|
|
1482
|
+
isReady: false
|
|
1483
|
+
/** Not initialized yet, or torn down by reset() */
|
|
1484
|
+
renderPipeline: null
|
|
1485
|
+
}
|
|
1486
|
+
)
|
|
1367
1487
|
}
|
|
1368
1488
|
|
|
1369
1489
|
type MutableOrReadonlyParameters<T extends (...args: any) => any> = Parameters<T> | Readonly<Parameters<T>>
|
|
@@ -3781,4 +3901,4 @@ declare function isOnce(value: unknown): value is {
|
|
|
3781
3901
|
declare function Canvas(props: CanvasProps): react_jsx_runtime.JSX.Element;
|
|
3782
3902
|
|
|
3783
3903
|
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, Texture, _roots, 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, getUuidPrefix, hasConstructor, hasPrimary, invalidate, invalidateInstance, is, isColorRepresentation, isCopyable, isFromRef, isObject3D, isOnce, isOrthographicCamera, isRef, isRenderer, isTexture, isVectorLike, once, prepare, presetsObj, reconciler, registerPrimary, removeInteractivity, resolve, swapInteractivity, unmountComponentAtNode, unregisterPrimary, updateCamera, updateFrustum, useBridge, useEnvironment, useFrame, useGraph, useInstanceHandle, useIsomorphicLayoutEffect, useLoader, useMutableCallback, useRenderTarget, useStore, useTexture, useTextures, useThree, waitForPrimary };
|
|
3784
|
-
export type { Act, Args, ArgsProp, AttachFnType, AttachType, BackgroundConfig, BackgroundProp, BaseRendererProps, Bridge, BufferLike, BufferRecord, BufferStore, Camera, CameraProps, CanvasProps, CanvasSchedulerConfig, Catalogue, Color, ColorManagementConfig, ComputeFunction, ConstructorRepresentation, DefaultGLProps, DefaultRendererProps, Disposable, DisposeOptions, DomEvent, Dpr, ElementProps, EnvironmentLoaderProps, EnvironmentProps, EquConfig, Euler, EventHandlers, EventManager, EventProps, Events, Extensions, FiberRoot, FilterFunction, FrameCallback, FrameNextCallback, FrameNextState, FrameState, 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, RootState, RootStore, SetBlock, Size, StorageLike, StorageRecord, StorageStore, Subscription, TSLNodeInput, TextureInput, TextureResult, ThreeCamera, ThreeElement, ThreeElements, ThreeElementsImpl, ThreeEvent, ThreeExports, ThreeToJSXElements, UnblockProps, UseTextureOptions, UseTexturesReturn, Vector2, Vector3, Vector4, VectorRepresentation, Viewport, VisibilityEntry, WebGLDefaultProps, WebGLProps, WebGLShadowConfig, XRManager, XRPointerConfig };
|
|
3904
|
+
export type { Act, Args, ArgsProp, AttachFnType, AttachType, BackgroundConfig, BackgroundProp, BaseRendererProps, Bridge, BufferLike, BufferRecord, BufferStore, Camera, CameraProps, CanvasProps, CanvasSchedulerConfig, Catalogue, Color, ColorManagementConfig, ComputeFunction, ConstructorRepresentation, DefaultGLProps, DefaultRendererProps, Disposable, DisposeOptions, DomEvent, Dpr, ElementProps, EnvironmentLoaderProps, EnvironmentProps, EquConfig, Euler, EventHandlers, EventManager, EventProps, Events, Extensions, FiberRoot, FilterFunction, FrameCallback, FrameNextCallback, FrameNextState, FrameState, 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, NodeLike, NodeProps, NodeRecord, NodeStore, 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, RootState, RootStore, SetBlock, Size, StorageLike, StorageRecord, StorageStore, Subscription, TSLNodeInput, TextureInput, TextureResult, ThreeCamera, ThreeElement, ThreeElements, ThreeElementsImpl, ThreeEvent, ThreeExports, ThreeToJSXElements, UnblockProps, UseTextureOptions, UseTexturesReturn, Vector2, Vector3, Vector4, VectorRepresentation, Viewport, VisibilityEntry, WebGLDefaultProps, WebGLProps, WebGLShadowConfig, XRManager, XRPointerConfig };
|