@shopify/react-native-skia 1.0.1 → 1.0.2

package/android/CMakeLists.txt

@@ -73,6 +73,8 @@ target_include_directories(
         "${NODE_MODULES_DIR}/react-native/ReactCommon/jsi"
         "${NODE_MODULES_DIR}/react-native/ReactCommon"
         "${NODE_MODULES_DIR}/react-native/ReactCommon/react/nativemodule/core"
+        "${NODE_MODULES_DIR}/react-native/ReactCommon/runtimeexecutor"
+        "${NODE_MODULES_DIR}/react-native/ReactAndroid/src/main/jni"
         "${NODE_MODULES_DIR}/react-native/ReactAndroid/src/main/java/com/facebook/react/turbomodule/core/jni"
 
         cpp/jni/include
@@ -178,6 +180,34 @@ else()
 endif()
 message("-- FBJNI   : " ${FBJNI_LIBRARY})
 
+unset(REACTNATIVEJNI_LIB CACHE)
+if(${REACT_NATIVE_VERSION} GREATER_EQUAL 71)
+    # RN 0.71 distributes prebuilt binaries.
+    set (REACTNATIVEJNI_LIB "ReactAndroid::reactnativejni")
+else()
+    find_library(
+            REACTNATIVEJNI_LIB
+            reactnativejni
+            PATHS ${LIBRN_DIR}
+            NO_CMAKE_FIND_ROOT_PATH
+    )
+endif()
+message("-- REACTNATIVEJNI   : " ${REACTNATIVEJNI_LIB})
+
+unset(RUNTIMEEXECUTOR_LIB CACHE)
+if(${REACT_NATIVE_VERSION} GREATER_EQUAL 71)
+    # RN 0.71 distributes prebuilt binaries.
+    set (RUNTIMEEXECUTOR_LIB "ReactAndroid::runtimeexecutor")
+else()
+    find_library(
+            RUNTIMEEXECUTOR_LIB
+            runtimeexecutor
+            PATHS ${LIBRN_DIR}
+            NO_CMAKE_FIND_ROOT_PATH
+    )
+endif()
+message("-- RUNTIMEEXECUTOR   : " ${RUNTIMEEXECUTOR_LIB})
+
 unset(TURBOMODULES_LIB CACHE)
 if(${REACT_NATIVE_VERSION} GREATER_EQUAL 71)
     # RN 0.71 distributes prebuilt binaries.
@@ -199,6 +229,8 @@ target_link_libraries(
         ${FBJNI_LIBRARY}
         ${REACT_LIB}
         ${JSI_LIB}
+        ${REACTNATIVEJNI_LIB}
+        ${RUNTIMEEXECUTOR_LIB}
         ${TURBOMODULES_LIB}
         ${SKIA_SVG_LIB}
         ${SKIA_SKSHAPER_LIB}

package/android/build.gradle

@@ -167,6 +167,16 @@ android {
                     "src/paper/java",
                 ]
             }
+
+            if (REACT_NATIVE_VERSION >= 74) {
+                srcDirs += [
+                    "src/reactnative74/java"
+                ]
+            } else {
+                srcDirs += [
+                    "src/reactnative69/java"
+                ]
+            }
         }
     }
 
@@ -182,6 +192,8 @@ android {
              "**/libfbjni.so",
              "**/libjsi.so",
              "**/libreact_nativemodule_core.so",
+             "**/libreactnativejni.so",
+             "**/libruntimeexecutor.so",
              "**/libturbomodulejsijni.so",
              "META-INF/**"
         ]

package/android/cpp/jni/JniSkiaManager.cpp

@@ -7,6 +7,36 @@
 
 #include <RNSkManager.h>
 
+namespace {
+
+// For bridgeless mode, currently we don't have a way to get the JSCallInvoker
+// from Java. Workaround to use RuntimeExecutor to simulate the behavior of
+// JSCallInvoker. In the future when bridgeless mode is a standard and no more
+// backward compatible to be considered, we could just use RuntimeExecutor to
+// run task on JS thread.
+class BridgelessJSCallInvoker : public facebook::react::CallInvoker {
+public:
+  explicit BridgelessJSCallInvoker(
+      facebook::react::RuntimeExecutor runtimeExecutor)
+      : runtimeExecutor_(std::move(runtimeExecutor)) {}
+
+  void invokeAsync(std::function<void()> &&func) noexcept override {
+    runtimeExecutor_(
+        [func = std::move(func)](facebook::jsi::Runtime &runtime) { func(); });
+  }
+
+  void invokeSync(std::function<void()> &&func) override {
+    throw std::runtime_error(
+        "Synchronous native -> JS calls are currently not supported.");
+  }
+
+private:
+  facebook::react::RuntimeExecutor runtimeExecutor_;
+
+}; // class BridgelessJSCallInvoker
+
+} // namespace
+
 namespace RNSkia {
 
 namespace jsi = facebook::jsi;
@@ -22,14 +52,17 @@ void JniSkiaManager::registerNatives() {
 
 // JNI init
 jni::local_ref<jni::HybridClass<JniSkiaManager>::jhybriddata>
-JniSkiaManager::initHybrid(jni::alias_ref<jhybridobject> jThis, jlong jsContext,
-                           JSCallInvokerHolder jsCallInvokerHolder,
-                           JavaPlatformContext skiaContext) {
+JniSkiaManager::initHybrid(
+    jni::alias_ref<jhybridobject> jThis, jlong jsContext,
+    jni::alias_ref<facebook::react::JRuntimeExecutor::javaobject>
+        jRuntimeExecutor,
+    JavaPlatformContext skiaContext) {
 
+  auto jsCallInvoker = std::make_shared<BridgelessJSCallInvoker>(
+      jRuntimeExecutor->cthis()->get());
   // cast from JNI hybrid objects to C++ instances
   return makeCxxInstance(jThis, reinterpret_cast<jsi::Runtime *>(jsContext),
-                         jsCallInvokerHolder->cthis()->getCallInvoker(),
-                         skiaContext->cthis());
+                         jsCallInvoker, skiaContext->cthis());
 }
 
 void JniSkiaManager::initializeRuntime() {

package/android/cpp/jni/include/JniPlatformContext.h

@@ -1,6 +1,5 @@
 #pragma once
 
-#include <ReactCommon/CallInvokerHolder.h>
 #include <fbjni/fbjni.h>
 
 #include <exception>
@@ -18,9 +17,6 @@ namespace RNSkia {
 namespace jsi = facebook::jsi;
 namespace jni = facebook::jni;
 
-using JSCallInvokerHolder =
-    jni::alias_ref<facebook::react::CallInvokerHolder::javaobject>;
-
 class JniPlatformContext : public jni::HybridClass<JniPlatformContext> {
 public:
   static auto constexpr kJavaDescriptor =

package/android/cpp/jni/include/JniSkiaManager.h

@@ -5,6 +5,7 @@
 #include <fbjni/fbjni.h>
 #include <jsi/jsi.h>
 #include <memory>
+#include <react/jni/JRuntimeExecutor.h>
 
 #include <JniPlatformContext.h>
 #include <RNSkAndroidPlatformContext.h>
@@ -17,9 +18,6 @@ class RNSkManager;
 
 namespace jsi = facebook::jsi;
 
-using JSCallInvokerHolder =
-    jni::alias_ref<facebook::react::CallInvokerHolder::javaobject>;
-
 using JavaPlatformContext = jni::alias_ref<JniPlatformContext::javaobject>;
 
 class JniSkiaManager : public jni::HybridClass<JniSkiaManager> {
@@ -30,7 +28,8 @@ public:
 
   static jni::local_ref<jni::HybridClass<JniSkiaManager>::jhybriddata>
   initHybrid(jni::alias_ref<jhybridobject> jThis, jlong jsContext,
-             JSCallInvokerHolder jsCallInvokerHolder,
+             jni::alias_ref<facebook::react::JRuntimeExecutor::javaobject>
+                 jRuntimeExecutor,
              JavaPlatformContext platformContext);
 
   static void registerNatives();

package/android/src/main/java/com/shopify/reactnative/skia/SkiaDomView.java

@@ -5,14 +5,15 @@ import android.content.Context;
 import com.facebook.jni.HybridData;
 import com.facebook.jni.annotations.DoNotStrip;
 import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.uimanager.ThemedReactContext;
 
 public class SkiaDomView extends SkiaBaseView {
     @DoNotStrip
     private HybridData mHybridData;
 
-    public SkiaDomView(Context context) {
+    public SkiaDomView(ThemedReactContext context) {
         super(context);
-        RNSkiaModule skiaModule = ((ReactContext) context).getNativeModule(RNSkiaModule.class);
+        RNSkiaModule skiaModule = context.getReactApplicationContext().getNativeModule(RNSkiaModule.class);
         mHybridData = initHybrid(skiaModule.getSkiaManager());
     }
 

package/android/src/main/java/com/shopify/reactnative/skia/SkiaManager.java

@@ -3,7 +3,7 @@ package com.shopify.reactnative.skia;
 import com.facebook.jni.HybridData;
 import com.facebook.proguard.annotations.DoNotStrip;
 import com.facebook.react.bridge.ReactContext;
-import com.facebook.react.turbomodule.core.CallInvokerHolderImpl;
+import com.facebook.react.bridge.RuntimeExecutor;
 
 @DoNotStrip
 public class SkiaManager {
@@ -22,11 +22,11 @@ public class SkiaManager {
         super();
         mContext = context;
 
-        CallInvokerHolderImpl holder = (CallInvokerHolderImpl) context.getCatalystInstance().getJSCallInvokerHolder();
+        RuntimeExecutor runtimeExecutor = ReactNativeCompatible.getRuntimeExecutor(context);
 
         mPlatformContext = new PlatformContext(context);
 
-        mHybridData = initHybrid(context.getJavaScriptContextHolder().get(), holder, mPlatformContext);
+        mHybridData = initHybrid(context.getJavaScriptContextHolder().get(), runtimeExecutor, mPlatformContext);
 
         initializeRuntime();
     }
@@ -48,7 +48,7 @@ public class SkiaManager {
     public void onHostPause() {  mPlatformContext.onPause(); }
 
     // private C++ functions
-    private native HybridData initHybrid(long jsContext, CallInvokerHolderImpl jsCallInvokerHolder,
+    private native HybridData initHybrid(long jsContext, RuntimeExecutor runtimeExecutor,
             PlatformContext platformContext);
 
     private native void initializeRuntime();

package/android/src/reactnative69/java/com/shopify/reactnative/skia/ReactNativeCompatible.java

@@ -0,0 +1,11 @@
+package com.shopify.reactnative.skia;
+
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.bridge.RuntimeExecutor;
+
+/* package */ final class ReactNativeCompatible {
+    public static RuntimeExecutor getRuntimeExecutor(ReactContext context) {
+        return context.getCatalystInstance().getRuntimeExecutor();
+    }
+}
+

package/android/src/reactnative74/java/com/shopify/reactnative/skia/ReactNativeCompatible.java

@@ -0,0 +1,14 @@
+package com.shopify.reactnative.skia;
+
+import androidx.annotation.OptIn;
+
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.bridge.RuntimeExecutor;
+import com.facebook.react.common.annotations.FrameworkAPI;
+
+/* package */ final class ReactNativeCompatible {
+    @OptIn(markerClass = FrameworkAPI.class)
+    public static RuntimeExecutor getRuntimeExecutor(ReactContext context) {
+        return context.getRuntimeExecutor();
+    }
+}

package/lib/commonjs/Platform/IPlatform.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { NodeHandle, ViewComponent } from "react-native";
+import type { DataModule } from "../skia/types";
+export interface IPlatform {
+    OS: string;
+    PixelRatio: number;
+    findNodeHandle: (componentOrHandle: null | number | React.Component<any, any> | React.ComponentClass<any>) => null | NodeHandle;
+    resolveAsset: (source: DataModule) => string;
+    View: typeof ViewComponent;
+}

package/lib/commonjs/Platform/IPlatform.js

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

package/lib/commonjs/Platform/IPlatform.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["IPlatform.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type { NodeHandle, ViewComponent } from \"react-native\";\n\nimport type { DataModule } from \"../skia/types\";\n\nexport interface IPlatform {\n  OS: string;\n  PixelRatio: number;\n  findNodeHandle: (\n    componentOrHandle:\n      | null\n      | number\n      | React.Component<any, any>\n      | React.ComponentClass<any>\n  ) => null | NodeHandle;\n  resolveAsset: (source: DataModule) => string;\n  View: typeof ViewComponent;\n}\n"],"mappings":""}

package/lib/commonjs/Platform/Platform.d.ts

@@ -0,0 +1,2 @@
+import type { IPlatform } from "./IPlatform";
+export declare const Platform: IPlatform;

package/lib/commonjs/Platform/Platform.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Platform = void 0;
+var _reactNative = require("react-native");
+var _types = require("../skia/types");
+const Platform = exports.Platform = {
+  OS: _reactNative.Platform.OS,
+  PixelRatio: _reactNative.PixelRatio.get(),
+  resolveAsset: source => {
+    return (0, _types.isRNModule)(source) ? _reactNative.Image.resolveAssetSource(source).uri : source.default;
+  },
+  findNodeHandle: _reactNative.findNodeHandle,
+  View: _reactNative.View
+};
+//# sourceMappingURL=Platform.js.map

package/lib/commonjs/Platform/Platform.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","_types","Platform","exports","OS","RNPlatform","PixelRatio","get","resolveAsset","source","isRNModule","Image","resolveAssetSource","uri","default","findNodeHandle","View"],"sources":["Platform.ts"],"sourcesContent":["import {\n  Image,\n  PixelRatio,\n  Platform as RNPlatform,\n  findNodeHandle,\n  View,\n} from \"react-native\";\n\nimport type { DataModule } from \"../skia/types\";\nimport { isRNModule } from \"../skia/types\";\n\nimport type { IPlatform } from \"./IPlatform\";\n\nexport const Platform: IPlatform = {\n  OS: RNPlatform.OS,\n  PixelRatio: PixelRatio.get(),\n  resolveAsset: (source: DataModule) => {\n    return isRNModule(source)\n      ? Image.resolveAssetSource(source).uri\n      : source.default;\n  },\n  findNodeHandle,\n  View,\n};\n"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AASA,IAAAC,MAAA,GAAAD,OAAA;AAIO,MAAME,QAAmB,GAAAC,OAAA,CAAAD,QAAA,GAAG;EACjCE,EAAE,EAAEC,qBAAU,CAACD,EAAE;EACjBE,UAAU,EAAEA,uBAAU,CAACC,GAAG,CAAC,CAAC;EAC5BC,YAAY,EAAGC,MAAkB,IAAK;IACpC,OAAO,IAAAC,iBAAU,EAACD,MAAM,CAAC,GACrBE,kBAAK,CAACC,kBAAkB,CAACH,MAAM,CAAC,CAACI,GAAG,GACpCJ,MAAM,CAACK,OAAO;EACpB,CAAC;EACDC,cAAc,EAAdA,2BAAc;EACdC,IAAI,EAAJA;AACF,CAAC"}

package/lib/commonjs/Platform/Platform.web.d.ts

@@ -0,0 +1,2 @@
+import type { IPlatform } from "./IPlatform";
+export declare const Platform: IPlatform;

package/lib/commonjs/Platform/Platform.web.js

@@ -0,0 +1,144 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Platform = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _types = require("../skia/types");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+// eslint-disable-next-line max-len
+// https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/modules/useElementLayout/index.js
+const DOM_LAYOUT_HANDLER_NAME = "__reactLayoutHandler";
+let resizeObserver = null;
+const getObserver = () => {
+  if (resizeObserver == null) {
+    resizeObserver = new window.ResizeObserver(function (entries) {
+      entries.forEach(entry => {
+        const node = entry.target;
+        const {
+          left,
+          top,
+          width,
+          height
+        } = entry.contentRect;
+        const onLayout = node[DOM_LAYOUT_HANDLER_NAME];
+        if (typeof onLayout === "function") {
+          // setTimeout 0 is taken from react-native-web (UIManager)
+          setTimeout(() => onLayout({
+            timeStamp: Date.now(),
+            nativeEvent: {
+              layout: {
+                x: left,
+                y: top,
+                width,
+                height
+              }
+            },
+            currentTarget: 0,
+            target: 0,
+            bubbles: false,
+            cancelable: false,
+            defaultPrevented: false,
+            eventPhase: 0,
+            isDefaultPrevented() {
+              throw new Error("Method not supported on web.");
+            },
+            isPropagationStopped() {
+              throw new Error("Method not supported on web.");
+            },
+            persist() {
+              throw new Error("Method not supported on web.");
+            },
+            preventDefault() {
+              throw new Error("Method not supported on web.");
+            },
+            stopPropagation() {
+              throw new Error("Method not supported on web.");
+            },
+            isTrusted: true,
+            type: ""
+          }), 0);
+        }
+      });
+    });
+  }
+  return resizeObserver;
+};
+const useElementLayout = (ref, onLayout) => {
+  const observer = getObserver();
+  (0, _react.useLayoutEffect)(() => {
+    const node = ref.current;
+    if (node !== null) {
+      node[DOM_LAYOUT_HANDLER_NAME] = onLayout;
+    }
+  }, [ref, onLayout]);
+  (0, _react.useLayoutEffect)(() => {
+    const node = ref.current;
+    if (node != null && observer != null) {
+      if (typeof node[DOM_LAYOUT_HANDLER_NAME] === "function") {
+        observer.observe(node);
+      } else {
+        observer.unobserve(node);
+      }
+    }
+    return () => {
+      if (node != null && observer != null) {
+        observer.unobserve(node);
+      }
+    };
+  }, [observer, ref]);
+};
+const View = ({
+  children,
+  onLayout,
+  style: rawStyle
+}) => {
+  const style = (0, _react.useMemo)(() => rawStyle !== null && rawStyle !== void 0 ? rawStyle : {}, [rawStyle]);
+  const ref = (0, _react.useRef)(null);
+  useElementLayout(ref, onLayout);
+  const cssStyles = (0, _react.useMemo)(() => {
+    return {
+      ...style,
+      display: "flex",
+      flexDirection: style.flexDirection || "inherit",
+      flexWrap: style.flexWrap || "nowrap",
+      justifyContent: style.justifyContent || "flex-start",
+      alignItems: style.alignItems || "stretch",
+      alignContent: style.alignContent || "stretch"
+    };
+  }, [style]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    ref: ref,
+    style: cssStyles
+  }, children);
+};
+const Platform = exports.Platform = {
+  OS: "web",
+  PixelRatio: typeof window !== "undefined" ? window.devicePixelRatio : 1,
+  // window is not defined on node
+  resolveAsset: source => {
+    if ((0, _types.isRNModule)(source)) {
+      if (typeof source === "number" && typeof require === "function") {
+        const {
+          getAssetByID
+        } = require("react-native/Libraries/Image/AssetRegistry");
+        const {
+          httpServerLocation,
+          name,
+          type
+        } = getAssetByID(source);
+        const uri = `${httpServerLocation}/${name}.${type}`;
+        return uri;
+      }
+      throw new Error("Asset source is a number - this is not supported on the web");
+    }
+    return source.default;
+  },
+  findNodeHandle: () => {
+    throw new Error("findNodeHandle is not supported on the web");
+  },
+  View
+};
+//# sourceMappingURL=Platform.web.js.map

package/lib/commonjs/Platform/Platform.web.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_types","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","DOM_LAYOUT_HANDLER_NAME","resizeObserver","getObserver","window","ResizeObserver","entries","forEach","entry","node","target","left","top","width","height","contentRect","onLayout","setTimeout","timeStamp","Date","now","nativeEvent","layout","x","y","currentTarget","bubbles","cancelable","defaultPrevented","eventPhase","isDefaultPrevented","Error","isPropagationStopped","persist","preventDefault","stopPropagation","isTrusted","type","useElementLayout","ref","observer","useLayoutEffect","current","observe","unobserve","View","children","style","rawStyle","useMemo","useRef","cssStyles","display","flexDirection","flexWrap","justifyContent","alignItems","alignContent","createElement","Platform","exports","OS","PixelRatio","devicePixelRatio","resolveAsset","source","isRNModule","getAssetByID","httpServerLocation","name","uri","findNodeHandle"],"sources":["Platform.web.tsx"],"sourcesContent":["import type { RefObject, CSSProperties } from \"react\";\nimport React, { useLayoutEffect, useMemo, useRef } from \"react\";\nimport type { LayoutChangeEvent, ViewComponent, ViewProps } from \"react-native\";\n\nimport type { DataModule } from \"../skia/types\";\nimport { isRNModule } from \"../skia/types\";\n\nimport type { IPlatform } from \"./IPlatform\";\n\n// eslint-disable-next-line max-len\n// https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/modules/useElementLayout/index.js\nconst DOM_LAYOUT_HANDLER_NAME = \"__reactLayoutHandler\";\ntype OnLayout = ((event: LayoutChangeEvent) => void) | undefined;\ntype Div = HTMLDivElement & {\n  __reactLayoutHandler: OnLayout;\n};\n\nlet resizeObserver: ResizeObserver | null = null;\n\nconst getObserver = () => {\n  if (resizeObserver == null) {\n    resizeObserver = new window.ResizeObserver(function (entries) {\n      entries.forEach((entry) => {\n        const node = entry.target as Div;\n        const { left, top, width, height } = entry.contentRect;\n        const onLayout = node[DOM_LAYOUT_HANDLER_NAME];\n        if (typeof onLayout === \"function\") {\n          // setTimeout 0 is taken from react-native-web (UIManager)\n          setTimeout(\n            () =>\n              onLayout({\n                timeStamp: Date.now(),\n                nativeEvent: { layout: { x: left, y: top, width, height } },\n                currentTarget: 0,\n                target: 0,\n                bubbles: false,\n                cancelable: false,\n                defaultPrevented: false,\n                eventPhase: 0,\n                isDefaultPrevented() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                isPropagationStopped() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                persist() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                preventDefault() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                stopPropagation() {\n                  throw new Error(\"Method not supported on web.\");\n                },\n                isTrusted: true,\n                type: \"\",\n              }),\n            0\n          );\n        }\n      });\n    });\n  }\n  return resizeObserver;\n};\n\nconst useElementLayout = (ref: RefObject<Div>, onLayout: OnLayout) => {\n  const observer = getObserver();\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node !== null) {\n      node[DOM_LAYOUT_HANDLER_NAME] = onLayout;\n    }\n  }, [ref, onLayout]);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node != null && observer != null) {\n      if (typeof node[DOM_LAYOUT_HANDLER_NAME] === \"function\") {\n        observer.observe(node);\n      } else {\n        observer.unobserve(node);\n      }\n    }\n    return () => {\n      if (node != null && observer != null) {\n        observer.unobserve(node);\n      }\n    };\n  }, [observer, ref]);\n};\n\nconst View = (({ children, onLayout, style: rawStyle }: ViewProps) => {\n  const style = useMemo(() => (rawStyle ?? {}) as CSSProperties, [rawStyle]);\n  const ref = useRef<Div>(null);\n  useElementLayout(ref, onLayout);\n  const cssStyles = useMemo(() => {\n    return {\n      ...style,\n      display: \"flex\",\n      flexDirection: style.flexDirection || \"inherit\",\n      flexWrap: style.flexWrap || \"nowrap\",\n      justifyContent: style.justifyContent || \"flex-start\",\n      alignItems: style.alignItems || \"stretch\",\n      alignContent: style.alignContent || \"stretch\",\n    };\n  }, [style]);\n\n  return (\n    <div ref={ref} style={cssStyles}>\n      {children}\n    </div>\n  );\n}) as unknown as typeof ViewComponent;\n\nexport const Platform: IPlatform = {\n  OS: \"web\",\n  PixelRatio: typeof window !== \"undefined\" ? window.devicePixelRatio : 1, // window is not defined on node\n  resolveAsset: (source: DataModule) => {\n    if (isRNModule(source)) {\n      if (typeof source === \"number\" && typeof require === \"function\") {\n        const {\n          getAssetByID,\n        } = require(\"react-native/Libraries/Image/AssetRegistry\");\n        const { httpServerLocation, name, type } = getAssetByID(source);\n        const uri = `${httpServerLocation}/${name}.${type}`;\n        return uri;\n      }\n      throw new Error(\n        \"Asset source is a number - this is not supported on the web\"\n      );\n    }\n    return source.default;\n  },\n  findNodeHandle: () => {\n    throw new Error(\"findNodeHandle is not supported on the web\");\n  },\n  View,\n};\n"],"mappings":"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"}

package/lib/commonjs/Platform/index.d.ts

@@ -0,0 +1 @@
+export * from "./Platform";

package/lib/commonjs/Platform/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _Platform = require("./Platform");
+Object.keys(_Platform).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Platform[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Platform[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/lib/commonjs/Platform/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_Platform","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./Platform\";\n"],"mappings":";;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,SAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,SAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,SAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}

package/lib/commonjs/animation/functions/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./interpolate";
+export * from "./interpolateColors";
+export * from "./interpolateVector";
+export * from "./interpolatePaths";

package/lib/commonjs/animation/functions/index.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _interpolate = require("./interpolate");
+Object.keys(_interpolate).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _interpolate[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _interpolate[key];
+    }
+  });
+});
+var _interpolateColors = require("./interpolateColors");
+Object.keys(_interpolateColors).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _interpolateColors[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _interpolateColors[key];
+    }
+  });
+});
+var _interpolateVector = require("./interpolateVector");
+Object.keys(_interpolateVector).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _interpolateVector[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _interpolateVector[key];
+    }
+  });
+});
+var _interpolatePaths = require("./interpolatePaths");
+Object.keys(_interpolatePaths).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _interpolatePaths[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _interpolatePaths[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/lib/commonjs/animation/functions/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_interpolate","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_interpolateColors","_interpolateVector","_interpolatePaths"],"sources":["index.ts"],"sourcesContent":["export * from \"./interpolate\";\nexport * from \"./interpolateColors\";\nexport * from \"./interpolateVector\";\nexport * from \"./interpolatePaths\";\n"],"mappings":";;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,YAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,YAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,YAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,kBAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,kBAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,kBAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,kBAAA,CAAAL,GAAA;IAAA;EAAA;AAAA;AACA,IAAAM,kBAAA,GAAAV,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAQ,kBAAA,EAAAP,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAM,kBAAA,CAAAN,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAE,kBAAA,CAAAN,GAAA;IAAA;EAAA;AAAA;AACA,IAAAO,iBAAA,GAAAX,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAS,iBAAA,EAAAR,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAO,iBAAA,CAAAP,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAG,iBAAA,CAAAP,GAAA;IAAA;EAAA;AAAA"}

package/lib/commonjs/animation/functions/interpolate.d.ts

@@ -0,0 +1,17 @@
+export declare enum Extrapolate {
+    IDENTITY = "identity",
+    CLAMP = "clamp",
+    EXTEND = "extend"
+}
+export interface ExtrapolationConfig {
+    extrapolateLeft?: Extrapolate | string;
+    extrapolateRight?: Extrapolate | string;
+}
+interface RequiredExtrapolationConfig {
+    extrapolateLeft: Extrapolate;
+    extrapolateRight: Extrapolate;
+}
+export type ExtrapolationType = ExtrapolationConfig | Extrapolate | string | undefined;
+export declare function validateInterpolationOptions(type: ExtrapolationType): RequiredExtrapolationConfig;
+export declare function interpolate(x: number, input: readonly number[], output: readonly number[], type?: ExtrapolationType): number;
+export {};