@expo/styleguide-cookie-consent 4.0.0-datagrail.0 → 4.0.0-datagrail.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{c as n}from"react/compiler-runtime";import{useSyncExternalStore as e,useEffect as t}from"react";import{jsx as o,Fragment as a,jsxs as r}from"react/jsx-runtime";const d="\n:host(.dg-consent-banner) {\n --dg-consent-background-color: var(--expo-theme-background-screen);\n --dg-consent-background-border: 1px solid var(--expo-theme-border-secondary);\n --consent-border-radius: 12px;\n --dg-body-font-color: var(--expo-theme-text-secondary);\n --dg-title-font-color: var(--expo-theme-text-default);\n --dg-heading-font-color: var(--expo-theme-text-default);\n --dg-option-background: var(--expo-theme-background-element);\n --dg-option-border: var(--expo-theme-border-secondary);\n --dg-option-essential-background: var(--expo-theme-background-element);\n --dg-option-essential-border: var(--expo-theme-border-secondary);\n --dg-category-text: var(--expo-theme-text-default);\n --dg-category-text-enabled: var(--expo-theme-text-default);\n --dg-policy-option-heading-color: var(--expo-theme-text-default);\n --dg-policy-option-heading-enabled-color: var(--expo-theme-text-default);\n --dg-policy-option-description-font-color: var(--expo-theme-text-secondary);\n --dg-policy-option-essential-label-font-color: var(--expo-theme-text-secondary);\n --dg-body-font-weight: 400;\n --dg-secondary-font-weight: 400;\n --dg-policy-option-heading-size: 14px;\n --dg-policy-option-heading-weight: 600;\n --dg-policy-option-description-font-size: 13px;\n --dg-policy-option-description-font-weight: 400;\n --dg-policy-option-essential-label-font-size: 13px;\n --dg-policy-option-essential-label-font-weight: 500;\n --dg-slider-primary: #fff;\n --dg-slider-secondary: var(--expo-theme-text-quaternary);\n --dg-slider-enabled-primary: #fff;\n --dg-slider-enabled-secondary: var(--expo-theme-text-link);\n --dg-language-dropdown-font-color: var(--expo-theme-text-secondary);\n font-family: inherit;\n font-size: 14px;\n line-height: 1.375;\n /* The shadow sits on the host; round it to match the card so the corners don't show a square edge. */\n border-radius: var(--consent-border-radius);\n box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n}\n\n:host(.dg-consent-banner.dg-left),\n:host(.dg-consent-banner.dg-right) {\n width: 440px;\n max-width: calc(100% - 32px);\n}\n\n:host(.dg-consent-banner.dg-modal) .dg-app {\n box-sizing: border-box;\n width: 500px;\n max-width: calc(100% - 32px);\n}\n\n:host(.dg-consent-banner) .dg-app {\n flex-direction: row;\n flex-wrap: wrap;\n align-items: center;\n gap: 8px;\n padding: 16px;\n}\n\n:host(.dg-consent-banner) .dg-header,\n:host(.dg-consent-banner) .dg-main-language-dropdown,\n:host(.dg-consent-banner) .dg-main-content-explanation.dg-text-body,\n:host(.dg-consent-banner) .dg-links,\n:host(.dg-consent-banner) .dg-main-content-policies,\n:host(.dg-consent-banner) .dg-tracking-details {\n flex-basis: 100%;\n margin: 0;\n}\n\n/* DataGrail's text elements set Helvetica through --dg-secondary-font; use the page font everywhere. */\n:host(.dg-consent-banner) .dg-main-content-explanation,\n:host(.dg-consent-banner) .dg-link,\n:host(.dg-consent-banner) .dg-header-close,\n:host(.dg-consent-banner) .dg-main-content-policy-option,\n:host(.dg-consent-banner) .dg-browser-signal-notice-text,\n:host(.dg-consent-banner) .dg-main-language-dropdown span,\n:host(.dg-consent-banner) button {\n font-family: inherit;\n}\n\n:host(.dg-consent-banner) .dg-header {\n align-items: center;\n}\n\n:host(.dg-consent-banner) .dg-text-title {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n line-height: 1.375;\n}\n\n:host(.dg-consent-banner) .dg-header-close svg path,\n:host(.dg-consent-banner) .dg-chevron path {\n fill: var(--expo-theme-icon-secondary);\n}\n\n:host(.dg-consent-banner) .dg-main-language-dropdown {\n display: none;\n}\n\n:host(.dg-consent-banner) .dg-text-body {\n font-size: 14px;\n line-height: 1.375;\n}\n\n:host(.dg-consent-banner) .dg-text-body p {\n margin: 0;\n}\n\n:host(.dg-consent-banner) .dg-text-body a,\n:host(.dg-consent-banner) .dg-link {\n color: var(--expo-theme-text-secondary);\n font-size: 14px;\n text-decoration: underline;\n}\n\n/* Space the actions from whatever ends the copy: the body text, or a links row when the layout has one. */\n:host(.dg-consent-banner) .dg-app > :not(.dg-button):has(+ .dg-button) {\n margin-bottom: 8px;\n}\n\n:host(.dg-consent-banner) .dg-main-content-policies {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 0;\n margin-bottom: 4px;\n}\n\n:host(.dg-consent-banner) .dg-main-content-policy-option,\n:host(.dg-consent-banner) .dg-main-content-policy-option:first-of-type {\n border: 1px solid var(--expo-theme-border-secondary);\n border-radius: 8px;\n padding: 0 10px;\n}\n\n:host(.dg-consent-banner) .dg-main-content-policy-option-heading button,\n:host(.dg-consent-banner) .dg-main-content-policy-option-heading strong {\n font-size: 14px;\n font-weight: 600;\n}\n\n:host(.dg-consent-banner) .dg-main-content-policy-option-description {\n padding: 0 0 0 24px;\n line-height: 1.4;\n}\n\n:host(.dg-consent-banner) .dg-collapsible.isOpen .dg-main-content-policy-option-description {\n padding-bottom: 12px;\n}\n\n:host(.dg-consent-banner) .dg-button {\n display: inline-flex;\n align-items: center;\n height: 28px;\n margin: 0;\n padding: 0 8px;\n border: 1px solid var(--expo-theme-border-default);\n border-radius: 9999px;\n background: var(--expo-theme-background-default);\n color: var(--expo-theme-text-default);\n font-size: 12px;\n font-weight: 500;\n line-height: 1;\n white-space: nowrap;\n transition: background-color 150ms, transform 150ms;\n}\n\n:host(.dg-consent-banner) .dg-button:hover {\n background: var(--expo-theme-background-element);\n}\n\n:host(.dg-consent-banner) .dg-button:active {\n transform: scale(0.98);\n}\n\n:host(.dg-consent-banner) .dg-button.open_layer {\n order: 1;\n}\n\n:host(.dg-consent-banner) .dg-button.reject_all {\n order: 2;\n border-color: var(--expo-theme-button-secondary-border);\n background: var(--expo-theme-button-secondary-background);\n color: var(--expo-theme-button-secondary-text);\n}\n\n:host(.dg-consent-banner) .dg-button.reject_all:hover {\n background: var(--expo-theme-button-secondary-hover);\n}\n\n:host(.dg-consent-banner) .dg-button.accept_some {\n order: 3;\n}\n\n:host(.dg-consent-banner) .dg-button.accept_all {\n order: 4;\n margin-left: auto;\n border-color: var(--expo-theme-button-primary-border);\n background: var(--expo-theme-button-primary-background);\n color: var(--expo-theme-button-primary-text);\n}\n\n:host(.dg-consent-banner) .dg-button.accept_all:hover {\n background: var(--expo-theme-button-primary-hover);\n}\n\n/* DataGrail pins the banner to the viewport edges on phones; keep the desktop gutter. */\n@media only screen and (max-width: 480px) {\n :host(.dg-consent-banner.dg-left),\n :host(.dg-consent-banner.dg-right) {\n width: auto;\n inset: auto 16px 16px;\n }\n\n :host(.dg-consent-banner) .dg-app {\n padding: 16px;\n }\n\n :host(.dg-consent-banner) .dg-button {\n flex-basis: 100%;\n justify-content: center;\n height: 36px;\n }\n\n /* Stack in DataGrail's order, Accept first; the class selectors outrank the desktop ordering. */\n :host(.dg-consent-banner) .dg-button.accept_all,\n :host(.dg-consent-banner) .dg-button.reject_all,\n :host(.dg-consent-banner) .dg-button.accept_some,\n :host(.dg-consent-banner) .dg-button.open_layer {\n order: 0;\n margin-left: 0;\n }\n}\n",i=200,s="expo-cookie-consent-queued-events",c={analytics:"pending",marketing:"pending",hasConsented:!1,isDataGrailLoaded:!1};let g=c;const l=new Set,p=[],h=[];let u=null,m=null,b=!1;function f(){return g.analytics}function x(){return g.marketing}function y(){return"granted"===g.analytics}function w(){return"granted"===g.marketing}function v(n,e){n.length>=200||n.push(e)}function k(n){v(p,n)}function _(n){v(h,n)}function C(n){u=n}function L(n){m=n}function E(n,e,t,o){if("granted"===o&&"pending"===t){const t=n.splice(0);e&&t.length>0&&e(t)}else"denied"===o&&(n.length=0)}function I(n,e,t){return n.consentPreferences.cookieOptions.some((n=>n.gtm_key===e&&n.isEnabled))?"granted":t?"denied":"pending"}function j(n,e){n.unshift(...e),n.length=Math.min(n.length,200)}function D(n){const e="page_load"===n.action,t=!e||document.cookie.includes("datagrail_consent_preferences=")||!1===window.DG_BANNER_API?.config().showBanner,o={analytics:I(n,"dg-category-performance",t),marketing:I(n,"dg-category-marketing",t),hasConsented:t,isDataGrailLoaded:!0};if(e){const n=function(){try{const n=window.sessionStorage.getItem(s);if(!n)return null;window.sessionStorage.removeItem(s);const e=JSON.parse(n);return{analytics:Array.isArray(e.analytics)?e.analytics:[],marketing:Array.isArray(e.marketing)?e.marketing:[]}}catch{return null}}();n&&(j(p,n.analytics),j(h,n.marketing))}else(function(n){const e={analytics:"granted"===n.analytics?p:[],marketing:"granted"===n.marketing?h:[]};try{return 0===e.analytics.length&&0===e.marketing.length?window.sessionStorage.removeItem(s):window.sessionStorage.setItem(s,JSON.stringify(e)),!0}catch{return!1}})(o)&&(p.length=0,h.length=0);!function(n){const e=g;g=n,E(p,u,e.analytics,g.analytics),E(h,m,e.marketing,g.marketing);for(const n of l)n()}(o)}function N(){window.DG_BANNER_API?.showConsentBanner()}function B(n){return l.add(n),()=>{l.delete(n)}}function G(){return e(B,z,S)}function S(){return c}function z(){return g}function A(){g=c,p.length=0,h.length=0,u=null,m=null,b=!1;for(const n of l)n()}const R="datagrail-consent",M="dg-consent-custom-style",O="google-tag-manager",P="google-analytics";function T(n){window.dataLayer=window.dataLayer??[],"function"!=typeof window.gtag&&(window.gtag=function(){window.dataLayer.push(arguments)}),function(n){return window.dataLayer.some((e=>{const t=e;return"config"===t?.[0]&&t[1]===n}))}(n)||(window.gtag("js",new Date),window.gtag("config",n))}function Z(e){const r=n(26),{children:i,customerId:s,containerId:c,gtmId:g,ga4Id:l,disabled:p,styles:h}=e,u=void 0!==p&&p,m=void 0===h?d:h,{analytics:f,isDataGrailLoaded:x}=G(),y="granted"===f,w=g?void 0:l;let v,k,_,C,L,E,I,j,N,B,S;return r[0]!==l||r[1]!==g?(v=()=>{g&&l&&"undefined"!=typeof process&&"production"!==process.env.NODE_ENV&&console.warn("[cookie-consent] ga4Id is ignored when gtmId is set. Load GA4 from the GTM container instead.")},k=[g,l],r[0]=l,r[1]=g,r[2]=v,r[3]=k):(v=r[2],k=r[3]),t(v,k),r[4]!==c||r[5]!==s||r[6]!==u||r[7]!==m?(_=()=>{u||(b||(b=!0,window.dgEvent=window.dgEvent??[],window.dgEvent.push({event:"initial_preference_callback",params:D}),window.dgEvent.push({event:"preference_callback",params:D})),m&&function(n){if(document.getElementById(M))return;const e=document.createElement("style");e.id=M,e.textContent=n,document.head.prepend(e)}(m),function(n,e){if(document.getElementById(R))return;const t=document.createElement("script");t.id=R,t.async=!0,t.src=`https://api.consentjs.datagrail.io/${n}/${e}/consent-loader.js`,document.head.prepend(t)}(s,c))},C=[u,s,c,m],r[4]=c,r[5]=s,r[6]=u,r[7]=m,r[8]=_,r[9]=C):(_=r[8],C=r[9]),t(_,C),r[10]!==u||r[11]!==g||r[12]!==x?(L=()=>{!u&&g&&x&&function(n){if(document.getElementById(O))return;const e=document.createElement("script");e.id=O,e.text=function(n){return`\nwindow.dataLayer = window.dataLayer || [];\nwindow.gtag = function () {\n window.dataLayer.push(arguments);\n};\n(function (w, d, s, l, i) {\n w[l].push({ "gtm.start": new Date().getTime(), event: "gtm.js" });\n var f = d.getElementsByTagName(s)[0];\n var j = d.createElement(s);\n j.async = true;\n j.src = "https://www.googletagmanager.com/gtm.js?id=" + i;\n f.parentNode.insertBefore(j, f);\n})(window, document, "script", "dataLayer", "${n}");\n`}(n),document.head.appendChild(e)}(g)},E=[u,g,x],r[10]=u,r[11]=g,r[12]=x,r[13]=L,r[14]=E):(L=r[13],E=r[14]),t(L,E),r[15]!==w||r[16]!==u?(j=()=>{!u&&w&&T(w)},I=[u,w],r[15]=w,r[16]=u,r[17]=I,r[18]=j):(I=r[17],j=r[18]),t(j,I),r[19]!==w||r[20]!==u||r[21]!==y?(N=()=>{!u&&w&&y&&function(n){if(document.getElementById(P))return;T(n);const e=document.createElement("script");e.id=P,e.async=!0,e.src=`https://www.googletagmanager.com/gtag/js?id=${n}`,document.head.appendChild(e)}(w)},B=[u,w,y],r[19]=w,r[20]=u,r[21]=y,r[22]=N,r[23]=B):(N=r[22],B=r[23]),t(N,B),r[24]!==i?(S=o(a,{children:i}),r[24]=i,r[25]=S):S=r[25],S}function $(){const e=n(1),{isDataGrailLoaded:t}=G();if(!t)return null;let a;return e[0]===Symbol.for("react.memo_cache_sentinel")?(a=r("button",{type:"button",onClick:N,className:"text-secondary hocus:text-default inline-flex items-center gap-1.5 text-sm transition-colors cursor-pointer","aria-label":"Your Privacy Choices",children:[o(q,{}),o("span",{className:"font-semibold",children:"Your Privacy Choices"})]}),e[0]=a):a=e[0],a}function q(){const e=n(1);let t;return e[0]===Symbol.for("react.memo_cache_sentinel")?(t=r("svg",{width:"30",height:"16",viewBox:"0 0 743 376",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[o("rect",{width:"742.6",height:"376",rx:"188",fill:"white"}),o("rect",{x:"14.2146",y:"14.2146",width:"714.171",height:"347.571",rx:"173.785",stroke:"#405D96",strokeWidth:"28.4292"}),o("path",{d:"M421.723 0H554.6C658.43 0 742.6 84.1705 742.6 188C742.6 291.83 658.43 376 554.6 376H320.877L421.723 0Z",fill:"#405D96"}),o("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M315.783 112.736C321.683 117.519 322.591 126.181 317.809 132.084L216.494 257.149C207.93 267.721 192.099 268.548 182.48 258.926L123.211 199.638C117.84 194.266 117.84 185.556 123.211 180.184C128.581 174.812 137.288 174.812 142.659 180.184L198.33 235.873L296.44 114.763C301.222 108.86 309.882 107.953 315.783 112.736Z",fill:"#405D96"}),o("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M456.576 106.585C462.095 101.365 470.799 101.608 476.017 107.129L608.556 247.338C613.774 252.858 613.531 261.565 608.013 266.785C602.494 272.005 593.79 271.761 588.572 266.241L456.033 126.031C450.814 120.511 451.058 111.804 456.576 106.585Z",fill:"white"}),o("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M610.222 108.733C615.592 114.106 615.592 122.815 610.222 128.188L473.815 264.636C468.445 270.008 459.738 270.008 454.367 264.636C448.997 259.264 448.997 250.554 454.367 245.182L590.774 108.733C596.144 103.361 604.851 103.361 610.222 108.733Z",fill:"white"})]}),e[0]=t):t=e[0],t}export{Z as CookieConsentProvider,i as MAX_QUEUE_SIZE,$ as PrivacyChoicesButton,k as enqueueAnalyticsEvent,_ as enqueueMarketingEvent,d as expoBannerStyles,f as getAnalyticsConsentStatus,x as getMarketingConsentStatus,y as isAnalyticsConsented,w as isMarketingConsented,A as resetConsentState,C as setAnalyticsReplayFn,L as setMarketingReplayFn,N as showConsentPreferences,G as useConsent};
|
|
2
|
+
import{c as n}from"react/compiler-runtime";import{useSyncExternalStore as e,useEffect as t}from"react";import{jsx as o,Fragment as a,jsxs as r}from"react/jsx-runtime";const d="\n:host(.dg-consent-banner) {\n --dg-consent-background-color: var(--expo-theme-background-screen);\n --dg-consent-background-border: 1px solid var(--expo-theme-border-secondary);\n --consent-border-radius: 12px;\n --dg-body-font-color: var(--expo-theme-text-secondary);\n --dg-title-font-color: var(--expo-theme-text-default);\n --dg-heading-font-color: var(--expo-theme-text-default);\n --dg-option-background: var(--expo-theme-background-element);\n --dg-option-border: var(--expo-theme-border-secondary);\n --dg-option-essential-background: var(--expo-theme-background-element);\n --dg-option-essential-border: var(--expo-theme-border-secondary);\n --dg-category-text: var(--expo-theme-text-default);\n --dg-category-text-enabled: var(--expo-theme-text-default);\n --dg-policy-option-heading-color: var(--expo-theme-text-default);\n --dg-policy-option-heading-enabled-color: var(--expo-theme-text-default);\n --dg-policy-option-description-font-color: var(--expo-theme-text-secondary);\n --dg-policy-option-essential-label-font-color: var(--expo-theme-text-secondary);\n --dg-body-font-weight: 400;\n --dg-secondary-font-weight: 400;\n --dg-policy-option-heading-size: 14px;\n --dg-policy-option-heading-weight: 600;\n --dg-policy-option-description-font-size: 13px;\n --dg-policy-option-description-font-weight: 400;\n --dg-policy-option-essential-label-font-size: 13px;\n --dg-policy-option-essential-label-font-weight: 500;\n --dg-slider-primary: #fff;\n --dg-slider-secondary: var(--expo-theme-text-quaternary);\n --dg-slider-enabled-primary: #fff;\n --dg-slider-enabled-secondary: var(--expo-theme-text-link);\n --dg-language-dropdown-font-color: var(--expo-theme-text-secondary);\n font-family: inherit;\n font-size: 14px;\n line-height: 1.375;\n /* The shadow sits on the host; round it to match the card so the corners don't show a square edge. */\n border-radius: var(--consent-border-radius);\n box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n}\n\n:host(.dg-consent-banner.dg-left),\n:host(.dg-consent-banner.dg-right) {\n width: 440px;\n max-width: calc(100% - 32px);\n}\n\n:host(.dg-consent-banner.dg-modal) .dg-app {\n box-sizing: border-box;\n width: 500px;\n max-width: calc(100% - 32px);\n}\n\n:host(.dg-consent-banner) .dg-app {\n flex-direction: row;\n flex-wrap: wrap;\n align-items: center;\n gap: 8px;\n padding: 16px;\n}\n\n:host(.dg-consent-banner) .dg-header,\n:host(.dg-consent-banner) .dg-main-language-dropdown,\n:host(.dg-consent-banner) .dg-main-content-explanation.dg-text-body,\n:host(.dg-consent-banner) .dg-links,\n:host(.dg-consent-banner) .dg-main-content-policies,\n:host(.dg-consent-banner) .dg-tracking-details {\n flex-basis: 100%;\n margin: 0;\n}\n\n/* DataGrail's text elements set Helvetica through --dg-secondary-font; use the page font everywhere. */\n:host(.dg-consent-banner) .dg-main-content-explanation,\n:host(.dg-consent-banner) .dg-link,\n:host(.dg-consent-banner) .dg-header-close,\n:host(.dg-consent-banner) .dg-main-content-policy-option,\n:host(.dg-consent-banner) .dg-browser-signal-notice-text,\n:host(.dg-consent-banner) .dg-main-language-dropdown span,\n:host(.dg-consent-banner) button {\n font-family: inherit;\n}\n\n:host(.dg-consent-banner) .dg-header {\n align-items: center;\n}\n\n:host(.dg-consent-banner) .dg-text-title {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n line-height: 1.375;\n}\n\n:host(.dg-consent-banner) .dg-header-close svg path,\n:host(.dg-consent-banner) .dg-chevron path {\n fill: var(--expo-theme-icon-secondary);\n}\n\n:host(.dg-consent-banner) .dg-main-language-dropdown {\n display: none;\n}\n\n:host(.dg-consent-banner) .dg-text-body {\n font-size: 14px;\n line-height: 1.375;\n}\n\n:host(.dg-consent-banner) .dg-text-body p {\n margin: 0;\n}\n\n:host(.dg-consent-banner) .dg-text-body a,\n:host(.dg-consent-banner) .dg-link {\n color: var(--expo-theme-text-secondary);\n font-size: 14px;\n text-decoration: underline;\n}\n\n/* Space the actions from whatever ends the copy: the body text, or a links row when the layout has one. */\n:host(.dg-consent-banner) .dg-app > :not(.dg-button):has(+ .dg-button) {\n margin-bottom: 8px;\n}\n\n:host(.dg-consent-banner) .dg-main-content-policies {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 0;\n margin-bottom: 4px;\n}\n\n:host(.dg-consent-banner) .dg-main-content-policy-option,\n:host(.dg-consent-banner) .dg-main-content-policy-option:first-of-type {\n border: 1px solid var(--expo-theme-border-secondary);\n border-radius: 8px;\n padding: 0 10px;\n}\n\n:host(.dg-consent-banner) .dg-main-content-policy-option-heading button,\n:host(.dg-consent-banner) .dg-main-content-policy-option-heading strong {\n font-size: 14px;\n font-weight: 600;\n}\n\n:host(.dg-consent-banner) .dg-main-content-policy-option-description {\n padding: 0 0 0 24px;\n line-height: 1.4;\n}\n\n:host(.dg-consent-banner) .dg-collapsible.isOpen .dg-main-content-policy-option-description {\n padding-bottom: 12px;\n}\n\n:host(.dg-consent-banner) .dg-button {\n display: inline-flex;\n align-items: center;\n height: 28px;\n margin: 0;\n padding: 0 8px;\n border: 1px solid var(--expo-theme-border-default);\n border-radius: 9999px;\n background: var(--expo-theme-background-default);\n color: var(--expo-theme-text-default);\n font-size: 12px;\n font-weight: 500;\n line-height: 1;\n white-space: nowrap;\n transition: background-color 150ms, transform 150ms;\n}\n\n:host(.dg-consent-banner) .dg-button:hover {\n background: var(--expo-theme-background-element);\n}\n\n:host(.dg-consent-banner) .dg-button:active {\n transform: scale(0.98);\n}\n\n:host(.dg-consent-banner) .dg-button.open_layer {\n order: 1;\n}\n\n:host(.dg-consent-banner) .dg-button.reject_all {\n order: 2;\n border-color: var(--expo-theme-button-secondary-border);\n background: var(--expo-theme-button-secondary-background);\n color: var(--expo-theme-button-secondary-text);\n}\n\n:host(.dg-consent-banner) .dg-button.reject_all:hover {\n background: var(--expo-theme-button-secondary-hover);\n}\n\n:host(.dg-consent-banner) .dg-button.accept_some {\n order: 3;\n}\n\n:host(.dg-consent-banner) .dg-button.accept_all {\n order: 4;\n margin-left: auto;\n border-color: var(--expo-theme-button-primary-border);\n background: var(--expo-theme-button-primary-background);\n color: var(--expo-theme-button-primary-text);\n}\n\n:host(.dg-consent-banner) .dg-button.accept_all:hover {\n background: var(--expo-theme-button-primary-hover);\n}\n\n/* DataGrail pins the banner to the viewport edges on phones; keep the desktop gutter. */\n@media only screen and (max-width: 480px) {\n :host(.dg-consent-banner.dg-left),\n :host(.dg-consent-banner.dg-right) {\n width: auto;\n inset: auto 16px 16px;\n }\n\n :host(.dg-consent-banner) .dg-app {\n padding: 16px;\n }\n\n :host(.dg-consent-banner) .dg-button {\n flex-basis: 100%;\n justify-content: center;\n height: 36px;\n }\n\n /* Stack in DataGrail's order, Accept first; the class selectors outrank the desktop ordering. */\n :host(.dg-consent-banner) .dg-button.accept_all,\n :host(.dg-consent-banner) .dg-button.reject_all,\n :host(.dg-consent-banner) .dg-button.accept_some,\n :host(.dg-consent-banner) .dg-button.open_layer {\n order: 0;\n margin-left: 0;\n }\n}\n",i=200,s="expo-cookie-consent-queued-events",c={analytics:"pending",marketing:"pending",hasConsented:!1,isDataGrailLoaded:!1};let g=c;const l=new Set,p=[],h=[];let u=null,m=null,b=!1;function f(){return g.analytics}function x(){return g.marketing}function y(){return"granted"===g.analytics}function w(){return"granted"===g.marketing}function v(n,e){n.length>=200||n.push(e)}function k(n){v(p,n)}function _(n){v(h,n)}function C(n){u=n}function L(n){m=n}function E(n,e,t,o){if("granted"===o&&"pending"===t){const t=n.splice(0);e&&t.length>0&&e(t)}else"denied"===o&&(n.length=0)}function I(n,e,t){return n.consentPreferences.cookieOptions.some((n=>n.gtm_key===e&&n.isEnabled))?"granted":t?"denied":"pending"}function j(n,e){n.unshift(...e),n.length=Math.min(n.length,200)}function D(n){const e="page_load"===n.action,t=!e||document.cookie.includes("datagrail_consent_preferences=")||!1===window.DG_BANNER_API?.config().showBanner,o={analytics:I(n,"dg-category-performance",t),marketing:I(n,"dg-category-marketing",t),hasConsented:t,isDataGrailLoaded:!0};if(e){const n=function(){try{const n=window.sessionStorage.getItem(s);if(!n)return null;window.sessionStorage.removeItem(s);const e=JSON.parse(n);return{analytics:Array.isArray(e.analytics)?e.analytics:[],marketing:Array.isArray(e.marketing)?e.marketing:[]}}catch{return null}}();n&&(j(p,n.analytics),j(h,n.marketing))}else(function(n){const e={analytics:"granted"===n.analytics?p:[],marketing:"granted"===n.marketing?h:[]};try{return 0===e.analytics.length&&0===e.marketing.length?window.sessionStorage.removeItem(s):window.sessionStorage.setItem(s,JSON.stringify(e)),!0}catch{return!1}})(o)&&(p.length=0,h.length=0);!function(n){const e=g;g=n,E(p,u,e.analytics,g.analytics),E(h,m,e.marketing,g.marketing);for(const n of l)n()}(o)}function N(){window.DG_BANNER_API?.showConsentBanner()}function S(n){return l.add(n),()=>{l.delete(n)}}function B(){return e(S,z,G)}function G(){return c}function z(){return g}function A(){g=c,p.length=0,h.length=0,u=null,m=null,b=!1;for(const n of l)n()}const R="datagrail-consent",M="dg-consent-custom-style",O="google-tag-manager",H="google-analytics";function P(n){window.dataLayer=window.dataLayer??[],"function"!=typeof window.gtag&&(window.gtag=function(){window.dataLayer.push(arguments)}),function(n){return window.dataLayer.some((e=>{const t=e;return"config"===t?.[0]&&t[1]===n}))}(n)||(window.gtag("js",new Date),window.gtag("config",n))}function T(e){const r=n(26),{children:i,customerId:s,containerId:c,gtmId:g,ga4Id:l,disabled:p,styles:h}=e,u=void 0!==p&&p,m=void 0===h?d:h,{analytics:f,isDataGrailLoaded:x}=B(),y="granted"===f,w=g?void 0:l;let v,k,_,C,L,E,I,j,N,S,G;return r[0]!==l||r[1]!==g?(v=()=>{g&&l&&"undefined"!=typeof process&&"production"!==process.env.NODE_ENV&&console.warn("[cookie-consent] ga4Id is ignored when gtmId is set. Load GA4 from the GTM container instead.")},k=[g,l],r[0]=l,r[1]=g,r[2]=v,r[3]=k):(v=r[2],k=r[3]),t(v,k),r[4]!==c||r[5]!==s||r[6]!==u||r[7]!==m?(_=()=>{u||(b||(b=!0,window.dgEvent=window.dgEvent??[],window.dgEvent.push({event:"initial_preference_callback",params:D}),window.dgEvent.push({event:"preference_callback",params:D})),m&&function(n){if(document.getElementById(M))return;const e=document.createElement("style");e.id=M,e.textContent=n,document.head.prepend(e)}(m),function(n,e){if(document.getElementById(R))return;const t=document.createElement("script");t.id=R,t.async=!0,t.src=`https://api.consentjs.datagrail.io/${n}/${e}/consent-loader.js`,document.head.prepend(t)}(s,c))},C=[u,s,c,m],r[4]=c,r[5]=s,r[6]=u,r[7]=m,r[8]=_,r[9]=C):(_=r[8],C=r[9]),t(_,C),r[10]!==u||r[11]!==g||r[12]!==x?(L=()=>{!u&&g&&x&&function(n){if(document.getElementById(O))return;const e=document.createElement("script");e.id=O,e.text=function(n){return`\nwindow.dataLayer = window.dataLayer || [];\nwindow.gtag = function () {\n window.dataLayer.push(arguments);\n};\n(function (w, d, s, l, i) {\n w[l].push({ "gtm.start": new Date().getTime(), event: "gtm.js" });\n var f = d.getElementsByTagName(s)[0];\n var j = d.createElement(s);\n j.async = true;\n j.src = "https://www.googletagmanager.com/gtm.js?id=" + i;\n f.parentNode.insertBefore(j, f);\n})(window, document, "script", "dataLayer", "${n}");\n`}(n),document.head.appendChild(e)}(g)},E=[u,g,x],r[10]=u,r[11]=g,r[12]=x,r[13]=L,r[14]=E):(L=r[13],E=r[14]),t(L,E),r[15]!==w||r[16]!==u?(j=()=>{!u&&w&&P(w)},I=[u,w],r[15]=w,r[16]=u,r[17]=I,r[18]=j):(I=r[17],j=r[18]),t(j,I),r[19]!==w||r[20]!==u||r[21]!==y?(N=()=>{!u&&w&&y&&function(n){if(document.getElementById(H))return;P(n);const e=document.createElement("script");e.id=H,e.async=!0,e.src=`https://www.googletagmanager.com/gtag/js?id=${n}`,document.head.appendChild(e)}(w)},S=[u,w,y],r[19]=w,r[20]=u,r[21]=y,r[22]=N,r[23]=S):(N=r[22],S=r[23]),t(N,S),r[24]!==i?(G=o(a,{children:i}),r[24]=i,r[25]=G):G=r[25],G}const Z="text-secondary hocus:text-default inline-flex items-center gap-1.5 text-sm transition-colors cursor-pointer",$="Your Privacy Choices";function q(e){const t=n(4),{fallbackHref:d}=e,{isDataGrailLoaded:i}=B();let s;t[0]===Symbol.for("react.memo_cache_sentinel")?(s=r(a,{children:[o(J,{}),o("span",{className:"font-semibold",children:$})]}),t[0]=s):s=t[0];const c=s;if(!i){let n;return t[1]!==d?(n=o("a",{href:d,className:Z,"aria-label":$,children:c}),t[1]=d,t[2]=n):n=t[2],n}let g;return t[3]===Symbol.for("react.memo_cache_sentinel")?(g=o("button",{type:"button",onClick:N,className:Z,"aria-label":$,children:c}),t[3]=g):g=t[3],g}function J(){const e=n(1);let t;return e[0]===Symbol.for("react.memo_cache_sentinel")?(t=r("svg",{width:"30",height:"16",viewBox:"0 0 743 376",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[o("rect",{width:"742.6",height:"376",rx:"188",fill:"white"}),o("rect",{x:"14.2146",y:"14.2146",width:"714.171",height:"347.571",rx:"173.785",stroke:"#405D96",strokeWidth:"28.4292"}),o("path",{d:"M421.723 0H554.6C658.43 0 742.6 84.1705 742.6 188C742.6 291.83 658.43 376 554.6 376H320.877L421.723 0Z",fill:"#405D96"}),o("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M315.783 112.736C321.683 117.519 322.591 126.181 317.809 132.084L216.494 257.149C207.93 267.721 192.099 268.548 182.48 258.926L123.211 199.638C117.84 194.266 117.84 185.556 123.211 180.184C128.581 174.812 137.288 174.812 142.659 180.184L198.33 235.873L296.44 114.763C301.222 108.86 309.882 107.953 315.783 112.736Z",fill:"#405D96"}),o("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M456.576 106.585C462.095 101.365 470.799 101.608 476.017 107.129L608.556 247.338C613.774 252.858 613.531 261.565 608.013 266.785C602.494 272.005 593.79 271.761 588.572 266.241L456.033 126.031C450.814 120.511 451.058 111.804 456.576 106.585Z",fill:"white"}),o("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M610.222 108.733C615.592 114.106 615.592 122.815 610.222 128.188L473.815 264.636C468.445 270.008 459.738 270.008 454.367 264.636C448.997 259.264 448.997 250.554 454.367 245.182L590.774 108.733C596.144 103.361 604.851 103.361 610.222 108.733Z",fill:"white"})]}),e[0]=t):t=e[0],t}export{T as CookieConsentProvider,i as MAX_QUEUE_SIZE,q as PrivacyChoicesButton,k as enqueueAnalyticsEvent,_ as enqueueMarketingEvent,d as expoBannerStyles,f as getAnalyticsConsentStatus,x as getMarketingConsentStatus,y as isAnalyticsConsented,w as isMarketingConsented,A as resetConsentState,C as setAnalyticsReplayFn,L as setMarketingReplayFn,N as showConsentPreferences,B as useConsent};
|
|
@@ -1,5 +1,10 @@
|
|
|
1
|
+
type Props = {
|
|
2
|
+
/** Cookie policy page the link opens until the DataGrail banner is available. */
|
|
3
|
+
fallbackHref: string;
|
|
4
|
+
};
|
|
1
5
|
/**
|
|
2
|
-
* CCPA/CPRA "Your Privacy Choices"
|
|
3
|
-
*
|
|
6
|
+
* CCPA/CPRA "Your Privacy Choices" control with the standard opt-out toggle icon.
|
|
7
|
+
* A link to the cookie policy until DataGrail loads, then a button that opens the banner.
|
|
4
8
|
*/
|
|
5
|
-
export declare function PrivacyChoicesButton(): import("react/jsx-runtime").JSX.Element
|
|
9
|
+
export declare function PrivacyChoicesButton({ fallbackHref }: Props): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@expo/styleguide-cookie-consent",
|
|
3
|
-
"version": "4.0.0-datagrail.
|
|
3
|
+
"version": "4.0.0-datagrail.1",
|
|
4
4
|
"description": "Cookie consent provider for Expo websites with DataGrail.",
|
|
5
5
|
"homepage": "https://github.com/expo/styleguide",
|
|
6
6
|
"repository": {
|
|
@@ -37,5 +37,5 @@
|
|
|
37
37
|
"peerDependencies": {
|
|
38
38
|
"react": ">= 19"
|
|
39
39
|
},
|
|
40
|
-
"gitHead": "
|
|
40
|
+
"gitHead": "d5d8bf41b3cd94b8d29a724514289a9565772d3c"
|
|
41
41
|
}
|