@react-three/fiber 10.0.0-canary.87166dc → 10.0.0-canary.88b1ca7

package/dist/shared/{fiber.C_MFx7We.d.cts → fiber.DQTSZ24m.d.mts}

@@ -340,10 +340,14 @@ interface RendererProvider {
 }
 
 //* Register ==============================
-// The root entry can construct either renderer, so by default `state.renderer` is the union of
-// both and a WebGPU-only member (`renderer.compute`, `renderer.backend`) needs a narrow. An app that
-// has decided on one renderer says so once, and every renderer-typed field follows -- `useThree`,
-// `useFrame`, `onCreated`, `useRenderTarget`, `state.internal.support`:
+// The base RootState is typed for both renderers, so by default `state.renderer` is the union and a
+// WebGPU-only member (`renderer.compute`, `renderer.backend`) needs a narrow. That base is what
+// `@react-three/fiber/extension` (the entry for libraries) and the `RootState` type expose, so a
+// library compiles for apps on either renderer.
+//
+// Apps rarely need this: each entry's hooks are already typed for the renderer it renders with
+// (`@react-three/fiber` WebGPU, `/legacy` WebGL). Registering narrows the base types too, for code
+// that goes through them (`/extension` hooks in an app, `RootState` annotations):
 //
 //   declare module '@react-three/fiber' {
 //     interface Register {
@@ -352,8 +356,7 @@ interface RendererProvider {
 //   }
 //
 // Same pattern as `Register` in @react-three/tsl (and TanStack Router). Nothing registered means
-// the union, unchanged. The `/legacy` and `/webgpu` entries are the same thing decided by import
-// path; this is for apps on `@react-three/fiber` that want the narrowed types without changing it.
+// the union, unchanged.
 
 /**
  * Augment this to type `RootState` for the renderer your app uses. Recognised keys:
@@ -1233,5 +1236,5 @@ declare function useThree<T = RootState>(selector?: (state: RootState) => T, equ
  */
 declare const context: React$1.Context<RootStore>;
 
-export { useStore as a$, useThree as b0, registerRootExtension as u, setRenderOverride as v, context as x };
-export type { Events as $, Viewport as A, RenderCallback as B, Color as C, Dpr as D, Euler as E, Frameloop as F, GeometryTransformProps as G, Performance as H, InternalState as I, RootState as J, RootStore as K, Layers as L, MutableOrReadonlyParameters as M, NodeProps as N, Object3DMethod as O, PointerState as P, Quaternion as Q, RaycastableRepresentation as R, Subscription as S, TSLNodeInput as T, Intersection as U, VectorRepresentation as V, Camera as W, XRManager as X, IntersectionEvent as Y, ThreeEvent as Z, DomEvent as _, MathRepresentation as a, EventHandlers as a0, FilterFunction as a1, ComputeFunction as a2, XRPointerConfig as a3, EventManager as a4, PointerCaptureTarget as a5, VisibilityEntry as a6, OffscreenCanvas$1 as a7, BaseRendererProps as a8, RendererFactory as a9, Properties as aA, Mutable as aB, IsOptional as aC, IsAllOptional as aD, ThreeCamera as aE, Act as aF, Bridge as aG, SetBlock as aH, UnblockProps as aI, ObjectMap as aJ, EquConfig as aK, Disposable as aL, FrameNextState as aM, FrameState as aN, FrameNextCallback as aO, FrameCallback as aP, ThreeNamespace as aQ, ThreeCore as aR, OcclusionSupport as aS, WebGLSupport as aT, WebGPUSupport as aU, RendererSupport as aV, RendererProvider as aW, Register as aX, RegisteredRenderer as aY, ForRegisteredRenderer as aZ, R3FRendererSupport as a_, Renderer as aa, ColorManagementConfig as ab, ShadowsConfig as ac, RendererSettingsConfig as ad, DefaultGLProps as ae, GLProps as af, DefaultRendererProps as ag, CanvasSchedulerConfig as ah, RendererConfigExtended as ai, RendererProps as aj, CameraProps as ak, RenderProps as al, InjectState as am, FiberRoot as an, TrackedPromise as ao, Root as ap, AttachFnType as aq, AttachType as ar, Catalogue as as, Args as at, ArgsProp as au, InstanceProps as av, Instance as aw, HostConfig as ax, NonFunctionKeys as ay, Overwrite as az, MathTypes as b, MathType as c, MathProps as d, Vector2 as e, Vector3 as f, Vector4 as g, Matrix3 as h, Matrix4 as i, EventProps as j, GeometryProps as k, ReactProps as l, ConstructorRepresentation as m, ElementProps as n, ThreeElement as o, ThreeToJSXElements as p, ThreeElementsOf as q, ElementOf as r, R3FRenderTarget as s, ReconcilerRoot as t, RootExtension as w, R3FRenderer as y, Size as z };
+export { useStore as a$, useThree as b0, registerRootExtension as t, setRenderOverride as u, context as w };
+export type { EventHandlers as $, RenderCallback as A, Performance as B, Color as C, Dpr as D, Euler as E, Frameloop as F, GeometryTransformProps as G, RootState as H, InternalState as I, RootStore as J, Intersection as K, Layers as L, MutableOrReadonlyParameters as M, NodeProps as N, Object3DMethod as O, PointerState as P, Quaternion as Q, RaycastableRepresentation as R, Subscription as S, TSLNodeInput as T, Camera as U, VectorRepresentation as V, IntersectionEvent as W, XRManager as X, ThreeEvent as Y, DomEvent as Z, Events as _, MathRepresentation as a, FilterFunction as a0, ComputeFunction as a1, XRPointerConfig as a2, EventManager as a3, PointerCaptureTarget as a4, VisibilityEntry as a5, OffscreenCanvas$1 as a6, BaseRendererProps as a7, RendererFactory as a8, Renderer as a9, Mutable as aA, IsOptional as aB, IsAllOptional as aC, ThreeCamera as aD, Act as aE, Bridge as aF, SetBlock as aG, UnblockProps as aH, ObjectMap as aI, EquConfig as aJ, Disposable as aK, FrameNextState as aL, FrameState as aM, FrameNextCallback as aN, FrameCallback as aO, ThreeNamespace as aP, ThreeCore as aQ, OcclusionSupport as aR, WebGLSupport as aS, WebGPUSupport as aT, RendererSupport as aU, RendererProvider as aV, Register as aW, RegisteredRenderer as aX, ForRegisteredRenderer as aY, R3FRenderTarget as aZ, R3FRendererSupport as a_, ColorManagementConfig as aa, ShadowsConfig as ab, RendererSettingsConfig as ac, DefaultGLProps as ad, GLProps as ae, DefaultRendererProps as af, CanvasSchedulerConfig as ag, RendererConfigExtended as ah, RendererProps as ai, CameraProps as aj, RenderProps as ak, InjectState as al, FiberRoot as am, TrackedPromise as an, Root as ao, AttachFnType as ap, AttachType as aq, Catalogue as ar, Args as as, ArgsProp as at, InstanceProps as au, Instance as av, HostConfig as aw, NonFunctionKeys as ax, Overwrite as ay, Properties as az, MathTypes as b, MathType as c, MathProps as d, Vector2 as e, Vector3 as f, Vector4 as g, Matrix3 as h, Matrix4 as i, EventProps as j, GeometryProps as k, ReactProps as l, ConstructorRepresentation as m, ElementProps as n, ThreeElement as o, ThreeToJSXElements as p, ThreeElementsOf as q, ElementOf as r, ReconcilerRoot as s, RootExtension as v, R3FRenderer as x, Size as y, Viewport as z };

package/dist/shared/{fiber.C_MFx7We.d.mts → fiber.DQTSZ24m.d.ts}

@@ -340,10 +340,14 @@ interface RendererProvider {
 }
 
 //* Register ==============================
-// The root entry can construct either renderer, so by default `state.renderer` is the union of
-// both and a WebGPU-only member (`renderer.compute`, `renderer.backend`) needs a narrow. An app that
-// has decided on one renderer says so once, and every renderer-typed field follows -- `useThree`,
-// `useFrame`, `onCreated`, `useRenderTarget`, `state.internal.support`:
+// The base RootState is typed for both renderers, so by default `state.renderer` is the union and a
+// WebGPU-only member (`renderer.compute`, `renderer.backend`) needs a narrow. That base is what
+// `@react-three/fiber/extension` (the entry for libraries) and the `RootState` type expose, so a
+// library compiles for apps on either renderer.
+//
+// Apps rarely need this: each entry's hooks are already typed for the renderer it renders with
+// (`@react-three/fiber` WebGPU, `/legacy` WebGL). Registering narrows the base types too, for code
+// that goes through them (`/extension` hooks in an app, `RootState` annotations):
 //
 //   declare module '@react-three/fiber' {
 //     interface Register {
@@ -352,8 +356,7 @@ interface RendererProvider {
 //   }
 //
 // Same pattern as `Register` in @react-three/tsl (and TanStack Router). Nothing registered means
-// the union, unchanged. The `/legacy` and `/webgpu` entries are the same thing decided by import
-// path; this is for apps on `@react-three/fiber` that want the narrowed types without changing it.
+// the union, unchanged.
 
 /**
  * Augment this to type `RootState` for the renderer your app uses. Recognised keys:
@@ -1233,5 +1236,5 @@ declare function useThree<T = RootState>(selector?: (state: RootState) => T, equ
  */
 declare const context: React$1.Context<RootStore>;
 
-export { useStore as a$, useThree as b0, registerRootExtension as u, setRenderOverride as v, context as x };
-export type { Events as $, Viewport as A, RenderCallback as B, Color as C, Dpr as D, Euler as E, Frameloop as F, GeometryTransformProps as G, Performance as H, InternalState as I, RootState as J, RootStore as K, Layers as L, MutableOrReadonlyParameters as M, NodeProps as N, Object3DMethod as O, PointerState as P, Quaternion as Q, RaycastableRepresentation as R, Subscription as S, TSLNodeInput as T, Intersection as U, VectorRepresentation as V, Camera as W, XRManager as X, IntersectionEvent as Y, ThreeEvent as Z, DomEvent as _, MathRepresentation as a, EventHandlers as a0, FilterFunction as a1, ComputeFunction as a2, XRPointerConfig as a3, EventManager as a4, PointerCaptureTarget as a5, VisibilityEntry as a6, OffscreenCanvas$1 as a7, BaseRendererProps as a8, RendererFactory as a9, Properties as aA, Mutable as aB, IsOptional as aC, IsAllOptional as aD, ThreeCamera as aE, Act as aF, Bridge as aG, SetBlock as aH, UnblockProps as aI, ObjectMap as aJ, EquConfig as aK, Disposable as aL, FrameNextState as aM, FrameState as aN, FrameNextCallback as aO, FrameCallback as aP, ThreeNamespace as aQ, ThreeCore as aR, OcclusionSupport as aS, WebGLSupport as aT, WebGPUSupport as aU, RendererSupport as aV, RendererProvider as aW, Register as aX, RegisteredRenderer as aY, ForRegisteredRenderer as aZ, R3FRendererSupport as a_, Renderer as aa, ColorManagementConfig as ab, ShadowsConfig as ac, RendererSettingsConfig as ad, DefaultGLProps as ae, GLProps as af, DefaultRendererProps as ag, CanvasSchedulerConfig as ah, RendererConfigExtended as ai, RendererProps as aj, CameraProps as ak, RenderProps as al, InjectState as am, FiberRoot as an, TrackedPromise as ao, Root as ap, AttachFnType as aq, AttachType as ar, Catalogue as as, Args as at, ArgsProp as au, InstanceProps as av, Instance as aw, HostConfig as ax, NonFunctionKeys as ay, Overwrite as az, MathTypes as b, MathType as c, MathProps as d, Vector2 as e, Vector3 as f, Vector4 as g, Matrix3 as h, Matrix4 as i, EventProps as j, GeometryProps as k, ReactProps as l, ConstructorRepresentation as m, ElementProps as n, ThreeElement as o, ThreeToJSXElements as p, ThreeElementsOf as q, ElementOf as r, R3FRenderTarget as s, ReconcilerRoot as t, RootExtension as w, R3FRenderer as y, Size as z };
+export { useStore as a$, useThree as b0, registerRootExtension as t, setRenderOverride as u, context as w };
+export type { EventHandlers as $, RenderCallback as A, Performance as B, Color as C, Dpr as D, Euler as E, Frameloop as F, GeometryTransformProps as G, RootState as H, InternalState as I, RootStore as J, Intersection as K, Layers as L, MutableOrReadonlyParameters as M, NodeProps as N, Object3DMethod as O, PointerState as P, Quaternion as Q, RaycastableRepresentation as R, Subscription as S, TSLNodeInput as T, Camera as U, VectorRepresentation as V, IntersectionEvent as W, XRManager as X, ThreeEvent as Y, DomEvent as Z, Events as _, MathRepresentation as a, FilterFunction as a0, ComputeFunction as a1, XRPointerConfig as a2, EventManager as a3, PointerCaptureTarget as a4, VisibilityEntry as a5, OffscreenCanvas$1 as a6, BaseRendererProps as a7, RendererFactory as a8, Renderer as a9, Mutable as aA, IsOptional as aB, IsAllOptional as aC, ThreeCamera as aD, Act as aE, Bridge as aF, SetBlock as aG, UnblockProps as aH, ObjectMap as aI, EquConfig as aJ, Disposable as aK, FrameNextState as aL, FrameState as aM, FrameNextCallback as aN, FrameCallback as aO, ThreeNamespace as aP, ThreeCore as aQ, OcclusionSupport as aR, WebGLSupport as aS, WebGPUSupport as aT, RendererSupport as aU, RendererProvider as aV, Register as aW, RegisteredRenderer as aX, ForRegisteredRenderer as aY, R3FRenderTarget as aZ, R3FRendererSupport as a_, ColorManagementConfig as aa, ShadowsConfig as ab, RendererSettingsConfig as ac, DefaultGLProps as ad, GLProps as ae, DefaultRendererProps as af, CanvasSchedulerConfig as ag, RendererConfigExtended as ah, RendererProps as ai, CameraProps as aj, RenderProps as ak, InjectState as al, FiberRoot as am, TrackedPromise as an, Root as ao, AttachFnType as ap, AttachType as aq, Catalogue as ar, Args as as, ArgsProp as at, InstanceProps as au, Instance as av, HostConfig as aw, NonFunctionKeys as ax, Overwrite as ay, Properties as az, MathTypes as b, MathType as c, MathProps as d, Vector2 as e, Vector3 as f, Vector4 as g, Matrix3 as h, Matrix4 as i, EventProps as j, GeometryProps as k, ReactProps as l, ConstructorRepresentation as m, ElementProps as n, ThreeElement as o, ThreeToJSXElements as p, ThreeElementsOf as q, ElementOf as r, ReconcilerRoot as s, RootExtension as v, R3FRenderer as x, Size as y, Viewport as z };

package/dist/shared/fiber.DuA4F8L5.d.ts

@@ -0,0 +1,90 @@
+import { FrameCallback, UseFrameNextOptions, FrameNextControls } from '@pmndrs/scheduler';
+import { WebGPURenderer, WebGPURendererParameters, RenderTarget } from 'three/webgpu';
+import { H as RootState, I as InternalState, a8 as RendererFactory, a7 as BaseRendererProps, az as Properties } from './fiber.DQTSZ24m.js';
+import { R as RenderTargetOptions, aU as CanvasProps } from './fiber.CjMAAsJy.js';
+
+//* Renderer Props ========================================
+
+type WebGPUDefaultProps = Omit<WebGPURendererParameters, 'canvas'> & BaseRendererProps
+
+type WebGPUProps =
+  | RendererFactory<WebGPURenderer, WebGPUDefaultProps>
+  | Partial<Properties<WebGPURenderer> | WebGPURendererParameters>
+
+// WebGPU doesn't have shadow maps in the same way
+interface WebGPUShadowConfig {
+  shadows?: boolean // Simplified for WebGPU
+}
+
+//* WebGPU-specific Types ========================================
+
+/** WebGPU renderer type - re-exported as R3FRenderer from @react-three/fiber/webgpu */
+type WebGPUR3FRenderer = WebGPURenderer
+
+/** WebGPU internal state with narrowed renderer type */
+interface WebGPUInternalState extends Omit<InternalState, 'actualRenderer'> {
+  actualRenderer: WebGPURenderer
+}
+
+/**
+ * WebGPU-specific RootState with narrowed renderer type.
+ * Automatically used when importing from `@react-three/fiber/webgpu`.
+ *
+ * @example
+ * ```tsx
+ * import { useThree } from '@react-three/fiber/webgpu'
+ *
+ * function MyComponent() {
+ *   const { renderer } = useThree()
+ *   // renderer is typed as WebGPURenderer
+ *   renderer.compute(computePass)
+ * }
+ * ```
+ */
+// `gl` is not narrowed: it keeps the base type (WebGLRenderer, for code written against it), so a
+// WebGPURootState stays assignable to RootState and `useFrame((state: RootState) => ...)` still
+// compiles where the hooks are WebGPU-typed. At runtime it aliases `renderer`; use that instead.
+interface WebGPURootState extends Omit<RootState, 'renderer' | 'internal'> {
+  /** The WebGPU renderer instance */
+  renderer: WebGPURenderer
+  /** Internals with WebGPU renderer */
+  internal: WebGPUInternalState
+}
+
+/**
+ * @fileoverview WebGPU-narrowed hook and Canvas types, shared by the entries that render with WebGPU
+ *
+ * `@react-three/fiber` and `@react-three/fiber/webgpu` both render with WebGPURenderer. The core
+ * hooks are declared against the base RootState, whose `renderer` is the R3FRenderer union
+ * (WebGLRenderer included) so that libraries typed against it also compile for `/legacy` apps. On
+ * these entries that union is already resolved, so leaving it in place forced a cast for anything
+ * WebGPU-only:
+ *
+ *   const renderer = useThree((s) => s.renderer)
+ *   renderer.compute(node)   // Property 'compute' does not exist on type 'R3FRenderer'
+ *
+ * The entries re-export the hooks below instead. Types only: the values are the core
+ * implementations untouched, so there is no runtime cost and no second code path to keep in sync.
+ * See https://github.com/pmndrs/react-three-fiber/issues/3851
+ */
+
+/** `useThree` narrowed to WebGPU state — `state.renderer` is a `WebGPURenderer`. */
+type UseThreeWebGPU = <T = WebGPURootState>(selector?: (state: WebGPURootState) => T, equalityFn?: <U>(state: U, newState: U) => boolean) => T;
+/** `useFrame` narrowed to WebGPU state — the callback's `state.renderer` is a `WebGPURenderer`. */
+type UseFrameWebGPU = (callback?: FrameCallback<WebGPURootState>, priorityOrOptions?: number | UseFrameNextOptions) => FrameNextControls;
+declare const useThree: UseThreeWebGPU;
+declare const useFrame: UseFrameWebGPU;
+/** `useRenderTarget` narrowed to the target a WebGPU renderer produces. */
+declare const useRenderTarget: {
+    (options?: RenderTargetOptions): RenderTarget;
+    (size: number, options?: RenderTargetOptions): RenderTarget;
+    (width: number, height: number, options?: RenderTargetOptions): RenderTarget;
+};
+/** Canvas props on a WebGPU entry: `onCreated` receives `WebGPURootState`. */
+type WebGPUCanvasProps = Omit<CanvasProps, 'onCreated'> & {
+    /** Callback after the canvas has rendered (but not yet committed); `state.renderer` is a `WebGPURenderer` */
+    onCreated?: (state: WebGPURootState) => void;
+};
+
+export { useFrame as a, useRenderTarget as b, useThree as u };
+export type { UseThreeWebGPU as U, WebGPUCanvasProps as W, UseFrameWebGPU as c, WebGPURootState as d, WebGPUInternalState as e, WebGPUR3FRenderer as f, WebGPUProps as g, WebGPUDefaultProps as h, WebGPUShadowConfig as i };

package/dist/shared/{fiber.B_KQAb3I.d.ts → fiber.Dy7Uz273.d.mts}

@@ -1,7 +1,7 @@
 import * as React$1 from 'react';
 import { ReactNode, Component, RefObject, JSX } from 'react';
 import { Options } from 'react-use-measure';
-import { al as RenderProps, m as ConstructorRepresentation, aJ as ObjectMap, a8 as BaseRendererProps, a9 as RendererFactory, aA as Properties, I as InternalState, J as RootState, E as Euler$1, K as RootStore, a4 as EventManager, _ as DomEvent, aw as Instance, o as ThreeElement, as as Catalogue, ap as Root, am as InjectState, aR as ThreeCore, aG as Bridge, aI as UnblockProps, aL as Disposable, D as Dpr, aE as ThreeCamera, z as Size, aK as EquConfig } from './fiber.C_MFx7We.js';
+import { ak as RenderProps, m as ConstructorRepresentation, aI as ObjectMap, a7 as BaseRendererProps, a8 as RendererFactory, az as Properties, I as InternalState, H as RootState, E as Euler$1, J as RootStore, a3 as EventManager, Z as DomEvent, av as Instance, o as ThreeElement, ar as Catalogue, ao as Root, al as InjectState, aQ as ThreeCore, aF as Bridge, aH as UnblockProps, aK as Disposable, D as Dpr, aD as ThreeCamera, y as Size, aJ as EquConfig } from './fiber.DQTSZ24m.mjs';
 import * as THREE from 'three';
 import { ColorRepresentation, Euler, Loader, RenderTargetOptions as RenderTargetOptions$1, ColorSpace, Texture as Texture$1, CubeTexture, Scene, Object3D } from 'three';
 import { WebGPURenderer } from 'three/webgpu';
@@ -35,7 +35,7 @@ type PresetsType = keyof typeof presetsObj;
 interface BackgroundConfig {
   /** HDRI preset name: 'apartment', 'city', 'dawn', 'forest', 'lobby', 'night', 'park', 'studio', 'sunset', 'warehouse' */
   preset?: PresetsType
-  /** Files for cube texture (6 faces) or single HDR/EXR */
+  /** Files for cube texture (6 faces) or a single equirect (.hdr, .exr, .jpg, .png, .webp, .avif, .gif) */
   files?: string | string[]
   /** Separate files for scene.background (visual backdrop) */
   backgroundMap?: string | string[]
@@ -55,7 +55,7 @@ interface BackgroundConfig {
  *
  * String detection priority:
  * 1. Preset - exact match against known presets (apartment, city, dawn, forest, lobby, night, park, studio, sunset, warehouse)
- * 2. URL - starts with /, ./, ../, http://, https://, OR has image extension
+ * 2. URL - starts with /, ./, ../, http://, https://, data:, OR has an image extension (a query or hash may follow)
  * 3. Color - default fallback (CSS color names, hex values, rgb(), etc.)
  *
  * @example Color
@@ -270,7 +270,7 @@ type EnvironmentLoaderClearOptions = Pick<EnvironmentLoaderProps, 'files' | 'pre
  *   - scale: Scale of backside projected sphere (default: 1000)
  *
  * Additional loader props:
- * @property files - File path(s) for environment. Supports .hdr, .exr, Ultra HDR .jpg, or array of 6 cube faces
+ * @property files - File path(s) for environment. Supports .hdr, .exr, .jpg (Ultra HDR or plain), an LDR .png/.webp/.avif/.gif, or array of 6 cube faces
  * @property path - Base path for file loading
  * @property extensions - Texture extensions override
  */
@@ -313,8 +313,9 @@ type EnvironmentProps = {
 declare function EnvironmentMap({ scene, background, map, ...config }: EnvironmentProps): null;
 /**
  * Internal component that loads environment textures from files or presets.
- * Uses HDRLoader for .hdr, EXRLoader for .exr, UltraHDRLoader for .jpg/.jpeg Ultra HDR,
- * or CubeTextureLoader for arrays of images.
+ * Uses HDRLoader for .hdr, EXRLoader for .exr, UltraHDRLoader for .jpg/.jpeg (a JPEG without a gain
+ * map loads as a plain image), TextureLoader for an LDR .png/.webp/.avif/.gif, or CubeTextureLoader
+ * for arrays of images.
  *
  * @example With preset
  * ```jsx
@@ -375,7 +376,7 @@ declare function EnvironmentPortal({ children, near, far, resolution, frames, ma
  *
  * Supports multiple input methods:
  * - **Presets**: Selection of HDRI Haven assets (apartment, city, dawn, forest, lobby, night, park, studio, sunset, warehouse)
- * - **Files**: HDR (.hdr), EXR (.exr), Ultra HDR JPEG (.jpg), or cube faces (array of 6 images)
+ * - **Files**: HDR (.hdr), EXR (.exr), JPEG (.jpg, Ultra HDR when it carries a gain map), LDR image (.png, .webp, .avif, .gif), or cube faces (array of 6 images)
  * - **Texture**: Pre-existing cube texture via `map` prop
  * - **Custom Scene**: Render children into environment using portal and cube camera
  * - **Ground Projection**: Project environment onto ground plane
@@ -2489,5 +2490,5 @@ declare function isOnce(value: unknown): value is {
     [ONCE]: any[] | true;
 };
 
-export { useTexture as $, EnvironmentMap as H, EnvironmentCube as J, EnvironmentPortal as K, Environment as M, presetsObj as N, swapInteractivity as Q, removeInteractivity as S, createEvents as T, useInstanceHandle as U, useGraph as V, useLoader as X, IsObject as Y, addEffect as a, Texture as a0, useTextures as a5, useEnvironment as a7, extend as a8, reconciler as a9, diffProps as aA, applyProps as aB, is as aC, isOrthographicCamera as aD, isRef as aE, isColorRepresentation as aF, isObject3D as aG, isTexture as aH, isLayers as aI, isUniform as aJ, isVectorLike as aK, isCopyable as aL, hasConstructor as aM, FROM_REF as aN, fromRef as aP, isFromRef as aQ, ONCE as aR, once as aS, isOnce as aU, flushSync as aa, _roots as ab, unmountComponentAtNode as ac, createPortal as ad, Portal as ae, useIsomorphicLayoutEffect as af, useMutableCallback as ag, useBridge as ah, Block as ai, ErrorBoundary as aj, calculateDpr as ak, getUuidPrefix as al, updateCamera as am, updateFrustum as an, REACT_INTERNAL_PROPS as ao, findInitialRoot as ap, getRootState as aq, buildGraph as ar, dispose as as, getInstanceProps as at, prepare as au, invalidateInstance as av, RESERVED_PROPS as aw, resolve as ax, attach as ay, detach as az, addAfterEffect as b, createPointerEvents as c, addTail as d, advance as e, isRenderer as f, getPrimary as g, hasPrimary as h, invalidate as i, getPrimaryIds as j, createStore as k, getThree as l, hasThree as m, whenThree as n, registerPrimary as r, unregisterPrimary as u, waitForPrimary as w };
-export type { LegacyInternalState as A, BackgroundConfig as B, CanvasProps as C, LegacyRootState as D, Extensions as E, EnvironmentProps as F, GlobalRenderCallback as G, InputLike as I, LoaderLike as L, PresetsType as O, PrimaryCanvasEntry as P, RenderTargetOptions as R, WebGLDefaultProps as W, MappedTextureType as Z, UseTextureOptions as _, TextureInput as a1, TextureResult as a2, DisposeOptions as a3, UseTexturesReturn as a4, EnvironmentLoaderProps as a6, FromRefMarker as aO, OnceValue as aT, GlobalEffectType as o, BackgroundProp as p, GLTFLike as q, LoaderInstance as s, InferLoadResult as t, LoaderResult as v, WebGLProps as x, WebGLShadowConfig as y, LegacyRenderer as z };
+export { Texture as $, EnvironmentMap as F, EnvironmentCube as H, EnvironmentPortal as J, Environment as K, presetsObj as M, swapInteractivity as O, removeInteractivity as Q, createEvents as S, useInstanceHandle as T, useGraph as U, useLoader as V, IsObject as X, useTexture as _, addEffect as a, useTextures as a4, useEnvironment as a6, extend as a7, reconciler as a8, flushSync as a9, applyProps as aA, is as aB, isOrthographicCamera as aC, isRef as aD, isColorRepresentation as aE, isObject3D as aF, isTexture as aG, isLayers as aH, isUniform as aI, isVectorLike as aJ, isCopyable as aK, hasConstructor as aL, FROM_REF as aM, fromRef as aO, isFromRef as aP, ONCE as aQ, once as aR, isOnce as aT, _roots as aa, unmountComponentAtNode as ab, createPortal as ac, Portal as ad, useIsomorphicLayoutEffect as ae, useMutableCallback as af, useBridge as ag, Block as ah, ErrorBoundary as ai, calculateDpr as aj, getUuidPrefix as ak, updateCamera as al, updateFrustum as am, REACT_INTERNAL_PROPS as an, findInitialRoot as ao, getRootState as ap, buildGraph as aq, dispose as ar, getInstanceProps as as, prepare as at, invalidateInstance as au, RESERVED_PROPS as av, resolve as aw, attach as ax, detach as ay, diffProps as az, addAfterEffect as b, createPointerEvents as c, addTail as d, advance as e, isRenderer as f, getPrimary as g, hasPrimary as h, invalidate as i, getPrimaryIds as j, createStore as k, getThree as l, hasThree as m, whenThree as n, registerPrimary as r, unregisterPrimary as u, waitForPrimary as w };
+export type { LegacyInternalState as A, BackgroundConfig as B, LegacyRootState as C, EnvironmentProps as D, Extensions as E, GlobalRenderCallback as G, InputLike as I, LoaderLike as L, PresetsType as N, PrimaryCanvasEntry as P, RenderTargetOptions as R, WebGLDefaultProps as W, MappedTextureType as Y, UseTextureOptions as Z, TextureInput as a0, TextureResult as a1, DisposeOptions as a2, UseTexturesReturn as a3, EnvironmentLoaderProps as a5, FromRefMarker as aN, OnceValue as aS, CanvasProps as aU, GlobalEffectType as o, BackgroundProp as p, GLTFLike as q, LoaderInstance as s, InferLoadResult as t, LoaderResult as v, WebGLProps as x, WebGLShadowConfig as y, LegacyRenderer as z };

package/dist/shared/{fiber.BybcfIwy.cjs → fiber.TRm3lZ7I.cjs}

@@ -1,7 +1,7 @@
 'use strict';
 
 const jsxRuntime = require('react/jsx-runtime');
-const textureStaging = require('./fiber.CsZ092z_.cjs');
+const textureStaging = require('./fiber.BO8-26r8.cjs');
 const React = require('react');
 const useMeasure = require('react-use-measure');
 const itsFine = require('its-fine');
@@ -644,8 +644,9 @@ function applyProps(object, props) {
       for (const name in nextUniforms) {
         const uniform = nextUniforms[name];
         const targetUniform = uniforms[name];
-        if (targetUniform) Object.assign(targetUniform, uniform);
-        else {
+        if (targetUniform) {
+          Object.assign(targetUniform, uniform);
+        } else {
           const nextUniform = isUniform(uniform) ? uniform.clone() : new (getThree()).Uniform(uniform.value);
           uniforms[name] = nextUniform;
         }
@@ -701,13 +702,6 @@ function applyProps(object, props) {
   return object;
 }
 
-const INTERNAL_LIB_MARKERS = ["zustand", "setState", "Object.assign"];
-function isInternalRendererAccess(stack, callerDepth = 2) {
-  if (!stack) return false;
-  const caller = stack.split("\n")[callerDepth] ?? "";
-  return INTERNAL_LIB_MARKERS.some((m) => caller.includes(m));
-}
-
 function updateSize(state, size, imperative) {
   state.set((current) => ({
     size,
@@ -722,7 +716,8 @@ function configureSize(store, size) {
   updateSize(state, size, false);
 }
 const createStore = (invalidate, advance) => {
-  const rootStore = traditional.createWithEqualityFn((set, get) => {
+  const rootStore = traditional.createWithEqualityFn((rawSet, get, api) => {
+    const set = api.setState = textureStaging.preserveAccessors(rawSet, get);
     let position;
     let defaultTarget;
     let tempTarget;
@@ -815,7 +810,7 @@ const createStore = (invalidate, advance) => {
         factor: 0,
         getCurrentViewport
       },
-      setEvents: (events) => set((state2) => ({ ...state2, events: { ...state2.events, ...events } })),
+      setEvents: (events) => set((state2) => ({ events: { ...state2.events, ...events } })),
       setSize: (width, height, top, left) => {
         const state2 = get();
         if (width === void 0) {
@@ -911,37 +906,7 @@ const createStore = (invalidate, advance) => {
     return rootState;
   });
   const state = rootStore.getState();
-  Object.defineProperty(state, "gl", {
-    get() {
-      const currentState = rootStore.getState();
-      if (!currentState.isLegacy && currentState.internal.actualRenderer) {
-        const stack = new Error().stack || "";
-        if (!isInternalRendererAccess(stack)) {
-          const cleanedStack = stack.split("\n").slice(2).join("\n") || "Stack trace unavailable";
-          textureStaging.notifyDepreciated({
-            heading: "Accessing state.gl in WebGPU mode",
-            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
-          });
-        }
-      }
-      return currentState.internal.actualRenderer;
-    },
-    set(value) {
-      rootStore.getState().internal.actualRenderer = value;
-    },
-    enumerable: true,
-    configurable: true
-  });
-  Object.defineProperty(state, "renderer", {
-    get() {
-      return rootStore.getState().internal.actualRenderer;
-    },
-    set(value) {
-      rootStore.getState().internal.actualRenderer = value;
-    },
-    enumerable: true,
-    configurable: true
-  });
+  textureStaging.defineRendererAccessors(state);
   let oldScene = state.scene;
   rootStore.subscribe(() => {
     const currentState = rootStore.getState();
@@ -1000,7 +965,8 @@ function configureScheduler(store, canvasId, schedulerConfig, previous) {
   if (!rootId) {
     const newRootId = state.internal.pendingRootId ?? canvasId ?? scheduler$1.generateRootId();
     const unregisterRoot = scheduler$1.registerRoot(newRootId, {
-      getState: () => store.getState(),
+      // The scheduler spreads this into each frame state; see stateForScheduler
+      getState: () => textureStaging.stateForScheduler(store.getState()),
       onError: (err) => store.getState().setError(err),
       frameloop: store.getState().frameloop,
       before: rootBefore,
@@ -1391,7 +1357,6 @@ function initializeRenderer(canvas, provider, store, props) {
           state.set((prev) => ({
             webGPUSupported: primaryEntry.store.getState().webGPUSupported,
             renderer,
-            gl: renderer,
             primaryStore: primaryEntry.store,
             internal: {
               ...prev.internal,
@@ -1422,7 +1387,6 @@ function initializeRenderer(canvas, provider, store, props) {
               state.set((prev) => ({
                 webGPUSupported: isWebGPUBackend,
                 renderer,
-                gl: renderer,
                 primaryStore: store,
                 internal: {
                   ...prev.internal,
@@ -1442,12 +1406,7 @@ function initializeRenderer(canvas, provider, store, props) {
             const isWebGPUBackend = backend && "isWebGPUBackend" in backend;
             state.internal.actualRenderer = renderer;
             state.internal.releaseRenderer = leaseRenderer(renderer, resolved.owned);
-            state.set({
-              webGPUSupported: isWebGPUBackend,
-              renderer,
-              gl: renderer,
-              primaryStore: store
-            });
+            state.set({ webGPUSupported: isWebGPUBackend, renderer, primaryStore: store });
             if (primary) {
               const canvasTarget = renderer.getCanvasTarget?.();
               (_a = state.internal).pendingRootId ?? (_a.pendingRootId = canvasId || scheduler.getScheduler().generateRootId());
@@ -1879,14 +1838,12 @@ function createRootConfiguration(store, canvas) {
       };
       const xr = {
         connect() {
-          const { gl, renderer: renderer2 } = store.getState();
-          const xrManager = (renderer2 || gl).xr;
+          const xrManager = store.getState().renderer.xr;
           xrManager.addEventListener("sessionstart", handleSessionChange);
           xrManager.addEventListener("sessionend", handleSessionChange);
         },
         disconnect() {
-          const { gl, renderer: renderer2 } = store.getState();
-          const xrManager = (renderer2 || gl).xr;
+          const xrManager = store.getState().renderer.xr;
           xrManager.removeEventListener("sessionstart", handleSessionChange);
           xrManager.removeEventListener("sessionend", handleSessionChange);
         }
@@ -1953,7 +1910,7 @@ function createRootConfiguration(store, canvas) {
   };
 }
 
-const version = "10.0.0-alpha.5";
+const version = "10.0.0-alpha.6";
 const packageData = {
 	version: version};
 
@@ -15824,11 +15781,63 @@ async function importLoader(format) {
       loader = (await import('three/examples/jsm/loaders/EXRLoader.js')).EXRLoader;
       break;
     case "jpg":
-      loader = (await import('three/examples/jsm/loaders/UltraHDRLoader.js')).UltraHDRLoader;
+      loader = createJpegLoader((await import('three/examples/jsm/loaders/UltraHDRLoader.js')).UltraHDRLoader);
+      break;
+    case "ldr":
+      loader = getThree().TextureLoader;
       break;
   }
   return loader;
 }
+function createJpegLoader(UltraHDR) {
+  return class JpegEnvironmentLoader extends UltraHDR {
+    // @ts-expect-error A plain JPEG resolves to a Texture, not the DataTexture UltraHDRLoader declares
+    load(url, onLoad, onProgress, onError) {
+      const three = getThree();
+      const file = new three.FileLoader(this.manager);
+      file.setResponseType("arraybuffer");
+      file.setRequestHeader(this.requestHeader);
+      file.setPath(this.path);
+      file.setWithCredentials(this.withCredentials);
+      file.load(
+        url,
+        (buffer) => {
+          try {
+            this.parse(buffer, (texData) => {
+              const { data } = texData;
+              const texture = new three.DataTexture(data, texData.width, texData.height, three.RGBAFormat, texData.type);
+              texture.minFilter = three.LinearMipMapLinearFilter;
+              texture.magFilter = three.LinearFilter;
+              texture.generateMipmaps = true;
+              texture.flipY = true;
+              texture.needsUpdate = true;
+              onLoad?.(texture);
+            });
+          } catch {
+            const objectURL = URL.createObjectURL(new Blob([buffer], { type: "image/jpeg" }));
+            const settle = () => URL.revokeObjectURL(objectURL);
+            new three.ImageLoader().load(
+              objectURL,
+              (image) => {
+                settle();
+                const texture = new three.Texture(image);
+                texture.needsUpdate = true;
+                onLoad?.(texture);
+              },
+              void 0,
+              (error) => {
+                settle();
+                onError?.(error);
+              }
+            );
+          }
+        },
+        onProgress,
+        onError
+      );
+    }
+  };
+}
 const LOADER_KEY = Symbol("r3f-environment-loader");
 function useEnvironmentLoader(format) {
   return suspendReact.suspend(() => loadLoader(format), [LOADER_KEY, format]);
@@ -15863,7 +15872,8 @@ function useEnvironment({
   ) : loaderResult;
   const three = getThree();
   texture.mapping = isCubemap ? three.CubeReflectionMapping : three.EquirectangularReflectionMapping;
-  texture.colorSpace = colorSpace ?? (isCubemap && format !== "hdr-cube" ? "srgb" : "srgb-linear");
+  const hdr = format === "hdr-cube" || texture.isDataTexture === true;
+  texture.colorSpace = colorSpace ?? (hdr ? "srgb-linear" : "srgb");
   return texture;
 }
 const preloadDefaultOptions = {
@@ -15922,7 +15932,7 @@ function validatePreset(preset) {
 function getFormat(files) {
   const isCubemap = isArray(files) && files.length === 6;
   const firstEntry = isArray(files) ? files[0] : files;
-  const firstExtension = firstEntry.split(".").pop()?.split("?")?.shift()?.toLowerCase();
+  const firstExtension = firstEntry.split(/[?#]/)[0].split(".").pop()?.toLowerCase();
   let format;
   if (isCubemap) format = firstExtension === "hdr" ? "hdr-cube" : "cube";
   else if (firstEntry.startsWith("data:application/exr")) format = "exr";
@@ -15930,6 +15940,8 @@ function getFormat(files) {
   else if (firstEntry.startsWith("data:image/jpeg")) format = "jpg";
   else if (firstExtension === "hdr" || firstExtension === "exr") format = firstExtension;
   else if (firstExtension === "jpg" || firstExtension === "jpeg") format = "jpg";
+  else if (/^data:image\/(png|webp|avif|gif)[;,]/.test(firstEntry)) format = "ldr";
+  else if (["png", "webp", "avif", "gif"].includes(firstExtension)) format = "ldr";
   return { format, isCubemap };
 }
 
@@ -15993,6 +16005,7 @@ function PortalInner({ state = {}, children, container }) {
     const lastRoot = lastRootState.current;
     if (lastRoot) {
       for (const key in rootState) {
+        if (textureStaging.isAccessor(rootState, key)) continue;
         const field = key;
         const changed = rootState[field] !== lastRoot[field];
         const inherited = !(key in rest) && injectState[field] === lastRoot[field];
@@ -16009,11 +16022,7 @@ function PortalInner({ state = {}, children, container }) {
       if (camera !== rootState.camera) updateCamera(camera, resolvedSize);
     }
     const set = injectState.set;
-    return {
-      // The intersect consists of the previous root state
-      ...rootState,
-      ...injectState,
-      ...followed,
+    return Object.assign(textureStaging.cloneState(rootState, injectState, followed), {
       // Portals have their own scene - always a real THREE.Scene (injected if needed)
       scene: portalScene,
       // rootScene always points to the actual THREE.Scene, even inside portals
@@ -16028,13 +16037,19 @@ function PortalInner({ state = {}, children, container }) {
       size: resolvedSize,
       viewport: { ...rootState.viewport, ...viewport },
       // Layers are allowed to override events
-      setEvents: (events2) => set((state2) => ({ ...state2, events: { ...state2.events, ...events2 } })),
-      // Container for child attachment - the portalScene (injected or container itself)
-      internal: { ...rootState.internal, ...injectState.internal, container: portalScene }
-    };
+      setEvents: (events2) => set((state2) => ({ events: { ...state2.events, ...events2 } })),
+      // Container for child attachment - the portalScene (injected or container itself). A portal
+      // renders with its parent's renderer, which `renderer` / `gl` read from `actualRenderer`
+      internal: {
+        ...rootState.internal,
+        ...injectState.internal,
+        actualRenderer: rootState.internal.actualRenderer,
+        container: portalScene
+      }
+    });
   });
   const usePortalStore = React.useMemo(() => {
-    const store = traditional.createWithEqualityFn((set, get) => ({ ...rest, set, get }));
+    const store = traditional.createWithEqualityFn(textureStaging.keepAccessors((set, get) => ({ ...rest, set, get })));
     const onMutate = (prev) => store.setState((state2) => inject.current(prev, state2));
     onMutate(previousRoot.getState());
     return store;
@@ -16244,12 +16259,12 @@ function EnvironmentColor({ color, scene }) {
 function EnvironmentDualSource(props) {
   const { backgroundFiles, ...envProps } = props;
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(EnvironmentCube, { ...envProps, background: false }),
-    /* @__PURE__ */ jsxRuntime.jsx(EnvironmentCube, { ...props, files: backgroundFiles, background: "only" })
+    (envProps.files || envProps.preset) && /* @__PURE__ */ jsxRuntime.jsx(EnvironmentCube, { ...envProps, background: false }),
+    /* @__PURE__ */ jsxRuntime.jsx(EnvironmentCube, { ...props, files: backgroundFiles, preset: void 0, background: "only" })
   ] });
 }
 function Environment(props) {
-  if (props.color && !props.files && !props.preset && !props.map) {
+  if (props.color !== void 0 && !props.files && !props.preset && !props.map) {
     return /* @__PURE__ */ jsxRuntime.jsx(EnvironmentColor, { ...props });
   }
   if (props.backgroundFiles && props.backgroundFiles !== props.files) {
@@ -16259,7 +16274,7 @@ function Environment(props) {
 }
 
 function parseBackground(background) {
-  if (!background) return null;
+  if (background === void 0 || background === null || background === "") return null;
   if (typeof background === "object" && !background.isColor) {
     const { backgroundMap, envMap, files, preset, ...rest } = background;
     return {
@@ -16277,7 +16292,7 @@ function parseBackground(background) {
     if (background in presetsObj) {
       return { preset: background, background: true };
     }
-    if (/^(https?:\/\/|\/|\.\/|\.\.\/)|\.(hdr|exr|jpg|jpeg|png|webp|gif)$/i.test(background)) {
+    if (/^(https?:\/\/|\/|\.\/|\.\.\/|data:)|\.(hdr|exr|jpg|jpeg|png|webp|avif|gif)([?#].*)?$/i.test(background)) {
       return { files: background, background: true };
     }
     return { color: background, background: true };
@@ -16517,7 +16532,7 @@ function CanvasImpl({
         if (rootEntry?.store) textureStaging.notifyRootExtensionsHmr(rootEntry.store);
       });
     };
-    if (typeof ({ url: (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('shared/fiber.BybcfIwy.cjs', document.baseURI).href)) }) !== "undefined" && undefined) {
+    if (typeof ({ url: (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('shared/fiber.TRm3lZ7I.cjs', document.baseURI).href)) }) !== "undefined" && undefined) {
       const hot = undefined;
       hot.on("vite:afterUpdate", handleHMR);
       return () => hot.off?.("vite:afterUpdate", handleHMR);

package/dist/webgpu/index.cjs

@@ -1,9 +1,10 @@
 'use strict';
 
 const jsxRuntime = require('react/jsx-runtime');
-const Canvas$1 = require('../shared/fiber.BybcfIwy.cjs');
+const Canvas$1 = require('../shared/fiber.TRm3lZ7I.cjs');
 const webgpu = require('../chunks/webgpu.cjs');
-const textureStaging = require('../shared/fiber.CsZ092z_.cjs');
+const narrowed = require('../shared/fiber.BSXtODQl.cjs');
+const textureStaging = require('../shared/fiber.BO8-26r8.cjs');
 const scheduler = require('@pmndrs/scheduler');
 
 function addTexture(set, key, value) {
@@ -54,10 +55,7 @@ const provider = {
 function createRoot(canvas) {
   return Canvas$1.createRoot(canvas, provider);
 }
-const useThree = textureStaging.useThree;
-const useFrame = textureStaging.useFrame;
-const useRenderTarget = Canvas$1.useRenderTarget;
-const Canvas = ((props) => /* @__PURE__ */ jsxRuntime.jsx(Canvas$1.Canvas, { ...props, provider }));
+const Canvas = narrowed.asWebGPUCanvas((props) => /* @__PURE__ */ jsxRuntime.jsx(Canvas$1.Canvas, { ...props, provider }));
 
 exports.Environment = Canvas$1.Environment;
 exports.EnvironmentCube = Canvas$1.EnvironmentCube;
@@ -135,6 +133,9 @@ exports.useTexture = Canvas$1.useTexture;
 exports.useTextures = Canvas$1.useTextures;
 exports.waitForPrimary = Canvas$1.waitForPrimary;
 exports.whenThree = Canvas$1.whenThree;
+exports.useFrame = narrowed.useFrame;
+exports.useRenderTarget = narrowed.useRenderTarget;
+exports.useThree = narrowed.useThree;
 exports.Block = textureStaging.Block;
 exports.ErrorBoundary = textureStaging.ErrorBoundary;
 exports.context = textureStaging.context;
@@ -151,6 +152,3 @@ exports.R3F_BUILD_LEGACY = R3F_BUILD_LEGACY;
 exports.R3F_BUILD_WEBGPU = R3F_BUILD_WEBGPU;
 exports.createRoot = createRoot;
 exports.createTextureOperations = createTextureOperations;
-exports.useFrame = useFrame;
-exports.useRenderTarget = useRenderTarget;
-exports.useThree = useThree;