@shopify/react-native-skia 1.0.1 → 1.0.3

package/lib/module/renderer/HostConfig.js

@@ -0,0 +1,142 @@
+/*global NodeJS*/
+
+import { DefaultEventPriority } from "react-reconciler/constants";
+import { bindReanimatedProps, extractReanimatedProps, unbindReanimatedNode } from "../external/reanimated/renderHelpers";
+import { createNode } from "./HostComponents";
+import { shallowEq } from "./typeddash";
+const DEBUG = false;
+export const debug = (...args) => {
+  if (DEBUG) {
+    console.log(...args);
+  }
+};
+const appendNode = (parent, child) => {
+  parent.addChild(child);
+};
+const removeNode = (parent, child) => {
+  unbindReanimatedNode(child);
+  return parent.removeChild(child);
+};
+const insertBefore = (parent, child, before) => {
+  parent.insertChildBefore(child, before);
+};
+export const skHostConfig = {
+  /**
+   * This function is used by the reconciler in order to calculate current time for prioritising work.
+   */
+  now: Date.now,
+  supportsMutation: true,
+  isPrimaryRenderer: false,
+  supportsPersistence: false,
+  supportsHydration: false,
+  //supportsMicrotask: true,
+
+  scheduleTimeout: setTimeout,
+  cancelTimeout: clearTimeout,
+  noTimeout: -1,
+  appendChildToContainer(container, child) {
+    debug("appendChildToContainer");
+    appendNode(container.root, child);
+  },
+  appendChild(parent, child) {
+    debug("appendChild", parent, child);
+    appendNode(parent, child);
+  },
+  getRootHostContext: _rootContainerInstance => {
+    debug("getRootHostContext");
+    return null;
+  },
+  getChildHostContext(_parentHostContext, _type, _rootContainerInstance) {
+    debug("getChildHostContext");
+    return null;
+  },
+  shouldSetTextContent(_type, _props) {
+    return false;
+  },
+  createTextInstance(_text, _rootContainerInstance, _hostContext, _internalInstanceHandle) {
+    debug("createTextInstance");
+    // return SpanNode({}, text) as SkNode;
+    throw new Error("Text nodes are not supported yet");
+  },
+  createInstance(type, pristineProps, container, _hostContext, _internalInstanceHandle) {
+    debug("createInstance", type);
+    const [props, reanimatedProps] = extractReanimatedProps(pristineProps);
+    const node = createNode(container, type, props);
+    bindReanimatedProps(container, node, reanimatedProps);
+    return node;
+  },
+  appendInitialChild(parentInstance, child) {
+    debug("appendInitialChild");
+    appendNode(parentInstance, child);
+  },
+  finalizeInitialChildren(parentInstance, _type, _props, _rootContainerInstance, _hostContext) {
+    debug("finalizeInitialChildren", parentInstance);
+    return false;
+  },
+  commitMount() {
+    // if finalizeInitialChildren = true
+    debug("commitMount");
+  },
+  prepareForCommit(_containerInfo) {
+    debug("prepareForCommit");
+    return null;
+  },
+  resetAfterCommit(container) {
+    debug("resetAfterCommit");
+    container.redraw();
+  },
+  getPublicInstance(node) {
+    debug("getPublicInstance");
+    return node;
+  },
+  prepareUpdate: (_instance, type, oldProps, newProps, rootContainerInstance, _hostContext) => {
+    debug("prepareUpdate");
+    const propsAreEqual = shallowEq(oldProps, newProps);
+    if (propsAreEqual) {
+      return null;
+    }
+    debug("update ", type);
+    return rootContainerInstance;
+  },
+  commitUpdate(instance, updatePayload, type, prevProps, nextProps, _internalHandle) {
+    debug("commitUpdate: ", type);
+    if (shallowEq(prevProps, nextProps)) {
+      return;
+    }
+    const [props, reanimatedProps] = extractReanimatedProps(nextProps);
+    instance.setProps(props);
+    bindReanimatedProps(updatePayload, instance, reanimatedProps);
+  },
+  commitTextUpdate: (_textInstance, _oldText, _newText) => {
+    //  textInstance.instance = newText;
+  },
+  clearContainer: container => {
+    debug("clearContainer");
+    container.root.children().forEach(child => {
+      container.root.removeChild(child);
+    });
+  },
+  preparePortalMount: () => {
+    debug("preparePortalMount");
+  },
+  removeChild: (parent, child) => {
+    removeNode(parent, child);
+  },
+  removeChildFromContainer: (container, child) => {
+    removeNode(container.root, child);
+  },
+  insertInContainerBefore: (container, child, before) => {
+    insertBefore(container.root, child, before);
+  },
+  insertBefore: (parent, child, before) => {
+    insertBefore(parent, child, before);
+  },
+  // see https://github.com/pmndrs/react-three-fiber/pull/2360#discussion_r916356874
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-expect-error
+  getCurrentEventPriority: () => DefaultEventPriority,
+  beforeActiveInstanceBlur: () => {},
+  afterActiveInstanceBlur: () => {},
+  detachDeletedInstance: () => {}
+};
+//# sourceMappingURL=HostConfig.js.map

package/lib/module/renderer/HostConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["DefaultEventPriority","bindReanimatedProps","extractReanimatedProps","unbindReanimatedNode","createNode","shallowEq","DEBUG","debug","args","console","log","appendNode","parent","child","addChild","removeNode","removeChild","insertBefore","before","insertChildBefore","skHostConfig","now","Date","supportsMutation","isPrimaryRenderer","supportsPersistence","supportsHydration","scheduleTimeout","setTimeout","cancelTimeout","clearTimeout","noTimeout","appendChildToContainer","container","root","appendChild","getRootHostContext","_rootContainerInstance","getChildHostContext","_parentHostContext","_type","shouldSetTextContent","_props","createTextInstance","_text","_hostContext","_internalInstanceHandle","Error","createInstance","type","pristineProps","props","reanimatedProps","node","appendInitialChild","parentInstance","finalizeInitialChildren","commitMount","prepareForCommit","_containerInfo","resetAfterCommit","redraw","getPublicInstance","prepareUpdate","_instance","oldProps","newProps","rootContainerInstance","propsAreEqual","commitUpdate","instance","updatePayload","prevProps","nextProps","_internalHandle","setProps","commitTextUpdate","_textInstance","_oldText","_newText","clearContainer","children","forEach","preparePortalMount","removeChildFromContainer","insertInContainerBefore","getCurrentEventPriority","beforeActiveInstanceBlur","afterActiveInstanceBlur","detachDeletedInstance"],"sources":["HostConfig.ts"],"sourcesContent":["/*global NodeJS*/\nimport type { HostConfig } from \"react-reconciler\";\nimport { DefaultEventPriority } from \"react-reconciler/constants\";\n\nimport type { NodeType, Node } from \"../dom/types\";\nimport {\n  bindReanimatedProps,\n  extractReanimatedProps,\n  unbindReanimatedNode,\n} from \"../external/reanimated/renderHelpers\";\n\nimport type { Container } from \"./Container\";\nimport { createNode } from \"./HostComponents\";\nimport { shallowEq } from \"./typeddash\";\n\nconst DEBUG = false;\nexport const debug = (...args: Parameters<typeof console.log>) => {\n  if (DEBUG) {\n    console.log(...args);\n  }\n};\n\ntype Instance = Node<unknown>;\n\ntype Props = object;\ntype TextInstance = Node<unknown>;\ntype SuspenseInstance = Instance;\ntype HydratableInstance = Instance;\ntype PublicInstance = Instance;\ntype HostContext = null;\ntype UpdatePayload = Container;\ntype ChildSet = unknown;\ntype TimeoutHandle = NodeJS.Timeout;\ntype NoTimeout = -1;\n\ntype SkiaHostConfig = HostConfig<\n  NodeType,\n  Props,\n  Container,\n  Instance,\n  TextInstance,\n  SuspenseInstance,\n  HydratableInstance,\n  PublicInstance,\n  HostContext,\n  UpdatePayload,\n  ChildSet,\n  TimeoutHandle,\n  NoTimeout\n>;\n\nconst appendNode = (parent: Node<unknown>, child: Node<unknown>) => {\n  parent.addChild(child);\n};\n\nconst removeNode = (parent: Node<unknown>, child: Node<unknown>) => {\n  unbindReanimatedNode(child);\n  return parent.removeChild(child);\n};\n\nconst insertBefore = (\n  parent: Node<unknown>,\n  child: Node<unknown>,\n  before: Node<unknown>\n) => {\n  parent.insertChildBefore(child, before);\n};\n\nexport const skHostConfig: SkiaHostConfig = {\n  /**\n   * This function is used by the reconciler in order to calculate current time for prioritising work.\n   */\n  now: Date.now,\n  supportsMutation: true,\n  isPrimaryRenderer: false,\n  supportsPersistence: false,\n  supportsHydration: false,\n  //supportsMicrotask: true,\n\n  scheduleTimeout: setTimeout,\n  cancelTimeout: clearTimeout,\n  noTimeout: -1,\n\n  appendChildToContainer(container, child) {\n    debug(\"appendChildToContainer\");\n    appendNode(container.root, child);\n  },\n\n  appendChild(parent, child) {\n    debug(\"appendChild\", parent, child);\n    appendNode(parent, child);\n  },\n\n  getRootHostContext: (_rootContainerInstance: Container) => {\n    debug(\"getRootHostContext\");\n    return null;\n  },\n\n  getChildHostContext(_parentHostContext, _type, _rootContainerInstance) {\n    debug(\"getChildHostContext\");\n    return null;\n  },\n\n  shouldSetTextContent(_type, _props) {\n    return false;\n  },\n\n  createTextInstance(\n    _text,\n    _rootContainerInstance,\n    _hostContext,\n    _internalInstanceHandle\n  ) {\n    debug(\"createTextInstance\");\n    // return SpanNode({}, text) as SkNode;\n    throw new Error(\"Text nodes are not supported yet\");\n  },\n\n  createInstance(\n    type,\n    pristineProps,\n    container,\n    _hostContext,\n    _internalInstanceHandle\n  ) {\n    debug(\"createInstance\", type);\n    const [props, reanimatedProps] = extractReanimatedProps(pristineProps);\n    const node = createNode(container, type, props);\n    bindReanimatedProps(container, node, reanimatedProps);\n    return node;\n  },\n\n  appendInitialChild(parentInstance, child) {\n    debug(\"appendInitialChild\");\n    appendNode(parentInstance, child);\n  },\n\n  finalizeInitialChildren(\n    parentInstance,\n    _type,\n    _props,\n    _rootContainerInstance,\n    _hostContext\n  ) {\n    debug(\"finalizeInitialChildren\", parentInstance);\n    return false;\n  },\n\n  commitMount() {\n    // if finalizeInitialChildren = true\n    debug(\"commitMount\");\n  },\n\n  prepareForCommit(_containerInfo) {\n    debug(\"prepareForCommit\");\n    return null;\n  },\n\n  resetAfterCommit(container) {\n    debug(\"resetAfterCommit\");\n    container.redraw();\n  },\n\n  getPublicInstance(node: Instance) {\n    debug(\"getPublicInstance\");\n    return node;\n  },\n\n  prepareUpdate: (\n    _instance,\n    type,\n    oldProps,\n    newProps,\n    rootContainerInstance,\n    _hostContext\n  ) => {\n    debug(\"prepareUpdate\");\n    const propsAreEqual = shallowEq(oldProps, newProps);\n    if (propsAreEqual) {\n      return null;\n    }\n    debug(\"update \", type);\n    return rootContainerInstance;\n  },\n\n  commitUpdate(\n    instance,\n    updatePayload,\n    type,\n    prevProps,\n    nextProps,\n    _internalHandle\n  ) {\n    debug(\"commitUpdate: \", type);\n    if (shallowEq(prevProps, nextProps)) {\n      return;\n    }\n    const [props, reanimatedProps] = extractReanimatedProps(nextProps);\n    instance.setProps(props);\n    bindReanimatedProps(updatePayload, instance, reanimatedProps);\n  },\n\n  commitTextUpdate: (\n    _textInstance: TextInstance,\n    _oldText: string,\n    _newText: string\n  ) => {\n    //  textInstance.instance = newText;\n  },\n\n  clearContainer: (container) => {\n    debug(\"clearContainer\");\n    container.root.children().forEach((child) => {\n      container.root.removeChild(child);\n    });\n  },\n\n  preparePortalMount: () => {\n    debug(\"preparePortalMount\");\n  },\n\n  removeChild: (parent, child) => {\n    removeNode(parent, child);\n  },\n\n  removeChildFromContainer: (container, child) => {\n    removeNode(container.root, child);\n  },\n\n  insertInContainerBefore: (container, child, before) => {\n    insertBefore(container.root, child, before);\n  },\n\n  insertBefore: (parent, child, before) => {\n    insertBefore(parent, child, before);\n  },\n  // see https://github.com/pmndrs/react-three-fiber/pull/2360#discussion_r916356874\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  // @ts-expect-error\n  getCurrentEventPriority: () => DefaultEventPriority,\n  beforeActiveInstanceBlur: () => {},\n  afterActiveInstanceBlur: () => {},\n  detachDeletedInstance: () => {},\n};\n"],"mappings":"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"}

package/lib/module/renderer/Offscreen.d.ts

@@ -0,0 +1,6 @@
+import type { ReactElement } from "react";
+import type { SkPicture, SkSize } from "../skia/types";
+export declare const isOnMainThread: () => boolean;
+export declare const drawAsPicture: (element: ReactElement) => SkPicture;
+export declare const drawAsImage: (element: ReactElement, size: SkSize) => import("../skia").SkImage;
+export declare const drawAsImageFromPicture: (picture: SkPicture, size: SkSize) => import("../skia").SkImage;

package/lib/module/renderer/Offscreen.js

@@ -0,0 +1,44 @@
+import { JsiDrawingContext } from "../dom/types";
+import { Skia } from "../skia";
+import { Platform } from "../Platform";
+import { SkiaRoot } from "./Reconciler";
+
+// We call it main thread because on web main is JS thread
+export const isOnMainThread = () => {
+  "worklet";
+
+  return typeof _WORKLET !== "undefined" && _WORKLET === true || Platform.OS === "web";
+};
+export const drawAsPicture = element => {
+  const recorder = Skia.PictureRecorder();
+  const canvas = recorder.beginRecording();
+  const root = new SkiaRoot(Skia, false);
+  root.render(element);
+  const ctx = new JsiDrawingContext(Skia, canvas);
+  root.dom.render(ctx);
+  const picture = recorder.finishRecordingAsPicture();
+  return picture;
+};
+export const drawAsImage = (element, size) => {
+  return drawAsImageFromPicture(drawAsPicture(element), size);
+};
+
+// TODO: We're not sure yet why PixelRatio is not needed here.
+const pd = 1;
+export const drawAsImageFromPicture = (picture, size) => {
+  "worklet";
+
+  const surface = Skia.Surface.MakeOffscreen(size.width * pd, size.height * pd);
+  const canvas = surface.getCanvas();
+  canvas.scale(pd, pd);
+  canvas.drawPicture(picture);
+  surface.flush();
+  const image = surface.makeImageSnapshot();
+  // If we are not on the main thread or if we are on Web, we need to make the image non-texture.
+  if (!isOnMainThread() || Platform.OS === "web") {
+    return image.makeNonTextureImage();
+  } else {
+    return image;
+  }
+};
+//# sourceMappingURL=Offscreen.js.map

package/lib/module/renderer/Offscreen.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["JsiDrawingContext","Skia","Platform","SkiaRoot","isOnMainThread","_WORKLET","OS","drawAsPicture","element","recorder","PictureRecorder","canvas","beginRecording","root","render","ctx","dom","picture","finishRecordingAsPicture","drawAsImage","size","drawAsImageFromPicture","pd","surface","Surface","MakeOffscreen","width","height","getCanvas","scale","drawPicture","flush","image","makeImageSnapshot","makeNonTextureImage"],"sources":["Offscreen.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\n\nimport { JsiDrawingContext } from \"../dom/types\";\nimport type { SkPicture, SkSize } from \"../skia/types\";\nimport { Skia } from \"../skia\";\nimport { Platform } from \"../Platform\";\n\nimport { SkiaRoot } from \"./Reconciler\";\n\n// We call it main thread because on web main is JS thread\nexport const isOnMainThread = () => {\n  \"worklet\";\n  return (\n    (typeof _WORKLET !== \"undefined\" && _WORKLET === true) ||\n    Platform.OS === \"web\"\n  );\n};\n\nexport const drawAsPicture = (element: ReactElement) => {\n  const recorder = Skia.PictureRecorder();\n  const canvas = recorder.beginRecording();\n  const root = new SkiaRoot(Skia, false);\n  root.render(element);\n  const ctx = new JsiDrawingContext(Skia, canvas);\n  root.dom.render(ctx);\n  const picture = recorder.finishRecordingAsPicture();\n  return picture;\n};\n\nexport const drawAsImage = (element: ReactElement, size: SkSize) => {\n  return drawAsImageFromPicture(drawAsPicture(element), size);\n};\n\n// TODO: We're not sure yet why PixelRatio is not needed here.\nconst pd = 1;\nexport const drawAsImageFromPicture = (picture: SkPicture, size: SkSize) => {\n  \"worklet\";\n  const surface = Skia.Surface.MakeOffscreen(\n    size.width * pd,\n    size.height * pd\n  )!;\n  const canvas = surface.getCanvas();\n  canvas.scale(pd, pd);\n  canvas.drawPicture(picture);\n  surface.flush();\n  const image = surface.makeImageSnapshot();\n  // If we are not on the main thread or if we are on Web, we need to make the image non-texture.\n  if (!isOnMainThread() || Platform.OS === \"web\") {\n    return image.makeNonTextureImage();\n  } else {\n    return image;\n  }\n};\n"],"mappings":"AAEA,SAASA,iBAAiB,QAAQ,cAAc;AAEhD,SAASC,IAAI,QAAQ,SAAS;AAC9B,SAASC,QAAQ,QAAQ,aAAa;AAEtC,SAASC,QAAQ,QAAQ,cAAc;;AAEvC;AACA,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAM;EAClC,SAAS;;EACT,OACG,OAAOC,QAAQ,KAAK,WAAW,IAAIA,QAAQ,KAAK,IAAI,IACrDH,QAAQ,CAACI,EAAE,KAAK,KAAK;AAEzB,CAAC;AAED,OAAO,MAAMC,aAAa,GAAIC,OAAqB,IAAK;EACtD,MAAMC,QAAQ,GAAGR,IAAI,CAACS,eAAe,CAAC,CAAC;EACvC,MAAMC,MAAM,GAAGF,QAAQ,CAACG,cAAc,CAAC,CAAC;EACxC,MAAMC,IAAI,GAAG,IAAIV,QAAQ,CAACF,IAAI,EAAE,KAAK,CAAC;EACtCY,IAAI,CAACC,MAAM,CAACN,OAAO,CAAC;EACpB,MAAMO,GAAG,GAAG,IAAIf,iBAAiB,CAACC,IAAI,EAAEU,MAAM,CAAC;EAC/CE,IAAI,CAACG,GAAG,CAACF,MAAM,CAACC,GAAG,CAAC;EACpB,MAAME,OAAO,GAAGR,QAAQ,CAACS,wBAAwB,CAAC,CAAC;EACnD,OAAOD,OAAO;AAChB,CAAC;AAED,OAAO,MAAME,WAAW,GAAGA,CAACX,OAAqB,EAAEY,IAAY,KAAK;EAClE,OAAOC,sBAAsB,CAACd,aAAa,CAACC,OAAO,CAAC,EAAEY,IAAI,CAAC;AAC7D,CAAC;;AAED;AACA,MAAME,EAAE,GAAG,CAAC;AACZ,OAAO,MAAMD,sBAAsB,GAAGA,CAACJ,OAAkB,EAAEG,IAAY,KAAK;EAC1E,SAAS;;EACT,MAAMG,OAAO,GAAGtB,IAAI,CAACuB,OAAO,CAACC,aAAa,CACxCL,IAAI,CAACM,KAAK,GAAGJ,EAAE,EACfF,IAAI,CAACO,MAAM,GAAGL,EAChB,CAAE;EACF,MAAMX,MAAM,GAAGY,OAAO,CAACK,SAAS,CAAC,CAAC;EAClCjB,MAAM,CAACkB,KAAK,CAACP,EAAE,EAAEA,EAAE,CAAC;EACpBX,MAAM,CAACmB,WAAW,CAACb,OAAO,CAAC;EAC3BM,OAAO,CAACQ,KAAK,CAAC,CAAC;EACf,MAAMC,KAAK,GAAGT,OAAO,CAACU,iBAAiB,CAAC,CAAC;EACzC;EACA,IAAI,CAAC7B,cAAc,CAAC,CAAC,IAAIF,QAAQ,CAACI,EAAE,KAAK,KAAK,EAAE;IAC9C,OAAO0B,KAAK,CAACE,mBAAmB,CAAC,CAAC;EACpC,CAAC,MAAM;IACL,OAAOF,KAAK;EACd;AACF,CAAC"}

package/lib/module/renderer/Reconciler.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from "react";
+import type { Skia } from "../skia/types";
+export declare class SkiaRoot {
+    private root;
+    private container;
+    constructor(Skia: Skia, native?: boolean, redraw?: () => void, getNativeId?: () => number);
+    render(element: ReactNode): void;
+    unmount(): void;
+    get dom(): import("..").RenderNode<import("..").GroupProps>;
+}

package/lib/module/renderer/Reconciler.js

@@ -0,0 +1,35 @@
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import ReactReconciler from "react-reconciler";
+import { skHostConfig, debug as hostDebug } from "./HostConfig";
+import { Container } from "./Container";
+const skiaReconciler = ReactReconciler(skHostConfig);
+skiaReconciler.injectIntoDevTools({
+  bundleType: 1,
+  version: "0.0.1",
+  rendererPackageName: "react-native-skia"
+});
+export class SkiaRoot {
+  constructor(Skia, native = false, redraw = () => {}, getNativeId = () => 0) {
+    _defineProperty(this, "root", void 0);
+    _defineProperty(this, "container", void 0);
+    this.container = new Container(Skia, redraw, getNativeId, native);
+    this.root = skiaReconciler.createContainer(this.container, 0, null, true, null, "", console.error, null);
+  }
+  render(element) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    skiaReconciler.updateContainer(element, this.root, null, () => {
+      hostDebug("updateContainer");
+    });
+  }
+  unmount() {
+    skiaReconciler.updateContainer(null, this.root, null, () => {
+      hostDebug("unmountContainer");
+    });
+  }
+  get dom() {
+    return this.container.root;
+  }
+}
+//# sourceMappingURL=Reconciler.js.map

package/lib/module/renderer/Reconciler.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ReactReconciler","skHostConfig","debug","hostDebug","Container","skiaReconciler","injectIntoDevTools","bundleType","version","rendererPackageName","SkiaRoot","constructor","Skia","native","redraw","getNativeId","_defineProperty","container","root","createContainer","console","error","render","element","updateContainer","unmount","dom"],"sources":["Reconciler.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport type { OpaqueRoot } from \"react-reconciler\";\nimport ReactReconciler from \"react-reconciler\";\n\nimport type { Skia } from \"../skia/types\";\n\nimport { skHostConfig, debug as hostDebug } from \"./HostConfig\";\nimport { Container } from \"./Container\";\n\nconst skiaReconciler = ReactReconciler(skHostConfig);\n\nskiaReconciler.injectIntoDevTools({\n  bundleType: 1,\n  version: \"0.0.1\",\n  rendererPackageName: \"react-native-skia\",\n});\n\nexport class SkiaRoot {\n  private root: OpaqueRoot;\n  private container: Container;\n\n  constructor(\n    Skia: Skia,\n    native = false,\n    redraw: () => void = () => {},\n    getNativeId: () => number = () => 0\n  ) {\n    this.container = new Container(Skia, redraw, getNativeId, native);\n    this.root = skiaReconciler.createContainer(\n      this.container,\n      0,\n      null,\n      true,\n      null,\n      \"\",\n      console.error,\n      null\n    );\n  }\n\n  render(element: ReactNode) {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    skiaReconciler.updateContainer(element as any, this.root, null, () => {\n      hostDebug(\"updateContainer\");\n    });\n  }\n\n  unmount() {\n    skiaReconciler.updateContainer(null, this.root, null, () => {\n      hostDebug(\"unmountContainer\");\n    });\n  }\n\n  get dom() {\n    return this.container.root;\n  }\n}\n"],"mappings":";;;AAEA,OAAOA,eAAe,MAAM,kBAAkB;AAI9C,SAASC,YAAY,EAAEC,KAAK,IAAIC,SAAS,QAAQ,cAAc;AAC/D,SAASC,SAAS,QAAQ,aAAa;AAEvC,MAAMC,cAAc,GAAGL,eAAe,CAACC,YAAY,CAAC;AAEpDI,cAAc,CAACC,kBAAkB,CAAC;EAChCC,UAAU,EAAE,CAAC;EACbC,OAAO,EAAE,OAAO;EAChBC,mBAAmB,EAAE;AACvB,CAAC,CAAC;AAEF,OAAO,MAAMC,QAAQ,CAAC;EAIpBC,WAAWA,CACTC,IAAU,EACVC,MAAM,GAAG,KAAK,EACdC,MAAkB,GAAGA,CAAA,KAAM,CAAC,CAAC,EAC7BC,WAAyB,GAAGA,CAAA,KAAM,CAAC,EACnC;IAAAC,eAAA;IAAAA,eAAA;IACA,IAAI,CAACC,SAAS,GAAG,IAAIb,SAAS,CAACQ,IAAI,EAAEE,MAAM,EAAEC,WAAW,EAAEF,MAAM,CAAC;IACjE,IAAI,CAACK,IAAI,GAAGb,cAAc,CAACc,eAAe,CACxC,IAAI,CAACF,SAAS,EACd,CAAC,EACD,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,EAAE,EACFG,OAAO,CAACC,KAAK,EACb,IACF,CAAC;EACH;EAEAC,MAAMA,CAACC,OAAkB,EAAE;IACzB;IACAlB,cAAc,CAACmB,eAAe,CAACD,OAAO,EAAS,IAAI,CAACL,IAAI,EAAE,IAAI,EAAE,MAAM;MACpEf,SAAS,CAAC,iBAAiB,CAAC;IAC9B,CAAC,CAAC;EACJ;EAEAsB,OAAOA,CAAA,EAAG;IACRpB,cAAc,CAACmB,eAAe,CAAC,IAAI,EAAE,IAAI,CAACN,IAAI,EAAE,IAAI,EAAE,MAAM;MAC1Df,SAAS,CAAC,kBAAkB,CAAC;IAC/B,CAAC,CAAC;EACJ;EAEA,IAAIuB,GAAGA,CAAA,EAAG;IACR,OAAO,IAAI,CAACT,SAAS,CAACC,IAAI;EAC5B;AACF"}

package/lib/module/renderer/components/Blend.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { BlendProps } from "../../dom/types";
+import type { SkiaProps } from "../processors";
+export declare const Blend: (props: SkiaProps<BlendProps>) => React.JSX.Element;

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

@@ -0,0 +1,5 @@
+import React from "react";
+export const Blend = props => {
+  return /*#__PURE__*/React.createElement("skBlend", props);
+};
+//# sourceMappingURL=Blend.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Blend","props","createElement"],"sources":["Blend.tsx"],"sourcesContent":["import React from \"react\";\n\nimport type { BlendProps } from \"../../dom/types\";\nimport type { SkiaProps } from \"../processors\";\n\nexport const Blend = (props: SkiaProps<BlendProps>) => {\n  return <skBlend {...props} />;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAKzB,OAAO,MAAMC,KAAK,GAAIC,KAA4B,IAAK;EACrD,oBAAOF,KAAA,CAAAG,aAAA,YAAaD,KAAQ,CAAC;AAC/B,CAAC"}

package/lib/module/renderer/components/Group.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { SkiaProps } from "../processors";
+import type { GroupProps } from "../../dom/types";
+import type { ChildrenProps } from "../../dom/types/Common";
+export interface PublicGroupProps extends Omit<GroupProps, "layer"> {
+    layer?: GroupProps["layer"] | ChildrenProps["children"];
+}
+export declare const Group: ({ layer, ...props }: SkiaProps<PublicGroupProps>) => React.JSX.Element;

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

@@ -0,0 +1,14 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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, { isValidElement } from "react";
+export const Group = ({
+  layer,
+  ...props
+}) => {
+  if ( /*#__PURE__*/isValidElement(layer) && typeof layer === "object") {
+    return /*#__PURE__*/React.createElement("skLayer", null, layer, /*#__PURE__*/React.createElement("skGroup", props));
+  }
+  return /*#__PURE__*/React.createElement("skGroup", _extends({
+    layer: layer
+  }, props));
+};
+//# sourceMappingURL=Group.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","isValidElement","Group","layer","props","createElement","_extends"],"sources":["Group.tsx"],"sourcesContent":["import React, { isValidElement } from \"react\";\n\nimport type { SkiaProps } from \"../processors\";\nimport type { GroupProps } from \"../../dom/types\";\nimport type { ChildrenProps } from \"../../dom/types/Common\";\n\nexport interface PublicGroupProps extends Omit<GroupProps, \"layer\"> {\n  layer?: GroupProps[\"layer\"] | ChildrenProps[\"children\"];\n}\n\nexport const Group = ({ layer, ...props }: SkiaProps<PublicGroupProps>) => {\n  if (isValidElement(layer) && typeof layer === \"object\") {\n    return (\n      <skLayer>\n        {layer}\n        <skGroup {...props} />\n      </skLayer>\n    );\n  }\n  return <skGroup layer={layer as GroupProps[\"layer\"]} {...props} />;\n};\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,cAAc,QAAQ,OAAO;AAU7C,OAAO,MAAMC,KAAK,GAAGA,CAAC;EAAEC,KAAK;EAAE,GAAGC;AAAmC,CAAC,KAAK;EACzE,IAAI,cAAAH,cAAc,CAACE,KAAK,CAAC,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAE;IACtD,oBACEH,KAAA,CAAAK,aAAA,kBACGF,KAAK,eACNH,KAAA,CAAAK,aAAA,YAAaD,KAAQ,CACd,CAAC;EAEd;EACA,oBAAOJ,KAAA,CAAAK,aAAA,YAAAC,QAAA;IAASH,KAAK,EAAEA;EAA6B,GAAKC,KAAK,CAAG,CAAC;AACpE,CAAC"}

package/lib/module/renderer/components/Mask.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from "react";
+import React from "react";
+interface MaskProps {
+    mode?: "luminance" | "alpha";
+    clip?: boolean;
+    mask: ReactNode | ReactNode[];
+    children: ReactNode | ReactNode[];
+}
+export declare const Mask: ({ children, mask, mode, clip, }: MaskProps) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,25 @@
+import React from "react";
+import { Group } from "./Group";
+import { LumaColorFilter } from "./colorFilters/LumaColorFilter";
+import { Paint } from "./Paint";
+export const Mask = ({
+  children,
+  mask,
+  mode = "alpha",
+  clip = true
+}) => {
+  return /*#__PURE__*/React.createElement(Group, {
+    layer: true
+  }, /*#__PURE__*/React.createElement(Group, {
+    layer: /*#__PURE__*/React.createElement(Paint, {
+      blendMode: "src"
+    }, mode === "luminance" && /*#__PURE__*/React.createElement(LumaColorFilter, null))
+  }, mask, clip && /*#__PURE__*/React.createElement(Group, {
+    layer: /*#__PURE__*/React.createElement(Paint, {
+      blendMode: "dstIn"
+    })
+  }, children)), /*#__PURE__*/React.createElement(Group, {
+    blendMode: "srcIn"
+  }, children));
+};
+//# sourceMappingURL=Mask.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Group","LumaColorFilter","Paint","Mask","children","mask","mode","clip","createElement","layer","blendMode"],"sources":["Mask.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport React from \"react\";\n\nimport { Group } from \"./Group\";\nimport { LumaColorFilter } from \"./colorFilters/LumaColorFilter\";\nimport { Paint } from \"./Paint\";\n\ninterface MaskProps {\n  mode?: \"luminance\" | \"alpha\";\n  clip?: boolean;\n  mask: ReactNode | ReactNode[];\n  children: ReactNode | ReactNode[];\n}\n\nexport const Mask = ({\n  children,\n  mask,\n  mode = \"alpha\",\n  clip = true,\n}: MaskProps) => {\n  return (\n    <Group layer>\n      <Group\n        layer={\n          <Paint blendMode=\"src\">\n            {mode === \"luminance\" && <LumaColorFilter />}\n          </Paint>\n        }\n      >\n        {mask}\n        {clip && <Group layer={<Paint blendMode=\"dstIn\" />}>{children}</Group>}\n      </Group>\n      <Group blendMode=\"srcIn\">{children}</Group>\n    </Group>\n  );\n};\n"],"mappings":"AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,KAAK,QAAQ,SAAS;AAC/B,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,KAAK,QAAQ,SAAS;AAS/B,OAAO,MAAMC,IAAI,GAAGA,CAAC;EACnBC,QAAQ;EACRC,IAAI;EACJC,IAAI,GAAG,OAAO;EACdC,IAAI,GAAG;AACE,CAAC,KAAK;EACf,oBACER,KAAA,CAAAS,aAAA,CAACR,KAAK;IAACS,KAAK;EAAA,gBACVV,KAAA,CAAAS,aAAA,CAACR,KAAK;IACJS,KAAK,eACHV,KAAA,CAAAS,aAAA,CAACN,KAAK;MAACQ,SAAS,EAAC;IAAK,GACnBJ,IAAI,KAAK,WAAW,iBAAIP,KAAA,CAAAS,aAAA,CAACP,eAAe,MAAE,CACtC;EACR,GAEAI,IAAI,EACJE,IAAI,iBAAIR,KAAA,CAAAS,aAAA,CAACR,KAAK;IAACS,KAAK,eAAEV,KAAA,CAAAS,aAAA,CAACN,KAAK;MAACQ,SAAS,EAAC;IAAO,CAAE;EAAE,GAAEN,QAAgB,CAChE,CAAC,eACRL,KAAA,CAAAS,aAAA,CAACR,KAAK;IAACU,SAAS,EAAC;EAAO,GAAEN,QAAgB,CACrC,CAAC;AAEZ,CAAC"}

package/lib/module/renderer/components/Paint.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { SkiaProps } from "../processors";
+import type { DrawingNodeProps } from "../../dom/types";
+export declare const Paint: (props: SkiaProps<DrawingNodeProps>) => React.JSX.Element;

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

@@ -0,0 +1,5 @@
+import React from "react";
+export const Paint = props => {
+  return /*#__PURE__*/React.createElement("skPaint", props);
+};
+//# sourceMappingURL=Paint.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Paint","props","createElement"],"sources":["Paint.tsx"],"sourcesContent":["import React from \"react\";\n\nimport type { SkiaProps } from \"../processors\";\nimport type { DrawingNodeProps } from \"../../dom/types\";\n\nexport const Paint = (props: SkiaProps<DrawingNodeProps>) => {\n  return <skPaint {...props} />;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAKzB,OAAO,MAAMC,KAAK,GAAIC,KAAkC,IAAK;EAC3D,oBAAOF,KAAA,CAAAG,aAAA,YAAaD,KAAQ,CAAC;AAC/B,CAAC"}

package/lib/module/renderer/components/Picture.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { PictureProps } from "../../dom/types";
+import type { SkiaProps } from "../processors";
+export declare const Picture: (props: SkiaProps<PictureProps>) => React.JSX.Element;

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

@@ -0,0 +1,5 @@
+import React from "react";
+export const Picture = props => {
+  return /*#__PURE__*/React.createElement("skPicture", props);
+};
+//# sourceMappingURL=Picture.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Picture","props","createElement"],"sources":["Picture.tsx"],"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"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAKzB,OAAO,MAAMC,OAAO,GAAIC,KAA8B,IAAK;EACzD,oBAAOF,KAAA,CAAAG,aAAA,cAAeD,KAAQ,CAAC;AACjC,CAAC"}

package/lib/module/renderer/components/backdrop/BackdropBlur.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import type { AnimatedProps } from "../../processors";
+import type { Radius } from "../../../dom/types";
+import type { BackdropFilterProps } from "./BackdropFilter";
+interface BackdropBlurProps extends Omit<BackdropFilterProps, "filter"> {
+    blur: Radius;
+}
+export declare const BackdropBlur: ({ blur, children, ...props }: AnimatedProps<BackdropBlurProps>) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,17 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 { Blur } from "../imageFilters";
+import { BackdropFilter } from "./BackdropFilter";
+export const BackdropBlur = ({
+  blur,
+  children,
+  ...props
+}) => {
+  return /*#__PURE__*/React.createElement(BackdropFilter, _extends({
+    filter: /*#__PURE__*/React.createElement(Blur, {
+      blur: blur,
+      mode: "clamp"
+    })
+  }, props), children);
+};
+//# sourceMappingURL=BackdropBlur.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Blur","BackdropFilter","BackdropBlur","blur","children","props","createElement","_extends","filter","mode"],"sources":["BackdropBlur.tsx"],"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"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,IAAI,QAAQ,iBAAiB;AAKtC,SAASC,cAAc,QAAQ,kBAAkB;AAMjD,OAAO,MAAMC,YAAY,GAAGA,CAAC;EAC3BC,IAAI;EACJC,QAAQ;EACR,GAAGC;AAC6B,CAAC,KAAK;EACtC,oBACEN,KAAA,CAAAO,aAAA,CAACL,cAAc,EAAAM,QAAA;IAACC,MAAM,eAAET,KAAA,CAAAO,aAAA,CAACN,IAAI;MAACG,IAAI,EAAEA,IAAK;MAACM,IAAI,EAAC;IAAO,CAAE;EAAE,GAAKJ,KAAK,GACjED,QACa,CAAC;AAErB,CAAC"}

package/lib/module/renderer/components/backdrop/BackdropFilter.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from "react";
+import React from "react";
+import type { GroupProps } from "../../../dom/types";
+import type { SkiaProps } from "../../processors/Animations/Animations";
+export interface BackdropFilterProps extends GroupProps {
+    filter: ReactNode | ReactNode[];
+}
+export declare const BackdropFilter: ({ filter, children: groupChildren, ...props }: SkiaProps<BackdropFilterProps, "filter">) => React.JSX.Element;

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

@@ -0,0 +1,10 @@
+import React from "react";
+import { Group } from "../Group";
+export const BackdropFilter = ({
+  filter,
+  children: groupChildren,
+  ...props
+}) => {
+  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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Group","BackdropFilter","filter","children","groupChildren","props","createElement"],"sources":["BackdropFilter.tsx"],"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, \"filter\">) => {\n  return (\n    <Group {...props}>\n      <skBackdropFilter>{filter}</skBackdropFilter>\n      {groupChildren}\n    </Group>\n  );\n};\n"],"mappings":"AACA,OAAOA,KAAK,MAAM,OAAO;AAIzB,SAASC,KAAK,QAAQ,UAAU;AAMhC,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAC7BC,MAAM;EACNC,QAAQ,EAAEC,aAAa;EACvB,GAAGC;AACqC,CAAC,KAAK;EAC9C,oBACEN,KAAA,CAAAO,aAAA,CAACN,KAAK,EAAKK,KAAK,eACdN,KAAA,CAAAO,aAAA,2BAAmBJ,MAAyB,CAAC,EAC5CE,aACI,CAAC;AAEZ,CAAC"}

package/lib/module/renderer/components/backdrop/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./BackdropFilter";
+export * from "./BackdropBlur";

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

@@ -0,0 +1,3 @@
+export * from "./BackdropFilter";
+export * from "./BackdropBlur";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./BackdropFilter\";\nexport * from \"./BackdropBlur\";\n"],"mappings":"AAAA,cAAc,kBAAkB;AAChC,cAAc,gBAAgB"}

package/lib/module/renderer/components/colorFilters/BlendColor.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { SkiaProps } from "../../processors";
+import type { BlendColorFilterProps } from "../../../dom/types";
+export declare const BlendColor: (props: SkiaProps<BlendColorFilterProps>) => React.JSX.Element;

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

@@ -0,0 +1,5 @@
+import React from "react";
+export const BlendColor = props => {
+  return /*#__PURE__*/React.createElement("skBlendColorFilter", props);
+};
+//# sourceMappingURL=BlendColor.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","BlendColor","props","createElement"],"sources":["BlendColor.tsx"],"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"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAKzB,OAAO,MAAMC,UAAU,GAAIC,KAAuC,IAAK;EACrE,oBAAOF,KAAA,CAAAG,aAAA,uBAAwBD,KAAQ,CAAC;AAC1C,CAAC"}

package/lib/module/renderer/components/colorFilters/Lerp.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { SkiaProps } from "../../processors/Animations/Animations";
+import type { LerpColorFilterProps } from "../../../dom/types";
+export declare const Lerp: (props: SkiaProps<LerpColorFilterProps>) => React.JSX.Element;

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

@@ -0,0 +1,5 @@
+import React from "react";
+export const Lerp = props => {
+  return /*#__PURE__*/React.createElement("skLerpColorFilter", props);
+};
+//# sourceMappingURL=Lerp.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Lerp","props","createElement"],"sources":["Lerp.tsx"],"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"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAKzB,OAAO,MAAMC,IAAI,GAAIC,KAAsC,IAAK;EAC9D,oBAAOF,KAAA,CAAAG,aAAA,sBAAuBD,KAAQ,CAAC;AACzC,CAAC"}

package/lib/module/renderer/components/colorFilters/LinearToSRGBGamma.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ChildrenProps } from "../../../dom/types";
+import type { SkiaProps } from "../../processors";
+export declare const LinearToSRGBGamma: (props: SkiaProps<ChildrenProps>) => React.JSX.Element;

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

@@ -0,0 +1,5 @@
+import React from "react";
+export const LinearToSRGBGamma = props => {
+  return /*#__PURE__*/React.createElement("skLinearToSRGBGammaColorFilter", props);
+};
+//# sourceMappingURL=LinearToSRGBGamma.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","LinearToSRGBGamma","props","createElement"],"sources":["LinearToSRGBGamma.tsx"],"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"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAKzB,OAAO,MAAMC,iBAAiB,GAAIC,KAA+B,IAAK;EACpE,oBAAOF,KAAA,CAAAG,aAAA,mCAAoCD,KAAQ,CAAC;AACtD,CAAC"}

package/lib/module/renderer/components/colorFilters/LumaColorFilter.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ChildrenProps } from "../../../dom/types";
+import type { SkiaProps } from "../../processors/Animations/Animations";
+export declare const LumaColorFilter: (props: SkiaProps<ChildrenProps>) => React.JSX.Element;

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

@@ -0,0 +1,5 @@
+import React from "react";
+export const LumaColorFilter = props => {
+  return /*#__PURE__*/React.createElement("skLumaColorFilter", props);
+};
+//# sourceMappingURL=LumaColorFilter.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","LumaColorFilter","props","createElement"],"sources":["LumaColorFilter.tsx"],"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"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAKzB,OAAO,MAAMC,eAAe,GAAIC,KAA+B,IAAK;EAClE,oBAAOF,KAAA,CAAAG,aAAA,sBAAuBD,KAAQ,CAAC;AACzC,CAAC"}

package/lib/module/renderer/components/colorFilters/Matrix.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import type { SkiaProps } from "../../processors";
+import type { MatrixColorFilterProps } from "../../../dom/types";
+export declare const ColorMatrix: (props: SkiaProps<MatrixColorFilterProps>) => React.JSX.Element;
+export declare const OpacityMatrix: (opacity: number) => number[];

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

@@ -0,0 +1,6 @@
+import React from "react";
+export const ColorMatrix = 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

@@ -0,0 +1 @@
+{"version":3,"names":["React","ColorMatrix","props","createElement","OpacityMatrix","opacity"],"sources":["Matrix.tsx"],"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"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAKzB,OAAO,MAAMC,WAAW,GAAIC,KAAwC,IAAK;EACvE,oBAAOF,KAAA,CAAAG,aAAA,wBAAyBD,KAAQ,CAAC;AAC3C,CAAC;AAED,OAAO,MAAME,aAAa,GAAIC,OAAe,IAAK,CAChD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,EACDA,OAAO,EACP,CAAC,CACF"}

package/lib/module/renderer/components/colorFilters/SRGBToLinearGamma.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ChildrenProps } from "../../../dom/types";
+import type { SkiaProps } from "../../processors/Animations/Animations";
+export declare const SRGBToLinearGamma: (props: SkiaProps<ChildrenProps>) => React.JSX.Element;

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

@@ -0,0 +1,5 @@
+import React from "react";
+export const SRGBToLinearGamma = props => {
+  return /*#__PURE__*/React.createElement("skSRGBToLinearGammaColorFilter", props);
+};
+//# sourceMappingURL=SRGBToLinearGamma.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","SRGBToLinearGamma","props","createElement"],"sources":["SRGBToLinearGamma.tsx"],"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"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAKzB,OAAO,MAAMC,iBAAiB,GAAIC,KAA+B,IAAK;EACpE,oBAAOF,KAAA,CAAAG,aAAA,mCAAoCD,KAAQ,CAAC;AACtD,CAAC"}

package/lib/module/renderer/components/colorFilters/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./Matrix";
+export * from "./BlendColor";
+export * from "./Lerp";
+export * from "./LinearToSRGBGamma";
+export * from "./SRGBToLinearGamma";
+export * from "./LumaColorFilter";