diff --git a/example/src/DatePickerExample.jsx b/example/src/DatePickerExample.jsx
index 97cadc7dc..f9fb382bb 100644
--- a/example/src/DatePickerExample.jsx
+++ b/example/src/DatePickerExample.jsx
@@ -10,6 +10,7 @@ function DatePickerExample({ theme }) {
const [date, setDate] = React.useState(new Date());
const [date2, setDate2] = React.useState(new Date());
const [date3, setDate3] = React.useState(new Date());
+ const [date4, setDate4] = React.useState(new Date());
return (
@@ -153,6 +154,20 @@ function DatePickerExample({ theme }) {
leftIconMode={"inset"}
type={"underline"}
/>
+
);
diff --git a/packages/core/src/components/DatePicker/DatePicker.tsx b/packages/core/src/components/DatePicker/DatePicker.tsx
index 89f4f1b91..e56984269 100644
--- a/packages/core/src/components/DatePicker/DatePicker.tsx
+++ b/packages/core/src/components/DatePicker/DatePicker.tsx
@@ -408,18 +408,15 @@ const DatePicker: React.FC> = ({
const minDate = parseDate(minimumDate);
const maxDate = parseDate(maximumDate);
- let newDate = currentDate;
-
- if (minDate && currentDate < minDate) {
- newDate = minDate;
- }
- if (maxDate && currentDate > maxDate) {
- newDate = maxDate;
- }
-
- if (newDate !== currentDate) {
- setValue(newDate);
- onDateChange(newDate);
+ const isBeforeMinDate = minDate && currentDate < minDate;
+ const isAfterMaxDate = maxDate && currentDate > maxDate;
+
+ if (isBeforeMinDate) {
+ setValue(minDate);
+ onDateChange(minDate);
+ } else if (isAfterMaxDate) {
+ setValue(maxDate);
+ onDateChange(maxDate);
}
}, [value, minimumDate, maximumDate, onDateChange]);