@retray-dev/ui-kit 2.7.0 → 3.0.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.
- package/COMPONENTS.md +102 -15
- package/README.md +25 -5
- package/dist/index.d.mts +36 -6
- package/dist/index.d.ts +36 -6
- package/dist/index.js +692 -484
- package/dist/index.mjs +622 -415
- package/package.json +6 -3
- package/src/assets/fonts/Poppins-Black.ttf +0 -0
- package/src/assets/fonts/Poppins-BlackItalic.ttf +0 -0
- package/src/assets/fonts/Poppins-Bold.ttf +0 -0
- package/src/assets/fonts/Poppins-BoldItalic.ttf +0 -0
- package/src/assets/fonts/Poppins-ExtraBold.ttf +0 -0
- package/src/assets/fonts/Poppins-ExtraBoldItalic.ttf +0 -0
- package/src/assets/fonts/Poppins-ExtraLight.ttf +0 -0
- package/src/assets/fonts/Poppins-ExtraLightItalic.ttf +0 -0
- package/src/assets/fonts/Poppins-Italic.ttf +0 -0
- package/src/assets/fonts/Poppins-Light.ttf +0 -0
- package/src/assets/fonts/Poppins-LightItalic.ttf +0 -0
- package/src/assets/fonts/Poppins-Medium.ttf +0 -0
- package/src/assets/fonts/Poppins-MediumItalic.ttf +0 -0
- package/src/assets/fonts/Poppins-Regular.ttf +0 -0
- package/src/assets/fonts/Poppins-SemiBold.ttf +0 -0
- package/src/assets/fonts/Poppins-SemiBoldItalic.ttf +0 -0
- package/src/assets/fonts/Poppins-Thin.ttf +0 -0
- package/src/assets/fonts/Poppins-ThinItalic.ttf +0 -0
- package/src/components/Accordion/Accordion.tsx +16 -9
- package/src/components/AlertBanner/AlertBanner.tsx +35 -35
- package/src/components/Avatar/Avatar.tsx +1 -1
- package/src/components/Badge/Badge.tsx +12 -8
- package/src/components/Button/Button.tsx +9 -9
- package/src/components/Card/Card.tsx +12 -9
- package/src/components/Checkbox/Checkbox.tsx +9 -8
- package/src/components/Chip/Chip.tsx +22 -6
- package/src/components/ConfirmDialog/ConfirmDialog.tsx +86 -38
- package/src/components/CurrencyDisplay/CurrencyDisplay.tsx +1 -1
- package/src/components/CurrencyInput/CurrencyInput.tsx +11 -4
- package/src/components/EmptyState/EmptyState.tsx +2 -1
- package/src/components/IconButton/IconButton.tsx +147 -0
- package/src/components/IconButton/index.ts +2 -0
- package/src/components/Input/Input.tsx +12 -8
- package/src/components/LabelValue/LabelValue.tsx +4 -3
- package/src/components/ListItem/ListItem.tsx +10 -9
- package/src/components/MonthPicker/MonthPicker.tsx +1 -1
- package/src/components/RadioGroup/RadioGroup.tsx +36 -35
- package/src/components/Select/Select.tsx +19 -21
- package/src/components/Sheet/Sheet.tsx +4 -3
- package/src/components/Slider/Slider.tsx +3 -3
- package/src/components/Spinner/Spinner.tsx +36 -2
- package/src/components/Switch/Switch.tsx +4 -4
- package/src/components/Tabs/Tabs.tsx +10 -16
- package/src/components/Text/Text.tsx +6 -6
- package/src/components/Textarea/Textarea.tsx +8 -6
- package/src/components/Toast/Toast.tsx +29 -23
- package/src/components/Toggle/Toggle.tsx +7 -5
- package/src/fonts.ts +30 -0
- package/src/index.ts +1 -0
- package/src/theme/colors.ts +22 -14
- package/src/theme/types.ts +4 -0
- package/src/components/Alert/Alert.tsx +0 -84
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var React25 = require('react');
|
|
4
4
|
var reactNative = require('react-native');
|
|
5
5
|
var reactNativeSizeMatters = require('react-native-size-matters');
|
|
6
6
|
var AntDesign = require('@expo/vector-icons/AntDesign');
|
|
@@ -11,7 +11,7 @@ var MaterialIcons = require('@expo/vector-icons/MaterialIcons');
|
|
|
11
11
|
var Ionicons = require('@expo/vector-icons/Ionicons');
|
|
12
12
|
var vectorIcons = require('@expo/vector-icons');
|
|
13
13
|
var expoLinearGradient = require('expo-linear-gradient');
|
|
14
|
-
var
|
|
14
|
+
var Animated11 = require('react-native-reanimated');
|
|
15
15
|
var RNSlider = require('@react-native-community/slider');
|
|
16
16
|
var bottomSheet = require('@gorhom/bottom-sheet');
|
|
17
17
|
var picker = require('@react-native-picker/picker');
|
|
@@ -21,14 +21,14 @@ var reactNativeSafeAreaContext = require('react-native-safe-area-context');
|
|
|
21
21
|
|
|
22
22
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
23
23
|
|
|
24
|
-
var
|
|
24
|
+
var React25__default = /*#__PURE__*/_interopDefault(React25);
|
|
25
25
|
var AntDesign__default = /*#__PURE__*/_interopDefault(AntDesign);
|
|
26
26
|
var Entypo__default = /*#__PURE__*/_interopDefault(Entypo);
|
|
27
27
|
var Feather__default = /*#__PURE__*/_interopDefault(Feather);
|
|
28
28
|
var FontAwesome5__default = /*#__PURE__*/_interopDefault(FontAwesome5);
|
|
29
29
|
var MaterialIcons__default = /*#__PURE__*/_interopDefault(MaterialIcons);
|
|
30
30
|
var Ionicons__default = /*#__PURE__*/_interopDefault(Ionicons);
|
|
31
|
-
var
|
|
31
|
+
var Animated11__default = /*#__PURE__*/_interopDefault(Animated11);
|
|
32
32
|
var RNSlider__default = /*#__PURE__*/_interopDefault(RNSlider);
|
|
33
33
|
|
|
34
34
|
// src/theme/ThemeProvider.tsx
|
|
@@ -48,52 +48,60 @@ var defaultLight = {
|
|
|
48
48
|
accent: "#e4e4e4",
|
|
49
49
|
accentForeground: "#171717",
|
|
50
50
|
destructive: "#ef4444",
|
|
51
|
-
destructiveForeground: "#
|
|
51
|
+
destructiveForeground: "#ffffff",
|
|
52
52
|
border: "#e5e5e5",
|
|
53
53
|
input: "#e5e5e5",
|
|
54
54
|
ring: "#1a1a1a",
|
|
55
|
-
success: "#
|
|
56
|
-
successForeground: "#
|
|
55
|
+
success: "#1a7a45",
|
|
56
|
+
successForeground: "#ffffff",
|
|
57
|
+
destructiveTint: "#fff5f5",
|
|
58
|
+
destructiveBorder: "#fecaca",
|
|
59
|
+
successTint: "#f0fdf4",
|
|
60
|
+
successBorder: "#bbf7d0"
|
|
57
61
|
};
|
|
58
62
|
var defaultDark = {
|
|
59
|
-
background: "#
|
|
63
|
+
background: "#0f0f0f",
|
|
60
64
|
foreground: "#fafafa",
|
|
61
|
-
card: "#
|
|
65
|
+
card: "#1c1c1c",
|
|
62
66
|
cardForeground: "#fafafa",
|
|
63
67
|
primary: "#fafafa",
|
|
64
|
-
primaryForeground: "#
|
|
65
|
-
secondary: "#
|
|
68
|
+
primaryForeground: "#0f0f0f",
|
|
69
|
+
secondary: "#272727",
|
|
66
70
|
secondaryForeground: "#fafafa",
|
|
67
|
-
muted: "#
|
|
68
|
-
mutedForeground: "#
|
|
69
|
-
accent: "#
|
|
71
|
+
muted: "#272727",
|
|
72
|
+
mutedForeground: "#9a9a9a",
|
|
73
|
+
accent: "#2e2e2e",
|
|
70
74
|
accentForeground: "#fafafa",
|
|
71
75
|
destructive: "#dc2626",
|
|
72
|
-
destructiveForeground: "#
|
|
73
|
-
border: "#
|
|
76
|
+
destructiveForeground: "#ffffff",
|
|
77
|
+
border: "#303030",
|
|
74
78
|
input: "#2a2a2a",
|
|
75
79
|
ring: "#fafafa",
|
|
76
|
-
success: "#
|
|
77
|
-
successForeground: "#
|
|
80
|
+
success: "#166534",
|
|
81
|
+
successForeground: "#ffffff",
|
|
82
|
+
destructiveTint: "#3b0a0a",
|
|
83
|
+
destructiveBorder: "#7f1d1d",
|
|
84
|
+
successTint: "#052e16",
|
|
85
|
+
successBorder: "#166534"
|
|
78
86
|
};
|
|
79
87
|
|
|
80
88
|
// src/theme/ThemeProvider.tsx
|
|
81
|
-
var ThemeContext =
|
|
89
|
+
var ThemeContext = React25.createContext({
|
|
82
90
|
colors: defaultLight,
|
|
83
91
|
colorScheme: "light"
|
|
84
92
|
});
|
|
85
93
|
function ThemeProvider({ children, theme, colorScheme = "system" }) {
|
|
86
94
|
const systemScheme = reactNative.useColorScheme() ?? "light";
|
|
87
95
|
const resolvedScheme = colorScheme === "system" ? systemScheme : colorScheme;
|
|
88
|
-
const colors =
|
|
96
|
+
const colors = React25.useMemo(() => {
|
|
89
97
|
const base = resolvedScheme === "dark" ? defaultDark : defaultLight;
|
|
90
98
|
const override = resolvedScheme === "dark" ? theme?.dark : theme?.light;
|
|
91
99
|
return override ? { ...base, ...override } : base;
|
|
92
100
|
}, [resolvedScheme, theme]);
|
|
93
|
-
return /* @__PURE__ */
|
|
101
|
+
return /* @__PURE__ */ React25__default.default.createElement(ThemeContext.Provider, { value: { colors, colorScheme: resolvedScheme } }, children);
|
|
94
102
|
}
|
|
95
103
|
function useTheme() {
|
|
96
|
-
const context =
|
|
104
|
+
const context = React25.useContext(ThemeContext);
|
|
97
105
|
if (!context) {
|
|
98
106
|
throw new Error("useTheme must be used within a ThemeProvider");
|
|
99
107
|
}
|
|
@@ -162,23 +170,23 @@ function Icon({ name, size, color, family }) {
|
|
|
162
170
|
}
|
|
163
171
|
if (!resolved) return null;
|
|
164
172
|
const Component = resolved.component;
|
|
165
|
-
return
|
|
173
|
+
return React25__default.default.createElement(Component, { name, size, color });
|
|
166
174
|
}
|
|
167
175
|
function renderIcon(name, size, color) {
|
|
168
|
-
return
|
|
176
|
+
return React25__default.default.createElement(Icon, { name, size, color });
|
|
169
177
|
}
|
|
170
178
|
|
|
171
179
|
// src/components/Button/Button.tsx
|
|
172
180
|
var nativeDriver = reactNative.Platform.OS !== "web";
|
|
173
181
|
var containerSizeStyles = {
|
|
174
|
-
sm: { paddingHorizontal: s(
|
|
175
|
-
md: { paddingHorizontal: s(
|
|
176
|
-
lg: { paddingHorizontal: s(
|
|
182
|
+
sm: { paddingHorizontal: s(12), paddingVertical: vs(10), minHeight: 44 },
|
|
183
|
+
md: { paddingHorizontal: s(16), paddingVertical: vs(10), minHeight: 44 },
|
|
184
|
+
lg: { paddingHorizontal: s(20), paddingVertical: vs(12), minHeight: 48 }
|
|
177
185
|
};
|
|
178
186
|
var labelSizeStyles = {
|
|
179
|
-
sm: { fontSize: ms(
|
|
180
|
-
md: { fontSize: ms(
|
|
181
|
-
lg: { fontSize: ms(
|
|
187
|
+
sm: { fontSize: ms(13) },
|
|
188
|
+
md: { fontSize: ms(15) },
|
|
189
|
+
lg: { fontSize: ms(16) }
|
|
182
190
|
};
|
|
183
191
|
var iconSizeMap = { sm: 16, md: 18, lg: 20 };
|
|
184
192
|
function Button({
|
|
@@ -198,7 +206,7 @@ function Button({
|
|
|
198
206
|
}) {
|
|
199
207
|
const { colors } = useTheme();
|
|
200
208
|
const isDisabled = disabled || loading;
|
|
201
|
-
const scale2 =
|
|
209
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
202
210
|
const handlePressIn = () => {
|
|
203
211
|
if (isDisabled) return;
|
|
204
212
|
reactNative.Animated.spring(scale2, {
|
|
@@ -231,7 +239,7 @@ function Button({
|
|
|
231
239
|
}[variant];
|
|
232
240
|
const effectiveIcon = iconName ? renderIcon(iconName, iconSizeMap[size], iconColor ?? labelVariantStyle.color) : typeof icon === "function" ? icon({ label, size, variant }) : icon;
|
|
233
241
|
const spinnerColor = variant === "destructive" ? colors.destructiveForeground : variant === "primary" || variant === "secondary" ? colors.primaryForeground : colors.foreground;
|
|
234
|
-
return /* @__PURE__ */
|
|
242
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [fullWidth && styles.fullWidth, { transform: [{ scale: scale2 }] }] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
235
243
|
reactNative.TouchableOpacity,
|
|
236
244
|
{
|
|
237
245
|
style: [
|
|
@@ -250,12 +258,12 @@ function Button({
|
|
|
250
258
|
onPressOut: handlePressOut,
|
|
251
259
|
...props
|
|
252
260
|
},
|
|
253
|
-
loading ? /* @__PURE__ */
|
|
261
|
+
loading ? /* @__PURE__ */ React25__default.default.createElement(reactNative.ActivityIndicator, { size: "small", color: spinnerColor }) : /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, effectiveIcon && iconPosition === "left" && /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, effectiveIcon), /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles.label, labelVariantStyle, labelSizeStyles[size], effectiveIcon ? styles.labelWithIcon : void 0], allowFontScaling: true }, label), effectiveIcon && iconPosition === "right" && /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, effectiveIcon))
|
|
254
262
|
));
|
|
255
263
|
}
|
|
256
264
|
var styles = reactNative.StyleSheet.create({
|
|
257
265
|
base: {
|
|
258
|
-
borderRadius:
|
|
266
|
+
borderRadius: 8,
|
|
259
267
|
alignItems: "center",
|
|
260
268
|
justifyContent: "center",
|
|
261
269
|
flexDirection: "row"
|
|
@@ -267,24 +275,114 @@ var styles = reactNative.StyleSheet.create({
|
|
|
267
275
|
opacity: 0.5
|
|
268
276
|
},
|
|
269
277
|
label: {
|
|
270
|
-
|
|
278
|
+
fontFamily: "Poppins-SemiBold"
|
|
271
279
|
},
|
|
272
280
|
labelWithIcon: {
|
|
273
281
|
marginHorizontal: s(8)
|
|
274
282
|
}
|
|
275
283
|
});
|
|
284
|
+
var nativeDriver2 = reactNative.Platform.OS !== "web";
|
|
285
|
+
var sizeMap = {
|
|
286
|
+
sm: { container: s(40), icon: 18 },
|
|
287
|
+
md: { container: s(44), icon: 20 },
|
|
288
|
+
lg: { container: s(52), icon: 24 }
|
|
289
|
+
};
|
|
290
|
+
function IconButton({
|
|
291
|
+
iconName,
|
|
292
|
+
icon,
|
|
293
|
+
iconColor,
|
|
294
|
+
variant = "primary",
|
|
295
|
+
size = "md",
|
|
296
|
+
loading = false,
|
|
297
|
+
disabled,
|
|
298
|
+
style,
|
|
299
|
+
onPress,
|
|
300
|
+
...props
|
|
301
|
+
}) {
|
|
302
|
+
const { colors } = useTheme();
|
|
303
|
+
const isDisabled = disabled || loading;
|
|
304
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
305
|
+
const handlePressIn = () => {
|
|
306
|
+
if (isDisabled) return;
|
|
307
|
+
reactNative.Animated.spring(scale2, {
|
|
308
|
+
toValue: 0.95,
|
|
309
|
+
useNativeDriver: nativeDriver2,
|
|
310
|
+
speed: 40,
|
|
311
|
+
bounciness: 0
|
|
312
|
+
}).start();
|
|
313
|
+
};
|
|
314
|
+
const handlePressOut = () => {
|
|
315
|
+
reactNative.Animated.spring(scale2, {
|
|
316
|
+
toValue: 1,
|
|
317
|
+
useNativeDriver: nativeDriver2,
|
|
318
|
+
speed: 40,
|
|
319
|
+
bounciness: 4
|
|
320
|
+
}).start();
|
|
321
|
+
};
|
|
322
|
+
const handlePress = (e) => {
|
|
323
|
+
impactLight();
|
|
324
|
+
onPress?.(e);
|
|
325
|
+
};
|
|
326
|
+
const containerVariantStyle = {
|
|
327
|
+
primary: { backgroundColor: colors.primary },
|
|
328
|
+
secondary: { backgroundColor: colors.secondary },
|
|
329
|
+
outline: { backgroundColor: "transparent", borderWidth: 1.5, borderColor: colors.border },
|
|
330
|
+
ghost: { backgroundColor: "transparent" },
|
|
331
|
+
destructive: { backgroundColor: colors.destructive }
|
|
332
|
+
}[variant];
|
|
333
|
+
const defaultIconColor = {
|
|
334
|
+
primary: colors.primaryForeground,
|
|
335
|
+
secondary: colors.secondaryForeground,
|
|
336
|
+
outline: colors.foreground,
|
|
337
|
+
ghost: colors.foreground,
|
|
338
|
+
destructive: colors.destructiveForeground
|
|
339
|
+
}[variant];
|
|
340
|
+
const spinnerColor = variant === "destructive" ? colors.destructiveForeground : variant === "primary" || variant === "secondary" ? colors.primaryForeground : colors.foreground;
|
|
341
|
+
const { container: containerSize, icon: iconSize } = sizeMap[size];
|
|
342
|
+
const resolvedIcon = iconName ? renderIcon(iconName, iconSize, iconColor ?? defaultIconColor) : icon;
|
|
343
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: { transform: [{ scale: scale2 }] } }, /* @__PURE__ */ React25__default.default.createElement(
|
|
344
|
+
reactNative.TouchableOpacity,
|
|
345
|
+
{
|
|
346
|
+
style: [
|
|
347
|
+
styles2.base,
|
|
348
|
+
containerVariantStyle,
|
|
349
|
+
{ width: containerSize, height: containerSize },
|
|
350
|
+
isDisabled && styles2.disabled,
|
|
351
|
+
style
|
|
352
|
+
],
|
|
353
|
+
disabled: isDisabled,
|
|
354
|
+
activeOpacity: 1,
|
|
355
|
+
touchSoundDisabled: true,
|
|
356
|
+
onPress: handlePress,
|
|
357
|
+
onPressIn: handlePressIn,
|
|
358
|
+
onPressOut: handlePressOut,
|
|
359
|
+
...props
|
|
360
|
+
},
|
|
361
|
+
loading ? /* @__PURE__ */ React25__default.default.createElement(reactNative.ActivityIndicator, { size: "small", color: spinnerColor }) : resolvedIcon
|
|
362
|
+
));
|
|
363
|
+
}
|
|
364
|
+
var styles2 = reactNative.StyleSheet.create({
|
|
365
|
+
base: {
|
|
366
|
+
borderRadius: 999,
|
|
367
|
+
alignItems: "center",
|
|
368
|
+
justifyContent: "center"
|
|
369
|
+
},
|
|
370
|
+
disabled: {
|
|
371
|
+
opacity: 0.5
|
|
372
|
+
}
|
|
373
|
+
});
|
|
276
374
|
var variantStyles = {
|
|
277
|
-
h1: { fontSize: ms(40),
|
|
278
|
-
h2: { fontSize: ms(28),
|
|
279
|
-
h3: { fontSize: ms(22),
|
|
280
|
-
body: { fontSize: ms(17),
|
|
281
|
-
caption: { fontSize: ms(13),
|
|
282
|
-
label: { fontSize: ms(15),
|
|
375
|
+
h1: { fontFamily: "Poppins-Bold", fontSize: ms(40), lineHeight: mvs(52) },
|
|
376
|
+
h2: { fontFamily: "Poppins-Bold", fontSize: ms(28), lineHeight: mvs(36) },
|
|
377
|
+
h3: { fontFamily: "Poppins-SemiBold", fontSize: ms(22), lineHeight: mvs(30) },
|
|
378
|
+
body: { fontFamily: "Poppins-Regular", fontSize: ms(17), lineHeight: mvs(26) },
|
|
379
|
+
caption: { fontFamily: "Poppins-Regular", fontSize: ms(13), lineHeight: mvs(20) },
|
|
380
|
+
label: { fontFamily: "Poppins-Medium", fontSize: ms(15), lineHeight: mvs(22) }
|
|
283
381
|
};
|
|
284
382
|
function Text2({ variant = "body", color, style, children, ...props }) {
|
|
285
383
|
const { colors } = useTheme();
|
|
286
384
|
const defaultColor = variant === "caption" ? colors.mutedForeground : colors.foreground;
|
|
287
|
-
return /* @__PURE__ */
|
|
385
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
288
386
|
reactNative.Text,
|
|
289
387
|
{
|
|
290
388
|
style: [variantStyles[variant], { color: color ?? defaultColor }, style],
|
|
@@ -297,29 +395,29 @@ function Text2({ variant = "body", color, style, children, ...props }) {
|
|
|
297
395
|
var webInputResetStyle = reactNative.Platform.OS === "web" ? { outlineStyle: "none", outlineWidth: 0, outlineColor: "transparent", boxShadow: "none" } : {};
|
|
298
396
|
function Input({ label, error, hint, prefix, suffix, prefixStyle, suffixStyle, prefixIcon, suffixIcon, prefixIconColor, suffixIconColor, type = "text", containerStyle, style, onFocus, onBlur, secureTextEntry, ...props }) {
|
|
299
397
|
const { colors } = useTheme();
|
|
300
|
-
const [focused, setFocused] =
|
|
301
|
-
const [showPassword, setShowPassword] =
|
|
398
|
+
const [focused, setFocused] = React25.useState(false);
|
|
399
|
+
const [showPassword, setShowPassword] = React25.useState(false);
|
|
302
400
|
const isPassword = type === "password";
|
|
303
401
|
const effectiveSecure = isPassword ? !showPassword : secureTextEntry;
|
|
304
402
|
const effectivePrefix = prefixIcon ? renderIcon(prefixIcon, 20, prefixIconColor ?? colors.mutedForeground) : prefix;
|
|
305
|
-
const effectiveSuffix = isPassword && !suffix && !suffixIcon ? /* @__PURE__ */
|
|
306
|
-
return /* @__PURE__ */
|
|
403
|
+
const effectiveSuffix = isPassword && !suffix && !suffixIcon ? /* @__PURE__ */ React25__default.default.createElement(reactNative.TouchableOpacity, { onPress: () => setShowPassword(!showPassword), style: styles3.passwordToggle, activeOpacity: 0.6 }, /* @__PURE__ */ React25__default.default.createElement(vectorIcons.AntDesign, { name: showPassword ? "eye" : "eye-invisible", size: 20, color: colors.mutedForeground })) : suffixIcon ? renderIcon(suffixIcon, 20, suffixIconColor ?? colors.mutedForeground) : suffix;
|
|
404
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles3.container, containerStyle] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles3.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, /* @__PURE__ */ React25__default.default.createElement(
|
|
307
405
|
reactNative.View,
|
|
308
406
|
{
|
|
309
407
|
style: [
|
|
310
|
-
|
|
408
|
+
styles3.inputWrapper,
|
|
311
409
|
{
|
|
312
410
|
borderColor: error ? colors.destructive : focused ? colors.ring ?? colors.primary : colors.border,
|
|
313
411
|
backgroundColor: colors.background
|
|
314
412
|
}
|
|
315
413
|
]
|
|
316
414
|
},
|
|
317
|
-
effectivePrefix ? typeof effectivePrefix === "string" ? /* @__PURE__ */
|
|
318
|
-
/* @__PURE__ */
|
|
415
|
+
effectivePrefix ? typeof effectivePrefix === "string" ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles3.prefixText, { color: colors.mutedForeground }, prefixStyle], allowFontScaling: true }, effectivePrefix) : /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles3.prefixContainer }, effectivePrefix) : null,
|
|
416
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
319
417
|
reactNative.TextInput,
|
|
320
418
|
{
|
|
321
419
|
style: [
|
|
322
|
-
|
|
420
|
+
styles3.input,
|
|
323
421
|
{
|
|
324
422
|
color: colors.foreground
|
|
325
423
|
},
|
|
@@ -340,48 +438,52 @@ function Input({ label, error, hint, prefix, suffix, prefixStyle, suffixStyle, p
|
|
|
340
438
|
...props
|
|
341
439
|
}
|
|
342
440
|
),
|
|
343
|
-
effectiveSuffix ? typeof effectiveSuffix === "string" ? /* @__PURE__ */
|
|
344
|
-
), error ? /* @__PURE__ */
|
|
441
|
+
effectiveSuffix ? typeof effectiveSuffix === "string" ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles3.suffixText, { color: colors.mutedForeground }, suffixStyle], allowFontScaling: true }, effectiveSuffix) : /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles3.suffixContainer }, effectiveSuffix) : null
|
|
442
|
+
), error ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles3.helperText, { color: colors.destructive }], allowFontScaling: true }, error) : null, !error && hint ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles3.helperText, { color: colors.mutedForeground }], allowFontScaling: true }, hint) : null);
|
|
345
443
|
}
|
|
346
|
-
var
|
|
444
|
+
var styles3 = reactNative.StyleSheet.create({
|
|
347
445
|
container: {
|
|
348
446
|
gap: vs(8)
|
|
349
447
|
},
|
|
350
448
|
label: {
|
|
351
|
-
|
|
352
|
-
|
|
449
|
+
fontFamily: "Poppins-Medium",
|
|
450
|
+
fontSize: ms(13)
|
|
353
451
|
},
|
|
354
452
|
inputWrapper: {
|
|
355
453
|
flexDirection: "row",
|
|
356
454
|
alignItems: "center",
|
|
357
|
-
borderWidth: 1
|
|
455
|
+
borderWidth: 1,
|
|
358
456
|
borderRadius: ms(8),
|
|
359
|
-
paddingHorizontal: s(
|
|
360
|
-
paddingVertical: vs(
|
|
457
|
+
paddingHorizontal: s(14),
|
|
458
|
+
paddingVertical: vs(11)
|
|
361
459
|
},
|
|
362
460
|
input: {
|
|
461
|
+
fontFamily: "Poppins-Regular",
|
|
363
462
|
flex: 1,
|
|
364
|
-
fontSize: ms(
|
|
463
|
+
fontSize: ms(15),
|
|
365
464
|
paddingVertical: 0
|
|
366
465
|
},
|
|
367
466
|
prefixContainer: {
|
|
368
467
|
marginRight: s(8)
|
|
369
468
|
},
|
|
370
469
|
prefixText: {
|
|
371
|
-
|
|
470
|
+
fontFamily: "Poppins-Regular",
|
|
471
|
+
fontSize: ms(15),
|
|
372
472
|
marginRight: s(8)
|
|
373
473
|
},
|
|
374
474
|
suffixContainer: {
|
|
375
475
|
marginLeft: s(8)
|
|
376
476
|
},
|
|
377
477
|
suffixText: {
|
|
378
|
-
|
|
478
|
+
fontFamily: "Poppins-Regular",
|
|
479
|
+
fontSize: ms(15),
|
|
379
480
|
marginLeft: s(8)
|
|
380
481
|
},
|
|
381
482
|
passwordToggle: {
|
|
382
483
|
padding: s(4)
|
|
383
484
|
},
|
|
384
485
|
helperText: {
|
|
486
|
+
fontFamily: "Poppins-Regular",
|
|
385
487
|
fontSize: ms(13)
|
|
386
488
|
}
|
|
387
489
|
});
|
|
@@ -407,42 +509,46 @@ function Badge({ label, children, variant = "default", size = "md", icon, iconNa
|
|
|
407
509
|
default: { backgroundColor: colors.primary },
|
|
408
510
|
secondary: { backgroundColor: colors.secondary },
|
|
409
511
|
destructive: { backgroundColor: colors.destructive },
|
|
410
|
-
outline: { backgroundColor: "transparent", borderWidth: 1, borderColor: colors.border }
|
|
512
|
+
outline: { backgroundColor: "transparent", borderWidth: 1, borderColor: colors.border },
|
|
513
|
+
success: { backgroundColor: colors.success },
|
|
514
|
+
warning: { backgroundColor: "#f59e0b" },
|
|
515
|
+
successOutline: { backgroundColor: colors.successTint, borderWidth: 1, borderColor: colors.successBorder },
|
|
516
|
+
destructiveOutline: { backgroundColor: colors.destructiveTint, borderWidth: 1, borderColor: colors.destructiveBorder }
|
|
411
517
|
}[variant];
|
|
412
518
|
const textColor = {
|
|
413
519
|
default: colors.primaryForeground,
|
|
414
520
|
secondary: colors.secondaryForeground,
|
|
415
521
|
destructive: colors.destructiveForeground,
|
|
416
|
-
outline: colors.foreground
|
|
522
|
+
outline: colors.foreground,
|
|
523
|
+
success: colors.successForeground,
|
|
524
|
+
warning: "#ffffff",
|
|
525
|
+
successOutline: colors.success,
|
|
526
|
+
destructiveOutline: colors.destructive
|
|
417
527
|
}[variant];
|
|
418
528
|
const effectiveIcon = iconName ? renderIcon(iconName, sizeIconSize[size], iconColor ?? textColor) : icon;
|
|
419
529
|
const content = children ?? label;
|
|
420
|
-
return /* @__PURE__ */
|
|
530
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles4.container, containerStyle, sizePadding[size], { gap: sizeIconGap[size] }, style] }, effectiveIcon, typeof content === "string" ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles4.label, { color: textColor }, sizeFontSize[size]], allowFontScaling: true }, content) : content);
|
|
421
531
|
}
|
|
422
|
-
var
|
|
532
|
+
var styles4 = reactNative.StyleSheet.create({
|
|
423
533
|
container: {
|
|
424
|
-
borderRadius:
|
|
534
|
+
borderRadius: 9999,
|
|
425
535
|
alignSelf: "flex-start",
|
|
426
536
|
flexDirection: "row",
|
|
427
537
|
alignItems: "center"
|
|
428
538
|
},
|
|
429
|
-
iconContainer: {
|
|
430
|
-
justifyContent: "center",
|
|
431
|
-
alignItems: "center"
|
|
432
|
-
},
|
|
433
539
|
label: {
|
|
434
|
-
|
|
540
|
+
fontFamily: "Poppins-Medium"
|
|
435
541
|
}
|
|
436
542
|
});
|
|
437
|
-
var
|
|
543
|
+
var nativeDriver3 = reactNative.Platform.OS !== "web";
|
|
438
544
|
function Card({ children, variant = "elevated", onPress, style }) {
|
|
439
545
|
const { colors } = useTheme();
|
|
440
|
-
const scale2 =
|
|
546
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
441
547
|
const handlePressIn = () => {
|
|
442
548
|
if (!onPress) return;
|
|
443
549
|
reactNative.Animated.spring(scale2, {
|
|
444
550
|
toValue: 0.98,
|
|
445
|
-
useNativeDriver:
|
|
551
|
+
useNativeDriver: nativeDriver3,
|
|
446
552
|
speed: 40,
|
|
447
553
|
bounciness: 0
|
|
448
554
|
}).start();
|
|
@@ -451,7 +557,7 @@ function Card({ children, variant = "elevated", onPress, style }) {
|
|
|
451
557
|
if (!onPress) return;
|
|
452
558
|
reactNative.Animated.spring(scale2, {
|
|
453
559
|
toValue: 1,
|
|
454
|
-
useNativeDriver:
|
|
560
|
+
useNativeDriver: nativeDriver3,
|
|
455
561
|
speed: 40,
|
|
456
562
|
bounciness: 4
|
|
457
563
|
}).start();
|
|
@@ -484,9 +590,9 @@ function Card({ children, variant = "elevated", onPress, style }) {
|
|
|
484
590
|
elevation: 0
|
|
485
591
|
}
|
|
486
592
|
}[variant];
|
|
487
|
-
const cardContent = /* @__PURE__ */
|
|
593
|
+
const cardContent = /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles5.card, variantStyle, style] }, children);
|
|
488
594
|
if (onPress) {
|
|
489
|
-
return /* @__PURE__ */
|
|
595
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: { transform: [{ scale: scale2 }] } }, /* @__PURE__ */ React25__default.default.createElement(
|
|
490
596
|
reactNative.TouchableOpacity,
|
|
491
597
|
{
|
|
492
598
|
onPress: handlePress,
|
|
@@ -501,46 +607,49 @@ function Card({ children, variant = "elevated", onPress, style }) {
|
|
|
501
607
|
return cardContent;
|
|
502
608
|
}
|
|
503
609
|
function CardHeader({ children, style }) {
|
|
504
|
-
return /* @__PURE__ */
|
|
610
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles5.header, style] }, children);
|
|
505
611
|
}
|
|
506
612
|
function CardTitle({ children, style }) {
|
|
507
613
|
const { colors } = useTheme();
|
|
508
|
-
return /* @__PURE__ */
|
|
614
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles5.title, { color: colors.cardForeground }, style], allowFontScaling: true }, children);
|
|
509
615
|
}
|
|
510
616
|
function CardDescription({ children, style }) {
|
|
511
617
|
const { colors } = useTheme();
|
|
512
|
-
return /* @__PURE__ */
|
|
618
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles5.description, { color: colors.mutedForeground }, style], allowFontScaling: true }, children);
|
|
513
619
|
}
|
|
514
620
|
function CardContent({ children, style }) {
|
|
515
|
-
return /* @__PURE__ */
|
|
621
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles5.content, style] }, children);
|
|
516
622
|
}
|
|
517
623
|
function CardFooter({ children, style }) {
|
|
518
|
-
return /* @__PURE__ */
|
|
624
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles5.footer, style] }, children);
|
|
519
625
|
}
|
|
520
|
-
var
|
|
626
|
+
var styles5 = reactNative.StyleSheet.create({
|
|
521
627
|
card: {
|
|
522
628
|
borderRadius: ms(12),
|
|
523
629
|
borderWidth: 1
|
|
524
630
|
},
|
|
525
631
|
header: {
|
|
526
|
-
padding: s(
|
|
632
|
+
padding: s(16),
|
|
527
633
|
paddingBottom: 0,
|
|
528
|
-
gap: vs(
|
|
634
|
+
gap: vs(4)
|
|
529
635
|
},
|
|
530
636
|
title: {
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
lineHeight: mvs(
|
|
637
|
+
fontFamily: "Poppins-SemiBold",
|
|
638
|
+
fontSize: ms(16),
|
|
639
|
+
lineHeight: mvs(22)
|
|
534
640
|
},
|
|
535
641
|
description: {
|
|
536
|
-
|
|
537
|
-
|
|
642
|
+
fontFamily: "Poppins-Regular",
|
|
643
|
+
fontSize: ms(13),
|
|
644
|
+
lineHeight: mvs(18)
|
|
538
645
|
},
|
|
539
646
|
content: {
|
|
540
|
-
padding: s(
|
|
647
|
+
padding: s(16),
|
|
648
|
+
paddingTop: s(12)
|
|
541
649
|
},
|
|
542
650
|
footer: {
|
|
543
|
-
|
|
651
|
+
paddingHorizontal: s(16),
|
|
652
|
+
paddingBottom: vs(14),
|
|
544
653
|
paddingTop: 0,
|
|
545
654
|
flexDirection: "row",
|
|
546
655
|
alignItems: "center"
|
|
@@ -548,18 +657,18 @@ var styles4 = reactNative.StyleSheet.create({
|
|
|
548
657
|
});
|
|
549
658
|
function Separator({ orientation = "horizontal", style }) {
|
|
550
659
|
const { colors } = useTheme();
|
|
551
|
-
return /* @__PURE__ */
|
|
660
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
552
661
|
reactNative.View,
|
|
553
662
|
{
|
|
554
663
|
style: [
|
|
555
|
-
orientation === "horizontal" ?
|
|
664
|
+
orientation === "horizontal" ? styles6.horizontal : styles6.vertical,
|
|
556
665
|
{ backgroundColor: colors.border },
|
|
557
666
|
style
|
|
558
667
|
]
|
|
559
668
|
}
|
|
560
669
|
);
|
|
561
670
|
}
|
|
562
|
-
var
|
|
671
|
+
var styles6 = reactNative.StyleSheet.create({
|
|
563
672
|
horizontal: {
|
|
564
673
|
height: 1,
|
|
565
674
|
width: "100%"
|
|
@@ -569,21 +678,46 @@ var styles5 = reactNative.StyleSheet.create({
|
|
|
569
678
|
height: "100%"
|
|
570
679
|
}
|
|
571
680
|
});
|
|
572
|
-
var
|
|
681
|
+
var sizeMap2 = {
|
|
573
682
|
sm: "small",
|
|
574
683
|
md: "small",
|
|
575
684
|
lg: "large"
|
|
576
685
|
};
|
|
577
|
-
|
|
686
|
+
var labelFontSize = {
|
|
687
|
+
sm: ms(11),
|
|
688
|
+
md: ms(13),
|
|
689
|
+
lg: ms(14)
|
|
690
|
+
};
|
|
691
|
+
function Spinner({ size = "md", color, label, ...props }) {
|
|
578
692
|
const { colors } = useTheme();
|
|
579
|
-
|
|
693
|
+
if (label) {
|
|
694
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles7.wrapper }, /* @__PURE__ */ React25__default.default.createElement(reactNative.ActivityIndicator, { size: sizeMap2[size], color: color ?? colors.primary, ...props }), /* @__PURE__ */ React25__default.default.createElement(
|
|
695
|
+
reactNative.Text,
|
|
696
|
+
{
|
|
697
|
+
style: [styles7.label, { color: colors.mutedForeground, fontSize: labelFontSize[size] }],
|
|
698
|
+
allowFontScaling: true
|
|
699
|
+
},
|
|
700
|
+
label
|
|
701
|
+
));
|
|
702
|
+
}
|
|
703
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.ActivityIndicator, { size: sizeMap2[size], color: color ?? colors.primary, ...props });
|
|
580
704
|
}
|
|
705
|
+
var styles7 = reactNative.StyleSheet.create({
|
|
706
|
+
wrapper: {
|
|
707
|
+
alignItems: "center",
|
|
708
|
+
gap: vs(6)
|
|
709
|
+
},
|
|
710
|
+
label: {
|
|
711
|
+
fontFamily: "Poppins-Regular",
|
|
712
|
+
lineHeight: mvs(18)
|
|
713
|
+
}
|
|
714
|
+
});
|
|
581
715
|
function Skeleton({ width = "100%", height = 16, borderRadius = 6, style }) {
|
|
582
716
|
const { colors, colorScheme } = useTheme();
|
|
583
|
-
const shimmerAnim =
|
|
584
|
-
const [containerWidth, setContainerWidth] =
|
|
717
|
+
const shimmerAnim = React25.useRef(new reactNative.Animated.Value(0)).current;
|
|
718
|
+
const [containerWidth, setContainerWidth] = React25.useState(300);
|
|
585
719
|
const shimmerHighlight = colorScheme === "dark" ? "rgba(255,255,255,0.08)" : "rgba(255,255,255,0.7)";
|
|
586
|
-
|
|
720
|
+
React25.useEffect(() => {
|
|
587
721
|
const animation = reactNative.Animated.loop(
|
|
588
722
|
reactNative.Animated.timing(shimmerAnim, {
|
|
589
723
|
toValue: 1,
|
|
@@ -598,17 +732,17 @@ function Skeleton({ width = "100%", height = 16, borderRadius = 6, style }) {
|
|
|
598
732
|
inputRange: [0, 1],
|
|
599
733
|
outputRange: [-containerWidth, containerWidth]
|
|
600
734
|
});
|
|
601
|
-
return /* @__PURE__ */
|
|
735
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
602
736
|
reactNative.View,
|
|
603
737
|
{
|
|
604
738
|
style: [
|
|
605
|
-
|
|
739
|
+
styles8.base,
|
|
606
740
|
{ width, height, borderRadius, backgroundColor: colors.muted },
|
|
607
741
|
style
|
|
608
742
|
],
|
|
609
743
|
onLayout: (e) => setContainerWidth(e.nativeEvent.layout.width)
|
|
610
744
|
},
|
|
611
|
-
/* @__PURE__ */
|
|
745
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [reactNative.StyleSheet.absoluteFill, { transform: [{ translateX }] }] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
612
746
|
expoLinearGradient.LinearGradient,
|
|
613
747
|
{
|
|
614
748
|
colors: ["transparent", shimmerHighlight, "transparent"],
|
|
@@ -619,12 +753,12 @@ function Skeleton({ width = "100%", height = 16, borderRadius = 6, style }) {
|
|
|
619
753
|
))
|
|
620
754
|
);
|
|
621
755
|
}
|
|
622
|
-
var
|
|
756
|
+
var styles8 = reactNative.StyleSheet.create({
|
|
623
757
|
base: {
|
|
624
758
|
overflow: "hidden"
|
|
625
759
|
}
|
|
626
760
|
});
|
|
627
|
-
var
|
|
761
|
+
var sizeMap3 = {
|
|
628
762
|
sm: s(28),
|
|
629
763
|
md: s(40),
|
|
630
764
|
lg: s(56),
|
|
@@ -638,8 +772,8 @@ var fontSizeMap = {
|
|
|
638
772
|
};
|
|
639
773
|
function Avatar({ src, fallback, size = "md", style }) {
|
|
640
774
|
const { colors } = useTheme();
|
|
641
|
-
const [imageError, setImageError] =
|
|
642
|
-
const dimension =
|
|
775
|
+
const [imageError, setImageError] = React25.useState(false);
|
|
776
|
+
const dimension = sizeMap3[size];
|
|
643
777
|
const showFallback = !src || imageError;
|
|
644
778
|
const containerStyle = {
|
|
645
779
|
width: dimension,
|
|
@@ -648,66 +782,69 @@ function Avatar({ src, fallback, size = "md", style }) {
|
|
|
648
782
|
backgroundColor: colors.muted,
|
|
649
783
|
overflow: "hidden"
|
|
650
784
|
};
|
|
651
|
-
return /* @__PURE__ */
|
|
785
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles9.base, containerStyle, style] }, !showFallback ? /* @__PURE__ */ React25__default.default.createElement(
|
|
652
786
|
reactNative.Image,
|
|
653
787
|
{
|
|
654
788
|
source: { uri: src },
|
|
655
789
|
style: { width: dimension, height: dimension },
|
|
656
790
|
onError: () => setImageError(true)
|
|
657
791
|
}
|
|
658
|
-
) : /* @__PURE__ */
|
|
792
|
+
) : /* @__PURE__ */ React25__default.default.createElement(
|
|
659
793
|
reactNative.Text,
|
|
660
794
|
{
|
|
661
|
-
style: [
|
|
795
|
+
style: [styles9.fallback, { color: colors.mutedForeground, fontSize: fontSizeMap[size] }],
|
|
662
796
|
allowFontScaling: true
|
|
663
797
|
},
|
|
664
798
|
fallback?.slice(0, 2).toUpperCase() ?? "?"
|
|
665
799
|
));
|
|
666
800
|
}
|
|
667
|
-
var
|
|
801
|
+
var styles9 = reactNative.StyleSheet.create({
|
|
668
802
|
base: {
|
|
669
803
|
alignItems: "center",
|
|
670
804
|
justifyContent: "center"
|
|
671
805
|
},
|
|
672
806
|
fallback: {
|
|
673
|
-
|
|
807
|
+
fontFamily: "Poppins-Medium"
|
|
674
808
|
}
|
|
675
809
|
});
|
|
676
810
|
function AlertBanner({ title, description, variant = "default", icon, iconName, iconColor, style }) {
|
|
677
811
|
const { colors } = useTheme();
|
|
678
|
-
const
|
|
679
|
-
const
|
|
680
|
-
const
|
|
681
|
-
const defaultIcon = variant === "success" ? /* @__PURE__ */
|
|
682
|
-
const effectiveIcon = iconName ? renderIcon(iconName, 18, iconColor ??
|
|
683
|
-
return /* @__PURE__ */
|
|
812
|
+
const bgColor = variant === "destructive" ? colors.destructiveBorder : variant === "success" ? colors.successBorder : colors.card;
|
|
813
|
+
const textColor = variant === "destructive" ? "#991b1b" : variant === "success" ? "#166534" : colors.foreground;
|
|
814
|
+
const borderColor = textColor;
|
|
815
|
+
const defaultIcon = variant === "success" ? /* @__PURE__ */ React25__default.default.createElement(vectorIcons.FontAwesome5, { name: "check-circle", size: 18, color: textColor }) : variant === "destructive" ? /* @__PURE__ */ React25__default.default.createElement(vectorIcons.MaterialIcons, { name: "error-outline", size: 20, color: textColor }) : /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "info-with-circle", size: 18, color: textColor });
|
|
816
|
+
const effectiveIcon = iconName ? renderIcon(iconName, 18, iconColor ?? textColor) : icon ?? defaultIcon;
|
|
817
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles10.container, { backgroundColor: bgColor, borderColor }, style] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles10.header }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles10.icon }, effectiveIcon), title ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles10.title, { color: textColor }], allowFontScaling: true }, title) : null), description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles10.description, { color: textColor, opacity: 0.85 }], allowFontScaling: true }, description) : null);
|
|
684
818
|
}
|
|
685
|
-
var
|
|
819
|
+
var styles10 = reactNative.StyleSheet.create({
|
|
686
820
|
container: {
|
|
687
|
-
flexDirection: "row",
|
|
688
821
|
borderWidth: 1,
|
|
689
822
|
borderRadius: ms(12),
|
|
690
|
-
|
|
691
|
-
|
|
823
|
+
paddingHorizontal: s(14),
|
|
824
|
+
paddingVertical: vs(12),
|
|
825
|
+
gap: vs(8),
|
|
692
826
|
shadowColor: "#000",
|
|
693
|
-
shadowOffset: { width: 0, height:
|
|
694
|
-
shadowOpacity: 0.
|
|
695
|
-
shadowRadius:
|
|
696
|
-
elevation:
|
|
827
|
+
shadowOffset: { width: 0, height: 3 },
|
|
828
|
+
shadowOpacity: 0.1,
|
|
829
|
+
shadowRadius: 8,
|
|
830
|
+
elevation: 5
|
|
831
|
+
},
|
|
832
|
+
header: {
|
|
833
|
+
flexDirection: "row",
|
|
834
|
+
alignItems: "center",
|
|
835
|
+
gap: s(10)
|
|
697
836
|
},
|
|
698
837
|
icon: {
|
|
699
838
|
marginTop: 0
|
|
700
839
|
},
|
|
701
|
-
content: {
|
|
702
|
-
flex: 1,
|
|
703
|
-
gap: vs(4)
|
|
704
|
-
},
|
|
705
840
|
title: {
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
lineHeight: mvs(20)
|
|
841
|
+
fontFamily: "Poppins-Bold",
|
|
842
|
+
fontSize: ms(15),
|
|
843
|
+
lineHeight: mvs(20),
|
|
844
|
+
flex: 1
|
|
709
845
|
},
|
|
710
846
|
description: {
|
|
847
|
+
fontFamily: "Poppins-Regular",
|
|
711
848
|
fontSize: ms(14),
|
|
712
849
|
lineHeight: mvs(20)
|
|
713
850
|
}
|
|
@@ -715,9 +852,9 @@ var styles8 = reactNative.StyleSheet.create({
|
|
|
715
852
|
function Progress({ value = 0, max = 100, style }) {
|
|
716
853
|
const { colors } = useTheme();
|
|
717
854
|
const percent = Math.min(Math.max(value / max * 100, 0), 100);
|
|
718
|
-
const [trackWidth, setTrackWidth] =
|
|
719
|
-
const animatedWidth =
|
|
720
|
-
|
|
855
|
+
const [trackWidth, setTrackWidth] = React25.useState(0);
|
|
856
|
+
const animatedWidth = React25.useRef(new reactNative.Animated.Value(0)).current;
|
|
857
|
+
React25.useEffect(() => {
|
|
721
858
|
if (trackWidth === 0) return;
|
|
722
859
|
reactNative.Animated.spring(animatedWidth, {
|
|
723
860
|
toValue: percent / 100 * trackWidth,
|
|
@@ -726,21 +863,21 @@ function Progress({ value = 0, max = 100, style }) {
|
|
|
726
863
|
bounciness: 0
|
|
727
864
|
}).start();
|
|
728
865
|
}, [percent, trackWidth]);
|
|
729
|
-
return /* @__PURE__ */
|
|
866
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
730
867
|
reactNative.View,
|
|
731
868
|
{
|
|
732
|
-
style: [
|
|
869
|
+
style: [styles11.track, { backgroundColor: colors.muted }, style],
|
|
733
870
|
onLayout: (e) => setTrackWidth(e.nativeEvent.layout.width)
|
|
734
871
|
},
|
|
735
|
-
/* @__PURE__ */
|
|
872
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
736
873
|
reactNative.Animated.View,
|
|
737
874
|
{
|
|
738
|
-
style: [
|
|
875
|
+
style: [styles11.indicator, { width: animatedWidth, backgroundColor: colors.primary }]
|
|
739
876
|
}
|
|
740
877
|
)
|
|
741
878
|
);
|
|
742
879
|
}
|
|
743
|
-
var
|
|
880
|
+
var styles11 = reactNative.StyleSheet.create({
|
|
744
881
|
track: {
|
|
745
882
|
height: vs(8),
|
|
746
883
|
borderRadius: 999,
|
|
@@ -756,39 +893,39 @@ function EmptyState({ icon, iconName, iconColor, title, description, action, siz
|
|
|
756
893
|
const { colors } = useTheme();
|
|
757
894
|
const isCompact = size === "compact";
|
|
758
895
|
const effectiveIcon = iconName ? renderIcon(iconName, isCompact ? 32 : 48, iconColor ?? colors.mutedForeground) : icon;
|
|
759
|
-
return /* @__PURE__ */
|
|
896
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
760
897
|
reactNative.View,
|
|
761
898
|
{
|
|
762
899
|
style: [
|
|
763
|
-
|
|
764
|
-
isCompact &&
|
|
900
|
+
styles12.container,
|
|
901
|
+
isCompact && styles12.containerCompact,
|
|
765
902
|
{ borderColor: colors.border },
|
|
766
903
|
style
|
|
767
904
|
]
|
|
768
905
|
},
|
|
769
|
-
effectiveIcon ? /* @__PURE__ */
|
|
906
|
+
effectiveIcon ? /* @__PURE__ */ React25__default.default.createElement(
|
|
770
907
|
reactNative.View,
|
|
771
908
|
{
|
|
772
909
|
style: [
|
|
773
|
-
|
|
774
|
-
isCompact &&
|
|
910
|
+
styles12.iconWrapper,
|
|
911
|
+
isCompact && styles12.iconWrapperCompact,
|
|
775
912
|
{ backgroundColor: colors.muted }
|
|
776
913
|
]
|
|
777
914
|
},
|
|
778
915
|
effectiveIcon
|
|
779
916
|
) : null,
|
|
780
|
-
/* @__PURE__ */
|
|
917
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles12.textWrapper }, /* @__PURE__ */ React25__default.default.createElement(
|
|
781
918
|
reactNative.Text,
|
|
782
919
|
{
|
|
783
|
-
style: [
|
|
920
|
+
style: [styles12.title, isCompact && styles12.titleCompact, { color: colors.foreground }],
|
|
784
921
|
allowFontScaling: true
|
|
785
922
|
},
|
|
786
923
|
title
|
|
787
|
-
), description && !isCompact ? /* @__PURE__ */
|
|
788
|
-
action && !isCompact ? /* @__PURE__ */
|
|
924
|
+
), description && !isCompact ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles12.description, { color: colors.mutedForeground }], allowFontScaling: true }, description) : null),
|
|
925
|
+
action && !isCompact ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles12.action }, action) : null
|
|
789
926
|
);
|
|
790
927
|
}
|
|
791
|
-
var
|
|
928
|
+
var styles12 = reactNative.StyleSheet.create({
|
|
792
929
|
container: {
|
|
793
930
|
alignItems: "center",
|
|
794
931
|
justifyContent: "center",
|
|
@@ -820,14 +957,15 @@ var styles10 = reactNative.StyleSheet.create({
|
|
|
820
957
|
maxWidth: s(320)
|
|
821
958
|
},
|
|
822
959
|
title: {
|
|
960
|
+
fontFamily: "Poppins-Medium",
|
|
823
961
|
fontSize: ms(18),
|
|
824
|
-
fontWeight: "500",
|
|
825
962
|
textAlign: "center"
|
|
826
963
|
},
|
|
827
964
|
titleCompact: {
|
|
828
965
|
fontSize: ms(15)
|
|
829
966
|
},
|
|
830
967
|
description: {
|
|
968
|
+
fontFamily: "Poppins-Regular",
|
|
831
969
|
fontSize: ms(14),
|
|
832
970
|
lineHeight: mvs(20),
|
|
833
971
|
textAlign: "center"
|
|
@@ -849,15 +987,15 @@ function Textarea({
|
|
|
849
987
|
...props
|
|
850
988
|
}) {
|
|
851
989
|
const { colors } = useTheme();
|
|
852
|
-
const [focused, setFocused] =
|
|
853
|
-
return /* @__PURE__ */
|
|
990
|
+
const [focused, setFocused] = React25.useState(false);
|
|
991
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles13.container, containerStyle] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles13.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, /* @__PURE__ */ React25__default.default.createElement(
|
|
854
992
|
reactNative.TextInput,
|
|
855
993
|
{
|
|
856
994
|
multiline: true,
|
|
857
995
|
numberOfLines: rows,
|
|
858
996
|
textAlignVertical: "top",
|
|
859
997
|
style: [
|
|
860
|
-
|
|
998
|
+
styles13.input,
|
|
861
999
|
{
|
|
862
1000
|
borderColor: error ? colors.destructive : focused ? colors.ring ?? colors.primary : colors.border,
|
|
863
1001
|
color: colors.foreground,
|
|
@@ -879,28 +1017,30 @@ function Textarea({
|
|
|
879
1017
|
allowFontScaling: true,
|
|
880
1018
|
...props
|
|
881
1019
|
}
|
|
882
|
-
), error ? /* @__PURE__ */
|
|
1020
|
+
), error ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles13.helperText, { color: colors.destructive }], allowFontScaling: true }, error) : null, !error && hint ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles13.helperText, { color: colors.mutedForeground }], allowFontScaling: true }, hint) : null);
|
|
883
1021
|
}
|
|
884
|
-
var
|
|
1022
|
+
var styles13 = reactNative.StyleSheet.create({
|
|
885
1023
|
container: {
|
|
886
1024
|
gap: vs(8)
|
|
887
1025
|
},
|
|
888
1026
|
label: {
|
|
889
|
-
|
|
890
|
-
|
|
1027
|
+
fontFamily: "Poppins-Medium",
|
|
1028
|
+
fontSize: ms(13)
|
|
891
1029
|
},
|
|
892
1030
|
input: {
|
|
893
|
-
|
|
1031
|
+
fontFamily: "Poppins-Regular",
|
|
1032
|
+
borderWidth: 1,
|
|
894
1033
|
borderRadius: ms(8),
|
|
895
|
-
paddingHorizontal: s(
|
|
896
|
-
paddingVertical: vs(
|
|
897
|
-
fontSize: ms(
|
|
1034
|
+
paddingHorizontal: s(14),
|
|
1035
|
+
paddingVertical: vs(11),
|
|
1036
|
+
fontSize: ms(15)
|
|
898
1037
|
},
|
|
899
1038
|
helperText: {
|
|
1039
|
+
fontFamily: "Poppins-Regular",
|
|
900
1040
|
fontSize: ms(13)
|
|
901
1041
|
}
|
|
902
1042
|
});
|
|
903
|
-
var
|
|
1043
|
+
var nativeDriver4 = reactNative.Platform.OS !== "web";
|
|
904
1044
|
function Checkbox({
|
|
905
1045
|
checked = false,
|
|
906
1046
|
onCheckedChange,
|
|
@@ -909,18 +1049,18 @@ function Checkbox({
|
|
|
909
1049
|
style
|
|
910
1050
|
}) {
|
|
911
1051
|
const { colors } = useTheme();
|
|
912
|
-
const scale2 =
|
|
1052
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
913
1053
|
const handlePressIn = () => {
|
|
914
1054
|
if (disabled) return;
|
|
915
|
-
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1055
|
+
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver4, speed: 40, bounciness: 0 }).start();
|
|
916
1056
|
};
|
|
917
1057
|
const handlePressOut = () => {
|
|
918
|
-
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1058
|
+
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver4, speed: 40, bounciness: 0 }).start();
|
|
919
1059
|
};
|
|
920
|
-
return /* @__PURE__ */
|
|
1060
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
921
1061
|
reactNative.TouchableOpacity,
|
|
922
1062
|
{
|
|
923
|
-
style: [
|
|
1063
|
+
style: [styles14.row, style],
|
|
924
1064
|
onPress: () => {
|
|
925
1065
|
selectionAsync();
|
|
926
1066
|
onCheckedChange?.(!checked);
|
|
@@ -931,30 +1071,32 @@ function Checkbox({
|
|
|
931
1071
|
activeOpacity: 1,
|
|
932
1072
|
touchSoundDisabled: true
|
|
933
1073
|
},
|
|
934
|
-
/* @__PURE__ */
|
|
935
|
-
reactNative.View,
|
|
1074
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
1075
|
+
reactNative.Animated.View,
|
|
936
1076
|
{
|
|
937
1077
|
style: [
|
|
938
|
-
|
|
1078
|
+
styles14.box,
|
|
939
1079
|
{
|
|
940
1080
|
borderColor: checked ? colors.primary : colors.border,
|
|
941
1081
|
backgroundColor: checked ? colors.primary : "transparent",
|
|
942
|
-
opacity: disabled ? 0.45 : 1
|
|
1082
|
+
opacity: disabled ? 0.45 : 1,
|
|
1083
|
+
transform: [{ scale: scale2 }]
|
|
943
1084
|
}
|
|
944
1085
|
]
|
|
945
1086
|
},
|
|
946
|
-
checked ? /* @__PURE__ */
|
|
1087
|
+
checked ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles14.checkmark, { borderColor: colors.primaryForeground }] }) : null
|
|
947
1088
|
),
|
|
948
|
-
label ? /* @__PURE__ */
|
|
1089
|
+
label ? /* @__PURE__ */ React25__default.default.createElement(
|
|
949
1090
|
reactNative.Text,
|
|
950
1091
|
{
|
|
951
|
-
style: [
|
|
1092
|
+
style: [styles14.label, { color: disabled ? colors.mutedForeground : colors.foreground }],
|
|
1093
|
+
allowFontScaling: true
|
|
952
1094
|
},
|
|
953
1095
|
label
|
|
954
1096
|
) : null
|
|
955
|
-
)
|
|
1097
|
+
);
|
|
956
1098
|
}
|
|
957
|
-
var
|
|
1099
|
+
var styles14 = reactNative.StyleSheet.create({
|
|
958
1100
|
row: {
|
|
959
1101
|
flexDirection: "row",
|
|
960
1102
|
alignItems: "center",
|
|
@@ -963,7 +1105,7 @@ var styles12 = reactNative.StyleSheet.create({
|
|
|
963
1105
|
box: {
|
|
964
1106
|
width: s(24),
|
|
965
1107
|
height: s(24),
|
|
966
|
-
borderRadius: ms(
|
|
1108
|
+
borderRadius: ms(4),
|
|
967
1109
|
borderWidth: 1.5,
|
|
968
1110
|
alignItems: "center",
|
|
969
1111
|
justifyContent: "center"
|
|
@@ -976,25 +1118,26 @@ var styles12 = reactNative.StyleSheet.create({
|
|
|
976
1118
|
transform: [{ rotate: "-45deg" }, { translateY: -1 }]
|
|
977
1119
|
},
|
|
978
1120
|
label: {
|
|
979
|
-
|
|
980
|
-
|
|
1121
|
+
fontFamily: "Poppins-Regular",
|
|
1122
|
+
fontSize: ms(14),
|
|
1123
|
+
lineHeight: mvs(20)
|
|
981
1124
|
}
|
|
982
1125
|
});
|
|
983
|
-
var
|
|
984
|
-
var TRACK_WIDTH = s(
|
|
985
|
-
var TRACK_HEIGHT =
|
|
986
|
-
var THUMB_SIZE = s(
|
|
987
|
-
var THUMB_OFFSET = s(
|
|
1126
|
+
var nativeDriver5 = reactNative.Platform.OS !== "web";
|
|
1127
|
+
var TRACK_WIDTH = s(52);
|
|
1128
|
+
var TRACK_HEIGHT = s(30);
|
|
1129
|
+
var THUMB_SIZE = s(24);
|
|
1130
|
+
var THUMB_OFFSET = s(3);
|
|
988
1131
|
var THUMB_TRAVEL = TRACK_WIDTH - THUMB_SIZE - THUMB_OFFSET * 2;
|
|
989
1132
|
function Switch({ checked = false, onCheckedChange, disabled, style }) {
|
|
990
1133
|
const { colors } = useTheme();
|
|
991
|
-
const translateX =
|
|
992
|
-
const trackOpacity =
|
|
993
|
-
|
|
1134
|
+
const translateX = React25.useRef(new reactNative.Animated.Value(checked ? THUMB_TRAVEL : 0)).current;
|
|
1135
|
+
const trackOpacity = React25.useRef(new reactNative.Animated.Value(checked ? 1 : 0)).current;
|
|
1136
|
+
React25.useEffect(() => {
|
|
994
1137
|
reactNative.Animated.parallel([
|
|
995
1138
|
reactNative.Animated.spring(translateX, {
|
|
996
1139
|
toValue: checked ? THUMB_TRAVEL : 0,
|
|
997
|
-
useNativeDriver:
|
|
1140
|
+
useNativeDriver: nativeDriver5,
|
|
998
1141
|
bounciness: 4
|
|
999
1142
|
}),
|
|
1000
1143
|
reactNative.Animated.timing(trackOpacity, {
|
|
@@ -1008,7 +1151,7 @@ function Switch({ checked = false, onCheckedChange, disabled, style }) {
|
|
|
1008
1151
|
inputRange: [0, 1],
|
|
1009
1152
|
outputRange: [colors.muted, colors.primary]
|
|
1010
1153
|
});
|
|
1011
|
-
return /* @__PURE__ */
|
|
1154
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [{ opacity: disabled ? 0.45 : 1 }, style] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1012
1155
|
reactNative.TouchableOpacity,
|
|
1013
1156
|
{
|
|
1014
1157
|
onPress: () => {
|
|
@@ -1018,20 +1161,20 @@ function Switch({ checked = false, onCheckedChange, disabled, style }) {
|
|
|
1018
1161
|
disabled,
|
|
1019
1162
|
activeOpacity: 0.8,
|
|
1020
1163
|
touchSoundDisabled: true,
|
|
1021
|
-
style:
|
|
1164
|
+
style: styles15.wrapper
|
|
1022
1165
|
},
|
|
1023
|
-
/* @__PURE__ */
|
|
1166
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [styles15.track, { backgroundColor: trackColor }] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1024
1167
|
reactNative.Animated.View,
|
|
1025
1168
|
{
|
|
1026
1169
|
style: [
|
|
1027
|
-
|
|
1170
|
+
styles15.thumb,
|
|
1028
1171
|
{ backgroundColor: colors.primaryForeground, transform: [{ translateX }] }
|
|
1029
1172
|
]
|
|
1030
1173
|
}
|
|
1031
1174
|
))
|
|
1032
1175
|
));
|
|
1033
1176
|
}
|
|
1034
|
-
var
|
|
1177
|
+
var styles15 = reactNative.StyleSheet.create({
|
|
1035
1178
|
wrapper: {},
|
|
1036
1179
|
track: {
|
|
1037
1180
|
width: TRACK_WIDTH,
|
|
@@ -1054,6 +1197,7 @@ var styles13 = reactNative.StyleSheet.create({
|
|
|
1054
1197
|
elevation: 2
|
|
1055
1198
|
}
|
|
1056
1199
|
});
|
|
1200
|
+
var nativeDriver6 = reactNative.Platform.OS !== "web";
|
|
1057
1201
|
var sizeStyles = {
|
|
1058
1202
|
sm: { paddingHorizontal: s(12), paddingVertical: vs(8), minWidth: s(40), minHeight: vs(40) },
|
|
1059
1203
|
md: { paddingHorizontal: s(16), paddingVertical: vs(12), minWidth: s(44), minHeight: vs(44) },
|
|
@@ -1077,9 +1221,9 @@ function Toggle({
|
|
|
1077
1221
|
...props
|
|
1078
1222
|
}) {
|
|
1079
1223
|
const { colors } = useTheme();
|
|
1080
|
-
const scale2 =
|
|
1081
|
-
const pressAnim =
|
|
1082
|
-
|
|
1224
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
1225
|
+
const pressAnim = React25.useRef(new reactNative.Animated.Value(pressed ? 1 : 0)).current;
|
|
1226
|
+
React25.useEffect(() => {
|
|
1083
1227
|
reactNative.Animated.timing(pressAnim, {
|
|
1084
1228
|
toValue: pressed ? 1 : 0,
|
|
1085
1229
|
duration: 150,
|
|
@@ -1089,10 +1233,10 @@ function Toggle({
|
|
|
1089
1233
|
}, [pressed, pressAnim]);
|
|
1090
1234
|
const handlePressIn = () => {
|
|
1091
1235
|
if (disabled) return;
|
|
1092
|
-
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1236
|
+
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver6, speed: 40, bounciness: 0 }).start();
|
|
1093
1237
|
};
|
|
1094
1238
|
const handlePressOut = () => {
|
|
1095
|
-
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1239
|
+
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver6, speed: 40, bounciness: 4 }).start();
|
|
1096
1240
|
};
|
|
1097
1241
|
const borderColor = pressAnim.interpolate({
|
|
1098
1242
|
inputRange: [0, 1],
|
|
@@ -1114,17 +1258,17 @@ function Toggle({
|
|
|
1114
1258
|
return prop;
|
|
1115
1259
|
};
|
|
1116
1260
|
if (pressed) {
|
|
1117
|
-
if (activeIconName) return /* @__PURE__ */
|
|
1261
|
+
if (activeIconName) return /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, renderIcon(activeIconName, iconSize, activeIconColor ?? colors.primary));
|
|
1118
1262
|
const active = renderProp(activeIcon);
|
|
1119
|
-
if (active) return /* @__PURE__ */
|
|
1120
|
-
return /* @__PURE__ */
|
|
1263
|
+
if (active) return /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, active);
|
|
1264
|
+
return /* @__PURE__ */ React25__default.default.createElement(vectorIcons.FontAwesome5, { name: "check-circle", size: iconSize, color: colors.primary });
|
|
1121
1265
|
}
|
|
1122
|
-
if (iconName) return /* @__PURE__ */
|
|
1266
|
+
if (iconName) return /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, renderIcon(iconName, iconSize, iconColor ?? colors.mutedForeground));
|
|
1123
1267
|
const custom = renderProp(icon);
|
|
1124
|
-
if (custom) return /* @__PURE__ */
|
|
1125
|
-
return /* @__PURE__ */
|
|
1268
|
+
if (custom) return /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, custom);
|
|
1269
|
+
return /* @__PURE__ */ React25__default.default.createElement(vectorIcons.FontAwesome5, { name: "circle", size: iconSize, color: colors.mutedForeground });
|
|
1126
1270
|
};
|
|
1127
|
-
return /* @__PURE__ */
|
|
1271
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [{ transform: [{ scale: scale2 }] }, disabled && styles16.disabled, style] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1128
1272
|
reactNative.TouchableOpacity,
|
|
1129
1273
|
{
|
|
1130
1274
|
onPress: () => {
|
|
@@ -1138,20 +1282,20 @@ function Toggle({
|
|
|
1138
1282
|
touchSoundDisabled: true,
|
|
1139
1283
|
...props
|
|
1140
1284
|
},
|
|
1141
|
-
/* @__PURE__ */
|
|
1285
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
1142
1286
|
reactNative.Animated.View,
|
|
1143
1287
|
{
|
|
1144
1288
|
style: [
|
|
1145
|
-
|
|
1289
|
+
styles16.base,
|
|
1146
1290
|
sizeStyles[size],
|
|
1147
1291
|
{ borderColor, backgroundColor, borderWidth: 2 }
|
|
1148
1292
|
]
|
|
1149
1293
|
},
|
|
1150
|
-
/* @__PURE__ */
|
|
1294
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles16.inner }, /* @__PURE__ */ React25__default.default.createElement(LeftIcon, null), label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.Text, { style: [styles16.label, { color: textColor }], allowFontScaling: true }, label) : null)
|
|
1151
1295
|
)
|
|
1152
1296
|
));
|
|
1153
1297
|
}
|
|
1154
|
-
var
|
|
1298
|
+
var styles16 = reactNative.StyleSheet.create({
|
|
1155
1299
|
base: {
|
|
1156
1300
|
borderRadius: ms(8)
|
|
1157
1301
|
},
|
|
@@ -1165,29 +1309,29 @@ var styles14 = reactNative.StyleSheet.create({
|
|
|
1165
1309
|
opacity: 0.45
|
|
1166
1310
|
},
|
|
1167
1311
|
label: {
|
|
1168
|
-
|
|
1169
|
-
|
|
1312
|
+
fontFamily: "Poppins-Medium",
|
|
1313
|
+
fontSize: ms(14)
|
|
1170
1314
|
}
|
|
1171
1315
|
});
|
|
1172
|
-
var
|
|
1316
|
+
var nativeDriver7 = reactNative.Platform.OS !== "web";
|
|
1173
1317
|
function RadioItem({
|
|
1174
1318
|
option,
|
|
1175
1319
|
selected,
|
|
1176
1320
|
onSelect
|
|
1177
1321
|
}) {
|
|
1178
1322
|
const { colors } = useTheme();
|
|
1179
|
-
const scale2 =
|
|
1323
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
1180
1324
|
const handlePressIn = () => {
|
|
1181
1325
|
if (option.disabled) return;
|
|
1182
|
-
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1326
|
+
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver7, speed: 40, bounciness: 0 }).start();
|
|
1183
1327
|
};
|
|
1184
1328
|
const handlePressOut = () => {
|
|
1185
|
-
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1329
|
+
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver7, speed: 40, bounciness: 4 }).start();
|
|
1186
1330
|
};
|
|
1187
|
-
return /* @__PURE__ */
|
|
1331
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
1188
1332
|
reactNative.TouchableOpacity,
|
|
1189
1333
|
{
|
|
1190
|
-
style:
|
|
1334
|
+
style: styles17.row,
|
|
1191
1335
|
onPress: () => {
|
|
1192
1336
|
if (!option.disabled) {
|
|
1193
1337
|
selectionAsync();
|
|
@@ -1200,30 +1344,32 @@ function RadioItem({
|
|
|
1200
1344
|
touchSoundDisabled: true,
|
|
1201
1345
|
disabled: option.disabled
|
|
1202
1346
|
},
|
|
1203
|
-
/* @__PURE__ */
|
|
1204
|
-
reactNative.View,
|
|
1347
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
1348
|
+
reactNative.Animated.View,
|
|
1205
1349
|
{
|
|
1206
1350
|
style: [
|
|
1207
|
-
|
|
1351
|
+
styles17.radio,
|
|
1208
1352
|
{
|
|
1209
1353
|
borderColor: selected ? colors.primary : colors.border,
|
|
1210
|
-
opacity: option.disabled ? 0.45 : 1
|
|
1354
|
+
opacity: option.disabled ? 0.45 : 1,
|
|
1355
|
+
transform: [{ scale: scale2 }]
|
|
1211
1356
|
}
|
|
1212
1357
|
]
|
|
1213
1358
|
},
|
|
1214
|
-
selected ? /* @__PURE__ */
|
|
1359
|
+
selected ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles17.dot, { backgroundColor: colors.primary }] }) : null
|
|
1215
1360
|
),
|
|
1216
|
-
/* @__PURE__ */
|
|
1361
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
1217
1362
|
reactNative.Text,
|
|
1218
1363
|
{
|
|
1219
1364
|
style: [
|
|
1220
|
-
|
|
1365
|
+
styles17.label,
|
|
1221
1366
|
{ color: option.disabled ? colors.mutedForeground : colors.foreground }
|
|
1222
|
-
]
|
|
1367
|
+
],
|
|
1368
|
+
allowFontScaling: true
|
|
1223
1369
|
},
|
|
1224
1370
|
option.label
|
|
1225
1371
|
)
|
|
1226
|
-
)
|
|
1372
|
+
);
|
|
1227
1373
|
}
|
|
1228
1374
|
function RadioGroup({
|
|
1229
1375
|
options,
|
|
@@ -1232,7 +1378,7 @@ function RadioGroup({
|
|
|
1232
1378
|
orientation = "vertical",
|
|
1233
1379
|
style
|
|
1234
1380
|
}) {
|
|
1235
|
-
return /* @__PURE__ */
|
|
1381
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles17.container, orientation === "horizontal" && styles17.horizontal, style] }, options.map((option) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1236
1382
|
RadioItem,
|
|
1237
1383
|
{
|
|
1238
1384
|
key: option.value,
|
|
@@ -1242,7 +1388,7 @@ function RadioGroup({
|
|
|
1242
1388
|
}
|
|
1243
1389
|
)));
|
|
1244
1390
|
}
|
|
1245
|
-
var
|
|
1391
|
+
var styles17 = reactNative.StyleSheet.create({
|
|
1246
1392
|
container: {
|
|
1247
1393
|
gap: vs(12)
|
|
1248
1394
|
},
|
|
@@ -1269,11 +1415,12 @@ var styles15 = reactNative.StyleSheet.create({
|
|
|
1269
1415
|
borderRadius: s(5)
|
|
1270
1416
|
},
|
|
1271
1417
|
label: {
|
|
1418
|
+
fontFamily: "Poppins-Regular",
|
|
1272
1419
|
fontSize: ms(14),
|
|
1273
1420
|
lineHeight: mvs(20)
|
|
1274
1421
|
}
|
|
1275
1422
|
});
|
|
1276
|
-
var
|
|
1423
|
+
var nativeDriver8 = reactNative.Platform.OS !== "web";
|
|
1277
1424
|
function TabTrigger({
|
|
1278
1425
|
tab,
|
|
1279
1426
|
isActive,
|
|
@@ -1281,17 +1428,17 @@ function TabTrigger({
|
|
|
1281
1428
|
onLayout
|
|
1282
1429
|
}) {
|
|
1283
1430
|
const { colors } = useTheme();
|
|
1284
|
-
const scale2 =
|
|
1431
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
1285
1432
|
const handlePressIn = () => {
|
|
1286
|
-
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1433
|
+
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver8, speed: 40, bounciness: 0 }).start();
|
|
1287
1434
|
};
|
|
1288
1435
|
const handlePressOut = () => {
|
|
1289
|
-
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1436
|
+
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver8, speed: 40, bounciness: 4 }).start();
|
|
1290
1437
|
};
|
|
1291
|
-
return /* @__PURE__ */
|
|
1438
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
1292
1439
|
reactNative.TouchableOpacity,
|
|
1293
1440
|
{
|
|
1294
|
-
style:
|
|
1441
|
+
style: styles18.trigger,
|
|
1295
1442
|
onPress,
|
|
1296
1443
|
onPressIn: handlePressIn,
|
|
1297
1444
|
onPressOut: handlePressOut,
|
|
@@ -1299,27 +1446,28 @@ function TabTrigger({
|
|
|
1299
1446
|
activeOpacity: 1,
|
|
1300
1447
|
touchSoundDisabled: true
|
|
1301
1448
|
},
|
|
1302
|
-
/* @__PURE__ */
|
|
1449
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: { transform: [{ scale: scale2 }] } }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles18.triggerInner }, tab.icon ? typeof tab.icon === "function" ? tab.icon(isActive) : tab.icon : null, /* @__PURE__ */ React25__default.default.createElement(
|
|
1303
1450
|
reactNative.Text,
|
|
1304
1451
|
{
|
|
1305
1452
|
style: [
|
|
1306
|
-
|
|
1453
|
+
styles18.triggerLabel,
|
|
1307
1454
|
{ color: isActive ? colors.foreground : colors.mutedForeground },
|
|
1308
|
-
isActive &&
|
|
1309
|
-
]
|
|
1455
|
+
isActive && styles18.activeTriggerLabel
|
|
1456
|
+
],
|
|
1457
|
+
allowFontScaling: true
|
|
1310
1458
|
},
|
|
1311
1459
|
tab.label
|
|
1312
1460
|
)))
|
|
1313
1461
|
);
|
|
1314
1462
|
}
|
|
1315
1463
|
function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
1316
|
-
const [internal, setInternal] =
|
|
1464
|
+
const [internal, setInternal] = React25.useState(tabs[0]?.value ?? "");
|
|
1317
1465
|
const { colors } = useTheme();
|
|
1318
1466
|
const active = value ?? internal;
|
|
1319
|
-
const tabLayouts =
|
|
1320
|
-
const pillX =
|
|
1321
|
-
const pillWidth =
|
|
1322
|
-
const initialised =
|
|
1467
|
+
const tabLayouts = React25.useRef({});
|
|
1468
|
+
const pillX = React25.useRef(new reactNative.Animated.Value(0)).current;
|
|
1469
|
+
const pillWidth = React25.useRef(new reactNative.Animated.Value(0)).current;
|
|
1470
|
+
const initialised = React25.useRef(false);
|
|
1323
1471
|
const animatePill = (tabValue, animate) => {
|
|
1324
1472
|
const layout = tabLayouts.current[tabValue];
|
|
1325
1473
|
if (!layout) return;
|
|
@@ -1343,7 +1491,7 @@ function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
|
1343
1491
|
pillWidth.setValue(layout.width);
|
|
1344
1492
|
}
|
|
1345
1493
|
};
|
|
1346
|
-
|
|
1494
|
+
React25.useEffect(() => {
|
|
1347
1495
|
if (initialised.current) {
|
|
1348
1496
|
animatePill(active, true);
|
|
1349
1497
|
}
|
|
@@ -1353,11 +1501,11 @@ function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
|
1353
1501
|
if (!value) setInternal(v);
|
|
1354
1502
|
onValueChange?.(v);
|
|
1355
1503
|
};
|
|
1356
|
-
return /* @__PURE__ */
|
|
1504
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles18.list, { backgroundColor: colors.muted }] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1357
1505
|
reactNative.Animated.View,
|
|
1358
1506
|
{
|
|
1359
1507
|
style: [
|
|
1360
|
-
|
|
1508
|
+
styles18.pill,
|
|
1361
1509
|
{
|
|
1362
1510
|
backgroundColor: colors.background,
|
|
1363
1511
|
position: "absolute",
|
|
@@ -1374,7 +1522,7 @@ function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
|
1374
1522
|
}
|
|
1375
1523
|
]
|
|
1376
1524
|
}
|
|
1377
|
-
), tabs.map((tab) => /* @__PURE__ */
|
|
1525
|
+
), tabs.map((tab) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1378
1526
|
TabTrigger,
|
|
1379
1527
|
{
|
|
1380
1528
|
key: tab.value,
|
|
@@ -1394,9 +1542,9 @@ function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
|
1394
1542
|
}
|
|
1395
1543
|
function TabsContent({ value, activeValue, children, style }) {
|
|
1396
1544
|
if (value !== activeValue) return null;
|
|
1397
|
-
return /* @__PURE__ */
|
|
1545
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style }, children);
|
|
1398
1546
|
}
|
|
1399
|
-
var
|
|
1547
|
+
var styles18 = reactNative.StyleSheet.create({
|
|
1400
1548
|
list: {
|
|
1401
1549
|
flexDirection: "row",
|
|
1402
1550
|
borderRadius: ms(12),
|
|
@@ -1406,9 +1554,9 @@ var styles16 = reactNative.StyleSheet.create({
|
|
|
1406
1554
|
pill: {},
|
|
1407
1555
|
trigger: {
|
|
1408
1556
|
flex: 1,
|
|
1409
|
-
paddingVertical: vs(
|
|
1410
|
-
paddingHorizontal: s(
|
|
1411
|
-
borderRadius: ms(
|
|
1557
|
+
paddingVertical: vs(7),
|
|
1558
|
+
paddingHorizontal: s(10),
|
|
1559
|
+
borderRadius: ms(6),
|
|
1412
1560
|
alignItems: "center",
|
|
1413
1561
|
justifyContent: "center",
|
|
1414
1562
|
zIndex: 1
|
|
@@ -1417,19 +1565,14 @@ var styles16 = reactNative.StyleSheet.create({
|
|
|
1417
1565
|
flexDirection: "row",
|
|
1418
1566
|
alignItems: "center",
|
|
1419
1567
|
justifyContent: "center",
|
|
1420
|
-
gap: s(
|
|
1421
|
-
},
|
|
1422
|
-
triggerIcon: {
|
|
1423
|
-
marginRight: s(6),
|
|
1424
|
-
alignItems: "center",
|
|
1425
|
-
justifyContent: "center"
|
|
1568
|
+
gap: s(4)
|
|
1426
1569
|
},
|
|
1427
1570
|
triggerLabel: {
|
|
1428
|
-
|
|
1429
|
-
|
|
1571
|
+
fontFamily: "Poppins-Regular",
|
|
1572
|
+
fontSize: ms(13)
|
|
1430
1573
|
},
|
|
1431
1574
|
activeTriggerLabel: {
|
|
1432
|
-
|
|
1575
|
+
fontFamily: "Poppins-Medium"
|
|
1433
1576
|
}
|
|
1434
1577
|
});
|
|
1435
1578
|
function AccordionItemComponent({
|
|
@@ -1438,45 +1581,45 @@ function AccordionItemComponent({
|
|
|
1438
1581
|
onToggle
|
|
1439
1582
|
}) {
|
|
1440
1583
|
const { colors } = useTheme();
|
|
1441
|
-
const isExpanded =
|
|
1442
|
-
const height =
|
|
1443
|
-
|
|
1584
|
+
const isExpanded = Animated11.useSharedValue(isOpen);
|
|
1585
|
+
const height = Animated11.useSharedValue(0);
|
|
1586
|
+
React25__default.default.useEffect(() => {
|
|
1444
1587
|
isExpanded.value = isOpen;
|
|
1445
1588
|
}, [isOpen]);
|
|
1446
|
-
const derivedHeight =
|
|
1447
|
-
() =>
|
|
1589
|
+
const derivedHeight = Animated11.useDerivedValue(
|
|
1590
|
+
() => Animated11.withTiming(height.value * Number(isExpanded.value), {
|
|
1448
1591
|
duration: 220,
|
|
1449
|
-
easing: isExpanded.value ?
|
|
1592
|
+
easing: isExpanded.value ? Animated11.Easing.out(Animated11.Easing.ease) : Animated11.Easing.in(Animated11.Easing.ease)
|
|
1450
1593
|
})
|
|
1451
1594
|
);
|
|
1452
|
-
const derivedRotation =
|
|
1453
|
-
() =>
|
|
1595
|
+
const derivedRotation = Animated11.useDerivedValue(
|
|
1596
|
+
() => Animated11.withTiming(isExpanded.value ? 1 : 0, {
|
|
1454
1597
|
duration: 220,
|
|
1455
|
-
easing: isExpanded.value ?
|
|
1598
|
+
easing: isExpanded.value ? Animated11.Easing.out(Animated11.Easing.ease) : Animated11.Easing.in(Animated11.Easing.ease)
|
|
1456
1599
|
})
|
|
1457
1600
|
);
|
|
1458
|
-
const bodyStyle =
|
|
1601
|
+
const bodyStyle = Animated11.useAnimatedStyle(() => ({
|
|
1459
1602
|
height: derivedHeight.value,
|
|
1460
1603
|
overflow: "hidden"
|
|
1461
1604
|
}));
|
|
1462
|
-
const rotationStyle =
|
|
1605
|
+
const rotationStyle = Animated11.useAnimatedStyle(() => ({
|
|
1463
1606
|
transform: [{ rotate: `${derivedRotation.value * 180}deg` }]
|
|
1464
1607
|
}));
|
|
1465
|
-
return /* @__PURE__ */
|
|
1608
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles19.item, { backgroundColor: colors.card, borderColor: colors.border }] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1466
1609
|
reactNative.Pressable,
|
|
1467
1610
|
{
|
|
1468
|
-
style: ({ pressed }) => [
|
|
1611
|
+
style: ({ pressed }) => [styles19.trigger, { opacity: pressed ? 0.6 : 1 }],
|
|
1469
1612
|
onPress: () => {
|
|
1470
1613
|
selectionAsync();
|
|
1471
1614
|
onToggle();
|
|
1472
1615
|
}
|
|
1473
1616
|
},
|
|
1474
|
-
/* @__PURE__ */
|
|
1475
|
-
/* @__PURE__ */
|
|
1476
|
-
), /* @__PURE__ */
|
|
1617
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles19.triggerText, { color: colors.foreground }], allowFontScaling: true }, item.trigger),
|
|
1618
|
+
/* @__PURE__ */ React25__default.default.createElement(Animated11__default.default.View, { style: [styles19.chevron, rotationStyle] }, /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-down", size: 18, color: colors.mutedForeground }))
|
|
1619
|
+
), /* @__PURE__ */ React25__default.default.createElement(Animated11__default.default.View, { style: bodyStyle }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1477
1620
|
reactNative.View,
|
|
1478
1621
|
{
|
|
1479
|
-
style:
|
|
1622
|
+
style: styles19.content,
|
|
1480
1623
|
onLayout: (e) => {
|
|
1481
1624
|
height.value = e.nativeEvent.layout.height;
|
|
1482
1625
|
}
|
|
@@ -1485,7 +1628,7 @@ function AccordionItemComponent({
|
|
|
1485
1628
|
)));
|
|
1486
1629
|
}
|
|
1487
1630
|
function Accordion({ items, type = "single", defaultValue, style }) {
|
|
1488
|
-
const [openValues, setOpenValues] =
|
|
1631
|
+
const [openValues, setOpenValues] = React25.useState(() => {
|
|
1489
1632
|
if (!defaultValue) return [];
|
|
1490
1633
|
return Array.isArray(defaultValue) ? defaultValue : [defaultValue];
|
|
1491
1634
|
});
|
|
@@ -1498,7 +1641,7 @@ function Accordion({ items, type = "single", defaultValue, style }) {
|
|
|
1498
1641
|
);
|
|
1499
1642
|
}
|
|
1500
1643
|
};
|
|
1501
|
-
return /* @__PURE__ */
|
|
1644
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles19.list, style] }, items.map((item) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1502
1645
|
AccordionItemComponent,
|
|
1503
1646
|
{
|
|
1504
1647
|
key: item.value,
|
|
@@ -1508,19 +1651,25 @@ function Accordion({ items, type = "single", defaultValue, style }) {
|
|
|
1508
1651
|
}
|
|
1509
1652
|
)));
|
|
1510
1653
|
}
|
|
1511
|
-
var
|
|
1654
|
+
var styles19 = reactNative.StyleSheet.create({
|
|
1655
|
+
list: {
|
|
1656
|
+
gap: s(6)
|
|
1657
|
+
},
|
|
1512
1658
|
item: {
|
|
1513
|
-
|
|
1659
|
+
borderWidth: 1,
|
|
1660
|
+
borderRadius: ms(10),
|
|
1661
|
+
overflow: "hidden"
|
|
1514
1662
|
},
|
|
1515
1663
|
trigger: {
|
|
1516
1664
|
flexDirection: "row",
|
|
1517
1665
|
justifyContent: "space-between",
|
|
1518
1666
|
alignItems: "center",
|
|
1519
|
-
|
|
1667
|
+
paddingHorizontal: s(14),
|
|
1668
|
+
paddingVertical: vs(12)
|
|
1520
1669
|
},
|
|
1521
1670
|
triggerText: {
|
|
1522
|
-
|
|
1523
|
-
|
|
1671
|
+
fontFamily: "Poppins-Medium",
|
|
1672
|
+
fontSize: ms(14),
|
|
1524
1673
|
flex: 1
|
|
1525
1674
|
},
|
|
1526
1675
|
chevron: {
|
|
@@ -1529,7 +1678,8 @@ var styles17 = reactNative.StyleSheet.create({
|
|
|
1529
1678
|
// position:'absolute' is the key — the inner View escapes the animated wrapper's
|
|
1530
1679
|
// clipped height so onLayout always reports the true content height.
|
|
1531
1680
|
content: {
|
|
1532
|
-
|
|
1681
|
+
paddingHorizontal: s(14),
|
|
1682
|
+
paddingBottom: vs(12),
|
|
1533
1683
|
position: "absolute",
|
|
1534
1684
|
width: "100%"
|
|
1535
1685
|
}
|
|
@@ -1549,7 +1699,7 @@ function Slider({
|
|
|
1549
1699
|
style
|
|
1550
1700
|
}) {
|
|
1551
1701
|
const { colors } = useTheme();
|
|
1552
|
-
const lastSteppedValue =
|
|
1702
|
+
const lastSteppedValue = React25.useRef(value);
|
|
1553
1703
|
const handleValueChange = (v) => {
|
|
1554
1704
|
if (step && v !== lastSteppedValue.current) {
|
|
1555
1705
|
lastSteppedValue.current = v;
|
|
@@ -1557,7 +1707,7 @@ function Slider({
|
|
|
1557
1707
|
}
|
|
1558
1708
|
onValueChange?.(v);
|
|
1559
1709
|
};
|
|
1560
|
-
return /* @__PURE__ */
|
|
1710
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles20.wrapper, style], accessibilityLabel }, label || showValue ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles20.header }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles20.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, showValue ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles20.valueText, { color: colors.mutedForeground }], allowFontScaling: true }, formatValue2(value)) : null) : null, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: disabled ? styles20.disabled : void 0 }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1561
1711
|
RNSlider__default.default,
|
|
1562
1712
|
{
|
|
1563
1713
|
value,
|
|
@@ -1570,12 +1720,12 @@ function Slider({
|
|
|
1570
1720
|
minimumTrackTintColor: colors.primary,
|
|
1571
1721
|
maximumTrackTintColor: colors.muted,
|
|
1572
1722
|
thumbTintColor: colors.primary,
|
|
1573
|
-
style:
|
|
1723
|
+
style: styles20.slider,
|
|
1574
1724
|
accessibilityLabel
|
|
1575
1725
|
}
|
|
1576
1726
|
)));
|
|
1577
1727
|
}
|
|
1578
|
-
var
|
|
1728
|
+
var styles20 = reactNative.StyleSheet.create({
|
|
1579
1729
|
wrapper: {
|
|
1580
1730
|
gap: vs(8)
|
|
1581
1731
|
},
|
|
@@ -1585,16 +1735,16 @@ var styles18 = reactNative.StyleSheet.create({
|
|
|
1585
1735
|
alignItems: "center"
|
|
1586
1736
|
},
|
|
1587
1737
|
label: {
|
|
1588
|
-
|
|
1589
|
-
|
|
1738
|
+
fontFamily: "Poppins-Medium",
|
|
1739
|
+
fontSize: ms(15)
|
|
1590
1740
|
},
|
|
1591
1741
|
valueText: {
|
|
1592
|
-
|
|
1593
|
-
|
|
1742
|
+
fontFamily: "Poppins-Medium",
|
|
1743
|
+
fontSize: ms(14)
|
|
1594
1744
|
},
|
|
1595
1745
|
slider: {
|
|
1596
1746
|
width: "100%",
|
|
1597
|
-
height: vs(
|
|
1747
|
+
height: vs(60)
|
|
1598
1748
|
},
|
|
1599
1749
|
disabled: {
|
|
1600
1750
|
opacity: 0.45
|
|
@@ -1610,8 +1760,8 @@ function Sheet({
|
|
|
1610
1760
|
style
|
|
1611
1761
|
}) {
|
|
1612
1762
|
const { colors } = useTheme();
|
|
1613
|
-
const ref =
|
|
1614
|
-
|
|
1763
|
+
const ref = React25.useRef(null);
|
|
1764
|
+
React25.useEffect(() => {
|
|
1615
1765
|
if (open) {
|
|
1616
1766
|
impactLight();
|
|
1617
1767
|
ref.current?.present();
|
|
@@ -1619,7 +1769,7 @@ function Sheet({
|
|
|
1619
1769
|
ref.current?.dismiss();
|
|
1620
1770
|
}
|
|
1621
1771
|
}, [open]);
|
|
1622
|
-
const renderBackdrop = (props) => /* @__PURE__ */
|
|
1772
|
+
const renderBackdrop = (props) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1623
1773
|
bottomSheet.BottomSheetBackdrop,
|
|
1624
1774
|
{
|
|
1625
1775
|
...props,
|
|
@@ -1628,21 +1778,21 @@ function Sheet({
|
|
|
1628
1778
|
pressBehavior: "close"
|
|
1629
1779
|
}
|
|
1630
1780
|
);
|
|
1631
|
-
return /* @__PURE__ */
|
|
1781
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
1632
1782
|
bottomSheet.BottomSheetModal,
|
|
1633
1783
|
{
|
|
1634
1784
|
ref,
|
|
1635
1785
|
snapPoints,
|
|
1636
1786
|
onDismiss: onClose,
|
|
1637
1787
|
backdropComponent: renderBackdrop,
|
|
1638
|
-
backgroundStyle: [
|
|
1639
|
-
handleIndicatorStyle: [
|
|
1788
|
+
backgroundStyle: [styles21.background, { backgroundColor: colors.card }],
|
|
1789
|
+
handleIndicatorStyle: [styles21.handle, { backgroundColor: colors.border }],
|
|
1640
1790
|
enablePanDownToClose: true
|
|
1641
1791
|
},
|
|
1642
|
-
/* @__PURE__ */
|
|
1792
|
+
/* @__PURE__ */ React25__default.default.createElement(bottomSheet.BottomSheetView, { style: [styles21.content, style] }, title || description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles21.header }, title ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles21.title, { color: colors.cardForeground }], allowFontScaling: true }, title) : null, description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles21.description, { color: colors.mutedForeground }], allowFontScaling: true }, description) : null) : null, children)
|
|
1643
1793
|
);
|
|
1644
1794
|
}
|
|
1645
|
-
var
|
|
1795
|
+
var styles21 = reactNative.StyleSheet.create({
|
|
1646
1796
|
background: {
|
|
1647
1797
|
borderTopLeftRadius: ms(16),
|
|
1648
1798
|
borderTopRightRadius: ms(16)
|
|
@@ -1661,10 +1811,11 @@ var styles19 = reactNative.StyleSheet.create({
|
|
|
1661
1811
|
marginBottom: vs(16)
|
|
1662
1812
|
},
|
|
1663
1813
|
title: {
|
|
1664
|
-
|
|
1665
|
-
|
|
1814
|
+
fontFamily: "Poppins-SemiBold",
|
|
1815
|
+
fontSize: ms(18)
|
|
1666
1816
|
},
|
|
1667
1817
|
description: {
|
|
1818
|
+
fontFamily: "Poppins-Regular",
|
|
1668
1819
|
fontSize: ms(14),
|
|
1669
1820
|
lineHeight: mvs(20)
|
|
1670
1821
|
}
|
|
@@ -1672,6 +1823,7 @@ var styles19 = reactNative.StyleSheet.create({
|
|
|
1672
1823
|
var isIOS = reactNative.Platform.OS === "ios";
|
|
1673
1824
|
var isAndroid = reactNative.Platform.OS === "android";
|
|
1674
1825
|
var isWeb2 = reactNative.Platform.OS === "web";
|
|
1826
|
+
var nativeDriver9 = reactNative.Platform.OS !== "web";
|
|
1675
1827
|
function Select({
|
|
1676
1828
|
options,
|
|
1677
1829
|
value,
|
|
@@ -1683,17 +1835,17 @@ function Select({
|
|
|
1683
1835
|
style
|
|
1684
1836
|
}) {
|
|
1685
1837
|
const { colors } = useTheme();
|
|
1686
|
-
const scale2 =
|
|
1687
|
-
const [pickerVisible, setPickerVisible] =
|
|
1688
|
-
const [pendingValue, setPendingValue] =
|
|
1689
|
-
const pickerRef =
|
|
1838
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
1839
|
+
const [pickerVisible, setPickerVisible] = React25.useState(false);
|
|
1840
|
+
const [pendingValue, setPendingValue] = React25.useState(value);
|
|
1841
|
+
const pickerRef = React25.useRef(null);
|
|
1690
1842
|
const selected = options.find((o) => o.value === value);
|
|
1691
1843
|
const handlePressIn = () => {
|
|
1692
1844
|
if (disabled) return;
|
|
1693
|
-
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1845
|
+
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver9, speed: 40, bounciness: 0 }).start();
|
|
1694
1846
|
};
|
|
1695
1847
|
const handlePressOut = () => {
|
|
1696
|
-
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1848
|
+
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver9, speed: 40, bounciness: 4 }).start();
|
|
1697
1849
|
};
|
|
1698
1850
|
const handleOpen = () => {
|
|
1699
1851
|
if (disabled) return;
|
|
@@ -1715,11 +1867,11 @@ function Select({
|
|
|
1715
1867
|
}
|
|
1716
1868
|
setPickerVisible(false);
|
|
1717
1869
|
};
|
|
1718
|
-
return /* @__PURE__ */
|
|
1870
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles22.container, style] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles22.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, !isWeb2 ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: { transform: [{ scale: scale2 }], opacity: disabled ? 0.45 : 1 } }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1719
1871
|
reactNative.TouchableOpacity,
|
|
1720
1872
|
{
|
|
1721
1873
|
style: [
|
|
1722
|
-
|
|
1874
|
+
styles22.trigger,
|
|
1723
1875
|
{
|
|
1724
1876
|
borderColor: error ? colors.destructive : colors.border,
|
|
1725
1877
|
backgroundColor: colors.background
|
|
@@ -1731,11 +1883,11 @@ function Select({
|
|
|
1731
1883
|
activeOpacity: 1,
|
|
1732
1884
|
touchSoundDisabled: true
|
|
1733
1885
|
},
|
|
1734
|
-
/* @__PURE__ */
|
|
1886
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
1735
1887
|
reactNative.Text,
|
|
1736
1888
|
{
|
|
1737
1889
|
style: [
|
|
1738
|
-
|
|
1890
|
+
styles22.triggerText,
|
|
1739
1891
|
{ color: selected ? colors.foreground : colors.mutedForeground }
|
|
1740
1892
|
],
|
|
1741
1893
|
numberOfLines: 1,
|
|
@@ -1743,8 +1895,8 @@ function Select({
|
|
|
1743
1895
|
},
|
|
1744
1896
|
selected?.label ?? placeholder
|
|
1745
1897
|
),
|
|
1746
|
-
/* @__PURE__ */
|
|
1747
|
-
)) : null, isIOS ? /* @__PURE__ */
|
|
1898
|
+
/* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-with-circle-down", size: 20, color: colors.mutedForeground })
|
|
1899
|
+
)) : null, isIOS ? /* @__PURE__ */ React25__default.default.createElement(
|
|
1748
1900
|
reactNative.Modal,
|
|
1749
1901
|
{
|
|
1750
1902
|
visible: pickerVisible,
|
|
@@ -1752,16 +1904,16 @@ function Select({
|
|
|
1752
1904
|
animationType: "slide",
|
|
1753
1905
|
onRequestClose: handleDismiss
|
|
1754
1906
|
},
|
|
1755
|
-
/* @__PURE__ */
|
|
1756
|
-
/* @__PURE__ */
|
|
1907
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.TouchableOpacity, { style: styles22.iosBackdrop, activeOpacity: 1, onPress: handleDismiss }),
|
|
1908
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles22.iosSheet, { backgroundColor: colors.card }] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles22.iosToolbar, { borderBottomColor: colors.border }] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles22.iosToolbarTitle, { color: colors.foreground }], allowFontScaling: true }, label) : /* @__PURE__ */ React25__default.default.createElement(reactNative.View, null), /* @__PURE__ */ React25__default.default.createElement(reactNative.TouchableOpacity, { onPress: handleConfirm, style: styles22.iosDoneBtn, hitSlop: { top: 8, bottom: 8, left: 8, right: 8 } }, /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles22.iosDoneBtnText, { color: colors.primary }], allowFontScaling: true }, "Done"))), /* @__PURE__ */ React25__default.default.createElement(
|
|
1757
1909
|
picker.Picker,
|
|
1758
1910
|
{
|
|
1759
1911
|
selectedValue: pendingValue ?? "",
|
|
1760
1912
|
onValueChange: (val) => setPendingValue(val),
|
|
1761
1913
|
itemStyle: { color: colors.foreground }
|
|
1762
1914
|
},
|
|
1763
|
-
!value ? /* @__PURE__ */
|
|
1764
|
-
options.map((o) => /* @__PURE__ */
|
|
1915
|
+
!value ? /* @__PURE__ */ React25__default.default.createElement(picker.Picker.Item, { label: placeholder, value: "", color: colors.mutedForeground, enabled: false }) : null,
|
|
1916
|
+
options.map((o) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1765
1917
|
picker.Picker.Item,
|
|
1766
1918
|
{
|
|
1767
1919
|
key: o.value,
|
|
@@ -1772,7 +1924,7 @@ function Select({
|
|
|
1772
1924
|
}
|
|
1773
1925
|
))
|
|
1774
1926
|
))
|
|
1775
|
-
) : null, isAndroid ? /* @__PURE__ */
|
|
1927
|
+
) : null, isAndroid ? /* @__PURE__ */ React25__default.default.createElement(
|
|
1776
1928
|
picker.Picker,
|
|
1777
1929
|
{
|
|
1778
1930
|
ref: pickerRef,
|
|
@@ -1786,10 +1938,10 @@ function Select({
|
|
|
1786
1938
|
mode: "dialog",
|
|
1787
1939
|
enabled: !disabled,
|
|
1788
1940
|
prompt: label,
|
|
1789
|
-
style:
|
|
1941
|
+
style: styles22.androidHiddenPicker
|
|
1790
1942
|
},
|
|
1791
|
-
!value ? /* @__PURE__ */
|
|
1792
|
-
options.map((o) => /* @__PURE__ */
|
|
1943
|
+
!value ? /* @__PURE__ */ React25__default.default.createElement(picker.Picker.Item, { label: placeholder, value: "", enabled: false }) : null,
|
|
1944
|
+
options.map((o) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1793
1945
|
picker.Picker.Item,
|
|
1794
1946
|
{
|
|
1795
1947
|
key: o.value,
|
|
@@ -1798,7 +1950,7 @@ function Select({
|
|
|
1798
1950
|
enabled: !o.disabled
|
|
1799
1951
|
}
|
|
1800
1952
|
))
|
|
1801
|
-
) : null, isWeb2 ? /* @__PURE__ */
|
|
1953
|
+
) : null, isWeb2 ? /* @__PURE__ */ React25__default.default.createElement(
|
|
1802
1954
|
picker.Picker,
|
|
1803
1955
|
{
|
|
1804
1956
|
selectedValue: value ?? "",
|
|
@@ -1809,7 +1961,7 @@ function Select({
|
|
|
1809
1961
|
},
|
|
1810
1962
|
enabled: !disabled,
|
|
1811
1963
|
style: [
|
|
1812
|
-
|
|
1964
|
+
styles22.webPicker,
|
|
1813
1965
|
{
|
|
1814
1966
|
borderColor: error ? colors.destructive : colors.border,
|
|
1815
1967
|
color: selected ? colors.foreground : colors.mutedForeground,
|
|
@@ -1818,8 +1970,8 @@ function Select({
|
|
|
1818
1970
|
}
|
|
1819
1971
|
]
|
|
1820
1972
|
},
|
|
1821
|
-
/* @__PURE__ */
|
|
1822
|
-
options.map((o) => /* @__PURE__ */
|
|
1973
|
+
/* @__PURE__ */ React25__default.default.createElement(picker.Picker.Item, { label: placeholder, value: "", enabled: false }),
|
|
1974
|
+
options.map((o) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1823
1975
|
picker.Picker.Item,
|
|
1824
1976
|
{
|
|
1825
1977
|
key: o.value,
|
|
@@ -1828,38 +1980,35 @@ function Select({
|
|
|
1828
1980
|
enabled: !o.disabled
|
|
1829
1981
|
}
|
|
1830
1982
|
))
|
|
1831
|
-
) : null, error ? /* @__PURE__ */
|
|
1983
|
+
) : null, error ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles22.helperText, { color: colors.destructive }], allowFontScaling: true }, error) : null);
|
|
1832
1984
|
}
|
|
1833
|
-
var
|
|
1985
|
+
var styles22 = reactNative.StyleSheet.create({
|
|
1834
1986
|
container: {
|
|
1835
1987
|
gap: vs(8)
|
|
1836
1988
|
},
|
|
1837
1989
|
label: {
|
|
1838
|
-
|
|
1839
|
-
|
|
1990
|
+
fontFamily: "Poppins-Medium",
|
|
1991
|
+
fontSize: ms(13)
|
|
1840
1992
|
},
|
|
1841
1993
|
trigger: {
|
|
1842
1994
|
flexDirection: "row",
|
|
1843
1995
|
alignItems: "center",
|
|
1844
1996
|
justifyContent: "space-between",
|
|
1845
|
-
borderWidth: 1
|
|
1997
|
+
borderWidth: 1,
|
|
1846
1998
|
borderRadius: ms(8),
|
|
1847
|
-
paddingHorizontal: s(
|
|
1848
|
-
paddingVertical: vs(
|
|
1849
|
-
shadowColor: "#000",
|
|
1850
|
-
shadowOffset: { width: 0, height: 1 },
|
|
1851
|
-
shadowOpacity: 0.04,
|
|
1852
|
-
shadowRadius: 2,
|
|
1853
|
-
elevation: 1
|
|
1999
|
+
paddingHorizontal: s(14),
|
|
2000
|
+
paddingVertical: vs(11)
|
|
1854
2001
|
},
|
|
1855
2002
|
triggerText: {
|
|
1856
|
-
|
|
2003
|
+
fontFamily: "Poppins-Regular",
|
|
2004
|
+
fontSize: ms(15),
|
|
1857
2005
|
flex: 1
|
|
1858
2006
|
},
|
|
1859
2007
|
chevron: {
|
|
1860
2008
|
marginLeft: s(8)
|
|
1861
2009
|
},
|
|
1862
2010
|
helperText: {
|
|
2011
|
+
fontFamily: "Poppins-Regular",
|
|
1863
2012
|
fontSize: ms(13)
|
|
1864
2013
|
},
|
|
1865
2014
|
iosBackdrop: {
|
|
@@ -1880,15 +2029,15 @@ var styles20 = reactNative.StyleSheet.create({
|
|
|
1880
2029
|
borderBottomWidth: 1
|
|
1881
2030
|
},
|
|
1882
2031
|
iosToolbarTitle: {
|
|
1883
|
-
|
|
1884
|
-
|
|
2032
|
+
fontFamily: "Poppins-SemiBold",
|
|
2033
|
+
fontSize: ms(17)
|
|
1885
2034
|
},
|
|
1886
2035
|
iosDoneBtn: {
|
|
1887
2036
|
padding: s(4)
|
|
1888
2037
|
},
|
|
1889
2038
|
iosDoneBtnText: {
|
|
1890
|
-
|
|
1891
|
-
|
|
2039
|
+
fontFamily: "Poppins-SemiBold",
|
|
2040
|
+
fontSize: ms(17)
|
|
1892
2041
|
},
|
|
1893
2042
|
androidHiddenPicker: {
|
|
1894
2043
|
height: 0,
|
|
@@ -1896,35 +2045,35 @@ var styles20 = reactNative.StyleSheet.create({
|
|
|
1896
2045
|
position: "absolute"
|
|
1897
2046
|
},
|
|
1898
2047
|
webPicker: {
|
|
1899
|
-
borderWidth: 1
|
|
2048
|
+
borderWidth: 1,
|
|
1900
2049
|
borderRadius: ms(8),
|
|
1901
|
-
paddingHorizontal: s(
|
|
1902
|
-
paddingVertical: vs(
|
|
1903
|
-
fontSize: ms(
|
|
2050
|
+
paddingHorizontal: s(14),
|
|
2051
|
+
paddingVertical: vs(11),
|
|
2052
|
+
fontSize: ms(15)
|
|
1904
2053
|
}
|
|
1905
2054
|
});
|
|
1906
|
-
var ToastContext =
|
|
2055
|
+
var ToastContext = React25.createContext({
|
|
1907
2056
|
toast: () => {
|
|
1908
2057
|
},
|
|
1909
2058
|
dismiss: () => {
|
|
1910
2059
|
}
|
|
1911
2060
|
});
|
|
1912
2061
|
function useToast() {
|
|
1913
|
-
return
|
|
2062
|
+
return React25.useContext(ToastContext);
|
|
1914
2063
|
}
|
|
1915
2064
|
var SWIPE_THRESHOLD = 80;
|
|
1916
2065
|
var VELOCITY_THRESHOLD = 800;
|
|
1917
2066
|
function ToastNotification({ item, onDismiss }) {
|
|
1918
2067
|
const { colors } = useTheme();
|
|
1919
|
-
const translateY =
|
|
1920
|
-
const translateX =
|
|
1921
|
-
const opacity =
|
|
1922
|
-
|
|
1923
|
-
translateY.value =
|
|
1924
|
-
opacity.value =
|
|
2068
|
+
const translateY = Animated11.useSharedValue(-80);
|
|
2069
|
+
const translateX = Animated11.useSharedValue(0);
|
|
2070
|
+
const opacity = Animated11.useSharedValue(0);
|
|
2071
|
+
React25.useEffect(() => {
|
|
2072
|
+
translateY.value = Animated11.withTiming(0, { duration: 120, easing: Animated11.Easing.out(Animated11.Easing.exp) });
|
|
2073
|
+
opacity.value = Animated11.withTiming(1, { duration: 100 });
|
|
1925
2074
|
const timer = setTimeout(() => {
|
|
1926
|
-
translateY.value =
|
|
1927
|
-
opacity.value =
|
|
2075
|
+
translateY.value = Animated11.withTiming(-80, { duration: 200 });
|
|
2076
|
+
opacity.value = Animated11.withTiming(0, { duration: 200 }, (done) => {
|
|
1928
2077
|
if (done) reactNativeWorklets.scheduleOnRN(onDismiss);
|
|
1929
2078
|
});
|
|
1930
2079
|
}, item.duration ?? 3e3);
|
|
@@ -1936,36 +2085,38 @@ function ToastNotification({ item, onDismiss }) {
|
|
|
1936
2085
|
const shouldDismiss = Math.abs(translateX.value) > SWIPE_THRESHOLD || Math.abs(e.velocityX) > VELOCITY_THRESHOLD;
|
|
1937
2086
|
if (shouldDismiss) {
|
|
1938
2087
|
const direction = translateX.value > 0 ? 1 : -1;
|
|
1939
|
-
translateX.value =
|
|
2088
|
+
translateX.value = Animated11.withTiming(direction * 500, { duration: 200 }, (done) => {
|
|
1940
2089
|
if (done) reactNativeWorklets.scheduleOnRN(onDismiss);
|
|
1941
2090
|
});
|
|
1942
|
-
opacity.value =
|
|
2091
|
+
opacity.value = Animated11.withTiming(0, { duration: 150 });
|
|
1943
2092
|
} else {
|
|
1944
|
-
translateX.value =
|
|
2093
|
+
translateX.value = Animated11.withSpring(0, { damping: 20, stiffness: 300 });
|
|
1945
2094
|
}
|
|
1946
2095
|
});
|
|
1947
|
-
const animatedStyle =
|
|
2096
|
+
const animatedStyle = Animated11.useAnimatedStyle(() => ({
|
|
1948
2097
|
opacity: opacity.value,
|
|
1949
2098
|
transform: [{ translateY: translateY.value }, { translateX: translateX.value }]
|
|
1950
2099
|
}));
|
|
2100
|
+
const variant = item.variant ?? "default";
|
|
1951
2101
|
const bgColor = {
|
|
1952
2102
|
default: colors.foreground,
|
|
1953
|
-
destructive: colors.
|
|
1954
|
-
success: colors.
|
|
1955
|
-
}[
|
|
2103
|
+
destructive: colors.destructiveBorder,
|
|
2104
|
+
success: colors.successBorder
|
|
2105
|
+
}[variant];
|
|
1956
2106
|
const textColor = {
|
|
1957
2107
|
default: colors.background,
|
|
1958
|
-
destructive:
|
|
1959
|
-
success:
|
|
1960
|
-
}[
|
|
1961
|
-
const
|
|
2108
|
+
destructive: "#991b1b",
|
|
2109
|
+
success: "#166534"
|
|
2110
|
+
}[variant];
|
|
2111
|
+
const borderColor = textColor;
|
|
2112
|
+
const defaultIcon = variant === "success" ? /* @__PURE__ */ React25__default.default.createElement(vectorIcons.FontAwesome5, { name: "check-circle", size: 18, color: textColor }) : variant === "destructive" ? /* @__PURE__ */ React25__default.default.createElement(vectorIcons.AntDesign, { name: "exclamation-circle", size: 18, color: textColor }) : /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "info-with-circle", size: 18, color: textColor });
|
|
1962
2113
|
const leftIcon = item.iconName ? renderIcon(item.iconName, 22, item.iconColor ?? textColor) : item.icon ?? defaultIcon;
|
|
1963
|
-
return /* @__PURE__ */
|
|
2114
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNativeGestureHandler.GestureDetector, { gesture: panGesture }, /* @__PURE__ */ React25__default.default.createElement(Animated11__default.default.View, { style: [styles23.toast, { backgroundColor: bgColor, borderColor }, animatedStyle] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles23.leftIconContainer }, leftIcon), /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles23.toastContent }, item.title ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles23.toastTitle, { color: textColor }], allowFontScaling: true }, item.title) : null, item.description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles23.toastDescription, { color: textColor, opacity: 0.85 }], allowFontScaling: true }, item.description) : null), /* @__PURE__ */ React25__default.default.createElement(reactNative.TouchableOpacity, { onPress: onDismiss, style: styles23.dismissButton, touchSoundDisabled: true }, /* @__PURE__ */ React25__default.default.createElement(vectorIcons.AntDesign, { name: "close-circle", size: 18, color: textColor }))));
|
|
1964
2115
|
}
|
|
1965
2116
|
function ToastProvider({ children }) {
|
|
1966
|
-
const [toasts, setToasts] =
|
|
2117
|
+
const [toasts, setToasts] = React25.useState([]);
|
|
1967
2118
|
const insets = reactNativeSafeAreaContext.useSafeAreaInsets();
|
|
1968
|
-
const toast =
|
|
2119
|
+
const toast = React25.useCallback((item) => {
|
|
1969
2120
|
const id = Math.random().toString(36).slice(2);
|
|
1970
2121
|
if (item.variant === "success") {
|
|
1971
2122
|
notificationSuccess();
|
|
@@ -1976,12 +2127,12 @@ function ToastProvider({ children }) {
|
|
|
1976
2127
|
}
|
|
1977
2128
|
setToasts((prev) => [{ ...item, id }, ...prev].slice(0, 3));
|
|
1978
2129
|
}, []);
|
|
1979
|
-
const dismiss =
|
|
2130
|
+
const dismiss = React25.useCallback((id) => {
|
|
1980
2131
|
setToasts((prev) => prev.filter((t) => t.id !== id));
|
|
1981
2132
|
}, []);
|
|
1982
|
-
return /* @__PURE__ */
|
|
2133
|
+
return /* @__PURE__ */ React25__default.default.createElement(ToastContext.Provider, { value: { toast, dismiss } }, children, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles23.container, reactNative.Platform.OS === "web" && styles23.containerWeb, { top: insets.top + 8 }], pointerEvents: "box-none" }, toasts.map((item) => /* @__PURE__ */ React25__default.default.createElement(ToastNotification, { key: item.id, item, onDismiss: () => dismiss(item.id) }))));
|
|
1983
2134
|
}
|
|
1984
|
-
var
|
|
2135
|
+
var styles23 = reactNative.StyleSheet.create({
|
|
1985
2136
|
container: {
|
|
1986
2137
|
position: "absolute",
|
|
1987
2138
|
left: s(16),
|
|
@@ -1998,30 +2149,32 @@ var styles21 = reactNative.StyleSheet.create({
|
|
|
1998
2149
|
toast: {
|
|
1999
2150
|
flexDirection: "row",
|
|
2000
2151
|
alignItems: "center",
|
|
2001
|
-
borderRadius: ms(
|
|
2002
|
-
|
|
2003
|
-
|
|
2152
|
+
borderRadius: ms(12),
|
|
2153
|
+
borderWidth: 1,
|
|
2154
|
+
paddingHorizontal: s(14),
|
|
2155
|
+
paddingVertical: vs(12),
|
|
2004
2156
|
shadowColor: "#000",
|
|
2005
|
-
shadowOffset: { width: 0, height:
|
|
2006
|
-
shadowOpacity: 0.
|
|
2157
|
+
shadowOffset: { width: 0, height: 3 },
|
|
2158
|
+
shadowOpacity: 0.1,
|
|
2007
2159
|
shadowRadius: 8,
|
|
2008
|
-
elevation:
|
|
2160
|
+
elevation: 5
|
|
2009
2161
|
},
|
|
2010
2162
|
toastContent: {
|
|
2011
2163
|
flex: 1,
|
|
2012
2164
|
gap: vs(4)
|
|
2013
2165
|
},
|
|
2014
2166
|
leftIconContainer: {
|
|
2015
|
-
width: s(
|
|
2167
|
+
width: s(28),
|
|
2016
2168
|
alignItems: "center",
|
|
2017
2169
|
justifyContent: "center",
|
|
2018
|
-
marginRight: s(
|
|
2170
|
+
marginRight: s(10)
|
|
2019
2171
|
},
|
|
2020
2172
|
toastTitle: {
|
|
2021
|
-
|
|
2022
|
-
|
|
2173
|
+
fontFamily: "Poppins-SemiBold",
|
|
2174
|
+
fontSize: ms(15)
|
|
2023
2175
|
},
|
|
2024
2176
|
toastDescription: {
|
|
2177
|
+
fontFamily: "Poppins-Regular",
|
|
2025
2178
|
fontSize: ms(14)
|
|
2026
2179
|
},
|
|
2027
2180
|
dismissButton: {
|
|
@@ -2046,30 +2199,33 @@ function CurrencyInput({
|
|
|
2046
2199
|
hint,
|
|
2047
2200
|
placeholder,
|
|
2048
2201
|
editable,
|
|
2202
|
+
prefixIcon,
|
|
2049
2203
|
containerStyle,
|
|
2050
2204
|
style
|
|
2051
2205
|
}) {
|
|
2052
2206
|
const handleChange = (text) => {
|
|
2053
2207
|
const withoutPrefix = prefix && text.startsWith(prefix) ? text.slice(prefix.length) : text;
|
|
2054
2208
|
const formatted = formatCurrency(withoutPrefix, thousandsSeparator);
|
|
2055
|
-
const display = formatted
|
|
2209
|
+
const display = formatted;
|
|
2056
2210
|
onChangeText?.(display);
|
|
2057
2211
|
const separatorRegex = new RegExp(`\\${thousandsSeparator}`, "g");
|
|
2058
2212
|
const raw = parseFloat(formatted.replace(separatorRegex, "") || "0");
|
|
2059
2213
|
onChangeValue?.(isNaN(raw) ? 0 : raw);
|
|
2060
2214
|
};
|
|
2061
|
-
const inputStyle = size === "large" ? { fontSize: ms(36) } : {};
|
|
2062
|
-
|
|
2215
|
+
const inputStyle = size === "large" ? { fontFamily: "Poppins-Regular", fontSize: ms(36) } : { fontFamily: "Poppins-Regular" };
|
|
2216
|
+
const displayValue = value && prefix && value.startsWith(prefix) ? value.slice(prefix.length) : value;
|
|
2217
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
2063
2218
|
Input,
|
|
2064
2219
|
{
|
|
2065
|
-
value,
|
|
2220
|
+
value: displayValue,
|
|
2066
2221
|
onChangeText: handleChange,
|
|
2067
2222
|
keyboardType: "numeric",
|
|
2068
2223
|
label,
|
|
2069
2224
|
error,
|
|
2070
2225
|
hint,
|
|
2071
|
-
placeholder: placeholder ??
|
|
2226
|
+
placeholder: placeholder ?? "0",
|
|
2072
2227
|
editable,
|
|
2228
|
+
prefix: prefixIcon,
|
|
2073
2229
|
containerStyle,
|
|
2074
2230
|
style: [inputStyle, style]
|
|
2075
2231
|
}
|
|
@@ -2090,16 +2246,16 @@ function formatValue(value, prefix, showDecimals) {
|
|
|
2090
2246
|
function CurrencyDisplay({ value, prefix = "$", showDecimals = false, textColor, style }) {
|
|
2091
2247
|
const { colors } = useTheme();
|
|
2092
2248
|
const formatted = formatValue(value, prefix, showDecimals);
|
|
2093
|
-
return /* @__PURE__ */
|
|
2249
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles24.container, style] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles24.amount, { color: textColor ?? colors.foreground }], allowFontScaling: true }, formatted));
|
|
2094
2250
|
}
|
|
2095
|
-
var
|
|
2251
|
+
var styles24 = reactNative.StyleSheet.create({
|
|
2096
2252
|
container: {},
|
|
2097
2253
|
amount: {
|
|
2098
|
-
|
|
2099
|
-
|
|
2254
|
+
fontFamily: "Poppins-Bold",
|
|
2255
|
+
fontSize: ms(56)
|
|
2100
2256
|
}
|
|
2101
2257
|
});
|
|
2102
|
-
var
|
|
2258
|
+
var nativeDriver10 = reactNative.Platform.OS !== "web";
|
|
2103
2259
|
function ListItem({
|
|
2104
2260
|
leftRender,
|
|
2105
2261
|
rightRender,
|
|
@@ -2123,12 +2279,12 @@ function ListItem({
|
|
|
2123
2279
|
captionStyle
|
|
2124
2280
|
}) {
|
|
2125
2281
|
const { colors } = useTheme();
|
|
2126
|
-
const scale2 =
|
|
2282
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
2127
2283
|
const handlePressIn = () => {
|
|
2128
2284
|
if (!onPress || disabled) return;
|
|
2129
2285
|
reactNative.Animated.spring(scale2, {
|
|
2130
2286
|
toValue: 0.97,
|
|
2131
|
-
useNativeDriver:
|
|
2287
|
+
useNativeDriver: nativeDriver10,
|
|
2132
2288
|
speed: 40,
|
|
2133
2289
|
bounciness: 0
|
|
2134
2290
|
}).start();
|
|
@@ -2136,7 +2292,7 @@ function ListItem({
|
|
|
2136
2292
|
const handlePressOut = () => {
|
|
2137
2293
|
reactNative.Animated.spring(scale2, {
|
|
2138
2294
|
toValue: 1,
|
|
2139
|
-
useNativeDriver:
|
|
2295
|
+
useNativeDriver: nativeDriver10,
|
|
2140
2296
|
speed: 40,
|
|
2141
2297
|
bounciness: 4
|
|
2142
2298
|
}).start();
|
|
@@ -2158,10 +2314,10 @@ function ListItem({
|
|
|
2158
2314
|
shadowRadius: 6,
|
|
2159
2315
|
elevation: 2
|
|
2160
2316
|
} : {};
|
|
2161
|
-
return /* @__PURE__ */
|
|
2317
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [{ transform: [{ scale: scale2 }] }, disabled && styles25.disabled] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
2162
2318
|
reactNative.TouchableOpacity,
|
|
2163
2319
|
{
|
|
2164
|
-
style: [
|
|
2320
|
+
style: [styles25.container, cardStyle, style],
|
|
2165
2321
|
onPress: onPress ? handlePress : void 0,
|
|
2166
2322
|
onPressIn: handlePressIn,
|
|
2167
2323
|
onPressOut: handlePressOut,
|
|
@@ -2169,56 +2325,56 @@ function ListItem({
|
|
|
2169
2325
|
activeOpacity: 1,
|
|
2170
2326
|
touchSoundDisabled: true
|
|
2171
2327
|
},
|
|
2172
|
-
effectiveLeft ? /* @__PURE__ */
|
|
2173
|
-
/* @__PURE__ */
|
|
2328
|
+
effectiveLeft ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles25.leftContainer }, effectiveLeft) : null,
|
|
2329
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles25.content }, /* @__PURE__ */ React25__default.default.createElement(
|
|
2174
2330
|
reactNative.Text,
|
|
2175
2331
|
{
|
|
2176
|
-
style: [
|
|
2332
|
+
style: [styles25.title, { color: colors.foreground }, titleStyle],
|
|
2177
2333
|
numberOfLines: 2,
|
|
2178
2334
|
allowFontScaling: true
|
|
2179
2335
|
},
|
|
2180
2336
|
title
|
|
2181
|
-
), subtitle ? /* @__PURE__ */
|
|
2337
|
+
), subtitle ? /* @__PURE__ */ React25__default.default.createElement(
|
|
2182
2338
|
reactNative.Text,
|
|
2183
2339
|
{
|
|
2184
|
-
style: [
|
|
2340
|
+
style: [styles25.subtitle, { color: colors.mutedForeground }, subtitleStyle],
|
|
2185
2341
|
numberOfLines: 2,
|
|
2186
2342
|
allowFontScaling: true
|
|
2187
2343
|
},
|
|
2188
2344
|
subtitle
|
|
2189
|
-
) : null, caption ? /* @__PURE__ */
|
|
2345
|
+
) : null, caption ? /* @__PURE__ */ React25__default.default.createElement(
|
|
2190
2346
|
reactNative.Text,
|
|
2191
2347
|
{
|
|
2192
|
-
style: [
|
|
2348
|
+
style: [styles25.caption, { color: colors.mutedForeground }, captionStyle],
|
|
2193
2349
|
numberOfLines: 1,
|
|
2194
2350
|
allowFontScaling: true
|
|
2195
2351
|
},
|
|
2196
2352
|
caption
|
|
2197
2353
|
) : null),
|
|
2198
|
-
effectiveRight !== void 0 ? /* @__PURE__ */
|
|
2354
|
+
effectiveRight !== void 0 ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles25.rightContainer }, typeof effectiveRight === "string" ? /* @__PURE__ */ React25__default.default.createElement(
|
|
2199
2355
|
reactNative.Text,
|
|
2200
2356
|
{
|
|
2201
|
-
style: [
|
|
2357
|
+
style: [styles25.rightText, { color: colors.mutedForeground }],
|
|
2202
2358
|
allowFontScaling: true
|
|
2203
2359
|
},
|
|
2204
2360
|
effectiveRight
|
|
2205
|
-
) : effectiveRight) : showChevron ? /* @__PURE__ */
|
|
2206
|
-
), showSeparator ? /* @__PURE__ */
|
|
2361
|
+
) : effectiveRight) : showChevron ? /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-with-circle-right", size: 20, color: colors.mutedForeground }) : null
|
|
2362
|
+
), showSeparator ? /* @__PURE__ */ React25__default.default.createElement(
|
|
2207
2363
|
reactNative.View,
|
|
2208
2364
|
{
|
|
2209
2365
|
style: [
|
|
2210
|
-
|
|
2366
|
+
styles25.separator,
|
|
2211
2367
|
{ backgroundColor: colors.border, marginLeft: effectiveLeft ? s(16) + s(44) + s(12) : s(16) }
|
|
2212
2368
|
]
|
|
2213
2369
|
}
|
|
2214
2370
|
) : null);
|
|
2215
2371
|
}
|
|
2216
|
-
var
|
|
2372
|
+
var styles25 = reactNative.StyleSheet.create({
|
|
2217
2373
|
container: {
|
|
2218
2374
|
flexDirection: "row",
|
|
2219
2375
|
alignItems: "center",
|
|
2220
2376
|
paddingHorizontal: s(16),
|
|
2221
|
-
paddingVertical: vs(
|
|
2377
|
+
paddingVertical: vs(10),
|
|
2222
2378
|
gap: s(12)
|
|
2223
2379
|
},
|
|
2224
2380
|
leftContainer: {
|
|
@@ -2233,18 +2389,18 @@ var styles23 = reactNative.StyleSheet.create({
|
|
|
2233
2389
|
gap: vs(4)
|
|
2234
2390
|
},
|
|
2235
2391
|
title: {
|
|
2236
|
-
|
|
2237
|
-
|
|
2238
|
-
lineHeight: mvs(
|
|
2392
|
+
fontFamily: "Poppins-Medium",
|
|
2393
|
+
fontSize: ms(15),
|
|
2394
|
+
lineHeight: mvs(22)
|
|
2239
2395
|
},
|
|
2240
2396
|
subtitle: {
|
|
2241
|
-
|
|
2242
|
-
|
|
2243
|
-
lineHeight: mvs(
|
|
2397
|
+
fontFamily: "Poppins-Regular",
|
|
2398
|
+
fontSize: ms(13),
|
|
2399
|
+
lineHeight: mvs(18)
|
|
2244
2400
|
},
|
|
2245
2401
|
caption: {
|
|
2402
|
+
fontFamily: "Poppins-Regular",
|
|
2246
2403
|
fontSize: ms(12),
|
|
2247
|
-
fontWeight: "400",
|
|
2248
2404
|
lineHeight: mvs(16),
|
|
2249
2405
|
opacity: 0.7
|
|
2250
2406
|
},
|
|
@@ -2255,7 +2411,8 @@ var styles23 = reactNative.StyleSheet.create({
|
|
|
2255
2411
|
maxWidth: s(160)
|
|
2256
2412
|
},
|
|
2257
2413
|
rightText: {
|
|
2258
|
-
|
|
2414
|
+
fontFamily: "Poppins-Regular",
|
|
2415
|
+
fontSize: ms(14)
|
|
2259
2416
|
},
|
|
2260
2417
|
chevron: {
|
|
2261
2418
|
marginLeft: s(4)
|
|
@@ -2268,12 +2425,12 @@ var styles23 = reactNative.StyleSheet.create({
|
|
|
2268
2425
|
opacity: 0.45
|
|
2269
2426
|
}
|
|
2270
2427
|
});
|
|
2271
|
-
var
|
|
2272
|
-
function Chip({ label, selected = false, onPress, style }) {
|
|
2428
|
+
var nativeDriver11 = reactNative.Platform.OS !== "web";
|
|
2429
|
+
function Chip({ label, selected = false, onPress, icon, iconName, style }) {
|
|
2273
2430
|
const { colors } = useTheme();
|
|
2274
|
-
const scale2 =
|
|
2275
|
-
const pressAnim =
|
|
2276
|
-
|
|
2431
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
2432
|
+
const pressAnim = React25.useRef(new reactNative.Animated.Value(selected ? 1 : 0)).current;
|
|
2433
|
+
React25.useEffect(() => {
|
|
2277
2434
|
reactNative.Animated.timing(pressAnim, {
|
|
2278
2435
|
toValue: selected ? 1 : 0,
|
|
2279
2436
|
duration: 150,
|
|
@@ -2284,7 +2441,7 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2284
2441
|
const handlePressIn = () => {
|
|
2285
2442
|
reactNative.Animated.spring(scale2, {
|
|
2286
2443
|
toValue: 0.95,
|
|
2287
|
-
useNativeDriver:
|
|
2444
|
+
useNativeDriver: nativeDriver11,
|
|
2288
2445
|
speed: 40,
|
|
2289
2446
|
bounciness: 0
|
|
2290
2447
|
}).start();
|
|
@@ -2292,7 +2449,7 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2292
2449
|
const handlePressOut = () => {
|
|
2293
2450
|
reactNative.Animated.spring(scale2, {
|
|
2294
2451
|
toValue: 1,
|
|
2295
|
-
useNativeDriver:
|
|
2452
|
+
useNativeDriver: nativeDriver11,
|
|
2296
2453
|
speed: 40,
|
|
2297
2454
|
bounciness: 4
|
|
2298
2455
|
}).start();
|
|
@@ -2313,7 +2470,8 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2313
2470
|
inputRange: [0, 1],
|
|
2314
2471
|
outputRange: [colors.border, colors.primary]
|
|
2315
2472
|
});
|
|
2316
|
-
|
|
2473
|
+
const resolvedIcon = iconName ? renderIcon(iconName, ms(13), selected ? colors.primaryForeground : colors.foreground) : icon;
|
|
2474
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [styles26.wrapper, { transform: [{ scale: scale2 }] }, style] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
2317
2475
|
reactNative.TouchableOpacity,
|
|
2318
2476
|
{
|
|
2319
2477
|
onPress: handlePress,
|
|
@@ -2322,7 +2480,7 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2322
2480
|
activeOpacity: 1,
|
|
2323
2481
|
touchSoundDisabled: true
|
|
2324
2482
|
},
|
|
2325
|
-
/* @__PURE__ */
|
|
2483
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [styles26.chip, { backgroundColor, borderColor }] }, resolvedIcon ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles26.chipIcon }, resolvedIcon) : null, /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.Text, { style: [styles26.label, { color: textColor }], allowFontScaling: true }, label))
|
|
2326
2484
|
));
|
|
2327
2485
|
}
|
|
2328
2486
|
function ChipGroup({ options, value, onValueChange, multiSelect = false, style }) {
|
|
@@ -2347,7 +2505,7 @@ function ChipGroup({ options, value, onValueChange, multiSelect = false, style }
|
|
|
2347
2505
|
}
|
|
2348
2506
|
return optionValue === value;
|
|
2349
2507
|
};
|
|
2350
|
-
return /* @__PURE__ */
|
|
2508
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles26.group, style] }, options.map((opt) => /* @__PURE__ */ React25__default.default.createElement(
|
|
2351
2509
|
Chip,
|
|
2352
2510
|
{
|
|
2353
2511
|
key: opt.value,
|
|
@@ -2357,20 +2515,26 @@ function ChipGroup({ options, value, onValueChange, multiSelect = false, style }
|
|
|
2357
2515
|
}
|
|
2358
2516
|
)));
|
|
2359
2517
|
}
|
|
2360
|
-
var
|
|
2518
|
+
var styles26 = reactNative.StyleSheet.create({
|
|
2361
2519
|
wrapper: {},
|
|
2362
2520
|
chip: {
|
|
2363
2521
|
borderRadius: 999,
|
|
2364
2522
|
paddingHorizontal: s(14),
|
|
2365
|
-
paddingVertical: vs(
|
|
2366
|
-
borderWidth: 1
|
|
2523
|
+
paddingVertical: vs(5),
|
|
2524
|
+
borderWidth: 1,
|
|
2525
|
+
alignItems: "center",
|
|
2526
|
+
justifyContent: "center",
|
|
2527
|
+
flexDirection: "row",
|
|
2528
|
+
gap: s(5)
|
|
2529
|
+
},
|
|
2530
|
+
chipIcon: {
|
|
2367
2531
|
alignItems: "center",
|
|
2368
2532
|
justifyContent: "center"
|
|
2369
2533
|
},
|
|
2370
2534
|
label: {
|
|
2371
|
-
|
|
2372
|
-
|
|
2373
|
-
lineHeight: mvs(
|
|
2535
|
+
fontFamily: "Poppins-Medium",
|
|
2536
|
+
fontSize: ms(13),
|
|
2537
|
+
lineHeight: mvs(18)
|
|
2374
2538
|
},
|
|
2375
2539
|
group: {
|
|
2376
2540
|
flexDirection: "row",
|
|
@@ -2389,43 +2553,85 @@ function ConfirmDialog({
|
|
|
2389
2553
|
onCancel
|
|
2390
2554
|
}) {
|
|
2391
2555
|
const { colors } = useTheme();
|
|
2392
|
-
|
|
2393
|
-
|
|
2556
|
+
const ref = React25.useRef(null);
|
|
2557
|
+
React25.useEffect(() => {
|
|
2558
|
+
if (visible) {
|
|
2559
|
+
impactLight();
|
|
2560
|
+
ref.current?.present();
|
|
2561
|
+
} else {
|
|
2562
|
+
ref.current?.dismiss();
|
|
2563
|
+
}
|
|
2564
|
+
}, [visible]);
|
|
2565
|
+
const renderBackdrop = (props) => /* @__PURE__ */ React25__default.default.createElement(
|
|
2566
|
+
bottomSheet.BottomSheetBackdrop,
|
|
2394
2567
|
{
|
|
2395
|
-
|
|
2396
|
-
|
|
2568
|
+
...props,
|
|
2569
|
+
disappearsOnIndex: -1,
|
|
2570
|
+
appearsOnIndex: 0,
|
|
2571
|
+
pressBehavior: "close"
|
|
2572
|
+
}
|
|
2573
|
+
);
|
|
2574
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
2575
|
+
bottomSheet.BottomSheetModal,
|
|
2576
|
+
{
|
|
2577
|
+
ref,
|
|
2578
|
+
snapPoints: ["35%"],
|
|
2579
|
+
onDismiss: onCancel,
|
|
2580
|
+
backdropComponent: renderBackdrop,
|
|
2581
|
+
backgroundStyle: [styles27.background, { backgroundColor: colors.card }],
|
|
2582
|
+
handleIndicatorStyle: [styles27.handle, { backgroundColor: colors.border }],
|
|
2583
|
+
enablePanDownToClose: true
|
|
2397
2584
|
},
|
|
2398
|
-
/* @__PURE__ */
|
|
2399
|
-
|
|
2400
|
-
|
|
2401
|
-
|
|
2585
|
+
/* @__PURE__ */ React25__default.default.createElement(bottomSheet.BottomSheetView, { style: styles27.content }, /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles27.title, { color: colors.cardForeground }], allowFontScaling: true }, title), description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles27.description, { color: colors.mutedForeground }], allowFontScaling: true }, description) : null, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles27.actions }, /* @__PURE__ */ React25__default.default.createElement(
|
|
2586
|
+
Button,
|
|
2587
|
+
{
|
|
2588
|
+
label: cancelLabel,
|
|
2589
|
+
variant: "outline",
|
|
2590
|
+
fullWidth: true,
|
|
2591
|
+
onPress: onCancel,
|
|
2592
|
+
icon: /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Feather, { name: "x", size: 15, color: colors.foreground })
|
|
2593
|
+
}
|
|
2594
|
+
), /* @__PURE__ */ React25__default.default.createElement(
|
|
2595
|
+
Button,
|
|
2596
|
+
{
|
|
2597
|
+
label: confirmLabel,
|
|
2598
|
+
variant: confirmVariant,
|
|
2599
|
+
fullWidth: true,
|
|
2600
|
+
onPress: onConfirm,
|
|
2601
|
+
icon: /* @__PURE__ */ React25__default.default.createElement(
|
|
2602
|
+
vectorIcons.Feather,
|
|
2603
|
+
{
|
|
2604
|
+
name: confirmVariant === "destructive" ? "trash-2" : "check",
|
|
2605
|
+
size: 15,
|
|
2606
|
+
color: confirmVariant === "destructive" ? colors.destructiveForeground : colors.primaryForeground
|
|
2607
|
+
}
|
|
2608
|
+
)
|
|
2609
|
+
}
|
|
2610
|
+
)))
|
|
2611
|
+
);
|
|
2402
2612
|
}
|
|
2403
|
-
var
|
|
2404
|
-
|
|
2405
|
-
|
|
2406
|
-
|
|
2407
|
-
justifyContent: "center",
|
|
2408
|
-
alignItems: "center",
|
|
2409
|
-
padding: s(24)
|
|
2613
|
+
var styles27 = reactNative.StyleSheet.create({
|
|
2614
|
+
background: {
|
|
2615
|
+
borderTopLeftRadius: ms(16),
|
|
2616
|
+
borderTopRightRadius: ms(16)
|
|
2410
2617
|
},
|
|
2411
|
-
|
|
2412
|
-
width:
|
|
2413
|
-
|
|
2414
|
-
borderRadius: ms(
|
|
2415
|
-
|
|
2416
|
-
|
|
2417
|
-
|
|
2418
|
-
|
|
2419
|
-
|
|
2420
|
-
shadowRadius: 16,
|
|
2421
|
-
elevation: 8
|
|
2618
|
+
handle: {
|
|
2619
|
+
width: s(36),
|
|
2620
|
+
height: vs(4),
|
|
2621
|
+
borderRadius: ms(2)
|
|
2622
|
+
},
|
|
2623
|
+
content: {
|
|
2624
|
+
paddingHorizontal: s(24),
|
|
2625
|
+
paddingBottom: vs(32),
|
|
2626
|
+
gap: vs(12)
|
|
2422
2627
|
},
|
|
2423
2628
|
title: {
|
|
2629
|
+
fontFamily: "Poppins-SemiBold",
|
|
2424
2630
|
fontSize: ms(18),
|
|
2425
|
-
fontWeight: "600",
|
|
2426
2631
|
lineHeight: mvs(26)
|
|
2427
2632
|
},
|
|
2428
2633
|
description: {
|
|
2634
|
+
fontFamily: "Poppins-Regular",
|
|
2429
2635
|
fontSize: ms(15),
|
|
2430
2636
|
lineHeight: mvs(22)
|
|
2431
2637
|
},
|
|
@@ -2436,9 +2642,9 @@ var styles25 = reactNative.StyleSheet.create({
|
|
|
2436
2642
|
});
|
|
2437
2643
|
function LabelValue({ label, value, style }) {
|
|
2438
2644
|
const { colors } = useTheme();
|
|
2439
|
-
return /* @__PURE__ */
|
|
2645
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles28.container, style] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles28.label, { color: colors.mutedForeground }], allowFontScaling: true }, label), typeof value === "string" ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles28.value, { color: colors.foreground }], allowFontScaling: true }, value) : value);
|
|
2440
2646
|
}
|
|
2441
|
-
var
|
|
2647
|
+
var styles28 = reactNative.StyleSheet.create({
|
|
2442
2648
|
container: {
|
|
2443
2649
|
flexDirection: "row",
|
|
2444
2650
|
justifyContent: "space-between",
|
|
@@ -2446,13 +2652,14 @@ var styles26 = reactNative.StyleSheet.create({
|
|
|
2446
2652
|
gap: s(12)
|
|
2447
2653
|
},
|
|
2448
2654
|
label: {
|
|
2655
|
+
fontFamily: "Poppins-Regular",
|
|
2449
2656
|
fontSize: ms(13),
|
|
2450
2657
|
lineHeight: mvs(18)
|
|
2451
2658
|
},
|
|
2452
2659
|
value: {
|
|
2453
|
-
|
|
2454
|
-
|
|
2455
|
-
lineHeight: mvs(
|
|
2660
|
+
fontFamily: "Poppins-Medium",
|
|
2661
|
+
fontSize: ms(14),
|
|
2662
|
+
lineHeight: mvs(20),
|
|
2456
2663
|
textAlign: "right"
|
|
2457
2664
|
}
|
|
2458
2665
|
});
|
|
@@ -2488,27 +2695,27 @@ function MonthPicker({ value, onChange, style }) {
|
|
|
2488
2695
|
onChange({ month: value.month + 1, year: value.year });
|
|
2489
2696
|
}
|
|
2490
2697
|
};
|
|
2491
|
-
return /* @__PURE__ */
|
|
2698
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles29.container, style] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
2492
2699
|
reactNative.TouchableOpacity,
|
|
2493
2700
|
{
|
|
2494
|
-
style:
|
|
2701
|
+
style: styles29.arrow,
|
|
2495
2702
|
onPress: handlePrev,
|
|
2496
2703
|
activeOpacity: 0.6,
|
|
2497
2704
|
touchSoundDisabled: true
|
|
2498
2705
|
},
|
|
2499
|
-
/* @__PURE__ */
|
|
2500
|
-
), /* @__PURE__ */
|
|
2706
|
+
/* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-left", size: 22, color: colors.foreground })
|
|
2707
|
+
), /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles29.label, { color: colors.foreground }], allowFontScaling: true }, MONTH_NAMES[value.month - 1], " ", value.year), /* @__PURE__ */ React25__default.default.createElement(
|
|
2501
2708
|
reactNative.TouchableOpacity,
|
|
2502
2709
|
{
|
|
2503
|
-
style:
|
|
2710
|
+
style: styles29.arrow,
|
|
2504
2711
|
onPress: handleNext,
|
|
2505
2712
|
activeOpacity: 0.6,
|
|
2506
2713
|
touchSoundDisabled: true
|
|
2507
2714
|
},
|
|
2508
|
-
/* @__PURE__ */
|
|
2715
|
+
/* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-right", size: 22, color: colors.foreground })
|
|
2509
2716
|
));
|
|
2510
2717
|
}
|
|
2511
|
-
var
|
|
2718
|
+
var styles29 = reactNative.StyleSheet.create({
|
|
2512
2719
|
container: {
|
|
2513
2720
|
flexDirection: "row",
|
|
2514
2721
|
alignItems: "center",
|
|
@@ -2521,8 +2728,8 @@ var styles27 = reactNative.StyleSheet.create({
|
|
|
2521
2728
|
justifyContent: "center"
|
|
2522
2729
|
},
|
|
2523
2730
|
label: {
|
|
2731
|
+
fontFamily: "Poppins-Medium",
|
|
2524
2732
|
fontSize: ms(17),
|
|
2525
|
-
fontWeight: "500",
|
|
2526
2733
|
lineHeight: mvs(24),
|
|
2527
2734
|
textAlign: "center",
|
|
2528
2735
|
minWidth: s(160)
|
|
@@ -2613,6 +2820,7 @@ exports.CurrencyInputLarge = CurrencyInput;
|
|
|
2613
2820
|
exports.EmptyState = EmptyState;
|
|
2614
2821
|
exports.ICON_SIZES = ICON_SIZES;
|
|
2615
2822
|
exports.Icon = Icon;
|
|
2823
|
+
exports.IconButton = IconButton;
|
|
2616
2824
|
exports.Input = Input;
|
|
2617
2825
|
exports.LabelValue = LabelValue;
|
|
2618
2826
|
exports.ListItem = ListItem;
|