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

DatePicker Returns null for Incomplete Input, Losing Raw Value for Validation #4886

Open
MaksiGrebe opened this issue Feb 20, 2025 · 1 comment

Comments

@MaksiGrebe
Copy link

I'm experiencing an issue with the HeroUI DatePicker component when users manually edit the date input. Specifically, if a user selects a valid date via the DatePicker and then manually clears one of the segments (e.g., day, month, or year), the component returns null instead of preserving the raw, incomplete input.

Steps to Reproduce

  1. Render the HeroUI DatePicker in a React application.
  2. Use the DatePicker UI to select a valid date (for example, 2000-02-02).
  3. Manually delete one of the segments (e.g., clear the day or month).
  4. Observe that the onChange handler receives null as the value.

Expected Behavior

  • When a user manually edits the input resulting in an incomplete date (e.g., missing day, month, or year), the DatePicker should return the raw input as a string so that the validation logic can detect the incomplete value and flag it as invalid.
  • Alternatively, there should be a configuration option that allows developers to always receive the raw input value (even if incomplete) rather than null.

Actual Behavior

  • If a segment is cleared (for example, after selecting a valid date, deleting the day), the DatePicker returns null.
  • This behavior prevents developers from distinguishing between a completely empty input and an incomplete, manually-edited input, which in turn hinders proper validation.

Impact

Due to this behavior, my form validation cannot differentiate between a field that is intentionally left empty and one that contains an incomplete date (e.g., "2000-02-" when the day is removed). This results in validation not triggering as expected for incomplete manual entries.

Additional Context

  • I have attempted to work around this issue by capturing the raw input using an onInput listener and custom onChange handlers, but these approaches are not reliable due to the internal workings of the DatePicker.
  • The problem seems to stem from the DatePicker interpreting any incomplete date as null, thereby discarding the user's partial input.

Any assistance or guidance on how to resolve or work around this issue would be greatly appreciated.

Thank you!

Copy link

linear bot commented Feb 20, 2025

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant