Avatar Group

#Basic usage

avatar-group/basic Vue React

avatar-group/basic.vue

<script setup lang="ts">
import { Avatar, AvatarGroup } from "@bysages/vue";
</script>

<template>
  <AvatarGroup>
    <Avatar.Root>
      <Avatar.Fallback>SG</Avatar.Fallback>
    </Avatar.Root>
    <Avatar.Root>
      <Avatar.Fallback>LM</Avatar.Fallback>
    </Avatar.Root>
    <Avatar.Root>
      <Avatar.Fallback>WZ</Avatar.Fallback>
    </Avatar.Root>
    <Avatar.Root>
      <Avatar.Fallback>+6</Avatar.Fallback>
    </Avatar.Root>
  </AvatarGroup>
</template>

#Props

#AvatarGroup

Avatars overlapping one row, each rimmed in the ground so the pile stays legible.

Prop	Type	Default	Description
`size`	`String as PropType<"sm" \| "md" \| "lg">`	`undefined`	One register for every seal: falls onto data-size for the stylesheet to re-point the avatars' measure.