ui-kit-ck-consultant 0.5.254 → 0.5.256

package/dist/index.js

@@ -194,22 +194,57 @@ var Button = /*#__PURE__*/function (_React$Component) {
 var ButtonIcon = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(ButtonIcon, _React$Component);
 
-  function ButtonIcon() {
-    return _React$Component.apply(this, arguments) || this;
+  function ButtonIcon(props) {
+    var _this;
+
+    _this = _React$Component.call(this, props) || this;
+    _this.state = {
+      isHover: false
+    };
+    return _this;
   }
 
   var _proto = ButtonIcon.prototype;
 
   _proto.render = function render() {
-    var _classNames;
+    var _classNames,
+        _this2 = this;
 
     var buttonClass = classNames$1((_classNames = {}, _classNames[style$1.button_icon] = true, _classNames[style$1.white] = !!this.props.white, _classNames[style$1.small] = !!this.props.small, _classNames[style$1.big] = !!this.props.big, _classNames[this.props.className] = !!this.props.className, _classNames[style$1.button_icon_background] = !!this.props.isBackground, _classNames));
-    return /*#__PURE__*/React__default.createElement("button", {
+    return /*#__PURE__*/React__default.createElement("div", {
+      style: {
+        position: 'relative'
+      }
+    }, /*#__PURE__*/React__default.createElement("button", {
       className: buttonClass,
       onClick: this.props.onClick,
       disabled: this.props.disabled,
-      style: this.props.style
-    }, this.props.children);
+      style: this.props.style,
+      onMouseEnter: function onMouseEnter() {
+        return _this2.setState({
+          isHover: true
+        });
+      },
+      onMouseLeave: function onMouseLeave() {
+        return _this2.setState({
+          isHover: false
+        });
+      }
+    }, this.props.children), this.props.info && this.state.isHover ? /*#__PURE__*/React__default.createElement("span", {
+      style: {
+        position: 'absolute',
+        padding: '4px',
+        borderRadius: '4px',
+        backgroundColor: 'var(--primary-color)',
+        bottom: '-14px',
+        left: '50%',
+        transform: 'translate(-50%, 0)',
+        color: '#ffffff',
+        fontSize: '9px',
+        minWidth: "100%",
+        whiteSpace: "nowrap"
+      }
+    }, this.props.info) : null);
   };
 
   return ButtonIcon;