"use strict";

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

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

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

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

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

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

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

var _avatar = _interopRequireDefault(require("../avatar"));

var _box = _interopRequireDefault(require("../box"));

var _icon = _interopRequireDefault(require("../icon"));

var _link = _interopRequireDefault(require("../link"));

var _popover = _interopRequireDefault(require("../popover"));

var _typography = require("../typography");

var _excluded = ["avatar", "className", "description", "lineItems", "title"],
    _excluded2 = ["icon"];

var Passport = function Passport(_ref) {
  var avatar = _ref.avatar,
      className = _ref.className,
      description = _ref.description,
      lineItems = _ref.lineItems,
      title = _ref.title,
      others = (0, _objectWithoutProperties2.default)(_ref, _excluded);

  var renderDescription = function renderDescription() {
    if (!description) {
      return null;
    }

    if (Array.isArray(description)) {
      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, description.map(function (child, index) {
        return /*#__PURE__*/_react.default.createElement(_typography.TextBody, {
          color: "teal",
          key: index
        }, child);
      }));
    } else {
      return /*#__PURE__*/_react.default.createElement(_typography.TextBody, {
        color: "teal"
      }, description);
    }
  };

  var renderTitle = function renderTitle() {
    return /*#__PURE__*/_react.default.createElement(_typography.Heading3, {
      className: (0, _classnames.default)(_theme.default['prevent-overflow'], _theme.default['prevent-wrap'], _theme.default['show-ellipsis']),
      color: "teal"
    }, typeof title === 'string' ? title : /*#__PURE__*/_react.default.createElement(_link.default, (0, _extends2.default)({}, title, {
      inherit: false
    })));
  };

  return /*#__PURE__*/_react.default.createElement(_popover.default, (0, _extends2.default)({}, others, {
    backdrop: "transparent",
    className: (0, _classnames.default)(_theme.default['passport'], className)
  }), /*#__PURE__*/_react.default.createElement(_box.default, {
    padding: 3
  }, /*#__PURE__*/_react.default.createElement(_box.default, {
    display: "flex"
  }, /*#__PURE__*/_react.default.createElement(_box.default, {
    flex: "48px 0 0",
    paddingRight: 3
  }, /*#__PURE__*/_react.default.createElement(_avatar.default, (0, _extends2.default)({}, avatar, {
    size: "small"
  }))), /*#__PURE__*/_react.default.createElement(_box.default, {
    className: _theme.default['prevent-overflow']
  }, renderTitle(), renderDescription())), lineItems && /*#__PURE__*/_react.default.createElement(_box.default, {
    marginTop: 3
  }, lineItems.map(function (_ref2, index) {
    var icon = _ref2.icon,
        lineItem = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
    return /*#__PURE__*/_react.default.createElement(_box.default, {
      alignItems: "flex-start",
      display: "flex",
      key: index
    }, /*#__PURE__*/_react.default.createElement(_box.default, {
      display: "flex",
      flex: "48px 0 0",
      justifyContent: "center",
      paddingRight: 3
    }, icon && /*#__PURE__*/_react.default.createElement(_icon.default, {
      color: lineItem.href || lineItem.onClick ? 'aqua' : 'teal',
      tint: lineItem.href || lineItem.onClick ? 'dark' : 'darkest',
      marginTop: 1
    }, icon)), /*#__PURE__*/_react.default.createElement(_typography.TextBody, {
      className: (0, _classnames.default)(_theme.default['prevent-overflow'], _theme.default['prevent-wrap'], _theme.default['show-ellipsis']),
      color: "teal"
    }, lineItem.href || lineItem.onClick ? /*#__PURE__*/_react.default.createElement(_link.default, (0, _extends2.default)({}, lineItem, {
      inherit: false
    })) : lineItem.children));
  }))));
};

var _default = Passport;
exports.default = _default;