@shopify/react-native-skia 0.1.127 → 0.1.130

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

@@ -0,0 +1,28 @@
+export * from "./Picture";
+export * from "./Data";
+export * from "./SVG";
+export * from "./Surface";
+export * from "./FontMgr";
+export * from "./Vertices";
+export * from "./RuntimeEffect";
+export * from "./Shader";
+export * from "./Image";
+export * from "./ColorFilter";
+export * from "./ImageFilter";
+export * from "./Font";
+export * from "./Typeface";
+export * from "./Paint";
+export * from "./Path";
+export * from "./Color";
+export * from "./Canvas";
+export * from "./ContourMeasure";
+export * from "./MaskFilter";
+export * from "./Matrix";
+export * from "./PathEffect";
+export * from "./Point";
+export * from "./Rect";
+export * from "./RRect";
+export * from "./RSXform";
+export * from "./JsiInstance";
+export * from "./Skia";
+export * from "./TextBlob";

package/lib/typescript/src/skia/web/api/Host.d.ts

@@ -0,0 +1,18 @@
+import type { CanvasKit, EmbindEnumEntity } from "canvaskit-wasm";
+import type { SkJSIInstance } from "../../types";
+export declare abstract class Host {
+    readonly CanvasKit: CanvasKit;
+    constructor(CanvasKit: CanvasKit);
+}
+export declare abstract class HostObject<T, N extends string> extends Host implements SkJSIInstance<N> {
+    readonly __typename__: N;
+    readonly ref: T;
+    constructor(CanvasKit: CanvasKit, ref: T, typename: N);
+}
+export declare type NonNullish = {};
+export declare const toOptionalValue: <T>(value: NonNullish | undefined | null) => T | null | undefined;
+export declare const toUndefinedableValue: <T>(value: NonNullish | undefined) => T | undefined;
+export declare const toNullableValue: <T>(value: NonNullish | null) => T | null;
+export declare const toValue: <T>(value: NonNullish) => T;
+export declare const ckEnum: (value: number) => EmbindEnumEntity;
+export declare const optEnum: (value: number | undefined) => EmbindEnumEntity | undefined;

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

@@ -0,0 +1,44 @@
+import type { Canvas, CanvasKit } from "canvaskit-wasm";
+import type { BlendMode, ClipOp, FilterMode, MipmapMode, PointMode, SaveLayerFlag, SkCanvas, SkColor, SkFont, SkImage, SkImageFilter, SkMatrix, SkPaint, SkPath, SkPicture, SkPoint, SkRect, SkRRect, SkSVG, SkTextBlob, SkVertices } from "../../types";
+import { HostObject } from "./Host";
+export declare class JsiSkCanvas extends HostObject<Canvas, "Canvas"> implements SkCanvas {
+    constructor(CanvasKit: CanvasKit, ref: Canvas);
+    drawRect(rect: SkRect, paint: SkPaint): void;
+    drawImage(image: SkImage, x: number, y: number, paint?: SkPaint): void;
+    drawImageRect(img: SkImage, src: SkRect, dest: SkRect, paint: SkPaint, fastSample?: boolean): void;
+    drawImageCubic(img: SkImage, left: number, top: number, B: number, C: number, paint?: SkPaint | null): void;
+    drawImageOptions(img: SkImage, left: number, top: number, fm: FilterMode, mm: MipmapMode, paint?: SkPaint | null): void;
+    drawImageNine(img: SkImage, center: SkRect, dest: SkRect, filter: FilterMode, paint?: SkPaint | null): void;
+    drawImageRectCubic(img: SkImage, src: SkRect, dest: SkRect, B: number, C: number, paint?: SkPaint | null): void;
+    drawImageRectOptions(img: SkImage, src: SkRect, dest: SkRect, fm: FilterMode, mm: MipmapMode, paint?: SkPaint | null): void;
+    drawPaint(paint: SkPaint): void;
+    drawLine(x0: number, y0: number, x1: number, y1: number, paint: SkPaint): void;
+    drawCircle(cx: number, cy: number, radius: number, paint: SkPaint): void;
+    drawVertices(verts: SkVertices, mode: BlendMode, paint: SkPaint): void;
+    drawPatch(cubics: SkPoint[], colors?: SkColor[] | null, texs?: SkPoint[] | null, mode?: BlendMode | null, paint?: SkPaint): void;
+    restoreToCount(saveCount: number): void;
+    drawPoints(mode: PointMode, points: SkPoint[], paint: SkPaint): void;
+    drawArc(oval: SkRect, startAngle: number, sweepAngle: number, useCenter: boolean, paint: SkPaint): void;
+    drawRRect(rrect: SkRRect, paint: SkPaint): void;
+    drawDRRect(outer: SkRRect, inner: SkRRect, paint: SkPaint): void;
+    drawOval(oval: SkRect, paint: SkPaint): void;
+    drawPath(path: SkPath, paint: SkPaint): void;
+    drawText(str: string, x: number, y: number, paint: SkPaint, font: SkFont): void;
+    drawTextBlob(blob: SkTextBlob, x: number, y: number, paint: SkPaint): void;
+    drawGlyphs(glyphs: number[], positions: SkPoint[], x: number, y: number, font: SkFont, paint: SkPaint): void;
+    drawSvg(_svgDom: SkSVG, _width?: number, _height?: number): void;
+    save(): number;
+    saveLayer(paint?: SkPaint, bounds?: SkRect | null, backdrop?: SkImageFilter | null, flags?: SaveLayerFlag): number;
+    restore(): void;
+    rotate(rotationInDegrees: number, rx: number, ry: number): void;
+    scale(sx: number, sy: number): void;
+    skew(sx: number, sy: number): void;
+    translate(dx: number, dy: number): void;
+    drawColor(color: SkColor, blendMode?: BlendMode): void;
+    clear(color: SkColor): void;
+    clipPath(path: SkPath, op: ClipOp, doAntiAlias: boolean): void;
+    clipRect(rect: SkRect, op: ClipOp, doAntiAlias: boolean): void;
+    clipRRect(rrect: SkRRect, op: ClipOp, doAntiAlias: boolean): void;
+    concat(m: SkMatrix): void;
+    drawPicture(skp: SkPicture): void;
+}

package/lib/typescript/src/skia/web/api/JsiSkColor.d.ts

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

package/lib/typescript/src/skia/web/api/JsiSkColorFilter.d.ts

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

package/lib/typescript/src/skia/web/api/JsiSkImage.d.ts

@@ -0,0 +1,12 @@
+import type { CanvasKit, Image } from "canvaskit-wasm";
+import type { ImageFormat, FilterMode, MipmapMode, SkImage, SkMatrix, SkShader, TileMode } from "../../types";
+import { HostObject } from "./Host";
+export declare class JsiSkImage extends HostObject<Image, "Image"> implements SkImage {
+    constructor(CanvasKit: CanvasKit, ref: Image);
+    height(): number;
+    width(): number;
+    makeShaderOptions(_tx: TileMode, _ty: TileMode, _fm: FilterMode, _mm: MipmapMode, _localMatrix?: SkMatrix): SkShader;
+    makeShaderCubic(_tx: TileMode, _ty: TileMode, _B: number, _C: number, _localMatrix?: SkMatrix): SkShader;
+    encodeToBytes(fmt?: ImageFormat, quality?: number): Uint8Array;
+    encodeToBase64(_fmt?: ImageFormat, _quality?: number): string;
+}

package/lib/typescript/src/skia/web/api/JsiSkPaint.d.ts

@@ -0,0 +1,26 @@
+import type { CanvasKit, Paint } from "canvaskit-wasm";
+import type { BlendMode, SkColor, SkColorFilter, SkImageFilter, SkPaint, SkShader, StrokeCap, StrokeJoin, PaintStyle, SkMaskFilter, SkPathEffect } from "../../types";
+import { HostObject } from "./Host";
+export declare class JsiSkPaint extends HostObject<Paint, "Paint"> implements SkPaint {
+    constructor(CanvasKit: CanvasKit, ref: Paint);
+    copy(): JsiSkPaint;
+    getColor(): Float32Array;
+    getStrokeCap(): number;
+    getStrokeJoin(): number;
+    getStrokeMiter(): number;
+    getStrokeWidth(): number;
+    setAlphaf(alpha: number): void;
+    setAntiAlias(aa: boolean): void;
+    setBlendMode(blendMode: BlendMode): void;
+    setColor(color: SkColor): void;
+    setColorFilter(filter: SkColorFilter | null): void;
+    setImageFilter(filter: SkImageFilter | null): void;
+    setMaskFilter(filter: SkMaskFilter | null): void;
+    setPathEffect(effect: SkPathEffect | null): void;
+    setShader(shader: SkShader | null): void;
+    setStrokeCap(cap: StrokeCap): void;
+    setStrokeJoin(join: StrokeJoin): void;
+    setStrokeMiter(limit: number): void;
+    setStrokeWidth(width: number): void;
+    setStyle(style: PaintStyle): void;
+}

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

@@ -0,0 +1,10 @@
+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 {
+    constructor(CanvasKit: CanvasKit, ref: Rect);
+    get x(): number;
+    get y(): number;
+    get width(): number;
+    get height(): number;
+}

package/lib/typescript/src/skia/web/api/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/api/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/api/index.d.ts

@@ -0,0 +1,10 @@
+import type { CanvasKit } from "canvaskit-wasm";
+import { JsiSkPaint } from "./JsiSkPaint";
+import { JsiSkRect } from "./JsiSkRect";
+import { JsiSkSurfaceFactory } from "./JsiSkSurfaceFactory";
+export declare const JsiSkApi: (CanvasKit: CanvasKit) => {
+    Paint: () => JsiSkPaint;
+    XYWHRect: (x: number, y: number, width: number, height: number) => JsiSkRect;
+    Color: (color: import("../..").Color) => Float32Array;
+    Surface: JsiSkSurfaceFactory;
+};

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

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

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/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;
@@ -49,7 +48,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/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.127",
+  "version": "0.1.130",
   "description": "High-performance React Native Graphics using Skia",
   "main": "lib/module/index.js",
   "files": [
@@ -69,6 +69,7 @@
     "@types/jest": "^27.0.3",
     "@types/react-native": "^0.65.0",
     "@types/react-reconciler": "^0.26.4",
+    "canvaskit-wasm": "^0.34.0",
     "eslint": "7.32.0",
     "eslint-config-react-native-wcandillon": "^3.7.2",
     "jest": "^27.4.3",
@@ -76,7 +77,8 @@
     "react-native": "0.66.2",
     "react-native-builder-bob": "^0.18.2",
     "ts-jest": "^27.0.7",
-    "typescript": "^4.6.4"
+    "typescript": "^4.6.4",
+    "patch-package": "^6.4.7"
   },
   "dependencies": {
     "react-reconciler": "^0.26.2"

package/react-native-skia.podspec

@@ -21,7 +21,7 @@ Pod::Spec.new do |s|
   s.source       = { :git => "https://github.com/shopify/react-native-skia/react-native-skia.git", :tag => "#{s.version}" }
 
   s.requires_arc = true
-  s.xcconfig = {
+  s.pod_target_xcconfig = {
     'GCC_PREPROCESSOR_DEFINITIONS' => '$(inherited) SK_GL=1 SK_METAL=1',
     'CLANG_CXX_LANGUAGE_STANDARD' => 'c++17'
   }

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/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/spring/runSpring.ts

@@ -1,4 +1,4 @@
-import type { SkiaValue, SkiaAnimation } from "../../values/types";
+import type { SkiaMutableValue, SkiaAnimation } from "../../values/types";
 import type {
   AnimationParams,
   SpringConfig,
@@ -23,7 +23,7 @@ import { createSpringEasing } from "./functions/spring";
  * the animation.
  */
 export const runSpring = (
-  value: SkiaValue<number>,
+  value: SkiaMutableValue<number>,
   toOrParams: number | AnimationParams,
   config?: SpringConfig,
   callback?: AnimationCallback

package/src/animation/spring/useSpring.ts

@@ -1,4 +1,4 @@
-import type { SkiaReadonlyValue } from "../../values/types";
+import type { SkiaValue } from "../../values/types";
 import type {
   SpringConfig,
   AnimationParams,
@@ -20,7 +20,7 @@ export const useSpring = (
   toOrParams: number | AnimationParams,
   config?: SpringConfig,
   callback?: AnimationCallback
-): SkiaReadonlyValue<number> =>
+): SkiaValue<number> =>
   useTiming(
     toOrParams,
     createSpringEasing(config ?? Spring.Config.Default),

package/src/animation/timing/createTiming.ts

@@ -3,7 +3,7 @@ import type {
   RequiredAnimationParams,
   AnimationCallback,
 } from "../types";
-import type { AnimationState, SkiaValue } from "../../values/types";
+import type { AnimationState, SkiaMutableValue } from "../../values/types";
 import { ValueApi } from "../../values/api";
 
 import { timing } from "./functions";
@@ -24,7 +24,7 @@ import { timing } from "./functions";
  */
 export const createTiming = (
   params: RequiredAnimationParams & Required<TimingConfig>,
-  value?: SkiaValue<number>,
+  value?: SkiaMutableValue<number>,
   callback?: AnimationCallback
 ) => {
   // Update from to be either the declared from value,

package/src/animation/timing/runTiming.ts

@@ -1,4 +1,4 @@
-import type { SkiaValue, SkiaAnimation } from "../../values/types";
+import type { SkiaMutableValue, SkiaAnimation } from "../../values/types";
 import type {
   AnimationParams,
   TimingConfig,
@@ -21,7 +21,7 @@ import { createTiming } from "./createTiming";
  * the animation.
  */
 export const runTiming = (
-  value: SkiaValue<number>,
+  value: SkiaMutableValue<number>,
   toOrParams: number | AnimationParams,
   config?: TimingConfig,
   callback?: AnimationCallback

package/src/animation/timing/useTiming.ts

@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useRef } from "react";
 
-import type { SkiaReadonlyValue, SkiaAnimation } from "../../values/types";
+import type { SkiaValue, SkiaAnimation } from "../../values/types";
 import type {
   AnimationParams,
   TimingConfig,
@@ -22,7 +22,7 @@ export const useTiming = (
   toOrParams: number | AnimationParams,
   config?: TimingConfig,
   callback?: AnimationCallback
-): SkiaReadonlyValue<number> => {
+): SkiaValue<number> => {
   // Resolve parameters - keep a cached version to avoid
   // unnecesary re-renders.
   const prevCfgRef = useRef<ReturnType<typeof getResolvedParams>>();

package/src/index.ts

@@ -1,5 +1,4 @@
 import "./skia/NativeSetup";
-
 export * from "./renderer";
 export * from "./views";
 export * from "./skia";

package/src/renderer/Canvas.tsx

@@ -19,11 +19,10 @@ import ReactReconciler from "react-reconciler";
 
 import { SkiaView, useDrawCallback } from "../views";
 import type { TouchHandler } from "../views";
-import { Skia } from "../skia";
-import type { FontMgr } from "../skia/FontMgr/FontMgr";
+import { Skia, SkiaPaint } from "../skia";
+import type { FontMgr } from "../skia";
 import { useValue } from "../values/hooks/useValue";
-import type { SkiaReadonlyValue } from "../values/types";
-import { SkiaPaint } from "../skia/Paint/Paint";
+import type { SkiaValue } from "../values/types";
 
 import { debug as hostDebug, skHostConfig } from "./HostConfig";
 // import { debugTree } from "./nodes";
@@ -31,7 +30,7 @@ import { vec } from "./processors";
 import { Container } from "./nodes";
 import { DependencyManager } from "./DependencyManager";
 
-const CanvasContext = React.createContext<SkiaReadonlyValue<{
+const CanvasContext = React.createContext<SkiaValue<{
   width: number;
   height: number;
 }> | null>(null);