Components › Forms & input › Text field › Masked date input

Masked date input

canon

Date typed straight into a dd.mm.rrrr mask with inline validation; no leading zero required, ISO out only once complete and valid.

Merged to origin/main 15 September 2026 (MR !3540), approved by the product owner as part of the New person dialog work (`.claude/rules/design-system.md` §"Vstupy a mobil", 14 Sep 2026: a structured value is a mask, never free text). Sibling pattern to `MaskedPhoneInput` (input + muted ghost-template) but that component has no card of its own yet in this registry — it is only listed under `record-rail/rail`'s files — so this is the mask pattern's first documented entry, filed under Text field for lack of a dedicated family. Code correction against the design brief: `inputMode` is `"decimal"`, not `"numeric"`. The component's only call site (`NewContactDialog`, the New person dialog) is not merged yet, and it wires no calendar next to the field — "the calendar is a complement" is the rule this component exists to satisfy, not yet an observed behaviour. No stories: lives in `apps/web/src/components/multivalue/`, which `packages/ui` must not import. Registry repaired 17 Oct 2026 (review F1, F10): now exported from @acrm/ui (packages/ui/src/components/MaskedDateInput.tsx, lib/date-mask.ts); the apps/web paths and the "lives in apps/web" caveat are outdated.

Used in 2 files · 2 areas · 3× — components/person, components/relations

@acrm/ui <MaskedDateInput>.fl-mask .fl-mask-in .fl-mask-ghost .fl-mask.badSourceStory
ExamplesCodeUsageAccessibilityChangelog

Changelog since 2. 10. 2026