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(, block);
+ preact.render(, 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" "")