From 1103a872821d1e9624073d4b644d771f855c06fe Mon Sep 17 00:00:00 2001
From: Paul Alexandrescu <paul.alexandrescu@thomsonreuters.com>
Date: Tue, 15 Jul 2025 22:53:06 -0400
Subject: [PATCH 1/7] feat(GTM): add GTM container with early head injection

  - Add GTM script injection via <svelte:head> for early loading
  - Include GTM noscript iframe fallback for non-JS users
  - Configure Reuters GTM container ID (GTM-P9TTSWG2)
  - Update GA and Chartbeat providers to allow loading via GTM container
---
 src/components/Analytics/Analytics.svelte     | 27 +++++++++++++++++++
 .../Analytics/providers/chartbeat.ts          |  9 +------
 src/components/Analytics/providers/ga.ts      |  9 +------
 3 files changed, 29 insertions(+), 16 deletions(-)

diff --git a/src/components/Analytics/Analytics.svelte b/src/components/Analytics/Analytics.svelte
index 7c85d2aa..da35ded2 100644
--- a/src/components/Analytics/Analytics.svelte
+++ b/src/components/Analytics/Analytics.svelte
@@ -1,5 +1,10 @@
 <!-- @component `Analytics` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/components-ads-analytics-analytics--docs) -->
 
+<script module>
+  // GTM configuration
+  const GTM_ID = 'GTM-P9TTSWG2';
+</script>
+
 <script module>
   import { registerPageview as registerChartbeatPageview } from './providers/chartbeat';
   import { registerPageview as registerGAPageview } from './providers/ga';
@@ -8,6 +13,7 @@
   function registerPageview() {
     registerChartbeatPageview();
     registerGAPageview();
+    
   }
 
   export { registerPageview };
@@ -34,3 +40,24 @@
     chartbeat(authors);
   });
 </script>
+
+<svelte:head>
+  <!-- Google Tag Manager -->
+  {@html `<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+})(window,document,'script','dataLayer','${GTM_ID}');</script>`}
+  <!-- End Google Tag Manager -->
+</svelte:head>
+
+<!-- Google Tag Manager (noscript) -->
+<noscript>
+  <iframe 
+    src="https://www.googletagmanager.com/ns.html?id={GTM_ID}"
+    height="0" 
+    width="0" 
+    style="display:none;visibility:hidden"
+  ></iframe>
+</noscript>
+<!-- End Google Tag Manager (noscript) -->
diff --git a/src/components/Analytics/providers/chartbeat.ts b/src/components/Analytics/providers/chartbeat.ts
index aedea3a0..2db1b357 100644
--- a/src/components/Analytics/providers/chartbeat.ts
+++ b/src/components/Analytics/providers/chartbeat.ts
@@ -5,14 +5,7 @@ const URL = '//static.chartbeat.com/js/chartbeat.js';
 
 const attachScript = () => {
   // If script is already attached, skip
-  if (document.querySelector(`script[src="${URL}"]`)) return;
-  // ... else attach it.
-  const e = document.createElement('script');
-  const n = document.getElementsByTagName('script')[0];
-  e.type = 'text/javascript';
-  e.async = true;
-  e.src = URL;
-  n.parentNode!.insertBefore(e, n);
+  // loaded via GTM Container 
 };
 
 export default (authors: { name: string }[]) => {
diff --git a/src/components/Analytics/providers/ga.ts b/src/components/Analytics/providers/ga.ts
index 6bd02d1d..745352ac 100644
--- a/src/components/Analytics/providers/ga.ts
+++ b/src/components/Analytics/providers/ga.ts
@@ -5,14 +5,7 @@ const URL = `https://www.googletagmanager.com/gtag/js?id=${GOOGLE_TAG_ID}`;
 
 const attachScript = () => {
   // If script is already attached, skip
-  if (document.querySelector(`script[src="${URL}"]`)) return;
-  // ... else attach it.
-  const e = document.createElement('script');
-  const n = document.getElementsByTagName('script')[0];
-  e.type = 'text/javascript';
-  e.async = true;
-  e.src = URL;
-  n.parentNode!.insertBefore(e, n);
+  // loaded via GTM Container
 };
 
 export default () => {

From 574834f0c015dcd9301516c0aef5621b5dc24712 Mon Sep 17 00:00:00 2001
From: Paul Alexandrescu <paul.alexandrescu@thomsonreuters.com>
Date: Fri, 18 Jul 2025 00:35:46 -0400
Subject: [PATCH 2/7] ESLint fixes

---
 src/components/Analytics/Analytics.svelte       | 9 +++------
 src/components/Analytics/providers/chartbeat.ts | 4 +---
 src/components/Analytics/providers/ga.ts        | 2 --
 3 files changed, 4 insertions(+), 11 deletions(-)

diff --git a/src/components/Analytics/Analytics.svelte b/src/components/Analytics/Analytics.svelte
index da35ded2..aae1c9b0 100644
--- a/src/components/Analytics/Analytics.svelte
+++ b/src/components/Analytics/Analytics.svelte
@@ -3,9 +3,7 @@
 <script module>
   // GTM configuration
   const GTM_ID = 'GTM-P9TTSWG2';
-</script>
 
-<script module>
   import { registerPageview as registerChartbeatPageview } from './providers/chartbeat';
   import { registerPageview as registerGAPageview } from './providers/ga';
 
@@ -13,7 +11,6 @@
   function registerPageview() {
     registerChartbeatPageview();
     registerGAPageview();
-    
   }
 
   export { registerPageview };
@@ -53,10 +50,10 @@ j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
 
 <!-- Google Tag Manager (noscript) -->
 <noscript>
-  <iframe 
+  <iframe
     src="https://www.googletagmanager.com/ns.html?id={GTM_ID}"
-    height="0" 
-    width="0" 
+    height="0"
+    width="0"
     style="display:none;visibility:hidden"
   ></iframe>
 </noscript>
diff --git a/src/components/Analytics/providers/chartbeat.ts b/src/components/Analytics/providers/chartbeat.ts
index 2db1b357..c2fa81a7 100644
--- a/src/components/Analytics/providers/chartbeat.ts
+++ b/src/components/Analytics/providers/chartbeat.ts
@@ -1,11 +1,9 @@
 // Reuters Chartbeat UID
 const UID = 52639;
 
-const URL = '//static.chartbeat.com/js/chartbeat.js';
-
 const attachScript = () => {
   // If script is already attached, skip
-  // loaded via GTM Container 
+  // loaded via GTM Container
 };
 
 export default (authors: { name: string }[]) => {
diff --git a/src/components/Analytics/providers/ga.ts b/src/components/Analytics/providers/ga.ts
index 745352ac..d7c89dc8 100644
--- a/src/components/Analytics/providers/ga.ts
+++ b/src/components/Analytics/providers/ga.ts
@@ -1,8 +1,6 @@
 // Reuters Google Tag ID
 const GOOGLE_TAG_ID = 'G-WBSR7WLTGD';
 
-const URL = `https://www.googletagmanager.com/gtag/js?id=${GOOGLE_TAG_ID}`;
-
 const attachScript = () => {
   // If script is already attached, skip
   // loaded via GTM Container

From 088f4683e7c6ddcd5889c97fc0aa910055b823bf Mon Sep 17 00:00:00 2001
From: paulalexandrescuTR
 <52189864+paulalexandrescuTR@users.noreply.github.com>
Date: Mon, 15 Sep 2025 15:44:18 -0400
Subject: [PATCH 3/7] Update Analytics.svelte

Update script tag formatting
---
 src/components/Analytics/Analytics.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Analytics/Analytics.svelte b/src/components/Analytics/Analytics.svelte
index aae1c9b0..e298c324 100644
--- a/src/components/Analytics/Analytics.svelte
+++ b/src/components/Analytics/Analytics.svelte
@@ -40,7 +40,7 @@
 
 <svelte:head>
   <!-- Google Tag Manager -->
-  {@html `<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+  {@html `<${'script'}>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
 new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
 j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);

From fde8f30fb5b24dc3caa2eaee1b5f22e2098d781e Mon Sep 17 00:00:00 2001
From: paulalexandrescuTR
 <52189864+paulalexandrescuTR@users.noreply.github.com>
Date: Mon, 15 Sep 2025 15:49:15 -0400
Subject: [PATCH 4/7] Update Analytics.svelte

moved GTM script into its own const
---
 src/components/Analytics/Analytics.svelte | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/src/components/Analytics/Analytics.svelte b/src/components/Analytics/Analytics.svelte
index e298c324..0d4ce9c8 100644
--- a/src/components/Analytics/Analytics.svelte
+++ b/src/components/Analytics/Analytics.svelte
@@ -3,6 +3,7 @@
 <script module>
   // GTM configuration
   const GTM_ID = 'GTM-P9TTSWG2';
+  const GTM_SCRIPT=`(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','${GTM_ID}');`
 
   import { registerPageview as registerChartbeatPageview } from './providers/chartbeat';
   import { registerPageview as registerGAPageview } from './providers/ga';
@@ -40,11 +41,7 @@
 
 <svelte:head>
   <!-- Google Tag Manager -->
-  {@html `<${'script'}>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
-new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
-j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
-'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
-})(window,document,'script','dataLayer','${GTM_ID}');</script>`}
+  {@html `<${'script'}>${GTM_SCRIPT}</script>`}
   <!-- End Google Tag Manager -->
 </svelte:head>
 

From 20eabe596a1af5397de63db1434d8d9825e8e53d Mon Sep 17 00:00:00 2001
From: hobbes7878 <Jon.McClure@thomsonreuters.com>
Date: Tue, 16 Sep 2025 08:37:06 +0100
Subject: [PATCH 5/7] cleanup

---
 src/components/Analytics/Analytics.svelte       |  3 ++-
 src/components/Analytics/providers/chartbeat.ts | 10 ----------
 src/components/Analytics/providers/ga.ts        |  6 ------
 3 files changed, 2 insertions(+), 17 deletions(-)

diff --git a/src/components/Analytics/Analytics.svelte b/src/components/Analytics/Analytics.svelte
index 0d4ce9c8..75afbe74 100644
--- a/src/components/Analytics/Analytics.svelte
+++ b/src/components/Analytics/Analytics.svelte
@@ -3,7 +3,7 @@
 <script module>
   // GTM configuration
   const GTM_ID = 'GTM-P9TTSWG2';
-  const GTM_SCRIPT=`(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','${GTM_ID}');`
+  const GTM_SCRIPT = `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','${GTM_ID}');`;
 
   import { registerPageview as registerChartbeatPageview } from './providers/chartbeat';
   import { registerPageview as registerGAPageview } from './providers/ga';
@@ -52,6 +52,7 @@
     height="0"
     width="0"
     style="display:none;visibility:hidden"
+    title=""
   ></iframe>
 </noscript>
 <!-- End Google Tag Manager (noscript) -->
diff --git a/src/components/Analytics/providers/chartbeat.ts b/src/components/Analytics/providers/chartbeat.ts
index c2fa81a7..2e978707 100644
--- a/src/components/Analytics/providers/chartbeat.ts
+++ b/src/components/Analytics/providers/chartbeat.ts
@@ -1,10 +1,6 @@
 // Reuters Chartbeat UID
 const UID = 52639;
 
-const attachScript = () => {
-  // If script is already attached, skip
-  // loaded via GTM Container
-};
 
 export default (authors: { name: string }[]) => {
   window._sf_async_config = {
@@ -17,12 +13,6 @@ export default (authors: { name: string }[]) => {
     authors: authors.map((a) => a?.name || '').join(','),
     ...(window._sf_async_config || {}),
   };
-
-  try {
-    attachScript();
-  } catch (e) {
-    console.warn(`Error initialising Chartbeat Analytics: ${e}`);
-  }
 };
 
 export const registerPageview = () => {
diff --git a/src/components/Analytics/providers/ga.ts b/src/components/Analytics/providers/ga.ts
index d7c89dc8..159f1d55 100644
--- a/src/components/Analytics/providers/ga.ts
+++ b/src/components/Analytics/providers/ga.ts
@@ -1,16 +1,10 @@
 // Reuters Google Tag ID
 const GOOGLE_TAG_ID = 'G-WBSR7WLTGD';
 
-const attachScript = () => {
-  // If script is already attached, skip
-  // loaded via GTM Container
-};
-
 export default () => {
   try {
     window.dataLayer = window.dataLayer || [];
     if (!window.gtag) {
-      attachScript();
       /** @type {Gtag.Gtag} */
       window.gtag = function () {
         // eslint-disable-next-line prefer-rest-params

From cd0dc831bef353e8de36875abb9e636553b65e41 Mon Sep 17 00:00:00 2001
From: hobbes7878 <Jon.McClure@thomsonreuters.com>
Date: Tue, 16 Sep 2025 08:37:53 +0100
Subject: [PATCH 6/7] docs(changeset): Updates analytics scripts to work with
 GDPR-compliant GTM container

---
 .changeset/gentle-guests-wonder.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/gentle-guests-wonder.md

diff --git a/.changeset/gentle-guests-wonder.md b/.changeset/gentle-guests-wonder.md
new file mode 100644
index 00000000..ef703680
--- /dev/null
+++ b/.changeset/gentle-guests-wonder.md
@@ -0,0 +1,5 @@
+---
+'@reuters-graphics/graphics-components': patch
+---
+
+Updates analytics scripts to work with GDPR-compliant GTM container

From df64d7e925d68faadeca4aaa7afa1e98fa136397 Mon Sep 17 00:00:00 2001
From: hobbes7878 <Jon.McClure@thomsonreuters.com>
Date: Tue, 16 Sep 2025 08:39:33 +0100
Subject: [PATCH 7/7] lint

---
 src/components/Analytics/providers/chartbeat.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/Analytics/providers/chartbeat.ts b/src/components/Analytics/providers/chartbeat.ts
index 2e978707..61089b31 100644
--- a/src/components/Analytics/providers/chartbeat.ts
+++ b/src/components/Analytics/providers/chartbeat.ts
@@ -1,7 +1,6 @@
 // Reuters Chartbeat UID
 const UID = 52639;
 
-
 export default (authors: { name: string }[]) => {
   window._sf_async_config = {
     uid: UID,