@tamagui/web 1.2.8 → 1.2.10

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 (165) hide show
  1. package/dist/cjs/createComponent.js +6 -5
  2. package/dist/cjs/createComponent.js.map +2 -2
  3. package/dist/esm/Tamagui.mjs +41 -0
  4. package/dist/esm/Tamagui.mjs.map +7 -0
  5. package/dist/esm/addTheme.mjs +54 -0
  6. package/dist/esm/addTheme.mjs.map +7 -0
  7. package/dist/esm/config.mjs +84 -0
  8. package/dist/esm/config.mjs.map +7 -0
  9. package/dist/esm/constants/constants.mjs +22 -0
  10. package/dist/esm/constants/constants.mjs.map +7 -0
  11. package/dist/esm/constants/isDevTools.mjs +13 -0
  12. package/dist/esm/constants/isDevTools.mjs.map +7 -0
  13. package/dist/esm/contexts/ButtonNestingContext.mjs +6 -0
  14. package/dist/esm/contexts/ButtonNestingContext.mjs.map +7 -0
  15. package/dist/esm/contexts/FontLanguageContext.mjs +6 -0
  16. package/dist/esm/contexts/FontLanguageContext.mjs.map +7 -0
  17. package/dist/esm/contexts/TextAncestorContext.mjs +6 -0
  18. package/dist/esm/contexts/TextAncestorContext.mjs.map +7 -0
  19. package/dist/esm/createComponent.js +6 -5
  20. package/dist/esm/createComponent.js.map +2 -2
  21. package/dist/esm/createComponent.mjs +853 -0
  22. package/dist/esm/createComponent.mjs.map +7 -0
  23. package/dist/esm/createFont.mjs +45 -0
  24. package/dist/esm/createFont.mjs.map +7 -0
  25. package/dist/esm/createShorthands.mjs +7 -0
  26. package/dist/esm/createShorthands.mjs.map +7 -0
  27. package/dist/esm/createTamagui.mjs +190 -0
  28. package/dist/esm/createTamagui.mjs.map +7 -0
  29. package/dist/esm/createTheme.mjs +7 -0
  30. package/dist/esm/createTheme.mjs.map +7 -0
  31. package/dist/esm/createTokens.mjs +15 -0
  32. package/dist/esm/createTokens.mjs.map +7 -0
  33. package/dist/esm/createVariable.mjs +78 -0
  34. package/dist/esm/createVariable.mjs.map +7 -0
  35. package/dist/esm/createVariables.mjs +35 -0
  36. package/dist/esm/createVariables.mjs.map +7 -0
  37. package/dist/esm/helpers/RNComponents.mjs +16 -0
  38. package/dist/esm/helpers/RNComponents.mjs.map +7 -0
  39. package/dist/esm/helpers/ThemeManager.mjs +209 -0
  40. package/dist/esm/helpers/ThemeManager.mjs.map +7 -0
  41. package/dist/esm/helpers/ThemeManagerContext.mjs +6 -0
  42. package/dist/esm/helpers/ThemeManagerContext.mjs.map +7 -0
  43. package/dist/esm/helpers/createMediaStyle.mjs +42 -0
  44. package/dist/esm/helpers/createMediaStyle.mjs.map +7 -0
  45. package/dist/esm/helpers/createPropMapper.mjs +396 -0
  46. package/dist/esm/helpers/createPropMapper.mjs.map +7 -0
  47. package/dist/esm/helpers/createProxy.mjs +19 -0
  48. package/dist/esm/helpers/createProxy.mjs.map +7 -0
  49. package/dist/esm/helpers/expandStyle.mjs +71 -0
  50. package/dist/esm/helpers/expandStyle.mjs.map +7 -0
  51. package/dist/esm/helpers/expandStyles.mjs +90 -0
  52. package/dist/esm/helpers/expandStyles.mjs.map +7 -0
  53. package/dist/esm/helpers/extendStaticConfig.mjs +66 -0
  54. package/dist/esm/helpers/extendStaticConfig.mjs.map +7 -0
  55. package/dist/esm/helpers/getAnimationDriver.mjs +8 -0
  56. package/dist/esm/helpers/getAnimationDriver.mjs.map +7 -0
  57. package/dist/esm/helpers/getExpandedShorthands.mjs +16 -0
  58. package/dist/esm/helpers/getExpandedShorthands.mjs.map +7 -0
  59. package/dist/esm/helpers/getFontLanguage.mjs +5 -0
  60. package/dist/esm/helpers/getFontLanguage.mjs.map +7 -0
  61. package/dist/esm/helpers/getSplitStyles.mjs +849 -0
  62. package/dist/esm/helpers/getSplitStyles.mjs.map +7 -0
  63. package/dist/esm/helpers/getStylesAtomic.mjs +200 -0
  64. package/dist/esm/helpers/getStylesAtomic.mjs.map +7 -0
  65. package/dist/esm/helpers/getStylesAtomic.native.mjs +12 -0
  66. package/dist/esm/helpers/getStylesAtomic.native.mjs.map +7 -0
  67. package/dist/esm/helpers/getThemeCSSRules.mjs +86 -0
  68. package/dist/esm/helpers/getThemeCSSRules.mjs.map +7 -0
  69. package/dist/esm/helpers/getThemeCSSRules.native.mjs +7 -0
  70. package/dist/esm/helpers/getThemeCSSRules.native.mjs.map +7 -0
  71. package/dist/esm/helpers/getVariantExtras.mjs +67 -0
  72. package/dist/esm/helpers/getVariantExtras.mjs.map +7 -0
  73. package/dist/esm/helpers/insertStyleRule.mjs +186 -0
  74. package/dist/esm/helpers/insertStyleRule.mjs.map +7 -0
  75. package/dist/esm/helpers/isObj.mjs +5 -0
  76. package/dist/esm/helpers/isObj.mjs.map +7 -0
  77. package/dist/esm/helpers/isTamaguiComponent.mjs +8 -0
  78. package/dist/esm/helpers/isTamaguiComponent.mjs.map +7 -0
  79. package/dist/esm/helpers/isTamaguiElement.mjs +9 -0
  80. package/dist/esm/helpers/isTamaguiElement.mjs.map +7 -0
  81. package/dist/esm/helpers/matchMedia.mjs +17 -0
  82. package/dist/esm/helpers/matchMedia.mjs.map +7 -0
  83. package/dist/esm/helpers/matchMedia.native.mjs +23 -0
  84. package/dist/esm/helpers/matchMedia.native.mjs.map +7 -0
  85. package/dist/esm/helpers/mergeProps.mjs +30 -0
  86. package/dist/esm/helpers/mergeProps.mjs.map +7 -0
  87. package/dist/esm/helpers/mergeTransform.mjs +21 -0
  88. package/dist/esm/helpers/mergeTransform.mjs.map +7 -0
  89. package/dist/esm/helpers/normalizeColor.mjs +36 -0
  90. package/dist/esm/helpers/normalizeColor.mjs.map +7 -0
  91. package/dist/esm/helpers/normalizeValueWithProperty.mjs +113 -0
  92. package/dist/esm/helpers/normalizeValueWithProperty.mjs.map +7 -0
  93. package/dist/esm/helpers/proxyThemeVariables.mjs +16 -0
  94. package/dist/esm/helpers/proxyThemeVariables.mjs.map +7 -0
  95. package/dist/esm/helpers/pseudoDescriptors.mjs +29 -0
  96. package/dist/esm/helpers/pseudoDescriptors.mjs.map +7 -0
  97. package/dist/esm/helpers/registerCSSVariable.mjs +14 -0
  98. package/dist/esm/helpers/registerCSSVariable.mjs.map +7 -0
  99. package/dist/esm/helpers/themeable.mjs +28 -0
  100. package/dist/esm/helpers/themeable.mjs.map +7 -0
  101. package/dist/esm/helpers/themes.mjs +53 -0
  102. package/dist/esm/helpers/themes.mjs.map +7 -0
  103. package/dist/esm/helpers/timer.mjs +11 -0
  104. package/dist/esm/helpers/timer.mjs.map +7 -0
  105. package/dist/esm/helpers/useShallowSetState.mjs +35 -0
  106. package/dist/esm/helpers/useShallowSetState.mjs.map +7 -0
  107. package/dist/esm/helpers/warnOnce.mjs +14 -0
  108. package/dist/esm/helpers/warnOnce.mjs.map +7 -0
  109. package/dist/esm/helpers/withStaticProperties.mjs +8 -0
  110. package/dist/esm/helpers/withStaticProperties.mjs.map +7 -0
  111. package/dist/esm/hooks/getThemeUnwrapped.mjs +9 -0
  112. package/dist/esm/hooks/getThemeUnwrapped.mjs.map +7 -0
  113. package/dist/esm/hooks/useId.mjs +5 -0
  114. package/dist/esm/hooks/useId.mjs.map +7 -0
  115. package/dist/esm/hooks/useIsTouchDevice.mjs +9 -0
  116. package/dist/esm/hooks/useIsTouchDevice.mjs.map +7 -0
  117. package/dist/esm/hooks/useMedia.mjs +225 -0
  118. package/dist/esm/hooks/useMedia.mjs.map +7 -0
  119. package/dist/esm/hooks/useSafeRef.mjs +35 -0
  120. package/dist/esm/hooks/useSafeRef.mjs.map +7 -0
  121. package/dist/esm/hooks/useServerHooks.mjs +11 -0
  122. package/dist/esm/hooks/useServerHooks.mjs.map +7 -0
  123. package/dist/esm/hooks/useStyle.mjs +37 -0
  124. package/dist/esm/hooks/useStyle.mjs.map +7 -0
  125. package/dist/esm/hooks/useTheme.mjs +205 -0
  126. package/dist/esm/hooks/useTheme.mjs.map +7 -0
  127. package/dist/esm/hooks/useThemeName.mjs +28 -0
  128. package/dist/esm/hooks/useThemeName.mjs.map +7 -0
  129. package/dist/esm/index.mjs +77 -0
  130. package/dist/esm/index.mjs.map +7 -0
  131. package/dist/esm/inject-styles.mjs +16 -0
  132. package/dist/esm/inject-styles.mjs.map +7 -0
  133. package/dist/esm/insertFont.mjs +67 -0
  134. package/dist/esm/insertFont.mjs.map +7 -0
  135. package/dist/esm/setupHooks.mjs +9 -0
  136. package/dist/esm/setupHooks.mjs.map +7 -0
  137. package/dist/esm/setupReactNative.mjs +25 -0
  138. package/dist/esm/setupReactNative.mjs.map +7 -0
  139. package/dist/esm/styled.mjs +71 -0
  140. package/dist/esm/styled.mjs.map +7 -0
  141. package/dist/esm/types.mjs +1 -0
  142. package/dist/esm/types.mjs.map +7 -0
  143. package/dist/esm/updateTheme.mjs +23 -0
  144. package/dist/esm/updateTheme.mjs.map +7 -0
  145. package/dist/esm/views/FontLanguage.mjs +17 -0
  146. package/dist/esm/views/FontLanguage.mjs.map +7 -0
  147. package/dist/esm/views/FontLanguage.native.mjs +11 -0
  148. package/dist/esm/views/FontLanguage.native.mjs.map +7 -0
  149. package/dist/esm/views/FontLanguage.types.mjs +1 -0
  150. package/dist/esm/views/FontLanguage.types.mjs.map +7 -0
  151. package/dist/esm/views/Slot.mjs +66 -0
  152. package/dist/esm/views/Slot.mjs.map +7 -0
  153. package/dist/esm/views/Stack.mjs +14 -0
  154. package/dist/esm/views/Stack.mjs.map +7 -0
  155. package/dist/esm/views/TamaguiProvider.mjs +56 -0
  156. package/dist/esm/views/TamaguiProvider.mjs.map +7 -0
  157. package/dist/esm/views/Text.mjs +70 -0
  158. package/dist/esm/views/Text.mjs.map +7 -0
  159. package/dist/esm/views/Theme.mjs +63 -0
  160. package/dist/esm/views/Theme.mjs.map +7 -0
  161. package/dist/esm/views/ThemeProvider.mjs +45 -0
  162. package/dist/esm/views/ThemeProvider.mjs.map +7 -0
  163. package/package.json +11 -11
  164. package/src/createComponent.tsx +7 -6
  165. package/types/createComponent.d.ts.map +1 -1
@@ -0,0 +1,209 @@
1
+ import { getThemes, getTokens } from "../config";
2
+ import { THEME_CLASSNAME_PREFIX, THEME_NAME_SEPARATOR } from "../constants/constants";
3
+ import { getThemeUnwrapped } from "../hooks/getThemeUnwrapped";
4
+ const emptyState = { name: "" };
5
+ function hasNoThemeUpdatingProps(props) {
6
+ return !(props.name || props.componentName || props.inverse || props.reset);
7
+ }
8
+ class ThemeManager {
9
+ constructor(props = {}, parentManager) {
10
+ this.props = props;
11
+ this.themeListeners = /* @__PURE__ */ new Set();
12
+ this.parentManager = null;
13
+ this.state = emptyState;
14
+ this._allKeys = null;
15
+ if (parentManager === "root") {
16
+ this.updateState(props, false);
17
+ return;
18
+ }
19
+ if (!parentManager) {
20
+ if (process.env.NODE_ENV !== "production") {
21
+ console.trace();
22
+ throw new Error(`No parent manager given`);
23
+ }
24
+ throw `\u274C`;
25
+ }
26
+ this.themeListeners = parentManager.themeListeners;
27
+ if (hasNoThemeUpdatingProps(props)) {
28
+ return parentManager;
29
+ }
30
+ if (parentManager) {
31
+ this.parentManager = parentManager;
32
+ }
33
+ const updatedState = this.getStateIfChanged(props);
34
+ if (updatedState) {
35
+ this.state = updatedState;
36
+ return;
37
+ }
38
+ return parentManager || this;
39
+ }
40
+ updateState(props = this.props || {}, notify = true) {
41
+ const shouldFlush = (() => {
42
+ if (props.forceTheme) {
43
+ this.state.theme = props.forceTheme;
44
+ this.state.name = props.name || "";
45
+ return true;
46
+ }
47
+ const nextState = this.getStateIfChanged(props);
48
+ if (nextState) {
49
+ this.state = nextState;
50
+ return true;
51
+ }
52
+ })();
53
+ if (shouldFlush) {
54
+ this._allKeys = null;
55
+ notify && this.notify();
56
+ return this.state;
57
+ }
58
+ }
59
+ getStateIfChanged(props = this.props, state = this.state, parentManager = this.parentManager) {
60
+ const _ = this.getState(props, parentManager);
61
+ if (state && state !== emptyState && !_) {
62
+ return parentManager == null ? void 0 : parentManager.state;
63
+ }
64
+ if (this.getStateShouldChange(_, state)) {
65
+ return _;
66
+ }
67
+ }
68
+ getStateShouldChange(nextState, state = this.state) {
69
+ if (!(nextState == null ? void 0 : nextState.theme) || nextState.theme === (state == null ? void 0 : state.theme)) {
70
+ return false;
71
+ }
72
+ return true;
73
+ }
74
+ getState(props = this.props, parentManager = this.parentManager) {
75
+ return getState(props, parentManager) || (process.env.TAMAGUI_TARGET === "native" ? (parentManager == null ? void 0 : parentManager.state) || null : null);
76
+ }
77
+ get allKeys() {
78
+ var _a;
79
+ this._allKeys ||= /* @__PURE__ */ new Set([
80
+ ...((_a = this.parentManager) == null ? void 0 : _a.allKeys) || [],
81
+ ...Object.keys(this.state.theme || {})
82
+ ]);
83
+ return this._allKeys;
84
+ }
85
+ // gets value going up to parents
86
+ getValue(key, state) {
87
+ if (!key)
88
+ return;
89
+ let theme = (state || this.state).theme;
90
+ let manager = this;
91
+ while (theme && manager) {
92
+ if (key in theme) {
93
+ return theme[key];
94
+ }
95
+ manager = manager.parentManager;
96
+ theme = manager == null ? void 0 : manager.state.theme;
97
+ }
98
+ const tokens = getTokens();
99
+ if (key in tokens.color) {
100
+ return tokens.color[key];
101
+ }
102
+ }
103
+ notify() {
104
+ this.themeListeners.forEach((cb) => cb(this.state.name, this));
105
+ }
106
+ onChangeTheme(cb) {
107
+ this.themeListeners.add(cb);
108
+ return () => {
109
+ this.themeListeners.delete(cb);
110
+ };
111
+ }
112
+ }
113
+ function getNextThemeClassName(name, isInverting = false) {
114
+ const next = `${THEME_CLASSNAME_PREFIX}${name}`;
115
+ if (isInverting) {
116
+ return next;
117
+ }
118
+ return next.replace("light_", "").replace("dark_", "");
119
+ }
120
+ const cache = /* @__PURE__ */ new WeakMap();
121
+ function getState(props, parentManager) {
122
+ var _a, _b, _c;
123
+ const cached = cache.get(props);
124
+ if (cached && cached[0] === parentManager) {
125
+ return cached[1];
126
+ }
127
+ const themes = getThemes();
128
+ if (props.name && props.reset) {
129
+ throw new Error("Cannot reset + set new name");
130
+ }
131
+ if (props.reset && !(parentManager == null ? void 0 : parentManager.parentManager)) {
132
+ throw new Error("Cannot reset no grandparent exists");
133
+ }
134
+ let result = null;
135
+ const nextName = props.reset ? ((_b = (_a = parentManager == null ? void 0 : parentManager.parentManager) == null ? void 0 : _a.state) == null ? void 0 : _b.name) || "" : props.name || "";
136
+ const { componentName } = props;
137
+ const parentName = ((_c = parentManager == null ? void 0 : parentManager.state) == null ? void 0 : _c.name) || "";
138
+ const base = parentName.split(THEME_NAME_SEPARATOR);
139
+ const lastSegment = base[base.length - 1];
140
+ const isParentAComponentTheme = parentName && lastSegment[0].toUpperCase() === lastSegment[0];
141
+ if (isParentAComponentTheme) {
142
+ base.pop();
143
+ }
144
+ const parentBaseTheme = isParentAComponentTheme ? base.slice(0, base.length).join(THEME_NAME_SEPARATOR) : parentName;
145
+ const max = base.length;
146
+ const min = componentName && !nextName ? max : 0;
147
+ if (process.env.NODE_ENV === "development" && props.debug === "verbose")
148
+ [console.groupCollapsed("ThemeManager.getState()", props, { parentName, parentBaseTheme, base, min, max, isParentAComponentTheme }), console.trace(), console.groupEnd()];
149
+ for (let i = max; i >= min; i--) {
150
+ let prefix = base.slice(0, i).join(THEME_NAME_SEPARATOR);
151
+ if (props.inverse) {
152
+ prefix = inverseThemeName(prefix);
153
+ }
154
+ const potentials = [];
155
+ if (prefix && prefix !== parentBaseTheme) {
156
+ potentials.push(prefix);
157
+ }
158
+ if (nextName) {
159
+ potentials.unshift(prefix ? `${prefix}_${nextName}` : nextName);
160
+ }
161
+ if (i === 1) {
162
+ const lastSegment2 = potentials.findIndex((x) => !x.includes("_"));
163
+ if (lastSegment2 > 0) {
164
+ potentials.splice(lastSegment2, 0, nextName);
165
+ }
166
+ }
167
+ if (componentName) {
168
+ if (nextName) {
169
+ potentials.push(
170
+ `${prefix.slice(
171
+ 0,
172
+ prefix.indexOf(THEME_NAME_SEPARATOR)
173
+ )}_${nextName}_${componentName}`
174
+ );
175
+ }
176
+ potentials.push(`${prefix}_${componentName}`);
177
+ if (nextName) {
178
+ potentials.unshift(`${prefix}_${nextName}_${componentName}`);
179
+ }
180
+ }
181
+ const found = potentials.find((t) => t in themes);
182
+ if (process.env.NODE_ENV === "development" && props.debug === "verbose")
183
+ console.log("getState found", found, "from", potentials, "parentName", parentName);
184
+ if (found) {
185
+ if (found === parentName) {
186
+ break;
187
+ }
188
+ result = {
189
+ name: found,
190
+ theme: getThemeUnwrapped(themes[found]),
191
+ className: getNextThemeClassName(found, props.inverse),
192
+ parentName
193
+ };
194
+ break;
195
+ }
196
+ }
197
+ if (parentManager) {
198
+ cache.set(props, [parentManager, result]);
199
+ }
200
+ return result;
201
+ }
202
+ const inverseThemeName = (themeName) => {
203
+ return themeName.startsWith("light") ? themeName.replace(/^light/, "dark") : themeName.replace(/^dark/, "light");
204
+ };
205
+ export {
206
+ ThemeManager,
207
+ hasNoThemeUpdatingProps
208
+ };
209
+ //# sourceMappingURL=ThemeManager.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/helpers/ThemeManager.tsx"],
4
+ "sourcesContent": ["import { getThemes, getTokens } from '../config'\nimport { THEME_CLASSNAME_PREFIX, THEME_NAME_SEPARATOR } from '../constants/constants'\nimport { getThemeUnwrapped } from '../hooks/getThemeUnwrapped'\nimport { ThemeParsed, ThemeProps } from '../types'\n\ntype ThemeListener = (name: string | null, themeManager: ThemeManager) => void\n\nexport type SetActiveThemeProps = {\n className?: string\n parentManager?: ThemeManager | null\n name?: string | null\n theme?: any\n reset?: boolean\n}\n\nexport type ThemeManagerState = {\n name: string\n theme?: ThemeParsed | null\n className?: string\n parentName?: string\n}\n\nconst emptyState: ThemeManagerState = { name: '' }\n\nexport function hasNoThemeUpdatingProps(props: ThemeProps) {\n return !(props.name || props.componentName || props.inverse || props.reset)\n}\n\nexport class ThemeManager {\n themeListeners = new Set<ThemeListener>()\n parentManager: ThemeManager | null = null\n state: ThemeManagerState = emptyState\n\n constructor(\n public props: ThemeProps = {},\n parentManager?: ThemeManager | 'root' | null | undefined\n ) {\n if (parentManager === 'root') {\n this.updateState(props, false)\n return\n }\n if (!parentManager) {\n if (process.env.NODE_ENV !== 'production') {\n console.trace()\n throw new Error(`No parent manager given`)\n }\n throw `\u274C`\n }\n // copy over listeners\n this.themeListeners = parentManager.themeListeners\n\n // no change no props\n if (hasNoThemeUpdatingProps(props)) {\n return parentManager\n }\n if (parentManager) {\n this.parentManager = parentManager\n }\n const updatedState = this.getStateIfChanged(props)\n if (updatedState) {\n this.state = updatedState\n return\n }\n return parentManager || this\n }\n\n updateState(\n props: ThemeProps & { forceTheme?: ThemeParsed } = this.props || {},\n notify = true\n ) {\n const shouldFlush = (() => {\n if (props.forceTheme) {\n this.state.theme = props.forceTheme\n this.state.name = props.name || ''\n return true\n }\n const nextState = this.getStateIfChanged(props)\n if (nextState) {\n this.state = nextState\n return true\n }\n })()\n if (shouldFlush) {\n // reset any derived state\n this._allKeys = null\n notify && this.notify()\n return this.state\n }\n }\n\n getStateIfChanged(\n props = this.props,\n state: ThemeManagerState | null = this.state,\n parentManager = this.parentManager\n ) {\n const _ = this.getState(props, parentManager)\n // is removing\n if (state && state !== emptyState && !_) {\n return parentManager?.state\n }\n if (this.getStateShouldChange(_, state)) {\n return _\n }\n }\n\n getStateShouldChange(\n nextState: ThemeManagerState | null,\n state: ThemeManagerState | null = this.state\n ) {\n if (!nextState?.theme || nextState.theme === state?.theme) {\n return false\n }\n return true\n }\n\n getState(props = this.props, parentManager = this.parentManager) {\n return (\n getState(props, parentManager) ||\n (process.env.TAMAGUI_TARGET === 'native' ? parentManager?.state || null : null)\n )\n }\n\n _allKeys: Set<string> | null = null\n get allKeys() {\n this._allKeys ||= new Set([\n ...(this.parentManager?.allKeys || []),\n ...Object.keys(this.state.theme || {}),\n ])\n return this._allKeys\n }\n\n // gets value going up to parents\n getValue(key: string, state?: ThemeManagerState) {\n if (!key) return\n let theme = (state || this.state).theme\n let manager = this as ThemeManager | null\n while (theme && manager) {\n if (key in theme) {\n return theme[key]\n }\n manager = manager.parentManager\n theme = manager?.state.theme\n }\n const tokens = getTokens()\n if (key in tokens.color) {\n return tokens.color[key]\n }\n }\n\n notify() {\n this.themeListeners.forEach((cb) => cb(this.state.name, this))\n }\n\n onChangeTheme(cb: ThemeListener) {\n this.themeListeners.add(cb)\n return () => {\n this.themeListeners.delete(cb)\n }\n }\n}\n\nfunction getNextThemeClassName(name: string, isInverting = false) {\n const next = `${THEME_CLASSNAME_PREFIX}${name}`\n if (isInverting) {\n return next\n }\n return next.replace('light_', '').replace('dark_', '')\n}\n\nconst cache = new WeakMap<ThemeProps, [ThemeManager, ThemeManagerState | null]>()\n\nfunction getState(\n props: ThemeProps,\n parentManager?: ThemeManager | null\n): ThemeManagerState | null {\n const cached = cache.get(props)\n if (cached && cached[0] === parentManager) {\n return cached[1]\n }\n\n const themes = getThemes()\n\n if (props.name && props.reset) {\n throw new Error('Cannot reset + set new name')\n }\n if (props.reset && !parentManager?.parentManager) {\n throw new Error('Cannot reset no grandparent exists')\n }\n\n let result: ThemeManagerState | null = null\n\n const nextName = props.reset\n ? parentManager?.parentManager?.state?.name || ''\n : props.name || ''\n const { componentName } = props\n const parentName = parentManager?.state?.name || ''\n\n // components look for most specific, fallback upwards\n const base = parentName.split(THEME_NAME_SEPARATOR)\n const lastSegment = base[base.length - 1]\n const isParentAComponentTheme =\n parentName && lastSegment[0].toUpperCase() === lastSegment[0]\n if (isParentAComponentTheme) {\n base.pop() // always remove componentName they can't nest\n }\n const parentBaseTheme = isParentAComponentTheme\n ? base.slice(0, base.length).join(THEME_NAME_SEPARATOR)\n : parentName\n const max = base.length\n const min =\n componentName && !nextName\n ? max // component name only don't search upwards\n : 0\n\n // prettier-ignore\n // eslint-disable-next-line no-console\n if (process.env.NODE_ENV === 'development' && props.debug === 'verbose') [ console.groupCollapsed('ThemeManager.getState()', props, { parentName, parentBaseTheme, base, min, max, isParentAComponentTheme }), console.trace(), console.groupEnd() ]\n\n for (let i = max; i >= min; i--) {\n let prefix = base.slice(0, i).join(THEME_NAME_SEPARATOR)\n if (props.inverse) {\n prefix = inverseThemeName(prefix)\n }\n const potentials: string[] = []\n if (prefix && prefix !== parentBaseTheme) {\n potentials.push(prefix)\n }\n if (nextName) {\n potentials.unshift(prefix ? `${prefix}_${nextName}` : nextName)\n }\n if (i === 1) {\n const lastSegment = potentials.findIndex((x) => !x.includes('_'))\n if (lastSegment > 0) {\n potentials.splice(lastSegment, 0, nextName) // last try prefer our new name to parent\n }\n }\n if (componentName) {\n // components only look for component themes\n if (nextName) {\n potentials.push(\n `${prefix.slice(\n 0,\n prefix.indexOf(THEME_NAME_SEPARATOR)\n )}_${nextName}_${componentName}`\n )\n }\n potentials.push(`${prefix}_${componentName}`)\n if (nextName) {\n potentials.unshift(`${prefix}_${nextName}_${componentName}`)\n }\n }\n\n const found = potentials.find((t) => t in themes)\n\n // eslint-disable-next-line no-console\n if (process.env.NODE_ENV === 'development' && props.debug === 'verbose')\n console.log('getState found', found, 'from', potentials, 'parentName', parentName)\n\n if (found) {\n // optimization return null if not changed\n if (found === parentName) {\n break\n }\n result = {\n name: found,\n theme: getThemeUnwrapped(themes[found]),\n className: getNextThemeClassName(found, props.inverse),\n parentName,\n }\n break\n }\n }\n\n if (parentManager) {\n cache.set(props, [parentManager, result])\n }\n\n return result\n}\n\nconst inverseThemeName = (themeName: string) => {\n return themeName.startsWith('light')\n ? themeName.replace(/^light/, 'dark')\n : themeName.replace(/^dark/, 'light')\n}\n"],
5
+ "mappings": "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",
6
+ "names": ["lastSegment"]
7
+ }
@@ -0,0 +1,6 @@
1
+ import { createContext } from "react";
2
+ const ThemeManagerContext = createContext(null);
3
+ export {
4
+ ThemeManagerContext
5
+ };
6
+ //# sourceMappingURL=ThemeManagerContext.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/helpers/ThemeManagerContext.tsx"],
4
+ "sourcesContent": ["import { createContext } from 'react'\n\nimport { ThemeManager } from './ThemeManager'\n\nexport const ThemeManagerContext = createContext<ThemeManager | null>(null)\n"],
5
+ "mappings": "AAAA,SAAS,qBAAqB;AAIvB,MAAM,sBAAsB,cAAmC,IAAI;",
6
+ "names": []
7
+ }
@@ -0,0 +1,42 @@
1
+ import { mediaObjectToString } from "../hooks/useMedia";
2
+ const MEDIA_SEP = "_";
3
+ let prefixes = null;
4
+ let selectors = null;
5
+ const createMediaStyle = ({ property, identifier, rules }, mediaKey, mediaQueries, negate) => {
6
+ if (!(prefixes && selectors)) {
7
+ const mediaKeys = Object.keys(mediaQueries);
8
+ prefixes = Object.fromEntries(
9
+ mediaKeys.map((key, index) => [key, new Array(index + 1).fill(":root").join("")])
10
+ );
11
+ selectors = Object.fromEntries(
12
+ mediaKeys.map((key) => [key, mediaObjectToString(mediaQueries[key])])
13
+ );
14
+ }
15
+ const precendencePrefix = prefixes[mediaKey];
16
+ const mediaSelector = selectors[mediaKey];
17
+ const negKey = negate ? "0" : "";
18
+ const ogPrefix = identifier.slice(0, identifier.indexOf("-") + 1);
19
+ const nextIdentifier = `${identifier.replace(
20
+ ogPrefix,
21
+ `${ogPrefix}${MEDIA_SEP}${mediaKey}${negKey}${MEDIA_SEP}`
22
+ )}`;
23
+ const screenStr = negate ? "not all and" : "";
24
+ const mediaQuery = `${screenStr} ${mediaSelector}`;
25
+ const styleInner = rules.map((rule) => rule.replace(identifier, nextIdentifier)).join(";");
26
+ let styleRule = "";
27
+ if (styleInner.includes("@media")) {
28
+ styleRule = styleInner.replace("{", ` and ${mediaQuery} {`);
29
+ } else {
30
+ styleRule = `@media ${mediaQuery} { ${precendencePrefix} ${styleInner} }`;
31
+ }
32
+ return {
33
+ property,
34
+ rules: [styleRule],
35
+ identifier: nextIdentifier
36
+ };
37
+ };
38
+ export {
39
+ MEDIA_SEP,
40
+ createMediaStyle
41
+ };
42
+ //# sourceMappingURL=createMediaStyle.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/helpers/createMediaStyle.ts"],
4
+ "sourcesContent": ["import { StyleObject } from '@tamagui/helpers'\n\nimport { mediaObjectToString } from '../hooks/useMedia'\nimport { MediaQueries, PartialStyleObject } from '../types'\n\n// TODO have this be used by extractMediaStyle in tamagui static\n// not synced to static/constants for now\nexport const MEDIA_SEP = '_'\n\nlet prefixes: Record<string, string> | null = null\nlet selectors: Record<string, string> | null = null\n\nexport const createMediaStyle = (\n { property, identifier, rules }: StyleObject,\n mediaKey: string,\n mediaQueries: MediaQueries,\n negate?: boolean\n): PartialStyleObject => {\n if (!(prefixes && selectors)) {\n // TODO move this into useMedia calc once there and unify w getMediaImportance\n const mediaKeys = Object.keys(mediaQueries)\n prefixes = Object.fromEntries(\n mediaKeys.map((key, index) => [key, new Array(index + 1).fill(':root').join('')])\n )\n selectors = Object.fromEntries(\n mediaKeys.map((key) => [key, mediaObjectToString(mediaQueries[key])])\n )\n }\n const precendencePrefix = prefixes[mediaKey]\n const mediaSelector = selectors[mediaKey]\n const negKey = negate ? '0' : ''\n const ogPrefix = identifier.slice(0, identifier.indexOf('-') + 1)\n const nextIdentifier = `${identifier.replace(\n ogPrefix,\n `${ogPrefix}${MEDIA_SEP}${mediaKey}${negKey}${MEDIA_SEP}`\n )}`\n const screenStr = negate ? 'not all and' : ''\n const mediaQuery = `${screenStr} ${mediaSelector}`\n const styleInner = rules\n .map((rule) => rule.replace(identifier, nextIdentifier))\n .join(';')\n // combines media queries if they already exist\n let styleRule = ''\n if (styleInner.includes('@media')) {\n // combine\n styleRule = styleInner.replace('{', ` and ${mediaQuery} {`)\n } else {\n styleRule = `@media ${mediaQuery} { ${precendencePrefix} ${styleInner} }`\n }\n return {\n property,\n rules: [styleRule],\n identifier: nextIdentifier,\n }\n}\n"],
5
+ "mappings": "AAEA,SAAS,2BAA2B;AAK7B,MAAM,YAAY;AAEzB,IAAI,WAA0C;AAC9C,IAAI,YAA2C;AAExC,MAAM,mBAAmB,CAC9B,EAAE,UAAU,YAAY,MAAM,GAC9B,UACA,cACA,WACuB;AACvB,MAAI,EAAE,YAAY,YAAY;AAE5B,UAAM,YAAY,OAAO,KAAK,YAAY;AAC1C,eAAW,OAAO;AAAA,MAChB,UAAU,IAAI,CAAC,KAAK,UAAU,CAAC,KAAK,IAAI,MAAM,QAAQ,CAAC,EAAE,KAAK,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;AAAA,IAClF;AACA,gBAAY,OAAO;AAAA,MACjB,UAAU,IAAI,CAAC,QAAQ,CAAC,KAAK,oBAAoB,aAAa,GAAG,CAAC,CAAC,CAAC;AAAA,IACtE;AAAA,EACF;AACA,QAAM,oBAAoB,SAAS,QAAQ;AAC3C,QAAM,gBAAgB,UAAU,QAAQ;AACxC,QAAM,SAAS,SAAS,MAAM;AAC9B,QAAM,WAAW,WAAW,MAAM,GAAG,WAAW,QAAQ,GAAG,IAAI,CAAC;AAChE,QAAM,iBAAiB,GAAG,WAAW;AAAA,IACnC;AAAA,IACA,GAAG,WAAW,YAAY,WAAW,SAAS;AAAA,EAChD;AACA,QAAM,YAAY,SAAS,gBAAgB;AAC3C,QAAM,aAAa,GAAG,aAAa;AACnC,QAAM,aAAa,MAChB,IAAI,CAAC,SAAS,KAAK,QAAQ,YAAY,cAAc,CAAC,EACtD,KAAK,GAAG;AAEX,MAAI,YAAY;AAChB,MAAI,WAAW,SAAS,QAAQ,GAAG;AAEjC,gBAAY,WAAW,QAAQ,KAAK,QAAQ,cAAc;AAAA,EAC5D,OAAO;AACL,gBAAY,UAAU,gBAAgB,qBAAqB;AAAA,EAC7D;AACA,SAAO;AAAA,IACL;AAAA,IACA,OAAO,CAAC,SAAS;AAAA,IACjB,YAAY;AAAA,EACd;AACF;",
6
+ "names": []
7
+ }