"use strict";

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

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

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

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

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

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

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

var _Common = require("../../../../Common");

var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;

var Element = function Element(_ref) {
  var _data$moduleData, _mod$moduleData, _mod$moduleData2, _mod$moduleData2$addr, _selectedStore$addres, _office$name, _office$address, _moduleAddress$city, _moduleAddress$city2, _moduleAddress$city2$, _moduleAddress$quarte, _moduleAddress$quarte2, _moduleAddress$street;

  var data = _ref.data,
      setStatus = _ref.setStatus,
      handleRemove = _ref.handleRemove,
      isSelectable = _ref.isSelectable,
      onSelect = _ref.onSelect,
      isSelected = _ref.isSelected;
  var isDefaultShippingAddress = data.isDefaultShippingAddress,
      isDefaultBillingAddress = data.isDefaultBillingAddress,
      firstName = data.firstName,
      lastName = data.lastName;
  var mod = (_data$moduleData = data.moduleData) == null ? void 0 : _data$moduleData[0];
  var moduleAddress = mod == null ? void 0 : (_mod$moduleData = mod.moduleData) == null ? void 0 : _mod$moduleData.address;
  var office = mod == null ? void 0 : (_mod$moduleData2 = mod.moduleData) == null ? void 0 : (_mod$moduleData2$addr = _mod$moduleData2.address) == null ? void 0 : _mod$moduleData2$addr.office;
  var isPickupFromStore = (mod == null ? void 0 : mod.moduleKey) === _lib.ShippingModulesTypeEnum.PickUpFromStore; // this should come from the config

  var isOffice = !isPickupFromStore && Boolean(office);
  var isAddress = !isPickupFromStore && !isOffice;

  var _useGlobalLabels = (0, _lib.useGlobalLabels)(),
      buttons = _useGlobalLabels.buttons,
      infoMessages = _useGlobalLabels.infoMessages,
      commonMessages = _useGlobalLabels.commonMessages; // TODO: this should not be in the checkout context


  var _useCheckoutPickupFro = (0, _lib.useCheckoutPickupFromStore)(),
      availableStores = _useCheckoutPickupFro.availableStores;

  var selectedStore = (0, _react.useMemo)(function () {
    if (!isPickupFromStore) return;
    return availableStores == null ? void 0 : availableStores.find(function (store) {
      return store._id === (mod == null ? void 0 : mod.moduleData.stockLocation);
    });
  }, [isPickupFromStore, availableStores]);

  var getInfo = function getInfo(isQuarter) {
    if (isQuarter === void 0) {
      isQuarter = false;
    }

    var result = ' ';

    if (isQuarter && moduleAddress != null && moduleAddress.street) {
      if (data != null && data.building) {
        result += " \u2116" + data.building;
      }

      return result;
    }

    if (!isQuarter && data != null && data.building && !(moduleAddress != null && moduleAddress.quarter)) {
      result += " \u2116" + data.building;
    }

    if (data != null && data.streetNumber) {
      result += " \u2116" + data.streetNumber;
    }

    if (data != null && data.entrance) {
      result += data.entrance;
    }

    if (data != null && data.floor) {
      result += "" + data.floor;
    }

    if (data != null && data.apartment) {
      result += "" + data.apartment;
    }

    return result;
  };

  return /*#__PURE__*/_react["default"].createElement(ProfileElementContainer, {
    onClick: onSelect ? function () {
      return onSelect(data);
    } : undefined,
    isSelected: isSelected,
    isSelectable: isSelectable
  }, /*#__PURE__*/_react["default"].createElement(ProfileElementWrapper, null, /*#__PURE__*/_react["default"].createElement(ProfileElementContentContainer, null, /*#__PURE__*/_react["default"].createElement(ProfileContainer, null, firstName, " ", lastName), /*#__PURE__*/_react["default"].createElement(DeliveryInformation, null, isPickupFromStore && /*#__PURE__*/_react["default"].createElement(StoreContainer, null, /*#__PURE__*/_react["default"].createElement(Label, null, /*#__PURE__*/_react["default"].createElement(_Common.IconStore, null), commonMessages.store, " ", selectedStore == null ? void 0 : selectedStore.name), /*#__PURE__*/_react["default"].createElement("p", null, selectedStore == null ? void 0 : (_selectedStore$addres = selectedStore.address) == null ? void 0 : _selectedStore$addres.additionalAddressInfo)), isOffice && /*#__PURE__*/_react["default"].createElement(OfficeContainer, null, /*#__PURE__*/_react["default"].createElement(Cap, null, office == null ? void 0 : (_office$name = office.name) == null ? void 0 : _office$name.toLowerCase()), /*#__PURE__*/_react["default"].createElement("p", null, office == null ? void 0 : (_office$address = office.address) == null ? void 0 : _office$address.fullAddressString)), isAddress && /*#__PURE__*/_react["default"].createElement(AddressContainer, null, /*#__PURE__*/_react["default"].createElement("p", null, /*#__PURE__*/_react["default"].createElement(Cap, null, (moduleAddress == null ? void 0 : (_moduleAddress$city = moduleAddress.city) == null ? void 0 : _moduleAddress$city.name) && (moduleAddress == null ? void 0 : (_moduleAddress$city2 = moduleAddress.city) == null ? void 0 : (_moduleAddress$city2$ = _moduleAddress$city2.name) == null ? void 0 : _moduleAddress$city2$.toLowerCase()) + ' ', data == null ? void 0 : data.postalCode)), Boolean(moduleAddress == null ? void 0 : moduleAddress.quarter) && /*#__PURE__*/_react["default"].createElement("p", null, /*#__PURE__*/_react["default"].createElement(Cap, null, moduleAddress == null ? void 0 : (_moduleAddress$quarte = moduleAddress.quarter) == null ? void 0 : (_moduleAddress$quarte2 = _moduleAddress$quarte.name) == null ? void 0 : _moduleAddress$quarte2.toLowerCase()), getInfo(true)), Boolean(moduleAddress == null ? void 0 : moduleAddress.street) && /*#__PURE__*/_react["default"].createElement("p", null, /*#__PURE__*/_react["default"].createElement(Cap, null, moduleAddress == null ? void 0 : (_moduleAddress$street = moduleAddress.street) == null ? void 0 : _moduleAddress$street.name.toLowerCase()), getInfo()), Boolean(data == null ? void 0 : data.additionalAddressInfo) && /*#__PURE__*/_react["default"].createElement("p", null, "* ", data == null ? void 0 : data.additionalAddressInfo))), /*#__PURE__*/_react["default"].createElement(ActionsContainer, null, setStatus && (isDefaultShippingAddress ? null : /*#__PURE__*/_react["default"].createElement(CTALabel, {
    onClick: setStatus
  }, buttons.makePrimary)), handleRemove && /*#__PURE__*/_react["default"].createElement(CTALabel, {
    onClick: handleRemove
  }, buttons["delete"])))), isDefaultShippingAddress && /*#__PURE__*/_react["default"].createElement(DefaultAddressLabel, null, commonMessages.defaultShippingAddr), isDefaultBillingAddress && /*#__PURE__*/_react["default"].createElement(DefaultAddressLabel, null, commonMessages.defaultBillingAddr));
};

exports.Element = Element;

var DeliveryInformation = _styledComponents["default"].div.attrs({
  className: 'd-flex col-lg-7'
})(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])(["\n  padding-left: 2rem;\n  flex-wrap: wrap;\n"])));

var AddressContainer = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var StoreContainer = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var OfficeContainer = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var ProfileContainer = _styledComponents["default"].p.attrs({
  className: 'd-flex justify-content-start col-lg-2 '
})(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  white-space: nowrap;\n  flex-wrap: wrap;\n  font-weight: 700;\n  margin-left: 2rem;\n  margin-right: 2rem;\n"])));

var Cap = _styledComponents["default"].span(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  text-transform: capitalize;\n"])));

var ProfileElementContainer = _styledComponents["default"].div.attrs({
  className: 'mb-2'
})(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  border: 1px solid ", ";\n  border-radius: 4px;\n  ", "\n  ", "\n"])), function (_ref2) {
  var theme = _ref2.theme;
  return theme.palette.light;
}, function (props) {
  return props.isSelectable ? (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2["default"])(["\n          cursor: pointer;\n          padding: 1rem 1rem 1rem 3.2rem;\n          position: relative;\n          @media (hover: hover) {\n            &:hover {\n              border: 1px solid ", ";\n            }\n          }\n        "])), function (_ref3) {
    var theme = _ref3.theme;
    return theme.palette.primary;
  }) : '';
}, function (props) {
  return props.isSelected ? (0, _styledComponents.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2["default"])(["\n          opacity: 1 !important;\n          border: 1px solid ", ";\n        "])), function (_ref4) {
    var theme = _ref4.theme;
    return theme.palette.primary;
  }) : '';
});

var ProfileElementWrapper = _styledComponents["default"].div.attrs({
  className: 'pb-3 pt-3'
})(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  margin-left: -0.8rem;\n  margin-right: -0.8rem;\n  width: 100%;\n"])));

var ProfileElementContentContainer = _styledComponents["default"].div.attrs({
  className: 'pl-2 pr-2 d-flex flex-column flex-lg-row align-center'
})(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  line-height: 1.75;\n  display: inline-block;\n  color: ", ";\n"])), function (_ref5) {
  var theme = _ref5.theme;
  return theme.palette.primary;
});

var Label = _styledComponents["default"].span.attrs({
  className: 'd-inline-flex align-items-center pr-1'
})(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  color: ", ";\n  font-weight: 700;\n  & svg {\n    width: 2rem;\n    margin-right: 0.4rem;\n  }\n"])), function (_ref6) {
  var theme = _ref6.theme;
  return theme.palette.primary;
});

var CTALabel = _styledComponents["default"].span.attrs({
  className: 'd-flex justify-content-end pb-2'
})(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  display: inline-block;\n  overflow: hidden;\n  color: ", ";\n  text-decoration: underline;\n  font-size: 1.3rem;\n  cursor: pointer;\n  &::after {\n    content: '';\n    position: absolute;\n    top: 0;\n    right: -10px;\n    width: 0%;\n    background: ", ";\n    height: 100%;\n    z-index: -1;\n    transition: width 0.3s ease-in-out;\n    transform: skew(-25deg);\n    transform-origin: right;\n  }\n"])), function (_ref7) {
  var theme = _ref7.theme;
  return theme.palette.primary;
}, function (_ref8) {
  var theme = _ref8.theme;
  return theme.palette.primary;
});

var ActionsContainer = _styledComponents["default"].div.attrs({
  className: 'flex-column flex-lg-row col-lg-2'
})(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  margin-left: 2rem;\n  text-align: end;\n  @media (max-width: ", ") {\n    margin-top: 1rem;\n    display: flex;\n    align-items: flex-start;\n  }\n"])), function (_ref9) {
  var theme = _ref9.theme;
  return theme.breakpoints.md.max;
});

var DefaultAddressLabel = _styledComponents["default"].span(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  font-weight: 700;\n  margin-left: 2rem;\n"])));
//# sourceMappingURL=index.js.map