@shopify/react-native-skia 1.3.10 → 1.3.12

package/lib/typescript/src/Platform/IPlatform.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { NodeHandle, ViewComponent } from "react-native";
 import type { DataModule } from "../skia/types";
 export interface IPlatform {

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

@@ -1,7 +1,7 @@
 import type { SkColor, SkHostRect, SkPoint, SkRSXform } from "../../skia/types";
 type Modifier<T> = (input: T, index: number) => void;
-export declare const useRectBuffer: (size: number, modifier: Modifier<SkHostRect>) => import("react-native-reanimated/lib/typescript/reanimated2/commonTypes").SharedValue<SkHostRect[]>;
-export declare const useRSXformBuffer: (size: number, modifier: Modifier<SkRSXform>) => import("react-native-reanimated/lib/typescript/reanimated2/commonTypes").SharedValue<SkRSXform[]>;
-export declare const usePointBuffer: (size: number, modifier: Modifier<SkPoint>) => import("react-native-reanimated/lib/typescript/reanimated2/commonTypes").SharedValue<SkPoint[]>;
-export declare const useColorBuffer: (size: number, modifier: Modifier<SkColor>) => import("react-native-reanimated/lib/typescript/reanimated2/commonTypes").SharedValue<Float32Array[]>;
+export declare const useRectBuffer: (size: number, modifier: Modifier<SkHostRect>) => import("react-native-reanimated/lib/typescript/commonTypes").Mutable<SkHostRect[]>;
+export declare const useRSXformBuffer: (size: number, modifier: Modifier<SkRSXform>) => import("react-native-reanimated/lib/typescript/commonTypes").Mutable<SkRSXform[]>;
+export declare const usePointBuffer: (size: number, modifier: Modifier<SkPoint>) => import("react-native-reanimated/lib/typescript/commonTypes").Mutable<SkPoint[]>;
+export declare const useColorBuffer: (size: number, modifier: Modifier<SkColor>) => import("react-native-reanimated/lib/typescript/commonTypes").Mutable<Float32Array[]>;
 export {};

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

@@ -1,5 +1,5 @@
 import React from "react";
-import type { RefObject, ReactNode } from "react";
+import type { RefObject, ReactNode, FunctionComponent } from "react";
 import { SkiaDomView } from "../views";
 import type { TouchHandler, SkiaBaseViewProps } from "../views";
 export declare const useCanvasRef: () => React.RefObject<SkiaDomView>;
@@ -8,4 +8,4 @@ export interface CanvasProps extends SkiaBaseViewProps {
     children: ReactNode;
     onTouch?: TouchHandler;
 }
-export declare const Canvas: React.FunctionComponent<CanvasProps & React.RefAttributes<SkiaDomView>>;
+export declare const Canvas: FunctionComponent<CanvasProps & React.RefAttributes<SkiaDomView>>;

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

@@ -5,6 +5,7 @@ export declare class Container {
     getNativeId: () => number;
     private _root;
     Sk: SkDOM;
+    unmounted: boolean;
     constructor(Skia: Skia, redraw: () => void, getNativeId: () => number, native: boolean);
     draw(ctx: DrawingContext): void;
     get root(): RenderNode<GroupProps>;

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

@@ -1,4 +1,3 @@
-/// <reference types="node" />
 import type { HostConfig } from "react-reconciler";
 import type { NodeType, Node } from "../dom/types";
 import type { Container } from "./Container";

package/lib/typescript/src/skia/core/AnimatedImage.d.ts

@@ -2,4 +2,4 @@ import type { DataSourceParam } from "../types";
 /**
  * Returns a Skia Animated Image object
  * */
-export declare const useAnimatedImage: (source: DataSourceParam, onError?: ((err: Error) => void) | undefined, managed?: boolean) => import("../types").SkAnimatedImage | null;
+export declare const useAnimatedImage: (source: DataSourceParam, onError?: (err: Error) => void, managed?: boolean) => import("../types").SkAnimatedImage | null;

package/lib/typescript/src/skia/core/Data.d.ts

@@ -1,5 +1,5 @@
 import type { SkData, DataSourceParam, SkJSIInstance } from "../types";
-export declare const loadData: <T>(source: DataSourceParam, factory: (data: SkData) => T | null, onError?: ((err: Error) => void) | undefined) => Promise<T | null>;
+export declare const loadData: <T>(source: DataSourceParam, factory: (data: SkData) => T | null, onError?: (err: Error) => void) => Promise<T | null>;
 export declare const useCollectionLoading: <T extends SkJSIInstance<string>>(source: DataSourceParam[], loader: () => Promise<(T | null)[]>) => T[] | null;
-export declare const useRawData: <T extends SkJSIInstance<string>>(source: DataSourceParam, factory: (data: SkData) => T | null, onError?: ((err: Error) => void) | undefined, manage?: boolean) => T | null;
-export declare const useData: (source: DataSourceParam, onError?: ((err: Error) => void) | undefined) => SkData | null;
+export declare const useRawData: <T extends SkJSIInstance<string>>(source: DataSourceParam, factory: (data: SkData) => T | null, onError?: (err: Error) => void, manage?: boolean) => T | null;
+export declare const useData: (source: DataSourceParam, onError?: (err: Error) => void) => SkData | null;

package/lib/typescript/src/skia/core/Font.d.ts

@@ -3,7 +3,7 @@ import type { SkTypefaceFontProvider } from "../types/Paragraph/TypefaceFontProv
 /**
  * Returns a Skia Font object
  * */
-export declare const useFont: (font: DataSourceParam, size?: number, onError?: ((err: Error) => void) | undefined) => import("../types").SkFont | null;
+export declare const useFont: (font: DataSourceParam, size?: number, onError?: (err: Error) => void) => import("../types").SkFont | null;
 type Slant = "normal" | "italic" | "oblique";
 type Weight = "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900";
 interface RNFontStyle {

package/lib/typescript/src/skia/core/Image.d.ts

@@ -1,9 +1,8 @@
-/// <reference types="react" />
 import type { DataSourceParam, SkImage } from "../types";
 /**
  * Returns a Skia Image object
  * */
-export declare const useImage: (source: DataSourceParam, onError?: ((err: Error) => void) | undefined) => SkImage | null;
+export declare const useImage: (source: DataSourceParam, onError?: (err: Error) => void) => SkImage | null;
 /**
  * Creates an image from a given view reference. NOTE: This method has different implementations
  * on web/native. On web, the callback is called with the view ref and the callback is expected to
@@ -14,4 +13,4 @@ export declare const useImage: (source: DataSourceParam, onError?: ((err: Error)
  * @returns A promise that resolves to a Skia Image object or rejects
  * with an error id the view tag is invalid.
  */
-export declare const makeImageFromView: <T extends number | import("react").Component<unknown, unknown, any> | import("react").ComponentClass<unknown, any>>(viewRef: import("react").RefObject<T>, callback?: ((viewRef: import("react").RefObject<T>) => Promise<SkImage | null>) | null) => Promise<SkImage | null>;
+export declare const makeImageFromView: <T extends number | React.Component<unknown, unknown> | React.ComponentClass<unknown>>(viewRef: React.RefObject<T>, callback?: null | ((viewRef: React.RefObject<T>) => Promise<SkImage | null>)) => Promise<SkImage | null>;

package/lib/typescript/src/skia/core/Picture.d.ts

@@ -1,4 +1,4 @@
-import { type SkCanvas, type SkRect, type SkSize } from "../types";
+import type { SkCanvas, SkRect, SkSize } from "../types";
 /**
  * Memoizes and returns an SkPicture that can be drawn to another canvas.
  * @param rect Picture bounds

package/lib/typescript/src/skia/core/SVG.d.ts

@@ -1,2 +1,2 @@
 import type { DataSourceParam } from "../types";
-export declare const useSVG: (source: DataSourceParam, onError?: ((err: Error) => void) | undefined) => import("../types").SkSVG | null;
+export declare const useSVG: (source: DataSourceParam, onError?: (err: Error) => void) => import("../types").SkSVG | null;

package/lib/typescript/src/skia/core/SVG.web.d.ts

@@ -1,2 +1,2 @@
 import type { DataSourceParam } from "../types";
-export declare const useSVG: (source: DataSourceParam, onError?: ((err: Error) => void) | undefined) => import("../types").SkSVG | null;
+export declare const useSVG: (source: DataSourceParam, onError?: (err: Error) => void) => import("../types").SkSVG | null;

package/lib/typescript/src/skia/core/Typeface.d.ts

@@ -2,4 +2,4 @@ import type { DataSourceParam } from "../types";
 /**
  * Returns a Skia Typeface object
  * */
-export declare const useTypeface: (source: DataSourceParam, onError?: ((err: Error) => void) | undefined) => import("../types").SkTypeface | null;
+export declare const useTypeface: (source: DataSourceParam, onError?: (err: Error) => void) => import("../types").SkTypeface | null;

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

@@ -21,4 +21,9 @@ export interface SkAnimatedImage extends SkJSIInstance<"AnimatedImage"> {
      *  internally.
      */
     currentFrameDuration(): number;
+    /**
+     *  Returns the number of frames in the animation.
+     *
+     */
+    getFrameCount(): number;
 }

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

@@ -8,5 +8,5 @@ type ESModule = {
 export type DataModule = RNModule | ESModule;
 export type DataSource = DataModule | string | Uint8Array;
 export type DataSourceParam = DataSource | null | undefined;
-export declare const isRNModule: (mod: DataModule) => mod is number;
+export declare const isRNModule: (mod: DataModule) => mod is RNModule;
 export {};

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

@@ -8,22 +8,22 @@ export declare enum AlphaType {
     Unpremul = 3
 }
 export declare enum ColorType {
-    Unknown = 0,
-    Alpha_8 = 1,
-    RGB_565 = 2,
-    ARGB_4444 = 3,
-    RGBA_8888 = 4,
-    RGB_888x = 5,
-    BGRA_8888 = 6,
-    RGBA_1010102 = 7,
-    BGRA_1010102 = 8,
-    RGB_101010x = 9,
-    BGR_101010x = 10,
-    BGR_101010x_XR = 11,
-    RGBA_10x6 = 12,
-    Gray_8 = 13,
-    RGBA_F16Norm = 14,
-    RGBA_F16 = 15,
+    Unknown = 0,// uninitialized
+    Alpha_8 = 1,// pixel with alpha in 8-bit byte
+    RGB_565 = 2,// pixel with 5 bits red, 6 bits green, 5 bits blue, in 16-bit word
+    ARGB_4444 = 3,// pixel with 4 bits for alpha, red, green, blue; in 16-bit word
+    RGBA_8888 = 4,// pixel with 8 bits for red, green, blue, alpha; in 32-bit word
+    RGB_888x = 5,// pixel with 8 bits each for red, green, blue; in 32-bit word
+    BGRA_8888 = 6,// pixel with 8 bits for blue, green, red, alpha; in 32-bit word
+    RGBA_1010102 = 7,// 10 bits for red, green, blue; 2 bits for alpha; in 32-bit word
+    BGRA_1010102 = 8,// 10 bits for blue, green, red; 2 bits for alpha; in 32-bit word
+    RGB_101010x = 9,// pixel with 10 bits each for red, green, blue; in 32-bit word
+    BGR_101010x = 10,// pixel with 10 bits each for blue, green, red; in 32-bit word
+    BGR_101010x_XR = 11,// pixel with 10 bits each for blue, green, red; in 32-bit word, extended range
+    RGBA_10x6 = 12,// pixel with 10 used bits (most significant) followed by 6 unused
+    Gray_8 = 13,// pixel with grayscale level in 8-bit byte
+    RGBA_F16Norm = 14,// pixel with half floats in [0,1] for red, green, blue, alpha; in 64-bit word
+    RGBA_F16 = 15,// pixel with half floats for red, green, blue, alpha; in 64-bit word
     RGBA_F32 = 16
 }
 export interface ImageInfo {

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

@@ -1,8 +1,8 @@
 import type { SkJSIInstance } from "./JsiInstance";
 export declare enum BlurStyle {
-    Normal = 0,
-    Solid = 1,
-    Outer = 2,
+    Normal = 0,//!< fuzzy inside and outside
+    Solid = 1,//!< solid inside, fuzzy outside
+    Outer = 2,//!< nothing inside, fuzzy outside
     Inner = 3
 }
 export declare const isMaskFilter: (obj: SkJSIInstance<string> | null) => obj is SkMaskFilter;

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

@@ -5,9 +5,9 @@ export type NativeBuffer<T extends bigint | ArrayBuffer | CanvasImageSource | Ca
 export type NativeBufferAddr = NativeBuffer<bigint>;
 export type NativeBufferWeb = NativeBuffer<CanvasImageSource>;
 export type NativeBufferNode = NativeBuffer<ArrayBuffer>;
-export declare const isNativeBufferAddr: (buffer: NativeBuffer) => buffer is bigint;
-export declare const isNativeBufferWeb: (buffer: NativeBuffer) => buffer is CanvasImageSource;
-export declare const isNativeBufferNode: (buffer: NativeBuffer) => buffer is ArrayBuffer;
+export declare const isNativeBufferAddr: (buffer: NativeBuffer) => buffer is NativeBufferAddr;
+export declare const isNativeBufferWeb: (buffer: NativeBuffer) => buffer is NativeBufferWeb;
+export declare const isNativeBufferNode: (buffer: NativeBuffer) => buffer is NativeBufferNode;
 export interface NativeBufferFactory {
     /**
      * Copy pixels to a native buffer.

package/lib/typescript/src/skia/types/Paint/BlendMode.d.ts

@@ -26,33 +26,33 @@
  *  rc : result "color": red, green, blue components
  */
 export declare enum BlendMode {
-    Clear = 0,
-    Src = 1,
-    Dst = 2,
-    SrcOver = 3,
-    DstOver = 4,
-    SrcIn = 5,
-    DstIn = 6,
-    SrcOut = 7,
-    DstOut = 8,
-    SrcATop = 9,
-    DstATop = 10,
-    Xor = 11,
-    Plus = 12,
-    Modulate = 13,
-    Screen = 14,
-    Overlay = 15,
-    Darken = 16,
-    Lighten = 17,
-    ColorDodge = 18,
-    ColorBurn = 19,
-    HardLight = 20,
-    SoftLight = 21,
-    Difference = 22,
-    Exclusion = 23,
-    Multiply = 24,
-    Hue = 25,
-    Saturation = 26,
-    Color = 27,
+    Clear = 0,//!< r = 0
+    Src = 1,//!< r = s
+    Dst = 2,//!< r = d
+    SrcOver = 3,//!< r = s + (1-sa)*d
+    DstOver = 4,//!< r = d + (1-da)*s
+    SrcIn = 5,//!< r = s * da
+    DstIn = 6,//!< r = d * sa
+    SrcOut = 7,//!< r = s * (1-da)
+    DstOut = 8,//!< r = d * (1-sa)
+    SrcATop = 9,//!< r = s*da + d*(1-sa)
+    DstATop = 10,//!< r = d*sa + s*(1-da)
+    Xor = 11,//!< r = s*(1-da) + d*(1-sa)
+    Plus = 12,//!< r = min(s + d, 1)
+    Modulate = 13,//!< r = s*d
+    Screen = 14,//!< r = s + d - s*d
+    Overlay = 15,//!< multiply or screen, depending on destination
+    Darken = 16,//!< rc = s + d - max(s*da, d*sa), ra = kSrcOver
+    Lighten = 17,//!< rc = s + d - min(s*da, d*sa), ra = kSrcOver
+    ColorDodge = 18,//!< brighten destination to reflect source
+    ColorBurn = 19,//!< darken destination to reflect source
+    HardLight = 20,//!< multiply or screen, depending on source
+    SoftLight = 21,//!< lighten or darken, depending on source
+    Difference = 22,//!< rc = s + d - 2*(min(s*da, d*sa)), ra = kSrcOver
+    Exclusion = 23,//!< rc = s + d - two(s*d), ra = kSrcOver
+    Multiply = 24,//!< r = s*(1-da) + d*(1-sa) + s*d
+    Hue = 25,//!< hue of source with saturation and luminosity of destination
+    Saturation = 26,//!< saturation of source with hue and luminosity of
+    Color = 27,//!< hue and saturation of source with luminosity of destination
     Luminosity = 28
 }

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

@@ -26,10 +26,10 @@ export declare enum FillType {
     InverseEvenOdd = 3
 }
 export declare enum PathOp {
-    Difference = 0,
-    Intersect = 1,
-    Union = 2,
-    XOR = 3,
+    Difference = 0,//!< subtract the op path from the first path
+    Intersect = 1,//!< intersect the two paths
+    Union = 2,//!< union (inclusive-or) the two paths
+    XOR = 3,//!< exclusive-or the two paths
     ReverseDifference = 4
 }
 export declare enum PathVerb {

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

@@ -2,7 +2,7 @@ import type { SkRect } from "../Rect";
 import type { SkJSIInstance } from "../JsiInstance";
 export declare enum VertexMode {
     Triangles = 0,
-    TrianglesStrip = 1,
+    TriangleStrip = 1,
     TriangleFan = 2
 }
 export interface SkVertices extends SkJSIInstance<"Vertices"> {

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

@@ -6,6 +6,7 @@ export declare class JsiSkAnimatedImage extends HostObject<AnimatedImage, "Anima
     constructor(CanvasKit: CanvasKit, ref: AnimatedImage);
     decodeNextFrame(): number;
     currentFrameDuration(): number;
+    getFrameCount(): number;
     getCurrentFrame(): JsiSkImage | null;
     dispose: () => void;
 }

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

@@ -1,5 +1,5 @@
 import type { Canvas, CanvasKit } from "canvaskit-wasm";
-import { type BlendMode, type ClipOp, type FilterMode, type MipmapMode, type PointMode, type SaveLayerFlag, type ImageInfo, type SkCanvas, type SkColor, type SkFont, type SkImage, type SkImageFilter, type SkMatrix, type SkPaint, type SkPath, type SkPicture, type SkPoint, type SkRect, type InputRRect, type SkSVG, type SkTextBlob, type SkVertices, type SkRSXform, type CubicResampler, type FilterOptions } from "../types";
+import type { BlendMode, ClipOp, FilterMode, MipmapMode, PointMode, SaveLayerFlag, ImageInfo, SkCanvas, SkColor, SkFont, SkImage, SkImageFilter, SkMatrix, SkPaint, SkPath, SkPicture, SkPoint, SkRect, InputRRect, SkSVG, SkTextBlob, SkVertices, SkRSXform, CubicResampler, FilterOptions } from "../types";
 import { HostObject } from "./Host";
 export declare class JsiSkCanvas extends HostObject<Canvas, "Canvas"> implements SkCanvas {
     constructor(CanvasKit: CanvasKit, ref: Canvas);

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

@@ -1,5 +1,5 @@
 import type { CanvasKit } from "canvaskit-wasm";
-import { type NativeBuffer, type NativeBufferFactory, type SkImage } from "../types";
+import type { NativeBuffer, NativeBufferFactory, SkImage } from "../types";
 import { Host } from "./Host";
 export declare class JsiSkNativeBufferFactory extends Host implements NativeBufferFactory {
     constructor(CanvasKit: CanvasKit);

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

@@ -1,5 +1,5 @@
 import type { CanvasKit, ParagraphStyle } from "canvaskit-wasm";
-import { type SkParagraphStyle } from "../types";
+import type { SkParagraphStyle } from "../types";
 export declare class JsiSkParagraphStyle {
     static toParagraphStyle(ck: CanvasKit, value: SkParagraphStyle): ParagraphStyle;
 }

package/lib/typescript/src/specs/SkiaDomViewNativeComponent.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react-native/types/modules/Codegen" />
 import type { ViewProps } from "react-native";
 export interface NativeProps extends ViewProps {
     mode: string;

package/lib/typescript/src/specs/SkiaPictureViewNativeComponent.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react-native/types/modules/Codegen" />
 import type { ViewProps } from "react-native";
 export interface NativeProps extends ViewProps {
     mode: string;

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

@@ -22,9 +22,5 @@ export declare class SkiaDomView extends React.Component<SkiaDomViewProps> {
      * Sends a redraw request to the native SkiaView.
      */
     redraw(): void;
-    /**
-     * Clear up the dom node when unmounting to release resources.
-     */
-    componentWillUnmount(): void;
     render(): React.JSX.Element;
 }

package/package.json

@@ -7,7 +7,7 @@
     "setup-skia-web": "./scripts/setup-canvaskit.js"
   },
   "title": "React Native Skia",
-  "version": "1.3.10",
+  "version": "1.3.12",
   "description": "High-performance React Native Graphics using Skia",
   "main": "lib/module/index.js",
   "react-native": "src/index.ts",
@@ -44,12 +44,26 @@
     "dist/**"
   ],
   "scripts": {
+    "lint": "eslint . --ext .ts,.tsx  --max-warnings 0 --cache --fix",
     "tsc": "tsc --noEmit",
-    "lint": "eslint . --ext .ts,.tsx  --max-warnings 0 --cache",
     "test": "jest",
     "e2e": "E2E=true yarn test -i e2e",
+    "release": "semantic-release",
     "build": "bob build && merge-dirs lib/typescript/src lib/commonjs && merge-dirs lib/typescript/src lib/module",
-    "release": "semantic-release"
+    "build-skia-ios-framework": "ts-node ./scripts/build-skia-ios-framework.ts",
+    "build-skia-ios": "ts-node ./scripts/build-skia-ios.ts && yarn build-skia-ios-framework",
+    "build-skia-android": "ts-node ./scripts/build-skia-android.ts",
+    "clean-skia": "yarn rimraf ./libs && yarn rimraf ../../externals/skia/out",
+    "copy-skia-include-headers": "yarn rimraf ./cpp/skia/include/ && cp -a ../../externals/skia/include/. ./cpp/skia/include",
+    "copy-skia-module-headers": "ts-node ./scripts/copy-skia-module-headers.ts",
+    "copy-skia-headers": "yarn copy-skia-include-headers && yarn copy-skia-module-headers",
+    "build-skia": "yarn build-skia-ios && yarn build-skia-android && yarn copy-skia-headers",
+    "clang-format": "yarn clang-format-ios && yarn clang-format-android && yarn clang-format-common",
+    "clang-format-ios": "find ios/ -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",
+    "clang-format-common": "find cpp/ \\( -path 'cpp//skia' -prune \\) -o \\( -iname '*.h' -o -iname '*.m' -o -iname '*.cpp' \\) -print | xargs clang-format -i",
+    "workflow-copy-libs": "yarn ts-node ./scripts/workflow-copy-libs.ts",
+    "cpplint": "cpplint --linelength=230 --filter=-legal/copyright,-whitespace/indent,-whitespace/comments,-whitespace/ending_newline,-build/include_order,-runtime/references,-readability/todo,-whitespace/blank_line,-whitespace/todo,-runtime/int,-build/c++11,-whitespace/parens --exclude=package/cpp/skia --exclude=package/ios --exclude=package/android/build --exclude=package/node_modules --recursive package"
   },
   "repository": {
     "type": "git",
@@ -79,35 +93,43 @@
     "react-native-reanimated": ">=2.0.0"
   },
   "peerDependenciesMeta": {
-    "react-native-reanimated": {
+    "react-native": {
       "optional": true
     },
-    "react-native": {
+    "react-native-reanimated": {
       "optional": true
     }
   },
   "devDependencies": {
     "@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6",
+    "@semantic-release/commit-analyzer": "^13.0.0",
+    "@semantic-release/github": "^10.3.3",
+    "@semantic-release/release-notes-generator": "^14.0.1",
     "@types/jest": "29.5.6",
     "@types/pixelmatch": "5.2.4",
     "@types/pngjs": "6.0.1",
-    "@types/react": "18.2.37",
+    "@types/react": "^18.2.6",
     "@types/react-reconciler": "0.26.7",
     "@types/ws": "8.5.3",
-    "eslint": "8.21.0",
-    "eslint-config-react-native-wcandillon": "3.10.2",
-    "eslint-plugin-reanimated": "2.0.0",
+    "eslint": "8",
+    "eslint-config-react-native-wcandillon": "^3.10.2",
+    "eslint-plugin-import": "2.27.5",
     "jest": "29.6.4",
     "jest-diff": "29.7.0",
     "merge-dirs": "0.2.1",
     "pixelmatch": "5.3.0",
     "pngjs": "6.0.0",
-    "react": "18.1.0",
-    "react-native": "0.72.6",
+    "prettier": "2.8.7",
+    "react": "18.3.1",
+    "react-native": "0.75.2",
     "react-native-builder-bob": "0.18.2",
-    "react-native-reanimated": "3.6.2",
+    "react-native-reanimated": "^3.15.1",
+    "rimraf": "3.0.2",
+    "semantic-release": "^24.1.0",
+    "semantic-release-yarn": "^3.0.2",
     "ts-jest": "29.1.1",
-    "typescript": "5.1.6",
+    "ts-node": "^10.9.2",
+    "typescript": "^5.2.2",
     "ws": "8.18.0"
   },
   "dependencies": {
@@ -137,11 +159,12 @@
           "configFile": "./.babelrc"
         }
       ],
-      "typescript"
+      [
+        "typescript",
+        {
+          "project": "tsconfig.build.json"
+        }
+      ]
     ]
-  },
-  "resolutions": {
-    "@typescript-eslint/eslint-plugin": "6.10.0",
-    "@typescript-eslint/parser": "6.10.0"
   }
-}
+}

package/src/Platform/Platform.web.tsx

@@ -31,7 +31,11 @@ const getObserver = () => {
               onLayout({
                 timeStamp: Date.now(),
                 nativeEvent: { layout: { x: left, y: top, width, height } },
+                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                // @ts-expect-error
                 currentTarget: 0,
+                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                // @ts-expect-error
                 target: 0,
                 bubbles: false,
                 cancelable: false,

package/src/external/reanimated/buffers.ts

@@ -1,5 +1,5 @@
 import { useEffect, useMemo } from "react";
-import type { WorkletFunction } from "react-native-reanimated/lib/typescript/reanimated2/commonTypes";
+import type { WorkletFunction } from "react-native-reanimated/lib/typescript/commonTypes";
 
 import type { SkColor, SkHostRect, SkPoint, SkRSXform } from "../../skia/types";
 import { Skia } from "../../skia";

package/src/mock/index.ts

@@ -8,7 +8,11 @@ const NoopValue = () => ({ current: 0 });
 const NoopSharedValue = () => ({ value: 0 });
 
 export const Mock = (CanvasKit: CanvasKit) => {
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore
   global.SkiaApi = JsiSkApi(CanvasKit);
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore
   const Skia = global.SkiaApi;
   return {
     Skia,

package/src/renderer/Container.tsx

@@ -10,6 +10,7 @@ import type { Skia } from "../skia/types";
 export class Container {
   private _root: RenderNode<GroupProps>;
   public Sk: SkDOM;
+  public unmounted = false;
   constructor(
     Skia: Skia,
     public redraw: () => void = () => {},

package/src/renderer/HostConfig.ts

@@ -53,9 +53,13 @@ const appendNode = (parent: Node<unknown>, child: Node<unknown>) => {
   parent.addChild(child);
 };
 
-const removeNode = (parent: Node<unknown>, child: Node<unknown>) => {
+const removeNode = (parent: Node<unknown>, child: Node<unknown>, unmounted = false) => {
+  // If the drawing is unmounted we don't want to update it.
+  // We can just stop the reanimated mappers
   unbindReanimatedNode(child);
-  return parent.removeChild(child);
+  if (!unmounted) {
+    parent.removeChild(child);
+  }
 };
 
 const insertBefore = (
@@ -224,7 +228,7 @@ export const skHostConfig: SkiaHostConfig = {
   },
 
   removeChildFromContainer: (container, child) => {
-    removeNode(container.root, child);
+    removeNode(container.root, child, container.unmounted);
   },
 
   insertInContainerBefore: (container, child, before) => {

package/src/renderer/Reconciler.tsx

@@ -46,6 +46,7 @@ export class SkiaRoot {
   }
 
   unmount() {
+    this.container.unmounted = true;
     skiaReconciler.updateContainer(null, this.root, null, () => {
       hostDebug("unmountContainer");
     });

package/src/skia/core/Picture.ts

@@ -1,5 +1,6 @@
 import { Skia } from "../Skia";
-import { isRect, type SkCanvas, type SkRect, type SkSize } from "../types";
+import type { SkCanvas, SkRect, SkSize } from "../types";
+import { isRect } from "../types";
 
 /**
  * Memoizes and returns an SkPicture that can be drawn to another canvas.

package/src/skia/types/AnimatedImage/AnimatedImage.ts

@@ -25,5 +25,11 @@ export interface SkAnimatedImage extends SkJSIInstance<"AnimatedImage"> {
    */
   currentFrameDuration(): number;
 
+  /**
+   *  Returns the number of frames in the animation.
+   *
+   */
+  getFrameCount(): number;
+
   // TODO - add the rest of the methods from the Skia API (see SkAnimatedImage.h)
 }

package/src/skia/types/Matrix4.ts

@@ -94,7 +94,7 @@ export const Matrix4 = (): Matrix4 => {
 /**
  * @worklet
  */
-export const translate = (x: number, y: number, z: number = 0): Matrix4 => {
+export const translate = (x: number, y: number, z = 0): Matrix4 => {
   "worklet";
   return [1, 0, 0, x, 0, 1, 0, y, 0, 0, 1, z, 0, 0, 0, 1];
 };
@@ -228,12 +228,7 @@ export const pivot = (m: Matrix4, p: Point) => {
 /**
  * @worklet
  */
-export const scale = (
-  sx: number,
-  sy: number,
-  sz: number = 1,
-  p?: Point
-): Matrix4 => {
+export const scale = (sx: number, sy: number, sz = 1, p?: Point): Matrix4 => {
   "worklet";
   const m4: Matrix4 = [sx, 0, 0, 0, 0, sy, 0, 0, 0, 0, sz, 0, 0, 0, 0, 1];
   if (p) {

package/src/skia/types/Vertices/Vertices.tsx

@@ -3,7 +3,7 @@ import type { SkJSIInstance } from "../JsiInstance";
 
 export enum VertexMode {
   Triangles,
-  TrianglesStrip,
+  TriangleStrip,
   TriangleFan,
 }
 

package/src/skia/web/JsiSkAnimatedImage.ts

@@ -21,6 +21,10 @@ export class JsiSkAnimatedImage
     return this.ref.currentFrameDuration();
   }
 
+  getFrameCount() {
+    return this.ref.getFrameCount();
+  }
+
   getCurrentFrame() {
     const image = this.ref.makeImageAtCurrentFrame();
     if (image === null) {