From 3068ec357b20a759c92318e99bcb26118c1ff8a0 Mon Sep 17 00:00:00 2001
From: swindme <swindme@163.com>
Date: Fri, 19 Feb 2016 20:20:45 +0800
Subject: [PATCH 1/3] feat: Spin add tip

---
 components/spin/demo/tip.md | 15 +++++++++++++++
 components/spin/index.jsx   | 13 ++++++++-----
 components/spin/index.md    |  1 +
 style/components/spin.less  |  6 ++++++
 4 files changed, 30 insertions(+), 5 deletions(-)
 create mode 100644 components/spin/demo/tip.md

diff --git a/components/spin/demo/tip.md b/components/spin/demo/tip.md
new file mode 100644
index 0000000000..333af2e9f8
--- /dev/null
+++ b/components/spin/demo/tip.md
@@ -0,0 +1,15 @@
+# 自定义描述文案
+
+- order: 4
+
+自定义描述文案。
+
+---
+
+````jsx
+import { Spin } from 'antd';
+
+ReactDOM.render(
+  <Spin tip="自定义描述文案"/>
+, mountNode);
+````
diff --git a/components/spin/index.jsx b/components/spin/index.jsx
index 355721c3f3..c2c8266513 100644
--- a/components/spin/index.jsx
+++ b/components/spin/index.jsx
@@ -20,7 +20,7 @@ const AntSpin = React.createClass({
   },
 
   render() {
-    const { className, size, prefixCls } = this.props;
+    const { className, size, prefixCls, tip } = this.props;
 
     let spinClassName = classNames({
       [prefixCls]: true,
@@ -33,13 +33,16 @@ const AntSpin = React.createClass({
     let spinElement;
     if (!isCssAnimationSupported) {
       // not support for animation, just use text instead
-      spinElement = <div className={spinClassName}>加载中...</div>;
+      spinElement = <div className={spinClassName}>{tip || '加载中...'}</div>;
     } else {
       spinElement = (
         <div className={spinClassName}>
-          <span className={`${prefixCls}-dot ${prefixCls}-dot-first`} />
-          <span className={`${prefixCls}-dot ${prefixCls}-dot-second`} />
-          <span className={`${prefixCls}-dot ${prefixCls}-dot-third`} />
+          <div className={`${prefixCls}-tip`}>{tip}</div>
+          <div className={`${prefixCls}-dots`}>
+            <span className={`${prefixCls}-dot ${prefixCls}-dot-first`} />
+            <span className={`${prefixCls}-dot ${prefixCls}-dot-second`} />
+            <span className={`${prefixCls}-dot ${prefixCls}-dot-third`} />
+          </div>
         </div>
       );
     }
diff --git a/components/spin/index.md b/components/spin/index.md
index b605b259f3..c420475357 100644
--- a/components/spin/index.md
+++ b/components/spin/index.md
@@ -19,3 +19,4 @@
 |------------|----------------|-------------|--------------|
 | size       | enum           | default     | spin组件中点的大小，可选值为 small default large |
 | spining    | boolean        | true        | 用于内嵌其他组件的模式，可以关闭 loading 效果    |
+| tip    | string        | 无        | 自定义描述文案 |
diff --git a/style/components/spin.less b/style/components/spin.less
index 1fe2acb381..7f00eb0721 100644
--- a/style/components/spin.less
+++ b/style/components/spin.less
@@ -51,6 +51,12 @@
     pointer-events: none;
   }
 
+  // tip
+  // ------------------------------
+  &-tip {
+    color: @spin-dot-default;
+  }
+
   // dots
   // ------------------------------
 

From f7ba2969f665f940fc4494e8693d8d4303ca8dd2 Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Sun, 21 Feb 2016 14:48:14 +0800
Subject: [PATCH 2/3] Make tip replace dot

---
 components/spin/demo/tip.md | 10 +++++++---
 components/spin/index.jsx   |  7 +++----
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/components/spin/demo/tip.md b/components/spin/demo/tip.md
index 333af2e9f8..a9978d554d 100644
--- a/components/spin/demo/tip.md
+++ b/components/spin/demo/tip.md
@@ -2,14 +2,18 @@
 
 - order: 4
 
-自定义描述文案。
+自定义描述文案，指定的 tip 文案会直接代替 `...`。
 
 ---
 
 ````jsx
-import { Spin } from 'antd';
+import { Spin, Alert } from 'antd';
 
 ReactDOM.render(
-  <Spin tip="自定义描述文案"/>
+  <Spin tip="正在读取数据...">
+    <Alert message="消息提示的文案"
+      description="消息提示的辅助性文字介绍消息提示的辅助性文字介绍消息提示的辅助性文字介绍"
+      type="info" />
+  </Spin>
 , mountNode);
 ````
diff --git a/components/spin/index.jsx b/components/spin/index.jsx
index c2c8266513..2af710604b 100644
--- a/components/spin/index.jsx
+++ b/components/spin/index.jsx
@@ -6,13 +6,13 @@ const AntSpin = React.createClass({
   getDefaultProps() {
     return {
       prefixCls: 'ant-spin',
-      spining: true
+      spining: true,
     };
   },
 
   propTypes: {
     className: React.PropTypes.string,
-    size: React.PropTypes.oneOf(['small', 'default', 'large'])
+    size: React.PropTypes.oneOf(['small', 'default', 'large']),
   },
 
   isNestedPattern() {
@@ -31,13 +31,12 @@ const AntSpin = React.createClass({
     });
 
     let spinElement;
-    if (!isCssAnimationSupported) {
+    if (!isCssAnimationSupported || 'tip' in this.props) {
       // not support for animation, just use text instead
       spinElement = <div className={spinClassName}>{tip || '加载中...'}</div>;
     } else {
       spinElement = (
         <div className={spinClassName}>
-          <div className={`${prefixCls}-tip`}>{tip}</div>
           <div className={`${prefixCls}-dots`}>
             <span className={`${prefixCls}-dot ${prefixCls}-dot-first`} />
             <span className={`${prefixCls}-dot ${prefixCls}-dot-second`} />

From d83e04632722bc8088e153b4142aba0ebe68279b Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Wed, 9 Mar 2016 17:36:36 +0800
Subject: [PATCH 3/3] remove useless wrapper

---
 components/spin/index.jsx | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/components/spin/index.jsx b/components/spin/index.jsx
index 2af710604b..bb96b61d6e 100644
--- a/components/spin/index.jsx
+++ b/components/spin/index.jsx
@@ -37,11 +37,9 @@ const AntSpin = React.createClass({
     } else {
       spinElement = (
         <div className={spinClassName}>
-          <div className={`${prefixCls}-dots`}>
-            <span className={`${prefixCls}-dot ${prefixCls}-dot-first`} />
-            <span className={`${prefixCls}-dot ${prefixCls}-dot-second`} />
-            <span className={`${prefixCls}-dot ${prefixCls}-dot-third`} />
-          </div>
+          <span className={`${prefixCls}-dot ${prefixCls}-dot-first`} />
+          <span className={`${prefixCls}-dot ${prefixCls}-dot-second`} />
+          <span className={`${prefixCls}-dot ${prefixCls}-dot-third`} />
         </div>
       );
     }