"use strict";

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

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

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

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

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

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

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

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

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

var _propTypes = _interopRequireDefault(require("prop-types"));

var _AccessibleContent = _interopRequireDefault(require("@instructure/ui-a11y/lib/components/AccessibleContent"));

var _Tooltip = _interopRequireDefault(require("@instructure/ui-overlays/lib/components/Tooltip"));

var _Text = _interopRequireDefault(require("@instructure/ui-elements/lib/components/Text"));

var _lib = _interopRequireDefault(require("@instructure/ui-themeable/lib"));

var _theme = _interopRequireDefault(require("./theme"));

var _dec, _class, _class2, _temp;

var styles = {
  componentId: 'NwzGY',
  template: function template(theme) {
    return "\n\n.NwzGY_esVF{cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:pre-wrap}";
  },
  'itemBody': 'NwzGY_esVF'
};
var DISPLAY_TOOLTIP_LIMIT = 80;
var Title = (_dec = (0, _lib.default)(_theme.default, styles), _dec(_class = (_temp = _class2 =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2.default)(Title, _Component);

  function Title() {
    (0, _classCallCheck2.default)(this, Title);
    return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(Title).apply(this, arguments));
  }

  (0, _createClass2.default)(Title, [{
    key: "renderTitle",
    value: function renderTitle() {
      var title = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : this.props.title;
      return _react.default.createElement("div", {
        className: styles.itemBody
      }, _react.default.createElement(_Text.default, null, title));
    }
  }, {
    key: "render",
    value: function render() {
      var title = this.props.title; // Shorten title if necessary

      if (title.length > DISPLAY_TOOLTIP_LIMIT) {
        var truncatedTitle = "".concat(title.substring(0, DISPLAY_TOOLTIP_LIMIT), "...");
        return _react.default.createElement(_AccessibleContent.default, {
          alt: title
        }, _react.default.createElement(_Tooltip.default, {
          tip: title
        }, this.renderTitle(truncatedTitle)));
      }

      return this.renderTitle();
    }
  }]);
  Title.displayName = "Title";
  return Title;
}(_react.Component), _class2.propTypes = {
  title: _propTypes.default.string.isRequired
}, _temp)) || _class);
exports.default = Title;