import React from 'react';
import { observer } from 'mobx-react-lite';
import Animate from '../../../es/animate';
import Icon from '../../../es/icon';

var ErrorBar = function ErrorBar(props) {
  var dataSet = props.dataSet,
      prefixCls = props.prefixCls;
  var error = dataSet.validationSelfErrors;
  var errorMessage = error && error.length ? error[0].message : undefined;

  var saveRef = function saveRef(node) {
    if (node) {
      node.focus();
    }
  };

  return /*#__PURE__*/React.createElement(Animate, {
    transitionName: "slide-down",
    className: "".concat(prefixCls, "-error"),
    hiddenProp: "hidden",
    component: "div"
  }, errorMessage && /*#__PURE__*/React.createElement("div", {
    ref: saveRef,
    hidden: !errorMessage,
    className: "".concat(prefixCls, "-error-content"),
    tabIndex: -1
  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Icon, {
    type: "cancel"
  }), errorMessage), /*#__PURE__*/React.createElement(Icon, {
    type: "close",
    onClick: function onClick() {
      return dataSet.clearValidationError();
    }
  })));
};

ErrorBar.displayName = 'ErrorBar';
export default observer(ErrorBar);
//# sourceMappingURL=ErrorBar.js.map
