@shopify/react-native-skia 0.1.146 → 0.1.148

package/lib/module/renderer/components/Group.js

@@ -1,69 +1,5 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { ClipOp } from "../../skia/types";
-import { processCanvasTransform, processPaint, processClip } from "../processors";
-import { createDrawing, DrawingNode } from "../nodes";
-import { isDeclarationNode } from "../nodes/Declaration";
-
-const isSkPaint = obj => "__typename__" in obj && obj.__typename__ === "Paint";
-
-const onDraw = createDrawing((ctx, _ref, node) => {
-  let {
-    layer,
-    clip,
-    invertClip,
-    ...groupProps
-  } = _ref;
-  const {
-    canvas,
-    opacity,
-    Skia
-  } = ctx;
-  const declarations = node.children.filter(isDeclarationNode).map(child => child.draw(ctx));
-  const drawings = node.children.filter(child => child instanceof DrawingNode);
-  const paint = processPaint(ctx.Skia, ctx.paint.copy(), opacity, groupProps, declarations);
-  const hasTransform = !!groupProps.transform || !!groupProps.matrix;
-  const hasClip = !!clip;
-  const shouldSave = hasTransform || hasClip || !!layer;
-
-  if (shouldSave) {
-    if (layer) {
-      if (typeof layer === "boolean") {
-        canvas.saveLayer();
-      } else if (isSkPaint(layer)) {
-        canvas.saveLayer(layer);
-      } else {
-        var _layer$current;
-
-        canvas.saveLayer((_layer$current = layer.current) !== null && _layer$current !== void 0 ? _layer$current : undefined);
-      }
-    } else {
-      canvas.save();
-    }
-
-    processCanvasTransform(canvas, groupProps);
-
-    if (clip) {
-      const op = invertClip ? ClipOp.Difference : ClipOp.Intersect;
-      processClip(Skia, canvas, clip, op);
-    }
-  }
-
-  node.visit({ ...ctx,
-    paint,
-    opacity: groupProps.opacity ? groupProps.opacity * opacity : opacity
-  }, drawings);
-
-  if (shouldSave) {
-    canvas.restore();
-  }
-});
 export const Group = props => {
-  return /*#__PURE__*/React.createElement("skDrawing", _extends({
-    onDraw: onDraw
-  }, props, {
-    skipProcessing: true
-  }));
+  return /*#__PURE__*/React.createElement("skGroup", props);
 };
 //# sourceMappingURL=Group.js.map

package/lib/module/renderer/components/Group.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Group.tsx"],"names":["React","ClipOp","processCanvasTransform","processPaint","processClip","createDrawing","DrawingNode","isDeclarationNode","isSkPaint","obj","__typename__","onDraw","ctx","node","layer","clip","invertClip","groupProps","canvas","opacity","Skia","declarations","children","filter","map","child","draw","drawings","paint","copy","hasTransform","transform","matrix","hasClip","shouldSave","saveLayer","current","undefined","save","op","Difference","Intersect","visit","restore","Group","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAIA,SAASC,MAAT,QAAuB,kBAAvB;AACA,SACEC,sBADF,EAEEC,YAFF,EAGEC,WAHF,QAIO,eAJP;AAWA,SAASC,aAAT,EAAwBC,WAAxB,QAA2C,UAA3C;AACA,SAASC,iBAAT,QAAkC,sBAAlC;;AAEA,MAAMC,SAAS,GAAIC,GAAD,IAChB,kBAAkBA,GAAlB,IAAyBA,GAAG,CAACC,YAAJ,KAAqB,OADhD;;AASA,MAAMC,MAAM,GAAGN,aAAa,CAC1B,CAACO,GAAD,QAAkDC,IAAlD,KAA2D;AAAA,MAArD;AAAEC,IAAAA,KAAF;AAASC,IAAAA,IAAT;AAAeC,IAAAA,UAAf;AAA2B,OAAGC;AAA9B,GAAqD;AACzD,QAAM;AAAEC,IAAAA,MAAF;AAAUC,IAAAA,OAAV;AAAmBC,IAAAA;AAAnB,MAA4BR,GAAlC;AACA,QAAMS,YAAY,GAAGR,IAAI,CAACS,QAAL,CAClBC,MADkB,CACXhB,iBADW,EAElBiB,GAFkB,CAEbC,KAAD,IAAWA,KAAK,CAACC,IAAN,CAAWd,GAAX,CAFG,CAArB;AAIA,QAAMe,QAAQ,GAAGd,IAAI,CAACS,QAAL,CAAcC,MAAd,CACdE,KAAD,IAAWA,KAAK,YAAYnB,WADb,CAAjB;AAGA,QAAMsB,KAAK,GAAGzB,YAAY,CACxBS,GAAG,CAACQ,IADoB,EAExBR,GAAG,CAACgB,KAAJ,CAAUC,IAAV,EAFwB,EAGxBV,OAHwB,EAIxBF,UAJwB,EAKxBI,YALwB,CAA1B;AAOA,QAAMS,YAAY,GAAG,CAAC,CAACb,UAAU,CAACc,SAAb,IAA0B,CAAC,CAACd,UAAU,CAACe,MAA5D;AACA,QAAMC,OAAO,GAAG,CAAC,CAAClB,IAAlB;AACA,QAAMmB,UAAU,GAAGJ,YAAY,IAAIG,OAAhB,IAA2B,CAAC,CAACnB,KAAhD;;AACA,MAAIoB,UAAJ,EAAgB;AACd,QAAIpB,KAAJ,EAAW;AACT,UAAI,OAAOA,KAAP,KAAiB,SAArB,EAAgC;AAC9BI,QAAAA,MAAM,CAACiB,SAAP;AACD,OAFD,MAEO,IAAI3B,SAAS,CAACM,KAAD,CAAb,EAAsB;AAC3BI,QAAAA,MAAM,CAACiB,SAAP,CAAiBrB,KAAjB;AACD,OAFM,MAEA;AAAA;;AACLI,QAAAA,MAAM,CAACiB,SAAP,mBAAiBrB,KAAK,CAACsB,OAAvB,2DAAkCC,SAAlC;AACD;AACF,KARD,MAQO;AACLnB,MAAAA,MAAM,CAACoB,IAAP;AACD;;AACDpC,IAAAA,sBAAsB,CAACgB,MAAD,EAASD,UAAT,CAAtB;;AACA,QAAIF,IAAJ,EAAU;AACR,YAAMwB,EAAE,GAAGvB,UAAU,GAAGf,MAAM,CAACuC,UAAV,GAAuBvC,MAAM,CAACwC,SAAnD;AACArC,MAAAA,WAAW,CAACgB,IAAD,EAAOF,MAAP,EAAeH,IAAf,EAAqBwB,EAArB,CAAX;AACD;AACF;;AACD1B,EAAAA,IAAI,CAAC6B,KAAL,CACE,EACE,GAAG9B,GADL;AAEEgB,IAAAA,KAFF;AAGET,IAAAA,OAAO,EAAEF,UAAU,CAACE,OAAX,GAAqBF,UAAU,CAACE,OAAX,GAAqBA,OAA1C,GAAoDA;AAH/D,GADF,EAMEQ,QANF;;AAQA,MAAIO,UAAJ,EAAgB;AACdhB,IAAAA,MAAM,CAACyB,OAAP;AACD;AACF,CAjDyB,CAA5B;AAoDA,OAAO,MAAMC,KAAK,GAAIC,KAAD,IAAsC;AACzD,sBAAO;AAAW,IAAA,MAAM,EAAElC;AAAnB,KAA+BkC,KAA/B;AAAsC,IAAA,cAAc;AAApD,KAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\nimport type { RefObject } from \"react\";\n\nimport type { SkPaint } from \"../../skia/types\";\nimport { ClipOp } from \"../../skia/types\";\nimport {\n  processCanvasTransform,\n  processPaint,\n  processClip,\n} from \"../processors\";\nimport type {\n  CustomPaintProps,\n  TransformProps,\n  AnimatedProps,\n  ClipDef,\n} from \"../processors\";\nimport { createDrawing, DrawingNode } from \"../nodes\";\nimport { isDeclarationNode } from \"../nodes/Declaration\";\n\nconst isSkPaint = (obj: RefObject<SkPaint> | SkPaint): obj is SkPaint =>\n  \"__typename__\" in obj && obj.__typename__ === \"Paint\";\n\nexport interface GroupProps extends CustomPaintProps, TransformProps {\n  clip?: ClipDef;\n  invertClip?: boolean;\n  layer?: RefObject<SkPaint> | SkPaint | boolean;\n}\n\nconst onDraw = createDrawing<GroupProps>(\n  (ctx, { layer, clip, invertClip, ...groupProps }, node) => {\n    const { canvas, opacity, Skia } = ctx;\n    const declarations = node.children\n      .filter(isDeclarationNode)\n      .map((child) => child.draw(ctx));\n\n    const drawings = node.children.filter(\n      (child) => child instanceof DrawingNode\n    );\n    const paint = processPaint(\n      ctx.Skia,\n      ctx.paint.copy(),\n      opacity,\n      groupProps,\n      declarations\n    );\n    const hasTransform = !!groupProps.transform || !!groupProps.matrix;\n    const hasClip = !!clip;\n    const shouldSave = hasTransform || hasClip || !!layer;\n    if (shouldSave) {\n      if (layer) {\n        if (typeof layer === \"boolean\") {\n          canvas.saveLayer();\n        } else if (isSkPaint(layer)) {\n          canvas.saveLayer(layer);\n        } else {\n          canvas.saveLayer(layer.current ?? undefined);\n        }\n      } else {\n        canvas.save();\n      }\n      processCanvasTransform(canvas, groupProps);\n      if (clip) {\n        const op = invertClip ? ClipOp.Difference : ClipOp.Intersect;\n        processClip(Skia, canvas, clip, op);\n      }\n    }\n    node.visit(\n      {\n        ...ctx,\n        paint,\n        opacity: groupProps.opacity ? groupProps.opacity * opacity : opacity,\n      },\n      drawings\n    );\n    if (shouldSave) {\n      canvas.restore();\n    }\n  }\n);\n\nexport const Group = (props: AnimatedProps<GroupProps>) => {\n  return <skDrawing onDraw={onDraw} {...props} skipProcessing />;\n};\n"]}
+{"version":3,"sources":["Group.tsx"],"names":["React","Group","props"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,KAAK,GAAIC,KAAD,IAAkC;AACrD,sBAAO,+BAAaA,KAAb,CAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport type { SkiaProps } from \"../processors\";\nimport type { GroupProps } from \"../../dom/types\";\n\nexport const Group = (props: SkiaProps<GroupProps>) => {\n  return <skGroup {...props} />;\n};\n"]}

package/lib/module/renderer/components/Paint.js

@@ -1,19 +1,10 @@
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-import React, { useRef, useMemo, forwardRef, useImperativeHandle } from "react";
-import { processPaint } from "../processors";
-import { createDeclaration } from "../nodes";
-import { useCanvas } from "../useCanvas";
+import React, { useRef, forwardRef } from "react";
 export const usePaintRef = () => useRef(null);
 export const Paint = /*#__PURE__*/forwardRef((props, ref) => {
-  const {
-    Skia
-  } = useCanvas();
-  const paint = useMemo(() => Skia.Paint(), [Skia]);
-  useImperativeHandle(ref, () => paint, [paint]);
-  const onDeclare = useMemo(() => createDeclaration((paintProps, children, ctx) => processPaint(ctx.Skia, paint, ctx.opacity, paintProps, children)), [paint]);
-  return /*#__PURE__*/React.createElement("skDeclaration", _extends({
-    onDeclare: onDeclare
+  return /*#__PURE__*/React.createElement("skPaint", _extends({
+    ref: ref
   }, props));
 });
 //# sourceMappingURL=Paint.js.map

package/lib/module/renderer/components/Paint.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Paint.tsx"],"names":["React","useRef","useMemo","forwardRef","useImperativeHandle","processPaint","createDeclaration","useCanvas","usePaintRef","Paint","props","ref","Skia","paint","onDeclare","paintProps","children","ctx","opacity"],"mappings":";;AACA,OAAOA,KAAP,IAAgBC,MAAhB,EAAwBC,OAAxB,EAAiCC,UAAjC,EAA6CC,mBAA7C,QAAwE,OAAxE;AAIA,SAASC,YAAT,QAA6B,eAA7B;AACA,SAASC,iBAAT,QAAkC,UAAlC;AACA,SAASC,SAAT,QAA0B,cAA1B;AAEA,OAAO,MAAMC,WAAW,GAAG,MAAMP,MAAM,CAAU,IAAV,CAAhC;AAMP,OAAO,MAAMQ,KAAK,gBAAGN,UAAU,CAC7B,CAACO,KAAD,EAAQC,GAAR,KAAgB;AACd,QAAM;AAAEC,IAAAA;AAAF,MAAWL,SAAS,EAA1B;AACA,QAAMM,KAAK,GAAGX,OAAO,CAAC,MAAMU,IAAI,CAACH,KAAL,EAAP,EAAqB,CAACG,IAAD,CAArB,CAArB;AACAR,EAAAA,mBAAmB,CAACO,GAAD,EAAM,MAAME,KAAZ,EAAmB,CAACA,KAAD,CAAnB,CAAnB;AACA,QAAMC,SAAS,GAAGZ,OAAO,CACvB,MACEI,iBAAiB,CAAa,CAACS,UAAD,EAAaC,QAAb,EAAuBC,GAAvB,KAC5BZ,YAAY,CAACY,GAAG,CAACL,IAAL,EAAWC,KAAX,EAAkBI,GAAG,CAACC,OAAtB,EAA+BH,UAA/B,EAA2CC,QAA3C,CADG,CAFI,EAKvB,CAACH,KAAD,CALuB,CAAzB;AAOA,sBAAO;AAAe,IAAA,SAAS,EAAEC;AAA1B,KAAyCJ,KAAzC,EAAP;AACD,CAb4B,CAAxB","sourcesContent":["import type { ReactNode } from \"react\";\nimport React, { useRef, useMemo, forwardRef, useImperativeHandle } from \"react\";\n\nimport type { SkPaint } from \"../../skia/types\";\nimport type { CustomPaintProps, AnimatedProps } from \"../processors\";\nimport { processPaint } from \"../processors\";\nimport { createDeclaration } from \"../nodes\";\nimport { useCanvas } from \"../useCanvas\";\n\nexport const usePaintRef = () => useRef<SkPaint>(null);\n\nexport interface PaintProps extends Omit<CustomPaintProps, \"paint\"> {\n  children?: ReactNode | ReactNode[];\n}\n\nexport const Paint = forwardRef<SkPaint, AnimatedProps<PaintProps>>(\n  (props, ref) => {\n    const { Skia } = useCanvas();\n    const paint = useMemo(() => Skia.Paint(), [Skia]);\n    useImperativeHandle(ref, () => paint, [paint]);\n    const onDeclare = useMemo(\n      () =>\n        createDeclaration<PaintProps>((paintProps, children, ctx) =>\n          processPaint(ctx.Skia, paint, ctx.opacity, paintProps, children)\n        ),\n      [paint]\n    );\n    return <skDeclaration onDeclare={onDeclare} {...props} />;\n  }\n);\n"]}
+{"version":3,"sources":["Paint.tsx"],"names":["React","useRef","forwardRef","usePaintRef","Paint","props","ref"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,MAAhB,EAAwBC,UAAxB,QAA0C,OAA1C;AAMA,OAAO,MAAMC,WAAW,GAAG,MAAMF,MAAM,CAAY,IAAZ,CAAhC;AAEP,OAAO,MAAMG,KAAK,gBAAGF,UAAU,CAC7B,CAACG,KAAD,EAAQC,GAAR,KAAgB;AACd,sBAAO;AAAS,IAAA,GAAG,EAAEA;AAAd,KAAuBD,KAAvB,EAAP;AACD,CAH4B,CAAxB","sourcesContent":["import React, { useRef, forwardRef } from \"react\";\n\nimport type { SkiaProps } from \"../processors\";\nimport type { DrawingNodeProps } from \"../../dom/types\";\nimport type { PaintNode } from \"../../dom/nodes/PaintNode\";\n\nexport const usePaintRef = () => useRef<PaintNode>(null);\n\nexport const Paint = forwardRef<PaintNode, SkiaProps<DrawingNodeProps>>(\n  (props, ref) => {\n    return <skPaint ref={ref} {...props} />;\n  }\n);\n"]}

package/lib/module/renderer/components/Picture.js

@@ -1,21 +1,5 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { createDrawing } from "../nodes/Drawing";
-const onDraw = createDrawing((ctx, _ref) => {
-  let {
-    picture
-  } = _ref;
-  const {
-    canvas
-  } = ctx;
-  canvas.drawPicture(picture);
-});
 export const Picture = props => {
-  return /*#__PURE__*/React.createElement("skDrawing", _extends({
-    onDraw: onDraw
-  }, props, {
-    skipProcessing: true
-  }));
+  return /*#__PURE__*/React.createElement("skPicture", props);
 };
 //# sourceMappingURL=Picture.js.map

package/lib/module/renderer/components/Picture.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Picture.tsx"],"names":["React","createDrawing","onDraw","ctx","picture","canvas","drawPicture","Picture","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,SAASC,aAAT,QAA8B,kBAA9B;AAMA,MAAMC,MAAM,GAAGD,aAAa,CAAe,CAACE,GAAD,WAAsB;AAAA,MAAhB;AAAEC,IAAAA;AAAF,GAAgB;AAC/D,QAAM;AAAEC,IAAAA;AAAF,MAAaF,GAAnB;AACAE,EAAAA,MAAM,CAACC,WAAP,CAAmBF,OAAnB;AACD,CAH2B,CAA5B;AAKA,OAAO,MAAMG,OAAO,GAAIC,KAAD,IAAyB;AAC9C,sBAAO;AAAW,IAAA,MAAM,EAAEN;AAAnB,KAA+BM,KAA/B;AAAsC,IAAA,cAAc;AAApD,KAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport type { SkPicture } from \"../../skia/types\";\nimport { createDrawing } from \"../nodes/Drawing\";\n\nexport interface PictureProps {\n  picture: SkPicture;\n}\n\nconst onDraw = createDrawing<PictureProps>((ctx, { picture }) => {\n  const { canvas } = ctx;\n  canvas.drawPicture(picture);\n});\n\nexport const Picture = (props: PictureProps) => {\n  return <skDrawing onDraw={onDraw} {...props} skipProcessing />;\n};\n"]}
+{"version":3,"sources":["Picture.tsx"],"names":["React","Picture","props"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,OAAO,GAAIC,KAAD,IAAoC;AACzD,sBAAO,iCAAeA,KAAf,CAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport type { PictureProps } from \"../../dom/types\";\nimport type { SkiaProps } from \"../processors\";\n\nexport const Picture = (props: SkiaProps<PictureProps>) => {\n  return <skPicture {...props} />;\n};\n"]}

package/lib/module/renderer/components/backdrop/BackdropBlur.js.map

@@ -1 +1 @@
-{"version":3,"sources":["BackdropBlur.tsx"],"names":["React","Blur","BackdropFilter","BackdropBlur","blur","children","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,IAAT,QAAqB,iBAArB;AAIA,SAASC,cAAT,QAA+B,kBAA/B;AAMA,OAAO,MAAMC,YAAY,GAAG,QAIY;AAAA,MAJX;AAC3BC,IAAAA,IAD2B;AAE3BC,IAAAA,QAF2B;AAG3B,OAAGC;AAHwB,GAIW;AACtC,sBACE,oBAAC,cAAD;AAAgB,IAAA,MAAM,eAAE,oBAAC,IAAD;AAAM,MAAA,IAAI,EAAEF,IAAZ;AAAkB,MAAA,IAAI,EAAC;AAAvB;AAAxB,KAA+DE,KAA/D,GACGD,QADH,CADF;AAKD,CAVM","sourcesContent":["import React from \"react\";\n\nimport { Blur } from \"../imageFilters\";\nimport type { AnimatedProps, Radius } from \"../../processors\";\n\nimport type { BackdropFilterProps } from \"./BackdropFilter\";\nimport { BackdropFilter } from \"./BackdropFilter\";\n\ninterface BackdropBlurProps extends Omit<BackdropFilterProps, \"filter\"> {\n  blur: Radius;\n}\n\nexport const BackdropBlur = ({\n  blur,\n  children,\n  ...props\n}: AnimatedProps<BackdropBlurProps>) => {\n  return (\n    <BackdropFilter filter={<Blur blur={blur} mode=\"clamp\" />} {...props}>\n      {children}\n    </BackdropFilter>\n  );\n};\n"]}
+{"version":3,"sources":["BackdropBlur.tsx"],"names":["React","Blur","BackdropFilter","BackdropBlur","blur","children","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,IAAT,QAAqB,iBAArB;AAKA,SAASC,cAAT,QAA+B,kBAA/B;AAMA,OAAO,MAAMC,YAAY,GAAG,QAIY;AAAA,MAJX;AAC3BC,IAAAA,IAD2B;AAE3BC,IAAAA,QAF2B;AAG3B,OAAGC;AAHwB,GAIW;AACtC,sBACE,oBAAC,cAAD;AAAgB,IAAA,MAAM,eAAE,oBAAC,IAAD;AAAM,MAAA,IAAI,EAAEF,IAAZ;AAAkB,MAAA,IAAI,EAAC;AAAvB;AAAxB,KAA+DE,KAA/D,GACGD,QADH,CADF;AAKD,CAVM","sourcesContent":["import React from \"react\";\n\nimport { Blur } from \"../imageFilters\";\nimport type { AnimatedProps } from \"../../processors\";\nimport type { Radius } from \"../../../dom/types\";\n\nimport type { BackdropFilterProps } from \"./BackdropFilter\";\nimport { BackdropFilter } from \"./BackdropFilter\";\n\ninterface BackdropBlurProps extends Omit<BackdropFilterProps, \"filter\"> {\n  blur: Radius;\n}\n\nexport const BackdropBlur = ({\n  blur,\n  children,\n  ...props\n}: AnimatedProps<BackdropBlurProps>) => {\n  return (\n    <BackdropFilter filter={<Blur blur={blur} mode=\"clamp\" />} {...props}>\n      {children}\n    </BackdropFilter>\n  );\n};\n"]}

package/lib/module/renderer/components/backdrop/BackdropFilter.js

@@ -1,39 +1,11 @@
 import React from "react";
-import { createDrawing } from "../../nodes";
-import { getInput } from "../imageFilters/getInput";
 import { Group } from "../Group";
-
-const disableFilterMemoization = children => {
-  children.forEach(child => {
-    child.memoizable = false;
-    disableFilterMemoization(child.children);
-  });
-};
-
-const onDraw = createDrawing((ctx, _, node) => {
-  disableFilterMemoization(node.children);
-  const toFilter = node.visit(ctx);
-  const filter = getInput(ctx.Skia, toFilter);
-
-  if (!filter) {
-    throw new Error("No image filter provided to the background");
-  }
-
-  const {
-    canvas
-  } = ctx;
-  canvas.saveLayer(undefined, null, filter);
-  canvas.restore();
-});
 export const BackdropFilter = _ref => {
   let {
-    filter: filterChild,
+    filter,
     children: groupChildren,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement(Group, props, /*#__PURE__*/React.createElement("skDrawing", {
-    onDraw: onDraw,
-    skipProcessing: true
-  }, filterChild), groupChildren);
+  return /*#__PURE__*/React.createElement(Group, props, /*#__PURE__*/React.createElement("skBackdropFilter", null, filter), groupChildren);
 };
 //# sourceMappingURL=BackdropFilter.js.map

package/lib/module/renderer/components/backdrop/BackdropFilter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["BackdropFilter.tsx"],"names":["React","createDrawing","getInput","Group","disableFilterMemoization","children","forEach","child","memoizable","onDraw","ctx","_","node","toFilter","visit","filter","Skia","Error","canvas","saveLayer","undefined","restore","BackdropFilter","filterChild","groupChildren","props"],"mappings":"AACA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,SAASC,aAAT,QAA8B,aAA9B;AAEA,SAASC,QAAT,QAAyB,0BAAzB;AAEA,SAASC,KAAT,QAAsB,UAAtB;;AAEA,MAAMC,wBAAwB,GAAIC,QAAD,IAAsB;AACrDA,EAAAA,QAAQ,CAACC,OAAT,CAAkBC,KAAD,IAAW;AAC1BA,IAAAA,KAAK,CAACC,UAAN,GAAmB,KAAnB;AACAJ,IAAAA,wBAAwB,CAACG,KAAK,CAACF,QAAP,CAAxB;AACD,GAHD;AAID,CALD;;AAWA,MAAMI,MAAM,GAAGR,aAAa,CAAsB,CAACS,GAAD,EAAMC,CAAN,EAASC,IAAT,KAAkB;AAClER,EAAAA,wBAAwB,CAACQ,IAAI,CAACP,QAAN,CAAxB;AACA,QAAMQ,QAAQ,GAAGD,IAAI,CAACE,KAAL,CAAWJ,GAAX,CAAjB;AACA,QAAMK,MAAM,GAAGb,QAAQ,CAACQ,GAAG,CAACM,IAAL,EAAWH,QAAX,CAAvB;;AACA,MAAI,CAACE,MAAL,EAAa;AACX,UAAM,IAAIE,KAAJ,CAAU,4CAAV,CAAN;AACD;;AACD,QAAM;AAAEC,IAAAA;AAAF,MAAaR,GAAnB;AACAQ,EAAAA,MAAM,CAACC,SAAP,CAAiBC,SAAjB,EAA4B,IAA5B,EAAkCL,MAAlC;AACAG,EAAAA,MAAM,CAACG,OAAP;AACD,CAV2B,CAA5B;AAYA,OAAO,MAAMC,cAAc,GAAG,QAIY;AAAA,MAJX;AAC7BP,IAAAA,MAAM,EAAEQ,WADqB;AAE7BlB,IAAAA,QAAQ,EAAEmB,aAFmB;AAG7B,OAAGC;AAH0B,GAIW;AACxC,sBACE,oBAAC,KAAD,EAAWA,KAAX,eACE;AAAW,IAAA,MAAM,EAAEhB,MAAnB;AAA2B,IAAA,cAAc;AAAzC,KACGc,WADH,CADF,EAIGC,aAJH,CADF;AAQD,CAbM","sourcesContent":["import type { ReactNode } from \"react\";\nimport React from \"react\";\n\nimport type { AnimatedProps } from \"../../processors\";\nimport { createDrawing } from \"../../nodes\";\nimport type { Node } from \"../../nodes\";\nimport { getInput } from \"../imageFilters/getInput\";\nimport type { GroupProps } from \"../Group\";\nimport { Group } from \"../Group\";\n\nconst disableFilterMemoization = (children: Node[]) => {\n  children.forEach((child) => {\n    child.memoizable = false;\n    disableFilterMemoization(child.children);\n  });\n};\n\nexport interface BackdropFilterProps extends GroupProps {\n  filter: ReactNode | ReactNode[];\n}\n\nconst onDraw = createDrawing<BackdropFilterProps>((ctx, _, node) => {\n  disableFilterMemoization(node.children);\n  const toFilter = node.visit(ctx);\n  const filter = getInput(ctx.Skia, toFilter);\n  if (!filter) {\n    throw new Error(\"No image filter provided to the background\");\n  }\n  const { canvas } = ctx;\n  canvas.saveLayer(undefined, null, filter);\n  canvas.restore();\n});\n\nexport const BackdropFilter = ({\n  filter: filterChild,\n  children: groupChildren,\n  ...props\n}: AnimatedProps<BackdropFilterProps>) => {\n  return (\n    <Group {...props}>\n      <skDrawing onDraw={onDraw} skipProcessing>\n        {filterChild}\n      </skDrawing>\n      {groupChildren}\n    </Group>\n  );\n};\n"]}
+{"version":3,"sources":["BackdropFilter.tsx"],"names":["React","Group","BackdropFilter","filter","children","groupChildren","props"],"mappings":"AACA,OAAOA,KAAP,MAAkB,OAAlB;AAIA,SAASC,KAAT,QAAsB,UAAtB;AAMA,OAAO,MAAMC,cAAc,GAAG,QAIQ;AAAA,MAJP;AAC7BC,IAAAA,MAD6B;AAE7BC,IAAAA,QAAQ,EAAEC,aAFmB;AAG7B,OAAGC;AAH0B,GAIO;AACpC,sBACE,oBAAC,KAAD,EAAWA,KAAX,eACE,8CAAmBH,MAAnB,CADF,EAEGE,aAFH,CADF;AAMD,CAXM","sourcesContent":["import type { ReactNode } from \"react\";\nimport React from \"react\";\n\nimport type { GroupProps } from \"../../../dom/types\";\nimport type { SkiaProps } from \"../../processors/Animations/Animations\";\nimport { Group } from \"../Group\";\n\nexport interface BackdropFilterProps extends GroupProps {\n  filter: ReactNode | ReactNode[];\n}\n\nexport const BackdropFilter = ({\n  filter,\n  children: groupChildren,\n  ...props\n}: SkiaProps<BackdropFilterProps>) => {\n  return (\n    <Group {...props}>\n      <skBackdropFilter>{filter}</skBackdropFilter>\n      {groupChildren}\n    </Group>\n  );\n};\n"]}

package/lib/module/renderer/components/colorFilters/BlendColor.js

@@ -1,24 +1,5 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { BlendMode } from "../../../skia/types";
-import { createDeclaration } from "../../nodes";
-import { enumKey } from "../../processors";
-import { composeColorFilter } from "./Compose";
-const onDeclare = createDeclaration((_ref, children, _ref2) => {
-  let {
-    mode,
-    color
-  } = _ref;
-  let {
-    Skia
-  } = _ref2;
-  const cf = Skia.ColorFilter.MakeBlend(Skia.Color(color), BlendMode[enumKey(mode)]);
-  return composeColorFilter(Skia, cf, children);
-});
 export const BlendColor = props => {
-  return /*#__PURE__*/React.createElement("skDeclaration", _extends({
-    onDeclare: onDeclare
-  }, props));
+  return /*#__PURE__*/React.createElement("skBlendColorFilter", props);
 };
 //# sourceMappingURL=BlendColor.js.map

package/lib/module/renderer/components/colorFilters/BlendColor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["BlendColor.tsx"],"names":["React","BlendMode","createDeclaration","enumKey","composeColorFilter","onDeclare","children","mode","color","Skia","cf","ColorFilter","MakeBlend","Color","BlendColor","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAIA,SAASC,SAAT,QAA0B,qBAA1B;AACA,SAASC,iBAAT,QAAkC,aAAlC;AAEA,SAASC,OAAT,QAAwB,kBAAxB;AAEA,SAASC,kBAAT,QAAmC,WAAnC;AAQA,MAAMC,SAAS,GAAGH,iBAAiB,CACjC,OAAkBI,QAAlB,YAAyC;AAAA,MAAxC;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,GAAwC;AAAA,MAAb;AAAEC,IAAAA;AAAF,GAAa;AACvC,QAAMC,EAAE,GAAGD,IAAI,CAACE,WAAL,CAAiBC,SAAjB,CACTH,IAAI,CAACI,KAAL,CAAWL,KAAX,CADS,EAETP,SAAS,CAACE,OAAO,CAACI,IAAD,CAAR,CAFA,CAAX;AAIA,SAAOH,kBAAkB,CAACK,IAAD,EAAOC,EAAP,EAAWJ,QAAX,CAAzB;AACD,CAPgC,CAAnC;AAUA,OAAO,MAAMQ,UAAU,GAAIC,KAAD,IAA2C;AACnE,sBAAO;AAAe,IAAA,SAAS,EAAEV;AAA1B,KAAyCU,KAAzC,EAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\nimport type { ReactNode } from \"react\";\n\nimport type { Color } from \"../../../skia/types\";\nimport { BlendMode } from \"../../../skia/types\";\nimport { createDeclaration } from \"../../nodes\";\nimport type { SkEnum, AnimatedProps } from \"../../processors\";\nimport { enumKey } from \"../../processors\";\n\nimport { composeColorFilter } from \"./Compose\";\n\nexport interface BlendColorProps {\n  mode: SkEnum<typeof BlendMode>;\n  color: Color;\n  children?: ReactNode | ReactNode[];\n}\n\nconst onDeclare = createDeclaration<BlendColorProps>(\n  ({ mode, color }, children, { Skia }) => {\n    const cf = Skia.ColorFilter.MakeBlend(\n      Skia.Color(color),\n      BlendMode[enumKey(mode)]\n    );\n    return composeColorFilter(Skia, cf, children);\n  }\n);\n\nexport const BlendColor = (props: AnimatedProps<BlendColorProps>) => {\n  return <skDeclaration onDeclare={onDeclare} {...props} />;\n};\n"]}
+{"version":3,"sources":["BlendColor.tsx"],"names":["React","BlendColor","props"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,UAAU,GAAIC,KAAD,IAA6C;AACrE,sBAAO,0CAAwBA,KAAxB,CAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport type { SkiaProps } from \"../../processors\";\nimport type { BlendColorFilterProps } from \"../../../dom/types\";\n\nexport const BlendColor = (props: SkiaProps<BlendColorFilterProps>) => {\n  return <skBlendColorFilter {...props} />;\n};\n"]}

package/lib/module/renderer/components/colorFilters/Lerp.js

@@ -1,23 +1,5 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { isColorFilter } from "../../../skia/types";
-import { createDeclaration } from "../../nodes/Declaration";
-import { composeColorFilter } from "./Compose";
-const onDeclare = createDeclaration((_ref, children, _ref2) => {
-  let {
-    t
-  } = _ref;
-  let {
-    Skia
-  } = _ref2;
-  const [src, dst] = children.filter(isColorFilter);
-  const cf = Skia.ColorFilter.MakeLerp(t, src, dst);
-  return composeColorFilter(Skia, cf, children.filter(c => c !== src && c !== dst));
-});
 export const Lerp = props => {
-  return /*#__PURE__*/React.createElement("skDeclaration", _extends({
-    onDeclare: onDeclare
-  }, props));
+  return /*#__PURE__*/React.createElement("skLerpColorFilter", props);
 };
 //# sourceMappingURL=Lerp.js.map

package/lib/module/renderer/components/colorFilters/Lerp.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Lerp.tsx"],"names":["React","isColorFilter","createDeclaration","composeColorFilter","onDeclare","children","t","Skia","src","dst","filter","cf","ColorFilter","MakeLerp","c","Lerp","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,SAASC,aAAT,QAA8B,qBAA9B;AACA,SAASC,iBAAT,QAAkC,yBAAlC;AAGA,SAASC,kBAAT,QAAmC,WAAnC;AAOA,MAAMC,SAAS,GAAGF,iBAAiB,CAAY,OAAQG,QAAR,YAA+B;AAAA,MAA9B;AAAEC,IAAAA;AAAF,GAA8B;AAAA,MAAb;AAAEC,IAAAA;AAAF,GAAa;AAC5E,QAAM,CAACC,GAAD,EAAMC,GAAN,IAAaJ,QAAQ,CAACK,MAAT,CAAgBT,aAAhB,CAAnB;AACA,QAAMU,EAAE,GAAGJ,IAAI,CAACK,WAAL,CAAiBC,QAAjB,CAA0BP,CAA1B,EAA6BE,GAA7B,EAAkCC,GAAlC,CAAX;AACA,SAAON,kBAAkB,CACvBI,IADuB,EAEvBI,EAFuB,EAGvBN,QAAQ,CAACK,MAAT,CAAiBI,CAAD,IAAOA,CAAC,KAAKN,GAAN,IAAaM,CAAC,KAAKL,GAA1C,CAHuB,CAAzB;AAKD,CARkC,CAAnC;AAUA,OAAO,MAAMM,IAAI,GAAIC,KAAD,IAAqC;AACvD,sBAAO;AAAe,IAAA,SAAS,EAAEZ;AAA1B,KAAyCY,KAAzC,EAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\nimport type { ReactNode } from \"react\";\n\nimport { isColorFilter } from \"../../../skia/types\";\nimport { createDeclaration } from \"../../nodes/Declaration\";\nimport type { AnimatedProps } from \"../../processors/Animations/Animations\";\n\nimport { composeColorFilter } from \"./Compose\";\n\nexport interface LerpProps {\n  t: number;\n  children: ReactNode | ReactNode[];\n}\n\nconst onDeclare = createDeclaration<LerpProps>(({ t }, children, { Skia }) => {\n  const [src, dst] = children.filter(isColorFilter);\n  const cf = Skia.ColorFilter.MakeLerp(t, src, dst);\n  return composeColorFilter(\n    Skia,\n    cf,\n    children.filter((c) => c !== src && c !== dst)\n  );\n});\n\nexport const Lerp = (props: AnimatedProps<LerpProps>) => {\n  return <skDeclaration onDeclare={onDeclare} {...props} />;\n};\n"]}
+{"version":3,"sources":["Lerp.tsx"],"names":["React","Lerp","props"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,IAAI,GAAIC,KAAD,IAA4C;AAC9D,sBAAO,yCAAuBA,KAAvB,CAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport type { SkiaProps } from \"../../processors/Animations/Animations\";\nimport type { LerpColorFilterProps } from \"../../../dom/types\";\n\nexport const Lerp = (props: SkiaProps<LerpColorFilterProps>) => {\n  return <skLerpColorFilter {...props} />;\n};\n"]}

package/lib/module/renderer/components/colorFilters/LinearToSRGBGamma.js

@@ -1,19 +1,5 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { createDeclaration } from "../../nodes/Declaration";
-import { composeColorFilter } from "./Compose"; // eslint-disable-next-line @typescript-eslint/no-empty-interface
-
-const onDeclare = createDeclaration((_props, children, _ref) => {
-  let {
-    Skia
-  } = _ref;
-  const cf = Skia.ColorFilter.MakeLinearToSRGBGamma();
-  return composeColorFilter(Skia, cf, children);
-});
 export const LinearToSRGBGamma = props => {
-  return /*#__PURE__*/React.createElement("skDeclaration", _extends({
-    onDeclare: onDeclare
-  }, props));
+  return /*#__PURE__*/React.createElement("skLinearToSRGBGammaColorFilter", props);
 };
 //# sourceMappingURL=LinearToSRGBGamma.js.map

package/lib/module/renderer/components/colorFilters/LinearToSRGBGamma.js.map

@@ -1 +1 @@
-{"version":3,"sources":["LinearToSRGBGamma.tsx"],"names":["React","createDeclaration","composeColorFilter","onDeclare","_props","children","Skia","cf","ColorFilter","MakeLinearToSRGBGamma","LinearToSRGBGamma","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,iBAAT,QAAkC,yBAAlC;AAGA,SAASC,kBAAT,QAAmC,WAAnC,C,CAEA;;AAGA,MAAMC,SAAS,GAAGF,iBAAiB,CAAC,CAACG,MAAD,EAASC,QAAT,WAAgC;AAAA,MAAb;AAAEC,IAAAA;AAAF,GAAa;AAClE,QAAMC,EAAE,GAAGD,IAAI,CAACE,WAAL,CAAiBC,qBAAjB,EAAX;AACA,SAAOP,kBAAkB,CAACI,IAAD,EAAOC,EAAP,EAAWF,QAAX,CAAzB;AACD,CAHkC,CAAnC;AAKA,OAAO,MAAMK,iBAAiB,GAC5BC,KAD+B,IAE5B;AACH,sBAAO;AAAe,IAAA,SAAS,EAAER;AAA1B,KAAyCQ,KAAzC,EAAP;AACD,CAJM","sourcesContent":["import React from \"react\";\n\nimport { createDeclaration } from \"../../nodes/Declaration\";\nimport type { AnimatedProps } from \"../../processors/Animations/Animations\";\n\nimport { composeColorFilter } from \"./Compose\";\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface LinearToSRGBGammaProps {}\n\nconst onDeclare = createDeclaration((_props, children, { Skia }) => {\n  const cf = Skia.ColorFilter.MakeLinearToSRGBGamma();\n  return composeColorFilter(Skia, cf, children);\n});\n\nexport const LinearToSRGBGamma = (\n  props: AnimatedProps<LinearToSRGBGammaProps>\n) => {\n  return <skDeclaration onDeclare={onDeclare} {...props} />;\n};\n"]}
+{"version":3,"sources":["LinearToSRGBGamma.tsx"],"names":["React","LinearToSRGBGamma","props"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,iBAAiB,GAAIC,KAAD,IAAqC;AACpE,sBAAO,sDAAoCA,KAApC,CAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport type { ChildrenProps } from \"../../../dom/types\";\nimport type { SkiaProps } from \"../../processors\";\n\nexport const LinearToSRGBGamma = (props: SkiaProps<ChildrenProps>) => {\n  return <skLinearToSRGBGammaColorFilter {...props} />;\n};\n"]}

package/lib/module/renderer/components/colorFilters/LumaColorFilter.js

@@ -1,19 +1,5 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { createDeclaration } from "../../nodes/Declaration";
-import { composeColorFilter } from "./Compose"; // eslint-disable-next-line @typescript-eslint/no-empty-interface
-
-const onDeclare = createDeclaration((_props, children, _ref) => {
-  let {
-    Skia
-  } = _ref;
-  const cf = Skia.ColorFilter.MakeLumaColorFilter();
-  return composeColorFilter(Skia, cf, children);
-});
 export const LumaColorFilter = props => {
-  return /*#__PURE__*/React.createElement("skDeclaration", _extends({
-    onDeclare: onDeclare
-  }, props));
+  return /*#__PURE__*/React.createElement("skLumaColorFilter", props);
 };
 //# sourceMappingURL=LumaColorFilter.js.map

package/lib/module/renderer/components/colorFilters/LumaColorFilter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["LumaColorFilter.tsx"],"names":["React","createDeclaration","composeColorFilter","onDeclare","_props","children","Skia","cf","ColorFilter","MakeLumaColorFilter","LumaColorFilter","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,iBAAT,QAAkC,yBAAlC;AAGA,SAASC,kBAAT,QAAmC,WAAnC,C,CAEA;;AAGA,MAAMC,SAAS,GAAGF,iBAAiB,CAAC,CAACG,MAAD,EAASC,QAAT,WAAgC;AAAA,MAAb;AAAEC,IAAAA;AAAF,GAAa;AAClE,QAAMC,EAAE,GAAGD,IAAI,CAACE,WAAL,CAAiBC,mBAAjB,EAAX;AACA,SAAOP,kBAAkB,CAACI,IAAD,EAAOC,EAAP,EAAWF,QAAX,CAAzB;AACD,CAHkC,CAAnC;AAKA,OAAO,MAAMK,eAAe,GAAIC,KAAD,IAAgD;AAC7E,sBAAO;AAAe,IAAA,SAAS,EAAER;AAA1B,KAAyCQ,KAAzC,EAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport { createDeclaration } from \"../../nodes/Declaration\";\nimport type { AnimatedProps } from \"../../processors/Animations/Animations\";\n\nimport { composeColorFilter } from \"./Compose\";\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface LumaColorFilterProps {}\n\nconst onDeclare = createDeclaration((_props, children, { Skia }) => {\n  const cf = Skia.ColorFilter.MakeLumaColorFilter();\n  return composeColorFilter(Skia, cf, children);\n});\n\nexport const LumaColorFilter = (props: AnimatedProps<LumaColorFilterProps>) => {\n  return <skDeclaration onDeclare={onDeclare} {...props} />;\n};\n"]}
+{"version":3,"sources":["LumaColorFilter.tsx"],"names":["React","LumaColorFilter","props"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,eAAe,GAAIC,KAAD,IAAqC;AAClE,sBAAO,yCAAuBA,KAAvB,CAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport type { ChildrenProps } from \"../../../dom/types\";\nimport type { SkiaProps } from \"../../processors/Animations/Animations\";\n\nexport const LumaColorFilter = (props: SkiaProps<ChildrenProps>) => {\n  return <skLumaColorFilter {...props} />;\n};\n"]}

package/lib/module/renderer/components/colorFilters/Matrix.js

@@ -1,22 +1,6 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { createDeclaration } from "../../nodes";
-import { composeColorFilter } from "./Compose";
-const onDeclare = createDeclaration((_ref, children, _ref2) => {
-  let {
-    matrix
-  } = _ref;
-  let {
-    Skia
-  } = _ref2;
-  const cf = Skia.ColorFilter.MakeMatrix(matrix);
-  return composeColorFilter(Skia, cf, children);
-});
 export const ColorMatrix = props => {
-  return /*#__PURE__*/React.createElement("skDeclaration", _extends({
-    onDeclare: onDeclare
-  }, props));
+  return /*#__PURE__*/React.createElement("skMatrixColorFilter", props);
 };
 export const OpacityMatrix = opacity => [1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, opacity, 0];
 //# sourceMappingURL=Matrix.js.map

package/lib/module/renderer/components/colorFilters/Matrix.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Matrix.tsx"],"names":["React","createDeclaration","composeColorFilter","onDeclare","children","matrix","Skia","cf","ColorFilter","MakeMatrix","ColorMatrix","props","OpacityMatrix","opacity"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,SAASC,iBAAT,QAAkC,aAAlC;AAGA,SAASC,kBAAT,QAAmC,WAAnC;AAOA,MAAMC,SAAS,GAAGF,iBAAiB,CACjC,OAAaG,QAAb,YAAoC;AAAA,MAAnC;AAAEC,IAAAA;AAAF,GAAmC;AAAA,MAAb;AAAEC,IAAAA;AAAF,GAAa;AAClC,QAAMC,EAAE,GAAGD,IAAI,CAACE,WAAL,CAAiBC,UAAjB,CAA4BJ,MAA5B,CAAX;AACA,SAAOH,kBAAkB,CAACI,IAAD,EAAOC,EAAP,EAAWH,QAAX,CAAzB;AACD,CAJgC,CAAnC;AAOA,OAAO,MAAMM,WAAW,GAAIC,KAAD,IAA4C;AACrE,sBAAO;AAAe,IAAA,SAAS,EAAER;AAA1B,KAAyCQ,KAAzC,EAAP;AACD,CAFM;AAIP,OAAO,MAAMC,aAAa,GAAIC,OAAD,IAAqB,CAChD,CADgD,EAEhD,CAFgD,EAGhD,CAHgD,EAIhD,CAJgD,EAKhD,CALgD,EAMhD,CANgD,EAOhD,CAPgD,EAQhD,CARgD,EAShD,CATgD,EAUhD,CAVgD,EAWhD,CAXgD,EAYhD,CAZgD,EAahD,CAbgD,EAchD,CAdgD,EAehD,CAfgD,EAgBhD,CAhBgD,EAiBhD,CAjBgD,EAkBhD,CAlBgD,EAmBhDA,OAnBgD,EAoBhD,CApBgD,CAA3C","sourcesContent":["import React from \"react\";\nimport type { ReactNode } from \"react\";\n\nimport { createDeclaration } from \"../../nodes\";\nimport type { AnimatedProps } from \"../../processors\";\n\nimport { composeColorFilter } from \"./Compose\";\n\ninterface ColorMatrixProps {\n  matrix: number[];\n  children?: ReactNode | ReactNode[];\n}\n\nconst onDeclare = createDeclaration<ColorMatrixProps>(\n  ({ matrix }, children, { Skia }) => {\n    const cf = Skia.ColorFilter.MakeMatrix(matrix);\n    return composeColorFilter(Skia, cf, children);\n  }\n);\n\nexport const ColorMatrix = (props: AnimatedProps<ColorMatrixProps>) => {\n  return <skDeclaration onDeclare={onDeclare} {...props} />;\n};\n\nexport const OpacityMatrix = (opacity: number) => [\n  1,\n  0,\n  0,\n  0,\n  0,\n  0,\n  1,\n  0,\n  0,\n  0,\n  0,\n  0,\n  1,\n  0,\n  0,\n  0,\n  0,\n  0,\n  opacity,\n  0,\n];\n"]}
+{"version":3,"sources":["Matrix.tsx"],"names":["React","ColorMatrix","props","OpacityMatrix","opacity"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,WAAW,GAAIC,KAAD,IAA8C;AACvE,sBAAO,2CAAyBA,KAAzB,CAAP;AACD,CAFM;AAIP,OAAO,MAAMC,aAAa,GAAIC,OAAD,IAAqB,CAChD,CADgD,EAEhD,CAFgD,EAGhD,CAHgD,EAIhD,CAJgD,EAKhD,CALgD,EAMhD,CANgD,EAOhD,CAPgD,EAQhD,CARgD,EAShD,CATgD,EAUhD,CAVgD,EAWhD,CAXgD,EAYhD,CAZgD,EAahD,CAbgD,EAchD,CAdgD,EAehD,CAfgD,EAgBhD,CAhBgD,EAiBhD,CAjBgD,EAkBhD,CAlBgD,EAmBhDA,OAnBgD,EAoBhD,CApBgD,CAA3C","sourcesContent":["import React from \"react\";\n\nimport type { SkiaProps } from \"../../processors\";\nimport type { MatrixColorFilterProps } from \"../../../dom/types\";\n\nexport const ColorMatrix = (props: SkiaProps<MatrixColorFilterProps>) => {\n  return <skMatrixColorFilter {...props} />;\n};\n\nexport const OpacityMatrix = (opacity: number) => [\n  1,\n  0,\n  0,\n  0,\n  0,\n  0,\n  1,\n  0,\n  0,\n  0,\n  0,\n  0,\n  1,\n  0,\n  0,\n  0,\n  0,\n  0,\n  opacity,\n  0,\n];\n"]}

package/lib/module/renderer/components/colorFilters/SRGBToLinearGamma.js

@@ -1,19 +1,5 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { createDeclaration } from "../../nodes/Declaration";
-import { composeColorFilter } from "./Compose"; // eslint-disable-next-line @typescript-eslint/no-empty-interface
-
-const onDeclare = createDeclaration((_props, children, _ref) => {
-  let {
-    Skia
-  } = _ref;
-  const cf = Skia.ColorFilter.MakeSRGBToLinearGamma();
-  return composeColorFilter(Skia, cf, children);
-});
 export const SRGBToLinearGamma = props => {
-  return /*#__PURE__*/React.createElement("skDeclaration", _extends({
-    onDeclare: onDeclare
-  }, props));
+  return /*#__PURE__*/React.createElement("skSRGBToLinearGammaColorFilter", props);
 };
 //# sourceMappingURL=SRGBToLinearGamma.js.map

package/lib/module/renderer/components/colorFilters/SRGBToLinearGamma.js.map

@@ -1 +1 @@
-{"version":3,"sources":["SRGBToLinearGamma.tsx"],"names":["React","createDeclaration","composeColorFilter","onDeclare","_props","children","Skia","cf","ColorFilter","MakeSRGBToLinearGamma","SRGBToLinearGamma","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,iBAAT,QAAkC,yBAAlC;AAGA,SAASC,kBAAT,QAAmC,WAAnC,C,CAEA;;AAGA,MAAMC,SAAS,GAAGF,iBAAiB,CAAC,CAACG,MAAD,EAASC,QAAT,WAAgC;AAAA,MAAb;AAAEC,IAAAA;AAAF,GAAa;AAClE,QAAMC,EAAE,GAAGD,IAAI,CAACE,WAAL,CAAiBC,qBAAjB,EAAX;AACA,SAAOP,kBAAkB,CAACI,IAAD,EAAOC,EAAP,EAAWF,QAAX,CAAzB;AACD,CAHkC,CAAnC;AAKA,OAAO,MAAMK,iBAAiB,GAC5BC,KAD+B,IAE5B;AACH,sBAAO;AAAe,IAAA,SAAS,EAAER;AAA1B,KAAyCQ,KAAzC,EAAP;AACD,CAJM","sourcesContent":["import React from \"react\";\n\nimport { createDeclaration } from \"../../nodes/Declaration\";\nimport type { AnimatedProps } from \"../../processors/Animations/Animations\";\n\nimport { composeColorFilter } from \"./Compose\";\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface SRGBToLinearGammaProps {}\n\nconst onDeclare = createDeclaration((_props, children, { Skia }) => {\n  const cf = Skia.ColorFilter.MakeSRGBToLinearGamma();\n  return composeColorFilter(Skia, cf, children);\n});\n\nexport const SRGBToLinearGamma = (\n  props: AnimatedProps<SRGBToLinearGammaProps>\n) => {\n  return <skDeclaration onDeclare={onDeclare} {...props} />;\n};\n"]}
+{"version":3,"sources":["SRGBToLinearGamma.tsx"],"names":["React","SRGBToLinearGamma","props"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,iBAAiB,GAAIC,KAAD,IAAqC;AACpE,sBAAO,sDAAoCA,KAApC,CAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport type { ChildrenProps } from \"../../../dom/types\";\nimport type { SkiaProps } from \"../../processors/Animations/Animations\";\n\nexport const SRGBToLinearGamma = (props: SkiaProps<ChildrenProps>) => {\n  return <skSRGBToLinearGammaColorFilter {...props} />;\n};\n"]}

package/lib/module/renderer/components/image/Image.js

@@ -1,36 +1,6 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { createDrawing } from "../../nodes/Drawing";
-import { processRect } from "../../processors";
-import { fitRects } from "./BoxFit";
-const onDraw = createDrawing((_ref, _ref2) => {
-  let {
-    canvas,
-    paint,
-    Skia
-  } = _ref;
-  let {
-    fit,
-    image,
-    ...rectProps
-  } = _ref2;
-  const rect = processRect(Skia, rectProps);
-  const {
-    src,
-    dst
-  } = fitRects(fit, {
-    x: 0,
-    y: 0,
-    width: image.width(),
-    height: image.height()
-  }, rect);
-  canvas.drawImageRect(image, src, dst, paint);
-});
 export const Image = props => {
-  return /*#__PURE__*/React.createElement("skDrawing", _extends({
-    onDraw: onDraw
-  }, props));
+  return /*#__PURE__*/React.createElement("skImage", props);
 };
 Image.defaultProps = {
   x: 0,

package/lib/module/renderer/components/image/Image.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Image.tsx"],"names":["React","createDrawing","processRect","fitRects","onDraw","canvas","paint","Skia","fit","image","rectProps","rect","src","dst","x","y","width","height","drawImageRect","Image","props","defaultProps"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAQA,SAASC,aAAT,QAA8B,qBAA9B;AACA,SAASC,WAAT,QAA4B,kBAA5B;AAGA,SAASC,QAAT,QAAyB,UAAzB;AAaA,MAAMC,MAAM,GAAGH,aAAa,CAC1B,iBAA2D;AAAA,MAA1D;AAAEI,IAAAA,MAAF;AAAUC,IAAAA,KAAV;AAAiBC,IAAAA;AAAjB,GAA0D;AAAA,MAAjC;AAAEC,IAAAA,GAAF;AAAOC,IAAAA,KAAP;AAAc,OAAGC;AAAjB,GAAiC;AACzD,QAAMC,IAAI,GAAGT,WAAW,CAACK,IAAD,EAAOG,SAAP,CAAxB;AACA,QAAM;AAAEE,IAAAA,GAAF;AAAOC,IAAAA;AAAP,MAAeV,QAAQ,CAC3BK,GAD2B,EAE3B;AACEM,IAAAA,CAAC,EAAE,CADL;AAEEC,IAAAA,CAAC,EAAE,CAFL;AAGEC,IAAAA,KAAK,EAAEP,KAAK,CAACO,KAAN,EAHT;AAIEC,IAAAA,MAAM,EAAER,KAAK,CAACQ,MAAN;AAJV,GAF2B,EAQ3BN,IAR2B,CAA7B;AAUAN,EAAAA,MAAM,CAACa,aAAP,CAAqBT,KAArB,EAA4BG,GAA5B,EAAiCC,GAAjC,EAAsCP,KAAtC;AACD,CAdyB,CAA5B;AAgBA,OAAO,MAAMa,KAAK,GAAIC,KAAD,IAAsC;AACzD,sBAAO;AAAW,IAAA,MAAM,EAAEhB;AAAnB,KAA+BgB,KAA/B,EAAP;AACD,CAFM;AAIPD,KAAK,CAACE,YAAN,GAAqB;AACnBP,EAAAA,CAAC,EAAE,CADgB;AAEnBC,EAAAA,CAAC,EAAE,CAFgB;AAGnBP,EAAAA,GAAG,EAAE;AAHc,CAArB","sourcesContent":["import React from \"react\";\n\nimport type { SkImage } from \"../../../skia/types\";\nimport type {\n  CustomPaintProps,\n  RectDef,\n  AnimatedProps,\n} from \"../../processors\";\nimport { createDrawing } from \"../../nodes/Drawing\";\nimport { processRect } from \"../../processors\";\n\nimport type { Fit } from \"./BoxFit\";\nimport { fitRects } from \"./BoxFit\";\n\nexport type SourceImageProps = {\n  image: SkImage;\n};\n\nexport type BaseImageProps = RectDef &\n  SourceImageProps & {\n    fit: Fit;\n  };\n\nexport type ImageProps = CustomPaintProps & BaseImageProps;\n\nconst onDraw = createDrawing<ImageProps>(\n  ({ canvas, paint, Skia }, { fit, image, ...rectProps }) => {\n    const rect = processRect(Skia, rectProps);\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    canvas.drawImageRect(image, src, dst, paint);\n  }\n);\nexport const Image = (props: AnimatedProps<ImageProps>) => {\n  return <skDrawing onDraw={onDraw} {...props} />;\n};\n\nImage.defaultProps = {\n  x: 0,\n  y: 0,\n  fit: \"contain\",\n};\n"]}
+{"version":3,"sources":["Image.tsx"],"names":["React","Image","props","defaultProps","x","y","fit"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,KAAK,GAAIC,KAAD,IAAkC;AACrD,sBAAO,+BAAaA,KAAb,CAAP;AACD,CAFM;AAIPD,KAAK,CAACE,YAAN,GAAqB;AACnBC,EAAAA,CAAC,EAAE,CADgB;AAEnBC,EAAAA,CAAC,EAAE,CAFgB;AAGnBC,EAAAA,GAAG,EAAE;AAHc,CAArB","sourcesContent":["import React from \"react\";\n\nimport type { SkiaProps } from \"../../processors\";\nimport type { ImageProps } from \"../../../dom/types\";\n\nexport const Image = (props: SkiaProps<ImageProps>) => {\n  return <skImage {...props} />;\n};\n\nImage.defaultProps = {\n  x: 0,\n  y: 0,\n  fit: \"contain\",\n};\n"]}

package/lib/module/renderer/components/image/ImageSVG.js

@@ -1,31 +1,5 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { createDrawing } from "../../nodes";
-import { processRect } from "../../processors";
-const onDraw = createDrawing((_ref, _ref2) => {
-  let {
-    canvas,
-    Skia
-  } = _ref;
-  let {
-    svg,
-    ...rectProps
-  } = _ref2;
-  const {
-    x,
-    y,
-    width,
-    height
-  } = processRect(Skia, rectProps);
-  canvas.save();
-  canvas.translate(x, y);
-  canvas.drawSvg(svg, width, height);
-  canvas.restore();
-});
 export const ImageSVG = props => {
-  return /*#__PURE__*/React.createElement("skDrawing", _extends({
-    onDraw: onDraw
-  }, props));
+  return /*#__PURE__*/React.createElement("skImageSVG", props);
 };
 //# sourceMappingURL=ImageSVG.js.map

package/lib/module/renderer/components/image/ImageSVG.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageSVG.tsx"],"names":["React","createDrawing","processRect","onDraw","canvas","Skia","svg","rectProps","x","y","width","height","save","translate","drawSvg","restore","ImageSVG","props"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,SAASC,aAAT,QAA8B,aAA9B;AAEA,SAASC,WAAT,QAA4B,kBAA5B;AAMA,MAAMC,MAAM,GAAGF,aAAa,CAC1B,iBAA6C;AAAA,MAA5C;AAAEG,IAAAA,MAAF;AAAUC,IAAAA;AAAV,GAA4C;AAAA,MAA1B;AAAEC,IAAAA,GAAF;AAAO,OAAGC;AAAV,GAA0B;AAC3C,QAAM;AAAEC,IAAAA,CAAF;AAAKC,IAAAA,CAAL;AAAQC,IAAAA,KAAR;AAAeC,IAAAA;AAAf,MAA0BT,WAAW,CAACG,IAAD,EAAOE,SAAP,CAA3C;AACAH,EAAAA,MAAM,CAACQ,IAAP;AACAR,EAAAA,MAAM,CAACS,SAAP,CAAiBL,CAAjB,EAAoBC,CAApB;AACAL,EAAAA,MAAM,CAACU,OAAP,CAAeR,GAAf,EAAoBI,KAApB,EAA2BC,MAA3B;AACAP,EAAAA,MAAM,CAACW,OAAP;AACD,CAPyB,CAA5B;AAUA,OAAO,MAAMC,QAAQ,GAAIC,KAAD,IAAyC;AAC/D,sBAAO;AAAW,IAAA,MAAM,EAAEd;AAAnB,KAA+Bc,KAA/B,EAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport type { SkSVG } from \"../../../skia/types\";\nimport { createDrawing } from \"../../nodes\";\nimport type { AnimatedProps, RectDef } from \"../../processors\";\nimport { processRect } from \"../../processors\";\n\nexport type ImageSVGProps = RectDef & {\n  svg: SkSVG;\n};\n\nconst onDraw = createDrawing<ImageSVGProps>(\n  ({ canvas, Skia }, { svg, ...rectProps }) => {\n    const { x, y, width, height } = processRect(Skia, rectProps);\n    canvas.save();\n    canvas.translate(x, y);\n    canvas.drawSvg(svg, width, height);\n    canvas.restore();\n  }\n);\n\nexport const ImageSVG = (props: AnimatedProps<ImageSVGProps>) => {\n  return <skDrawing onDraw={onDraw} {...props} />;\n};\n"]}
+{"version":3,"sources":["ImageSVG.tsx"],"names":["React","ImageSVG","props"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,QAAQ,GAAIC,KAAD,IAAyC;AAC/D,sBAAO,kCAAgBA,KAAhB,CAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\n\nimport type { ImageSVGProps } from \"../../../dom/types\";\nimport type { AnimatedProps } from \"../../processors\";\n\nexport const ImageSVG = (props: AnimatedProps<ImageSVGProps>) => {\n  return <skImageSVG {...props} />;\n};\n"]}

package/lib/module/renderer/components/image/ImageShader.js

@@ -1,62 +1,6 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from "react";
-import { TileMode, FilterMode, MipmapMode } from "../../../skia/types";
-import { createDeclaration } from "../../nodes";
-import { localMatrix, enumKey } from "../../processors";
-import { rect2rect, fitRects } from "./BoxFit";
-
-const getRect = (Skia, props) => {
-  const {
-    x,
-    y,
-    width,
-    height
-  } = props;
-
-  if (props.rect) {
-    return props.rect;
-  } else if (x !== undefined && y !== undefined && width !== undefined && height !== undefined) {
-    return Skia.XYWHRect(x, y, width, height);
-  } else {
-    return undefined;
-  }
-};
-
-const onDeclare = createDeclaration((_ref, _, _ref2) => {
-  let {
-    tx,
-    ty,
-    fm,
-    mm,
-    fit,
-    image,
-    ...imageShaderProps
-  } = _ref;
-  let {
-    Skia
-  } = _ref2;
-  const rct = getRect(Skia, imageShaderProps);
-
-  if (rct) {
-    var _imageShaderProps$tra;
-
-    const rects = fitRects(fit, {
-      x: 0,
-      y: 0,
-      width: image.width(),
-      height: image.height()
-    }, rct);
-    const m3 = rect2rect(rects.src, rects.dst);
-    imageShaderProps.transform = [...((_imageShaderProps$tra = imageShaderProps.transform) !== null && _imageShaderProps$tra !== void 0 ? _imageShaderProps$tra : []), ...m3];
-  }
-
-  return image.makeShaderOptions(TileMode[enumKey(tx)], TileMode[enumKey(ty)], FilterMode[enumKey(fm)], MipmapMode[enumKey(mm)], localMatrix(Skia.Matrix(), imageShaderProps));
-});
 export const ImageShader = props => {
-  return /*#__PURE__*/React.createElement("skDeclaration", _extends({
-    onDeclare: onDeclare
-  }, props));
+  return /*#__PURE__*/React.createElement("skImageShader", props);
 };
 ImageShader.defaultProps = {
   tx: "decal",

package/lib/module/renderer/components/image/ImageShader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageShader.tsx"],"names":["React","TileMode","FilterMode","MipmapMode","createDeclaration","localMatrix","enumKey","rect2rect","fitRects","getRect","Skia","props","x","y","width","height","rect","undefined","XYWHRect","onDeclare","_","tx","ty","fm","mm","fit","image","imageShaderProps","rct","rects","m3","src","dst","transform","makeShaderOptions","Matrix","ImageShader","defaultProps"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,SAASC,QAAT,EAAmBC,UAAnB,EAA+BC,UAA/B,QAAiD,qBAAjD;AACA,SAASC,iBAAT,QAAkC,aAAlC;AAOA,SAASC,WAAT,EAAsBC,OAAtB,QAAqC,kBAArC;AAGA,SAASC,SAAT,EAAoBC,QAApB,QAAoC,UAApC;;AAEA,MAAMC,OAAO,GAAG,CACdC,IADc,EAEdC,KAFc,KAGS;AACvB,QAAM;AAAEC,IAAAA,CAAF;AAAKC,IAAAA,CAAL;AAAQC,IAAAA,KAAR;AAAeC,IAAAA;AAAf,MAA0BJ,KAAhC;;AACA,MAAIA,KAAK,CAACK,IAAV,EAAgB;AACd,WAAOL,KAAK,CAACK,IAAb;AACD,GAFD,MAEO,IACLJ,CAAC,KAAKK,SAAN,IACAJ,CAAC,KAAKI,SADN,IAEAH,KAAK,KAAKG,SAFV,IAGAF,MAAM,KAAKE,SAJN,EAKL;AACA,WAAOP,IAAI,CAACQ,QAAL,CAAcN,CAAd,EAAiBC,CAAjB,EAAoBC,KAApB,EAA2BC,MAA3B,CAAP;AACD,GAPM,MAOA;AACL,WAAOE,SAAP;AACD;AACF,CAjBD;;AA6BA,MAAME,SAAS,GAAGf,iBAAiB,CACjC,OAAsDgB,CAAtD,YAAsE;AAAA,MAArE;AAAEC,IAAAA,EAAF;AAAMC,IAAAA,EAAN;AAAUC,IAAAA,EAAV;AAAcC,IAAAA,EAAd;AAAkBC,IAAAA,GAAlB;AAAuBC,IAAAA,KAAvB;AAA8B,OAAGC;AAAjC,GAAqE;AAAA,MAAb;AAAEjB,IAAAA;AAAF,GAAa;AACpE,QAAMkB,GAAG,GAAGnB,OAAO,CAACC,IAAD,EAAOiB,gBAAP,CAAnB;;AACA,MAAIC,GAAJ,EAAS;AAAA;;AACP,UAAMC,KAAK,GAAGrB,QAAQ,CACpBiB,GADoB,EAEpB;AAAEb,MAAAA,CAAC,EAAE,CAAL;AAAQC,MAAAA,CAAC,EAAE,CAAX;AAAcC,MAAAA,KAAK,EAAEY,KAAK,CAACZ,KAAN,EAArB;AAAoCC,MAAAA,MAAM,EAAEW,KAAK,CAACX,MAAN;AAA5C,KAFoB,EAGpBa,GAHoB,CAAtB;AAKA,UAAME,EAAE,GAAGvB,SAAS,CAACsB,KAAK,CAACE,GAAP,EAAYF,KAAK,CAACG,GAAlB,CAApB;AACAL,IAAAA,gBAAgB,CAACM,SAAjB,GAA6B,CAC3B,6BAAIN,gBAAgB,CAACM,SAArB,yEAAkC,EAAlC,CAD2B,EAE3B,GAAGH,EAFwB,CAA7B;AAID;;AACD,SAAOJ,KAAK,CAACQ,iBAAN,CACLjC,QAAQ,CAACK,OAAO,CAACe,EAAD,CAAR,CADH,EAELpB,QAAQ,CAACK,OAAO,CAACgB,EAAD,CAAR,CAFH,EAGLpB,UAAU,CAACI,OAAO,CAACiB,EAAD,CAAR,CAHL,EAILpB,UAAU,CAACG,OAAO,CAACkB,EAAD,CAAR,CAJL,EAKLnB,WAAW,CAACK,IAAI,CAACyB,MAAL,EAAD,EAAgBR,gBAAhB,CALN,CAAP;AAOD,CAtBgC,CAAnC;AAyBA,OAAO,MAAMS,WAAW,GAAIzB,KAAD,IAA4C;AACrE,sBAAO;AAAe,IAAA,SAAS,EAAEQ;AAA1B,KAAyCR,KAAzC,EAAP;AACD,CAFM;AAIPyB,WAAW,CAACC,YAAZ,GAA2B;AACzBhB,EAAAA,EAAE,EAAE,OADqB;AAEzBC,EAAAA,EAAE,EAAE,OAFqB;AAGzBC,EAAAA,EAAE,EAAE,SAHqB;AAIzBC,EAAAA,EAAE,EAAE,MAJqB;AAKzBC,EAAAA,GAAG,EAAE,MALoB;AAMzBQ,EAAAA,SAAS,EAAE;AANc,CAA3B","sourcesContent":["import React from \"react\";\n\nimport type { SkRect, SkImage, Skia } from \"../../../skia/types\";\nimport { TileMode, FilterMode, MipmapMode } from \"../../../skia/types\";\nimport { createDeclaration } from \"../../nodes\";\nimport type {\n  TransformProps,\n  SkEnum,\n  AnimatedProps,\n  RectCtor,\n} from \"../../processors\";\nimport { localMatrix, enumKey } from \"../../processors\";\n\nimport type { Fit } from \"./BoxFit\";\nimport { rect2rect, fitRects } from \"./BoxFit\";\n\nconst getRect = (\n  Skia: Skia,\n  props: Omit<ImageShaderProps, \"tx\" | \"ty\" | \"fm\" | \"mm\" | \"fit\" | \"image\">\n): SkRect | undefined => {\n  const { x, y, width, height } = props;\n  if (props.rect) {\n    return props.rect;\n  } else if (\n    x !== undefined &&\n    y !== undefined &&\n    width !== undefined &&\n    height !== undefined\n  ) {\n    return Skia.XYWHRect(x, y, width, height);\n  } else {\n    return undefined;\n  }\n};\n\ninterface ImageShaderProps extends TransformProps, Partial<RectCtor> {\n  tx: SkEnum<typeof TileMode>;\n  ty: SkEnum<typeof TileMode>;\n  fm: SkEnum<typeof FilterMode>;\n  mm: SkEnum<typeof MipmapMode>;\n  fit: Fit;\n  rect?: SkRect;\n  image: SkImage;\n}\n\nconst onDeclare = createDeclaration<ImageShaderProps>(\n  ({ tx, ty, fm, mm, fit, image, ...imageShaderProps }, _, { Skia }) => {\n    const rct = getRect(Skia, imageShaderProps);\n    if (rct) {\n      const rects = fitRects(\n        fit,\n        { x: 0, y: 0, width: image.width(), height: image.height() },\n        rct\n      );\n      const m3 = rect2rect(rects.src, rects.dst);\n      imageShaderProps.transform = [\n        ...(imageShaderProps.transform ?? []),\n        ...m3,\n      ];\n    }\n    return image.makeShaderOptions(\n      TileMode[enumKey(tx)],\n      TileMode[enumKey(ty)],\n      FilterMode[enumKey(fm)],\n      MipmapMode[enumKey(mm)],\n      localMatrix(Skia.Matrix(), imageShaderProps)\n    );\n  }\n);\n\nexport const ImageShader = (props: AnimatedProps<ImageShaderProps>) => {\n  return <skDeclaration onDeclare={onDeclare} {...props} />;\n};\n\nImageShader.defaultProps = {\n  tx: \"decal\",\n  ty: \"decal\",\n  fm: \"nearest\",\n  mm: \"none\",\n  fit: \"none\",\n  transform: [],\n} as const;\n"]}
+{"version":3,"sources":["ImageShader.tsx"],"names":["React","ImageShader","props","defaultProps","tx","ty","fm","mm","fit","transform"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,OAAO,MAAMC,WAAW,GAAIC,KAAD,IAAwC;AACjE,sBAAO,qCAAmBA,KAAnB,CAAP;AACD,CAFM;AAIPD,WAAW,CAACE,YAAZ,GAA2B;AACzBC,EAAAA,EAAE,EAAE,OADqB;AAEzBC,EAAAA,EAAE,EAAE,OAFqB;AAGzBC,EAAAA,EAAE,EAAE,SAHqB;AAIzBC,EAAAA,EAAE,EAAE,MAJqB;AAKzBC,EAAAA,GAAG,EAAE,MALoB;AAMzBC,EAAAA,SAAS,EAAE;AANc,CAA3B","sourcesContent":["import React from \"react\";\n\nimport type { ImageShaderProps } from \"../../../dom/types\";\nimport type { SkiaProps } from \"../../processors\";\n\nexport const ImageShader = (props: SkiaProps<ImageShaderProps>) => {\n  return <skImageShader {...props} />;\n};\n\nImageShader.defaultProps = {\n  tx: \"decal\",\n  ty: \"decal\",\n  fm: \"nearest\",\n  mm: \"none\",\n  fit: \"none\",\n  transform: [],\n} as const;\n"]}

package/lib/module/renderer/components/image/index.js

@@ -1,5 +1,4 @@
 export * from "./Image";
 export * from "./ImageShader";
 export * from "./ImageSVG";
-export * from "./BoxFit";
 //# sourceMappingURL=index.js.map

package/lib/module/renderer/components/image/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAd;AACA,cAAc,eAAd;AACA,cAAc,YAAd;AACA,cAAc,UAAd","sourcesContent":["export * from \"./Image\";\nexport * from \"./ImageShader\";\nexport * from \"./ImageSVG\";\nexport * from \"./BoxFit\";\n"]}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAd;AACA,cAAc,eAAd;AACA,cAAc,YAAd","sourcesContent":["export * from \"./Image\";\nexport * from \"./ImageShader\";\nexport * from \"./ImageSVG\";\n"]}