dhre-ui-kit 0.0.166 → 0.0.167

package/lib/index.js

@@ -731,6 +731,24 @@ const BottomDrawer = ({
   );
 };
 
+const styles$y = reactNative.StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: "center",
+    alignItems: "center",
+    backgroundColor: "transparent",
+    position: "absolute",
+    width: "100%",
+    height: "100%",
+    zIndex: 1e3
+  }
+});
+
+const CustomLoader = ({ loading }) => {
+  if (!loading) return null;
+  return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$y.container }, /* @__PURE__ */ React__default["default"].createElement(reactNative.ActivityIndicator, { size: "large", color: "#686868" }));
+};
+
 const CustomButton = ({
   title,
   testID,
@@ -745,7 +763,8 @@ const CustomButton = ({
   imagePosition = "right",
   disabled = false,
   disabledColor,
-  disableButtonTitleColor
+  disableButtonTitleColor,
+  isLoading = false
 }) => {
   const { theme } = useTheme();
   return /* @__PURE__ */ React__default["default"].createElement(
@@ -753,8 +772,11 @@ const CustomButton = ({
     {
       testID,
       style: [
-        styles$y.buttonContainer,
+        styles$x.buttonContainer,
         containerStyle,
+        {
+          paddingVertical: isLoading ? verticalScale(22) : verticalScale(14)
+        },
         disabled ? {
           backgroundColor: disabledColor ? disabledColor : theme.SURFACE_DISABLE
         } : {}
@@ -763,7 +785,7 @@ const CustomButton = ({
       disabled
     },
     imagePosition === "left" && leftIcon && /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: iconStyle }, React__default["default"].cloneElement(leftIcon, { width: 20, height: 20 })),
-    /* @__PURE__ */ React__default["default"].createElement(
+    isLoading ? /* @__PURE__ */ React__default["default"].createElement(CustomLoader, { loading: isLoading }) : /* @__PURE__ */ React__default["default"].createElement(
       CustomText$1,
       {
         text: title,
@@ -771,7 +793,7 @@ const CustomButton = ({
         style: [
           textStyle,
           disabled ? {
-            color: disableButtonTitleColor ? disableButtonTitleColor : theme.CONTENT_DISABLE
+            color: disableButtonTitleColor ? disableButtonTitleColor : "white"
           } : {}
         ],
         textColor: titleColor
@@ -780,7 +802,7 @@ const CustomButton = ({
     imagePosition === "right" && rightIcon && /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: iconStyle }, React__default["default"].cloneElement(rightIcon, { width: 20, height: 20 }))
   );
 };
-const styles$y = reactNative.StyleSheet.create({
+const styles$x = reactNative.StyleSheet.create({
   buttonContainer: {
     flexDirection: "row",
     alignItems: "center",
@@ -792,7 +814,7 @@ const styles$y = reactNative.StyleSheet.create({
 });
 var CustomButton$1 = withThemeProvider(CustomButton);
 
-const styles$x = reactNative.StyleSheet.create({
+const styles$w = reactNative.StyleSheet.create({
   container: {
     padding: horizontalScale(20),
     marginHorizontal: horizontalScale(16),
@@ -857,53 +879,53 @@ const Cards = ({
   testID,
   onButtonPress
 }) => {
-  return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { testID, style: styles$x.container }, topLeftTitle ? /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$x.topLeft }, /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { testID, style: styles$w.container }, topLeftTitle ? /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$w.topLeft }, /* @__PURE__ */ React__default["default"].createElement(
     CustomTypography,
     {
       variant: "P2regular",
-      style: styles$x.title,
+      style: styles$w.title,
       text: topLeftTitle
     }
   )) : null, title ? /* @__PURE__ */ React__default["default"].createElement(
     CustomTypography,
     {
       variant: "H6bold",
-      style: styles$x.subTitleBelow,
+      style: styles$w.subTitleBelow,
       text: title
     }
   ) : null, subtitle ? /* @__PURE__ */ React__default["default"].createElement(
     CustomTypography,
     {
       variant: "P3regular",
-      style: styles$x.subtitle,
+      style: styles$w.subtitle,
       text: subtitle
     }
-  ) : null, /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$x.leftBottomView }, iconSource ? iconSource : null, iconTitle ? /* @__PURE__ */ React__default["default"].createElement(
+  ) : null, /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$w.leftBottomView }, iconSource ? iconSource : null, iconTitle ? /* @__PURE__ */ React__default["default"].createElement(
     CustomTypography,
     {
       variant: "P3regular",
-      style: styles$x.subTitleLeftBelow,
+      style: styles$w.subTitleLeftBelow,
       text: iconTitle
     }
   ) : null), buttonShown ? /* @__PURE__ */ React__default["default"].createElement(
     reactNative.Pressable,
     {
       testID: "Button-Press",
-      style: styles$x.button,
+      style: styles$w.button,
       onPress: onButtonPress
     },
     /* @__PURE__ */ React__default["default"].createElement(
       CustomTypography,
       {
         variant: "B2semiBold",
-        style: styles$x.buttonText,
+        style: styles$w.buttonText,
         text: buttonText
       }
     )
   ) : null);
 };
 
-const styles$w = reactNative.StyleSheet.create({
+const styles$v = reactNative.StyleSheet.create({
   checkboxContainer: {
     alignItems: "center",
     justifyContent: "center"
@@ -959,9 +981,9 @@ const Checkbox = ({
       testID: "Checkbox-Press",
       onPress: handlePress,
       disabled: disable,
-      style: styles$w.directionStyle
+      style: styles$v.directionStyle
     },
-    /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$w.checkboxContainer }, React__default["default"].cloneElement(checked ? checkedIcon : uncheckedIcon)),
+    /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$v.checkboxContainer }, React__default["default"].cloneElement(checked ? checkedIcon : uncheckedIcon)),
     /* @__PURE__ */ React__default["default"].createElement(
       CustomTypography,
       {
@@ -973,7 +995,7 @@ const Checkbox = ({
   ));
 };
 
-const styles$v = reactNative.StyleSheet.create({
+const styles$u = reactNative.StyleSheet.create({
   labelStyle: {
     color: DHRE_COLORS_TEXT.DH_TEXTLIGHT
   },
@@ -1027,26 +1049,26 @@ const CustomDropdown$1 = ({
     CustomTypography,
     {
       variant: "P3regular",
-      style: styles$v.labelStyle,
+      style: styles$u.labelStyle,
       text: label
     }
   ), /* @__PURE__ */ React__default["default"].createElement(
     reactNative.Pressable,
     {
       testID: `${testId}-BTN`,
-      style: styles$v.dropDownStyle,
+      style: styles$u.dropDownStyle,
       onPress: () => setShowOptions(!showOptions)
     },
     iconName && /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: iconStyle }, React__default["default"].cloneElement(iconName, {
       width: moderateScale(24),
       height: moderateScale(24),
-      style: styles$v.iconStyle
+      style: styles$u.iconStyle
     })),
     /* @__PURE__ */ React__default["default"].createElement(
       CustomTypography,
       {
         variant: "P3regular",
-        style: styles$v.selectedValueStyle,
+        style: styles$u.selectedValueStyle,
         text: selectedValue ? selectedValue.label : placeholder
       }
     ),
@@ -1057,7 +1079,7 @@ const CustomDropdown$1 = ({
       width: moderateScale(24),
       height: moderateScale(24)
     }))
-  ), showOptions && /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$v.optionContainer }, options?.map(({ id, value, label: label2 }) => /* @__PURE__ */ React__default["default"].createElement(
+  ), showOptions && /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$u.optionContainer }, options?.map(({ id, value, label: label2 }) => /* @__PURE__ */ React__default["default"].createElement(
     reactNative.Pressable,
     {
       key: id,
@@ -1067,7 +1089,7 @@ const CustomDropdown$1 = ({
         oneSelect({ id, value, label: label2 });
       },
       style: [
-        styles$v.item,
+        styles$u.item,
         {
           backgroundColor: id === selectedValue?.id ? DHRE_COLORS_BG.DH_GREY1 : DHRE_COLORS_TEXT.DH_WHITE
         }
@@ -1076,7 +1098,7 @@ const CustomDropdown$1 = ({
     iconName && /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: iconStyle }, React__default["default"].cloneElement(iconName, {
       width: moderateScale(24),
       height: moderateScale(24),
-      style: styles$v.iconStyle
+      style: styles$u.iconStyle
     })),
     /* @__PURE__ */ React__default["default"].createElement(
       CustomTypography,
@@ -1091,7 +1113,7 @@ const CustomDropdown$1 = ({
   ))));
 };
 
-const styles$u = reactNative.StyleSheet.create({
+const styles$t = reactNative.StyleSheet.create({
   labelStyle: {
     color: DHRE_COLORS_TEXT.DH_TEXTDARK
   },
@@ -1173,18 +1195,18 @@ const CustomTextInput = ({
     CustomTypography,
     {
       variant: "P3medium",
-      style: [styles$u.labelStyle, disabled && styles$u.disableTextStyle],
+      style: [styles$t.labelStyle, disabled && styles$t.disableTextStyle],
       text: label
     }
   ), /* @__PURE__ */ React__default["default"].createElement(
     reactNative.View,
     {
       style: [
-        styles$u.inputContainer,
-        isFocused && styles$u.inputFocused,
-        error && styles$u.inputError,
-        disabled && styles$u.disableInputStyle,
-        successMessage ? styles$u.inputSucess : {},
+        styles$t.inputContainer,
+        isFocused && styles$t.inputFocused,
+        error && styles$t.inputError,
+        disabled && styles$t.disableInputStyle,
+        successMessage ? styles$t.inputSucess : {},
         {
           height: multiline ? 120 : 48,
           alignItems: multiline ? "flex-start" : "center"
@@ -1194,7 +1216,7 @@ const CustomTextInput = ({
     isSearchBar && searchIcon && React__default["default"].cloneElement(searchIcon, {
       width: moderateScale(24),
       height: moderateScale(24),
-      style: styles$u.searchIconStyle
+      style: styles$t.searchIconStyle
     }),
     /* @__PURE__ */ React__default["default"].createElement(
       reactNative.TextInput,
@@ -1202,7 +1224,7 @@ const CustomTextInput = ({
         ...props,
         onFocus,
         onBlur,
-        style: styles$u.input,
+        style: styles$t.input,
         placeholderTextColor: DHRE_COLORS_TEXT.DH_TEXTLIGHTEST,
         editable: !disabled,
         value,
@@ -1258,7 +1280,7 @@ const CustomTooltip = ({
   );
 };
 
-const styles$t = reactNative.StyleSheet.create({
+const styles$s = reactNative.StyleSheet.create({
   container: {
     backgroundColor: DHRE_COLORS_TEXT.DH_BLACK,
     paddingHorizontal: horizontalScale(16),
@@ -1308,21 +1330,21 @@ const FileUpload = ({
   return /* @__PURE__ */ React__default["default"].createElement(
     reactNative.View,
     {
-      style: [styles$t.container, containerStyle],
+      style: [styles$s.container, containerStyle],
       testID: "file-upload-container"
     },
-    /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$t.content }, /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: [uploadImageStyling], testID: "file-upload-image" }, icon && React__default["default"].cloneElement(icon, { style: [iconStyle] })), /* @__PURE__ */ React__default["default"].createElement(CustomTypography, { variant: "H8bold", style: styles$t.title, text: title }), /* @__PURE__ */ React__default["default"].createElement(
+    /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$s.content }, /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: [uploadImageStyling], testID: "file-upload-image" }, icon && React__default["default"].cloneElement(icon, { style: [iconStyle] })), /* @__PURE__ */ React__default["default"].createElement(CustomTypography, { variant: "H8bold", style: styles$s.title, text: title }), /* @__PURE__ */ React__default["default"].createElement(
       CustomTypography,
       {
         variant: "P4regular",
-        style: styles$t.description,
+        style: styles$s.description,
         text: `Drop files directly here or `
       }
     ), /* @__PURE__ */ React__default["default"].createElement(
       CustomTypography,
       {
         variant: "P4regular",
-        style: styles$t.browse,
+        style: styles$s.browse,
         text: btnText
       }
     ), /* @__PURE__ */ React__default["default"].createElement(
@@ -1330,14 +1352,14 @@ const FileUpload = ({
       {
         testID: "file-upload-description",
         variant: "P4regular",
-        style: styles$t.description,
+        style: styles$s.description,
         text: ` from your device`
       }
     )),
     /* @__PURE__ */ React__default["default"].createElement(
       reactNative.Pressable,
       {
-        style: styles$t.button,
+        style: styles$s.button,
         onPress: onUpload,
         testID: "file-upload-button"
       },
@@ -1345,7 +1367,7 @@ const FileUpload = ({
         CustomTypography,
         {
           variant: "B2semiBold",
-          style: styles$t.buttonText,
+          style: styles$s.buttonText,
           text: btnText
         }
       )
@@ -1357,7 +1379,7 @@ const PdfView = (props) => {
   return /* @__PURE__ */ React__default["default"].createElement(Pdf__default["default"], { ...props });
 };
 
-const styles$s = reactNative.StyleSheet.create({
+const styles$r = reactNative.StyleSheet.create({
   container: {
     padding: horizontalScale(20),
     marginHorizontal: horizontalScale(16),
@@ -1413,39 +1435,39 @@ const PopUp = ({
   leftButtonShown = false,
   rightButtonShown = false
 }) => {
-  return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { testID, style: styles$s.container }, title ? /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { testID, style: styles$r.container }, title ? /* @__PURE__ */ React__default["default"].createElement(
     CustomTypography,
     {
-      style: styles$s.subTitleBelow,
+      style: styles$r.subTitleBelow,
       variant: "H6semiBold",
       text: title
     }
   ) : null, subtitle ? /* @__PURE__ */ React__default["default"].createElement(
     CustomTypography,
     {
-      style: styles$s.subtitle,
+      style: styles$r.subtitle,
       variant: "P3regular",
       text: subtitle
     }
-  ) : null, /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$s.buttonContainer }, leftButtonShown ? /* @__PURE__ */ React__default["default"].createElement(
+  ) : null, /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$r.buttonContainer }, leftButtonShown ? /* @__PURE__ */ React__default["default"].createElement(
     reactNative.Pressable,
     {
       testID: "Left-Button-Press",
-      style: styles$s.buttonLeft,
+      style: styles$r.buttonLeft,
       onPress: onButtonPress
     },
     /* @__PURE__ */ React__default["default"].createElement(
       CustomTypography,
       {
-        style: styles$s.buttonLeftText,
+        style: styles$r.buttonLeftText,
         variant: "B2semiBold",
         text: buttonText
       }
     )
-  ) : null, rightButtonShown ? /* @__PURE__ */ React__default["default"].createElement(reactNative.Pressable, { style: styles$s.button, onPress: onButtonPress }, /* @__PURE__ */ React__default["default"].createElement(
+  ) : null, rightButtonShown ? /* @__PURE__ */ React__default["default"].createElement(reactNative.Pressable, { style: styles$r.button, onPress: onButtonPress }, /* @__PURE__ */ React__default["default"].createElement(
     CustomTypography,
     {
-      style: styles$s.buttonText,
+      style: styles$r.buttonText,
       variant: "B2semiBold",
       text: buttonText
     }
@@ -1483,7 +1505,7 @@ const CustomProgressBar = ({
     return () => clearInterval(progressInterval);
   }, [progress, value, increment, interval]);
   const showPercentage = () => {
-    return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$r.flexDirection }, /* @__PURE__ */ React__default["default"].createElement(
+    return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$q.flexDirection }, /* @__PURE__ */ React__default["default"].createElement(
       CustomText$1,
       {
         text: `${value}%`,
@@ -1537,7 +1559,7 @@ const CustomProgressBar = ({
   };
   return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { testID: "custom-progress-bar" }, renderProgressBar());
 };
-const styles$r = reactNative.StyleSheet.create({
+const styles$q = reactNative.StyleSheet.create({
   flexDirection: {
     flexDirection: "column",
     justifyContent: "center",
@@ -1545,7 +1567,7 @@ const styles$r = reactNative.StyleSheet.create({
   }
 });
 
-const styles$q = reactNative.StyleSheet.create({
+const styles$p = reactNative.StyleSheet.create({
   container: {
     flexDirection: "row",
     alignItems: "center"
@@ -1611,13 +1633,13 @@ const Star = ({
       emptyStarColor
     );
     stars.push(
-      /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { key: i, style: [styles$q.star, starStyle] }, starType)
+      /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { key: i, style: [styles$p.star, starStyle] }, starType)
     );
   }
-  return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$q.container, testID: "star" }, stars);
+  return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$p.container, testID: "star" }, stars);
 };
 
-var styles$p = reactNative.StyleSheet.create({
+var styles$o = reactNative.StyleSheet.create({
   container: {
     flexDirection: "row",
     gap: horizontalScale(5),
@@ -1659,12 +1681,12 @@ const Tabs = ({
       onSelectionChange(selectedTabs);
     }
   };
-  return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: [styles$p.container, style] }, data?.map(({ id, title, isSelected }) => /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: [styles$o.container, style] }, data?.map(({ id, title, isSelected }) => /* @__PURE__ */ React__default["default"].createElement(
     reactNative.Pressable,
     {
       key: id,
       style: {
-        ...styles$p.button,
+        ...styles$o.button,
         backgroundColor: isSelected ? theme.CONTENT_PRIMARY : theme.CONTENT_INVERTED,
         borderColor: isSelected ? theme.CONTENT_INVERTED : theme.CONTENT_SECONDRY
       },
@@ -1684,7 +1706,7 @@ const Tabs = ({
 };
 var Tabs$1 = withThemeProvider(Tabs);
 
-const styles$o = reactNative.StyleSheet.create({
+const styles$n = reactNative.StyleSheet.create({
   container: {
     width: "100%"
   },
@@ -1743,8 +1765,8 @@ const Tags = ({
     reactNative.ScrollView,
     {
       testID,
-      style: styles$o.container,
-      contentContainerStyle: styles$o.contentContainer,
+      style: styles$n.container,
+      contentContainerStyle: styles$n.contentContainer,
       horizontal: false
     },
     tags?.map((tag) => /* @__PURE__ */ React__default["default"].createElement(
@@ -1754,16 +1776,16 @@ const Tags = ({
         key: tag,
         onPress: () => toggleTag(tag),
         style: [
-          styles$o.tag,
+          styles$n.tag,
           tagStyles,
-          selectedTags.includes(tag) ? styles$o.selectedTag : styles$o.tagUnSelected
+          selectedTags.includes(tag) ? styles$n.selectedTag : styles$n.tagUnSelected
         ]
       },
       /* @__PURE__ */ React__default["default"].createElement(
         CustomTypography,
         {
           variant: selectedTags.includes(tag) ? "H9semiBold" : "P4regular",
-          style: selectedTags.includes(tag) ? styles$o.tagText : styles$o.tagUnselectedText,
+          style: selectedTags.includes(tag) ? styles$n.tagText : styles$n.tagUnselectedText,
           text: tag
         }
       ),
@@ -1779,7 +1801,7 @@ const Tags = ({
   );
 };
 
-const styles$n = reactNative.StyleSheet.create({
+const styles$m = reactNative.StyleSheet.create({
   container: {
     width: horizontalScale(70),
     height: verticalScale(25),
@@ -1844,26 +1866,26 @@ const CustomSwitch = ({
     reactNative.Pressable,
     {
       onPress: toggleSwitch,
-      style: [styles$n.container, { width }],
+      style: [styles$m.container, { width }],
       testID: "custom-switch"
     },
     /* @__PURE__ */ React__default["default"].createElement(
       reactNative.View,
       {
         style: [
-          styles$n.track,
+          styles$m.track,
           {
             backgroundColor: isOn ? DHRE_COLORS_ALERT.DH_SUCCESS_GREEN_ACCENT : DHRE_COLORS_TEXT.DH_TEXTDISABLED
           }
         ]
       },
-      /* @__PURE__ */ React__default["default"].createElement(reactNative.Animated.View, { style: [styles$n.thumb, animatedStyle] }),
+      /* @__PURE__ */ React__default["default"].createElement(reactNative.Animated.View, { style: [styles$m.thumb, animatedStyle] }),
       type !== ToggleButtonType.SMALL && /* @__PURE__ */ React__default["default"].createElement(
         CustomTypography,
         {
           variant: "B3semiBold",
           style: [
-            styles$n.text,
+            styles$m.text,
             { textAlign: isOn ? TextDirectType.left : TextDirectType.right }
           ],
           text: isOn ? ToggleTextType.ON : ToggleTextType.OFF
@@ -1873,7 +1895,7 @@ const CustomSwitch = ({
   );
 };
 
-const styles$m = reactNative.StyleSheet.create({
+const styles$l = reactNative.StyleSheet.create({
   container: {
     paddingVertical: verticalScale(24),
     borderBottomWidth: moderateScale(1)
@@ -1934,7 +1956,7 @@ const Accordion = ({
     reactNative.View,
     {
       style: {
-        ...styles$m.container,
+        ...styles$l.container,
         borderBottomColor: theme.BORDER_SEPRATOR,
         ...containerStyle
       },
@@ -1943,7 +1965,7 @@ const Accordion = ({
     /* @__PURE__ */ React__default["default"].createElement(
       reactNative.Pressable,
       {
-        style: [styles$m.header, headerStyle, disabled && { opacity: 0.5 }],
+        style: [styles$l.header, headerStyle, disabled && { opacity: 0.5 }],
         onPress: !disabled ? onToggle : void 0
       },
       headerComponent ? headerComponent() : /* @__PURE__ */ React__default["default"].createElement(
@@ -1952,7 +1974,7 @@ const Accordion = ({
           variant: titleVariant,
           text: title,
           style: {
-            ...styles$m.title,
+            ...styles$l.title,
             color: theme.CONTENT_PRIMARY,
             ...titleStyle
           }
@@ -1961,11 +1983,11 @@ const Accordion = ({
       React__default["default"].cloneElement(icon, {
         width: moderateScale(20),
         height: moderateScale(20),
-        style: styles$m.iconStyle
+        style: styles$l.iconStyle
       })
     ),
     optionalElement ? optionalElement() : null,
-    isOpen && /* @__PURE__ */ React__default["default"].createElement(reactNative.Animated.View, { style: [styles$m.content, { height: cardHeight }] }, /* @__PURE__ */ React__default["default"].createElement(
+    isOpen && /* @__PURE__ */ React__default["default"].createElement(reactNative.Animated.View, { style: [styles$l.content, { height: cardHeight }] }, /* @__PURE__ */ React__default["default"].createElement(
       reactNative.View,
       {
         ref: contentRef,
@@ -1979,7 +2001,7 @@ const Accordion = ({
 };
 var Accordion$1 = withThemeProvider(Accordion);
 
-const styles$l = reactNative.StyleSheet.create({
+const styles$k = reactNative.StyleSheet.create({
   container: {
     position: "absolute",
     alignSelf: "center",
@@ -2061,23 +2083,23 @@ const Toast = React__default["default"].forwardRef(({ sucessIcon, errorIcon }, r
     reactNative.Animated.View,
     {
       style: [
-        styles$l.container,
+        styles$k.container,
         { bottom },
         { backgroundColor: isSuccess ? "#04743F" : "#DB3056" }
       ],
       testID: "TOAST"
     },
-    /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$l.toastContainer }, /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$l.innerContainer }, isSuccess ? sucessIcon : errorIcon, /* @__PURE__ */ React__default["default"].createElement(
+    /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$k.toastContainer }, /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$k.innerContainer }, isSuccess ? sucessIcon : errorIcon, /* @__PURE__ */ React__default["default"].createElement(
       CustomTypography,
       {
         variant: "L2_REGULAR",
         text: message,
-        style: styles$l.messageText
+        style: styles$k.messageText
       }
     ), btnText && /* @__PURE__ */ React__default["default"].createElement(
       reactNative.Pressable,
       {
-        style: styles$l.button,
+        style: styles$k.button,
         onPress: onBtnPress || void 0,
         testID: "TOAST-BTN"
       },
@@ -2086,7 +2108,7 @@ const Toast = React__default["default"].forwardRef(({ sucessIcon, errorIcon }, r
         {
           variant: "L2_BOLD",
           text: btnText,
-          style: styles$l.buttonText
+          style: styles$k.buttonText
         }
       )
     ))),
@@ -2104,7 +2126,7 @@ const Toast = React__default["default"].forwardRef(({ sucessIcon, errorIcon }, r
 });
 Toast.displayName = "Toast";
 
-const styles$k = reactNative.StyleSheet.create({
+const styles$j = reactNative.StyleSheet.create({
   inputContainer: {
     flexDirection: "row",
     justifyContent: "center",
@@ -2150,7 +2172,7 @@ const CustomSearchBar = ({
     {
       testID,
       style: [
-        styles$k.inputContainer,
+        styles$j.inputContainer,
         {
           height: verticalScale(height),
           borderColor: disabled ? disableBorderColor : value ? borderColor : "#A7A7A7"
@@ -2171,7 +2193,7 @@ const CustomSearchBar = ({
       React__default["default"].cloneElement(searchIcon, {
         width: moderateScale(24),
         height: moderateScale(24),
-        style: [styles$k.searchIconStyle, searchIconStyle]
+        style: [styles$j.searchIconStyle, searchIconStyle]
       })
     ),
     /* @__PURE__ */ React__default["default"].createElement(
@@ -2179,7 +2201,7 @@ const CustomSearchBar = ({
       {
         ...props,
         testID: `${testID}-INPUT`,
-        style: [styles$k.input, inputStyle],
+        style: [styles$j.input, inputStyle],
         editable: !disabled,
         value,
         placeholderTextColor: disabled ? disablePlaceHolderStyle : enablePlaceHolderStyle,
@@ -2202,13 +2224,13 @@ const CustomSearchBar = ({
       React__default["default"].cloneElement(rightIcon, {
         // width: moderateScale(24),
         // height: moderateScale(24),
-        style: [styles$k.crossIconStyle, crossIconStyle]
+        style: [styles$j.crossIconStyle, crossIconStyle]
       })
     )
   );
 };
 
-const styles$j = reactNative.StyleSheet.create({
+const styles$i = reactNative.StyleSheet.create({
   container: {
     flexDirection: "row",
     justifyContent: "space-between",
@@ -2240,17 +2262,17 @@ const CustomHeader = ({
     reactNative.View,
     {
       style: {
-        ...styles$j.container,
+        ...styles$i.container,
         backgroundColor: theme.SURFACE_SECONDARY,
         borderBottomColor: theme.BORDER_SEPERATOR_HEADER
       },
       testID: testId
     },
-    /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$j.headderContainer }, showLeftIcon && leftIcon ? React__default["default"].cloneElement(leftIcon, {
+    /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$i.headderContainer }, showLeftIcon && leftIcon ? React__default["default"].cloneElement(leftIcon, {
       width: moderateScale(24),
       height: moderateScale(24),
       onPress: onLeftPress,
-      style: styles$j.leftIconStyle
+      style: styles$i.leftIconStyle
     }) : null, /* @__PURE__ */ React__default["default"].createElement(
       CustomTypography,
       {
@@ -2263,13 +2285,13 @@ const CustomHeader = ({
       width: moderateScale(24),
       height: moderateScale(24),
       onPress: onRightPress,
-      style: styles$j.rightIconStyle
+      style: styles$i.rightIconStyle
     }) : null
   );
 };
 var CustomHeader$1 = withThemeProvider(CustomHeader);
 
-const styles$i = reactNative.StyleSheet.create({
+const styles$h = reactNative.StyleSheet.create({
   container: {
     flex: 1
   },
@@ -2321,19 +2343,19 @@ const SwipableList = (props) => {
     {
       testID,
       onPress,
-      style: [styles$i.actionButton, style]
+      style: [styles$h.actionButton, style]
     },
     icon,
     /* @__PURE__ */ React__default["default"].createElement(
       CustomTypography,
       {
         variant: "L1_REGULAR",
-        style: [styles$i.titleStyle, titleStyle],
+        style: [styles$h.titleStyle, titleStyle],
         text: title
       }
     )
   );
-  const leftActionHandle = (item, leftPrimaryActionIcon, leftPrimaryActionTitle, leftSecondaryActionIcon, leftSecondaryActionTitle) => /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$i.actionBtn }, leftPrimaryActionIcon && /* @__PURE__ */ React__default["default"].createElement(
+  const leftActionHandle = (item, leftPrimaryActionIcon, leftPrimaryActionTitle, leftSecondaryActionIcon, leftSecondaryActionTitle) => /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$h.actionBtn }, leftPrimaryActionIcon && /* @__PURE__ */ React__default["default"].createElement(
     ActionButton,
     {
       icon: leftPrimaryActionIcon,
@@ -2352,7 +2374,7 @@ const SwipableList = (props) => {
       testID: `${testId}-LEFT-SECONDARY-${item.id}`
     }
   ));
-  const rightActionHandle = (item) => /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: [styles$i.actionBtn, rightPrimaryActionStyle] }, rightPrimaryActionIcon && /* @__PURE__ */ React__default["default"].createElement(
+  const rightActionHandle = (item) => /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: [styles$h.actionBtn, rightPrimaryActionStyle] }, rightPrimaryActionIcon && /* @__PURE__ */ React__default["default"].createElement(
     ActionButton,
     {
       icon: rightPrimaryActionIcon,
@@ -2362,7 +2384,7 @@ const SwipableList = (props) => {
       testID: `${testId}-RIGHT-PRIMARY-${item.id}`
     }
   ));
-  const renderItem = ({ item }) => /* @__PURE__ */ React__default["default"].createElement(reactNativeGestureHandler.GestureHandlerRootView, { testID: `${testId}-LIST`, style: styles$i.container }, /* @__PURE__ */ React__default["default"].createElement(
+  const renderItem = ({ item }) => /* @__PURE__ */ React__default["default"].createElement(reactNativeGestureHandler.GestureHandlerRootView, { testID: `${testId}-LIST`, style: styles$h.container }, /* @__PURE__ */ React__default["default"].createElement(
     reactNativeGestureHandler.Swipeable,
     {
       renderLeftActions: () => leftActionHandle(
@@ -2386,7 +2408,7 @@ const SwipableList = (props) => {
         reactNative.View,
         {
           style: {
-            ...styles$i.seperator,
+            ...styles$h.seperator,
             backgroundColor: theme.BORDER_SEPRATOR
           }
         }
@@ -2396,7 +2418,7 @@ const SwipableList = (props) => {
 };
 var SwipableList$1 = withThemeProvider(SwipableList);
 
-const styles$h = reactNative.StyleSheet.create({
+const styles$g = reactNative.StyleSheet.create({
   container: {
     justifyContent: "center",
     alignItems: "center"
@@ -2418,7 +2440,7 @@ const CustomIcon = ({
   return /* @__PURE__ */ React__default["default"].createElement(
     reactNative.Pressable,
     {
-      style: [styles$h.container, containerStyle],
+      style: [styles$g.container, containerStyle],
       onPress,
       testID: testId
     },
@@ -2428,30 +2450,12 @@ const CustomIcon = ({
       {
         variant: titleVariant,
         text: title,
-        style: [styles$h.title, titleStyle]
+        style: [styles$g.title, titleStyle]
       }
     )
   );
 };
 
-const styles$g = reactNative.StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
-    backgroundColor: "transparent",
-    position: "absolute",
-    width: "100%",
-    height: "100%",
-    zIndex: 1e3
-  }
-});
-
-const CustomLoader = ({ loading }) => {
-  if (!loading) return null;
-  return /* @__PURE__ */ React__default["default"].createElement(reactNative.View, { style: styles$g.container }, /* @__PURE__ */ React__default["default"].createElement(reactNative.ActivityIndicator, { size: "large", color: "#686868" }));
-};
-
 const HorizontalLine = ({ backgroundColor = "SURFACE_SECONDARY", style }) => {
   const { theme } = useTheme();
   return /* @__PURE__ */ React__default["default"].createElement(