@affiliateo/web 2.4.0 → 3.1.0

package/dist/provider.js

@@ -1,10 +1,17 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createContext, useCallback, useContext, useEffect, useRef, useState } from 'react';
+import { EventQueue } from './queue';
+import { isLikelyBot } from './bot-detect';
 const DEFAULT_API_URL = 'https://affiliateo.com';
 const LS_VISITOR_ID = 'affiliateo_visitor_id';
 const LS_REF = 'affiliateo_ref';
 const LS_CAMPAIGN_ID = 'affiliateo_campaign_id';
+// Persistent opt-out flag. Mirrors Datafast's DATAFAST_IGNORE_TRACKING key —
+// when set to "true" the SDK silently noops every outbound call. Survives
+// page reloads. removed by optIn(). Checked at init time so a previously
+// opted-out visitor never re-fires auto-pageviews after a refresh.
+const LS_OPT_OUT = 'affiliateo_opt_out';
 // localStorage helpers
 function lsGet(key) {
     try {
@@ -20,6 +27,18 @@ function lsSet(key, value) {
     }
     catch { }
 }
+function lsRemove(key) {
+    try {
+        localStorage.removeItem(key);
+    }
+    catch { }
+}
+// True when the visitor has opted out via optOut(). Single source of truth
+// read by every outbound call so the flag works even across tabs (each tab's
+// next call re-reads localStorage).
+function isOptedOut() {
+    return lsGet(LS_OPT_OUT) === 'true';
+}
 // Generate UUID
 function uuid() {
     if (typeof crypto !== 'undefined' && crypto.randomUUID)
@@ -31,11 +50,16 @@ function uuid() {
     });
 }
 const asyncNoop = async () => { };
+const syncNoop = () => { };
 const AffiliateoContext = createContext({
     refCode: null,
     visitorId: null,
     track: asyncNoop,
     identify: asyncNoop,
+    trackPageview: asyncNoop,
+    reset: asyncNoop,
+    optOut: syncNoop,
+    optIn: syncNoop,
 });
 /**
  * Returns the affiliate ref code and visitor ID.
@@ -76,12 +100,16 @@ export function getAttribution() {
 // mount (host has the call sites) but we can shout in dev so the
 // mistake is visible.
 let providerMountCount = 0;
-export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
+export function AffiliateoProvider({ campaignId, apiUrl, allowedHostnames, children, }) {
     const [state, setState] = useState({
         refCode: null,
         visitorId: null,
         track: asyncNoop,
         identify: asyncNoop,
+        trackPageview: asyncNoop,
+        reset: asyncNoop,
+        optOut: syncNoop,
+        optIn: syncNoop,
     });
     const apiBase = (apiUrl || DEFAULT_API_URL).replace(/\/$/, '');
     // campaignIdRef stays current so callbacks defined inside useEffect
@@ -93,6 +121,15 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
     // prop changes without forcing a re-fetch / re-mint cycle. Same UUID
     // for the lifetime of the localStorage entry across the whole tab.
     const visitorIdRef = useRef(null);
+    // EventQueue lives in a ref so it persists across renders without
+    // forcing the methods (track / identify / trackPageview) to depend
+    // on it for useCallback equality. Initialized inside the route
+    // effect since EventQueue's constructor touches localStorage and
+    // window — both unavailable during SSR. Methods called before init
+    // (during the first render, before useEffect runs) silently noop;
+    // this is fine because methods are only ever called from event
+    // handlers, which fire after mount.
+    const queueRef = useRef(null);
     // track + identify are defined OUTSIDE the route-effect so they
     // close over refs (campaignIdRef, visitorIdRef) rather than the
     // captured-once values from inside the effect. A consumer caching
@@ -101,6 +138,10 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
         try {
             if (typeof window === 'undefined')
                 return;
+            // Opt-out is checked at call time (not init time) so a visitor who
+            // opts out mid-session stops firing immediately on the next track().
+            if (isOptedOut())
+                return;
             if (!eventName || typeof eventName !== 'string')
                 return;
             const name = eventName.trim().toLowerCase();
@@ -118,19 +159,11 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
             };
             if (metadata && typeof metadata === 'object')
                 payload.metadata = metadata;
-            const data = JSON.stringify(payload);
-            const endpoint = `${apiBase}/api/v1/web/event`;
-            if (navigator.sendBeacon) {
-                navigator.sendBeacon(endpoint, new Blob([data], { type: 'application/json' }));
-            }
-            else {
-                fetch(endpoint, {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: data,
-                    keepalive: true,
-                }).catch(() => { });
-            }
+            // Enqueue. EventQueue handles persist, retry, and flush. If the
+            // queue hasn't initialized yet (called during first render before
+            // useEffect runs), this noops — that's a vanishingly rare race
+            // since track() is virtually always called from a click handler.
+            queueRef.current?.enqueue(`${apiBase}/api/v1/web/event`, payload);
         }
         catch { /* swallow */ }
     }, [apiBase]);
@@ -141,6 +174,8 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
         try {
             if (typeof window === 'undefined')
                 return;
+            if (isOptedOut())
+                return;
             if (!userId || typeof userId !== 'string')
                 return;
             const uid = userId.trim();
@@ -158,22 +193,109 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
                 visitor_id: vid,
                 user_id: uid,
             };
-            const data = JSON.stringify(payload);
-            const url = `${apiBase}/api/v1/web/identify`;
-            if (navigator.sendBeacon) {
-                navigator.sendBeacon(url, new Blob([data], { type: 'application/json' }));
-            }
-            else {
-                fetch(url, {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: data,
-                    keepalive: true,
-                }).catch(() => { });
-            }
+            queueRef.current?.enqueue(`${apiBase}/api/v1/web/identify`, payload);
+        }
+        catch { /* swallow */ }
+    }, [apiBase]);
+    // Manual pageview. Mirrors Datafast's trackPageview(path?). Same payload
+    // shape the auto-fired pageview uses (see sendPageview inside the route
+    // effect below) so server-side routing / dedup / IP+UA enrichment behave
+    // identically for both code paths.
+    //
+    // Defined here as a useCallback (not inside the effect) so React consumers
+    // who cache the function reference across renders aren't pointing at a
+    // stale closure. Reads from refs for the per-render-stable bits and
+    // localStorage for the persisted attribution (ref code), so the call
+    // always sees the latest values.
+    const trackPageview = useCallback(async (path) => {
+        try {
+            if (typeof window === 'undefined')
+                return;
+            if (isOptedOut())
+                return;
+            const cid = campaignIdRef.current;
+            const vid = visitorIdRef.current;
+            if (!cid || !vid)
+                return;
+            const params = new URLSearchParams(window.location.search);
+            const pagePath = path || window.location.pathname;
+            // url: if caller passed a path, resolve it against origin for a full
+            // href the server can dedup on. Otherwise use the actual location.
+            const url = path
+                ? new URL(path, window.location.origin).href
+                : window.location.href;
+            const payload = {
+                type: 'pageview',
+                campaign_id: cid,
+                visitor_id: vid,
+                url,
+                path: pagePath,
+                hostname: window.location.hostname,
+                referrer: document.referrer || '',
+                ref: lsGet(LS_REF) || '',
+                utm_source: params.get('utm_source') || '',
+                utm_medium: params.get('utm_medium') || '',
+                utm_campaign: params.get('utm_campaign') || '',
+                screen_width: window.innerWidth,
+            };
+            queueRef.current?.enqueue(`${apiBase}/api/v1/web/event`, payload);
         }
         catch { /* swallow */ }
     }, [apiBase]);
+    // reset(): wipe visitor identity. Mints a fresh UUID and clears the
+    // affiliate ref so the next pageview is a brand-new anonymous visitor.
+    // The campaign_id stays (it's a property of the site, not the visitor).
+    //
+    // Matches Datafast's reset() semantics for non-cookieless mode: new
+    // visitor, no event fired, caller handles "tell the server about it"
+    // by triggering whatever pageview / navigation comes next.
+    //
+    // Returns a Promise so callers can `await reset()` before navigating
+    // (the localStorage writes are sync but the Promise lets the API stay
+    // consistent with Datafast's async signature, future-proofing for
+    // server-minted IDs in cookieless mode).
+    const reset = useCallback(async () => {
+        try {
+            if (typeof window === 'undefined')
+                return;
+            // Drain any pending events for the OLD visitor before swapping IDs,
+            // otherwise they'd land server-side stamped to the OLD visitor_id
+            // (correct) but persisted-in-localStorage as if to-be-retried under
+            // the new identity — confusing on retry inspection. Best effort.
+            void queueRef.current?.flush();
+            queueRef.current?.clear();
+            const newVid = uuid();
+            lsSet(LS_VISITOR_ID, newVid);
+            lsRemove(LS_REF);
+            visitorIdRef.current = newVid;
+            setState((prev) => ({ ...prev, visitorId: newVid, refCode: null }));
+        }
+        catch { /* swallow */ }
+    }, []);
+    // optOut(): persistent "don't track me" flag. After this call every
+    // track / identify / trackPageview noops until optIn() is called. The
+    // flag survives reloads via localStorage, so a visitor who opts out
+    // stays opted out across browser sessions on the same device.
+    //
+    // We don't actively send a "stop tracking me" signal to the server —
+    // the server only knows about visitors who ping it, so an opted-out
+    // visitor simply stops appearing. The visitor row left behind in
+    // Postgres ages out via normal retention.
+    const optOut = useCallback(() => {
+        lsSet(LS_OPT_OUT, 'true');
+        // Drop pending events too. The visitor explicitly said no — sending
+        // queued events from before the opt-out would still violate consent
+        // even if those events were captured prior to the user's decision.
+        queueRef.current?.clear();
+    }, []);
+    // optIn(): remove the opt-out flag. Tracking RESUMES for any future
+    // calls (track / identify / trackPageview) but the in-flight auto-
+    // pageview that already noop'd on this render won't retroactively
+    // send. A page reload is the cleanest way to get a fresh auto-fired
+    // pageview after opting back in.
+    const optIn = useCallback(() => {
+        lsRemove(LS_OPT_OUT);
+    }, []);
     const sentRef = useRef(false);
     useEffect(() => {
         if (typeof window === 'undefined')
@@ -186,37 +308,119 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
             // eslint-disable-next-line no-console
             console.warn('[Affiliateo] AffiliateoProvider mounted more than once. Mount it exactly once near the root of your app, or pageviews will double-fire.');
         }
-        // Get or create visitor ID
-        let vid = lsGet(LS_VISITOR_ID);
+        // Client-side bot detection. If the current browser context looks
+        // like Selenium / Puppeteer / curl / a known automation tool, skip
+        // ALL tracking before we even mint a queue. The server-side UA
+        // regex + Turnstile catch anything that sneaks past this check —
+        // this just saves the bot a round-trip and saves us a request.
+        //
+        // The hook still returns the four control methods (reset / optOut /
+        // etc) so a host UI that happens to render in a headless context
+        // doesn't crash on `useAffiliateRef().reset()`. They're noops, which
+        // is the correct behavior since there's no real visitor to act on.
+        if (isLikelyBot()) {
+            setState({
+                refCode: null,
+                visitorId: null,
+                track: asyncNoop,
+                identify: asyncNoop,
+                trackPageview: asyncNoop,
+                reset: asyncNoop,
+                optOut: syncNoop,
+                optIn: syncNoop,
+            });
+            return;
+        }
+        // Initialize the event queue. Done inside useEffect (not in a useRef
+        // initializer) so the EventQueue constructor — which touches
+        // localStorage on hydration — only ever runs client-side. The queue
+        // takes over delivery for track / identify / trackPageview AND the
+        // auto-fired pageview below; only session_end stays on sendBeacon
+        // because tab-close urgency beats queue-retry reliability.
+        if (queueRef.current === null) {
+            queueRef.current = new EventQueue();
+        }
+        const queue = queueRef.current;
+        // Opt-out short-circuit. A visitor who previously called optOut()
+        // gets ZERO outbound traffic on this page load. We still mint the
+        // visitor_id (so optIn() + reload picks up the same identity rather
+        // than starting fresh, which would split their history), but skip
+        // ALL beacons including the auto-pageview, plus skip the event
+        // listeners (no point in firing session_end for a visitor we never
+        // told the server about). The hook still returns the four control
+        // methods so the host's banner UI can call optIn() / reset().
+        if (isOptedOut()) {
+            let optedOutVid = lsGet(LS_VISITOR_ID);
+            if (!optedOutVid) {
+                optedOutVid = uuid();
+                lsSet(LS_VISITOR_ID, optedOutVid);
+            }
+            visitorIdRef.current = optedOutVid;
+            setState({
+                refCode: null,
+                visitorId: optedOutVid,
+                track, identify, trackPageview, reset, optOut, optIn,
+            });
+            // Don't leave a queue running for an opted-out visitor — the timer
+            // would just keep waking up to flush nothing.
+            queue.shutdown();
+            queueRef.current = null;
+            return;
+        }
+        // ── Cross-domain handoff: read incoming URL params ───────────────────
+        // When a visitor arrives from another domain in the merchant's family
+        // (configured via the `allowedHostnames` prop on the OTHER domain's
+        // <AffiliateoProvider>), the inbound link carries visitor_id + ref
+        // code as URL params. We pull those in BEFORE checking localStorage
+        // so the cross-domain identity wins over whatever this domain's
+        // sandboxed storage had. Without it, the funnel sees the same person
+        // as two unrelated visitors after every cross-domain hop, and any
+        // affiliate ref captured on the previous domain is silently lost.
+        //
+        // After consuming, we strip the params via history.replaceState so
+        // the visitor never sees `?_affiliateo_vid=...` in their URL bar.
+        // UUID + ref are validated before persistence so a malicious
+        // /?_affiliateo_vid=<garbage> URL can't poison localStorage.
+        const params = new URLSearchParams(window.location.search);
+        const UUID_RE = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+        let incomingVid = params.get('_affiliateo_vid') || '';
+        let incomingRef = params.get('_affiliateo_ref') || '';
+        if (incomingVid && !UUID_RE.test(incomingVid))
+            incomingVid = '';
+        if (incomingRef && (incomingRef.length > 64 || !/^[\w.-]+$/.test(incomingRef))) {
+            incomingRef = '';
+        }
+        if (incomingVid || incomingRef) {
+            try {
+                const cleanUrl = new URL(window.location.href);
+                cleanUrl.searchParams.delete('_affiliateo_vid');
+                cleanUrl.searchParams.delete('_affiliateo_ref');
+                history.replaceState(history.state, '', cleanUrl.toString());
+            }
+            catch { /* swallow */ }
+        }
+        // Get or create visitor ID. Cross-domain inbound wins over localStorage
+        // so the same person across two domains stays one visitor.
+        let vid = incomingVid || lsGet(LS_VISITOR_ID);
         if (!vid) {
             vid = uuid();
         }
         lsSet(LS_VISITOR_ID, vid);
         lsSet(LS_CAMPAIGN_ID, campaignIdRef.current);
         visitorIdRef.current = vid;
-        // Read ref from URL params or localStorage
-        const params = new URLSearchParams(window.location.search);
-        const ref = params.get('ref') || params.get('via') || params.get('source')
+        // Read ref. Cross-domain inbound wins, then fresh affiliate link
+        // params (?ref / ?via / ?source), then stored value.
+        const ref = incomingRef || params.get('ref') || params.get('via') || params.get('source')
             || lsGet(LS_REF) || null;
         if (ref) {
             lsSet(LS_REF, ref);
         }
         const endpoint = `${apiBase}/api/v1/web/event`;
-        setState({ refCode: ref, visitorId: vid, track, identify });
-        function beacon(payload) {
-            const data = JSON.stringify(payload);
-            if (navigator.sendBeacon) {
-                navigator.sendBeacon(endpoint, new Blob([data], { type: 'application/json' }));
-            }
-            else {
-                fetch(endpoint, {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: data,
-                    keepalive: true,
-                }).catch(() => { });
-            }
-        }
+        setState({
+            refCode: ref,
+            visitorId: vid,
+            track, identify, trackPageview, reset, optOut, optIn,
+        });
         // Throttle: max 1 pageview per second
         let lastSendTime = 0;
         function sendPageview() {
@@ -225,7 +429,7 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
                 return;
             lastSendTime = now;
             ended = false;
-            beacon({
+            queue.enqueue(endpoint, {
                 type: 'pageview',
                 campaign_id: campaignIdRef.current,
                 visitor_id: vid,
@@ -240,13 +444,43 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
                 screen_width: window.innerWidth,
             });
         }
-        // Send session_end when user leaves
+        // Send session_end when user leaves.
+        //
+        // session_end intentionally bypasses the queue and uses sendBeacon
+        // directly. The queue's fetch-with-keepalive is great for normal
+        // events because it returns a status code we can retry on, but it
+        // can't guarantee the request lands when the tab is in the act of
+        // closing — fetch may be aborted mid-flight. sendBeacon was
+        // designed exactly for this case and CANNOT be cancelled by the
+        // unload handler. We also try to drain the queue's pending events
+        // here, which uses sendBeacon under the hood for the same reason.
         let ended = false;
         function sendEnd() {
             if (ended)
                 return;
             ended = true;
-            beacon({ type: 'session_end', campaign_id: campaignIdRef.current, visitor_id: vid, ref: ref || lsGet(LS_REF) || '' });
+            // Drain the queue first so any pending track / identify events
+            // get a last shot before the tab closes. flushOnUnload uses
+            // sendBeacon internally, no retry needed because there's no
+            // retry opportunity after this.
+            queue.flushOnUnload();
+            const data = JSON.stringify({
+                type: 'session_end',
+                campaign_id: campaignIdRef.current,
+                visitor_id: vid,
+                ref: ref || lsGet(LS_REF) || '',
+            });
+            if (navigator.sendBeacon) {
+                navigator.sendBeacon(endpoint, new Blob([data], { type: 'application/json' }));
+            }
+            else {
+                fetch(endpoint, {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: data,
+                    keepalive: true,
+                }).catch(() => { });
+            }
         }
         // Server-side session window. Matches STALE_VISITOR_MS in the
         // tracking Durable Object — after this much idle time the server
@@ -303,113 +537,96 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
             origReplaceState.apply(this, args);
             onUrlChange();
         };
-        // HTML-attribute goal tracking. match Datafast's `data-fast-goal`
-        // ergonomics. Any element with `data-affiliateo-goal="event_name"`
-        // fires that goal on click. Optional `data-affiliateo-goal-*`
-        // attributes become metadata (kebab-case to snake_case, max 10).
+        // HTML-attribute goal scanning (`data-affiliateo-goal`,
+        // `data-affiliateo-scroll`) and the IntersectionObserver that drove
+        // them were removed in 3.0.0 to match Datafast's npm SDK ergonomics:
+        // SDK does pageview + track() + identify(); merchants fire goals
+        // themselves via onClick={() => track('signup_clicked')} or by
+        // wiring their own IntersectionObserver and calling track() from it.
+        //
+        // Why removed: the scanning layer was the source of every funnel
+        // bug we hit (threshold:0 firing on hero sections, SPA mutation
+        // observer races, client-side step matching from HTML). Removing it
+        // also drops ~80 lines of code and one extra DOM observer per page.
+        // ── Cross-domain handoff: decorate outbound links ──────────────────
+        // When a visitor clicks an <a> link to one of the merchant's other
+        // domains (passed in via the `allowedHostnames` prop), append
+        // visitor_id + ref code as URL search params before the browser
+        // navigates. The receiving domain's <AffiliateoProvider> reads those
+        // params on landing (the inbound block above) and uses them as
+        // identity for that domain.
         //
-        // Delegated listener on document.body so the merchant doesn't have
-        // to re-attach handlers when their SPA re-renders. Capture phase off
-        // so React's synthetic event ordering isn't disturbed.
-        function onDocClick(e) {
-            const target = e.target;
-            if (!(target instanceof Element))
+        // Hostnames are normalized once and matched exact (no wildcards) so
+        // merchants who want subdomains list each one explicitly. Same-host
+        // links, non-http(s) protocols (mailto:, tel:, javascript:), and
+        // anchor links (#section) are skipped. Capture phase so we run
+        // before merchant click handlers; href mutation is advisory and the
+        // browser reads link.href when it eventually navigates.
+        const allowedHosts = Array.isArray(allowedHostnames)
+            ? allowedHostnames
+                .map((h) => (typeof h === 'string' ? h.trim().toLowerCase() : ''))
+                .filter((h) => !!h)
+            : [];
+        function decorateOutboundLink(link) {
+            if (!link || !link.href || !link.hostname)
                 return;
-            const el = target.closest('[data-affiliateo-goal]');
-            if (!el)
+            if (link.protocol !== 'http:' && link.protocol !== 'https:')
                 return;
-            const goal = el.getAttribute('data-affiliateo-goal');
-            if (!goal)
+            const host = link.hostname.toLowerCase();
+            if (host === window.location.hostname.toLowerCase())
                 return;
-            const meta = {};
-            let count = 0;
-            for (const { name, value } of Array.from(el.attributes)) {
-                if (!name.startsWith('data-affiliateo-goal-'))
-                    continue;
-                // Skip the bare "data-affiliateo-goal" attribute itself
-                // (slice would produce an empty key).
-                if (name === 'data-affiliateo-goal')
-                    continue;
-                if (count >= 10)
-                    break;
-                const key = name.slice('data-affiliateo-goal-'.length).replace(/-/g, '_');
-                // Skip the reserved `event` key so an attribute like
-                // `data-affiliateo-goal-event="x"` can't override the actual
-                // goal name when the SDK / server folds metadata.event in.
-                if (!key || key === 'event')
-                    continue;
-                if (value) {
-                    meta[key] = String(value).slice(0, 255);
-                    count++;
-                }
+            if (allowedHosts.indexOf(host) === -1)
+                return;
+            try {
+                const u = new URL(link.href);
+                // Idempotent: skip if our params are already present.
+                if (u.searchParams.has('_affiliateo_vid'))
+                    return;
+                const currentVid = visitorIdRef.current;
+                const currentRef = lsGet(LS_REF) || '';
+                if (currentVid)
+                    u.searchParams.set('_affiliateo_vid', currentVid);
+                if (currentRef)
+                    u.searchParams.set('_affiliateo_ref', currentRef);
+                link.href = u.toString();
             }
-            track(goal, count ? meta : undefined);
+            catch { /* swallow */ }
         }
-        document.addEventListener('click', onDocClick);
-        // Scroll-depth goal tracking. `data-affiliateo-scroll="event_name"`
-        // on any element fires that goal the first time the element enters
-        // the viewport. Use IntersectionObserver (cheap, off the scroll hot
-        // path) and unobserve after the first fire so the same element can't
-        // double-count if the user scrolls back up.
-        //
-        // No options object → IntersectionObserver defaults to
-        // { threshold: 0, rootMargin: '0px 0px 0px 0px' }, which fires the
-        // instant ANY pixel of the section overlaps the viewport. That's
-        // exactly the semantic merchants want for "did the visitor reach
-        // this section": if they scrolled enough to see even a sliver of
-        // it, count it. Earlier versions used { threshold: 0.5 }, which
-        // was unreachable for tall sections (a 1600px pricing section in
-        // an 800px viewport tops out at ~50% intersection ratio and never
-        // crossed the threshold) — funnel steps tied to those sections
-        // silently dropped from every merchant's conversion count.
-        const scrollFired = new WeakSet();
-        let scrollObserver = null;
-        let scrollMo = null;
-        if (typeof IntersectionObserver !== 'undefined') {
-            scrollObserver = new IntersectionObserver((entries) => {
-                for (const entry of entries) {
-                    if (!entry.isIntersecting)
-                        continue;
-                    if (scrollFired.has(entry.target))
-                        continue;
-                    scrollFired.add(entry.target);
-                    const goal = entry.target.getAttribute('data-affiliateo-scroll');
-                    if (goal)
-                        track(goal);
-                    scrollObserver?.unobserve(entry.target);
-                }
-            });
-            // Observe everything that exists at mount time.
-            document.querySelectorAll('[data-affiliateo-scroll]').forEach((el) => {
-                scrollObserver?.observe(el);
-            });
-            // SPA-rendered sections that appear later get observed via
-            // MutationObserver. Cheap because we only scan added nodes, not
-            // the whole tree on each mutation.
-            scrollMo = new MutationObserver((mutations) => {
-                for (const m of mutations) {
-                    m.addedNodes.forEach((node) => {
-                        if (!(node instanceof Element))
-                            return;
-                        if (node.hasAttribute('data-affiliateo-scroll'))
-                            scrollObserver?.observe(node);
-                        node.querySelectorAll?.('[data-affiliateo-scroll]').forEach((el) => scrollObserver?.observe(el));
-                    });
-                }
-            });
-            scrollMo.observe(document.body, { childList: true, subtree: true });
+        function onClickForLinkDecoration(ev) {
+            const t = ev.target;
+            if (!t || !t.closest)
+                return;
+            decorateOutboundLink(t.closest('a'));
+        }
+        function onKeydownForLinkDecoration(ev) {
+            if (ev.key !== 'Enter' && ev.key !== ' ')
+                return;
+            const t = ev.target;
+            if (!t || !t.closest)
+                return;
+            decorateOutboundLink(t.closest('a'));
+        }
+        if (allowedHosts.length > 0) {
+            document.addEventListener('click', onClickForLinkDecoration, true);
+            document.addEventListener('keydown', onKeydownForLinkDecoration, true);
         }
         return () => {
             document.removeEventListener('visibilitychange', onVisibilityChange);
             window.removeEventListener('pagehide', sendEnd);
             window.removeEventListener('popstate', onUrlChange);
-            document.removeEventListener('click', onDocClick);
-            scrollMo?.disconnect();
-            scrollObserver?.disconnect();
             history.pushState = origPushState;
             history.replaceState = origReplaceState;
+            if (allowedHosts.length > 0) {
+                document.removeEventListener('click', onClickForLinkDecoration, true);
+                document.removeEventListener('keydown', onKeydownForLinkDecoration, true);
+            }
+            // Stop the queue's flush timer. The queue tries one final flush
+            // before going quiet — anything still queued lives in localStorage
+            // and will be picked up by the next page load's queue init.
+            queue.shutdown();
+            queueRef.current = null;
             providerMountCount = Math.max(0, providerMountCount - 1);
         };
-    }, [apiBase, track, identify]);
+    }, [apiBase, allowedHostnames, track, identify, trackPageview, reset, optOut, optIn]);
     return (_jsx(AffiliateoContext.Provider, { value: state, children: children }));
 }