Avatar
Recenze a team. Obrázek nebo iniciály fallback v brand tintu. Skupina = překryvný stack s prstencem podkladu a přetečením +N.
5
Velikosti
24 → 64px
4
Tóny
podklad iniciál
AN
Fallback
iniciály ze jména
+N
Skupina
stack + přetečení
Velikosti
xs 24 · sm 32 · md 40 (default) · lg 48 · xl 64px.
Tóny
Podklad iniciál — sage (default), brand, mint, blush.
Skupina
Překryvný stack s prstencem podkladu. max ořízne a doplní +N.
+2
Props & pravidla
<Avatar>
components/ui/avatar.tsx| Prop | Typ | Default | Použití |
|---|---|---|---|
| name | string | — | Jméno (alt + iniciály, povinné) |
| src | string | — | URL obrázku (jinak iniciály) |
| size | "xs" | "sm" | "md" | "lg" | "xl" | "md" | 24 / 32 / 40 / 48 / 64px |
| tone | "sage" | "brand" | "mint" | "blush" | "sage" | Podklad iniciál |
| ring | boolean | false | Prstenec stránky (stack) |
<AvatarGroup>
components/ui/avatar.tsx| Prop | Typ | Default | Použití |
|---|---|---|---|
| names | string[] | — | Jména (povinné) |
| max | number | 4 | Limit, zbytek → +N |
| size | AvatarSize | "md" | Velikost |
Bez obrázku → iniciály ze jména (první + poslední slovo). Prop
name je vždy povinné kvůli alt textu a fallbacku.