@hoddy-ui/next 2.0.63 → 2.0.65

package/dist/index.mjs

@@ -173,7 +173,7 @@ function initialize(config2) {
 
 // components/AdaptiveStatusBarNext.tsx
 import { useFocusEffect } from "expo-router";
-import React5, { useState as useState2 } from "react";
+import React4, { useState as useState2 } from "react";
 import { Platform as Platform3, StatusBar } from "react-native";
 
 // ../src/hooks.ts
@@ -184,12 +184,12 @@ import { Platform as Platform2, useColorScheme as useColorScheme2 } from "react-
 import AsyncStorage from "@react-native-async-storage/async-storage";
 import * as NavigationBar from "expo-navigation-bar";
 import * as SystemUI from "expo-system-ui";
-import React4, { createContext, useEffect as useEffect2, useReducer } from "react";
+import React3, { createContext, useEffect as useEffect2, useReducer } from "react";
 import { Platform, useColorScheme } from "react-native";
 import { SafeAreaProvider } from "react-native-safe-area-context";
 
 // ../src/Components/FlashMessage.tsx
-import React3, { useEffect, useRef, useState } from "react";
+import React2, { useEffect, useRef, useState } from "react";
 import { TouchableOpacity, View } from "react-native";
 import Animated, {
   runOnJS,
@@ -201,7 +201,7 @@ import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { ScaledSheet } from "react-native-size-matters";
 
 // ../src/Components/Typography.tsx
-import React2, { forwardRef } from "react";
+import React, { forwardRef } from "react";
 import { StyleSheet, Text } from "react-native";
 import { ms } from "react-native-size-matters";
 
@@ -253,7 +253,7 @@ var Typography = forwardRef(
         fontFamily: fontFamily || getFontFamily(fontWeight)
       }
     });
-    return /* @__PURE__ */ React2.createElement(
+    return /* @__PURE__ */ React.createElement(
       Text,
       {
         ref,
@@ -360,7 +360,7 @@ var FlashMessage = () => {
   });
   if (!message)
     return null;
-  return /* @__PURE__ */ React3.createElement(Animated.View, { style: [styles.root, animatedStyle] }, /* @__PURE__ */ React3.createElement(TouchableOpacity, { onPress: closeMessage, activeOpacity: 0.9 }, /* @__PURE__ */ React3.createElement(View, { style: { flexDirection: "row" } }, /* @__PURE__ */ React3.createElement(View, { style: { flex: 1, marginRight: 10 } }, message?.title && /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React2.createElement(Animated.View, { style: [styles.root, animatedStyle] }, /* @__PURE__ */ React2.createElement(TouchableOpacity, { onPress: closeMessage, activeOpacity: 0.9 }, /* @__PURE__ */ React2.createElement(View, { style: { flexDirection: "row" } }, /* @__PURE__ */ React2.createElement(View, { style: { flex: 1, marginRight: 10 } }, message?.title && /* @__PURE__ */ React2.createElement(
     Typography_default,
     {
       variant: "h6",
@@ -369,7 +369,7 @@ var FlashMessage = () => {
       style: { color: "#fff" }
     },
     message?.title
-  ), /* @__PURE__ */ React3.createElement(Typography_default, { style: { color: "#fff" } }, message?.message)))), message?.actions?.map((cur, i) => /* @__PURE__ */ React3.createElement(
+  ), /* @__PURE__ */ React2.createElement(Typography_default, { style: { color: "#fff" } }, message?.message)))), message?.actions?.map((cur, i) => /* @__PURE__ */ React2.createElement(
     TouchableOpacity,
     {
       key: i,
@@ -379,7 +379,7 @@ var FlashMessage = () => {
         closeMessage();
       }
     },
-    /* @__PURE__ */ React3.createElement(Typography_default, { fontWeight: 700, style: { color: "#fff" } }, cur.title)
+    /* @__PURE__ */ React2.createElement(Typography_default, { fontWeight: 700, style: { color: "#fff" } }, cur.title)
   )));
 };
 var FlashMessage_default = FlashMessage;
@@ -426,7 +426,7 @@ var ConfigureSystemUI = () => {
       }
     }
   }, [colors2, theme]);
-  return /* @__PURE__ */ React4.createElement(React4.Fragment, null);
+  return /* @__PURE__ */ React3.createElement(React3.Fragment, null);
 };
 var UIThemeProvider = ({ children }) => {
   const [themeState, themeDispatch] = useReducer(themeReducer, {
@@ -434,7 +434,7 @@ var UIThemeProvider = ({ children }) => {
     value: "light"
   });
   const colorScheme = useColorScheme();
-  React4.useEffect(() => {
+  React3.useEffect(() => {
     AsyncStorage.getItem("theme").then((val) => {
       if (val) {
         if (val === "default") {
@@ -454,7 +454,7 @@ var UIThemeProvider = ({ children }) => {
       }
     });
   }, [colorScheme]);
-  return /* @__PURE__ */ React4.createElement(SafeAreaProvider, null, /* @__PURE__ */ React4.createElement(
+  return /* @__PURE__ */ React3.createElement(SafeAreaProvider, null, /* @__PURE__ */ React3.createElement(
     UIThemeContext.Provider,
     {
       value: {
@@ -463,8 +463,8 @@ var UIThemeProvider = ({ children }) => {
       }
     },
     children,
-    /* @__PURE__ */ React4.createElement(FlashMessage_default, null),
-    /* @__PURE__ */ React4.createElement(ConfigureSystemUI, null)
+    /* @__PURE__ */ React3.createElement(FlashMessage_default, null),
+    /* @__PURE__ */ React3.createElement(ConfigureSystemUI, null)
   ));
 };
 
@@ -557,20 +557,20 @@ var AdaptiveStatusBar = ({ translucent = false }) => {
     }
   };
   useFocusEffect(
-    React5.useCallback(() => {
+    React4.useCallback(() => {
       statusbarHandler();
     }, [theme])
   );
-  React5.useEffect(() => {
+  React4.useEffect(() => {
     statusbarHandler();
   }, [theme]);
-  return /* @__PURE__ */ React5.createElement(React5.Fragment, null);
+  return /* @__PURE__ */ React4.createElement(React4.Fragment, null);
 };
 var AdaptiveStatusBarNext_default = AdaptiveStatusBar;
 
 // ../src/Components/AlertX.tsx
 import { MaterialIcons } from "@expo/vector-icons";
-import React6 from "react";
+import React5 from "react";
 import { View as View2 } from "react-native";
 import { ms as ms2, ScaledSheet as ScaledSheet2 } from "react-native-size-matters";
 var AlertX = ({
@@ -600,7 +600,7 @@ var AlertX = ({
       color: variant === "contained" ? "#fff" : colors2[type].main
     }
   });
-  return /* @__PURE__ */ React6.createElement(View2, { style: [styles.container, style] }, /* @__PURE__ */ React6.createElement(View2, { style: { width: "80%" } }, /* @__PURE__ */ React6.createElement(Typography_default, { style: styles.title, gutterBottom: 3, fontWeight: 700 }, title), body && /* @__PURE__ */ React6.createElement(Typography_default, { fontWeight: 700, variant: "body2", style: styles.body }, body)), /* @__PURE__ */ React6.createElement(View2, { style: { marginLeft: "auto" } }, /* @__PURE__ */ React6.createElement(
+  return /* @__PURE__ */ React5.createElement(View2, { style: [styles.container, style] }, /* @__PURE__ */ React5.createElement(View2, { style: { width: "80%" } }, /* @__PURE__ */ React5.createElement(Typography_default, { style: styles.title, gutterBottom: 3, fontWeight: 700 }, title), body && /* @__PURE__ */ React5.createElement(Typography_default, { fontWeight: 700, variant: "body2", style: styles.body }, body)), /* @__PURE__ */ React5.createElement(View2, { style: { marginLeft: "auto" } }, /* @__PURE__ */ React5.createElement(
     MaterialIcons,
     {
       color: variant === "contained" ? "#fff" : colors2[type].main,
@@ -613,7 +613,7 @@ var AlertX_default = AlertX;
 
 // ../src/Components/Avatar.tsx
 import { AntDesign } from "@expo/vector-icons";
-import React7, { useState as useState3 } from "react";
+import React6, { useState as useState3 } from "react";
 import { Image, View as View3 } from "react-native";
 import { ms as ms3, ScaledSheet as ScaledSheet3 } from "react-native-size-matters";
 var Avatar = ({
@@ -644,7 +644,7 @@ var Avatar = ({
       width: "110%"
     }
   });
-  return /* @__PURE__ */ React7.createElement(View3, { style: styles.root }, source && !imageError ? /* @__PURE__ */ React7.createElement(
+  return /* @__PURE__ */ React6.createElement(View3, { style: styles.root }, source && !imageError ? /* @__PURE__ */ React6.createElement(
     Image,
     {
       resizeMode: "cover",
@@ -652,13 +652,13 @@ var Avatar = ({
       source,
       onError: () => setImageError(true)
     }
-  ) : label ? /* @__PURE__ */ React7.createElement(Typography_default, { style: { color: colors2[color].text } }, label[0]) : /* @__PURE__ */ React7.createElement(AntDesign, { name: "user", color: "#fff", size: Math.round(size / 1.5) }));
+  ) : label ? /* @__PURE__ */ React6.createElement(Typography_default, { style: { color: colors2[color].text } }, label[0]) : /* @__PURE__ */ React6.createElement(AntDesign, { name: "user", color: "#fff", size: Math.round(size / 1.5) }));
 };
 var Avatar_default = Avatar;
 
 // ../src/Components/Button.tsx
 import { Ionicons, MaterialIcons as MaterialIcons2 } from "@expo/vector-icons";
-import React8, { forwardRef as forwardRef2 } from "react";
+import React7, { forwardRef as forwardRef2 } from "react";
 import { ActivityIndicator, Text as Text2, TouchableOpacity as TouchableOpacity2 } from "react-native";
 import { ScaledSheet as ScaledSheet4, moderateScale as moderateScale2, ms as ms4 } from "react-native-size-matters";
 var LinkButton = ({
@@ -680,7 +680,7 @@ var LinkButton = ({
       color: disabled ? "#777" : colors2[color].main
     }
   });
-  return /* @__PURE__ */ React8.createElement(TouchableOpacity2, { onPress, disabled }, /* @__PURE__ */ React8.createElement(Text2, { style: { ...styles.text, ...style } }, title));
+  return /* @__PURE__ */ React7.createElement(TouchableOpacity2, { onPress, disabled }, /* @__PURE__ */ React7.createElement(Text2, { style: { ...styles.text, ...style } }, title));
 };
 var IconButton = ({
   style = {},
@@ -726,14 +726,14 @@ var IconButton = ({
     material: MaterialIcons2,
     ion: Ionicons
   }[iconType];
-  return /* @__PURE__ */ React8.createElement(
+  return /* @__PURE__ */ React7.createElement(
     TouchableOpacity2,
     {
       onPress,
       activeOpacity: 0.3,
       style: { ...styles.container, ...containerStyles }
     },
-    /* @__PURE__ */ React8.createElement(IconComp, { style: { ...styles.text, ...style }, name: icon, size })
+    /* @__PURE__ */ React7.createElement(IconComp, { style: { ...styles.text, ...style }, name: icon, size })
   );
 };
 var Button = forwardRef2(
@@ -787,7 +787,7 @@ var Button = forwardRef2(
         fontFamily: getFontFamily(variant === "outlined" ? 700 : 500)
       }
     });
-    return /* @__PURE__ */ React8.createElement(
+    return /* @__PURE__ */ React7.createElement(
       TouchableOpacity2,
       {
         ref,
@@ -796,7 +796,7 @@ var Button = forwardRef2(
         style: styles.con
       },
       start,
-      loading && /* @__PURE__ */ React8.createElement(
+      loading && /* @__PURE__ */ React7.createElement(
         ActivityIndicator,
         {
           size: "small",
@@ -804,7 +804,7 @@ var Button = forwardRef2(
           style: { marginRight: 10 }
         }
       ),
-      /* @__PURE__ */ React8.createElement(Text2, { style: styles.text }, title),
+      /* @__PURE__ */ React7.createElement(Text2, { style: styles.text }, title),
       end
     );
   }
@@ -813,7 +813,7 @@ var Button_default = Button;
 
 // ../src/Components/Checkbox.tsx
 import { MaterialCommunityIcons } from "@expo/vector-icons";
-import React9 from "react";
+import React8 from "react";
 import { TouchableOpacity as TouchableOpacity3, View as View4 } from "react-native";
 import { ScaledSheet as ScaledSheet5 } from "react-native-size-matters";
 var CheckBox = ({
@@ -833,7 +833,7 @@ var CheckBox = ({
       ...style
     }
   });
-  return /* @__PURE__ */ React9.createElement(View4, { style: styles.container }, /* @__PURE__ */ React9.createElement(TouchableOpacity3, { onPress: onChange }, /* @__PURE__ */ React9.createElement(
+  return /* @__PURE__ */ React8.createElement(View4, { style: styles.container }, /* @__PURE__ */ React8.createElement(TouchableOpacity3, { onPress: onChange }, /* @__PURE__ */ React8.createElement(
     MaterialCommunityIcons,
     {
       name: iconName,
@@ -844,7 +844,7 @@ var CheckBox = ({
 };
 
 // ../src/Components/FormWrapper.tsx
-import React10 from "react";
+import React9 from "react";
 import {
   Keyboard,
   KeyboardAvoidingView,
@@ -872,7 +872,7 @@ var FormWrapper = ({
       ...style
     }
   });
-  return mode === "static" ? /* @__PURE__ */ React10.createElement(TouchableWithoutFeedback, { onPress: Keyboard.dismiss, accessible: false }, /* @__PURE__ */ React10.createElement(
+  return mode === "static" ? /* @__PURE__ */ React9.createElement(TouchableWithoutFeedback, { onPress: Keyboard.dismiss, accessible: false }, /* @__PURE__ */ React9.createElement(
     KeyboardAvoidingView,
     {
       style: styles.root,
@@ -881,14 +881,14 @@ var FormWrapper = ({
       keyboardVerticalOffset: keyboardVerticalOffset || defaultOffset
     },
     children
-  )) : /* @__PURE__ */ React10.createElement(
+  )) : /* @__PURE__ */ React9.createElement(
     KeyboardAvoidingView,
     {
       behavior,
       style: styles.root,
       keyboardVerticalOffset: keyboardVerticalOffset || defaultOffset
     },
-    /* @__PURE__ */ React10.createElement(
+    /* @__PURE__ */ React9.createElement(
       ScrollView,
       {
         onScroll,
@@ -906,7 +906,7 @@ var FormWrapper = ({
 // ../src/Components/StarRating.tsx
 import { Ionicons as Ionicons2 } from "@expo/vector-icons";
 import * as Haptics from "expo-haptics";
-import { useEffect as useEffect4, useState as useState5 } from "react";
+import React11, { useEffect as useEffect4, useState as useState5 } from "react";
 import {
   ActivityIndicator as ActivityIndicator2,
   TextInput,
@@ -926,7 +926,7 @@ import {
   TouchableWithoutFeedback as TouchableWithoutFeedback2,
   View as View5
 } from "react-native";
-import React11, { useEffect as useEffect3, useState as useState4 } from "react";
+import React10, { useEffect as useEffect3, useState as useState4 } from "react";
 import Animated2, {
   LinearTransition,
   runOnJS as runOnJS2,
@@ -1060,7 +1060,7 @@ var Popup = ({
   const closeAction = () => {
     onClose();
   };
-  return /* @__PURE__ */ React11.createElement(
+  return /* @__PURE__ */ React10.createElement(
     Modal,
     {
       transparent: true,
@@ -1069,39 +1069,39 @@ var Popup = ({
       visible: modalOpen,
       onRequestClose: closeAction
     },
-    /* @__PURE__ */ React11.createElement(UIThemeProvider, null, /* @__PURE__ */ React11.createElement(Animated2.View, { style: [styles.backdrop, backdropAnimatedStyle] }), /* @__PURE__ */ React11.createElement(
+    /* @__PURE__ */ React10.createElement(UIThemeProvider, null, /* @__PURE__ */ React10.createElement(Animated2.View, { style: [styles.backdrop, backdropAnimatedStyle] }), /* @__PURE__ */ React10.createElement(
       KeyboardAvoidingView2,
       {
         style: styles.keyboardView,
         behavior: Platform5.OS === "ios" ? "padding" : "height",
         keyboardVerticalOffset: keyboardVerticalOffset || keyboardVerticalOffsetValue
       },
-      /* @__PURE__ */ React11.createElement(
+      /* @__PURE__ */ React10.createElement(
         TouchableWithoutFeedback2,
         {
           onPress: Keyboard2.dismiss,
           disabled: disableAutoKeyboardManagement
         },
-        /* @__PURE__ */ React11.createElement(View5, { style: styles.root }, modalOpen && /* @__PURE__ */ React11.createElement(
+        /* @__PURE__ */ React10.createElement(View5, { style: styles.root }, modalOpen && /* @__PURE__ */ React10.createElement(
           Pressable,
           {
             style: [StyleSheet2.absoluteFill, { zIndex: 1 }],
             onPress: closeAction
           }
-        ), /* @__PURE__ */ React11.createElement(
+        ), /* @__PURE__ */ React10.createElement(
           Animated2.View,
           {
             style: [styles.avoidingView, contentAnimatedStyle],
             layout: modalVisible ? LinearTransition.springify().stiffness(200).mass(0.5).damping(100) : void 0
           },
-          /* @__PURE__ */ React11.createElement(View5, { style: styles.container }, !bare && /* @__PURE__ */ React11.createElement(View5, { style: styles.title }, /* @__PURE__ */ React11.createElement(View5, { style: styles.titleIcon }, /* @__PURE__ */ React11.createElement(
+          /* @__PURE__ */ React10.createElement(View5, { style: styles.container }, !bare && /* @__PURE__ */ React10.createElement(View5, { style: styles.title }, /* @__PURE__ */ React10.createElement(View5, { style: styles.titleIcon }, /* @__PURE__ */ React10.createElement(
             IconButton,
             {
               size: 20,
               icon: "close",
               onPress: closeAction
             }
-          )), /* @__PURE__ */ React11.createElement(Typography_default, { align: "center", fontWeight: 500 }, title)), /* @__PURE__ */ React11.createElement(View5, { style: styles.content }, children))
+          )), /* @__PURE__ */ React10.createElement(Typography_default, { align: "center", fontWeight: 500 }, title)), /* @__PURE__ */ React10.createElement(View5, { style: styles.content }, children))
         ))
       )
     ))
@@ -1109,36 +1109,6 @@ var Popup = ({
 };
 
 // ../src/Components/StarRating.tsx
-var RatingStars = ({
-  rating = 0,
-  size = 16,
-  color = "#FFD700"
-}) => {
-  const colors2 = useColors();
-  const styles = ScaledSheet8.create({
-    root: {
-      flexDirection: "row",
-      alignItems: "center"
-    }
-  });
-  return /* @__PURE__ */ React.createElement(View6, { style: styles.root }, [...Array(Math.floor(rating))].map((_, index) => /* @__PURE__ */ React.createElement(
-    Ionicons2,
-    {
-      key: index,
-      name: "star",
-      size,
-      color: colors2[color]?.main || color
-    }
-  )), [...Array(5 - Math.floor(rating))].map((_, index) => /* @__PURE__ */ React.createElement(
-    Ionicons2,
-    {
-      key: index,
-      name: "star",
-      size,
-      color: colors2.textSecondary.light
-    }
-  )));
-};
 var RatingInput = ({
   onSubmit: _onSubmit,
   rating = 0,
@@ -1183,7 +1153,7 @@ var RatingInput = ({
     _onSubmit && await _onSubmit({ rating: rate, review });
     setLoading(false);
   };
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View6, { style: styles.root }, loading ? /* @__PURE__ */ React.createElement(ActivityIndicator2, null) : [...Array(5)].map((_, index) => /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(View6, { style: styles.root }, loading ? /* @__PURE__ */ React11.createElement(ActivityIndicator2, null) : [...Array(5)].map((_, index) => /* @__PURE__ */ React11.createElement(
     TouchableOpacity4,
     {
       key: index,
@@ -1192,7 +1162,7 @@ var RatingInput = ({
         onRate(index);
       }
     },
-    /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React11.createElement(
       Ionicons2,
       {
         style: { marginLeft: 10 },
@@ -1201,7 +1171,7 @@ var RatingInput = ({
         color: colors2[color]?.main || color
       }
     )
-  ))), /* @__PURE__ */ React.createElement(
+  ))), /* @__PURE__ */ React11.createElement(
     Popup,
     {
       sheet: true,
@@ -1210,7 +1180,7 @@ var RatingInput = ({
         setShowReviewsModal(false);
       }
     },
-    /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React11.createElement(
       View6,
       {
         style: {
@@ -1218,9 +1188,9 @@ var RatingInput = ({
           marginBottom: 5
         }
       },
-      /* @__PURE__ */ React.createElement(RatingStars, { rating: rate, size: 24 })
+      /* @__PURE__ */ React11.createElement(RatingStars, { rating: rate, size: 24 })
     ),
-    /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React11.createElement(
       Typography_default,
       {
         align: "center",
@@ -1230,7 +1200,7 @@ var RatingInput = ({
       },
       "Add to your review"
     ),
-    /* @__PURE__ */ React.createElement(View6, { style: styles.inputCon }, /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React11.createElement(View6, { style: styles.inputCon }, /* @__PURE__ */ React11.createElement(
       TextInput,
       {
         style: styles.input,
@@ -1241,7 +1211,7 @@ var RatingInput = ({
         verticalAlign: "top"
       }
     )),
-    /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React11.createElement(
       Button_default,
       {
         gutterBottom: 40,
@@ -1255,6 +1225,36 @@ var RatingInput = ({
     )
   ));
 };
+var RatingStars = ({
+  rating = 0,
+  size = 16,
+  color = "#FFD700"
+}) => {
+  const colors2 = useColors();
+  const styles = ScaledSheet8.create({
+    root: {
+      flexDirection: "row",
+      alignItems: "center"
+    }
+  });
+  return /* @__PURE__ */ React11.createElement(View6, { style: styles.root }, [...Array(Math.floor(rating))].map((_, index) => /* @__PURE__ */ React11.createElement(
+    Ionicons2,
+    {
+      key: index,
+      name: "star",
+      size,
+      color: colors2[color]?.main || color
+    }
+  )), [...Array(5 - Math.floor(rating))].map((_, index) => /* @__PURE__ */ React11.createElement(
+    Ionicons2,
+    {
+      key: index,
+      name: "star",
+      size,
+      color: colors2.textSecondary.light
+    }
+  )));
+};
 
 // ../src/Components/Grid.tsx
 import React12 from "react";
@@ -2124,6 +2124,7 @@ var SafeAreaView = ({
 };
 
 // ../src/Components/Divider.tsx
+import React18 from "react";
 import { View as View13 } from "react-native";
 import { ScaledSheet as ScaledSheet14, ms as ms8 } from "react-native-size-matters";
 var Divider = ({
@@ -2141,11 +2142,11 @@ var Divider = ({
       ...style
     }
   });
-  return /* @__PURE__ */ React.createElement(View13, { style: styles.root });
+  return /* @__PURE__ */ React18.createElement(View13, { style: styles.root });
 };
 
 // ../src/Components/Spinner.tsx
-import React18 from "react";
+import React19 from "react";
 import { ActivityIndicator as ActivityIndicator3, Dimensions, View as View14 } from "react-native";
 import { ScaledSheet as ScaledSheet15 } from "react-native-size-matters";
 var Spinner = ({
@@ -2182,12 +2183,12 @@ var Spinner = ({
       color: color === "light" ? colors2.white[2] : colors2.black[4]
     }
   });
-  return /* @__PURE__ */ React18.createElement(View14, { style: styles.root }, /* @__PURE__ */ React18.createElement(View14, { style: styles.content }, /* @__PURE__ */ React18.createElement(ActivityIndicator3, { color: colors2[color].dark, size }), label && /* @__PURE__ */ React18.createElement(Typography_default, { style: styles.label }, label)));
+  return /* @__PURE__ */ React19.createElement(View14, { style: styles.root }, /* @__PURE__ */ React19.createElement(View14, { style: styles.content }, /* @__PURE__ */ React19.createElement(ActivityIndicator3, { color: colors2[color].dark, size }), label && /* @__PURE__ */ React19.createElement(Typography_default, { style: styles.label }, label)));
 };
 var Spinner_default = Spinner;
 
 // ../src/Components/OTPInput.tsx
-import React19, { useMemo } from "react";
+import React20, { useMemo } from "react";
 import {
   TextInput as TextInput3,
   View as View15
@@ -2203,7 +2204,7 @@ var OTPInput = ({
   size = 45
 }) => {
   const inputRefs = useMemo(
-    () => Array(length).fill(0).map((_) => React19.createRef()),
+    () => Array(length).fill(0).map((_) => React20.createRef()),
     [length]
   );
   const onChangeHandler = (val, index) => {
@@ -2252,7 +2253,7 @@ var OTPInput = ({
       fontSize: ms9(size * 0.5)
     }
   });
-  return /* @__PURE__ */ React19.createElement(View15, { style: styles.root }, /* @__PURE__ */ React19.createElement(View15, { style: styles.container }, [...Array(length)].map((_, index) => /* @__PURE__ */ React19.createElement(
+  return /* @__PURE__ */ React20.createElement(View15, { style: styles.root }, /* @__PURE__ */ React20.createElement(View15, { style: styles.container }, [...Array(length)].map((_, index) => /* @__PURE__ */ React20.createElement(
     TextInput3,
     {
       ref: inputRefs[index],