Skip to content
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

feat(datepicker): add parseDate prop, improve default date parsing #15918

Merged

Conversation

tay1orjones
Copy link
Member

@tay1orjones tay1orjones commented Mar 7, 2024

Closes #15432
Part of #13828

This improves DatePicker's date parsing functionality when using the default dateFormat. It also adds a new parseDate prop for consumers to supply their own date parsing function when using other date formats.

How this works:

  • When using the default dateFormat, the DatePicker will attempt to parse the year, month and day into a Date object.
  • If an invalid month or day is provided, 1 will be used instead.
  • If a totally invalid date is provided (a1/0a/a999), the input will be cleared.
  • If a custom dateFormat is used and a parseDate is not provided, the default within flatpickr will be used, which can cause odd date correction based on how native date methods work, [Bug]: DatePicker input seems to convert date if not given in the correct date format #15432 (comment)

Changelog

New

  • Add parseDate prop to DatePicker
  • Provide improved date parsing when using the default date format
  • Add tests to cover the new default parsing, the passing of a parseDate prop function, and completely invalid dates.

Testing / Reviewing

  • Go to the DatePicker stories and start entering various invalid dates. Month/day should correct to 01 and totally invalid dates should clear the input.
  • Ensure it works on all DatePicker variants/stories (range, simple, etc)

Copy link

netlify bot commented Mar 8, 2024

Deploy Preview for v11-carbon-react ready!

Name Link
🔨 Latest commit a241467
🔍 Latest deploy log https://app.netlify.com/sites/v11-carbon-react/deploys/65eb29807efb20000894d855
😎 Deploy Preview https://deploy-preview-15918--v11-carbon-react.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@tay1orjones tay1orjones changed the title feat(datepicker): improve date parsing for default format feat(datepicker): add parseDate prop, improve default date parsing Mar 8, 2024
@tay1orjones tay1orjones marked this pull request as ready for review March 8, 2024 15:05
@tay1orjones tay1orjones requested review from a team as code owners March 8, 2024 15:05
@tay1orjones tay1orjones self-assigned this Mar 8, 2024
Copy link
Member

@tw15egan tw15egan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Works great! 👍 ✅

Copy link
Contributor

@andreancardona andreancardona left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

tested and looks good!

@andreancardona andreancardona added this pull request to the merge queue Mar 13, 2024
Merged via the queue into carbon-design-system:main with commit 4890639 Mar 13, 2024
20 checks passed
preetibansalui pushed a commit to tay1orjones/carbon that referenced this pull request Apr 24, 2024
…arbon-design-system#15918)

* feat(datepicker): improve date parsing for default format, add parseDate as prop

* chore(datepicker): fix typescript warnings

* fix(datepicker): improve parseDate logic and comments

* test(datepicker): cover parseDate functionality

* test(datepicker): cover totally invalid date
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Status: ✅ Done
Development

Successfully merging this pull request may close these issues.

[Bug]: DatePicker input seems to convert date if not given in the correct date format
3 participants