AvatarGroup should also apply colorScheme and variant to the children

[isBatak]

Description

AvatarGroup is only applying size props to children Avatar.
https://github.com/chakra-ui/chakra-ui/blob/main/packages/components/src/avatar/avatar-group.tsx#L82

Add support for passing colorScheme and variant

Problem Statement/Justification

colorScheme and variant are not passed down to the Avatar component.

<Avatar.Group size='md' colorScheme="blue" varaint="square">
  <Avatar name='Ryan Florence' src='https://bit.ly/ryan-florence' />
  <Avatar name='Segun Adebayo' src='https://bit.ly/sage-adebayo' />
  <Avatar name='Kent Dodds' src='https://bit.ly/kent-c-dodds' />
  <Avatar name='Prosper Otemuyiwa' src='https://bit.ly/prosper-baba' />
  <Avatar name='Christian Nwamba' src='https://bit.ly/code-beast' />
</Avatar.Group>

Proposed Solution or API

This should be supported

<Avatar.Group size='md' colorScheme="blue" varaint="square">
  <Avatar name='Ryan Florence' src='https://bit.ly/ryan-florence' />
  <Avatar name='Segun Adebayo' src='https://bit.ly/sage-adebayo' />
  <Avatar name='Kent Dodds' src='https://bit.ly/kent-c-dodds' />
  <Avatar name='Prosper Otemuyiwa' src='https://bit.ly/prosper-baba' />
  <Avatar name='Christian Nwamba' src='https://bit.ly/code-beast' />
</Avatar.Group>

Alternatives

No response

Additional Information

No response

[imMatheus]

I can understand wanting variant as passed prop, but what would colorScheme get you? Im just trying to understand what use case colorScheme has for the Avatar component? 🤔

[isBatak]

You can override Avatar theme/recipe and use colorScheme/colorPalette to style some additional avatar features like border color or different color combinations for background and initials color.
For example: