Компоненты

Avatar

Аватар с инициалами и стопка с остатком.

Аватар: фото, а без него — инициалы на акцентном фоне. И стопка с нахлёстом для списка участников.

Пример

МТАСДК

МТАСДК+2

import { Avatar, AvatarStack, initials } from "@toimetdev/pathlogs-core";

<Avatar person={user} size="md" />
<AvatarStack people={task.assignees} max={3} />

initials("Мурат Тоймет"); // "МТ"

Стопка

Показывает первые max аватаров, остальные сворачивает в «+N». Кольцо цвета фона отделяет соседние аватары друг от друга.

Пропсы

Проп	Тип	По умолчанию	Описание
`person`*	`{ id: string; name: string; image?: string \| null }`	—	Кого показать. Без image рисуются инициалы.
`size`	`"xs" \| "sm" \| "md"`	`"sm"`	Размер: 20 / 24 / 32 px.
`tip`	`boolean`	`true`	Показывать имя подсказкой при наведении.

person*{ id: string; name: string; image?: string | null }

Кого показать. Без image рисуются инициалы.

size"xs" | "sm" | "md"

по умолчанию: "sm"

Размер: 20 / 24 / 32 px.

tipboolean

по умолчанию: true

Показывать имя подсказкой при наведении.

AvatarStack принимает people, max (по умолчанию 3) и size.