Avatar Status Dot · astryx-svelte

Avatar Status Dot @astryx-svelte/core v0.3.0 · Avatar

Usage

Size-aware status indicator dot that reads avatar size from context and scales proportionally. Each variant pairs a colour with a distinct built-in shape (filled, ring, minus) so status is never conveyed by colour alone (WCAG 1.4.1).

ts
 
import { Avatar } from '@astryx-svelte/core';

Examples

Common configurations, variations, and states.

AvatarStatusDot — Variants

Presence dots on Avatars using the success, neutral, and error variants. Pass an AvatarStatusDot to the Avatar status prop; the dot sizes itself to match the Avatar.