ga-4-react
Version:
Simple wrapper of ga4 scripts for React: https://developers.google.com/analytics/devguides/collection/ga4
3 lines (2 loc) • 4.2 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),i=(e=t)&&"object"==typeof e&&"default"in e?e.default:e;class n{constructor(e,t,i,n,a){if(this.gaCode=e,this.gaConfig=t,this.additionalGaCode=i,this.timeout=n,this.options=a,this.scriptSyncId="ga4ReactScriptSync",this.scriptAsyncId="ga4ReactScriptAsync",this.nonceAsync="",this.nonceSync="",this.gaConfig=t||{},this.gaCode=e,this.timeout=n||5e3,this.additionalGaCode=i,this.options=a,this.options){var{nonce:s}=this.options;this.nonceAsync=s&&s[0]?s[0]:"",this.nonceSync=s&&s[1]?s[1]:""}}outputOnResolve(){return{pageview:this.pageview,event:this.event,gtag:this.gtag}}initialize(){return new Promise((e,t)=>{n.isInitialized()&&t(new Error("GA4React is being initialized"));var i=document.getElementById(this.scriptAsyncId);i&&i.remove();var a=document.getElementsByTagName("head")[0],s=document.createElement("script");s.setAttribute("id",this.scriptAsyncId),s.setAttribute("async",""),this.nonceAsync&&"string"==typeof this.nonceAsync&&this.nonceAsync.length>0&&s.setAttribute("nonce",this.nonceAsync),s.setAttribute("src","https://www.googletagmanager.com/gtag/js?id="+this.gaCode),s.onload=()=>{var t=document.getElementById(this.scriptSyncId);t&&t.remove();var i=document.getElementById(this.scriptSyncId);i&&i.remove();var n=document.createElement("script");n.setAttribute("id",this.scriptSyncId),this.nonceSync&&"string"==typeof this.nonceSync&&this.nonceSync.length>0&&n.setAttribute("nonce",this.nonceSync);var s="window.dataLayer = window.dataLayer || [];\n function gtag(){dataLayer.push(arguments);};\n gtag('js', new Date());\n gtag('config', '"+this.gaCode+"', "+JSON.stringify(this.gaConfig)+");";this.additionalGaCode&&this.additionalGaCode.forEach(e=>{s+="\ngtag('config', '"+e+"', "+JSON.stringify(this.gaConfig)+");"}),n.innerHTML=s,a.appendChild(n);var o=this.outputOnResolve();Object.assign(window,{__ga4React__:o}),e(o)},s.onerror=e=>{if("string"==typeof e)t("GA4React intialization failed "+e);else{var i=new Error;i.name="GA4React intialization failed",i.message=JSON.stringify(e,["message","arguments","type","name"]),t(i)}};var o=()=>{switch(document.readyState){case"interactive":case"complete":n.isInitialized()||(a.appendChild(s),document.removeEventListener("readystatechange",o))}};"complete"!==document.readyState?document.addEventListener("readystatechange",o):o(),setTimeout(()=>{t(new Error("GA4React Timeout"))},this.timeout)})}pageview(e,t,i){return this.gtag("event","page_view",{page_path:e,page_location:t||window.location,page_title:i||document.title})}event(e,t,i,n){return void 0===n&&(n=!1),this.gtag("event",e,{event_label:t,event_category:i,non_interaction:n})}gtag(){return window.gtag(...arguments)}static isInitialized(){switch(void 0!==window.__ga4React__){case!0:return!0;default:return!1}}static getGA4React(){if(n.isInitialized())return window.__ga4React__;console.error(new Error("GA4React is not initialized"))}}var a=(e,t,n)=>{t(i.Children.map(e,(e,t)=>i.isValidElement(e)?e.type&&void 0!==e.type.name?i.cloneElement(e,{ga4:n,index:t}):e:i.createElement(i.Fragment,null,e)))};exports.GA4R=e=>{var{code:s,timeout:o,config:r,additionalCode:c,children:d,options:g}=e,[l,h]=t.useState(null);return t.useEffect(()=>{if(n.isInitialized()){var e=n.getGA4React();e&&a(d,h,e)}else new n(""+s,r,c,o,g).initialize().then(e=>{a(d,h,e)},e=>{console.error(e)})},[]),i.createElement(i.Fragment,null,l)},exports.GA4React=n,exports.default=n,exports.useGA4React=(e,i,a,s,o)=>{var[r,c]=t.useState(void 0);return t.useEffect(()=>{if(e)switch(n.isInitialized()){case!1:new n(""+e,i,a,s,o).initialize().then(e=>{c(e)},e=>{console.error(e)});break;case!0:c(n.getGA4React())}else c(n.getGA4React())},[e]),r},exports.withTracker=function(e){return a=>{var{path:s,location:o,title:r,gaCode:c,gaTimeout:d,gaConfig:g,gaAdditionalCode:l,options:h}=a;return t.useEffect(()=>{switch(n.isInitialized()){case!0:var e=n.getGA4React();e&&e.pageview(s,o,r);break;default:case!1:new n(""+c,g,l,d,h).initialize().then(e=>{e.pageview(s,o,r)},e=>{console.error(e)})}}),i.createElement(e,Object.assign({},a))}};
//# sourceMappingURL=ga-4-react.cjs.production.min.js.map