ScaleBar

ScaleBar has no keys of its own and nothing in it is focusable: a scale is read, not operated. Tab passes it by.

The root is a plain div, not a landmark, an image or a named region: the scale is one line of text to a screen reader, "Scale 300 m", read in place, and a role="img" with an aria-label would hide the same words in an attribute that expectOwnedStrings and the reader both read less reliably than text.

The label is not a live region: the distance changes with every zoom step and 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: the eye gets the distance and, from the bar's shape, that it is a scale; the ear gets "Scale" from VisuallyHidden and the same distance from the label's text. With no resolution, the eye gets "—" and the ear "Unknown". No colour carries meaning.
• Every landmark and named region has an accessible name: none here; the root is not a landmark.
• Every default label can be overridden: scaleLabel, metersUnitLabel, kilometersUnitLabel and unknownLabel.
• Every shape the type accepts renders, in every variant: metersPerPixel as a fraction of a metre, as metres and as kilometres, at each of the four round steps, and as 0, a negative number, NaN and Infinity, which show "—". ScaleBar.test.tsx runs the rounding over each, and the stories render metres, kilometres, the shortest bar and the unknown.
• A hidden copy kept for animation is aria-hidden, and a collapsed region is inert: none here; nothing animates or collapses. The bar and the "—" are hidden because the words beside them say them, not for animation.
• Native semantics first: plain div and span, text read in place, aria-hidden on the drawn bar and the "—", and no ARIA of the pattern's own beyond that.
• Focus moves in reading order and returns on close: nothing takes focus or opens; the DOM order, label then bar, is the order on screen.
• Every target is at least size.target-min square: no target; nothing in the scale is pressed.
• Loops stop when the system asks for less motion: none here; nothing moves on its own, and the bar's length changes without a transition.

Every word ScaleBar shows or announces is its own: the caller gives a number, never a word. unknown is reused from packages/perron/src/locale/en.ts; the other three are new keys, which the build adds to all four locale files, with the Danish, Swedish and Norwegian below.

The new keys read scale "Scale", metersUnit "m" and kilometersUnit "km", with the units written as the SI symbols in every locale. Content design writes a space before units, "4 min", "45 km/h", so the distance reads "300 m" and "2 km", the symbols every Nordic locale writes the same; the keys follow minutesUnit, Delay's unit after a figure; "Scale" names what the distance measures for a reader who can't see the bar, and is "Målestok", "Skala" and "Målestokk" in the others; symbols, unlike "metres" and "kilometres", need no singular and plural for "1 km" and "2 km".

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.