react-native-unistyles 3.0.0-rc.4 → 3.0.0-rc.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (288) hide show
  1. package/README.md +10 -8
  2. package/android/src/main/cxx/NativeUnistylesModule.cpp +3 -7
  3. package/android/src/main/cxx/NativeUnistylesModule.h +0 -4
  4. package/android/src/main/java/com/unistyles/UnistylesModule.kt +1 -7
  5. package/cxx/core/UnistyleWrapper.h +4 -1
  6. package/cxx/core/UnistylesCommitShadowNode.h +0 -21
  7. package/cxx/core/UnistylesRegistry.cpp +45 -49
  8. package/cxx/core/UnistylesState.cpp +10 -0
  9. package/cxx/core/UnistylesState.h +3 -0
  10. package/cxx/hybridObjects/HybridShadowRegistry.cpp +6 -1
  11. package/cxx/hybridObjects/HybridShadowRegistry.h +6 -0
  12. package/cxx/hybridObjects/HybridStyleSheet.cpp +13 -16
  13. package/cxx/hybridObjects/HybridStyleSheet.h +2 -7
  14. package/cxx/hybridObjects/HybridUnistylesRuntime.cpp +8 -0
  15. package/cxx/hybridObjects/HybridUnistylesRuntime.h +2 -0
  16. package/cxx/parser/Parser.cpp +175 -110
  17. package/cxx/parser/Parser.h +1 -0
  18. package/cxx/shadowTree/ShadowTreeManager.cpp +36 -33
  19. package/cxx/shadowTree/ShadowTreeManager.h +0 -1
  20. package/ios/UnistylesModuleOnLoad.h +1 -5
  21. package/ios/UnistylesModuleOnLoad.mm +5 -13
  22. package/lib/commonjs/components/AdaptiveTheme.js +35 -0
  23. package/lib/commonjs/components/AdaptiveTheme.js.map +1 -0
  24. package/lib/commonjs/components/ApplyScopedTheme.js +19 -0
  25. package/lib/commonjs/components/ApplyScopedTheme.js.map +1 -0
  26. package/lib/commonjs/components/NamedTheme.js +31 -0
  27. package/lib/commonjs/components/NamedTheme.js.map +1 -0
  28. package/lib/commonjs/components/ScopedTheme.js +24 -20
  29. package/lib/commonjs/components/ScopedTheme.js.map +1 -1
  30. package/lib/commonjs/components/native/Image.js +1 -2
  31. package/lib/commonjs/components/native/Image.js.map +1 -1
  32. package/lib/commonjs/components/native/ImageBackground.js +1 -2
  33. package/lib/commonjs/components/native/ImageBackground.js.map +1 -1
  34. package/lib/commonjs/components/native/Pressable.js +1 -2
  35. package/lib/commonjs/components/native/Pressable.js.map +1 -1
  36. package/lib/commonjs/components/native/Pressable.native.js +1 -2
  37. package/lib/commonjs/components/native/Pressable.native.js.map +1 -1
  38. package/lib/commonjs/core/createUnistylesElement.js +3 -3
  39. package/lib/commonjs/core/createUnistylesElement.js.map +1 -1
  40. package/lib/commonjs/core/createUnistylesElement.native.js +18 -31
  41. package/lib/commonjs/core/createUnistylesElement.native.js.map +1 -1
  42. package/lib/commonjs/core/createUnistylesImageBackground.js +6 -21
  43. package/lib/commonjs/core/createUnistylesImageBackground.js.map +1 -1
  44. package/lib/commonjs/core/getClassname.js +1 -2
  45. package/lib/commonjs/core/getClassname.js.map +1 -1
  46. package/lib/commonjs/core/parseBoxShadow.js +57 -0
  47. package/lib/commonjs/core/parseBoxShadow.js.map +1 -0
  48. package/lib/commonjs/core/useProxifiedUnistyles/listener.js +1 -2
  49. package/lib/commonjs/core/useProxifiedUnistyles/listener.js.map +1 -1
  50. package/lib/commonjs/core/withUnistyles/withUnistyles.js +1 -2
  51. package/lib/commonjs/core/withUnistyles/withUnistyles.js.map +1 -1
  52. package/lib/commonjs/core/withUnistyles/withUnistyles.native.js +1 -2
  53. package/lib/commonjs/core/withUnistyles/withUnistyles.native.js.map +1 -1
  54. package/lib/commonjs/index.js +6 -0
  55. package/lib/commonjs/index.js.map +1 -1
  56. package/lib/commonjs/mocks.js +5 -2
  57. package/lib/commonjs/mocks.js.map +1 -1
  58. package/lib/commonjs/reanimated/index.js +7 -0
  59. package/lib/commonjs/reanimated/index.js.map +1 -1
  60. package/lib/commonjs/reanimated/variant/index.js +17 -0
  61. package/lib/commonjs/reanimated/variant/index.js.map +1 -0
  62. package/lib/commonjs/reanimated/variant/types.js +2 -0
  63. package/lib/commonjs/reanimated/variant/types.js.map +1 -0
  64. package/lib/commonjs/reanimated/variant/useAnimatedVariantColor.js +38 -0
  65. package/lib/commonjs/reanimated/variant/useAnimatedVariantColor.js.map +1 -0
  66. package/lib/commonjs/reanimated/variant/useUpdateVariantColor.js +66 -0
  67. package/lib/commonjs/reanimated/variant/useUpdateVariantColor.js.map +1 -0
  68. package/lib/commonjs/reanimated/variant/useUpdateVariantColor.native.js +39 -0
  69. package/lib/commonjs/reanimated/variant/useUpdateVariantColor.native.js.map +1 -0
  70. package/lib/commonjs/server/getServerUnistyles.js +1 -2
  71. package/lib/commonjs/server/getServerUnistyles.js.map +1 -1
  72. package/lib/commonjs/server/hydrateServerUnistyles.js +1 -2
  73. package/lib/commonjs/server/hydrateServerUnistyles.js.map +1 -1
  74. package/lib/commonjs/server/resetServerUnistyles.js +1 -2
  75. package/lib/commonjs/server/resetServerUnistyles.js.map +1 -1
  76. package/lib/commonjs/specs/ShadowRegistry/index.js +6 -1
  77. package/lib/commonjs/specs/ShadowRegistry/index.js.map +1 -1
  78. package/lib/commonjs/specs/StyleSheet/index.js +3 -1
  79. package/lib/commonjs/specs/StyleSheet/index.js.map +1 -1
  80. package/lib/commonjs/utils.js +0 -3
  81. package/lib/commonjs/utils.js.map +1 -1
  82. package/lib/commonjs/web/create.js +2 -3
  83. package/lib/commonjs/web/create.js.map +1 -1
  84. package/lib/commonjs/web/css/core.js +6 -1
  85. package/lib/commonjs/web/css/core.js.map +1 -1
  86. package/lib/commonjs/web/css/state.js +10 -7
  87. package/lib/commonjs/web/css/state.js.map +1 -1
  88. package/lib/commonjs/web/index.js +1 -2
  89. package/lib/commonjs/web/index.js.map +1 -1
  90. package/lib/commonjs/web/listener.js +2 -0
  91. package/lib/commonjs/web/listener.js.map +1 -1
  92. package/lib/commonjs/web/runtime.js +15 -1
  93. package/lib/commonjs/web/runtime.js.map +1 -1
  94. package/lib/commonjs/web/shadowRegistry.js +5 -3
  95. package/lib/commonjs/web/shadowRegistry.js.map +1 -1
  96. package/lib/commonjs/web/state.js +1 -10
  97. package/lib/commonjs/web/state.js.map +1 -1
  98. package/lib/commonjs/web/types.js.map +1 -1
  99. package/lib/commonjs/web/utils/createUnistylesRef.js +1 -2
  100. package/lib/commonjs/web/utils/createUnistylesRef.js.map +1 -1
  101. package/lib/commonjs/web/utils/unistyle.js +26 -4
  102. package/lib/commonjs/web/utils/unistyle.js.map +1 -1
  103. package/lib/module/components/AdaptiveTheme.js +29 -0
  104. package/lib/module/components/AdaptiveTheme.js.map +1 -0
  105. package/lib/module/components/ApplyScopedTheme.js +14 -0
  106. package/lib/module/components/ApplyScopedTheme.js.map +1 -0
  107. package/lib/module/components/NamedTheme.js +25 -0
  108. package/lib/module/components/NamedTheme.js.map +1 -0
  109. package/lib/module/components/ScopedTheme.js +24 -19
  110. package/lib/module/components/ScopedTheme.js.map +1 -1
  111. package/lib/module/core/createUnistylesElement.js +3 -3
  112. package/lib/module/core/createUnistylesElement.js.map +1 -1
  113. package/lib/module/core/createUnistylesElement.native.js +18 -30
  114. package/lib/module/core/createUnistylesElement.native.js.map +1 -1
  115. package/lib/module/core/createUnistylesImageBackground.js +5 -19
  116. package/lib/module/core/createUnistylesImageBackground.js.map +1 -1
  117. package/lib/module/core/parseBoxShadow.js +52 -0
  118. package/lib/module/core/parseBoxShadow.js.map +1 -0
  119. package/lib/module/core/withUnistyles/withUnistyles.native.js.map +1 -1
  120. package/lib/module/index.js +5 -0
  121. package/lib/module/index.js.map +1 -1
  122. package/lib/module/mocks.js +5 -2
  123. package/lib/module/mocks.js.map +1 -1
  124. package/lib/module/reanimated/index.js +1 -0
  125. package/lib/module/reanimated/index.js.map +1 -1
  126. package/lib/module/reanimated/variant/index.js +4 -0
  127. package/lib/module/reanimated/variant/index.js.map +1 -0
  128. package/lib/module/reanimated/variant/types.js +2 -0
  129. package/lib/module/reanimated/variant/types.js.map +1 -0
  130. package/lib/module/reanimated/variant/useAnimatedVariantColor.js +33 -0
  131. package/lib/module/reanimated/variant/useAnimatedVariantColor.js.map +1 -0
  132. package/lib/module/reanimated/variant/useUpdateVariantColor.js +61 -0
  133. package/lib/module/reanimated/variant/useUpdateVariantColor.js.map +1 -0
  134. package/lib/module/reanimated/variant/useUpdateVariantColor.native.js +34 -0
  135. package/lib/module/reanimated/variant/useUpdateVariantColor.native.js.map +1 -0
  136. package/lib/module/specs/ShadowRegistry/index.js +6 -1
  137. package/lib/module/specs/ShadowRegistry/index.js.map +1 -1
  138. package/lib/module/specs/StyleSheet/index.js +3 -1
  139. package/lib/module/specs/StyleSheet/index.js.map +1 -1
  140. package/lib/module/utils.js +0 -3
  141. package/lib/module/utils.js.map +1 -1
  142. package/lib/module/web/create.js +1 -1
  143. package/lib/module/web/create.js.map +1 -1
  144. package/lib/module/web/css/core.js +6 -1
  145. package/lib/module/web/css/core.js.map +1 -1
  146. package/lib/module/web/css/state.js +10 -7
  147. package/lib/module/web/css/state.js.map +1 -1
  148. package/lib/module/web/listener.js +2 -0
  149. package/lib/module/web/listener.js.map +1 -1
  150. package/lib/module/web/runtime.js +16 -2
  151. package/lib/module/web/runtime.js.map +1 -1
  152. package/lib/module/web/shadowRegistry.js +5 -3
  153. package/lib/module/web/shadowRegistry.js.map +1 -1
  154. package/lib/module/web/state.js +1 -10
  155. package/lib/module/web/state.js.map +1 -1
  156. package/lib/module/web/types.js.map +1 -1
  157. package/lib/module/web/utils/unistyle.js +24 -3
  158. package/lib/module/web/utils/unistyle.js.map +1 -1
  159. package/lib/typescript/plugin/src/consts.d.ts +17 -0
  160. package/lib/typescript/plugin/src/consts.d.ts.map +1 -0
  161. package/lib/typescript/repack-plugin/src/index.d.ts +18 -0
  162. package/lib/typescript/repack-plugin/src/index.d.ts.map +1 -0
  163. package/lib/typescript/repack-plugin/src/loader.d.ts +9 -0
  164. package/lib/typescript/repack-plugin/src/loader.d.ts.map +1 -0
  165. package/lib/typescript/src/components/AdaptiveTheme.d.ts +8 -0
  166. package/lib/typescript/src/components/AdaptiveTheme.d.ts.map +1 -0
  167. package/lib/typescript/src/components/ApplyScopedTheme.d.ts +7 -0
  168. package/lib/typescript/src/components/ApplyScopedTheme.d.ts.map +1 -0
  169. package/lib/typescript/src/components/NamedTheme.d.ts +10 -0
  170. package/lib/typescript/src/components/NamedTheme.d.ts.map +1 -0
  171. package/lib/typescript/src/components/ScopedTheme.d.ts +4 -0
  172. package/lib/typescript/src/components/ScopedTheme.d.ts.map +1 -1
  173. package/lib/typescript/src/components/native/Animated.d.ts.map +1 -1
  174. package/lib/typescript/src/core/createUnistylesElement.d.ts.map +1 -1
  175. package/lib/typescript/src/core/createUnistylesElement.native.d.ts.map +1 -1
  176. package/lib/typescript/src/core/createUnistylesImageBackground.d.ts.map +1 -1
  177. package/lib/typescript/src/core/getClassname.d.ts.map +1 -1
  178. package/lib/typescript/src/core/parseBoxShadow.d.ts +11 -0
  179. package/lib/typescript/src/core/parseBoxShadow.d.ts.map +1 -0
  180. package/lib/typescript/src/core/passForwardRef.d.ts.map +1 -1
  181. package/lib/typescript/src/core/useProxifiedUnistyles/listener.d.ts.map +1 -1
  182. package/lib/typescript/src/core/useProxifiedUnistyles/listener.native.d.ts.map +1 -1
  183. package/lib/typescript/src/core/useProxifiedUnistyles/useProxifiedUnistyles.d.ts.map +1 -1
  184. package/lib/typescript/src/core/warn.d.ts.map +1 -1
  185. package/lib/typescript/src/core/withUnistyles/withUnistyles.d.ts.map +1 -1
  186. package/lib/typescript/src/core/withUnistyles/withUnistyles.native.d.ts.map +1 -1
  187. package/lib/typescript/src/hooks/useMedia.d.ts.map +1 -1
  188. package/lib/typescript/src/hooks/useMedia.native.d.ts.map +1 -1
  189. package/lib/typescript/src/index.d.ts.map +1 -1
  190. package/lib/typescript/src/reanimated/index.d.ts +1 -0
  191. package/lib/typescript/src/reanimated/index.d.ts.map +1 -1
  192. package/lib/typescript/src/reanimated/variant/index.d.ts +2 -0
  193. package/lib/typescript/src/reanimated/variant/index.d.ts.map +1 -0
  194. package/lib/typescript/src/reanimated/variant/types.d.ts +10 -0
  195. package/lib/typescript/src/reanimated/variant/types.d.ts.map +1 -0
  196. package/lib/typescript/src/reanimated/variant/useAnimatedVariantColor.d.ts +3 -0
  197. package/lib/typescript/src/reanimated/variant/useAnimatedVariantColor.d.ts.map +1 -0
  198. package/lib/typescript/src/reanimated/variant/useUpdateVariantColor.d.ts +6 -0
  199. package/lib/typescript/src/reanimated/variant/useUpdateVariantColor.d.ts.map +1 -0
  200. package/lib/typescript/src/reanimated/variant/useUpdateVariantColor.native.d.ts +6 -0
  201. package/lib/typescript/src/reanimated/variant/useUpdateVariantColor.native.d.ts.map +1 -0
  202. package/lib/typescript/src/server/getServerUnistyles.d.ts.map +1 -1
  203. package/lib/typescript/src/server/serialize.d.ts.map +1 -1
  204. package/lib/typescript/src/server/useServerUnistyles.d.ts.map +1 -1
  205. package/lib/typescript/src/specs/ShadowRegistry/index.d.ts +1 -0
  206. package/lib/typescript/src/specs/ShadowRegistry/index.d.ts.map +1 -1
  207. package/lib/typescript/src/specs/StatusBar/index.d.ts.map +1 -1
  208. package/lib/typescript/src/specs/StyleSheet/index.d.ts +2 -0
  209. package/lib/typescript/src/specs/StyleSheet/index.d.ts.map +1 -1
  210. package/lib/typescript/src/specs/UnistylesRuntime/UnistylesRuntime.nitro.d.ts +2 -0
  211. package/lib/typescript/src/specs/UnistylesRuntime/UnistylesRuntime.nitro.d.ts.map +1 -1
  212. package/lib/typescript/src/types/stylesheet.d.ts.map +1 -1
  213. package/lib/typescript/src/utils.d.ts.map +1 -1
  214. package/lib/typescript/src/web/convert/index.d.ts.map +1 -1
  215. package/lib/typescript/src/web/convert/object/boxShadow.d.ts.map +1 -1
  216. package/lib/typescript/src/web/convert/object/filter.d.ts.map +1 -1
  217. package/lib/typescript/src/web/convert/object/objectStyle.d.ts.map +1 -1
  218. package/lib/typescript/src/web/convert/object/transform.d.ts.map +1 -1
  219. package/lib/typescript/src/web/convert/pseudo.d.ts.map +1 -1
  220. package/lib/typescript/src/web/convert/shadow/boxShadow.d.ts.map +1 -1
  221. package/lib/typescript/src/web/convert/shadow/getShadowBreakpoints.d.ts.map +1 -1
  222. package/lib/typescript/src/web/convert/shadow/textShadow.d.ts.map +1 -1
  223. package/lib/typescript/src/web/convert/style.d.ts.map +1 -1
  224. package/lib/typescript/src/web/convert/utils.d.ts.map +1 -1
  225. package/lib/typescript/src/web/create.d.ts.map +1 -1
  226. package/lib/typescript/src/web/css/core.d.ts.map +1 -1
  227. package/lib/typescript/src/web/css/state.d.ts +2 -1
  228. package/lib/typescript/src/web/css/state.d.ts.map +1 -1
  229. package/lib/typescript/src/web/css/utils.d.ts.map +1 -1
  230. package/lib/typescript/src/web/listener.d.ts.map +1 -1
  231. package/lib/typescript/src/web/registry.d.ts.map +1 -1
  232. package/lib/typescript/src/web/runtime.d.ts +2 -0
  233. package/lib/typescript/src/web/runtime.d.ts.map +1 -1
  234. package/lib/typescript/src/web/shadowRegistry.d.ts +2 -0
  235. package/lib/typescript/src/web/shadowRegistry.d.ts.map +1 -1
  236. package/lib/typescript/src/web/state.d.ts.map +1 -1
  237. package/lib/typescript/src/web/types.d.ts +4 -1
  238. package/lib/typescript/src/web/types.d.ts.map +1 -1
  239. package/lib/typescript/src/web/utils/common.d.ts.map +1 -1
  240. package/lib/typescript/src/web/utils/createUnistylesRef.d.ts.map +1 -1
  241. package/lib/typescript/src/web/utils/unistyle.d.ts +5 -1
  242. package/lib/typescript/src/web/utils/unistyle.d.ts.map +1 -1
  243. package/lib/typescript/src/web/variants.d.ts.map +1 -1
  244. package/lib/typescript/src/web-only/getWebProps.d.ts.map +1 -1
  245. package/nitrogen/generated/ios/Unistyles-Swift-Cxx-Umbrella.hpp +1 -0
  246. package/nitrogen/generated/shared/c++/HybridUnistylesRuntimeSpec.cpp +2 -0
  247. package/nitrogen/generated/shared/c++/HybridUnistylesRuntimeSpec.hpp +2 -0
  248. package/package.json +32 -23
  249. package/plugin/index.d.ts +6 -5
  250. package/plugin/index.js +11 -6
  251. package/repack-plugin/index.d.ts +19 -0
  252. package/repack-plugin/index.js +149 -0
  253. package/src/components/AdaptiveTheme.tsx +34 -0
  254. package/src/components/ApplyScopedTheme.tsx +17 -0
  255. package/src/components/NamedTheme.tsx +33 -0
  256. package/src/components/ScopedTheme.tsx +42 -22
  257. package/src/core/createUnistylesElement.native.tsx +21 -31
  258. package/src/core/createUnistylesElement.tsx +3 -3
  259. package/src/core/createUnistylesImageBackground.tsx +7 -22
  260. package/src/core/parseBoxShadow.ts +87 -0
  261. package/src/core/withUnistyles/withUnistyles.native.tsx +1 -0
  262. package/src/index.ts +8 -0
  263. package/src/mocks.ts +5 -2
  264. package/src/reanimated/index.ts +1 -0
  265. package/src/reanimated/variant/index.ts +1 -0
  266. package/src/reanimated/variant/types.ts +14 -0
  267. package/src/reanimated/variant/useAnimatedVariantColor.ts +38 -0
  268. package/src/reanimated/variant/useUpdateVariantColor.native.ts +38 -0
  269. package/src/reanimated/variant/useUpdateVariantColor.ts +81 -0
  270. package/src/specs/ShadowRegistry/index.ts +7 -1
  271. package/src/specs/StyleSheet/index.ts +5 -2
  272. package/src/specs/UnistylesRuntime/UnistylesRuntime.nitro.ts +2 -0
  273. package/src/utils.ts +1 -3
  274. package/src/web/create.ts +1 -1
  275. package/src/web/css/core.ts +9 -1
  276. package/src/web/css/state.ts +10 -8
  277. package/src/web/listener.ts +2 -0
  278. package/src/web/runtime.ts +23 -2
  279. package/src/web/shadowRegistry.ts +5 -3
  280. package/src/web/state.ts +7 -17
  281. package/src/web/types.ts +4 -1
  282. package/src/web/utils/unistyle.ts +34 -4
  283. package/cxx/core/UnistylesCommitHook.cpp +0 -59
  284. package/cxx/core/UnistylesCommitHook.h +0 -27
  285. package/cxx/core/UnistylesMountHook.cpp +0 -26
  286. package/cxx/core/UnistylesMountHook.h +0 -24
  287. package/lib/module/package.json +0 -1
  288. /package/{web-only → web}/package.json +0 -0
package/src/web/create.ts CHANGED
@@ -21,7 +21,7 @@ export const create = (stylesheet: StyleSheetWithSuperPowers<StyleSheet>, id?: s
21
21
  __uni__key: key,
22
22
  __uni__stylesheet: stylesheet,
23
23
  __uni__args: args,
24
- __uni_variants: variants
24
+ __stylesheetVariants: variants
25
25
  })
26
26
 
27
27
  const createStyleSheetStyles = (variants?: Variants) => {
@@ -34,8 +34,16 @@ export const convertToCSS = (hash: string, value: Record<string, any>, state: CS
34
34
  }
35
35
 
36
36
  if (typeof styleValue === 'object') {
37
- const allBreakpoints = Object.keys(value)
38
37
  Object.entries(styleValue).forEach(([breakpointStyleKey, breakpointStyleValue]) => {
38
+ const allBreakpoints = Object.entries(value)
39
+ .filter(([_, value]) => {
40
+ if (typeof value !== 'object' || value === null) {
41
+ return false
42
+ }
43
+
44
+ return breakpointStyleKey in value
45
+ })
46
+ .map(([key]) => key)
39
47
  const mediaQuery = getMediaQuery(styleKey, allBreakpoints)
40
48
 
41
49
  state.set({
@@ -32,7 +32,7 @@ export class CSSState {
32
32
  mainMap: MapType = new Map()
33
33
  mqMap: MapType = new Map()
34
34
  private styleTag: HTMLStyleElement | null = null
35
- private CSS = ''
35
+ private themesCSS = new Map<string, string>()
36
36
 
37
37
  constructor(private services: UnistylesServices) {
38
38
  if (isServer()) {
@@ -62,7 +62,10 @@ export class CSSState {
62
62
 
63
63
  add = (hash: string, values: UnistylesValues) => {
64
64
  convertToCSS(hash, convertUnistyles(values, this.services.runtime), this)
65
+ this.recreate()
66
+ }
65
67
 
68
+ recreate = () => {
66
69
  if (this.styleTag) {
67
70
  this.styleTag.innerText = this.getStyles()
68
71
  }
@@ -84,10 +87,10 @@ export class CSSState {
84
87
  Object.entries(values).forEach(([key, value]) => convertToCSS(key, value))
85
88
 
86
89
  if (theme === 'light' || theme === 'dark') {
87
- this.CSS += `@media (prefers-color-scheme: ${theme}){:root{${themeVars}}}`
90
+ this.themesCSS.set(`media ${theme}`, `@media (prefers-color-scheme: ${theme}){:root{${themeVars}}}`)
88
91
  }
89
92
 
90
- this.CSS += `:root.${theme}{${themeVars}}`
93
+ this.themesCSS.set(theme, `:root.${theme}{${themeVars}}`)
91
94
  }
92
95
 
93
96
  remove = (hash: string) => {
@@ -97,14 +100,13 @@ export class CSSState {
97
100
  this.mqMap.forEach(styles => {
98
101
  styles.delete(hash)
99
102
  })
100
-
101
- if (this.styleTag) {
102
- this.styleTag.innerText = this.getStyles()
103
- }
103
+ this.recreate()
104
104
  }
105
105
 
106
106
  getStyles = () => {
107
- let styles = this.CSS
107
+ let styles = Array.from(this.themesCSS.entries()).reduce((acc, [, themeCss]) => {
108
+ return acc + themeCss
109
+ }, '')
108
110
 
109
111
  const generate = (mediaQuery: string, secondLevelMap: Map<string, Map<string, string>>) => {
110
112
  if (mediaQuery) {
@@ -29,6 +29,7 @@ export class UnistylesListener {
29
29
 
30
30
  if (this.services.runtime.hasAdaptiveThemes) {
31
31
  this.emitChange(UnistyleDependency.Theme)
32
+ this.emitChange(UnistyleDependency.ThemeName)
32
33
  }
33
34
  })
34
35
  this.services.runtime.lightMedia?.addEventListener('change', event => {
@@ -40,6 +41,7 @@ export class UnistylesListener {
40
41
 
41
42
  if (this.services.runtime.hasAdaptiveThemes) {
42
43
  this.emitChange(UnistyleDependency.Theme)
44
+ this.emitChange(UnistyleDependency.ThemeName)
43
45
  }
44
46
  })
45
47
 
@@ -4,7 +4,7 @@ import { type AppTheme, type AppThemeName, ColorScheme, Orientation } from '../s
4
4
  import { type UnistylesTheme, WebContentSizeCategory } from '../types'
5
5
  import { NavigationBar, StatusBar } from './mock'
6
6
  import type { UnistylesServices } from './types'
7
- import { error, isServer, schemeToTheme } from './utils'
7
+ import { convertTheme, error, isServer, schemeToTheme } from './utils'
8
8
 
9
9
  export class UnistylesRuntime {
10
10
  lightMedia = this.getLightMedia()
@@ -76,6 +76,14 @@ export class UnistylesRuntime {
76
76
  return screen.orientation.type.includes('portrait') ? Orientation.Portrait : Orientation.Landscape
77
77
  }
78
78
 
79
+ get isLandscape() {
80
+ return this.orientation === Orientation.Landscape
81
+ }
82
+
83
+ get isPortrait() {
84
+ return this.orientation === Orientation.Portrait
85
+ }
86
+
79
87
  get theme() {
80
88
  return this.getTheme(this.themeName)
81
89
  }
@@ -204,7 +212,20 @@ export class UnistylesRuntime {
204
212
  throw error(`Unistyles: You're trying to update theme "${themeName}" but it wasn't registered.`)
205
213
  }
206
214
 
207
- this.services.state.themes.set(themeName, updater(oldTheme))
215
+ const newTheme = updater(oldTheme)
216
+
217
+ this.services.state.themes.set(themeName, newTheme)
218
+
219
+ if (this.services.state.CSSVars) {
220
+ this.services.state.cssThemes.set(
221
+ themeName,
222
+ Object.fromEntries(Object.entries(newTheme).map(([key, value]) => {
223
+ return convertTheme(key, value)
224
+ })) as UnistylesTheme
225
+ )
226
+ this.services.registry.css.addTheme(themeName, newTheme)
227
+ this.services.registry.css.recreate()
228
+ }
208
229
  }
209
230
 
210
231
  getTheme = (themeName = this.themeName, CSSVars = false) => {
@@ -20,7 +20,7 @@ export class UnistylesShadowRegistry {
20
20
  constructor(private services: UnistylesServices) {}
21
21
 
22
22
  add = (ref: any, hash?: string) => {
23
- if (!(ref instanceof HTMLElement) || !hash) {
23
+ if (isServer() || !(ref instanceof HTMLElement) || !hash) {
24
24
  return
25
25
  }
26
26
 
@@ -49,7 +49,7 @@ export class UnistylesShadowRegistry {
49
49
  return {}
50
50
  }
51
51
 
52
- const { __uni__key, __uni__stylesheet, __uni__args = [], __uni_variants: variants } = secrets
52
+ const { __uni__key, __uni__stylesheet, __uni__args = [], __stylesheetVariants: variants } = secrets
53
53
  const newComputedStylesheet = this.services.registry.getComputedStylesheet(__uni__stylesheet, scopedTheme)
54
54
  const style = newComputedStylesheet[__uni__key] as (UnistylesValues | ((...args: any) => UnistylesValues))
55
55
  const result = typeof style === 'function'
@@ -94,7 +94,7 @@ export class UnistylesShadowRegistry {
94
94
  ? hash.replace(' > *', '')
95
95
  : hash
96
96
 
97
- return { injectedClassName, hash: hashClassname }
97
+ return { injectedClassName, hash: hashClassname, parsedStyles }
98
98
  }
99
99
 
100
100
  setScopedTheme = (theme?: UnistylesTheme) => {
@@ -118,4 +118,6 @@ export class UnistylesShadowRegistry {
118
118
  this.disposeMap.delete(hash)
119
119
  })
120
120
  }
121
+
122
+ flush = () => {}
121
123
  }
package/src/web/state.ts CHANGED
@@ -5,7 +5,7 @@ import type { AppBreakpoint, AppTheme, AppThemeName } from '../specs/types'
5
5
  import type { UnistylesTheme } from '../types'
6
6
  import type { UnionToIntersection } from '../types'
7
7
  import type { UnistylesServices } from './types'
8
- import { error, hyphenate, isServer, schemeToTheme } from './utils'
8
+ import { convertTheme, error, isServer, schemeToTheme } from './utils'
9
9
 
10
10
  type UnistylesSettings = Partial<UnionToIntersection<Required<UnistylesConfig>['settings']>>
11
11
 
@@ -72,22 +72,12 @@ export class UnistylesState {
72
72
 
73
73
  if (CSSVars) {
74
74
  this.services.registry.css.addTheme(themeName, theme)
75
-
76
- const convertTheme = (key: string, value: any, prev = '-'): [string, any] => {
77
- if (typeof value === 'object' && value !== null) {
78
- return [key, Object.fromEntries(Object.entries(value).map(([nestedKey, nestedValue]) => convertTheme(nestedKey, nestedValue, `${prev}-${key}`)))]
79
- }
80
-
81
- if (typeof value === 'string') {
82
- return [key, `var(${prev}-${hyphenate(key)})`]
83
- }
84
-
85
- return [key, value]
86
- }
87
-
88
- this.cssThemes.set(themeName, Object.fromEntries(Object.entries(theme).map(([key, value]) => {
89
- return convertTheme(key, value)
90
- })) as UnistylesTheme)
75
+ this.cssThemes.set(
76
+ themeName,
77
+ Object.fromEntries(Object.entries(theme).map(([key, value]) => {
78
+ return convertTheme(key, value)
79
+ })) as UnistylesTheme
80
+ )
91
81
  }
92
82
  })
93
83
  }
package/src/web/types.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import type { UnistylesValues } from '../types'
1
2
  import type { UnistylesListener } from './listener'
2
3
  import type { UnistylesRegistry } from './registry'
3
4
  import type { UnistylesRuntime } from './runtime'
@@ -15,4 +16,6 @@ export type UnistylesServices = {
15
16
  export const UNI_GENERATED_KEYS = ['$$css', 'hash', 'injectedClassName'] as const
16
17
  export type UniGeneratedKey = typeof UNI_GENERATED_KEYS[number]
17
18
 
18
- export type UniGeneratedStyle = Record<UniGeneratedKey, string>
19
+ export type UniGeneratedStyle = Record<UniGeneratedKey, string> & {
20
+ parsedStyles?: UnistylesValues
21
+ }
@@ -3,10 +3,11 @@ import type { UnistylesBreakpoints } from '../../global'
3
3
  import type { UnistyleDependency } from '../../specs/NativePlatform/NativePlatform.nitro'
4
4
  import { ColorScheme, Orientation } from '../../specs/types'
5
5
  import type { StyleSheet, StyleSheetWithSuperPowers, UnistylesValues } from '../../types/stylesheet'
6
- import { isUnistylesMq, parseMq } from '../../utils'
6
+ import { isDefined, isUnistylesMq, parseMq } from '../../utils'
7
+ import type { UnistylesRuntime } from '../runtime'
7
8
  import * as unistyles from '../services'
8
9
  import { UNI_GENERATED_KEYS, type UniGeneratedKey, type UniGeneratedStyle } from '../types'
9
- import { keyInObject, reduceObject } from './common'
10
+ import { hyphenate, keyInObject, reduceObject } from './common'
10
11
 
11
12
  export const schemeToTheme = (scheme: ColorScheme) => {
12
13
  switch (scheme) {
@@ -22,7 +23,7 @@ export type UnistyleSecrets = {
22
23
  __uni__stylesheet: StyleSheetWithSuperPowers<StyleSheet>,
23
24
  __uni__key: string,
24
25
  __uni__args?: Array<any>,
25
- __uni_variants: Record<string, string | boolean | undefined>
26
+ __stylesheetVariants: Record<string, string | boolean | undefined>
26
27
  }
27
28
 
28
29
  export const assignSecrets = <T>(object: T, secrets: UnistyleSecrets) => {
@@ -142,5 +143,34 @@ export const checkForAnimated = (value: any): boolean => {
142
143
  }
143
144
 
144
145
  export const isGeneratedUnistyle = (value: Record<string, any>): value is UniGeneratedStyle => {
145
- return Object.keys(value).every(key => UNI_GENERATED_KEYS.includes(key as UniGeneratedKey))
146
+ const keys = Object.keys(value)
147
+
148
+ return keys.length > 0 && keys.every(key => UNI_GENERATED_KEYS.includes(key as UniGeneratedKey))
149
+ }
150
+
151
+ export const convertTheme = (key: string, value: any, prev = '-'): [string, any] => {
152
+ if (typeof value === 'object' && value !== null) {
153
+ return [key, Object.fromEntries(Object.entries(value).map(([nestedKey, nestedValue]) => convertTheme(nestedKey, nestedValue, `${prev}-${key}`)))]
154
+ }
155
+
156
+ if (typeof value === 'string') {
157
+ return [key, `var(${prev}-${hyphenate(key)})`]
158
+ }
159
+
160
+ return [key, value]
161
+ }
162
+
163
+ export const getClosestBreakpointValue = <T>(runtime: UnistylesRuntime, values: Partial<Record<keyof UnistylesBreakpoints, T>>) => {
164
+ const breakpoints = runtime.breakpoints
165
+ const breakpointValues = Object.entries(values)
166
+ // Filter out non-breakpoint values
167
+ .filter((pair): pair is [keyof UnistylesBreakpoints, T] => pair[0] in breakpoints)
168
+ // Sort in descending order
169
+ .sort(([a], [b]) => (breakpoints[b] ?? 0) - (breakpoints[a] ?? 0))
170
+ // Get breakpoint value with highest priority
171
+ const [_, currentBreakpointValue] = breakpointValues.find(
172
+ ([key]) => isDefined(runtime.breakpoint) && (breakpoints[key] ?? 0) <= (breakpoints[runtime.breakpoint] ?? 0)
173
+ ) ?? []
174
+
175
+ return currentBreakpointValue
146
176
  }
@@ -1,59 +0,0 @@
1
- #include "UnistylesCommitHook.h"
2
-
3
- using namespace margelo::nitro::unistyles;
4
- using namespace facebook::react;
5
-
6
- core::UnistylesCommitHook::~UnistylesCommitHook() noexcept {
7
- _uiManager->unregisterCommitHook(*this);
8
- }
9
-
10
- void core::UnistylesCommitHook::commitHookWasRegistered(const UIManager &uiManager) noexcept {}
11
- void core::UnistylesCommitHook::commitHookWasUnregistered(const UIManager &uiManager) noexcept {}
12
-
13
- RootShadowNode::Unshared core::UnistylesCommitHook::shadowTreeWillCommit(
14
- const ShadowTree &shadowTree,
15
- const RootShadowNode::Shared &oldRootShadowNode,
16
- const RootShadowNode::Unshared &newRootShadowNode
17
- ) noexcept {
18
- RootShadowNode::Unshared rootNode = newRootShadowNode;
19
- auto unistylesRootNode = std::reinterpret_pointer_cast<core::UnistylesCommitShadowNode>(newRootShadowNode);
20
-
21
- // this is Unistyles commit, we don't need to override it
22
- if (unistylesRootNode->hasUnistylesCommitTrait()) {
23
- unistylesRootNode->removeUnistylesCommitTrait();
24
- unistylesRootNode->addUnistylesMountTrait();
25
-
26
- return newRootShadowNode;
27
- }
28
-
29
- auto& registry = core::UnistylesRegistry::get();
30
-
31
- if (registry.trafficController.shouldStop()) {
32
- registry.trafficController.resumeUnistylesTraffic();
33
-
34
- return newRootShadowNode;
35
- }
36
-
37
- // this is React Native / Reanimated commit
38
- // merge Unistyles updates before it completes
39
-
40
- return registry.trafficController.withLock([&](){
41
- auto& shadowLeafUpdates = registry.trafficController.getUpdates();
42
-
43
- // oops, no updates from Unistyles yet, skip it!
44
- if (shadowLeafUpdates.size() == 0) {
45
- return newRootShadowNode;
46
- }
47
-
48
- auto affectedNodes = shadow::ShadowTreeManager::findAffectedNodes(*rootNode, shadowLeafUpdates);
49
-
50
- registry.trafficController.stopUnistylesTraffic();
51
-
52
- // we have few updates, so merge it
53
- return std::static_pointer_cast<RootShadowNode>(shadow::ShadowTreeManager::cloneShadowTree(
54
- *rootNode,
55
- shadowLeafUpdates,
56
- affectedNodes
57
- ));
58
- });
59
- }
@@ -1,27 +0,0 @@
1
- #pragma once
2
-
3
- #include <react/renderer/uimanager/UIManager.h>
4
- #include <react/renderer/uimanager/UIManagerCommitHook.h>
5
- #include "ShadowTreeManager.h"
6
- #include "ShadowTrafficController.h"
7
-
8
- namespace margelo::nitro::unistyles::core {
9
-
10
- using namespace facebook::react;
11
-
12
- struct UnistylesCommitHook : public UIManagerCommitHook {
13
- UnistylesCommitHook(std::shared_ptr<UIManager> uiManager) : _uiManager{uiManager} {
14
- _uiManager->registerCommitHook(*this);
15
- }
16
-
17
- ~UnistylesCommitHook() noexcept override;
18
-
19
- void commitHookWasRegistered(const UIManager &uiManager) noexcept override;
20
- void commitHookWasUnregistered(const UIManager &uiManager) noexcept override;
21
- RootShadowNode::Unshared shadowTreeWillCommit(const ShadowTree &shadowTree, const RootShadowNode::Shared &oldRootShadowNode, const RootShadowNode::Unshared &newRootShadowNode) noexcept override;
22
-
23
- private:
24
- std::shared_ptr<UIManager> _uiManager;
25
- };
26
-
27
- }
@@ -1,26 +0,0 @@
1
- #include "UnistylesMountHook.h"
2
-
3
- using namespace margelo::nitro::unistyles;
4
- using namespace facebook::react;
5
-
6
- core::UnistylesMountHook::~UnistylesMountHook() noexcept {
7
- _uiManager->unregisterMountHook(*this);
8
- }
9
-
10
- void core::UnistylesMountHook::shadowTreeDidMount(RootShadowNode::Shared const &rootShadowNode, double mountTime) noexcept {
11
- auto rootNode = std::const_pointer_cast<RootShadowNode>(rootShadowNode);
12
- auto unistylesRootNode = std::reinterpret_pointer_cast<core::UnistylesCommitShadowNode>(rootNode);
13
-
14
- // if this is Unistyles commit, do nothing
15
- if (unistylesRootNode->hasUnistylesMountTrait()) {
16
- unistylesRootNode->removeUnistylesMountTrait();
17
-
18
- return;
19
- }
20
-
21
- // this is React Native or Reanimated commit
22
- // one more time merge Unistyles changes
23
- auto& registry = core::UnistylesRegistry::get();
24
-
25
- registry.trafficController.stopUnistylesTraffic();
26
- }
@@ -1,24 +0,0 @@
1
- #pragma once
2
-
3
- #include <react/renderer/uimanager/UIManager.h>
4
- #include <react/renderer/uimanager/UIManagerMountHook.h>
5
- #include "ShadowTreeManager.h"
6
-
7
- namespace margelo::nitro::unistyles::core {
8
-
9
- using namespace facebook::react;
10
-
11
- struct UnistylesMountHook : public UIManagerMountHook {
12
- UnistylesMountHook(std::shared_ptr<UIManager> uiManager): _uiManager{uiManager} {
13
- _uiManager->registerMountHook(*this);
14
- }
15
-
16
- ~UnistylesMountHook() noexcept override;
17
-
18
- void shadowTreeDidMount(RootShadowNode::Shared const &rootShadowNode, double mountTime) noexcept override;
19
-
20
- private:
21
- std::shared_ptr<UIManager> _uiManager;
22
- };
23
-
24
- }
@@ -1 +0,0 @@
1
- {"type":"module"}
File without changes