forked from ant-design/ant-design
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Avatar.tsx
33 lines (29 loc) · 1.06 KB
/
Avatar.tsx
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
import * as React from 'react';
import omit from 'omit.js';
import classNames from 'classnames';
import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
import Element, { SkeletonElementProps } from './Element';
export interface AvatarProps extends Omit<SkeletonElementProps, 'shape'> {
shape?: 'circle' | 'square';
}
const SkeletonAvatar = (props: AvatarProps) => {
const renderSkeletonAvatar = ({ getPrefixCls }: ConfigConsumerProps) => {
const { prefixCls: customizePrefixCls, className, active } = props;
const prefixCls = getPrefixCls('skeleton', customizePrefixCls);
const otherProps = omit(props, ['prefixCls']);
const cls = classNames(prefixCls, className, `${prefixCls}-element`, {
[`${prefixCls}-active`]: active,
});
return (
<div className={cls}>
<Element prefixCls={`${prefixCls}-avatar`} {...otherProps} />
</div>
);
};
return <ConfigConsumer>{renderSkeletonAvatar}</ConfigConsumer>;
};
SkeletonAvatar.defaultProps = {
size: 'default',
shape: 'circle',
};
export default SkeletonAvatar;