added templui htmx compat script
This commit is contained in:
		
							parent
							
								
									007a9250ab
								
							
						
					
					
						commit
						3e2f93d754
					
				
					 2 changed files with 29 additions and 1 deletions
				
			
		| 
						 | 
					@ -29,6 +29,34 @@ templ Base(title string) {
 | 
				
			||||||
      </div>
 | 
					      </div>
 | 
				
			||||||
      <script src="/assets/htmx.min.js"></script>
 | 
					      <script src="/assets/htmx.min.js"></script>
 | 
				
			||||||
      <script src="/assets/alpine.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>
 | 
					    </footer>
 | 
				
			||||||
  </body>
 | 
					  </body>
 | 
				
			||||||
</html>
 | 
					</html>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -106,7 +106,7 @@ func Base(title string) templ.Component {
 | 
				
			||||||
		if templ_7745c5c3_Err != nil {
 | 
							if templ_7745c5c3_Err != nil {
 | 
				
			||||||
			return templ_7745c5c3_Err
 | 
								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 {
 | 
							if templ_7745c5c3_Err != nil {
 | 
				
			||||||
			return templ_7745c5c3_Err
 | 
								return templ_7745c5c3_Err
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		
		Reference in a new issue