Keyboard shortcuts and accessibility
This commit is contained in:
parent
8590a047c7
commit
20a892247f
87 changed files with 3652 additions and 711 deletions
|
@ -133,7 +133,17 @@ export class Avatar extends React.Component<Props, State> {
|
|||
throw new Error(`Size ${size} is not supported!`);
|
||||
}
|
||||
|
||||
const role = onClick ? 'button' : undefined;
|
||||
let contents;
|
||||
|
||||
if (onClick) {
|
||||
contents = (
|
||||
<button className="module-avatar-button" onClick={onClick}>
|
||||
{hasImage ? this.renderImage() : this.renderNoImage()}
|
||||
</button>
|
||||
);
|
||||
} else {
|
||||
contents = hasImage ? this.renderImage() : this.renderNoImage();
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
|
@ -141,14 +151,11 @@ export class Avatar extends React.Component<Props, State> {
|
|||
'module-avatar',
|
||||
`module-avatar--${size}`,
|
||||
hasImage ? 'module-avatar--with-image' : 'module-avatar--no-image',
|
||||
!hasImage ? `module-avatar--${color}` : null,
|
||||
onClick ? 'module-avatar--with-click' : null
|
||||
!hasImage ? `module-avatar--${color}` : null
|
||||
)}
|
||||
ref={innerRef}
|
||||
role={role}
|
||||
onClick={onClick}
|
||||
>
|
||||
{hasImage ? this.renderImage() : this.renderNoImage()}
|
||||
{contents}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue