react-native-unistyles 3.6.0 → 3.7.0

package/README.md

@@ -34,7 +34,7 @@ yarn add react-native-unistyles react-native-nitro-modules
 | >= 3.3.0               | >= 0.36.1                              |
 | >= 3.4.0               | >= 0.37.1                              |
 
-> **Note:** Since v3.1.0, `react-native-edge-to-edge` is an **optional** dependency. We strongly recommend setting `edgeToEdgeEnabled=true` in your `android/gradle.properties` — it enforces translucent system bars on modals, disables legacy StatusBar hacks, and enables additional React Native core fixes. **Expo SDK 54+** enables this automatically. You can still install `react-native-edge-to-edge` for ecosystem compatibility with libraries like `react-native-bootsplash` or `react-native-permissions`.
+> **Note:** You don't need `react-native-edge-to-edge` (optional since v3.1.0, now deprecated). We strongly recommend setting `edgeToEdgeEnabled=true` in your `android/gradle.properties` instead — it enforces translucent system bars on modals, disables legacy StatusBar hacks, and enables additional React Native core fixes. **Expo SDK 54+** enables this automatically.
 
 Then follow [installation guides](https://unistyl.es/v3/start/getting-started) for your platform.
 
@@ -80,9 +80,6 @@ npx skills add jpudysz/react-native-unistyles
 <a href="https://github.com/jordmccord">
      <img src="https://avatars.githubusercontent.com/u/7591840?v=4" height="70px" width="70px" alt="jordmccord" />
 </a>
-<a href="https://github.com/kerwanp">
-     <img src="https://avatars.githubusercontent.com/u/36955373?v=4" height="70px" width="70px" alt="kerwanp" />
-</a>
 <a href="https://github.com/andkindness">
      <img src="https://avatars.githubusercontent.com/u/143941782?v=4" height="70px" width="70px" alt="andkindness" />
 </a>
@@ -171,6 +168,9 @@ npx skills add jpudysz/react-native-unistyles
 <a href="https://galaxies.dev">
      <img src="https://avatars.githubusercontent.com/u/118431096?s=200&v=4" height="60px" width="60px" alt="galaxies-dev" />
 </a>
+<a href="https://github.com/kerwanp">
+     <img src="https://avatars.githubusercontent.com/u/36955373?v=4" height="60px" width="60px" alt="kerwanp" />
+</a>
 
 ## Sponsor my work
 
@@ -185,11 +185,6 @@ Ko-fi: https://ko-fi.com/jpudysz
 Your support is greatly appreciated and helps me dedicate more time and resources to creating quality libraries. Thank you for all the support!
 
 
-## Discord
-Looking for help or you want to chat with me?
-
-[Join Discord](https://discord.gg/akGHf27P4C)
-
 ## Contributing
 The repository uses a git submodule ([unifiber](https://github.com/uni-stack/unifiber)). Clone it with `git clone --recurse-submodules`, or run `git submodule update --init` in an existing clone.
 

package/android/build.gradle

@@ -32,6 +32,48 @@ apply from: '../nitrogen/generated/android/unistyles+autolinking.gradle'
 // doesn't compile. It only compiles Kotlin directories from the kotlin source set.
 android.sourceSets.main.kotlin.srcDirs += ["${project.projectDir}/../nitrogen/generated/android/kotlin"]
 
+def resolveReactNativeMinorVersion() {
+    def reactNativeDir = safeExtGet("REACT_NATIVE_NODE_MODULES_DIR", null)
+
+    if (reactNativeDir == null) {
+        try {
+            def reactNativePackageJson = providers.exec {
+                workingDir(rootDir)
+                commandLine("node", "--print", "require.resolve('react-native/package.json')")
+            }.standardOutput.asText.get().trim()
+
+            reactNativeDir = file(reactNativePackageJson).parentFile
+        } catch (Exception ignored) {
+            reactNativeDir = file("${rootDir}/../node_modules/react-native")
+        }
+    }
+
+    def reactNativePackageJson = file("${reactNativeDir}/package.json")
+
+    if (!reactNativePackageJson.exists()) {
+        logger.warn("🦄 Unistyles: React Native not found. Set REACT_NATIVE_NODE_MODULES_DIR in your root build.gradle to enable features that require React Native 0.86+.")
+
+        return 0
+    }
+
+    String version = new groovy.json.JsonSlurper().parse(reactNativePackageJson).version
+
+    // nightlies
+    if (version.startsWith("0.0.0")) {
+        return Integer.MAX_VALUE
+    }
+
+    def (major, minor) = version.tokenize('.')
+
+    return major.toInteger() > 0 ? Integer.MAX_VALUE : minor.toInteger()
+}
+
+// Kotlin sources that use APIs available only in newer React Native versions
+def reactNativeSourceDir = resolveReactNativeMinorVersion() >= 86 ? "src/rn86/java" : "src/legacy/java"
+
+android.sourceSets.main.java.srcDirs += [reactNativeSourceDir]
+android.sourceSets.main.kotlin.srcDirs += [reactNativeSourceDir]
+
 def resolveBuildType() {
     Gradle gradle = getGradle()
     String tskReqStr = gradle.getStartParameter().getTaskRequests()['args'].toString()

package/android/src/legacy/java/com/unistyles/NativePlatform+extraWindows.kt

@@ -0,0 +1,16 @@
+package com.unistyles
+
+import android.view.Window
+import com.facebook.react.bridge.ReactApplicationContext
+
+// React Native below 0.86 doesn't report windows created on top of the Activity (e.g. Modal's Dialog)
+@Suppress("UNUSED_PARAMETER")
+class NativePlatformExtraWindows(
+    reactContext: ReactApplicationContext,
+    onWindowCreate: (window: Window) -> Unit,
+    onWindowDestroy: (window: Window) -> Unit
+) {
+    fun startObserving() {}
+
+    fun stopObserving() {}
+}

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

@@ -9,17 +9,14 @@ using namespace facebook::react;
 
 UnistylesModule::UnistylesModule(
     jni::alias_ref<UnistylesModule::jhybridobject> jThis,
-    jni::alias_ref<react::JRuntimeExecutor::javaobject> runtimeExecutorHolder,
     jni::alias_ref<JHybridNativePlatformSpec::JavaPart> nativePlatform
-):  _runtimeExecutor(runtimeExecutorHolder->cthis()->get()),
-    _nativePlatform(nativePlatform->getJHybridNativePlatformSpec()) {}
+):  _nativePlatform(nativePlatform->getJHybridNativePlatformSpec()) {}
 
 jni::local_ref<UnistylesModule::jhybriddata> UnistylesModule::initHybrid(
     jni::alias_ref<UnistylesModule::jhybridobject> jThis,
-    jni::alias_ref<JRuntimeExecutor::javaobject> runtimeExecutorHolder,
     jni::alias_ref<JHybridNativePlatformSpec::JavaPart> nativePlatform
 ) {
-    return makeCxxInstance(jThis, runtimeExecutorHolder, nativePlatform);
+    return makeCxxInstance(jThis, nativePlatform);
 }
 
 void UnistylesModule::registerNatives() {
@@ -32,10 +29,9 @@ void UnistylesModule::registerNatives() {
 
 jni::local_ref<BindingsInstallerHolder::javaobject> UnistylesModule::getBindingsInstaller(jni::alias_ref<UnistylesModule::javaobject> jobj) {
     auto* self = jobj->cthis();
-    auto& runtimeExecutor = self->_runtimeExecutor;
     auto& nativePlatform = self->_nativePlatform;
 
-    return BindingsInstallerHolder::newObjectCxxArgs([self, &runtimeExecutor, &nativePlatform](jsi::Runtime& rt) {
+    return BindingsInstallerHolder::newObjectCxxArgs([self, &nativePlatform](jsi::Runtime& rt, const std::shared_ptr<CallInvoker>& callInvoker) {
         // function is called on: first init and every live reload
         // newest runtime owns the registry, previous runtime's state is kept until it releases ownership
         self->_generation = core::UnistylesRegistry::get().takeOwnership();
@@ -49,10 +45,8 @@ jni::local_ref<BindingsInstallerHolder::javaobject> UnistylesModule::getBindings
             HybridObjectRegistry::unregisterHybridObjectConstructor("UnistylesShadowRegistry");
         }
 
-        auto runOnJSThread = [&runtimeExecutor](std::function<void(jsi::Runtime&)>&& callback) {
-            runtimeExecutor([callback = std::move(callback)](jsi::Runtime &rt) {
-                callback(rt);
-            });
+        auto runOnJSThread = [callInvoker](std::function<void(jsi::Runtime&)>&& callback) {
+            callInvoker->invokeAsync(std::move(callback));
         };
 
         // init hybrids

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

@@ -1,7 +1,6 @@
 #pragma once
 
 #include <ReactCommon/BindingsInstallerHolder.h>
-#include <react/jni/JRuntimeExecutor.h>
 #include <react/renderer/scheduler/Scheduler.h>
 #include "UnistylesRegistry.h"
 #include <fbjni/fbjni.h>
@@ -18,14 +17,12 @@ struct UnistylesModule : public jni::HybridClass<UnistylesModule> {
 
     explicit UnistylesModule(
         jni::alias_ref<jhybridobject> jThis,
-        jni::alias_ref<react::JRuntimeExecutor::javaobject> runtimeExecutorHolder,
         jni::alias_ref<JHybridNativePlatformSpec::JavaPart> nativePlatform
     );
 
     static void registerNatives();
     static jni::local_ref<jhybriddata> initHybrid(
         jni::alias_ref<jhybridobject> jThis,
-        jni::alias_ref<JRuntimeExecutor::javaobject> runtimeExecutorHolder,
         jni::alias_ref<JHybridNativePlatformSpec::JavaPart> nativePlatform
     );
     static void invalidateNative(jni::alias_ref<jhybridobject> jThis) {
@@ -38,7 +35,6 @@ struct UnistylesModule : public jni::HybridClass<UnistylesModule> {
     static jni::local_ref<BindingsInstallerHolder::javaobject> getBindingsInstaller(jni::alias_ref<UnistylesModule::javaobject> jThis);
 
 private:
-    RuntimeExecutor _runtimeExecutor;
     std::shared_ptr<HybridNativePlatformSpec> _nativePlatform;
     uint64_t _generation = 0;
 };

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

@@ -8,6 +8,7 @@ import android.os.Handler
 import android.os.Looper
 import android.util.DisplayMetrics
 import android.view.View
+import android.view.Window
 import android.view.WindowManager
 import androidx.annotation.Keep
 import androidx.core.content.OnConfigurationChangedProvider
@@ -33,13 +34,17 @@ import java.util.Locale
 @Keep
 @DoNotStrip
 class NativePlatformAndroid(private val reactContext: ReactApplicationContext): HybridNativePlatformSpec(), LifecycleEventListener {
-    private val _insets = NativePlatformInsets(reactContext, this::getMiniRuntime) { this.onConfigChange() }
+    private val _insets = NativePlatformInsets(reactContext, this::getMiniRuntime, this::onImeChange) { this.onConfigChange() }
+    @Volatile
     private var _miniRuntime: UnistylesNativeMiniRuntime = buildMiniRuntime()
     private val _listener = NativePlatformListener(reactContext, this::getMiniRuntime) { this.diffMiniRuntime() }
     private var _configurationProvider: WeakReference<OnConfigurationChangedProvider>? = null
     private val _activityConfigurationListener = Consumer<Configuration> {
         Handler(Looper.getMainLooper()).post { this.onConfigChange() }
     }
+    // windows created on top of the Activity, e.g. Modal's Dialog (React Native 0.86+)
+    private val _extraWindows: MutableList<Window> = mutableListOf()
+    private val _extraWindowsObserver = NativePlatformExtraWindows(reactContext, this::onExtraWindowCreate, this::onExtraWindowDestroy)
 
     // Application resources can lag behind configuration changes
     private val configurationResources: Resources
@@ -48,9 +53,12 @@ class NativePlatformAndroid(private val reactContext: ReactApplicationContext):
     init {
         checkEdgeToEdge()
         reactContext.addLifecycleEventListener(this)
+        _extraWindowsObserver.startObserving()
     }
 
     fun onDestroy() {
+        _extraWindowsObserver.stopObserving()
+        _extraWindows.clear()
         stopObservingActivityConfiguration()
         _listener.onDestroy()
         _insets.onDestroy()
@@ -90,6 +98,16 @@ class NativePlatformAndroid(private val reactContext: ReactApplicationContext):
         _configurationProvider = null
     }
 
+    private fun onExtraWindowCreate(window: Window) {
+        _extraWindows.add(window)
+        _insets.attachToExtraWindow(window)
+    }
+
+    private fun onExtraWindowDestroy(window: Window) {
+        _extraWindows.remove(window)
+        _insets.detachFromExtraWindow(window)
+    }
+
     override val memorySize: Long
         get() = 0
 
@@ -216,58 +234,78 @@ class NativePlatformAndroid(private val reactContext: ReactApplicationContext):
 
     override fun setNavigationBarHidden(isHidden: Boolean) {
         reactContext.currentActivity?.let { activity ->
-            WindowInsetsControllerCompat(activity.window, activity.window.decorView).apply {
-                activity.window?.decorView?.let { decorView ->
-                    @Suppress("DEPRECATION")
-                    activity.runOnUiThread {
-                        if (isHidden) {
-                            // below Android 11, we need to use window flags to hide the navigation bar
-                            if (Build.VERSION.SDK_INT <= Build.VERSION_CODES.Q) {
-                                decorView.systemUiVisibility = (View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
-                                    or View.SYSTEM_UI_FLAG_HIDE_NAVIGATION or View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY)
-                            } else {
-                                hide(WindowInsetsCompat.Type.navigationBars())
-                                systemBarsBehavior =
-                                    WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE
-                            }
-
-                            // dispatch new insets to invoke the insets listener
-                            val newInsets = WindowInsetsCompat.Builder()
-                                .setInsets(WindowInsetsCompat.Type.navigationBars(), androidx.core.graphics.Insets.of(0, 0, 0, 0))
-                                .build()
-
-                            ViewCompat.dispatchApplyWindowInsets(activity.findViewById(android.R.id.content), newInsets)
-                        } else {
-                            show(WindowInsetsCompat.Type.navigationBars())
-                        }
+            activity.window?.let { window ->
+                activity.runOnUiThread {
+                    setNavigationBarHidden(window, isHidden)
+
+                    if (isHidden) {
+                        // dispatch new insets to invoke the insets listener
+                        val newInsets = WindowInsetsCompat.Builder()
+                            .setInsets(WindowInsetsCompat.Type.navigationBars(), androidx.core.graphics.Insets.of(0, 0, 0, 0))
+                            .build()
+
+                        ViewCompat.dispatchApplyWindowInsets(activity.findViewById(android.R.id.content), newInsets)
+                    }
+
+                    // otherwise opened Modals would keep the previous state
+                    _extraWindows.forEach { extraWindow ->
+                        setNavigationBarHidden(extraWindow, isHidden)
                     }
                 }
             }
         }
     }
 
+    @Suppress("DEPRECATION")
+    private fun setNavigationBarHidden(window: Window, isHidden: Boolean) {
+        WindowInsetsControllerCompat(window, window.decorView).apply {
+            if (isHidden) {
+                // below Android 11, we need to use window flags to hide the navigation bar
+                if (Build.VERSION.SDK_INT <= Build.VERSION_CODES.Q) {
+                    window.decorView.systemUiVisibility = (View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
+                        or View.SYSTEM_UI_FLAG_HIDE_NAVIGATION or View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY)
+                } else {
+                    hide(WindowInsetsCompat.Type.navigationBars())
+                    systemBarsBehavior =
+                        WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE
+                }
+            } else {
+                show(WindowInsetsCompat.Type.navigationBars())
+            }
+        }
+    }
+
     override fun setStatusBarHidden(isHidden: Boolean) {
         reactContext.currentActivity?.let { activity ->
-            WindowInsetsControllerCompat(activity.window, activity.window.decorView).apply {
-                activity.window?.let { window ->
-                    @Suppress("DEPRECATION")
-                    activity.runOnUiThread {
-                        if (isHidden) {
-                            if (Build.VERSION.SDK_INT <= Build.VERSION_CODES.Q) {
-                                window.addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN)
-                                window.clearFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN)
-                            } else {
-                                hide(WindowInsetsCompat.Type.statusBars())
-                            }
-                        } else {
-                            show(WindowInsetsCompat.Type.statusBars())
-                        }
+            activity.window?.let { window ->
+                activity.runOnUiThread {
+                    setStatusBarHidden(window, isHidden)
+
+                    // otherwise opened Modals would keep the previous state
+                    _extraWindows.forEach { extraWindow ->
+                        setStatusBarHidden(extraWindow, isHidden)
                     }
                 }
             }
         }
     }
 
+    @Suppress("DEPRECATION")
+    private fun setStatusBarHidden(window: Window, isHidden: Boolean) {
+        WindowInsetsControllerCompat(window, window.decorView).apply {
+            if (isHidden) {
+                if (Build.VERSION.SDK_INT <= Build.VERSION_CODES.Q) {
+                    window.addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN)
+                    window.clearFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN)
+                } else {
+                    hide(WindowInsetsCompat.Type.statusBars())
+                }
+            } else {
+                show(WindowInsetsCompat.Type.statusBars())
+            }
+        }
+    }
+
     override fun setImmersiveMode(isEnabled: Boolean) {
         this.setStatusBarHidden(isEnabled)
         this.setNavigationBarHidden(isEnabled)
@@ -310,6 +348,11 @@ class NativePlatformAndroid(private val reactContext: ReactApplicationContext):
         this._listener.onConfigChange()
     }
 
+    // only the IME, other insets are diffed by onConfigChange
+    private fun onImeChange(ime: Double) {
+        this._miniRuntime = this._miniRuntime.copy(insets = this._miniRuntime.insets.copy(ime = ime))
+    }
+
     override fun registerPlatformListener(callback: (dependencies: Array<UnistyleDependency>, miniRuntime: UnistylesNativeMiniRuntime) -> Unit) {
         this._listener.addPlatformListener(callback)
     }

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

@@ -21,12 +21,16 @@ typealias CxxImeListener = (miniRuntime: UnistylesNativeMiniRuntime) -> Unit
 class NativePlatformInsets(
     private val reactContext: ReactApplicationContext,
     private val getMiniRuntime: () -> UnistylesNativeMiniRuntime,
+    private val onImeChange: (ime: Double) -> Unit,
     private val onConfigChange: () -> Unit
 ) {
     private var _didGetInsets = false
     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)
+    private val _extraWindows: MutableList<Window> = mutableListOf()
+    // the extra window that reported the keyboard last
+    private var _imeWindow: Window? = null
 
     init {
         // for SDK below 35, it's possible to get it synchronously
@@ -35,6 +39,9 @@ class NativePlatformInsets(
 
     fun onDestroy() {
         this.removeImeListeners()
+        _extraWindows.toList().forEach { window ->
+            detachFromExtraWindow(window)
+        }
     }
 
     fun getInsets(): Insets {
@@ -195,7 +202,73 @@ class NativePlatformInsets(
         }
     }
 
+    // From Android 11 IME insets are dispatched only to the window with the focused input (e.g. Modal's Dialog),
+    // so we need to listen to them there, as the Activity won't receive them. Below Android 11 the Activity's listener
+    // still gets them
+    fun attachToExtraWindow(window: Window) {
+        if (Build.VERSION.SDK_INT < 30) {
+            return
+        }
+
+        val mainView = window.decorView.findViewById<View>(android.R.id.content) ?: return
+
+        _extraWindows.add(window)
+
+        ViewCompat.setWindowInsetsAnimationCallback(
+            mainView,
+            object : WindowInsetsAnimationCompat.Callback(DISPATCH_MODE_CONTINUE_ON_SUBTREE) {
+                override fun onProgress(
+                    insets: WindowInsetsCompat,
+                    runningAnimations: List<WindowInsetsAnimationCompat>
+                ): WindowInsetsCompat {
+                    if (!_shouldListenToImeEvents) {
+                        return insets
+                    }
+
+                    runningAnimations.firstOrNull { animation ->
+                        animation.typeMask and WindowInsetsCompat.Type.ime() != 0
+                    }?.let {
+                        val bottomInset = insets.getInsets(WindowInsetsCompat.Type.ime()).bottom.toDouble() - this@NativePlatformInsets._insets.bottom
+
+                        this@NativePlatformInsets._imeWindow = window
+                        this@NativePlatformInsets.setImeInsets(maxOf(bottomInset, 0.0))
+                    }
+
+                    return insets
+                }
+            }
+        )
+    }
+
+    fun detachFromExtraWindow(window: Window) {
+        if (!_extraWindows.remove(window)) {
+            return
+        }
+
+        window.decorView.findViewById<View>(android.R.id.content)?.let { mainView ->
+            ViewCompat.setWindowInsetsAnimationCallback(mainView, null)
+        }
+
+        // keyboard is gone together with the window, closing another Modal keeps it
+        if (_imeWindow === window) {
+            _imeWindow = null
+            setImeInsets(0.0)
+        }
+    }
+
+    private fun setImeInsets(imeInsets: Double) {
+        if (this._insets.ime == imeInsets) {
+            return
+        }
+
+        this._insets = this._insets.copy(ime = imeInsets)
+        this.emitImeEvent(this.getMiniRuntime().copy(insets = this.getInsets()))
+    }
+
     fun emitImeEvent(miniRuntime: UnistylesNativeMiniRuntime) {
+        // like on iOS, the cached mini runtime follows the keyboard, useUnistyles reads it
+        onImeChange(miniRuntime.insets.ime)
+
         _imeListeners.forEach { listener ->
             listener(miniRuntime)
         }

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

@@ -4,7 +4,6 @@ import com.facebook.fbreact.specs.NativeTurboUnistylesSpec
 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.turbomodule.core.interfaces.BindingsInstallerHolder
 import com.facebook.react.turbomodule.core.interfaces.TurboModuleWithJSIBindings
 import com.margelo.nitro.unistyles.HybridNativePlatformSpec
@@ -30,24 +29,14 @@ class UnistylesModule(reactContext: ReactApplicationContext): NativeTurboUnistyl
     }
 
     init {
-        mHybridData = initializeHybridData(reactContext)
-    }
-
-    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.")
-
-        return initHybrid(runtimeExecutor, _nativePlatform)
+        mHybridData = initHybrid(_nativePlatform)
     }
 
     @DoNotStrip
     external override fun getBindingsInstaller(): BindingsInstallerHolder
 
     @DoNotStrip
-    private external fun initHybrid(
-        runtimeExecutor: RuntimeExecutor,
-        nativePlatform: HybridNativePlatformSpec
-    ): HybridData
+    private external fun initHybrid(nativePlatform: HybridNativePlatformSpec): HybridData
 
     @DoNotStrip
     private external fun invalidateNative()

package/android/src/rn86/java/com/unistyles/NativePlatform+extraWindows.kt

@@ -0,0 +1,28 @@
+package com.unistyles
+
+import android.view.Window
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.interfaces.ExtraWindowEventListener
+
+// React Native 0.86+ reports windows created on top of the Activity (e.g. Modal's Dialog)
+class NativePlatformExtraWindows(
+    private val reactContext: ReactApplicationContext,
+    private val onWindowCreate: (window: Window) -> Unit,
+    private val onWindowDestroy: (window: Window) -> Unit
+) : ExtraWindowEventListener {
+    fun startObserving() {
+        reactContext.addExtraWindowEventListener(this)
+    }
+
+    fun stopObserving() {
+        reactContext.removeExtraWindowEventListener(this)
+    }
+
+    override fun onExtraWindowCreate(window: Window) {
+        onWindowCreate(window)
+    }
+
+    override fun onExtraWindowDestroy(window: Window) {
+        onWindowDestroy(window)
+    }
+}

package/cxx/common/PerformanceTracing.h

@@ -0,0 +1,85 @@
+#pragma once
+
+#include <cxxreact/ReactNativeVersion.h>
+#include <string>
+#include <vector>
+#include "UnistyleDependency.hpp"
+
+// Scoped slice on the "Unistyles" track of the React Native DevTools Performance panel. Extra args are
+// [name, value] property pairs, evaluated even when not tracing, so keep them cheap (counts, literals)
+#if REACT_NATIVE_VERSION_MAJOR > 0 || REACT_NATIVE_VERSION_MINOR >= 86
+#include <jsinspector-modern/tracing/PerformanceTracer.h>
+#include <jsinspector-modern/tracing/PerformanceTracerSection.h>
+
+#define UNISTYLES_TRACE_CONCAT_INNER(a, b) a##b
+#define UNISTYLES_TRACE_CONCAT(a, b) UNISTYLES_TRACE_CONCAT_INNER(a, b)
+#define UNISTYLES_TRACE_SECTION(name, ...)                                                                             \
+    facebook::react::jsinspector_modern::tracing::PerformanceTracerSection UNISTYLES_TRACE_CONCAT(                     \
+        unistylesTrace, __LINE__)(name, "Unistyles", nullptr, nullptr __VA_OPT__(, ) __VA_ARGS__)
+#define UNISTYLES_IS_TRACING() facebook::react::jsinspector_modern::tracing::PerformanceTracer::getInstance().isTracing()
+#else
+#define UNISTYLES_TRACE_SECTION(name, ...)
+#define UNISTYLES_IS_TRACING() false
+#endif
+
+namespace margelo::nitro::unistyles::helpers {
+
+inline const char* dependencyToString(UnistyleDependency dependency) {
+    switch (dependency) {
+        case UnistyleDependency::THEME:
+            return "theme";
+        case UnistyleDependency::THEMENAME:
+            return "themeName";
+        case UnistyleDependency::ADAPTIVETHEMES:
+            return "adaptiveThemes";
+        case UnistyleDependency::BREAKPOINTS:
+            return "breakpoints";
+        case UnistyleDependency::VARIANTS:
+            return "variants";
+        case UnistyleDependency::COLORSCHEME:
+            return "colorScheme";
+        case UnistyleDependency::DIMENSIONS:
+            return "dimensions";
+        case UnistyleDependency::ORIENTATION:
+            return "orientation";
+        case UnistyleDependency::CONTENTSIZECATEGORY:
+            return "contentSizeCategory";
+        case UnistyleDependency::INSETS:
+            return "insets";
+        case UnistyleDependency::PIXELRATIO:
+            return "pixelRatio";
+        case UnistyleDependency::FONTSCALE:
+            return "fontScale";
+        case UnistyleDependency::STATUSBAR:
+            return "statusBar";
+        case UnistyleDependency::NAVIGATIONBAR:
+            return "navigationBar";
+        case UnistyleDependency::IME:
+            return "ime";
+        case UnistyleDependency::RTL:
+            return "rtl";
+    }
+
+    return "unknown";
+}
+
+// built only while DevTools records, it allocates
+inline std::string dependenciesToString(const std::vector<UnistyleDependency>& dependencies) {
+    if (!UNISTYLES_IS_TRACING()) {
+        return {};
+    }
+
+    std::string result;
+
+    for (auto dependency : dependencies) {
+        if (!result.empty()) {
+            result += ", ";
+        }
+
+        result += dependencyToString(dependency);
+    }
+
+    return result;
+}
+
+}