react-native-unistyles 3.0.0-nightly-20250512 → 3.0.0-nightly-20250520

package/README.md

@@ -28,8 +28,8 @@ yarn add react-native-edge-to-edge react-native-nitro-modules@0.25.2
 
 | react-native-unistyles | react-native-nitro-modules |
 |------------------------|----------------------------|
-| 3.0.0-nightly-20250508 | 0.25.2                     |
-| 3.0.0-rc.3             | 0.25.2                     |
+| 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.
 

package/lib/commonjs/reanimated/index.js

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

package/lib/commonjs/reanimated/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_useAnimatedTheme","require"],"sourceRoot":"../../../src","sources":["reanimated/index.ts"],"mappings":";;;;;;;;;;;AAAA,IAAAA,iBAAA,GAAAC,OAAA","ignoreList":[]}

package/lib/commonjs/reanimated/useAnimatedTheme.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useAnimatedTheme = void 0;
+var _react = require("react");
+var _reactNativeReanimated = require("react-native-reanimated");
+var _specs = require("../specs");
+var _services = require("../web/services");
+const useAnimatedTheme = () => {
+  const theme = (0, _reactNativeReanimated.useSharedValue)(_specs.UnistylesRuntime.getTheme());
+  (0, _react.useEffect)(() => {
+    const dispose = _services.services.listener.addListeners([_specs.UnistyleDependency.Theme], () => theme.set(_specs.UnistylesRuntime.getTheme()));
+    return () => {
+      dispose();
+    };
+  }, []);
+  return theme;
+};
+exports.useAnimatedTheme = useAnimatedTheme;
+//# sourceMappingURL=useAnimatedTheme.js.map

package/lib/commonjs/reanimated/useAnimatedTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNativeReanimated","_specs","_services","useAnimatedTheme","theme","useSharedValue","UnistylesRuntime","getTheme","useEffect","dispose","services","listener","addListeners","UnistyleDependency","Theme","set","exports"],"sourceRoot":"../../../src","sources":["reanimated/useAnimatedTheme.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,sBAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AAEA,IAAAG,SAAA,GAAAH,OAAA;AAEO,MAAMI,gBAAgB,GAAGA,CAAA,KAAM;EAClC,MAAMC,KAAK,GAAG,IAAAC,qCAAc,EAACC,uBAAgB,CAACC,QAAQ,CAAC,CAAC,CAAC;EAEzD,IAAAC,gBAAS,EAAC,MAAM;IACZ,MAAMC,OAAO,GAAGC,kBAAQ,CAACC,QAAQ,CAACC,YAAY,CAAC,CAACC,yBAAkB,CAACC,KAAK,CAAC,EAAE,MAAMV,KAAK,CAACW,GAAG,CAACT,uBAAgB,CAACC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAExH,OAAO,MAAM;MACTE,OAAO,CAAC,CAAC;IACb,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOL,KAAK;AAChB,CAAC;AAAAY,OAAA,CAAAb,gBAAA,GAAAA,gBAAA","ignoreList":[]}

package/lib/commonjs/reanimated/useAnimatedTheme.native.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useAnimatedTheme = void 0;
+var _react = require("react");
+var _reactNativeReanimated = require("react-native-reanimated");
+var _specs = require("../specs");
+const useAnimatedTheme = () => {
+  const theme = (0, _reactNativeReanimated.useSharedValue)(_specs.UnistylesRuntime.getTheme());
+  (0, _react.useEffect)(() => {
+    // @ts-ignore this is hidden from TS
+    const dispose = _specs.StyleSheet.addChangeListener(changedDependencies => {
+      if (changedDependencies.includes(_specs.UnistyleDependency.Theme)) {
+        theme.set(_specs.UnistylesRuntime.getTheme());
+      }
+    });
+    return () => dispose();
+  }, []);
+  return theme;
+};
+exports.useAnimatedTheme = useAnimatedTheme;
+//# sourceMappingURL=useAnimatedTheme.native.js.map

package/lib/commonjs/reanimated/useAnimatedTheme.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNativeReanimated","_specs","useAnimatedTheme","theme","useSharedValue","UnistylesRuntime","getTheme","useEffect","dispose","StyleSheet","addChangeListener","changedDependencies","includes","UnistyleDependency","Theme","set","exports"],"sourceRoot":"../../../src","sources":["reanimated/useAnimatedTheme.native.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,sBAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AAGO,MAAMG,gBAAgB,GAAGA,CAAA,KAAM;EAClC,MAAMC,KAAK,GAAG,IAAAC,qCAAc,EAACC,uBAAgB,CAACC,QAAQ,CAAC,CAAC,CAAC;EAEzD,IAAAC,gBAAS,EAAC,MAAM;IACZ;IACA,MAAMC,OAAO,GAAGC,iBAAU,CAACC,iBAAiB,CAACC,mBAAmB,IAAI;MAChE,IAAIA,mBAAmB,CAACC,QAAQ,CAACC,yBAAkB,CAACC,KAAK,CAAC,EAAE;QACxDX,KAAK,CAACY,GAAG,CAACV,uBAAgB,CAACC,QAAQ,CAAC,CAAC,CAAC;MAC1C;IACJ,CAAC,CAAC;IAEF,OAAO,MAAME,OAAO,CAAC,CAAC;EAC1B,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOL,KAAK;AAChB,CAAC;AAAAa,OAAA,CAAAd,gBAAA,GAAAA,gBAAA","ignoreList":[]}

package/lib/commonjs/web/css/core.js

@@ -32,8 +32,13 @@ const convertToCSS = (hash, value, state) => {
       return;
     }
     if (typeof styleValue === 'object') {
-      const allBreakpoints = Object.keys(value);
       Object.entries(styleValue).forEach(([breakpointStyleKey, breakpointStyleValue]) => {
+        const allBreakpoints = Object.entries(value).filter(([_, value]) => {
+          if (typeof value !== 'object' || value === null) {
+            return false;
+          }
+          return breakpointStyleKey in value;
+        }).map(([key]) => key);
         const mediaQuery = (0, _utils.getMediaQuery)(styleKey, allBreakpoints);
         state.set({
           mediaQuery,

package/lib/commonjs/web/css/core.js.map

@@ -1 +1 @@
-{"version":3,"names":["_utils","require","convertToCSS","hash","value","state","Object","entries","forEach","styleKey","styleValue","pseudoClassName","replace","pseudoStyleKey","pseudoStyleValue","allBreakpoints","keys","breakpointStyleKey","breakpointStyleValue","mediaQuery","getMediaQuery","set","className","propertyKey","exports"],"sourceRoot":"../../../../src","sources":["web/css/core.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAGO,MAAMC,YAAY,GAAGA,CAACC,IAAY,EAAEC,KAA0B,EAAEC,KAAe,KAAK;EACvFC,MAAM,CAACC,OAAO,CAACH,KAAK,CAAC,CAACI,OAAO,CAAC,CAAC,CAACC,QAAQ,EAAEC,UAAU,CAAC,KAAK;IACtD,IAAID,QAAQ,CAAC,CAAC,CAAC,KAAK,GAAG,EAAE;MACrB,MAAME,eAAe,GAAGF,QAAQ,CAACG,OAAO,CAAC,GAAG,EAAE,GAAGT,IAAI,GAAG,CAAC;MAEzDG,MAAM,CAACC,OAAO,CAACG,UAAU,CAAC,CAACF,OAAO,CAAC,CAAC,CAACK,cAAc,EAAEC,gBAAgB,CAAC,KAAK;QACvE,IAAI,OAAOA,gBAAgB,KAAK,QAAQ,IAAIA,gBAAgB,KAAK,IAAI,EAAE;UACnE,MAAMC,cAAc,GAAGT,MAAM,CAACU,IAAI,CAACN,UAAU,CAAC;UAC9CJ,MAAM,CAACC,OAAO,CAACO,gBAAgB,CAAC,CAACN,OAAO,CAAC,CAAC,CAACS,kBAAkB,EAAEC,oBAAoB,CAAC,KAAK;YACrF,MAAMC,UAAU,GAAG,IAAAC,oBAAa,EAACP,cAAc,EAAEE,cAAc,CAAC;YAEhEV,KAAK,CAACgB,GAAG,CAAC;cACNF,UAAU;cACVG,SAAS,EAAEX,eAAe;cAC1BY,WAAW,EAAEN,kBAAkB;cAC/Bb,KAAK,EAAEc;YACX,CAAC,CAAC;UACN,CAAC,CAAC;UAEF;QACJ;QAEAb,KAAK,CAACgB,GAAG,CAAC;UACNC,SAAS,EAAEX,eAAe;UAC1BY,WAAW,EAAEV,cAAc;UAC3BT,KAAK,EAAEU;QACX,CAAC,CAAC;MACN,CAAC,CAAC;MAEF;IACJ;IAEA,IAAI,OAAOJ,UAAU,KAAK,QAAQ,EAAE;MAChC,MAAMK,cAAc,GAAGT,MAAM,CAACU,IAAI,CAACZ,KAAK,CAAC;MACzCE,MAAM,CAACC,OAAO,CAACG,UAAU,CAAC,CAACF,OAAO,CAAC,CAAC,CAACS,kBAAkB,EAAEC,oBAAoB,CAAC,KAAK;QAC/E,MAAMC,UAAU,GAAG,IAAAC,oBAAa,EAACX,QAAQ,EAAEM,cAAc,CAAC;QAE1DV,KAAK,CAACgB,GAAG,CAAC;UACNF,UAAU;UACVG,SAAS,EAAEnB,IAAI;UACfoB,WAAW,EAAEN,kBAAkB;UAC/Bb,KAAK,EAAEc;QACX,CAAC,CAAC;MACN,CAAC,CAAC;MAEF;IACJ;IAEAb,KAAK,CAACgB,GAAG,CAAC;MACNC,SAAS,EAAEnB,IAAI;MACfoB,WAAW,EAAEd,QAAQ;MACrBL,KAAK,EAAEM;IACX,CAAC,CAAC;EACN,CAAC,CAAC;AACN,CAAC;AAAAc,OAAA,CAAAtB,YAAA,GAAAA,YAAA","ignoreList":[]}
+{"version":3,"names":["_utils","require","convertToCSS","hash","value","state","Object","entries","forEach","styleKey","styleValue","pseudoClassName","replace","pseudoStyleKey","pseudoStyleValue","allBreakpoints","keys","breakpointStyleKey","breakpointStyleValue","mediaQuery","getMediaQuery","set","className","propertyKey","filter","_","map","key","exports"],"sourceRoot":"../../../../src","sources":["web/css/core.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAGO,MAAMC,YAAY,GAAGA,CAACC,IAAY,EAAEC,KAA0B,EAAEC,KAAe,KAAK;EACvFC,MAAM,CAACC,OAAO,CAACH,KAAK,CAAC,CAACI,OAAO,CAAC,CAAC,CAACC,QAAQ,EAAEC,UAAU,CAAC,KAAK;IACtD,IAAID,QAAQ,CAAC,CAAC,CAAC,KAAK,GAAG,EAAE;MACrB,MAAME,eAAe,GAAGF,QAAQ,CAACG,OAAO,CAAC,GAAG,EAAE,GAAGT,IAAI,GAAG,CAAC;MAEzDG,MAAM,CAACC,OAAO,CAACG,UAAU,CAAC,CAACF,OAAO,CAAC,CAAC,CAACK,cAAc,EAAEC,gBAAgB,CAAC,KAAK;QACvE,IAAI,OAAOA,gBAAgB,KAAK,QAAQ,IAAIA,gBAAgB,KAAK,IAAI,EAAE;UACnE,MAAMC,cAAc,GAAGT,MAAM,CAACU,IAAI,CAACN,UAAU,CAAC;UAC9CJ,MAAM,CAACC,OAAO,CAACO,gBAAgB,CAAC,CAACN,OAAO,CAAC,CAAC,CAACS,kBAAkB,EAAEC,oBAAoB,CAAC,KAAK;YACrF,MAAMC,UAAU,GAAG,IAAAC,oBAAa,EAACP,cAAc,EAAEE,cAAc,CAAC;YAEhEV,KAAK,CAACgB,GAAG,CAAC;cACNF,UAAU;cACVG,SAAS,EAAEX,eAAe;cAC1BY,WAAW,EAAEN,kBAAkB;cAC/Bb,KAAK,EAAEc;YACX,CAAC,CAAC;UACN,CAAC,CAAC;UAEF;QACJ;QAEAb,KAAK,CAACgB,GAAG,CAAC;UACNC,SAAS,EAAEX,eAAe;UAC1BY,WAAW,EAAEV,cAAc;UAC3BT,KAAK,EAAEU;QACX,CAAC,CAAC;MACN,CAAC,CAAC;MAEF;IACJ;IAEA,IAAI,OAAOJ,UAAU,KAAK,QAAQ,EAAE;MAChCJ,MAAM,CAACC,OAAO,CAACG,UAAU,CAAC,CAACF,OAAO,CAAC,CAAC,CAACS,kBAAkB,EAAEC,oBAAoB,CAAC,KAAK;QAC/E,MAAMH,cAAc,GAAGT,MAAM,CAACC,OAAO,CAACH,KAAK,CAAC,CACvCoB,MAAM,CAAC,CAAC,CAACC,CAAC,EAAErB,KAAK,CAAC,KAAK;UACpB,IAAI,OAAOA,KAAK,KAAK,QAAQ,IAAIA,KAAK,KAAK,IAAI,EAAE;YAC7C,OAAO,KAAK;UAChB;UAEA,OAAOa,kBAAkB,IAAIb,KAAK;QACtC,CAAC,CAAC,CACDsB,GAAG,CAAC,CAAC,CAACC,GAAG,CAAC,KAAKA,GAAG,CAAC;QACxB,MAAMR,UAAU,GAAG,IAAAC,oBAAa,EAACX,QAAQ,EAAEM,cAAc,CAAC;QAE1DV,KAAK,CAACgB,GAAG,CAAC;UACNF,UAAU;UACVG,SAAS,EAAEnB,IAAI;UACfoB,WAAW,EAAEN,kBAAkB;UAC/Bb,KAAK,EAAEc;QACX,CAAC,CAAC;MACN,CAAC,CAAC;MAEF;IACJ;IAEAb,KAAK,CAACgB,GAAG,CAAC;MACNC,SAAS,EAAEnB,IAAI;MACfoB,WAAW,EAAEd,QAAQ;MACrBL,KAAK,EAAEM;IACX,CAAC,CAAC;EACN,CAAC,CAAC;AACN,CAAC;AAAAkB,OAAA,CAAA1B,YAAA,GAAAA,YAAA","ignoreList":[]}

package/lib/commonjs/web-only/getWebProps.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getWebProps = void 0;
+var _core = require("../core");
+var _createUnistylesRef = require("../web/utils/createUnistylesRef");
+const getWebProps = style => {
+  const styles = (0, _core.getClassName)(style);
+  const ref = (0, _createUnistylesRef.createUnistylesRef)(styles);
+  const [generatedStyles] = styles ?? [];
+  return {
+    className: [generatedStyles?.hash, generatedStyles?.injectedClassName].filter(Boolean).join(' '),
+    ref
+  };
+};
+exports.getWebProps = getWebProps;
+//# sourceMappingURL=getWebProps.js.map

package/lib/commonjs/web-only/getWebProps.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_core","require","_createUnistylesRef","getWebProps","style","styles","getClassName","ref","createUnistylesRef","generatedStyles","className","hash","injectedClassName","filter","Boolean","join","exports"],"sourceRoot":"../../../src","sources":["web-only/getWebProps.ts"],"mappings":";;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AAEA,IAAAC,mBAAA,GAAAD,OAAA;AAEO,MAAME,WAAW,GAAOC,KAAyB,IAAK;EACzD,MAAMC,MAAM,GAAG,IAAAC,kBAAY,EAACF,KAAwB,CAAC;EACrD,MAAMG,GAAG,GAAG,IAAAC,sCAAkB,EAAIH,MAAM,CAAC;EACzC,MAAM,CAACI,eAAe,CAAC,GAAGJ,MAAM,IAAI,EAAE;EAEtC,OAAO;IACHK,SAAS,EAAE,CACPD,eAAe,EAAEE,IAAI,EACrBF,eAAe,EAAEG,iBAAiB,CACrC,CAACC,MAAM,CAACC,OAAO,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC;IAC3BR;EACJ,CAAC;AACL,CAAC;AAAAS,OAAA,CAAAb,WAAA,GAAAA,WAAA","ignoreList":[]}

package/lib/commonjs/web-only/index.js

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

package/lib/commonjs/web-only/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_getWebProps","require"],"sourceRoot":"../../../src","sources":["web-only/index.ts"],"mappings":";;;;;;;;;;;AACA,IAAAA,YAAA,GAAAC,OAAA","ignoreList":[]}

package/lib/module/reanimated/index.js

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

package/lib/module/reanimated/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useAnimatedTheme"],"sourceRoot":"../../../src","sources":["reanimated/index.ts"],"mappings":";;AAAA,SAASA,gBAAgB,QAAQ,oBAAoB","ignoreList":[]}

package/lib/module/reanimated/useAnimatedTheme.js

@@ -0,0 +1,17 @@
+"use strict";
+
+import { useEffect } from 'react';
+import { useSharedValue } from 'react-native-reanimated';
+import { UnistyleDependency, UnistylesRuntime } from '../specs';
+import { services } from '../web/services';
+export const useAnimatedTheme = () => {
+  const theme = useSharedValue(UnistylesRuntime.getTheme());
+  useEffect(() => {
+    const dispose = services.listener.addListeners([UnistyleDependency.Theme], () => theme.set(UnistylesRuntime.getTheme()));
+    return () => {
+      dispose();
+    };
+  }, []);
+  return theme;
+};
+//# sourceMappingURL=useAnimatedTheme.js.map

package/lib/module/reanimated/useAnimatedTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useSharedValue","UnistyleDependency","UnistylesRuntime","services","useAnimatedTheme","theme","getTheme","dispose","listener","addListeners","Theme","set"],"sourceRoot":"../../../src","sources":["reanimated/useAnimatedTheme.ts"],"mappings":";;AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,SAA2BC,cAAc,QAAQ,yBAAyB;AAC1E,SAASC,kBAAkB,EAAEC,gBAAgB,QAAQ,UAAU;AAE/D,SAASC,QAAQ,QAAQ,iBAAiB;AAE1C,OAAO,MAAMC,gBAAgB,GAAGA,CAAA,KAAM;EAClC,MAAMC,KAAK,GAAGL,cAAc,CAACE,gBAAgB,CAACI,QAAQ,CAAC,CAAC,CAAC;EAEzDP,SAAS,CAAC,MAAM;IACZ,MAAMQ,OAAO,GAAGJ,QAAQ,CAACK,QAAQ,CAACC,YAAY,CAAC,CAACR,kBAAkB,CAACS,KAAK,CAAC,EAAE,MAAML,KAAK,CAACM,GAAG,CAACT,gBAAgB,CAACI,QAAQ,CAAC,CAAC,CAAC,CAAC;IAExH,OAAO,MAAM;MACTC,OAAO,CAAC,CAAC;IACb,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/module/reanimated/useAnimatedTheme.native.js

@@ -0,0 +1,19 @@
+"use strict";
+
+import { useEffect } from 'react';
+import { useSharedValue } from 'react-native-reanimated';
+import { StyleSheet, UnistyleDependency, UnistylesRuntime } from '../specs';
+export const useAnimatedTheme = () => {
+  const theme = useSharedValue(UnistylesRuntime.getTheme());
+  useEffect(() => {
+    // @ts-ignore this is hidden from TS
+    const dispose = StyleSheet.addChangeListener(changedDependencies => {
+      if (changedDependencies.includes(UnistyleDependency.Theme)) {
+        theme.set(UnistylesRuntime.getTheme());
+      }
+    });
+    return () => dispose();
+  }, []);
+  return theme;
+};
+//# sourceMappingURL=useAnimatedTheme.native.js.map

package/lib/module/reanimated/useAnimatedTheme.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useSharedValue","StyleSheet","UnistyleDependency","UnistylesRuntime","useAnimatedTheme","theme","getTheme","dispose","addChangeListener","changedDependencies","includes","Theme","set"],"sourceRoot":"../../../src","sources":["reanimated/useAnimatedTheme.native.ts"],"mappings":";;AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,SAA2BC,cAAc,QAAQ,yBAAyB;AAC1E,SAASC,UAAU,EAAEC,kBAAkB,EAAEC,gBAAgB,QAAQ,UAAU;AAG3E,OAAO,MAAMC,gBAAgB,GAAGA,CAAA,KAAM;EAClC,MAAMC,KAAK,GAAGL,cAAc,CAACG,gBAAgB,CAACG,QAAQ,CAAC,CAAC,CAAC;EAEzDP,SAAS,CAAC,MAAM;IACZ;IACA,MAAMQ,OAAO,GAAGN,UAAU,CAACO,iBAAiB,CAACC,mBAAmB,IAAI;MAChE,IAAIA,mBAAmB,CAACC,QAAQ,CAACR,kBAAkB,CAACS,KAAK,CAAC,EAAE;QACxDN,KAAK,CAACO,GAAG,CAACT,gBAAgB,CAACG,QAAQ,CAAC,CAAC,CAAC;MAC1C;IACJ,CAAC,CAAC;IAEF,OAAO,MAAMC,OAAO,CAAC,CAAC;EAC1B,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/module/web/css/core.js

@@ -28,8 +28,13 @@ export const convertToCSS = (hash, value, state) => {
       return;
     }
     if (typeof styleValue === 'object') {
-      const allBreakpoints = Object.keys(value);
       Object.entries(styleValue).forEach(([breakpointStyleKey, breakpointStyleValue]) => {
+        const allBreakpoints = Object.entries(value).filter(([_, value]) => {
+          if (typeof value !== 'object' || value === null) {
+            return false;
+          }
+          return breakpointStyleKey in value;
+        }).map(([key]) => key);
         const mediaQuery = getMediaQuery(styleKey, allBreakpoints);
         state.set({
           mediaQuery,

package/lib/module/web/css/core.js.map

@@ -1 +1 @@
-{"version":3,"names":["getMediaQuery","convertToCSS","hash","value","state","Object","entries","forEach","styleKey","styleValue","pseudoClassName","replace","pseudoStyleKey","pseudoStyleValue","allBreakpoints","keys","breakpointStyleKey","breakpointStyleValue","mediaQuery","set","className","propertyKey"],"sourceRoot":"../../../../src","sources":["web/css/core.ts"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,UAAU;AAGxC,OAAO,MAAMC,YAAY,GAAGA,CAACC,IAAY,EAAEC,KAA0B,EAAEC,KAAe,KAAK;EACvFC,MAAM,CAACC,OAAO,CAACH,KAAK,CAAC,CAACI,OAAO,CAAC,CAAC,CAACC,QAAQ,EAAEC,UAAU,CAAC,KAAK;IACtD,IAAID,QAAQ,CAAC,CAAC,CAAC,KAAK,GAAG,EAAE;MACrB,MAAME,eAAe,GAAGF,QAAQ,CAACG,OAAO,CAAC,GAAG,EAAE,GAAGT,IAAI,GAAG,CAAC;MAEzDG,MAAM,CAACC,OAAO,CAACG,UAAU,CAAC,CAACF,OAAO,CAAC,CAAC,CAACK,cAAc,EAAEC,gBAAgB,CAAC,KAAK;QACvE,IAAI,OAAOA,gBAAgB,KAAK,QAAQ,IAAIA,gBAAgB,KAAK,IAAI,EAAE;UACnE,MAAMC,cAAc,GAAGT,MAAM,CAACU,IAAI,CAACN,UAAU,CAAC;UAC9CJ,MAAM,CAACC,OAAO,CAACO,gBAAgB,CAAC,CAACN,OAAO,CAAC,CAAC,CAACS,kBAAkB,EAAEC,oBAAoB,CAAC,KAAK;YACrF,MAAMC,UAAU,GAAGlB,aAAa,CAACY,cAAc,EAAEE,cAAc,CAAC;YAEhEV,KAAK,CAACe,GAAG,CAAC;cACND,UAAU;cACVE,SAAS,EAAEV,eAAe;cAC1BW,WAAW,EAAEL,kBAAkB;cAC/Bb,KAAK,EAAEc;YACX,CAAC,CAAC;UACN,CAAC,CAAC;UAEF;QACJ;QAEAb,KAAK,CAACe,GAAG,CAAC;UACNC,SAAS,EAAEV,eAAe;UAC1BW,WAAW,EAAET,cAAc;UAC3BT,KAAK,EAAEU;QACX,CAAC,CAAC;MACN,CAAC,CAAC;MAEF;IACJ;IAEA,IAAI,OAAOJ,UAAU,KAAK,QAAQ,EAAE;MAChC,MAAMK,cAAc,GAAGT,MAAM,CAACU,IAAI,CAACZ,KAAK,CAAC;MACzCE,MAAM,CAACC,OAAO,CAACG,UAAU,CAAC,CAACF,OAAO,CAAC,CAAC,CAACS,kBAAkB,EAAEC,oBAAoB,CAAC,KAAK;QAC/E,MAAMC,UAAU,GAAGlB,aAAa,CAACQ,QAAQ,EAAEM,cAAc,CAAC;QAE1DV,KAAK,CAACe,GAAG,CAAC;UACND,UAAU;UACVE,SAAS,EAAElB,IAAI;UACfmB,WAAW,EAAEL,kBAAkB;UAC/Bb,KAAK,EAAEc;QACX,CAAC,CAAC;MACN,CAAC,CAAC;MAEF;IACJ;IAEAb,KAAK,CAACe,GAAG,CAAC;MACNC,SAAS,EAAElB,IAAI;MACfmB,WAAW,EAAEb,QAAQ;MACrBL,KAAK,EAAEM;IACX,CAAC,CAAC;EACN,CAAC,CAAC;AACN,CAAC","ignoreList":[]}
+{"version":3,"names":["getMediaQuery","convertToCSS","hash","value","state","Object","entries","forEach","styleKey","styleValue","pseudoClassName","replace","pseudoStyleKey","pseudoStyleValue","allBreakpoints","keys","breakpointStyleKey","breakpointStyleValue","mediaQuery","set","className","propertyKey","filter","_","map","key"],"sourceRoot":"../../../../src","sources":["web/css/core.ts"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,UAAU;AAGxC,OAAO,MAAMC,YAAY,GAAGA,CAACC,IAAY,EAAEC,KAA0B,EAAEC,KAAe,KAAK;EACvFC,MAAM,CAACC,OAAO,CAACH,KAAK,CAAC,CAACI,OAAO,CAAC,CAAC,CAACC,QAAQ,EAAEC,UAAU,CAAC,KAAK;IACtD,IAAID,QAAQ,CAAC,CAAC,CAAC,KAAK,GAAG,EAAE;MACrB,MAAME,eAAe,GAAGF,QAAQ,CAACG,OAAO,CAAC,GAAG,EAAE,GAAGT,IAAI,GAAG,CAAC;MAEzDG,MAAM,CAACC,OAAO,CAACG,UAAU,CAAC,CAACF,OAAO,CAAC,CAAC,CAACK,cAAc,EAAEC,gBAAgB,CAAC,KAAK;QACvE,IAAI,OAAOA,gBAAgB,KAAK,QAAQ,IAAIA,gBAAgB,KAAK,IAAI,EAAE;UACnE,MAAMC,cAAc,GAAGT,MAAM,CAACU,IAAI,CAACN,UAAU,CAAC;UAC9CJ,MAAM,CAACC,OAAO,CAACO,gBAAgB,CAAC,CAACN,OAAO,CAAC,CAAC,CAACS,kBAAkB,EAAEC,oBAAoB,CAAC,KAAK;YACrF,MAAMC,UAAU,GAAGlB,aAAa,CAACY,cAAc,EAAEE,cAAc,CAAC;YAEhEV,KAAK,CAACe,GAAG,CAAC;cACND,UAAU;cACVE,SAAS,EAAEV,eAAe;cAC1BW,WAAW,EAAEL,kBAAkB;cAC/Bb,KAAK,EAAEc;YACX,CAAC,CAAC;UACN,CAAC,CAAC;UAEF;QACJ;QAEAb,KAAK,CAACe,GAAG,CAAC;UACNC,SAAS,EAAEV,eAAe;UAC1BW,WAAW,EAAET,cAAc;UAC3BT,KAAK,EAAEU;QACX,CAAC,CAAC;MACN,CAAC,CAAC;MAEF;IACJ;IAEA,IAAI,OAAOJ,UAAU,KAAK,QAAQ,EAAE;MAChCJ,MAAM,CAACC,OAAO,CAACG,UAAU,CAAC,CAACF,OAAO,CAAC,CAAC,CAACS,kBAAkB,EAAEC,oBAAoB,CAAC,KAAK;QAC/E,MAAMH,cAAc,GAAGT,MAAM,CAACC,OAAO,CAACH,KAAK,CAAC,CACvCmB,MAAM,CAAC,CAAC,CAACC,CAAC,EAAEpB,KAAK,CAAC,KAAK;UACpB,IAAI,OAAOA,KAAK,KAAK,QAAQ,IAAIA,KAAK,KAAK,IAAI,EAAE;YAC7C,OAAO,KAAK;UAChB;UAEA,OAAOa,kBAAkB,IAAIb,KAAK;QACtC,CAAC,CAAC,CACDqB,GAAG,CAAC,CAAC,CAACC,GAAG,CAAC,KAAKA,GAAG,CAAC;QACxB,MAAMP,UAAU,GAAGlB,aAAa,CAACQ,QAAQ,EAAEM,cAAc,CAAC;QAE1DV,KAAK,CAACe,GAAG,CAAC;UACND,UAAU;UACVE,SAAS,EAAElB,IAAI;UACfmB,WAAW,EAAEL,kBAAkB;UAC/Bb,KAAK,EAAEc;QACX,CAAC,CAAC;MACN,CAAC,CAAC;MAEF;IACJ;IAEAb,KAAK,CAACe,GAAG,CAAC;MACNC,SAAS,EAAElB,IAAI;MACfmB,WAAW,EAAEb,QAAQ;MACrBL,KAAK,EAAEM;IACX,CAAC,CAAC;EACN,CAAC,CAAC;AACN,CAAC","ignoreList":[]}

package/lib/module/web-only/getWebProps.js

@@ -0,0 +1,14 @@
+"use strict";
+
+import { getClassName } from '../core';
+import { createUnistylesRef } from '../web/utils/createUnistylesRef';
+export const getWebProps = style => {
+  const styles = getClassName(style);
+  const ref = createUnistylesRef(styles);
+  const [generatedStyles] = styles ?? [];
+  return {
+    className: [generatedStyles?.hash, generatedStyles?.injectedClassName].filter(Boolean).join(' '),
+    ref
+  };
+};
+//# sourceMappingURL=getWebProps.js.map

package/lib/module/web-only/getWebProps.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getClassName","createUnistylesRef","getWebProps","style","styles","ref","generatedStyles","className","hash","injectedClassName","filter","Boolean","join"],"sourceRoot":"../../../src","sources":["web-only/getWebProps.ts"],"mappings":";;AACA,SAASA,YAAY,QAAQ,SAAS;AAEtC,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE,OAAO,MAAMC,WAAW,GAAOC,KAAyB,IAAK;EACzD,MAAMC,MAAM,GAAGJ,YAAY,CAACG,KAAwB,CAAC;EACrD,MAAME,GAAG,GAAGJ,kBAAkB,CAAIG,MAAM,CAAC;EACzC,MAAM,CAACE,eAAe,CAAC,GAAGF,MAAM,IAAI,EAAE;EAEtC,OAAO;IACHG,SAAS,EAAE,CACPD,eAAe,EAAEE,IAAI,EACrBF,eAAe,EAAEG,iBAAiB,CACrC,CAACC,MAAM,CAACC,OAAO,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC;IAC3BP;EACJ,CAAC;AACL,CAAC","ignoreList":[]}

package/lib/module/web-only/index.js

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

package/lib/module/web-only/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getWebProps"],"sourceRoot":"../../../src","sources":["web-only/index.ts"],"mappings":";;AACA,SAASA,WAAW,QAAQ,eAAe","ignoreList":[]}

package/lib/typescript/plugin/src/consts.d.ts

@@ -0,0 +1,17 @@
+import type { RemapConfig } from '../index';
+export declare const REACT_NATIVE_COMPONENT_NAMES: string[];
+/**
+ * auto replace RN imports to Unistyles imports under these paths
+ * our implementation simply borrows 'ref' to register it in ShadowRegistry
+ * so we won't affect anyone's implementation
+ */
+export declare const REPLACE_WITH_UNISTYLES_PATHS: string[];
+/**
+ * this is more powerful API as it allows to convert unmatched imports to Unistyles
+ */
+export declare const REPLACE_WITH_UNISTYLES_EXOTIC_PATHS: Array<RemapConfig>;
+/**
+ * this list will additionally detect React Native direct imports
+ */
+export declare const NATIVE_COMPONENTS_PATHS: Pick<RemapConfig, 'imports'>;
+//# sourceMappingURL=consts.d.ts.map

package/lib/typescript/plugin/src/consts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../../plugin/src/consts.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAE3C,eAAO,MAAM,4BAA4B,UAoBxC,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,4BAA4B,UAMxC,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,mCAAmC,EAAE,KAAK,CAAC,WAAW,CAAM,CAAA;AAEzE;;GAEG;AACH,eAAO,MAAM,uBAAuB,EAAE,IAAI,CAAC,WAAW,EAAE,SAAS,CAchE,CAAA"}

package/lib/typescript/repack-plugin/src/index.d.ts

@@ -0,0 +1,18 @@
+import { getModulePaths } from '@callstack/repack';
+import type { Compiler, RspackPluginInstance } from '@rspack/core';
+import type { UnistylesPluginOptions } from 'react-native-unistyles/plugin';
+import { unistylesLoader } from './loader';
+export declare const BASE_REPACK_EXCLUDE_PATHS: RegExp[];
+type RuleExcludePaths = ReturnType<typeof getModulePaths>;
+interface ConstructorParams {
+    ruleExcludePaths?: RuleExcludePaths;
+    unistylesPluginOptions?: UnistylesPluginOptions;
+}
+export declare class RepackUnistylePlugin implements RspackPluginInstance {
+    private ruleExcludePaths;
+    private unistylesPluginOptions;
+    constructor({ ruleExcludePaths, unistylesPluginOptions }?: ConstructorParams);
+    apply(compiler: Compiler): void;
+}
+export default unistylesLoader;
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/repack-plugin/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../repack-plugin/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,KAAK,EAAE,QAAQ,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAA;AAClE,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAA;AAC3E,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE1C,eAAO,MAAM,yBAAyB,UAcpC,CAAA;AAEF,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAEzD,UAAU,iBAAiB;IACvB,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;IACnC,sBAAsB,CAAC,EAAE,sBAAsB,CAAA;CAClD;AAwBD,qBAAa,oBAAqB,YAAW,oBAAoB;IAC7D,OAAO,CAAC,gBAAgB,CAAA;IACxB,OAAO,CAAC,sBAAsB,CAAA;gBAElB,EAAE,gBAA4C,EAAE,sBAAsB,EAAE,GAAE,iBAAsB;IAK5G,KAAK,CAAC,QAAQ,EAAE,QAAQ;CAG3B;AAED,eAAe,eAAe,CAAA"}

package/lib/typescript/repack-plugin/src/loader.d.ts

@@ -0,0 +1,9 @@
+import type { LoaderContext } from '@rspack/core';
+import type { UnistylesPluginOptions } from '../../plugin';
+interface UnistylesLoaderOptions {
+    babelPlugins?: string[];
+    unistylesPluginOptions?: UnistylesPluginOptions;
+}
+export declare function unistylesLoader(this: LoaderContext<UnistylesLoaderOptions>, source: string): void;
+export {};
+//# sourceMappingURL=loader.d.ts.map

package/lib/typescript/repack-plugin/src/loader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loader.d.ts","sourceRoot":"","sources":["../../../../repack-plugin/src/loader.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AACjD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAA;AAK1D,UAAU,sBAAsB;IAC5B,YAAY,CAAC,EAAE,MAAM,EAAE,CAAA;IACvB,sBAAsB,CAAC,EAAE,sBAAsB,CAAA;CAClD;AAMD,wBAAgB,eAAe,CAAC,IAAI,EAAE,aAAa,CAAC,sBAAsB,CAAC,EAAE,MAAM,EAAE,MAAM,QAuC1F"}

package/lib/typescript/src/reanimated/index.d.ts

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

package/lib/typescript/src/reanimated/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/reanimated/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA"}

package/lib/typescript/src/reanimated/useAnimatedTheme.d.ts

@@ -0,0 +1,4 @@
+import { type SharedValue } from 'react-native-reanimated';
+import type { UnistylesTheme } from '../types';
+export declare const useAnimatedTheme: () => SharedValue<UnistylesTheme>;
+//# sourceMappingURL=useAnimatedTheme.d.ts.map

package/lib/typescript/src/reanimated/useAnimatedTheme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAnimatedTheme.d.ts","sourceRoot":"","sources":["../../../../src/reanimated/useAnimatedTheme.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,WAAW,EAAkB,MAAM,yBAAyB,CAAA;AAE1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAG9C,eAAO,MAAM,gBAAgB,QAWT,WAAW,CAAC,cAAc,CAC7C,CAAA"}

package/lib/typescript/src/reanimated/useAnimatedTheme.native.d.ts

@@ -0,0 +1,4 @@
+import { type SharedValue } from 'react-native-reanimated';
+import type { UnistylesTheme } from '../types';
+export declare const useAnimatedTheme: () => SharedValue<UnistylesTheme>;
+//# sourceMappingURL=useAnimatedTheme.native.d.ts.map

package/lib/typescript/src/reanimated/useAnimatedTheme.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAnimatedTheme.native.d.ts","sourceRoot":"","sources":["../../../../src/reanimated/useAnimatedTheme.native.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,WAAW,EAAkB,MAAM,yBAAyB,CAAA;AAE1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAE9C,eAAO,MAAM,gBAAgB,QAcT,WAAW,CAAC,cAAc,CAC7C,CAAA"}

package/lib/typescript/src/web/css/core.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../../../../../src/web/css/core.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,eAAO,MAAM,YAAY,SAAU,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,SAAS,QAAQ,SAsDrF,CAAA"}
+{"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../../../../../src/web/css/core.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,eAAO,MAAM,YAAY,SAAU,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,SAAS,QAAQ,SA8DrF,CAAA"}

package/lib/typescript/src/web-only/getWebProps.d.ts

@@ -0,0 +1,7 @@
+import type { StyleProp } from 'react-native';
+import type { RNStyle } from '../types';
+export declare const getWebProps: <T>(style: StyleProp<RNStyle>) => {
+    className: string;
+    ref: ((ref: import("../types").Nullable<T>) => void) | undefined;
+};
+//# sourceMappingURL=getWebProps.d.ts.map

package/lib/typescript/src/web-only/getWebProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getWebProps.d.ts","sourceRoot":"","sources":["../../../../src/web-only/getWebProps.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAE7C,OAAO,KAAK,EAAE,OAAO,EAAmB,MAAM,UAAU,CAAA;AAGxD,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,SAAS,CAAC,OAAO,CAAC;;;CAYvD,CAAA"}

package/lib/typescript/src/web-only/index.d.ts

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

package/lib/typescript/src/web-only/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/web-only/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-unistyles",
-  "version": "3.0.0-nightly-20250512",
+  "version": "3.0.0-nightly-20250520",
   "description": "Level up your React Native StyleSheet",
   "scripts": {
     "test": "NODE_ENV=babel-test jest ./plugin",
@@ -9,10 +9,11 @@
     "lint": "biome lint",
     "check": "biome check --write",
     "check:ci": "biome check",
-    "prepare": "husky && bob build && yarn plugin:build",
+    "prepare": "husky && bob build && yarn plugin:build && yarn repack:plugin:build",
     "precommit": "concurrently 'yarn tsc' 'yarn lint' 'yarn check' 'yarn test' 'yarn circular:check'",
     "release": "release-it",
     "plugin:build": "node plugin/esbuild.js",
+    "repack:plugin:build": "node repack-plugin/esbuild.js",
     "circular:check": "dpdm --no-warning --no-tree -T --exit-code circular:1 src/**/*.ts",
     "components:build": "node build-components.js"
   },
@@ -46,13 +47,32 @@
       "types": "./plugin/index.d.ts",
       "default": "./plugin/index.js"
     },
+    "./repack-plugin": {
+      "import": "./repack-plugin/index.js",
+      "types": "./repack-plugin/index.d.ts",
+      "default": "./repack-plugin/index.js"
+    },
     "./package.json": "./package.json",
     "./server": {
       "types": "./lib/typescript/src/server/index.d.ts",
       "import": "./lib/module/server/index.js",
       "browser": "./lib/module/server/index.js",
-      "react-native": "./src/server.ts",
+      "react-native": "./src/server/index.ts",
       "default": "./lib/commonjs/server/index.js"
+    },
+    "./web": {
+      "types": "./lib/typescript/src/web-only/index.d.ts",
+      "import": "./lib/module/web-only/index.js",
+      "browser": "./lib/module/web-only/index.js",
+      "react-native": "./src/web-only/index.ts",
+      "default": "./lib/commonjs/web-only/index.js"
+    },
+    "./reanimated": {
+      "types": "./lib/typescript/src/reanimated/index.d.ts",
+      "import": "./lib/module/reanimated/index.js",
+      "browser": "./lib/module/reanimated/index.js",
+      "react-native": "./src/reanimated/index.ts",
+      "default": "./lib/commonjs/reanimated/index.js"
     }
   },
   "files": [
@@ -66,8 +86,14 @@
     "web",
     "components",
     "server",
+    "web-only",
+    "reanimated",
     "react-native.config.js",
     "Unistyles.podspec",
+    "repack-plugin",
+    "!repack-plugin/__tests__",
+    "!repack-plugin/src",
+    "!repack-plugin/esbuild.js",
     "!plugin/__tests__",
     "!plugin/src",
     "!plugin/esbuild.js",
@@ -106,9 +132,11 @@
     "@babel/preset-typescript": "7.26.0",
     "@babel/types": "7.26.9",
     "@biomejs/biome": "1.9.4",
+    "@callstack/repack": "5.1.0",
     "@commitlint/config-conventional": "19.7.1",
     "@react-native/normalize-colors": "0.78.0",
     "@release-it/conventional-changelog": "8.0.2",
+    "@rspack/core": "1.3.10",
     "@types/jest": "29.5.14",
     "@types/react": "19.0.10",
     "babel-plugin-tester": "11.0.4",
@@ -124,6 +152,7 @@
     "react-native": "0.77.1",
     "react-native-builder-bob": "0.37.0",
     "react-native-nitro-modules": "0.25.2",
+    "react-native-reanimated": "3.17.5",
     "react-native-web": "0.19.13",
     "react-test-renderer": "18.3.1",
     "release-it": "17.11.0",
@@ -134,7 +163,13 @@
     "react": "*",
     "react-native": ">=0.76.0",
     "react-native-edge-to-edge": "*",
-    "react-native-nitro-modules": "*"
+    "react-native-nitro-modules": "*",
+    "react-native-reanimated": "*"
+  },
+  "peerDependenciesMeta": {
+    "react-native-reanimated": {
+      "optional": true
+    }
   },
   "workspaces": [
     "example",

package/reanimated/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../lib/commonjs/reanimated/index",
+  "module": "../lib/module/reanimated/index",
+  "react-native": "../src/reanimated/index",
+  "types": "../lib/typescript/src/reanimated/index"
+}

package/repack-plugin/index.d.ts

@@ -0,0 +1,19 @@
+import type {Compiler,LoaderContext,RspackPluginInstance } from '@rspack/core'
+import type { UnistylesPluginOptions } from 'react-native-unistyles/plugin'
+
+export declare const BASE_REPACK_EXCLUDE_PATHS: Array<RegExp>
+interface ConstructorParams {
+    ruleExcludePaths?: Array<RegExp>
+    unistylesPluginOptions?: UnistylesPluginOptions
+}
+
+export declare class RepackUnistylePlugin implements RspackPluginInstance {
+    private ruleExcludePaths
+    private unistylesPluginOptions
+    constructor({ ruleExcludePaths, unistylesPluginOptions }?: ConstructorParams)
+    apply(compiler: Compiler): void
+}
+
+declare function unistylesLoader(this: LoaderContext<UnistylesLoaderOptions>, source: string): void;
+
+export default unistylesLoader

package/repack-plugin/index.js

@@ -0,0 +1,152 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// repack-plugin/src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  BASE_REPACK_EXCLUDE_PATHS: () => BASE_REPACK_EXCLUDE_PATHS,
+  RepackUnistylePlugin: () => RepackUnistylePlugin,
+  default: () => index_default
+});
+module.exports = __toCommonJS(index_exports);
+var import_repack = require("@callstack/repack");
+
+// repack-plugin/src/loader.ts
+var import_core = require("@babel/core");
+
+// plugin/src/consts.ts
+var REACT_NATIVE_COMPONENT_NAMES = [
+  "ActivityIndicator",
+  "View",
+  "Text",
+  "Image",
+  "ImageBackground",
+  "KeyboardAvoidingView",
+  "Pressable",
+  "ScrollView",
+  "FlatList",
+  "SectionList",
+  "Switch",
+  "TextInput",
+  "RefreshControl",
+  "TouchableHighlight",
+  "TouchableOpacity",
+  "VirtualizedList",
+  "Animated"
+  // Modal - there is no exposed native handle
+  // TouchableWithoutFeedback - can't accept a ref
+];
+var REPLACE_WITH_UNISTYLES_PATHS = [
+  "react-native-reanimated/src/component",
+  "react-native-reanimated/lib/module/component",
+  "react-native-gesture-handler/lib/module/components",
+  "react-native-gesture-handler/lib/commonjs/components",
+  "react-native-gesture-handler/src/components"
+];
+
+// repack-plugin/src/loader.ts
+var importName = "react-native-unistyles";
+var UNISTYLES_REGEX = new RegExp(
+  [...REACT_NATIVE_COMPONENT_NAMES, ...REPLACE_WITH_UNISTYLES_PATHS, importName].join("|")
+);
+function unistylesLoader(source) {
+  this.cacheable();
+  const callback = this.async();
+  const options = this.getOptions();
+  if (!UNISTYLES_REGEX.test(source)) {
+    callback(null, source);
+    return;
+  }
+  const unistylesOptions = options.unistylesPluginOptions;
+  const unistylesPlugin = unistylesOptions ? ["react-native-unistyles/plugin", unistylesOptions] : "react-native-unistyles/plugin";
+  const babelPlugins = options.babelPlugins ?? [];
+  (0, import_core.transform)(
+    source,
+    {
+      filename: this.resourcePath,
+      babelrc: false,
+      configFile: false,
+      compact: false,
+      comments: true,
+      plugins: [...babelPlugins, unistylesPlugin]
+    },
+    (err, result) => {
+      if (err) {
+        callback(err);
+        return;
+      }
+      callback(null, result.code, result.map);
+      return;
+    }
+  );
+}
+
+// repack-plugin/src/index.ts
+var BASE_REPACK_EXCLUDE_PATHS = (0, import_repack.getModulePaths)([
+  "react",
+  "react-native",
+  "@react-native",
+  "react-native-macos",
+  "react-native-windows",
+  "react-native-tvos",
+  "@callstack/react-native-visionos",
+  "@module-federation",
+  "react-native-unistyles",
+  "whatwg-fetch",
+  "@callstack",
+  "react-native-nitro-modules",
+  "@callstack/repack"
+]);
+var getUnistyleModuleRules = (excludePathLoader, unistylesPluginOptions) => {
+  const createRule = (test, babelPlugins) => ({
+    test,
+    use: {
+      loader: "react-native-unistyles/repack-plugin",
+      options: {
+        babelPlugins,
+        unistylesPluginOptions
+      }
+    }
+  });
+  return {
+    exclude: excludePathLoader,
+    oneOf: [
+      createRule(/\.[cm]?ts$/, [["@babel/plugin-syntax-typescript", { isTSX: false, allowNamespaces: true }]]),
+      createRule(/\.[cm]?tsx$/, [["@babel/plugin-syntax-typescript", { isTSX: true, allowNamespaces: true }]]),
+      createRule(/\.[cm]?jsx?$/, ["babel-plugin-syntax-hermes-parser"])
+    ]
+  };
+};
+var RepackUnistylePlugin = class {
+  ruleExcludePaths;
+  unistylesPluginOptions;
+  constructor({ ruleExcludePaths = BASE_REPACK_EXCLUDE_PATHS, unistylesPluginOptions } = {}) {
+    this.ruleExcludePaths = ruleExcludePaths;
+    this.unistylesPluginOptions = unistylesPluginOptions;
+  }
+  apply(compiler) {
+    compiler.options.module.rules.push(getUnistyleModuleRules(this.ruleExcludePaths, this.unistylesPluginOptions));
+  }
+};
+var index_default = unistylesLoader;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BASE_REPACK_EXCLUDE_PATHS,
+  RepackUnistylePlugin
+});

package/src/reanimated/index.ts

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

package/src/reanimated/useAnimatedTheme.native.ts

@@ -0,0 +1,21 @@
+import { useEffect } from 'react'
+import { type SharedValue, useSharedValue } from 'react-native-reanimated'
+import { StyleSheet, UnistyleDependency, UnistylesRuntime } from '../specs'
+import type { UnistylesTheme } from '../types'
+
+export const useAnimatedTheme = () => {
+    const theme = useSharedValue(UnistylesRuntime.getTheme())
+
+    useEffect(() => {
+        // @ts-ignore this is hidden from TS
+        const dispose = StyleSheet.addChangeListener(changedDependencies => {
+            if (changedDependencies.includes(UnistyleDependency.Theme)) {
+                theme.set(UnistylesRuntime.getTheme())
+            }
+        })
+
+        return () => dispose()
+    }, [])
+
+    return theme as SharedValue<UnistylesTheme>
+}

package/src/reanimated/useAnimatedTheme.ts

@@ -0,0 +1,19 @@
+import { useEffect } from 'react'
+import { type SharedValue, useSharedValue } from 'react-native-reanimated'
+import { UnistyleDependency, UnistylesRuntime } from '../specs'
+import type { UnistylesTheme } from '../types'
+import { services } from '../web/services'
+
+export const useAnimatedTheme = () => {
+    const theme = useSharedValue(UnistylesRuntime.getTheme())
+
+    useEffect(() => {
+        const dispose = services.listener.addListeners([UnistyleDependency.Theme], () => theme.set(UnistylesRuntime.getTheme()))
+
+        return () => {
+            dispose()
+        }
+    }, [])
+
+    return theme as SharedValue<UnistylesTheme>
+}

package/src/web/css/core.ts

@@ -34,8 +34,16 @@ export const convertToCSS = (hash: string, value: Record<string, any>, state: CS
         }
 
         if (typeof styleValue === 'object') {
-            const allBreakpoints = Object.keys(value)
             Object.entries(styleValue).forEach(([breakpointStyleKey, breakpointStyleValue]) => {
+                const allBreakpoints = Object.entries(value)
+                    .filter(([_, value]) => {
+                        if (typeof value !== 'object' || value === null) {
+                            return false
+                        }
+
+                        return breakpointStyleKey in value
+                    })
+                    .map(([key]) => key)
                 const mediaQuery = getMediaQuery(styleKey, allBreakpoints)
 
                 state.set({

package/src/web-only/getWebProps.ts

@@ -0,0 +1,18 @@
+import type { StyleProp } from 'react-native'
+import { getClassName } from '../core'
+import type { RNStyle, UnistylesValues } from '../types'
+import { createUnistylesRef } from '../web/utils/createUnistylesRef'
+
+export const getWebProps = <T>(style: StyleProp<RNStyle>) => {
+    const styles = getClassName(style as UnistylesValues)
+    const ref = createUnistylesRef<T>(styles)
+    const [generatedStyles] = styles ?? []
+
+    return {
+        className: [
+            generatedStyles?.hash,
+            generatedStyles?.injectedClassName,
+        ].filter(Boolean).join(' '),
+        ref
+    }
+}

package/src/web-only/index.ts

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

package/web/package.json

@@ -0,0 +1,6 @@
+{
+    "main": "../lib/commonjs/web-only/index",
+    "module": "../lib/module/web-only/index",
+    "react-native": "../src/web-only/index",
+    "types": "../lib/typescript/src/web-only/index"
+}