react-native-skia 2.15.0 → 3.0.0

package/lib/commonjs/renderer/Canvas.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useCanvasSize = exports.useCanvasRef = exports.Canvas = void 0;
+exports.useCanvasSize = exports.useCanvasRoot = exports.useCanvasRef = exports.Canvas = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _ReanimatedProxy = _interopRequireDefault(require("../external/reanimated/ReanimatedProxy"));
 var _SkiaViewNativeId = require("../views/SkiaViewNativeId");
@@ -47,18 +47,17 @@ exports.useCanvasSize = useCanvasSize;
 // Anything else reaching the native component would hit the generated
 // string-enum parser, which aborts on unknown values.
 const resolveSurfaceType = surfaceType => surfaceType === "SurfaceView" || surfaceType === "TextureView" ? surfaceType : "auto";
-const Canvas = ({
-  debug,
-  opaque,
+
+/**
+ * What every canvas shares, whichever native view it renders into: the native
+ * id, the scene graph root rendered into it, the `onSize` measurement and the
+ * imperative handle of the ref.
+ */
+const useCanvasRoot = ({
   children,
   onSize,
-  colorSpace = "p3",
-  highBitDepth = false,
-  androidWarmup = false,
-  android,
   ref,
-  onLayout,
-  ...viewProps
+  onLayout
 }) => {
   if (onLayout && _Platform.Platform.OS !== "web") {
     console.error("<Canvas onLayout={onLayout} /> is not supported on the new architecture, to fix the issue, see: https://shopify.github.io/react-native-skia/docs/canvas/overview/#getting-the-canvas-size");
@@ -138,6 +137,34 @@ const Canvas = ({
       (_viewRef$current3 = viewRef.current) === null || _viewRef$current3 === void 0 || _viewRef$current3.measureInWindow(callback);
     }
   }));
+  return {
+    nativeId,
+    viewRef
+  };
+};
+exports.useCanvasRoot = useCanvasRoot;
+const Canvas = ({
+  debug,
+  opaque,
+  children,
+  onSize,
+  colorSpace = "p3",
+  highBitDepth = false,
+  androidWarmup = false,
+  android,
+  ref,
+  onLayout,
+  ...viewProps
+}) => {
+  const {
+    nativeId,
+    viewRef
+  } = useCanvasRoot({
+    children,
+    onSize,
+    ref,
+    onLayout
+  });
   const onLayoutWeb = (0, _react.useCallback)(e => {
     if (onLayout) {
       onLayout(e);

package/lib/commonjs/renderer/Canvas.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_ReanimatedProxy","_interopRequireDefault","_SkiaViewNativeId","_SkiaPictureViewNativeComponent","_Reconciler","_skia","_Platform","_external","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","useCanvasRef","useRef","exports","useReanimatedFrame","HAS_REANIMATED_3","Rea","useFrameCallback","measure","useCanvasRefPriv","useAnimatedRef","useCanvasSize","userRef","ourRef","ref","size","setSize","useState","width","height","useLayoutEffect","current","_x","_y","resolveSurfaceType","surfaceType","Canvas","debug","opaque","children","onSize","colorSpace","highBitDepth","androidWarmup","android","onLayout","viewProps","Platform","OS","console","error","viewRef","nativeId","useMemo","SkiaViewNativeId","root","SkiaSGRoot","Skia","_viewRef$current","result","canvasRef","value","render","useEffect","unmount","useImperativeHandle","makeImageSnapshot","rect","SkiaViewApi","makeImageSnapshotAsync","redraw","requestRedraw","getNativeId","callback","_viewRef$current2","measureInWindow","_viewRef$current3","onLayoutWeb","useCallback","nativeEvent","layout","createElement","collapsable","nativeID","androidSurfaceType","androidZOrderOnTop","zOrderOnTop"],"sources":["Canvas.tsx"],"sourcesContent":["import type { FC, RefObject } from \"react\";\nimport React, {\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport type {\n  LayoutChangeEvent,\n  MeasureInWindowOnSuccessCallback,\n  MeasureOnSuccessCallback,\n  View,\n  ViewProps,\n} from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport Rea from \"../external/reanimated/ReanimatedProxy\";\nimport { SkiaViewNativeId } from \"../views/SkiaViewNativeId\";\nimport type { AndroidCanvasProps, AndroidSurfaceType } from \"../views/types\";\nimport SkiaPictureViewNativeComponent from \"../specs/SkiaPictureViewNativeComponent\";\nimport type { SkImage, SkRect, SkSize } from \"../skia/types\";\nimport { SkiaSGRoot } from \"../sksg/Reconciler\";\nimport { Skia } from \"../skia\";\nimport { Platform } from \"../Platform\";\nimport { HAS_REANIMATED_3 } from \"../external\";\n\nexport interface CanvasRef extends FC<CanvasProps> {\n  makeImageSnapshot(rect?: SkRect): SkImage;\n  makeImageSnapshotAsync(rect?: SkRect): Promise<SkImage>;\n  redraw(): void;\n  getNativeId(): number;\n  measure(callback: MeasureOnSuccessCallback): void;\n  measureInWindow(callback: MeasureInWindowOnSuccessCallback): void;\n}\n\nexport const useCanvasRef = () => useRef<CanvasRef>(null);\n\nconst useReanimatedFrame = !HAS_REANIMATED_3 ? () => {} : Rea.useFrameCallback;\nconst measure = !HAS_REANIMATED_3 ? null : Rea.measure;\n\nconst useCanvasRefPriv: typeof useRef<View> = !HAS_REANIMATED_3\n  ? useRef\n  : Rea.useAnimatedRef;\n\nexport const useCanvasSize = (userRef?: RefObject<CanvasRef | null>) => {\n  const ourRef = useCanvasRef();\n  const ref = userRef ?? ourRef;\n  const [size, setSize] = useState<SkSize>({ width: 0, height: 0 });\n  useLayoutEffect(() => {\n    if (ref.current) {\n      ref.current.measure((_x, _y, width, height) => {\n        setSize({ width, height });\n      });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n  return { ref, size };\n};\n\nexport interface CanvasProps extends Omit<ViewProps, \"onLayout\"> {\n  debug?: boolean;\n  /** @deprecated Not supported on native. Use `onSize` or `useCanvasSize()` instead. */\n  onLayout?: ViewProps[\"onLayout\"];\n  /**\n   * Declares that the canvas covers every pixel of its bounds, so nothing\n   * behind it needs to show through. On Android an opaque canvas is backed by\n   * a `SurfaceView` by default, the cheapest path (see `android.surfaceType`).\n   * Defaults to false.\n   */\n  opaque?: boolean;\n  onSize?: SharedValue<SkSize>;\n  colorSpace?: \"p3\" | \"srgb\";\n  /**\n   * Renders into a surface with more than 8 bits per channel (16-bit float on\n   * iOS, 10-bit on Android) to avoid banding in subtle gradients. Colors are\n   * identical to the default 8-bit surface, only with more precision (this is\n   * about bit depth, not HDR). On Android the extra precision survives\n   * composition only when combined with `opaque`, and the prop must be set\n   * before the canvas is mounted.\n   */\n  highBitDepth?: boolean;\n  /** Android-only rendering options. Ignored on iOS and web. */\n  android?: AndroidCanvasProps;\n  ref?: React.Ref<CanvasRef>;\n  androidWarmup?: boolean;\n  __destroyWebGLContextAfterRender?: boolean;\n}\n\n// Anything else reaching the native component would hit the generated\n// string-enum parser, which aborts on unknown values.\nconst resolveSurfaceType = (\n  surfaceType: AndroidSurfaceType | undefined\n): \"auto\" | AndroidSurfaceType =>\n  surfaceType === \"SurfaceView\" || surfaceType === \"TextureView\"\n    ? surfaceType\n    : \"auto\";\n\nexport const Canvas = ({\n  debug,\n  opaque,\n  children,\n  onSize,\n  colorSpace = \"p3\",\n  highBitDepth = false,\n  androidWarmup = false,\n  android,\n  ref,\n  onLayout,\n  ...viewProps\n}: CanvasProps) => {\n  if (onLayout && Platform.OS !== \"web\") {\n    console.error(\n      \"<Canvas onLayout={onLayout} /> is not supported on the new architecture, to fix the issue, see: https://shopify.github.io/react-native-skia/docs/canvas/overview/#getting-the-canvas-size\"\n    );\n  }\n  const viewRef = useCanvasRefPriv(null);\n  // Native ID\n  const nativeId = useMemo(() => {\n    return SkiaViewNativeId.current++;\n  }, []);\n\n  // Root\n  const root = useMemo(() => new SkiaSGRoot(Skia, nativeId), [nativeId]);\n\n  useReanimatedFrame(() => {\n    \"worklet\";\n    if (onSize && measure) {\n      const result =\n        // eslint-disable-next-line no-nested-ternary\n        Platform.OS === \"web\"\n          ? // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-expect-error\n            viewRef.current?.canvasRef\n            ? // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n              // @ts-expect-error\n              measure(viewRef.current.canvasRef)\n            : { width: 0, height: 0 }\n          : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            measure(viewRef as any);\n      if (result) {\n        const { width, height } = result;\n        if (onSize.value.width !== width || onSize.value.height !== height) {\n          onSize.value = { width, height };\n        }\n      }\n    }\n  }, !!onSize);\n\n  // Render effects\n  useLayoutEffect(() => {\n    root.render(children);\n  }, [children, root, nativeId]);\n\n  useEffect(() => {\n    return () => {\n      root.unmount();\n    };\n  }, [root]);\n\n  // Component methods\n  useImperativeHandle(\n    ref,\n    () =>\n      ({\n        makeImageSnapshot: (rect?: SkRect) => {\n          return SkiaViewApi.makeImageSnapshot(nativeId, rect);\n        },\n        makeImageSnapshotAsync: (rect?: SkRect) => {\n          return SkiaViewApi.makeImageSnapshotAsync(nativeId, rect);\n        },\n        redraw: () => {\n          SkiaViewApi.requestRedraw(nativeId);\n        },\n        getNativeId: () => {\n          return nativeId;\n        },\n        measure: (callback) => {\n          viewRef.current?.measure(callback);\n        },\n        measureInWindow: (callback) => {\n          viewRef.current?.measureInWindow(callback);\n        },\n      }) as CanvasRef\n  );\n\n  const onLayoutWeb = useCallback(\n    (e: LayoutChangeEvent) => {\n      if (onLayout) {\n        onLayout(e);\n      }\n      if (Platform.OS === \"web\" && onSize) {\n        const { width, height } = e.nativeEvent.layout;\n        onSize.value = { width, height };\n      }\n    },\n    [onLayout, onSize]\n  );\n  return (\n    <SkiaPictureViewNativeComponent\n      ref={viewRef}\n      collapsable={false}\n      nativeID={`${nativeId}`}\n      debug={debug}\n      opaque={opaque}\n      colorSpace={colorSpace}\n      highBitDepth={highBitDepth}\n      androidWarmup={androidWarmup}\n      androidSurfaceType={resolveSurfaceType(android?.surfaceType)}\n      androidZOrderOnTop={!!android?.zOrderOnTop}\n      onLayout={\n        Platform.OS === \"web\" && (onSize || onLayout) ? onLayoutWeb : onLayout\n      }\n      {...viewProps}\n    />\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_ReanimatedProxy","_interopRequireDefault","_SkiaViewNativeId","_SkiaPictureViewNativeComponent","_Reconciler","_skia","_Platform","_external","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","useCanvasRef","useRef","exports","useReanimatedFrame","HAS_REANIMATED_3","Rea","useFrameCallback","measure","useCanvasRefPriv","useAnimatedRef","useCanvasSize","userRef","ourRef","ref","size","setSize","useState","width","height","useLayoutEffect","current","_x","_y","resolveSurfaceType","surfaceType","useCanvasRoot","children","onSize","onLayout","Platform","OS","console","error","viewRef","nativeId","useMemo","SkiaViewNativeId","root","SkiaSGRoot","Skia","_viewRef$current","result","canvasRef","value","render","useEffect","unmount","useImperativeHandle","makeImageSnapshot","rect","SkiaViewApi","makeImageSnapshotAsync","redraw","requestRedraw","getNativeId","callback","_viewRef$current2","measureInWindow","_viewRef$current3","Canvas","debug","opaque","colorSpace","highBitDepth","androidWarmup","android","viewProps","onLayoutWeb","useCallback","nativeEvent","layout","createElement","collapsable","nativeID","androidSurfaceType","androidZOrderOnTop","zOrderOnTop"],"sources":["Canvas.tsx"],"sourcesContent":["import type { FC, RefObject } from \"react\";\nimport React, {\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport type {\n  LayoutChangeEvent,\n  MeasureInWindowOnSuccessCallback,\n  MeasureOnSuccessCallback,\n  View,\n  ViewProps,\n} from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport Rea from \"../external/reanimated/ReanimatedProxy\";\nimport { SkiaViewNativeId } from \"../views/SkiaViewNativeId\";\nimport type { AndroidCanvasProps, AndroidSurfaceType } from \"../views/types\";\nimport SkiaPictureViewNativeComponent from \"../specs/SkiaPictureViewNativeComponent\";\nimport type { SkImage, SkRect, SkSize } from \"../skia/types\";\nimport { SkiaSGRoot } from \"../sksg/Reconciler\";\nimport { Skia } from \"../skia\";\nimport { Platform } from \"../Platform\";\nimport { HAS_REANIMATED_3 } from \"../external\";\n\nexport interface CanvasRef extends FC<CanvasProps> {\n  makeImageSnapshot(rect?: SkRect): SkImage;\n  makeImageSnapshotAsync(rect?: SkRect): Promise<SkImage>;\n  redraw(): void;\n  getNativeId(): number;\n  measure(callback: MeasureOnSuccessCallback): void;\n  measureInWindow(callback: MeasureInWindowOnSuccessCallback): void;\n}\n\nexport const useCanvasRef = () => useRef<CanvasRef>(null);\n\nconst useReanimatedFrame = !HAS_REANIMATED_3 ? () => {} : Rea.useFrameCallback;\nconst measure = !HAS_REANIMATED_3 ? null : Rea.measure;\n\nconst useCanvasRefPriv: typeof useRef<View> = !HAS_REANIMATED_3\n  ? useRef\n  : Rea.useAnimatedRef;\n\nexport const useCanvasSize = (userRef?: RefObject<CanvasRef | null>) => {\n  const ourRef = useCanvasRef();\n  const ref = userRef ?? ourRef;\n  const [size, setSize] = useState<SkSize>({ width: 0, height: 0 });\n  useLayoutEffect(() => {\n    if (ref.current) {\n      ref.current.measure((_x, _y, width, height) => {\n        setSize({ width, height });\n      });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n  return { ref, size };\n};\n\nexport interface CanvasProps extends Omit<ViewProps, \"onLayout\"> {\n  debug?: boolean;\n  /** @deprecated Not supported on native. Use `onSize` or `useCanvasSize()` instead. */\n  onLayout?: ViewProps[\"onLayout\"];\n  /**\n   * Declares that the canvas covers every pixel of its bounds, so nothing\n   * behind it needs to show through. On Android an opaque canvas is backed by\n   * a `SurfaceView` by default, the cheapest path (see `android.surfaceType`).\n   * Defaults to false.\n   */\n  opaque?: boolean;\n  onSize?: SharedValue<SkSize>;\n  colorSpace?: \"p3\" | \"srgb\";\n  /**\n   * Renders into a surface with more than 8 bits per channel (16-bit float on\n   * iOS, 10-bit on Android) to avoid banding in subtle gradients. Colors are\n   * identical to the default 8-bit surface, only with more precision (this is\n   * about bit depth, not HDR). On Android the extra precision survives\n   * composition only when combined with `opaque`, and the prop must be set\n   * before the canvas is mounted.\n   */\n  highBitDepth?: boolean;\n  /** Android-only rendering options. Ignored on iOS and web. */\n  android?: AndroidCanvasProps;\n  ref?: React.Ref<CanvasRef>;\n  androidWarmup?: boolean;\n  __destroyWebGLContextAfterRender?: boolean;\n}\n\n// Anything else reaching the native component would hit the generated\n// string-enum parser, which aborts on unknown values.\nconst resolveSurfaceType = (\n  surfaceType: AndroidSurfaceType | undefined\n): \"auto\" | AndroidSurfaceType =>\n  surfaceType === \"SurfaceView\" || surfaceType === \"TextureView\"\n    ? surfaceType\n    : \"auto\";\n\n/**\n * What every canvas shares, whichever native view it renders into: the native\n * id, the scene graph root rendered into it, the `onSize` measurement and the\n * imperative handle of the ref.\n */\nexport const useCanvasRoot = ({\n  children,\n  onSize,\n  ref,\n  onLayout,\n}: Pick<CanvasProps, \"children\" | \"onSize\" | \"ref\" | \"onLayout\">) => {\n  if (onLayout && Platform.OS !== \"web\") {\n    console.error(\n      \"<Canvas onLayout={onLayout} /> is not supported on the new architecture, to fix the issue, see: https://shopify.github.io/react-native-skia/docs/canvas/overview/#getting-the-canvas-size\"\n    );\n  }\n  const viewRef = useCanvasRefPriv(null);\n  // Native ID\n  const nativeId = useMemo(() => {\n    return SkiaViewNativeId.current++;\n  }, []);\n\n  // Root\n  const root = useMemo(() => new SkiaSGRoot(Skia, nativeId), [nativeId]);\n\n  useReanimatedFrame(() => {\n    \"worklet\";\n    if (onSize && measure) {\n      const result =\n        // eslint-disable-next-line no-nested-ternary\n        Platform.OS === \"web\"\n          ? // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-expect-error\n            viewRef.current?.canvasRef\n            ? // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n              // @ts-expect-error\n              measure(viewRef.current.canvasRef)\n            : { width: 0, height: 0 }\n          : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            measure(viewRef as any);\n      if (result) {\n        const { width, height } = result;\n        if (onSize.value.width !== width || onSize.value.height !== height) {\n          onSize.value = { width, height };\n        }\n      }\n    }\n  }, !!onSize);\n\n  // Render effects\n  useLayoutEffect(() => {\n    root.render(children);\n  }, [children, root, nativeId]);\n\n  useEffect(() => {\n    return () => {\n      root.unmount();\n    };\n  }, [root]);\n\n  // Component methods\n  useImperativeHandle(\n    ref,\n    () =>\n      ({\n        makeImageSnapshot: (rect?: SkRect) => {\n          return SkiaViewApi.makeImageSnapshot(nativeId, rect);\n        },\n        makeImageSnapshotAsync: (rect?: SkRect) => {\n          return SkiaViewApi.makeImageSnapshotAsync(nativeId, rect);\n        },\n        redraw: () => {\n          SkiaViewApi.requestRedraw(nativeId);\n        },\n        getNativeId: () => {\n          return nativeId;\n        },\n        measure: (callback) => {\n          viewRef.current?.measure(callback);\n        },\n        measureInWindow: (callback) => {\n          viewRef.current?.measureInWindow(callback);\n        },\n      }) as CanvasRef\n  );\n  return { nativeId, viewRef };\n};\n\nexport const Canvas = ({\n  debug,\n  opaque,\n  children,\n  onSize,\n  colorSpace = \"p3\",\n  highBitDepth = false,\n  androidWarmup = false,\n  android,\n  ref,\n  onLayout,\n  ...viewProps\n}: CanvasProps) => {\n  const { nativeId, viewRef } = useCanvasRoot({\n    children,\n    onSize,\n    ref,\n    onLayout,\n  });\n\n  const onLayoutWeb = useCallback(\n    (e: LayoutChangeEvent) => {\n      if (onLayout) {\n        onLayout(e);\n      }\n      if (Platform.OS === \"web\" && onSize) {\n        const { width, height } = e.nativeEvent.layout;\n        onSize.value = { width, height };\n      }\n    },\n    [onLayout, onSize]\n  );\n  return (\n    <SkiaPictureViewNativeComponent\n      ref={viewRef}\n      collapsable={false}\n      nativeID={`${nativeId}`}\n      debug={debug}\n      opaque={opaque}\n      colorSpace={colorSpace}\n      highBitDepth={highBitDepth}\n      androidWarmup={androidWarmup}\n      androidSurfaceType={resolveSurfaceType(android?.surfaceType)}\n      androidZOrderOnTop={!!android?.zOrderOnTop}\n      onLayout={\n        Platform.OS === \"web\" && (onSize || onLayout) ? onLayoutWeb : onLayout\n      }\n      {...viewProps}\n    />\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/renderer/DefaultCanvas.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { CanvasProps } from "./Canvas";
+/**
+ * `<Canvas>` renders {@link GraphiteCanvas} when React Native Skia is
+ * configured with the Graphite backend (install-skia-graphite), and the
+ * picture view based canvas otherwise. Both take the same props and ref.
+ */
+export declare const Canvas: (props: CanvasProps) => React.JSX.Element;

package/lib/commonjs/renderer/DefaultCanvas.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Canvas = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _skia = require("../skia");
+var _Platform = require("../Platform");
+var _Canvas = require("./Canvas");
+var _GraphiteCanvas = require("./GraphiteCanvas");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+let useGraphite = null;
+
+// Whether this build runs the Graphite backend. Resolved on the first render
+// (the native API is installed by then) and cached: getNativeDevice() throws
+// on Ganesh builds. On the web, GraphiteCanvas is the regular canvas anyway.
+const hasGraphite = () => {
+  if (useGraphite === null) {
+    if (_Platform.Platform.OS === "web") {
+      useGraphite = false;
+    } else {
+      try {
+        useGraphite = typeof _skia.Skia.getNativeDevice() === "bigint";
+      } catch {
+        useGraphite = false;
+      }
+    }
+  }
+  return useGraphite;
+};
+
+/**
+ * `<Canvas>` renders {@link GraphiteCanvas} when React Native Skia is
+ * configured with the Graphite backend (install-skia-graphite), and the
+ * picture view based canvas otherwise. Both take the same props and ref.
+ */
+const Canvas = props => {
+  return hasGraphite() ? /*#__PURE__*/_react.default.createElement(_GraphiteCanvas.GraphiteCanvas, props) : /*#__PURE__*/_react.default.createElement(_Canvas.Canvas, props);
+};
+exports.Canvas = Canvas;
+//# sourceMappingURL=DefaultCanvas.js.map

package/lib/commonjs/renderer/DefaultCanvas.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_skia","_Platform","_Canvas","_GraphiteCanvas","e","__esModule","default","useGraphite","hasGraphite","Platform","OS","Skia","getNativeDevice","Canvas","props","createElement","GraphiteCanvas","exports"],"sources":["DefaultCanvas.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Skia } from \"../skia\";\nimport { Platform } from \"../Platform\";\n\nimport type { CanvasProps } from \"./Canvas\";\nimport { Canvas as PictureCanvas } from \"./Canvas\";\nimport { GraphiteCanvas } from \"./GraphiteCanvas\";\n\nlet useGraphite: boolean | null = null;\n\n// Whether this build runs the Graphite backend. Resolved on the first render\n// (the native API is installed by then) and cached: getNativeDevice() throws\n// on Ganesh builds. On the web, GraphiteCanvas is the regular canvas anyway.\nconst hasGraphite = () => {\n  if (useGraphite === null) {\n    if (Platform.OS === \"web\") {\n      useGraphite = false;\n    } else {\n      try {\n        useGraphite = typeof Skia.getNativeDevice() === \"bigint\";\n      } catch {\n        useGraphite = false;\n      }\n    }\n  }\n  return useGraphite;\n};\n\n/**\n * `<Canvas>` renders {@link GraphiteCanvas} when React Native Skia is\n * configured with the Graphite backend (install-skia-graphite), and the\n * picture view based canvas otherwise. Both take the same props and ref.\n */\nexport const Canvas = (props: CanvasProps) => {\n  return hasGraphite() ? (\n    <GraphiteCanvas {...props} />\n  ) : (\n    <PictureCanvas {...props} />\n  );\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,SAAA,GAAAF,OAAA;AAGA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,eAAA,GAAAJ,OAAA;AAAkD,SAAAD,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAElD,IAAIG,WAA2B,GAAG,IAAI;;AAEtC;AACA;AACA;AACA,MAAMC,WAAW,GAAGA,CAAA,KAAM;EACxB,IAAID,WAAW,KAAK,IAAI,EAAE;IACxB,IAAIE,kBAAQ,CAACC,EAAE,KAAK,KAAK,EAAE;MACzBH,WAAW,GAAG,KAAK;IACrB,CAAC,MAAM;MACL,IAAI;QACFA,WAAW,GAAG,OAAOI,UAAI,CAACC,eAAe,CAAC,CAAC,KAAK,QAAQ;MAC1D,CAAC,CAAC,MAAM;QACNL,WAAW,GAAG,KAAK;MACrB;IACF;EACF;EACA,OAAOA,WAAW;AACpB,CAAC;;AAED;AACA;AACA;AACA;AACA;AACO,MAAMM,MAAM,GAAIC,KAAkB,IAAK;EAC5C,OAAON,WAAW,CAAC,CAAC,gBAClBX,MAAA,CAAAS,OAAA,CAAAS,aAAA,CAACZ,eAAA,CAAAa,cAAc,EAAKF,KAAQ,CAAC,gBAE7BjB,MAAA,CAAAS,OAAA,CAAAS,aAAA,CAACb,OAAA,CAAAW,MAAa,EAAKC,KAAQ,CAC5B;AACH,CAAC;AAACG,OAAA,CAAAJ,MAAA,GAAAA,MAAA","ignoreList":[]}

package/lib/commonjs/renderer/GraphiteCanvas.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+import type { CanvasProps } from "./Canvas";
+/**
+ * The declarative canvas on the Graphite view. It takes the same props and
+ * exposes the same ref as {@link Canvas}, and draws the same children, but
+ * the frames are produced differently:
+ *
+ * - the JS thread records the scene graph into a native recorder once per
+ *   React commit and hands it to the view;
+ * - the Reanimated UI runtime only reads the shared values into it (the one
+ *   step that needs a JS runtime), it never replays anything;
+ * - a dedicated native thread pool replays the recorder into a Graphite
+ *   recording whenever the content changed, at most once per presented frame;
+ * - the view presents the recording on the next vsync.
+ *
+ * Neither the JS thread nor the UI thread pays for drawing. It requires the
+ * Graphite backend (install-skia-graphite); with the default backend the view
+ * renders nothing. `colorSpace`, `android` and `androidWarmup` are accepted
+ * for API compatibility and ignored: the Graphite view renders in sRGB and
+ * uses its own backing view.
+ */
+export declare const GraphiteCanvas: ({ debug, opaque, children, onSize, colorSpace, highBitDepth, androidWarmup, android, ref, onLayout, ...viewProps }: CanvasProps) => React.JSX.Element;

package/lib/commonjs/renderer/GraphiteCanvas.js

@@ -0,0 +1,64 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.GraphiteCanvas = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _SkiaGraphiteViewNativeComponent = _interopRequireDefault(require("../specs/SkiaGraphiteViewNativeComponent"));
+var _Canvas = require("./Canvas");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+/**
+ * The declarative canvas on the Graphite view. It takes the same props and
+ * exposes the same ref as {@link Canvas}, and draws the same children, but
+ * the frames are produced differently:
+ *
+ * - the JS thread records the scene graph into a native recorder once per
+ *   React commit and hands it to the view;
+ * - the Reanimated UI runtime only reads the shared values into it (the one
+ *   step that needs a JS runtime), it never replays anything;
+ * - a dedicated native thread pool replays the recorder into a Graphite
+ *   recording whenever the content changed, at most once per presented frame;
+ * - the view presents the recording on the next vsync.
+ *
+ * Neither the JS thread nor the UI thread pays for drawing. It requires the
+ * Graphite backend (install-skia-graphite); with the default backend the view
+ * renders nothing. `colorSpace`, `android` and `androidWarmup` are accepted
+ * for API compatibility and ignored: the Graphite view renders in sRGB and
+ * uses its own backing view.
+ */
+const GraphiteCanvas = ({
+  debug,
+  opaque,
+  children,
+  onSize,
+  colorSpace,
+  highBitDepth = false,
+  androidWarmup,
+  android,
+  ref,
+  onLayout,
+  ...viewProps
+}) => {
+  const {
+    nativeId,
+    viewRef
+  } = (0, _Canvas.useCanvasRoot)({
+    children,
+    onSize,
+    ref,
+    onLayout
+  });
+  return /*#__PURE__*/_react.default.createElement(_SkiaGraphiteViewNativeComponent.default, _extends({
+    ref: viewRef,
+    collapsable: false,
+    nativeID: `${nativeId}`,
+    debug: debug,
+    opaque: opaque,
+    highBitDepth: highBitDepth,
+    onLayout: onLayout
+  }, viewProps));
+};
+exports.GraphiteCanvas = GraphiteCanvas;
+//# sourceMappingURL=GraphiteCanvas.js.map

package/lib/commonjs/renderer/GraphiteCanvas.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_SkiaGraphiteViewNativeComponent","_Canvas","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","GraphiteCanvas","debug","opaque","children","onSize","colorSpace","highBitDepth","androidWarmup","android","ref","onLayout","viewProps","nativeId","viewRef","useCanvasRoot","createElement","collapsable","nativeID","exports"],"sources":["GraphiteCanvas.tsx"],"sourcesContent":["import React from \"react\";\n\nimport SkiaGraphiteViewNativeComponent from \"../specs/SkiaGraphiteViewNativeComponent\";\n\nimport type { CanvasProps } from \"./Canvas\";\nimport { useCanvasRoot } from \"./Canvas\";\n\n/**\n * The declarative canvas on the Graphite view. It takes the same props and\n * exposes the same ref as {@link Canvas}, and draws the same children, but\n * the frames are produced differently:\n *\n * - the JS thread records the scene graph into a native recorder once per\n *   React commit and hands it to the view;\n * - the Reanimated UI runtime only reads the shared values into it (the one\n *   step that needs a JS runtime), it never replays anything;\n * - a dedicated native thread pool replays the recorder into a Graphite\n *   recording whenever the content changed, at most once per presented frame;\n * - the view presents the recording on the next vsync.\n *\n * Neither the JS thread nor the UI thread pays for drawing. It requires the\n * Graphite backend (install-skia-graphite); with the default backend the view\n * renders nothing. `colorSpace`, `android` and `androidWarmup` are accepted\n * for API compatibility and ignored: the Graphite view renders in sRGB and\n * uses its own backing view.\n */\nexport const GraphiteCanvas = ({\n  debug,\n  opaque,\n  children,\n  onSize,\n\n  colorSpace,\n  highBitDepth = false,\n\n  androidWarmup,\n\n  android,\n  ref,\n  onLayout,\n  ...viewProps\n}: CanvasProps) => {\n  const { nativeId, viewRef } = useCanvasRoot({\n    children,\n    onSize,\n    ref,\n    onLayout,\n  });\n  return (\n    <SkiaGraphiteViewNativeComponent\n      ref={viewRef}\n      collapsable={false}\n      nativeID={`${nativeId}`}\n      debug={debug}\n      opaque={opaque}\n      highBitDepth={highBitDepth}\n      onLayout={onLayout}\n      {...viewProps}\n    />\n  );\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,gCAAA,GAAAF,sBAAA,CAAAC,OAAA;AAGA,IAAAE,OAAA,GAAAF,OAAA;AAAyC,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,SAAA,WAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,CAAA,aAAAP,CAAA,MAAAA,CAAA,GAAAQ,SAAA,CAAAC,MAAA,EAAAT,CAAA,UAAAU,CAAA,GAAAF,SAAA,CAAAR,CAAA,YAAAW,CAAA,IAAAD,CAAA,OAAAE,cAAA,CAAAC,IAAA,CAAAH,CAAA,EAAAC,CAAA,MAAAJ,CAAA,CAAAI,CAAA,IAAAD,CAAA,CAAAC,CAAA,aAAAJ,CAAA,KAAAJ,QAAA,CAAAW,KAAA,OAAAN,SAAA;AAEzC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMO,cAAc,GAAGA,CAAC;EAC7BC,KAAK;EACLC,MAAM;EACNC,QAAQ;EACRC,MAAM;EAENC,UAAU;EACVC,YAAY,GAAG,KAAK;EAEpBC,aAAa;EAEbC,OAAO;EACPC,GAAG;EACHC,QAAQ;EACR,GAAGC;AACQ,CAAC,KAAK;EACjB,MAAM;IAAEC,QAAQ;IAAEC;EAAQ,CAAC,GAAG,IAAAC,qBAAa,EAAC;IAC1CX,QAAQ;IACRC,MAAM;IACNK,GAAG;IACHC;EACF,CAAC,CAAC;EACF,oBACE9B,MAAA,CAAAO,OAAA,CAAA4B,aAAA,CAAChC,gCAAA,CAAAI,OAA+B,EAAAC,QAAA;IAC9BqB,GAAG,EAAEI,OAAQ;IACbG,WAAW,EAAE,KAAM;IACnBC,QAAQ,EAAE,GAAGL,QAAQ,EAAG;IACxBX,KAAK,EAAEA,KAAM;IACbC,MAAM,EAAEA,MAAO;IACfI,YAAY,EAAEA,YAAa;IAC3BI,QAAQ,EAAEA;EAAS,GACfC,SAAS,CACd,CAAC;AAEN,CAAC;AAACO,OAAA,CAAAlB,cAAA,GAAAA,cAAA","ignoreList":[]}

package/lib/commonjs/renderer/GraphiteCanvas.web.d.ts

@@ -0,0 +1 @@
+export { Canvas as GraphiteCanvas } from "./Canvas";

package/lib/commonjs/renderer/GraphiteCanvas.web.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "GraphiteCanvas", {
+  enumerable: true,
+  get: function () {
+    return _Canvas.Canvas;
+  }
+});
+var _Canvas = require("./Canvas");
+//# sourceMappingURL=GraphiteCanvas.web.js.map

package/lib/commonjs/renderer/GraphiteCanvas.web.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_Canvas","require"],"sources":["GraphiteCanvas.web.tsx"],"sourcesContent":["// The Graphite view is native only: on the web, GraphiteCanvas is the regular\n// Canvas.\nexport { Canvas as GraphiteCanvas } from \"./Canvas\";\n"],"mappings":";;;;;;;;;;;AAEA,IAAAA,OAAA,GAAAC,OAAA","ignoreList":[]}

package/lib/module/index.d.ts

@@ -1,7 +1,10 @@
 import "./skia/NativeSetup";
 export { JsiSkImage } from "./skia/web/JsiSkImage";
 export * from "./renderer";
-export * from "./renderer/Canvas";
+export { useCanvasRef, useCanvasSize } from "./renderer/Canvas";
+export type { CanvasProps, CanvasRef } from "./renderer/Canvas";
+export { GraphiteCanvas } from "./renderer/GraphiteCanvas";
+export { Canvas } from "./renderer/DefaultCanvas";
 export * from "./renderer/Offscreen";
 export * from "./views";
 export * from "./skia";

package/lib/module/index.js

@@ -1,7 +1,9 @@
 import "./skia/NativeSetup";
 export { JsiSkImage } from "./skia/web/JsiSkImage";
 export * from "./renderer";
-export * from "./renderer/Canvas";
+export { useCanvasRef, useCanvasSize } from "./renderer/Canvas";
+export { GraphiteCanvas } from "./renderer/GraphiteCanvas";
+export { Canvas } from "./renderer/DefaultCanvas";
 export * from "./renderer/Offscreen";
 export * from "./views";
 export * from "./skia";

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["JsiSkImage"],"sources":["index.ts"],"sourcesContent":["import \"./skia/NativeSetup\";\nexport { JsiSkImage } from \"./skia/web/JsiSkImage\";\nexport * from \"./renderer\";\nexport * from \"./renderer/Canvas\";\nexport * from \"./renderer/Offscreen\";\nexport * from \"./views\";\nexport * from \"./skia\";\nexport * from \"./external\";\nexport * from \"./animation\";\nexport * from \"./dom/types\";\nexport * from \"./dom/nodes\";\n"],"mappings":"AAAA,OAAO,oBAAoB;AAC3B,SAASA,UAAU,QAAQ,uBAAuB;AAClD,cAAc,YAAY;AAC1B,cAAc,mBAAmB;AACjC,cAAc,sBAAsB;AACpC,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,aAAa;AAC3B,cAAc,aAAa;AAC3B,cAAc,aAAa","ignoreList":[]}
+{"version":3,"names":["JsiSkImage","useCanvasRef","useCanvasSize","GraphiteCanvas","Canvas"],"sources":["index.ts"],"sourcesContent":["import \"./skia/NativeSetup\";\nexport { JsiSkImage } from \"./skia/web/JsiSkImage\";\nexport * from \"./renderer\";\nexport { useCanvasRef, useCanvasSize } from \"./renderer/Canvas\";\nexport type { CanvasProps, CanvasRef } from \"./renderer/Canvas\";\nexport { GraphiteCanvas } from \"./renderer/GraphiteCanvas\";\nexport { Canvas } from \"./renderer/DefaultCanvas\";\nexport * from \"./renderer/Offscreen\";\nexport * from \"./views\";\nexport * from \"./skia\";\nexport * from \"./external\";\nexport * from \"./animation\";\nexport * from \"./dom/types\";\nexport * from \"./dom/nodes\";\n"],"mappings":"AAAA,OAAO,oBAAoB;AAC3B,SAASA,UAAU,QAAQ,uBAAuB;AAClD,cAAc,YAAY;AAC1B,SAASC,YAAY,EAAEC,aAAa,QAAQ,mBAAmB;AAE/D,SAASC,cAAc,QAAQ,2BAA2B;AAC1D,SAASC,MAAM,QAAQ,0BAA0B;AACjD,cAAc,sBAAsB;AACpC,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,aAAa;AAC3B,cAAc,aAAa;AAC3B,cAAc,aAAa","ignoreList":[]}

package/lib/module/mock/index.js

@@ -24,6 +24,7 @@ export const Mock = CanvasKit => {
     ...require("../dom/types"),
     ...require("../dom/nodes"),
     Canvas: require("react-native").View,
+    GraphiteCanvas: require("react-native").View,
     getPreferredHighBitDepthCanvasFormat: () => "rgba16float",
     SkiaPictureView: require("react-native").View,
     SkiaGraphiteView: require("react-native").View,

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

@@ -1 +1 @@
-{"version":3,"names":["JsiSkApi","JsiSkImage","Noop","undefined","NoopValue","current","NoopSharedValue","value","Mock","CanvasKit","global","SkiaApi","Skia","require","Canvas","View","getPreferredHighBitDepthCanvasFormat","SkiaPictureView","SkiaGraphiteView","drawAsPicture","drawAsImage","drawAsImageFromPicture","useCanvasRef","useCanvasSize","ref","size","width","height","useValue","useComputedValue","useTiming","useLoop","useSpring","useClockValue","useValueEffect","isOnMainThread","useClock","usePathInterpolation","useImageAsTexture","useTextureValue","useTextureValueFromPicture","useRSXformBuffer","usePointBuffer","useColorBuffer","useRectBuffer","useBuffer","useRawData","useData","useFont","Font","useFonts","useTypeface","useImage","useSVG","useVideo"],"sources":["index.ts"],"sourcesContent":["import type { CanvasKit } from \"canvaskit-wasm\";\n\nimport { JsiSkApi } from \"../skia/web\";\nimport { JsiSkImage } from \"../skia/web/JsiSkImage\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst Noop: () => any = () => undefined;\nconst NoopValue = () => ({ current: 0 });\nconst NoopSharedValue = () => ({ value: 0 });\n\nexport const Mock = (CanvasKit: CanvasKit) => {\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  // @ts-ignore\n  global.SkiaApi = JsiSkApi(CanvasKit);\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  // @ts-ignore\n  const Skia = global.SkiaApi;\n  return {\n    Skia,\n    ...require(\"../renderer/components\"),\n    ...require(\"../skia\"),\n    ...require(\"../animation\"),\n    ...require(\"../dom/types\"),\n    ...require(\"../dom/nodes\"),\n    Canvas: require(\"react-native\").View,\n    getPreferredHighBitDepthCanvasFormat: () => \"rgba16float\",\n    SkiaPictureView: require(\"react-native\").View,\n    SkiaGraphiteView: require(\"react-native\").View,\n    JsiSkImage: JsiSkImage,\n    drawAsPicture: Noop,\n    drawAsImage: Noop,\n    drawAsImageFromPicture: Noop,\n    useCanvasRef: NoopValue,\n    useCanvasSize: () => ({\n      ref: {\n        current: 0,\n      },\n      size: {\n        width: 0,\n        height: 0,\n      },\n    }),\n    // Skia Animations\n    useValue: NoopValue,\n    useComputedValue: NoopValue,\n    useTiming: NoopValue,\n    useLoop: NoopValue,\n    useSpring: NoopValue,\n    useClockValue: NoopValue,\n    useValueEffect: Noop,\n    // Reanimated hooks\n    isOnMainThread: () => true,\n    useClock: NoopSharedValue,\n    usePathInterpolation: NoopSharedValue,\n    useImageAsTexture: NoopSharedValue,\n    useTextureValue: NoopSharedValue,\n    useTextureValueFromPicture: NoopSharedValue,\n    useRSXformBuffer: NoopSharedValue,\n    usePointBuffer: NoopSharedValue,\n    useColorBuffer: NoopSharedValue,\n    useRectBuffer: NoopSharedValue,\n    useBuffer: NoopSharedValue,\n    useRawData: Noop,\n    useData: Noop,\n    useFont: () => Skia.Font(undefined, 0),\n    useFonts: Noop,\n    useTypeface: () => null,\n    useImage: () => null,\n    useSVG: () => null,\n    useVideo: () => null,\n  };\n};\n"],"mappings":"AAEA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,UAAU,QAAQ,wBAAwB;;AAEnD;AACA,MAAMC,IAAe,GAAGA,CAAA,KAAMC,SAAS;AACvC,MAAMC,SAAS,GAAGA,CAAA,MAAO;EAAEC,OAAO,EAAE;AAAE,CAAC,CAAC;AACxC,MAAMC,eAAe,GAAGA,CAAA,MAAO;EAAEC,KAAK,EAAE;AAAE,CAAC,CAAC;AAE5C,OAAO,MAAMC,IAAI,GAAIC,SAAoB,IAAK;EAC5C;EACA;EACAC,MAAM,CAACC,OAAO,GAAGX,QAAQ,CAACS,SAAS,CAAC;EACpC;EACA;EACA,MAAMG,IAAI,GAAGF,MAAM,CAACC,OAAO;EAC3B,OAAO;IACLC,IAAI;IACJ,GAAGC,OAAO,CAAC,wBAAwB,CAAC;IACpC,GAAGA,OAAO,CAAC,SAAS,CAAC;IACrB,GAAGA,OAAO,CAAC,cAAc,CAAC;IAC1B,GAAGA,OAAO,CAAC,cAAc,CAAC;IAC1B,GAAGA,OAAO,CAAC,cAAc,CAAC;IAC1BC,MAAM,EAAED,OAAO,CAAC,cAAc,CAAC,CAACE,IAAI;IACpCC,oCAAoC,EAAEA,CAAA,KAAM,aAAa;IACzDC,eAAe,EAAEJ,OAAO,CAAC,cAAc,CAAC,CAACE,IAAI;IAC7CG,gBAAgB,EAAEL,OAAO,CAAC,cAAc,CAAC,CAACE,IAAI;IAC9Cd,UAAU,EAAEA,UAAU;IACtBkB,aAAa,EAAEjB,IAAI;IACnBkB,WAAW,EAAElB,IAAI;IACjBmB,sBAAsB,EAAEnB,IAAI;IAC5BoB,YAAY,EAAElB,SAAS;IACvBmB,aAAa,EAAEA,CAAA,MAAO;MACpBC,GAAG,EAAE;QACHnB,OAAO,EAAE;MACX,CAAC;MACDoB,IAAI,EAAE;QACJC,KAAK,EAAE,CAAC;QACRC,MAAM,EAAE;MACV;IACF,CAAC,CAAC;IACF;IACAC,QAAQ,EAAExB,SAAS;IACnByB,gBAAgB,EAAEzB,SAAS;IAC3B0B,SAAS,EAAE1B,SAAS;IACpB2B,OAAO,EAAE3B,SAAS;IAClB4B,SAAS,EAAE5B,SAAS;IACpB6B,aAAa,EAAE7B,SAAS;IACxB8B,cAAc,EAAEhC,IAAI;IACpB;IACAiC,cAAc,EAAEA,CAAA,KAAM,IAAI;IAC1BC,QAAQ,EAAE9B,eAAe;IACzB+B,oBAAoB,EAAE/B,eAAe;IACrCgC,iBAAiB,EAAEhC,eAAe;IAClCiC,eAAe,EAAEjC,eAAe;IAChCkC,0BAA0B,EAAElC,eAAe;IAC3CmC,gBAAgB,EAAEnC,eAAe;IACjCoC,cAAc,EAAEpC,eAAe;IAC/BqC,cAAc,EAAErC,eAAe;IAC/BsC,aAAa,EAAEtC,eAAe;IAC9BuC,SAAS,EAAEvC,eAAe;IAC1BwC,UAAU,EAAE5C,IAAI;IAChB6C,OAAO,EAAE7C,IAAI;IACb8C,OAAO,EAAEA,CAAA,KAAMpC,IAAI,CAACqC,IAAI,CAAC9C,SAAS,EAAE,CAAC,CAAC;IACtC+C,QAAQ,EAAEhD,IAAI;IACdiD,WAAW,EAAEA,CAAA,KAAM,IAAI;IACvBC,QAAQ,EAAEA,CAAA,KAAM,IAAI;IACpBC,MAAM,EAAEA,CAAA,KAAM,IAAI;IAClBC,QAAQ,EAAEA,CAAA,KAAM;EAClB,CAAC;AACH,CAAC","ignoreList":[]}
+{"version":3,"names":["JsiSkApi","JsiSkImage","Noop","undefined","NoopValue","current","NoopSharedValue","value","Mock","CanvasKit","global","SkiaApi","Skia","require","Canvas","View","GraphiteCanvas","getPreferredHighBitDepthCanvasFormat","SkiaPictureView","SkiaGraphiteView","drawAsPicture","drawAsImage","drawAsImageFromPicture","useCanvasRef","useCanvasSize","ref","size","width","height","useValue","useComputedValue","useTiming","useLoop","useSpring","useClockValue","useValueEffect","isOnMainThread","useClock","usePathInterpolation","useImageAsTexture","useTextureValue","useTextureValueFromPicture","useRSXformBuffer","usePointBuffer","useColorBuffer","useRectBuffer","useBuffer","useRawData","useData","useFont","Font","useFonts","useTypeface","useImage","useSVG","useVideo"],"sources":["index.ts"],"sourcesContent":["import type { CanvasKit } from \"canvaskit-wasm\";\n\nimport { JsiSkApi } from \"../skia/web\";\nimport { JsiSkImage } from \"../skia/web/JsiSkImage\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst Noop: () => any = () => undefined;\nconst NoopValue = () => ({ current: 0 });\nconst NoopSharedValue = () => ({ value: 0 });\n\nexport const Mock = (CanvasKit: CanvasKit) => {\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  // @ts-ignore\n  global.SkiaApi = JsiSkApi(CanvasKit);\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  // @ts-ignore\n  const Skia = global.SkiaApi;\n  return {\n    Skia,\n    ...require(\"../renderer/components\"),\n    ...require(\"../skia\"),\n    ...require(\"../animation\"),\n    ...require(\"../dom/types\"),\n    ...require(\"../dom/nodes\"),\n    Canvas: require(\"react-native\").View,\n    GraphiteCanvas: require(\"react-native\").View,\n    getPreferredHighBitDepthCanvasFormat: () => \"rgba16float\",\n    SkiaPictureView: require(\"react-native\").View,\n    SkiaGraphiteView: require(\"react-native\").View,\n    JsiSkImage: JsiSkImage,\n    drawAsPicture: Noop,\n    drawAsImage: Noop,\n    drawAsImageFromPicture: Noop,\n    useCanvasRef: NoopValue,\n    useCanvasSize: () => ({\n      ref: {\n        current: 0,\n      },\n      size: {\n        width: 0,\n        height: 0,\n      },\n    }),\n    // Skia Animations\n    useValue: NoopValue,\n    useComputedValue: NoopValue,\n    useTiming: NoopValue,\n    useLoop: NoopValue,\n    useSpring: NoopValue,\n    useClockValue: NoopValue,\n    useValueEffect: Noop,\n    // Reanimated hooks\n    isOnMainThread: () => true,\n    useClock: NoopSharedValue,\n    usePathInterpolation: NoopSharedValue,\n    useImageAsTexture: NoopSharedValue,\n    useTextureValue: NoopSharedValue,\n    useTextureValueFromPicture: NoopSharedValue,\n    useRSXformBuffer: NoopSharedValue,\n    usePointBuffer: NoopSharedValue,\n    useColorBuffer: NoopSharedValue,\n    useRectBuffer: NoopSharedValue,\n    useBuffer: NoopSharedValue,\n    useRawData: Noop,\n    useData: Noop,\n    useFont: () => Skia.Font(undefined, 0),\n    useFonts: Noop,\n    useTypeface: () => null,\n    useImage: () => null,\n    useSVG: () => null,\n    useVideo: () => null,\n  };\n};\n"],"mappings":"AAEA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,UAAU,QAAQ,wBAAwB;;AAEnD;AACA,MAAMC,IAAe,GAAGA,CAAA,KAAMC,SAAS;AACvC,MAAMC,SAAS,GAAGA,CAAA,MAAO;EAAEC,OAAO,EAAE;AAAE,CAAC,CAAC;AACxC,MAAMC,eAAe,GAAGA,CAAA,MAAO;EAAEC,KAAK,EAAE;AAAE,CAAC,CAAC;AAE5C,OAAO,MAAMC,IAAI,GAAIC,SAAoB,IAAK;EAC5C;EACA;EACAC,MAAM,CAACC,OAAO,GAAGX,QAAQ,CAACS,SAAS,CAAC;EACpC;EACA;EACA,MAAMG,IAAI,GAAGF,MAAM,CAACC,OAAO;EAC3B,OAAO;IACLC,IAAI;IACJ,GAAGC,OAAO,CAAC,wBAAwB,CAAC;IACpC,GAAGA,OAAO,CAAC,SAAS,CAAC;IACrB,GAAGA,OAAO,CAAC,cAAc,CAAC;IAC1B,GAAGA,OAAO,CAAC,cAAc,CAAC;IAC1B,GAAGA,OAAO,CAAC,cAAc,CAAC;IAC1BC,MAAM,EAAED,OAAO,CAAC,cAAc,CAAC,CAACE,IAAI;IACpCC,cAAc,EAAEH,OAAO,CAAC,cAAc,CAAC,CAACE,IAAI;IAC5CE,oCAAoC,EAAEA,CAAA,KAAM,aAAa;IACzDC,eAAe,EAAEL,OAAO,CAAC,cAAc,CAAC,CAACE,IAAI;IAC7CI,gBAAgB,EAAEN,OAAO,CAAC,cAAc,CAAC,CAACE,IAAI;IAC9Cd,UAAU,EAAEA,UAAU;IACtBmB,aAAa,EAAElB,IAAI;IACnBmB,WAAW,EAAEnB,IAAI;IACjBoB,sBAAsB,EAAEpB,IAAI;IAC5BqB,YAAY,EAAEnB,SAAS;IACvBoB,aAAa,EAAEA,CAAA,MAAO;MACpBC,GAAG,EAAE;QACHpB,OAAO,EAAE;MACX,CAAC;MACDqB,IAAI,EAAE;QACJC,KAAK,EAAE,CAAC;QACRC,MAAM,EAAE;MACV;IACF,CAAC,CAAC;IACF;IACAC,QAAQ,EAAEzB,SAAS;IACnB0B,gBAAgB,EAAE1B,SAAS;IAC3B2B,SAAS,EAAE3B,SAAS;IACpB4B,OAAO,EAAE5B,SAAS;IAClB6B,SAAS,EAAE7B,SAAS;IACpB8B,aAAa,EAAE9B,SAAS;IACxB+B,cAAc,EAAEjC,IAAI;IACpB;IACAkC,cAAc,EAAEA,CAAA,KAAM,IAAI;IAC1BC,QAAQ,EAAE/B,eAAe;IACzBgC,oBAAoB,EAAEhC,eAAe;IACrCiC,iBAAiB,EAAEjC,eAAe;IAClCkC,eAAe,EAAElC,eAAe;IAChCmC,0BAA0B,EAAEnC,eAAe;IAC3CoC,gBAAgB,EAAEpC,eAAe;IACjCqC,cAAc,EAAErC,eAAe;IAC/BsC,cAAc,EAAEtC,eAAe;IAC/BuC,aAAa,EAAEvC,eAAe;IAC9BwC,SAAS,EAAExC,eAAe;IAC1ByC,UAAU,EAAE7C,IAAI;IAChB8C,OAAO,EAAE9C,IAAI;IACb+C,OAAO,EAAEA,CAAA,KAAMrC,IAAI,CAACsC,IAAI,CAAC/C,SAAS,EAAE,CAAC,CAAC;IACtCgD,QAAQ,EAAEjD,IAAI;IACdkD,WAAW,EAAEA,CAAA,KAAM,IAAI;IACvBC,QAAQ,EAAEA,CAAA,KAAM,IAAI;IACpBC,MAAM,EAAEA,CAAA,KAAM,IAAI;IAClBC,QAAQ,EAAEA,CAAA,KAAM;EAClB,CAAC;AACH,CAAC","ignoreList":[]}

package/lib/module/renderer/Canvas.d.ts

@@ -1,6 +1,6 @@
 import type { FC, RefObject } from "react";
 import React from "react";
-import type { MeasureInWindowOnSuccessCallback, MeasureOnSuccessCallback, ViewProps } from "react-native";
+import type { MeasureInWindowOnSuccessCallback, MeasureOnSuccessCallback, View, ViewProps } from "react-native";
 import type { SharedValue } from "react-native-reanimated";
 import type { AndroidCanvasProps } from "../views/types";
 import type { SkImage, SkRect, SkSize } from "../skia/types";
@@ -45,4 +45,13 @@ export interface CanvasProps extends Omit<ViewProps, "onLayout"> {
     androidWarmup?: boolean;
     __destroyWebGLContextAfterRender?: boolean;
 }
+/**
+ * What every canvas shares, whichever native view it renders into: the native
+ * id, the scene graph root rendered into it, the `onSize` measurement and the
+ * imperative handle of the ref.
+ */
+export declare const useCanvasRoot: ({ children, onSize, ref, onLayout, }: Pick<CanvasProps, "children" | "onSize" | "ref" | "onLayout">) => {
+    nativeId: number;
+    viewRef: RefObject<View | null>;
+};
 export declare const Canvas: ({ debug, opaque, children, onSize, colorSpace, highBitDepth, androidWarmup, android, ref, onLayout, ...viewProps }: CanvasProps) => React.JSX.Element;

package/lib/module/renderer/Canvas.js

@@ -37,18 +37,17 @@ export const useCanvasSize = userRef => {
 // Anything else reaching the native component would hit the generated
 // string-enum parser, which aborts on unknown values.
 const resolveSurfaceType = surfaceType => surfaceType === "SurfaceView" || surfaceType === "TextureView" ? surfaceType : "auto";
-export const Canvas = ({
-  debug,
-  opaque,
+
+/**
+ * What every canvas shares, whichever native view it renders into: the native
+ * id, the scene graph root rendered into it, the `onSize` measurement and the
+ * imperative handle of the ref.
+ */
+export const useCanvasRoot = ({
   children,
   onSize,
-  colorSpace = "p3",
-  highBitDepth = false,
-  androidWarmup = false,
-  android,
   ref,
-  onLayout,
-  ...viewProps
+  onLayout
 }) => {
   if (onLayout && Platform.OS !== "web") {
     console.error("<Canvas onLayout={onLayout} /> is not supported on the new architecture, to fix the issue, see: https://shopify.github.io/react-native-skia/docs/canvas/overview/#getting-the-canvas-size");
@@ -128,6 +127,33 @@ export const Canvas = ({
       (_viewRef$current3 = viewRef.current) === null || _viewRef$current3 === void 0 || _viewRef$current3.measureInWindow(callback);
     }
   }));
+  return {
+    nativeId,
+    viewRef
+  };
+};
+export const Canvas = ({
+  debug,
+  opaque,
+  children,
+  onSize,
+  colorSpace = "p3",
+  highBitDepth = false,
+  androidWarmup = false,
+  android,
+  ref,
+  onLayout,
+  ...viewProps
+}) => {
+  const {
+    nativeId,
+    viewRef
+  } = useCanvasRoot({
+    children,
+    onSize,
+    ref,
+    onLayout
+  });
   const onLayoutWeb = useCallback(e => {
     if (onLayout) {
       onLayout(e);

package/lib/module/renderer/Canvas.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useImperativeHandle","useLayoutEffect","useMemo","useRef","useState","Rea","SkiaViewNativeId","SkiaPictureViewNativeComponent","SkiaSGRoot","Skia","Platform","HAS_REANIMATED_3","useCanvasRef","useReanimatedFrame","useFrameCallback","measure","useCanvasRefPriv","useAnimatedRef","useCanvasSize","userRef","ourRef","ref","size","setSize","width","height","current","_x","_y","resolveSurfaceType","surfaceType","Canvas","debug","opaque","children","onSize","colorSpace","highBitDepth","androidWarmup","android","onLayout","viewProps","OS","console","error","viewRef","nativeId","root","_viewRef$current","result","canvasRef","value","render","unmount","makeImageSnapshot","rect","SkiaViewApi","makeImageSnapshotAsync","redraw","requestRedraw","getNativeId","callback","_viewRef$current2","measureInWindow","_viewRef$current3","onLayoutWeb","e","nativeEvent","layout","createElement","_extends","collapsable","nativeID","androidSurfaceType","androidZOrderOnTop","zOrderOnTop"],"sources":["Canvas.tsx"],"sourcesContent":["import type { FC, RefObject } from \"react\";\nimport React, {\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport type {\n  LayoutChangeEvent,\n  MeasureInWindowOnSuccessCallback,\n  MeasureOnSuccessCallback,\n  View,\n  ViewProps,\n} from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport Rea from \"../external/reanimated/ReanimatedProxy\";\nimport { SkiaViewNativeId } from \"../views/SkiaViewNativeId\";\nimport type { AndroidCanvasProps, AndroidSurfaceType } from \"../views/types\";\nimport SkiaPictureViewNativeComponent from \"../specs/SkiaPictureViewNativeComponent\";\nimport type { SkImage, SkRect, SkSize } from \"../skia/types\";\nimport { SkiaSGRoot } from \"../sksg/Reconciler\";\nimport { Skia } from \"../skia\";\nimport { Platform } from \"../Platform\";\nimport { HAS_REANIMATED_3 } from \"../external\";\n\nexport interface CanvasRef extends FC<CanvasProps> {\n  makeImageSnapshot(rect?: SkRect): SkImage;\n  makeImageSnapshotAsync(rect?: SkRect): Promise<SkImage>;\n  redraw(): void;\n  getNativeId(): number;\n  measure(callback: MeasureOnSuccessCallback): void;\n  measureInWindow(callback: MeasureInWindowOnSuccessCallback): void;\n}\n\nexport const useCanvasRef = () => useRef<CanvasRef>(null);\n\nconst useReanimatedFrame = !HAS_REANIMATED_3 ? () => {} : Rea.useFrameCallback;\nconst measure = !HAS_REANIMATED_3 ? null : Rea.measure;\n\nconst useCanvasRefPriv: typeof useRef<View> = !HAS_REANIMATED_3\n  ? useRef\n  : Rea.useAnimatedRef;\n\nexport const useCanvasSize = (userRef?: RefObject<CanvasRef | null>) => {\n  const ourRef = useCanvasRef();\n  const ref = userRef ?? ourRef;\n  const [size, setSize] = useState<SkSize>({ width: 0, height: 0 });\n  useLayoutEffect(() => {\n    if (ref.current) {\n      ref.current.measure((_x, _y, width, height) => {\n        setSize({ width, height });\n      });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n  return { ref, size };\n};\n\nexport interface CanvasProps extends Omit<ViewProps, \"onLayout\"> {\n  debug?: boolean;\n  /** @deprecated Not supported on native. Use `onSize` or `useCanvasSize()` instead. */\n  onLayout?: ViewProps[\"onLayout\"];\n  /**\n   * Declares that the canvas covers every pixel of its bounds, so nothing\n   * behind it needs to show through. On Android an opaque canvas is backed by\n   * a `SurfaceView` by default, the cheapest path (see `android.surfaceType`).\n   * Defaults to false.\n   */\n  opaque?: boolean;\n  onSize?: SharedValue<SkSize>;\n  colorSpace?: \"p3\" | \"srgb\";\n  /**\n   * Renders into a surface with more than 8 bits per channel (16-bit float on\n   * iOS, 10-bit on Android) to avoid banding in subtle gradients. Colors are\n   * identical to the default 8-bit surface, only with more precision (this is\n   * about bit depth, not HDR). On Android the extra precision survives\n   * composition only when combined with `opaque`, and the prop must be set\n   * before the canvas is mounted.\n   */\n  highBitDepth?: boolean;\n  /** Android-only rendering options. Ignored on iOS and web. */\n  android?: AndroidCanvasProps;\n  ref?: React.Ref<CanvasRef>;\n  androidWarmup?: boolean;\n  __destroyWebGLContextAfterRender?: boolean;\n}\n\n// Anything else reaching the native component would hit the generated\n// string-enum parser, which aborts on unknown values.\nconst resolveSurfaceType = (\n  surfaceType: AndroidSurfaceType | undefined\n): \"auto\" | AndroidSurfaceType =>\n  surfaceType === \"SurfaceView\" || surfaceType === \"TextureView\"\n    ? surfaceType\n    : \"auto\";\n\nexport const Canvas = ({\n  debug,\n  opaque,\n  children,\n  onSize,\n  colorSpace = \"p3\",\n  highBitDepth = false,\n  androidWarmup = false,\n  android,\n  ref,\n  onLayout,\n  ...viewProps\n}: CanvasProps) => {\n  if (onLayout && Platform.OS !== \"web\") {\n    console.error(\n      \"<Canvas onLayout={onLayout} /> is not supported on the new architecture, to fix the issue, see: https://shopify.github.io/react-native-skia/docs/canvas/overview/#getting-the-canvas-size\"\n    );\n  }\n  const viewRef = useCanvasRefPriv(null);\n  // Native ID\n  const nativeId = useMemo(() => {\n    return SkiaViewNativeId.current++;\n  }, []);\n\n  // Root\n  const root = useMemo(() => new SkiaSGRoot(Skia, nativeId), [nativeId]);\n\n  useReanimatedFrame(() => {\n    \"worklet\";\n    if (onSize && measure) {\n      const result =\n        // eslint-disable-next-line no-nested-ternary\n        Platform.OS === \"web\"\n          ? // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-expect-error\n            viewRef.current?.canvasRef\n            ? // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n              // @ts-expect-error\n              measure(viewRef.current.canvasRef)\n            : { width: 0, height: 0 }\n          : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            measure(viewRef as any);\n      if (result) {\n        const { width, height } = result;\n        if (onSize.value.width !== width || onSize.value.height !== height) {\n          onSize.value = { width, height };\n        }\n      }\n    }\n  }, !!onSize);\n\n  // Render effects\n  useLayoutEffect(() => {\n    root.render(children);\n  }, [children, root, nativeId]);\n\n  useEffect(() => {\n    return () => {\n      root.unmount();\n    };\n  }, [root]);\n\n  // Component methods\n  useImperativeHandle(\n    ref,\n    () =>\n      ({\n        makeImageSnapshot: (rect?: SkRect) => {\n          return SkiaViewApi.makeImageSnapshot(nativeId, rect);\n        },\n        makeImageSnapshotAsync: (rect?: SkRect) => {\n          return SkiaViewApi.makeImageSnapshotAsync(nativeId, rect);\n        },\n        redraw: () => {\n          SkiaViewApi.requestRedraw(nativeId);\n        },\n        getNativeId: () => {\n          return nativeId;\n        },\n        measure: (callback) => {\n          viewRef.current?.measure(callback);\n        },\n        measureInWindow: (callback) => {\n          viewRef.current?.measureInWindow(callback);\n        },\n      }) as CanvasRef\n  );\n\n  const onLayoutWeb = useCallback(\n    (e: LayoutChangeEvent) => {\n      if (onLayout) {\n        onLayout(e);\n      }\n      if (Platform.OS === \"web\" && onSize) {\n        const { width, height } = e.nativeEvent.layout;\n        onSize.value = { width, height };\n      }\n    },\n    [onLayout, onSize]\n  );\n  return (\n    <SkiaPictureViewNativeComponent\n      ref={viewRef}\n      collapsable={false}\n      nativeID={`${nativeId}`}\n      debug={debug}\n      opaque={opaque}\n      colorSpace={colorSpace}\n      highBitDepth={highBitDepth}\n      androidWarmup={androidWarmup}\n      androidSurfaceType={resolveSurfaceType(android?.surfaceType)}\n      androidZOrderOnTop={!!android?.zOrderOnTop}\n      onLayout={\n        Platform.OS === \"web\" && (onSize || onLayout) ? onLayoutWeb : onLayout\n      }\n      {...viewProps}\n    />\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useEffect","useImperativeHandle","useLayoutEffect","useMemo","useRef","useState","Rea","SkiaViewNativeId","SkiaPictureViewNativeComponent","SkiaSGRoot","Skia","Platform","HAS_REANIMATED_3","useCanvasRef","useReanimatedFrame","useFrameCallback","measure","useCanvasRefPriv","useAnimatedRef","useCanvasSize","userRef","ourRef","ref","size","setSize","width","height","current","_x","_y","resolveSurfaceType","surfaceType","useCanvasRoot","children","onSize","onLayout","OS","console","error","viewRef","nativeId","root","_viewRef$current","result","canvasRef","value","render","unmount","makeImageSnapshot","rect","SkiaViewApi","makeImageSnapshotAsync","redraw","requestRedraw","getNativeId","callback","_viewRef$current2","measureInWindow","_viewRef$current3","Canvas","debug","opaque","colorSpace","highBitDepth","androidWarmup","android","viewProps","onLayoutWeb","e","nativeEvent","layout","createElement","_extends","collapsable","nativeID","androidSurfaceType","androidZOrderOnTop","zOrderOnTop"],"sources":["Canvas.tsx"],"sourcesContent":["import type { FC, RefObject } from \"react\";\nimport React, {\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport type {\n  LayoutChangeEvent,\n  MeasureInWindowOnSuccessCallback,\n  MeasureOnSuccessCallback,\n  View,\n  ViewProps,\n} from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport Rea from \"../external/reanimated/ReanimatedProxy\";\nimport { SkiaViewNativeId } from \"../views/SkiaViewNativeId\";\nimport type { AndroidCanvasProps, AndroidSurfaceType } from \"../views/types\";\nimport SkiaPictureViewNativeComponent from \"../specs/SkiaPictureViewNativeComponent\";\nimport type { SkImage, SkRect, SkSize } from \"../skia/types\";\nimport { SkiaSGRoot } from \"../sksg/Reconciler\";\nimport { Skia } from \"../skia\";\nimport { Platform } from \"../Platform\";\nimport { HAS_REANIMATED_3 } from \"../external\";\n\nexport interface CanvasRef extends FC<CanvasProps> {\n  makeImageSnapshot(rect?: SkRect): SkImage;\n  makeImageSnapshotAsync(rect?: SkRect): Promise<SkImage>;\n  redraw(): void;\n  getNativeId(): number;\n  measure(callback: MeasureOnSuccessCallback): void;\n  measureInWindow(callback: MeasureInWindowOnSuccessCallback): void;\n}\n\nexport const useCanvasRef = () => useRef<CanvasRef>(null);\n\nconst useReanimatedFrame = !HAS_REANIMATED_3 ? () => {} : Rea.useFrameCallback;\nconst measure = !HAS_REANIMATED_3 ? null : Rea.measure;\n\nconst useCanvasRefPriv: typeof useRef<View> = !HAS_REANIMATED_3\n  ? useRef\n  : Rea.useAnimatedRef;\n\nexport const useCanvasSize = (userRef?: RefObject<CanvasRef | null>) => {\n  const ourRef = useCanvasRef();\n  const ref = userRef ?? ourRef;\n  const [size, setSize] = useState<SkSize>({ width: 0, height: 0 });\n  useLayoutEffect(() => {\n    if (ref.current) {\n      ref.current.measure((_x, _y, width, height) => {\n        setSize({ width, height });\n      });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n  return { ref, size };\n};\n\nexport interface CanvasProps extends Omit<ViewProps, \"onLayout\"> {\n  debug?: boolean;\n  /** @deprecated Not supported on native. Use `onSize` or `useCanvasSize()` instead. */\n  onLayout?: ViewProps[\"onLayout\"];\n  /**\n   * Declares that the canvas covers every pixel of its bounds, so nothing\n   * behind it needs to show through. On Android an opaque canvas is backed by\n   * a `SurfaceView` by default, the cheapest path (see `android.surfaceType`).\n   * Defaults to false.\n   */\n  opaque?: boolean;\n  onSize?: SharedValue<SkSize>;\n  colorSpace?: \"p3\" | \"srgb\";\n  /**\n   * Renders into a surface with more than 8 bits per channel (16-bit float on\n   * iOS, 10-bit on Android) to avoid banding in subtle gradients. Colors are\n   * identical to the default 8-bit surface, only with more precision (this is\n   * about bit depth, not HDR). On Android the extra precision survives\n   * composition only when combined with `opaque`, and the prop must be set\n   * before the canvas is mounted.\n   */\n  highBitDepth?: boolean;\n  /** Android-only rendering options. Ignored on iOS and web. */\n  android?: AndroidCanvasProps;\n  ref?: React.Ref<CanvasRef>;\n  androidWarmup?: boolean;\n  __destroyWebGLContextAfterRender?: boolean;\n}\n\n// Anything else reaching the native component would hit the generated\n// string-enum parser, which aborts on unknown values.\nconst resolveSurfaceType = (\n  surfaceType: AndroidSurfaceType | undefined\n): \"auto\" | AndroidSurfaceType =>\n  surfaceType === \"SurfaceView\" || surfaceType === \"TextureView\"\n    ? surfaceType\n    : \"auto\";\n\n/**\n * What every canvas shares, whichever native view it renders into: the native\n * id, the scene graph root rendered into it, the `onSize` measurement and the\n * imperative handle of the ref.\n */\nexport const useCanvasRoot = ({\n  children,\n  onSize,\n  ref,\n  onLayout,\n}: Pick<CanvasProps, \"children\" | \"onSize\" | \"ref\" | \"onLayout\">) => {\n  if (onLayout && Platform.OS !== \"web\") {\n    console.error(\n      \"<Canvas onLayout={onLayout} /> is not supported on the new architecture, to fix the issue, see: https://shopify.github.io/react-native-skia/docs/canvas/overview/#getting-the-canvas-size\"\n    );\n  }\n  const viewRef = useCanvasRefPriv(null);\n  // Native ID\n  const nativeId = useMemo(() => {\n    return SkiaViewNativeId.current++;\n  }, []);\n\n  // Root\n  const root = useMemo(() => new SkiaSGRoot(Skia, nativeId), [nativeId]);\n\n  useReanimatedFrame(() => {\n    \"worklet\";\n    if (onSize && measure) {\n      const result =\n        // eslint-disable-next-line no-nested-ternary\n        Platform.OS === \"web\"\n          ? // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-expect-error\n            viewRef.current?.canvasRef\n            ? // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n              // @ts-expect-error\n              measure(viewRef.current.canvasRef)\n            : { width: 0, height: 0 }\n          : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            measure(viewRef as any);\n      if (result) {\n        const { width, height } = result;\n        if (onSize.value.width !== width || onSize.value.height !== height) {\n          onSize.value = { width, height };\n        }\n      }\n    }\n  }, !!onSize);\n\n  // Render effects\n  useLayoutEffect(() => {\n    root.render(children);\n  }, [children, root, nativeId]);\n\n  useEffect(() => {\n    return () => {\n      root.unmount();\n    };\n  }, [root]);\n\n  // Component methods\n  useImperativeHandle(\n    ref,\n    () =>\n      ({\n        makeImageSnapshot: (rect?: SkRect) => {\n          return SkiaViewApi.makeImageSnapshot(nativeId, rect);\n        },\n        makeImageSnapshotAsync: (rect?: SkRect) => {\n          return SkiaViewApi.makeImageSnapshotAsync(nativeId, rect);\n        },\n        redraw: () => {\n          SkiaViewApi.requestRedraw(nativeId);\n        },\n        getNativeId: () => {\n          return nativeId;\n        },\n        measure: (callback) => {\n          viewRef.current?.measure(callback);\n        },\n        measureInWindow: (callback) => {\n          viewRef.current?.measureInWindow(callback);\n        },\n      }) as CanvasRef\n  );\n  return { nativeId, viewRef };\n};\n\nexport const Canvas = ({\n  debug,\n  opaque,\n  children,\n  onSize,\n  colorSpace = \"p3\",\n  highBitDepth = false,\n  androidWarmup = false,\n  android,\n  ref,\n  onLayout,\n  ...viewProps\n}: CanvasProps) => {\n  const { nativeId, viewRef } = useCanvasRoot({\n    children,\n    onSize,\n    ref,\n    onLayout,\n  });\n\n  const onLayoutWeb = useCallback(\n    (e: LayoutChangeEvent) => {\n      if (onLayout) {\n        onLayout(e);\n      }\n      if (Platform.OS === \"web\" && onSize) {\n        const { width, height } = e.nativeEvent.layout;\n        onSize.value = { width, height };\n      }\n    },\n    [onLayout, onSize]\n  );\n  return (\n    <SkiaPictureViewNativeComponent\n      ref={viewRef}\n      collapsable={false}\n      nativeID={`${nativeId}`}\n      debug={debug}\n      opaque={opaque}\n      colorSpace={colorSpace}\n      highBitDepth={highBitDepth}\n      androidWarmup={androidWarmup}\n      androidSurfaceType={resolveSurfaceType(android?.surfaceType)}\n      androidZOrderOnTop={!!android?.zOrderOnTop}\n      onLayout={\n        Platform.OS === \"web\" && (onSize || onLayout) ? onLayoutWeb : onLayout\n      }\n      {...viewProps}\n    />\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/module/renderer/DefaultCanvas.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { CanvasProps } from "./Canvas";
+/**
+ * `<Canvas>` renders {@link GraphiteCanvas} when React Native Skia is
+ * configured with the Graphite backend (install-skia-graphite), and the
+ * picture view based canvas otherwise. Both take the same props and ref.
+ */
+export declare const Canvas: (props: CanvasProps) => React.JSX.Element;

package/lib/module/renderer/DefaultCanvas.js

@@ -0,0 +1,34 @@
+import React from "react";
+import { Skia } from "../skia";
+import { Platform } from "../Platform";
+import { Canvas as PictureCanvas } from "./Canvas";
+import { GraphiteCanvas } from "./GraphiteCanvas";
+let useGraphite = null;
+
+// Whether this build runs the Graphite backend. Resolved on the first render
+// (the native API is installed by then) and cached: getNativeDevice() throws
+// on Ganesh builds. On the web, GraphiteCanvas is the regular canvas anyway.
+const hasGraphite = () => {
+  if (useGraphite === null) {
+    if (Platform.OS === "web") {
+      useGraphite = false;
+    } else {
+      try {
+        useGraphite = typeof Skia.getNativeDevice() === "bigint";
+      } catch {
+        useGraphite = false;
+      }
+    }
+  }
+  return useGraphite;
+};
+
+/**
+ * `<Canvas>` renders {@link GraphiteCanvas} when React Native Skia is
+ * configured with the Graphite backend (install-skia-graphite), and the
+ * picture view based canvas otherwise. Both take the same props and ref.
+ */
+export const Canvas = props => {
+  return hasGraphite() ? /*#__PURE__*/React.createElement(GraphiteCanvas, props) : /*#__PURE__*/React.createElement(PictureCanvas, props);
+};
+//# sourceMappingURL=DefaultCanvas.js.map

package/lib/module/renderer/DefaultCanvas.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Skia","Platform","Canvas","PictureCanvas","GraphiteCanvas","useGraphite","hasGraphite","OS","getNativeDevice","props","createElement"],"sources":["DefaultCanvas.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Skia } from \"../skia\";\nimport { Platform } from \"../Platform\";\n\nimport type { CanvasProps } from \"./Canvas\";\nimport { Canvas as PictureCanvas } from \"./Canvas\";\nimport { GraphiteCanvas } from \"./GraphiteCanvas\";\n\nlet useGraphite: boolean | null = null;\n\n// Whether this build runs the Graphite backend. Resolved on the first render\n// (the native API is installed by then) and cached: getNativeDevice() throws\n// on Ganesh builds. On the web, GraphiteCanvas is the regular canvas anyway.\nconst hasGraphite = () => {\n  if (useGraphite === null) {\n    if (Platform.OS === \"web\") {\n      useGraphite = false;\n    } else {\n      try {\n        useGraphite = typeof Skia.getNativeDevice() === \"bigint\";\n      } catch {\n        useGraphite = false;\n      }\n    }\n  }\n  return useGraphite;\n};\n\n/**\n * `<Canvas>` renders {@link GraphiteCanvas} when React Native Skia is\n * configured with the Graphite backend (install-skia-graphite), and the\n * picture view based canvas otherwise. Both take the same props and ref.\n */\nexport const Canvas = (props: CanvasProps) => {\n  return hasGraphite() ? (\n    <GraphiteCanvas {...props} />\n  ) : (\n    <PictureCanvas {...props} />\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,IAAI,QAAQ,SAAS;AAC9B,SAASC,QAAQ,QAAQ,aAAa;AAGtC,SAASC,MAAM,IAAIC,aAAa,QAAQ,UAAU;AAClD,SAASC,cAAc,QAAQ,kBAAkB;AAEjD,IAAIC,WAA2B,GAAG,IAAI;;AAEtC;AACA;AACA;AACA,MAAMC,WAAW,GAAGA,CAAA,KAAM;EACxB,IAAID,WAAW,KAAK,IAAI,EAAE;IACxB,IAAIJ,QAAQ,CAACM,EAAE,KAAK,KAAK,EAAE;MACzBF,WAAW,GAAG,KAAK;IACrB,CAAC,MAAM;MACL,IAAI;QACFA,WAAW,GAAG,OAAOL,IAAI,CAACQ,eAAe,CAAC,CAAC,KAAK,QAAQ;MAC1D,CAAC,CAAC,MAAM;QACNH,WAAW,GAAG,KAAK;MACrB;IACF;EACF;EACA,OAAOA,WAAW;AACpB,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMH,MAAM,GAAIO,KAAkB,IAAK;EAC5C,OAAOH,WAAW,CAAC,CAAC,gBAClBP,KAAA,CAAAW,aAAA,CAACN,cAAc,EAAKK,KAAQ,CAAC,gBAE7BV,KAAA,CAAAW,aAAA,CAACP,aAAa,EAAKM,KAAQ,CAC5B;AACH,CAAC","ignoreList":[]}