-
-
Notifications
You must be signed in to change notification settings - Fork 1.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[pickers] Infer mask from inputFormat
#5060
Conversation
These are the results for the performance tests:
|
inputFormat
expect(runMaskValidation).toWarnDev( | ||
[ | ||
`The mask "${mask}" you passed is not valid for the format used ${format}.`, | ||
`Falling down to uncontrolled no-mask input.`, | ||
].join('\n'), | ||
); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I removed the The mask ... you passed
because when masked is inferred, it does not make sens to show this error message to the dev
const maskMap = { | ||
fr: '__/__/____', | ||
en: '__/__/____', | ||
ru: '__.__.____', | ||
de: '__.__.____', | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Since default mask is inferred, this can be done
packages/x-date-pickers/src/internals/utils/text-field-helper.ts
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't feel very confident approving this one because it's a very touchy part
But if the test pass for all adapters, I think we can give it a try
9e2fc26
to
673b61f
Compare
Fix #4890
Fix #4756
The idea is that is mask is not defined, we try to infer it from the
inputFormat
this allows to support at the same time libraries that use uppercase letters forampm
and library using lowercaseTo run test, I based this PR on #5055
Changelog
The mask can now be inferred from the
inputFormat
.This allows supporting different separators like
dd/MM/YYYY
,dd-MM-YYYY
,dd.MM.YYYY
and different orders such asMM-dd-YYYY
,YYYY-MM-dd
without having to specify themask
propTo be accepted, the input format needs to b made of digits (months can not be
Jan
,Fev
, ...) and with fix length (January must be01
and not1
).You can still use
disableMaskedInput
to disable this feature and providemask
prop to override the inferred mask.