Skip to main content

TableRowStatus

<ui5-table-row-status> | Since 2.29.0

The ui5-table-row-status component defines the status indicator of a ui5-table-row. It is placed in the status slot of the ui5-table-row and renders a colored bar based on its value.

Note: For the status to be rendered, the ui5-table-header-row must contain a ui5-table-header-row-status in its status slot.

ES6 Module Import​

import "@ui5/webcomponents/dist/TableRowStatus.js";

Basic Sample​

Properties​

text​

DescriptionDefines the text alternative announced by assistive technologies for the status indicator.
If set, it overrides the default announcement derived from value. In the extended design, this text is also shown as a tooltip over the entire status cell. Use it to provide a more specific description of the row's status (for example, "Out of stock" instead of "Error").
Typestring | undefined
Defaultundefined

value​

DescriptionDefines the semantic status of the row.
A colored indicator is rendered at the start of the row to signal its status. Semantic values (Positive, Critical, Negative, Information) also provide a built-in screen-reader announcement. If neither value nor colorScheme is set, no status indicator is rendered.
Type"Critical" | "Information" | "Negative" | "Positive" | undefined (value descriptions in: RowStatus)
Defaultundefined

Slots​

No slots available for this component.

Events​

No events available for this component.

Methods​

No methods available for this component.

CSS Parts​

No CSS parts available for this component.

CSS Custom States​

No CSS custom states available for this component.