Status Dot

Installation

Install from the package for shared ownership or from the registry for copy-paste control.

Package Manager

pnpm add @glinui/ui @glinui/tokens

Registry

pnpm dlx @glinui/cli@latest add status-dot

Usage

1import { StatusDot } from "@glinui/ui"
2
3export function Demo() {
4  return (
5    <div className="space-y-2">
6      <StatusDot status="success" label="Healthy" />
7      <StatusDot status="warning" label="Degraded" />
8      <StatusDot status="danger" label="Down" pulse />
9    </div>
10  )
11}

Accessibility

• Pair status color with text for non-color-only communication.
• Optional pulse animation is reduced-motion safe.

Reduced Motion

Pulse animation uses `motion-safe` and disables with reduced-motion preferences.

API Reference

Source

Import directly from the package or browse the source on GitHub. Click any file to view it.

import { StatusDot } from "@glinui/ui"