UNPKG

@stormid/cookie-banner

Version:

GDPR compliant cookie banner

3 lines (2 loc) 15.4 kB
const e=["button","a"],t=["a[href]","area[href]","input:not([disabled]):not([type=hidden])","select:not([disabled])","textarea:not([disabled])","button:not([disabled])","iframe","object","embed","[contenteditable]",'[tabindex]:not([tabindex="-1"])'],n="banner.consent",s=e=>{document.cookie=[`${e.settings.name}=${btoa(JSON.stringify({consent:e.consent}))};`,`expires=${new Date((new Date).getTime()+24*e.settings.expiry*60*60*1e3).toGMTString()};`,e.settings.path?`path=${e.settings.path};`:"",e.settings.domain?`domain=${e.settings.domain};`:"",e.settings.samesite?`SameSite=${e.settings.samesite};`:"",e.settings.secure?"secure":""].join("")},a=e=>{document.cookie.split("; ").map(e=>({name:e.split("=")[0],value:e.split("=")[1],expiry:"Thu, 01 Jan 1970 00:00:01 GMT"})).map(t=>((e,t)=>document.cookie=[`${t.name}=${t.value};`,`expires=${t.expiry};`,`path=${e.settings.path};`,e.settings.domain?`domain=${e.settings.domain};`:"",e.settings.samesite?`SameSite=${e.settings.samesite};`:"",e.settings.secure?"secure":""].join(""))(e,t))},i=e=>/radio|checkbox/i.test(e.type),r=(e,t)=>(!i(t)&&(e=>null!=e.value&&e.value.length>0)(t)&&(e=t.value),i(t)&&t.checked&&(Array.isArray(e)?e.push(t.value):e=[t.value]),e),c="ac|ad|ae|af|ag|ai|al|am|an|ao|aq|ar|as|at|au|aw|ax|az|ba|bb|be|bf|bg|bh|bi|bj|bm|bo|br|bs|bt|bv|bw|by|bz|ca|cc|cd|cf|cg|ch|ci|cl|cm|cn|co|cr|cu|cv|cw|cx|cz|de|dj|dk|dm|do|dz|ec|ee|eg|es|et|eu|fi|fm|fo|fr|ga|gb|gd|ge|gf|gg|gh|gi|gl|gm|gn|gp|gq|gr|gs|gt|gw|gy|hk|hm|hn|hr|ht|hu|id|ie|im|in|io|iq|ir|is|it|je|jo|jp|kg|ki|km|kn|kp|kr|ky|kz|la|lb|lc|li|lk|lr|ls|lt|lu|lv|ly|ma|mc|md|me|mg|mh|mk|ml|mn|mo|mp|mq|mr|ms|mt|mu|mv|mw|mx|my|na|nc|ne|nf|ng|nl|no|nr|nu|nz|om|pa|pe|pf|ph|pk|pl|pm|pn|pr|ps|pt|pw|py|qa|re|ro|rs|ru|rw|sa|sb|sc|sd|se|sg|sh|si|sj|sk|sl|sm|sn|so|sr|st|su|sv|sx|sy|sz|tc|td|tf|tg|th|tj|tk|tl|tm|tn|to|tp|tr|tt|tv|tw|tz|ua|ug|uk|us|uy|uz|va|vc|ve|vg|vi|vn|vu|wf|ws|yt".split("|"),o="netlify|azurewebsites|com|edu|gov|net|mil|org|nom|sch|caa|res|off|gob|int|tur|ip6|uri|urn|asn|act|nsw|qld|tas|vic|pro|biz|adm|adv|agr|arq|art|ato|bio|bmd|cim|cng|cnt|ecn|eco|emp|eng|esp|etc|eti|far|fnd|fot|fst|g12|ggf|imb|ind|inf|jor|jus|leg|lel|mat|med|mus|not|ntr|odo|ppg|psc|psi|qsl|rec|slg|srv|teo|tmp|trd|vet|zlg|web|ltd|sld|pol|fin|k12|lib|pri|aip|fie|eun|sci|prd|cci|pvt|mod|idv|rel|sex|gen|nic|abr|bas|cal|cam|emr|fvg|laz|lig|lom|mar|mol|pmn|pug|sar|sic|taa|tos|umb|vao|vda|ven|mie|北海道|和歌山|神奈川|鹿児島|ass|rep|tra|per|ngo|soc|grp|plc|its|air|and|bus|can|ddr|jfk|mad|nrw|nyc|ski|spy|tcm|ulm|usa|war|fhs|vgs|dep|eid|fet|fla|flå|gol|hof|hol|sel|vik|cri|iwi|ing|abo|fam|gok|gon|gop|gos|aid|atm|gsm|sos|elk|waw|est|aca|bar|cpa|jur|law|sec|plo|www|bir|cbg|jar|khv|msk|nov|nsk|ptz|rnd|spb|stv|tom|tsk|udm|vrn|cmw|kms|nkz|snz|pub|fhv|red|ens|nat|rns|rnu|bbs|tel|bel|kep|nhs|dni|fed|isa|nsn|gub|e12|tec|орг|обр|упр|alt|nis|jpn|mex|ath|iki|nid|gda|inc".split("|"),l=e=>[].slice.call(e.querySelectorAll(t.join(","))).filter(e=>e.offsetWidth>0||e.offsetHeight>0),d=(e,t)=>()=>{const n=new CustomEvent(e,{bubbles:!0,detail:{getState:t.getState}});window.document.dispatchEvent(n)},p=()=>{[].slice.call(document.querySelectorAll("[data-iframe-src]")).forEach(e=>{const t=document.createElement("iframe");t.src=e.getAttribute("data-iframe-src"),e.hasAttribute("data-iframe-height")&&(t.style.height=e.getAttribute("data-iframe-height")),t.setAttribute("title",e.getAttribute("data-iframe-title")||"iFrame embed"),e.hasAttribute("data-iframe-width")&&(t.style.width=e.getAttribute("data-iframe-width")),t.setAttribute("tabindex","0"),t.setAttribute("frameborder","0"),t.setAttribute("webkitallowfullscreen","webkitallowfullscreen"),t.setAttribute("mozallowfullscreen","mozallowfullscreen"),t.setAttribute("allowfullscreen","allowfullscreen"),e.parentNode.appendChild(t),e.parentNode.removeChild(e)})},m=e=>{!function(e,t,n,s,a){e[s]=e[s]||[],e[s].push({"gtm.start":(new Date).getTime(),event:"gtm.js"});var i=t.getElementsByTagName(n)[0],r=t.createElement(n);r.async=!0,r.src="https://www.googletagmanager.com/gtm.js?id="+a,i.parentNode.insertBefore(r,i)}(window,document,"script","dataLayer",e)},g=(e,t="update")=>()=>{const{settings:n,consent:s}=e.getState(),{euConsentTypes:a}=n;if(!a)return;const i=Object.keys(a).reduce((e,n)=>(Object.keys(s).length>0&&void 0===s[a[n]]&&console.warn(`Cannot find consent type '${a[n]}' in preferences cookie, check your euConsentTypes configuration matches your cookie types`),e[n]=s[a[n]]&&"update"===t?"granted":"denied",e),{});"update"!==t&&(i.wait_for_update=500),function(){window.dataLayer=window.dataLayer||[],window.dataLayer.push(arguments)}("consent",t,i)};var u={name:".CookiePreferences",path:"/",domain:"localhost"===window.location.hostname?"":`.${(e=>{let t=(e=e.replace(/^www\./,"")).split(".");for(;t.length>3;)t.shift();return 3===t.length&&-1===o.indexOf(t[1])&&-1===c.indexOf(t[2])&&t.shift(),t.join(".")})(window.location.hostname)}`,secure:!0,samesite:"strict",expiry:365,types:{},necessary:[],policyURL:"/cookie-policy/#preferences",classNames:{banner:"privacy-banner",acceptBtn:"privacy-banner__accept",rejectBtn:"privacy-banner__reject",submitBtn:"privacy-banner__submit",optionsBtn:"privacy-banner__options",field:"privacy-banner__field",form:"privacy-banner__form",fieldset:"privacy-banner__fieldset",legend:"privacy-banner__legend",formContainer:"privacy-banner__form-container",formMessage:"privacy-banner__form-msg",formAnnouncement:"privacy-banner__form-announcement",title:"privacy-banner__form-title",description:"privacy-banner__form-description",bannerToggle:"on--privacy-banner-toggle",bannerToggleTrigger:"js-toggle-btn"},hideBannerOnFormPage:!0,trapTab:!1,savedMessage:"Your settings have been saved.",bannerTemplate:e=>`<div role="region" aria-live="polite" aria-label="Your privacy" class="${e.classNames.banner}">\n <div class="privacy-content">\n <div class="wrap">\n \x3c!--googleoff: all--\x3e\n <div class="privacy-banner__title">Cookies</div>\n <p>We use cookies to improve your experience on our site and show you personalised advertising.</p>\n <p>Find out more from our <a class="privacy-banner__link" rel="noopener noreferrer nofollow" href="/privacy-policy">privacy policy</a> and <a class="privacy-banner__link" rel="noopener noreferrer nofollow" href="${e.policyURL}">cookie policy</a>.</p>\n <button type="button" class="btn btn--primary ${e.classNames.acceptBtn}">Accept all</button>\n <button type="button" class="btn btn--primary ${e.classNames.rejectBtn}">Reject all</button>\n <a class="privacy-banner__link ${e.classNames.optionsBtn}" rel="noopener noreferrer nofollow" href="${e.policyURL}">Your options</a>\n \x3c!--googleon: all--\x3e\n </div>\n </div>\n </div>`,messageTemplate:e=>`<div class="${e.settings.classNames.formMessage}" aria-hidden="true">${e.settings.savedMessage}</div>`,formTemplate:e=>`<form id="preferences" class="${e.settings.classNames.form}" novalidate>\n ${Object.keys(e.settings.types).map(t=>`<fieldset class="${e.settings.classNames.fieldset}">\n <legend class="${e.settings.classNames.legend}">\n <span class="${e.settings.classNames.title}">${e.settings.types[t].title}</span>\n <span class="${e.settings.classNames.description}">${e.settings.types[t].description}</span>\n </legend>\n <div class="form-row">\n <div class="relative">\n <label class="privacy-banner__label">\n <input\n class="${e.settings.classNames.field}"\n type="radio"\n name="privacy-${t.split(" ")[0].replace(" ","-")}"\n value="1"\n ${1===e.consent[t]?"checked":""}>\n <span class="privacy-banner__label-text">I am OK with this</span>\n <span class="privacy-banner__label-description">${e.settings.types[t].labels.yes}</span>\n </label> \n </div>\n </div>\n <div class="form-row">\n <div class="relative">\n <label class="privacy-banner__label">\n <input\n class="${e.settings.classNames.field}"\n type="radio"\n name="privacy-${t.split(" ")[0].replace(" ","-")}"\n value="0"\n ${0===e.consent[t]?"checked":""}>\n <span class="privacy-banner__label-text">No thank you</span>\n <span class="privacy-banner__label-description">${e.settings.types[t].labels.no}</span>\n </label> \n </div>\n </div>\n </fieldset>`).join("")}\n <button class="${e.settings.classNames.submitBtn}"${Object.keys(e.consent).length!==Object.keys(e.settings.types).length?" disabled":""}>Save my settings</button>\n </form>`};function b(){return b=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var s in n)({}).hasOwnProperty.call(n,s)&&(e[s]=n[s])}return e},b.apply(null,arguments)}const y=(e,t)=>Object.assign({},e,{consent:Object.assign({},e.consent,t)}),f=e=>t=>{(e=>{Object.keys(e.consent).forEach(t=>{e.settings.types[t]&&!0!==e.settings.types[t].executed&&e.consent[t]&&Boolean(e.consent[t])&&e.settings.types[t].fns&&e.settings.types[t].fns.forEach(t=>t(e))})})(t),e.update(((e,t)=>Object.assign({},e,{settings:Object.assign({},e.settings,{types:Object.assign({},e.settings.types,t)})}))(t,Object.keys(t.settings.types).reduce((e,n)=>(e[n]=b({},t.settings.types[n],{executed:t.settings.types[n].executed||t.consent[n]&&Boolean(t.consent[n])}),e),{})))},v=e=>{e.settings.necessary.forEach(t=>t(e))},h=e=>()=>{const t=e.getState();t.bannerOpen||t.settings.hideBannerOnFormPage&&document.querySelector(`.${t.settings.classNames.formContainer}`)||(document.body.firstElementChild.insertAdjacentHTML("beforebegin",t.settings.bannerTemplate(t.settings)),e.update(((e,t)=>Object.assign({},e,{banner:t.banner,bannerOpen:t.bannerOpen}))(t,{banner:document.querySelector(`.${t.settings.classNames.banner}`),bannerOpen:!0}),[d("banner.show",e)]),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"stormcb_display"}))},w=t=>()=>{const i=t.getState();if(!i.banner)return;const r=t=>e.map(e=>`${e}.${t}`).join(", "),c=(e,t)=>{const n=Object.keys(i.settings.types).reduce((e,n)=>(e[n]=t,e),{});return{consentObject:n,analyticsObject:Object.entries(n).reduce((e,[t,n])=>(e["stormcb_"+t]=n,e),{event:`stormcb_${e}_all`})}},o=[].slice.call(document.querySelectorAll(r(i.settings.classNames.acceptBtn))),l=[].slice.call(document.querySelectorAll(r(i.settings.classNames.rejectBtn)));i.settings.trapTab&&document.addEventListener("keydown",i.keyListener),o.forEach(e=>{e.addEventListener("click",e=>{const{consentObject:i,analyticsObject:r}=c("accept",1),o=t.getState();t.update(y(o,i),[a,s,f(t),j(t),O(t),()=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push(r)},d(n,t),g(t)])})}),l.forEach(e=>{e.addEventListener("click",e=>{const{consentObject:a,analyticsObject:i}=c("reject",0),r=t.getState();t.update(y(r,a),[s,j(t),O(t),()=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push(i)},d(n,t),g(t)])})})},k=e=>t=>{var n;e.getState().banner&&9===t.keyCode&&(n=e.getState(),e=>{const t=l(n.banner),s=t.indexOf(document.activeElement);e.shiftKey&&0===s?(e.preventDefault(),t[t.length-1].focus()):e.shiftKey||s!==t.length-1||(e.preventDefault(),t[0].focus())})(t)},j=e=>()=>{const t=e.getState(),n=t.banner;n&&n.parentNode&&(n.parentNode.removeChild(n),e.update((e=>Object.assign({},e,{bannerOpen:!1}))(t),[d("banner.hide",e)])),t.settings.trapTab&&document.removeEventListener("keydown",t.keyListener)},O=e=>()=>{const t=e.getState(),i=document.querySelector(`.${t.settings.classNames.formContainer}`);if(!i)return;i.innerHTML=t.settings.formTemplate((e=>Object.keys(e.consent).length>0?e:Object.assign({},e,{consent:Object.keys(e.settings.types).reduce((t,n)=>(e.settings.types[n].suggested&&(t[n]=1),t),{})}))(t));const c=document.querySelector(`.${t.settings.classNames.form}`),o=document.querySelector(`.${t.settings.classNames.submitBtn}`),l=[].slice.call(document.querySelectorAll(`.${t.settings.classNames.field}`)).reduce((e,t)=>{const n=t.getAttribute("name").replace("privacy-","");return e[n]?e[n].push(t):e[n]=[t],e},{}),p=document.querySelector(`.${t.settings.classNames.formAnnouncement}`)||document.body.appendChild(Object.assign(document.createElement("div"),{className:t.settings.classNames.formAnnouncement,role:"alert"})),m=()=>{const e=Object.keys(l).reduce((e,t)=>{const n=l[t].reduce(r,"");return n&&(e[t]=parseInt(n,10)),e},{});return{consentObject:e,analyticsObject:Object.entries(e).reduce((e,[t,n])=>(e["stormcb_"+t]=n,e),{event:"stormcb_save"})}},u=e=>{Object.keys(m().consentObject).length===Object.keys(l).length&&(o.removeAttribute("disabled"),c.removeEventListener("change",u))};o.hasAttribute("disabled")&&c.addEventListener("change",u),c.addEventListener("submit",t=>{t.preventDefault();const{consentObject:i,analyticsObject:r}=m(),c=e.getState();e.update(y(c,i),[a,s,f(e),j(e),()=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push(r)},d(n,e),_(o),$(p),g(e)])}),window.location.hash.substring(1)===c.id&&window.scrollTo(0,c.getBoundingClientRect().top+window.scrollY)},_=e=>t=>{e.insertAdjacentHTML("afterend",t.settings.messageTemplate(t)),e.setAttribute("disabled","disabled"),window.setTimeout(()=>{e.parentNode.removeChild(e.nextElementSibling),e.removeAttribute("disabled")},3e3)},$=e=>t=>{e.textContent=t.settings.savedMessage,window.setTimeout(()=>{e.textContent=""},3e3)};var S=e=>(e=>{if(!(()=>{try{document.cookie="cookietest=1";const e=-1!==document.cookie.indexOf("cookietest=");return document.cookie="cookietest=1; expires=Thu, 01-Jan-1970 00:00:01 GMT",e}catch(e){return!1}})())return;const t=(()=>{let e={};return{update:(t,n)=>{e=null!=t?t:e,n&&n.forEach(t=>t(e))},getState:()=>e}})(),[n,s]=(e=>{try{const t=(e=>{const t=document.cookie.split("; ");for(let n=0;n<=t.length;n++){if(!t[n])return!1;const[s,a]=t[n].split("=");if(s===e.name)return window.atob(a)}return!1})(e);if(!t)return[!1,{}];const{consent:n}=JSON.parse(t),s=void 0!==n;return((e,t)=>{if(e.length!==t.length)return!1;for(const n of t)if(-1===e.indexOf(n))return!1;return!0})(Object.keys(n),Object.keys(e.types))?[s,n||{}]:[!1,{}]}catch(e){return[!1,{}]}})(e);return t.update({settings:e,bannerOpen:!1,keyListener:k(t),consent:s,utils:{renderIframe:p,gtmSnippet:m}},[v,g(t,"default"),f(t),...n?[]:[h(t)],O(t),w(t),...n?[g(t)]:[]]),{getState:t.getState,showBanner(e){(e=>t=>{if(h(e)(),!e.getState().bannerOpen)return;O(e)();const n=l(document.body.firstElementChild);n.length>0&&n[0].focus(),t&&t.call&&t(e.getState())})(t)(e),w(t)()},renderForm:O(t)}})(Object.assign({},u,e));export{S as default}; //# sourceMappingURL=index.modern.mjs.map