@retray-dev/ui-kit 2.7.0 → 2.8.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 +32 -1
- package/README.md +2 -2
- package/dist/index.d.mts +20 -1
- package/dist/index.d.ts +20 -1
- package/dist/index.js +374 -280
- package/dist/index.mjs +303 -210
- package/package.json +1 -1
- package/src/components/Button/Button.tsx +1 -1
- package/src/components/Checkbox/Checkbox.tsx +1 -0
- package/src/components/IconButton/IconButton.tsx +147 -0
- package/src/components/IconButton/index.ts +2 -0
- package/src/components/RadioGroup/RadioGroup.tsx +1 -0
- package/src/components/Select/Select.tsx +2 -2
- package/src/components/Sheet/Sheet.tsx +2 -2
- package/src/components/Tabs/Tabs.tsx +1 -0
- package/src/components/Toast/Toast.tsx +2 -2
- package/src/components/Toggle/Toggle.tsx +1 -1
- package/src/index.ts +1 -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
|
|
@@ -78,22 +78,22 @@ var defaultDark = {
|
|
|
78
78
|
};
|
|
79
79
|
|
|
80
80
|
// src/theme/ThemeProvider.tsx
|
|
81
|
-
var ThemeContext =
|
|
81
|
+
var ThemeContext = React25.createContext({
|
|
82
82
|
colors: defaultLight,
|
|
83
83
|
colorScheme: "light"
|
|
84
84
|
});
|
|
85
85
|
function ThemeProvider({ children, theme, colorScheme = "system" }) {
|
|
86
86
|
const systemScheme = reactNative.useColorScheme() ?? "light";
|
|
87
87
|
const resolvedScheme = colorScheme === "system" ? systemScheme : colorScheme;
|
|
88
|
-
const colors =
|
|
88
|
+
const colors = React25.useMemo(() => {
|
|
89
89
|
const base = resolvedScheme === "dark" ? defaultDark : defaultLight;
|
|
90
90
|
const override = resolvedScheme === "dark" ? theme?.dark : theme?.light;
|
|
91
91
|
return override ? { ...base, ...override } : base;
|
|
92
92
|
}, [resolvedScheme, theme]);
|
|
93
|
-
return /* @__PURE__ */
|
|
93
|
+
return /* @__PURE__ */ React25__default.default.createElement(ThemeContext.Provider, { value: { colors, colorScheme: resolvedScheme } }, children);
|
|
94
94
|
}
|
|
95
95
|
function useTheme() {
|
|
96
|
-
const context =
|
|
96
|
+
const context = React25.useContext(ThemeContext);
|
|
97
97
|
if (!context) {
|
|
98
98
|
throw new Error("useTheme must be used within a ThemeProvider");
|
|
99
99
|
}
|
|
@@ -162,10 +162,10 @@ function Icon({ name, size, color, family }) {
|
|
|
162
162
|
}
|
|
163
163
|
if (!resolved) return null;
|
|
164
164
|
const Component = resolved.component;
|
|
165
|
-
return
|
|
165
|
+
return React25__default.default.createElement(Component, { name, size, color });
|
|
166
166
|
}
|
|
167
167
|
function renderIcon(name, size, color) {
|
|
168
|
-
return
|
|
168
|
+
return React25__default.default.createElement(Icon, { name, size, color });
|
|
169
169
|
}
|
|
170
170
|
|
|
171
171
|
// src/components/Button/Button.tsx
|
|
@@ -198,7 +198,7 @@ function Button({
|
|
|
198
198
|
}) {
|
|
199
199
|
const { colors } = useTheme();
|
|
200
200
|
const isDisabled = disabled || loading;
|
|
201
|
-
const scale2 =
|
|
201
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
202
202
|
const handlePressIn = () => {
|
|
203
203
|
if (isDisabled) return;
|
|
204
204
|
reactNative.Animated.spring(scale2, {
|
|
@@ -231,7 +231,7 @@ function Button({
|
|
|
231
231
|
}[variant];
|
|
232
232
|
const effectiveIcon = iconName ? renderIcon(iconName, iconSizeMap[size], iconColor ?? labelVariantStyle.color) : typeof icon === "function" ? icon({ label, size, variant }) : icon;
|
|
233
233
|
const spinnerColor = variant === "destructive" ? colors.destructiveForeground : variant === "primary" || variant === "secondary" ? colors.primaryForeground : colors.foreground;
|
|
234
|
-
return /* @__PURE__ */
|
|
234
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [fullWidth && styles.fullWidth, { transform: [{ scale: scale2 }] }] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
235
235
|
reactNative.TouchableOpacity,
|
|
236
236
|
{
|
|
237
237
|
style: [
|
|
@@ -250,7 +250,7 @@ function Button({
|
|
|
250
250
|
onPressOut: handlePressOut,
|
|
251
251
|
...props
|
|
252
252
|
},
|
|
253
|
-
loading ? /* @__PURE__ */
|
|
253
|
+
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
254
|
));
|
|
255
255
|
}
|
|
256
256
|
var styles = reactNative.StyleSheet.create({
|
|
@@ -273,6 +273,96 @@ var styles = reactNative.StyleSheet.create({
|
|
|
273
273
|
marginHorizontal: s(8)
|
|
274
274
|
}
|
|
275
275
|
});
|
|
276
|
+
var nativeDriver2 = reactNative.Platform.OS !== "web";
|
|
277
|
+
var sizeMap = {
|
|
278
|
+
sm: { container: s(40), icon: 18 },
|
|
279
|
+
md: { container: s(44), icon: 20 },
|
|
280
|
+
lg: { container: s(52), icon: 24 }
|
|
281
|
+
};
|
|
282
|
+
function IconButton({
|
|
283
|
+
iconName,
|
|
284
|
+
icon,
|
|
285
|
+
iconColor,
|
|
286
|
+
variant = "primary",
|
|
287
|
+
size = "md",
|
|
288
|
+
loading = false,
|
|
289
|
+
disabled,
|
|
290
|
+
style,
|
|
291
|
+
onPress,
|
|
292
|
+
...props
|
|
293
|
+
}) {
|
|
294
|
+
const { colors } = useTheme();
|
|
295
|
+
const isDisabled = disabled || loading;
|
|
296
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
297
|
+
const handlePressIn = () => {
|
|
298
|
+
if (isDisabled) return;
|
|
299
|
+
reactNative.Animated.spring(scale2, {
|
|
300
|
+
toValue: 0.95,
|
|
301
|
+
useNativeDriver: nativeDriver2,
|
|
302
|
+
speed: 40,
|
|
303
|
+
bounciness: 0
|
|
304
|
+
}).start();
|
|
305
|
+
};
|
|
306
|
+
const handlePressOut = () => {
|
|
307
|
+
reactNative.Animated.spring(scale2, {
|
|
308
|
+
toValue: 1,
|
|
309
|
+
useNativeDriver: nativeDriver2,
|
|
310
|
+
speed: 40,
|
|
311
|
+
bounciness: 4
|
|
312
|
+
}).start();
|
|
313
|
+
};
|
|
314
|
+
const handlePress = (e) => {
|
|
315
|
+
impactLight();
|
|
316
|
+
onPress?.(e);
|
|
317
|
+
};
|
|
318
|
+
const containerVariantStyle = {
|
|
319
|
+
primary: { backgroundColor: colors.primary },
|
|
320
|
+
secondary: { backgroundColor: colors.secondary },
|
|
321
|
+
outline: { backgroundColor: "transparent", borderWidth: 1.5, borderColor: colors.border },
|
|
322
|
+
ghost: { backgroundColor: "transparent" },
|
|
323
|
+
destructive: { backgroundColor: colors.destructive }
|
|
324
|
+
}[variant];
|
|
325
|
+
const defaultIconColor = {
|
|
326
|
+
primary: colors.primaryForeground,
|
|
327
|
+
secondary: colors.secondaryForeground,
|
|
328
|
+
outline: colors.foreground,
|
|
329
|
+
ghost: colors.foreground,
|
|
330
|
+
destructive: colors.destructiveForeground
|
|
331
|
+
}[variant];
|
|
332
|
+
const spinnerColor = variant === "destructive" ? colors.destructiveForeground : variant === "primary" || variant === "secondary" ? colors.primaryForeground : colors.foreground;
|
|
333
|
+
const { container: containerSize, icon: iconSize } = sizeMap[size];
|
|
334
|
+
const resolvedIcon = iconName ? renderIcon(iconName, iconSize, iconColor ?? defaultIconColor) : icon;
|
|
335
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: { transform: [{ scale: scale2 }] } }, /* @__PURE__ */ React25__default.default.createElement(
|
|
336
|
+
reactNative.TouchableOpacity,
|
|
337
|
+
{
|
|
338
|
+
style: [
|
|
339
|
+
styles2.base,
|
|
340
|
+
containerVariantStyle,
|
|
341
|
+
{ width: containerSize, height: containerSize },
|
|
342
|
+
isDisabled && styles2.disabled,
|
|
343
|
+
style
|
|
344
|
+
],
|
|
345
|
+
disabled: isDisabled,
|
|
346
|
+
activeOpacity: 1,
|
|
347
|
+
touchSoundDisabled: true,
|
|
348
|
+
onPress: handlePress,
|
|
349
|
+
onPressIn: handlePressIn,
|
|
350
|
+
onPressOut: handlePressOut,
|
|
351
|
+
...props
|
|
352
|
+
},
|
|
353
|
+
loading ? /* @__PURE__ */ React25__default.default.createElement(reactNative.ActivityIndicator, { size: "small", color: spinnerColor }) : resolvedIcon
|
|
354
|
+
));
|
|
355
|
+
}
|
|
356
|
+
var styles2 = reactNative.StyleSheet.create({
|
|
357
|
+
base: {
|
|
358
|
+
borderRadius: 999,
|
|
359
|
+
alignItems: "center",
|
|
360
|
+
justifyContent: "center"
|
|
361
|
+
},
|
|
362
|
+
disabled: {
|
|
363
|
+
opacity: 0.5
|
|
364
|
+
}
|
|
365
|
+
});
|
|
276
366
|
var variantStyles = {
|
|
277
367
|
h1: { fontSize: ms(40), fontWeight: "700", lineHeight: mvs(52) },
|
|
278
368
|
h2: { fontSize: ms(28), fontWeight: "700", lineHeight: mvs(36) },
|
|
@@ -284,7 +374,7 @@ var variantStyles = {
|
|
|
284
374
|
function Text2({ variant = "body", color, style, children, ...props }) {
|
|
285
375
|
const { colors } = useTheme();
|
|
286
376
|
const defaultColor = variant === "caption" ? colors.mutedForeground : colors.foreground;
|
|
287
|
-
return /* @__PURE__ */
|
|
377
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
288
378
|
reactNative.Text,
|
|
289
379
|
{
|
|
290
380
|
style: [variantStyles[variant], { color: color ?? defaultColor }, style],
|
|
@@ -297,29 +387,29 @@ function Text2({ variant = "body", color, style, children, ...props }) {
|
|
|
297
387
|
var webInputResetStyle = reactNative.Platform.OS === "web" ? { outlineStyle: "none", outlineWidth: 0, outlineColor: "transparent", boxShadow: "none" } : {};
|
|
298
388
|
function Input({ label, error, hint, prefix, suffix, prefixStyle, suffixStyle, prefixIcon, suffixIcon, prefixIconColor, suffixIconColor, type = "text", containerStyle, style, onFocus, onBlur, secureTextEntry, ...props }) {
|
|
299
389
|
const { colors } = useTheme();
|
|
300
|
-
const [focused, setFocused] =
|
|
301
|
-
const [showPassword, setShowPassword] =
|
|
390
|
+
const [focused, setFocused] = React25.useState(false);
|
|
391
|
+
const [showPassword, setShowPassword] = React25.useState(false);
|
|
302
392
|
const isPassword = type === "password";
|
|
303
393
|
const effectiveSecure = isPassword ? !showPassword : secureTextEntry;
|
|
304
394
|
const effectivePrefix = prefixIcon ? renderIcon(prefixIcon, 20, prefixIconColor ?? colors.mutedForeground) : prefix;
|
|
305
|
-
const effectiveSuffix = isPassword && !suffix && !suffixIcon ? /* @__PURE__ */
|
|
306
|
-
return /* @__PURE__ */
|
|
395
|
+
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;
|
|
396
|
+
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
397
|
reactNative.View,
|
|
308
398
|
{
|
|
309
399
|
style: [
|
|
310
|
-
|
|
400
|
+
styles3.inputWrapper,
|
|
311
401
|
{
|
|
312
402
|
borderColor: error ? colors.destructive : focused ? colors.ring ?? colors.primary : colors.border,
|
|
313
403
|
backgroundColor: colors.background
|
|
314
404
|
}
|
|
315
405
|
]
|
|
316
406
|
},
|
|
317
|
-
effectivePrefix ? typeof effectivePrefix === "string" ? /* @__PURE__ */
|
|
318
|
-
/* @__PURE__ */
|
|
407
|
+
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,
|
|
408
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
319
409
|
reactNative.TextInput,
|
|
320
410
|
{
|
|
321
411
|
style: [
|
|
322
|
-
|
|
412
|
+
styles3.input,
|
|
323
413
|
{
|
|
324
414
|
color: colors.foreground
|
|
325
415
|
},
|
|
@@ -340,10 +430,10 @@ function Input({ label, error, hint, prefix, suffix, prefixStyle, suffixStyle, p
|
|
|
340
430
|
...props
|
|
341
431
|
}
|
|
342
432
|
),
|
|
343
|
-
effectiveSuffix ? typeof effectiveSuffix === "string" ? /* @__PURE__ */
|
|
344
|
-
), error ? /* @__PURE__ */
|
|
433
|
+
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
|
|
434
|
+
), 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
435
|
}
|
|
346
|
-
var
|
|
436
|
+
var styles3 = reactNative.StyleSheet.create({
|
|
347
437
|
container: {
|
|
348
438
|
gap: vs(8)
|
|
349
439
|
},
|
|
@@ -417,9 +507,9 @@ function Badge({ label, children, variant = "default", size = "md", icon, iconNa
|
|
|
417
507
|
}[variant];
|
|
418
508
|
const effectiveIcon = iconName ? renderIcon(iconName, sizeIconSize[size], iconColor ?? textColor) : icon;
|
|
419
509
|
const content = children ?? label;
|
|
420
|
-
return /* @__PURE__ */
|
|
510
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles4.container, containerStyle, sizePadding[size], { gap: sizeIconGap[size] }, style] }, effectiveIcon ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles4.iconContainer }, effectiveIcon) : null, typeof content === "string" ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles4.label, { color: textColor }, sizeFontSize[size]], allowFontScaling: true }, content) : content);
|
|
421
511
|
}
|
|
422
|
-
var
|
|
512
|
+
var styles4 = reactNative.StyleSheet.create({
|
|
423
513
|
container: {
|
|
424
514
|
borderRadius: ms(6),
|
|
425
515
|
alignSelf: "flex-start",
|
|
@@ -434,15 +524,15 @@ var styles3 = reactNative.StyleSheet.create({
|
|
|
434
524
|
fontWeight: "500"
|
|
435
525
|
}
|
|
436
526
|
});
|
|
437
|
-
var
|
|
527
|
+
var nativeDriver3 = reactNative.Platform.OS !== "web";
|
|
438
528
|
function Card({ children, variant = "elevated", onPress, style }) {
|
|
439
529
|
const { colors } = useTheme();
|
|
440
|
-
const scale2 =
|
|
530
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
441
531
|
const handlePressIn = () => {
|
|
442
532
|
if (!onPress) return;
|
|
443
533
|
reactNative.Animated.spring(scale2, {
|
|
444
534
|
toValue: 0.98,
|
|
445
|
-
useNativeDriver:
|
|
535
|
+
useNativeDriver: nativeDriver3,
|
|
446
536
|
speed: 40,
|
|
447
537
|
bounciness: 0
|
|
448
538
|
}).start();
|
|
@@ -451,7 +541,7 @@ function Card({ children, variant = "elevated", onPress, style }) {
|
|
|
451
541
|
if (!onPress) return;
|
|
452
542
|
reactNative.Animated.spring(scale2, {
|
|
453
543
|
toValue: 1,
|
|
454
|
-
useNativeDriver:
|
|
544
|
+
useNativeDriver: nativeDriver3,
|
|
455
545
|
speed: 40,
|
|
456
546
|
bounciness: 4
|
|
457
547
|
}).start();
|
|
@@ -484,9 +574,9 @@ function Card({ children, variant = "elevated", onPress, style }) {
|
|
|
484
574
|
elevation: 0
|
|
485
575
|
}
|
|
486
576
|
}[variant];
|
|
487
|
-
const cardContent = /* @__PURE__ */
|
|
577
|
+
const cardContent = /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles5.card, variantStyle, style] }, children);
|
|
488
578
|
if (onPress) {
|
|
489
|
-
return /* @__PURE__ */
|
|
579
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: { transform: [{ scale: scale2 }] } }, /* @__PURE__ */ React25__default.default.createElement(
|
|
490
580
|
reactNative.TouchableOpacity,
|
|
491
581
|
{
|
|
492
582
|
onPress: handlePress,
|
|
@@ -501,23 +591,23 @@ function Card({ children, variant = "elevated", onPress, style }) {
|
|
|
501
591
|
return cardContent;
|
|
502
592
|
}
|
|
503
593
|
function CardHeader({ children, style }) {
|
|
504
|
-
return /* @__PURE__ */
|
|
594
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles5.header, style] }, children);
|
|
505
595
|
}
|
|
506
596
|
function CardTitle({ children, style }) {
|
|
507
597
|
const { colors } = useTheme();
|
|
508
|
-
return /* @__PURE__ */
|
|
598
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles5.title, { color: colors.cardForeground }, style], allowFontScaling: true }, children);
|
|
509
599
|
}
|
|
510
600
|
function CardDescription({ children, style }) {
|
|
511
601
|
const { colors } = useTheme();
|
|
512
|
-
return /* @__PURE__ */
|
|
602
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles5.description, { color: colors.mutedForeground }, style], allowFontScaling: true }, children);
|
|
513
603
|
}
|
|
514
604
|
function CardContent({ children, style }) {
|
|
515
|
-
return /* @__PURE__ */
|
|
605
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles5.content, style] }, children);
|
|
516
606
|
}
|
|
517
607
|
function CardFooter({ children, style }) {
|
|
518
|
-
return /* @__PURE__ */
|
|
608
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles5.footer, style] }, children);
|
|
519
609
|
}
|
|
520
|
-
var
|
|
610
|
+
var styles5 = reactNative.StyleSheet.create({
|
|
521
611
|
card: {
|
|
522
612
|
borderRadius: ms(12),
|
|
523
613
|
borderWidth: 1
|
|
@@ -548,18 +638,18 @@ var styles4 = reactNative.StyleSheet.create({
|
|
|
548
638
|
});
|
|
549
639
|
function Separator({ orientation = "horizontal", style }) {
|
|
550
640
|
const { colors } = useTheme();
|
|
551
|
-
return /* @__PURE__ */
|
|
641
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
552
642
|
reactNative.View,
|
|
553
643
|
{
|
|
554
644
|
style: [
|
|
555
|
-
orientation === "horizontal" ?
|
|
645
|
+
orientation === "horizontal" ? styles6.horizontal : styles6.vertical,
|
|
556
646
|
{ backgroundColor: colors.border },
|
|
557
647
|
style
|
|
558
648
|
]
|
|
559
649
|
}
|
|
560
650
|
);
|
|
561
651
|
}
|
|
562
|
-
var
|
|
652
|
+
var styles6 = reactNative.StyleSheet.create({
|
|
563
653
|
horizontal: {
|
|
564
654
|
height: 1,
|
|
565
655
|
width: "100%"
|
|
@@ -569,21 +659,21 @@ var styles5 = reactNative.StyleSheet.create({
|
|
|
569
659
|
height: "100%"
|
|
570
660
|
}
|
|
571
661
|
});
|
|
572
|
-
var
|
|
662
|
+
var sizeMap2 = {
|
|
573
663
|
sm: "small",
|
|
574
664
|
md: "small",
|
|
575
665
|
lg: "large"
|
|
576
666
|
};
|
|
577
667
|
function Spinner({ size = "md", color, ...props }) {
|
|
578
668
|
const { colors } = useTheme();
|
|
579
|
-
return /* @__PURE__ */
|
|
669
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.ActivityIndicator, { size: sizeMap2[size], color: color ?? colors.primary, ...props });
|
|
580
670
|
}
|
|
581
671
|
function Skeleton({ width = "100%", height = 16, borderRadius = 6, style }) {
|
|
582
672
|
const { colors, colorScheme } = useTheme();
|
|
583
|
-
const shimmerAnim =
|
|
584
|
-
const [containerWidth, setContainerWidth] =
|
|
673
|
+
const shimmerAnim = React25.useRef(new reactNative.Animated.Value(0)).current;
|
|
674
|
+
const [containerWidth, setContainerWidth] = React25.useState(300);
|
|
585
675
|
const shimmerHighlight = colorScheme === "dark" ? "rgba(255,255,255,0.08)" : "rgba(255,255,255,0.7)";
|
|
586
|
-
|
|
676
|
+
React25.useEffect(() => {
|
|
587
677
|
const animation = reactNative.Animated.loop(
|
|
588
678
|
reactNative.Animated.timing(shimmerAnim, {
|
|
589
679
|
toValue: 1,
|
|
@@ -598,17 +688,17 @@ function Skeleton({ width = "100%", height = 16, borderRadius = 6, style }) {
|
|
|
598
688
|
inputRange: [0, 1],
|
|
599
689
|
outputRange: [-containerWidth, containerWidth]
|
|
600
690
|
});
|
|
601
|
-
return /* @__PURE__ */
|
|
691
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
602
692
|
reactNative.View,
|
|
603
693
|
{
|
|
604
694
|
style: [
|
|
605
|
-
|
|
695
|
+
styles7.base,
|
|
606
696
|
{ width, height, borderRadius, backgroundColor: colors.muted },
|
|
607
697
|
style
|
|
608
698
|
],
|
|
609
699
|
onLayout: (e) => setContainerWidth(e.nativeEvent.layout.width)
|
|
610
700
|
},
|
|
611
|
-
/* @__PURE__ */
|
|
701
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [reactNative.StyleSheet.absoluteFill, { transform: [{ translateX }] }] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
612
702
|
expoLinearGradient.LinearGradient,
|
|
613
703
|
{
|
|
614
704
|
colors: ["transparent", shimmerHighlight, "transparent"],
|
|
@@ -619,12 +709,12 @@ function Skeleton({ width = "100%", height = 16, borderRadius = 6, style }) {
|
|
|
619
709
|
))
|
|
620
710
|
);
|
|
621
711
|
}
|
|
622
|
-
var
|
|
712
|
+
var styles7 = reactNative.StyleSheet.create({
|
|
623
713
|
base: {
|
|
624
714
|
overflow: "hidden"
|
|
625
715
|
}
|
|
626
716
|
});
|
|
627
|
-
var
|
|
717
|
+
var sizeMap3 = {
|
|
628
718
|
sm: s(28),
|
|
629
719
|
md: s(40),
|
|
630
720
|
lg: s(56),
|
|
@@ -638,8 +728,8 @@ var fontSizeMap = {
|
|
|
638
728
|
};
|
|
639
729
|
function Avatar({ src, fallback, size = "md", style }) {
|
|
640
730
|
const { colors } = useTheme();
|
|
641
|
-
const [imageError, setImageError] =
|
|
642
|
-
const dimension =
|
|
731
|
+
const [imageError, setImageError] = React25.useState(false);
|
|
732
|
+
const dimension = sizeMap3[size];
|
|
643
733
|
const showFallback = !src || imageError;
|
|
644
734
|
const containerStyle = {
|
|
645
735
|
width: dimension,
|
|
@@ -648,23 +738,23 @@ function Avatar({ src, fallback, size = "md", style }) {
|
|
|
648
738
|
backgroundColor: colors.muted,
|
|
649
739
|
overflow: "hidden"
|
|
650
740
|
};
|
|
651
|
-
return /* @__PURE__ */
|
|
741
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles8.base, containerStyle, style] }, !showFallback ? /* @__PURE__ */ React25__default.default.createElement(
|
|
652
742
|
reactNative.Image,
|
|
653
743
|
{
|
|
654
744
|
source: { uri: src },
|
|
655
745
|
style: { width: dimension, height: dimension },
|
|
656
746
|
onError: () => setImageError(true)
|
|
657
747
|
}
|
|
658
|
-
) : /* @__PURE__ */
|
|
748
|
+
) : /* @__PURE__ */ React25__default.default.createElement(
|
|
659
749
|
reactNative.Text,
|
|
660
750
|
{
|
|
661
|
-
style: [
|
|
751
|
+
style: [styles8.fallback, { color: colors.mutedForeground, fontSize: fontSizeMap[size] }],
|
|
662
752
|
allowFontScaling: true
|
|
663
753
|
},
|
|
664
754
|
fallback?.slice(0, 2).toUpperCase() ?? "?"
|
|
665
755
|
));
|
|
666
756
|
}
|
|
667
|
-
var
|
|
757
|
+
var styles8 = reactNative.StyleSheet.create({
|
|
668
758
|
base: {
|
|
669
759
|
alignItems: "center",
|
|
670
760
|
justifyContent: "center"
|
|
@@ -678,11 +768,11 @@ function AlertBanner({ title, description, variant = "default", icon, iconName,
|
|
|
678
768
|
const borderColor = variant === "destructive" ? colors.destructive : variant === "success" ? colors.success : colors.border;
|
|
679
769
|
const titleColor = variant === "destructive" ? colors.destructive : variant === "success" ? colors.success : colors.foreground;
|
|
680
770
|
const descColor = variant === "destructive" ? colors.destructive : variant === "success" ? colors.success : colors.mutedForeground;
|
|
681
|
-
const defaultIcon = variant === "success" ? /* @__PURE__ */
|
|
771
|
+
const defaultIcon = variant === "success" ? /* @__PURE__ */ React25__default.default.createElement(vectorIcons.FontAwesome5, { name: "check-circle", size: 18, color: titleColor }) : variant === "destructive" ? /* @__PURE__ */ React25__default.default.createElement(vectorIcons.MaterialIcons, { name: "error-outline", size: 20, color: titleColor }) : /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "info-with-circle", size: 18, color: titleColor });
|
|
682
772
|
const effectiveIcon = iconName ? renderIcon(iconName, 18, iconColor ?? titleColor) : icon ?? defaultIcon;
|
|
683
|
-
return /* @__PURE__ */
|
|
773
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles9.container, { backgroundColor: colors.card, borderColor }, style] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles9.icon }, effectiveIcon), /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles9.content }, title ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles9.title, { color: titleColor }], allowFontScaling: true }, title) : null, description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles9.description, { color: descColor }], allowFontScaling: true }, description) : null));
|
|
684
774
|
}
|
|
685
|
-
var
|
|
775
|
+
var styles9 = reactNative.StyleSheet.create({
|
|
686
776
|
container: {
|
|
687
777
|
flexDirection: "row",
|
|
688
778
|
borderWidth: 1,
|
|
@@ -715,9 +805,9 @@ var styles8 = reactNative.StyleSheet.create({
|
|
|
715
805
|
function Progress({ value = 0, max = 100, style }) {
|
|
716
806
|
const { colors } = useTheme();
|
|
717
807
|
const percent = Math.min(Math.max(value / max * 100, 0), 100);
|
|
718
|
-
const [trackWidth, setTrackWidth] =
|
|
719
|
-
const animatedWidth =
|
|
720
|
-
|
|
808
|
+
const [trackWidth, setTrackWidth] = React25.useState(0);
|
|
809
|
+
const animatedWidth = React25.useRef(new reactNative.Animated.Value(0)).current;
|
|
810
|
+
React25.useEffect(() => {
|
|
721
811
|
if (trackWidth === 0) return;
|
|
722
812
|
reactNative.Animated.spring(animatedWidth, {
|
|
723
813
|
toValue: percent / 100 * trackWidth,
|
|
@@ -726,21 +816,21 @@ function Progress({ value = 0, max = 100, style }) {
|
|
|
726
816
|
bounciness: 0
|
|
727
817
|
}).start();
|
|
728
818
|
}, [percent, trackWidth]);
|
|
729
|
-
return /* @__PURE__ */
|
|
819
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
730
820
|
reactNative.View,
|
|
731
821
|
{
|
|
732
|
-
style: [
|
|
822
|
+
style: [styles10.track, { backgroundColor: colors.muted }, style],
|
|
733
823
|
onLayout: (e) => setTrackWidth(e.nativeEvent.layout.width)
|
|
734
824
|
},
|
|
735
|
-
/* @__PURE__ */
|
|
825
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
736
826
|
reactNative.Animated.View,
|
|
737
827
|
{
|
|
738
|
-
style: [
|
|
828
|
+
style: [styles10.indicator, { width: animatedWidth, backgroundColor: colors.primary }]
|
|
739
829
|
}
|
|
740
830
|
)
|
|
741
831
|
);
|
|
742
832
|
}
|
|
743
|
-
var
|
|
833
|
+
var styles10 = reactNative.StyleSheet.create({
|
|
744
834
|
track: {
|
|
745
835
|
height: vs(8),
|
|
746
836
|
borderRadius: 999,
|
|
@@ -756,39 +846,39 @@ function EmptyState({ icon, iconName, iconColor, title, description, action, siz
|
|
|
756
846
|
const { colors } = useTheme();
|
|
757
847
|
const isCompact = size === "compact";
|
|
758
848
|
const effectiveIcon = iconName ? renderIcon(iconName, isCompact ? 32 : 48, iconColor ?? colors.mutedForeground) : icon;
|
|
759
|
-
return /* @__PURE__ */
|
|
849
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
760
850
|
reactNative.View,
|
|
761
851
|
{
|
|
762
852
|
style: [
|
|
763
|
-
|
|
764
|
-
isCompact &&
|
|
853
|
+
styles11.container,
|
|
854
|
+
isCompact && styles11.containerCompact,
|
|
765
855
|
{ borderColor: colors.border },
|
|
766
856
|
style
|
|
767
857
|
]
|
|
768
858
|
},
|
|
769
|
-
effectiveIcon ? /* @__PURE__ */
|
|
859
|
+
effectiveIcon ? /* @__PURE__ */ React25__default.default.createElement(
|
|
770
860
|
reactNative.View,
|
|
771
861
|
{
|
|
772
862
|
style: [
|
|
773
|
-
|
|
774
|
-
isCompact &&
|
|
863
|
+
styles11.iconWrapper,
|
|
864
|
+
isCompact && styles11.iconWrapperCompact,
|
|
775
865
|
{ backgroundColor: colors.muted }
|
|
776
866
|
]
|
|
777
867
|
},
|
|
778
868
|
effectiveIcon
|
|
779
869
|
) : null,
|
|
780
|
-
/* @__PURE__ */
|
|
870
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles11.textWrapper }, /* @__PURE__ */ React25__default.default.createElement(
|
|
781
871
|
reactNative.Text,
|
|
782
872
|
{
|
|
783
|
-
style: [
|
|
873
|
+
style: [styles11.title, isCompact && styles11.titleCompact, { color: colors.foreground }],
|
|
784
874
|
allowFontScaling: true
|
|
785
875
|
},
|
|
786
876
|
title
|
|
787
|
-
), description && !isCompact ? /* @__PURE__ */
|
|
788
|
-
action && !isCompact ? /* @__PURE__ */
|
|
877
|
+
), description && !isCompact ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles11.description, { color: colors.mutedForeground }], allowFontScaling: true }, description) : null),
|
|
878
|
+
action && !isCompact ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles11.action }, action) : null
|
|
789
879
|
);
|
|
790
880
|
}
|
|
791
|
-
var
|
|
881
|
+
var styles11 = reactNative.StyleSheet.create({
|
|
792
882
|
container: {
|
|
793
883
|
alignItems: "center",
|
|
794
884
|
justifyContent: "center",
|
|
@@ -849,15 +939,15 @@ function Textarea({
|
|
|
849
939
|
...props
|
|
850
940
|
}) {
|
|
851
941
|
const { colors } = useTheme();
|
|
852
|
-
const [focused, setFocused] =
|
|
853
|
-
return /* @__PURE__ */
|
|
942
|
+
const [focused, setFocused] = React25.useState(false);
|
|
943
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles12.container, containerStyle] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles12.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, /* @__PURE__ */ React25__default.default.createElement(
|
|
854
944
|
reactNative.TextInput,
|
|
855
945
|
{
|
|
856
946
|
multiline: true,
|
|
857
947
|
numberOfLines: rows,
|
|
858
948
|
textAlignVertical: "top",
|
|
859
949
|
style: [
|
|
860
|
-
|
|
950
|
+
styles12.input,
|
|
861
951
|
{
|
|
862
952
|
borderColor: error ? colors.destructive : focused ? colors.ring ?? colors.primary : colors.border,
|
|
863
953
|
color: colors.foreground,
|
|
@@ -879,9 +969,9 @@ function Textarea({
|
|
|
879
969
|
allowFontScaling: true,
|
|
880
970
|
...props
|
|
881
971
|
}
|
|
882
|
-
), error ? /* @__PURE__ */
|
|
972
|
+
), error ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles12.helperText, { color: colors.destructive }], allowFontScaling: true }, error) : null, !error && hint ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles12.helperText, { color: colors.mutedForeground }], allowFontScaling: true }, hint) : null);
|
|
883
973
|
}
|
|
884
|
-
var
|
|
974
|
+
var styles12 = reactNative.StyleSheet.create({
|
|
885
975
|
container: {
|
|
886
976
|
gap: vs(8)
|
|
887
977
|
},
|
|
@@ -900,7 +990,7 @@ var styles11 = reactNative.StyleSheet.create({
|
|
|
900
990
|
fontSize: ms(13)
|
|
901
991
|
}
|
|
902
992
|
});
|
|
903
|
-
var
|
|
993
|
+
var nativeDriver4 = reactNative.Platform.OS !== "web";
|
|
904
994
|
function Checkbox({
|
|
905
995
|
checked = false,
|
|
906
996
|
onCheckedChange,
|
|
@@ -909,18 +999,18 @@ function Checkbox({
|
|
|
909
999
|
style
|
|
910
1000
|
}) {
|
|
911
1001
|
const { colors } = useTheme();
|
|
912
|
-
const scale2 =
|
|
1002
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
913
1003
|
const handlePressIn = () => {
|
|
914
1004
|
if (disabled) return;
|
|
915
|
-
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1005
|
+
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver4, speed: 40, bounciness: 0 }).start();
|
|
916
1006
|
};
|
|
917
1007
|
const handlePressOut = () => {
|
|
918
|
-
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1008
|
+
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver4, speed: 40, bounciness: 4 }).start();
|
|
919
1009
|
};
|
|
920
|
-
return /* @__PURE__ */
|
|
1010
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: { transform: [{ scale: scale2 }] } }, /* @__PURE__ */ React25__default.default.createElement(
|
|
921
1011
|
reactNative.TouchableOpacity,
|
|
922
1012
|
{
|
|
923
|
-
style: [
|
|
1013
|
+
style: [styles13.row, style],
|
|
924
1014
|
onPress: () => {
|
|
925
1015
|
selectionAsync();
|
|
926
1016
|
onCheckedChange?.(!checked);
|
|
@@ -931,11 +1021,11 @@ function Checkbox({
|
|
|
931
1021
|
activeOpacity: 1,
|
|
932
1022
|
touchSoundDisabled: true
|
|
933
1023
|
},
|
|
934
|
-
/* @__PURE__ */
|
|
1024
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
935
1025
|
reactNative.View,
|
|
936
1026
|
{
|
|
937
1027
|
style: [
|
|
938
|
-
|
|
1028
|
+
styles13.box,
|
|
939
1029
|
{
|
|
940
1030
|
borderColor: checked ? colors.primary : colors.border,
|
|
941
1031
|
backgroundColor: checked ? colors.primary : "transparent",
|
|
@@ -943,18 +1033,19 @@ function Checkbox({
|
|
|
943
1033
|
}
|
|
944
1034
|
]
|
|
945
1035
|
},
|
|
946
|
-
checked ? /* @__PURE__ */
|
|
1036
|
+
checked ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles13.checkmark, { borderColor: colors.primaryForeground }] }) : null
|
|
947
1037
|
),
|
|
948
|
-
label ? /* @__PURE__ */
|
|
1038
|
+
label ? /* @__PURE__ */ React25__default.default.createElement(
|
|
949
1039
|
reactNative.Text,
|
|
950
1040
|
{
|
|
951
|
-
style: [
|
|
1041
|
+
style: [styles13.label, { color: disabled ? colors.mutedForeground : colors.foreground }],
|
|
1042
|
+
allowFontScaling: true
|
|
952
1043
|
},
|
|
953
1044
|
label
|
|
954
1045
|
) : null
|
|
955
1046
|
));
|
|
956
1047
|
}
|
|
957
|
-
var
|
|
1048
|
+
var styles13 = reactNative.StyleSheet.create({
|
|
958
1049
|
row: {
|
|
959
1050
|
flexDirection: "row",
|
|
960
1051
|
alignItems: "center",
|
|
@@ -980,7 +1071,7 @@ var styles12 = reactNative.StyleSheet.create({
|
|
|
980
1071
|
lineHeight: mvs(22)
|
|
981
1072
|
}
|
|
982
1073
|
});
|
|
983
|
-
var
|
|
1074
|
+
var nativeDriver5 = reactNative.Platform.OS !== "web";
|
|
984
1075
|
var TRACK_WIDTH = s(60);
|
|
985
1076
|
var TRACK_HEIGHT = vs(36);
|
|
986
1077
|
var THUMB_SIZE = s(28);
|
|
@@ -988,13 +1079,13 @@ var THUMB_OFFSET = s(4);
|
|
|
988
1079
|
var THUMB_TRAVEL = TRACK_WIDTH - THUMB_SIZE - THUMB_OFFSET * 2;
|
|
989
1080
|
function Switch({ checked = false, onCheckedChange, disabled, style }) {
|
|
990
1081
|
const { colors } = useTheme();
|
|
991
|
-
const translateX =
|
|
992
|
-
const trackOpacity =
|
|
993
|
-
|
|
1082
|
+
const translateX = React25.useRef(new reactNative.Animated.Value(checked ? THUMB_TRAVEL : 0)).current;
|
|
1083
|
+
const trackOpacity = React25.useRef(new reactNative.Animated.Value(checked ? 1 : 0)).current;
|
|
1084
|
+
React25.useEffect(() => {
|
|
994
1085
|
reactNative.Animated.parallel([
|
|
995
1086
|
reactNative.Animated.spring(translateX, {
|
|
996
1087
|
toValue: checked ? THUMB_TRAVEL : 0,
|
|
997
|
-
useNativeDriver:
|
|
1088
|
+
useNativeDriver: nativeDriver5,
|
|
998
1089
|
bounciness: 4
|
|
999
1090
|
}),
|
|
1000
1091
|
reactNative.Animated.timing(trackOpacity, {
|
|
@@ -1008,7 +1099,7 @@ function Switch({ checked = false, onCheckedChange, disabled, style }) {
|
|
|
1008
1099
|
inputRange: [0, 1],
|
|
1009
1100
|
outputRange: [colors.muted, colors.primary]
|
|
1010
1101
|
});
|
|
1011
|
-
return /* @__PURE__ */
|
|
1102
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [{ opacity: disabled ? 0.45 : 1 }, style] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1012
1103
|
reactNative.TouchableOpacity,
|
|
1013
1104
|
{
|
|
1014
1105
|
onPress: () => {
|
|
@@ -1018,20 +1109,20 @@ function Switch({ checked = false, onCheckedChange, disabled, style }) {
|
|
|
1018
1109
|
disabled,
|
|
1019
1110
|
activeOpacity: 0.8,
|
|
1020
1111
|
touchSoundDisabled: true,
|
|
1021
|
-
style:
|
|
1112
|
+
style: styles14.wrapper
|
|
1022
1113
|
},
|
|
1023
|
-
/* @__PURE__ */
|
|
1114
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [styles14.track, { backgroundColor: trackColor }] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1024
1115
|
reactNative.Animated.View,
|
|
1025
1116
|
{
|
|
1026
1117
|
style: [
|
|
1027
|
-
|
|
1118
|
+
styles14.thumb,
|
|
1028
1119
|
{ backgroundColor: colors.primaryForeground, transform: [{ translateX }] }
|
|
1029
1120
|
]
|
|
1030
1121
|
}
|
|
1031
1122
|
))
|
|
1032
1123
|
));
|
|
1033
1124
|
}
|
|
1034
|
-
var
|
|
1125
|
+
var styles14 = reactNative.StyleSheet.create({
|
|
1035
1126
|
wrapper: {},
|
|
1036
1127
|
track: {
|
|
1037
1128
|
width: TRACK_WIDTH,
|
|
@@ -1077,9 +1168,9 @@ function Toggle({
|
|
|
1077
1168
|
...props
|
|
1078
1169
|
}) {
|
|
1079
1170
|
const { colors } = useTheme();
|
|
1080
|
-
const scale2 =
|
|
1081
|
-
const pressAnim =
|
|
1082
|
-
|
|
1171
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
1172
|
+
const pressAnim = React25.useRef(new reactNative.Animated.Value(pressed ? 1 : 0)).current;
|
|
1173
|
+
React25.useEffect(() => {
|
|
1083
1174
|
reactNative.Animated.timing(pressAnim, {
|
|
1084
1175
|
toValue: pressed ? 1 : 0,
|
|
1085
1176
|
duration: 150,
|
|
@@ -1114,17 +1205,17 @@ function Toggle({
|
|
|
1114
1205
|
return prop;
|
|
1115
1206
|
};
|
|
1116
1207
|
if (pressed) {
|
|
1117
|
-
if (activeIconName) return /* @__PURE__ */
|
|
1208
|
+
if (activeIconName) return /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, renderIcon(activeIconName, iconSize, activeIconColor ?? colors.primary));
|
|
1118
1209
|
const active = renderProp(activeIcon);
|
|
1119
|
-
if (active) return /* @__PURE__ */
|
|
1120
|
-
return /* @__PURE__ */
|
|
1210
|
+
if (active) return /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, active);
|
|
1211
|
+
return /* @__PURE__ */ React25__default.default.createElement(vectorIcons.FontAwesome5, { name: "check-circle", size: iconSize, color: colors.primary });
|
|
1121
1212
|
}
|
|
1122
|
-
if (iconName) return /* @__PURE__ */
|
|
1213
|
+
if (iconName) return /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, renderIcon(iconName, iconSize, iconColor ?? colors.mutedForeground));
|
|
1123
1214
|
const custom = renderProp(icon);
|
|
1124
|
-
if (custom) return /* @__PURE__ */
|
|
1125
|
-
return /* @__PURE__ */
|
|
1215
|
+
if (custom) return /* @__PURE__ */ React25__default.default.createElement(React25__default.default.Fragment, null, custom);
|
|
1216
|
+
return /* @__PURE__ */ React25__default.default.createElement(vectorIcons.FontAwesome5, { name: "circle", size: iconSize, color: colors.mutedForeground });
|
|
1126
1217
|
};
|
|
1127
|
-
return /* @__PURE__ */
|
|
1218
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [{ transform: [{ scale: scale2 }] }, disabled && styles15.disabled, style] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1128
1219
|
reactNative.TouchableOpacity,
|
|
1129
1220
|
{
|
|
1130
1221
|
onPress: () => {
|
|
@@ -1138,20 +1229,20 @@ function Toggle({
|
|
|
1138
1229
|
touchSoundDisabled: true,
|
|
1139
1230
|
...props
|
|
1140
1231
|
},
|
|
1141
|
-
/* @__PURE__ */
|
|
1232
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
1142
1233
|
reactNative.Animated.View,
|
|
1143
1234
|
{
|
|
1144
1235
|
style: [
|
|
1145
|
-
|
|
1236
|
+
styles15.base,
|
|
1146
1237
|
sizeStyles[size],
|
|
1147
1238
|
{ borderColor, backgroundColor, borderWidth: 2 }
|
|
1148
1239
|
]
|
|
1149
1240
|
},
|
|
1150
|
-
/* @__PURE__ */
|
|
1241
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles15.inner }, /* @__PURE__ */ React25__default.default.createElement(LeftIcon, null), label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.Text, { style: [styles15.label, { color: textColor }], allowFontScaling: true }, label) : null)
|
|
1151
1242
|
)
|
|
1152
1243
|
));
|
|
1153
1244
|
}
|
|
1154
|
-
var
|
|
1245
|
+
var styles15 = reactNative.StyleSheet.create({
|
|
1155
1246
|
base: {
|
|
1156
1247
|
borderRadius: ms(8)
|
|
1157
1248
|
},
|
|
@@ -1169,25 +1260,25 @@ var styles14 = reactNative.StyleSheet.create({
|
|
|
1169
1260
|
fontWeight: "500"
|
|
1170
1261
|
}
|
|
1171
1262
|
});
|
|
1172
|
-
var
|
|
1263
|
+
var nativeDriver6 = reactNative.Platform.OS !== "web";
|
|
1173
1264
|
function RadioItem({
|
|
1174
1265
|
option,
|
|
1175
1266
|
selected,
|
|
1176
1267
|
onSelect
|
|
1177
1268
|
}) {
|
|
1178
1269
|
const { colors } = useTheme();
|
|
1179
|
-
const scale2 =
|
|
1270
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
1180
1271
|
const handlePressIn = () => {
|
|
1181
1272
|
if (option.disabled) return;
|
|
1182
|
-
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1273
|
+
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver6, speed: 40, bounciness: 0 }).start();
|
|
1183
1274
|
};
|
|
1184
1275
|
const handlePressOut = () => {
|
|
1185
|
-
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1276
|
+
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver6, speed: 40, bounciness: 4 }).start();
|
|
1186
1277
|
};
|
|
1187
|
-
return /* @__PURE__ */
|
|
1278
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: { transform: [{ scale: scale2 }] } }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1188
1279
|
reactNative.TouchableOpacity,
|
|
1189
1280
|
{
|
|
1190
|
-
style:
|
|
1281
|
+
style: styles16.row,
|
|
1191
1282
|
onPress: () => {
|
|
1192
1283
|
if (!option.disabled) {
|
|
1193
1284
|
selectionAsync();
|
|
@@ -1200,26 +1291,27 @@ function RadioItem({
|
|
|
1200
1291
|
touchSoundDisabled: true,
|
|
1201
1292
|
disabled: option.disabled
|
|
1202
1293
|
},
|
|
1203
|
-
/* @__PURE__ */
|
|
1294
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
1204
1295
|
reactNative.View,
|
|
1205
1296
|
{
|
|
1206
1297
|
style: [
|
|
1207
|
-
|
|
1298
|
+
styles16.radio,
|
|
1208
1299
|
{
|
|
1209
1300
|
borderColor: selected ? colors.primary : colors.border,
|
|
1210
1301
|
opacity: option.disabled ? 0.45 : 1
|
|
1211
1302
|
}
|
|
1212
1303
|
]
|
|
1213
1304
|
},
|
|
1214
|
-
selected ? /* @__PURE__ */
|
|
1305
|
+
selected ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles16.dot, { backgroundColor: colors.primary }] }) : null
|
|
1215
1306
|
),
|
|
1216
|
-
/* @__PURE__ */
|
|
1307
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
1217
1308
|
reactNative.Text,
|
|
1218
1309
|
{
|
|
1219
1310
|
style: [
|
|
1220
|
-
|
|
1311
|
+
styles16.label,
|
|
1221
1312
|
{ color: option.disabled ? colors.mutedForeground : colors.foreground }
|
|
1222
|
-
]
|
|
1313
|
+
],
|
|
1314
|
+
allowFontScaling: true
|
|
1223
1315
|
},
|
|
1224
1316
|
option.label
|
|
1225
1317
|
)
|
|
@@ -1232,7 +1324,7 @@ function RadioGroup({
|
|
|
1232
1324
|
orientation = "vertical",
|
|
1233
1325
|
style
|
|
1234
1326
|
}) {
|
|
1235
|
-
return /* @__PURE__ */
|
|
1327
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles16.container, orientation === "horizontal" && styles16.horizontal, style] }, options.map((option) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1236
1328
|
RadioItem,
|
|
1237
1329
|
{
|
|
1238
1330
|
key: option.value,
|
|
@@ -1242,7 +1334,7 @@ function RadioGroup({
|
|
|
1242
1334
|
}
|
|
1243
1335
|
)));
|
|
1244
1336
|
}
|
|
1245
|
-
var
|
|
1337
|
+
var styles16 = reactNative.StyleSheet.create({
|
|
1246
1338
|
container: {
|
|
1247
1339
|
gap: vs(12)
|
|
1248
1340
|
},
|
|
@@ -1273,7 +1365,7 @@ var styles15 = reactNative.StyleSheet.create({
|
|
|
1273
1365
|
lineHeight: mvs(20)
|
|
1274
1366
|
}
|
|
1275
1367
|
});
|
|
1276
|
-
var
|
|
1368
|
+
var nativeDriver7 = reactNative.Platform.OS !== "web";
|
|
1277
1369
|
function TabTrigger({
|
|
1278
1370
|
tab,
|
|
1279
1371
|
isActive,
|
|
@@ -1281,17 +1373,17 @@ function TabTrigger({
|
|
|
1281
1373
|
onLayout
|
|
1282
1374
|
}) {
|
|
1283
1375
|
const { colors } = useTheme();
|
|
1284
|
-
const scale2 =
|
|
1376
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
1285
1377
|
const handlePressIn = () => {
|
|
1286
|
-
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver:
|
|
1378
|
+
reactNative.Animated.spring(scale2, { toValue: 0.95, useNativeDriver: nativeDriver7, speed: 40, bounciness: 0 }).start();
|
|
1287
1379
|
};
|
|
1288
1380
|
const handlePressOut = () => {
|
|
1289
|
-
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver:
|
|
1381
|
+
reactNative.Animated.spring(scale2, { toValue: 1, useNativeDriver: nativeDriver7, speed: 40, bounciness: 4 }).start();
|
|
1290
1382
|
};
|
|
1291
|
-
return /* @__PURE__ */
|
|
1383
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
1292
1384
|
reactNative.TouchableOpacity,
|
|
1293
1385
|
{
|
|
1294
|
-
style:
|
|
1386
|
+
style: styles17.trigger,
|
|
1295
1387
|
onPress,
|
|
1296
1388
|
onPressIn: handlePressIn,
|
|
1297
1389
|
onPressOut: handlePressOut,
|
|
@@ -1299,27 +1391,28 @@ function TabTrigger({
|
|
|
1299
1391
|
activeOpacity: 1,
|
|
1300
1392
|
touchSoundDisabled: true
|
|
1301
1393
|
},
|
|
1302
|
-
/* @__PURE__ */
|
|
1394
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: { transform: [{ scale: scale2 }] } }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles17.triggerInner }, tab.icon ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles17.triggerIcon }, typeof tab.icon === "function" ? tab.icon(isActive) : tab.icon) : null, /* @__PURE__ */ React25__default.default.createElement(
|
|
1303
1395
|
reactNative.Text,
|
|
1304
1396
|
{
|
|
1305
1397
|
style: [
|
|
1306
|
-
|
|
1398
|
+
styles17.triggerLabel,
|
|
1307
1399
|
{ color: isActive ? colors.foreground : colors.mutedForeground },
|
|
1308
|
-
isActive &&
|
|
1309
|
-
]
|
|
1400
|
+
isActive && styles17.activeTriggerLabel
|
|
1401
|
+
],
|
|
1402
|
+
allowFontScaling: true
|
|
1310
1403
|
},
|
|
1311
1404
|
tab.label
|
|
1312
1405
|
)))
|
|
1313
1406
|
);
|
|
1314
1407
|
}
|
|
1315
1408
|
function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
1316
|
-
const [internal, setInternal] =
|
|
1409
|
+
const [internal, setInternal] = React25.useState(tabs[0]?.value ?? "");
|
|
1317
1410
|
const { colors } = useTheme();
|
|
1318
1411
|
const active = value ?? internal;
|
|
1319
|
-
const tabLayouts =
|
|
1320
|
-
const pillX =
|
|
1321
|
-
const pillWidth =
|
|
1322
|
-
const initialised =
|
|
1412
|
+
const tabLayouts = React25.useRef({});
|
|
1413
|
+
const pillX = React25.useRef(new reactNative.Animated.Value(0)).current;
|
|
1414
|
+
const pillWidth = React25.useRef(new reactNative.Animated.Value(0)).current;
|
|
1415
|
+
const initialised = React25.useRef(false);
|
|
1323
1416
|
const animatePill = (tabValue, animate) => {
|
|
1324
1417
|
const layout = tabLayouts.current[tabValue];
|
|
1325
1418
|
if (!layout) return;
|
|
@@ -1343,7 +1436,7 @@ function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
|
1343
1436
|
pillWidth.setValue(layout.width);
|
|
1344
1437
|
}
|
|
1345
1438
|
};
|
|
1346
|
-
|
|
1439
|
+
React25.useEffect(() => {
|
|
1347
1440
|
if (initialised.current) {
|
|
1348
1441
|
animatePill(active, true);
|
|
1349
1442
|
}
|
|
@@ -1353,11 +1446,11 @@ function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
|
1353
1446
|
if (!value) setInternal(v);
|
|
1354
1447
|
onValueChange?.(v);
|
|
1355
1448
|
};
|
|
1356
|
-
return /* @__PURE__ */
|
|
1449
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles17.list, { backgroundColor: colors.muted }] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1357
1450
|
reactNative.Animated.View,
|
|
1358
1451
|
{
|
|
1359
1452
|
style: [
|
|
1360
|
-
|
|
1453
|
+
styles17.pill,
|
|
1361
1454
|
{
|
|
1362
1455
|
backgroundColor: colors.background,
|
|
1363
1456
|
position: "absolute",
|
|
@@ -1374,7 +1467,7 @@ function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
|
1374
1467
|
}
|
|
1375
1468
|
]
|
|
1376
1469
|
}
|
|
1377
|
-
), tabs.map((tab) => /* @__PURE__ */
|
|
1470
|
+
), tabs.map((tab) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1378
1471
|
TabTrigger,
|
|
1379
1472
|
{
|
|
1380
1473
|
key: tab.value,
|
|
@@ -1394,9 +1487,9 @@ function Tabs({ tabs, value, onValueChange, children, style }) {
|
|
|
1394
1487
|
}
|
|
1395
1488
|
function TabsContent({ value, activeValue, children, style }) {
|
|
1396
1489
|
if (value !== activeValue) return null;
|
|
1397
|
-
return /* @__PURE__ */
|
|
1490
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style }, children);
|
|
1398
1491
|
}
|
|
1399
|
-
var
|
|
1492
|
+
var styles17 = reactNative.StyleSheet.create({
|
|
1400
1493
|
list: {
|
|
1401
1494
|
flexDirection: "row",
|
|
1402
1495
|
borderRadius: ms(12),
|
|
@@ -1438,45 +1531,45 @@ function AccordionItemComponent({
|
|
|
1438
1531
|
onToggle
|
|
1439
1532
|
}) {
|
|
1440
1533
|
const { colors } = useTheme();
|
|
1441
|
-
const isExpanded =
|
|
1442
|
-
const height =
|
|
1443
|
-
|
|
1534
|
+
const isExpanded = Animated11.useSharedValue(isOpen);
|
|
1535
|
+
const height = Animated11.useSharedValue(0);
|
|
1536
|
+
React25__default.default.useEffect(() => {
|
|
1444
1537
|
isExpanded.value = isOpen;
|
|
1445
1538
|
}, [isOpen]);
|
|
1446
|
-
const derivedHeight =
|
|
1447
|
-
() =>
|
|
1539
|
+
const derivedHeight = Animated11.useDerivedValue(
|
|
1540
|
+
() => Animated11.withTiming(height.value * Number(isExpanded.value), {
|
|
1448
1541
|
duration: 220,
|
|
1449
|
-
easing: isExpanded.value ?
|
|
1542
|
+
easing: isExpanded.value ? Animated11.Easing.out(Animated11.Easing.ease) : Animated11.Easing.in(Animated11.Easing.ease)
|
|
1450
1543
|
})
|
|
1451
1544
|
);
|
|
1452
|
-
const derivedRotation =
|
|
1453
|
-
() =>
|
|
1545
|
+
const derivedRotation = Animated11.useDerivedValue(
|
|
1546
|
+
() => Animated11.withTiming(isExpanded.value ? 1 : 0, {
|
|
1454
1547
|
duration: 220,
|
|
1455
|
-
easing: isExpanded.value ?
|
|
1548
|
+
easing: isExpanded.value ? Animated11.Easing.out(Animated11.Easing.ease) : Animated11.Easing.in(Animated11.Easing.ease)
|
|
1456
1549
|
})
|
|
1457
1550
|
);
|
|
1458
|
-
const bodyStyle =
|
|
1551
|
+
const bodyStyle = Animated11.useAnimatedStyle(() => ({
|
|
1459
1552
|
height: derivedHeight.value,
|
|
1460
1553
|
overflow: "hidden"
|
|
1461
1554
|
}));
|
|
1462
|
-
const rotationStyle =
|
|
1555
|
+
const rotationStyle = Animated11.useAnimatedStyle(() => ({
|
|
1463
1556
|
transform: [{ rotate: `${derivedRotation.value * 180}deg` }]
|
|
1464
1557
|
}));
|
|
1465
|
-
return /* @__PURE__ */
|
|
1558
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles18.item, { borderBottomColor: colors.border }] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1466
1559
|
reactNative.Pressable,
|
|
1467
1560
|
{
|
|
1468
|
-
style: ({ pressed }) => [
|
|
1561
|
+
style: ({ pressed }) => [styles18.trigger, { opacity: pressed ? 0.6 : 1 }],
|
|
1469
1562
|
onPress: () => {
|
|
1470
1563
|
selectionAsync();
|
|
1471
1564
|
onToggle();
|
|
1472
1565
|
}
|
|
1473
1566
|
},
|
|
1474
|
-
/* @__PURE__ */
|
|
1475
|
-
/* @__PURE__ */
|
|
1476
|
-
), /* @__PURE__ */
|
|
1567
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles18.triggerText, { color: colors.foreground }] }, item.trigger),
|
|
1568
|
+
/* @__PURE__ */ React25__default.default.createElement(Animated11__default.default.View, { style: [styles18.chevron, rotationStyle] }, /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-down", size: 20, color: colors.foreground }))
|
|
1569
|
+
), /* @__PURE__ */ React25__default.default.createElement(Animated11__default.default.View, { style: bodyStyle }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1477
1570
|
reactNative.View,
|
|
1478
1571
|
{
|
|
1479
|
-
style:
|
|
1572
|
+
style: styles18.content,
|
|
1480
1573
|
onLayout: (e) => {
|
|
1481
1574
|
height.value = e.nativeEvent.layout.height;
|
|
1482
1575
|
}
|
|
@@ -1485,7 +1578,7 @@ function AccordionItemComponent({
|
|
|
1485
1578
|
)));
|
|
1486
1579
|
}
|
|
1487
1580
|
function Accordion({ items, type = "single", defaultValue, style }) {
|
|
1488
|
-
const [openValues, setOpenValues] =
|
|
1581
|
+
const [openValues, setOpenValues] = React25.useState(() => {
|
|
1489
1582
|
if (!defaultValue) return [];
|
|
1490
1583
|
return Array.isArray(defaultValue) ? defaultValue : [defaultValue];
|
|
1491
1584
|
});
|
|
@@ -1498,7 +1591,7 @@ function Accordion({ items, type = "single", defaultValue, style }) {
|
|
|
1498
1591
|
);
|
|
1499
1592
|
}
|
|
1500
1593
|
};
|
|
1501
|
-
return /* @__PURE__ */
|
|
1594
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style }, items.map((item) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1502
1595
|
AccordionItemComponent,
|
|
1503
1596
|
{
|
|
1504
1597
|
key: item.value,
|
|
@@ -1508,7 +1601,7 @@ function Accordion({ items, type = "single", defaultValue, style }) {
|
|
|
1508
1601
|
}
|
|
1509
1602
|
)));
|
|
1510
1603
|
}
|
|
1511
|
-
var
|
|
1604
|
+
var styles18 = reactNative.StyleSheet.create({
|
|
1512
1605
|
item: {
|
|
1513
1606
|
borderBottomWidth: 1
|
|
1514
1607
|
},
|
|
@@ -1549,7 +1642,7 @@ function Slider({
|
|
|
1549
1642
|
style
|
|
1550
1643
|
}) {
|
|
1551
1644
|
const { colors } = useTheme();
|
|
1552
|
-
const lastSteppedValue =
|
|
1645
|
+
const lastSteppedValue = React25.useRef(value);
|
|
1553
1646
|
const handleValueChange = (v) => {
|
|
1554
1647
|
if (step && v !== lastSteppedValue.current) {
|
|
1555
1648
|
lastSteppedValue.current = v;
|
|
@@ -1557,7 +1650,7 @@ function Slider({
|
|
|
1557
1650
|
}
|
|
1558
1651
|
onValueChange?.(v);
|
|
1559
1652
|
};
|
|
1560
|
-
return /* @__PURE__ */
|
|
1653
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles19.wrapper, style], accessibilityLabel }, label || showValue ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles19.header }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles19.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, showValue ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles19.valueText, { color: colors.mutedForeground }], allowFontScaling: true }, formatValue2(value)) : null) : null, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: disabled ? styles19.disabled : void 0 }, /* @__PURE__ */ React25__default.default.createElement(
|
|
1561
1654
|
RNSlider__default.default,
|
|
1562
1655
|
{
|
|
1563
1656
|
value,
|
|
@@ -1570,12 +1663,12 @@ function Slider({
|
|
|
1570
1663
|
minimumTrackTintColor: colors.primary,
|
|
1571
1664
|
maximumTrackTintColor: colors.muted,
|
|
1572
1665
|
thumbTintColor: colors.primary,
|
|
1573
|
-
style:
|
|
1666
|
+
style: styles19.slider,
|
|
1574
1667
|
accessibilityLabel
|
|
1575
1668
|
}
|
|
1576
1669
|
)));
|
|
1577
1670
|
}
|
|
1578
|
-
var
|
|
1671
|
+
var styles19 = reactNative.StyleSheet.create({
|
|
1579
1672
|
wrapper: {
|
|
1580
1673
|
gap: vs(8)
|
|
1581
1674
|
},
|
|
@@ -1610,8 +1703,8 @@ function Sheet({
|
|
|
1610
1703
|
style
|
|
1611
1704
|
}) {
|
|
1612
1705
|
const { colors } = useTheme();
|
|
1613
|
-
const ref =
|
|
1614
|
-
|
|
1706
|
+
const ref = React25.useRef(null);
|
|
1707
|
+
React25.useEffect(() => {
|
|
1615
1708
|
if (open) {
|
|
1616
1709
|
impactLight();
|
|
1617
1710
|
ref.current?.present();
|
|
@@ -1619,7 +1712,7 @@ function Sheet({
|
|
|
1619
1712
|
ref.current?.dismiss();
|
|
1620
1713
|
}
|
|
1621
1714
|
}, [open]);
|
|
1622
|
-
const renderBackdrop = (props) => /* @__PURE__ */
|
|
1715
|
+
const renderBackdrop = (props) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1623
1716
|
bottomSheet.BottomSheetBackdrop,
|
|
1624
1717
|
{
|
|
1625
1718
|
...props,
|
|
@@ -1628,21 +1721,21 @@ function Sheet({
|
|
|
1628
1721
|
pressBehavior: "close"
|
|
1629
1722
|
}
|
|
1630
1723
|
);
|
|
1631
|
-
return /* @__PURE__ */
|
|
1724
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
1632
1725
|
bottomSheet.BottomSheetModal,
|
|
1633
1726
|
{
|
|
1634
1727
|
ref,
|
|
1635
1728
|
snapPoints,
|
|
1636
1729
|
onDismiss: onClose,
|
|
1637
1730
|
backdropComponent: renderBackdrop,
|
|
1638
|
-
backgroundStyle: [
|
|
1639
|
-
handleIndicatorStyle: [
|
|
1731
|
+
backgroundStyle: [styles20.background, { backgroundColor: colors.card }],
|
|
1732
|
+
handleIndicatorStyle: [styles20.handle, { backgroundColor: colors.border }],
|
|
1640
1733
|
enablePanDownToClose: true
|
|
1641
1734
|
},
|
|
1642
|
-
/* @__PURE__ */
|
|
1735
|
+
/* @__PURE__ */ React25__default.default.createElement(bottomSheet.BottomSheetView, { style: [styles20.content, style] }, title || description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles20.header }, title ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles20.title, { color: colors.cardForeground }], allowFontScaling: true }, title) : null, description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles20.description, { color: colors.mutedForeground }], allowFontScaling: true }, description) : null) : null, children)
|
|
1643
1736
|
);
|
|
1644
1737
|
}
|
|
1645
|
-
var
|
|
1738
|
+
var styles20 = reactNative.StyleSheet.create({
|
|
1646
1739
|
background: {
|
|
1647
1740
|
borderTopLeftRadius: ms(16),
|
|
1648
1741
|
borderTopRightRadius: ms(16)
|
|
@@ -1683,10 +1776,10 @@ function Select({
|
|
|
1683
1776
|
style
|
|
1684
1777
|
}) {
|
|
1685
1778
|
const { colors } = useTheme();
|
|
1686
|
-
const scale2 =
|
|
1687
|
-
const [pickerVisible, setPickerVisible] =
|
|
1688
|
-
const [pendingValue, setPendingValue] =
|
|
1689
|
-
const pickerRef =
|
|
1779
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
1780
|
+
const [pickerVisible, setPickerVisible] = React25.useState(false);
|
|
1781
|
+
const [pendingValue, setPendingValue] = React25.useState(value);
|
|
1782
|
+
const pickerRef = React25.useRef(null);
|
|
1690
1783
|
const selected = options.find((o) => o.value === value);
|
|
1691
1784
|
const handlePressIn = () => {
|
|
1692
1785
|
if (disabled) return;
|
|
@@ -1715,11 +1808,11 @@ function Select({
|
|
|
1715
1808
|
}
|
|
1716
1809
|
setPickerVisible(false);
|
|
1717
1810
|
};
|
|
1718
|
-
return /* @__PURE__ */
|
|
1811
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles21.container, style] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles21.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
1812
|
reactNative.TouchableOpacity,
|
|
1720
1813
|
{
|
|
1721
1814
|
style: [
|
|
1722
|
-
|
|
1815
|
+
styles21.trigger,
|
|
1723
1816
|
{
|
|
1724
1817
|
borderColor: error ? colors.destructive : colors.border,
|
|
1725
1818
|
backgroundColor: colors.background
|
|
@@ -1731,11 +1824,11 @@ function Select({
|
|
|
1731
1824
|
activeOpacity: 1,
|
|
1732
1825
|
touchSoundDisabled: true
|
|
1733
1826
|
},
|
|
1734
|
-
/* @__PURE__ */
|
|
1827
|
+
/* @__PURE__ */ React25__default.default.createElement(
|
|
1735
1828
|
reactNative.Text,
|
|
1736
1829
|
{
|
|
1737
1830
|
style: [
|
|
1738
|
-
|
|
1831
|
+
styles21.triggerText,
|
|
1739
1832
|
{ color: selected ? colors.foreground : colors.mutedForeground }
|
|
1740
1833
|
],
|
|
1741
1834
|
numberOfLines: 1,
|
|
@@ -1743,8 +1836,8 @@ function Select({
|
|
|
1743
1836
|
},
|
|
1744
1837
|
selected?.label ?? placeholder
|
|
1745
1838
|
),
|
|
1746
|
-
/* @__PURE__ */
|
|
1747
|
-
)) : null, isIOS ? /* @__PURE__ */
|
|
1839
|
+
/* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-with-circle-down", size: 20, color: colors.mutedForeground })
|
|
1840
|
+
)) : null, isIOS ? /* @__PURE__ */ React25__default.default.createElement(
|
|
1748
1841
|
reactNative.Modal,
|
|
1749
1842
|
{
|
|
1750
1843
|
visible: pickerVisible,
|
|
@@ -1752,16 +1845,16 @@ function Select({
|
|
|
1752
1845
|
animationType: "slide",
|
|
1753
1846
|
onRequestClose: handleDismiss
|
|
1754
1847
|
},
|
|
1755
|
-
/* @__PURE__ */
|
|
1756
|
-
/* @__PURE__ */
|
|
1848
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.TouchableOpacity, { style: styles21.iosBackdrop, activeOpacity: 1, onPress: handleDismiss }),
|
|
1849
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles21.iosSheet, { backgroundColor: colors.card }] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles21.iosToolbar, { borderBottomColor: colors.border }] }, label ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles21.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: styles21.iosDoneBtn, hitSlop: { top: 8, bottom: 8, left: 8, right: 8 } }, /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles21.iosDoneBtnText, { color: colors.primary }], allowFontScaling: true }, "Done"))), /* @__PURE__ */ React25__default.default.createElement(
|
|
1757
1850
|
picker.Picker,
|
|
1758
1851
|
{
|
|
1759
1852
|
selectedValue: pendingValue ?? "",
|
|
1760
1853
|
onValueChange: (val) => setPendingValue(val),
|
|
1761
1854
|
itemStyle: { color: colors.foreground }
|
|
1762
1855
|
},
|
|
1763
|
-
!value ? /* @__PURE__ */
|
|
1764
|
-
options.map((o) => /* @__PURE__ */
|
|
1856
|
+
!value ? /* @__PURE__ */ React25__default.default.createElement(picker.Picker.Item, { label: placeholder, value: "", color: colors.mutedForeground, enabled: false }) : null,
|
|
1857
|
+
options.map((o) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1765
1858
|
picker.Picker.Item,
|
|
1766
1859
|
{
|
|
1767
1860
|
key: o.value,
|
|
@@ -1772,7 +1865,7 @@ function Select({
|
|
|
1772
1865
|
}
|
|
1773
1866
|
))
|
|
1774
1867
|
))
|
|
1775
|
-
) : null, isAndroid ? /* @__PURE__ */
|
|
1868
|
+
) : null, isAndroid ? /* @__PURE__ */ React25__default.default.createElement(
|
|
1776
1869
|
picker.Picker,
|
|
1777
1870
|
{
|
|
1778
1871
|
ref: pickerRef,
|
|
@@ -1786,10 +1879,10 @@ function Select({
|
|
|
1786
1879
|
mode: "dialog",
|
|
1787
1880
|
enabled: !disabled,
|
|
1788
1881
|
prompt: label,
|
|
1789
|
-
style:
|
|
1882
|
+
style: styles21.androidHiddenPicker
|
|
1790
1883
|
},
|
|
1791
|
-
!value ? /* @__PURE__ */
|
|
1792
|
-
options.map((o) => /* @__PURE__ */
|
|
1884
|
+
!value ? /* @__PURE__ */ React25__default.default.createElement(picker.Picker.Item, { label: placeholder, value: "", enabled: false }) : null,
|
|
1885
|
+
options.map((o) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1793
1886
|
picker.Picker.Item,
|
|
1794
1887
|
{
|
|
1795
1888
|
key: o.value,
|
|
@@ -1798,7 +1891,7 @@ function Select({
|
|
|
1798
1891
|
enabled: !o.disabled
|
|
1799
1892
|
}
|
|
1800
1893
|
))
|
|
1801
|
-
) : null, isWeb2 ? /* @__PURE__ */
|
|
1894
|
+
) : null, isWeb2 ? /* @__PURE__ */ React25__default.default.createElement(
|
|
1802
1895
|
picker.Picker,
|
|
1803
1896
|
{
|
|
1804
1897
|
selectedValue: value ?? "",
|
|
@@ -1809,7 +1902,7 @@ function Select({
|
|
|
1809
1902
|
},
|
|
1810
1903
|
enabled: !disabled,
|
|
1811
1904
|
style: [
|
|
1812
|
-
|
|
1905
|
+
styles21.webPicker,
|
|
1813
1906
|
{
|
|
1814
1907
|
borderColor: error ? colors.destructive : colors.border,
|
|
1815
1908
|
color: selected ? colors.foreground : colors.mutedForeground,
|
|
@@ -1818,8 +1911,8 @@ function Select({
|
|
|
1818
1911
|
}
|
|
1819
1912
|
]
|
|
1820
1913
|
},
|
|
1821
|
-
/* @__PURE__ */
|
|
1822
|
-
options.map((o) => /* @__PURE__ */
|
|
1914
|
+
/* @__PURE__ */ React25__default.default.createElement(picker.Picker.Item, { label: placeholder, value: "", enabled: false }),
|
|
1915
|
+
options.map((o) => /* @__PURE__ */ React25__default.default.createElement(
|
|
1823
1916
|
picker.Picker.Item,
|
|
1824
1917
|
{
|
|
1825
1918
|
key: o.value,
|
|
@@ -1828,9 +1921,9 @@ function Select({
|
|
|
1828
1921
|
enabled: !o.disabled
|
|
1829
1922
|
}
|
|
1830
1923
|
))
|
|
1831
|
-
) : null, error ? /* @__PURE__ */
|
|
1924
|
+
) : null, error ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles21.helperText, { color: colors.destructive }], allowFontScaling: true }, error) : null);
|
|
1832
1925
|
}
|
|
1833
|
-
var
|
|
1926
|
+
var styles21 = reactNative.StyleSheet.create({
|
|
1834
1927
|
container: {
|
|
1835
1928
|
gap: vs(8)
|
|
1836
1929
|
},
|
|
@@ -1903,28 +1996,28 @@ var styles20 = reactNative.StyleSheet.create({
|
|
|
1903
1996
|
fontSize: ms(17)
|
|
1904
1997
|
}
|
|
1905
1998
|
});
|
|
1906
|
-
var ToastContext =
|
|
1999
|
+
var ToastContext = React25.createContext({
|
|
1907
2000
|
toast: () => {
|
|
1908
2001
|
},
|
|
1909
2002
|
dismiss: () => {
|
|
1910
2003
|
}
|
|
1911
2004
|
});
|
|
1912
2005
|
function useToast() {
|
|
1913
|
-
return
|
|
2006
|
+
return React25.useContext(ToastContext);
|
|
1914
2007
|
}
|
|
1915
2008
|
var SWIPE_THRESHOLD = 80;
|
|
1916
2009
|
var VELOCITY_THRESHOLD = 800;
|
|
1917
2010
|
function ToastNotification({ item, onDismiss }) {
|
|
1918
2011
|
const { colors } = useTheme();
|
|
1919
|
-
const translateY =
|
|
1920
|
-
const translateX =
|
|
1921
|
-
const opacity =
|
|
1922
|
-
|
|
1923
|
-
translateY.value =
|
|
1924
|
-
opacity.value =
|
|
2012
|
+
const translateY = Animated11.useSharedValue(-80);
|
|
2013
|
+
const translateX = Animated11.useSharedValue(0);
|
|
2014
|
+
const opacity = Animated11.useSharedValue(0);
|
|
2015
|
+
React25.useEffect(() => {
|
|
2016
|
+
translateY.value = Animated11.withTiming(0, { duration: 120, easing: Animated11.Easing.out(Animated11.Easing.exp) });
|
|
2017
|
+
opacity.value = Animated11.withTiming(1, { duration: 100 });
|
|
1925
2018
|
const timer = setTimeout(() => {
|
|
1926
|
-
translateY.value =
|
|
1927
|
-
opacity.value =
|
|
2019
|
+
translateY.value = Animated11.withTiming(-80, { duration: 200 });
|
|
2020
|
+
opacity.value = Animated11.withTiming(0, { duration: 200 }, (done) => {
|
|
1928
2021
|
if (done) reactNativeWorklets.scheduleOnRN(onDismiss);
|
|
1929
2022
|
});
|
|
1930
2023
|
}, item.duration ?? 3e3);
|
|
@@ -1936,15 +2029,15 @@ function ToastNotification({ item, onDismiss }) {
|
|
|
1936
2029
|
const shouldDismiss = Math.abs(translateX.value) > SWIPE_THRESHOLD || Math.abs(e.velocityX) > VELOCITY_THRESHOLD;
|
|
1937
2030
|
if (shouldDismiss) {
|
|
1938
2031
|
const direction = translateX.value > 0 ? 1 : -1;
|
|
1939
|
-
translateX.value =
|
|
2032
|
+
translateX.value = Animated11.withTiming(direction * 500, { duration: 200 }, (done) => {
|
|
1940
2033
|
if (done) reactNativeWorklets.scheduleOnRN(onDismiss);
|
|
1941
2034
|
});
|
|
1942
|
-
opacity.value =
|
|
2035
|
+
opacity.value = Animated11.withTiming(0, { duration: 150 });
|
|
1943
2036
|
} else {
|
|
1944
|
-
translateX.value =
|
|
2037
|
+
translateX.value = Animated11.withSpring(0, { damping: 20, stiffness: 300 });
|
|
1945
2038
|
}
|
|
1946
2039
|
});
|
|
1947
|
-
const animatedStyle =
|
|
2040
|
+
const animatedStyle = Animated11.useAnimatedStyle(() => ({
|
|
1948
2041
|
opacity: opacity.value,
|
|
1949
2042
|
transform: [{ translateY: translateY.value }, { translateX: translateX.value }]
|
|
1950
2043
|
}));
|
|
@@ -1958,14 +2051,14 @@ function ToastNotification({ item, onDismiss }) {
|
|
|
1958
2051
|
destructive: colors.destructiveForeground,
|
|
1959
2052
|
success: colors.successForeground
|
|
1960
2053
|
}[item.variant ?? "default"];
|
|
1961
|
-
const defaultIcon = item.variant === "success" ? /* @__PURE__ */
|
|
2054
|
+
const defaultIcon = item.variant === "success" ? /* @__PURE__ */ React25__default.default.createElement(vectorIcons.FontAwesome5, { name: "check-circle", size: 22, color: textColor }) : item.variant === "destructive" ? /* @__PURE__ */ React25__default.default.createElement(vectorIcons.MaterialIcons, { name: "error-outline", size: 24, color: textColor }) : /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "info-with-circle", size: 22, color: textColor });
|
|
1962
2055
|
const leftIcon = item.iconName ? renderIcon(item.iconName, 22, item.iconColor ?? textColor) : item.icon ?? defaultIcon;
|
|
1963
|
-
return /* @__PURE__ */
|
|
2056
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNativeGestureHandler.GestureDetector, { gesture: panGesture }, /* @__PURE__ */ React25__default.default.createElement(Animated11__default.default.View, { style: [styles22.toast, { backgroundColor: bgColor }, animatedStyle] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles22.leftIconContainer }, leftIcon), /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles22.toastContent }, item.title ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles22.toastTitle, { color: textColor }], allowFontScaling: true }, item.title) : null, item.description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles22.toastDescription, { color: textColor, opacity: 0.85 }], allowFontScaling: true }, item.description) : null), /* @__PURE__ */ React25__default.default.createElement(reactNative.TouchableOpacity, { onPress: onDismiss, style: styles22.dismissButton, touchSoundDisabled: true }, /* @__PURE__ */ React25__default.default.createElement(vectorIcons.AntDesign, { name: "close-circle", size: 18, color: textColor }))));
|
|
1964
2057
|
}
|
|
1965
2058
|
function ToastProvider({ children }) {
|
|
1966
|
-
const [toasts, setToasts] =
|
|
2059
|
+
const [toasts, setToasts] = React25.useState([]);
|
|
1967
2060
|
const insets = reactNativeSafeAreaContext.useSafeAreaInsets();
|
|
1968
|
-
const toast =
|
|
2061
|
+
const toast = React25.useCallback((item) => {
|
|
1969
2062
|
const id = Math.random().toString(36).slice(2);
|
|
1970
2063
|
if (item.variant === "success") {
|
|
1971
2064
|
notificationSuccess();
|
|
@@ -1976,12 +2069,12 @@ function ToastProvider({ children }) {
|
|
|
1976
2069
|
}
|
|
1977
2070
|
setToasts((prev) => [{ ...item, id }, ...prev].slice(0, 3));
|
|
1978
2071
|
}, []);
|
|
1979
|
-
const dismiss =
|
|
2072
|
+
const dismiss = React25.useCallback((id) => {
|
|
1980
2073
|
setToasts((prev) => prev.filter((t) => t.id !== id));
|
|
1981
2074
|
}, []);
|
|
1982
|
-
return /* @__PURE__ */
|
|
2075
|
+
return /* @__PURE__ */ React25__default.default.createElement(ToastContext.Provider, { value: { toast, dismiss } }, children, /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles22.container, reactNative.Platform.OS === "web" && styles22.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
2076
|
}
|
|
1984
|
-
var
|
|
2077
|
+
var styles22 = reactNative.StyleSheet.create({
|
|
1985
2078
|
container: {
|
|
1986
2079
|
position: "absolute",
|
|
1987
2080
|
left: s(16),
|
|
@@ -2059,7 +2152,7 @@ function CurrencyInput({
|
|
|
2059
2152
|
onChangeValue?.(isNaN(raw) ? 0 : raw);
|
|
2060
2153
|
};
|
|
2061
2154
|
const inputStyle = size === "large" ? { fontSize: ms(36) } : {};
|
|
2062
|
-
return /* @__PURE__ */
|
|
2155
|
+
return /* @__PURE__ */ React25__default.default.createElement(
|
|
2063
2156
|
Input,
|
|
2064
2157
|
{
|
|
2065
2158
|
value,
|
|
@@ -2090,16 +2183,16 @@ function formatValue(value, prefix, showDecimals) {
|
|
|
2090
2183
|
function CurrencyDisplay({ value, prefix = "$", showDecimals = false, textColor, style }) {
|
|
2091
2184
|
const { colors } = useTheme();
|
|
2092
2185
|
const formatted = formatValue(value, prefix, showDecimals);
|
|
2093
|
-
return /* @__PURE__ */
|
|
2186
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles23.container, style] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles23.amount, { color: textColor ?? colors.foreground }], allowFontScaling: true }, formatted));
|
|
2094
2187
|
}
|
|
2095
|
-
var
|
|
2188
|
+
var styles23 = reactNative.StyleSheet.create({
|
|
2096
2189
|
container: {},
|
|
2097
2190
|
amount: {
|
|
2098
2191
|
fontSize: ms(56),
|
|
2099
2192
|
fontWeight: "700"
|
|
2100
2193
|
}
|
|
2101
2194
|
});
|
|
2102
|
-
var
|
|
2195
|
+
var nativeDriver8 = reactNative.Platform.OS !== "web";
|
|
2103
2196
|
function ListItem({
|
|
2104
2197
|
leftRender,
|
|
2105
2198
|
rightRender,
|
|
@@ -2123,12 +2216,12 @@ function ListItem({
|
|
|
2123
2216
|
captionStyle
|
|
2124
2217
|
}) {
|
|
2125
2218
|
const { colors } = useTheme();
|
|
2126
|
-
const scale2 =
|
|
2219
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
2127
2220
|
const handlePressIn = () => {
|
|
2128
2221
|
if (!onPress || disabled) return;
|
|
2129
2222
|
reactNative.Animated.spring(scale2, {
|
|
2130
2223
|
toValue: 0.97,
|
|
2131
|
-
useNativeDriver:
|
|
2224
|
+
useNativeDriver: nativeDriver8,
|
|
2132
2225
|
speed: 40,
|
|
2133
2226
|
bounciness: 0
|
|
2134
2227
|
}).start();
|
|
@@ -2136,7 +2229,7 @@ function ListItem({
|
|
|
2136
2229
|
const handlePressOut = () => {
|
|
2137
2230
|
reactNative.Animated.spring(scale2, {
|
|
2138
2231
|
toValue: 1,
|
|
2139
|
-
useNativeDriver:
|
|
2232
|
+
useNativeDriver: nativeDriver8,
|
|
2140
2233
|
speed: 40,
|
|
2141
2234
|
bounciness: 4
|
|
2142
2235
|
}).start();
|
|
@@ -2158,10 +2251,10 @@ function ListItem({
|
|
|
2158
2251
|
shadowRadius: 6,
|
|
2159
2252
|
elevation: 2
|
|
2160
2253
|
} : {};
|
|
2161
|
-
return /* @__PURE__ */
|
|
2254
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [{ transform: [{ scale: scale2 }] }, disabled && styles24.disabled] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
2162
2255
|
reactNative.TouchableOpacity,
|
|
2163
2256
|
{
|
|
2164
|
-
style: [
|
|
2257
|
+
style: [styles24.container, cardStyle, style],
|
|
2165
2258
|
onPress: onPress ? handlePress : void 0,
|
|
2166
2259
|
onPressIn: handlePressIn,
|
|
2167
2260
|
onPressOut: handlePressOut,
|
|
@@ -2169,51 +2262,51 @@ function ListItem({
|
|
|
2169
2262
|
activeOpacity: 1,
|
|
2170
2263
|
touchSoundDisabled: true
|
|
2171
2264
|
},
|
|
2172
|
-
effectiveLeft ? /* @__PURE__ */
|
|
2173
|
-
/* @__PURE__ */
|
|
2265
|
+
effectiveLeft ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles24.leftContainer }, effectiveLeft) : null,
|
|
2266
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles24.content }, /* @__PURE__ */ React25__default.default.createElement(
|
|
2174
2267
|
reactNative.Text,
|
|
2175
2268
|
{
|
|
2176
|
-
style: [
|
|
2269
|
+
style: [styles24.title, { color: colors.foreground }, titleStyle],
|
|
2177
2270
|
numberOfLines: 2,
|
|
2178
2271
|
allowFontScaling: true
|
|
2179
2272
|
},
|
|
2180
2273
|
title
|
|
2181
|
-
), subtitle ? /* @__PURE__ */
|
|
2274
|
+
), subtitle ? /* @__PURE__ */ React25__default.default.createElement(
|
|
2182
2275
|
reactNative.Text,
|
|
2183
2276
|
{
|
|
2184
|
-
style: [
|
|
2277
|
+
style: [styles24.subtitle, { color: colors.mutedForeground }, subtitleStyle],
|
|
2185
2278
|
numberOfLines: 2,
|
|
2186
2279
|
allowFontScaling: true
|
|
2187
2280
|
},
|
|
2188
2281
|
subtitle
|
|
2189
|
-
) : null, caption ? /* @__PURE__ */
|
|
2282
|
+
) : null, caption ? /* @__PURE__ */ React25__default.default.createElement(
|
|
2190
2283
|
reactNative.Text,
|
|
2191
2284
|
{
|
|
2192
|
-
style: [
|
|
2285
|
+
style: [styles24.caption, { color: colors.mutedForeground }, captionStyle],
|
|
2193
2286
|
numberOfLines: 1,
|
|
2194
2287
|
allowFontScaling: true
|
|
2195
2288
|
},
|
|
2196
2289
|
caption
|
|
2197
2290
|
) : null),
|
|
2198
|
-
effectiveRight !== void 0 ? /* @__PURE__ */
|
|
2291
|
+
effectiveRight !== void 0 ? /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles24.rightContainer }, typeof effectiveRight === "string" ? /* @__PURE__ */ React25__default.default.createElement(
|
|
2199
2292
|
reactNative.Text,
|
|
2200
2293
|
{
|
|
2201
|
-
style: [
|
|
2294
|
+
style: [styles24.rightText, { color: colors.mutedForeground }],
|
|
2202
2295
|
allowFontScaling: true
|
|
2203
2296
|
},
|
|
2204
2297
|
effectiveRight
|
|
2205
|
-
) : effectiveRight) : showChevron ? /* @__PURE__ */
|
|
2206
|
-
), showSeparator ? /* @__PURE__ */
|
|
2298
|
+
) : effectiveRight) : showChevron ? /* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-with-circle-right", size: 20, color: colors.mutedForeground }) : null
|
|
2299
|
+
), showSeparator ? /* @__PURE__ */ React25__default.default.createElement(
|
|
2207
2300
|
reactNative.View,
|
|
2208
2301
|
{
|
|
2209
2302
|
style: [
|
|
2210
|
-
|
|
2303
|
+
styles24.separator,
|
|
2211
2304
|
{ backgroundColor: colors.border, marginLeft: effectiveLeft ? s(16) + s(44) + s(12) : s(16) }
|
|
2212
2305
|
]
|
|
2213
2306
|
}
|
|
2214
2307
|
) : null);
|
|
2215
2308
|
}
|
|
2216
|
-
var
|
|
2309
|
+
var styles24 = reactNative.StyleSheet.create({
|
|
2217
2310
|
container: {
|
|
2218
2311
|
flexDirection: "row",
|
|
2219
2312
|
alignItems: "center",
|
|
@@ -2268,12 +2361,12 @@ var styles23 = reactNative.StyleSheet.create({
|
|
|
2268
2361
|
opacity: 0.45
|
|
2269
2362
|
}
|
|
2270
2363
|
});
|
|
2271
|
-
var
|
|
2364
|
+
var nativeDriver9 = reactNative.Platform.OS !== "web";
|
|
2272
2365
|
function Chip({ label, selected = false, onPress, style }) {
|
|
2273
2366
|
const { colors } = useTheme();
|
|
2274
|
-
const scale2 =
|
|
2275
|
-
const pressAnim =
|
|
2276
|
-
|
|
2367
|
+
const scale2 = React25.useRef(new reactNative.Animated.Value(1)).current;
|
|
2368
|
+
const pressAnim = React25.useRef(new reactNative.Animated.Value(selected ? 1 : 0)).current;
|
|
2369
|
+
React25.useEffect(() => {
|
|
2277
2370
|
reactNative.Animated.timing(pressAnim, {
|
|
2278
2371
|
toValue: selected ? 1 : 0,
|
|
2279
2372
|
duration: 150,
|
|
@@ -2284,7 +2377,7 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2284
2377
|
const handlePressIn = () => {
|
|
2285
2378
|
reactNative.Animated.spring(scale2, {
|
|
2286
2379
|
toValue: 0.95,
|
|
2287
|
-
useNativeDriver:
|
|
2380
|
+
useNativeDriver: nativeDriver9,
|
|
2288
2381
|
speed: 40,
|
|
2289
2382
|
bounciness: 0
|
|
2290
2383
|
}).start();
|
|
@@ -2292,7 +2385,7 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2292
2385
|
const handlePressOut = () => {
|
|
2293
2386
|
reactNative.Animated.spring(scale2, {
|
|
2294
2387
|
toValue: 1,
|
|
2295
|
-
useNativeDriver:
|
|
2388
|
+
useNativeDriver: nativeDriver9,
|
|
2296
2389
|
speed: 40,
|
|
2297
2390
|
bounciness: 4
|
|
2298
2391
|
}).start();
|
|
@@ -2313,7 +2406,7 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2313
2406
|
inputRange: [0, 1],
|
|
2314
2407
|
outputRange: [colors.border, colors.primary]
|
|
2315
2408
|
});
|
|
2316
|
-
return /* @__PURE__ */
|
|
2409
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [styles25.wrapper, { transform: [{ scale: scale2 }] }, style] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
2317
2410
|
reactNative.TouchableOpacity,
|
|
2318
2411
|
{
|
|
2319
2412
|
onPress: handlePress,
|
|
@@ -2322,7 +2415,7 @@ function Chip({ label, selected = false, onPress, style }) {
|
|
|
2322
2415
|
activeOpacity: 1,
|
|
2323
2416
|
touchSoundDisabled: true
|
|
2324
2417
|
},
|
|
2325
|
-
/* @__PURE__ */
|
|
2418
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.View, { style: [styles25.chip, { backgroundColor, borderColor }] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.Animated.Text, { style: [styles25.label, { color: textColor }], allowFontScaling: true }, label))
|
|
2326
2419
|
));
|
|
2327
2420
|
}
|
|
2328
2421
|
function ChipGroup({ options, value, onValueChange, multiSelect = false, style }) {
|
|
@@ -2347,7 +2440,7 @@ function ChipGroup({ options, value, onValueChange, multiSelect = false, style }
|
|
|
2347
2440
|
}
|
|
2348
2441
|
return optionValue === value;
|
|
2349
2442
|
};
|
|
2350
|
-
return /* @__PURE__ */
|
|
2443
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles25.group, style] }, options.map((opt) => /* @__PURE__ */ React25__default.default.createElement(
|
|
2351
2444
|
Chip,
|
|
2352
2445
|
{
|
|
2353
2446
|
key: opt.value,
|
|
@@ -2357,7 +2450,7 @@ function ChipGroup({ options, value, onValueChange, multiSelect = false, style }
|
|
|
2357
2450
|
}
|
|
2358
2451
|
)));
|
|
2359
2452
|
}
|
|
2360
|
-
var
|
|
2453
|
+
var styles25 = reactNative.StyleSheet.create({
|
|
2361
2454
|
wrapper: {},
|
|
2362
2455
|
chip: {
|
|
2363
2456
|
borderRadius: 999,
|
|
@@ -2389,18 +2482,18 @@ function ConfirmDialog({
|
|
|
2389
2482
|
onCancel
|
|
2390
2483
|
}) {
|
|
2391
2484
|
const { colors } = useTheme();
|
|
2392
|
-
return /* @__PURE__ */
|
|
2485
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.Modal, { visible, transparent: true, animationType: "fade", onRequestClose: onCancel }, /* @__PURE__ */ React25__default.default.createElement(reactNative.TouchableOpacity, { style: styles26.overlay, activeOpacity: 1, onPress: onCancel }, /* @__PURE__ */ React25__default.default.createElement(
|
|
2393
2486
|
reactNative.View,
|
|
2394
2487
|
{
|
|
2395
|
-
style: [
|
|
2488
|
+
style: [styles26.dialog, { backgroundColor: colors.card }],
|
|
2396
2489
|
onStartShouldSetResponder: () => true
|
|
2397
2490
|
},
|
|
2398
|
-
/* @__PURE__ */
|
|
2399
|
-
description ? /* @__PURE__ */
|
|
2400
|
-
/* @__PURE__ */
|
|
2491
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles26.title, { color: colors.cardForeground }], allowFontScaling: true }, title),
|
|
2492
|
+
description ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles26.description, { color: colors.mutedForeground }], allowFontScaling: true }, description) : null,
|
|
2493
|
+
/* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: styles26.actions }, /* @__PURE__ */ React25__default.default.createElement(Button, { label: cancelLabel, variant: "outline", fullWidth: true, onPress: onCancel }), /* @__PURE__ */ React25__default.default.createElement(Button, { label: confirmLabel, variant: confirmVariant, fullWidth: true, onPress: onConfirm }))
|
|
2401
2494
|
)));
|
|
2402
2495
|
}
|
|
2403
|
-
var
|
|
2496
|
+
var styles26 = reactNative.StyleSheet.create({
|
|
2404
2497
|
overlay: {
|
|
2405
2498
|
flex: 1,
|
|
2406
2499
|
backgroundColor: "rgba(0,0,0,0.5)",
|
|
@@ -2436,9 +2529,9 @@ var styles25 = reactNative.StyleSheet.create({
|
|
|
2436
2529
|
});
|
|
2437
2530
|
function LabelValue({ label, value, style }) {
|
|
2438
2531
|
const { colors } = useTheme();
|
|
2439
|
-
return /* @__PURE__ */
|
|
2532
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles27.container, style] }, /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles27.label, { color: colors.mutedForeground }], allowFontScaling: true }, label), typeof value === "string" ? /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles27.value, { color: colors.foreground }], allowFontScaling: true }, value) : value);
|
|
2440
2533
|
}
|
|
2441
|
-
var
|
|
2534
|
+
var styles27 = reactNative.StyleSheet.create({
|
|
2442
2535
|
container: {
|
|
2443
2536
|
flexDirection: "row",
|
|
2444
2537
|
justifyContent: "space-between",
|
|
@@ -2488,27 +2581,27 @@ function MonthPicker({ value, onChange, style }) {
|
|
|
2488
2581
|
onChange({ month: value.month + 1, year: value.year });
|
|
2489
2582
|
}
|
|
2490
2583
|
};
|
|
2491
|
-
return /* @__PURE__ */
|
|
2584
|
+
return /* @__PURE__ */ React25__default.default.createElement(reactNative.View, { style: [styles28.container, style] }, /* @__PURE__ */ React25__default.default.createElement(
|
|
2492
2585
|
reactNative.TouchableOpacity,
|
|
2493
2586
|
{
|
|
2494
|
-
style:
|
|
2587
|
+
style: styles28.arrow,
|
|
2495
2588
|
onPress: handlePrev,
|
|
2496
2589
|
activeOpacity: 0.6,
|
|
2497
2590
|
touchSoundDisabled: true
|
|
2498
2591
|
},
|
|
2499
|
-
/* @__PURE__ */
|
|
2500
|
-
), /* @__PURE__ */
|
|
2592
|
+
/* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-left", size: 22, color: colors.foreground })
|
|
2593
|
+
), /* @__PURE__ */ React25__default.default.createElement(reactNative.Text, { style: [styles28.label, { color: colors.foreground }], allowFontScaling: true }, MONTH_NAMES[value.month - 1], " ", value.year), /* @__PURE__ */ React25__default.default.createElement(
|
|
2501
2594
|
reactNative.TouchableOpacity,
|
|
2502
2595
|
{
|
|
2503
|
-
style:
|
|
2596
|
+
style: styles28.arrow,
|
|
2504
2597
|
onPress: handleNext,
|
|
2505
2598
|
activeOpacity: 0.6,
|
|
2506
2599
|
touchSoundDisabled: true
|
|
2507
2600
|
},
|
|
2508
|
-
/* @__PURE__ */
|
|
2601
|
+
/* @__PURE__ */ React25__default.default.createElement(vectorIcons.Entypo, { name: "chevron-right", size: 22, color: colors.foreground })
|
|
2509
2602
|
));
|
|
2510
2603
|
}
|
|
2511
|
-
var
|
|
2604
|
+
var styles28 = reactNative.StyleSheet.create({
|
|
2512
2605
|
container: {
|
|
2513
2606
|
flexDirection: "row",
|
|
2514
2607
|
alignItems: "center",
|
|
@@ -2613,6 +2706,7 @@ exports.CurrencyInputLarge = CurrencyInput;
|
|
|
2613
2706
|
exports.EmptyState = EmptyState;
|
|
2614
2707
|
exports.ICON_SIZES = ICON_SIZES;
|
|
2615
2708
|
exports.Icon = Icon;
|
|
2709
|
+
exports.IconButton = IconButton;
|
|
2616
2710
|
exports.Input = Input;
|
|
2617
2711
|
exports.LabelValue = LabelValue;
|
|
2618
2712
|
exports.ListItem = ListItem;
|