@innovaccer/design-system 2.28.1 → 2.28.2

package/css/src/components/avatarGroup.css

@@ -21,10 +21,9 @@
 }
 
 .AvatarGroup-TextWrapper {
-  padding-right: var(--spacing);
   display: flex;
   flex-direction: column;
-  align-items: flex-end;
+  align-items: flex-start;
   overflow-y: auto;
 }
 

package/dist/.lib/tsconfig.type.tsbuildinfo

@@ -297,7 +297,7 @@
         "affectsGlobalScope": false
       },
       "../../core/components/atoms/avatarGroup/AvatarCount.tsx": {
-        "version": "9988e292990f14ff0f0dca6ecaa213a5186e646630aec7a668f0c15b1c62beb4",
+        "version": "da401f3f5ca599afa1766898c4ee7d47eef9f89461338d3d403a9d1831e839bd",
         "signature": "28638b5b5c48afd430b5756033eefbe33a8098c1c0f56ee71b8c98c127808d1c",
         "affectsGlobalScope": false
       },
@@ -307,12 +307,12 @@
         "affectsGlobalScope": false
       },
       "../../core/components/atoms/avatarGroup/AvatarPopperBody.tsx": {
-        "version": "d5dd0d781b118bf6c8ebc82796ecb89d79cfd89836f10d19c62df023d1a2c8ff",
+        "version": "251491faf78c210aefe885e44f04f3006356976eadfa6609855286693393665b",
         "signature": "940659bdfd49091e44834ef4d58906fc661666cc467c523aa96a2155126a54f8",
         "affectsGlobalScope": false
       },
       "../../core/components/atoms/avatarGroup/AvatarGroup.tsx": {
-        "version": "00e07a879d4488cb0321aa4e666afc18293c05275c2f3002ba5679fd9b0106b6",
+        "version": "cbacea8958a3fa5cbbe3e6f5ee2f2d1729beb33c7ef37ff78ce41433a22e11a6",
         "signature": "ce3f3fd390bd9db8bae71aa4bd609a13cc1c13ff45b2a72f8de33ff7677e4cd6",
         "affectsGlobalScope": false
       },
@@ -397,7 +397,7 @@
         "affectsGlobalScope": false
       },
       "../../core/components/organisms/calendar/Calendar.tsx": {
-        "version": "165e8ac85f507625b0876165cd074d67f4e5eec9b0c02be6fd081b17db8040d9",
+        "version": "c8d32fe11e264047b15f879838072bbfca4ce87760c9dfa61ac8ca05a39f3821",
         "signature": "bd837ccd1ca55becef710a181dd2030665fc6a9d889f420e743d9bca9358e48e",
         "affectsGlobalScope": false
       },
@@ -532,8 +532,8 @@
         "affectsGlobalScope": false
       },
       "../../core/components/organisms/datePicker/DatePicker.tsx": {
-        "version": "eaffa8f30bc98a3b0229ae1dfc399bc47b20c882043f026d6f7e52b589126488",
-        "signature": "60130413fd988c89f00840e237722c22c1cb6827bc0da4d672949b9d941e2f9b",
+        "version": "644e587e02b97e870601ee783a5141c8c5c07c8e6c7932c4f6c61298024149d3",
+        "signature": "f99b8b90d961894ca71854163d356dfe66f9e96d3792223aee18970f4ba43eb5",
         "affectsGlobalScope": false
       },
       "../../core/components/organisms/datePicker/index.tsx": {
@@ -1202,7 +1202,7 @@
         "affectsGlobalScope": false
       },
       "../../core/components/atoms/popperWrapper/PopperWrapper.tsx": {
-        "version": "a9b0f82d2ae14e36df05c70e60ad62c2200abe32e03ac56f4e86bacf43304be4",
+        "version": "e3c046534f85b470978f22f70ddfa4e33b7f0050ca153938cc5b166591f086c7",
         "signature": "d3a1dcb83226bbb67f2a55e75d8024e63960ec04dbff72fef6e01a684ef16b0b",
         "affectsGlobalScope": false
       },
@@ -1247,7 +1247,7 @@
         "affectsGlobalScope": false
       },
       "../../core/components/organisms/dateRangePicker/Trigger.tsx": {
-        "version": "fba568d72c7d10f03e95d4fd134e437afd8c8bf14ff9fef0042e7c357671c240",
+        "version": "626a03934d0e0d9c25ccd3d5632d6fe734542542adbc6605609fb195cd45b27a",
         "signature": "8fb63e48afc23facf041aca8ebad538ec833649c1cb291890b8a7edb55a9b10c",
         "affectsGlobalScope": false
       },

package/dist/core/components/organisms/datePicker/DatePicker.d.ts

@@ -16,6 +16,8 @@ export declare type DatePickerProps = SharedProps & {
     closeOnSelect: boolean;
     showTodayDate?: boolean;
     children?: React.ReactNode;
+    onError?: (date: Date | undefined, dateVal?: string) => void;
+    popoverOptions?: PopoverOptions;
 };
 export interface DatePickerState {
     init: boolean;
@@ -23,6 +25,11 @@ export interface DatePickerState {
     error: boolean;
     open: boolean;
 }
+interface PopoverOptions {
+    appendToBody?: PopoverProps['appendToBody'];
+    hideOnReferenceEscape?: PopoverProps['hideOnReferenceEscape'];
+    boundaryElement?: PopoverProps['boundaryElement'];
+}
 export declare class DatePicker extends React.Component<DatePickerProps, DatePickerState> {
     static defaultProps: {
         position: string;

package/dist/index.esm.js

@@ -1,8 +1,8 @@
 
   /**
-   * Generated on: 1708350879254 
+   * Generated on: 1709017853977 
    *      Package: @innovaccer/design-system
-   *      Version: v2.28.1
+   *      Version: v2.28.2
    *      License: MIT
    *         Docs: https://innovaccer.github.io/design-system
    */
@@ -986,16 +986,18 @@ var AvatarCount = function AvatarCount(props) {
 
   var hiddenAvatarCount = props.hiddenAvatarCount,
       avatarStyle = props.avatarStyle,
-      size = props.size;
+      size = props.size,
+      on = props.on;
   var ContentClass = classnames((_classNames = {}, _defineProperty$1(_classNames, "Avatar-content--secondary", true), _defineProperty$1(_classNames, "Avatar-content--tiny", size === 'tiny'), _classNames));
   var AvatarVariantsClass = classnames((_classNames2 = {
     Avatar: true
-  }, _defineProperty$1(_classNames2, "Avatar--regular", size === 'regular'), _defineProperty$1(_classNames2, "Avatar--tiny", size === 'tiny'), _defineProperty$1(_classNames2, "Avatar--secondary", true), _defineProperty$1(_classNames2, 'Avatar--disabled', true), _classNames2));
+  }, _defineProperty$1(_classNames2, "Avatar--regular", size === 'regular'), _defineProperty$1(_classNames2, "Avatar--tiny", size === 'tiny'), _defineProperty$1(_classNames2, "Avatar--secondary", true), _defineProperty$1(_classNames2, 'Avatar--disabled', true), _defineProperty$1(_classNames2, 'cursor-pointer', on === 'click'), _classNames2));
   return /*#__PURE__*/React.createElement("div", {
     "data-test": "DesignSystem-AvatarGroup--TriggerAvatar",
     className: "AvatarCount-wrapper",
     style: avatarStyle
   }, /*#__PURE__*/React.createElement("span", {
+    "data-test": "DesignSystem-AvatarGroup--TriggerAvatarVariants",
     className: AvatarVariantsClass
   }, /*#__PURE__*/React.createElement(Text, {
     appearance: 'white',
@@ -1045,7 +1047,7 @@ var AvatarPopperBody = function AvatarPopperBody(props) {
   }
 
   return /*#__PURE__*/React.createElement("div", {
-    className: "py-6 pr-4 pl-6"
+    className: "px-4 py-3"
   }, /*#__PURE__*/React.createElement("div", {
     className: "AvatarGroup-TextWrapper",
     style: {
@@ -1057,7 +1059,7 @@ var AvatarPopperBody = function AvatarPopperBody(props) {
         _item$lastName = item.lastName,
         lastName = _item$lastName === void 0 ? '' : _item$lastName;
     var name = "".concat(firstName, " ").concat(lastName);
-    var AvatarTextClass = classnames(_defineProperty$1({}, "mb-5", ind < hiddenAvatarList.length - 1));
+    var AvatarTextClass = classnames(_defineProperty$1({}, "mb-4", ind < hiddenAvatarList.length - 1));
     return /*#__PURE__*/React.createElement(Text, {
       key: ind,
       appearance: dark ? 'white' : 'default',
@@ -1098,6 +1100,7 @@ var AvatarGroup = function AvatarGroup(props) {
     boxShadow: "0 0 0  var(--spacing-s) ".concat(borderColor)
   };
   var avatarStyle = size === 'tiny' ? _objectSpread2(_objectSpread2({}, style), tinyAvatarStyle) : style;
+  var avatarList = list.length === 3 ? list : list.slice(0, max);
   var AvatarGroupClass = classnames(_defineProperty$1({}, 'AvatarGroup', true), className);
   var popperClass = classnames(_defineProperty$1({}, 'AvatarGroup-Popper', true), popperClassName);
   return /*#__PURE__*/React.createElement("div", _extends$2({
@@ -1106,13 +1109,14 @@ var AvatarGroup = function AvatarGroup(props) {
     className: "".concat(AvatarGroupClass, " d-inline-flex")
   }), /*#__PURE__*/React.createElement(Avatars, {
     size: size,
-    avatarList: list.slice(0, max),
+    avatarList: avatarList,
     avatarStyle: avatarStyle,
     tooltipPosition: tooltipPosition
-  }), list.length - max > 0 && /*#__PURE__*/React.createElement(Popover, {
+  }), list.length - max > 0 && list.length !== 3 && /*#__PURE__*/React.createElement(Popover, {
     on: on,
     dark: dark,
     trigger: /*#__PURE__*/React.createElement(AvatarCount, {
+      on: on,
       size: size,
       hiddenAvatarCount: hiddenAvatarCount,
       avatarStyle: avatarStyle
@@ -2487,7 +2491,7 @@ var Calendar = /*#__PURE__*/function (_React$Component) {
   _createClass(Calendar, [{
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps, prevState) {
-      var _prevState$startDate, _this$state$startDate, _prevState$endDate, _this$state$endDate;
+      var _prevState$startDate, _this$state$startDate, _this$state$endDate, _prevState$endDate, _this$state$endDate2;
 
       var monthsInView = this.props.monthsInView;
 
@@ -2504,7 +2508,7 @@ var Calendar = /*#__PURE__*/function (_React$Component) {
         });
       }
 
-      if (prevProps.startDate !== this.props.startDate) {
+      if (this.props.startDate && !isNaN(this.props.startDate.getTime()) && prevProps.startDate !== this.props.startDate) {
         var _d = convertToDate(this.props.startDate);
 
         this.setState({
@@ -2512,7 +2516,7 @@ var Calendar = /*#__PURE__*/function (_React$Component) {
         });
       }
 
-      if (prevProps.endDate !== this.props.endDate) {
+      if (this.props.endDate && !isNaN(this.props.endDate.getTime()) && prevProps.endDate !== this.props.endDate) {
         var _d2 = convertToDate(this.props.endDate);
 
         this.setState({
@@ -2611,7 +2615,7 @@ var Calendar = /*#__PURE__*/function (_React$Component) {
         }
       }
 
-      if (((_prevState$startDate = prevState.startDate) === null || _prevState$startDate === void 0 ? void 0 : _prevState$startDate.getTime()) !== ((_this$state$startDate = this.state.startDate) === null || _this$state$startDate === void 0 ? void 0 : _this$state$startDate.getTime()) || ((_prevState$endDate = prevState.endDate) === null || _prevState$endDate === void 0 ? void 0 : _prevState$endDate.getTime()) !== ((_this$state$endDate = this.state.endDate) === null || _this$state$endDate === void 0 ? void 0 : _this$state$endDate.getTime())) {
+      if (this.state.startDate && !isNaN(this.state.startDate.getTime()) && ((_prevState$startDate = prevState.startDate) === null || _prevState$startDate === void 0 ? void 0 : _prevState$startDate.getTime()) !== ((_this$state$startDate = this.state.startDate) === null || _this$state$startDate === void 0 ? void 0 : _this$state$startDate.getTime()) || this.state.endDate && !isNaN((_this$state$endDate = this.state.endDate) === null || _this$state$endDate === void 0 ? void 0 : _this$state$endDate.getTime()) && ((_prevState$endDate = prevState.endDate) === null || _prevState$endDate === void 0 ? void 0 : _prevState$endDate.getTime()) !== ((_this$state$endDate2 = this.state.endDate) === null || _this$state$endDate2 === void 0 ? void 0 : _this$state$endDate2.getTime())) {
         var onRangeChange = this.props.onRangeChange;
         var _this$state10 = this.state,
             _startDate4 = _this$state10.startDate,
@@ -3480,7 +3484,10 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
     _defineProperty$1(_assertThisInitialized$1(_this), "getError", function (date) {
       var _this$props = _this.props,
           disabledBefore = _this$props.disabledBefore,
-          disabledAfter = _this$props.disabledAfter;
+          disabledAfter = _this$props.disabledAfter,
+          outputFormat = _this$props.outputFormat,
+          onError = _this$props.onError;
+      if (!date) return false;
 
       var _getDateInfo = getDateInfo(disabledBefore),
           dbYear = _getDateInfo.year,
@@ -3492,7 +3499,16 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
           daMonth = _getDateInfo2.month,
           daDate = _getDateInfo2.date;
 
-      return !date ? false : compareDate(date, 'less', dbYear, dbMonth, dbDate) || compareDate(date, 'more', daYear, daMonth, daDate);
+      if (compareDate(date, 'less', dbYear, dbMonth, dbDate) || compareDate(date, 'more', daYear, daMonth, daDate)) {
+        if (onError) {
+          var dVal = translateToString(outputFormat, date);
+          onError(date, dVal);
+        }
+
+        return true;
+      }
+
+      return false;
     });
 
     _defineProperty$1(_assertThisInitialized$1(_this), "onDateChangeHandler", function (d) {
@@ -3667,24 +3683,26 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
           withInput = _this$props5.withInput,
           inputFormat = _this$props5.inputFormat,
           inputOptions = _this$props5.inputOptions,
-          validators = _this$props5.validators;
+          validators = _this$props5.validators,
+          popoverOptions = _this$props5.popoverOptions;
       var open = this.state.open;
 
       if (withInput) {
-        return /*#__PURE__*/React.createElement(Popover, {
+        return /*#__PURE__*/React.createElement(Popover, _extends$2({
           trigger: /*#__PURE__*/React.createElement(Trigger$1, {
             inputFormat: inputFormat,
             inputOptions: inputOptions,
             validators: validators,
             state: this.state,
             setState: this.setState.bind(this)
-          }),
+          })
+        }, popoverOptions, {
           triggerClass: "w-100",
           position: position,
           appendToBody: true,
           open: open,
           onToggle: this.onToggleHandler
-        }, this.renderCalendar());
+        }), this.renderCalendar());
       }
 
       return this.renderCalendar();
@@ -13760,14 +13778,14 @@ var PopperWrapper = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "addBoundaryScrollHandler",
     value: function addBoundaryScrollHandler() {
-      if (this.props.boundaryElement) {
+      if (this.props.boundaryElement && this.props.boundaryElement.addEventListener) {
         this.props.boundaryElement.addEventListener('scroll', this.boundaryScrollHandler);
       }
     }
   }, {
     key: "removeBoundaryScrollHandler",
     value: function removeBoundaryScrollHandler() {
-      if (this.props.boundaryElement) {
+      if (this.props.boundaryElement && this.props.boundaryElement.removeEventListener) {
         this.props.boundaryElement.removeEventListener('scroll', this.boundaryScrollHandler);
       }
     }
@@ -16808,7 +16826,7 @@ var Trigger = function Trigger(props) {
       if (val && !val.includes(placeholderChar)) {
         var d = translateToDate(inputFormat, val, validators);
 
-        if (d) {
+        if (d && !isNaN(d.getTime())) {
           setState({
             startDate: d
           });
@@ -16835,7 +16853,7 @@ var Trigger = function Trigger(props) {
       if (val && !val.includes(_placeholderChar2)) {
         var _d2 = translateToDate(inputFormat, val, validators);
 
-        if (_d2) setState({
+        if (_d2 && !isNaN(_d2.getTime())) setState({
           endDate: _d2
         });
       }
@@ -23591,6 +23609,6 @@ var TextField = function TextField(props) {
 };
 TextField.displayName = 'TextField';
 
-var version = "2.28.1";
+var version = "2.28.2";
 
 export { ActionCard, Avatar, AvatarGroup, Backdrop, Badge, Breadcrumbs, Button, Calendar, Caption, Card, CardBody, CardFooter, CardHeader, CardSubdued, ChatMessage, Checkbox, Chip, ChipGroup, ChipInput, ChoiceList, Collapsible, Column, DatePicker, DateRangePicker, Dialog, Divider, Dropdown, Dropzone, EditableChipInput, EditableDropdown, EditableInput, EmptyState, FileList, FileUploader, FileUploaderList, FullscreenModal, Grid, GridCell, Heading, HelpText, HorizontalNav, Icon, InlineMessage, Input, X as InputMask, Label, Legend, Link, LinkButton, List, Listbox, Message, MetaList, MetricInput, Modal, ModalBody, ModalDescription, ModalFooter, ModalHeader, MultiSlider, Navigation, OutsideClick, PageHeader, Pagination, Paragraph, Pills, Placeholder, PlaceholderImage, PlaceholderParagraph, Popover, ProgressBar, ProgressRing, Radio, RangeSlider, Row, SelectionCard, Sidesheet, Slider, Spinner, StatusHint, Stepper, Subheading, Switch, Tab, Table, Tabs, TabsWrapper, Text, TextField, Textarea, TimePicker, Toast, Tooltip, index as Utils, VerificationCodeInput, VerticalNav, version };

package/dist/index.js

@@ -1,8 +1,8 @@
 
   /**
-   * Generated on: 1708350879498 
+   * Generated on: 1709017854213 
    *      Package: @innovaccer/design-system
-   *      Version: v2.28.1
+   *      Version: v2.28.2
    *      License: MIT
    *         Docs: https://innovaccer.github.io/design-system
    */
@@ -628,16 +628,18 @@
 
       var hiddenAvatarCount = props.hiddenAvatarCount,
           avatarStyle = props.avatarStyle,
-          size = props.size;
+          size = props.size,
+          on = props.on;
       var ContentClass = classNames__default["default"]((_a = {}, _a["Avatar-content--secondary"] = true, _a["Avatar-content--tiny"] = size === 'tiny', _a));
       var AvatarVariantsClass = classNames__default["default"]((_b = {
         Avatar: true
-      }, _b["Avatar--regular"] = size === 'regular', _b["Avatar--tiny"] = size === 'tiny', _b["Avatar--secondary"] = true, _b['Avatar--disabled'] = true, _b));
+      }, _b["Avatar--regular"] = size === 'regular', _b["Avatar--tiny"] = size === 'tiny', _b["Avatar--secondary"] = true, _b['Avatar--disabled'] = true, _b['cursor-pointer'] = on === 'click', _b));
       return /*#__PURE__*/React__namespace.createElement("div", {
         "data-test": "DesignSystem-AvatarGroup--TriggerAvatar",
         className: "AvatarCount-wrapper",
         style: avatarStyle
       }, /*#__PURE__*/React__namespace.createElement("span", {
+        "data-test": "DesignSystem-AvatarGroup--TriggerAvatarVariants",
         className: AvatarVariantsClass
       }, /*#__PURE__*/React__namespace.createElement(Text, {
         appearance: 'white',
@@ -687,7 +689,7 @@
       }
 
       return /*#__PURE__*/React__namespace.createElement("div", {
-        className: "py-6 pr-4 pl-6"
+        className: "px-4 py-3"
       }, /*#__PURE__*/React__namespace.createElement("div", {
         className: "AvatarGroup-TextWrapper",
         style: {
@@ -701,7 +703,7 @@
             _c = item.lastName,
             lastName = _c === void 0 ? '' : _c;
         var name = firstName + " " + lastName;
-        var AvatarTextClass = classNames__default["default"]((_a = {}, _a["mb-5"] = ind < hiddenAvatarList.length - 1, _a));
+        var AvatarTextClass = classNames__default["default"]((_a = {}, _a["mb-4"] = ind < hiddenAvatarList.length - 1, _a));
         return /*#__PURE__*/React__namespace.createElement(Text, {
           key: ind,
           appearance: dark ? 'white' : 'default',
@@ -744,6 +746,7 @@
         boxShadow: "0 0 0  var(--spacing-s) " + borderColor
       };
       var avatarStyle = size === 'tiny' ? __assign(__assign({}, style), tinyAvatarStyle) : style;
+      var avatarList = list.length === 3 ? list : list.slice(0, max);
       var AvatarGroupClass = classNames__default["default"]((_a = {}, _a['AvatarGroup'] = true, _a), className);
       var popperClass = classNames__default["default"]((_b = {}, _b['AvatarGroup-Popper'] = true, _b), popperClassName);
       return /*#__PURE__*/React__namespace.createElement("div", __assign({
@@ -752,13 +755,14 @@
         className: AvatarGroupClass + " d-inline-flex"
       }), /*#__PURE__*/React__namespace.createElement(Avatars, {
         size: size,
-        avatarList: list.slice(0, max),
+        avatarList: avatarList,
         avatarStyle: avatarStyle,
         tooltipPosition: tooltipPosition
-      }), list.length - max > 0 && /*#__PURE__*/React__namespace.createElement(Popover, {
+      }), list.length - max > 0 && list.length !== 3 && /*#__PURE__*/React__namespace.createElement(Popover, {
         on: on,
         dark: dark,
         trigger: /*#__PURE__*/React__namespace.createElement(AvatarCount, {
+          on: on,
           size: size,
           hiddenAvatarCount: hiddenAvatarCount,
           avatarStyle: avatarStyle
@@ -2117,15 +2121,15 @@
       }
 
       Calendar.prototype.componentDidUpdate = function (prevProps, prevState) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e;
 
         var monthsInView = this.props.monthsInView;
 
         if (prevProps.date !== this.props.date) {
-          var _e = getDateInfo(this.props.date),
-              year = _e.year,
-              month = _e.month,
-              date = _e.date;
+          var _f = getDateInfo(this.props.date),
+              year = _f.year,
+              month = _f.month,
+              date = _f.date;
 
           this.updateState(year, month, date);
           var d = convertToDate(this.props.date);
@@ -2134,14 +2138,14 @@
           });
         }
 
-        if (prevProps.startDate !== this.props.startDate) {
+        if (this.props.startDate && !isNaN(this.props.startDate.getTime()) && prevProps.startDate !== this.props.startDate) {
           var d = convertToDate(this.props.startDate);
           this.setState({
             startDate: d
           });
         }
 
-        if (prevProps.endDate !== this.props.endDate) {
+        if (this.props.endDate && !isNaN(this.props.endDate.getTime()) && prevProps.endDate !== this.props.endDate) {
           var d = convertToDate(this.props.endDate);
           this.setState({
             endDate: d
@@ -2178,13 +2182,13 @@
         }
 
         if (prevState.currDate !== this.state.currDate) {
-          var _f = this.props,
-              rangePicker = _f.rangePicker,
-              onDateChange = _f.onDateChange;
-          var _g = this.state,
-              currDate = _g.currDate,
-              startDate = _g.startDate,
-              endDate = _g.endDate;
+          var _g = this.props,
+              rangePicker = _g.rangePicker,
+              onDateChange = _g.onDateChange;
+          var _h = this.state,
+              currDate = _h.currDate,
+              startDate = _h.startDate,
+              endDate = _h.endDate;
 
           if (currDate) {
             if (onDateChange) onDateChange(currDate);
@@ -2200,10 +2204,10 @@
                   endDate: undefined
                 });
               } else {
-                var _h = getDateInfo(currDate),
-                    year = _h.year,
-                    month = _h.month,
-                    date = _h.date;
+                var _j = getDateInfo(currDate),
+                    year = _j.year,
+                    month = _j.month,
+                    date = _j.date;
 
                 if (startDate) {
                   if (compareDate(startDate, 'more', year, month, date)) {
@@ -2239,11 +2243,11 @@
           }
         }
 
-        if (((_a = prevState.startDate) === null || _a === void 0 ? void 0 : _a.getTime()) !== ((_b = this.state.startDate) === null || _b === void 0 ? void 0 : _b.getTime()) || ((_c = prevState.endDate) === null || _c === void 0 ? void 0 : _c.getTime()) !== ((_d = this.state.endDate) === null || _d === void 0 ? void 0 : _d.getTime())) {
+        if (this.state.startDate && !isNaN(this.state.startDate.getTime()) && ((_a = prevState.startDate) === null || _a === void 0 ? void 0 : _a.getTime()) !== ((_b = this.state.startDate) === null || _b === void 0 ? void 0 : _b.getTime()) || this.state.endDate && !isNaN((_c = this.state.endDate) === null || _c === void 0 ? void 0 : _c.getTime()) && ((_d = prevState.endDate) === null || _d === void 0 ? void 0 : _d.getTime()) !== ((_e = this.state.endDate) === null || _e === void 0 ? void 0 : _e.getTime())) {
           var onRangeChange = this.props.onRangeChange;
-          var _j = this.state,
-              startDate = _j.startDate,
-              endDate = _j.endDate;
+          var _k = this.state,
+              startDate = _k.startDate,
+              endDate = _k.endDate;
           if (onRangeChange) onRangeChange(startDate, endDate);
         }
 
@@ -3078,7 +3082,10 @@
         _this.getError = function (date) {
           var _a = _this.props,
               disabledBefore = _a.disabledBefore,
-              disabledAfter = _a.disabledAfter;
+              disabledAfter = _a.disabledAfter,
+              outputFormat = _a.outputFormat,
+              onError = _a.onError;
+          if (!date) return false;
 
           var _b = getDateInfo(disabledBefore),
               dbYear = _b.year,
@@ -3090,7 +3097,16 @@
               daMonth = _c.month,
               daDate = _c.date;
 
-          return !date ? false : compareDate(date, 'less', dbYear, dbMonth, dbDate) || compareDate(date, 'more', daYear, daMonth, daDate);
+          if (compareDate(date, 'less', dbYear, dbMonth, dbDate) || compareDate(date, 'more', daYear, daMonth, daDate)) {
+            if (onError) {
+              var dVal = translateToString(outputFormat, date);
+              onError(date, dVal);
+            }
+
+            return true;
+          }
+
+          return false;
         };
 
         _this.onDateChangeHandler = function (d) {
@@ -3260,24 +3276,26 @@
             withInput = _a.withInput,
             inputFormat = _a.inputFormat,
             inputOptions = _a.inputOptions,
-            validators = _a.validators;
+            validators = _a.validators,
+            popoverOptions = _a.popoverOptions;
         var open = this.state.open;
 
         if (withInput) {
-          return /*#__PURE__*/React__namespace.createElement(Popover, {
+          return /*#__PURE__*/React__namespace.createElement(Popover, __assign({
             trigger: /*#__PURE__*/React__namespace.createElement(Trigger$1, {
               inputFormat: inputFormat,
               inputOptions: inputOptions,
               validators: validators,
               state: this.state,
               setState: this.setState.bind(this)
-            }),
+            })
+          }, popoverOptions, {
             triggerClass: "w-100",
             position: position,
             appendToBody: true,
             open: open,
             onToggle: this.onToggleHandler
-          }, this.renderCalendar());
+          }), this.renderCalendar());
         }
 
         return this.renderCalendar();
@@ -8449,13 +8467,13 @@
       };
 
       PopperWrapper.prototype.addBoundaryScrollHandler = function () {
-        if (this.props.boundaryElement) {
+        if (this.props.boundaryElement && this.props.boundaryElement.addEventListener) {
           this.props.boundaryElement.addEventListener('scroll', this.boundaryScrollHandler);
         }
       };
 
       PopperWrapper.prototype.removeBoundaryScrollHandler = function () {
-        if (this.props.boundaryElement) {
+        if (this.props.boundaryElement && this.props.boundaryElement.removeEventListener) {
           this.props.boundaryElement.removeEventListener('scroll', this.boundaryScrollHandler);
         }
       };
@@ -11334,7 +11352,7 @@
           if (val && !val.includes(placeholderChar)) {
             var d = translateToDate(inputFormat, val, validators);
 
-            if (d) {
+            if (d && !isNaN(d.getTime())) {
               setState({
                 startDate: d
               });
@@ -11360,7 +11378,7 @@
 
           if (val && !val.includes(placeholderChar)) {
             var d = translateToDate(inputFormat, val, validators);
-            if (d) setState({
+            if (d && !isNaN(d.getTime())) setState({
               endDate: d
             });
           }
@@ -17824,7 +17842,7 @@
     };
     TextField.displayName = 'TextField';
 
-    var version = "2.28.1";
+    var version = "2.28.2";
 
     exports.ActionCard = ActionCard;
     exports.Avatar = Avatar;