From b1e399fa005bcf62d2a10d4fd826d9da35ccba92 Mon Sep 17 00:00:00 2001
From: Mark Dumay <61946753+markdumay@users.noreply.github.com>
Date: Sun, 5 Jul 2026 06:36:29 +0200
Subject: [PATCH] fix(lightbox): load shell and JS as core so fullscreen is
 reliable
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The lightbox shell and its JS were gated on a `lightbox` module
dependency that shortcodes register via AddModule during content
rendering. Per Hugo's docs a value set that way is "indeterminate
until Hugo renders the page content", so the head/footer templates
that read it — the shell include and the optional-scripts pass — saw
it only intermittently. Pages using a fullscreen/lightbox shortcode
rendered the trigger button but often not the dialog or its JS.

Make the lightbox core theme furniture: render the <dialog> shell on
every page and bundle its JS into the core set. Any
[data-lightbox-trigger] now works without per-page module
registration. Drop the now-vestigial AddModule call from the trigger
partial.
---
 config/_default/params.toml                   |  7 +++-
 .../_partials/assets/lightbox-trigger.html    |  7 ++--
 layouts/_partials/assets/lightbox.html        | 36 ++++++++++---------
 3 files changed, 28 insertions(+), 22 deletions(-)

diff --git a/config/_default/params.toml b/config/_default/params.toml
index 156fc51a..d3f5caf0 100644
--- a/config/_default/params.toml
+++ b/config/_default/params.toml
@@ -309,6 +309,11 @@
     img-src = ["i.vimeocdn.com"]
     script-src = ["player.vimeo.com"]
 
+# Core furniture: the lightbox <dialog> shell (assets/lightbox.html) and its JS
+# both load on every page so any [data-lightbox-trigger] works without per-page
+# module registration. Kept out of the optional set on purpose — a shortcode
+# registering it via AddModule is a render-order-dependent side effect that a
+# head/footer consumer cannot rely on (see assets/lightbox.html).
 [modules.lightbox]
-    integration = "optional"
+    integration = "core"
     state = "defer"
diff --git a/layouts/_partials/assets/lightbox-trigger.html b/layouts/_partials/assets/lightbox-trigger.html
index 49cddb32..2a8b9888 100644
--- a/layouts/_partials/assets/lightbox-trigger.html
+++ b/layouts/_partials/assets/lightbox-trigger.html
@@ -1,15 +1,14 @@
 {{/*
-    Convenience: render a lightbox trigger button for arbitrary content and
-    register the `lightbox` module dependency. Call with:
+    Convenience: render a lightbox trigger button for arbitrary content. The
+    lightbox shell and JS are core theme furniture (always present), so no
+    module registration is needed. Call with:
       {{ partial "assets/lightbox-trigger.html" (dict "page" . "source" "#my-figure") }}
     `source` is a CSS selector for the node to clone into the lightbox.
     Keep it unique: an id selector must not collide with a Hugo heading
     anchor (heading/page slug), or querySelector may match the wrong element.
 */}}
-{{- $page := .page | default page -}}
 {{- $source := .source -}}
 {{- $icon := partial "utilities/GetThemeIcon.html" (dict "id" "lightboxExpand" "default" "fas expand") -}}
-{{- partial "utilities/AddModule.html" (dict "page" $page "module" "lightbox") -}}
 <button type="button" class="control-btn-lightbox" data-lightbox-trigger data-lightbox-source="{{ $source }}"
         aria-label="{{ i18n "lightboxExpand" }}">
     {{- partial "assets/icon.html" (dict "icon" $icon "class" "fa-fw fa-xl" "spacing" false) -}}
diff --git a/layouts/_partials/assets/lightbox.html b/layouts/_partials/assets/lightbox.html
index 859eaa95..37c9c995 100644
--- a/layouts/_partials/assets/lightbox.html
+++ b/layouts/_partials/assets/lightbox.html
@@ -1,19 +1,21 @@
 {{/*
-    Reusable lightbox <dialog> shell. Rendered once per page, only when the
-    `lightbox` module dependency is registered (via utilities/AddModule.html).
-    The lightbox JS module (assets/js/modules/lightbox/lightbox.mjs) clones a
-    trigger's source node into `.lightbox-content` and calls showModal().
+    Reusable lightbox <dialog> shell — core theme furniture, rendered once on
+    every page. The lightbox JS module (assets/js/modules/lightbox/lightbox.mjs,
+    bundled in core) clones a [data-lightbox-trigger] source node into
+    `.lightbox-content` and calls showModal(). The shell is inert until a
+    trigger on the page is clicked.
+
+    Rendered unconditionally on purpose: a shortcode that registers the
+    lightbox dependency (via utilities/AddModule.html) does so as a side effect
+    of content rendering, and per Hugo's own docs a value set that way is
+    "indeterminate until Hugo renders the page content"
+    (https://gohugo.io/methods/page/store/). A parent template that reads it —
+    like this shell — cannot rely on it. Always rendering removes that race.
 */}}
-{{- $deps := page.Scratch.Get "dependencies" -}}
-{{- $enabled := false -}}
-{{- if and (reflect.IsSlice $deps) (in $deps "lightbox") -}}{{- $enabled = true -}}{{- end -}}
-{{- if and (reflect.IsSlice .Params.modules) (in .Params.modules "lightbox") -}}{{- $enabled = true -}}{{- end -}}
-{{- if $enabled -}}
-    {{- $close := partial "utilities/GetThemeIcon.html" (dict "id" "lightboxClose" "default" "fas xmark") -}}
-    <dialog class="lightbox" aria-label="{{ i18n "lightboxLabel" }}">
-        <button type="button" class="lightbox-close" aria-label="{{ i18n "lightboxClose" }}">
-            {{- partial "assets/icon.html" (dict "icon" $close "class" "fa-fw fa-xl" "spacing" false) -}}
-        </button>
-        <div class="lightbox-content"></div>
-    </dialog>
-{{- end -}}
+{{- $close := partial "utilities/GetThemeIcon.html" (dict "id" "lightboxClose" "default" "fas xmark") -}}
+<dialog class="lightbox" aria-label="{{ i18n "lightboxLabel" }}">
+    <button type="button" class="lightbox-close" aria-label="{{ i18n "lightboxClose" }}">
+        {{- partial "assets/icon.html" (dict "icon" $close "class" "fa-fw fa-xl" "spacing" false) -}}
+    </button>
+    <div class="lightbox-content"></div>
+</dialog>