@shopify/react-native-skia 2.2.10 → 2.2.12

package/src/sksg/Container.web.ts

@@ -14,22 +14,8 @@ import { Container, StaticContainer } from "./StaticContainer";
 import "../skia/NativeSetup";
 import "../views/api";
 
-const drawOnscreen = (
-  Skia: Skia,
-  nativeId: number,
-  recording: Recording,
-  onSize?: SharedValue<SkSize>
-) => {
+const drawOnscreen = (Skia: Skia, nativeId: number, recording: Recording) => {
   "worklet";
-  if (onSize) {
-    const size = SkiaViewApi.size(nativeId);
-    if (
-      size.width !== onSize.value.width ||
-      size.height !== onSize.value.height
-    ) {
-      onSize.value = size;
-    }
-  }
   const rec = Skia.PictureRecorder();
   const canvas = rec.beginRecording();
   //const start = performance.now();
@@ -45,11 +31,7 @@ const drawOnscreen = (
 class ReanimatedContainer extends Container {
   private mapperId: number | null = null;
 
-  constructor(
-    Skia: Skia,
-    private nativeId: number,
-    private onSize?: SharedValue<SkSize>
-  ) {
+  constructor(Skia: Skia, private nativeId: number) {
     super(Skia);
   }
 
@@ -75,20 +57,20 @@ class ReanimatedContainer extends Container {
         drawOnscreen(Skia, nativeId, recording!);
       }, Array.from(animationValues));
     }
-    Rea.runOnUI((onSize?: SharedValue<SkSize>) => {
+    Rea.runOnUI(() => {
       "worklet";
-      drawOnscreen(Skia, nativeId, recording!, onSize);
-    })(this.onSize);
+      drawOnscreen(Skia, nativeId, recording!);
+    })();
   }
 }
 
 export const createContainer = (
   Skia: Skia,
   nativeId: number,
-  onSize?: SharedValue<SkSize>
+  _onSize?: SharedValue<SkSize>
 ) => {
   if (HAS_REANIMATED_3 && nativeId !== -1) {
-    return new ReanimatedContainer(Skia, nativeId, onSize);
+    return new ReanimatedContainer(Skia, nativeId);
   } else {
     return new StaticContainer(Skia, nativeId);
   }

package/src/sksg/StaticContainer.ts

@@ -1,6 +1,4 @@
-import type { SharedValue } from "react-native-reanimated";
-
-import type { Skia, SkCanvas, SkSize } from "../skia/types";
+import type { Skia, SkCanvas } from "../skia/types";
 
 import type { Node } from "./Node";
 import type { Recording } from "./Recorder/Recorder";
@@ -50,11 +48,7 @@ export abstract class Container {
 }
 
 export class StaticContainer extends Container {
-  constructor(
-    Skia: Skia,
-    private nativeId: number,
-    private onSize?: SharedValue<SkSize>
-  ) {
+  constructor(Skia: Skia, private nativeId: number) {
     super(Skia);
   }
 
@@ -64,15 +58,6 @@ export class StaticContainer extends Container {
     this.recording = recorder.getRecording();
     const isOnScreen = this.nativeId !== -1;
     if (isOnScreen) {
-      if (this.onSize) {
-        const size = SkiaViewApi.size(this.nativeId);
-        if (
-          size.width !== this.onSize.value.width ||
-          size.height !== this.onSize.value.height
-        ) {
-          this.onSize.value = size;
-        }
-      }
       const rec = this.Skia.PictureRecorder();
       const canvas = rec.beginRecording();
       this.drawOnCanvas(canvas);

package/src/specs/NativeSkiaModule.web.ts

@@ -12,6 +12,7 @@ export type ISkiaViewApiWeb = ISkiaViewApi & {
 global.SkiaViewApi = {
   views: {},
   deferedPictures: {},
+  deferedOnSize: {},
   web: true,
   registerView(nativeId: string, view: SkiaPictureViewHandle) {
     // Maybe a picture for this view was already set