UNPKG

use-tracking

Version:

Use Tracking is a custom React hook with a configurable Tracking component designed to enable simple and effective analytics and event tracking in all your Next.js applications.

2 lines 1.5 kB
var f=["aria-","class","height","width","style","data-state","data-sidebar"],p=["A","BUTTON"];function u(n,{ignore:i=[],prefix:s}={}){return n?Array.from(n.attributes).reduce((r,t)=>i.some(e=>t.name.startsWith(e))||s&&!t.name.startsWith(s)?r:{...r,[t.name]:t.value},{}):{}}function c({meaningfulTags:n=[],target:i}){if(!i)return null;let s=e=>e==="A"?"link":e.toLowerCase(),t=(e=>n.length?n.includes(e.tagName)?e:e.closest(n.join(",")):e)(i);return t?{name:s(t.tagName),target:t}:null}import{usePathname as O}from"next/navigation";import{useCallback as T,useEffect as d,useRef as v}from"react";function m({prefix:n="",ignore:i=f,meaningfulTags:s=p,action:r}={}){!r&&process.env.NODE_ENV==="development"&&(r=a=>console.log(a));let t=O(),e=v(Array.from(crypto.getRandomValues(new Uint8Array(16))).map(a=>a.toString(16)).join("")),l=T(()=>{r?.({sessionId:e.current,url:t,event:"pageview",timestamp:new Date().toISOString()})},[r,t]),o=T(a=>{let k=a.target,g=c({target:k,meaningfulTags:s});if(!g)return;let A=u(g.target,{ignore:i,prefix:n}),M={sessionId:e.current,url:t,event:`${g.name}click`,timestamp:new Date().toISOString(),attributes:JSON.stringify(A)};return r?.(M)},[r,t,i,n]);return d(()=>{l()},[l]),d(()=>(document.addEventListener("click",o),()=>{document.removeEventListener("click",o)}),[o]),null}import E from"react";function N({config:n,children:i}){return m(n),E.createElement(E.Fragment,null,i)}export{N as TrackingClientProvider,m as useTracking}; //# sourceMappingURL=index.mjs.map