fix ant-design#1453

ddcat1115 · May 6, 2016 · 7c866bc · 7c866bc
1 parent 7b54c49
commit 7c866bc
Show file tree

Hide file tree

Showing 6 changed files with 15 additions and 1 deletion.
diff --git a/components/popconfirm/index.jsx b/components/popconfirm/index.jsx
@@ -11,6 +11,7 @@ const noop = () => {};
 export default class Popconfirm extends React.Component {
   static defaultProps = {
     transitionName: 'zoom-big',
+    openClassName: 'ant-popup',
     placement: 'top',
     trigger: 'click',
     overlayStyle: {},

diff --git a/components/popconfirm/index.md b/components/popconfirm/index.md
@@ -25,3 +25,5 @@ english: Popconfirm
 | onVisibleChange | 显示隐藏的回调                      | function(visible) | 无     |
 | okText    | 确认按钮文字                              | String        | 确定   |
 | cancelText| 取消按钮文字                              | String        | 取消   |
+| openClassName     | 气泡框展现时触发器添加的class，可用于触发时触发器的样式指定 | string | ant-popup    |
+
diff --git a/components/popover/index.jsx b/components/popover/index.jsx
@@ -8,6 +8,7 @@ const placements = getPlacements();
 export default class Popover extends React.Component {
   static defaultProps = {
     prefixCls: 'ant-popover',
+    openClassName: 'ant-popup',
     placement: 'top',
     transitionName: 'zoom-big',
     trigger: 'hover',

diff --git a/components/popover/index.md b/components/popover/index.md
@@ -26,3 +26,5 @@ english: Popover
 | visible   | 用于手动控制浮层显隐                     | boolean       | false  |
 | onVisibleChange | 显示隐藏改变的回调                 | function      | 无     |
 | getTooltipContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。[示例](http://codepen.io/anon/pen/ONjyba?editors=001) | Function(triggerNode) | () => document.body |
+| openClassName     | 气泡框展现时触发器添加的class，可用于触发时触发器的样式指定 | string | ant-popup    |
+
diff --git a/components/tooltip/index.jsx b/components/tooltip/index.jsx
@@ -9,6 +9,7 @@ const placements = getPlacements({
 export default class Tooltip extends React.Component {
   static defaultProps = {
     prefixCls: 'ant-tooltip',
+    openClassName: 'ant-popup',
     placement: 'top',
     transitionName: 'zoom-big',
     mouseEnterDelay: 0.1,
@@ -67,6 +68,11 @@ export default class Tooltip extends React.Component {
     if (!this.props.title && !this.props.overlay) {
       visible = false;
     }
+    if ('visible' in this.props) {
+      visible = this.props.visible;
+    }
+    const children = this.props.children;
+    const childrenCls = children.props.className ? `${children.props.className} ${this.props.openClassName}` : this.props.openClassName;
     return (
       <RcTooltip transitionName={this.props.transitionName}
         builtinPlacements={placements}
@@ -76,7 +82,7 @@ export default class Tooltip extends React.Component {
         onPopupAlign={this.onPopupAlign}
         ref="tooltip"
         {...this.props}>
-        {this.props.children}
+        {visible ? React.cloneElement(children, { className: childrenCls }) : this.props.children}
       </RcTooltip>
     );
   }

diff --git a/components/tooltip/index.md b/components/tooltip/index.md
@@ -19,3 +19,5 @@ english: Tooltip
 |-----------|------------------------------------------|------------|--------|
 | placement | 气泡框位置，可选 `top` `left` `right` `bottom` `topLeft` `topRight` `bottomLeft` `bottomRight` `leftTop` `leftBottom` `rightTop` `rightBottom` | string     | top    |
 | title     | 提示文字                                 | string/React.Element | 无     |
+| openClassName     | 气泡框展现时触发器添加的class，可用于触发时触发器的样式指定 | string | ant-popup    |
+