@shopify/react-native-skia 0.1.157 → 0.1.159

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

@@ -0,0 +1 @@
+{"version":3,"names":["NativeSkiaDomView","Platform","OS","requireNativeComponent","SkiaDomView","React","Component","constructor","props","_nativeId","SkiaViewNativeId","current","root","onTouch","onSize","assertSkiaViewApi","SkiaViewApi","setJsiProperty","nativeId","componentDidUpdate","prevProps","makeImageSnapshot","rect","redraw","requestRedraw","registerValues","values","registerValuesInView","componentWillUnmount","render","mode","debug","viewProps","callJsiMethod","Error"],"sources":["SkiaDomView.tsx"],"sourcesContent":["import React from \"react\";\nimport { requireNativeComponent, Platform } from \"react-native\";\nimport type { HostComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\n\nimport { SkiaViewApi } from \"./api\";\nimport { SkiaViewNativeId } from \"./SkiaView\";\nimport type { NativeSkiaViewProps, SkiaDomViewProps } from \"./types\";\n\nconst NativeSkiaDomView: HostComponent<SkiaDomViewProps> =\n  Platform.OS !== \"web\"\n    ? requireNativeComponent<NativeSkiaViewProps>(\"SkiaDomView\")\n    : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      (null as any);\n\nexport class SkiaDomView extends React.Component<SkiaDomViewProps> {\n  constructor(props: SkiaDomViewProps) {\n    super(props);\n    this._nativeId = SkiaViewNativeId.current++;\n    const { root, onTouch, onSize } = props;\n    if (root) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"root\", root);\n    }\n    if (onTouch) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onTouch\", onTouch);\n    }\n    if (onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n  }\n\n  private _nativeId: number;\n\n  public get nativeId() {\n    return this._nativeId;\n  }\n\n  componentDidUpdate(prevProps: SkiaDomViewProps) {\n    const { root, onTouch, onSize } = this.props;\n    if (root !== prevProps.root) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"root\", root);\n    }\n    if (onTouch !== prevProps.onTouch) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onTouch\", onTouch);\n    }\n    if (onSize !== prevProps.onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshot(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n  }\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  public redraw() {\n    assertSkiaViewApi();\n    SkiaViewApi.requestRedraw(this._nativeId);\n  }\n\n  /**\n   * Registers one or move values as a dependant value of the Skia View. The view will\n   * The view will redraw itself when any of the values change.\n   * @param values Values to register\n   */\n  public registerValues(values: SkiaValue<unknown>[]): () => void {\n    assertSkiaViewApi();\n    return SkiaViewApi.registerValuesInView(this._nativeId, values);\n  }\n\n  /**\n   * Clear up the dom node when unmounting to release resources.\n   */\n  componentWillUnmount(): void {\n    assertSkiaViewApi();\n    SkiaViewApi.setJsiProperty(this._nativeId, \"root\", null);\n  }\n\n  render() {\n    const { mode, debug = false, ...viewProps } = this.props;\n    return (\n      <NativeSkiaDomView\n        collapsable={false}\n        nativeID={`${this._nativeId}`}\n        mode={mode}\n        debug={debug}\n        {...viewProps}\n      />\n    );\n  }\n}\n\nconst assertSkiaViewApi = () => {\n  if (\n    SkiaViewApi === null ||\n    SkiaViewApi.setJsiProperty === null ||\n    SkiaViewApi.callJsiMethod === null ||\n    SkiaViewApi.registerValuesInView === null ||\n    SkiaViewApi.requestRedraw === null ||\n    SkiaViewApi.makeImageSnapshot === null\n  ) {\n    throw Error(\"Skia View Api was not found.\");\n  }\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAMA;;AACA;;;;;;;;AAGA,MAAMA,iBAAkD,GACtDC,qBAAA,CAASC,EAAT,KAAgB,KAAhB,GACI,IAAAC,mCAAA,EAA4C,aAA5C,CADJ,GAEI;AACC,IAJP;;AAMO,MAAMC,WAAN,SAA0BC,cAAA,CAAMC,SAAhC,CAA4D;EACjEC,WAAW,CAACC,KAAD,EAA0B;IACnC,MAAMA,KAAN;;IADmC;;IAEnC,KAAKC,SAAL,GAAiBC,0BAAA,CAAiBC,OAAjB,EAAjB;IACA,MAAM;MAAEC,IAAF;MAAQC,OAAR;MAAiBC;IAAjB,IAA4BN,KAAlC;;IACA,IAAII,IAAJ,EAAU;MACRG,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,MAA3C,EAAmDG,IAAnD;IACD;;IACD,IAAIC,OAAJ,EAAa;MACXE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,SAA3C,EAAsDI,OAAtD;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,QAA3C,EAAqDK,MAArD;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKT,SAAZ;EACD;;EAEDU,kBAAkB,CAACC,SAAD,EAA8B;IAC9C,MAAM;MAAER,IAAF;MAAQC,OAAR;MAAiBC;IAAjB,IAA4B,KAAKN,KAAvC;;IACA,IAAII,IAAI,KAAKQ,SAAS,CAACR,IAAvB,EAA6B;MAC3BG,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,MAA3C,EAAmDG,IAAnD;IACD;;IACD,IAAIC,OAAO,KAAKO,SAAS,CAACP,OAA1B,EAAmC;MACjCE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,SAA3C,EAAsDI,OAAtD;IACD;;IACD,IAAIC,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,QAA3C,EAAqDK,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKZ,SAAnC,EAA8Ca,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKf,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSgB,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKlB,SAAtC,EAAiDiB,MAAjD,CAAP;EACD;EAED;AACF;AACA;;;EACEE,oBAAoB,GAAS;IAC3Bb,iBAAiB;;IACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKR,SAAhC,EAA2C,MAA3C,EAAmD,IAAnD;EACD;;EAEDoB,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKxB,KAAnD;IACA,oBACE,6BAAC,iBAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEqB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxFgE;;;;AA2FnE,MAAMjB,iBAAiB,GAAG,MAAM;EAC9B,IACEC,gBAAA,KAAgB,IAAhB,IACAA,gBAAA,CAAYC,cAAZ,KAA+B,IAD/B,IAEAD,gBAAA,CAAYiB,aAAZ,KAA8B,IAF9B,IAGAjB,gBAAA,CAAYW,oBAAZ,KAAqC,IAHrC,IAIAX,gBAAA,CAAYQ,aAAZ,KAA8B,IAJ9B,IAKAR,gBAAA,CAAYK,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMa,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}

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

@@ -0,0 +1,55 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SkiaDomView = void 0;
+
+var _reactNative = require("react-native");
+
+var _skia = require("../skia");
+
+var _SkiaBaseWebView = require("./SkiaBaseWebView");
+
+const pd = _reactNative.PixelRatio.get();
+
+class SkiaDomView extends _SkiaBaseWebView.SkiaBaseWebView {
+  constructor(props) {
+    super(props);
+  }
+
+  renderInCanvas(canvas, touches) {
+    if (this.props.onTouch) {
+      this.props.onTouch([touches]);
+    }
+
+    if (this.props.onSize) {
+      const {
+        width,
+        height
+      } = this.getSize();
+      this.props.onSize.current = {
+        width,
+        height
+      };
+    }
+
+    if (this.props.root) {
+      const paint = _skia.Skia.Paint();
+
+      const ctx = {
+        canvas,
+        paint,
+        opacity: 1
+      };
+      canvas.save();
+      canvas.scale(pd, pd);
+      this.props.root.render(ctx);
+      canvas.restore();
+    }
+  }
+
+}
+
+exports.SkiaDomView = SkiaDomView;
+//# sourceMappingURL=SkiaDomView.web.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["pd","PixelRatio","get","SkiaDomView","SkiaBaseWebView","constructor","props","renderInCanvas","canvas","touches","onTouch","onSize","width","height","getSize","current","root","paint","Skia","Paint","ctx","opacity","save","scale","render","restore"],"sources":["SkiaDomView.web.tsx"],"sourcesContent":["import { PixelRatio } from \"react-native\";\n\nimport { Skia } from \"../skia\";\nimport type { SkCanvas } from \"../skia/types\";\n\nimport { SkiaBaseWebView } from \"./SkiaBaseWebView\";\nimport type { SkiaDomViewProps, TouchInfo } from \"./types\";\n\nconst pd = PixelRatio.get();\n\nexport class SkiaDomView extends SkiaBaseWebView<SkiaDomViewProps> {\n  constructor(props: SkiaDomViewProps) {\n    super(props);\n  }\n\n  protected renderInCanvas(canvas: SkCanvas, touches: TouchInfo[]): void {\n    if (this.props.onTouch) {\n      this.props.onTouch([touches]);\n    }\n    if (this.props.onSize) {\n      const { width, height } = this.getSize();\n      this.props.onSize.current = { width, height };\n    }\n    if (this.props.root) {\n      const paint = Skia.Paint();\n      const ctx = {\n        canvas,\n        paint,\n        opacity: 1,\n      };\n      canvas.save();\n      canvas.scale(pd, pd);\n      this.props.root.render(ctx);\n      canvas.restore();\n    }\n  }\n}\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAGA;;AAGA,MAAMA,EAAE,GAAGC,uBAAA,CAAWC,GAAX,EAAX;;AAEO,MAAMC,WAAN,SAA0BC,gCAA1B,CAA4D;EACjEC,WAAW,CAACC,KAAD,EAA0B;IACnC,MAAMA,KAAN;EACD;;EAESC,cAAc,CAACC,MAAD,EAAmBC,OAAnB,EAA+C;IACrE,IAAI,KAAKH,KAAL,CAAWI,OAAf,EAAwB;MACtB,KAAKJ,KAAL,CAAWI,OAAX,CAAmB,CAACD,OAAD,CAAnB;IACD;;IACD,IAAI,KAAKH,KAAL,CAAWK,MAAf,EAAuB;MACrB,MAAM;QAAEC,KAAF;QAASC;MAAT,IAAoB,KAAKC,OAAL,EAA1B;MACA,KAAKR,KAAL,CAAWK,MAAX,CAAkBI,OAAlB,GAA4B;QAAEH,KAAF;QAASC;MAAT,CAA5B;IACD;;IACD,IAAI,KAAKP,KAAL,CAAWU,IAAf,EAAqB;MACnB,MAAMC,KAAK,GAAGC,UAAA,CAAKC,KAAL,EAAd;;MACA,MAAMC,GAAG,GAAG;QACVZ,MADU;QAEVS,KAFU;QAGVI,OAAO,EAAE;MAHC,CAAZ;MAKAb,MAAM,CAACc,IAAP;MACAd,MAAM,CAACe,KAAP,CAAavB,EAAb,EAAiBA,EAAjB;MACA,KAAKM,KAAL,CAAWU,IAAX,CAAgBQ,MAAhB,CAAuBJ,GAAvB;MACAZ,MAAM,CAACiB,OAAP;IACD;EACF;;AAzBgE"}

package/lib/commonjs/views/SkiaPictureView.js

@@ -29,7 +29,8 @@ class SkiaPictureView extends _react.default.Component {
 
     this._nativeId = _SkiaView.SkiaViewNativeId.current++;
     const {
-      picture
+      picture,
+      onSize
     } = props;
 
     if (picture) {
@@ -37,6 +38,12 @@ class SkiaPictureView extends _react.default.Component {
 
       _api.SkiaViewApi.setJsiProperty(this._nativeId, "picture", picture);
     }
+
+    if (onSize) {
+      assertSkiaViewApi();
+
+      _api.SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
+    }
   }
 
   get nativeId() {
@@ -45,7 +52,8 @@ class SkiaPictureView extends _react.default.Component {
 
   componentDidUpdate(prevProps) {
     const {
-      picture
+      picture,
+      onSize
     } = this.props;
 
     if (picture !== prevProps.picture) {
@@ -53,6 +61,12 @@ class SkiaPictureView extends _react.default.Component {
 
       _api.SkiaViewApi.setJsiProperty(this._nativeId, "picture", picture);
     }
+
+    if (onSize !== prevProps.onSize) {
+      assertSkiaViewApi();
+
+      _api.SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
+    }
   }
   /**
    * Creates a snapshot from the canvas in the surface

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

@@ -1 +1 @@
-{"version":3,"names":["NativeSkiaPictureView","requireNativeComponent","SkiaPictureView","React","Component","constructor","props","_nativeId","SkiaViewNativeId","current","picture","assertSkiaViewApi","SkiaViewApi","setJsiProperty","nativeId","componentDidUpdate","prevProps","makeImageSnapshot","rect","redraw","requestRedraw","registerValues","values","registerValuesInView","render","mode","debug","viewProps","callJsiMethod","Error"],"sources":["SkiaPictureView.tsx"],"sourcesContent":["import React from \"react\";\nimport { requireNativeComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\n\nimport { SkiaViewApi } from \"./api\";\nimport { SkiaViewNativeId } from \"./SkiaView\";\nimport type { NativeSkiaViewProps, SkiaPictureViewProps } from \"./types\";\n\nconst NativeSkiaPictureView =\n  requireNativeComponent<NativeSkiaViewProps>(\"SkiaPictureView\");\n\nexport class SkiaPictureView extends React.Component<SkiaPictureViewProps> {\n  constructor(props: SkiaPictureViewProps) {\n    super(props);\n    this._nativeId = SkiaViewNativeId.current++;\n    const { picture } = props;\n    if (picture) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n    }\n  }\n\n  private _nativeId: number;\n\n  public get nativeId() {\n    return this._nativeId;\n  }\n\n  componentDidUpdate(prevProps: SkiaPictureViewProps) {\n    const { picture } = this.props;\n    if (picture !== prevProps.picture) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n    }\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshot(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n  }\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  public redraw() {\n    assertSkiaViewApi();\n    SkiaViewApi.requestRedraw(this._nativeId);\n  }\n\n  /**\n   * Registers one or move values as a dependant value of the Skia View. The view will\n   * The view will redraw itself when any of the values change.\n   * @param values Values to register\n   */\n  public registerValues(values: SkiaValue<unknown>[]): () => void {\n    assertSkiaViewApi();\n    return SkiaViewApi.registerValuesInView(this._nativeId, values);\n  }\n\n  render() {\n    const { mode, debug = false, ...viewProps } = this.props;\n    return (\n      <NativeSkiaPictureView\n        collapsable={false}\n        nativeID={`${this._nativeId}`}\n        mode={mode}\n        debug={debug}\n        {...viewProps}\n      />\n    );\n  }\n}\n\nconst assertSkiaViewApi = () => {\n  if (\n    SkiaViewApi === null ||\n    SkiaViewApi.setJsiProperty === null ||\n    SkiaViewApi.callJsiMethod === null ||\n    SkiaViewApi.registerValuesInView === null ||\n    SkiaViewApi.requestRedraw === null ||\n    SkiaViewApi.makeImageSnapshot === null\n  ) {\n    throw Error(\"Skia View Api was not found.\");\n  }\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAKA;;AACA;;;;;;;;AAGA,MAAMA,qBAAqB,GACzB,IAAAC,mCAAA,EAA4C,iBAA5C,CADF;;AAGO,MAAMC,eAAN,SAA8BC,cAAA,CAAMC,SAApC,CAAoE;EACzEC,WAAW,CAACC,KAAD,EAA8B;IACvC,MAAMA,KAAN;;IADuC;;IAEvC,KAAKC,SAAL,GAAiBC,0BAAA,CAAiBC,OAAjB,EAAjB;IACA,MAAM;MAAEC;IAAF,IAAcJ,KAApB;;IACA,IAAII,OAAJ,EAAa;MACXC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKN,SAAhC,EAA2C,SAA3C,EAAsDG,OAAtD;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKP,SAAZ;EACD;;EAEDQ,kBAAkB,CAACC,SAAD,EAAkC;IAClD,MAAM;MAAEN;IAAF,IAAc,KAAKJ,KAAzB;;IACA,IAAII,OAAO,KAAKM,SAAS,CAACN,OAA1B,EAAmC;MACjCC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKN,SAAhC,EAA2C,SAA3C,EAAsDG,OAAtD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKV,SAAnC,EAA8CW,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKb,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSc,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKhB,SAAtC,EAAiDe,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKrB,KAAnD;IACA,oBACE,6BAAC,qBAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEkB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAhEwE;;;;AAmE3E,MAAMhB,iBAAiB,GAAG,MAAM;EAC9B,IACEC,gBAAA,KAAgB,IAAhB,IACAA,gBAAA,CAAYC,cAAZ,KAA+B,IAD/B,IAEAD,gBAAA,CAAYgB,aAAZ,KAA8B,IAF9B,IAGAhB,gBAAA,CAAYW,oBAAZ,KAAqC,IAHrC,IAIAX,gBAAA,CAAYQ,aAAZ,KAA8B,IAJ9B,IAKAR,gBAAA,CAAYK,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}
+{"version":3,"names":["NativeSkiaPictureView","requireNativeComponent","SkiaPictureView","React","Component","constructor","props","_nativeId","SkiaViewNativeId","current","picture","onSize","assertSkiaViewApi","SkiaViewApi","setJsiProperty","nativeId","componentDidUpdate","prevProps","makeImageSnapshot","rect","redraw","requestRedraw","registerValues","values","registerValuesInView","render","mode","debug","viewProps","callJsiMethod","Error"],"sources":["SkiaPictureView.tsx"],"sourcesContent":["import React from \"react\";\nimport { requireNativeComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\n\nimport { SkiaViewApi } from \"./api\";\nimport { SkiaViewNativeId } from \"./SkiaView\";\nimport type { NativeSkiaViewProps, SkiaPictureViewProps } from \"./types\";\n\nconst NativeSkiaPictureView =\n  requireNativeComponent<NativeSkiaViewProps>(\"SkiaPictureView\");\n\nexport class SkiaPictureView extends React.Component<SkiaPictureViewProps> {\n  constructor(props: SkiaPictureViewProps) {\n    super(props);\n    this._nativeId = SkiaViewNativeId.current++;\n    const { picture, onSize } = props;\n    if (picture) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n    }\n    if (onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n  }\n\n  private _nativeId: number;\n\n  public get nativeId() {\n    return this._nativeId;\n  }\n\n  componentDidUpdate(prevProps: SkiaPictureViewProps) {\n    const { picture, onSize } = this.props;\n    if (picture !== prevProps.picture) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n    }\n    if (onSize !== prevProps.onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshot(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n  }\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  public redraw() {\n    assertSkiaViewApi();\n    SkiaViewApi.requestRedraw(this._nativeId);\n  }\n\n  /**\n   * Registers one or move values as a dependant value of the Skia View. The view will\n   * The view will redraw itself when any of the values change.\n   * @param values Values to register\n   */\n  public registerValues(values: SkiaValue<unknown>[]): () => void {\n    assertSkiaViewApi();\n    return SkiaViewApi.registerValuesInView(this._nativeId, values);\n  }\n\n  render() {\n    const { mode, debug = false, ...viewProps } = this.props;\n    return (\n      <NativeSkiaPictureView\n        collapsable={false}\n        nativeID={`${this._nativeId}`}\n        mode={mode}\n        debug={debug}\n        {...viewProps}\n      />\n    );\n  }\n}\n\nconst assertSkiaViewApi = () => {\n  if (\n    SkiaViewApi === null ||\n    SkiaViewApi.setJsiProperty === null ||\n    SkiaViewApi.callJsiMethod === null ||\n    SkiaViewApi.registerValuesInView === null ||\n    SkiaViewApi.requestRedraw === null ||\n    SkiaViewApi.makeImageSnapshot === null\n  ) {\n    throw Error(\"Skia View Api was not found.\");\n  }\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAKA;;AACA;;;;;;;;AAGA,MAAMA,qBAAqB,GACzB,IAAAC,mCAAA,EAA4C,iBAA5C,CADF;;AAGO,MAAMC,eAAN,SAA8BC,cAAA,CAAMC,SAApC,CAAoE;EACzEC,WAAW,CAACC,KAAD,EAA8B;IACvC,MAAMA,KAAN;;IADuC;;IAEvC,KAAKC,SAAL,GAAiBC,0BAAA,CAAiBC,OAAjB,EAAjB;IACA,MAAM;MAAEC,OAAF;MAAWC;IAAX,IAAsBL,KAA5B;;IACA,IAAII,OAAJ,EAAa;MACXE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKP,SAAhC,EAA2C,SAA3C,EAAsDG,OAAtD;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKP,SAAhC,EAA2C,QAA3C,EAAqDI,MAArD;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKR,SAAZ;EACD;;EAEDS,kBAAkB,CAACC,SAAD,EAAkC;IAClD,MAAM;MAAEP,OAAF;MAAWC;IAAX,IAAsB,KAAKL,KAAjC;;IACA,IAAII,OAAO,KAAKO,SAAS,CAACP,OAA1B,EAAmC;MACjCE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKP,SAAhC,EAA2C,SAA3C,EAAsDG,OAAtD;IACD;;IACD,IAAIC,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKP,SAAhC,EAA2C,QAA3C,EAAqDI,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKX,SAAnC,EAA8CY,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKd,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSe,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKjB,SAAtC,EAAiDgB,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKtB,KAAnD;IACA,oBACE,6BAAC,qBAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEmB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxEwE;;;;AA2E3E,MAAMhB,iBAAiB,GAAG,MAAM;EAC9B,IACEC,gBAAA,KAAgB,IAAhB,IACAA,gBAAA,CAAYC,cAAZ,KAA+B,IAD/B,IAEAD,gBAAA,CAAYgB,aAAZ,KAA8B,IAF9B,IAGAhB,gBAAA,CAAYW,oBAAZ,KAAqC,IAHrC,IAIAX,gBAAA,CAAYQ,aAAZ,KAA8B,IAJ9B,IAKAR,gBAAA,CAAYK,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}

package/lib/commonjs/views/SkiaView.js

@@ -31,7 +31,8 @@ class SkiaView extends _react.default.Component {
 
     this._nativeId = SkiaViewNativeId.current++;
     const {
-      onDraw
+      onDraw,
+      onSize
     } = props;
 
     if (onDraw) {
@@ -39,6 +40,12 @@ class SkiaView extends _react.default.Component {
 
       _api.SkiaViewApi.setJsiProperty(this._nativeId, "drawCallback", onDraw);
     }
+
+    if (onSize) {
+      assertSkiaViewApi();
+
+      _api.SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
+    }
   }
 
   get nativeId() {
@@ -47,7 +54,8 @@ class SkiaView extends _react.default.Component {
 
   componentDidUpdate(prevProps) {
     const {
-      onDraw
+      onDraw,
+      onSize
     } = this.props;
 
     if (onDraw !== prevProps.onDraw) {
@@ -55,6 +63,12 @@ class SkiaView extends _react.default.Component {
 
       _api.SkiaViewApi.setJsiProperty(this._nativeId, "drawCallback", onDraw);
     }
+
+    if (onSize !== prevProps.onSize) {
+      assertSkiaViewApi();
+
+      _api.SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
+    }
   }
   /**
    * Creates a snapshot from the canvas in the surface
@@ -93,6 +107,7 @@ class SkiaView extends _react.default.Component {
     const {
       mode,
       debug = false,
+      onSize,
       ...viewProps
     } = this.props;
     return /*#__PURE__*/_react.default.createElement(NativeSkiaView, _extends({

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

@@ -1 +1 @@
-{"version":3,"names":["SkiaViewNativeId","current","NativeSkiaView","requireNativeComponent","SkiaView","React","Component","constructor","props","_nativeId","onDraw","assertSkiaViewApi","SkiaViewApi","setJsiProperty","nativeId","componentDidUpdate","prevProps","makeImageSnapshot","rect","redraw","requestRedraw","registerValues","values","registerValuesInView","render","mode","debug","viewProps","callJsiMethod","Error"],"sources":["SkiaView.tsx"],"sourcesContent":["import React from \"react\";\nimport { requireNativeComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { NativeSkiaViewProps, SkiaDrawViewProps } from \"./types\";\n\nexport const SkiaViewNativeId = { current: 1000 };\n\nconst NativeSkiaView =\n  requireNativeComponent<NativeSkiaViewProps>(\"SkiaDrawView\");\n\nexport class SkiaView extends React.Component<SkiaDrawViewProps> {\n  constructor(props: SkiaDrawViewProps) {\n    super(props);\n    this._nativeId = SkiaViewNativeId.current++;\n    const { onDraw } = props;\n    if (onDraw) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"drawCallback\", onDraw);\n    }\n  }\n\n  private _nativeId: number;\n\n  public get nativeId() {\n    return this._nativeId;\n  }\n\n  componentDidUpdate(prevProps: SkiaDrawViewProps) {\n    const { onDraw } = this.props;\n    if (onDraw !== prevProps.onDraw) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"drawCallback\", onDraw);\n    }\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshot(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n  }\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  public redraw() {\n    assertSkiaViewApi();\n    SkiaViewApi.requestRedraw(this._nativeId);\n  }\n\n  /**\n   * Registers one or move values as a dependant value of the Skia View. The view will\n   * The view will redraw itself when any of the values change.\n   * @param values Values to register\n   */\n  public registerValues(values: SkiaValue<unknown>[]): () => void {\n    assertSkiaViewApi();\n    return SkiaViewApi.registerValuesInView(this._nativeId, values);\n  }\n\n  render() {\n    const { mode, debug = false, ...viewProps } = this.props;\n    return (\n      <NativeSkiaView\n        collapsable={false}\n        nativeID={`${this._nativeId}`}\n        mode={mode}\n        debug={debug}\n        {...viewProps}\n      />\n    );\n  }\n}\n\nconst assertSkiaViewApi = () => {\n  if (\n    SkiaViewApi === null ||\n    SkiaViewApi.setJsiProperty === null ||\n    SkiaViewApi.callJsiMethod === null ||\n    SkiaViewApi.registerValuesInView === null ||\n    SkiaViewApi.requestRedraw === null ||\n    SkiaViewApi.makeImageSnapshot === null\n  ) {\n    throw Error(\"Skia View Api was not found.\");\n  }\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAKA;;;;;;;;AAGO,MAAMA,gBAAgB,GAAG;EAAEC,OAAO,EAAE;AAAX,CAAzB;;AAEP,MAAMC,cAAc,GAClB,IAAAC,mCAAA,EAA4C,cAA5C,CADF;;AAGO,MAAMC,QAAN,SAAuBC,cAAA,CAAMC,SAA7B,CAA0D;EAC/DC,WAAW,CAACC,KAAD,EAA2B;IACpC,MAAMA,KAAN;;IADoC;;IAEpC,KAAKC,SAAL,GAAiBT,gBAAgB,CAACC,OAAjB,EAAjB;IACA,MAAM;MAAES;IAAF,IAAaF,KAAnB;;IACA,IAAIE,MAAJ,EAAY;MACVC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKL,SAAZ;EACD;;EAEDM,kBAAkB,CAACC,SAAD,EAA+B;IAC/C,MAAM;MAAEN;IAAF,IAAa,KAAKF,KAAxB;;IACA,IAAIE,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKR,SAAnC,EAA8CS,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKX,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSY,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKd,SAAtC,EAAiDa,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKnB,KAAnD;IACA,oBACE,6BAAC,cAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEgB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAhE8D;;;;AAmEjE,MAAMhB,iBAAiB,GAAG,MAAM;EAC9B,IACEC,gBAAA,KAAgB,IAAhB,IACAA,gBAAA,CAAYC,cAAZ,KAA+B,IAD/B,IAEAD,gBAAA,CAAYgB,aAAZ,KAA8B,IAF9B,IAGAhB,gBAAA,CAAYW,oBAAZ,KAAqC,IAHrC,IAIAX,gBAAA,CAAYQ,aAAZ,KAA8B,IAJ9B,IAKAR,gBAAA,CAAYK,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}
+{"version":3,"names":["SkiaViewNativeId","current","NativeSkiaView","requireNativeComponent","SkiaView","React","Component","constructor","props","_nativeId","onDraw","onSize","assertSkiaViewApi","SkiaViewApi","setJsiProperty","nativeId","componentDidUpdate","prevProps","makeImageSnapshot","rect","redraw","requestRedraw","registerValues","values","registerValuesInView","render","mode","debug","viewProps","callJsiMethod","Error"],"sources":["SkiaView.tsx"],"sourcesContent":["import React from \"react\";\nimport { requireNativeComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { NativeSkiaViewProps, SkiaDrawViewProps } from \"./types\";\n\nexport const SkiaViewNativeId = { current: 1000 };\n\nconst NativeSkiaView =\n  requireNativeComponent<NativeSkiaViewProps>(\"SkiaDrawView\");\n\nexport class SkiaView extends React.Component<SkiaDrawViewProps> {\n  constructor(props: SkiaDrawViewProps) {\n    super(props);\n    this._nativeId = SkiaViewNativeId.current++;\n    const { onDraw, onSize } = props;\n    if (onDraw) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"drawCallback\", onDraw);\n    }\n    if (onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n  }\n\n  private _nativeId: number;\n\n  public get nativeId() {\n    return this._nativeId;\n  }\n\n  componentDidUpdate(prevProps: SkiaDrawViewProps) {\n    const { onDraw, onSize } = this.props;\n    if (onDraw !== prevProps.onDraw) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"drawCallback\", onDraw);\n    }\n    if (onSize !== prevProps.onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshot(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n  }\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  public redraw() {\n    assertSkiaViewApi();\n    SkiaViewApi.requestRedraw(this._nativeId);\n  }\n\n  /**\n   * Registers one or move values as a dependant value of the Skia View. The view will\n   * The view will redraw itself when any of the values change.\n   * @param values Values to register\n   */\n  public registerValues(values: SkiaValue<unknown>[]): () => void {\n    assertSkiaViewApi();\n    return SkiaViewApi.registerValuesInView(this._nativeId, values);\n  }\n\n  render() {\n    const { mode, debug = false, onSize, ...viewProps } = this.props;\n    return (\n      <NativeSkiaView\n        collapsable={false}\n        nativeID={`${this._nativeId}`}\n        mode={mode}\n        debug={debug}\n        {...viewProps}\n      />\n    );\n  }\n}\n\nconst assertSkiaViewApi = () => {\n  if (\n    SkiaViewApi === null ||\n    SkiaViewApi.setJsiProperty === null ||\n    SkiaViewApi.callJsiMethod === null ||\n    SkiaViewApi.registerValuesInView === null ||\n    SkiaViewApi.requestRedraw === null ||\n    SkiaViewApi.makeImageSnapshot === null\n  ) {\n    throw Error(\"Skia View Api was not found.\");\n  }\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAKA;;;;;;;;AAGO,MAAMA,gBAAgB,GAAG;EAAEC,OAAO,EAAE;AAAX,CAAzB;;AAEP,MAAMC,cAAc,GAClB,IAAAC,mCAAA,EAA4C,cAA5C,CADF;;AAGO,MAAMC,QAAN,SAAuBC,cAAA,CAAMC,SAA7B,CAA0D;EAC/DC,WAAW,CAACC,KAAD,EAA2B;IACpC,MAAMA,KAAN;;IADoC;;IAEpC,KAAKC,SAAL,GAAiBT,gBAAgB,CAACC,OAAjB,EAAjB;IACA,MAAM;MAAES,MAAF;MAAUC;IAAV,IAAqBH,KAA3B;;IACA,IAAIE,MAAJ,EAAY;MACVE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,QAA3C,EAAqDE,MAArD;IACD;EACF;;EAIkB,IAARI,QAAQ,GAAG;IACpB,OAAO,KAAKN,SAAZ;EACD;;EAEDO,kBAAkB,CAACC,SAAD,EAA+B;IAC/C,MAAM;MAAEP,MAAF;MAAUC;IAAV,IAAqB,KAAKH,KAAhC;;IACA,IAAIE,MAAM,KAAKO,SAAS,CAACP,MAAzB,EAAiC;MAC/BE,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;;IACD,IAAIC,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BC,iBAAiB;;MACjBC,gBAAA,CAAYC,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,QAA3C,EAAqDE,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSO,iBAAiB,CAACC,IAAD,EAAgB;IACtCP,iBAAiB;IACjB,OAAOC,gBAAA,CAAYK,iBAAZ,CAA8B,KAAKT,SAAnC,EAA8CU,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdR,iBAAiB;;IACjBC,gBAAA,CAAYQ,aAAZ,CAA0B,KAAKZ,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSa,cAAc,CAACC,MAAD,EAA2C;IAC9DX,iBAAiB;IACjB,OAAOC,gBAAA,CAAYW,oBAAZ,CAAiC,KAAKf,SAAtC,EAAiDc,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuBhB,MAAvB;MAA+B,GAAGiB;IAAlC,IAAgD,KAAKpB,KAA3D;IACA,oBACE,6BAAC,cAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEiB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxE8D;;;;AA2EjE,MAAMhB,iBAAiB,GAAG,MAAM;EAC9B,IACEC,gBAAA,KAAgB,IAAhB,IACAA,gBAAA,CAAYC,cAAZ,KAA+B,IAD/B,IAEAD,gBAAA,CAAYgB,aAAZ,KAA8B,IAF9B,IAGAhB,gBAAA,CAAYW,oBAAZ,KAAqC,IAHrC,IAIAX,gBAAA,CAAYQ,aAAZ,KAA8B,IAJ9B,IAKAR,gBAAA,CAAYK,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}

package/lib/commonjs/views/index.js

@@ -30,6 +30,19 @@ Object.keys(_SkiaPictureView).forEach(function (key) {
   });
 });
 
+var _SkiaDomView = require("./SkiaDomView");
+
+Object.keys(_SkiaDomView).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SkiaDomView[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _SkiaDomView[key];
+    }
+  });
+});
+
 var _types = require("./types");
 
 Object.keys(_types).forEach(function (key) {

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./SkiaView\";\nexport * from \"./SkiaPictureView\";\nexport * from \"./types\";\nexport * from \"./useDrawCallback\";\nexport * from \"./useTouchHandler\";\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./SkiaView\";\nexport * from \"./SkiaPictureView\";\nexport * from \"./SkiaDomView\";\nexport * from \"./types\";\nexport * from \"./useDrawCallback\";\nexport * from \"./useTouchHandler\";\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}

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

@@ -1 +1 @@
-{"version":3,"names":["TouchType"],"sources":["types.ts"],"sourcesContent":["import type { ViewProps } from \"react-native\";\n\nimport type { SkCanvas, SkImage, SkPicture, SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\n\nexport type DrawMode = \"continuous\" | \"default\";\n\nexport type NativeSkiaViewProps = ViewProps & {\n  mode?: DrawMode;\n  debug?: boolean;\n};\n\nexport enum TouchType {\n  Start,\n  Active,\n  End,\n  Cancelled,\n}\n\nexport interface TouchInfo {\n  x: number;\n  y: number;\n  force: number;\n  type: TouchType;\n  id: number;\n  timestamp: number;\n}\n\nexport interface DrawingInfo {\n  width: number;\n  height: number;\n  timestamp: number;\n  touches: Array<Array<TouchInfo>>;\n}\n\nexport type ExtendedTouchInfo = TouchInfo & {\n  // points per second\n  velocityX: number;\n  velocityY: number;\n};\n\nexport type TouchHandlers = {\n  onStart?: (touchInfo: TouchInfo) => void;\n  onActive?: (touchInfo: ExtendedTouchInfo) => void;\n  onEnd?: (touchInfo: ExtendedTouchInfo) => void;\n};\n\nexport type TouchHandler = (touchInfo: Array<Array<TouchInfo>>) => void;\n\nexport type RNSkiaDrawCallback = (canvas: SkCanvas, info: DrawingInfo) => void;\n\n/**\n * Listener interface for value changes\n */\nexport interface ValueListener {\n  addListener: (callback: () => void) => number;\n  removeListener: (id: number) => void;\n}\n\nexport interface ISkiaViewApi {\n  setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;\n  callJsiMethod: <T extends Array<unknown>>(\n    nativeId: number,\n    name: string,\n    ...args: T\n  ) => void;\n  registerValuesInView: (\n    nativeId: number,\n    values: SkiaValue<unknown>[]\n  ) => () => void;\n  requestRedraw: (nativeId: number) => void;\n  makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;\n}\n\nexport interface SkiaBaseViewProps extends ViewProps {\n  /**\n   * Sets the drawing mode for the skia view. There are two drawing\n   * modes, \"continuous\" and \"default\", where the continuous mode will\n   * continuously redraw the view, and the default mode will only\n   * redraw when any of the regular react properties are changed like\n   * sizes and margins.\n   */\n  mode?: DrawMode;\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\nexport interface SkiaDrawViewProps extends SkiaBaseViewProps {\n  /**\n   * Draw callback. Will be called whenever the view is invalidated and\n   * needs to redraw. This is either caused by a change in a react\n   * property, a touch event, or a call to redraw. If the view is in\n   * continuous mode the callback will be called 60 frames per second\n   * by the native view.\n   */\n  onDraw?: RNSkiaDrawCallback;\n}\n\nexport interface SkiaPictureViewProps extends SkiaBaseViewProps {\n  picture?: SkPicture;\n}\n"],"mappings":";;;;;;IAYYA,S;;;WAAAA,S;EAAAA,S,CAAAA,S;EAAAA,S,CAAAA,S;EAAAA,S,CAAAA,S;EAAAA,S,CAAAA,S;GAAAA,S,yBAAAA,S"}
+{"version":3,"names":["TouchType"],"sources":["types.ts"],"sourcesContent":["import type { ViewProps } from \"react-native\";\n\nimport type { GroupProps, RenderNode } from \"../dom/types\";\nimport type {\n  SkCanvas,\n  SkImage,\n  SkPicture,\n  SkRect,\n  SkSize,\n} from \"../skia/types\";\nimport type { SkiaMutableValue, SkiaValue } from \"../values\";\n\nexport type DrawMode = \"continuous\" | \"default\";\n\nexport type NativeSkiaViewProps = ViewProps & {\n  mode?: DrawMode;\n  debug?: boolean;\n};\n\nexport enum TouchType {\n  Start,\n  Active,\n  End,\n  Cancelled,\n}\n\nexport interface TouchInfo {\n  x: number;\n  y: number;\n  force: number;\n  type: TouchType;\n  id: number;\n  timestamp: number;\n}\n\nexport interface DrawingInfo {\n  width: number;\n  height: number;\n  timestamp: number;\n  touches: Array<Array<TouchInfo>>;\n}\n\nexport type ExtendedTouchInfo = TouchInfo & {\n  // points per second\n  velocityX: number;\n  velocityY: number;\n};\n\nexport type TouchHandlers = {\n  onStart?: (touchInfo: TouchInfo) => void;\n  onActive?: (touchInfo: ExtendedTouchInfo) => void;\n  onEnd?: (touchInfo: ExtendedTouchInfo) => void;\n};\n\nexport type TouchHandler = (touchInfo: Array<Array<TouchInfo>>) => void;\n\nexport type RNSkiaDrawCallback = (canvas: SkCanvas, info: DrawingInfo) => void;\n\n/**\n * Listener interface for value changes\n */\nexport interface ValueListener {\n  addListener: (callback: () => void) => number;\n  removeListener: (id: number) => void;\n}\n\nexport interface ISkiaViewApi {\n  setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;\n  callJsiMethod: <T extends Array<unknown>>(\n    nativeId: number,\n    name: string,\n    ...args: T\n  ) => void;\n  registerValuesInView: (\n    nativeId: number,\n    values: SkiaValue<unknown>[]\n  ) => () => void;\n  requestRedraw: (nativeId: number) => void;\n  makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;\n}\n\nexport interface SkiaBaseViewProps extends ViewProps {\n  /**\n   * Sets the drawing mode for the skia view. There are two drawing\n   * modes, \"continuous\" and \"default\", where the continuous mode will\n   * continuously redraw the view, and the default mode will only\n   * redraw when any of the regular react properties are changed like\n   * sizes and margins.\n   */\n  mode?: DrawMode;\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?: SkiaMutableValue<SkSize>;\n}\n\nexport interface SkiaDrawViewProps extends SkiaBaseViewProps {\n  /**\n   * Draw callback. Will be called whenever the view is invalidated and\n   * needs to redraw. This is either caused by a change in a react\n   * property, a touch event, or a call to redraw. If the view is in\n   * continuous mode the callback will be called 60 frames per second\n   * by the native view.\n   */\n  onDraw?: RNSkiaDrawCallback;\n}\n\nexport interface SkiaPictureViewProps extends SkiaBaseViewProps {\n  picture?: SkPicture;\n}\n\nexport interface SkiaDomViewProps extends SkiaBaseViewProps {\n  root?: RenderNode<GroupProps>;\n  onTouch?: TouchHandler;\n}\n"],"mappings":";;;;;;IAmBYA,S;;;WAAAA,S;EAAAA,S,CAAAA,S;EAAAA,S,CAAAA,S;EAAAA,S,CAAAA,S;EAAAA,S,CAAAA,S;GAAAA,S,yBAAAA,S"}

package/lib/module/dom/nodes/DrawingNode.js

@@ -2,7 +2,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 import { JsiDeclarationNode } from "./Node";
 import { PaintNode } from "./PaintNode";
-import { isSkPaint, JsiRenderNode } from "./RenderNode";
+import { JsiRenderNode } from "./RenderNode";
 export class JsiDrawingNode extends JsiRenderNode {
   constructor(ctx, type, props) {
     super(ctx, type, props);
@@ -46,14 +46,10 @@ export class JsiDrawingNode extends JsiRenderNode {
   }
 
   renderNode(ctx) {
-    if (this.props.paint && isSkPaint(this.props.paint)) {
+    if (this.props.paint) {
       this.draw({ ...ctx,
         paint: this.props.paint
       });
-    } else if (this.props.paint && this.props.paint.current != null) {
-      this.draw({ ...ctx,
-        paint: this.props.paint.current.materialize()
-      });
     } else {
       this.draw(ctx);
     }

package/lib/module/dom/nodes/DrawingNode.js.map

@@ -1 +1 @@
-{"version":3,"names":["JsiDeclarationNode","PaintNode","isSkPaint","JsiRenderNode","JsiDrawingNode","constructor","ctx","type","props","derived","deriveProps","setProps","setProp","name","value","hasChanged","addChild","child","Error","insertChildBefore","before","renderNode","paint","draw","current","materialize","children","map"],"sources":["DrawingNode.ts"],"sourcesContent":["import type {\n  DrawingContext,\n  DrawingNodeProps,\n  Node,\n  NodeType,\n  RenderNode,\n} from \"../types\";\n\nimport type { NodeContext } from \"./Node\";\nimport { JsiDeclarationNode } from \"./Node\";\nimport { PaintNode } from \"./PaintNode\";\nimport { isSkPaint, JsiRenderNode } from \"./RenderNode\";\n\nexport abstract class JsiDrawingNode<P extends DrawingNodeProps, C>\n  extends JsiRenderNode<P>\n  implements RenderNode<P>\n{\n  protected derived?: C;\n\n  constructor(ctx: NodeContext, type: NodeType, props: P) {\n    super(ctx, type, props);\n    this.derived = this.deriveProps();\n  }\n\n  setProps(props: P) {\n    super.setProps(props);\n    this.derived = this.deriveProps();\n  }\n\n  setProp<K extends keyof P>(name: K, value: P[K]) {\n    const hasChanged = super.setProp(name, value);\n    if (hasChanged) {\n      this.derived = this.deriveProps();\n    }\n    return hasChanged;\n  }\n\n  addChild(child: Node<unknown>): void {\n    if (!(child instanceof JsiDeclarationNode)) {\n      throw new Error(`Cannot add ${child.type} to ${this.type}`);\n    }\n    super.addChild(child);\n    this.derived = this.deriveProps();\n  }\n\n  insertChildBefore(child: Node<unknown>, before: Node<unknown>): void {\n    if (!(child instanceof JsiDeclarationNode)) {\n      throw new Error(`Cannot add ${child.type} to ${this.type}`);\n    }\n    super.insertChildBefore(child, before);\n    this.derived = this.deriveProps();\n  }\n\n  renderNode(ctx: DrawingContext): void {\n    if (this.props.paint && isSkPaint(this.props.paint)) {\n      this.draw({ ...ctx, paint: this.props.paint });\n    } else if (this.props.paint && this.props.paint.current != null) {\n      this.draw({ ...ctx, paint: this.props.paint.current.materialize() });\n    } else {\n      this.draw(ctx);\n    }\n    this.children().map((child) => {\n      if (child instanceof PaintNode) {\n        const paint = child.materialize();\n        this.draw({ ...ctx, paint });\n      }\n    });\n  }\n\n  protected abstract draw(ctx: DrawingContext): void;\n  protected abstract deriveProps(): C;\n}\n"],"mappings":";;AASA,SAASA,kBAAT,QAAmC,QAAnC;AACA,SAASC,SAAT,QAA0B,aAA1B;AACA,SAASC,SAAT,EAAoBC,aAApB,QAAyC,cAAzC;AAEA,OAAO,MAAeC,cAAf,SACGD,aADH,CAGP;EAGEE,WAAW,CAACC,GAAD,EAAmBC,IAAnB,EAAmCC,KAAnC,EAA6C;IACtD,MAAMF,GAAN,EAAWC,IAAX,EAAiBC,KAAjB;;IADsD;;IAEtD,KAAKC,OAAL,GAAe,KAAKC,WAAL,EAAf;EACD;;EAEDC,QAAQ,CAACH,KAAD,EAAW;IACjB,MAAMG,QAAN,CAAeH,KAAf;IACA,KAAKC,OAAL,GAAe,KAAKC,WAAL,EAAf;EACD;;EAEDE,OAAO,CAAoBC,IAApB,EAA6BC,KAA7B,EAA0C;IAC/C,MAAMC,UAAU,GAAG,MAAMH,OAAN,CAAcC,IAAd,EAAoBC,KAApB,CAAnB;;IACA,IAAIC,UAAJ,EAAgB;MACd,KAAKN,OAAL,GAAe,KAAKC,WAAL,EAAf;IACD;;IACD,OAAOK,UAAP;EACD;;EAEDC,QAAQ,CAACC,KAAD,EAA6B;IACnC,IAAI,EAAEA,KAAK,YAAYjB,kBAAnB,CAAJ,EAA4C;MAC1C,MAAM,IAAIkB,KAAJ,CAAW,cAAaD,KAAK,CAACV,IAAK,OAAM,KAAKA,IAAK,EAAnD,CAAN;IACD;;IACD,MAAMS,QAAN,CAAeC,KAAf;IACA,KAAKR,OAAL,GAAe,KAAKC,WAAL,EAAf;EACD;;EAEDS,iBAAiB,CAACF,KAAD,EAAuBG,MAAvB,EAAoD;IACnE,IAAI,EAAEH,KAAK,YAAYjB,kBAAnB,CAAJ,EAA4C;MAC1C,MAAM,IAAIkB,KAAJ,CAAW,cAAaD,KAAK,CAACV,IAAK,OAAM,KAAKA,IAAK,EAAnD,CAAN;IACD;;IACD,MAAMY,iBAAN,CAAwBF,KAAxB,EAA+BG,MAA/B;IACA,KAAKX,OAAL,GAAe,KAAKC,WAAL,EAAf;EACD;;EAEDW,UAAU,CAACf,GAAD,EAA4B;IACpC,IAAI,KAAKE,KAAL,CAAWc,KAAX,IAAoBpB,SAAS,CAAC,KAAKM,KAAL,CAAWc,KAAZ,CAAjC,EAAqD;MACnD,KAAKC,IAAL,CAAU,EAAE,GAAGjB,GAAL;QAAUgB,KAAK,EAAE,KAAKd,KAAL,CAAWc;MAA5B,CAAV;IACD,CAFD,MAEO,IAAI,KAAKd,KAAL,CAAWc,KAAX,IAAoB,KAAKd,KAAL,CAAWc,KAAX,CAAiBE,OAAjB,IAA4B,IAApD,EAA0D;MAC/D,KAAKD,IAAL,CAAU,EAAE,GAAGjB,GAAL;QAAUgB,KAAK,EAAE,KAAKd,KAAL,CAAWc,KAAX,CAAiBE,OAAjB,CAAyBC,WAAzB;MAAjB,CAAV;IACD,CAFM,MAEA;MACL,KAAKF,IAAL,CAAUjB,GAAV;IACD;;IACD,KAAKoB,QAAL,GAAgBC,GAAhB,CAAqBV,KAAD,IAAW;MAC7B,IAAIA,KAAK,YAAYhB,SAArB,EAAgC;QAC9B,MAAMqB,KAAK,GAAGL,KAAK,CAACQ,WAAN,EAAd;QACA,KAAKF,IAAL,CAAU,EAAE,GAAGjB,GAAL;UAAUgB;QAAV,CAAV;MACD;IACF,CALD;EAMD;;AAnDH"}
+{"version":3,"names":["JsiDeclarationNode","PaintNode","JsiRenderNode","JsiDrawingNode","constructor","ctx","type","props","derived","deriveProps","setProps","setProp","name","value","hasChanged","addChild","child","Error","insertChildBefore","before","renderNode","paint","draw","children","map","materialize"],"sources":["DrawingNode.ts"],"sourcesContent":["import type {\n  DrawingContext,\n  DrawingNodeProps,\n  Node,\n  NodeType,\n  RenderNode,\n} from \"../types\";\n\nimport type { NodeContext } from \"./Node\";\nimport { JsiDeclarationNode } from \"./Node\";\nimport { PaintNode } from \"./PaintNode\";\nimport { JsiRenderNode } from \"./RenderNode\";\n\nexport abstract class JsiDrawingNode<P extends DrawingNodeProps, C>\n  extends JsiRenderNode<P>\n  implements RenderNode<P>\n{\n  protected derived?: C;\n\n  constructor(ctx: NodeContext, type: NodeType, props: P) {\n    super(ctx, type, props);\n    this.derived = this.deriveProps();\n  }\n\n  setProps(props: P) {\n    super.setProps(props);\n    this.derived = this.deriveProps();\n  }\n\n  setProp<K extends keyof P>(name: K, value: P[K]) {\n    const hasChanged = super.setProp(name, value);\n    if (hasChanged) {\n      this.derived = this.deriveProps();\n    }\n    return hasChanged;\n  }\n\n  addChild(child: Node<unknown>): void {\n    if (!(child instanceof JsiDeclarationNode)) {\n      throw new Error(`Cannot add ${child.type} to ${this.type}`);\n    }\n    super.addChild(child);\n    this.derived = this.deriveProps();\n  }\n\n  insertChildBefore(child: Node<unknown>, before: Node<unknown>): void {\n    if (!(child instanceof JsiDeclarationNode)) {\n      throw new Error(`Cannot add ${child.type} to ${this.type}`);\n    }\n    super.insertChildBefore(child, before);\n    this.derived = this.deriveProps();\n  }\n\n  renderNode(ctx: DrawingContext): void {\n    if (this.props.paint) {\n      this.draw({ ...ctx, paint: this.props.paint });\n    } else {\n      this.draw(ctx);\n    }\n    this.children().map((child) => {\n      if (child instanceof PaintNode) {\n        const paint = child.materialize();\n        this.draw({ ...ctx, paint });\n      }\n    });\n  }\n\n  protected abstract draw(ctx: DrawingContext): void;\n  protected abstract deriveProps(): C;\n}\n"],"mappings":";;AASA,SAASA,kBAAT,QAAmC,QAAnC;AACA,SAASC,SAAT,QAA0B,aAA1B;AACA,SAASC,aAAT,QAA8B,cAA9B;AAEA,OAAO,MAAeC,cAAf,SACGD,aADH,CAGP;EAGEE,WAAW,CAACC,GAAD,EAAmBC,IAAnB,EAAmCC,KAAnC,EAA6C;IACtD,MAAMF,GAAN,EAAWC,IAAX,EAAiBC,KAAjB;;IADsD;;IAEtD,KAAKC,OAAL,GAAe,KAAKC,WAAL,EAAf;EACD;;EAEDC,QAAQ,CAACH,KAAD,EAAW;IACjB,MAAMG,QAAN,CAAeH,KAAf;IACA,KAAKC,OAAL,GAAe,KAAKC,WAAL,EAAf;EACD;;EAEDE,OAAO,CAAoBC,IAApB,EAA6BC,KAA7B,EAA0C;IAC/C,MAAMC,UAAU,GAAG,MAAMH,OAAN,CAAcC,IAAd,EAAoBC,KAApB,CAAnB;;IACA,IAAIC,UAAJ,EAAgB;MACd,KAAKN,OAAL,GAAe,KAAKC,WAAL,EAAf;IACD;;IACD,OAAOK,UAAP;EACD;;EAEDC,QAAQ,CAACC,KAAD,EAA6B;IACnC,IAAI,EAAEA,KAAK,YAAYhB,kBAAnB,CAAJ,EAA4C;MAC1C,MAAM,IAAIiB,KAAJ,CAAW,cAAaD,KAAK,CAACV,IAAK,OAAM,KAAKA,IAAK,EAAnD,CAAN;IACD;;IACD,MAAMS,QAAN,CAAeC,KAAf;IACA,KAAKR,OAAL,GAAe,KAAKC,WAAL,EAAf;EACD;;EAEDS,iBAAiB,CAACF,KAAD,EAAuBG,MAAvB,EAAoD;IACnE,IAAI,EAAEH,KAAK,YAAYhB,kBAAnB,CAAJ,EAA4C;MAC1C,MAAM,IAAIiB,KAAJ,CAAW,cAAaD,KAAK,CAACV,IAAK,OAAM,KAAKA,IAAK,EAAnD,CAAN;IACD;;IACD,MAAMY,iBAAN,CAAwBF,KAAxB,EAA+BG,MAA/B;IACA,KAAKX,OAAL,GAAe,KAAKC,WAAL,EAAf;EACD;;EAEDW,UAAU,CAACf,GAAD,EAA4B;IACpC,IAAI,KAAKE,KAAL,CAAWc,KAAf,EAAsB;MACpB,KAAKC,IAAL,CAAU,EAAE,GAAGjB,GAAL;QAAUgB,KAAK,EAAE,KAAKd,KAAL,CAAWc;MAA5B,CAAV;IACD,CAFD,MAEO;MACL,KAAKC,IAAL,CAAUjB,GAAV;IACD;;IACD,KAAKkB,QAAL,GAAgBC,GAAhB,CAAqBR,KAAD,IAAW;MAC7B,IAAIA,KAAK,YAAYf,SAArB,EAAgC;QAC9B,MAAMoB,KAAK,GAAGL,KAAK,CAACS,WAAN,EAAd;QACA,KAAKH,IAAL,CAAU,EAAE,GAAGjB,GAAL;UAAUgB;QAAV,CAAV;MACD;IACF,CALD;EAMD;;AAjDH"}

package/lib/module/dom/nodes/JsiSkDOM.js

@@ -12,233 +12,233 @@ export class JsiSkDOM {
   }
 
   Layer(props) {
-    return new LayerNode(this.ctx, props !== null && props !== void 0 ? props : {});
+    return global.SkiaDomApi && global.SkiaDomApi.LayerNode ? global.SkiaDomApi.LayerNode(props !== null && props !== void 0 ? props : {}) : new LayerNode(this.ctx, props !== null && props !== void 0 ? props : {});
   }
 
   Group(props) {
-    return new GroupNode(this.ctx, props !== null && props !== void 0 ? props : {});
+    return global.SkiaDomApi && global.SkiaDomApi.GroupNode ? global.SkiaDomApi.GroupNode(props !== null && props !== void 0 ? props : {}) : new GroupNode(this.ctx, props !== null && props !== void 0 ? props : {});
   }
 
   Paint(props) {
-    return new PaintNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.PaintNode ? global.SkiaDomApi.PaintNode(props !== null && props !== void 0 ? props : {}) : new PaintNode(this.ctx, props);
   } // Drawings
 
 
   Fill(props) {
-    return new FillNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.FillNode ? global.SkiaDomApi.FillNode(props !== null && props !== void 0 ? props : {}) : new FillNode(this.ctx, props);
   }
 
   Image(props) {
-    return new ImageNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.ImageNode ? global.SkiaDomApi.ImageNode(props !== null && props !== void 0 ? props : {}) : new ImageNode(this.ctx, props);
   }
 
   Circle(props) {
-    return new CircleNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.CircleNode ? global.SkiaDomApi.CircleNode(props !== null && props !== void 0 ? props : {}) : new CircleNode(this.ctx, props);
   }
 
   Path(props) {
-    return new PathNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.PathNode ? global.SkiaDomApi.PathNode(props !== null && props !== void 0 ? props : {}) : new PathNode(this.ctx, props);
   }
 
   CustomDrawing(props) {
-    return new CustomDrawingNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.CustomDrawingNode ? global.SkiaDomApi.CustomDrawingNode(props !== null && props !== void 0 ? props : {}) : new CustomDrawingNode(this.ctx, props);
   }
 
   Line(props) {
-    return new LineNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.LineNode ? global.SkiaDomApi.LineNode(props !== null && props !== void 0 ? props : {}) : new LineNode(this.ctx, props);
   }
 
   Oval(props) {
-    return new OvalNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.OvalNode ? global.SkiaDomApi.OvalNode(props !== null && props !== void 0 ? props : {}) : new OvalNode(this.ctx, props);
   }
 
   Patch(props) {
-    return new PatchNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.PatchNode ? global.SkiaDomApi.PatchNode(props !== null && props !== void 0 ? props : {}) : new PatchNode(this.ctx, props);
   }
 
   Points(props) {
-    return new PointsNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.PointsNode ? global.SkiaDomApi.PointsNode(props !== null && props !== void 0 ? props : {}) : new PointsNode(this.ctx, props);
   }
 
   Rect(props) {
-    return new RectNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.RectNode ? global.SkiaDomApi.RectNode(props) : new RectNode(this.ctx, props);
   }
 
   RRect(props) {
-    return new RRectNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.RRectNode ? global.SkiaDomApi.RRectNode(props) : new RRectNode(this.ctx, props);
   }
 
   Vertices(props) {
-    return new VerticesNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.VerticesNode ? global.SkiaDomApi.VerticesNode(props) : new VerticesNode(this.ctx, props);
   }
 
   Text(props) {
-    return new TextNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.TextNode ? global.SkiaDomApi.TextNode(props) : new TextNode(this.ctx, props);
   }
 
   TextPath(props) {
-    return new TextPathNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.TextPathNode ? global.SkiaDomApi.TextPathNode(props) : new TextPathNode(this.ctx, props);
   }
 
   TextBlob(props) {
-    return new TextBlobNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.TextBlobNode ? global.SkiaDomApi.TextBlobNode(props) : new TextBlobNode(this.ctx, props);
   }
 
   Glyphs(props) {
-    return new GlyphsNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.GlyphsNode ? global.SkiaDomApi.GlyphsNode(props) : new GlyphsNode(this.ctx, props);
   }
 
   DiffRect(props) {
-    return new DiffRectNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.DiffRectNode ? global.SkiaDomApi.DiffRectNode(props) : new DiffRectNode(this.ctx, props);
   }
 
   Picture(props) {
-    return new PictureNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.PictureNode ? global.SkiaDomApi.PictureNode(props) : new PictureNode(this.ctx, props);
   }
 
   ImageSVG(props) {
-    return new ImageSVGNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.ImageSVGNode ? global.SkiaDomApi.ImageSVGNode(props) : new ImageSVGNode(this.ctx, props);
   } // BlurMaskFilters
 
 
   BlurMaskFilter(props) {
-    return new BlurMaskFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.BlurMaskFilterNode ? global.SkiaDomApi.BlurMaskFilterNode(props) : new BlurMaskFilterNode(this.ctx, props);
   } // ImageFilters
 
 
   BlendImageFilter(props) {
-    return new BlendImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.BlendImageFilterNode ? global.SkiaDomApi.BlendImageFilterNode(props) : new BlendImageFilterNode(this.ctx, props);
   }
 
   DropShadowImageFilter(props) {
-    return new DropShadowImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.DropShadowImageFilterNode ? global.SkiaDomApi.DropShadowImageFilterNode(props) : new DropShadowImageFilterNode(this.ctx, props);
   }
 
   DisplacementMapImageFilter(props) {
-    return new DisplacementMapImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.DisplacementMapImageFilterNode ? global.SkiaDomApi.DisplacementMapImageFilterNode(props) : new DisplacementMapImageFilterNode(this.ctx, props);
   }
 
   BlurImageFilter(props) {
-    return new BlurImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.BlurImageFilterNode ? global.SkiaDomApi.BlurImageFilterNode(props) : new BlurImageFilterNode(this.ctx, props);
   }
 
   OffsetImageFilter(props) {
-    return new OffsetImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.OffsetImageFilterNode ? global.SkiaDomApi.OffsetImageFilterNode(props) : new OffsetImageFilterNode(this.ctx, props);
   }
 
   MorphologyImageFilter(props) {
-    return new MorphologyImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.MorphologyImageFilterNode ? global.SkiaDomApi.MorphologyImageFilterNode(props) : new MorphologyImageFilterNode(this.ctx, props);
   }
 
   RuntimeShaderImageFilter(props) {
-    return new RuntimeShaderImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.RuntimeShaderImageFilterNode ? global.SkiaDomApi.RuntimeShaderImageFilterNode(props) : new RuntimeShaderImageFilterNode(this.ctx, props);
   } // Color Filters
 
 
   MatrixColorFilter(props) {
-    return new MatrixColorFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.MatrixColorFilterNode ? global.SkiaDomApi.MatrixColorFilterNode(props) : new MatrixColorFilterNode(this.ctx, props);
   }
 
   BlendColorFilter(props) {
-    return new BlendColorFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.BlendColorFilterNode ? global.SkiaDomApi.BlendColorFilterNode(props) : new BlendColorFilterNode(this.ctx, props);
   }
 
   LumaColorFilter() {
-    return new LumaColorFilterNode(this.ctx);
+    return global.SkiaDomApi && global.SkiaDomApi.LumaColorFilterNode ? global.SkiaDomApi.LumaColorFilterNode() : new LumaColorFilterNode(this.ctx);
   }
 
   LinearToSRGBGammaColorFilter() {
-    return new LinearToSRGBGammaColorFilterNode(this.ctx);
+    return global.SkiaDomApi && global.SkiaDomApi.LinearToSRGBGammaColorFilterNode ? global.SkiaDomApi.LinearToSRGBGammaColorFilterNode() : new LinearToSRGBGammaColorFilterNode(this.ctx);
   }
 
   SRGBToLinearGammaColorFilter() {
-    return new SRGBToLinearGammaColorFilterNode(this.ctx);
+    return global.SkiaDomApi && global.SkiaDomApi.SRGBToLinearGammaColorFilterNode ? global.SkiaDomApi.SRGBToLinearGammaColorFilterNode() : new SRGBToLinearGammaColorFilterNode(this.ctx);
   }
 
   LerpColorFilter(props) {
-    return new LerpColorFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.LerpColorFilterNode ? global.SkiaDomApi.LerpColorFilterNode(props) : new LerpColorFilterNode(this.ctx, props);
   } // Shaders
 
 
   Shader(props) {
-    return new ShaderNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.ShaderNode ? global.SkiaDomApi.ShaderNode(props) : new ShaderNode(this.ctx, props);
   }
 
   ImageShader(props) {
-    return new ImageShaderNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.ImageShaderNode ? global.SkiaDomApi.ImageShaderNode(props) : new ImageShaderNode(this.ctx, props);
   }
 
   ColorShader(props) {
-    return new ColorNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.ColorShaderNode ? global.SkiaDomApi.ColorShaderNode(props) : new ColorNode(this.ctx, props);
   }
 
   SweepGradient(props) {
-    return new SweepGradientNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.SweepGradientNode ? global.SkiaDomApi.SweepGradientNode(props) : new SweepGradientNode(this.ctx, props);
   }
 
   Turbulence(props) {
-    return new TurbulenceNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.TurbulenceNode ? global.SkiaDomApi.TurbulenceNode(props) : new TurbulenceNode(this.ctx, props);
   }
 
   FractalNoise(props) {
-    return new FractalNoiseNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.FractalNoiseNode ? global.SkiaDomApi.FractalNoiseNode(props) : new FractalNoiseNode(this.ctx, props);
   }
 
   LinearGradient(props) {
-    return new LinearGradientNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.LinearGradientNode ? global.SkiaDomApi.LinearGradientNode(props) : new LinearGradientNode(this.ctx, props);
   }
 
   RadialGradient(props) {
-    return new RadialGradientNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.RadialGradientNode ? global.SkiaDomApi.RadialGradientNode(props) : new RadialGradientNode(this.ctx, props);
   }
 
   TwoPointConicalGradient(props) {
-    return new TwoPointConicalGradientNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.TwoPointConicalGradientNode ? global.SkiaDomApi.TwoPointConicalGradientNode(props) : new TwoPointConicalGradientNode(this.ctx, props);
   } // Path Effects
 
 
   CornerPathEffect(props) {
-    return new CornerPathEffectNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.CornerPathEffectNode ? global.SkiaDomApi.CornerPathEffectNode(props) : new CornerPathEffectNode(this.ctx, props);
   }
 
   DiscretePathEffect(props) {
-    return new DiscretePathEffectNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.DiscretePathEffectNode ? global.SkiaDomApi.DiscretePathEffectNode(props) : new DiscretePathEffectNode(this.ctx, props);
   }
 
   DashPathEffect(props) {
-    return new DashPathEffectNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.DashPathEffectNode ? global.SkiaDomApi.DashPathEffectNode(props) : new DashPathEffectNode(this.ctx, props);
   }
 
   Path1DPathEffect(props) {
-    return new Path1DPathEffectNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.Path1DPathEffectNode ? global.SkiaDomApi.Path1DPathEffectNode(props) : new Path1DPathEffectNode(this.ctx, props);
   }
 
   Path2DPathEffect(props) {
-    return new Path2DPathEffectNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.Path2DPathEffectNode ? global.SkiaDomApi.Path2DPathEffectNode(props) : new Path2DPathEffectNode(this.ctx, props);
   }
 
   SumPathEffect() {
-    return new SumPathEffectNode(this.ctx);
+    return global.SkiaDomApi && global.SkiaDomApi.SumPathEffectNode ? global.SkiaDomApi.SumPathEffectNode() : new SumPathEffectNode(this.ctx);
   }
 
   Line2DPathEffect(props) {
-    return new Line2DPathEffectNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.Line2DPathEffectNode ? global.SkiaDomApi.Line2DPathEffectNode(props) : new Line2DPathEffectNode(this.ctx, props);
   }
 
   Blend(props) {
-    return new BlendNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.BlendNode ? global.SkiaDomApi.BlendNode(props) : new BlendNode(this.ctx, props);
   }
 
   BackdropFilter(props) {
-    return new BackdropFilterNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.BackdropFilterNode ? global.SkiaDomApi.BackdropFilterNode(props) : new BackdropFilterNode(this.ctx, props);
   }
 
   Box(props) {
-    return new BoxNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.BoxNode ? global.SkiaDomApi.BoxNode(props) : new BoxNode(this.ctx, props);
   }
 
   BoxShadow(props) {
-    return new BoxShadowNode(this.ctx, props);
+    return global.SkiaDomApi && global.SkiaDomApi.BoxShadowNode ? global.SkiaDomApi.BoxShadowNode(props) : new BoxShadowNode(this.ctx, props);
   }
 
 }