@hoddy-ui/core 2.5.46 → 2.5.48

package/next/dist/index.mjs

@@ -243,7 +243,7 @@ var Typography = forwardRef(
     const config2 = getConfig();
     const customFontSizes = config2.TYPOGRAPHY?.fontSizes;
     const baseFontSize = customFontSizes?.[variant] ?? DEFAULT_FONT_SIZES[variant];
-    const f = fontSize || baseFontSize;
+    const f = fontSize || style?.fontSize || baseFontSize;
     const lh = lineHeight || f * 1.2;
     const styles = StyleSheet.create({
       text: {
@@ -339,6 +339,7 @@ var FlashMessage = () => {
       opacity: opacity.value
     };
   });
+  const textColor = type === "default" ? "#fff" : colors2[type].text;
   const styles = ScaledSheet.create({
     root: {
       position: "absolute",
@@ -347,7 +348,7 @@ var FlashMessage = () => {
       left: 0,
       paddingTop: top + 10,
       paddingHorizontal: "15@ms",
-      backgroundColor: colors2[type].main,
+      backgroundColor: type === "default" ? "#333" : colors2[type].main,
       width: "100%",
       borderBottomLeftRadius: 10,
       borderBottomRightRadius: 10,
@@ -371,10 +372,10 @@ var FlashMessage = () => {
       variant: "h6",
       fontWeight: 600,
       gutterBottom: 3,
-      style: { color: "#fff" }
+      color: textColor
     },
     message?.title
-  ), /* @__PURE__ */ React2.createElement(Typography_default, { style: { color: "#fff" } }, message?.message)))), message?.actions?.map((cur, i) => /* @__PURE__ */ React2.createElement(
+  ), /* @__PURE__ */ React2.createElement(Typography_default, { color: textColor }, message?.message)))), message?.actions?.map((cur, i) => /* @__PURE__ */ React2.createElement(
     TouchableOpacity,
     {
       key: i,
@@ -621,7 +622,7 @@ var AlertX = ({
 var AlertX_default = AlertX;
 
 // ../src/Components/Avatar.tsx
-import { AntDesign } from "@expo/vector-icons";
+import { Ionicons } from "@expo/vector-icons";
 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";
@@ -631,7 +632,8 @@ var Avatar = ({
   variant = "contained",
   source,
   size = 48,
-  style = {}
+  style = {},
+  icon
 }) => {
   const colors2 = useColors();
   const [imageError, setImageError] = useState3(false);
@@ -661,12 +663,12 @@ var Avatar = ({
       source,
       onError: () => setImageError(true)
     }
-  ) : 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) }));
+  ) : label ? /* @__PURE__ */ React6.createElement(Typography_default, { style: { color: colors2[color].text } }, label[0]) : icon ? icon : /* @__PURE__ */ React6.createElement(Ionicons, { name: "person", 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 { Ionicons as Ionicons2, MaterialIcons as MaterialIcons2 } from "@expo/vector-icons";
 import React7, { forwardRef as forwardRef2 } from "react";
 import { ActivityIndicator, Text as Text2, TouchableOpacity as TouchableOpacity2 } from "react-native";
 import { ScaledSheet as ScaledSheet4, moderateScale, ms as ms4 } from "react-native-size-matters";
@@ -733,7 +735,7 @@ var IconButton = ({
   });
   const IconComp = {
     material: MaterialIcons2,
-    ion: Ionicons
+    ion: Ionicons2
   }[iconType];
   return /* @__PURE__ */ React7.createElement(
     TouchableOpacity2,
@@ -916,7 +918,7 @@ var FormWrapper = forwardRef3(
 );
 
 // ../src/Components/StarRating.tsx
-import { Ionicons as Ionicons2 } from "@expo/vector-icons";
+import { Ionicons as Ionicons3 } from "@expo/vector-icons";
 import * as Haptics from "expo-haptics";
 import React11, { useEffect as useEffect4, useState as useState5 } from "react";
 import {
@@ -1179,7 +1181,7 @@ var RatingInput = ({
       }
     },
     /* @__PURE__ */ React11.createElement(
-      Ionicons2,
+      Ionicons3,
       {
         style: { marginLeft: 10 },
         name: index < rate ? "star" : "star-outline",
@@ -1254,7 +1256,7 @@ var RatingStars = ({
     }
   });
   return /* @__PURE__ */ React11.createElement(View6, { style: styles.root }, [...Array(Math.floor(rating))].map((_, index) => /* @__PURE__ */ React11.createElement(
-    Ionicons2,
+    Ionicons3,
     {
       key: index,
       name: "star",
@@ -1262,7 +1264,7 @@ var RatingStars = ({
       color: colors2[color]?.main || color
     }
   )), [...Array(5 - Math.floor(rating))].map((_, index) => /* @__PURE__ */ React11.createElement(
-    Ionicons2,
+    Ionicons3,
     {
       key: index,
       name: "star",
@@ -1308,7 +1310,7 @@ var Grid = ({
 };
 
 // ../src/Components/Locator.tsx
-import { Ionicons as Ionicons4 } from "@expo/vector-icons";
+import { Ionicons as Ionicons5 } from "@expo/vector-icons";
 import React16, { useEffect as useEffect5, useState as useState8 } from "react";
 import { Alert, TouchableOpacity as TouchableOpacity8, View as View11 } from "react-native";
 
@@ -1352,7 +1354,7 @@ var ListItem = ({
 };
 
 // ../src/Components/TextField.tsx
-import { Ionicons as Ionicons3, MaterialIcons as MaterialIcons5 } from "@expo/vector-icons";
+import { Ionicons as Ionicons4, MaterialIcons as MaterialIcons5 } from "@expo/vector-icons";
 import React15, { useRef as useRef2, useState as useState7 } from "react";
 import {
   Animated as Animated3,
@@ -1367,6 +1369,7 @@ import {
   ms as ms7,
   verticalScale
 } from "react-native-size-matters";
+import DateTimePickerModal from "react-native-modal-datetime-picker";
 
 // ../src/Components/SelectMenu.tsx
 import { MaterialIcons as MaterialIcons4 } from "@expo/vector-icons";
@@ -1501,6 +1504,7 @@ var TextField = ({
   color = "primary",
   value,
   type,
+  placeholder = "",
   helperText,
   onChangeText,
   onSubmitEditing = () => {
@@ -1524,6 +1528,8 @@ var TextField = ({
 }) => {
   const colors2 = useColors();
   const [focused, setFocused] = useState7(false);
+  const [datePickerVisible, setDatePickerVisible] = useState7(false);
+  const isDate = type === "date";
   const height2 = moderateScale2(variant === "text" ? 50 : 45) * (size === "large" ? 1.2 : size === "small" ? 0.8 : 1);
   const labelAnim = useRef2(
     new Animated3.Value(height2 / moderateScale2(variant === "text" ? 2.5 : 3.2))
@@ -1580,6 +1586,21 @@ var TextField = ({
       paddingLeft: variant === "text" ? 0 : moderateScale2(15),
       paddingTop: "13@ms"
     },
+    dateContent: {
+      flexDirection: "row",
+      alignItems: "center",
+      flex: 1,
+      paddingLeft: variant === "text" ? 0 : moderateScale2(15),
+      paddingRight: moderateScale2(10),
+      paddingTop: variant === "text" ? ms7(13) : ms7(12)
+    },
+    dateText: {
+      fontSize: "14@ms",
+      flex: 1
+    },
+    datePlaceholder: {
+      color: colors2.textSecondary.main
+    },
     label: {
       fontFamily: getFontFamily(400),
       position: "absolute",
@@ -1625,10 +1646,46 @@ var TextField = ({
     autoCapitalize: "none",
     textContentType: "password"
   } : {};
+  const parseDateValue = () => {
+    if (!value)
+      return /* @__PURE__ */ new Date();
+    if (value instanceof Date)
+      return value;
+    const parts = `${value}`.split("/");
+    if (parts.length === 3) {
+      const [day, month, year] = parts;
+      const parsed = new Date(
+        parseInt(year, 10),
+        parseInt(month, 10) - 1,
+        parseInt(day, 10)
+      );
+      if (!isNaN(parsed.getTime()))
+        return parsed;
+    }
+    const fallback = new Date(value);
+    return isNaN(fallback.getTime()) ? /* @__PURE__ */ new Date() : fallback;
+  };
+  const handleDateConfirm = (date) => {
+    const day = date.getDate();
+    const month = date.getMonth() + 1;
+    const year = date.getFullYear();
+    const dateString = `${day}/${month}/${year}`;
+    onChangeText?.(dateString);
+    setDatePickerVisible(false);
+  };
+  const handleContainerPress = () => {
+    if (disabled)
+      return;
+    setFocused(true);
+    if (isDate) {
+      onFocus();
+      setDatePickerVisible(true);
+    }
+  };
   return /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement(View10, { style: styles.root }, /* @__PURE__ */ React15.createElement(
     TouchableOpacity7,
     {
-      onPress: () => setFocused(true),
+      onPress: handleContainerPress,
       style: styles.container
     },
     /* @__PURE__ */ React15.createElement(Animated3.Text, { style: { ...styles.label, top: labelAnim } }, label),
@@ -1649,7 +1706,24 @@ var TextField = ({
         options.find((cur) => cur.value === value)?.start
       ),
       /* @__PURE__ */ React15.createElement(Typography_default, { style: styles.inputText }, options.find((cur) => cur.value === value)?.label)
-    ) : /* @__PURE__ */ React15.createElement(
+    ) : isDate ? /* @__PURE__ */ React15.createElement(View10, { style: styles.dateContent }, /* @__PURE__ */ React15.createElement(
+      Typography_default,
+      {
+        style: [
+          styles.dateText,
+          !value ? styles.datePlaceholder : void 0
+        ],
+        color: value ? "dark" : "textSecondary"
+      },
+      value || placeholder
+    ), /* @__PURE__ */ React15.createElement(View10, { style: { marginLeft: 8 } }, end ?? /* @__PURE__ */ React15.createElement(
+      Ionicons4,
+      {
+        name: "calendar-outline",
+        size: 22,
+        color: colors2.textSecondary.main
+      }
+    ))) : /* @__PURE__ */ React15.createElement(
       TextInput2,
       {
         onFocus: () => {
@@ -1691,7 +1765,7 @@ var TextField = ({
         }
       },
       /* @__PURE__ */ React15.createElement(
-        Ionicons3,
+        Ionicons4,
         {
           name: "chevron-down",
           color: colors2.textSecondary.main,
@@ -1719,6 +1793,18 @@ var TextField = ({
       onChange: onChangeText,
       ...selectMenuProps
     }
+  ), isDate && /* @__PURE__ */ React15.createElement(
+    DateTimePickerModal,
+    {
+      isVisible: datePickerVisible,
+      mode: "date",
+      date: parseDateValue(),
+      onConfirm: handleDateConfirm,
+      onCancel: () => {
+        setDatePickerVisible(false);
+        setFocused(false);
+      }
+    }
   ));
 };
 var TextField2 = React15.forwardRef(
@@ -1729,6 +1815,7 @@ var TextField2 = React15.forwardRef(
     color = "primary",
     value,
     type,
+    placeholder,
     helperText,
     onChangeText,
     onSubmitEditing = () => {
@@ -1744,7 +1831,6 @@ var TextField2 = React15.forwardRef(
     style = {},
     inputStyles = {},
     gutterBottom = 8,
-    placeholder,
     end,
     options,
     multiline,
@@ -1754,6 +1840,8 @@ var TextField2 = React15.forwardRef(
     const colors2 = useColors();
     const [focused, _setFocused] = useState7(false);
     const [showPassword, setShowPassword] = useState7(false);
+    const [datePickerVisible, setDatePickerVisible] = useState7(false);
+    const isDate = type === "date";
     const height2 = moderateScale2(
       multiline ? 50 + (props.numberOfLines || 1) * 18 : 50
     );
@@ -1804,6 +1892,20 @@ var TextField2 = React15.forwardRef(
         color: colors2.textSecondary.light,
         paddingLeft: moderateScale2(10)
       },
+      dateContent: {
+        flexDirection: "row",
+        alignItems: "center",
+        flex: 1,
+        paddingHorizontal: moderateScale2(10),
+        paddingTop: multiline ? 4 : 0
+      },
+      dateText: {
+        fontSize: "14@ms",
+        flex: 1
+      },
+      datePlaceholder: {
+        color: colors2.textSecondary.light
+      },
       label: {},
       helperText: {
         paddingHorizontal: "15@s",
@@ -1842,6 +1944,42 @@ var TextField2 = React15.forwardRef(
       autoCapitalize: "none",
       textContentType: "password"
     } : {};
+    const parseDateValue = () => {
+      if (!value)
+        return /* @__PURE__ */ new Date();
+      if (value instanceof Date)
+        return value;
+      const parts = `${value}`.split("/");
+      if (parts.length === 3) {
+        const [day, month, year] = parts;
+        const parsed = new Date(
+          parseInt(year, 10),
+          parseInt(month, 10) - 1,
+          parseInt(day, 10)
+        );
+        if (!isNaN(parsed.getTime()))
+          return parsed;
+      }
+      const fallback = new Date(value);
+      return isNaN(fallback.getTime()) ? /* @__PURE__ */ new Date() : fallback;
+    };
+    const handleDateConfirm = (date) => {
+      const day = date.getDate();
+      const month = date.getMonth() + 1;
+      const year = date.getFullYear();
+      const dateString = `${day}/${month}/${year}`;
+      onChangeText?.(dateString);
+      setDatePickerVisible(false);
+    };
+    const handleContainerPress = () => {
+      if (disabled)
+        return;
+      setFocused(true);
+      if (isDate) {
+        onFocus();
+        setDatePickerVisible(true);
+      }
+    };
     return /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement(View10, { style: styles.root }, label && /* @__PURE__ */ React15.createElement(
       Typography_default,
       {
@@ -1854,19 +1992,36 @@ var TextField2 = React15.forwardRef(
     ), /* @__PURE__ */ React15.createElement(
       TouchableOpacity7,
       {
-        onPress: () => setFocused(true),
+        onPress: handleContainerPress,
         style: styles.container
       },
       /* @__PURE__ */ React15.createElement(View10, { style: { marginTop: multiline ? 5 : 0 } }, start),
       options ? /* @__PURE__ */ React15.createElement(React15.Fragment, null, value ? /* @__PURE__ */ React15.createElement(Typography_default, { style: styles.inputText }, options.find((cur) => cur.value === value)?.label) : /* @__PURE__ */ React15.createElement(Typography_default, { style: styles.placeholder }, placeholder), /* @__PURE__ */ React15.createElement(
-        Ionicons3,
+        Ionicons4,
         {
           name: "chevron-down",
           size: 24,
           style: { marginLeft: "auto", marginRight: 15 },
           color: colors2.dark.light
         }
-      )) : /* @__PURE__ */ React15.createElement(
+      )) : isDate ? /* @__PURE__ */ React15.createElement(View10, { style: styles.dateContent }, /* @__PURE__ */ React15.createElement(
+        Typography_default,
+        {
+          style: [
+            styles.dateText,
+            !value ? styles.datePlaceholder : void 0
+          ],
+          color: value ? "dark" : "textSecondary"
+        },
+        value || placeholder
+      ), /* @__PURE__ */ React15.createElement(View10, { style: { marginLeft: 8 } }, end ?? /* @__PURE__ */ React15.createElement(
+        Ionicons4,
+        {
+          name: "calendar-outline",
+          size: 22,
+          color: colors2.textSecondary.main
+        }
+      ))) : /* @__PURE__ */ React15.createElement(
         TextInput2,
         {
           ref,
@@ -1901,7 +2056,7 @@ var TextField2 = React15.forwardRef(
           onPress: () => setShowPassword(!showPassword)
         },
         /* @__PURE__ */ React15.createElement(
-          Ionicons3,
+          Ionicons4,
           {
             name: showPassword ? "eye-outline" : "eye-off-outline",
             size: 24,
@@ -2111,13 +2266,13 @@ var Locator = ({
       helperText,
       variant,
       end: /* @__PURE__ */ React16.createElement(View11, { style: { flexDirection: "row" } }, /* @__PURE__ */ React16.createElement(TouchableOpacity8, { onPress: locateMe, style: { marginRight: 10 } }, /* @__PURE__ */ React16.createElement(
-        Ionicons4,
+        Ionicons5,
         {
           color: colors2.primary.main,
           size: 18,
           name: "location"
         }
-      )), /* @__PURE__ */ React16.createElement(TouchableOpacity8, { onPress: clear }, /* @__PURE__ */ React16.createElement(Ionicons4, { color: colors2.dark.main, size: 18, name: "close" })))
+      )), /* @__PURE__ */ React16.createElement(TouchableOpacity8, { onPress: clear }, /* @__PURE__ */ React16.createElement(Ionicons5, { color: colors2.dark.main, size: 18, name: "close" })))
     }
   ), prediction.length > 0 && /* @__PURE__ */ React16.createElement(View11, { style: styles.list }, prediction.map(
     (cur, i) => i < 5 && /* @__PURE__ */ React16.createElement(
@@ -2129,7 +2284,7 @@ var Locator = ({
         onPress: () => locationPressed(cur)
       },
       /* @__PURE__ */ React16.createElement(
-        Ionicons4,
+        Ionicons5,
         {
           name: "location-outline",
           style: { marginRight: 10 },