Add shouldForceLeadingZeros prop to DatePicker #4671
Merged
Conversation
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
devongovett
changed the title
|
Build successful! 🎉 |
|
## API Changes
unknown top level export { type: 'identifier', name: 'Column' } @react-aria/datepickerAriaDateFieldProps AriaDateFieldProps<T extends DateValue> {
granularity?: Granularity
hideTimeZone?: boolean = false
hourCycle?: number | number
isDateUnavailable?: (DateValue) => boolean
maxValue?: DateValue
minValue?: DateValue
placeholderValue?: DateValue
+ shouldForceLeadingZeros?: boolean
}AriaDatePickerProps AriaDatePickerProps<T extends DateValue> {
granularity?: Granularity
hideTimeZone?: boolean = false
hourCycle?: number | number
isDateUnavailable?: (DateValue) => boolean
maxValue?: DateValue
minValue?: DateValue
pageBehavior?: PageBehavior = visible
placeholderValue?: DateValue
+ shouldForceLeadingZeros?: boolean
}AriaDateRangePickerProps AriaDateRangePickerProps<T extends DateValue> {
allowsNonContiguousRanges?: boolean
granularity?: Granularity
hideTimeZone?: boolean = false
hourCycle?: number | number
isDateUnavailable?: (DateValue) => boolean
maxValue?: DateValue
minValue?: DateValue
pageBehavior?: PageBehavior = visible
placeholderValue?: DateValue
+ shouldForceLeadingZeros?: boolean
}AriaTimeFieldProps AriaTimeFieldProps<T extends TimeValue> {
granularity?: 'hour' | 'minute' | 'second' = 'minute'
hideTimeZone?: boolean
hourCycle?: number | number
maxValue?: TimeValue
minValue?: TimeValue
placeholderValue?: TimeValue
+ shouldForceLeadingZeros?: boolean
}@react-spectrum/datepickerDatePicker SpectrumDateFieldProps<T extends DateValue> {
granularity?: Granularity
hideTimeZone?: boolean = false
hourCycle?: number | number
isDateUnavailable?: (DateValue) => boolean
isQuiet?: boolean = false
maxValue?: DateValue
minValue?: DateValue
placeholderValue?: DateValue
+ shouldForceLeadingZeros?: boolean
showFormatHelpText?: boolean = false
}DateRangePicker SpectrumDatePickerProps<T extends DateValue> {
granularity?: Granularity
hideTimeZone?: boolean = false
hourCycle?: number | number
isDateUnavailable?: (DateValue) => boolean
isQuiet?: boolean = false
maxValue?: DateValue
maxVisibleMonths?: number = 1
minValue?: DateValue
pageBehavior?: PageBehavior = visible
placeholderValue?: DateValue
shouldFlip?: boolean = true
+ shouldForceLeadingZeros?: boolean
showFormatHelpText?: boolean = false
}TimeField SpectrumDateRangePickerProps<T extends DateValue> {
allowsNonContiguousRanges?: boolean
granularity?: Granularity
hideTimeZone?: boolean = false
hourCycle?: number | number
isDateUnavailable?: (DateValue) => boolean
isQuiet?: boolean = false
maxValue?: DateValue
maxVisibleMonths?: number = 1
minValue?: DateValue
pageBehavior?: PageBehavior = visible
placeholderValue?: DateValue
shouldFlip?: boolean = true
+ shouldForceLeadingZeros?: boolean
showFormatHelpText?: boolean = false
}DateField SpectrumTimeFieldProps<T extends TimeValue> {
granularity?: 'hour' | 'minute' | 'second' = 'minute'
hideTimeZone?: boolean
hourCycle?: number | number
isQuiet?: boolean = false
maxValue?: TimeValue
minValue?: TimeValue
placeholderValue?: TimeValue
+ shouldForceLeadingZeros?: boolean
} |
ktabors
approved these changes
Jun 19, 2023
snowystinger
approved these changes
Jun 19, 2023
| @@ -78,6 +78,12 @@ HourCycle24.story = { | |||
| name: 'hourCycle: 24' | |||
| }; | |||
|
|
|||
| export const ForceLeadingZeros = () => render({defaultValue: {start: new CalendarDate(2020, 2, 3), end: new CalendarDate(2020, 5, 4)}, shouldForceLeadingZeros: true}); | |||
There was a problem hiding this comment.
Do we need a new story when it's already in the controls?
There was a problem hiding this comment.
DateRangePicker and TimeField don't have controls for some reason. I added to the controls for DatePicker and DateField. Seems like we need to convert the others over at some point.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Closes #4668
This adds a
shouldForceLeadingZerosprop to DatePicker, DateRangePicker, DateField, and TimeField which forces leading zeros to always show in the month, day, and hour fields, regardless of the locale preference. This was also requested in #4247. We would discourage overriding this across all locales, but it can be useful to configure in some scenarios.