@shopify/react-native-skia 1.7.7 → 1.8.0

package/lib/typescript/src/sksg/DrawingContext.d.ts

@@ -1,16 +1,13 @@
 import type { DrawingNodeProps, GroupProps } from "../dom/types";
-import { DeclarationContext } from "../dom/types";
 import type { SkCanvas, Skia, SkPaint } from "../skia/types";
-export declare class DrawingContext {
-    private paints;
-    declCtx: DeclarationContext;
+import type { DeclarationContext } from "./DeclarationContext";
+export declare const createDrawingContext: (Skia: Skia, canvas: SkCanvas) => {
     Skia: Skia;
     canvas: SkCanvas;
-    constructor(Skia: Skia, canvas: SkCanvas);
-    save(): void;
-    restore(): void;
-    get paint(): SkPaint;
-    getLocalPaints(): SkPaint[];
-    processPaint({ opacity, color, strokeWidth, blendMode, style, strokeJoin, strokeCap, strokeMiter, antiAlias, dither, paint: paintProp, }: DrawingNodeProps): boolean;
-    processMatrixAndClipping(props: GroupProps, layer?: boolean | SkPaint): boolean;
-}
+    save: () => number;
+    restore: () => SkPaint | undefined;
+    getPaint: () => SkPaint;
+    processPaint: ({ opacity, color, strokeWidth, blendMode, style, strokeJoin, strokeCap, strokeMiter, antiAlias, dither, paint: paintProp, }: DrawingNodeProps, declCtx: DeclarationContext) => boolean;
+    processMatrixAndClipping: (props: GroupProps, layer?: boolean | SkPaint) => boolean;
+};
+export type DrawingContext = ReturnType<typeof createDrawingContext>;

package/lib/typescript/src/sksg/Reconciler.d.ts

@@ -2,6 +2,7 @@ import type { ReactNode } from "react";
 import type { SkCanvas, Skia } from "../skia/types";
 import { NodeType } from "../dom/types";
 export declare class SkiaSGRoot {
+    Skia: Skia;
     private root;
     private container;
     constructor(Skia: Skia, nativeId?: number);
@@ -13,5 +14,6 @@ export declare class SkiaSGRoot {
     };
     render(element: ReactNode): void;
     drawOnCanvas(canvas: SkCanvas): void;
+    getPicture(): import("../skia/types").SkPicture;
     unmount(): void;
 }

package/lib/typescript/src/sksg/nodes/colorFilters.d.ts

@@ -1,7 +1,10 @@
-import type { BlendColorFilterProps, DeclarationContext, LerpColorFilterProps, MatrixColorFilterProps } from "../../dom/types";
-export declare const makeBlendColorFilter: (ctx: DeclarationContext, props: BlendColorFilterProps) => import("../../skia/types").SkColorFilter;
-export declare const makeSRGBToLinearGammaColorFilter: (ctx: DeclarationContext) => import("../../skia/types").SkColorFilter;
-export declare const makeLinearToSRGBGammaColorFilter: (ctx: DeclarationContext) => import("../../skia/types").SkColorFilter;
+import type { BlendColorFilterProps, LerpColorFilterProps, MatrixColorFilterProps } from "../../dom/types";
+import type { SkColorFilter } from "../../skia/types";
+import type { DeclarationContext } from "../DeclarationContext";
+export declare const composeColorFilters: (ctx: DeclarationContext, cf: SkColorFilter, processChildren: () => void) => void;
+export declare const makeBlendColorFilter: (ctx: DeclarationContext, props: BlendColorFilterProps) => SkColorFilter;
+export declare const makeSRGBToLinearGammaColorFilter: (ctx: DeclarationContext) => SkColorFilter;
+export declare const makeLinearToSRGBGammaColorFilter: (ctx: DeclarationContext) => SkColorFilter;
 export declare const declareLerpColorFilter: (ctx: DeclarationContext, props: LerpColorFilterProps) => void;
-export declare const makeMatrixColorFilter: (ctx: DeclarationContext, props: MatrixColorFilterProps) => import("../../skia/types").SkColorFilter;
-export declare const makeLumaColorFilter: (ctx: DeclarationContext) => import("../../skia/types").SkColorFilter;
+export declare const makeMatrixColorFilter: (ctx: DeclarationContext, props: MatrixColorFilterProps) => SkColorFilter;
+export declare const makeLumaColorFilter: (ctx: DeclarationContext) => SkColorFilter;

package/lib/typescript/src/sksg/nodes/drawings.d.ts

@@ -1,4 +1,4 @@
-import type { AtlasProps, BoxProps, BoxShadowProps, CircleProps, DiffRectProps, DrawingNodeProps, GlyphsProps, ImageProps, ImageSVGProps, LineProps, OvalProps, ParagraphProps, PatchProps, PathProps, PictureProps, PointsProps, RectProps, RoundedRectProps, TextBlobProps, TextPathProps, TextProps, VerticesProps } from "../../dom/types";
+import type { AtlasProps, BoxProps, CircleProps, DiffRectProps, DrawingNodeProps, GlyphsProps, ImageProps, ImageSVGProps, LineProps, OvalProps, ParagraphProps, PatchProps, PathProps, PictureProps, PointsProps, RectProps, RoundedRectProps, TextBlobProps, TextPathProps, TextProps, VerticesProps } from "../../dom/types";
 import type { SkCanvas, SkPaint, Skia } from "../../skia/types";
 import type { Node } from "./Node";
 interface LocalDrawingContext {
@@ -9,7 +9,6 @@ interface LocalDrawingContext {
 export declare const drawLine: (ctx: LocalDrawingContext, props: LineProps) => void;
 export declare const drawOval: (ctx: LocalDrawingContext, props: OvalProps) => void;
 export declare const drawBox: (ctx: LocalDrawingContext, props: BoxProps, children: Node<any>[]) => void;
-export declare const drawBoxShadow: (_ctx: LocalDrawingContext, _props: BoxShadowProps) => void;
 export declare const drawImage: (ctx: LocalDrawingContext, props: ImageProps) => void;
 export declare const drawPoints: (ctx: LocalDrawingContext, props: PointsProps) => void;
 export declare const drawVertices: (ctx: LocalDrawingContext, props: VerticesProps) => void;

package/lib/typescript/src/sksg/nodes/imageFilters.d.ts

@@ -1,9 +1,12 @@
-import type { BlendImageFilterProps, BlurImageFilterProps, BlurMaskFilterProps, DeclarationContext, DisplacementMapImageFilterProps, DropShadowImageFilterProps, MorphologyImageFilterProps, OffsetImageFilterProps, RuntimeShaderImageFilterProps } from "../../dom/types";
+import type { BlendImageFilterProps, BlendProps, BlurImageFilterProps, BlurMaskFilterProps, DisplacementMapImageFilterProps, DropShadowImageFilterProps, MorphologyImageFilterProps, OffsetImageFilterProps, RuntimeShaderImageFilterProps } from "../../dom/types";
 import type { SkImageFilter } from "../../skia/types";
+import type { DeclarationContext } from "../DeclarationContext";
 export declare enum MorphologyOperator {
     Erode = 0,
     Dilate = 1
 }
+export declare const declareBlend: (ctx: DeclarationContext, props: BlendProps) => void;
+export declare const composeImageFilters: (ctx: DeclarationContext, imgf1: SkImageFilter, processChildren: () => void) => void;
 export declare const makeOffsetImageFilter: (ctx: DeclarationContext, props: OffsetImageFilterProps) => SkImageFilter;
 export declare const declareDisplacementMapImageFilter: (ctx: DeclarationContext, props: DisplacementMapImageFilterProps) => void;
 export declare const makeBlurImageFilter: (ctx: DeclarationContext, props: BlurImageFilterProps) => SkImageFilter;

package/lib/typescript/src/sksg/nodes/paint.d.ts

@@ -1,2 +1,3 @@
-import type { DeclarationContext, PaintProps } from "../../dom/types";
+import type { PaintProps } from "../../dom/types";
+import type { DeclarationContext } from "../DeclarationContext";
 export declare const declarePaint: (ctx: DeclarationContext, props: PaintProps) => void;

package/lib/typescript/src/sksg/nodes/pathEffects.d.ts

@@ -1,8 +1,11 @@
-import type { CornerPathEffectProps, DashPathEffectProps, DeclarationContext, DiscretePathEffectProps, Line2DPathEffectProps, Path1DPathEffectProps, Path2DPathEffectProps } from "../../dom/types";
-export declare const makeDiscretePathEffect: (ctx: DeclarationContext, props: DiscretePathEffectProps) => import("../../skia/types").SkPathEffect;
-export declare const makePath2DPathEffect: (ctx: DeclarationContext, props: Path2DPathEffectProps) => import("../../skia/types").SkPathEffect;
-export declare const makeDashPathEffect: (ctx: DeclarationContext, props: DashPathEffectProps) => import("../../skia/types").SkPathEffect;
-export declare const makeCornerPathEffect: (ctx: DeclarationContext, props: CornerPathEffectProps) => import("../../skia/types").SkPathEffect;
+import type { CornerPathEffectProps, DashPathEffectProps, DiscretePathEffectProps, Line2DPathEffectProps, Path1DPathEffectProps, Path2DPathEffectProps } from "../../dom/types";
+import type { SkPathEffect } from "../../skia/types";
+import { type DeclarationContext } from "../DeclarationContext";
+export declare const composePathEffects: (ctx: DeclarationContext, pe: SkPathEffect, processChildren: () => void) => void;
+export declare const makeDiscretePathEffect: (ctx: DeclarationContext, props: DiscretePathEffectProps) => SkPathEffect;
+export declare const makePath2DPathEffect: (ctx: DeclarationContext, props: Path2DPathEffectProps) => SkPathEffect;
+export declare const makeDashPathEffect: (ctx: DeclarationContext, props: DashPathEffectProps) => SkPathEffect;
+export declare const makeCornerPathEffect: (ctx: DeclarationContext, props: CornerPathEffectProps) => SkPathEffect;
 export declare const declareSumPathEffect: (ctx: DeclarationContext) => void;
-export declare const makeLine2DPathEffect: (ctx: DeclarationContext, props: Line2DPathEffectProps) => import("../../skia/types").SkPathEffect;
-export declare const makePath1DPathEffect: (ctx: DeclarationContext, props: Path1DPathEffectProps) => import("../../skia/types").SkPathEffect;
+export declare const makeLine2DPathEffect: (ctx: DeclarationContext, props: Line2DPathEffectProps) => SkPathEffect;
+export declare const makePath1DPathEffect: (ctx: DeclarationContext, props: Path1DPathEffectProps) => SkPathEffect;

package/lib/typescript/src/sksg/nodes/shaders.d.ts

@@ -1,4 +1,5 @@
-import type { ColorProps, DeclarationContext, FractalNoiseProps, ImageShaderProps, LinearGradientProps, RadialGradientProps, ShaderProps, SweepGradientProps, TurbulenceProps, TwoPointConicalGradientProps } from "../../dom/types";
+import type { ColorProps, FractalNoiseProps, ImageShaderProps, LinearGradientProps, RadialGradientProps, ShaderProps, SweepGradientProps, TurbulenceProps, TwoPointConicalGradientProps } from "../../dom/types";
+import type { DeclarationContext } from "../DeclarationContext";
 export declare const declareShader: (ctx: DeclarationContext, props: ShaderProps) => void;
 export declare const declareColorShader: (ctx: DeclarationContext, props: ColorProps) => void;
 export declare const declareFractalNoiseShader: (ctx: DeclarationContext, props: FractalNoiseProps) => void;

package/lib/typescript/src/views/SkiaDomView.web.d.ts

@@ -1,7 +0,0 @@
-import type { SkCanvas } from "../skia/types";
-import { SkiaBaseWebView } from "./SkiaBaseWebView";
-import type { SkiaDomViewNativeProps } from "./types";
-export declare class SkiaDomView extends SkiaBaseWebView<SkiaDomViewNativeProps> {
-    constructor(props: SkiaDomViewNativeProps);
-    protected renderInCanvas(canvas: SkCanvas): void;
-}

package/lib/typescript/src/views/SkiaPictureView.web.d.ts

@@ -1,7 +1,9 @@
-import type { SkCanvas } from "../skia/types";
+import type { SkCanvas, SkPicture } from "../skia/types";
 import type { SkiaPictureViewNativeProps } from "./types";
 import { SkiaBaseWebView } from "./SkiaBaseWebView";
 export declare class SkiaPictureView extends SkiaBaseWebView<SkiaPictureViewNativeProps> {
+    private picture;
     constructor(props: SkiaPictureViewNativeProps);
+    setPicture(picture: SkPicture): void;
     protected renderInCanvas(canvas: SkCanvas): void;
 }

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

@@ -1,16 +1,11 @@
 import type { ViewProps } from "react-native";
 import type { SharedValue } from "react-native-reanimated";
-import type { GroupProps, RenderNode } from "../dom/types";
+import type { Node } from "../dom/types";
 import type { SkImage, SkPicture, SkRect, SkSize } from "../skia/types";
 export type NativeSkiaViewProps = ViewProps & {
     debug?: boolean;
     opaque?: boolean;
 };
-export interface DrawingInfo {
-    width: number;
-    height: number;
-    timestamp: number;
-}
 export interface ISkiaViewApi {
     setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;
     requestRedraw: (nativeId: number) => void;
@@ -34,5 +29,5 @@ export interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {
     picture?: SkPicture;
 }
 export interface SkiaDomViewNativeProps extends SkiaBaseViewProps {
-    root?: RenderNode<GroupProps>;
+    root?: Node<unknown>;
 }

package/package.json

@@ -7,7 +7,7 @@
     "setup-skia-web": "./scripts/setup-canvaskit.js"
   },
   "title": "React Native Skia",
-  "version": "1.7.7",
+  "version": "1.8.0",
   "description": "High-performance React Native Graphics using Skia",
   "main": "lib/module/index.js",
   "react-native": "src/index.ts",

package/src/dom/nodes/JsiSkDOM.ts

@@ -58,422 +58,241 @@ import type {
 } from "../types/PathEffects";
 import type { ParagraphProps } from "../types/Paragraph";
 
-import {
-  FillNode,
-  ImageNode,
-  CircleNode,
-  PathNode,
-  LineNode,
-  PatchNode,
-  PointsNode,
-  RectNode,
-  RRectNode,
-  VerticesNode,
-  TextNode,
-  OvalNode,
-  TextPathNode,
-  TextBlobNode,
-  GlyphsNode,
-  DiffRectNode,
-  PictureNode,
-  ImageSVGNode,
-  BackdropFilterNode,
-  BoxNode,
-  BoxShadowNode,
-  AtlasNode,
-} from "./drawings";
-import {
-  BlendImageFilterNode,
-  BlurImageFilterNode,
-  BlurMaskFilterNode,
-  DisplacementMapImageFilterNode,
-  DropShadowImageFilterNode,
-  OffsetImageFilterNode,
-  RuntimeShaderImageFilterNode,
-  CornerPathEffectNode,
-  DiscretePathEffectNode,
-  DashPathEffectNode,
-  Path1DPathEffectNode,
-  Path2DPathEffectNode,
-  SumPathEffectNode,
-  Line2DPathEffectNode,
-  BlendNode,
-} from "./paint";
-import {
-  MatrixColorFilterNode,
-  LumaColorFilterNode,
-  LinearToSRGBGammaColorFilterNode,
-  SRGBToLinearGammaColorFilterNode,
-  BlendColorFilterNode,
-  LerpColorFilterNode,
-} from "./paint/ColorFilters";
-import {
-  LinearGradientNode,
-  ShaderNode,
-  ImageShaderNode,
-  TwoPointConicalGradientNode,
-  TurbulenceNode,
-  SweepGradientNode,
-  RadialGradientNode,
-  FractalNoiseNode,
-  ColorNode,
-} from "./paint/Shaders";
-import { MorphologyImageFilterNode } from "./paint/ImageFilters";
-import { GroupNode } from "./GroupNode";
-import { PaintNode } from "./PaintNode";
-import type { NodeContext } from "./Node";
-import { LayerNode } from "./LayerNode";
-import { ParagraphNode } from "./drawings/ParagraphNode";
-
 export class JsiSkDOM implements SkDOM {
-  constructor(private ctx: NodeContext, private native: boolean) {}
+  constructor() {}
 
   Layer(props?: ChildrenProps) {
-    return this.native
-      ? global.SkiaDomApi.LayerNode(props ?? {})
-      : new LayerNode(this.ctx, props ?? {});
+    return global.SkiaDomApi.LayerNode(props ?? {});
   }
 
   Group(props?: GroupProps) {
-    return this.native
-      ? global.SkiaDomApi.GroupNode(props ?? {})
-      : new GroupNode(this.ctx, props ?? {});
+    return global.SkiaDomApi.GroupNode(props ?? {});
   }
 
   Paint(props: PaintProps) {
-    return this.native
-      ? global.SkiaDomApi.PaintNode(props ?? {})
-      : new PaintNode(this.ctx, props);
+    return global.SkiaDomApi.PaintNode(props ?? {});
   }
 
   // Drawings
   Fill(props?: DrawingNodeProps) {
-    return this.native
-      ? global.SkiaDomApi.FillNode(props ?? {})
-      : new FillNode(this.ctx, props);
+    return global.SkiaDomApi.FillNode(props ?? {});
   }
 
   Image(props: ImageProps) {
-    return this.native
-      ? global.SkiaDomApi.ImageNode(props ?? {})
-      : new ImageNode(this.ctx, props);
+    return global.SkiaDomApi.ImageNode(props ?? {});
   }
 
   Circle(props: CircleProps) {
-    return this.native
-      ? global.SkiaDomApi.CircleNode(props ?? {})
-      : new CircleNode(this.ctx, props);
+    return global.SkiaDomApi.CircleNode(props ?? {});
   }
 
   Path(props: PathProps) {
-    return this.native
-      ? global.SkiaDomApi.PathNode(props ?? {})
-      : new PathNode(this.ctx, props);
+    return global.SkiaDomApi.PathNode(props ?? {});
   }
 
   Line(props: LineProps) {
-    return this.native
-      ? global.SkiaDomApi.LineNode(props ?? {})
-      : new LineNode(this.ctx, props);
+    return global.SkiaDomApi.LineNode(props ?? {});
   }
 
   Oval(props: OvalProps) {
-    return this.native
-      ? global.SkiaDomApi.OvalNode(props ?? {})
-      : new OvalNode(this.ctx, props);
+    return global.SkiaDomApi.OvalNode(props ?? {});
   }
 
   Patch(props: PatchProps) {
-    return this.native
-      ? global.SkiaDomApi.PatchNode(props ?? {})
-      : new PatchNode(this.ctx, props);
+    return global.SkiaDomApi.PatchNode(props ?? {});
   }
 
   Points(props: PointsProps) {
-    return this.native
-      ? global.SkiaDomApi.PointsNode(props ?? {})
-      : new PointsNode(this.ctx, props);
+    return global.SkiaDomApi.PointsNode(props ?? {});
   }
 
   Rect(props: RectProps) {
-    return this.native
-      ? global.SkiaDomApi.RectNode(props)
-      : new RectNode(this.ctx, props);
+    return global.SkiaDomApi.RectNode(props);
   }
 
   RRect(props: RoundedRectProps) {
-    return this.native
-      ? global.SkiaDomApi.RRectNode(props)
-      : new RRectNode(this.ctx, props);
+    return global.SkiaDomApi.RRectNode(props);
   }
 
   Vertices(props: VerticesProps) {
-    return this.native
-      ? global.SkiaDomApi.VerticesNode(props)
-      : new VerticesNode(this.ctx, props);
+    return global.SkiaDomApi.VerticesNode(props);
   }
 
   Text(props: TextProps) {
-    return this.native
-      ? global.SkiaDomApi.TextNode(props)
-      : new TextNode(this.ctx, props);
+    return global.SkiaDomApi.TextNode(props);
   }
 
   TextPath(props: TextPathProps) {
-    return this.native
-      ? global.SkiaDomApi.TextPathNode(props)
-      : new TextPathNode(this.ctx, props);
+    return global.SkiaDomApi.TextPathNode(props);
   }
 
   TextBlob(props: TextBlobProps) {
-    return this.native
-      ? global.SkiaDomApi.TextBlobNode(props)
-      : new TextBlobNode(this.ctx, props);
+    return global.SkiaDomApi.TextBlobNode(props);
   }
 
   Glyphs(props: GlyphsProps) {
-    return this.native
-      ? global.SkiaDomApi.GlyphsNode(props)
-      : new GlyphsNode(this.ctx, props);
+    return global.SkiaDomApi.GlyphsNode(props);
   }
 
   DiffRect(props: DiffRectProps) {
-    return this.native
-      ? global.SkiaDomApi.DiffRectNode(props)
-      : new DiffRectNode(this.ctx, props);
+    return global.SkiaDomApi.DiffRectNode(props);
   }
 
   Picture(props: PictureProps) {
-    return this.native
-      ? global.SkiaDomApi.PictureNode(props)
-      : new PictureNode(this.ctx, props);
+    return global.SkiaDomApi.PictureNode(props);
   }
 
   Atlas(props: AtlasProps) {
-    return this.native
-      ? global.SkiaDomApi.AtlasNode(props)
-      : new AtlasNode(this.ctx, props);
+    return global.SkiaDomApi.AtlasNode(props);
   }
 
   ImageSVG(props: ImageSVGProps) {
-    return this.native
-      ? global.SkiaDomApi.ImageSVGNode(props)
-      : new ImageSVGNode(this.ctx, props);
+    return global.SkiaDomApi.ImageSVGNode(props);
   }
 
   // BlurMaskFilters
   BlurMaskFilter(props: BlurMaskFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.BlurMaskFilterNode(props)
-      : new BlurMaskFilterNode(this.ctx, props);
+    return global.SkiaDomApi.BlurMaskFilterNode(props);
   }
 
   // ImageFilters
   BlendImageFilter(props: BlendImageFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.BlendImageFilterNode(props)
-      : new BlendImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi.BlendImageFilterNode(props);
   }
 
   DropShadowImageFilter(props: DropShadowImageFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.DropShadowImageFilterNode(props)
-      : new DropShadowImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi.DropShadowImageFilterNode(props);
   }
 
   DisplacementMapImageFilter(props: DisplacementMapImageFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.DisplacementMapImageFilterNode(props)
-      : new DisplacementMapImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi.DisplacementMapImageFilterNode(props);
   }
 
   BlurImageFilter(props: BlurImageFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.BlurImageFilterNode(props)
-      : new BlurImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi.BlurImageFilterNode(props);
   }
 
   OffsetImageFilter(props: OffsetImageFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.OffsetImageFilterNode(props)
-      : new OffsetImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi.OffsetImageFilterNode(props);
   }
 
   MorphologyImageFilter(props: MorphologyImageFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.MorphologyImageFilterNode(props)
-      : new MorphologyImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi.MorphologyImageFilterNode(props);
   }
 
   RuntimeShaderImageFilter(props: RuntimeShaderImageFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.RuntimeShaderImageFilterNode(props)
-      : new RuntimeShaderImageFilterNode(this.ctx, props);
+    return global.SkiaDomApi.RuntimeShaderImageFilterNode(props);
   }
 
   // Color Filters
   MatrixColorFilter(props: MatrixColorFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.MatrixColorFilterNode(props)
-      : new MatrixColorFilterNode(this.ctx, props);
+    return global.SkiaDomApi.MatrixColorFilterNode(props);
   }
 
   BlendColorFilter(props: BlendColorFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.BlendColorFilterNode(props)
-      : new BlendColorFilterNode(this.ctx, props);
+    return global.SkiaDomApi.BlendColorFilterNode(props);
   }
 
   LumaColorFilter() {
-    return this.native
-      ? global.SkiaDomApi.LumaColorFilterNode()
-      : new LumaColorFilterNode(this.ctx);
+    return global.SkiaDomApi.LumaColorFilterNode();
   }
 
   LinearToSRGBGammaColorFilter() {
-    return this.native
-      ? global.SkiaDomApi.LinearToSRGBGammaColorFilterNode()
-      : new LinearToSRGBGammaColorFilterNode(this.ctx);
+    return global.SkiaDomApi.LinearToSRGBGammaColorFilterNode();
   }
 
   SRGBToLinearGammaColorFilter() {
-    return this.native
-      ? global.SkiaDomApi.SRGBToLinearGammaColorFilterNode()
-      : new SRGBToLinearGammaColorFilterNode(this.ctx);
+    return global.SkiaDomApi.SRGBToLinearGammaColorFilterNode();
   }
 
   LerpColorFilter(props: LerpColorFilterProps) {
-    return this.native
-      ? global.SkiaDomApi.LerpColorFilterNode(props)
-      : new LerpColorFilterNode(this.ctx, props);
+    return global.SkiaDomApi.LerpColorFilterNode(props);
   }
 
   // Shaders
   Shader(props: ShaderProps) {
-    return this.native
-      ? global.SkiaDomApi.ShaderNode(props)
-      : new ShaderNode(this.ctx, props);
+    return global.SkiaDomApi.ShaderNode(props);
   }
 
   ImageShader(props: ImageShaderProps) {
-    return this.native
-      ? global.SkiaDomApi.ImageShaderNode(props)
-      : new ImageShaderNode(this.ctx, props);
+    return global.SkiaDomApi.ImageShaderNode(props);
   }
 
   ColorShader(props: ColorProps) {
-    return this.native
-      ? global.SkiaDomApi.ColorShaderNode(props)
-      : new ColorNode(this.ctx, props);
+    return global.SkiaDomApi.ColorShaderNode(props);
   }
 
   SweepGradient(props: SweepGradientProps) {
-    return this.native
-      ? global.SkiaDomApi.SweepGradientNode(props)
-      : new SweepGradientNode(this.ctx, props);
+    return global.SkiaDomApi.SweepGradientNode(props);
   }
 
   Turbulence(props: TurbulenceProps) {
-    return this.native
-      ? global.SkiaDomApi.TurbulenceNode(props)
-      : new TurbulenceNode(this.ctx, props);
+    return global.SkiaDomApi.TurbulenceNode(props);
   }
 
   FractalNoise(props: FractalNoiseProps) {
-    return this.native
-      ? global.SkiaDomApi.FractalNoiseNode(props)
-      : new FractalNoiseNode(this.ctx, props);
+    return global.SkiaDomApi.FractalNoiseNode(props);
   }
 
   LinearGradient(props: LinearGradientProps) {
-    return this.native
-      ? global.SkiaDomApi.LinearGradientNode(props)
-      : new LinearGradientNode(this.ctx, props);
+    return global.SkiaDomApi.LinearGradientNode(props);
   }
 
   RadialGradient(props: RadialGradientProps) {
-    return this.native
-      ? global.SkiaDomApi.RadialGradientNode(props)
-      : new RadialGradientNode(this.ctx, props);
+    return global.SkiaDomApi.RadialGradientNode(props);
   }
 
   TwoPointConicalGradient(props: TwoPointConicalGradientProps) {
-    return this.native
-      ? global.SkiaDomApi.TwoPointConicalGradientNode(props)
-      : new TwoPointConicalGradientNode(this.ctx, props);
+    return global.SkiaDomApi.TwoPointConicalGradientNode(props);
   }
 
   // Path Effects
   CornerPathEffect(props: CornerPathEffectProps) {
-    return this.native
-      ? global.SkiaDomApi.CornerPathEffectNode(props)
-      : new CornerPathEffectNode(this.ctx, props);
+    return global.SkiaDomApi.CornerPathEffectNode(props);
   }
 
   DiscretePathEffect(props: DiscretePathEffectProps) {
-    return this.native
-      ? global.SkiaDomApi.DiscretePathEffectNode(props)
-      : new DiscretePathEffectNode(this.ctx, props);
+    return global.SkiaDomApi.DiscretePathEffectNode(props);
   }
 
   DashPathEffect(props: DashPathEffectProps) {
-    return this.native
-      ? global.SkiaDomApi.DashPathEffectNode(props)
-      : new DashPathEffectNode(this.ctx, props);
+    return global.SkiaDomApi.DashPathEffectNode(props);
   }
 
   Path1DPathEffect(props: Path1DPathEffectProps) {
-    return this.native
-      ? global.SkiaDomApi.Path1DPathEffectNode(props)
-      : new Path1DPathEffectNode(this.ctx, props);
+    return global.SkiaDomApi.Path1DPathEffectNode(props);
   }
 
   Path2DPathEffect(props: Path2DPathEffectProps) {
-    return this.native
-      ? global.SkiaDomApi.Path2DPathEffectNode(props)
-      : new Path2DPathEffectNode(this.ctx, props);
+    return global.SkiaDomApi.Path2DPathEffectNode(props);
   }
 
   SumPathEffect() {
-    return this.native
-      ? global.SkiaDomApi.SumPathEffectNode()
-      : new SumPathEffectNode(this.ctx);
+    return global.SkiaDomApi.SumPathEffectNode();
   }
 
   Line2DPathEffect(props: Line2DPathEffectProps) {
-    return this.native
-      ? global.SkiaDomApi.Line2DPathEffectNode(props)
-      : new Line2DPathEffectNode(this.ctx, props);
+    return global.SkiaDomApi.Line2DPathEffectNode(props);
   }
 
   Blend(props: BlendProps) {
-    return this.native
-      ? global.SkiaDomApi.BlendNode(props)
-      : new BlendNode(this.ctx, props);
+    return global.SkiaDomApi.BlendNode(props);
   }
 
   BackdropFilter(props: ChildrenProps) {
-    return this.native
-      ? global.SkiaDomApi.BackdropFilterNode(props)
-      : new BackdropFilterNode(this.ctx, props);
+    return global.SkiaDomApi.BackdropFilterNode(props);
   }
 
   Box(props: BoxProps) {
-    return this.native
-      ? global.SkiaDomApi.BoxNode(props)
-      : new BoxNode(this.ctx, props);
+    return global.SkiaDomApi.BoxNode(props);
   }
 
   BoxShadow(props: BoxShadowProps) {
-    return this.native
-      ? global.SkiaDomApi.BoxShadowNode(props)
-      : new BoxShadowNode(this.ctx, props);
+    return global.SkiaDomApi.BoxShadowNode(props);
   }
 
   // Paragraph
   Paragraph(props: ParagraphProps) {
-    return this.native
-      ? global.SkiaDomApi.ParagraphNode(props)
-      : new ParagraphNode(this.ctx, props);
+    return global.SkiaDomApi.ParagraphNode(props);
   }
 }