The footer buttons (Clear / Cancel / Done) were hardcoded to control-height-sm
+ font-size-sm + space-3 padding regardless of the host picker's size. At
xs the buttons looked oversized next to a compact picker; at lg they
looked undersized.
- picker-shell.css: refactored button rules to consume four `--_picker-shell-*`
CSS vars (control-h, padding-x, font, gap, row-spacing). Defaults match
the previous sm sizing. Added explicit xs/md/lg variant blocks keyed off
`[data-popover-content][data-picker-size='X']`.
- date-picker-content / date-range-picker-content / time-picker-content /
time-range-picker-content / color-picker-content: forward the picker's
resolvedSize to the popover via a separate `data-picker-size` attr,
independent from the popover chrome's clamped `data-size`.
This decouples the popover's own chrome (which still clamps xs → sm because
the popover layer has no xs variant) from the picker-shell button scaling,
which now uses the picker's true size.
Verified at /uix/components/date-picker:
- xs → 22 / 12px (control-height-xxs, font-size-xs)
- sm → 30 / 14px (default)
- md → 36 / 16px
- lg → 44 / 16px
Also fixes the horizontal scroll at xs that surfaced the issue. The
date-picker.css `[data-popover-content]:has(...)` rule lets the popover
grow to max-content when it hosts a calendar / grid.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
dev
826481f1d5