🐛 comment cleanup

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,

components/comment/Nested.tsx

@@ -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 <div {...others} className={classString} />;
-};

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<ReactNode> | - |
 | 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 | - |

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<CommentProps, {}> {
     return actionList;
   }
 
+  renderNested = (child: React.ReactElement<any>) => {
+    const { prefixCls = 'ant-comment' } = this.props;
+    const classString = classNames(`${prefixCls}-nested`);
+
+    return (
+      <div className={classString}>
+        {child}
+      </div>
+    )
+  }
+
   render() {
     const {
       actions,
@@ -131,7 +140,7 @@ export default class Comment extends React.Component<CommentProps, {}> {
 
     const nestedComments =
       React.Children.toArray(children).map((child: React.ReactElement<any>) =>
-        React.cloneElement(<Nested>{child}</Nested>, {}));
+        React.cloneElement(this.renderNested(child), {}));
 
     return (
       <div>

components/comment/index.zh-CN.md

@@ -19,8 +19,8 @@ cols: 1
 | actions | 在评论内容下面呈现的操作项列表 | Array<ReactNode> | - |
 | 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 | - |