Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 | 1x 1x 1x 1x 1x 1x | import React from 'react';
import { defaultProps } from './props/defaultProps';
import { propTypes } from './props/propTypes';
import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
import style from './AvatarStatus.module.css';
export default class AvatarStatus extends React.Component {
constructor(props) {
super(props);
}
render() {
let {
src,
name,
size,
onClick,
title,
state,
dataId,
initial,
shape,
needTitle,
className,
needBorder,
palette,
textPalette,
customTextClass,
statusTitle,
customProps,
dataSelectorId,
needDefaultBorder
} = this.props;
let { AvatarStatusProps = {}, AvatarProps = {} } = customProps;
return (
<div
className={`${style.container} ${className} `}
{...AvatarStatusProps}
aria-label={`${title}, ${name}, ${statusTitle}`}
data-selector-id={dataSelectorId}
>
<Avatar
src={src}
name={name}
palette={palette}
textPalette={textPalette}
customClass={customTextClass}
title={title}
onClick={onClick}
size={size}
dataId={dataId}
initial={initial}
shape={shape}
needTitle={needTitle}
needDefaultBorder={needDefaultBorder}
needBorder={needBorder}
{...AvatarProps}
/>
<span data-title={statusTitle} className={`${style.state} ${style[state]} ${style[size]} ${style[shape]}`} />
</div>
);
}
}
AvatarStatus.defaultProps = defaultProps;
AvatarStatus.propTypes = propTypes;
// if (__DOCS__) {
// AvatarStatus.docs = {
// componentGroup: 'Avatar Group'
// };
// }
|