@hanzogui/web 7.0.0 → 7.3.0

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 (246) hide show
  1. package/LICENSE +40 -19
  2. package/dist/cjs/_withStableStyle.cjs +1 -1
  3. package/dist/cjs/_withStableStyle.native.js +1 -1
  4. package/dist/cjs/config.cjs +2 -2
  5. package/dist/cjs/config.native.js +2 -2
  6. package/dist/cjs/config.native.js.map +1 -1
  7. package/dist/cjs/constants/constants.cjs +3 -3
  8. package/dist/cjs/constants/constants.native.js +3 -3
  9. package/dist/cjs/createComponent.cjs +307 -530
  10. package/dist/cjs/createComponent.native.js +265 -588
  11. package/dist/cjs/createComponent.native.js.map +1 -1
  12. package/dist/cjs/createGui.cjs +19 -48
  13. package/dist/cjs/createGui.native.js +22 -65
  14. package/dist/cjs/createGui.native.js.map +1 -1
  15. package/dist/cjs/eventHandling.native.js +19 -9
  16. package/dist/cjs/eventHandling.native.js.map +1 -1
  17. package/dist/cjs/helpers/createDesignSystem.cjs +22 -36
  18. package/dist/cjs/helpers/createDesignSystem.native.js +19 -91
  19. package/dist/cjs/helpers/createDesignSystem.native.js.map +1 -1
  20. package/dist/cjs/helpers/defaultAnimationDriver.cjs +1 -1
  21. package/dist/cjs/helpers/defaultAnimationDriver.native.js +1 -1
  22. package/dist/cjs/helpers/expandStyle.cjs +11 -74
  23. package/dist/cjs/helpers/expandStyle.native.js +29 -81
  24. package/dist/cjs/helpers/expandStyle.native.js.map +1 -1
  25. package/dist/cjs/helpers/expandStyles.cjs +2 -15
  26. package/dist/cjs/helpers/expandStyles.native.js +7 -13
  27. package/dist/cjs/helpers/expandStyles.native.js.map +1 -1
  28. package/dist/cjs/helpers/getSplitStyles.cjs +233 -557
  29. package/dist/cjs/helpers/getSplitStyles.native.js +204 -659
  30. package/dist/cjs/helpers/getSplitStyles.native.js.map +1 -1
  31. package/dist/cjs/helpers/getThemeCSSRules.cjs +8 -16
  32. package/dist/cjs/helpers/getTokenForKey.cjs +32 -54
  33. package/dist/cjs/helpers/getTokenForKey.native.js +40 -59
  34. package/dist/cjs/helpers/getTokenForKey.native.js.map +1 -1
  35. package/dist/cjs/helpers/insertStyleRule.cjs +27 -79
  36. package/dist/cjs/helpers/insertStyleRule.native.js +16 -335
  37. package/dist/cjs/helpers/insertStyleRule.native.js.map +1 -1
  38. package/dist/cjs/helpers/isActivePlatform.cjs +2 -17
  39. package/dist/cjs/helpers/isActivePlatform.native.js +2 -17
  40. package/dist/cjs/helpers/isActivePlatform.native.js.map +1 -1
  41. package/dist/cjs/helpers/log.cjs +1 -4
  42. package/dist/cjs/helpers/log.native.js +1 -6
  43. package/dist/cjs/helpers/log.native.js.map +1 -1
  44. package/dist/cjs/helpers/propMapper.cjs +37 -110
  45. package/dist/cjs/helpers/propMapper.native.js +54 -131
  46. package/dist/cjs/helpers/propMapper.native.js.map +1 -1
  47. package/dist/cjs/helpers/skipProps.cjs +3 -11
  48. package/dist/cjs/helpers/skipProps.native.js +3 -11
  49. package/dist/cjs/helpers/skipProps.native.js.map +1 -1
  50. package/dist/cjs/helpers/useRenderElement.cjs +7 -18
  51. package/dist/cjs/helpers/useRenderElement.native.js +7 -15
  52. package/dist/cjs/helpers/useRenderElement.native.js.map +1 -1
  53. package/dist/cjs/helpers/wrapStyleTags.cjs +11 -15
  54. package/dist/cjs/helpers/wrapStyleTags.native.js +3 -22
  55. package/dist/cjs/helpers/wrapStyleTags.native.js.map +1 -1
  56. package/dist/cjs/hooks/getThemeProxied.cjs +10 -54
  57. package/dist/cjs/hooks/getThemeProxied.native.js +27 -48
  58. package/dist/cjs/hooks/getThemeProxied.native.js.map +1 -1
  59. package/dist/cjs/hooks/useTheme.cjs +2 -2
  60. package/dist/cjs/hooks/useTheme.native.js +2 -2
  61. package/dist/cjs/hooks/useTheme.native.js.map +1 -1
  62. package/dist/cjs/hooks/useThemeState.cjs +66 -124
  63. package/dist/cjs/hooks/useThemeState.native.js +64 -142
  64. package/dist/cjs/hooks/useThemeState.native.js.map +1 -1
  65. package/dist/cjs/insertFont.cjs +6 -15
  66. package/dist/cjs/insertFont.native.js +7 -23
  67. package/dist/cjs/insertFont.native.js.map +1 -1
  68. package/dist/cjs/setupReactNative.cjs +4 -24
  69. package/dist/cjs/setupReactNative.native.js +5 -26
  70. package/dist/cjs/setupReactNative.native.js.map +1 -1
  71. package/dist/cjs/views/GuiProvider.cjs +4 -6
  72. package/dist/cjs/views/GuiProvider.native.js +5 -7
  73. package/dist/cjs/views/GuiProvider.native.js.map +1 -1
  74. package/dist/cjs/views/Text.cjs +11 -18
  75. package/dist/cjs/views/Text.native.js +6 -14
  76. package/dist/cjs/views/Text.native.js.map +1 -1
  77. package/dist/cjs/views/ThemeProvider.cjs +9 -11
  78. package/dist/cjs/views/ThemeProvider.native.js +3 -16
  79. package/dist/cjs/views/ThemeProvider.native.js.map +1 -1
  80. package/dist/cjs/views/View.native.js.map +1 -1
  81. package/dist/esm/_withStableStyle.mjs +1 -1
  82. package/dist/esm/_withStableStyle.mjs.map +1 -1
  83. package/dist/esm/_withStableStyle.native.js +1 -1
  84. package/dist/esm/config.mjs +2 -2
  85. package/dist/esm/config.mjs.map +1 -1
  86. package/dist/esm/config.native.js +2 -2
  87. package/dist/esm/config.native.js.map +1 -1
  88. package/dist/esm/constants/constants.mjs +3 -3
  89. package/dist/esm/constants/constants.native.js +3 -3
  90. package/dist/esm/createComponent.mjs +311 -536
  91. package/dist/esm/createComponent.mjs.map +1 -1
  92. package/dist/esm/createComponent.native.js +265 -591
  93. package/dist/esm/createComponent.native.js.map +1 -1
  94. package/dist/esm/createGui.mjs +20 -51
  95. package/dist/esm/createGui.mjs.map +1 -1
  96. package/dist/esm/createGui.native.js +24 -70
  97. package/dist/esm/createGui.native.js.map +1 -1
  98. package/dist/esm/createVariables.mjs.map +1 -1
  99. package/dist/esm/createVariables.native.js.map +1 -1
  100. package/dist/esm/eventHandling.native.js +19 -9
  101. package/dist/esm/eventHandling.native.js.map +1 -1
  102. package/dist/esm/helpers/createDesignSystem.mjs +22 -36
  103. package/dist/esm/helpers/createDesignSystem.mjs.map +1 -1
  104. package/dist/esm/helpers/createDesignSystem.native.js +18 -90
  105. package/dist/esm/helpers/createDesignSystem.native.js.map +1 -1
  106. package/dist/esm/helpers/defaultAnimationDriver.mjs +1 -1
  107. package/dist/esm/helpers/defaultAnimationDriver.mjs.map +1 -1
  108. package/dist/esm/helpers/defaultAnimationDriver.native.js +1 -1
  109. package/dist/esm/helpers/expandStyle.mjs +12 -73
  110. package/dist/esm/helpers/expandStyle.mjs.map +1 -1
  111. package/dist/esm/helpers/expandStyle.native.js +28 -80
  112. package/dist/esm/helpers/expandStyle.native.js.map +1 -1
  113. package/dist/esm/helpers/expandStyles.mjs +2 -15
  114. package/dist/esm/helpers/expandStyles.mjs.map +1 -1
  115. package/dist/esm/helpers/expandStyles.native.js +7 -13
  116. package/dist/esm/helpers/expandStyles.native.js.map +1 -1
  117. package/dist/esm/helpers/getSplitStyles.mjs +236 -560
  118. package/dist/esm/helpers/getSplitStyles.mjs.map +1 -1
  119. package/dist/esm/helpers/getSplitStyles.native.js +205 -662
  120. package/dist/esm/helpers/getSplitStyles.native.js.map +1 -1
  121. package/dist/esm/helpers/getThemeCSSRules.mjs +8 -16
  122. package/dist/esm/helpers/getThemeCSSRules.mjs.map +1 -1
  123. package/dist/esm/helpers/getTokenForKey.mjs +32 -54
  124. package/dist/esm/helpers/getTokenForKey.mjs.map +1 -1
  125. package/dist/esm/helpers/getTokenForKey.native.js +40 -59
  126. package/dist/esm/helpers/getTokenForKey.native.js.map +1 -1
  127. package/dist/esm/helpers/insertStyleRule.mjs +27 -79
  128. package/dist/esm/helpers/insertStyleRule.mjs.map +1 -1
  129. package/dist/esm/helpers/insertStyleRule.native.js +14 -333
  130. package/dist/esm/helpers/insertStyleRule.native.js.map +1 -1
  131. package/dist/esm/helpers/isActivePlatform.mjs +2 -17
  132. package/dist/esm/helpers/isActivePlatform.mjs.map +1 -1
  133. package/dist/esm/helpers/isActivePlatform.native.js +2 -17
  134. package/dist/esm/helpers/isActivePlatform.native.js.map +1 -1
  135. package/dist/esm/helpers/log.mjs +1 -4
  136. package/dist/esm/helpers/log.mjs.map +1 -1
  137. package/dist/esm/helpers/log.native.js +1 -6
  138. package/dist/esm/helpers/log.native.js.map +1 -1
  139. package/dist/esm/helpers/propMapper.mjs +37 -108
  140. package/dist/esm/helpers/propMapper.mjs.map +1 -1
  141. package/dist/esm/helpers/propMapper.native.js +54 -131
  142. package/dist/esm/helpers/propMapper.native.js.map +1 -1
  143. package/dist/esm/helpers/skipProps.mjs +3 -10
  144. package/dist/esm/helpers/skipProps.mjs.map +1 -1
  145. package/dist/esm/helpers/skipProps.native.js +2 -10
  146. package/dist/esm/helpers/skipProps.native.js.map +1 -1
  147. package/dist/esm/helpers/useRenderElement.mjs +9 -22
  148. package/dist/esm/helpers/useRenderElement.mjs.map +1 -1
  149. package/dist/esm/helpers/useRenderElement.native.js +8 -17
  150. package/dist/esm/helpers/useRenderElement.native.js.map +1 -1
  151. package/dist/esm/helpers/wrapStyleTags.mjs +11 -15
  152. package/dist/esm/helpers/wrapStyleTags.mjs.map +1 -1
  153. package/dist/esm/helpers/wrapStyleTags.native.js +1 -20
  154. package/dist/esm/helpers/wrapStyleTags.native.js.map +1 -1
  155. package/dist/esm/hooks/getThemeProxied.mjs +11 -52
  156. package/dist/esm/hooks/getThemeProxied.mjs.map +1 -1
  157. package/dist/esm/hooks/getThemeProxied.native.js +27 -48
  158. package/dist/esm/hooks/getThemeProxied.native.js.map +1 -1
  159. package/dist/esm/hooks/useTheme.mjs +2 -2
  160. package/dist/esm/hooks/useTheme.mjs.map +1 -1
  161. package/dist/esm/hooks/useTheme.native.js +2 -2
  162. package/dist/esm/hooks/useTheme.native.js.map +1 -1
  163. package/dist/esm/hooks/useThemeState.mjs +67 -124
  164. package/dist/esm/hooks/useThemeState.mjs.map +1 -1
  165. package/dist/esm/hooks/useThemeState.native.js +64 -142
  166. package/dist/esm/hooks/useThemeState.native.js.map +1 -1
  167. package/dist/esm/insertFont.mjs +7 -17
  168. package/dist/esm/insertFont.mjs.map +1 -1
  169. package/dist/esm/insertFont.native.js +7 -24
  170. package/dist/esm/insertFont.native.js.map +1 -1
  171. package/dist/esm/setupReactNative.mjs +4 -24
  172. package/dist/esm/setupReactNative.mjs.map +1 -1
  173. package/dist/esm/setupReactNative.native.js +5 -26
  174. package/dist/esm/setupReactNative.native.js.map +1 -1
  175. package/dist/esm/views/GuiProvider.mjs +4 -6
  176. package/dist/esm/views/GuiProvider.mjs.map +1 -1
  177. package/dist/esm/views/GuiProvider.native.js +5 -7
  178. package/dist/esm/views/GuiProvider.native.js.map +1 -1
  179. package/dist/esm/views/Slot.mjs.map +1 -1
  180. package/dist/esm/views/Text.mjs +11 -18
  181. package/dist/esm/views/Text.mjs.map +1 -1
  182. package/dist/esm/views/Text.native.js +5 -12
  183. package/dist/esm/views/Text.native.js.map +1 -1
  184. package/dist/esm/views/Theme.mjs.map +1 -1
  185. package/dist/esm/views/ThemeProvider.mjs +9 -11
  186. package/dist/esm/views/ThemeProvider.mjs.map +1 -1
  187. package/dist/esm/views/ThemeProvider.native.js +1 -14
  188. package/dist/esm/views/ThemeProvider.native.js.map +1 -1
  189. package/dist/esm/views/View.mjs.map +1 -1
  190. package/dist/esm/views/View.native.js.map +1 -1
  191. package/package.json +30 -23
  192. package/src/_withStableStyle.tsx +2 -2
  193. package/src/config.ts +7 -4
  194. package/src/constants/accessibilityDirectMap.tsx +1 -1
  195. package/src/constants/constants.ts +3 -3
  196. package/src/createComponent.tsx +2 -2
  197. package/src/createGui.ts +2 -2
  198. package/src/eventHandling.native.ts +31 -10
  199. package/src/helpers/createMediaStyle.ts +1 -1
  200. package/src/helpers/defaultAnimationDriver.tsx +1 -1
  201. package/src/helpers/getSplitStyles.tsx +1 -1
  202. package/src/helpers/getTokenForKey.ts +42 -29
  203. package/src/helpers/insertStyleRule.tsx +2 -2
  204. package/src/helpers/isActivePlatform.ts +5 -5
  205. package/src/helpers/mergeProps.ts +1 -1
  206. package/src/helpers/skipProps.ts +1 -1
  207. package/src/helpers/useRenderElement.tsx +4 -1
  208. package/src/hooks/useTheme.tsx +2 -2
  209. package/src/interfaces/GuiComponentPropsBaseBase.tsx +10 -4
  210. package/src/styled.tsx +2 -2
  211. package/src/types.tsx +33 -24
  212. package/src/views/View.tsx +6 -1
  213. package/types/config.d.ts.map +1 -1
  214. package/types/eventHandling.native.d.ts.map +1 -1
  215. package/types/helpers/getTokenForKey.d.ts.map +1 -1
  216. package/types/helpers/isActivePlatform.d.ts +5 -5
  217. package/types/helpers/skipProps.d.ts +1 -1
  218. package/types/helpers/useRenderElement.d.ts.map +1 -1
  219. package/types/helpers/wrapStyleTags.d.ts +1 -1
  220. package/types/helpers/wrapStyleTags.d.ts.map +1 -1
  221. package/types/interfaces/GuiComponentPropsBaseBase.d.ts +3 -3
  222. package/types/interfaces/GuiComponentPropsBaseBase.d.ts.map +1 -1
  223. package/types/styled.d.ts +1 -1
  224. package/types/types.d.ts +17 -17
  225. package/types/types.d.ts.map +1 -1
  226. package/types/views/Configuration.d.ts +1 -1
  227. package/types/views/Configuration.d.ts.map +1 -1
  228. package/types/views/FontLanguage.d.ts +1 -1
  229. package/types/views/FontLanguage.native.d.ts +2 -1
  230. package/types/views/FontLanguage.native.d.ts.map +1 -1
  231. package/types/views/GuiProvider.d.ts +2 -1
  232. package/types/views/GuiProvider.d.ts.map +1 -1
  233. package/types/views/GuiRoot.d.ts +1 -1
  234. package/types/views/GuiRoot.d.ts.map +1 -1
  235. package/types/views/Slot.d.ts +1 -1
  236. package/types/views/ThemeProvider.d.ts +1 -1
  237. package/types/views/ThemeProvider.d.ts.map +1 -1
  238. package/types/views/View.d.ts.map +1 -1
  239. package/.turbo/turbo-build.log +0 -2
  240. package/inject-styles/index.cjs +0 -2
  241. package/inject-styles/index.js +0 -2
  242. package/tsconfig.json +0 -44
  243. package/tsconfig.test.json +0 -9
  244. package/vitest.config.d.ts +0 -3
  245. package/vitest.config.d.ts.map +0 -1
  246. package/vitest.config.ts +0 -14
@@ -39,7 +39,7 @@ __export(createComponent_exports, {
39
39
  module.exports = __toCommonJS(createComponent_exports);
40
40
  var import_compose_refs = require("@hanzogui/compose-refs");
41
41
  var import_constants = require("@hanzogui/constants");
42
- var import_native = require("@hanzogui/native");
42
+ require("@hanzogui/native");
43
43
  var import_helpers = require("@hanzogui/helpers");
44
44
  var import_is_equal_shallow = require("@hanzogui/is-equal-shallow");
45
45
  var import_react = __toESM(require("react"), 1);
@@ -78,27 +78,23 @@ const avoidReRenderKeys = /* @__PURE__ */new Set(["hover", "press", "pressIn", "
78
78
  if (typeof window !== "undefined") {
79
79
  const cancelPresses = () => {
80
80
  componentSetStates.forEach(setState => setState(prev => {
81
- if (prev.press || prev.pressIn) {
82
- return {
83
- ...prev,
84
- press: false,
85
- pressIn: false
86
- };
87
- }
81
+ if (prev.press || prev.pressIn) return {
82
+ ...prev,
83
+ press: false,
84
+ pressIn: false
85
+ };
88
86
  return prev;
89
87
  }));
90
88
  componentSetStates.clear();
91
89
  };
92
90
  const cancelTouches = () => {
93
91
  componentSetStates.forEach(setState => setState(prev => {
94
- if (prev.press || prev.pressIn || prev.hover) {
95
- return {
96
- ...prev,
97
- press: false,
98
- pressIn: false,
99
- hover: false
100
- };
101
- }
92
+ if (prev.press || prev.pressIn || prev.hover) return {
93
+ ...prev,
94
+ press: false,
95
+ pressIn: false,
96
+ hover: false
97
+ };
102
98
  return prev;
103
99
  }));
104
100
  componentSetStates.clear();
@@ -106,72 +102,66 @@ if (typeof window !== "undefined") {
106
102
  addEventListener("mouseup", cancelPresses);
107
103
  addEventListener("touchend", cancelTouches);
108
104
  addEventListener("touchcancel", cancelTouches);
109
- if (process.env.NODE_ENV === "development") {
110
- startVisualizer = () => {
111
- const devVisualizerConfig = import_config.devConfig?.visualizer;
112
- if (devVisualizerConfig && !globalThis.__guiDevVisualizer) {
113
- let show = function (val) {
114
- clearTimeout(tm);
115
- isShowing = val;
116
- debugKeyListeners?.forEach(l => l(val));
117
- if (!val && resizeListener) {
118
- window.removeEventListener("resize", resizeListener);
119
- resizeListener = null;
120
- }
121
- },
122
- cancelShow = function () {
123
- clearTimeout(tm);
124
- if (resizeListener) {
125
- window.removeEventListener("resize", resizeListener);
126
- resizeListener = null;
127
- }
128
- };
129
- globalThis.__guiDevVisualizer = true;
130
- debugKeyListeners = /* @__PURE__ */new Set();
131
- let tm;
132
- let isShowing = false;
133
- let resizeListener = null;
134
- const options = {
135
- key: "Alt",
136
- delay: 800,
137
- ...(typeof devVisualizerConfig === "object" ? devVisualizerConfig : {})
138
- };
139
- window.addEventListener("blur", () => {
140
- show(false);
141
- });
142
- window.addEventListener("keydown", ({
143
- key,
144
- metaKey,
145
- defaultPrevented
146
- }) => {
105
+ if (process.env.NODE_ENV === "development") startVisualizer = () => {
106
+ const devVisualizerConfig = import_config.devConfig?.visualizer;
107
+ if (devVisualizerConfig && !globalThis.__guiDevVisualizer) {
108
+ let show = function (val) {
147
109
  clearTimeout(tm);
148
- if (defaultPrevented) return;
149
- if (metaKey) return;
150
- if (key === options.key) {
151
- if (!resizeListener) {
152
- resizeListener = () => cancelShow();
153
- window.addEventListener("resize", resizeListener);
154
- }
155
- tm = setTimeout(() => {
156
- show(true);
157
- }, options.delay);
110
+ isShowing = val;
111
+ debugKeyListeners?.forEach(l => l(val));
112
+ if (!val && resizeListener) {
113
+ window.removeEventListener("resize", resizeListener);
114
+ resizeListener = null;
158
115
  }
159
- });
160
- window.addEventListener("keyup", ({
161
- defaultPrevented
162
- }) => {
163
- if (defaultPrevented) return;
164
- cancelShow();
165
- if (isShowing) {
166
- show(false);
116
+ },
117
+ cancelShow = function () {
118
+ clearTimeout(tm);
119
+ if (resizeListener) {
120
+ window.removeEventListener("resize", resizeListener);
121
+ resizeListener = null;
167
122
  }
168
- });
169
- }
170
- };
171
- }
123
+ };
124
+ globalThis.__guiDevVisualizer = true;
125
+ debugKeyListeners = /* @__PURE__ */new Set();
126
+ let tm;
127
+ let isShowing = false;
128
+ let resizeListener = null;
129
+ const options = {
130
+ key: "Alt",
131
+ delay: 800,
132
+ ...(typeof devVisualizerConfig === "object" ? devVisualizerConfig : {})
133
+ };
134
+ window.addEventListener("blur", () => {
135
+ show(false);
136
+ });
137
+ window.addEventListener("keydown", ({
138
+ key,
139
+ metaKey,
140
+ defaultPrevented
141
+ }) => {
142
+ clearTimeout(tm);
143
+ if (defaultPrevented) return;
144
+ if (metaKey) return;
145
+ if (key === options.key) {
146
+ if (!resizeListener) {
147
+ resizeListener = () => cancelShow();
148
+ window.addEventListener("resize", resizeListener);
149
+ }
150
+ tm = setTimeout(() => {
151
+ show(true);
152
+ }, options.delay);
153
+ }
154
+ });
155
+ window.addEventListener("keyup", ({
156
+ defaultPrevented
157
+ }) => {
158
+ if (defaultPrevented) return;
159
+ cancelShow();
160
+ if (isShowing) show(false);
161
+ });
162
+ }
163
+ };
172
164
  }
173
- let BaseText;
174
- let BaseView;
175
165
  const lastInteractionWasKeyboard = {
176
166
  value: false
177
167
  };
@@ -180,19 +170,13 @@ const lastInteractionWasTouch = {
180
170
  };
181
171
  if (import_constants.isWeb && typeof document !== "undefined") {
182
172
  document.addEventListener("keydown", () => {
183
- if (!lastInteractionWasKeyboard.value) {
184
- lastInteractionWasKeyboard.value = true;
185
- }
173
+ if (!lastInteractionWasKeyboard.value) lastInteractionWasKeyboard.value = true;
186
174
  });
187
175
  document.addEventListener("mousedown", () => {
188
- if (lastInteractionWasKeyboard.value) {
189
- lastInteractionWasKeyboard.value = false;
190
- }
176
+ if (lastInteractionWasKeyboard.value) lastInteractionWasKeyboard.value = false;
191
177
  });
192
178
  document.addEventListener("mousemove", () => {
193
- if (lastInteractionWasKeyboard.value) {
194
- lastInteractionWasKeyboard.value = false;
195
- }
179
+ if (lastInteractionWasKeyboard.value) lastInteractionWasKeyboard.value = false;
196
180
  lastInteractionWasTouch.value = false;
197
181
  });
198
182
  document.addEventListener("touchstart", () => {
@@ -217,16 +201,6 @@ function createComponent(staticConfig) {
217
201
  startVisualizer = void 0;
218
202
  }
219
203
  }
220
- if (false) {
221
- if (!hasSetupBaseViews) {
222
- hasSetupBaseViews = true;
223
- const baseViews = import_setupHooks.hooks.getBaseViews?.();
224
- if (baseViews) {
225
- BaseText = baseViews.Text;
226
- BaseView = baseViews.View;
227
- }
228
- }
229
- }
230
204
  if (process.env.NODE_ENV === "test") {
231
205
  if (propsIn["data-test-renders"]) {
232
206
  propsIn["data-test-renders"]["current"] = propsIn["data-test-renders"]["current"] ?? 0;
@@ -242,80 +216,68 @@ function createComponent(staticConfig) {
242
216
  let overriddenContextProps = null;
243
217
  const componentContext = import_react.default.useContext(import_ComponentContext.ComponentContext);
244
218
  const hasTextAncestor = !!(import_constants.isWeb && isText ? componentContext.inText : false);
245
- const isInsideNativeMenu = false ? import_react.default.useContext(NativeMenuContext) : false;
246
219
  if (!process.env.GUI_IS_CORE_NODE && process.env.NODE_ENV === "development" && debugProp === "profile" && !time) {
247
- const timer = require("@hanzogui/timer").timer();
248
- time = timer.start();
220
+ time = require("@hanzogui/timer").timer().start();
249
221
  globalThis["time"] = time;
250
222
  }
251
- if (process.env.NODE_ENV === "development" && !time && globalThis.time) {
252
- time = globalThis.time;
253
- }
254
- if (process.env.NODE_ENV === "development" && time) time`non-tamagui time (ignore)`;
223
+ if (process.env.NODE_ENV === "development" && !time && globalThis.time) time = globalThis.time;
224
+ if (process.env.NODE_ENV === "development" && time) time`non-gui time (ignore)`;
255
225
  let props = propsIn;
256
226
  const componentName = props.componentName || staticConfig.componentName;
257
227
  const defaultProps = (0, import_getDefaultProps.getDefaultProps)(staticConfig, props.componentName);
258
228
  const [nextProps, overrides] = (0, import_mergeProps.mergeComponentProps)(defaultProps, styledContextValue, propsIn);
259
229
  props = nextProps;
260
230
  overriddenContextProps = overrides;
261
- if (process.env.NODE_ENV === "development" && import_constants.isClient) {
262
- import_react.default.useEffect(() => {
263
- let node;
264
- let overlay = null;
265
- const remove = () => {
266
- if (overlay) {
267
- try {
268
- overlay.parentNode?.removeChild(overlay);
269
- overlay = null;
270
- } catch {}
271
- }
272
- };
273
- const debugVisualizerHandler = (show = false) => {
274
- node = stateRef.current.host;
275
- if (!node) return;
276
- if (show) {
277
- if (!overlay) {
278
- overlay = document.createElement("span");
279
- overlay.style.inset = "0px";
280
- overlay.style.zIndex = "1000000";
281
- overlay.style.position = "absolute";
282
- overlay.style.borderColor = "red";
283
- overlay.style.borderWidth = "1px";
284
- overlay.style.borderStyle = "dotted";
285
- }
286
- const dataAt = node.getAttribute("data-at") || "";
287
- const dataIn = node.getAttribute("data-in") || "";
288
- const tooltip = document.createElement("span");
289
- tooltip.style.position = "absolute";
290
- tooltip.style.top = "0px";
291
- tooltip.style.left = "0px";
292
- tooltip.style.padding = "3px";
293
- tooltip.style.background = "rgba(0,0,0,0.75)";
294
- tooltip.style.color = "rgba(255,255,255,1)";
295
- tooltip.style.fontSize = "12px";
296
- tooltip.style.lineHeight = "12px";
297
- tooltip.style.fontFamily = "monospace";
298
- tooltip.innerText = `${componentName || ""} ${dataAt} ${dataIn}`.trim();
299
- overlay.appendChild(tooltip);
300
- node.appendChild(overlay);
301
- } else {
302
- remove();
231
+ if (process.env.NODE_ENV === "development" && import_constants.isClient) import_react.default.useEffect(() => {
232
+ let node;
233
+ let overlay = null;
234
+ const remove = () => {
235
+ if (overlay) try {
236
+ overlay.parentNode?.removeChild(overlay);
237
+ overlay = null;
238
+ } catch {}
239
+ };
240
+ const debugVisualizerHandler = (show = false) => {
241
+ node = stateRef.current.host;
242
+ if (!node) return;
243
+ if (show) {
244
+ if (!overlay) {
245
+ overlay = document.createElement("span");
246
+ overlay.style.inset = "0px";
247
+ overlay.style.zIndex = "1000000";
248
+ overlay.style.position = "absolute";
249
+ overlay.style.borderColor = "red";
250
+ overlay.style.borderWidth = "1px";
251
+ overlay.style.borderStyle = "dotted";
303
252
  }
304
- };
305
- debugKeyListeners = debugKeyListeners || /* @__PURE__ */new Set();
306
- debugKeyListeners.add(debugVisualizerHandler);
307
- return () => {
308
- remove();
309
- debugKeyListeners?.delete(debugVisualizerHandler);
310
- };
311
- }, [componentName]);
312
- }
253
+ const dataAt = node.getAttribute("data-at") || "";
254
+ const dataIn = node.getAttribute("data-in") || "";
255
+ const tooltip = document.createElement("span");
256
+ tooltip.style.position = "absolute";
257
+ tooltip.style.top = "0px";
258
+ tooltip.style.left = "0px";
259
+ tooltip.style.padding = "3px";
260
+ tooltip.style.background = "rgba(0,0,0,0.75)";
261
+ tooltip.style.color = "rgba(255,255,255,1)";
262
+ tooltip.style.fontSize = "12px";
263
+ tooltip.style.lineHeight = "12px";
264
+ tooltip.style.fontFamily = "monospace";
265
+ tooltip.innerText = `${componentName || ""} ${dataAt} ${dataIn}`.trim();
266
+ overlay.appendChild(tooltip);
267
+ node.appendChild(overlay);
268
+ } else remove();
269
+ };
270
+ debugKeyListeners = debugKeyListeners || /* @__PURE__ */new Set();
271
+ debugKeyListeners.add(debugVisualizerHandler);
272
+ return () => {
273
+ remove();
274
+ debugKeyListeners?.delete(debugVisualizerHandler);
275
+ };
276
+ }, [componentName]);
313
277
  const groupContextParent = import_react.default.useContext(import_GroupContext.GroupContext);
314
278
  const animationDriver = (() => {
315
279
  if (props.animatedBy && config) {
316
- if (config.animationDrivers) {
317
- return config.animationDrivers[props.animatedBy] ?? config.animations;
318
- }
280
+ if (config.animationDrivers) return config.animationDrivers[props.animatedBy] ?? config.animations;
319
281
  return props.animatedBy === "default" ? config.animations : null;
320
282
  }
321
283
  return (0, import_resolveAnimationDriver.resolveAnimationDriver)(componentContext.animationDriver) ?? (0, import_resolveAnimationDriver.resolveAnimationDriver)(config?.animations) ?? null;
@@ -342,19 +304,15 @@ function createComponent(staticConfig) {
342
304
  willBeAnimatedClient,
343
305
  startedUnhydrated
344
306
  } = componentState;
345
- if (hasAnimationProp && animationDriver?.avoidReRenders) {
346
- (0, import_constants.useIsomorphicLayoutEffect)(() => {
347
- const pendingState = stateRef.current.nextState;
348
- if (pendingState) {
349
- stateRef.current.nextState = void 0;
350
- componentState.setStateShallow(pendingState);
351
- }
352
- });
353
- }
354
- const allGroupContexts = (0, import_react.useMemo)(() => {
355
- if (!groupName || props.passThrough) {
356
- return groupContextParent;
307
+ if (hasAnimationProp && animationDriver?.avoidReRenders) (0, import_constants.useIsomorphicLayoutEffect)(() => {
308
+ const pendingState = stateRef.current.nextState;
309
+ if (pendingState) {
310
+ stateRef.current.nextState = void 0;
311
+ componentState.setStateShallow(pendingState);
357
312
  }
313
+ });
314
+ const allGroupContexts = (0, import_react.useMemo)(() => {
315
+ if (!groupName || props.passThrough) return groupContextParent;
358
316
  const listeners = /* @__PURE__ */new Set();
359
317
  stateRef.current.group?.listeners?.clear();
360
318
  stateRef.current.group = {
@@ -364,18 +322,14 @@ function createComponent(staticConfig) {
364
322
  },
365
323
  subscribe(cb) {
366
324
  listeners.add(cb);
367
- if (listeners.size === 1) {
368
- setStateShallow({
369
- hasDynGroupChildren: true
370
- });
371
- }
325
+ if (listeners.size === 1) setStateShallow({
326
+ hasDynGroupChildren: true
327
+ });
372
328
  return () => {
373
329
  listeners.delete(cb);
374
- if (listeners.size === 0) {
375
- setStateShallow({
376
- hasDynGroupChildren: false
377
- });
378
- }
330
+ if (listeners.size === 0) setStateShallow({
331
+ hasDynGroupChildren: false
332
+ });
379
333
  };
380
334
  }
381
335
  };
@@ -399,16 +353,10 @@ function createComponent(staticConfig) {
399
353
  const renderProp = props.render;
400
354
  const isRenderString = !Component || typeof Component === "string";
401
355
  const element = import_constants.isWeb ? isRenderString ? renderProp || Component : Component : Component;
402
- const BaseTextComponent = BaseText || element || "span";
403
- const BaseViewComponent = BaseView || element || (hasTextAncestor ? "span" : "div");
404
- const BaseComponent = isText ? BaseTextComponent : BaseViewComponent;
356
+ const BaseComponent = isText ? element || "span" : element || (hasTextAncestor ? "span" : "div");
405
357
  let elementType = BaseComponent;
406
- const isAnimatedCustomComponent = animationDriver && isAnimated && animationDriver.needsCustomComponent;
407
- if (isAnimatedCustomComponent) {
408
- elementType = animationDriver[isText ? "Text" : "View"] || elementType;
409
- }
410
- const disableThemeProp = false ? false : props["data-disable-theme"];
411
- const disableTheme = disableThemeProp || isHOC;
358
+ if (animationDriver && isAnimated && animationDriver.needsCustomComponent) elementType = animationDriver[isText ? "Text" : "View"] || elementType;
359
+ const disableTheme = props["data-disable-theme"] || isHOC;
412
360
  if (process.env.NODE_ENV === "development" && time) time`theme-props`;
413
361
  const themeStateProps = {
414
362
  componentName,
@@ -417,13 +365,8 @@ function createComponent(staticConfig) {
417
365
  debug: debugProp,
418
366
  unstyled: props.unstyled
419
367
  };
420
- if ("theme" in props) {
421
- themeStateProps.name = props.theme;
422
- }
368
+ if ("theme" in props) themeStateProps.name = props.theme;
423
369
  themeStateProps.needsUpdate = () => !!stateRef.current.isListeningToTheme;
424
- if (false) {
425
- themeStateProps.deopt = willBeAnimated;
426
- }
427
370
  if (process.env.NODE_ENV === "development") {
428
371
  if (debugProp && debugProp !== "profile") {
429
372
  const name = `${componentName || Component?.displayName || Component?.name || "[Unnamed Component]"}`;
@@ -432,19 +375,15 @@ function createComponent(staticConfig) {
432
375
  const banner = `<${name} /> ${internalID} ${dataIs ? ` ${dataIs}` : ""} ${type.trim()} (hydrated: ${isHydrated}) (unmounted: ${state.unmounted})`;
433
376
  const ch = propsIn.children;
434
377
  let childLog = typeof ch === "string" ? ch.length > 4 ? ch.slice(0, 4) + "..." : ch : "";
435
- if (childLog.length) {
436
- childLog = `(children: ${childLog})`;
437
- }
378
+ if (childLog.length) childLog = `(children: ${childLog})`;
438
379
  if (import_constants.isWeb) {
439
380
  console.info(`%c ${banner}`, "background: green; color: white;");
440
- if (import_constants.isServer) {
441
- (0, import_log.log)({
442
- noClass,
443
- isAnimated,
444
- isWeb: import_constants.isWeb,
445
- inputStyle
446
- });
447
- } else {
381
+ if (import_constants.isServer) (0, import_log.log)({
382
+ noClass,
383
+ isAnimated,
384
+ isWeb: import_constants.isWeb,
385
+ inputStyle
386
+ });else {
448
387
  console.groupEnd();
449
388
  console.groupCollapsed(`${childLog} [inspect props, state, context \u{1F447}]`);
450
389
  (0, import_log.log)("props in:", propsIn);
@@ -498,13 +437,10 @@ ${banner}
498
437
  const mediaState = (0, import_useMedia.useMedia)(componentContext, debugProp);
499
438
  (0, import_createVariable.setDidGetVariableValue)(false);
500
439
  if (process.env.NODE_ENV === "development" && time) time`media`;
501
- const resolveValues =
502
- // if HOC + mounted + has animation prop, resolve as value so it passes non-variable to child
503
- isAnimated && inputStyle !== "css" || isHOC && state.unmounted == false && hasAnimationProp ? "value" : "auto";
504
440
  const styleProps = {
505
441
  mediaState,
506
442
  noClass,
507
- resolveValues,
443
+ resolveValues: isAnimated && inputStyle !== "css" || isHOC && state.unmounted == false && hasAnimationProp ? "value" : "auto",
508
444
  isExiting,
509
445
  isAnimated,
510
446
  willBeAnimated,
@@ -522,23 +458,17 @@ ${banner}
522
458
  overriddenContextProps = overriddenContextProps || {};
523
459
  overriddenContextProps[key] = splitStyles.overriddenContextProps[key];
524
460
  }
525
- if (!staticConfig.context) {
526
- contextForOverride = contextForProps;
527
- }
461
+ if (!staticConfig.context) contextForOverride = contextForProps;
528
462
  }
529
463
  }
530
464
  const groupContext = groupName ? allGroupContexts?.[groupName] || null : null;
531
- if (!isPassthrough && groupContext &&
532
- // avoids onLayout if we don't need it
533
- props.containerType !== "normal") {
465
+ if (!isPassthrough && groupContext && props.containerType !== "normal") {
534
466
  const groupState = groupContext?.state;
535
467
  if (groupState && groupState.layout === void 0) {
536
- if (splitStyles.style?.width || splitStyles.style?.height) {
537
- groupState.layout = {
538
- width: fromPx(splitStyles.style.width),
539
- height: fromPx(splitStyles.style.height)
540
- };
541
- }
468
+ if (splitStyles.style?.width || splitStyles.style?.height) groupState.layout = {
469
+ width: fromPx(splitStyles.style.width),
470
+ height: fromPx(splitStyles.style.height)
471
+ };
542
472
  }
543
473
  }
544
474
  const hasEnterExitTransition = props.transition && typeof props.transition === "object" && !Array.isArray(props.transition) && ("enter" in props.transition || "exit" in props.transition);
@@ -589,16 +519,12 @@ ${banner}
589
519
  };
590
520
  }
591
521
  componentContext.mediaEmit = componentContext.mediaEmit || (next => {
592
- for (const listener of componentContext.mediaEmitListeners) {
593
- listener(next);
594
- }
522
+ for (const listener of componentContext.mediaEmitListeners) listener(next);
595
523
  });
596
524
  stateRef.current.setStateShallow = nextOrGetNext => {
597
525
  const prev = stateRef.current.nextState || state;
598
526
  const next = typeof nextOrGetNext === "function" ? nextOrGetNext(prev) : nextOrGetNext;
599
- if (next === prev || (0, import_is_equal_shallow.isEqualShallow)(prev, next)) {
600
- return;
601
- }
527
+ if (next === prev || (0, import_is_equal_shallow.isEqualShallow)(prev, next)) return;
602
528
  const canAvoidReRender = Object.keys(next).every(key => avoidReRenderKeys.has(key));
603
529
  const updatedState = {
604
530
  ...prev,
@@ -617,12 +543,10 @@ ${banner}
617
543
  updateGroupListeners();
618
544
  stateRef.current.updateStyleListener?.();
619
545
  } else {
620
- if (process.env.NODE_ENV === "development" && debugProp && debugProp !== "profile") {
621
- console.info(`[\u{1F40C}] re-render`, {
622
- canAvoidReRender,
623
- next
624
- });
625
- }
546
+ if (process.env.NODE_ENV === "development" && debugProp && debugProp !== "profile") console.info(`[\u{1F40C}] re-render`, {
547
+ canAvoidReRender,
548
+ next
549
+ });
626
550
  ogSetStateShallow(next);
627
551
  }
628
552
  };
@@ -636,16 +560,12 @@ ${banner}
636
560
  splitStyles.style = splitStyles.style || {};
637
561
  splitStyles.style.opacity = 0;
638
562
  }
639
- if (splitStyles.dynamicThemeAccess != null) {
640
- stateRef.current.isListeningToTheme = splitStyles.dynamicThemeAccess;
641
- }
563
+ if (splitStyles.dynamicThemeAccess != null) stateRef.current.isListeningToTheme = splitStyles.dynamicThemeAccess;
642
564
  }
643
565
  const hasRuntimeMediaKeys = splitStyles?.hasMedia && splitStyles.hasMedia !== true;
644
566
  const shouldListenForMedia = (0, import_createVariable.didGetVariableValue)() || hasRuntimeMediaKeys || noClass && splitStyles?.hasMedia === true;
645
567
  const mediaListeningKeys = hasRuntimeMediaKeys ? splitStyles.hasMedia : null;
646
- if (process.env.NODE_ENV === "development" && debugProp === "verbose") {
647
- console.info(`useMedia() createComponent`, shouldListenForMedia, mediaListeningKeys);
648
- }
568
+ if (process.env.NODE_ENV === "development" && debugProp === "verbose") console.info(`useMedia() createComponent`, shouldListenForMedia, mediaListeningKeys);
649
569
  (0, import_useMedia.setMediaShouldUpdate)(componentContext, shouldListenForMedia, mediaListeningKeys);
650
570
  const {
651
571
  viewProps: viewPropsIn,
@@ -674,48 +594,33 @@ ${banner}
674
594
  onFocus,
675
595
  onBlur,
676
596
  separator,
677
- // ignore from here on out
678
597
  passThrough,
679
598
  forceStyle: _forceStyle,
680
- // @ts-ignore for next/link compat etc
681
599
  onClick,
682
600
  theme: _themeProp,
683
601
  ...nonGuiProps
684
602
  } = viewPropsIn || {};
685
603
  let viewProps = nonGuiProps;
686
- if (props.forceStyle) {
687
- viewProps.forceStyle = props.forceStyle;
688
- }
604
+ if (props.forceStyle) viewProps.forceStyle = props.forceStyle;
689
605
  if (isHOC) {
690
- if (typeof _themeProp !== "undefined") {
691
- viewProps.theme = _themeProp;
692
- }
693
- if (typeof passThrough !== "undefined") {
694
- viewProps.passThrough = passThrough;
695
- }
606
+ if (typeof _themeProp !== "undefined") viewProps.theme = _themeProp;
607
+ if (typeof passThrough !== "undefined") viewProps.passThrough = passThrough;
696
608
  }
697
609
  let animationStyles;
698
- const shouldUseAnimation =
699
- // if it supports css vars we run it on server too to get matching initial style
700
- (inputStyle === "css" ? willBeAnimatedClient : willBeAnimated) && useAnimations && !isHOC;
610
+ const shouldUseAnimation = (inputStyle === "css" ? willBeAnimatedClient : willBeAnimated) && useAnimations && !isHOC;
701
611
  let animatedRef;
702
612
  if (shouldUseAnimation) {
703
613
  const useStyleEmitter = animationDriver?.avoidReRenders ? listener => {
704
614
  stateRef.current.useStyleListener = listener;
705
615
  } : void 0;
706
616
  const effectiveTransition = (0, import_pseudoTransitions.resolveEffectivePseudoTransition)(stateRef.current.prevPseudoState, state, splitStyles?.pseudoTransitions, props.transition);
707
- if (splitStyles) {
708
- splitStyles.effectiveTransition = effectiveTransition;
709
- }
617
+ if (splitStyles) splitStyles.effectiveTransition = effectiveTransition;
710
618
  stateRef.current.prevPseudoState = (0, import_pseudoTransitions.extractPseudoState)(state);
711
619
  const animations = useAnimations({
712
620
  props: propsWithAnimation,
713
- // clone style to prevent animation driver mutations from leaking to viewProps
714
- // during SSR/pre-hydration (CSS driver mutates style.transition in place)
715
621
  style: isHydrated ? splitStylesStyle || {} : {
716
622
  ...splitStylesStyle
717
623
  },
718
- // @ts-ignore
719
624
  styleState: splitStyles,
720
625
  useStyleEmitter,
721
626
  presence,
@@ -728,56 +633,38 @@ ${banner}
728
633
  stateRef
729
634
  });
730
635
  if (animations) {
731
- if (animations.ref) {
732
- animatedRef = animations.ref;
733
- }
636
+ if (animations.ref) animatedRef = animations.ref;
734
637
  if (isHydrated && animations) {
735
638
  animationStyles = animations.style;
736
639
  viewProps.style = animationStyles;
737
- if (animations.className) {
738
- viewProps.className = `${state.unmounted === "should-enter" ? "t_unmounted " : ""}${viewProps.className || ""} ${animations.className}`;
739
- }
640
+ if (animations.className) viewProps.className = `${state.unmounted === "should-enter" ? "t_unmounted " : ""}${viewProps.className || ""} ${animations.className}`;
740
641
  }
741
642
  }
742
643
  if (process.env.NODE_ENV === "development" && time) time`animations`;
743
644
  }
744
- if (process.env.NODE_ENV === "development" && props.untilMeasured && !props.group) {
745
- console.warn(`You set the untilMeasured prop without setting group. This doesn't work, be sure to set untilMeasured on the parent that sets group, not the children that use the $group- prop.
645
+ if (process.env.NODE_ENV === "development" && props.untilMeasured && !props.group) console.warn(`You set the untilMeasured prop without setting group. This doesn't work, be sure to set untilMeasured on the parent that sets group, not the children that use the $group- prop.
746
646
 
747
647
  If you meant to do this, you can disable this warning - either change untilMeasured and group at the same time, or do group={conditional ? 'name' : undefined}`);
748
- }
749
648
  if (process.env.NODE_ENV === "development" && time) time`destructure`;
750
- if (!isPassthrough && groupContext &&
751
- // avoids onLayout if we don't need it
752
- props.containerType !== "normal") {
753
- nonGuiProps.onLayout = (0, import_helpers.composeEventHandlers)(nonGuiProps.onLayout, e => {
754
- const layout = e.nativeEvent.layout;
755
- groupContext.state.layout = layout;
756
- stateRef.current.group?.emit({
757
- layout
758
- });
759
- if (!stateRef.current.hasMeasured && props.untilMeasured === "hide") {
760
- setState(prev => ({
761
- ...prev
762
- }));
763
- }
764
- stateRef.current.hasMeasured = true;
649
+ if (!isPassthrough && groupContext && props.containerType !== "normal") nonGuiProps.onLayout = (0, import_helpers.composeEventHandlers)(nonGuiProps.onLayout, e => {
650
+ const layout = e.nativeEvent.layout;
651
+ groupContext.state.layout = layout;
652
+ stateRef.current.group?.emit({
653
+ layout
765
654
  });
766
- }
655
+ if (!stateRef.current.hasMeasured && props.untilMeasured === "hide") setState(prev => ({
656
+ ...prev
657
+ }));
658
+ stateRef.current.hasMeasured = true;
659
+ });
767
660
  viewProps = import_setupHooks.hooks.usePropsTransform?.(elementType, nonGuiProps, stateRef, stateRef.current.willHydrate) || nonGuiProps;
768
- if (!stateRef.current.composedRef) {
769
- stateRef.current.composedRef = (0, import_compose_refs.composeRefs)(x => stateRef.current.host = x, forwardedRef, import_setElementProps.setElementProps, animatedRef);
770
- }
661
+ if (!stateRef.current.composedRef) stateRef.current.composedRef = (0, import_compose_refs.composeRefs)(x => stateRef.current.host = x, forwardedRef, import_setElementProps.setElementProps, animatedRef);
771
662
  viewProps.ref = stateRef.current.composedRef;
772
663
  (0, import_pointerEvents.usePointerEvents)(props, viewProps);
773
664
  if (process.env.NODE_ENV === "development") {
774
- if (!isReactNative && !isText && import_constants.isWeb && !isHOC) {
775
- import_react.default.Children.toArray(props.children).forEach(item => {
776
- if (typeof item === "string" && item !== "\n") {
777
- console.error(`Unexpected text node: ${item}. A text node cannot be a child of a <${staticConfig.componentName || propsIn.tag || "View"}>.`, props);
778
- }
779
- });
780
- }
665
+ if (!isReactNative && !isText && import_constants.isWeb && !isHOC) import_react.default.Children.toArray(props.children).forEach(item => {
666
+ if (typeof item === "string" && item !== "\n") console.error(`Unexpected text node: ${item}. A text node cannot be a child of a <${staticConfig.componentName || propsIn.tag || "View"}>.`, props);
667
+ });
781
668
  }
782
669
  if (process.env.NODE_ENV === "development" && time) time`events-hooks`;
783
670
  const unPress = () => {
@@ -786,25 +673,23 @@ If you meant to do this, you can disable this warning - either change untilMeasu
786
673
  pressIn: false
787
674
  });
788
675
  };
789
- if (process.env.NODE_ENV === "development" && import_constants.isWeb) {
790
- (0, import_constants.useIsomorphicLayoutEffect)(() => {
791
- if (debugProp === "verbose") {
792
- let cssStyleDeclarationToObject = function (style) {
793
- const styleObject = {};
794
- for (let i = 0; i < style.length; i++) {
795
- let prop = style[i];
796
- styleObject[prop] = style.getPropertyValue(prop);
797
- }
798
- return styleObject;
799
- };
800
- const computed = stateRef.current.host ? cssStyleDeclarationToObject(getComputedStyle(stateRef.current.host)) : {};
801
- console.groupCollapsed(`Rendered > (opacity: ${computed.opacity})`);
802
- console.warn(stateRef.current.host);
803
- console.warn(computed);
804
- console.groupEnd();
805
- }
806
- });
807
- }
676
+ if (process.env.NODE_ENV === "development" && import_constants.isWeb) (0, import_constants.useIsomorphicLayoutEffect)(() => {
677
+ if (debugProp === "verbose") {
678
+ let cssStyleDeclarationToObject = function (style) {
679
+ const styleObject = {};
680
+ for (let i = 0; i < style.length; i++) {
681
+ let prop = style[i];
682
+ styleObject[prop] = style.getPropertyValue(prop);
683
+ }
684
+ return styleObject;
685
+ };
686
+ const computed = stateRef.current.host ? cssStyleDeclarationToObject(getComputedStyle(stateRef.current.host)) : {};
687
+ console.groupCollapsed(`Rendered > (opacity: ${computed.opacity})`);
688
+ console.warn(stateRef.current.host);
689
+ console.warn(computed);
690
+ console.groupEnd();
691
+ }
692
+ });
808
693
  (0, import_constants.useIsomorphicLayoutEffect)(() => {
809
694
  if (state.unmounted === true && hasEnterStyle) {
810
695
  setStateShallow({
@@ -865,20 +750,18 @@ If you meant to do this, you can disable this warning - either change untilMeasu
865
750
  const shouldAttach = !disabled && !props.asChild && Boolean(attachFocus || attachPress || attachHover || runtimePressStyle || runtimeHoverStyle || runtimeFocusStyle);
866
751
  const needsPressState = Boolean(hasDynamicGroupChildren || runtimePressStyle);
867
752
  if (process.env.NODE_ENV === "development" && time) time`events-setup`;
868
- if (process.env.NODE_ENV === "development" && debugProp === "verbose") {
869
- (0, import_log.log)(`\u{1FAA9} events()`, {
870
- runtimeFocusStyle,
871
- runtimePressStyle,
872
- runtimeHoverStyle,
873
- runtimeFocusVisibleStyle,
874
- attachPress,
875
- attachFocus,
876
- attachHover,
877
- shouldAttach,
878
- needsHoverState,
879
- pseudos
880
- });
881
- }
753
+ if (process.env.NODE_ENV === "development" && debugProp === "verbose") (0, import_log.log)(`\u{1FAA9} events()`, {
754
+ runtimeFocusStyle,
755
+ runtimePressStyle,
756
+ runtimeHoverStyle,
757
+ runtimeFocusVisibleStyle,
758
+ attachPress,
759
+ attachFocus,
760
+ attachHover,
761
+ shouldAttach,
762
+ needsHoverState,
763
+ pseudos
764
+ });
882
765
  const events = shouldAttach ? {
883
766
  onPressOut: attachPress ? e => {
884
767
  unPress();
@@ -888,13 +771,9 @@ If you meant to do this, you can disable this warning - either change untilMeasu
888
771
  ...((attachHover || attachPress) && {
889
772
  onMouseEnter: e => {
890
773
  const next = {};
891
- if (needsHoverState && !lastInteractionWasTouch.value) {
892
- next.hover = true;
893
- }
774
+ if (needsHoverState && !lastInteractionWasTouch.value) next.hover = true;
894
775
  if (needsPressState) {
895
- if (state.pressIn) {
896
- next.press = true;
897
- }
776
+ if (state.pressIn) next.press = true;
898
777
  }
899
778
  setStateShallow(next);
900
779
  onHoverIn?.(e);
@@ -902,9 +781,7 @@ If you meant to do this, you can disable this warning - either change untilMeasu
902
781
  },
903
782
  onMouseLeave: e => {
904
783
  const next = {};
905
- if (needsHoverState) {
906
- next.hover = false;
907
- }
784
+ if (needsHoverState) next.hover = false;
908
785
  if (needsPressState) {
909
786
  next.press = false;
910
787
  next.pressIn = false;
@@ -915,32 +792,21 @@ If you meant to do this, you can disable this warning - either change untilMeasu
915
792
  }
916
793
  }),
917
794
  onPressIn: attachPress ? e => {
918
- if (needsPressState) {
919
- setStateShallow({
920
- press: true,
921
- pressIn: true
922
- });
923
- }
795
+ if (needsPressState) setStateShallow({
796
+ press: true,
797
+ pressIn: true
798
+ });
924
799
  onPressIn?.(e);
925
800
  onMouseDown?.(e);
926
- if (import_constants.isWeb) {
927
- componentSetStates.add(setState);
928
- }
801
+ if (import_constants.isWeb) componentSetStates.add(setState);
929
802
  } : void 0,
930
803
  onPress: attachPress ? e => {
931
804
  unPress();
932
- if (true) {
933
- onClick?.(e);
934
- if (onPress || onClick) {
935
- e.stopPropagation();
936
- }
937
- }
805
+ onClick?.(e);
806
+ if (onPress || onClick) e.stopPropagation();
938
807
  onPress?.(e);
939
- if (true) {
940
- onLongPress?.(e);
941
- }
808
+ onLongPress?.(e);
942
809
  } : void 0,
943
- ...false,
944
810
  ...(attachFocus && {
945
811
  onFocus: e => {
946
812
  const next = {};
@@ -951,23 +817,15 @@ If you meant to do this, you can disable this warning - either change untilMeasu
951
817
  next.focusWithin = true;
952
818
  }
953
819
  if (pseudos?.focusVisibleStyle) {
954
- if (lastInteractionWasKeyboard.value) {
955
- next.focusVisible = true;
956
- } else {
957
- next.focus = true;
958
- }
959
- } else {
960
- next.focus = true;
961
- }
820
+ if (lastInteractionWasKeyboard.value) next.focusVisible = true;else next.focus = true;
821
+ } else next.focus = true;
962
822
  setStateShallow(next);
963
823
  onFocus?.(e);
964
824
  },
965
825
  onBlur: e => {
966
- if (componentContext.setParentFocusState) {
967
- componentContext.setParentFocusState({
968
- focusWithin: false
969
- });
970
- }
826
+ if (componentContext.setParentFocusState) componentContext.setParentFocusState({
827
+ focusWithin: false
828
+ });
971
829
  setStateShallow({
972
830
  focus: false,
973
831
  focusVisible: false,
@@ -977,38 +835,20 @@ If you meant to do this, you can disable this warning - either change untilMeasu
977
835
  }
978
836
  })
979
837
  } : null;
980
- if (false) {
981
- Object.assign(events, {
982
- cancelable: !viewProps.rejectResponderTermination,
983
- disabled,
984
- hitSlop: viewProps.hitSlop,
985
- delayLongPress: viewProps.delayLongPress,
986
- delayPressIn: viewProps.delayPressIn,
987
- delayPressOut: viewProps.delayPressOut,
988
- focusable: viewProps.focusable ?? true,
989
- minPressDuration: 0
990
- });
991
- }
992
- if (events && !isReactNative) {
993
- Object.assign(viewProps, (0, import_eventHandling.getWebEvents)(events));
994
- }
838
+ if (events && !isReactNative) Object.assign(viewProps, (0, import_eventHandling.getWebEvents)(events));
995
839
  if (process.env.NODE_ENV === "development" && time) time`events`;
996
- if (process.env.NODE_ENV === "development" && debugProp === "verbose") {
997
- (0, import_log.log)(`events`, {
998
- events,
999
- attachHover,
1000
- attachPress
1001
- });
1002
- }
840
+ if (process.env.NODE_ENV === "development" && debugProp === "verbose") (0, import_log.log)(`events`, {
841
+ events,
842
+ attachHover,
843
+ attachPress
844
+ });
1003
845
  const propsWithHref = props;
1004
846
  const propsInWithHref = propsIn;
1005
- const pressDebugDetail = props.testID ?? propsIn.testID ?? props.accessibilityLabel ?? propsIn.accessibilityLabel ?? (typeof propsWithHref.href === "string" ? propsWithHref.href : null) ?? (typeof propsInWithHref.href === "string" ? propsInWithHref.href : null);
1006
- const pressDebugName = [componentName, pressDebugDetail].filter(Boolean).join(":") || null;
1007
- const pressGesture = false ? useEvents(events, viewProps, stateRef, staticConfig, isHOC, isInsideNativeMenu, pressDebugName) : null;
847
+ [componentName, props.testID ?? propsIn.testID ?? props.accessibilityLabel ?? propsIn.accessibilityLabel ?? (typeof propsWithHref.href === "string" ? propsWithHref.href : null) ?? (typeof propsInWithHref.href === "string" ? propsInWithHref.href : null)].filter(Boolean).join(":");
1008
848
  if (process.env.NODE_ENV === "development" && time) time`hooks`;
1009
849
  if (asChild) {
1010
850
  elementType = import_Slot.Slot;
1011
- if (true) {
851
+ {
1012
852
  const webStyleEvents = asChild === "web" || asChild === "except-style-web";
1013
853
  const passEvents = (0, import_eventHandling.getWebEvents)({
1014
854
  onPress,
@@ -1021,25 +861,16 @@ If you meant to do this, you can disable this warning - either change untilMeasu
1021
861
  onMouseLeave
1022
862
  }, webStyleEvents);
1023
863
  Object.assign(viewProps, passEvents);
1024
- } else {
1025
- Object.assign(viewProps, {
1026
- onPress,
1027
- onLongPress
1028
- });
1029
864
  }
1030
865
  }
1031
866
  if (process.env.NODE_ENV === "development" && time) time`spaced-as-child`;
1032
867
  let content;
1033
- if (isPassthrough) {
1034
- content = import_react.default.createElement(BaseComponent, {
1035
- style: {
1036
- display: "contents"
1037
- }
1038
- }, propsIn.children);
1039
- } else {
1040
- if (import_setupHooks.hooks.useChildren) {
1041
- content = import_setupHooks.hooks.useChildren(elementType, content || children, viewProps);
868
+ if (isPassthrough) content = import_react.default.createElement(BaseComponent, {
869
+ style: {
870
+ display: "contents"
1042
871
  }
872
+ }, propsIn.children);else {
873
+ if (import_setupHooks.hooks.useChildren) content = import_setupHooks.hooks.useChildren(elementType, content || children, viewProps);
1043
874
  const isRenderPropString = typeof renderProp === "string";
1044
875
  if (renderProp && !isRenderPropString) {
1045
876
  const out = getCustomRender(renderProp, content || children, viewProps, componentState);
@@ -1049,76 +880,47 @@ If you meant to do this, you can disable this warning - either change untilMeasu
1049
880
  }
1050
881
  }
1051
882
  if (!content) {
1052
- if (isRenderPropString) {
1053
- viewProps.render === renderProp;
1054
- }
883
+ if (isRenderPropString) viewProps.render;
1055
884
  content = import_react.default.createElement(elementType, viewProps, content || children);
1056
885
  }
1057
886
  if (process.env.NODE_ENV === "development" && time) time`use-children`;
1058
887
  }
1059
- if (false) {
1060
- const isCompositeComponent = !isHOC && Component && typeof Component !== "string";
1061
- content = wrapWithGestureDetector(content, pressGesture, stateRef, isHOC, isCompositeComponent);
1062
- }
1063
888
  const ResetPresence = animationDriver?.ResetPresence;
1064
889
  const needsReset = Boolean(
1065
890
  // not when passing down to child
1066
- !asChild &&
1067
- // not when passThrough
1068
- splitStyles &&
1069
- // not when HOC
1070
- !isHOC && ResetPresence && willBeAnimated && (hasEnterStyle || presenceState));
891
+ !asChild && splitStyles && !isHOC && ResetPresence && willBeAnimated && (hasEnterStyle || presenceState));
1071
892
  const hasEverReset = stateRef.current.hasEverResetPresence;
1072
- if (needsReset && !hasEverReset) {
1073
- stateRef.current.hasEverResetPresence = true;
1074
- }
1075
- const renderReset = needsReset || hasEverReset;
1076
- if (renderReset && ResetPresence) {
1077
- content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(ResetPresence, {
1078
- disabled: !needsReset,
1079
- children: content
1080
- });
1081
- }
893
+ if (needsReset && !hasEverReset) stateRef.current.hasEverResetPresence = true;
894
+ if ((needsReset || hasEverReset) && ResetPresence) content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(ResetPresence, {
895
+ disabled: !needsReset,
896
+ children: content
897
+ });
1082
898
  if (process.env.NODE_ENV === "development" && time) time`create-element`;
1083
- if ("focusWithinStyle" in propsIn || pseudos?.focusWithinStyle) {
1084
- content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ComponentContext.ComponentContext.Provider, {
1085
- ...componentContext,
1086
- setParentFocusState: setStateShallow,
1087
- children: content
1088
- });
1089
- }
1090
- if ("group" in props) {
1091
- content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_GroupContext.GroupContext.Provider, {
1092
- value: allGroupContexts,
1093
- children: content
1094
- });
1095
- }
1096
- if (!asChild && isText && !hasTextAncestor) {
1097
- content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ComponentContext.ComponentContext.Provider, {
1098
- ...componentContext,
1099
- inText: true,
1100
- children: content
1101
- });
1102
- }
899
+ if ("focusWithinStyle" in propsIn || pseudos?.focusWithinStyle) content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ComponentContext.ComponentContext.Provider, {
900
+ ...componentContext,
901
+ setParentFocusState: setStateShallow,
902
+ children: content
903
+ });
904
+ if ("group" in props) content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_GroupContext.GroupContext.Provider, {
905
+ value: allGroupContexts,
906
+ children: content
907
+ });
908
+ if (!asChild && isText && !hasTextAncestor) content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ComponentContext.ComponentContext.Provider, {
909
+ ...componentContext,
910
+ inText: true,
911
+ children: content
912
+ });
1103
913
  if (process.env.NODE_ENV === "development" && time) time`group-context`;
1104
914
  content = disableTheme || !splitStyles ? content : (0, import_Theme.getThemedChildren)(themeState, content, themeStateProps, false, stateRef);
1105
915
  if (process.env.NODE_ENV === "development" && time) time`themed-children`;
1106
- if (true) {
1107
- if (isReactNative && !asChild) {
1108
- content = /* @__PURE__ */(0, import_jsx_runtime.jsx)("span", {
1109
- className: "_dsp_contents",
1110
- ...(!isPassthrough && isHydrated && events && (0, import_eventHandling.getWebEvents)(events)),
1111
- children: content
1112
- });
1113
- }
1114
- }
916
+ if (isReactNative && !asChild) content = /* @__PURE__ */(0, import_jsx_runtime.jsx)("span", {
917
+ className: "_dsp_contents",
918
+ ...(!isPassthrough && isHydrated && events && (0, import_eventHandling.getWebEvents)(events)),
919
+ children: content
920
+ });
1115
921
  if (overriddenContextProps && contextForOverride) {
1116
922
  const Provider = contextForOverride.Provider;
1117
- for (const key in styledContextValue) {
1118
- if (!(key in overriddenContextProps)) {
1119
- overriddenContextProps[key] = styledContextValue[key];
1120
- }
1121
- }
923
+ for (const key in styledContextValue) if (!(key in overriddenContextProps)) overriddenContextProps[key] = styledContextValue[key];
1122
924
  content = /* @__PURE__ */(0, import_jsx_runtime.jsx)(Provider, {
1123
925
  __disableMergeDefaultValues: true,
1124
926
  ...overriddenContextProps,
@@ -1126,61 +928,52 @@ If you meant to do this, you can disable this warning - either change untilMeasu
1126
928
  });
1127
929
  }
1128
930
  if (process.env.NODE_ENV === "development" && time) time`context-override`;
1129
- if (startedUnhydrated && splitStyles) {
1130
- content = /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
1131
- children: [content, !isHydrated ? (0, import_wrapStyleTags.getStyleTags)(Object.values(splitStyles.rulesToInsert)) : null]
1132
- });
1133
- }
931
+ if (startedUnhydrated && splitStyles) content = /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
932
+ children: [content, !isHydrated ? (0, import_wrapStyleTags.getStyleTags)(Object.values(splitStyles.rulesToInsert)) : null]
933
+ });
1134
934
  if (process.env.NODE_ENV === "development" && time) time`style-tags`;
1135
935
  if (process.env.NODE_ENV === "development") {
1136
936
  if (debugProp && debugProp !== "profile") {
1137
- const element2 = typeof elementType === "string" ? elementType : "Component";
1138
- const title = `render <${element2} /> (${internalID}) with props`;
937
+ const title = `render <${typeof elementType === "string" ? elementType : "Component"} /> (${internalID}) with props`;
1139
938
  if (!import_constants.isWeb || !import_constants.isClient) {
1140
939
  (0, import_log.log)(title);
1141
940
  (0, import_log.log)(`state: `, state);
1142
- if (import_isDevTools.isDevTools) {
1143
- (0, import_log.log)("viewProps", viewProps);
1144
- }
941
+ if (import_isDevTools.isDevTools) (0, import_log.log)("viewProps", viewProps);
1145
942
  (0, import_log.log)(`final styles:`);
1146
- for (const key in splitStylesStyle) {
1147
- (0, import_log.log)(key, splitStylesStyle[key]);
1148
- }
943
+ for (const key in splitStylesStyle) (0, import_log.log)(key, splitStylesStyle[key]);
1149
944
  } else {
1150
945
  console.groupCollapsed(title);
1151
946
  try {
1152
947
  (0, import_log.log)("viewProps", viewProps);
1153
948
  (0, import_log.log)("children", content);
1154
- if (typeof window !== "undefined") {
1155
- (0, import_log.log)({
1156
- propsIn,
1157
- props,
1158
- attachPress,
1159
- animationStyles,
1160
- classNames,
1161
- content,
1162
- elementType,
1163
- events,
1164
- isAnimated,
1165
- hasRuntimeMediaKeys,
1166
- isStringElement,
1167
- mediaListeningKeys,
1168
- pseudos,
1169
- shouldAttach,
1170
- noClass,
1171
- shouldListenForMedia,
1172
- splitStyles,
1173
- splitStylesStyle,
1174
- state,
1175
- stateRef,
1176
- staticConfig,
1177
- styleProps,
1178
- themeState,
1179
- viewProps,
1180
- willBeAnimated,
1181
- startedUnhydrated
1182
- });
1183
- }
949
+ if (typeof window !== "undefined") (0, import_log.log)({
950
+ propsIn,
951
+ props,
952
+ attachPress,
953
+ animationStyles,
954
+ classNames,
955
+ content,
956
+ elementType,
957
+ events,
958
+ isAnimated,
959
+ hasRuntimeMediaKeys,
960
+ isStringElement,
961
+ mediaListeningKeys,
962
+ pseudos,
963
+ shouldAttach,
964
+ noClass,
965
+ shouldListenForMedia,
966
+ splitStyles,
967
+ splitStylesStyle,
968
+ state,
969
+ stateRef,
970
+ staticConfig,
971
+ styleProps,
972
+ themeState,
973
+ viewProps,
974
+ willBeAnimated,
975
+ startedUnhydrated
976
+ });
1184
977
  } catch {} finally {
1185
978
  console.groupEnd();
1186
979
  }
@@ -1202,9 +995,7 @@ If you meant to do this, you can disable this warning - either change untilMeasu
1202
995
  return content;
1203
996
  });
1204
997
  function notifyGroupSubscribers(groupContext, groupEmitter, pseudo) {
1205
- if (!groupContext || !groupEmitter) {
1206
- return;
1207
- }
998
+ if (!groupContext || !groupEmitter) return;
1208
999
  const nextState = {
1209
1000
  ...groupContext.state,
1210
1001
  pseudo
@@ -1212,9 +1003,7 @@ If you meant to do this, you can disable this warning - either change untilMeasu
1212
1003
  groupEmitter.emit(nextState);
1213
1004
  groupContext.state = nextState;
1214
1005
  }
1215
- if (staticConfig.componentName) {
1216
- component.displayName = staticConfig.componentName;
1217
- }
1006
+ if (staticConfig.componentName) component.displayName = staticConfig.componentName;
1218
1007
  let res = component;
1219
1008
  res = import_react.default.memo(res);
1220
1009
  res.staticConfig = staticConfig;
@@ -1228,13 +1017,10 @@ If you meant to do this, you can disable this warning - either change untilMeasu
1228
1017
  };
1229
1018
  }
1230
1019
  function styleable(Component2, options) {
1231
- const skipForwardRef = typeof Component2 === "function" && Component2.length === 1;
1232
- let out = skipForwardRef ? Component2 : import_react.default.forwardRef(Component2);
1020
+ let out = typeof Component2 === "function" && Component2.length === 1 ? Component2 : import_react.default.forwardRef(Component2);
1233
1021
  const extendedConfig = extendStyledConfig(options?.staticConfig);
1234
1022
  out = options?.disableTheme ? out : (0, import_themeable.themeable)(out, extendedConfig, true);
1235
- if (extendedConfig.memo || process.env.TAMAGUI_MEMOIZE_STYLEABLE) {
1236
- out = import_react.default.memo(out);
1237
- }
1023
+ if (extendedConfig.memo || process.env.GUI_MEMOIZE_STYLEABLE) out = import_react.default.memo(out);
1238
1024
  out.staticConfig = extendedConfig;
1239
1025
  out.styleable = styleable;
1240
1026
  return out;
@@ -1248,14 +1034,10 @@ const fromPx = val => {
1248
1034
  return 0;
1249
1035
  };
1250
1036
  const getCustomRender = (renderProp, content, viewProps, state) => {
1251
- if (typeof renderProp === "function") {
1252
- const out = renderProp(viewProps, state);
1253
- renderProp = getRenderElementForPlatform(out);
1254
- }
1037
+ if (typeof renderProp === "function") renderProp = getRenderElementForPlatform(renderProp(viewProps, state));
1255
1038
  if (renderProp) {
1256
1039
  if (typeof renderProp === "object" && import_react.default.isValidElement(renderProp)) {
1257
- const renderElement = getRenderElementForPlatform(renderProp);
1258
- if (renderElement) {
1040
+ if (getRenderElementForPlatform(renderProp)) {
1259
1041
  const elementProps = renderProp.props;
1260
1042
  const mergedProps = elementProps ? (0, import_mergeRenderElementProps.mergeRenderElementProps)(elementProps, viewProps, content) : viewProps;
1261
1043
  return {
@@ -1267,10 +1049,5 @@ const getCustomRender = (renderProp, content, viewProps, state) => {
1267
1049
  }
1268
1050
  };
1269
1051
  function getRenderElementForPlatform(potential) {
1270
- if (false) {
1271
- if (isHTMLElement(potential)) {
1272
- return;
1273
- }
1274
- }
1275
1052
  return potential;
1276
1053
  }