@hoddy-ui/core 1.1.4 → 2.0.35

package/next/dist/index.js

@@ -61,7 +61,8 @@ __export(next_exports, {
   showFlashMessage: () => showFlashMessage,
   useColors: () => useColors,
   useNavScreenOptions: () => useNavScreenOptions,
-  useTheme: () => useTheme
+  useTheme: () => useTheme,
+  useThemeContext: () => useThemeContext
 });
 module.exports = __toCommonJS(next_exports);
 
@@ -228,7 +229,7 @@ function initialize(config2) {
   try {
     setConfig({
       GOOGLE_MAP_API_KEY: config2.googleMapApiKey,
-      DEFAULT_FONT_FAMILY: config2.fontFamily,
+      TYPOGRAPHY: config2.typography,
       EDGE_TO_EDGE: config2.edgeToEdge ?? false
     });
     if (config2.colors)
@@ -246,7 +247,6 @@ var import_react_native5 = require("react-native");
 // ../src/hooks.ts
 var import_react4 = require("react");
 var import_react_native4 = require("react-native");
-var import_react_native_size_matters3 = require("react-native-size-matters");
 
 // ../src/theme/index.tsx
 var import_async_storage = __toESM(require("@react-native-async-storage/async-storage"));
@@ -259,6 +259,7 @@ var import_react_native_safe_area_context2 = require("react-native-safe-area-con
 // ../src/Components/FlashMessage.tsx
 var import_react2 = __toESM(require("react"));
 var import_react_native2 = require("react-native");
+var import_react_native_reanimated = __toESM(require("react-native-reanimated"));
 var import_react_native_safe_area_context = require("react-native-safe-area-context");
 var import_react_native_size_matters2 = require("react-native-size-matters");
 
@@ -266,12 +267,19 @@ var import_react_native_size_matters2 = require("react-native-size-matters");
 var import_react = __toESM(require("react"));
 var import_react_native = require("react-native");
 var import_react_native_size_matters = require("react-native-size-matters");
+
+// ../src/utility.ts
+var getFontFamily = (fontWeight) => {
+  return getConfig().TYPOGRAPHY?.fontWeights?.[fontWeight] || getConfig().TYPOGRAPHY?.fontFamily || void 0;
+};
+
+// ../src/Components/Typography.tsx
 var Typography = (0, import_react.forwardRef)(
   ({
     children,
     color = "dark",
     style = {},
-    textCase = null,
+    textCase,
     variant = "body1",
     align = "left",
     gutterBottom = 0,
@@ -279,31 +287,33 @@ var Typography = (0, import_react.forwardRef)(
     fontWeight = 400,
     fontFamily,
     // NEW PROP ADDED
+    fontSize,
     ...props
   }, ref) => {
     const colors2 = useColors();
-    const fontSize = {
-      h1: (0, import_react_native_size_matters.moderateScale)(42),
-      h2: (0, import_react_native_size_matters.moderateScale)(37),
-      h3: (0, import_react_native_size_matters.moderateScale)(32),
-      h4: (0, import_react_native_size_matters.moderateScale)(27),
-      h5: (0, import_react_native_size_matters.moderateScale)(22),
-      h6: (0, import_react_native_size_matters.moderateScale)(17),
-      body1: (0, import_react_native_size_matters.moderateScale)(15),
-      body2: (0, import_react_native_size_matters.moderateScale)(12),
-      caption: (0, import_react_native_size_matters.moderateScale)(10)
+    const _fontSize = {
+      h1: (0, import_react_native_size_matters.ms)(42),
+      h2: (0, import_react_native_size_matters.ms)(37),
+      h3: (0, import_react_native_size_matters.ms)(32),
+      h4: (0, import_react_native_size_matters.ms)(27),
+      h5: (0, import_react_native_size_matters.ms)(22),
+      h6: (0, import_react_native_size_matters.ms)(17),
+      body1: (0, import_react_native_size_matters.ms)(15),
+      body2: (0, import_react_native_size_matters.ms)(12),
+      caption: (0, import_react_native_size_matters.ms)(10)
     };
-    const styles2 = import_react_native.StyleSheet.create({
+    const f = fontSize || _fontSize[variant];
+    const styles = import_react_native.StyleSheet.create({
       text: {
-        fontSize: fontSize[variant],
-        marginBottom: (0, import_react_native_size_matters.verticalScale)(gutterBottom) || 0,
+        lineHeight: f * 1.2,
+        fontSize: f,
+        marginBottom: (0, import_react_native_size_matters.ms)(gutterBottom) || 0,
         color: colors2[color]?.main || color,
         textTransform: textCase,
         alignItems: "center",
         textAlign: align,
         fontWeight,
-        fontFamily: fontFamily || getConfig().DEFAULT_FONT_FAMILY || void 0
-        // Use custom font if provided, else default
+        fontFamily: fontFamily || getFontFamily(fontWeight)
       }
     });
     return /* @__PURE__ */ import_react.default.createElement(
@@ -311,7 +321,7 @@ var Typography = (0, import_react.forwardRef)(
       {
         ref,
         adjustsFontSizeToFit,
-        style: [styles2.text, style],
+        style: [styles.text, style],
         ...props
       },
       children
@@ -321,33 +331,76 @@ var Typography = (0, import_react.forwardRef)(
 var Typography_default = Typography;
 
 // ../src/Components/FlashMessage.tsx
-var showFlashMessage = () => {
+var flashListeners = /* @__PURE__ */ new Set();
+var showFlashMessage = (msg) => {
+  flashListeners.forEach((listener) => listener(msg));
+};
+var subscribeToFlashMessages = (listener) => {
+  flashListeners.add(listener);
+  return () => {
+    flashListeners.delete(listener);
+  };
 };
 var FlashMessage = () => {
   const { top } = (0, import_react_native_safe_area_context.useSafeAreaInsets)();
   const [message, setMessage] = (0, import_react2.useState)(null);
-  const [show, setShow] = (0, import_react2.useState)(false);
   const colors2 = useColors();
   const type = message?.type || "success";
-  showFlashMessage = (msg) => {
-    setMessage(msg);
-    setTimeout(() => {
-      setShow(true);
-    }, 50);
-    setTimeout(() => {
-      setShow(false);
-      setTimeout(() => {
-        setMessage(null);
-      }, 500);
-    }, msg.duration || 3e3);
+  const timeoutRef = (0, import_react2.useRef)(null);
+  const translateY = (0, import_react_native_reanimated.useSharedValue)(-200);
+  const opacity = (0, import_react_native_reanimated.useSharedValue)(0);
+  const hideMessage = () => {
+    setMessage(null);
+  };
+  const closeMessage = () => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+    }
+    translateY.value = (0, import_react_native_reanimated.withTiming)(-200, { duration: 300 });
+    opacity.value = (0, import_react_native_reanimated.withTiming)(0, { duration: 300 }, () => {
+      (0, import_react_native_reanimated.runOnJS)(hideMessage)();
+    });
   };
   (0, import_react2.useEffect)(() => {
-    import_react_native2.LayoutAnimation.configureNext(import_react_native2.LayoutAnimation.Presets.easeInEaseOut);
-  }, [show]);
-  const styles2 = import_react_native_size_matters2.ScaledSheet.create({
+    const listener = (msg) => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+        timeoutRef.current = null;
+      }
+      translateY.value = -200;
+      opacity.value = 0;
+      setMessage(msg);
+      translateY.value = (0, import_react_native_reanimated.withTiming)(0, { duration: 300 });
+      opacity.value = (0, import_react_native_reanimated.withTiming)(1, { duration: 300 });
+      const duration = msg.duration || 3e3;
+      timeoutRef.current = setTimeout(() => {
+        translateY.value = (0, import_react_native_reanimated.withTiming)(-200, { duration: 300 });
+        opacity.value = (0, import_react_native_reanimated.withTiming)(0, { duration: 300 }, () => {
+          (0, import_react_native_reanimated.runOnJS)(hideMessage)();
+        });
+        timeoutRef.current = null;
+      }, duration);
+    };
+    const unsubscribe = subscribeToFlashMessages(listener);
+    return () => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+        timeoutRef.current = null;
+      }
+      unsubscribe();
+    };
+  }, []);
+  const animatedStyle = (0, import_react_native_reanimated.useAnimatedStyle)(() => {
+    return {
+      transform: [{ translateY: translateY.value }],
+      opacity: opacity.value
+    };
+  });
+  const styles = import_react_native_size_matters2.ScaledSheet.create({
     root: {
       position: "absolute",
-      top: show ? 0 : -200,
+      top: 0,
       zIndex: 1e3,
       left: 0,
       paddingTop: top + 10,
@@ -368,7 +421,9 @@ var FlashMessage = () => {
       backgroundColor: "#fff3"
     }
   });
-  return /* @__PURE__ */ import_react2.default.createElement(import_react_native2.View, { style: styles2.root }, /* @__PURE__ */ import_react2.default.createElement(import_react_native2.View, { style: { flexDirection: "row" } }, /* @__PURE__ */ import_react2.default.createElement(import_react_native2.View, { style: { flex: 1, marginRight: 10 } }, message?.title && /* @__PURE__ */ import_react2.default.createElement(
+  if (!message)
+    return null;
+  return /* @__PURE__ */ import_react2.default.createElement(import_react_native_reanimated.default.View, { style: [styles.root, animatedStyle] }, /* @__PURE__ */ import_react2.default.createElement(import_react_native2.TouchableOpacity, { onPress: closeMessage, activeOpacity: 0.9 }, /* @__PURE__ */ import_react2.default.createElement(import_react_native2.View, { style: { flexDirection: "row" } }, /* @__PURE__ */ import_react2.default.createElement(import_react_native2.View, { style: { flex: 1, marginRight: 10 } }, message?.title && /* @__PURE__ */ import_react2.default.createElement(
     Typography_default,
     {
       variant: "h6",
@@ -377,7 +432,18 @@ var FlashMessage = () => {
       style: { color: "#fff" }
     },
     message?.title
-  ), /* @__PURE__ */ import_react2.default.createElement(Typography_default, { style: { color: "#fff" } }, message?.message))), message?.actions?.map((cur, i) => /* @__PURE__ */ import_react2.default.createElement(import_react_native2.TouchableOpacity, { key: i, style: styles2.action, onPress: cur.onPress }, /* @__PURE__ */ import_react2.default.createElement(Typography_default, { fontWeight: 700, style: { color: "#fff" } }, cur.title))));
+  ), /* @__PURE__ */ import_react2.default.createElement(Typography_default, { style: { color: "#fff" } }, message?.message)))), message?.actions?.map((cur, i) => /* @__PURE__ */ import_react2.default.createElement(
+    import_react_native2.TouchableOpacity,
+    {
+      key: i,
+      style: styles.action,
+      onPress: () => {
+        cur.onPress?.();
+        closeMessage();
+      }
+    },
+    /* @__PURE__ */ import_react2.default.createElement(Typography_default, { fontWeight: 700, style: { color: "#fff" } }, cur.title)
+  )));
 };
 var FlashMessage_default = FlashMessage;
 
@@ -386,6 +452,7 @@ var UIThemeContext = (0, import_react3.createContext)({
   themeState: { mode: "default", value: "light" }
 });
 function themeReducer(state, { type, payload }) {
+  import_async_storage.default.setItem("theme", type);
   switch (type) {
     case "dark":
       return { mode: "dark", value: "dark" };
@@ -404,12 +471,20 @@ var ConfigureSystemUI = () => {
     const config2 = getConfig();
     if (colors2) {
       SystemUI.setBackgroundColorAsync(colors2.white[1]);
-      if (import_react_native3.Platform.OS === "android" && !config2.EDGE_TO_EDGE) {
-        NavigationBar.setBackgroundColorAsync(colors2.white[1]);
-        if (theme === "dark") {
-          NavigationBar.setButtonStyleAsync("light");
+      if (import_react_native3.Platform.OS === "android") {
+        if (config2.EDGE_TO_EDGE) {
+          if (theme === "dark") {
+            NavigationBar.setStyle("light");
+          } else {
+            NavigationBar.setStyle("dark");
+          }
         } else {
-          NavigationBar.setButtonStyleAsync("dark");
+          NavigationBar.setBackgroundColorAsync(colors2.white[1]);
+          if (theme === "dark") {
+            NavigationBar.setButtonStyleAsync("light");
+          } else {
+            NavigationBar.setButtonStyleAsync("dark");
+          }
         }
       }
     }
@@ -465,9 +540,20 @@ var useTheme = () => {
   const { themeState } = (0, import_react4.useContext)(UIThemeContext);
   return themeState.value;
 };
+var useThemeContext = () => {
+  const { themeState: theme, themeDispatch } = (0, import_react4.useContext)(UIThemeContext);
+  const colorScheme = (0, import_react_native4.useColorScheme)();
+  const setTheme = (theme2) => {
+    if (theme2 === "default") {
+      themeDispatch?.({ type: "default", payload: colorScheme });
+    } else {
+      themeDispatch?.({ type: theme2 });
+    }
+  };
+  return { theme, setTheme };
+};
 var useNavScreenOptions = (type) => {
   const colors2 = useColors();
-  const theme = useTheme();
   const options = {
     stack: {
       headerShown: false,
@@ -487,15 +573,12 @@ var useNavScreenOptions = (type) => {
       headerShown: false,
       headerTintColor: colors2.dark.main,
       tabBarStyle: {
-        borderTopColor: theme === "dark" ? colors2.light.main : colors2.white[2],
+        borderTopColor: colors2.white[2],
+        borderColor: colors2.white[2],
         borderTopWidth: 1,
-        // shadowColor: "#000",
-        // shadowOffset: { height: -3, width: 0 },
-        // shadowRadius: 7,
-        // shadowOpacity: 0.1,
         backgroundColor: colors2.white[1]
       },
-      tabBarActiveTintColor: colors2.blue.main,
+      tabBarActiveTintColor: colors2.primary.main,
       tabBarInactiveTintColor: colors2.textSecondary.main,
       tabBarLabelStyle: {
         // fontSize: ms(12),
@@ -519,10 +602,6 @@ var useNavScreenOptions = (type) => {
       }
     }
   };
-  if (import_react_native4.Platform.OS === "android") {
-    options.tab.tabBarStyle.height = import_react_native4.Dimensions.get("screen").height * 0.08;
-    options.tab.tabBarStyle.paddingBottom = (0, import_react_native_size_matters3.vs)(15);
-  }
   return options[type];
 };
 
@@ -556,7 +635,7 @@ var AdaptiveStatusBarNext_default = AdaptiveStatusBar;
 var import_vector_icons = require("@expo/vector-icons");
 var import_react6 = __toESM(require("react"));
 var import_react_native6 = require("react-native");
-var import_react_native_size_matters4 = require("react-native-size-matters");
+var import_react_native_size_matters3 = require("react-native-size-matters");
 var AlertX = ({
   type = "info",
   variant = "contained",
@@ -566,7 +645,7 @@ var AlertX = ({
   style = {}
 }) => {
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters4.ScaledSheet.create({
+  const styles = import_react_native_size_matters3.ScaledSheet.create({
     container: {
       padding: 20,
       paddingTop: 10,
@@ -574,7 +653,7 @@ var AlertX = ({
       borderRadius: 8,
       alignItems: "center",
       flexDirection: "row",
-      marginBottom: gutterBottom + "@ms",
+      marginBottom: (0, import_react_native_size_matters3.ms)(gutterBottom),
       backgroundColor: colors2[type].main + (variant === "contained" ? "" : "3")
     },
     title: {
@@ -584,7 +663,7 @@ var AlertX = ({
       color: variant === "contained" ? "#fff" : colors2[type].main
     }
   });
-  return /* @__PURE__ */ import_react6.default.createElement(import_react_native6.View, { style: { ...styles2.container, ...style } }, /* @__PURE__ */ import_react6.default.createElement(import_react_native6.View, { style: { width: "80%" } }, /* @__PURE__ */ import_react6.default.createElement(Typography_default, { style: styles2.title, gutterBottom: 3, fontWeight: 700 }, title), body && /* @__PURE__ */ import_react6.default.createElement(Typography_default, { fontWeight: 700, variant: "body2", style: styles2.body }, body)), /* @__PURE__ */ import_react6.default.createElement(import_react_native6.View, { style: { marginLeft: "auto" } }, /* @__PURE__ */ import_react6.default.createElement(
+  return /* @__PURE__ */ import_react6.default.createElement(import_react_native6.View, { style: [styles.container, style] }, /* @__PURE__ */ import_react6.default.createElement(import_react_native6.View, { style: { width: "80%" } }, /* @__PURE__ */ import_react6.default.createElement(Typography_default, { style: styles.title, gutterBottom: 3, fontWeight: 700 }, title), body && /* @__PURE__ */ import_react6.default.createElement(Typography_default, { fontWeight: 700, variant: "body2", style: styles.body }, body)), /* @__PURE__ */ import_react6.default.createElement(import_react_native6.View, { style: { marginLeft: "auto" } }, /* @__PURE__ */ import_react6.default.createElement(
     import_vector_icons.MaterialIcons,
     {
       color: variant === "contained" ? "#fff" : colors2[type].main,
@@ -599,7 +678,7 @@ var AlertX_default = AlertX;
 var import_vector_icons2 = require("@expo/vector-icons");
 var import_react7 = __toESM(require("react"));
 var import_react_native7 = require("react-native");
-var import_react_native_size_matters5 = require("react-native-size-matters");
+var import_react_native_size_matters4 = require("react-native-size-matters");
 var Avatar = ({
   color = "dark",
   label,
@@ -609,17 +688,18 @@ var Avatar = ({
   style = {}
 }) => {
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters5.ScaledSheet.create({
+  const [imageError, setImageError] = (0, import_react7.useState)(false);
+  const styles = import_react_native_size_matters4.ScaledSheet.create({
     root: {
       borderRadius: 150,
-      height: size + "@ms",
-      width: size + "@ms",
+      height: (0, import_react_native_size_matters4.ms)(size),
+      width: (0, import_react_native_size_matters4.ms)(size),
       alignItems: "center",
       justifyContent: "center",
       overflow: "hidden",
       borderWidth: variant === "outlined" ? 5 : 0,
       borderColor: variant === "outlined" ? "#fff" : "#0000",
-      backgroundColor: variant === "outlined" ? null : label ? colors2[color].main : colors2.white[4],
+      backgroundColor: variant === "outlined" ? void 0 : label ? colors2[color].main : colors2.white[4],
       ...style
     },
     image: {
@@ -627,7 +707,15 @@ var Avatar = ({
       width: "110%"
     }
   });
-  return /* @__PURE__ */ import_react7.default.createElement(import_react_native7.View, { style: styles2.root }, source ? /* @__PURE__ */ import_react7.default.createElement(import_react_native7.Image, { resizeMode: "cover", style: styles2.image, source }) : label ? /* @__PURE__ */ import_react7.default.createElement(Typography_default, { style: { color: colors2[color].text } }, label[0]) : /* @__PURE__ */ import_react7.default.createElement(import_vector_icons2.AntDesign, { name: "user", color: "#fff", size: Math.round(size / 1.5) }));
+  return /* @__PURE__ */ import_react7.default.createElement(import_react_native7.View, { style: styles.root }, source && !imageError ? /* @__PURE__ */ import_react7.default.createElement(
+    import_react_native7.Image,
+    {
+      resizeMode: "cover",
+      style: styles.image,
+      source,
+      onError: () => setImageError(true)
+    }
+  ) : label ? /* @__PURE__ */ import_react7.default.createElement(Typography_default, { style: { color: colors2[color].text } }, label[0]) : /* @__PURE__ */ import_react7.default.createElement(import_vector_icons2.AntDesign, { name: "user", color: "#fff", size: Math.round(size / 1.5) }));
 };
 var Avatar_default = Avatar;
 
@@ -635,27 +723,27 @@ var Avatar_default = Avatar;
 var import_vector_icons3 = require("@expo/vector-icons");
 var import_react8 = __toESM(require("react"));
 var import_react_native8 = require("react-native");
-var import_react_native_size_matters6 = require("react-native-size-matters");
+var import_react_native_size_matters5 = require("react-native-size-matters");
 var LinkButton = ({
   title,
   style = {},
   color = "blue",
   fontSize = 12,
-  fontWeight = "400",
+  fontWeight = 400,
   disabled,
   onPress = () => {
   }
 }) => {
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters6.ScaledSheet.create({
+  const styles = import_react_native_size_matters5.ScaledSheet.create({
     text: {
-      fontSize: (0, import_react_native_size_matters6.moderateScale)(fontSize),
-      fontWeight,
-      fontFamily: getConfig().DEFAULT_FONT_FAMILY || "System",
+      fontSize: (0, import_react_native_size_matters5.moderateScale)(fontSize),
+      fontWeight: fontWeight.toString(),
+      fontFamily: getFontFamily(fontWeight),
       color: disabled ? "#777" : colors2[color].main
     }
   });
-  return /* @__PURE__ */ import_react8.default.createElement(import_react_native8.TouchableOpacity, { onPress, disabled }, /* @__PURE__ */ import_react8.default.createElement(import_react_native8.Text, { style: { ...styles2.text, ...style } }, title));
+  return /* @__PURE__ */ import_react8.default.createElement(import_react_native8.TouchableOpacity, { onPress, disabled }, /* @__PURE__ */ import_react8.default.createElement(import_react_native8.Text, { style: { ...styles.text, ...style } }, title));
 };
 var IconButton = ({
   style = {},
@@ -673,11 +761,11 @@ var IconButton = ({
   const colors2 = useColors();
   const theme = useTheme();
   const bgColor = theme === "light" ? "#fff" : "#222";
-  const styles2 = import_react_native_size_matters6.ScaledSheet.create({
+  const styles = import_react_native_size_matters5.ScaledSheet.create({
     container: {
       alignSelf: "flex-start",
       flexGrow: 0,
-      backgroundColor: bg ? bgColor : elevation > 0 ? bgColor : null,
+      backgroundColor: bg ? bgColor : elevation > 0 ? bgColor : void 0,
       padding: "5@ms",
       shadowColor: "#000",
       shadowOpacity: 0.1,
@@ -685,8 +773,8 @@ var IconButton = ({
         height: 1,
         width: 0
       },
-      height: bg ? size + 20 + "@ms" : void 0,
-      width: bg ? size + 20 + "@ms" : void 0,
+      height: bg ? (0, import_react_native_size_matters5.ms)(size + 20) : void 0,
+      width: bg ? (0, import_react_native_size_matters5.ms)(size + 20) : void 0,
       alignItems: "center",
       justifyContent: "center",
       shadowRadius: elevation,
@@ -706,9 +794,9 @@ var IconButton = ({
     {
       onPress,
       activeOpacity: 0.3,
-      style: { ...styles2.container, ...containerStyles }
+      style: { ...styles.container, ...containerStyles }
     },
-    /* @__PURE__ */ import_react8.default.createElement(IconComp, { style: { ...styles2.text, ...style }, name: icon, size })
+    /* @__PURE__ */ import_react8.default.createElement(IconComp, { style: { ...styles.text, ...style }, name: icon, size })
   );
 };
 var Button = (0, import_react8.forwardRef)(
@@ -731,16 +819,16 @@ var Button = (0, import_react8.forwardRef)(
     end
   }, ref) => {
     const colors2 = useColors();
-    const styles2 = import_react_native_size_matters6.ScaledSheet.create({
+    const styles = import_react_native_size_matters5.ScaledSheet.create({
       con: {
         flexDirection: "row",
         alignItems: "center",
         alignSelf: "flex-start",
         justifyContent: "center",
-        backgroundColor: variant === "text" || variant === "outlined" ? null : translucent ? translucent === "dark" ? colors2.white[3] + "22" : colors2.black[3] + "22" : loading ? colors2[color].light : disabled ? colors2.white[4] : colors2[color].main,
+        backgroundColor: variant === "text" || variant === "outlined" ? void 0 : translucent ? translucent === "dark" ? colors2.white[3] + "22" : colors2.black[3] + "22" : loading ? colors2[color].light : disabled ? colors2.white[4] : colors2[color].main,
         borderRadius: rounded ? 30 : 10,
         elevation: variant === "text" ? 0 : elevation,
-        paddingVertical: size === "small" ? 8 : size === "large" ? "15@ms" : "13@ms",
+        paddingVertical: size === "small" ? 8 : size === "large" ? "15@mvs" : "13@mvs",
         paddingHorizontal: size === "small" ? "10@ms" : "18@ms",
         borderColor: colors2[color].main,
         borderWidth: variant === "outlined" ? 1 : 0,
@@ -752,14 +840,14 @@ var Button = (0, import_react8.forwardRef)(
           width: 0
         },
         shadowOpacity: variant === "text" ? 0 : 0.3,
-        width: fullWidth ? "100%" : null,
+        width: fullWidth ? "100%" : void 0,
         ...style
       },
       text: {
         color: disabled ? variant === "text" || variant === "outlined" ? colors2.black[1] : colors2[color].text : colors2[color][variant === "text" || variant === "outlined" ? "main" : "text"],
         fontWeight: variant === "outlined" ? "700" : "500",
-        fontSize: size === "small" ? "12@ms" : "16@ms",
-        fontFamily: getConfig().DEFAULT_FONT_FAMILY || "System"
+        fontSize: size === "small" ? "12@ms" : "13@ms",
+        fontFamily: getFontFamily(variant === "outlined" ? 700 : 500)
       }
     });
     return /* @__PURE__ */ import_react8.default.createElement(
@@ -768,7 +856,7 @@ var Button = (0, import_react8.forwardRef)(
         ref,
         onPress,
         disabled,
-        style: styles2.con
+        style: styles.con
       },
       start,
       loading && /* @__PURE__ */ import_react8.default.createElement(
@@ -779,7 +867,7 @@ var Button = (0, import_react8.forwardRef)(
           style: { marginRight: 10 }
         }
       ),
-      /* @__PURE__ */ import_react8.default.createElement(import_react_native8.Text, { style: styles2.text }, title),
+      /* @__PURE__ */ import_react8.default.createElement(import_react_native8.Text, { style: styles.text }, title),
       end
     );
   }
@@ -790,7 +878,7 @@ var Button_default = Button;
 var import_vector_icons4 = require("@expo/vector-icons");
 var import_react9 = __toESM(require("react"));
 var import_react_native9 = require("react-native");
-var import_react_native_size_matters7 = require("react-native-size-matters");
+var import_react_native_size_matters6 = require("react-native-size-matters");
 var CheckBox = ({
   color = "primary",
   checked,
@@ -801,14 +889,14 @@ var CheckBox = ({
 }) => {
   const iconName = checked ? "checkbox-marked" : "checkbox-blank-outline";
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters7.ScaledSheet.create({
+  const styles = import_react_native_size_matters6.ScaledSheet.create({
     container: {
       alignItems: "center",
       flexDirection: "row",
       ...style
     }
   });
-  return /* @__PURE__ */ import_react9.default.createElement(import_react_native9.View, { style: styles2.container }, /* @__PURE__ */ import_react9.default.createElement(import_react_native9.TouchableOpacity, { onPress: onChange }, /* @__PURE__ */ import_react9.default.createElement(
+  return /* @__PURE__ */ import_react9.default.createElement(import_react_native9.View, { style: styles.container }, /* @__PURE__ */ import_react9.default.createElement(import_react_native9.TouchableOpacity, { onPress: onChange }, /* @__PURE__ */ import_react9.default.createElement(
     import_vector_icons4.MaterialCommunityIcons,
     {
       name: iconName,
@@ -821,7 +909,8 @@ var CheckBox = ({
 // ../src/Components/FormWrapper.tsx
 var import_react10 = __toESM(require("react"));
 var import_react_native10 = require("react-native");
-var import_react_native_size_matters8 = require("react-native-size-matters");
+var import_react_native_size_matters7 = require("react-native-size-matters");
+var import_react_native_safe_area_context3 = require("react-native-safe-area-context");
 var FormWrapper = ({
   children,
   behavior = import_react_native10.Platform.OS === "ios" ? "padding" : "height",
@@ -831,7 +920,9 @@ var FormWrapper = ({
   style = {},
   onScroll
 }) => {
-  const styles2 = import_react_native_size_matters8.ScaledSheet.create({
+  const { bottom } = (0, import_react_native_safe_area_context3.useSafeAreaInsets)();
+  const defaultOffset = import_react_native10.Platform.OS === "ios" ? -bottom : -bottom * 2;
+  const styles = import_react_native_size_matters7.ScaledSheet.create({
     root: {
       width: "100%",
       flex: 1,
@@ -841,18 +932,18 @@ var FormWrapper = ({
   return mode === "static" ? /* @__PURE__ */ import_react10.default.createElement(import_react_native10.TouchableWithoutFeedback, { onPress: import_react_native10.Keyboard.dismiss, accessible: false }, /* @__PURE__ */ import_react10.default.createElement(
     import_react_native10.KeyboardAvoidingView,
     {
-      style: styles2.root,
+      style: styles.root,
       behavior,
-      contentContainerStyle: styles2.root,
-      keyboardVerticalOffset
+      contentContainerStyle: styles.root,
+      keyboardVerticalOffset: keyboardVerticalOffset || defaultOffset
     },
     children
   )) : /* @__PURE__ */ import_react10.default.createElement(
     import_react_native10.KeyboardAvoidingView,
     {
       behavior,
-      style: styles2.root,
-      keyboardVerticalOffset
+      style: styles.root,
+      keyboardVerticalOffset: keyboardVerticalOffset || defaultOffset
     },
     /* @__PURE__ */ import_react10.default.createElement(
       import_react_native10.ScrollView,
@@ -874,54 +965,116 @@ var import_vector_icons5 = require("@expo/vector-icons");
 var Haptics = __toESM(require("expo-haptics"));
 var import_react12 = require("react");
 var import_react_native12 = require("react-native");
-var import_react_native_size_matters10 = require("react-native-size-matters");
+var import_react_native_size_matters9 = require("react-native-size-matters");
 
 // ../src/Components/Popup.tsx
 var import_react_native11 = require("react-native");
 var import_react11 = __toESM(require("react"));
-var import_react_native_size_matters9 = require("react-native-size-matters");
+var import_react_native_reanimated2 = __toESM(require("react-native-reanimated"));
+var import_react_native_safe_area_context4 = require("react-native-safe-area-context");
+var import_react_native_size_matters8 = require("react-native-size-matters");
 var Popup = ({
   title,
-  sheet,
+  sheet = true,
   bare = false,
   keyboardVerticalOffset,
   children,
   open,
   onClose = () => {
   },
-  style
+  style,
+  onModalShow,
+  onModalHide,
+  disableAutoKeyboardManagement = false
 }) => {
   const theme = useTheme();
   const colors2 = useColors();
-  const [show, setShow] = (0, import_react11.useState)(open);
-  const [showSecondary, setShowSecondary] = (0, import_react11.useState)(false);
-  const styles2 = import_react_native_size_matters9.ScaledSheet.create({
+  const [modalVisible, setModalVisible] = (0, import_react11.useState)(false);
+  const [modalOpen, setModalOpen] = (0, import_react11.useState)(false);
+  const [keyboardVisible, setKeyboardVisible] = (0, import_react11.useState)(false);
+  const { bottom } = (0, import_react_native_safe_area_context4.useSafeAreaInsets)();
+  const backdropOpacity = (0, import_react_native_reanimated2.useSharedValue)(0);
+  const contentTranslateY = (0, import_react_native_reanimated2.useSharedValue)(1e3);
+  const keyboardVerticalOffsetValue = import_react_native11.Platform.OS === "ios" ? -bottom : -bottom * 2;
+  (0, import_react11.useEffect)(() => {
+    const keyboardDidShowListener = import_react_native11.Keyboard.addListener(
+      "keyboardDidShow",
+      () => {
+        setKeyboardVisible(true);
+      }
+    );
+    const keyboardDidHideListener = import_react_native11.Keyboard.addListener(
+      "keyboardDidHide",
+      () => {
+        setKeyboardVisible(false);
+      }
+    );
+    return () => {
+      keyboardDidHideListener?.remove();
+      keyboardDidShowListener?.remove();
+    };
+  }, []);
+  const _onModalShow = () => {
+    setModalVisible(true);
+    onModalShow?.();
+  };
+  const _onModalHide = () => {
+    onModalHide?.();
+    setModalOpen(false);
+  };
+  (0, import_react11.useEffect)(() => {
+    if (open) {
+      setModalOpen(true);
+      backdropOpacity.value = (0, import_react_native_reanimated2.withTiming)(1, { duration: 300 });
+      contentTranslateY.value = (0, import_react_native_reanimated2.withTiming)(0, { duration: 300 }, () => {
+        (0, import_react_native_reanimated2.runOnJS)(_onModalShow)();
+      });
+    } else {
+      setModalVisible(false);
+      backdropOpacity.value = (0, import_react_native_reanimated2.withTiming)(0, { duration: 200 });
+      contentTranslateY.value = (0, import_react_native_reanimated2.withTiming)(1e3, { duration: 200 }, () => {
+        (0, import_react_native_reanimated2.runOnJS)(_onModalHide)();
+      });
+    }
+  }, [open]);
+  const backdropAnimatedStyle = (0, import_react_native_reanimated2.useAnimatedStyle)(() => ({
+    opacity: backdropOpacity.value
+  }));
+  const contentAnimatedStyle = (0, import_react_native_reanimated2.useAnimatedStyle)(() => ({
+    transform: [{ translateY: contentTranslateY.value }]
+  }));
+  const styles = import_react_native_size_matters8.ScaledSheet.create({
     root: {
       height: "100%",
       width: "100%",
       justifyContent: sheet ? "flex-end" : "center"
     },
+    keyboardView: {
+      flex: 1,
+      zIndex: 1e3
+    },
     avoidingView: {
+      zIndex: 2,
       minHeight: typeof sheet === "number" ? sheet : void 0,
-      maxHeight: "80%",
-      zIndex: 1e3,
+      maxHeight: "90%",
       alignSelf: "center",
       maxWidth: sheet ? void 0 : "90%",
-      width: sheet ? "100%" : void 0
+      width: sheet ? "100%" : void 0,
+      marginBottom: import_react_native11.Platform.OS === "android" && keyboardVisible ? bottom : 0
     },
     container: {
-      paddingBottom: sheet ? "30@ms" : 0,
-      backgroundColor: theme === "dark" ? "#111" : colors2.white[2],
+      paddingBottom: sheet && !bare ? bottom + (0, import_react_native_size_matters8.ms)(10) : void 0,
+      backgroundColor: theme === "dark" ? "#111" : colors2.white[1],
       borderTopLeftRadius: 20,
       borderTopRightRadius: 20,
       borderBottomRightRadius: sheet ? 0 : 20,
       borderBottomLeftRadius: sheet ? 0 : 20,
       width: "100%",
+      overflow: "hidden",
       ...style
     },
     content: {
       paddingHorizontal: bare ? void 0 : "15@ms"
-      // flex: 1,
     },
     title: {
       flexDirection: "row",
@@ -936,71 +1089,60 @@ var Popup = ({
     backdrop: {
       position: "absolute",
       height: "100%",
-      zIndex: -1,
+      zIndex: 1,
       width: "100%",
       backgroundColor: "#000b"
     }
   });
-  import_react11.default.useEffect(() => {
-    if (open) {
-      setShow(open);
-      setTimeout(() => {
-        setShowSecondary(open);
-      }, 500);
-    } else {
-      closeAction();
-    }
-  }, [open]);
   const closeAction = () => {
-    setShowSecondary(false);
-    setTimeout(() => {
-      setShow(false);
-      onClose();
-    }, 300);
+    onClose();
   };
-  return /* @__PURE__ */ import_react11.default.createElement(import_react11.default.Fragment, null, /* @__PURE__ */ import_react11.default.createElement(
+  return /* @__PURE__ */ import_react11.default.createElement(
     import_react_native11.Modal,
     {
       transparent: true,
-      animationType: "fade",
+      animationType: "none",
       statusBarTranslucent: true,
-      visible: show,
+      visible: modalOpen,
       onRequestClose: closeAction
     },
-    /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles2.backdrop }),
-    /* @__PURE__ */ import_react11.default.createElement(UIThemeProvider, null, /* @__PURE__ */ import_react11.default.createElement(
-      import_react_native11.Modal,
+    /* @__PURE__ */ import_react11.default.createElement(UIThemeProvider, null, /* @__PURE__ */ import_react11.default.createElement(import_react_native_reanimated2.default.View, { style: [styles.backdrop, backdropAnimatedStyle] }), /* @__PURE__ */ import_react11.default.createElement(
+      import_react_native11.KeyboardAvoidingView,
       {
-        transparent: true,
-        animationType: "slide",
-        statusBarTranslucent: true,
-        visible: showSecondary,
-        onRequestClose: closeAction
+        style: styles.keyboardView,
+        behavior: import_react_native11.Platform.OS === "ios" ? "padding" : "height",
+        keyboardVerticalOffset: keyboardVerticalOffset || keyboardVerticalOffsetValue
       },
-      /* @__PURE__ */ import_react11.default.createElement(import_react_native11.TouchableWithoutFeedback, { onPress: import_react_native11.Keyboard.dismiss }, /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles2.root }, open && /* @__PURE__ */ import_react11.default.createElement(
-        import_react_native11.Pressable,
+      /* @__PURE__ */ import_react11.default.createElement(
+        import_react_native11.TouchableWithoutFeedback,
         {
-          style: import_react_native11.StyleSheet.absoluteFill,
-          onPress: closeAction
-        }
-      ), /* @__PURE__ */ import_react11.default.createElement(
-        import_react_native11.KeyboardAvoidingView,
-        {
-          style: styles2.avoidingView,
-          keyboardVerticalOffset,
-          behavior: import_react_native11.Platform.OS === "ios" ? "position" : "padding"
+          onPress: import_react_native11.Keyboard.dismiss,
+          disabled: disableAutoKeyboardManagement
         },
-        /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles2.container }, !bare && /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles2.title }, /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles2.titleIcon }, /* @__PURE__ */ import_react11.default.createElement(
-          IconButton,
+        /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles.root }, modalOpen && /* @__PURE__ */ import_react11.default.createElement(
+          import_react_native11.Pressable,
           {
-            size: 20,
-            icon: "close",
+            style: [import_react_native11.StyleSheet.absoluteFill, { zIndex: 1 }],
             onPress: closeAction
           }
-        )), /* @__PURE__ */ import_react11.default.createElement(Typography_default, { align: "center", fontWeight: 500 }, title)), /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles2.content }, children))
-      )))
+        ), /* @__PURE__ */ import_react11.default.createElement(
+          import_react_native_reanimated2.default.View,
+          {
+            style: [styles.avoidingView, contentAnimatedStyle],
+            layout: modalVisible ? import_react_native_reanimated2.LinearTransition.springify().stiffness(200).mass(0.5).damping(100) : void 0
+          },
+          /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles.container }, !bare && /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles.title }, /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles.titleIcon }, /* @__PURE__ */ import_react11.default.createElement(
+            IconButton,
+            {
+              size: 20,
+              icon: "close",
+              onPress: closeAction
+            }
+          )), /* @__PURE__ */ import_react11.default.createElement(Typography_default, { align: "center", fontWeight: 500 }, title)), /* @__PURE__ */ import_react11.default.createElement(import_react_native11.View, { style: styles.content }, children))
+        ))
+      )
     ))
-  ));
+  );
 };
 
 // ../src/Components/StarRating.tsx
@@ -1009,13 +1151,13 @@ var RatingStars = ({
   size = 16
 }) => {
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters10.ScaledSheet.create({
+  const styles = import_react_native_size_matters9.ScaledSheet.create({
     root: {
       flexDirection: "row",
       alignItems: "center"
     }
   });
-  return /* @__PURE__ */ React.createElement(import_react_native12.View, { style: styles2.root }, [...Array(Math.floor(rating))].map((_, index) => /* @__PURE__ */ React.createElement(import_vector_icons5.Ionicons, { key: index, name: "star", size, color: "#FFD700" })), [...Array(5 - Math.floor(rating))].map((_, index) => /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(import_react_native12.View, { style: styles.root }, [...Array(Math.floor(rating))].map((_, index) => /* @__PURE__ */ React.createElement(import_vector_icons5.Ionicons, { key: index, name: "star", size, color: "#FFD700" })), [...Array(5 - Math.floor(rating))].map((_, index) => /* @__PURE__ */ React.createElement(
     import_vector_icons5.Ionicons,
     {
       key: index,
@@ -1035,7 +1177,7 @@ var RatingInput = ({
   const colors2 = useColors();
   const [loading, setLoading] = (0, import_react12.useState)(false);
   const [review, setReview] = (0, import_react12.useState)("");
-  const styles2 = import_react_native_size_matters10.ScaledSheet.create({
+  const styles = import_react_native_size_matters9.ScaledSheet.create({
     root: {
       flexDirection: "row",
       alignItems: "center"
@@ -1068,7 +1210,7 @@ var RatingInput = ({
     _onSubmit && await _onSubmit({ rating: rate, review });
     setLoading(false);
   };
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(import_react_native12.View, { style: styles2.root }, loading ? /* @__PURE__ */ React.createElement(import_react_native12.ActivityIndicator, null) : [...Array(5)].map((_, index) => /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(import_react_native12.View, { style: styles.root }, loading ? /* @__PURE__ */ React.createElement(import_react_native12.ActivityIndicator, null) : [...Array(5)].map((_, index) => /* @__PURE__ */ React.createElement(
     import_react_native12.TouchableOpacity,
     {
       key: index,
@@ -1115,10 +1257,10 @@ var RatingInput = ({
       },
       "Add to your review"
     ),
-    /* @__PURE__ */ React.createElement(import_react_native12.View, { style: styles2.inputCon }, /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React.createElement(import_react_native12.View, { style: styles.inputCon }, /* @__PURE__ */ React.createElement(
       import_react_native12.TextInput,
       {
-        style: styles2.input,
+        style: styles.input,
         multiline: true,
         value: review,
         onChangeText: (text) => setReview(text),
@@ -1141,9 +1283,9 @@ var RatingInput = ({
 };
 
 // ../src/Components/Grid.tsx
-var import_react_native13 = require("react-native");
 var import_react13 = __toESM(require("react"));
-var import_react_native_size_matters11 = require("react-native-size-matters");
+var import_react_native13 = require("react-native");
+var import_react_native_size_matters10 = require("react-native-size-matters");
 var GridItem = ({
   children,
   col = 2,
@@ -1151,28 +1293,28 @@ var GridItem = ({
   spacing = 1,
   style = {}
 }) => {
-  const styles2 = import_react_native_size_matters11.ScaledSheet.create({
+  const styles = import_react_native_size_matters10.ScaledSheet.create({
     gridItem: {
-      width: 100 / col + "%",
-      padding: spacing * 10 + "@ms",
+      width: `${100 / col}%`,
+      padding: (0, import_react_native_size_matters10.ms)(spacing * 10),
       alignItems
     }
   });
-  return /* @__PURE__ */ import_react13.default.createElement(import_react_native13.View, { children, style: [styles2.gridItem, style] });
+  return /* @__PURE__ */ import_react13.default.createElement(import_react_native13.View, { children, style: [styles.gridItem, style] });
 };
 var Grid = ({
   children,
   spacing = 1,
   style = {}
 }) => {
-  const styles2 = import_react_native_size_matters11.ScaledSheet.create({
+  const styles = import_react_native_size_matters10.ScaledSheet.create({
     grid: {
       flexWrap: "wrap",
-      margin: -spacing * 10 + "@ms",
+      margin: `${-spacing * 10}@ms`,
       flexDirection: "row"
     }
   });
-  return /* @__PURE__ */ import_react13.default.createElement(import_react_native13.View, { children, style: [styles2.grid, style] });
+  return /* @__PURE__ */ import_react13.default.createElement(import_react_native13.View, { children, style: [styles.grid, style] });
 };
 
 // ../src/Components/Locator.tsx
@@ -1184,7 +1326,7 @@ var import_react_native17 = require("react-native");
 var import_vector_icons6 = require("@expo/vector-icons");
 var import_react14 = __toESM(require("react"));
 var import_react_native14 = require("react-native");
-var import_react_native_size_matters12 = require("react-native-size-matters");
+var import_react_native_size_matters11 = require("react-native-size-matters");
 var ListItem = ({
   link = false,
   divider = false,
@@ -1194,7 +1336,7 @@ var ListItem = ({
   children
 }) => {
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters12.ScaledSheet.create({
+  const styles = import_react_native_size_matters11.ScaledSheet.create({
     root: {
       flexDirection: "row",
       alignItems: "center",
@@ -1207,7 +1349,7 @@ var ListItem = ({
   return /* @__PURE__ */ import_react14.default.createElement(
     import_react_native14.View,
     null,
-    /* @__PURE__ */ import_react14.default.createElement(import_react_native14.TouchableOpacity, { disabled: Boolean(!onPress), onPress }, /* @__PURE__ */ import_react14.default.createElement(import_react_native14.View, { style: { ...styles2.root, ...style } }, children, link && /* @__PURE__ */ import_react14.default.createElement(
+    /* @__PURE__ */ import_react14.default.createElement(import_react_native14.TouchableOpacity, { disabled: Boolean(!onPress), onPress }, /* @__PURE__ */ import_react14.default.createElement(import_react_native14.View, { style: { ...styles.root, ...style } }, children, link && /* @__PURE__ */ import_react14.default.createElement(
       import_vector_icons6.MaterialIcons,
       {
         color: colors2.white[5],
@@ -1223,14 +1365,14 @@ var ListItem = ({
 var import_vector_icons8 = require("@expo/vector-icons");
 var import_react16 = __toESM(require("react"));
 var import_react_native16 = require("react-native");
-var import_react_native_size_matters14 = require("react-native-size-matters");
+var import_react_native_size_matters13 = require("react-native-size-matters");
 
 // ../src/Components/SelectMenu.tsx
 var import_vector_icons7 = require("@expo/vector-icons");
 var import_react15 = __toESM(require("react"));
 var import_react_native15 = require("react-native");
-var import_react_native_safe_area_context3 = require("react-native-safe-area-context");
-var import_react_native_size_matters13 = require("react-native-size-matters");
+var import_react_native_safe_area_context5 = require("react-native-safe-area-context");
+var import_react_native_size_matters12 = require("react-native-size-matters");
 var SelectMenu = ({
   open = false,
   onClose,
@@ -1240,22 +1382,15 @@ var SelectMenu = ({
   disableAutoClose = false,
   label,
   secondary,
-  helperText
+  helperText,
+  searchEnabled = false,
+  searchPlaceholder = "Search"
 }) => {
   const colors2 = useColors();
-  const { bottom } = (0, import_react_native_safe_area_context3.useSafeAreaInsets)();
+  const { bottom } = (0, import_react_native_safe_area_context5.useSafeAreaInsets)();
   const [search, setSearch] = (0, import_react15.useState)("");
-  const styles2 = import_react_native_size_matters13.ScaledSheet.create({
-    root: {
-      backgroundColor: colors2.white[1],
-      flex: 1
-    },
-    content: {
-      flex: 1,
-      paddingHorizontal: "10@ms"
-    },
+  const styles = import_react_native_size_matters12.ScaledSheet.create({
     header: {
-      paddingTop: "80@ms",
       marginBottom: "20@vs"
     },
     option: {
@@ -1265,11 +1400,6 @@ var SelectMenu = ({
       flexDirection: "row",
       alignItems: "center",
       marginBottom: "10@vs"
-    },
-    footer: {
-      paddingBottom: bottom,
-      paddingHorizontal: "15@ms",
-      paddingTop: "15@ms"
     }
   });
   const renderItem = (0, import_react15.useCallback)(
@@ -1277,7 +1407,7 @@ var SelectMenu = ({
       import_react_native15.TouchableOpacity,
       {
         style: {
-          ...styles2.option,
+          ...styles.option,
           backgroundColor: item.value === value ? colors2.blue.light + "22" : colors2.white[2]
         },
         onPress: () => {
@@ -1291,6 +1421,7 @@ var SelectMenu = ({
       /* @__PURE__ */ import_react15.default.createElement(import_react_native15.View, { style: { flex: 1 } }, /* @__PURE__ */ import_react15.default.createElement(
         Typography_default,
         {
+          variant: "body2",
           style: {
             color: item.value === value ? colors2.blue.light : colors2.black[2]
           }
@@ -1319,35 +1450,36 @@ var SelectMenu = ({
     ),
     [value, colors2]
   );
-  return /* @__PURE__ */ import_react15.default.createElement(import_react_native15.Modal, { visible: open, animationType: "slide", onRequestClose: onClose }, /* @__PURE__ */ import_react15.default.createElement(import_react_native15.View, { style: styles2.root }, /* @__PURE__ */ import_react15.default.createElement(import_react_native15.View, { style: styles2.content }, /* @__PURE__ */ import_react15.default.createElement(import_react_native15.View, { style: styles2.header }, /* @__PURE__ */ import_react15.default.createElement(Typography_default, { variant: "h5", gutterBottom: 5, fontWeight: 700 }, label), helperText ? /* @__PURE__ */ import_react15.default.createElement(Typography_default, { variant: "body2", color: "textSecondary" }, helperText) : null, /* @__PURE__ */ import_react15.default.createElement(
-    TextField_default,
-    {
-      label: "Search",
-      value: search,
-      type: "search",
-      onChangeText: setSearch,
-      variant: "outlined"
-    }
-  )), /* @__PURE__ */ import_react15.default.createElement(
-    import_react_native15.FlatList,
-    {
-      removeClippedSubviews: true,
-      keyExtractor: (item) => item.value,
-      renderItem,
-      data: options.filter(
-        (item) => search.length > 1 ? item.label.toLowerCase().indexOf(search.toLowerCase()) > -1 : item
-      ).sort((a, b) => a.label.localeCompare(b.label))
-    }
-  )), /* @__PURE__ */ import_react15.default.createElement(import_react_native15.View, { style: styles2.footer }, /* @__PURE__ */ import_react15.default.createElement(
-    Button_default,
+  return /* @__PURE__ */ import_react15.default.createElement(
+    Popup,
     {
-      color: "error",
-      variant: "outlined",
-      fullWidth: true,
-      title: "Close",
-      onPress: onClose
-    }
-  ))));
+      open,
+      onClose,
+      title: label,
+      disableAutoKeyboardManagement: true
+    },
+    /* @__PURE__ */ import_react15.default.createElement(import_react_native15.View, { style: styles.content }, /* @__PURE__ */ import_react15.default.createElement(import_react_native15.View, { style: styles.header }, helperText && /* @__PURE__ */ import_react15.default.createElement(Typography_default, { variant: "body2", color: "textSecondary", gutterBottom: 5 }, helperText), searchEnabled && /* @__PURE__ */ import_react15.default.createElement(
+      TextField_default,
+      {
+        label: searchPlaceholder,
+        value: search,
+        type: "search",
+        onChangeText: setSearch,
+        variant: "outlined"
+      }
+    )), /* @__PURE__ */ import_react15.default.createElement(
+      import_react_native15.FlatList,
+      {
+        removeClippedSubviews: true,
+        keyExtractor: (item) => item.value,
+        bounces: false,
+        renderItem,
+        data: options.filter(
+          (item) => search.length > 1 ? item.label.toLowerCase().indexOf(search.toLowerCase()) > -1 : item
+        ).sort((a, b) => a.label.localeCompare(b.label))
+      }
+    ))
+  );
 };
 var SelectMenu_default = SelectMenu;
 
@@ -1377,32 +1509,33 @@ var TextField = ({
   gutterBottom = 0,
   end,
   options,
+  selectMenuProps,
   ...props
 }) => {
   const colors2 = useColors();
   const [focused, setFocused] = (0, import_react16.useState)(false);
-  const height = (0, import_react_native_size_matters14.moderateScale)(variant === "text" ? 50 : 45) * (size === "large" ? 1.2 : size === "small" ? 0.8 : 1);
+  const height = (0, import_react_native_size_matters13.moderateScale)(variant === "text" ? 50 : 45) * (size === "large" ? 1.2 : size === "small" ? 0.8 : 1);
   const labelAnim = (0, import_react16.useRef)(
-    new import_react_native16.Animated.Value(height / (0, import_react_native_size_matters14.moderateScale)(variant === "text" ? 2.5 : 3.2))
+    new import_react_native16.Animated.Value(height / (0, import_react_native_size_matters13.moderateScale)(variant === "text" ? 2.5 : 3.2))
   ).current;
   import_react16.default.useEffect(() => {
     if (focused || value) {
       import_react_native16.Animated.timing(labelAnim, {
-        toValue: (0, import_react_native_size_matters14.verticalScale)(variant === "text" ? 2 : 4),
+        toValue: (0, import_react_native_size_matters13.verticalScale)(variant === "text" ? 2 : 4),
         duration: 300,
         useNativeDriver: false
       }).start();
     } else {
       import_react_native16.Animated.timing(labelAnim, {
-        toValue: height / (0, import_react_native_size_matters14.moderateScale)(variant === "text" ? 2.5 : 3.2),
+        toValue: height / (0, import_react_native_size_matters13.moderateScale)(variant === "text" ? 2.5 : 3.2),
         duration: 300,
         useNativeDriver: false
       }).start();
     }
   }, [focused, value]);
-  const styles2 = import_react_native_size_matters14.ScaledSheet.create({
+  const styles = import_react_native_size_matters13.ScaledSheet.create({
     root: {
-      marginBottom: gutterBottom + "@vs",
+      marginBottom: (0, import_react_native_size_matters13.ms)(gutterBottom),
       width: "100%",
       ...style
     },
@@ -1423,10 +1556,10 @@ var TextField = ({
       fontSize: "14@s",
       flex: 1,
       alignSelf: "stretch",
-      paddingLeft: variant === "text" ? 0 : (0, import_react_native_size_matters14.moderateScale)(15),
-      paddingRight: (0, import_react_native_size_matters14.moderateScale)(10),
+      paddingLeft: variant === "text" ? 0 : (0, import_react_native_size_matters13.moderateScale)(15),
+      paddingRight: (0, import_react_native_size_matters13.moderateScale)(10),
       paddingTop: "11@vs",
-      fontFamily: getConfig().DEFAULT_FONT_FAMILY || "System",
+      fontFamily: getFontFamily(400),
       color: colors2.black[1],
       zIndex: 10
       // backgroundColor: "#284",
@@ -1434,13 +1567,13 @@ var TextField = ({
     inputText: {
       fontSize: "14@ms",
       flex: 1,
-      paddingLeft: variant === "text" ? 0 : (0, import_react_native_size_matters14.moderateScale)(15),
+      paddingLeft: variant === "text" ? 0 : (0, import_react_native_size_matters13.moderateScale)(15),
       paddingTop: "13@ms"
     },
     label: {
-      fontFamily: getConfig().DEFAULT_FONT_FAMILY || "System",
+      fontFamily: getFontFamily(400),
       position: "absolute",
-      left: variant === "text" ? 0 : (0, import_react_native_size_matters14.moderateScale)(15),
+      left: variant === "text" ? 0 : (0, import_react_native_size_matters13.moderateScale)(15),
       fontSize: focused || value ? "10@s" : "13@s",
       color: focused ? colors2[color].main : colors2.textSecondary.main
     },
@@ -1482,13 +1615,13 @@ var TextField = ({
     autoCapitalize: "none",
     textContentType: "password"
   } : {};
-  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles2.root }, /* @__PURE__ */ import_react16.default.createElement(
+  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles.root }, /* @__PURE__ */ import_react16.default.createElement(
     import_react_native16.TouchableOpacity,
     {
       onPress: () => setFocused(true),
-      style: styles2.container
+      style: styles.container
     },
-    /* @__PURE__ */ import_react16.default.createElement(import_react_native16.Animated.Text, { style: { ...styles2.label, top: labelAnim } }, label),
+    /* @__PURE__ */ import_react16.default.createElement(import_react_native16.Animated.Text, { style: { ...styles.label, top: labelAnim } }, label),
     start,
     options ? /* @__PURE__ */ import_react16.default.createElement(
       import_react_native16.View,
@@ -1499,13 +1632,13 @@ var TextField = ({
         import_react_native16.View,
         {
           style: {
-            paddingTop: variant !== "outlined" ? (0, import_react_native_size_matters14.ms)(13) : 0,
+            paddingTop: variant !== "outlined" ? (0, import_react_native_size_matters13.ms)(13) : 0,
             paddingRight: 10
           }
         },
         options.find((cur) => cur.value === value)?.start
       ),
-      /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles2.inputText }, options.find((cur) => cur.value === value)?.label)
+      /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles.inputText }, options.find((cur) => cur.value === value)?.label)
     ) : /* @__PURE__ */ import_react16.default.createElement(
       import_react_native16.TextInput,
       {
@@ -1526,7 +1659,7 @@ var TextField = ({
         placeholderTextColor: colors2.textSecondary.main,
         ...formProps,
         ...props,
-        style: styles2.input
+        style: styles.input
       }
     ),
     end && /* @__PURE__ */ import_react16.default.createElement(
@@ -1534,7 +1667,7 @@ var TextField = ({
       {
         style: {
           marginRight: 20,
-          paddingTop: variant === "text" ? (0, import_react_native_size_matters14.ms)(13) : 0
+          paddingTop: variant === "text" ? (0, import_react_native_size_matters13.ms)(13) : 0
         }
       },
       end
@@ -1544,7 +1677,7 @@ var TextField = ({
       {
         style: {
           marginRight: variant === "text" ? 0 : 20,
-          paddingTop: variant === "text" ? (0, import_react_native_size_matters14.ms)(13) : 0
+          paddingTop: variant === "text" ? (0, import_react_native_size_matters13.ms)(13) : 0
         }
       },
       /* @__PURE__ */ import_react16.default.createElement(
@@ -1560,11 +1693,11 @@ var TextField = ({
     Typography_default,
     {
       color: "textSecondary",
-      style: styles2.helperText,
+      style: styles.helperText,
       variant: "caption"
     },
     helperText
-  ), error && /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles2.error }, /* @__PURE__ */ import_react16.default.createElement(import_vector_icons8.MaterialIcons, { name: "error", color: colors2.error.main, size: 16 }), /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles2.errorText, color: "error" }, error))), options && /* @__PURE__ */ import_react16.default.createElement(
+  ), error && /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles.error }, /* @__PURE__ */ import_react16.default.createElement(import_vector_icons8.MaterialIcons, { name: "error", color: colors2.error.main, size: 16 }), /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles.errorText, color: "error" }, error))), options && /* @__PURE__ */ import_react16.default.createElement(
     SelectMenu_default,
     {
       options,
@@ -1573,13 +1706,15 @@ var TextField = ({
       onClose: () => setFocused(false),
       label,
       helperText,
-      onChange: onChangeText
+      onChange: onChangeText,
+      ...selectMenuProps
     }
   ));
 };
 var TextField2 = import_react16.default.forwardRef(
   ({
     label,
+    labelProps,
     keyboardType,
     color = "primary",
     value,
@@ -1603,20 +1738,21 @@ var TextField2 = import_react16.default.forwardRef(
     end,
     options,
     multiline,
+    selectMenuProps,
     ...props
   }, ref) => {
     const colors2 = useColors();
     const [focused, _setFocused] = (0, import_react16.useState)(false);
     const [showPassword, setShowPassword] = (0, import_react16.useState)(false);
-    const height = (0, import_react_native_size_matters14.moderateScale)(
+    const height = (0, import_react_native_size_matters13.moderateScale)(
       multiline ? 50 + (props.numberOfLines || 1) * 18 : 50
     );
     const setFocused = (value2) => {
       _setFocused(value2);
     };
-    const styles2 = import_react_native_size_matters14.ScaledSheet.create({
+    const styles = import_react_native_size_matters13.ScaledSheet.create({
       root: {
-        marginBottom: gutterBottom + "@vs",
+        marginBottom: (0, import_react_native_size_matters13.ms)(gutterBottom),
         ...style
       },
       container: {
@@ -1635,8 +1771,8 @@ var TextField2 = import_react16.default.forwardRef(
         fontSize: "14@s",
         flex: 1,
         alignSelf: "stretch",
-        paddingLeft: (0, import_react_native_size_matters14.moderateScale)(10),
-        paddingRight: (0, import_react_native_size_matters14.moderateScale)(10),
+        paddingLeft: (0, import_react_native_size_matters13.moderateScale)(10),
+        paddingRight: (0, import_react_native_size_matters13.moderateScale)(10),
         color: colors2.dark.main,
         zIndex: 10
         // backgroundColor: "#284",
@@ -1644,12 +1780,12 @@ var TextField2 = import_react16.default.forwardRef(
       inputText: {
         fontSize: "14@ms",
         color: colors2.dark.main,
-        paddingLeft: (0, import_react_native_size_matters14.moderateScale)(10)
+        paddingLeft: (0, import_react_native_size_matters13.moderateScale)(10)
       },
       placeholder: {
         fontSize: "14@ms",
         color: colors2.textSecondary.light,
-        paddingLeft: (0, import_react_native_size_matters14.moderateScale)(10)
+        paddingLeft: (0, import_react_native_size_matters13.moderateScale)(10)
       },
       label: {},
       helperText: {
@@ -1689,14 +1825,23 @@ var TextField2 = import_react16.default.forwardRef(
       autoCapitalize: "none",
       textContentType: "password"
     } : {};
-    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles2.root }, label && /* @__PURE__ */ import_react16.default.createElement(Typography_default, { variant: "body1", color: "textSecondary", gutterBottom: 7 }, label), /* @__PURE__ */ import_react16.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles.root }, label && /* @__PURE__ */ import_react16.default.createElement(
+      Typography_default,
+      {
+        variant: "body2",
+        color: "textSecondary",
+        gutterBottom: 7,
+        ...labelProps
+      },
+      label
+    ), /* @__PURE__ */ import_react16.default.createElement(
       import_react_native16.TouchableOpacity,
       {
         onPress: () => setFocused(true),
-        style: styles2.container
+        style: styles.container
       },
       /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: { marginTop: multiline ? 5 : 0 } }, start),
-      options ? /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, value ? /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles2.inputText }, options.find((cur) => cur.value === value)?.label) : /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles2.placeholder }, placeholder), /* @__PURE__ */ import_react16.default.createElement(
+      options ? /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, value ? /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles.inputText }, options.find((cur) => cur.value === value)?.label) : /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles.placeholder }, placeholder), /* @__PURE__ */ import_react16.default.createElement(
         import_vector_icons8.Ionicons,
         {
           name: "chevron-down",
@@ -1726,10 +1871,10 @@ var TextField2 = import_react16.default.forwardRef(
           selectTextOnFocus: !disabled,
           onSubmitEditing,
           multiline,
-          textAlignVertical: multiline ? "top" : "center",
+          extAlignVertical: multiline ? "top" : "center",
           ...formProps,
           ...props,
-          style: styles2.input
+          style: styles.input
         }
       ),
       end ? /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: { marginRight: 20 } }, end) : type === "password" && /* @__PURE__ */ import_react16.default.createElement(
@@ -1751,11 +1896,11 @@ var TextField2 = import_react16.default.forwardRef(
       Typography_default,
       {
         color: "textSecondary",
-        style: styles2.helperText,
+        style: styles.helperText,
         variant: "caption"
       },
       helperText
-    ), error && /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles2.error }, /* @__PURE__ */ import_react16.default.createElement(import_vector_icons8.MaterialIcons, { name: "error", color: colors2.error.main, size: 16 }), /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles2.errorText, color: "error" }, error))), options && /* @__PURE__ */ import_react16.default.createElement(
+    ), error && /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles.error }, /* @__PURE__ */ import_react16.default.createElement(import_vector_icons8.MaterialIcons, { name: "error", color: colors2.error.main, size: 16 }), /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles.errorText, color: "error" }, error))), options && /* @__PURE__ */ import_react16.default.createElement(
       SelectMenu_default,
       {
         options,
@@ -1764,7 +1909,8 @@ var TextField2 = import_react16.default.forwardRef(
         onClose: () => setFocused(false),
         label,
         helperText,
-        onChange: onChangeText
+        onChange: onChangeText,
+        ...selectMenuProps
       }
     ));
   }
@@ -1773,7 +1919,7 @@ var TextField_default = TextField;
 
 // ../src/Components/Locator.tsx
 var Location = __toESM(require("expo-location"));
-var import_react_native_size_matters15 = require("react-native-size-matters");
+var import_react_native_size_matters14 = require("react-native-size-matters");
 var getPredictionsFromCoords = async (coords) => {
   const { GOOGLE_MAP_API_KEY } = getConfig();
   if (!GOOGLE_MAP_API_KEY)
@@ -1836,7 +1982,7 @@ var Locator = ({
   const [value, setValue] = (0, import_react17.useState)("");
   const [prediction, setPrediction] = (0, import_react17.useState)([]);
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters15.ScaledSheet.create({
+  const styles = import_react_native_size_matters14.ScaledSheet.create({
     list: {
       backgroundColor: colors2.white[2],
       elevation: 10,
@@ -1844,7 +1990,8 @@ var Locator = ({
       shadowOpacity: 0.1,
       shadowRadius: float ? 15 : 0,
       shadowOffset: {
-        height: 10
+        height: 10,
+        width: 0
       },
       borderRadius: 10,
       marginBottom: 10,
@@ -1949,7 +2096,7 @@ var Locator = ({
         }
       )), /* @__PURE__ */ import_react17.default.createElement(import_react_native17.TouchableOpacity, { onPress: clear }, /* @__PURE__ */ import_react17.default.createElement(import_vector_icons9.Ionicons, { color: colors2.dark.main, size: 18, name: "close" })))
     }
-  ), prediction.length > 0 && /* @__PURE__ */ import_react17.default.createElement(import_react_native17.View, { style: styles2.list }, prediction.map(
+  ), prediction.length > 0 && /* @__PURE__ */ import_react17.default.createElement(import_react_native17.View, { style: styles.list }, prediction.map(
     (cur, i) => i < 5 && /* @__PURE__ */ import_react17.default.createElement(
       ListItem,
       {
@@ -1973,26 +2120,27 @@ var Locator = ({
 };
 
 // ../src/Components/SafeAreaView.tsx
-var import_react_native18 = require("react-native");
 var import_react18 = __toESM(require("react"));
-var import_react_native19 = require("react-native");
-var import_react_native_size_matters16 = require("react-native-size-matters");
-var styles = import_react_native19.StyleSheet.create({
-  droidSafeArea: {
-    flex: 1,
-    paddingTop: import_react_native19.Platform.OS === "android" ? (0, import_react_native_size_matters16.moderateScale)(35) : 0
-  }
-});
+var import_react_native_safe_area_context6 = require("react-native-safe-area-context");
+var import_react_native18 = require("react-native");
 var SafeAreaView = ({
   children,
   style
 }) => {
-  return /* @__PURE__ */ import_react18.default.createElement(import_react_native18.SafeAreaView, { style: { ...styles.droidSafeArea, ...style } }, children);
+  const { top, bottom } = (0, import_react_native_safe_area_context6.useSafeAreaInsets)();
+  const styles = import_react_native18.StyleSheet.create({
+    root: {
+      paddingTop: top,
+      paddingBottom: bottom,
+      flex: 1
+    }
+  });
+  return /* @__PURE__ */ import_react18.default.createElement(import_react_native18.View, { style: [styles.root, style] }, children);
 };
 
 // ../src/Components/Divider.tsx
-var import_react_native20 = require("react-native");
-var import_react_native_size_matters17 = require("react-native-size-matters");
+var import_react_native19 = require("react-native");
+var import_react_native_size_matters15 = require("react-native-size-matters");
 var Divider = ({
   height = 1,
   color = "textSecondary",
@@ -2000,21 +2148,21 @@ var Divider = ({
   style
 }) => {
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters17.ScaledSheet.create({
+  const styles = import_react_native_size_matters15.ScaledSheet.create({
     root: {
       height,
       backgroundColor: colors2[color].main,
-      marginBottom: (0, import_react_native_size_matters17.ms)(gutterBottom),
+      marginBottom: (0, import_react_native_size_matters15.ms)(gutterBottom),
       ...style
     }
   });
-  return /* @__PURE__ */ React.createElement(import_react_native20.View, { style: styles2.root });
+  return /* @__PURE__ */ React.createElement(import_react_native19.View, { style: styles.root });
 };
 
 // ../src/Components/Spinner.tsx
 var import_react19 = __toESM(require("react"));
-var import_react_native21 = require("react-native");
-var import_react_native_size_matters18 = require("react-native-size-matters");
+var import_react_native20 = require("react-native");
+var import_react_native_size_matters16 = require("react-native-size-matters");
 var Spinner = ({
   label,
   size = "large",
@@ -2023,10 +2171,10 @@ var Spinner = ({
   style = {}
 }) => {
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters18.ScaledSheet.create({
+  const styles = import_react_native_size_matters16.ScaledSheet.create({
     root: {
-      width: fullscreen ? import_react_native21.Dimensions.get("screen").width : "100%",
-      height: fullscreen ? import_react_native21.Dimensions.get("screen").height : "100%",
+      width: fullscreen ? import_react_native20.Dimensions.get("screen").width : "100%",
+      height: fullscreen ? import_react_native20.Dimensions.get("screen").height : "100%",
       left: 0,
       bottom: 0,
       zIndex: 100,
@@ -2049,14 +2197,14 @@ var Spinner = ({
       color: color === "light" ? colors2.white[2] : colors2.black[4]
     }
   });
-  return /* @__PURE__ */ import_react19.default.createElement(import_react_native21.View, { style: styles2.root }, /* @__PURE__ */ import_react19.default.createElement(import_react_native21.View, { style: styles2.content }, /* @__PURE__ */ import_react19.default.createElement(import_react_native21.ActivityIndicator, { color: colors2[color].dark, size }), label && /* @__PURE__ */ import_react19.default.createElement(Typography_default, { style: styles2.label }, label)));
+  return /* @__PURE__ */ import_react19.default.createElement(import_react_native20.View, { style: styles.root }, /* @__PURE__ */ import_react19.default.createElement(import_react_native20.View, { style: styles.content }, /* @__PURE__ */ import_react19.default.createElement(import_react_native20.ActivityIndicator, { color: colors2[color].dark, size }), label && /* @__PURE__ */ import_react19.default.createElement(Typography_default, { style: styles.label }, label)));
 };
 var Spinner_default = Spinner;
 
 // ../src/Components/OTPInput.tsx
 var import_react20 = __toESM(require("react"));
-var import_react_native22 = require("react-native");
-var import_react_native_size_matters19 = require("react-native-size-matters");
+var import_react_native21 = require("react-native");
+var import_react_native_size_matters17 = require("react-native-size-matters");
 var OTPInput = ({
   length = 6,
   onChange = () => {
@@ -2070,12 +2218,10 @@ var OTPInput = ({
     () => Array(length).fill(0).map((_) => import_react20.default.createRef()),
     [length]
   );
-  console.log("v", value);
   const onChangeHandler = (val, index) => {
     if (value.length >= length && val.length > 0)
       return;
     if (val.length > 1) {
-      console.log("reached", val);
       const digits = val.replace(/\D/g, "").slice(0, length);
       onChange(digits);
       if (digits.length === length) {
@@ -2101,25 +2247,25 @@ var OTPInput = ({
     }
   };
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters19.ScaledSheet.create({
+  const styles = import_react_native_size_matters17.ScaledSheet.create({
     root: {},
     container: { flexDirection: "row" },
     input: {
-      height: (0, import_react_native_size_matters19.ms)(size),
-      width: (0, import_react_native_size_matters19.ms)(size),
+      height: (0, import_react_native_size_matters17.ms)(size),
+      width: (0, import_react_native_size_matters17.ms)(size),
       borderColor: colors2.white[5],
       backgroundColor: variant === "contained" ? colors2.white[3] : void 0,
       borderWidth: variant === "outlined" ? 1 : 0,
       borderBottomWidth: variant === "contained" ? 0 : 1,
-      marginHorizontal: (0, import_react_native_size_matters19.ms)(spacing * 5),
+      marginHorizontal: (0, import_react_native_size_matters17.ms)(spacing * 5),
       textAlign: "center",
       borderRadius: variant === "text" ? 0 : 10,
       color: colors2.dark.main,
-      fontSize: (0, import_react_native_size_matters19.ms)(size * 0.5)
+      fontSize: (0, import_react_native_size_matters17.ms)(size * 0.5)
     }
   });
-  return /* @__PURE__ */ import_react20.default.createElement(import_react_native22.View, { style: styles2.root }, /* @__PURE__ */ import_react20.default.createElement(import_react_native22.View, { style: styles2.container }, [...Array(length)].map((_, index) => /* @__PURE__ */ import_react20.default.createElement(
-    import_react_native22.TextInput,
+  return /* @__PURE__ */ import_react20.default.createElement(import_react_native21.View, { style: styles.root }, /* @__PURE__ */ import_react20.default.createElement(import_react_native21.View, { style: styles.container }, [...Array(length)].map((_, index) => /* @__PURE__ */ import_react20.default.createElement(
+    import_react_native21.TextInput,
     {
       ref: inputRefs[index],
       onChangeText: (val) => onChangeHandler(val, index),
@@ -2127,7 +2273,7 @@ var OTPInput = ({
       blurOnSubmit: false,
       keyboardType: "number-pad",
       key: index,
-      style: [styles2.input]
+      style: [styles.input]
     }
   ))));
 };
@@ -2169,6 +2315,7 @@ var next_default = HoddyUI;
   showFlashMessage,
   useColors,
   useNavScreenOptions,
-  useTheme
+  useTheme,
+  useThemeContext
 });
 //# sourceMappingURL=index.js.map