From 1b23f98e2941caaf24106405aab3ce503ed567ff Mon Sep 17 00:00:00 2001
From: bplok20010 <505931977@qq.com>
Date: Wed, 5 Aug 2020 13:56:40 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8A=A8=E7=94=BB=E6=95=88=E6=9E=9C=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md                                     | 75 ++++++++-----------
 docs/asset-manifest.json                      |  4 +-
 docs/index.html                               |  2 +-
 ...b27.chunk.css => index.fa4784b4.chunk.css} |  2 +-
 docs/static/js/index.4ca12b27.chunk.js        |  1 -
 docs/static/js/index.fa4784b4.chunk.js        |  1 +
 package.json                                  |  2 +-
 src/index.tsx                                 | 43 ++++++-----
 src/style/index.css                           | 63 +++++++++-------
 9 files changed, 94 insertions(+), 99 deletions(-)
 rename docs/static/css/{index.4ca12b27.chunk.css => index.fa4784b4.chunk.css} (93%)
 delete mode 100644 docs/static/js/index.4ca12b27.chunk.js
 create mode 100644 docs/static/js/index.fa4784b4.chunk.js

diff --git a/README.md b/README.md
index f75e1f5..91e60c9 100644
--- a/README.md
+++ b/README.md
@@ -83,20 +83,6 @@ export interface TooltipProps extends Omit<TriggerProps, "popup" | "defaultPopup
 	delay: 100,
 	trigger: ["hover"],
 	outsideHideEventName: ["mousedown", "click"],
-	transition: {
-		classNames: {
-			appear: "tooltip-animated",
-			appearActive: "tooltip-fade-in",
-			appearDone: "",
-			enter: "tooltip-animated",
-			enterActive: "tooltip-fade-in",
-			enterDone: "",
-			exit: "tooltip-animated",
-			exitActive: "tooltip-fade-out",
-			exitDone: "",
-		},
-		timeout: 300,
-	},
 }
 ```
 
@@ -154,82 +140,86 @@ export interface TooltipProps extends Omit<TriggerProps, "popup" | "defaultPopup
     box-sizing: border-box;
 }
 
-.rw-tooltip-placement-top > .rw-tooltip-arrow,
-.rw-tooltip-placement-top-left > .rw-tooltip-arrow,
-.rw-tooltip-placement-top-right > .rw-tooltip-arrow {
+.rw-tooltip-placement-top>.rw-tooltip-arrow,
+.rw-tooltip-placement-top-left>.rw-tooltip-arrow,
+.rw-tooltip-placement-top-right>.rw-tooltip-arrow {
     bottom: -5px;
     border-width: 5px 5px 0;
     border-top-color: rgba(0, 0, 0, 0.9);
 }
 
-.rw-tooltip-placement-bottom > .rw-tooltip-arrow,
-.rw-tooltip-placement-bottom-left > .rw-tooltip-arrow,
-.rw-tooltip-placement-bottom-right > .rw-tooltip-arrow {
+.rw-tooltip-placement-bottom>.rw-tooltip-arrow,
+.rw-tooltip-placement-bottom-left>.rw-tooltip-arrow,
+.rw-tooltip-placement-bottom-right>.rw-tooltip-arrow {
     top: -5px;
     border-width: 0 5px 5px;
     border-bottom-color: rgba(0, 0, 0, 0.9);
 }
 
-.rw-tooltip-placement-left > .rw-tooltip-arrow,
-.rw-tooltip-placement-left-top > .rw-tooltip-arrow,
-.rw-tooltip-placement-left-bottom > .rw-tooltip-arrow {
+.rw-tooltip-placement-left>.rw-tooltip-arrow,
+.rw-tooltip-placement-left-top>.rw-tooltip-arrow,
+.rw-tooltip-placement-left-bottom>.rw-tooltip-arrow {
     right: -5px;
     border-width: 5px 0 5px 5px;
     border-left-color: rgba(0, 0, 0, 0.9);
 }
 
-.rw-tooltip-placement-right > .rw-tooltip-arrow,
-.rw-tooltip-placement-right-top > .rw-tooltip-arrow,
-.rw-tooltip-placement-right-bottom > .rw-tooltip-arrow {
+.rw-tooltip-placement-right>.rw-tooltip-arrow,
+.rw-tooltip-placement-right-top>.rw-tooltip-arrow,
+.rw-tooltip-placement-right-bottom>.rw-tooltip-arrow {
     left: -5px;
     border-width: 5px 5px 5px 0;
     border-right-color: rgba(0, 0, 0, 0.9);
 }
 
-.rw-tooltip-placement-top-left > .rw-tooltip-arrow,
-.rw-tooltip-placement-bottom-left > .rw-tooltip-arrow {
+.rw-tooltip-placement-top-left>.rw-tooltip-arrow,
+.rw-tooltip-placement-bottom-left>.rw-tooltip-arrow {
     left: 16px;
 }
 
-.rw-tooltip-placement-top > .rw-tooltip-arrow,
-.rw-tooltip-placement-bottom > .rw-tooltip-arrow {
+.rw-tooltip-placement-top>.rw-tooltip-arrow,
+.rw-tooltip-placement-bottom>.rw-tooltip-arrow {
     left: 50%;
     margin-left: -5px;
 }
 
-.rw-tooltip-placement-top-right > .rw-tooltip-arrow,
-.rw-tooltip-placement-bottom-right > .rw-tooltip-arrow {
+.rw-tooltip-placement-top-right>.rw-tooltip-arrow,
+.rw-tooltip-placement-bottom-right>.rw-tooltip-arrow {
     right: 16px;
 }
 
-.rw-tooltip-placement-left-top > .rw-tooltip-arrow,
-.rw-tooltip-placement-right-top > .rw-tooltip-arrow {
+.rw-tooltip-placement-left-top>.rw-tooltip-arrow,
+.rw-tooltip-placement-right-top>.rw-tooltip-arrow {
     top: 8px;
 }
 
-.rw-tooltip-placement-left > .rw-tooltip-arrow,
-.rw-tooltip-placement-right > .rw-tooltip-arrow {
+.rw-tooltip-placement-left>.rw-tooltip-arrow,
+.rw-tooltip-placement-right>.rw-tooltip-arrow {
     top: 50%;
     margin-top: -5px;
 }
 
-.rw-tooltip-placement-left-bottom > .rw-tooltip-arrow,
-.rw-tooltip-placement-right-bottom > .rw-tooltip-arrow {
+.rw-tooltip-placement-left-bottom>.rw-tooltip-arrow,
+.rw-tooltip-placement-right-bottom>.rw-tooltip-arrow {
     bottom: 8px;
 }
 
-.tooltip-animated {
-    animation-duration: 0.3s;
+.rw-tooltip-animated {
+    animation-duration: 0.2s;
 }
 
-.tooltip-fade-in {
+.rw-tooltip-fade-in {
     animation-name: TooltipFadeIn;
 }
 
-.tooltip-fade-out {
+.rw-tooltip-fade-out {
     animation-name: TooltipFadeOut;
 }
 
+.rw-tooltip-exit-done {
+    opacity: 0;
+}
+
 @keyframes TooltipFadeIn {
     from {
         opacity: 0;
@@ -239,6 +229,7 @@ export interface TooltipProps extends Omit<TriggerProps, "popup" | "defaultPopup
         opacity: 1;
     }
 }
+
 @keyframes TooltipFadeOut {
     from {
         opacity: 1;
diff --git a/docs/asset-manifest.json b/docs/asset-manifest.json
index 8f1fbcf..2a1141b 100644
--- a/docs/asset-manifest.json
+++ b/docs/asset-manifest.json
@@ -1,6 +1,6 @@
 {
-  "index.css": "static/css/index.4ca12b27.chunk.css",
-  "index.js": "static/js/index.4ca12b27.chunk.js",
+  "index.css": "static/css/index.fa4784b4.chunk.css",
+  "index.js": "static/js/index.fa4784b4.chunk.js",
   "runtime-index.js": "static/js/runtime-index.92eae014.js",
   "static/js/2.b694e620.chunk.js": "static/js/2.b694e620.chunk.js",
   "index.html": "index.html"
diff --git a/docs/index.html b/docs/index.html
index 0249b46..921029a 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -1 +1 @@
-<!doctype html><html><head><meta charset="utf-8"/><title>Tooltip</title><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1"/><style>.demo{width:80%;margin:100px auto;background:#fff;font-size:12px;overflow:auto}</style><link href="static/css/index.4ca12b27.chunk.css" rel="stylesheet"></head><body style="background:#f5f5f5"><div class="demo" id="demo"></div><script src="static/js/runtime-index.92eae014.js"></script><script src="static/js/2.b694e620.chunk.js"></script><script src="static/js/index.4ca12b27.chunk.js"></script></body></html>
\ No newline at end of file
+<!doctype html><html><head><meta charset="utf-8"/><title>Tooltip</title><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1"/><style>.demo{width:80%;margin:100px auto;background:#fff;font-size:12px;overflow:auto}</style><link href="static/css/index.fa4784b4.chunk.css" rel="stylesheet"></head><body style="background:#f5f5f5"><div class="demo" id="demo"></div><script src="static/js/runtime-index.92eae014.js"></script><script src="static/js/2.b694e620.chunk.js"></script><script src="static/js/index.fa4784b4.chunk.js"></script></body></html>
\ No newline at end of file
diff --git a/docs/static/css/index.4ca12b27.chunk.css b/docs/static/css/index.fa4784b4.chunk.css
similarity index 93%
rename from docs/static/css/index.4ca12b27.chunk.css
rename to docs/static/css/index.fa4784b4.chunk.css
index 884dd16..48662a6 100644
--- a/docs/static/css/index.4ca12b27.chunk.css
+++ b/docs/static/css/index.fa4784b4.chunk.css
@@ -1 +1 @@
-.container{display:flex;height:100%}.slider{width:200px;border-right:1px solid #f2f2fe}.slider>div{padding:10px;border-bottom:1px solid #f2f2fe;cursor:pointer}.slider .active{background:#39f;color:#fff}.content{overflow:auto;padding:10px;flex:1 1}.upload-test{width:400px;margin:0 auto}.upload1{border:2px dashed #ececec;border-radius:5px;height:100px;line-height:96px;position:relative}.tips,.upload1{text-align:center}.tips{position:absolute;bottom:0;left:0;right:0;padding:30px}.upload2{margin-top:20px;text-align:center}.upload2 button{width:100%;padding:8px}button{line-height:26px}.animated{animation-duration:.3s;animation-fill-mode:both}.animated.infinite{animation-iteration-count:infinite}.animated.delay500{animation-delay:.5s}@keyframes fadeIn{0%{opacity:0}to{opacity:.1}}.fadeIn{animation-name:fadeIn}@keyframes fadeOut{0%{opacity:.1}to{opacity:0}}.fadeOut{animation-name:fadeOut}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.fadeInDown{animation-name:fadeInDown}@keyframes fadeBottomIn{0%{opacity:0;transform:translateY(20%)}to{opacity:1;transform:translateY(0)}}.fadeBottomIn{animation-name:fadeBottomIn}@keyframes fadeBottomOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20%)}}.fadeBottomOut{animation-name:fadeBottomOut}@keyframes fadeInTop{0%{opacity:0;transform:translate3d(0,20px,0)}to{opacity:1;transform:translateZ(0)}}.fadeInTop{animation-name:fadeInTop}@keyframes fadeInRight{0%{opacity:0;transform:translate3d(20px,0,0)}to{opacity:1;transform:translateZ(0)}}.fadeInRight{animation-name:fadeInRight}@keyframes fadeOutLeft{0%{opacity:1;transform:translateZ(0)}to{opacity:0;transform:translate3d(-20px,0,0)}}.fadeOutLeft{animation-name:fadeOutLeft}@keyframes k-loadingF{0%{opacity:0}to{opacity:1}}.k-letter{animation-name:k-loadingF;animation-iteration-count:infinite;animation-direction:linear;display:inline-block}@keyframes cycle-loader{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.cycle-loading{display:inline-block;border-radius:50%;position:relative;border-style:solid;animation:cycle-loader 1.1s linear infinite}.rw-tooltip-root{right:0}.rw-tooltip,.rw-tooltip-root{position:absolute;left:0;top:0}.rw-tooltip{font-size:14px;z-index:2000}.rw-tooltip-mask{position:fixed;left:0;top:0;right:0;bottom:0;background:#000;opacity:.1;z-index:2000}.rw-tooltip-inner{position:relative;min-width:30px;min-height:32px;padding:6px 8px;color:#fff;text-align:left;text-decoration:none;word-wrap:break-word;background-color:rgba(0,0,0,.9);border-radius:2px;box-shadow:0 3px 6px -4px rgba(0,0,0,.12),0 6px 16px 0 rgba(0,0,0,.08),0 9px 28px 8px rgba(0,0,0,.05);box-sizing:border-box}.rw-tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid;box-sizing:border-box}.rw-tooltip-placement-top-left>.rw-tooltip-arrow,.rw-tooltip-placement-top-right>.rw-tooltip-arrow,.rw-tooltip-placement-top>.rw-tooltip-arrow{bottom:-5px;border-width:5px 5px 0;border-top-color:rgba(0,0,0,.9)}.rw-tooltip-placement-bottom-left>.rw-tooltip-arrow,.rw-tooltip-placement-bottom-right>.rw-tooltip-arrow,.rw-tooltip-placement-bottom>.rw-tooltip-arrow{top:-5px;border-width:0 5px 5px;border-bottom-color:rgba(0,0,0,.9)}.rw-tooltip-placement-left-bottom>.rw-tooltip-arrow,.rw-tooltip-placement-left-top>.rw-tooltip-arrow,.rw-tooltip-placement-left>.rw-tooltip-arrow{right:-5px;border-width:5px 0 5px 5px;border-left-color:rgba(0,0,0,.9)}.rw-tooltip-placement-right-bottom>.rw-tooltip-arrow,.rw-tooltip-placement-right-top>.rw-tooltip-arrow,.rw-tooltip-placement-right>.rw-tooltip-arrow{left:-5px;border-width:5px 5px 5px 0;border-right-color:rgba(0,0,0,.9)}.rw-tooltip-placement-bottom-left>.rw-tooltip-arrow,.rw-tooltip-placement-top-left>.rw-tooltip-arrow{left:16px}.rw-tooltip-placement-bottom>.rw-tooltip-arrow,.rw-tooltip-placement-top>.rw-tooltip-arrow{left:50%;margin-left:-5px}.rw-tooltip-placement-bottom-right>.rw-tooltip-arrow,.rw-tooltip-placement-top-right>.rw-tooltip-arrow{right:16px}.rw-tooltip-placement-left-top>.rw-tooltip-arrow,.rw-tooltip-placement-right-top>.rw-tooltip-arrow{top:8px}.rw-tooltip-placement-left>.rw-tooltip-arrow,.rw-tooltip-placement-right>.rw-tooltip-arrow{top:50%;margin-top:-5px}.rw-tooltip-placement-left-bottom>.rw-tooltip-arrow,.rw-tooltip-placement-right-bottom>.rw-tooltip-arrow{bottom:8px}.tooltip-animated{animation-duration:.3s}.tooltip-fade-in{animation-name:TooltipFadeIn}.tooltip-fade-out{animation-name:TooltipFadeOut}@keyframes TooltipFadeIn{0%{opacity:0}to{opacity:1}}@keyframes TooltipFadeOut{0%{opacity:1}to{opacity:0}}
\ No newline at end of file
+.container{display:flex;height:100%}.slider{width:200px;border-right:1px solid #f2f2fe}.slider>div{padding:10px;border-bottom:1px solid #f2f2fe;cursor:pointer}.slider .active{background:#39f;color:#fff}.content{overflow:auto;padding:10px;flex:1 1}.upload-test{width:400px;margin:0 auto}.upload1{border:2px dashed #ececec;border-radius:5px;height:100px;line-height:96px;position:relative}.tips,.upload1{text-align:center}.tips{position:absolute;bottom:0;left:0;right:0;padding:30px}.upload2{margin-top:20px;text-align:center}.upload2 button{width:100%;padding:8px}button{line-height:26px}.animated{animation-duration:.3s;animation-fill-mode:both}.animated.infinite{animation-iteration-count:infinite}.animated.delay500{animation-delay:.5s}@keyframes fadeIn{0%{opacity:0}to{opacity:.1}}.fadeIn{animation-name:fadeIn}@keyframes fadeOut{0%{opacity:.1}to{opacity:0}}.fadeOut{animation-name:fadeOut}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.fadeInDown{animation-name:fadeInDown}@keyframes fadeBottomIn{0%{opacity:0;transform:translateY(20%)}to{opacity:1;transform:translateY(0)}}.fadeBottomIn{animation-name:fadeBottomIn}@keyframes fadeBottomOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20%)}}.fadeBottomOut{animation-name:fadeBottomOut}@keyframes fadeInTop{0%{opacity:0;transform:translate3d(0,20px,0)}to{opacity:1;transform:translateZ(0)}}.fadeInTop{animation-name:fadeInTop}@keyframes fadeInRight{0%{opacity:0;transform:translate3d(20px,0,0)}to{opacity:1;transform:translateZ(0)}}.fadeInRight{animation-name:fadeInRight}@keyframes fadeOutLeft{0%{opacity:1;transform:translateZ(0)}to{opacity:0;transform:translate3d(-20px,0,0)}}.fadeOutLeft{animation-name:fadeOutLeft}@keyframes k-loadingF{0%{opacity:0}to{opacity:1}}.k-letter{animation-name:k-loadingF;animation-iteration-count:infinite;animation-direction:linear;display:inline-block}@keyframes cycle-loader{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.cycle-loading{display:inline-block;border-radius:50%;position:relative;border-style:solid;animation:cycle-loader 1.1s linear infinite}.rw-tooltip-root{right:0}.rw-tooltip,.rw-tooltip-root{position:absolute;left:0;top:0}.rw-tooltip{font-size:14px;z-index:2000}.rw-tooltip-mask{position:fixed;left:0;top:0;right:0;bottom:0;background:#000;opacity:.1;z-index:2000}.rw-tooltip-inner{position:relative;min-width:30px;min-height:32px;padding:6px 8px;color:#fff;text-align:left;text-decoration:none;word-wrap:break-word;background-color:rgba(0,0,0,.9);border-radius:2px;box-shadow:0 3px 6px -4px rgba(0,0,0,.12),0 6px 16px 0 rgba(0,0,0,.08),0 9px 28px 8px rgba(0,0,0,.05);box-sizing:border-box}.rw-tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid;box-sizing:border-box}.rw-tooltip-placement-top-left>.rw-tooltip-arrow,.rw-tooltip-placement-top-right>.rw-tooltip-arrow,.rw-tooltip-placement-top>.rw-tooltip-arrow{bottom:-5px;border-width:5px 5px 0;border-top-color:rgba(0,0,0,.9)}.rw-tooltip-placement-bottom-left>.rw-tooltip-arrow,.rw-tooltip-placement-bottom-right>.rw-tooltip-arrow,.rw-tooltip-placement-bottom>.rw-tooltip-arrow{top:-5px;border-width:0 5px 5px;border-bottom-color:rgba(0,0,0,.9)}.rw-tooltip-placement-left-bottom>.rw-tooltip-arrow,.rw-tooltip-placement-left-top>.rw-tooltip-arrow,.rw-tooltip-placement-left>.rw-tooltip-arrow{right:-5px;border-width:5px 0 5px 5px;border-left-color:rgba(0,0,0,.9)}.rw-tooltip-placement-right-bottom>.rw-tooltip-arrow,.rw-tooltip-placement-right-top>.rw-tooltip-arrow,.rw-tooltip-placement-right>.rw-tooltip-arrow{left:-5px;border-width:5px 5px 5px 0;border-right-color:rgba(0,0,0,.9)}.rw-tooltip-placement-bottom-left>.rw-tooltip-arrow,.rw-tooltip-placement-top-left>.rw-tooltip-arrow{left:16px}.rw-tooltip-placement-bottom>.rw-tooltip-arrow,.rw-tooltip-placement-top>.rw-tooltip-arrow{left:50%;margin-left:-5px}.rw-tooltip-placement-bottom-right>.rw-tooltip-arrow,.rw-tooltip-placement-top-right>.rw-tooltip-arrow{right:16px}.rw-tooltip-placement-left-top>.rw-tooltip-arrow,.rw-tooltip-placement-right-top>.rw-tooltip-arrow{top:8px}.rw-tooltip-placement-left>.rw-tooltip-arrow,.rw-tooltip-placement-right>.rw-tooltip-arrow{top:50%;margin-top:-5px}.rw-tooltip-placement-left-bottom>.rw-tooltip-arrow,.rw-tooltip-placement-right-bottom>.rw-tooltip-arrow{bottom:8px}.rw-tooltip-animated{animation-duration:.2s}.rw-tooltip-fade-in{animation-name:TooltipFadeIn}.rw-tooltip-fade-out{animation-name:TooltipFadeOut}.rw-tooltip-exit-done{opacity:0}@keyframes TooltipFadeIn{0%{opacity:0}to{opacity:1}}@keyframes TooltipFadeOut{0%{opacity:1}to{opacity:0}}
\ No newline at end of file
diff --git a/docs/static/js/index.4ca12b27.chunk.js b/docs/static/js/index.4ca12b27.chunk.js
deleted file mode 100644
index b350715..0000000
--- a/docs/static/js/index.4ca12b27.chunk.js
+++ /dev/null
@@ -1 +0,0 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[0],{120:function(e,t,n){},121:function(e,t,n){},122:function(e,t,n){},131:function(e,t,n){"use strict";n.r(t);var r=n(0),a=n.n(r),o=n(3),i=n.n(o),l=(n(120),n(121),n(122),n(47),n(124),n(2)),c=n.n(l),p=n(8),s=n.n(p),f=n(1),u=n.n(f),m=n(9),d=n.n(m),v=n(19),g=n.n(v),b=n(49),h=n(21),E=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return t=e.call.apply(e,[this].concat(r))||this,u()(c()(t),"arrowRef",a.a.createRef()),u()(c()(t),"triggerRef",a.a.createRef()),u()(c()(t),"feedback",void 0),u()(c()(t),"adjustArrowPosition",(function(){var e=t.feedback;if(e){var n=t.props,r=n.visibleArrow,a=n.keepArrowAtCenter;if(r&&t.triggerRef.current){var o=t.arrowRef.current;if(o&&(o.style.left="",o.style.top="",a)){var i=t.triggerRef.current.getTriggerNode(),l=t.triggerRef.current.getPopupNode(),c=Object(b.b)(e),p=i.offsetWidth,s=i.offsetHeight,f=l.offsetWidth,u=l.offsetHeight,m=i.getBoundingClientRect();if(/^(top|bottom)/.test(c))if(p>f)o.style.left="50%";else{var d=m.left+p/2-o.offsetWidth/2;Object(h.a)(o,{left:d})}else if(s>u)o.style.top="50%";else{var v=m.top+s/2-o.offsetHeight/2;Object(h.a)(o,{top:v})}t.feedback=null}}}})),u()(c()(t),"saveFeedback",(function(e,n,r){t.feedback=r})),u()(c()(t),"getPopup",(function(){var e=t.props,n=e.prefixCls,r=e.title,o=e.visibleArrow,i=e.role,l="function"===typeof r?r():r;return a.a.createElement(a.a.Fragment,null,o?a.a.createElement("div",{className:n+"-arrow",ref:t.arrowRef}):null,a.a.createElement("div",{className:n+"-inner",role:i},l))})),t}s()(t,e);var n=t.prototype;return n.componentDidMount=function(){this.componentDidUpdate()},n.componentDidUpdate=function(){this.adjustArrowPosition()},n.render=function(){var e=this.props,t=(e.title,e.visible),n=e.defaultVisible,r=e.trigger,o=e.arrowSize,i=e.offset,l=e.visibleArrow,c=(e.keepArrowAtCenter,e.destroyTooltipOnHide),p=e.transition,s=(e.role,g()(e,["title","visible","defaultVisible","trigger","arrowSize","offset","visibleArrow","keepArrowAtCenter","destroyTooltipOnHide","transition","role"]));return a.a.createElement(b.a,d()({},s,{ref:this.triggerRef,popupTransition:p,action:r,adjustPosition:this.saveFeedback,offset:l?i+o:i,destroyPopupOnHide:c,defaultPopupVisible:n,popupVisible:t,popup:this.getPopup}))},t}(a.a.Component);u()(E,"defaultProps",{prefixCls:"rw-tooltip",placement:"top",defaultVisible:!1,visibleArrow:!0,keepArrowAtCenter:!1,destroyTooltipOnHide:!0,arrowSize:6,offset:0,delay:100,trigger:["hover"],outsideHideEventName:["mousedown","click"],transition:{classNames:{appear:"tooltip-animated",appearActive:"tooltip-fade-in",appearDone:"",enter:"tooltip-animated",enterActive:"tooltip-fade-in",enterDone:"",exit:"tooltip-animated",exitActive:"tooltip-fade-out",exitDone:""},timeout:290},role:"tooltip"});var w=E;function y(e){var t=e.text,n=g()(e,["text"]);return a.a.createElement(w,d()({title:"Title----111itle----111itle----111"},n),a.a.createElement("button",null,t||n.placement))}var A=[{label:"\u57fa\u672c\u529f\u80fd",component:function(e){function t(){for(var t,n=arguments.length,r=new Array(n),a=0;a<n;a++)r[a]=arguments[a];return t=e.call.apply(e,[this].concat(r))||this,u()(c()(t),"state",{visible:!0}),t}s()(t,e);var n=t.prototype;return n.componentDidMount=function(){},n.render=function(){return a.a.createElement("div",null,a.a.createElement(y,{placement:"bottomLeft"}),a.a.createElement(y,{placement:"bottom"}),a.a.createElement(y,{placement:"bottomRight"}),a.a.createElement("hr",null),a.a.createElement(y,{placement:"topLeft"}),a.a.createElement(y,{placement:"top"}),a.a.createElement(y,{placement:"topRight"}),a.a.createElement("hr",null),a.a.createElement(y,{placement:"leftTop"}),a.a.createElement("br",null),a.a.createElement(y,{placement:"left"}),a.a.createElement("br",null),a.a.createElement(y,{placement:"leftBottom"}),a.a.createElement("hr",null),a.a.createElement(y,{placement:"rightTop"}),a.a.createElement("br",null),a.a.createElement(y,{placement:"right",defaultVisible:!0}),a.a.createElement("br",null),a.a.createElement(y,{placement:"rightBottom"}))},t}(r.Component)}],k=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),a=0;a<n;a++)r[a]=arguments[a];return t=e.call.apply(e,[this].concat(r))||this,u()(c()(t),"state",{current:A[0]}),t}s()(t,e);var n=t.prototype;return n.onDemoChange=function(e,t){this.setState({current:e})},n.render=function(){var e=this,t=this.state.current;return a.a.createElement("div",{className:"container"},a.a.createElement("div",{className:"slider"},A.map((function(n,r){return a.a.createElement("div",{key:r,className:t===n?"active":"",onClick:e.onDemoChange.bind(e,n)},n.label)}))),a.a.createElement("div",{className:"content"},t?a.a.createElement(t.component,null):null))},t}(r.Component);i.a.render(a.a.createElement(k,null),document.getElementById("demo"))},80:function(e,t,n){n(81),e.exports=n(131)}},[[80,1,2]]]);
\ No newline at end of file
diff --git a/docs/static/js/index.fa4784b4.chunk.js b/docs/static/js/index.fa4784b4.chunk.js
new file mode 100644
index 0000000..afaa2f5
--- /dev/null
+++ b/docs/static/js/index.fa4784b4.chunk.js
@@ -0,0 +1 @@
+(window.webpackJsonp=window.webpackJsonp||[]).push([[0],{120:function(e,t,n){},121:function(e,t,n){},122:function(e,t,n){},131:function(e,t,n){"use strict";n.r(t);var r=n(0),a=n.n(r),o=n(3),i=n.n(o),l=(n(120),n(121),n(122),n(47),n(124),n(2)),c=n.n(l),p=n(8),s=n.n(p),f=n(1),u=n.n(f),m=n(9),d=n.n(m),v=n(19),g=n.n(v),h=n(49),b=n(21),E=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return t=e.call.apply(e,[this].concat(r))||this,u()(c()(t),"arrowRef",a.a.createRef()),u()(c()(t),"triggerRef",a.a.createRef()),u()(c()(t),"feedback",void 0),u()(c()(t),"adjustArrowPosition",(function(){var e=t.feedback;if(e){var n=t.props,r=n.visibleArrow,a=n.keepArrowAtCenter;if(r&&t.triggerRef.current){var o=t.arrowRef.current;if(o&&(o.style.left="",o.style.top="",a)){var i=t.triggerRef.current.getTriggerNode(),l=t.triggerRef.current.getPopupNode(),c=Object(h.b)(e),p=i.offsetWidth,s=i.offsetHeight,f=l.offsetWidth,u=l.offsetHeight,m=i.getBoundingClientRect();if(/^(top|bottom)/.test(c))if(p>f)o.style.left="50%";else{var d=m.left+p/2-o.offsetWidth/2;Object(b.a)(o,{left:d})}else if(s>u)o.style.top="50%";else{var v=m.top+s/2-o.offsetHeight/2;Object(b.a)(o,{top:v})}t.feedback=null}}}})),u()(c()(t),"saveFeedback",(function(e,n,r){t.feedback=r})),u()(c()(t),"getPopup",(function(){var e=t.props,n=e.prefixCls,r=e.title,o=e.visibleArrow,i=e.role,l="function"===typeof r?r():r;return a.a.createElement(a.a.Fragment,null,o?a.a.createElement("div",{className:n+"-arrow",ref:t.arrowRef}):null,a.a.createElement("div",{className:n+"-inner",role:i},l))})),t}s()(t,e);var n=t.prototype;return n.getDefaultTransition=function(){var e=this.props.prefixCls;return"transition"in this.props?this.props.transition:{classNames:{appear:e+"-animated",appearActive:e+"-fade-in",appearDone:e+"-appear-done",enter:e+"-animated",enterActive:e+"-fade-in",enterDone:e+"-enter-done",exit:e+"-animated",exitActive:e+"-fade-out",exitDone:e+"-exit-done"},timeout:180}},n.componentDidMount=function(){this.componentDidUpdate()},n.componentDidUpdate=function(){this.adjustArrowPosition()},n.render=function(){var e=this.props,t=(e.title,e.visible),n=e.defaultVisible,r=e.trigger,o=e.arrowSize,i=e.offset,l=e.visibleArrow,c=(e.keepArrowAtCenter,e.destroyTooltipOnHide),p=(e.transition,e.role,g()(e,["title","visible","defaultVisible","trigger","arrowSize","offset","visibleArrow","keepArrowAtCenter","destroyTooltipOnHide","transition","role"]));return a.a.createElement(h.a,d()({},p,{ref:this.triggerRef,popupTransition:this.getDefaultTransition(),action:r,adjustPosition:this.saveFeedback,offset:l?i+o:i,destroyPopupOnHide:c,defaultPopupVisible:n,popupVisible:t,popup:this.getPopup}))},t}(a.a.Component);u()(E,"defaultProps",{prefixCls:"rw-tooltip",placement:"top",defaultVisible:!1,visibleArrow:!0,keepArrowAtCenter:!1,destroyTooltipOnHide:!0,arrowSize:6,offset:0,delay:100,trigger:["hover"],outsideHideEventName:["mousedown","click"],role:"tooltip"});var w=E;function y(e){var t=e.text,n=g()(e,["text"]);return a.a.createElement(w,d()({title:"Title----111itle----111itle----111"},n),a.a.createElement("button",null,t||n.placement))}var A=[{label:"\u57fa\u672c\u529f\u80fd",component:function(e){function t(){for(var t,n=arguments.length,r=new Array(n),a=0;a<n;a++)r[a]=arguments[a];return t=e.call.apply(e,[this].concat(r))||this,u()(c()(t),"state",{visible:!0}),t}s()(t,e);var n=t.prototype;return n.componentDidMount=function(){},n.render=function(){return a.a.createElement("div",null,a.a.createElement(y,{placement:"bottomLeft"}),a.a.createElement(y,{placement:"bottom"}),a.a.createElement(y,{placement:"bottomRight"}),a.a.createElement("hr",null),a.a.createElement(y,{placement:"topLeft"}),a.a.createElement(y,{placement:"top"}),a.a.createElement(y,{placement:"topRight"}),a.a.createElement("hr",null),a.a.createElement(y,{placement:"leftTop"}),a.a.createElement("br",null),a.a.createElement(y,{placement:"left"}),a.a.createElement("br",null),a.a.createElement(y,{placement:"leftBottom"}),a.a.createElement("hr",null),a.a.createElement(y,{placement:"rightTop"}),a.a.createElement("br",null),a.a.createElement(y,{placement:"right",defaultVisible:!0}),a.a.createElement("br",null),a.a.createElement(y,{placement:"rightBottom"}))},t}(r.Component)}],k=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),a=0;a<n;a++)r[a]=arguments[a];return t=e.call.apply(e,[this].concat(r))||this,u()(c()(t),"state",{current:A[0]}),t}s()(t,e);var n=t.prototype;return n.onDemoChange=function(e,t){this.setState({current:e})},n.render=function(){var e=this,t=this.state.current;return a.a.createElement("div",{className:"container"},a.a.createElement("div",{className:"slider"},A.map((function(n,r){return a.a.createElement("div",{key:r,className:t===n?"active":"",onClick:e.onDemoChange.bind(e,n)},n.label)}))),a.a.createElement("div",{className:"content"},t?a.a.createElement(t.component,null):null))},t}(r.Component);i.a.render(a.a.createElement(k,null),document.getElementById("demo"))},80:function(e,t,n){n(81),e.exports=n(131)}},[[80,1,2]]]);
\ No newline at end of file
diff --git a/package.json b/package.json
index 6f42ec4..335ccf0 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "react-widget-tooltip",
-	"version": "1.0.0",
+	"version": "1.0.1",
 	"description": "react-widget-tooltip",
 	"main": "cjs/index.js",
 	"module": "esm/index.js",
diff --git a/src/index.tsx b/src/index.tsx
index 80d1d84..01c82ef 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -58,27 +58,6 @@ export class Tooltip extends React.Component<TooltipProps, TooltipState> {
 		delay: 100,
 		trigger: ["hover"],
 		outsideHideEventName: ["mousedown", "click"],
-		transition: {
-			classNames: {
-				appear: "tooltip-animated",
-				appearActive: "tooltip-fade-in",
-				appearDone: "",
-				enter: "tooltip-animated",
-				enterActive: "tooltip-fade-in",
-				enterDone: "",
-				exit: "tooltip-animated",
-				exitActive: "tooltip-fade-out",
-				exitDone: "",
-			},
-			timeout: 290,
-			// addEndListener(node: HTMLElement, cb: () => void) {
-			// 	const next = () => {
-			// 		node.removeEventListener("animationend", next);
-			// 		cb();
-			// 	};
-			// 	node.addEventListener("animationend", next);
-			// },
-		},
 		role: "tooltip",
 	};
 
@@ -86,6 +65,26 @@ export class Tooltip extends React.Component<TooltipProps, TooltipState> {
 	triggerRef: React.RefObject<Trigger> = React.createRef();
 	feedback: Feedback | null;
 
+	getDefaultTransition(): TriggerProps["popupTransition"] {
+		const { prefixCls } = this.props;
+		return "transition" in this.props
+			? this.props.transition
+			: {
+					classNames: {
+						appear: prefixCls + "-animated",
+						appearActive: prefixCls + "-fade-in",
+						appearDone: prefixCls + "-appear-done",
+						enter: prefixCls + "-animated",
+						enterActive: prefixCls + "-fade-in",
+						enterDone: prefixCls + "-enter-done",
+						exit: prefixCls + "-animated",
+						exitActive: prefixCls + "-fade-out",
+						exitDone: prefixCls + "-exit-done",
+					},
+					timeout: 180,
+			  };
+	}
+
 	adjustArrowPosition = () => {
 		const feedback = this.feedback;
 
@@ -189,7 +188,7 @@ export class Tooltip extends React.Component<TooltipProps, TooltipState> {
 			<Trigger
 				{...restProps}
 				ref={this.triggerRef}
-				popupTransition={transition}
+				popupTransition={this.getDefaultTransition()}
 				action={trigger}
 				adjustPosition={this.saveFeedback}
 				offset={visibleArrow ? offset! + arrowSize! : offset}
diff --git a/src/style/index.css b/src/style/index.css
index ec3ad77..f4d2bdf 100644
--- a/src/style/index.css
+++ b/src/style/index.css
@@ -49,82 +49,86 @@
     box-sizing: border-box;
 }
 
-.rw-tooltip-placement-top > .rw-tooltip-arrow,
-.rw-tooltip-placement-top-left > .rw-tooltip-arrow,
-.rw-tooltip-placement-top-right > .rw-tooltip-arrow {
+.rw-tooltip-placement-top>.rw-tooltip-arrow,
+.rw-tooltip-placement-top-left>.rw-tooltip-arrow,
+.rw-tooltip-placement-top-right>.rw-tooltip-arrow {
     bottom: -5px;
     border-width: 5px 5px 0;
     border-top-color: rgba(0, 0, 0, 0.9);
 }
 
-.rw-tooltip-placement-bottom > .rw-tooltip-arrow,
-.rw-tooltip-placement-bottom-left > .rw-tooltip-arrow,
-.rw-tooltip-placement-bottom-right > .rw-tooltip-arrow {
+.rw-tooltip-placement-bottom>.rw-tooltip-arrow,
+.rw-tooltip-placement-bottom-left>.rw-tooltip-arrow,
+.rw-tooltip-placement-bottom-right>.rw-tooltip-arrow {
     top: -5px;
     border-width: 0 5px 5px;
     border-bottom-color: rgba(0, 0, 0, 0.9);
 }
 
-.rw-tooltip-placement-left > .rw-tooltip-arrow,
-.rw-tooltip-placement-left-top > .rw-tooltip-arrow,
-.rw-tooltip-placement-left-bottom > .rw-tooltip-arrow {
+.rw-tooltip-placement-left>.rw-tooltip-arrow,
+.rw-tooltip-placement-left-top>.rw-tooltip-arrow,
+.rw-tooltip-placement-left-bottom>.rw-tooltip-arrow {
     right: -5px;
     border-width: 5px 0 5px 5px;
     border-left-color: rgba(0, 0, 0, 0.9);
 }
 
-.rw-tooltip-placement-right > .rw-tooltip-arrow,
-.rw-tooltip-placement-right-top > .rw-tooltip-arrow,
-.rw-tooltip-placement-right-bottom > .rw-tooltip-arrow {
+.rw-tooltip-placement-right>.rw-tooltip-arrow,
+.rw-tooltip-placement-right-top>.rw-tooltip-arrow,
+.rw-tooltip-placement-right-bottom>.rw-tooltip-arrow {
     left: -5px;
     border-width: 5px 5px 5px 0;
     border-right-color: rgba(0, 0, 0, 0.9);
 }
 
-.rw-tooltip-placement-top-left > .rw-tooltip-arrow,
-.rw-tooltip-placement-bottom-left > .rw-tooltip-arrow {
+.rw-tooltip-placement-top-left>.rw-tooltip-arrow,
+.rw-tooltip-placement-bottom-left>.rw-tooltip-arrow {
     left: 16px;
 }
 
-.rw-tooltip-placement-top > .rw-tooltip-arrow,
-.rw-tooltip-placement-bottom > .rw-tooltip-arrow {
+.rw-tooltip-placement-top>.rw-tooltip-arrow,
+.rw-tooltip-placement-bottom>.rw-tooltip-arrow {
     left: 50%;
     margin-left: -5px;
 }
 
-.rw-tooltip-placement-top-right > .rw-tooltip-arrow,
-.rw-tooltip-placement-bottom-right > .rw-tooltip-arrow {
+.rw-tooltip-placement-top-right>.rw-tooltip-arrow,
+.rw-tooltip-placement-bottom-right>.rw-tooltip-arrow {
     right: 16px;
 }
 
-.rw-tooltip-placement-left-top > .rw-tooltip-arrow,
-.rw-tooltip-placement-right-top > .rw-tooltip-arrow {
+.rw-tooltip-placement-left-top>.rw-tooltip-arrow,
+.rw-tooltip-placement-right-top>.rw-tooltip-arrow {
     top: 8px;
 }
 
-.rw-tooltip-placement-left > .rw-tooltip-arrow,
-.rw-tooltip-placement-right > .rw-tooltip-arrow {
+.rw-tooltip-placement-left>.rw-tooltip-arrow,
+.rw-tooltip-placement-right>.rw-tooltip-arrow {
     top: 50%;
     margin-top: -5px;
 }
 
-.rw-tooltip-placement-left-bottom > .rw-tooltip-arrow,
-.rw-tooltip-placement-right-bottom > .rw-tooltip-arrow {
+.rw-tooltip-placement-left-bottom>.rw-tooltip-arrow,
+.rw-tooltip-placement-right-bottom>.rw-tooltip-arrow {
     bottom: 8px;
 }
 
-.tooltip-animated {
-    animation-duration: 0.3s;
+.rw-tooltip-animated {
+    animation-duration: 0.2s;
 }
 
-.tooltip-fade-in {
+.rw-tooltip-fade-in {
     animation-name: TooltipFadeIn;
 }
 
-.tooltip-fade-out {
+.rw-tooltip-fade-out {
     animation-name: TooltipFadeOut;
 }
 
+.rw-tooltip-exit-done {
+    opacity: 0;
+}
+
 @keyframes TooltipFadeIn {
     from {
         opacity: 0;
@@ -134,6 +138,7 @@
         opacity: 1;
     }
 }
+
 @keyframes TooltipFadeOut {
     from {
         opacity: 1;
@@ -142,4 +147,4 @@
     to {
         opacity: 0;
     }
-}
+}
\ No newline at end of file