@shopify/react-native-skia 0.1.146 → 0.1.148

package/src/renderer/components/text/Glyphs.tsx

@@ -1,45 +1,10 @@
 import React from "react";
 
-import type { CustomPaintProps, AnimatedProps } from "../../processors";
-import { createDrawing } from "../../nodes/Drawing";
-import type { SkPoint } from "../../../skia/types";
-import type { FontDef } from "../../processors/Font";
+import type { GlyphsProps } from "../../../dom/types";
+import type { SkiaProps } from "../../processors/Animations/Animations";
 
-export interface Glyph {
-  id: number;
-  pos: SkPoint;
-}
-
-export type GlyphsProps = CustomPaintProps &
-  FontDef & {
-    x: number;
-    y: number;
-    glyphs: Glyph[];
-  };
-
-interface ProcessedGlyphs {
-  glyphs: number[];
-  positions: SkPoint[];
-}
-
-const onDraw = createDrawing<GlyphsProps>(
-  ({ canvas, paint }, { glyphs: rawGlyphs, x, y, ...fontDef }) => {
-    const { font } = fontDef;
-    const { glyphs, positions } = rawGlyphs.reduce<ProcessedGlyphs>(
-      (acc, glyph) => {
-        const { id, pos } = glyph;
-        acc.glyphs.push(id);
-        acc.positions.push(pos);
-        return acc;
-      },
-      { glyphs: [], positions: [] }
-    );
-    canvas.drawGlyphs(glyphs, positions, x, y, font, paint);
-  }
-);
-
-export const Glyphs = (props: AnimatedProps<GlyphsProps>) => {
-  return <skDrawing onDraw={onDraw} {...props} />;
+export const Glyphs = (props: SkiaProps<GlyphsProps>) => {
+  return <skGlyphs {...props} />;
 };
 
 Glyphs.defaultProps = {

package/src/renderer/components/text/Text.tsx

@@ -1,28 +1,10 @@
 import React from "react";
 
-import type {
-  CustomPaintProps,
-  AnimatedProps,
-  FontDef,
-} from "../../processors";
-import { createDrawing } from "../../nodes/Drawing";
+import type { SkiaProps } from "../../processors";
+import type { TextProps } from "../../../dom/types";
 
-type TextProps = CustomPaintProps &
-  FontDef & {
-    text: string;
-    x: number;
-    y: number;
-  };
-
-const onDraw = createDrawing<TextProps>(
-  ({ canvas, paint }, { text, x, y, ...fontDef }) => {
-    const { font } = fontDef;
-    canvas.drawText(text, x, y, paint, font);
-  }
-);
-
-export const Text = (props: AnimatedProps<TextProps>) => {
-  return <skDrawing onDraw={onDraw} {...props} />;
+export const Text = (props: SkiaProps<TextProps>) => {
+  return <skText {...props} />;
 };
 
 Text.defaultProps = {

package/src/renderer/components/text/TextBlob.tsx

@@ -1,23 +1,10 @@
 import React from "react";
 
-import type { CustomPaintProps, AnimatedProps } from "../../processors";
-import { createDrawing } from "../../nodes/Drawing";
-import type { SkTextBlob } from "../../../skia/types";
+import type { SkiaProps } from "../../processors";
+import type { TextBlobProps } from "../../../dom/types";
 
-export interface TextBlobProps extends CustomPaintProps {
-  blob: SkTextBlob;
-  x: number;
-  y: number;
-}
-
-const onDraw = createDrawing<TextBlobProps>(
-  ({ canvas, paint }, { blob, x, y }) => {
-    canvas.drawTextBlob(blob, x, y, paint);
-  }
-);
-
-export const TextBlob = (props: AnimatedProps<TextBlobProps>) => {
-  return <skDrawing onDraw={onDraw} {...props} />;
+export const TextBlob = (props: SkiaProps<TextBlobProps>) => {
+  return <skTextBlob {...props} />;
 };
 
 TextBlob.defaultProps = {

package/src/renderer/components/text/TextPath.tsx

@@ -1,65 +1,10 @@
 import React from "react";
 
-import type { CustomPaintProps, AnimatedProps } from "../../processors";
-import { createDrawing } from "../../nodes";
-import type { SkPath, SkRSXform } from "../../../skia/types";
-import type { FontDef } from "../../processors/Font";
+import type { SkiaProps } from "../../processors";
+import type { TextPathProps } from "../../../dom/types";
 
-export type TextPathProps = CustomPaintProps &
-  FontDef & {
-    text: string;
-    path: SkPath | string;
-    initialOffset: number;
-  };
-
-const onDraw = createDrawing<TextPathProps>(
-  (
-    { canvas, paint, Skia },
-    { text, initialOffset, path: pathDef, ...fontDef }
-  ) => {
-    const path =
-      typeof pathDef === "string"
-        ? Skia.Path.MakeFromSVGString(pathDef)
-        : pathDef;
-    if (path === null) {
-      throw new Error("Invalid path: " + pathDef);
-    }
-    const { font } = fontDef;
-    const ids = font.getGlyphIDs(text);
-    const widths = font.getGlyphWidths(ids, paint);
-    const rsx: SkRSXform[] = [];
-    const meas = Skia.ContourMeasureIter(path, false, 1);
-    let cont = meas.next();
-    let dist = initialOffset;
-    for (let i = 0; i < text.length && cont; i++) {
-      const width = widths[i];
-      dist += width / 2;
-      if (dist > cont.length()) {
-        // jump to next contour
-        cont = meas.next();
-        if (!cont) {
-          // We have come to the end of the path - terminate the string
-          // right here.
-          text = text.substring(0, i);
-          break;
-        }
-        dist = width / 2;
-      }
-      // Gives us the (x, y) coordinates as well as the cos/sin of the tangent
-      // line at that position.
-      const { px, py, tx, ty } = cont.getPosTan(dist);
-      const adjustedX = px - (width / 2) * tx;
-      const adjustedY = py - (width / 2) * ty;
-      rsx.push(Skia.RSXform(tx, ty, adjustedX, adjustedY));
-      dist += width / 2;
-    }
-    const blob = Skia.TextBlob.MakeFromRSXform(text, rsx, font);
-    canvas.drawTextBlob(blob, 0, 0, paint);
-  }
-);
-
-export const TextPath = (props: AnimatedProps<TextPathProps>) => {
-  return <skDrawing onDraw={onDraw} {...props} />;
+export const TextPath = (props: SkiaProps<TextPathProps>) => {
+  return <skTextPath {...props} />;
 };
 
 TextPath.defaultProps = {

package/src/renderer/index.ts

@@ -1,5 +1,4 @@
 export * from "./components";
-export * from "./nodes";
 export * from "./useContextBridge";
 export * from "./DependencyManager";
 export * from "./useCanvas";

package/src/renderer/processors/Animations/Animations.ts

@@ -49,3 +49,8 @@ export type AnimatedProp<T, P = any> = T | SkiaValue<T> | SkiaSelector<T, P>;
 export type AnimatedProps<T> = {
   [K in keyof T]: AnimatedProp<T[K]>;
 };
+
+// TODO: switch to AnimatedProps<GroupProps> and remove duplicate properties.
+// For instance matrix in color filter becomes colorMatrix
+// eslint-disable-next-line @typescript-eslint/ban-types
+export type SkiaProps<P = {}> = AnimatedProps<P>;

package/src/renderer/processors/index.ts

@@ -1,11 +1,2 @@
-export * from "./Transform";
 export * from "./Animations";
-export * from "./Circles";
-export * from "./Rects";
 export * from "./math";
-export * from "./Font";
-export * from "./Paths";
-export * from "./Clips";
-export * from "./Radius";
-export * from "./Color";
-export * from "./Paint";

package/src/skia/types/Matrix.ts

@@ -22,6 +22,7 @@ export interface SkMatrix extends SkJSIInstance<"Matrix"> {
   skew: (x: number, y: number) => void;
   rotate: (theta: number) => void;
   identity: () => void;
+  get: () => number[];
 }
 
 type Transform2dName =

package/src/skia/web/JsiSkMatrix.ts

@@ -57,4 +57,8 @@ export class JsiSkMatrix
   identity() {
     this.ref.set(this.CanvasKit.Matrix.identity());
   }
+
+  get() {
+    return Array.from(this.ref);
+  }
 }

package/src/web/WithSkiaWeb.tsx

@@ -16,7 +16,9 @@ export const WithSkiaWeb = ({
   opts,
 }: WithSkiaProps) => {
   const Inner = useMemo(
-    () =>
+    // TODO: investigate
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (): any =>
       lazy(async () => {
         if (Platform.OS === "web") {
           await LoadSkiaWeb(opts);

package/lib/commonjs/renderer/components/Compose.js

@@ -1,40 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Compose = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _types = require("../../skia/types");
-
-var _Declaration = require("../nodes/Declaration");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-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); }
-
-const onDeclare = (0, _Declaration.createDeclaration)((_, children, _ref) => {
-  let {
-    Skia
-  } = _ref;
-  const [inner, outer] = children;
-
-  if ((0, _types.isColorFilter)(outer) && (0, _types.isColorFilter)(inner)) {
-    return Skia.ColorFilter.MakeCompose(outer, inner);
-  } else if ((0, _types.isImageFilter)(outer) && (0, _types.isImageFilter)(inner)) {
-    return Skia.ImageFilter.MakeCompose(outer, inner);
-  }
-
-  throw new Error("ComposeFilter can only compose ColorFilters and ImageFilters");
-});
-
-const Compose = props => {
-  return /*#__PURE__*/_react.default.createElement("skDeclaration", _extends({
-    onDeclare: onDeclare
-  }, props));
-};
-
-exports.Compose = Compose;
-//# sourceMappingURL=Compose.js.map

package/lib/commonjs/renderer/components/Compose.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["Compose.tsx"],"names":["onDeclare","_","children","Skia","inner","outer","ColorFilter","MakeCompose","ImageFilter","Error","Compose","props"],"mappings":";;;;;;;AAAA;;AAGA;;AACA;;;;;;AAOA,MAAMA,SAAS,GAAG,oCAAkB,CAACC,CAAD,EAAIC,QAAJ,WAA2B;AAAA,MAAb;AAAEC,IAAAA;AAAF,GAAa;AAC7D,QAAM,CAACC,KAAD,EAAQC,KAAR,IAAiBH,QAAvB;;AACA,MAAI,0BAAcG,KAAd,KAAwB,0BAAcD,KAAd,CAA5B,EAAkD;AAChD,WAAOD,IAAI,CAACG,WAAL,CAAiBC,WAAjB,CAA6BF,KAA7B,EAAoCD,KAApC,CAAP;AACD,GAFD,MAEO,IAAI,0BAAcC,KAAd,KAAwB,0BAAcD,KAAd,CAA5B,EAAkD;AACvD,WAAOD,IAAI,CAACK,WAAL,CAAiBD,WAAjB,CAA6BF,KAA7B,EAAoCD,KAApC,CAAP;AACD;;AACD,QAAM,IAAIK,KAAJ,CACJ,8DADI,CAAN;AAGD,CAViB,CAAlB;;AAYO,MAAMC,OAAO,GAAIC,KAAD,IAAwC;AAC7D,sBAAO;AAAe,IAAA,SAAS,EAAEX;AAA1B,KAAyCW,KAAzC,EAAP;AACD,CAFM","sourcesContent":["import React from \"react\";\nimport type { ReactNode } from \"react\";\n\nimport { isImageFilter, isColorFilter } from \"../../skia/types\";\nimport { createDeclaration } from \"../nodes/Declaration\";\nimport type { AnimatedProps } from \"../processors/Animations/Animations\";\n\nexport interface ComposeProps {\n  children: ReactNode | ReactNode[];\n}\n\nconst onDeclare = createDeclaration((_, children, { Skia }) => {\n  const [inner, outer] = children;\n  if (isColorFilter(outer) && isColorFilter(inner)) {\n    return Skia.ColorFilter.MakeCompose(outer, inner);\n  } else if (isImageFilter(outer) && isImageFilter(inner)) {\n    return Skia.ImageFilter.MakeCompose(outer, inner);\n  }\n  throw new Error(\n    \"ComposeFilter can only compose ColorFilters and ImageFilters\"\n  );\n});\n\nexport const Compose = (props: AnimatedProps<ComposeProps>) => {\n  return <skDeclaration onDeclare={onDeclare} {...props} />;\n};\n"]}

package/lib/commonjs/renderer/components/colorFilters/Compose.js

@@ -1,24 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.composeColorFilter = void 0;
-
-var _types = require("../../../skia/types");
-
-const composeColorFilter = (Skia, cf, children) => {
-  const [col] = children.filter(_types.isColorFilter);
-  const [img] = children.filter(_types.isImageFilter);
-
-  if (col) {
-    return Skia.ColorFilter.MakeCompose(cf, col);
-  } else if (img) {
-    return Skia.ImageFilter.MakeColorFilter(cf, img);
-  }
-
-  return cf;
-};
-
-exports.composeColorFilter = composeColorFilter;
-//# sourceMappingURL=Compose.js.map

package/lib/commonjs/renderer/components/colorFilters/Compose.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["Compose.ts"],"names":["composeColorFilter","Skia","cf","children","col","filter","isColorFilter","img","isImageFilter","ColorFilter","MakeCompose","ImageFilter","MakeColorFilter"],"mappings":";;;;;;;AACA;;AAGO,MAAMA,kBAAkB,GAAG,CAChCC,IADgC,EAEhCC,EAFgC,EAGhCC,QAHgC,KAI7B;AACH,QAAM,CAACC,GAAD,IAAQD,QAAQ,CAACE,MAAT,CAAgBC,oBAAhB,CAAd;AACA,QAAM,CAACC,GAAD,IAAQJ,QAAQ,CAACE,MAAT,CAAgBG,oBAAhB,CAAd;;AACA,MAAIJ,GAAJ,EAAS;AACP,WAAOH,IAAI,CAACQ,WAAL,CAAiBC,WAAjB,CAA6BR,EAA7B,EAAiCE,GAAjC,CAAP;AACD,GAFD,MAEO,IAAIG,GAAJ,EAAS;AACd,WAAON,IAAI,CAACU,WAAL,CAAiBC,eAAjB,CAAiCV,EAAjC,EAAqCK,GAArC,CAAP;AACD;;AACD,SAAOL,EAAP;AACD,CAbM","sourcesContent":["import type { SkColorFilter, Skia } from \"../../../skia/types\";\nimport { isColorFilter, isImageFilter } from \"../../../skia/types\";\nimport type { DeclarationResult } from \"../../nodes\";\n\nexport const composeColorFilter = (\n  Skia: Skia,\n  cf: SkColorFilter,\n  children: DeclarationResult[]\n) => {\n  const [col] = children.filter(isColorFilter);\n  const [img] = children.filter(isImageFilter);\n  if (col) {\n    return Skia.ColorFilter.MakeCompose(cf, col);\n  } else if (img) {\n    return Skia.ImageFilter.MakeColorFilter(cf, img);\n  }\n  return cf;\n};\n"]}

package/lib/commonjs/renderer/components/imageFilters/InnerShadow.js

@@ -1,28 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.MakeInnerShadow = void 0;
-
-var _types = require("../../../skia/types");
-
-const Black = Float32Array.of(0, 0, 0, 1);
-
-const MakeInnerShadow = (Skia, shadowOnly, dx, dy, sigmaX, sigmaY, color, input) => {
-  const sourceGraphic = Skia.ImageFilter.MakeColorFilter(Skia.ColorFilter.MakeBlend(Black, _types.BlendMode.Dst), null);
-  const sourceAlpha = Skia.ImageFilter.MakeColorFilter(Skia.ColorFilter.MakeBlend(Black, _types.BlendMode.SrcIn), null);
-  const f1 = Skia.ImageFilter.MakeColorFilter(Skia.ColorFilter.MakeBlend(color, _types.BlendMode.SrcOut), null);
-  const f2 = Skia.ImageFilter.MakeOffset(dx, dy, f1);
-  const f3 = Skia.ImageFilter.MakeBlur(sigmaX, sigmaY, _types.TileMode.Decal, f2);
-  const f4 = Skia.ImageFilter.MakeBlend(_types.BlendMode.SrcIn, sourceAlpha, f3);
-
-  if (shadowOnly) {
-    return f4;
-  }
-
-  return Skia.ImageFilter.MakeCompose(input, Skia.ImageFilter.MakeBlend(_types.BlendMode.SrcOver, sourceGraphic, f4));
-};
-
-exports.MakeInnerShadow = MakeInnerShadow;
-//# sourceMappingURL=InnerShadow.js.map

package/lib/commonjs/renderer/components/imageFilters/InnerShadow.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["InnerShadow.tsx"],"names":["Black","Float32Array","of","MakeInnerShadow","Skia","shadowOnly","dx","dy","sigmaX","sigmaY","color","input","sourceGraphic","ImageFilter","MakeColorFilter","ColorFilter","MakeBlend","BlendMode","Dst","sourceAlpha","SrcIn","f1","SrcOut","f2","MakeOffset","f3","MakeBlur","TileMode","Decal","f4","MakeCompose","SrcOver"],"mappings":";;;;;;;AACA;;AAEA,MAAMA,KAAK,GAAGC,YAAY,CAACC,EAAb,CAAgB,CAAhB,EAAmB,CAAnB,EAAsB,CAAtB,EAAyB,CAAzB,CAAd;;AAEO,MAAMC,eAAe,GAAG,CAC7BC,IAD6B,EAE7BC,UAF6B,EAG7BC,EAH6B,EAI7BC,EAJ6B,EAK7BC,MAL6B,EAM7BC,MAN6B,EAO7BC,KAP6B,EAQ7BC,KAR6B,KAS1B;AACH,QAAMC,aAAa,GAAGR,IAAI,CAACS,WAAL,CAAiBC,eAAjB,CACpBV,IAAI,CAACW,WAAL,CAAiBC,SAAjB,CAA2BhB,KAA3B,EAAkCiB,iBAAUC,GAA5C,CADoB,EAEpB,IAFoB,CAAtB;AAIA,QAAMC,WAAW,GAAGf,IAAI,CAACS,WAAL,CAAiBC,eAAjB,CAClBV,IAAI,CAACW,WAAL,CAAiBC,SAAjB,CAA2BhB,KAA3B,EAAkCiB,iBAAUG,KAA5C,CADkB,EAElB,IAFkB,CAApB;AAIA,QAAMC,EAAE,GAAGjB,IAAI,CAACS,WAAL,CAAiBC,eAAjB,CACTV,IAAI,CAACW,WAAL,CAAiBC,SAAjB,CAA2BN,KAA3B,EAAkCO,iBAAUK,MAA5C,CADS,EAET,IAFS,CAAX;AAIA,QAAMC,EAAE,GAAGnB,IAAI,CAACS,WAAL,CAAiBW,UAAjB,CAA4BlB,EAA5B,EAAgCC,EAAhC,EAAoCc,EAApC,CAAX;AACA,QAAMI,EAAE,GAAGrB,IAAI,CAACS,WAAL,CAAiBa,QAAjB,CAA0BlB,MAA1B,EAAkCC,MAAlC,EAA0CkB,gBAASC,KAAnD,EAA0DL,EAA1D,CAAX;AACA,QAAMM,EAAE,GAAGzB,IAAI,CAACS,WAAL,CAAiBG,SAAjB,CAA2BC,iBAAUG,KAArC,EAA4CD,WAA5C,EAAyDM,EAAzD,CAAX;;AACA,MAAIpB,UAAJ,EAAgB;AACd,WAAOwB,EAAP;AACD;;AACD,SAAOzB,IAAI,CAACS,WAAL,CAAiBiB,WAAjB,CACLnB,KADK,EAELP,IAAI,CAACS,WAAL,CAAiBG,SAAjB,CAA2BC,iBAAUc,OAArC,EAA8CnB,aAA9C,EAA6DiB,EAA7D,CAFK,CAAP;AAID,CAhCM","sourcesContent":["import type { SkColor, Skia, SkImageFilter } from \"../../../skia/types\";\nimport { BlendMode, TileMode } from \"../../../skia/types\";\n\nconst Black = Float32Array.of(0, 0, 0, 1);\n\nexport const MakeInnerShadow = (\n  Skia: Skia,\n  shadowOnly: boolean | undefined,\n  dx: number,\n  dy: number,\n  sigmaX: number,\n  sigmaY: number,\n  color: SkColor,\n  input: SkImageFilter | null\n) => {\n  const sourceGraphic = Skia.ImageFilter.MakeColorFilter(\n    Skia.ColorFilter.MakeBlend(Black, BlendMode.Dst),\n    null\n  );\n  const sourceAlpha = Skia.ImageFilter.MakeColorFilter(\n    Skia.ColorFilter.MakeBlend(Black, BlendMode.SrcIn),\n    null\n  );\n  const f1 = Skia.ImageFilter.MakeColorFilter(\n    Skia.ColorFilter.MakeBlend(color, BlendMode.SrcOut),\n    null\n  );\n  const f2 = Skia.ImageFilter.MakeOffset(dx, dy, f1);\n  const f3 = Skia.ImageFilter.MakeBlur(sigmaX, sigmaY, TileMode.Decal, f2);\n  const f4 = Skia.ImageFilter.MakeBlend(BlendMode.SrcIn, sourceAlpha, f3);\n  if (shadowOnly) {\n    return f4;\n  }\n  return Skia.ImageFilter.MakeCompose(\n    input,\n    Skia.ImageFilter.MakeBlend(BlendMode.SrcOver, sourceGraphic, f4)\n  );\n};\n"]}

package/lib/commonjs/renderer/components/imageFilters/getInput.js

@@ -1,33 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getInput = void 0;
-
-var _types = require("../../../skia/types");
-
-const getInput = (Skia, children) => {
-  const [child] = children.filter(c => c);
-
-  if (!child) {
-    return null;
-  }
-
-  if ((0, _types.isImageFilter)(child)) {
-    return child;
-  }
-
-  if ((0, _types.isColorFilter)(child)) {
-    return Skia.ImageFilter.MakeColorFilter(child, null);
-  }
-
-  if ((0, _types.isShader)(child)) {
-    return Skia.ImageFilter.MakeShader(child, null);
-  }
-
-  throw new Error("Invalid image filter child: " + child);
-};
-
-exports.getInput = getInput;
-//# sourceMappingURL=getInput.js.map

package/lib/commonjs/renderer/components/imageFilters/getInput.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["getInput.ts"],"names":["getInput","Skia","children","child","filter","c","ImageFilter","MakeColorFilter","MakeShader","Error"],"mappings":";;;;;;;AAEA;;AAEO,MAAMA,QAAQ,GAAG,CAACC,IAAD,EAAaC,QAAb,KAA+C;AACrE,QAAM,CAACC,KAAD,IAAUD,QAAQ,CAACE,MAAT,CAAiBC,CAAD,IAAOA,CAAvB,CAAhB;;AACA,MAAI,CAACF,KAAL,EAAY;AACV,WAAO,IAAP;AACD;;AACD,MAAI,0BAAcA,KAAd,CAAJ,EAA0B;AACxB,WAAOA,KAAP;AACD;;AACD,MAAI,0BAAcA,KAAd,CAAJ,EAA0B;AACxB,WAAOF,IAAI,CAACK,WAAL,CAAiBC,eAAjB,CAAiCJ,KAAjC,EAAwC,IAAxC,CAAP;AACD;;AACD,MAAI,qBAASA,KAAT,CAAJ,EAAqB;AACnB,WAAOF,IAAI,CAACK,WAAL,CAAiBE,UAAjB,CAA4BL,KAA5B,EAAmC,IAAnC,CAAP;AACD;;AACD,QAAM,IAAIM,KAAJ,CAAU,iCAAiCN,KAA3C,CAAN;AACD,CAfM","sourcesContent":["import type { DeclarationResult } from \"../../nodes\";\nimport type { Skia } from \"../../../skia/types\";\nimport { isImageFilter, isColorFilter, isShader } from \"../../../skia/types\";\n\nexport const getInput = (Skia: Skia, children: DeclarationResult[]) => {\n  const [child] = children.filter((c) => c);\n  if (!child) {\n    return null;\n  }\n  if (isImageFilter(child)) {\n    return child;\n  }\n  if (isColorFilter(child)) {\n    return Skia.ImageFilter.MakeColorFilter(child, null);\n  }\n  if (isShader(child)) {\n    return Skia.ImageFilter.MakeShader(child, null);\n  }\n  throw new Error(\"Invalid image filter child: \" + child);\n};\n"]}

package/lib/commonjs/renderer/components/shaders/Gradient.js

@@ -1,32 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.processGradientProps = void 0;
-
-var _types = require("../../../skia/types");
-
-var _Paint = require("../../processors/Paint");
-
-var _Transform = require("../../processors/Transform");
-
-const processGradientProps = (Skia, _ref) => {
-  let {
-    colors,
-    positions,
-    mode,
-    flags,
-    ...transform
-  } = _ref;
-  return {
-    colors: colors.map(color => Skia.Color(color)),
-    positions: positions !== null && positions !== void 0 ? positions : null,
-    mode: _types.TileMode[(0, _Paint.enumKey)(mode !== null && mode !== void 0 ? mode : "clamp")],
-    flags,
-    localMatrix: (0, _Transform.localMatrix)(Skia.Matrix(), transform)
-  };
-};
-
-exports.processGradientProps = processGradientProps;
-//# sourceMappingURL=Gradient.js.map

package/lib/commonjs/renderer/components/shaders/Gradient.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["Gradient.ts"],"names":["processGradientProps","Skia","colors","positions","mode","flags","transform","map","color","Color","TileMode","localMatrix","Matrix"],"mappings":";;;;;;;AAAA;;AAGA;;AACA;;AAUO,MAAMA,oBAAoB,GAAG,CAClCC,IADkC;AAAA,MAElC;AAAEC,IAAAA,MAAF;AAAUC,IAAAA,SAAV;AAAqBC,IAAAA,IAArB;AAA2BC,IAAAA,KAA3B;AAAkC,OAAGC;AAArC,GAFkC;AAAA,SAG9B;AACJJ,IAAAA,MAAM,EAAEA,MAAM,CAACK,GAAP,CAAYC,KAAD,IAAWP,IAAI,CAACQ,KAAL,CAAWD,KAAX,CAAtB,CADJ;AAEJL,IAAAA,SAAS,EAAEA,SAAF,aAAEA,SAAF,cAAEA,SAAF,GAAe,IAFpB;AAGJC,IAAAA,IAAI,EAAEM,gBAAS,oBAAQN,IAAR,aAAQA,IAAR,cAAQA,IAAR,GAAgB,OAAhB,CAAT,CAHF;AAIJC,IAAAA,KAJI;AAKJM,IAAAA,WAAW,EAAE,4BAAYV,IAAI,CAACW,MAAL,EAAZ,EAA2BN,SAA3B;AALT,GAH8B;AAAA,CAA7B","sourcesContent":["import { TileMode } from \"../../../skia/types\";\nimport type { SkEnum } from \"../../processors/Paint\";\nimport type { TransformProps } from \"../../processors/Transform\";\nimport { enumKey } from \"../../processors/Paint\";\nimport { localMatrix } from \"../../processors/Transform\";\nimport type { Color, Skia } from \"../../../skia/types\";\n\nexport interface GradientProps extends TransformProps {\n  colors: Color[];\n  positions?: number[];\n  mode?: SkEnum<typeof TileMode>;\n  flags?: number;\n}\n\nexport const processGradientProps = (\n  Skia: Skia,\n  { colors, positions, mode, flags, ...transform }: GradientProps\n) => ({\n  colors: colors.map((color) => Skia.Color(color)),\n  positions: positions ?? null,\n  mode: TileMode[enumKey(mode ?? \"clamp\")],\n  flags,\n  localMatrix: localMatrix(Skia.Matrix(), transform),\n});\n"]}

package/lib/commonjs/renderer/nodes/Container.js

@@ -1,28 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Container = void 0;
-
-var _Node = require("./Node");
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-class Container extends _Node.Node {
-  constructor(depMgr, redraw) {
-    super(depMgr, {});
-
-    _defineProperty(this, "redraw", void 0);
-
-    this.redraw = redraw;
-  }
-
-  draw(ctx) {
-    this.visit(ctx);
-  }
-
-}
-
-exports.Container = Container;
-//# sourceMappingURL=Container.js.map

package/lib/commonjs/renderer/nodes/Container.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["Container.tsx"],"names":["Container","Node","constructor","depMgr","redraw","draw","ctx","visit"],"mappings":";;;;;;;AAGA;;;;AAEO,MAAMA,SAAN,SAAwBC,UAAxB,CAA6B;AAGlCC,EAAAA,WAAW,CAACC,MAAD,EAA4BC,MAA5B,EAAgD;AACzD,UAAMD,MAAN,EAAc,EAAd;;AADyD;;AAEzD,SAAKC,MAAL,GAAcA,MAAd;AACD;;AAEDC,EAAAA,IAAI,CAACC,GAAD,EAAsB;AACxB,SAAKC,KAAL,CAAWD,GAAX;AACD;;AAViC","sourcesContent":["import type { DependencyManager } from \"../DependencyManager\";\nimport type { DrawingContext } from \"../DrawingContext\";\n\nimport { Node } from \"./Node\";\n\nexport class Container extends Node {\n  redraw: () => void;\n\n  constructor(depMgr: DependencyManager, redraw: () => void) {\n    super(depMgr, {});\n    this.redraw = redraw;\n  }\n\n  draw(ctx: DrawingContext) {\n    this.visit(ctx);\n  }\n}\n"]}

package/lib/commonjs/renderer/nodes/Declaration.js

@@ -1,57 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useDeclaration = exports.isDeclarationNode = exports.createDeclaration = exports.DeclarationNode = void 0;
-
-var _react = require("react");
-
-var _processors = require("../processors");
-
-var _Node = require("./Node");
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-const createDeclaration = cb => cb;
-
-exports.createDeclaration = createDeclaration;
-
-const useDeclaration = (cb, deps) => // eslint-disable-next-line react-hooks/exhaustive-deps
-(0, _react.useCallback)(cb, deps !== null && deps !== void 0 ? deps : []);
-
-exports.useDeclaration = useDeclaration;
-
-const isDeclarationNode = node => node instanceof DeclarationNode;
-
-exports.isDeclarationNode = isDeclarationNode;
-
-class DeclarationNode extends _Node.Node {
-  constructor(depMgr, onDeclare, props) {
-    super(depMgr, props);
-
-    _defineProperty(this, "onDeclare", void 0);
-
-    super.memoizable = !(0, _processors.isAnimated)(props);
-    this.onDeclare = onDeclare;
-  }
-
-  set props(props) {
-    this.memoizable = !(0, _processors.isAnimated)(props);
-    super.props = props;
-  }
-
-  get props() {
-    return this.resolvedProps;
-  }
-
-  draw(ctx) {
-    const children = this.visit(ctx);
-    const obj = this.onDeclare(this.props, children, ctx);
-    return obj;
-  }
-
-}
-
-exports.DeclarationNode = DeclarationNode;
-//# sourceMappingURL=Declaration.js.map

package/lib/commonjs/renderer/nodes/Declaration.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["Declaration.tsx"],"names":["createDeclaration","cb","useDeclaration","deps","isDeclarationNode","node","DeclarationNode","Node","constructor","depMgr","onDeclare","props","memoizable","resolvedProps","draw","ctx","children","visit","obj"],"mappings":";;;;;;;AACA;;AAIA;;AAIA;;;;AAUO,MAAMA,iBAAiB,GAC5BC,EAD+B,IAEJA,EAFtB;;;;AAIA,MAAMC,cAAc,GAAG,CAC5BD,EAD4B,EAE5BE,IAF4B,KAI5B;AACA,wBAAYF,EAAZ,EAAgBE,IAAhB,aAAgBA,IAAhB,cAAgBA,IAAhB,GAAwB,EAAxB,CALK;;;;AAOA,MAAMC,iBAAiB,GAAQC,IAAL,IAC/BA,IAAI,YAAYC,eADX;;;;AAOA,MAAMA,eAAN,SAAiCC,UAAjC,CAAyC;AAG9CC,EAAAA,WAAW,CACTC,MADS,EAETC,SAFS,EAGTC,KAHS,EAIT;AACA,UAAMF,MAAN,EAAcE,KAAd;;AADA;;AAEA,UAAMC,UAAN,GAAmB,CAAC,4BAAWD,KAAX,CAApB;AACA,SAAKD,SAAL,GAAiBA,SAAjB;AACD;;AAEQ,MAALC,KAAK,CAACA,KAAD,EAA0B;AACjC,SAAKC,UAAL,GAAkB,CAAC,4BAAWD,KAAX,CAAnB;AACA,UAAMA,KAAN,GAAcA,KAAd;AACD;;AAEQ,MAALA,KAAK,GAAM;AACb,WAAO,KAAKE,aAAZ;AACD;;AAEDC,EAAAA,IAAI,CAACC,GAAD,EAAsB;AACxB,UAAMC,QAAQ,GAAG,KAAKC,KAAL,CAAWF,GAAX,CAAjB;AACA,UAAMG,GAAG,GAAG,KAAKR,SAAL,CAAe,KAAKC,KAApB,EAA2BK,QAA3B,EAAqCD,GAArC,CAAZ;AACA,WAAOG,GAAP;AACD;;AA1B6C","sourcesContent":["import type { DependencyList } from \"react\";\nimport { useCallback } from \"react\";\n\nimport type { DrawingContext } from \"../DrawingContext\";\nimport type { AnimatedProps } from \"../processors\";\nimport { isAnimated } from \"../processors\";\nimport type { DependencyManager } from \"../DependencyManager\";\nimport type { SkJSIInstance } from \"../../skia/types\";\n\nimport { Node } from \"./Node\";\n\nexport type DeclarationResult = SkJSIInstance<string> | null;\n\ntype DeclarationCallback<T> = (\n  props: T,\n  children: DeclarationResult[],\n  ctx: DrawingContext\n) => DeclarationResult;\n\nexport const createDeclaration = <T,>(\n  cb: DeclarationCallback<T>\n): DeclarationCallback<T> => cb;\n\nexport const useDeclaration = <P,>(\n  cb: DeclarationCallback<P>,\n  deps?: DependencyList\n) =>\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useCallback(cb, deps ?? []);\n\nexport const isDeclarationNode = <P,>(node: Node): node is DeclarationNode<P> =>\n  node instanceof DeclarationNode;\n\nexport interface DeclarationProps<P> {\n  onDeclare: DeclarationCallback<P>;\n}\n\nexport class DeclarationNode<P> extends Node<P> {\n  private onDeclare: DeclarationCallback<P>;\n\n  constructor(\n    depMgr: DependencyManager,\n    onDeclare: DeclarationCallback<P>,\n    props: AnimatedProps<P>\n  ) {\n    super(depMgr, props);\n    super.memoizable = !isAnimated(props);\n    this.onDeclare = onDeclare;\n  }\n\n  set props(props: AnimatedProps<P>) {\n    this.memoizable = !isAnimated(props);\n    super.props = props;\n  }\n\n  get props(): P {\n    return this.resolvedProps;\n  }\n\n  draw(ctx: DrawingContext) {\n    const children = this.visit(ctx);\n    const obj = this.onDeclare(this.props, children, ctx);\n    return obj;\n  }\n}\n"]}

package/lib/commonjs/renderer/nodes/Drawing.js

@@ -1,56 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useDrawing = exports.createDrawing = exports.DrawingNode = void 0;
-
-var _react = require("react");
-
-var _types = require("../../skia/types");
-
-var _processors = require("../processors");
-
-var _Node = require("./Node");
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-const createDrawing = cb => cb;
-
-exports.createDrawing = createDrawing;
-
-const useDrawing = (cb, deps) => // eslint-disable-next-line react-hooks/exhaustive-deps
-(0, _react.useCallback)(cb, deps !== null && deps !== void 0 ? deps : []);
-
-exports.useDrawing = useDrawing;
-
-class DrawingNode extends _Node.Node {
-  constructor(depMgr, onDraw, skipProcessing, props) {
-    super(depMgr, props);
-
-    _defineProperty(this, "onDraw", void 0);
-
-    _defineProperty(this, "skipProcessing", void 0);
-
-    this.onDraw = onDraw;
-    this.skipProcessing = skipProcessing;
-  }
-
-  draw(ctx) {
-    if (this.skipProcessing) {
-      this.onDraw(ctx, this.props, this);
-    } else {
-      const declarations = this.visit(ctx);
-      const paint = (0, _processors.processPaint)(ctx.Skia, ctx.paint.copy(), ctx.opacity, this.props, declarations);
-      [paint, ...declarations.filter(_types.isPaint)].forEach(currentPaint => {
-        this.onDraw({ ...ctx,
-          paint: currentPaint
-        }, this.props, this);
-      });
-    }
-  }
-
-}
-
-exports.DrawingNode = DrawingNode;
-//# sourceMappingURL=Drawing.js.map

package/lib/commonjs/renderer/nodes/Drawing.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["Drawing.tsx"],"names":["createDrawing","cb","useDrawing","deps","DrawingNode","Node","constructor","depMgr","onDraw","skipProcessing","props","draw","ctx","declarations","visit","paint","Skia","copy","opacity","filter","isPaint","forEach","currentPaint"],"mappings":";;;;;;;AACA;;AAIA;;AAEA;;AAEA;;;;AAUO,MAAMA,aAAa,GAAQC,EAAL,IAC3BA,EADK;;;;AAGA,MAAMC,UAAU,GAAG,CAAKD,EAAL,EAA4BE,IAA5B,KACxB;AACA,wBAAYF,EAAZ,EAAgBE,IAAhB,aAAgBA,IAAhB,cAAgBA,IAAhB,GAAwB,EAAxB,CAFK;;;;AAUA,MAAMC,WAAN,SAA6BC,UAA7B,CAAqC;AAI1CC,EAAAA,WAAW,CACTC,MADS,EAETC,MAFS,EAGTC,cAHS,EAITC,KAJS,EAKT;AACA,UAAMH,MAAN,EAAcG,KAAd;;AADA;;AAAA;;AAEA,SAAKF,MAAL,GAAcA,MAAd;AACA,SAAKC,cAAL,GAAsBA,cAAtB;AACD;;AAEDE,EAAAA,IAAI,CAACC,GAAD,EAAsB;AACxB,QAAI,KAAKH,cAAT,EAAyB;AACvB,WAAKD,MAAL,CAAYI,GAAZ,EAAiB,KAAKF,KAAtB,EAA6B,IAA7B;AACD,KAFD,MAEO;AACL,YAAMG,YAAY,GAAG,KAAKC,KAAL,CAAWF,GAAX,CAArB;AACA,YAAMG,KAAK,GAAG,8BACZH,GAAG,CAACI,IADQ,EAEZJ,GAAG,CAACG,KAAJ,CAAUE,IAAV,EAFY,EAGZL,GAAG,CAACM,OAHQ,EAIZ,KAAKR,KAJO,EAKZG,YALY,CAAd;AAOA,OAACE,KAAD,EAAQ,GAAGF,YAAY,CAACM,MAAb,CAAoBC,cAApB,CAAX,EAAyCC,OAAzC,CAAkDC,YAAD,IAAkB;AACjE,aAAKd,MAAL,CAAY,EAAE,GAAGI,GAAL;AAAUG,UAAAA,KAAK,EAAEO;AAAjB,SAAZ,EAA6C,KAAKZ,KAAlD,EAAyD,IAAzD;AACD,OAFD;AAGD;AACF;;AA/ByC","sourcesContent":["import type { DependencyList, ReactNode } from \"react\";\nimport { useCallback } from \"react\";\n\nimport type { DrawingContext } from \"../DrawingContext\";\nimport type { AnimatedProps } from \"../processors/Animations/Animations\";\nimport { isPaint } from \"../../skia/types\";\nimport type { DependencyManager } from \"../DependencyManager\";\nimport { processPaint } from \"../processors\";\n\nimport { Node } from \"./Node\";\n\ntype DrawingCallback<P> = (\n  ctx: DrawingContext,\n  props: P,\n  node: Node<P>\n) => void;\n\ntype OnDrawCallback<P> = (ctx: DrawingContext, props: P, node: Node<P>) => void;\n\nexport const createDrawing = <P,>(cb: OnDrawCallback<P>): DrawingCallback<P> =>\n  cb;\n\nexport const useDrawing = <P,>(cb: OnDrawCallback<P>, deps?: DependencyList) =>\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useCallback(cb, deps ?? []);\n\nexport type DrawingProps<P> = {\n  onDraw: DrawingCallback<P>;\n  skipProcessing?: boolean;\n  children?: ReactNode | ReactNode[];\n};\n\nexport class DrawingNode<P> extends Node<P> {\n  onDraw: DrawingCallback<P>;\n  skipProcessing: boolean;\n\n  constructor(\n    depMgr: DependencyManager,\n    onDraw: DrawingCallback<P>,\n    skipProcessing: boolean,\n    props: AnimatedProps<P>\n  ) {\n    super(depMgr, props);\n    this.onDraw = onDraw;\n    this.skipProcessing = skipProcessing;\n  }\n\n  draw(ctx: DrawingContext) {\n    if (this.skipProcessing) {\n      this.onDraw(ctx, this.props, this);\n    } else {\n      const declarations = this.visit(ctx);\n      const paint = processPaint(\n        ctx.Skia,\n        ctx.paint.copy(),\n        ctx.opacity,\n        this.props,\n        declarations\n      );\n      [paint, ...declarations.filter(isPaint)].forEach((currentPaint) => {\n        this.onDraw({ ...ctx, paint: currentPaint }, this.props, this);\n      });\n    }\n  }\n}\n"]}