"use strict";

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

exports.__esModule = true;
exports.Contacts = void 0;

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

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

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _lib = require("@sentecacommerce-theme/lib");

var _templateObject, _templateObject2, _templateObject3;

var Contacts = function Contacts(_ref) {
  var contacts = _ref.contacts;
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, contacts == null ? void 0 : contacts.elements.map(function (element, index) {
    return /*#__PURE__*/_react["default"].createElement(Contact, {
      key: "Contacts__" + element.title + "-" + index
    }, /*#__PURE__*/_react["default"].createElement(Container, null, /*#__PURE__*/_react["default"].createElement(_lib.Link, {
      href: element.url || "/help"
    }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("img", {
      src: element.image,
      alt: "icon"
    })), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(InnerTitle, null, element.title), /*#__PURE__*/_react["default"].createElement("h5", null, element == null ? void 0 : element.subtitle), /*#__PURE__*/_react["default"].createElement("h5", null, element == null ? void 0 : element.phoneNumber), /*#__PURE__*/_react["default"].createElement("h5", null, element == null ? void 0 : element.workHours), /*#__PURE__*/_react["default"].createElement("h5", null, element == null ? void 0 : element.workDays))))));
  }));
};

exports.Contacts = Contacts;

var Contact = _styledComponents["default"].div.attrs({
  className: 'd-flex align-items-center'
})(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var Container = _styledComponents["default"].div.attrs({
  className: 'pb-5 d-flex'
})(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  img {\n    max-width: 6.5rem;\n  }\n\n  @media (min-width: ", ") {\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  @media (min-width: ", ") {\n    text-align: center;\n    align-items: center;\n  }\n  cursor: pointer;\n"])), function (props) {
  return props.theme.breakpoints.md.max;
}, function (props) {
  return props.theme.breakpoints.lg.min;
});

var InnerTitle = _styledComponents["default"].h3(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  font-size: 1.6rem;\n"])));
//# sourceMappingURL=index.js.map