Date, Time, Date Time, and Date Range
Date Range component
We’ve added brand new Date, Time, Date Time, and Date Range components! They are fully keyboard accessible and provide tons of new functionality like automatic time zone handling, expanded formatting options, and more robust validation:
- Automatic time zone handling: We have a new option called “manage time zone” that allows you to set both a display time zone and a value time zone. Display time zone controls how time is displayed to your users, while value time zone controls how it’s encoded. This separation allows you to do things like set your display time zone to follow your user’s local browser, while encoding your times in UTC!
- Expanded formatting options: both dates and times now support all format strings and times default to a localized format. You can also control the step size of time increments that your users see in the dropdown selection (e.g. 15-minute or 30-minute steps).
- Validation: You can also set a min/max time and/or a min/max date. The date and time selection UIs respect your component's configured validation, so invalid options are either disabled in the calendar or don’t appear in the dropdown. This even works with “manage time zone” enabled: you can set validation constraints in your value time zone, and the selection UI will correctly adjust, maintaining your display time zone!
Display and value time zone in PDT
These components also support the same options as all of our new input components, including: expanded label support to control position, alignment, and width (in percent, grid columns, or pixels), read only and disabled modes, prefix/suffix text, prefix/suffix icons, an optional tooltip with GitHub flavored markdown, expanded style editor support, and more!
Drop us a note in the community forum if you’d like to see us add more functionality to these components. Date, Time, and Date Time are available now for all users, and Date Range is rolling out over the next week. All of these components will be available in the next on-premise release!
Fixes and improvements
- Fixed the Image component so it doesn't force authentication in public applications
- Added query loading indicators in presentation mode
- Added a transition to the Date and Date Time components’ calendars
- Added support for a focus state for the Editable Text and Editable Number components
Check out this guide to see the on-prem versions and their release notes. These fixes and improvements will be rolling out to on-prem customers in the next few weeks.