@shopify/react-native-skia 0.1.130 → 0.1.133

package/lib/module/views/useTouchHandler.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTouchHandler.ts"],"names":["useCallback","useRef","PixelRatio","TouchType","useTouchHandler","handlers","deps","prevTouchInfoRef","prevVelocityRef","x","y","history","forEach","touches","length","touch","timeDiffseconds","timestamp","current","distX","distY","type","Start","End","Cancelled","get","extendedTouchInfo","velocityX","velocityY","onStart","Active","onActive","onEnd"],"mappings":"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","sourcesContent":["import type { DependencyList } from \"react\";\nimport { useCallback, useRef } from \"react\";\nimport { PixelRatio } from \"react-native\";\n\nimport type {\n  ExtendedTouchInfo,\n  TouchHandlers,\n  TouchHandler,\n  TouchInfo,\n} from \"./types\";\nimport { TouchType } from \"./types\";\n\n/**\n * Provides a callback for handling touch events in the Skia View.\n * This touch handler only handles single taps.\n * @param handlers Callbacks for the different touch states\n * @param deps optional Dependency array to update the handlers\n * @returns A function that can be used from within the onDraw callback to\n * update and handle touch events. Call it with the touches property from\n * the info object.\n */\nexport const useTouchHandler = (\n  handlers: TouchHandlers,\n  deps: DependencyList = []\n): TouchHandler => {\n  const prevTouchInfoRef = useRef<TouchInfo>();\n  const prevVelocityRef = useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n  return useCallback((history: Array<Array<TouchInfo>>) => {\n    // Process all items in the current touch history\n    history.forEach((touches) => {\n      if (touches.length === 0) {\n        return;\n      }\n      // Get the next touch\n      const touch = touches[0];\n\n      // Calculate the velocity from the previous touch.\n      const timeDiffseconds =\n        touch.timestamp -\n        (prevTouchInfoRef.current?.timestamp ?? touch.timestamp);\n\n      const distX = touch.x - (prevTouchInfoRef.current?.x ?? touch.x);\n      const distY = touch.y - (prevTouchInfoRef.current?.y ?? touch.y);\n\n      if (\n        touch.type !== TouchType.Start &&\n        touch.type !== TouchType.End &&\n        touch.type !== TouchType.Cancelled\n      ) {\n        if (timeDiffseconds > 0) {\n          prevVelocityRef.current.x =\n            distX / timeDiffseconds / PixelRatio.get();\n          prevVelocityRef.current.y =\n            distY / timeDiffseconds / PixelRatio.get();\n        }\n      }\n\n      const extendedTouchInfo: ExtendedTouchInfo = {\n        ...touch,\n        velocityX: prevVelocityRef.current.x,\n        velocityY: prevVelocityRef.current.y,\n      };\n\n      // Save previous touch\n      prevTouchInfoRef.current = touch;\n\n      if (touch.type === TouchType.Start) {\n        prevVelocityRef.current.x = 0;\n        prevVelocityRef.current.y = 0;\n        handlers.onStart && handlers.onStart(touch);\n      } else if (touch.type === TouchType.Active) {\n        handlers.onActive && handlers.onActive(extendedTouchInfo);\n      } else {\n        handlers.onActive && handlers.onActive(extendedTouchInfo);\n        handlers.onEnd && handlers.onEnd(extendedTouchInfo);\n      }\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, deps);\n};\n"]}
+{"version":3,"sources":["useTouchHandler.ts"],"names":["useCallback","useRef","PixelRatio","TouchType","useInternalTouchHandler","handlers","deps","multiTouch","prevTouchInfoRef","prevVelocityRef","history","forEach","touches","i","length","touch","timeDiffseconds","timestamp","current","id","distX","x","distY","y","type","Start","End","Cancelled","get","extendedTouchInfo","velocityX","velocityY","onStart","Active","onActive","onEnd","useTouchHandler","useMultiTouchHandler"],"mappings":"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","sourcesContent":["import type { DependencyList } from \"react\";\nimport { useCallback, useRef } from \"react\";\nimport { PixelRatio } from \"react-native\";\n\nimport type {\n  ExtendedTouchInfo,\n  TouchHandlers,\n  TouchHandler,\n  TouchInfo,\n} from \"./types\";\nimport { TouchType } from \"./types\";\n\nconst useInternalTouchHandler = (\n  handlers: TouchHandlers,\n  deps: DependencyList = [],\n  multiTouch = false\n): TouchHandler => {\n  const prevTouchInfoRef = useRef<{ [key: number]: TouchInfo }>({});\n  const prevVelocityRef = useRef<{ [key: number]: { x: number; y: number } }>(\n    {}\n  );\n\n  return useCallback((history: Array<Array<TouchInfo>>) => {\n    // Process all items in the current touch history\n    history.forEach((touches) => {\n      // Enumerate touches\n      for (let i = 0; i < touches.length; i++) {\n        if (!multiTouch && i > 0) {\n          break;\n        }\n\n        const touch = touches[i];\n\n        // Calculate the velocity from the previous touch.\n        const timeDiffseconds =\n          touch.timestamp -\n          (prevTouchInfoRef.current[touch.id]?.timestamp ?? touch.timestamp);\n\n        const distX =\n          touch.x - (prevTouchInfoRef.current[touch.id]?.x ?? touch.x);\n        const distY =\n          touch.y - (prevTouchInfoRef.current[touch.id]?.y ?? touch.y);\n\n        if (\n          touch.type !== TouchType.Start &&\n          touch.type !== TouchType.End &&\n          touch.type !== TouchType.Cancelled\n        ) {\n          if (timeDiffseconds > 0) {\n            prevVelocityRef.current[touch.id] = {\n              x: distX / timeDiffseconds / PixelRatio.get(),\n              y: distY / timeDiffseconds / PixelRatio.get(),\n            };\n          }\n        }\n\n        const extendedTouchInfo: ExtendedTouchInfo = {\n          ...touch,\n          velocityX: prevVelocityRef.current[touch.id]?.x,\n          velocityY: prevVelocityRef.current[touch.id]?.y,\n        };\n\n        // Save previous touch\n        prevTouchInfoRef.current[touch.id] = touch;\n\n        if (touch.type === TouchType.Start) {\n          delete prevVelocityRef.current[touch.id];\n          handlers.onStart && handlers.onStart(touch);\n        } else if (touch.type === TouchType.Active) {\n          handlers.onActive && handlers.onActive(extendedTouchInfo);\n        } else {\n          handlers.onActive && handlers.onActive(extendedTouchInfo);\n          handlers.onEnd && handlers.onEnd(extendedTouchInfo);\n        }\n      }\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, deps);\n};\n\n/**\n * Provides a callback for handling touch events in the Skia View.\n * This touch handler only handles single touches.\n * @param handlers Callbacks for the different touch states\n * @param deps optional Dependency array to update the handlers\n * @returns A function that can be used from within the onDraw callback to\n * update and handle touch events. Call it with the touches property from\n * the info object.\n */\nexport const useTouchHandler = (\n  handlers: TouchHandlers,\n  deps: DependencyList = []\n): TouchHandler => {\n  return useInternalTouchHandler(handlers, deps, false);\n};\n\n/**\n * Provides a callback for handling touch events in the Skia View.\n * This touch handler handles multiple touches.\n * @param handlers Callbacks for the different touch states\n * @param deps optional Dependency array to update the handlers\n * @returns A function that can be used from within the onDraw callback to\n * update and handle touch events. Call it with the touches property from\n * the info object.\n */\nexport const useMultiTouchHandler = (\n  handlers: TouchHandlers,\n  deps: DependencyList = []\n): TouchHandler => {\n  return useInternalTouchHandler(handlers, deps, true);\n};\n"]}

package/lib/module/web/index.js

@@ -0,0 +1,10 @@
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-expect-error
+import CanvasKitInit from "canvaskit-wasm/bin/full/canvaskit";
+export const LoadSkia = async () => {
+  const CanvasKit = await CanvasKitInit(); // The CanvasKit API is stored on the global object and used
+  // to create the JsiSKApi in the Skia.web.ts file.
+
+  global.CanvasKit = CanvasKit;
+};
+//# sourceMappingURL=index.js.map

package/lib/module/web/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":["CanvasKitInit","LoadSkia","CanvasKit","global"],"mappings":"AAAA;AACA;AACA,OAAOA,aAAP,MAA0B,mCAA1B;AAOA,OAAO,MAAMC,QAAQ,GAAG,YAAY;AAClC,QAAMC,SAAS,GAAG,MAAMF,aAAa,EAArC,CADkC,CAElC;AACA;;AACAG,EAAAA,MAAM,CAACD,SAAP,GAAmBA,SAAnB;AACD,CALM","sourcesContent":["// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-expect-error\nimport CanvasKitInit from \"canvaskit-wasm/bin/full/canvaskit\";\nimport type { CanvasKit as CanvasKitType } from \"canvaskit-wasm\";\n\ndeclare global {\n  var CanvasKit: CanvasKitType;\n}\n\nexport const LoadSkia = async () => {\n  const CanvasKit = await CanvasKitInit();\n  // The CanvasKit API is stored on the global object and used\n  // to create the JsiSKApi in the Skia.web.ts file.\n  global.CanvasKit = CanvasKit;\n};\n"]}

package/lib/typescript/src/animation/functions/index.d.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/lib/typescript/src/animation/functions/interpolatePaths.d.ts

@@ -0,0 +1,17 @@
+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 declare const interpolatePaths: (value: number, input: number[], outputRange: SkPath[]) => SkPath;

package/lib/typescript/src/animation/functions/interpolateVector.d.ts

@@ -0,0 +1,10 @@
+import type { Vector } from "../../skia/types";
+import { interpolate } from "./interpolate";
+export declare const interpolateVector: (value: number, inputRange: readonly number[], outputRange: readonly Vector[], options?: Parameters<typeof interpolate>[3]) => {
+    x: number;
+    y: number;
+};
+export declare const mixVector: (value: number, from: Vector, to: Vector) => {
+    x: number;
+    y: number;
+};

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

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

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

@@ -3,25 +3,14 @@ import type { RefObject, ReactNode, ComponentProps } from "react";
 import ReactReconciler from "react-reconciler";
 import { SkiaView } from "../views";
 import type { TouchHandler } from "../views";
-import type { FontMgr } from "../skia";
-import type { SkiaValue } from "../values/types";
+import type { SkFontMgr } from "../skia/types";
 import { Container } from "./nodes";
-export declare const useCanvas: () => {
-    size: SkiaValue<{
-        width: number;
-        height: number;
-    }>;
-};
-export declare const useCanvasSize: () => SkiaValue<{
-    width: number;
-    height: number;
-}>;
 export declare const skiaReconciler: ReactReconciler.Reconciler<Container, import("./nodes").Node<unknown>, import("./nodes").Node<unknown>, import("./nodes").Node<unknown>, import("./nodes").Node<unknown>>;
 export declare const useCanvasRef: () => React.RefObject<SkiaView>;
 export interface CanvasProps extends ComponentProps<typeof SkiaView> {
     ref?: RefObject<SkiaView>;
     children: ReactNode;
     onTouch?: TouchHandler;
-    fontMgr?: FontMgr;
+    fontMgr?: SkFontMgr;
 }
-export declare const Canvas: React.ForwardRefExoticComponent<Pick<CanvasProps, "children" | "style" | "mode" | "debug" | "onDraw" | "hitSlop" | "onLayout" | "pointerEvents" | "removeClippedSubviews" | "testID" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "onTouch" | "fontMgr"> & React.RefAttributes<SkiaView>>;
+export declare const Canvas: React.ForwardRefExoticComponent<Pick<CanvasProps, "mode" | "debug" | "onDraw" | "children" | "hitSlop" | "onLayout" | "pointerEvents" | "removeClippedSubviews" | "style" | "testID" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "fontMgr" | "onTouch"> & React.RefAttributes<SkiaView>>;

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

@@ -1,12 +1,12 @@
 import type { RefObject } from "react";
 import type { DrawingInfo, SkiaView } from "../views";
-import type { FontMgr, SkCanvas, SkPaint } from "../skia";
-import type { Vector } from "./processors/math/Vector";
+import type { SkFontMgr, SkCanvas, SkPaint, Skia, Vector } from "../skia/types";
 export interface DrawingContext extends Omit<DrawingInfo, "touches"> {
     canvas: SkCanvas;
     paint: SkPaint;
     opacity: number;
     center: Vector;
     ref: RefObject<SkiaView>;
-    fontMgr: FontMgr;
+    fontMgr: SkFontMgr;
+    Skia: Skia;
 }

package/lib/typescript/src/renderer/components/Blend.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import { BlendMode } from "../../skia";
+import { BlendMode } from "../../skia/types";
 import type { AnimatedProps, SkEnum } from "../processors";
 interface BlendProps {
     mode: SkEnum<typeof BlendMode>;

package/lib/typescript/src/renderer/components/Group.d.ts

@@ -1,5 +1,5 @@
 import type { RefObject } from "react";
-import type { SkPaint } from "../../skia";
+import type { SkPaint } from "../../skia/types";
 import type { CustomPaintProps, TransformProps, AnimatedProps, ClipDef } from "../processors";
 export interface GroupProps extends CustomPaintProps, TransformProps {
     clip?: ClipDef;

package/lib/typescript/src/renderer/components/Paint.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from "react";
 import React from "react";
-import type { SkPaint } from "../../skia";
+import type { SkPaint } from "../../skia/types";
 import type { CustomPaintProps, AnimatedProps } from "../processors";
 export declare const usePaintRef: () => React.RefObject<SkPaint>;
 export interface PaintProps extends Omit<CustomPaintProps, "paint"> {

package/lib/typescript/src/renderer/components/Picture.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { SkPicture } from "../../skia";
+import type { SkPicture } from "../../skia/types";
 export interface PictureProps {
     picture: SkPicture;
 }

package/lib/typescript/src/renderer/components/colorFilters/BlendColor.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from "react";
-import type { Color } from "../../../skia";
-import { BlendMode } from "../../../skia";
+import type { Color } from "../../../skia/types";
+import { BlendMode } from "../../../skia/types";
 import type { SkEnum, AnimatedProps } from "../../processors";
 export interface BlendColorProps {
     mode: SkEnum<typeof BlendMode>;

package/lib/typescript/src/renderer/components/colorFilters/Compose.d.ts

@@ -1,3 +1,3 @@
-import type { SkColorFilter } from "../../../skia";
+import type { SkColorFilter, Skia } from "../../../skia/types";
 import type { DeclarationResult } from "../../nodes";
-export declare const composeColorFilter: (cf: SkColorFilter, children: DeclarationResult[]) => SkColorFilter | import("../../../skia").SkImageFilter;
+export declare const composeColorFilter: (Skia: Skia, cf: SkColorFilter, children: DeclarationResult[]) => import("../../../skia/types").SkImageFilter | SkColorFilter;

package/lib/typescript/src/renderer/components/image/BoxFit.d.ts

@@ -1,4 +1,4 @@
-import type { SkRect } from "../../../skia";
+import type { SkRect } from "../../../skia/types";
 export declare type Fit = "cover" | "contain" | "fill" | "fitHeight" | "fitWidth" | "none" | "scaleDown";
 export interface Size {
     width: number;
@@ -18,6 +18,16 @@ export declare const rect2rect: (src: SkRect, dst: SkRect) => readonly [{
     readonly scaleY: number;
 }];
 export declare const fitRects: (fit: Fit, rect: SkRect, { x, y, width, height }: SkRect) => {
-    src: SkRect;
-    dst: SkRect;
+    src: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
+    dst: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
 };

package/lib/typescript/src/renderer/components/image/Image.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { SkImage } from "../../../skia";
+import type { SkImage } from "../../../skia/types";
 import type { CustomPaintProps, RectDef, AnimatedProps } from "../../processors";
 import type { Fit } from "./BoxFit";
 export declare type SourceImageProps = {

package/lib/typescript/src/renderer/components/image/ImageSVG.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { SkSVG } from "../../../skia";
+import type { SkSVG } from "../../../skia/types";
 import type { AnimatedProps, RectDef } from "../../processors";
 export declare type ImageSVGProps = RectDef & {
     svg: SkSVG;

package/lib/typescript/src/renderer/components/image/ImageShader.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import type { SkRect, SkImage } from "../../../skia";
-import { TileMode, FilterMode, MipmapMode } from "../../../skia";
+import type { SkRect, SkImage } from "../../../skia/types";
+import { TileMode, FilterMode, MipmapMode } from "../../../skia/types";
 import type { TransformProps, SkEnum, AnimatedProps, RectCtor } from "../../processors";
 import type { Fit } from "./BoxFit";
 interface ImageShaderProps extends TransformProps, Partial<RectCtor> {

package/lib/typescript/src/renderer/components/imageFilters/Blur.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import { TileMode } from "../../../skia";
+import { TileMode } from "../../../skia/types";
 import type { Radius, SkEnum } from "../../processors";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
 export interface BlurProps {

package/lib/typescript/src/renderer/components/imageFilters/DisplacementMap.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import { ColorChannel } from "../../../skia";
+import { ColorChannel } from "../../../skia/types";
 import type { SkEnum, AnimatedProps } from "../../processors";
 export interface DisplacementMapProps {
     channelX: SkEnum<typeof ColorChannel>;

package/lib/typescript/src/renderer/components/imageFilters/InnerShadow.d.ts

@@ -1,2 +1,2 @@
-import type { SkColor, SkImageFilter } from "../../../skia";
-export declare const MakeInnerShadow: (shadowOnly: boolean | undefined, dx: number, dy: number, sigmaX: number, sigmaY: number, color: SkColor, input: SkImageFilter | null) => SkImageFilter;
+import type { SkColor, Skia, SkImageFilter } from "../../../skia/types";
+export declare const MakeInnerShadow: (Skia: Skia, shadowOnly: boolean | undefined, dx: number, dy: number, sigmaX: number, sigmaY: number, color: SkColor, input: SkImageFilter | null) => SkImageFilter;

package/lib/typescript/src/renderer/components/imageFilters/RuntimeShader.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
 import type { AnimatedProps } from "../../processors/Animations/Animations";
-import type { SkRuntimeEffect } from "../../../skia";
+import type { SkRuntimeEffect, Uniforms } from "../../../skia/types";
 export interface RuntimeShaderProps {
     source: SkRuntimeEffect;
+    uniforms?: Uniforms;
 }
 export declare const RuntimeShader: (props: AnimatedProps<RuntimeShaderProps>) => JSX.Element;

package/lib/typescript/src/renderer/components/imageFilters/Shadow.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { AnimatedProps } from "../../processors/Animations/Animations";
-import type { Color } from "../../../skia";
+import type { Color } from "../../../skia/types";
 export interface ShadowProps {
     dx: number;
     dy: number;

package/lib/typescript/src/renderer/components/imageFilters/getInput.d.ts

@@ -1,2 +1,3 @@
 import type { DeclarationResult } from "../../nodes";
-export declare const getInput: (children: DeclarationResult[]) => import("../../../skia").SkImageFilter | null;
+import type { Skia } from "../../../skia/types";
+export declare const getInput: (Skia: Skia, children: DeclarationResult[]) => import("../../../skia/types").SkImageFilter | null;

package/lib/typescript/src/renderer/components/maskFilters/Blur.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { BlurStyle } from "../../../skia";
+import { BlurStyle } from "../../../skia/types";
 import type { SkEnum } from "../../processors";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
 export interface BlurMaskProps {

package/lib/typescript/src/renderer/components/pathEffects/Line2D.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from "react";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
-import type { SkMatrix } from "../../../skia";
+import type { SkMatrix } from "../../../skia/types";
 export interface Line2DPathEffectProps {
     children?: ReactNode | ReactNode[];
     width: number;

package/lib/typescript/src/renderer/components/pathEffects/Path1D.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import { Path1DEffectStyle } from "../../../skia";
+import { Path1DEffectStyle } from "../../../skia/types";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
 import type { SkEnum } from "../../processors/Paint";
 import type { PathDef } from "../../processors/Paths";

package/lib/typescript/src/renderer/components/pathEffects/Path2D.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from "react";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
-import type { SkMatrix } from "../../../skia";
+import type { SkMatrix } from "../../../skia/types";
 import type { PathDef } from "../../processors/Paths";
 export interface Path2DPathEffectProps {
     children?: ReactNode | ReactNode[];

package/lib/typescript/src/renderer/components/shaders/Color.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { AnimatedProps } from "../../processors";
-import type { Color } from "../../../skia";
+import type { Color } from "../../../skia/types";
 export interface ColorShaderProps {
     color: Color;
 }

package/lib/typescript/src/renderer/components/shaders/Gradient.d.ts

@@ -1,17 +1,17 @@
-import { TileMode } from "../../../skia";
+import { TileMode } from "../../../skia/types";
 import type { SkEnum } from "../../processors/Paint";
 import type { TransformProps } from "../../processors/Transform";
-import type { Color } from "../../../skia";
+import type { Color, Skia } from "../../../skia/types";
 export interface GradientProps extends TransformProps {
     colors: Color[];
     positions?: number[];
     mode?: SkEnum<typeof TileMode>;
     flags?: number;
 }
-export declare const processGradientProps: ({ colors, positions, mode, flags, ...transform }: GradientProps) => {
+export declare const processGradientProps: (Skia: Skia, { colors, positions, mode, flags, ...transform }: GradientProps) => {
     colors: Float32Array[];
     positions: number[] | null;
     mode: TileMode;
     flags: number | undefined;
-    localMatrix: import("../../../skia").SkMatrix | undefined;
+    localMatrix: import("../../../skia/types").SkMatrix | undefined;
 };

package/lib/typescript/src/renderer/components/shaders/LinearGradient.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-import type { Vector, AnimatedProps } from "../../processors";
+import type { AnimatedProps } from "../../processors";
+import type { Vector } from "../../../skia/types";
 import type { GradientProps } from "./Gradient";
 export interface LinearGradientProps extends GradientProps {
     start: Vector;

package/lib/typescript/src/renderer/components/shaders/RadialGradient.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-import type { Vector, AnimatedProps } from "../../processors";
+import type { AnimatedProps } from "../../processors";
+import type { Vector } from "../../../skia/types";
 import type { GradientProps } from "./Gradient";
 export interface RadialGradientProps extends GradientProps {
     c: Vector;

package/lib/typescript/src/renderer/components/shaders/Shader.d.ts

@@ -1,11 +1,6 @@
 import type { ReactNode } from "react";
-import type { SkRuntimeEffect } from "../../../skia";
-import type { Vector, AnimatedProps, TransformProps } from "../../processors";
-declare type UniformValue = number | Vector | readonly number[];
-declare type Uniform = UniformValue | readonly UniformValue[];
-interface Uniforms {
-    [name: string]: Uniform;
-}
+import type { SkRuntimeEffect, Uniforms } from "../../../skia/types";
+import type { AnimatedProps, TransformProps } from "../../processors";
 export interface ShaderProps extends TransformProps {
     source: SkRuntimeEffect;
     uniforms: Uniforms;
@@ -17,4 +12,3 @@ export declare const Shader: {
         uniforms: never[];
     };
 };
-export {};

package/lib/typescript/src/renderer/components/shaders/SweepGradient.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-import type { Vector, AnimatedProps } from "../../processors";
+import type { AnimatedProps } from "../../processors";
+import type { Vector } from "../../../skia/types";
 import type { GradientProps } from "./Gradient";
 export interface SweepGradientProps extends GradientProps {
     c: Vector;

package/lib/typescript/src/renderer/components/shaders/TwoPointConicalGradient.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-import type { Vector, AnimatedProps } from "../../processors";
+import type { AnimatedProps } from "../../processors";
+import type { Vector } from "../../../skia/types";
 import type { GradientProps } from "./Gradient";
 export interface TwoPointConicalGradientProps extends GradientProps {
     start: Vector;

package/lib/typescript/src/renderer/components/shapes/Box.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { Color, SkRRect, SkRect } from "../../../skia";
+import type { Color, SkRRect, SkRect } from "../../../skia/types";
 import type { AnimatedProps, CustomPaintProps } from "../../processors";
 interface BoxShadowProps {
     dx?: number;

package/lib/typescript/src/renderer/components/shapes/Circle.d.ts

@@ -4,6 +4,9 @@ export declare type CircleProps = CircleDef & CustomPaintProps;
 export declare const Circle: {
     (props: AnimatedProps<CircleProps>): JSX.Element;
     defaultProps: {
-        c: import("../../..").SkPoint;
+        c: {
+            x: number;
+            y: number;
+        };
     };
 };

package/lib/typescript/src/renderer/components/shapes/DiffRect.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { CustomPaintProps } from "../../processors";
-import type { SkRRect } from "../../../skia";
+import type { SkRRect } from "../../../skia/types";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
 export interface DiffRectProps extends CustomPaintProps {
     inner: SkRRect;

package/lib/typescript/src/renderer/components/shapes/FitBox.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from "react";
 import type { Fit } from "../image";
-import type { SkRect } from "../../../skia";
+import type { SkRect } from "../../../skia/types";
 interface FitProps {
     fit: Fit;
     src: SkRect;

package/lib/typescript/src/renderer/components/shapes/Line.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-import type { CustomPaintProps, Vector, AnimatedProps } from "../../processors";
+import type { CustomPaintProps, AnimatedProps } from "../../processors";
+import type { Vector } from "../../../skia/types";
 export interface LineProps extends CustomPaintProps {
     p1: Vector;
     p2: Vector;

package/lib/typescript/src/renderer/components/shapes/Patch.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import type { CustomPaintProps, SkEnum, Vector, AnimatedProps } from "../../processors";
-import type { SkPoint, Color } from "../../../skia";
-import { BlendMode } from "../../../skia";
+import type { CustomPaintProps, SkEnum, AnimatedProps } from "../../processors";
+import type { SkPoint, Color, Vector } from "../../../skia/types";
+import { BlendMode } from "../../../skia/types";
 export interface CubicBezierHandle {
     pos: Vector;
     c1: Vector;

package/lib/typescript/src/renderer/components/shapes/Path.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { CustomPaintProps, AnimatedProps, PathDef, SkEnum } from "../../processors";
-import { FillType } from "../../../skia";
+import { FillType } from "../../../skia/types";
 interface StrokeOpts {
     width?: number;
     strokeMiterlimit?: number;

package/lib/typescript/src/renderer/components/shapes/Points.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { CustomPaintProps, SkEnum } from "../../processors";
-import type { SkPoint } from "../../../skia";
-import { PointMode } from "../../../skia";
+import type { SkPoint } from "../../../skia/types";
+import { PointMode } from "../../../skia/types";
 import type { AnimatedProps } from "../../processors/Animations/Animations";
 export interface PointsProps extends CustomPaintProps {
     points: SkPoint[];

package/lib/typescript/src/renderer/components/shapes/Vertices.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { CustomPaintProps, SkEnum, AnimatedProps } from "../../processors";
-import type { SkPoint } from "../../../skia";
-import { BlendMode, VertexMode } from "../../../skia";
+import type { SkPoint } from "../../../skia/types";
+import { BlendMode, VertexMode } from "../../../skia/types";
 export interface VerticesProps extends CustomPaintProps {
     colors?: string[];
     vertices: SkPoint[];

package/lib/typescript/src/renderer/components/text/Glyphs.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { CustomPaintProps, AnimatedProps } from "../../processors";
-import type { SkPoint } from "../../../skia";
+import type { SkPoint } from "../../../skia/types";
 import type { FontDef } from "../../processors/Font";
 export interface Glyph {
     id: number;

package/lib/typescript/src/renderer/components/text/TextBlob.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { CustomPaintProps, AnimatedProps } from "../../processors";
-import type { SkTextBlob } from "../../../skia";
+import type { SkTextBlob } from "../../../skia/types";
 export interface TextBlobProps extends CustomPaintProps {
     blob: SkTextBlob;
     x: number;

package/lib/typescript/src/renderer/components/text/TextPath.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { CustomPaintProps, AnimatedProps } from "../../processors";
-import type { SkPath } from "../../../skia";
+import type { SkPath } from "../../../skia/types";
 import type { FontDef } from "../../processors/Font";
 export declare type TextPathProps = CustomPaintProps & FontDef & {
     text: string;

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

@@ -1,5 +1,5 @@
-export * from "./Canvas";
 export * from "./components";
 export * from "./nodes";
 export * from "./useContextBridge";
 export * from "./DependencyManager";
+export * from "./useCanvas";

package/lib/typescript/src/renderer/nodes/Declaration.d.ts

@@ -2,7 +2,7 @@ import type { DependencyList } from "react";
 import type { DrawingContext } from "../DrawingContext";
 import type { AnimatedProps } from "../processors";
 import type { DependencyManager } from "../DependencyManager";
-import type { SkJSIInstance } from "../../skia";
+import type { SkJSIInstance } from "../../skia/types";
 import { Node } from "./Node";
 export declare type DeclarationResult = SkJSIInstance<string> | null;
 declare type DeclarationCallback<T> = (props: T, children: DeclarationResult[], ctx: DrawingContext) => DeclarationResult;

package/lib/typescript/src/renderer/nodes/Node.d.ts

@@ -1,4 +1,4 @@
-import type { SkJSIInstance } from "../../skia";
+import type { SkJSIInstance } from "../../skia/types";
 import type { DependencyManager } from "../DependencyManager";
 import type { DrawingContext } from "../DrawingContext";
 import type { AnimatedProps } from "../processors";

package/lib/typescript/src/renderer/processors/Animations/Animations.d.ts

@@ -1,6 +1,4 @@
 import type { SkiaValue } from "../../../values";
-import type { DrawingContext } from "../../DrawingContext";
-export declare type FrameValue<T> = (ctx: DrawingContext) => T;
 export declare const isValue: (value: unknown) => value is SkiaValue<unknown>;
 export declare const isAnimated: <T>(props: AnimatedProps<T>) => boolean;
 export declare const materialize: <T>(props: AnimatedProps<T>) => T;