DataStateKey

DataStateKey has no keys of its own and nothing in it is focusable: it is read, not operated.

An item reads "Live 412 Reported by the vehicle in the last 2.5 min", and one with no count "No signal Unknown Moved on by the timetable, with no report for over 5 min".

The root is a list with no name of its own and no live region, as ReportStrip's is: a caller names it with the heading beside it, such as "How sure are we?", through aria-labelledby; the counts change every few seconds, which would flood a screen reader, and Accessibility asks that only changes of state be announced, in the screen's own polite live region.

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: each dot's state is told to the ear by the word beside it, through VehicleDotLabel; each count is read after its word, and an unknown one as "Unknown" in place of the hidden "—" (CR-5); each sentence is visible text, read in place, and one whose threshold is unknown is "—" for the eye and "Unknown" for the ear (CR-7). No colour carries meaning: the dots are one ink, the text's (CR-3), and no signal's grey comes with its cut and its word.
• Every landmark and named region has an accessible name: none here; the key is a list, not a landmark or region, and a caller names it with aria-label or aria-labelledby (CR-13).
• Every default label can be overridden: liveLabel, ageingLabel, estimatedLabel, timetableOnlyLabel, noSignalLabel, liveDescriptionLabel, ageingDescriptionLabel, estimatedDescriptionLabel, timetableOnlyDescriptionLabel, noSignalDescriptionLabel, secondsDurationLabel, minutesDurationLabel and unknownLabel.
• Every shape the type accepts renders, in every variant: counts with all five states, with some left out, null, NaN and Infinity (unknown), with 0 (a count) and with a count past a thousand (grouped); thresholds under 2 min, at 2 min, past it with a half minute and whole, and NaN or below 0 (unknown); every *Label string replaces only its own string, a sentence's override keeps its placeholders filled, and an undefined one keeps the locale's. DataStateKey takes no ReactNode.
• A hidden copy kept for animation is aria-hidden, and a collapsed region is inert: none here; nothing animates or collapses. The dots and an unknown figure's "—" are aria-hidden because words beside them say them, not for animation.
• Native semantics first: a <ul> of <li>s, each with a VehicleDotLabel, a <span> of digits and a Text <span> of words; no ARIA of the pattern's own beyond the "—"'s aria-hidden, which UnknownValue sets.
• Focus moves in reading order and returns on close: nothing takes focus or opens; Tab passes the key by.
• Every target is at least size.target-min square: no target; nothing in the key is pressed.
• Loops stop when the system asks for less motion: none here; nothing moves, and a count changes its text without a transition.

Every word the key shows or announces is its own; the caller gives only numbers. The five state words and "Unknown" are keys packages/perron/src/locale/en.ts already has. The five sentences and the two durations are new: each sentence is worded from what Data states says the state means, so every screen that explains the states says the same thing in the same four languages, and the thresholds are placeholders the app's figures fill (CR-6, CR-7).

The English sentences are "Reported by the vehicle in the last {liveThreshold}", "Last reported {liveThreshold} to {ageingThreshold} ago", "Placed from the timetable and the latest delay", "No real-time data, placed from the timetable alone" and "Moved on by the timetable, with no report for over {ageingThreshold}", with no full stop: each says one state's "Means" from Data states in a plain sentence about the vehicle, as content design asks, live in the ticket's own words; "GPS" is left out, since a vehicle's report is its position whatever the source; "{liveThreshold} to {ageingThreshold}" writes each figure with its own unit, "2.5 min to 5 min", rather than content design's range with one unit at its end, "Every 3 to 4 min", since the two thresholds can take different units, "60 s to 5 min"; no signal's "moved on by the timetable" is the foundation's own and says, as No signal keeps moving asks, that its place is a guess, and it comes first, before the figure, so no punctuation follows a placeholder in any locale: expectOwnedStrings reads a comma straight after a filled figure, "5 min,", as a word no dictionary holds; and with one sentence each and no other in the item, a full stop adds nothing, as the library's other owned strings have none.

The new strings join en.ts with a JSDoc each that names its placeholders, and the other dictionaries in Danish, Swedish and Norwegian. In secondsDuration and minutesDuration the space between the figure's placeholder and the unit is a no-break space (U+00A0) in every locale:

For a caller using the pattern, 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.