react-cookie-kit - npm Package Compare versions

Comparing version 1.0.17 to 1.0.18

dist/CookieKit.js

@@ -118,3 +118,3 @@ 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); }
 
-    _defineProperty(_assertThisInitialized(_this), "handlePopupSubmit", function (nextConsentSettings, fingerprintConsent) {
+    _defineProperty(_assertThisInitialized(_this), "handlePopupSubmit", function (nextConsentSettings, doNotSellConsent, fingerprintConsent) {
       // console.log("CookieKit#handlePopupSubmit");
@@ -125,3 +125,3 @@ // console.dir(nextConsentSettings);
           onCookieConsentsChange = _this$props2.onCookieConsentsChange;
-      onCookieConsentsChange(nextConsentSettings, fingerprintConsent);
+      onCookieConsentsChange(nextConsentSettings, doNotSellConsent, fingerprintConsent);
 
@@ -292,3 +292,5 @@ _this.clearTimers();
           cookieConsents = _this$props4.cookieConsents,
+          doNotSellConsent = _this$props4.doNotSellConsent,
           display = _this$props4.display,
+          displayDoNotSell = _this$props4.displayDoNotSell,
           displayFingerprint = _this$props4.displayFingerprint,
@@ -315,5 +317,3 @@ fingerprintConsent = _this$props4.fingerprintConsent,
       var renderPopup = isOpen || consentsSource === "unknown" && !hasClosed;
-      var renderButton = !renderPopup;
-      var cache = cookieConsentsCache.get();
-      var renderResetButton = theme === "popup" && testMode && cache.cookieConsents;
+      var renderResetButton = testMode;
       return isShown && React.createElement("div", {
@@ -327,6 +327,8 @@ className: cx(BLOCK, position, {
         })
-      }, renderPopup && React.createElement(CookieKitPopup, {
+      }, renderPopup ? React.createElement(CookieKitPopup, {
         companyLogo: companyLogo,
         cookieConsents: cookieConsents,
+        displayDoNotSell: displayDoNotSell,
         displayFingerprint: displayFingerprint,
+        doNotSellConsent: doNotSellConsent,
         fingerprintConsent: fingerprintConsent,
@@ -344,3 +346,3 @@ hideBrandTag: hideBrandTag,
         theme: theme
-      }), renderButton && React.createElement("button", {
+      }) : React.createElement("button", {
         type: "button",
@@ -365,3 +367,5 @@ className: "".concat(BLOCK, "__button ").concat(BLOCK, "__cookie-button"),
   display: PropTypes.bool,
+  displayDoNotSell: PropTypes.bool,
   displayFingerprint: PropTypes.bool,
+  doNotSellConsent: PropTypes.bool,
   expirationTime: PropTypes.number,
@@ -393,3 +397,5 @@ fingerprintConsent: PropTypes.bool,
   display: true,
+  displayDoNotSell: false,
   displayFingerprint: false,
+  doNotSellConsent: false,
   expirationTime: 0,
@@ -396,0 +402,0 @@ fingerprintConsent: false,

dist/CookieKitContainer.js

@@ -29,14 +29,14 @@ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
 
+import fetch from "isomorphic-fetch";
 import PropTypes from "prop-types";
 import React from "react";
-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";
+import { countryCodes } from "xcoobee-cookie-kit-core/src/countryData";
+import CookieManager from "xcoobee-cookie-kit-core/src/CookieManager";
 import { getCountryCode, saveCountryCode, fetchCountryCode, fetchCountryCodeForSubscribers } from "xcoobee-cookie-kit-core/src/LocaleManager";
-import CookieManager from "xcoobee-cookie-kit-core/src/CookieManager";
 import NotAuthorizedError from "xcoobee-cookie-kit-core/src/NotAuthorizedError";
-import { countryCodes } from "xcoobee-cookie-kit-core/src/countryData";
 import { xckDomain } from "./configs";
+import BridgeCommunicator from "./BridgeCommunicator";
 import CookieKit from "./CookieKit";
-import BridgeCommunicator from "./BridgeCommunicator";
 var COMPLETE = consentStatuses.complete;
@@ -141,3 +141,3 @@ var OPEN = consentStatuses.open;
 
-    _defineProperty(_assertThisInitialized(_this), "handleCookieConsentsChange", function (consentSettings, fingerprintConsent) {
+    _defineProperty(_assertThisInitialized(_this), "handleCookieConsentsChange", function (consentSettings, doNotSellConsent, fingerprintConsent) {
       // console.log("CookieKitContainer#handleCookieConsentsChange");
@@ -154,2 +154,6 @@ var _this$state = _this.state,
       cookieConsents.push({
+        type: "donotsell",
+        checked: doNotSellConsent
+      });
+      cookieConsents.push({
         type: "fingerprint",
@@ -410,2 +414,6 @@ checked: fingerprintConsent
       hostsDefaultCookieConsents.push({
+        type: "donotsell",
+        checked: false
+      });
+      hostsDefaultCookieConsents.push({
         type: "fingerprint",
@@ -436,3 +444,6 @@ checked: false
           cookieHandler = _this$props3.cookieHandler,
-          targetUrl = _this$props3.targetUrl;
+          targetUrl = _this$props3.targetUrl; // type ConsentSettings = {
+      //   [ConsentType]: bool,
+      // }
+
       var consentSettings = {};
@@ -467,2 +478,3 @@ cookieConsents.forEach(function (cookieConsent) {
           companyLogo = _this$props4.companyLogo,
+          displayDoNotSell = _this$props4.displayDoNotSell,
           displayFingerprint = _this$props4.displayFingerprint,
@@ -492,7 +504,11 @@ expirationTime = _this$props4.expirationTime,
       var cookies = cookieConsents ? cookieConsents.filter(function (consent) {
-        return consent.type !== "fingerprint";
+        return consent.type !== "fingerprint" && consent.type !== "donotsell";
       }) : null;
+      var donotsell = cookieConsents ? cookieConsents.find(function (consent) {
+        return consent.type === "donotsell";
+      }) : null;
       var fingerprint = cookieConsents ? cookieConsents.find(function (consent) {
         return consent.type === "fingerprint";
       }) : null;
+      var doNotSellConsent = donotsell ? donotsell.checked : false;
       var fingerprintConsent = fingerprint ? fingerprint.checked : false; // console.log("initializing:", initializing);
@@ -508,3 +524,5 @@
         display: display,
+        displayDoNotSell: displayDoNotSell,
         displayFingerprint: displayFingerprint,
+        doNotSellConsent: doNotSellConsent,
         expirationTime: expirationTime,
@@ -548,2 +566,3 @@ fingerprintConsent: fingerprintConsent,
   detectCountry: PropTypes.bool,
+  displayDoNotSell: PropTypes.bool,
   displayFingerprint: PropTypes.bool,
@@ -578,2 +597,3 @@ displayOnlyForEU: PropTypes.bool,
   detectCountry: false,
+  displayDoNotSell: false,
   displayFingerprint: false,
@@ -580,0 +600,0 @@ displayOnlyForEU: false,

dist/CookieKitPopup.js

 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 _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
+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"); } }
@@ -149,2 +151,9 @@
 
+    _defineProperty(_assertThisInitialized(_this), "handleDoNotSellCheck", function (e) {
+      // console.log('CookieKitPopup#handleDoNotSellCheck');
+      _this.setState({
+        doNotSellConsent: e.target.checked
+      });
+    });
+
     _defineProperty(_assertThisInitialized(_this), "handleFingerprintCheck", function (e) {
@@ -162,4 +171,5 @@ // console.log('CookieKitPopup#handleFingerprintCheck');
           consentSettings = _this$state.consentSettings,
+          doNotSellConsent = _this$state.doNotSellConsent,
           fingerprintConsent = _this$state.fingerprintConsent;
-      onSubmit(consentSettings, fingerprintConsent);
+      onSubmit(consentSettings, doNotSellConsent, fingerprintConsent);
     });
@@ -181,2 +191,3 @@
         _fingerprintConsent = _this$props.fingerprintConsent,
+        _doNotSellConsent = _this$props.doNotSellConsent,
         requestDataTypes = _this$props.requestDataTypes;
@@ -192,2 +203,3 @@ var _consentSettings = {};
       countryCode: getCountryCode() || "EU",
+      doNotSellConsent: _doNotSellConsent,
       fingerprintConsent: _fingerprintConsent,
@@ -240,2 +252,3 @@ isCountrySelectShown: false,
           displayFingerprint = _this$props2.displayFingerprint,
+          displayDoNotSell = _this$props2.displayDoNotSell,
           hideBrandTag = _this$props2.hideBrandTag,
@@ -253,2 +266,3 @@ loginStatus = _this$props2.loginStatus,
           countryCode = _this$state2.countryCode,
+          doNotSellConsent = _this$state2.doNotSellConsent,
           fingerprintConsent = _this$state2.fingerprintConsent,
@@ -272,3 +286,5 @@ isCountrySelectShown = _this$state2.isCountrySelectShown,
       if (theme === "popup") {
-        layout = React.createElement("div", {
+        layout = // 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,
@@ -280,3 +296,5 @@ onClick: function onClick() {
             });
-          }
+          },
+          role: "dialog",
+          tabIndex: "-1"
         }, React.createElement("div", {
@@ -383,6 +401,8 @@ className: "".concat(BLOCK, "__header")
           onClick: this.handleCheckAll
-        }, isAllChecked ? renderText("CookieKit.UncheckButton", selectedLocale) : renderText("CookieKit.CheckAllButton", selectedLocale)), displayFingerprint && React.createElement("div", {
-          className: "".concat(BLOCK, "__fingerprint")
+        }, isAllChecked ? renderText("CookieKit.UncheckButton", selectedLocale) : renderText("CookieKit.CheckAllButton", selectedLocale)), displayFingerprint || displayDoNotSell ? React.createElement("div", {
+          className: "".concat(BLOCK, "__consents-container")
+        }, displayFingerprint && React.createElement("div", {
+          className: "".concat(BLOCK, "__consent ").concat(BLOCK, "__consent--fingerprint")
         }, React.createElement("div", {
-          className: "".concat(BLOCK, "__fingerprint-checkbox")
+          className: "".concat(BLOCK, "__consent-checkbox")
         }, React.createElement("input", {
@@ -397,4 +417,30 @@ id: "xbCheckbox_fingerprint",
         })), React.createElement("div", {
-          className: "".concat(BLOCK, "__fingerprint-label")
-        }, renderText("CookieKit.FingerprintLabel", selectedLocale))), React.createElement("div", {
+          className: "".concat(BLOCK, "__consent-label"),
+          title: renderText("CookieKit.MoreInfo", selectedLocale)
+        }, React.createElement("a", {
+          className: "".concat(BLOCK, "__consent-label-link"),
+          href: links.fingerprinting,
+          target: "_blank",
+          rel: "noopener noreferrer"
+        }, renderText("CookieKit.FingerprintLabel", selectedLocale)))), displayDoNotSell && React.createElement("div", {
+          className: "".concat(BLOCK, "__consent ").concat(BLOCK, "__consent--donotsell")
+        }, React.createElement("div", {
+          className: "".concat(BLOCK, "__consent-checkbox")
+        }, React.createElement("input", {
+          id: "xbCheckbox_donotsell",
+          type: "checkbox",
+          checked: doNotSellConsent,
+          onChange: this.handleDoNotSellCheck
+        }), React.createElement("label", {
+          htmlFor: "xbCheckbox_donotsell",
+          className: "".concat(BLOCK, "__checkbox")
+        })), React.createElement("div", {
+          className: "".concat(BLOCK, "__consent-label"),
+          title: renderText("CookieKit.MoreInfo", selectedLocale)
+        }, React.createElement("a", {
+          className: "".concat(BLOCK, "__consent-label-link"),
+          href: links.donotsell,
+          target: "_blank",
+          rel: "noopener noreferrer"
+        }, renderText("CookieKit.DoNotSellLabel", selectedLocale))))) : null, React.createElement("div", {
           className: "".concat(BLOCK, "__actions")
@@ -452,3 +498,5 @@ }, !hideBrandTag && React.createElement("div", {
       } else {
-        layout = React.createElement("div", {
+        layout = // 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,
@@ -460,3 +508,5 @@ onClick: function onClick() {
             });
-          }
+          },
+          role: "dialog",
+          tabIndex: "-1"
         }, React.createElement("div", {
@@ -507,2 +557,4 @@ className: "".concat(BLOCK, "__content")
         }, renderText("CookieKit.LoginLink", selectedLocale)))))), React.createElement("div", {
+          className: "".concat(BLOCK, "__consents-container")
+        }, React.createElement("div", {
           className: "".concat(BLOCK, "__cookie-container")
@@ -553,4 +605,28 @@ }, React.createElement("div", {
         })), React.createElement("div", {
-          className: "".concat(BLOCK, "__fingerprint-label")
-        }, renderText("CookieKit.FingerprintLabel", selectedLocale))), React.createElement("div", {
+          className: "".concat(BLOCK, "__consent-label")
+        }, React.createElement("a", {
+          className: "".concat(BLOCK, "__consent-label-link"),
+          href: links.donotsell,
+          target: "_blank",
+          rel: "noopener noreferrer"
+        }, renderText("CookieKit.FingerprintLabel", selectedLocale)))), displayDoNotSell && React.createElement("div", {
+          className: "".concat(BLOCK, "__donotsell")
+        }, React.createElement("div", {
+          className: "".concat(BLOCK, "__donotsell-checkbox")
+        }, React.createElement("input", {
+          id: "xbCheckbox_donotsell",
+          type: "checkbox",
+          checked: doNotSellConsent,
+          onChange: this.handleDoNotSellCheck
+        }), React.createElement("label", {
+          htmlFor: "xbCheckbox_donotsell",
+          className: "".concat(BLOCK, "__checkbox")
+        })), React.createElement("div", {
+          className: "".concat(BLOCK, "__consent-label")
+        }, React.createElement("a", {
+          className: "".concat(BLOCK, "__consent-label-link"),
+          href: links.donotsell,
+          target: "_blank",
+          rel: "noopener noreferrer"
+        }, renderText("CookieKit.DoNotSellLabel", selectedLocale))))), React.createElement("div", {
           className: "".concat(BLOCK, "__button-container")
@@ -653,3 +729,5 @@ }, React.createElement("button", {
   cookieConsents: PropTypes.arrayOf(CookieConsentShape.isRequired).isRequired,
+  displayDoNotSell: PropTypes.bool,
   displayFingerprint: PropTypes.bool,
+  doNotSellConsent: PropTypes.bool,
   fingerprintConsent: PropTypes.bool,
@@ -676,3 +754,5 @@ hideBrandTag: PropTypes.bool.isRequired,
   companyLogo: null,
+  displayDoNotSell: false,
   displayFingerprint: false,
+  doNotSellConsent: false,
   fingerprintConsent: false,
@@ -679,0 +759,0 @@ loginStatus: false,

package.json

 {
   "name": "react-cookie-kit",
-  "version": "1.0.17",
+  "version": "1.0.18",
   "description": "GDPR / CCPA Easy Cookie and Fingerprint Consent Management for Websites.",
@@ -24,12 +24,10 @@ "keywords": [
   "main": "dist/index.js",
-  "scripts": {
-    "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/",
-    "clear": "node scripts/clear.js",
-    "lint": "eslint src",
-    "solanobuild": "echo 'what should this be?'",
-    "test": "node scripts/test-not-implemented.js"
+  "bugs": {
+    "url": "https://github.com/XcooBee/xcoobee-cookie-kit/issues"
   },
+  "homepage": "https://www.xcoobee.com",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/XcooBee/xcoobee-cookie-kit.git"
+  },
   "dependencies": {
@@ -40,18 +38,18 @@ "classnames": "^2.2.6",
     "react-country-flag": "^1.0.1",
-    "xcoobee-cookie-kit-core": "^1.0.16"
+    "xcoobee-cookie-kit-core": "^1.0.18"
   },
   "devDependencies": {
     "@babel/cli": "^7.2.3",
-    "@babel/core": "^7.2.2",
-    "@babel/plugin-proposal-class-properties": "^7.2.3",
+    "@babel/core": "^7.7.2",
+    "@babel/plugin-proposal-class-properties": "^7.7.0",
     "@babel/plugin-transform-react-inline-elements": "^7.2.0",
-    "@babel/preset-env": "^7.2.3",
-    "@babel/preset-react": "^7.0.0",
-    "babel-eslint": "^10.0.1",
+    "@babel/preset-env": "^7.7.1",
+    "@babel/preset-react": "^7.7.0",
+    "babel-eslint": "^10.0.3",
     "babel-plugin-tailcall-optimization": "^2.0.0",
-    "babel-plugin-transform-imports": "^1.5.1",
-    "babel-plugin-transform-react-remove-prop-types": "^0.4.21",
+    "babel-plugin-transform-imports": "^2.0.0",
+    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "eslint": "^5.11.1",
     "eslint-config-airbnb": "^17.1.0",
-    "eslint-plugin-babel": "^5.2.1",
+    "eslint-plugin-babel": "^5.3.0",
     "eslint-plugin-import": "^2.14.0",
@@ -67,10 +65,11 @@ "eslint-plugin-jsx-a11y": "^6.1.2",
   },
-  "bugs": {
-    "url": "https://github.com/XcooBee/xcoobee-cookie-kit/issues"
-  },
-  "homepage": "https://www.xcoobee.com",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/XcooBee/xcoobee-cookie-kit.git"
+  "scripts": {
+    "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/",
+    "clear": "node scripts/clear.js",
+    "lint": "eslint src",
+    "test": "node scripts/test-not-implemented.js"
   }
 }

README.md

@@ -1,3 +0,4 @@
-# React Cookie Kit 
+# React Cookie Kit
 
+
 ## Download and use
@@ -11,5 +12,6 @@
 
-The React Cookie Kit is special purpose build of the [XcooBee Cookie Kit (XCK)](https://www.npmjs.com/package/xcoobee-cookie-kit-web) Cookie Consent Management library for use in ReactJS environments. 
+The React Cookie Kit is special purpose build of the [XcooBee Cookie Kit (XCK)](https://www.npmjs.com/package/xcoobee-cookie-kit-web) Cookie Consent Management library for use in ReactJS environments.
 The React Cookie Kit is not just an information overlay. It is an active cookie and consent manager for your site. Most current cookie GDPR notices for websites are just that: Overlays that display information but do not actively manage cookie creation and life-cycles. You are still responsible for handling cookies and fingerprinting correctly. In contrast to this, the react cookie kit is a true cookie-consent and life-cycle manager. It will help you implement the premises of the GDPR and European e-directive correctly.
 
+
 ## Video
@@ -16,0 +18,0 @@

src/CookieKit.js

@@ -51,3 +51,5 @@ import cx from "classnames";
     display: PropTypes.bool,
+    displayDoNotSell: PropTypes.bool,
     displayFingerprint: PropTypes.bool,
+    doNotSellConsent: PropTypes.bool,
     expirationTime: PropTypes.number,
@@ -84,3 +86,5 @@ fingerprintConsent: PropTypes.bool,
     display: true,
+    displayDoNotSell: false,
     displayFingerprint: false,
+    doNotSellConsent: false,
     expirationTime: 0,
@@ -185,3 +189,3 @@ fingerprintConsent: false,
 
-  handlePopupSubmit = (nextConsentSettings, fingerprintConsent) => {
+  handlePopupSubmit = (nextConsentSettings, doNotSellConsent, fingerprintConsent) => {
     // console.log("CookieKit#handlePopupSubmit");
@@ -194,3 +198,3 @@ // console.dir(nextConsentSettings);
 
-    onCookieConsentsChange(nextConsentSettings, fingerprintConsent);
+    onCookieConsentsChange(nextConsentSettings, doNotSellConsent, fingerprintConsent);
 
@@ -271,3 +275,5 @@ this.clearTimers();
       cookieConsents,
+      doNotSellConsent,
       display,
+      displayDoNotSell,
       displayFingerprint,
@@ -291,6 +297,4 @@ fingerprintConsent,
     const renderPopup = isOpen || (consentsSource === "unknown" && !hasClosed);
-    const renderButton = !renderPopup;
 
-    const cache = cookieConsentsCache.get();
-    const renderResetButton = theme === "popup" && testMode && cache.cookieConsents;
+    const renderResetButton = testMode;
 
@@ -316,40 +320,43 @@ return (
         >
-          {renderPopup && (
-            <CookieKitPopup
-              companyLogo={companyLogo}
-              cookieConsents={cookieConsents}
-              displayFingerprint={displayFingerprint}
-              fingerprintConsent={fingerprintConsent}
-              hideBrandTag={hideBrandTag}
-              loginStatus={loginStatus}
-              isConnected={!!campaignReference}
-              onClose={this.handlePopupClose}
-              onLogin={this.handlePopupLogin}
-              onSubmit={this.handlePopupSubmit}
-              privacyUrl={privacyUrl}
-              requestDataTypes={requestDataTypes}
-              termsUrl={termsUrl}
-              textMessage={textMessage}
-              theme={theme}
-            />
-          )}
-          {renderButton && (
-            <button
-              type="button"
-              className={`${BLOCK}__button ${BLOCK}__cookie-button`}
-              onClick={this.handleOpen}
-            >
-              <div
-                className={
-                  cx(
-                    `${BLOCK}__cookie-icon`,
-                    `${BLOCK}__cookie-icon--${animation}`,
-                    {
-                      [`${BLOCK}__pulsing`]: pulsing,
-                    },
-                  )
-                }
+          {renderPopup
+            ? (
+              <CookieKitPopup
+                companyLogo={companyLogo}
+                cookieConsents={cookieConsents}
+                displayDoNotSell={displayDoNotSell}
+                displayFingerprint={displayFingerprint}
+                doNotSellConsent={doNotSellConsent}
+                fingerprintConsent={fingerprintConsent}
+                hideBrandTag={hideBrandTag}
+                loginStatus={loginStatus}
+                isConnected={!!campaignReference}
+                onClose={this.handlePopupClose}
+                onLogin={this.handlePopupLogin}
+                onSubmit={this.handlePopupSubmit}
+                privacyUrl={privacyUrl}
+                requestDataTypes={requestDataTypes}
+                termsUrl={termsUrl}
+                textMessage={textMessage}
+                theme={theme}
               />
-            </button>
-          )}
+            )
+            : (
+              <button
+                type="button"
+                className={`${BLOCK}__button ${BLOCK}__cookie-button`}
+                onClick={this.handleOpen}
+              >
+                <div
+                  className={
+                    cx(
+                      `${BLOCK}__cookie-icon`,
+                      `${BLOCK}__cookie-icon--${animation}`,
+                      {
+                        [`${BLOCK}__pulsing`]: pulsing,
+                      },
+                    )
+                  }
+                />
+              </button>
+            )}
           {renderResetButton && (<ResetButton />)}
@@ -356,0 +363,0 @@ </div>

src/CookieKitContainer.js

@@ -0,4 +1,4 @@
+import fetch from "isomorphic-fetch";
 import PropTypes from "prop-types";
 import React from "react";
-import fetch from "isomorphic-fetch";
 
@@ -16,2 +16,5 @@ import {
 import cookieConsentsCache from "xcoobee-cookie-kit-core/src/cookieConsentsCache";
+import { countryCodes } from "xcoobee-cookie-kit-core/src/countryData";
+
+import CookieManager from "xcoobee-cookie-kit-core/src/CookieManager";
 import {
@@ -23,10 +26,8 @@ getCountryCode,
 } from "xcoobee-cookie-kit-core/src/LocaleManager";
-import CookieManager from "xcoobee-cookie-kit-core/src/CookieManager";
 import NotAuthorizedError from "xcoobee-cookie-kit-core/src/NotAuthorizedError";
-import { countryCodes } from "xcoobee-cookie-kit-core/src/countryData";
 
 import { xckDomain } from "./configs";
 
+import BridgeCommunicator from "./BridgeCommunicator";
 import CookieKit from "./CookieKit";
-import BridgeCommunicator from "./BridgeCommunicator";
 
@@ -109,2 +110,3 @@ const COMPLETE = consentStatuses.complete;
     detectCountry: PropTypes.bool,
+    displayDoNotSell: PropTypes.bool,
     displayFingerprint: PropTypes.bool,
@@ -144,2 +146,3 @@ displayOnlyForEU: PropTypes.bool,
     detectCountry: false,
+    displayDoNotSell: false,
     displayFingerprint: false,
@@ -168,3 +171,5 @@ displayOnlyForEU: false,
       countryCode: getCountryCode(),
-      defaultCountryCode: countryCodes.includes(props.defaultCountryCode) ? props.defaultCountryCode : DEFAULT_COUNTRY_CODE,
+      defaultCountryCode: countryCodes.includes(props.defaultCountryCode)
+        ? props.defaultCountryCode
+        : DEFAULT_COUNTRY_CODE,
       display: true,
@@ -308,3 +313,3 @@ initializing: true,
 
-  handleCookieConsentsChange = (consentSettings, fingerprintConsent) => {
+  handleCookieConsentsChange = (consentSettings, doNotSellConsent, fingerprintConsent) => {
     // console.log("CookieKitContainer#handleCookieConsentsChange");
@@ -317,2 +322,3 @@ const { campaignReference, loginStatus } = this.state;
     }));
+    cookieConsents.push({ type: "donotsell", checked: doNotSellConsent });
     cookieConsents.push({ type: "fingerprint", checked: fingerprintConsent });
@@ -404,2 +410,3 @@
     }));
+    hostsDefaultCookieConsents.push({ type: "donotsell", checked: false });
     hostsDefaultCookieConsents.push({ type: "fingerprint", checked: false });
@@ -422,2 +429,6 @@ // If we were unable to resolve the user's country code, then assume it is in
 
+    // type ConsentSettings = {
+    //   [ConsentType]: bool,
+    // }
+
     const consentSettings = {};
@@ -447,2 +458,3 @@ cookieConsents.forEach((cookieConsent) => {
       companyLogo,
+      displayDoNotSell,
       displayFingerprint,
@@ -476,5 +488,9 @@ expirationTime,
 
-    const cookies = cookieConsents ? cookieConsents.filter(consent => consent.type !== "fingerprint") : null;
+    const cookies = cookieConsents
+      ? cookieConsents.filter(consent => consent.type !== "fingerprint" && consent.type !== "donotsell")
+      : null;
+    const donotsell = cookieConsents ? cookieConsents.find(consent => consent.type === "donotsell") : null;
     const fingerprint = cookieConsents ? cookieConsents.find(consent => consent.type === "fingerprint") : null;
 
+    const doNotSellConsent = donotsell ? donotsell.checked : false;
     const fingerprintConsent = fingerprint ? fingerprint.checked : false;
@@ -496,3 +512,5 @@
               display={display}
+              displayDoNotSell={displayDoNotSell}
               displayFingerprint={displayFingerprint}
+              doNotSellConsent={doNotSellConsent}
               expirationTime={expirationTime}
@@ -499,0 +517,0 @@ fingerprintConsent={fingerprintConsent}

src/CookieKitPopup.js

@@ -32,3 +32,5 @@ import React from "react";
     cookieConsents: PropTypes.arrayOf(CookieConsentShape.isRequired).isRequired,
+    displayDoNotSell: PropTypes.bool,
     displayFingerprint: PropTypes.bool,
+    doNotSellConsent: PropTypes.bool,
     fingerprintConsent: PropTypes.bool,
@@ -60,3 +62,5 @@ hideBrandTag: PropTypes.bool.isRequired,
     companyLogo: null,
+    displayDoNotSell: false,
     displayFingerprint: false,
+    doNotSellConsent: false,
     fingerprintConsent: false,
@@ -71,3 +75,3 @@ loginStatus: false,
 
-    const { cookieConsents, fingerprintConsent, requestDataTypes } = this.props;
+    const { cookieConsents, fingerprintConsent, doNotSellConsent, requestDataTypes } = this.props;
     const consentSettings = {};
@@ -82,2 +86,3 @@
       countryCode: getCountryCode() || "EU",
+      doNotSellConsent,
       fingerprintConsent,
@@ -169,2 +174,7 @@ isCountrySelectShown: false,
 
+  handleDoNotSellCheck = (e) => {
+    // console.log('CookieKitPopup#handleDoNotSellCheck');
+    this.setState({ doNotSellConsent: e.target.checked });
+  };
+
   handleFingerprintCheck = (e) => {
@@ -178,5 +188,5 @@ // console.log('CookieKitPopup#handleFingerprintCheck');
     const { onSubmit } = this.props;
-    const { consentSettings, fingerprintConsent } = this.state;
+    const { consentSettings, doNotSellConsent, fingerprintConsent } = this.state;
 
-    onSubmit(consentSettings, fingerprintConsent);
+    onSubmit(consentSettings, doNotSellConsent, fingerprintConsent);
   };
@@ -219,2 +229,3 @@
       displayFingerprint,
+      displayDoNotSell,
       hideBrandTag,
@@ -233,2 +244,3 @@ loginStatus,
       countryCode,
+      doNotSellConsent,
       fingerprintConsent,
@@ -258,5 +270,9 @@ isCountrySelectShown,
       layout = (
+        // eslint-disable-next-line max-len
+        // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
         <div
           className={BLOCK}
           onClick={() => this.setState({ isCountrySelectShown: false, isLocaleSelectShown: false })}
+          role="dialog"
+          tabIndex="-1"
         >
@@ -394,21 +410,67 @@ <div className={`${BLOCK}__header`}>
           )}
-          { 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`}
-                />
+          { displayFingerprint || displayDoNotSell
+            ? (
+              <div className={`${BLOCK}__consents-container`}>
+                { displayFingerprint && (
+                  <div className={`${BLOCK}__consent ${BLOCK}__consent--fingerprint`}>
+                    <div className={`${BLOCK}__consent-checkbox`}>
+                      <input
+                        id="xbCheckbox_fingerprint"
+                        type="checkbox"
+                        checked={fingerprintConsent}
+                        onChange={this.handleFingerprintCheck}
+                      />
+                      <label
+                        htmlFor="xbCheckbox_fingerprint"
+                        className={`${BLOCK}__checkbox`}
+                      />
+                    </div>
+                    <div
+                      className={`${BLOCK}__consent-label`}
+                      title={renderText("CookieKit.MoreInfo", selectedLocale)}
+                    >
+                      <a
+                        className={`${BLOCK}__consent-label-link`}
+                        href={links.fingerprinting}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                      >
+                        {renderText("CookieKit.FingerprintLabel", selectedLocale)}
+                      </a>
+                    </div>
+                  </div>
+                )}
+                { displayDoNotSell && (
+                  <div className={`${BLOCK}__consent ${BLOCK}__consent--donotsell`}>
+                    <div className={`${BLOCK}__consent-checkbox`}>
+                      <input
+                        id="xbCheckbox_donotsell"
+                        type="checkbox"
+                        checked={doNotSellConsent}
+                        onChange={this.handleDoNotSellCheck}
+                      />
+                      <label
+                        htmlFor="xbCheckbox_donotsell"
+                        className={`${BLOCK}__checkbox`}
+                      />
+                    </div>
+                    <div
+                      className={`${BLOCK}__consent-label`}
+                      title={renderText("CookieKit.MoreInfo", selectedLocale)}
+                    >
+                      <a
+                        className={`${BLOCK}__consent-label-link`}
+                        href={links.donotsell}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                      >
+                        {renderText("CookieKit.DoNotSellLabel", selectedLocale)}
+                      </a>
+                    </div>
+                  </div>
+                )}
               </div>
-              <div className={`${BLOCK}__fingerprint-label`}>
-                {renderText("CookieKit.FingerprintLabel", selectedLocale)}
-              </div>
-            </div>
-          )}
+            )
+            : null
+          }
           <div className={`${BLOCK}__actions`}>
@@ -460,3 +522,5 @@ { !hideBrandTag && (
                   type="button"
-                  onClick={() => window.open(`${xbOrigin}${links.login}?targetUrl=${targetUrl}`, "", loginModalFeatures)}
+                  onClick={() => window.open(
+                    `${xbOrigin}${links.login}?targetUrl=${targetUrl}`, "", loginModalFeatures,
+                  )}
                 >
@@ -501,5 +565,9 @@ {renderText("CookieKit.LoginLink", selectedLocale)}
       layout = (
+        // eslint-disable-next-line max-len
+        // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
         <div
           className={BLOCK}
           onClick={() => this.setState({ isCountrySelectShown: false, isLocaleSelectShown: false })}
+          role="dialog"
+          tabIndex="-1"
         >
@@ -562,3 +630,5 @@ <div className={`${BLOCK}__content`}>
                           type="button"
-                          onClick={() => window.open(`${xbOrigin}${links.login}?targetUrl=${targetUrl}`, "", loginModalFeatures)}
+                          onClick={() => window.open(
+                            `${xbOrigin}${links.login}?targetUrl=${targetUrl}`, "", loginModalFeatures,
+                          )}
                         >
@@ -572,65 +642,100 @@ {renderText("CookieKit.LoginLink", selectedLocale)}
               </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"
+              <div className={`${BLOCK}__consents-container`}>
+                <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)}
                         >
-                          {renderText(cookieDefn.localeKey, selectedLocale)}
-                        </a>
+                          <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>
-                { 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 className={`${BLOCK}__consent-label`}>
+                      <a
+                        className={`${BLOCK}__consent-label-link`}
+                        href={links.donotsell}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                      >
+                        {renderText("CookieKit.FingerprintLabel", selectedLocale)}
+                      </a>
+                    </div>
+                  </div>
                 )}
+                { displayDoNotSell && (
+                  <div className={`${BLOCK}__donotsell`}>
+                    <div className={`${BLOCK}__donotsell-checkbox`}>
+                      <input
+                        id="xbCheckbox_donotsell"
+                        type="checkbox"
+                        checked={doNotSellConsent}
+                        onChange={this.handleDoNotSellCheck}
+                      />
+                      <label
+                        htmlFor="xbCheckbox_donotsell"
+                        className={`${BLOCK}__checkbox`}
+                      />
+                    </div>
+                    <div className={`${BLOCK}__consent-label`}>
+                      <a
+                        className={`${BLOCK}__consent-label-link`}
+                        href={links.donotsell}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                      >
+                        {renderText("CookieKit.DoNotSellLabel", selectedLocale)}
+                      </a>
+                    </div>
+                  </div>
+                )}
               </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`}>
@@ -637,0 +742,0 @@ <button

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

375510

increased by3.36%

Lines of code

4381

increased by5.8%

Number of lines in readme file

90

increased by2.27%

Dependency changes

• Updatedxcoobee-cookie-kit-core@^1.0.18