@react-native-ohos/react-native-reanimated 4.0.2 → 4.1.0-beta.1

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/PseudoStyles/PseudoSelector.h

@@ -0,0 +1,41 @@
+#pragma once
+
+#include <optional>
+#include <string>
+
+namespace reanimated {
+
+// Defines all supported selectors and their merge priority (last = highest priority).
+// When you update this remember to also change kPseudoSelectorBits so it uses the last value
+enum class PseudoSelector : std::uint8_t {
+  FocusWithin = 0,
+  Focus = 1,
+  Hover = 2,
+  Active = 3,
+  ActiveDeepest = 4,
+};
+
+inline constexpr int kPseudoSelectorBits = static_cast<int>(PseudoSelector::ActiveDeepest) + 1;
+
+using PseudoSelectorMask = std::uint8_t;
+
+inline std::optional<PseudoSelector> pseudoSelectorFromString(const std::string &s) {
+  if (s == ":focus-within") {
+    return PseudoSelector::FocusWithin;
+  }
+  if (s == ":focus") {
+    return PseudoSelector::Focus;
+  }
+  if (s == ":hover") {
+    return PseudoSelector::Hover;
+  }
+  if (s == ":active") {
+    return PseudoSelector::Active;
+  }
+  if (s == ":active-deepest") {
+    return PseudoSelector::ActiveDeepest;
+  }
+  return std::nullopt;
+}
+
+} // namespace reanimated

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/PseudoStyles/PseudoStylesRegistry.cpp

@@ -0,0 +1,113 @@
+#include <reanimated/PseudoStyles/PseudoStylesRegistry.h>
+
+#include <react/debug/react_native_assert.h>
+
+#include <string>
+#include <utility>
+
+namespace reanimated {
+
+using namespace facebook::react;
+
+PseudoStylesRegistry::PseudoStylesRegistry(
+    PlatformAttachPseudoSelectorFunction attachFn,
+    PlatformDetachPseudoSelectorFunction detachFn,
+    std::shared_ptr<css::CSSTransitionsRegistry> cssTransitionsRegistry,
+    std::shared_ptr<UpdatesRegistryManager> updatesRegistryManager)
+    : attachFn_(std::move(attachFn)),
+      detachFn_(std::move(detachFn)),
+      cssTransitionsRegistry_(std::move(cssTransitionsRegistry)),
+      updatesRegistryManager_(std::move(updatesRegistryManager)) {}
+
+// static
+std::array<folly::dynamic, (1u << kPseudoSelectorBits)> PseudoStylesRegistry::recomputeAllStyles(
+    const TagEntry &entry) {
+  const PseudoSelectorMask maxMask = (1u << kPseudoSelectorBits);
+  std::array<folly::dynamic, (1u << kPseudoSelectorBits)> newPrecomputedStyles;
+
+  for (PseudoSelectorMask mask = 0; mask < maxMask; ++mask) {
+    folly::dynamic style = entry.defaults;
+
+    for (const auto &[sel, data] : entry.selectors) {
+      if (mask & (1u << static_cast<int>(sel))) {
+        style.update(data.selectorStyle);
+      }
+    }
+
+    newPrecomputedStyles[mask] = std::move(style);
+  }
+
+  return newPrecomputedStyles;
+}
+
+void PseudoStylesRegistry::registerPseudoStyles(
+    Tag tag,
+    const std::shared_ptr<const ShadowNode> &shadowNode,
+    const folly::dynamic &defaults,
+    const std::vector<SelectorRegistration> &selectors) {
+  react_native_assert(UpdatesRegistryManager::isLockedByCurrentThread());
+
+  auto &entry = registry_[tag];
+  entry.shadowNode = shadowNode;
+  entry.defaults = defaults;
+  for (const auto &registration : selectors) {
+    entry.selectors[registration.selector] = {registration.selectorStyle};
+  }
+  entry.precomputedStyles = recomputeAllStyles(entry);
+
+  for (const auto &registration : selectors) {
+    const auto selector = registration.selector;
+    attachFn_(
+        tag,
+        selector,
+        [weakThis = std::weak_ptr<PseudoStylesRegistry>(shared_from_this()), tag, selector](bool isActive) {
+          if (auto strongThis = weakThis.lock()) {
+            strongThis->onSelectorStateChanged(tag, selector, isActive);
+          }
+        });
+  }
+}
+
+void PseudoStylesRegistry::remove(Tag tag) {
+  react_native_assert(UpdatesRegistryManager::isLockedByCurrentThread());
+
+  auto it = registry_.find(tag);
+  if (it == registry_.end()) {
+    return;
+  }
+  auto selectorsToDetach = std::move(it->second.selectors);
+  registry_.erase(it);
+
+  for (const auto &[selector, data] : selectorsToDetach) {
+    detachFn_(tag, selector);
+  }
+}
+
+void PseudoStylesRegistry::onSelectorStateChanged(Tag tag, PseudoSelector selector, bool isActive) {
+  auto lock = updatesRegistryManager_->lock();
+
+  auto it = registry_.find(tag);
+  if (it == registry_.end()) {
+    return;
+  }
+  TagEntry &entry = it->second;
+
+  const PseudoSelectorMask oldMask = entry.activeMask;
+  const PseudoSelectorMask bit = 1u << static_cast<int>(selector);
+  entry.activeMask = isActive ? (oldMask | bit) : (oldMask & ~bit);
+
+  const auto shadowNode = entry.shadowNode;
+  const auto &fromStyle = entry.precomputedStyles[oldMask];
+  const auto &toStyle = entry.precomputedStyles[entry.activeMask];
+
+  css::PropertyValueDynamicDiffsMap valueChanges;
+  for (const auto &[propKey, toVal] : toStyle.items()) {
+    const auto propName = propKey.asString();
+    const folly::dynamic &fromVal = fromStyle.count(propName) ? fromStyle[propName] : toVal;
+    valueChanges.emplace(propName, std::make_pair(fromVal, toVal));
+  }
+
+  cssTransitionsRegistry_->run(shadowNode, valueChanges);
+}
+
+} // namespace reanimated

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/PseudoStyles/PseudoStylesRegistry.h

@@ -0,0 +1,73 @@
+#pragma once
+
+#include <reanimated/CSS/common/definitions.h>
+#include <reanimated/CSS/registries/CSSTransitionsRegistry.h>
+#include <reanimated/Fabric/updates/UpdatesRegistryManager.h>
+#include <reanimated/PseudoStyles/PseudoSelector.h>
+#include <reanimated/Tools/PlatformDepMethodsHolder.h>
+
+#include <react/renderer/core/ShadowNode.h>
+
+#include <folly/dynamic.h>
+#include <array>
+#include <map>
+#include <memory>
+#include <unordered_map>
+#include <vector>
+
+namespace reanimated {
+
+using namespace facebook;
+using namespace react;
+
+class PseudoStylesRegistry : public std::enable_shared_from_this<PseudoStylesRegistry> {
+ public:
+  PseudoStylesRegistry(
+      PlatformAttachPseudoSelectorFunction attachFn,
+      PlatformDetachPseudoSelectorFunction detachFn,
+      std::shared_ptr<css::CSSTransitionsRegistry> cssTransitionsRegistry,
+      std::shared_ptr<UpdatesRegistryManager> updatesRegistryManager);
+
+  struct SelectorRegistration {
+    PseudoSelector selector;
+    folly::dynamic selectorStyle;
+  };
+
+  void registerPseudoStyles(
+      Tag tag,
+      const std::shared_ptr<const ShadowNode> &shadowNode,
+      const folly::dynamic &defaults,
+      const std::vector<SelectorRegistration> &selectors);
+
+  void remove(Tag tag);
+
+ private:
+  struct SelectorData {
+    folly::dynamic selectorStyle;
+  };
+
+  struct TagEntry {
+    std::shared_ptr<const ShadowNode> shadowNode;
+
+    folly::dynamic defaults = folly::dynamic::object();
+    std::map<PseudoSelector, SelectorData> selectors;
+
+    std::array<folly::dynamic, (1u << kPseudoSelectorBits)> precomputedStyles;
+
+    PseudoSelectorMask activeMask = 0;
+  };
+
+  std::unordered_map<Tag, TagEntry> registry_;
+
+  PlatformAttachPseudoSelectorFunction attachFn_;
+  PlatformDetachPseudoSelectorFunction detachFn_;
+
+  std::shared_ptr<css::CSSTransitionsRegistry> cssTransitionsRegistry_;
+  std::shared_ptr<UpdatesRegistryManager> updatesRegistryManager_;
+
+  static std::array<folly::dynamic, (1u << kPseudoSelectorBits)> recomputeAllStyles(const TagEntry &entry);
+
+  void onSelectorStateChanged(Tag tag, PseudoSelector selector, bool isActive);
+};
+
+} // namespace reanimated

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/RuntimeDecorators/RNRuntimeDecorator.cpp

@@ -1,6 +1,6 @@
 #include <reanimated/RuntimeDecorators/RNRuntimeDecorator.h>
+#include <reanimated/Tools/ReaJSIUtils.h>
 #include <reanimated/Tools/ReanimatedVersion.h>
-#include <worklets/Tools/WorkletsJSIUtils.h>
 
 #include <memory>
 
@@ -20,7 +20,7 @@ void RNRuntimeDecorator::decorate(
   rnRuntime.global().setProperty(rnRuntime, "_WORKLET_RUNTIME", workletRuntimeValue);
 
 #ifndef NDEBUG
-  checkJSVersion(rnRuntime, reanimatedModuleProxy->getJSLogger());
+  checkJSVersion(rnRuntime);
 #endif // NDEBUG
 
 #ifdef IS_REANIMATED_EXAMPLE_APP
@@ -32,14 +32,14 @@ void RNRuntimeDecorator::decorate(
   rnRuntime.global().setProperty(rnRuntime, "_REANIMATED_IS_REDUCED_MOTION", reanimatedModuleProxy->isReducedMotion());
 
   rnRuntime.global().setProperty(
-      rnRuntime, "__reanimatedModuleProxy", jsi::Object::createFromHostObject(rnRuntime, reanimatedModuleProxy));
+      rnRuntime, "__reanimatedModuleProxy", reanimatedModuleProxy->toOptimizedObject(rnRuntime));
 }
 
 #ifdef IS_REANIMATED_EXAMPLE_APP
 void RNRuntimeDecorator::installDebugBindings(
     jsi::Runtime &rnRuntime,
     const std::shared_ptr<ReanimatedModuleProxy> &reanimatedModuleProxy) {
-#if TARGET_OS_X
+#if defined(TARGET_OS_X) && TARGET_OS_X
   jsi_utils::installJsiFunction(
       rnRuntime, "__getTagFromShadowNodeWrapper", [](jsi::Runtime &rt, const jsi::Value &shadowNodeWrapper) {
         auto node = Bridging<std::shared_ptr<const ShadowNode>>::fromJs(rt, shadowNodeWrapper);

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/RuntimeDecorators/UIRuntimeDecorator.cpp

@@ -1,58 +1,33 @@
 #include <reanimated/RuntimeDecorators/UIRuntimeDecorator.h>
-#include <worklets/Tools/WorkletsJSIUtils.h>
-
-#include <utility>
+#include <reanimated/Tools/ReaJSIUtils.h>
 
 namespace reanimated {
 
-using namespace worklets;
-
 void UIRuntimeDecorator::decorate(
     jsi::Runtime &uiRuntime,
-    ObtainPropFunction obtainPropFunction,
-    UpdatePropsFunction updateProps,
-    MeasureFunction measure,
-    DispatchCommandFunction dispatchCommand,
-    GetAnimationTimestampFunction getAnimationTimestamp,
-    SetGestureStateFunction setGestureState,
-    ProgressLayoutAnimationFunction progressLayoutAnimation,
-    EndLayoutAnimationFunction endLayoutAnimation,
-    MaybeFlushUIUpdatesQueueFunction maybeFlushUIUpdatesQueue) {
-
-  jsi_utils::installJsiFunction(uiRuntime, "_updateProps", std::move(updateProps));
-  jsi_utils::installJsiFunction(uiRuntime, "_dispatchCommand", std::move(dispatchCommand));
-  jsi_utils::installJsiFunction(uiRuntime, "_measure", std::move(measure));
-  jsi_utils::installJsiFunction(uiRuntime, "_getAnimationTimestamp", std::move(getAnimationTimestamp));
-  jsi_utils::installJsiFunction(uiRuntime, "_notifyAboutProgress", std::move(progressLayoutAnimation));
-  jsi_utils::installJsiFunction(uiRuntime, "_notifyAboutEnd", std::move(endLayoutAnimation));
-  jsi_utils::installJsiFunction(uiRuntime, "_setGestureState", std::move(setGestureState));
-  jsi_utils::installJsiFunction(uiRuntime, "_obtainProp", std::move(obtainPropFunction));
-
-  subscribeForMicrotasksFinalization(uiRuntime, std::move(maybeFlushUIUpdatesQueue));
-}
-
-void UIRuntimeDecorator::subscribeForMicrotasksFinalization(
-    jsi::Runtime &uiRuntime,
-    MaybeFlushUIUpdatesQueueFunction maybeFlushUIUpdatesQueue) {
-  auto maybeMicrotaskQueueFinalizers = uiRuntime.global().getProperty(uiRuntime, "_microtaskQueueFinalizers");
-
-  if (maybeMicrotaskQueueFinalizers.isUndefined()) {
-    throw std::runtime_error(
-        "[Reanimated] Expected microtaskQueueFinalizers to be defined. "
-        "Perhaps Worklets failed to initialize the UI Runtime?");
+    const ObtainPropFunction &obtainPropFunction,
+    const UpdatePropsFunction &updateProps,
+    const MeasureFunction &measure,
+    const DispatchCommandFunction &dispatchCommand,
+    const GetAnimationTimestampFunction &getAnimationTimestamp,
+    const SetGestureStateFunction &setGestureState,
+    const ProgressLayoutAnimationFunction &progressLayoutAnimation,
+    const EndLayoutAnimationFunction &endLayoutAnimation,
+    const MaybeFlushUIUpdatesQueueFunction &maybeFlushUIUpdatesQueue,
+    const std::optional<worklets::RequestAnimationFrameHostFunction> &requestAnimationFrame) {
+
+  jsi_utils::installJsiFunction(uiRuntime, "_updateProps", updateProps);
+  jsi_utils::installJsiFunction(uiRuntime, "_dispatchCommand", dispatchCommand);
+  jsi_utils::installJsiFunction(uiRuntime, "_measure", measure);
+  jsi_utils::installJsiFunction(uiRuntime, "_getAnimationTimestamp", getAnimationTimestamp);
+  jsi_utils::installJsiFunction(uiRuntime, "_notifyAboutProgress", progressLayoutAnimation);
+  jsi_utils::installJsiFunction(uiRuntime, "_notifyAboutEnd", endLayoutAnimation);
+  jsi_utils::installJsiFunction(uiRuntime, "_setGestureState", setGestureState);
+  jsi_utils::installJsiFunction(uiRuntime, "_obtainProp", obtainPropFunction);
+  jsi_utils::installJsiFunction(uiRuntime, "_maybeFlushUIUpdatesQueue", maybeFlushUIUpdatesQueue);
+  if (requestAnimationFrame.has_value()) {
+    worklets::installRequestAnimationFrame(uiRuntime, *requestAnimationFrame);
   }
-
-  const auto microtaskQueueFinalizers = maybeMicrotaskQueueFinalizers.asObject(uiRuntime).asArray(uiRuntime);
-
-  microtaskQueueFinalizers.getPropertyAsFunction(uiRuntime, "push")
-      .callWithThis(
-          uiRuntime,
-          microtaskQueueFinalizers,
-          jsi::Function::createFromHostFunction(
-              uiRuntime,
-              jsi::PropNameID::forAscii(uiRuntime, "_maybeFlushUIUpdatesQueue"),
-              0,
-              jsi_utils::createHostFunction(std::move(maybeFlushUIUpdatesQueue))));
 }
 
 } // namespace reanimated

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/RuntimeDecorators/UIRuntimeDecorator.h

@@ -3,6 +3,9 @@
 #include <jsi/jsi.h>
 
 #include <reanimated/Tools/PlatformDepMethodsHolder.h>
+#include <worklets/Compat/StableApi.h>
+
+#include <optional>
 
 using namespace facebook;
 
@@ -12,20 +15,16 @@ class UIRuntimeDecorator {
  public:
   static void decorate(
       jsi::Runtime &uiRuntime,
-      const ObtainPropFunction obtainPropFunction,
-      const UpdatePropsFunction updateProps,
-      const MeasureFunction measure,
-      const DispatchCommandFunction dispatchCommand,
-      const GetAnimationTimestampFunction getAnimationTimestamp,
-      const SetGestureStateFunction setGestureState,
-      const ProgressLayoutAnimationFunction progressLayoutAnimation,
-      const EndLayoutAnimationFunction endLayoutAnimation,
-      const MaybeFlushUIUpdatesQueueFunction maybeFlushUIUpdatesQueue);
-
- private:
-  static void subscribeForMicrotasksFinalization(
-      jsi::Runtime &uiRuntime,
-      MaybeFlushUIUpdatesQueueFunction maybeFlushUIUpdatesQueue);
+      const ObtainPropFunction &obtainPropFunction,
+      const UpdatePropsFunction &updateProps,
+      const MeasureFunction &measure,
+      const DispatchCommandFunction &dispatchCommand,
+      const GetAnimationTimestampFunction &getAnimationTimestamp,
+      const SetGestureStateFunction &setGestureState,
+      const ProgressLayoutAnimationFunction &progressLayoutAnimation,
+      const EndLayoutAnimationFunction &endLayoutAnimation,
+      const MaybeFlushUIUpdatesQueueFunction &maybeFlushUIUpdatesQueue,
+      const std::optional<worklets::RequestAnimationFrameHostFunction> &requestAnimationFrame);
 };
 
 } // namespace reanimated

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/Tools/PlatformDepMethodsHolder.h

@@ -1,8 +1,12 @@
 #pragma once
 
+#include <reanimated/CSS/core/transition/CSSPlatformTransitionProxy.h>
+#include <reanimated/PseudoStyles/PseudoSelector.h>
+
 #include <folly/dynamic.h>
 #include <jsi/jsi.h>
 #include <react/renderer/core/ReactPrimitives.h>
+#include <reanimated/CSS/core/CSSPlatformAnimationFactory.h>
 
 #include <memory>
 #include <string>
@@ -27,11 +31,11 @@ using MeasureFunction = std::function<jsi::Value(jsi::Runtime &rt, const jsi::Va
 using RequestRenderFunction = std::function<void(std::function<void(const double)>)>;
 #ifdef ANDROID
 using SynchronouslyUpdateUIPropsFunction = std::function<void(const std::vector<int> &, const std::vector<double> &)>;
-#elif __APPLE__
+#elif defined(__APPLE__) || defined(__OHOS__)
+// OHOS follows the Apple-style API: per-tag update with a folly::dynamic props
+// map (see ReanimatedModule.cpp synchronouslyUpdateUIPropsFunction).
 using SynchronouslyUpdateUIPropsFunction = std::function<void(const int, const folly::dynamic &)>;
 #endif // ANDROID
-//TODO
-using SynchronouslyUpdateUIPropsFunction = std::function<void(const int, const folly::dynamic &)>;
 using PreserveMountedTagsFunction = std::function<std::optional<std::unique_ptr<int[]>>(std::vector<int> &)>;
 using GetAnimationTimestampFunction = std::function<double(void)>;
 
@@ -46,6 +50,10 @@ using KeyboardEventUnsubscribeFunction = std::function<void(int)>;
 using MaybeFlushUIUpdatesQueueFunction = std::function<void()>;
 
 using ForceScreenSnapshotFunction = std::function<void(Tag tag)>;
+
+using PlatformAttachPseudoSelectorFunction = std::function<void(Tag, PseudoSelector, std::function<void(bool)>)>;
+using PlatformDetachPseudoSelectorFunction = std::function<void(Tag, PseudoSelector)>;
+
 struct PlatformDepMethodsHolder {
   RequestRenderFunction requestRender;
 #ifdef ANDROID
@@ -62,6 +70,15 @@ struct PlatformDepMethodsHolder {
   KeyboardEventSubscribeFunction subscribeForKeyboardEvents;
   KeyboardEventUnsubscribeFunction unsubscribeFromKeyboardEvents;
   MaybeFlushUIUpdatesQueueFunction maybeFlushUIUpdatesQueueFunction;
+  PlatformAttachPseudoSelectorFunction attachPseudoSelector;
+  PlatformDetachPseudoSelectorFunction detachPseudoSelector;
+  css::CSSCanRoutePropertyFunction cssCanRouteProperty;
+  css::CSSApplyTransitionJSIFunction cssApplyTransitionJSI;
+  css::CSSApplyTransitionDynamicFunction cssApplyTransitionDynamic;
+  css::CSSRemoveTransitionFunction cssRemoveTransition;
+  // Last so platform initializers that don't supply it (iOS, Android today)
+  // can omit it and rely on value-init (= null shared_ptr).
+  std::shared_ptr<css::CSSPlatformAnimationFactory> platformAnimationFactory;
 };
 
 } // namespace reanimated

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/Tools/ReaJSIUtils.h

@@ -0,0 +1,227 @@
+#pragma once
+
+#include <jsi/jsi.h>
+#include <react/debug/react_native_assert.h>
+
+#include <concepts>
+#include <memory>
+#include <string>
+#include <tuple>
+#include <type_traits>
+#include <utility>
+
+using namespace facebook;
+
+namespace reanimated::jsi_utils {
+
+// `get` functions take a pointer to `jsi::Value` and
+// call an appropriate method to cast to the native type
+template <typename T>
+inline T get(jsi::Runtime &rt, const jsi::Value *value);
+
+template <>
+inline double get<double>(jsi::Runtime &, const jsi::Value *value) {
+  return value->asNumber();
+}
+
+template <>
+inline int get<int>(jsi::Runtime &, const jsi::Value *value) {
+  return value->asNumber();
+}
+
+template <>
+inline bool get<bool>(jsi::Runtime &, const jsi::Value *value) {
+  if (!value->isBool()) {
+    throw jsi::JSINativeException("[Reanimated] Expected a boolean.");
+  }
+  return value->getBool();
+}
+
+template <>
+inline jsi::Object get<jsi::Object>(jsi::Runtime &rt, const jsi::Value *value) {
+  return value->asObject(rt);
+}
+
+template <>
+inline jsi::Value const &get<jsi::Value const &>(jsi::Runtime &, const jsi::Value *value) {
+  return *value;
+}
+
+// `convertArgs` functions take a variadic template parameter of target (C++)
+// argument types `Targs` and a `jsi::Value` array `args`, and converts `args`
+// to a tuple of typed C++ arguments to be passed to the native implementation.
+// This is accomplished by dispatching (at compile time) to the correct
+// implementation based on the first type of `Targs`, using SFINAE to select the
+// correct specialization, and concatenating with the result of recursion on the
+// rest of `Targs`
+
+// BEGIN implementations for `convertArgs` specializations.
+// specialization for empty `Targs` - returns an empty tuple
+template <typename... TArgs>
+inline std::enable_if_t<(sizeof...(TArgs) == 0), std::tuple<>> convertArgs(jsi::Runtime &, const jsi::Value *) {
+  return std::make_tuple();
+}
+
+// calls `get<First>` on the first argument to retrieve the native type,
+// then calls recursively on the rest of `args`
+// and returns the concatenation of results
+template <typename T, typename... Rest>
+inline std::tuple<T, Rest...> convertArgs(jsi::Runtime &rt, const jsi::Value *args) {
+  auto arg = std::tuple<T>(get<T>(rt, args));
+  auto rest = convertArgs<Rest...>(rt, std::next(args));
+  return std::tuple_cat(std::move(arg), std::move(rest));
+}
+// END implementations for `convertArgs` specializations.
+
+// returns a tuple with the result of casting `args` to appropriate
+// native C++ types needed to call `function`
+template <typename Ret, typename... Args>
+std::tuple<Args...>
+getArgsForFunction(const std::function<Ret(Args...)> &, jsi::Runtime &rt, const jsi::Value *args, const size_t count) {
+  react_native_assert(sizeof...(Args) == count && "Argument list has different length than expected");
+  return convertArgs<Args...>(rt, args);
+}
+
+// returns a tuple with the result of casting `args` to appropriate
+// native C++ types needed to call `function`,
+// passing `rt` as the first argument
+template <typename Ret, typename... Args>
+std::tuple<jsi::Runtime &, Args...> getArgsForFunction(
+    const std::function<Ret(jsi::Runtime &, Args...)> &,
+    jsi::Runtime &rt,
+    const jsi::Value *args,
+    const size_t count) {
+  react_native_assert(sizeof...(Args) == count && "Argument list has different length than expected");
+  return std::tuple_cat(std::tie(rt), convertArgs<Args...>(rt, args));
+}
+
+// calls `function` with `args`
+template <typename Ret, typename... Args>
+inline jsi::Value apply(std::function<Ret(Args...)> function, std::tuple<Args...> args) {
+  return std::apply(function, std::move(args));
+}
+
+// calls string-returning `function` with `args`,
+// and returns the string
+template <typename... Args>
+inline jsi::Value apply(jsi::Runtime &rt, std::function<std::string(Args...)> function, std::tuple<Args...> args) {
+  return jsi::String::createFromUtf8(rt, std::apply(function, std::move(args)));
+}
+
+// calls void-returning `function` with `args`,
+// and returns `undefined`
+template <typename... Args>
+inline jsi::Value apply(std::function<void(Args...)> function, std::tuple<Args...> args) {
+  std::apply(function, std::move(args));
+  return jsi::Value::undefined();
+}
+
+// returns a function with JSI calling convention
+// from a native function `function`
+template <typename Fun>
+jsi::HostFunctionType createHostFunction(const Fun &function) {
+  return [function](jsi::Runtime &rt, const jsi::Value &, const jsi::Value *args, const size_t count) {
+    auto argz = getArgsForFunction(function, rt, args, count);
+    return apply(function, std::move(argz));
+  };
+}
+
+// returns a function with JSI calling convention
+// from a native function `function` returning a string
+template <typename... Args>
+jsi::HostFunctionType createHostFunction(const std::function<std::string(Args...)> &function) {
+  return [function](jsi::Runtime &rt, const jsi::Value &, const jsi::Value *args, const size_t count) {
+    auto argz = getArgsForFunction(function, rt, args, count);
+    return apply(rt, function, std::move(argz));
+  };
+}
+
+// used to determine if `function<Ret(Args...)>`
+// takes `Runtime &` as its first argument
+template <typename... Args>
+struct takes_runtime {
+  static constexpr size_t value = 0;
+};
+
+// specialization for `function<Ret(Runtime &, Rest...)`
+template <typename... Rest>
+struct takes_runtime<jsi::Runtime &, Rest...> {
+  static constexpr size_t value = 1;
+};
+
+// creates a JSI compatible function from `function`
+// and installs it as a global function named `name`
+// in the `rt` JS runtime
+template <typename Ret, typename... Args>
+void installJsiFunction(jsi::Runtime &rt, std::string_view name, const std::function<Ret(Args...)> &function) {
+  auto clb = createHostFunction(function);
+  auto argsCount = static_cast<unsigned int>(sizeof...(Args) - takes_runtime<Args...>::value);
+  jsi::Value jsiFunction =
+      jsi::Function::createFromHostFunction(rt, jsi::PropNameID::forAscii(rt, name.data()), argsCount, clb);
+  rt.global().setProperty(rt, name.data(), jsiFunction);
+}
+
+// this should take care of passing types convertible to `function`
+template <typename Fun>
+void installJsiFunction(jsi::Runtime &rt, std::string_view name, Fun function) {
+  installJsiFunction(rt, name, std::function(std::forward<Fun>(function)));
+}
+
+jsi::Array convertStringToArray(jsi::Runtime &rt, const std::string &value, const unsigned int expectedSize);
+
+jsi::Object optimizedFromHostObject(jsi::Runtime &rt, std::shared_ptr<jsi::HostObject> &&hostObject);
+
+template <size_t TIndex, size_t TLength>
+  requires(TIndex < TLength)
+constexpr const jsi::Value &at(const jsi::Value (&args)[TLength]) noexcept {
+  return args[TIndex];
+}
+
+template <size_t TLength, typename TFun>
+  requires(TLength > 0) &&
+    std::is_invocable_v<TFun &&, jsi::Runtime &, const jsi::Value &, const jsi::Value (&)[TLength]>
+void addMethod(jsi::Runtime &rt, jsi::Object &obj, const char *name, TFun &&func) {
+  obj.setProperty(
+      rt,
+      name,
+      jsi::Function::createFromHostFunction(
+          rt,
+          jsi::PropNameID::forAscii(rt, name),
+          TLength,
+          [func = std::forward<TFun>(func)](
+              jsi::Runtime &rt, const jsi::Value &thisVal, const jsi::Value *args, size_t) mutable -> jsi::Value {
+            using TReturn =
+                std::invoke_result_t<TFun &, jsi::Runtime &, const jsi::Value &, const jsi::Value(&)[TLength]>;
+            auto &typed = *reinterpret_cast<const jsi::Value(*)[TLength]>(args);
+            if constexpr (std::is_void_v<TReturn>) {
+              func(rt, thisVal, typed);
+              return jsi::Value::undefined();
+            } else {
+              return func(rt, thisVal, typed);
+            }
+          }));
+}
+
+template <size_t TLength, typename TFun>
+  requires(TLength == 0) && std::is_invocable_v<TFun &&, jsi::Runtime &, const jsi::Value &>
+void addMethod(jsi::Runtime &rt, jsi::Object &obj, const char *name, TFun &&func) {
+  obj.setProperty(
+      rt,
+      name,
+      jsi::Function::createFromHostFunction(
+          rt,
+          jsi::PropNameID::forAscii(rt, name),
+          0,
+          [func = std::forward<TFun>(func)](
+              jsi::Runtime &rt, const jsi::Value &thisVal, const jsi::Value *, size_t) mutable -> jsi::Value {
+            using TReturn = std::invoke_result_t<TFun &, jsi::Runtime &, const jsi::Value &>;
+            if constexpr (std::is_void_v<TReturn>) {
+              func(rt, thisVal);
+              return jsi::Value::undefined();
+            } else {
+              return func(rt, thisVal);
+            }
+          }));
+}
+
+} // namespace reanimated::jsi_utils