dhre-ui-kit 0.0.368 → 0.0.370

package/lib/index.mjs

@@ -658,7 +658,18 @@ const styles$z = StyleSheet.create({
   },
   title: { flex: 1, color: "#fff", textAlign: "left" },
   leftIconStyle: { marginRight: 8 },
-  rightIconStyle: { marginLeft: 8 }
+  rightTitle: {
+    color: "#fff",
+    textAlign: "right",
+    marginRight: moderateScale(16)
+  },
+  rightIconStyle: {
+    marginLeft: 0
+  },
+  rightSideStyle: {
+    flexDirection: "row",
+    alignItems: "center"
+  }
 });
 
 const isIos = () => Platform.OS === "ios" /* ios */;
@@ -688,7 +699,10 @@ const BottomDrawer = ({
   backdropOpacity = 0.9,
   footer,
   propagateSwipe = true,
-  swipeDirection = "down"
+  swipeDirection = "down",
+  rightTitleVariant = "B2_REGULAR",
+  rightTitle,
+  rightTitleStyle
 }) => {
   return /* @__PURE__ */ React.createElement(
     Modal,
@@ -708,7 +722,7 @@ const BottomDrawer = ({
         behavior: isIos() ? "padding" : "height",
         style: { flex: 1 }
       },
-      /* @__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, {
+      /* @__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 }, /* @__PURE__ */ React.createElement(View, null, showLeftIcon && leftIcon ? React.cloneElement(leftIcon, {
         width: moderateScale(24),
         height: moderateScale(24),
         style: styles$z.leftIconStyle,
@@ -720,12 +734,19 @@ const BottomDrawer = ({
           text: title,
           style: { ...styles$z.title, ...titleStyle }
         }
-      ), showRightIcon && rightIcon ? React.cloneElement(rightIcon, {
+      )), /* @__PURE__ */ React.createElement(View, { style: rightTitle?.length ? styles$z.rightSideStyle : {} }, rightTitle?.length ? /* @__PURE__ */ React.createElement(
+        CustomTypography,
+        {
+          variant: rightTitleVariant,
+          text: rightTitle,
+          style: { ...styles$z.rightTitle, ...rightTitleStyle }
+        }
+      ) : null, showRightIcon && rightIcon ? React.cloneElement(rightIcon, {
         width: moderateScale(24),
         height: moderateScale(24),
         style: styles$z.rightIconStyle,
         onPress: toggleModal
-      }) : null)), children))
+      }) : null))), children))
     ),
     footer ? /* @__PURE__ */ React.createElement(React.Fragment, null, footer) : null
   );
@@ -747,8 +768,6 @@ const createStyles$3 = (theme) => {
       backgroundColor: "rgba(0, 0, 0, 0.3)"
     },
     box: {
-      width: horizontalScale(100),
-      paddingVertical: 12,
       backgroundColor: theme.SURFACE_PRIMARY,
       borderRadius: 16,
       justifyContent: "center",
@@ -2338,25 +2357,40 @@ const CustomLoader = ({
 }) => {
   const { theme, mode } = useTheme();
   const styles = createStyles$3(theme);
+  const isDP = brandName === "DP";
   if (!loading) return null;
   else {
-    return /* @__PURE__ */ React.createElement(View, { style: [styles.container, customeContainer] }, /* @__PURE__ */ React.createElement(View, { style: [styles.backdrop, customeBackDrop] }, /* @__PURE__ */ React.createElement(View, { style: [styles.box, customeBox] }, /* @__PURE__ */ React.createElement(View, { style: styles.loader }, /* @__PURE__ */ React.createElement(
-      LottieView,
-      {
-        style: styles.loader,
-        source: brandName === "DP" ? DEFAULT_LOADER : mode === "dark" ? LOADER_LIGHT : LOADER_DARK,
-        autoPlay: true,
-        loop: true
-      }
-    )), loadingText && /* @__PURE__ */ React.createElement(
-      CustomText$1,
+    return /* @__PURE__ */ React.createElement(View, { style: [styles.container, customeContainer] }, /* @__PURE__ */ React.createElement(View, { style: [styles.backdrop, customeBackDrop] }, /* @__PURE__ */ React.createElement(
+      View,
       {
-        text: loadingText,
-        style: styles.text,
-        variant: FontStyle.B4_REGULAR,
-        textColor: "#000000"
-      }
-    ))));
+        style: [
+          styles.box,
+          {
+            width: horizontalScale(isDP ? 100 : 148),
+            paddingVertical: isDP ? 12 : 24
+          },
+          customeBox
+        ]
+      },
+      /* @__PURE__ */ React.createElement(View, { style: styles.loader }, /* @__PURE__ */ React.createElement(
+        LottieView,
+        {
+          style: styles.loader,
+          source: isDP ? DEFAULT_LOADER : mode === "dark" ? LOADER_LIGHT : LOADER_DARK,
+          autoPlay: true,
+          loop: true
+        }
+      )),
+      loadingText && /* @__PURE__ */ React.createElement(
+        CustomText$1,
+        {
+          text: loadingText,
+          style: styles.text,
+          variant: FontStyle.B4_REGULAR,
+          textColor: "#000000"
+        }
+      )
+    )));
   }
 };
 var CustomLoader$1 = withThemeProvider(CustomLoader);