Status Indicator

Status indicator communicates the state of a certain resource in the system.

#Guidelines

#When to use

• Indicate a system status of a certain resource.

#When not to use

• If a status indicator describes something that's customizable or was entered by a user. Status indicator should have predictable and pre-defined states.
• If a status indicator needs to be positioned near the label of the resource it's related to, use a badge instead.

#Placement

• Status indicator looks great inside a standalone "Status" column within tables.

#Content

• Prefer one or two words max.
• Avoid numbers.

#Props

Inherits margin props.

Name	Default	Description
variant	—	"success" | "error" | "processing" | "warning" | "inactive" Status indicator variant.
children	—	ReactNode Label describing the status.