react-native-unistyles 3.0.0-nightly-20250416 → 3.0.0-rc.2

package/README.md

@@ -29,7 +29,7 @@ yarn add react-native-edge-to-edge react-native-nitro-modules@0.25.2
 | react-native-unistyles | react-native-nitro-modules |
 |------------------------|----------------------------|
 | 3.0.0-rc.1             | 0.25.2                     |
-| 3.0.0-nightly-20250409 | 0.25.2                     |
+| 3.0.0-nightly-20250416 | 0.25.2                     |
 
 Then follow [installation guides](https://unistyl.es/v3/start/getting-started) for your platform.
 

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,7 +21,7 @@ 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()
@@ -106,7 +105,7 @@ class NativePlatformInsets(
             return
         }
 
-        diffMiniRuntime()
+        this@NativePlatformInsets.onConfigChange()
 
         if (shouldEmitImeEvent) {
             this@NativePlatformInsets.emitImeEvent(this.getMiniRuntime())

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-unistyles",
-  "version": "3.0.0-nightly-20250416",
+  "version": "3.0.0-rc.2",
   "description": "Level up your React Native StyleSheet",
   "scripts": {
     "test": "jest",

package/plugin/index.js

@@ -171,6 +171,19 @@ function addUnistylesImport(path2, state) {
 function isInsideNodeModules(state) {
   return state.file.opts.filename?.includes("node_modules") && !state.file.replaceWithUnistyles;
 }
+function addUnistylesRequire(path2, state) {
+  Object.entries(state.reactNativeImports).forEach(([componentName, uniqueName]) => {
+    const newRequire = t2.variableDeclaration("const", [
+      t2.variableDeclarator(
+        t2.identifier(uniqueName),
+        t2.callExpression(t2.identifier("require"), [
+          t2.stringLiteral(`react-native-unistyles/src/components/native/${componentName}`)
+        ])
+      )
+    ]);
+    path2.node.body.unshift(newRequire);
+  });
+}
 
 // plugin/src/ref.ts
 var t3 = __toESM(require("@babel/types"));
@@ -314,10 +327,29 @@ function stringToUniqueId(str) {
 }
 function isUnistylesStyleSheet(path2, state) {
   const { callee } = path2.node;
-  if (t4.isMemberExpression(callee) && t4.isIdentifier(callee.property)) {
-    return callee.property.name === "create" && t4.isIdentifier(callee.object) && callee.object.name === state.file.styleSheetLocalName;
+  if (!t4.isMemberExpression(callee) || !t4.isIdentifier(callee.property)) {
+    return false;
+  }
+  const isImport = callee.property.name === "create" && t4.isIdentifier(callee.object) && callee.object.name === state.file.styleSheetLocalName;
+  const isRequire = state.file.hasUnistylesImport && callee.property.name === "create" && t4.isMemberExpression(callee.object) && t4.isIdentifier(callee.object.property) && t4.isIdentifier(callee.object.object) && callee.object.object.name === state.file.styleSheetLocalName && callee.object.property.name === "StyleSheet";
+  return isImport || isRequire;
+}
+function isUnistylesCommonJSRequire(path2, state) {
+  const isRequire = t4.isIdentifier(path2.node.callee) && path2.node.arguments.length > 0 && t4.isStringLiteral(path2.node.arguments[0]) && path2.node.arguments[0].value === "react-native-unistyles";
+  if (isRequire && t4.isVariableDeclarator(path2.parent) && t4.isIdentifier(path2.parent.id)) {
+    state.file.hasUnistylesImport = true;
+    state.file.styleSheetLocalName = path2.parent.id.name;
   }
-  return false;
+  return isRequire;
+}
+function isReactNativeCommonJSRequire(path2, state) {
+  const isRequire = t4.isIdentifier(path2.node.callee) && path2.node.arguments.length > 0 && path2.node.callee.name === "require";
+  const requireImportName = path2.node.arguments.find((node) => t4.isStringLiteral(node));
+  const isReactNativeRequire = isRequire && requireImportName && (requireImportName.value === "react-native" || requireImportName.value === "react-native-web/dist/index");
+  if (isReactNativeRequire && t4.isVariableDeclarator(path2.parent) && t4.isIdentifier(path2.parent.id)) {
+    state.file.reactNativeCommonJSName = path2.parent.id.name;
+  }
+  return isRequire;
 }
 function isKindOfStyleSheet(path2, state) {
   if (!state.file.forceProcessing && !state.file.hasUnistylesImport) {
@@ -691,8 +723,10 @@ function index_default() {
           state.file.replaceWithUnistyles = REPLACE_WITH_UNISTYLES_PATHS.map(toPlatformPath).concat(state.opts.autoProcessPaths ?? []).some((path3) => state.filename?.includes(path3));
           state.file.hasAnyUnistyle = false;
           state.file.hasUnistylesImport = false;
+          state.file.addUnistylesRequire = false;
           state.file.hasVariants = false;
           state.file.styleSheetLocalName = "";
+          state.file.reactNativeCommonJSName = "";
           state.file.tagNumber = 0;
           state.reactNativeImports = {};
           state.file.forceProcessing = state.opts.autoProcessRoot && state.filename ? state.filename.includes(toPlatformPath(`${state.file.opts.root}/${state.opts.autoProcessRoot}/`)) : false;
@@ -709,6 +743,9 @@ function index_default() {
           if (isInsideNodeModules(state)) {
             return;
           }
+          if (state.file.addUnistylesRequire) {
+            return addUnistylesRequire(path2, state);
+          }
           if (state.file.hasAnyUnistyle || state.file.hasVariants || state.file.replaceWithUnistyles || state.file.forceProcessing) {
             addUnistylesImport(path2, state);
           }
@@ -784,10 +821,33 @@ function index_default() {
           throw new Error("Detected string based ref which is not supported by Unistyles.");
         }
       },
+      MemberExpression(path2, state) {
+        if (isInsideNodeModules(state)) {
+          return;
+        }
+        if (!state.file.reactNativeCommonJSName || !t6.isIdentifier(path2.node.object)) {
+          return;
+        }
+        if (path2.node.object.name !== state.file.reactNativeCommonJSName || !t6.isIdentifier(path2.node.property)) {
+          return;
+        }
+        if (!state.reactNativeImports[path2.node.property.name]) {
+          const uniqueId = path2.scope.generateUidIdentifier(`reactNativeUnistyles_${path2.node.property.name}`);
+          state.reactNativeImports[path2.node.property.name] = uniqueId.name;
+          state.file.addUnistylesRequire = true;
+        }
+        path2.node.object.name = state.reactNativeImports[path2.node.property.name];
+      },
       CallExpression(path2, state) {
         if (isInsideNodeModules(state)) {
           return;
         }
+        if (isUnistylesCommonJSRequire(path2, state)) {
+          return;
+        }
+        if (isReactNativeCommonJSRequire(path2, state)) {
+          return;
+        }
         if (!isUnistylesStyleSheet(path2, state) && !isKindOfStyleSheet(path2, state)) {
           return;
         }