| 55 | } |
| 56 | |
| 57 | function AvatarBadge({ className, ...props }: React.ComponentProps<"span">) { |
| 58 | return ( |
| 59 | <span |
| 60 | data-slot="avatar-badge" |
| 61 | className={cn( |
| 62 | "absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground ring-2 ring-background select-none", |
| 63 | "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden", |
| 64 | "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2", |
| 65 | "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2", |
| 66 | className |
| 67 | )} |
| 68 | {...props} |
| 69 | /> |
| 70 | ) |
| 71 | } |
| 72 | |
| 73 | function AvatarGroup({ className, ...props }: React.ComponentProps<"div">) { |
| 74 | return ( |