Replace react-dates on mobile DateInput with native picker#4343
Draft
Replace react-dates on mobile DateInput with native picker#4343
Conversation
…="date"> The react-dates library was last released in January 2020 and is effectively abandoned. Its React peer dependency caps at v16, generating ~8 yarn install warnings against our React 18 runtime, and the library won't fix known SASS/darken() issues (hence our copied datepicker.css monkey-patch). Usage was narrow - only the mobile DateInput, and only SingleDatePicker. Swapped the internal picker for the browser's native <input type="date">, which delivers the OS-native date UI (wheel on iOS, Material dialog on Android, popover on desktop) with no library surface. Kept the HoistInputModel-backed DateInput component, its public API (value, min/max, valueType, enableClear, icons, textAlign), and the clear-button pattern from TextInput. Breaking removals (no downstream usage found in Toolbox): formatString, initialMonth, placeholder, singleDatePickerProps. Also deleted kit/react-dates/ and the copied datepicker.css. Apps with custom SCSS targeting the old react-dates class names should clean those up - noted in the changelog. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
DateInput's internal picker with the browser's native<input type="date">, removing the abandonedreact-datesdependency (last release Jan 2020, React peer caps at v16, unfixed SASS issue we had been monkey-patching with a copied CSS file).DateInputcomponent,HoistInputModelwiring, and the clear-button pattern are unchanged. Breaking removals onDateInputProps:formatString,initialMonth,placeholder,singleDatePickerProps— all documented in the changelog under 💥 Breaking Changes.yarn installpeer-dep warnings and deletes ~900 lines of copied CSS plus thekit/react-dates/sub-package.Toolbox mobile uses only baseline
DateInputprops (minDate,maxDate,textAlign,valueType); no Toolbox changes required.Test plan
FormPageopens the OS-native picker (iOS wheel, Android Material dialog, desktop popover).minDate/maxDateconstraints enforced via native UI and on programmatic commit; out-of-range values reset tonull.enableClearbutton clears value and does not reopen the OS picker.valueType: 'localDate'round-trips correctly;valueType: 'date'(default) unchanged.yarn installno longer emitsreact-dates-related peer warnings.Hoist P/R Checklist
developbranch as of last change.breaking-changelabel.DateInputPropsTSDoc refreshed,kit/README.md+docs/test-automation.mdupdated).Generated with Claude Opus 4.7 (1M context)