From c843d01cf8c8b96d8f410261a0502589d5dace9e Mon Sep 17 00:00:00 2001
From: George Cushen <gcushen@users.noreply.github.com>
Date: Thu, 25 Sep 2025 21:46:47 +0100
Subject: [PATCH] fix(ci): use classic JSX + global Preact to fix js.Build
 resolution
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

landing-page starter, which uses preact blocks, was only working only in monorepo due to Preact installed in root package.json but not starter package.json.

- Switch js.Build to classic JSX with global factory in `modules/blox-tailwind/layouts/_partials/libraries.html` (JSX=transform, JSXFactory=preact.h, JSXFragment=preact.Fragment)
- Update `modules/blox-tailwind/blox/hero/client.jsx` to call `preact.render` and remove `preact` import
- Remove `preact` import from `modules/blox-tailwind/blox/shared/js/components/Icon.jsx` (classic JSX uses global `preact.h`)
- Keep vendored `assets/dist/lib/preact/preact.min.js` and load it only when `needs_preact` is set
- Fixes CI error “Could not resolve preact/jsx-runtime” without requiring `preact` in each starter
---
 modules/blox-tailwind/blox/hero/client.jsx               | 4 ++--
 modules/blox-tailwind/blox/shared/js/components/Icon.jsx | 2 +-
 modules/blox-tailwind/layouts/_partials/libraries.html   | 5 +++--
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/modules/blox-tailwind/blox/hero/client.jsx b/modules/blox-tailwind/blox/hero/client.jsx
index 3e2c0bb6..b8de2092 100644
--- a/modules/blox-tailwind/blox/hero/client.jsx
+++ b/modules/blox-tailwind/blox/hero/client.jsx
@@ -3,7 +3,7 @@
  * Uses the shared component for consistency
  */
 
-import {render} from "preact";
+// Use global preact (loaded via script tag) with classic JSX transform
 import {HeroBlock} from "./component.jsx";
 
 // Render function - immediately renders Hero components
@@ -18,7 +18,7 @@ function renderHeroBlocks() {
         const props = JSON.parse(propsData);
 
         // Render the Preact component into the container
-        render(<HeroBlock {...props} />, block);
+        preact.render(<HeroBlock {...props} />, block);
         console.debug(`✓ Hero block "${block.id}" rendered with Preact`);
       } catch (error) {
         console.error(`Failed to render Hero block "${block.id}":`, error);
diff --git a/modules/blox-tailwind/blox/shared/js/components/Icon.jsx b/modules/blox-tailwind/blox/shared/js/components/Icon.jsx
index 4d4656cf..8b2573b3 100644
--- a/modules/blox-tailwind/blox/shared/js/components/Icon.jsx
+++ b/modules/blox-tailwind/blox/shared/js/components/Icon.jsx
@@ -1,4 +1,4 @@
-import {h} from "preact";
+// Use classic JSX transform with global preact; no direct import
 
 /**
  * Icon component
diff --git a/modules/blox-tailwind/layouts/_partials/libraries.html b/modules/blox-tailwind/layouts/_partials/libraries.html
index 24d6aaaf..63c1e886 100644
--- a/modules/blox-tailwind/layouts/_partials/libraries.html
+++ b/modules/blox-tailwind/layouts/_partials/libraries.html
@@ -26,8 +26,9 @@
       {{/* Build the client-side JSX using Hugo's official integration */}}
       {{ $jsx_opts := dict 
         "targetPath" (printf "assets/js/preact-built/%s.js" $block_type)
-        "JSX" "automatic"
-        "JSXImportSource" "preact"
+        "JSX" "transform"
+        "JSXFactory" "preact.h"
+        "JSXFragment" "preact.Fragment"
         "format" "iife"
         "minify" hugo.IsProduction
         "sourceMap" (cond hugo.IsDevelopment "external" "")