diff --git a/server/web/base.templ b/server/web/base.templ
index e30c3a9..1613c24 100644
--- a/server/web/base.templ
+++ b/server/web/base.templ
@@ -29,6 +29,34 @@ templ Base(title string) {
       </div>
       <script src="/assets/htmx.min.js"></script>
       <script src="/assets/alpine.min.js"></script>
+      <script>
+        // Re-initialize templUI components after HTMX swaps
+        document.body.addEventListener("htmx:afterSwap", (e) => {
+          if (window.templUI) {
+            Object.values(window.templUI).forEach(comp => {
+              comp.init?.(e.detail.elt);
+            });
+          }
+        });
+      
+        // Re-initialize components after out-of-band swaps
+        document.body.addEventListener("htmx:oobAfterSwap", (e) => {
+          if (window.templUI) {
+            Object.values(window.templUI).forEach(comp => {
+              comp.init?.(e.detail.target);
+            });
+          }
+        });
+      
+        // Cleanup before swap (for components with event listeners)
+        document.body.addEventListener("htmx:beforeSwap", (e) => {
+          if (window.templUI) {
+            Object.values(window.templUI).forEach(comp => {
+              comp.cleanup?.(e.detail.target);
+            });
+          }
+        });
+      </script>
     </footer>
   </body>
 </html>
diff --git a/server/web/base_templ.go b/server/web/base_templ.go
index b9da80b..f458f32 100644
--- a/server/web/base_templ.go
+++ b/server/web/base_templ.go
@@ -106,7 +106,7 @@ func Base(title string) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\">Source</a></p></div><script src=\"/assets/htmx.min.js\"></script><script src=\"/assets/alpine.min.js\"></script></footer></body></html>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\">Source</a></p></div><script src=\"/assets/htmx.min.js\"></script><script src=\"/assets/alpine.min.js\"></script><script>\n        // Re-initialize templUI components after HTMX swaps\n        document.body.addEventListener(\"htmx:afterSwap\", (e) => {\n          if (window.templUI) {\n            Object.values(window.templUI).forEach(comp => {\n              comp.init?.(e.detail.elt);\n            });\n          }\n        });\n      \n        // Re-initialize components after out-of-band swaps\n        document.body.addEventListener(\"htmx:oobAfterSwap\", (e) => {\n          if (window.templUI) {\n            Object.values(window.templUI).forEach(comp => {\n              comp.init?.(e.detail.target);\n            });\n          }\n        });\n      \n        // Cleanup before swap (for components with event listeners)\n        document.body.addEventListener(\"htmx:beforeSwap\", (e) => {\n          if (window.templUI) {\n            Object.values(window.templUI).forEach(comp => {\n              comp.cleanup?.(e.detail.target);\n            });\n          }\n        });\n      </script></footer></body></html>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}