impact-ui 4.0.1-alpha.2 → 4.0.1-alpha.21

package/dist/components/DateRangePicker/dateRangePickerDropdown.js

@@ -1,19 +1,16 @@
-!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.PresetDateRangePicker_panel{padding:0 22px 11px}.PresetDateRangePicker_button{background:0 0;border:2px solid #00a699;-moz-box-sizing:border-box;box-sizing:border-box;color:#00a699;cursor:pointer;font:inherit;font-weight:700;height:100%;line-height:normal;margin-right:8px;overflow:visible;padding:4px 12px;position:relative;text-align:center}.PresetDateRangePicker_button:active{outline:0}.PresetDateRangePicker_button__selected{background:#00a699;color:#fff}.SingleDatePickerInput{background-color:#fff;display:inline-block}.SingleDatePickerInput__withBorder{border:1px solid #dbdbdb;border-radius:2px}.SingleDatePickerInput__rtl{direction:rtl}.SingleDatePickerInput__disabled{background-color:#f2f2f2}.SingleDatePickerInput__block{display:block}.SingleDatePickerInput__showClearDate{padding-right:30px}.SingleDatePickerInput_clearDate{background:0 0;border:0;color:inherit;cursor:pointer;font:inherit;line-height:normal;margin:0 10px 0 5px;overflow:visible;padding:10px;position:absolute;right:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.SingleDatePickerInput_clearDate__default:focus,.SingleDatePickerInput_clearDate__default:hover{background:#dbdbdb;border-radius:50%}.SingleDatePickerInput_clearDate__small{padding:6px}.SingleDatePickerInput_clearDate__hide{visibility:hidden}.SingleDatePickerInput_clearDate_svg{fill:#82888a;height:12px;vertical-align:middle;width:15px}.SingleDatePickerInput_clearDate_svg__small{height:9px}.SingleDatePickerInput_calendarIcon{background:0 0;border:0;color:inherit;cursor:pointer;display:inline-block;font:inherit;line-height:normal;margin:0 5px 0 10px;overflow:visible;padding:10px;vertical-align:middle}.SingleDatePickerInput_calendarIcon_svg{fill:#82888a;height:15px;vertical-align:middle;width:14px}.SingleDatePicker{display:inline-block;position:relative}.SingleDatePicker__block{display:block}.SingleDatePicker_picker{background-color:#fff;position:absolute;z-index:1}.SingleDatePicker_picker__rtl{direction:rtl}.SingleDatePicker_picker__directionLeft{left:0}.SingleDatePicker_picker__directionRight{right:0}.SingleDatePicker_picker__portal{background-color:#0000004d;height:100%;left:0;position:fixed;top:0;width:100%}.SingleDatePicker_picker__fullScreenPortal{background-color:#fff}.SingleDatePicker_closeButton{background:0 0;border:0;color:inherit;cursor:pointer;font:inherit;line-height:normal;overflow:visible;padding:15px;position:absolute;right:0;top:0;z-index:2}.SingleDatePicker_closeButton:focus,.SingleDatePicker_closeButton:hover{color:darken(#cacccd,10%);text-decoration:none}.SingleDatePicker_closeButton_svg{fill:#cacccd;height:15px;width:15px}.DayPickerKeyboardShortcuts_buttonReset{background:0 0;border:0;border-radius:0;color:inherit;cursor:pointer;font:inherit;font-size:14px;line-height:normal;overflow:visible;padding:0}.DayPickerKeyboardShortcuts_buttonReset:active{outline:0}.DayPickerKeyboardShortcuts_show{height:26px;position:absolute;width:33px;z-index:2}.DayPickerKeyboardShortcuts_show:before{content:"";display:block;position:absolute}.DayPickerKeyboardShortcuts_show__bottomRight{bottom:0;right:0}.DayPickerKeyboardShortcuts_show__bottomRight:before{border-right:33px solid #00a699;border-top:26px solid #0000;bottom:0;right:0}.DayPickerKeyboardShortcuts_show__bottomRight:hover:before{border-right:33px solid #008489}.DayPickerKeyboardShortcuts_show__topRight{right:0;top:0}.DayPickerKeyboardShortcuts_show__topRight:before{border-bottom:26px solid #0000;border-right:33px solid #00a699;right:0;top:0}.DayPickerKeyboardShortcuts_show__topRight:hover:before{border-right:33px solid #008489}.DayPickerKeyboardShortcuts_show__topLeft{left:0;top:0}.DayPickerKeyboardShortcuts_show__topLeft:before{border-bottom:26px solid #0000;border-left:33px solid #00a699;left:0;top:0}.DayPickerKeyboardShortcuts_show__topLeft:hover:before{border-left:33px solid #008489}.DayPickerKeyboardShortcuts_showSpan{color:#fff;position:absolute}.DayPickerKeyboardShortcuts_showSpan__bottomRight{bottom:0;right:5px}.DayPickerKeyboardShortcuts_showSpan__topRight{right:5px;top:1px}.DayPickerKeyboardShortcuts_showSpan__topLeft{left:5px;top:1px}.DayPickerKeyboardShortcuts_panel{background:#fff;border:1px solid #dbdbdb;border-radius:2px;bottom:0;left:0;margin:33px;overflow:auto;padding:22px;position:absolute;right:0;text-align:left;top:0;z-index:2}.DayPickerKeyboardShortcuts_title{font-size:16px;font-weight:700;margin:0}.DayPickerKeyboardShortcuts_list{font-size:14px;list-style:none;padding:0}.DayPickerKeyboardShortcuts_close{position:absolute;right:22px;top:22px;z-index:2}.DayPickerKeyboardShortcuts_close:active{outline:0}.DayPickerKeyboardShortcuts_closeSvg{fill:#cacccd;height:15px;width:15px}.DayPickerKeyboardShortcuts_closeSvg:focus,.DayPickerKeyboardShortcuts_closeSvg:hover{fill:#82888a}.CalendarDay{-moz-box-sizing:border-box;box-sizing:border-box;cursor:pointer;font-size:14px;text-align:center}.CalendarDay:active{outline:0}.CalendarDay__defaultCursor{cursor:default}.CalendarDay__default{background:#fff;border:1px solid #e4e7e7;color:#484848}.CalendarDay__default:hover{background:#e4e7e7;border:1px solid #e4e7e7;color:inherit}.CalendarDay__hovered_offset{background:#f4f5f5;border:1px double #e4e7e7;color:inherit}.CalendarDay__outside{background:#fff;border:0;color:#484848}.CalendarDay__outside:hover{border:0}.CalendarDay__blocked_minimum_nights{background:#fff;border:1px solid #eceeee;color:#cacccd}.CalendarDay__blocked_minimum_nights:active,.CalendarDay__blocked_minimum_nights:hover{background:#fff;color:#cacccd}.CalendarDay__highlighted_calendar{background:#ffe8bc;color:#484848}.CalendarDay__highlighted_calendar:active,.CalendarDay__highlighted_calendar:hover{background:#ffce71;color:#484848}.CalendarDay__selected_span{background:#66e2da;border:1px double #33dacd;color:#fff}.CalendarDay__selected_span:active,.CalendarDay__selected_span:hover{background:#33dacd;border:1px double #33dacd;color:#fff}.CalendarDay__selected,.CalendarDay__selected:active,.CalendarDay__selected:hover{background:#00a699;border:1px double #00a699;color:#fff}.CalendarDay__hovered_span,.CalendarDay__hovered_span:hover{background:#b2f1ec;border:1px double #80e8e0;color:#007a87}.CalendarDay__hovered_span:active{background:#80e8e0;border:1px double #80e8e0;color:#007a87}.CalendarDay__blocked_calendar,.CalendarDay__blocked_calendar:active,.CalendarDay__blocked_calendar:hover{background:#cacccd;border:1px solid #cacccd;color:#82888a}.CalendarDay__blocked_out_of_range,.CalendarDay__blocked_out_of_range:active,.CalendarDay__blocked_out_of_range:hover{background:#fff;border:1px solid #e4e7e7;color:#cacccd}.CalendarDay__hovered_start_first_possible_end{background:#eceeee;border:1px double #eceeee}.CalendarDay__hovered_start_blocked_min_nights{background:#eceeee;border:1px double #e4e7e7}.CalendarMonth{background:#fff;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:top}.CalendarMonth_table{border-collapse:collapse;border-spacing:0}.CalendarMonth_verticalSpacing{border-collapse:initial}.CalendarMonth_caption{caption-side:top;color:#484848;font-size:18px;padding-bottom:37px;padding-top:22px;text-align:center}.CalendarMonth_caption__verticalScrollable{padding-bottom:7px;padding-top:12px}.CalendarMonthGrid{background:#fff;text-align:left;z-index:0}.CalendarMonthGrid__animating{z-index:1}.CalendarMonthGrid__horizontal{left:9px;position:absolute}.CalendarMonthGrid__vertical,.CalendarMonthGrid__vertical_scrollable{margin:0 auto}.CalendarMonthGrid_month__horizontal{display:inline-block;min-height:100%;vertical-align:top}.CalendarMonthGrid_month__hideForAnimation{opacity:0;pointer-events:none;position:absolute;z-index:-1}.CalendarMonthGrid_month__hidden{visibility:hidden}.DayPickerNavigation{position:relative;z-index:2}.DayPickerNavigation__horizontal{height:0}.DayPickerNavigation__verticalScrollable_prevNav{z-index:1}.DayPickerNavigation__verticalDefault{bottom:0;height:52px;left:0;position:absolute;width:100%}.DayPickerNavigation__verticalScrollableDefault{position:relative}.DayPickerNavigation__bottom{height:auto}.DayPickerNavigation__bottomDefault{-webkit-box-pack:justify;-ms-flex-pack:justify;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between}.DayPickerNavigation_button{border:0;cursor:pointer;margin:0;padding:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.DayPickerNavigation_button__default{background-color:#fff;border:1px solid #e4e7e7;color:#757575}.DayPickerNavigation_button__default:focus,.DayPickerNavigation_button__default:hover{border:1px solid #c4c4c4}.DayPickerNavigation_button__default:active{background:#f2f2f2}.DayPickerNavigation_button__disabled{border:1px solid #f2f2f2;cursor:default}.DayPickerNavigation_button__disabled:focus,.DayPickerNavigation_button__disabled:hover{border:1px solid #f2f2f2}.DayPickerNavigation_button__disabled:active{background:0 0}.DayPickerNavigation_button__horizontalDefault{border-radius:3px;line-height:.78;padding:6px 9px;position:absolute;top:18px}.DayPickerNavigation_bottomButton__horizontalDefault{margin:-10px 22px 30px;position:static}.DayPickerNavigation_leftButton__horizontalDefault{left:22px}.DayPickerNavigation_rightButton__horizontalDefault{right:22px}.DayPickerNavigation_button__verticalDefault{background:#fff;box-shadow:0 0 5px 2px #0000001a;display:inline-block;height:100%;padding:5px;position:relative;text-align:center;width:50%}.DayPickerNavigation_nextButton__verticalDefault{border-left:0}.DayPickerNavigation_nextButton__verticalScrollableDefault,.DayPickerNavigation_prevButton__verticalScrollableDefault{width:100%}.DayPickerNavigation_svg__horizontal{display:block;fill:#82888a;height:19px;width:19px}.DayPickerNavigation_svg__vertical{fill:#484848;height:42px;width:42px}.DayPickerNavigation_svg__disabled{fill:#f2f2f2}.DayPicker{position:relative;text-align:left}.DayPicker,.DayPicker__horizontal{background:#fff}.DayPicker__verticalScrollable{height:100%}.DayPicker__hidden{visibility:hidden}.DayPicker__withBorder{border-radius:3px;box-shadow:0 2px 6px #0000000d,0 0 0 1px #00000012}.DayPicker_portal__horizontal{box-shadow:none;left:50%;position:absolute;top:50%}.DayPicker_portal__vertical{position:static}.DayPicker_focusRegion{outline:0}.DayPicker_calendarInfo__horizontal,.DayPicker_wrapper__horizontal{display:inline-block;vertical-align:top}.DayPicker_weekHeaders{position:relative}.DayPicker_weekHeaders__horizontal{margin-left:9px}.DayPicker_weekHeader{color:#757575;position:absolute;text-align:left;top:62px;z-index:2}.DayPicker_weekHeader__vertical{left:50%}.DayPicker_weekHeader__verticalScrollable{background:#fff;border-bottom:1px solid #dbdbdb;display:table-row;left:0;margin-left:0;text-align:center;top:0;width:100%}.DayPicker_weekHeader_ul{font-size:14px;list-style:none;margin:1px 0;padding-left:0;padding-right:0}.DayPicker_weekHeader_li{display:inline-block;text-align:center}.DayPicker_transitionContainer{border-radius:3px;overflow:hidden;position:relative}.DayPicker_transitionContainer__horizontal{-webkit-transition:height .2s ease-in-out;-moz-transition:height .2s ease-in-out;transition:height .2s ease-in-out}.DayPicker_transitionContainer__vertical{width:100%}.DayPicker_transitionContainer__verticalScrollable{bottom:0;height:100%;left:0;overflow-y:scroll;padding-top:20px;position:absolute;right:0;top:0}.DateInput{background:#fff;display:inline-block;margin:0;padding:0;position:relative;vertical-align:middle;width:130px}.DateInput__small{width:97px}.DateInput__block{width:100%}.DateInput__disabled{background:#f2f2f2;color:#dbdbdb}.DateInput_input{background-color:#fff;border:0;border-bottom:2px solid #0000;border-radius:0;color:#484848;font-size:19px;font-weight:200;line-height:24px;padding:11px 11px 9px;width:100%}.DateInput_input__small{font-size:15px;letter-spacing:.2px;line-height:18px;padding:7px 7px 5px}.DateInput_input__regular{font-weight:auto}.DateInput_input__readOnly{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.DateInput_input__focused{background:#fff;border:0;border-bottom:2px solid #008489;outline:0}.DateInput_input__disabled{background:#f2f2f2;font-style:italic}.DateInput_screenReaderMessage{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.DateInput_fang{height:10px;left:22px;position:absolute;width:20px;z-index:2}.DateInput_fangShape{fill:#fff}.DateInput_fangStroke{fill:#0000;stroke:#dbdbdb}.DateRangePickerInput{background-color:#fff;display:inline-block}.DateRangePickerInput__disabled{background:#f2f2f2}.DateRangePickerInput__withBorder{border:1px solid #dbdbdb;border-radius:2px}.DateRangePickerInput__rtl{direction:rtl}.DateRangePickerInput__block{display:block}.DateRangePickerInput__showClearDates{padding-right:30px}.DateRangePickerInput_arrow{color:#484848;display:inline-block;vertical-align:middle}.DateRangePickerInput_arrow_svg{fill:#484848;height:24px;vertical-align:middle;width:24px}.DateRangePickerInput_clearDates{background:0 0;border:0;color:inherit;cursor:pointer;font:inherit;line-height:normal;margin:0 10px 0 5px;overflow:visible;padding:10px;position:absolute;right:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.DateRangePickerInput_clearDates__small{padding:6px}.DateRangePickerInput_clearDates_default:focus,.DateRangePickerInput_clearDates_default:hover{background:#dbdbdb;border-radius:50%}.DateRangePickerInput_clearDates__hide{visibility:hidden}.DateRangePickerInput_clearDates_svg{fill:#82888a;height:12px;vertical-align:middle;width:15px}.DateRangePickerInput_clearDates_svg__small{height:9px}.DateRangePickerInput_calendarIcon{background:0 0;border:0;color:inherit;cursor:pointer;display:inline-block;font:inherit;line-height:normal;margin:0 5px 0 10px;overflow:visible;padding:10px;vertical-align:middle}.DateRangePickerInput_calendarIcon_svg{fill:#82888a;height:15px;vertical-align:middle;width:14px}.DateRangePicker{display:inline-block;position:relative}.DateRangePicker__block{display:block}.DateRangePicker_picker{background-color:#fff;position:absolute;z-index:1}.DateRangePicker_picker__rtl{direction:rtl}.DateRangePicker_picker__directionLeft{left:0}.DateRangePicker_picker__directionRight{right:0}.DateRangePicker_picker__portal{background-color:#0000004d;height:100%;left:0;position:fixed;top:0;width:100%}.DateRangePicker_picker__fullScreenPortal{background-color:#fff}.DateRangePicker_closeButton{background:0 0;border:0;color:inherit;cursor:pointer;font:inherit;line-height:normal;overflow:visible;padding:15px;position:absolute;right:0;top:0;z-index:2}.DateRangePicker_closeButton:focus,.DateRangePicker_closeButton:hover{color:darken(#cacccd,10%);text-decoration:none}.DateRangePicker_closeButton_svg{fill:#cacccd;height:15px;width:15px}')),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}}();
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { useState, useLayoutEffect, useCallback, useMemo } from "react";
+import React__default, { useState, useLayoutEffect } from "react";
 import moment from "moment";
-import "../../node_modules/react-dates/lib/initialize.js";
 import { DayPickerRangeController } from "react-dates";
-import { DateRangePickerShowMonthYearSelect } from "./showMonthYearSelect.js";
-import { Portal } from "../Portal/index.js";
 import { DateRangePickerCustom } from "./dateRangePickerCustom.js";
 import { DateRangePickerFooter } from "./dateRangePickerFooter.js";
-import { calculatePosition, formatMomentDate, setStartDateOffset, setEndDateOffset } from "./utils.js";
-
+import { ShowMonthYearSelect } from "./showMonthYearSelect.js";
+import { calculatePosition, formatMomentDate } from "./utils.js";
+import { Portal } from "../Portal/index.js";
 function DateRangePickerDropdown({
   dropDownContainerRef,
   withPortal,
-  portalContainer = typeof document !== "undefined" ? document.body : void 0,
+  portalContainer,
   containerRef,
   onDatesChange,
   onFocusChange,
@@ -22,6 +19,8 @@ function DateRangePickerDropdown({
   endDate,
   showWeekNumbers,
   selectedRange,
+  setStartDateOffset,
+  setEndDateOffset,
   selectedDaysNumber,
   handleResetDates,
   handleCancelDates,
@@ -36,24 +35,17 @@ function DateRangePickerDropdown({
   customWeekNumberData,
   suppressClickOnWeekNumber,
   setIsOpen,
-  startDateOffset: startDateOffsetProp,
-  endDateOffset: endDateOffsetProp,
+  startDateOffset,
+  endDateOffset,
   hasInputErrors,
   portalClassName,
-  minDate,
-  maxDate,
-  isOutsideRange,
-  ...calendarProps
+  ...args
 }) {
   const [position, setPosition] = useState({
     x: 0,
     y: 0,
     offsetHeight: 0,
-    offsetWidth: 0,
-    left: 0,
-    right: "auto",
-    bottom: void 0,
-    top: void 0
+    offsetWidth: 0
   });
   const [customPosition, setCustomPosition] = useState({
     left: 0,
@@ -61,66 +53,61 @@ function DateRangePickerDropdown({
   });
   useLayoutEffect(() => {
     if (withPortal && containerRef.current) {
-      const scrollY = typeof window !== "undefined" ? window.scrollY || document.documentElement.scrollTop : 0;
+      const scrollY = window.scrollY || document.documentElement.scrollTop;
       const {
         x,
         y,
         height: offsetHeight,
         width: offsetWidth
       } = containerRef.current.getBoundingClientRect();
-      calculatePosition({ containerRef, setCustomPosition, showRangeSelector });
-      setPosition((prev) => ({
-        ...prev,
+      calculatePosition({
+        containerRef,
+        setCustomPosition,
+        showRangeSelector
+      });
+      setPosition({
         x,
         y: y + scrollY,
         offsetHeight,
-        offsetWidth
-      }));
+        offsetWidth,
+        ...customPosition
+      });
     } else if (!withPortal && containerRef.current && dropDownContainerRef.current) {
-      calculatePosition({ containerRef, setCustomPosition, showRangeSelector });
+      calculatePosition({
+        containerRef,
+        setCustomPosition,
+        showRangeSelector
+      });
     }
-  }, [withPortal, containerRef, dropDownContainerRef, showRangeSelector]);
-  const renderDayContents = useCallback(
-    (momentInstance, modifiers) => {
-      let content = null;
-      if (showWeekNumbers && modifiers.has("first-day-of-week")) {
-        if (customWeekNumberData && Array.isArray(customWeekNumberData)) {
-          const formatted = formatMomentDate(momentInstance);
-          const weekData = customWeekNumberData.find((w) => w.calendar_week_start_date === formatted);
-          content = /* @__PURE__ */ jsxs(
-            "span",
-            {
-              className: `CalendarDayWeekNumber ${suppressClickOnWeekNumber ? "suppress-click-on-week-number" : ""}`,
-              children: [
-                "W",
-                (weekData == null ? void 0 : weekData.calendar_year_week) ?? ""
-              ]
-            }
-          );
-        } else {
-          const startOfMonth = momentInstance.clone().startOf("month");
-          const weekNumber = Math.ceil((momentInstance.date() - 1 + startOfMonth.day()) / 7);
-          content = /* @__PURE__ */ jsxs(
-            "span",
-            {
-              className: `CalendarDayWeekNumber ${suppressClickOnWeekNumber ? "suppress-click-on-week-number" : ""}`,
-              children: [
-                "W",
-                weekNumber + 1
-              ]
-            }
-          );
-        }
+  }, [containerRef.current, dropDownContainerRef.current, withPortal, showRangeSelector]);
+  const renderDayContents = React__default.useCallback((momentInstance, modifiers) => {
+    let currentWeek = null;
+    let currentWeekNumber = null;
+    if (customWeekNumberData) {
+      if (modifiers.has("first-day-of-week")) {
+        currentWeek = customWeekNumberData.find((weekNumberData) => {
+          return (weekNumberData == null ? void 0 : weekNumberData.calendar_week_start_date) === formatMomentDate(momentInstance);
+        });
       }
-      return /* @__PURE__ */ jsxs(Fragment, { children: [
-        content,
-        /* @__PURE__ */ jsx("span", { className: "CalendarDayNumber", children: momentInstance.format("D") })
-      ] });
-    },
-    [showWeekNumbers, customWeekNumberData, suppressClickOnWeekNumber]
-  );
-  const startOffsetFn = startDateOffsetProp ?? (selectedRange === "custom" ? void 0 : (day) => setStartDateOffset(selectedRange, day));
-  const endOffsetFn = endDateOffsetProp ?? (selectedRange === "custom" ? void 0 : (day) => setEndDateOffset(selectedRange, day));
+    } else {
+      const startOfMonth = momentInstance.clone().startOf("month");
+      const weekNumber = Math.ceil((momentInstance.date() - 1 + startOfMonth.day()) / 7);
+      currentWeekNumber = weekNumber;
+    }
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      showWeekNumbers && modifiers.has("first-day-of-week") && /* @__PURE__ */ jsxs(
+        "span",
+        {
+          className: `CalendarDayWeekNumber ${suppressClickOnWeekNumber ? "suppress-click-on-week-number" : ""}`,
+          children: [
+            "W",
+            customWeekNumberData ? currentWeek == null ? void 0 : currentWeek.calendar_year_week : currentWeekNumber + 1
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "CalendarDayNumber", children: momentInstance.format("D") })
+    ] });
+  }, []);
   const onPrevMonthClick = (params) => {
     var _a, _b;
     const isNavButtonFocused = (_a = document.activeElement) == null ? void 0 : _a.classList.contains(
@@ -135,7 +122,7 @@ function DateRangePickerDropdown({
         btn == null ? void 0 : btn.focus();
       }, 0);
     }
-    (_b = calendarProps.onPrevMonthClick) == null ? void 0 : _b.call(calendarProps, params);
+    (_b = args.onPrevMonthClick) == null ? void 0 : _b.call(args, params);
   };
   const onNextMonthClick = (params) => {
     var _a, _b;
@@ -151,117 +138,168 @@ function DateRangePickerDropdown({
         btn == null ? void 0 : btn.focus();
       }, 0);
     }
-    (_b = calendarProps.onNextMonthClick) == null ? void 0 : _b.call(calendarProps, params);
+    (_b = args.onNextMonthClick) == null ? void 0 : _b.call(args, params);
   };
-  const isDayOutsideRange = useMemo(() => {
-    if (minDate == null && maxDate == null) {
-      return isOutsideRange;
-    }
-    return (day) => {
-      if (minDate != null && day.isBefore(minDate, "day")) return true;
-      if (maxDate != null && day.isAfter(maxDate, "day")) return true;
-      if (isOutsideRange == null ? void 0 : isOutsideRange(day)) return true;
-      return false;
-    };
-  }, [minDate, maxDate, isOutsideRange]);
-  const rangeSelector = showRangeSelector ? /* @__PURE__ */ jsx(
-    DateRangePickerCustom,
-    {
-      handleRangeSelectorChange,
-      selectedRange
-    }
-  ) : null;
-  const leftContainer = /* @__PURE__ */ jsxs("div", { className: `dateRangePicker-left-container ${showWeekNumbers ? "showWeekNumbers" : ""}`, children: [
-    /* @__PURE__ */ jsx(
-      DayPickerRangeController,
-      {
-        hideKeyboardShortcutsPanel: true,
-        daySize: 26,
-        endDate,
-        endDateOffset: endOffsetFn,
-        focusedInput,
-        horizontalMonthPadding: showWeekNumbers ? 16 : 12,
-        initialVisibleMonth: () => startDate ?? endDate ?? moment(),
-        isOutsideRange: isDayOutsideRange,
-        numberOfMonths: 2,
-        renderDayContents: showWeekNumbers ? renderDayContents : void 0,
-        renderMonthElement: showMonthYearSelect ? ({
-          month,
-          onMonthSelect,
-          onYearSelect
-        }) => /* @__PURE__ */ jsx(
-          DateRangePickerShowMonthYearSelect,
-          {
-            customYears,
-            month,
-            onMonthSelect,
-            onYearSelect
-          }
-        ) : void 0,
-        startDate,
-        startDateOffset: startOffsetFn,
-        onDatesChange,
-        onFocusChange,
-        onNextMonthClick,
-        onPrevMonthClick,
-        ...calendarProps
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      DateRangePickerFooter,
-      {
-        handleApplyDates,
-        handleCancelDates,
-        handleResetDates,
-        hasInputErrors,
-        primaryButtonProps,
-        selectedDaysNumber,
-        tertiaryButtonProps,
-        onSecondaryButtonClick
-      }
-    )
-  ] });
-  const dropdownContent = /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: dropDownContainerRef,
-      className: `impact-dateRangePicker-dropdown-container ${showRangeSelector ? "showRangeSelector" : ""}`,
-      style: customPosition,
-      children: [
-        leftContainer,
-        withPortal ? /* @__PURE__ */ jsx("div", { className: "dateRangePicker-right-container", children: rangeSelector }) : rangeSelector
-      ]
-    }
-  );
-  if (withPortal && portalContainer) {
+  if (withPortal) {
     return /* @__PURE__ */ jsxs(Portal, { container: portalContainer, children: [
       /* @__PURE__ */ jsx(
         "div",
         {
-          className: `impact-portal-container ${portalClassName ?? ""}`.trim(),
+          className: `impact-portal-container ${portalClassName}`,
           style: {
-            top: position.y ?? position.top,
-            left: position.x ?? position.left,
+            top: position.y || position.top,
+            left: position.x || position.left,
             bottom: position.bottom,
             right: position.right,
-            width: position.offsetWidth ? `${position.offsetWidth}px` : void 0
+            width: position.offsetWidth || "0px"
           },
-          children: dropdownContent
+          children: /* @__PURE__ */ jsxs(
+            "div",
+            {
+              ref: dropDownContainerRef,
+              className: `impact-dateRangePicker-dropdown-container ${showRangeSelector ? "showRangeSelector" : ""}`,
+              style: {
+                ...customPosition
+              },
+              children: [
+                /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: `dateRangePicker-left-container ${showWeekNumbers ? "showWeekNumbers" : ""}`,
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        DayPickerRangeController,
+                        {
+                          ...args,
+                          daySize: 26,
+                          endDate,
+                          endDateOffset: endDateOffset ? endDateOffset : selectedRange === "custom" ? void 0 : setEndDateOffset,
+                          focusedInput,
+                          hideKeyboardShortcutsPanel: true,
+                          horizontalMonthPadding: showWeekNumbers ? 16 : 12,
+                          initialVisibleMonth: () => {
+                            if (startDate) return startDate;
+                            if (endDate) return endDate;
+                            return moment();
+                          },
+                          numberOfMonths: 2,
+                          renderDayContents: showWeekNumbers ? renderDayContents : null,
+                          renderMonthElement: showMonthYearSelect ? ({ month, onMonthSelect, onYearSelect }) => /* @__PURE__ */ jsx(
+                            ShowMonthYearSelect,
+                            {
+                              customYears,
+                              month,
+                              onMonthSelect,
+                              onYearSelect
+                            }
+                          ) : null,
+                          startDate,
+                          startDateOffset: startDateOffset ? startDateOffset : selectedRange === "custom" ? void 0 : setStartDateOffset,
+                          onDatesChange,
+                          onFocusChange,
+                          onNextMonthClick,
+                          onPrevMonthClick
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        DateRangePickerFooter,
+                        {
+                          handleApplyDates,
+                          handleCancelDates,
+                          handleResetDates,
+                          hasInputErrors,
+                          primaryButtonProps,
+                          selectedDaysNumber,
+                          tertiaryButtonProps,
+                          onSecondaryButtonClick
+                        }
+                      )
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx("div", { className: "dateRangePicker-right-container", children: showRangeSelector ? /* @__PURE__ */ jsx(
+                  DateRangePickerCustom,
+                  {
+                    handleRangeSelectorChange,
+                    selectedRange
+                  }
+                ) : null })
+              ]
+            }
+          )
         }
       ),
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          "aria-hidden": true,
-          className: "ia-select-container-v3-blanket",
-          onClick: () => {
-            setIsOpen(false);
-          }
-        }
-      )
+      /* @__PURE__ */ jsx("div", { className: "ia-select-container-v3-blanket", onClick: () => setIsOpen(false) })
     ] });
   }
-  return dropdownContent;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: dropDownContainerRef,
+      className: `impact-dateRangePicker-dropdown-container ${showRangeSelector ? "showRangeSelector" : ""}`,
+      style: {
+        ...customPosition
+      },
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: `dateRangePicker-left-container ${showWeekNumbers ? "showWeekNumbers" : ""}`, children: [
+          /* @__PURE__ */ jsx(
+            DayPickerRangeController,
+            {
+              ...args,
+              daySize: 26,
+              endDate,
+              endDateOffset: endDateOffset ? endDateOffset : selectedRange === "custom" ? void 0 : (day) => setEndDateOffset(selectedRange, day),
+              focusedInput,
+              hideKeyboardShortcutsPanel: true,
+              horizontalMonthPadding: showWeekNumbers ? 16 : 12,
+              initialVisibleMonth: () => {
+                if (startDate) return startDate;
+                if (endDate) return endDate;
+                return moment();
+              },
+              numberOfMonths: 2,
+              renderDayContents: showWeekNumbers ? renderDayContents : null,
+              renderMonthElement: showMonthYearSelect ? ({ month, onMonthSelect, onYearSelect }) => /* @__PURE__ */ jsx(
+                ShowMonthYearSelect,
+                {
+                  customYears,
+                  month,
+                  onMonthSelect,
+                  onYearSelect
+                }
+              ) : null,
+              startDate,
+              startDateOffset: startDateOffset ? startDateOffset : selectedRange === "custom" ? void 0 : (day) => setStartDateOffset(selectedRange, day),
+              onDatesChange,
+              onFocusChange,
+              onNextMonthClick,
+              onPrevMonthClick
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            DateRangePickerFooter,
+            {
+              handleApplyDates,
+              handleCancelDates,
+              handleResetDates,
+              hasInputErrors,
+              primaryButtonProps,
+              selectedDaysNumber,
+              tertiaryButtonProps,
+              onSecondaryButtonClick
+            }
+          )
+        ] }),
+        showRangeSelector ? /* @__PURE__ */ jsx(
+          DateRangePickerCustom,
+          {
+            handleRangeSelectorChange,
+            selectedRange
+          }
+        ) : null
+      ]
+    }
+  );
 }
 export {
   DateRangePickerDropdown

package/dist/components/DateRangePicker/dateRangePickerFooter.d.ts

@@ -1,12 +1,2 @@
-export interface DateRangePickerFooterProps {
-    selectedDaysNumber: number;
-    handleResetDates: () => void;
-    handleCancelDates: () => void;
-    onSecondaryButtonClick?: () => void;
-    tertiaryButtonProps?: Record<string, unknown>;
-    handleApplyDates: () => void;
-    primaryButtonProps?: Record<string, unknown>;
-    hasInputErrors?: boolean;
-}
-export declare function DateRangePickerFooter({ selectedDaysNumber, handleResetDates, handleCancelDates, onSecondaryButtonClick, tertiaryButtonProps, handleApplyDates, primaryButtonProps, hasInputErrors, }: DateRangePickerFooterProps): import("react/jsx-runtime").JSX.Element;
+export declare function DateRangePickerFooter({ selectedDaysNumber, handleResetDates, handleCancelDates, onSecondaryButtonClick, tertiaryButtonProps, handleApplyDates, primaryButtonProps, hasInputErrors, }: any): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=dateRangePickerFooter.d.ts.map

package/dist/components/DateRangePicker/dateRangePickerFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dateRangePickerFooter.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/dateRangePickerFooter.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,0BAA0B;IACzC,kBAAkB,EAAE,MAAM,CAAC;IAC3B,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,mBAAmB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC7C,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,wBAAgB,qBAAqB,CAAC,EACpC,kBAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,sBAAsB,EACtB,mBAAmB,EACnB,gBAAgB,EAChB,kBAAkB,EAClB,cAAc,GACf,EAAE,0BAA0B,2CAkC5B"}
+{"version":3,"file":"dateRangePickerFooter.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/dateRangePickerFooter.tsx"],"names":[],"mappings":"AAIA,wBAAgB,qBAAqB,CAAC,EACpC,kBAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,sBAAsB,EACtB,mBAAmB,EACnB,gBAAgB,EAChB,kBAAkB,EAClB,cAAc,GACf,EAAE,GAAG,2CAkCL"}

package/dist/components/DateRangePicker/dateRangePickerFooter.js

@@ -20,7 +20,7 @@ function DateRangePickerFooter({
     ] }) }),
     /* @__PURE__ */ jsxs("div", { className: "dateRangePicker-buttons-right-container", children: [
       /* @__PURE__ */ jsx(Button, { size: "small", variant: "url", onClick: handleResetDates, children: "Clear" }),
-      onSecondaryButtonClick != null && /* @__PURE__ */ jsx(
+      onSecondaryButtonClick && /* @__PURE__ */ jsx(
         Button,
         {
           size: "small",

package/dist/components/DateRangePicker/dateRangePickerInput.d.ts

@@ -1,31 +1,2 @@
-import { Moment } from 'moment';
-
-export interface DateRangePickerInputProps {
-    id?: string;
-    'data-testid'?: string;
-    inputContainerRef?: React.RefObject<HTMLDivElement | null>;
-    startDateString?: string;
-    onStartDateFocus: () => void;
-    startDateInputRef: React.RefObject<HTMLInputElement | null>;
-    startDateInputProps?: Record<string, unknown>;
-    endDateString?: string;
-    onEndDateFocus: () => void;
-    endDateInputRef: React.RefObject<HTMLInputElement | null>;
-    endDateInputProps?: Record<string, unknown>;
-    isDisabled?: boolean;
-    isError?: boolean;
-    isOpen?: boolean;
-    displayFormat?: string;
-    onStartDateStringChange?: (value: Moment | string | null) => void;
-    onEndDateStringChange?: (value: Moment | string | null) => void;
-    minDate?: Moment | null;
-    maxDate?: Moment | null;
-    readOnly?: boolean;
-    isOutsideRange?: (day: Moment) => boolean;
-    onErrorStateChange?: (hasErrors: boolean) => void;
-    clearErrorsTrigger?: number;
-    resetTrigger?: number;
-    customIcon?: React.ReactNode;
-}
-export declare function DateRangePickerInput({ id, 'data-testid': dataTestId, inputContainerRef, startDateString, onStartDateFocus, startDateInputRef, startDateInputProps, endDateString, onEndDateFocus, endDateInputRef, endDateInputProps, isDisabled, isError, isOpen, displayFormat, onStartDateStringChange, onEndDateStringChange, minDate, maxDate, readOnly, isOutsideRange, onErrorStateChange, clearErrorsTrigger, resetTrigger, customIcon, }: DateRangePickerInputProps): import("react/jsx-runtime").JSX.Element;
+export declare function DateRangePickerInput({ inputContainerRef, startDateString, startDateInputRef, startDateInputProps, endDateString, endDateInputRef, endDateInputProps, isDisabled, isError, onStartDateFocus, onEndDateFocus, displayFormat, onStartDateStringChange, onEndDateStringChange, minDate, maxDate, readOnly, isOutsideRange, onErrorStateChange, clearErrorsTrigger, resetTrigger, customIcon, }: any): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=dateRangePickerInput.d.ts.map

package/dist/components/DateRangePicker/dateRangePickerInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dateRangePickerInput.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/dateRangePickerInput.tsx"],"names":[],"mappings":"AAEA,OAAe,EAAE,KAAK,MAAM,EAAE,MAAM,QAAQ,CAAC;AAe7C,MAAM,WAAW,yBAAyB;IACxC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC3D,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC5D,mBAAmB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC1D,iBAAiB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC5C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAClE,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAChE,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;IAC1C,kBAAkB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AAED,wBAAgB,oBAAoB,CAAC,EACnC,EAAE,EACF,aAAa,EAAE,UAAU,EACzB,iBAAiB,EACjB,eAAoB,EACpB,gBAAgB,EAChB,iBAAiB,EACjB,mBAAmB,EACnB,aAAkB,EAClB,cAAc,EACd,eAAe,EACf,iBAAiB,EACjB,UAAU,EACV,OAAO,EACP,MAAc,EACd,aAA4B,EAC5B,uBAAuB,EACvB,qBAAqB,EACrB,OAAO,EACP,OAAO,EACP,QAAgB,EAChB,cAAc,EACd,kBAAkB,EAClB,kBAAsB,EACtB,YAAgB,EAChB,UAAU,GACX,EAAE,yBAAyB,2CA2V3B"}
+{"version":3,"file":"dateRangePickerInput.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/dateRangePickerInput.tsx"],"names":[],"mappings":"AAMA,wBAAgB,oBAAoB,CAAC,EACnC,iBAAiB,EACjB,eAAe,EACf,iBAAiB,EACjB,mBAAmB,EACnB,aAAa,EACb,eAAe,EACf,iBAAiB,EACjB,UAAU,EACV,OAAO,EACP,gBAAgB,EAChB,cAAc,EACd,aAA4B,EAC5B,uBAAuB,EACvB,qBAAqB,EACrB,OAAO,EACP,OAAO,EACP,QAAQ,EACR,cAAc,EACd,kBAAkB,EAClB,kBAAkB,EAClB,YAAY,EACZ,UAAU,GACX,EAAE,GAAG,2CAkfL"}