refactor: Consolidate script imports and update Alpine.js syntax in templates

This commit updates all generated template files and the header.templ source
to use consolidated script bundles and modern Alpine.js syntax.

Changes to templates/*.go (generated from .templ source files):
- Replace individual script imports (admin.js, toast.js, header.js, etc.)
  with single /static/main.js bundle
- Convert onclick attributes to Alpine.js @click directives for better
  integration with reactive components
- Add x-data attributes to body elements where needed for Alpine components
- Update event handlers to use Alpine.js syntax consistently

Changes to templates/header.templ source file:
- Add Alpine.js test div with x-data and x-init for debugging
- Reformat theme dropdown and user menu markup with proper indentation
- Maintain consistent Alpine.js directive formatting throughout

This change reduces the number of HTTP requests and ensures consistent
Alpine.js integration across all pages.

templates/api_explorer_templ.go

@@ -96,12 +96,12 @@ func APIExplorer(explorer APIExplorerData) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "</code></pre></div><div class=\"flex gap-2 mt-4\"><button onclick=\"copyToClipboard(JSON.stringify({ explorer.Endpoint.RequestBody }, null, 2))\" class=\"px-4 py-2 border border-border rounded bg-background-primary text-text-primary hover:bg-background-secondary cursor-pointer text-sm\">Copy Request</button> <button onclick=\"copyToClipboard(JSON.stringify({ explorer.Endpoint.Response }, null, 2))\" class=\"px-4 py-2 border border-border rounded bg-background-primary text-text-primary hover:bg-background-secondary cursor-pointer text-sm\">Copy Response</button></div></div>")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "</code></pre></div><div class=\"flex gap-2 mt-4\"><button @click=\"copyToClipboard(JSON.stringify({ explorer.Endpoint.RequestBody }, null, 2))\" class=\"px-4 py-2 border border-border rounded bg-background-primary text-text-primary hover:bg-background-secondary cursor-pointer text-sm\">Copy Request</button> <button @click=\"copyToClipboard(JSON.stringify({ explorer.Endpoint.Response }, null, 2))\" class=\"px-4 py-2 border border-border rounded bg-background-primary text-text-primary hover:bg-background-secondary cursor-pointer text-sm\">Copy Response</button></div></div>")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
 		} else {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " <div class=\"border border-border rounded-lg p-6 mt-8 bg-background-secondary\"><div class=\"flex gap-2 mb-4\"><button class=\"mode-btn px-4 py-2 border border-border rounded bg-background-primary text-text-primary cursor-pointer hover:bg-background-secondary text-sm\" id=\"mock-btn\">Mock Data</button> <button class=\"mode-btn px-4 py-2 bg-accent text-white rounded cursor-pointer text-sm\" id=\"real-btn\">Try It Out</button></div><div class=\"mb-4\"><div class=\"mb-4\"><select id=\"http-method\" class=\"w-full px-3 py-2 rounded bg-background-primary text-text-primary border border-border focus:outline-none focus:ring-2 focus:ring-accent\"><option value=\"GET\"")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " <div class=\"border border-border rounded-lg p-6 mt-8 bg-background-secondary\" x-data=\"apiExplorerDoc\" x-init=\"initAPIExplorerDoc('{ explorer.Endpoint.Path }', '{ explorer.Endpoint.RequestBody }', '{ explorer.Endpoint.Response }')\"><div class=\"flex gap-2 mb-4\"><button class=\"mode-btn px-4 py-2 border border-border rounded bg-background-primary text-text-primary cursor-pointer hover:bg-background-secondary text-sm\" id=\"mock-btn\" @click=\"showDocMode('mock')\">Mock Data</button> <button class=\"mode-btn px-4 py-2 bg-accent text-white rounded cursor-pointer text-sm\" id=\"real-btn\" @click=\"showDocMode('real')\">Try It Out</button></div><div class=\"mb-4\"><div class=\"mb-4\"><select id=\"http-method\" class=\"w-full px-3 py-2 rounded bg-background-primary text-text-primary border border-border focus:outline-none focus:ring-2 focus:ring-accent\"><option value=\"GET\"")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -154,15 +154,11 @@ func APIExplorer(explorer APIExplorerData) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</textarea></div><button id=\"try-it-out\" class=\"bg-accent text-white px-6 py-3 rounded cursor-pointer mt-4 hover:opacity-90\">Try It Out</button><div class=\"api-response mt-4 hidden\"><div class=\"flex justify-between mb-2 text-sm\"><span id=\"response-status\" class=\"font-semibold\"></span> <span id=\"response-time\" class=\"text-text-secondary\"></span></div><pre class=\"bg-background-primary p-4 rounded-lg overflow-x-auto\"><code id=\"response-body\" class=\"text-text-primary text-sm\"></code></pre></div><div class=\"flex gap-2 mt-4 flex-wrap\"><button onclick=\"copyRequest()\" class=\"px-4 py-2 border border-border rounded bg-background-primary text-text-primary hover:bg-background-secondary cursor-pointer text-sm\">Copy Request</button> <button onclick=\"copyResponse()\" class=\"px-4 py-2 border border-border rounded bg-background-primary text-text-primary hover:bg-background-secondary cursor-pointer text-sm\">Copy Response</button> <button onclick=\"generateCURL()\" class=\"px-4 py-2 border border-border rounded bg-background-primary text-text-primary hover:bg-background-secondary cursor-pointer text-sm\">Generate cURL</button></div></div>")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</textarea></div><button id=\"try-it-out\" @click=\"tryDocEndpoint()\" class=\"bg-accent text-white px-6 py-3 rounded cursor-pointer mt-4 hover:opacity-90\">Try It Out</button><div class=\"api-response mt-4 hidden\"><div class=\"flex justify-between mb-2 text-sm\"><span id=\"response-status\" class=\"font-semibold\"></span> <span id=\"response-time\" class=\"text-text-secondary\"></span></div><pre class=\"bg-background-primary p-4 rounded-lg overflow-x-auto\"><code id=\"response-body\" class=\"text-text-primary text-sm\"></code></pre></div><div class=\"flex gap-2 mt-4 flex-wrap\"><button @click=\"copyDocRequest()\" class=\"px-4 py-2 border border-border rounded bg-background-primary text-text-primary hover:bg-background-secondary cursor-pointer text-sm\">Copy Request</button> <button @click=\"copyDocResponse()\" class=\"px-4 py-2 border border-border rounded bg-background-primary text-text-primary hover:bg-background-secondary cursor-pointer text-sm\">Copy Response</button> <button @click=\"generateDocCURL()\" class=\"px-4 py-2 border border-border rounded bg-background-primary text-text-primary hover:bg-background-secondary cursor-pointer text-sm\">Generate cURL</button></div></div>")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "<script>\n\t\tconst endpointPath = '{ explorer.Endpoint.Path }';\n\t\tconst exampleRequest = { explorer.Endpoint.RequestBody };\n\t\tconst exampleResponse = { explorer.Endpoint.Response };\n\n\t\t// Mode toggle logic\n\t\tdocument.getElementById('mock-btn')?.addEventListener('click', () => showMode('mock'));\n\t\tdocument.getElementById('real-btn')?.addEventListener('click', () => showMode('real'));\n\n\t\tfunction showMode(mode) {\n\t\t\tconst mockBtn = document.getElementById('mock-btn');\n\t\t\tconst realBtn = document.getElementById('real-btn');\n\t\t\tconst responseBody = document.getElementById('response-body');\n\t\t\tconst responseStatus = document.getElementById('response-status');\n\t\t\tconst responseTime = document.getElementById('response-time');\n\t\t\tconst apiResponse = document.querySelector('.api-response');\n\t\t\tconst requestBody = document.getElementById('request-body');\n\t\t\tconst tryItOut = document.getElementById('try-it-out');\n\n\t\t\tif (mode === 'mock') {\n\t\t\t\tmockBtn.classList.add('bg-accent', 'text-white');\n\t\t\t\tmockBtn.classList.remove('bg-background-primary', 'text-text-primary');\n\t\t\t\trealBtn.classList.remove('bg-accent', 'text-white');\n\t\t\t\trealBtn.classList.add('bg-background-primary', 'text-text-primary');\n\t\t\t\t\n\t\t\t\tapiResponse.classList.remove('hidden');\n\t\t\t\trequestBody.readOnly = true;\n\t\t\t\ttryItOut.classList.add('hidden');\n\t\t\t\tresponseBody.textContent = JSON.stringify(exampleResponse, null, 2);\n\t\t\t\tresponseStatus.textContent = '200 OK';\n\t\t\t\tresponseTime.textContent = 'Mock';\n\t\t\t} else {\n\t\t\t\trealBtn.classList.add('bg-accent', 'text-white');\n\t\t\t\trealBtn.classList.remove('bg-background-primary', 'text-text-primary');\n\t\t\t\tmockBtn.classList.remove('bg-accent', 'text-white');\n\t\t\t\tmockBtn.classList.add('bg-background-primary', 'text-text-primary');\n\t\t\t\t\n\t\t\t\tapiResponse.classList.add('hidden');\n\t\t\t\trequestBody.readOnly = false;\n\t\t\t\ttryItOut.classList.remove('hidden');\n\t\t\t}\n\t\t}\n\n\t\t// Try it out logic\n\t\tdocument.getElementById('try-it-out')?.addEventListener('click', async () => {\n\t\t\tconst method = document.getElementById('http-method').value;\n\t\t\tconst body = document.getElementById('request-body').value;\n\n\t\t\tconst startTime = Date.now();\n\t\t\ttry {\n\t\t\t\tconst response = await fetch(endpointPath, {\n\t\t\t\t\tmethod: method,\n\t\t\t\t\theaders: {\n\t\t\t\t\t\t'Content-Type': 'application/json',\n\t\t\t\t\t\t'Authorization': 'Bearer ' + localStorage.getItem('token')\n\t\t\t\t\t},\n\t\t\t\t\tbody: ['GET', 'DELETE'].includes(method) ? undefined : body\n\t\t\t\t});\n\n\t\t\t\tconst duration = Date.now() - startTime;\n\t\t\t\tconst data = await response.json();\n\n\t\t\t\tdocument.getElementById('response-status').textContent = `${response.status} (${response.statusText})`;\n\t\t\t\tdocument.getElementById('response-time').textContent = `${duration}ms`;\n\t\t\t\tdocument.getElementById('response-body').textContent = JSON.stringify(data, null, 2);\n\t\t\t\tdocument.querySelector('.api-response').classList.remove('hidden');\n\t\t\t} catch (error) {\n\t\t\t\tdocument.getElementById('response-status').textContent = 'Error';\n\t\t\t\tdocument.getElementById('response-body').textContent = error.message;\n\t\t\t\tdocument.querySelector('.api-response').classList.remove('hidden');\n\t\t\t}\n\t\t});\n\n\t\tfunction copyToClipboard(text) {\n\t\t\tnavigator.clipboard.writeText(text);\n\t\t}\n\n\t\tfunction copyRequest() {\n\t\t\tconst body = document.getElementById('request-body').value;\n\t\t\tnavigator.clipboard.writeText(body);\n\t\t}\n\n\t\tfunction copyResponse() {\n\t\t\tconst body = document.getElementById('response-body').textContent;\n\t\t\tnavigator.clipboard.writeText(body);\n\t\t}\n\n\t\tfunction generateCURL() {\n\t\t\tconst method = document.getElementById('http-method').value;\n\t\t\tconst body = document.getElementById('request-body').value;\n\t\t\tconst token = localStorage.getItem('token');\n\n\t\t\tlet curl = `curl -X ${method} \\\\n  -H \"Content-Type: application/json\" \\\\n  -H \"Authorization: Bearer ${token}\"`;\n\t\t\t\n\t\t\tif (!['GET', 'DELETE'].includes(method) && body.trim()) {\n\t\t\t\tcurl += ` \\\\n  -d '${body}'`;\n\t\t\t}\n\t\t\t\n\t\t\tcurl += ` \\\\n  ${endpointPath}`;\n\t\t\t\n\t\t\tnavigator.clipboard.writeText(curl);\n\t\t}\n\t</script>")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
 		return nil
 	})
 }