Delay

Delay is text: it takes no focus, and no key does anything. A caller who makes it a link or button through render brings that element's own keys.

The visible figure is aria-hidden, with a VisuallyHidden label saying the delay in words: the number without its sign and then "min late" or "min early" ("3 min late", "1 min early"), and "Delay unknown" in place of "—", while "On time" is read from the visible text. A screen reader reads "+3 min" as "plus 3 min" and skips or spells "—", so the ear would get less than the eye, and an aria-label on a role-less <span> is not allowed.

What axe won't catch, from the contract, each with how this component meets it:

• Everything the eye is told, the ear is told, for every shape each prop accepts: the colour and sign say late, slight, early or on time; the label says "N min late" or "N min early", "On time" is read as shown, and null says "Delay unknown". In forced colours the colour goes, and the sign and words still carry it.
• Every landmark and named region has an accessible name: none here; Delay is inline text.
• Every default label can be overridden: minutesUnitLabel, minutesLateLabel, minutesEarlyLabel, onTimeLabel and delayUnknownLabel.
• Every shape the type accepts renders, in every variant: minutes is a number or null; positive, negative, zero, fractional (rounded), NaN and infinite (both unknown, CR-1) all render, and a story's play test covers each kind.
• A hidden copy kept for animation is aria-hidden, and a collapsed region is inert: none here; Delay does not animate. The visible figure is aria-hidden because the label speaks for it, not for animation.
• Native semantics first: a <span>, with no role and no ARIA beyond aria-hidden on the figure the label replaces.
• Focus moves in reading order and returns on close: Delay takes no focus.
• Every target is at least size.target-min square: no target; Delay is not pressed.
• Loops stop when the system asks for less motion: none here; Delay has no motion.

Every word Delay shows or announces is its own; the caller gives only minutes. The number is never part of a string: it renders as its own text run beside the word, so the dictionaries stay plain strings (CR-3).

No key in packages/perron/src/locale/en.ts says any of these, so all five are new, each with a JSDoc line like its neighbours.

"On time" and "Delay unknown" join the data-state and delay words table in docs/content-design.md, with their Danish, Swedish and Norwegian, so every screen says a delay the same way; content design says delays always use the words in that table, and its test then holds the locale files to them. "min", "min late" and "min early" stay out of it, as parts of a number's phrase rather than words a screen shows on their own.

For a caller using the component, with the reason. Each row is a rule: a must row's Don't is never right, a should row's needs a reason, and Checked by says what catches the Don't in a caller's code.