@hoddy-ui/core 2.5.29 → 2.5.31

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);
 
@@ -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"));
@@ -292,19 +292,21 @@ var Typography = (0, import_react.forwardRef)(
   }, 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)
+      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 || _fontSize[variant],
+        lineHeight: f * 1.2,
+        fontSize: f,
         marginBottom: (0, import_react_native_size_matters.ms)(gutterBottom) || 0,
         color: colors2[color]?.main || color,
         textTransform: textCase,
@@ -319,7 +321,7 @@ var Typography = (0, import_react.forwardRef)(
       {
         ref,
         adjustsFontSizeToFit,
-        style: [styles2.text, style],
+        style: [styles.text, style],
         ...props
       },
       children
@@ -329,7 +331,15 @@ 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)();
@@ -352,32 +362,42 @@ var FlashMessage = () => {
       (0, import_react_native_reanimated.runOnJS)(hideMessage)();
     });
   };
-  showFlashMessage = (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);
-  };
+  (0, import_react2.useEffect)(() => {
+    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 styles2 = import_react_native_size_matters2.ScaledSheet.create({
+  const styles = import_react_native_size_matters2.ScaledSheet.create({
     root: {
       position: "absolute",
       top: 0,
@@ -403,7 +423,7 @@ var FlashMessage = () => {
   });
   if (!message)
     return null;
-  return /* @__PURE__ */ import_react2.default.createElement(import_react_native_reanimated.default.View, { style: [styles2.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(
+  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",
@@ -416,7 +436,7 @@ var FlashMessage = () => {
     import_react_native2.TouchableOpacity,
     {
       key: i,
-      style: styles2.action,
+      style: styles.action,
       onPress: () => {
         cur.onPress?.();
         closeMessage();
@@ -503,6 +523,7 @@ var UIThemeProvider = ({ children }) => {
 };
 
 // ../src/hooks.ts
+var import_async_storage2 = __toESM(require("@react-native-async-storage/async-storage"));
 var useColors = () => {
   const { themeState } = (0, import_react4.useContext)(UIThemeContext);
   return colors(themeState.value);
@@ -511,9 +532,22 @@ 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 });
+      import_async_storage2.default.setItem("theme", "default");
+    } else {
+      themeDispatch?.({ type: theme2 });
+      import_async_storage2.default.setItem("theme", theme2);
+    }
+  };
+  return { theme, setTheme };
+};
 var useNavScreenOptions = (type) => {
   const colors2 = useColors();
-  const theme = useTheme();
   const options = {
     stack: {
       headerShown: false,
@@ -533,15 +567,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),
@@ -565,10 +596,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];
 };
 
@@ -602,7 +629,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",
@@ -612,7 +639,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,
@@ -620,7 +647,7 @@ var AlertX = ({
       borderRadius: 8,
       alignItems: "center",
       flexDirection: "row",
-      marginBottom: (0, import_react_native_size_matters4.ms)(gutterBottom),
+      marginBottom: (0, import_react_native_size_matters3.ms)(gutterBottom),
       backgroundColor: colors2[type].main + (variant === "contained" ? "" : "3")
     },
     title: {
@@ -630,7 +657,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,
@@ -645,7 +672,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,
@@ -655,11 +682,11 @@ var Avatar = ({
   style = {}
 }) => {
   const colors2 = useColors();
-  const styles2 = import_react_native_size_matters5.ScaledSheet.create({
+  const styles = import_react_native_size_matters4.ScaledSheet.create({
     root: {
       borderRadius: 150,
-      height: (0, import_react_native_size_matters5.ms)(size),
-      width: (0, import_react_native_size_matters5.ms)(size),
+      height: (0, import_react_native_size_matters4.ms)(size),
+      width: (0, import_react_native_size_matters4.ms)(size),
       alignItems: "center",
       justifyContent: "center",
       overflow: "hidden",
@@ -673,7 +700,7 @@ 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 ? /* @__PURE__ */ import_react7.default.createElement(import_react_native7.Image, { resizeMode: "cover", style: styles.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) }));
 };
 var Avatar_default = Avatar;
 
@@ -681,7 +708,7 @@ 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 = {},
@@ -693,15 +720,15 @@ var LinkButton = ({
   }
 }) => {
   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),
+      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 = {},
@@ -719,7 +746,7 @@ 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,
@@ -731,8 +758,8 @@ var IconButton = ({
         height: 1,
         width: 0
       },
-      height: bg ? (0, import_react_native_size_matters6.ms)(size + 20) : void 0,
-      width: bg ? (0, import_react_native_size_matters6.ms)(size + 20) : 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,
@@ -752,9 +779,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)(
@@ -777,7 +804,7 @@ 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",
@@ -814,7 +841,7 @@ var Button = (0, import_react8.forwardRef)(
         ref,
         onPress,
         disabled,
-        style: styles2.con
+        style: styles.con
       },
       start,
       loading && /* @__PURE__ */ import_react8.default.createElement(
@@ -825,7 +852,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
     );
   }
@@ -836,7 +863,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,
@@ -847,14 +874,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,
@@ -867,7 +894,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",
@@ -877,7 +905,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,
@@ -887,18 +917,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,
@@ -920,17 +950,17 @@ 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_reanimated2 = __toESM(require("react-native-reanimated"));
-var import_react_native_safe_area_context3 = require("react-native-safe-area-context");
-var import_react_native_size_matters9 = require("react-native-size-matters");
+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,
@@ -944,8 +974,9 @@ var Popup = ({
   const theme = useTheme();
   const colors2 = useColors();
   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_context3.useSafeAreaInsets)();
+  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;
@@ -967,22 +998,26 @@ var Popup = ({
       keyboardDidShowListener?.remove();
     };
   }, []);
+  const _onModalShow = () => {
+    setModalVisible(true);
+    onModalShow?.();
+  };
+  const _onModalHide = () => {
+    onModalHide?.();
+    setModalOpen(false);
+  };
   (0, import_react11.useEffect)(() => {
     if (open) {
-      setModalVisible(true);
+      setModalOpen(true);
       backdropOpacity.value = (0, import_react_native_reanimated2.withTiming)(1, { duration: 300 });
       contentTranslateY.value = (0, import_react_native_reanimated2.withTiming)(0, { duration: 300 }, () => {
-        if (onModalShow) {
-          (0, import_react_native_reanimated2.runOnJS)(onModalShow)();
-        }
+        (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)(setModalVisible)(false);
-        if (onModalHide) {
-          (0, import_react_native_reanimated2.runOnJS)(onModalHide)();
-        }
+        (0, import_react_native_reanimated2.runOnJS)(_onModalHide)();
       });
     }
   }, [open]);
@@ -992,7 +1027,7 @@ var Popup = ({
   const contentAnimatedStyle = (0, import_react_native_reanimated2.useAnimatedStyle)(() => ({
     transform: [{ translateY: contentTranslateY.value }]
   }));
-  const styles2 = import_react_native_size_matters9.ScaledSheet.create({
+  const styles = import_react_native_size_matters8.ScaledSheet.create({
     root: {
       height: "100%",
       width: "100%",
@@ -1012,7 +1047,7 @@ var Popup = ({
       marginBottom: import_react_native11.Platform.OS === "android" && keyboardVisible ? bottom : 0
     },
     container: {
-      paddingBottom: sheet && !bare ? bottom + (0, import_react_native_size_matters9.ms)(10) : void 0,
+      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,
@@ -1052,17 +1087,17 @@ var Popup = ({
       transparent: true,
       animationType: "none",
       statusBarTranslucent: true,
-      visible: modalVisible,
+      visible: modalOpen,
       onRequestClose: closeAction
     },
-    /* @__PURE__ */ import_react11.default.createElement(UIThemeProvider, null, /* @__PURE__ */ import_react11.default.createElement(import_react_native_reanimated2.default.View, { style: [styles2.backdrop, backdropAnimatedStyle] }), /* @__PURE__ */ import_react11.default.createElement(
+    /* @__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,
       {
-        style: styles2.keyboardView,
+        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(
+      /* @__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: styles.root }, modalOpen && /* @__PURE__ */ import_react11.default.createElement(
         import_react_native11.Pressable,
         {
           style: [import_react_native11.StyleSheet.absoluteFill, { zIndex: 1 }],
@@ -1071,17 +1106,17 @@ var Popup = ({
       ), /* @__PURE__ */ import_react11.default.createElement(
         import_react_native_reanimated2.default.View,
         {
-          style: [styles2.avoidingView, contentAnimatedStyle],
-          layout: import_react_native_reanimated2.LinearTransition.springify().stiffness(200).mass(0.5).damping(100)
+          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: 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(
+        /* @__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: styles2.content }, children))
+        )), /* @__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))
       )))
     ))
   );
@@ -1093,13 +1128,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,
@@ -1119,7 +1154,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"
@@ -1152,7 +1187,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,
@@ -1199,10 +1234,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),
@@ -1227,7 +1262,7 @@ var RatingInput = ({
 // ../src/Components/Grid.tsx
 var import_react13 = __toESM(require("react"));
 var import_react_native13 = require("react-native");
-var import_react_native_size_matters11 = require("react-native-size-matters");
+var import_react_native_size_matters10 = require("react-native-size-matters");
 var GridItem = ({
   children,
   col = 2,
@@ -1235,28 +1270,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: (0, import_react_native_size_matters11.ms)(spacing * 10),
+      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`,
       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
@@ -1268,7 +1303,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,
@@ -1278,7 +1313,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",
@@ -1291,7 +1326,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],
@@ -1307,14 +1342,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_context4 = 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,
@@ -1324,22 +1359,15 @@ var SelectMenu = ({
   disableAutoClose = false,
   label,
   secondary,
-  helperText
+  helperText,
+  searchEnabled = false,
+  searchPlaceholder = "Search"
 }) => {
   const colors2 = useColors();
-  const { bottom } = (0, import_react_native_safe_area_context4.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: {
@@ -1349,11 +1377,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)(
@@ -1361,7 +1384,7 @@ var SelectMenu = ({
       import_react_native15.TouchableOpacity,
       {
         style: {
-          ...styles2.option,
+          ...styles.option,
           backgroundColor: item.value === value ? colors2.blue.light + "22" : colors2.white[2]
         },
         onPress: () => {
@@ -1375,6 +1398,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]
           }
@@ -1403,10 +1427,10 @@ 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(
+  return /* @__PURE__ */ import_react15.default.createElement(Popup, { open, onClose, title: label }, /* @__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: "Search",
+      label: searchPlaceholder,
       value: search,
       type: "search",
       onChangeText: setSearch,
@@ -1417,21 +1441,13 @@ var SelectMenu = ({
     {
       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))
     }
-  )), /* @__PURE__ */ import_react15.default.createElement(import_react_native15.View, { style: styles2.footer }, /* @__PURE__ */ import_react15.default.createElement(
-    Button_default,
-    {
-      color: "error",
-      variant: "outlined",
-      fullWidth: true,
-      title: "Close",
-      onPress: onClose
-    }
-  ))));
+  )));
 };
 var SelectMenu_default = SelectMenu;
 
@@ -1461,32 +1477,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: (0, import_react_native_size_matters14.ms)(gutterBottom),
+      marginBottom: (0, import_react_native_size_matters13.ms)(gutterBottom),
       width: "100%",
       ...style
     },
@@ -1507,8 +1524,8 @@ 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: getFontFamily(400),
       color: colors2.black[1],
@@ -1518,13 +1535,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: 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
     },
@@ -1566,13 +1583,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,
@@ -1583,13 +1600,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,
       {
@@ -1610,7 +1627,7 @@ var TextField = ({
         placeholderTextColor: colors2.textSecondary.main,
         ...formProps,
         ...props,
-        style: styles2.input
+        style: styles.input
       }
     ),
     end && /* @__PURE__ */ import_react16.default.createElement(
@@ -1618,7 +1635,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
@@ -1628,7 +1645,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(
@@ -1644,11 +1661,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,
@@ -1657,7 +1674,8 @@ var TextField = ({
       onClose: () => setFocused(false),
       label,
       helperText,
-      onChange: onChangeText
+      onChange: onChangeText,
+      ...selectMenuProps
     }
   ));
 };
@@ -1688,20 +1706,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: (0, import_react_native_size_matters14.ms)(gutterBottom),
+        marginBottom: (0, import_react_native_size_matters13.ms)(gutterBottom),
         ...style
       },
       container: {
@@ -1720,8 +1739,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",
@@ -1729,12 +1748,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: {
@@ -1774,7 +1793,7 @@ 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(
+    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",
@@ -1787,10 +1806,10 @@ var TextField2 = import_react16.default.forwardRef(
       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",
@@ -1823,7 +1842,7 @@ var TextField2 = import_react16.default.forwardRef(
           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(
@@ -1845,11 +1864,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,
@@ -1858,7 +1877,8 @@ var TextField2 = import_react16.default.forwardRef(
         onClose: () => setFocused(false),
         label,
         helperText,
-        onChange: onChangeText
+        onChange: onChangeText,
+        ...selectMenuProps
       }
     ));
   }
@@ -1867,7 +1887,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)
@@ -1930,7 +1950,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,
@@ -2044,7 +2064,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,
       {
@@ -2068,26 +2088,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",
@@ -2095,21 +2116,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",
@@ -2118,10 +2139,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,
@@ -2144,14 +2165,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 = () => {
@@ -2194,25 +2215,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),
@@ -2220,7 +2241,7 @@ var OTPInput = ({
       blurOnSubmit: false,
       keyboardType: "number-pad",
       key: index,
-      style: [styles2.input]
+      style: [styles.input]
     }
   ))));
 };
@@ -2262,6 +2283,7 @@ var next_default = HoddyUI;
   showFlashMessage,
   useColors,
   useNavScreenOptions,
-  useTheme
+  useTheme,
+  useThemeContext
 });
 //# sourceMappingURL=index.js.map