Merge pull request #2464 from teamleadercrm/FRAF-1154-v6

DatePickerInput: fixed clearing logic

CHANGELOG.md

@@ -4,9 +4,6 @@
 
 ### Changed
 
-- `Message`: Make `MessageProps` extend the `BoxProps` and make `title` property optional ([@kristofcolpaert](https://github.com/kristofcolpaert)) in [#2465](https://github.com/teamleadercrm/ui/pull/2465))
-- `Dialog`: Added z-index to scroll shadow to make sure it appears above inner elements ([@BeirlaenAaron](https://github.com/BeirlaenAaron)) in ([#2463](https://github.com/teamleadercrm/ui/pull/2463))
-
 ### Deprecated
 
 ### Removed
@@ -15,6 +12,17 @@
 
 ### Dependency updates
 
+## [17.1.1] - 2022-11-23
+
+### Changed
+
+- `Message`: Make `MessageProps` extend the `BoxProps` and make `title` property optional ([@kristofcolpaert](https://github.com/kristofcolpaert)) in [#2465](https://github.com/teamleadercrm/ui/pull/2465))
+- `Dialog`: Added z-index to scroll shadow to make sure it appears above inner elements ([@BeirlaenAaron](https://github.com/BeirlaenAaron)) in ([#2463](https://github.com/teamleadercrm/ui/pull/2463))
+
+### Fixed
+
+- `DatePickerInput`: clearing logic ([@qubis741](https://github.com/qubis741)) in ([#2464](https://github.com/teamleadercrm/ui/pull/2464))
+
 ## [17.1.0] - 2022-11-22
 
 ### Changed

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@teamleader/ui",
   "description": "Teamleader UI library",
-  "version": "17.1.0",
+  "version": "17.1.1",
   "author": "Teamleader <[email protected]>",
   "bugs": {
     "url": "https://github.com/teamleadercrm/ui/issues"

src/components/datepicker/DatePickerInput.tsx

@@ -129,7 +129,7 @@ function DatePickerInput<IsTypeable extends boolean = true>({
       }
       // Blurred from input, not focused on datepicker
       if (value === false) {
-        if (typeable && !customFormatDate && inputValue) {
+        if (typeable && !customFormatDate) {
           const date = parseMultiFormatsDate(inputValue, ALLOWED_DATE_FORMATS, locale);
           if (date && isAllowedDate(date, dayPickerProps?.disabledDays)) {
             onChange && onChange(date);
@@ -228,10 +228,11 @@ function DatePickerInput<IsTypeable extends boolean = true>({
     event.preventDefault();
     closePopover(undefined);
     handleInputValueChange('');
+    setSelectedDate(undefined);
   };
 
   const renderClearIcon = () => {
-    return clearable && selectedDate ? (
+    return clearable && inputValue.length > 0 ? (
       <Icon
         color={inverse ? 'teal' : 'neutral'}
         tint={inverse ? 'light' : 'darkest'}