@harshitpant/ga-4-react
Version:
Simple wrapper of ga4 scripts for React: https://developers.google.com/analytics/devguides/collection/ga4
3 lines (2 loc) • 4.27 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)=>{var i,a;n.isInitialized()&&t(new Error("GA4React is being initialized"));var s=document.getElementById(this.scriptAsyncId);s&&s.remove();var o=document.getElementsByTagName("head")[0],r=document.createElement("script");r.setAttribute("id",this.scriptAsyncId),r.setAttribute("async",""),this.nonceAsync&&"string"==typeof this.nonceAsync&&this.nonceAsync.length>0&&r.setAttribute("nonce",this.nonceAsync);var c=null!=(i=null==(a=this.gaConfig)?void 0:a.gaAddress)?i:"https://www.googletagmanager.com/gtag/js?id="+this.gaCode;r.setAttribute("src",c),r.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 a="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=>{a+="\ngtag('config', '"+e+"', "+JSON.stringify(this.gaConfig)+");"}),n.innerHTML=a,o.appendChild(n);var s=this.outputOnResolve();Object.assign(window,{__ga4React__:s}),e(s)},r.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 d=()=>{switch(document.readyState){case"interactive":case"complete":n.isInitialized()||(o.appendChild(r),document.removeEventListener("readystatechange",d))}};"complete"!==document.readyState?document.addEventListener("readystatechange",d):d(),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