Two-endpoint date entry. Mirrors DateField × 2 with shared validation
and a single label naming the whole range. Each Input scopes its own
DateField context internally, so segments inside re-use the existing
date-field recipe automatically.
Eidos surface:
- variant / color / size — same vocabulary as <DateField>, cascaded
via data-* on the root to both endpoint inputs and their segments
- Re-uses DateField.Segment (zero duplication)
Recipe (date-range-field.css):
- Label + control row stack
- Em-dash separator rendered via `::before` on the end Input
(no manual `<span>—</span>` needed)
- Endpoint-aware tint via `data-active` on the holding input
Morfo:
- scope: ['soma'] → ['soma', 'sema', 'eidos']
- apg URL: Spinbutton (per segment)
- Passive at this contract layer (events come from the two endpoint
DateField runtimes); README documents the classification
Sidebar nav: 'Date range field' added under Forms (next to Date field).
Tier 2 sprint progress: 1/3 (date-range-field next: time-range-field,
range-calendar).
Checks: svelte-check 0 errors, component:audit 91/91 PASS.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
