diff --git a/packages/ui-date-time-input/src/DateTimeInput/index.tsx b/packages/ui-date-time-input/src/DateTimeInput/index.tsx index 9a8c622d29..06e82ab77e 100644 --- a/packages/ui-date-time-input/src/DateTimeInput/index.tsx +++ b/packages/ui-date-time-input/src/DateTimeInput/index.tsx @@ -277,7 +277,7 @@ class DateTimeInput extends Component { event.persist() // timeout is needed here because handleDayClick could be called in the same // frame, and it updates calendarSelectedDate which is read in here. - window.setTimeout(() => { + setTimeout(() => { if ((event as React.KeyboardEvent).key === 'Enter') { // user pressed enter, use the selected value in the calendar this.updateStateBasedOnDateInput(this.state.calendarSelectedDate, event) @@ -351,7 +351,14 @@ class DateTimeInput extends Component { newState.message = { text: text, type: 'error' } } if (this.areDifferentDates(this.state.iso, newState.iso)) { - this.props.onChange?.(e, newState.iso?.toISOString()) + if (typeof this.props.onChange === 'function') { + const newDate = newState.iso?.toISOString() + // Timeout is needed here because users might change value in the + // onChange event lister, which might not execute properly + setTimeout(() => { + this.props.onChange?.(e, newDate) + }, 0) + } } this.setState(newState) } @@ -368,7 +375,7 @@ class DateTimeInput extends Component { // happens on the target before the relatedTarget gets focus. // The timeout gives it a moment for that to happen if (typeof this.props.onBlur === 'function') { - window.setTimeout(() => { + setTimeout(() => { this.props.onBlur?.(e) }, 0) } @@ -439,12 +446,12 @@ class DateTimeInput extends Component { // Please note that this causes one hour of time difference in the affected timezones/dates and to // fully solve this bug we need to change to something like luxon which handles this properly if (currDate.clone().format('HH') === '23') { - arr.push(currDate.clone().add({hours: 1})) + arr.push(currDate.clone().add({ hours: 1 })) } else { arr.push(currDate.clone()) } - currDate.add({days: 1}) + currDate.add({ days: 1 }) } return arr.map((date) => { const dateStr = date.toISOString()