Dot

A status indicator component for displaying states like online, offline, pending, or neutral.

Installation

npx shadcn@latest add https://spoke.georgedrury.co.uk/r/dot

Spoke

Class	Fallback chain	Description
`--dot-primary`	`var(--primary)`	Colour for primary dot variant
`--dot-positive`	`oklch(0.6 0.15 145)`	Colour for positive/success state
`--dot-negative`	`oklch(0.577 0.245 27.325)`	Colour for negative/error state
`--dot-pending`	`oklch(0.7 0.15 85)`	Colour for pending/warning state
`--dot-neutral`	`var(--muted-foreground)`	Colour for neutral/inactive state