@retray-dev/ui-kit 2.8.0 → 3.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/COMPONENTS.md +73 -17
- package/README.md +23 -3
- package/dist/index.d.mts +17 -6
- package/dist/index.d.ts +17 -6
- package/dist/index.js +446 -329
- package/dist/index.mjs +447 -330
- 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 +36 -36
- package/src/components/Avatar/Avatar.tsx +1 -1
- package/src/components/Badge/Badge.tsx +12 -8
- package/src/components/Button/Button.tsx +8 -8
- package/src/components/Card/Card.tsx +12 -9
- package/src/components/Checkbox/Checkbox.tsx +8 -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 +14 -4
- package/src/components/EmptyState/EmptyState.tsx +2 -1
- package/src/components/Input/Input.tsx +16 -9
- 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 -36
- package/src/components/Select/Select.tsx +17 -19
- package/src/components/Sheet/Sheet.tsx +2 -1
- 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 +9 -16
- package/src/components/Text/Text.tsx +6 -6
- package/src/components/Textarea/Textarea.tsx +8 -6
- package/src/components/Toast/Toast.tsx +27 -21
- package/src/components/Toggle/Toggle.tsx +6 -4
- package/src/fonts.ts +30 -0
- package/src/theme/colors.ts +22 -14
- package/src/theme/types.ts +4 -0
package/dist/index.mjs
CHANGED
|
@@ -7,7 +7,7 @@ import Feather from '@expo/vector-icons/Feather';
|
|
|
7
7
|
import FontAwesome5 from '@expo/vector-icons/FontAwesome5';
|
|
8
8
|
import MaterialIcons from '@expo/vector-icons/MaterialIcons';
|
|
9
9
|
import Ionicons from '@expo/vector-icons/Ionicons';
|
|
10
|
-
import { AntDesign as AntDesign$1, Entypo as Entypo$1, FontAwesome5 as FontAwesome5$1, MaterialIcons as MaterialIcons$1 } from '@expo/vector-icons';
|
|
10
|
+
import { AntDesign as AntDesign$1, Entypo as Entypo$1, Feather as Feather$1, FontAwesome5 as FontAwesome5$1, MaterialIcons as MaterialIcons$1 } from '@expo/vector-icons';
|
|
11
11
|
import { LinearGradient } from 'expo-linear-gradient';
|
|
12
12
|
import Animated11, { useSharedValue, useDerivedValue, withTiming, Easing as Easing$1, useAnimatedStyle, withSpring } from 'react-native-reanimated';
|
|
13
13
|
import RNSlider from '@react-native-community/slider';
|
|
@@ -35,33 +35,41 @@ var defaultLight = {
|
|
|
35
35
|
accent: "#e4e4e4",
|
|
36
36
|
accentForeground: "#171717",
|
|
37
37
|
destructive: "#ef4444",
|
|
38
|
-
destructiveForeground: "#
|
|
38
|
+
destructiveForeground: "#ffffff",
|
|
39
39
|
border: "#e5e5e5",
|
|
40
40
|
input: "#e5e5e5",
|
|
41
41
|
ring: "#1a1a1a",
|
|
42
|
-
success: "#
|
|
43
|
-
successForeground: "#
|
|
42
|
+
success: "#1a7a45",
|
|
43
|
+
successForeground: "#ffffff",
|
|
44
|
+
destructiveTint: "#fff5f5",
|
|
45
|
+
destructiveBorder: "#fecaca",
|
|
46
|
+
successTint: "#f0fdf4",
|
|
47
|
+
successBorder: "#bbf7d0"
|
|
44
48
|
};
|
|
45
49
|
var defaultDark = {
|
|
46
|
-
background: "#
|
|
50
|
+
background: "#0f0f0f",
|
|
47
51
|
foreground: "#fafafa",
|
|
48
|
-
card: "#
|
|
52
|
+
card: "#1c1c1c",
|
|
49
53
|
cardForeground: "#fafafa",
|
|
50
54
|
primary: "#fafafa",
|
|
51
|
-
primaryForeground: "#
|
|
52
|
-
secondary: "#
|
|
55
|
+
primaryForeground: "#0f0f0f",
|
|
56
|
+
secondary: "#272727",
|
|
53
57
|
secondaryForeground: "#fafafa",
|
|
54
|
-
muted: "#
|
|
55
|
-
mutedForeground: "#
|
|
56
|
-
accent: "#
|
|
58
|
+
muted: "#272727",
|
|
59
|
+
mutedForeground: "#9a9a9a",
|
|
60
|
+
accent: "#2e2e2e",
|
|
57
61
|
accentForeground: "#fafafa",
|
|
58
62
|
destructive: "#dc2626",
|
|
59
|
-
destructiveForeground: "#
|
|
60
|
-
border: "#
|
|
63
|
+
destructiveForeground: "#ffffff",
|
|
64
|
+
border: "#303030",
|
|
61
65
|
input: "#2a2a2a",
|
|
62
66
|
ring: "#fafafa",
|
|
63
|
-
success: "#
|
|
64
|
-
successForeground: "#
|
|
67
|
+
success: "#166534",
|
|
68
|
+
successForeground: "#ffffff",
|
|
69
|
+
destructiveTint: "#3b0a0a",
|
|
70
|
+
destructiveBorder: "#7f1d1d",
|
|
71
|
+
successTint: "#052e16",
|
|
72
|
+
successBorder: "#166534"
|
|
65
73
|
};
|
|
66
74
|
|
|
67
75
|
// src/theme/ThemeProvider.tsx
|
|
@@ -158,14 +166,14 @@ function renderIcon(name, size, color) {
|
|
|
158
166
|
// src/components/Button/Button.tsx
|
|
159
167
|
var nativeDriver = Platform.OS !== "web";
|
|
160
168
|
var containerSizeStyles = {
|
|
161
|
-
sm: { paddingHorizontal: s(
|
|
162
|
-
md: { paddingHorizontal: s(
|
|
163
|
-
lg: { paddingHorizontal: s(
|
|
169
|
+
sm: { paddingHorizontal: s(12), paddingVertical: vs(10), minHeight: 44 },
|
|
170
|
+
md: { paddingHorizontal: s(16), paddingVertical: vs(10), minHeight: 44 },
|
|
171
|
+
lg: { paddingHorizontal: s(20), paddingVertical: vs(12), minHeight: 48 }
|
|
164
172
|
};
|
|
165
173
|
var labelSizeStyles = {
|
|
166
|
-
sm: { fontSize: ms(
|
|
167
|
-
md: { fontSize: ms(
|
|
168
|
-
lg: { fontSize: ms(
|
|
174
|
+
sm: { fontSize: ms(13) },
|
|
175
|
+
md: { fontSize: ms(15) },
|
|
176
|
+
lg: { fontSize: ms(16) }
|
|
169
177
|
};
|
|
170
178
|
var iconSizeMap = { sm: 16, md: 18, lg: 20 };
|
|
171
179
|
function Button({
|
|
@@ -242,7 +250,7 @@ function Button({
|
|
|
242
250
|
}
|
|
243
251
|
var styles = StyleSheet.create({
|
|
244
252
|
base: {
|
|
245
|
-
borderRadius:
|
|
253
|
+
borderRadius: 8,
|
|
246
254
|
alignItems: "center",
|
|
247
255
|
justifyContent: "center",
|
|
248
256
|
flexDirection: "row"
|
|
@@ -254,7 +262,7 @@ var styles = StyleSheet.create({
|
|
|
254
262
|
opacity: 0.5
|
|
255
263
|
},
|
|
256
264
|
label: {
|
|
257
|
-
|
|
265
|
+
fontFamily: "Poppins-SemiBold"
|
|
258
266
|
},
|
|
259
267
|
labelWithIcon: {
|
|
260
268
|
marginHorizontal: s(8)
|
|
@@ -351,12 +359,12 @@ var styles2 = StyleSheet.create({
|
|
|
351
359
|
}
|
|
352
360
|
});
|
|
353
361
|
var variantStyles = {
|
|
354
|
-
h1: { fontSize: ms(40),
|
|
355
|
-
h2: { fontSize: ms(28),
|
|
356
|
-
h3: { fontSize: ms(22),
|
|
357
|
-
body: { fontSize: ms(17),
|
|
358
|
-
caption: { fontSize: ms(13),
|
|
359
|
-
label: { fontSize: ms(15),
|
|
362
|
+
h1: { fontFamily: "Poppins-Bold", fontSize: ms(40), lineHeight: mvs(52) },
|
|
363
|
+
h2: { fontFamily: "Poppins-Bold", fontSize: ms(28), lineHeight: mvs(36) },
|
|
364
|
+
h3: { fontFamily: "Poppins-SemiBold", fontSize: ms(22), lineHeight: mvs(30) },
|
|
365
|
+
body: { fontFamily: "Poppins-Regular", fontSize: ms(17), lineHeight: mvs(26) },
|
|
366
|
+
caption: { fontFamily: "Poppins-Regular", fontSize: ms(13), lineHeight: mvs(20) },
|
|
367
|
+
label: { fontFamily: "Poppins-Medium", fontSize: ms(15), lineHeight: mvs(22) }
|
|
360
368
|
};
|
|
361
369
|
function Text2({ variant = "body", color, style, children, ...props }) {
|
|
362
370
|
const { colors } = useTheme();
|
|
@@ -372,7 +380,7 @@ function Text2({ variant = "body", color, style, children, ...props }) {
|
|
|
372
380
|
);
|
|
373
381
|
}
|
|
374
382
|
var webInputResetStyle = Platform.OS === "web" ? { outlineStyle: "none", outlineWidth: 0, outlineColor: "transparent", boxShadow: "none" } : {};
|
|
375
|
-
function Input({ label, error, hint, prefix, suffix, prefixStyle, suffixStyle, prefixIcon, suffixIcon, prefixIconColor, suffixIconColor, type = "text", containerStyle, style, onFocus, onBlur, secureTextEntry, ...props }) {
|
|
383
|
+
function Input({ label, error, hint, prefix, suffix, prefixStyle, suffixStyle, prefixIcon, suffixIcon, prefixIconColor, suffixIconColor, type = "text", containerStyle, inputWrapperStyle, style, onFocus, onBlur, secureTextEntry, ...props }) {
|
|
376
384
|
const { colors } = useTheme();
|
|
377
385
|
const [focused, setFocused] = useState(false);
|
|
378
386
|
const [showPassword, setShowPassword] = useState(false);
|
|
@@ -388,7 +396,8 @@ function Input({ label, error, hint, prefix, suffix, prefixStyle, suffixStyle, p
|
|
|
388
396
|
{
|
|
389
397
|
borderColor: error ? colors.destructive : focused ? colors.ring ?? colors.primary : colors.border,
|
|
390
398
|
backgroundColor: colors.background
|
|
391
|
-
}
|
|
399
|
+
},
|
|
400
|
+
inputWrapperStyle
|
|
392
401
|
]
|
|
393
402
|
},
|
|
394
403
|
effectivePrefix ? typeof effectivePrefix === "string" ? /* @__PURE__ */ React25.createElement(Text, { style: [styles3.prefixText, { color: colors.mutedForeground }, prefixStyle], allowFontScaling: true }, effectivePrefix) : /* @__PURE__ */ React25.createElement(View, { style: styles3.prefixContainer }, effectivePrefix) : null,
|
|
@@ -425,40 +434,44 @@ var styles3 = StyleSheet.create({
|
|
|
425
434
|
gap: vs(8)
|
|
426
435
|
},
|
|
427
436
|
label: {
|
|
428
|
-
|
|
429
|
-
|
|
437
|
+
fontFamily: "Poppins-Medium",
|
|
438
|
+
fontSize: ms(13)
|
|
430
439
|
},
|
|
431
440
|
inputWrapper: {
|
|
432
441
|
flexDirection: "row",
|
|
433
442
|
alignItems: "center",
|
|
434
|
-
borderWidth: 1
|
|
443
|
+
borderWidth: 1,
|
|
435
444
|
borderRadius: ms(8),
|
|
436
|
-
paddingHorizontal: s(
|
|
437
|
-
paddingVertical: vs(
|
|
445
|
+
paddingHorizontal: s(14),
|
|
446
|
+
paddingVertical: vs(11)
|
|
438
447
|
},
|
|
439
448
|
input: {
|
|
449
|
+
fontFamily: "Poppins-Regular",
|
|
440
450
|
flex: 1,
|
|
441
|
-
fontSize: ms(
|
|
451
|
+
fontSize: ms(15),
|
|
442
452
|
paddingVertical: 0
|
|
443
453
|
},
|
|
444
454
|
prefixContainer: {
|
|
445
455
|
marginRight: s(8)
|
|
446
456
|
},
|
|
447
457
|
prefixText: {
|
|
448
|
-
|
|
458
|
+
fontFamily: "Poppins-Regular",
|
|
459
|
+
fontSize: ms(15),
|
|
449
460
|
marginRight: s(8)
|
|
450
461
|
},
|
|
451
462
|
suffixContainer: {
|
|
452
463
|
marginLeft: s(8)
|
|
453
464
|
},
|
|
454
465
|
suffixText: {
|
|
455
|
-
|
|
466
|
+
fontFamily: "Poppins-Regular",
|
|
467
|
+
fontSize: ms(15),
|
|
456
468
|
marginLeft: s(8)
|
|
457
469
|
},
|
|
458
470
|
passwordToggle: {
|
|
459
471
|
padding: s(4)
|
|
460
472
|
},
|
|
461
473
|
helperText: {
|
|
474
|
+
fontFamily: "Poppins-Regular",
|
|
462
475
|
fontSize: ms(13)
|
|
463
476
|
}
|
|
464
477
|
});
|
|
@@ -484,31 +497,35 @@ function Badge({ label, children, variant = "default", size = "md", icon, iconNa
|
|
|
484
497
|
default: { backgroundColor: colors.primary },
|
|
485
498
|
secondary: { backgroundColor: colors.secondary },
|
|
486
499
|
destructive: { backgroundColor: colors.destructive },
|
|
487
|
-
outline: { backgroundColor: "transparent", borderWidth: 1, borderColor: colors.border }
|
|
500
|
+
outline: { backgroundColor: "transparent", borderWidth: 1, borderColor: colors.border },
|
|
501
|
+
success: { backgroundColor: colors.success },
|
|
502
|
+
warning: { backgroundColor: "#f59e0b" },
|
|
503
|
+
successOutline: { backgroundColor: colors.successTint, borderWidth: 1, borderColor: colors.successBorder },
|
|
504
|
+
destructiveOutline: { backgroundColor: colors.destructiveTint, borderWidth: 1, borderColor: colors.destructiveBorder }
|
|
488
505
|
}[variant];
|
|
489
506
|
const textColor = {
|
|
490
507
|
default: colors.primaryForeground,
|
|
491
508
|
secondary: colors.secondaryForeground,
|
|
492
509
|
destructive: colors.destructiveForeground,
|
|
493
|
-
outline: colors.foreground
|
|
510
|
+
outline: colors.foreground,
|
|
511
|
+
success: colors.successForeground,
|
|
512
|
+
warning: "#ffffff",
|
|
513
|
+
successOutline: colors.success,
|
|
514
|
+
destructiveOutline: colors.destructive
|
|
494
515
|
}[variant];
|
|
495
516
|
const effectiveIcon = iconName ? renderIcon(iconName, sizeIconSize[size], iconColor ?? textColor) : icon;
|
|
496
517
|
const content = children ?? label;
|
|
497
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [styles4.container, containerStyle, sizePadding[size], { gap: sizeIconGap[size] }, style] }, effectiveIcon
|
|
518
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles4.container, containerStyle, sizePadding[size], { gap: sizeIconGap[size] }, style] }, effectiveIcon, typeof content === "string" ? /* @__PURE__ */ React25.createElement(Text, { style: [styles4.label, { color: textColor }, sizeFontSize[size]], allowFontScaling: true }, content) : content);
|
|
498
519
|
}
|
|
499
520
|
var styles4 = StyleSheet.create({
|
|
500
521
|
container: {
|
|
501
|
-
borderRadius:
|
|
522
|
+
borderRadius: 9999,
|
|
502
523
|
alignSelf: "flex-start",
|
|
503
524
|
flexDirection: "row",
|
|
504
525
|
alignItems: "center"
|
|
505
526
|
},
|
|
506
|
-
iconContainer: {
|
|
507
|
-
justifyContent: "center",
|
|
508
|
-
alignItems: "center"
|
|
509
|
-
},
|
|
510
527
|
label: {
|
|
511
|
-
|
|
528
|
+
fontFamily: "Poppins-Medium"
|
|
512
529
|
}
|
|
513
530
|
});
|
|
514
531
|
var nativeDriver3 = Platform.OS !== "web";
|
|
@@ -600,24 +617,27 @@ var styles5 = StyleSheet.create({
|
|
|
600
617
|
borderWidth: 1
|
|
601
618
|
},
|
|
602
619
|
header: {
|
|
603
|
-
padding: s(
|
|
620
|
+
padding: s(16),
|
|
604
621
|
paddingBottom: 0,
|
|
605
|
-
gap: vs(
|
|
622
|
+
gap: vs(4)
|
|
606
623
|
},
|
|
607
624
|
title: {
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
lineHeight: mvs(
|
|
625
|
+
fontFamily: "Poppins-SemiBold",
|
|
626
|
+
fontSize: ms(16),
|
|
627
|
+
lineHeight: mvs(22)
|
|
611
628
|
},
|
|
612
629
|
description: {
|
|
613
|
-
|
|
614
|
-
|
|
630
|
+
fontFamily: "Poppins-Regular",
|
|
631
|
+
fontSize: ms(13),
|
|
632
|
+
lineHeight: mvs(18)
|
|
615
633
|
},
|
|
616
634
|
content: {
|
|
617
|
-
padding: s(
|
|
635
|
+
padding: s(16),
|
|
636
|
+
paddingTop: s(12)
|
|
618
637
|
},
|
|
619
638
|
footer: {
|
|
620
|
-
|
|
639
|
+
paddingHorizontal: s(16),
|
|
640
|
+
paddingBottom: vs(14),
|
|
621
641
|
paddingTop: 0,
|
|
622
642
|
flexDirection: "row",
|
|
623
643
|
alignItems: "center"
|
|
@@ -651,10 +671,35 @@ var sizeMap2 = {
|
|
|
651
671
|
md: "small",
|
|
652
672
|
lg: "large"
|
|
653
673
|
};
|
|
654
|
-
|
|
674
|
+
var labelFontSize = {
|
|
675
|
+
sm: ms(11),
|
|
676
|
+
md: ms(13),
|
|
677
|
+
lg: ms(14)
|
|
678
|
+
};
|
|
679
|
+
function Spinner({ size = "md", color, label, ...props }) {
|
|
655
680
|
const { colors } = useTheme();
|
|
681
|
+
if (label) {
|
|
682
|
+
return /* @__PURE__ */ React25.createElement(View, { style: styles7.wrapper }, /* @__PURE__ */ React25.createElement(ActivityIndicator, { size: sizeMap2[size], color: color ?? colors.primary, ...props }), /* @__PURE__ */ React25.createElement(
|
|
683
|
+
Text,
|
|
684
|
+
{
|
|
685
|
+
style: [styles7.label, { color: colors.mutedForeground, fontSize: labelFontSize[size] }],
|
|
686
|
+
allowFontScaling: true
|
|
687
|
+
},
|
|
688
|
+
label
|
|
689
|
+
));
|
|
690
|
+
}
|
|
656
691
|
return /* @__PURE__ */ React25.createElement(ActivityIndicator, { size: sizeMap2[size], color: color ?? colors.primary, ...props });
|
|
657
692
|
}
|
|
693
|
+
var styles7 = StyleSheet.create({
|
|
694
|
+
wrapper: {
|
|
695
|
+
alignItems: "center",
|
|
696
|
+
gap: vs(6)
|
|
697
|
+
},
|
|
698
|
+
label: {
|
|
699
|
+
fontFamily: "Poppins-Regular",
|
|
700
|
+
lineHeight: mvs(18)
|
|
701
|
+
}
|
|
702
|
+
});
|
|
658
703
|
function Skeleton({ width = "100%", height = 16, borderRadius = 6, style }) {
|
|
659
704
|
const { colors, colorScheme } = useTheme();
|
|
660
705
|
const shimmerAnim = useRef(new Animated.Value(0)).current;
|
|
@@ -679,7 +724,7 @@ function Skeleton({ width = "100%", height = 16, borderRadius = 6, style }) {
|
|
|
679
724
|
View,
|
|
680
725
|
{
|
|
681
726
|
style: [
|
|
682
|
-
|
|
727
|
+
styles8.base,
|
|
683
728
|
{ width, height, borderRadius, backgroundColor: colors.muted },
|
|
684
729
|
style
|
|
685
730
|
],
|
|
@@ -696,7 +741,7 @@ function Skeleton({ width = "100%", height = 16, borderRadius = 6, style }) {
|
|
|
696
741
|
))
|
|
697
742
|
);
|
|
698
743
|
}
|
|
699
|
-
var
|
|
744
|
+
var styles8 = StyleSheet.create({
|
|
700
745
|
base: {
|
|
701
746
|
overflow: "hidden"
|
|
702
747
|
}
|
|
@@ -725,7 +770,7 @@ function Avatar({ src, fallback, size = "md", style }) {
|
|
|
725
770
|
backgroundColor: colors.muted,
|
|
726
771
|
overflow: "hidden"
|
|
727
772
|
};
|
|
728
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
773
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles9.base, containerStyle, style] }, !showFallback ? /* @__PURE__ */ React25.createElement(
|
|
729
774
|
Image,
|
|
730
775
|
{
|
|
731
776
|
source: { uri: src },
|
|
@@ -735,56 +780,59 @@ function Avatar({ src, fallback, size = "md", style }) {
|
|
|
735
780
|
) : /* @__PURE__ */ React25.createElement(
|
|
736
781
|
Text,
|
|
737
782
|
{
|
|
738
|
-
style: [
|
|
783
|
+
style: [styles9.fallback, { color: colors.mutedForeground, fontSize: fontSizeMap[size] }],
|
|
739
784
|
allowFontScaling: true
|
|
740
785
|
},
|
|
741
786
|
fallback?.slice(0, 2).toUpperCase() ?? "?"
|
|
742
787
|
));
|
|
743
788
|
}
|
|
744
|
-
var
|
|
789
|
+
var styles9 = StyleSheet.create({
|
|
745
790
|
base: {
|
|
746
791
|
alignItems: "center",
|
|
747
792
|
justifyContent: "center"
|
|
748
793
|
},
|
|
749
794
|
fallback: {
|
|
750
|
-
|
|
795
|
+
fontFamily: "Poppins-Medium"
|
|
751
796
|
}
|
|
752
797
|
});
|
|
753
798
|
function AlertBanner({ title, description, variant = "default", icon, iconName, iconColor, style }) {
|
|
754
799
|
const { colors } = useTheme();
|
|
755
|
-
const
|
|
756
|
-
const
|
|
757
|
-
const
|
|
758
|
-
const defaultIcon = variant === "success" ? /* @__PURE__ */ React25.createElement(FontAwesome5$1, { name: "check-circle", size: 18, color:
|
|
759
|
-
const effectiveIcon = iconName ? renderIcon(iconName, 18, iconColor ??
|
|
760
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
800
|
+
const bgColor = variant === "destructive" ? colors.destructiveBorder : variant === "success" ? colors.successBorder : colors.card;
|
|
801
|
+
const textColor = variant === "destructive" ? "#991b1b" : variant === "success" ? "#166534" : colors.foreground;
|
|
802
|
+
const borderColor = textColor;
|
|
803
|
+
const defaultIcon = variant === "success" ? /* @__PURE__ */ React25.createElement(FontAwesome5$1, { name: "check-circle", size: 18, color: textColor }) : variant === "destructive" ? /* @__PURE__ */ React25.createElement(MaterialIcons$1, { name: "error-outline", size: 20, color: textColor }) : /* @__PURE__ */ React25.createElement(Entypo$1, { name: "info-with-circle", size: 18, color: textColor });
|
|
804
|
+
const effectiveIcon = iconName ? renderIcon(iconName, 18, iconColor ?? textColor) : icon ?? defaultIcon;
|
|
805
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles10.container, { backgroundColor: bgColor, borderColor }, style] }, /* @__PURE__ */ React25.createElement(View, { style: styles10.header }, /* @__PURE__ */ React25.createElement(View, { style: styles10.icon }, effectiveIcon), title ? /* @__PURE__ */ React25.createElement(Text, { style: [styles10.title, { color: textColor }], allowFontScaling: true }, title) : null), description ? /* @__PURE__ */ React25.createElement(Text, { style: [styles10.description, { color: textColor, opacity: 0.85 }], allowFontScaling: true }, description) : null);
|
|
761
806
|
}
|
|
762
|
-
var
|
|
807
|
+
var styles10 = StyleSheet.create({
|
|
763
808
|
container: {
|
|
764
|
-
flexDirection: "row",
|
|
765
809
|
borderWidth: 1,
|
|
766
810
|
borderRadius: ms(12),
|
|
767
|
-
|
|
768
|
-
|
|
811
|
+
paddingHorizontal: s(14),
|
|
812
|
+
paddingVertical: vs(12),
|
|
813
|
+
gap: vs(8),
|
|
769
814
|
shadowColor: "#000",
|
|
770
|
-
shadowOffset: { width: 0, height:
|
|
771
|
-
shadowOpacity: 0.
|
|
772
|
-
shadowRadius:
|
|
773
|
-
elevation:
|
|
815
|
+
shadowOffset: { width: 0, height: 3 },
|
|
816
|
+
shadowOpacity: 0.1,
|
|
817
|
+
shadowRadius: 8,
|
|
818
|
+
elevation: 5
|
|
819
|
+
},
|
|
820
|
+
header: {
|
|
821
|
+
flexDirection: "row",
|
|
822
|
+
alignItems: "center",
|
|
823
|
+
gap: s(10)
|
|
774
824
|
},
|
|
775
825
|
icon: {
|
|
776
826
|
marginTop: 0
|
|
777
827
|
},
|
|
778
|
-
content: {
|
|
779
|
-
flex: 1,
|
|
780
|
-
gap: vs(4)
|
|
781
|
-
},
|
|
782
828
|
title: {
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
lineHeight: mvs(20)
|
|
829
|
+
fontFamily: "Poppins-Bold",
|
|
830
|
+
fontSize: ms(15),
|
|
831
|
+
lineHeight: mvs(20),
|
|
832
|
+
flex: 1
|
|
786
833
|
},
|
|
787
834
|
description: {
|
|
835
|
+
fontFamily: "Poppins-Regular",
|
|
788
836
|
fontSize: ms(14),
|
|
789
837
|
lineHeight: mvs(20)
|
|
790
838
|
}
|
|
@@ -806,18 +854,18 @@ function Progress({ value = 0, max = 100, style }) {
|
|
|
806
854
|
return /* @__PURE__ */ React25.createElement(
|
|
807
855
|
View,
|
|
808
856
|
{
|
|
809
|
-
style: [
|
|
857
|
+
style: [styles11.track, { backgroundColor: colors.muted }, style],
|
|
810
858
|
onLayout: (e) => setTrackWidth(e.nativeEvent.layout.width)
|
|
811
859
|
},
|
|
812
860
|
/* @__PURE__ */ React25.createElement(
|
|
813
861
|
Animated.View,
|
|
814
862
|
{
|
|
815
|
-
style: [
|
|
863
|
+
style: [styles11.indicator, { width: animatedWidth, backgroundColor: colors.primary }]
|
|
816
864
|
}
|
|
817
865
|
)
|
|
818
866
|
);
|
|
819
867
|
}
|
|
820
|
-
var
|
|
868
|
+
var styles11 = StyleSheet.create({
|
|
821
869
|
track: {
|
|
822
870
|
height: vs(8),
|
|
823
871
|
borderRadius: 999,
|
|
@@ -837,8 +885,8 @@ function EmptyState({ icon, iconName, iconColor, title, description, action, siz
|
|
|
837
885
|
View,
|
|
838
886
|
{
|
|
839
887
|
style: [
|
|
840
|
-
|
|
841
|
-
isCompact &&
|
|
888
|
+
styles12.container,
|
|
889
|
+
isCompact && styles12.containerCompact,
|
|
842
890
|
{ borderColor: colors.border },
|
|
843
891
|
style
|
|
844
892
|
]
|
|
@@ -847,25 +895,25 @@ function EmptyState({ icon, iconName, iconColor, title, description, action, siz
|
|
|
847
895
|
View,
|
|
848
896
|
{
|
|
849
897
|
style: [
|
|
850
|
-
|
|
851
|
-
isCompact &&
|
|
898
|
+
styles12.iconWrapper,
|
|
899
|
+
isCompact && styles12.iconWrapperCompact,
|
|
852
900
|
{ backgroundColor: colors.muted }
|
|
853
901
|
]
|
|
854
902
|
},
|
|
855
903
|
effectiveIcon
|
|
856
904
|
) : null,
|
|
857
|
-
/* @__PURE__ */ React25.createElement(View, { style:
|
|
905
|
+
/* @__PURE__ */ React25.createElement(View, { style: styles12.textWrapper }, /* @__PURE__ */ React25.createElement(
|
|
858
906
|
Text,
|
|
859
907
|
{
|
|
860
|
-
style: [
|
|
908
|
+
style: [styles12.title, isCompact && styles12.titleCompact, { color: colors.foreground }],
|
|
861
909
|
allowFontScaling: true
|
|
862
910
|
},
|
|
863
911
|
title
|
|
864
|
-
), description && !isCompact ? /* @__PURE__ */ React25.createElement(Text, { style: [
|
|
865
|
-
action && !isCompact ? /* @__PURE__ */ React25.createElement(View, { style:
|
|
912
|
+
), description && !isCompact ? /* @__PURE__ */ React25.createElement(Text, { style: [styles12.description, { color: colors.mutedForeground }], allowFontScaling: true }, description) : null),
|
|
913
|
+
action && !isCompact ? /* @__PURE__ */ React25.createElement(View, { style: styles12.action }, action) : null
|
|
866
914
|
);
|
|
867
915
|
}
|
|
868
|
-
var
|
|
916
|
+
var styles12 = StyleSheet.create({
|
|
869
917
|
container: {
|
|
870
918
|
alignItems: "center",
|
|
871
919
|
justifyContent: "center",
|
|
@@ -897,14 +945,15 @@ var styles11 = StyleSheet.create({
|
|
|
897
945
|
maxWidth: s(320)
|
|
898
946
|
},
|
|
899
947
|
title: {
|
|
948
|
+
fontFamily: "Poppins-Medium",
|
|
900
949
|
fontSize: ms(18),
|
|
901
|
-
fontWeight: "500",
|
|
902
950
|
textAlign: "center"
|
|
903
951
|
},
|
|
904
952
|
titleCompact: {
|
|
905
953
|
fontSize: ms(15)
|
|
906
954
|
},
|
|
907
955
|
description: {
|
|
956
|
+
fontFamily: "Poppins-Regular",
|
|
908
957
|
fontSize: ms(14),
|
|
909
958
|
lineHeight: mvs(20),
|
|
910
959
|
textAlign: "center"
|
|
@@ -927,14 +976,14 @@ function Textarea({
|
|
|
927
976
|
}) {
|
|
928
977
|
const { colors } = useTheme();
|
|
929
978
|
const [focused, setFocused] = useState(false);
|
|
930
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
979
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles13.container, containerStyle] }, label ? /* @__PURE__ */ React25.createElement(Text, { style: [styles13.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, /* @__PURE__ */ React25.createElement(
|
|
931
980
|
TextInput,
|
|
932
981
|
{
|
|
933
982
|
multiline: true,
|
|
934
983
|
numberOfLines: rows,
|
|
935
984
|
textAlignVertical: "top",
|
|
936
985
|
style: [
|
|
937
|
-
|
|
986
|
+
styles13.input,
|
|
938
987
|
{
|
|
939
988
|
borderColor: error ? colors.destructive : focused ? colors.ring ?? colors.primary : colors.border,
|
|
940
989
|
color: colors.foreground,
|
|
@@ -956,24 +1005,26 @@ function Textarea({
|
|
|
956
1005
|
allowFontScaling: true,
|
|
957
1006
|
...props
|
|
958
1007
|
}
|
|
959
|
-
), error ? /* @__PURE__ */ React25.createElement(Text, { style: [
|
|
1008
|
+
), error ? /* @__PURE__ */ React25.createElement(Text, { style: [styles13.helperText, { color: colors.destructive }], allowFontScaling: true }, error) : null, !error && hint ? /* @__PURE__ */ React25.createElement(Text, { style: [styles13.helperText, { color: colors.mutedForeground }], allowFontScaling: true }, hint) : null);
|
|
960
1009
|
}
|
|
961
|
-
var
|
|
1010
|
+
var styles13 = StyleSheet.create({
|
|
962
1011
|
container: {
|
|
963
1012
|
gap: vs(8)
|
|
964
1013
|
},
|
|
965
1014
|
label: {
|
|
966
|
-
|
|
967
|
-
|
|
1015
|
+
fontFamily: "Poppins-Medium",
|
|
1016
|
+
fontSize: ms(13)
|
|
968
1017
|
},
|
|
969
1018
|
input: {
|
|
970
|
-
|
|
1019
|
+
fontFamily: "Poppins-Regular",
|
|
1020
|
+
borderWidth: 1,
|
|
971
1021
|
borderRadius: ms(8),
|
|
972
|
-
paddingHorizontal: s(
|
|
973
|
-
paddingVertical: vs(
|
|
974
|
-
fontSize: ms(
|
|
1022
|
+
paddingHorizontal: s(14),
|
|
1023
|
+
paddingVertical: vs(11),
|
|
1024
|
+
fontSize: ms(15)
|
|
975
1025
|
},
|
|
976
1026
|
helperText: {
|
|
1027
|
+
fontFamily: "Poppins-Regular",
|
|
977
1028
|
fontSize: ms(13)
|
|
978
1029
|
}
|
|
979
1030
|
});
|
|
@@ -992,12 +1043,12 @@ function Checkbox({
|
|
|
992
1043
|
Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver4, speed: 40, bounciness: 0 }).start();
|
|
993
1044
|
};
|
|
994
1045
|
const handlePressOut = () => {
|
|
995
|
-
Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver4, speed: 40, bounciness:
|
|
1046
|
+
Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver4, speed: 40, bounciness: 0 }).start();
|
|
996
1047
|
};
|
|
997
|
-
return /* @__PURE__ */ React25.createElement(
|
|
1048
|
+
return /* @__PURE__ */ React25.createElement(
|
|
998
1049
|
TouchableOpacity,
|
|
999
1050
|
{
|
|
1000
|
-
style: [
|
|
1051
|
+
style: [styles14.row, style],
|
|
1001
1052
|
onPress: () => {
|
|
1002
1053
|
selectionAsync();
|
|
1003
1054
|
onCheckedChange?.(!checked);
|
|
@@ -1009,30 +1060,31 @@ function Checkbox({
|
|
|
1009
1060
|
touchSoundDisabled: true
|
|
1010
1061
|
},
|
|
1011
1062
|
/* @__PURE__ */ React25.createElement(
|
|
1012
|
-
View,
|
|
1063
|
+
Animated.View,
|
|
1013
1064
|
{
|
|
1014
1065
|
style: [
|
|
1015
|
-
|
|
1066
|
+
styles14.box,
|
|
1016
1067
|
{
|
|
1017
1068
|
borderColor: checked ? colors.primary : colors.border,
|
|
1018
1069
|
backgroundColor: checked ? colors.primary : "transparent",
|
|
1019
|
-
opacity: disabled ? 0.45 : 1
|
|
1070
|
+
opacity: disabled ? 0.45 : 1,
|
|
1071
|
+
transform: [{ scale: scale2 }]
|
|
1020
1072
|
}
|
|
1021
1073
|
]
|
|
1022
1074
|
},
|
|
1023
|
-
checked ? /* @__PURE__ */ React25.createElement(View, { style: [
|
|
1075
|
+
checked ? /* @__PURE__ */ React25.createElement(View, { style: [styles14.checkmark, { borderColor: colors.primaryForeground }] }) : null
|
|
1024
1076
|
),
|
|
1025
1077
|
label ? /* @__PURE__ */ React25.createElement(
|
|
1026
1078
|
Text,
|
|
1027
1079
|
{
|
|
1028
|
-
style: [
|
|
1080
|
+
style: [styles14.label, { color: disabled ? colors.mutedForeground : colors.foreground }],
|
|
1029
1081
|
allowFontScaling: true
|
|
1030
1082
|
},
|
|
1031
1083
|
label
|
|
1032
1084
|
) : null
|
|
1033
|
-
)
|
|
1085
|
+
);
|
|
1034
1086
|
}
|
|
1035
|
-
var
|
|
1087
|
+
var styles14 = StyleSheet.create({
|
|
1036
1088
|
row: {
|
|
1037
1089
|
flexDirection: "row",
|
|
1038
1090
|
alignItems: "center",
|
|
@@ -1041,7 +1093,7 @@ var styles13 = StyleSheet.create({
|
|
|
1041
1093
|
box: {
|
|
1042
1094
|
width: s(24),
|
|
1043
1095
|
height: s(24),
|
|
1044
|
-
borderRadius: ms(
|
|
1096
|
+
borderRadius: ms(4),
|
|
1045
1097
|
borderWidth: 1.5,
|
|
1046
1098
|
alignItems: "center",
|
|
1047
1099
|
justifyContent: "center"
|
|
@@ -1054,15 +1106,16 @@ var styles13 = StyleSheet.create({
|
|
|
1054
1106
|
transform: [{ rotate: "-45deg" }, { translateY: -1 }]
|
|
1055
1107
|
},
|
|
1056
1108
|
label: {
|
|
1057
|
-
|
|
1058
|
-
|
|
1109
|
+
fontFamily: "Poppins-Regular",
|
|
1110
|
+
fontSize: ms(14),
|
|
1111
|
+
lineHeight: mvs(20)
|
|
1059
1112
|
}
|
|
1060
1113
|
});
|
|
1061
1114
|
var nativeDriver5 = Platform.OS !== "web";
|
|
1062
|
-
var TRACK_WIDTH = s(
|
|
1063
|
-
var TRACK_HEIGHT =
|
|
1064
|
-
var THUMB_SIZE = s(
|
|
1065
|
-
var THUMB_OFFSET = s(
|
|
1115
|
+
var TRACK_WIDTH = s(52);
|
|
1116
|
+
var TRACK_HEIGHT = s(30);
|
|
1117
|
+
var THUMB_SIZE = s(24);
|
|
1118
|
+
var THUMB_OFFSET = s(3);
|
|
1066
1119
|
var THUMB_TRAVEL = TRACK_WIDTH - THUMB_SIZE - THUMB_OFFSET * 2;
|
|
1067
1120
|
function Switch({ checked = false, onCheckedChange, disabled, style }) {
|
|
1068
1121
|
const { colors } = useTheme();
|
|
@@ -1096,20 +1149,20 @@ function Switch({ checked = false, onCheckedChange, disabled, style }) {
|
|
|
1096
1149
|
disabled,
|
|
1097
1150
|
activeOpacity: 0.8,
|
|
1098
1151
|
touchSoundDisabled: true,
|
|
1099
|
-
style:
|
|
1152
|
+
style: styles15.wrapper
|
|
1100
1153
|
},
|
|
1101
|
-
/* @__PURE__ */ React25.createElement(Animated.View, { style: [
|
|
1154
|
+
/* @__PURE__ */ React25.createElement(Animated.View, { style: [styles15.track, { backgroundColor: trackColor }] }, /* @__PURE__ */ React25.createElement(
|
|
1102
1155
|
Animated.View,
|
|
1103
1156
|
{
|
|
1104
1157
|
style: [
|
|
1105
|
-
|
|
1158
|
+
styles15.thumb,
|
|
1106
1159
|
{ backgroundColor: colors.primaryForeground, transform: [{ translateX }] }
|
|
1107
1160
|
]
|
|
1108
1161
|
}
|
|
1109
1162
|
))
|
|
1110
1163
|
));
|
|
1111
1164
|
}
|
|
1112
|
-
var
|
|
1165
|
+
var styles15 = StyleSheet.create({
|
|
1113
1166
|
wrapper: {},
|
|
1114
1167
|
track: {
|
|
1115
1168
|
width: TRACK_WIDTH,
|
|
@@ -1132,6 +1185,7 @@ var styles14 = StyleSheet.create({
|
|
|
1132
1185
|
elevation: 2
|
|
1133
1186
|
}
|
|
1134
1187
|
});
|
|
1188
|
+
var nativeDriver6 = Platform.OS !== "web";
|
|
1135
1189
|
var sizeStyles = {
|
|
1136
1190
|
sm: { paddingHorizontal: s(12), paddingVertical: vs(8), minWidth: s(40), minHeight: vs(40) },
|
|
1137
1191
|
md: { paddingHorizontal: s(16), paddingVertical: vs(12), minWidth: s(44), minHeight: vs(44) },
|
|
@@ -1167,10 +1221,10 @@ function Toggle({
|
|
|
1167
1221
|
}, [pressed, pressAnim]);
|
|
1168
1222
|
const handlePressIn = () => {
|
|
1169
1223
|
if (disabled) return;
|
|
1170
|
-
Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1224
|
+
Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver6, speed: 40, bounciness: 0 }).start();
|
|
1171
1225
|
};
|
|
1172
1226
|
const handlePressOut = () => {
|
|
1173
|
-
Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1227
|
+
Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver6, speed: 40, bounciness: 4 }).start();
|
|
1174
1228
|
};
|
|
1175
1229
|
const borderColor = pressAnim.interpolate({
|
|
1176
1230
|
inputRange: [0, 1],
|
|
@@ -1202,7 +1256,7 @@ function Toggle({
|
|
|
1202
1256
|
if (custom) return /* @__PURE__ */ React25.createElement(React25.Fragment, null, custom);
|
|
1203
1257
|
return /* @__PURE__ */ React25.createElement(FontAwesome5$1, { name: "circle", size: iconSize, color: colors.mutedForeground });
|
|
1204
1258
|
};
|
|
1205
|
-
return /* @__PURE__ */ React25.createElement(Animated.View, { style: [{ transform: [{ scale: scale2 }] }, disabled &&
|
|
1259
|
+
return /* @__PURE__ */ React25.createElement(Animated.View, { style: [{ transform: [{ scale: scale2 }] }, disabled && styles16.disabled, style] }, /* @__PURE__ */ React25.createElement(
|
|
1206
1260
|
TouchableOpacity,
|
|
1207
1261
|
{
|
|
1208
1262
|
onPress: () => {
|
|
@@ -1220,16 +1274,16 @@ function Toggle({
|
|
|
1220
1274
|
Animated.View,
|
|
1221
1275
|
{
|
|
1222
1276
|
style: [
|
|
1223
|
-
|
|
1277
|
+
styles16.base,
|
|
1224
1278
|
sizeStyles[size],
|
|
1225
1279
|
{ borderColor, backgroundColor, borderWidth: 2 }
|
|
1226
1280
|
]
|
|
1227
1281
|
},
|
|
1228
|
-
/* @__PURE__ */ React25.createElement(View, { style:
|
|
1282
|
+
/* @__PURE__ */ React25.createElement(View, { style: styles16.inner }, /* @__PURE__ */ React25.createElement(LeftIcon, null), label ? /* @__PURE__ */ React25.createElement(Animated.Text, { style: [styles16.label, { color: textColor }], allowFontScaling: true }, label) : null)
|
|
1229
1283
|
)
|
|
1230
1284
|
));
|
|
1231
1285
|
}
|
|
1232
|
-
var
|
|
1286
|
+
var styles16 = StyleSheet.create({
|
|
1233
1287
|
base: {
|
|
1234
1288
|
borderRadius: ms(8)
|
|
1235
1289
|
},
|
|
@@ -1243,11 +1297,11 @@ var styles15 = StyleSheet.create({
|
|
|
1243
1297
|
opacity: 0.45
|
|
1244
1298
|
},
|
|
1245
1299
|
label: {
|
|
1246
|
-
|
|
1247
|
-
|
|
1300
|
+
fontFamily: "Poppins-Medium",
|
|
1301
|
+
fontSize: ms(14)
|
|
1248
1302
|
}
|
|
1249
1303
|
});
|
|
1250
|
-
var
|
|
1304
|
+
var nativeDriver7 = Platform.OS !== "web";
|
|
1251
1305
|
function RadioItem({
|
|
1252
1306
|
option,
|
|
1253
1307
|
selected,
|
|
@@ -1257,15 +1311,15 @@ function RadioItem({
|
|
|
1257
1311
|
const scale2 = useRef(new Animated.Value(1)).current;
|
|
1258
1312
|
const handlePressIn = () => {
|
|
1259
1313
|
if (option.disabled) return;
|
|
1260
|
-
Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1314
|
+
Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver7, speed: 40, bounciness: 0 }).start();
|
|
1261
1315
|
};
|
|
1262
1316
|
const handlePressOut = () => {
|
|
1263
|
-
Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1317
|
+
Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver7, speed: 40, bounciness: 4 }).start();
|
|
1264
1318
|
};
|
|
1265
|
-
return /* @__PURE__ */ React25.createElement(
|
|
1319
|
+
return /* @__PURE__ */ React25.createElement(
|
|
1266
1320
|
TouchableOpacity,
|
|
1267
1321
|
{
|
|
1268
|
-
style:
|
|
1322
|
+
style: styles17.row,
|
|
1269
1323
|
onPress: () => {
|
|
1270
1324
|
if (!option.disabled) {
|
|
1271
1325
|
selectionAsync();
|
|
@@ -1279,30 +1333,31 @@ function RadioItem({
|
|
|
1279
1333
|
disabled: option.disabled
|
|
1280
1334
|
},
|
|
1281
1335
|
/* @__PURE__ */ React25.createElement(
|
|
1282
|
-
View,
|
|
1336
|
+
Animated.View,
|
|
1283
1337
|
{
|
|
1284
1338
|
style: [
|
|
1285
|
-
|
|
1339
|
+
styles17.radio,
|
|
1286
1340
|
{
|
|
1287
1341
|
borderColor: selected ? colors.primary : colors.border,
|
|
1288
|
-
opacity: option.disabled ? 0.45 : 1
|
|
1342
|
+
opacity: option.disabled ? 0.45 : 1,
|
|
1343
|
+
transform: [{ scale: scale2 }]
|
|
1289
1344
|
}
|
|
1290
1345
|
]
|
|
1291
1346
|
},
|
|
1292
|
-
selected ? /* @__PURE__ */ React25.createElement(View, { style: [
|
|
1347
|
+
selected ? /* @__PURE__ */ React25.createElement(View, { style: [styles17.dot, { backgroundColor: colors.primary }] }) : null
|
|
1293
1348
|
),
|
|
1294
1349
|
/* @__PURE__ */ React25.createElement(
|
|
1295
1350
|
Text,
|
|
1296
1351
|
{
|
|
1297
1352
|
style: [
|
|
1298
|
-
|
|
1353
|
+
styles17.label,
|
|
1299
1354
|
{ color: option.disabled ? colors.mutedForeground : colors.foreground }
|
|
1300
1355
|
],
|
|
1301
1356
|
allowFontScaling: true
|
|
1302
1357
|
},
|
|
1303
1358
|
option.label
|
|
1304
1359
|
)
|
|
1305
|
-
)
|
|
1360
|
+
);
|
|
1306
1361
|
}
|
|
1307
1362
|
function RadioGroup({
|
|
1308
1363
|
options,
|
|
@@ -1311,7 +1366,7 @@ function RadioGroup({
|
|
|
1311
1366
|
orientation = "vertical",
|
|
1312
1367
|
style
|
|
1313
1368
|
}) {
|
|
1314
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
1369
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles17.container, orientation === "horizontal" && styles17.horizontal, style] }, options.map((option) => /* @__PURE__ */ React25.createElement(
|
|
1315
1370
|
RadioItem,
|
|
1316
1371
|
{
|
|
1317
1372
|
key: option.value,
|
|
@@ -1321,7 +1376,7 @@ function RadioGroup({
|
|
|
1321
1376
|
}
|
|
1322
1377
|
)));
|
|
1323
1378
|
}
|
|
1324
|
-
var
|
|
1379
|
+
var styles17 = StyleSheet.create({
|
|
1325
1380
|
container: {
|
|
1326
1381
|
gap: vs(12)
|
|
1327
1382
|
},
|
|
@@ -1348,11 +1403,12 @@ var styles16 = StyleSheet.create({
|
|
|
1348
1403
|
borderRadius: s(5)
|
|
1349
1404
|
},
|
|
1350
1405
|
label: {
|
|
1406
|
+
fontFamily: "Poppins-Regular",
|
|
1351
1407
|
fontSize: ms(14),
|
|
1352
1408
|
lineHeight: mvs(20)
|
|
1353
1409
|
}
|
|
1354
1410
|
});
|
|
1355
|
-
var
|
|
1411
|
+
var nativeDriver8 = Platform.OS !== "web";
|
|
1356
1412
|
function TabTrigger({
|
|
1357
1413
|
tab,
|
|
1358
1414
|
isActive,
|
|
@@ -1362,15 +1418,15 @@ function TabTrigger({
|
|
|
1362
1418
|
const { colors } = useTheme();
|
|
1363
1419
|
const scale2 = useRef(new Animated.Value(1)).current;
|
|
1364
1420
|
const handlePressIn = () => {
|
|
1365
|
-
Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1421
|
+
Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver8, speed: 40, bounciness: 0 }).start();
|
|
1366
1422
|
};
|
|
1367
1423
|
const handlePressOut = () => {
|
|
1368
|
-
Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1424
|
+
Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver8, speed: 40, bounciness: 4 }).start();
|
|
1369
1425
|
};
|
|
1370
1426
|
return /* @__PURE__ */ React25.createElement(
|
|
1371
1427
|
TouchableOpacity,
|
|
1372
1428
|
{
|
|
1373
|
-
style:
|
|
1429
|
+
style: styles18.trigger,
|
|
1374
1430
|
onPress,
|
|
1375
1431
|
onPressIn: handlePressIn,
|
|
1376
1432
|
onPressOut: handlePressOut,
|
|
@@ -1378,13 +1434,13 @@ function TabTrigger({
|
|
|
1378
1434
|
activeOpacity: 1,
|
|
1379
1435
|
touchSoundDisabled: true
|
|
1380
1436
|
},
|
|
1381
|
-
/* @__PURE__ */ React25.createElement(Animated.View, { style: { transform: [{ scale: scale2 }] } }, /* @__PURE__ */ React25.createElement(View, { style:
|
|
1437
|
+
/* @__PURE__ */ React25.createElement(Animated.View, { style: { transform: [{ scale: scale2 }] } }, /* @__PURE__ */ React25.createElement(View, { style: styles18.triggerInner }, tab.icon ? typeof tab.icon === "function" ? tab.icon(isActive) : tab.icon : null, /* @__PURE__ */ React25.createElement(
|
|
1382
1438
|
Text,
|
|
1383
1439
|
{
|
|
1384
1440
|
style: [
|
|
1385
|
-
|
|
1441
|
+
styles18.triggerLabel,
|
|
1386
1442
|
{ color: isActive ? colors.foreground : colors.mutedForeground },
|
|
1387
|
-
isActive &&
|
|
1443
|
+
isActive && styles18.activeTriggerLabel
|
|
1388
1444
|
],
|
|
1389
1445
|
allowFontScaling: true
|
|
1390
1446
|
},
|
|
@@ -1433,11 +1489,11 @@ function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
|
1433
1489
|
if (!value) setInternal(v);
|
|
1434
1490
|
onValueChange?.(v);
|
|
1435
1491
|
};
|
|
1436
|
-
return /* @__PURE__ */ React25.createElement(View, { style }, /* @__PURE__ */ React25.createElement(View, { style: [
|
|
1492
|
+
return /* @__PURE__ */ React25.createElement(View, { style }, /* @__PURE__ */ React25.createElement(View, { style: [styles18.list, { backgroundColor: colors.muted }] }, /* @__PURE__ */ React25.createElement(
|
|
1437
1493
|
Animated.View,
|
|
1438
1494
|
{
|
|
1439
1495
|
style: [
|
|
1440
|
-
|
|
1496
|
+
styles18.pill,
|
|
1441
1497
|
{
|
|
1442
1498
|
backgroundColor: colors.background,
|
|
1443
1499
|
position: "absolute",
|
|
@@ -1476,7 +1532,7 @@ function TabsContent({ value, activeValue, children, style }) {
|
|
|
1476
1532
|
if (value !== activeValue) return null;
|
|
1477
1533
|
return /* @__PURE__ */ React25.createElement(View, { style }, children);
|
|
1478
1534
|
}
|
|
1479
|
-
var
|
|
1535
|
+
var styles18 = StyleSheet.create({
|
|
1480
1536
|
list: {
|
|
1481
1537
|
flexDirection: "row",
|
|
1482
1538
|
borderRadius: ms(12),
|
|
@@ -1486,9 +1542,9 @@ var styles17 = StyleSheet.create({
|
|
|
1486
1542
|
pill: {},
|
|
1487
1543
|
trigger: {
|
|
1488
1544
|
flex: 1,
|
|
1489
|
-
paddingVertical: vs(
|
|
1490
|
-
paddingHorizontal: s(
|
|
1491
|
-
borderRadius: ms(
|
|
1545
|
+
paddingVertical: vs(7),
|
|
1546
|
+
paddingHorizontal: s(10),
|
|
1547
|
+
borderRadius: ms(6),
|
|
1492
1548
|
alignItems: "center",
|
|
1493
1549
|
justifyContent: "center",
|
|
1494
1550
|
zIndex: 1
|
|
@@ -1497,19 +1553,14 @@ var styles17 = StyleSheet.create({
|
|
|
1497
1553
|
flexDirection: "row",
|
|
1498
1554
|
alignItems: "center",
|
|
1499
1555
|
justifyContent: "center",
|
|
1500
|
-
gap: s(
|
|
1501
|
-
},
|
|
1502
|
-
triggerIcon: {
|
|
1503
|
-
marginRight: s(6),
|
|
1504
|
-
alignItems: "center",
|
|
1505
|
-
justifyContent: "center"
|
|
1556
|
+
gap: s(4)
|
|
1506
1557
|
},
|
|
1507
1558
|
triggerLabel: {
|
|
1508
|
-
|
|
1509
|
-
|
|
1559
|
+
fontFamily: "Poppins-Regular",
|
|
1560
|
+
fontSize: ms(13)
|
|
1510
1561
|
},
|
|
1511
1562
|
activeTriggerLabel: {
|
|
1512
|
-
|
|
1563
|
+
fontFamily: "Poppins-Medium"
|
|
1513
1564
|
}
|
|
1514
1565
|
});
|
|
1515
1566
|
function AccordionItemComponent({
|
|
@@ -1542,21 +1593,21 @@ function AccordionItemComponent({
|
|
|
1542
1593
|
const rotationStyle = useAnimatedStyle(() => ({
|
|
1543
1594
|
transform: [{ rotate: `${derivedRotation.value * 180}deg` }]
|
|
1544
1595
|
}));
|
|
1545
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
1596
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles19.item, { backgroundColor: colors.card, borderColor: colors.border }] }, /* @__PURE__ */ React25.createElement(
|
|
1546
1597
|
Pressable,
|
|
1547
1598
|
{
|
|
1548
|
-
style: ({ pressed }) => [
|
|
1599
|
+
style: ({ pressed }) => [styles19.trigger, { opacity: pressed ? 0.6 : 1 }],
|
|
1549
1600
|
onPress: () => {
|
|
1550
1601
|
selectionAsync();
|
|
1551
1602
|
onToggle();
|
|
1552
1603
|
}
|
|
1553
1604
|
},
|
|
1554
|
-
/* @__PURE__ */ React25.createElement(Text, { style: [
|
|
1555
|
-
/* @__PURE__ */ React25.createElement(Animated11.View, { style: [
|
|
1605
|
+
/* @__PURE__ */ React25.createElement(Text, { style: [styles19.triggerText, { color: colors.foreground }], allowFontScaling: true }, item.trigger),
|
|
1606
|
+
/* @__PURE__ */ React25.createElement(Animated11.View, { style: [styles19.chevron, rotationStyle] }, /* @__PURE__ */ React25.createElement(Entypo$1, { name: "chevron-down", size: 18, color: colors.mutedForeground }))
|
|
1556
1607
|
), /* @__PURE__ */ React25.createElement(Animated11.View, { style: bodyStyle }, /* @__PURE__ */ React25.createElement(
|
|
1557
1608
|
View,
|
|
1558
1609
|
{
|
|
1559
|
-
style:
|
|
1610
|
+
style: styles19.content,
|
|
1560
1611
|
onLayout: (e) => {
|
|
1561
1612
|
height.value = e.nativeEvent.layout.height;
|
|
1562
1613
|
}
|
|
@@ -1578,7 +1629,7 @@ function Accordion({ items, type = "single", defaultValue, style }) {
|
|
|
1578
1629
|
);
|
|
1579
1630
|
}
|
|
1580
1631
|
};
|
|
1581
|
-
return /* @__PURE__ */ React25.createElement(View, { style }, items.map((item) => /* @__PURE__ */ React25.createElement(
|
|
1632
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles19.list, style] }, items.map((item) => /* @__PURE__ */ React25.createElement(
|
|
1582
1633
|
AccordionItemComponent,
|
|
1583
1634
|
{
|
|
1584
1635
|
key: item.value,
|
|
@@ -1588,19 +1639,25 @@ function Accordion({ items, type = "single", defaultValue, style }) {
|
|
|
1588
1639
|
}
|
|
1589
1640
|
)));
|
|
1590
1641
|
}
|
|
1591
|
-
var
|
|
1642
|
+
var styles19 = StyleSheet.create({
|
|
1643
|
+
list: {
|
|
1644
|
+
gap: s(6)
|
|
1645
|
+
},
|
|
1592
1646
|
item: {
|
|
1593
|
-
|
|
1647
|
+
borderWidth: 1,
|
|
1648
|
+
borderRadius: ms(10),
|
|
1649
|
+
overflow: "hidden"
|
|
1594
1650
|
},
|
|
1595
1651
|
trigger: {
|
|
1596
1652
|
flexDirection: "row",
|
|
1597
1653
|
justifyContent: "space-between",
|
|
1598
1654
|
alignItems: "center",
|
|
1599
|
-
|
|
1655
|
+
paddingHorizontal: s(14),
|
|
1656
|
+
paddingVertical: vs(12)
|
|
1600
1657
|
},
|
|
1601
1658
|
triggerText: {
|
|
1602
|
-
|
|
1603
|
-
|
|
1659
|
+
fontFamily: "Poppins-Medium",
|
|
1660
|
+
fontSize: ms(14),
|
|
1604
1661
|
flex: 1
|
|
1605
1662
|
},
|
|
1606
1663
|
chevron: {
|
|
@@ -1609,7 +1666,8 @@ var styles18 = StyleSheet.create({
|
|
|
1609
1666
|
// position:'absolute' is the key — the inner View escapes the animated wrapper's
|
|
1610
1667
|
// clipped height so onLayout always reports the true content height.
|
|
1611
1668
|
content: {
|
|
1612
|
-
|
|
1669
|
+
paddingHorizontal: s(14),
|
|
1670
|
+
paddingBottom: vs(12),
|
|
1613
1671
|
position: "absolute",
|
|
1614
1672
|
width: "100%"
|
|
1615
1673
|
}
|
|
@@ -1637,7 +1695,7 @@ function Slider({
|
|
|
1637
1695
|
}
|
|
1638
1696
|
onValueChange?.(v);
|
|
1639
1697
|
};
|
|
1640
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
1698
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles20.wrapper, style], accessibilityLabel }, label || showValue ? /* @__PURE__ */ React25.createElement(View, { style: styles20.header }, label ? /* @__PURE__ */ React25.createElement(Text, { style: [styles20.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, showValue ? /* @__PURE__ */ React25.createElement(Text, { style: [styles20.valueText, { color: colors.mutedForeground }], allowFontScaling: true }, formatValue2(value)) : null) : null, /* @__PURE__ */ React25.createElement(View, { style: disabled ? styles20.disabled : void 0 }, /* @__PURE__ */ React25.createElement(
|
|
1641
1699
|
RNSlider,
|
|
1642
1700
|
{
|
|
1643
1701
|
value,
|
|
@@ -1650,12 +1708,12 @@ function Slider({
|
|
|
1650
1708
|
minimumTrackTintColor: colors.primary,
|
|
1651
1709
|
maximumTrackTintColor: colors.muted,
|
|
1652
1710
|
thumbTintColor: colors.primary,
|
|
1653
|
-
style:
|
|
1711
|
+
style: styles20.slider,
|
|
1654
1712
|
accessibilityLabel
|
|
1655
1713
|
}
|
|
1656
1714
|
)));
|
|
1657
1715
|
}
|
|
1658
|
-
var
|
|
1716
|
+
var styles20 = StyleSheet.create({
|
|
1659
1717
|
wrapper: {
|
|
1660
1718
|
gap: vs(8)
|
|
1661
1719
|
},
|
|
@@ -1665,16 +1723,16 @@ var styles19 = StyleSheet.create({
|
|
|
1665
1723
|
alignItems: "center"
|
|
1666
1724
|
},
|
|
1667
1725
|
label: {
|
|
1668
|
-
|
|
1669
|
-
|
|
1726
|
+
fontFamily: "Poppins-Medium",
|
|
1727
|
+
fontSize: ms(15)
|
|
1670
1728
|
},
|
|
1671
1729
|
valueText: {
|
|
1672
|
-
|
|
1673
|
-
|
|
1730
|
+
fontFamily: "Poppins-Medium",
|
|
1731
|
+
fontSize: ms(14)
|
|
1674
1732
|
},
|
|
1675
1733
|
slider: {
|
|
1676
1734
|
width: "100%",
|
|
1677
|
-
height: vs(
|
|
1735
|
+
height: vs(60)
|
|
1678
1736
|
},
|
|
1679
1737
|
disabled: {
|
|
1680
1738
|
opacity: 0.45
|
|
@@ -1715,14 +1773,14 @@ function Sheet({
|
|
|
1715
1773
|
snapPoints,
|
|
1716
1774
|
onDismiss: onClose,
|
|
1717
1775
|
backdropComponent: renderBackdrop,
|
|
1718
|
-
backgroundStyle: [
|
|
1719
|
-
handleIndicatorStyle: [
|
|
1776
|
+
backgroundStyle: [styles21.background, { backgroundColor: colors.card }],
|
|
1777
|
+
handleIndicatorStyle: [styles21.handle, { backgroundColor: colors.border }],
|
|
1720
1778
|
enablePanDownToClose: true
|
|
1721
1779
|
},
|
|
1722
|
-
/* @__PURE__ */ React25.createElement(BottomSheetView, { style: [
|
|
1780
|
+
/* @__PURE__ */ React25.createElement(BottomSheetView, { style: [styles21.content, style] }, title || description ? /* @__PURE__ */ React25.createElement(View, { style: styles21.header }, title ? /* @__PURE__ */ React25.createElement(Text, { style: [styles21.title, { color: colors.cardForeground }], allowFontScaling: true }, title) : null, description ? /* @__PURE__ */ React25.createElement(Text, { style: [styles21.description, { color: colors.mutedForeground }], allowFontScaling: true }, description) : null) : null, children)
|
|
1723
1781
|
);
|
|
1724
1782
|
}
|
|
1725
|
-
var
|
|
1783
|
+
var styles21 = StyleSheet.create({
|
|
1726
1784
|
background: {
|
|
1727
1785
|
borderTopLeftRadius: ms(16),
|
|
1728
1786
|
borderTopRightRadius: ms(16)
|
|
@@ -1741,10 +1799,11 @@ var styles20 = StyleSheet.create({
|
|
|
1741
1799
|
marginBottom: vs(16)
|
|
1742
1800
|
},
|
|
1743
1801
|
title: {
|
|
1744
|
-
|
|
1745
|
-
|
|
1802
|
+
fontFamily: "Poppins-SemiBold",
|
|
1803
|
+
fontSize: ms(18)
|
|
1746
1804
|
},
|
|
1747
1805
|
description: {
|
|
1806
|
+
fontFamily: "Poppins-Regular",
|
|
1748
1807
|
fontSize: ms(14),
|
|
1749
1808
|
lineHeight: mvs(20)
|
|
1750
1809
|
}
|
|
@@ -1752,6 +1811,7 @@ var styles20 = StyleSheet.create({
|
|
|
1752
1811
|
var isIOS = Platform.OS === "ios";
|
|
1753
1812
|
var isAndroid = Platform.OS === "android";
|
|
1754
1813
|
var isWeb2 = Platform.OS === "web";
|
|
1814
|
+
var nativeDriver9 = Platform.OS !== "web";
|
|
1755
1815
|
function Select({
|
|
1756
1816
|
options,
|
|
1757
1817
|
value,
|
|
@@ -1770,10 +1830,10 @@ function Select({
|
|
|
1770
1830
|
const selected = options.find((o) => o.value === value);
|
|
1771
1831
|
const handlePressIn = () => {
|
|
1772
1832
|
if (disabled) return;
|
|
1773
|
-
Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1833
|
+
Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver9, speed: 40, bounciness: 0 }).start();
|
|
1774
1834
|
};
|
|
1775
1835
|
const handlePressOut = () => {
|
|
1776
|
-
Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1836
|
+
Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver9, speed: 40, bounciness: 4 }).start();
|
|
1777
1837
|
};
|
|
1778
1838
|
const handleOpen = () => {
|
|
1779
1839
|
if (disabled) return;
|
|
@@ -1795,11 +1855,11 @@ function Select({
|
|
|
1795
1855
|
}
|
|
1796
1856
|
setPickerVisible(false);
|
|
1797
1857
|
};
|
|
1798
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
1858
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles22.container, style] }, label ? /* @__PURE__ */ React25.createElement(Text, { style: [styles22.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, !isWeb2 ? /* @__PURE__ */ React25.createElement(Animated.View, { style: { transform: [{ scale: scale2 }], opacity: disabled ? 0.45 : 1 } }, /* @__PURE__ */ React25.createElement(
|
|
1799
1859
|
TouchableOpacity,
|
|
1800
1860
|
{
|
|
1801
1861
|
style: [
|
|
1802
|
-
|
|
1862
|
+
styles22.trigger,
|
|
1803
1863
|
{
|
|
1804
1864
|
borderColor: error ? colors.destructive : colors.border,
|
|
1805
1865
|
backgroundColor: colors.background
|
|
@@ -1815,7 +1875,7 @@ function Select({
|
|
|
1815
1875
|
Text,
|
|
1816
1876
|
{
|
|
1817
1877
|
style: [
|
|
1818
|
-
|
|
1878
|
+
styles22.triggerText,
|
|
1819
1879
|
{ color: selected ? colors.foreground : colors.mutedForeground }
|
|
1820
1880
|
],
|
|
1821
1881
|
numberOfLines: 1,
|
|
@@ -1832,8 +1892,8 @@ function Select({
|
|
|
1832
1892
|
animationType: "slide",
|
|
1833
1893
|
onRequestClose: handleDismiss
|
|
1834
1894
|
},
|
|
1835
|
-
/* @__PURE__ */ React25.createElement(TouchableOpacity, { style:
|
|
1836
|
-
/* @__PURE__ */ React25.createElement(View, { style: [
|
|
1895
|
+
/* @__PURE__ */ React25.createElement(TouchableOpacity, { style: styles22.iosBackdrop, activeOpacity: 1, onPress: handleDismiss }),
|
|
1896
|
+
/* @__PURE__ */ React25.createElement(View, { style: [styles22.iosSheet, { backgroundColor: colors.card }] }, /* @__PURE__ */ React25.createElement(View, { style: [styles22.iosToolbar, { borderBottomColor: colors.border }] }, label ? /* @__PURE__ */ React25.createElement(Text, { style: [styles22.iosToolbarTitle, { color: colors.foreground }], allowFontScaling: true }, label) : /* @__PURE__ */ React25.createElement(View, null), /* @__PURE__ */ React25.createElement(TouchableOpacity, { onPress: handleConfirm, style: styles22.iosDoneBtn, hitSlop: { top: 8, bottom: 8, left: 8, right: 8 } }, /* @__PURE__ */ React25.createElement(Text, { style: [styles22.iosDoneBtnText, { color: colors.primary }], allowFontScaling: true }, "Done"))), /* @__PURE__ */ React25.createElement(
|
|
1837
1897
|
Picker,
|
|
1838
1898
|
{
|
|
1839
1899
|
selectedValue: pendingValue ?? "",
|
|
@@ -1866,7 +1926,7 @@ function Select({
|
|
|
1866
1926
|
mode: "dialog",
|
|
1867
1927
|
enabled: !disabled,
|
|
1868
1928
|
prompt: label,
|
|
1869
|
-
style:
|
|
1929
|
+
style: styles22.androidHiddenPicker
|
|
1870
1930
|
},
|
|
1871
1931
|
!value ? /* @__PURE__ */ React25.createElement(Picker.Item, { label: placeholder, value: "", enabled: false }) : null,
|
|
1872
1932
|
options.map((o) => /* @__PURE__ */ React25.createElement(
|
|
@@ -1889,7 +1949,7 @@ function Select({
|
|
|
1889
1949
|
},
|
|
1890
1950
|
enabled: !disabled,
|
|
1891
1951
|
style: [
|
|
1892
|
-
|
|
1952
|
+
styles22.webPicker,
|
|
1893
1953
|
{
|
|
1894
1954
|
borderColor: error ? colors.destructive : colors.border,
|
|
1895
1955
|
color: selected ? colors.foreground : colors.mutedForeground,
|
|
@@ -1908,38 +1968,35 @@ function Select({
|
|
|
1908
1968
|
enabled: !o.disabled
|
|
1909
1969
|
}
|
|
1910
1970
|
))
|
|
1911
|
-
) : null, error ? /* @__PURE__ */ React25.createElement(Text, { style: [
|
|
1971
|
+
) : null, error ? /* @__PURE__ */ React25.createElement(Text, { style: [styles22.helperText, { color: colors.destructive }], allowFontScaling: true }, error) : null);
|
|
1912
1972
|
}
|
|
1913
|
-
var
|
|
1973
|
+
var styles22 = StyleSheet.create({
|
|
1914
1974
|
container: {
|
|
1915
1975
|
gap: vs(8)
|
|
1916
1976
|
},
|
|
1917
1977
|
label: {
|
|
1918
|
-
|
|
1919
|
-
|
|
1978
|
+
fontFamily: "Poppins-Medium",
|
|
1979
|
+
fontSize: ms(13)
|
|
1920
1980
|
},
|
|
1921
1981
|
trigger: {
|
|
1922
1982
|
flexDirection: "row",
|
|
1923
1983
|
alignItems: "center",
|
|
1924
1984
|
justifyContent: "space-between",
|
|
1925
|
-
borderWidth: 1
|
|
1985
|
+
borderWidth: 1,
|
|
1926
1986
|
borderRadius: ms(8),
|
|
1927
|
-
paddingHorizontal: s(
|
|
1928
|
-
paddingVertical: vs(
|
|
1929
|
-
shadowColor: "#000",
|
|
1930
|
-
shadowOffset: { width: 0, height: 1 },
|
|
1931
|
-
shadowOpacity: 0.04,
|
|
1932
|
-
shadowRadius: 2,
|
|
1933
|
-
elevation: 1
|
|
1987
|
+
paddingHorizontal: s(14),
|
|
1988
|
+
paddingVertical: vs(11)
|
|
1934
1989
|
},
|
|
1935
1990
|
triggerText: {
|
|
1936
|
-
|
|
1991
|
+
fontFamily: "Poppins-Regular",
|
|
1992
|
+
fontSize: ms(15),
|
|
1937
1993
|
flex: 1
|
|
1938
1994
|
},
|
|
1939
1995
|
chevron: {
|
|
1940
1996
|
marginLeft: s(8)
|
|
1941
1997
|
},
|
|
1942
1998
|
helperText: {
|
|
1999
|
+
fontFamily: "Poppins-Regular",
|
|
1943
2000
|
fontSize: ms(13)
|
|
1944
2001
|
},
|
|
1945
2002
|
iosBackdrop: {
|
|
@@ -1960,15 +2017,15 @@ var styles21 = StyleSheet.create({
|
|
|
1960
2017
|
borderBottomWidth: 1
|
|
1961
2018
|
},
|
|
1962
2019
|
iosToolbarTitle: {
|
|
1963
|
-
|
|
1964
|
-
|
|
2020
|
+
fontFamily: "Poppins-SemiBold",
|
|
2021
|
+
fontSize: ms(17)
|
|
1965
2022
|
},
|
|
1966
2023
|
iosDoneBtn: {
|
|
1967
2024
|
padding: s(4)
|
|
1968
2025
|
},
|
|
1969
2026
|
iosDoneBtnText: {
|
|
1970
|
-
|
|
1971
|
-
|
|
2027
|
+
fontFamily: "Poppins-SemiBold",
|
|
2028
|
+
fontSize: ms(17)
|
|
1972
2029
|
},
|
|
1973
2030
|
androidHiddenPicker: {
|
|
1974
2031
|
height: 0,
|
|
@@ -1976,11 +2033,11 @@ var styles21 = StyleSheet.create({
|
|
|
1976
2033
|
position: "absolute"
|
|
1977
2034
|
},
|
|
1978
2035
|
webPicker: {
|
|
1979
|
-
borderWidth: 1
|
|
2036
|
+
borderWidth: 1,
|
|
1980
2037
|
borderRadius: ms(8),
|
|
1981
|
-
paddingHorizontal: s(
|
|
1982
|
-
paddingVertical: vs(
|
|
1983
|
-
fontSize: ms(
|
|
2038
|
+
paddingHorizontal: s(14),
|
|
2039
|
+
paddingVertical: vs(11),
|
|
2040
|
+
fontSize: ms(15)
|
|
1984
2041
|
}
|
|
1985
2042
|
});
|
|
1986
2043
|
var ToastContext = createContext({
|
|
@@ -2028,19 +2085,21 @@ function ToastNotification({ item, onDismiss }) {
|
|
|
2028
2085
|
opacity: opacity.value,
|
|
2029
2086
|
transform: [{ translateY: translateY.value }, { translateX: translateX.value }]
|
|
2030
2087
|
}));
|
|
2088
|
+
const variant = item.variant ?? "default";
|
|
2031
2089
|
const bgColor = {
|
|
2032
2090
|
default: colors.foreground,
|
|
2033
|
-
destructive: colors.
|
|
2034
|
-
success: colors.
|
|
2035
|
-
}[
|
|
2091
|
+
destructive: colors.destructiveBorder,
|
|
2092
|
+
success: colors.successBorder
|
|
2093
|
+
}[variant];
|
|
2036
2094
|
const textColor = {
|
|
2037
2095
|
default: colors.background,
|
|
2038
|
-
destructive:
|
|
2039
|
-
success:
|
|
2040
|
-
}[
|
|
2041
|
-
const
|
|
2096
|
+
destructive: "#991b1b",
|
|
2097
|
+
success: "#166534"
|
|
2098
|
+
}[variant];
|
|
2099
|
+
const borderColor = textColor;
|
|
2100
|
+
const defaultIcon = variant === "success" ? /* @__PURE__ */ React25.createElement(FontAwesome5$1, { name: "check-circle", size: 18, color: textColor }) : variant === "destructive" ? /* @__PURE__ */ React25.createElement(AntDesign$1, { name: "exclamation-circle", size: 18, color: textColor }) : /* @__PURE__ */ React25.createElement(Entypo$1, { name: "info-with-circle", size: 18, color: textColor });
|
|
2042
2101
|
const leftIcon = item.iconName ? renderIcon(item.iconName, 22, item.iconColor ?? textColor) : item.icon ?? defaultIcon;
|
|
2043
|
-
return /* @__PURE__ */ React25.createElement(GestureDetector, { gesture: panGesture }, /* @__PURE__ */ React25.createElement(Animated11.View, { style: [
|
|
2102
|
+
return /* @__PURE__ */ React25.createElement(GestureDetector, { gesture: panGesture }, /* @__PURE__ */ React25.createElement(Animated11.View, { style: [styles23.toast, { backgroundColor: bgColor, borderColor }, animatedStyle] }, /* @__PURE__ */ React25.createElement(View, { style: styles23.leftIconContainer }, leftIcon), /* @__PURE__ */ React25.createElement(View, { style: styles23.toastContent }, item.title ? /* @__PURE__ */ React25.createElement(Text, { style: [styles23.toastTitle, { color: textColor }], allowFontScaling: true }, item.title) : null, item.description ? /* @__PURE__ */ React25.createElement(Text, { style: [styles23.toastDescription, { color: textColor, opacity: 0.85 }], allowFontScaling: true }, item.description) : null), /* @__PURE__ */ React25.createElement(TouchableOpacity, { onPress: onDismiss, style: styles23.dismissButton, touchSoundDisabled: true }, /* @__PURE__ */ React25.createElement(AntDesign$1, { name: "close-circle", size: 18, color: textColor }))));
|
|
2044
2103
|
}
|
|
2045
2104
|
function ToastProvider({ children }) {
|
|
2046
2105
|
const [toasts, setToasts] = useState([]);
|
|
@@ -2059,9 +2118,9 @@ function ToastProvider({ children }) {
|
|
|
2059
2118
|
const dismiss = useCallback((id) => {
|
|
2060
2119
|
setToasts((prev) => prev.filter((t) => t.id !== id));
|
|
2061
2120
|
}, []);
|
|
2062
|
-
return /* @__PURE__ */ React25.createElement(ToastContext.Provider, { value: { toast, dismiss } }, children, /* @__PURE__ */ React25.createElement(View, { style: [
|
|
2121
|
+
return /* @__PURE__ */ React25.createElement(ToastContext.Provider, { value: { toast, dismiss } }, children, /* @__PURE__ */ React25.createElement(View, { style: [styles23.container, Platform.OS === "web" && styles23.containerWeb, { top: insets.top + 8 }], pointerEvents: "box-none" }, toasts.map((item) => /* @__PURE__ */ React25.createElement(ToastNotification, { key: item.id, item, onDismiss: () => dismiss(item.id) }))));
|
|
2063
2122
|
}
|
|
2064
|
-
var
|
|
2123
|
+
var styles23 = StyleSheet.create({
|
|
2065
2124
|
container: {
|
|
2066
2125
|
position: "absolute",
|
|
2067
2126
|
left: s(16),
|
|
@@ -2078,30 +2137,32 @@ var styles22 = StyleSheet.create({
|
|
|
2078
2137
|
toast: {
|
|
2079
2138
|
flexDirection: "row",
|
|
2080
2139
|
alignItems: "center",
|
|
2081
|
-
borderRadius: ms(
|
|
2082
|
-
|
|
2083
|
-
|
|
2140
|
+
borderRadius: ms(12),
|
|
2141
|
+
borderWidth: 1,
|
|
2142
|
+
paddingHorizontal: s(14),
|
|
2143
|
+
paddingVertical: vs(12),
|
|
2084
2144
|
shadowColor: "#000",
|
|
2085
|
-
shadowOffset: { width: 0, height:
|
|
2086
|
-
shadowOpacity: 0.
|
|
2145
|
+
shadowOffset: { width: 0, height: 3 },
|
|
2146
|
+
shadowOpacity: 0.1,
|
|
2087
2147
|
shadowRadius: 8,
|
|
2088
|
-
elevation:
|
|
2148
|
+
elevation: 5
|
|
2089
2149
|
},
|
|
2090
2150
|
toastContent: {
|
|
2091
2151
|
flex: 1,
|
|
2092
2152
|
gap: vs(4)
|
|
2093
2153
|
},
|
|
2094
2154
|
leftIconContainer: {
|
|
2095
|
-
width: s(
|
|
2155
|
+
width: s(28),
|
|
2096
2156
|
alignItems: "center",
|
|
2097
2157
|
justifyContent: "center",
|
|
2098
|
-
marginRight: s(
|
|
2158
|
+
marginRight: s(10)
|
|
2099
2159
|
},
|
|
2100
2160
|
toastTitle: {
|
|
2101
|
-
|
|
2102
|
-
|
|
2161
|
+
fontFamily: "Poppins-SemiBold",
|
|
2162
|
+
fontSize: ms(15)
|
|
2103
2163
|
},
|
|
2104
2164
|
toastDescription: {
|
|
2165
|
+
fontFamily: "Poppins-Regular",
|
|
2105
2166
|
fontSize: ms(14)
|
|
2106
2167
|
},
|
|
2107
2168
|
dismissButton: {
|
|
@@ -2129,28 +2190,33 @@ function CurrencyInput({
|
|
|
2129
2190
|
containerStyle,
|
|
2130
2191
|
style
|
|
2131
2192
|
}) {
|
|
2193
|
+
const { colors } = useTheme();
|
|
2132
2194
|
const handleChange = (text) => {
|
|
2133
2195
|
const withoutPrefix = prefix && text.startsWith(prefix) ? text.slice(prefix.length) : text;
|
|
2134
2196
|
const formatted = formatCurrency(withoutPrefix, thousandsSeparator);
|
|
2135
|
-
const display = formatted
|
|
2197
|
+
const display = formatted;
|
|
2136
2198
|
onChangeText?.(display);
|
|
2137
2199
|
const separatorRegex = new RegExp(`\\${thousandsSeparator}`, "g");
|
|
2138
2200
|
const raw = parseFloat(formatted.replace(separatorRegex, "") || "0");
|
|
2139
2201
|
onChangeValue?.(isNaN(raw) ? 0 : raw);
|
|
2140
2202
|
};
|
|
2141
|
-
const inputStyle = size === "large" ? { fontSize: ms(36) } : {};
|
|
2203
|
+
const inputStyle = size === "large" ? { fontFamily: "Poppins-Regular", fontSize: ms(36) } : { fontFamily: "Poppins-Regular" };
|
|
2204
|
+
const dollarIcon = renderIcon("dollar-sign", size === "large" ? 24 : 16, colors.mutedForeground);
|
|
2205
|
+
const displayValue = value && prefix && value.startsWith(prefix) ? value.slice(prefix.length) : value;
|
|
2142
2206
|
return /* @__PURE__ */ React25.createElement(
|
|
2143
2207
|
Input,
|
|
2144
2208
|
{
|
|
2145
|
-
value,
|
|
2209
|
+
value: displayValue,
|
|
2146
2210
|
onChangeText: handleChange,
|
|
2147
2211
|
keyboardType: "numeric",
|
|
2148
2212
|
label,
|
|
2149
2213
|
error,
|
|
2150
2214
|
hint,
|
|
2151
|
-
placeholder: placeholder ??
|
|
2215
|
+
placeholder: placeholder ?? "0",
|
|
2152
2216
|
editable,
|
|
2217
|
+
prefix: dollarIcon,
|
|
2153
2218
|
containerStyle,
|
|
2219
|
+
inputWrapperStyle: size === "large" ? { paddingVertical: 10 } : void 0,
|
|
2154
2220
|
style: [inputStyle, style]
|
|
2155
2221
|
}
|
|
2156
2222
|
);
|
|
@@ -2170,16 +2236,16 @@ function formatValue(value, prefix, showDecimals) {
|
|
|
2170
2236
|
function CurrencyDisplay({ value, prefix = "$", showDecimals = false, textColor, style }) {
|
|
2171
2237
|
const { colors } = useTheme();
|
|
2172
2238
|
const formatted = formatValue(value, prefix, showDecimals);
|
|
2173
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
2239
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles24.container, style] }, /* @__PURE__ */ React25.createElement(Text, { style: [styles24.amount, { color: textColor ?? colors.foreground }], allowFontScaling: true }, formatted));
|
|
2174
2240
|
}
|
|
2175
|
-
var
|
|
2241
|
+
var styles24 = StyleSheet.create({
|
|
2176
2242
|
container: {},
|
|
2177
2243
|
amount: {
|
|
2178
|
-
|
|
2179
|
-
|
|
2244
|
+
fontFamily: "Poppins-Bold",
|
|
2245
|
+
fontSize: ms(56)
|
|
2180
2246
|
}
|
|
2181
2247
|
});
|
|
2182
|
-
var
|
|
2248
|
+
var nativeDriver10 = Platform.OS !== "web";
|
|
2183
2249
|
function ListItem({
|
|
2184
2250
|
leftRender,
|
|
2185
2251
|
rightRender,
|
|
@@ -2208,7 +2274,7 @@ function ListItem({
|
|
|
2208
2274
|
if (!onPress || disabled) return;
|
|
2209
2275
|
Animated.spring(scale2, {
|
|
2210
2276
|
toValue: 0.97,
|
|
2211
|
-
useNativeDriver:
|
|
2277
|
+
useNativeDriver: nativeDriver10,
|
|
2212
2278
|
speed: 40,
|
|
2213
2279
|
bounciness: 0
|
|
2214
2280
|
}).start();
|
|
@@ -2216,7 +2282,7 @@ function ListItem({
|
|
|
2216
2282
|
const handlePressOut = () => {
|
|
2217
2283
|
Animated.spring(scale2, {
|
|
2218
2284
|
toValue: 1,
|
|
2219
|
-
useNativeDriver:
|
|
2285
|
+
useNativeDriver: nativeDriver10,
|
|
2220
2286
|
speed: 40,
|
|
2221
2287
|
bounciness: 4
|
|
2222
2288
|
}).start();
|
|
@@ -2238,10 +2304,10 @@ function ListItem({
|
|
|
2238
2304
|
shadowRadius: 6,
|
|
2239
2305
|
elevation: 2
|
|
2240
2306
|
} : {};
|
|
2241
|
-
return /* @__PURE__ */ React25.createElement(Animated.View, { style: [{ transform: [{ scale: scale2 }] }, disabled &&
|
|
2307
|
+
return /* @__PURE__ */ React25.createElement(Animated.View, { style: [{ transform: [{ scale: scale2 }] }, disabled && styles25.disabled] }, /* @__PURE__ */ React25.createElement(
|
|
2242
2308
|
TouchableOpacity,
|
|
2243
2309
|
{
|
|
2244
|
-
style: [
|
|
2310
|
+
style: [styles25.container, cardStyle, style],
|
|
2245
2311
|
onPress: onPress ? handlePress : void 0,
|
|
2246
2312
|
onPressIn: handlePressIn,
|
|
2247
2313
|
onPressOut: handlePressOut,
|
|
@@ -2249,11 +2315,11 @@ function ListItem({
|
|
|
2249
2315
|
activeOpacity: 1,
|
|
2250
2316
|
touchSoundDisabled: true
|
|
2251
2317
|
},
|
|
2252
|
-
effectiveLeft ? /* @__PURE__ */ React25.createElement(View, { style:
|
|
2253
|
-
/* @__PURE__ */ React25.createElement(View, { style:
|
|
2318
|
+
effectiveLeft ? /* @__PURE__ */ React25.createElement(View, { style: styles25.leftContainer }, effectiveLeft) : null,
|
|
2319
|
+
/* @__PURE__ */ React25.createElement(View, { style: styles25.content }, /* @__PURE__ */ React25.createElement(
|
|
2254
2320
|
Text,
|
|
2255
2321
|
{
|
|
2256
|
-
style: [
|
|
2322
|
+
style: [styles25.title, { color: colors.foreground }, titleStyle],
|
|
2257
2323
|
numberOfLines: 2,
|
|
2258
2324
|
allowFontScaling: true
|
|
2259
2325
|
},
|
|
@@ -2261,7 +2327,7 @@ function ListItem({
|
|
|
2261
2327
|
), subtitle ? /* @__PURE__ */ React25.createElement(
|
|
2262
2328
|
Text,
|
|
2263
2329
|
{
|
|
2264
|
-
style: [
|
|
2330
|
+
style: [styles25.subtitle, { color: colors.mutedForeground }, subtitleStyle],
|
|
2265
2331
|
numberOfLines: 2,
|
|
2266
2332
|
allowFontScaling: true
|
|
2267
2333
|
},
|
|
@@ -2269,16 +2335,16 @@ function ListItem({
|
|
|
2269
2335
|
) : null, caption ? /* @__PURE__ */ React25.createElement(
|
|
2270
2336
|
Text,
|
|
2271
2337
|
{
|
|
2272
|
-
style: [
|
|
2338
|
+
style: [styles25.caption, { color: colors.mutedForeground }, captionStyle],
|
|
2273
2339
|
numberOfLines: 1,
|
|
2274
2340
|
allowFontScaling: true
|
|
2275
2341
|
},
|
|
2276
2342
|
caption
|
|
2277
2343
|
) : null),
|
|
2278
|
-
effectiveRight !== void 0 ? /* @__PURE__ */ React25.createElement(View, { style:
|
|
2344
|
+
effectiveRight !== void 0 ? /* @__PURE__ */ React25.createElement(View, { style: styles25.rightContainer }, typeof effectiveRight === "string" ? /* @__PURE__ */ React25.createElement(
|
|
2279
2345
|
Text,
|
|
2280
2346
|
{
|
|
2281
|
-
style: [
|
|
2347
|
+
style: [styles25.rightText, { color: colors.mutedForeground }],
|
|
2282
2348
|
allowFontScaling: true
|
|
2283
2349
|
},
|
|
2284
2350
|
effectiveRight
|
|
@@ -2287,18 +2353,18 @@ function ListItem({
|
|
|
2287
2353
|
View,
|
|
2288
2354
|
{
|
|
2289
2355
|
style: [
|
|
2290
|
-
|
|
2356
|
+
styles25.separator,
|
|
2291
2357
|
{ backgroundColor: colors.border, marginLeft: effectiveLeft ? s(16) + s(44) + s(12) : s(16) }
|
|
2292
2358
|
]
|
|
2293
2359
|
}
|
|
2294
2360
|
) : null);
|
|
2295
2361
|
}
|
|
2296
|
-
var
|
|
2362
|
+
var styles25 = StyleSheet.create({
|
|
2297
2363
|
container: {
|
|
2298
2364
|
flexDirection: "row",
|
|
2299
2365
|
alignItems: "center",
|
|
2300
2366
|
paddingHorizontal: s(16),
|
|
2301
|
-
paddingVertical: vs(
|
|
2367
|
+
paddingVertical: vs(10),
|
|
2302
2368
|
gap: s(12)
|
|
2303
2369
|
},
|
|
2304
2370
|
leftContainer: {
|
|
@@ -2313,18 +2379,18 @@ var styles24 = StyleSheet.create({
|
|
|
2313
2379
|
gap: vs(4)
|
|
2314
2380
|
},
|
|
2315
2381
|
title: {
|
|
2316
|
-
|
|
2317
|
-
|
|
2318
|
-
lineHeight: mvs(
|
|
2382
|
+
fontFamily: "Poppins-Medium",
|
|
2383
|
+
fontSize: ms(15),
|
|
2384
|
+
lineHeight: mvs(22)
|
|
2319
2385
|
},
|
|
2320
2386
|
subtitle: {
|
|
2321
|
-
|
|
2322
|
-
|
|
2323
|
-
lineHeight: mvs(
|
|
2387
|
+
fontFamily: "Poppins-Regular",
|
|
2388
|
+
fontSize: ms(13),
|
|
2389
|
+
lineHeight: mvs(18)
|
|
2324
2390
|
},
|
|
2325
2391
|
caption: {
|
|
2392
|
+
fontFamily: "Poppins-Regular",
|
|
2326
2393
|
fontSize: ms(12),
|
|
2327
|
-
fontWeight: "400",
|
|
2328
2394
|
lineHeight: mvs(16),
|
|
2329
2395
|
opacity: 0.7
|
|
2330
2396
|
},
|
|
@@ -2335,7 +2401,8 @@ var styles24 = StyleSheet.create({
|
|
|
2335
2401
|
maxWidth: s(160)
|
|
2336
2402
|
},
|
|
2337
2403
|
rightText: {
|
|
2338
|
-
|
|
2404
|
+
fontFamily: "Poppins-Regular",
|
|
2405
|
+
fontSize: ms(14)
|
|
2339
2406
|
},
|
|
2340
2407
|
chevron: {
|
|
2341
2408
|
marginLeft: s(4)
|
|
@@ -2348,8 +2415,8 @@ var styles24 = StyleSheet.create({
|
|
|
2348
2415
|
opacity: 0.45
|
|
2349
2416
|
}
|
|
2350
2417
|
});
|
|
2351
|
-
var
|
|
2352
|
-
function Chip({ label, selected = false, onPress, style }) {
|
|
2418
|
+
var nativeDriver11 = Platform.OS !== "web";
|
|
2419
|
+
function Chip({ label, selected = false, onPress, icon, iconName, style }) {
|
|
2353
2420
|
const { colors } = useTheme();
|
|
2354
2421
|
const scale2 = useRef(new Animated.Value(1)).current;
|
|
2355
2422
|
const pressAnim = useRef(new Animated.Value(selected ? 1 : 0)).current;
|
|
@@ -2364,7 +2431,7 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2364
2431
|
const handlePressIn = () => {
|
|
2365
2432
|
Animated.spring(scale2, {
|
|
2366
2433
|
toValue: 0.95,
|
|
2367
|
-
useNativeDriver:
|
|
2434
|
+
useNativeDriver: nativeDriver11,
|
|
2368
2435
|
speed: 40,
|
|
2369
2436
|
bounciness: 0
|
|
2370
2437
|
}).start();
|
|
@@ -2372,7 +2439,7 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2372
2439
|
const handlePressOut = () => {
|
|
2373
2440
|
Animated.spring(scale2, {
|
|
2374
2441
|
toValue: 1,
|
|
2375
|
-
useNativeDriver:
|
|
2442
|
+
useNativeDriver: nativeDriver11,
|
|
2376
2443
|
speed: 40,
|
|
2377
2444
|
bounciness: 4
|
|
2378
2445
|
}).start();
|
|
@@ -2393,7 +2460,8 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2393
2460
|
inputRange: [0, 1],
|
|
2394
2461
|
outputRange: [colors.border, colors.primary]
|
|
2395
2462
|
});
|
|
2396
|
-
|
|
2463
|
+
const resolvedIcon = iconName ? renderIcon(iconName, ms(13), selected ? colors.primaryForeground : colors.foreground) : icon;
|
|
2464
|
+
return /* @__PURE__ */ React25.createElement(Animated.View, { style: [styles26.wrapper, { transform: [{ scale: scale2 }] }, style] }, /* @__PURE__ */ React25.createElement(
|
|
2397
2465
|
TouchableOpacity,
|
|
2398
2466
|
{
|
|
2399
2467
|
onPress: handlePress,
|
|
@@ -2402,7 +2470,7 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2402
2470
|
activeOpacity: 1,
|
|
2403
2471
|
touchSoundDisabled: true
|
|
2404
2472
|
},
|
|
2405
|
-
/* @__PURE__ */ React25.createElement(Animated.View, { style: [
|
|
2473
|
+
/* @__PURE__ */ React25.createElement(Animated.View, { style: [styles26.chip, { backgroundColor, borderColor }] }, resolvedIcon ? /* @__PURE__ */ React25.createElement(View, { style: styles26.chipIcon }, resolvedIcon) : null, /* @__PURE__ */ React25.createElement(Animated.Text, { style: [styles26.label, { color: textColor }], allowFontScaling: true }, label))
|
|
2406
2474
|
));
|
|
2407
2475
|
}
|
|
2408
2476
|
function ChipGroup({ options, value, onValueChange, multiSelect = false, style }) {
|
|
@@ -2427,7 +2495,7 @@ function ChipGroup({ options, value, onValueChange, multiSelect = false, style }
|
|
|
2427
2495
|
}
|
|
2428
2496
|
return optionValue === value;
|
|
2429
2497
|
};
|
|
2430
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
2498
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles26.group, style] }, options.map((opt) => /* @__PURE__ */ React25.createElement(
|
|
2431
2499
|
Chip,
|
|
2432
2500
|
{
|
|
2433
2501
|
key: opt.value,
|
|
@@ -2437,20 +2505,26 @@ function ChipGroup({ options, value, onValueChange, multiSelect = false, style }
|
|
|
2437
2505
|
}
|
|
2438
2506
|
)));
|
|
2439
2507
|
}
|
|
2440
|
-
var
|
|
2508
|
+
var styles26 = StyleSheet.create({
|
|
2441
2509
|
wrapper: {},
|
|
2442
2510
|
chip: {
|
|
2443
2511
|
borderRadius: 999,
|
|
2444
2512
|
paddingHorizontal: s(14),
|
|
2445
|
-
paddingVertical: vs(
|
|
2446
|
-
borderWidth: 1
|
|
2513
|
+
paddingVertical: vs(5),
|
|
2514
|
+
borderWidth: 1,
|
|
2515
|
+
alignItems: "center",
|
|
2516
|
+
justifyContent: "center",
|
|
2517
|
+
flexDirection: "row",
|
|
2518
|
+
gap: s(5)
|
|
2519
|
+
},
|
|
2520
|
+
chipIcon: {
|
|
2447
2521
|
alignItems: "center",
|
|
2448
2522
|
justifyContent: "center"
|
|
2449
2523
|
},
|
|
2450
2524
|
label: {
|
|
2451
|
-
|
|
2452
|
-
|
|
2453
|
-
lineHeight: mvs(
|
|
2525
|
+
fontFamily: "Poppins-Medium",
|
|
2526
|
+
fontSize: ms(13),
|
|
2527
|
+
lineHeight: mvs(18)
|
|
2454
2528
|
},
|
|
2455
2529
|
group: {
|
|
2456
2530
|
flexDirection: "row",
|
|
@@ -2469,43 +2543,85 @@ function ConfirmDialog({
|
|
|
2469
2543
|
onCancel
|
|
2470
2544
|
}) {
|
|
2471
2545
|
const { colors } = useTheme();
|
|
2472
|
-
|
|
2473
|
-
|
|
2546
|
+
const ref = useRef(null);
|
|
2547
|
+
useEffect(() => {
|
|
2548
|
+
if (visible) {
|
|
2549
|
+
impactLight();
|
|
2550
|
+
ref.current?.present();
|
|
2551
|
+
} else {
|
|
2552
|
+
ref.current?.dismiss();
|
|
2553
|
+
}
|
|
2554
|
+
}, [visible]);
|
|
2555
|
+
const renderBackdrop = (props) => /* @__PURE__ */ React25.createElement(
|
|
2556
|
+
BottomSheetBackdrop,
|
|
2557
|
+
{
|
|
2558
|
+
...props,
|
|
2559
|
+
disappearsOnIndex: -1,
|
|
2560
|
+
appearsOnIndex: 0,
|
|
2561
|
+
pressBehavior: "close"
|
|
2562
|
+
}
|
|
2563
|
+
);
|
|
2564
|
+
return /* @__PURE__ */ React25.createElement(
|
|
2565
|
+
BottomSheetModal,
|
|
2474
2566
|
{
|
|
2475
|
-
|
|
2476
|
-
|
|
2567
|
+
ref,
|
|
2568
|
+
snapPoints: ["35%"],
|
|
2569
|
+
onDismiss: onCancel,
|
|
2570
|
+
backdropComponent: renderBackdrop,
|
|
2571
|
+
backgroundStyle: [styles27.background, { backgroundColor: colors.card }],
|
|
2572
|
+
handleIndicatorStyle: [styles27.handle, { backgroundColor: colors.border }],
|
|
2573
|
+
enablePanDownToClose: true
|
|
2477
2574
|
},
|
|
2478
|
-
/* @__PURE__ */ React25.createElement(Text, { style: [
|
|
2479
|
-
|
|
2480
|
-
|
|
2481
|
-
|
|
2575
|
+
/* @__PURE__ */ React25.createElement(BottomSheetView, { style: styles27.content }, /* @__PURE__ */ React25.createElement(Text, { style: [styles27.title, { color: colors.cardForeground }], allowFontScaling: true }, title), description ? /* @__PURE__ */ React25.createElement(Text, { style: [styles27.description, { color: colors.mutedForeground }], allowFontScaling: true }, description) : null, /* @__PURE__ */ React25.createElement(View, { style: styles27.actions }, /* @__PURE__ */ React25.createElement(
|
|
2576
|
+
Button,
|
|
2577
|
+
{
|
|
2578
|
+
label: cancelLabel,
|
|
2579
|
+
variant: "outline",
|
|
2580
|
+
fullWidth: true,
|
|
2581
|
+
onPress: onCancel,
|
|
2582
|
+
icon: /* @__PURE__ */ React25.createElement(Feather$1, { name: "x", size: 15, color: colors.foreground })
|
|
2583
|
+
}
|
|
2584
|
+
), /* @__PURE__ */ React25.createElement(
|
|
2585
|
+
Button,
|
|
2586
|
+
{
|
|
2587
|
+
label: confirmLabel,
|
|
2588
|
+
variant: confirmVariant,
|
|
2589
|
+
fullWidth: true,
|
|
2590
|
+
onPress: onConfirm,
|
|
2591
|
+
icon: /* @__PURE__ */ React25.createElement(
|
|
2592
|
+
Feather$1,
|
|
2593
|
+
{
|
|
2594
|
+
name: confirmVariant === "destructive" ? "trash-2" : "check",
|
|
2595
|
+
size: 15,
|
|
2596
|
+
color: confirmVariant === "destructive" ? colors.destructiveForeground : colors.primaryForeground
|
|
2597
|
+
}
|
|
2598
|
+
)
|
|
2599
|
+
}
|
|
2600
|
+
)))
|
|
2601
|
+
);
|
|
2482
2602
|
}
|
|
2483
|
-
var
|
|
2484
|
-
|
|
2485
|
-
|
|
2486
|
-
|
|
2487
|
-
justifyContent: "center",
|
|
2488
|
-
alignItems: "center",
|
|
2489
|
-
padding: s(24)
|
|
2603
|
+
var styles27 = StyleSheet.create({
|
|
2604
|
+
background: {
|
|
2605
|
+
borderTopLeftRadius: ms(16),
|
|
2606
|
+
borderTopRightRadius: ms(16)
|
|
2490
2607
|
},
|
|
2491
|
-
|
|
2492
|
-
width:
|
|
2493
|
-
|
|
2494
|
-
borderRadius: ms(
|
|
2495
|
-
|
|
2496
|
-
|
|
2497
|
-
|
|
2498
|
-
|
|
2499
|
-
|
|
2500
|
-
shadowRadius: 16,
|
|
2501
|
-
elevation: 8
|
|
2608
|
+
handle: {
|
|
2609
|
+
width: s(36),
|
|
2610
|
+
height: vs(4),
|
|
2611
|
+
borderRadius: ms(2)
|
|
2612
|
+
},
|
|
2613
|
+
content: {
|
|
2614
|
+
paddingHorizontal: s(24),
|
|
2615
|
+
paddingBottom: vs(32),
|
|
2616
|
+
gap: vs(12)
|
|
2502
2617
|
},
|
|
2503
2618
|
title: {
|
|
2619
|
+
fontFamily: "Poppins-SemiBold",
|
|
2504
2620
|
fontSize: ms(18),
|
|
2505
|
-
fontWeight: "600",
|
|
2506
2621
|
lineHeight: mvs(26)
|
|
2507
2622
|
},
|
|
2508
2623
|
description: {
|
|
2624
|
+
fontFamily: "Poppins-Regular",
|
|
2509
2625
|
fontSize: ms(15),
|
|
2510
2626
|
lineHeight: mvs(22)
|
|
2511
2627
|
},
|
|
@@ -2516,9 +2632,9 @@ var styles26 = StyleSheet.create({
|
|
|
2516
2632
|
});
|
|
2517
2633
|
function LabelValue({ label, value, style }) {
|
|
2518
2634
|
const { colors } = useTheme();
|
|
2519
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
2635
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles28.container, style] }, /* @__PURE__ */ React25.createElement(Text, { style: [styles28.label, { color: colors.mutedForeground }], allowFontScaling: true }, label), typeof value === "string" ? /* @__PURE__ */ React25.createElement(Text, { style: [styles28.value, { color: colors.foreground }], allowFontScaling: true }, value) : value);
|
|
2520
2636
|
}
|
|
2521
|
-
var
|
|
2637
|
+
var styles28 = StyleSheet.create({
|
|
2522
2638
|
container: {
|
|
2523
2639
|
flexDirection: "row",
|
|
2524
2640
|
justifyContent: "space-between",
|
|
@@ -2526,13 +2642,14 @@ var styles27 = StyleSheet.create({
|
|
|
2526
2642
|
gap: s(12)
|
|
2527
2643
|
},
|
|
2528
2644
|
label: {
|
|
2645
|
+
fontFamily: "Poppins-Regular",
|
|
2529
2646
|
fontSize: ms(13),
|
|
2530
2647
|
lineHeight: mvs(18)
|
|
2531
2648
|
},
|
|
2532
2649
|
value: {
|
|
2533
|
-
|
|
2534
|
-
|
|
2535
|
-
lineHeight: mvs(
|
|
2650
|
+
fontFamily: "Poppins-Medium",
|
|
2651
|
+
fontSize: ms(14),
|
|
2652
|
+
lineHeight: mvs(20),
|
|
2536
2653
|
textAlign: "right"
|
|
2537
2654
|
}
|
|
2538
2655
|
});
|
|
@@ -2568,19 +2685,19 @@ function MonthPicker({ value, onChange, style }) {
|
|
|
2568
2685
|
onChange({ month: value.month + 1, year: value.year });
|
|
2569
2686
|
}
|
|
2570
2687
|
};
|
|
2571
|
-
return /* @__PURE__ */ React25.createElement(View, { style: [
|
|
2688
|
+
return /* @__PURE__ */ React25.createElement(View, { style: [styles29.container, style] }, /* @__PURE__ */ React25.createElement(
|
|
2572
2689
|
TouchableOpacity,
|
|
2573
2690
|
{
|
|
2574
|
-
style:
|
|
2691
|
+
style: styles29.arrow,
|
|
2575
2692
|
onPress: handlePrev,
|
|
2576
2693
|
activeOpacity: 0.6,
|
|
2577
2694
|
touchSoundDisabled: true
|
|
2578
2695
|
},
|
|
2579
2696
|
/* @__PURE__ */ React25.createElement(Entypo$1, { name: "chevron-left", size: 22, color: colors.foreground })
|
|
2580
|
-
), /* @__PURE__ */ React25.createElement(Text, { style: [
|
|
2697
|
+
), /* @__PURE__ */ React25.createElement(Text, { style: [styles29.label, { color: colors.foreground }], allowFontScaling: true }, MONTH_NAMES[value.month - 1], " ", value.year), /* @__PURE__ */ React25.createElement(
|
|
2581
2698
|
TouchableOpacity,
|
|
2582
2699
|
{
|
|
2583
|
-
style:
|
|
2700
|
+
style: styles29.arrow,
|
|
2584
2701
|
onPress: handleNext,
|
|
2585
2702
|
activeOpacity: 0.6,
|
|
2586
2703
|
touchSoundDisabled: true
|
|
@@ -2588,7 +2705,7 @@ function MonthPicker({ value, onChange, style }) {
|
|
|
2588
2705
|
/* @__PURE__ */ React25.createElement(Entypo$1, { name: "chevron-right", size: 22, color: colors.foreground })
|
|
2589
2706
|
));
|
|
2590
2707
|
}
|
|
2591
|
-
var
|
|
2708
|
+
var styles29 = StyleSheet.create({
|
|
2592
2709
|
container: {
|
|
2593
2710
|
flexDirection: "row",
|
|
2594
2711
|
alignItems: "center",
|
|
@@ -2601,8 +2718,8 @@ var styles28 = StyleSheet.create({
|
|
|
2601
2718
|
justifyContent: "center"
|
|
2602
2719
|
},
|
|
2603
2720
|
label: {
|
|
2721
|
+
fontFamily: "Poppins-Medium",
|
|
2604
2722
|
fontSize: ms(17),
|
|
2605
|
-
fontWeight: "500",
|
|
2606
2723
|
lineHeight: mvs(24),
|
|
2607
2724
|
textAlign: "center",
|
|
2608
2725
|
minWidth: s(160)
|