Page History
...
| Do | Don’t | Article setting(s) |
|---|---|---|
Use showTime: true when hours/minutes matter. | Encode time in help text while leaving time selection off. | showTime |
| Constrain zoom to match the task (e.g., MONTH↔YEAR). | Leave default zoom so users must click through days for month-level picks. | minZoomMode, maxZoomMode |
| Pre-fill common ranges with today→tomorrow or a known default. | Start empty when most users pick “today”. | initializeWithCurrentDate, defaultValue |
| Persist the last chosen range across sessions when useful. | Clear the range on reload, forcing users to re-enter. | saveInLocalStorage |
| Use a compact explicit format to avoid truncation. | Rely on ambiguous, locale-dependent browser defaults. | format |
| Inline the calendar when range entry is frequent. | Force extra clicks with a dropdown in workflows that need constant adjustment. | type |
| Validate at the component level and mark as required when needed. | Depend solely on downstream validation to catch empty/invalid ranges. | validation, required |
| Wire downstream updates to value changes. | Require a separate “Apply” button to sync data. | events, ON_VALUE_CHANGE |
| Disable on policy while keeping it visible when awareness is needed. | Hide it when users should understand they lack edit rights. | authorizationDisable |
| Set a stable field name and request location for submissions. | Let backends infer where the range will appear. | dataField, controlsRequestType |
Accessibility
- Localize the field name so screen readers announce the correct label in the user’s language.
- Use an explicit, unambiguous date format to reduce misinterpretation by assistive technologies.
- Reduce keyboard navigation load by limiting calendar granularity to what the task needs (e.g., month/year only).
- Minimize unnecessary focus stops by enabling time inputs only when time precision is needed.
- Offer a quick “current date/time” action to reduce input effort for motor and cognitive accessibility.
- Provide a predictable initial value so the control announces meaningful content on first focus when helpful.
- Avoid re-entry burden across sessions by persisting the last valid range.
- Hide irrelevant inputs entirely to prevent confusion in the accessibility tree when the control is not applicable.
- Reflect permission states clearly by disabling interaction while leaving the value visible when policy requires it.
