@convex-internal/web-analytics 2.0.0 → 2.1.0

package/README.md

@@ -31,13 +31,8 @@ capture("www-login", undefined, {
 
 ### Consent banner
 
-The banner shows when `consent` is `"undecided"`. It records
-`cookie_consent_shown` when it appears and `cookie_consent_decided` with
-`{ decision: "accepted" | "declined" }` just before the choice is saved.
-
-The banner stays hidden while Global Privacy Control is on, because that
-resolves `consent` to `"declined"` rather than `"undecided"`. GPC does not
-write the cookie; see [Cookie behavior](#cookie-behavior).
+The banner is visible when `consent` is `"undecided"`. It is hidden while
+`consent` is `"unknown"`, `"consented"`, or `"declined"`.
 
 Theme with `--wa-banner-*` variables on `.wa-banner`:
 
@@ -59,13 +54,22 @@ Theme with `--wa-banner-*` variables on `.wa-banner`:
 - Link and focus: `--wa-banner-link-color`, `--wa-banner-focus-color`
 - Buttons: `--wa-banner-button-border-radius`, `--wa-banner-button-padding`,
   `--wa-banner-button-min-height`, `--wa-banner-button-font-size`,
-  `--wa-banner-button-font-weight`, `--wa-banner-button-line-height`
+  `--wa-banner-button-font-weight`
 - Accept button: `--wa-banner-accept-background-color`, `--wa-banner-accept-text-color`
 - Decline button: `--wa-banner-decline-background-color`,
   `--wa-banner-decline-text-color`
 
 Buttons default to 80% opacity and go to 100% on hover or keyboard focus.
 
+### Consent events
+
+`cookie_consent_shown` is recorded when the banner appears.
+`cookie_consent_decided` is recorded with
+`{ decision: "accepted" | "declined", source: "banner" }` just before the
+choice is saved, and with `{ decision: "declined", source: "gpc" }` when
+the GPC preference is applied. Historic events without `source` are banner
+decisions.
+
 ### Cookie behavior
 
 Once the cookie has been read, `consent` is resolved in this order:

package/dist/banner.css

@@ -14,6 +14,7 @@
   color: var(--wa-banner-text-color, black);
   font-family: var(--wa-banner-font-family, inherit);
   font-size: var(--wa-banner-font-size, 1rem);
+  line-height: 1.25;
 
   .wa-banner-text {
     margin: 0 0 0.5rem;
@@ -44,7 +45,7 @@
     font-family: inherit;
     font-size: var(--wa-banner-button-font-size, inherit);
     font-weight: var(--wa-banner-button-font-weight, inherit);
-    line-height: var(--wa-banner-button-line-height, inherit);
+    line-height: 1;
     cursor: pointer;
     opacity: 0.8;
     transition: opacity 0.15s;

package/dist/react/ConsentBanner.js

@@ -1,14 +1,16 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef } from "react";
-import { bannerCopy } from "../strings.js";
 import { capture } from "../capture.js";
+import { hasGPC } from "../consent.js";
+import { bannerCopy } from "../strings.js";
 import { useConsent } from "./useConsent.js";
 import "../banner.css";
 export function ConsentBanner() {
     const { consent, setConsent } = useConsent();
     const shouldShow = consent === "undecided";
     const wasShowing = useRef(false);
+    const recordedGPCDecision = useRef(false);
     useEffect(() => {
         if (shouldShow && !wasShowing.current) {
             // Captures once when the banner becomes visible, not on later renders.
@@ -16,13 +18,22 @@ export function ConsentBanner() {
         }
         wasShowing.current = shouldShow;
     }, [shouldShow]);
+    useEffect(() => {
+        if (consent === "declined" && hasGPC() && !recordedGPCDecision.current) {
+            recordedGPCDecision.current = true;
+            capture("cookie_consent_decided", {
+                decision: "declined",
+                source: "gpc",
+            });
+        }
+    }, [consent]);
     if (!shouldShow) {
         return null;
     }
     const decide = (decision) => {
         try {
             // Captures before the cookie write so decline is captured cookieless.
-            capture("cookie_consent_decided", { decision });
+            capture("cookie_consent_decided", { decision, source: "banner" });
         }
         finally {
             setConsent(decision === "accepted" ? "consented" : "declined");

package/dist/svelte/WebAnalytics.svelte

@@ -9,6 +9,7 @@
 
   let isReady = $state(false);
   let cookieValue = $state<boolean | undefined>(undefined);
+  let recordedGPCDecision = false;
 
   const consent = $derived(resolveConsent(isReady, cookieValue, hasGPC()));
   const shouldShowBanner = $derived(consent === "undecided");
@@ -60,6 +61,17 @@
     wasShowingBanner = shouldShowBanner;
   });
 
+  $effect(() => {
+    if (consent === "declined" && hasGPC() && !recordedGPCDecision) {
+      // GPC hides the banner, so record the decline here instead of a click.
+      recordedGPCDecision = true;
+      capture("cookie_consent_decided", {
+        decision: "declined",
+        source: "gpc",
+      });
+    }
+  });
+
   function setConsent(status: "consented" | "declined") {
     setCookie(COOKIE_NAME, status === "consented" ? "true" : "false");
     cookieValue = status === "consented";
@@ -68,7 +80,7 @@
   function decide(decision: "accepted" | "declined") {
     try {
       // Captures before the cookie write so decline is captured cookieless.
-      capture("cookie_consent_decided", { decision });
+      capture("cookie_consent_decided", { decision, source: "banner" });
     } finally {
       setConsent(decision === "accepted" ? "consented" : "declined");
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@convex-internal/web-analytics",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "type": "module",
   "exports": {
     ".": {