@shopify/react-native-skia 1.2.1 → 1.2.3

package/lib/module/skia/web/JsiSkNativeBufferFactory.js

@@ -15,7 +15,7 @@ export class JsiSkNativeBufferFactory extends Host {
     ctx.putImageData(imageData, 0, 0);
     return canvas;
   }
-  Release(_platformBuffer) {
+  Release(_nativeBuffer) {
     // it's a noop on Web
   }
 }

package/lib/module/skia/web/JsiSkNativeBufferFactory.js.map

@@ -1 +1 @@
-{"version":3,"names":["Host","JsiSkNativeBufferFactory","constructor","CanvasKit","MakeFromImage","image","info","getImageInfo","uint8ClampedArray","Uint8ClampedArray","readPixels","imageData","ImageData","width","height","canvas","OffscreenCanvas","ctx","getContext","Error","putImageData","Release","_platformBuffer"],"sources":["JsiSkNativeBufferFactory.ts"],"sourcesContent":["import type { CanvasKit } from \"canvaskit-wasm\";\n\nimport {\n  type NativeBuffer,\n  type NativeBufferFactory,\n  type SkImage,\n} from \"../types\";\n\nimport { Host } from \"./Host\";\n\nexport class JsiSkNativeBufferFactory\n  extends Host\n  implements NativeBufferFactory\n{\n  constructor(CanvasKit: CanvasKit) {\n    super(CanvasKit);\n  }\n\n  MakeFromImage(image: SkImage): NativeBuffer {\n    const info = image.getImageInfo();\n    const uint8ClampedArray = new Uint8ClampedArray(image.readPixels()!);\n    const imageData = new ImageData(uint8ClampedArray, info.width, info.height);\n    const canvas = new OffscreenCanvas(info.width, info.height);\n    const ctx = canvas.getContext(\"2d\");\n    if (!ctx) {\n      throw new Error(\"Failed to get 2d context from canvas\");\n    }\n    ctx.putImageData(imageData, 0, 0);\n    return canvas;\n  }\n\n  Release(_platformBuffer: NativeBuffer) {\n    // it's a noop on Web\n  }\n}\n"],"mappings":"AAQA,SAASA,IAAI,QAAQ,QAAQ;AAE7B,OAAO,MAAMC,wBAAwB,SAC3BD,IAAI,CAEd;EACEE,WAAWA,CAACC,SAAoB,EAAE;IAChC,KAAK,CAACA,SAAS,CAAC;EAClB;EAEAC,aAAaA,CAACC,KAAc,EAAgB;IAC1C,MAAMC,IAAI,GAAGD,KAAK,CAACE,YAAY,CAAC,CAAC;IACjC,MAAMC,iBAAiB,GAAG,IAAIC,iBAAiB,CAACJ,KAAK,CAACK,UAAU,CAAC,CAAE,CAAC;IACpE,MAAMC,SAAS,GAAG,IAAIC,SAAS,CAACJ,iBAAiB,EAAEF,IAAI,CAACO,KAAK,EAAEP,IAAI,CAACQ,MAAM,CAAC;IAC3E,MAAMC,MAAM,GAAG,IAAIC,eAAe,CAACV,IAAI,CAACO,KAAK,EAAEP,IAAI,CAACQ,MAAM,CAAC;IAC3D,MAAMG,GAAG,GAAGF,MAAM,CAACG,UAAU,CAAC,IAAI,CAAC;IACnC,IAAI,CAACD,GAAG,EAAE;MACR,MAAM,IAAIE,KAAK,CAAC,sCAAsC,CAAC;IACzD;IACAF,GAAG,CAACG,YAAY,CAACT,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC;IACjC,OAAOI,MAAM;EACf;EAEAM,OAAOA,CAACC,eAA6B,EAAE;IACrC;EAAA;AAEJ"}
+{"version":3,"names":["Host","JsiSkNativeBufferFactory","constructor","CanvasKit","MakeFromImage","image","info","getImageInfo","uint8ClampedArray","Uint8ClampedArray","readPixels","imageData","ImageData","width","height","canvas","OffscreenCanvas","ctx","getContext","Error","putImageData","Release","_nativeBuffer"],"sources":["JsiSkNativeBufferFactory.ts"],"sourcesContent":["import type { CanvasKit } from \"canvaskit-wasm\";\n\nimport {\n  type NativeBuffer,\n  type NativeBufferFactory,\n  type SkImage,\n} from \"../types\";\n\nimport { Host } from \"./Host\";\n\nexport class JsiSkNativeBufferFactory\n  extends Host\n  implements NativeBufferFactory\n{\n  constructor(CanvasKit: CanvasKit) {\n    super(CanvasKit);\n  }\n\n  MakeFromImage(image: SkImage): NativeBuffer {\n    const info = image.getImageInfo();\n    const uint8ClampedArray = new Uint8ClampedArray(image.readPixels()!);\n    const imageData = new ImageData(uint8ClampedArray, info.width, info.height);\n    const canvas = new OffscreenCanvas(info.width, info.height);\n    const ctx = canvas.getContext(\"2d\");\n    if (!ctx) {\n      throw new Error(\"Failed to get 2d context from canvas\");\n    }\n    ctx.putImageData(imageData, 0, 0);\n    return canvas;\n  }\n\n  Release(_nativeBuffer: NativeBuffer) {\n    // it's a noop on Web\n  }\n}\n"],"mappings":"AAQA,SAASA,IAAI,QAAQ,QAAQ;AAE7B,OAAO,MAAMC,wBAAwB,SAC3BD,IAAI,CAEd;EACEE,WAAWA,CAACC,SAAoB,EAAE;IAChC,KAAK,CAACA,SAAS,CAAC;EAClB;EAEAC,aAAaA,CAACC,KAAc,EAAgB;IAC1C,MAAMC,IAAI,GAAGD,KAAK,CAACE,YAAY,CAAC,CAAC;IACjC,MAAMC,iBAAiB,GAAG,IAAIC,iBAAiB,CAACJ,KAAK,CAACK,UAAU,CAAC,CAAE,CAAC;IACpE,MAAMC,SAAS,GAAG,IAAIC,SAAS,CAACJ,iBAAiB,EAAEF,IAAI,CAACO,KAAK,EAAEP,IAAI,CAACQ,MAAM,CAAC;IAC3E,MAAMC,MAAM,GAAG,IAAIC,eAAe,CAACV,IAAI,CAACO,KAAK,EAAEP,IAAI,CAACQ,MAAM,CAAC;IAC3D,MAAMG,GAAG,GAAGF,MAAM,CAACG,UAAU,CAAC,IAAI,CAAC;IACnC,IAAI,CAACD,GAAG,EAAE;MACR,MAAM,IAAIE,KAAK,CAAC,sCAAsC,CAAC;IACzD;IACAF,GAAG,CAACG,YAAY,CAACT,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC;IACjC,OAAOI,MAAM;EACf;EAEAM,OAAOA,CAACC,aAA2B,EAAE;IACnC;EAAA;AAEJ"}

package/lib/module/specs/NativeSkiaModule.web.d.ts

@@ -1,2 +0,0 @@
-import { throwOnMissingReanimated } from "../external/reanimated/moduleWrapper";
-export default throwOnMissingReanimated;

package/lib/module/specs/NativeSkiaModule.web.js

@@ -1,5 +1,2 @@
-import { throwOnMissingReanimated } from "../external/reanimated/moduleWrapper";
 
-// eslint-disable-next-line import/no-default-export
-export default throwOnMissingReanimated;
 //# sourceMappingURL=NativeSkiaModule.web.js.map

package/lib/module/specs/NativeSkiaModule.web.js.map

@@ -1 +1 @@
-{"version":3,"names":["throwOnMissingReanimated"],"sources":["NativeSkiaModule.web.ts"],"sourcesContent":["import { throwOnMissingReanimated } from \"../external/reanimated/moduleWrapper\";\n\n// eslint-disable-next-line import/no-default-export\nexport default throwOnMissingReanimated;\n"],"mappings":"AAAA,SAASA,wBAAwB,QAAQ,sCAAsC;;AAE/E;AACA,eAAeA,wBAAwB"}
+{"version":3,"names":[],"sources":["NativeSkiaModule.web.ts"],"sourcesContent":[""],"mappings":""}

package/lib/typescript/src/external/ModuleProxy.d.ts

@@ -0,0 +1,10 @@
+type ImportType = ReturnType<typeof require>;
+/**
+ * Create a lazily-imported module proxy.
+ * This is useful for lazily requiring optional dependencies.
+ */
+export declare const createModuleProxy: <TModule>(getModule: () => ImportType) => TModule;
+export declare class OptionalDependencyNotInstalledError extends Error {
+    constructor(name: string);
+}
+export {};

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

@@ -0,0 +1,3 @@
+import type * as ReanimatedT from "react-native-reanimated";
+declare const Reanimated: typeof ReanimatedT;
+export default Reanimated;

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

@@ -46,7 +46,7 @@ export interface ImageFactory {
     MakeImageFromEncoded: (encoded: SkData) => SkImage | null;
     /**
      * Return an Image backed by a given native buffer.
-     * The platform buffer must be a valid owning reference.
+     * The native buffer must be a valid owning reference.
      *
      * For instance, this API is used by
      * [react-native-vision-camera](https://github.com/mrousavy/react-native-vision-camera)
@@ -54,9 +54,9 @@ export interface ImageFactory {
      *
      * - On Android; This is an `AHardwareBuffer*`
      * - On iOS, this is a `CVPixelBufferRef`
-     * @param nativeBuffer A strong `uintptr_t` pointer to the native platform buffer
+     * @param nativeBuffer A strong `uintptr_t` pointer to the native buffer
      * @throws Throws an error if the Image could not be created, for example when the given
-     * platform buffer is invalid.
+     * native buffer is invalid.
      */
     MakeImageFromNativeBuffer: (nativeBuffer: NativeBuffer) => SkImage;
     /**

package/lib/typescript/src/skia/types/NativeBuffer/NativeBufferFactory.d.ts

@@ -8,11 +8,11 @@ export declare const isNativeBufferWeb: (buffer: NativeBuffer) => buffer is Canv
 export declare const isNativeBufferNode: (buffer: NativeBuffer) => buffer is ArrayBuffer;
 export interface NativeBufferFactory {
     /**
-     * Copy pixels to a platform buffer. (for testing purposes)
+     * Copy pixels to a native buffer.
      */
     MakeFromImage: (image: SkImage) => NativeBuffer;
     /**
-     * Release a platform buffer that was created with `MakeFromImage`.
+     * Release a native buffer that was created with `MakeFromImage`.
      */
-    Release: (platformBuffer: NativeBuffer) => void;
+    Release: (nativeBuffer: NativeBuffer) => void;
 }

package/lib/typescript/src/skia/web/JsiSkNativeBufferFactory.d.ts

@@ -4,5 +4,5 @@ import { Host } from "./Host";
 export declare class JsiSkNativeBufferFactory extends Host implements NativeBufferFactory {
     constructor(CanvasKit: CanvasKit);
     MakeFromImage(image: SkImage): NativeBuffer;
-    Release(_platformBuffer: NativeBuffer): void;
+    Release(_nativeBuffer: NativeBuffer): void;
 }

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

@@ -1,2 +0,0 @@
-import { throwOnMissingReanimated } from "../external/reanimated/moduleWrapper";
-export default throwOnMissingReanimated;

package/libs/ios/libskia.xcframework/Info.plist

@@ -6,32 +6,32 @@
 	<array>
 		<dict>
 			<key>LibraryIdentifier</key>
-			<string>ios-arm64_arm64e</string>
+			<string>ios-arm64_arm64e_x86_64-simulator</string>
 			<key>LibraryPath</key>
 			<string>libskia.a</string>
 			<key>SupportedArchitectures</key>
 			<array>
 				<string>arm64</string>
 				<string>arm64e</string>
+				<string>x86_64</string>
 			</array>
 			<key>SupportedPlatform</key>
 			<string>ios</string>
+			<key>SupportedPlatformVariant</key>
+			<string>simulator</string>
 		</dict>
 		<dict>
 			<key>LibraryIdentifier</key>
-			<string>ios-arm64_arm64e_x86_64-simulator</string>
+			<string>ios-arm64_arm64e</string>
 			<key>LibraryPath</key>
 			<string>libskia.a</string>
 			<key>SupportedArchitectures</key>
 			<array>
 				<string>arm64</string>
 				<string>arm64e</string>
-				<string>x86_64</string>
 			</array>
 			<key>SupportedPlatform</key>
 			<string>ios</string>
-			<key>SupportedPlatformVariant</key>
-			<string>simulator</string>
 		</dict>
 	</array>
 	<key>CFBundlePackageType</key>

package/libs/ios/libskottie.xcframework/Info.plist

@@ -6,32 +6,32 @@
 	<array>
 		<dict>
 			<key>LibraryIdentifier</key>
-			<string>ios-arm64_arm64e_x86_64-simulator</string>
+			<string>ios-arm64_arm64e</string>
 			<key>LibraryPath</key>
 			<string>libskottie.a</string>
 			<key>SupportedArchitectures</key>
 			<array>
 				<string>arm64</string>
 				<string>arm64e</string>
-				<string>x86_64</string>
 			</array>
 			<key>SupportedPlatform</key>
 			<string>ios</string>
-			<key>SupportedPlatformVariant</key>
-			<string>simulator</string>
 		</dict>
 		<dict>
 			<key>LibraryIdentifier</key>
-			<string>ios-arm64_arm64e</string>
+			<string>ios-arm64_arm64e_x86_64-simulator</string>
 			<key>LibraryPath</key>
 			<string>libskottie.a</string>
 			<key>SupportedArchitectures</key>
 			<array>
 				<string>arm64</string>
 				<string>arm64e</string>
+				<string>x86_64</string>
 			</array>
 			<key>SupportedPlatform</key>
 			<string>ios</string>
+			<key>SupportedPlatformVariant</key>
+			<string>simulator</string>
 		</dict>
 	</array>
 	<key>CFBundlePackageType</key>

package/package.json

@@ -7,7 +7,7 @@
     "setup-skia-web": "./scripts/setup-canvaskit.js"
   },
   "title": "React Native Skia",
-  "version": "1.2.1",
+  "version": "1.2.3",
   "description": "High-performance React Native Graphics using Skia",
   "main": "lib/module/index.js",
   "react-native": "src/index.ts",

package/src/external/ModuleProxy.ts

@@ -0,0 +1,30 @@
+// https://github.com/mrousavy/react-native-vision-camera/blob/main/package/src/dependencies/ModuleProxy.ts
+type ImportType = ReturnType<typeof require>;
+
+/**
+ * Create a lazily-imported module proxy.
+ * This is useful for lazily requiring optional dependencies.
+ */
+export const createModuleProxy = <TModule>(
+  getModule: () => ImportType
+): TModule => {
+  const holder: { module: TModule | undefined } = { module: undefined };
+
+  const proxy = new Proxy(holder, {
+    get: (target, property) => {
+      if (target.module == null) {
+        // lazy initialize module via require()
+        // caller needs to make sure the require() call is wrapped in a try/catch
+        target.module = getModule() as TModule;
+      }
+      return target.module[property as keyof typeof holder.module];
+    },
+  });
+  return proxy as unknown as TModule;
+};
+
+export class OptionalDependencyNotInstalledError extends Error {
+  constructor(name: string) {
+    super(`${name} is not installed!`);
+  }
+}

package/src/external/reanimated/ReanimatedProxy.ts

@@ -0,0 +1,18 @@
+import type * as ReanimatedT from "react-native-reanimated";
+
+import {
+  OptionalDependencyNotInstalledError,
+  createModuleProxy,
+} from "../ModuleProxy";
+type TReanimated = typeof ReanimatedT;
+
+const Reanimated = createModuleProxy<TReanimated>(() => {
+  try {
+    return require("react-native-reanimated");
+  } catch (e) {
+    throw new OptionalDependencyNotInstalledError("react-native-reanimated");
+  }
+});
+
+// eslint-disable-next-line import/no-default-export
+export default Reanimated;

package/src/external/reanimated/buffers.ts

@@ -4,17 +4,18 @@ import type { WorkletFunction } from "react-native-reanimated/lib/typescript/rea
 import type { SkColor, SkHostRect, SkPoint, SkRSXform } from "../../skia/types";
 import { Skia } from "../../skia";
 
-import { startMapper, stopMapper, makeMutable } from "./moduleWrapper";
 import { notifyChange } from "./interpolators";
+import Rea from "./ReanimatedProxy";
 
 type Modifier<T> = (input: T, index: number) => void;
 
-const useBufferValue = <T>(size: number, bufferInitializer: () => T) =>
-  useMemo(
-    () => makeMutable(new Array(size).fill(0).map(bufferInitializer)),
+const useBufferValue = <T>(size: number, bufferInitializer: () => T) => {
+  return useMemo(
+    () => Rea.makeMutable(new Array(size).fill(0).map(bufferInitializer)),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [size]
   );
+};
 
 const useBuffer = <T>(
   size: number,
@@ -24,7 +25,7 @@ const useBuffer = <T>(
   const values = useBufferValue(size, bufferInitializer);
   const mod = modifier as WorkletFunction;
   const deps = [size, ...Object.values(mod.__closure ?? {})];
-  const mapperId = startMapper(() => {
+  const mapperId = Rea.startMapper(() => {
     "worklet";
     values.value.forEach((val, index) => {
       modifier(val, index);
@@ -34,7 +35,7 @@ const useBuffer = <T>(
 
   useEffect(() => {
     return () => {
-      stopMapper(mapperId);
+      Rea.stopMapper(mapperId);
     };
   }, [mapperId]);
 

package/src/external/reanimated/interpolators.ts

@@ -10,12 +10,7 @@ import { interpolatePaths, interpolateVector } from "../../animation";
 import { Skia } from "../../skia";
 import { isOnMainThread } from "../../renderer/Offscreen";
 
-import {
-  useAnimatedReaction,
-  useFrameCallback,
-  useSharedValue,
-  useDerivedValue,
-} from "./moduleWrapper";
+import Rea from "./ReanimatedProxy";
 
 export const notifyChange = (value: SharedValue<unknown>) => {
   "worklet";
@@ -27,8 +22,8 @@ export const notifyChange = (value: SharedValue<unknown>) => {
 
 export const usePathValue = (cb: (path: SkPath) => void, init?: SkPath) => {
   const pathInit = useMemo(() => Skia.Path.Make(), []);
-  const path = useSharedValue(pathInit);
-  useDerivedValue(() => {
+  const path = Rea.useSharedValue(pathInit);
+  Rea.useDerivedValue(() => {
     path.value.reset();
     if (init !== undefined) {
       path.value.addPath(init);
@@ -40,7 +35,7 @@ export const usePathValue = (cb: (path: SkPath) => void, init?: SkPath) => {
 };
 
 export const useClock = () => {
-  const clock = useSharedValue(0);
+  const clock = Rea.useSharedValue(0);
   const callback = useCallback(
     (info: FrameInfo) => {
       "worklet";
@@ -48,7 +43,7 @@ export const useClock = () => {
     },
     [clock]
   );
-  useFrameCallback(callback);
+  Rea.useFrameCallback(callback);
   return clock;
 };
 
@@ -73,8 +68,8 @@ const useInterpolator = <T>(
 ) => {
   // eslint-disable-next-line react-hooks/exhaustive-deps
   const init = useMemo(() => factory(), []);
-  const result = useSharedValue(init);
-  useAnimatedReaction(
+  const result = Rea.useSharedValue(init);
+  Rea.useAnimatedReaction(
     () => value.value,
     (val) => {
       result.value = interpolator(val, input, output, options, result.value);

package/src/external/reanimated/renderHelpers.ts

@@ -4,26 +4,39 @@ import type { Container } from "../../renderer/Container";
 import type { AnimatedProps } from "../../renderer/processors";
 import type { Node } from "../../dom/types";
 
-import {
-  startMapper,
-  stopMapper,
-  isSharedValue,
-  HAS_REANIMATED3,
-  HAS_REANIMATED2,
-  runOnJS,
-} from "./moduleWrapper";
+import Rea from "./ReanimatedProxy";
+
+let HAS_REANIMATED = false;
+let HAS_REANIMATED_3 = false;
+try {
+  require("react-native-reanimated");
+  HAS_REANIMATED = true;
+  const reanimatedVersion =
+    require("react-native-reanimated/package.json").version;
+  if (
+    reanimatedVersion &&
+    (reanimatedVersion >= "3.0.0" || reanimatedVersion.includes("3.0.0-"))
+  ) {
+    HAS_REANIMATED_3 = true;
+  }
+} catch (e) {
+  HAS_REANIMATED = false;
+}
 
 const _bindings = new WeakMap<Node<unknown>, unknown>();
 
 export const unbindReanimatedNode = (node: Node<unknown>) => {
+  if (!HAS_REANIMATED) {
+    return;
+  }
   const previousMapperId = _bindings.get(node);
   if (previousMapperId !== undefined) {
-    stopMapper(previousMapperId as number);
+    Rea.stopMapper(previousMapperId as number);
   }
 };
 
 export function extractReanimatedProps(props: AnimatedProps<any>) {
-  if (!HAS_REANIMATED3 && !HAS_REANIMATED2) {
+  if (!HAS_REANIMATED) {
     return [props, {}];
   }
   const reanimatedProps = {} as AnimatedProps<any>;
@@ -33,7 +46,7 @@ export function extractReanimatedProps(props: AnimatedProps<any>) {
       continue;
     }
     const propValue = props[propName];
-    if (isSharedValue(propValue)) {
+    if (Rea.isSharedValue(propValue)) {
       reanimatedProps[propName] = propValue;
       otherProps[propName] = propValue.value;
     } else {
@@ -51,7 +64,7 @@ function bindReanimatedProps2(
   const sharedValues = Object.values(reanimatedProps);
   const previousMapperId = _bindings.get(node);
   if (previousMapperId !== undefined) {
-    stopMapper(previousMapperId as number);
+    Rea.stopMapper(previousMapperId as number);
   }
   if (sharedValues.length > 0) {
     const viewId = container.getNativeId();
@@ -70,9 +83,9 @@ function bindReanimatedProps2(
         container.redraw();
       }
     };
-    const mapperId = startMapper(() => {
+    const mapperId = Rea.startMapper(() => {
       "worklet";
-      runOnJS(updateProps)();
+      Rea.runOnJS(updateProps)();
     }, sharedValues);
     _bindings.set(node, mapperId);
   }
@@ -83,21 +96,21 @@ export function bindReanimatedProps(
   node: Node<any>,
   reanimatedProps: AnimatedProps<any>
 ) {
-  if (HAS_REANIMATED2 && !HAS_REANIMATED3) {
+  if (HAS_REANIMATED && !HAS_REANIMATED_3) {
     return bindReanimatedProps2(container, node, reanimatedProps);
   }
-  if (!HAS_REANIMATED3) {
+  if (!HAS_REANIMATED) {
     return;
   }
   const sharedValues = Object.values(reanimatedProps);
   const previousMapperId = _bindings.get(node);
   if (previousMapperId !== undefined) {
-    stopMapper(previousMapperId as number);
+    Rea.stopMapper(previousMapperId as number);
   }
   if (sharedValues.length > 0) {
     const viewId = container.getNativeId();
     const { SkiaViewApi } = global;
-    const mapperId = startMapper(() => {
+    const mapperId = Rea.startMapper(() => {
       "worklet";
       if (node) {
         for (const propName in reanimatedProps) {

package/src/external/reanimated/textures.tsx

@@ -14,7 +14,7 @@ import {
 } from "../../renderer/Offscreen";
 import { Skia, useImage } from "../../skia";
 
-import { runOnUI, useSharedValue } from "./moduleWrapper";
+import Rea from "./ReanimatedProxy";
 
 const createTexture = (
   texture: SharedValue<SkImage | null>,
@@ -57,10 +57,10 @@ export const usePictureAsTexture = (
   picture: SkPicture | null,
   size: SkSize
 ) => {
-  const texture = useSharedValue<SkImage | null>(null);
+  const texture = Rea.useSharedValue<SkImage | null>(null);
   useEffect(() => {
     if (picture !== null) {
-      runOnUI(createTexture)(texture, picture, size);
+      Rea.runOnUI(createTexture)(texture, picture, size);
     }
   }, [texture, picture, size]);
   return texture;

package/src/external/reanimated/useAnimatedImageValue.ts

@@ -4,11 +4,7 @@ import { type FrameInfo, type SharedValue } from "react-native-reanimated";
 import { useAnimatedImage } from "../../skia/core/AnimatedImage";
 import type { DataSourceParam, SkImage } from "../../skia/types";
 
-import {
-  throwOnMissingReanimated,
-  useFrameCallback,
-  useSharedValue,
-} from "./moduleWrapper";
+import Rea from "./ReanimatedProxy";
 
 const DEFAULT_FRAME_DURATION = 60;
 
@@ -16,11 +12,10 @@ export const useAnimatedImageValue = (
   source: DataSourceParam,
   paused?: SharedValue<boolean>
 ) => {
-  throwOnMissingReanimated();
-  const defaultPaused = useSharedValue(false);
+  const defaultPaused = Rea.useSharedValue(false);
   const isPaused = paused ?? defaultPaused;
-  const currentFrame = useSharedValue<null | SkImage>(null);
-  const lastTimestamp = useSharedValue(-1);
+  const currentFrame = Rea.useSharedValue<null | SkImage>(null);
+  const lastTimestamp = Rea.useSharedValue(-1);
   const animatedImage = useAnimatedImage(
     source,
     (err) => {
@@ -32,7 +27,7 @@ export const useAnimatedImageValue = (
   const frameDuration =
     animatedImage?.currentFrameDuration() || DEFAULT_FRAME_DURATION;
 
-  useFrameCallback((frameInfo: FrameInfo) => {
+  Rea.useFrameCallback((frameInfo: FrameInfo) => {
     if (!animatedImage) {
       currentFrame.value = null;
       return;

package/src/external/reanimated/useDerivedValueOnJS.ts

@@ -1,11 +1,6 @@
 import { useEffect, useMemo } from "react";
 
-import {
-  useSharedValue,
-  runOnJS,
-  startMapper,
-  stopMapper,
-} from "./moduleWrapper";
+import Rea from "./ReanimatedProxy";
 
 export const useDerivedValueOnJS = (
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -13,13 +8,13 @@ export const useDerivedValueOnJS = (
   deps: unknown[]
 ) => {
   const init = useMemo(() => fn(), [fn]);
-  const value = useSharedValue(init);
+  const value = Rea.useSharedValue(init);
   useEffect(() => {
-    const mapperId = startMapper(() => {
+    const mapperId = Rea.startMapper(() => {
       "worklet";
-      runOnJS(fn)();
+      Rea.runOnJS(fn)();
     }, deps);
-    return () => stopMapper(mapperId);
+    return () => Rea.stopMapper(mapperId);
   }, [deps, fn]);
   return value;
 };

package/src/renderer/Offscreen.tsx

@@ -32,16 +32,10 @@ export const drawAsImage = (element: ReactElement, size: SkSize) => {
   return drawAsImageFromPicture(drawAsPicture(element), size);
 };
 
-// TODO: We're not sure yet why PixelRatio is not needed here.
-const pd = 1;
 export const drawAsImageFromPicture = (picture: SkPicture, size: SkSize) => {
   "worklet";
-  const surface = Skia.Surface.MakeOffscreen(
-    size.width * pd,
-    size.height * pd
-  )!;
+  const surface = Skia.Surface.MakeOffscreen(size.width, size.height)!;
   const canvas = surface.getCanvas();
-  canvas.scale(pd, pd);
   canvas.drawPicture(picture);
   surface.flush();
   const image = surface.makeImageSnapshot();

package/src/skia/types/Image/ImageFactory.ts

@@ -54,7 +54,7 @@ export interface ImageFactory {
 
   /**
    * Return an Image backed by a given native buffer.
-   * The platform buffer must be a valid owning reference.
+   * The native buffer must be a valid owning reference.
    *
    * For instance, this API is used by
    * [react-native-vision-camera](https://github.com/mrousavy/react-native-vision-camera)
@@ -62,9 +62,9 @@ export interface ImageFactory {
    *
    * - On Android; This is an `AHardwareBuffer*`
    * - On iOS, this is a `CVPixelBufferRef`
-   * @param nativeBuffer A strong `uintptr_t` pointer to the native platform buffer
+   * @param nativeBuffer A strong `uintptr_t` pointer to the native buffer
    * @throws Throws an error if the Image could not be created, for example when the given
-   * platform buffer is invalid.
+   * native buffer is invalid.
    */
   MakeImageFromNativeBuffer: (nativeBuffer: NativeBuffer) => SkImage;
 

package/src/skia/types/NativeBuffer/NativeBufferFactory.ts

@@ -28,11 +28,11 @@ export const isNativeBufferNode = (
 
 export interface NativeBufferFactory {
   /**
-   * Copy pixels to a platform buffer. (for testing purposes)
+   * Copy pixels to a native buffer.
    */
   MakeFromImage: (image: SkImage) => NativeBuffer;
   /**
-   * Release a platform buffer that was created with `MakeFromImage`.
+   * Release a native buffer that was created with `MakeFromImage`.
    */
-  Release: (platformBuffer: NativeBuffer) => void;
+  Release: (nativeBuffer: NativeBuffer) => void;
 }

package/src/skia/web/JsiSkNativeBufferFactory.ts

@@ -29,7 +29,7 @@ export class JsiSkNativeBufferFactory
     return canvas;
   }
 
-  Release(_platformBuffer: NativeBuffer) {
+  Release(_nativeBuffer: NativeBuffer) {
     // it's a noop on Web
   }
 }

package/src/specs/NativeSkiaModule.web.ts

@@ -1,4 +0,0 @@
-import { throwOnMissingReanimated } from "../external/reanimated/moduleWrapper";
-
-// eslint-disable-next-line import/no-default-export
-export default throwOnMissingReanimated;