@shopify/react-native-skia 2.2.9 → 2.2.11

package/lib/commonjs/views/SkiaPictureView.web.js

@@ -4,33 +4,266 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.SkiaPictureView = void 0;
-var _SkiaBaseWebView = require("./SkiaBaseWebView");
+var _react = _interopRequireWildcard(require("react"));
+var _JsiSkSurface = require("../skia/web/JsiSkSurface");
+var _Platform = require("../Platform");
+var _SkiaViewNativeId = require("./SkiaViewNativeId");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+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); }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-class SkiaPictureView extends _SkiaBaseWebView.SkiaBaseWebView {
-  constructor(props) {
-    super(props);
-    _defineProperty(this, "picture", null);
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /* global HTMLCanvasElement */
+class WebGLRenderer {
+  constructor(canvas, pd) {
+    this.canvas = canvas;
+    this.pd = pd;
+    _defineProperty(this, "surface", null);
+    this.onResize();
+  }
+  makeImageSnapshot(picture, rect) {
+    if (!this.surface) {
+      return null;
+    }
+    const canvas = this.surface.getCanvas();
+    canvas.clear(CanvasKit.TRANSPARENT);
+    this.draw(picture);
+    this.surface.ref.flush();
+    return this.surface.makeImageSnapshot(rect);
+  }
+  onResize() {
     const {
-      nativeID
-    } = props;
-    if (!nativeID) {
-      throw new Error("SkiaPictureView requires a nativeID prop");
+      canvas,
+      pd
+    } = this;
+    canvas.width = canvas.clientWidth * pd;
+    canvas.height = canvas.clientHeight * pd;
+    const surface = CanvasKit.MakeWebGLCanvasSurface(canvas);
+    const ctx = canvas.getContext("webgl2");
+    if (ctx) {
+      ctx.drawingBufferColorSpace = "display-p3";
+    }
+    if (!surface) {
+      throw new Error("Could not create surface");
     }
-    global.SkiaViewApi.registerView(nativeID, this);
+    this.surface = new _JsiSkSurface.JsiSkSurface(CanvasKit, surface);
   }
-  setPicture(picture) {
-    this.picture = picture;
-    this.redraw();
+  draw(picture) {
+    if (this.surface) {
+      const canvas = this.surface.getCanvas();
+      canvas.clear(Float32Array.of(0, 0, 0, 0));
+      canvas.save();
+      canvas.scale(pd, pd);
+      canvas.drawPicture(picture);
+      canvas.restore();
+      this.surface.ref.flush();
+    }
   }
-  renderInCanvas(canvas) {
-    if (this.props.picture) {
-      canvas.drawPicture(this.props.picture);
-    } else if (this.picture) {
-      canvas.drawPicture(this.picture);
+  dispose() {
+    if (this.surface) {
+      var _this$canvas;
+      (_this$canvas = this.canvas) === null || _this$canvas === void 0 || (_this$canvas = _this$canvas.getContext("webgl2")) === null || _this$canvas === void 0 || (_this$canvas = _this$canvas.getExtension("WEBGL_lose_context")) === null || _this$canvas === void 0 || _this$canvas.loseContext();
+      this.surface.ref.delete();
+      this.surface = null;
     }
   }
 }
-exports.SkiaPictureView = SkiaPictureView;
+class StaticWebGLRenderer {
+  constructor(canvas, pd) {
+    this.canvas = canvas;
+    this.pd = pd;
+    _defineProperty(this, "cachedImage", null);
+  }
+  onResize() {
+    this.cachedImage = null;
+  }
+  renderPictureToSurface(picture) {
+    const tempCanvas = new OffscreenCanvas(this.canvas.clientWidth * this.pd, this.canvas.clientHeight * this.pd);
+    let surface = null;
+    try {
+      const webglSurface = CanvasKit.MakeWebGLCanvasSurface(tempCanvas);
+      const ctx = tempCanvas.getContext("webgl2");
+      if (ctx) {
+        ctx.drawingBufferColorSpace = "display-p3";
+      }
+      if (!webglSurface) {
+        throw new Error("Could not create WebGL surface");
+      }
+      surface = new _JsiSkSurface.JsiSkSurface(CanvasKit, webglSurface);
+      const skiaCanvas = surface.getCanvas();
+      skiaCanvas.clear(Float32Array.of(0, 0, 0, 0));
+      skiaCanvas.save();
+      skiaCanvas.scale(this.pd, this.pd);
+      skiaCanvas.drawPicture(picture);
+      skiaCanvas.restore();
+      surface.ref.flush();
+      return {
+        surface,
+        tempCanvas
+      };
+    } catch (error) {
+      if (surface) {
+        surface.ref.delete();
+      }
+      this.cleanupWebGLContext(tempCanvas);
+      return null;
+    }
+  }
+  cleanupWebGLContext(tempCanvas) {
+    const ctx = tempCanvas.getContext("webgl2");
+    if (ctx) {
+      const loseContext = ctx.getExtension("WEBGL_lose_context");
+      if (loseContext) {
+        loseContext.loseContext();
+      }
+    }
+  }
+  draw(picture) {
+    const renderResult = this.renderPictureToSurface(picture);
+    if (!renderResult) {
+      return;
+    }
+    const {
+      tempCanvas
+    } = renderResult;
+    const ctx2d = this.canvas.getContext("2d");
+    if (!ctx2d) {
+      throw new Error("Could not get 2D context");
+    }
+
+    // Set canvas dimensions to match pixel density
+    this.canvas.width = this.canvas.clientWidth * this.pd;
+    this.canvas.height = this.canvas.clientHeight * this.pd;
+
+    // Draw the tempCanvas scaled down to the display size
+    ctx2d.drawImage(tempCanvas, 0, 0, tempCanvas.width, tempCanvas.height, 0, 0, this.canvas.clientWidth * this.pd, this.canvas.clientHeight * this.pd);
+    this.cleanupWebGLContext(tempCanvas);
+  }
+  makeImageSnapshot(picture, rect) {
+    if (!this.cachedImage) {
+      const renderResult = this.renderPictureToSurface(picture);
+      if (!renderResult) {
+        return null;
+      }
+      const {
+        surface,
+        tempCanvas
+      } = renderResult;
+      try {
+        this.cachedImage = surface.makeImageSnapshot(rect);
+      } catch (error) {
+        console.error("Error creating image snapshot:", error);
+      } finally {
+        surface.ref.delete();
+        this.cleanupWebGLContext(tempCanvas);
+      }
+    }
+    return this.cachedImage;
+  }
+  dispose() {
+    var _this$cachedImage;
+    (_this$cachedImage = this.cachedImage) === null || _this$cachedImage === void 0 || _this$cachedImage.dispose();
+    this.cachedImage = null;
+  }
+}
+const pd = _Platform.Platform.PixelRatio;
+const SkiaPictureView = exports.SkiaPictureView = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  const canvasRef = (0, _react.useRef)(null);
+  const renderer = (0, _react.useRef)(null);
+  const redrawRequestsRef = (0, _react.useRef)(0);
+  const requestIdRef = (0, _react.useRef)(0);
+  const pictureRef = (0, _react.useRef)(null);
+  const {
+    picture,
+    onLayout
+  } = props;
+  const redraw = (0, _react.useCallback)(() => {
+    redrawRequestsRef.current++;
+  }, []);
+  const getSize = (0, _react.useCallback)(() => {
+    var _canvasRef$current, _canvasRef$current2;
+    return {
+      width: ((_canvasRef$current = canvasRef.current) === null || _canvasRef$current === void 0 ? void 0 : _canvasRef$current.clientWidth) || 0,
+      height: ((_canvasRef$current2 = canvasRef.current) === null || _canvasRef$current2 === void 0 ? void 0 : _canvasRef$current2.clientHeight) || 0
+    };
+  }, []);
+  const setPicture = (0, _react.useCallback)(newPicture => {
+    pictureRef.current = newPicture;
+    redraw();
+  }, [redraw]);
+  const makeImageSnapshot = (0, _react.useCallback)(rect => {
+    if (renderer.current && pictureRef.current) {
+      return renderer.current.makeImageSnapshot(pictureRef.current, rect);
+    }
+    return null;
+  }, []);
+  const tick = (0, _react.useCallback)(() => {
+    if (redrawRequestsRef.current > 0) {
+      redrawRequestsRef.current = 0;
+      if (renderer.current && pictureRef.current) {
+        renderer.current.draw(pictureRef.current);
+      }
+    }
+    requestIdRef.current = requestAnimationFrame(tick);
+  }, []);
+  const onLayoutEvent = (0, _react.useCallback)(evt => {
+    const canvas = canvasRef.current;
+    if (canvas) {
+      renderer.current = props.__destroyWebGLContextAfterRender === true ? new StaticWebGLRenderer(canvas, pd) : new WebGLRenderer(canvas, pd);
+      if (pictureRef.current) {
+        renderer.current.draw(pictureRef.current);
+      }
+    }
+    if (onLayout) {
+      onLayout(evt);
+    }
+  }, [onLayout, props.__destroyWebGLContextAfterRender]);
+  (0, _react.useImperativeHandle)(ref, () => ({
+    setPicture,
+    getSize,
+    redraw,
+    makeImageSnapshot
+  }), [setPicture, getSize, redraw, makeImageSnapshot]);
+  (0, _react.useEffect)(() => {
+    var _props$nativeID;
+    const nativeID = (_props$nativeID = props.nativeID) !== null && _props$nativeID !== void 0 ? _props$nativeID : `${_SkiaViewNativeId.SkiaViewNativeId.current++}`;
+    global.SkiaViewApi.registerView(nativeID, {
+      setPicture,
+      getSize,
+      redraw,
+      makeImageSnapshot
+    });
+    if (props.picture) {
+      setPicture(props.picture);
+    }
+  }, [setPicture, getSize, redraw, makeImageSnapshot, props]);
+  (0, _react.useEffect)(() => {
+    tick();
+    return () => {
+      cancelAnimationFrame(requestIdRef.current);
+      if (renderer.current) {
+        renderer.current.dispose();
+        renderer.current = null;
+      }
+    };
+  }, [tick]);
+  (0, _react.useEffect)(() => {
+    if (renderer.current && pictureRef.current) {
+      renderer.current.draw(pictureRef.current);
+    }
+  }, [picture, redraw]);
+  const {
+    debug = false,
+    ...viewProps
+  } = props;
+  return /*#__PURE__*/_react.default.createElement(_Platform.Platform.View, _extends({}, viewProps, {
+    onLayout: onLayoutEvent
+  }), /*#__PURE__*/_react.default.createElement("canvas", {
+    ref: canvasRef,
+    style: {
+      display: "flex",
+      flex: 1
+    }
+  }));
+});
 //# sourceMappingURL=SkiaPictureView.web.js.map

package/lib/commonjs/views/SkiaPictureView.web.js.map

@@ -1 +1 @@
-{"version":3,"names":["_SkiaBaseWebView","require","_defineProperty","e","r","t","_toPropertyKey","Object","defineProperty","value","enumerable","configurable","writable","i","_toPrimitive","Symbol","toPrimitive","call","TypeError","String","Number","SkiaPictureView","SkiaBaseWebView","constructor","props","nativeID","Error","global","SkiaViewApi","registerView","setPicture","picture","redraw","renderInCanvas","canvas","drawPicture","exports"],"sources":["SkiaPictureView.web.tsx"],"sourcesContent":["import type { SkCanvas, SkPicture } from \"../skia/types\";\nimport type { ISkiaViewApiWeb } from \"../specs/NativeSkiaModule.web\";\n\nimport type { SkiaPictureViewNativeProps } from \"./types\";\nimport { SkiaBaseWebView } from \"./SkiaBaseWebView\";\n\nexport class SkiaPictureView extends SkiaBaseWebView<SkiaPictureViewNativeProps> {\n  private picture: SkPicture | null = null;\n\n  constructor(props: SkiaPictureViewNativeProps) {\n    super(props);\n    const { nativeID } = props;\n    if (!nativeID) {\n      throw new Error(\"SkiaPictureView requires a nativeID prop\");\n    }\n    (global.SkiaViewApi as ISkiaViewApiWeb).registerView(nativeID, this);\n  }\n\n  public setPicture(picture: SkPicture) {\n    this.picture = picture;\n    this.redraw();\n  }\n\n  protected renderInCanvas(canvas: SkCanvas): void {\n    if (this.props.picture) {\n      canvas.drawPicture(this.props.picture);\n    } else if (this.picture) {\n      canvas.drawPicture(this.picture);\n    }\n  }\n}\n"],"mappings":";;;;;;AAIA,IAAAA,gBAAA,GAAAC,OAAA;AAAoD,SAAAC,gBAAAC,CAAA,EAAAC,CAAA,EAAAC,CAAA,YAAAD,CAAA,GAAAE,cAAA,CAAAF,CAAA,MAAAD,CAAA,GAAAI,MAAA,CAAAC,cAAA,CAAAL,CAAA,EAAAC,CAAA,IAAAK,KAAA,EAAAJ,CAAA,EAAAK,UAAA,MAAAC,YAAA,MAAAC,QAAA,UAAAT,CAAA,CAAAC,CAAA,IAAAC,CAAA,EAAAF,CAAA;AAAA,SAAAG,eAAAD,CAAA,QAAAQ,CAAA,GAAAC,YAAA,CAAAT,CAAA,uCAAAQ,CAAA,GAAAA,CAAA,GAAAA,CAAA;AAAA,SAAAC,aAAAT,CAAA,EAAAD,CAAA,2BAAAC,CAAA,KAAAA,CAAA,SAAAA,CAAA,MAAAF,CAAA,GAAAE,CAAA,CAAAU,MAAA,CAAAC,WAAA,kBAAAb,CAAA,QAAAU,CAAA,GAAAV,CAAA,CAAAc,IAAA,CAAAZ,CAAA,EAAAD,CAAA,uCAAAS,CAAA,SAAAA,CAAA,YAAAK,SAAA,yEAAAd,CAAA,GAAAe,MAAA,GAAAC,MAAA,EAAAf,CAAA;AAE7C,MAAMgB,eAAe,SAASC,gCAAe,CAA6B;EAG/EC,WAAWA,CAACC,KAAiC,EAAE;IAC7C,KAAK,CAACA,KAAK,CAAC;IAACtB,eAAA,kBAHqB,IAAI;IAItC,MAAM;MAAEuB;IAAS,CAAC,GAAGD,KAAK;IAC1B,IAAI,CAACC,QAAQ,EAAE;MACb,MAAM,IAAIC,KAAK,CAAC,0CAA0C,CAAC;IAC7D;IACCC,MAAM,CAACC,WAAW,CAAqBC,YAAY,CAACJ,QAAQ,EAAE,IAAI,CAAC;EACtE;EAEOK,UAAUA,CAACC,OAAkB,EAAE;IACpC,IAAI,CAACA,OAAO,GAAGA,OAAO;IACtB,IAAI,CAACC,MAAM,CAAC,CAAC;EACf;EAEUC,cAAcA,CAACC,MAAgB,EAAQ;IAC/C,IAAI,IAAI,CAACV,KAAK,CAACO,OAAO,EAAE;MACtBG,MAAM,CAACC,WAAW,CAAC,IAAI,CAACX,KAAK,CAACO,OAAO,CAAC;IACxC,CAAC,MAAM,IAAI,IAAI,CAACA,OAAO,EAAE;MACvBG,MAAM,CAACC,WAAW,CAAC,IAAI,CAACJ,OAAO,CAAC;IAClC;EACF;AACF;AAACK,OAAA,CAAAf,eAAA,GAAAA,eAAA","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_JsiSkSurface","_Platform","_SkiaViewNativeId","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","_defineProperty","_toPropertyKey","value","enumerable","configurable","writable","_toPrimitive","Symbol","toPrimitive","TypeError","String","Number","WebGLRenderer","constructor","canvas","pd","onResize","makeImageSnapshot","picture","rect","surface","getCanvas","clear","CanvasKit","TRANSPARENT","draw","ref","flush","width","clientWidth","height","clientHeight","MakeWebGLCanvasSurface","ctx","getContext","drawingBufferColorSpace","Error","JsiSkSurface","Float32Array","of","save","scale","drawPicture","restore","dispose","_this$canvas","getExtension","loseContext","delete","StaticWebGLRenderer","cachedImage","renderPictureToSurface","tempCanvas","OffscreenCanvas","webglSurface","skiaCanvas","error","cleanupWebGLContext","renderResult","ctx2d","drawImage","console","_this$cachedImage","Platform","PixelRatio","SkiaPictureView","exports","forwardRef","props","canvasRef","useRef","renderer","redrawRequestsRef","requestIdRef","pictureRef","onLayout","redraw","useCallback","current","getSize","_canvasRef$current","_canvasRef$current2","setPicture","newPicture","tick","requestAnimationFrame","onLayoutEvent","evt","__destroyWebGLContextAfterRender","useImperativeHandle","useEffect","_props$nativeID","nativeID","SkiaViewNativeId","global","SkiaViewApi","registerView","cancelAnimationFrame","debug","viewProps","createElement","View","style","display","flex"],"sources":["SkiaPictureView.web.tsx"],"sourcesContent":["/* global HTMLCanvasElement */\nimport React, {\n  useRef,\n  useEffect,\n  useCallback,\n  useImperativeHandle,\n  forwardRef,\n} from \"react\";\nimport type { LayoutChangeEvent } from \"react-native\";\n\nimport type { SkRect, SkPicture, SkImage } from \"../skia/types\";\nimport { JsiSkSurface } from \"../skia/web/JsiSkSurface\";\nimport { Platform } from \"../Platform\";\nimport type { ISkiaViewApiWeb } from \"../specs/NativeSkiaModule.web\";\n\nimport type { SkiaPictureViewNativeProps } from \"./types\";\nimport { SkiaViewNativeId } from \"./SkiaViewNativeId\";\n\ninterface Renderer {\n  onResize(): void;\n  draw(picture: SkPicture): void;\n  makeImageSnapshot(picture: SkPicture, rect?: SkRect): SkImage | null;\n  dispose(): void;\n}\n\nclass WebGLRenderer implements Renderer {\n  private surface: JsiSkSurface | null = null;\n\n  constructor(private canvas: HTMLCanvasElement, private pd: number) {\n    this.onResize();\n  }\n\n  makeImageSnapshot(picture: SkPicture, rect?: SkRect): SkImage | null {\n    if (!this.surface) {\n      return null;\n    }\n    const canvas = this.surface.getCanvas();\n    canvas!.clear(CanvasKit.TRANSPARENT);\n    this.draw(picture);\n    this.surface.ref.flush();\n    return this.surface.makeImageSnapshot(rect);\n  }\n\n  onResize() {\n    const { canvas, pd } = this;\n    canvas.width = canvas.clientWidth * pd;\n    canvas.height = canvas.clientHeight * pd;\n    const surface = CanvasKit.MakeWebGLCanvasSurface(canvas);\n    const ctx = canvas.getContext(\"webgl2\");\n    if (ctx) {\n      ctx.drawingBufferColorSpace = \"display-p3\";\n    }\n    if (!surface) {\n      throw new Error(\"Could not create surface\");\n    }\n    this.surface = new JsiSkSurface(CanvasKit, surface);\n  }\n\n  draw(picture: SkPicture) {\n    if (this.surface) {\n      const canvas = this.surface.getCanvas();\n      canvas.clear(Float32Array.of(0, 0, 0, 0));\n      canvas.save();\n      canvas.scale(pd, pd);\n      canvas.drawPicture(picture);\n      canvas.restore();\n      this.surface.ref.flush();\n    }\n  }\n\n  dispose(): void {\n    if (this.surface) {\n      this.canvas\n        ?.getContext(\"webgl2\")\n        ?.getExtension(\"WEBGL_lose_context\")\n        ?.loseContext();\n      this.surface.ref.delete();\n      this.surface = null;\n    }\n  }\n}\n\nclass StaticWebGLRenderer implements Renderer {\n  private cachedImage: SkImage | null = null;\n\n  constructor(private canvas: HTMLCanvasElement, private pd: number) {}\n\n  onResize(): void {\n    this.cachedImage = null;\n  }\n\n  private renderPictureToSurface(\n    picture: SkPicture\n  ): { surface: JsiSkSurface; tempCanvas: OffscreenCanvas } | null {\n    const tempCanvas = new OffscreenCanvas(\n      this.canvas.clientWidth * this.pd,\n      this.canvas.clientHeight * this.pd\n    );\n\n    let surface: JsiSkSurface | null = null;\n\n    try {\n      const webglSurface = CanvasKit.MakeWebGLCanvasSurface(tempCanvas);\n      const ctx = tempCanvas.getContext(\"webgl2\");\n      if (ctx) {\n        ctx.drawingBufferColorSpace = \"display-p3\";\n      }\n\n      if (!webglSurface) {\n        throw new Error(\"Could not create WebGL surface\");\n      }\n\n      surface = new JsiSkSurface(CanvasKit, webglSurface);\n\n      const skiaCanvas = surface.getCanvas();\n      skiaCanvas.clear(Float32Array.of(0, 0, 0, 0));\n      skiaCanvas.save();\n      skiaCanvas.scale(this.pd, this.pd);\n      skiaCanvas.drawPicture(picture);\n      skiaCanvas.restore();\n      surface.ref.flush();\n\n      return { surface, tempCanvas };\n    } catch (error) {\n      if (surface) {\n        surface.ref.delete();\n      }\n      this.cleanupWebGLContext(tempCanvas);\n      return null;\n    }\n  }\n\n  private cleanupWebGLContext(tempCanvas: OffscreenCanvas): void {\n    const ctx = tempCanvas.getContext(\"webgl2\");\n    if (ctx) {\n      const loseContext = ctx.getExtension(\"WEBGL_lose_context\");\n      if (loseContext) {\n        loseContext.loseContext();\n      }\n    }\n  }\n\n  draw(picture: SkPicture): void {\n    const renderResult = this.renderPictureToSurface(picture);\n    if (!renderResult) {\n      return;\n    }\n    const { tempCanvas } = renderResult;\n    const ctx2d = this.canvas.getContext(\"2d\");\n    if (!ctx2d) {\n      throw new Error(\"Could not get 2D context\");\n    }\n\n    // Set canvas dimensions to match pixel density\n    this.canvas.width = this.canvas.clientWidth * this.pd;\n    this.canvas.height = this.canvas.clientHeight * this.pd;\n\n    // Draw the tempCanvas scaled down to the display size\n    ctx2d.drawImage(\n      tempCanvas,\n      0,\n      0,\n      tempCanvas.width,\n      tempCanvas.height,\n      0,\n      0,\n      this.canvas.clientWidth * this.pd,\n      this.canvas.clientHeight * this.pd\n    );\n\n    this.cleanupWebGLContext(tempCanvas);\n  }\n\n  makeImageSnapshot(picture: SkPicture, rect?: SkRect): SkImage | null {\n    if (!this.cachedImage) {\n      const renderResult = this.renderPictureToSurface(picture);\n      if (!renderResult) {\n        return null;\n      }\n\n      const { surface, tempCanvas } = renderResult;\n\n      try {\n        this.cachedImage = surface.makeImageSnapshot(rect);\n      } catch (error) {\n        console.error(\"Error creating image snapshot:\", error);\n      } finally {\n        surface.ref.delete();\n        this.cleanupWebGLContext(tempCanvas);\n      }\n    }\n\n    return this.cachedImage;\n  }\n\n  dispose(): void {\n    this.cachedImage?.dispose();\n    this.cachedImage = null;\n  }\n}\n\nconst pd = Platform.PixelRatio;\n\nexport interface SkiaPictureViewHandle {\n  setPicture(picture: SkPicture): void;\n  getSize(): { width: number; height: number };\n  redraw(): void;\n  makeImageSnapshot(rect?: SkRect): SkImage | null;\n}\n\nexport const SkiaPictureView = forwardRef<\n  SkiaPictureViewHandle,\n  SkiaPictureViewNativeProps\n>((props, ref) => {\n  const canvasRef = useRef<HTMLCanvasElement | null>(null);\n  const renderer = useRef<Renderer | null>(null);\n  const redrawRequestsRef = useRef(0);\n  const requestIdRef = useRef(0);\n  const pictureRef = useRef<SkPicture | null>(null);\n\n  const { picture, onLayout } = props;\n\n  const redraw = useCallback(() => {\n    redrawRequestsRef.current++;\n  }, []);\n\n  const getSize = useCallback(() => {\n    return {\n      width: canvasRef.current?.clientWidth || 0,\n      height: canvasRef.current?.clientHeight || 0,\n    };\n  }, []);\n\n  const setPicture = useCallback(\n    (newPicture: SkPicture) => {\n      pictureRef.current = newPicture;\n      redraw();\n    },\n    [redraw]\n  );\n\n  const makeImageSnapshot = useCallback((rect?: SkRect) => {\n    if (renderer.current && pictureRef.current) {\n      return renderer.current.makeImageSnapshot(pictureRef.current, rect);\n    }\n    return null;\n  }, []);\n\n  const tick = useCallback(() => {\n    if (redrawRequestsRef.current > 0) {\n      redrawRequestsRef.current = 0;\n      if (renderer.current && pictureRef.current) {\n        renderer.current.draw(pictureRef.current);\n      }\n    }\n    requestIdRef.current = requestAnimationFrame(tick);\n  }, []);\n\n  const onLayoutEvent = useCallback(\n    (evt: LayoutChangeEvent) => {\n      const canvas = canvasRef.current;\n      if (canvas) {\n        renderer.current =\n          props.__destroyWebGLContextAfterRender === true\n            ? new StaticWebGLRenderer(canvas, pd)\n            : new WebGLRenderer(canvas, pd);\n        if (pictureRef.current) {\n          renderer.current.draw(pictureRef.current);\n        }\n      }\n      if (onLayout) {\n        onLayout(evt);\n      }\n    },\n    [onLayout, props.__destroyWebGLContextAfterRender]\n  );\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      setPicture,\n      getSize,\n      redraw,\n      makeImageSnapshot,\n    }),\n    [setPicture, getSize, redraw, makeImageSnapshot]\n  );\n\n  useEffect(() => {\n    const nativeID = props.nativeID ?? `${SkiaViewNativeId.current++}`;\n    (global.SkiaViewApi as ISkiaViewApiWeb).registerView(nativeID, {\n      setPicture,\n      getSize,\n      redraw,\n      makeImageSnapshot,\n    } as SkiaPictureViewHandle);\n    if (props.picture) {\n      setPicture(props.picture);\n    }\n  }, [setPicture, getSize, redraw, makeImageSnapshot, props]);\n\n  useEffect(() => {\n    tick();\n    return () => {\n      cancelAnimationFrame(requestIdRef.current);\n      if (renderer.current) {\n        renderer.current.dispose();\n        renderer.current = null;\n      }\n    };\n  }, [tick]);\n\n  useEffect(() => {\n    if (renderer.current && pictureRef.current) {\n      renderer.current.draw(pictureRef.current);\n    }\n  }, [picture, redraw]);\n\n  const { debug = false, ...viewProps } = props;\n  return (\n    <Platform.View {...viewProps} onLayout={onLayoutEvent}>\n      <canvas ref={canvasRef} style={{ display: \"flex\", flex: 1 }} />\n    </Platform.View>\n  );\n});\n"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/views/types.d.ts

@@ -26,6 +26,7 @@ export interface SkiaBaseViewProps extends ViewProps {
      */
     onSize?: SharedValue<SkSize>;
     opaque?: boolean;
+    __destroyWebGLContextAfterRender?: boolean;
 }
 export interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {
     picture?: SkPicture;

package/lib/commonjs/views/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type { ViewProps } from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport type { Node } from \"../dom/types\";\nimport type { SkImage, SkPicture, SkRect, SkSize } from \"../skia/types\";\n\nexport type NativeSkiaViewProps = ViewProps & {\n  debug?: boolean;\n  opaque?: boolean;\n};\n\nexport interface ISkiaViewApi {\n  web?: boolean;\n  setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;\n  requestRedraw: (nativeId: number) => void;\n  makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;\n  makeImageSnapshotAsync: (nativeId: number, rect?: SkRect) => Promise<SkImage>;\n  size: (nativeId: number) => SkSize;\n}\n\nexport interface SkiaBaseViewProps extends ViewProps {\n  /**\n   * When set to true the view will display information about the\n   * average time it takes to render.\n   */\n  debug?: boolean;\n  /**\n   * Pass an animated value to the onSize property to get updates when\n   * the Skia view is resized.\n   */\n  onSize?: SharedValue<SkSize>;\n\n  opaque?: boolean;\n}\n\nexport interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {\n  picture?: SkPicture;\n}\n\nexport interface SkiaDomViewNativeProps extends SkiaBaseViewProps {\n  root?: Node<unknown>;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type { ViewProps } from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport type { Node } from \"../dom/types\";\nimport type { SkImage, SkPicture, SkRect, SkSize } from \"../skia/types\";\n\nexport type NativeSkiaViewProps = ViewProps & {\n  debug?: boolean;\n  opaque?: boolean;\n};\n\nexport interface ISkiaViewApi {\n  web?: boolean;\n  setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;\n  requestRedraw: (nativeId: number) => void;\n  makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;\n  makeImageSnapshotAsync: (nativeId: number, rect?: SkRect) => Promise<SkImage>;\n  size: (nativeId: number) => SkSize;\n}\n\nexport interface SkiaBaseViewProps extends ViewProps {\n  /**\n   * When set to true the view will display information about the\n   * average time it takes to render.\n   */\n  debug?: boolean;\n  /**\n   * Pass an animated value to the onSize property to get updates when\n   * the Skia view is resized.\n   */\n  onSize?: SharedValue<SkSize>;\n\n  opaque?: boolean;\n\n  // On web, only 16 WebGL contextes are allowed. If the drawing is non-animated, set\n  // __destroyWebGLContextAfterRender to true to release the context after each draw.\n  __destroyWebGLContextAfterRender?: boolean;\n}\n\nexport interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {\n  picture?: SkPicture;\n}\n\nexport interface SkiaDomViewNativeProps extends SkiaBaseViewProps {\n  root?: Node<unknown>;\n}\n"],"mappings":"","ignoreList":[]}

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

@@ -23,5 +23,6 @@ export interface CanvasProps extends Omit<ViewProps, "onLayout"> {
     onSize?: SharedValue<SkSize>;
     colorSpace?: "p3" | "srgb";
     ref?: React.Ref<CanvasRef>;
+    __destroyWebGLContextAfterRender?: boolean;
 }
 export declare const Canvas: ({ debug, opaque, children, onSize, colorSpace, ref, onLayout, ...viewProps }: CanvasProps) => React.JSX.Element;

package/lib/module/renderer/Canvas.js

@@ -1,10 +1,11 @@
 var _global;
 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); }
-import React, { useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
+import React, { useCallback, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { SkiaViewNativeId } from "../views/SkiaViewNativeId";
 import SkiaPictureViewNativeComponent from "../specs/SkiaPictureViewNativeComponent";
 import { SkiaSGRoot } from "../sksg/Reconciler";
 import { Skia } from "../skia";
+import { Platform } from "../Platform";
 export const useCanvasRef = () => useRef(null);
 export const useCanvasSize = userRef => {
   const ourRef = useCanvasRef();
@@ -92,13 +93,29 @@ export const Canvas = ({
       (_viewRef$current2 = viewRef.current) === null || _viewRef$current2 === void 0 || _viewRef$current2.measureInWindow(callback);
     }
   }));
+  const onLayoutWeb = useCallback(e => {
+    if (onLayout) {
+      onLayout(e);
+    }
+    if (Platform.OS === "web" && onSize) {
+      const {
+        width,
+        height
+      } = e.nativeEvent.layout;
+      onSize.value = {
+        width,
+        height
+      };
+    }
+  }, [onLayout, onSize]);
   return /*#__PURE__*/React.createElement(SkiaPictureViewNativeComponent, _extends({
     ref: viewRef,
     collapsable: false,
     nativeID: `${nativeId}`,
     debug: debug,
     opaque: opaque,
-    colorSpace: colorSpace
+    colorSpace: colorSpace,
+    onLayout: onLayoutWeb
   }, viewProps));
 };
 //# sourceMappingURL=Canvas.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useImperativeHandle","useLayoutEffect","useMemo","useRef","useState","SkiaViewNativeId","SkiaPictureViewNativeComponent","SkiaSGRoot","Skia","useCanvasRef","useCanvasSize","userRef","ourRef","ref","size","setSize","width","height","current","measure","_x","_y","isFabric","Boolean","_global","global","nativeFabricUIManager","Canvas","debug","opaque","children","onSize","colorSpace","onLayout","viewProps","console","error","viewRef","nativeId","root","render","unmount","makeImageSnapshot","rect","SkiaViewApi","makeImageSnapshotAsync","redraw","requestRedraw","getNativeId","callback","_viewRef$current","measureInWindow","_viewRef$current2","createElement","_extends","collapsable","nativeID"],"sources":["Canvas.tsx"],"sourcesContent":["import type { FC, RefObject } from \"react\";\nimport React, {\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport type {\n  MeasureInWindowOnSuccessCallback,\n  MeasureOnSuccessCallback,\n  View,\n  ViewProps,\n} from \"react-native\";\nimport { type SharedValue } from \"react-native-reanimated\";\n\nimport { SkiaViewNativeId } from \"../views/SkiaViewNativeId\";\nimport SkiaPictureViewNativeComponent from \"../specs/SkiaPictureViewNativeComponent\";\nimport type { SkImage, SkRect, SkSize } from \"../skia/types\";\nimport { SkiaSGRoot } from \"../sksg/Reconciler\";\nimport { Skia } from \"../skia\";\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\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\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const isFabric = Boolean((global as any)?.nativeFabricUIManager);\n\nexport interface CanvasProps extends Omit<ViewProps, \"onLayout\"> {\n  debug?: boolean;\n  opaque?: boolean;\n  onSize?: SharedValue<SkSize>;\n  colorSpace?: \"p3\" | \"srgb\";\n  ref?: React.Ref<CanvasRef>;\n}\n\nexport const Canvas = ({\n  debug,\n  opaque,\n  children,\n  onSize,\n  colorSpace = \"p3\",\n  ref,\n  // Here know this is a type error but this is done on purpose to check it at runtime\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  // @ts-expect-error\n  onLayout,\n  ...viewProps\n}: CanvasProps) => {\n  if (onLayout && isFabric) {\n    console.error(\n      // eslint-disable-next-line max-len\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 = useRef<View>(null);\n  // Native ID\n  const nativeId = useMemo(() => {\n    return SkiaViewNativeId.current++;\n  }, []);\n\n  // Root\n  const root = useMemo(\n    () => new SkiaSGRoot(Skia, nativeId, onSize),\n    [nativeId, onSize]\n  );\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  return (\n    <SkiaPictureViewNativeComponent\n      ref={viewRef}\n      collapsable={false}\n      nativeID={`${nativeId}`}\n      debug={debug}\n      opaque={opaque}\n      colorSpace={colorSpace}\n      {...viewProps}\n    />\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useEffect","useImperativeHandle","useLayoutEffect","useMemo","useRef","useState","SkiaViewNativeId","SkiaPictureViewNativeComponent","SkiaSGRoot","Skia","Platform","useCanvasRef","useCanvasSize","userRef","ourRef","ref","size","setSize","width","height","current","measure","_x","_y","isFabric","Boolean","_global","global","nativeFabricUIManager","Canvas","debug","opaque","children","onSize","colorSpace","onLayout","viewProps","console","error","viewRef","nativeId","root","render","unmount","makeImageSnapshot","rect","SkiaViewApi","makeImageSnapshotAsync","redraw","requestRedraw","getNativeId","callback","_viewRef$current","measureInWindow","_viewRef$current2","onLayoutWeb","e","OS","nativeEvent","layout","value","createElement","_extends","collapsable","nativeID"],"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 { SkiaViewNativeId } from \"../views/SkiaViewNativeId\";\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\";\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\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\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const isFabric = Boolean((global as any)?.nativeFabricUIManager);\n\nexport interface CanvasProps extends Omit<ViewProps, \"onLayout\"> {\n  debug?: boolean;\n  opaque?: boolean;\n  onSize?: SharedValue<SkSize>;\n  colorSpace?: \"p3\" | \"srgb\";\n  ref?: React.Ref<CanvasRef>;\n  __destroyWebGLContextAfterRender?: boolean;\n}\n\nexport const Canvas = ({\n  debug,\n  opaque,\n  children,\n  onSize,\n  colorSpace = \"p3\",\n  ref,\n  // Here know this is a type error but this is done on purpose to check it at runtime\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  // @ts-expect-error\n  onLayout,\n  ...viewProps\n}: CanvasProps) => {\n  if (onLayout && isFabric) {\n    console.error(\n      // eslint-disable-next-line max-len\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 = useRef<View>(null);\n  // Native ID\n  const nativeId = useMemo(() => {\n    return SkiaViewNativeId.current++;\n  }, []);\n\n  // Root\n  const root = useMemo(\n    () => new SkiaSGRoot(Skia, nativeId, onSize),\n    [nativeId, onSize]\n  );\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\n  return (\n    <SkiaPictureViewNativeComponent\n      ref={viewRef}\n      collapsable={false}\n      nativeID={`${nativeId}`}\n      debug={debug}\n      opaque={opaque}\n      colorSpace={colorSpace}\n      onLayout={onLayoutWeb}\n      {...viewProps}\n    />\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/module/sksg/Container.d.ts

@@ -1,4 +1,4 @@
 import type { SharedValue } from "react-native-reanimated";
 import type { Skia, SkSize } from "../skia/types";
 import { StaticContainer } from "./StaticContainer";
-export declare const createContainer: (Skia: Skia, nativeId: number, onSize?: SharedValue<SkSize>) => StaticContainer;
+export declare const createContainer: (Skia: Skia, nativeId: number, _onSize?: SharedValue<SkSize>) => StaticContainer;

package/lib/module/sksg/Container.js

@@ -1,5 +1,5 @@
 import { StaticContainer } from "./StaticContainer";
-export const createContainer = (Skia, nativeId, onSize) => {
-  return new StaticContainer(Skia, nativeId, onSize);
+export const createContainer = (Skia, nativeId, _onSize) => {
+  return new StaticContainer(Skia, nativeId);
 };
 //# sourceMappingURL=Container.js.map

package/lib/module/sksg/Container.js.map

@@ -1 +1 @@
-{"version":3,"names":["StaticContainer","createContainer","Skia","nativeId","onSize"],"sources":["Container.ts"],"sourcesContent":["import type { SharedValue } from \"react-native-reanimated\";\n\nimport type { Skia, SkSize } from \"../skia/types\";\n\nimport { StaticContainer } from \"./StaticContainer\";\n\nexport const createContainer = (\n  Skia: Skia,\n  nativeId: number,\n  onSize?: SharedValue<SkSize>\n) => {\n  return new StaticContainer(Skia, nativeId, onSize);\n};\n"],"mappings":"AAIA,SAASA,eAAe,QAAQ,mBAAmB;AAEnD,OAAO,MAAMC,eAAe,GAAGA,CAC7BC,IAAU,EACVC,QAAgB,EAChBC,MAA4B,KACzB;EACH,OAAO,IAAIJ,eAAe,CAACE,IAAI,EAAEC,QAAQ,EAAEC,MAAM,CAAC;AACpD,CAAC","ignoreList":[]}
+{"version":3,"names":["StaticContainer","createContainer","Skia","nativeId","_onSize"],"sources":["Container.ts"],"sourcesContent":["import type { SharedValue } from \"react-native-reanimated\";\n\nimport type { Skia, SkSize } from \"../skia/types\";\n\nimport { StaticContainer } from \"./StaticContainer\";\n\nexport const createContainer = (\n  Skia: Skia,\n  nativeId: number,\n  _onSize?: SharedValue<SkSize>\n) => {\n  return new StaticContainer(Skia, nativeId);\n};\n"],"mappings":"AAIA,SAASA,eAAe,QAAQ,mBAAmB;AAEnD,OAAO,MAAMC,eAAe,GAAGA,CAC7BC,IAAU,EACVC,QAAgB,EAChBC,OAA6B,KAC1B;EACH,OAAO,IAAIJ,eAAe,CAACE,IAAI,EAAEC,QAAQ,CAAC;AAC5C,CAAC","ignoreList":[]}

package/lib/module/sksg/Container.native.js

@@ -11,13 +11,10 @@ import "../views/api";
 const nativeDrawOnscreen = (nativeId, recorder, onSize) => {
   "worklet";
 
-  //const start = performance.now();
   if (onSize) {
-    const size = SkiaViewApi.size(nativeId);
-    if (size.width !== onSize.value.width || size.height !== onSize.value.height) {
-      onSize.value = size;
-    }
+    SkiaViewApi.setJsiProperty(nativeId, "onSize", onSize);
   }
+  //const start = performance.now();
   const picture = recorder.play();
   //const end = performance.now();
   //console.log("Recording time: ", end - start);

package/lib/module/sksg/Container.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["Rea","HAS_REANIMATED_3","ReanimatedRecorder","Container","StaticContainer","visit","nativeDrawOnscreen","nativeId","recorder","onSize","size","SkiaViewApi","width","value","height","picture","play","setJsiProperty","NativeReanimatedContainer","constructor","Skia","_defineProperty","redraw","mapperId","stopMapper","unmounted","root","sharedValues","getSharedValues","sharedRecorder","getRecorder","runOnUI","length","startMapper","applyUpdates","createContainer"],"sources":["Container.native.ts"],"sourcesContent":["import type { SharedValue } from \"react-native-reanimated\";\n\nimport Rea from \"../external/reanimated/ReanimatedProxy\";\nimport type { Skia, SkSize } from \"../skia/types\";\nimport { HAS_REANIMATED_3 } from \"../external/reanimated/renderHelpers\";\nimport type { JsiRecorder } from \"../skia/types/Recorder\";\n\nimport { ReanimatedRecorder } from \"./Recorder/ReanimatedRecorder\";\nimport { Container, StaticContainer } from \"./StaticContainer\";\nimport { visit } from \"./Recorder/Visitor\";\n\nimport \"../skia/NativeSetup\";\nimport \"../views/api\";\n\nconst nativeDrawOnscreen = (\n  nativeId: number,\n  recorder: JsiRecorder,\n  onSize?: SharedValue<SkSize>\n) => {\n  \"worklet\";\n\n  //const start = performance.now();\n  if (onSize) {\n    const size = SkiaViewApi.size(nativeId);\n    if (\n      size.width !== onSize.value.width ||\n      size.height !== onSize.value.height\n    ) {\n      onSize.value = size;\n    }\n  }\n  const picture = recorder.play();\n  //const end = performance.now();\n  //console.log(\"Recording time: \", end - start);\n  SkiaViewApi.setJsiProperty(nativeId, \"picture\", picture);\n};\n\nclass NativeReanimatedContainer extends Container {\n  private mapperId: number | null = null;\n\n  constructor(\n    Skia: Skia,\n    private nativeId: number,\n    private onSize?: SharedValue<SkSize>\n  ) {\n    super(Skia);\n  }\n\n  redraw() {\n    if (this.mapperId !== null) {\n      Rea.stopMapper(this.mapperId);\n    }\n    if (this.unmounted) {\n      return;\n    }\n    const { nativeId, Skia } = this;\n    const recorder = new ReanimatedRecorder(Skia);\n    visit(recorder, this.root);\n    const sharedValues = recorder.getSharedValues();\n    const sharedRecorder = recorder.getRecorder();\n    Rea.runOnUI((onSize?: SharedValue<SkSize>) => {\n      \"worklet\";\n      nativeDrawOnscreen(nativeId, sharedRecorder, onSize);\n    })(this.onSize);\n    if (sharedValues.length > 0) {\n      const { onSize } = this;\n      this.mapperId = Rea.startMapper(() => {\n        \"worklet\";\n        sharedRecorder.applyUpdates(sharedValues);\n        nativeDrawOnscreen(nativeId, sharedRecorder, onSize);\n      }, sharedValues);\n    }\n  }\n}\n\nexport const createContainer = (\n  Skia: Skia,\n  nativeId: number,\n  onSize?: SharedValue<SkSize>\n) => {\n  if (HAS_REANIMATED_3 && nativeId !== -1) {\n    return new NativeReanimatedContainer(Skia, nativeId, onSize);\n  } else {\n    return new StaticContainer(Skia, nativeId);\n  }\n};\n"],"mappings":";;;AAEA,OAAOA,GAAG,MAAM,wCAAwC;AAExD,SAASC,gBAAgB,QAAQ,sCAAsC;AAGvE,SAASC,kBAAkB,QAAQ,+BAA+B;AAClE,SAASC,SAAS,EAAEC,eAAe,QAAQ,mBAAmB;AAC9D,SAASC,KAAK,QAAQ,oBAAoB;AAE1C,OAAO,qBAAqB;AAC5B,OAAO,cAAc;AAErB,MAAMC,kBAAkB,GAAGA,CACzBC,QAAgB,EAChBC,QAAqB,EACrBC,MAA4B,KACzB;EACH,SAAS;;EAET;EACA,IAAIA,MAAM,EAAE;IACV,MAAMC,IAAI,GAAGC,WAAW,CAACD,IAAI,CAACH,QAAQ,CAAC;IACvC,IACEG,IAAI,CAACE,KAAK,KAAKH,MAAM,CAACI,KAAK,CAACD,KAAK,IACjCF,IAAI,CAACI,MAAM,KAAKL,MAAM,CAACI,KAAK,CAACC,MAAM,EACnC;MACAL,MAAM,CAACI,KAAK,GAAGH,IAAI;IACrB;EACF;EACA,MAAMK,OAAO,GAAGP,QAAQ,CAACQ,IAAI,CAAC,CAAC;EAC/B;EACA;EACAL,WAAW,CAACM,cAAc,CAACV,QAAQ,EAAE,SAAS,EAAEQ,OAAO,CAAC;AAC1D,CAAC;AAED,MAAMG,yBAAyB,SAASf,SAAS,CAAC;EAGhDgB,WAAWA,CACTC,IAAU,EACFb,QAAgB,EAChBE,MAA4B,EACpC;IACA,KAAK,CAACW,IAAI,CAAC;IAAC,KAHJb,QAAgB,GAAhBA,QAAgB;IAAA,KAChBE,MAA4B,GAA5BA,MAA4B;IAAAY,eAAA,mBALJ,IAAI;EAQtC;EAEAC,MAAMA,CAAA,EAAG;IACP,IAAI,IAAI,CAACC,QAAQ,KAAK,IAAI,EAAE;MAC1BvB,GAAG,CAACwB,UAAU,CAAC,IAAI,CAACD,QAAQ,CAAC;IAC/B;IACA,IAAI,IAAI,CAACE,SAAS,EAAE;MAClB;IACF;IACA,MAAM;MAAElB,QAAQ;MAAEa;IAAK,CAAC,GAAG,IAAI;IAC/B,MAAMZ,QAAQ,GAAG,IAAIN,kBAAkB,CAACkB,IAAI,CAAC;IAC7Cf,KAAK,CAACG,QAAQ,EAAE,IAAI,CAACkB,IAAI,CAAC;IAC1B,MAAMC,YAAY,GAAGnB,QAAQ,CAACoB,eAAe,CAAC,CAAC;IAC/C,MAAMC,cAAc,GAAGrB,QAAQ,CAACsB,WAAW,CAAC,CAAC;IAC7C9B,GAAG,CAAC+B,OAAO,CAAEtB,MAA4B,IAAK;MAC5C,SAAS;;MACTH,kBAAkB,CAACC,QAAQ,EAAEsB,cAAc,EAAEpB,MAAM,CAAC;IACtD,CAAC,CAAC,CAAC,IAAI,CAACA,MAAM,CAAC;IACf,IAAIkB,YAAY,CAACK,MAAM,GAAG,CAAC,EAAE;MAC3B,MAAM;QAAEvB;MAAO,CAAC,GAAG,IAAI;MACvB,IAAI,CAACc,QAAQ,GAAGvB,GAAG,CAACiC,WAAW,CAAC,MAAM;QACpC,SAAS;;QACTJ,cAAc,CAACK,YAAY,CAACP,YAAY,CAAC;QACzCrB,kBAAkB,CAACC,QAAQ,EAAEsB,cAAc,EAAEpB,MAAM,CAAC;MACtD,CAAC,EAAEkB,YAAY,CAAC;IAClB;EACF;AACF;AAEA,OAAO,MAAMQ,eAAe,GAAGA,CAC7Bf,IAAU,EACVb,QAAgB,EAChBE,MAA4B,KACzB;EACH,IAAIR,gBAAgB,IAAIM,QAAQ,KAAK,CAAC,CAAC,EAAE;IACvC,OAAO,IAAIW,yBAAyB,CAACE,IAAI,EAAEb,QAAQ,EAAEE,MAAM,CAAC;EAC9D,CAAC,MAAM;IACL,OAAO,IAAIL,eAAe,CAACgB,IAAI,EAAEb,QAAQ,CAAC;EAC5C;AACF,CAAC","ignoreList":[]}
+{"version":3,"names":["Rea","HAS_REANIMATED_3","ReanimatedRecorder","Container","StaticContainer","visit","nativeDrawOnscreen","nativeId","recorder","onSize","SkiaViewApi","setJsiProperty","picture","play","NativeReanimatedContainer","constructor","Skia","_defineProperty","redraw","mapperId","stopMapper","unmounted","root","sharedValues","getSharedValues","sharedRecorder","getRecorder","runOnUI","length","startMapper","applyUpdates","createContainer"],"sources":["Container.native.ts"],"sourcesContent":["import type { SharedValue } from \"react-native-reanimated\";\n\nimport Rea from \"../external/reanimated/ReanimatedProxy\";\nimport type { Skia, SkSize } from \"../skia/types\";\nimport { HAS_REANIMATED_3 } from \"../external/reanimated/renderHelpers\";\nimport type { JsiRecorder } from \"../skia/types/Recorder\";\n\nimport { ReanimatedRecorder } from \"./Recorder/ReanimatedRecorder\";\nimport { Container, StaticContainer } from \"./StaticContainer\";\nimport { visit } from \"./Recorder/Visitor\";\n\nimport \"../skia/NativeSetup\";\nimport \"../views/api\";\n\nconst nativeDrawOnscreen = (\n  nativeId: number,\n  recorder: JsiRecorder,\n  onSize?: SharedValue<SkSize>\n) => {\n  \"worklet\";\n  if (onSize) {\n    SkiaViewApi.setJsiProperty(nativeId, \"onSize\", onSize);\n  }\n  //const start = performance.now();\n  const picture = recorder.play();\n  //const end = performance.now();\n  //console.log(\"Recording time: \", end - start);\n  SkiaViewApi.setJsiProperty(nativeId, \"picture\", picture);\n};\n\nclass NativeReanimatedContainer extends Container {\n  private mapperId: number | null = null;\n\n  constructor(\n    Skia: Skia,\n    private nativeId: number,\n    private onSize?: SharedValue<SkSize>\n  ) {\n    super(Skia);\n  }\n\n  redraw() {\n    if (this.mapperId !== null) {\n      Rea.stopMapper(this.mapperId);\n    }\n    if (this.unmounted) {\n      return;\n    }\n    const { nativeId, Skia } = this;\n    const recorder = new ReanimatedRecorder(Skia);\n    visit(recorder, this.root);\n    const sharedValues = recorder.getSharedValues();\n    const sharedRecorder = recorder.getRecorder();\n    Rea.runOnUI((onSize?: SharedValue<SkSize>) => {\n      \"worklet\";\n      nativeDrawOnscreen(nativeId, sharedRecorder, onSize);\n    })(this.onSize);\n    if (sharedValues.length > 0) {\n      const { onSize } = this;\n      this.mapperId = Rea.startMapper(() => {\n        \"worklet\";\n        sharedRecorder.applyUpdates(sharedValues);\n        nativeDrawOnscreen(nativeId, sharedRecorder, onSize);\n      }, sharedValues);\n    }\n  }\n}\n\nexport const createContainer = (\n  Skia: Skia,\n  nativeId: number,\n  onSize?: SharedValue<SkSize>\n) => {\n  if (HAS_REANIMATED_3 && nativeId !== -1) {\n    return new NativeReanimatedContainer(Skia, nativeId, onSize);\n  } else {\n    return new StaticContainer(Skia, nativeId);\n  }\n};\n"],"mappings":";;;AAEA,OAAOA,GAAG,MAAM,wCAAwC;AAExD,SAASC,gBAAgB,QAAQ,sCAAsC;AAGvE,SAASC,kBAAkB,QAAQ,+BAA+B;AAClE,SAASC,SAAS,EAAEC,eAAe,QAAQ,mBAAmB;AAC9D,SAASC,KAAK,QAAQ,oBAAoB;AAE1C,OAAO,qBAAqB;AAC5B,OAAO,cAAc;AAErB,MAAMC,kBAAkB,GAAGA,CACzBC,QAAgB,EAChBC,QAAqB,EACrBC,MAA4B,KACzB;EACH,SAAS;;EACT,IAAIA,MAAM,EAAE;IACVC,WAAW,CAACC,cAAc,CAACJ,QAAQ,EAAE,QAAQ,EAAEE,MAAM,CAAC;EACxD;EACA;EACA,MAAMG,OAAO,GAAGJ,QAAQ,CAACK,IAAI,CAAC,CAAC;EAC/B;EACA;EACAH,WAAW,CAACC,cAAc,CAACJ,QAAQ,EAAE,SAAS,EAAEK,OAAO,CAAC;AAC1D,CAAC;AAED,MAAME,yBAAyB,SAASX,SAAS,CAAC;EAGhDY,WAAWA,CACTC,IAAU,EACFT,QAAgB,EAChBE,MAA4B,EACpC;IACA,KAAK,CAACO,IAAI,CAAC;IAAC,KAHJT,QAAgB,GAAhBA,QAAgB;IAAA,KAChBE,MAA4B,GAA5BA,MAA4B;IAAAQ,eAAA,mBALJ,IAAI;EAQtC;EAEAC,MAAMA,CAAA,EAAG;IACP,IAAI,IAAI,CAACC,QAAQ,KAAK,IAAI,EAAE;MAC1BnB,GAAG,CAACoB,UAAU,CAAC,IAAI,CAACD,QAAQ,CAAC;IAC/B;IACA,IAAI,IAAI,CAACE,SAAS,EAAE;MAClB;IACF;IACA,MAAM;MAAEd,QAAQ;MAAES;IAAK,CAAC,GAAG,IAAI;IAC/B,MAAMR,QAAQ,GAAG,IAAIN,kBAAkB,CAACc,IAAI,CAAC;IAC7CX,KAAK,CAACG,QAAQ,EAAE,IAAI,CAACc,IAAI,CAAC;IAC1B,MAAMC,YAAY,GAAGf,QAAQ,CAACgB,eAAe,CAAC,CAAC;IAC/C,MAAMC,cAAc,GAAGjB,QAAQ,CAACkB,WAAW,CAAC,CAAC;IAC7C1B,GAAG,CAAC2B,OAAO,CAAElB,MAA4B,IAAK;MAC5C,SAAS;;MACTH,kBAAkB,CAACC,QAAQ,EAAEkB,cAAc,EAAEhB,MAAM,CAAC;IACtD,CAAC,CAAC,CAAC,IAAI,CAACA,MAAM,CAAC;IACf,IAAIc,YAAY,CAACK,MAAM,GAAG,CAAC,EAAE;MAC3B,MAAM;QAAEnB;MAAO,CAAC,GAAG,IAAI;MACvB,IAAI,CAACU,QAAQ,GAAGnB,GAAG,CAAC6B,WAAW,CAAC,MAAM;QACpC,SAAS;;QACTJ,cAAc,CAACK,YAAY,CAACP,YAAY,CAAC;QACzCjB,kBAAkB,CAACC,QAAQ,EAAEkB,cAAc,EAAEhB,MAAM,CAAC;MACtD,CAAC,EAAEc,YAAY,CAAC;IAClB;EACF;AACF;AAEA,OAAO,MAAMQ,eAAe,GAAGA,CAC7Bf,IAAU,EACVT,QAAgB,EAChBE,MAA4B,KACzB;EACH,IAAIR,gBAAgB,IAAIM,QAAQ,KAAK,CAAC,CAAC,EAAE;IACvC,OAAO,IAAIO,yBAAyB,CAACE,IAAI,EAAET,QAAQ,EAAEE,MAAM,CAAC;EAC9D,CAAC,MAAM;IACL,OAAO,IAAIL,eAAe,CAACY,IAAI,EAAET,QAAQ,CAAC;EAC5C;AACF,CAAC","ignoreList":[]}

package/lib/module/sksg/Container.web.d.ts

@@ -5,10 +5,9 @@ import "../skia/NativeSetup";
 import "../views/api";
 declare class ReanimatedContainer extends Container {
     private nativeId;
-    private onSize?;
     private mapperId;
-    constructor(Skia: Skia, nativeId: number, onSize?: SharedValue<SkSize> | undefined);
+    constructor(Skia: Skia, nativeId: number);
     redraw(): void;
 }
-export declare const createContainer: (Skia: Skia, nativeId: number, onSize?: SharedValue<SkSize>) => StaticContainer | ReanimatedContainer;
+export declare const createContainer: (Skia: Skia, nativeId: number, _onSize?: SharedValue<SkSize>) => StaticContainer | ReanimatedContainer;
 export {};

package/lib/module/sksg/Container.web.js

@@ -10,15 +10,9 @@ import { createDrawingContext } from "./Recorder/DrawingContext";
 import { Container, StaticContainer } from "./StaticContainer";
 import "../skia/NativeSetup";
 import "../views/api";
-const drawOnscreen = (Skia, nativeId, recording, onSize) => {
+const drawOnscreen = (Skia, nativeId, recording) => {
   "worklet";
 
-  if (onSize) {
-    const size = SkiaViewApi.size(nativeId);
-    if (size.width !== onSize.value.width || size.height !== onSize.value.height) {
-      onSize.value = size;
-    }
-  }
   const rec = Skia.PictureRecorder();
   const canvas = rec.beginRecording();
   //const start = performance.now();
@@ -31,10 +25,9 @@ const drawOnscreen = (Skia, nativeId, recording, onSize) => {
   SkiaViewApi.setJsiProperty(nativeId, "picture", picture);
 };
 class ReanimatedContainer extends Container {
-  constructor(Skia, nativeId, onSize) {
+  constructor(Skia, nativeId) {
     super(Skia);
     this.nativeId = nativeId;
-    this.onSize = onSize;
     _defineProperty(this, "mapperId", null);
   }
   redraw() {
@@ -66,16 +59,16 @@ class ReanimatedContainer extends Container {
         drawOnscreen(Skia, nativeId, recording);
       }, Array.from(animationValues));
     }
-    Rea.runOnUI(onSize => {
+    Rea.runOnUI(() => {
       "worklet";
 
-      drawOnscreen(Skia, nativeId, recording, onSize);
-    })(this.onSize);
+      drawOnscreen(Skia, nativeId, recording);
+    })();
   }
 }
-export const createContainer = (Skia, nativeId, onSize) => {
+export const createContainer = (Skia, nativeId, _onSize) => {
   if (HAS_REANIMATED_3 && nativeId !== -1) {
-    return new ReanimatedContainer(Skia, nativeId, onSize);
+    return new ReanimatedContainer(Skia, nativeId);
   } else {
     return new StaticContainer(Skia, nativeId);
   }

package/lib/module/sksg/Container.web.js.map

@@ -1 +1 @@
-{"version":3,"names":["Rea","HAS_REANIMATED_3","Recorder","visit","replay","createDrawingContext","Container","StaticContainer","drawOnscreen","Skia","nativeId","recording","onSize","size","SkiaViewApi","width","value","height","rec","PictureRecorder","canvas","beginRecording","ctx","paintPool","commands","picture","finishRecordingAsPicture","setJsiProperty","ReanimatedContainer","constructor","_defineProperty","redraw","mapperId","stopMapper","unmounted","recorder","root","record","getRecording","animationValues","startMapper","Array","from","runOnUI","createContainer"],"sources":["Container.web.ts"],"sourcesContent":["import type { SharedValue } from \"react-native-reanimated\";\n\nimport Rea from \"../external/reanimated/ReanimatedProxy\";\nimport type { Skia, SkSize } from \"../skia/types\";\nimport { HAS_REANIMATED_3 } from \"../external/reanimated/renderHelpers\";\n\nimport type { Recording } from \"./Recorder/Recorder\";\nimport { Recorder } from \"./Recorder/Recorder\";\nimport { visit } from \"./Recorder/Visitor\";\nimport { replay } from \"./Recorder/Player\";\nimport { createDrawingContext } from \"./Recorder/DrawingContext\";\nimport { Container, StaticContainer } from \"./StaticContainer\";\n\nimport \"../skia/NativeSetup\";\nimport \"../views/api\";\n\nconst drawOnscreen = (\n  Skia: Skia,\n  nativeId: number,\n  recording: Recording,\n  onSize?: SharedValue<SkSize>\n) => {\n  \"worklet\";\n  if (onSize) {\n    const size = SkiaViewApi.size(nativeId);\n    if (\n      size.width !== onSize.value.width ||\n      size.height !== onSize.value.height\n    ) {\n      onSize.value = size;\n    }\n  }\n  const rec = Skia.PictureRecorder();\n  const canvas = rec.beginRecording();\n  //const start = performance.now();\n\n  const ctx = createDrawingContext(Skia, recording.paintPool, canvas);\n  replay(ctx, recording.commands);\n  const picture = rec.finishRecordingAsPicture();\n  //const end = performance.now();\n  //console.log(\"Recording time: \", end - start);\n  SkiaViewApi.setJsiProperty(nativeId, \"picture\", picture);\n};\n\nclass ReanimatedContainer extends Container {\n  private mapperId: number | null = null;\n\n  constructor(\n    Skia: Skia,\n    private nativeId: number,\n    private onSize?: SharedValue<SkSize>\n  ) {\n    super(Skia);\n  }\n\n  redraw() {\n    if (this.mapperId !== null) {\n      Rea.stopMapper(this.mapperId);\n    }\n    if (this.unmounted) {\n      return;\n    }\n    const recorder = new Recorder();\n    visit(recorder, this.root);\n    const record = recorder.getRecording();\n    const { animationValues } = record;\n    this.recording = {\n      commands: record.commands,\n      paintPool: record.paintPool,\n    };\n    const { nativeId, Skia, recording } = this;\n    if (animationValues.size > 0) {\n      this.mapperId = Rea.startMapper(() => {\n        \"worklet\";\n        drawOnscreen(Skia, nativeId, recording!);\n      }, Array.from(animationValues));\n    }\n    Rea.runOnUI((onSize?: SharedValue<SkSize>) => {\n      \"worklet\";\n      drawOnscreen(Skia, nativeId, recording!, onSize);\n    })(this.onSize);\n  }\n}\n\nexport const createContainer = (\n  Skia: Skia,\n  nativeId: number,\n  onSize?: SharedValue<SkSize>\n) => {\n  if (HAS_REANIMATED_3 && nativeId !== -1) {\n    return new ReanimatedContainer(Skia, nativeId, onSize);\n  } else {\n    return new StaticContainer(Skia, nativeId);\n  }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Rea","HAS_REANIMATED_3","Recorder","visit","replay","createDrawingContext","Container","StaticContainer","drawOnscreen","Skia","nativeId","recording","rec","PictureRecorder","canvas","beginRecording","ctx","paintPool","commands","picture","finishRecordingAsPicture","SkiaViewApi","setJsiProperty","ReanimatedContainer","constructor","_defineProperty","redraw","mapperId","stopMapper","unmounted","recorder","root","record","getRecording","animationValues","size","startMapper","Array","from","runOnUI","createContainer","_onSize"],"sources":["Container.web.ts"],"sourcesContent":["import type { SharedValue } from \"react-native-reanimated\";\n\nimport Rea from \"../external/reanimated/ReanimatedProxy\";\nimport type { Skia, SkSize } from \"../skia/types\";\nimport { HAS_REANIMATED_3 } from \"../external/reanimated/renderHelpers\";\n\nimport type { Recording } from \"./Recorder/Recorder\";\nimport { Recorder } from \"./Recorder/Recorder\";\nimport { visit } from \"./Recorder/Visitor\";\nimport { replay } from \"./Recorder/Player\";\nimport { createDrawingContext } from \"./Recorder/DrawingContext\";\nimport { Container, StaticContainer } from \"./StaticContainer\";\n\nimport \"../skia/NativeSetup\";\nimport \"../views/api\";\n\nconst drawOnscreen = (Skia: Skia, nativeId: number, recording: Recording) => {\n  \"worklet\";\n  const rec = Skia.PictureRecorder();\n  const canvas = rec.beginRecording();\n  //const start = performance.now();\n\n  const ctx = createDrawingContext(Skia, recording.paintPool, canvas);\n  replay(ctx, recording.commands);\n  const picture = rec.finishRecordingAsPicture();\n  //const end = performance.now();\n  //console.log(\"Recording time: \", end - start);\n  SkiaViewApi.setJsiProperty(nativeId, \"picture\", picture);\n};\n\nclass ReanimatedContainer extends Container {\n  private mapperId: number | null = null;\n\n  constructor(Skia: Skia, private nativeId: number) {\n    super(Skia);\n  }\n\n  redraw() {\n    if (this.mapperId !== null) {\n      Rea.stopMapper(this.mapperId);\n    }\n    if (this.unmounted) {\n      return;\n    }\n    const recorder = new Recorder();\n    visit(recorder, this.root);\n    const record = recorder.getRecording();\n    const { animationValues } = record;\n    this.recording = {\n      commands: record.commands,\n      paintPool: record.paintPool,\n    };\n    const { nativeId, Skia, recording } = this;\n    if (animationValues.size > 0) {\n      this.mapperId = Rea.startMapper(() => {\n        \"worklet\";\n        drawOnscreen(Skia, nativeId, recording!);\n      }, Array.from(animationValues));\n    }\n    Rea.runOnUI(() => {\n      \"worklet\";\n      drawOnscreen(Skia, nativeId, recording!);\n    })();\n  }\n}\n\nexport const createContainer = (\n  Skia: Skia,\n  nativeId: number,\n  _onSize?: SharedValue<SkSize>\n) => {\n  if (HAS_REANIMATED_3 && nativeId !== -1) {\n    return new ReanimatedContainer(Skia, nativeId);\n  } else {\n    return new StaticContainer(Skia, nativeId);\n  }\n};\n"],"mappings":";;;AAEA,OAAOA,GAAG,MAAM,wCAAwC;AAExD,SAASC,gBAAgB,QAAQ,sCAAsC;AAGvE,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,KAAK,QAAQ,oBAAoB;AAC1C,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,oBAAoB,QAAQ,2BAA2B;AAChE,SAASC,SAAS,EAAEC,eAAe,QAAQ,mBAAmB;AAE9D,OAAO,qBAAqB;AAC5B,OAAO,cAAc;AAErB,MAAMC,YAAY,GAAGA,CAACC,IAAU,EAAEC,QAAgB,EAAEC,SAAoB,KAAK;EAC3E,SAAS;;EACT,MAAMC,GAAG,GAAGH,IAAI,CAACI,eAAe,CAAC,CAAC;EAClC,MAAMC,MAAM,GAAGF,GAAG,CAACG,cAAc,CAAC,CAAC;EACnC;;EAEA,MAAMC,GAAG,GAAGX,oBAAoB,CAACI,IAAI,EAAEE,SAAS,CAACM,SAAS,EAAEH,MAAM,CAAC;EACnEV,MAAM,CAACY,GAAG,EAAEL,SAAS,CAACO,QAAQ,CAAC;EAC/B,MAAMC,OAAO,GAAGP,GAAG,CAACQ,wBAAwB,CAAC,CAAC;EAC9C;EACA;EACAC,WAAW,CAACC,cAAc,CAACZ,QAAQ,EAAE,SAAS,EAAES,OAAO,CAAC;AAC1D,CAAC;AAED,MAAMI,mBAAmB,SAASjB,SAAS,CAAC;EAG1CkB,WAAWA,CAACf,IAAU,EAAUC,QAAgB,EAAE;IAChD,KAAK,CAACD,IAAI,CAAC;IAAC,KADkBC,QAAgB,GAAhBA,QAAgB;IAAAe,eAAA,mBAFd,IAAI;EAItC;EAEAC,MAAMA,CAAA,EAAG;IACP,IAAI,IAAI,CAACC,QAAQ,KAAK,IAAI,EAAE;MAC1B3B,GAAG,CAAC4B,UAAU,CAAC,IAAI,CAACD,QAAQ,CAAC;IAC/B;IACA,IAAI,IAAI,CAACE,SAAS,EAAE;MAClB;IACF;IACA,MAAMC,QAAQ,GAAG,IAAI5B,QAAQ,CAAC,CAAC;IAC/BC,KAAK,CAAC2B,QAAQ,EAAE,IAAI,CAACC,IAAI,CAAC;IAC1B,MAAMC,MAAM,GAAGF,QAAQ,CAACG,YAAY,CAAC,CAAC;IACtC,MAAM;MAAEC;IAAgB,CAAC,GAAGF,MAAM;IAClC,IAAI,CAACrB,SAAS,GAAG;MACfO,QAAQ,EAAEc,MAAM,CAACd,QAAQ;MACzBD,SAAS,EAAEe,MAAM,CAACf;IACpB,CAAC;IACD,MAAM;MAAEP,QAAQ;MAAED,IAAI;MAAEE;IAAU,CAAC,GAAG,IAAI;IAC1C,IAAIuB,eAAe,CAACC,IAAI,GAAG,CAAC,EAAE;MAC5B,IAAI,CAACR,QAAQ,GAAG3B,GAAG,CAACoC,WAAW,CAAC,MAAM;QACpC,SAAS;;QACT5B,YAAY,CAACC,IAAI,EAAEC,QAAQ,EAAEC,SAAU,CAAC;MAC1C,CAAC,EAAE0B,KAAK,CAACC,IAAI,CAACJ,eAAe,CAAC,CAAC;IACjC;IACAlC,GAAG,CAACuC,OAAO,CAAC,MAAM;MAChB,SAAS;;MACT/B,YAAY,CAACC,IAAI,EAAEC,QAAQ,EAAEC,SAAU,CAAC;IAC1C,CAAC,CAAC,CAAC,CAAC;EACN;AACF;AAEA,OAAO,MAAM6B,eAAe,GAAGA,CAC7B/B,IAAU,EACVC,QAAgB,EAChB+B,OAA6B,KAC1B;EACH,IAAIxC,gBAAgB,IAAIS,QAAQ,KAAK,CAAC,CAAC,EAAE;IACvC,OAAO,IAAIa,mBAAmB,CAACd,IAAI,EAAEC,QAAQ,CAAC;EAChD,CAAC,MAAM;IACL,OAAO,IAAIH,eAAe,CAACE,IAAI,EAAEC,QAAQ,CAAC;EAC5C;AACF,CAAC","ignoreList":[]}