dhre-ui-kit 0.0.294 → 0.0.296

package/lib/index.mjs

@@ -1,4 +1,4 @@
-import React$1, { createContext, useContext, useState, useEffect, useRef, memo, useCallback } from 'react';
+import React, { createContext, useContext, useState, useEffect, useRef, memo, useCallback } from 'react';
 import { useSelector } from 'react-redux';
 import { Dimensions, StyleSheet, Text, Pressable, View, Platform, KeyboardAvoidingView, TextInput, ScrollView, Animated, FlatList, TouchableOpacity, Modal as Modal$1, Alert, Linking, PanResponder } from 'react-native';
 import Modal from 'react-native-modal';
@@ -272,7 +272,7 @@ const ThemeProvider = ({ children }) => {
     acc[key] = theme[key][mode];
     return acc;
   }, {});
-  return /* @__PURE__ */ React$1.createElement(ThemeContext.Provider, { value: { theme: filteredTheme, mode } }, children);
+  return /* @__PURE__ */ React.createElement(ThemeContext.Provider, { value: { theme: filteredTheme, mode } }, children);
 };
 const useTheme = () => {
   const context = useContext(ThemeContext);
@@ -283,7 +283,7 @@ const useTheme = () => {
 };
 
 const withThemeProvider = (Component) => {
-  return (props) => /* @__PURE__ */ React$1.createElement(ThemeProvider, null, /* @__PURE__ */ React$1.createElement(Component, { ...props }));
+  return (props) => /* @__PURE__ */ React.createElement(ThemeProvider, null, /* @__PURE__ */ React.createElement(Component, { ...props }));
 };
 
 const { width, height } = Dimensions.get("window");
@@ -347,7 +347,7 @@ const CustomTypography = ({
   ...props
 }) => {
   const textStyle = FONT_STYLES[variant];
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     Text,
     {
       testID,
@@ -369,7 +369,7 @@ const CustomText = ({
   ...props
 }) => {
   const { theme } = useTheme();
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant,
@@ -593,15 +593,15 @@ const Badge = ({
   iconStyle,
   handleIconPress
 }) => {
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     Pressable,
     {
       style: [styles$A.badge, commonStyles.centerRow, style],
       testID: "BADGE",
       onPress: handleIconPress
     },
-    iconName && /* @__PURE__ */ React$1.createElement(View, { style: [styles$A.icon, iconStyle] }, React$1.cloneElement(iconName)),
-    text && /* @__PURE__ */ React$1.createElement(
+    iconName && /* @__PURE__ */ React.createElement(View, { style: [styles$A.icon, iconStyle] }, React.cloneElement(iconName)),
+    text && /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: "B3semiBold",
@@ -680,7 +680,7 @@ const BottomDrawer = ({
   propagateSwipe = true,
   swipeDirection = "down"
 }) => {
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     Modal,
     {
       isVisible: isModalVisible,
@@ -692,25 +692,25 @@ const BottomDrawer = ({
       propagateSwipe: true,
       style: { margin: 0 }
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       KeyboardAvoidingView,
       {
         behavior: isIos() ? "padding" : "height",
         style: { flex: 1 }
       },
-      /* @__PURE__ */ React$1.createElement(View, { style: [styles$z.mainContainer, style], testID }, /* @__PURE__ */ React$1.createElement(View, { style: [styles$z.modalContainer, modalContainerStyle] }, showHeader && /* @__PURE__ */ React$1.createElement(Pressable, { onPress: () => swipeDirection === "" && toggleModal() }, showSeparator && /* @__PURE__ */ React$1.createElement(View, { style: styles$z.separator }), /* @__PURE__ */ React$1.createElement(View, { style: styles$z.headerContainer }, showLeftIcon && leftIcon ? React$1.cloneElement(leftIcon, {
+      /* @__PURE__ */ React.createElement(View, { style: [styles$z.mainContainer, style], testID }, /* @__PURE__ */ React.createElement(View, { style: [styles$z.modalContainer, modalContainerStyle] }, showHeader && /* @__PURE__ */ React.createElement(Pressable, { onPress: () => swipeDirection === "" && toggleModal() }, showSeparator && /* @__PURE__ */ React.createElement(View, { style: styles$z.separator }), /* @__PURE__ */ React.createElement(View, { style: styles$z.headerContainer }, showLeftIcon && leftIcon ? React.cloneElement(leftIcon, {
         width: moderateScale(24),
         height: moderateScale(24),
         style: styles$z.leftIconStyle,
         onPress: onLeftIconPress
-      }) : null, /* @__PURE__ */ React$1.createElement(
+      }) : null, /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           variant: titleVariant,
           text: title,
           style: { ...styles$z.title, ...titleStyle }
         }
-      ), showRightIcon && rightIcon ? React$1.cloneElement(rightIcon, {
+      ), showRightIcon && rightIcon ? React.cloneElement(rightIcon, {
         width: moderateScale(24),
         height: moderateScale(24),
         style: styles$z.rightIconStyle,
@@ -770,7 +770,7 @@ const CustomLoader = ({ loading, loadingText = "Loading..." }) => {
   const styles = createStyles$3(theme);
   if (!loading) return null;
   else {
-    return /* @__PURE__ */ React$1.createElement(View, { style: styles.container }, /* @__PURE__ */ React$1.createElement(View, { style: styles.backdrop }, /* @__PURE__ */ React$1.createElement(View, { style: styles.box }, /* @__PURE__ */ React$1.createElement(View, { style: styles.loader }, /* @__PURE__ */ React$1.createElement(LottieView, { style: styles.loader, source: loaderJson, autoPlay: true, loop: true })), /* @__PURE__ */ React$1.createElement(
+    return /* @__PURE__ */ React.createElement(View, { style: styles.container }, /* @__PURE__ */ React.createElement(View, { style: styles.backdrop }, /* @__PURE__ */ React.createElement(View, { style: styles.box }, /* @__PURE__ */ React.createElement(View, { style: styles.loader }, /* @__PURE__ */ React.createElement(LottieView, { style: styles.loader, source: loaderJson, autoPlay: true, loop: true })), /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         text: loadingText,
@@ -801,7 +801,7 @@ const CustomButton = ({
   isLoading = false
 }) => {
   const { theme } = useTheme();
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     Pressable,
     {
       testID,
@@ -818,8 +818,8 @@ const CustomButton = ({
       onPress,
       disabled
     },
-    imagePosition === "left" && leftIcon && /* @__PURE__ */ React$1.createElement(View, { style: iconStyle }, React$1.cloneElement(leftIcon, { width: 20, height: 20 })),
-    isLoading ? /* @__PURE__ */ React$1.createElement(CustomLoader$1, { loading: isLoading }) : /* @__PURE__ */ React$1.createElement(
+    imagePosition === "left" && leftIcon && /* @__PURE__ */ React.createElement(View, { style: iconStyle }, React.cloneElement(leftIcon, { width: 20, height: 20 })),
+    isLoading ? /* @__PURE__ */ React.createElement(CustomLoader$1, { loading: isLoading }) : /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         text: title,
@@ -833,7 +833,7 @@ const CustomButton = ({
         textColor: titleColor
       }
     ),
-    imagePosition === "right" && rightIcon && /* @__PURE__ */ React$1.createElement(View, { style: iconStyle }, React$1.cloneElement(rightIcon, { width: 20, height: 20 }))
+    imagePosition === "right" && rightIcon && /* @__PURE__ */ React.createElement(View, { style: iconStyle }, React.cloneElement(rightIcon, { width: 20, height: 20 }))
   );
 };
 const styles$y = StyleSheet.create({
@@ -913,42 +913,42 @@ const Cards = ({
   testID,
   onButtonPress
 }) => {
-  return /* @__PURE__ */ React$1.createElement(View, { testID, style: styles$x.container }, topLeftTitle ? /* @__PURE__ */ React$1.createElement(View, { style: styles$x.topLeft }, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { testID, style: styles$x.container }, topLeftTitle ? /* @__PURE__ */ React.createElement(View, { style: styles$x.topLeft }, /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant: "P2regular",
       style: styles$x.title,
       text: topLeftTitle
     }
-  )) : null, title ? /* @__PURE__ */ React$1.createElement(
+  )) : null, title ? /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant: "H6bold",
       style: styles$x.subTitleBelow,
       text: title
     }
-  ) : null, subtitle ? /* @__PURE__ */ React$1.createElement(
+  ) : null, subtitle ? /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant: "P3regular",
       style: styles$x.subtitle,
       text: subtitle
     }
-  ) : null, /* @__PURE__ */ React$1.createElement(View, { style: styles$x.leftBottomView }, iconSource ? iconSource : null, iconTitle ? /* @__PURE__ */ React$1.createElement(
+  ) : null, /* @__PURE__ */ React.createElement(View, { style: styles$x.leftBottomView }, iconSource ? iconSource : null, iconTitle ? /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant: "P3regular",
       style: styles$x.subTitleLeftBelow,
       text: iconTitle
     }
-  ) : null), buttonShown ? /* @__PURE__ */ React$1.createElement(
+  ) : null), buttonShown ? /* @__PURE__ */ React.createElement(
     Pressable,
     {
       testID: "Button-Press",
       style: styles$x.button,
       onPress: onButtonPress
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: "B2semiBold",
@@ -1010,12 +1010,12 @@ const Checkbox = ({
     setChecked(!checked);
     onCheck && onCheck(!checked);
   };
-  return /* @__PURE__ */ React$1.createElement(View, { testID, style: containerStyle }, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { testID, style: containerStyle }, /* @__PURE__ */ React.createElement(
     View,
     {
       style: styles$w.directionStyle
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       Pressable,
       {
         testID: "Checkbox-Press",
@@ -1023,9 +1023,9 @@ const Checkbox = ({
         disabled: disable,
         style: styles$w.checkboxContainer
       },
-      React$1.cloneElement(checked ? checkedIcon : uncheckedIcon)
+      React.cloneElement(checked ? checkedIcon : uncheckedIcon)
     ),
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: titleVariant,
@@ -1087,26 +1087,26 @@ const CustomDropdown$1 = ({
   downArrowIcon
 }) => {
   const [showOptions, setShowOptions] = useState(false);
-  return /* @__PURE__ */ React$1.createElement(View, { testID: testId }, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { testID: testId }, /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant: "P3regular",
       style: styles$v.labelStyle,
       text: label
     }
-  ), /* @__PURE__ */ React$1.createElement(
+  ), /* @__PURE__ */ React.createElement(
     Pressable,
     {
       testID: `${testId}-BTN`,
       style: styles$v.dropDownStyle,
       onPress: () => setShowOptions(!showOptions)
     },
-    iconName && /* @__PURE__ */ React$1.createElement(View, { style: iconStyle }, React$1.cloneElement(iconName, {
+    iconName && /* @__PURE__ */ React.createElement(View, { style: iconStyle }, React.cloneElement(iconName, {
       width: moderateScale(24),
       height: moderateScale(24),
       style: styles$v.iconStyle
     })),
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: "P3regular",
@@ -1114,14 +1114,14 @@ const CustomDropdown$1 = ({
         text: selectedValue ? selectedValue.label : placeholder
       }
     ),
-    /* @__PURE__ */ React$1.createElement(View, null, showOptions ? React$1.cloneElement(upArrowIcon, {
+    /* @__PURE__ */ React.createElement(View, null, showOptions ? React.cloneElement(upArrowIcon, {
       width: moderateScale(24),
       height: moderateScale(24)
-    }) : React$1.cloneElement(downArrowIcon, {
+    }) : React.cloneElement(downArrowIcon, {
       width: moderateScale(24),
       height: moderateScale(24)
     }))
-  ), showOptions && /* @__PURE__ */ React$1.createElement(View, { style: styles$v.optionContainer }, options?.map(({ id, value, label: label2 }) => /* @__PURE__ */ React$1.createElement(
+  ), showOptions && /* @__PURE__ */ React.createElement(View, { style: styles$v.optionContainer }, options?.map(({ id, value, label: label2 }) => /* @__PURE__ */ React.createElement(
     Pressable,
     {
       key: id,
@@ -1137,12 +1137,12 @@ const CustomDropdown$1 = ({
         }
       ]
     },
-    iconName && /* @__PURE__ */ React$1.createElement(View, { style: iconStyle }, React$1.cloneElement(iconName, {
+    iconName && /* @__PURE__ */ React.createElement(View, { style: iconStyle }, React.cloneElement(iconName, {
       width: moderateScale(24),
       height: moderateScale(24),
       style: styles$v.iconStyle
     })),
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: "P3regular",
@@ -1233,14 +1233,14 @@ const CustomTextInput = ({
   };
   const handleIconPress1 = () => setValue("");
   const handleIconPress2 = () => setIsSecureTextEntry(!isSecureTextEntry);
-  return /* @__PURE__ */ React$1.createElement(View, { testID }, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { testID }, /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant: "P3medium",
       style: [styles$u.labelStyle, disabled && styles$u.disableTextStyle],
       text: label
     }
-  ), /* @__PURE__ */ React$1.createElement(
+  ), /* @__PURE__ */ React.createElement(
     View,
     {
       style: [
@@ -1255,12 +1255,12 @@ const CustomTextInput = ({
         }
       ]
     },
-    isSearchBar && searchIcon && React$1.cloneElement(searchIcon, {
+    isSearchBar && searchIcon && React.cloneElement(searchIcon, {
       width: moderateScale(24),
       height: moderateScale(24),
       style: styles$u.searchIconStyle
     }),
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       TextInput,
       {
         ...props,
@@ -1277,15 +1277,15 @@ const CustomTextInput = ({
         secureTextEntry: isSecureTextEntry
       }
     ),
-    value && !multiline && rightIcon1 && React$1.cloneElement(rightIcon1, {
+    value && !multiline && rightIcon1 && React.cloneElement(rightIcon1, {
       onPress: handleIconPress1,
       testID: "icon1"
     }),
-    secureTextEntry && rightIcon2 && React$1.cloneElement(rightIcon2, {
+    secureTextEntry && rightIcon2 && React.cloneElement(rightIcon2, {
       onPress: handleIconPress2,
       testID: "icon2"
     })
-  ), (error || successMessage) && /* @__PURE__ */ React$1.createElement(
+  ), (error || successMessage) && /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       numberOfLines: 2,
@@ -1308,7 +1308,7 @@ const CustomTooltip = ({
   backgroundColor,
   triggerElement
 }) => {
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     Tooltip,
     {
       isVisible,
@@ -1369,27 +1369,27 @@ const FileUpload = ({
   icon,
   iconStyle
 }) => {
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     View,
     {
       style: [styles$t.container, containerStyle],
       testID: "file-upload-container"
     },
-    /* @__PURE__ */ React$1.createElement(View, { style: styles$t.content }, /* @__PURE__ */ React$1.createElement(View, { style: [uploadImageStyling], testID: "file-upload-image" }, icon && React$1.cloneElement(icon, { style: [iconStyle] })), /* @__PURE__ */ React$1.createElement(CustomTypography, { variant: "H8bold", style: styles$t.title, text: title }), /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(View, { style: styles$t.content }, /* @__PURE__ */ React.createElement(View, { style: [uploadImageStyling], testID: "file-upload-image" }, icon && React.cloneElement(icon, { style: [iconStyle] })), /* @__PURE__ */ React.createElement(CustomTypography, { variant: "H8bold", style: styles$t.title, text: title }), /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: "P4regular",
         style: styles$t.description,
         text: `Drop files directly here or `
       }
-    ), /* @__PURE__ */ React$1.createElement(
+    ), /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: "P4regular",
         style: styles$t.browse,
         text: btnText
       }
-    ), /* @__PURE__ */ React$1.createElement(
+    ), /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         testID: "file-upload-description",
@@ -1398,14 +1398,14 @@ const FileUpload = ({
         text: ` from your device`
       }
     )),
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       Pressable,
       {
         style: styles$t.button,
         onPress: onUpload,
         testID: "file-upload-button"
       },
-      /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           variant: "B2semiBold",
@@ -1418,7 +1418,7 @@ const FileUpload = ({
 };
 
 const PdfView = (props) => {
-  return /* @__PURE__ */ React$1.createElement(Pdf, { ...props });
+  return /* @__PURE__ */ React.createElement(Pdf, { ...props });
 };
 
 const styles$s = StyleSheet.create({
@@ -1477,28 +1477,28 @@ const PopUp = ({
   leftButtonShown = false,
   rightButtonShown = false
 }) => {
-  return /* @__PURE__ */ React$1.createElement(View, { testID, style: styles$s.container }, title ? /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { testID, style: styles$s.container }, title ? /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       style: styles$s.subTitleBelow,
       variant: "H6semiBold",
       text: title
     }
-  ) : null, subtitle ? /* @__PURE__ */ React$1.createElement(
+  ) : null, subtitle ? /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       style: styles$s.subtitle,
       variant: "P3regular",
       text: subtitle
     }
-  ) : null, /* @__PURE__ */ React$1.createElement(View, { style: styles$s.buttonContainer }, leftButtonShown ? /* @__PURE__ */ React$1.createElement(
+  ) : null, /* @__PURE__ */ React.createElement(View, { style: styles$s.buttonContainer }, leftButtonShown ? /* @__PURE__ */ React.createElement(
     Pressable,
     {
       testID: "Left-Button-Press",
       style: styles$s.buttonLeft,
       onPress: onButtonPress
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         style: styles$s.buttonLeftText,
@@ -1506,7 +1506,7 @@ const PopUp = ({
         text: buttonText
       }
     )
-  ) : null, rightButtonShown ? /* @__PURE__ */ React$1.createElement(Pressable, { style: styles$s.button, onPress: onButtonPress }, /* @__PURE__ */ React$1.createElement(
+  ) : null, rightButtonShown ? /* @__PURE__ */ React.createElement(Pressable, { style: styles$s.button, onPress: onButtonPress }, /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       style: styles$s.buttonText,
@@ -1548,7 +1548,7 @@ const CustomProgressBar = ({
     return () => clearInterval(progressInterval);
   }, [progress, value, increment, interval]);
   const showPercentage = () => {
-    return /* @__PURE__ */ React$1.createElement(View, { style: styles$r.flexDirection }, /* @__PURE__ */ React$1.createElement(
+    return /* @__PURE__ */ React.createElement(View, { style: styles$r.flexDirection }, /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         text: `${value}%`,
@@ -1556,7 +1556,7 @@ const CustomProgressBar = ({
         textColor: "CONTENT_PRIMARY",
         style: valueTextStyle
       }
-    ), percentageText ? /* @__PURE__ */ React$1.createElement(
+    ), percentageText ? /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         text: percentageText,
@@ -1569,7 +1569,7 @@ const CustomProgressBar = ({
   const renderProgressBar = () => {
     switch (type) {
       case ShapeType.LINE:
-        return /* @__PURE__ */ React$1.createElement(
+        return /* @__PURE__ */ React.createElement(
           Progress.Bar,
           {
             progress: progress / 100,
@@ -1583,7 +1583,7 @@ const CustomProgressBar = ({
           }
         );
       case ShapeType.CIRCLE:
-        return /* @__PURE__ */ React$1.createElement(
+        return /* @__PURE__ */ React.createElement(
           Progress.Circle,
           {
             progress: progress / 100,
@@ -1601,7 +1601,7 @@ const CustomProgressBar = ({
         return null;
     }
   };
-  return /* @__PURE__ */ React$1.createElement(View, { testID: "custom-progress-bar" }, renderProgressBar());
+  return /* @__PURE__ */ React.createElement(View, { testID: "custom-progress-bar" }, renderProgressBar());
 };
 const styles$r = StyleSheet.create({
   flexDirection: {
@@ -1634,19 +1634,19 @@ const splitRating = (rating) => {
 const drawStar = (starIndex, ratingArray, size, fullStarIcon, halfStarIcon, fullStarColor, emptyStarColor) => {
   const [fullStars, decimalPart] = ratingArray;
   if (starIndex <= fullStars) {
-    return React$1.cloneElement(fullStarIcon, {
+    return React.cloneElement(fullStarIcon, {
       style: { height: size, width: size },
       fill: fullStarColor,
       testID: `star-${starIndex}`
     });
   } else if (starIndex === fullStars + 1 && decimalPart >= 0.5) {
-    return React$1.cloneElement(halfStarIcon, {
+    return React.cloneElement(halfStarIcon, {
       style: { height: size, width: size },
       fill: fullStarColor,
       testID: `star-${starIndex}`
     });
   } else {
-    return React$1.cloneElement(fullStarIcon, {
+    return React.cloneElement(fullStarIcon, {
       style: { height: size, width: size },
       fill: emptyStarColor,
       testID: `star-${starIndex}`
@@ -1677,10 +1677,10 @@ const Star = ({
       emptyStarColor
     );
     stars.push(
-      /* @__PURE__ */ React$1.createElement(View, { key: i, style: [styles$q.star, starStyle] }, starType)
+      /* @__PURE__ */ React.createElement(View, { key: i, style: [styles$q.star, starStyle] }, starType)
     );
   }
-  return /* @__PURE__ */ React$1.createElement(View, { style: styles$q.container, testID: "star" }, stars);
+  return /* @__PURE__ */ React.createElement(View, { style: styles$q.container, testID: "star" }, stars);
 };
 
 var styles$p = StyleSheet.create({
@@ -1709,6 +1709,7 @@ const Tabs = ({
   options,
   initialSelected = [],
   onSelectionChange,
+  rating,
   style
 }) => {
   const { theme } = useTheme();
@@ -1719,6 +1720,13 @@ const Tabs = ({
       isSelected: initialSelected?.includes(option)
     }))
   );
+  useEffect(() => {
+    setData(options.map((option) => ({
+      title: option,
+      id: option,
+      isSelected: initialSelected?.includes(option)
+    })));
+  }, [rating]);
   const handlePress = (id) => {
     const updatedData = data?.map(
       (item) => item?.id === id ? { ...item, isSelected: !item?.isSelected } : item
@@ -1729,7 +1737,7 @@ const Tabs = ({
       onSelectionChange(selectedTabs);
     }
   };
-  return /* @__PURE__ */ React$1.createElement(View, { style: [styles$p.container, style] }, data?.map(({ id, title, isSelected }) => /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { style: [styles$p.container, style] }, data?.map(({ id, title, isSelected }) => /* @__PURE__ */ React.createElement(
     Pressable,
     {
       key: id,
@@ -1740,7 +1748,7 @@ const Tabs = ({
       },
       onPress: () => handlePress(id)
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         variant: FontStyle.L2_REGULAR,
@@ -1810,7 +1818,7 @@ const Tags = ({
     );
     handleTagsChange(tag);
   };
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     ScrollView,
     {
       testID,
@@ -1818,7 +1826,7 @@ const Tags = ({
       contentContainerStyle: styles$o.contentContainer,
       horizontal: false
     },
-    tags?.map((tag) => /* @__PURE__ */ React$1.createElement(
+    tags?.map((tag) => /* @__PURE__ */ React.createElement(
       Pressable,
       {
         testID: `${testID}-${tag}-BTN`,
@@ -1830,7 +1838,7 @@ const Tags = ({
           selectedTags.includes(tag) ? styles$o.selectedTag : styles$o.tagUnSelected
         ]
       },
-      /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           variant: selectedTags.includes(tag) ? "H9semiBold" : "P4regular",
@@ -1838,13 +1846,13 @@ const Tags = ({
           text: tag
         }
       ),
-      selectedTags.includes(tag) && icon && /* @__PURE__ */ React$1.createElement(
+      selectedTags.includes(tag) && icon && /* @__PURE__ */ React.createElement(
         Pressable,
         {
           testID: `${testID}-${tag}-PRESS`,
           onPress: () => removeTag(tag)
         },
-        React$1.cloneElement(icon, { style: [icon.props.style, iconStyle] })
+        React.cloneElement(icon, { style: [icon.props.style, iconStyle] })
       )
     ))
   );
@@ -1911,14 +1919,14 @@ const CustomSwitch = ({
   const animatedStyle = {
     transform: [{ translateX: animatedValue }]
   };
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     Pressable,
     {
       onPress: toggleSwitch,
       style: [styles$n.container, { width }],
       testID: "custom-switch"
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       View,
       {
         style: [
@@ -1928,8 +1936,8 @@ const CustomSwitch = ({
           }
         ]
       },
-      /* @__PURE__ */ React$1.createElement(Animated.View, { style: [styles$n.thumb, animatedStyle] }),
-      type !== ToggleButtonType.SMALL && /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(Animated.View, { style: [styles$n.thumb, animatedStyle] }),
+      type !== ToggleButtonType.SMALL && /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           variant: "B3semiBold",
@@ -2001,7 +2009,7 @@ const Accordion = ({
     inputRange: [0, 1],
     outputRange: [0, contentHeight]
   });
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     View,
     {
       style: {
@@ -2011,13 +2019,13 @@ const Accordion = ({
       },
       testID: testId
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       Pressable,
       {
         style: [styles$m.header, headerStyle, disabled && { opacity: 0.5 }],
         onPress: !disabled ? onToggle : void 0
       },
-      headerComponent ? headerComponent() : /* @__PURE__ */ React$1.createElement(
+      headerComponent ? headerComponent() : /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           variant: titleVariant,
@@ -2029,14 +2037,14 @@ const Accordion = ({
           }
         }
       ),
-      icon ? React$1.cloneElement(icon, {
+      icon ? React.cloneElement(icon, {
         width: moderateScale(20),
         height: moderateScale(20),
         style: styles$m.iconStyle
       }) : null
     ),
     optionalElement ? optionalElement() : null,
-    isOpen && /* @__PURE__ */ React$1.createElement(Animated.View, { style: [styles$m.content, { height: cardHeight }] }, /* @__PURE__ */ React$1.createElement(
+    isOpen && /* @__PURE__ */ React.createElement(Animated.View, { style: [styles$m.content, { height: cardHeight }] }, /* @__PURE__ */ React.createElement(
       View,
       {
         ref: contentRef,
@@ -2083,7 +2091,7 @@ const styles$l = StyleSheet.create({
   }
 });
 
-const Toast = React$1.forwardRef(
+const Toast = React.forwardRef(
   ({ sucessIcon, errorIcon }, ref) => {
     const [visible, setVisible] = useState(false);
     const [message, setMessage] = useState("");
@@ -2129,10 +2137,10 @@ const Toast = React$1.forwardRef(
         return () => clearInterval(interval);
       }
     }, [visible]);
-    React$1.useImperativeHandle(ref, () => ({
+    React.useImperativeHandle(ref, () => ({
       showToast
     }));
-    return visible ? /* @__PURE__ */ React$1.createElement(
+    return visible ? /* @__PURE__ */ React.createElement(
       Animated.View,
       {
         style: [
@@ -2143,21 +2151,21 @@ const Toast = React$1.forwardRef(
         ],
         testID: "TOAST"
       },
-      /* @__PURE__ */ React$1.createElement(View, { style: styles$l.toastContainer }, /* @__PURE__ */ React$1.createElement(View, { style: styles$l.innerContainer }, /* @__PURE__ */ React$1.createElement(Pressable, { onPress: hideToast }, isSuccess ? sucessIcon : errorIcon), /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(View, { style: styles$l.toastContainer }, /* @__PURE__ */ React.createElement(View, { style: styles$l.innerContainer }, /* @__PURE__ */ React.createElement(Pressable, { onPress: hideToast }, isSuccess ? sucessIcon : errorIcon), /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           variant: "L2_REGULAR",
           text: message,
           style: styles$l.messageText
         }
-      ), btnText && /* @__PURE__ */ React$1.createElement(
+      ), btnText && /* @__PURE__ */ React.createElement(
         Pressable,
         {
           style: styles$l.button,
           onPress: onBtnPress || void 0,
           testID: "TOAST-BTN"
         },
-        /* @__PURE__ */ React$1.createElement(
+        /* @__PURE__ */ React.createElement(
           CustomTypography,
           {
             variant: "L2_BOLD",
@@ -2166,7 +2174,7 @@ const Toast = React$1.forwardRef(
           }
         )
       ))),
-      /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(
         Progress.Bar,
         {
           progress,
@@ -2225,7 +2233,7 @@ const CustomSearchBar = ({
   pointerEvents,
   ...props
 }) => {
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     Pressable,
     {
       testID,
@@ -2239,7 +2247,7 @@ const CustomSearchBar = ({
       ],
       onPress: handlePress
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       Pressable,
       {
         onPress: () => {
@@ -2248,13 +2256,13 @@ const CustomSearchBar = ({
         },
         style: searchIconStyle
       },
-      React$1.cloneElement(searchIcon, {
+      React.cloneElement(searchIcon, {
         width: moderateScale(24),
         height: moderateScale(24),
         style: [styles$k.searchIconStyle, searchIconStyle]
       })
     ),
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       TextInput,
       {
         ...props,
@@ -2270,7 +2278,7 @@ const CustomSearchBar = ({
         pointerEvents
       }
     ),
-    value && /* @__PURE__ */ React$1.createElement(
+    value && /* @__PURE__ */ React.createElement(
       Pressable,
       {
         onPress: () => {
@@ -2279,7 +2287,7 @@ const CustomSearchBar = ({
         },
         style: crossIconStyle
       },
-      React$1.cloneElement(rightIcon, {
+      React.cloneElement(rightIcon, {
         // width: moderateScale(24),
         // height: moderateScale(24),
         style: [styles$k.crossIconStyle, crossIconStyle]
@@ -2316,7 +2324,7 @@ const CustomHeader = ({
   onRightPress
 }) => {
   const { theme } = useTheme();
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     View,
     {
       style: {
@@ -2326,12 +2334,12 @@ const CustomHeader = ({
       },
       testID: testId
     },
-    /* @__PURE__ */ React$1.createElement(View, { style: styles$j.headderContainer }, showLeftIcon && leftIcon ? React$1.cloneElement(leftIcon, {
+    /* @__PURE__ */ React.createElement(View, { style: styles$j.headderContainer }, showLeftIcon && leftIcon ? React.cloneElement(leftIcon, {
       width: moderateScale(24),
       height: moderateScale(24),
       onPress: onLeftPress,
       style: styles$j.leftIconStyle
-    }) : null, /* @__PURE__ */ React$1.createElement(
+    }) : null, /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: "B2_REGULAR",
@@ -2339,7 +2347,7 @@ const CustomHeader = ({
         style: { color: theme.CONTENT_PRIMARY }
       }
     )),
-    showRightIcon && rightIcon ? React$1.cloneElement(rightIcon, {
+    showRightIcon && rightIcon ? React.cloneElement(rightIcon, {
       width: moderateScale(24),
       height: moderateScale(24),
       onPress: onRightPress,
@@ -2407,7 +2415,7 @@ const SwipableList = (props) => {
     onPress,
     style,
     testID
-  }) => /* @__PURE__ */ React$1.createElement(
+  }) => /* @__PURE__ */ React.createElement(
     Pressable,
     {
       testID,
@@ -2415,7 +2423,7 @@ const SwipableList = (props) => {
       style: [styles$i.actionButton, style]
     },
     icon,
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: "L1_REGULAR",
@@ -2424,7 +2432,7 @@ const SwipableList = (props) => {
       }
     )
   );
-  const leftActionHandle = (item, leftPrimaryActionIcon, leftPrimaryActionTitle, leftSecondaryActionIcon, leftSecondaryActionTitle) => /* @__PURE__ */ React$1.createElement(View, { style: styles$i.actionBtn }, leftPrimaryActionIcon && /* @__PURE__ */ React$1.createElement(
+  const leftActionHandle = (item, leftPrimaryActionIcon, leftPrimaryActionTitle, leftSecondaryActionIcon, leftSecondaryActionTitle) => /* @__PURE__ */ React.createElement(View, { style: styles$i.actionBtn }, leftPrimaryActionIcon && /* @__PURE__ */ React.createElement(
     ActionButton,
     {
       icon: leftPrimaryActionIcon,
@@ -2436,7 +2444,7 @@ const SwipableList = (props) => {
       style: leftPrimaryActionStyle,
       testID: `${testId}-LEFT-PRIMARY-${item.id}`
     }
-  ), leftSecondaryActionIcon && /* @__PURE__ */ React$1.createElement(
+  ), leftSecondaryActionIcon && /* @__PURE__ */ React.createElement(
     ActionButton,
     {
       icon: leftSecondaryActionIcon,
@@ -2449,7 +2457,7 @@ const SwipableList = (props) => {
       testID: `${testId}-LEFT-SECONDARY-${item.id}`
     }
   ));
-  const rightActionHandle = (item) => /* @__PURE__ */ React$1.createElement(View, { style: [styles$i.actionBtn, rightPrimaryActionStyle] }, rightPrimaryActionIcon && /* @__PURE__ */ React$1.createElement(
+  const rightActionHandle = (item) => /* @__PURE__ */ React.createElement(View, { style: [styles$i.actionBtn, rightPrimaryActionStyle] }, rightPrimaryActionIcon && /* @__PURE__ */ React.createElement(
     ActionButton,
     {
       icon: rightPrimaryActionIcon,
@@ -2462,7 +2470,7 @@ const SwipableList = (props) => {
       testID: `${testId}-RIGHT-PRIMARY-${item.id}`
     }
   ));
-  const renderItem = ({ item }) => /* @__PURE__ */ React$1.createElement(GestureHandlerRootView, { testID: `${testId}-LIST`, style: styles$i.container }, /* @__PURE__ */ React$1.createElement(
+  const renderItem = ({ item }) => /* @__PURE__ */ React.createElement(GestureHandlerRootView, { testID: `${testId}-LIST`, style: styles$i.container }, /* @__PURE__ */ React.createElement(
     Swipeable,
     {
       ref: (ref) => swipeableRefs.current[item.id] = ref,
@@ -2478,13 +2486,13 @@ const SwipableList = (props) => {
     },
     props?.renderItem(item)
   ));
-  return /* @__PURE__ */ React$1.createElement(View, { testID: testId }, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { testID: testId }, /* @__PURE__ */ React.createElement(
     FlatList,
     {
       data,
       renderItem,
       keyExtractor: (item) => item.id,
-      ItemSeparatorComponent: () => /* @__PURE__ */ React$1.createElement(
+      ItemSeparatorComponent: () => /* @__PURE__ */ React.createElement(
         View,
         {
           style: {
@@ -2517,7 +2525,7 @@ const CustomIcon = ({
   containerStyle,
   titleStyle
 }) => {
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     Pressable,
     {
       style: [styles$h.container, containerStyle],
@@ -2525,7 +2533,7 @@ const CustomIcon = ({
       testID: testId
     },
     icon,
-    title && /* @__PURE__ */ React$1.createElement(
+    title && /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: titleVariant,
@@ -2550,7 +2558,7 @@ function AnimationWithImperativeApi() {
 
 const HorizontalLine = ({ backgroundColor = "SURFACE_SECONDARY", style }) => {
   const { theme } = useTheme();
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     View,
     {
       style: [
@@ -2580,7 +2588,7 @@ const Topic = ({
   subTitleStyle
 }) => {
   const { theme } = useTheme();
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     TouchableOpacity,
     {
       style: [
@@ -2590,9 +2598,9 @@ const Topic = ({
       ],
       onPress
     },
-    rightIcon && /* @__PURE__ */ React$1.createElement(View, { style: styles$f.rightIconContainer }, React$1.cloneElement(rightIcon)),
-    /* @__PURE__ */ React$1.createElement(View, { style: styles$f.timeContainer }, time && /* @__PURE__ */ React$1.createElement(CustomText$1, { text: time, variant: FontStyle.L2_REGULAR })),
-    /* @__PURE__ */ React$1.createElement(View, { style: styles$f.textContainer }, /* @__PURE__ */ React$1.createElement(View, { style: styles$f.paymentView }, statusImage && /* @__PURE__ */ React$1.createElement(View, null, React$1.cloneElement(statusImage)), subTitle && /* @__PURE__ */ React$1.createElement(
+    rightIcon && /* @__PURE__ */ React.createElement(View, { style: styles$f.rightIconContainer }, React.cloneElement(rightIcon)),
+    /* @__PURE__ */ React.createElement(View, { style: styles$f.timeContainer }, time && /* @__PURE__ */ React.createElement(CustomText$1, { text: time, variant: FontStyle.L2_REGULAR })),
+    /* @__PURE__ */ React.createElement(View, { style: styles$f.textContainer }, /* @__PURE__ */ React.createElement(View, { style: styles$f.paymentView }, statusImage && /* @__PURE__ */ React.createElement(View, null, React.cloneElement(statusImage)), subTitle && /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         style: [styles$f.subTitle, subTitleStyle],
@@ -2600,7 +2608,7 @@ const Topic = ({
         variant: FontStyle.L2_REGULAR,
         textColor: Theme.CONTENT_PRIMARY
       }
-    )), /* @__PURE__ */ React$1.createElement(
+    )), /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         text: title,
@@ -2703,27 +2711,27 @@ const ContactModal = ({
     onClose();
   };
   const emailOptions = ["Mail", "Gmail", "Outlook"];
-  const renderEmailOptions = () => /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, /* @__PURE__ */ React$1.createElement(
+  const renderEmailOptions = () => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
     CustomText$1,
     {
       style: styles$e.title,
       text: "Open email app",
       variant: "L2_REGULAR"
     }
-  ), /* @__PURE__ */ React$1.createElement(
+  ), /* @__PURE__ */ React.createElement(
     CustomText$1,
     {
       style: styles$e.subtitle,
       text: "Which app would you like to open?",
       variant: "L2_REGULAR"
     }
-  ), emailOptions.map((option) => /* @__PURE__ */ React$1.createElement(React$1.Fragment, { key: option }, /* @__PURE__ */ React$1.createElement(Line, null), /* @__PURE__ */ React$1.createElement(
+  ), emailOptions.map((option) => /* @__PURE__ */ React.createElement(React.Fragment, { key: option }, /* @__PURE__ */ React.createElement(Line, null), /* @__PURE__ */ React.createElement(
     Pressable,
     {
       onPress: () => handleOptionPress(),
       style: styles$e.optionButton
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         style: styles$e.optionText,
@@ -2732,14 +2740,14 @@ const ContactModal = ({
       }
     )
   ))));
-  const renderContent = () => /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, /* @__PURE__ */ React$1.createElement(View, { style: styles$e.viewContainer }, isMailOpen ? renderEmailOptions() : /* @__PURE__ */ React$1.createElement(Pressable, { onPress: handleCall, style: styles$e.optionButton }, /* @__PURE__ */ React$1.createElement(
+  const renderContent = () => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, { style: styles$e.viewContainer }, isMailOpen ? renderEmailOptions() : /* @__PURE__ */ React.createElement(Pressable, { onPress: handleCall, style: styles$e.optionButton }, /* @__PURE__ */ React.createElement(
     CustomText$1,
     {
       style: styles$e.optionText,
       text: `Call ${phoneNumber}`,
       variant: "B3_BOLD"
     }
-  ))), /* @__PURE__ */ React$1.createElement(Pressable, { onPress: onClose, style: styles$e.cancelButton }, /* @__PURE__ */ React$1.createElement(
+  ))), /* @__PURE__ */ React.createElement(Pressable, { onPress: onClose, style: styles$e.cancelButton }, /* @__PURE__ */ React.createElement(
     CustomText$1,
     {
       style: styles$e.cancelText,
@@ -2747,7 +2755,7 @@ const ContactModal = ({
       variant: "B2_REGULAR"
     }
   )));
-  return /* @__PURE__ */ React$1.createElement(View, { style: styles$e.container }, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { style: styles$e.container }, /* @__PURE__ */ React.createElement(
     Modal$1,
     {
       animationType: "slide",
@@ -2755,7 +2763,7 @@ const ContactModal = ({
       visible,
       onRequestClose: onClose
     },
-    /* @__PURE__ */ React$1.createElement(View, { style: styles$e.modalContainer }, /* @__PURE__ */ React$1.createElement(View, { style: styles$e.modalContent }, renderContent()))
+    /* @__PURE__ */ React.createElement(View, { style: styles$e.modalContainer }, /* @__PURE__ */ React.createElement(View, { style: styles$e.modalContent }, renderContent()))
   ));
 };
 const styles$e = StyleSheet.create({
@@ -2900,7 +2908,7 @@ const DateRangePicker = (props) => {
     return markedDates;
   };
   const isButtonDisabled = !selectedRange.startDate || !selectedRange.endDate;
-  return /* @__PURE__ */ React$1.createElement(View, null, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, null, /* @__PURE__ */ React.createElement(
     Calendar,
     {
       markedDates: getMarkedDates(),
@@ -2923,7 +2931,7 @@ const DateRangePicker = (props) => {
       firstDay: 1,
       ...props
     }
-  ), /* @__PURE__ */ React$1.createElement(
+  ), /* @__PURE__ */ React.createElement(
     CustomButton$1,
     {
       title: btnTitle,
@@ -2954,7 +2962,7 @@ const OurOfficesButton = ({
   descriptionColor = "CONTENT_SECONDARY"
 }) => {
   const { theme } = useTheme();
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     TouchableOpacity,
     {
       style: [
@@ -2964,8 +2972,8 @@ const OurOfficesButton = ({
       ],
       onPress
     },
-    leftIcon && /* @__PURE__ */ React$1.createElement(View, { style: styles$c.iconContainer }, React$1.cloneElement(leftIcon)),
-    /* @__PURE__ */ React$1.createElement(View, { style: styles$c.textContainer }, /* @__PURE__ */ React$1.createElement(
+    leftIcon && /* @__PURE__ */ React.createElement(View, { style: styles$c.iconContainer }, React.cloneElement(leftIcon)),
+    /* @__PURE__ */ React.createElement(View, { style: styles$c.textContainer }, /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         text: title,
@@ -2973,7 +2981,7 @@ const OurOfficesButton = ({
         textColor: titleColor,
         style: styles$c.textView
       }
-    ), /* @__PURE__ */ React$1.createElement(
+    ), /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         text: description,
@@ -2982,7 +2990,7 @@ const OurOfficesButton = ({
         style: styles$c.flexWrap
       }
     )),
-    rightIcon && /* @__PURE__ */ React$1.createElement(View, { style: styles$c.rightIconContainer }, React$1.cloneElement(rightIcon))
+    rightIcon && /* @__PURE__ */ React.createElement(View, { style: styles$c.rightIconContainer }, React.cloneElement(rightIcon))
   );
 };
 const styles$c = StyleSheet.create({
@@ -3038,7 +3046,7 @@ const NotificationBandge = ({
   if (notificationCount <= 0) {
     return icon;
   }
-  return /* @__PURE__ */ React$1.createElement(View, { style: styles$b.iconContainer }, icon, /* @__PURE__ */ React$1.createElement(View, { style: styles$b.badge }, /* @__PURE__ */ React$1.createElement(Text, { style: [styles$b.badgeText] }, notificationCount > 99 ? "99+" : notificationCount)));
+  return /* @__PURE__ */ React.createElement(View, { style: styles$b.iconContainer }, icon, /* @__PURE__ */ React.createElement(View, { style: styles$b.badge }, /* @__PURE__ */ React.createElement(Text, { style: [styles$b.badgeText] }, notificationCount > 99 ? "99+" : notificationCount)));
 };
 
 const ScrollableList = ({
@@ -3059,7 +3067,7 @@ const ScrollableList = ({
   );
   const { theme } = useTheme();
   const styles = createStyles$2({ theme });
-  return /* @__PURE__ */ React$1.createElement(View, { style: [styles.container, containerStyle] }, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { style: [styles.container, containerStyle] }, /* @__PURE__ */ React.createElement(
     ScrollView,
     {
       horizontal: true,
@@ -3069,7 +3077,7 @@ const ScrollableList = ({
         scrollViewContentStyle
       ]
     },
-    data?.map((item) => /* @__PURE__ */ React$1.createElement(
+    data?.map((item) => /* @__PURE__ */ React.createElement(
       Pressable,
       {
         key: item.value,
@@ -3086,7 +3094,7 @@ const ScrollableList = ({
           handleSelectCategory(item.name, item.value);
         }
       },
-      /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(
         CustomText$1,
         {
           text: item.name,
@@ -3095,7 +3103,7 @@ const ScrollableList = ({
           style: (activeTab ?? selectedItem) === item.name ? activeTextStyle ? activeTextStyle : {} : {}
         }
       ),
-      item?.isError ? /* @__PURE__ */ React$1.createElement(View, { style: [styles.errorViewStyle, errorStyle] }, item?.errorText ? /* @__PURE__ */ React$1.createElement(
+      item?.isError ? /* @__PURE__ */ React.createElement(View, { style: [styles.errorViewStyle, errorStyle] }, item?.errorText ? /* @__PURE__ */ React.createElement(
         CustomText$1,
         {
           text: item?.errorText,
@@ -3206,7 +3214,7 @@ const FeedbackForm = ({
   const maxChars = 200;
   const { theme } = useTheme();
   const styles = createStyles$1(theme);
-  return /* @__PURE__ */ React$1.createElement(View, { style: styles.container }, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { style: styles.container }, /* @__PURE__ */ React.createElement(
     CustomText$1,
     {
       text: title,
@@ -3214,7 +3222,7 @@ const FeedbackForm = ({
       textColor: Theme.CONTENT_SECONDRY,
       style: styles.headerText
     }
-  ), /* @__PURE__ */ React$1.createElement(
+  ), /* @__PURE__ */ React.createElement(
     TextInput,
     {
       style: [styles.textInput, { height: Math.max(100) }],
@@ -3225,7 +3233,7 @@ const FeedbackForm = ({
       value: feedback,
       onChangeText: (text) => setFeedback(text)
     }
-  ), /* @__PURE__ */ React$1.createElement(
+  ), /* @__PURE__ */ React.createElement(
     CustomText$1,
     {
       text: `${feedback.length}/${maxChars} characters`,
@@ -3233,14 +3241,14 @@ const FeedbackForm = ({
       textColor: Theme.CONTENT_SECONDRY,
       style: styles.charCounter
     }
-  ), /* @__PURE__ */ React$1.createElement(View, { style: styles.buttonContainer }, /* @__PURE__ */ React$1.createElement(Pressable, { disabled: feedback?.length < 1, style: feedback?.length < 1 ? styles.feedbackButtonDisable : styles.feedbackButton, onPress: handleSendFeedback }, /* @__PURE__ */ React$1.createElement(
+  ), /* @__PURE__ */ React.createElement(View, { style: styles.buttonContainer }, /* @__PURE__ */ React.createElement(Pressable, { disabled: feedback?.length < 1, style: feedback?.length < 1 ? styles.feedbackButtonDisable : styles.feedbackButton, onPress: handleSendFeedback }, /* @__PURE__ */ React.createElement(
     CustomText$1,
     {
       text: leftBtnTxt,
       variant: FontStyle.L1_REGULAR,
       textColor: feedback?.length < 1 ? Theme.CONTENT_SECONDRY : Theme.CONTENT_PRIMARY
     }
-  )), /* @__PURE__ */ React$1.createElement(Pressable, { style: styles.cancelButton, onPress: clearAllData }, /* @__PURE__ */ React$1.createElement(
+  )), /* @__PURE__ */ React.createElement(Pressable, { style: styles.cancelButton, onPress: clearAllData }, /* @__PURE__ */ React.createElement(
     CustomText$1,
     {
       text: rightBtnTxt,
@@ -3278,7 +3286,7 @@ const CountryDropDown = ({
     setCallingCode(`+${country.callingCode[0]}`);
     getCountryCode(`+${country.callingCode[0]}`);
   };
-  return /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, /* @__PURE__ */ React$1.createElement(View, { style: [styles$a.container, containerStyle] }, /* @__PURE__ */ React$1.createElement(View, { style: [styles$a.countryPickerContainer, countryPickerStyle] }, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, { style: [styles$a.container, containerStyle] }, /* @__PURE__ */ React.createElement(View, { style: [styles$a.countryPickerContainer, countryPickerStyle] }, /* @__PURE__ */ React.createElement(
     CountryPicker,
     {
       withFilter: true,
@@ -3288,21 +3296,21 @@ const CountryDropDown = ({
       onSelect: handleSelect,
       visible: pickerVisible
     }
-  ), /* @__PURE__ */ React$1.createElement(
+  ), /* @__PURE__ */ React.createElement(
     Text,
     {
       onPress: () => setPickerVisible(true),
       style: [styles$a.callingCode, callingCodeStyle]
     },
     callingCode
-  )), /* @__PURE__ */ React$1.createElement(View, { style: styles$a.flex }, (isFocused || value) && /* @__PURE__ */ React$1.createElement(
+  )), /* @__PURE__ */ React.createElement(View, { style: styles$a.flex }, (isFocused || value) && /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant: "L2_REGULAR",
       text: label ?? "",
       style: styles$a.floatingLabel
     }
-  ), /* @__PURE__ */ React$1.createElement(
+  ), /* @__PURE__ */ React.createElement(
     TextInput,
     {
       style: [styles$a.input, inputStyle],
@@ -3315,7 +3323,7 @@ const CountryDropDown = ({
       maxLength,
       placeholderTextColor: theme.CONTENT_SECONDRY["light"]
     }
-  ))), errorMessage ? /* @__PURE__ */ React$1.createElement(
+  ))), errorMessage ? /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant: "L2_REGULAR",
@@ -3397,7 +3405,7 @@ const CommonTextInput = (props) => {
     onRightIconPress,
     onlyErrorBorderLabel
   } = props;
-  return /* @__PURE__ */ React$1.createElement(Pressable, { onPress: handlePress, style: styles$9.container }, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(Pressable, { onPress: handlePress, style: styles$9.container }, /* @__PURE__ */ React.createElement(
     TextInput$1,
     {
       mode: "outlined",
@@ -3435,7 +3443,7 @@ const CommonTextInput = (props) => {
       error: errorMessage?.length || onlyErrorBorderLabel ? true : false,
       multiline,
       numberOfLines: multiline ? 4 : 1,
-      right: rightIcon ? /* @__PURE__ */ React$1.createElement(
+      right: rightIcon ? /* @__PURE__ */ React.createElement(
         TextInput$1.Icon,
         {
           icon: rightIcon,
@@ -3447,7 +3455,7 @@ const CommonTextInput = (props) => {
       ) : null,
       ...props
     }
-  ), errorMessage ? /* @__PURE__ */ React$1.createElement(
+  ), errorMessage ? /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant: "L2_REGULAR",
@@ -3522,7 +3530,7 @@ const CustomDropdown = (props) => {
   const [isFocus, setIsFocus] = useState(false);
   const renderLabel = () => {
     if (value || isFocus) {
-      return /* @__PURE__ */ React$1.createElement(
+      return /* @__PURE__ */ React.createElement(
         Text,
         {
           style: [
@@ -3546,7 +3554,7 @@ const CustomDropdown = (props) => {
   };
   const renderItem = (item) => {
     const isSelected = item[valueField] === value;
-    return /* @__PURE__ */ React$1.createElement(View, { style: [styles$8.itemContainer, itemContainerStyle] }, /* @__PURE__ */ React$1.createElement(
+    return /* @__PURE__ */ React.createElement(View, { style: [styles$8.itemContainer, itemContainerStyle] }, /* @__PURE__ */ React.createElement(
       Text,
       {
         style: [
@@ -3560,7 +3568,7 @@ const CustomDropdown = (props) => {
       item[labelField]
     ));
   };
-  return /* @__PURE__ */ React$1.createElement(View, { style: [styles$8.container, containerStyle] }, label && renderLabel(), /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { style: [styles$8.container, containerStyle] }, label && renderLabel(), /* @__PURE__ */ React.createElement(
     Dropdown,
     {
       ...props,
@@ -3692,20 +3700,20 @@ const CustomSwitchBtn = ({
   const toggleSwitch = () => {
     onValueChange(!value);
   };
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     Pressable,
     {
       disabled,
       onPress: toggleSwitch,
       style: { ...styles$7.mainContainer, ...containerStyle }
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       Animated.View,
       {
         style: [styles$7.circle, { transform: [{ translateX }], ...circleStyle }]
       }
     ),
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         style: [styles$7.activeText, value ? inActiveTextStyle : activeTextStyle],
@@ -3713,7 +3721,7 @@ const CustomSwitchBtn = ({
         variant: activeTextVariant
       }
     ),
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         style: [
@@ -3770,7 +3778,7 @@ const TagsComponent = ({
     }
     return tagList;
   };
-  const renderTagItem = ({ item }) => /* @__PURE__ */ React$1.createElement(
+  const renderTagItem = ({ item }) => /* @__PURE__ */ React.createElement(
     Pressable,
     {
       onPress: () => handleTagPress?.(item.name),
@@ -3779,7 +3787,7 @@ const TagsComponent = ({
         selectedTag === item?.name ? [styles.selectedTagButton, selectedTagButton] : [styles.unselectedTagButton, unselectedTagButton]
       ]
     },
-    /* @__PURE__ */ React$1.createElement(View, null, /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(View, null, /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         textColor: selectedTag === item?.name ? Theme.CONTENT_INVERTED : Theme.CONTENT_SECONDRY,
@@ -3787,7 +3795,7 @@ const TagsComponent = ({
         text: item?.name
       }
     )),
-    /* @__PURE__ */ React$1.createElement(View, { style: styles.circleViewAlignment }, selectedTag === item?.name && /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(View, { style: styles.circleViewAlignment }, selectedTag === item?.name && /* @__PURE__ */ React.createElement(
       CustomText$1,
       {
         text: "x",
@@ -3796,7 +3804,7 @@ const TagsComponent = ({
       }
     ))
   );
-  return /* @__PURE__ */ React$1.createElement(View, null, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, null, /* @__PURE__ */ React.createElement(
     FlatList,
     {
       data: reorderedTags(),
@@ -3915,7 +3923,7 @@ const CustomDocumentPicker = ({
   const removeDocument = useCallback(() => {
     setDocDetails(void 0);
   }, []);
-  return /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
     View,
     {
       style: [
@@ -3925,14 +3933,14 @@ const CustomDocumentPicker = ({
         containerStyle
       ]
     },
-    /* @__PURE__ */ React$1.createElement(Pressable, { style: styles$6.innerContainer, onPress: pickDocument }, docDetails ? fileIcon : uploadIcon, /* @__PURE__ */ React$1.createElement(View, { style: styles$6.titleContainer }, /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(Pressable, { style: styles$6.innerContainer, onPress: pickDocument }, docDetails ? fileIcon : uploadIcon, /* @__PURE__ */ React.createElement(View, { style: styles$6.titleContainer }, /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: FontStyle.L2_REGULAR,
         text: docDetails?.name ?? title,
         style: [{ color: theme.CONTENT_PRIMARY }, titleStyle]
       }
-    ), !docDetails && /* @__PURE__ */ React$1.createElement(
+    ), !docDetails && /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: FontStyle.L3_REGULAR,
@@ -3940,10 +3948,10 @@ const CustomDocumentPicker = ({
         style: [{ color: theme.CONTENT_SECONDRY }, hintStyle]
       }
     ))),
-    docDetails && React$1.cloneElement(deleteIcon, {
+    docDetails && React.cloneElement(deleteIcon, {
       onPress: removeDocument
     })
-  ), error && /* @__PURE__ */ React$1.createElement(
+  ), error && /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       variant: FontStyle.L2_REGULAR,
@@ -3992,7 +4000,7 @@ const styles$5 = StyleSheet.create({
   }
 });
 
-const OTPInput = React$1.forwardRef(
+const OTPInput = React.forwardRef(
   ({
     length = 4,
     onComplete,
@@ -4091,7 +4099,7 @@ const OTPInput = React$1.forwardRef(
         }
       });
     };
-    React$1.useImperativeHandle(ref, () => ({
+    React.useImperativeHandle(ref, () => ({
       reset() {
         setOTP("");
         refs.current[0]?.focus();
@@ -4130,7 +4138,7 @@ const OTPInput = React$1.forwardRef(
         onComplete?.(otp);
       }
     }, [otp]);
-    return /* @__PURE__ */ React$1.createElement(ThemeProvider, null, /* @__PURE__ */ React$1.createElement(View, { style: { ...otpContainerStyle }, "data-testid": testId }, /* @__PURE__ */ React$1.createElement(
+    return /* @__PURE__ */ React.createElement(ThemeProvider, null, /* @__PURE__ */ React.createElement(View, { style: { ...otpContainerStyle }, "data-testid": testId }, /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         text: label,
@@ -4141,7 +4149,7 @@ const OTPInput = React$1.forwardRef(
           ...otpHeaderTextStyle
         }
       }
-    ), /* @__PURE__ */ React$1.createElement(View, { style: { ...styles$5.textInputContainer } }, Array.from({ length }).map((_, index) => /* @__PURE__ */ React$1.createElement(
+    ), /* @__PURE__ */ React.createElement(View, { style: { ...styles$5.textInputContainer } }, Array.from({ length }).map((_, index) => /* @__PURE__ */ React.createElement(
       TextInput,
       {
         key: index?.toString(),
@@ -4165,21 +4173,21 @@ const OTPInput = React$1.forwardRef(
         autoComplete: "sms-otp",
         selectionColor: theme$1.CONTENT_PRIMARY
       }
-    ))), !errorMessageMaxReachCount && /* @__PURE__ */ React$1.createElement(View, { style: styles$5.timerContainer }, /* @__PURE__ */ React$1.createElement(View, { style: styles$5.timerIconContainer }, (disableResendButton() || !isResendOtpEnable) && /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, timerIcon, /* @__PURE__ */ React$1.createElement(
+    ))), !errorMessageMaxReachCount && /* @__PURE__ */ React.createElement(View, { style: styles$5.timerContainer }, /* @__PURE__ */ React.createElement(View, { style: styles$5.timerIconContainer }, (disableResendButton() || !isResendOtpEnable) && /* @__PURE__ */ React.createElement(React.Fragment, null, timerIcon, /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         text: `00:${timeLeft} secs`,
         variant: FontStyle.L1_REGULAR,
         style: { color: theme$1.INFO }
       }
-    ))), /* @__PURE__ */ React$1.createElement(
+    ))), /* @__PURE__ */ React.createElement(
       Pressable,
       {
         onPress: onClickResendOTP,
         style: styles$5.resendOTPStyle,
         disabled: disableResendButton() || !isResendOtpEnable
       },
-      /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           text: resendText,
@@ -4191,7 +4199,7 @@ const OTPInput = React$1.forwardRef(
           }
         }
       )
-    )), errorMessage ? /* @__PURE__ */ React$1.createElement(View, { style: styles$5.resendOtpContainer }, /* @__PURE__ */ React$1.createElement(
+    )), errorMessage ? /* @__PURE__ */ React.createElement(View, { style: styles$5.resendOtpContainer }, /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         text: errorMessage,
@@ -4201,7 +4209,7 @@ const OTPInput = React$1.forwardRef(
           color: theme$1.ERROR
         }
       }
-    )) : null, errorMessageMaxReachCount ? /* @__PURE__ */ React$1.createElement(View, { style: styles$5.resendOtpContainer }, /* @__PURE__ */ React$1.createElement(
+    )) : null, errorMessageMaxReachCount ? /* @__PURE__ */ React.createElement(View, { style: styles$5.resendOtpContainer }, /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         text: errorMessageMaxReachCount,
@@ -4343,18 +4351,18 @@ const Stepper = ({
       return { borderColor: theme.CONTENT_SECONDRY };
     }
   };
-  return /* @__PURE__ */ React$1.createElement(View, { style: { ...styles$4.stepperContainer, ...containerStyle } }, data?.map((item, index) => {
+  return /* @__PURE__ */ React.createElement(View, { style: { ...styles$4.stepperContainer, ...containerStyle } }, data?.map((item, index) => {
     const stepCircleStyle = renderCircleStyle(item?.status);
     const dividerStyle = renderDividerStyle(item?.status);
     const labelStyle = renderLableStyle(item?.status);
     const lastViewStyle = index === data?.length - 1 ? styles$4.lastStepWrapper : null;
-    return /* @__PURE__ */ React$1.createElement(
+    return /* @__PURE__ */ React.createElement(
       View,
       {
         key: index?.toString(),
         style: { ...styles$4.stepperWrapper, ...lastViewStyle }
       },
-      /* @__PURE__ */ React$1.createElement(View, { style: styles$4.stepperSeparatorContainer }, /* @__PURE__ */ React$1.createElement(View, { style: { ...stepCircleStyle } }, showStepCount && /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(View, { style: styles$4.stepperSeparatorContainer }, /* @__PURE__ */ React.createElement(View, { style: { ...stepCircleStyle } }, showStepCount && /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           text: item?.step,
@@ -4363,8 +4371,8 @@ const Stepper = ({
             color: theme.CONTENT_PRIMARY
           }
         }
-      ), showStatus && item?.status === Status.Completed && completedStatusIcon), index != data?.length - 1 && /* @__PURE__ */ React$1.createElement(View, { style: { ...styles$4.separator, ...dividerStyle } })),
-      /* @__PURE__ */ React$1.createElement(View, { style: styles$4.lableContainer }, /* @__PURE__ */ React$1.createElement(
+      ), showStatus && item?.status === Status.Completed && completedStatusIcon), index != data?.length - 1 && /* @__PURE__ */ React.createElement(View, { style: { ...styles$4.separator, ...dividerStyle } })),
+      /* @__PURE__ */ React.createElement(View, { style: styles$4.lableContainer }, /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           text: item?.label,
@@ -4415,7 +4423,7 @@ const styles$3 = StyleSheet.create({
 });
 
 const BUTTON_WIDTH = 40;
-const CustomSlideButton = React$1.forwardRef(
+const CustomSlideButton = React.forwardRef(
   ({
     label,
     onComplete,
@@ -4435,7 +4443,7 @@ const CustomSlideButton = React$1.forwardRef(
     const sliderConteinerRef = useRef(null);
     const [color, setColor] = useState(new Animated.Value(0));
     const [sliderBackgroundColorRef, setSliderBackgroundColorRef] = useState(new Animated.Value(0));
-    React$1.useImperativeHandle(ref, () => ({
+    React.useImperativeHandle(ref, () => ({
       reset() {
         resetAll();
       }
@@ -4524,32 +4532,32 @@ const CustomSlideButton = React$1.forwardRef(
       outputRange: [sliderBackgroundColor, "transparent"]
     });
     const { theme } = useTheme();
-    return /* @__PURE__ */ React$1.createElement(View, { style: {
+    return /* @__PURE__ */ React.createElement(View, { style: {
       ...styles$3.sliderContainer,
       backgroundColor: theme.SURFACE_INVERTED,
       ...containerStyle
-    }, onLayout: handleLayout, ref: cardRef }, /* @__PURE__ */ React$1.createElement(
+    }, onLayout: handleLayout, ref: cardRef }, /* @__PURE__ */ React.createElement(
       Animated.View,
       {
         style: [styles$3.buttonTextContainer, { backgroundColor, transform: [{ translateX }] }],
         ref: sliderConteinerRef
       }
-    ), /* @__PURE__ */ React$1.createElement(
+    ), /* @__PURE__ */ React.createElement(
       View,
       {
         style: styles$3.buttonTextContainer
       },
-      /* @__PURE__ */ React$1.createElement(Animated.Text, { style: [{
+      /* @__PURE__ */ React.createElement(Animated.Text, { style: [{
         alignSelf: "center",
         ...textStyle
       }, { color: textColor }] }, label)
-    ), /* @__PURE__ */ React$1.createElement(
+    ), /* @__PURE__ */ React.createElement(
       Animated.View,
       {
         style: [styles$3.slider, { transform: [{ translateX }] }],
         ...panResponder.panHandlers
       },
-      /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(
         View,
         {
           style: {
@@ -4666,7 +4674,7 @@ const AppointmentCard = ({
   directionText
 }) => {
   const { theme } = useTheme();
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     Accordion$1,
     {
       title,
@@ -4679,14 +4687,14 @@ const AppointmentCard = ({
         borderBottomColor: theme.BORDER_SEPERATOR_HEADER
       },
       headerStyle: styles$2.accordionHeader,
-      headerComponent: () => /* @__PURE__ */ React$1.createElement(View, { style: styles$2.accordionHeaderContent }, headerIcon, /* @__PURE__ */ React$1.createElement(View, { style: styles$2.accordionText }, /* @__PURE__ */ React$1.createElement(
+      headerComponent: () => /* @__PURE__ */ React.createElement(View, { style: styles$2.accordionHeaderContent }, headerIcon, /* @__PURE__ */ React.createElement(View, { style: styles$2.accordionText }, /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           text: headerTitle,
           variant: FontStyle.L2_REGULAR,
           style: { color: theme.CONTENT_SECONDRY }
         }
-      ), /* @__PURE__ */ React$1.createElement(
+      ), /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           text: headerSubtitle,
@@ -4696,7 +4704,7 @@ const AppointmentCard = ({
       ))),
       icon
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       View,
       {
         style: [
@@ -4704,14 +4712,14 @@ const AppointmentCard = ({
           { borderTopColor: theme.BORDER_SEPERATOR_HEADER }
         ]
       },
-      /* @__PURE__ */ React$1.createElement(View, { style: styles$2.appointmentInfo }, data.map(({ title: title2, value, isLocation, isStatus }) => /* @__PURE__ */ React$1.createElement(View, { style: styles$2.infoColumn, key: title2 }, /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(View, { style: styles$2.appointmentInfo }, data.map(({ title: title2, value, isLocation, isStatus }) => /* @__PURE__ */ React.createElement(View, { style: styles$2.infoColumn, key: title2 }, /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           text: title2,
           variant: FontStyle.L3_REGULAR,
           style: { color: theme.CONTENT_SECONDRY }
         }
-      ), /* @__PURE__ */ React$1.createElement(View, { style: styles$2.infoRow }, isStatus && statusIcon, /* @__PURE__ */ React$1.createElement(
+      ), /* @__PURE__ */ React.createElement(View, { style: styles$2.infoRow }, isStatus && statusIcon, /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           text: value,
@@ -4720,7 +4728,7 @@ const AppointmentCard = ({
             color: isStatus ? theme.WARNING : theme.CONTENT_PRIMARY
           }
         }
-      )), isLocation && /* @__PURE__ */ React$1.createElement(
+      )), isLocation && /* @__PURE__ */ React.createElement(
         CustomTypography,
         {
           text: directionText,
@@ -4732,7 +4740,7 @@ const AppointmentCard = ({
           onPress: onDirectionPress
         }
       )))),
-      /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(
         View,
         {
           style: [
@@ -4743,7 +4751,7 @@ const AppointmentCard = ({
           ]
         },
         infoIcon,
-        /* @__PURE__ */ React$1.createElement(
+        /* @__PURE__ */ React.createElement(
           CustomTypography,
           {
             text: info,
@@ -4752,7 +4760,7 @@ const AppointmentCard = ({
           }
         )
       ),
-      /* @__PURE__ */ React$1.createElement(
+      /* @__PURE__ */ React.createElement(
         View,
         {
           style: [
@@ -4762,7 +4770,7 @@ const AppointmentCard = ({
             }
           ]
         },
-        /* @__PURE__ */ React$1.createElement(
+        /* @__PURE__ */ React.createElement(
           CustomTypography,
           {
             text: viewText,
@@ -4776,7 +4784,7 @@ const AppointmentCard = ({
             onPress: onViewDetailsPress
           }
         ),
-        /* @__PURE__ */ React$1.createElement(View, { style: styles$2.actionIcons }, /* @__PURE__ */ React$1.createElement(
+        /* @__PURE__ */ React.createElement(View, { style: styles$2.actionIcons }, /* @__PURE__ */ React.createElement(
           CustomIcon,
           {
             icon: deleteIcon,
@@ -4786,7 +4794,7 @@ const AppointmentCard = ({
             },
             onPress: onDeletePress
           }
-        ), /* @__PURE__ */ React$1.createElement(
+        ), /* @__PURE__ */ React.createElement(
           CustomIcon,
           {
             icon: editIcon,
@@ -4840,7 +4848,7 @@ const PropertyDetails = ({
   onRightIconPress
 }) => {
   const { theme } = useTheme();
-  return /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(
     View,
     {
       style: {
@@ -4850,25 +4858,25 @@ const PropertyDetails = ({
         ...containerStyle
       }
     },
-    React$1.cloneElement(icon, {
+    React.cloneElement(icon, {
       width: moderateScale(87),
       height: moderateScale(87)
     }),
-    /* @__PURE__ */ React$1.createElement(View, { style: styles$1.propertyInfo }, brandIcon, /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(View, { style: styles$1.propertyInfo }, brandIcon, /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         text: title,
         variant: FontStyle.L2_REGULAR,
         style: { color: theme.CONTENT_PRIMARY }
       }
-    ), /* @__PURE__ */ React$1.createElement(
+    ), /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         text: subTitle,
         variant: FontStyle.L1_REGULAR,
         style: { color: theme.CONTENT_PRIMARY }
       }
-    ), propertyNumber && /* @__PURE__ */ React$1.createElement(View, { style: styles$1.propertyNumber }, /* @__PURE__ */ React$1.createElement(
+    ), propertyNumber && /* @__PURE__ */ React.createElement(View, { style: styles$1.propertyNumber }, /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         text: propertyNumber,
@@ -4878,7 +4886,7 @@ const PropertyDetails = ({
         }
       }
     ), hintIcon)),
-    btnIcon && /* @__PURE__ */ React$1.createElement(
+    btnIcon && /* @__PURE__ */ React.createElement(
       CustomIcon,
       {
         icon: btnIcon,
@@ -4923,14 +4931,14 @@ const RadioButtonGroup = ({ data, onSelect, containerStyle, labelStyle, optionCo
     setSelectedOption(item.value);
     onSelect(item);
   };
-  return /* @__PURE__ */ React$1.createElement(View, { style: [styles.container, containerStyle] }, data?.map((item) => /* @__PURE__ */ React$1.createElement(
+  return /* @__PURE__ */ React.createElement(View, { style: [styles.container, containerStyle] }, data?.map((item) => /* @__PURE__ */ React.createElement(
     TouchableOpacity,
     {
       key: item.value,
       style: [styles.optionContainer, optionContainerStyle],
       onPress: () => handleSelect(item)
     },
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       View,
       {
         style: [
@@ -4939,7 +4947,7 @@ const RadioButtonGroup = ({ data, onSelect, containerStyle, labelStyle, optionCo
         ]
       }
     ),
-    /* @__PURE__ */ React$1.createElement(
+    /* @__PURE__ */ React.createElement(
       CustomTypography,
       {
         variant: FontStyle.L1_REGULAR,