Skip to main content
Version: 1.0.0

StatusBadge

@spartanfx/react v1.0.0


@spartanfx/react / 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' } }} />