dhre-ui-kit 0.0.148 → 0.0.151

package/lib/index.mjs

@@ -2738,31 +2738,33 @@ const DateRangePicker = (props) => {
   const getMarkedDates = () => {
     const { startDate, endDate } = selectedRange;
     const markedDates = {};
+    if (startDate && endDate) {
+      const start = new Date(startDate);
+      const end = new Date(endDate);
+      while (start < end) {
+        start.setDate(start.getDate() + 1);
+        markedDates[start.toISOString().split("T")[0]] = {
+          color: theme.SUCCESS,
+          textColor: theme.CONTENT_PRIMARY
+        };
+      }
+    }
     if (startDate) {
       markedDates[startDate] = {
         startingDay: true,
         color: theme.SUCCESS,
-        textColor: theme.CONTENT_PRIMARY
+        textColor: theme.CONTENT_INVERTED,
+        customContainerStyle: { backgroundColor: theme.SURFACE_INVERTED }
       };
     }
     if (endDate) {
       markedDates[endDate] = {
         endingDay: true,
         color: theme.SUCCESS,
-        textColor: theme.CONTENT_PRIMARY
+        textColor: theme.CONTENT_INVERTED,
+        customContainerStyle: { backgroundColor: theme.SURFACE_INVERTED }
       };
     }
-    if (startDate && endDate) {
-      const start = new Date(startDate);
-      const end = new Date(endDate);
-      while (start < end) {
-        start.setDate(start.getDate() + 1);
-        markedDates[start.toISOString().split("T")[0]] = {
-          color: theme.SUCCESS,
-          textColor: theme.CONTENT_PRIMARY
-        };
-      }
-    }
     return markedDates;
   };
   const isButtonDisabled = !selectedRange.startDate || !selectedRange.endDate;
@@ -2780,10 +2782,12 @@ const DateRangePicker = (props) => {
         todayTextColor: theme.SUCCESS
       },
       style: {
-        backgroundColor: "transparent",
-        color: theme.CONTENT_SECONDRY
+        backgroundColor: theme.SURFACE_TERTIARY,
+        color: theme.CONTENT_SECONDRY,
+        borderRadius: 24
       },
       onDayPress,
+      firstDay: 1,
       ...props
     }
   ), /* @__PURE__ */ React.createElement(
@@ -4064,7 +4068,7 @@ const styles$2 = StyleSheet.create({
     borderRadius: moderateScale(20),
     margin: moderateScale(4)
   },
-  buttonTextCOntainer: {
+  buttonTextContainer: {
     position: "absolute",
     left: 0,
     right: 0,
@@ -4080,6 +4084,9 @@ const CustomSlideButton = ({
   label,
   onComplete,
   icon,
+  textStyle,
+  containerStyle,
+  sliderStyle,
   size = BUTTON_WIDTH
 }) => {
   const value = useRef(0);
@@ -4126,14 +4133,17 @@ const CustomSlideButton = ({
   const { theme } = useTheme();
   return /* @__PURE__ */ React.createElement(View, { style: {
     ...styles$2.sliderContainer,
-    backgroundColor: theme.SURFACE_INVERTED
-  }, onLayout: handleLayout, ref: cardRef }, /* @__PURE__ */ React.createElement(View, { style: styles$2.buttonTextCOntainer }, /* @__PURE__ */ React.createElement(
+    backgroundColor: theme.SURFACE_INVERTED,
+    ...containerStyle
+  }, onLayout: handleLayout, ref: cardRef }, /* @__PURE__ */ React.createElement(View, { style: styles$2.buttonTextContainer }, /* @__PURE__ */ React.createElement(
     CustomTypography,
     {
       text: label,
       variant: FontStyle.L1_REGULAR,
       style: {
-        color: theme.CONTENT_INVERTED
+        color: theme.CONTENT_INVERTED,
+        alignSelf: "center",
+        ...textStyle
       }
     }
   )), /* @__PURE__ */ React.createElement(
@@ -4150,7 +4160,8 @@ const CustomSlideButton = ({
           backgroundColor: theme.SURFACE_PRIMARY,
           width: verticalScale(size),
           height: verticalScale(size),
-          borderRadius: verticalScale(size / 2)
+          borderRadius: verticalScale(size / 2),
+          ...sliderStyle
         }
       },
       icon