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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (220) hide show
  1. package/dist/cjs/Tamagui.js +4 -2
  2. package/dist/cjs/Tamagui.js.map +2 -2
  3. package/dist/cjs/config.js +1 -2
  4. package/dist/cjs/config.js.map +2 -2
  5. package/dist/cjs/constants/constants.js +13 -8
  6. package/dist/cjs/constants/constants.js.map +2 -2
  7. package/dist/cjs/contexts/TextAncestorContext.js +3 -16
  8. package/dist/cjs/contexts/TextAncestorContext.js.map +3 -3
  9. package/dist/cjs/createComponent.js +204 -294
  10. package/dist/cjs/createComponent.js.map +2 -2
  11. package/dist/cjs/createTamagui.js +15 -16
  12. package/dist/cjs/createTamagui.js.map +3 -3
  13. package/dist/cjs/createVariable.js +1 -2
  14. package/dist/cjs/createVariable.js.map +2 -2
  15. package/dist/cjs/helpers/ThemeManager.js +7 -14
  16. package/dist/cjs/helpers/ThemeManager.js.map +2 -2
  17. package/dist/cjs/helpers/{createShallowUpdate.js → cache.js} +20 -21
  18. package/dist/cjs/helpers/cache.js.map +7 -0
  19. package/dist/cjs/helpers/createMediaStyle.js +14 -8
  20. package/dist/cjs/helpers/createMediaStyle.js.map +2 -2
  21. package/dist/cjs/helpers/extendStaticConfig.js +0 -1
  22. package/dist/cjs/helpers/extendStaticConfig.js.map +2 -2
  23. package/dist/cjs/helpers/getSplitStyles.js +212 -93
  24. package/dist/cjs/helpers/getSplitStyles.js.map +3 -3
  25. package/dist/cjs/helpers/getStylesAtomic.js +16 -36
  26. package/dist/cjs/helpers/getStylesAtomic.js.map +3 -3
  27. package/dist/cjs/helpers/insertStyleRule.js +14 -6
  28. package/dist/cjs/helpers/insertStyleRule.js.map +2 -2
  29. package/dist/cjs/helpers/matchMedia.js.map +2 -2
  30. package/dist/cjs/helpers/mergeTransform.js.map +1 -1
  31. package/dist/cjs/helpers/normalizeValueWithProperty.js +32 -2
  32. package/dist/cjs/helpers/normalizeValueWithProperty.js.map +2 -2
  33. package/dist/cjs/helpers/useShallowSetState.js.map +2 -2
  34. package/dist/cjs/hooks/getThemeUnwrapped.js +1 -3
  35. package/dist/cjs/hooks/getThemeUnwrapped.js.map +2 -2
  36. package/dist/cjs/hooks/useElementLayout.js +92 -0
  37. package/dist/cjs/hooks/useElementLayout.js.map +7 -0
  38. package/dist/cjs/hooks/useIsTouchDevice.js +2 -10
  39. package/dist/cjs/hooks/useIsTouchDevice.js.map +2 -2
  40. package/dist/cjs/hooks/useMedia.js +77 -84
  41. package/dist/cjs/hooks/useMedia.js.map +2 -2
  42. package/dist/cjs/hooks/useMedia.test.js +2 -0
  43. package/dist/cjs/{helpers/validate.js.map → hooks/useMedia.test.js.map} +0 -0
  44. package/dist/cjs/hooks/usePressablePressResponder.js +370 -0
  45. package/dist/cjs/hooks/usePressablePressResponder.js.map +7 -0
  46. package/dist/cjs/hooks/useSafeRef.js +13 -15
  47. package/dist/cjs/hooks/useSafeRef.js.map +2 -2
  48. package/dist/cjs/hooks/useTheme.js +3 -4
  49. package/dist/cjs/hooks/useTheme.js.map +2 -2
  50. package/dist/cjs/index.js +1 -17
  51. package/dist/cjs/index.js.map +2 -2
  52. package/dist/cjs/static.js +0 -20
  53. package/dist/cjs/static.js.map +2 -2
  54. package/dist/cjs/styled.js +4 -22
  55. package/dist/cjs/styled.js.map +2 -2
  56. package/dist/cjs/types.js.map +1 -1
  57. package/dist/cjs/{hooks/useIsSSR.js → views/AbsoluteFill.js} +18 -23
  58. package/dist/cjs/views/AbsoluteFill.js.map +7 -0
  59. package/dist/cjs/views/AbsoluteFill.native.js +45 -0
  60. package/dist/cjs/views/AbsoluteFill.native.js.map +7 -0
  61. package/dist/cjs/views/FontLanguage.native.js.map +2 -2
  62. package/dist/cjs/views/Stack.js.map +1 -1
  63. package/dist/cjs/views/TamaguiProvider.js +3 -2
  64. package/dist/cjs/views/TamaguiProvider.js.map +2 -2
  65. package/dist/cjs/views/Text.js.map +1 -1
  66. package/dist/cjs/views/ThemeReset.js +10 -10
  67. package/dist/cjs/views/ThemeReset.js.map +2 -2
  68. package/dist/esm/Tamagui.js +4 -2
  69. package/dist/esm/Tamagui.js.map +2 -2
  70. package/dist/esm/config.js +1 -2
  71. package/dist/esm/config.js.map +2 -2
  72. package/dist/esm/constants/constants.js +11 -7
  73. package/dist/esm/constants/constants.js.map +2 -2
  74. package/dist/esm/contexts/TextAncestorContext.js +2 -13
  75. package/dist/esm/contexts/TextAncestorContext.js.map +2 -2
  76. package/dist/esm/createComponent.js +203 -296
  77. package/dist/esm/createComponent.js.map +2 -2
  78. package/dist/esm/createTamagui.js +15 -16
  79. package/dist/esm/createTamagui.js.map +3 -3
  80. package/dist/esm/createVariable.js +1 -2
  81. package/dist/esm/createVariable.js.map +2 -2
  82. package/dist/esm/helpers/ThemeManager.js +7 -14
  83. package/dist/esm/helpers/ThemeManager.js.map +2 -2
  84. package/dist/esm/helpers/cache.js +18 -0
  85. package/dist/esm/helpers/cache.js.map +7 -0
  86. package/dist/esm/helpers/createMediaStyle.js +14 -8
  87. package/dist/esm/helpers/createMediaStyle.js.map +2 -2
  88. package/dist/esm/helpers/extendStaticConfig.js +0 -1
  89. package/dist/esm/helpers/extendStaticConfig.js.map +2 -2
  90. package/dist/esm/helpers/getSplitStyles.js +221 -94
  91. package/dist/esm/helpers/getSplitStyles.js.map +3 -3
  92. package/dist/esm/helpers/getStylesAtomic.js +13 -26
  93. package/dist/esm/helpers/getStylesAtomic.js.map +2 -2
  94. package/dist/esm/helpers/insertStyleRule.js +14 -6
  95. package/dist/esm/helpers/insertStyleRule.js.map +2 -2
  96. package/dist/esm/helpers/matchMedia.js.map +2 -2
  97. package/dist/esm/helpers/mergeTransform.js.map +1 -1
  98. package/dist/esm/helpers/normalizeValueWithProperty.js +30 -1
  99. package/dist/esm/helpers/normalizeValueWithProperty.js.map +2 -2
  100. package/dist/esm/helpers/useShallowSetState.js.map +2 -2
  101. package/dist/esm/hooks/getThemeUnwrapped.js +1 -3
  102. package/dist/esm/hooks/getThemeUnwrapped.js.map +2 -2
  103. package/dist/esm/hooks/useElementLayout.js +66 -0
  104. package/dist/esm/hooks/useElementLayout.js.map +7 -0
  105. package/dist/esm/hooks/useIsTouchDevice.js +3 -11
  106. package/dist/esm/hooks/useIsTouchDevice.js.map +2 -2
  107. package/dist/esm/hooks/useMedia.js +74 -83
  108. package/dist/esm/hooks/useMedia.js.map +2 -2
  109. package/dist/esm/hooks/useMedia.test.js +1 -0
  110. package/dist/esm/{helpers/validate.js.map → hooks/useMedia.test.js.map} +0 -0
  111. package/dist/esm/hooks/usePressablePressResponder.js +346 -0
  112. package/dist/esm/hooks/usePressablePressResponder.js.map +7 -0
  113. package/dist/esm/hooks/useSafeRef.js +13 -15
  114. package/dist/esm/hooks/useSafeRef.js.map +2 -2
  115. package/dist/esm/hooks/useTheme.js +3 -4
  116. package/dist/esm/hooks/useTheme.js.map +2 -2
  117. package/dist/esm/index.js +1 -14
  118. package/dist/esm/index.js.map +2 -2
  119. package/dist/esm/static.js +0 -14
  120. package/dist/esm/static.js.map +2 -2
  121. package/dist/esm/styled.js +4 -22
  122. package/dist/esm/styled.js.map +2 -2
  123. package/dist/esm/views/AbsoluteFill.js +17 -0
  124. package/dist/esm/views/AbsoluteFill.js.map +7 -0
  125. package/dist/esm/views/AbsoluteFill.native.js +21 -0
  126. package/dist/esm/views/AbsoluteFill.native.js.map +7 -0
  127. package/dist/esm/views/FontLanguage.native.js.map +2 -2
  128. package/dist/esm/views/Stack.js.map +1 -1
  129. package/dist/esm/views/TamaguiProvider.js +5 -4
  130. package/dist/esm/views/TamaguiProvider.js.map +2 -2
  131. package/dist/esm/views/Text.js.map +1 -1
  132. package/dist/esm/views/ThemeReset.js +10 -10
  133. package/dist/esm/views/ThemeReset.js.map +2 -2
  134. package/package.json +14 -14
  135. package/src/Tamagui.ts +7 -3
  136. package/src/config.ts +2 -3
  137. package/src/constants/constants.ts +10 -6
  138. package/src/contexts/TextAncestorContext.tsx +1 -8
  139. package/src/createComponent.tsx +256 -421
  140. package/src/createTamagui.ts +16 -19
  141. package/src/createVariable.ts +1 -3
  142. package/src/helpers/ThemeManager.tsx +7 -15
  143. package/src/helpers/cache.ts +18 -0
  144. package/src/helpers/createMediaStyle.ts +16 -9
  145. package/src/helpers/extendStaticConfig.ts +0 -1
  146. package/src/helpers/getSplitStyles.tsx +257 -151
  147. package/src/helpers/getStylesAtomic.ts +14 -34
  148. package/src/helpers/insertStyleRule.tsx +16 -8
  149. package/src/helpers/matchMedia.ts +1 -0
  150. package/src/helpers/mergeTransform.ts +1 -1
  151. package/src/helpers/normalizeValueWithProperty.ts +30 -0
  152. package/src/helpers/useShallowSetState.tsx +0 -1
  153. package/src/hooks/getThemeUnwrapped.tsx +1 -2
  154. package/src/hooks/useElementLayout.tsx +90 -0
  155. package/src/hooks/useIsTouchDevice.tsx +3 -17
  156. package/src/hooks/useMedia.tsx +80 -87
  157. package/src/hooks/useSafeRef.ts +17 -18
  158. package/src/hooks/useTheme.tsx +4 -4
  159. package/src/index.ts +1 -11
  160. package/src/static.ts +0 -10
  161. package/src/styled.tsx +15 -33
  162. package/src/types.tsx +58 -55
  163. package/src/views/FontLanguage.native.tsx +1 -0
  164. package/src/views/Stack.tsx +1 -1
  165. package/src/views/TamaguiProvider.tsx +5 -5
  166. package/src/views/Text.tsx +1 -1
  167. package/src/views/ThemeReset.tsx +11 -11
  168. package/types/Tamagui.d.ts +6 -4
  169. package/types/constants/constants.d.ts +14 -3
  170. package/types/contexts/TextAncestorContext.d.ts +1 -3
  171. package/types/createComponent.d.ts +0 -15
  172. package/types/helpers/ThemeManager.d.ts +2 -3
  173. package/types/helpers/cache.d.ts +12 -0
  174. package/types/helpers/calc.d.ts +0 -16
  175. package/types/helpers/createMediaStyle.d.ts +1 -1
  176. package/types/helpers/getSplitStyles.d.ts +6 -10
  177. package/types/helpers/getStylesAtomic.d.ts +1 -5
  178. package/types/helpers/insertStyleRule.d.ts +2 -2
  179. package/types/helpers/mergeTransform.d.ts +1 -1
  180. package/types/helpers/normalizeValueWithProperty.d.ts +1 -0
  181. package/types/hooks/useElementLayout.d.ts +27 -0
  182. package/types/hooks/useMedia.d.ts +3 -1
  183. package/types/hooks/useMedia.test.d.ts +1 -0
  184. package/types/hooks/usePressablePressResponder.d.ts +84 -0
  185. package/types/index.d.ts +1 -11
  186. package/types/static.d.ts +0 -1
  187. package/types/types.d.ts +42 -44
  188. package/types/views/AbsoluteFill.d.ts +5 -0
  189. package/types/views/AbsoluteFill.native.d.ts +3 -0
  190. package/types/views/Stack.d.ts +1 -1
  191. package/types/views/Text.d.ts +1 -1
  192. package/dist/cjs/constants/platform.js +0 -74
  193. package/dist/cjs/constants/platform.js.map +0 -7
  194. package/dist/cjs/constants/platform.native.js +0 -62
  195. package/dist/cjs/constants/platform.native.js.map +0 -7
  196. package/dist/cjs/helpers/createShallowUpdate.js.map +0 -7
  197. package/dist/cjs/helpers/validate.js +0 -2
  198. package/dist/cjs/hooks/useDidFinishSSR.js +0 -60
  199. package/dist/cjs/hooks/useDidFinishSSR.js.map +0 -7
  200. package/dist/cjs/hooks/useIsSSR.js.map +0 -7
  201. package/dist/esm/constants/platform.js +0 -39
  202. package/dist/esm/constants/platform.js.map +0 -7
  203. package/dist/esm/constants/platform.native.js +0 -28
  204. package/dist/esm/constants/platform.native.js.map +0 -7
  205. package/dist/esm/helpers/createShallowUpdate.js +0 -20
  206. package/dist/esm/helpers/createShallowUpdate.js.map +0 -7
  207. package/dist/esm/helpers/validate.js +0 -1
  208. package/dist/esm/hooks/useDidFinishSSR.js +0 -35
  209. package/dist/esm/hooks/useDidFinishSSR.js.map +0 -7
  210. package/dist/esm/hooks/useIsSSR.js +0 -22
  211. package/dist/esm/hooks/useIsSSR.js.map +0 -7
  212. package/src/helpers/assignNativePropsToWeb.tsx +0 -178
  213. package/src/helpers/calc.ts +0 -68
  214. package/src/helpers/getFont.tsx +0 -43
  215. package/src/helpers/getStackSize.ts +0 -22
  216. package/src/helpers/startTransition.ts +0 -4
  217. package/src/hooks/useConstant.tsx +0 -19
  218. package/src/hooks/useIsMounted.ts +0 -16
  219. package/src/hooks/usePressable.tsx +0 -9
  220. package/src/hooks/useUnmountEffect.ts +0 -5
@@ -0,0 +1,92 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+ var useElementLayout_exports = {};
20
+ __export(useElementLayout_exports, {
21
+ getRect: () => getRect,
22
+ measureLayout: () => measureLayout,
23
+ useElementLayout: () => useElementLayout
24
+ });
25
+ module.exports = __toCommonJS(useElementLayout_exports);
26
+ var import_constants = require("@tamagui/constants");
27
+ var import_react_native_use_responder_events = require("@tamagui/react-native-use-responder-events");
28
+ var import_use_event = require("@tamagui/use-event");
29
+ const LayoutHandlers = /* @__PURE__ */ new WeakMap();
30
+ let resizeObserver = null;
31
+ if (typeof window !== "undefined" && "ResizeObserver" in window) {
32
+ resizeObserver = new ResizeObserver((entries) => {
33
+ for (const { target } of entries) {
34
+ const onLayout = LayoutHandlers.get(target);
35
+ if (typeof onLayout !== "function")
36
+ return;
37
+ measureLayout(target, null, (x, y, width, height, left, top) => {
38
+ onLayout({
39
+ nativeEvent: {
40
+ layout: { x, y, width, height, left, top },
41
+ target
42
+ },
43
+ timeStamp: Date.now()
44
+ });
45
+ });
46
+ }
47
+ });
48
+ }
49
+ const getRect = (node) => {
50
+ const rect = (0, import_react_native_use_responder_events.getBoundingClientRect)(node);
51
+ if (!rect)
52
+ return;
53
+ const { x, y, top, left } = rect;
54
+ return { x, y, width: node.offsetWidth, height: node.offsetHeight, top, left };
55
+ };
56
+ const measureLayout = (node, relativeTo, callback) => {
57
+ const relativeNode = relativeTo || (node == null ? void 0 : node.parentNode);
58
+ if (relativeNode instanceof HTMLElement) {
59
+ setTimeout(() => {
60
+ const relativeRect = (0, import_react_native_use_responder_events.getBoundingClientRect)(relativeNode);
61
+ const { height, left, top, width } = getRect(node);
62
+ const x = left - relativeRect.left;
63
+ const y = top - relativeRect.top;
64
+ callback(x, y, width, height, left, top);
65
+ }, 0);
66
+ }
67
+ };
68
+ const idFn = () => {
69
+ };
70
+ function useElementLayout(ref, onLayout) {
71
+ const hasLayoutEvent = !!onLayout;
72
+ const onLayoutEvent = (0, import_use_event.useEvent)(onLayout || idFn);
73
+ (0, import_constants.useIsomorphicLayoutEffect)(() => {
74
+ if (!resizeObserver || !hasLayoutEvent)
75
+ return;
76
+ const node = ref.current;
77
+ if (!node)
78
+ return;
79
+ LayoutHandlers.set(node, onLayoutEvent);
80
+ resizeObserver.observe(node);
81
+ return () => {
82
+ resizeObserver == null ? void 0 : resizeObserver.unobserve(node);
83
+ };
84
+ }, [ref, hasLayoutEvent]);
85
+ }
86
+ // Annotate the CommonJS export names for ESM import in node:
87
+ 0 && (module.exports = {
88
+ getRect,
89
+ measureLayout,
90
+ useElementLayout
91
+ });
92
+ //# sourceMappingURL=useElementLayout.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/hooks/useElementLayout.tsx"],
4
+ "sourcesContent": ["import { useIsomorphicLayoutEffect } from '@tamagui/constants'\nimport { getBoundingClientRect } from '@tamagui/react-native-use-responder-events'\nimport { useEvent } from '@tamagui/use-event'\nimport { RefObject } from 'react'\n\nconst LayoutHandlers = new WeakMap<Element, Function>()\n\nexport type LayoutValue = {\n x: number\n y: number\n width: number\n height: number\n left: number\n top: number\n}\n\nexport type LayoutEvent = {\n nativeEvent: {\n layout: LayoutValue\n target: any\n }\n timeStamp: number\n}\n\nlet resizeObserver: ResizeObserver | null = null\n\nif (typeof window !== 'undefined' && 'ResizeObserver' in window) {\n resizeObserver = new ResizeObserver((entries) => {\n for (const { target } of entries) {\n const onLayout = LayoutHandlers.get(target)\n if (typeof onLayout !== 'function') return\n measureLayout(target as HTMLElement, null, (x, y, width, height, left, top) => {\n onLayout({\n nativeEvent: {\n layout: { x, y, width, height, left, top },\n target,\n },\n timeStamp: Date.now(),\n })\n })\n }\n })\n}\n\nexport const getRect = (node: HTMLElement) => {\n const rect = getBoundingClientRect(node)\n if (!rect) return\n const { x, y, top, left } = rect\n return { x, y, width: node.offsetWidth, height: node.offsetHeight, top, left }\n}\n\nexport const measureLayout = (\n node: HTMLElement,\n relativeTo: HTMLElement | null,\n callback: Function\n) => {\n const relativeNode = relativeTo || node?.parentNode\n if (relativeNode instanceof HTMLElement) {\n setTimeout(() => {\n const relativeRect = getBoundingClientRect(relativeNode)!\n const { height, left, top, width } = getRect(node)!\n const x = left - relativeRect.left\n const y = top - relativeRect.top\n callback(x, y, width, height, left, top)\n }, 0)\n }\n}\n\nconst idFn = () => {}\n\nexport function useElementLayout(\n ref: RefObject<Element>,\n onLayout?: ((e: LayoutEvent) => void) | null\n) {\n const hasLayoutEvent = !!onLayout\n const onLayoutEvent = useEvent(onLayout || idFn)\n\n // Observing is done in a separate effect to avoid this effect running\n // when 'onLayout' changes.\n useIsomorphicLayoutEffect(() => {\n if (!resizeObserver || !hasLayoutEvent) return\n const node = ref.current\n if (!node) return\n LayoutHandlers.set(node, onLayoutEvent)\n resizeObserver.observe(node)\n return () => {\n resizeObserver?.unobserve(node)\n }\n }, [ref, hasLayoutEvent])\n}\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAA0C;AAC1C,+CAAsC;AACtC,uBAAyB;AAGzB,MAAM,iBAAiB,oBAAI,QAA2B;AAmBtD,IAAI,iBAAwC;AAE5C,IAAI,OAAO,WAAW,eAAe,oBAAoB,QAAQ;AAC/D,mBAAiB,IAAI,eAAe,CAAC,YAAY;AAC/C,eAAW,EAAE,OAAO,KAAK,SAAS;AAChC,YAAM,WAAW,eAAe,IAAI,MAAM;AAC1C,UAAI,OAAO,aAAa;AAAY;AACpC,oBAAc,QAAuB,MAAM,CAAC,GAAG,GAAG,OAAO,QAAQ,MAAM,QAAQ;AAC7E,iBAAS;AAAA,UACP,aAAa;AAAA,YACX,QAAQ,EAAE,GAAG,GAAG,OAAO,QAAQ,MAAM,IAAI;AAAA,YACzC;AAAA,UACF;AAAA,UACA,WAAW,KAAK,IAAI;AAAA,QACtB,CAAC;AAAA,MACH,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AACH;AAEO,MAAM,UAAU,CAAC,SAAsB;AAC5C,QAAM,WAAO,gEAAsB,IAAI;AACvC,MAAI,CAAC;AAAM;AACX,QAAM,EAAE,GAAG,GAAG,KAAK,KAAK,IAAI;AAC5B,SAAO,EAAE,GAAG,GAAG,OAAO,KAAK,aAAa,QAAQ,KAAK,cAAc,KAAK,KAAK;AAC/E;AAEO,MAAM,gBAAgB,CAC3B,MACA,YACA,aACG;AACH,QAAM,eAAe,eAAc,6BAAM;AACzC,MAAI,wBAAwB,aAAa;AACvC,eAAW,MAAM;AACf,YAAM,mBAAe,gEAAsB,YAAY;AACvD,YAAM,EAAE,QAAQ,MAAM,KAAK,MAAM,IAAI,QAAQ,IAAI;AACjD,YAAM,IAAI,OAAO,aAAa;AAC9B,YAAM,IAAI,MAAM,aAAa;AAC7B,eAAS,GAAG,GAAG,OAAO,QAAQ,MAAM,GAAG;AAAA,IACzC,GAAG,CAAC;AAAA,EACN;AACF;AAEA,MAAM,OAAO,MAAM;AAAC;AAEb,SAAS,iBACd,KACA,UACA;AACA,QAAM,iBAAiB,CAAC,CAAC;AACzB,QAAM,oBAAgB,2BAAS,YAAY,IAAI;AAI/C,kDAA0B,MAAM;AAC9B,QAAI,CAAC,kBAAkB,CAAC;AAAgB;AACxC,UAAM,OAAO,IAAI;AACjB,QAAI,CAAC;AAAM;AACX,mBAAe,IAAI,MAAM,aAAa;AACtC,mBAAe,QAAQ,IAAI;AAC3B,WAAO,MAAM;AACX,uDAAgB,UAAU;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,KAAK,cAAc,CAAC;AAC1B;",
6
+ "names": []
7
+ }
@@ -22,17 +22,9 @@ __export(useIsTouchDevice_exports, {
22
22
  });
23
23
  module.exports = __toCommonJS(useIsTouchDevice_exports);
24
24
  var import_constants = require("@tamagui/constants");
25
- var import_react = require("react");
25
+ var import_use_did_finish_ssr = require("@tamagui/use-did-finish-ssr");
26
26
  const useIsTouchDevice = () => {
27
- const [touchOnly, setTouchOnly] = (0, import_react.useState)(false);
28
- if (import_constants.isWeb && !import_constants.isServer) {
29
- (0, import_constants.useIsomorphicLayoutEffect)(() => {
30
- if (import_constants.isTouchable) {
31
- setTouchOnly(true);
32
- }
33
- }, []);
34
- }
35
- return touchOnly;
27
+ return !import_constants.isWeb ? true : (0, import_use_did_finish_ssr.useDidFinishSSR)() ? import_constants.isTouchable : false;
36
28
  };
37
29
  // Annotate the CommonJS export names for ESM import in node:
38
30
  0 && (module.exports = {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/hooks/useIsTouchDevice.tsx"],
4
- "sourcesContent": ["import { isServer, isTouchable, isWeb, useIsomorphicLayoutEffect } from '@tamagui/constants'\nimport { useState } from 'react'\n\n// ssr friendly\n\nexport const useIsTouchDevice = () => {\n const [touchOnly, setTouchOnly] = useState(false)\n\n if (isWeb && !isServer) {\n // only ever false on web SSR (env), so run effect conditionally\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useIsomorphicLayoutEffect(() => {\n if (isTouchable) {\n setTouchOnly(true)\n }\n }, [])\n }\n\n return touchOnly\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAwE;AACxE,mBAAyB;AAIlB,MAAM,mBAAmB,MAAM;AACpC,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,KAAK;AAEhD,MAAI,0BAAS,CAAC,2BAAU;AAGtB,oDAA0B,MAAM;AAC9B,UAAI,8BAAa;AACf,qBAAa,IAAI;AAAA,MACnB;AAAA,IACF,GAAG,CAAC,CAAC;AAAA,EACP;AAEA,SAAO;AACT;",
4
+ "sourcesContent": ["import { isTouchable, isWeb } from '@tamagui/constants'\nimport { useDidFinishSSR } from '@tamagui/use-did-finish-ssr'\n\nexport const useIsTouchDevice = () => {\n return !isWeb ? true : useDidFinishSSR() ? isTouchable : false\n}\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAmC;AACnC,gCAAgC;AAEzB,MAAM,mBAAmB,MAAM;AACpC,SAAO,CAAC,yBAAQ,WAAO,2CAAgB,IAAI,+BAAc;AAC3D;",
6
6
  "names": []
7
7
  }
@@ -22,13 +22,15 @@ __export(useMedia_exports, {
22
22
  configureMedia: () => configureMedia,
23
23
  getInitialMediaState: () => getInitialMediaState,
24
24
  getMedia: () => getMedia,
25
+ getMediaKeyImportance: () => getMediaKeyImportance,
25
26
  mediaObjectToString: () => mediaObjectToString,
26
27
  mediaQueryConfig: () => mediaQueryConfig,
27
28
  mediaState: () => mediaState,
29
+ mergeMediaByImportance: () => mergeMediaByImportance,
28
30
  removeMediaQueryListener: () => removeMediaQueryListener,
29
31
  useMedia: () => useMedia,
30
- useMediaPropsActive: () => useMediaPropsActive,
31
- useMediaQueryListeners: () => useMediaQueryListeners
32
+ useMediaListeners: () => useMediaListeners,
33
+ useMediaPropsActive: () => useMediaPropsActive
32
34
  });
33
35
  module.exports = __toCommonJS(useMedia_exports);
34
36
  var import_constants = require("@tamagui/constants");
@@ -48,31 +50,30 @@ const mediaState = process.env.NODE_ENV === "development" ? (0, import_createPro
48
50
  }
49
51
  }
50
52
  ) : {};
51
- const mediaQueryListeners = {};
53
+ const listeners = {};
52
54
  function addMediaQueryListener(key, cb) {
53
55
  if (process.env.NODE_ENV === "development" && key[0] === "$") {
54
56
  console.warn(`Warning, listening to media queries shouldn't use the "$" prefix`);
55
57
  }
56
- mediaQueryListeners[key] = mediaQueryListeners[key] || /* @__PURE__ */ new Set();
57
- mediaQueryListeners[key].add(cb);
58
+ listeners[key] = listeners[key] || /* @__PURE__ */ new Set();
59
+ listeners[key].add(cb);
58
60
  return () => removeMediaQueryListener(key, cb);
59
61
  }
60
62
  function removeMediaQueryListener(key, cb) {
61
63
  var _a;
62
- (_a = mediaQueryListeners[key]) == null ? void 0 : _a.delete(cb);
64
+ (_a = listeners[key]) == null ? void 0 : _a.delete(cb);
63
65
  }
64
66
  const mediaQueryConfig = {};
65
67
  const getMedia = () => {
66
68
  return mediaState;
67
69
  };
68
- let currentMediaState;
69
- let initialMediaState;
70
+ let curState;
71
+ let initState;
70
72
  const getInitialMediaState = () => {
71
- if ((0, import_config.getConfig)().disableSSR) {
72
- return currentMediaState || {};
73
- }
74
- return initialMediaState || {};
73
+ return ((0, import_config.getConfig)().disableSSR ? curState : initState) || {};
75
74
  };
75
+ let mediaKeysOrdered;
76
+ const getMediaKeyImportance = (key) => mediaKeysOrdered.indexOf(key[0] === "$" ? key.slice(1) : key) + 2;
76
77
  const dispose = /* @__PURE__ */ new Set();
77
78
  const configureMedia = (config) => {
78
79
  const { media, mediaQueryDefaultActive } = config;
@@ -82,8 +83,9 @@ const configureMedia = (config) => {
82
83
  mediaState[key] = (mediaQueryDefaultActive == null ? void 0 : mediaQueryDefaultActive[key]) || false;
83
84
  }
84
85
  Object.assign(mediaQueryConfig, media);
85
- currentMediaState = { ...mediaState };
86
- initialMediaState = currentMediaState;
86
+ curState = { ...mediaState };
87
+ initState = curState;
88
+ mediaKeysOrdered = Object.keys(media);
87
89
  if (config.disableSSR) {
88
90
  setupMediaListeners();
89
91
  }
@@ -100,119 +102,108 @@ function setupMediaListeners() {
100
102
  }
101
103
  configuredKey = nextKey;
102
104
  unlisten();
103
- (0, import_react.startTransition)(() => {
104
- for (const key in mediaQueryConfig) {
105
- let update2 = function() {
106
- const next = !!getMatch().matches;
107
- if (next === mediaState[key])
108
- return;
109
- mediaState[key] = next;
110
- currentMediaState = { ...mediaState };
111
- const listeners = mediaQueryListeners[key];
112
- if (listeners == null ? void 0 : listeners.size) {
113
- listeners.forEach((cb) => cb(next));
114
- }
115
- };
116
- var update = update2;
117
- const str = mediaObjectToString(mediaQueryConfig[key]);
118
- const getMatch = () => (0, import_matchMedia.matchMedia)(str);
119
- const match = getMatch();
120
- if (!match) {
121
- throw new Error("\u26A0\uFE0F No match");
105
+ for (const key in mediaQueryConfig) {
106
+ let update2 = function() {
107
+ const next = !!getMatch().matches;
108
+ if (next === mediaState[key])
109
+ return;
110
+ mediaState[key] = next;
111
+ curState = { ...mediaState };
112
+ const cur = listeners[key];
113
+ if (cur == null ? void 0 : cur.size) {
114
+ cur.forEach((cb) => cb(next));
122
115
  }
123
- match.addListener(update2);
124
- dispose.add(() => match.removeListener(update2));
125
- update2();
116
+ };
117
+ var update = update2;
118
+ const str = mediaObjectToString(mediaQueryConfig[key]);
119
+ const getMatch = () => (0, import_matchMedia.matchMedia)(str);
120
+ const match = getMatch();
121
+ if (!match) {
122
+ throw new Error("\u26A0\uFE0F No match");
126
123
  }
127
- });
124
+ match.addListener(update2);
125
+ dispose.add(() => match.removeListener(update2));
126
+ update2();
127
+ }
128
128
  }
129
- function useMediaQueryListeners(config) {
130
- if (config.disableSSR) {
129
+ function useMediaListeners(config) {
130
+ if (config.disableSSR)
131
131
  return;
132
- }
133
132
  (0, import_react.useEffect)(() => {
134
133
  setupMediaListeners();
135
134
  return unlisten;
136
135
  }, []);
137
136
  }
138
137
  function useMedia() {
139
- const [state, setState] = (0, import_react.useState)(initialMediaState || {});
140
138
  const keys = (0, import_useSafeRef.useSafeRef)({});
139
+ const [state, setState] = (0, import_react.useState)(() => getMediaState(initState || {}, keys));
141
140
  function updateState() {
142
141
  setState((prev) => {
143
142
  for (const key in keys.current) {
144
143
  if (prev[key] !== mediaState[key]) {
145
- return { ...mediaState };
144
+ return getMediaState({ ...mediaState }, keys);
146
145
  }
147
146
  }
148
147
  return prev;
149
148
  });
150
149
  }
151
150
  (0, import_constants.useIsomorphicLayoutEffect)(() => {
152
- const disposes = Object.keys(keys.current).map(
151
+ updateState();
152
+ const disposers = Object.keys(keys.current).map(
153
153
  (key) => addMediaQueryListener(key, updateState)
154
154
  );
155
- updateState();
156
155
  return () => {
157
- disposes.forEach((cb) => cb());
156
+ disposers.forEach((cb) => cb());
158
157
  };
159
- });
160
- return (0, import_react.useMemo)(
161
- () => new Proxy(state, {
162
- get(_, key) {
163
- if (process.env.NODE_ENV === "development") {
164
- if (!currentMediaState) {
165
- throw new Error(
166
- `To use useMedia() you must pass in media configuration to createTamagui, none was found.`
167
- );
168
- }
169
- }
170
- if (!keys.current[key]) {
171
- keys.current[key] = true;
172
- }
173
- return Reflect.get(state, key);
158
+ }, [keys.current]);
159
+ return state;
160
+ }
161
+ function getMediaState(state, keys) {
162
+ return new Proxy(state, {
163
+ get(_, key) {
164
+ if (!keys.current[key]) {
165
+ keys.current[key] = true;
174
166
  }
175
- }),
176
- [state, keys]
177
- );
167
+ return Reflect.get(state, key);
168
+ }
169
+ });
178
170
  }
179
171
  function useMediaPropsActive(props) {
180
172
  const media = useMedia();
181
173
  return (0, import_react.useMemo)(() => {
182
- const evaluated = {};
183
- const lastSetImportanceForKey = {};
174
+ const next = {};
175
+ const importancesUsed = {};
184
176
  const propNames = Object.keys(props);
185
- const mediaKeysOrdered = Object.keys(getMedia());
186
- function update(k, v, importance = 0) {
187
- if (lastSetImportanceForKey[k] > importance) {
188
- return;
189
- }
190
- lastSetImportanceForKey[k] = importance;
191
- evaluated[k] = v;
192
- }
193
177
  for (let i = propNames.length - 1; i >= 0; i--) {
194
178
  const key = propNames[i];
195
179
  const val = props[key];
196
180
  if (key[0] === "$") {
197
- const shortKey = key.slice(1);
198
- if (!media[shortKey]) {
181
+ if (!media[key.slice(1)]) {
199
182
  continue;
200
183
  }
201
184
  if (val && typeof val === "object") {
202
- const subPropNames = Object.keys(val);
203
- const mediaImportance = mediaKeysOrdered.indexOf(shortKey);
204
- for (let j = subPropNames.length; j--; j >= 0) {
205
- const skey = subPropNames[j];
206
- update(skey, val[skey], mediaImportance);
185
+ const subKeys = Object.keys(val);
186
+ for (let j = subKeys.length; j--; j >= 0) {
187
+ const subKey = subKeys[j];
188
+ mergeMediaByImportance(next, subKey, val[subKey], importancesUsed);
207
189
  }
208
190
  }
209
191
  } else {
210
- update(key, val);
192
+ mergeMediaByImportance(next, key, val, importancesUsed);
211
193
  }
212
194
  }
213
- return evaluated;
195
+ return next;
214
196
  }, [media, props]);
215
197
  }
198
+ function mergeMediaByImportance(onto, key, value, importancesUsed) {
199
+ const importance = getMediaKeyImportance(key);
200
+ if (importancesUsed[key] > importance) {
201
+ return false;
202
+ }
203
+ importancesUsed[key] = importance;
204
+ onto[key] = value;
205
+ return true;
206
+ }
216
207
  function camelToHyphen(str) {
217
208
  return str.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`).toLowerCase();
218
209
  }
@@ -237,12 +228,14 @@ function mediaObjectToString(query) {
237
228
  configureMedia,
238
229
  getInitialMediaState,
239
230
  getMedia,
231
+ getMediaKeyImportance,
240
232
  mediaObjectToString,
241
233
  mediaQueryConfig,
242
234
  mediaState,
235
+ mergeMediaByImportance,
243
236
  removeMediaQueryListener,
244
237
  useMedia,
245
- useMediaPropsActive,
246
- useMediaQueryListeners
238
+ useMediaListeners,
239
+ useMediaPropsActive
247
240
  });
248
241
  //# sourceMappingURL=useMedia.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/hooks/useMedia.tsx"],
4
- "sourcesContent": ["import { useIsomorphicLayoutEffect } from '@tamagui/constants'\nimport { startTransition, useEffect, useMemo, useState } from 'react'\n\nimport { getConfig } from '../config'\nimport { createProxy } from '../helpers/createProxy'\nimport { matchMedia } from '../helpers/matchMedia'\nimport {\n MediaQueries,\n MediaQueryKey,\n MediaQueryObject,\n MediaQueryState,\n TamaguiInternalConfig,\n} from '../types'\nimport { useSafeRef } from './useSafeRef'\n\nexport const mediaState: MediaQueryState =\n // development time safeguard\n process.env.NODE_ENV === 'development'\n ? createProxy(\n {},\n {\n get(target, key) {\n if (typeof key === 'string' && key[0] === '$') {\n throw new Error(`Access of mediaState should never include $`)\n }\n return Reflect.get(target, key)\n },\n }\n )\n : ({} as any)\n\ntype MediaListener = (next: boolean) => void\n\nconst mediaQueryListeners: { [key: string]: Set<MediaListener> } = {}\n\nexport function addMediaQueryListener(key: MediaQueryKey, cb: MediaListener) {\n if (process.env.NODE_ENV === 'development' && key[0] === '$') {\n // eslint-disable-next-line no-console\n console.warn(`Warning, listening to media queries shouldn't use the \"$\" prefix`)\n }\n mediaQueryListeners[key] = mediaQueryListeners[key] || new Set()\n mediaQueryListeners[key].add(cb)\n return () => removeMediaQueryListener(key, cb)\n}\n\nexport function removeMediaQueryListener(key: MediaQueryKey, cb: MediaListener) {\n mediaQueryListeners[key]?.delete(cb)\n}\n\nexport const mediaQueryConfig: MediaQueries = {}\n\nexport const getMedia = () => {\n return mediaState\n}\n\n// for SSR capture it at time of startup\nlet currentMediaState: MediaQueryState | null\nlet initialMediaState: MediaQueryState | null\n\nexport const getInitialMediaState = () => {\n if (getConfig().disableSSR) {\n return currentMediaState || {}\n }\n return initialMediaState || {}\n}\n\nconst dispose = new Set<Function>()\n\nexport const configureMedia = (config: TamaguiInternalConfig) => {\n const { media, mediaQueryDefaultActive } = config\n if (!media) return\n for (const key in media) {\n mediaState[key] = mediaQueryDefaultActive?.[key] || false\n }\n Object.assign(mediaQueryConfig, media)\n currentMediaState = { ...mediaState }\n initialMediaState = currentMediaState\n if (config.disableSSR) {\n setupMediaListeners()\n }\n}\n\nfunction unlisten() {\n dispose.forEach((cb) => cb())\n dispose.clear()\n}\n\n/**\n * Note: This should *not* set the state on the first render!\n * Because to avoid hydration issues SSR must match the server\n * *and then* re-render with the actual media query state.\n */\nlet configuredKey = ''\nfunction setupMediaListeners() {\n // avoid setting up more than once per config\n const nextKey = JSON.stringify(mediaQueryConfig)\n if (nextKey === configuredKey) {\n return\n }\n configuredKey = nextKey\n\n // hmr, undo existing before re-binding\n unlisten()\n\n // theoretically this should make media reactions smoother but potentially delayed?\n // but i believe consistent, so that's a nicer default (we'll see)\n startTransition(() => {\n for (const key in mediaQueryConfig) {\n const str = mediaObjectToString(mediaQueryConfig[key])\n const getMatch = () => matchMedia(str)\n const match = getMatch()\n if (!match) {\n throw new Error('\u26A0\uFE0F No match')\n }\n // react native needs these deprecated apis for now\n match.addListener(update)\n dispose.add(() => match.removeListener(update))\n\n update()\n\n function update() {\n const next = !!getMatch().matches\n if (next === mediaState[key]) return\n mediaState[key] = next\n currentMediaState = { ...mediaState }\n const listeners = mediaQueryListeners[key]\n if (listeners?.size) {\n listeners.forEach((cb) => cb(next))\n }\n }\n }\n })\n}\n\nexport function useMediaQueryListeners(config: TamaguiInternalConfig) {\n if (config.disableSSR) {\n return\n }\n useEffect(() => {\n setupMediaListeners()\n return unlisten\n }, [])\n}\n\nexport function useMedia(): {\n [key in MediaQueryKey]: boolean\n} {\n const [state, setState] = useState<MediaQueryState>(initialMediaState || {})\n const keys = useSafeRef({} as Record<string, boolean>)\n\n function updateState() {\n setState((prev) => {\n for (const key in keys.current) {\n if (prev[key] !== mediaState[key]) {\n return { ...mediaState }\n }\n }\n return prev\n })\n }\n\n useIsomorphicLayoutEffect(() => {\n const disposes: Function[] = Object.keys(keys.current).map((key) =>\n addMediaQueryListener(key, updateState)\n )\n updateState()\n return () => {\n disposes.forEach((cb) => cb())\n }\n })\n\n return useMemo(\n () =>\n new Proxy(state, {\n get(_, key: string) {\n if (process.env.NODE_ENV === 'development') {\n if (!currentMediaState) {\n throw new Error(\n `To use useMedia() you must pass in media configuration to createTamagui, none was found.`\n )\n }\n }\n if (!keys.current[key]) {\n keys.current[key] = true\n }\n return Reflect.get(state, key)\n },\n }),\n [state, keys]\n )\n}\n\n/**\n * Useful for more complex components that need access to the currently active props,\n * accounting for the currently active media queries.\n *\n * Use sparingly, is will loop props and trigger re-render on all media queries.\n *\n * */\nexport function useMediaPropsActive<A extends Object>(\n props: A\n): {\n // remove all media\n [Key in keyof A extends `$${string}` ? never : keyof A]?: A[Key]\n} {\n const media = useMedia()\n\n return useMemo(() => {\n const evaluated = {} as A\n const lastSetImportanceForKey = {}\n const propNames = Object.keys(props)\n const mediaKeysOrdered = Object.keys(getMedia())\n\n function update(k: string, v: any, importance = 0) {\n if (lastSetImportanceForKey[k] > importance) {\n return\n }\n lastSetImportanceForKey[k] = importance\n evaluated[k] = v\n }\n\n for (let i = propNames.length - 1; i >= 0; i--) {\n const key = propNames[i]\n const val = props[key]\n if (key[0] === '$') {\n const shortKey = key.slice(1)\n if (!media[shortKey]) {\n continue\n }\n if (val && typeof val === 'object') {\n const subPropNames = Object.keys(val)\n const mediaImportance = mediaKeysOrdered.indexOf(shortKey)\n for (let j = subPropNames.length; j--; j >= 0) {\n const skey = subPropNames[j]\n update(skey, val[skey], mediaImportance)\n }\n }\n } else {\n update(key, val)\n }\n }\n\n return evaluated\n }, [media, props])\n}\n\nfunction camelToHyphen(str: string) {\n return str.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`).toLowerCase()\n}\n\nexport function mediaObjectToString(query: string | MediaQueryObject) {\n if (typeof query === 'string') {\n return query\n }\n return Object.entries(query)\n .map(([feature, value]) => {\n feature = camelToHyphen(feature)\n if (typeof value === 'string') {\n return `(${feature}: ${value})`\n }\n if (typeof value === 'number' && /[height|width]$/.test(feature)) {\n value = `${value}px`\n }\n return `(${feature}: ${value})`\n })\n .join(' and ')\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { useIsomorphicLayoutEffect } from '@tamagui/constants'\nimport { MutableRefObject, useEffect, useMemo, useState } from 'react'\n\nimport { getConfig } from '../config'\nimport { createProxy } from '../helpers/createProxy'\nimport { matchMedia } from '../helpers/matchMedia'\nimport {\n MediaQueries,\n MediaQueryKey,\n MediaQueryObject,\n MediaQueryState,\n TamaguiInternalConfig,\n} from '../types'\nimport { useSafeRef } from './useSafeRef'\n\nexport const mediaState: MediaQueryState =\n // development time safeguard\n process.env.NODE_ENV === 'development'\n ? createProxy(\n {},\n {\n get(target, key) {\n if (typeof key === 'string' && key[0] === '$') {\n throw new Error(`Access of mediaState should never include $`)\n }\n return Reflect.get(target, key)\n },\n }\n )\n : ({} as any)\n\ntype MediaListener = (next: boolean) => void\n\nconst listeners: { [key: string]: Set<MediaListener> } = {}\n\nexport function addMediaQueryListener(key: MediaQueryKey, cb: MediaListener) {\n if (process.env.NODE_ENV === 'development' && key[0] === '$') {\n // eslint-disable-next-line no-console\n console.warn(`Warning, listening to media queries shouldn't use the \"$\" prefix`)\n }\n listeners[key] = listeners[key] || new Set()\n listeners[key].add(cb)\n return () => removeMediaQueryListener(key, cb)\n}\n\nexport function removeMediaQueryListener(key: MediaQueryKey, cb: MediaListener) {\n listeners[key]?.delete(cb)\n}\n\nexport const mediaQueryConfig: MediaQueries = {}\n\nexport const getMedia = () => {\n return mediaState\n}\n\n// for SSR capture it at time of startup\nlet curState: MediaQueryState\nlet initState: MediaQueryState\nexport const getInitialMediaState = () => {\n return (getConfig().disableSSR ? curState : initState) || {}\n}\n\nlet mediaKeysOrdered: string[]\nexport const getMediaKeyImportance = (key: string) =>\n // + 2 because we set base usedKeys=1 in getSplitStyles and all media go above 1\n mediaKeysOrdered.indexOf(key[0] === '$' ? key.slice(1) : key) + 2\n\nconst dispose = new Set<Function>()\n\nexport const configureMedia = (config: TamaguiInternalConfig) => {\n const { media, mediaQueryDefaultActive } = config\n if (!media) return\n for (const key in media) {\n mediaState[key] = mediaQueryDefaultActive?.[key] || false\n }\n Object.assign(mediaQueryConfig, media)\n curState = { ...mediaState }\n initState = curState\n mediaKeysOrdered = Object.keys(media)\n if (config.disableSSR) {\n setupMediaListeners()\n }\n}\n\nfunction unlisten() {\n dispose.forEach((cb) => cb())\n dispose.clear()\n}\n\n/**\n * Note: This should *not* set the state on the first render!\n * Because to avoid hydration issues SSR must match the server\n * *and then* re-render with the actual media query state.\n */\nlet configuredKey = ''\nfunction setupMediaListeners() {\n // avoid setting up more than once per config\n const nextKey = JSON.stringify(mediaQueryConfig)\n if (nextKey === configuredKey) {\n return\n }\n configuredKey = nextKey\n\n // hmr, undo existing before re-binding\n unlisten()\n\n for (const key in mediaQueryConfig) {\n const str = mediaObjectToString(mediaQueryConfig[key])\n const getMatch = () => matchMedia(str)\n const match = getMatch()\n if (!match) {\n throw new Error('\u26A0\uFE0F No match')\n }\n // react native needs these deprecated apis for now\n match.addListener(update)\n dispose.add(() => match.removeListener(update))\n\n update()\n\n function update() {\n const next = !!getMatch().matches\n if (next === mediaState[key]) return\n mediaState[key] = next\n curState = { ...mediaState }\n const cur = listeners[key]\n if (cur?.size) {\n cur.forEach((cb) => cb(next))\n }\n }\n }\n}\n\nexport function useMediaListeners(config: TamaguiInternalConfig) {\n if (config.disableSSR) return\n useEffect(() => {\n setupMediaListeners()\n return unlisten\n }, [])\n}\n\nexport function useMedia(): {\n [key in MediaQueryKey]: boolean\n} {\n const keys = useSafeRef({} as Record<string, boolean>)\n const [state, setState] = useState<MediaQueryState>(() => getMediaState(initState || {}, keys))\n\n function updateState() {\n setState((prev) => {\n for (const key in keys.current) {\n if (prev[key] !== mediaState[key]) {\n return getMediaState({ ...mediaState }, keys)\n }\n }\n return prev\n })\n }\n\n useIsomorphicLayoutEffect(() => {\n updateState()\n const disposers = Object.keys(keys.current).map((key) =>\n addMediaQueryListener(key, updateState)\n )\n return () => {\n disposers.forEach((cb) => cb())\n }\n }, [keys.current])\n\n return state\n}\n\nfunction getMediaState(state: MediaQueryState, keys: MutableRefObject<Record<string, boolean>>) {\n return new Proxy(state, {\n get(_, key: string) {\n if (!keys.current[key]) {\n keys.current[key] = true\n }\n return Reflect.get(state, key)\n },\n })\n}\n\n/**\n * Useful for more complex components that need access to the currently active props,\n * accounting for the currently active media queries.\n *\n * Use sparingly, is will loop props and trigger re-render on all media queries.\n *\n * */\nexport function useMediaPropsActive<A extends Object>(\n props: A\n): {\n // remove all media\n [Key in keyof A extends `$${string}` ? never : keyof A]?: A[Key]\n} {\n const media = useMedia()\n\n return useMemo(() => {\n const next = {} as A\n const importancesUsed = {}\n const propNames = Object.keys(props)\n\n for (let i = propNames.length - 1; i >= 0; i--) {\n const key = propNames[i]\n const val = props[key]\n if (key[0] === '$') {\n if (!media[key.slice(1)]) {\n continue\n }\n if (val && typeof val === 'object') {\n const subKeys = Object.keys(val)\n for (let j = subKeys.length; j--; j >= 0) {\n const subKey = subKeys[j]\n mergeMediaByImportance(next, subKey, val[subKey], importancesUsed)\n }\n }\n } else {\n mergeMediaByImportance(next, key, val, importancesUsed)\n }\n }\n\n return next\n }, [media, props])\n}\n\nexport function mergeMediaByImportance(\n onto: Record<string, any>,\n key: string,\n value: any,\n importancesUsed: Record<string, number>\n) {\n const importance = getMediaKeyImportance(key)\n if (importancesUsed[key] > importance) {\n return false\n }\n importancesUsed[key] = importance\n onto[key] = value\n return true\n}\n\nfunction camelToHyphen(str: string) {\n return str.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`).toLowerCase()\n}\n\nexport function mediaObjectToString(query: string | MediaQueryObject) {\n if (typeof query === 'string') {\n return query\n }\n return Object.entries(query)\n .map(([feature, value]) => {\n feature = camelToHyphen(feature)\n if (typeof value === 'string') {\n return `(${feature}: ${value})`\n }\n if (typeof value === 'number' && /[height|width]$/.test(feature)) {\n value = `${value}px`\n }\n return `(${feature}: ${value})`\n })\n .join(' and ')\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["update"]
7
7
  }
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ //# sourceMappingURL=useMedia.test.js.map