@retray-dev/ui-kit 10.2.0 → 12.1.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 (153) hide show
  1. package/COMPONENTS.md +287 -37
  2. package/README.md +11 -2
  3. package/dist/Accordion.mjs +2 -2
  4. package/dist/AlertBanner.mjs +2 -2
  5. package/dist/AppHeader.mjs +3 -3
  6. package/dist/Avatar.mjs +2 -2
  7. package/dist/Badge.mjs +2 -2
  8. package/dist/Button.mjs +2 -2
  9. package/dist/Card.mjs +2 -2
  10. package/dist/CategoryStrip.mjs +2 -2
  11. package/dist/Checkbox.mjs +2 -2
  12. package/dist/Chip.mjs +2 -2
  13. package/dist/ConfirmDialog.d.mts +1 -6
  14. package/dist/ConfirmDialog.d.ts +1 -6
  15. package/dist/ConfirmDialog.js +29 -23
  16. package/dist/ConfirmDialog.mjs +3 -3
  17. package/dist/CurrencyDisplay.mjs +2 -2
  18. package/dist/CurrencyInput.d.mts +3 -8
  19. package/dist/CurrencyInput.d.ts +3 -8
  20. package/dist/CurrencyInput.js +3 -1
  21. package/dist/CurrencyInput.mjs +3 -3
  22. package/dist/DetailRow.mjs +2 -2
  23. package/dist/EmptyState.mjs +3 -3
  24. package/dist/ErrorBoundary.mjs +2 -2
  25. package/dist/Form.mjs +2 -2
  26. package/dist/IconButton.mjs +2 -2
  27. package/dist/IconPicker.js +675 -248
  28. package/dist/IconPicker.mjs +3 -2
  29. package/dist/ImageUpload.mjs +3 -3
  30. package/dist/ImageViewer.mjs +4 -4
  31. package/dist/Input.mjs +2 -2
  32. package/dist/LabelValue.mjs +2 -2
  33. package/dist/ListGroup.mjs +2 -2
  34. package/dist/ListItem.d.mts +7 -7
  35. package/dist/ListItem.d.ts +7 -7
  36. package/dist/ListItem.js +12 -7
  37. package/dist/ListItem.mjs +2 -2
  38. package/dist/MediaCard.mjs +2 -2
  39. package/dist/MenuGroup.mjs +2 -2
  40. package/dist/MenuItem.mjs +2 -2
  41. package/dist/MonthPicker.mjs +2 -2
  42. package/dist/NumberStepper.mjs +2 -2
  43. package/dist/PagerDots.mjs +2 -2
  44. package/dist/Pressable.d.mts +15 -7
  45. package/dist/Pressable.d.ts +15 -7
  46. package/dist/Pressable.js +7 -3
  47. package/dist/Pressable.mjs +1 -1
  48. package/dist/PricingCard.mjs +4 -4
  49. package/dist/Progress.mjs +2 -2
  50. package/dist/RadioGroup.mjs +2 -2
  51. package/dist/RetrayProvider.mjs +3 -3
  52. package/dist/Select.mjs +2 -2
  53. package/dist/SelectableGrid.mjs +2 -2
  54. package/dist/Separator.mjs +2 -2
  55. package/dist/Sheet.d.mts +4 -46
  56. package/dist/Sheet.d.ts +4 -46
  57. package/dist/Sheet.js +46 -114
  58. package/dist/Sheet.mjs +2 -3
  59. package/dist/SheetSelect.mjs +2 -2
  60. package/dist/Skeleton.mjs +2 -2
  61. package/dist/Slider.mjs +2 -2
  62. package/dist/Spinner.mjs +2 -2
  63. package/dist/Stats.d.mts +30 -0
  64. package/dist/Stats.d.ts +30 -0
  65. package/dist/Stats.js +429 -0
  66. package/dist/Stats.mjs +9 -0
  67. package/dist/Switch.mjs +2 -2
  68. package/dist/TabBar.mjs +2 -2
  69. package/dist/Tabs.mjs +2 -2
  70. package/dist/Text.d.mts +3 -1
  71. package/dist/Text.d.ts +3 -1
  72. package/dist/Text.js +3 -3
  73. package/dist/Text.mjs +2 -2
  74. package/dist/Textarea.mjs +2 -2
  75. package/dist/Toast.mjs +2 -2
  76. package/dist/Toggle.mjs +2 -2
  77. package/dist/{chunk-YJ7I257J.mjs → chunk-265G6A46.mjs} +1 -1
  78. package/dist/{chunk-ELXBDILQ.mjs → chunk-2A2LEFZG.mjs} +2 -2
  79. package/dist/{chunk-ID72TK46.mjs → chunk-2CBQKU7H.mjs} +1 -1
  80. package/dist/{chunk-OB4JUQ3O.mjs → chunk-2I2AYECM.mjs} +1 -1
  81. package/dist/{chunk-WJLKJMKR.mjs → chunk-357YO24D.mjs} +4 -4
  82. package/dist/{chunk-GQYFLP3D.mjs → chunk-3GEYJ7I5.mjs} +1 -1
  83. package/dist/{chunk-AV4EMIRH.mjs → chunk-3N2M3WZL.mjs} +1 -1
  84. package/dist/{chunk-VF2ATYN3.mjs → chunk-3UYAZ7I4.mjs} +1 -1
  85. package/dist/{chunk-JMOZEC77.mjs → chunk-4WFMPFZB.mjs} +1 -1
  86. package/dist/chunk-5OLNXP3S.mjs +144 -0
  87. package/dist/{chunk-6SECQ2ZF.mjs → chunk-7HSILTC4.mjs} +2 -2
  88. package/dist/{chunk-IRRY3CRZ.mjs → chunk-AKM4EPOT.mjs} +1 -1
  89. package/dist/{chunk-IX3NYLYQ.mjs → chunk-AQEVCEXV.mjs} +1 -1
  90. package/dist/{chunk-WBOOUHSS.mjs → chunk-BCWEHE34.mjs} +1 -1
  91. package/dist/{chunk-AJ7ZDNBT.mjs → chunk-BOVUP27T.mjs} +1 -1
  92. package/dist/{chunk-BRKYVJVV.mjs → chunk-BQZE3HAW.mjs} +1 -1
  93. package/dist/{chunk-Z6SFHN6T.mjs → chunk-D3Y2T42P.mjs} +1 -1
  94. package/dist/{chunk-T2KCAHOS.mjs → chunk-DF6DU42P.mjs} +1 -1
  95. package/dist/{chunk-TB6SD2FT.mjs → chunk-DI7CBDL6.mjs} +1 -1
  96. package/dist/{chunk-HTHGSXFG.mjs → chunk-DOGIPOF5.mjs} +1 -1
  97. package/dist/{chunk-MBMXYJJV.mjs → chunk-E7NEHHXV.mjs} +7 -3
  98. package/dist/{chunk-MX6HRKMI.mjs → chunk-EFLFRAHD.mjs} +1 -1
  99. package/dist/{chunk-SOYNZDVY.mjs → chunk-EMUWGDWC.mjs} +6 -1
  100. package/dist/{chunk-AJRVDP2H.mjs → chunk-F4V6XLP4.mjs} +3 -3
  101. package/dist/{chunk-DYT7BG5I.mjs → chunk-FA2KMTH5.mjs} +1 -1
  102. package/dist/{chunk-Y2NS74WS.mjs → chunk-FFTYLPSB.mjs} +46 -98
  103. package/dist/{chunk-VKID2D2I.mjs → chunk-FUVYSVGR.mjs} +13 -8
  104. package/dist/{chunk-7LWRKMF5.mjs → chunk-FVTVCJAH.mjs} +1 -1
  105. package/dist/{chunk-TZDGAP5N.mjs → chunk-GK4VRMNE.mjs} +2 -2
  106. package/dist/{chunk-6Q64UFIA.mjs → chunk-HJ46DTJE.mjs} +1 -1
  107. package/dist/{chunk-WF2XDFRK.mjs → chunk-HLMPMUK2.mjs} +1 -1
  108. package/dist/{chunk-GD6KXMG5.mjs → chunk-I4V5XZPS.mjs} +1 -1
  109. package/dist/{chunk-TBNZHU6C.mjs → chunk-ISY26JQJ.mjs} +2 -2
  110. package/dist/{chunk-X4G6APW6.mjs → chunk-J6Q2YJEV.mjs} +1 -1
  111. package/dist/{chunk-WYEUNUTP.mjs → chunk-JCZQOY4O.mjs} +31 -24
  112. package/dist/{chunk-U2XJFYED.mjs → chunk-JNVAIDLK.mjs} +1 -1
  113. package/dist/{chunk-SOA2Z4RB.mjs → chunk-JULSIZDM.mjs} +1 -1
  114. package/dist/chunk-KHYX4IOM.mjs +1114 -0
  115. package/dist/{chunk-RYZC432S.mjs → chunk-LRM4AVYY.mjs} +1 -1
  116. package/dist/{chunk-6L4G6PBT.mjs → chunk-MYZ2EDYU.mjs} +1 -1
  117. package/dist/{chunk-BUMAMSTZ.mjs → chunk-N4ZPVCJH.mjs} +1 -1
  118. package/dist/{chunk-Z4VHZ7B5.mjs → chunk-NXI4YDZ2.mjs} +1 -1
  119. package/dist/{chunk-ZZ2R6KZ3.mjs → chunk-OULVKTWL.mjs} +1 -1
  120. package/dist/{chunk-FCSSQK3L.mjs → chunk-P64WHW4A.mjs} +1 -1
  121. package/dist/{chunk-KOO4WITD.mjs → chunk-P73V2EKS.mjs} +1 -1
  122. package/dist/{chunk-SXLKNTA4.mjs → chunk-PGERH3P7.mjs} +1 -1
  123. package/dist/{chunk-2UYENBLV.mjs → chunk-QSFV2P7O.mjs} +1 -1
  124. package/dist/{chunk-JT7HKXRB.mjs → chunk-S3KJCPEJ.mjs} +1 -1
  125. package/dist/{chunk-BEMIQXXU.mjs → chunk-V6NFJXKO.mjs} +1 -1
  126. package/dist/{chunk-A3A6KNQN.mjs → chunk-WOEWGSTU.mjs} +1 -1
  127. package/dist/{chunk-NMU5FMQJ.mjs → chunk-X26S5EVZ.mjs} +4 -2
  128. package/dist/{chunk-YFZ3ELX5.mjs → chunk-XBAGGKLW.mjs} +2 -2
  129. package/dist/{chunk-S2R7UVOE.mjs → chunk-ZHMSAYLT.mjs} +1 -1
  130. package/dist/fonts.d.mts +1 -7
  131. package/dist/fonts.d.ts +1 -7
  132. package/dist/fonts.js +0 -2
  133. package/dist/fonts.mjs +1 -2
  134. package/dist/index.d.mts +4 -1
  135. package/dist/index.d.ts +4 -1
  136. package/dist/index.js +1184 -708
  137. package/dist/index.mjs +53 -52
  138. package/package.json +3 -3
  139. package/src/components/ConfirmDialog/ConfirmDialog.tsx +39 -30
  140. package/src/components/CurrencyInput/CurrencyInput.tsx +4 -7
  141. package/src/components/IconPicker/IconPicker.tsx +124 -112
  142. package/src/components/ListItem/ListItem.tsx +43 -28
  143. package/src/components/Pressable/Pressable.tsx +20 -8
  144. package/src/components/Sheet/Sheet.tsx +64 -172
  145. package/src/components/Stats/Stats.tsx +226 -0
  146. package/src/components/Stats/index.ts +2 -0
  147. package/src/components/Text/Text.tsx +4 -2
  148. package/src/fonts.ts +0 -7
  149. package/src/index.ts +4 -0
  150. package/src/theme/colorUtils.ts +9 -0
  151. package/src/utils/curatedIcons.ts +698 -135
  152. package/src/utils/fontGuard.ts +2 -1
  153. package/dist/chunk-53Z3NYGE.mjs +0 -742
package/dist/Stats.js ADDED
@@ -0,0 +1,429 @@
1
+ 'use strict';
2
+
3
+ var React3 = require('react');
4
+ var reactNative = require('react-native');
5
+ var reactNativeSizeMatters = require('react-native-size-matters');
6
+ var AntDesign = require('@expo/vector-icons/AntDesign');
7
+ var Entypo = require('@expo/vector-icons/Entypo');
8
+ var Feather = require('@expo/vector-icons/Feather');
9
+ var FontAwesome5 = require('@expo/vector-icons/FontAwesome5');
10
+ var MaterialIcons = require('@expo/vector-icons/MaterialIcons');
11
+ var Ionicons = require('@expo/vector-icons/Ionicons');
12
+ var pressto = require('pressto');
13
+ var reactNativeReanimated = require('react-native-reanimated');
14
+
15
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
16
+
17
+ var React3__default = /*#__PURE__*/_interopDefault(React3);
18
+ var AntDesign__default = /*#__PURE__*/_interopDefault(AntDesign);
19
+ var Entypo__default = /*#__PURE__*/_interopDefault(Entypo);
20
+ var Feather__default = /*#__PURE__*/_interopDefault(Feather);
21
+ var FontAwesome5__default = /*#__PURE__*/_interopDefault(FontAwesome5);
22
+ var MaterialIcons__default = /*#__PURE__*/_interopDefault(MaterialIcons);
23
+ var Ionicons__default = /*#__PURE__*/_interopDefault(Ionicons);
24
+
25
+ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
26
+ get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
27
+ }) : x)(function(x) {
28
+ if (typeof require !== "undefined") return require.apply(this, arguments);
29
+ throw Error('Dynamic require of "' + x + '" is not supported');
30
+ });
31
+ var _haptics = null;
32
+ var _hapticsLoaded = false;
33
+ async function getHaptics() {
34
+ if (reactNative.Platform.OS === "web") return null;
35
+ if (!_hapticsLoaded) {
36
+ _hapticsLoaded = true;
37
+ try {
38
+ _haptics = await import('expo-haptics');
39
+ } catch {
40
+ _haptics = null;
41
+ }
42
+ }
43
+ return _haptics;
44
+ }
45
+ var _pulsar = null;
46
+ var _pulsarChecked = false;
47
+ var _pulsarAvailable = false;
48
+ function isPulsarNativeRegistered() {
49
+ try {
50
+ const g = globalThis;
51
+ if (typeof g.__turboModuleProxy === "function") {
52
+ return g.__turboModuleProxy("RNPulsar") != null;
53
+ }
54
+ return reactNative.NativeModules?.RNPulsar != null;
55
+ } catch {
56
+ return false;
57
+ }
58
+ }
59
+ function getPulsar() {
60
+ if (reactNative.Platform.OS === "web") return null;
61
+ if (!_pulsarChecked) {
62
+ _pulsarChecked = true;
63
+ try {
64
+ if (isPulsarNativeRegistered()) {
65
+ _pulsar = __require("react-native-pulsar");
66
+ _pulsarAvailable = true;
67
+ }
68
+ } catch {
69
+ _pulsar = null;
70
+ _pulsarAvailable = false;
71
+ }
72
+ }
73
+ return _pulsarAvailable ? _pulsar : null;
74
+ }
75
+ function impactLight() {
76
+ if (reactNative.Platform.OS === "web") return;
77
+ getHaptics().then((h) => {
78
+ if (h) {
79
+ h.impactAsync(h.ImpactFeedbackStyle.Light);
80
+ } else {
81
+ getPulsar()?.Presets.System.impactLight();
82
+ }
83
+ });
84
+ }
85
+
86
+ // src/theme/colorUtils.ts
87
+ function hexToRgb(hex) {
88
+ const clean = hex.replace("#", "");
89
+ const full = clean.length === 3 ? clean.split("").map((c) => c + c).join("") : clean;
90
+ if (full.length !== 6) return null;
91
+ return {
92
+ r: parseInt(full.slice(0, 2), 16),
93
+ g: parseInt(full.slice(2, 4), 16),
94
+ b: parseInt(full.slice(4, 6), 16)
95
+ };
96
+ }
97
+ function componentToHex(c) {
98
+ return Math.round(Math.max(0, Math.min(255, c))).toString(16).padStart(2, "0");
99
+ }
100
+ function rgbToHex(r, g, b) {
101
+ return `#${componentToHex(r)}${componentToHex(g)}${componentToHex(b)}`;
102
+ }
103
+ function withAlphaOnWhite(hex, alpha) {
104
+ const rgb = hexToRgb(hex);
105
+ if (!rgb) return hex;
106
+ const r = rgb.r * alpha + 255 * (1 - alpha);
107
+ const g = rgb.g * alpha + 255 * (1 - alpha);
108
+ const b = rgb.b * alpha + 255 * (1 - alpha);
109
+ return rgbToHex(r, g, b);
110
+ }
111
+ function withAlphaOnDark(hex, alpha, bgHex = "#0f0f0f") {
112
+ const rgb = hexToRgb(hex);
113
+ const bg = hexToRgb(bgHex);
114
+ if (!rgb || !bg) return hex;
115
+ const r = rgb.r * alpha + bg.r * (1 - alpha);
116
+ const g = rgb.g * alpha + bg.g * (1 - alpha);
117
+ const b = rgb.b * alpha + bg.b * (1 - alpha);
118
+ return rgbToHex(r, g, b);
119
+ }
120
+ function mixWithBackground(fgHex, bgHex, opacity) {
121
+ const fg = hexToRgb(fgHex);
122
+ const bg = hexToRgb(bgHex);
123
+ if (!fg || !bg) return fgHex;
124
+ const r = fg.r * opacity + bg.r * (1 - opacity);
125
+ const g = fg.g * opacity + bg.g * (1 - opacity);
126
+ const b = fg.b * opacity + bg.b * (1 - opacity);
127
+ return rgbToHex(r, g, b);
128
+ }
129
+ function lighten(hex, amount) {
130
+ return withAlphaOnWhite(hex, 1 - amount);
131
+ }
132
+ function darken(hex, amount) {
133
+ const rgb = hexToRgb(hex);
134
+ if (!rgb) return hex;
135
+ return rgbToHex(rgb.r * (1 - amount), rgb.g * (1 - amount), rgb.b * (1 - amount));
136
+ }
137
+
138
+ // src/theme/colors.ts
139
+ var defaultLight = {
140
+ background: "#ffffff",
141
+ foreground: "#1a1a1a",
142
+ card: "#ffffff",
143
+ primary: "#1a1a1a",
144
+ primaryForeground: "#ffffff",
145
+ // AUDIT FIX: brand accent — was undefined; falls back to primary when omitted
146
+ accent: "#d4561d",
147
+ accentForeground: "#ffffff",
148
+ border: "#dddddd",
149
+ // AUDIT FIX: was #e53935 (4.22:1 on white — fails AA); #c72828 = 5.59:1 ✓
150
+ destructive: "#c72828",
151
+ destructiveForeground: "#ffffff",
152
+ success: "#1a7a45",
153
+ successForeground: "#ffffff",
154
+ // AUDIT FIX: was #e67e00 (2.86:1 — severe fail); #9a5200 = 5.86:1 ✓ AAA-near
155
+ warning: "#9a5200",
156
+ warningForeground: "#ffffff"
157
+ };
158
+ function deriveColors(t, scheme) {
159
+ const dark = scheme === "dark";
160
+ const bg = t.background;
161
+ const foregroundSubtle = mixWithBackground(t.foreground, bg, 0.7);
162
+ const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
163
+ const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
164
+ const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
165
+ const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
166
+ const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
167
+ const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
168
+ const successBorder = dark ? withAlphaOnDark(t.success, 0.45, bg) : withAlphaOnWhite(t.success, 0.3);
169
+ const warningTint = dark ? withAlphaOnDark(t.warning, 0.15, bg) : withAlphaOnWhite(t.warning, 0.08);
170
+ const warningBorder = dark ? withAlphaOnDark(t.warning, 0.45, bg) : withAlphaOnWhite(t.warning, 0.3);
171
+ return {
172
+ ...t,
173
+ foregroundSubtle,
174
+ foregroundMuted,
175
+ surface,
176
+ surfaceStrong,
177
+ destructiveTint,
178
+ destructiveBorder,
179
+ successTint,
180
+ successBorder,
181
+ warningTint,
182
+ warningBorder,
183
+ overlay: t.overlay ?? "rgba(0,0,0,0.45)",
184
+ accentResolved: t.accent ?? t.primary,
185
+ accentForegroundResolved: t.accentForeground ?? t.primaryForeground,
186
+ ring: t.accent ?? t.primary,
187
+ input: t.border,
188
+ separator: dark ? lighten(t.border, 0.22) : darken(t.border, 0.16)
189
+ };
190
+ }
191
+
192
+ // src/theme/ThemeProvider.tsx
193
+ var ThemeContext = React3.createContext({
194
+ colors: deriveColors(defaultLight, "light"),
195
+ colorScheme: "light"
196
+ });
197
+ function useTheme() {
198
+ const context = React3.useContext(ThemeContext);
199
+ if (!context) {
200
+ throw new Error("useTheme must be used within a ThemeProvider");
201
+ }
202
+ return context;
203
+ }
204
+ var isWeb = reactNative.Platform.OS === "web";
205
+ var s = isWeb ? (n) => n : reactNativeSizeMatters.scale;
206
+ var vs = isWeb ? (n) => n : reactNativeSizeMatters.verticalScale;
207
+ var ms = isWeb ? (n, _factor) => n : reactNativeSizeMatters.moderateScale;
208
+ var mvs = isWeb ? (n, _factor) => n : reactNativeSizeMatters.moderateVerticalScale;
209
+
210
+ // src/tokens.ts
211
+ var RADIUS = {
212
+ md: 14};
213
+ var glyphMapOf = (mod) => mod.glyphMap ?? {};
214
+ var ALL_FAMILIES = [
215
+ { name: "Ionicons", component: Ionicons__default.default, getGlyphMap: () => glyphMapOf(Ionicons__default.default) },
216
+ { name: "MaterialIcons", component: MaterialIcons__default.default, getGlyphMap: () => glyphMapOf(MaterialIcons__default.default) },
217
+ { name: "FontAwesome5", component: FontAwesome5__default.default, getGlyphMap: () => glyphMapOf(FontAwesome5__default.default) },
218
+ { name: "Entypo", component: Entypo__default.default, getGlyphMap: () => glyphMapOf(Entypo__default.default) },
219
+ { name: "AntDesign", component: AntDesign__default.default, getGlyphMap: () => glyphMapOf(AntDesign__default.default) },
220
+ { name: "Feather", component: Feather__default.default, getGlyphMap: () => glyphMapOf(Feather__default.default) }
221
+ ];
222
+ var activeFamilies = ALL_FAMILIES;
223
+ var resolvedCache = null;
224
+ function buildCache(families) {
225
+ const cache = /* @__PURE__ */ new Map();
226
+ for (const family of activeFamilies) {
227
+ const glyphMap = family.getGlyphMap();
228
+ for (const iconName of Object.keys(glyphMap)) {
229
+ cache.set(iconName, family);
230
+ }
231
+ }
232
+ return cache;
233
+ }
234
+ function resolveFamily(name) {
235
+ if (!resolvedCache) {
236
+ resolvedCache = buildCache();
237
+ }
238
+ return resolvedCache.get(name) ?? null;
239
+ }
240
+ function Icon({ name, size, color, family }) {
241
+ let resolved = null;
242
+ if (family) {
243
+ resolved = ALL_FAMILIES.find((f) => f.name === family) ?? null;
244
+ } else {
245
+ resolved = resolveFamily(name);
246
+ }
247
+ if (!resolved) return null;
248
+ const Component = resolved.component;
249
+ return React3__default.default.createElement(Component, { name, size, color });
250
+ }
251
+ function renderIcon(name, size, color) {
252
+ return React3__default.default.createElement(Icon, { name, size, color });
253
+ }
254
+ ({
255
+ /** Material-style ease-out — natural deceleration for state changes. */
256
+ standard: reactNativeReanimated.Easing.bezier(0.2, 0, 0, 1),
257
+ /** Strong ease-out for expanding surfaces (Accordion open). */
258
+ expand: reactNativeReanimated.Easing.bezier(0.23, 1, 0.32, 1),
259
+ /** Quick ease-in for collapsing. */
260
+ collapse: reactNativeReanimated.Easing.in(reactNativeReanimated.Easing.ease)
261
+ });
262
+ var PRESS_SCALE = {
263
+ button: 0.95,
264
+ card: 0.98,
265
+ row: 0.97,
266
+ chip: 0.94
267
+ };
268
+ pressto.createAnimatedPressable((progress) => {
269
+ "worklet";
270
+ const scale2 = 1 - (1 - PRESS_SCALE.button) * progress;
271
+ return { transform: [{ scale: scale2 }] };
272
+ });
273
+ var PressableCard = pressto.createAnimatedPressable((progress) => {
274
+ "worklet";
275
+ const scale2 = 1 - (1 - PRESS_SCALE.card) * progress;
276
+ return { transform: [{ scale: scale2 }] };
277
+ });
278
+ pressto.createAnimatedPressable((progress) => {
279
+ "worklet";
280
+ const scale2 = 1 - (1 - PRESS_SCALE.row) * progress;
281
+ return { transform: [{ scale: scale2 }] };
282
+ });
283
+ pressto.createAnimatedPressable((progress) => {
284
+ "worklet";
285
+ const scale2 = 1 - (1 - PRESS_SCALE.chip) * progress;
286
+ return { transform: [{ scale: scale2 }] };
287
+ });
288
+ pressto.createAnimatedPressable((progress) => {
289
+ "worklet";
290
+ const scale2 = 1 - (1 - PRESS_SCALE.button) * progress;
291
+ return { transform: [{ scale: scale2 }] };
292
+ });
293
+
294
+ // src/components/Stats/Stats.tsx
295
+ var COMPACT_THRESHOLD = s(150);
296
+ function StatsComponent({
297
+ value,
298
+ label,
299
+ description,
300
+ icon,
301
+ iconName,
302
+ iconColor,
303
+ variant = "elevated",
304
+ onPress,
305
+ style,
306
+ accessibilityLabel
307
+ }) {
308
+ const { colors } = useTheme();
309
+ const [containerWidth, setContainerWidth] = React3.useState(0);
310
+ const handleLayout = React3.useCallback((e) => {
311
+ const w = e.nativeEvent.layout.width;
312
+ if (w > 0 && w !== containerWidth) {
313
+ setContainerWidth(w);
314
+ }
315
+ }, [containerWidth]);
316
+ const handlePress = () => {
317
+ if (!onPress) return;
318
+ impactLight();
319
+ onPress();
320
+ };
321
+ const isCompact = containerWidth > 0 && containerWidth < COMPACT_THRESHOLD && !!(icon ?? iconName);
322
+ const variantStyle = {
323
+ elevated: {
324
+ backgroundColor: colors.card,
325
+ borderWidth: 0,
326
+ shadowColor: "#000",
327
+ shadowOffset: { width: 0, height: 4 },
328
+ shadowOpacity: 0.09,
329
+ shadowRadius: 14,
330
+ elevation: 4
331
+ },
332
+ outlined: {
333
+ backgroundColor: colors.card,
334
+ borderColor: colors.border,
335
+ shadowOpacity: 0,
336
+ elevation: 0
337
+ },
338
+ filled: {
339
+ backgroundColor: colors.surfaceStrong,
340
+ borderColor: colors.border,
341
+ shadowOpacity: 0,
342
+ elevation: 0
343
+ }
344
+ }[variant];
345
+ const iconColorResolved = iconColor ?? colors.primary;
346
+ const resolvedIcon = iconName ? renderIcon(iconName, ms(22), iconColorResolved) : icon;
347
+ const iconElement = resolvedIcon ? /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: styles.iconWrapper }, resolvedIcon) : null;
348
+ const valueElement = /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.value, { color: colors.foreground }], allowFontScaling: true }, value);
349
+ const cardContent = /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: [styles.card, variantStyle, style], onLayout: handleLayout }, isCompact ? /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, iconElement, /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: styles.compactValue }, valueElement), /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.label, { color: colors.foregroundSubtle }], allowFontScaling: true }, label), description ? /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.description, { color: colors.foregroundMuted }], allowFontScaling: true }, description) : null) : /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: styles.valueRow }, iconElement, valueElement), /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.label, { color: colors.foregroundSubtle }], allowFontScaling: true }, label), description ? /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.description, { color: colors.foregroundMuted }], allowFontScaling: true }, description) : null));
350
+ if (onPress) {
351
+ return /* @__PURE__ */ React3__default.default.createElement(
352
+ PressableCard,
353
+ {
354
+ onPress: handlePress,
355
+ rippleColor: "transparent",
356
+ touchSoundDisabled: true,
357
+ activateOnHover: true,
358
+ accessibilityRole: "button",
359
+ accessibilityLabel
360
+ },
361
+ cardContent
362
+ );
363
+ }
364
+ return cardContent;
365
+ }
366
+ function StatsGroup({ children, gap = s(12), style }) {
367
+ return /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: [styles.group, { gap }, style] }, React3__default.default.Children.map(children, (child) => {
368
+ if (!React3__default.default.isValidElement(child)) return child;
369
+ const childStyle = child.props.style;
370
+ const mergedStyle = childStyle ? [childStyle, { alignSelf: "stretch" }] : [{ alignSelf: "stretch" }];
371
+ return /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: styles.groupItem }, React3__default.default.cloneElement(
372
+ child,
373
+ { style: mergedStyle }
374
+ ));
375
+ }));
376
+ }
377
+ var Stats = Object.assign(React3__default.default.memo(StatsComponent), { Group: StatsGroup });
378
+ var styles = reactNative.StyleSheet.create({
379
+ card: {
380
+ borderRadius: RADIUS.md,
381
+ borderWidth: 1,
382
+ padding: s(16),
383
+ alignSelf: "flex-start",
384
+ alignItems: "center",
385
+ justifyContent: "center"
386
+ },
387
+ valueRow: {
388
+ flexDirection: "row",
389
+ alignItems: "center",
390
+ justifyContent: "center",
391
+ gap: s(8)
392
+ },
393
+ iconWrapper: {
394
+ alignItems: "center",
395
+ justifyContent: "center"
396
+ },
397
+ compactValue: {
398
+ marginTop: vs(8)
399
+ },
400
+ value: {
401
+ fontFamily: "Sohne-Bold",
402
+ fontSize: ms(28),
403
+ lineHeight: mvs(32),
404
+ textAlign: "center"
405
+ },
406
+ label: {
407
+ fontFamily: "Sohne-Regular",
408
+ fontSize: ms(13),
409
+ lineHeight: mvs(18),
410
+ marginTop: vs(8),
411
+ textAlign: "center"
412
+ },
413
+ description: {
414
+ fontFamily: "Sohne-Regular",
415
+ fontSize: ms(12),
416
+ lineHeight: mvs(16),
417
+ marginTop: vs(4),
418
+ textAlign: "center"
419
+ },
420
+ group: {
421
+ flexDirection: "row",
422
+ width: "100%"
423
+ },
424
+ groupItem: {
425
+ flex: 1
426
+ }
427
+ });
428
+
429
+ exports.Stats = Stats;
package/dist/Stats.mjs ADDED
@@ -0,0 +1,9 @@
1
+ export { Stats } from './chunk-5OLNXP3S.mjs';
2
+ import './chunk-3DKJ2GIC.mjs';
3
+ import './chunk-EJ7ZPXOH.mjs';
4
+ import './chunk-DVK4G2GT.mjs';
5
+ import './chunk-QY3X2UYR.mjs';
6
+ import './chunk-KA7LTET3.mjs';
7
+ import './chunk-EMUWGDWC.mjs';
8
+ import './chunk-2CE3TQVY.mjs';
9
+ import './chunk-Y6FXYEAI.mjs';
package/dist/Switch.mjs CHANGED
@@ -1,6 +1,6 @@
1
- export { Switch } from './chunk-WF2XDFRK.mjs';
1
+ export { Switch } from './chunk-HLMPMUK2.mjs';
2
2
  import './chunk-EJ7ZPXOH.mjs';
3
3
  import './chunk-DVK4G2GT.mjs';
4
- import './chunk-SOYNZDVY.mjs';
4
+ import './chunk-EMUWGDWC.mjs';
5
5
  import './chunk-2CE3TQVY.mjs';
6
6
  import './chunk-Y6FXYEAI.mjs';
package/dist/TabBar.mjs CHANGED
@@ -1,6 +1,6 @@
1
- export { TabBar } from './chunk-Z6SFHN6T.mjs';
1
+ export { TabBar } from './chunk-D3Y2T42P.mjs';
2
2
  import './chunk-EJ7ZPXOH.mjs';
3
3
  import './chunk-KA7LTET3.mjs';
4
- import './chunk-SOYNZDVY.mjs';
4
+ import './chunk-EMUWGDWC.mjs';
5
5
  import './chunk-2CE3TQVY.mjs';
6
6
  import './chunk-Y6FXYEAI.mjs';
package/dist/Tabs.mjs CHANGED
@@ -1,7 +1,7 @@
1
- export { Tabs, TabsContent } from './chunk-GQYFLP3D.mjs';
1
+ export { Tabs, TabsContent } from './chunk-3GEYJ7I5.mjs';
2
2
  import './chunk-3DKJ2GIC.mjs';
3
3
  import './chunk-EJ7ZPXOH.mjs';
4
4
  import './chunk-DVK4G2GT.mjs';
5
- import './chunk-SOYNZDVY.mjs';
5
+ import './chunk-EMUWGDWC.mjs';
6
6
  import './chunk-2CE3TQVY.mjs';
7
7
  import './chunk-Y6FXYEAI.mjs';
package/dist/Text.d.mts CHANGED
@@ -5,8 +5,10 @@ type TextVariant = 'display-hero' | 'display-xl' | 'display-lg' | 'display-md' |
5
5
  interface TextProps extends TextProps$1 {
6
6
  variant?: TextVariant;
7
7
  color?: string;
8
+ /** Force uppercase text transformation. Useful for labels, headers, and buttons. */
9
+ uppercase?: boolean;
8
10
  }
9
- declare function TextBase({ variant, color, style, children, ...props }: TextProps): React.JSX.Element;
11
+ declare function TextBase({ variant, color, style, uppercase, children, ...props }: TextProps): React.JSX.Element;
10
12
  declare const Text: React.MemoExoticComponent<typeof TextBase>;
11
13
 
12
14
  export { Text, type TextProps, type TextVariant };
package/dist/Text.d.ts CHANGED
@@ -5,8 +5,10 @@ type TextVariant = 'display-hero' | 'display-xl' | 'display-lg' | 'display-md' |
5
5
  interface TextProps extends TextProps$1 {
6
6
  variant?: TextVariant;
7
7
  color?: string;
8
+ /** Force uppercase text transformation. Useful for labels, headers, and buttons. */
9
+ uppercase?: boolean;
8
10
  }
9
- declare function TextBase({ variant, color, style, children, ...props }: TextProps): React.JSX.Element;
11
+ declare function TextBase({ variant, color, style, uppercase, children, ...props }: TextProps): React.JSX.Element;
10
12
  declare const Text: React.MemoExoticComponent<typeof TextBase>;
11
13
 
12
14
  export { Text, type TextProps, type TextVariant };
package/dist/Text.js CHANGED
@@ -262,7 +262,7 @@ function warnIfFontsMissing() {
262
262
  try {
263
263
  if (!expoFont.isLoaded("Sohne-Regular")) {
264
264
  console.warn(
265
- "[retray-ui-kit] Sohne fonts are not loaded \u2014 text will fall back to the system font. Load them at your app root before rendering any UI kit component:\n\n import { useFonts } from 'expo-font'\n import { SohneFonts } from '@retray-dev/ui-kit/fonts'\n\n const [fontsLoaded] = useFonts(SohneFonts)\n if (!fontsLoaded) return null\n"
265
+ "[retray-ui-kit] Sohne fonts are not loaded \u2014 text will fall back to the system font. Load them at your app root before rendering any UI kit component:\n\n import { useFonts } from 'expo-font'\n import { SohneFontNames } from '@retray-dev/ui-kit/fonts'\n // Copy the SohneFonts boilerplate from CONSUMER.md into your App.tsx\n\n const [fontsLoaded] = useFonts(SohneFonts)\n if (!fontsLoaded) return null\n"
266
266
  );
267
267
  }
268
268
  } catch {
@@ -307,7 +307,7 @@ var defaultColorVariant = {
307
307
  "button-lg": "foreground",
308
308
  "button-sm": "foreground"
309
309
  };
310
- function TextBase({ variant = "body-md", color, style, children, ...props }) {
310
+ function TextBase({ variant = "body-md", color, style, uppercase, children, ...props }) {
311
311
  warnIfFontsMissing();
312
312
  const { colors } = useTheme();
313
313
  const colorKey = defaultColorVariant[variant] ?? "foreground";
@@ -315,7 +315,7 @@ function TextBase({ variant = "body-md", color, style, children, ...props }) {
315
315
  return /* @__PURE__ */ React2__default.default.createElement(
316
316
  reactNative.Text,
317
317
  {
318
- style: [variantStyles[variant], { color: resolvedColor }, style],
318
+ style: [variantStyles[variant], { color: resolvedColor }, uppercase && { textTransform: "uppercase" }, style],
319
319
  allowFontScaling: true,
320
320
  ...props
321
321
  },
package/dist/Text.mjs CHANGED
@@ -1,5 +1,5 @@
1
- export { Text } from './chunk-WJLKJMKR.mjs';
1
+ export { Text } from './chunk-357YO24D.mjs';
2
2
  import './chunk-QY3X2UYR.mjs';
3
- import './chunk-SOYNZDVY.mjs';
3
+ import './chunk-EMUWGDWC.mjs';
4
4
  import './chunk-2CE3TQVY.mjs';
5
5
  import './chunk-Y6FXYEAI.mjs';
package/dist/Textarea.mjs CHANGED
@@ -1,6 +1,6 @@
1
- export { Textarea } from './chunk-U2XJFYED.mjs';
1
+ export { Textarea } from './chunk-JNVAIDLK.mjs';
2
2
  import './chunk-DVK4G2GT.mjs';
3
3
  import './chunk-KA7LTET3.mjs';
4
- import './chunk-SOYNZDVY.mjs';
4
+ import './chunk-EMUWGDWC.mjs';
5
5
  import './chunk-2CE3TQVY.mjs';
6
6
  import './chunk-Y6FXYEAI.mjs';
package/dist/Toast.mjs CHANGED
@@ -1,4 +1,4 @@
1
- export { ToastProvider, sonnerToast as toast, useToast } from './chunk-2UYENBLV.mjs';
2
- import './chunk-SOYNZDVY.mjs';
1
+ export { ToastProvider, sonnerToast as toast, useToast } from './chunk-QSFV2P7O.mjs';
2
+ import './chunk-EMUWGDWC.mjs';
3
3
  import './chunk-2CE3TQVY.mjs';
4
4
  import './chunk-Y6FXYEAI.mjs';
package/dist/Toggle.mjs CHANGED
@@ -1,8 +1,8 @@
1
- export { Toggle } from './chunk-7LWRKMF5.mjs';
1
+ export { Toggle } from './chunk-FVTVCJAH.mjs';
2
2
  import './chunk-3DKJ2GIC.mjs';
3
3
  import './chunk-EJ7ZPXOH.mjs';
4
4
  import './chunk-DVK4G2GT.mjs';
5
5
  import './chunk-KA7LTET3.mjs';
6
- import './chunk-SOYNZDVY.mjs';
6
+ import './chunk-EMUWGDWC.mjs';
7
7
  import './chunk-2CE3TQVY.mjs';
8
8
  import './chunk-Y6FXYEAI.mjs';
@@ -1,7 +1,7 @@
1
1
  import { selectionAsync } from './chunk-EJ7ZPXOH.mjs';
2
2
  import { EASINGS, TIMINGS } from './chunk-DVK4G2GT.mjs';
3
3
  import { renderIcon } from './chunk-KA7LTET3.mjs';
4
- import { useTheme } from './chunk-SOYNZDVY.mjs';
4
+ import { useTheme } from './chunk-EMUWGDWC.mjs';
5
5
  import { ms, vs, s } from './chunk-2CE3TQVY.mjs';
6
6
  import React, { useState } from 'react';
7
7
  import { StyleSheet, View, Pressable, Text } from 'react-native';
@@ -1,5 +1,5 @@
1
- import { PagerDots } from './chunk-ZZ2R6KZ3.mjs';
2
- import { IconButton } from './chunk-T2KCAHOS.mjs';
1
+ import { PagerDots } from './chunk-OULVKTWL.mjs';
2
+ import { IconButton } from './chunk-DF6DU42P.mjs';
3
3
  import { s, vs } from './chunk-2CE3TQVY.mjs';
4
4
  import React, { useState, useCallback } from 'react';
5
5
  import { StyleSheet, useWindowDimensions, Dimensions, Modal, View, ScrollView, Image } from 'react-native';
@@ -1,7 +1,7 @@
1
1
  import { PressableCard } from './chunk-3DKJ2GIC.mjs';
2
2
  import { impactLight } from './chunk-EJ7ZPXOH.mjs';
3
3
  import { RADIUS } from './chunk-QY3X2UYR.mjs';
4
- import { useTheme } from './chunk-SOYNZDVY.mjs';
4
+ import { useTheme } from './chunk-EMUWGDWC.mjs';
5
5
  import { vs, s, mvs, ms } from './chunk-2CE3TQVY.mjs';
6
6
  import React from 'react';
7
7
  import { StyleSheet, View, Text } from 'react-native';
@@ -1,5 +1,5 @@
1
1
  import { SPRINGS } from './chunk-DVK4G2GT.mjs';
2
- import { useTheme } from './chunk-SOYNZDVY.mjs';
2
+ import { useTheme } from './chunk-EMUWGDWC.mjs';
3
3
  import { vs } from './chunk-2CE3TQVY.mjs';
4
4
  import React, { useState, useEffect } from 'react';
5
5
  import { StyleSheet, View } from 'react-native';
@@ -1,5 +1,5 @@
1
1
  import { TYPOGRAPHY } from './chunk-QY3X2UYR.mjs';
2
- import { useTheme } from './chunk-SOYNZDVY.mjs';
2
+ import { useTheme } from './chunk-EMUWGDWC.mjs';
3
3
  import { mvs, ms } from './chunk-2CE3TQVY.mjs';
4
4
  import React from 'react';
5
5
  import { Text as Text$1 } from 'react-native';
@@ -13,7 +13,7 @@ function warnIfFontsMissing() {
13
13
  try {
14
14
  if (!isLoaded("Sohne-Regular")) {
15
15
  console.warn(
16
- "[retray-ui-kit] Sohne fonts are not loaded \u2014 text will fall back to the system font. Load them at your app root before rendering any UI kit component:\n\n import { useFonts } from 'expo-font'\n import { SohneFonts } from '@retray-dev/ui-kit/fonts'\n\n const [fontsLoaded] = useFonts(SohneFonts)\n if (!fontsLoaded) return null\n"
16
+ "[retray-ui-kit] Sohne fonts are not loaded \u2014 text will fall back to the system font. Load them at your app root before rendering any UI kit component:\n\n import { useFonts } from 'expo-font'\n import { SohneFontNames } from '@retray-dev/ui-kit/fonts'\n // Copy the SohneFonts boilerplate from CONSUMER.md into your App.tsx\n\n const [fontsLoaded] = useFonts(SohneFonts)\n if (!fontsLoaded) return null\n"
17
17
  );
18
18
  }
19
19
  } catch {
@@ -58,7 +58,7 @@ var defaultColorVariant = {
58
58
  "button-lg": "foreground",
59
59
  "button-sm": "foreground"
60
60
  };
61
- function TextBase({ variant = "body-md", color, style, children, ...props }) {
61
+ function TextBase({ variant = "body-md", color, style, uppercase, children, ...props }) {
62
62
  warnIfFontsMissing();
63
63
  const { colors } = useTheme();
64
64
  const colorKey = defaultColorVariant[variant] ?? "foreground";
@@ -66,7 +66,7 @@ function TextBase({ variant = "body-md", color, style, children, ...props }) {
66
66
  return /* @__PURE__ */ React.createElement(
67
67
  Text$1,
68
68
  {
69
- style: [variantStyles[variant], { color: resolvedColor }, style],
69
+ style: [variantStyles[variant], { color: resolvedColor }, uppercase && { textTransform: "uppercase" }, style],
70
70
  allowFontScaling: true,
71
71
  ...props
72
72
  },
@@ -1,7 +1,7 @@
1
1
  import { PressableTab } from './chunk-3DKJ2GIC.mjs';
2
2
  import { selectionAsync } from './chunk-EJ7ZPXOH.mjs';
3
3
  import { SPRINGS } from './chunk-DVK4G2GT.mjs';
4
- import { useTheme } from './chunk-SOYNZDVY.mjs';
4
+ import { useTheme } from './chunk-EMUWGDWC.mjs';
5
5
  import { ms, s, vs } from './chunk-2CE3TQVY.mjs';
6
6
  import React, { useState, useRef, useCallback, useEffect } from 'react';
7
7
  import { StyleSheet, View, Text } from 'react-native';
@@ -1,7 +1,7 @@
1
1
  import { PressableButton } from './chunk-3DKJ2GIC.mjs';
2
2
  import { selectionAsync } from './chunk-EJ7ZPXOH.mjs';
3
3
  import { COLOR_TRANSITION, OPACITY_TRANSITION } from './chunk-DVK4G2GT.mjs';
4
- import { useTheme } from './chunk-SOYNZDVY.mjs';
4
+ import { useTheme } from './chunk-EMUWGDWC.mjs';
5
5
  import { mvs, ms, vs, s } from './chunk-2CE3TQVY.mjs';
6
6
  import React from 'react';
7
7
  import { StyleSheet, View, Text } from 'react-native';
@@ -1,5 +1,5 @@
1
1
  import { renderIcon } from './chunk-KA7LTET3.mjs';
2
- import { useTheme } from './chunk-SOYNZDVY.mjs';
2
+ import { useTheme } from './chunk-EMUWGDWC.mjs';
3
3
  import { vs, s, ms } from './chunk-2CE3TQVY.mjs';
4
4
  import React from 'react';
5
5
  import { StyleSheet, View, Text } from 'react-native';