[Avatar] Use structured / semantic markup for avatars and avatar groups

[paulschreiber]

Use structured / semantic markup for avatars and avatar groups. Improves experience for screen reader users.

• Add component overriding to the AvatarGroup component.
• Have AvatarGroup use ul by default. (consider in v6)
• Have Avatar use li by default. (consider in v6)

Fixes #33993.

• I have followed (at least) the PR section of the contributing guide.

[mui-bot]

Details of bundle changes

Generated by 🚫 dangerJS against 413e16e

[paulschreiber]

Need some help updating the .d file to add the propType.

[siriwatknp]

@paulschreiber Thanks for the PR but can you fix only the component prop issue for AvatarGroup first?

I think changing the semantics should be in v6. cc @mnajdova

[paulschreiber]

@siriwatknp I couldn't figure out the right component prop change. Can you make a push to the branch or GitHub code suggestion?

[mnajdova]

Please apply the suggested changes and run:

yarn proptypes
yarn docs:api
yarn prettier

We can't change the structure of the components in a minor, mainly because the avatar can be used outside of a group, which means that li as a tag would be wrong in that case.

[paulschreiber]

@mnajdova @siriwatknp I pushed the other changes but am not sure what to do for the component prop.

[paulschreiber]

@mnajdova @siriwatknp component prop is updated.

[siriwatknp]

👍 Thanks for the fix!