"use strict";

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

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

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

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

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

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

var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;

var AdvancedConsent = function AdvancedConsent(_ref) {
  var setDetails = _ref.setDetails,
      moreInfo = _ref.moreInfo,
      acceptAll = _ref.acceptAll,
      saveChanges = _ref.saveChanges,
      cookiesMap = _ref.cookiesMap,
      handleToggle = _ref.handleToggle,
      isChecked = _ref.isChecked,
      onSave = _ref.onSave,
      onAcceptAll = _ref.onAcceptAll;

  var renderCookies = function renderCookies() {
    if (cookiesMap) {
      var cookies = Object.keys(cookiesMap);
      return cookies.map(function (cookie) {
        return /*#__PURE__*/_react["default"].createElement(Content, {
          key: cookiesMap[cookie].key
        }, /*#__PURE__*/_react["default"].createElement("div", {
          className: "d-flex justify-content-between align-items-center"
        }, /*#__PURE__*/_react["default"].createElement(Title, null, cookie), /*#__PURE__*/_react["default"].createElement(_Common.CheckboxSlider, {
          onChange: function onChange() {
            return handleToggle(cookie);
          },
          isChecked: cookiesMap[cookie].isRequired || isChecked[cookie]
        })), /*#__PURE__*/_react["default"].createElement(Description, null, cookiesMap[cookie].description), /*#__PURE__*/_react["default"].createElement(MoreInfo, {
          onClick: function onClick() {
            return setDetails(cookie);
          }
        }, moreInfo));
      });
    }

    return null;
  };

  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("span", {
    className: "d-flex flex-column flex-lg-row flex-wrap"
  }, renderCookies()), /*#__PURE__*/_react["default"].createElement("span", {
    className: "d-lg-flex justify-conent-center"
  }, /*#__PURE__*/_react["default"].createElement(StyledButton, {
    fullWidth: true,
    bordered: true,
    onClick: onAcceptAll
  }, /*#__PURE__*/_react["default"].createElement("span", null, acceptAll)), /*#__PURE__*/_react["default"].createElement(StyledButton, {
    fullWidth: true,
    onClick: onSave
  }, /*#__PURE__*/_react["default"].createElement("span", null, saveChanges))));
};

exports.AdvancedConsent = AdvancedConsent;

var Content = _styledComponents["default"].div.attrs({
  className: 'my-lg-2 my-2 mx-lg-2 p-1'
})(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])(["\n  width: 100%;\n  font-size: 1.2rem;\n  background: ", ";\n\n  @media (min-width: ", ") {\n    font-size: 16px;\n    width: 45%;\n  }\n"])), function (_ref2) {
  var theme = _ref2.theme;
  return theme.palette.whiteSmoke;
}, function (_ref3) {
  var theme = _ref3.theme;
  return theme.breakpoints.lg.min;
});

var Title = (0, _styledComponents["default"])(_Common.Typography).attrs({
  variant: 5,
  className: 'my-1'
})(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  font-weight: 600;\n"])));
var Description = (0, _styledComponents["default"])(_Common.Typography).attrs({
  variant: 6
})(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2["default"])([""])));
var MoreInfo = (0, _styledComponents["default"])(_Common.Typography).attrs({
  className: 'my-1',
  variant: 6
})(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  cursor: pointer;\n  text-decoration: underline;\n  font-weight: 600;\n"])));
var StyledButton = (0, _styledComponents["default"])(_Common.Button).attrs({
  className: 'mx-lg-2 my-2'
})(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  @media (min-width: ", ") {\n    width: 45% !important;\n  }\n"])), function (_ref4) {
  var theme = _ref4.theme;
  return theme.breakpoints.lg.min;
});
//# sourceMappingURL=index.js.map