@activecollab/components 2.0.211 → 2.0.213

package/dist/index.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('classnames'), require('styled-components'), require('resize-observer-polyfill'), require('react-focus-lock'), require('react-remove-scroll'), require('react-dom'), require('@popperjs/core'), require('react-transition-group'), require('moment'), require('date-fns'), require('react-day-picker'), require('moment-timezone'), require('@tanstack/react-virtual'), require('country-explorer'), require('compromise'), require('compromise-dates')) :
-  typeof define === 'function' && define.amd ? define(['exports', 'react', 'classnames', 'styled-components', 'resize-observer-polyfill', 'react-focus-lock', 'react-remove-scroll', 'react-dom', '@popperjs/core', 'react-transition-group', 'moment', 'date-fns', 'react-day-picker', 'moment-timezone', '@tanstack/react-virtual', 'country-explorer', 'compromise', 'compromise-dates'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.components = {}, global.React, global.classNames, global.styled, global.ResizeObserver, global.FocusLock, global.reactRemoveScroll, global.ReactDOM, global.PopperJS, global.reactTransitionGroup, global.moment, global.DateFns, global.DayPicker, global["moment-timezone"], global.reactVirtual, global.countryExplorer, global.compromise, global.compromiseDates));
-})(this, (function (exports, React, classNames, styled, ResizeObserver, FocusLock, reactRemoveScroll, ReactDOM, core, reactTransitionGroup, moment, dateFns, reactDayPicker, moment$1, reactVirtual, countryExplorer, nlp, plg) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('classnames'), require('styled-components'), require('resize-observer-polyfill'), require('react-focus-lock'), require('react-remove-scroll'), require('react-dom'), require('@popperjs/core'), require('react-transition-group'), require('moment-timezone'), require('@tanstack/react-virtual'), require('country-explorer'), require('compromise'), require('compromise-dates'), require('moment')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'react', 'classnames', 'styled-components', 'resize-observer-polyfill', 'react-focus-lock', 'react-remove-scroll', 'react-dom', '@popperjs/core', 'react-transition-group', 'moment-timezone', '@tanstack/react-virtual', 'country-explorer', 'compromise', 'compromise-dates', 'moment'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.components = {}, global.React, global.classNames, global.styled, global.ResizeObserver, global.FocusLock, global.reactRemoveScroll, global.ReactDOM, global.PopperJS, global.reactTransitionGroup, global["moment-timezone"], global.reactVirtual, global.countryExplorer, global.compromise, global.compromiseDates, global.moment));
+})(this, (function (exports, React, classNames, styled, ResizeObserver, FocusLock, reactRemoveScroll, ReactDOM, core, reactTransitionGroup, moment, reactVirtual, countryExplorer, nlp, plg, moment$1) { 'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -13,9 +13,9 @@
   var FocusLock__default = /*#__PURE__*/_interopDefaultLegacy(FocusLock);
   var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
   var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
-  var moment__default$1 = /*#__PURE__*/_interopDefaultLegacy(moment$1);
   var nlp__default = /*#__PURE__*/_interopDefaultLegacy(nlp);
   var plg__default = /*#__PURE__*/_interopDefaultLegacy(plg);
+  var moment__default$1 = /*#__PURE__*/_interopDefaultLegacy(moment$1);
 
   function _iterableToArrayLimit(r, l) {
     var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
@@ -201,7 +201,7 @@
   })(["display:inline-flex;svg{margin:0 4px;}"]);
   StyledButtonElement.displayName = "StyledButtonElement";
 
-  var _excluded$1C = ["children", "active", "variant", "size", "className"];
+  var _excluded$1B = ["children", "active", "variant", "size", "className"];
   /**
    * @component Button
    * @description
@@ -231,7 +231,7 @@
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? "medium" : _ref$size,
       className = _ref.className,
-      args = _objectWithoutProperties(_ref, _excluded$1C);
+      args = _objectWithoutProperties(_ref, _excluded$1B);
     return /*#__PURE__*/React__default["default"].createElement(StyledButton$2, _extends({
       className: classNames__default["default"]("c-btn", className, {
         "c-btn--contained": variant === "primary" || variant === "contained",
@@ -305,12 +305,12 @@
   AddCrossTinyIcon.displayName = "AddCrossTinyIcon";
   var AddCrossTinyIcon$1 = AddCrossTinyIcon;
 
-  var _excluded$1B = ["className", "disabled"];
+  var _excluded$1A = ["className", "disabled"];
   var GlobalAddButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var className = _ref.className,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      rest = _objectWithoutProperties(_ref, _excluded$1B);
+      rest = _objectWithoutProperties(_ref, _excluded$1A);
     return /*#__PURE__*/React__default["default"].createElement(StyledGlobalAddButton, _extends({
       ref: ref,
       variant: "contained",
@@ -348,12 +348,12 @@
   });
   StyledButtonGroup$1.displayName = "StyledButtonGroup";
 
-  var _excluded$1A = ["children", "className", "invalid"];
+  var _excluded$1z = ["children", "className", "invalid"];
   var ButtonGroup = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       className = _ref.className,
       invalid = _ref.invalid,
-      rest = _objectWithoutProperties(_ref, _excluded$1A);
+      rest = _objectWithoutProperties(_ref, _excluded$1z);
     return /*#__PURE__*/React__default["default"].createElement(StyledButtonGroup$1, _extends({
       ref: ref,
       className: classNames__default["default"]("c-btn-group", className),
@@ -378,11 +378,11 @@
   })(["border-top:1px solid var(--border-primary);margin:12px 16px;height:1px;"]);
   StyledListSeparator$1.displayName = "StyledListSeparator";
 
-  var _excluded$1z = ["children", "className"];
+  var _excluded$1y = ["children", "className"];
   var ListItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       className = _ref.className,
-      props = _objectWithoutProperties(_ref, _excluded$1z);
+      props = _objectWithoutProperties(_ref, _excluded$1y);
     return /*#__PURE__*/React__default["default"].createElement(StyledListItem$1, _extends({
       className: classNames__default["default"]("c-list-item", className),
       ref: ref,
@@ -391,21 +391,21 @@
   });
   ListItem.displayName = "ListItem";
 
-  var _excluded$1y = ["className"];
+  var _excluded$1x = ["className"];
   var ListSeparator = function ListSeparator(_ref) {
     var className = _ref.className,
-      props = _objectWithoutProperties(_ref, _excluded$1y);
+      props = _objectWithoutProperties(_ref, _excluded$1x);
     return /*#__PURE__*/React__default["default"].createElement(StyledListSeparator$1, _extends({
       className: classNames__default["default"]("c-list-separator", className)
     }, props));
   };
   ListSeparator.displayName = "ListSeparator";
 
-  var _excluded$1x = ["children", "className"];
+  var _excluded$1w = ["children", "className"];
   var _List = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       className = _ref.className,
-      props = _objectWithoutProperties(_ref, _excluded$1x);
+      props = _objectWithoutProperties(_ref, _excluded$1w);
     return /*#__PURE__*/React__default["default"].createElement(StyledList$1, _extends({
       className: className,
       ref: ref,
@@ -923,7 +923,7 @@
     return size === "big" && styled.css(["width:40px;"]);
   });
 
-  var _excluded$1w = ["children", "className", "variant", "size", "active"];
+  var _excluded$1v = ["children", "className", "variant", "size", "active"];
 
   // eslint-disable-next-line @typescript-eslint/no-empty-interface
 
@@ -953,7 +953,7 @@
       variant = _ref.variant,
       size = _ref.size,
       active = _ref.active,
-      args = _objectWithoutProperties(_ref, _excluded$1w);
+      args = _objectWithoutProperties(_ref, _excluded$1v);
     return /*#__PURE__*/React__default["default"].createElement(StyledIconButton$1, _extends({
       className: className,
       variant: variant,
@@ -8507,7 +8507,7 @@
   }, FontStyle, BoxSizingStyle);
   StyledBubble.displayName = "StyledBubble";
 
-  var _excluded$1v = ["children", "className", "innerRef", "style"];
+  var _excluded$1u = ["children", "className", "innerRef", "style"];
   var Bubble = function Bubble(_ref) {
     var children = _ref.children,
       className = _ref.className,
@@ -8515,7 +8515,7 @@
       innerRef = _ref$innerRef === void 0 ? null : _ref$innerRef,
       _ref$style = _ref.style,
       style = _ref$style === void 0 ? {} : _ref$style,
-      rest = _objectWithoutProperties(_ref, _excluded$1v);
+      rest = _objectWithoutProperties(_ref, _excluded$1u);
     return /*#__PURE__*/React__default["default"].createElement(StyledBubble, _extends({}, rest, {
       ref: innerRef,
       className: classNames__default["default"]("c-bubble", className),
@@ -8576,12 +8576,12 @@
   });
   StyledOverlay.displayName = "StyledOverlay";
 
-  var _excluded$1u = ["className", "disableBackgroundColor"];
+  var _excluded$1t = ["className", "disableBackgroundColor"];
   var Overlay = function Overlay(_ref) {
     var className = _ref.className,
       _ref$disableBackgroun = _ref.disableBackgroundColor,
       disableBackgroundColor = _ref$disableBackgroun === void 0 ? false : _ref$disableBackgroun,
-      rest = _objectWithoutProperties(_ref, _excluded$1u);
+      rest = _objectWithoutProperties(_ref, _excluded$1t);
     return /*#__PURE__*/React__default["default"].createElement(StyledOverlay, _extends({
       className: classNames__default["default"]("c-overlay", className),
       $disableBackgroundColor: disableBackgroundColor
@@ -8594,7 +8594,7 @@
     componentId: "sc-1hgjasy-0"
   })(["&[data-popper-reference-hidden]{display:none !important;pointer-events:none !important;}"]);
 
-  var _excluded$1t = ["children", "anchorEl", "open", "style", "transition", "placement", "strategy", "afterWrite"];
+  var _excluded$1s = ["children", "anchorEl", "open", "style", "transition", "placement", "strategy", "afterWrite"];
   var Popper = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       anchorEl = _ref.anchorEl,
@@ -8608,7 +8608,7 @@
       _ref$strategy = _ref.strategy,
       strategy = _ref$strategy === void 0 ? "absolute" : _ref$strategy,
       afterWrite = _ref.afterWrite,
-      rest = _objectWithoutProperties(_ref, _excluded$1t);
+      rest = _objectWithoutProperties(_ref, _excluded$1s);
     var _useState = React.useState(true),
       _useState2 = _slicedToArray(_useState, 2),
       exited = _useState2[0],
@@ -8755,7 +8755,7 @@
   };
   var LayerContext$1 = LayerContext;
 
-  var _excluded$1s = ["children", "onClose", "className", "style", "onKeyDown", "disableFocusLock", "disableScrollLock", "disableCloseOnEsc", "onClick"];
+  var _excluded$1r = ["children", "onClose", "className", "style", "onKeyDown", "disableFocusLock", "disableScrollLock", "disableCloseOnEsc", "onClick"];
   var returnFocus = {
     preventScroll: true
   };
@@ -8772,7 +8772,7 @@
       _ref$disableCloseOnEs = _ref.disableCloseOnEsc,
       disableCloseOnEsc = _ref$disableCloseOnEs === void 0 ? false : _ref$disableCloseOnEs,
       onClick = _ref.onClick,
-      rest = _objectWithoutProperties(_ref, _excluded$1s);
+      rest = _objectWithoutProperties(_ref, _excluded$1r);
     var innerRef = React.useRef(null);
     var handleRef = useForkRef(innerRef, ref);
     var _useLayerContext = useLayerContext(),
@@ -9083,7 +9083,7 @@
   });
   StyledTypography.displayName = "StyledTypography";
 
-  var _excluded$1r = ["variant", "as", "color", "italic", "tabularNums", "letterSpacing", "lineHeight", "align", "decoration", "transform", "overflow", "whitespace", "wordBreak", "weight", "className", "children"];
+  var _excluded$1q = ["variant", "as", "color", "italic", "tabularNums", "letterSpacing", "lineHeight", "align", "decoration", "transform", "overflow", "whitespace", "wordBreak", "weight", "className", "children"];
   var Typography = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$variant = _ref.variant,
       variant = _ref$variant === void 0 ? "Title 1" : _ref$variant,
@@ -9114,7 +9114,7 @@
       weight = _ref$weight === void 0 ? "regular" : _ref$weight,
       className = _ref.className,
       children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$1r);
+      props = _objectWithoutProperties(_ref, _excluded$1q);
     var Component = as || "div";
     return /*#__PURE__*/React__default["default"].createElement(StyledTypography, _extends({
       as: Component,
@@ -9137,13 +9137,13 @@
   });
   Typography.displayName = "Typography";
 
-  var _excluded$1q = ["title", "className", "leftElement", "rightElement"];
+  var _excluded$1p = ["title", "className", "leftElement", "rightElement"];
   var MenuHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var title = _ref.title,
       className = _ref.className,
       leftElement = _ref.leftElement,
       rightElement = _ref.rightElement,
-      props = _objectWithoutProperties(_ref, _excluded$1q);
+      props = _objectWithoutProperties(_ref, _excluded$1p);
     return /*#__PURE__*/React__default["default"].createElement(StyledMenuHeader, _extends({}, props, {
       className: classNames__default["default"]("c-menu-header", className),
       ref: ref
@@ -9168,11 +9168,11 @@
   });
   MenuHeader.displayName = "MenuHeader";
 
-  var _excluded$1p = ["children", "className"];
+  var _excluded$1o = ["children", "className"];
   var MenuFooter = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var children = _ref.children,
       className = _ref.className,
-      props = _objectWithoutProperties(_ref, _excluded$1p);
+      props = _objectWithoutProperties(_ref, _excluded$1o);
     return /*#__PURE__*/React__default["default"].createElement(StyledMenuFooter$1, _extends({}, props, {
       className: classNames__default["default"]("c-menu-footer", className),
       ref: ref
@@ -9180,14 +9180,14 @@
   });
   MenuFooter.displayName = "MenuFooter";
 
-  var _excluded$1o = ["children", "className", "separator"];
+  var _excluded$1n = ["children", "className", "separator"];
   var Breadcrumbs = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
     var _dimensions$width, _childDimensions$widt;
     var children = _ref.children,
       className = _ref.className,
       _ref$separator = _ref.separator,
       separator = _ref$separator === void 0 ? "/" : _ref$separator,
-      rest = _objectWithoutProperties(_ref, _excluded$1o);
+      rest = _objectWithoutProperties(_ref, _excluded$1n);
     var internalRef = React.useRef(null);
     var listWrapperRef = React.useRef(null);
     var olRef = React.useRef(null);
@@ -9365,12 +9365,12 @@
     }, value && value > 100 ? 99 + "+" : value);
   };
 
-  var _excluded$1n = ["weight", "children"];
+  var _excluded$1m = ["weight", "children"];
   var Body2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _ref$weight = _ref.weight,
       weight = _ref$weight === void 0 ? "regular" : _ref$weight,
       children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$1n);
+      props = _objectWithoutProperties(_ref, _excluded$1m);
     return /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
       variant: "Body 2",
       weight: weight,
@@ -9480,10 +9480,10 @@
   };
   FromElement.displayName = "FromElement";
 
-  var _excluded$1m = ["children"];
+  var _excluded$1l = ["children"];
   var TooltipAnimation = function TooltipAnimation(_ref) {
     var children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$1m);
+      props = _objectWithoutProperties(_ref, _excluded$1l);
     return /*#__PURE__*/React__default["default"].createElement(FromElement, _extends({
       timeout: 0
     }, props), children);
@@ -9558,7 +9558,7 @@
   });
   Tooltip.displayName = "Tooltip";
 
-  var _excluded$1l = ["label", "icon", "active", "counter", "tooltipText", "onClearAll", "className", "labelClassName", "disabled"];
+  var _excluded$1k = ["label", "icon", "active", "counter", "tooltipText", "onClearAll", "className", "labelClassName", "disabled"];
   var CounterButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var label = _ref.label,
       icon = _ref.icon,
@@ -9571,7 +9571,7 @@
       labelClassName = _ref.labelClassName,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      args = _objectWithoutProperties(_ref, _excluded$1l);
+      args = _objectWithoutProperties(_ref, _excluded$1k);
     return /*#__PURE__*/React__default["default"].createElement(StyledCounterButtonWrapper, {
       ref: ref,
       className: className
@@ -9682,620 +9682,6 @@
   StyledButton$1.displayName = "StyledButton";
   StyledControl.displayName = "StyledControl";
 
-  // default modifiers
-  var customClassNames = {
-    root: "c-DayPicker",
-    interactionDisabled: "c-DayPicker--interactionDisabled",
-    ///// da li treba?
-    months: "c-DayPicker-Months",
-    month: "c-DayPicker-Wrapper",
-    table: "c-DayPicker-Month",
-    nav: "c-DayPicker-NavBar",
-    nav_button_previous: "c-DayPicker-NavButton DayPicker-NavButton--prev",
-    nav_button_next: "c-DayPicker-NavButton DayPicker-NavButton--next",
-    navButtonInteractionDisabled: "c-DayPicker-NavButton--interactionDisabled",
-    ///// da li treba?
-
-    caption: "c-DayPicker-Caption",
-    head: "c-DayPicker-Weekdays",
-    head_row: "c-DayPicker-WeekdaysRow",
-    head_cell: "c-DayPicker-Weekday",
-    tbody: "c-DayPicker-Body",
-    row: "c-DayPicker-Week",
-    day: "c-DayPicker-Day",
-    tfoot: "c-DayPicker-Footer",
-    day_today: "c-DayPicker-Day--today",
-    day_selected: "c-DayPicker-Day--selected selected-day selected",
-    day_disabled: "c-DayPicker-Day--disabled",
-    day_outside: "c-DayPicker-Day--outside"
-  };
-
-  // custom modifiers
-  var modifiersClassNames = {
-    weekend: "c-DayPicker-Day--weekend",
-    userAvailability: "c-DayPicker-Day--userAvailability",
-    nonWorkingDaysOfWeek: "c-DayPicker-Day--nonWorkingDaysOfWeek",
-    nonWorkingDay: "c-DayPicker-Day--nonWorkingDay",
-    hovered: "hover hovered hovered-day",
-    day_disabled: "c-DayPicker-Day--disabled"
-  };
-
-  var StyledNavBarButton = styled__default["default"](Button).withConfig({
-    displayName: "Styles__StyledNavBarButton",
-    componentId: "sc-1owijsg-0"
-  })(["position:absolute;margin-top:1px;cursor:pointer;z-index:2;background-image:none;", " ", ""], function (props) {
-    return props.$direction === "previous" && styled.css(["right:auto;left:1px;"]);
-  }, function (props) {
-    return props.$direction === "next" && styled.css(["right:1px;"]);
-  });
-  var StyledMonths = styled__default["default"].div.withConfig({
-    displayName: "Styles__StyledMonths",
-    componentId: "sc-1owijsg-1"
-  })(["top:30px;height:230px;", ""], {
-    "position": "absolute",
-    "left": "0px",
-    "zIndex": "10",
-    "display": "flex",
-    "flexWrap": "wrap",
-    "backgroundColor": "var(--page-paper-main)",
-    "padding": "1.25rem"
-  });
-  var StyledMonth = styled__default["default"].div.withConfig({
-    displayName: "Styles__StyledMonth",
-    componentId: "sc-1owijsg-2"
-  })(["width:26%;transition-duration:0.3s;", " ", " ", " ", " ", ""], {
-    "margin": "auto",
-    "cursor": "pointer",
-    "borderRadius": "1rem",
-    "fontSize": "0.875rem",
-    "lineHeight": "1.25rem",
-    "fontWeight": "700"
-  }, function (props) {
-    return !props.$isSelected ? styled.css(["&:hover{background-color:var(--color-primary-300);}"]) : styled.css(["", " background-color:var(--color-primary);"], {
-      "color": "var(--color-theme-100)"
-    });
-  }, function (props) {
-    return props.$isCurrent && !props.$isSelected && styled.css(["", ""], {
-      "color": "var(--color-primary)"
-    });
-  }, function (props) {
-    return props.$isCurrent && props.$isSelected && styled.css(["color:var(--color-theme-100);"]);
-  }, function (props) {
-    return props.$isCurrentQuarter && styled.css(["background-color:var(--color-primary-300);"]);
-  });
-  var StyledYearMonthPicker = styled__default["default"].div.withConfig({
-    displayName: "Styles__StyledYearMonthPicker",
-    componentId: "sc-1owijsg-3"
-  })(["display:table-caption;margin-bottom:0.5rem;padding:0 0.5rem;", " &> div{font-weight:500;font-size:1.15rem;}"], {
-    "textAlign": "center",
-    "color": "var(--color-theme-900)"
-  });
-  var StyledYearMonthPickerNavBar = styled__default["default"].div.withConfig({
-    displayName: "Styles__StyledYearMonthPickerNavBar",
-    componentId: "sc-1owijsg-4"
-  })(["width:auto;margin:0 auto;"]);
-  var StyledYearMonthPickerNavBarItem = styled__default["default"].span.withConfig({
-    displayName: "Styles__StyledYearMonthPickerNavBarItem",
-    componentId: "sc-1owijsg-5"
-  })(["", " transition-duration:0.3s;display:inline-block;&:hover{background-color:var(--color-primary-300);border-radius:15px;}"], {
-    "cursor": "pointer",
-    "paddingLeft": "1rem",
-    "paddingRight": "1rem"
-  });
-  StyledNavBarButton.displayName = "StyledNavBarButton";
-  StyledMonths.displayName = "StyledMonths";
-  StyledMonth.displayName = "StyledMonth";
-
-  var NavBarElement = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-    var onPreviousClick = _ref.onPreviousClick,
-      onNextClick = _ref.onNextClick;
-    var onPrevious = React.useCallback(function () {
-      onPreviousClick();
-    }, [onPreviousClick]);
-    var onNext = React.useCallback(function () {
-      onNextClick();
-    }, [onNextClick]);
-    return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "c-DayPicker-NavBar",
-      ref: ref,
-      tabIndex: 0
-    }, /*#__PURE__*/React__default["default"].createElement(StyledNavBarButton, {
-      type: "button",
-      variant: "text gray",
-      size: "small",
-      tabIndex: 0,
-      onClick: onPrevious,
-      $direction: "previous"
-    }, /*#__PURE__*/React__default["default"].createElement(ArrowLeftIcon$1, {
-      "aria-label": "Previous Month",
-      width: "24",
-      height: "24"
-    })), /*#__PURE__*/React__default["default"].createElement(StyledNavBarButton, {
-      type: "button",
-      variant: "text gray",
-      size: "small",
-      tabIndex: 0,
-      onClick: onNext,
-      $direction: "next"
-    }, /*#__PURE__*/React__default["default"].createElement(ArrowRightIcon$1, {
-      "aria-label": "Next Month",
-      width: "24",
-      height: "24"
-    })));
-  });
-  NavBarElement.displayName = "NavBarElement";
-
-  var CustomNavBarElement = function CustomNavBarElement(_ref) {
-    var month = _ref.month,
-      _ref$showMonthPicker = _ref.showMonthPicker,
-      showMonthPicker = _ref$showMonthPicker === void 0 ? false : _ref$showMonthPicker,
-      onChangeDirection = _ref.onChangeDirection,
-      onMonthChange = _ref.onMonthChange;
-    var nextMonth = showMonthPicker ? dateFns.addMonths(month, 12) : dateFns.addMonths(month, 1);
-    var previousMonth = showMonthPicker ? dateFns.addMonths(month, -12) : dateFns.addMonths(month, -1);
-    var onNextClick = React.useCallback(function () {
-      if (onChangeDirection) {
-        onChangeDirection(true);
-      }
-      if (onMonthChange) {
-        onMonthChange(nextMonth);
-      }
-    }, [nextMonth, onChangeDirection, onMonthChange]);
-    var onPreviousClick = React.useCallback(function () {
-      if (onChangeDirection) {
-        onChangeDirection(false);
-      }
-      if (onMonthChange) {
-        onMonthChange(previousMonth);
-      }
-    }, [onChangeDirection, onMonthChange, previousMonth]);
-    return /*#__PURE__*/React__default["default"].createElement(NavBarElement, {
-      onNextClick: onNextClick,
-      onPreviousClick: onPreviousClick
-    });
-  };
-
-  var StyledDatePicker = styled__default["default"].div.withConfig({
-    displayName: "Styles__StyledDatePicker",
-    componentId: "sc-18towna-0"
-  })(["", " ", " overflow:hidden;min-width:230px;", ""], FontStyle, BoxSizingStyle, {
-    "display": "flex",
-    "justifyContent": "center"
-  });
-  var StyledDayPicker = styled__default["default"](reactDayPicker.DayPicker).withConfig({
-    displayName: "Styles__StyledDayPicker",
-    componentId: "sc-18towna-1"
-  })(["", " width:230px;.root{--rdp-cell-size:40px;--rdp-caption-font-size:18px;--rdp-accent-color:#0000ff;--rdp-background-color:#e7edff;--rdp-accent-color-dark:#3003e1;--rdp-background-color-dark:#180270;--rdp-outline:2px solid var(--rdp-accent-color);--rdp-outline-selected:3px solid var(--rdp-accent-color);--rdp-selected-color:#fff;margin:1em;}.rdp-vhidden{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:absolute !important;top:0;width:1px !important;height:1px !important;padding:0 !important;overflow:hidden !important;clip:rect(1px,1px,1px,1px) !important;border:0 !important;}.rdp-button_reset{appearance:none;position:relative;margin:0;padding:0;cursor:default;color:inherit;background:none;font:inherit;-moz-appearance:none;-webkit-appearance:none;}.rdp-button_reset:focus-visible{outline:none;}.rdp-button{border:2px solid transparent;}.rdp-button[disabled]:not(.rdp-day_selected){opacity:0.25;}.rdp-button:not([disabled]){cursor:pointer;}.rdp-button:focus-visible:not([disabled]){color:inherit;background-color:var(--rdp-background-color);border:var(--rdp-outline);}.rdp-months{display:flex;}.rdp-month{margin:0 1em;}.rdp-month:first-child{margin-left:0;}.rdp-month:last-child{margin-right:0;}.rdp-table{margin:0;max-width:calc(var(--rdp-cell-size) * 7);border-collapse:collapse;}.rdp-with_weeknumber .table{max-width:calc(var(--rdp-cell-size) * 8);border-collapse:collapse;}.rdp-caption{display:flex;align-items:center;justify-content:space-between;padding:0;text-align:left;}.rdp-multiple_months .rdp-caption{position:relative;display:block;text-align:center;}.rdp-caption_dropdowns{position:relative;display:inline-flex;}.rdp-caption_label{position:relative;z-index:1;display:inline-flex;align-items:center;margin:0;padding:0 0.25em;white-space:nowrap;color:currentColor;border:0;border:2px solid transparent;font-family:inherit;font-size:var(--rdp-caption-font-size);font-weight:bold;}.rdp-nav{white-space:nowrap;}.rdp-multiple_months .rdp-caption_start .rdp-nav{position:absolute;top:50%;left:0;transform:translateY(-50%);}.rdp-multiple_months .rdp-caption_end .rdp-nav{position:absolute;top:50%;right:0;transform:translateY(-50%);}.rdp-nav_button{display:inline-flex;align-items:center;justify-content:center;width:var(--rdp-cell-size);height:var(--rdp-cell-size);padding:0.25em;border-radius:100%;}.rdp-dropdown_year,.rdp-dropdown_month{position:relative;display:inline-flex;align-items:center;}.rdp-dropdown{appearance:none;position:absolute;z-index:2;top:0;bottom:0;left:0;width:100%;margin:0;padding:0;cursor:inherit;opacity:0;border:none;background-color:transparent;font-family:inherit;font-size:inherit;line-height:inherit;}.rdp-dropdown[disabled]{opacity:unset;color:unset;}.rdp-dropdown:focus-visible:not([disabled]) + .rdp-caption_label{background-color:var(--rdp-background-color);border:var(--rdp-outline);border-radius:6px;}.rdp-dropdown_icon{margin:0 0 0 5px;}.rdp-head{border:0;}.rdp-head_row,.rdp-row{height:100%;}.rdp-head_cell{vertical-align:middle;font-size:0.75em;font-weight:700;text-align:center;height:100%;height:var(--rdp-cell-size);padding:0;text-transform:uppercase;}.rdp-tbody{border:0;}.rdp-tfoot{margin:0.5em;}.rdp-cell{width:var(--rdp-cell-size);height:100%;height:var(--rdp-cell-size);padding:0;text-align:center;}.rdp-weeknumber{font-size:0.75em;}.rdp-weeknumber,.rdp-day{display:flex;overflow:hidden;align-items:center;justify-content:center;box-sizing:border-box;width:var(--rdp-cell-size);max-width:var(--rdp-cell-size);height:var(--rdp-cell-size);margin:0;border:2px solid transparent;border-radius:100%;}.rdp-day_today:not(.rdp-day_outside){font-weight:bold;}.rdp-day_selected,.rdp-day_selected:focus-visible{color:var(--rdp-selected-color);opacity:1;background-color:var(--rdp-accent-color);}.rdp-day_outside{opacity:0.5;}.rdp-day_selected:focus-visible{outline:var(--rdp-outline);outline-offset:2px;z-index:1;}.root:not([dir=\"rtl\"]) .rdp-day_range_start:not(.rdp-day_range_end){border-top-right-radius:0;border-bottom-right-radius:0;}.root:not([dir=\"rtl\"]) .rdp-day_range_end:not(.rdp-day_range_start){border-top-left-radius:0;border-bottom-left-radius:0;}.root[dir=\"rtl\"] .rdp-day_range_start:not(.rdp-day_range_end){border-top-left-radius:0;border-bottom-left-radius:0;}.root[dir=\"rtl\"] .rdp-day_range_end:not(.rdp-day_range_start){border-top-right-radius:0;border-bottom-right-radius:0;}.rdp-day_range_end.rdp-day_range_start{border-radius:100%;}.rdp-day_range_middle{border-radius:0;}", " .c-DayPicker-Month{display:table;user-select:none;border-collapse:separate;border-spacing:4px;margin:0 auto;}.c-DayPicker-wrapper{display:flex;}.c-DayPicker-Wrapper{position:relative;flex-direction:row;user-select:none;width:100%;}.c-DayPicker-Caption{display:table-caption;margin-bottom:0.5em;padding:0 0.5em;width:100%;", "}.c-DayPicker-Weekday{font-size:11px;font-weight:normal;padding:0.5em;text-align:center;", "}.c-DayPicker-Body{display:table-row-group;font-size:13px;", "}.c-DayPicker-Day{display:flex;justify-content:center;align-items:center;border-radius:50%;cursor:pointer;transition-duration:0.3s;width:27px;height:27px;line-height:27px;}.c-DayPicker{display:inline-block;font-size:1rem;}.c-DayPicker-Months{display:flex;flex-wrap:wrap;justify-content:center;}.c-DayPicker-NavButton--interactionDisabled{display:none;}.c-DayPicker-Weekdays{text-decoration:none;display:table-header-group;margin-top:1em;}.c-DayPicker-WeekdaysRow{display:table-row;}.c-DayPicker-Week{display:table-row;}.c-DayPicker--interactionDisabled .c-DayPicker-Day{cursor:default;}.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ){background-color:var(--color-primary-300);color:var(--color-theme-900);}.c-DayPicker-Day--today{font-weight:700;color:var(--color-primary);position:relative;&:after{position:absolute;content:\"\";bottom:1px;height:3px;width:3px;border-radius:3px;margin:0 auto;left:0;right:0;background:var(--color-primary);}&.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ){color:var(--color-primary);&:after{background-color:var(--color-primary);}}}.c-DayPicker-Day--userAvailability,.c-DayPicker-Day--nonWorkingDaysOfWeek{color:var(--red-alert);&.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ){background-color:rgba(237,97,97,0.1);color:var(--red-alert);}&.c-DayPicker-Day--today{color:var(--red-alert);&:after{background-color:var(--red-alert);}&.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ):after{background-color:var(--red-alert);}}}.c-DayPicker-Day--selected.selected-day.selected{background-color:var(--color-primary);color:var(--color-theme-100);&.c-DayPicker-Day--today{color:var(--color-theme-100);&:after{background-color:var(--color-theme-100);}}&.c-DayPicker-Day--userAvailability,&.c-DayPicker-Day--nonWorkingDaysOfWeek{background-color:var(--red-alert);color:var(--color-theme-100);}}.c-DayPicker-Day--nonWorkingDay{color:var(--color-theme-500);&.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ){color:var(--color-theme-500);}&.c-DayPicker-Day--today{color:var(--color-primary-500);&:after{background-color:var(--color-primary-500);}&.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ){color:var(--color-theme-500);&:after{background-color:var(--color-theme-500);}}}&.c-DayPicker-Day--userAvailability,&.c-DayPicker-Day--nonWorkingDaysOfWeek{&.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ){color:var(--color-theme-500);background-color:var(--color-primary-300);&.c-DayPicker-Day--today:after{background-color:var(--color-theme-500);}}}&.c-DayPicker-Day--selected.selected-day.selected{color:rgba(255,255,255,0.6);background-color:var(--color-primary);.neon &{color:rgba(0,0,0,0.4);}&.c-DayPicker-Day--today{color:rgba(255,255,255,0.6);.neon &{color:rgba(0,0,0,0.4);}&:after{background-color:rgba(255,255,255,0.6);.neon &{background-color:rgba(0,0,0,0.4);}}}}}.c-DayPicker-Day--disabled{cursor:default;color:var(--color-theme-500);&.hovered.hovered-day.hover{color:var(--color-theme-500);}}.c-DayPicker-Day--outside{cursor:default;opacity:0.15;color:var(--color-theme-900);&.c-DayPicker-Day--userAvailability.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ),&.c-DayPicker-Day--nonWorkingDaysOfWeek.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ){background:var(--color-primary-300);}&.c-DayPicker-Day--userAvailability:not( .c-DayPicker-Day--selected.selected-day.selected ),&.c-DayPicker-Day--nonWorkingDaysOfWeek:not( .c-DayPicker-Day--selected.selected-day.selected ),&.c-DayPicker-Day--userAvailability.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ),&.c-DayPicker-Day--nonWorkingDaysOfWeek.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ),&.c-DayPicker-Day--nonWorkingDay.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ),&.c-DayPicker-Day--nonWorkingDay:not( .c-DayPicker-Day--selected.selected-day.selected ),&.c-DayPicker-Day--today.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ),&.c-DayPicker-Day--today:not( .c-DayPicker-Day--selected.selected-day.selected ){color:var(--color-theme-900);}&.c-DayPicker-Day--userAvailability.c-DayPicker-Day--today:not( .c-DayPicker-Day--selected.selected-day.selected ):after,&.c-DayPicker-Day--nonWorkingDaysOfWeek.c-DayPicker-Day--today:not( .c-DayPicker-Day--selected.selected-day.selected ):after,&.c-DayPicker-Day--userAvailability.c-DayPicker-Day--today.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ):after,&.c-DayPicker-Day--nonWorkingDaysOfWeek.c-DayPicker-Day--today.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ):after,&.c-DayPicker-Day--nonWorkingDay.c-DayPicker-Day--today:not( .c-DayPicker-Day--selected.selected-day.selected ):after,&.c-DayPicker-Day--nonWorkingDay.c-DayPicker-Day--today.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ):after,&.c-DayPicker-Day--today.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ):after,&.c-DayPicker-Day--today:not( .c-DayPicker-Day--selected.selected-day.selected ):after{background-color:var(--color-theme-900);}&.hovered.hovered-day.hover:not( .c-DayPicker-Day--selected.selected-day.selected ){background:var(--color-primary-400);}&.c-DayPicker-Day--selected.selected-day.selected{color:var(--page-paper-main);background:var(--color-primary);.neon &{color:var(--page-paper-main);}&.c-DayPicker-Day--today{&:after{background:var(--page-paper-main);.neon &{background:var(--page-paper-main);}}&.c-DayPicker-Day--nonWorkingDay{color:var(--page-paper-main);.neon &{color:var(--page-paper-main);}}}}}"], {
-    "backgroundColor": "var(--page-paper-main)"
-  }, function (props) {
-    return props.$isYearlyView && styled.css([".c-DayPicker-Weekdays,.c-DayPicker-Body{opacity:0 !important;}"]);
-  }, {
-    "textAlign": "center",
-    "color": "var(--color-theme-900)"
-  }, {
-    "color": "var(--color-theme-600)"
-  }, {
-    "fontWeight": "700",
-    "color": "var(--color-theme-900)"
-  });
-  var StyledDatePickerCSSTransition = styled__default["default"](reactTransitionGroup.CSSTransition).withConfig({
-    displayName: "Styles__StyledDatePickerCSSTransition",
-    componentId: "sc-18towna-2"
-  })(["", ""], function (props) {
-    return props.$direction ? styled.css(["&.c-date-picker__animation-enter{.c-DayPicker-Caption,.c-DayPicker-Body{opacity:0;transform:translateY(-20px);}}&.c-date-picker__animation-enter-active{.c-DayPicker-Caption,.c-DayPicker-Body{opacity:1;transform:translateY(0px);transition-duration:300ms;}}&.c-date-picker__animation-exit{.c-DayPicker-Caption,.c-DayPicker-Body{opacity:1;}}&.c-date-picker__animation-exit-active{.c-DayPicker-Caption,.c-DayPicker-Body{opacity:0;transform:translateY(20px);transition-duration:300ms;}}"]) : styled.css(["&.c-date-picker__animation-enter{.c-DayPicker-Caption,.c-DayPicker-Body{opacity:0;transform:translateY(20px);}}&.c-date-picker__animation-enter-active{.c-DayPicker-Caption,.c-DayPicker-Body{opacity:1;transform:translateY(0px);transition-duration:300ms;}}&.c-date-picker__animation-exit{.c-DayPicker-Caption,.c-DayPicker-Body{opacity:1;}}&.c-date-picker__animation-exit-active{.c-DayPicker-Caption,.c-DayPicker-Body{opacity:0;transform:translateY(-20px);transition-duration:300ms;}}"]);
-  });
-  StyledDatePickerCSSTransition.displayName = "StyledDatePickerCSSTransition";
-  StyledDatePicker.displayName = "StyledDatePicker";
-  StyledDayPicker.displayName = "StyledDayPicker";
-
-  var YearMonthPicker = function YearMonthPicker(_ref) {
-    var month = _ref.month,
-      _ref$onChange = _ref.onChange,
-      onChange = _ref$onChange === void 0 ? function () {
-        return null;
-      } : _ref$onChange,
-      _ref$isShown = _ref.isShown,
-      isShown = _ref$isShown === void 0 ? true : _ref$isShown,
-      onClick = _ref.onClick,
-      text = _ref.text,
-      selectedDays = _ref.selectedDays,
-      selectionMode = _ref.selectionMode;
-    var _useState = React.useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      enteredTo = _useState2[0],
-      setEnteredTo = _useState2[1];
-    var currentYear = dateFns.getYear(new Date());
-    var months = Array.from({
-      length: 12
-    }, function (_, i) {
-      return dateFns.format(new Date(currentYear, i, 1), "MMMM");
-    });
-    var handleMonthChange = React.useCallback(function (e) {
-      onChange(new Date(dateFns.getYear(month), e.target.dataset.value));
-      if (onClick) {
-        onClick(e);
-      }
-    }, [month, onChange, onClick]);
-    var onMouseEnterCallback = React.useCallback(function (e) {
-      if (selectionMode === "quarterly") {
-        setEnteredTo(Math.floor(e.target.getAttribute("data-value") / 3));
-      }
-    }, [selectionMode]);
-    var renderMonths = React.useMemo(function () {
-      return /*#__PURE__*/React__default["default"].createElement(StyledMonths, {
-        className: "c-monthPicker",
-        "data-test": "months"
-      }, months.map(function (singleMonth, i) {
-        return /*#__PURE__*/React__default["default"].createElement(StyledMonth, {
-          className: "c-monthPicker__month",
-          key: i,
-          onClick: handleMonthChange,
-          onMouseEnter: onMouseEnterCallback,
-          "data-value": i,
-          "data-test": "month",
-          $isCurrent: month.getFullYear() === new Date().getFullYear() && new Date().getMonth() === i,
-          $isCurrentQuarter: Math.floor(i / 3) === enteredTo,
-          $isSelected: selectedDays && !(selectedDays instanceof Date) && selectedDays.from && selectedDays.to && selectedDays.from.getFullYear() === dateFns.getYear(month) && i >= dateFns.getMonth(selectedDays.from) && i <= dateFns.getMonth(selectedDays.to)
-        }, singleMonth.substring(0, 3));
-      }));
-    }, [months, handleMonthChange, onMouseEnterCallback, enteredTo, selectedDays, month]);
-    return /*#__PURE__*/React__default["default"].createElement(StyledYearMonthPicker, {
-      className: "c-DayPicker-Caption",
-      role: "button"
-    }, /*#__PURE__*/React__default["default"].createElement(StyledYearMonthPickerNavBar, {
-      role: "button"
-    }, /*#__PURE__*/React__default["default"].createElement(StyledYearMonthPickerNavBarItem, {
-      "data-test": "show-picker",
-      onClick: onClick
-    }, text)), isShown && renderMonths);
-  };
-  YearMonthPicker.displayName = "YearMonthPicker";
-
-  var _excluded$1k = ["className", "onChange", "onDayClick", "selectedDays", "disabledDays", "selectionMode", "month", "onMonthChange", "dateRequired", "firstDayOfWeek", "fixedWeeks", "modifiers", "renderDay"];
-  var formatWeekdayName = function formatWeekdayName(str) {
-    return moment__default["default"](str).format("ddd").charAt(0);
-  };
-  var DatePicker = function DatePicker(_ref) {
-    var className = _ref.className,
-      onChange = _ref.onChange,
-      onDayClick = _ref.onDayClick,
-      selectedDays = _ref.selectedDays,
-      disabledDays = _ref.disabledDays,
-      _ref$selectionMode = _ref.selectionMode,
-      selectionMode = _ref$selectionMode === void 0 ? "daily" : _ref$selectionMode,
-      _ref$month = _ref.month,
-      month = _ref$month === void 0 ? new Date() : _ref$month,
-      _ref$onMonthChange = _ref.onMonthChange,
-      onMonthChange = _ref$onMonthChange === void 0 ? function () {
-        return null;
-      } : _ref$onMonthChange,
-      _ref$dateRequired = _ref.dateRequired,
-      dateRequired = _ref$dateRequired === void 0 ? false : _ref$dateRequired,
-      _ref$firstDayOfWeek = _ref.firstDayOfWeek,
-      firstDayOfWeek = _ref$firstDayOfWeek === void 0 ? 0 : _ref$firstDayOfWeek,
-      _ref$fixedWeeks = _ref.fixedWeeks,
-      fixedWeeks = _ref$fixedWeeks === void 0 ? true : _ref$fixedWeeks,
-      defaultModifiers = _ref.modifiers,
-      renderDay = _ref.renderDay,
-      rest = _objectWithoutProperties(_ref, _excluded$1k);
-    var _useState = React.useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      enteredTo = _useState2[0],
-      setEnteredTo = _useState2[1];
-    var _useState3 = React.useState(),
-      _useState4 = _slicedToArray(_useState3, 2),
-      enteredFrom = _useState4[0],
-      setEnteredFrom = _useState4[1];
-    var _useState5 = React.useState(),
-      _useState6 = _slicedToArray(_useState5, 2),
-      stopScroll = _useState6[0],
-      setStopScroll = _useState6[1];
-    var _useState7 = React.useState(true),
-      _useState8 = _slicedToArray(_useState7, 2),
-      direction = _useState8[0],
-      setDirection = _useState8[1];
-    var _useState9 = React.useState(function () {
-        return (selectedDays === null || selectedDays === void 0 ? void 0 : selectedDays.from) instanceof Date && (selectedDays === null || selectedDays === void 0 ? void 0 : selectedDays.to) instanceof Date;
-      }),
-      _useState10 = _slicedToArray(_useState9, 2),
-      isPreselected = _useState10[0],
-      setIsPreselected = _useState10[1];
-    var _useState11 = React.useState(selectionMode === "quarterly" || selectionMode === "monthly"),
-      _useState12 = _slicedToArray(_useState11, 2),
-      showMonthPicker = _useState12[0],
-      setShowMonthPicker = _useState12[1];
-    var _useState13 = React.useState(defaultModifiers),
-      _useState14 = _slicedToArray(_useState13, 2),
-      modifiers = _useState14[0],
-      setModifiers = _useState14[1];
-    var week = firstDayOfWeek === 0 ? "week" : "isoWeek";
-    React.useEffect(function () {
-      if (enteredFrom instanceof Date && enteredTo instanceof Date) {
-        setModifiers(function (prev) {
-          return _objectSpread2(_objectSpread2({}, prev), {}, {
-            hovered: {
-              from: enteredFrom,
-              to: enteredTo
-            }
-          });
-        });
-      } else {
-        setModifiers(defaultModifiers);
-      }
-    }, [enteredTo, enteredFrom, defaultModifiers]);
-    var handleDayClick = React.useCallback(function (day, modifiers) {
-      if (onDayClick) {
-        onDayClick(day, modifiers);
-      }
-      if (!onChange) {
-        return;
-      }
-      if (month.getMonth() !== day.getMonth()) {
-        onMonthChange(day);
-      }
-      if (modifiers["day_disabled"] || selectionMode === "none") {
-        return;
-      }
-      // reset the selectedDays if the user clicks on the same day
-      if (!dateRequired && (selectedDays !== null && selectedDays !== void 0 && selectedDays.from && moment__default["default"](day).isSame(moment__default["default"](selectedDays.from), "day") || selectedDays !== null && selectedDays !== void 0 && selectedDays.to && moment__default["default"](day).isSame(moment__default["default"](selectedDays.to), "day"))) {
-        setEnteredTo(undefined);
-        setEnteredFrom(undefined);
-        return onChange(undefined);
-      }
-      if (selectionMode === "daily") {
-        return onChange({
-          from: day,
-          to: day
-        });
-      }
-      if (selectionMode === "weekly") {
-        if (!dateRequired && selectedDays !== null && selectedDays !== void 0 && selectedDays.from && moment__default["default"](day).isSame(moment__default["default"](selectedDays.from), week)) {
-          return onChange(undefined);
-        }
-        return onChange({
-          from: moment__default["default"](day).startOf(week).toDate(),
-          to: moment__default["default"](day).endOf(week).toDate()
-        });
-      }
-      if (selectionMode === "custom") {
-        if (isPreselected) {
-          setIsPreselected(false);
-          return onChange({
-            from: day,
-            to: day
-          });
-        }
-        if (!selectedDays || selectedDays !== null && selectedDays !== void 0 && selectedDays.from && selectedDays !== null && selectedDays !== void 0 && selectedDays.to && !moment__default["default"](selectedDays.from).isSame(moment__default["default"](selectedDays.to))) {
-          if (!dateRequired && selectedDays !== null && selectedDays !== void 0 && selectedDays.from && selectedDays !== null && selectedDays !== void 0 && selectedDays.to && moment__default["default"](day).isBetween(moment__default["default"](selectedDays.from), moment__default["default"](selectedDays.to))) {
-            setEnteredTo(day);
-            setEnteredFrom(day);
-            return onChange(undefined);
-          }
-          setEnteredFrom(day);
-          return onChange({
-            from: day,
-            to: day
-          });
-        }
-        if (selectedDays !== null && selectedDays !== void 0 && selectedDays.from && dateFns.isAfter(day, selectedDays.from)) {
-          setEnteredTo(undefined);
-          setEnteredFrom(undefined);
-          return onChange({
-            from: selectedDays.from,
-            to: day
-          });
-        }
-        if (selectedDays !== null && selectedDays !== void 0 && selectedDays.to) {
-          setEnteredTo(undefined);
-          setEnteredFrom(undefined);
-          return onChange({
-            from: day,
-            to: selectedDays.to
-          });
-        }
-        return onChange({
-          from: day,
-          to: day
-        });
-      }
-    }, [onDayClick, onChange, month, selectionMode, dateRequired, selectedDays, onMonthChange, week, isPreselected]);
-    var isSelectedFirstDay = React.useCallback(function () {
-      if (selectionMode !== "custom") {
-        return false;
-      }
-      if (selectedDays !== null && selectedDays !== void 0 && selectedDays.from && selectedDays !== null && selectedDays !== void 0 && selectedDays.to) {
-        return moment__default["default"](selectedDays.from).isSame(selectedDays.to);
-      }
-    }, [selectionMode, selectedDays]);
-    var handleDayMouseEnter = React.useCallback(function (day) {
-      if (isPreselected && selectionMode !== "weekly") {
-        setEnteredTo(day);
-        setEnteredFrom(day);
-        return;
-      }
-      if (selectionMode === "daily") {
-        setEnteredTo(day);
-        setEnteredFrom(day);
-      }
-      if (selectionMode === "weekly") {
-        setEnteredFrom(moment__default["default"](day).startOf(week).toDate());
-        setEnteredTo(moment__default["default"](day).endOf(week).toDate());
-      }
-      if (selectionMode !== "weekly" && (!selectedDays || selectedDays !== null && selectedDays !== void 0 && selectedDays.from && selectedDays !== null && selectedDays !== void 0 && selectedDays.to && !moment__default["default"](selectedDays.from).isSame(moment__default["default"](selectedDays.to)))) {
-        setEnteredTo(day);
-        setEnteredFrom(day);
-      }
-      if (isSelectedFirstDay() && selectedDays !== null && selectedDays !== void 0 && selectedDays.from) {
-        setEnteredFrom(selectedDays.from);
-        setEnteredTo(day);
-      }
-    }, [selectionMode, isSelectedFirstDay, selectedDays, week, isPreselected]);
-    var onDayMouseLeave = React.useCallback(function () {
-      if (selectionMode === "weekly" || selectionMode === "daily" || selectionMode === "custom") {
-        setEnteredFrom(undefined);
-        setEnteredTo(undefined);
-      }
-    }, [setEnteredFrom, setEnteredTo, selectionMode]);
-    var onWheel = React.useCallback(function (e) {
-      if (stopScroll && (new Date().getTime() - stopScroll.getTime()) / 1000 < 0.9) {
-        return;
-      }
-      var nextMonth = showMonthPicker ? dateFns.addMonths(month, 12) : dateFns.addMonths(month, 1);
-      var previousMonth = showMonthPicker ? dateFns.addMonths(month, -12) : dateFns.addMonths(month, -1);
-      if (e.deltaY > 0.9) {
-        setDirection(true);
-        onMonthChange(nextMonth);
-        setStopScroll(new Date());
-      }
-      if (e.deltaY < -0.9) {
-        setDirection(false);
-        onMonthChange(previousMonth);
-        setStopScroll(new Date());
-      }
-    }, [stopScroll, showMonthPicker, month, onMonthChange]);
-    var togglePicker = React.useCallback(function () {
-      if (selectionMode !== "monthly" && selectionMode !== "quarterly") {
-        return setShowMonthPicker(!showMonthPicker);
-      }
-      setShowMonthPicker(true);
-    }, [showMonthPicker, selectionMode]);
-    var handleYearMonthChange = React.useCallback(function (m) {
-      if (onChange) {
-        if (selectionMode === "monthly") {
-          if (!dateRequired && selectedDays !== null && selectedDays !== void 0 && selectedDays.from && moment__default["default"](m).isSame(moment__default["default"](selectedDays.from), "month")) {
-            return onChange(undefined);
-          }
-          onChange({
-            from: moment__default["default"](m).startOf("month").toDate(),
-            to: moment__default["default"](m).endOf("month").toDate()
-          });
-        }
-        if (selectionMode === "quarterly") {
-          if (!dateRequired && selectedDays !== null && selectedDays !== void 0 && selectedDays.from && moment__default["default"](m).isSame(moment__default["default"](selectedDays.from).startOf("quarter"), "quarter")) {
-            return onChange(undefined);
-          }
-          onChange({
-            from: moment__default["default"](m).startOf("quarter").toDate(),
-            to: moment__default["default"](m).endOf("quarter").toDate()
-          });
-        }
-      }
-      onMonthChange(m);
-    }, [onMonthChange, onChange, selectedDays, selectionMode, dateRequired]);
-    var text = React.useMemo(function () {
-      if (showMonthPicker) {
-        return "".concat(month.getFullYear());
-      }
-      return "".concat(moment__default["default"](month).format("MMMM"), " ").concat(moment__default["default"](month).isSame(moment__default["default"](), "year") ? "" : month.getFullYear());
-    }, [showMonthPicker, month]);
-    var customNavBarElement = React.useCallback(function (props) {
-      return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "c-DayPicker-wrapper"
-      }, /*#__PURE__*/React__default["default"].createElement(CustomNavBarElement, _extends({}, props, {
-        showMonthPicker: showMonthPicker,
-        month: month,
-        onChangeDirection: setDirection,
-        onMonthChange: onMonthChange,
-        onClick: togglePicker
-      })), /*#__PURE__*/React__default["default"].createElement(YearMonthPicker, _extends({}, props, {
-        text: text,
-        onClick: togglePicker,
-        month: month,
-        selectedDays: selectedDays,
-        onChange: handleYearMonthChange,
-        isShown: showMonthPicker,
-        selectionMode: selectionMode
-      })));
-    }, [showMonthPicker, month, onMonthChange, togglePicker, text, selectedDays, handleYearMonthChange, selectionMode]);
-    var onKeyDownCallback = React.useCallback(function (e) {
-      // Right Arrow
-      if (e.key === "ArrowRight") {
-        setDirection(true);
-        if (showMonthPicker) {
-          onMonthChange(new Date(month.getFullYear() + 1, month.getMonth()));
-        } else {
-          onMonthChange(new Date(month.getFullYear(), month.getMonth() + 1));
-        }
-      }
-      // Left Arrow
-      if (e.key === "ArrowLeft") {
-        setDirection(false);
-        if (showMonthPicker) {
-          onMonthChange(new Date(month.getFullYear() - 1, month.getMonth()));
-        } else {
-          onMonthChange(new Date(month.getFullYear(), month.getMonth() - 1));
-        }
-      }
-      // Up Arrow
-      if (e.key === "ArrowUp") {
-        setDirection(true);
-        onMonthChange(new Date(month.getFullYear() + 1, month.getMonth()));
-      }
-      // Down Arrow
-      if (e.key === "ArrowDown") {
-        setDirection(false);
-        onMonthChange(new Date(month.getFullYear() - 1, month.getMonth()));
-      }
-    }, [showMonthPicker, onMonthChange, month]);
-    React.useEffect(function () {
-      document.addEventListener("keydown", onKeyDownCallback);
-      return function () {
-        document.removeEventListener("keydown", onKeyDownCallback);
-      };
-    }, [month, onMonthChange, showMonthPicker, onKeyDownCallback]);
-    var selected = React.useMemo(function () {
-      var dates = [];
-      if (!(selectedDays !== null && selectedDays !== void 0 && selectedDays.from)) return [];
-
-      // If from and to dates are the same, return an array with one item
-      if (moment__default["default"](selectedDays === null || selectedDays === void 0 ? void 0 : selectedDays.from).isSame(selectedDays === null || selectedDays === void 0 ? void 0 : selectedDays.to, "day")) {
-        dates.push(selectedDays === null || selectedDays === void 0 ? void 0 : selectedDays.from);
-        return dates;
-      }
-      var currentDate = moment__default["default"](selectedDays === null || selectedDays === void 0 ? void 0 : selectedDays.from);
-      while (currentDate.isSameOrBefore(selectedDays === null || selectedDays === void 0 ? void 0 : selectedDays.to, "day")) {
-        dates.push(currentDate.toDate());
-        currentDate = currentDate.add(1, "days");
-      }
-      return dates;
-    }, [selectedDays === null || selectedDays === void 0 ? void 0 : selectedDays.from, selectedDays === null || selectedDays === void 0 ? void 0 : selectedDays.to]);
-    return /*#__PURE__*/React__default["default"].createElement(StyledDatePicker, {
-      className: "c-date-picker-wrapper",
-      onWheel: onWheel
-    }, /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.SwitchTransition, {
-      mode: "out-in"
-    }, /*#__PURE__*/React__default["default"].createElement(StyledDatePickerCSSTransition, {
-      key: showMonthPicker ? month.getFullYear() : month.getMonth(),
-      timeout: 300,
-      classNames: "c-date-picker__animation",
-      $direction: direction
-    }, /*#__PURE__*/React__default["default"].createElement(StyledDayPicker, _extends({}, rest, {
-      mode: "multiple",
-      showOutsideDays: true,
-      disabled: disabledDays,
-      selected: selected,
-      onDayClick: handleDayClick,
-      modifiers: modifiers,
-      onDayMouseEnter: handleDayMouseEnter,
-      onDayMouseLeave: onDayMouseLeave,
-      className: className,
-      $isYearlyView: showMonthPicker,
-      month: month,
-      components: {
-        Caption: customNavBarElement,
-        DayContent: renderDay
-      },
-      classNames: customClassNames,
-      modifiersClassNames: modifiersClassNames,
-      fixedWeeks: fixedWeeks,
-      weekStartsOn: firstDayOfWeek,
-      formatters: {
-        formatWeekdayName: formatWeekdayName
-      }
-    })))));
-  };
-  DatePicker.displayName = "DatePicker";
-
   var size = {
     sm: "640px",
     md: "768px",
@@ -10922,106 +10308,106 @@
   ConfirmDialog.displayName = "ConfirmDialog";
 
   var StyledConfirmDialog$1 = styled__default["default"](ConfirmDialog).withConfig({
-    displayName: "StylesV2__StyledConfirmDialog",
-    componentId: "sc-qbn2vu-0"
+    displayName: "Styles__StyledConfirmDialog",
+    componentId: "sc-18towna-0"
   })([".modal-header{padding:16px 30px;h1{margin:0;font-size:16px;}}.modal-body{padding:10px 30px;}.modal-divider{border-top:1px solid var(--border-primary);height:1px;}.modal-footer{padding:16px 30px;}"]);
   StyledConfirmDialog$1.displayName = "StyledConfirmDialog";
   var StyledDatePickerContainerInner = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledDatePickerContainerInner",
-    componentId: "sc-qbn2vu-1"
+    displayName: "Styles__StyledDatePickerContainerInner",
+    componentId: "sc-18towna-1"
   })(["& > *{font-family:-apple-system,BlinkMacSystemFont,\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}&{@keyframes slide-up{from{transform:translateY(0);opacity:1;}to{transform:translateY(-20px);opacity:0;}}@keyframes slide-down{from{transform:translateY(0);opacity:1;}to{transform:translateY(20px);opacity:0;}}.slide-up{animation:slide-up 0.3s ease-in-out;}.slide-down{animation:slide-down 0.3s ease-in-out;}.today-day{position:relative;&::after{position:absolute;content:\"\";bottom:2px;height:3px;width:3px;border-radius:3px;margin:0 auto;left:0;right:0;background:var(--color-primary);}}.today-day,.today-month,.today-year{color:var(--color-primary);background-color:none;}.selected{background-color:var(--color-primary) !important;color:var(--color-theme-100) !important;}.disabled{pointer-events:none;color:var(--color-theme-500);}.hovered{background-color:var(--color-primary-300);}}.userAvailability,.nonWorkingDaysOfWeek{color:var(--red-alert);&.hovered:hover:not(.selected){background-color:rgba(237,97,97,0.1);color:var(--red-alert);}&.today-day{color:var(--red-alert);&:after{background-color:var(--red-alert);}&.hovered:hover:not(.selected):after{background-color:var(--red-alert);}}}.selected{background-color:var(--color-primary);color:var(--color-theme-100);&.today-day{color:var(--color-theme-100);&:after{background-color:var(--color-theme-100);}}&.userAvailability,&.nonWorkingDaysOfWeek{background-color:var(--red-alert) !important;color:var(--color-theme-100) !important;}}.nonWorkingDay{color:var(--color-theme-500);&.hovered:hover:not(.selected){color:var(--color-theme-500);}&.today-day{color:var(--color-primary-500);&:after{background-color:var(--color-primary-500);}&.hovered:hover:not(.selected){color:var(--color-theme-500);&:after{background-color:var(--color-theme-500);}}}&.userAvailability,&.nonWorkingDaysOfWeek{&.hovered:hover:not(.selected){color:var(--color-theme-500);background-color:var(--color-primary-300);&.today-day:after{background-color:var(--color-theme-500);}}}&.selected{color:rgba(255,255,255,0.6);background-color:var(--color-primary);.neon &{color:rgba(0,0,0,0.4);}&.today-day{color:rgba(255,255,255,0.6);.neon &{color:rgba(0,0,0,0.4);}&:after{background-color:rgba(255,255,255,0.6);.neon &{background-color:rgba(0,0,0,0.4);}}}}}.disabled{cursor:default;color:var(--color-theme-500);&.hovered:hover{color:var(--color-theme-500);}}.outside{cursor:default;opacity:0.25;color:var(--color-theme-900);&.userAvailability.hovered:hover:not(.selected),&.nonWorkingDaysOfWeek.hovered:hover:not(.selected){background:var(--color-primary-300);}&.userAvailability:not(.selected),&.nonWorkingDaysOfWeek:not(.selected),&.userAvailability.hovered:hover:not(.selected),&.nonWorkingDaysOfWeek.hovered:hover:not(.selected),&.nonWorkingDay.hovered:hover:not(.selected),&.nonWorkingDay:not(.selected),&.today-day.hovered:hover:not(.selected),&.today-day:not(.selected){color:var(--color-theme-900);}&.userAvailability.today-day:not(.selected):after,&.nonWorkingDaysOfWeek.today-day:not(.selected):after,&.userAvailability.today-day.hovered:hover:not(.selected):after,&.nonWorkingDaysOfWeek.today-day.hovered:hover:not(.selected):after,&.nonWorkingDay.today-day:not(.selected):after,&.nonWorkingDay.today-day.hovered:hover:not(.selected):after,&.today-day.hovered:hover:not(.selected):after,&.today-day:not(.selected):after{background-color:var(--color-theme-900);}&.hovered:hover:not(.selected){background:var(--color-primary-400);}&.selected{color:var(--page-paper-main);background:var(--color-primary);.neon &{color:var(--page-paper-main);}&.today-day{&:after{background:var(--page-paper-main);.neon &{background:var(--page-paper-main);}}&.nonWorkingDay{color:var(--page-paper-main);.neon &{color:var(--page-paper-main);}}}}}"]);
   var StyledDatePickerWrapper = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledDatePickerWrapper",
-    componentId: "sc-qbn2vu-2"
+    displayName: "Styles__StyledDatePickerWrapper",
+    componentId: "sc-18towna-2"
   })(["position:relative;display:inline-block;width:100%;"]);
   StyledDatePickerWrapper.displayName = "StyledDatePickerWrapper";
   var StyledDaysOfWeek = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledDaysOfWeek",
-    componentId: "sc-qbn2vu-3"
+    displayName: "Styles__StyledDaysOfWeek",
+    componentId: "sc-18towna-3"
   })(["display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-weight:bold;margin-bottom:0;width:100%;"]);
   StyledDaysOfWeek.displayName = "StyledDaysOfWeek";
   var StyledDayName = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledDayName",
-    componentId: "sc-qbn2vu-4"
+    displayName: "Styles__StyledDayName",
+    componentId: "sc-18towna-4"
   })(["width:27px;height:27px;display:grid;place-items:center;font-size:11px;font-weight:400;color:var(--color-theme-600);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;"]);
   StyledDayName.displayName = "StyledDayName";
   var StyledCalendarDates = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledCalendarDates",
-    componentId: "sc-qbn2vu-5"
+    displayName: "Styles__StyledCalendarDates",
+    componentId: "sc-18towna-5"
   })(["display:grid;grid-template-columns:repeat(7,1fr);text-align:center;row-gap:4px;width:100%;"]);
   StyledCalendarDates.displayName = "StyledCalendarDates";
   var StyledCalendarDate = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledCalendarDate",
-    componentId: "sc-qbn2vu-6"
+    displayName: "Styles__StyledCalendarDate",
+    componentId: "sc-18towna-6"
   })(["cursor:pointer;border-radius:50%;transition:background 0.3s;width:27px;height:27px;display:grid;place-items:center;font-size:13px;font-weight:700;color:var(--color-theme-900);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;&:hover{background-color:var(--color-primary-300);}"]);
   StyledCalendarDate.displayName = "StyledCalendarDate";
   var StyledCaption = styled__default["default"].span.withConfig({
-    displayName: "StylesV2__StyledCaption",
-    componentId: "sc-qbn2vu-7"
+    displayName: "Styles__StyledCaption",
+    componentId: "sc-18towna-7"
   })(["font-size:18.5px;font-weight:500;padding:0 16px;border-radius:15px;color:var(--color-theme-900);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;&.year-caption{margin:auto !important;}&:hover{background-color:var(--color-primary-300);}"]);
   StyledCaption.displayName = "StyledCaption";
   var StyledCalendarSelector = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledCalendarSelector",
-    componentId: "sc-qbn2vu-8"
+    displayName: "Styles__StyledCalendarSelector",
+    componentId: "sc-18towna-8"
   })(["height:230px;display:grid;place-items:center;width:100%;max-width:212px;margin:auto;"]);
   StyledCalendarSelector.displayName = "StyledCalendarSelector";
   var StyledYearSelect = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledYearSelect",
-    componentId: "sc-qbn2vu-9"
+    displayName: "Styles__StyledYearSelect",
+    componentId: "sc-18towna-9"
   })(["display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:8px 20px;max-height:210px;overflow-y:auto;width:100%;"]);
   StyledYearSelect.displayName = "StyledYearSelect";
   var StyledYearOption = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledYearOption",
-    componentId: "sc-qbn2vu-10"
+    displayName: "Styles__StyledYearOption",
+    componentId: "sc-18towna-10"
   })(["cursor:pointer;text-align:center;border-radius:16px;transition:background 0.2s;font-size:14px;margin:auto;font-weight:700;font-size:14px;line-height:18px;width:50px;margin-bottom:16px;height:20px;color:var(--color-theme-900);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;&:hover{background-color:var(--color-primary-300);}"]);
   StyledYearOption.displayName = "StyledYearOption";
   var StyledMonthOption = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledMonthOption",
-    componentId: "sc-qbn2vu-11"
+    displayName: "Styles__StyledMonthOption",
+    componentId: "sc-18towna-11"
   })(["text-align:center;cursor:pointer;border-radius:16px;transition:background 0.2s;margin:13.5px auto;font-weight:700;font-size:14px;line-height:18px;width:50px;margin-bottom:16px;height:20px;color:var(--color-theme-900);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;&:hover{background-color:var(--color-primary-300);}"]);
   StyledMonthOption.displayName = "StyledMonthOption";
   var StyledMonthSelect = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledMonthSelect",
-    componentId: "sc-qbn2vu-12"
+    displayName: "Styles__StyledMonthSelect",
+    componentId: "sc-18towna-12"
   })(["display:grid;grid-template-columns:repeat(3,1fr);gap:4px;width:100%;height:220px;margin:auto;"]);
   StyledMonthSelect.displayName = "StyledMonthSelect";
   var StyledMonthSelector = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledMonthSelector",
-    componentId: "sc-qbn2vu-13"
+    displayName: "Styles__StyledMonthSelector",
+    componentId: "sc-18towna-13"
   })(["width:100%;padding:8px 20px;"]);
   StyledMonthSelector.displayName = "StyledMonthSelector";
   var StyledControls = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledControls",
-    componentId: "sc-qbn2vu-14"
+    displayName: "Styles__StyledControls",
+    componentId: "sc-18towna-14"
   })(["display:flex;justify-content:space-between;border-top:1px solid var(--border-primary);margin:8px 0 0;padding:8px 24px 0px;"]);
   StyledControls.displayName = "StyledControls";
   var StyledControlsLeft = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledControlsLeft",
-    componentId: "sc-qbn2vu-15"
+    displayName: "Styles__StyledControlsLeft",
+    componentId: "sc-18towna-15"
   })(["display:flex;gap:8px;"]);
   StyledControlsLeft.displayName = "StyledControlsLeft";
   var StyledClearInstantButton = styled__default["default"](Button).withConfig({
-    displayName: "StylesV2__StyledClearInstantButton",
-    componentId: "sc-qbn2vu-16"
+    displayName: "Styles__StyledClearInstantButton",
+    componentId: "sc-18towna-16"
   })(["margin:auto !important;"]);
   StyledClearInstantButton.displayName = "StyledClearInstantButton";
   var StyledCalendarHeader = styled__default["default"].div.withConfig({
-    displayName: "StylesV2__StyledCalendarHeader",
-    componentId: "sc-qbn2vu-17"
+    displayName: "Styles__StyledCalendarHeader",
+    componentId: "sc-18towna-17"
   })(["display:flex;justify-content:space-between;align-items:center;font-weight:bold;margin:auto;margin-bottom:4px;cursor:pointer;width:230px;"]);
   StyledCalendarHeader.displayName = "StyledCalendarHeader";
 
   var toMoment = function toMoment(date) {
-    if (moment__default$1["default"].isMoment(date)) {
+    if (moment__default["default"].isMoment(date)) {
       return date;
     } else if (typeof date === "number") {
-      return moment__default$1["default"].utc(date * 1000);
+      return moment__default["default"].utc(date * 1000);
     } else if (typeof date === "string") {
-      return moment__default$1["default"].utc(date);
+      return moment__default["default"].utc(date);
     }
     return null;
   };
-  var DatePickerV2 = function DatePickerV2(_ref) {
+  var DatePicker = function DatePicker(_ref) {
     var defaultSelected = _ref.selected,
       onChange = _ref.onChange,
       onSave = _ref.onSave,
@@ -11098,7 +10484,7 @@
         if (month) {
           return toMoment(month);
         }
-        return moment__default$1["default"].utc();
+        return moment__default["default"].utc();
       }),
       _useState12 = _slicedToArray(_useState11, 2),
       currentDate = _useState12[0],
@@ -11109,7 +10495,7 @@
         } else if (month) {
           return toMoment(month);
         }
-        return moment__default$1["default"].utc();
+        return moment__default["default"].utc();
       }),
       _useState14 = _slicedToArray(_useState13, 2),
       targetDate = _useState14[0],
@@ -11133,9 +10519,9 @@
       _useState18 = _slicedToArray(_useState17, 2),
       hoveredDate = _useState18[0],
       setHoveredDate = _useState18[1];
-    var timezone = moment__default$1["default"].defaultZone ? moment__default$1["default"].defaultZone.name : moment__default$1["default"].tz.guess();
-    var currentDateInTimezone = moment__default$1["default"]().tz(timezone).format("YYYY-MM-DD");
-    var today = moment__default$1["default"].utc(currentDateInTimezone);
+    var timezone = moment__default["default"].defaultZone ? moment__default["default"].defaultZone.name : moment__default["default"].tz.guess();
+    var currentDateInTimezone = moment__default["default"]().tz(timezone).format("YYYY-MM-DD");
+    var today = moment__default["default"].utc(currentDateInTimezone);
     var selectedYearRef = React.useRef(null);
     var datePickerRef = React.useRef(null);
     var handleSelection = React.useCallback(function (range) {
@@ -11149,12 +10535,12 @@
         setSelected(range);
         if (onChange) onChange({
           from: range.from.utc().unix(),
-          to: range !== null && range !== void 0 && range.to ? moment__default$1["default"](range.to).utc().unix() : null
+          to: range !== null && range !== void 0 && range.to ? moment__default["default"](range.to).utc().unix() : null
         });
         if (instant && onSave) {
           onSave({
             from: range.from.utc().unix(),
-            to: range !== null && range !== void 0 && range.to ? moment__default$1["default"](range.to).utc().unix() : null
+            to: range !== null && range !== void 0 && range.to ? moment__default["default"](range.to).utc().unix() : null
           });
         }
       }
@@ -11180,8 +10566,8 @@
           from: toMoment(defaultSelected.from),
           to: defaultSelected.to ? toMoment(defaultSelected.to) : null
         });
-        setCurrentDate(toMoment(defaultSelected.from) || moment__default$1["default"].utc());
-        setTargetDate(toMoment(defaultSelected.from) || moment__default$1["default"].utc());
+        setCurrentDate(toMoment(defaultSelected.from) || moment__default["default"].utc());
+        setTargetDate(toMoment(defaultSelected.from) || moment__default["default"].utc());
       } else {
         setSelected(null);
       }
@@ -11237,7 +10623,7 @@
       }
     };
     var handleCustomSelection = function handleCustomSelection(date) {
-      if (!selected || (selected === null || selected === void 0 ? void 0 : selected.from) === moment__default$1["default"].utc(Number(defaultSelected === null || defaultSelected === void 0 ? void 0 : defaultSelected.from) * 1000)) {
+      if (!selected || (selected === null || selected === void 0 ? void 0 : selected.from) === moment__default["default"].utc(Number(defaultSelected === null || defaultSelected === void 0 ? void 0 : defaultSelected.from) * 1000)) {
         setSelected({
           from: date.utc(),
           to: null
@@ -11248,7 +10634,7 @@
         });
         return;
       }
-      if (moment__default$1["default"].isMoment(selected === null || selected === void 0 ? void 0 : selected.from) && !(selected !== null && selected !== void 0 && selected.to) && !(selected !== null && selected !== void 0 && selected.from.isSame(date.utc(), "day"))) {
+      if (moment__default["default"].isMoment(selected === null || selected === void 0 ? void 0 : selected.from) && !(selected !== null && selected !== void 0 && selected.to) && !(selected !== null && selected !== void 0 && selected.from.isSame(date.utc(), "day"))) {
         var newSelection = selected !== null && selected !== void 0 && selected.from.isBefore(date) ? {
           from: selected.from,
           to: date.utc()
@@ -11261,7 +10647,7 @@
           from: newSelection.from,
           to: newSelection.to
         });
-      } else if (moment__default$1["default"].isMoment(selected === null || selected === void 0 ? void 0 : selected.from) && moment__default$1["default"].isMoment(selected === null || selected === void 0 ? void 0 : selected.to)) {
+      } else if (moment__default["default"].isMoment(selected === null || selected === void 0 ? void 0 : selected.from) && moment__default["default"].isMoment(selected === null || selected === void 0 ? void 0 : selected.to)) {
         setSelected({
           from: date,
           to: null
@@ -11270,7 +10656,7 @@
           from: date,
           to: null
         });
-      } else if (moment__default$1["default"].isMoment(selected === null || selected === void 0 ? void 0 : selected.from) && selected !== null && selected !== void 0 && selected.from.isSame(date.utc(), "day") && !required) {
+      } else if (moment__default["default"].isMoment(selected === null || selected === void 0 ? void 0 : selected.from) && selected !== null && selected !== void 0 && selected.from.isSame(date.utc(), "day") && !required) {
         setSelected(null);
         handleSelection(undefined);
       } else if (selected.from === null && selected.to === null) {
@@ -11289,20 +10675,20 @@
         toggleCalendar();
         if (mode === "custom" && !(selected !== null && selected !== void 0 && selected.to)) {
           setSelected({
-            from: moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from),
-            to: moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from)
+            from: moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from),
+            to: moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from)
           });
         }
         if (selected) {
           onSave({
-            from: moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from).unix(),
-            to: selected !== null && selected !== void 0 && selected.to ? moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.to).unix() : moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from).unix()
+            from: moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from).unix(),
+            to: selected !== null && selected !== void 0 && selected.to ? moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.to).unix() : moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from).unix()
           });
         } else {
           if (!required) {
             onSave(undefined);
-            setCurrentDate(moment__default$1["default"].utc());
-            setTargetDate(moment__default$1["default"].utc());
+            setCurrentDate(moment__default["default"].utc());
+            setTargetDate(moment__default["default"].utc());
           }
         }
       }
@@ -11335,6 +10721,21 @@
         }
       }
     }, [disableAnimations, isMonthSelectOpen]);
+    var handleYearChange = React.useCallback(function (direction) {
+      if (isMonthSelectOpen && !disableAnimations) {
+        setMonthTransitionDirection(direction);
+      } else {
+        setCurrentDate(function (prevDate) {
+          return direction === "prev" ? prevDate.clone().subtract(1, "year") : prevDate.clone().add(1, "year");
+        });
+      }
+      setTargetDate(function (prevDate) {
+        if (prevDate) {
+          return direction === "prev" ? prevDate.clone().subtract(1, "year") : prevDate.clone().add(1, "year");
+        }
+        return prevDate;
+      });
+    }, [disableAnimations, isMonthSelectOpen]);
     var onAnimationEnd = function onAnimationEnd() {
       if (targetDate) {
         setCurrentDate(targetDate);
@@ -11362,8 +10763,8 @@
           if (!required) {
             handleSelection(undefined);
             if (instant && onSave) {
-              setCurrentDate(moment__default$1["default"].utc());
-              setTargetDate(moment__default$1["default"].utc());
+              setCurrentDate(moment__default["default"].utc());
+              setTargetDate(moment__default["default"].utc());
             }
           }
         } else {
@@ -11381,8 +10782,8 @@
           if (!required) {
             handleSelection(undefined);
             if (instant && onSave) {
-              setCurrentDate(moment__default$1["default"].utc());
-              setTargetDate(moment__default$1["default"].utc());
+              setCurrentDate(moment__default["default"].utc());
+              setTargetDate(moment__default["default"].utc());
             }
           }
         } else {
@@ -11404,7 +10805,7 @@
       }
     }, [isYearSelectOpen]);
     var renderDaysOfWeek = function renderDaysOfWeek() {
-      var daysOfWeek = moment__default$1["default"].weekdaysShort();
+      var daysOfWeek = moment__default["default"].weekdaysShort();
       var orderedDays = [...daysOfWeek.slice(firstDayOfWeek), ...daysOfWeek.slice(0, firstDayOfWeek)];
       return orderedDays.map(function (day) {
         return /*#__PURE__*/React__default["default"].createElement(StyledDayName, {
@@ -11534,7 +10935,7 @@
       }));
     };
     var renderMonthSelect = function renderMonthSelect() {
-      var months = moment__default$1["default"].months();
+      var months = moment__default["default"].months();
       var hoverRange = getHoverRange();
       return /*#__PURE__*/React__default["default"].createElement(StyledMonthSelect, null, months.map(function (month, index) {
         var monthDate = currentDate.clone().month(index);
@@ -11568,21 +10969,21 @@
       var _selected$to3;
       if (mode === "custom" && instant && selected) {
         setSelected({
-          from: moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from),
-          to: selected !== null && selected !== void 0 && selected.to ? moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.to) : moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from)
+          from: moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from),
+          to: selected !== null && selected !== void 0 && selected.to ? moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.to) : moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from)
         });
       }
-      if (instant && onSave && mode === "custom" && selected && (!(selected !== null && selected !== void 0 && selected.from.isSame(moment__default$1["default"].utc(Number(defaultSelected === null || defaultSelected === void 0 ? void 0 : defaultSelected.from) * 1000))) || !(selected !== null && selected !== void 0 && (_selected$to3 = selected.to) !== null && _selected$to3 !== void 0 && _selected$to3.isSame(moment__default$1["default"].utc(Number(defaultSelected === null || defaultSelected === void 0 ? void 0 : defaultSelected.to) * 1000))))) {
+      if (instant && onSave && mode === "custom" && selected && (!(selected !== null && selected !== void 0 && selected.from.isSame(moment__default["default"].utc(Number(defaultSelected === null || defaultSelected === void 0 ? void 0 : defaultSelected.from) * 1000))) || !(selected !== null && selected !== void 0 && (_selected$to3 = selected.to) !== null && _selected$to3 !== void 0 && _selected$to3.isSame(moment__default["default"].utc(Number(defaultSelected === null || defaultSelected === void 0 ? void 0 : defaultSelected.to) * 1000))))) {
         onSave({
-          from: moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from).unix(),
-          to: selected !== null && selected !== void 0 && selected.to ? moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.to).unix() : moment__default$1["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from).unix()
+          from: moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from).unix(),
+          to: selected !== null && selected !== void 0 && selected.to ? moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.to).unix() : moment__default["default"].utc(selected === null || selected === void 0 ? void 0 : selected.from).unix()
         });
       }
       if (mode === "custom" && instant && !selected && onSave) {
         onSave(undefined);
       }
-      setCurrentDate(defaultSelected !== null && defaultSelected !== void 0 && defaultSelected.from ? toMoment(defaultSelected.from) : month ? toMoment(month) : moment__default$1["default"].utc());
-      setTargetDate(defaultSelected !== null && defaultSelected !== void 0 && defaultSelected.from ? toMoment(defaultSelected.from) : month ? toMoment(month) : moment__default$1["default"].utc());
+      setCurrentDate(defaultSelected !== null && defaultSelected !== void 0 && defaultSelected.from ? toMoment(defaultSelected.from) : month ? toMoment(month) : moment__default["default"].utc());
+      setTargetDate(defaultSelected !== null && defaultSelected !== void 0 && defaultSelected.from ? toMoment(defaultSelected.from) : month ? toMoment(month) : moment__default["default"].utc());
       setSelected(defaultSelected !== null && defaultSelected !== void 0 && defaultSelected.from ? {
         from: toMoment(defaultSelected.from),
         to: defaultSelected.to ? toMoment(defaultSelected.to) : null
@@ -11641,6 +11042,10 @@
           handleMonthChange("next");
         } else if (event.key === "ArrowLeft") {
           handleMonthChange("prev");
+        } else if (event.key === "ArrowUp") {
+          handleYearChange("next");
+        } else if (event.key === "ArrowDown") {
+          handleYearChange("prev");
         }
       };
       if (isOpen) {
@@ -11651,7 +11056,7 @@
       return function () {
         window.removeEventListener("keydown", handleKeyDown);
       };
-    }, [isOpen, handleMonthChange]);
+    }, [isOpen, handleMonthChange, handleYearChange]);
     var saveIsDisabled = function saveIsDisabled() {
       if (!target) return false;
       if (!defaultSelected && !selected) {
@@ -11740,30 +11145,22 @@
       className = _ref.className,
       _ref$period = _ref.period,
       period = _ref$period === void 0 ? "week" : _ref$period,
-      datePickerClass = _ref.datePickerClass,
       _ref$withDatePicker = _ref.withDatePicker,
       withDatePicker = _ref$withDatePicker === void 0 ? true : _ref$withDatePicker,
       _ref$defaultMonth = _ref.defaultMonth,
-      defaultMonth = _ref$defaultMonth === void 0 ? new Date() : _ref$defaultMonth,
-      popperClassName = _ref.popperClassName,
+      defaultMonth = _ref$defaultMonth === void 0 ? moment__default["default"]() : _ref$defaultMonth,
+      enableYearPicker = _ref.enableYearPicker,
       _ref$position = _ref.position,
-      position = _ref$position === void 0 ? "bottom" : _ref$position;
-    var _useState = React.useState(moment__default["default"](from)),
+      position = _ref$position === void 0 ? "bottom" : _ref$position,
+      popperClassName = _ref.popperClassName;
+    var _useState = React.useState(moment__default["default"].utc(from)),
       _useState2 = _slicedToArray(_useState, 2),
       fromDate = _useState2[0],
       setFromDate = _useState2[1];
-    var _useState3 = React.useState(moment__default["default"](to)),
+    var _useState3 = React.useState(moment__default["default"].utc(to)),
       _useState4 = _slicedToArray(_useState3, 2),
       toDate = _useState4[0],
       setToDate = _useState4[1];
-    var _useState5 = React.useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      showDatePicker = _useState6[0],
-      setShowDatePicker = _useState6[1];
-    var _useState7 = React.useState(defaultMonth),
-      _useState8 = _slicedToArray(_useState7, 2),
-      month = _useState8[0],
-      setMonth = _useState8[1];
     var getDatesByPeriod = React.useCallback(function (interval) {
       var date = fromDate ? fromDate : moment__default["default"]();
       if (step === "daily") {
@@ -11786,73 +11183,67 @@
     }, [fromDate, period, step]);
     var getDateFormatted = React.useMemo(function () {
       if (formatCallback) {
-        return formatCallback(fromDate.toDate(), toDate.toDate());
+        return formatCallback(fromDate, toDate);
       }
       var actualYear = moment__default["default"]().year();
       var showWeekOrCustomDateFormat = function showWeekOrCustomDateFormat(start, end) {
         if (start.year() === actualYear && end.year() === actualYear) {
-          return start.format("MMM DD") + " - " + end.format("MMM DD");
+          return start.utc().format("MMM DD") + " - " + end.utc().format("MMM DD");
         } else {
-          return start.format("MMM DD YYYY") + " - " + end.format("MMM DD YYYY");
+          return start.utc().format("MMM DD YYYY") + " - " + end.utc().format("MMM DD YYYY");
         }
       };
       if (step === "daily") {
         if (fromDate.year() === actualYear) {
-          return fromDate.format("MMM DD");
+          return fromDate.utc().format("MMM DD");
         }
-        return fromDate.format("MMM DD YYYY");
+        return fromDate.utc().format("MMM DD YYYY");
       } else if (step === "weekly") {
-        var startDate = fromDate.clone().startOf(period);
-        var endDate = startDate.clone().endOf(period);
+        var startDate = fromDate.clone().utc().startOf(period);
+        var endDate = startDate.clone().utc().endOf(period);
         return showWeekOrCustomDateFormat(startDate, endDate);
       } else if (step === "monthly") {
-        return fromDate.format("MMM YYYY");
+        return fromDate.utc().format("MMM YYYY");
       } else if (step === "quarterly") {
-        return "Q".concat(fromDate.quarter(), "/").concat(fromDate.format("YYYY"));
+        return "Q".concat(fromDate.utc().quarter(), "/").concat(fromDate.utc().format("YYYY"));
       } else if (step === "yearly") {
-        return fromDate.format("YYYY");
-      } else if (step === "custom") {
+        return fromDate.utc().format("YYYY");
+      } else if (step === "range") {
         return showWeekOrCustomDateFormat(fromDate, toDate);
       }
       return "";
-    }, [fromDate, step, toDate, formatCallback, period]);
-    var onChangeCallback = React.useCallback(function (amount) {
-      var _getDatesByPeriod = getDatesByPeriod(amount),
-        _getDatesByPeriod2 = _slicedToArray(_getDatesByPeriod, 2),
-        newFrom = _getDatesByPeriod2[0],
-        newTo = _getDatesByPeriod2[1];
-      setFromDate(moment__default["default"](newFrom));
-      setToDate(moment__default["default"](newTo));
-      if (onChange) {
-        onChange(newFrom.toDate(), newTo.toDate());
-      }
-    }, [onChange, getDatesByPeriod]);
+    }, [fromDate, toDate, step, formatCallback, period]);
+    var datePickerMode = React.useMemo(function () {
+      if (step === "range") return "custom";
+      if (step === "yearly") return "custom";
+      return step;
+    }, [step]);
     var onDatePickerChange = React.useCallback(function (dates) {
-      var fromDateTemp = dates === null || dates === void 0 ? void 0 : dates.from;
-      var toDateTemp = dates === null || dates === void 0 ? void 0 : dates.to;
-      setFromDate(moment__default["default"](fromDateTemp));
-      setToDate(moment__default["default"](toDateTemp));
-      if (onChange && fromDateTemp instanceof Date && toDateTemp instanceof Date) {
-        onChange(fromDateTemp, toDateTemp);
+      var fromDateTemp = moment__default["default"].utc(Number(dates === null || dates === void 0 ? void 0 : dates.from) * 1000);
+      var toDateTemp = moment__default["default"].utc(Number(dates === null || dates === void 0 ? void 0 : dates.to) * 1000);
+      setFromDate(fromDateTemp);
+      setToDate(toDateTemp);
+      if (onChange && moment__default["default"].isMoment(fromDateTemp) && moment__default["default"].isMoment(toDateTemp)) {
+        onChange(fromDateTemp.toDate(), toDateTemp.toDate());
       }
     }, [onChange, setFromDate, setToDate]);
     var isAfterMaxDate = React.useMemo(function () {
-      return maxValue instanceof Date && moment__default["default"](moment__default["default"](maxValue).format("YYYY-MM-DD")).isSameOrBefore(toDate.format("YYYY-MM-DD"));
+      return moment__default["default"].isMoment(maxValue) && moment__default["default"](moment__default["default"].utc(maxValue).format("YYYY-MM-DD")).isSameOrBefore(toDate.utc().format("YYYY-MM-DD"));
     }, [maxValue, toDate]);
     var isBeforeMinDate = React.useMemo(function () {
-      return minValue instanceof Date && moment__default["default"](moment__default["default"](minValue).format("YYYY-MM-DD")).isSameOrAfter(toDate.format("YYYY-MM-DD"));
+      return moment__default["default"].isMoment(minValue) && moment__default["default"].utc(moment__default["default"].utc(minValue).format("YYYY-MM-DD")).isSameOrAfter(toDate.utc().format("YYYY-MM-DD"));
     }, [minValue, toDate]);
     React.useEffect(function () {
       if (isBeforeMinDate) {
         if (step === "daily") {
-          setFromDate(moment__default["default"](minValue));
-          setToDate(moment__default["default"](minValue));
+          setFromDate(moment__default["default"].utc(minValue));
+          setToDate(moment__default["default"].utc(minValue));
         }
       }
       if (isAfterMaxDate) {
         if (step === "daily") {
-          setFromDate(moment__default["default"](maxValue));
-          setToDate(moment__default["default"](maxValue));
+          setFromDate(moment__default["default"].utc(maxValue));
+          setToDate(moment__default["default"].utc(maxValue));
         }
       }
     }, [step, minValue, maxValue, isBeforeMinDate, isAfterMaxDate]);
@@ -11860,265 +11251,19 @@
       if (isAfterMaxDate) {
         return;
       }
-      onChangeCallback(1);
+      var _getDatesByPeriod = getDatesByPeriod(1),
+        _getDatesByPeriod2 = _slicedToArray(_getDatesByPeriod, 2),
+        newFrom = _getDatesByPeriod2[0],
+        newTo = _getDatesByPeriod2[1];
+      setFromDate(moment__default["default"].utc(newFrom));
+      setToDate(moment__default["default"].utc(newTo));
+      if (onChange) {
+        onChange(moment__default["default"].utc(newFrom), moment__default["default"].utc(newTo));
+      }
       if (onForward) {
-        onForward(fromDate.toDate(), toDate.toDate());
+        onForward(moment__default["default"].utc(newFrom).toDate(), moment__default["default"].utc(newTo).toDate());
       }
-    }, [isAfterMaxDate, onChangeCallback, onForward, fromDate, toDate]);
-    var onLeftClickHandler = React.useCallback(function () {
-      if (isBeforeMinDate) {
-        return;
-      }
-      onChangeCallback(-1);
-      if (onBack) {
-        onBack(fromDate.toDate(), toDate.toDate());
-      }
-    }, [isBeforeMinDate, onChangeCallback, onBack, fromDate, toDate]);
-    var renderLeftRightButtons = React.useMemo(function () {
-      return step !== "custom";
-    }, [step]);
-    var handleShow = React.useCallback(function () {
-      setShowDatePicker(!showDatePicker);
-      if (fromDate) {
-        setMonth(fromDate.toDate());
-      }
-    }, [setShowDatePicker, showDatePicker, fromDate]);
-    var closeMenu = React.useCallback(function () {
-      setShowDatePicker(false);
-    }, []);
-    var onMonthChange = React.useCallback(function (m) {
-      setMonth(m);
-    }, [setMonth]);
-    React.useEffect(function () {
-      setFromDate(moment__default["default"](from));
-      setToDate(moment__default["default"](to));
-    }, [from, to]);
-    var dateStepperWidth = function dateStepperWidth(fromDay, toDay, range) {
-      if (fromDay.year() !== moment__default["default"]().year() || toDay.year() !== moment__default["default"]().year()) {
-        switch (range) {
-          case "daily":
-          case "monthly":
-            return {
-              minWidth: "122px"
-            };
-          case "weekly":
-          case "custom":
-            return {
-              minWidth: "232px"
-            };
-        }
-      }
-      switch (range) {
-        case "monthly":
-          return {
-            minWidth: "122px"
-          };
-        case "weekly":
-        case "custom":
-          return {
-            minWidth: "182px"
-          };
-      }
-      return {
-        minWidth: "102px"
-      };
-    };
-    var isDisabled = React.useCallback(function (day) {
-      var dayFormat = moment__default["default"](day).format("YYYY-MM-DD");
-      var isBefore = maxValue instanceof Date && moment__default["default"](moment__default["default"](maxValue).format("YYYY-MM-DD")).isBefore(dayFormat);
-      var isAfter = minValue instanceof Date && moment__default["default"](moment__default["default"](minValue).format("YYYY-MM-DD")).isAfter(dayFormat);
-      return isBefore || isAfter;
-    }, [maxValue, minValue]);
-    var modifiers = React.useMemo(function () {
-      return {
-        day_disabled: function day_disabled(day) {
-          return isDisabled(day);
-        },
-        nonWorkingDay: function nonWorkingDay(day) {
-          return isDisabled(day);
-        }
-      };
-    }, [isDisabled]);
-    return /*#__PURE__*/React__default["default"].createElement(StyledButtonGroup, {
-      className: classNames__default["default"]("c-date-stepper", className)
-    }, renderLeftRightButtons ? /*#__PURE__*/React__default["default"].createElement(StyledControl, {
-      type: "button",
-      variant: "secondary",
-      onClick: onLeftClickHandler,
-      disabled: isBeforeMinDate
-    }, /*#__PURE__*/React__default["default"].createElement(ArrowLeftIcon$1, null)) : null, /*#__PURE__*/React__default["default"].createElement(StyledDiv$1, {
-      $isTargetable: step === "yearly" || !withDatePicker,
-      $isRounded: step === "custom",
-      style: dateStepperWidth(fromDate, toDate, step)
-    }, withDatePicker ? /*#__PURE__*/React__default["default"].createElement(StyledMenu$1, {
-      target: /*#__PURE__*/React__default["default"].createElement(StyledButton$1, {
-        type: "button"
-      }, /*#__PURE__*/React__default["default"].createElement("span", null, getDateFormatted)),
-      open: showDatePicker,
-      onOpen: handleShow,
-      onClose: closeMenu,
-      popperClassName: popperClassName,
-      position: position
-    }, /*#__PURE__*/React__default["default"].createElement(DatePicker, {
-      month: month,
-      selectionMode: step,
-      className: datePickerClass,
-      selectedDays: {
-        from: fromDate.toDate(),
-        to: toDate.toDate()
-      },
-      onChange: onDatePickerChange,
-      onMonthChange: onMonthChange,
-      firstDayOfWeek: period === "week" ? 0 : 1,
-      modifiers: modifiers,
-      dateRequired: true,
-      fixedWeeks: true
-    })) : /*#__PURE__*/React__default["default"].createElement(StyledSpan$1, null, getDateFormatted)), renderLeftRightButtons ? /*#__PURE__*/React__default["default"].createElement(StyledControl, {
-      type: "button",
-      variant: "secondary",
-      onClick: onRightClickHandler,
-      disabled: isAfterMaxDate
-    }, /*#__PURE__*/React__default["default"].createElement(ArrowRightIcon$1, null)) : null);
-  };
-  DateStepper.displayName = "DateStepper";
-
-  /**
-   * This component allow you to select date range. It accepts two parameters "from" and "to" as valid format
-   * onChange and onBack and onForward it will return "from: Date" and "to: Date" as function arguments
-   */
-
-  var DateStepperV2 = function DateStepperV2(_ref) {
-    var step = _ref.step,
-      formatCallback = _ref.formatCallback,
-      onChange = _ref.onChange,
-      from = _ref.from,
-      to = _ref.to,
-      onBack = _ref.onBack,
-      onForward = _ref.onForward,
-      minValue = _ref.minValue,
-      maxValue = _ref.maxValue,
-      className = _ref.className,
-      _ref$period = _ref.period,
-      period = _ref$period === void 0 ? "week" : _ref$period,
-      _ref$withDatePicker = _ref.withDatePicker,
-      withDatePicker = _ref$withDatePicker === void 0 ? true : _ref$withDatePicker,
-      _ref$defaultMonth = _ref.defaultMonth,
-      defaultMonth = _ref$defaultMonth === void 0 ? moment__default$1["default"]() : _ref$defaultMonth,
-      enableYearPicker = _ref.enableYearPicker,
-      _ref$position = _ref.position,
-      position = _ref$position === void 0 ? "bottom" : _ref$position,
-      popperClassName = _ref.popperClassName;
-    var _useState = React.useState(moment__default$1["default"].utc(from)),
-      _useState2 = _slicedToArray(_useState, 2),
-      fromDate = _useState2[0],
-      setFromDate = _useState2[1];
-    var _useState3 = React.useState(moment__default$1["default"].utc(to)),
-      _useState4 = _slicedToArray(_useState3, 2),
-      toDate = _useState4[0],
-      setToDate = _useState4[1];
-    var getDatesByPeriod = React.useCallback(function (interval) {
-      var date = fromDate ? fromDate : moment__default$1["default"]();
-      if (step === "daily") {
-        date.add(interval, "days");
-        return [date, date.clone()];
-      } else if (step === "weekly") {
-        date.add(interval, "weeks");
-        return [date.clone().startOf(period), date.clone().endOf(period)];
-      } else if (step === "monthly") {
-        date.add(interval, "months");
-        return [date.clone().startOf("month"), date.clone().endOf("month")];
-      } else if (step === "quarterly") {
-        date.add(interval, "quarters");
-        return [date.clone().startOf("quarter"), date.clone().endOf("quarter")];
-      } else if (step === "yearly") {
-        date.add(interval, "years");
-        return [date.clone().startOf("year"), date.clone().endOf("year")];
-      }
-      return [date, date];
-    }, [fromDate, period, step]);
-    var getDateFormatted = React.useMemo(function () {
-      if (formatCallback) {
-        return formatCallback(fromDate, toDate);
-      }
-      var actualYear = moment__default$1["default"]().year();
-      var showWeekOrCustomDateFormat = function showWeekOrCustomDateFormat(start, end) {
-        if (start.year() === actualYear && end.year() === actualYear) {
-          return start.utc().format("MMM DD") + " - " + end.utc().format("MMM DD");
-        } else {
-          return start.utc().format("MMM DD YYYY") + " - " + end.utc().format("MMM DD YYYY");
-        }
-      };
-      if (step === "daily") {
-        if (fromDate.year() === actualYear) {
-          return fromDate.utc().format("MMM DD");
-        }
-        return fromDate.utc().format("MMM DD YYYY");
-      } else if (step === "weekly") {
-        var startDate = fromDate.clone().utc().startOf(period);
-        var endDate = startDate.clone().utc().endOf(period);
-        return showWeekOrCustomDateFormat(startDate, endDate);
-      } else if (step === "monthly") {
-        return fromDate.utc().format("MMM YYYY");
-      } else if (step === "quarterly") {
-        return "Q".concat(fromDate.utc().quarter(), "/").concat(fromDate.utc().format("YYYY"));
-      } else if (step === "yearly") {
-        return fromDate.utc().format("YYYY");
-      } else if (step === "range") {
-        return showWeekOrCustomDateFormat(fromDate, toDate);
-      }
-      return "";
-    }, [fromDate, toDate, step, formatCallback, period]);
-    var datePickerMode = React.useMemo(function () {
-      if (step === "range") return "custom";
-      if (step === "yearly") return "custom";
-      return step;
-    }, [step]);
-    var onDatePickerChange = React.useCallback(function (dates) {
-      var fromDateTemp = moment__default$1["default"].utc(Number(dates === null || dates === void 0 ? void 0 : dates.from) * 1000);
-      var toDateTemp = moment__default$1["default"].utc(Number(dates === null || dates === void 0 ? void 0 : dates.to) * 1000);
-      setFromDate(fromDateTemp);
-      setToDate(toDateTemp);
-      if (onChange && moment__default$1["default"].isMoment(fromDateTemp) && moment__default$1["default"].isMoment(toDateTemp)) {
-        onChange(fromDateTemp.toDate(), toDateTemp.toDate());
-      }
-    }, [onChange, setFromDate, setToDate]);
-    var isAfterMaxDate = React.useMemo(function () {
-      return moment__default$1["default"].isMoment(maxValue) && moment__default$1["default"](moment__default$1["default"].utc(maxValue).format("YYYY-MM-DD")).isSameOrBefore(toDate.utc().format("YYYY-MM-DD"));
-    }, [maxValue, toDate]);
-    var isBeforeMinDate = React.useMemo(function () {
-      return moment__default$1["default"].isMoment(minValue) && moment__default$1["default"].utc(moment__default$1["default"].utc(minValue).format("YYYY-MM-DD")).isSameOrAfter(toDate.utc().format("YYYY-MM-DD"));
-    }, [minValue, toDate]);
-    React.useEffect(function () {
-      if (isBeforeMinDate) {
-        if (step === "daily") {
-          setFromDate(moment__default$1["default"].utc(minValue));
-          setToDate(moment__default$1["default"].utc(minValue));
-        }
-      }
-      if (isAfterMaxDate) {
-        if (step === "daily") {
-          setFromDate(moment__default$1["default"].utc(maxValue));
-          setToDate(moment__default$1["default"].utc(maxValue));
-        }
-      }
-    }, [step, minValue, maxValue, isBeforeMinDate, isAfterMaxDate]);
-    var onRightClickHandler = React.useCallback(function () {
-      if (isAfterMaxDate) {
-        return;
-      }
-      var _getDatesByPeriod = getDatesByPeriod(1),
-        _getDatesByPeriod2 = _slicedToArray(_getDatesByPeriod, 2),
-        newFrom = _getDatesByPeriod2[0],
-        newTo = _getDatesByPeriod2[1];
-      setFromDate(moment__default$1["default"].utc(newFrom));
-      setToDate(moment__default$1["default"].utc(newTo));
-      if (onChange) {
-        onChange(moment__default$1["default"].utc(newFrom), moment__default$1["default"].utc(newTo));
-      }
-      if (onForward) {
-        onForward(moment__default$1["default"].utc(newFrom).toDate(), moment__default$1["default"].utc(newTo).toDate());
-      }
-    }, [isAfterMaxDate, getDatesByPeriod, onChange, onForward]);
+    }, [isAfterMaxDate, getDatesByPeriod, onChange, onForward]);
     var onLeftClickHandler = React.useCallback(function () {
       if (isBeforeMinDate) {
         return;
@@ -12127,24 +11272,24 @@
         _getDatesByPeriod4 = _slicedToArray(_getDatesByPeriod3, 2),
         newFrom = _getDatesByPeriod4[0],
         newTo = _getDatesByPeriod4[1];
-      setFromDate(moment__default$1["default"].utc(newFrom));
-      setToDate(moment__default$1["default"].utc(newTo));
+      setFromDate(moment__default["default"].utc(newFrom));
+      setToDate(moment__default["default"].utc(newTo));
       if (onChange) {
-        onChange(moment__default$1["default"].utc(newFrom), moment__default$1["default"].utc(newTo));
+        onChange(moment__default["default"].utc(newFrom), moment__default["default"].utc(newTo));
       }
       if (onBack) {
-        onBack(moment__default$1["default"].utc(newFrom).toDate(), moment__default$1["default"].utc(newTo).toDate());
+        onBack(moment__default["default"].utc(newFrom).toDate(), moment__default["default"].utc(newTo).toDate());
       }
     }, [isBeforeMinDate, getDatesByPeriod, onChange, onBack]);
     var renderLeftRightButtons = React.useMemo(function () {
       return step !== "range";
     }, [step]);
     React.useEffect(function () {
-      setFromDate(moment__default$1["default"].utc(from));
-      setToDate(moment__default$1["default"].utc(to));
+      setFromDate(moment__default["default"].utc(from));
+      setToDate(moment__default["default"].utc(to));
     }, [from, to]);
     var dateStepperWidth = function dateStepperWidth(fromDay, toDay, range) {
-      if (fromDay.utc().year() !== moment__default$1["default"].utc().year() || toDay.utc().year() !== moment__default$1["default"].utc().year()) {
+      if (fromDay.utc().year() !== moment__default["default"].utc().year() || toDay.utc().year() !== moment__default["default"].utc().year()) {
         switch (range) {
           case "daily":
           case "monthly":
@@ -12174,9 +11319,9 @@
       };
     };
     var isDisabled = React.useCallback(function (day) {
-      var dayFormat = moment__default$1["default"].utc(day).format("YYYY-MM-DD");
-      var isBefore = moment__default$1["default"].isMoment(maxValue) && moment__default$1["default"](moment__default$1["default"].utc(maxValue).format("YYYY-MM-DD")).isBefore(dayFormat);
-      var isAfter = moment__default$1["default"].isMoment(minValue) && moment__default$1["default"](moment__default$1["default"].utc(minValue).format("YYYY-MM-DD")).isAfter(dayFormat);
+      var dayFormat = moment__default["default"].utc(day).format("YYYY-MM-DD");
+      var isBefore = moment__default["default"].isMoment(maxValue) && moment__default["default"](moment__default["default"].utc(maxValue).format("YYYY-MM-DD")).isBefore(dayFormat);
+      var isAfter = moment__default["default"].isMoment(minValue) && moment__default["default"](moment__default["default"].utc(minValue).format("YYYY-MM-DD")).isAfter(dayFormat);
       return isBefore || isAfter;
     }, [maxValue, minValue]);
     var modifiers = React.useMemo(function () {
@@ -12206,15 +11351,15 @@
       $isTargetable: step === "yearly" || !withDatePicker,
       $isRounded: step === "range",
       style: dateStepperWidth(fromDate, toDate, step)
-    }, withDatePicker && step !== "yearly" ? /*#__PURE__*/React__default["default"].createElement(DatePickerV2, {
+    }, withDatePicker && step !== "yearly" ? /*#__PURE__*/React__default["default"].createElement(DatePicker, {
       month: defaultMonth,
       target: /*#__PURE__*/React__default["default"].createElement(StyledButton$1, {
         type: "button"
       }, getDateFormatted),
       mode: datePickerMode,
       selected: {
-        from: moment__default$1["default"].utc(fromDate).unix(),
-        to: moment__default$1["default"].utc(toDate).unix()
+        from: moment__default["default"].utc(fromDate).unix(),
+        to: moment__default["default"].utc(toDate).unix()
       },
       onChange: onDatePickerChange,
       firstDayOfWeek: period === "week" ? 0 : 1,
@@ -12234,7 +11379,7 @@
       disabled: isAfterMaxDate
     }, /*#__PURE__*/React__default["default"].createElement(ArrowRightIcon$1, null)) : null);
   };
-  DateStepperV2.displayName = "DateStepperV2";
+  DateStepper.displayName = "DateStepper";
 
   var StyledSteps = styled__default["default"].div.withConfig({
     displayName: "Styles__StyledSteps",
@@ -17676,11 +16821,11 @@
       isOpen = _useState2[0],
       setIsOpen = _useState2[1];
     var generateTimeOptions = function generateTimeOptions() {
-      var minTime = moment__default["default"](isValidTime(min) ? min : "00:00", "HH:mm");
-      var maxTime = moment__default["default"](isValidTime(max) ? max : "23:45", "HH:mm");
+      var minTime = moment__default$1["default"](isValidTime(min) ? min : "00:00", "HH:mm");
+      var maxTime = moment__default$1["default"](isValidTime(max) ? max : "23:45", "HH:mm");
       var allOptions = [];
-      var currentTime = moment__default["default"]("00:00", "HH:mm");
-      while (currentTime.isBefore(moment__default["default"]("24:00", "HH:mm"))) {
+      var currentTime = moment__default$1["default"]("00:00", "HH:mm");
+      while (currentTime.isBefore(moment__default$1["default"]("24:00", "HH:mm"))) {
         allOptions.push({
           id: currentTime.format("HH:mm"),
           name: currentTime.format(mode === "12" ? "hh:mm A" : "HH:mm")
@@ -17688,7 +16833,7 @@
         currentTime.add(step, "minutes");
       }
       return allOptions.filter(function (option) {
-        return moment__default["default"](option.id, "HH:mm").isSameOrAfter(minTime) && moment__default["default"](option.id, "HH:mm").isSameOrBefore(maxTime);
+        return moment__default$1["default"](option.id, "HH:mm").isSameOrAfter(minTime) && moment__default$1["default"](option.id, "HH:mm").isSameOrBefore(maxTime);
       });
     };
     var timeOptions = generateTimeOptions();
@@ -17706,7 +16851,7 @@
       var doc = nlp__default["default"](text);
       var parsed = doc.times().get()[0];
       if (parsed && parsed["24h"] && parsed["24h"] !== selected) {
-        var value = moment__default["default"](parsed).format("HH:mm");
+        var value = moment__default$1["default"](parsed).format("HH:mm");
         if (timeOptions.some(function (option) {
           return option.id === value;
         })) {
@@ -18846,85 +17991,6 @@
   })(["span,svg{cursor:pointer;}span{color:var(--color-secondary);}svg:hover{fill:var(--color-secondary);}"]);
   StyledIconComponent.displayName = "StyledIconComponent";
 
-  var DatePickerForm = function DatePickerForm(_ref) {
-    var mode = _ref.mode,
-      _ref$saveButtonText = _ref.saveButtonText,
-      saveButtonText = _ref$saveButtonText === void 0 ? "Save" : _ref$saveButtonText,
-      _ref$cancelButtonText = _ref.cancelButtonText,
-      cancelButtonText = _ref$cancelButtonText === void 0 ? "Cancel" : _ref$cancelButtonText,
-      _ref$clearButtonText = _ref.clearButtonText,
-      clearButtonText = _ref$clearButtonText === void 0 ? "Clear" : _ref$clearButtonText,
-      onSave = _ref.onSave,
-      onCancel = _ref.onCancel,
-      onClear = _ref.onClear,
-      _ref$dateRequired = _ref.dateRequired,
-      dateRequired = _ref$dateRequired === void 0 ? false : _ref$dateRequired,
-      _ref$firstDayOfWeek = _ref.firstDayOfWeek,
-      firstDayOfWeek = _ref$firstDayOfWeek === void 0 ? 0 : _ref$firstDayOfWeek,
-      selectedDays = _ref.selectedDays,
-      _ref$selectionMode = _ref.selectionMode,
-      selectionMode = _ref$selectionMode === void 0 ? "custom" : _ref$selectionMode,
-      onChange = _ref.onChange,
-      onDayClick = _ref.onDayClick,
-      onMonthChange = _ref.onMonthChange,
-      month = _ref.month,
-      _ref$disabledSaveButt = _ref.disabledSaveButton,
-      disabledSaveButton = _ref$disabledSaveButt === void 0 ? false : _ref$disabledSaveButt,
-      modifiers = _ref.modifiers,
-      renderDay = _ref.renderDay;
-    var handleOnKeyDown = React.useCallback(function (e) {
-      if (e.key === "Enter" && typeof onSave === "function") {
-        onSave();
-      } else if ((e.key === "Esc" || e.key === "Escape") && typeof onCancel === "function") {
-        onCancel(e);
-      }
-    }, [onSave, onCancel]);
-    return /*#__PURE__*/React__default["default"].createElement("div", {
-      onKeyDown: handleOnKeyDown,
-      tabIndex: -1,
-      className: "date-picker-form"
-    }, /*#__PURE__*/React__default["default"].createElement(StyledSelectDateDatePicker, null, /*#__PURE__*/React__default["default"].createElement(DatePicker, {
-      month: month,
-      onMonthChange: onMonthChange,
-      onChange: onChange,
-      onDayClick: onDayClick,
-      selectedDays: selectedDays,
-      selectionMode: selectionMode,
-      dateRequired: dateRequired,
-      firstDayOfWeek: firstDayOfWeek,
-      modifiers: modifiers,
-      renderDay: renderDay
-    })), mode === "atomic" || !dateRequired ? /*#__PURE__*/React__default["default"].createElement(StyledSelectDateFooter, {
-      className: "date-picker-footer",
-      $mode: mode
-    }, mode === "atomic" ? /*#__PURE__*/React__default["default"].createElement(StyledSelectDateButtons, {
-      className: "date-picker-buttons"
-    }, /*#__PURE__*/React__default["default"].createElement(StyledButtonSave, {
-      size: "small",
-      variant: "primary",
-      onClick: onSave,
-      disabled: disabledSaveButton
-    }, saveButtonText), /*#__PURE__*/React__default["default"].createElement(Tooltip, {
-      title: cancelButtonText,
-      popperTooltipStyle: {
-        zIndex: 1301
-      }
-    }, /*#__PURE__*/React__default["default"].createElement(IconButton, {
-      size: "small",
-      variant: "text gray",
-      onClick: onCancel
-    }, /*#__PURE__*/React__default["default"].createElement(CancelCrossIcon$1, null))), !dateRequired ? /*#__PURE__*/React__default["default"].createElement(StyledButtonClose, {
-      size: "small",
-      onClick: onClear,
-      variant: "text gray"
-    }, clearButtonText) : null) : !dateRequired && /*#__PURE__*/React__default["default"].createElement(StyledButtonCloseColored, {
-      size: "small",
-      onClick: onClear,
-      variant: "text colored"
-    }, clearButtonText)) : null);
-  };
-  DatePickerForm.displayName = "DatePickerForm";
-
   var SelectDateTarget = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var IconComponent = _ref.icon,
       _ref$title = _ref.title,
@@ -18968,11 +18034,11 @@
     var date;
     var year;
     if (typeof value === "number") {
-      date = moment__default["default"].unix(value);
-      year = moment__default["default"]().utc().year();
+      date = moment__default$1["default"].unix(value);
+      year = moment__default$1["default"]().utc().year();
     } else {
-      date = moment__default["default"](value);
-      year = moment__default["default"]().year();
+      date = moment__default$1["default"](value);
+      year = moment__default$1["default"]().year();
     }
     if (!long) {
       if (date.year() === year) {
@@ -18982,427 +18048,17 @@
     return date.format(format);
   };
 
-  var defaultParams = {
-    locale: "en-US",
-    dateFormat: "MMM D. YYYY",
-    timeFormat: "HH:mm a",
-    decimalSeparator: ".",
-    thousandSeparator: ",",
-    decimalRounding: 0,
-    decimalSpaces: 2,
-    currencyCode: "USD",
-    t: function t(value) {
-      return value;
-    }
-  };
-  var LocalizationContext = /*#__PURE__*/React__default["default"].createContext(defaultParams);
-  var useLocalization = function useLocalization() {
-    return React__default["default"].useContext(LocalizationContext);
-  };
-
-  var getUtcTimestampFromDate = function getUtcTimestampFromDate(date) {
-    return moment__default["default"].utc([date.getFullYear(), date.getMonth(), date.getDate()]).unix();
-  };
-  var isDayInRange$1 = function isDayInRange(day, data) {
-    if (data.repeating) {
-      var from = new Date(day.getFullYear(), data.from.getMonth(), data.from.getDate());
-      var to = new Date(day.getFullYear(), data.to.getMonth(), data.to.getDate());
-      return day >= from && day <= to;
-    }
-    return day >= data.from && day <= data.to;
-  };
-  var SelectDate = function SelectDate(_ref) {
-    var _ref$changeMode = _ref.changeMode,
-      mode = _ref$changeMode === void 0 ? "instant" : _ref$changeMode,
-      _ref$trigger = _ref.trigger,
-      labelType = _ref$trigger === void 0 ? "text" : _ref$trigger,
-      _ref$saveButtonText = _ref.saveButtonText,
-      saveButtonText = _ref$saveButtonText === void 0 ? "Save" : _ref$saveButtonText,
-      _ref$cancelButtonText = _ref.cancelButtonText,
-      cancelButtonText = _ref$cancelButtonText === void 0 ? "Cancel" : _ref$cancelButtonText,
-      _ref$clearButtonText = _ref.clearButtonText,
-      clearButtonText = _ref$clearButtonText === void 0 ? "Clear" : _ref$clearButtonText,
-      _ref$modalHeaderText = _ref.modalHeaderText,
-      modalHeaderText = _ref$modalHeaderText === void 0 ? "Discard changes?" : _ref$modalHeaderText,
-      _ref$modalDiscardMess = _ref.modalDiscardMessage,
-      modalDiscardMessage = _ref$modalDiscardMess === void 0 ? "All unsaved changes will be lost." : _ref$modalDiscardMess,
-      _ref$modalDiscardBtnT = _ref.modalDiscardBtnText,
-      modalDiscardBtnText = _ref$modalDiscardBtnT === void 0 ? "OK" : _ref$modalDiscardBtnT,
-      _ref$modalCancelBtnTe = _ref.modalCancelBtnText,
-      modalCancelBtnText = _ref$modalCancelBtnTe === void 0 ? "Cancel" : _ref$modalCancelBtnTe,
-      onDayClick = _ref.onDayClick,
-      onSave = _ref.onSave,
-      onCancel = _ref.onCancel,
-      onToggleDatePicker = _ref.onToggleDatePicker,
-      _ref$required = _ref.required,
-      dateRequired = _ref$required === void 0 ? false : _ref$required,
-      _ref$defaultTimezoneA = _ref.defaultTimezoneAware,
-      defaultTimezoneAware = _ref$defaultTimezoneA === void 0 ? false : _ref$defaultTimezoneA,
-      _ref$longDateFormat = _ref.longDateFormat,
-      longDateFormat = _ref$longDateFormat === void 0 ? false : _ref$longDateFormat,
-      _ref$defaultShowDateP = _ref.defaultShowDatePicker,
-      defaultShowDatePicker = _ref$defaultShowDateP === void 0 ? false : _ref$defaultShowDateP,
-      _ref$firstDayOfWeek = _ref.firstDayOfWeek,
-      firstDayOfWeek = _ref$firstDayOfWeek === void 0 ? 0 : _ref$firstDayOfWeek,
-      selectedDays = _ref.selectedDays,
-      _ref$selectionMode = _ref.selectionMode,
-      selectionMode = _ref$selectionMode === void 0 ? "custom" : _ref$selectionMode,
-      menuClassName = _ref.menuClassName,
-      targetClassName = _ref.targetClassName,
-      icon = _ref.icon,
-      _ref$defaultLabelText = _ref.defaultLabelText,
-      defaultLabelText = _ref$defaultLabelText === void 0 ? "Set..." : _ref$defaultLabelText,
-      targetTextClassName = _ref.targetTextClassName,
-      targetIconClassName = _ref.targetIconClassName,
-      backgroundElementClass = _ref.backgroundElementClass,
-      passedDateFormat = _ref.dateFormat,
-      defaultMonth = _ref.defaultMonth,
-      _ref$daysToModify = _ref.daysToModify,
-      daysToModify = _ref$daysToModify === void 0 ? [] : _ref$daysToModify,
-      _ref$weekends = _ref.weekends,
-      weekends = _ref$weekends === void 0 ? [] : _ref$weekends,
-      _ref$weekendLabel = _ref.weekendLabel,
-      weekendLabel = _ref$weekendLabel === void 0 ? "Weekend" : _ref$weekendLabel,
-      _ref$nonWorkingDaysOf = _ref.nonWorkingDaysOfWeek,
-      nonWorkingDaysOfWeek = _ref$nonWorkingDaysOf === void 0 ? [] : _ref$nonWorkingDaysOf,
-      _ref$nonWorkingDaysOf2 = _ref.nonWorkingDaysOfWeekLabel,
-      nonWorkingDaysOfWeekLabel = _ref$nonWorkingDaysOf2 === void 0 ? "Unavailable" : _ref$nonWorkingDaysOf2,
-      _ref$weekendIsSelecta = _ref.weekendIsSelectable,
-      weekendIsSelectable = _ref$weekendIsSelecta === void 0 ? false : _ref$weekendIsSelecta,
-      tooltipText = _ref.tooltipText,
-      popperTooltipClassName = _ref.popperTooltipClassName,
-      popperClassName = _ref.popperClassName,
-      popperTooltipStyle = _ref.popperTooltipStyle,
-      position = _ref.position,
-      disableDaysBefore = _ref.disableDaysBefore;
-    var _useState = React.useState(defaultTimezoneAware),
-      _useState2 = _slicedToArray(_useState, 2),
-      timezoneAware = _useState2[0],
-      setTimezoneAware = _useState2[1];
-    var localization = useLocalization();
-    var dateFormat = passedDateFormat ? passedDateFormat : localization.dateFormat;
-    var labelText = React.useMemo(function () {
-      if (!selectedDays) {
-        return defaultLabelText;
-      } else {
-        var endDate = timezoneAware ? moment__default["default"].unix(selectedDays.to).local() : moment__default["default"].unix(selectedDays.to).utc();
-        var startDate = timezoneAware ? moment__default["default"].unix(selectedDays.from).local() : moment__default["default"].unix(selectedDays.from).utc();
-        var formattedEndDate = formatDate(endDate, dateFormat, longDateFormat);
-        var formattedStartDate = formatDate(startDate, dateFormat, longDateFormat);
-        if (selectedDays.from === selectedDays.to) {
-          return formattedEndDate;
-        }
-        return "".concat(formattedStartDate, " - ").concat(formattedEndDate);
-      }
-    }, [selectedDays, dateFormat, timezoneAware, defaultLabelText, longDateFormat]);
-    var modifiedDates = React.useMemo(function () {
-      if (typeof selectedDays === "object" && !!selectedDays.from && !!selectedDays.to) {
-        if (timezoneAware) {
-          return {
-            from: moment__default["default"].unix(selectedDays.from).toDate(),
-            to: moment__default["default"].unix(selectedDays.to).toDate()
-          };
-        }
-        var offsetFrom = moment__default["default"].unix(selectedDays.from).utcOffset() * 60;
-        var offsetTo = moment__default["default"].unix(selectedDays.to).utcOffset() * 60;
-        return {
-          from: new Date((selectedDays.from - offsetFrom) * 1000),
-          to: new Date((selectedDays.to - offsetTo) * 1000)
-        };
-      }
-    }, [selectedDays, timezoneAware]);
-    var handleModifiedSave = React.useCallback(function (selectedDates) {
-      setTimezoneAware(false);
-      if (typeof onSave === "function") {
-        if (typeof selectedDates === "object" && Object.prototype.hasOwnProperty.call(selectedDates, "from") && Object.prototype.hasOwnProperty.call(selectedDates, "to")) {
-          onSave({
-            from: getUtcTimestampFromDate(selectedDates.from),
-            to: getUtcTimestampFromDate(selectedDates.to)
-          });
-        } else {
-          onSave(undefined);
-        }
-      }
-    }, [onSave]);
-    var getDefaultMonth = React.useCallback(function () {
-      var date = new Date();
-      if (typeof selectedDays === "object" && !!selectedDays.from) {
-        date = timezoneAware ? new Date(selectedDays.from * 1000) : new Date((selectedDays.from - moment__default["default"].unix(selectedDays.from).utcOffset() * 60) * 1000);
-      } else if (defaultMonth) {
-        date = defaultMonth;
-      }
-
-      // forcing second day in month
-      return new Date(date.getFullYear(), date.getMonth(), 2);
-    }, [defaultMonth, selectedDays, timezoneAware]);
-    var _useState3 = React.useState(getDefaultMonth),
-      _useState4 = _slicedToArray(_useState3, 2),
-      month = _useState4[0],
-      setMonth = _useState4[1];
-    var handleMonthChange = React.useCallback(function (month) {
-      setMonth(month);
-    }, [setMonth]);
-    var _useState5 = React.useState(modifiedDates),
-      _useState6 = _slicedToArray(_useState5, 2),
-      newDates = _useState6[0],
-      setNewDates = _useState6[1];
-    var _useState7 = React.useState(false),
-      _useState8 = _slicedToArray(_useState7, 2),
-      showDiscardModal = _useState8[0],
-      setShowDiscardModal = _useState8[1];
-    var _useState9 = React.useState(defaultShowDatePicker),
-      _useState10 = _slicedToArray(_useState9, 2),
-      showDatePicker = _useState10[0],
-      setShowDatePicker = _useState10[1];
-    var disabledSaveButton = React.useMemo(function () {
-      return (modifiedDates === null || modifiedDates === void 0 ? void 0 : modifiedDates.from) === (newDates === null || newDates === void 0 ? void 0 : newDates.from) && (modifiedDates === null || modifiedDates === void 0 ? void 0 : modifiedDates.to) === (newDates === null || newDates === void 0 ? void 0 : newDates.to);
-    }, [modifiedDates, newDates]);
-    React.useEffect(function () {
-      setShowDatePicker(defaultShowDatePicker);
-    }, [defaultShowDatePicker]);
-    React.useEffect(function () {
-      setNewDates(modifiedDates);
-    }, [modifiedDates]);
-    React.useEffect(function () {
-      typeof onToggleDatePicker === "function" && onToggleDatePicker(showDatePicker);
-    }, [showDatePicker, onToggleDatePicker]);
-    React.useEffect(function () {
-      if (!showDatePicker) {
-        setMonth(getDefaultMonth());
-      }
-    }, [showDatePicker, getDefaultMonth]);
-    var handleSave = React.useCallback(function () {
-      handleModifiedSave(newDates);
-      setShowDatePicker(false);
-    }, [newDates, handleModifiedSave]);
-    var handleChange = React.useCallback(function (dates) {
-      if (mode !== "atomic") {
-        handleModifiedSave(dates);
-      }
-      setNewDates(dates);
-    }, [mode, handleModifiedSave]);
-    var handleBeforeCloseMenu = React.useCallback(function () {
-      var result = true;
-      if (modifiedDates && !newDates || !modifiedDates && newDates) {
-        result = false;
-      }
-      var selectedDaysFrom = modifiedDates === null || modifiedDates === void 0 ? void 0 : modifiedDates.from;
-      var selectedDaysTo = modifiedDates === null || modifiedDates === void 0 ? void 0 : modifiedDates.to;
-      var newDatesFrom = newDates === null || newDates === void 0 ? void 0 : newDates.from;
-      var newDatesTo = newDates === null || newDates === void 0 ? void 0 : newDates.to;
-      if (selectedDaysFrom && newDatesFrom && selectedDaysTo && newDatesTo && (moment__default["default"](selectedDaysFrom).format("DD-MM-YYYY") !== moment__default["default"](newDatesFrom).format("DD-MM-YYYY") || moment__default["default"](selectedDaysTo).format("DD-MM-YYYY") !== moment__default["default"](newDatesTo).format("DD-MM-YYYY"))) {
-        result = false;
-      }
-      if (!result) {
-        setShowDiscardModal(true);
-      }
-      return result;
-    }, [modifiedDates, newDates]);
-    var handleClose = React.useCallback(function () {
-      if (mode !== "atomic" || handleBeforeCloseMenu()) {
-        typeof onCancel === "function" && onCancel();
-        setShowDatePicker(false);
-      }
-    }, [mode, onCancel, handleBeforeCloseMenu]);
-    var handleCancel = React.useCallback(function (event) {
-      event && event.preventDefault();
-      return handleClose();
-    }, [handleClose]);
-    var handleShowDatePicker = React.useCallback(function () {
-      setShowDatePicker(!showDatePicker);
-    }, [showDatePicker]);
-    var handleCloseDiscardModal = React.useCallback(function () {
-      setShowDiscardModal(false);
-    }, []);
-    var handleClear = React.useCallback(function () {
-      if (!dateRequired) {
-        setNewDates(undefined);
-        if (mode === "instant") {
-          handleModifiedSave(undefined);
-        }
-      }
-    }, [mode, dateRequired, handleModifiedSave]);
-    var handleSaveDiscardModal = React.useCallback(function () {
-      setNewDates(modifiedDates);
-      setShowDiscardModal(false);
-      setShowDatePicker(false);
-    }, [modifiedDates]);
-    var modifiers = React.useMemo(function () {
-      var userAvailabilities = daysToModify.filter(function (data) {
-        return data.type === "user_day_off";
-      });
-      var globalDaysOff = daysToModify.filter(function (data) {
-        return data.type === "global_day_off";
-      });
-      var selectableGlobalDaysOff = daysToModify.filter(function (data) {
-        return data.type === "selectable_global_day_off";
-      });
-      return {
-        userAvailability: function userAvailability(day) {
-          // construct new date because react-day-picker returns date with hours set
-          var currentDay = new Date(day.getFullYear(), day.getMonth(), day.getDate());
-          return userAvailabilities.some(function (data) {
-            return isDayInRange$1(currentDay, data);
-          });
-        },
-        weekend: function weekend(day) {
-          return weekends.some(function (value) {
-            return day.getDay() === value;
-          });
-        },
-        nonWorkingDay: function nonWorkingDay(day) {
-          // return true if day is weekend day
-          if (weekends.some(function (value) {
-            return value === day.getDay();
-          })) {
-            return true;
-          }
-          var nonWorkingDays = [...selectableGlobalDaysOff, ...globalDaysOff];
-          var currentDay = new Date(day.getFullYear(), day.getMonth(), day.getDate());
-          return nonWorkingDays.some(function (data) {
-            return isDayInRange$1(currentDay, data);
-          });
-        },
-        day_disabled: function day_disabled(day) {
-          if (disableDaysBefore) {
-            if (day.toJSON().slice(0, 10) < disableDaysBefore.toJSON().slice(0, 10)) {
-              return true;
-            }
-          }
-          // return true if day is weekend day
-          if (!weekendIsSelectable && weekends.some(function (value) {
-            return value === day.getDay();
-          })) {
-            return true;
-          }
-          // construct new date because react-day-picker returns date with hours set
-          var currentDay = new Date(day.getFullYear(), day.getMonth(), day.getDate());
-          return globalDaysOff.some(function (data) {
-            return isDayInRange$1(currentDay, data);
-          });
-        },
-        nonWorkingDaysOfWeek: {
-          dayOfWeek: nonWorkingDaysOfWeek
-        }
-      };
-    }, [daysToModify, nonWorkingDaysOfWeek, weekends, disableDaysBefore, weekendIsSelectable]);
-    var renderDay = React.useCallback(function (props) {
-      var titles = [];
-      if (weekends.some(function (value) {
-        return props.date.getDay() === value;
-      })) {
-        titles.push(weekendLabel);
-      }
-      if (nonWorkingDaysOfWeek.includes(props.date.getDay())) {
-        titles.push(nonWorkingDaysOfWeekLabel);
-      }
-
-      // construct new date because react-day-picker returns date with hours set
-      var currentDay = new Date(props.date.getFullYear(), props.date.getMonth(), props.date.getDate());
-      daysToModify.forEach(function (data) {
-        if (isDayInRange$1(currentDay, data)) {
-          titles.push(data.title);
-        }
-      });
-      var child = /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "c-DayPicker-Day-Number"
-      }, props.date.getDate());
-      if (titles.length) {
-        var title = /*#__PURE__*/React__default["default"].createElement("div", {
-          key: "title-wrapper-".concat(props.date.getDate())
-        }, titles.map(function (title, index) {
-          return /*#__PURE__*/React__default["default"].createElement("div", {
-            key: "title-text-".concat(index)
-          }, title);
-        }));
-        return /*#__PURE__*/React__default["default"].createElement(Tooltip, {
-          title: title,
-          popperTooltipClassName: popperTooltipClassName,
-          popperTooltipStyle: popperTooltipStyle
-        }, child);
-      }
-      return child;
-    }, [weekends, nonWorkingDaysOfWeek, daysToModify, weekendLabel, nonWorkingDaysOfWeekLabel, popperTooltipClassName, popperTooltipStyle]);
-    var renderDatePickerForm = React.useCallback(function () {
-      return /*#__PURE__*/React__default["default"].createElement(DatePickerForm, {
-        onMonthChange: handleMonthChange,
-        month: month,
-        mode: mode,
-        selectionMode: selectionMode,
-        dateRequired: dateRequired,
-        selectedDays: newDates,
-        firstDayOfWeek: firstDayOfWeek,
-        saveButtonText: saveButtonText,
-        cancelButtonText: cancelButtonText,
-        clearButtonText: clearButtonText,
-        onDayClick: onDayClick,
-        onSave: handleSave,
-        onChange: handleChange,
-        onCancel: handleCancel,
-        onClear: handleClear,
-        disabledSaveButton: disabledSaveButton,
-        modifiers: modifiers,
-        renderDay: renderDay
-      });
-    }, [handleMonthChange, month, mode, selectionMode, dateRequired, newDates, firstDayOfWeek, saveButtonText, cancelButtonText, clearButtonText, onDayClick, handleSave, handleChange, handleCancel, handleClear, disabledSaveButton, modifiers, renderDay]);
-    var renderTargetEl = React.useMemo(function () {
-      if (labelType === "icon" && icon) {
-        return /*#__PURE__*/React__default["default"].createElement(SelectDateTarget, {
-          icon: icon,
-          title: tooltipText,
-          targetIconClassName: targetIconClassName,
-          forceHideTooltip: showDatePicker,
-          popperTooltipClassName: popperTooltipClassName,
-          popperTooltipStyle: popperTooltipStyle,
-          active: showDatePicker
-        });
-      }
-      if (typeof labelType === "function") {
-        return labelType(labelText);
-      }
-      return /*#__PURE__*/React__default["default"].createElement(StyledSelectDateButton, {
-        type: "button",
-        className: classNames__default["default"]("date-picker-target", targetClassName)
-      }, /*#__PURE__*/React__default["default"].createElement("span", {
-        className: targetTextClassName
-      }, labelText));
-    }, [icon, labelText, labelType, popperTooltipClassName, popperTooltipStyle, showDatePicker, targetClassName, targetIconClassName, targetTextClassName, tooltipText]);
-    return /*#__PURE__*/React__default["default"].createElement(StyledSelectDate, {
-      className: "select-date"
-    }, labelType !== "inline" ? /*#__PURE__*/React__default["default"].createElement(Menu, {
-      target: renderTargetEl,
-      open: showDatePicker,
-      onOpen: handleShowDatePicker,
-      onBeforeClose: handleBeforeCloseMenu,
-      onClose: handleClose,
-      position: position,
-      menuClassName: menuClassName,
-      popperClassName: popperClassName,
-      backgroundElementClass: backgroundElementClass
-    }, renderDatePickerForm()) : renderDatePickerForm(), mode === "atomic" ? /*#__PURE__*/React__default["default"].createElement(StyledConfirmDialog, {
-      className: "modal-select-date",
-      open: showDiscardModal,
-      onCancel: handleCloseDiscardModal,
-      onConfirm: handleSaveDiscardModal,
-      dialogTitle: modalHeaderText,
-      dialogContent: modalDiscardMessage,
-      cancelBtnText: modalCancelBtnText,
-      confirmBtnText: modalDiscardBtnText
-    }) : null);
-  };
-  SelectDate.displayName = "SelectDate";
-
   var isDayInRange = function isDayInRange(day, data) {
-    var fromMoment = moment__default$1["default"].unix(data.from).utc();
-    var toMoment = moment__default$1["default"].unix(data.to).utc();
+    var fromMoment = moment__default["default"].unix(data.from).utc();
+    var toMoment = moment__default["default"].unix(data.to).utc();
     if (data.repeating) {
       var year = day.year();
-      var from = moment__default$1["default"].utc({
+      var from = moment__default["default"].utc({
         year,
         month: fromMoment.month(),
         date: fromMoment.date()
       });
-      var to = moment__default$1["default"].utc({
+      var to = moment__default["default"].utc({
         year,
         month: toMoment.month(),
         date: toMoment.date()
@@ -19411,7 +18067,7 @@
     }
     return day.isSameOrAfter(fromMoment, "day") && day.isSameOrBefore(toMoment, "day");
   };
-  var SelectDateV2 = function SelectDateV2(_ref) {
+  var SelectDate = function SelectDate(_ref) {
     var _ref$changeMode = _ref.changeMode,
       mode = _ref$changeMode === void 0 ? "instant" : _ref$changeMode,
       _ref$trigger = _ref.trigger,
@@ -19577,7 +18233,7 @@
     }, [icon, labelText, labelType, popperTooltipClassName, popperTooltipStyle, targetClassName, targetIconClassName, targetTextClassName, tooltipText]);
     return /*#__PURE__*/React__default["default"].createElement(StyledSelectDate, {
       className: "select-date"
-    }, labelType !== "inline" ? /*#__PURE__*/React__default["default"].createElement(DatePickerV2, {
+    }, labelType !== "inline" ? /*#__PURE__*/React__default["default"].createElement(DatePicker, {
       target: renderTargetEl,
       position: position,
       menuClassName: menuClassName,
@@ -19612,7 +18268,7 @@
       disableYearPicker: !enableYearPicker,
       disableAnimations: disableAnimations,
       showControls: true
-    }) : /*#__PURE__*/React__default["default"].createElement(DatePickerV2, {
+    }) : /*#__PURE__*/React__default["default"].createElement(DatePicker, {
       month: defaultMonth,
       instant: mode === "instant",
       mode: selectionMode,
@@ -19637,7 +18293,7 @@
       open: true
     }));
   };
-  SelectDateV2.displayName = "SelectDateV2";
+  SelectDate.displayName = "SelectDate";
 
   var StyledToastMessage = styled__default["default"].div.withConfig({
     displayName: "Styles__StyledToastMessage",
@@ -19875,8 +18531,8 @@
       step = _ref$step === void 0 ? 15 : _ref$step,
       rest = _objectWithoutProperties(_ref, _excluded$m);
     var generateTimeOptions = function generateTimeOptions() {
-      var minTime = moment__default["default"](isValidTime(min) ? min : "00:00", "HH:mm");
-      var maxTime = moment__default["default"](isValidTime(max) ? max : "23:45", "HH:mm");
+      var minTime = moment__default$1["default"](isValidTime(min) ? min : "00:00", "HH:mm");
+      var maxTime = moment__default$1["default"](isValidTime(max) ? max : "23:45", "HH:mm");
       var options = [];
       var currentTime = minTime.clone();
       while (currentTime.isSameOrBefore(maxTime)) {
@@ -19889,7 +18545,7 @@
       return options;
     };
     var timeOptions = generateTimeOptions();
-    var displaySelectedTime = moment__default["default"](selected, "HH:mm").format(mode === "12" ? "hh:mm A" : "HH:mm");
+    var displaySelectedTime = moment__default$1["default"](selected, "HH:mm").format(mode === "12" ? "hh:mm A" : "HH:mm");
     var handleScrollToSelected = function handleScrollToSelected() {
       if (selected) {
         setTimeout(function () {
@@ -20564,15 +19220,18 @@
   var StyledSpan = styled__default["default"](Typography).withConfig({
     displayName: "Styles__StyledSpan",
     componentId: "sc-1wapx2a-1"
-  })(["visibility:hidden;display:block;padding-left:4px;padding-right:4px;padding-top:1px;padding-bottom:1px;position:relative;border:1px solid transparent;border-radius:6px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:pre;font-variant-numeric:tabular-nums;", " &:empty:before{content:\" \";}"], function (_ref) {
+  })(["visibility:hidden;display:block;padding-left:4px;padding-right:4px;padding-top:1px;padding-bottom:1px;position:relative;border:1px solid transparent;border-radius:6px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:pre;font-variant-numeric:tabular-nums;", " ", " &:empty:before{content:\" \";}"], function (_ref) {
     var $disabled = _ref.$disabled;
     return $disabled && styled.css(["visibility:visible;"]);
+  }, function (_ref2) {
+    var invalid = _ref2.invalid;
+    return invalid && styled.css(["border:1px solid var(--red-alert);"]);
   });
   StyledSpan.displayName = "StyledSpan";
   var StyledInput$1 = styled__default["default"](Typography).withConfig({
     displayName: "Styles__StyledInput",
     componentId: "sc-1wapx2a-2"
-  })(["", " background-color:inherit;padding-left:4px;padding-right:4px;padding-top:1px;padding-bottom:1px;text-overflow:ellipsis;font-variant-numeric:tabular-nums;&:focus-whitin{text-overflow:clip;}outline-width:0px;outline:none;&:disabled{opacity:0;}"], {
+  })(["", " background-color:inherit;padding-left:4px;padding-right:4px;padding-top:1px;padding-bottom:1px;text-overflow:ellipsis;font-variant-numeric:tabular-nums;&:focus-whitin{text-overflow:clip;}outline-width:0px;outline:none;&:disabled{opacity:0;}", ""], {
     "position": "absolute",
     "inset": "0px",
     "boxSizing": "border-box",
@@ -20590,10 +19249,13 @@
     ":hover": {
       "borderColor": "var(--color-theme-700)"
     }
+  }, function (_ref3) {
+    var invalid = _ref3.invalid;
+    return invalid && styled.css(["border-color:var(--red-alert) !important;"]);
   });
   StyledInput$1.displayName = "StyledInput";
 
-  var _excluded$g = ["className", "variant", "weight", "disabled", "inputProps", "wrapRef", "children"];
+  var _excluded$g = ["className", "variant", "weight", "disabled", "inputProps", "wrapRef", "children", "invalid"];
   var EditableContent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var className = _ref.className,
       _ref$variant = _ref.variant,
@@ -20604,6 +19266,7 @@
       inputProps = _ref.inputProps,
       wrapRef = _ref.wrapRef,
       children = _ref.children,
+      invalid = _ref.invalid,
       props = _objectWithoutProperties(_ref, _excluded$g);
     var intInputRef = React.useRef(null);
     var handleRef = useForkRef(ref, intInputRef);
@@ -20630,7 +19293,8 @@
       value: inputProps === null || inputProps === void 0 ? void 0 : inputProps.value,
       onBlur: handleBlur,
       disabled: disabled,
-      "data-form-type": "other"
+      "data-form-type": "other",
+      invalid: invalid
     })));
   });
   EditableContent.displayName = "EditableContent";
@@ -20801,7 +19465,7 @@
   });
   EditableHours.displayName = "EditableHours";
 
-  var _excluded$d = ["decimalLength", "decimalSeparator", "disableAbbreviation", "disabled", "disableMacros", "step", "thousandSeparator", "value", "onSave", "onCancel", "className", "allowEmptyValue", "onEnterKeyPress", "onClick", "onChange", "trimDecimals", "min", "max"];
+  var _excluded$d = ["decimalLength", "decimalSeparator", "disableAbbreviation", "disabled", "disableMacros", "step", "thousandSeparator", "value", "onSave", "onCancel", "className", "allowEmptyValue", "onEnterKeyPress", "onClick", "onChange", "trimDecimals", "min", "max", "invalid"];
   var EditableCurrency = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
     var _ref$decimalLength = _ref.decimalLength,
       decimalLength = _ref$decimalLength === void 0 ? 2 : _ref$decimalLength,
@@ -20828,6 +19492,7 @@
       trimDecimals = _ref$trimDecimals === void 0 ? true : _ref$trimDecimals,
       min = _ref.min,
       max = _ref.max,
+      invalid = _ref.invalid,
       rest = _objectWithoutProperties(_ref, _excluded$d);
     var inputRef = React.useRef(null);
     var handleRef = useForkRef(ref, inputRef);
@@ -20869,6 +19534,7 @@
       disabled: disabled,
       ref: handleRef,
       className: className,
+      invalid: invalid,
       inputProps: _objectSpread2({
         value: formattedValue,
         onBlur: onBlur,
@@ -22649,9 +21315,7 @@
   exports.CrownSelectedIcon = CrownSelectedIcon$1;
   exports.DataTable = DataTable;
   exports.DatePicker = DatePicker;
-  exports.DatePickerV2 = DatePickerV2;
   exports.DateStepper = DateStepper;
-  exports.DateStepperV2 = DateStepperV2;
   exports.DependencyIcon = DependencyIcon$1;
   exports.DependencySmallIcon = DependencySmallIcon$1;
   exports.DescriptionIcon = DescriptionIcon$1;
@@ -22770,7 +21434,6 @@
   exports.MultiAvatar = MultiAvatar;
   exports.MyWorkIcon = MyWorkIcon$1;
   exports.Nav = Nav;
-  exports.NavBarElement = NavBarElement;
   exports.NoteAddIcon = NoteAddIcon$1;
   exports.NoteIcon = NoteIcon$1;
   exports.NotebookIcon = NotebookIcon$1;
@@ -22839,7 +21502,6 @@
   exports.SearchLargeIcon = SearchLargeIcon$1;
   exports.Select = Select;
   exports.SelectDate = SelectDate;
-  exports.SelectDateV2 = SelectDateV2;
   exports.SelectTime = SelectTime;
   exports.SelectTrigger = SelectTrigger;
   exports.SendBlankIcon = SendBlankIcon$1;
@@ -22905,7 +21567,6 @@
   exports.Window = Window;
   exports.Wizard = Wizard;
   exports.WorkloadIcon = WorkloadIcon$1;
-  exports.YearMonthPicker = YearMonthPicker;
   exports._CommandPalette = _CommandPalette;
   exports._Dialog = _Dialog;
   exports._List = _List;