@retray-dev/ui-kit 0.1.0 → 1.5.0

package/dist/index.mjs

@@ -1,28 +1,86 @@
-import React3, { useState } from 'react';
-import { StyleSheet, TouchableOpacity, ActivityIndicator, Text, View, TextInput } from 'react-native';
+import React23, { createContext, useMemo, useContext, useRef, useState, useEffect, useCallback } from 'react';
+import { StyleSheet, useColorScheme, Animated, TouchableOpacity, ActivityIndicator, Text, View, TextInput, Image, PanResponder } from 'react-native';
+import * as Haptics11 from 'expo-haptics';
+import { LinearGradient } from 'expo-linear-gradient';
+import ReanimatedAnimated, { useSharedValue, useAnimatedStyle, withTiming, Easing, runOnJS, withSpring } from 'react-native-reanimated';
+import { BottomSheetModal, BottomSheetView, BottomSheetBackdrop } from '@gorhom/bottom-sheet';
+export { BottomSheetModalProvider } from '@gorhom/bottom-sheet';
+import { Gesture, GestureDetector } from 'react-native-gesture-handler';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
-// src/components/Button/Button.tsx
-var containerVariantStyles = {
-  primary: { backgroundColor: "#000" },
-  secondary: { backgroundColor: "#6B7280" },
-  outline: { backgroundColor: "transparent", borderWidth: 1.5, borderColor: "#000" },
-  ghost: { backgroundColor: "transparent" }
+// src/theme/ThemeProvider.tsx
+
+// src/theme/colors.ts
+var defaultLight = {
+  background: "#ffffff",
+  foreground: "#171717",
+  card: "#ffffff",
+  cardForeground: "#171717",
+  primary: "#1a1a1a",
+  primaryForeground: "#fafafa",
+  secondary: "#f5f5f5",
+  secondaryForeground: "#1a1a1a",
+  muted: "#f5f5f5",
+  mutedForeground: "#646464",
+  accent: "#f5f5f5",
+  accentForeground: "#1a1a1a",
+  destructive: "#ef4444",
+  destructiveForeground: "#fafafa",
+  border: "#e5e5e5",
+  input: "#e5e5e5",
+  ring: "#a3a3a3",
+  success: "#16a34a",
+  successForeground: "#ffffff"
 };
-var containerSizeStyles = {
-  sm: { paddingHorizontal: 12, paddingVertical: 6 },
-  md: { paddingHorizontal: 16, paddingVertical: 10 },
-  lg: { paddingHorizontal: 24, paddingVertical: 14 }
+var defaultDark = {
+  background: "#171717",
+  foreground: "#fafafa",
+  card: "#1f1f1f",
+  cardForeground: "#fafafa",
+  primary: "#fafafa",
+  primaryForeground: "#1a1a1a",
+  secondary: "#2a2a2a",
+  secondaryForeground: "#fafafa",
+  muted: "#2a2a2a",
+  mutedForeground: "#a3a3a3",
+  accent: "#2a2a2a",
+  accentForeground: "#fafafa",
+  destructive: "#dc2626",
+  destructiveForeground: "#fafafa",
+  border: "#2a2a2a",
+  input: "#2a2a2a",
+  ring: "#d4d4d4",
+  success: "#22c55e",
+  successForeground: "#ffffff"
 };
-var labelVariantStyles = {
-  primary: { color: "#fff" },
-  secondary: { color: "#fff" },
-  outline: { color: "#000" },
-  ghost: { color: "#000" }
+
+// src/theme/ThemeProvider.tsx
+var ThemeContext = createContext({
+  colors: defaultLight,
+  colorScheme: "light"
+});
+function ThemeProvider({ children, theme, colorScheme = "system" }) {
+  const systemScheme = useColorScheme() ?? "light";
+  const resolvedScheme = colorScheme === "system" ? systemScheme : colorScheme;
+  const colors = useMemo(() => {
+    const base = resolvedScheme === "dark" ? defaultDark : defaultLight;
+    const overrides = resolvedScheme === "dark" ? theme?.dark : theme?.light;
+    return { ...base, ...overrides };
+  }, [resolvedScheme, theme]);
+  return /* @__PURE__ */ React23.createElement(ThemeContext.Provider, { value: { colors, colorScheme: resolvedScheme } }, children);
+}
+function useTheme() {
+  return useContext(ThemeContext);
+}
+var containerSizeStyles = {
+  sm: { paddingHorizontal: 16, paddingVertical: 10 },
+  md: { paddingHorizontal: 20, paddingVertical: 14 },
+  lg: { paddingHorizontal: 28, paddingVertical: 18 }
 };
 var labelSizeStyles = {
-  sm: { fontSize: 13 },
-  md: { fontSize: 15 },
-  lg: { fontSize: 17 }
+  sm: { fontSize: 14 },
+  md: { fontSize: 16 },
+  lg: { fontSize: 18 }
 };
 function Button({
   label,
@@ -30,34 +88,66 @@ function Button({
   size = "md",
   loading = false,
   fullWidth = false,
+  icon,
+  iconPosition = "left",
   disabled,
   style,
+  onPress,
   ...props
 }) {
+  const { colors } = useTheme();
   const isDisabled = disabled || loading;
-  return /* @__PURE__ */ React3.createElement(
+  const scale = useRef(new Animated.Value(1)).current;
+  const handlePressIn = () => {
+    if (isDisabled) return;
+    Animated.spring(scale, {
+      toValue: 0.95,
+      useNativeDriver: true,
+      speed: 40,
+      bounciness: 0
+    }).start();
+  };
+  const handlePressOut = () => {
+    Animated.spring(scale, { toValue: 1, useNativeDriver: true, speed: 40, bounciness: 4 }).start();
+  };
+  const handlePress = (e) => {
+    Haptics11.impactAsync(Haptics11.ImpactFeedbackStyle.Light);
+    onPress?.(e);
+  };
+  const containerVariantStyle = {
+    primary: { backgroundColor: colors.primary },
+    secondary: { backgroundColor: colors.secondary },
+    outline: { backgroundColor: "transparent", borderWidth: 1.5, borderColor: colors.border },
+    ghost: { backgroundColor: "transparent" }
+  }[variant];
+  const labelVariantStyle = {
+    primary: { color: colors.primaryForeground },
+    secondary: { color: colors.secondaryForeground },
+    outline: { color: colors.foreground },
+    ghost: { color: colors.foreground }
+  }[variant];
+  const spinnerColor = variant === "primary" || variant === "secondary" ? colors.primaryForeground : colors.foreground;
+  return /* @__PURE__ */ React23.createElement(Animated.View, { style: [fullWidth && styles.fullWidth, { transform: [{ scale }] }] }, /* @__PURE__ */ React23.createElement(
     TouchableOpacity,
     {
       style: [
         styles.base,
-        containerVariantStyles[variant],
+        containerVariantStyle,
         containerSizeStyles[size],
         fullWidth && styles.fullWidth,
         isDisabled && styles.disabled,
         style
       ],
       disabled: isDisabled,
-      activeOpacity: 0.75,
+      activeOpacity: 1,
+      touchSoundDisabled: true,
+      onPress: handlePress,
+      onPressIn: handlePressIn,
+      onPressOut: handlePressOut,
       ...props
     },
-    loading ? /* @__PURE__ */ React3.createElement(
-      ActivityIndicator,
-      {
-        size: "small",
-        color: variant === "outline" || variant === "ghost" ? "#000" : "#fff"
-      }
-    ) : /* @__PURE__ */ React3.createElement(Text, { style: [styles.label, labelVariantStyles[variant], labelSizeStyles[size]] }, label)
-  );
+    loading ? /* @__PURE__ */ React23.createElement(ActivityIndicator, { size: "small", color: spinnerColor }) : /* @__PURE__ */ React23.createElement(React23.Fragment, null, icon && iconPosition === "left" && /* @__PURE__ */ React23.createElement(React23.Fragment, null, icon), /* @__PURE__ */ React23.createElement(Text, { style: [styles.label, labelVariantStyle, labelSizeStyles[size], icon ? styles.labelWithIcon : void 0] }, label), icon && iconPosition === "right" && /* @__PURE__ */ React23.createElement(React23.Fragment, null, icon))
+  ));
 }
 var styles = StyleSheet.create({
   base: {
@@ -74,35 +164,45 @@ var styles = StyleSheet.create({
   },
   label: {
     fontWeight: "600"
+  },
+  labelWithIcon: {
+    marginHorizontal: 6
   }
 });
 var variantStyles = {
-  h1: { fontSize: 32, fontWeight: "700", lineHeight: 40 },
+  h1: { fontSize: 32, fontWeight: "700", lineHeight: 44 },
   h2: { fontSize: 24, fontWeight: "700", lineHeight: 32 },
   h3: { fontSize: 20, fontWeight: "600", lineHeight: 28 },
   body: { fontSize: 16, fontWeight: "400", lineHeight: 24 },
-  caption: { fontSize: 12, fontWeight: "400", lineHeight: 18, color: "#6B7280" },
+  caption: { fontSize: 12, fontWeight: "400", lineHeight: 18 },
   label: { fontSize: 14, fontWeight: "500", lineHeight: 20 }
 };
 function Text2({ variant = "body", color, style, children, ...props }) {
-  return /* @__PURE__ */ React3.createElement(
+  const { colors } = useTheme();
+  const defaultColor = variant === "caption" ? colors.mutedForeground : colors.foreground;
+  return /* @__PURE__ */ React23.createElement(
     Text,
     {
-      style: [variantStyles[variant], color ? { color } : void 0, style],
+      style: [variantStyles[variant], { color: color ?? defaultColor }, style],
+      allowFontScaling: true,
       ...props
     },
     children
   );
 }
-function Input({ label, error, hint, style, onFocus, onBlur, ...props }) {
+function Input({ label, error, hint, containerStyle, style, onFocus, onBlur, ...props }) {
+  const { colors } = useTheme();
   const [focused, setFocused] = useState(false);
-  return /* @__PURE__ */ React3.createElement(View, { style: styles2.container }, label ? /* @__PURE__ */ React3.createElement(Text, { style: styles2.label }, label) : null, /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles2.container, containerStyle] }, label ? /* @__PURE__ */ React23.createElement(Text, { style: [styles2.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, /* @__PURE__ */ React23.createElement(
     TextInput,
     {
       style: [
         styles2.input,
-        focused && styles2.inputFocused,
-        error ? styles2.inputError : void 0,
+        {
+          borderColor: error ? colors.destructive : focused ? colors.ring : colors.border,
+          color: colors.foreground,
+          backgroundColor: colors.background
+        },
         style
       ],
       onFocus: (e) => {
@@ -113,10 +213,11 @@ function Input({ label, error, hint, style, onFocus, onBlur, ...props }) {
         setFocused(false);
         onBlur?.(e);
       },
-      placeholderTextColor: "#9CA3AF",
+      placeholderTextColor: colors.mutedForeground,
+      allowFontScaling: true,
       ...props
     }
-  ), error ? /* @__PURE__ */ React3.createElement(Text, { style: styles2.errorText }, error) : null, !error && hint ? /* @__PURE__ */ React3.createElement(Text, { style: styles2.hintText }, hint) : null);
+  ), error ? /* @__PURE__ */ React23.createElement(Text, { style: [styles2.helperText, { color: colors.destructive }], allowFontScaling: true }, error) : null, !error && hint ? /* @__PURE__ */ React23.createElement(Text, { style: [styles2.helperText, { color: colors.mutedForeground }], allowFontScaling: true }, hint) : null);
 }
 var styles2 = StyleSheet.create({
   container: {
@@ -125,33 +226,1464 @@ var styles2 = StyleSheet.create({
   label: {
     fontSize: 14,
     fontWeight: "500",
-    color: "#111827",
-    marginBottom: 2
+    marginBottom: 4
+  },
+  input: {
+    borderWidth: 1.5,
+    borderRadius: 8,
+    paddingHorizontal: 16,
+    paddingVertical: 14,
+    fontSize: 16
+  },
+  helperText: {
+    fontSize: 12
+  }
+});
+function Badge({ label, variant = "default", style }) {
+  const { colors } = useTheme();
+  const containerStyle = {
+    default: { backgroundColor: colors.primary },
+    secondary: { backgroundColor: colors.secondary },
+    destructive: { backgroundColor: colors.destructive },
+    outline: { backgroundColor: "transparent", borderWidth: 1, borderColor: colors.border }
+  }[variant];
+  const textColor = {
+    default: colors.primaryForeground,
+    secondary: colors.secondaryForeground,
+    destructive: colors.destructiveForeground,
+    outline: colors.foreground
+  }[variant];
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles3.container, containerStyle, style] }, /* @__PURE__ */ React23.createElement(Text, { style: [styles3.label, { color: textColor }], allowFontScaling: true }, label));
+}
+var styles3 = StyleSheet.create({
+  container: {
+    borderRadius: 6,
+    paddingHorizontal: 8,
+    paddingVertical: 2,
+    alignSelf: "flex-start"
+  },
+  label: {
+    fontSize: 12,
+    fontWeight: "500"
+  }
+});
+function Card({ children, style }) {
+  const { colors } = useTheme();
+  return /* @__PURE__ */ React23.createElement(
+    View,
+    {
+      style: [styles4.card, { backgroundColor: colors.card, borderColor: colors.border }, style]
+    },
+    children
+  );
+}
+function CardHeader({ children, style }) {
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles4.header, style] }, children);
+}
+function CardTitle({ children, style }) {
+  const { colors } = useTheme();
+  return /* @__PURE__ */ React23.createElement(Text, { style: [styles4.title, { color: colors.cardForeground }, style] }, children);
+}
+function CardDescription({ children, style }) {
+  const { colors } = useTheme();
+  return /* @__PURE__ */ React23.createElement(Text, { style: [styles4.description, { color: colors.mutedForeground }, style] }, children);
+}
+function CardContent({ children, style }) {
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles4.content, style] }, children);
+}
+function CardFooter({ children, style }) {
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles4.footer, style] }, children);
+}
+var styles4 = StyleSheet.create({
+  card: {
+    borderRadius: 12,
+    borderWidth: 1,
+    shadowColor: "#000",
+    shadowOffset: { width: 0, height: 1 },
+    shadowOpacity: 0.05,
+    shadowRadius: 2,
+    elevation: 1
+  },
+  header: {
+    padding: 24,
+    paddingBottom: 0,
+    gap: 6
+  },
+  title: {
+    fontSize: 18,
+    fontWeight: "600",
+    lineHeight: 24
+  },
+  description: {
+    fontSize: 14,
+    lineHeight: 20
+  },
+  content: {
+    padding: 24
+  },
+  footer: {
+    padding: 24,
+    paddingTop: 0,
+    flexDirection: "row",
+    alignItems: "center"
+  }
+});
+function Separator({ orientation = "horizontal", style }) {
+  const { colors } = useTheme();
+  return /* @__PURE__ */ React23.createElement(
+    View,
+    {
+      style: [
+        orientation === "horizontal" ? styles5.horizontal : styles5.vertical,
+        { backgroundColor: colors.border },
+        style
+      ]
+    }
+  );
+}
+var styles5 = StyleSheet.create({
+  horizontal: {
+    height: 1,
+    width: "100%"
+  },
+  vertical: {
+    width: 1,
+    height: "100%"
+  }
+});
+var sizeMap = {
+  sm: "small",
+  md: "small",
+  lg: "large"
+};
+function Spinner({ size = "md", color, ...props }) {
+  const { colors } = useTheme();
+  return /* @__PURE__ */ React23.createElement(ActivityIndicator, { size: sizeMap[size], color: color ?? colors.primary, ...props });
+}
+function Skeleton({ width = "100%", height = 16, borderRadius = 6, style }) {
+  const { colors, colorScheme } = useTheme();
+  const shimmerAnim = useRef(new Animated.Value(0)).current;
+  const [containerWidth, setContainerWidth] = useState(300);
+  const shimmerHighlight = colorScheme === "dark" ? "rgba(255,255,255,0.08)" : "rgba(255,255,255,0.7)";
+  useEffect(() => {
+    const animation = Animated.loop(
+      Animated.timing(shimmerAnim, {
+        toValue: 1,
+        duration: 1200,
+        useNativeDriver: true
+      })
+    );
+    animation.start();
+    return () => animation.stop();
+  }, [shimmerAnim]);
+  const translateX = shimmerAnim.interpolate({
+    inputRange: [0, 1],
+    outputRange: [-containerWidth, containerWidth]
+  });
+  return /* @__PURE__ */ React23.createElement(
+    View,
+    {
+      style: [
+        styles6.base,
+        { width, height, borderRadius, backgroundColor: colors.muted },
+        style
+      ],
+      onLayout: (e) => setContainerWidth(e.nativeEvent.layout.width)
+    },
+    /* @__PURE__ */ React23.createElement(Animated.View, { style: [StyleSheet.absoluteFill, { transform: [{ translateX }] }] }, /* @__PURE__ */ React23.createElement(
+      LinearGradient,
+      {
+        colors: ["transparent", shimmerHighlight, "transparent"],
+        start: { x: 0, y: 0 },
+        end: { x: 1, y: 0 },
+        style: StyleSheet.absoluteFill
+      }
+    ))
+  );
+}
+var styles6 = StyleSheet.create({
+  base: {
+    overflow: "hidden"
+  }
+});
+var sizeMap2 = {
+  sm: 24,
+  md: 32,
+  lg: 48,
+  xl: 64
+};
+var fontSizeMap = {
+  sm: 10,
+  md: 13,
+  lg: 18,
+  xl: 24
+};
+function Avatar({ src, fallback, size = "md", style }) {
+  const { colors } = useTheme();
+  const [imageError, setImageError] = useState(false);
+  const dimension = sizeMap2[size];
+  const showFallback = !src || imageError;
+  const containerStyle = {
+    width: dimension,
+    height: dimension,
+    borderRadius: dimension / 2,
+    backgroundColor: colors.muted,
+    overflow: "hidden"
+  };
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles7.base, containerStyle, style] }, !showFallback ? /* @__PURE__ */ React23.createElement(
+    Image,
+    {
+      source: { uri: src },
+      style: { width: dimension, height: dimension },
+      onError: () => setImageError(true)
+    }
+  ) : /* @__PURE__ */ React23.createElement(
+    Text,
+    {
+      style: [styles7.fallback, { color: colors.mutedForeground, fontSize: fontSizeMap[size] }]
+    },
+    fallback?.slice(0, 2).toUpperCase() ?? "?"
+  ));
+}
+var styles7 = StyleSheet.create({
+  base: {
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  fallback: {
+    fontWeight: "500"
+  }
+});
+function Alert({ title, description, variant = "default", icon, style }) {
+  const { colors } = useTheme();
+  const borderColor = variant === "destructive" ? colors.destructive : colors.border;
+  const titleColor = variant === "destructive" ? colors.destructive : colors.foreground;
+  const descColor = variant === "destructive" ? colors.destructive : colors.mutedForeground;
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles8.container, { backgroundColor: colors.card, borderColor }, style] }, icon ? /* @__PURE__ */ React23.createElement(View, { style: styles8.icon }, icon) : null, /* @__PURE__ */ React23.createElement(View, { style: styles8.content }, title ? /* @__PURE__ */ React23.createElement(Text, { style: [styles8.title, { color: titleColor }] }, title) : null, description ? /* @__PURE__ */ React23.createElement(Text, { style: [styles8.description, { color: descColor }] }, description) : null));
+}
+var styles8 = StyleSheet.create({
+  container: {
+    flexDirection: "row",
+    borderWidth: 1,
+    borderRadius: 8,
+    padding: 16,
+    gap: 12
+  },
+  icon: {
+    marginTop: 2
+  },
+  content: {
+    flex: 1,
+    gap: 4
+  },
+  title: {
+    fontSize: 14,
+    fontWeight: "500",
+    lineHeight: 20
+  },
+  description: {
+    fontSize: 14,
+    lineHeight: 20
+  }
+});
+function Progress({ value = 0, max = 100, style }) {
+  const { colors } = useTheme();
+  const percent = Math.min(Math.max(value / max * 100, 0), 100);
+  const [trackWidth, setTrackWidth] = useState(0);
+  const animatedWidth = useRef(new Animated.Value(0)).current;
+  useEffect(() => {
+    if (trackWidth === 0) return;
+    Animated.spring(animatedWidth, {
+      toValue: percent / 100 * trackWidth,
+      useNativeDriver: false,
+      speed: 20,
+      bounciness: 0
+    }).start();
+  }, [percent, trackWidth]);
+  return /* @__PURE__ */ React23.createElement(
+    View,
+    {
+      style: [styles9.track, { backgroundColor: colors.muted }, style],
+      onLayout: (e) => setTrackWidth(e.nativeEvent.layout.width)
+    },
+    /* @__PURE__ */ React23.createElement(
+      Animated.View,
+      {
+        style: [styles9.indicator, { width: animatedWidth, backgroundColor: colors.primary }]
+      }
+    )
+  );
+}
+var styles9 = StyleSheet.create({
+  track: {
+    height: 8,
+    borderRadius: 999,
+    overflow: "hidden",
+    width: "100%"
+  },
+  indicator: {
+    height: "100%",
+    borderRadius: 999
+  }
+});
+function EmptyState({ icon, title, description, action, style }) {
+  const { colors } = useTheme();
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles10.container, { borderColor: colors.border }, style] }, icon ? /* @__PURE__ */ React23.createElement(View, { style: [styles10.iconWrapper, { backgroundColor: colors.muted }] }, icon) : null, /* @__PURE__ */ React23.createElement(View, { style: styles10.textWrapper }, /* @__PURE__ */ React23.createElement(Text, { style: [styles10.title, { color: colors.foreground }] }, title), description ? /* @__PURE__ */ React23.createElement(Text, { style: [styles10.description, { color: colors.mutedForeground }] }, description) : null), action ? /* @__PURE__ */ React23.createElement(View, { style: styles10.action }, action) : null);
+}
+var styles10 = StyleSheet.create({
+  container: {
+    alignItems: "center",
+    justifyContent: "center",
+    borderWidth: 1,
+    borderStyle: "dashed",
+    borderRadius: 12,
+    padding: 32,
+    gap: 16
+  },
+  iconWrapper: {
+    width: 48,
+    height: 48,
+    borderRadius: 12,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  textWrapper: {
+    alignItems: "center",
+    gap: 8,
+    maxWidth: 320
+  },
+  title: {
+    fontSize: 18,
+    fontWeight: "500",
+    textAlign: "center"
+  },
+  description: {
+    fontSize: 14,
+    lineHeight: 20,
+    textAlign: "center"
+  },
+  action: {
+    marginTop: 8
+  }
+});
+function Textarea({
+  label,
+  error,
+  hint,
+  rows = 4,
+  containerStyle,
+  style,
+  onFocus,
+  onBlur,
+  ...props
+}) {
+  const { colors } = useTheme();
+  const [focused, setFocused] = useState(false);
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles11.container, containerStyle] }, label ? /* @__PURE__ */ React23.createElement(Text, { style: [styles11.label, { color: colors.foreground }], allowFontScaling: true }, label) : null, /* @__PURE__ */ React23.createElement(
+    TextInput,
+    {
+      multiline: true,
+      numberOfLines: rows,
+      textAlignVertical: "top",
+      style: [
+        styles11.input,
+        {
+          borderColor: error ? colors.destructive : focused ? colors.ring : colors.border,
+          color: colors.foreground,
+          backgroundColor: colors.background,
+          minHeight: rows * 28
+        },
+        style
+      ],
+      onFocus: (e) => {
+        setFocused(true);
+        onFocus?.(e);
+      },
+      onBlur: (e) => {
+        setFocused(false);
+        onBlur?.(e);
+      },
+      placeholderTextColor: colors.mutedForeground,
+      allowFontScaling: true,
+      ...props
+    }
+  ), error ? /* @__PURE__ */ React23.createElement(Text, { style: [styles11.helperText, { color: colors.destructive }], allowFontScaling: true }, error) : null, !error && hint ? /* @__PURE__ */ React23.createElement(Text, { style: [styles11.helperText, { color: colors.mutedForeground }], allowFontScaling: true }, hint) : null);
+}
+var styles11 = StyleSheet.create({
+  container: {
+    gap: 4
+  },
+  label: {
+    fontSize: 14,
+    fontWeight: "500",
+    marginBottom: 4
   },
   input: {
     borderWidth: 1.5,
-    borderColor: "#D1D5DB",
     borderRadius: 8,
+    paddingHorizontal: 16,
+    paddingVertical: 14,
+    fontSize: 16
+  },
+  helperText: {
+    fontSize: 12
+  }
+});
+function Checkbox({
+  checked = false,
+  onCheckedChange,
+  label,
+  disabled,
+  style
+}) {
+  const { colors } = useTheme();
+  const scale = useRef(new Animated.Value(1)).current;
+  const handlePressIn = () => {
+    if (disabled) return;
+    Animated.spring(scale, { toValue: 0.95, useNativeDriver: true, speed: 40, bounciness: 0 }).start();
+  };
+  const handlePressOut = () => {
+    Animated.spring(scale, { toValue: 1, useNativeDriver: true, speed: 40, bounciness: 4 }).start();
+  };
+  return /* @__PURE__ */ React23.createElement(Animated.View, { style: { transform: [{ scale }] } }, /* @__PURE__ */ React23.createElement(
+    TouchableOpacity,
+    {
+      style: [styles12.row, style],
+      onPress: () => {
+        Haptics11.selectionAsync();
+        onCheckedChange?.(!checked);
+      },
+      onPressIn: handlePressIn,
+      onPressOut: handlePressOut,
+      disabled,
+      activeOpacity: 1,
+      touchSoundDisabled: true
+    },
+    /* @__PURE__ */ React23.createElement(
+      View,
+      {
+        style: [
+          styles12.box,
+          {
+            borderColor: checked ? colors.primary : colors.border,
+            backgroundColor: checked ? colors.primary : "transparent",
+            opacity: disabled ? 0.45 : 1
+          }
+        ]
+      },
+      checked ? /* @__PURE__ */ React23.createElement(View, { style: [styles12.checkmark, { borderColor: colors.primaryForeground }] }) : null
+    ),
+    label ? /* @__PURE__ */ React23.createElement(
+      Text,
+      {
+        style: [styles12.label, { color: disabled ? colors.mutedForeground : colors.foreground }]
+      },
+      label
+    ) : null
+  ));
+}
+var styles12 = StyleSheet.create({
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: 10
+  },
+  box: {
+    width: 24,
+    height: 24,
+    borderRadius: 6,
+    borderWidth: 1.5,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  checkmark: {
+    width: 13,
+    height: 8,
+    borderLeftWidth: 2,
+    borderBottomWidth: 2,
+    transform: [{ rotate: "-45deg" }, { translateY: -1 }]
+  },
+  label: {
+    fontSize: 14,
+    lineHeight: 20
+  }
+});
+var TRACK_WIDTH = 56;
+var TRACK_HEIGHT = 32;
+var THUMB_SIZE = 24;
+var THUMB_OFFSET = 4;
+var THUMB_TRAVEL = TRACK_WIDTH - THUMB_SIZE - THUMB_OFFSET * 2;
+function Switch({ checked = false, onCheckedChange, disabled, style }) {
+  const { colors } = useTheme();
+  const translateX = useRef(new Animated.Value(checked ? THUMB_TRAVEL : 0)).current;
+  const trackOpacity = useRef(new Animated.Value(checked ? 1 : 0)).current;
+  useEffect(() => {
+    Animated.parallel([
+      Animated.spring(translateX, {
+        toValue: checked ? THUMB_TRAVEL : 0,
+        useNativeDriver: true,
+        bounciness: 4
+      }),
+      Animated.timing(trackOpacity, {
+        toValue: checked ? 1 : 0,
+        duration: 150,
+        useNativeDriver: false
+      })
+    ]).start();
+  }, [checked, translateX, trackOpacity]);
+  const trackColor = trackOpacity.interpolate({
+    inputRange: [0, 1],
+    outputRange: [colors.muted, colors.primary]
+  });
+  return /* @__PURE__ */ React23.createElement(
+    TouchableOpacity,
+    {
+      onPress: () => {
+        Haptics11.selectionAsync();
+        onCheckedChange?.(!checked);
+      },
+      disabled,
+      activeOpacity: 0.8,
+      touchSoundDisabled: true,
+      style: [styles13.wrapper, { opacity: disabled ? 0.45 : 1 }, style]
+    },
+    /* @__PURE__ */ React23.createElement(Animated.View, { style: [styles13.track, { backgroundColor: trackColor }] }, /* @__PURE__ */ React23.createElement(
+      Animated.View,
+      {
+        style: [
+          styles13.thumb,
+          { backgroundColor: colors.primaryForeground, transform: [{ translateX }] }
+        ]
+      }
+    ))
+  );
+}
+var styles13 = StyleSheet.create({
+  wrapper: {},
+  track: {
+    width: TRACK_WIDTH,
+    height: TRACK_HEIGHT,
+    borderRadius: TRACK_HEIGHT / 2,
+    justifyContent: "center",
+    paddingHorizontal: THUMB_OFFSET
+  },
+  thumb: {
+    width: THUMB_SIZE,
+    height: THUMB_SIZE,
+    borderRadius: THUMB_SIZE / 2,
+    shadowColor: "#000",
+    shadowOffset: { width: 0, height: 1 },
+    shadowOpacity: 0.15,
+    shadowRadius: 2,
+    elevation: 2
+  }
+});
+var sizeStyles = {
+  sm: { paddingHorizontal: 12, paddingVertical: 8, minWidth: 40, minHeight: 40 },
+  md: { paddingHorizontal: 16, paddingVertical: 12, minWidth: 44, minHeight: 44 },
+  lg: { paddingHorizontal: 20, paddingVertical: 14, minWidth: 48, minHeight: 48 }
+};
+function Toggle({
+  pressed = false,
+  onPressedChange,
+  variant = "default",
+  size = "md",
+  label,
+  icon,
+  disabled,
+  style,
+  ...props
+}) {
+  const { colors } = useTheme();
+  const scale = useRef(new Animated.Value(1)).current;
+  const handlePressIn = () => {
+    if (disabled) return;
+    Animated.spring(scale, { toValue: 0.95, useNativeDriver: true, speed: 40, bounciness: 0 }).start();
+  };
+  const handlePressOut = () => {
+    Animated.spring(scale, { toValue: 1, useNativeDriver: true, speed: 40, bounciness: 4 }).start();
+  };
+  const containerStyle = pressed ? { backgroundColor: colors.accent } : variant === "outline" ? { backgroundColor: "transparent", borderWidth: 1, borderColor: colors.border } : { backgroundColor: "transparent" };
+  const textColor = pressed ? colors.accentForeground : colors.foreground;
+  return /* @__PURE__ */ React23.createElement(Animated.View, { style: { transform: [{ scale }] } }, /* @__PURE__ */ React23.createElement(
+    TouchableOpacity,
+    {
+      style: [styles14.base, containerStyle, sizeStyles[size], disabled && styles14.disabled, style],
+      onPress: () => {
+        Haptics11.selectionAsync();
+        onPressedChange?.(!pressed);
+      },
+      onPressIn: handlePressIn,
+      onPressOut: handlePressOut,
+      disabled,
+      activeOpacity: 1,
+      touchSoundDisabled: true,
+      ...props
+    },
+    icon,
+    label ? /* @__PURE__ */ React23.createElement(Text, { style: [styles14.label, { color: textColor }] }, label) : null
+  ));
+}
+var styles14 = StyleSheet.create({
+  base: {
+    borderRadius: 8,
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 8
+  },
+  disabled: {
+    opacity: 0.45
+  },
+  label: {
+    fontSize: 14,
+    fontWeight: "500"
+  }
+});
+function RadioItem({
+  option,
+  selected,
+  onSelect
+}) {
+  const { colors } = useTheme();
+  const scale = useRef(new Animated.Value(1)).current;
+  const handlePressIn = () => {
+    if (option.disabled) return;
+    Animated.spring(scale, { toValue: 0.95, useNativeDriver: true, speed: 40, bounciness: 0 }).start();
+  };
+  const handlePressOut = () => {
+    Animated.spring(scale, { toValue: 1, useNativeDriver: true, speed: 40, bounciness: 4 }).start();
+  };
+  return /* @__PURE__ */ React23.createElement(Animated.View, { style: { transform: [{ scale }] } }, /* @__PURE__ */ React23.createElement(
+    TouchableOpacity,
+    {
+      style: styles15.row,
+      onPress: () => {
+        if (!option.disabled) {
+          Haptics11.selectionAsync();
+          onSelect();
+        }
+      },
+      onPressIn: handlePressIn,
+      onPressOut: handlePressOut,
+      activeOpacity: 1,
+      touchSoundDisabled: true,
+      disabled: option.disabled
+    },
+    /* @__PURE__ */ React23.createElement(
+      View,
+      {
+        style: [
+          styles15.radio,
+          {
+            borderColor: selected ? colors.primary : colors.border,
+            opacity: option.disabled ? 0.45 : 1
+          }
+        ]
+      },
+      selected ? /* @__PURE__ */ React23.createElement(View, { style: [styles15.dot, { backgroundColor: colors.primary }] }) : null
+    ),
+    /* @__PURE__ */ React23.createElement(
+      Text,
+      {
+        style: [
+          styles15.label,
+          { color: option.disabled ? colors.mutedForeground : colors.foreground }
+        ]
+      },
+      option.label
+    )
+  ));
+}
+function RadioGroup({
+  options,
+  value,
+  onValueChange,
+  orientation = "vertical",
+  style
+}) {
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles15.container, orientation === "horizontal" && styles15.horizontal, style] }, options.map((option) => /* @__PURE__ */ React23.createElement(
+    RadioItem,
+    {
+      key: option.value,
+      option,
+      selected: option.value === value,
+      onSelect: () => onValueChange?.(option.value)
+    }
+  )));
+}
+var styles15 = StyleSheet.create({
+  container: {
+    gap: 10
+  },
+  horizontal: {
+    flexDirection: "row",
+    flexWrap: "wrap"
+  },
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: 10
+  },
+  radio: {
+    width: 24,
+    height: 24,
+    borderRadius: 12,
+    borderWidth: 1.5,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  dot: {
+    width: 10,
+    height: 10,
+    borderRadius: 5
+  },
+  label: {
+    fontSize: 14,
+    lineHeight: 20
+  }
+});
+function TabTrigger({
+  tab,
+  isActive,
+  onPress,
+  onLayout
+}) {
+  const { colors } = useTheme();
+  const scale = useRef(new Animated.Value(1)).current;
+  const handlePressIn = () => {
+    Animated.spring(scale, { toValue: 0.95, useNativeDriver: true, speed: 40, bounciness: 0 }).start();
+  };
+  const handlePressOut = () => {
+    Animated.spring(scale, { toValue: 1, useNativeDriver: true, speed: 40, bounciness: 4 }).start();
+  };
+  return /* @__PURE__ */ React23.createElement(
+    TouchableOpacity,
+    {
+      style: styles16.trigger,
+      onPress,
+      onPressIn: handlePressIn,
+      onPressOut: handlePressOut,
+      onLayout,
+      activeOpacity: 1,
+      touchSoundDisabled: true
+    },
+    /* @__PURE__ */ React23.createElement(Animated.View, { style: { transform: [{ scale }] } }, /* @__PURE__ */ React23.createElement(
+      Text,
+      {
+        style: [
+          styles16.triggerLabel,
+          { color: isActive ? colors.foreground : colors.mutedForeground },
+          isActive && styles16.activeTriggerLabel
+        ]
+      },
+      tab.label
+    ))
+  );
+}
+function Tabs({ tabs, value, onValueChange, children, style }) {
+  const [internal, setInternal] = useState(tabs[0]?.value ?? "");
+  const { colors } = useTheme();
+  const active = value ?? internal;
+  const tabLayouts = useRef({});
+  const pillX = useRef(new Animated.Value(0)).current;
+  const pillWidth = useRef(new Animated.Value(0)).current;
+  const initialised = useRef(false);
+  const animatePill = (tabValue, animate) => {
+    const layout = tabLayouts.current[tabValue];
+    if (!layout) return;
+    if (animate) {
+      Animated.parallel([
+        Animated.spring(pillX, {
+          toValue: layout.x,
+          useNativeDriver: false,
+          speed: 20,
+          bounciness: 0
+        }),
+        Animated.spring(pillWidth, {
+          toValue: layout.width,
+          useNativeDriver: false,
+          speed: 20,
+          bounciness: 0
+        })
+      ]).start();
+    } else {
+      pillX.setValue(layout.x);
+      pillWidth.setValue(layout.width);
+    }
+  };
+  useEffect(() => {
+    if (initialised.current) {
+      animatePill(active, true);
+    }
+  }, [active]);
+  const handlePress = (v) => {
+    Haptics11.selectionAsync();
+    if (!value) setInternal(v);
+    onValueChange?.(v);
+  };
+  return /* @__PURE__ */ React23.createElement(View, { style }, /* @__PURE__ */ React23.createElement(View, { style: [styles16.list, { backgroundColor: colors.muted }] }, /* @__PURE__ */ React23.createElement(
+    Animated.View,
+    {
+      style: [
+        styles16.pill,
+        {
+          backgroundColor: colors.background,
+          position: "absolute",
+          top: 4,
+          bottom: 4,
+          left: pillX,
+          width: pillWidth,
+          borderRadius: 6,
+          shadowColor: "#000",
+          shadowOffset: { width: 0, height: 1 },
+          shadowOpacity: 0.1,
+          shadowRadius: 2,
+          elevation: 2
+        }
+      ]
+    }
+  ), tabs.map((tab) => /* @__PURE__ */ React23.createElement(
+    TabTrigger,
+    {
+      key: tab.value,
+      tab,
+      isActive: tab.value === active,
+      onPress: () => handlePress(tab.value),
+      onLayout: (e) => {
+        const { x, width } = e.nativeEvent.layout;
+        tabLayouts.current[tab.value] = { x, width };
+        if (tab.value === active) {
+          animatePill(tab.value, false);
+          initialised.current = true;
+        }
+      }
+    }
+  ))), children);
+}
+function TabsContent({ value, activeValue, children, style }) {
+  if (value !== activeValue) return null;
+  return /* @__PURE__ */ React23.createElement(View, { style }, children);
+}
+var styles16 = StyleSheet.create({
+  list: {
+    flexDirection: "row",
+    borderRadius: 8,
+    padding: 4,
+    gap: 4
+  },
+  pill: {},
+  trigger: {
+    flex: 1,
+    paddingVertical: 8,
     paddingHorizontal: 12,
-    paddingVertical: 10,
+    borderRadius: 6,
+    alignItems: "center",
+    justifyContent: "center",
+    zIndex: 1
+  },
+  triggerLabel: {
+    fontSize: 14,
+    fontWeight: "400"
+  },
+  activeTriggerLabel: {
+    fontWeight: "500"
+  }
+});
+function AccordionItemComponent({
+  item,
+  isOpen,
+  onToggle
+}) {
+  const { colors } = useTheme();
+  const animatedHeight = useSharedValue(0);
+  const animatedRotation = useSharedValue(0);
+  const contentHeight = useRef(0);
+  const scale = useRef(new Animated.Value(1)).current;
+  const toggle = (open) => {
+    const easing = open ? Easing.out(Easing.ease) : Easing.in(Easing.ease);
+    animatedHeight.value = withTiming(open ? contentHeight.current : 0, { duration: 220, easing });
+    animatedRotation.value = withTiming(open ? 1 : 0, { duration: 220, easing });
+  };
+  React23.useEffect(() => {
+    toggle(isOpen);
+  }, [isOpen]);
+  const onLayout = (e) => {
+    if (contentHeight.current === 0) {
+      contentHeight.current = e.nativeEvent.layout.height;
+      if (isOpen) animatedHeight.value = contentHeight.current;
+    }
+  };
+  const heightStyle = useAnimatedStyle(() => ({
+    height: animatedHeight.value,
+    overflow: "hidden"
+  }));
+  const rotationStyle = useAnimatedStyle(() => ({
+    transform: [{ rotate: `${animatedRotation.value * 180}deg` }]
+  }));
+  const handlePressIn = () => {
+    Animated.spring(scale, { toValue: 0.95, useNativeDriver: true, speed: 40, bounciness: 0 }).start();
+  };
+  const handlePressOut = () => {
+    Animated.spring(scale, { toValue: 1, useNativeDriver: true, speed: 40, bounciness: 4 }).start();
+  };
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles17.item, { borderBottomColor: colors.border }] }, /* @__PURE__ */ React23.createElement(Animated.View, { style: { transform: [{ scale }] } }, /* @__PURE__ */ React23.createElement(
+    TouchableOpacity,
+    {
+      style: styles17.trigger,
+      onPress: () => {
+        Haptics11.selectionAsync();
+        onToggle();
+      },
+      onPressIn: handlePressIn,
+      onPressOut: handlePressOut,
+      activeOpacity: 1,
+      touchSoundDisabled: true
+    },
+    /* @__PURE__ */ React23.createElement(Text, { style: [styles17.triggerText, { color: colors.foreground }] }, item.trigger),
+    /* @__PURE__ */ React23.createElement(
+      ReanimatedAnimated.Text,
+      {
+        style: [styles17.chevron, { color: colors.foreground }, rotationStyle]
+      },
+      "\u25BE"
+    )
+  )), /* @__PURE__ */ React23.createElement(ReanimatedAnimated.View, { style: heightStyle }, /* @__PURE__ */ React23.createElement(View, { style: styles17.content, onLayout }, item.content)));
+}
+function Accordion({ items, type = "single", defaultValue, style }) {
+  const [openValues, setOpenValues] = useState(() => {
+    if (!defaultValue) return [];
+    return Array.isArray(defaultValue) ? defaultValue : [defaultValue];
+  });
+  const toggle = (value) => {
+    if (type === "single") {
+      setOpenValues((prev) => prev.includes(value) ? [] : [value]);
+    } else {
+      setOpenValues(
+        (prev) => prev.includes(value) ? prev.filter((v) => v !== value) : [...prev, value]
+      );
+    }
+  };
+  return /* @__PURE__ */ React23.createElement(View, { style }, items.map((item) => /* @__PURE__ */ React23.createElement(
+    AccordionItemComponent,
+    {
+      key: item.value,
+      item,
+      isOpen: openValues.includes(item.value),
+      onToggle: () => toggle(item.value)
+    }
+  )));
+}
+var styles17 = StyleSheet.create({
+  item: {
+    borderBottomWidth: 1
+  },
+  trigger: {
+    flexDirection: "row",
+    justifyContent: "space-between",
+    alignItems: "center",
+    paddingVertical: 16
+  },
+  triggerText: {
     fontSize: 15,
-    color: "#111827",
-    backgroundColor: "#fff"
+    fontWeight: "500",
+    flex: 1
   },
-  inputFocused: {
-    borderColor: "#000"
+  chevron: {
+    fontSize: 16,
+    marginLeft: 8
   },
-  inputError: {
-    borderColor: "#EF4444"
+  content: {
+    paddingBottom: 16,
+    position: "absolute",
+    width: "100%"
+  }
+});
+function Slider({
+  value = 0,
+  minimumValue = 0,
+  maximumValue = 1,
+  step = 0,
+  onValueChange,
+  onSlidingComplete,
+  disabled,
+  style
+}) {
+  const { colors } = useTheme();
+  const trackWidth = useRef(0);
+  const lastSteppedValue = useRef(value);
+  const [internalValue, setInternalValue] = useState(value);
+  const currentValue = value ?? internalValue;
+  const clamp = (v) => Math.min(Math.max(v, minimumValue), maximumValue);
+  const snapToStep = (v) => {
+    if (!step) return v;
+    return Math.round((v - minimumValue) / step) * step + minimumValue;
+  };
+  const xToValue = (x) => {
+    const ratio = Math.min(Math.max(x / trackWidth.current, 0), 1);
+    const raw = ratio * (maximumValue - minimumValue) + minimumValue;
+    return clamp(snapToStep(raw));
+  };
+  const panResponder = useRef(
+    PanResponder.create({
+      onStartShouldSetPanResponder: () => !disabled,
+      onMoveShouldSetPanResponder: () => !disabled,
+      onPanResponderGrant: (e) => {
+        const x = e.nativeEvent.locationX;
+        const newValue = xToValue(x);
+        setInternalValue(newValue);
+        onValueChange?.(newValue);
+      },
+      onPanResponderMove: (e) => {
+        const x = e.nativeEvent.locationX;
+        const newValue = xToValue(x);
+        if (newValue !== lastSteppedValue.current) {
+          lastSteppedValue.current = newValue;
+          Haptics11.selectionAsync();
+        }
+        setInternalValue(newValue);
+        onValueChange?.(newValue);
+      },
+      onPanResponderRelease: (e) => {
+        const x = e.nativeEvent.locationX;
+        const newValue = xToValue(x);
+        setInternalValue(newValue);
+        onSlidingComplete?.(newValue);
+      }
+    })
+  ).current;
+  const onLayout = (e) => {
+    trackWidth.current = e.nativeEvent.layout.width;
+  };
+  const percent = (currentValue - minimumValue) / (maximumValue - minimumValue) * 100;
+  return /* @__PURE__ */ React23.createElement(
+    View,
+    {
+      style: [styles18.container, disabled && styles18.disabled, style],
+      ...panResponder.panHandlers,
+      onLayout
+    },
+    /* @__PURE__ */ React23.createElement(View, { style: [styles18.track, { backgroundColor: colors.muted }] }, /* @__PURE__ */ React23.createElement(
+      View,
+      {
+        style: [styles18.range, { width: `${percent}%`, backgroundColor: colors.primary }]
+      }
+    )),
+    /* @__PURE__ */ React23.createElement(
+      View,
+      {
+        style: [
+          styles18.thumb,
+          {
+            left: `${percent}%`,
+            backgroundColor: colors.primary,
+            borderColor: colors.background,
+            transform: [{ translateX: -14 }]
+          }
+        ],
+        pointerEvents: "none"
+      }
+    )
+  );
+}
+var styles18 = StyleSheet.create({
+  container: {
+    height: 32,
+    justifyContent: "center",
+    position: "relative"
   },
-  errorText: {
-    fontSize: 12,
-    color: "#EF4444"
+  disabled: {
+    opacity: 0.45
   },
-  hintText: {
-    fontSize: 12,
-    color: "#6B7280"
+  track: {
+    height: 6,
+    borderRadius: 3,
+    overflow: "hidden",
+    width: "100%"
+  },
+  range: {
+    height: "100%",
+    borderRadius: 3
+  },
+  thumb: {
+    position: "absolute",
+    width: 28,
+    height: 28,
+    borderRadius: 14,
+    borderWidth: 2,
+    shadowColor: "#000",
+    shadowOffset: { width: 0, height: 1 },
+    shadowOpacity: 0.2,
+    shadowRadius: 2,
+    elevation: 2
+  }
+});
+function Sheet({
+  open,
+  onClose,
+  title,
+  description,
+  children,
+  snapPoints = ["50%"],
+  style
+}) {
+  const { colors } = useTheme();
+  const ref = useRef(null);
+  useEffect(() => {
+    if (open) {
+      Haptics11.impactAsync(Haptics11.ImpactFeedbackStyle.Light);
+      ref.current?.present();
+    } else {
+      ref.current?.dismiss();
+    }
+  }, [open]);
+  const renderBackdrop = (props) => /* @__PURE__ */ React23.createElement(
+    BottomSheetBackdrop,
+    {
+      ...props,
+      disappearsOnIndex: -1,
+      appearsOnIndex: 0,
+      pressBehavior: "close"
+    }
+  );
+  return /* @__PURE__ */ React23.createElement(
+    BottomSheetModal,
+    {
+      ref,
+      snapPoints,
+      onDismiss: onClose,
+      backdropComponent: renderBackdrop,
+      backgroundStyle: [styles19.background, { backgroundColor: colors.card }],
+      handleIndicatorStyle: [styles19.handle, { backgroundColor: colors.border }],
+      enablePanDownToClose: true
+    },
+    /* @__PURE__ */ React23.createElement(BottomSheetView, { style: [styles19.content, style] }, title || description ? /* @__PURE__ */ React23.createElement(View, { style: styles19.header }, title ? /* @__PURE__ */ React23.createElement(Text, { style: [styles19.title, { color: colors.cardForeground }] }, title) : null, description ? /* @__PURE__ */ React23.createElement(Text, { style: [styles19.description, { color: colors.mutedForeground }] }, description) : null) : null, children)
+  );
+}
+var styles19 = StyleSheet.create({
+  background: {
+    borderTopLeftRadius: 16,
+    borderTopRightRadius: 16
+  },
+  handle: {
+    width: 36,
+    height: 4,
+    borderRadius: 2
+  },
+  content: {
+    paddingHorizontal: 24,
+    paddingBottom: 32
+  },
+  header: {
+    gap: 8,
+    marginBottom: 16
+  },
+  title: {
+    fontSize: 18,
+    fontWeight: "600"
+  },
+  description: {
+    fontSize: 14,
+    lineHeight: 20
+  }
+});
+function Select({
+  options,
+  value,
+  onValueChange,
+  placeholder = "Select an option",
+  label,
+  error,
+  disabled,
+  style
+}) {
+  const { colors } = useTheme();
+  const bottomSheetRef = useRef(null);
+  const scale = useRef(new Animated.Value(1)).current;
+  const selected = options.find((o) => o.value === value);
+  const handlePressIn = () => {
+    if (disabled) return;
+    Animated.spring(scale, { toValue: 0.95, useNativeDriver: true, speed: 40, bounciness: 0 }).start();
+  };
+  const handlePressOut = () => {
+    Animated.spring(scale, { toValue: 1, useNativeDriver: true, speed: 40, bounciness: 4 }).start();
+  };
+  const handleOpen = () => {
+    if (!disabled) {
+      Haptics11.selectionAsync();
+      bottomSheetRef.current?.present();
+    }
+  };
+  const renderBackdrop = useCallback(
+    (props) => /* @__PURE__ */ React23.createElement(
+      BottomSheetBackdrop,
+      {
+        ...props,
+        disappearsOnIndex: -1,
+        appearsOnIndex: 0,
+        pressBehavior: "close"
+      }
+    ),
+    []
+  );
+  return /* @__PURE__ */ React23.createElement(View, { style: [styles20.container, style] }, label ? /* @__PURE__ */ React23.createElement(Text, { style: [styles20.label, { color: colors.foreground }] }, label) : null, /* @__PURE__ */ React23.createElement(Animated.View, { style: { transform: [{ scale }], opacity: disabled ? 0.45 : 1 } }, /* @__PURE__ */ React23.createElement(
+    TouchableOpacity,
+    {
+      style: [
+        styles20.trigger,
+        {
+          borderColor: error ? colors.destructive : colors.border,
+          backgroundColor: colors.background
+        }
+      ],
+      onPress: handleOpen,
+      onPressIn: handlePressIn,
+      onPressOut: handlePressOut,
+      activeOpacity: 1,
+      touchSoundDisabled: true
+    },
+    /* @__PURE__ */ React23.createElement(
+      Text,
+      {
+        style: [
+          styles20.triggerText,
+          { color: selected ? colors.foreground : colors.mutedForeground }
+        ],
+        numberOfLines: 1
+      },
+      selected?.label ?? placeholder
+    ),
+    /* @__PURE__ */ React23.createElement(Text, { style: [styles20.chevron, { color: colors.mutedForeground }] }, "\u25BE")
+  )), error ? /* @__PURE__ */ React23.createElement(Text, { style: [styles20.helperText, { color: colors.destructive }] }, error) : null, /* @__PURE__ */ React23.createElement(
+    BottomSheetModal,
+    {
+      ref: bottomSheetRef,
+      enableDynamicSizing: true,
+      enablePanDownToClose: true,
+      backdropComponent: renderBackdrop,
+      backgroundStyle: [styles20.sheetBackground, { backgroundColor: colors.card }],
+      handleIndicatorStyle: [styles20.sheetHandle, { backgroundColor: colors.border }]
+    },
+    /* @__PURE__ */ React23.createElement(BottomSheetView, { style: styles20.sheetContent }, label ? /* @__PURE__ */ React23.createElement(Text, { style: [styles20.sheetTitle, { color: colors.foreground }] }, label) : null, options.map((item) => {
+      const isSelected = item.value === value;
+      return /* @__PURE__ */ React23.createElement(
+        TouchableOpacity,
+        {
+          key: item.value,
+          style: [
+            styles20.option,
+            isSelected && { backgroundColor: colors.accent },
+            item.disabled && styles20.disabledOption
+          ],
+          onPress: () => {
+            if (!item.disabled) {
+              Haptics11.selectionAsync();
+              onValueChange?.(item.value);
+              bottomSheetRef.current?.dismiss();
+            }
+          },
+          activeOpacity: 0.7,
+          touchSoundDisabled: true
+        },
+        /* @__PURE__ */ React23.createElement(
+          Text,
+          {
+            style: [
+              styles20.optionText,
+              { color: item.disabled ? colors.mutedForeground : colors.foreground },
+              isSelected && { fontWeight: "500" }
+            ]
+          },
+          item.label
+        ),
+        isSelected ? /* @__PURE__ */ React23.createElement(Text, { style: [styles20.checkmark, { color: colors.primary }] }, "\u2713") : null
+      );
+    }))
+  ));
+}
+var styles20 = StyleSheet.create({
+  container: {
+    gap: 4
+  },
+  label: {
+    fontSize: 14,
+    fontWeight: "500",
+    marginBottom: 2
+  },
+  trigger: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    borderWidth: 1.5,
+    borderRadius: 8,
+    paddingHorizontal: 16,
+    paddingVertical: 14
+  },
+  triggerText: {
+    fontSize: 16,
+    flex: 1
+  },
+  chevron: {
+    fontSize: 14,
+    marginLeft: 8
+  },
+  helperText: {
+    fontSize: 12
+  },
+  sheetBackground: {
+    borderTopLeftRadius: 16,
+    borderTopRightRadius: 16
+  },
+  sheetHandle: {
+    width: 36,
+    height: 4,
+    borderRadius: 2
+  },
+  sheetContent: {
+    paddingHorizontal: 16,
+    paddingBottom: 32
+  },
+  sheetTitle: {
+    fontSize: 16,
+    fontWeight: "600",
+    paddingVertical: 12,
+    paddingHorizontal: 4
+  },
+  option: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    paddingHorizontal: 12,
+    paddingVertical: 14,
+    borderRadius: 8
+  },
+  optionText: {
+    fontSize: 15,
+    flex: 1
+  },
+  disabledOption: {
+    opacity: 0.45
+  },
+  checkmark: {
+    fontSize: 14,
+    fontWeight: "600",
+    marginLeft: 8
+  }
+});
+var ToastContext = createContext({
+  toast: () => {
+  },
+  dismiss: () => {
+  }
+});
+function useToast() {
+  return useContext(ToastContext);
+}
+var SWIPE_THRESHOLD = 80;
+var VELOCITY_THRESHOLD = 800;
+function ToastNotification({ item, onDismiss }) {
+  const { colors } = useTheme();
+  const translateY = useSharedValue(-80);
+  const translateX = useSharedValue(0);
+  const opacity = useSharedValue(0);
+  useEffect(() => {
+    translateY.value = withTiming(0, { duration: 120, easing: Easing.out(Easing.exp) });
+    opacity.value = withTiming(1, { duration: 100 });
+    const timer = setTimeout(() => {
+      translateY.value = withTiming(-80, { duration: 200 });
+      opacity.value = withTiming(0, { duration: 200 }, (done) => {
+        if (done) runOnJS(onDismiss)();
+      });
+    }, item.duration ?? 3e3);
+    return () => clearTimeout(timer);
+  }, []);
+  const panGesture = Gesture.Pan().onUpdate((e) => {
+    translateX.value = e.translationX;
+  }).onEnd((e) => {
+    const shouldDismiss = Math.abs(translateX.value) > SWIPE_THRESHOLD || Math.abs(e.velocityX) > VELOCITY_THRESHOLD;
+    if (shouldDismiss) {
+      const direction = translateX.value > 0 ? 1 : -1;
+      translateX.value = withTiming(direction * 500, { duration: 200 }, (done) => {
+        if (done) runOnJS(onDismiss)();
+      });
+      opacity.value = withTiming(0, { duration: 150 });
+    } else {
+      translateX.value = withSpring(0, { damping: 20, stiffness: 300 });
+    }
+  });
+  const animatedStyle = useAnimatedStyle(() => ({
+    opacity: opacity.value,
+    transform: [{ translateY: translateY.value }, { translateX: translateX.value }]
+  }));
+  const bgColor = {
+    default: colors.foreground,
+    destructive: colors.destructive,
+    success: colors.success
+  }[item.variant ?? "default"];
+  const textColor = {
+    default: colors.background,
+    destructive: colors.destructiveForeground,
+    success: colors.successForeground
+  }[item.variant ?? "default"];
+  return /* @__PURE__ */ React23.createElement(GestureDetector, { gesture: panGesture }, /* @__PURE__ */ React23.createElement(ReanimatedAnimated.View, { style: [styles21.toast, { backgroundColor: bgColor }, animatedStyle] }, /* @__PURE__ */ React23.createElement(View, { style: styles21.toastContent }, item.title ? /* @__PURE__ */ React23.createElement(Text, { style: [styles21.toastTitle, { color: textColor }] }, item.title) : null, item.description ? /* @__PURE__ */ React23.createElement(Text, { style: [styles21.toastDescription, { color: textColor, opacity: 0.85 }] }, item.description) : null), /* @__PURE__ */ React23.createElement(TouchableOpacity, { onPress: onDismiss, style: styles21.dismissButton, touchSoundDisabled: true }, /* @__PURE__ */ React23.createElement(Text, { style: [styles21.dismissIcon, { color: textColor }] }, "\u2715"))));
+}
+function ToastProvider({ children }) {
+  const [toasts, setToasts] = useState([]);
+  const insets = useSafeAreaInsets();
+  const toast = useCallback((item) => {
+    const id = Math.random().toString(36).slice(2);
+    if (item.variant === "success") {
+      Haptics11.notificationAsync(Haptics11.NotificationFeedbackType.Success);
+    } else if (item.variant === "destructive") {
+      Haptics11.notificationAsync(Haptics11.NotificationFeedbackType.Error);
+    } else {
+      Haptics11.impactAsync(Haptics11.ImpactFeedbackStyle.Light);
+    }
+    setToasts((prev) => [{ ...item, id }, ...prev].slice(0, 3));
+  }, []);
+  const dismiss = useCallback((id) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id));
+  }, []);
+  return /* @__PURE__ */ React23.createElement(ToastContext.Provider, { value: { toast, dismiss } }, children, /* @__PURE__ */ React23.createElement(View, { style: [styles21.container, { top: insets.top + 8 }], pointerEvents: "box-none" }, toasts.map((item) => /* @__PURE__ */ React23.createElement(ToastNotification, { key: item.id, item, onDismiss: () => dismiss(item.id) }))));
+}
+var styles21 = StyleSheet.create({
+  container: {
+    position: "absolute",
+    left: 16,
+    right: 16,
+    gap: 8,
+    zIndex: 9999
+  },
+  toast: {
+    flexDirection: "row",
+    alignItems: "center",
+    borderRadius: 12,
+    paddingHorizontal: 16,
+    paddingVertical: 12,
+    shadowColor: "#000",
+    shadowOffset: { width: 0, height: 4 },
+    shadowOpacity: 0.15,
+    shadowRadius: 8,
+    elevation: 6
+  },
+  toastContent: {
+    flex: 1,
+    gap: 4
+  },
+  toastTitle: {
+    fontSize: 14,
+    fontWeight: "600"
+  },
+  toastDescription: {
+    fontSize: 13
+  },
+  dismissButton: {
+    padding: 12,
+    marginLeft: 4
+  },
+  dismissIcon: {
+    fontSize: 12
   }
 });
 
-export { Button, Input, Text2 as Text };
+export { Accordion, Alert, Avatar, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, EmptyState, Input, Progress, RadioGroup, Select, Separator, Sheet, Skeleton, Slider, Spinner, Switch, Tabs, TabsContent, Text2 as Text, Textarea, ThemeProvider, ToastProvider, Toggle, defaultDark, defaultLight, useTheme, useToast };