@react-three/fiber 10.0.0-canary.f81281f → 10.0.0-canary.fbc659b

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/dist/extension.cjs +8 -7
  2. package/dist/extension.d.cts +10 -47
  3. package/dist/extension.d.mts +10 -47
  4. package/dist/extension.d.ts +10 -47
  5. package/dist/extension.mjs +1 -1
  6. package/dist/index.cjs +14 -15
  7. package/dist/index.d.cts +13 -13
  8. package/dist/index.d.mts +13 -13
  9. package/dist/index.d.ts +13 -13
  10. package/dist/index.mjs +4 -5
  11. package/dist/legacy.cjs +37 -15
  12. package/dist/legacy.d.cts +10 -7
  13. package/dist/legacy.d.mts +10 -7
  14. package/dist/legacy.d.ts +10 -7
  15. package/dist/legacy.mjs +13 -5
  16. package/dist/shared/fiber.BdIbKbh7.mjs +16563 -0
  17. package/dist/shared/{fiber.C_v1rkNg.mjs → fiber.Biz9olEe.mjs} +214 -62
  18. package/dist/shared/fiber.C6hitYDY.d.cts +48 -0
  19. package/dist/shared/{fiber.Bw8YnGg5.d.cts → fiber.C_MFx7We.d.cts} +555 -19
  20. package/dist/shared/{fiber.Bw8YnGg5.d.mts → fiber.C_MFx7We.d.mts} +555 -19
  21. package/dist/shared/{fiber.Bw8YnGg5.d.ts → fiber.C_MFx7We.d.ts} +555 -19
  22. package/dist/shared/{fiber.DAg-9ieU.d.ts → fiber.CtivZ3IY.d.ts} +190 -548
  23. package/dist/shared/{fiber.Ddgoyqql.d.mts → fiber.CvlK0a1Z.d.mts} +190 -548
  24. package/dist/shared/fiber.D4fD6H74.d.mts +48 -0
  25. package/dist/shared/{fiber.B6zNSmwj.cjs → fiber.DfiCufha.cjs} +222 -60
  26. package/dist/shared/{fiber.DiPB625B.d.cts → fiber.VTTQNnlj.d.cts} +190 -548
  27. package/dist/shared/fiber.YgTUGbja.d.ts +48 -0
  28. package/dist/shared/fiber.nDnBf1np.cjs +16661 -0
  29. package/dist/webgpu/index.cjs +13 -13
  30. package/dist/webgpu/index.d.cts +12 -7
  31. package/dist/webgpu/index.d.mts +12 -7
  32. package/dist/webgpu/index.d.ts +12 -7
  33. package/dist/webgpu/index.mjs +4 -4
  34. package/package.json +8 -8
  35. package/readme.md +1 -1
  36. package/dist/chunks/webgl.cjs +0 -27
  37. package/dist/chunks/webgl.mjs +0 -11
  38. package/dist/shared/fiber.BGL2rpse.cjs +0 -15129
  39. package/dist/shared/fiber.Ch4JrXS2.mjs +0 -15031
@@ -0,0 +1,48 @@
1
+ import { aO as FrameNextCallback } from './fiber.C_MFx7We.mjs';
2
+ import { UseFrameNextOptions, FrameNextControls } from '@pmndrs/scheduler';
3
+
4
+ /**
5
+ * Frame hook with phase-based ordering, priority, and FPS throttling.
6
+ *
7
+ * Always delivers full RootState — works both inside and outside Canvas context:
8
+ * - Inside Canvas: Full RootState (renderer, scene, camera, etc.)
9
+ * - Outside Canvas: The job registers immediately but the callback is held until a
10
+ * Canvas adopts it, then runs with full RootState. For hostless / standalone
11
+ * frame loops with no Canvas, use `@pmndrs/scheduler` directly.
12
+ *
13
+ * Returns a controls object for manual stepping, pausing, and resuming.
14
+ *
15
+ * @param callback - Function called each frame with (state, delta). Optional if you only need scheduler access.
16
+ * @param priorityOrOptions - Either a priority number (backwards compat) or options object
17
+ * @returns Controls object with step(), stepAll(), invalidate(), pause(), resume(), isPaused, id, rootId, scheduler
18
+ *
19
+ * @example
20
+ * // Simple priority (backwards compat)
21
+ * useFrame((state, delta) => { ... }, 5)
22
+ *
23
+ * @example
24
+ * // With phase-based ordering
25
+ * useFrame((state, delta) => { ... }, { phase: 'physics' })
26
+ *
27
+ * @example
28
+ * // Outside Canvas - callback waits for a Canvas, then always has full state
29
+ * function UI() {
30
+ * useFrame((state, delta) => { syncUI(state.camera) });
31
+ * return <button>...</button>;
32
+ * }
33
+ *
34
+ * @example
35
+ * // Hostless / standalone loop (no Canvas) - use @pmndrs/scheduler directly
36
+ * import { getScheduler } from '@pmndrs/scheduler'
37
+ * getScheduler().register((state, delta) => { updateGame(delta) })
38
+ *
39
+ * @example
40
+ * // Scheduler-only access (no callback)
41
+ * const { scheduler } = useFrame()
42
+ * scheduler.pauseJob('some-job-id')
43
+ *
44
+ * @see https://docs.pmnd.rs/react-three-fiber/api/hooks#useframe
45
+ */
46
+ declare function useFrame(callback?: FrameNextCallback, priorityOrOptions?: number | UseFrameNextOptions): FrameNextControls;
47
+
48
+ export { useFrame as u };
@@ -28,16 +28,18 @@ function useMutableCallback(fn) {
28
28
  useIsomorphicLayoutEffect(() => void (ref.current = fn), [fn]);
29
29
  return ref;
30
30
  }
31
+ const useActivityBridge = React__namespace["Activity"] ? itsFine.useActivityBridge : () => React__namespace.Fragment;
31
32
  function useBridge() {
32
33
  const fiber = itsFine.useFiber();
33
34
  const ContextBridge = itsFine.useContextBridge();
35
+ const ActivityBridge = useActivityBridge();
34
36
  return React__namespace.useMemo(
35
37
  () => ({ children }) => {
36
38
  const strict = !!itsFine.traverseFiber(fiber, true, (node) => node.type === React__namespace.StrictMode);
37
39
  const Root = strict ? React__namespace.StrictMode : React__namespace.Fragment;
38
- return /* @__PURE__ */ jsxRuntime.jsx(Root, { children: /* @__PURE__ */ jsxRuntime.jsx(ContextBridge, { children }) });
40
+ return /* @__PURE__ */ jsxRuntime.jsx(Root, { children: /* @__PURE__ */ jsxRuntime.jsx(ActivityBridge, { children: /* @__PURE__ */ jsxRuntime.jsx(ContextBridge, { children }) }) });
39
41
  },
40
- [fiber, ContextBridge]
42
+ [fiber, ContextBridge, ActivityBridge]
41
43
  );
42
44
  }
43
45
  function Block({ set }) {
@@ -62,6 +64,23 @@ const ErrorBoundary = /* @__PURE__ */ (() => {
62
64
  }
63
65
  }, __publicField(_a, "getDerivedStateFromError", () => ({ error: true })), _a;
64
66
  })();
67
+ const noop = () => {
68
+ };
69
+ function Gate({ promise, onSettled }) {
70
+ React__namespace.use(promise);
71
+ useIsomorphicLayoutEffect(onSettled, [onSettled]);
72
+ return null;
73
+ }
74
+ function useGate() {
75
+ const [promise, setPromise] = React__namespace.useState(null);
76
+ const onSettled = React__namespace.useCallback(() => setPromise(null), []);
77
+ const waitFor = React__namespace.useCallback(
78
+ (next) => setPromise((current) => current ?? Promise.resolve(next).then(noop, noop)),
79
+ []
80
+ );
81
+ const gate = promise ? /* @__PURE__ */ jsxRuntime.jsx(React__namespace.Suspense, { fallback: null, children: /* @__PURE__ */ jsxRuntime.jsx(Gate, { promise, onSettled }) }) : null;
82
+ return [gate, waitFor];
83
+ }
65
84
 
66
85
  const shownNotices = /* @__PURE__ */ new Set();
67
86
  function notifyDepreciated({ heading, body, link }) {
@@ -119,10 +138,160 @@ function notifyAlpha({ message, link }) {
119
138
  console.log(`%cMore info: ${link}`, "color: #6366f1; font-weight: normal;");
120
139
  }
121
140
  }
141
+ function isDevelopment() {
142
+ try {
143
+ return process.env.NODE_ENV !== "production";
144
+ } catch {
145
+ return true;
146
+ }
147
+ }
148
+
149
+ const INTERNAL_LIB_MARKERS = [
150
+ "zustand",
151
+ "setState",
152
+ "Object.assign",
153
+ "@pmndrs/scheduler",
154
+ "Scheduler.tickRoot",
155
+ "Scheduler.stepJob"
156
+ ];
157
+ function isInternalRendererAccess(stack, callerDepth = 2) {
158
+ if (!stack) return false;
159
+ const caller = stack.split("\n")[callerDepth] ?? "";
160
+ return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
161
+ }
162
+
163
+ const isAccessorDescriptor = (descriptor) => !!descriptor && (descriptor.get !== void 0 || descriptor.set !== void 0);
164
+ const isAccessor = (object, key) => isAccessorDescriptor(Object.getOwnPropertyDescriptor(object, key));
165
+ function cloneState(...sources) {
166
+ const target = {};
167
+ for (const source of sources) {
168
+ if (source) Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
169
+ }
170
+ return target;
171
+ }
172
+ function preserveAccessors(rawSet, get) {
173
+ return ((partial, replace) => {
174
+ const previous = get();
175
+ const patch = typeof partial === "function" ? partial(previous) : partial;
176
+ if (replace || !previous || patch == null || Object.is(patch, previous)) {
177
+ return rawSet(patch, replace);
178
+ }
179
+ const next = cloneState(previous);
180
+ const viaSetter = [];
181
+ for (const key of Reflect.ownKeys(patch)) {
182
+ const descriptor = Object.getOwnPropertyDescriptor(patch, key);
183
+ if (!descriptor.enumerable) continue;
184
+ if (isAccessorDescriptor(descriptor)) {
185
+ Object.defineProperty(next, key, descriptor);
186
+ } else if (isAccessor(next, key)) {
187
+ viaSetter.push(key);
188
+ } else {
189
+ Object.defineProperty(next, key, {
190
+ value: descriptor.value,
191
+ writable: true,
192
+ enumerable: true,
193
+ configurable: true
194
+ });
195
+ }
196
+ }
197
+ for (const key of viaSetter) next[key] = patch[key];
198
+ rawSet(next, true);
199
+ });
200
+ }
201
+ const keepAccessors = (initializer) => (rawSet, get, api) => {
202
+ const set = preserveAccessors(rawSet, get);
203
+ api.setState = set;
204
+ return initializer(set, get, api);
205
+ };
206
+ let glNoticeShown = false;
207
+ function defineRendererAccessors(state) {
208
+ Object.defineProperty(state, "gl", {
209
+ get() {
210
+ const renderer = this.internal?.actualRenderer;
211
+ if (!glNoticeShown && renderer && !this.isLegacy) {
212
+ const stack = new Error().stack || "";
213
+ if (!isInternalRendererAccess(stack)) {
214
+ glNoticeShown = true;
215
+ const cleanedStack = stack.split("\n").slice(2).join("\n") || "Stack trace unavailable";
216
+ notifyDepreciated({
217
+ heading: "Accessing state.gl in WebGPU mode",
218
+ body: "Please use state.renderer instead. state.gl is deprecated and will be removed in future versions.\n\nFor backwards compatibility, state.gl currently maps to state.renderer, but this may cause issues with libraries expecting WebGLRenderer.\n\nAccessed from:\n" + cleanedStack
219
+ });
220
+ }
221
+ }
222
+ return renderer;
223
+ },
224
+ set(value) {
225
+ this.internal.actualRenderer = value;
226
+ },
227
+ enumerable: true,
228
+ configurable: true
229
+ });
230
+ Object.defineProperty(state, "renderer", {
231
+ get() {
232
+ return this.internal?.actualRenderer;
233
+ },
234
+ set(value) {
235
+ this.internal.actualRenderer = value;
236
+ },
237
+ enumerable: true,
238
+ configurable: true
239
+ });
240
+ }
122
241
 
123
242
  const R3F_CONTEXT = Symbol.for("@react-three/fiber.context");
124
243
  const context = globalThis[R3F_CONTEXT] ?? (globalThis[R3F_CONTEXT] = React__namespace.createContext(null));
125
244
 
245
+ const R3F_EXTENSIONS = Symbol.for("@react-three/fiber.extensions");
246
+ function getRegistry() {
247
+ return globalThis[R3F_EXTENSIONS] ?? (globalThis[R3F_EXTENSIONS] = {
248
+ extensions: /* @__PURE__ */ new Map(),
249
+ roots: /* @__PURE__ */ new Set(),
250
+ applied: /* @__PURE__ */ new WeakMap()
251
+ });
252
+ }
253
+ function setupRoot(registry, store, extension) {
254
+ let applied = registry.applied.get(store);
255
+ if (!applied) registry.applied.set(store, applied = /* @__PURE__ */ new Map());
256
+ if (applied.has(extension.name)) return;
257
+ applied.set(extension.name, extension);
258
+ const patch = extension.setup?.(store);
259
+ if (patch) store.setState(patch);
260
+ }
261
+ function registerRootExtension(extension) {
262
+ const registry = getRegistry();
263
+ registry.extensions.set(extension.name, extension);
264
+ for (const store of registry.roots) setupRoot(registry, store, extension);
265
+ return () => {
266
+ if (registry.extensions.get(extension.name) === extension) registry.extensions.delete(extension.name);
267
+ };
268
+ }
269
+ function setRenderOverride(store, render) {
270
+ store.getState().internal.renderOverride = render;
271
+ }
272
+ function attachRootExtensions(store) {
273
+ const registry = getRegistry();
274
+ registry.roots.add(store);
275
+ for (const extension of registry.extensions.values()) setupRoot(registry, store, extension);
276
+ }
277
+ function current(registry, setUpBy) {
278
+ return registry.extensions.get(setUpBy.name) ?? setUpBy;
279
+ }
280
+ function detachRootExtensions(store) {
281
+ const registry = getRegistry();
282
+ if (!registry.roots.delete(store)) return;
283
+ const applied = registry.applied.get(store);
284
+ registry.applied.delete(store);
285
+ if (!applied) return;
286
+ for (const setUpBy of applied.values()) current(registry, setUpBy).dispose?.(store);
287
+ }
288
+ function notifyRootExtensionsHmr(store) {
289
+ const registry = getRegistry();
290
+ const applied = registry.applied.get(store);
291
+ if (!applied) return;
292
+ for (const setUpBy of applied.values()) current(registry, setUpBy).hmr?.(store);
293
+ }
294
+
126
295
  function useStore() {
127
296
  const store = React.useContext(context);
128
297
  if (!store) throw new Error("R3F: Hooks can only be used within the Canvas component!");
@@ -149,12 +318,20 @@ function useFrame(callback, priorityOrOptions) {
149
318
  const options = React__namespace.useMemo(() => {
150
319
  return typeof priorityOrOptions === "number" ? { priority: priorityOrOptions } : priorityOrOptions ?? {};
151
320
  }, [optionsKey]);
152
- const reactId = React__namespace.useId();
153
- const id = options.id ?? reactId;
321
+ const [generatedId] = React__namespace.useState(() => scheduler$1.generateJobId());
322
+ const id = options.id ?? generatedId;
154
323
  const callbackRef = useMutableCallback(callback);
155
324
  const isLegacyPriority = typeof priorityOrOptions === "number" && priorityOrOptions > 0;
325
+ const isLegacyOrdering = typeof priorityOrOptions === "number" && priorityOrOptions < 0;
156
326
  useIsomorphicLayoutEffect(() => {
157
327
  if (!callback) return;
328
+ if (isLegacyOrdering) {
329
+ notifyDepreciated({
330
+ heading: "useFrame numeric priority order is reversed in v10",
331
+ body: "useFrame(callback, number) is deprecated and its ordering direction is reversed from v9: v9 ran lower numbers first, v10 maps the number to { priority } and runs higher numbers first, so a negative priority now runs after default-priority jobs.\n\nUse { before, after } to name the dependency, or { priority } with the v10 direction (higher = earlier).",
332
+ link: "https://docs.pmnd.rs/react-three-fiber/api/hooks#useframe"
333
+ });
334
+ }
158
335
  if (isInsideCanvas) {
159
336
  const state = store.getState();
160
337
  const rootId = state.internal.rootId;
@@ -168,19 +345,17 @@ function useFrame(callback, priorityOrOptions) {
168
345
  }
169
346
  notifyDepreciated({
170
347
  heading: "useFrame with numeric priority is deprecated",
171
- body: 'Using useFrame(callback, number) to control render order is deprecated.\n\nFor custom rendering, use: useFrame(callback, { phase: "render" })\nFor execution order within update phase, use: useFrame(callback, { priority: number })',
348
+ body: 'Using useFrame(callback, number) to control render order is deprecated.\n\nFor custom rendering, use: useFrame(callback, { phase: "render" })\nFor execution order within a phase, use: useFrame(callback, { priority: number }) \u2014 higher runs first, the reverse of v9',
172
349
  link: "https://docs.pmnd.rs/react-three-fiber/api/hooks#useframe"
173
350
  });
174
351
  }
175
352
  const wrappedCallback = (frameState, delta) => {
176
- const localState = store.getState();
177
- const mergedState = {
178
- ...localState,
179
- time: frameState.time,
180
- delta: frameState.delta,
181
- elapsed: frameState.elapsed,
182
- frame: frameState.frame
183
- };
353
+ const mergedState = cloneState(store.getState());
354
+ mergedState.time = frameState.time;
355
+ mergedState.delta = frameState.delta;
356
+ mergedState.elapsed = frameState.elapsed;
357
+ mergedState.frame = frameState.frame;
358
+ mergedState.overstep = frameState.overstep;
184
359
  callbackRef.current?.(mergedState, delta);
185
360
  };
186
361
  const unregister = scheduler$1.register(wrappedCallback, {
@@ -213,7 +388,7 @@ function useFrame(callback, priorityOrOptions) {
213
388
  { id, ...options }
214
389
  );
215
390
  }
216
- }, [store, scheduler$1, id, optionsKey, isLegacyPriority, isInsideCanvas]);
391
+ }, [store, scheduler$1, id, optionsKey, isLegacyPriority, isLegacyOrdering, isInsideCanvas]);
217
392
  const isPaused = React__namespace.useSyncExternalStore(
218
393
  // Subscribe function
219
394
  React__namespace.useCallback(
@@ -291,68 +466,55 @@ function useFrame(callback, priorityOrOptions) {
291
466
  return controls;
292
467
  }
293
468
 
294
- const R3F_EXTENSIONS = Symbol.for("@react-three/fiber.extensions");
295
- function getRegistry() {
296
- return globalThis[R3F_EXTENSIONS] ?? (globalThis[R3F_EXTENSIONS] = {
297
- extensions: /* @__PURE__ */ new Map(),
298
- roots: /* @__PURE__ */ new Set(),
299
- applied: /* @__PURE__ */ new WeakMap()
300
- });
301
- }
302
- function setupRoot(registry, store, extension) {
303
- let applied = registry.applied.get(store);
304
- if (!applied) registry.applied.set(store, applied = /* @__PURE__ */ new Map());
305
- if (applied.has(extension.name)) return;
306
- applied.set(extension.name, extension);
307
- const patch = extension.setup?.(store);
308
- if (patch) store.setState(patch);
309
- }
310
- function registerRootExtension(extension) {
311
- const registry = getRegistry();
312
- registry.extensions.set(extension.name, extension);
313
- for (const store of registry.roots) setupRoot(registry, store, extension);
314
- return () => {
315
- if (registry.extensions.get(extension.name) === extension) registry.extensions.delete(extension.name);
316
- };
317
- }
318
- function setRenderOverride(store, render) {
319
- store.getState().internal.renderOverride = render;
320
- }
321
- function attachRootExtensions(store) {
322
- const registry = getRegistry();
323
- registry.roots.add(store);
324
- for (const extension of registry.extensions.values()) setupRoot(registry, store, extension);
325
- }
326
- function current(registry, setUpBy) {
327
- return registry.extensions.get(setUpBy.name) ?? setUpBy;
469
+ const R3F_STAGED_TEXTURES = Symbol.for("@react-three/fiber.stagedTextures");
470
+ const globalStaging = globalThis;
471
+ const staging = globalStaging[R3F_STAGED_TEXTURES] ?? (globalStaging[R3F_STAGED_TEXTURES] = /* @__PURE__ */ new WeakMap());
472
+ function stageTextures(store, entries) {
473
+ const registered = store.getState().textures;
474
+ let staged = staging.get(store);
475
+ for (const [url, texture] of entries) {
476
+ if (registered.has(url)) continue;
477
+ if (!staged) staging.set(store, staged = /* @__PURE__ */ new Map());
478
+ staged.set(url, texture);
479
+ }
328
480
  }
329
- function detachRootExtensions(store) {
330
- const registry = getRegistry();
331
- if (!registry.roots.delete(store)) return;
332
- const applied = registry.applied.get(store);
333
- registry.applied.delete(store);
334
- if (!applied) return;
335
- for (const setUpBy of applied.values()) current(registry, setUpBy).dispose?.(store);
481
+ function unstageTextures(store, urls) {
482
+ const staged = staging.get(store);
483
+ if (!staged) return;
484
+ for (const url of urls) staged.delete(url);
485
+ if (staged.size === 0) staging.delete(store);
336
486
  }
337
- function notifyRootExtensionsHmr(store) {
338
- const registry = getRegistry();
339
- const applied = registry.applied.get(store);
340
- if (!applied) return;
341
- for (const setUpBy of applied.values()) current(registry, setUpBy).hmr?.(store);
487
+ function getTextureView(store) {
488
+ const registered = store.getState().textures;
489
+ const staged = staging.get(store);
490
+ if (!staged) return registered;
491
+ const view = new Map(registered);
492
+ for (const [url, texture] of staged) if (!view.has(url)) view.set(url, texture);
493
+ return view;
342
494
  }
343
495
 
344
496
  exports.Block = Block;
345
497
  exports.ErrorBoundary = ErrorBoundary;
346
498
  exports.attachRootExtensions = attachRootExtensions;
499
+ exports.cloneState = cloneState;
347
500
  exports.context = context;
501
+ exports.defineRendererAccessors = defineRendererAccessors;
348
502
  exports.detachRootExtensions = detachRootExtensions;
503
+ exports.getTextureView = getTextureView;
504
+ exports.isAccessor = isAccessor;
505
+ exports.isDevelopment = isDevelopment;
506
+ exports.keepAccessors = keepAccessors;
349
507
  exports.notifyAlpha = notifyAlpha;
350
508
  exports.notifyDepreciated = notifyDepreciated;
351
509
  exports.notifyRootExtensionsHmr = notifyRootExtensionsHmr;
510
+ exports.preserveAccessors = preserveAccessors;
352
511
  exports.registerRootExtension = registerRootExtension;
353
512
  exports.setRenderOverride = setRenderOverride;
513
+ exports.stageTextures = stageTextures;
514
+ exports.unstageTextures = unstageTextures;
354
515
  exports.useBridge = useBridge;
355
516
  exports.useFrame = useFrame;
517
+ exports.useGate = useGate;
356
518
  exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;
357
519
  exports.useMutableCallback = useMutableCallback;
358
520
  exports.useStore = useStore;