|
Do
|
Compose DateField with Calendar for choosing one date; use the same locale, inclusive limits and availability policy in both. |
|
Do
|
Use a named sibling disclosure with aria-haspopup=dialog, aria-expanded and aria-controls. Include the selected formatted date in its change-date name. |
|
Do
|
Open on disclosure activation or Alt+ArrowDown from entry; move focus to the parsed draft, committed date or host-local today, clamped to bounds. |
|
Do
|
Selecting an available day commits immediately, closes the layer and restores disclosure focus. Escape closes only this layer and restores focus without a calendar commit. |
|
Do
|
Use a nonmodal anchored dialog. Tab follows native order through calendar steps and one roving day; focus leaving the composition or outside pointer dismissal closes it without stealing focus. |
|
Do
|
Keep the calendar panel the same width as the date input, with aligned start/end edges. Flip above when more space is available, cap overflow to the viewport and re-evaluate on scroll and resize; host containers must not clip the layer. |
|
Do
|
Keep embedded disclosure hover ink-only and press on the half-space.1 inset plate with radius.control minus that inset; expanded never means selected. |
|
Do
|
Keep readonly and disabled values visible and disclosure unavailable; a containing modal owns outer focus confinement. |
|
Don’t
|
Do not discard invalid typed drafts on dismissal or silently commit a highlighted date. |
|
Don’t
|
Do not imply range picking or a general portal/Popover adapter; those remain separate extensions. |