StatusDot renders a small circular indicator with StatusDotColor (Info, Success, Warning, Error, Neutral) and optional pulsing animation. StatusDotIndicator positions a dot on another element (inset vs edge, optional bordered ring) for avatars or icons.
StatusDot
Name
Type
Default
Description
className
string
—
@deprecated Pass layout through enum props and shipped parts. Request a missing case via find-pattern.
color
StatusDotColor
—
Semantic fill and glow. Defaults to {@link StatusDotColor.Info}.
pulsing
boolean
—
When true, applies a pulsing ring for attention in addition to color.
ref
Ref<HTMLSpanElement>
—
Ref to the decorative dot host.
Storybook
Interactive examples and edge cases for this component are in Storybook.