@shopify/react-native-skia 0.1.189 → 0.1.191

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

@@ -1 +1 @@
-{"version":3,"names":["React","PixelRatio","View","JsiSkSurface","TouchType","pd","get","SkiaBaseWebView","Component","constructor","props","createRef","_mode","mode","unsubscribeAll","_unsubscriptions","forEach","u","onLayout","evt","CanvasKit","global","width","height","nativeEvent","layout","_canvasRef","current","canvas","surface","MakeWebGLCanvasSurface","Error","_surface","_canvas","getCanvas","redraw","getSize","componentDidMount","tick","componentDidUpdate","componentWillUnmount","cancelAnimationFrame","requestId","getContext","getExtension","loseContext","makeImageSnapshot","rect","clear","TRANSPARENT","renderInCanvas","ref","flush","_redrawRequests","touches","_touches","Float32Array","of","save","scale","restore","requestAnimationFrame","bind","setDrawMode","registerValues","_values","v","push","addListener","handleTouchEvent","touchType","id","pointerId","x","clientX","currentTarget","getClientRects","left","y","clientY","top","force","pressure","type","timestamp","Date","now","createTouchHandler","render","debug","viewProps","display","flex","Start","Active","End","Cancelled"],"sources":["SkiaBaseWebView.tsx"],"sourcesContent":["/* global HTMLCanvasElement */\nimport React from \"react\";\nimport type { PointerEvent } from \"react\";\nimport type { LayoutChangeEvent } from \"react-native\";\nimport { PixelRatio, View } from \"react-native\";\n\nimport type { SkRect, SkCanvas } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\nimport { JsiSkSurface } from \"../skia/web/JsiSkSurface\";\n\nimport type { DrawMode, SkiaBaseViewProps, TouchInfo } from \"./types\";\nimport { TouchType } from \"./types\";\n\nconst pd = PixelRatio.get();\n\nexport abstract class SkiaBaseWebView<\n  TProps extends SkiaBaseViewProps\n> extends React.Component<TProps> {\n  constructor(props: TProps) {\n    super(props);\n    this._mode = props.mode ?? \"default\";\n  }\n\n  private _surface: JsiSkSurface | null = null;\n  private _unsubscriptions: Array<() => void> = [];\n  private _touches: Array<TouchInfo> = [];\n  private _canvas: SkCanvas | null = null;\n  private _canvasRef = React.createRef<HTMLCanvasElement>();\n  private _mode: DrawMode;\n  private _redrawRequests = 0;\n  private requestId = 0;\n\n  protected width = 0;\n  protected height = 0;\n\n  private unsubscribeAll() {\n    this._unsubscriptions.forEach((u) => u());\n    this._unsubscriptions = [];\n  }\n\n  private onLayout(evt: LayoutChangeEvent) {\n    const { CanvasKit } = global;\n    const { width, height } = evt.nativeEvent.layout;\n    this.width = width;\n    this.height = height;\n    // Reset canvas / surface on layout change\n    if (this._canvasRef.current) {\n      const canvas = this._canvasRef.current;\n      canvas.width = width * pd;\n      canvas.height = height * pd;\n      const surface = CanvasKit.MakeWebGLCanvasSurface(this._canvasRef.current);\n      if (!surface) {\n        throw new Error(\"Could not create surface\");\n      }\n      this._surface = new JsiSkSurface(CanvasKit, surface);\n      this._canvas = this._surface.getCanvas();\n      this.redraw();\n    }\n    // Call onLayout callback if it exists\n    if (this.props.onLayout) {\n      this.props.onLayout(evt);\n    }\n  }\n\n  protected getSize() {\n    return { width: this.width, height: this.height };\n  }\n\n  componentDidMount() {\n    // Start render loop\n    this.tick();\n  }\n\n  componentDidUpdate() {\n    this.redraw();\n  }\n\n  componentWillUnmount() {\n    this.unsubscribeAll();\n    cancelAnimationFrame(this.requestId);\n    // https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_lose_context\n    this._canvasRef.current\n      ?.getContext(\"webgl2\")\n      ?.getExtension(\"WEBGL_lose_context\")\n      ?.loseContext();\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    this._canvas!.clear(CanvasKit.TRANSPARENT);\n    this.renderInCanvas(this._canvas!, []);\n    this._surface?.ref.flush();\n    return this._surface?.makeImageSnapshot(rect);\n  }\n\n  /**\n   * Override to render\n   */\n  protected abstract renderInCanvas(\n    canvas: SkCanvas,\n    touches: TouchInfo[]\n  ): void;\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  private tick() {\n    if (this._mode === \"continuous\" || this._redrawRequests > 0) {\n      this._redrawRequests = 0;\n      if (this._canvas) {\n        const touches = [...this._touches];\n        this._touches = [];\n        const canvas = this._canvas!;\n        canvas.clear(Float32Array.of(0, 0, 0, 0));\n        canvas.save();\n        canvas.scale(pd, pd);\n        this.renderInCanvas(canvas, touches);\n        canvas.restore();\n        this._surface?.ref.flush();\n      }\n    }\n    this.requestId = requestAnimationFrame(this.tick.bind(this));\n  }\n\n  public redraw() {\n    this._redrawRequests++;\n  }\n\n  /**\n   * Updates the drawing mode for the skia view. This is the same\n   * as declaratively setting the mode property on the SkiaView.\n   * There are two drawing modes, \"continuous\" and \"default\",\n   * where the continuous mode will continuously redraw the view and\n   * the default mode will only redraw when any of the regular react\n   * properties are changed like size and margins.\n   * @param mode Drawing mode to use.\n   */\n  public setDrawMode(mode: DrawMode) {\n    this._mode = mode;\n    this.tick();\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>[]) {\n    // Unsubscribe from dependency values\n    this.unsubscribeAll();\n    // Register redraw dependencies on values\n    _values.forEach((v) => {\n      this._unsubscriptions.push(\n        v.addListener(() => {\n          this.redraw();\n        })\n      );\n    });\n  }\n\n  private handleTouchEvent(evt: PointerEvent, touchType: TouchType) {\n    this._touches.push({\n      id: evt.pointerId,\n      x: evt.clientX - evt.currentTarget.getClientRects()[0].left,\n      y: evt.clientY - evt.currentTarget.getClientRects()[0].top,\n      force: evt.pressure,\n      type: touchType,\n      timestamp: Date.now(),\n    });\n    this.redraw();\n  }\n\n  createTouchHandler(touchType: TouchType) {\n    return (evt: PointerEvent) => this.handleTouchEvent(evt, touchType);\n  }\n\n  render() {\n    const { mode, debug = false, ...viewProps } = this.props;\n    return (\n      <View {...viewProps} onLayout={this.onLayout.bind(this)}>\n        <canvas\n          ref={this._canvasRef}\n          style={{ display: \"flex\", flex: 1 }}\n          onPointerDown={this.createTouchHandler(TouchType.Start)}\n          onPointerMove={this.createTouchHandler(TouchType.Active)}\n          onPointerUp={this.createTouchHandler(TouchType.End)}\n          onPointerCancel={this.createTouchHandler(TouchType.Cancelled)}\n          onPointerLeave={this.createTouchHandler(TouchType.End)}\n          onPointerOut={this.createTouchHandler(TouchType.End)}\n        />\n      </View>\n    );\n  }\n}\n"],"mappings":";;;;AAAA;AACA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,SAASC,UAAT,EAAqBC,IAArB,QAAiC,cAAjC;AAIA,SAASC,YAAT,QAA6B,0BAA7B;AAGA,SAASC,SAAT,QAA0B,SAA1B;AAEA,MAAMC,EAAE,GAAGJ,UAAU,CAACK,GAAX,EAAX;AAEA,OAAO,MAAeC,eAAf,SAEGP,KAAK,CAACQ,SAFT,CAE2B;EAChCC,WAAW,CAACC,KAAD,EAAgB;IAAA;;IACzB,MAAMA,KAAN;;IADyB,kCAKa,IALb;;IAAA,0CAMmB,EANnB;;IAAA,kCAOU,EAPV;;IAAA,iCAQQ,IARR;;IAAA,iDASNV,KAAK,CAACW,SAAN,EATM;;IAAA;;IAAA,yCAWD,CAXC;;IAAA,mCAYP,CAZO;;IAAA,+BAcT,CAdS;;IAAA,gCAeR,CAfQ;;IAEzB,KAAKC,KAAL,kBAAaF,KAAK,CAACG,IAAnB,qDAA2B,SAA3B;EACD;;EAcOC,cAAc,GAAG;IACvB,KAAKC,gBAAL,CAAsBC,OAAtB,CAA+BC,CAAD,IAAOA,CAAC,EAAtC;;IACA,KAAKF,gBAAL,GAAwB,EAAxB;EACD;;EAEOG,QAAQ,CAACC,GAAD,EAAyB;IACvC,MAAM;MAAEC;IAAF,IAAgBC,MAAtB;IACA,MAAM;MAAEC,KAAF;MAASC;IAAT,IAAoBJ,GAAG,CAACK,WAAJ,CAAgBC,MAA1C;IACA,KAAKH,KAAL,GAAaA,KAAb;IACA,KAAKC,MAAL,GAAcA,MAAd,CAJuC,CAKvC;;IACA,IAAI,KAAKG,UAAL,CAAgBC,OAApB,EAA6B;MAC3B,MAAMC,MAAM,GAAG,KAAKF,UAAL,CAAgBC,OAA/B;MACAC,MAAM,CAACN,KAAP,GAAeA,KAAK,GAAGjB,EAAvB;MACAuB,MAAM,CAACL,MAAP,GAAgBA,MAAM,GAAGlB,EAAzB;MACA,MAAMwB,OAAO,GAAGT,SAAS,CAACU,sBAAV,CAAiC,KAAKJ,UAAL,CAAgBC,OAAjD,CAAhB;;MACA,IAAI,CAACE,OAAL,EAAc;QACZ,MAAM,IAAIE,KAAJ,CAAU,0BAAV,CAAN;MACD;;MACD,KAAKC,QAAL,GAAgB,IAAI7B,YAAJ,CAAiBiB,SAAjB,EAA4BS,OAA5B,CAAhB;MACA,KAAKI,OAAL,GAAe,KAAKD,QAAL,CAAcE,SAAd,EAAf;MACA,KAAKC,MAAL;IACD,CAjBsC,CAkBvC;;;IACA,IAAI,KAAKzB,KAAL,CAAWQ,QAAf,EAAyB;MACvB,KAAKR,KAAL,CAAWQ,QAAX,CAAoBC,GAApB;IACD;EACF;;EAESiB,OAAO,GAAG;IAClB,OAAO;MAAEd,KAAK,EAAE,KAAKA,KAAd;MAAqBC,MAAM,EAAE,KAAKA;IAAlC,CAAP;EACD;;EAEDc,iBAAiB,GAAG;IAClB;IACA,KAAKC,IAAL;EACD;;EAEDC,kBAAkB,GAAG;IACnB,KAAKJ,MAAL;EACD;;EAEDK,oBAAoB,GAAG;IAAA;;IACrB,KAAK1B,cAAL;IACA2B,oBAAoB,CAAC,KAAKC,SAAN,CAApB,CAFqB,CAGrB;;IACA,8BAAKhB,UAAL,CAAgBC,OAAhB,0GACIgB,UADJ,CACe,QADf,6GAEIC,YAFJ,CAEiB,oBAFjB,mFAGIC,WAHJ;EAID;EAED;AACF;AACA;AACA;AACA;;;EACSC,iBAAiB,CAACC,IAAD,EAAgB;IAAA;;IACtC,KAAKd,OAAL,CAAce,KAAd,CAAoB5B,SAAS,CAAC6B,WAA9B;;IACA,KAAKC,cAAL,CAAoB,KAAKjB,OAAzB,EAAmC,EAAnC;IACA,uBAAKD,QAAL,kEAAemB,GAAf,CAAmBC,KAAnB;IACA,0BAAO,KAAKpB,QAAZ,oDAAO,gBAAec,iBAAf,CAAiCC,IAAjC,CAAP;EACD;EAED;AACF;AACA;;;EAME;AACF;AACA;EACUT,IAAI,GAAG;IACb,IAAI,KAAK1B,KAAL,KAAe,YAAf,IAA+B,KAAKyC,eAAL,GAAuB,CAA1D,EAA6D;MAC3D,KAAKA,eAAL,GAAuB,CAAvB;;MACA,IAAI,KAAKpB,OAAT,EAAkB;QAAA;;QAChB,MAAMqB,OAAO,GAAG,CAAC,GAAG,KAAKC,QAAT,CAAhB;QACA,KAAKA,QAAL,GAAgB,EAAhB;QACA,MAAM3B,MAAM,GAAG,KAAKK,OAApB;QACAL,MAAM,CAACoB,KAAP,CAAaQ,YAAY,CAACC,EAAb,CAAgB,CAAhB,EAAmB,CAAnB,EAAsB,CAAtB,EAAyB,CAAzB,CAAb;QACA7B,MAAM,CAAC8B,IAAP;QACA9B,MAAM,CAAC+B,KAAP,CAAatD,EAAb,EAAiBA,EAAjB;QACA,KAAK6C,cAAL,CAAoBtB,MAApB,EAA4B0B,OAA5B;QACA1B,MAAM,CAACgC,OAAP;QACA,wBAAK5B,QAAL,oEAAemB,GAAf,CAAmBC,KAAnB;MACD;IACF;;IACD,KAAKV,SAAL,GAAiBmB,qBAAqB,CAAC,KAAKvB,IAAL,CAAUwB,IAAV,CAAe,IAAf,CAAD,CAAtC;EACD;;EAEM3B,MAAM,GAAG;IACd,KAAKkB,eAAL;EACD;EAED;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;EACSU,WAAW,CAAClD,IAAD,EAAiB;IACjC,KAAKD,KAAL,GAAaC,IAAb;IACA,KAAKyB,IAAL;EACD;EAED;AACF;AACA;AACA;AACA;;;EACS0B,cAAc,CAACC,OAAD,EAAgC;IACnD;IACA,KAAKnD,cAAL,GAFmD,CAGnD;;IACAmD,OAAO,CAACjD,OAAR,CAAiBkD,CAAD,IAAO;MACrB,KAAKnD,gBAAL,CAAsBoD,IAAtB,CACED,CAAC,CAACE,WAAF,CAAc,MAAM;QAClB,KAAKjC,MAAL;MACD,CAFD,CADF;IAKD,CAND;EAOD;;EAEOkC,gBAAgB,CAAClD,GAAD,EAAoBmD,SAApB,EAA0C;IAChE,KAAKf,QAAL,CAAcY,IAAd,CAAmB;MACjBI,EAAE,EAAEpD,GAAG,CAACqD,SADS;MAEjBC,CAAC,EAAEtD,GAAG,CAACuD,OAAJ,GAAcvD,GAAG,CAACwD,aAAJ,CAAkBC,cAAlB,GAAmC,CAAnC,EAAsCC,IAFtC;MAGjBC,CAAC,EAAE3D,GAAG,CAAC4D,OAAJ,GAAc5D,GAAG,CAACwD,aAAJ,CAAkBC,cAAlB,GAAmC,CAAnC,EAAsCI,GAHtC;MAIjBC,KAAK,EAAE9D,GAAG,CAAC+D,QAJM;MAKjBC,IAAI,EAAEb,SALW;MAMjBc,SAAS,EAAEC,IAAI,CAACC,GAAL;IANM,CAAnB;;IAQA,KAAKnD,MAAL;EACD;;EAEDoD,kBAAkB,CAACjB,SAAD,EAAuB;IACvC,OAAQnD,GAAD,IAAuB,KAAKkD,gBAAL,CAAsBlD,GAAtB,EAA2BmD,SAA3B,CAA9B;EACD;;EAEDkB,MAAM,GAAG;IACP,MAAM;MAAE3E,IAAF;MAAQ4E,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKhF,KAAnD;IACA,oBACE,oBAAC,IAAD,eAAUgF,SAAV;MAAqB,QAAQ,EAAE,KAAKxE,QAAL,CAAc4C,IAAd,CAAmB,IAAnB;IAA/B,iBACE;MACE,GAAG,EAAE,KAAKpC,UADZ;MAEE,KAAK,EAAE;QAAEiE,OAAO,EAAE,MAAX;QAAmBC,IAAI,EAAE;MAAzB,CAFT;MAGE,aAAa,EAAE,KAAKL,kBAAL,CAAwBnF,SAAS,CAACyF,KAAlC,CAHjB;MAIE,aAAa,EAAE,KAAKN,kBAAL,CAAwBnF,SAAS,CAAC0F,MAAlC,CAJjB;MAKE,WAAW,EAAE,KAAKP,kBAAL,CAAwBnF,SAAS,CAAC2F,GAAlC,CALf;MAME,eAAe,EAAE,KAAKR,kBAAL,CAAwBnF,SAAS,CAAC4F,SAAlC,CANnB;MAOE,cAAc,EAAE,KAAKT,kBAAL,CAAwBnF,SAAS,CAAC2F,GAAlC,CAPlB;MAQE,YAAY,EAAE,KAAKR,kBAAL,CAAwBnF,SAAS,CAAC2F,GAAlC;IARhB,EADF,CADF;EAcD;;AAnL+B"}
+{"version":3,"names":["React","JsiSkSurface","Platform","TouchType","pd","PixelRatio","SkiaBaseWebView","Component","constructor","props","createRef","createTouchHandler","Start","Active","Cancelled","End","onLayoutEvent","bind","_mode","mode","unsubscribeAll","_unsubscriptions","forEach","u","evt","CanvasKit","global","canvas","_canvasRef","current","width","clientWidth","height","clientHeight","surface","MakeWebGLCanvasSurface","Error","_surface","_canvas","getCanvas","redraw","onLayout","getSize","componentDidMount","tick","componentDidUpdate","componentWillUnmount","cancelAnimationFrame","requestId","getContext","getExtension","loseContext","makeImageSnapshot","rect","clear","TRANSPARENT","renderInCanvas","ref","flush","_redrawRequests","touches","_touches","Float32Array","of","save","scale","restore","requestAnimationFrame","setDrawMode","registerValues","_values","v","push","addListener","handleTouchEvent","touchType","id","pointerId","x","clientX","currentTarget","getClientRects","left","y","clientY","top","force","pressure","type","timestamp","Date","now","render","debug","viewProps","display","flex","onStart","onActive","onEnd","onCancel"],"sources":["SkiaBaseWebView.tsx"],"sourcesContent":["/* global HTMLCanvasElement */\nimport React from \"react\";\nimport type { PointerEvent } from \"react\";\nimport type { LayoutChangeEvent } from \"react-native\";\n\nimport type { SkRect, SkCanvas } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\nimport { JsiSkSurface } from \"../skia/web/JsiSkSurface\";\nimport { Platform } from \"../Platform\";\n\nimport type { DrawMode, SkiaBaseViewProps, TouchInfo } from \"./types\";\nimport { TouchType } from \"./types\";\n\nconst pd = Platform.PixelRatio;\n\nexport abstract class SkiaBaseWebView<\n  TProps extends SkiaBaseViewProps\n> extends React.Component<TProps> {\n  constructor(props: TProps) {\n    super(props);\n    this._mode = props.mode ?? \"default\";\n  }\n\n  private _surface: JsiSkSurface | null = null;\n  private _unsubscriptions: Array<() => void> = [];\n  private _touches: Array<TouchInfo> = [];\n  private _canvas: SkCanvas | null = null;\n  private _canvasRef = React.createRef<HTMLCanvasElement>();\n  private _mode: DrawMode;\n  private _redrawRequests = 0;\n  private requestId = 0;\n\n  protected width = 0;\n  protected height = 0;\n\n  private unsubscribeAll() {\n    this._unsubscriptions.forEach((u) => u());\n    this._unsubscriptions = [];\n  }\n\n  private onLayoutEvent(evt: LayoutChangeEvent) {\n    const { CanvasKit } = global;\n    // Reset canvas / surface on layout change\n    const canvas = this._canvasRef.current;\n    if (canvas) {\n      this.width = canvas.clientWidth;\n      this.height = canvas.clientHeight;\n      canvas.width = this.width * pd;\n      canvas.height = this.height * pd;\n      const surface = CanvasKit.MakeWebGLCanvasSurface(canvas);\n      if (!surface) {\n        throw new Error(\"Could not create surface\");\n      }\n      this._surface = new JsiSkSurface(CanvasKit, surface);\n      this._canvas = this._surface.getCanvas();\n      this.redraw();\n    }\n    // Call onLayout callback if it exists\n    if (this.props.onLayout) {\n      this.props.onLayout(evt);\n    }\n  }\n\n  protected getSize() {\n    return { width: this.width, height: this.height };\n  }\n\n  componentDidMount() {\n    // Start render loop\n    this.tick();\n  }\n\n  componentDidUpdate() {\n    this.redraw();\n  }\n\n  componentWillUnmount() {\n    this.unsubscribeAll();\n    cancelAnimationFrame(this.requestId);\n    // eslint-disable-next-line max-len\n    // https://stackoverflow.com/questions/23598471/how-do-i-clean-up-and-unload-a-webgl-canvas-context-from-gpu-after-use\n    // https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_lose_context\n    // We delete the context, only if the context has been intialized\n    if (this._surface) {\n      this._canvasRef.current\n        ?.getContext(\"webgl2\")\n        ?.getExtension(\"WEBGL_lose_context\")\n        ?.loseContext();\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    this._canvas!.clear(CanvasKit.TRANSPARENT);\n    this.renderInCanvas(this._canvas!, []);\n    this._surface?.ref.flush();\n    return this._surface?.makeImageSnapshot(rect);\n  }\n\n  /**\n   * Override to render\n   */\n  protected abstract renderInCanvas(\n    canvas: SkCanvas,\n    touches: TouchInfo[]\n  ): void;\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  private tick() {\n    if (this._mode === \"continuous\" || this._redrawRequests > 0) {\n      this._redrawRequests = 0;\n      if (this._canvas) {\n        const touches = [...this._touches];\n        this._touches = [];\n        const canvas = this._canvas!;\n        canvas.clear(Float32Array.of(0, 0, 0, 0));\n        canvas.save();\n        canvas.scale(pd, pd);\n        this.renderInCanvas(canvas, touches);\n        canvas.restore();\n        this._surface?.ref.flush();\n      }\n    }\n    this.requestId = requestAnimationFrame(this.tick.bind(this));\n  }\n\n  public redraw() {\n    this._redrawRequests++;\n  }\n\n  /**\n   * Updates the drawing mode for the skia view. This is the same\n   * as declaratively setting the mode property on the SkiaView.\n   * There are two drawing modes, \"continuous\" and \"default\",\n   * where the continuous mode will continuously redraw the view and\n   * the default mode will only redraw when any of the regular react\n   * properties are changed like size and margins.\n   * @param mode Drawing mode to use.\n   */\n  public setDrawMode(mode: DrawMode) {\n    this._mode = mode;\n    this.tick();\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>[]) {\n    // Unsubscribe from dependency values\n    this.unsubscribeAll();\n    // Register redraw dependencies on values\n    _values.forEach((v) => {\n      this._unsubscriptions.push(\n        v.addListener(() => {\n          this.redraw();\n        })\n      );\n    });\n  }\n\n  private handleTouchEvent(evt: PointerEvent, touchType: TouchType) {\n    this._touches.push({\n      id: evt.pointerId,\n      x: evt.clientX - evt.currentTarget.getClientRects()[0].left,\n      y: evt.clientY - evt.currentTarget.getClientRects()[0].top,\n      force: evt.pressure,\n      type: touchType,\n      timestamp: Date.now(),\n    });\n    this.redraw();\n  }\n\n  createTouchHandler(touchType: TouchType) {\n    return (evt: PointerEvent) => this.handleTouchEvent(evt, touchType);\n  }\n\n  private onStart = this.createTouchHandler(TouchType.Start);\n  private onActive = this.createTouchHandler(TouchType.Active);\n  private onCancel = this.createTouchHandler(TouchType.Cancelled);\n  private onEnd = this.createTouchHandler(TouchType.End);\n  private onLayout = this.onLayoutEvent.bind(this);\n\n  render() {\n    const { mode, debug = false, ...viewProps } = this.props;\n    return (\n      <Platform.View {...viewProps} onLayout={this.onLayout}>\n        <canvas\n          ref={this._canvasRef}\n          style={{ display: \"flex\", flex: 1 }}\n          onPointerDown={this.onStart}\n          onPointerMove={this.onActive}\n          onPointerUp={this.onEnd}\n          onPointerCancel={this.onCancel}\n          onPointerLeave={this.onEnd}\n          onPointerOut={this.onEnd}\n        />\n      </Platform.View>\n    );\n  }\n}\n"],"mappings":"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"}

package/lib/module/views/SkiaDomView.js

@@ -3,10 +3,10 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 import React from "react";
-import { requireNativeComponent, Platform } from "react-native";
+import { Platform } from "../Platform";
 import { SkiaViewApi } from "./api";
 import { SkiaViewNativeId } from "./SkiaView";
-const NativeSkiaDomView = Platform.OS !== "web" ? requireNativeComponent("SkiaDomView") : // eslint-disable-next-line @typescript-eslint/no-explicit-any
+const NativeSkiaDomView = Platform.OS !== "web" ? Platform.requireNativeComponent("SkiaDomView") : // eslint-disable-next-line @typescript-eslint/no-explicit-any
 null;
 export class SkiaDomView extends React.Component {
   constructor(props) {

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

@@ -1 +1 @@
-{"version":3,"names":["React","requireNativeComponent","Platform","SkiaViewApi","SkiaViewNativeId","NativeSkiaDomView","OS","SkiaDomView","Component","constructor","props","_nativeId","current","root","onTouch","onSize","assertSkiaViewApi","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":"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"}
+{"version":3,"names":["React","Platform","SkiaViewApi","SkiaViewNativeId","NativeSkiaDomView","OS","requireNativeComponent","SkiaDomView","Component","constructor","props","_nativeId","current","root","onTouch","onSize","assertSkiaViewApi","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 type { HostComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\nimport { Platform } from \"../Platform\";\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    ? Platform.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,OAAOA,KAAP,MAAkB,OAAlB;AAKA,SAASC,QAAT,QAAyB,aAAzB;AAEA,SAASC,WAAT,QAA4B,OAA5B;AACA,SAASC,gBAAT,QAAiC,YAAjC;AAGA,MAAMC,iBAAkD,GACtDH,QAAQ,CAACI,EAAT,KAAgB,KAAhB,GACIJ,QAAQ,CAACK,sBAAT,CAAqD,aAArD,CADJ,GAEI;AACC,IAJP;AAMA,OAAO,MAAMC,WAAN,SAA0BP,KAAK,CAACQ,SAAhC,CAA4D;EACjEC,WAAW,CAACC,KAAD,EAA0B;IACnC,MAAMA,KAAN;;IADmC;;IAEnC,KAAKC,SAAL,GAAiBR,gBAAgB,CAACS,OAAjB,EAAjB;IACA,MAAM;MAAEC,IAAF;MAAQC,OAAR;MAAiBC;IAAjB,IAA4BL,KAAlC;;IACA,IAAIG,IAAJ,EAAU;MACRG,iBAAiB;MACjBd,WAAW,CAACe,cAAZ,CAA2B,KAAKN,SAAhC,EAA2C,MAA3C,EAAmDE,IAAnD;IACD;;IACD,IAAIC,OAAJ,EAAa;MACXE,iBAAiB;MACjBd,WAAW,CAACe,cAAZ,CAA2B,KAAKN,SAAhC,EAA2C,SAA3C,EAAsDG,OAAtD;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;MACjBd,WAAW,CAACe,cAAZ,CAA2B,KAAKN,SAAhC,EAA2C,QAA3C,EAAqDI,MAArD;IACD;EACF;;EAIkB,IAARG,QAAQ,GAAG;IACpB,OAAO,KAAKP,SAAZ;EACD;;EAEDQ,kBAAkB,CAACC,SAAD,EAA8B;IAC9C,MAAM;MAAEP,IAAF;MAAQC,OAAR;MAAiBC;IAAjB,IAA4B,KAAKL,KAAvC;;IACA,IAAIG,IAAI,KAAKO,SAAS,CAACP,IAAvB,EAA6B;MAC3BG,iBAAiB;MACjBd,WAAW,CAACe,cAAZ,CAA2B,KAAKN,SAAhC,EAA2C,MAA3C,EAAmDE,IAAnD;IACD;;IACD,IAAIC,OAAO,KAAKM,SAAS,CAACN,OAA1B,EAAmC;MACjCE,iBAAiB;MACjBd,WAAW,CAACe,cAAZ,CAA2B,KAAKN,SAAhC,EAA2C,SAA3C,EAAsDG,OAAtD;IACD;;IACD,IAAIC,MAAM,KAAKK,SAAS,CAACL,MAAzB,EAAiC;MAC/BC,iBAAiB;MACjBd,WAAW,CAACe,cAAZ,CAA2B,KAAKN,SAAhC,EAA2C,QAA3C,EAAqDI,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSM,iBAAiB,CAACC,IAAD,EAAgB;IACtCN,iBAAiB;IACjB,OAAOd,WAAW,CAACmB,iBAAZ,CAA8B,KAAKV,SAAnC,EAA8CW,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdP,iBAAiB;IACjBd,WAAW,CAACsB,aAAZ,CAA0B,KAAKb,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSc,cAAc,CAACC,MAAD,EAA2C;IAC9DV,iBAAiB;IACjB,OAAOd,WAAW,CAACyB,oBAAZ,CAAiC,KAAKhB,SAAtC,EAAiDe,MAAjD,CAAP;EACD;EAED;AACF;AACA;;;EACEE,oBAAoB,GAAS;IAC3BZ,iBAAiB;IACjBd,WAAW,CAACe,cAAZ,CAA2B,KAAKN,SAAhC,EAA2C,MAA3C,EAAmD,IAAnD;EACD;;EAEDkB,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKtB,KAAnD;IACA,oBACE,oBAAC,iBAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEmB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxFgE;;AA2FnE,MAAMhB,iBAAiB,GAAG,MAAM;EAC9B,IACEd,WAAW,KAAK,IAAhB,IACAA,WAAW,CAACe,cAAZ,KAA+B,IAD/B,IAEAf,WAAW,CAAC+B,aAAZ,KAA8B,IAF9B,IAGA/B,WAAW,CAACyB,oBAAZ,KAAqC,IAHrC,IAIAzB,WAAW,CAACsB,aAAZ,KAA8B,IAJ9B,IAKAtB,WAAW,CAACmB,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMa,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}

package/lib/module/views/SkiaPictureView.js

@@ -3,10 +3,10 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 import React from "react";
-import { requireNativeComponent } from "react-native";
+import { Platform } from "../Platform";
 import { SkiaViewApi } from "./api";
 import { SkiaViewNativeId } from "./SkiaView";
-const NativeSkiaPictureView = requireNativeComponent("SkiaPictureView");
+const NativeSkiaPictureView = Platform.requireNativeComponent("SkiaPictureView");
 export class SkiaPictureView extends React.Component {
   constructor(props) {
     super(props);

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

@@ -1 +1 @@
-{"version":3,"names":["React","requireNativeComponent","SkiaViewApi","SkiaViewNativeId","NativeSkiaPictureView","SkiaPictureView","Component","constructor","props","_nativeId","current","picture","onSize","assertSkiaViewApi","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,sBAAT,QAAuC,cAAvC;AAKA,SAASC,WAAT,QAA4B,OAA5B;AACA,SAASC,gBAAT,QAAiC,YAAjC;AAGA,MAAMC,qBAAqB,GACzBH,sBAAsB,CAAsB,iBAAtB,CADxB;AAGA,OAAO,MAAMI,eAAN,SAA8BL,KAAK,CAACM,SAApC,CAAoE;EACzEC,WAAW,CAACC,KAAD,EAA8B;IACvC,MAAMA,KAAN;;IADuC;;IAEvC,KAAKC,SAAL,GAAiBN,gBAAgB,CAACO,OAAjB,EAAjB;IACA,MAAM;MAAEC,OAAF;MAAWC;IAAX,IAAsBJ,KAA5B;;IACA,IAAIG,OAAJ,EAAa;MACXE,iBAAiB;MACjBX,WAAW,CAACY,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,SAA3C,EAAsDE,OAAtD;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;MACjBX,WAAW,CAACY,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,QAA3C,EAAqDG,MAArD;IACD;EACF;;EAIkB,IAARG,QAAQ,GAAG;IACpB,OAAO,KAAKN,SAAZ;EACD;;EAEDO,kBAAkB,CAACC,SAAD,EAAkC;IAClD,MAAM;MAAEN,OAAF;MAAWC;IAAX,IAAsB,KAAKJ,KAAjC;;IACA,IAAIG,OAAO,KAAKM,SAAS,CAACN,OAA1B,EAAmC;MACjCE,iBAAiB;MACjBX,WAAW,CAACY,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,SAA3C,EAAsDE,OAAtD;IACD;;IACD,IAAIC,MAAM,KAAKK,SAAS,CAACL,MAAzB,EAAiC;MAC/BC,iBAAiB;MACjBX,WAAW,CAACY,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,QAA3C,EAAqDG,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSM,iBAAiB,CAACC,IAAD,EAAgB;IACtCN,iBAAiB;IACjB,OAAOX,WAAW,CAACgB,iBAAZ,CAA8B,KAAKT,SAAnC,EAA8CU,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdP,iBAAiB;IACjBX,WAAW,CAACmB,aAAZ,CAA0B,KAAKZ,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSa,cAAc,CAACC,MAAD,EAA2C;IAC9DV,iBAAiB;IACjB,OAAOX,WAAW,CAACsB,oBAAZ,CAAiC,KAAKf,SAAtC,EAAiDc,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKpB,KAAnD;IACA,oBACE,oBAAC,qBAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEiB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxEwE;;AA2E3E,MAAMf,iBAAiB,GAAG,MAAM;EAC9B,IACEX,WAAW,KAAK,IAAhB,IACAA,WAAW,CAACY,cAAZ,KAA+B,IAD/B,IAEAZ,WAAW,CAAC2B,aAAZ,KAA8B,IAF9B,IAGA3B,WAAW,CAACsB,oBAAZ,KAAqC,IAHrC,IAIAtB,WAAW,CAACmB,aAAZ,KAA8B,IAJ9B,IAKAnB,WAAW,CAACgB,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}
+{"version":3,"names":["React","Platform","SkiaViewApi","SkiaViewNativeId","NativeSkiaPictureView","requireNativeComponent","SkiaPictureView","Component","constructor","props","_nativeId","current","picture","onSize","assertSkiaViewApi","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\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\nimport { Platform } from \"../Platform\";\n\nimport { SkiaViewApi } from \"./api\";\nimport { SkiaViewNativeId } from \"./SkiaView\";\nimport type { NativeSkiaViewProps, SkiaPictureViewProps } from \"./types\";\n\nconst NativeSkiaPictureView =\n  Platform.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,OAAOA,KAAP,MAAkB,OAAlB;AAIA,SAASC,QAAT,QAAyB,aAAzB;AAEA,SAASC,WAAT,QAA4B,OAA5B;AACA,SAASC,gBAAT,QAAiC,YAAjC;AAGA,MAAMC,qBAAqB,GACzBH,QAAQ,CAACI,sBAAT,CAAqD,iBAArD,CADF;AAGA,OAAO,MAAMC,eAAN,SAA8BN,KAAK,CAACO,SAApC,CAAoE;EACzEC,WAAW,CAACC,KAAD,EAA8B;IACvC,MAAMA,KAAN;;IADuC;;IAEvC,KAAKC,SAAL,GAAiBP,gBAAgB,CAACQ,OAAjB,EAAjB;IACA,MAAM;MAAEC,OAAF;MAAWC;IAAX,IAAsBJ,KAA5B;;IACA,IAAIG,OAAJ,EAAa;MACXE,iBAAiB;MACjBZ,WAAW,CAACa,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,SAA3C,EAAsDE,OAAtD;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;MACjBZ,WAAW,CAACa,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,QAA3C,EAAqDG,MAArD;IACD;EACF;;EAIkB,IAARG,QAAQ,GAAG;IACpB,OAAO,KAAKN,SAAZ;EACD;;EAEDO,kBAAkB,CAACC,SAAD,EAAkC;IAClD,MAAM;MAAEN,OAAF;MAAWC;IAAX,IAAsB,KAAKJ,KAAjC;;IACA,IAAIG,OAAO,KAAKM,SAAS,CAACN,OAA1B,EAAmC;MACjCE,iBAAiB;MACjBZ,WAAW,CAACa,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,SAA3C,EAAsDE,OAAtD;IACD;;IACD,IAAIC,MAAM,KAAKK,SAAS,CAACL,MAAzB,EAAiC;MAC/BC,iBAAiB;MACjBZ,WAAW,CAACa,cAAZ,CAA2B,KAAKL,SAAhC,EAA2C,QAA3C,EAAqDG,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSM,iBAAiB,CAACC,IAAD,EAAgB;IACtCN,iBAAiB;IACjB,OAAOZ,WAAW,CAACiB,iBAAZ,CAA8B,KAAKT,SAAnC,EAA8CU,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdP,iBAAiB;IACjBZ,WAAW,CAACoB,aAAZ,CAA0B,KAAKZ,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSa,cAAc,CAACC,MAAD,EAA2C;IAC9DV,iBAAiB;IACjB,OAAOZ,WAAW,CAACuB,oBAAZ,CAAiC,KAAKf,SAAtC,EAAiDc,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuB,GAAGC;IAA1B,IAAwC,KAAKpB,KAAnD;IACA,oBACE,oBAAC,qBAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEiB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxEwE;;AA2E3E,MAAMf,iBAAiB,GAAG,MAAM;EAC9B,IACEZ,WAAW,KAAK,IAAhB,IACAA,WAAW,CAACa,cAAZ,KAA+B,IAD/B,IAEAb,WAAW,CAAC4B,aAAZ,KAA8B,IAF9B,IAGA5B,WAAW,CAACuB,oBAAZ,KAAqC,IAHrC,IAIAvB,WAAW,CAACoB,aAAZ,KAA8B,IAJ9B,IAKApB,WAAW,CAACiB,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}

package/lib/module/views/SkiaView.js

@@ -3,12 +3,12 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 import React from "react";
-import { requireNativeComponent } from "react-native";
+import { Platform } from "../Platform";
 import { SkiaViewApi } from "./api";
 export const SkiaViewNativeId = {
   current: 1000
 };
-const NativeSkiaView = requireNativeComponent("SkiaDrawView");
+const NativeSkiaView = Platform.requireNativeComponent("SkiaDrawView");
 export class SkiaView extends React.Component {
   constructor(props) {
     super(props);

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

@@ -1 +1 @@
-{"version":3,"names":["React","requireNativeComponent","SkiaViewApi","SkiaViewNativeId","current","NativeSkiaView","SkiaView","Component","constructor","props","_nativeId","onDraw","onSize","assertSkiaViewApi","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,sBAAT,QAAuC,cAAvC;AAKA,SAASC,WAAT,QAA4B,OAA5B;AAGA,OAAO,MAAMC,gBAAgB,GAAG;EAAEC,OAAO,EAAE;AAAX,CAAzB;AAEP,MAAMC,cAAc,GAClBJ,sBAAsB,CAAsB,cAAtB,CADxB;AAGA,OAAO,MAAMK,QAAN,SAAuBN,KAAK,CAACO,SAA7B,CAA0D;EAC/DC,WAAW,CAACC,KAAD,EAA2B;IACpC,MAAMA,KAAN;;IADoC;;IAEpC,KAAKC,SAAL,GAAiBP,gBAAgB,CAACC,OAAjB,EAAjB;IACA,MAAM;MAAEO,MAAF;MAAUC;IAAV,IAAqBH,KAA3B;;IACA,IAAIE,MAAJ,EAAY;MACVE,iBAAiB;MACjBX,WAAW,CAACY,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;MACjBX,WAAW,CAACY,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,QAA3C,EAAqDE,MAArD;IACD;EACF;;EAIkB,IAARG,QAAQ,GAAG;IACpB,OAAO,KAAKL,SAAZ;EACD;;EAEDM,kBAAkB,CAACC,SAAD,EAA+B;IAC/C,MAAM;MAAEN,MAAF;MAAUC;IAAV,IAAqB,KAAKH,KAAhC;;IACA,IAAIE,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BE,iBAAiB;MACjBX,WAAW,CAACY,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;;IACD,IAAIC,MAAM,KAAKK,SAAS,CAACL,MAAzB,EAAiC;MAC/BC,iBAAiB;MACjBX,WAAW,CAACY,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,QAA3C,EAAqDE,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSM,iBAAiB,CAACC,IAAD,EAAgB;IACtCN,iBAAiB;IACjB,OAAOX,WAAW,CAACgB,iBAAZ,CAA8B,KAAKR,SAAnC,EAA8CS,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdP,iBAAiB;IACjBX,WAAW,CAACmB,aAAZ,CAA0B,KAAKX,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSY,cAAc,CAACC,MAAD,EAA2C;IAC9DV,iBAAiB;IACjB,OAAOX,WAAW,CAACsB,oBAAZ,CAAiC,KAAKd,SAAtC,EAAiDa,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuBf,MAAvB;MAA+B,GAAGgB;IAAlC,IAAgD,KAAKnB,KAA3D;IACA,oBACE,oBAAC,cAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEgB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxE8D;;AA2EjE,MAAMf,iBAAiB,GAAG,MAAM;EAC9B,IACEX,WAAW,KAAK,IAAhB,IACAA,WAAW,CAACY,cAAZ,KAA+B,IAD/B,IAEAZ,WAAW,CAAC2B,aAAZ,KAA8B,IAF9B,IAGA3B,WAAW,CAACsB,oBAAZ,KAAqC,IAHrC,IAIAtB,WAAW,CAACmB,aAAZ,KAA8B,IAJ9B,IAKAnB,WAAW,CAACgB,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}
+{"version":3,"names":["React","Platform","SkiaViewApi","SkiaViewNativeId","current","NativeSkiaView","requireNativeComponent","SkiaView","Component","constructor","props","_nativeId","onDraw","onSize","assertSkiaViewApi","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\";\n\nimport type { SkRect } from \"../skia/types\";\nimport type { SkiaValue } from \"../values\";\nimport { Platform } from \"../Platform\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { NativeSkiaViewProps, SkiaDrawViewProps } from \"./types\";\n\nexport const SkiaViewNativeId = { current: 1000 };\n\nconst NativeSkiaView =\n  Platform.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,OAAOA,KAAP,MAAkB,OAAlB;AAIA,SAASC,QAAT,QAAyB,aAAzB;AAEA,SAASC,WAAT,QAA4B,OAA5B;AAGA,OAAO,MAAMC,gBAAgB,GAAG;EAAEC,OAAO,EAAE;AAAX,CAAzB;AAEP,MAAMC,cAAc,GAClBJ,QAAQ,CAACK,sBAAT,CAAqD,cAArD,CADF;AAGA,OAAO,MAAMC,QAAN,SAAuBP,KAAK,CAACQ,SAA7B,CAA0D;EAC/DC,WAAW,CAACC,KAAD,EAA2B;IACpC,MAAMA,KAAN;;IADoC;;IAEpC,KAAKC,SAAL,GAAiBR,gBAAgB,CAACC,OAAjB,EAAjB;IACA,MAAM;MAAEQ,MAAF;MAAUC;IAAV,IAAqBH,KAA3B;;IACA,IAAIE,MAAJ,EAAY;MACVE,iBAAiB;MACjBZ,WAAW,CAACa,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;;IACD,IAAIC,MAAJ,EAAY;MACVC,iBAAiB;MACjBZ,WAAW,CAACa,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,QAA3C,EAAqDE,MAArD;IACD;EACF;;EAIkB,IAARG,QAAQ,GAAG;IACpB,OAAO,KAAKL,SAAZ;EACD;;EAEDM,kBAAkB,CAACC,SAAD,EAA+B;IAC/C,MAAM;MAAEN,MAAF;MAAUC;IAAV,IAAqB,KAAKH,KAAhC;;IACA,IAAIE,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC;MAC/BE,iBAAiB;MACjBZ,WAAW,CAACa,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,cAA3C,EAA2DC,MAA3D;IACD;;IACD,IAAIC,MAAM,KAAKK,SAAS,CAACL,MAAzB,EAAiC;MAC/BC,iBAAiB;MACjBZ,WAAW,CAACa,cAAZ,CAA2B,KAAKJ,SAAhC,EAA2C,QAA3C,EAAqDE,MAArD;IACD;EACF;EAED;AACF;AACA;AACA;AACA;;;EACSM,iBAAiB,CAACC,IAAD,EAAgB;IACtCN,iBAAiB;IACjB,OAAOZ,WAAW,CAACiB,iBAAZ,CAA8B,KAAKR,SAAnC,EAA8CS,IAA9C,CAAP;EACD;EAED;AACF;AACA;;;EACSC,MAAM,GAAG;IACdP,iBAAiB;IACjBZ,WAAW,CAACoB,aAAZ,CAA0B,KAAKX,SAA/B;EACD;EAED;AACF;AACA;AACA;AACA;;;EACSY,cAAc,CAACC,MAAD,EAA2C;IAC9DV,iBAAiB;IACjB,OAAOZ,WAAW,CAACuB,oBAAZ,CAAiC,KAAKd,SAAtC,EAAiDa,MAAjD,CAAP;EACD;;EAEDE,MAAM,GAAG;IACP,MAAM;MAAEC,IAAF;MAAQC,KAAK,GAAG,KAAhB;MAAuBf,MAAvB;MAA+B,GAAGgB;IAAlC,IAAgD,KAAKnB,KAA3D;IACA,oBACE,oBAAC,cAAD;MACE,WAAW,EAAE,KADf;MAEE,QAAQ,EAAG,GAAE,KAAKC,SAAU,EAF9B;MAGE,IAAI,EAAEgB,IAHR;MAIE,KAAK,EAAEC;IAJT,GAKMC,SALN,EADF;EASD;;AAxE8D;;AA2EjE,MAAMf,iBAAiB,GAAG,MAAM;EAC9B,IACEZ,WAAW,KAAK,IAAhB,IACAA,WAAW,CAACa,cAAZ,KAA+B,IAD/B,IAEAb,WAAW,CAAC4B,aAAZ,KAA8B,IAF9B,IAGA5B,WAAW,CAACuB,oBAAZ,KAAqC,IAHrC,IAIAvB,WAAW,CAACoB,aAAZ,KAA8B,IAJ9B,IAKApB,WAAW,CAACiB,iBAAZ,KAAkC,IANpC,EAOE;IACA,MAAMY,KAAK,CAAC,8BAAD,CAAX;EACD;AACF,CAXD"}

package/lib/module/views/useTouchHandler.js

@@ -1,5 +1,5 @@
 import { useCallback, useRef } from "react";
-import { PixelRatio } from "react-native";
+import { Platform } from "../Platform";
 import { TouchType } from "./types";
 
 const useInternalTouchHandler = function (handlers) {
@@ -27,8 +27,8 @@ const useInternalTouchHandler = function (handlers) {
 
         if (touch.type !== TouchType.Start && touch.type !== TouchType.End && touch.type !== TouchType.Cancelled && timeDiffseconds > 0) {
           prevVelocityRef.current[touch.id] = {
-            x: distX / timeDiffseconds / PixelRatio.get(),
-            y: distY / timeDiffseconds / PixelRatio.get()
+            x: distX / timeDiffseconds / Platform.PixelRatio,
+            y: distY / timeDiffseconds / Platform.PixelRatio
           };
         }
 

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

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

package/lib/module/web/WithSkiaWeb.js

@@ -1,5 +1,5 @@
 import React, { useMemo, lazy, Suspense } from "react";
-import { Platform } from "react-native";
+import { Platform } from "../Platform";
 import { LoadSkiaWeb } from "./LoadSkiaWeb";
 export const WithSkiaWeb = _ref => {
   let {

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

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","lazy","Suspense","Platform","LoadSkiaWeb","WithSkiaWeb","getComponent","fallback","opts","Inner","OS","console","warn"],"sources":["WithSkiaWeb.tsx"],"sourcesContent":["import type { ComponentProps, ComponentType } from \"react\";\nimport React, { useMemo, lazy, Suspense } from \"react\";\nimport { Platform } from \"react-native\";\n\nimport { LoadSkiaWeb } from \"./LoadSkiaWeb\";\n\ninterface WithSkiaProps {\n  fallback?: ComponentProps<typeof Suspense>[\"fallback\"];\n  getComponent: () => Promise<{ default: ComponentType }>;\n  opts?: Parameters<typeof LoadSkiaWeb>[0];\n}\n\nexport const WithSkiaWeb = ({\n  getComponent,\n  fallback,\n  opts,\n}: WithSkiaProps) => {\n  const Inner = useMemo(\n    // TODO: investigate\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (): any =>\n      lazy(async () => {\n        if (Platform.OS === \"web\") {\n          await LoadSkiaWeb(opts);\n        } else {\n          console.warn(\n            \"<WithSkiaWeb /> is only necessary on web. Consider not using on native.\"\n          );\n        }\n        return getComponent();\n      }),\n    [getComponent, opts]\n  );\n  return (\n    <Suspense fallback={fallback ?? null}>\n      <Inner />\n    </Suspense>\n  );\n};\n"],"mappings":"AACA,OAAOA,KAAP,IAAgBC,OAAhB,EAAyBC,IAAzB,EAA+BC,QAA/B,QAA+C,OAA/C;AACA,SAASC,QAAT,QAAyB,cAAzB;AAEA,SAASC,WAAT,QAA4B,eAA5B;AAQA,OAAO,MAAMC,WAAW,GAAG,QAIN;EAAA,IAJO;IAC1BC,YAD0B;IAE1BC,QAF0B;IAG1BC;EAH0B,CAIP;EACnB,MAAMC,KAAK,GAAGT,OAAO,EACnB;EACA;EACA,mBACEC,IAAI,CAAC,YAAY;IACf,IAAIE,QAAQ,CAACO,EAAT,KAAgB,KAApB,EAA2B;MACzB,MAAMN,WAAW,CAACI,IAAD,CAAjB;IACD,CAFD,MAEO;MACLG,OAAO,CAACC,IAAR,CACE,yEADF;IAGD;;IACD,OAAON,YAAY,EAAnB;EACD,CATG,CAJa,EAcnB,CAACA,YAAD,EAAeE,IAAf,CAdmB,CAArB;EAgBA,oBACE,oBAAC,QAAD;IAAU,QAAQ,EAAED,QAAF,aAAEA,QAAF,cAAEA,QAAF,GAAc;EAAhC,gBACE,oBAAC,KAAD,OADF,CADF;AAKD,CA1BM"}
+{"version":3,"names":["React","useMemo","lazy","Suspense","Platform","LoadSkiaWeb","WithSkiaWeb","getComponent","fallback","opts","Inner","OS","console","warn"],"sources":["WithSkiaWeb.tsx"],"sourcesContent":["import type { ComponentProps, ComponentType } from \"react\";\nimport React, { useMemo, lazy, Suspense } from \"react\";\n\nimport { Platform } from \"../Platform\";\n\nimport { LoadSkiaWeb } from \"./LoadSkiaWeb\";\n\ninterface WithSkiaProps {\n  fallback?: ComponentProps<typeof Suspense>[\"fallback\"];\n  getComponent: () => Promise<{ default: ComponentType }>;\n  opts?: Parameters<typeof LoadSkiaWeb>[0];\n}\n\nexport const WithSkiaWeb = ({\n  getComponent,\n  fallback,\n  opts,\n}: WithSkiaProps) => {\n  const Inner = useMemo(\n    // TODO: investigate\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (): any =>\n      lazy(async () => {\n        if (Platform.OS === \"web\") {\n          await LoadSkiaWeb(opts);\n        } else {\n          console.warn(\n            \"<WithSkiaWeb /> is only necessary on web. Consider not using on native.\"\n          );\n        }\n        return getComponent();\n      }),\n    [getComponent, opts]\n  );\n  return (\n    <Suspense fallback={fallback ?? null}>\n      <Inner />\n    </Suspense>\n  );\n};\n"],"mappings":"AACA,OAAOA,KAAP,IAAgBC,OAAhB,EAAyBC,IAAzB,EAA+BC,QAA/B,QAA+C,OAA/C;AAEA,SAASC,QAAT,QAAyB,aAAzB;AAEA,SAASC,WAAT,QAA4B,eAA5B;AAQA,OAAO,MAAMC,WAAW,GAAG,QAIN;EAAA,IAJO;IAC1BC,YAD0B;IAE1BC,QAF0B;IAG1BC;EAH0B,CAIP;EACnB,MAAMC,KAAK,GAAGT,OAAO,EACnB;EACA;EACA,mBACEC,IAAI,CAAC,YAAY;IACf,IAAIE,QAAQ,CAACO,EAAT,KAAgB,KAApB,EAA2B;MACzB,MAAMN,WAAW,CAACI,IAAD,CAAjB;IACD,CAFD,MAEO;MACLG,OAAO,CAACC,IAAR,CACE,yEADF;IAGD;;IACD,OAAON,YAAY,EAAnB;EACD,CATG,CAJa,EAcnB,CAACA,YAAD,EAAeE,IAAf,CAdmB,CAArB;EAgBA,oBACE,oBAAC,QAAD;IAAU,QAAQ,EAAED,QAAF,aAAEA,QAAF,cAAEA,QAAF,GAAc;EAAhC,gBACE,oBAAC,KAAD,OADF,CADF;AAKD,CA1BM"}

package/lib/typescript/src/Platform/IPlatform.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import type { HostComponent, NodeHandle, ViewComponent } from "react-native";
+import type { DataModule } from "../skia/types";
+export interface IPlatform {
+    OS: string;
+    requireNativeComponent: <T>(viewName: string) => HostComponent<T>;
+    PixelRatio: number;
+    NativeModules: Record<string, any>;
+    findNodeHandle: (componentOrHandle: null | number | React.Component<any, any> | React.ComponentClass<any>) => null | NodeHandle;
+    resolveAsset: (source: DataModule) => string;
+    View: typeof ViewComponent;
+}

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

@@ -0,0 +1,2 @@
+import type { IPlatform } from "./IPlatform";
+export declare const Platform: IPlatform;

package/lib/typescript/src/Platform/Platform.web.d.ts

@@ -0,0 +1,2 @@
+import type { IPlatform } from "./IPlatform";
+export declare const Platform: IPlatform;

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

@@ -0,0 +1 @@
+export * from "./Platform";

package/lib/typescript/src/dom/nodes/drawings/ImageSVG.d.ts

@@ -1,8 +1,13 @@
 import type { DrawingContext, ImageSVGProps } from "../../types";
 import { JsiDrawingNode } from "../DrawingNode";
 import type { NodeContext } from "../Node";
-export declare class ImageSVGNode extends JsiDrawingNode<ImageSVGProps, null> {
+export declare class ImageSVGNode extends JsiDrawingNode<ImageSVGProps, Pick<ImageSVGProps, "x" | "y" | "width" | "height">> {
     constructor(ctx: NodeContext, props: ImageSVGProps);
-    deriveProps(): null;
+    deriveProps(): import("../../..").SkRect | {
+        x: number | undefined;
+        y: number | undefined;
+        width: number | undefined;
+        height: number | undefined;
+    };
     draw({ canvas }: DrawingContext): void;
 }

package/lib/typescript/src/dom/types/Drawings.d.ts

@@ -50,9 +50,14 @@ export interface VerticesProps extends DrawingNodeProps {
     blendMode?: SkEnum<typeof BlendMode>;
     indices?: number[];
 }
-export declare type ImageSVGProps = RectDef & {
+export interface ImageSVGProps extends DrawingNodeProps {
     svg: SkSVG | null;
-} & DrawingNodeProps;
+    x?: number;
+    y?: number;
+    width?: number;
+    height?: number;
+    rect?: SkRect;
+}
 export interface PictureProps extends DrawingNodeProps {
     picture: SkPicture;
 }

package/lib/typescript/src/renderer/processors/math/Math.d.ts

@@ -13,3 +13,4 @@ export declare const mix: (value: number, x: number, y: number) => number;
     clamp(101, 0, 100); // 100
   */
 export declare const clamp: (value: number, lowerBound: number, upperBound: number) => number;
+export declare const saturate: (value: number) => number;

package/lib/typescript/src/views/SkiaBaseWebView.d.ts

@@ -17,7 +17,7 @@ export declare abstract class SkiaBaseWebView<TProps extends SkiaBaseViewProps>
     protected width: number;
     protected height: number;
     private unsubscribeAll;
-    private onLayout;
+    private onLayoutEvent;
     protected getSize(): {
         width: number;
         height: number;
@@ -58,5 +58,10 @@ export declare abstract class SkiaBaseWebView<TProps extends SkiaBaseViewProps>
     registerValues(_values: SkiaValue<unknown>[]): void;
     private handleTouchEvent;
     createTouchHandler(touchType: TouchType): (evt: PointerEvent) => void;
+    private onStart;
+    private onActive;
+    private onCancel;
+    private onEnd;
+    private onLayout;
     render(): JSX.Element;
 }

package/package.json

@@ -7,7 +7,7 @@
     "setup-skia-web": "./scripts/setup-canvaskit.js"
   },
   "title": "React Native Skia",
-  "version": "0.1.189",
+  "version": "0.1.191",
   "description": "High-performance React Native Graphics using Skia",
   "main": "lib/module/index.js",
   "files": [
@@ -76,33 +76,36 @@
   "peerDependenciesMeta": {
     "react-native-reanimated": {
       "optional": true
+    },
+    "react-native": {
+      "optional": true
     }
   },
   "devDependencies": {
     "@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6",
     "@types/jest": "^28.1.6",
+    "@types/pixelmatch": "^5.2.4",
+    "@types/pngjs": "^6.0.1",
     "@types/react-native": "0.70.6",
     "@types/react-reconciler": "^0.26.7",
+    "@types/ws": "^8.5.3",
     "eslint": "8.21.0",
     "eslint-config-react-native-wcandillon": "3.9.0",
     "eslint-plugin-reanimated": "2.0.0",
     "jest": "28.1.3",
     "merge-dirs": "^0.2.1",
+    "pixelmatch": "^5.3.0",
+    "pngjs": "^6.0.0",
     "react": "18.1.0",
     "react-native": "0.71.7",
     "react-native-builder-bob": "^0.18.2",
     "ts-jest": "^28.0.7",
-    "typescript": "4.8.3"
+    "typescript": "4.8.3",
+    "ws": "^8.11.0"
   },
   "dependencies": {
-    "@types/pixelmatch": "^5.2.4",
-    "@types/pngjs": "^6.0.1",
-    "@types/ws": "^8.5.3",
     "canvaskit-wasm": "0.38.0",
-    "pixelmatch": "^5.3.0",
-    "pngjs": "^6.0.0",
-    "react-reconciler": "^0.27.0",
-    "ws": "^8.11.0"
+    "react-reconciler": "^0.27.0"
   },
   "eslintIgnore": [
     "node_modules/",

package/scripts/install-npm.js

@@ -8,10 +8,9 @@ const createSymlink = (p) => {
   const srcDir = path.resolve(`./cpp/${p}`);
   const dstDir = path.resolve(`./android/cpp/${p}`);
 
-  if (fs.existsSync(dstDir)) {
-    fs.unlinkSync(dstDir);
+  if (!fs.existsSync(dstDir) || !fs.lstatSync(dstDir).isSymbolicLink()) {
+    fs.symlinkSync(srcDir, dstDir, "junction");
   }
-  fs.symlinkSync(srcDir, dstDir, "junction");
 };
 
 // Copy common cpp files from the package root to the android folder

package/src/Platform/IPlatform.ts

@@ -0,0 +1,20 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import type { HostComponent, NodeHandle, ViewComponent } from "react-native";
+
+import type { DataModule } from "../skia/types";
+
+export interface IPlatform {
+  OS: string;
+  requireNativeComponent: <T>(viewName: string) => HostComponent<T>;
+  PixelRatio: number;
+  NativeModules: Record<string, any>;
+  findNodeHandle: (
+    componentOrHandle:
+      | null
+      | number
+      | React.Component<any, any>
+      | React.ComponentClass<any>
+  ) => null | NodeHandle;
+  resolveAsset: (source: DataModule) => string;
+  View: typeof ViewComponent;
+}

package/src/Platform/Platform.ts

@@ -0,0 +1,28 @@
+import {
+  Image,
+  PixelRatio,
+  requireNativeComponent,
+  Platform as RNPlatform,
+  findNodeHandle,
+  NativeModules,
+  View,
+} from "react-native";
+
+import type { DataModule } from "../skia/types";
+import { isRNModule } from "../skia/types";
+
+import type { IPlatform } from "./IPlatform";
+
+export const Platform: IPlatform = {
+  OS: RNPlatform.OS,
+  PixelRatio: PixelRatio.get(),
+  requireNativeComponent,
+  resolveAsset: (source: DataModule) => {
+    return isRNModule(source)
+      ? Image.resolveAssetSource(source).uri
+      : source.default;
+  },
+  findNodeHandle,
+  NativeModules,
+  View,
+};