@oxyhq/bloom 0.67.0 → 0.69.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 (134) hide show
  1. package/lib/commonjs/animated-check/AnimatedCheck.js +22 -93
  2. package/lib/commonjs/animated-check/AnimatedCheck.js.map +1 -1
  3. package/lib/commonjs/avatar/Avatar.js +6 -24
  4. package/lib/commonjs/avatar/Avatar.js.map +1 -1
  5. package/lib/commonjs/avatar/AvatarRing.js +14 -30
  6. package/lib/commonjs/avatar/AvatarRing.js.map +1 -1
  7. package/lib/commonjs/bottom-sheet/index.js +9 -4
  8. package/lib/commonjs/bottom-sheet/index.js.map +1 -1
  9. package/lib/commonjs/connection-status/index.js +16 -7
  10. package/lib/commonjs/connection-status/index.js.map +1 -1
  11. package/lib/commonjs/connection-status/netinfo.js +119 -0
  12. package/lib/commonjs/connection-status/netinfo.js.map +1 -0
  13. package/lib/commonjs/hooks/haptics-module.js +109 -0
  14. package/lib/commonjs/hooks/haptics-module.js.map +1 -0
  15. package/lib/commonjs/hooks/useHaptics.js +6 -8
  16. package/lib/commonjs/hooks/useHaptics.js.map +1 -1
  17. package/lib/commonjs/loading/SpinnerIcon.js +22 -55
  18. package/lib/commonjs/loading/SpinnerIcon.js.map +1 -1
  19. package/lib/commonjs/theme/adaptive-colors.js +20 -4
  20. package/lib/commonjs/theme/adaptive-colors.js.map +1 -1
  21. package/lib/commonjs/theme/color-scope/style-builder.js +107 -6
  22. package/lib/commonjs/theme/color-scope/style-builder.js.map +1 -1
  23. package/lib/commonjs/theme/init-css-interop.js +13 -11
  24. package/lib/commonjs/theme/init-css-interop.js.map +1 -1
  25. package/lib/commonjs/toast/Toaster.js +5 -0
  26. package/lib/commonjs/toast/Toaster.js.map +1 -1
  27. package/lib/commonjs/toast/use-single-outlet-guard.js +72 -0
  28. package/lib/commonjs/toast/use-single-outlet-guard.js.map +1 -0
  29. package/lib/module/animated-check/AnimatedCheck.js +22 -91
  30. package/lib/module/animated-check/AnimatedCheck.js.map +1 -1
  31. package/lib/module/avatar/Avatar.js +1 -19
  32. package/lib/module/avatar/Avatar.js.map +1 -1
  33. package/lib/module/avatar/AvatarRing.js +7 -23
  34. package/lib/module/avatar/AvatarRing.js.map +1 -1
  35. package/lib/module/bottom-sheet/index.js +9 -4
  36. package/lib/module/bottom-sheet/index.js.map +1 -1
  37. package/lib/module/connection-status/index.js +16 -6
  38. package/lib/module/connection-status/index.js.map +1 -1
  39. package/lib/module/connection-status/netinfo.js +114 -0
  40. package/lib/module/connection-status/netinfo.js.map +1 -0
  41. package/lib/module/hooks/haptics-module.js +104 -0
  42. package/lib/module/hooks/haptics-module.js.map +1 -0
  43. package/lib/module/hooks/useHaptics.js +7 -11
  44. package/lib/module/hooks/useHaptics.js.map +1 -1
  45. package/lib/module/loading/SpinnerIcon.js +13 -46
  46. package/lib/module/loading/SpinnerIcon.js.map +1 -1
  47. package/lib/module/loading/index.web.js +2 -2
  48. package/lib/module/theme/adaptive-colors.js +20 -4
  49. package/lib/module/theme/adaptive-colors.js.map +1 -1
  50. package/lib/module/theme/color-scope/style-builder.js +107 -6
  51. package/lib/module/theme/color-scope/style-builder.js.map +1 -1
  52. package/lib/module/theme/init-css-interop.js +13 -11
  53. package/lib/module/theme/init-css-interop.js.map +1 -1
  54. package/lib/module/toast/Toaster.js +5 -0
  55. package/lib/module/toast/Toaster.js.map +1 -1
  56. package/lib/module/toast/use-single-outlet-guard.js +65 -0
  57. package/lib/module/toast/use-single-outlet-guard.js.map +1 -0
  58. package/lib/typescript/commonjs/animated-check/AnimatedCheck.d.ts.map +1 -1
  59. package/lib/typescript/commonjs/avatar/Avatar.d.ts.map +1 -1
  60. package/lib/typescript/commonjs/avatar/AvatarRing.d.ts.map +1 -1
  61. package/lib/typescript/commonjs/bottom-sheet/index.d.ts.map +1 -1
  62. package/lib/typescript/commonjs/connection-status/index.d.ts.map +1 -1
  63. package/lib/typescript/commonjs/connection-status/netinfo.d.ts +69 -0
  64. package/lib/typescript/commonjs/connection-status/netinfo.d.ts.map +1 -0
  65. package/lib/typescript/commonjs/hooks/haptics-module.d.ts +58 -0
  66. package/lib/typescript/commonjs/hooks/haptics-module.d.ts.map +1 -0
  67. package/lib/typescript/commonjs/hooks/useHaptics.d.ts.map +1 -1
  68. package/lib/typescript/commonjs/loading/SpinnerIcon.d.ts +9 -2
  69. package/lib/typescript/commonjs/loading/SpinnerIcon.d.ts.map +1 -1
  70. package/lib/typescript/commonjs/theme/adaptive-colors.d.ts.map +1 -1
  71. package/lib/typescript/commonjs/theme/color-scope/style-builder.d.ts.map +1 -1
  72. package/lib/typescript/commonjs/theme/init-css-interop.d.ts.map +1 -1
  73. package/lib/typescript/commonjs/toast/Toaster.d.ts.map +1 -1
  74. package/lib/typescript/commonjs/toast/use-single-outlet-guard.d.ts +9 -0
  75. package/lib/typescript/commonjs/toast/use-single-outlet-guard.d.ts.map +1 -0
  76. package/lib/typescript/module/animated-check/AnimatedCheck.d.ts.map +1 -1
  77. package/lib/typescript/module/avatar/Avatar.d.ts.map +1 -1
  78. package/lib/typescript/module/avatar/AvatarRing.d.ts.map +1 -1
  79. package/lib/typescript/module/bottom-sheet/index.d.ts.map +1 -1
  80. package/lib/typescript/module/connection-status/index.d.ts.map +1 -1
  81. package/lib/typescript/module/connection-status/netinfo.d.ts +69 -0
  82. package/lib/typescript/module/connection-status/netinfo.d.ts.map +1 -0
  83. package/lib/typescript/module/hooks/haptics-module.d.ts +58 -0
  84. package/lib/typescript/module/hooks/haptics-module.d.ts.map +1 -0
  85. package/lib/typescript/module/hooks/useHaptics.d.ts.map +1 -1
  86. package/lib/typescript/module/loading/SpinnerIcon.d.ts +9 -2
  87. package/lib/typescript/module/loading/SpinnerIcon.d.ts.map +1 -1
  88. package/lib/typescript/module/theme/adaptive-colors.d.ts.map +1 -1
  89. package/lib/typescript/module/theme/color-scope/style-builder.d.ts.map +1 -1
  90. package/lib/typescript/module/theme/init-css-interop.d.ts.map +1 -1
  91. package/lib/typescript/module/toast/Toaster.d.ts.map +1 -1
  92. package/lib/typescript/module/toast/use-single-outlet-guard.d.ts +9 -0
  93. package/lib/typescript/module/toast/use-single-outlet-guard.d.ts.map +1 -0
  94. package/package.json +348 -88
  95. package/src/__tests__/color-scope-nativewind.test.ts +135 -0
  96. package/src/__tests__/connection-status-netinfo.test.tsx +203 -0
  97. package/src/__tests__/exports-map-contract.test.ts +112 -0
  98. package/src/__tests__/optional-peer-imports.test.ts +406 -0
  99. package/src/__tests__/svg-required-peer.test.tsx +75 -0
  100. package/src/__tests__/toast-single-outlet-guard.test.tsx +176 -0
  101. package/src/__tests__/useHaptics.test.tsx +203 -16
  102. package/src/animated-check/AnimatedCheck.tsx +19 -86
  103. package/src/avatar/Avatar.tsx +1 -11
  104. package/src/avatar/AvatarRing.tsx +7 -15
  105. package/src/bottom-sheet/index.tsx +9 -4
  106. package/src/connection-status/index.tsx +16 -6
  107. package/src/connection-status/netinfo.ts +131 -0
  108. package/src/hooks/haptics-module.ts +118 -0
  109. package/src/hooks/useHaptics.tsx +6 -9
  110. package/src/loading/SpinnerIcon.tsx +13 -52
  111. package/src/loading/index.web.ts +2 -2
  112. package/src/theme/adaptive-colors.ts +20 -4
  113. package/src/theme/color-scope/style-builder.ts +118 -6
  114. package/src/theme/init-css-interop.ts +13 -11
  115. package/src/toast/Toaster.tsx +6 -0
  116. package/src/toast/use-single-outlet-guard.ts +72 -0
  117. package/lib/commonjs/avatar/svg-module.js +0 -15
  118. package/lib/commonjs/avatar/svg-module.js.map +0 -1
  119. package/lib/commonjs/utils/lazy-require.js +0 -37
  120. package/lib/commonjs/utils/lazy-require.js.map +0 -1
  121. package/lib/module/avatar/svg-module.js +0 -11
  122. package/lib/module/avatar/svg-module.js.map +0 -1
  123. package/lib/module/utils/lazy-require.js +0 -33
  124. package/lib/module/utils/lazy-require.js.map +0 -1
  125. package/lib/typescript/commonjs/avatar/svg-module.d.ts +0 -8
  126. package/lib/typescript/commonjs/avatar/svg-module.d.ts.map +0 -1
  127. package/lib/typescript/commonjs/utils/lazy-require.d.ts +0 -15
  128. package/lib/typescript/commonjs/utils/lazy-require.d.ts.map +0 -1
  129. package/lib/typescript/module/avatar/svg-module.d.ts +0 -8
  130. package/lib/typescript/module/avatar/svg-module.d.ts.map +0 -1
  131. package/lib/typescript/module/utils/lazy-require.d.ts +0 -15
  132. package/lib/typescript/module/utils/lazy-require.d.ts.map +0 -1
  133. package/src/avatar/svg-module.ts +0 -11
  134. package/src/utils/lazy-require.ts +0 -31
@@ -0,0 +1,131 @@
1
+ /**
2
+ * The optional-peer boundary for `@react-native-community/netinfo`.
3
+ *
4
+ * netinfo is an OPTIONAL peer, and a static `import` contradicts that: an
5
+ * optional peer that is omitted does not degrade, it fails to RESOLVE, and Metro
6
+ * aborts the whole bundle with `Unable to resolve module
7
+ * @react-native-community/netinfo` — naming a package the app never mentions.
8
+ * Bloom's other optional-peer static imports are immune by accident (`expo-font`
9
+ * ships inside `expo`; `react-dom` is required by react-native-web), but netinfo
10
+ * arrives with nothing, so for this one the failure is real.
11
+ *
12
+ * Metro treats a `require()` of a STRING LITERAL inside a `try` block as an
13
+ * optional dependency: it resolves the real module when installed, and writes
14
+ * `null` into the dependency map when it is not, so the failure moves from build
15
+ * time to the `catch` below. Three constraints the shape has to respect, each
16
+ * checked against metro 0.83.5's own `collectDependencies`:
17
+ *
18
+ * - The specifier must be STATICALLY EVALUABLE, and a literal is the only form
19
+ * worth relying on. Metro rewrites a require it cannot evaluate — the
20
+ * specifier arriving as a function parameter, say — into a thrower ("Dynamic
21
+ * require defined at line N; not supported by Metro"), collecting no
22
+ * dependency at all, so it resolves nothing whether or not the package is
23
+ * installed. That is the defect that made Bloom's haptics, spinner and
24
+ * native color scoping silently dead before it was swept out.
25
+ * - The require must be a DIRECT statement of the try block.
26
+ * `isOptionalDependency` walks up from the call and returns at the first
27
+ * BlockStatement it meets, marking the dependency optional only if that
28
+ * block belongs to a `try`. One `if`/`else` of nesting is enough to lose it,
29
+ * and a non-optional dependency that cannot be resolved fails the BUILD —
30
+ * precisely what this boundary exists to avoid. Hence the `typeof require`
31
+ * guard below sits outside the try rather than inside it.
32
+ * - `require` may not exist at all (this file also backs the `import`
33
+ * condition, i.e. an ESM build under Node), hence that guard.
34
+ *
35
+ * The caller degrades to inert rather than throwing: an absent netinfo costs the
36
+ * outage toast and nothing else, and crashing an app root over a missing
37
+ * cosmetic affordance would be a worse trade than the build failure this
38
+ * replaces. The degradation is silent by construction — a connection toast that
39
+ * never appears looks exactly like a connection that never dropped — so
40
+ * {@link warnNetInfoUnavailable} names the missing package once, in dev.
41
+ */
42
+
43
+ /**
44
+ * Declared locally rather than taken from the ambient `NodeRequire`, which
45
+ * returns `any`: `unknown` forces the module handle to be narrowed below instead
46
+ * of leaking an untyped value into the caller.
47
+ */
48
+ declare const require: (moduleName: string) => unknown;
49
+
50
+ /** The slice of netinfo's state this component reads. */
51
+ export interface NetInfoStateLike {
52
+ isConnected: boolean | null;
53
+ isInternetReachable: boolean | null | undefined;
54
+ }
55
+
56
+ /**
57
+ * The slice of netinfo's module surface this component calls.
58
+ *
59
+ * Hand-written rather than `typeof import('@react-native-community/netinfo')` so
60
+ * no netinfo type reaches Bloom's emitted declarations — a consumer that skips
61
+ * the optional peer must not inherit a TS7016 from Bloom's own `.d.ts`. The two
62
+ * are kept in step by the assignability check in
63
+ * `__tests__/connection-status-netinfo.test.tsx`, which is excluded from the
64
+ * build and so may name the real package.
65
+ */
66
+ export interface NetInfoLike {
67
+ addEventListener: (listener: (state: NetInfoStateLike) => void) => () => void;
68
+ }
69
+
70
+ /** `undefined` until the first load attempt, then the module or `null`. */
71
+ let netInfoModule: NetInfoLike | null | undefined;
72
+ /** Why the load failed, quoted verbatim in the dev warning. */
73
+ let unavailableReason = '';
74
+ let hasWarned = false;
75
+
76
+ /** The netinfo module, or `null` when the optional peer is not installed. */
77
+ export function loadNetInfo(): NetInfoLike | null {
78
+ if (netInfoModule !== undefined) return netInfoModule;
79
+ netInfoModule = null;
80
+
81
+ // The `typeof require` guard sits OUTSIDE the try on purpose — see the second
82
+ // constraint above. Nested one `if`/`else` deeper, the require is no longer a
83
+ // direct statement of the try block, Metro stops marking it optional, and an
84
+ // app without netinfo fails to BUILD instead of losing the outage toast.
85
+ if (typeof require === 'undefined') {
86
+ unavailableReason = 'this bundle has no CommonJS `require`';
87
+ return netInfoModule;
88
+ }
89
+
90
+ try {
91
+ // netinfo exposes `addEventListener` both as a named export and on its
92
+ // default export; which one comes back depends on whether the bundler
93
+ // resolved the CommonJS build or the ESM/source entry.
94
+ const loaded = require('@react-native-community/netinfo') as
95
+ | (Partial<NetInfoLike> & { default?: Partial<NetInfoLike> })
96
+ | null
97
+ | undefined;
98
+ const resolved = typeof loaded?.addEventListener === 'function' ? loaded : loaded?.default;
99
+
100
+ if (typeof resolved?.addEventListener === 'function') {
101
+ netInfoModule = resolved as NetInfoLike;
102
+ } else {
103
+ unavailableReason = 'the module resolved without an `addEventListener` export';
104
+ }
105
+ } catch (error) {
106
+ unavailableReason = error instanceof Error ? error.message : String(error);
107
+ }
108
+
109
+ return netInfoModule;
110
+ }
111
+
112
+ /**
113
+ * One warning per module lifetime, and none in production — the same mechanism
114
+ * as `toast/use-single-outlet-guard.ts`. Metro and Vite/Rolldown both fold the
115
+ * `NODE_ENV` check statically, so a production bundle keeps neither the branch
116
+ * nor the message.
117
+ */
118
+ export function warnNetInfoUnavailable(): void {
119
+ if (process.env.NODE_ENV === 'production' || hasWarned) return;
120
+ hasWarned = true;
121
+ // Internal Bloom diagnostic: only the consumer's package.json can fix this,
122
+ // so it names the package, the install command and the alternative.
123
+ // eslint-disable-next-line no-console
124
+ console.warn(
125
+ '[Bloom] ConnectionStatusToasts is inert: the optional peer ' +
126
+ '`@react-native-community/netinfo` could not be loaded, so connection changes ' +
127
+ 'are never observed and no offline / reconnecting / restored toast will ever ' +
128
+ 'appear. Install it (`npx expo install @react-native-community/netinfo`) or ' +
129
+ `stop rendering <ConnectionStatusToasts>. Reason: ${unavailableReason}`,
130
+ );
131
+ }
@@ -0,0 +1,118 @@
1
+ /**
2
+ * The optional-peer boundary for `expo-haptics`.
3
+ *
4
+ * The load has to be dynamic — an optional peer that is omitted does not
5
+ * degrade when it is imported statically, it fails to RESOLVE and Metro aborts
6
+ * the whole bundle naming a package the app never mentions. But it also has to
7
+ * be dynamic in the ONE shape Metro understands: a `require()` of a STRING
8
+ * LITERAL inside a `try` block, which Metro collects as an optional dependency
9
+ * (resolving the real module when installed, writing `null` into the dependency
10
+ * map when it is not, so the failure lands in the `catch` below at evaluation
11
+ * time instead of at build time).
12
+ *
13
+ * The shape this replaced — the deleted `utils/lazy-require.ts`, which took the
14
+ * specifier as a function PARAMETER — satisfied neither. Metro can only collect
15
+ * a dependency whose specifier it can evaluate statically; a parameter it
16
+ * cannot, so it collected nothing and rewrote the call into a thrower ("Dynamic
17
+ * require defined at line N; not supported by Metro"). From a consumer's
18
+ * `node_modules` that resolved NOTHING, installed or not: `expo-haptics` was
19
+ * never loaded on any device and every haptic in Bloom was a silent no-op. It
20
+ * only ever worked under jest, which is CommonJS with a real dynamic `require`.
21
+ *
22
+ * `require` may also not exist at all (this file backs the `import` condition
23
+ * too, i.e. an ESM build under Node), hence the `typeof` guard.
24
+ *
25
+ * A missing haptic is invisible — indistinguishable from a device with haptics
26
+ * turned off — so {@link warnHapticsUnavailable} names the package once, in dev.
27
+ *
28
+ * @see connection-status/netinfo.ts — the same boundary for netinfo.
29
+ */
30
+
31
+ /**
32
+ * Declared locally rather than taken from the ambient `NodeRequire`, which
33
+ * returns `any`: `unknown` forces the module handle to be narrowed below instead
34
+ * of leaking an untyped value into the caller.
35
+ */
36
+ declare const require: (moduleName: string) => unknown;
37
+
38
+ /**
39
+ * The slice of expo-haptics' module surface this hook calls.
40
+ *
41
+ * Hand-written rather than `typeof import('expo-haptics')` so no expo-haptics
42
+ * type reaches Bloom's emitted declarations — a consumer that skips the optional
43
+ * peer must not inherit a TS7016 from Bloom's own `.d.ts`. The two are kept in
44
+ * step by the assignability check in `__tests__/useHaptics.test.tsx`, which is
45
+ * excluded from the build and so may name the real package.
46
+ *
47
+ * `impactAsync` is declared in METHOD syntax deliberately: `strictFunctionTypes`
48
+ * exempts method parameters from contravariance, which is what keeps the real
49
+ * `(style?: ImpactFeedbackStyle) => Promise<void>` assignable to a `string`
50
+ * parameter here. The widening cannot admit a bad value in practice — the only
51
+ * arguments passed are read straight back out of `ImpactFeedbackStyle`.
52
+ */
53
+ export interface HapticsLike {
54
+ ImpactFeedbackStyle: Record<'Light' | 'Medium' | 'Heavy', string>;
55
+ impactAsync(style?: string): Promise<void>;
56
+ }
57
+
58
+ /** `undefined` until the first load attempt, then the module or `null`. */
59
+ let hapticsModule: HapticsLike | null | undefined;
60
+ /** Why the load failed, quoted verbatim in the dev warning. */
61
+ let unavailableReason = '';
62
+ let hasWarned = false;
63
+
64
+ /** The expo-haptics module, or `null` when the optional peer is not installed. */
65
+ export function loadHaptics(): HapticsLike | null {
66
+ if (hapticsModule !== undefined) return hapticsModule;
67
+ hapticsModule = null;
68
+
69
+ // The `typeof require` guard sits OUTSIDE the try on purpose. Metro's
70
+ // `isOptionalDependency` walks up from the require call and returns as soon as
71
+ // it meets a BlockStatement, marking the dependency optional only if THAT
72
+ // block is a try block — so a require nested one `if`/`else` deeper is
73
+ // resolved eagerly like any other import, and an app without the peer fails to
74
+ // BUILD. Keeping the require a direct statement of the try block is the whole
75
+ // difference between degrading and not building.
76
+ if (typeof require === 'undefined') {
77
+ unavailableReason = 'this bundle has no CommonJS `require`';
78
+ return hapticsModule;
79
+ }
80
+
81
+ try {
82
+ const loaded = require('expo-haptics') as Partial<HapticsLike> | null | undefined;
83
+
84
+ if (
85
+ typeof loaded?.impactAsync === 'function' &&
86
+ typeof loaded.ImpactFeedbackStyle?.Light === 'string'
87
+ ) {
88
+ hapticsModule = loaded as HapticsLike;
89
+ } else {
90
+ unavailableReason =
91
+ 'the module resolved without an `impactAsync` / `ImpactFeedbackStyle` export';
92
+ }
93
+ } catch (error) {
94
+ unavailableReason = error instanceof Error ? error.message : String(error);
95
+ }
96
+
97
+ return hapticsModule;
98
+ }
99
+
100
+ /**
101
+ * One warning per module lifetime, and none in production — the same mechanism
102
+ * as `connection-status/netinfo.ts` and `toast/use-single-outlet-guard.ts`.
103
+ * Metro and Vite/Rolldown both fold the `NODE_ENV` check statically, so a
104
+ * production bundle keeps neither the branch nor the message.
105
+ */
106
+ export function warnHapticsUnavailable(): void {
107
+ if (process.env.NODE_ENV === 'production' || hasWarned) return;
108
+ hasWarned = true;
109
+ // Internal Bloom diagnostic: only the consumer's package.json can fix this,
110
+ // so it names the package, the install command and the alternative.
111
+ // eslint-disable-next-line no-console
112
+ console.warn(
113
+ '[Bloom] useHaptics is inert: the optional peer `expo-haptics` could not be ' +
114
+ 'loaded, so every haptic in Bloom is a silent no-op. Install it ' +
115
+ '(`npx expo install expo-haptics`) or disable haptics explicitly with ' +
116
+ `<BloomHapticsProvider enabled={false}>. Reason: ${unavailableReason}`,
117
+ );
118
+ }
@@ -1,13 +1,7 @@
1
1
  import React, { createContext, useCallback, useContext, useMemo } from 'react';
2
2
  import { Platform } from 'react-native';
3
3
 
4
- import { lazyRequire } from '../utils/lazy-require';
5
-
6
- /**
7
- * Lazily loads `expo-haptics`, returning `null` when it is not installed. The
8
- * dependency is an optional peer, so calls degrade to a no-op when absent.
9
- */
10
- const getHapticsModule = lazyRequire<typeof import('expo-haptics')>('expo-haptics');
4
+ import { loadHaptics, warnHapticsUnavailable } from './haptics-module';
11
5
 
12
6
  /** Impact strength requested by a caller. */
13
7
  export type HapticStrength = 'light' | 'medium' | 'heavy';
@@ -52,8 +46,11 @@ export function useHaptics(): (strength?: HapticStrength) => void {
52
46
  (strength: HapticStrength = 'light') => {
53
47
  if (!enabled || Platform.OS === 'web') return;
54
48
 
55
- const haptics = getHapticsModule();
56
- if (!haptics) return;
49
+ const haptics = loadHaptics();
50
+ if (!haptics) {
51
+ warnHapticsUnavailable();
52
+ return;
53
+ }
57
54
 
58
55
  const { ImpactFeedbackStyle } = haptics;
59
56
  let style = ImpactFeedbackStyle.Light;
@@ -1,5 +1,5 @@
1
1
  import React, { useEffect } from 'react';
2
- import { ActivityIndicator, type ViewStyle } from 'react-native';
2
+ import { type ViewStyle } from 'react-native';
3
3
  import Animated, {
4
4
  Easing,
5
5
  useAnimatedStyle,
@@ -7,18 +7,7 @@ import Animated, {
7
7
  withRepeat,
8
8
  withTiming,
9
9
  } from 'react-native-reanimated';
10
-
11
- import { lazyRequire } from '../utils/lazy-require';
12
-
13
- // react-native-svg is loaded lazily so the loading module can fall back to
14
- // ActivityIndicator when the host app doesn't ship SVG support. Reanimated,
15
- // by contrast, MUST be statically imported: the worklets Babel plugin
16
- // performs build-time closure analysis (`__closure` metadata) that fails on
17
- // runtime requires, which would crash the UI thread with
18
- // "Tried to synchronously call a non-worklet function `addListener`".
19
- type SvgModuleType = typeof import('react-native-svg');
20
-
21
- const getSvgModule = lazyRequire<SvgModuleType>('react-native-svg');
10
+ import Svg, { Rect } from 'react-native-svg';
22
11
 
23
12
  interface SpinnerIconProps {
24
13
  size?: number;
@@ -27,24 +16,24 @@ interface SpinnerIconProps {
27
16
  style?: ViewStyle;
28
17
  }
29
18
 
30
- type AnimatedSpinnerProps = Omit<SpinnerIconProps, 'className'> & {
31
- className?: string;
32
- svg: NonNullable<SvgModuleType>;
33
- };
34
-
35
19
  /**
36
- * Inner component that unconditionally calls Reanimated hooks.
37
- * Only rendered when react-native-svg is available.
20
+ * iOS-style SVG spinner with 8 rotating rectangles and an opacity gradient trail.
21
+ *
22
+ * `react-native-svg` and `react-native-reanimated` are both REQUIRED peers and
23
+ * both are imported statically. Reanimated in particular must never be loaded at
24
+ * runtime: the worklets Babel plugin performs build-time closure analysis
25
+ * (`__closure` metadata) that fails on a runtime require, which crashes the UI
26
+ * thread with "Tried to synchronously call a non-worklet function `addListener`".
27
+ *
28
+ * Native only — `SpinnerIcon.web.tsx` draws the same shape with CSS, so this
29
+ * file is never reached by a web bundler.
38
30
  */
39
- const AnimatedSpinner: React.FC<AnimatedSpinnerProps> = ({
31
+ export const SpinnerIcon: React.FC<SpinnerIconProps> = ({
40
32
  color = 'currentColor',
41
33
  size = 26,
42
34
  className,
43
35
  style,
44
- svg,
45
36
  }) => {
46
- const { default: Svg, Rect } = svg;
47
-
48
37
  const rotation = useSharedValue(0);
49
38
 
50
39
  useEffect(() => {
@@ -97,32 +86,4 @@ const AnimatedSpinner: React.FC<AnimatedSpinnerProps> = ({
97
86
  );
98
87
  };
99
88
 
100
- /**
101
- * iOS-style SVG spinner with 8 rotating rectangles and an opacity gradient trail.
102
- * Requires react-native-svg (lazy) and react-native-reanimated (static).
103
- * Falls back to ActivityIndicator if react-native-svg is missing.
104
- */
105
- export const SpinnerIcon: React.FC<SpinnerIconProps> = ({
106
- color = 'currentColor',
107
- size = 26,
108
- className,
109
- style,
110
- }) => {
111
- const svg = getSvgModule();
112
-
113
- if (!svg) {
114
- return <ActivityIndicator size={size > 30 ? 'large' : 'small'} color={color} />;
115
- }
116
-
117
- return (
118
- <AnimatedSpinner
119
- color={color}
120
- size={size}
121
- className={className}
122
- style={style}
123
- svg={svg}
124
- />
125
- );
126
- };
127
-
128
89
  SpinnerIcon.displayName = 'SpinnerIcon';
@@ -1,8 +1,8 @@
1
1
  // Web variant of the `./loading` barrel.
2
2
  //
3
3
  // The default barrel (`./index.ts`) re-exports from `./Loading` and
4
- // `./SpinnerIcon`, which statically import `react-native-reanimated` (and lazily
5
- // `react-native-svg`). Reanimated has no web build — its worklets Babel plugin
4
+ // `./SpinnerIcon`, which statically import `react-native-reanimated` and
5
+ // `react-native-svg`. Reanimated has no web build — its worklets Babel plugin
6
6
  // is native-only and importing it statically breaks every web bundler (Vite,
7
7
  // webpack, Metro-web). The web forks (`./Loading.web`, `./SpinnerIcon.web`)
8
8
  // render the same components with CSS keyframes/transitions and no native deps.
@@ -1,13 +1,30 @@
1
1
  import { Platform } from 'react-native';
2
2
  import type { ThemeColors } from './types';
3
3
 
4
+ /**
5
+ * `expo-router`'s `Color` proxy is read through a `require()` of a STRING
6
+ * LITERAL as a direct statement of a `try` block — the shape Metro collects as
7
+ * an optional dependency, resolving the real module when installed and writing
8
+ * `null` into the dependency map when it is not, so an app without the optional
9
+ * `expo-router` peer loses the adaptive palette and nothing else.
10
+ *
11
+ * The specifier was previously bound to a local `const` first. That still
12
+ * worked — Metro evaluates the constant — but the literal is what the rule can
13
+ * be stated and checked as, and it does not rest on a constant-folding pass
14
+ * every bundler happens to share. What must never come back is a specifier
15
+ * Metro CANNOT evaluate (a function parameter, a computed value): it collects no
16
+ * dependency and rewrites the call into a thrower, so it resolves nothing on any
17
+ * device.
18
+ *
19
+ * @see connection-status/netinfo.ts — the same boundary, with the full rule.
20
+ */
21
+
4
22
  const c = (v: unknown): string => v as string;
5
23
 
6
24
  function getAndroidColors(): ThemeColors | null {
7
25
  try {
8
26
  if (typeof require === 'undefined') return null;
9
- const moduleName = 'expo-router';
10
- const { Color } = require(moduleName);
27
+ const { Color } = require('expo-router');
11
28
  const d = Color.android.dynamic;
12
29
  return {
13
30
  background: c(d.surface),
@@ -52,8 +69,7 @@ function getAndroidColors(): ThemeColors | null {
52
69
  function getIOSColors(): ThemeColors | null {
53
70
  try {
54
71
  if (typeof require === 'undefined') return null;
55
- const moduleName = 'expo-router';
56
- const { Color } = require(moduleName);
72
+ const { Color } = require('expo-router');
57
73
  const i = Color.ios;
58
74
  return {
59
75
  background: c(i.systemBackground),
@@ -4,7 +4,49 @@ import { Platform, type StyleProp, type ViewStyle } from 'react-native';
4
4
  import { CANONICAL_TOKENS, getResolvedTokens } from '../token-registry';
5
5
  import type { AppColorName } from '../color-presets';
6
6
  import type { ExplicitAccents } from '../preset-vars';
7
- import { lazyRequire } from '../../utils/lazy-require';
7
+
8
+ /**
9
+ * The optional-peer boundary for `nativewind`.
10
+ *
11
+ * The consumer's OWN nativewind has to be the one that answers: its version
12
+ * decides which var mechanism exists (`VariableContextProvider` under
13
+ * NativeWind 5 / react-native-css@3, `vars()` before it), and a scope built
14
+ * against a second copy would publish into a context nothing reads. That rules
15
+ * out reaching for Bloom's own `react-native-css` dependency, and an optional
16
+ * peer rules out a static import — Metro resolves those eagerly, so an app
17
+ * without nativewind would fail to BUILD rather than degrade.
18
+ *
19
+ * What is left is the one dynamic shape Metro understands: `require()` of a
20
+ * STRING LITERAL as a DIRECT statement of a `try` block, collected as an
21
+ * optional dependency. Both halves matter, and both were verified against metro
22
+ * 0.83.5's own `collectDependencies`:
23
+ *
24
+ * - The shape this replaced — the deleted `utils/lazy-require.ts`, which took
25
+ * the specifier as a function PARAMETER — is not statically evaluable, so
26
+ * Metro collected no dependency at all and rewrote the call into a thrower
27
+ * ("Dynamic require defined at line N; not supported by Metro"). It resolved
28
+ * NOTHING from a consumer's `node_modules` whether or not nativewind was
29
+ * installed, and `BloomColorScope` could never scope NativeWind classes on a
30
+ * device.
31
+ * - `isOptionalDependency` returns at the first BlockStatement above the call,
32
+ * so one `if`/`else` of nesting inside the try loses the optional marking and
33
+ * an absent nativewind fails the BUILD. Hence the `typeof require` guard
34
+ * below sits outside the try.
35
+ *
36
+ * `require` may not exist at all (this file also backs the `import` condition,
37
+ * i.e. an ESM build under Node), hence that guard. Both callers below return
38
+ * before loading on web, where the vars are written to `document.documentElement`
39
+ * instead.
40
+ *
41
+ * @see connection-status/netinfo.ts — the same boundary for netinfo.
42
+ */
43
+
44
+ /**
45
+ * Declared locally rather than taken from the ambient `NodeRequire`, which
46
+ * returns `any`: `unknown` forces the module handle to be narrowed below instead
47
+ * of leaking an untyped value into the caller.
48
+ */
49
+ declare const require: (moduleName: string) => unknown;
8
50
 
9
51
  /**
10
52
  * Component that provides inline CSS variables to a subtree via NativeWind's
@@ -17,12 +59,69 @@ export type VariableContextProviderComponent = React.ComponentType<{
17
59
  children: React.ReactNode;
18
60
  }>;
19
61
 
62
+ /**
63
+ * The slice of nativewind's surface Bloom uses. Hand-written so no nativewind
64
+ * type reaches Bloom's emitted declarations — a consumer that skips the optional
65
+ * peer must not inherit a TS7016 from Bloom's own `.d.ts`.
66
+ */
20
67
  interface NativeWindVarsModule {
21
68
  vars: (record: Record<string, string>) => StyleProp<ViewStyle>;
22
69
  VariableContextProvider?: VariableContextProviderComponent;
23
70
  }
24
71
 
25
- const getNativeWindVars = lazyRequire<NativeWindVarsModule>('nativewind');
72
+ /** `undefined` until the first load attempt, then the module or `null`. */
73
+ let nativeWindModule: NativeWindVarsModule | null | undefined;
74
+ /** Why the scope cannot be applied, quoted verbatim in the dev warning. */
75
+ let unavailableReason = '';
76
+ let hasWarned = false;
77
+
78
+ /** The nativewind module, or `null` when the optional peer is not installed. */
79
+ function loadNativeWindVars(): NativeWindVarsModule | null {
80
+ if (nativeWindModule !== undefined) return nativeWindModule;
81
+ nativeWindModule = null;
82
+
83
+ // The `typeof require` guard sits OUTSIDE the try on purpose — see the second
84
+ // constraint above. Nested one `if`/`else` deeper, the require stops counting
85
+ // as optional and an app without nativewind fails to BUILD.
86
+ if (typeof require === 'undefined') {
87
+ unavailableReason = 'this bundle has no CommonJS `require`';
88
+ return nativeWindModule;
89
+ }
90
+
91
+ try {
92
+ const loaded = require('nativewind') as Partial<NativeWindVarsModule> | null | undefined;
93
+
94
+ if (typeof loaded?.vars === 'function') {
95
+ nativeWindModule = loaded as NativeWindVarsModule;
96
+ } else {
97
+ unavailableReason = 'the module resolved without a `vars` export';
98
+ }
99
+ } catch (error) {
100
+ unavailableReason = error instanceof Error ? error.message : String(error);
101
+ }
102
+
103
+ return nativeWindModule;
104
+ }
105
+
106
+ /**
107
+ * One warning per module lifetime, and none in production — the same mechanism
108
+ * as `connection-status/netinfo.ts`. A scope that does not scope is invisible:
109
+ * the subtree keeps rendering, just in the app-wide palette instead of the
110
+ * requested one.
111
+ */
112
+ function warnScopeInert(detail: string): void {
113
+ if (process.env.NODE_ENV === 'production' || hasWarned) return;
114
+ hasWarned = true;
115
+ // Internal Bloom diagnostic: only the consumer's package.json can fix this,
116
+ // so it names the package and the install command.
117
+ // eslint-disable-next-line no-console
118
+ console.warn(
119
+ `[Bloom] BloomColorScope cannot scope NativeWind classes on native: ${detail} ` +
120
+ 'Descendants keep resolving `var(--primary)` and friends against the ' +
121
+ 'app-wide preset. Install the optional peer (`npx expo install nativewind`) ' +
122
+ `to enable scoped presets. Reason: ${unavailableReason}`,
123
+ );
124
+ }
26
125
 
27
126
  /**
28
127
  * Build the CSS custom-property map for a preset, ready to be applied to a
@@ -67,8 +166,18 @@ export function buildScopeVars(
67
166
  */
68
167
  export function getVariableContextProvider(): VariableContextProviderComponent | null {
69
168
  if (Platform.OS === 'web') return null;
70
- const module = getNativeWindVars();
71
- if (!module || typeof module.VariableContextProvider !== 'function') return null;
169
+ const module = loadNativeWindVars();
170
+ if (!module) {
171
+ warnScopeInert('the optional peer `nativewind` could not be loaded.');
172
+ return null;
173
+ }
174
+ if (typeof module.VariableContextProvider !== 'function') {
175
+ warnScopeInert(
176
+ 'the installed `nativewind` exports no `VariableContextProvider` (the ' +
177
+ 'NativeWind 5 / react-native-css@3 API this needs).',
178
+ );
179
+ return null;
180
+ }
72
181
  return module.VariableContextProvider;
73
182
  }
74
183
 
@@ -90,7 +199,10 @@ export function buildNativePresetStyle(
90
199
  mode: 'light' | 'dark',
91
200
  ): StyleProp<ViewStyle> {
92
201
  if (Platform.OS === 'web') return undefined;
93
- const module = getNativeWindVars();
94
- if (!module || typeof module.vars !== 'function') return undefined;
202
+ const module = loadNativeWindVars();
203
+ if (!module) {
204
+ warnScopeInert('the optional peer `nativewind` could not be loaded.');
205
+ return undefined;
206
+ }
95
207
  return module.vars(buildScopeVars(colorPreset, mode));
96
208
  }
@@ -76,20 +76,22 @@ function tryCallSetFlag(): void {
76
76
  let mod: CssInteropModule | undefined;
77
77
  // `require` does not exist in an ES module, so guard before touching it —
78
78
  // an unguarded reference is a ReferenceError, not a resolution failure.
79
- // Matches the pattern used by every other optional-module load in Bloom
80
- // (`utils/lazy-require.ts`, `theme/adaptive-colors.ts`,
81
- // `bottom-sheet/index.tsx`).
82
79
  if (typeof require === 'undefined') return;
83
80
  try {
84
- // Dynamic require: css-interop is not a Bloom dependency. If the host
85
- // app ships it (via NativeWind or directly), this resolves. Otherwise
86
- // the require throws and we silently move on — there is nothing to
87
- // initialize because css-interop is not in the bundle.
81
+ // Dynamic require: css-interop is neither a Bloom dependency nor a declared
82
+ // peer. The specifier goes through a variable to keep a plain-text
83
+ // `require('react-native-css-interop')` out of the file, so bundlers that
84
+ // scan for one do not try to resolve (and warn about, or fail on) a module
85
+ // Bloom never asked for.
88
86
  //
89
- // The specifier goes through a variable on purpose: a literal
90
- // `require('react-native-css-interop')` is statically analysable, so
91
- // bundlers try to resolve (and warn about, or fail on) a module that is
92
- // intentionally absent. The indirection keeps this a pure runtime lookup.
87
+ // Metro is not among them: its dependency collector EVALUATES the argument,
88
+ // folds this `const`, and treats the call exactly as it would a literal —
89
+ // optional, because it is a direct statement of a `try` block. So the
90
+ // indirection buys nothing under Metro and costs nothing either. It is not a
91
+ // pattern to copy: a specifier Metro cannot evaluate (a function parameter,
92
+ // a computed value) collects no dependency at all and is rewritten into a
93
+ // thrower, which is how `lazyRequire` silently killed four subsystems. See
94
+ // `connection-status/netinfo.ts` for the shape a real peer must use.
93
95
  const moduleName = 'react-native-css-interop';
94
96
  // eslint-disable-next-line @typescript-eslint/no-require-imports
95
97
  mod = require(moduleName) as CssInteropModule;
@@ -30,6 +30,7 @@ import type {
30
30
  ToastProps,
31
31
  } from './types';
32
32
  import { useAppStateChange } from './use-app-state';
33
+ import { useSingleOutletGuard } from './use-single-outlet-guard';
33
34
 
34
35
  const ALL_POSITIONS: ToastPosition[] = [
35
36
  'top-center',
@@ -79,6 +80,11 @@ export const Toaster: React.FC<ToasterProps> = ({
79
80
  style,
80
81
  styles: styleOverrides,
81
82
  }) => {
83
+ // Before any early return, and independent of whether a toast is up: a second
84
+ // outlet duplicates every row from the moment it mounts, not from the first
85
+ // toast, so the warning must not wait for one.
86
+ useSingleOutletGuard();
87
+
82
88
  const { toasts, shouldShowOverlay, toastHeights, isExpanded } =
83
89
  React.useSyncExternalStore(
84
90
  toastStore.subscribe,