Merge branch 'feature-consent-agreement-status' into develop

README.MD

@@ -196,20 +196,24 @@ const props = {
 
 ### Events
 
-Events are how you react to consent. Each type of consent emits an event when agreed to by the user.
+Events are how you react to consent. Each type of consent emits an event when set by the user. The agreement state is passed in the event’s details.
 
 For convenience when using Web Components - and to work around race conditions whereby events are emitted by the component prior to the handler being attached, we also emit the same events, with the prefix `consent`, on `window`.
 
 #### Svelte
 
 ```svelte
-<GdprBanner bind:this={gdprBanner} cookieName="foo" description="bar" on:analytics={initAnalytics} />
+<GdprBanner bind:this={gdprBanner} cookieName="foo" description="bar" on:analytics={handleAnalytics} />
 
 <script>
   import GdprBanner from '@beyonk/gdpr-cookie-consent-banner'
 
-  function initAnalytics () {
-    // some fathom analytics tracking code or similar
+  function handleAnalytics (event) {
+    if (event.detail.agreed) {
+      // some fathom analytics tracking code or similar
+    } else {
+      // disable any previously initialized analytics tracking code
+    }
   }
 </script>
 ```
@@ -228,4 +232,4 @@ For convenience when using Web Components - and to work around race conditions w
     // some fathom analytics tracking code or similar
   })
 </script>
-```
+```

src/lib/Banner.svelte

@@ -165,12 +165,10 @@
       if (choicesMerged[t]) {
         choicesMerged[t].value = agreed
       }
-      if (agreed) {
-        dispatch(t)
-        window.dispatchEvent(
-          new CustomEvent(`consent:${t}`)
-        )
-      }
+      dispatch(t, { agreed })
+      window.dispatchEvent(
+        new CustomEvent(`consent:${t}`, { detail: { agreed } })
+      )
     }
 
     shown = false

src/routes/web-component/+page.svelte

@@ -13,7 +13,11 @@
   onMount(() => {
     for (const type of types) {
       cc.addEventListener(type, (e) => {
-        console.log(`${type} consent given`)
+        if (e.detail.agreed) {
+          console.log(`${type} consent given`)
+        } else {
+          console.log(`${type} consent rejected`)
+        }
       })
     }
   })