react-native-unistyles 3.0.0-beta.7 → 3.0.0-experimental-2025051401

package/README.md

@@ -15,9 +15,22 @@
 ## Installation
 
 ```shell
-yarn add react-native-unistyles@beta
+yarn add react-native-unistyles@next
 ```
 
+Install dependencies:
+
+```shell
+yarn add react-native-edge-to-edge react-native-nitro-modules@0.25.2
+```
+
+> To avoid unexpected behavior, always use a fixed version of `react-native-nitro-modules`
+
+| react-native-unistyles | react-native-nitro-modules |
+|------------------------|----------------------------|
+| 3.0.0-nightly-20250513 | 0.25.2                     |
+| 3.0.0-rc.4             | 0.25.2                     |
+
 Then follow [installation guides](https://unistyl.es/v3/start/getting-started) for your platform.
 
 ## [Documentation](https://unistyl.es/)
@@ -65,44 +78,53 @@ Then follow [installation guides](https://unistyl.es/v3/start/getting-started) f
 <a href="https://github.com/oscklm">
      <img src="https://avatars.githubusercontent.com/u/22825865?v=4" height="70px" width="70px" alt="oscklm" />
 </a>
-<a href="https://github.com/guillaumehcht">
-     <img src="https://avatars.githubusercontent.com/u/80776475?v=4" height="70px" width="70px" alt="guillaumehcht" />
+<a href="https://github.com/ryanlanciaux">
+     <img src="https://avatars.githubusercontent.com/u/85041?v=4" height="70px" width="70px" alt="ryanlanciaux" />
 </a>
-<a href="https://github.com/FilipiRafael">
-     <img src="https://avatars.githubusercontent.com/u/61629642?v=4" height="70px" width="70px" alt="FilipiRafael" />
-</a>
-<a href="https://github.com/4cc3ssX">
-     <img src="https://avatars.githubusercontent.com/u/57473799?v=4" height="70px" width="70px" alt="4cc3ssX" />
-</a>
-<a href="https://github.com/dacoto97">
-     <img src="https://avatars.githubusercontent.com/u/16915053?v=4" height="70px" width="70px" alt="dacoto97" />
+<a href="https://github.com/loopsware">
+     <img src="https://avatars.githubusercontent.com/u/161434039?s=200&v=4" height="70px" width="70px" alt="loopsware" />
 </a>
 
 ## Past sponsors
 
 <a href="https://github.com/kmartinezmedia">
-     <img src="https://avatars.githubusercontent.com/u/6308123?s=200&v=4" height="70px" width="70px" alt="kmartinezmedia" />
+     <img src="https://avatars.githubusercontent.com/u/6308123?s=200&v=4" height="60px" width="60px" alt="kmartinezmedia" />
 </a>
 <a href="https://github.com/levibuzolic">
-     <img src="https://avatars.githubusercontent.com/u/721323?v=4" height="70px" width="70px" alt="levibuzolic" />
+     <img src="https://avatars.githubusercontent.com/u/721323?v=4" height="60px" width="60px" alt="levibuzolic" />
 </a>
 <a href="https://github.com/claudesortwell">
-     <img src="https://avatars.githubusercontent.com/u/41422239?v=4" height="70px" width="70px" alt="claudesortwell" />
+     <img src="https://avatars.githubusercontent.com/u/41422239?v=4" height="60px" width="60px" alt="claudesortwell" />
 </a>
 <a href="https://github.com/luoxuhai">
-     <img src="https://avatars.githubusercontent.com/u/37284154?v=4" height="70px" width="70px" alt="luoxuhai" />
+     <img src="https://avatars.githubusercontent.com/u/37284154?v=4" height="60px" width="60px" alt="luoxuhai" />
 </a>
 <a href="https://github.com">
-     <img src="https://avatars.githubusercontent.com/u/113348625?v=4" height="70px" width="70px" alt="anonymous" />
+     <img src="https://avatars.githubusercontent.com/u/113348625?v=4" height="60px" width="60px" alt="anonymous" />
 </a>
 <a href="https://github.com/abanobboles">
-     <img src="https://avatars.githubusercontent.com/u/9078953?v=4" height="70px" width="70px" alt="abanobboles" />
+     <img src="https://avatars.githubusercontent.com/u/9078953?v=4" height="60px" width="60px" alt="abanobboles" />
 </a>
 <a href="https://github.com/hyoban">
-     <img src="https://avatars.githubusercontent.com/u/38493346?v=4" height="70px" width="70px" alt="hyoban" />
+     <img src="https://avatars.githubusercontent.com/u/38493346?v=4" height="60px" width="60px" alt="hyoban" />
 </a>
 <a href="https://github.com/giovannilondero">
-     <img src="https://avatars.githubusercontent.com/u/10998991?v=4" height="70px" width="70px" alt="giovannilondero" />
+     <img src="https://avatars.githubusercontent.com/u/10998991?v=4" height="60px" width="60px" alt="giovannilondero" />
+</a>
+<a href="https://github.com/4cc3ssX">
+     <img src="https://avatars.githubusercontent.com/u/57473799?v=4" height="60px" width="60px" alt="4cc3ssX" />
+</a>
+<a href="https://github.com/FilipiRafael">
+     <img src="https://avatars.githubusercontent.com/u/61629642?v=4" height="60px" width="60px" alt="FilipiRafael" />
+</a>
+<a href="https://github.com/dacoto97">
+     <img src="https://avatars.githubusercontent.com/u/16915053?v=4" height="60px" width="60px" alt="dacoto97" />
+</a>
+<a href="https://github.com/chinamcafee">
+     <img src="https://avatars.githubusercontent.com/u/3439961?v=4" height="60px" width="60px" alt="chinamcafee" />
+</a>
+<a href="https://github.com/guillaumehcht">
+     <img src="https://avatars.githubusercontent.com/u/80776475?v=4" height="60px" width="60px" alt="guillaumehcht" />
 </a>
 
 ## Sponsor my work

package/Unistyles.podspec

@@ -29,6 +29,7 @@ Pod::Spec.new do |s|
   if ENV["USE_FRAMEWORKS"]
     s.dependency "React-Core"
     add_dependency(s, "React-jsinspector", :framework_name => "jsinspector_modern")
+    add_dependency(s, "React-jsinspectortracing", :framework_name => 'jsinspector_moderntracing')
     add_dependency(s, "React-rendererconsistency", :framework_name => "React_rendererconsistency")
   end
 

package/android/CMakeLists.txt

@@ -23,7 +23,8 @@ include_directories(
     ../cxx/shadowTree
 )
 
-string(APPEND CMAKE_CXX_FLAGS " -DFOLLY_NO_CONFIG=1 -DFOLLY_CFG_NO_COROUTINES=1 -DFOLLY_MOBILE=1")
+# Nitro appends all Folly Flags, leaving it empty
+string(APPEND CMAKE_CXX_FLAGS " ")
 
 set_target_properties(unistyles PROPERTIES
     CXX_STANDARD 20

package/android/src/main/cxx/NativeUnistylesModule.cpp

@@ -10,19 +10,16 @@ using namespace facebook::react;
 UnistylesModule::UnistylesModule(
     jni::alias_ref<UnistylesModule::jhybridobject> jThis,
     jni::alias_ref<react::JRuntimeExecutor::javaobject> runtimeExecutorHolder,
-    jni::alias_ref<JFabricUIManager::javaobject> fabricUIManager,
     jni::alias_ref<JHybridNativePlatformSpec::javaobject> nativePlatform
 ):  _runtimeExecutor(runtimeExecutorHolder->cthis()->get()),
-    _uiManager(fabricUIManager->getBinding()->getScheduler()->getUIManager()),
     _nativePlatform(nativePlatform->cthis()) {}
 
 jni::local_ref<UnistylesModule::jhybriddata> UnistylesModule::initHybrid(
     jni::alias_ref<UnistylesModule::jhybridobject> jThis,
     jni::alias_ref<JRuntimeExecutor::javaobject> runtimeExecutorHolder,
-    jni::alias_ref<JFabricUIManager::javaobject> fabricUIManager,
     jni::alias_ref<JHybridNativePlatformSpec::javaobject> nativePlatform
 ) {
-    return makeCxxInstance(jThis, runtimeExecutorHolder, fabricUIManager, nativePlatform);
+    return makeCxxInstance(jThis, runtimeExecutorHolder, nativePlatform);
 }
 
 void UnistylesModule::registerNatives() {
@@ -34,10 +31,9 @@ void UnistylesModule::registerNatives() {
 
 jni::local_ref<BindingsInstallerHolder::javaobject> UnistylesModule::getBindingsInstaller(jni::alias_ref<UnistylesModule::javaobject> jobj) {
     auto& runtimeExecutor = jobj->cthis()->_runtimeExecutor;
-    auto& uiManager = jobj->cthis()->_uiManager;
     auto& nativePlatform = jobj->cthis()->_nativePlatform;
 
-    return BindingsInstallerHolder::newObjectCxxArgs([&runtimeExecutor, &uiManager, &nativePlatform](jsi::Runtime& rt) {
+    return BindingsInstallerHolder::newObjectCxxArgs([&runtimeExecutor, &nativePlatform](jsi::Runtime& rt) {
         // function is called on: first init and every live reload
         // check if this is live reload, if so let's replace UnistylesRuntime with new runtime
         auto hasUnistylesRuntime = HybridObjectRegistry::hasHybridObject("UnistylesRuntime");
@@ -56,7 +52,7 @@ jni::local_ref<BindingsInstallerHolder::javaobject> UnistylesModule::getBindings
 
         // init hybrids
         auto unistylesRuntime = std::make_shared<HybridUnistylesRuntime>(nativePlatform, rt, runOnJSThread);
-        auto styleSheet = std::make_shared<HybridStyleSheet>(unistylesRuntime, uiManager);
+        auto styleSheet = std::make_shared<HybridStyleSheet>(unistylesRuntime);
 
         HybridObjectRegistry::registerHybridObjectConstructor("UnistylesRuntime", [unistylesRuntime]() -> std::shared_ptr<HybridObject>{
             return unistylesRuntime;

package/android/src/main/cxx/NativeUnistylesModule.h

@@ -1,7 +1,6 @@
 #pragma once
 
 #include <ReactCommon/BindingsInstallerHolder.h>
-#include <react/fabric/JFabricUIManager.h>
 #include <react/jni/JRuntimeExecutor.h>
 #include <react/renderer/scheduler/Scheduler.h>
 #include <fbjni/fbjni.h>
@@ -19,7 +18,6 @@ struct UnistylesModule : public jni::HybridClass<UnistylesModule> {
     explicit UnistylesModule(
         jni::alias_ref<jhybridobject> jThis,
         jni::alias_ref<react::JRuntimeExecutor::javaobject> runtimeExecutorHolder,
-        jni::alias_ref<JFabricUIManager::javaobject> fabricUIManager,
         jni::alias_ref<JHybridNativePlatformSpec::javaobject> nativePlatform
     );
 
@@ -27,14 +25,12 @@ struct UnistylesModule : public jni::HybridClass<UnistylesModule> {
     static jni::local_ref<jhybriddata> initHybrid(
         jni::alias_ref<jhybridobject> jThis,
         jni::alias_ref<JRuntimeExecutor::javaobject> runtimeExecutorHolder,
-        jni::alias_ref<JFabricUIManager::javaobject>,
         jni::alias_ref<JHybridNativePlatformSpec::javaobject> nativePlatform
     );
 
     static jni::local_ref<BindingsInstallerHolder::javaobject> getBindingsInstaller(jni::alias_ref<UnistylesModule::javaobject> jThis);
 
 private:
-    std::shared_ptr<UIManager> _uiManager;
     RuntimeExecutor _runtimeExecutor;
     std::shared_ptr<HybridNativePlatformSpec> _nativePlatform;
 };

package/android/src/main/java/com/unistyles/NativePlatform+android.kt

@@ -27,7 +27,7 @@ import java.util.Locale
 @Keep
 @DoNotStrip
 class NativePlatformAndroid(private val reactContext: ReactApplicationContext): HybridNativePlatformSpec(), LifecycleEventListener {
-    private val _insets = NativePlatformInsets(reactContext, this::getMiniRuntime) { this.diffMiniRuntime() }
+    private val _insets = NativePlatformInsets(reactContext, this::getMiniRuntime) { this.onConfigChange() }
     private var _miniRuntime: UnistylesNativeMiniRuntime = buildMiniRuntime()
     private val _listener = NativePlatformListener(reactContext, this::getMiniRuntime) { this.diffMiniRuntime() }
 
@@ -263,6 +263,10 @@ class NativePlatformAndroid(private val reactContext: ReactApplicationContext):
         return changedDependencies
     }
 
+    private fun onConfigChange() {
+        this._listener.onConfigChange()
+    }
+
     override fun registerPlatformListener(callback: (dependencies: Array<UnistyleDependency>, miniRuntime: UnistylesNativeMiniRuntime) -> Unit) {
         this._listener.addPlatformListener(callback)
     }

package/android/src/main/java/com/unistyles/NativePlatform+insets.kt

@@ -12,7 +12,6 @@ import androidx.core.view.WindowInsetsCompat
 import com.facebook.proguard.annotations.DoNotStrip
 import com.facebook.react.bridge.ReactApplicationContext
 import com.margelo.nitro.unistyles.Insets
-import com.margelo.nitro.unistyles.UnistyleDependency
 import com.margelo.nitro.unistyles.UnistylesNativeMiniRuntime
 
 typealias CxxImeListener = (miniRuntime: UnistylesNativeMiniRuntime) -> Unit
@@ -22,8 +21,9 @@ typealias CxxImeListener = (miniRuntime: UnistylesNativeMiniRuntime) -> Unit
 class NativePlatformInsets(
     private val reactContext: ReactApplicationContext,
     private val getMiniRuntime: () -> UnistylesNativeMiniRuntime,
-    private val diffMiniRuntime: () -> Array<UnistyleDependency>
+    private val onConfigChange: () -> Unit
 ) {
+    private var _shouldListenToImeEvents = false
     private val _imeListeners: MutableList<CxxImeListener> = mutableListOf()
     private var _insets: Insets = Insets(0.0, 0.0, 0.0, 0.0, 0.0)
 
@@ -105,7 +105,7 @@ class NativePlatformInsets(
             return
         }
 
-        diffMiniRuntime()
+        this@NativePlatformInsets.onConfigChange()
 
         if (shouldEmitImeEvent) {
             this@NativePlatformInsets.emitImeEvent(this.getMiniRuntime())
@@ -113,6 +113,8 @@ class NativePlatformInsets(
     }
 
     fun startInsetsListener() {
+        _shouldListenToImeEvents = true
+
         reactContext.currentActivity?.let { activity ->
             activity.findViewById<View>(android.R.id.content)?.let { mainView ->
                 ViewCompat.setOnApplyWindowInsetsListener(mainView) { _, insets ->
@@ -130,6 +132,10 @@ class NativePlatformInsets(
                                 insets: WindowInsetsCompat,
                                 runningAnimations: List<WindowInsetsAnimationCompat>
                             ): WindowInsetsCompat {
+                                if (!_shouldListenToImeEvents) {
+                                    return insets
+                                }
+
                                 runningAnimations.firstOrNull()?.let {
                                     val bottomInset = insets.getInsets(WindowInsetsCompat.Type.ime()).bottom.toDouble() - this@NativePlatformInsets._insets.bottom
                                     val nextBottomInset = if (bottomInset < 0) {
@@ -160,9 +166,10 @@ class NativePlatformInsets(
         reactContext.currentActivity?.let { activity ->
             activity.window?.decorView?.let { view ->
                 ViewCompat.setOnApplyWindowInsetsListener(view, null)
-                ViewCompat.setWindowInsetsAnimationCallback(view, null)
             }
         }
+
+        _shouldListenToImeEvents = false
     }
 
     fun addImeListener(listener: CxxImeListener) {

package/android/src/main/java/com/unistyles/NativePlatform+listener.kt

@@ -27,7 +27,7 @@ class NativePlatformListener(
         override fun onReceive(context: Context, intent: Intent) {
             Handler(Looper.getMainLooper()).postDelayed({
                 this@NativePlatformListener.onConfigChange()
-            }, 10)
+            }, 25)
         }
     }
 

package/android/src/main/java/com/unistyles/UnistylesModule.kt

@@ -5,11 +5,8 @@ import com.facebook.jni.HybridData
 import com.facebook.proguard.annotations.DoNotStrip
 import com.facebook.react.bridge.ReactApplicationContext
 import com.facebook.react.bridge.RuntimeExecutor
-import com.facebook.react.fabric.FabricUIManager
 import com.facebook.react.turbomodule.core.interfaces.BindingsInstallerHolder
 import com.facebook.react.turbomodule.core.interfaces.TurboModuleWithJSIBindings
-import com.facebook.react.uimanager.UIManagerHelper
-import com.facebook.react.uimanager.common.UIManagerType
 import com.margelo.nitro.unistyles.HybridNativePlatformSpec
 import com.margelo.nitro.unistyles.unistylesOnLoad.Companion.initializeNative
 
@@ -34,10 +31,8 @@ class UnistylesModule(reactContext: ReactApplicationContext): NativeTurboUnistyl
     private fun initializeHybridData(reactContext: ReactApplicationContext): HybridData {
         val runtimeExecutor = reactContext.catalystInstance?.runtimeExecutor
             ?: throw IllegalStateException("Unistyles: React Native runtime executor is not available. Please follow installation guides.")
-        val fabricUIManager = UIManagerHelper.getUIManager(reactContext, UIManagerType.FABRIC) as? FabricUIManager
-            ?: throw IllegalStateException("Unistyles: Fabric UI Manager is not available. Please follow installation guides.")
 
-        return initHybrid(runtimeExecutor, fabricUIManager, _nativePlatform)
+        return initHybrid(runtimeExecutor, _nativePlatform)
     }
 
     @DoNotStrip
@@ -46,7 +41,6 @@ class UnistylesModule(reactContext: ReactApplicationContext): NativeTurboUnistyl
     @DoNotStrip
     private external fun initHybrid(
         runtimeExecutor: RuntimeExecutor,
-        fabricUIManager: FabricUIManager,
         nativePlatform: HybridNativePlatformSpec
     ): HybridData
 }

package/components/native/ActivityIndicator/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/ActivityIndicator.js",
   "module": "../../../lib/module/components/native/ActivityIndicator.js",
+  "browser": "../../../lib/module/components/native/ActivityIndicator.js",
   "react-native": "../../../src/components/native/ActivityIndicator.tsx"
 }

package/components/native/Animated/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/Animated.js",
   "module": "../../../lib/module/components/native/Animated.js",
+  "browser": "../../../lib/module/components/native/Animated.js",
   "react-native": "../../../src/components/native/Animated.tsx"
 }

package/components/native/FlatList/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/FlatList.js",
   "module": "../../../lib/module/components/native/FlatList.js",
+  "browser": "../../../lib/module/components/native/FlatList.js",
   "react-native": "../../../src/components/native/FlatList.tsx"
 }

package/components/native/Image/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/Image.js",
   "module": "../../../lib/module/components/native/Image.js",
-  "react-native": "../../../src/components/native/Image.tsx"
+  "browser": "../../../lib/module/components/native/Image.js",
+  "react-native": "../../../src/components/native/Image.native.tsx"
 }

package/components/native/ImageBackground/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/ImageBackground.js",
   "module": "../../../lib/module/components/native/ImageBackground.js",
+  "browser": "../../../lib/module/components/native/ImageBackground.js",
   "react-native": "../../../src/components/native/ImageBackground.native.tsx"
 }

package/components/native/KeyboardAvoidingView/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/KeyboardAvoidingView.js",
   "module": "../../../lib/module/components/native/KeyboardAvoidingView.js",
+  "browser": "../../../lib/module/components/native/KeyboardAvoidingView.js",
   "react-native": "../../../src/components/native/KeyboardAvoidingView.tsx"
 }

package/components/native/NativeText/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/NativeText.js",
   "module": "../../../lib/module/components/native/NativeText.js",
+  "browser": "../../../lib/module/components/native/NativeText.js",
   "react-native": "../../../src/components/native/NativeText.native.tsx"
 }

package/components/native/NativeView/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/NativeView.js",
   "module": "../../../lib/module/components/native/NativeView.js",
+  "browser": "../../../lib/module/components/native/NativeView.js",
   "react-native": "../../../src/components/native/NativeView.native.tsx"
 }

package/components/native/Pressable/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/Pressable.js",
   "module": "../../../lib/module/components/native/Pressable.js",
+  "browser": "../../../lib/module/components/native/Pressable.js",
   "react-native": "../../../src/components/native/Pressable.native.tsx"
 }

package/components/native/RefreshControl/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/RefreshControl.js",
   "module": "../../../lib/module/components/native/RefreshControl.js",
+  "browser": "../../../lib/module/components/native/RefreshControl.js",
   "react-native": "../../../src/components/native/RefreshControl.tsx"
 }

package/components/native/ScrollView/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/ScrollView.js",
   "module": "../../../lib/module/components/native/ScrollView.js",
+  "browser": "../../../lib/module/components/native/ScrollView.js",
   "react-native": "../../../src/components/native/ScrollView.tsx"
 }

package/components/native/SectionList/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/SectionList.js",
   "module": "../../../lib/module/components/native/SectionList.js",
+  "browser": "../../../lib/module/components/native/SectionList.js",
   "react-native": "../../../src/components/native/SectionList.tsx"
 }

package/components/native/Switch/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/Switch.js",
   "module": "../../../lib/module/components/native/Switch.js",
+  "browser": "../../../lib/module/components/native/Switch.js",
   "react-native": "../../../src/components/native/Switch.tsx"
 }

package/components/native/Text/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/Text.js",
   "module": "../../../lib/module/components/native/Text.js",
+  "browser": "../../../lib/module/components/native/Text.js",
   "react-native": "../../../src/components/native/Text.tsx"
 }

package/components/native/TextInput/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/TextInput.js",
   "module": "../../../lib/module/components/native/TextInput.js",
+  "browser": "../../../lib/module/components/native/TextInput.js",
   "react-native": "../../../src/components/native/TextInput.tsx"
 }

package/components/native/TouchableHighlight/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/TouchableHighlight.js",
   "module": "../../../lib/module/components/native/TouchableHighlight.js",
+  "browser": "../../../lib/module/components/native/TouchableHighlight.js",
   "react-native": "../../../src/components/native/TouchableHighlight.tsx"
 }

package/components/native/TouchableOpacity/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/TouchableOpacity.js",
   "module": "../../../lib/module/components/native/TouchableOpacity.js",
+  "browser": "../../../lib/module/components/native/TouchableOpacity.js",
   "react-native": "../../../src/components/native/TouchableOpacity.tsx"
 }

package/components/native/View/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/View.js",
   "module": "../../../lib/module/components/native/View.js",
+  "browser": "../../../lib/module/components/native/View.js",
   "react-native": "../../../src/components/native/View.tsx"
 }

package/components/native/VirtualizedList/package.json

@@ -1,5 +1,6 @@
 {
   "main": "../../../lib/commonjs/components/native/VirtualizedList.js",
   "module": "../../../lib/module/components/native/VirtualizedList.js",
+  "browser": "../../../lib/module/components/native/VirtualizedList.js",
   "react-native": "../../../src/components/native/VirtualizedList.tsx"
 }

package/cxx/common/Helpers.h

@@ -122,6 +122,10 @@ inline Variants variantsToPairs(jsi::Runtime& rt, jsi::Object&& variants) {
         if (variantValue.isString()) {
             pairs.emplace_back(std::make_pair(variantName, variantValue.asString(rt).utf8(rt)));
         }
+
+        if (variantValue.isNumber()) {
+            pairs.emplace_back(std::make_pair(variantName, std::to_string(static_cast<int>(variantValue.asNumber()))));
+        }
     });
 
     return pairs;
@@ -225,4 +229,89 @@ inline static jsi::Array dependenciesToJSIArray(jsi::Runtime& rt, const std::vec
     return result;
 }
 
+inline void debugPrintJSIObject(jsi::Runtime& rt, std::string& name, jsi::Object& obj) {
+    auto console = rt.global().getPropertyAsObject(rt, "console");
+    auto log = console.getPropertyAsFunction(rt, "log");
+    auto parser = [&](const std::string& key, jsi::Value& value){
+        if (value.isBool()) {
+            std::string output = key + ": " + (value.getBool() ? "true" : "false");
+            log.call(rt, output);
+
+            return;
+        }
+
+        if (value.isNumber()) {
+            std::string output = key + ": " + std::to_string(value.getNumber());
+            log.call(rt, output);
+
+            return;
+        }
+
+        if (value.isString()) {
+            std::string output = key + ": " + value.getString(rt).utf8(rt);
+            log.call(rt, output);
+
+            return;
+        }
+
+        if (value.isUndefined()) {
+            std::string output = key + ": undefined";
+            log.call(rt, output);
+
+            return;
+        }
+
+        if (value.isNull()) {
+            std::string output = key + ": null";
+            log.call(rt, output);
+
+            return;
+        }
+    };
+
+    log.call(rt, "===" + name + "===");
+
+    enumerateJSIObject(rt, obj, [&](const std::string& key, jsi::Value& value){
+        if (value.isObject()) {
+            if (value.asObject(rt).isArray(rt)) {
+                iterateJSIArray(rt, value.asObject(rt).asArray(rt), [&](size_t i, jsi::Value& nestedValue){
+                    std::string printableKey = key + ": Array[" + std::to_string(i) + "]";
+
+                    log.call(rt, printableKey);
+
+                    if (nestedValue.isObject()) {
+                        enumerateJSIObject(rt, nestedValue.asObject(rt), [&](const std::string& nestedKey, jsi::Value& nestedValue){
+                            parser(nestedKey, nestedValue);
+                        });
+                    } else {
+                        parser(printableKey, nestedValue);
+                    }
+
+                    std::string endKey = key + ": Array[end]";
+
+                    log.call(rt, endKey);
+                });
+            }
+
+            if (value.asObject(rt).isFunction(rt)) {
+                std::string output = key + ": [Function]";
+
+                log.call(rt, output);
+
+                return;
+            }
+
+            enumerateJSIObject(rt, value.asObject(rt), [&](const std::string& nestedKey, jsi::Value& nestedValue){
+                parser(nestedKey, nestedValue);
+            });
+
+            return;
+        }
+
+        parser(key, value);
+    });
+
+    log.call(rt, "===/" + name + "===");
+}
+
 }

package/cxx/core/HostUnistyle.cpp

@@ -87,19 +87,28 @@ jsi::Function HostUnistyle::createAddVariantsProxyFunction(jsi::Runtime& rt) {
         Variants variants = helpers::variantsToPairs(rt, arguments[0].asObject(rt));
         parser::Parser parser = parser::Parser(this->_unistylesRuntime);
 
-        helpers::enumerateJSIObject(rt, thisVal.asObject(rt), [this, &parser, &rt, &variants](const std::string& name, jsi::Value& value){
-            if (name == helpers::ADD_VARIANTS_FN || !this->_stylesheet->unistyles.contains(name)) {
+        auto stylesheetCopy = std::make_shared<StyleSheet>(
+            this->_stylesheet->tag,
+            this->_stylesheet->type,
+            jsi::Value(rt, this->_stylesheet->rawValue).asObject(rt)
+        );
+        
+        parser.buildUnistyles(rt, stylesheetCopy);
+        parser.parseUnistyles(rt, stylesheetCopy);
+        
+        helpers::enumerateJSIObject(rt, thisVal.asObject(rt), [this, &parser, &rt, &variants, stylesheetCopy](const std::string& name, jsi::Value& value){
+            if (name == helpers::ADD_VARIANTS_FN || !stylesheetCopy->unistyles.contains(name)) {
                 return;
             }
 
-            auto unistyle = this->_stylesheet->unistyles[name];
-
+            auto unistyle = stylesheetCopy->unistyles[name];
+            
             if (unistyle->dependsOn(UnistyleDependency::VARIANTS)) {
                 parser.rebuildUnistyle(rt, unistyle, variants, std::nullopt);
             }
         });
 
-        auto style = std::make_shared<core::HostUnistyle>(this->_stylesheet, this->_unistylesRuntime, variants);
+        auto style = std::make_shared<core::HostUnistyle>(stylesheetCopy, this->_unistylesRuntime, variants);
         auto styleHostObject = jsi::Object::createFromHostObject(rt, style);
 
         return styleHostObject;

package/cxx/core/StyleSheet.h

@@ -3,7 +3,7 @@
 #include <jsi/jsi.h>
 #include "Unistyle.h"
 #include "Helpers.h"
-#include "Constants.h"
+#include "UnistylesConstants.h"
 
 namespace margelo::nitro::unistyles::core {
 

package/cxx/core/UnistyleWrapper.h

@@ -5,7 +5,7 @@
 #include "UnistylesRegistry.h"
 #include "Helpers.h"
 #include "HybridUnistylesRuntime.h"
-#include "Constants.h"
+#include "UnistylesConstants.h"
 #include "Parser.h"
 
 namespace margelo::nitro::unistyles::core {