From 2be48ead91008d3ffea296227a9c8ef0a28ae57f Mon Sep 17 00:00:00 2001 From: ilanus Date: Sun, 28 Oct 2018 18:17:00 +0100 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20comment=20cleanup?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/comment/Editor.tsx | 2 -- components/comment/Nested.tsx | 15 --------------- components/comment/index.en-US.md | 12 ++++++------ components/comment/index.tsx | 15 ++++++++++++--- components/comment/index.zh-CN.md | 12 ++++++------ 5 files changed, 24 insertions(+), 32 deletions(-) delete mode 100644 components/comment/Nested.tsx diff --git a/components/comment/Editor.tsx b/components/comment/Editor.tsx index 0067675c1e..b6a56cf0cc 100644 --- a/components/comment/Editor.tsx +++ b/components/comment/Editor.tsx @@ -3,7 +3,6 @@ import classNames from 'classnames'; export interface CommentEditorProps { avatar: React.ReactNode; - children?: React.ReactNode; className?: string; editorStyle?: React.CSSProperties; headStyle?: React.CSSProperties; @@ -16,7 +15,6 @@ export interface CommentEditorProps { export default (props: CommentEditorProps) => { const { avatar, - children, className, content, editorStyle, diff --git a/components/comment/Nested.tsx b/components/comment/Nested.tsx deleted file mode 100644 index 52cbe40755..0000000000 --- a/components/comment/Nested.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import * as React from 'react'; -import classNames from 'classnames'; - -export interface NestedCommentProps { - prefixCls?: string; - style?: React.CSSProperties; - className?: string; - children: React.ReactNode; -} - -export default (props: NestedCommentProps) => { - const { prefixCls = 'ant-comment', className, ...others } = props; - const classString = classNames(`${prefixCls}-nested`, className); - return
; -}; diff --git a/components/comment/index.en-US.md b/components/comment/index.en-US.md index 36b3b13919..1974d8110d 100644 --- a/components/comment/index.en-US.md +++ b/components/comment/index.en-US.md @@ -18,8 +18,8 @@ Comments can be used to enable discussions on an entity for example page, blog p | actions | List of action items rendered below the comment content | Array | - | | author | The element to display as the comment author | ReactNode | - | | avatar | The element to display as the comment avatar - generally an antd `Avatar` | ReactNode | - | -| className | className of comment | string | - | | children | Nested comments should be provided as children of the Comment | ReactNode | - | +| className | className of comment | string | - | | content | The main content of the comment | ReactNode | - | | contentStyle | Inline style to apply to the comment content | object | - | | headStyle | Inline style to apply to the comment head | object | - | @@ -34,11 +34,11 @@ Comments can be used to enable discussions on an entity for example page, blog p | Property | Description | Type | Default | | -------- | ----------- | ---- | ------- | -| prefixCls | prefix className defaults to `.ant-comment` | string | .ant-comment | -| style | Additional style for the editor | object | - | +| avatar | The element to display as the comment avatar - generally an antd `Avatar` | ReactNode | - | | className | className of editor | string | - | -| headStyle | Inline style to apply to the comment head | object | - | +| content | The element to display as the editor | ReactNode | - | | editorStyle | Inline style to apply to the comment editor | object | - | +| headStyle | Inline style to apply to the comment head | object | - | | innerStyle | Inline style to apply to the comment inner comment editor | object | - | -| avatar | The element to display as the comment avatar - generally an antd `Avatar` | ReactNode | - | -| children | The element to display as the editor | ReactNode | - | +| prefixCls | prefix className defaults to `.ant-comment` | string | .ant-comment | +| style | Additional style for the editor | object | - | diff --git a/components/comment/index.tsx b/components/comment/index.tsx index 4000a0f9d9..151127f605 100644 --- a/components/comment/index.tsx +++ b/components/comment/index.tsx @@ -1,10 +1,8 @@ import * as React from 'react'; import classNames from 'classnames'; import Tooltip from '../tooltip'; -import Nested from './Nested'; import Editor from './Editor'; -export { NestedCommentProps } from './Nested'; export { CommentEditorProps } from './Editor'; export interface CommentProps { @@ -54,6 +52,17 @@ export default class Comment extends React.Component { return actionList; } + renderNested = (child: React.ReactElement) => { + const { prefixCls = 'ant-comment' } = this.props; + const classString = classNames(`${prefixCls}-nested`); + + return ( +
+ {child} +
+ ) + } + render() { const { actions, @@ -131,7 +140,7 @@ export default class Comment extends React.Component { const nestedComments = React.Children.toArray(children).map((child: React.ReactElement) => - React.cloneElement({child}, {})); + React.cloneElement(this.renderNested(child), {})); return (
diff --git a/components/comment/index.zh-CN.md b/components/comment/index.zh-CN.md index 4ae9051c56..63500ca751 100644 --- a/components/comment/index.zh-CN.md +++ b/components/comment/index.zh-CN.md @@ -19,8 +19,8 @@ cols: 1 | actions | 在评论内容下面呈现的操作项列表 | Array | - | | author | 要显示为注释作者的元素 | ReactNode | - | | avatar | 要显示为评论头像的元素 - 通常是antd `Avatar` | ReactNode | - | -| className | 网格容器类名 | string | - | | children | 嵌套注释应作为注释的子项提供 | ReactNode | - | +| className | 网格容器类名 | string | - | | content | 评论的主要内容 | ReactNode | - | | contentStyle | 要应用于评论内容的内联样式 | object | - | | headStyle | 要应用于注释头的内联样式 | object | - | @@ -35,11 +35,11 @@ cols: 1 | Property | Description | Type | Default | | -------- | ----------- | ---- | ------- | -| prefixCls | prefix className默认为`.ant-comment` | string | .ant-comment | -| style | 编辑器的其他样式 | object | - | +| avatar | 要显示为评论头像的元素 - 通常是antd `Avatar` | ReactNode | - | | className | 编辑器的className | string | - | -| headStyle | 要应用于注释头的内联样式 | object | - | +| content | 要显示为编辑器的元素 | ReactNode | - | | editorStyle | 要应用于注释编辑器的内联样式 | object | - | +| headStyle | 要应用于注释头的内联样式 | object | - | | innerStyle | 要应用于注释内部注释编辑器的内联样式 | object | - | -| avatar | 要显示为评论头像的元素 - 通常是antd `Avatar` | ReactNode | - | -| children | 要显示为编辑器的元素 | ReactNode | - | +| prefixCls | prefix className默认为`.ant-comment` | string | .ant-comment | +| style | 编辑器的其他样式 | object | - |