react-native-skia 3.0.0 → 3.0.2

package/lib/module/views/types.d.ts

@@ -1,10 +1,6 @@
 import type { ViewProps } from "react-native";
 import type { SharedValue } from "react-native-reanimated";
 import type { SkGraphiteContext, SkImage, SkPicture, SkRect, SkSize } from "../skia/types";
-export type NativeSkiaViewProps = ViewProps & {
-    debug?: boolean;
-    opaque?: boolean;
-};
 export type AndroidSurfaceType = "SurfaceView" | "TextureView";
 export interface AndroidCanvasProps {
     /**
@@ -35,17 +31,13 @@ export interface ISkiaViewApi {
     makeImageSnapshotAsync: (nativeId: number, rect?: SkRect) => Promise<SkImage>;
     size: (nativeId: number) => SkSize;
     /**
-     * The recording side of a SkiaGraphiteView: its native id, the layout size
-     * in points, and the props its surface format follows from. Graphite only.
+     * The recording side of a view: its native id, the layout size in points,
+     * and the props its surface format follows from.
      */
     makeGraphiteContext: (nativeId: number, width: number, height: number, opaque: boolean, highBitDepth: boolean) => SkGraphiteContext;
 }
+/** The props every Skia view takes, whichever way it is drawn. */
 export interface SkiaBaseViewProps extends ViewProps {
-    /**
-     * When set to true the view will display information about the
-     * average time it takes to render.
-     */
-    debug?: boolean;
     /**
      * Declares that the canvas covers every pixel of its bounds. On Android an
      * opaque canvas is backed by a `SurfaceView` by default, the cheapest path
@@ -64,6 +56,5 @@ export interface SkiaBaseViewProps extends ViewProps {
 }
 export interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {
     picture?: SkPicture;
-    androidWarmup?: boolean;
 }
 export type SkiaGraphiteViewNativeProps = SkiaBaseViewProps;

package/lib/module/views/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type { ViewProps } from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport type {\n  SkGraphiteContext,\n  SkImage,\n  SkPicture,\n  SkRect,\n  SkSize,\n} from \"../skia/types\";\n\nexport type NativeSkiaViewProps = ViewProps & {\n  debug?: boolean;\n  opaque?: boolean;\n};\n\nexport type AndroidSurfaceType = \"SurfaceView\" | \"TextureView\";\n\nexport interface AndroidCanvasProps {\n  /**\n   * Backing view. Defaults to `SurfaceView` when the canvas is `opaque` and to\n   * `TextureView` otherwise; both composite correctly in React Native stacking\n   * order without further flags.\n   */\n  surfaceType?: AndroidSurfaceType;\n  /**\n   * SurfaceView only: composite above every React Native view in the window,\n   * ignoring `zIndex`. Ignored for TextureView. Defaults to false.\n   */\n  zOrderOnTop?: boolean;\n}\n\nexport interface ISkiaViewApi {\n  web?: boolean;\n  setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;\n  requestRedraw: (nativeId: number) => void;\n  /**\n   * Reads the shared values into the recording held for the view and\n   * schedules a redraw. Native only; called from a worklet on every frame.\n   * Until the view registers, the recording is queued for it and kept\n   * current all the same. Ignored when the recording `recorderId` is neither\n   * held by the view nor queued for it.\n   */\n  applyUpdates: (\n    nativeId: number,\n    recorderId: number,\n    values: SharedValue<unknown>[]\n  ) => void;\n  makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;\n  makeImageSnapshotAsync: (nativeId: number, rect?: SkRect) => Promise<SkImage>;\n  size: (nativeId: number) => SkSize;\n  /**\n   * The recording side of a SkiaGraphiteView: its native id, the layout size\n   * in points, and the props its surface format follows from. Graphite only.\n   */\n  makeGraphiteContext: (\n    nativeId: number,\n    width: number,\n    height: number,\n    opaque: boolean,\n    highBitDepth: boolean\n  ) => SkGraphiteContext;\n}\n\nexport interface SkiaBaseViewProps extends ViewProps {\n  /**\n   * When set to true the view will display information about the\n   * average time it takes to render.\n   */\n  debug?: boolean;\n\n  /**\n   * Declares that the canvas covers every pixel of its bounds. On Android an\n   * opaque canvas is backed by a `SurfaceView` by default, the cheapest path\n   * (see `android.surfaceType`). Defaults to false.\n   */\n  opaque?: boolean;\n\n  /**\n   * Renders into a surface with more than 8 bits per channel (16-bit float on\n   * iOS, 10-bit on Android) to avoid banding in subtle gradients. On Android\n   * the extra precision survives composition only when combined with `opaque`.\n   */\n  highBitDepth?: boolean;\n\n  /** Android-only rendering options. Ignored on iOS and web. */\n  android?: AndroidCanvasProps;\n\n  // On web, only 16 WebGL contextes are allowed. If the drawing is non-animated, set\n  // __destroyWebGLContextAfterRender to true to release the context after each draw.\n  __destroyWebGLContextAfterRender?: boolean;\n}\n\nexport interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {\n  picture?: SkPicture;\n  androidWarmup?: boolean;\n}\n\nexport type SkiaGraphiteViewNativeProps = SkiaBaseViewProps;\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type { ViewProps } from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport type {\n  SkGraphiteContext,\n  SkImage,\n  SkPicture,\n  SkRect,\n  SkSize,\n} from \"../skia/types\";\n\nexport type AndroidSurfaceType = \"SurfaceView\" | \"TextureView\";\n\nexport interface AndroidCanvasProps {\n  /**\n   * Backing view. Defaults to `SurfaceView` when the canvas is `opaque` and to\n   * `TextureView` otherwise; both composite correctly in React Native stacking\n   * order without further flags.\n   */\n  surfaceType?: AndroidSurfaceType;\n  /**\n   * SurfaceView only: composite above every React Native view in the window,\n   * ignoring `zIndex`. Ignored for TextureView. Defaults to false.\n   */\n  zOrderOnTop?: boolean;\n}\n\nexport interface ISkiaViewApi {\n  web?: boolean;\n  setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;\n  requestRedraw: (nativeId: number) => void;\n  /**\n   * Reads the shared values into the recording held for the view and\n   * schedules a redraw. Native only; called from a worklet on every frame.\n   * Until the view registers, the recording is queued for it and kept\n   * current all the same. Ignored when the recording `recorderId` is neither\n   * held by the view nor queued for it.\n   */\n  applyUpdates: (\n    nativeId: number,\n    recorderId: number,\n    values: SharedValue<unknown>[]\n  ) => void;\n  makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;\n  makeImageSnapshotAsync: (nativeId: number, rect?: SkRect) => Promise<SkImage>;\n  size: (nativeId: number) => SkSize;\n  /**\n   * The recording side of a view: its native id, the layout size in points,\n   * and the props its surface format follows from.\n   */\n  makeGraphiteContext: (\n    nativeId: number,\n    width: number,\n    height: number,\n    opaque: boolean,\n    highBitDepth: boolean\n  ) => SkGraphiteContext;\n}\n\n/** The props every Skia view takes, whichever way it is drawn. */\nexport interface SkiaBaseViewProps extends ViewProps {\n  /**\n   * Declares that the canvas covers every pixel of its bounds. On Android an\n   * opaque canvas is backed by a `SurfaceView` by default, the cheapest path\n   * (see `android.surfaceType`). Defaults to false.\n   */\n  opaque?: boolean;\n\n  /**\n   * Renders into a surface with more than 8 bits per channel (16-bit float on\n   * iOS, 10-bit on Android) to avoid banding in subtle gradients. On Android\n   * the extra precision survives composition only when combined with `opaque`.\n   */\n  highBitDepth?: boolean;\n\n  /** Android-only rendering options. Ignored on iOS and web. */\n  android?: AndroidCanvasProps;\n\n  // On web, only 16 WebGL contextes are allowed. If the drawing is non-animated, set\n  // __destroyWebGLContextAfterRender to true to release the context after each draw.\n  __destroyWebGLContextAfterRender?: boolean;\n}\n\nexport interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {\n  picture?: SkPicture;\n}\n\nexport type SkiaGraphiteViewNativeProps = SkiaBaseViewProps;\n"],"mappings":"","ignoreList":[]}

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

@@ -1,10 +1,8 @@
 import "./skia/NativeSetup";
 export { JsiSkImage } from "./skia/web/JsiSkImage";
 export * from "./renderer";
-export { useCanvasRef, useCanvasSize } from "./renderer/Canvas";
+export { Canvas, useCanvasRef, useCanvasSize } from "./renderer/Canvas";
 export type { CanvasProps, CanvasRef } from "./renderer/Canvas";
-export { GraphiteCanvas } from "./renderer/GraphiteCanvas";
-export { Canvas } from "./renderer/DefaultCanvas";
 export * from "./renderer/Offscreen";
 export * from "./views";
 export * from "./skia";

package/lib/typescript/src/renderer/Canvas.d.ts

@@ -1,6 +1,6 @@
 import type { FC, RefObject } from "react";
 import React from "react";
-import type { MeasureInWindowOnSuccessCallback, MeasureOnSuccessCallback, View, ViewProps } from "react-native";
+import type { MeasureInWindowOnSuccessCallback, MeasureOnSuccessCallback, ViewProps } from "react-native";
 import type { SharedValue } from "react-native-reanimated";
 import type { AndroidCanvasProps } from "../views/types";
 import type { SkImage, SkRect, SkSize } from "../skia/types";
@@ -18,7 +18,6 @@ export declare const useCanvasSize: (userRef?: RefObject<CanvasRef | null>) => {
     size: SkSize;
 };
 export interface CanvasProps extends Omit<ViewProps, "onLayout"> {
-    debug?: boolean;
     /** @deprecated Not supported on native. Use `onSize` or `useCanvasSize()` instead. */
     onLayout?: ViewProps["onLayout"];
     /**
@@ -29,7 +28,6 @@ export interface CanvasProps extends Omit<ViewProps, "onLayout"> {
      */
     opaque?: boolean;
     onSize?: SharedValue<SkSize>;
-    colorSpace?: "p3" | "srgb";
     /**
      * Renders into a surface with more than 8 bits per channel (16-bit float on
      * iOS, 10-bit on Android) to avoid banding in subtle gradients. Colors are
@@ -42,16 +40,21 @@ export interface CanvasProps extends Omit<ViewProps, "onLayout"> {
     /** Android-only rendering options. Ignored on iOS and web. */
     android?: AndroidCanvasProps;
     ref?: React.Ref<CanvasRef>;
-    androidWarmup?: boolean;
     __destroyWebGLContextAfterRender?: boolean;
 }
 /**
- * What every canvas shares, whichever native view it renders into: the native
- * id, the scene graph root rendered into it, the `onSize` measurement and the
- * imperative handle of the ref.
+ * The declarative canvas. Its children are rendered by Skia's own React
+ * renderer; the frames are produced off the JS thread:
+ *
+ * - the JS thread records the scene graph into a native recorder once per
+ *   React commit and hands it to the view;
+ * - the Reanimated UI runtime only reads the shared values into it (the one
+ *   step that needs a JS runtime), it never replays anything;
+ * - a dedicated native thread pool replays the recorder into a Graphite
+ *   recording whenever the content changed, at most once per presented frame;
+ * - the view presents the recording on the next vsync.
+ *
+ * On the web the scene is drawn into a picture on the JS thread and painted
+ * on a WebGL canvas.
  */
-export declare const useCanvasRoot: ({ children, onSize, ref, onLayout, }: Pick<CanvasProps, "children" | "onSize" | "ref" | "onLayout">) => {
-    nativeId: number;
-    viewRef: RefObject<View | null>;
-};
-export declare const Canvas: ({ debug, opaque, children, onSize, colorSpace, highBitDepth, androidWarmup, android, ref, onLayout, ...viewProps }: CanvasProps) => React.JSX.Element;
+export declare const Canvas: ({ opaque, children, onSize, highBitDepth, android, ref, onLayout, ...viewProps }: CanvasProps) => React.JSX.Element;

package/lib/typescript/src/skia/types/Graphite.d.ts

@@ -1,12 +1,12 @@
 import type { SkCanvas } from "./Canvas";
 import type { SkJSIInstance } from "./JsiInstance";
 /**
- * A frame recorded for a SkiaGraphiteView. Immutable once finished: submit it
- * to the view as many times as needed, from any runtime.
+ * A frame recorded for a view. Immutable once finished: submit it to the view
+ * as many times as needed, from any runtime.
  */
 export type SkGraphiteRecording = SkJSIInstance<"GraphiteRecording">;
 /**
- * The recording side of a SkiaGraphiteView, obtained from the view's ref.
+ * The recording side of a view, obtained from the ref of a SkiaGraphiteView.
  *
  * Frames are recorded on the calling thread and presented by the view on its
  * display link, so the context can be captured into a worklet and used from

package/lib/typescript/src/skia/types/Image/ImageFactory.d.ts

@@ -89,7 +89,7 @@ export interface ImageFactory {
      * while the image is in use: destroy() releases the underlying GPU
      * resource regardless of reference counts.
      *
-     * Note: This method is only available when the Graphite backend is enabled.
+     * Native only.
      *
      * @param pointer - The WGPUTexture pointer (texture.nativePointer)
      * @returns An SkImage wrapping the texture, or throws if the texture is invalid
@@ -101,7 +101,7 @@ export interface ImageFactory {
      * returned pointer carries one reference and must be adopted exactly once
      * with react-native-webgpu's adoptTexture(), which owns it from then on.
      *
-     * Note: This method is only available when the Graphite backend is enabled.
+     * Native only.
      *
      * @param image - An SkImage to convert to a texture
      * @returns A WGPUTexture pointer for adoptTexture(), or throws on failure

package/lib/typescript/src/skia/types/Skia.d.ts

@@ -83,8 +83,7 @@ export interface Skia {
     /**
      * Raw WGPUDevice pointer of Skia's Graphite device, as a BigInt. Pass it to
      * react-native-webgpu's importDevice() to get a GPUDevice sharing Skia's
-     * device (zero-copy interop). Only available on Graphite builds; throws
-     * otherwise.
+     * device (zero-copy interop). Native only.
      */
     getNativeDevice(): bigint;
 }

package/lib/typescript/src/skia/types/Surface/SurfaceFactory.d.ts

@@ -33,7 +33,7 @@ export interface SurfaceFactory {
      * surface exists. Calling destroy() on the GPUTexture still invalidates
      * the surface.
      *
-     * Note: This method is only available when the Graphite backend is enabled.
+     * Native only.
      *
      * @param pointer - The WGPUTexture pointer (texture.nativePointer)
      * @returns An SkSurface rendering into the texture, or throws if the texture is invalid

package/lib/typescript/src/specs/NativeSkiaModule.web.d.ts

@@ -1,7 +1,11 @@
 import type { SkGraphiteContext, SkImage, SkPicture, SkRect } from "../skia/types";
 import type { ISkiaViewApi } from "../views/types";
-/** What every web view registers under its native id. */
+/** What the web view registers under its native id. */
 export interface SkiaWebViewHandle {
+    /** Shows a picture: the frame of a <Canvas> or a <SkiaPictureView>. */
+    setPicture(picture: SkPicture): void;
+    /** The recording side of the view, see SkiaGraphiteView. */
+    getContext(): SkGraphiteContext;
     getSize(): {
         width: number;
         height: number;
@@ -11,9 +15,6 @@ export interface SkiaWebViewHandle {
     measure(callback: (x: number, y: number, width: number, height: number, pageX: number, pageY: number) => void): void;
     measureInWindow(callback: (x: number, y: number, width: number, height: number) => void): void;
 }
-export interface SkiaGraphiteViewHandle extends SkiaWebViewHandle {
-    getContext(): SkGraphiteContext;
-}
 export type ISkiaViewApiWeb = ISkiaViewApi & {
     views: Record<string, SkiaWebViewHandle>;
     deferedPictures: Record<string, SkPicture>;

package/lib/{module/specs/SkiaPictureViewNativeComponent.d.ts → typescript/src/specs/SkiaViewNativeComponent.d.ts}

@@ -1,11 +1,8 @@
 import { type ViewProps } from "react-native";
 import type { WithDefault } from "react-native/Libraries/Types/CodegenTypes";
 export interface NativeProps extends ViewProps {
-    debug?: boolean;
     opaque?: boolean;
-    colorSpace?: string;
     highBitDepth?: boolean;
-    androidWarmup?: boolean;
     androidSurfaceType?: WithDefault<"auto" | "SurfaceView" | "TextureView", "auto">;
     androidZOrderOnTop?: WithDefault<boolean, false>;
     pointerEvents?: WithDefault<"auto" | "none" | "box-none" | "box-only", "auto">;

package/lib/typescript/src/specs/SkiaViewNativeComponent.web.d.ts

@@ -0,0 +1,10 @@
+import type { ViewProps } from "react-native";
+export interface NativeProps extends ViewProps {
+    opaque?: boolean;
+    highBitDepth?: boolean;
+    nativeID: string;
+    androidSurfaceType?: "auto" | "SurfaceView" | "TextureView";
+    androidZOrderOnTop?: boolean;
+}
+declare const SkiaViewNativeComponent: ({ nativeID, onLayout, opaque: _opaque, highBitDepth: _highBitDepth, androidSurfaceType: _androidSurfaceType, androidZOrderOnTop: _androidZOrderOnTop, ...viewProps }: NativeProps) => import("react").FunctionComponentElement<import("../views/SkiaView.web").SkiaViewProps>;
+export default SkiaViewNativeComponent;

package/lib/typescript/src/views/SkiaGraphiteView.d.ts

@@ -13,8 +13,7 @@ export interface SkiaGraphiteViewProps extends SkiaGraphiteViewNativeProps {
     ref?: React.Ref<SkiaGraphiteViewRef>;
 }
 /**
- * A view presenting frames recorded with Skia Graphite. Requires the Graphite
- * backend (install-skia-graphite); with the default backend it renders
- * nothing. See {@link SkGraphiteContext}.
+ * A view whose frames are recorded from JavaScript, on any runtime, through
+ * the context of its ref. See {@link SkGraphiteContext}.
  */
-export declare const SkiaGraphiteView: ({ debug, opaque, highBitDepth, ref, ...viewProps }: SkiaGraphiteViewProps) => React.JSX.Element;
+export declare const SkiaGraphiteView: ({ opaque, highBitDepth, android, ref, ...viewProps }: SkiaGraphiteViewProps) => React.JSX.Element;

package/lib/typescript/src/views/SkiaPictureView.d.ts

@@ -3,8 +3,11 @@ import type { SkRect } from "../skia/types";
 import type { SkiaPictureViewNativeProps } from "./types";
 interface SkiaPictureViewProps extends SkiaPictureViewNativeProps {
     mode?: "default" | "continuous";
-    androidWarmup?: boolean;
 }
+/**
+ * A view showing a picture. The picture is handed to the native view, which
+ * records it once (and again on every redraw) for its surface.
+ */
 export declare class SkiaPictureView extends React.Component<SkiaPictureViewProps> {
     private requestId;
     constructor(props: SkiaPictureViewProps);

package/lib/typescript/src/views/SkiaView.web.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import type { ViewProps } from "react-native";
+import type { SkiaWebViewHandle } from "../specs/NativeSkiaModule.web";
+export interface SkiaViewHandle extends SkiaWebViewHandle {
+    /** The canvas element, for Reanimated's measure(). */
+    readonly canvasRef: () => HTMLCanvasElement | null;
+}
+export interface SkiaViewProps extends ViewProps {
+    ref?: React.Ref<SkiaViewHandle>;
+    __destroyWebGLContextAfterRender?: boolean;
+}
+export declare const SkiaView: (props: SkiaViewProps) => React.JSX.Element;

package/lib/typescript/src/views/android.d.ts

@@ -0,0 +1,6 @@
+import type { AndroidCanvasProps, AndroidSurfaceType } from "./types";
+/** The native props the `android` prop of a view resolves to. */
+export declare const androidNativeProps: (android?: AndroidCanvasProps) => {
+    androidSurfaceType: AndroidSurfaceType | "auto";
+    androidZOrderOnTop: boolean;
+};

package/lib/typescript/src/views/types.d.ts

@@ -1,10 +1,6 @@
 import type { ViewProps } from "react-native";
 import type { SharedValue } from "react-native-reanimated";
 import type { SkGraphiteContext, SkImage, SkPicture, SkRect, SkSize } from "../skia/types";
-export type NativeSkiaViewProps = ViewProps & {
-    debug?: boolean;
-    opaque?: boolean;
-};
 export type AndroidSurfaceType = "SurfaceView" | "TextureView";
 export interface AndroidCanvasProps {
     /**
@@ -35,17 +31,13 @@ export interface ISkiaViewApi {
     makeImageSnapshotAsync: (nativeId: number, rect?: SkRect) => Promise<SkImage>;
     size: (nativeId: number) => SkSize;
     /**
-     * The recording side of a SkiaGraphiteView: its native id, the layout size
-     * in points, and the props its surface format follows from. Graphite only.
+     * The recording side of a view: its native id, the layout size in points,
+     * and the props its surface format follows from.
      */
     makeGraphiteContext: (nativeId: number, width: number, height: number, opaque: boolean, highBitDepth: boolean) => SkGraphiteContext;
 }
+/** The props every Skia view takes, whichever way it is drawn. */
 export interface SkiaBaseViewProps extends ViewProps {
-    /**
-     * When set to true the view will display information about the
-     * average time it takes to render.
-     */
-    debug?: boolean;
     /**
      * Declares that the canvas covers every pixel of its bounds. On Android an
      * opaque canvas is backed by a `SurfaceView` by default, the cheapest path
@@ -64,6 +56,5 @@ export interface SkiaBaseViewProps extends ViewProps {
 }
 export interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {
     picture?: SkPicture;
-    androidWarmup?: boolean;
 }
 export type SkiaGraphiteViewNativeProps = SkiaBaseViewProps;

package/package.json

@@ -8,7 +8,7 @@
     "setup-skia-web": "scripts/setup-canvaskit.js"
   },
   "title": "React Native Skia",
-  "version": "3.0.0",
+  "version": "3.0.2",
   "description": "High-performance React Native Graphics using Skia",
   "main": "lib/module/index.js",
   "react-native": "src/index.ts",
@@ -35,8 +35,7 @@
     "Package.swift",
     "include/**",
     "react-native.config.js",
-    "dist/**",
-    "libs/.graphite"
+    "dist/**"
   ],
   "scripts": {
     "lint": "eslint . --ext .ts,.tsx  --max-warnings 0 --cache --fix",
@@ -48,8 +47,6 @@
     "clean-skia": "yarn rimraf ./libs && yarn rimraf ../../externals/skia/out",
     "build-skia": "tsx ./scripts/build-skia.ts",
     "copy-skia-headers": "tsx ./scripts/copy-skia-headers.ts",
-    "install-skia": "tsx ./scripts/install-skia.ts",
-    "install-skia-graphite": "tsx ./scripts/install-skia-graphite.ts",
     "clang-format": "yarn clang-format-ios && yarn clang-format-android && yarn clang-format-common",
     "clang-format-ios": "find apple/ -iname '*.h' -o -iname '*.mm' -o -iname '*.cpp' | xargs clang-format -i",
     "clang-format-android": "find android/cpp/ -iname '*.h' -o -iname '*.m' -o -iname '*.cpp' | xargs clang-format -i",
@@ -130,6 +127,7 @@
     "react-native": "0.83.1",
     "react-native-builder-bob": "0.18.2",
     "react-native-reanimated": "4.3.1",
+    "react-native-skia-graphite-headers": "154.0.1",
     "react-native-worklets": "0.8.3",
     "rimraf": "3.0.2",
     "semantic-release": "^24.1.0",
@@ -142,16 +140,11 @@
   },
   "dependencies": {
     "canvaskit-wasm": "0.41.0",
-    "react-native-skia-graphite-android": "154.0.0",
-    "react-native-skia-graphite-apple-ios": "154.0.0",
-    "react-native-skia-graphite-apple-macos": "154.0.0",
+    "react-native-skia-graphite-android": "154.0.1",
+    "react-native-skia-graphite-apple-ios": "154.0.1",
+    "react-native-skia-graphite-apple-macos": "154.0.1",
     "react-reconciler": "0.31.0"
   },
-  "graphiteDependencies": {
-    "react-native-skia-graphite-android": "154.0.0",
-    "react-native-skia-graphite-apple-ios": "154.0.0",
-    "react-native-skia-graphite-apple-macos": "154.0.0"
-  },
   "eslintIgnore": [
     "node_modules/",
     "lib/"
@@ -165,8 +158,7 @@
     },
     "ios": {
       "componentProvider": {
-        "SkiaPictureView": "SkiaPictureView",
-        "SkiaGraphiteView": "SkiaGraphiteView"
+        "SkiaView": "SkiaView"
       }
     }
   },
@@ -189,4 +181,4 @@
       ]
     ]
   }
-}
+}

package/react-native-skia.podspec

@@ -1,14 +1,10 @@
-# @shopify/react-native-skia.podspec
+# react-native-skia.podspec
 
 require "json"
 require "fileutils"
 
 package = JSON.parse(File.read(File.join(__dir__, "package.json")))
 
-# Check if Graphite is enabled via marker file (created by install-skia-graphite)
-use_graphite = File.exist?(File.join(__dir__, 'libs', '.graphite'))
-puts "-- SK_GRAPHITE: #{use_graphite ? 'ON' : 'OFF'} (detected via libs/.graphite marker file)"
-
 # Resolve a node package directory using Node's own module resolution
 # (mirrors `require.resolve(pkg/package.json)`). Returns nil if it can't be found.
 # Defined as a lambda (not a `def`) because CocoaPods evaluates the podspec inside
@@ -37,10 +33,25 @@ install_apple_skia_libs = lambda do |base_dir, packages|
     src = File.join(pkg_dir, 'libs')
     next unless Dir.exist?(src) && !Dir.glob(File.join(src, '*.xcframework')).empty?
 
+    # Graphite packages carry the Dawn release tag they ship (libs/.dawn-version),
+    # used below for the react-native-webgpu version check.
+    dawn_version = File.join(src, '.dawn-version')
+    if File.exist?(dawn_version)
+      FileUtils.mkdir_p(File.join(base_dir, 'libs'))
+      FileUtils.cp(dawn_version, File.join(base_dir, 'libs', '.dawn-version'))
+    end
+
     version = JSON.parse(File.read(File.join(pkg_dir, 'package.json')))['version'].to_s
     dest = File.join(base_dir, 'libs', platform)
     marker = File.join(dest, '.version')
 
+    # Frameworks without a .version stamp were built locally (`yarn build-skia`):
+    # keep them instead of overwriting them with the npm package.
+    if !File.exist?(marker) && !Dir.glob(File.join(dest, '*.xcframework')).empty?
+      Pod::UI.puts "react-native-skia: using locally built #{platform} Skia frameworks"
+      next
+    end
+
     # Already up to date: leave the files untouched so CocoaPods keeps its cache.
     next if File.exist?(marker) && File.read(marker).strip == version
 
@@ -52,23 +63,15 @@ install_apple_skia_libs = lambda do |base_dir, packages|
   end
 end
 
-# The default (Ganesh) build ships its binaries in the react-native-skia-apple-*
-# npm packages, the Graphite build in react-native-skia-graphite-apple-* (no tvOS).
-# During in-repo development install-skia-graphite downloads the binaries directly
-# into libs/ and the graphite packages are absent from node_modules, in which case
-# the copy below is a no-op and the downloaded binaries are used as-is.
-apple_skia_packages = use_graphite ?
-  { 'ios' => 'react-native-skia-graphite-apple-ios',
-    'macos' => 'react-native-skia-graphite-apple-macos' } :
-  { 'ios' => 'react-native-skia-apple-ios',
-    'macos' => 'react-native-skia-apple-macos',
-    'tvos' => 'react-native-skia-apple-tvos' }
+# The Graphite binaries ship in the react-native-skia-graphite-apple-* npm
+# packages (no tvOS), together with the shared Dawn (libwebgpu_dawn.xcframework).
+apple_skia_packages = {
+  'ios' => 'react-native-skia-graphite-apple-ios',
+  'macos' => 'react-native-skia-graphite-apple-macos'
+}
 install_apple_skia_libs.call(__dir__, apple_skia_packages)
 
-# Set preprocessor definitions based on GRAPHITE flag
-preprocessor_defs = use_graphite ?
-  '$(inherited) SK_GRAPHITE=1 SK_IMAGE_READ_PIXELS_DISABLE_LEGACY_API=1 SK_DISABLE_LEGACY_SHAPER_FACTORY=1' :
-  '$(inherited) SK_METAL=1 SK_GANESH=1 SK_IMAGE_READ_PIXELS_DISABLE_LEGACY_API=1 SK_DISABLE_LEGACY_SHAPER_FACTORY=1'
+preprocessor_defs = '$(inherited) SK_GRAPHITE=1 SK_IMAGE_READ_PIXELS_DISABLE_LEGACY_API=1 SK_DISABLE_LEGACY_SHAPER_FACTORY=1'
 
 # Define framework names
 framework_names = ['libskia', 'libsvg', 'libskshaper', 'libskparagraph',
@@ -81,14 +84,18 @@ framework_names = ['libskia', 'libsvg', 'libskshaper', 'libskparagraph',
 # vendoring the framework here as well would fail CocoaPods'
 # duplicate-framework-name check, so Skia only vendors it when alone. The
 # skia pod's dawn::native references resolve from webgpu's copy at app link.
+# An app that installs react-native-webgpu but keeps it out of a platform's
+# Pods (e.g. a macOS target that filters it out of autolinking) sets
+# RNSKIA_VENDOR_DAWN=1 before `pod install` so Skia vendors Dawn itself there.
 webgpu_pkg_dir = resolve_node_package.call('react-native-webgpu', __dir__)
-has_webgpu_pkg = !webgpu_pkg_dir.nil?
-if use_graphite && has_webgpu_pkg
+has_webgpu_pkg = !webgpu_pkg_dir.nil? && ENV['RNSKIA_VENDOR_DAWN'] != '1'
+if has_webgpu_pkg
   Pod::UI.puts 'react-native-skia: react-native-webgpu detected, Dawn is provided by its libwebgpu_dawn'
 
   # Both packages must link the exact same Dawn artifact. Compare the release
-  # tag this Graphite build was installed with (libs/.dawn-version) against
-  # the tag react-native-webgpu declares in its package.json `dawn` field.
+  # tag the Skia binaries were packaged with (libs/.dawn-version, copied in from
+  # the binary package above) against the tag react-native-webgpu declares in
+  # its package.json `dawn` field.
   dawn_marker = File.join(__dir__, 'libs', '.dawn-version')
   if File.exist?(dawn_marker)
     skia_dawn = File.read(dawn_marker).strip
@@ -110,10 +117,22 @@ if use_graphite && has_webgpu_pkg
     Pod::UI.puts "react-native-skia: Dawn versions match (#{skia_dawn})"
   end
 end
-framework_names += ['libwebgpu_dawn'] if use_graphite && !has_webgpu_pkg
+unless has_webgpu_pkg
+  # CocoaPods silently skips missing vendored frameworks, which would surface
+  # later as undefined dawn::native symbols at link time. Fail early instead.
+  %w[ios macos].each do |platform|
+    platform_dir = File.join(__dir__, 'libs', platform)
+    # A missing libs/<platform> is reported by the prebuilt binaries check below.
+    next if !Dir.exist?(platform_dir) || Dir.exist?(File.join(platform_dir, 'libwebgpu_dawn.xcframework'))
+    raise "react-native-skia: libwebgpu_dawn.xcframework not found in libs/#{platform}. " \
+          "The installed #{apple_skia_packages[platform]} package does not ship the shared " \
+          "Dawn library this Graphite build links against. Upgrade it, then run `pod install` again."
+  end
+  framework_names += ['libwebgpu_dawn']
+end
 
 # Verify that the prebuilt binaries are available (copied in above from the npm
-# packages, or downloaded by install-skia-graphite for in-repo Graphite builds).
+# packages, or built locally with `yarn build-skia`).
 unless Dir.exist?(File.join(__dir__, 'libs', 'ios')) && Dir.exist?(File.join(__dir__, 'libs', 'macos'))
   expected_packages = apple_skia_packages.values.join(', ')
   Pod::UI.warn "#{'-' * 72}"
@@ -126,33 +145,26 @@ unless Dir.exist?(File.join(__dir__, 'libs', 'ios')) && Dir.exist?(File.join(__d
 end
 
 # Build platform-specific framework paths (relative to pod's libs directory)
-# xcframeworks are copied into libs/ by install_apple_skia_libs above (default build)
-# or downloaded by install-skia-graphite (Graphite build).
+# xcframeworks are copied into libs/ by install_apple_skia_libs above.
 ios_frameworks = framework_names.map { |f| "libs/ios/#{f}.xcframework" }
 osx_frameworks = framework_names.map { |f| "libs/macos/#{f}.xcframework" }
-# tvOS frameworks - check if libs/tvos/ exists (only populated for the default build)
-tvos_frameworks = if use_graphite || !Dir.exist?(File.join(__dir__, 'libs', 'tvos'))
-  []
-else
-  framework_names.map { |f| "libs/tvos/#{f}.xcframework" }
-end
 
 Pod::Spec.new do |s|
   s.name         = "react-native-skia"
   s.version      = package["version"]
   s.summary      = package["description"]
   s.description  = <<-DESC
-                  @shopify/react-native-skia
+                  react-native-skia
                    DESC
-  s.homepage     = "https://github.com/shopify/react-native-skia"
+  s.homepage     = "https://github.com/wcandillon/react-native-skia"
   s.license      = "MIT"
   s.license    = { :type => "MIT", :file => "LICENSE.md" }
   s.authors      = {
     "Christian Falch" => "christian.falch@gmail.com",
     "William Candillon" => "wcandillon@gmail.com"
   }
-  s.platforms    = { :ios => "14.0", :tvos => "13.0", :osx => "11" }
-  s.source       = { :git => "https://github.com/shopify/react-native-skia/react-native-skia.git", :tag => "#{s.version}" }
+  s.platforms    = { :ios => "14.0", :osx => "11" }
+  s.source       = { :git => "https://github.com/wcandillon/react-native-skia.git", :tag => "#{s.version}" }
 
   s.requires_arc = true
   s.pod_target_xcconfig = {
@@ -168,11 +180,6 @@ Pod::Spec.new do |s|
   s.ios.vendored_frameworks = ios_frameworks
   s.osx.vendored_frameworks = osx_frameworks
 
-  # tvOS frameworks only available for non-Graphite builds
-  unless use_graphite
-    s.tvos.vendored_frameworks = tvos_frameworks
-  end
-
   # Preserve the copied libs directory
   s.preserve_paths = ["libs/**/*"]
 
@@ -182,20 +189,6 @@ Pod::Spec.new do |s|
     "cpp/**/*.{h,cpp}"
   ]
 
-  graphite_exclusions = [
-    'cpp/rnskia/RNDawnContext.h',
-    'cpp/rnskia/RNDawnUtils.h',
-    'cpp/rnskia/RNMetalLayerColorSpace.h',
-    'cpp/rnskia/RNDawnWindowContext.h',
-    'cpp/rnskia/RNDawnWindowContext.cpp',
-    'cpp/rnskia/RNDawnInterop.cpp',
-    'cpp/rnskia/RNImageProvider.h',
-    'cpp/rnskia/RNSkGraphiteView.h',
-    'cpp/api/JsiSkGraphiteContext.h',
-    'cpp/api/JsiSkGraphiteRecording.h'
-  ]
-  s.exclude_files = graphite_exclusions unless use_graphite
-
   install_modules_dependencies(s)
   s.dependency "React"
   s.dependency "React-callinvoker"

package/src/Platform/Platform.web.tsx

@@ -7,7 +7,7 @@ import { isRNModule, unwrapModule } from "../skia/types";
 
 import type { IPlatform } from "./IPlatform";
 
-// Layout is observed by the views themselves (see SkiaPictureView.web.tsx):
+// Layout is observed by the views themselves (see SkiaView.web.tsx):
 // this shim only reproduces react-native-web's default View styling.
 const View = (({ children, style: rawStyle }: ViewProps) => {
   const style = useMemo(() => (rawStyle ?? {}) as CSSProperties, [rawStyle]);

package/src/index.ts

@@ -1,10 +1,8 @@
 import "./skia/NativeSetup";
 export { JsiSkImage } from "./skia/web/JsiSkImage";
 export * from "./renderer";
-export { useCanvasRef, useCanvasSize } from "./renderer/Canvas";
+export { Canvas, useCanvasRef, useCanvasSize } from "./renderer/Canvas";
 export type { CanvasProps, CanvasRef } from "./renderer/Canvas";
-export { GraphiteCanvas } from "./renderer/GraphiteCanvas";
-export { Canvas } from "./renderer/DefaultCanvas";
 export * from "./renderer/Offscreen";
 export * from "./views";
 export * from "./skia";

package/src/mock/index.ts

@@ -23,7 +23,6 @@ export const Mock = (CanvasKit: CanvasKit) => {
     ...require("../dom/types"),
     ...require("../dom/nodes"),
     Canvas: require("react-native").View,
-    GraphiteCanvas: require("react-native").View,
     getPreferredHighBitDepthCanvasFormat: () => "rgba16float",
     SkiaPictureView: require("react-native").View,
     SkiaGraphiteView: require("react-native").View,