react-cookie-kit/dist/CookieKitPopup.js

GDPR / CCPA Easy Cookie, Script, Do-Not-Sell, and Fingerprint Consent Management for Websites.

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }

function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }

function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }

function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }

function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }

function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

import React from "react";
import PropTypes from "prop-types";
import ReactCountryFlag from "react-country-flag";
import { cookieDefns as allAvailCookieDefns, cookieTypes, locales, links, themes } from "xcoobee-cookie-kit-core/src/configs";
import { countryCodes } from "xcoobee-cookie-kit-core/src/countryData";
import renderText from "xcoobee-cookie-kit-core/src/renderText";
import { getLocale, saveLocale, getCountryCode, saveCountryCode } from "xcoobee-cookie-kit-core/src/LocaleManager";
import closeIcon from "./assets/close-icon.svg";
import xbLogo from "./assets/xcoobee-logo.svg";
import caretUp from "./assets/caret-arrow-up.png";
import caretDown from "./assets/caret-down.png";
import CookieConsentShape from "./lib/CookieConsentShape";
import { xbOrigin } from "./configs";
var OPTION = "loginstatus";

var CookieKitPopup = /*#__PURE__*/function (_React$PureComponent) {
  _inherits(CookieKitPopup, _React$PureComponent);

  var _super = _createSuper(CookieKitPopup);

  function CookieKitPopup(props) {
    var _this;

    _classCallCheck(this, CookieKitPopup);

    // console.log('CookieKitPopup#constructor');
    _this = _super.call(this, props);

    _defineProperty(_assertThisInitialized(_this), "onMessage", function (event) {
      if (!event.data || typeof event.data !== "string") {
        return;
      }

      var onLogin = _this.props.onLogin;
      var loginStatus = JSON.parse(event.data)[OPTION];

      if (loginStatus) {
        onLogin();
      }
    });

    _defineProperty(_assertThisInitialized(_this), "handleLocaleChange", function (locale) {
      // console.log('CookieKitPopup#handleLocaleChange');
      _this.setState({
        selectedLocale: locale.code,
        isLocaleSelectShown: false
      });

      saveLocale(locale.code);
    });

    _defineProperty(_assertThisInitialized(_this), "handleCountryChange", function (countryCode) {
      // console.log('CookieKitPopup#handleCountryChange');
      _this.setState({
        countryCode: countryCode,
        isCountrySelectShown: false
      });

      saveCountryCode(countryCode);
    });

    _defineProperty(_assertThisInitialized(_this), "handleCountrySelectToggle", function (e) {
      // console.log('CookieKitPopup#handleCountrySelectToggle');
      e.stopPropagation();

      _this.setState(function (state) {
        return {
          isCountrySelectShown: !state.isCountrySelectShown,
          isLocaleSelectShown: false
        };
      });
    });

    _defineProperty(_assertThisInitialized(_this), "handleLocaleSelectToggle", function (e) {
      // console.log('CookieKitPopup#handleLocaleSelectToggle');
      e.stopPropagation();

      _this.setState(function (state) {
        return {
          isLocaleSelectShown: !state.isLocaleSelectShown,
          isCountrySelectShown: false
        };
      });
    });

    _defineProperty(_assertThisInitialized(_this), "handleCookieCheck", function (e, type) {
      // console.log('CookieKitPopup#handleCookieCheck');
      var consentSettings = _this.state.consentSettings;

      var checked = _objectSpread({}, consentSettings);

      checked[type] = e.target.checked;

      _this.setState({
        consentSettings: checked
      });
    });

    _defineProperty(_assertThisInitialized(_this), "handleCheckAll", function () {
      // console.log('CookieKitPopup#handleCheckAll');
      var _this$props = _this.props,
          displayDoNotSell = _this$props.displayDoNotSell,
          displayFingerprint = _this$props.displayFingerprint;
      var consentSettings = _this.state.consentSettings;

      var isAllConsentsChecked = _this.areAllConsentsChecked();

      if (isAllConsentsChecked) {
        var noneChecked = {};
        Object.keys(consentSettings).forEach(function (cookieName) {
          noneChecked[cookieName] = false;
        });

        _this.setState({
          consentSettings: noneChecked,
          doNotSellConsent: false,
          fingerprintConsent: false
        });
      } else {
        var allChecked = {};
        Object.keys(consentSettings).forEach(function (cookieName) {
          allChecked[cookieName] = true;
        });

        _this.setState({
          consentSettings: allChecked,
          doNotSellConsent: displayDoNotSell,
          fingerprintConsent: displayFingerprint
        });
      }
    });

    _defineProperty(_assertThisInitialized(_this), "handleDoNotSellCheck", function (e) {
      // console.log('CookieKitPopup#handleDoNotSellCheck');
      _this.setState({
        doNotSellConsent: e.target.checked
      });
    });

    _defineProperty(_assertThisInitialized(_this), "handleFingerprintCheck", function (e) {
      // console.log('CookieKitPopup#handleFingerprintCheck');
      _this.setState({
        fingerprintConsent: e.target.checked
      });
    });

    _defineProperty(_assertThisInitialized(_this), "handleSubmit", function () {
      // console.log('CookieKitPopup#handleSubmit');
      var onSubmit = _this.props.onSubmit;
      var _this$state = _this.state,
          consentSettings = _this$state.consentSettings,
          doNotSellConsent = _this$state.doNotSellConsent,
          fingerprintConsent = _this$state.fingerprintConsent;
      onSubmit(consentSettings, doNotSellConsent, fingerprintConsent);
    });

    _defineProperty(_assertThisInitialized(_this), "handleScroll", function (e, direction) {
      e.stopPropagation();
      var currentScrollPosition = _this.countryPicker.scrollTop;

      if (direction === "up") {
        _this.countryPicker.scrollTop = currentScrollPosition - 22;
      } else {
        _this.countryPicker.scrollTop = currentScrollPosition + 22;
      }
    });

    var _this$props2 = _this.props,
        cookieConsents = _this$props2.cookieConsents,
        _fingerprintConsent = _this$props2.fingerprintConsent,
        _doNotSellConsent = _this$props2.doNotSellConsent,
        requestDataTypes = _this$props2.requestDataTypes;
    var _consentSettings = {};
    cookieConsents.filter(function (cookieConsent) {
      return requestDataTypes.includes(cookieConsent.type);
    }).forEach(function (cookieConsent) {
      _consentSettings[cookieConsent.type] = cookieConsent.checked;
    }); // Ensure all requested data types are in consent settings. Otherwise logic using
    // state.consentSettings doesn't work correctly.

    requestDataTypes.forEach(function (dataType) {
      if (!(dataType in _consentSettings)) {
        _consentSettings[dataType] = false;
      }
    });
    _this.state = {
      consentSettings: _consentSettings,
      countryCode: getCountryCode() || "EU",
      doNotSellConsent: _doNotSellConsent,
      fingerprintConsent: _fingerprintConsent,
      isCountrySelectShown: false,
      isLocaleSelectShown: false,
      selectedLocale: getLocale() || "en-us"
    };
    window.addEventListener("message", _this.onMessage);
    return _this;
  }

  _createClass(CookieKitPopup, [{
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      // console.log('CookieKitPopup#componentWillUnmount');
      window.removeEventListener("message", this.onMessage);
    }
  }, {
    key: "areAllConsentsChecked",
    value: function areAllConsentsChecked() {
      var _this$props3 = this.props,
          displayDoNotSell = _this$props3.displayDoNotSell,
          displayFingerprint = _this$props3.displayFingerprint;
      var _this$state2 = this.state,
          consentSettings = _this$state2.consentSettings,
          doNotSellConsent = _this$state2.doNotSellConsent,
          fingerprintConsent = _this$state2.fingerprintConsent;
      var isAllCookiesChecked = Object.values(consentSettings).every(function (checked) {
        return checked;
      });
      var isAllConsentsChecked = isAllCookiesChecked;

      if (isAllConsentsChecked && displayDoNotSell) {
        isAllConsentsChecked = doNotSellConsent;
      }

      if (isAllConsentsChecked && displayFingerprint) {
        isAllConsentsChecked = fingerprintConsent;
      }

      return isAllConsentsChecked;
    }
  }, {
    key: "renderTextMessage",
    value: function renderTextMessage(textMessage) {
      // console.log('CookieKitPopup#renderTextMessage');
      if (typeof textMessage === "string") {
        return textMessage;
      }

      var selectedLocale = this.state.selectedLocale;
      return textMessage[selectedLocale] || textMessage["en-us"];
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      // console.log('CookieKitPopup#render');
      var _this$props4 = this.props,
          companyLogo = _this$props4.companyLogo,
          displayFingerprint = _this$props4.displayFingerprint,
          displayDoNotSell = _this$props4.displayDoNotSell,
          hideBrandTag = _this$props4.hideBrandTag,
          loginStatus = _this$props4.loginStatus,
          isConnected = _this$props4.isConnected,
          onClose = _this$props4.onClose,
          privacyUrl = _this$props4.privacyUrl,
          requestDataTypes = _this$props4.requestDataTypes,
          termsUrl = _this$props4.termsUrl,
          textMessage = _this$props4.textMessage,
          theme = _this$props4.theme;
      var _this$state3 = this.state,
          consentSettings = _this$state3.consentSettings,
          countryCode = _this$state3.countryCode,
          doNotSellConsent = _this$state3.doNotSellConsent,
          fingerprintConsent = _this$state3.fingerprintConsent,
          isCountrySelectShown = _this$state3.isCountrySelectShown,
          isLocaleSelectShown = _this$state3.isLocaleSelectShown,
          selectedLocale = _this$state3.selectedLocale; // console.log("countryCode:", countryCode);

      var appearsToBeLoggedIn = loginStatus;
      var targetUrl = encodeURIComponent(window.location.origin);
      var isAllConsentsChecked = this.areAllConsentsChecked();
      var cookieDefns = allAvailCookieDefns.filter(function (defn) {
        return requestDataTypes.includes(defn.type);
      });
      var BLOCK = theme === "popup" ? "xb-cookie-kit-popup" : "xb-cookie-kit-overlay";
      var loginModalFeatures = "left=400, top=100, width=500, height=600";
      var consentCount = cookieDefns.length;

      if (displayFingerprint) {
        consentCount += 1;
      }

      if (displayDoNotSell) {
        consentCount += 1;
      }

      var layout;

      if (theme === "popup") {
        var _locales$find;

        layout =
        /*#__PURE__*/
        // eslint-disable-next-line max-len
        // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
        React.createElement("div", {
          className: BLOCK,
          onClick: function onClick() {
            return _this2.setState({
              isCountrySelectShown: false,
              isLocaleSelectShown: false
            });
          },
          role: "dialog",
          tabIndex: "-1"
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__header")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__logo")
        }, isConnected && companyLogo && /*#__PURE__*/React.createElement("img", {
          className: "".concat(BLOCK, "__company-logo"),
          src: companyLogo,
          alt: "Company logo"
        })), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__title")
        }, renderText("CookieKit.Title", selectedLocale)), /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button ".concat(BLOCK, "__close-button"),
          onClick: onClose
        }, /*#__PURE__*/React.createElement("img", {
          className: "".concat(BLOCK, "__close-button-icon"),
          src: closeIcon,
          alt: "close-icon"
        }))), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__text-container")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__text")
        }, this.renderTextMessage(textMessage)), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__locale-container")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__locale")
        }, /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button ".concat(BLOCK, "__language-picker"),
          onClick: this.handleLocaleSelectToggle
        }, ((_locales$find = locales.find(function (locale) {
          return locale.code === selectedLocale;
        })) === null || _locales$find === void 0 ? void 0 : _locales$find.text) || "?"), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__block ").concat(BLOCK, "__block--sm ").concat(BLOCK, "__country-picker"),
          title: countryCode
        }, /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button ".concat(BLOCK, "__country-picker-button"),
          onClick: this.handleCountrySelectToggle
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__flag")
        }, /*#__PURE__*/React.createElement(ReactCountryFlag, {
          code: countryCode,
          svg: true
        }))))), isLocaleSelectShown && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__custom-select")
        }, locales.map(function (locale) {
          return /*#__PURE__*/React.createElement("button", {
            key: locale.code,
            className: "xb-cookie-kit__button ".concat(BLOCK, "__language-picker-button"),
            type: "button",
            onClick: function onClick() {
              return _this2.handleLocaleChange(locale);
            }
          }, locale.text);
        })), isCountrySelectShown && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__country-picker-select")
        }, countryCodes.map(function (cCode) {
          return /*#__PURE__*/React.createElement("button", {
            type: "button",
            key: "country-flag-".concat(cCode),
            className: "xb-cookie-kit__button ".concat(BLOCK, "__country-picker-button"),
            onClick: function onClick() {
              return _this2.handleCountryChange(cCode);
            },
            title: cCode
          }, /*#__PURE__*/React.createElement("div", {
            className: "".concat(BLOCK, "__flag")
          }, /*#__PURE__*/React.createElement(ReactCountryFlag, {
            code: cCode,
            svg: true
          })));
        })))), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__cookie-list")
        }, cookieDefns.map(function (cookieDefn) {
          return /*#__PURE__*/React.createElement("div", {
            key: cookieDefn.type,
            className: "".concat(BLOCK, "__cookie")
          }, /*#__PURE__*/React.createElement("div", {
            className: "".concat(BLOCK, "__block ").concat(BLOCK, "__block--lg")
          }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("input", {
            id: "xbCheckbox_".concat(cookieDefn.id),
            type: "checkbox" // Application cookies are always checked.
            ,
            checked: cookieDefn.type === "application" || consentSettings[cookieDefn.type] // Application cookies are always disabled.
            ,
            disabled: cookieDefn.type === "application",
            onChange: function onChange(e) {
              return _this2.handleCookieCheck(e, cookieDefn.type);
            }
          }), /*#__PURE__*/React.createElement("label", {
            htmlFor: "xbCheckbox_".concat(cookieDefn.id),
            className: "".concat(BLOCK, "__checkbox") // Application cookies are always disabled.
            ,
            disabled: cookieDefn.type === "application"
          })), /*#__PURE__*/React.createElement("div", {
            className: "".concat(BLOCK, "__consent-label"),
            title: renderText("CookieKit.MoreInfo", selectedLocale)
          }, /*#__PURE__*/React.createElement("a", {
            className: "".concat(BLOCK, "__consent-label-link"),
            href: cookieDefn.url,
            target: "_blank",
            rel: "noopener noreferrer"
          }, renderText(cookieDefn.localeKey, selectedLocale)))));
        })), displayFingerprint || displayDoNotSell ? /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consents-container")
        }, displayFingerprint && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consent ").concat(BLOCK, "__consent--fingerprint")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consent-checkbox")
        }, /*#__PURE__*/React.createElement("input", {
          id: "xbCheckbox_fingerprint",
          type: "checkbox",
          checked: fingerprintConsent,
          onChange: this.handleFingerprintCheck
        }), /*#__PURE__*/React.createElement("label", {
          htmlFor: "xbCheckbox_fingerprint",
          className: "".concat(BLOCK, "__checkbox")
        })), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consent-label"),
          title: renderText("CookieKit.MoreInfo", selectedLocale)
        }, /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__consent-label-link"),
          href: links.fingerprinting,
          target: "_blank",
          rel: "noopener noreferrer"
        }, renderText("CookieKit.FingerprintLabel", selectedLocale)))), displayDoNotSell && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consent ").concat(BLOCK, "__consent--donotsell")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consent-checkbox")
        }, /*#__PURE__*/React.createElement("input", {
          id: "xbCheckbox_donotsell",
          type: "checkbox",
          checked: doNotSellConsent,
          onChange: this.handleDoNotSellCheck
        }), /*#__PURE__*/React.createElement("label", {
          htmlFor: "xbCheckbox_donotsell",
          className: "".concat(BLOCK, "__checkbox")
        })), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consent-label"),
          title: renderText("CookieKit.MoreInfo", selectedLocale)
        }, /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__consent-label-link"),
          href: links.donotsell,
          target: "_blank",
          rel: "noopener noreferrer"
        }, renderText("CookieKit.DoNotSellLabel", selectedLocale))))) : null, consentCount > 1 && /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button ".concat(BLOCK, "__check-all"),
          onClick: this.handleCheckAll
        }, isAllConsentsChecked ? renderText("CookieKit.UncheckButton", selectedLocale) : renderText("CookieKit.CheckAllButton", selectedLocale)), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__actions")
        }, !hideBrandTag && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__privacy-partner-container")
        }, /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__privacy-partner-link"),
          href: links.poweredBy,
          target: "_blank",
          rel: "noopener noreferrer"
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__privacy-partner")
        }, renderText("CookieKit.PoweredByText", selectedLocale), /*#__PURE__*/React.createElement("img", {
          className: "".concat(BLOCK, "__privacy-partner-logo"),
          src: xbLogo,
          alt: "XcooBee logo"
        })))), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__button-container")
        }, /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button ".concat(BLOCK, "__button"),
          onClick: this.handleSubmit
        }, renderText("CookieKit.OkButton", selectedLocale)))), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__links")
        }, isConnected && (appearsToBeLoggedIn ? /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__link"),
          href: "".concat(xbOrigin).concat(links.manage),
          target: "_blank",
          rel: "noopener noreferrer"
        }, renderText("CookieKit.ManageLink", selectedLocale)) : /*#__PURE__*/React.createElement("button", {
          className: "xb-cookie-kit__button ".concat(BLOCK, "__link"),
          type: "button",
          onClick: function onClick() {
            return window.open("".concat(xbOrigin).concat(links.login, "?targetUrl=").concat(targetUrl), "", loginModalFeatures);
          }
        }, renderText("CookieKit.LoginLink", selectedLocale))), /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__link"),
          href: privacyUrl,
          target: "_blank",
          rel: "noopener noreferrer"
        }, renderText("CookieKit.PolicyLink", selectedLocale)), /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__link"),
          href: termsUrl,
          target: "_blank",
          rel: "noopener noreferrer"
        }, renderText("CookieKit.TermsLink", selectedLocale))), !hideBrandTag && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__powered-by")
        }, "Powered by", /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__powered-by-link"),
          href: links.poweredBy,
          target: "_blank",
          rel: "noopener noreferrer"
        }, "XcooBee")));
      } else {
        var _locales$find2;

        layout =
        /*#__PURE__*/
        // eslint-disable-next-line max-len
        // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
        React.createElement("div", {
          className: BLOCK,
          onClick: function onClick() {
            return _this2.setState({
              isCountrySelectShown: false,
              isLocaleSelectShown: false
            });
          },
          role: "dialog",
          tabIndex: "-1"
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__content")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__text")
        }, this.renderTextMessage(textMessage)), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__main")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__links-container")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__links")
        }, /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__link"),
          href: privacyUrl,
          target: "_blank",
          rel: "noopener noreferrer"
        }, renderText("CookieKit.PolicyLink", selectedLocale)), /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__link"),
          href: termsUrl,
          target: "_blank",
          rel: "noopener noreferrer"
        }, renderText("CookieKit.TermsLink", selectedLocale))), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__login-container")
        }, !hideBrandTag ? /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__powered-by-container")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__powered-by")
        }, "Powered by", /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__powered-by-link"),
          href: links.poweredBy,
          target: "_blank",
          rel: "noopener noreferrer"
        }, "XcooBee"))) : /*#__PURE__*/React.createElement("div", null), isConnected && (appearsToBeLoggedIn ? /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__link"),
          href: "".concat(xbOrigin).concat(links.manage),
          target: "_blank",
          rel: "noopener noreferrer"
        }, renderText("CookieKit.ManageLink", selectedLocale)) : /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__login-button")
        }, /*#__PURE__*/React.createElement("button", {
          className: "xb-cookie-kit__button ".concat(BLOCK, "__link"),
          type: "button",
          onClick: function onClick() {
            return window.open("".concat(xbOrigin).concat(links.login, "?targetUrl=").concat(targetUrl), "", loginModalFeatures);
          }
        }, renderText("CookieKit.LoginLink", selectedLocale)))))), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consents-container")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consents-container-body")
        }, cookieDefns.map(function (cookieDefn) {
          return /*#__PURE__*/React.createElement("div", {
            key: cookieDefn.type,
            className: "".concat(BLOCK, "__consent ").concat(BLOCK, "__cookie")
          }, /*#__PURE__*/React.createElement("div", {
            className: "".concat(BLOCK, "__checkbox-container")
          }, /*#__PURE__*/React.createElement("input", {
            id: "xbCheckbox_".concat(cookieDefn.id),
            type: "checkbox" // Application cookies are always checked.
            ,
            checked: cookieDefn.type === "application" || consentSettings[cookieDefn.type] // Application cookies are always disabled.
            ,
            disabled: cookieDefn.type === "application",
            onChange: function onChange(e) {
              return _this2.handleCookieCheck(e, cookieDefn.type);
            }
          }), /*#__PURE__*/React.createElement("label", {
            htmlFor: "xbCheckbox_".concat(cookieDefn.id),
            className: "".concat(BLOCK, "__checkbox") // Application cookies are always disabled.
            ,
            disabled: cookieDefn.type === "application"
          })), /*#__PURE__*/React.createElement("div", {
            className: "".concat(BLOCK, "__consent-label"),
            title: renderText("CookieKit.MoreInfo", selectedLocale)
          }, /*#__PURE__*/React.createElement("a", {
            className: "".concat(BLOCK, "__consent-label-link"),
            href: cookieDefn.url,
            target: "_blank",
            rel: "noopener noreferrer"
          }, renderText(cookieDefn.localeKey, selectedLocale))));
        }), displayFingerprint && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consent ").concat(BLOCK, "__fingerprint")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__checkbox-container ").concat(BLOCK, "__fingerprint-checkbox")
        }, /*#__PURE__*/React.createElement("input", {
          id: "xbCheckbox_fingerprint",
          type: "checkbox",
          checked: fingerprintConsent,
          onChange: this.handleFingerprintCheck
        }), /*#__PURE__*/React.createElement("label", {
          htmlFor: "xbCheckbox_fingerprint",
          className: "".concat(BLOCK, "__checkbox")
        })), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consent-label")
        }, /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__consent-label-link"),
          href: links.donotsell,
          target: "_blank",
          rel: "noopener noreferrer"
        }, renderText("CookieKit.FingerprintLabel", selectedLocale)))), displayDoNotSell && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consent ").concat(BLOCK, "__donotsell")
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__checkbox-container ").concat(BLOCK, "__donotsell-checkbox")
        }, /*#__PURE__*/React.createElement("input", {
          id: "xbCheckbox_donotsell",
          type: "checkbox",
          checked: doNotSellConsent,
          onChange: this.handleDoNotSellCheck
        }), /*#__PURE__*/React.createElement("label", {
          htmlFor: "xbCheckbox_donotsell",
          className: "".concat(BLOCK, "__checkbox")
        })), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consent-label")
        }, /*#__PURE__*/React.createElement("a", {
          className: "".concat(BLOCK, "__consent-label-link"),
          href: links.donotsell,
          target: "_blank",
          rel: "noopener noreferrer"
        }, renderText("CookieKit.DoNotSellLabel", selectedLocale))))), consentCount > 1 && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__consents-container-foot")
        }, /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button ".concat(BLOCK, "__check-all"),
          onClick: this.handleCheckAll
        }, isAllConsentsChecked ? renderText("CookieKit.UncheckButton", selectedLocale) : renderText("CookieKit.CheckAllButton", selectedLocale)))), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__button-container")
        }, /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button ".concat(BLOCK, "__button"),
          onClick: this.handleSubmit
        }, renderText("CookieKit.OkButton", selectedLocale))))), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__actions")
        }, /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button ".concat(BLOCK, "__close-button"),
          onClick: onClose
        }, /*#__PURE__*/React.createElement("img", {
          className: "".concat(BLOCK, "__close-button-icon"),
          src: closeIcon,
          alt: "close-icon"
        })), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__language-picker-container")
        }, /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button ".concat(BLOCK, "__language-picker"),
          onClick: this.handleLocaleSelectToggle
        }, ((_locales$find2 = locales.find(function (locale) {
          return locale.code === selectedLocale;
        })) === null || _locales$find2 === void 0 ? void 0 : _locales$find2.text) || "?"), isLocaleSelectShown && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__custom-select")
        }, locales.map(function (locale) {
          return /*#__PURE__*/React.createElement("button", {
            key: locale.code,
            className: "xb-cookie-kit__button ".concat(BLOCK, "__language-picker-button"),
            type: "button",
            onClick: function onClick() {
              return _this2.handleLocaleChange(locale);
            }
          }, locale.text);
        }))), /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__block ").concat(BLOCK, "__block--sm ").concat(BLOCK, "__country-picker"),
          title: countryCode
        }, /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button ".concat(BLOCK, "__country-picker-button"),
          onClick: this.handleCountrySelectToggle
        }, /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__flag")
        }, /*#__PURE__*/React.createElement(ReactCountryFlag, {
          code: countryCode,
          svg: true
        }))), isCountrySelectShown && /*#__PURE__*/React.createElement("div", {
          className: "".concat(BLOCK, "__country-picker-container")
        }, /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button",
          onClick: function onClick(e) {
            return _this2.handleScroll(e, "up");
          }
        }, /*#__PURE__*/React.createElement("img", {
          src: caretUp,
          alt: "caret-up"
        })), /*#__PURE__*/React.createElement("div", {
          ref: function ref(countryPicker) {
            _this2.countryPicker = countryPicker;
          },
          className: "".concat(BLOCK, "__country-picker-select")
        }, countryCodes.map(function (cCode) {
          return /*#__PURE__*/React.createElement("button", {
            type: "button",
            key: "country-flag-".concat(cCode),
            className: "xb-cookie-kit__button ".concat(BLOCK, "__country-picker-button"),
            onClick: function onClick() {
              return _this2.handleCountryChange(cCode);
            },
            title: cCode
          }, /*#__PURE__*/React.createElement("div", {
            className: "".concat(BLOCK, "__flag")
          }, /*#__PURE__*/React.createElement(ReactCountryFlag, {
            code: cCode,
            svg: true
          })));
        })), /*#__PURE__*/React.createElement("button", {
          type: "button",
          className: "xb-cookie-kit__button",
          onClick: function onClick(e) {
            return _this2.handleScroll(e, "bottom");
          }
        }, /*#__PURE__*/React.createElement("img", {
          src: caretDown,
          alt: "caret-down"
        }))))));
      }

      return layout;
    }
  }]);

  return CookieKitPopup;
}(React.PureComponent);

_defineProperty(CookieKitPopup, "propTypes", {
  companyLogo: PropTypes.string,
  cookieConsents: PropTypes.arrayOf(CookieConsentShape.isRequired).isRequired,
  displayDoNotSell: PropTypes.bool,
  displayFingerprint: PropTypes.bool,
  doNotSellConsent: PropTypes.bool,
  fingerprintConsent: PropTypes.bool,
  hideBrandTag: PropTypes.bool.isRequired,
  isConnected: PropTypes.bool.isRequired,
  onClose: PropTypes.func.isRequired,
  onLogin: PropTypes.func.isRequired,
  onSubmit: PropTypes.func.isRequired,
  loginStatus: PropTypes.bool,
  privacyUrl: PropTypes.string.isRequired,
  requestDataTypes: PropTypes.arrayOf(PropTypes.oneOf(cookieTypes).isRequired).isRequired,
  termsUrl: PropTypes.string.isRequired,
  textMessage: PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.shape({
    "de-de": PropTypes.string,
    "en-us": PropTypes.string,
    "es-419": PropTypes.string,
    "fr-fr": PropTypes.string
  }).isRequired]).isRequired,
  theme: PropTypes.oneOf(themes)
});

_defineProperty(CookieKitPopup, "defaultProps", {
  companyLogo: null,
  displayDoNotSell: false,
  displayFingerprint: false,
  doNotSellConsent: false,
  fingerprintConsent: false,
  loginStatus: false,
  theme: "popup"
});

export { CookieKitPopup as default };