react-native-unistyles 3.0.0-nightly-20250129 → 3.0.0-nightly-20250131

package/README.md

@@ -47,6 +47,9 @@ Then follow [installation guides](https://unistyl.es/v3/start/getting-started) f
 <a href="https://galaxies.dev">
      <img src="https://avatars.githubusercontent.com/u/118431096?s=200&v=4" height="70px" width="70px" alt="galaxies-dev" />
 </a>
+<a href="https://github.com/FTCHD">
+     <img src="https://avatars.githubusercontent.com/u/144691102?v=4" height="70px" width="70px" alt="FTCHD" />
+</a>
 <a href="https://github.com/mobily">
      <img src="https://avatars.githubusercontent.com/u/1467712?v=4" height="70px" width="70px" alt="mobily" />
 </a>
@@ -62,8 +65,14 @@ 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/giovannilondero">
-     <img src="https://avatars.githubusercontent.com/u/10998991?v=4" height="70px" width="70px" alt="giovannilondero" />
+<a href="https://github.com/guillaumehcht">
+     <img src="https://avatars.githubusercontent.com/u/80776475?v=4" height="70px" width="70px" alt="guillaumehcht" />
+</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>
 
 ## Past sponsors
@@ -89,6 +98,9 @@ Then follow [installation guides](https://unistyl.es/v3/start/getting-started) f
 <a href="https://github.com/hyoban">
      <img src="https://avatars.githubusercontent.com/u/38493346?v=4" height="70px" width="70px" 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" />
+</a>
 
 ## Sponsor my work
 

package/components/native/NativeText/package.json

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

package/components/native/NativeView/package.json

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

package/cxx/core/Unistyle.h

@@ -54,6 +54,10 @@ struct Unistyle {
     inline bool dependsOn(UnistyleDependency dependency) {
         return std::find(this->dependencies.begin(), this->dependencies.end(), dependency) != this->dependencies.end();
     }
+    
+    inline bool isSealed() {
+        return this->_isSealed;
+    }
 
     inline void seal() {
         this->_isSealed = true;

package/cxx/core/UnistylesRegistry.h

@@ -27,6 +27,8 @@ struct UnistylesRegistry: public StyleSheetRegistry {
 
     UnistylesRegistry(const UnistylesRegistry&) = delete;
     UnistylesRegistry(const UnistylesRegistry&&) = delete;
+    
+    bool shouldUsePointsForBreakpoints = false;
 
     void registerTheme(jsi::Runtime& rt, std::string name, jsi::Value& theme);
     void registerBreakpoints(jsi::Runtime& rt, std::vector<std::pair<std::string, double>>& sortedBreakpoints);

package/cxx/hybridObjects/HybridStyleSheet.cpp

@@ -127,6 +127,20 @@ void HybridStyleSheet::parseSettings(jsi::Runtime &rt, jsi::Object settings) {
         if (propertyName == "CSSVars") {
             return;
         }
+        
+        if (propertyName == "nativeBreakpointsMode") {
+            helpers::assertThat(rt, propertyValue.isString(), "StyleSheet.configure's nativeBreakpointsMode must be a string");
+            
+            auto mode = propertyValue.asString(rt).utf8(rt);
+            
+            helpers::assertThat(rt, mode == "pixels" || mode == "points", "StyleSheet.configure's nativeBreakpointsMode must be one of: pixels or points");
+            
+            if (mode == "points") {
+                registry.shouldUsePointsForBreakpoints = true;
+            }
+            
+            return;
+        }
 
         helpers::assertThat(rt, false, "StyleSheet.configure's settings received unexpected key: '" + std::string(propertyName) + "'");
     });
@@ -142,7 +156,13 @@ void HybridStyleSheet::parseBreakpoints(jsi::Runtime &rt, jsi::Object breakpoint
     auto& state = registry.getState(rt);
 
     registry.registerBreakpoints(rt, sortedBreakpoints);
-    state.computeCurrentBreakpoint(this->_unistylesRuntime->getScreen().width);
+    
+    auto rawWidth = this->_unistylesRuntime->getScreen().width;
+    auto width = registry.shouldUsePointsForBreakpoints
+        ? rawWidth / this->_unistylesRuntime->getPixelRatio()
+        : rawWidth;
+    
+    state.computeCurrentBreakpoint(width);
 }
 
 void HybridStyleSheet::parseThemes(jsi::Runtime &rt, jsi::Object themes) {
@@ -293,7 +313,12 @@ void HybridStyleSheet::onPlatformNativeDependenciesChange(std::vector<UnistyleDe
         auto dimensionsIt = std::find(dependencies.begin(), dependencies.end(), UnistyleDependency::DIMENSIONS);
 
         if (dimensionsIt != dependencies.end()) {
-            registry.getState(rt).computeCurrentBreakpoint(this->_unistylesRuntime->getScreen().width);
+            auto rawWidth = this->_unistylesRuntime->getScreen().width;
+            auto width = registry.shouldUsePointsForBreakpoints
+                ? rawWidth / this->_unistylesRuntime->getPixelRatio()
+                : rawWidth;
+            
+            registry.getState(rt).computeCurrentBreakpoint(width);
         }
 
         // check if color scheme changed and then if Unistyles state depend on it (adaptive themes)

package/cxx/parser/Parser.cpp

@@ -399,8 +399,10 @@ jsi::Object parser::Parser::parseFirstLevel(jsi::Runtime& rt, Unistyle::Shared u
 
     helpers::enumerateJSIObject(rt, style, [&](const std::string& propertyName, jsi::Value& propertyValue){
         // parse dependencies only once
-        if (propertyName == helpers::STYLE_DEPENDENCIES && unistyle->dependencies.empty()) {
-            unistyle->dependencies = this->parseDependencies(rt, propertyValue.asObject(rt));
+        if (propertyName == helpers::STYLE_DEPENDENCIES && !unistyle->isSealed()) {
+            auto newDeps = this->parseDependencies(rt, propertyValue.asObject(rt));
+            
+            unistyle->dependencies.insert(unistyle->dependencies.end(), newDeps.begin(), newDeps.end());
 
             return;
         }
@@ -524,7 +526,7 @@ jsi::Function parser::Parser::createDynamicFunctionProxy(jsi::Runtime& rt, Unist
 
             Variants variants = helpers::variantsToPairs(rt, rawVariants.asObject(rt));
 
-            unistyleFn->parsedStyle = this->parseFirstLevel(rt, unistyleFn, variants);
+            unistyleFn->parsedStyle = parser.parseFirstLevel(rt, unistyleFn, variants);
             unistyleFn->seal();
 
             // for compatibility purpose save last arguments to style instance. It will work ok, if user sees warning about multiple unistyles
@@ -651,7 +653,11 @@ jsi::Value parser::Parser::getValueFromBreakpoints(jsi::Runtime& rt, Unistyle::S
     auto sortedBreakpoints = state.getSortedBreakpointPairs();
     auto hasBreakpoints = !sortedBreakpoints.empty();
     auto currentBreakpoint = state.getCurrentBreakpointName();
-    auto dimensions = this->_unistylesRuntime->getScreen();
+    auto rawDimensions = this->_unistylesRuntime->getScreen();
+    auto pixelRatio = this->_unistylesRuntime->getPixelRatio();
+    auto dimensions = registry.shouldUsePointsForBreakpoints
+        ? Dimensions(rawDimensions.width / pixelRatio, rawDimensions.height / pixelRatio)
+        : rawDimensions;
     auto currentOrientation = dimensions.width > dimensions.height
         ? "landscape"
         : "portrait";

package/ios/NativePlatform+ios.swift

@@ -114,6 +114,12 @@ class NativeIOSPlatform: HybridNativePlatformSpec {
         func getScreenDimensionsFn() -> Dimensions {
             guard let presentedViewController = RCTPresentedViewController(),
                   let windowFrame = presentedViewController.view.window?.frame else {
+                
+                // when user goes to background RCTPresentedViewController is not available, try to get last known value
+                if let cachedRuntime = self.miniRuntime, UIApplication.shared.applicationState == .background {
+                    return cachedRuntime.screen;
+                }
+                
                 // this should never happen, but it's better to return zeros
                 return Dimensions(width: 0, height: 0)
             }
@@ -137,10 +143,10 @@ class NativeIOSPlatform: HybridNativePlatformSpec {
         let screenDimensions = getScreenDimensions()
 
         if (screenDimensions.width > screenDimensions.height) {
-            return Orientation.landscape;
+            return Orientation.landscape
         }
 
-        return Orientation.portrait;
+        return Orientation.portrait
     }
 
     func getContentSizeCategory() -> String {
@@ -268,8 +274,14 @@ class NativeIOSPlatform: HybridNativePlatformSpec {
         func getPixelRatioFn() -> Double {
             guard let presentedViewController = RCTPresentedViewController(),
                   let window = presentedViewController.view.window else {
+
+                // when user goes to background RCTPresentedViewController is not available, try to get last known value
+                if let cachedRuntime = self.miniRuntime, UIApplication.shared.applicationState == .background {
+                    return cachedRuntime.pixelRatio;
+                }
+                
                 // this should never happen, but it's better to return default
-                return 1;
+                return 1
             }
 
             return window.screen.scale
@@ -297,7 +309,7 @@ class NativeIOSPlatform: HybridNativePlatformSpec {
     }
 
     func getNavigationBarDimensions() -> Dimensions {
-        return Dimensions(width: 0, height: 0);
+        return Dimensions(width: 0, height: 0)
     }
 
     func setStatusBarHidden(isHidden: Bool) throws {

package/lib/commonjs/components/native/NativeText.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Text", {
+  enumerable: true,
+  get: function () {
+    return _Text.Text;
+  }
+});
+var _Text = require("./Text");
+//# sourceMappingURL=NativeText.js.map

package/lib/commonjs/components/native/NativeText.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_Text","require"],"sourceRoot":"../../../../src","sources":["components/native/NativeText.tsx"],"mappings":";;;;;;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA","ignoreList":[]}

package/lib/commonjs/components/native/NativeText.native.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.NativeText = void 0;
+var _react = require("react");
+var _core = require("../../core");
+// credits to @hirbod
+const LeanText = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  return /*#__PURE__*/(0, _react.createElement)('RCTText', {
+    ...props,
+    ref
+  });
+});
+LeanText.displayName = 'RCTText';
+const NativeText = exports.NativeText = (0, _core.createUnistylesElement)(LeanText);
+//# sourceMappingURL=NativeText.native.js.map

package/lib/commonjs/components/native/NativeText.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_core","LeanText","forwardRef","props","ref","createElement","displayName","NativeText","exports","createUnistylesElement"],"sourceRoot":"../../../../src","sources":["components/native/NativeText.native.tsx"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAEA;AACA,MAAME,QAAQ,gBAAG,IAAAC,iBAAU,EAAC,CAACC,KAAK,EAAEC,GAAG,KAAK;EACxC,oBAAO,IAAAC,oBAAa,EAAC,SAAS,EAAE;IAAE,GAAGF,KAAK;IAAEC;EAAI,CAAC,CAAC;AACtD,CAAC,CAA6B;AAE9BH,QAAQ,CAACK,WAAW,GAAG,SAAS;AAEzB,MAAMC,UAAU,GAAAC,OAAA,CAAAD,UAAA,GAAG,IAAAE,4BAAsB,EAACR,QAAQ,CAAC","ignoreList":[]}

package/lib/commonjs/components/native/NativeView.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _View = require("./View");
+var _default = exports.default = _View.View;
+//# sourceMappingURL=NativeView.js.map

package/lib/commonjs/components/native/NativeView.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_View","require","_default","exports","default","View"],"sourceRoot":"../../../../src","sources":["components/native/NativeView.tsx"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AAA6B,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEdC,UAAI","ignoreList":[]}

package/lib/commonjs/components/native/NativeView.native.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("react");
+var _core = require("../../core");
+// credits to @hirbod
+const LeanView = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  return /*#__PURE__*/(0, _react.createElement)('RCTView', {
+    ...props,
+    ref
+  });
+});
+LeanView.displayName = 'RCTView';
+
+// this will match default export from react-native
+var _default = exports.default = (0, _core.createUnistylesElement)(LeanView);
+//# sourceMappingURL=NativeView.native.js.map

package/lib/commonjs/components/native/NativeView.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_core","LeanView","forwardRef","props","ref","createElement","displayName","_default","exports","default","createUnistylesElement"],"sourceRoot":"../../../../src","sources":["components/native/NativeView.native.tsx"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAEA;AACA,MAAME,QAAQ,gBAAG,IAAAC,iBAAU,EAAC,CAACC,KAAK,EAAEC,GAAG,KAAK;EACxC,oBAAO,IAAAC,oBAAa,EAAC,SAAS,EAAE;IAAE,GAAGF,KAAK;IAAEC;EAAI,CAAC,CAAC;AACtD,CAAC,CAA6B;AAE9BH,QAAQ,CAACK,WAAW,GAAG,SAAS;;AAEhC;AAAA,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GACe,IAAAC,4BAAsB,EAACT,QAAQ,CAAC","ignoreList":[]}

package/lib/commonjs/specs/StyleSheet/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_reactNativeNitroModules","require","_reactNative","HybridUnistylesStyleSheet","NitroModules","createHybridObject","absoluteFillObject","NativeStyleSheet","absoluteFill","flatten","compose","jsMethods","processColor","init","StyleSheet","exports"],"sourceRoot":"../../../../src","sources":["specs/StyleSheet/index.ts"],"mappings":";;;;;;AAAA,IAAAA,wBAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAqCA,MAAME,yBAAyB,GAAGC,qCAAY,CACzCC,kBAAkB,CAAsB,qBAAqB,CAAC;AAEnEF,yBAAyB,CAACG,kBAAkB,GAAGC,uBAAgB,CAACD,kBAAkB;AAClFH,yBAAyB,CAACK,YAAY,GAAGD,uBAAgB,CAACC,YAAY;AACtEL,yBAAyB,CAACM,OAAO,GAAGF,uBAAgB,CAACE,OAAO;AAC5DN,yBAAyB,CAACO,OAAO,GAAGH,uBAAgB,CAACG,OAAO;AAC5DP,yBAAyB,CAACQ,SAAS,GAAG;EAClCC,YAAY,EAAZA;AACJ,CAAC;AAEDT,yBAAyB,CAACU,IAAI,CAAC,CAAC;AAIzB,MAAMC,UAAU,GAAAC,OAAA,CAAAD,UAAA,GAAGX,yBAAsE","ignoreList":[]}
+{"version":3,"names":["_reactNativeNitroModules","require","_reactNative","HybridUnistylesStyleSheet","NitroModules","createHybridObject","absoluteFillObject","NativeStyleSheet","absoluteFill","flatten","compose","jsMethods","processColor","init","StyleSheet","exports"],"sourceRoot":"../../../../src","sources":["specs/StyleSheet/index.ts"],"mappings":";;;;;;AAAA,IAAAA,wBAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAsCA,MAAME,yBAAyB,GAAGC,qCAAY,CACzCC,kBAAkB,CAAsB,qBAAqB,CAAC;AAEnEF,yBAAyB,CAACG,kBAAkB,GAAGC,uBAAgB,CAACD,kBAAkB;AAClFH,yBAAyB,CAACK,YAAY,GAAGD,uBAAgB,CAACC,YAAY;AACtEL,yBAAyB,CAACM,OAAO,GAAGF,uBAAgB,CAACE,OAAO;AAC5DN,yBAAyB,CAACO,OAAO,GAAGH,uBAAgB,CAACG,OAAO;AAC5DP,yBAAyB,CAACQ,SAAS,GAAG;EAClCC,YAAY,EAAZA;AACJ,CAAC;AAEDT,yBAAyB,CAACU,IAAI,CAAC,CAAC;AAIzB,MAAMC,UAAU,GAAAC,OAAA,CAAAD,UAAA,GAAGX,yBAAsE","ignoreList":[]}

package/lib/module/components/native/NativeText.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export { Text } from './Text';
+//# sourceMappingURL=NativeText.js.map

package/lib/module/components/native/NativeText.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Text"],"sourceRoot":"../../../../src","sources":["components/native/NativeText.tsx"],"mappings":";;AAAA,SAASA,IAAI,QAAQ,QAAQ","ignoreList":[]}

package/lib/module/components/native/NativeText.native.js

@@ -0,0 +1,15 @@
+"use strict";
+
+import { createElement, forwardRef } from 'react';
+import { createUnistylesElement } from '../../core';
+
+// credits to @hirbod
+const LeanText = /*#__PURE__*/forwardRef((props, ref) => {
+  return /*#__PURE__*/createElement('RCTText', {
+    ...props,
+    ref
+  });
+});
+LeanText.displayName = 'RCTText';
+export const NativeText = createUnistylesElement(LeanText);
+//# sourceMappingURL=NativeText.native.js.map

package/lib/module/components/native/NativeText.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createElement","forwardRef","createUnistylesElement","LeanText","props","ref","displayName","NativeText"],"sourceRoot":"../../../../src","sources":["components/native/NativeText.native.tsx"],"mappings":";;AACA,SAA6BA,aAAa,EAAEC,UAAU,QAAQ,OAAO;AACrE,SAASC,sBAAsB,QAAQ,YAAY;;AAEnD;AACA,MAAMC,QAAQ,gBAAGF,UAAU,CAAC,CAACG,KAAK,EAAEC,GAAG,KAAK;EACxC,oBAAOL,aAAa,CAAC,SAAS,EAAE;IAAE,GAAGI,KAAK;IAAEC;EAAI,CAAC,CAAC;AACtD,CAAC,CAA6B;AAE9BF,QAAQ,CAACG,WAAW,GAAG,SAAS;AAEhC,OAAO,MAAMC,UAAU,GAAGL,sBAAsB,CAACC,QAAQ,CAAC","ignoreList":[]}

package/lib/module/components/native/NativeView.js

@@ -0,0 +1,5 @@
+"use strict";
+
+import { View } from './View';
+export default View;
+//# sourceMappingURL=NativeView.js.map

package/lib/module/components/native/NativeView.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View"],"sourceRoot":"../../../../src","sources":["components/native/NativeView.tsx"],"mappings":";;AAAA,SAASA,IAAI,QAAQ,QAAQ;AAE7B,eAAeA,IAAI","ignoreList":[]}

package/lib/module/components/native/NativeView.native.js

@@ -0,0 +1,17 @@
+"use strict";
+
+import { createElement, forwardRef } from 'react';
+import { createUnistylesElement } from '../../core';
+
+// credits to @hirbod
+const LeanView = /*#__PURE__*/forwardRef((props, ref) => {
+  return /*#__PURE__*/createElement('RCTView', {
+    ...props,
+    ref
+  });
+});
+LeanView.displayName = 'RCTView';
+
+// this will match default export from react-native
+export default createUnistylesElement(LeanView);
+//# sourceMappingURL=NativeView.native.js.map

package/lib/module/components/native/NativeView.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createElement","forwardRef","createUnistylesElement","LeanView","props","ref","displayName"],"sourceRoot":"../../../../src","sources":["components/native/NativeView.native.tsx"],"mappings":";;AACA,SAA6BA,aAAa,EAAEC,UAAU,QAAQ,OAAO;AACrE,SAASC,sBAAsB,QAAQ,YAAY;;AAEnD;AACA,MAAMC,QAAQ,gBAAGF,UAAU,CAAC,CAACG,KAAK,EAAEC,GAAG,KAAK;EACxC,oBAAOL,aAAa,CAAC,SAAS,EAAE;IAAE,GAAGI,KAAK;IAAEC;EAAI,CAAC,CAAC;AACtD,CAAC,CAA6B;AAE9BF,QAAQ,CAACG,WAAW,GAAG,SAAS;;AAEhC;AACA,eAAeJ,sBAAsB,CAACC,QAAQ,CAAC","ignoreList":[]}

package/lib/module/specs/StyleSheet/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["NitroModules","processColor","StyleSheet","NativeStyleSheet","HybridUnistylesStyleSheet","createHybridObject","absoluteFillObject","absoluteFill","flatten","compose","jsMethods","init"],"sourceRoot":"../../../../src","sources":["specs/StyleSheet/index.ts"],"mappings":";;AAAA,SAASA,YAAY,QAAQ,4BAA4B;AACzD,SAASC,YAAY,EAAEC,UAAU,IAAIC,gBAAgB,QAAQ,cAAc;AAqC3E,MAAMC,yBAAyB,GAAGJ,YAAY,CACzCK,kBAAkB,CAAsB,qBAAqB,CAAC;AAEnED,yBAAyB,CAACE,kBAAkB,GAAGH,gBAAgB,CAACG,kBAAkB;AAClFF,yBAAyB,CAACG,YAAY,GAAGJ,gBAAgB,CAACI,YAAY;AACtEH,yBAAyB,CAACI,OAAO,GAAGL,gBAAgB,CAACK,OAAO;AAC5DJ,yBAAyB,CAACK,OAAO,GAAGN,gBAAgB,CAACM,OAAO;AAC5DL,yBAAyB,CAACM,SAAS,GAAG;EAClCT;AACJ,CAAC;AAEDG,yBAAyB,CAACO,IAAI,CAAC,CAAC;AAIhC,OAAO,MAAMT,UAAU,GAAGE,yBAAsE","ignoreList":[]}
+{"version":3,"names":["NitroModules","processColor","StyleSheet","NativeStyleSheet","HybridUnistylesStyleSheet","createHybridObject","absoluteFillObject","absoluteFill","flatten","compose","jsMethods","init"],"sourceRoot":"../../../../src","sources":["specs/StyleSheet/index.ts"],"mappings":";;AAAA,SAASA,YAAY,QAAQ,4BAA4B;AACzD,SAASC,YAAY,EAAEC,UAAU,IAAIC,gBAAgB,QAAQ,cAAc;AAsC3E,MAAMC,yBAAyB,GAAGJ,YAAY,CACzCK,kBAAkB,CAAsB,qBAAqB,CAAC;AAEnED,yBAAyB,CAACE,kBAAkB,GAAGH,gBAAgB,CAACG,kBAAkB;AAClFF,yBAAyB,CAACG,YAAY,GAAGJ,gBAAgB,CAACI,YAAY;AACtEH,yBAAyB,CAACI,OAAO,GAAGL,gBAAgB,CAACK,OAAO;AAC5DJ,yBAAyB,CAACK,OAAO,GAAGN,gBAAgB,CAACM,OAAO;AAC5DL,yBAAyB,CAACM,SAAS,GAAG;EAClCT;AACJ,CAAC;AAEDG,yBAAyB,CAACO,IAAI,CAAC,CAAC;AAIhC,OAAO,MAAMT,UAAU,GAAGE,yBAAsE","ignoreList":[]}

package/lib/typescript/src/components/native/NativeText.d.ts

@@ -0,0 +1,2 @@
+export { Text } from './Text';
+//# sourceMappingURL=NativeText.d.ts.map

package/lib/typescript/src/components/native/NativeText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeText.d.ts","sourceRoot":"","sources":["../../../../../src/components/native/NativeText.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA"}

package/lib/typescript/src/components/native/NativeText.native.d.ts

@@ -0,0 +1,2 @@
+export declare const NativeText: any;
+//# sourceMappingURL=NativeText.native.d.ts.map

package/lib/typescript/src/components/native/NativeText.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeText.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/native/NativeText.native.tsx"],"names":[],"mappings":"AAWA,eAAO,MAAM,UAAU,KAAmC,CAAA"}

package/lib/typescript/src/components/native/NativeView.d.ts

@@ -0,0 +1,3 @@
+import { View } from './View';
+export default View;
+//# sourceMappingURL=NativeView.d.ts.map

package/lib/typescript/src/components/native/NativeView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeView.d.ts","sourceRoot":"","sources":["../../../../../src/components/native/NativeView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAE7B,eAAe,IAAI,CAAA"}

package/lib/typescript/src/components/native/NativeView.native.d.ts

@@ -0,0 +1,3 @@
+declare const _default: any;
+export default _default;
+//# sourceMappingURL=NativeView.native.d.ts.map

package/lib/typescript/src/components/native/NativeView.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeView.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/native/NativeView.native.tsx"],"names":[],"mappings":";AAYA,wBAA+C"}

package/lib/typescript/src/specs/StyleSheet/index.d.ts

@@ -10,6 +10,7 @@ type UnistylesThemeSettings = {
 };
 type UnistylesSettings = UnistylesThemeSettings & {
     CSSVars?: boolean;
+    nativeBreakpointsMode?: 'pixels' | 'points';
 };
 export type UnistylesConfig = {
     settings?: UnistylesSettings;

package/lib/typescript/src/specs/StyleSheet/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/specs/StyleSheet/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAkC,MAAM,cAAc,CAAA;AAC3E,OAAO,KAAK,EAAE,UAAU,IAAI,oBAAoB,EAAE,MAAM,cAAc,CAAA;AACtE,OAAO,KAAK,EAAE,mBAAmB,IAAI,uBAAuB,EAAE,MAAM,6BAA6B,CAAA;AACjG,OAAO,KAAK,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AACzE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAA;AAE5D,KAAK,sBAAsB,GAAG;IAC1B,YAAY,EAAE,CAAC,MAAM,MAAM,eAAe,CAAC,GAAG,MAAM,eAAe,CAAA;CACtE,GAAG;IACA,cAAc,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,KAAK,iBAAiB,GAAG,sBAAsB,GAAG;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,MAAM,MAAM,eAAe,GAAG;IAC1B,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,WAAW,CAAC,EAAE,oBAAoB,CAAA;CACrC,CAAA;AAED,MAAM,WAAW,mBAAoB,SAAQ,uBAAuB;IAChE,kBAAkB,EAAE,OAAO,oBAAoB,CAAC,kBAAkB,CAAC;IACnE,YAAY,EAAE,OAAO,oBAAoB,CAAC,YAAY,CAAC;IACvD,OAAO,EAAE,OAAO,oBAAoB,CAAC,OAAO,CAAC;IAC7C,OAAO,EAAE,OAAO,oBAAoB,CAAC,OAAO,CAAC;IAG7C,IAAI,IAAI,IAAI,CAAC;IACb,MAAM,EAAE,yBAAyB,CAAC;IAClC,SAAS,CAAC,MAAM,EAAE,eAAe,GAAG,IAAI,CAAC;IACzC,SAAS,EAAE;QACP,YAAY,EAAE,OAAO,YAAY,CAAA;KACpC,CAAA;CACJ;AAeD,KAAK,cAAc,GAAG,WAAW,GAAG,mBAAmB,GAAG,MAAM,CAAA;AAEhE,eAAO,MAAM,UAAU,EAAgC,IAAI,CAAC,mBAAmB,EAAE,cAAc,CAAC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/specs/StyleSheet/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAkC,MAAM,cAAc,CAAA;AAC3E,OAAO,KAAK,EAAE,UAAU,IAAI,oBAAoB,EAAE,MAAM,cAAc,CAAA;AACtE,OAAO,KAAK,EAAE,mBAAmB,IAAI,uBAAuB,EAAE,MAAM,6BAA6B,CAAA;AACjG,OAAO,KAAK,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AACzE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAA;AAE5D,KAAK,sBAAsB,GAAG;IAC1B,YAAY,EAAE,CAAC,MAAM,MAAM,eAAe,CAAC,GAAG,MAAM,eAAe,CAAA;CACtE,GAAG;IACA,cAAc,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,KAAK,iBAAiB,GAAG,sBAAsB,GAAG;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,qBAAqB,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAA;CAC9C,CAAA;AAED,MAAM,MAAM,eAAe,GAAG;IAC1B,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,WAAW,CAAC,EAAE,oBAAoB,CAAA;CACrC,CAAA;AAED,MAAM,WAAW,mBAAoB,SAAQ,uBAAuB;IAChE,kBAAkB,EAAE,OAAO,oBAAoB,CAAC,kBAAkB,CAAC;IACnE,YAAY,EAAE,OAAO,oBAAoB,CAAC,YAAY,CAAC;IACvD,OAAO,EAAE,OAAO,oBAAoB,CAAC,OAAO,CAAC;IAC7C,OAAO,EAAE,OAAO,oBAAoB,CAAC,OAAO,CAAC;IAG7C,IAAI,IAAI,IAAI,CAAC;IACb,MAAM,EAAE,yBAAyB,CAAC;IAClC,SAAS,CAAC,MAAM,EAAE,eAAe,GAAG,IAAI,CAAC;IACzC,SAAS,EAAE;QACP,YAAY,EAAE,OAAO,YAAY,CAAA;KACpC,CAAA;CACJ;AAeD,KAAK,cAAc,GAAG,WAAW,GAAG,mBAAmB,GAAG,MAAM,CAAA;AAEhE,eAAO,MAAM,UAAU,EAAgC,IAAI,CAAC,mBAAmB,EAAE,cAAc,CAAC,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-unistyles",
-  "version": "3.0.0-nightly-20250129",
+  "version": "3.0.0-nightly-20250131",
   "description": "Level up your React Native StyleSheet",
   "scripts": {
     "test": "jest",
@@ -11,15 +11,15 @@
     "precommit": "concurrently 'yarn tsc' 'yarn lint' 'yarn test'",
     "release": "release-it"
   },
-  "main": "lib/commonjs/index",
-  "module": "lib/module/index",
+  "main": "lib/commonjs/index.js",
+  "module": "lib/module/index.js",
   "types": "lib/typescript/src/index.d.ts",
   "source": "src/index",
   "exports": {
     ".": {
       "types": "./lib/typescript/src/index.d.ts",
-      "module": "./lib/module/index",
-      "default": "./lib/commonjs/index",
+      "module": "./lib/module/index.js",
+      "default": "./lib/commonjs/index.js",
       "react-native": "./src/index"
     },
     "./components/native/*": {
@@ -34,8 +34,8 @@
     "./package.json": "./package.json",
     "./server": {
       "types": "./lib/typescript/src/server/index.d.ts",
-      "module": "./lib/module/server/index",
-      "default": "./lib/commonjs/server/index",
+      "module": "./lib/module/server/index.js",
+      "default": "./lib/commonjs/server/index.js",
       "react-native": "./src/server"
     }
   },

package/plugin/consts.js

@@ -30,13 +30,33 @@ const REPLACE_WITH_UNISTYLES_PATHS = [
 
 // this is more powerful API as it allows to convert unmatched imports to Unistyles
 // { path: string, imports: Array<{ name: string, isDefault: boolean, path: string, mapTo: string }> }
-// name <- target import name
+// path => node_modules path
+// imports:
+// name? <- target import name if isDefault is false
 // isDefault <- is the import default?
 // path <- path to the target import
 // mapTo <- name of the Unistyles component
 const REPLACE_WITH_UNISTYLES_EXOTIC_PATHS = []
 
+// this list will additionally detect React Native direct imports
+const NATIVE_COMPONENTS_PATHS = {
+    imports: [
+        {
+            name: 'NativeText',
+            isDefault: false,
+            path: 'react-native/Libraries/Text/TextNativeComponent',
+            mapTo: 'NativeText'
+        },
+        {
+            isDefault: true,
+            path: 'react-native/Libraries/Components/View/ViewNativeComponent',
+            mapTo: 'NativeView'
+        }
+    ]
+}
+
 module.exports = {
+    NATIVE_COMPONENTS_PATHS,
     REACT_NATIVE_COMPONENT_NAMES,
     REPLACE_WITH_UNISTYLES_PATHS,
     REPLACE_WITH_UNISTYLES_EXOTIC_PATHS

package/plugin/exotic.js

@@ -8,28 +8,40 @@ function handleExoticImport(t, path, state, exoticImport) {
 
     specifiers.forEach(specifier => {
         for (const rule of exoticImport.imports) {
-            const hasMatchingImportType = !rule.isDefault || t.isImportDefaultSpecifier(specifier)
-            const hasMatchingImportName = rule.name === specifier.local.name
+            const hasMatchingImportType = (!rule.isDefault && t.isImportSpecifier(specifier)) || (rule.isDefault && t.isImportDefaultSpecifier(specifier))
+            const hasMatchingImportName = rule.isDefault || (!rule.isDefault && rule.name === specifier.local.name)
             const hasMatchingPath = rule.path === source.value
 
             if (!hasMatchingImportType || !hasMatchingImportName || !hasMatchingPath) {
                 continue
             }
 
-            const newImport = t.importDeclaration(
-                [t.importSpecifier(t.identifier(rule.mapTo), t.identifier(rule.mapTo))],
-                t.stringLiteral(state.opts.isLocal
-                    ? state.file.opts.filename.split('react-native-unistyles').at(0).concat(`react-native-unistyles/components/native/${rule.mapTo}`)
-                    : `react-native-unistyles/components/native/${rule.mapTo}`
+            if (t.isImportDefaultSpecifier(specifier)) {
+                const newImport = t.importDeclaration(
+                    [t.importDefaultSpecifier(t.identifier(specifier.local.name))],
+                    t.stringLiteral(state.opts.isLocal
+                        ? state.file.opts.filename.split('react-native-unistyles').at(0).concat(`react-native-unistyles/components/native/${rule.mapTo}`)
+                        : `react-native-unistyles/components/native/${rule.mapTo}`
+                    )
                 )
-            )
 
-            // remove old import
-            if (t.isImportDefaultSpecifier(specifier)) {
                 path.replaceWith(newImport)
             } else {
+                const newImport = t.importDeclaration(
+                    [t.importSpecifier(t.identifier(rule.mapTo), t.identifier(rule.mapTo))],
+                    t.stringLiteral(state.opts.isLocal
+                        ? state.file.opts.filename.split('react-native-unistyles').at(0).concat(`react-native-unistyles/components/native/${rule.mapTo}`)
+                        : `react-native-unistyles/components/native/${rule.mapTo}`
+                    )
+                )
+
                 path.node.specifiers = specifiers.filter(s => s !== specifier)
-                path.unshift(newImport)
+
+                if (path.node.specifiers.length === 0) {
+                    path.replaceWith(newImport)
+                } else {
+                    path.insertBefore(newImport)
+                }
             }
 
             return

package/plugin/index.d.ts

@@ -1,43 +1,89 @@
+type RemapImport = {
+    name?: string,
+    isDefault: boolean,
+    path: string,
+    mapTo: string
+}
+
+type RemapConfig = {
+    path: string,
+    imports: Array<RemapImport>
+}
+
 export interface UnistylesPluginOptions {
     /**
      * Example: "src" or "apps/mobile"
      * Add this option if some of your components don't have `react-native-unistyles` import.
      * Babel plugin will automatically process all files under this root.
      */
-    autoProcessRoot?: string
-
-  /**
-   * Example: ['@codemask/styles']
-   * Enable this option if you want to process only files containing specific imports.
-   */
-  autoProcessImports?: string[]
-
-  /**
-   * Example: ['external-library/components']
-   * Enable this option to process some 3rd party components under `node_modules`.
-   * Under these paths we will replace `react-native` imports with `react-native-unistyles` factories that will borrow components refs [read more](https://www.unistyl.es/v3/other/babel-plugin#3-component-factory-borrowing-ref).
-   *
-   * Defaults to:
-   *
-   * ```ts
-   * ['react-native-reanimated/src/component', 'react-native-gesture-handler/src/components']
-   * ```
-   */
-  autoProcessPaths?: string[];
-
-  /**
-   * In order to list detected dependencies by the Babel plugin you can enable the `debug` flag.
-   * It will `console.log` name of the file and component with Unistyles dependencies.
-   */
-  debug?: boolean;
-
-  /**
-   * Only applicable for Unistyles monorepo for
-   * path resolution, don't use it!
-   */
-  isLocal?: boolean;
+    autoProcessRoot?: string,
+
+    /**
+    * Example: ['@codemask/styles']
+    * Enable this option if you want to process only files containing specific imports.
+    */
+    autoProcessImports?: Array<string>,
+
+    /**
+     * Example: [{
+     *     path: "node_modules/custom-library/components",
+     *     imports: [
+     *         {
+     *             name: "NativeText",
+     *             isDefault: false,
+     *             path: "react-native/Libraries/Text/TextNativeComponent",
+     *             mapTo: "NativeText"
+     *         },
+     *         {
+     *             isDefault: true,
+     *             path: "react-native/Libraries/Components/View/ViewNativeComponent",
+     *             mapTo: "NativeView"
+     *         }
+     *     ]
+     * }]
+     *
+     * Will map:
+     *      import { NativeText } from "react-native/Libraries/Text/TextNativeComponent"
+     *      to Unistyles "NativeText"
+     *
+     *      import View from "react-native/Libraries/Components/View/ViewNativeComponent"
+     *      to Unistyles "NativeView"
+     *
+     * This is the most powerful way of remapping imports. If 3rd party library uses imports different from `react-native` we can remap them to `react-native-unistyles` factories.
+     * Internally we do that for raw RCTView and RCTText components.
+     *
+     * path -> must be within node_modules folder
+     * imports.name is Optional if library used export default
+     * imports.mapTo - name of the component from react-native-unistyles/src/components/native
+     */
+    autoRemapImports?: Array<RemapConfig>,
+
+    /**
+    * Example: ['external-library/components']
+    * Enable this option to process some 3rd party components under `node_modules`.
+    * Under these paths we will replace `react-native` imports with `react-native-unistyles` factories that will borrow components refs [read more](https://www.unistyl.es/v3/other/babel-plugin#3-component-factory-borrowing-ref).
+    *
+    * Defaults to:
+    *
+    * ```ts
+    * ['react-native-reanimated/src/component', 'react-native-gesture-handler/src/components']
+    * ```
+    */
+    autoProcessPaths?: Array<string>,
+
+    /**
+    * In order to list detected dependencies by the Babel plugin you can enable the `debug` flag.
+    * It will `console.log` name of the file and component with Unistyles dependencies.
+    */
+    debug?: boolean,
+
+    /**
+    * Only applicable for Unistyles monorepo for
+    * path resolution, don't use it!
+    */
+    isLocal?: boolean
 }
 
 export interface UnistylesPluginPass {
-  opts: UnistylesPluginOptions;
+    opts: UnistylesPluginOptions
 }

package/plugin/index.js

@@ -1,8 +1,8 @@
 const { addUnistylesImport, isInsideNodeModules } = require('./import')
 const { hasStringRef } = require('./ref')
-const { isUnistylesStyleSheet, analyzeDependencies, addStyleSheetTag, getUnistyles, isKindOfStyleSheet } = require('./stylesheet')
+const { isUnistylesStyleSheet, analyzeDependencies, addStyleSheetTag, getUnistyles, isKindOfStyleSheet, addThemeDependencyToMemberExpression } = require('./stylesheet')
 const { extractVariants } = require('./variants')
-const { REACT_NATIVE_COMPONENT_NAMES, REPLACE_WITH_UNISTYLES_PATHS, REPLACE_WITH_UNISTYLES_EXOTIC_PATHS } = require('./consts')
+const { REACT_NATIVE_COMPONENT_NAMES, REPLACE_WITH_UNISTYLES_PATHS, REPLACE_WITH_UNISTYLES_EXOTIC_PATHS, NATIVE_COMPONENTS_PATHS } = require('./consts')
 const { handleExoticImport } = require('./exotic')
 
 module.exports = function ({ types: t }) {
@@ -81,6 +81,7 @@ module.exports = function ({ types: t }) {
             /** @param {import('./index').UnistylesPluginPass} state */
             ImportDeclaration(path, state) {
                 const exoticImport = REPLACE_WITH_UNISTYLES_EXOTIC_PATHS
+                    .concat(state.opts.autoRemapImports ?? [])
                     .find(exotic => state.filename.includes(exotic.path))
 
                 if (exoticImport) {
@@ -109,6 +110,10 @@ module.exports = function ({ types: t }) {
                     })
                 }
 
+                if (importSource.includes('react-native/Libraries')) {
+                    handleExoticImport(t, path, state, NATIVE_COMPONENTS_PATHS)
+                }
+
                 if (!state.file.forceProcessing && Array.isArray(state.opts.autoProcessImports)) {
                     state.file.forceProcessing = state.opts.autoProcessImports.includes(importSource)
                 }
@@ -178,6 +183,13 @@ module.exports = function ({ types: t }) {
                             if (t.isObjectProperty(property)) {
                                 const propertyValues = getUnistyles(t, property)
 
+                                // maybe user used inlined theme? ({ container: theme.components.container })
+                                if (propertyValues.length === 0 && t.isMemberExpression(property.value)) {
+                                    if (property.value.object.object.name === themeLocalName) {
+                                        addThemeDependencyToMemberExpression(t, property)
+                                    }
+                                }
+
                                 propertyValues.forEach(propertyValue => {
                                     analyzeDependencies(t, state, property.key.name, propertyValue, themeLocalName, miniRuntimeLocalName)
                                 })

package/plugin/stylesheet.js

@@ -219,10 +219,21 @@ function getUnistyles(t, property) {
     return []
 }
 
+function addThemeDependencyToMemberExpression(t, path) {
+    path.value = t.objectExpression([
+        t.spreadElement(path.value),
+        t.objectProperty(
+            t.identifier('uni__dependencies'),
+            t.arrayExpression([t.numericLiteral(UnistyleDependency.Theme)])
+        )
+    ])
+}
+
 module.exports = {
     isUnistylesStyleSheet,
     analyzeDependencies,
     addStyleSheetTag,
     getUnistyles,
-    isKindOfStyleSheet
+    isKindOfStyleSheet,
+    addThemeDependencyToMemberExpression
 }

package/src/components/native/NativeText.native.tsx

@@ -0,0 +1,12 @@
+import type { TextProps } from 'react-native'
+import { type ComponentType, createElement, forwardRef } from 'react'
+import { createUnistylesElement } from '../../core'
+
+// credits to @hirbod
+const LeanText = forwardRef((props, ref) => {
+    return createElement('RCTText', { ...props, ref })
+}) as ComponentType<TextProps>
+
+LeanText.displayName = 'RCTText'
+
+export const NativeText = createUnistylesElement(LeanText)

package/src/components/native/NativeText.tsx

@@ -0,0 +1 @@
+export { Text } from './Text'

package/src/components/native/NativeView.native.tsx

@@ -0,0 +1,13 @@
+import type { ViewProps } from 'react-native'
+import { type ComponentType, createElement, forwardRef } from 'react'
+import { createUnistylesElement } from '../../core'
+
+// credits to @hirbod
+const LeanView = forwardRef((props, ref) => {
+    return createElement('RCTView', { ...props, ref })
+}) as ComponentType<ViewProps>
+
+LeanView.displayName = 'RCTView'
+
+// this will match default export from react-native
+export default createUnistylesElement(LeanView)

package/src/components/native/NativeView.tsx

@@ -0,0 +1,3 @@
+import { View } from './View'
+
+export default View

package/src/specs/StyleSheet/index.ts

@@ -12,7 +12,8 @@ type UnistylesThemeSettings = {
 }
 
 type UnistylesSettings = UnistylesThemeSettings & {
-    CSSVars?: boolean
+    CSSVars?: boolean,
+    nativeBreakpointsMode?: 'pixels' | 'points'
 }
 
 export type UnistylesConfig = {