@tamagui/core 1.0.0-beta.187 → 1.0.0-beta.2

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 (273) hide show
  1. package/dist/cjs/Tamagui.js +18 -1
  2. package/dist/cjs/Tamagui.js.map +2 -2
  3. package/dist/cjs/ThemeContext.js +4 -0
  4. package/dist/cjs/ThemeManager.js +30 -14
  5. package/dist/cjs/ThemeManager.js.map +2 -2
  6. package/dist/cjs/conf.js +10 -1
  7. package/dist/cjs/conf.js.map +2 -2
  8. package/dist/cjs/constants/constants.js +6 -0
  9. package/dist/cjs/constants/platform.js +15 -0
  10. package/dist/cjs/constants/platform.js.map +2 -2
  11. package/dist/cjs/constants/rnw.js +4 -0
  12. package/dist/cjs/contexts/ButtonInsideButtonContext.js +4 -0
  13. package/dist/cjs/createComponent.js +156 -130
  14. package/dist/cjs/createComponent.js.map +2 -2
  15. package/dist/cjs/createFont.js +4 -0
  16. package/dist/cjs/createShorthands.js +4 -0
  17. package/dist/cjs/createTamagui.js +56 -27
  18. package/dist/cjs/createTamagui.js.map +2 -2
  19. package/dist/cjs/createTheme.js +4 -0
  20. package/dist/cjs/createTokens.js +7 -6
  21. package/dist/cjs/createTokens.js.map +2 -2
  22. package/dist/cjs/createVariable.js +18 -2
  23. package/dist/cjs/createVariable.js.map +2 -2
  24. package/dist/cjs/defaultComponentState.js +0 -30
  25. package/dist/cjs/defaultComponentState.js.map +3 -3
  26. package/dist/cjs/helpers/RNComponents.js +38 -0
  27. package/dist/cjs/helpers/RNComponents.js.map +7 -0
  28. package/dist/cjs/helpers/addStylesUsingClassname.js +19 -16
  29. package/dist/cjs/helpers/addStylesUsingClassname.js.map +2 -2
  30. package/dist/cjs/helpers/areEqualSets.js +4 -0
  31. package/dist/cjs/helpers/createMediaStyle.js +5 -0
  32. package/dist/cjs/helpers/createPropMapper.js +63 -61
  33. package/dist/cjs/helpers/createPropMapper.js.map +2 -2
  34. package/dist/cjs/helpers/createShallowUpdate.js +55 -0
  35. package/dist/cjs/helpers/createShallowUpdate.js.map +7 -0
  36. package/dist/cjs/helpers/createTamaguiProvider.js +5 -5
  37. package/dist/cjs/helpers/createTamaguiProvider.js.map +2 -2
  38. package/dist/cjs/helpers/extendStaticConfig.js +9 -6
  39. package/dist/cjs/helpers/extendStaticConfig.js.map +2 -2
  40. package/dist/cjs/helpers/fixNativeShadow.js +4 -0
  41. package/dist/cjs/helpers/fixNativeShadow.native.js +6 -2
  42. package/dist/cjs/helpers/fixNativeShadow.native.js.map +2 -2
  43. package/dist/cjs/helpers/getExpandedShorthands.js +4 -0
  44. package/dist/cjs/helpers/getSize.js +35 -0
  45. package/dist/cjs/helpers/getSize.js.map +7 -0
  46. package/dist/cjs/helpers/getSplitStyles.js +152 -64
  47. package/dist/cjs/helpers/getSplitStyles.js.map +2 -2
  48. package/dist/cjs/helpers/getStylesAtomic.js +20 -2
  49. package/dist/cjs/helpers/getStylesAtomic.js.map +2 -2
  50. package/dist/cjs/helpers/getStylesAtomic.native.js +4 -0
  51. package/dist/cjs/helpers/insertStyleRule.js +46 -26
  52. package/dist/cjs/helpers/insertStyleRule.js.map +2 -2
  53. package/dist/cjs/helpers/isObj.js +4 -0
  54. package/dist/cjs/helpers/isTamaguiElement.js +4 -0
  55. package/dist/cjs/helpers/matchMedia.js +4 -0
  56. package/dist/cjs/helpers/matchMedia.native.js +4 -0
  57. package/dist/cjs/helpers/proxyThemeVariables.js +40 -0
  58. package/dist/cjs/helpers/proxyThemeVariables.js.map +7 -0
  59. package/dist/cjs/helpers/themeable.js +7 -2
  60. package/dist/cjs/helpers/themeable.js.map +2 -2
  61. package/dist/cjs/helpers/validate.js +53 -11
  62. package/dist/cjs/helpers/validate.js.map +2 -2
  63. package/dist/cjs/helpers/withStaticProperties.js +4 -0
  64. package/dist/cjs/helpers/wrapThemeManagerContext.js +4 -0
  65. package/dist/cjs/hooks/useConstant.js +4 -0
  66. package/dist/cjs/hooks/useFeatures.js +101 -12
  67. package/dist/cjs/hooks/useFeatures.js.map +2 -2
  68. package/dist/cjs/hooks/useIsMounted.js +4 -0
  69. package/dist/cjs/hooks/useIsTouchDevice.js +8 -4
  70. package/dist/cjs/hooks/useIsTouchDevice.js.map +2 -2
  71. package/dist/cjs/hooks/useMedia.js +30 -12
  72. package/dist/cjs/hooks/useMedia.js.map +2 -2
  73. package/dist/cjs/hooks/usePressable.js +4 -0
  74. package/dist/cjs/hooks/useTheme.js +36 -23
  75. package/dist/cjs/hooks/useTheme.js.map +2 -2
  76. package/dist/cjs/hooks/useUnmountEffect.js +4 -0
  77. package/dist/cjs/index.js +15 -0
  78. package/dist/cjs/index.js.map +2 -2
  79. package/dist/cjs/static.js +3 -0
  80. package/dist/cjs/static.js.map +2 -2
  81. package/dist/cjs/styled.js +8 -15
  82. package/dist/cjs/styled.js.map +2 -2
  83. package/dist/cjs/types-rnw.js.map +1 -1
  84. package/dist/cjs/types.js.map +1 -1
  85. package/dist/cjs/views/Stack.js +5 -0
  86. package/dist/cjs/views/Stack.js.map +2 -2
  87. package/dist/cjs/views/Text.js +5 -0
  88. package/dist/cjs/views/Text.js.map +2 -2
  89. package/dist/cjs/views/TextAncestorContext.js +6 -0
  90. package/dist/cjs/views/Theme.js +11 -4
  91. package/dist/cjs/views/Theme.js.map +2 -2
  92. package/dist/cjs/views/ThemeInverse.js +5 -0
  93. package/dist/cjs/views/ThemeProvider.js +6 -1
  94. package/dist/cjs/views/ThemeProvider.js.map +2 -2
  95. package/dist/cjs/views/ThemeReset.js +4 -0
  96. package/dist/esm/Tamagui.js +10 -2
  97. package/dist/esm/Tamagui.js.map +2 -2
  98. package/dist/esm/ThemeManager.js +21 -11
  99. package/dist/esm/ThemeManager.js.map +2 -2
  100. package/dist/esm/conf.js +0 -1
  101. package/dist/esm/conf.js.map +2 -2
  102. package/dist/esm/constants/platform.js +2 -0
  103. package/dist/esm/constants/platform.js.map +2 -2
  104. package/dist/esm/createComponent.js +146 -133
  105. package/dist/esm/createComponent.js.map +2 -2
  106. package/dist/esm/createTamagui.js +53 -28
  107. package/dist/esm/createTamagui.js.map +2 -2
  108. package/dist/esm/createTokens.js +2 -6
  109. package/dist/esm/createTokens.js.map +2 -2
  110. package/dist/esm/createVariable.js +8 -2
  111. package/dist/esm/createVariable.js.map +2 -2
  112. package/dist/esm/defaultComponentState.js +0 -11
  113. package/dist/esm/defaultComponentState.js.map +3 -3
  114. package/dist/esm/helpers/RNComponents.js +12 -0
  115. package/dist/esm/helpers/RNComponents.js.map +7 -0
  116. package/dist/esm/helpers/addStylesUsingClassname.js +16 -18
  117. package/dist/esm/helpers/addStylesUsingClassname.js.map +2 -2
  118. package/dist/esm/helpers/createPropMapper.js +59 -61
  119. package/dist/esm/helpers/createPropMapper.js.map +2 -2
  120. package/dist/esm/helpers/createShallowUpdate.js +19 -0
  121. package/dist/esm/helpers/createShallowUpdate.js.map +7 -0
  122. package/dist/esm/helpers/createTamaguiProvider.js +1 -4
  123. package/dist/esm/helpers/createTamaguiProvider.js.map +2 -2
  124. package/dist/esm/helpers/extendStaticConfig.js +9 -6
  125. package/dist/esm/helpers/extendStaticConfig.js.map +2 -2
  126. package/dist/esm/helpers/fixNativeShadow.native.js +2 -2
  127. package/dist/esm/helpers/fixNativeShadow.native.js.map +2 -2
  128. package/dist/esm/helpers/getSize.js +13 -0
  129. package/dist/esm/helpers/getSize.js.map +7 -0
  130. package/dist/esm/helpers/getSplitStyles.js +152 -67
  131. package/dist/esm/helpers/getSplitStyles.js.map +2 -2
  132. package/dist/esm/helpers/getStylesAtomic.js +15 -2
  133. package/dist/esm/helpers/getStylesAtomic.js.map +2 -2
  134. package/dist/esm/helpers/insertStyleRule.js +36 -26
  135. package/dist/esm/helpers/insertStyleRule.js.map +2 -2
  136. package/dist/esm/helpers/proxyThemeVariables.js +18 -0
  137. package/dist/esm/helpers/proxyThemeVariables.js.map +7 -0
  138. package/dist/esm/helpers/themeable.js +3 -2
  139. package/dist/esm/helpers/themeable.js.map +2 -2
  140. package/dist/esm/helpers/validate.js +24 -11
  141. package/dist/esm/helpers/validate.js.map +2 -2
  142. package/dist/esm/hooks/useFeatures.js +96 -17
  143. package/dist/esm/hooks/useFeatures.js.map +2 -2
  144. package/dist/esm/hooks/useIsTouchDevice.js +6 -6
  145. package/dist/esm/hooks/useIsTouchDevice.js.map +2 -2
  146. package/dist/esm/hooks/useMedia.js +19 -12
  147. package/dist/esm/hooks/useMedia.js.map +2 -2
  148. package/dist/esm/hooks/useTheme.js +28 -23
  149. package/dist/esm/hooks/useTheme.js.map +2 -2
  150. package/dist/esm/index.js +4 -0
  151. package/dist/esm/index.js.map +2 -2
  152. package/dist/esm/static.js +3 -0
  153. package/dist/esm/static.js.map +2 -2
  154. package/dist/esm/styled.js +4 -12
  155. package/dist/esm/styled.js.map +2 -2
  156. package/dist/esm/views/Stack.js +1 -0
  157. package/dist/esm/views/Stack.js.map +2 -2
  158. package/dist/esm/views/Text.js +1 -0
  159. package/dist/esm/views/Text.js.map +2 -2
  160. package/dist/esm/views/Theme.js +7 -4
  161. package/dist/esm/views/Theme.js.map +2 -2
  162. package/dist/esm/views/ThemeProvider.js +2 -1
  163. package/dist/esm/views/ThemeProvider.js.map +2 -2
  164. package/dist/jsx/Tamagui.js +10 -2
  165. package/dist/jsx/ThemeManager.js +21 -11
  166. package/dist/jsx/conf.js +0 -1
  167. package/dist/jsx/constants/platform.js +2 -0
  168. package/dist/jsx/createComponent.js +139 -127
  169. package/dist/jsx/createTamagui.js +53 -28
  170. package/dist/jsx/createTokens.js +2 -6
  171. package/dist/jsx/createVariable.js +8 -2
  172. package/dist/jsx/defaultComponentState.js +0 -11
  173. package/dist/jsx/helpers/RNComponents.js +11 -0
  174. package/dist/jsx/helpers/addStylesUsingClassname.js +16 -18
  175. package/dist/jsx/helpers/createPropMapper.js +59 -61
  176. package/dist/jsx/helpers/createShallowUpdate.js +18 -0
  177. package/dist/jsx/helpers/createTamaguiProvider.js +1 -2
  178. package/dist/jsx/helpers/extendStaticConfig.js +9 -6
  179. package/dist/jsx/helpers/fixNativeShadow.native.js +2 -2
  180. package/dist/jsx/helpers/getSize.js +12 -0
  181. package/dist/jsx/helpers/getSplitStyles.js +152 -67
  182. package/dist/jsx/helpers/getStylesAtomic.js +15 -2
  183. package/dist/jsx/helpers/insertStyleRule.js +36 -26
  184. package/dist/jsx/helpers/proxyThemeVariables.js +17 -0
  185. package/dist/jsx/helpers/themeable.js +3 -3
  186. package/dist/jsx/helpers/validate.js +24 -11
  187. package/dist/jsx/hooks/useFeatures.js +96 -17
  188. package/dist/jsx/hooks/useIsTouchDevice.js +6 -6
  189. package/dist/jsx/hooks/useMedia.js +19 -12
  190. package/dist/jsx/hooks/useTheme.js +28 -23
  191. package/dist/jsx/index.js +4 -0
  192. package/dist/jsx/static.js +3 -0
  193. package/dist/jsx/styled.js +4 -12
  194. package/dist/jsx/views/Stack.js +1 -0
  195. package/dist/jsx/views/Text.js +1 -0
  196. package/dist/jsx/views/Theme.js +7 -4
  197. package/dist/jsx/views/ThemeProvider.js +2 -2
  198. package/package.json +6 -6
  199. package/types/Tamagui.d.ts +18 -1
  200. package/types/Tamagui.d.ts.map +1 -1
  201. package/types/ThemeManager.d.ts +3 -3
  202. package/types/ThemeManager.d.ts.map +1 -1
  203. package/types/conf.d.ts +2 -0
  204. package/types/conf.d.ts.map +1 -1
  205. package/types/constants/platform.d.ts +1 -0
  206. package/types/constants/platform.d.ts.map +1 -1
  207. package/types/createComponent.d.ts +5 -7
  208. package/types/createComponent.d.ts.map +1 -1
  209. package/types/createFont.d.ts +1 -1
  210. package/types/createFont.d.ts.map +1 -1
  211. package/types/createTamagui.d.ts +3 -1
  212. package/types/createTamagui.d.ts.map +1 -1
  213. package/types/createTokens.d.ts +0 -26
  214. package/types/createTokens.d.ts.map +1 -1
  215. package/types/createVariable.d.ts +1 -0
  216. package/types/createVariable.d.ts.map +1 -1
  217. package/types/defaultComponentState.d.ts +0 -12
  218. package/types/defaultComponentState.d.ts.map +1 -1
  219. package/types/helpers/RNComponents.d.ts +2 -0
  220. package/types/helpers/RNComponents.d.ts.map +1 -0
  221. package/types/helpers/addStylesUsingClassname.d.ts.map +1 -1
  222. package/types/helpers/createPropMapper.d.ts +2 -2
  223. package/types/helpers/createPropMapper.d.ts.map +1 -1
  224. package/types/helpers/createShallowUpdate.d.ts +4 -0
  225. package/types/helpers/createShallowUpdate.d.ts.map +1 -0
  226. package/types/helpers/createTamaguiProvider.d.ts +1 -1
  227. package/types/helpers/createTamaguiProvider.d.ts.map +1 -1
  228. package/types/helpers/extendStaticConfig.d.ts +2 -2
  229. package/types/helpers/extendStaticConfig.d.ts.map +1 -1
  230. package/types/helpers/getSize.d.ts +3 -0
  231. package/types/helpers/getSize.d.ts.map +1 -0
  232. package/types/helpers/getSplitStyles.d.ts +15 -18
  233. package/types/helpers/getSplitStyles.d.ts.map +1 -1
  234. package/types/helpers/getStylesAtomic.d.ts.map +1 -1
  235. package/types/helpers/insertStyleRule.d.ts +2 -1
  236. package/types/helpers/insertStyleRule.d.ts.map +1 -1
  237. package/types/helpers/proxyThemeVariables.d.ts +2 -0
  238. package/types/helpers/proxyThemeVariables.d.ts.map +1 -0
  239. package/types/helpers/themeable.d.ts +3 -1
  240. package/types/helpers/themeable.d.ts.map +1 -1
  241. package/types/helpers/validate.d.ts.map +1 -1
  242. package/types/hooks/useFeatures.d.ts +7 -5
  243. package/types/hooks/useFeatures.d.ts.map +1 -1
  244. package/types/hooks/useMedia.d.ts +2 -6
  245. package/types/hooks/useMedia.d.ts.map +1 -1
  246. package/types/hooks/useTheme.d.ts +1 -1
  247. package/types/hooks/useTheme.d.ts.map +1 -1
  248. package/types/index.d.ts +2 -0
  249. package/types/index.d.ts.map +1 -1
  250. package/types/static.d.ts +3 -0
  251. package/types/static.d.ts.map +1 -1
  252. package/types/styled.d.ts +13 -8
  253. package/types/styled.d.ts.map +1 -1
  254. package/types/types-rnw.d.ts +0 -5
  255. package/types/types-rnw.d.ts.map +1 -1
  256. package/types/types.d.ts +147 -106
  257. package/types/types.d.ts.map +1 -1
  258. package/types/views/Stack.d.ts +2 -2
  259. package/types/views/Stack.d.ts.map +1 -1
  260. package/types/views/Text.d.ts +2 -2
  261. package/types/views/Text.d.ts.map +1 -1
  262. package/types/views/Theme.d.ts +1 -0
  263. package/types/views/Theme.d.ts.map +1 -1
  264. package/types/views/ThemeProvider.d.ts +1 -0
  265. package/types/views/ThemeProvider.d.ts.map +1 -1
  266. package/LICENSE +0 -21
  267. package/dist/cjs/spacedChildren.js +0 -86
  268. package/dist/cjs/spacedChildren.js.map +0 -7
  269. package/dist/esm/spacedChildren.js +0 -52
  270. package/dist/esm/spacedChildren.js.map +0 -7
  271. package/dist/jsx/spacedChildren.js +0 -44
  272. package/types/spacedChildren.d.ts +0 -9
  273. package/types/spacedChildren.d.ts.map +0 -1
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/constants/platform.ts"],
4
- "sourcesContent": ["import { useEffect, useLayoutEffect } from 'react'\nimport { Platform } from 'react-native'\n\nexport const isAndroid = Platform?.OS === 'android'\nexport const isIOS = Platform?.OS === 'ios'\n\nexport const isWeb =\n process.env.TAMAGUI_TARGET !== 'native' &&\n (process.env.TAMAGUI_TARGET === 'web' || Platform?.OS === 'web')\n\nexport const isSSR = isWeb && typeof window === 'undefined'\nexport const useIsomorphicLayoutEffect = isSSR ? useEffect : useLayoutEffect\nexport const isChrome = typeof navigator !== 'undefined' && /Chrome/.test(navigator.userAgent || '')\nexport const supportsTouchWeb = typeof window !== 'undefined' && 'ontouchstart' in window\nexport const isTouchDevice = !isWeb || supportsTouchWeb\nexport const isWebIOS =\n isWeb &&\n typeof navigator !== 'undefined' &&\n (/iPad|iPhone|iPod/.test(navigator.platform) ||\n (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1)) &&\n !window['MSStream']\n"],
5
- "mappings": "AAAA;AAAA;AACA;AAEO,MAAM,YAAY,uCAAU,QAAO;AACnC,MAAM,QAAQ,uCAAU,QAAO;AAE/B,MAAM,QACX,QAAQ,IAAI,mBAAmB,YAC9B,SAAQ,IAAI,mBAAmB,SAAS,uCAAU,QAAO;AAErD,MAAM,QAAQ,SAAS,OAAO,WAAW;AACzC,MAAM,4BAA4B,QAAQ,YAAY;AACtD,MAAM,WAAW,OAAO,cAAc,eAAe,SAAS,KAAK,UAAU,aAAa,EAAE;AAC5F,MAAM,mBAAmB,OAAO,WAAW,eAAe,kBAAkB;AAC5E,MAAM,gBAAgB,CAAC,SAAS;AAChC,MAAM,WACX,SACA,OAAO,cAAc,eACpB,oBAAmB,KAAK,UAAU,QAAQ,KACxC,UAAU,aAAa,cAAc,UAAU,iBAAiB,MACnE,CAAC,OAAO;",
4
+ "sourcesContent": ["import { useEffect, useLayoutEffect } from 'react'\nimport { Platform } from 'react-native'\n\nexport const isAndroid = Platform?.OS === 'android'\nexport const isIOS = Platform?.OS === 'ios'\n\nexport const isWeb =\n process.env.TAMAGUI_TARGET !== 'native' &&\n (process.env.TAMAGUI_TARGET === 'web' || Platform?.OS === 'web')\n\nexport const isSSR = isWeb && typeof window === 'undefined'\nexport const isClient = isWeb && typeof window !== 'undefined'\nexport const useIsomorphicLayoutEffect = isSSR ? useEffect : useLayoutEffect\nexport const isChrome = typeof navigator !== 'undefined' && /Chrome/.test(navigator.userAgent || '')\nexport const supportsTouchWeb = typeof window !== 'undefined' && 'ontouchstart' in window\nexport const isTouchDevice = !isWeb || supportsTouchWeb\nexport const isWebIOS =\n isWeb &&\n typeof navigator !== 'undefined' &&\n (/iPad|iPhone|iPod/.test(navigator.platform) ||\n (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1)) &&\n !window['MSStream']\n"],
5
+ "mappings": "AAAA;AAAA;AACA;AAEO,MAAM,YAAY,uCAAU,QAAO;AACnC,MAAM,QAAQ,uCAAU,QAAO;AAE/B,MAAM,QACX,QAAQ,IAAI,mBAAmB,YAC9B,SAAQ,IAAI,mBAAmB,SAAS,uCAAU,QAAO;AAErD,MAAM,QAAQ,SAAS,OAAO,WAAW;AACzC,MAAM,WAAW,SAAS,OAAO,WAAW;AAC5C,MAAM,4BAA4B,QAAQ,YAAY;AACtD,MAAM,WAAW,OAAO,cAAc,eAAe,SAAS,KAAK,UAAU,aAAa,EAAE;AAC5F,MAAM,mBAAmB,OAAO,WAAW,eAAe,kBAAkB;AAC5E,MAAM,gBAAgB,CAAC,SAAS;AAChC,MAAM,WACX,SACA,OAAO,cAAc,eACpB,oBAAmB,KAAK,UAAU,QAAQ,KACxC,UAAU,aAAa,cAAc,UAAU,iBAAiB,MACnE,CAAC,OAAO;",
6
6
  "names": []
7
7
  }
@@ -10,103 +10,119 @@ import React, {
10
10
  memo,
11
11
  useCallback,
12
12
  useContext,
13
- useEffect,
14
13
  useRef,
15
14
  useState
16
15
  } from "react";
17
16
  import { StyleSheet, Text, View } from "react-native";
18
17
  import { onConfiguredOnce } from "./conf";
19
18
  import { stackDefaultStyles } from "./constants/constants";
20
- import { isAndroid, isTouchDevice, isWeb } from "./constants/platform";
19
+ import { isAndroid, isWeb, useIsomorphicLayoutEffect } from "./constants/platform";
21
20
  import { rnw } from "./constants/rnw";
22
21
  import { isVariable } from "./createVariable";
23
- import { defaultComponentState } from "./defaultComponentState";
22
+ import { createShallowUpdate } from "./helpers/createShallowUpdate";
24
23
  import { extendStaticConfig, parseStaticConfig } from "./helpers/extendStaticConfig";
25
- import {
26
- getSplitStyles
27
- } from "./helpers/getSplitStyles";
24
+ import { insertSplitStyles, useSplitStyles } from "./helpers/getSplitStyles";
25
+ import { getAllSelectors } from "./helpers/insertStyleRule";
26
+ import { proxyThemeVariables } from "./helpers/proxyThemeVariables";
28
27
  import { wrapThemeManagerContext } from "./helpers/wrapThemeManagerContext";
29
28
  import { useFeatures } from "./hooks/useFeatures";
29
+ import { useIsTouchDevice } from "./hooks/useIsTouchDevice";
30
30
  import { usePressable } from "./hooks/usePressable";
31
31
  import { getThemeManagerIfChanged, useTheme } from "./hooks/useTheme";
32
32
  import { TextAncestorContext } from "./views/TextAncestorContext";
33
+ React["keep"];
34
+ const defaultComponentState = {
35
+ hover: false,
36
+ press: false,
37
+ pressIn: false,
38
+ focus: false,
39
+ mounted: false,
40
+ animation: null
41
+ };
33
42
  const mouseUps = /* @__PURE__ */ new Set();
34
43
  if (typeof document !== "undefined") {
35
44
  document.addEventListener("mouseup", () => {
36
45
  mouseUps.forEach((x) => x());
37
46
  mouseUps.clear();
38
47
  });
48
+ document.addEventListener("touchend", () => {
49
+ mouseUps.forEach((x) => x());
50
+ mouseUps.clear();
51
+ });
52
+ document.addEventListener("touchcancel", () => {
53
+ mouseUps.forEach((x) => x());
54
+ mouseUps.clear();
55
+ });
39
56
  }
40
- function createShallowUpdate(setter) {
41
- return (next) => {
42
- setter((prev) => {
43
- for (const key in next) {
44
- if (prev[key] !== next[key]) {
45
- return { ...prev, ...next };
46
- }
47
- }
48
- return prev;
49
- });
50
- };
51
- }
52
- __name(createShallowUpdate, "createShallowUpdate");
53
- function createComponent(configIn) {
54
- let staticConfig;
55
- if ("parsed" in configIn) {
56
- staticConfig = configIn;
57
- } else {
58
- staticConfig = parseStaticConfig(configIn);
57
+ function mergeShorthands({ defaultProps }, { shorthands }) {
58
+ for (const key in defaultProps) {
59
+ defaultProps[shorthands[key] || key] = defaultProps[key];
59
60
  }
60
- const { Component, validStyles, isText, isZStack, componentName } = staticConfig;
61
- const componentClassName = `is_${componentName}`;
62
- const validStyleProps = validStyles || stylePropsView;
61
+ }
62
+ __name(mergeShorthands, "mergeShorthands");
63
+ let initialTheme;
64
+ function createComponent(configIn, ParentComponent) {
65
+ const staticConfig = (() => {
66
+ const config = extendStaticConfig(configIn, ParentComponent);
67
+ if ("parsed" in config) {
68
+ return config;
69
+ } else {
70
+ return parseStaticConfig(config);
71
+ }
72
+ })();
73
+ const componentClassName = `is_${staticConfig.componentName}`;
63
74
  let tamaguiConfig;
64
75
  let AnimatedText;
65
76
  let AnimatedView;
66
- let avoidClasses = false;
67
- let defaultPseudos = {};
77
+ let avoidClasses = true;
68
78
  let defaultNativeStyle;
69
- let defaultNativeStyleSheet = null;
70
- let defaultsClassName = null;
71
- let initialTheme;
72
- let splitStyleResult = null;
79
+ let defaultNativeStyleSheet;
80
+ let tamaguiDefaultProps;
81
+ let initialSplitStyles;
73
82
  function addPseudoToStyles(styles, name, pseudos) {
74
83
  const pseudoStyle = pseudos[name];
84
+ const shouldNestObject = isWeb && name !== "enterStyle" && name !== "exitStyle";
75
85
  if (pseudoStyle) {
76
- styles.push(isWeb ? { [name]: pseudoStyle } : pseudoStyle);
86
+ styles.push(shouldNestObject ? { [name]: pseudoStyle } : pseudoStyle);
77
87
  }
78
- const defaultPseudoStyle = defaultPseudos[name];
88
+ const defaultPseudoStyle = initialSplitStyles.pseudos[name];
79
89
  if (defaultPseudoStyle) {
80
- styles.push(isWeb ? { [name]: defaultPseudoStyle } : defaultPseudoStyle);
90
+ styles.push(shouldNestObject ? { [name]: defaultPseudoStyle } : defaultPseudoStyle);
81
91
  }
82
92
  }
83
93
  __name(addPseudoToStyles, "addPseudoToStyles");
84
94
  const component = forwardRef((props, forwardedRef) => {
85
95
  var _a, _b, _c, _d;
96
+ props = tamaguiDefaultProps ? { ...tamaguiDefaultProps, ...props } : props;
97
+ const { Component, componentName, isText, isZStack } = staticConfig;
86
98
  if (process.env.NODE_ENV === "development") {
87
99
  if (props["debug"]) {
88
- console.warn(componentName || (Component == null ? void 0 : Component.displayName) || (Component == null ? void 0 : Component.name) || "[Unnamed Component]", " debug prop on:", { props: Object.entries(props) });
100
+ console.warn(staticConfig.componentName || (Component == null ? void 0 : Component.displayName) || (Component == null ? void 0 : Component.name) || "[Unnamed Component]", "debug on");
101
+ console.log("props in:", props, Object.keys(props));
89
102
  if (props["debug"] === "break")
90
103
  debugger;
91
104
  }
92
105
  }
93
106
  const forceUpdate = useForceUpdate();
94
- const theme = useTheme(props.theme, componentName, props, forceUpdate);
107
+ const theme = useTheme(props.theme, staticConfig.componentName, props, forceUpdate);
95
108
  const [state, set_] = useState(defaultComponentState);
96
109
  const setStateShallow = createShallowUpdate(set_);
97
- const shouldAvoidClasses = !!(state.animation && avoidClasses);
98
- const splitInfo = getSplitStyles(props, staticConfig, theme, shouldAvoidClasses ? { ...state, noClassNames: true, resolveVariablesAs: "value" } : state, defaultsClassName);
99
- const { viewProps: viewPropsIn, pseudos, medias, style, classNames } = splitInfo;
110
+ const shouldAvoidClasses = !!(props.animation && avoidClasses);
111
+ const splitStyles = useSplitStyles(props, staticConfig, theme, shouldAvoidClasses ? { ...state, noClassNames: true, resolveVariablesAs: "value" } : state, shouldAvoidClasses ? null : initialSplitStyles.classNames);
112
+ const { viewProps: viewPropsIn, pseudos, medias, style, classNames } = splitStyles;
100
113
  const useAnimations = (_a = tamaguiConfig.animations) == null ? void 0 : _a.useAnimations;
101
114
  const isAnimated = !!(useAnimations && props.animation);
102
- const styleWithPseudos = props.animation ? merge({ ...defaultNativeStyle, ...style }, state.hover && pseudos.hoverStyle, state.press && pseudos.pressStyle, state.focus && pseudos.focusStyle, ...Object.values(medias)) : null;
115
+ const hasEnterStyle = !!props.enterStyle;
103
116
  const features = useFeatures(props, {
104
117
  forceUpdate,
105
118
  setStateShallow,
106
119
  useAnimations,
107
120
  state,
108
- style: styleWithPseudos,
109
- pseudos
121
+ style: props.animation ? { ...defaultNativeStyle, ...style } : null,
122
+ pseudos,
123
+ staticConfig,
124
+ theme,
125
+ onDidAnimate: props.onDidAnimate
110
126
  });
111
127
  const {
112
128
  tag,
@@ -145,6 +161,7 @@ function createComponent(configIn) {
145
161
  accessibilityRole,
146
162
  collapsable,
147
163
  focusable,
164
+ onClick,
148
165
  theme: _themeProp,
149
166
  defaultVariants,
150
167
  onLayout,
@@ -160,15 +177,14 @@ function createComponent(configIn) {
160
177
  }
161
178
  const hasTextAncestor = isWeb ? useContext(TextAncestorContext) : false;
162
179
  const hostRef = useRef(null);
163
- const hasEnterStyle = !!props.enterStyle;
164
180
  const internal = useRef();
165
181
  if (!internal.current) {
166
182
  internal.current = {
167
183
  isMounted: true
168
184
  };
169
185
  }
170
- useEffect(() => {
171
- if (hasEnterStyle) {
186
+ useIsomorphicLayoutEffect(() => {
187
+ if (typeof window !== "undefined" && (hasEnterStyle || props.animation)) {
172
188
  setStateShallow({
173
189
  mounted: true
174
190
  });
@@ -178,7 +194,7 @@ function createComponent(configIn) {
178
194
  mouseUps.delete(unPress);
179
195
  internal.current.isMounted = false;
180
196
  };
181
- }, []);
197
+ }, [hasEnterStyle, props.animation]);
182
198
  if (nativeID) {
183
199
  viewProps.id = nativeID;
184
200
  }
@@ -236,6 +252,7 @@ function createComponent(configIn) {
236
252
  medias
237
253
  ];
238
254
  if (!animationStyles) {
255
+ !state.mounted && addPseudoToStyles(styles, "enterStyle", pseudos);
239
256
  state.hover && addPseudoToStyles(styles, "hoverStyle", pseudos);
240
257
  state.focus && addPseudoToStyles(styles, "focusStyle", pseudos);
241
258
  state.press && addPseudoToStyles(styles, "pressStyle", pseudos);
@@ -254,10 +271,11 @@ function createComponent(configIn) {
254
271
  const className = classList.join(" ");
255
272
  if (process.env.NODE_ENV === "development") {
256
273
  if (props["debug"]) {
257
- console.log(" \xBB className", { isStringElement, pseudos, state, defaultsClassName, classNames, propsClassName: props.className, style, classList, className: className.trim().split(" "), themeClassName: theme.className });
274
+ console.log(" \xBB className", { isStringElement, pseudos, state, classNames, propsClassName: props.className, style, classList, className: className.trim().split(" "), themeClassName: theme.className, values: Object.fromEntries(Object.entries(classNames).map(([k, v]) => [v, getAllSelectors()[v]])) });
258
275
  }
259
276
  }
260
277
  viewProps.className = className;
278
+ viewProps.style = animationStyles;
261
279
  } else {
262
280
  viewProps.style = styles;
263
281
  }
@@ -294,8 +312,10 @@ function createComponent(configIn) {
294
312
  viewProps.ref = forwardedRef;
295
313
  }
296
314
  }
297
- const attachPress = !!(pseudos && pseudos.pressStyle || onPress || onPressOut || onPressIn);
298
- const isHoverable = isWeb && !isTouchDevice;
315
+ const initialPseudos = initialSplitStyles.pseudos;
316
+ const attachPress = !!(pseudos && pseudos.pressStyle || initialPseudos && initialPseudos.pressStyle || onPress || onPressOut || onPressIn || onClick);
317
+ const isTouch = useIsTouchDevice();
318
+ const isHoverable = isWeb && !isTouch;
299
319
  const attachHover = isHoverable && !!(pseudos && pseudos.hoverStyle || onHoverIn || onHoverOut || onMouseEnter || onMouseLeave);
300
320
  const pressEventKey = isStringElement ? "onClick" : "onPress";
301
321
  const shouldAttach = attachPress || attachHover || "pressStyle" in props || "onPress" in props || "onPressIn" in props || "onPressOut" in props || isWeb && ("hoverStyle" in props || "onHoverIn" in props || "onHoverOut" in props || "onMouseEnter" in props || "onMouseLeave" in props);
@@ -353,8 +373,12 @@ function createComponent(configIn) {
353
373
  });
354
374
  onPressIn == null ? void 0 : onPressIn(e);
355
375
  onMouseDown == null ? void 0 : onMouseDown(e);
376
+ if (isWeb) {
377
+ mouseUps.add(unPress);
378
+ }
356
379
  } : null,
357
380
  [pressEventKey]: attachPress ? (e) => {
381
+ onClick == null ? void 0 : onClick(e);
358
382
  onPress == null ? void 0 : onPress(e);
359
383
  unPress();
360
384
  onPressOut == null ? void 0 : onPressOut(e);
@@ -377,22 +401,6 @@ function createComponent(configIn) {
377
401
  } : {
378
402
  disabled: true
379
403
  });
380
- if (events) {
381
- if (!isStringElement) {
382
- Object.assign(viewProps, pressProps);
383
- } else {
384
- Object.assign(viewProps, events);
385
- }
386
- if (isWeb && isHoverable) {
387
- childEls = /* @__PURE__ */ React.createElement("span", {
388
- style: {
389
- display: "contents"
390
- },
391
- onMouseEnter: events.onMouseEnter,
392
- onMouseLeave: events.onMouseLeave
393
- }, children);
394
- }
395
- }
396
404
  let content;
397
405
  if (isWeb) {
398
406
  if (staticConfig.isReactNativeWeb) {
@@ -409,11 +417,28 @@ function createComponent(configIn) {
409
417
  }
410
418
  }
411
419
  }
420
+ if (events) {
421
+ if (!isStringElement) {
422
+ Object.assign(viewProps, pressProps);
423
+ } else {
424
+ Object.assign(viewProps, events);
425
+ }
426
+ }
412
427
  content = createElement(ViewComponent, viewProps, childEls);
428
+ if (isWeb && events && attachHover) {
429
+ content = /* @__PURE__ */ React.createElement("span", {
430
+ className: "tui_Hoverable",
431
+ style: {
432
+ display: "contents"
433
+ },
434
+ onMouseEnter: events.onMouseEnter,
435
+ onMouseLeave: events.onMouseLeave
436
+ }, content);
437
+ }
413
438
  if (process.env.NODE_ENV === "development") {
414
439
  if (props["debug"]) {
415
440
  viewProps["debug"] = true;
416
- console.log(" \xBB ", { propsIn: { ...props }, propsOut: { ...viewProps }, animationStyles, isStringElement, classNamesIn: (_c = props.className) == null ? void 0 : _c.split(" "), classNamesOut: (_d = viewProps.className) == null ? void 0 : _d.split(" "), pressProps, events, shouldAttach, ViewComponent, viewProps, state, styles, pseudos, content, childEls, shouldAvoidClasses, animation: props.animation, style, defaultNativeStyle, splitStyleResult, ...typeof window !== "undefined" ? { theme, themeState: theme.__state, themeClassName: theme.className, staticConfig, tamaguiConfig } : null });
441
+ console.log(" \xBB ", { propsIn: { ...props }, propsOut: { ...viewProps }, state, splitStyles, animationStyles, isStringElement, classNamesIn: (_c = props.className) == null ? void 0 : _c.split(" "), classNamesOut: (_d = viewProps.className) == null ? void 0 : _d.split(" "), pressProps, events, shouldAttach, ViewComponent, viewProps, styles, pseudos, content, childEls, shouldAvoidClasses, avoidClasses, animation: props.animation, style, defaultNativeStyle, initialSplitStyles, ...typeof window !== "undefined" ? { theme, themeState: theme.__state, themeClassName: theme.className, staticConfig, tamaguiConfig } : null });
417
442
  }
418
443
  }
419
444
  if (features.length) {
@@ -421,23 +446,28 @@ function createComponent(configIn) {
421
446
  }
422
447
  return content;
423
448
  });
449
+ component.displayName = staticConfig.componentName;
424
450
  onConfiguredOnce((conf) => {
425
451
  var _a, _b, _c, _d;
426
- const shouldDebug = (_a = staticConfig.defaultProps) == null ? void 0 : _a.debug;
452
+ if (process.env.IS_STATIC === "is_static") {
453
+ return;
454
+ }
427
455
  tamaguiConfig = conf;
428
- avoidClasses = !!((_b = tamaguiConfig.animations) == null ? void 0 : _b.avoidClasses);
429
- AnimatedText = (_c = tamaguiConfig.animations) == null ? void 0 : _c.Text;
430
- AnimatedView = (_d = tamaguiConfig == null ? void 0 : tamaguiConfig.animations) == null ? void 0 : _d.View;
431
- initialTheme = conf.themes[conf.defaultTheme || Object.keys(conf.themes)[0]];
432
- splitStyleResult = getSplitStyles(staticConfig.defaultProps, staticConfig, initialTheme, {
456
+ mergeShorthands(staticConfig, tamaguiConfig);
457
+ avoidClasses = !!((_a = tamaguiConfig.animations) == null ? void 0 : _a.avoidClasses);
458
+ AnimatedText = (_b = tamaguiConfig.animations) == null ? void 0 : _b.Text;
459
+ AnimatedView = (_c = tamaguiConfig == null ? void 0 : tamaguiConfig.animations) == null ? void 0 : _c.View;
460
+ initialTheme = initialTheme || proxyThemeVariables(conf.themes[conf.defaultTheme || Object.keys(conf.themes)[0]]);
461
+ initialSplitStyles = insertSplitStyles(staticConfig.defaultProps, staticConfig, initialTheme, {
433
462
  mounted: true,
434
- resolveVariablesAs: "variable"
463
+ hover: false,
464
+ press: false,
465
+ pressIn: false,
466
+ focus: false,
467
+ resolveVariablesAs: "both",
468
+ keepVariantsAsProps: true
435
469
  });
436
- const { classNames, pseudos, style, viewProps } = splitStyleResult;
437
- if (isWeb) {
438
- defaultsClassName = classNames;
439
- }
440
- defaultPseudos = pseudos;
470
+ const { style, viewProps } = initialSplitStyles;
441
471
  defaultNativeStyle = {};
442
472
  for (const key in style) {
443
473
  const v = style[key];
@@ -446,13 +476,20 @@ function createComponent(configIn) {
446
476
  defaultNativeStyleSheet = StyleSheet.create({
447
477
  base: defaultNativeStyle
448
478
  });
449
- component.displayName = staticConfig.componentName;
450
- component.defaultProps = {
479
+ const defaults = {
451
480
  ...viewProps,
452
481
  ...component.defaultProps
453
482
  };
454
- if (process.env.NODE_ENV === "development" && shouldDebug && process.env.IS_STATIC !== "is_static") {
455
- console.log(`\u{1F41B} [${staticConfig.componentName || "Component"}]`, { staticConfig, ...splitStyleResult });
483
+ if (Object.keys(defaults).length) {
484
+ tamaguiDefaultProps = defaults;
485
+ }
486
+ if (process.env.NODE_ENV === "development" && ((_d = staticConfig.defaultProps) == null ? void 0 : _d.debug)) {
487
+ if (process.env.IS_STATIC !== "is_static") {
488
+ console.log(`\u{1F41B} [${staticConfig.componentName || "Component"}]`, {
489
+ staticConfig,
490
+ initialSplitStyles
491
+ });
492
+ }
456
493
  }
457
494
  });
458
495
  let res = component;
@@ -460,25 +497,30 @@ function createComponent(configIn) {
460
497
  res = memo(res);
461
498
  }
462
499
  res["staticConfig"] = {
463
- validStyles: validStyleProps,
500
+ validStyles: staticConfig.validStyles || stylePropsView,
464
501
  ...staticConfig
465
502
  };
466
- res["extractable"] = (Component2, conf) => {
467
- Component2["staticConfig"] = extendStaticConfig(res, {
503
+ if (process.env.NODE_ENV === "development") {
504
+ res["whyDidYouRender"] = true;
505
+ }
506
+ res["extractable"] = (Component, conf) => {
507
+ Component["staticConfig"] = extendStaticConfig({
508
+ Component,
468
509
  ...conf,
469
510
  neverFlatten: true,
470
511
  defaultProps: {
471
- ...Component2.defaultProps,
512
+ ...Component.defaultProps,
472
513
  ...conf == null ? void 0 : conf.defaultProps
473
514
  }
474
- });
475
- return Component2;
515
+ }, res);
516
+ return Component;
476
517
  };
477
518
  return res;
478
519
  }
479
520
  __name(createComponent, "createComponent");
480
521
  const Spacer = createComponent({
481
522
  memo: true,
523
+ componentName: "Spacer",
482
524
  defaultProps: {
483
525
  ...stackDefaultStyles,
484
526
  size: true
@@ -558,49 +600,20 @@ function spacedChildren({
558
600
  return next;
559
601
  }
560
602
  __name(spacedChildren, "spacedChildren");
561
- const merge = /* @__PURE__ */ __name((...styles) => {
562
- if (!styles[0])
563
- return;
564
- const res = {};
565
- const len = styles.length;
566
- for (let i = len - 1; i >= 0; i--) {
567
- const cur = styles[i];
568
- if (!cur)
569
- continue;
570
- for (const key in cur) {
571
- const val = cur[key];
572
- if (key !== "transform") {
573
- if (!(key in res)) {
574
- res[key] = val;
575
- }
576
- continue;
577
- }
578
- if (!res.transform) {
579
- res.transform = val;
580
- continue;
581
- }
582
- for (const t of val) {
583
- const tkey = Object.keys(t)[0];
584
- if (res.transform.find((existing) => tkey in existing)) {
585
- continue;
586
- }
587
- res.transform.push(t);
588
- }
603
+ function AbsoluteFill(props) {
604
+ return isWeb ? /* @__PURE__ */ React.createElement("div", {
605
+ style: {
606
+ position: "absolute",
607
+ top: 0,
608
+ left: 0,
609
+ right: 0,
610
+ bottom: 0
589
611
  }
590
- }
591
- return res;
592
- }, "merge");
593
- const AbsoluteFill = /* @__PURE__ */ __name((props) => isWeb ? /* @__PURE__ */ React.createElement("div", {
594
- style: {
595
- position: "absolute",
596
- top: 0,
597
- left: 0,
598
- right: 0,
599
- bottom: 0
600
- }
601
- }, props.children) : /* @__PURE__ */ React.createElement(View, {
602
- style: StyleSheet.absoluteFill
603
- }, props.child), "AbsoluteFill");
612
+ }, props.children) : /* @__PURE__ */ React.createElement(View, {
613
+ style: StyleSheet.absoluteFill
614
+ }, props.child);
615
+ }
616
+ __name(AbsoluteFill, "AbsoluteFill");
604
617
  export {
605
618
  AbsoluteFill,
606
619
  Spacer,