@shopify/react-native-skia 2.2.18 → 2.2.19

package/src/skia/web/JsiSkRRect.ts

@@ -9,9 +9,9 @@ export class JsiSkRRect
   extends BaseHostObject<RRect, "RRect">
   implements SkRRect
 {
-  dispose = () => {
-    // Float32Array
-  };
+  [Symbol.dispose]() {
+    // nothing to do here, RRect is a Float32Array
+  }
 
   static fromValue(CanvasKit: CanvasKit, rect: InputRRect) {
     if (rect instanceof JsiSkRect) {

package/src/skia/web/JsiSkRSXform.ts

@@ -20,25 +20,27 @@ export class JsiSkRSXform
   constructor(CanvasKit: CanvasKit, ref: RSXform) {
     super(CanvasKit, ref, "RSXform");
   }
+
   set(scos: number, ssin: number, tx: number, ty: number) {
     this.ref[0] = scos;
     this.ref[1] = ssin;
     this.ref[2] = tx;
     this.ref[3] = ty;
   }
+
   get scos() {
     return this.ref[0];
   }
+
   get ssin() {
     return this.ref[1];
   }
+
   get tx() {
     return this.ref[2];
   }
+
   get ty() {
     return this.ref[3];
   }
-  dispose = () => {
-    // nothing to do here, RSXform is a Float32Array
-  };
 }

package/src/skia/web/JsiSkRect.ts

@@ -15,10 +15,6 @@ export class JsiSkRect
     return CanvasKit.XYWHRect(rect.x, rect.y, rect.width, rect.height);
   }
 
-  dispose = () => {
-    // Float32Array
-  };
-
   constructor(CanvasKit: CanvasKit, ref: Rect) {
     super(CanvasKit, ref, "Rect");
   }

package/src/skia/web/JsiSkRuntimeEffect.ts

@@ -11,14 +11,14 @@ export class JsiSkRuntimeEffect
   extends HostObject<RuntimeEffect, "RuntimeEffect">
   implements SkRuntimeEffect
 {
-  constructor(CanvasKit: CanvasKit, ref: RuntimeEffect, private sksl: string) {
+  constructor(
+    CanvasKit: CanvasKit,
+    ref: RuntimeEffect,
+    private sksl: string
+  ) {
     super(CanvasKit, ref, "RuntimeEffect");
   }
 
-  dispose = () => {
-    this.ref.delete();
-  };
-
   source() {
     return this.sksl;
   }

package/src/skia/web/JsiSkSVG.ts

@@ -19,9 +19,9 @@ export class JsiSkSVG
     return this.ref.height;
   }
 
-  dispose = () => {
+  [Symbol.dispose]() {
     if (this.ref.parentNode) {
       this.ref.parentNode.removeChild(this.ref);
     }
-  };
+  }
 }

package/src/skia/web/JsiSkShader.ts

@@ -11,8 +11,4 @@ export class JsiSkShader
   constructor(CanvasKit: CanvasKit, ref: Shader) {
     super(CanvasKit, ref, "Shader");
   }
-
-  dispose = () => {
-    this.ref.delete();
-  };
 }

package/src/skia/web/JsiSkSurface.ts

@@ -15,9 +15,9 @@ export class JsiSkSurface
     super(CanvasKit, ref, "Surface");
   }
 
-  dispose = () => {
+  [Symbol.dispose]() {
     this.ref.dispose();
-  };
+  }
 
   flush() {
     this.ref.flush();

package/src/skia/web/JsiSkTextBlob.ts

@@ -11,8 +11,4 @@ export class JsiSkTextBlob
   constructor(CanvasKit: CanvasKit, ref: TextBlob) {
     super(CanvasKit, ref, "TextBlob");
   }
-
-  dispose = () => {
-    this.ref.delete();
-  };
 }

package/src/skia/web/JsiSkTypeface.ts

@@ -29,8 +29,4 @@ export class JsiSkTypeface
   getGlyphIDs(str: string, numCodePoints?: number) {
     return Array.from(this.ref.getGlyphIDs(str, numCodePoints));
   }
-
-  dispose = () => {
-    this.ref.delete();
-  };
 }

package/src/skia/web/JsiSkTypefaceFontProvider.ts

@@ -9,8 +9,6 @@ export class JsiSkTypefaceFontProvider
   extends HostObject<TypefaceFontProvider, "FontMgr">
   implements SkTypefaceFontProvider
 {
-  private allocatedPointers: number[] = [];
-
   constructor(CanvasKit: CanvasKit, ref: TypefaceFontProvider) {
     super(CanvasKit, ref, "FontMgr");
   }
@@ -36,16 +34,6 @@ export class JsiSkTypefaceFontProvider
     // @ts-expect-error
     this.ref._registerFont(typeface.ref, strPtr);
   }
-
-  dispose() {
-    for (const ptr of this.allocatedPointers) {
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-expect-error
-      this.CanvasKit._free(ptr);
-    }
-
-    this.ref.delete();
-  }
 }
 
 const lengthBytesUTF8 = (str: string) => {

package/src/skia/web/JsiSkVertices.ts

@@ -13,10 +13,6 @@ export class JsiSkVertices
     super(CanvasKit, ref, "Vertices");
   }
 
-  dispose = () => {
-    this.ref.delete();
-  };
-
   bounds() {
     return new JsiSkRect(this.CanvasKit, this.ref.bounds());
   }

package/src/skia/web/JsiSkottieAnimation.ts

@@ -253,7 +253,4 @@ export class JsiSkottieAnimation
   version() {
     return this.ref.version();
   }
-  dispose() {
-    this.ref.delete();
-  }
 }

package/src/skia/web/JsiVideo.ts

@@ -89,9 +89,13 @@ export class JsiVideo implements Video {
     this.videoElement.volume = volume;
   }
 
-  dispose() {
+  [Symbol.dispose]() {
     if (this.videoElement.parentNode) {
       this.videoElement.parentNode.removeChild(this.videoElement);
     }
   }
+
+  dispose() {
+    this[Symbol.dispose]();
+  }
 }

package/src/sksg/Container.native.ts

@@ -23,7 +23,10 @@ const nativeDrawOnscreen = (nativeId: number, recorder: JsiRecorder) => {
 class NativeReanimatedContainer extends Container {
   private mapperId: number | null = null;
 
-  constructor(Skia: Skia, private nativeId: number) {
+  constructor(
+    Skia: Skia,
+    private nativeId: number
+  ) {
     super(Skia);
   }
 

package/src/sksg/Container.web.ts

@@ -29,7 +29,10 @@ const drawOnscreen = (Skia: Skia, nativeId: number, recording: Recording) => {
 class ReanimatedContainer extends Container {
   private mapperId: number | null = null;
 
-  constructor(Skia: Skia, private nativeId: number) {
+  constructor(
+    Skia: Skia,
+    private nativeId: number
+  ) {
     super(Skia);
   }
 

package/src/sksg/Elements.tsx

@@ -57,7 +57,6 @@ import type {
 import type { SkiaProps } from "../renderer";
 
 declare module "react" {
-  // eslint-disable-next-line @typescript-eslint/no-namespace
   namespace JSX {
     interface IntrinsicElements {
       skGroup: SkiaProps<GroupProps>;

package/src/sksg/Reconciler.ts

@@ -23,7 +23,10 @@ export class SkiaSGRoot {
   private root: OpaqueRoot;
   private container: Container;
 
-  constructor(public Skia: Skia, nativeId = -1) {
+  constructor(
+    public Skia: Skia,
+    nativeId = -1
+  ) {
     this.container = createContainer(Skia, nativeId);
     this.root = skiaReconciler.createContainer(
       this.container,

package/src/sksg/Recorder/Visitor.ts

@@ -250,7 +250,7 @@ const visitNode = (recorder: BaseRecorder, node: Node<any>) => {
       const shadows = node.children
         .filter((n) => n.type === NodeType.BoxShadow)
         // eslint-disable-next-line @typescript-eslint/no-shadow
-        .map(({ props }) => ({ props } as { props: BoxShadowProps }));
+        .map(({ props }) => ({ props }) as { props: BoxShadowProps });
       recorder.drawBox(props, shadows);
       break;
     case NodeType.Fill:

package/src/sksg/StaticContainer.ts

@@ -48,7 +48,10 @@ export abstract class Container {
 }
 
 export class StaticContainer extends Container {
-  constructor(Skia: Skia, private nativeId: number) {
+  constructor(
+    Skia: Skia,
+    private nativeId: number
+  ) {
     super(Skia);
   }
 

package/src/views/SkiaPictureView.web.tsx

@@ -26,7 +26,10 @@ interface Renderer {
 class WebGLRenderer implements Renderer {
   private surface: JsiSkSurface | null = null;
 
-  constructor(private canvas: HTMLCanvasElement, private pd: number) {
+  constructor(
+    private canvas: HTMLCanvasElement,
+    private pd: number
+  ) {
     this.onResize();
   }
 
@@ -83,7 +86,10 @@ class WebGLRenderer implements Renderer {
 class StaticWebGLRenderer implements Renderer {
   private cachedImage: SkImage | null = null;
 
-  constructor(private canvas: HTMLCanvasElement, private pd: number) {}
+  constructor(
+    private canvas: HTMLCanvasElement,
+    private pd: number
+  ) {}
 
   onResize(): void {
     this.cachedImage = null;
@@ -294,10 +300,13 @@ export const SkiaPictureView = forwardRef<
       redraw,
       makeImageSnapshot,
     } as SkiaPictureViewHandle);
+  }, [setPicture, getSize, redraw, makeImageSnapshot, props.nativeID]);
+
+  useEffect(() => {
     if (props.picture) {
       setPicture(props.picture);
     }
-  }, [setPicture, getSize, redraw, makeImageSnapshot, props]);
+  }, [setPicture, props.picture]);
 
   useEffect(() => {
     tick();