Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

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

Merged
merged 10 commits into from Aug 31, 2022
Merged

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

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
0977806
fix: default Avatar to <li>
paulschreiber Aug 19, 2022
42d90ab
feat: add component overriding to AvatarGroup
paulschreiber Aug 19, 2022
e46f6ab
fix: add component to AvatarGroup propTypes
paulschreiber Aug 19, 2022
189b90e
Update packages/mui-material/src/AvatarGroup/AvatarGroup.js
paulschreiber Aug 25, 2022
a9f45f3
Update packages/mui-material/src/Avatar/Avatar.js
paulschreiber Aug 25, 2022
95e24e3
fix: remove generated component prop
paulschreiber Aug 25, 2022
8d717a8
fix: add component prop to AvatarGroup
paulschreiber Aug 26, 2022
caa0109
fix: rebuild proptypes and API docs
paulschreiber Aug 26, 2022
6ebef78
add spec
siriwatknp Aug 31, 2022
413e16e
unskip test
siriwatknp Aug 31, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/mui-material/src/Avatar/Avatar.js
View file
Open in desktop
Expand Up @@ -134,7 +134,7 @@ const Avatar = React.forwardRef(function Avatar(inProps, ref) {
alt,
children: childrenProp,
className,
component = 'div',
component = 'li',
paulschreiber marked this conversation as resolved.
Show resolved Hide resolved
imgProps,
sizes,
src,
Expand Down
8 changes: 8 additions & 0 deletions packages/mui-material/src/AvatarGroup/AvatarGroup.js
View file
Open in desktop
Expand Up @@ -67,6 +67,7 @@ const AvatarGroup = React.forwardRef(function AvatarGroup(inProps, ref) {
const {
children: childrenProp,
className,
component = 'ul',
paulschreiber marked this conversation as resolved.
Show resolved Hide resolved
componentsProps = {},
max = 5,
spacing = 'medium',
Expand All @@ -80,6 +81,7 @@ const AvatarGroup = React.forwardRef(function AvatarGroup(inProps, ref) {
...props,
max,
spacing,
component,
variant,
};

Expand Down Expand Up @@ -115,6 +117,7 @@ const AvatarGroup = React.forwardRef(function AvatarGroup(inProps, ref) {

return (
<AvatarGroupRoot
as={component}
ownerState={ownerState}
className={clsx(classes.root, className)}
ref={ref}
Expand Down Expand Up @@ -167,6 +170,11 @@ AvatarGroup.propTypes /* remove-proptypes */ = {
* @ignore
*/
className: PropTypes.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: PropTypes.elementType,
/**
* The props used for each slot inside the AvatarGroup.
* @default {}
Expand Down