Alarms and status
Multi-State Indicator <smart-multi-state-indicator>
MultiStateIndicator is a read-only lamp that shows one of several named states, such as running, stopped, manual, fault or unknown.
Accessibility Attributes
The MultiStateIndicator reports a state and is not operated. It is exposed as an image with a text alternative rather than as a control, so a screen reader announces the equipment state without suggesting that the indicator can be pressed.
The following ARIA attributes are used inside the MultiStateIndicator:
- role="img" - set on the indicator's container. The lamp is a graphic, and its meaning is entirely in its colour and its label, both of which are unavailable to a screen reader, so the text alternative carries the state instead.
- aria-label - the state's label, exactly as a sighted operator reads it - "Running", "Faulted", or the value of unknownLabel when no state matches. This is set whether or not showLabel is on: the visible label is optional, the accessible one is not.
- role="presentation" - set on the lamp itself, which is decoration once the container carries the meaning. Without it a reader would announce the same state twice.
- aria-disabled - indicates that the indicator is disabled.
Keyboard Interaction
The MultiStateIndicator is not interactive and takes no keyboard focus. It reports a state and raises no events, so there is nothing for a keyboard to operate. Placing it in the tab order would add a stop that does nothing, which is why it is not focusable.
Localization
All strings the MultiStateIndicator exposes to assistive technology come from its messages property, so they can be provided in the user's language. Set locale to select a language and add a language through messages. Assigning messages replaces the whole object, so include the existing languages when adding one: el.messages = Object.assign({}, el.messages, { de: pack }); If the built-in en pack is dropped, switching back to English shows raw message keys.
The MultiStateIndicator uses the following message keys:
- unknown
German, French, Spanish and Chinese packs are included in the Smart.Industrial package. Strings that are also exposed as properties default to empty and fall back to the pack, so the default text stays translatable while an explicit property value takes precedence.
Additional information on WAI-ARIA for the SMART Framework can be found here.