react-native-unistyles 3.0.0-alpha.7 → 3.0.0-alpha.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (218) hide show
  1. package/cxx/common/Helpers.h +58 -0
  2. package/cxx/core/Unistyle.h +0 -6
  3. package/cxx/core/UnistyleData.h +3 -2
  4. package/cxx/core/UnistyleWrapper.h +6 -6
  5. package/cxx/core/UnistylesRegistry.cpp +11 -10
  6. package/cxx/core/UnistylesRegistry.h +4 -3
  7. package/cxx/hybridObjects/HybridShadowRegistry.cpp +4 -2
  8. package/cxx/parser/Parser.cpp +24 -78
  9. package/cxx/parser/Parser.h +1 -2
  10. package/lib/commonjs/specs/ShadowRegistry/index.js +2 -2
  11. package/lib/commonjs/specs/ShadowRegistry/index.js.map +1 -1
  12. package/lib/commonjs/specs/index.web.js +1 -1
  13. package/lib/commonjs/web/convert/boxShadow.js +77 -0
  14. package/lib/commonjs/web/convert/boxShadow.js.map +1 -0
  15. package/lib/commonjs/web/convert/breakpoint.js +25 -0
  16. package/lib/commonjs/web/convert/breakpoint.js.map +1 -0
  17. package/lib/commonjs/web/convert/index.js +76 -0
  18. package/lib/commonjs/web/convert/index.js.map +1 -0
  19. package/lib/commonjs/web/convert/module.d.js +2 -0
  20. package/lib/commonjs/web/convert/module.d.js.map +1 -0
  21. package/lib/commonjs/web/convert/shadow.js +68 -0
  22. package/lib/commonjs/web/convert/shadow.js.map +1 -0
  23. package/lib/commonjs/web/convert/style.js +89 -0
  24. package/lib/commonjs/web/convert/style.js.map +1 -0
  25. package/lib/commonjs/web/convert/textShadow.js +73 -0
  26. package/lib/commonjs/web/convert/textShadow.js.map +1 -0
  27. package/lib/commonjs/web/convert/transform.js +72 -0
  28. package/lib/commonjs/web/convert/transform.js.map +1 -0
  29. package/lib/commonjs/web/convert/types.js +9 -0
  30. package/lib/commonjs/web/convert/types.js.map +1 -0
  31. package/lib/commonjs/web/convert/utils.js +55 -0
  32. package/lib/commonjs/web/convert/utils.js.map +1 -0
  33. package/lib/commonjs/web/create.js +89 -0
  34. package/lib/commonjs/web/create.js.map +1 -0
  35. package/lib/commonjs/web/index.js +51 -0
  36. package/lib/commonjs/web/index.js.map +1 -0
  37. package/lib/commonjs/web/listener/index.js +13 -0
  38. package/lib/commonjs/web/listener/index.js.map +1 -0
  39. package/lib/commonjs/web/listener/listener.js +36 -0
  40. package/lib/commonjs/web/listener/listener.js.map +1 -0
  41. package/lib/commonjs/web/mock.js +37 -0
  42. package/lib/commonjs/web/mock.js.map +1 -0
  43. package/lib/commonjs/web/mq.js +23 -0
  44. package/lib/commonjs/web/mq.js.map +1 -0
  45. package/lib/commonjs/web/pseudo.js +11 -0
  46. package/lib/commonjs/web/pseudo.js.map +1 -0
  47. package/lib/commonjs/web/registry.js +37 -0
  48. package/lib/commonjs/web/registry.js.map +1 -0
  49. package/lib/commonjs/web/runtime.js +164 -0
  50. package/lib/commonjs/web/runtime.js.map +1 -0
  51. package/lib/commonjs/web/state.js +121 -0
  52. package/lib/commonjs/web/state.js.map +1 -0
  53. package/lib/commonjs/web/utils.js +78 -0
  54. package/lib/commonjs/web/utils.js.map +1 -0
  55. package/lib/commonjs/web/variants/getVariants.js +39 -0
  56. package/lib/commonjs/web/variants/getVariants.js.map +1 -0
  57. package/lib/commonjs/web/variants/index.js +28 -0
  58. package/lib/commonjs/web/variants/index.js.map +1 -0
  59. package/lib/commonjs/web/variants/useVariants.js +75 -0
  60. package/lib/commonjs/web/variants/useVariants.js.map +1 -0
  61. package/lib/module/specs/ShadowRegistry/index.js +2 -2
  62. package/lib/module/specs/ShadowRegistry/index.js.map +1 -1
  63. package/lib/module/specs/index.web.js +1 -1
  64. package/lib/module/specs/index.web.js.map +1 -1
  65. package/lib/module/web/convert/boxShadow.js +72 -0
  66. package/lib/module/web/convert/boxShadow.js.map +1 -0
  67. package/lib/module/web/convert/breakpoint.js +20 -0
  68. package/lib/module/web/convert/breakpoint.js.map +1 -0
  69. package/lib/module/web/convert/index.js +71 -0
  70. package/lib/module/web/convert/index.js.map +1 -0
  71. package/lib/module/web/convert/module.d.js +2 -0
  72. package/lib/module/web/convert/module.d.js.map +1 -0
  73. package/lib/module/web/convert/shadow.js +63 -0
  74. package/lib/module/web/convert/shadow.js.map +1 -0
  75. package/lib/module/web/convert/style.js +84 -0
  76. package/lib/module/web/convert/style.js.map +1 -0
  77. package/lib/module/web/convert/textShadow.js +68 -0
  78. package/lib/module/web/convert/textShadow.js.map +1 -0
  79. package/lib/module/web/convert/transform.js +67 -0
  80. package/lib/module/web/convert/transform.js.map +1 -0
  81. package/lib/module/web/convert/types.js +5 -0
  82. package/lib/module/web/convert/types.js.map +1 -0
  83. package/lib/module/web/convert/utils.js +43 -0
  84. package/lib/module/web/convert/utils.js.map +1 -0
  85. package/lib/module/web/create.js +84 -0
  86. package/lib/module/web/create.js.map +1 -0
  87. package/lib/module/web/index.js +24 -0
  88. package/lib/module/web/index.js.map +1 -0
  89. package/lib/module/web/listener/index.js +4 -0
  90. package/lib/module/web/listener/index.js.map +1 -0
  91. package/lib/module/web/listener/listener.js +31 -0
  92. package/lib/module/web/listener/listener.js.map +1 -0
  93. package/lib/module/web/mock.js +33 -0
  94. package/lib/module/web/mock.js.map +1 -0
  95. package/lib/module/web/mq.js +17 -0
  96. package/lib/module/web/mq.js.map +1 -0
  97. package/lib/module/web/pseudo.js +6 -0
  98. package/lib/module/web/pseudo.js.map +1 -0
  99. package/lib/module/web/registry.js +33 -0
  100. package/lib/module/web/registry.js.map +1 -0
  101. package/lib/module/web/runtime.js +160 -0
  102. package/lib/module/web/runtime.js.map +1 -0
  103. package/lib/module/web/state.js +117 -0
  104. package/lib/module/web/state.js.map +1 -0
  105. package/lib/module/web/utils.js +65 -0
  106. package/lib/module/web/utils.js.map +1 -0
  107. package/lib/module/web/variants/getVariants.js +34 -0
  108. package/lib/module/web/variants/getVariants.js.map +1 -0
  109. package/lib/module/web/variants/index.js +5 -0
  110. package/lib/module/web/variants/index.js.map +1 -0
  111. package/lib/module/web/variants/useVariants.js +70 -0
  112. package/lib/module/web/variants/useVariants.js.map +1 -0
  113. package/lib/typescript/src/specs/ShadowRegistry/index.d.ts +2 -2
  114. package/lib/typescript/src/specs/ShadowRegistry/index.d.ts.map +1 -1
  115. package/lib/typescript/src/specs/index.web.d.ts +1 -1
  116. package/lib/typescript/src/specs/index.web.d.ts.map +1 -1
  117. package/lib/typescript/src/types/stylesheet.d.ts +1 -1
  118. package/lib/typescript/src/types/stylesheet.d.ts.map +1 -1
  119. package/lib/typescript/src/web/convert/boxShadow.d.ts.map +1 -0
  120. package/lib/typescript/src/web/convert/breakpoint.d.ts.map +1 -0
  121. package/lib/typescript/{web → src/web}/convert/index.d.ts +1 -1
  122. package/lib/typescript/src/web/convert/index.d.ts.map +1 -0
  123. package/lib/typescript/src/web/convert/shadow.d.ts.map +1 -0
  124. package/lib/typescript/src/web/convert/style.d.ts.map +1 -0
  125. package/lib/typescript/src/web/convert/textShadow.d.ts.map +1 -0
  126. package/lib/typescript/src/web/convert/transform.d.ts.map +1 -0
  127. package/lib/typescript/{web → src/web}/convert/types.d.ts +1 -1
  128. package/lib/typescript/src/web/convert/types.d.ts.map +1 -0
  129. package/lib/typescript/src/web/convert/utils.d.ts.map +1 -0
  130. package/lib/typescript/{web → src/web}/create.d.ts +11 -11
  131. package/lib/typescript/{web → src/web}/create.d.ts.map +1 -1
  132. package/lib/typescript/{web → src/web}/index.d.ts +12 -12
  133. package/lib/typescript/{web → src/web}/index.d.ts.map +1 -1
  134. package/lib/typescript/src/web/listener/index.d.ts.map +1 -0
  135. package/lib/typescript/{web → src/web}/listener/listener.d.ts +1 -1
  136. package/lib/typescript/src/web/listener/listener.d.ts.map +1 -0
  137. package/lib/typescript/{web → src/web}/mock.d.ts +2 -2
  138. package/lib/typescript/src/web/mock.d.ts.map +1 -0
  139. package/lib/typescript/src/web/mq.d.ts.map +1 -0
  140. package/lib/typescript/src/web/pseudo.d.ts.map +1 -0
  141. package/lib/typescript/{web → src/web}/registry.d.ts +1 -1
  142. package/lib/typescript/src/web/registry.d.ts.map +1 -0
  143. package/lib/typescript/{web → src/web}/runtime.d.ts +6 -6
  144. package/lib/typescript/src/web/runtime.d.ts.map +1 -0
  145. package/lib/typescript/{web → src/web}/state.d.ts +4 -4
  146. package/lib/typescript/src/web/state.d.ts.map +1 -0
  147. package/lib/typescript/{web → src/web}/utils.d.ts +5 -3
  148. package/lib/typescript/src/web/utils.d.ts.map +1 -0
  149. package/lib/typescript/src/web/variants/getVariants.d.ts +3 -0
  150. package/lib/typescript/src/web/variants/getVariants.d.ts.map +1 -0
  151. package/lib/typescript/src/web/variants/index.d.ts +3 -0
  152. package/lib/typescript/src/web/variants/index.d.ts.map +1 -0
  153. package/lib/typescript/src/web/variants/useVariants.d.ts +3 -0
  154. package/lib/typescript/src/web/variants/useVariants.d.ts.map +1 -0
  155. package/package.json +1 -1
  156. package/plugin/__tests__/dependencies.spec.js +5 -5
  157. package/plugin/__tests__/ref.spec.js +132 -17
  158. package/plugin/__tests__/stylesheet.spec.js +9 -9
  159. package/plugin/index.js +12 -13
  160. package/plugin/ref.js +18 -14
  161. package/plugin/style.js +13 -7
  162. package/src/specs/ShadowRegistry/index.ts +4 -4
  163. package/src/specs/index.web.ts +1 -1
  164. package/src/types/stylesheet.ts +1 -1
  165. package/{web → src/web}/convert/breakpoint.ts +1 -1
  166. package/{web → src/web}/convert/index.ts +1 -1
  167. package/{web → src/web}/convert/types.ts +1 -1
  168. package/{web → src/web}/create.ts +36 -33
  169. package/{web → src/web}/listener/listener.ts +1 -1
  170. package/{web → src/web}/mock.ts +2 -2
  171. package/{web → src/web}/registry.ts +1 -1
  172. package/{web → src/web}/runtime.ts +4 -4
  173. package/{web → src/web}/state.ts +5 -5
  174. package/{web → src/web}/utils.ts +5 -5
  175. package/src/web/variants/getVariants.ts +42 -0
  176. package/src/web/variants/index.ts +2 -0
  177. package/{web → src/web/variants}/useVariants.ts +24 -44
  178. package/lib/typescript/web/convert/boxShadow.d.ts.map +0 -1
  179. package/lib/typescript/web/convert/breakpoint.d.ts.map +0 -1
  180. package/lib/typescript/web/convert/index.d.ts.map +0 -1
  181. package/lib/typescript/web/convert/shadow.d.ts.map +0 -1
  182. package/lib/typescript/web/convert/style.d.ts.map +0 -1
  183. package/lib/typescript/web/convert/textShadow.d.ts.map +0 -1
  184. package/lib/typescript/web/convert/transform.d.ts.map +0 -1
  185. package/lib/typescript/web/convert/types.d.ts.map +0 -1
  186. package/lib/typescript/web/convert/utils.d.ts.map +0 -1
  187. package/lib/typescript/web/listener/index.d.ts.map +0 -1
  188. package/lib/typescript/web/listener/listener.d.ts.map +0 -1
  189. package/lib/typescript/web/mock.d.ts.map +0 -1
  190. package/lib/typescript/web/mq.d.ts.map +0 -1
  191. package/lib/typescript/web/pseudo.d.ts.map +0 -1
  192. package/lib/typescript/web/registry.d.ts.map +0 -1
  193. package/lib/typescript/web/runtime.d.ts.map +0 -1
  194. package/lib/typescript/web/state.d.ts.map +0 -1
  195. package/lib/typescript/web/useVariants.d.ts +0 -3
  196. package/lib/typescript/web/useVariants.d.ts.map +0 -1
  197. package/lib/typescript/web/utils.d.ts.map +0 -1
  198. /package/lib/typescript/{web → src/web}/convert/boxShadow.d.ts +0 -0
  199. /package/lib/typescript/{web → src/web}/convert/breakpoint.d.ts +0 -0
  200. /package/lib/typescript/{web → src/web}/convert/shadow.d.ts +0 -0
  201. /package/lib/typescript/{web → src/web}/convert/style.d.ts +0 -0
  202. /package/lib/typescript/{web → src/web}/convert/textShadow.d.ts +0 -0
  203. /package/lib/typescript/{web → src/web}/convert/transform.d.ts +0 -0
  204. /package/lib/typescript/{web → src/web}/convert/utils.d.ts +0 -0
  205. /package/lib/typescript/{web → src/web}/listener/index.d.ts +0 -0
  206. /package/lib/typescript/{web → src/web}/mq.d.ts +0 -0
  207. /package/lib/typescript/{web → src/web}/pseudo.d.ts +0 -0
  208. /package/{web → src/web}/convert/boxShadow.ts +0 -0
  209. /package/{web → src/web}/convert/module.d.ts +0 -0
  210. /package/{web → src/web}/convert/shadow.ts +0 -0
  211. /package/{web → src/web}/convert/style.ts +0 -0
  212. /package/{web → src/web}/convert/textShadow.ts +0 -0
  213. /package/{web → src/web}/convert/transform.ts +0 -0
  214. /package/{web → src/web}/convert/utils.ts +0 -0
  215. /package/{web → src/web}/index.ts +0 -0
  216. /package/{web → src/web}/listener/index.ts +0 -0
  217. /package/{web → src/web}/mq.ts +0 -0
  218. /package/{web → src/web}/pseudo.ts +0 -0
@@ -1,5 +1,5 @@
1
1
  import type { NestedCSSProperties } from 'typestyle/lib/types'
2
- import type { UnistylesValues } from '../../src/types'
2
+ import type { UnistylesValues } from '../../types'
3
3
  import { media } from 'typestyle'
4
4
  import { isPseudo } from '../pseudo'
5
5
  import { convertBreakpoint } from './breakpoint'
@@ -1,5 +1,5 @@
1
1
  import type { TextStyle, ViewStyle } from 'react-native'
2
- import type { ToDeepUnistyles } from '../../src/types/stylesheet'
2
+ import type { ToDeepUnistyles } from '../../types/stylesheet'
3
3
 
4
4
  export type ShadowOffset = ToDeepUnistyles<{ width: number, height: number }>
5
5
 
@@ -1,12 +1,12 @@
1
1
  import type { TypeStyle } from 'typestyle'
2
- import type { ReactNativeStyleSheet } from '../src/types'
3
- import type { StyleSheetWithSuperPowers, StyleSheet } from '../src/types/stylesheet'
2
+ import type { ReactNativeStyleSheet } from '../types'
3
+ import type { StyleSheetWithSuperPowers, StyleSheet } from '../types/stylesheet'
4
4
  import { UnistylesRegistry } from './registry'
5
5
  import { keyInObject, reduceObject, toReactNativeClassName } from './utils'
6
6
  import { UnistylesRuntime } from './runtime'
7
- import { createUseVariants } from './useVariants'
7
+ import { createUseVariants, getVariants } from './variants'
8
8
  import { UnistylesListener } from './listener'
9
- import type { UnistyleDependency } from '../src/specs/NativePlatform'
9
+ import type { UnistyleDependency } from '../specs/NativePlatform'
10
10
 
11
11
  type ListenToDependenciesProps = {
12
12
  value: StyleSheet[keyof StyleSheet],
@@ -16,10 +16,13 @@ type ListenToDependenciesProps = {
16
16
  args?: Array<any>
17
17
  }
18
18
 
19
+ type WebUnistyle = ReturnType<typeof UnistylesRegistry.createStyles>
20
+
19
21
  export const create = (stylesheet: StyleSheetWithSuperPowers<StyleSheet>) => {
20
22
  const computedStylesheet = typeof stylesheet === 'function'
21
23
  ? stylesheet(UnistylesRuntime.theme, UnistylesRuntime.miniRuntime)
22
24
  : stylesheet
25
+ let lastlySelectedVariants: Record<string, any> = {}
23
26
 
24
27
  const listenToDependencies = ({ key, className, unistyles, value, args = [] } : ListenToDependenciesProps) => {
25
28
  const dependencies = ('uni__dependencies' in value ? value['uni__dependencies'] : []) as Array<UnistyleDependency>
@@ -48,44 +51,42 @@ export const create = (stylesheet: StyleSheetWithSuperPowers<StyleSheet>) => {
48
51
 
49
52
  const styles = reduceObject(computedStylesheet, (value, key) => {
50
53
  if (typeof value === 'function') {
51
- const classNameMap = new Map<number, string>()
52
- const unistylesMap = new Map<number, TypeStyle>()
53
- const disposeMap = new Map<number, VoidFunction | undefined>()
54
+ const webUnistyleByRef = new Map<HTMLElement, WebUnistyle>()
55
+ const disposeByRef = new Map<HTMLElement, VoidFunction | undefined>()
54
56
 
55
57
  return (...args: Array<any>) => {
56
- const [id] = args.slice(-1)
57
- const result = value(...args.slice(0, -1))
58
- const dispose = disposeMap.get(id)
59
- const unistyles = unistylesMap.get(id)
60
- const className = classNameMap.get(id)
61
-
62
- if (unistyles && className && dispose) {
63
- dispose()
64
- UnistylesRegistry.updateStyles(unistyles, result, className)
65
- disposeMap.set(id, listenToDependencies({
58
+ const [ref] = args.slice(-1)
59
+ const result = value(...args)
60
+ const variants = Object.fromEntries(getVariants({ [key]: result } as ReactNativeStyleSheet<StyleSheet>, lastlySelectedVariants))
61
+ const resultWithVariants = {
62
+ ...result,
63
+ ...variants[key]
64
+ }
65
+
66
+ if (ref instanceof HTMLElement) {
67
+ const storedWebUnistyle = webUnistyleByRef.get(ref)
68
+ const webUnistyle = storedWebUnistyle ?? UnistylesRegistry.createStyles(resultWithVariants, key)
69
+
70
+ webUnistyleByRef.set(ref, webUnistyle)
71
+ disposeByRef.get(ref)?.()
72
+ disposeByRef.set(ref, listenToDependencies({
66
73
  key,
67
74
  value,
68
- unistyles,
69
- className,
75
+ unistyles: webUnistyle.unistyles,
76
+ className: webUnistyle.className,
70
77
  args
71
78
  }))
79
+ ref.classList.add(webUnistyle.className)
72
80
 
73
- return toReactNativeClassName(className, result)
74
- }
81
+ if (storedWebUnistyle) {
82
+ UnistylesRegistry.updateStyles(webUnistyle.unistyles, resultWithVariants, webUnistyle.className)
83
+ }
75
84
 
76
- const entry = UnistylesRegistry.createStyles(result, key)
77
85
 
78
- classNameMap.set(id, entry.className)
79
- unistylesMap.set(id, entry.unistyles)
80
- disposeMap.set(id, listenToDependencies({
81
- key,
82
- value,
83
- unistyles: entry.unistyles,
84
- className: entry.className,
85
- args
86
- }))
86
+ return
87
+ }
87
88
 
88
- return toReactNativeClassName(entry.className, result)
89
+ return toReactNativeClassName(null, resultWithVariants)
89
90
  }
90
91
  }
91
92
 
@@ -96,7 +97,9 @@ export const create = (stylesheet: StyleSheetWithSuperPowers<StyleSheet>) => {
96
97
  return toReactNativeClassName(className, value)
97
98
  }) as ReactNativeStyleSheet<StyleSheet>
98
99
 
99
- createUseVariants(styles)
100
+ createUseVariants(styles, newVariants => {
101
+ lastlySelectedVariants = newVariants
102
+ })
100
103
 
101
104
  return styles
102
105
  }
@@ -1,4 +1,4 @@
1
- import { UnistyleDependency } from '../../src/specs/NativePlatform'
1
+ import { UnistyleDependency } from '../../specs/NativePlatform'
2
2
  import { UnistylesRuntime } from '../runtime'
3
3
 
4
4
  export class UnistylesListenerBuilder {
@@ -1,5 +1,5 @@
1
- import type { UnistylesNavigationBar as NavigationBarSpec } from '../src/specs/NavigtionBar'
2
- import type { UnistylesStatusBar as StatusBarSpec } from '../src/specs/StatusBar'
1
+ import type { UnistylesNavigationBar as NavigationBarSpec } from '../specs/NavigtionBar'
2
+ import type { UnistylesStatusBar as StatusBarSpec } from '../specs/StatusBar'
3
3
 
4
4
  export const StatusBar: StatusBarSpec = {
5
5
  width: 0,
@@ -1,5 +1,5 @@
1
1
  import { createTypeStyle, TypeStyle } from 'typestyle'
2
- import type { UnistylesValues } from '../src/types'
2
+ import type { UnistylesValues } from '../types'
3
3
  import { convertToTypeStyle } from './convert'
4
4
  import { UnistylesState } from './state'
5
5
 
@@ -1,7 +1,7 @@
1
- import { UnistyleDependency } from '../src/specs/NativePlatform'
2
- import { ColorScheme, Orientation, type AppTheme, type AppThemeName } from '../src/specs/types'
3
- import type { UnistylesMiniRuntime } from '../src/specs/UnistylesRuntime'
4
- import { WebContentSizeCategory } from '../src/types'
1
+ import { UnistyleDependency } from '../specs/NativePlatform'
2
+ import { ColorScheme, Orientation, type AppTheme, type AppThemeName } from '../specs/types'
3
+ import type { UnistylesMiniRuntime } from '../specs/UnistylesRuntime'
4
+ import { WebContentSizeCategory } from '../types'
5
5
  import { UnistylesListener } from './listener'
6
6
  import { NavigationBar, StatusBar } from './mock'
7
7
  import { UnistylesState } from './state'
@@ -1,12 +1,12 @@
1
1
  import { type ReactElement, createElement, createRef } from 'react'
2
- import type { UnistylesTheme } from '../src/types'
3
- import type { UnistylesConfig } from '../src/specs/StyleSheet'
4
- import type { AppBreakpoint, AppThemeName } from '../src/specs/types'
5
- import type { UnistylesBreakpoints, UnistylesThemes } from '../src/global'
2
+ import type { UnistylesTheme } from '../types'
3
+ import type { UnistylesConfig } from '../specs/StyleSheet'
4
+ import type { AppBreakpoint, AppThemeName } from '../specs/types'
5
+ import type { UnistylesBreakpoints, UnistylesThemes } from '../global'
6
6
  import { UnistylesRuntime } from './runtime'
7
7
  import { isServer, schemeToTheme } from './utils'
8
8
  import { UnistylesListener } from './listener'
9
- import { UnistyleDependency } from '../src/specs/NativePlatform'
9
+ import { UnistyleDependency } from '../specs/NativePlatform'
10
10
 
11
11
  class UnistylesStateBuilder {
12
12
  private readonly isSSR = isServer()
@@ -1,16 +1,16 @@
1
- import { ColorScheme, type AppThemeName} from '../src/specs/types'
2
- import type { UnistylesValues } from '../src/types'
1
+ import { ColorScheme, type AppThemeName} from '../specs/types'
2
+ import type { UnistylesValues } from '../types'
3
3
 
4
4
  export const reduceObject = <TObj extends Record<string, any>, TReducer>(
5
5
  obj: TObj,
6
6
  reducer: (value: TObj[keyof TObj], key: keyof TObj) => TReducer,
7
7
  ) => Object.fromEntries(Object.entries(obj).map(([key, value]) => [key, reducer(value as TObj[keyof TObj], key)])) as { [K in keyof TObj]: TReducer }
8
8
 
9
- export const toReactNativeClassName = (className: string, values: UnistylesValues) => {
10
- const returnValue = {
9
+ export const toReactNativeClassName = (className: string | null, values: UnistylesValues) => {
10
+ const returnValue = className ? {
11
11
  $$css: true,
12
12
  [className]: className
13
- }
13
+ } : {}
14
14
 
15
15
  Object.defineProperties(returnValue, reduceObject(values, value => ({
16
16
  value,
@@ -0,0 +1,42 @@
1
+ import type { ReactNativeStyleSheet, StyleSheet } from '../../types'
2
+ import { deepMergeObjects } from '../utils'
3
+
4
+ type StylesWithVariants = {
5
+ variants: Record<string, any>,
6
+ compoundVariants?: Array<Record<string, any> & {
7
+ styles: Record<string, any>
8
+ }>
9
+ }
10
+ const hasVariants = <T extends object>(value: [string, T]): value is [string, T & StylesWithVariants] => 'variants' in value[1]
11
+
12
+ export const getVariants = (styles: ReactNativeStyleSheet<StyleSheet>, selectedVariants: Record<string, any>) => {
13
+ return Object.entries(styles)
14
+ .filter(hasVariants)
15
+ .filter(([_key, { variants }]) => Object.keys(variants).some(variant => variant in variants))
16
+ .map(([key, { variants, compoundVariants = [] }]) => {
17
+ const variantStyles = Object.entries(variants).flatMap(([variant, styles]) => {
18
+ const selectedVariant = selectedVariants[variant]
19
+ const selectedVariantStyles = styles[selectedVariant] ?? styles['default']
20
+
21
+ if (!selectedVariantStyles) {
22
+ return []
23
+ }
24
+
25
+ return selectedVariantStyles
26
+ })
27
+
28
+ const compoundVariantStyles = compoundVariants.flatMap(compoundVariant => {
29
+ const { styles, ...conditions } = compoundVariant
30
+
31
+ if (Object.entries(conditions).some(([variant, value]) => String(selectedVariants[variant]) !== String(value))) {
32
+ return []
33
+ }
34
+
35
+ return styles
36
+ })
37
+
38
+ const mergedVariantStyles = deepMergeObjects(...variantStyles, ...compoundVariantStyles)
39
+
40
+ return [key, mergedVariantStyles] as const
41
+ })
42
+ }
@@ -0,0 +1,2 @@
1
+ export * from './useVariants'
2
+ export * from './getVariants'
@@ -1,19 +1,11 @@
1
1
  import { useMemo, useRef, useState } from 'react'
2
2
  import type { TypeStyle } from 'typestyle'
3
- import type { ReactNativeStyleSheet, StyleSheet } from '../src/types'
4
- import { deepMergeObjects, equal, reduceObject } from './utils'
5
- import { UnistylesRegistry } from './registry'
3
+ import type { ReactNativeStyleSheet, StyleSheet } from '../../types'
4
+ import { equal, reduceObject } from '../utils'
5
+ import { UnistylesRegistry } from '../registry'
6
+ import { getVariants } from './getVariants'
6
7
 
7
- type StylesWithVariants = {
8
- variants: Record<string, any>,
9
- compoundVariants?: Array<Record<string, any> & {
10
- styles: Record<string, any>
11
- }>
12
- }
13
-
14
- const hasVariants = <T extends object>(value: [string, T]): value is [string, T & StylesWithVariants] => 'variants' in value[1]
15
-
16
- export const createUseVariants = (styles: ReactNativeStyleSheet<StyleSheet>) => {
8
+ export const createUseVariants = (styles: ReactNativeStyleSheet<StyleSheet>, setSelectedVariants: (variants: Record<string, any>) => void) => {
17
9
  const useVariants = (selectedVariants: Record<string, any>) => {
18
10
  const [unistylesMap] = useState(() => new Map<string, TypeStyle>())
19
11
  const [classNameMap] = useState(() => new Map<string, string>())
@@ -24,40 +16,17 @@ export const createUseVariants = (styles: ReactNativeStyleSheet<StyleSheet>) =>
24
16
 
25
17
  if (variantsChanged) {
26
18
  lastSelectedVariantsRef.current = selectedVariants
19
+ setSelectedVariants(selectedVariants)
27
20
  }
28
21
 
29
22
  const combinedVariantStyles = useMemo(() => {
30
- return Object.entries(styles)
31
- .filter(hasVariants)
32
- .filter(([_key, { variants }]) => Object.keys(variants).some(variant => variant in variants))
33
- .map(([key, { variants, compoundVariants = [] }]) => {
34
- const variantStyles = Object.entries(variants).flatMap(([variant, styles]) => {
35
- const selectedVariant = selectedVariants[variant]
36
- const selectedVariantStyles = styles[selectedVariant] ?? styles['default']
37
-
38
- if (!selectedVariantStyles) {
39
- return []
40
- }
41
-
42
- return selectedVariantStyles
43
- })
44
-
45
- const compoundVariantStyles = compoundVariants.flatMap(compoundVariant => {
46
- const { styles, ...conditions } = compoundVariant
47
-
48
- if (Object.entries(conditions).some(([variant, value]) => String(selectedVariants[variant]) !== String(value))) {
49
- return []
50
- }
51
-
52
- return styles
53
- })
23
+ const result = getVariants(styles, selectedVariants)
54
24
 
55
- const mergedVariantStyles = deepMergeObjects(...variantStyles, ...compoundVariantStyles)
56
-
57
- selectedVariantStylesMap.set(key, mergedVariantStyles)
25
+ result.forEach(([key, value]) => {
26
+ selectedVariantStylesMap.set(key, value)
27
+ })
58
28
 
59
- return [key, mergedVariantStyles] as const
60
- })
29
+ return result
61
30
  }, [lastSelectedVariantsRef.current])
62
31
 
63
32
  if (unistylesMap.size === 0 && combinedVariantStyles.length > 0) {
@@ -88,8 +57,19 @@ export const createUseVariants = (styles: ReactNativeStyleSheet<StyleSheet>) =>
88
57
  enumerable: false,
89
58
  configurable: true
90
59
  })))
91
- // @ts-expect-error - apply variant className
92
- styleEntry[className] = className
60
+
61
+ if (styleEntry) {
62
+ Object.keys(styleEntry ?? {}).forEach(key => {
63
+ if (!key.startsWith('variant-')) {
64
+ return
65
+ }
66
+
67
+ // @ts-expect-error - remove old variants
68
+ delete styleEntry[key]
69
+ })
70
+ // @ts-expect-error - apply variant className
71
+ styleEntry[className] = className
72
+ }
93
73
  })
94
74
  }
95
75
 
@@ -1 +0,0 @@
1
- {"version":3,"file":"boxShadow.d.ts","sourceRoot":"","sources":["../../../../web/convert/boxShadow.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAkB9D,eAAO,MAAM,iBAAiB,WAAY,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAG,mBAoD/D,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"breakpoint.d.ts","sourceRoot":"","sources":["../../../../web/convert/breakpoint.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAMrD,eAAO,MAAM,iBAAiB,eAAgB,MAAM,KAAG,UActD,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../web/convert/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAC9D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAWtD,eAAO,MAAM,kBAAkB,UAAW,eAAe,wBAiExD,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"shadow.d.ts","sourceRoot":"","sources":["../../../../web/convert/shadow.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,qBAAsB,aAAa,CAAC,MAAM,CAAC,UAAU,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,eAAe,GAAG,CAAC,MAAM,CAAC,SAiE5H,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../../../web/convert/style.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAgF9D,eAAO,MAAM,QAAQ,QAAS,MAAM,SAAS,GAAG,wBAY/C,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"textShadow.d.ts","sourceRoot":"","sources":["../../../../web/convert/textShadow.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAiB9D,eAAO,MAAM,kBAAkB,WAAY,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAG,mBAkDhE,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"transform.d.ts","sourceRoot":"","sources":["../../../../web/convert/transform.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAK9D,KAAK,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAA;AAmC5C,eAAO,MAAM,iBAAiB,eAAgB,UAAU,KAAG,mBA+C1D,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../web/convert/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAEjE,MAAM,MAAM,YAAY,GAAG,eAAe,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC,CAAA;AAE7E,eAAO,MAAM,kBAAkB,sEAAuE,CAAA;AAEtG,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,OAAO,kBAAkB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;AAErF,eAAO,MAAM,iBAAiB,2EAA4E,CAAA;AAE1G,MAAM,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,OAAO,iBAAiB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;AAEnF,MAAM,MAAM,SAAS,GAAG,UAAU,GAAG,SAAS,CAAA;AAE9C,MAAM,MAAM,aAAa,GAAG,MAAM,SAAS,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../web/convert/utils.ts"],"names":[],"mappings":"AAGA,OAAO,EAAyC,KAAK,SAAS,EAAE,KAAK,aAAa,EAAE,MAAM,SAAS,CAAA;AAEnG,eAAO,MAAM,WAAW,QAAS,MAAM,SAAS,GAAG,KAAG,KAAK,IAAI,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAgD,CAAA;AAExI,eAAO,MAAM,YAAY,QAAS,MAAM,YAA0E,CAAA;AAElH,eAAO,MAAM,WAAW,QAAS,MAAM,YAAwE,CAAA;AAE/G,eAAO,MAAM,qBAAqB,UAAW,MAAM,oBAAiC,CAAA;AAEpF,eAAO,MAAM,cAAc,UAAW,MAAM,YAAW,MAAM,WAyB5D,CAAA;AAED,eAAO,MAAM,kBAAkB,GAAI,IAAI,SAAS,aAAa,OAAO,IAAI,cAAc,MAAM,UAAU,GAAG,KAAG,SAAS,CAAC,IAAI,CAazH,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../web/listener/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"listener.d.ts","sourceRoot":"","sources":["../../../../web/listener/listener.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAA;AAGnE,qBAAa,wBAAwB;IACjC,OAAO,CAAC,aAAa,CAAQ;IAC7B,OAAO,CAAC,SAAS,CAAoG;IAErH,UAAU,eAAgB,kBAAkB,UAE3C;IAED,aAAa,aAUZ;IAED,YAAY,iBAAkB,KAAK,CAAC,kBAAkB,CAAC,YAAY,YAAY,gBAM9E;CACJ;AAED,eAAO,MAAM,iBAAiB,0BAAiC,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"mock.d.ts","sourceRoot":"","sources":["../../../web/mock.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,IAAI,iBAAiB,EAAE,MAAM,2BAA2B,CAAA;AAC5F,OAAO,KAAK,EAAE,kBAAkB,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAA;AAEjF,eAAO,MAAM,SAAS,EAAE,aAUvB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,iBAS3B,CAAA;AAED,eAAO,MAAM,uBAAuB;;;;;;;;CAQnC,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"mq.d.ts","sourceRoot":"","sources":["../../../web/mq.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAMrD,eAAO,MAAM,OAAO,OAAQ,MAAM,KAAG,UAUpC,CAAA;AAED,eAAO,MAAM,aAAa,OAAQ,MAAM,YAAgC,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"pseudo.d.ts","sourceRoot":"","sources":["../../../web/pseudo.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,OAAO,kDAKV,CAAA;AAEV,eAAO,MAAM,QAAQ,aAAc,MAAM,YAAyC,CAAA;AAElF,MAAM,MAAM,MAAM,GAAG,OAAO,OAAO,CAAC,MAAM,CAAC,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../../web/registry.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,SAAS,EAAE,MAAM,WAAW,CAAA;AACtD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAInD,cAAM,wBAAwB;IAC1B,YAAY,eAAgB,eAAe,OAAO,MAAM,GAAG,MAAM;;;MAwBhE;IAED,YAAY,cAAe,SAAS,cAAc,eAAe,aAAa,MAAM,UAKnF;CACJ;AAED,eAAO,MAAM,iBAAiB,0BAAiC,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"runtime.d.ts","sourceRoot":"","sources":["../../../web/runtime.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,KAAK,QAAQ,EAAE,KAAK,YAAY,EAAE,MAAM,oBAAoB,CAAA;AAC/F,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAA;AACzE,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAA;AAMrD,cAAM,uBAAuB;IACzB,UAAU,wBAAuB;IACjC,SAAS,wBAAsB;IAE/B,OAAO,CAAC,aAAa;IAYrB,OAAO,CAAC,YAAY;IAYpB,IAAI,WAAW,gBASd;IAED,IAAI,SAAS,uEAEZ;IAED,IAAI,mBAAmB,2BAEtB;IAED,IAAI,UAAU,4EAEb;IAED,IAAI,WAAW,gBAMd;IAED,IAAI,KAAK,0CAYR;IAED,IAAI,UAAU,WAEb;IAED,IAAI,MAAM;;;MAYT;IAED,IAAI,SAAS,WAEZ;IAED,IAAI,MAAM;;;;;;MAQT;IAED,IAAI,SAAS,wDAEZ;IAED,IAAI,GAAG,YAEN;IAED,IAAI,iBAAiB,YAEpB;IAED,IAAI,aAAa,+DAEhB;IAED,IAAI,WAAW,IAAI,oBAAoB,CAsBtC;IAED,QAAQ,cAAe,YAAY,UAQlC;IAED,iBAAiB,cAAe,OAAO,UAQtC;IAED,0BAA0B,QAAS,MAAM,UAAU,MAAM,UAMxD;IAED,gBAAgB,aAAW;IAE3B,WAAW,cAAe,YAAY,WAAW,CAAC,YAAY,EAAE,QAAQ,KAAK,QAAQ,UAQpF;IAED,eAAe,iGAA4B;CAC9C;AAED,eAAO,MAAM,gBAAgB,yBAAgC,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"state.d.ts","sourceRoot":"","sources":["../../../web/state.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAA4B,MAAM,OAAO,CAAA;AACnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAClD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAC9D,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AACrE,OAAO,KAAK,EAAE,oBAAoB,EAAmB,MAAM,eAAe,CAAA;AAM1E,cAAM,qBAAqB;IACvB,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAa;IACnC,QAAQ,CAAC,IAAI,EAAS,KAAK,CAAC,YAAY,CAAC,CAAA;IAEzC,MAAM,8BAAoC;IAC1C,SAAS,CAAC,EAAE,YAAY,CAAA;IAExB,UAAU,CAAC,EAAE,aAAa,CAAA;IAC1B,WAAW,CAAC,EAAE,oBAAoB,CAAA;IAElC,iBAAiB,UAAQ;IAEzB,IAAI,WAAY,eAAe,UAU9B;IAED,OAAO,CAAC,UAAU,CAIjB;IAED,OAAO,CAAC,YAAY,CAyBnB;IAED,OAAO,CAAC,eAAe,CAmCtB;IAED,SAAS;;;CAyCZ;AAED,eAAO,MAAM,cAAc,uBAA8B,CAAA"}
@@ -1,3 +0,0 @@
1
- import type { ReactNativeStyleSheet, StyleSheet } from '../src/types';
2
- export declare const createUseVariants: (styles: ReactNativeStyleSheet<StyleSheet>) => void;
3
- //# sourceMappingURL=useVariants.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useVariants.d.ts","sourceRoot":"","sources":["../../../web/useVariants.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAarE,eAAO,MAAM,iBAAiB,WAAY,qBAAqB,CAAC,UAAU,CAAC,SAmF1E,CAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../web/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,YAAY,EAAC,MAAM,oBAAoB,CAAA;AAClE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAEnD,eAAO,MAAM,YAAY,GAAI,IAAI,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,QAAQ,OAC9D,IAAI,WACA,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,IAAI,CAAC,EAAE,GAAG,EAAE,MAAM,IAAI,KAAK,QAAQ,KACmD,GAAG,CAAe,IAAV,MAAM,IAAI,GAAG,QAAQ,GAAE,CAAA;AAErJ,eAAO,MAAM,sBAAsB,cAAe,MAAM,UAAU,eAAe;;;CAahF,CAAA;AAED,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,OAAO,CAAC,OAAO,WAAW,KAAG,GAAG,IAAI,MAAM,CAAe,CAAA;AAElH,eAAO,MAAM,aAAa,WAAY,WAAW,KAAG,YAQnD,CAAA;AAED,eAAO,MAAM,SAAS,QAAS,MAAM,WAAW,MAAM,WAM5B,CAAA;AAE1B,eAAO,MAAM,QAAQ,eAAsC,CAAA;AAE3D;;EAEE;AACF,eAAO,MAAM,gBAAgB,GAAI,CAAC,SAAS,MAAM,CAAC,WAAW,EAAE,GAAG,CAAC,cAAc,KAAK,CAAC,CAAC,CAAC,MAqBxF,CAAA;AAED,eAAO,MAAM,IAAI,YAAa,MAAM,SAA2D,CAAA;AAE/F,eAAO,MAAM,KAAK,GAAI,CAAC,KAAK,CAAC,KAAK,CAAC,YAqBlC,CAAA"}
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes