From add2529518e62f5e05ddf7dcef9e7b68ead44b01 Mon Sep 17 00:00:00 2001
From: Juan Rodrigo Venegas Boesch <jrvboesch@gmail.com>
Date: Thu, 31 May 2018 10:31:12 -0600
Subject: [PATCH] Notice Icon avatar can accepts node elements

You can pass a react element like a custom icon from icon moon instead of an image.
---
 src/components/NoticeIcon/NoticeIconTab.d.ts |  2 +-
 src/components/NoticeIcon/NoticeList.js      | 10 +++++++++-
 src/components/NoticeIcon/NoticeList.less    |  3 +++
 src/components/NoticeIcon/index.en-US.md     |  2 +-
 src/components/NoticeIcon/index.zh-CN.md     |  2 +-
 5 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/components/NoticeIcon/NoticeIconTab.d.ts b/src/components/NoticeIcon/NoticeIconTab.d.ts
index 99be5957..f9786f85 100644
--- a/src/components/NoticeIcon/NoticeIconTab.d.ts
+++ b/src/components/NoticeIcon/NoticeIconTab.d.ts
@@ -1,6 +1,6 @@
 import * as React from 'react';
 export interface INoticeIconData {
-  avatar?: string;
+  avatar?: string|React.ReactNode;
   title?: React.ReactNode;
   description?: React.ReactNode;
   datetime?: React.ReactNode;
diff --git a/src/components/NoticeIcon/NoticeList.js b/src/components/NoticeIcon/NoticeList.js
index cafd6562..97b7e29f 100644
--- a/src/components/NoticeIcon/NoticeList.js
+++ b/src/components/NoticeIcon/NoticeList.js
@@ -28,11 +28,19 @@ export default function NoticeList({
           const itemCls = classNames(styles.item, {
             [styles.read]: item.read,
           });
+          const leftIcon = item.avatar ? (
+            typeof item.avatar === 'string' ? (
+              <Avatar className={styles.avatar} src={item.avatar} />
+            ) : (
+              item.avatar
+            )
+          ) : null;
+
           return (
             <List.Item className={itemCls} key={item.key || i} onClick={() => onClick(item)}>
               <List.Item.Meta
                 className={styles.meta}
-                avatar={item.avatar ? <Avatar className={styles.avatar} src={item.avatar} /> : null}
+                avatar={<span className={styles.iconElement}>{leftIcon}</span>}
                 title={
                   <div className={styles.title}>
                     {item.title}
diff --git a/src/components/NoticeIcon/NoticeList.less b/src/components/NoticeIcon/NoticeList.less
index f99d59e8..e34efdc9 100644
--- a/src/components/NoticeIcon/NoticeList.less
+++ b/src/components/NoticeIcon/NoticeList.less
@@ -18,6 +18,9 @@
       background: #fff;
       margin-top: 4px;
     }
+    .iconElement {
+      font-size: 32px;
+    }
 
     &.read {
       opacity: 0.4;
diff --git a/src/components/NoticeIcon/index.en-US.md b/src/components/NoticeIcon/index.en-US.md
index e7448060..3ee5677b 100644
--- a/src/components/NoticeIcon/index.en-US.md
+++ b/src/components/NoticeIcon/index.en-US.md
@@ -36,7 +36,7 @@ emptyImage | image  when list is empty  | string | -
 
 Property | Description | Type | Default
 ----|------|-----|------
-avatar | avatar img url  | string | -
+avatar | avatar img url  | string \| ReactNode | -
 title | title | ReactNode | -
 description | description info | ReactNode | -
 datetime | Timestamps | ReactNode | -
diff --git a/src/components/NoticeIcon/index.zh-CN.md b/src/components/NoticeIcon/index.zh-CN.md
index b396bae3..b5aa3c8f 100644
--- a/src/components/NoticeIcon/index.zh-CN.md
+++ b/src/components/NoticeIcon/index.zh-CN.md
@@ -36,7 +36,7 @@ emptyImage | 针对每个 Tab 定制空数据图片 | string | -
 
 参数 | 说明 | 类型 | 默认值
 ----|------|-----|------
-avatar | 头像图片链接 | string | -
+avatar | 头像图片链接 | string \| ReactNode | -
 title | 标题 | ReactNode | -
 description | 描述信息 | ReactNode | -
 datetime | 时间戳 | ReactNode | -
-- 
GitLab