From 88bd6157686472aff1a2397c7f66b5f13c5c4d40 Mon Sep 17 00:00:00 2001
From: George Cushen <gcushen@users.noreply.github.com>
Date: Wed, 20 Aug 2025 23:54:10 +0100
Subject: [PATCH] build: unify vendor pipeline, externalize head JS, switch
 docs to pnpm

- Remove modules/blox-tailwind/vite.config.js; use root Vite vendor task
- Vendor alpinejs and markmap; add vendor-libs.js stub
- Replace inline head scripts with CSP-friendly hb-head.js; add font preload + fingerprint
- Update scripts/docs to pnpm; remove unused @tailwindcss/vite
---
 modules/blox-tailwind/assets/js/hb-head.js    |  7 +++
 modules/blox-tailwind/assets/js/hb-init.js    | 44 +++++++++++++++
 .../blox-tailwind/assets/js/vendor-libs.js    |  5 ++
 .../layouts/_partials/site_head.html          | 55 +++----------------
 modules/blox-tailwind/package.json            |  2 +-
 modules/blox-tailwind/vite.config.js          | 43 ---------------
 package.json                                  |  4 +-
 vite.config.js                                | 10 +++-
 8 files changed, 74 insertions(+), 96 deletions(-)
 create mode 100644 modules/blox-tailwind/assets/js/hb-head.js
 create mode 100644 modules/blox-tailwind/assets/js/hb-init.js
 create mode 100644 modules/blox-tailwind/assets/js/vendor-libs.js
 delete mode 100644 modules/blox-tailwind/vite.config.js

diff --git a/modules/blox-tailwind/assets/js/hb-head.js b/modules/blox-tailwind/assets/js/hb-head.js
new file mode 100644
index 00000000..71b60800
--- /dev/null
+++ b/modules/blox-tailwind/assets/js/hb-head.js
@@ -0,0 +1,7 @@
+import { initTheme, applyHugoStyleFixes } from './hb-init.js'
+
+initTheme()
+applyHugoStyleFixes()
+
+
+
diff --git a/modules/blox-tailwind/assets/js/hb-init.js b/modules/blox-tailwind/assets/js/hb-init.js
new file mode 100644
index 00000000..f221c2f1
--- /dev/null
+++ b/modules/blox-tailwind/assets/js/hb-init.js
@@ -0,0 +1,44 @@
+// Hugo Blox JS Global Init (CSP-friendly)
+export function initTheme() {
+  const root = document.documentElement;
+  const defaultTheme = root.dataset.wcThemeDefault;
+  const setDark = () => { root.classList.add('dark'); root.style.colorScheme = 'dark'; };
+  const setLight = () => { root.classList.remove('dark'); root.style.colorScheme = 'light'; };
+
+  if ('wc-color-theme' in localStorage) {
+    localStorage.getItem('wc-color-theme') === 'dark' ? setDark() : setLight();
+  } else {
+    if (defaultTheme === 'dark') setDark();
+    else if (defaultTheme === 'light') setLight();
+    else if (defaultTheme === 'system') {
+      window.matchMedia('(prefers-color-scheme: dark)').matches ? setDark() : setLight();
+    }
+  }
+}
+
+export function applyHugoStyleFixes() {
+  document.addEventListener('DOMContentLoaded', function () {
+    const checkboxes = document.querySelectorAll("li input[type='checkbox'][disabled]");
+    checkboxes.forEach((e) => {
+      const parent = e.parentElement?.parentElement;
+      if (parent) parent.classList.add('task-list');
+    });
+
+    const liNodes = document.querySelectorAll('.task-list li');
+    liNodes.forEach((nodes) => {
+      const textNodes = Array.from(nodes.childNodes).filter(
+        (node) => node.nodeType === 3 && node.textContent && node.textContent.trim().length > 1,
+      );
+      if (textNodes.length > 0) {
+        const span = document.createElement('label');
+        textNodes[0].after(span);
+        const input = nodes.querySelector("input[type='checkbox']");
+        if (input) span.appendChild(input);
+        span.appendChild(textNodes[0]);
+      }
+    });
+  });
+}
+
+
+
diff --git a/modules/blox-tailwind/assets/js/vendor-libs.js b/modules/blox-tailwind/assets/js/vendor-libs.js
new file mode 100644
index 00000000..51eb3ef6
--- /dev/null
+++ b/modules/blox-tailwind/assets/js/vendor-libs.js
@@ -0,0 +1,5 @@
+// Dummy entry for Vite lib mode. We copy vendor libraries via vite-plugin-static-copy.
+export default {}
+
+
+
diff --git a/modules/blox-tailwind/layouts/_partials/site_head.html b/modules/blox-tailwind/layouts/_partials/site_head.html
index a5ac3962..2faa88c0 100644
--- a/modules/blox-tailwind/layouts/_partials/site_head.html
+++ b/modules/blox-tailwind/layouts/_partials/site_head.html
@@ -76,54 +76,12 @@
     <link href="{{ $styles.RelPermalink }}" rel="stylesheet" />
   {{ end }}
 
-  <script>
-    /* Hugo Blox JS Global Init */
-    window.hbb = {
-       defaultTheme: document.documentElement.dataset.wcThemeDefault,
-       setDarkTheme: () => {
-        document.documentElement.classList.add("dark");
-        document.documentElement.style.colorScheme = "dark";
-      },
-       setLightTheme: () => {
-        document.documentElement.classList.remove("dark");
-        document.documentElement.style.colorScheme = "light";
-      }
-    }
-
-    console.debug(`Default Hugo Blox Builder theme is ${window.hbb.defaultTheme}`);
-
-    if ("wc-color-theme" in localStorage) {
-      localStorage.getItem("wc-color-theme") === "dark" ? window.hbb.setDarkTheme() : window.hbb.setLightTheme();
-    } else {
-      window.hbb.defaultTheme === "dark" ? window.hbb.setDarkTheme() : window.hbb.setLightTheme();
-      if (window.hbb.defaultTheme === "system") {
-        window.matchMedia("(prefers-color-scheme: dark)").matches ? window.hbb.setDarkTheme() : window.hbb.setLightTheme();
-      }
-    }
-  </script>
-
-  <script>
-    // Apply Hugo style fixes
-    document.addEventListener('DOMContentLoaded', function () {
-      // Fix Hugo task list style
-      let checkboxes = document.querySelectorAll('li input[type=\'checkbox\'][disabled]');
-      checkboxes.forEach(e => {
-        e.parentElement.parentElement.classList.add('task-list');
-      });
-
-      // Fix Hugo missing <label> around checkbox and its text (fixes Lighthouse accessibility errors)
-      const liNodes = document.querySelectorAll('.task-list li');
-      liNodes.forEach(nodes => {
-        let textNodes = Array.from(nodes.childNodes).filter(node => node.nodeType === 3 && node.textContent.trim().length > 1);
-        if (textNodes.length > 0) {
-          const span = document.createElement('label');
-          textNodes[0].after(span);  // Use first text node as label
-          span.appendChild(nodes.querySelector('input[type=\'checkbox\']'));
-          span.appendChild(textNodes[0]);
-        }
-      });
-    });
-  </script>
+  {{/* Externalized init scripts for CSP-friendly head */}}
+  {{- $hb_head := resources.Get "js/hb-head.js" | js.Build | resources.Minify -}}
+  {{- if hugo.IsProduction -}}
+    {{- $hb_head = $hb_head | fingerprint "sha256" -}}
+  {{- end -}}
+  <script defer src="{{ $hb_head.RelPermalink }}"{{ if hugo.IsProduction }} integrity="{{ $hb_head.Data.Integrity }}" crossorigin="anonymous"{{ end }}></script>
 
   {{/* Analytics & Verification */}}
   {{/* !CACHED! All analytics and verification code is at site level */}}
@@ -218,6 +176,7 @@
     {{ $font_type = "woff2" }}
   {{end}}
   {{ $font := resources.Get (printf "dist/font/%s" $font_file) }}
+  <link rel="preload" href="{{ $font.RelPermalink }}" as="font" type="font/{{ $font_type }}" crossorigin>
   <style>
     @font-face {
       font-family: '{{$font_family}}';
diff --git a/modules/blox-tailwind/package.json b/modules/blox-tailwind/package.json
index 98dd768c..6b48788f 100644
--- a/modules/blox-tailwind/package.json
+++ b/modules/blox-tailwind/package.json
@@ -17,7 +17,7 @@
     "vite-plugin-static-copy": "^3.1.1"
   },
   "devDependencies": {
-    "@tailwindcss/vite": "^4.1.12"
+    
   },
   "homepage": "https://hugoblox.com",
   "repository": {
diff --git a/modules/blox-tailwind/vite.config.js b/modules/blox-tailwind/vite.config.js
deleted file mode 100644
index b55b0687..00000000
--- a/modules/blox-tailwind/vite.config.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import {defineConfig} from 'vite'
-import {viteStaticCopy} from 'vite-plugin-static-copy'
-import {rm} from 'node:fs/promises'
-
-const distDir = './assets/dist/lib';
-
-
-export default defineConfig({
-  build: {
-    // Wipe `assets/dist/lib/` first to remove old artifacts prior to copying latest assets across.
-    emptyOutDir: true,
-    outDir: distDir,
-    rollupOptions: {
-      // Vite requires us to provide an input even though we want to build site with Hugo instead.
-      input: 'layouts/index.html',
-    },
-  },
-  plugins: [viteStaticCopy({
-    targets: [{
-      "src": "node_modules/mermaid/dist/mermaid.min.js", "dest": "mermaid/"
-    }, {
-      "src": "node_modules/plotly.js/dist/plotly.min.js", "dest": "plotly/"
-    }, {
-      "src": "node_modules/katex/dist/katex.min.js", "dest": "katex/"
-    }, {
-      "src": "node_modules/katex/dist/katex.min.css", "dest": "katex/"
-    }, {
-      "src": "node_modules/katex/dist/contrib/auto-render.min.js", "dest": "katex/"
-    }, {
-      "src": "node_modules/katex/dist/fonts/", "dest": "katex/"
-    }, {
-      "src": "node_modules/markmap-autoloader/dist/index.js", "dest": "markmap/"
-    }, {
-      "src": "node_modules/alpinejs/dist/cdn.min.js", "dest": "alpinejs/"
-    },
-    ],
-    hook: "buildStart", enforce: 'pre'
-  }), {
-    name: "Cleaning assets folder", async closeBundle() {
-      await rm(distDir + '/layouts', {recursive: true, force: true});
-    },
-  },]
-})
diff --git a/package.json b/package.json
index 85dcfeb3..e4703b77 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,8 @@
     "katex": "^0.16.9",
     "medium-zoom": "^1.0.8",
     "mermaid": "^10.6.0",
+    "markmap-autoloader": "^0.15.4",
+    "alpinejs": "^3.13.10",
     "plotly.js": "^2.27.0",
     "rollup-plugin-delete": "^2.0.0",
     "vite": "^7.1.2",
@@ -39,7 +41,7 @@
     "view": "scripts/view-starter.sh",
     "view:local": "scripts/view-starter-dev.sh",
     "test": "echo \"Error: no test specified\" && exit 1",
-    "lint": "pnpm run lint:js && yarn run lint:style",
+    "lint": "pnpm run lint:js && pnpm run lint:style",
     "lint:js": "eslint '*/**/*.{js,ts,tsx}'",
     "lint:js:fix": "eslint '*/**/*.{js,ts,tsx}' --fix",
     "lint:style": "stylelint 'modules/blox-tailwind/**/*.css'",
diff --git a/vite.config.js b/vite.config.js
index 69bcee6c..4d691ed9 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -26,7 +26,7 @@ export default defineConfig({
     },
     rollupOptions: {
       // Don't bundle these libraries, just copy them
-      external: ['mermaid', 'plotly.js', 'katex', 'markmap-autoloader'],
+      external: ['mermaid', 'plotly.js', 'katex', 'markmap-autoloader', 'alpinejs'],
     }
   },
   
@@ -67,8 +67,12 @@ export default defineConfig({
         // Markmap - Mind map rendering
         {
           src: 'node_modules/markmap-autoloader/dist/index.js',
-          dest: 'markmap/',
-          rename: 'markmap-autoloader.min.js'
+          dest: 'markmap/'
+        },
+        // Alpine.js
+        {
+          src: 'node_modules/alpinejs/dist/cdn.min.js',
+          dest: 'alpinejs/'
         }
       ]
     }),