choerodon-ui/pro/lib/output/MultiLine.js

An enterprise-class UI design language and React-based implementation

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _react = _interopRequireWildcard(require("react"));

var _classnames = _interopRequireDefault(require("classnames"));

var _TooltipUtils = require("../../../lib/_util/TooltipUtils");

var _singleton = require("../tooltip/singleton");

var _row = _interopRequireDefault(require("../row"));

var _col = _interopRequireDefault(require("../col"));

var _enum = require("../core/enum");

var _util = _interopRequireDefault(require("../overflow-tip/util"));

var MultiLine = function MultiLine(props) {
  var prefixCls = props.prefixCls,
      label = props.label,
      validationMessage = props.validationMessage,
      required = props.required,
      validationHidden = props.validationHidden,
      _props$tooltip = props.tooltip,
      tooltip = _props$tooltip === void 0 ? (0, _TooltipUtils.getTooltip)('output') : _props$tooltip,
      labelTooltip = props.labelTooltip,
      children = props.children;
  var tooltipRef = (0, _react.useRef)(false);
  var handleLabelMouseEnter = (0, _react.useCallback)(function (e) {
    var currentTarget = e.currentTarget;

    if (labelTooltip === _enum.Tooltip.always || labelTooltip === _enum.Tooltip.overflow && (0, _util["default"])(currentTarget)) {
      (0, _singleton.show)(currentTarget, {
        title: label,
        placement: 'right'
      });
      tooltipRef.current = true;
    }
  }, [label, labelTooltip, tooltipRef]);
  var handleFieldMouseEnter = (0, _react.useCallback)(function (e) {
    var currentTarget = e.currentTarget;

    if (validationMessage) {
      (0, _singleton.show)(currentTarget, {
        title: validationMessage,
        placement: 'bottomLeft',
        theme: (0, _TooltipUtils.getTooltipTheme)('validation')
      });
      tooltipRef.current = true;
    } else if (tooltip === _enum.Tooltip.always || tooltip === _enum.Tooltip.overflow && (0, _util["default"])(currentTarget)) {
      (0, _singleton.show)(currentTarget, {
        title: children,
        placement: 'right'
      });
      tooltipRef.current = true;
    }
  }, [tooltip, validationMessage, children, tooltipRef]);
  var handleMouseLeave = (0, _react.useCallback)(function () {
    if (tooltipRef.current) {
      (0, _singleton.hide)();
      tooltipRef.current = false;
    }
  }, [tooltipRef]);
  (0, _react.useEffect)(function () {
    return function () {
      if (tooltipRef.current) {
        (0, _singleton.hide)();
        tooltipRef.current = false;
      }
    };
  }, [tooltipRef]);
  return _react["default"].createElement(_row["default"], {
    className: "".concat(prefixCls, "-multi")
  }, label && _react["default"].createElement(_col["default"], {
    span: 8,
    className: (0, _classnames["default"])("".concat(prefixCls, "-multi-label"), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "-multi-label-required"), required)),
    onMouseEnter: handleLabelMouseEnter,
    onMouseLeave: handleMouseLeave
  }, label), _react["default"].createElement(_col["default"], {
    span: label ? 16 : 24,
    className: (0, _classnames["default"])("".concat(prefixCls, "-multi-value"), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "-multi-value-invalid"), !validationHidden)),
    onMouseEnter: handleFieldMouseEnter,
    onMouseLeave: handleMouseLeave
  }, children));
};

MultiLine.displayName = 'MultiLine';
var _default = MultiLine;
exports["default"] = _default;
//# sourceMappingURL=MultiLine.js.map