Threat Indicator

Stable

A specialized component for displaying threat levels and security status.

Examples

Threat Levels

15%SEC-1
45%SEC-2
82%SEC-3
98%SEC-4
tsx
<div className="flex gap-4">
  <ThreatIndicator level="low" value={15} label="SEC-1" />
  <ThreatIndicator level="medium" value={45} label="SEC-2" />
  <ThreatIndicator level="high" value={82} label="SEC-3" />
  <ThreatIndicator level="critical" value={98} label="SEC-4" />
</div>

API Reference

PropertyDescriptionTypeDefault
valueThe progress percentage (0-100).number-
levelThe threat severity level which determines the color."low" | "medium" | "high" | "critical""low"
labelOptional label displayed below the percentage.string-
sizeThe size of the indicator."sm" | "md" | "lg""md"