К содержимому

SusAvatarGroup

SusAvatarGroup

Стек аватаров партии / ростера с overflow +N, когда Items превышают Max.

Пакет

SusKit · Атомы (коммерческий)

Открыть в песочнице

SusKit · Atoms

Свойства

ИмяТипПо умолчанию
MaxProp<int>3v-model
SizeProp<string>"default"v-model
RoundedProp<string>"circle"v-model

Слоты

Слотов нет.

События

Публичных событий нет.

Хуки стиля

Контракт USS-классов — внешний вид переопределяется без правки C#. Состояния переключаются этими классами:

  • sus-avatar-group
  • sus-avatar-group__avatar
  • sus-avatar-group__avatar--first
  • sus-avatar-group__more
  • sus-avatar-group__row
  • sus-avatar-group--default
  • sus-avatar-group--large
  • sus-avatar-group--small
  • sus-avatar-group--x-large
  • sus-avatar-group--x-small

Использование

Элементы задаются в коде (List<AvatarGroupItem>). У каждого элемента есть Text, опционально Image / Color / Status.

csharp
var group = new SusAvatarGroup();
group.Size.Value = "default";
group.Max.Value = 3;
group.Rounded.Value = "circle";
group.Items.Value = new List<SusAvatarGroup.AvatarGroupItem>
{
    new() { Text = "Alice", Color = "primary", Status = "online" },
    new() { Text = "Bob", Color = "success", Status = "away" },
    new() { Text = "Cara", Color = "info", Status = "busy" },
    new() { Text = "Dan", Color = "warning", Status = "offline" },
};
PropRole
ItemsList<AvatarGroupItem> — лица в стеке
MaxСколько аватаров показывать до overflow +N
Size / RoundedПрименяется к каждому дочернему аватару