@shopify/react-native-skia 0.1.115

package/lib/commonjs/external/reanimated/useSharedValueEffect.js

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useSharedValueEffect = void 0;
+
+var _react = require("react");
+
+var _Reanimated;
+
+// @ts-ignore
+let Reanimated;
+let Core;
+
+try {
+  Reanimated = require("react-native-reanimated");
+  Core = require("react-native-reanimated/lib/reanimated2/core");
+} catch (e) {// Ignore
+}
+
+const useSharedValueWrapper = ((_Reanimated = Reanimated) === null || _Reanimated === void 0 ? void 0 : _Reanimated.useSharedValue) === undefined ? value => (0, _react.useMemo)(() => ({
+  value
+}), [value]) : Reanimated.useSharedValue;
+/**
+ * Connects a shared value from reanimated to a SkiaView or Canvas
+ * so whenever the shared value changes the SkiaView will redraw.
+ * @param cb Callback that will be called whenever the shared value changes.
+ * @param values One or more shared values to listen for.
+ */
+
+const useSharedValueEffect = function (cb, value) {
+  for (var _len = arguments.length, values = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+    values[_key - 2] = arguments[_key];
+  }
+
+  const input = useSharedValueWrapper(0);
+  const {
+    runOnJS,
+    startMapper,
+    stopMapper
+  } = (0, _react.useMemo)(() => {
+    if (Reanimated && Core) {
+      const {
+        runOnJS
+      } = Reanimated;
+      const {
+        startMapper,
+        stopMapper
+      } = Core;
+      return {
+        runOnJS,
+        startMapper,
+        stopMapper
+      };
+    } else {
+      console.warn("Reanimated was not found and the useSharedValueEffect hook will have no effect.");
+      return {
+        runOnJS: undefined,
+        startMapper: undefined,
+        stopMapper: undefined
+      };
+    }
+  }, []);
+  (0, _react.useEffect)(() => {
+    if (startMapper !== undefined && runOnJS !== undefined && stopMapper !== undefined) {
+      // Start a mapper in Reanimated
+      const mapperId = startMapper(() => {
+        "worklet";
+
+        runOnJS(cb)();
+      }, [value, ...values], [input]); // Return unregistering the mapper
+
+      return () => {
+        if (stopMapper && mapperId !== undefined) {
+          stopMapper(mapperId);
+        }
+      };
+    }
+
+    return () => {}; // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [input, runOnJS, startMapper, stopMapper, value, ...values]);
+};
+
+exports.useSharedValueEffect = useSharedValueEffect;
+//# sourceMappingURL=useSharedValueEffect.js.map

package/lib/commonjs/external/reanimated/useSharedValueEffect.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useSharedValueEffect.ts"],"names":["Reanimated","Core","require","e","useSharedValueWrapper","useSharedValue","undefined","value","useSharedValueEffect","cb","values","input","runOnJS","startMapper","stopMapper","console","warn","mapperId"],"mappings":";;;;;;;AAGA;;;;AAEA;AACA,IAAIA,UAAJ;AACA,IAAIC,IAAJ;;AAGA,IAAI;AACFD,EAAAA,UAAU,GAAGE,OAAO,CAAC,yBAAD,CAApB;AACAD,EAAAA,IAAI,GAAGC,OAAO,CAAC,8CAAD,CAAd;AACD,CAHD,CAGE,OAAOC,CAAP,EAAU,CACV;AACD;;AAMD,MAAMC,qBAAqB,GACzB,gBAAAJ,UAAU,UAAV,kDAAYK,cAAZ,MAA+BC,SAA/B,GACKC,KAAD,IAAmB,oBAAQ,OAAO;AAAEA,EAAAA;AAAF,CAAP,CAAR,EAA2B,CAACA,KAAD,CAA3B,CADvB,GAEIP,UAAU,CAACK,cAHjB;AAKA;AACA;AACA;AACA;AACA;AACA;;AACO,MAAMG,oBAAoB,GAAG,UAClCC,EADkC,EAElCF,KAFkC,EAI/B;AAAA,oCADAG,MACA;AADAA,IAAAA,MACA;AAAA;;AACH,QAAMC,KAAK,GAAGP,qBAAqB,CAAC,CAAD,CAAnC;AACA,QAAM;AAAEQ,IAAAA,OAAF;AAAWC,IAAAA,WAAX;AAAwBC,IAAAA;AAAxB,MAAuC,oBAAQ,MAAM;AACzD,QAAId,UAAU,IAAIC,IAAlB,EAAwB;AACtB,YAAM;AAAEW,QAAAA;AAAF,UAAcZ,UAApB;AACA,YAAM;AAAEa,QAAAA,WAAF;AAAeC,QAAAA;AAAf,UAA8Bb,IAApC;AACA,aAAO;AAAEW,QAAAA,OAAF;AAAWC,QAAAA,WAAX;AAAwBC,QAAAA;AAAxB,OAAP;AACD,KAJD,MAIO;AACLC,MAAAA,OAAO,CAACC,IAAR,CACE,iFADF;AAGA,aAAO;AACLJ,QAAAA,OAAO,EAAEN,SADJ;AAELO,QAAAA,WAAW,EAAEP,SAFR;AAGLQ,QAAAA,UAAU,EAAER;AAHP,OAAP;AAKD;AACF,GAf4C,EAe1C,EAf0C,CAA7C;AAiBA,wBAAU,MAAM;AACd,QACEO,WAAW,KAAKP,SAAhB,IACAM,OAAO,KAAKN,SADZ,IAEAQ,UAAU,KAAKR,SAHjB,EAIE;AACA;AACA,YAAMW,QAAQ,GAAGJ,WAAW,CAC1B,MAAM;AACJ;;AACAD,QAAAA,OAAO,CAACH,EAAD,CAAP;AACD,OAJyB,EAK1B,CAACF,KAAD,EAAQ,GAAGG,MAAX,CAL0B,EAM1B,CAACC,KAAD,CAN0B,CAA5B,CAFA,CAUA;;AACA,aAAO,MAAM;AACX,YAAIG,UAAU,IAAIG,QAAQ,KAAKX,SAA/B,EAA0C;AACxCQ,UAAAA,UAAU,CAACG,QAAD,CAAV;AACD;AACF,OAJD;AAKD;;AACD,WAAO,MAAM,CAAE,CAAf,CAtBc,CAuBd;AACD,GAxBD,EAwBG,CAACN,KAAD,EAAQC,OAAR,EAAiBC,WAAjB,EAA8BC,UAA9B,EAA0CP,KAA1C,EAAiD,GAAGG,MAApD,CAxBH;AAyBD,CAhDM","sourcesContent":["/* eslint-disable @typescript-eslint/no-shadow */\n/* eslint-disable @typescript-eslint/consistent-type-imports */\n/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport { useEffect, useMemo } from \"react\";\n\n// @ts-ignore\nlet Reanimated: typeof import(\"react-native-reanimated\") | undefined;\nlet Core: // @ts-ignore\ntypeof import(\"react-native-reanimated/lib/reanimated2/core\") | undefined;\n\ntry {\n  Reanimated = require(\"react-native-reanimated\");\n  Core = require(\"react-native-reanimated/lib/reanimated2/core\");\n} catch (e) {\n  // Ignore\n}\n\ntype SharedValueTypeWrapper<T = number> = {\n  value: T;\n};\n\nconst useSharedValueWrapper =\n  Reanimated?.useSharedValue === undefined\n    ? (value: number) => useMemo(() => ({ value }), [value])\n    : Reanimated.useSharedValue;\n\n/**\n * Connects a shared value from reanimated to a SkiaView or Canvas\n * so whenever the shared value changes the SkiaView will redraw.\n * @param cb Callback that will be called whenever the shared value changes.\n * @param values One or more shared values to listen for.\n */\nexport const useSharedValueEffect = <T = number>(\n  cb: () => void,\n  value: SharedValueTypeWrapper<T>,\n  ...values: SharedValueTypeWrapper<T>[]\n) => {\n  const input = useSharedValueWrapper(0);\n  const { runOnJS, startMapper, stopMapper } = useMemo(() => {\n    if (Reanimated && Core) {\n      const { runOnJS } = Reanimated;\n      const { startMapper, stopMapper } = Core;\n      return { runOnJS, startMapper, stopMapper };\n    } else {\n      console.warn(\n        \"Reanimated was not found and the useSharedValueEffect hook will have no effect.\"\n      );\n      return {\n        runOnJS: undefined,\n        startMapper: undefined,\n        stopMapper: undefined,\n      };\n    }\n  }, []);\n\n  useEffect(() => {\n    if (\n      startMapper !== undefined &&\n      runOnJS !== undefined &&\n      stopMapper !== undefined\n    ) {\n      // Start a mapper in Reanimated\n      const mapperId = startMapper(\n        () => {\n          \"worklet\";\n          runOnJS(cb)();\n        },\n        [value, ...values],\n        [input]\n      );\n      // Return unregistering the mapper\n      return () => {\n        if (stopMapper && mapperId !== undefined) {\n          stopMapper(mapperId);\n        }\n      };\n    }\n    return () => {};\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [input, runOnJS, startMapper, stopMapper, value, ...values]);\n};\n"]}

package/lib/commonjs/index.js

@@ -0,0 +1,73 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+require("./skia/NativeSetup");
+
+var _renderer = require("./renderer");
+
+Object.keys(_renderer).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _renderer[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _renderer[key];
+    }
+  });
+});
+
+var _views = require("./views");
+
+Object.keys(_views).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _views[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _views[key];
+    }
+  });
+});
+
+var _skia = require("./skia");
+
+Object.keys(_skia).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _skia[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _skia[key];
+    }
+  });
+});
+
+var _external = require("./external");
+
+Object.keys(_external).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _external[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _external[key];
+    }
+  });
+});
+
+var _values = require("./values");
+
+Object.keys(_values).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _values[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _values[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/lib/commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAEA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["import \"./skia/NativeSetup\";\n\nexport * from \"./renderer\";\nexport * from \"./views\";\nexport * from \"./skia\";\nexport * from \"./external\";\nexport * from \"./values\";\n"]}

package/lib/commonjs/renderer/Canvas.js

@@ -0,0 +1,186 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useContextBridge = exports.useCanvasRef = exports.useCanvas = exports.skiaReconciler = exports.Canvas = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactReconciler = _interopRequireDefault(require("react-reconciler"));
+
+var _views = require("../views");
+
+var _skia = require("../skia");
+
+var _HostConfig = require("./HostConfig");
+
+var _processors = require("./processors");
+
+var _nodes = require("./nodes");
+
+var _DependencyManager = require("./DependencyManager");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+// import { debugTree } from "./nodes";
+// useContextBridge() is taken from https://github.com/pmndrs/drei#usecontextbridge
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const useContextBridge = function () {
+  for (var _len = arguments.length, contexts = new Array(_len), _key = 0; _key < _len; _key++) {
+    contexts[_key] = arguments[_key];
+  }
+
+  const values = // eslint-disable-next-line react-hooks/rules-of-hooks
+  contexts.map(context => (0, _react.useContext)(context));
+  return (0, _react.useMemo)(() => _ref => {
+    let {
+      children
+    } = _ref;
+    return contexts.reduceRight((acc, Context, i) => /*#__PURE__*/_react.default.createElement(Context.Provider, {
+      value: values[i],
+      children: acc
+    }), children);
+  }, [contexts, values]);
+};
+
+exports.useContextBridge = useContextBridge;
+
+const CanvasContext = /*#__PURE__*/_react.default.createContext(null);
+
+const useCanvas = () => {
+  const canvas = (0, _react.useContext)(CanvasContext);
+
+  if (!canvas) {
+    throw new Error("Canvas context is not available");
+  }
+
+  return canvas;
+};
+
+exports.useCanvas = useCanvas;
+const skiaReconciler = (0, _reactReconciler.default)(_HostConfig.skHostConfig);
+exports.skiaReconciler = skiaReconciler;
+skiaReconciler.injectIntoDevTools({
+  bundleType: 1,
+  version: "0.0.1",
+  rendererPackageName: "react-native-skia"
+});
+
+const render = (element, root, container) => {
+  skiaReconciler.updateContainer(element, root, null, () => {
+    (0, _HostConfig.debug)("updateContainer");
+    container.depMgr.subscribe();
+  });
+};
+
+const useCanvasRef = () => (0, _react.useRef)(null);
+
+exports.useCanvasRef = useCanvasRef;
+
+const defaultFontMgr = _skia.Skia.FontMgr.RefDefault();
+
+const Canvas = /*#__PURE__*/(0, _react.forwardRef)((_ref2, forwardedRef) => {
+  let {
+    children,
+    style,
+    debug,
+    mode,
+    onTouch,
+    fontMgr
+  } = _ref2;
+  const innerRef = useCanvasRef();
+  const ref = useCombinedRefs(forwardedRef, innerRef);
+  const [tick, setTick] = (0, _react.useState)(0);
+  const redraw = (0, _react.useCallback)(() => setTick(t => t + 1), []);
+  const container = (0, _react.useMemo)(() => new _nodes.Container(new _DependencyManager.DependencyManager(ref), redraw), [redraw, ref]);
+  const canvasCtx = (0, _react.useRef)({
+    width: 0,
+    height: 0
+  });
+  const root = (0, _react.useMemo)(() => skiaReconciler.createContainer(container, 0, false, null), [container]); // Render effect
+
+  (0, _react.useEffect)(() => {
+    render( /*#__PURE__*/_react.default.createElement(CanvasContext.Provider, {
+      value: canvasCtx.current
+    }, children), root, container);
+  }, [children, root, redraw, container]); // Draw callback
+
+  const onDraw = (0, _views.useDrawCallback)((canvas, info) => {
+    // TODO: if tree is empty (count === 1) maybe we should not render?
+    const {
+      width,
+      height,
+      timestamp
+    } = info;
+
+    if (onTouch) {
+      onTouch(info.touches);
+    }
+
+    const paint = _skia.Skia.Paint();
+
+    paint.setAntiAlias(true);
+    const ctx = {
+      width,
+      height,
+      timestamp,
+      canvas,
+      paint,
+      opacity: 1,
+      ref,
+      center: (0, _processors.vec)(width / 2, height / 2),
+      fontMgr: fontMgr !== null && fontMgr !== void 0 ? fontMgr : defaultFontMgr
+    };
+    canvasCtx.current = ctx;
+    container.draw(ctx);
+  }, [tick, onTouch]);
+  (0, _react.useEffect)(() => {
+    return () => {
+      container.depMgr.unsubscribe();
+    };
+  }, [container]);
+  return /*#__PURE__*/_react.default.createElement(_views.SkiaView, {
+    ref: ref,
+    style: style,
+    onDraw: onDraw,
+    mode: mode,
+    debug: debug
+  });
+});
+/**
+ * Combines a list of refs into a single ref. This can be used to provide
+ * both a forwarded ref and an internal ref keeping the same functionality
+ * on both of the refs.
+ * @param refs Array of refs to combine
+ * @returns A single ref that can be used in a ref prop.
+ */
+
+exports.Canvas = Canvas;
+
+const useCombinedRefs = function () {
+  for (var _len2 = arguments.length, refs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+    refs[_key2] = arguments[_key2];
+  }
+
+  const targetRef = _react.default.useRef(null);
+
+  _react.default.useEffect(() => {
+    refs.forEach(ref => {
+      if (ref) {
+        if (typeof ref === "function") {
+          ref(targetRef.current);
+        } else {
+          ref.current = targetRef.current;
+        }
+      }
+    });
+  }, [refs]);
+
+  return targetRef;
+};
+//# sourceMappingURL=Canvas.js.map

package/lib/commonjs/renderer/Canvas.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Canvas.tsx"],"names":["useContextBridge","contexts","values","map","context","children","reduceRight","acc","Context","i","CanvasContext","React","createContext","useCanvas","canvas","Error","skiaReconciler","skHostConfig","injectIntoDevTools","bundleType","version","rendererPackageName","render","element","root","container","updateContainer","depMgr","subscribe","useCanvasRef","defaultFontMgr","Skia","FontMgr","RefDefault","Canvas","forwardedRef","style","debug","mode","onTouch","fontMgr","innerRef","ref","useCombinedRefs","tick","setTick","redraw","t","Container","DependencyManager","canvasCtx","width","height","createContainer","current","onDraw","info","timestamp","touches","paint","Paint","setAntiAlias","ctx","opacity","center","draw","unsubscribe","refs","targetRef","useRef","useEffect","forEach"],"mappings":"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","sourcesContent":["import React, {\n  useEffect,\n  useState,\n  useCallback,\n  useMemo,\n  useContext,\n  forwardRef,\n  useRef,\n} from \"react\";\nimport type {\n  RefObject,\n  ReactNode,\n  ComponentProps,\n  Context,\n  ReactElement,\n  MutableRefObject,\n  ForwardedRef,\n} from \"react\";\nimport type { OpaqueRoot } from \"react-reconciler\";\nimport ReactReconciler from \"react-reconciler\";\n\nimport { SkiaView, useDrawCallback } from \"../views\";\nimport type { TouchHandler } from \"../views\";\nimport { Skia } from \"../skia\";\nimport type { FontMgr } from \"../skia/FontMgr/FontMgr\";\n\nimport { debug as hostDebug, skHostConfig } from \"./HostConfig\";\n// import { debugTree } from \"./nodes\";\nimport { vec } from \"./processors\";\nimport { Container } from \"./nodes\";\nimport { DependencyManager } from \"./DependencyManager\";\n\n// useContextBridge() is taken from https://github.com/pmndrs/drei#usecontextbridge\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const useContextBridge = (...contexts: Context<any>[]) => {\n  const values =\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    contexts.map((context) => useContext(context));\n  return useMemo(\n    () =>\n      ({ children }: { children: ReactNode }) =>\n        contexts.reduceRight(\n          (acc, Context, i) => (\n            <Context.Provider value={values[i]} children={acc} />\n          ),\n          children\n        ) as ReactElement,\n    [contexts, values]\n  );\n};\n\ninterface CanvasContext {\n  width: number;\n  height: number;\n}\n\nconst CanvasContext = React.createContext<CanvasContext | null>(null);\n\nexport const useCanvas = () => {\n  const canvas = useContext(CanvasContext);\n  if (!canvas) {\n    throw new Error(\"Canvas context is not available\");\n  }\n  return canvas;\n};\n\nexport const skiaReconciler = ReactReconciler(skHostConfig);\n\nskiaReconciler.injectIntoDevTools({\n  bundleType: 1,\n  version: \"0.0.1\",\n  rendererPackageName: \"react-native-skia\",\n});\n\nconst render = (element: ReactNode, root: OpaqueRoot, container: Container) => {\n  skiaReconciler.updateContainer(element, root, null, () => {\n    hostDebug(\"updateContainer\");\n\n    container.depMgr.subscribe();\n  });\n};\n\nexport const useCanvasRef = () => useRef<SkiaView>(null);\n\nexport interface CanvasProps extends ComponentProps<typeof SkiaView> {\n  ref?: RefObject<SkiaView>;\n  children: ReactNode;\n  onTouch?: TouchHandler;\n  fontMgr?: FontMgr;\n}\n\nconst defaultFontMgr = Skia.FontMgr.RefDefault();\n\nexport const Canvas = forwardRef<SkiaView, CanvasProps>(\n  ({ children, style, debug, mode, onTouch, fontMgr }, forwardedRef) => {\n    const innerRef = useCanvasRef();\n    const ref = useCombinedRefs(forwardedRef, innerRef);\n    const [tick, setTick] = useState(0);\n    const redraw = useCallback(() => setTick((t) => t + 1), []);\n\n    const container = useMemo(\n      () => new Container(new DependencyManager(ref), redraw),\n      [redraw, ref]\n    );\n\n    const canvasCtx = useRef({ width: 0, height: 0 });\n    const root = useMemo(\n      () => skiaReconciler.createContainer(container, 0, false, null),\n      [container]\n    );\n    // Render effect\n    useEffect(() => {\n      render(\n        <CanvasContext.Provider value={canvasCtx.current}>\n          {children}\n        </CanvasContext.Provider>,\n        root,\n        container\n      );\n    }, [children, root, redraw, container]);\n\n    // Draw callback\n    const onDraw = useDrawCallback(\n      (canvas, info) => {\n        // TODO: if tree is empty (count === 1) maybe we should not render?\n        const { width, height, timestamp } = info;\n        if (onTouch) {\n          onTouch(info.touches);\n        }\n        const paint = Skia.Paint();\n        paint.setAntiAlias(true);\n        const ctx = {\n          width,\n          height,\n          timestamp,\n          canvas,\n          paint,\n          opacity: 1,\n          ref,\n          center: vec(width / 2, height / 2),\n          fontMgr: fontMgr ?? defaultFontMgr,\n        };\n        canvasCtx.current = ctx;\n        container.draw(ctx);\n      },\n      [tick, onTouch]\n    );\n\n    useEffect(() => {\n      return () => {\n        container.depMgr.unsubscribe();\n      };\n    }, [container]);\n\n    return (\n      <SkiaView\n        ref={ref}\n        style={style}\n        onDraw={onDraw}\n        mode={mode}\n        debug={debug}\n      />\n    );\n  }\n);\n\n/**\n * Combines a list of refs into a single ref. This can be used to provide\n * both a forwarded ref and an internal ref keeping the same functionality\n * on both of the refs.\n * @param refs Array of refs to combine\n * @returns A single ref that can be used in a ref prop.\n */\nconst useCombinedRefs = <T,>(\n  ...refs: Array<MutableRefObject<T> | ForwardedRef<T>>\n) => {\n  const targetRef = React.useRef<T>(null);\n  React.useEffect(() => {\n    refs.forEach((ref) => {\n      if (ref) {\n        if (typeof ref === \"function\") {\n          ref(targetRef.current);\n        } else {\n          ref.current = targetRef.current;\n        }\n      }\n    });\n  }, [refs]);\n  return targetRef;\n};\n"]}

package/lib/commonjs/renderer/DependencyManager.js

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DependencyManager = void 0;
+
+var _processors = require("./processors");
+
+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 DependencyManager {
+  constructor(ref) {
+    _defineProperty(this, "ref", void 0);
+
+    _defineProperty(this, "subscriptions", new Map());
+
+    this.ref = ref;
+  }
+
+  unSubscribeNode(node) {
+    const subscription = this.subscriptions.get(node);
+
+    if (subscription && subscription.unsubscribe) {
+      subscription.unsubscribe();
+    }
+
+    this.subscriptions.delete(node);
+  }
+
+  subscribeNode(node, props) {
+    const values = Object.values(props).filter(_processors.isValue);
+
+    if (values.length > 0) {
+      this.subscriptions.set(node, {
+        values,
+        unsubscribe: null
+      });
+    }
+  }
+
+  subscribe() {
+    if (this.ref.current === null) {
+      throw new Error("Canvas ref is not set");
+    }
+
+    this.subscriptions.forEach(subscription => {
+      if (subscription.unsubscribe === null) {
+        subscription.unsubscribe = this.ref.current.registerValues(subscription.values);
+      }
+    });
+  }
+
+  unsubscribe() {
+    this.subscriptions.forEach(_ref => {
+      let {
+        unsubscribe
+      } = _ref;
+
+      if (unsubscribe) {
+        unsubscribe();
+      }
+    });
+    this.subscriptions.clear();
+  }
+
+}
+
+exports.DependencyManager = DependencyManager;
+//# sourceMappingURL=DependencyManager.js.map

package/lib/commonjs/renderer/DependencyManager.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["DependencyManager.tsx"],"names":["DependencyManager","constructor","ref","Map","unSubscribeNode","node","subscription","subscriptions","get","unsubscribe","delete","subscribeNode","props","values","Object","filter","isValue","length","set","subscribe","current","Error","forEach","registerValues","clear"],"mappings":";;;;;;;AAKA;;;;AAMO,MAAMA,iBAAN,CAAwB;AAO7BC,EAAAA,WAAW,CAACC,GAAD,EAA2B;AAAA;;AAAA,2CAFlC,IAAIC,GAAJ,EAEkC;;AACpC,SAAKD,GAAL,GAAWA,GAAX;AACD;;AAEDE,EAAAA,eAAe,CAACC,IAAD,EAAa;AAC1B,UAAMC,YAAY,GAAG,KAAKC,aAAL,CAAmBC,GAAnB,CAAuBH,IAAvB,CAArB;;AACA,QAAIC,YAAY,IAAIA,YAAY,CAACG,WAAjC,EAA8C;AAC5CH,MAAAA,YAAY,CAACG,WAAb;AACD;;AACD,SAAKF,aAAL,CAAmBG,MAAnB,CAA0BL,IAA1B;AACD;;AAEDM,EAAAA,aAAa,CAACN,IAAD,EAAaO,KAAb,EAA2B;AACtC,UAAMC,MAAM,GAAGC,MAAM,CAACD,MAAP,CAAcD,KAAd,EAAqBG,MAArB,CAA4BC,mBAA5B,CAAf;;AACA,QAAIH,MAAM,CAACI,MAAP,GAAgB,CAApB,EAAuB;AACrB,WAAKV,aAAL,CAAmBW,GAAnB,CAAuBb,IAAvB,EAA6B;AAAEQ,QAAAA,MAAF;AAAUJ,QAAAA,WAAW,EAAE;AAAvB,OAA7B;AACD;AACF;;AAEDU,EAAAA,SAAS,GAAG;AACV,QAAI,KAAKjB,GAAL,CAASkB,OAAT,KAAqB,IAAzB,EAA+B;AAC7B,YAAM,IAAIC,KAAJ,CAAU,uBAAV,CAAN;AACD;;AACD,SAAKd,aAAL,CAAmBe,OAAnB,CAA4BhB,YAAD,IAAkB;AAC3C,UAAIA,YAAY,CAACG,WAAb,KAA6B,IAAjC,EAAuC;AACrCH,QAAAA,YAAY,CAACG,WAAb,GAA2B,KAAKP,GAAL,CAASkB,OAAT,CAAkBG,cAAlB,CACzBjB,YAAY,CAACO,MADY,CAA3B;AAGD;AACF,KAND;AAOD;;AAEDJ,EAAAA,WAAW,GAAG;AACZ,SAAKF,aAAL,CAAmBe,OAAnB,CAA2B,QAAqB;AAAA,UAApB;AAAEb,QAAAA;AAAF,OAAoB;;AAC9C,UAAIA,WAAJ,EAAiB;AACfA,QAAAA,WAAW;AACZ;AACF,KAJD;AAKA,SAAKF,aAAL,CAAmBiB,KAAnB;AACD;;AA9C4B","sourcesContent":["import type { RefObject } from \"react\";\n\nimport type { SkiaView } from \"../views\";\nimport type { SkiaReadonlyValue } from \"../values\";\n\nimport { isValue } from \"./processors\";\nimport type { Node } from \"./nodes\";\n\ntype Unsubscribe = () => void;\ntype Props = { [key: string]: unknown };\n\nexport class DependencyManager {\n  ref: RefObject<SkiaView>;\n  subscriptions: Map<\n    Node,\n    { values: SkiaReadonlyValue<unknown>[]; unsubscribe: null | Unsubscribe }\n  > = new Map();\n\n  constructor(ref: RefObject<SkiaView>) {\n    this.ref = ref;\n  }\n\n  unSubscribeNode(node: Node) {\n    const subscription = this.subscriptions.get(node);\n    if (subscription && subscription.unsubscribe) {\n      subscription.unsubscribe();\n    }\n    this.subscriptions.delete(node);\n  }\n\n  subscribeNode(node: Node, props: Props) {\n    const values = Object.values(props).filter(isValue);\n    if (values.length > 0) {\n      this.subscriptions.set(node, { values, unsubscribe: null });\n    }\n  }\n\n  subscribe() {\n    if (this.ref.current === null) {\n      throw new Error(\"Canvas ref is not set\");\n    }\n    this.subscriptions.forEach((subscription) => {\n      if (subscription.unsubscribe === null) {\n        subscription.unsubscribe = this.ref.current!.registerValues(\n          subscription.values\n        );\n      }\n    });\n  }\n\n  unsubscribe() {\n    this.subscriptions.forEach(({ unsubscribe }) => {\n      if (unsubscribe) {\n        unsubscribe();\n      }\n    });\n    this.subscriptions.clear();\n  }\n}\n"]}

package/lib/commonjs/renderer/DrawingContext.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=DrawingContext.js.map

package/lib/commonjs/renderer/DrawingContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}