StatusBadge

3p-core v2.1.4

---

3p-core / StatusBadge

Variable: StatusBadge

const StatusBadge: React.FunctionComponent<IStatusBadgeProps>

Renders a stylized status badge with dynamic background and text color.

The badge color is determined by either:

• The colors prop (if a color match is found for the current status), or
• A fallback from getStatusBadgeColor(status)

This is useful for visualizing state (e.g., "Approved", "Pending", "Error") in SharePoint list views or dashboards.

Example

<StatusBadge status="Approved" bordered />
<StatusBadge status="Error" colors={{ Error: { color: '#fff', bgcolor: '#f00' } }} />