@tamagui/core 1.0.1-beta.193 → 1.0.1-beta.194

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 (220) hide show
  1. package/dist/cjs/Tamagui.js +4 -2
  2. package/dist/cjs/Tamagui.js.map +2 -2
  3. package/dist/cjs/config.js +1 -2
  4. package/dist/cjs/config.js.map +2 -2
  5. package/dist/cjs/constants/constants.js +13 -8
  6. package/dist/cjs/constants/constants.js.map +2 -2
  7. package/dist/cjs/contexts/TextAncestorContext.js +3 -16
  8. package/dist/cjs/contexts/TextAncestorContext.js.map +3 -3
  9. package/dist/cjs/createComponent.js +194 -289
  10. package/dist/cjs/createComponent.js.map +2 -2
  11. package/dist/cjs/createTamagui.js +15 -16
  12. package/dist/cjs/createTamagui.js.map +3 -3
  13. package/dist/cjs/createVariable.js +1 -2
  14. package/dist/cjs/createVariable.js.map +2 -2
  15. package/dist/cjs/helpers/ThemeManager.js +7 -14
  16. package/dist/cjs/helpers/ThemeManager.js.map +2 -2
  17. package/dist/cjs/helpers/{createShallowUpdate.js → cache.js} +20 -21
  18. package/dist/cjs/helpers/cache.js.map +7 -0
  19. package/dist/cjs/helpers/createMediaStyle.js +14 -8
  20. package/dist/cjs/helpers/createMediaStyle.js.map +2 -2
  21. package/dist/cjs/helpers/extendStaticConfig.js +0 -1
  22. package/dist/cjs/helpers/extendStaticConfig.js.map +2 -2
  23. package/dist/cjs/helpers/getSplitStyles.js +212 -93
  24. package/dist/cjs/helpers/getSplitStyles.js.map +3 -3
  25. package/dist/cjs/helpers/getStylesAtomic.js +16 -36
  26. package/dist/cjs/helpers/getStylesAtomic.js.map +3 -3
  27. package/dist/cjs/helpers/insertStyleRule.js +14 -6
  28. package/dist/cjs/helpers/insertStyleRule.js.map +2 -2
  29. package/dist/cjs/helpers/matchMedia.js.map +2 -2
  30. package/dist/cjs/helpers/mergeTransform.js.map +1 -1
  31. package/dist/cjs/helpers/normalizeValueWithProperty.js +32 -2
  32. package/dist/cjs/helpers/normalizeValueWithProperty.js.map +2 -2
  33. package/dist/cjs/helpers/useShallowSetState.js.map +2 -2
  34. package/dist/cjs/hooks/getThemeUnwrapped.js +1 -3
  35. package/dist/cjs/hooks/getThemeUnwrapped.js.map +2 -2
  36. package/dist/cjs/hooks/useElementLayout.js +92 -0
  37. package/dist/cjs/hooks/useElementLayout.js.map +7 -0
  38. package/dist/cjs/hooks/useIsTouchDevice.js +2 -10
  39. package/dist/cjs/hooks/useIsTouchDevice.js.map +2 -2
  40. package/dist/cjs/hooks/useMedia.js +77 -84
  41. package/dist/cjs/hooks/useMedia.js.map +2 -2
  42. package/dist/cjs/hooks/useMedia.test.js +2 -0
  43. package/dist/cjs/{helpers/validate.js.map → hooks/useMedia.test.js.map} +0 -0
  44. package/dist/cjs/hooks/usePressablePressResponder.js +370 -0
  45. package/dist/cjs/hooks/usePressablePressResponder.js.map +7 -0
  46. package/dist/cjs/hooks/useSafeRef.js +13 -15
  47. package/dist/cjs/hooks/useSafeRef.js.map +2 -2
  48. package/dist/cjs/hooks/useTheme.js +3 -4
  49. package/dist/cjs/hooks/useTheme.js.map +2 -2
  50. package/dist/cjs/index.js +1 -17
  51. package/dist/cjs/index.js.map +2 -2
  52. package/dist/cjs/static.js +0 -20
  53. package/dist/cjs/static.js.map +2 -2
  54. package/dist/cjs/styled.js +4 -22
  55. package/dist/cjs/styled.js.map +2 -2
  56. package/dist/cjs/types.js.map +1 -1
  57. package/dist/cjs/{hooks/useIsSSR.js → views/AbsoluteFill.js} +18 -23
  58. package/dist/cjs/views/AbsoluteFill.js.map +7 -0
  59. package/dist/cjs/views/AbsoluteFill.native.js +45 -0
  60. package/dist/cjs/views/AbsoluteFill.native.js.map +7 -0
  61. package/dist/cjs/views/FontLanguage.native.js.map +2 -2
  62. package/dist/cjs/views/Stack.js.map +1 -1
  63. package/dist/cjs/views/TamaguiProvider.js +3 -2
  64. package/dist/cjs/views/TamaguiProvider.js.map +2 -2
  65. package/dist/cjs/views/Text.js.map +1 -1
  66. package/dist/cjs/views/ThemeReset.js +10 -10
  67. package/dist/cjs/views/ThemeReset.js.map +2 -2
  68. package/dist/esm/Tamagui.js +4 -2
  69. package/dist/esm/Tamagui.js.map +2 -2
  70. package/dist/esm/config.js +1 -2
  71. package/dist/esm/config.js.map +2 -2
  72. package/dist/esm/constants/constants.js +11 -7
  73. package/dist/esm/constants/constants.js.map +2 -2
  74. package/dist/esm/contexts/TextAncestorContext.js +2 -13
  75. package/dist/esm/contexts/TextAncestorContext.js.map +2 -2
  76. package/dist/esm/createComponent.js +193 -291
  77. package/dist/esm/createComponent.js.map +2 -2
  78. package/dist/esm/createTamagui.js +15 -16
  79. package/dist/esm/createTamagui.js.map +3 -3
  80. package/dist/esm/createVariable.js +1 -2
  81. package/dist/esm/createVariable.js.map +2 -2
  82. package/dist/esm/helpers/ThemeManager.js +7 -14
  83. package/dist/esm/helpers/ThemeManager.js.map +2 -2
  84. package/dist/esm/helpers/cache.js +18 -0
  85. package/dist/esm/helpers/cache.js.map +7 -0
  86. package/dist/esm/helpers/createMediaStyle.js +14 -8
  87. package/dist/esm/helpers/createMediaStyle.js.map +2 -2
  88. package/dist/esm/helpers/extendStaticConfig.js +0 -1
  89. package/dist/esm/helpers/extendStaticConfig.js.map +2 -2
  90. package/dist/esm/helpers/getSplitStyles.js +221 -94
  91. package/dist/esm/helpers/getSplitStyles.js.map +3 -3
  92. package/dist/esm/helpers/getStylesAtomic.js +13 -26
  93. package/dist/esm/helpers/getStylesAtomic.js.map +2 -2
  94. package/dist/esm/helpers/insertStyleRule.js +14 -6
  95. package/dist/esm/helpers/insertStyleRule.js.map +2 -2
  96. package/dist/esm/helpers/matchMedia.js.map +2 -2
  97. package/dist/esm/helpers/mergeTransform.js.map +1 -1
  98. package/dist/esm/helpers/normalizeValueWithProperty.js +30 -1
  99. package/dist/esm/helpers/normalizeValueWithProperty.js.map +2 -2
  100. package/dist/esm/helpers/useShallowSetState.js.map +2 -2
  101. package/dist/esm/hooks/getThemeUnwrapped.js +1 -3
  102. package/dist/esm/hooks/getThemeUnwrapped.js.map +2 -2
  103. package/dist/esm/hooks/useElementLayout.js +66 -0
  104. package/dist/esm/hooks/useElementLayout.js.map +7 -0
  105. package/dist/esm/hooks/useIsTouchDevice.js +3 -11
  106. package/dist/esm/hooks/useIsTouchDevice.js.map +2 -2
  107. package/dist/esm/hooks/useMedia.js +74 -83
  108. package/dist/esm/hooks/useMedia.js.map +2 -2
  109. package/dist/esm/hooks/useMedia.test.js +1 -0
  110. package/dist/esm/{helpers/validate.js.map → hooks/useMedia.test.js.map} +0 -0
  111. package/dist/esm/hooks/usePressablePressResponder.js +346 -0
  112. package/dist/esm/hooks/usePressablePressResponder.js.map +7 -0
  113. package/dist/esm/hooks/useSafeRef.js +13 -15
  114. package/dist/esm/hooks/useSafeRef.js.map +2 -2
  115. package/dist/esm/hooks/useTheme.js +3 -4
  116. package/dist/esm/hooks/useTheme.js.map +2 -2
  117. package/dist/esm/index.js +1 -14
  118. package/dist/esm/index.js.map +2 -2
  119. package/dist/esm/static.js +0 -14
  120. package/dist/esm/static.js.map +2 -2
  121. package/dist/esm/styled.js +4 -22
  122. package/dist/esm/styled.js.map +2 -2
  123. package/dist/esm/views/AbsoluteFill.js +17 -0
  124. package/dist/esm/views/AbsoluteFill.js.map +7 -0
  125. package/dist/esm/views/AbsoluteFill.native.js +21 -0
  126. package/dist/esm/views/AbsoluteFill.native.js.map +7 -0
  127. package/dist/esm/views/FontLanguage.native.js.map +2 -2
  128. package/dist/esm/views/Stack.js.map +1 -1
  129. package/dist/esm/views/TamaguiProvider.js +5 -4
  130. package/dist/esm/views/TamaguiProvider.js.map +2 -2
  131. package/dist/esm/views/Text.js.map +1 -1
  132. package/dist/esm/views/ThemeReset.js +10 -10
  133. package/dist/esm/views/ThemeReset.js.map +2 -2
  134. package/package.json +14 -14
  135. package/src/Tamagui.ts +7 -3
  136. package/src/config.ts +2 -3
  137. package/src/constants/constants.ts +10 -6
  138. package/src/contexts/TextAncestorContext.tsx +1 -8
  139. package/src/createComponent.tsx +248 -418
  140. package/src/createTamagui.ts +16 -19
  141. package/src/createVariable.ts +1 -3
  142. package/src/helpers/ThemeManager.tsx +7 -15
  143. package/src/helpers/cache.ts +18 -0
  144. package/src/helpers/createMediaStyle.ts +16 -9
  145. package/src/helpers/extendStaticConfig.ts +0 -1
  146. package/src/helpers/getSplitStyles.tsx +257 -151
  147. package/src/helpers/getStylesAtomic.ts +14 -34
  148. package/src/helpers/insertStyleRule.tsx +16 -8
  149. package/src/helpers/matchMedia.ts +1 -0
  150. package/src/helpers/mergeTransform.ts +1 -1
  151. package/src/helpers/normalizeValueWithProperty.ts +30 -0
  152. package/src/helpers/useShallowSetState.tsx +0 -1
  153. package/src/hooks/getThemeUnwrapped.tsx +1 -2
  154. package/src/hooks/useElementLayout.tsx +90 -0
  155. package/src/hooks/useIsTouchDevice.tsx +3 -17
  156. package/src/hooks/useMedia.tsx +80 -87
  157. package/src/hooks/useSafeRef.ts +17 -18
  158. package/src/hooks/useTheme.tsx +4 -4
  159. package/src/index.ts +1 -11
  160. package/src/static.ts +0 -10
  161. package/src/styled.tsx +15 -33
  162. package/src/types.tsx +58 -55
  163. package/src/views/FontLanguage.native.tsx +1 -0
  164. package/src/views/Stack.tsx +1 -1
  165. package/src/views/TamaguiProvider.tsx +5 -5
  166. package/src/views/Text.tsx +1 -1
  167. package/src/views/ThemeReset.tsx +11 -11
  168. package/types/Tamagui.d.ts +6 -4
  169. package/types/constants/constants.d.ts +14 -3
  170. package/types/contexts/TextAncestorContext.d.ts +1 -3
  171. package/types/createComponent.d.ts +0 -15
  172. package/types/helpers/ThemeManager.d.ts +2 -3
  173. package/types/helpers/cache.d.ts +12 -0
  174. package/types/helpers/calc.d.ts +0 -16
  175. package/types/helpers/createMediaStyle.d.ts +1 -1
  176. package/types/helpers/getSplitStyles.d.ts +6 -10
  177. package/types/helpers/getStylesAtomic.d.ts +1 -5
  178. package/types/helpers/insertStyleRule.d.ts +2 -2
  179. package/types/helpers/mergeTransform.d.ts +1 -1
  180. package/types/helpers/normalizeValueWithProperty.d.ts +1 -0
  181. package/types/hooks/useElementLayout.d.ts +27 -0
  182. package/types/hooks/useMedia.d.ts +3 -1
  183. package/types/hooks/useMedia.test.d.ts +1 -0
  184. package/types/hooks/usePressablePressResponder.d.ts +84 -0
  185. package/types/index.d.ts +1 -11
  186. package/types/static.d.ts +0 -1
  187. package/types/types.d.ts +42 -44
  188. package/types/views/AbsoluteFill.d.ts +5 -0
  189. package/types/views/AbsoluteFill.native.d.ts +3 -0
  190. package/types/views/Stack.d.ts +1 -1
  191. package/types/views/Text.d.ts +1 -1
  192. package/dist/cjs/constants/platform.js +0 -74
  193. package/dist/cjs/constants/platform.js.map +0 -7
  194. package/dist/cjs/constants/platform.native.js +0 -62
  195. package/dist/cjs/constants/platform.native.js.map +0 -7
  196. package/dist/cjs/helpers/createShallowUpdate.js.map +0 -7
  197. package/dist/cjs/helpers/validate.js +0 -2
  198. package/dist/cjs/hooks/useDidFinishSSR.js +0 -60
  199. package/dist/cjs/hooks/useDidFinishSSR.js.map +0 -7
  200. package/dist/cjs/hooks/useIsSSR.js.map +0 -7
  201. package/dist/esm/constants/platform.js +0 -39
  202. package/dist/esm/constants/platform.js.map +0 -7
  203. package/dist/esm/constants/platform.native.js +0 -28
  204. package/dist/esm/constants/platform.native.js.map +0 -7
  205. package/dist/esm/helpers/createShallowUpdate.js +0 -20
  206. package/dist/esm/helpers/createShallowUpdate.js.map +0 -7
  207. package/dist/esm/helpers/validate.js +0 -1
  208. package/dist/esm/hooks/useDidFinishSSR.js +0 -35
  209. package/dist/esm/hooks/useDidFinishSSR.js.map +0 -7
  210. package/dist/esm/hooks/useIsSSR.js +0 -22
  211. package/dist/esm/hooks/useIsSSR.js.map +0 -7
  212. package/src/helpers/assignNativePropsToWeb.tsx +0 -178
  213. package/src/helpers/calc.ts +0 -68
  214. package/src/helpers/getFont.tsx +0 -43
  215. package/src/helpers/getStackSize.ts +0 -22
  216. package/src/helpers/startTransition.ts +0 -4
  217. package/src/hooks/useConstant.tsx +0 -19
  218. package/src/hooks/useIsMounted.ts +0 -16
  219. package/src/hooks/usePressable.tsx +0 -9
  220. package/src/hooks/useUnmountEffect.ts +0 -5
@@ -15,7 +15,6 @@ import {
15
15
  } from '../helpers/ThemeManager'
16
16
  import { ThemeName, ThemeParsed } from '../types'
17
17
  import { GetThemeUnwrapped } from './getThemeUnwrapped'
18
- import { useConstant } from './useConstant'
19
18
  import { useServerRef } from './useServerHooks'
20
19
 
21
20
  export interface ThemeProps {
@@ -207,7 +206,7 @@ export const useChangeThemeEffect = (
207
206
  if (process.env.NODE_ENV === 'development') {
208
207
  if (!config) {
209
208
  throw new Error(
210
- `Missing tamagui config, you either have a duplicate config, or haven't set it up. Be sure createTamagui is called before renderig.`
209
+ `Missing tamagui config, you either have a duplicate config, or haven't set it up. Be sure createTamagui is called before rendering.`
211
210
  )
212
211
  }
213
212
  }
@@ -243,9 +242,10 @@ export const useChangeThemeEffect = (
243
242
  // eslint-disable-next-line react-hooks/rules-of-hooks
244
243
  const forceUpdate = forceUpdateProp || useForceUpdate()
245
244
 
246
- const themeManager = useConstant(() => {
245
+ const themeManager = useMemo(() => {
247
246
  return new ThemeManager(next.name, next.className, next.theme, parentManager, reset)
248
- })
247
+ // eslint-disable-next-line react-hooks/exhaustive-deps
248
+ }, [])
249
249
 
250
250
  // not concurrent safe but fixes native (but breaks SSR and not needed on web (i think) so leave only on native)
251
251
  let didChange = false
package/src/index.ts CHANGED
@@ -18,11 +18,8 @@ export type { RNWTextProps, RNWViewProps } from './types-rnw'
18
18
  export { getHasConfigured, getConfig, getThemes, getTokens, onConfiguredOnce } from './config'
19
19
 
20
20
  export * from './constants/constants'
21
- export { createDOMProps } from '@tamagui/rnw'
22
21
 
23
- export * from './helpers/calc'
24
22
  export * from './helpers/useShallowSetState'
25
- export * from './helpers/getStackSize'
26
23
  export * from './helpers/getVariantExtras'
27
24
  export * from './helpers/getAnimationDriver'
28
25
  export * from './helpers/getExpandedShorthands'
@@ -32,20 +29,15 @@ export * from './helpers/getStylesAtomic'
32
29
  export * from './helpers/pseudoDescriptors'
33
30
  export * from './helpers/mergeProps'
34
31
  export * from './helpers/expandStyles'
35
- export * from './helpers/getFont'
36
- export * from './helpers/isObj'
37
32
  export * from './helpers/isTamaguiElement'
38
33
  export * from './helpers/isTamaguiComponent'
39
34
  export * from './helpers/matchMedia'
40
- export * from './helpers/startTransition'
41
35
  export * from './helpers/themeable'
42
36
  export * from './helpers/withStaticProperties'
43
37
 
44
38
  export * from './contexts/ButtonInsideButtonContext'
45
39
 
46
- export * from './hooks/useConstant'
47
40
  export * from './hooks/useId'
48
- export * from './hooks/useIsMounted'
49
41
  export * from './hooks/useIsTouchDevice'
50
42
 
51
43
  export {
@@ -59,15 +51,13 @@ export {
59
51
  removeMediaQueryListener,
60
52
  mediaQueryConfig,
61
53
  } from './hooks/useMedia'
62
- export * from './hooks/usePressable'
63
54
  export * from './hooks/useTheme'
64
- export * from './hooks/useUnmountEffect'
65
55
  export * from './hooks/useSafeRef'
66
56
 
67
57
  export * from './views/Slot'
68
58
  export * from './views/Stack'
69
59
  export * from './views/Text'
70
- export { TextAncestorProvider, TextAncestorContext } from './contexts/TextAncestorContext'
60
+ export * from './contexts/TextAncestorContext'
71
61
  export * from './views/Theme'
72
62
  export * from './views/ThemeInverse'
73
63
  export * from './views/ThemeProvider'
package/src/static.ts CHANGED
@@ -1,15 +1,5 @@
1
1
  // only stuff that gets extracted or needed by tamagui-static
2
-
3
2
  export * from './index'
4
3
 
5
4
  // for static
6
-
7
- export {
8
- createDOMProps,
9
- useElementLayout,
10
- useMergeRefs,
11
- usePlatformMethods,
12
- useResponderEvents,
13
- } from '@tamagui/rnw'
14
-
15
5
  export * from './helpers/proxyThemeVariables'
package/src/styled.tsx CHANGED
@@ -1,8 +1,5 @@
1
- import { Image, Text, TextInput } from 'react-native'
2
-
1
+ import { getConfig } from './config'
3
2
  import { createComponent } from './createComponent'
4
- import { TamaguiReactElement, isTamaguiElement } from './helpers/isTamaguiElement'
5
- import { RNComponents } from './helpers/RNComponents'
6
3
  import {
7
4
  GetProps,
8
5
  GetVariantValues,
@@ -52,12 +49,14 @@ export function styled<
52
49
  },
53
50
  staticExtractionOptions?: Partial<StaticConfig>
54
51
  ) {
55
- // * excessively deep type instantiation
56
- // if (isTamaguiElement(Component)) {
52
+ // allows passing styled(<H1 bc="red" />)
53
+ // but to get types right would be tricky
54
+ // if (isValidElement(Component) && isTamaguiComponent(Component.type)) {
57
55
  // const props = Component.props
58
- // // @ts-ignore
59
- // Component = Component.type
60
- // options = options ? { ...props, ...options } : props
56
+ // if (props && typeof props === 'object') {
57
+ // Component = Component.type as any
58
+ // options = options ? ({ ...props, ...options } as any) : props
59
+ // }
61
60
  // }
62
61
 
63
62
  const staticConfigProps = (() => {
@@ -84,31 +83,15 @@ export function styled<
84
83
  if (defaultVariants) {
85
84
  Object.assign(defaultProps, defaultVariants)
86
85
  }
87
- let isReactNativeWeb = parentStaticConfig?.isReactNativeWeb || RNComponents.has(Component)
88
- // this can happen due to smart-ness in fake-react-native, rough heuristic here to ensure we match (could be better..)
89
- if (!('staticConfig' in Component) && !isReactNativeWeb) {
90
- if (RNComponents.has(Component['displayName'])) {
91
- RNComponents.add(Component)
92
- isReactNativeWeb = true
93
- } else {
94
- // assuming some sort of non-tamagui non-rn view, will always use style={}
95
- }
96
- }
86
+ const isReactNativeWeb = Boolean(
87
+ parentStaticConfig?.isReactNativeWeb || staticExtractionOptions?.isReactNativeWeb
88
+ )
97
89
  const reactNativeWebComponent = isReactNativeWeb
98
90
  ? parentStaticConfig?.reactNativeWebComponent || Component
99
91
  : null
100
92
  const isTamagui = !isReactNativeWeb && !!parentStaticConfig
101
93
  const Comp = reactNativeWebComponent || (Component as any)
102
- const isImage = Boolean(
103
- staticExtractionOptions?.isImage || parentStaticConfig?.isImage || Comp === Image
104
- )
105
- const isInput = Boolean(
106
- staticExtractionOptions?.isInput || parentStaticConfig?.isInput || Comp === TextInput
107
- )
108
- const isText = Boolean(
109
- isInput || staticExtractionOptions?.isText || parentStaticConfig?.isText || Comp === Text
110
- )
111
-
94
+ const isText = Boolean(staticExtractionOptions?.isText || parentStaticConfig?.isText)
112
95
  const acceptsClassName = acceptsClassNameProp ?? (isTamagui || isReactNativeWeb)
113
96
 
114
97
  const conf: Partial<StaticConfig> = {
@@ -116,7 +99,6 @@ export function styled<
116
99
  ...(!isTamagui && {
117
100
  Component: Comp,
118
101
  }),
119
- isTamagui,
120
102
  // this type gets messed up by options?: Partial<GetProps<ParentComponent>> above
121
103
  // take away the Partial<> and it's fine
122
104
  variants,
@@ -126,9 +108,7 @@ export function styled<
126
108
  isReactNativeWeb,
127
109
  // for nesting multiple levels of rnw styled() need keep use the OG component
128
110
  reactNativeWebComponent,
129
- isInput,
130
111
  isText,
131
- isImage,
132
112
  acceptsClassName,
133
113
  }
134
114
 
@@ -170,12 +150,14 @@ export function styled<
170
150
  // add in pseudos
171
151
  PseudoProps<Partial<OurPropsBase>>
172
152
 
173
- return component as TamaguiComponent<
153
+ type StyledComponent = TamaguiComponent<
174
154
  Props,
175
155
  TamaguiElement,
176
156
  ParentPropsBase,
177
157
  ParentVariants & OurVariants
178
158
  >
159
+
160
+ return component as StyledComponent
179
161
  }
180
162
 
181
163
  // import { Stack } from './views/Stack'
package/src/types.tsx CHANGED
@@ -1,8 +1,6 @@
1
1
  // TODO split this into own package @tamagui/types to share with animations packages
2
2
 
3
- import { Properties } from 'csstype'
4
- import React, { RefObject } from 'react'
5
- import {
3
+ import type {
6
4
  GestureResponderEvent,
7
5
  Image,
8
6
  PressableProps,
@@ -13,14 +11,23 @@ import {
13
11
  View,
14
12
  ViewProps,
15
13
  ViewStyle,
16
- } from 'react-native'
17
-
18
- import { Variable } from './createVariable'
19
- import { ResolveVariableTypes } from './helpers/createPropMapper'
20
- import { TamaguiReactElement } from './static'
21
- import { RNWTextProps, RNWViewProps } from './types-rnw'
22
- import { FontLanguageProps } from './views/FontLanguage.types'
23
- import { ThemeProviderProps } from './views/ThemeProvider'
14
+ } from '@tamagui/types-react-native'
15
+ import type { Properties } from 'csstype'
16
+ import type {
17
+ Component,
18
+ ForwardRefExoticComponent,
19
+ FunctionComponent,
20
+ ReactNode,
21
+ RefAttributes,
22
+ RefObject,
23
+ } from 'react'
24
+
25
+ import type { Variable } from './createVariable'
26
+ import type { ResolveVariableTypes } from './helpers/createPropMapper'
27
+ import type { TamaguiReactElement } from './static'
28
+ import type { RNWTextProps, RNWViewProps } from './types-rnw'
29
+ import type { FontLanguageProps } from './views/FontLanguage.types'
30
+ import type { ThemeProviderProps } from './views/ThemeProvider'
24
31
 
25
32
  export type SpaceDirection = 'vertical' | 'horizontal' | 'both'
26
33
 
@@ -35,7 +42,7 @@ export type TamaguiComponentPropsBase = {
35
42
  asChild?: boolean
36
43
  space?: SpaceTokens | null
37
44
  spaceDirection?: SpaceDirection
38
- separator?: React.ReactNode
45
+ separator?: ReactNode
39
46
  dangerouslySetInnerHTML?: { __html: string }
40
47
  animation?: AnimationProp
41
48
  animateOnly?: string[]
@@ -63,8 +70,8 @@ export type TamaguiComponentPropsBase = {
63
70
  onMouseDown?: (e: MouseEvent) => any
64
71
  }
65
72
 
66
- export type ReactComponentWithRef<Props, Ref> = React.ForwardRefExoticComponent<
67
- Props & React.RefAttributes<Ref>
73
+ export type ReactComponentWithRef<Props, Ref> = ForwardRefExoticComponent<
74
+ Props & RefAttributes<Ref>
68
75
  >
69
76
 
70
77
  export type ConfigListener = (conf: TamaguiInternalConfig) => void
@@ -275,6 +282,7 @@ export type SpacerProps = Omit<StackProps, 'flex' | 'direction' | 'size'> &
275
282
  SpacerOwnProps
276
283
 
277
284
  export type CreateTamaguiProps = {
285
+ reactNative?: any
278
286
  shorthands?: CreateShorthands
279
287
  media?: GenericTamaguiConfig['media']
280
288
  animations?: AnimationDriver<any>
@@ -357,6 +365,7 @@ export type TamaguiInternalConfig<
357
365
  getCSS: () => string
358
366
  parsed: boolean
359
367
  inverseShorthands: Record<string, string>
368
+ reactNative?: any
360
369
  }
361
370
 
362
371
  export type GetAnimationKeys<A extends GenericTamaguiConfig> = keyof A['animations']
@@ -364,7 +373,7 @@ export type GetAnimationKeys<A extends GenericTamaguiConfig> = keyof A['animatio
364
373
  // prevents const intersections from being clobbered into string, keeping the consts
365
374
  export type UnionableString = string & {}
366
375
  export type UnionableNumber = number & {}
367
- export type PropTypes<A extends TamaguiComponent> = A extends React.FunctionComponent<infer Props>
376
+ export type PropTypes<A extends TamaguiComponent> = A extends FunctionComponent<infer Props>
368
377
  ? Props
369
378
  : unknown
370
379
 
@@ -671,7 +680,7 @@ type StaticComponentObject = {
671
680
  export type TamaguiProviderProps = Partial<Omit<ThemeProviderProps, 'children'>> & {
672
681
  config: TamaguiInternalConfig
673
682
  disableInjectCSS?: boolean
674
- children?: React.ReactNode
683
+ children?: ReactNode
675
684
  }
676
685
 
677
686
  export type PropMapper = (
@@ -705,16 +714,7 @@ export type GenericVariantDefinitions = {
705
714
  }
706
715
  }
707
716
 
708
- export type StaticConfig = {
709
- Component?: React.FunctionComponent<any> & StaticComponentObject
710
-
711
- variants?: GenericVariantDefinitions
712
-
713
- /**
714
- * Used for applying sub theme style
715
- */
716
- componentName?: string
717
-
717
+ export type StaticConfigPublic = {
718
718
  /**
719
719
  * (compiler) If you need to pass context or something, prevents from ever
720
720
  * flattening. The 'jsx' option means it will never flatten. if you
@@ -727,26 +727,11 @@ export type StaticConfig = {
727
727
  */
728
728
  isText?: boolean
729
729
 
730
- /**
731
- * Attempts to attach focus styles at runtime (useful for native)
732
- */
733
- isInput?: boolean
734
-
735
- /**
736
- * React native web images need special handling for className support
737
- */
738
- isImage?: boolean
739
-
740
730
  /**
741
731
  * Which style keys are allowed to be extracted.
742
732
  */
743
733
  validStyles?: { [key: string]: boolean }
744
734
 
745
- /**
746
- * Same as React.defaultProps, be sure to sync
747
- */
748
- defaultProps: Record<string, any>
749
-
750
735
  /**
751
736
  * (compiler) If these props are encountered, bail on all optimization.
752
737
  */
@@ -777,14 +762,37 @@ export type StaticConfig = {
777
762
  isZStack?: boolean
778
763
 
779
764
  /**
780
- * Merges into defaultProps later on, used internally yonly
765
+ * Auto-detect, but can override, passes styles properly to react-native-web
781
766
  */
782
- defaultVariants?: { [key: string]: any }
767
+ isReactNativeWeb?: boolean
768
+
769
+ /**
770
+ * By default if styled() doesn't recognize a parent Tamagui compoent or specific react-native views,
771
+ * it will assume the passed in component only accepts style={} for react-native compatibility.
772
+ * Setting `acceptsClassName: true` indicates Tamagui can pass in className props.
773
+ */
774
+ acceptsClassName?: boolean
775
+ }
776
+
777
+ export type StaticConfig = StaticConfigPublic & {
778
+ Component?: FunctionComponent<any> & StaticComponentObject
779
+
780
+ variants?: GenericVariantDefinitions
783
781
 
784
782
  /**
785
- * Auto-detect, but can ovverride, passes styles properly to react-native-web
783
+ * Used for applying sub theme style
786
784
  */
787
- isReactNativeWeb?: boolean
785
+ componentName?: string
786
+
787
+ /**
788
+ * Same as React.defaultProps, be sure to sync
789
+ */
790
+ defaultProps: Record<string, any>
791
+
792
+ /**
793
+ * Merges into defaultProps later on, used internally yonly
794
+ */
795
+ defaultVariants?: { [key: string]: any }
788
796
 
789
797
  /**
790
798
  * Used internally to keep reference to the original rnw component
@@ -796,11 +804,6 @@ export type StaticConfig = {
796
804
  */
797
805
  memo?: boolean
798
806
 
799
- /**
800
- * Auto-detect, but can ovverride, passes styles properly to react-native-web
801
- */
802
- isTamagui?: boolean
803
-
804
807
  /**
805
808
  * Used internally to handle extractable HoC separate
806
809
  */
@@ -829,8 +832,8 @@ export type StylableComponent =
829
832
  | TamaguiComponent
830
833
  // * excessively deep type instantiation
831
834
  // | TamaguiReactElement
832
- | React.Component
833
- | React.ForwardRefExoticComponent<any>
835
+ | Component
836
+ | ForwardRefExoticComponent<any>
834
837
  | ReactComponentWithRef<any, any>
835
838
  | (new (props: any) => any)
836
839
  | typeof View
@@ -859,7 +862,7 @@ export type GetProps<A extends StylableComponent> = A extends TamaguiComponent<i
859
862
  ? Props
860
863
  : A extends TamaguiReactElement<infer Props>
861
864
  ? Props
862
- : A extends React.Component<infer Props>
865
+ : A extends Component<infer Props>
863
866
  ? GetGenericComponentTamaguiProps<Props>
864
867
  : A extends new (props: infer Props) => any
865
868
  ? GetGenericComponentTamaguiProps<Props>
@@ -1275,13 +1278,13 @@ export type UniversalAnimatedNumber<A> = {
1275
1278
  }
1276
1279
 
1277
1280
  export type AnimationDriver<A extends AnimationConfig = AnimationConfig> = {
1278
- avoidClasses?: boolean
1281
+ isReactNativeWeb?: boolean
1279
1282
  useAnimations: UseAnimationHook
1280
1283
  useAnimatedNumber: (initial: number) => UniversalAnimatedNumber<any>
1281
1284
  useAnimatedNumberStyle: <V extends UniversalAnimatedNumber<any>>(
1282
1285
  val: V,
1283
1286
  getStyle: (current: any) => any
1284
- ) => void
1287
+ ) => any
1285
1288
  useAnimatedNumberReaction: (
1286
1289
  val: UniversalAnimatedNumber<any>,
1287
1290
  onValue: (current: number) => void
@@ -4,6 +4,7 @@ import { FontLanguageContext } from '../contexts/FontLanguageContext'
4
4
  import { FontLanguageProps } from './FontLanguage.types'
5
5
 
6
6
  export const FontLanguage = ({ children, ...props }: FontLanguageProps) => {
7
+ // eslint-disable-next-line react-hooks/exhaustive-deps
7
8
  const value = useMemo(() => props, [JSON.stringify(props)])
8
9
  return <FontLanguageContext.Provider value={value}>{children}</FontLanguageContext.Provider>
9
10
  }
@@ -1,4 +1,4 @@
1
- import { View } from 'react-native'
1
+ import type { View } from '@tamagui/types-react-native'
2
2
 
3
3
  import { stackDefaultStyles } from '../constants/constants'
4
4
  import { createComponent } from '../createComponent'
@@ -2,8 +2,8 @@ import { isClient, isRSC, isServer } from '@tamagui/constants'
2
2
  import * as React from 'react'
3
3
 
4
4
  import { ButtonInsideButtonContext } from '../contexts/ButtonInsideButtonContext'
5
- import { TextAncestorProvider } from '../contexts/TextAncestorContext'
6
- import { useMediaQueryListeners } from '../hooks/useMedia'
5
+ import { TextAncestorContext } from '../contexts/TextAncestorContext'
6
+ import { useMediaListeners } from '../hooks/useMedia'
7
7
  import type { TamaguiProviderProps } from '../types'
8
8
  import { ThemeProvider } from './ThemeProvider'
9
9
 
@@ -22,7 +22,7 @@ export function TamaguiProvider({
22
22
  }
23
23
 
24
24
  if (!isServer) {
25
- useMediaQueryListeners(config)
25
+ useMediaListeners(config)
26
26
  }
27
27
 
28
28
  if (isClient) {
@@ -41,7 +41,7 @@ export function TamaguiProvider({
41
41
 
42
42
  return (
43
43
  <ButtonInsideButtonContext.Provider value={false}>
44
- <TextAncestorProvider>
44
+ <TextAncestorContext.Provider value={false}>
45
45
  <ThemeProvider
46
46
  defaultTheme={config.defaultTheme || 'light'}
47
47
  themeClassNameOnRoot={config.themeClassNameOnRoot}
@@ -50,7 +50,7 @@ export function TamaguiProvider({
50
50
  >
51
51
  {children}
52
52
  </ThemeProvider>
53
- </TextAncestorProvider>
53
+ </TextAncestorContext.Provider>
54
54
  </ButtonInsideButtonContext.Provider>
55
55
  )
56
56
  }
@@ -1,6 +1,6 @@
1
1
  import { isWeb } from '@tamagui/constants'
2
2
  import { stylePropsTextOnly, validStyles } from '@tamagui/helpers'
3
- import { Text as TextView } from 'react-native'
3
+ import type { Text as TextView } from '@tamagui/types-react-native'
4
4
 
5
5
  import { createComponent } from '../createComponent'
6
6
  import { TextProps, TextPropsBase } from '../types'
@@ -1,4 +1,4 @@
1
- import { isClient, isWeb } from '@tamagui/constants'
1
+ import { isClient } from '@tamagui/constants'
2
2
  import React, { useContext, useLayoutEffect, useState } from 'react'
3
3
 
4
4
  import { ThemeManagerContext } from '../helpers/ThemeManager'
@@ -9,7 +9,7 @@ React['createElement']
9
9
 
10
10
  // resets the theme to the parent theme
11
11
  export const ThemeReset = (props: { children?: any }) => {
12
- const themeManager = useContext(ThemeManagerContext)
12
+ const manager = useContext(ThemeManagerContext)
13
13
  const [name, setName] = useState<string | null>(null)
14
14
 
15
15
  // this component doesn't work with SSR, so must run only client side
@@ -17,21 +17,21 @@ export const ThemeReset = (props: { children?: any }) => {
17
17
  // that changes to dark initially also go through and change all of these
18
18
  if (isClient) {
19
19
  useLayoutEffect(() => {
20
- if (!themeManager) return
21
- if (name !== themeManager.parentName) {
22
- setName(themeManager.parentName)
20
+ if (!manager) return
21
+ if (name !== manager.parentName) {
22
+ setName(manager.parentName)
23
23
  }
24
- }, [name, themeManager, themeManager?.parentName])
24
+ }, [name, manager, manager?.parentName])
25
25
 
26
26
  useLayoutEffect(() => {
27
- if (!themeManager) return
28
- return themeManager.onChangeTheme(() => {
29
- setName(themeManager.parentName)
27
+ if (!manager) return
28
+ return manager.onChangeTheme(() => {
29
+ setName(manager.parentName)
30
30
  })
31
- }, [themeManager])
31
+ }, [manager])
32
32
  }
33
33
 
34
- if (!themeManager || !props.children) {
34
+ if (!manager || !props.children) {
35
35
  return props.children || null
36
36
  }
37
37
 
@@ -1,8 +1,10 @@
1
1
  import * as Helpers from '@tamagui/helpers';
2
- import * as rnw from '@tamagui/rnw';
3
2
  declare class TamaguiManager {
4
- rnw: typeof rnw;
5
3
  Helpers: typeof Helpers;
4
+ get mediaState(): {
5
+ [x: `$${string}`]: boolean;
6
+ [x: `$${number}`]: boolean;
7
+ };
6
8
  get config(): import("./types").TamaguiInternalConfig<import("./types").CreateTokens<import("./types").VariableVal>, {
7
9
  [key: string]: Partial<import("./types").TamaguiBaseTheme> & {
8
10
  [key: string]: import("./types").VariableVal;
@@ -16,8 +18,8 @@ declare class TamaguiManager {
16
18
  [key: string]: any;
17
19
  };
18
20
  }, import("./types").GenericFonts>;
19
- get insertedRules(): unknown[];
20
- get allSelectors(): {};
21
+ get insertedRules(): (boolean | string[])[];
22
+ get allSelectors(): Record<string, string>;
21
23
  get allTransforms(): {};
22
24
  get identifierToValue(): Map<string, any>;
23
25
  }
@@ -1,9 +1,20 @@
1
1
  export declare const THEME_NAME_SEPARATOR = "_";
2
2
  export declare const THEME_CLASSNAME_PREFIX = "t_";
3
+ export declare const webOnlyDefaultStyles: {
4
+ display: string;
5
+ flexBasis: string;
6
+ boxSizing: string;
7
+ position: string;
8
+ minHeight: number;
9
+ minWidth: number;
10
+ };
3
11
  export declare const stackDefaultStyles: {
4
- display?: string | undefined;
5
- flexBasis?: string | undefined;
6
- boxSizing?: string | undefined;
12
+ display: string;
13
+ flexBasis: string;
14
+ boxSizing: string;
15
+ position: string;
16
+ minHeight: number;
17
+ minWidth: number;
7
18
  alignItems: string;
8
19
  flexShrink: number;
9
20
  };
@@ -1,5 +1,3 @@
1
1
  import React from 'react';
2
- export declare const FallbackNativeContext: React.Context<boolean>;
3
- export declare const TextAncestorContext: any;
4
- export declare const TextAncestorProvider: (props: any) => JSX.Element;
2
+ export declare const TextAncestorContext: React.Context<boolean>;
5
3
  //# sourceMappingURL=TextAncestorContext.d.ts.map
@@ -18,19 +18,4 @@ export declare type SpacedChildrenProps = {
18
18
  separator?: React.ReactNode;
19
19
  };
20
20
  export declare function spacedChildren({ isZStack, children, space, direction, spaceFlex, separator, }: SpacedChildrenProps): React.ReactNode;
21
- export declare function processIDRefList(idRefList: string | Array<string>): string;
22
- export declare const accessibilityRoleToWebRole: {
23
- adjustable: string;
24
- button: string;
25
- header: string;
26
- image: string;
27
- imagebutton: null;
28
- keyboardkey: null;
29
- label: null;
30
- link: string;
31
- none: string;
32
- search: string;
33
- summary: string;
34
- text: null;
35
- };
36
21
  //# sourceMappingURL=createComponent.d.ts.map
@@ -34,11 +34,10 @@ export declare class ThemeManager {
34
34
  theme: ThemeParsed | null;
35
35
  className: string | undefined;
36
36
  };
37
- getClassName(name: string): string;
37
+ getCN(name: string): string;
38
38
  track(uuid: any, keys: Set<string>): void;
39
- notifyListeners(): void;
39
+ notify(): void;
40
40
  onChangeTheme(cb: ThemeListener): () => void;
41
- onUpdate(uuid: any, cb: Function): () => void;
42
41
  }
43
42
  export declare const ThemeManagerContext: import("react").Context<ThemeManager | null>;
44
43
  export declare const emptyManager: ThemeManager;
@@ -0,0 +1,12 @@
1
+ declare type Value = Object | Array<any> | string | number;
2
+ export declare type Style = {
3
+ [key: string]: Value;
4
+ };
5
+ declare class Cache {
6
+ v: Record<string, any>;
7
+ get(key: string, valStr: string): any;
8
+ set(key: string, valStr: string, object: any): void;
9
+ }
10
+ export declare const cache: Cache;
11
+ export {};
12
+ //# sourceMappingURL=cache.d.ts.map
@@ -1,17 +1 @@
1
- import { FontLineHeightTokens, FontSizeTokens, SizeTokens, SpaceTokens } from '../types';
2
- /**
3
- * Simple calc() that handles native + web
4
- * on web: outputs a calc() string
5
- * on native: outputs a plain number
6
- */
7
- export declare type CalcVal = string | number | SizeTokens | SpaceTokens | FontSizeTokens | FontLineHeightTokens;
8
- declare const operators: {
9
- '+': (a: number, b: number) => number;
10
- '-': (a: number, b: number) => number;
11
- '/': (a: number, b: number) => number;
12
- '*': (a: number, b: number) => number;
13
- };
14
- declare type Operator = keyof typeof operators;
15
- export declare const calc: (...valuesAndOperators: (CalcVal | Operator)[]) => string | number;
16
- export {};
17
1
  //# sourceMappingURL=calc.d.ts.map
@@ -2,5 +2,5 @@ import { StyleObject } from '@tamagui/helpers';
2
2
  import { MediaQueries } from '../types';
3
3
  import { PartialStyleObject } from './insertStyleRule';
4
4
  export declare const MEDIA_SEP = "_";
5
- export declare const createMediaStyle: ({ property, identifier, rules }: StyleObject, mediaKey: string, mediaQueries: MediaQueries, negate?: boolean, importance?: number) => PartialStyleObject;
5
+ export declare const createMediaStyle: ({ property, identifier, rules }: StyleObject, mediaKey: string, mediaQueries: MediaQueries, negate?: boolean) => PartialStyleObject;
6
6
  //# sourceMappingURL=createMediaStyle.d.ts.map