ant-design / ant-design

An enterprise-class UI design language and React UI library
https://ant.design
MIT License
92.55k stars 49.85k forks source link

Antd Datepicker format value before minDate #50954

Open pepe95270 opened 1 month ago

pepe95270 commented 1 month ago

Reproduction link

Edit on StackBlitz

Steps to reproduce

Set a DatePicker like this :

<DatePicker
    minDate={dayjs('011900', 'MMYYYY')} // <-- You set the minDate to be January 1900
    format={[
      'MMMM YYYY', // <-- You want the date formatted like "January 1995"
      'MMYYYY', // <-- You want the user to be able to write "011995" (but not something before January 1900)
      'DDMMYYYY', // <-- You want the user to be able to write "01011995"
    ]}
  />

Then try typping "01011995" (do not copy/paste) Just after finishing typing "010119" the value is wrongly formated as "January 0119" (so we're unable to finish typing "95")

What is expected?

It should not transform "010119" to "January 0119" so the user can finish typing a "valid" date like "01011995".

What is actually happening?

"010119" is wrongly formated to "January 0119" and we're unable to finish writing our date

Environment Info
antd 5.20.6
React 18.3.1
System Windows 10
Browser Chrome

I know it's a very specific bug but many thanks for the help

stackblitz[bot] commented 1 month ago

Fix this issue in StackBlitz Codeflow Start a new pull request in StackBlitz Codeflow.

pepe95270 commented 1 month ago

It is kind of related to https://github.com/ant-design/ant-design/issues/48265 but I think it's a different issue.

charithmaddoju commented 1 month ago

Hi, I would like to work on this issue. Could you please assign it to me?

zombieJ commented 1 month ago

I don't think it should be connect with the logic minDate since only part of the date can be limit with minDate. e.g.

Both typing is valid with the format:

It should be to provide a parser api instead of connect with minDate logic.

zombieJ commented 1 month ago

@charithmaddoju, pls feel free to PR directly.

pepe95270 commented 1 month ago

A parser API is a very good idea yes 👍

But I think it could also be good to add this behaviour to the default parser. Why format an invalid date (for example a date before minDate) ?

pepe95270 commented 3 days ago

A parser API seems complicated to implement.

Maybe just restricting the default parser to not parse dates out of min/max ranges is simpler.

@zombieJ : In your example, both typing is valid for both format. And both dates are after the minDate. So in your case, it is working as expected. Maybe I understood it wrong but I think it's a different problem (which would be solve with a parser API).