Smart.StackLight displays the tower light of a machine as a column of coloured segments and an optional horn.

Green means running, amber means attention, red means stopped, blue is a call for assistance and white is a changeover. The component can be driven by a state word such as running, starved or fault, which the stateMap property translates into segments that are on, off or flashing, or segment by segment when the application mirrors the outputs of the physical tower. The horn is switched on by the application, and pressing it raises the muteRequest event.

A packaging line

Filler
Capper
Labeller
Case packer
Palletiser

Press the horn on the case packer. The component raises the muteRequest event and the application mutes the horn.

Five segments, a legend and horizontal orientation

A tower takes the five standard colours, red, amber, green, blue and white, and further segments in any CSS colour. The legend shows the name and state of each segment; the same text is used as the accessible name. The orientation property lays the tower horizontally for a header strip.

A custom state map

A plant with a different lighting convention replaces the map. In this example starved lights amber and blue together, and a sixth, plant-specific segment shows a quality hold.