@shopify/react-native-skia 0.1.128 → 0.1.131

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

@@ -0,0 +1,8 @@
+import type { CanvasKit } from "canvaskit-wasm";
+import type { SkRSXform } from "../types";
+import { HostObject } from "./Host";
+declare type RSXform = Float32Array;
+export declare class JsiSkRSXform extends HostObject<RSXform, "RSXform"> implements SkRSXform {
+    constructor(CanvasKit: CanvasKit, ref: RSXform);
+}
+export {};

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

@@ -0,0 +1,11 @@
+import type { CanvasKit, Rect } from "canvaskit-wasm";
+import type { SkRect } from "../types";
+import { HostObject } from "./Host";
+export declare class JsiSkRect extends HostObject<Rect, "Rect"> implements SkRect {
+    static fromValue(CanvasKit: CanvasKit, rect: SkRect): JsiSkRect;
+    constructor(CanvasKit: CanvasKit, ref: Rect);
+    get x(): number;
+    get y(): number;
+    get width(): number;
+    get height(): number;
+}

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

@@ -0,0 +1,14 @@
+import type { CanvasKit, RuntimeEffect } from "canvaskit-wasm";
+import type { SkMatrix, SkShader } from "../types";
+import type { SkRuntimeEffect } from "../types/RuntimeEffect/RuntimeEffect";
+import { HostObject } from "./Host";
+import { JsiSkShader } from "./JsiSkShader";
+export declare class JsiSkRuntimeEffect extends HostObject<RuntimeEffect, "RuntimeEffect"> implements SkRuntimeEffect {
+    constructor(CanvasKit: CanvasKit, ref: RuntimeEffect);
+    makeShader(uniforms: number[], localMatrix?: SkMatrix): JsiSkShader;
+    makeShaderWithChildren(uniforms: number[], children?: SkShader[], localMatrix?: SkMatrix): JsiSkShader;
+    getUniform(index: number): import("canvaskit-wasm").SkSLUniform;
+    getUniformCount(): number;
+    getUniformFloatCount(): number;
+    getUniformName(index: number): string;
+}

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

@@ -0,0 +1,8 @@
+import type { CanvasKit } from "canvaskit-wasm";
+import type { RuntimeEffectFactory } from "../types/RuntimeEffect/RuntimeEffectFactory";
+import { Host } from "./Host";
+import { JsiSkRuntimeEffect } from "./JsiSkRuntimeEffect";
+export declare class JsiSkRuntimeEffectFactory extends Host implements RuntimeEffectFactory {
+    constructor(CanvasKit: CanvasKit);
+    Make(sksl: string): JsiSkRuntimeEffect | null;
+}

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

@@ -0,0 +1,9 @@
+import type { CanvasKit } from "canvaskit-wasm";
+import type { SkData, SkSVG } from "../types";
+import type { SVGFactory } from "../types/SVG/SVGFactory";
+import { Host } from "./Host";
+export declare class JsiSkSVGFactory extends Host implements SVGFactory {
+    constructor(CanvasKit: CanvasKit);
+    MakeFromData(_data: SkData): SkSVG | null;
+    MakeFromString(_str: string): SkSVG | null;
+}

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

@@ -0,0 +1,6 @@
+import type { CanvasKit, Shader } from "canvaskit-wasm";
+import type { SkShader } from "../types";
+import { HostObject } from "./Host";
+export declare class JsiSkShader extends HostObject<Shader, "Shader"> implements SkShader {
+    constructor(CanvasKit: CanvasKit, ref: Shader);
+}

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

@@ -0,0 +1,16 @@
+import type { CanvasKit } from "canvaskit-wasm";
+import type { BlendMode, SkColor, SkMatrix, SkPoint, SkShader, TileMode } from "../types";
+import type { ShaderFactory } from "../types/Shader/ShaderFactory";
+import { Host } from "./Host";
+import { JsiSkShader } from "./JsiSkShader";
+export declare class JsiSkShaderFactory extends Host implements ShaderFactory {
+    constructor(CanvasKit: CanvasKit);
+    MakeLinearGradient(start: SkPoint, end: SkPoint, colors: SkColor[], pos: number[] | null, mode: TileMode, localMatrix?: SkMatrix, flags?: number): JsiSkShader;
+    MakeRadialGradient(center: SkPoint, radius: number, colors: SkColor[], pos: number[] | null, mode: TileMode, localMatrix?: SkMatrix, flags?: number): JsiSkShader;
+    MakeTwoPointConicalGradient(start: SkPoint, startRadius: number, end: SkPoint, endRadius: number, colors: SkColor[], pos: number[] | null, mode: TileMode, localMatrix?: SkMatrix, flags?: number): JsiSkShader;
+    MakeSweepGradient(cx: number, cy: number, colors: SkColor[], pos: number[] | null, mode: TileMode, localMatrix?: SkMatrix | null, flags?: number, startAngleInDegrees?: number, endAngleInDegrees?: number): JsiSkShader;
+    MakeTurbulence(baseFreqX: number, baseFreqY: number, octaves: number, seed: number, tileW: number, tileH: number): JsiSkShader;
+    MakeFractalNoise(baseFreqX: number, baseFreqY: number, octaves: number, seed: number, tileW: number, tileH: number): JsiSkShader;
+    MakeBlend(mode: BlendMode, one: SkShader, two: SkShader): JsiSkShader;
+    MakeColor(color: SkColor): JsiSkShader;
+}

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

@@ -0,0 +1,8 @@
+import type { CanvasKit, Surface } from "canvaskit-wasm";
+import type { SkCanvas, SkImage, SkRect, SkSurface } from "../types";
+import { HostObject } from "./Host";
+export declare class JsiSkSurface extends HostObject<Surface, "Surface"> implements SkSurface {
+    constructor(CanvasKit: CanvasKit, ref: Surface);
+    getCanvas(): SkCanvas;
+    makeImageSnapshot(bounds?: SkRect): SkImage;
+}

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

@@ -0,0 +1,8 @@
+import type { CanvasKit } from "canvaskit-wasm";
+import type { SurfaceFactory } from "../types";
+import { Host } from "./Host";
+import { JsiSkSurface } from "./JsiSkSurface";
+export declare class JsiSkSurfaceFactory extends Host implements SurfaceFactory {
+    constructor(CanvasKit: CanvasKit);
+    Make(width: number, height: number): JsiSkSurface;
+}

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

@@ -0,0 +1,6 @@
+import type { CanvasKit, TextBlob } from "canvaskit-wasm";
+import type { SkTextBlob } from "../types";
+import { HostObject } from "./Host";
+export declare class JsiSkTextBlob extends HostObject<TextBlob, "TextBlob"> implements SkTextBlob {
+    constructor(CanvasKit: CanvasKit, ref: TextBlob);
+}

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

@@ -0,0 +1,12 @@
+import type { CanvasKit } from "canvaskit-wasm";
+import type { SkFont, SkRSXform } from "../types";
+import type { TextBlobFactory } from "../types/TextBlob";
+import { Host } from "./Host";
+import { JsiSkTextBlob } from "./JsiSkTextBlob";
+export declare class JsiSkTextBlobFactory extends Host implements TextBlobFactory {
+    constructor(CanvasKit: CanvasKit);
+    MakeFromText(str: string, font: SkFont): JsiSkTextBlob;
+    MakeFromGlyphs(glyphs: number[], font: SkFont): JsiSkTextBlob;
+    MakeFromRSXform(str: string, rsxforms: SkRSXform[], font: SkFont): JsiSkTextBlob;
+    MakeFromRSXformGlyphs(glyphs: number[], rsxforms: SkRSXform[], font: SkFont): JsiSkTextBlob;
+}

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

@@ -0,0 +1,8 @@
+import type { CanvasKit, Typeface } from "canvaskit-wasm";
+import type { SkTypeface } from "../types";
+import { HostObject } from "./Host";
+export declare class JsiSkTypeface extends HostObject<Typeface, "Typeface"> implements SkTypeface {
+    constructor(CanvasKit: CanvasKit, ref: Typeface);
+    get bold(): boolean;
+    get italic(): boolean;
+}

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

@@ -0,0 +1,8 @@
+import type { CanvasKit } from "canvaskit-wasm";
+import type { SkData, TypefaceFactory } from "../types";
+import { Host } from "./Host";
+import { JsiSkTypeface } from "./JsiSkTypeface";
+export declare class JsiSkTypefaceFactory extends Host implements TypefaceFactory {
+    constructor(CanvasKit: CanvasKit);
+    MakeFreeTypeFaceFromData(data: SkData): JsiSkTypeface | null;
+}

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

@@ -0,0 +1,9 @@
+import type { CanvasKit, Vertices } from "canvaskit-wasm";
+import type { SkVertices } from "../types";
+import { HostObject } from "./Host";
+import { JsiSkRect } from "./JsiSkRect";
+export declare class JsiSkVertices extends HostObject<Vertices, "Vertices"> implements SkVertices {
+    constructor(CanvasKit: CanvasKit, ref: Vertices);
+    bounds(): JsiSkRect;
+    uniqueID(): number;
+}

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

@@ -0,0 +1,4 @@
+import type { CanvasKit } from "canvaskit-wasm";
+import type { SkPoint, VertexMode } from "../types";
+import { JsiSkVertices } from "./JsiSkVertices";
+export declare const MakeVertices: (CanvasKit: CanvasKit, mode: VertexMode, positions: SkPoint[], textureCoordinates?: SkPoint[] | null | undefined, colors?: Float32Array[] | undefined, indices?: number[] | null | undefined, isVolatile?: boolean | undefined) => JsiSkVertices;

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

@@ -0,0 +1,3 @@
+import type { CanvasKit } from "canvaskit-wasm";
+import type { Skia } from "../types";
+export declare const JsiSkApi: (CanvasKit: CanvasKit) => Skia;

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

@@ -0,0 +1 @@
+export * from "./JsiSkia";

package/lib/typescript/src/values/api.d.ts

@@ -3,4 +3,4 @@ declare global {
     var SkiaValueApi: ISkiaValueApi;
 }
 export declare const ValueApi: ISkiaValueApi;
-export declare const createValue: <T>(initialValue: T) => import("./types").SkiaValue<T>, createDerivedValue: <R>(cb: () => R, values: import("./types").SkiaReadonlyValue<unknown>[]) => import("./types").SkiaReadonlyValue<R>;
+export declare const createValue: <T>(initialValue: T) => import("./types").SkiaMutableValue<T>, createDerivedValue: <R>(cb: () => R, values: import("./types").SkiaValue<unknown>[]) => import("./types").SkiaValue<R>;

package/lib/typescript/src/values/api.web.d.ts

@@ -1,2 +1,2 @@
 export declare const ValueApi: import("./types").ISkiaValueApi;
-export declare const createValue: <T>(initialValue: T) => import("./types").SkiaValue<T>, createDerivedValue: <R>(cb: () => R, values: import("./types").SkiaReadonlyValue<unknown>[]) => import("./types").SkiaReadonlyValue<R>;
+export declare const createValue: <T>(initialValue: T) => import("./types").SkiaMutableValue<T>, createDerivedValue: <R>(cb: () => R, values: import("./types").SkiaValue<unknown>[]) => import("./types").SkiaValue<R>;

package/lib/typescript/src/values/hooks/useDerivedValue.d.ts

@@ -5,4 +5,4 @@
  * @param values Dependant values
  * @returns A readonly value
  */
-export declare const useDerivedValue: <R>(cb: () => R, values: unknown[]) => import("..").SkiaReadonlyValue<R>;
+export declare const useDerivedValue: <R>(cb: () => R, values: unknown[]) => import("..").SkiaValue<R>;

package/lib/typescript/src/values/hooks/useValue.d.ts

@@ -1,7 +1,7 @@
-import type { SkiaValue } from "../types";
+import type { SkiaMutableValue } from "../types";
 /**
  * Creates a new value that holds some data.
  * @param v Value to hold
  * @returns A Value of type of v
  */
-export declare const useValue: <T>(v: T) => SkiaValue<T>;
+export declare const useValue: <T>(v: T) => SkiaMutableValue<T>;

package/lib/typescript/src/values/hooks/useValueEffect.d.ts

@@ -1,7 +1,7 @@
-import type { SkiaReadonlyValue } from "../types";
+import type { SkiaValue } from "../types";
 /**
  * Sets up an effect that will be run whenever the value changes
  * @param value Value to subscribe to changes on
  * @param cb Callback to run when value changes
  */
-export declare const useValueEffect: <T>(value: SkiaReadonlyValue<T>, cb: (v: T) => void) => void;
+export declare const useValueEffect: <T>(value: SkiaValue<T>, cb: (v: T) => void) => void;

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

@@ -1,4 +1,4 @@
-export interface SkiaReadonlyValue<T = number> {
+export interface SkiaValue<T = number> {
     /**
      * Gets the value hold by the Value object
      */
@@ -13,7 +13,7 @@ export interface SkiaReadonlyValue<T = number> {
      */
     __typename__: "RNSkValue";
 }
-export interface SkiaValue<T = number> extends SkiaReadonlyValue<T> {
+export interface SkiaMutableValue<T = number> extends SkiaValue<T> {
     /**
      * Get/sets the value hold by the Value object
      */
@@ -23,7 +23,7 @@ export interface SkiaValue<T = number> extends SkiaReadonlyValue<T> {
      * */
     animation: SkiaAnimation | undefined;
 }
-export interface SkiaClockValue extends SkiaReadonlyValue<number> {
+export interface SkiaClockValue extends SkiaValue<number> {
     start: () => void;
     stop: () => void;
 }
@@ -39,12 +39,12 @@ export interface ISkiaValueApi {
      * Creates a new value that holds the initial value and that
      * can be changed.
      */
-    createValue: <T>(initialValue: T) => SkiaValue<T>;
+    createValue: <T>(initialValue: T) => SkiaMutableValue<T>;
     /**
      * Creates a derived value. This is a calculated value that returns the result of
      * a function that is called with the values of the dependencies.
      */
-    createDerivedValue: <R>(cb: () => R, values: Array<SkiaReadonlyValue<unknown>>) => SkiaReadonlyValue<R>;
+    createDerivedValue: <R>(cb: () => R, values: Array<SkiaValue<unknown>>) => SkiaValue<R>;
     /**
      * Creates a clock value where the value is the number of milliseconds elapsed
      * since the clock was created

package/lib/typescript/src/values/web/RNSkReadonlyValue.d.ts

@@ -1,5 +1,5 @@
-import type { SkiaReadonlyValue } from "../types";
-export declare class RNSkReadonlyValue<T> implements SkiaReadonlyValue<T> {
+import type { SkiaValue } from "../types";
+export declare class RNSkReadonlyValue<T> implements SkiaValue<T> {
     constructor(value: T);
     private _current;
     private _listeners;

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

@@ -1,6 +1,6 @@
 import React from "react";
-import type { SkRect } from "../skia";
-import type { SkiaReadonlyValue } from "../values";
+import type { SkRect } from "../skia/types";
+import type { SkiaValue } from "../values";
 import type { DrawMode, SkiaViewProps } from "./types";
 export declare class SkiaView extends React.Component<SkiaViewProps> {
     constructor(props: SkiaViewProps);
@@ -12,7 +12,7 @@ export declare class SkiaView extends React.Component<SkiaViewProps> {
      * @param rect Rect to use as bounds. Optional.
      * @returns An Image object.
      */
-    makeImageSnapshot(rect?: SkRect): import("../skia").SkImage;
+    makeImageSnapshot(rect?: SkRect): import("../skia/types").SkImage;
     /**
      * Sends a redraw request to the native SkiaView.
      */
@@ -32,6 +32,6 @@ export declare class SkiaView extends React.Component<SkiaViewProps> {
      * The view will redraw itself when any of the values change.
      * @param values Values to register
      */
-    registerValues(values: SkiaReadonlyValue<unknown>[]): () => void;
+    registerValues(values: SkiaValue<unknown>[]): () => void;
     render(): JSX.Element;
 }

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

@@ -0,0 +1,56 @@
+import React from "react";
+import type { PointerEvent } from "react";
+import type { SkRect } from "../skia/types";
+import type { SkiaValue } from "../values";
+import type { DrawMode, SkiaViewProps } from "./types";
+export declare class SkiaView extends React.Component<SkiaViewProps, {
+    width: number;
+    height: number;
+}> {
+    constructor(props: SkiaViewProps);
+    private _surface;
+    private _unsubscriptions;
+    private _touches;
+    private _canvas;
+    private _canvasRef;
+    private _mode;
+    private _redrawRequests;
+    private _unmounted;
+    private unsubscribeAll;
+    private onLayout;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    /**
+     * Creates a snapshot from the canvas in the surface
+     * @param rect Rect to use as bounds. Optional.
+     * @returns An Image object.
+     */
+    makeImageSnapshot(rect?: SkRect): import("../skia/types").SkImage | undefined;
+    /**
+     * Sends a redraw request to the native SkiaView.
+     */
+    private redraw;
+    requestRedraw(): void;
+    /**
+     * Updates the drawing mode for the skia view. This is the same
+     * as declaratively setting the mode property on the SkiaView.
+     * There are two drawing modes, "continuous" and "default",
+     * where the continuous mode will continuously redraw the view and
+     * the default mode will only redraw when any of the regular react
+     * properties are changed like size and margins.
+     * @param mode Drawing mode to use.
+     */
+    setDrawMode(mode: DrawMode): void;
+    /**
+     * Registers one or move values as a dependant value of the Skia View. The view will
+     * The view will redraw itself when any of the values change.
+     * @param values Values to register
+     */
+    registerValues(_values: SkiaValue<unknown>[]): void;
+    private handleTouchEvent;
+    handleTouchStart(evt: PointerEvent): void;
+    handleTouchMove(evt: PointerEvent): void;
+    handleTouchEnd(evt: PointerEvent): void;
+    handleTouchCancel(evt: PointerEvent): void;
+    render(): JSX.Element;
+}

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

@@ -1,7 +1,6 @@
 import type { ViewProps } from "react-native";
-import type { SkImage, SkRect } from "../skia";
-import type { SkCanvas } from "../skia/Canvas";
-import type { SkiaReadonlyValue } from "../values";
+import type { SkImage, SkRect, SkCanvas } from "../skia/types";
+import type { SkiaValue } from "../values";
 export declare type DrawMode = "continuous" | "default";
 export declare type NativeSkiaViewProps = ViewProps & {
     mode?: DrawMode;
@@ -18,6 +17,7 @@ export interface TouchInfo {
     y: number;
     force: number;
     type: TouchType;
+    id: number;
     timestamp: number;
 }
 export interface DrawingInfo {
@@ -49,7 +49,7 @@ export interface ISkiaViewApi {
     makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;
     setDrawCallback: (nativeId: number, callback: RNSkiaDrawCallback | undefined) => void;
     setDrawMode: (nativeId: number, mode: DrawMode) => void;
-    registerValuesInView: (nativeId: number, values: SkiaReadonlyValue<unknown>[]) => () => void;
+    registerValuesInView: (nativeId: number, values: SkiaValue<unknown>[]) => () => void;
 }
 export interface SkiaViewProps extends ViewProps {
     /**

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

@@ -2,7 +2,7 @@ import type { DependencyList } from "react";
 import type { TouchHandlers, TouchHandler } from "./types";
 /**
  * Provides a callback for handling touch events in the Skia View.
- * This touch handler only handles single taps.
+ * This touch handler only handles single touches.
  * @param handlers Callbacks for the different touch states
  * @param deps optional Dependency array to update the handlers
  * @returns A function that can be used from within the onDraw callback to
@@ -10,3 +10,13 @@ import type { TouchHandlers, TouchHandler } from "./types";
  * the info object.
  */
 export declare const useTouchHandler: (handlers: TouchHandlers, deps?: DependencyList) => TouchHandler;
+/**
+ * Provides a callback for handling touch events in the Skia View.
+ * This touch handler handles multiple touches.
+ * @param handlers Callbacks for the different touch states
+ * @param deps optional Dependency array to update the handlers
+ * @returns A function that can be used from within the onDraw callback to
+ * update and handle touch events. Call it with the touches property from
+ * the info object.
+ */
+export declare const useMultiTouchHandler: (handlers: TouchHandlers, deps?: DependencyList) => TouchHandler;

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

@@ -0,0 +1,5 @@
+import type { CanvasKit as CanvasKitType } from "canvaskit-wasm";
+declare global {
+    var CanvasKit: CanvasKitType;
+}
+export declare const LoadSkia: () => Promise<void>;

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/libskshaper.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>libskshaper.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>libskshaper.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

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "React Native Skia",
-  "version": "0.1.128",
+  "version": "0.1.131",
   "description": "High-performance React Native Graphics using Skia",
   "main": "lib/module/index.js",
   "files": [
@@ -20,7 +20,6 @@
     "android/cpp/**",
     "android/src/**",
     "libs/android/**",
-    "src/**",
     "index.js",
     "cpp/**/*.{h,cpp}",
     "ios",
@@ -72,6 +71,7 @@
     "eslint": "7.32.0",
     "eslint-config-react-native-wcandillon": "^3.7.2",
     "jest": "^27.4.3",
+    "patch-package": "^6.4.7",
     "react": "17.0.2",
     "react-native": "0.66.2",
     "react-native-builder-bob": "^0.18.2",
@@ -79,6 +79,7 @@
     "typescript": "^4.6.4"
   },
   "dependencies": {
+    "canvaskit-wasm": "^0.34.0",
     "react-reconciler": "^0.26.2"
   },
   "eslintIgnore": [

package/src/animation/decay/runDecay.ts

@@ -1,5 +1,5 @@
 import { ValueApi } from "../../values/api";
-import type { SkiaValue } from "../../values/types";
+import type { SkiaMutableValue } from "../../values/types";
 
 import { decay } from "./decay";
 import type { DecayConfig, DefaultDecayConfig, DecayState } from "./types";
@@ -11,7 +11,10 @@ import type { DecayConfig, DefaultDecayConfig, DecayState } from "./types";
  * @param config Configuration or default configuration
  * @returns Animation
  */
-export const runDecay = (value: SkiaValue<number>, config?: DecayConfig) => {
+export const runDecay = (
+  value: SkiaMutableValue<number>,
+  config?: DecayConfig
+) => {
   const resolvedConfig: DefaultDecayConfig = {
     deceleration: 0.998,
     velocityFactor: 1,

package/src/animation/functions/index.ts

@@ -1,2 +1,4 @@
-export { interpolate } from "./interpolate";
-export { interpolateColors, mixColors } from "./interpolateColors";
+export * from "./interpolate";
+export * from "./interpolateColors";
+export * from "./interpolateVector";
+export * from "./interpolatePaths";

package/src/animation/functions/interpolateColors.ts

@@ -1,7 +1,6 @@
 import { mix } from "../../renderer";
-import type { Color } from "../../skia";
+import type { Color, SkColor } from "../../skia";
 import { Skia } from "../../skia";
-import type { SkColor } from "../../skia/Color";
 
 import { interpolate } from "./interpolate";
 

package/src/animation/functions/interpolatePaths.ts

@@ -0,0 +1,38 @@
+import type { SkPath } from "../../skia/types";
+
+/**
+ * Maps an input value within a range to an output path within a path range.
+ * @param value - The input value.
+ * @param inputRange - The range of the input value.
+ * @param outputRange - The range of the output path.
+ * @returns The output path.
+ * @example <caption>Map a value between 0 and 1 to a path between two paths.</caption>
+ * const path1 = new Path();
+ * path1.moveTo(0, 0);
+ * path1.lineTo(100, 0);
+ * const path2 = new Path();
+ * path2.moveTo(0, 0);
+ * path2.lineTo(0, 100);
+ * const path = interpolatePath(0.5, [0, 1], [path1, path2]);
+ */
+export const interpolatePaths = (
+  value: number,
+  input: number[],
+  outputRange: SkPath[]
+) => {
+  let i = 0;
+  for (; i <= input.length - 1; i++) {
+    if (value >= input[i] && value <= input[i + 1]) {
+      break;
+    }
+    if (i === input.length - 1) {
+      if (value < input[0]) {
+        return outputRange[0];
+      } else {
+        return outputRange[i];
+      }
+    }
+  }
+  const t = (value - input[i]) / (input[i + 1] - input[i]);
+  return outputRange[i + 1].interpolate(outputRange[i], t)!;
+};