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 | 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 { Icon } from '@zohodesk/icons';
import style from './AvatarCollision.module.css';
export default class AvatarCollision extends React.Component {
constructor(props) {
super(props);
}
render() {
let { title, src, name, size, onClick, needCreateChat, isLeft, isIdle, initial, customProps, dataSelectorId } =
this.props;
let { AvatarCollisionProps = {}, AvatarProps = {} } = customProps;
return (
<div
className={`${style.container} ${isLeft ? style.off : isIdle ? style.idle : style.on}`}
onClick={onClick}
data-id='collsionPop'
data-test-id='collsionPop'
data-title={title}
data-selector-id={dataSelectorId}
{...AvatarCollisionProps}
>
<Avatar
src={src}
name={name}
size={size}
palette='default'
needTitle={false}
initial={initial}
{...AvatarProps}
/>
{needCreateChat && !isLeft && (
<span className={style.pop} data-title={title}>
<span className={style.icon}>
<Icon name='ZD-livechat3' />
</span>
</span>
)}
</div>
);
}
}
AvatarCollision.propTypes = propTypes;
AvatarCollision.defaultProps = defaultProps;
// if (__DOCS__) {
// AvatarCollision.docs = {
// componentGroup: 'Avatar Group'
// };
// }
|