fix(Calendar): replace invalid date with a valid one in event

[KumJungMin]

Defect Fixes

• fix: Calendar: Actual value is not being limited by yearRange when manually typing #7691

How To Resolve

• When typing a date that exceeds the allowed yearRange, the input field adjusts it to a valid date.
• However, the onChange event still passes the unadjusted invalid date.
• The validateDate function ensures the date is valid.
• Therefore, I called the validateDate function in the updateValueOnInput callback.

 const updateValueOnInput = (event, rawValue, invalidCallback) => {
      try {
          const value = parseValueFromString(props.timeOnly ? rawValue.replace('_', '') : rawValue);

          if (isValidSelection(value)) {
              validateDate(value);  // this!
              updateModel(event, value);
              const date = value.length ? value[0] : value;
              updateViewDate(event, date);
              ...
}

Test

sample code

import { Calendar } from '@/components/lib/calendar/Calendar';
import { useState } from 'react';

export function BasicDoc() {
  const [date, setDate] = useState(null);

  return (
      <div className="card">
          <Calendar showButtonBar monthNavigator yearNavigator value={date} onChange={(e) => setDate(e.value)} yearRange="2020:2030" showIcon showOnFocus={false} />
          <p>CUR DATE: {date?.toLocaleDateString()}</p>
      </div>
  );
}

before: When typing an invalid date(01/01/2000), the onChange event passes the unadjusted date value.

2025-02-14.10.13.57.mov

after: When typing an invalid date(01/01/2000), the onChange event now passes the adjusted valid date value(01/01/2020).

2025-02-14.10.13.26.mov

[melloware]

Thanks @KumJungMin !

[vercel]

Deployment failed with the following error:

Creating the Deployment Timed Out.