Seven Segment <smart-seven-segment>

Accessibility Attributes

The SevenSegment is a panel meter readout drawn as lit and unlit SVG segments, which have no meaning to a screen reader. The component exposes the number the segments display, not the segments themselves.

The following ARIA attributes are used inside the SevenSegment:

• role="img" - set on the readout's container. The value is drawn, not written, so it needs a text alternative.
• aria-label - the value as a number, with its unit - "345.6 L/min". This is the whole point of the component's accessibility support: a reader must be given the reading, not a description of twenty-eight illuminated bars. The decimal point is inserted according to precisionDigits, so the announced number matches the displayed one.
• aria-label (blank, no reading, over and under range) - when the display is blank it announces No value; for NaN or an infinity, drawn as dashes, it announces No reading; and when the value will not fit the digits available it announces Over range, or Under range for a negative value. A display showing bars is not the same as a display showing a reading, and the difference matters to an operator.
• aria-hidden="true" - set on every segment graphic, so the SVG contributes nothing to the accessibility tree.
• aria-disabled - indicates that the readout is disabled.

Keyboard Interaction

The SevenSegment is a readout and takes no keyboard focus. It displays a value and raises no events, so it is not placed in the tab order.

Localization

All strings the SevenSegment 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 SevenSegment uses the following message keys:

• overRange
• underRange
• noReading
• blank
• readout

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.