Socket
Socket
Sign inDemoInstall

react-cookie-kit

Package Overview
Dependencies
20
Maintainers
1
Versions
23
Alerts
File Explorer

Advanced tools

npm Scripts
License

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 1.0.11 to 1.0.12

dist/assets/caret-arrow-up.png
dist/assets/caret-down.png
dist/xck-react-theme-overlay.css
dist/xck-react-theme-popup.css
dist/xck-react-theme-popup.scss
src/assets/caret-arrow-up.png
src/assets/caret-down.png
src/xck-react-theme-overlay.scss
src/xck-react-theme-popup.scss

8

dist/BridgeCommunicator.js

@@ -13,2 +13,4 @@ function _typeof(obj) { 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 _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
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); }

@@ -18,4 +20,2 @@

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
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; }

@@ -39,3 +39,3 @@

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "XcooBeeHandleResponse", function (event) {
_defineProperty(_assertThisInitialized(_this), "XcooBeeHandleResponse", function (event) {
var _this$props = _this.props,

@@ -65,3 +65,3 @@ onLoginStatusChange = _this$props.onLoginStatusChange,

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "checkLoginStatus", function () {
_defineProperty(_assertThisInitialized(_this), "checkLoginStatus", function () {
var _this$props2 = _this.props,

@@ -68,0 +68,0 @@ campaignReference = _this$props2.campaignReference,

34

dist/CookieKit.js

@@ -13,2 +13,4 @@ function _typeof(obj) { 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 _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
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); }

@@ -18,4 +20,2 @@

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
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; }

@@ -26,3 +26,3 @@

import React from "react";
import { animations, consentsSources, consentStatuses, cookieTypes, positions } from "xcoobee-cookie-kit-core/src/configs";
import { animations, consentsSources, consentStatuses, cookieTypes, positions, themes } from "xcoobee-cookie-kit-core/src/configs";
import { clearLocale, clearCountryCode } from "xcoobee-cookie-kit-core/src/LocaleManager";

@@ -65,3 +65,3 @@ import cookieConsentsCache from "xcoobee-cookie-kit-core/src/cookieConsentsCache";

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleOpen", function () {
_defineProperty(_assertThisInitialized(_this), "handleOpen", function () {
// console.log("CookieKit#handleOpen");

@@ -83,3 +83,3 @@ var transparent = _this.state.transparent;

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handlePopupClose", function () {
_defineProperty(_assertThisInitialized(_this), "handlePopupClose", function () {
// console.log("CookieKit#handlePopupClose");

@@ -104,3 +104,3 @@ var _this$props = _this.props,

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handlePopupLogin", function () {
_defineProperty(_assertThisInitialized(_this), "handlePopupLogin", function () {
// console.log("CookieKit#handlePopupLogin");

@@ -124,3 +124,3 @@ _this.clearTimers();

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handlePopupSubmit", function (nextConsentSettings, fingerprintConsent) {
_defineProperty(_assertThisInitialized(_this), "handlePopupSubmit", function (nextConsentSettings, fingerprintConsent) {
// console.log("CookieKit#handlePopupSubmit");

@@ -167,3 +167,3 @@ // console.dir(nextConsentSettings);

hasClosed: false,
isOpen: isOpen,
isOpen: false,
isShown: true,

@@ -296,3 +296,2 @@ pulsing: false,

cookieConsents = _this$props4.cookieConsents,
detectCountry = _this$props4.detectCountry,
displayFingerprint = _this$props4.displayFingerprint,

@@ -307,3 +306,4 @@ fingerprintConsent = _this$props4.fingerprintConsent,

testMode = _this$props4.testMode,
textMessage = _this$props4.textMessage;
textMessage = _this$props4.textMessage,
theme = _this$props4.theme;
var _this$state = this.state,

@@ -319,3 +319,3 @@ animated = _this$state.animated,

var renderButton = !renderPopup;
var renderResetButton = testMode && cookieConsentsCache.get();
var renderResetButton = theme === "popup" && testMode && cookieConsentsCache.get();
return isShown && React.createElement("div", {

@@ -330,3 +330,2 @@ className: cx(BLOCK, position, {

cookieConsents: cookieConsents,
detectCountry: detectCountry,
displayFingerprint: displayFingerprint,

@@ -343,3 +342,4 @@ fingerprintConsent: fingerprintConsent,

termsUrl: termsUrl,
textMessage: textMessage
textMessage: textMessage,
theme: theme
}), renderButton && React.createElement("button", {

@@ -364,3 +364,2 @@ type: "button",

cookieConsents: PropTypes.arrayOf(CookieConsentShape.isRequired).isRequired,
detectCountry: PropTypes.bool,
displayFingerprint: PropTypes.bool,

@@ -384,3 +383,4 @@ expirationTime: PropTypes.number,

"fr-fr": PropTypes.string
})]).isRequired
})]).isRequired,
theme: PropTypes.oneOf(themes)
});

@@ -391,3 +391,2 @@

companyLogo: null,
detectCountry: false,
displayFingerprint: false,

@@ -397,5 +396,6 @@ expirationTime: 0,

loginStatus: false,
testMode: false
testMode: false,
theme: "popup"
});
export { CookieKit as default };

118

dist/CookieKitContainer.js

@@ -0,1 +1,9 @@

function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
function _typeof(obj) { 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); }

@@ -13,2 +21,4 @@

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
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); }

@@ -18,4 +28,2 @@

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
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; }

@@ -25,3 +33,4 @@

import React from "react";
import { cookieOptionsKeys, consentStatuses, cookieTypes, cssHref, euCountries, positions } from "xcoobee-cookie-kit-core/src/configs";
import fetch from "isomorphic-fetch";
import { cookieOptionsKeys, consentStatuses, cookieTypes, cssHrefTheme1, cssHrefTheme2, euCountries, positions, themes } from "xcoobee-cookie-kit-core/src/configs";
import cookieConsentsCache from "xcoobee-cookie-kit-core/src/cookieConsentsCache";

@@ -31,2 +40,3 @@ import { getCountryCode, saveCountryCode, fetchCountryCode, fetchCountryCodeForSubscribers } from "xcoobee-cookie-kit-core/src/LocaleManager";

import NotAuthorizedError from "xcoobee-cookie-kit-core/src/NotAuthorizedError";
import { countryCodes } from "xcoobee-cookie-kit-core/src/countryData";
import { xckDomain } from "./configs";

@@ -40,2 +50,3 @@ import CookieKit from "./CookieKit";

var CROWD_AI = cookieOptionsKeys.crowdAi;
var DEFAULT_COUNTRY_CODE = "EU";

@@ -107,3 +118,3 @@ function callCookieManagingFunctions(consentSettings) {

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "onLoginStatusChange", function (loginStatus) {
_defineProperty(_assertThisInitialized(_this), "onLoginStatusChange", function (loginStatus) {
// console.log("CookieKitContainer#onLoginStatusChange");

@@ -127,3 +138,3 @@ var isLoginStatusChecked = _this.state.isLoginStatusChecked;

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleConsentStatusChange", function (nextConsentStatus) {
_defineProperty(_assertThisInitialized(_this), "handleConsentStatusChange", function (nextConsentStatus) {
// console.log("CookieKitContainer#handleConsentStatusChange");

@@ -136,3 +147,3 @@ // console.log("nextConsentStatus:", nextConsentStatus);

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleCookieConsentsChange", function (consentSettings, fingerprintConsent) {
_defineProperty(_assertThisInitialized(_this), "handleCookieConsentsChange", function (consentSettings, fingerprintConsent) {
// console.log("CookieKitContainer#handleCookieConsentsChange");

@@ -167,12 +178,21 @@ var _this$state = _this.state,

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleBridgeError", function (message) {
_defineProperty(_assertThisInitialized(_this), "handleBridgeError", function (errorMessage) {
// eslint-disable-next-line max-len
console.error("Something went wrong because of error: ".concat(message, ". We are experiencing issues saving your cookie category selection. Please contact the site administrator."));
console.error("Something went wrong because of error: ".concat(errorMessage, ". We are experiencing issues saving your cookie category selection. Please contact the site administrator."));
var error = new NotAuthorizedError();
_this.setState({
campaignReference: null
});
if (errorMessage === error.message) {
_this.setState({
loginStatus: false
});
_this.fallBackToHostDefaults();
} else {
_this.setState({
campaignReference: null
});
}
});
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "resolveConnectedCookieConsents", function (cookieOptions) {
_defineProperty(_assertThisInitialized(_this), "resolveConnectedCookieConsents", function (cookieOptions) {
// console.log("CookieKitContainer#resolveConnectedCookieConsents");

@@ -230,2 +250,3 @@ var _this$state2 = _this.state,

countryCode: getCountryCode(),
defaultCountryCode: countryCodes.includes(props.defaultCountryCode) ? props.defaultCountryCode : DEFAULT_COUNTRY_CODE,
initializing: true,

@@ -239,2 +260,3 @@ isConsentCached: false,

var linkDom = document.createElement("link");
var cssHref = props.theme === "popup" ? cssHrefTheme1 : cssHrefTheme2;
linkDom.setAttribute("rel", "stylesheet");

@@ -279,4 +301,5 @@ linkDom.setAttribute("href", "".concat(xckDomain, "/").concat(cssHref));

detectCountry = _this$props.detectCountry;
var countryCode = this.state.countryCode;
var defaultCountryCode = "EU";
var _this$state3 = this.state,
countryCode = _this$state3.countryCode,
defaultCountryCode = _this$state3.defaultCountryCode;

@@ -296,21 +319,25 @@ if (countryCode) {

return promise.catch(function (error) {
console.error(error);
return promise.then(function (cCode) {
saveCountryCode(cCode);
_this2.setState({
countryCode: defaultCountryCode
countryCode: cCode
});
return defaultCountryCode;
}).then(function (cCode) {
saveCountryCode(cCode);
return cCode;
}).catch(function (error) {
console.error(error);
_this2.setState({
countryCode: cCode
countryCode: defaultCountryCode
});
return cCode;
return defaultCountryCode;
});
}
this.setState({
countryCode: defaultCountryCode
});
saveCountryCode(defaultCountryCode);
return Promise.resolve(defaultCountryCode);

@@ -327,5 +354,5 @@ }

value: function getCookieTypes() {
var _this$state3 = this.state,
consentStatus = _this$state3.consentStatus,
cookieConsents = _this$state3.cookieConsents;
var _this$state4 = this.state,
consentStatus = _this$state4.consentStatus,
cookieConsents = _this$state4.cookieConsents;
var consentSettings = {};

@@ -367,5 +394,5 @@

displayOnlyForEU = _this$props2.displayOnlyForEU;
var _this$state4 = this.state,
countryCode = _this$state4.countryCode,
isConsentCached = _this$state4.isConsentCached;
var _this$state5 = this.state,
countryCode = _this$state5.countryCode,
isConsentCached = _this$state5.isConsentCached;

@@ -431,3 +458,2 @@ if (isConsentCached) {

companyLogo = _this$props4.companyLogo,
detectCountry = _this$props4.detectCountry,
displayFingerprint = _this$props4.displayFingerprint,

@@ -442,12 +468,14 @@ expirationTime = _this$props4.expirationTime,

testMode = _this$props4.testMode,
textMessage = _this$props4.textMessage;
var _this$state5 = this.state,
campaignReference = _this$state5.campaignReference,
consentsSource = _this$state5.consentsSource,
consentStatus = _this$state5.consentStatus,
cookieConsents = _this$state5.cookieConsents,
countryCode = _this$state5.countryCode,
initializing = _this$state5.initializing,
loginStatus = _this$state5.loginStatus;
var redefinedPosition = positions.includes(position) ? position : positions[0];
textMessage = _this$props4.textMessage,
theme = _this$props4.theme;
var _this$state6 = this.state,
campaignReference = _this$state6.campaignReference,
consentsSource = _this$state6.consentsSource,
consentStatus = _this$state6.consentStatus,
cookieConsents = _this$state6.cookieConsents,
countryCode = _this$state6.countryCode,
initializing = _this$state6.initializing,
loginStatus = _this$state6.loginStatus;
var defaultPositionIndex = theme === "overlay" ? 4 : 0;
var redefinedPosition = positions.includes(position) ? position : positions[defaultPositionIndex];
var cookies = cookieConsents ? cookieConsents.filter(function (consent) {

@@ -468,3 +496,2 @@ return consent.type !== "fingerprint";

countryCode: countryCode,
detectCountry: detectCountry,
displayFingerprint: displayFingerprint,

@@ -483,3 +510,4 @@ expirationTime: expirationTime,

testMode: testMode,
textMessage: textMessage
textMessage: textMessage,
theme: theme
})), React.createElement(BridgeCommunicator, {

@@ -506,2 +534,3 @@ ref: function ref(bridgeRef) {

cssAutoLoad: PropTypes.bool,
defaultCountryCode: PropTypes.oneOf([].concat(_toConsumableArray(countryCodes), [DEFAULT_COUNTRY_CODE])),
detectCountry: PropTypes.bool,

@@ -524,3 +553,4 @@ displayFingerprint: PropTypes.bool,

"fr-fr": PropTypes.string
})]).isRequired
})]).isRequired,
theme: PropTypes.oneOf(themes)
});

@@ -534,2 +564,3 @@

cssAutoLoad: true,
defaultCountryCode: DEFAULT_COUNTRY_CODE,
detectCountry: false,

@@ -544,5 +575,6 @@ displayFingerprint: false,

targetUrl: null,
testMode: false
testMode: false,
theme: "popup"
});
export { CookieKitContainer as default };

560

dist/CookieKitPopup.js

@@ -15,2 +15,4 @@ function _typeof(obj) { 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 _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
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); }

@@ -20,4 +22,2 @@

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
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; }

@@ -28,3 +28,3 @@

import ReactCountryFlag from "react-country-flag";
import { cookieDefns as allAvailCookieDefns, cookieTypes, locales, links } from "xcoobee-cookie-kit-core/src/configs";
import { cookieDefns as allAvailCookieDefns, cookieTypes, locales, links, themes } from "xcoobee-cookie-kit-core/src/configs";
import { countryCodes } from "xcoobee-cookie-kit-core/src/countryData";

@@ -35,5 +35,6 @@ import renderText from "xcoobee-cookie-kit-core/src/renderText";

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 BLOCK = "xb-cookie-kit-popup";
var OPTION = "loginstatus";

@@ -54,3 +55,3 @@

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

@@ -68,3 +69,3 @@ return;

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleLocaleChange", function (locale) {
_defineProperty(_assertThisInitialized(_this), "handleLocaleChange", function (locale) {
// console.log('CookieKitPopup#handleLocaleChange');

@@ -79,3 +80,3 @@ _this.setState({

_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleCountryChange", function (countryCode) {
_defineProperty(_assertThisInitialized(_this), "handleCountryChange", function (countryCode) {
// console.log('CookieKitPopup#handleCountryChange');

@@ -90,3 +91,3 @@ _this.setState({

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

@@ -103,3 +104,3 @@ e.stopPropagation();

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

@@ -116,3 +117,3 @@ e.stopPropagation();

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

@@ -130,3 +131,3 @@ var consentSettings = _this.state.consentSettings;

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

@@ -159,3 +160,3 @@ var consentSettings = _this.state.consentSettings;

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

@@ -167,3 +168,3 @@ _this.setState({

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

@@ -177,2 +178,13 @@ var onSubmit = _this.props.onSubmit;

_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$props = _this.props,

@@ -237,3 +249,2 @@ cookieConsents = _this$props.cookieConsents,

companyLogo = _this$props2.companyLogo,
detectCountry = _this$props2.detectCountry,
displayFingerprint = _this$props2.displayFingerprint,

@@ -247,3 +258,4 @@ hideBrandTag = _this$props2.hideBrandTag,

termsUrl = _this$props2.termsUrl,
textMessage = _this$props2.textMessage;
textMessage = _this$props2.textMessage,
theme = _this$props2.theme;
var _this$state2 = this.state,

@@ -265,177 +277,371 @@ consentSettings = _this$state2.consentSettings,

});
var BLOCK = theme === "popup" ? "xb-cookie-kit-popup" : "xb-cookie-kit-overlay";
var loginModalFeatures = "left=400, top=100, width=500, height=600";
return React.createElement("div", {
className: BLOCK,
onClick: function onClick() {
return _this2.setState({
isCountrySelectShown: false,
isLocaleSelectShown: false
});
}
}, React.createElement("div", {
className: "".concat(BLOCK, "__header")
}, React.createElement("div", {
className: "".concat(BLOCK, "__logo")
}, isConnected && companyLogo && React.createElement("img", {
className: "".concat(BLOCK, "__company-logo"),
src: companyLogo,
alt: "Company logo"
})), React.createElement("div", {
className: "".concat(BLOCK, "__title")
}, renderText("CookieKit.Title", selectedLocale)), React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__close-button"),
onClick: onClose
}, React.createElement("img", {
className: "".concat(BLOCK, "__close-button-icon"),
src: closeIcon,
alt: "close-icon"
}))), React.createElement("div", {
className: "".concat(BLOCK, "__text-container")
}, React.createElement("div", {
className: "".concat(BLOCK, "__text")
}, typeof textMessage === "string" ? textMessage : this.renderTextMessage(textMessage)), React.createElement("div", {
className: "".concat(BLOCK, "__locale-container")
}, React.createElement("div", {
className: "".concat(BLOCK, "__locale")
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__language-picker"),
onClick: this.handleLocaleSelectToggle
}, selectedLocale), detectCountry && React.createElement("div", {
className: "".concat(BLOCK, "__block ").concat(BLOCK, "__block--sm ").concat(BLOCK, "__country-picker")
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__country-picker-button"),
onClick: this.handleCountrySelectToggle
}, React.createElement("div", {
className: "".concat(BLOCK, "__flag")
}, React.createElement(ReactCountryFlag, {
code: countryCode,
svg: true
}))))), isLocaleSelectShown && React.createElement("div", {
className: "".concat(BLOCK, "__custom-select")
}, locales.map(function (locale) {
return React.createElement("button", {
key: locale,
className: "xb-cookie-kit__button ".concat(BLOCK, "__language-picker-button"),
type: "button",
var layout;
if (theme === "popup") {
layout = React.createElement("div", {
className: BLOCK,
onClick: function onClick() {
return _this2.handleLocaleChange(locale);
return _this2.setState({
isCountrySelectShown: false,
isLocaleSelectShown: false
});
}
}, locale);
})), isCountrySelectShown && React.createElement("div", {
className: "".concat(BLOCK, "__country-picker-select")
}, countryCodes.map(function (cCode) {
return React.createElement("button", {
}, React.createElement("div", {
className: "".concat(BLOCK, "__header")
}, React.createElement("div", {
className: "".concat(BLOCK, "__logo")
}, isConnected && companyLogo && React.createElement("img", {
className: "".concat(BLOCK, "__company-logo"),
src: companyLogo,
alt: "Company logo"
})), React.createElement("div", {
className: "".concat(BLOCK, "__title")
}, renderText("CookieKit.Title", selectedLocale)), React.createElement("button", {
type: "button",
key: "country-flag-".concat(cCode),
className: "xb-cookie-kit__button ".concat(BLOCK, "__close-button"),
onClick: onClose
}, React.createElement("img", {
className: "".concat(BLOCK, "__close-button-icon"),
src: closeIcon,
alt: "close-icon"
}))), React.createElement("div", {
className: "".concat(BLOCK, "__text-container")
}, React.createElement("div", {
className: "".concat(BLOCK, "__text")
}, typeof textMessage === "string" ? textMessage : this.renderTextMessage(textMessage)), React.createElement("div", {
className: "".concat(BLOCK, "__locale-container")
}, React.createElement("div", {
className: "".concat(BLOCK, "__locale")
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__language-picker"),
onClick: this.handleLocaleSelectToggle
}, selectedLocale), React.createElement("div", {
className: "".concat(BLOCK, "__block ").concat(BLOCK, "__block--sm ").concat(BLOCK, "__country-picker"),
title: countryCode
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__country-picker-button"),
onClick: function onClick() {
return _this2.handleCountryChange(cCode);
},
title: cCode
onClick: this.handleCountrySelectToggle
}, React.createElement("div", {
className: "".concat(BLOCK, "__flag")
}, React.createElement(ReactCountryFlag, {
code: cCode,
code: countryCode,
svg: true
})));
})))), React.createElement("div", {
className: "".concat(BLOCK, "__cookie-list")
}, cookieDefns.map(function (cookieDefn) {
return React.createElement("div", {
key: cookieDefn.type,
className: "".concat(BLOCK, "__cookie")
}))))), isLocaleSelectShown && React.createElement("div", {
className: "".concat(BLOCK, "__custom-select")
}, locales.map(function (locale) {
return React.createElement("button", {
key: locale,
className: "xb-cookie-kit__button ".concat(BLOCK, "__language-picker-button"),
type: "button",
onClick: function onClick() {
return _this2.handleLocaleChange(locale);
}
}, locale);
})), isCountrySelectShown && React.createElement("div", {
className: "".concat(BLOCK, "__country-picker-select")
}, countryCodes.map(function (cCode) {
return 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
}, React.createElement("div", {
className: "".concat(BLOCK, "__flag")
}, React.createElement(ReactCountryFlag, {
code: cCode,
svg: true
})));
})))), React.createElement("div", {
className: "".concat(BLOCK, "__cookie-list")
}, cookieDefns.map(function (cookieDefn) {
return React.createElement("div", {
key: cookieDefn.type,
className: "".concat(BLOCK, "__cookie")
}, React.createElement("div", {
className: "".concat(BLOCK, "__block ").concat(BLOCK, "__block--lg")
}, React.createElement("div", null, React.createElement("input", {
id: "xbCheckbox_".concat(cookieDefn.id),
type: "checkbox",
checked: consentSettings[cookieDefn.type],
onChange: function onChange(e) {
return _this2.handleCookieCheck(e, cookieDefn.type);
}
}), React.createElement("label", {
htmlFor: "xbCheckbox_".concat(cookieDefn.id),
className: "".concat(BLOCK, "__checkbox")
})), React.createElement("div", {
className: "".concat(BLOCK, "__cookie-title"),
title: renderText("CookieKit.MoreInfo", selectedLocale)
}, React.createElement("a", {
className: "".concat(BLOCK, "__cookie-title-link"),
href: cookieDefn.url,
target: "_blank",
rel: "noopener noreferrer"
}, renderText(cookieDefn.localeKey, selectedLocale)))));
})), cookieDefns.length > 1 && React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__check-all"),
onClick: this.handleCheckAll
}, isAllChecked ? renderText("CookieKit.UncheckButton", selectedLocale) : renderText("CookieKit.CheckAllButton", selectedLocale)), displayFingerprint && React.createElement("div", {
className: "".concat(BLOCK, "__fingerprint")
}, React.createElement("div", {
className: "".concat(BLOCK, "__block ").concat(BLOCK, "__block--lg")
}, React.createElement("div", null, React.createElement("input", {
id: "xbCheckbox_".concat(cookieDefn.id),
className: "".concat(BLOCK, "__fingerprint-checkbox")
}, React.createElement("input", {
id: "xbCheckbox_fingerprint",
type: "checkbox",
checked: consentSettings[cookieDefn.type],
onChange: function onChange(e) {
return _this2.handleCookieCheck(e, cookieDefn.type);
}
checked: fingerprintConsent,
onChange: this.handleFingerprintCheck
}), React.createElement("label", {
htmlFor: "xbCheckbox_".concat(cookieDefn.id),
htmlFor: "xbCheckbox_fingerprint",
className: "".concat(BLOCK, "__checkbox")
})), React.createElement("div", {
className: "".concat(BLOCK, "__cookie-title"),
title: renderText("CookieKit.MoreInfo", selectedLocale)
className: "".concat(BLOCK, "__fingerprint-label")
}, renderText("CookieKit.FingerprintLabel", selectedLocale))), React.createElement("div", {
className: "".concat(BLOCK, "__actions")
}, !hideBrandTag && React.createElement("div", {
className: "".concat(BLOCK, "__privacy-partner-container")
}, React.createElement("a", {
className: "".concat(BLOCK, "__cookie-title-link"),
href: cookieDefn.url,
className: "".concat(BLOCK, "__privacy-partner-link"),
href: links.poweredBy,
target: "_blank",
rel: "noopener noreferrer"
}, renderText(cookieDefn.localeKey, selectedLocale)))));
})), React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__check-all"),
onClick: this.handleCheckAll
}, isAllChecked ? renderText("CookieKit.UncheckButton", selectedLocale) : renderText("CookieKit.CheckAllButton", selectedLocale)), displayFingerprint && React.createElement("div", {
className: "".concat(BLOCK, "__fingerprint")
}, React.createElement("div", {
className: "".concat(BLOCK, "__fingerprint-checkbox")
}, React.createElement("input", {
id: "xbCheckbox_fingerprint",
type: "checkbox",
checked: fingerprintConsent,
onChange: this.handleFingerprintCheck
}), React.createElement("label", {
htmlFor: "xbCheckbox_fingerprint",
className: "".concat(BLOCK, "__checkbox")
})), React.createElement("div", {
className: "".concat(BLOCK, "__fingerprint-label")
}, renderText("CookieKit.FingerprintLabel", selectedLocale))), React.createElement("div", {
className: "".concat(BLOCK, "__actions")
}, !hideBrandTag && React.createElement("div", {
className: "".concat(BLOCK, "__privacy-partner-container")
}, React.createElement("a", {
className: "".concat(BLOCK, "__privacy-partner-link"),
href: links.poweredBy,
target: "_blank",
rel: "noopener noreferrer"
}, React.createElement("div", {
className: "".concat(BLOCK, "__privacy-partner")
}, renderText("CookieKit.PoweredByText", selectedLocale), React.createElement("img", {
className: "".concat(BLOCK, "__privacy-partner-logo"),
src: xbLogo,
alt: "XcooBee logo"
})))), React.createElement("div", {
className: "".concat(BLOCK, "__button-container")
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__button"),
onClick: this.handleSubmit
}, renderText("CookieKit.OkButton", selectedLocale)))), React.createElement("div", {
className: "".concat(BLOCK, "__links")
}, isConnected && (appearsToBeLoggedIn ? React.createElement("a", {
className: "".concat(BLOCK, "__link"),
href: "".concat(xbOrigin).concat(links.manage),
target: "_blank",
rel: "noopener noreferrer"
}, renderText("CookieKit.ManageLink", selectedLocale)) : 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))), React.createElement("a", {
className: "".concat(BLOCK, "__link"),
href: privacyUrl,
target: "_blank",
rel: "noopener noreferrer"
}, renderText("CookieKit.PolicyLink", selectedLocale)), React.createElement("a", {
className: "".concat(BLOCK, "__link"),
href: termsUrl,
target: "_blank",
rel: "noopener noreferrer"
}, renderText("CookieKit.TermsLink", selectedLocale))), !hideBrandTag && React.createElement("div", {
className: "".concat(BLOCK, "__powered-by")
}, "Powered by", React.createElement("a", {
className: "".concat(BLOCK, "__powered-by-link"),
href: links.poweredBy,
target: "_blank",
rel: "noopener noreferrer"
}, "XcooBee")));
}, React.createElement("div", {
className: "".concat(BLOCK, "__privacy-partner")
}, renderText("CookieKit.PoweredByText", selectedLocale), React.createElement("img", {
className: "".concat(BLOCK, "__privacy-partner-logo"),
src: xbLogo,
alt: "XcooBee logo"
})))), React.createElement("div", {
className: "".concat(BLOCK, "__button-container")
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__button"),
onClick: this.handleSubmit
}, renderText("CookieKit.OkButton", selectedLocale)))), React.createElement("div", {
className: "".concat(BLOCK, "__links")
}, isConnected && (appearsToBeLoggedIn ? React.createElement("a", {
className: "".concat(BLOCK, "__link"),
href: "".concat(xbOrigin).concat(links.manage),
target: "_blank",
rel: "noopener noreferrer"
}, renderText("CookieKit.ManageLink", selectedLocale)) : 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))), React.createElement("a", {
className: "".concat(BLOCK, "__link"),
href: privacyUrl,
target: "_blank",
rel: "noopener noreferrer"
}, renderText("CookieKit.PolicyLink", selectedLocale)), React.createElement("a", {
className: "".concat(BLOCK, "__link"),
href: termsUrl,
target: "_blank",
rel: "noopener noreferrer"
}, renderText("CookieKit.TermsLink", selectedLocale))), !hideBrandTag && React.createElement("div", {
className: "".concat(BLOCK, "__powered-by")
}, "Powered by", React.createElement("a", {
className: "".concat(BLOCK, "__powered-by-link"),
href: links.poweredBy,
target: "_blank",
rel: "noopener noreferrer"
}, "XcooBee")));
} else {
layout = React.createElement("div", {
className: BLOCK,
onClick: function onClick() {
return _this2.setState({
isCountrySelectShown: false,
isLocaleSelectShown: false
});
}
}, React.createElement("div", {
className: "".concat(BLOCK, "__content")
}, React.createElement("div", {
className: "".concat(BLOCK, "__text")
}, typeof textMessage === "string" ? textMessage : this.renderTextMessage(textMessage)), React.createElement("div", {
className: "".concat(BLOCK, "__main")
}, React.createElement("div", {
className: "".concat(BLOCK, "__links-container")
}, React.createElement("div", {
className: "".concat(BLOCK, "__links")
}, React.createElement("a", {
className: "".concat(BLOCK, "__link"),
href: privacyUrl,
target: "_blank",
rel: "noopener noreferrer"
}, renderText("CookieKit.PolicyLink", selectedLocale)), React.createElement("a", {
className: "".concat(BLOCK, "__link"),
href: termsUrl,
target: "_blank",
rel: "noopener noreferrer"
}, renderText("CookieKit.TermsLink", selectedLocale))), React.createElement("div", {
className: "".concat(BLOCK, "__login-container")
}, !hideBrandTag ? React.createElement("div", {
className: "".concat(BLOCK, "__powered-by-container")
}, React.createElement("div", {
className: "".concat(BLOCK, "__powered-by")
}, "Powered by", React.createElement("a", {
className: "".concat(BLOCK, "__powered-by-link"),
href: links.poweredBy,
target: "_blank",
rel: "noopener noreferrer"
}, "XcooBee"))) : React.createElement("div", null), isConnected && (appearsToBeLoggedIn ? React.createElement("a", {
className: "".concat(BLOCK, "__link"),
href: "".concat(xbOrigin).concat(links.manage),
target: "_blank",
rel: "noopener noreferrer"
}, renderText("CookieKit.ManageLink", selectedLocale)) : React.createElement("div", {
className: "".concat(BLOCK, "__login-button")
}, 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)))))), React.createElement("div", {
className: "".concat(BLOCK, "__cookie-container")
}, React.createElement("div", {
className: "".concat(BLOCK, "__cookie-list")
}, cookieDefns.map(function (cookieDefn) {
return React.createElement("div", {
key: cookieDefn.type,
className: "".concat(BLOCK, "__cookie")
}, React.createElement("div", {
className: "".concat(BLOCK, "__checkbox-container")
}, React.createElement("input", {
id: "xbCheckbox_".concat(cookieDefn.id),
type: "checkbox",
checked: consentSettings[cookieDefn.type],
onChange: function onChange(e) {
return _this2.handleCookieCheck(e, cookieDefn.type);
}
}), React.createElement("label", {
htmlFor: "xbCheckbox_".concat(cookieDefn.id),
className: "".concat(BLOCK, "__checkbox")
})), React.createElement("div", {
className: "".concat(BLOCK, "__cookie-title"),
title: renderText("CookieKit.MoreInfo", selectedLocale)
}, React.createElement("a", {
className: "".concat(BLOCK, "__cookie-title-link"),
href: cookieDefn.url,
target: "_blank",
rel: "noopener noreferrer"
}, renderText(cookieDefn.localeKey, selectedLocale))));
})), cookieDefns.length > 1 && React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__check-all"),
onClick: this.handleCheckAll
}, isAllChecked ? renderText("CookieKit.UncheckButton", selectedLocale) : renderText("CookieKit.CheckAllButton", selectedLocale))), displayFingerprint && React.createElement("div", {
className: "".concat(BLOCK, "__fingerprint")
}, React.createElement("div", {
className: "".concat(BLOCK, "__fingerprint-checkbox")
}, React.createElement("input", {
id: "xbCheckbox_fingerprint",
type: "checkbox",
checked: fingerprintConsent,
onChange: this.handleFingerprintCheck
}), React.createElement("label", {
htmlFor: "xbCheckbox_fingerprint",
className: "".concat(BLOCK, "__checkbox")
})), React.createElement("div", {
className: "".concat(BLOCK, "__fingerprint-label")
}, renderText("CookieKit.FingerprintLabel", selectedLocale))), React.createElement("div", {
className: "".concat(BLOCK, "__button-container")
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__button"),
onClick: this.handleSubmit
}, renderText("CookieKit.OkButton", selectedLocale))))), React.createElement("div", {
className: "".concat(BLOCK, "__actions")
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__close-button"),
onClick: onClose
}, React.createElement("img", {
className: "".concat(BLOCK, "__close-button-icon"),
src: closeIcon,
alt: "close-icon"
})), React.createElement("div", {
className: "".concat(BLOCK, "__language-picker-container")
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__language-picker"),
onClick: this.handleLocaleSelectToggle
}, selectedLocale), isLocaleSelectShown && React.createElement("div", {
className: "".concat(BLOCK, "__custom-select")
}, locales.map(function (locale) {
return React.createElement("button", {
key: locale,
className: "xb-cookie-kit__button ".concat(BLOCK, "__language-picker-button"),
type: "button",
onClick: function onClick() {
return _this2.handleLocaleChange(locale);
}
}, locale);
}))), React.createElement("div", {
className: "".concat(BLOCK, "__block ").concat(BLOCK, "__block--sm ").concat(BLOCK, "__country-picker"),
title: countryCode
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button ".concat(BLOCK, "__country-picker-button"),
onClick: this.handleCountrySelectToggle
}, React.createElement("div", {
className: "".concat(BLOCK, "__flag")
}, React.createElement(ReactCountryFlag, {
code: countryCode,
svg: true
}))), isCountrySelectShown && React.createElement("div", {
className: "".concat(BLOCK, "__country-picker-container")
}, React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button",
onClick: function onClick(e) {
return _this2.handleScroll(e, "up");
}
}, React.createElement("img", {
src: caretUp,
alt: "caret-up"
})), React.createElement("div", {
ref: function ref(countryPicker) {
_this2.countryPicker = countryPicker;
},
className: "".concat(BLOCK, "__country-picker-select")
}, countryCodes.map(function (cCode) {
return 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
}, React.createElement("div", {
className: "".concat(BLOCK, "__flag")
}, React.createElement(ReactCountryFlag, {
code: cCode,
svg: true
})));
})), React.createElement("button", {
type: "button",
className: "xb-cookie-kit__button",
onClick: function onClick(e) {
return _this2.handleScroll(e, "bottom");
}
}, React.createElement("img", {
src: caretDown,
alt: "caret-down"
}))))));
}
return layout;
}

@@ -450,3 +656,2 @@ }]);

cookieConsents: PropTypes.arrayOf(CookieConsentShape.isRequired).isRequired,
detectCountry: PropTypes.bool,
displayFingerprint: PropTypes.bool,

@@ -468,3 +673,4 @@ fingerprintConsent: PropTypes.bool,

"fr-fr": PropTypes.string
}).isRequired]).isRequired
}).isRequired]).isRequired,
theme: PropTypes.oneOf(themes)
});

@@ -474,8 +680,8 @@

companyLogo: null,
detectCountry: false,
displayFingerprint: false,
fingerprintConsent: false,
loginStatus: false
loginStatus: false,
theme: "popup"
});
export { CookieKitPopup as default };

9

package.json
{
"name": "react-cookie-kit",
"version": "1.0.11",
"version": "1.0.12",
"description": "Cookie Consent Management for Websites using ReactJS.",

@@ -25,3 +25,5 @@ "keywords": [

"scripts": {
"build": "npm run clean && node-sass src/xck-react.scss dist/xck-react.css && babel src --out-dir dist --ignore src/xck-react.scss --copy-files && rimraf dist/xck-react.scss",
"build": "npm run clean && npm run build-theme-popup-styles && npm run build-theme-overlay-styles",
"build-theme-popup-styles": "node-sass src/xck-react-theme-popup.scss dist/xck-react-theme-popup.css && babel src --out-dir dist --ignore src/xck-react-theme-popup.scss --copy-files && rimraf dist/xck-react-theme-popup.scss",
"build-theme-overlay-styles": "node-sass src/xck-react-theme-overlay.scss dist/xck-react-theme-overlay.css && babel src --out-dir dist --ignore src/xck-react-theme-overlay.scss --copy-files && rimraf dist/xck-react-theme-overlay.scss",
"clean": "rimraf dist/",

@@ -35,5 +37,6 @@ "clear": "node scripts/clear.js",

"classnames": "^2.2.6",
"isomorphic-fetch": "^2.2.1",
"prop-types": "^15.6.0",
"react-country-flag": "^1.0.1",
"xcoobee-cookie-kit-core": "^1.0.9"
"xcoobee-cookie-kit-core": "^1.0.12"
},

@@ -40,0 +43,0 @@ "devDependencies": {

13

src/CookieKit.js

@@ -10,2 +10,3 @@ import cx from "classnames";

positions,
themes,
} from "xcoobee-cookie-kit-core/src/configs";

@@ -50,3 +51,2 @@

cookieConsents: PropTypes.arrayOf(CookieConsentShape.isRequired).isRequired,
detectCountry: PropTypes.bool,
displayFingerprint: PropTypes.bool,

@@ -76,2 +76,3 @@ expirationTime: PropTypes.number,

]).isRequired,
theme: PropTypes.oneOf(themes),
};

@@ -82,3 +83,2 @@

companyLogo: null,
detectCountry: false,
displayFingerprint: false,

@@ -89,2 +89,3 @@ expirationTime: 0,

testMode: false,
theme: "popup",
};

@@ -100,3 +101,3 @@

hasClosed: false,
isOpen,
isOpen: false,
isShown: true,

@@ -265,3 +266,2 @@ pulsing: false,

cookieConsents,
detectCountry,
displayFingerprint,

@@ -277,2 +277,3 @@ fingerprintConsent,

textMessage,
theme,
} = this.props;

@@ -286,3 +287,3 @@ const { animated, hasClosed, isOpen, isShown, pulsing, transparent } = this.state;

const renderResetButton = testMode && cookieConsentsCache.get();
const renderResetButton = theme === "popup" && testMode && cookieConsentsCache.get();

@@ -309,3 +310,2 @@ return (

cookieConsents={cookieConsents}
detectCountry={detectCountry}
displayFingerprint={displayFingerprint}

@@ -323,2 +323,3 @@ fingerprintConsent={fingerprintConsent}

textMessage={textMessage}
theme={theme}
/>

@@ -325,0 +326,0 @@ )}

53

src/CookieKitContainer.js
import PropTypes from "prop-types";
import React from "react";
import fetch from "isomorphic-fetch";

@@ -8,5 +9,7 @@ import {

cookieTypes,
cssHref,
cssHrefTheme1,
cssHrefTheme2,
euCountries,
positions,
themes,
} from "xcoobee-cookie-kit-core/src/configs";

@@ -22,2 +25,3 @@ import cookieConsentsCache from "xcoobee-cookie-kit-core/src/cookieConsentsCache";

import NotAuthorizedError from "xcoobee-cookie-kit-core/src/NotAuthorizedError";
import { countryCodes } from "xcoobee-cookie-kit-core/src/countryData";

@@ -36,2 +40,4 @@ import { xckDomain } from "./configs";

const DEFAULT_COUNTRY_CODE = "EU";
function callCookieManagingFunctions(consentSettings) {

@@ -102,2 +108,3 @@ CookieManager.xckClearCookies(consentSettings);

cssAutoLoad: PropTypes.bool,
defaultCountryCode: PropTypes.oneOf([...countryCodes, DEFAULT_COUNTRY_CODE]),
detectCountry: PropTypes.bool,

@@ -126,2 +133,3 @@ displayFingerprint: PropTypes.bool,

]).isRequired,
theme: PropTypes.oneOf(themes),
};

@@ -135,2 +143,3 @@

cssAutoLoad: true,
defaultCountryCode: DEFAULT_COUNTRY_CODE,
detectCountry: false,

@@ -146,2 +155,3 @@ displayFingerprint: false,

testMode: false,
theme: "popup",
};

@@ -159,2 +169,3 @@

countryCode: getCountryCode(),
defaultCountryCode: countryCodes.includes(props.defaultCountryCode) ? props.defaultCountryCode : DEFAULT_COUNTRY_CODE,
initializing: true,

@@ -168,2 +179,3 @@ isConsentCached: false,

const linkDom = document.createElement("link");
const cssHref = props.theme === "popup" ? cssHrefTheme1 : cssHrefTheme2;

@@ -215,6 +227,4 @@ linkDom.setAttribute("rel", "stylesheet");

const { campaignReference, detectCountry } = this.props;
const { countryCode } = this.state;
const { countryCode, defaultCountryCode } = this.state;
const defaultCountryCode = "EU";
if (countryCode) {

@@ -234,2 +244,8 @@ return Promise.resolve(countryCode);

return promise
.then((cCode) => {
saveCountryCode(cCode);
this.setState({ countryCode: cCode });
return cCode;
})
.catch((error) => {

@@ -240,11 +256,8 @@ console.error(error);

return defaultCountryCode;
})
.then((cCode) => {
saveCountryCode(cCode);
this.setState({ countryCode: cCode });
return cCode;
});
}
this.setState({ countryCode: defaultCountryCode });
saveCountryCode(defaultCountryCode);
return Promise.resolve(defaultCountryCode);

@@ -317,7 +330,14 @@ }

handleBridgeError = (message) => {
handleBridgeError = (errorMessage) => {
// eslint-disable-next-line max-len
console.error(`Something went wrong because of error: ${message}. We are experiencing issues saving your cookie category selection. Please contact the site administrator.`);
console.error(`Something went wrong because of error: ${errorMessage}. We are experiencing issues saving your cookie category selection. Please contact the site administrator.`);
this.setState({ campaignReference: null });
const error = new NotAuthorizedError();
if (errorMessage === error.message) {
this.setState({ loginStatus: false });
this.fallBackToHostDefaults();
} else {
this.setState({ campaignReference: null });
}
};

@@ -418,3 +438,2 @@

companyLogo,
detectCountry,
displayFingerprint,

@@ -430,2 +449,3 @@ expirationTime,

textMessage,
theme,
} = this.props;

@@ -443,3 +463,4 @@

const redefinedPosition = positions.includes(position) ? position : positions[0];
const defaultPositionIndex = theme === "overlay" ? 4 : 0;
const redefinedPosition = positions.includes(position) ? position : positions[defaultPositionIndex];

@@ -464,3 +485,2 @@ const cookies = cookieConsents ? cookieConsents.filter(consent => consent.type !== "fingerprint") : null;

countryCode={countryCode}
detectCountry={detectCountry}
displayFingerprint={displayFingerprint}

@@ -480,2 +500,3 @@ expirationTime={expirationTime}

textMessage={textMessage}
theme={theme}
/>

@@ -482,0 +503,0 @@ </React.Fragment>

668

src/CookieKitPopup.js

@@ -10,2 +10,3 @@ import React from "react";

links,
themes,
} from "xcoobee-cookie-kit-core/src/configs";

@@ -19,2 +20,4 @@ import { countryCodes } from "xcoobee-cookie-kit-core/src/countryData";

import xbLogo from "./assets/xcoobee-logo.svg";
import caretUp from "./assets/caret-arrow-up.png";
import caretDown from "./assets/caret-down.png";

@@ -25,4 +28,2 @@ import CookieConsentShape from "./lib/CookieConsentShape";

const BLOCK = "xb-cookie-kit-popup";
const OPTION = "loginstatus";

@@ -34,3 +35,2 @@

cookieConsents: PropTypes.arrayOf(CookieConsentShape.isRequired).isRequired,
detectCountry: PropTypes.bool,
displayFingerprint: PropTypes.bool,

@@ -58,2 +58,3 @@ fingerprintConsent: PropTypes.bool,

]).isRequired,
theme: PropTypes.oneOf(themes),
};

@@ -63,6 +64,6 @@

companyLogo: null,
detectCountry: false,
displayFingerprint: false,
fingerprintConsent: false,
loginStatus: false,
theme: "popup",
};

@@ -183,2 +184,14 @@

handleScroll = (e, direction) => {
e.stopPropagation();
const currentScrollPosition = this.countryPicker.scrollTop;
if (direction === "up") {
this.countryPicker.scrollTop = currentScrollPosition - 22;
} else {
this.countryPicker.scrollTop = currentScrollPosition + 22;
}
};
renderTextMessage(textMessage) {

@@ -206,3 +219,2 @@ // console.log('CookieKitPopup#renderTextMessage');

companyLogo,
detectCountry,
displayFingerprint,

@@ -217,2 +229,3 @@ hideBrandTag,

textMessage,
theme,
} = this.props;

@@ -239,50 +252,56 @@ const {

const BLOCK = theme === "popup" ? "xb-cookie-kit-popup" : "xb-cookie-kit-overlay";
const loginModalFeatures = "left=400, top=100, width=500, height=600";
return (
<div
className={BLOCK}
onClick={() => this.setState({ isCountrySelectShown: false, isLocaleSelectShown: false })}
>
<div className={`${BLOCK}__header`}>
<div className={`${BLOCK}__logo`}>
{
isConnected && companyLogo && (
<img
className={`${BLOCK}__company-logo`}
src={companyLogo}
alt="Company logo"
/>
)
}
let layout;
if (theme === "popup") {
layout = (
<div
className={BLOCK}
onClick={() => this.setState({ isCountrySelectShown: false, isLocaleSelectShown: false })}
>
<div className={`${BLOCK}__header`}>
<div className={`${BLOCK}__logo`}>
{
isConnected && companyLogo && (
<img
className={`${BLOCK}__company-logo`}
src={companyLogo}
alt="Company logo"
/>
)
}
</div>
<div className={`${BLOCK}__title`}>{renderText("CookieKit.Title", selectedLocale)}</div>
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__close-button`}
onClick={onClose}
>
<img
className={`${BLOCK}__close-button-icon`}
src={closeIcon}
alt="close-icon"
/>
</button>
</div>
<div className={`${BLOCK}__title`}>{renderText("CookieKit.Title", selectedLocale)}</div>
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__close-button`}
onClick={onClose}
>
<img
className={`${BLOCK}__close-button-icon`}
src={closeIcon}
alt="close-icon"
/>
</button>
</div>
<div className={`${BLOCK}__text-container`}>
<div className={`${BLOCK}__text`}>
{ typeof textMessage === "string"
? textMessage : this.renderTextMessage(textMessage) }
</div>
<div className={`${BLOCK}__locale-container`}>
<div className={`${BLOCK}__locale`}>
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__language-picker`}
onClick={this.handleLocaleSelectToggle}
>
{ selectedLocale }
</button>
{ detectCountry && (
<div className={`${BLOCK}__block ${BLOCK}__block--sm ${BLOCK}__country-picker`}>
<div className={`${BLOCK}__text-container`}>
<div className={`${BLOCK}__text`}>
{ typeof textMessage === "string"
? textMessage : this.renderTextMessage(textMessage) }
</div>
<div className={`${BLOCK}__locale-container`}>
<div className={`${BLOCK}__locale`}>
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__language-picker`}
onClick={this.handleLocaleSelectToggle}
>
{ selectedLocale }
</button>
<div
className={`${BLOCK}__block ${BLOCK}__block--sm ${BLOCK}__country-picker`}
title={countryCode}
>
<button

@@ -298,103 +317,173 @@ type="button"

</div>
</div>
{ isLocaleSelectShown && (
<div className={`${BLOCK}__custom-select`}>
{ locales.map(locale => (
<button
key={locale}
className={`xb-cookie-kit__button ${BLOCK}__language-picker-button`}
type="button"
onClick={() => this.handleLocaleChange(locale)}
>
{locale}
</button>
))}
</div>
)}
{ isCountrySelectShown && (
<div className={`${BLOCK}__country-picker-select`}>
{ countryCodes.map(cCode => (
<button
type="button"
key={`country-flag-${cCode}`}
className={`xb-cookie-kit__button ${BLOCK}__country-picker-button`}
onClick={() => this.handleCountryChange(cCode)}
title={cCode}
>
<div className={`${BLOCK}__flag`}>
<ReactCountryFlag code={cCode} svg />
</div>
</button>
))}
</div>
)}
</div>
{ isLocaleSelectShown && (
<div className={`${BLOCK}__custom-select`}>
{ locales.map(locale => (
<button
key={locale}
className={`xb-cookie-kit__button ${BLOCK}__language-picker-button`}
type="button"
onClick={() => this.handleLocaleChange(locale)}
</div>
<div className={`${BLOCK}__cookie-list`}>
{ cookieDefns.map(cookieDefn => (
<div key={cookieDefn.type} className={`${BLOCK}__cookie`}>
<div className={`${BLOCK}__block ${BLOCK}__block--lg`}>
<div>
<input
id={`xbCheckbox_${cookieDefn.id}`}
type="checkbox"
checked={consentSettings[cookieDefn.type]}
onChange={e => this.handleCookieCheck(e, cookieDefn.type)}
/>
<label
htmlFor={`xbCheckbox_${cookieDefn.id}`}
className={`${BLOCK}__checkbox`}
/>
</div>
<div
className={`${BLOCK}__cookie-title`}
title={renderText("CookieKit.MoreInfo", selectedLocale)}
>
{locale}
</button>
))}
<a
className={`${BLOCK}__cookie-title-link`}
href={cookieDefn.url}
target="_blank"
rel="noopener noreferrer"
>
{renderText(cookieDefn.localeKey, selectedLocale)}
</a>
</div>
</div>
</div>
)}
{ isCountrySelectShown && (
<div className={`${BLOCK}__country-picker-select`}>
{ countryCodes.map(cCode => (
<button
type="button"
key={`country-flag-${cCode}`}
className={`xb-cookie-kit__button ${BLOCK}__country-picker-button`}
onClick={() => this.handleCountryChange(cCode)}
title={cCode}
>
<div className={`${BLOCK}__flag`}>
<ReactCountryFlag code={cCode} svg />
</div>
</button>
))}
))}
</div>
{ cookieDefns.length > 1 && (
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__check-all`}
onClick={this.handleCheckAll}
>
{isAllChecked
? renderText("CookieKit.UncheckButton", selectedLocale)
: renderText("CookieKit.CheckAllButton", selectedLocale)}
</button>
)}
{ displayFingerprint && (
<div className={`${BLOCK}__fingerprint`}>
<div className={`${BLOCK}__fingerprint-checkbox`}>
<input
id="xbCheckbox_fingerprint"
type="checkbox"
checked={fingerprintConsent}
onChange={this.handleFingerprintCheck}
/>
<label
htmlFor="xbCheckbox_fingerprint"
className={`${BLOCK}__checkbox`}
/>
</div>
)}
</div>
</div>
<div className={`${BLOCK}__cookie-list`}>
{ cookieDefns.map(cookieDefn => (
<div key={cookieDefn.type} className={`${BLOCK}__cookie`}>
<div className={`${BLOCK}__block ${BLOCK}__block--lg`}>
<div>
<input
id={`xbCheckbox_${cookieDefn.id}`}
type="checkbox"
checked={consentSettings[cookieDefn.type]}
onChange={e => this.handleCookieCheck(e, cookieDefn.type)}
/>
<label
htmlFor={`xbCheckbox_${cookieDefn.id}`}
className={`${BLOCK}__checkbox`}
/>
</div>
<div
className={`${BLOCK}__cookie-title`}
title={renderText("CookieKit.MoreInfo", selectedLocale)}
<div className={`${BLOCK}__fingerprint-label`}>
{renderText("CookieKit.FingerprintLabel", selectedLocale)}
</div>
</div>
)}
<div className={`${BLOCK}__actions`}>
{ !hideBrandTag && (
<div className={`${BLOCK}__privacy-partner-container`}>
<a
className={`${BLOCK}__privacy-partner-link`}
href={links.poweredBy}
target="_blank"
rel="noopener noreferrer"
>
<a
className={`${BLOCK}__cookie-title-link`}
href={cookieDefn.url}
target="_blank"
rel="noopener noreferrer"
>
{renderText(cookieDefn.localeKey, selectedLocale)}
</a>
</div>
<div className={`${BLOCK}__privacy-partner`}>
{renderText("CookieKit.PoweredByText", selectedLocale)}
<img
className={`${BLOCK}__privacy-partner-logo`}
src={xbLogo}
alt="XcooBee logo"
/>
</div>
</a>
</div>
)}
<div className={`${BLOCK}__button-container`}>
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__button`}
onClick={this.handleSubmit}
>
{renderText("CookieKit.OkButton", selectedLocale)}
</button>
</div>
))}
</div>
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__check-all`}
onClick={this.handleCheckAll}
>
{isAllChecked
? renderText("CookieKit.UncheckButton", selectedLocale)
: renderText("CookieKit.CheckAllButton", selectedLocale)}
</button>
{ displayFingerprint && (
<div className={`${BLOCK}__fingerprint`}>
<div className={`${BLOCK}__fingerprint-checkbox`}>
<input
id="xbCheckbox_fingerprint"
type="checkbox"
checked={fingerprintConsent}
onChange={this.handleFingerprintCheck}
/>
<label
htmlFor="xbCheckbox_fingerprint"
className={`${BLOCK}__checkbox`}
/>
</div>
<div className={`${BLOCK}__fingerprint-label`}>
{renderText("CookieKit.FingerprintLabel", selectedLocale)}
</div>
</div>
)}
<div className={`${BLOCK}__actions`}>
<div className={`${BLOCK}__links`}>
{ isConnected && (appearsToBeLoggedIn
? (
<a
className={`${BLOCK}__link`}
href={`${xbOrigin}${links.manage}`}
target="_blank"
rel="noopener noreferrer"
>
{renderText("CookieKit.ManageLink", selectedLocale)}
</a>
)
: (
<button
className={`xb-cookie-kit__button ${BLOCK}__link`}
type="button"
onClick={() => window.open(`${xbOrigin}${links.login}?targetUrl=${targetUrl}`, "", loginModalFeatures)}
>
{renderText("CookieKit.LoginLink", selectedLocale)}
</button>
)
)}
<a
className={`${BLOCK}__link`}
href={privacyUrl}
target="_blank"
rel="noopener noreferrer"
>
{renderText("CookieKit.PolicyLink", selectedLocale)}
</a>
<a
className={`${BLOCK}__link`}
href={termsUrl}
target="_blank"
rel="noopener noreferrer"
>
{renderText("CookieKit.TermsLink", selectedLocale)}
</a>
</div>
{ !hideBrandTag && (
<div className={`${BLOCK}__privacy-partner-container`}>
<div className={`${BLOCK}__powered-by`}>
Powered by
<a
className={`${BLOCK}__privacy-partner-link`}
className={`${BLOCK}__powered-by-link`}
href={links.poweredBy}

@@ -404,78 +493,253 @@ target="_blank"

>
<div className={`${BLOCK}__privacy-partner`}>
{renderText("CookieKit.PoweredByText", selectedLocale)}
<img
className={`${BLOCK}__privacy-partner-logo`}
src={xbLogo}
alt="XcooBee logo"
/>
</div>
XcooBee
</a>
</div>
)}
<div className={`${BLOCK}__button-container`}>
</div>
);
} else {
layout = (
<div
className={BLOCK}
onClick={() => this.setState({ isCountrySelectShown: false, isLocaleSelectShown: false })}
>
<div className={`${BLOCK}__content`}>
<div className={`${BLOCK}__text`}>
{ typeof textMessage === "string"
? textMessage : this.renderTextMessage(textMessage) }
</div>
<div className={`${BLOCK}__main`}>
<div className={`${BLOCK}__links-container`}>
<div className={`${BLOCK}__links`}>
<a
className={`${BLOCK}__link`}
href={privacyUrl}
target="_blank"
rel="noopener noreferrer"
>
{renderText("CookieKit.PolicyLink", selectedLocale)}
</a>
<a
className={`${BLOCK}__link`}
href={termsUrl}
target="_blank"
rel="noopener noreferrer"
>
{renderText("CookieKit.TermsLink", selectedLocale)}
</a>
</div>
<div className={`${BLOCK}__login-container`}>
{ !hideBrandTag ? (
<div className={`${BLOCK}__powered-by-container`}>
<div className={`${BLOCK}__powered-by`}>
Powered by
<a
className={`${BLOCK}__powered-by-link`}
href={links.poweredBy}
target="_blank"
rel="noopener noreferrer"
>
XcooBee
</a>
</div>
</div>
) : <div />}
{ isConnected && (appearsToBeLoggedIn
? (
<a
className={`${BLOCK}__link`}
href={`${xbOrigin}${links.manage}`}
target="_blank"
rel="noopener noreferrer"
>
{renderText("CookieKit.ManageLink", selectedLocale)}
</a>
) : (
<div className={`${BLOCK}__login-button`}>
<button
className={`xb-cookie-kit__button ${BLOCK}__link`}
type="button"
onClick={() => window.open(`${xbOrigin}${links.login}?targetUrl=${targetUrl}`, "", loginModalFeatures)}
>
{renderText("CookieKit.LoginLink", selectedLocale)}
</button>
</div>
)
)}
</div>
</div>
<div className={`${BLOCK}__cookie-container`}>
<div className={`${BLOCK}__cookie-list`}>
{ cookieDefns.map(cookieDefn => (
<div key={cookieDefn.type} className={`${BLOCK}__cookie`}>
<div className={`${BLOCK}__checkbox-container`}>
<input
id={`xbCheckbox_${cookieDefn.id}`}
type="checkbox"
checked={consentSettings[cookieDefn.type]}
onChange={e => this.handleCookieCheck(e, cookieDefn.type)}
/>
<label
htmlFor={`xbCheckbox_${cookieDefn.id}`}
className={`${BLOCK}__checkbox`}
/>
</div>
<div
className={`${BLOCK}__cookie-title`}
title={renderText("CookieKit.MoreInfo", selectedLocale)}
>
<a
className={`${BLOCK}__cookie-title-link`}
href={cookieDefn.url}
target="_blank"
rel="noopener noreferrer"
>
{renderText(cookieDefn.localeKey, selectedLocale)}
</a>
</div>
</div>
))}
</div>
{ cookieDefns.length > 1 && (
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__check-all`}
onClick={this.handleCheckAll}
>
{isAllChecked
? renderText("CookieKit.UncheckButton", selectedLocale)
: renderText("CookieKit.CheckAllButton", selectedLocale)}
</button>
)}
</div>
{ displayFingerprint && (
<div className={`${BLOCK}__fingerprint`}>
<div className={`${BLOCK}__fingerprint-checkbox`}>
<input
id="xbCheckbox_fingerprint"
type="checkbox"
checked={fingerprintConsent}
onChange={this.handleFingerprintCheck}
/>
<label
htmlFor="xbCheckbox_fingerprint"
className={`${BLOCK}__checkbox`}
/>
</div>
<div className={`${BLOCK}__fingerprint-label`}>
{renderText("CookieKit.FingerprintLabel", selectedLocale)}
</div>
</div>
)}
<div className={`${BLOCK}__button-container`}>
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__button`}
onClick={this.handleSubmit}
>
{renderText("CookieKit.OkButton", selectedLocale)}
</button>
</div>
</div>
</div>
<div className={`${BLOCK}__actions`}>
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__button`}
onClick={this.handleSubmit}
className={`xb-cookie-kit__button ${BLOCK}__close-button`}
onClick={onClose}
>
{renderText("CookieKit.OkButton", selectedLocale)}
<img
className={`${BLOCK}__close-button-icon`}
src={closeIcon}
alt="close-icon"
/>
</button>
</div>
</div>
<div className={`${BLOCK}__links`}>
{ isConnected && (appearsToBeLoggedIn
? (
<a
className={`${BLOCK}__link`}
href={`${xbOrigin}${links.manage}`}
target="_blank"
rel="noopener noreferrer"
<div className={`${BLOCK}__language-picker-container`}>
<button
type="button"
className={`xb-cookie-kit__button ${BLOCK}__language-picker`}
onClick={this.handleLocaleSelectToggle}
>
{renderText("CookieKit.ManageLink", selectedLocale)}
</a>
)
: (
{ selectedLocale }
</button>
{ isLocaleSelectShown && (
<div className={`${BLOCK}__custom-select`}>
{ locales.map(locale => (
<button
key={locale}
className={`xb-cookie-kit__button ${BLOCK}__language-picker-button`}
type="button"
onClick={() => this.handleLocaleChange(locale)}
>
{locale}
</button>
))}
</div>
)}
</div>
<div
className={`${BLOCK}__block ${BLOCK}__block--sm ${BLOCK}__country-picker`}
title={countryCode}
>
<button
className={`xb-cookie-kit__button ${BLOCK}__link`}
type="button"
onClick={() => window.open(`${xbOrigin}${links.login}?targetUrl=${targetUrl}`, "", loginModalFeatures)}
className={`xb-cookie-kit__button ${BLOCK}__country-picker-button`}
onClick={this.handleCountrySelectToggle}
>
{renderText("CookieKit.LoginLink", selectedLocale)}
<div className={`${BLOCK}__flag`}>
<ReactCountryFlag code={countryCode} svg />
</div>
</button>
)
)}
<a
className={`${BLOCK}__link`}
href={privacyUrl}
target="_blank"
rel="noopener noreferrer"
>
{renderText("CookieKit.PolicyLink", selectedLocale)}
</a>
<a
className={`${BLOCK}__link`}
href={termsUrl}
target="_blank"
rel="noopener noreferrer"
>
{renderText("CookieKit.TermsLink", selectedLocale)}
</a>
{ isCountrySelectShown && (
<div className={`${BLOCK}__country-picker-container`}>
<button
type="button"
className="xb-cookie-kit__button"
onClick={e => this.handleScroll(e, "up")}
>
<img
src={caretUp}
alt="caret-up"
/>
</button>
<div
ref={(countryPicker) => {
this.countryPicker = countryPicker;
}}
className={`${BLOCK}__country-picker-select`}
>
{ countryCodes.map(cCode => (
<button
type="button"
key={`country-flag-${cCode}`}
className={`xb-cookie-kit__button ${BLOCK}__country-picker-button`}
onClick={() => this.handleCountryChange(cCode)}
title={cCode}
>
<div className={`${BLOCK}__flag`}>
<ReactCountryFlag code={cCode} svg />
</div>
</button>
))}
</div>
<button
type="button"
className="xb-cookie-kit__button"
onClick={e => this.handleScroll(e, "bottom")}
>
<img
src={caretDown}
alt="caret-down"
/>
</button>
</div>
)}
</div>
</div>
</div>
{ !hideBrandTag && (
<div className={`${BLOCK}__powered-by`}>
Powered by
<a
className={`${BLOCK}__powered-by-link`}
href={links.poweredBy}
target="_blank"
rel="noopener noreferrer"
>
XcooBee
</a>
</div>
)}
</div>
);
);
}
return layout;
}
}
dist/xck-react.css
src/xck-react.scss
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

About

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc