"use strict";

exports.__esModule = true;
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _provider = _interopRequireDefault(require("../../atom/provider"));
var _externalContent = require("../../util/external-content");
var _style = _interopRequireDefault(require("./style.css"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
class ExternalContentButton extends _react.default.Component {
  static contextTypes = {
    translate: _provider.default.childContextTypes.translate
  };
  constructor(props, context) {
    super(props, context);
  }
  handleClick = e => {
    e.stopPropagation();
    e.preventDefault();
    const {
      onClick
    } = this.props;
    onClick && onClick(e);
  };
  render() {
    const {
      translate
    } = this.context;
    const {
      type,
      description
    } = this.props;
    const IconType = _externalContent.EXTERNAL_CONTENT_ICONS[type].icon;
    const iconColor = _externalContent.EXTERNAL_CONTENT_ICONS[type].color;
    return /*#__PURE__*/_react.default.createElement("div", {
      onClick: this.handleClick,
      className: _style.default.button,
      "data-testid": "external-content-button"
    }, /*#__PURE__*/_react.default.createElement("div", {
      className: _style.default.header,
      style: {
        backgroundColor: iconColor
      }
    }), /*#__PURE__*/_react.default.createElement("div", {
      className: _style.default.iconBackground,
      style: {
        backgroundColor: iconColor
      }
    }, /*#__PURE__*/_react.default.createElement(IconType, {
      className: _style.default.icon,
      width: 16,
      height: 16
    })), /*#__PURE__*/_react.default.createElement("span", {
      className: _style.default.title
    }, type === 'scorm' ? translate('external_content_scorm') : '', type === 'video' ? translate('external_content_video') : '', type === 'article' ? translate('external_content_article') : '', type === 'podcast' ? translate('external_content_podcast') : ''), /*#__PURE__*/_react.default.createElement("span", {
      className: _style.default.description
    }, description));
  }
}
ExternalContentButton.propTypes = process.env.NODE_ENV !== "production" ? {
  type: _propTypes.default.string,
  description: _propTypes.default.string,
  onClick: _propTypes.default.func
} : {};
var _default = exports.default = ExternalContentButton;
//# sourceMappingURL=index.js.map