react-native-webgpu 0.19.1 → 0.20.0

package/lib/typescript/src/WebGPUViewNativeComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WebGPUViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/WebGPUViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,KAAK,EACL,WAAW,EACZ,MAAM,2CAA2C,CAAC;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,SAAS,EAAE,KAAK,CAAC;IAEjB,kBAAkB,CAAC,EAAE,WAAW,CAC9B,aAAa,GAAG,aAAa,GAAG,oBAAoB,EACpD,aAAa,CACd,CAAC;IACF,aAAa,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IAC5C,kBAAkB,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IACjD,yBAAyB,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;CACzD;;AAGD,wBAAiE"}
+{"version":3,"file":"WebGPUViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/WebGPUViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE5D,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,SAAS,EAAE,YAAY,CAAC,KAAK,CAAC;IAE9B,kBAAkB,CAAC,EAAE,YAAY,CAAC,WAAW,CAC3C,aAAa,GAAG,aAAa,GAAG,oBAAoB,EACpD,aAAa,CACd,CAAC;IACF,aAAa,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IACzD,kBAAkB,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IAC9D,yBAAyB,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;CACtE;;AAGD,wBAAiE"}

package/lib/typescript/src/WebGPUViewNativeComponent.web.d.ts

@@ -1,8 +1,7 @@
 import React from "react";
-import type { Int32 } from "react-native/Libraries/Types/CodegenTypes";
-import type { ViewProps } from "react-native";
+import type { CodegenTypes, ViewProps } from "react-native";
 export interface NativeProps extends ViewProps {
-    contextId: Int32;
+    contextId: CodegenTypes.Int32;
     androidBackingView?: "TextureView" | "SurfaceView" | "HardwareBufferView";
     androidOpaque?: boolean;
     androidZOrderOnTop?: boolean;

package/lib/typescript/src/WebGPUViewNativeComponent.web.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WebGPUViewNativeComponent.web.d.ts","sourceRoot":"","sources":["../../../src/WebGPUViewNativeComponent.web.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2CAA2C,CAAC;AACvE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9C,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,SAAS,EAAE,KAAK,CAAC;IAEjB,kBAAkB,CAAC,EAAE,aAAa,GAAG,aAAa,GAAG,oBAAoB,CAAC;IAC1E,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,yBAAyB,CAAC,EAAE,OAAO,CAAC;CACrC;AAGD,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAC/C,KAAK,EAAE,WAAW,GACjB,KAAK,CAAC,GAAG,CAAC,OAAO,CAuBnB"}
+{"version":3,"file":"WebGPUViewNativeComponent.web.d.ts","sourceRoot":"","sources":["../../../src/WebGPUViewNativeComponent.web.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI5D,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,SAAS,EAAE,YAAY,CAAC,KAAK,CAAC;IAE9B,kBAAkB,CAAC,EAAE,aAAa,GAAG,aAAa,GAAG,oBAAoB,CAAC;IAC1E,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,yBAAyB,CAAC,EAAE,OAAO,CAAC;CACrC;AAGD,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAC/C,KAAK,EAAE,WAAW,GACjB,KAAK,CAAC,GAAG,CAAC,OAAO,CAuBnB"}

package/lib/typescript/src/external/reanimated/registerWebGPUForReanimated.d.ts

@@ -9,6 +9,7 @@ interface BoxedWebGPUObject {
 }
 declare global {
     var __webgpuWorkletHelpers: WebGPUWorkletHelpers | undefined;
+    var __webgpuScheduleOnUI: ((job: () => void) => void) | undefined;
 }
 /**
  * Register WebGPU objects for Worklets serialization.

package/lib/typescript/src/external/reanimated/registerWebGPUForReanimated.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"registerWebGPUForReanimated.d.ts","sourceRoot":"","sources":["../../../../../src/external/reanimated/registerWebGPUForReanimated.ts"],"names":[],"mappings":"AAMA,UAAU,oBAAoB;IAI5B,cAAc,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,OAAO,CAAC;IAC5C,GAAG,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,iBAAiB,CAAC;IAI1C,mBAAmB,EAAE,MAAM,IAAI,CAAC;CACjC;AAED,UAAU,iBAAiB;IACzB,KAAK,EAAE,MAAM,MAAM,CAAC;IACpB,aAAa,EAAE,IAAI,CAAC;CACrB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,IAAI,sBAAsB,EAAE,oBAAoB,GAAG,SAAS,CAAC;CAC9D;AAID;;;;;GAKG;AACH,eAAO,MAAM,2BAA2B,YAiCvC,CAAC"}
+{"version":3,"file":"registerWebGPUForReanimated.d.ts","sourceRoot":"","sources":["../../../../../src/external/reanimated/registerWebGPUForReanimated.ts"],"names":[],"mappings":"AAMA,UAAU,oBAAoB;IAI5B,cAAc,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,OAAO,CAAC;IAC5C,GAAG,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,iBAAiB,CAAC;IAI1C,mBAAmB,EAAE,MAAM,IAAI,CAAC;CACjC;AAED,UAAU,iBAAiB;IACzB,KAAK,EAAE,MAAM,MAAM,CAAC;IACpB,aAAa,EAAE,IAAI,CAAC;CACrB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,IAAI,sBAAsB,EAAE,oBAAoB,GAAG,SAAS,CAAC;IAC7D,IAAI,oBAAoB,EAAE,CAAC,CAAC,GAAG,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;CACnE;AAID;;;;;GAKG;AACH,eAAO,MAAM,2BAA2B,YAoDvC,CAAC"}

package/lib/typescript/src/install.d.ts

@@ -30,10 +30,11 @@
  *   not treat a bare `navigator` as a known global, so they capture the main
  *   runtime's `navigator` object by closure instead of reading the one this
  *   function installed.
- * - Spontaneous events are main-runtime only: on a device created on a
- *   worklet runtime, `device.lost` never settles (unless the device is
- *   already lost when read) and `uncapturederror` listeners never fire.
- *   Observe those on a device created on the main JS thread.
+ * - On a worklet runtime of your own (`createWorkletRuntime`, a frame
+ *   processor), results are delivered while an operation is awaited there:
+ *   `device.lost` and `uncapturederror` arrive with the next awaited
+ *   operation on that runtime, not on their own. The main JS runtime and
+ *   the Reanimated UI runtime receive them right away.
  *
  * Everything is captured into the worklet by closure: the constants like a
  * shader string would be, the GPU object through the Worklets custom
@@ -41,7 +42,7 @@
  * it crosses, and the native helper that installs the class constructors,
  * which worklets hands to every runtime by reference. Promises returned by
  * `requestAdapter`/`requestDevice` settle on the calling runtime (each
- * runtime gets its own async pump). Calling it on a runtime that already has
+ * runtime has its own way of being reached, see RuntimeContext). Calling it on a runtime that already has
  * the globals (e.g. the main JS runtime) is a safe no-op.
  */
 export declare const installWebGPU: () => void;

package/lib/typescript/src/install.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"install.d.ts","sourceRoot":"","sources":["../../../src/install.ts"],"names":[],"mappings":"AAwCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,eAAO,MAAM,aAAa,YAuBzB,CAAC"}
+{"version":3,"file":"install.d.ts","sourceRoot":"","sources":["../../../src/install.ts"],"names":[],"mappings":"AAwCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,eAAO,MAAM,aAAa,YAuBzB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-webgpu",
-  "version": "0.19.1",
+  "version": "0.20.0",
   "description": "React Native WebGPU",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -111,7 +111,7 @@
     "yargs": "^17.7.2"
   },
   "dependencies": {
-    "react-native-webgpu-dawn": "157.0.0"
+    "react-native-webgpu-dawn": "157.1.0"
   },
   "peerDependencies": {
     "react": "*",

package/src/Canvas.tsx

@@ -208,7 +208,9 @@ const useBackingViewWarning = (android?: AndroidCanvasProps) => {
 // asynchronously, so the DOM node is read directly: clientWidth/clientHeight
 // are layout values that ignore transforms too (unlike getBoundingClientRect)
 // and are what browser WebGPU code sizes a canvas from.
-const measureLayout = (view: View) => {
+type ViewRef = React.ComponentRef<typeof View>;
+
+const measureLayout = (view: ViewRef) => {
   if (Platform.OS === "web") {
     const { clientWidth, clientHeight } = view as unknown as HTMLElement;
     return { width: clientWidth, height: clientHeight };
@@ -221,7 +223,7 @@ const measureLayout = (view: View) => {
 };
 
 export const Canvas = ({ android, ref, ...props }: CanvasProps) => {
-  const viewRef = useRef<View>(null);
+  const viewRef = useRef<ViewRef>(null);
   const [contextId, _] = useState(() => generateContextId());
   useBackingViewWarning(android);
   // Retire the native registry entry for this contextId on unmount. When a

package/src/WebGPUViewNativeComponent.ts

@@ -1,20 +1,16 @@
 import { codegenNativeComponent } from "react-native";
-import type {
-  Int32,
-  WithDefault,
-} from "react-native/Libraries/Types/CodegenTypes";
-import type { ViewProps } from "react-native";
+import type { CodegenTypes, ViewProps } from "react-native";
 
 export interface NativeProps extends ViewProps {
-  contextId: Int32;
+  contextId: CodegenTypes.Int32;
   // The `android` prop, resolved (see Canvas.tsx)
-  androidBackingView?: WithDefault<
+  androidBackingView?: CodegenTypes.WithDefault<
     "TextureView" | "SurfaceView" | "HardwareBufferView",
     "TextureView"
   >;
-  androidOpaque?: WithDefault<boolean, false>;
-  androidZOrderOnTop?: WithDefault<boolean, false>;
-  androidZOrderMediaOverlay?: WithDefault<boolean, false>;
+  androidOpaque?: CodegenTypes.WithDefault<boolean, false>;
+  androidZOrderOnTop?: CodegenTypes.WithDefault<boolean, false>;
+  androidZOrderMediaOverlay?: CodegenTypes.WithDefault<boolean, false>;
 }
 
 // eslint-disable-next-line import/no-default-export

package/src/WebGPUViewNativeComponent.web.ts

@@ -1,12 +1,11 @@
 import React from "react";
 import { StyleSheet } from "react-native";
-import type { Int32 } from "react-native/Libraries/Types/CodegenTypes";
-import type { ViewProps } from "react-native";
+import type { CodegenTypes, ViewProps } from "react-native";
 
 import { contextIdToId } from "./utils";
 
 export interface NativeProps extends ViewProps {
-  contextId: Int32;
+  contextId: CodegenTypes.Int32;
   // The `android` prop, resolved: Android-only, never reaches the DOM
   androidBackingView?: "TextureView" | "SurfaceView" | "HardwareBufferView";
   androidOpaque?: boolean;

package/src/external/reanimated/registerWebGPUForReanimated.ts

@@ -23,6 +23,7 @@ interface BoxedWebGPUObject {
 
 declare global {
   var __webgpuWorkletHelpers: WebGPUWorkletHelpers | undefined;
+  var __webgpuScheduleOnUI: ((job: () => void) => void) | undefined;
 }
 
 let isRegistered = false;
@@ -46,7 +47,26 @@ export const registerWebGPUForReanimated = () => {
   }
 
   try {
-    const { registerCustomSerializable } = require("react-native-worklets");
+    const {
+      registerCustomSerializable,
+      scheduleOnUI,
+    } = require("react-native-worklets");
+
+    // A promise created on the UI runtime (requestDevice() in a worklet, a
+    // mapAsync() there) settles on the UI runtime through a timer the
+    // runtime arms on itself; this hook settles it sooner, and delivers
+    // device.lost and uncapturederror right away: native hands a function
+    // that drains the runtime's mailbox, a host function, to this hook on
+    // the main runtime, and worklets runs it on the UI runtime (see
+    // cpp/rnwgpu/async/RuntimeContext.h).
+    if (typeof scheduleOnUI === "function") {
+      globalThis.__webgpuScheduleOnUI = (job: () => void) => {
+        scheduleOnUI(() => {
+          "worklet";
+          job();
+        });
+      };
+    }
 
     registerCustomSerializable({
       name: "WebGPU",

package/src/install.ts

@@ -70,10 +70,11 @@ const helpers = globalThis.__webgpuWorkletHelpers;
  *   not treat a bare `navigator` as a known global, so they capture the main
  *   runtime's `navigator` object by closure instead of reading the one this
  *   function installed.
- * - Spontaneous events are main-runtime only: on a device created on a
- *   worklet runtime, `device.lost` never settles (unless the device is
- *   already lost when read) and `uncapturederror` listeners never fire.
- *   Observe those on a device created on the main JS thread.
+ * - On a worklet runtime of your own (`createWorkletRuntime`, a frame
+ *   processor), results are delivered while an operation is awaited there:
+ *   `device.lost` and `uncapturederror` arrive with the next awaited
+ *   operation on that runtime, not on their own. The main JS runtime and
+ *   the Reanimated UI runtime receive them right away.
  *
  * Everything is captured into the worklet by closure: the constants like a
  * shader string would be, the GPU object through the Worklets custom
@@ -81,7 +82,7 @@ const helpers = globalThis.__webgpuWorkletHelpers;
  * it crosses, and the native helper that installs the class constructors,
  * which worklets hands to every runtime by reference. Promises returned by
  * `requestAdapter`/`requestDevice` settle on the calling runtime (each
- * runtime gets its own async pump). Calling it on a runtime that already has
+ * runtime has its own way of being reached, see RuntimeContext). Calling it on a runtime that already has
  * the globals (e.g. the main JS runtime) is a safe no-op.
  */
 export const installWebGPU = () => {