mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-05 13:37:52 +08:00
39 lines
967 B
TypeScript
39 lines
967 B
TypeScript
import classNames from 'classnames';
|
|
import * as React from 'react';
|
|
|
|
type widthUnit = number | string;
|
|
|
|
export interface SkeletonParagraphProps {
|
|
prefixCls?: string;
|
|
className?: string;
|
|
style?: React.CSSProperties;
|
|
width?: widthUnit | Array<widthUnit>;
|
|
rows?: number;
|
|
}
|
|
|
|
const Paragraph: React.FC<SkeletonParagraphProps> = (props) => {
|
|
const getWidth = (index: number) => {
|
|
const { width, rows = 2 } = props;
|
|
if (Array.isArray(width)) {
|
|
return width[index];
|
|
}
|
|
// last paragraph
|
|
if (rows - 1 === index) {
|
|
return width;
|
|
}
|
|
return undefined;
|
|
};
|
|
const { prefixCls, className, style, rows } = props;
|
|
const rowList = [...Array(rows)].map((_, index) => (
|
|
// eslint-disable-next-line react/no-array-index-key
|
|
<li key={index} style={{ width: getWidth(index) }} />
|
|
));
|
|
return (
|
|
<ul className={classNames(prefixCls, className)} style={style}>
|
|
{rowList}
|
|
</ul>
|
|
);
|
|
};
|
|
|
|
export default Paragraph;
|