@shopify/react-native-skia 0.1.128 → 0.1.129

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/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "React Native Skia",
-  "version": "0.1.128",
+  "version": "0.1.129",
   "description": "High-performance React Native Graphics using Skia",
   "main": "lib/module/index.js",
   "files": [
@@ -35,7 +35,7 @@
     "tsc": "tsc --noEmit",
     "lint": "eslint . --ext .ts,.tsx  --max-warnings 0",
     "test": "jest",
-    "postinstall": "node scripts/install-npm.js",
+    "postinstall": "node scripts/install-npm.js && patch-package",
     "build": "bob build"
   },
   "repository": {
@@ -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/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);

package/src/renderer/DependencyManager.tsx

@@ -1,7 +1,7 @@
 import type { RefObject } from "react";
 
 import type { SkiaView } from "../views";
-import type { SkiaReadonlyValue } from "../values";
+import type { SkiaValue } from "../values";
 
 import { isValue } from "./processors";
 import type { Node } from "./nodes";
@@ -13,7 +13,7 @@ export class DependencyManager {
   ref: RefObject<SkiaView>;
   subscriptions: Map<
     Node,
-    { values: SkiaReadonlyValue<unknown>[]; unsubscribe: null | Unsubscribe }
+    { values: SkiaValue<unknown>[]; unsubscribe: null | Unsubscribe }
   > = new Map();
 
   constructor(ref: RefObject<SkiaView>) {

package/src/renderer/DrawingContext.ts

@@ -1,8 +1,7 @@
 import type { RefObject } from "react";
 
 import type { DrawingInfo, SkiaView } from "../views";
-import type { SkCanvas, SkPaint } from "../skia";
-import type { FontMgr } from "../skia/FontMgr/FontMgr";
+import type { FontMgr, SkCanvas, SkPaint } from "../skia";
 
 import type { Vector } from "./processors/math/Vector";
 

package/src/renderer/components/Blend.tsx

@@ -1,10 +1,9 @@
 import type { ReactNode } from "react";
 import React from "react";
 
-import { isImageFilter, Skia, BlendMode } from "../../skia";
+import { isImageFilter, Skia, BlendMode, isShader } from "../../skia";
 import { createDeclaration } from "../nodes";
 import type { AnimatedProps, SkEnum } from "../processors";
-import { isShader } from "../../skia/Shader/Shader";
 import { enumKey } from "../processors/Paint";
 
 interface BlendProps {

package/src/renderer/components/Compose.tsx

@@ -1,11 +1,9 @@
 import React from "react";
 import type { ReactNode } from "react";
 
-import { Skia } from "../../skia";
+import { Skia, isImageFilter, isColorFilter } from "../../skia";
 import { createDeclaration } from "../nodes/Declaration";
 import type { AnimatedProps } from "../processors/Animations/Animations";
-import { isColorFilter } from "../../skia/ColorFilter/ColorFilter";
-import { isImageFilter } from "../../skia/ImageFilter/ImageFilter";
 
 export interface ComposeProps {
   children: ReactNode | ReactNode[];

package/src/renderer/components/colorFilters/Lerp.tsx

@@ -1,10 +1,9 @@
 import React from "react";
 import type { ReactNode } from "react";
 
-import { Skia } from "../../../skia";
+import { Skia, isColorFilter } from "../../../skia";
 import { createDeclaration } from "../../nodes/Declaration";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
-import { isColorFilter } from "../../../skia/ColorFilter/ColorFilter";
 
 import { composeColorFilter } from "./Compose";
 

package/src/renderer/components/imageFilters/DisplacementMap.tsx

@@ -1,11 +1,10 @@
 import React from "react";
 import type { ReactNode } from "react";
 
-import { Skia } from "../../../skia";
+import { Skia, ColorChannel } from "../../../skia";
 import { createDeclaration } from "../../nodes";
 import type { SkEnum, AnimatedProps } from "../../processors";
 import { enumKey } from "../../processors";
-import { ColorChannel } from "../../../skia/ImageFilter/ImageFilterFactory";
 
 import { getInput } from "./getInput";
 

package/src/renderer/components/imageFilters/InnerShadow.tsx

@@ -1,6 +1,5 @@
-import type { SkColor } from "../../../skia";
+import type { SkColor, SkImageFilter } from "../../../skia";
 import { BlendMode, Skia, TileMode } from "../../../skia";
-import type { SkImageFilter } from "../../../skia/ImageFilter/ImageFilter";
 
 const Black = Skia.Color("black");
 

package/src/renderer/components/imageFilters/RuntimeShader.tsx

@@ -3,7 +3,7 @@ import React from "react";
 import { Skia } from "../../../skia";
 import { createDeclaration } from "../../nodes/Declaration";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
-import type { SkRuntimeEffect } from "../../../skia/RuntimeEffect/RuntimeEffect";
+import type { SkRuntimeEffect } from "../../../skia";
 
 import { getInput } from "./getInput";
 

package/src/renderer/components/imageFilters/Shadow.tsx

@@ -1,10 +1,9 @@
 import React from "react";
 
-import { Skia } from "../../../skia";
+import { Skia, processColor } from "../../../skia";
 import { createDeclaration } from "../../nodes/Declaration";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
-import type { Color } from "../../../skia/Color";
-import { processColor } from "../../../skia/Color";
+import type { Color } from "../../../skia";
 
 import { getInput } from "./getInput";
 import { MakeInnerShadow } from "./InnerShadow";

package/src/renderer/components/maskFilters/Blur.tsx

@@ -1,7 +1,6 @@
 import React from "react";
 
-import { BlurStyle } from "../../../skia/MaskFilter";
-import { Skia } from "../../../skia";
+import { BlurStyle, Skia } from "../../../skia";
 import { createDeclaration } from "../../nodes/Declaration";
 import type { SkEnum } from "../../processors";
 import { enumKey } from "../../processors";

package/src/renderer/components/pathEffects/Corner.tsx

@@ -1,10 +1,9 @@
 import type { ReactNode } from "react";
 import React from "react";
 
-import { Skia } from "../../../skia";
+import { Skia, isPathEffect } from "../../../skia";
 import { createDeclaration } from "../../nodes/Declaration";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
-import { isPathEffect } from "../../../skia/PathEffect";
 
 export interface CornerPathEffectProps {
   r: number;