@pompadour/react-native-skia 1.0.0

package/lib/module/dom/nodes/drawings/Box.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BlurStyle","ClipOp","isRRect","NodeType","JsiDeclarationNode","JsiRenderNode","inflate","Skia","box","dx","dy","tx","ty","RRectXY","XYWHRect","rect","x","y","width","height","rx","ry","deflate","BoxShadowNode","constructor","ctx","props","BoxShadow","decorate","_ctx","materialize","BoxNode","Box","renderNode","canvas","paint","defaultBox","opacity","getAlphaf","shadows","_children","map","node","filter","n","shadow","inner","color","blur","spread","lPaint","Paint","setColor","Color","setAlphaf","setMaskFilter","MaskFilter","MakeBlur","Normal","drawRRect","delta","Point","Math","abs","save","clipRRect","Intersect","outer","drawDRRect","restore"],"sources":["Box.ts"],"sourcesContent":["import type { SkRRect, Skia } from \"../../../skia/types\";\nimport { BlurStyle, ClipOp, isRRect } from \"../../../skia/types\";\nimport type { DrawingContext } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport type { BoxShadowProps, BoxProps } from \"../../types/Drawings\";\nimport type { NodeContext } from \"../Node\";\nimport { JsiDeclarationNode } from \"../Node\";\nimport { JsiRenderNode } from \"../RenderNode\";\nimport type { DeclarationContext } from \"../../types/DeclarationContext\";\n\nconst inflate = (\n  Skia: Skia,\n  box: SkRRect,\n  dx: number,\n  dy: number,\n  tx = 0,\n  ty = 0\n) =>\n  Skia.RRectXY(\n    Skia.XYWHRect(\n      box.rect.x - dx + tx,\n      box.rect.y - dy + ty,\n      box.rect.width + 2 * dx,\n      box.rect.height + 2 * dy\n    ),\n    box.rx + dx,\n    box.ry + dy\n  );\n\nconst deflate = (\n  Skia: Skia,\n  box: SkRRect,\n  dx: number,\n  dy: number,\n  tx = 0,\n  ty = 0\n) => inflate(Skia, box, -dx, -dy, tx, ty);\n\nexport class BoxShadowNode extends JsiDeclarationNode<BoxShadowProps> {\n  constructor(ctx: NodeContext, props: BoxShadowProps) {\n    super(ctx, NodeType.BoxShadow, props);\n  }\n\n  decorate(_ctx: DeclarationContext) {\n    // do nothing\n  }\n\n  materialize() {\n    return this.props;\n  }\n}\n\nexport class BoxNode extends JsiRenderNode<BoxProps> {\n  constructor(ctx: NodeContext, props: BoxProps) {\n    super(ctx, NodeType.Box, props);\n  }\n\n  renderNode({ canvas, paint }: DrawingContext) {\n    const { box: defaultBox } = this.props;\n    const opacity = paint.getAlphaf();\n    const box = isRRect(defaultBox)\n      ? defaultBox\n      : this.Skia.RRectXY(defaultBox, 0, 0);\n    const shadows = this._children\n      .map((node) => {\n        if (node instanceof BoxShadowNode) {\n          return node.materialize();\n        }\n        return null;\n      })\n      .filter((n): n is BoxShadowProps => n !== null);\n    shadows\n      .filter((shadow) => !shadow.inner)\n      .map((shadow) => {\n        const { color = \"black\", blur, spread = 0, dx = 0, dy = 0 } = shadow;\n        const lPaint = this.Skia.Paint();\n        lPaint.setColor(this.Skia.Color(color));\n        lPaint.setAlphaf(paint.getAlphaf() * opacity);\n        lPaint.setMaskFilter(\n          this.Skia.MaskFilter.MakeBlur(BlurStyle.Normal, blur, true)\n        );\n        canvas.drawRRect(\n          inflate(this.Skia, box, spread, spread, dx, dy),\n          lPaint\n        );\n      });\n\n    canvas.drawRRect(box, paint);\n\n    shadows\n      .filter((shadow) => shadow.inner)\n      .map((shadow) => {\n        const { color = \"black\", blur, spread = 0, dx = 0, dy = 0 } = shadow;\n        const delta = this.Skia.Point(10 + Math.abs(dx), 10 + Math.abs(dy));\n        canvas.save();\n        canvas.clipRRect(box, ClipOp.Intersect, false);\n        const lPaint = this.Skia.Paint();\n        lPaint.setColor(this.Skia.Color(color));\n        lPaint.setAlphaf(paint.getAlphaf() * opacity);\n\n        lPaint.setMaskFilter(\n          this.Skia.MaskFilter.MakeBlur(BlurStyle.Normal, blur, true)\n        );\n        const inner = deflate(this.Skia, box, spread, spread, dx, dy);\n        const outer = inflate(this.Skia, box, delta.x, delta.y);\n        canvas.drawDRRect(outer, inner, lPaint);\n        canvas.restore();\n      });\n  }\n}\n"],"mappings":"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"}

package/lib/module/dom/nodes/drawings/CircleNode.d.ts

@@ -0,0 +1,9 @@
+import type { SkPoint } from "../../../skia/types";
+import type { CircleProps, DrawingContext } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class CircleNode extends JsiDrawingNode<CircleProps, SkPoint> {
+    constructor(ctx: NodeContext, props: CircleProps);
+    protected deriveProps(): SkPoint;
+    draw({ canvas, paint }: DrawingContext): void;
+}

package/lib/module/dom/nodes/drawings/CircleNode.js

@@ -0,0 +1,25 @@
+import { NodeType } from "../../types";
+import { processCircle } from "../datatypes";
+import { JsiDrawingNode } from "../DrawingNode";
+export class CircleNode extends JsiDrawingNode {
+  constructor(ctx, props) {
+    super(ctx, NodeType.Circle, props);
+  }
+  deriveProps() {
+    return processCircle(this.Skia, this.props).c;
+  }
+  draw({
+    canvas,
+    paint
+  }) {
+    if (!this.derived) {
+      throw new Error("CircleNode: c is undefined");
+    }
+    const {
+      x,
+      y
+    } = this.derived;
+    canvas.drawCircle(x, y, this.props.r, paint);
+  }
+}
+//# sourceMappingURL=CircleNode.js.map

package/lib/module/dom/nodes/drawings/CircleNode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["NodeType","processCircle","JsiDrawingNode","CircleNode","constructor","ctx","props","Circle","deriveProps","Skia","c","draw","canvas","paint","derived","Error","x","y","drawCircle","r"],"sources":["CircleNode.ts"],"sourcesContent":["import type { SkPoint } from \"../../../skia/types\";\nimport type { CircleProps, DrawingContext } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { processCircle } from \"../datatypes\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class CircleNode extends JsiDrawingNode<CircleProps, SkPoint> {\n  constructor(ctx: NodeContext, props: CircleProps) {\n    super(ctx, NodeType.Circle, props);\n  }\n\n  protected deriveProps() {\n    return processCircle(this.Skia, this.props).c;\n  }\n\n  draw({ canvas, paint }: DrawingContext) {\n    if (!this.derived) {\n      throw new Error(\"CircleNode: c is undefined\");\n    }\n    const { x, y } = this.derived;\n    canvas.drawCircle(x, y, this.props.r, paint);\n  }\n}\n"],"mappings":"AAEA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,aAAa,QAAQ,cAAc;AAC5C,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,UAAU,SAASD,cAAc,CAAuB;EACnEE,WAAWA,CAACC,GAAgB,EAAEC,KAAkB,EAAE;IAChD,KAAK,CAACD,GAAG,EAAEL,QAAQ,CAACO,MAAM,EAAED,KAAK,CAAC;EACpC;EAEUE,WAAWA,CAAA,EAAG;IACtB,OAAOP,aAAa,CAAC,IAAI,CAACQ,IAAI,EAAE,IAAI,CAACH,KAAK,CAAC,CAACI,CAAC;EAC/C;EAEAC,IAAIA,CAAC;IAAEC,MAAM;IAAEC;EAAsB,CAAC,EAAE;IACtC,IAAI,CAAC,IAAI,CAACC,OAAO,EAAE;MACjB,MAAM,IAAIC,KAAK,CAAC,4BAA4B,CAAC;IAC/C;IACA,MAAM;MAAEC,CAAC;MAAEC;IAAE,CAAC,GAAG,IAAI,CAACH,OAAO;IAC7BF,MAAM,CAACM,UAAU,CAACF,CAAC,EAAEC,CAAC,EAAE,IAAI,CAACX,KAAK,CAACa,CAAC,EAAEN,KAAK,CAAC;EAC9C;AACF"}

package/lib/module/dom/nodes/drawings/DiffRectNode.d.ts

@@ -0,0 +1,8 @@
+import type { DiffRectProps, DrawingContext } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class DiffRectNode extends JsiDrawingNode<DiffRectProps, null> {
+    constructor(ctx: NodeContext, props: DiffRectProps);
+    deriveProps(): null;
+    draw({ canvas, paint }: DrawingContext): void;
+}

package/lib/module/dom/nodes/drawings/DiffRectNode.js

@@ -0,0 +1,21 @@
+import { NodeType } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+export class DiffRectNode extends JsiDrawingNode {
+  constructor(ctx, props) {
+    super(ctx, NodeType.DiffRect, props);
+  }
+  deriveProps() {
+    return null;
+  }
+  draw({
+    canvas,
+    paint
+  }) {
+    const {
+      outer,
+      inner
+    } = this.props;
+    canvas.drawDRRect(outer, inner, paint);
+  }
+}
+//# sourceMappingURL=DiffRectNode.js.map

package/lib/module/dom/nodes/drawings/DiffRectNode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["NodeType","JsiDrawingNode","DiffRectNode","constructor","ctx","props","DiffRect","deriveProps","draw","canvas","paint","outer","inner","drawDRRect"],"sources":["DiffRectNode.ts"],"sourcesContent":["import type { DiffRectProps, DrawingContext } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class DiffRectNode extends JsiDrawingNode<DiffRectProps, null> {\n  constructor(ctx: NodeContext, props: DiffRectProps) {\n    super(ctx, NodeType.DiffRect, props);\n  }\n\n  deriveProps() {\n    return null;\n  }\n\n  draw({ canvas, paint }: DrawingContext) {\n    const { outer, inner } = this.props;\n    canvas.drawDRRect(outer, inner, paint);\n  }\n}\n"],"mappings":"AACA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,YAAY,SAASD,cAAc,CAAsB;EACpEE,WAAWA,CAACC,GAAgB,EAAEC,KAAoB,EAAE;IAClD,KAAK,CAACD,GAAG,EAAEJ,QAAQ,CAACM,QAAQ,EAAED,KAAK,CAAC;EACtC;EAEAE,WAAWA,CAAA,EAAG;IACZ,OAAO,IAAI;EACb;EAEAC,IAAIA,CAAC;IAAEC,MAAM;IAAEC;EAAsB,CAAC,EAAE;IACtC,MAAM;MAAEC,KAAK;MAAEC;IAAM,CAAC,GAAG,IAAI,CAACP,KAAK;IACnCI,MAAM,CAACI,UAAU,CAACF,KAAK,EAAEC,KAAK,EAAEF,KAAK,CAAC;EACxC;AACF"}

package/lib/module/dom/nodes/drawings/FillNode.d.ts

@@ -0,0 +1,8 @@
+import type { DrawingContext, DrawingNodeProps } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class FillNode extends JsiDrawingNode<DrawingNodeProps, null> {
+    constructor(ctx: NodeContext, props?: DrawingNodeProps);
+    deriveProps(): null;
+    draw({ canvas, paint }: DrawingContext): void;
+}

package/lib/module/dom/nodes/drawings/FillNode.js

@@ -0,0 +1,17 @@
+import { NodeType } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+export class FillNode extends JsiDrawingNode {
+  constructor(ctx, props = {}) {
+    super(ctx, NodeType.Fill, props);
+  }
+  deriveProps() {
+    return null;
+  }
+  draw({
+    canvas,
+    paint
+  }) {
+    canvas.drawPaint(paint);
+  }
+}
+//# sourceMappingURL=FillNode.js.map

package/lib/module/dom/nodes/drawings/FillNode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["NodeType","JsiDrawingNode","FillNode","constructor","ctx","props","Fill","deriveProps","draw","canvas","paint","drawPaint"],"sources":["FillNode.ts"],"sourcesContent":["import type { DrawingContext, DrawingNodeProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class FillNode extends JsiDrawingNode<DrawingNodeProps, null> {\n  constructor(ctx: NodeContext, props: DrawingNodeProps = {}) {\n    super(ctx, NodeType.Fill, props);\n  }\n\n  deriveProps() {\n    return null;\n  }\n\n  draw({ canvas, paint }: DrawingContext) {\n    canvas.drawPaint(paint);\n  }\n}\n"],"mappings":"AACA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,QAAQ,SAASD,cAAc,CAAyB;EACnEE,WAAWA,CAACC,GAAgB,EAAEC,KAAuB,GAAG,CAAC,CAAC,EAAE;IAC1D,KAAK,CAACD,GAAG,EAAEJ,QAAQ,CAACM,IAAI,EAAED,KAAK,CAAC;EAClC;EAEAE,WAAWA,CAAA,EAAG;IACZ,OAAO,IAAI;EACb;EAEAC,IAAIA,CAAC;IAAEC,MAAM;IAAEC;EAAsB,CAAC,EAAE;IACtCD,MAAM,CAACE,SAAS,CAACD,KAAK,CAAC;EACzB;AACF"}

package/lib/module/dom/nodes/drawings/ImageNode.d.ts

@@ -0,0 +1,25 @@
+import type { SkRect } from "../../../skia/types";
+import type { DrawingContext, ImageProps } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class ImageNode extends JsiDrawingNode<ImageProps, {
+    src: SkRect;
+    dst: SkRect;
+}> {
+    constructor(ctx: NodeContext, props: ImageProps);
+    deriveProps(): {
+        src: {
+            x: number;
+            y: number;
+            width: number;
+            height: number;
+        };
+        dst: {
+            x: number;
+            y: number;
+            width: number;
+            height: number;
+        };
+    };
+    draw({ canvas, paint }: DrawingContext): void;
+}

package/lib/module/dom/nodes/drawings/ImageNode.js

@@ -0,0 +1,64 @@
+import { NodeType } from "../../types";
+import { fitRects, processRect } from "../datatypes";
+import { JsiDrawingNode } from "../DrawingNode";
+export class ImageNode extends JsiDrawingNode {
+  constructor(ctx, props) {
+    super(ctx, NodeType.Image, props);
+  }
+  deriveProps() {
+    var _this$props$fit;
+    const {
+      image
+    } = this.props;
+    if (!image) {
+      return {
+        src: {
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0
+        },
+        dst: {
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0
+        }
+      };
+    }
+    const fit = (_this$props$fit = this.props.fit) !== null && _this$props$fit !== void 0 ? _this$props$fit : "contain";
+    const rect = processRect(this.Skia, this.props);
+    const {
+      src,
+      dst
+    } = fitRects(fit, {
+      x: 0,
+      y: 0,
+      width: image.width(),
+      height: image.height()
+    }, rect);
+    return {
+      src,
+      dst
+    };
+  }
+  draw({
+    canvas,
+    paint
+  }) {
+    const {
+      image
+    } = this.props;
+    if (!this.derived) {
+      throw new Error("ImageNode: src and dst are undefined");
+    }
+    const {
+      src,
+      dst
+    } = this.derived;
+    if (image) {
+      canvas.drawImageRect(image, src, dst, paint);
+    }
+  }
+}
+//# sourceMappingURL=ImageNode.js.map

package/lib/module/dom/nodes/drawings/ImageNode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["NodeType","fitRects","processRect","JsiDrawingNode","ImageNode","constructor","ctx","props","Image","deriveProps","_this$props$fit","image","src","x","y","width","height","dst","fit","rect","Skia","draw","canvas","paint","derived","Error","drawImageRect"],"sources":["ImageNode.ts"],"sourcesContent":["import type { SkRect } from \"../../../skia/types\";\nimport type { DrawingContext, ImageProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { fitRects, processRect } from \"../datatypes\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class ImageNode extends JsiDrawingNode<\n  ImageProps,\n  { src: SkRect; dst: SkRect }\n> {\n  constructor(ctx: NodeContext, props: ImageProps) {\n    super(ctx, NodeType.Image, props);\n  }\n\n  deriveProps() {\n    const { image } = this.props;\n    if (!image) {\n      return {\n        src: { x: 0, y: 0, width: 0, height: 0 },\n        dst: { x: 0, y: 0, width: 0, height: 0 },\n      };\n    }\n    const fit = this.props.fit ?? \"contain\";\n    const rect = processRect(this.Skia, this.props);\n    const { src, dst } = fitRects(\n      fit,\n      {\n        x: 0,\n        y: 0,\n        width: image.width(),\n        height: image.height(),\n      },\n      rect\n    );\n    return { src, dst };\n  }\n\n  draw({ canvas, paint }: DrawingContext) {\n    const { image } = this.props;\n    if (!this.derived) {\n      throw new Error(\"ImageNode: src and dst are undefined\");\n    }\n    const { src, dst } = this.derived;\n    if (image) {\n      canvas.drawImageRect(image, src, dst, paint);\n    }\n  }\n}\n"],"mappings":"AAEA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,QAAQ,EAAEC,WAAW,QAAQ,cAAc;AACpD,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,SAAS,SAASD,cAAc,CAG3C;EACAE,WAAWA,CAACC,GAAgB,EAAEC,KAAiB,EAAE;IAC/C,KAAK,CAACD,GAAG,EAAEN,QAAQ,CAACQ,KAAK,EAAED,KAAK,CAAC;EACnC;EAEAE,WAAWA,CAAA,EAAG;IAAA,IAAAC,eAAA;IACZ,MAAM;MAAEC;IAAM,CAAC,GAAG,IAAI,CAACJ,KAAK;IAC5B,IAAI,CAACI,KAAK,EAAE;MACV,OAAO;QACLC,GAAG,EAAE;UAAEC,CAAC,EAAE,CAAC;UAAEC,CAAC,EAAE,CAAC;UAAEC,KAAK,EAAE,CAAC;UAAEC,MAAM,EAAE;QAAE,CAAC;QACxCC,GAAG,EAAE;UAAEJ,CAAC,EAAE,CAAC;UAAEC,CAAC,EAAE,CAAC;UAAEC,KAAK,EAAE,CAAC;UAAEC,MAAM,EAAE;QAAE;MACzC,CAAC;IACH;IACA,MAAME,GAAG,IAAAR,eAAA,GAAG,IAAI,CAACH,KAAK,CAACW,GAAG,cAAAR,eAAA,cAAAA,eAAA,GAAI,SAAS;IACvC,MAAMS,IAAI,GAAGjB,WAAW,CAAC,IAAI,CAACkB,IAAI,EAAE,IAAI,CAACb,KAAK,CAAC;IAC/C,MAAM;MAAEK,GAAG;MAAEK;IAAI,CAAC,GAAGhB,QAAQ,CAC3BiB,GAAG,EACH;MACEL,CAAC,EAAE,CAAC;MACJC,CAAC,EAAE,CAAC;MACJC,KAAK,EAAEJ,KAAK,CAACI,KAAK,CAAC,CAAC;MACpBC,MAAM,EAAEL,KAAK,CAACK,MAAM,CAAC;IACvB,CAAC,EACDG,IACF,CAAC;IACD,OAAO;MAAEP,GAAG;MAAEK;IAAI,CAAC;EACrB;EAEAI,IAAIA,CAAC;IAAEC,MAAM;IAAEC;EAAsB,CAAC,EAAE;IACtC,MAAM;MAAEZ;IAAM,CAAC,GAAG,IAAI,CAACJ,KAAK;IAC5B,IAAI,CAAC,IAAI,CAACiB,OAAO,EAAE;MACjB,MAAM,IAAIC,KAAK,CAAC,sCAAsC,CAAC;IACzD;IACA,MAAM;MAAEb,GAAG;MAAEK;IAAI,CAAC,GAAG,IAAI,CAACO,OAAO;IACjC,IAAIb,KAAK,EAAE;MACTW,MAAM,CAACI,aAAa,CAACf,KAAK,EAAEC,GAAG,EAAEK,GAAG,EAAEM,KAAK,CAAC;IAC9C;EACF;AACF"}

package/lib/module/dom/nodes/drawings/ImageSVG.d.ts

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

package/lib/module/dom/nodes/drawings/ImageSVG.js

@@ -0,0 +1,50 @@
+import { NodeType } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+export class ImageSVGNode extends JsiDrawingNode {
+  constructor(ctx, props) {
+    super(ctx, NodeType.ImageSVG, props);
+  }
+  deriveProps() {
+    if (this.props.rect) {
+      return this.props.rect;
+    }
+    const {
+      x,
+      y,
+      width,
+      height
+    } = this.props;
+    return {
+      x,
+      y,
+      width,
+      height
+    };
+  }
+  draw({
+    canvas
+  }) {
+    const {
+      svg
+    } = this.props;
+    if (!this.derived) {
+      throw new Error("ImageSVGNode: derived props unresolved");
+    }
+    const {
+      x,
+      y,
+      width,
+      height
+    } = this.derived;
+    if (svg === null) {
+      return;
+    }
+    canvas.save();
+    if (x && y) {
+      canvas.translate(x, y);
+    }
+    canvas.drawSvg(svg, width, height);
+    canvas.restore();
+  }
+}
+//# sourceMappingURL=ImageSVG.js.map

package/lib/module/dom/nodes/drawings/ImageSVG.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["NodeType","JsiDrawingNode","ImageSVGNode","constructor","ctx","props","ImageSVG","deriveProps","rect","x","y","width","height","draw","canvas","svg","derived","Error","save","translate","drawSvg","restore"],"sources":["ImageSVG.ts"],"sourcesContent":["import type { DrawingContext, ImageSVGProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class ImageSVGNode extends JsiDrawingNode<\n  ImageSVGProps,\n  Pick<ImageSVGProps, \"x\" | \"y\" | \"width\" | \"height\">\n> {\n  constructor(ctx: NodeContext, props: ImageSVGProps) {\n    super(ctx, NodeType.ImageSVG, props);\n  }\n\n  deriveProps() {\n    if (this.props.rect) {\n      return this.props.rect;\n    }\n    const { x, y, width, height } = this.props;\n    return { x, y, width, height };\n  }\n\n  draw({ canvas }: DrawingContext) {\n    const { svg } = this.props;\n    if (!this.derived) {\n      throw new Error(\"ImageSVGNode: derived props unresolved\");\n    }\n    const { x, y, width, height } = this.derived;\n    if (svg === null) {\n      return;\n    }\n    canvas.save();\n    if (x && y) {\n      canvas.translate(x, y);\n    }\n    canvas.drawSvg(svg, width, height);\n    canvas.restore();\n  }\n}\n"],"mappings":"AACA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,YAAY,SAASD,cAAc,CAG9C;EACAE,WAAWA,CAACC,GAAgB,EAAEC,KAAoB,EAAE;IAClD,KAAK,CAACD,GAAG,EAAEJ,QAAQ,CAACM,QAAQ,EAAED,KAAK,CAAC;EACtC;EAEAE,WAAWA,CAAA,EAAG;IACZ,IAAI,IAAI,CAACF,KAAK,CAACG,IAAI,EAAE;MACnB,OAAO,IAAI,CAACH,KAAK,CAACG,IAAI;IACxB;IACA,MAAM;MAAEC,CAAC;MAAEC,CAAC;MAAEC,KAAK;MAAEC;IAAO,CAAC,GAAG,IAAI,CAACP,KAAK;IAC1C,OAAO;MAAEI,CAAC;MAAEC,CAAC;MAAEC,KAAK;MAAEC;IAAO,CAAC;EAChC;EAEAC,IAAIA,CAAC;IAAEC;EAAuB,CAAC,EAAE;IAC/B,MAAM;MAAEC;IAAI,CAAC,GAAG,IAAI,CAACV,KAAK;IAC1B,IAAI,CAAC,IAAI,CAACW,OAAO,EAAE;MACjB,MAAM,IAAIC,KAAK,CAAC,wCAAwC,CAAC;IAC3D;IACA,MAAM;MAAER,CAAC;MAAEC,CAAC;MAAEC,KAAK;MAAEC;IAAO,CAAC,GAAG,IAAI,CAACI,OAAO;IAC5C,IAAID,GAAG,KAAK,IAAI,EAAE;MAChB;IACF;IACAD,MAAM,CAACI,IAAI,CAAC,CAAC;IACb,IAAIT,CAAC,IAAIC,CAAC,EAAE;MACVI,MAAM,CAACK,SAAS,CAACV,CAAC,EAAEC,CAAC,CAAC;IACxB;IACAI,MAAM,CAACM,OAAO,CAACL,GAAG,EAAEJ,KAAK,EAAEC,MAAM,CAAC;IAClCE,MAAM,CAACO,OAAO,CAAC,CAAC;EAClB;AACF"}

package/lib/module/dom/nodes/drawings/LineNode.d.ts

@@ -0,0 +1,8 @@
+import type { DrawingContext, LineProps } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class LineNode extends JsiDrawingNode<LineProps, null> {
+    constructor(ctx: NodeContext, props: LineProps);
+    deriveProps(): null;
+    draw({ canvas, paint }: DrawingContext): void;
+}

package/lib/module/dom/nodes/drawings/LineNode.js

@@ -0,0 +1,21 @@
+import { NodeType } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+export class LineNode extends JsiDrawingNode {
+  constructor(ctx, props) {
+    super(ctx, NodeType.Line, props);
+  }
+  deriveProps() {
+    return null;
+  }
+  draw({
+    canvas,
+    paint
+  }) {
+    const {
+      p1,
+      p2
+    } = this.props;
+    canvas.drawLine(p1.x, p1.y, p2.x, p2.y, paint);
+  }
+}
+//# sourceMappingURL=LineNode.js.map

package/lib/module/dom/nodes/drawings/LineNode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["NodeType","JsiDrawingNode","LineNode","constructor","ctx","props","Line","deriveProps","draw","canvas","paint","p1","p2","drawLine","x","y"],"sources":["LineNode.ts"],"sourcesContent":["import type { DrawingContext, LineProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class LineNode extends JsiDrawingNode<LineProps, null> {\n  constructor(ctx: NodeContext, props: LineProps) {\n    super(ctx, NodeType.Line, props);\n  }\n\n  deriveProps() {\n    return null;\n  }\n\n  draw({ canvas, paint }: DrawingContext) {\n    const { p1, p2 } = this.props;\n    canvas.drawLine(p1.x, p1.y, p2.x, p2.y, paint);\n  }\n}\n"],"mappings":"AACA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,QAAQ,SAASD,cAAc,CAAkB;EAC5DE,WAAWA,CAACC,GAAgB,EAAEC,KAAgB,EAAE;IAC9C,KAAK,CAACD,GAAG,EAAEJ,QAAQ,CAACM,IAAI,EAAED,KAAK,CAAC;EAClC;EAEAE,WAAWA,CAAA,EAAG;IACZ,OAAO,IAAI;EACb;EAEAC,IAAIA,CAAC;IAAEC,MAAM;IAAEC;EAAsB,CAAC,EAAE;IACtC,MAAM;MAAEC,EAAE;MAAEC;IAAG,CAAC,GAAG,IAAI,CAACP,KAAK;IAC7BI,MAAM,CAACI,QAAQ,CAACF,EAAE,CAACG,CAAC,EAAEH,EAAE,CAACI,CAAC,EAAEH,EAAE,CAACE,CAAC,EAAEF,EAAE,CAACG,CAAC,EAAEL,KAAK,CAAC;EAChD;AACF"}

package/lib/module/dom/nodes/drawings/OvalNode.d.ts

@@ -0,0 +1,9 @@
+import type { SkRect } from "../../../skia/types";
+import type { DrawingContext, OvalProps } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class OvalNode extends JsiDrawingNode<OvalProps, SkRect> {
+    constructor(ctx: NodeContext, props: OvalProps);
+    deriveProps(): SkRect;
+    draw({ canvas, paint }: DrawingContext): void;
+}

package/lib/module/dom/nodes/drawings/OvalNode.js

@@ -0,0 +1,21 @@
+import { NodeType } from "../../types";
+import { processRect } from "../datatypes";
+import { JsiDrawingNode } from "../DrawingNode";
+export class OvalNode extends JsiDrawingNode {
+  constructor(ctx, props) {
+    super(ctx, NodeType.Oval, props);
+  }
+  deriveProps() {
+    return processRect(this.Skia, this.props);
+  }
+  draw({
+    canvas,
+    paint
+  }) {
+    if (this.derived === undefined) {
+      throw new Error("OvalNode: rect is undefined");
+    }
+    canvas.drawOval(this.derived, paint);
+  }
+}
+//# sourceMappingURL=OvalNode.js.map

package/lib/module/dom/nodes/drawings/OvalNode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["NodeType","processRect","JsiDrawingNode","OvalNode","constructor","ctx","props","Oval","deriveProps","Skia","draw","canvas","paint","derived","undefined","Error","drawOval"],"sources":["OvalNode.ts"],"sourcesContent":["import type { SkRect } from \"../../../skia/types\";\nimport type { DrawingContext, OvalProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { processRect } from \"../datatypes\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class OvalNode extends JsiDrawingNode<OvalProps, SkRect> {\n  constructor(ctx: NodeContext, props: OvalProps) {\n    super(ctx, NodeType.Oval, props);\n  }\n\n  deriveProps() {\n    return processRect(this.Skia, this.props);\n  }\n\n  draw({ canvas, paint }: DrawingContext) {\n    if (this.derived === undefined) {\n      throw new Error(\"OvalNode: rect is undefined\");\n    }\n    canvas.drawOval(this.derived, paint);\n  }\n}\n"],"mappings":"AAEA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,WAAW,QAAQ,cAAc;AAC1C,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,QAAQ,SAASD,cAAc,CAAoB;EAC9DE,WAAWA,CAACC,GAAgB,EAAEC,KAAgB,EAAE;IAC9C,KAAK,CAACD,GAAG,EAAEL,QAAQ,CAACO,IAAI,EAAED,KAAK,CAAC;EAClC;EAEAE,WAAWA,CAAA,EAAG;IACZ,OAAOP,WAAW,CAAC,IAAI,CAACQ,IAAI,EAAE,IAAI,CAACH,KAAK,CAAC;EAC3C;EAEAI,IAAIA,CAAC;IAAEC,MAAM;IAAEC;EAAsB,CAAC,EAAE;IACtC,IAAI,IAAI,CAACC,OAAO,KAAKC,SAAS,EAAE;MAC9B,MAAM,IAAIC,KAAK,CAAC,6BAA6B,CAAC;IAChD;IACAJ,MAAM,CAACK,QAAQ,CAAC,IAAI,CAACH,OAAO,EAAED,KAAK,CAAC;EACtC;AACF"}

package/lib/module/dom/nodes/drawings/ParagraphNode.d.ts

@@ -0,0 +1,8 @@
+import type { DrawingContext, ParagraphProps } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class ParagraphNode extends JsiDrawingNode<ParagraphProps, null> {
+    constructor(ctx: NodeContext, props: ParagraphProps);
+    deriveProps(): null;
+    draw({ canvas }: DrawingContext): void;
+}

package/lib/module/dom/nodes/drawings/ParagraphNode.js

@@ -0,0 +1,25 @@
+import { NodeType } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+export class ParagraphNode extends JsiDrawingNode {
+  constructor(ctx, props) {
+    super(ctx, NodeType.Paragraph, props);
+  }
+  deriveProps() {
+    return null;
+  }
+  draw({
+    canvas
+  }) {
+    const {
+      paragraph,
+      x,
+      y,
+      width
+    } = this.props;
+    if (paragraph) {
+      paragraph.layout(width);
+      paragraph.paint(canvas, x, y);
+    }
+  }
+}
+//# sourceMappingURL=ParagraphNode.js.map

package/lib/module/dom/nodes/drawings/ParagraphNode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["NodeType","JsiDrawingNode","ParagraphNode","constructor","ctx","props","Paragraph","deriveProps","draw","canvas","paragraph","x","y","width","layout","paint"],"sources":["ParagraphNode.ts"],"sourcesContent":["import type { DrawingContext, ParagraphProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class ParagraphNode extends JsiDrawingNode<ParagraphProps, null> {\n  constructor(ctx: NodeContext, props: ParagraphProps) {\n    super(ctx, NodeType.Paragraph, props);\n  }\n\n  deriveProps() {\n    return null;\n  }\n\n  draw({ canvas }: DrawingContext) {\n    const { paragraph, x, y, width } = this.props;\n    if (paragraph) {\n      paragraph.layout(width);\n      paragraph.paint(canvas, x, y);\n    }\n  }\n}\n"],"mappings":"AACA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,aAAa,SAASD,cAAc,CAAuB;EACtEE,WAAWA,CAACC,GAAgB,EAAEC,KAAqB,EAAE;IACnD,KAAK,CAACD,GAAG,EAAEJ,QAAQ,CAACM,SAAS,EAAED,KAAK,CAAC;EACvC;EAEAE,WAAWA,CAAA,EAAG;IACZ,OAAO,IAAI;EACb;EAEAC,IAAIA,CAAC;IAAEC;EAAuB,CAAC,EAAE;IAC/B,MAAM;MAAEC,SAAS;MAAEC,CAAC;MAAEC,CAAC;MAAEC;IAAM,CAAC,GAAG,IAAI,CAACR,KAAK;IAC7C,IAAIK,SAAS,EAAE;MACbA,SAAS,CAACI,MAAM,CAACD,KAAK,CAAC;MACvBH,SAAS,CAACK,KAAK,CAACN,MAAM,EAAEE,CAAC,EAAEC,CAAC,CAAC;IAC/B;EACF;AACF"}

package/lib/module/dom/nodes/drawings/PatchNode.d.ts

@@ -0,0 +1,18 @@
+import type { SkColor, SkPoint } from "../../../skia/types";
+import { BlendMode } from "../../../skia/types";
+import type { DrawingContext, PatchProps } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class PatchNode extends JsiDrawingNode<PatchProps, {
+    points: SkPoint[];
+    colors: SkColor[] | undefined;
+    mode: BlendMode;
+}> {
+    constructor(ctx: NodeContext, props: PatchProps);
+    deriveProps(): {
+        mode: BlendMode;
+        points: SkPoint[];
+        colors: Float32Array[] | undefined;
+    };
+    draw({ canvas, paint }: DrawingContext): void;
+}

package/lib/module/dom/nodes/drawings/PatchNode.js

@@ -0,0 +1,46 @@
+import { BlendMode } from "../../../skia/types";
+import { NodeType } from "../../types";
+import { enumKey } from "../datatypes";
+import { JsiDrawingNode } from "../DrawingNode";
+export class PatchNode extends JsiDrawingNode {
+  constructor(ctx, props) {
+    super(ctx, NodeType.Patch, props);
+  }
+  deriveProps() {
+    const {
+      colors,
+      blendMode,
+      patch
+    } = this.props;
+    const defaultBlendMode = colors ? BlendMode.DstOver : BlendMode.SrcOver;
+    const mode = blendMode ? BlendMode[enumKey(blendMode)] : defaultBlendMode;
+    // Patch requires a path with the following constraints:
+    // M tl
+    // C c1 c2 br
+    // C c1 c2 bl
+    // C c1 c2 tl (the redundant point in the last command is removed)
+    return {
+      mode,
+      points: [patch[0].pos, patch[0].c2, patch[1].c1, patch[1].pos, patch[1].c2, patch[2].c1, patch[2].pos, patch[2].c2, patch[3].c1, patch[3].pos, patch[3].c2, patch[0].c1],
+      colors: colors ? colors.map(c => this.Skia.Color(c)) : undefined
+    };
+  }
+  draw({
+    canvas,
+    paint
+  }) {
+    if (!this.derived) {
+      throw new Error("PatchNode: derived props not set");
+    }
+    const {
+      texture
+    } = this.props;
+    const {
+      colors,
+      points,
+      mode
+    } = this.derived;
+    canvas.drawPatch(points, colors, texture, mode, paint);
+  }
+}
+//# sourceMappingURL=PatchNode.js.map

package/lib/module/dom/nodes/drawings/PatchNode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BlendMode","NodeType","enumKey","JsiDrawingNode","PatchNode","constructor","ctx","props","Patch","deriveProps","colors","blendMode","patch","defaultBlendMode","DstOver","SrcOver","mode","points","pos","c2","c1","map","c","Skia","Color","undefined","draw","canvas","paint","derived","Error","texture","drawPatch"],"sources":["PatchNode.ts"],"sourcesContent":["import type { SkColor, SkPoint } from \"../../../skia/types\";\nimport { BlendMode } from \"../../../skia/types\";\nimport type { DrawingContext, PatchProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { enumKey } from \"../datatypes\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class PatchNode extends JsiDrawingNode<\n  PatchProps,\n  { points: SkPoint[]; colors: SkColor[] | undefined; mode: BlendMode }\n> {\n  constructor(ctx: NodeContext, props: PatchProps) {\n    super(ctx, NodeType.Patch, props);\n  }\n\n  deriveProps() {\n    const { colors, blendMode, patch } = this.props;\n    const defaultBlendMode = colors ? BlendMode.DstOver : BlendMode.SrcOver;\n    const mode = blendMode ? BlendMode[enumKey(blendMode)] : defaultBlendMode;\n    // Patch requires a path with the following constraints:\n    // M tl\n    // C c1 c2 br\n    // C c1 c2 bl\n    // C c1 c2 tl (the redundant point in the last command is removed)\n    return {\n      mode,\n      points: [\n        patch[0].pos,\n        patch[0].c2,\n        patch[1].c1,\n        patch[1].pos,\n        patch[1].c2,\n        patch[2].c1,\n        patch[2].pos,\n        patch[2].c2,\n        patch[3].c1,\n        patch[3].pos,\n        patch[3].c2,\n        patch[0].c1,\n      ],\n      colors: colors ? colors.map((c) => this.Skia.Color(c)) : undefined,\n    };\n  }\n\n  draw({ canvas, paint }: DrawingContext) {\n    if (!this.derived) {\n      throw new Error(\"PatchNode: derived props not set\");\n    }\n    const { texture } = this.props;\n    const { colors, points, mode } = this.derived;\n    canvas.drawPatch(points, colors, texture, mode, paint);\n  }\n}\n"],"mappings":"AACA,SAASA,SAAS,QAAQ,qBAAqB;AAE/C,SAASC,QAAQ,QAAQ,aAAa;AACtC,SAASC,OAAO,QAAQ,cAAc;AACtC,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,SAAS,SAASD,cAAc,CAG3C;EACAE,WAAWA,CAACC,GAAgB,EAAEC,KAAiB,EAAE;IAC/C,KAAK,CAACD,GAAG,EAAEL,QAAQ,CAACO,KAAK,EAAED,KAAK,CAAC;EACnC;EAEAE,WAAWA,CAAA,EAAG;IACZ,MAAM;MAAEC,MAAM;MAAEC,SAAS;MAAEC;IAAM,CAAC,GAAG,IAAI,CAACL,KAAK;IAC/C,MAAMM,gBAAgB,GAAGH,MAAM,GAAGV,SAAS,CAACc,OAAO,GAAGd,SAAS,CAACe,OAAO;IACvE,MAAMC,IAAI,GAAGL,SAAS,GAAGX,SAAS,CAACE,OAAO,CAACS,SAAS,CAAC,CAAC,GAAGE,gBAAgB;IACzE;IACA;IACA;IACA;IACA;IACA,OAAO;MACLG,IAAI;MACJC,MAAM,EAAE,CACNL,KAAK,CAAC,CAAC,CAAC,CAACM,GAAG,EACZN,KAAK,CAAC,CAAC,CAAC,CAACO,EAAE,EACXP,KAAK,CAAC,CAAC,CAAC,CAACQ,EAAE,EACXR,KAAK,CAAC,CAAC,CAAC,CAACM,GAAG,EACZN,KAAK,CAAC,CAAC,CAAC,CAACO,EAAE,EACXP,KAAK,CAAC,CAAC,CAAC,CAACQ,EAAE,EACXR,KAAK,CAAC,CAAC,CAAC,CAACM,GAAG,EACZN,KAAK,CAAC,CAAC,CAAC,CAACO,EAAE,EACXP,KAAK,CAAC,CAAC,CAAC,CAACQ,EAAE,EACXR,KAAK,CAAC,CAAC,CAAC,CAACM,GAAG,EACZN,KAAK,CAAC,CAAC,CAAC,CAACO,EAAE,EACXP,KAAK,CAAC,CAAC,CAAC,CAACQ,EAAE,CACZ;MACDV,MAAM,EAAEA,MAAM,GAAGA,MAAM,CAACW,GAAG,CAAEC,CAAC,IAAK,IAAI,CAACC,IAAI,CAACC,KAAK,CAACF,CAAC,CAAC,CAAC,GAAGG;IAC3D,CAAC;EACH;EAEAC,IAAIA,CAAC;IAAEC,MAAM;IAAEC;EAAsB,CAAC,EAAE;IACtC,IAAI,CAAC,IAAI,CAACC,OAAO,EAAE;MACjB,MAAM,IAAIC,KAAK,CAAC,kCAAkC,CAAC;IACrD;IACA,MAAM;MAAEC;IAAQ,CAAC,GAAG,IAAI,CAACxB,KAAK;IAC9B,MAAM;MAAEG,MAAM;MAAEO,MAAM;MAAED;IAAK,CAAC,GAAG,IAAI,CAACa,OAAO;IAC7CF,MAAM,CAACK,SAAS,CAACf,MAAM,EAAEP,MAAM,EAAEqB,OAAO,EAAEf,IAAI,EAAEY,KAAK,CAAC;EACxD;AACF"}

package/lib/module/dom/nodes/drawings/PathNode.d.ts

@@ -0,0 +1,9 @@
+import type { SkPath } from "../../../skia/types";
+import type { DrawingContext, PathProps } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class PathNode extends JsiDrawingNode<PathProps, SkPath> {
+    constructor(ctx: NodeContext, props: PathProps);
+    protected deriveProps(): SkPath;
+    draw({ canvas, paint }: DrawingContext): void;
+}

package/lib/module/dom/nodes/drawings/PathNode.js

@@ -0,0 +1,48 @@
+import { saturate } from "../../../renderer/processors/math";
+import { FillType } from "../../../skia/types";
+import { NodeType } from "../../types";
+import { enumKey, processPath } from "../datatypes";
+import { JsiDrawingNode } from "../DrawingNode";
+export class PathNode extends JsiDrawingNode {
+  constructor(ctx, props) {
+    super(ctx, NodeType.Path, props);
+  }
+  deriveProps() {
+    const {
+      start: trimStart,
+      end: trimEnd,
+      fillType,
+      stroke,
+      ...pathProps
+    } = this.props;
+    const start = saturate(trimStart);
+    const end = saturate(trimEnd);
+    const hasStartOffset = start !== 0;
+    const hasEndOffset = end !== 1;
+    const hasStrokeOptions = stroke !== undefined;
+    const hasFillType = !!fillType;
+    const willMutatePath = hasStartOffset || hasEndOffset || hasStrokeOptions || hasFillType;
+    const pristinePath = processPath(this.Skia, pathProps.path);
+    const path = willMutatePath ? pristinePath.copy() : pristinePath;
+    if (hasFillType) {
+      path.setFillType(FillType[enumKey(fillType)]);
+    }
+    if (hasStrokeOptions) {
+      path.stroke(stroke);
+    }
+    if (hasStartOffset || hasEndOffset) {
+      path.trim(start, end, false);
+    }
+    return path;
+  }
+  draw({
+    canvas,
+    paint
+  }) {
+    if (!this.derived) {
+      throw new Error("Path not initialized");
+    }
+    canvas.drawPath(this.derived, paint);
+  }
+}
+//# sourceMappingURL=PathNode.js.map

package/lib/module/dom/nodes/drawings/PathNode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["saturate","FillType","NodeType","enumKey","processPath","JsiDrawingNode","PathNode","constructor","ctx","props","Path","deriveProps","start","trimStart","end","trimEnd","fillType","stroke","pathProps","hasStartOffset","hasEndOffset","hasStrokeOptions","undefined","hasFillType","willMutatePath","pristinePath","Skia","path","copy","setFillType","trim","draw","canvas","paint","derived","Error","drawPath"],"sources":["PathNode.ts"],"sourcesContent":["import { saturate } from \"../../../renderer/processors/math\";\nimport { FillType } from \"../../../skia/types\";\nimport type { SkPath } from \"../../../skia/types\";\nimport type { DrawingContext, PathProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { enumKey, processPath } from \"../datatypes\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class PathNode extends JsiDrawingNode<PathProps, SkPath> {\n  constructor(ctx: NodeContext, props: PathProps) {\n    super(ctx, NodeType.Path, props);\n  }\n\n  protected deriveProps() {\n    const {\n      start: trimStart,\n      end: trimEnd,\n      fillType,\n      stroke,\n      ...pathProps\n    } = this.props;\n    const start = saturate(trimStart);\n    const end = saturate(trimEnd);\n    const hasStartOffset = start !== 0;\n    const hasEndOffset = end !== 1;\n    const hasStrokeOptions = stroke !== undefined;\n    const hasFillType = !!fillType;\n    const willMutatePath =\n      hasStartOffset || hasEndOffset || hasStrokeOptions || hasFillType;\n    const pristinePath = processPath(this.Skia, pathProps.path);\n    const path = willMutatePath ? pristinePath.copy() : pristinePath;\n    if (hasFillType) {\n      path.setFillType(FillType[enumKey(fillType)]);\n    }\n    if (hasStrokeOptions) {\n      path.stroke(stroke);\n    }\n    if (hasStartOffset || hasEndOffset) {\n      path.trim(start, end, false);\n    }\n    return path;\n  }\n\n  draw({ canvas, paint }: DrawingContext) {\n    if (!this.derived) {\n      throw new Error(\"Path not initialized\");\n    }\n    canvas.drawPath(this.derived, paint);\n  }\n}\n"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,mCAAmC;AAC5D,SAASC,QAAQ,QAAQ,qBAAqB;AAG9C,SAASC,QAAQ,QAAQ,aAAa;AACtC,SAASC,OAAO,EAAEC,WAAW,QAAQ,cAAc;AACnD,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,QAAQ,SAASD,cAAc,CAAoB;EAC9DE,WAAWA,CAACC,GAAgB,EAAEC,KAAgB,EAAE;IAC9C,KAAK,CAACD,GAAG,EAAEN,QAAQ,CAACQ,IAAI,EAAED,KAAK,CAAC;EAClC;EAEUE,WAAWA,CAAA,EAAG;IACtB,MAAM;MACJC,KAAK,EAAEC,SAAS;MAChBC,GAAG,EAAEC,OAAO;MACZC,QAAQ;MACRC,MAAM;MACN,GAAGC;IACL,CAAC,GAAG,IAAI,CAACT,KAAK;IACd,MAAMG,KAAK,GAAGZ,QAAQ,CAACa,SAAS,CAAC;IACjC,MAAMC,GAAG,GAAGd,QAAQ,CAACe,OAAO,CAAC;IAC7B,MAAMI,cAAc,GAAGP,KAAK,KAAK,CAAC;IAClC,MAAMQ,YAAY,GAAGN,GAAG,KAAK,CAAC;IAC9B,MAAMO,gBAAgB,GAAGJ,MAAM,KAAKK,SAAS;IAC7C,MAAMC,WAAW,GAAG,CAAC,CAACP,QAAQ;IAC9B,MAAMQ,cAAc,GAClBL,cAAc,IAAIC,YAAY,IAAIC,gBAAgB,IAAIE,WAAW;IACnE,MAAME,YAAY,GAAGrB,WAAW,CAAC,IAAI,CAACsB,IAAI,EAAER,SAAS,CAACS,IAAI,CAAC;IAC3D,MAAMA,IAAI,GAAGH,cAAc,GAAGC,YAAY,CAACG,IAAI,CAAC,CAAC,GAAGH,YAAY;IAChE,IAAIF,WAAW,EAAE;MACfI,IAAI,CAACE,WAAW,CAAC5B,QAAQ,CAACE,OAAO,CAACa,QAAQ,CAAC,CAAC,CAAC;IAC/C;IACA,IAAIK,gBAAgB,EAAE;MACpBM,IAAI,CAACV,MAAM,CAACA,MAAM,CAAC;IACrB;IACA,IAAIE,cAAc,IAAIC,YAAY,EAAE;MAClCO,IAAI,CAACG,IAAI,CAAClB,KAAK,EAAEE,GAAG,EAAE,KAAK,CAAC;IAC9B;IACA,OAAOa,IAAI;EACb;EAEAI,IAAIA,CAAC;IAAEC,MAAM;IAAEC;EAAsB,CAAC,EAAE;IACtC,IAAI,CAAC,IAAI,CAACC,OAAO,EAAE;MACjB,MAAM,IAAIC,KAAK,CAAC,sBAAsB,CAAC;IACzC;IACAH,MAAM,CAACI,QAAQ,CAAC,IAAI,CAACF,OAAO,EAAED,KAAK,CAAC;EACtC;AACF"}

package/lib/module/dom/nodes/drawings/PictureNode.d.ts

@@ -0,0 +1,8 @@
+import type { DrawingContext, PictureProps } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class PictureNode extends JsiDrawingNode<PictureProps, null> {
+    constructor(ctx: NodeContext, props: PictureProps);
+    deriveProps(): null;
+    draw({ canvas }: DrawingContext): void;
+}

package/lib/module/dom/nodes/drawings/PictureNode.js

@@ -0,0 +1,19 @@
+import { NodeType } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+export class PictureNode extends JsiDrawingNode {
+  constructor(ctx, props) {
+    super(ctx, NodeType.Picture, props);
+  }
+  deriveProps() {
+    return null;
+  }
+  draw({
+    canvas
+  }) {
+    const {
+      picture
+    } = this.props;
+    canvas.drawPicture(picture);
+  }
+}
+//# sourceMappingURL=PictureNode.js.map

package/lib/module/dom/nodes/drawings/PictureNode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["NodeType","JsiDrawingNode","PictureNode","constructor","ctx","props","Picture","deriveProps","draw","canvas","picture","drawPicture"],"sources":["PictureNode.ts"],"sourcesContent":["import type { DrawingContext, PictureProps } from \"../../types\";\nimport { NodeType } from \"../../types\";\nimport { JsiDrawingNode } from \"../DrawingNode\";\nimport type { NodeContext } from \"../Node\";\n\nexport class PictureNode extends JsiDrawingNode<PictureProps, null> {\n  constructor(ctx: NodeContext, props: PictureProps) {\n    super(ctx, NodeType.Picture, props);\n  }\n\n  deriveProps() {\n    return null;\n  }\n\n  draw({ canvas }: DrawingContext) {\n    const { picture } = this.props;\n    canvas.drawPicture(picture);\n  }\n}\n"],"mappings":"AACA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,cAAc,QAAQ,gBAAgB;AAG/C,OAAO,MAAMC,WAAW,SAASD,cAAc,CAAqB;EAClEE,WAAWA,CAACC,GAAgB,EAAEC,KAAmB,EAAE;IACjD,KAAK,CAACD,GAAG,EAAEJ,QAAQ,CAACM,OAAO,EAAED,KAAK,CAAC;EACrC;EAEAE,WAAWA,CAAA,EAAG;IACZ,OAAO,IAAI;EACb;EAEAC,IAAIA,CAAC;IAAEC;EAAuB,CAAC,EAAE;IAC/B,MAAM;MAAEC;IAAQ,CAAC,GAAG,IAAI,CAACL,KAAK;IAC9BI,MAAM,CAACE,WAAW,CAACD,OAAO,CAAC;EAC7B;AACF"}

package/lib/module/dom/nodes/drawings/PointsNode.d.ts

@@ -0,0 +1,8 @@
+import type { DrawingContext, PointsProps } from "../../types";
+import { JsiDrawingNode } from "../DrawingNode";
+import type { NodeContext } from "../Node";
+export declare class PointsNode extends JsiDrawingNode<PointsProps, null> {
+    constructor(ctx: NodeContext, props: PointsProps);
+    deriveProps(): null;
+    draw({ canvas, paint }: DrawingContext): void;
+}