@sonicjs-cms/core 2.0.0-alpha.11 → 2.0.0-alpha.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/dist/chunk-4XI3YBKU.cjs +266 -0
  2. package/dist/chunk-4XI3YBKU.cjs.map +1 -0
  3. package/dist/chunk-ET5I4GBD.cjs +3515 -0
  4. package/dist/chunk-ET5I4GBD.cjs.map +1 -0
  5. package/dist/{chunk-FDUDHGI6.js → chunk-JETM2U2D.js} +2345 -795
  6. package/dist/chunk-JETM2U2D.js.map +1 -0
  7. package/dist/chunk-LU6J53IX.js +262 -0
  8. package/dist/chunk-LU6J53IX.js.map +1 -0
  9. package/dist/chunk-P3VS4DV3.js +3498 -0
  10. package/dist/chunk-P3VS4DV3.js.map +1 -0
  11. package/dist/{chunk-DG4INX36.cjs → chunk-QUMBDPNJ.cjs} +2392 -837
  12. package/dist/chunk-QUMBDPNJ.cjs.map +1 -0
  13. package/dist/index.cjs +56 -36
  14. package/dist/index.cjs.map +1 -1
  15. package/dist/index.js +4 -4
  16. package/dist/index.js.map +1 -1
  17. package/dist/routes.cjs +34 -14
  18. package/dist/routes.js +2 -2
  19. package/dist/templates.cjs +42 -22
  20. package/dist/templates.js +2 -2
  21. package/package.json +1 -1
  22. package/dist/chunk-6BHDKYLU.cjs +0 -798
  23. package/dist/chunk-6BHDKYLU.cjs.map +0 -1
  24. package/dist/chunk-DG4INX36.cjs.map +0 -1
  25. package/dist/chunk-FDUDHGI6.js.map +0 -1
  26. package/dist/chunk-FZYF43TN.js +0 -789
  27. package/dist/chunk-FZYF43TN.js.map +0 -1
  28. package/dist/chunk-G4JGVZAF.js +0 -1337
  29. package/dist/chunk-G4JGVZAF.js.map +0 -1
  30. package/dist/chunk-LEGKJ5DI.cjs +0 -1344
  31. package/dist/chunk-LEGKJ5DI.cjs.map +0 -1
package/dist/chunk-G4JGVZAF.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/templates/components/logo.template.ts","../src/templates/layouts/admin-layout-catalyst.template.ts","../src/templates/layouts/admin-layout-v2.template.ts"],"names":["renderAdminLayoutCatalyst"],"mappings":"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","file":"chunk-G4JGVZAF.js","sourcesContent":["export interface LogoData {\n size?: 'sm' | 'md' | 'lg' | 'xl'\n variant?: 'default' | 'white' | 'dark'\n showText?: boolean\n showVersion?: boolean\n version?: string\n className?: string\n href?: string // Optional link URL\n}\n\nconst sizeClasses = {\n sm: 'h-6 w-auto',\n md: 'h-8 w-auto',\n lg: 'h-12 w-auto',\n xl: 'h-16 w-auto'\n}\n\n\nexport function renderLogo(data: LogoData = {}): string {\n const {\n size = 'md',\n variant = 'default',\n showText = true,\n showVersion = true,\n version = 'v0.1.0',\n className = '',\n href\n } = data\n\n const sizeClass = sizeClasses[size]\n\n // Official SonicJS logo SVG from sonicjs.com\n const logoSvg = `\n <svg class=\"${sizeClass} ${className}\" viewBox=\"380 1300 2250 400\" aria-hidden=\"true\">\n <path fill=\"${variant === 'white' ? '#ffffff' : variant === 'dark' ? '#1f2937' : '#F1F2F2'}\" d=\"M476.851,1404.673h168.536c4.714,0,8.695-1.618,11.944-4.866c3.241-3.241,4.866-7.222,4.866-11.943 c0-2.357-0.443-4.569-1.327-6.636c-0.885-2.06-2.067-3.829-3.539-5.308c-1.479-1.472-3.249-2.654-5.308-3.538 c-2.067-0.885-4.279-1.327-6.635-1.327H476.851c-20.057,0-37.158,7.154-51.313,21.454c-14.155,14.308-21.233,31.483-21.233,51.534 c0,20.058,7.078,37.234,21.233,51.534c14.155,14.308,31.255,21.454,51.313,21.454h112.357c10.907,0,20.196,3.837,27.868,11.502 c7.666,7.672,11.502,16.885,11.502,27.646c0,10.769-3.836,19.982-11.502,27.647c-7.672,7.673-16.961,11.502-27.868,11.502H421.115 c-4.721,0-8.702,1.624-11.944,4.865c-3.248,3.249-4.866,7.23-4.866,11.944c0,3.248,0.733,6.123,2.212,8.626 c1.472,2.509,3.462,4.499,5.971,5.972c2.502,1.472,5.378,2.212,8.626,2.212h168.094c20.052,0,37.227-7.078,51.534-21.234 c14.3-14.155,21.454-31.331,21.454-51.534c0-20.196-7.154-37.379-21.454-51.534c-14.308-14.156-31.483-21.234-51.534-21.234 H476.851c-10.616,0-19.76-3.905-27.426-11.721c-7.672-7.811-11.501-17.101-11.501-27.87c0-10.761,3.829-19.975,11.501-27.647 C457.091,1408.508,466.235,1404.673,476.851,1404.673z\"></path>\n <path fill=\"${variant === 'white' ? '#ffffff' : variant === 'dark' ? '#1f2937' : '#F1F2F2'}\" d=\"M974.78,1398.211c-5.016,6.574-10.034,13.146-15.048,19.721c-1.828,2.398-3.657,4.796-5.487,7.194 c1.994,1.719,3.958,3.51,5.873,5.424c18.724,18.731,28.089,41.216,28.089,67.459c0,26.251-9.366,48.658-28.089,67.237 c-18.731,18.579-41.215,27.868-67.459,27.868c-9.848,0-19.156-1.308-27.923-3.923l-4.185,3.354 c-8.587,6.885-17.154,13.796-25.725,20.702c17.52,8.967,36.86,13.487,58.054,13.487c35.533,0,65.91-12.608,91.124-37.821 c25.214-25.215,37.821-55.584,37.821-91.125c0-35.534-12.607-65.911-37.821-91.126 C981.004,1403.663,977.926,1400.854,974.78,1398.211z\"></path>\n <path fill=\"${variant === 'white' ? '#ffffff' : variant === 'dark' ? '#1f2937' : '#F1F2F2'}\" d=\"M1364.644,1439.619c-4.72,0-8.702,1.624-11.943,4.865c-3.249,3.249-4.866,7.23-4.866,11.944v138.014 l-167.651-211.003c-0.297-0.586-0.74-1.03-1.327-1.326c-4.721-4.714-10.249-7.742-16.588-9.069 c-6.346-1.326-12.608-0.732-18.801,1.77c-6.192,2.509-11.059,6.49-14.598,11.944c-3.539,5.46-5.308,11.577-5.308,18.357v208.348 c0,4.721,1.618,8.703,4.866,11.944c3.241,3.241,7.222,4.865,11.943,4.865c2.945,0,5.751-0.738,8.405-2.211 c2.654-1.472,4.713-3.463,6.193-5.971c1.473-2.503,2.212-5.378,2.212-8.627v-205.251l166.325,209.675 c2.06,2.654,4.423,4.865,7.078,6.635c5.308,3.829,11.349,5.75,18.137,5.75c5.308,0,10.464-1.182,15.482-3.538 c3.539-1.769,6.56-4.127,9.069-7.078c2.502-2.945,4.491-6.338,5.971-10.175c1.473-3.829,2.212-7.664,2.212-11.501v-141.552 c0-4.714-1.624-8.695-4.865-11.944C1373.339,1441.243,1369.359,1439.619,1364.644,1439.619z\"></path>\n <path fill=\"${variant === 'white' ? '#ffffff' : variant === 'dark' ? '#1f2937' : '#F1F2F2'}\" d=\"M1508.406,1432.983c-2.654-1.472-5.46-2.212-8.404-2.212c-4.721,0-8.703,1.7-11.944,5.087 c-3.249,3.395-4.865,7.3-4.865,11.723v163.228c0,4.721,1.616,8.702,4.865,11.943c3.241,3.249,7.223,4.866,11.944,4.866 c2.944,0,5.751-0.732,8.404-2.212c2.655-1.472,4.714-3.539,6.193-6.194c1.473-2.654,2.213-5.453,2.213-8.404V1447.58 c0-2.945-0.74-5.75-2.213-8.405C1513.12,1436.522,1511.06,1434.462,1508.406,1432.983z\"></path>\n <path fill=\"${variant === 'white' ? '#ffffff' : variant === 'dark' ? '#1f2937' : '#F1F2F2'}\" d=\"M1499.78,1367.957c-4.575,0-8.481,1.625-11.722,4.866c-3.249,3.249-4.865,7.23-4.865,11.943 c0,2.951,0.732,5.75,2.212,8.405c1.472,2.654,3.463,4.721,5.971,6.193c2.503,1.479,5.378,2.212,8.627,2.212 c4.423,0,8.328-1.618,11.721-4.865c3.387-3.243,5.088-7.224,5.088-11.944c0-4.713-1.701-8.694-5.088-11.943 C1508.33,1369.582,1504.349,1367.957,1499.78,1367.957z\"></path>\n <path fill=\"${variant === 'white' ? '#ffffff' : variant === 'dark' ? '#1f2937' : '#F1F2F2'}\" d=\"M1859.627,1369.727H1747.27c-35.388,0-65.69,12.607-90.904,37.821 c-25.213,25.215-37.82,55.591-37.82,91.125c0,35.54,12.607,65.911,37.82,91.125c25.215,25.215,55.516,37.821,90.904,37.821h56.178 c4.714,0,8.695-1.618,11.944-4.866c3.241-3.241,4.865-7.222,4.865-11.943c0-4.714-1.624-8.695-4.865-11.943 c-3.249-3.243-7.23-4.866-11.944-4.866h-56.178c-26.251,0-48.659-9.359-67.237-28.09c-18.579-18.723-27.868-41.207-27.868-67.459 c0-26.243,9.29-48.659,27.868-67.237c18.579-18.579,40.987-27.868,67.237-27.868h112.357c4.714,0,8.696-1.693,11.944-5.087 c3.241-3.387,4.865-7.368,4.865-11.943c0-4.569-1.624-8.475-4.865-11.723C1868.322,1371.351,1864.341,1369.727,1859.627,1369.727z \"></path>\n <path fill=\"#06b6d4\" d=\"M2219.256,1371.054h-112.357c-4.423,0-8.336,1.624-11.723,4.865c-3.393,3.249-5.087,7.23-5.087,11.944 c0,4.721,1.694,8.702,5.087,11.943c3.387,3.249,7.3,4.866,11.723,4.866h95.547v95.105c0,26.251-9.365,48.659-28.088,67.237 c-18.731,18.579-41.215,27.868-67.459,27.868c-26.251,0-48.659-9.289-67.237-27.868c-18.579-18.579-27.868-40.987-27.868-67.237 c0-4.713-1.701-8.771-5.088-12.165c-3.393-3.387-7.374-5.087-11.943-5.087c-4.575,0-8.481,1.7-11.722,5.087 c-3.249,3.393-4.865,7.451-4.865,12.165c0,35.388,12.607,65.69,37.82,90.904c25.215,25.213,55.584,37.82,91.126,37.82 c35.532,0,65.91-12.607,91.125-37.82c25.214-25.215,37.82-55.516,37.82-90.904v-111.915c0-4.714-1.624-8.695-4.865-11.944 C2227.951,1372.678,2223.971,1371.054,2219.256,1371.054z\"></path>\n <path fill=\"#06b6d4\" d=\"M2574.24,1502.875c-14.306-14.156-31.483-21.234-51.533-21.234H2410.35 c-10.617,0-19.762-3.829-27.426-11.501c-7.672-7.664-11.501-16.954-11.501-27.868c0-10.907,3.829-20.196,11.501-27.868 c7.664-7.664,16.809-11.501,27.426-11.501h112.357c4.714,0,8.695-1.617,11.944-4.866c3.241-3.241,4.865-7.222,4.865-11.943 c0-4.714-1.624-8.695-4.865-11.944c-3.249-3.241-7.23-4.865-11.944-4.865H2410.35c-20.058,0-37.158,7.154-51.313,21.454 c-14.156,14.308-21.232,31.483-21.232,51.534c0,20.058,7.077,37.234,21.232,51.534c14.156,14.308,31.255,21.454,51.313,21.454 h112.357c7.078,0,13.637,1.77,19.684,5.308c6.042,3.539,10.838,8.336,14.377,14.377c3.538,6.047,5.307,12.607,5.307,19.685 c0,10.616-3.835,19.76-11.501,27.425c-7.672,7.673-16.961,11.502-27.868,11.502h-168.094c-4.721,0-8.703,1.7-11.944,5.087 c-3.249,3.393-4.865,7.374-4.865,11.943c0,4.576,1.616,8.481,4.865,11.723c3.241,3.249,7.223,4.866,11.944,4.866h168.094 c20.051,0,37.227-7.078,51.533-21.234c14.302-14.155,21.454-31.331,21.454-51.534 C2595.695,1534.213,2588.542,1517.03,2574.24,1502.875z\"></path>\n <path fill=\"#06b6d4\" d=\"M854.024,1585.195l20.001-16.028c16.616-13.507,33.04-27.265,50.086-40.251 c1.13-0.861,2.9-1.686,2.003-3.516c-0.843-1.716-2.481-2.302-4.484-2.123c-8.514,0.765-17.016-0.538-25.537-0.353 c-1.124,0.024-2.768,0.221-3.163-1.25c-0.371-1.369,1.088-2.063,1.919-2.894c6.26-6.242,12.574-12.43,18.816-18.691 c9.303-9.327,18.565-18.714,27.851-28.066c1.848-1.859,3.701-3.713,5.549-5.572c2.655-2.661,5.309-5.315,7.958-7.982 c0.574-0.579,1.259-1.141,1.246-1.94c-0.004-0.257-0.078-0.538-0.254-0.853c-0.556-0.981-1.441-1.1-2.469-0.957 c-0.658,0.096-1.315,0.185-1.973,0.275c-3.844,0.538-7.689,1.076-11.533,1.608c-3.641,0.505-7.281,1.02-10.922,1.529 c-4.162,0.582-8.324,1.158-12.486,1.748c-1.142,0.161-2.409,1.662-3.354,0.508c-0.419-0.508-0.431-1.028-0.251-1.531 c0.269-0.741,0.957-1.441,1.387-2.021c3.414-4.58,6.882-9.124,10.356-13.662c1.74-2.272,3.48-4.544,5.214-6.822 c4.682-6.141,9.369-12.281,14.051-18.422c0.09-0.119,0.181-0.237,0.271-0.355c6.848-8.98,13.7-17.958,20.553-26.936 c0.488-0.64,0.977-1.28,1.465-1.92c2.159-2.828,4.315-5.658,6.476-8.486c4.197-5.501,8.454-10.954,12.67-16.442 c0.263-0.347,0.538-0.718,0.717-1.106c0.269-0.586,0.299-1.196-0.335-1.776c-0.825-0.753-1.8-0.15-2.595,0.419 c-0.67,0.472-1.333,0.957-1.955,1.489c-2.206,1.889-4.401,3.797-6.595,5.698c-3.958,3.438-7.922,6.876-11.976,10.194 c-2.443,2.003-4.865,4.028-7.301,6.038c-18.689-10.581-39.53-15.906-62.549-15.906c-35.54,0-65.911,12.607-91.125,37.82 c-25.214,25.215-37.821,55.592-37.821,91.126c0,35.54,12.607,65.91,37.821,91.125c4.146,4.146,8.445,7.916,12.87,11.381 c-9.015,11.14-18.036,22.277-27.034,33.429c-1.208,1.489-3.755,3.151-2.745,4.891c0.078,0.144,0.173,0.281,0.305,0.425 c1.321,1.429,3.492-1.303,4.933-2.457c6.673-5.333,13.333-10.685,19.982-16.042c3.707-2.984,7.417-5.965,11.124-8.952 c1.474-1.188,2.951-2.373,4.425-3.561c6.41-5.164,12.816-10.333,19.238-15.481L854.024,1585.195z M797.552,1498.009 c0-26.243,9.29-48.728,27.868-67.459c18.579-18.723,40.987-28.089,67.238-28.089c12.273,0,23.712,2.075,34.34,6.171 c-3.37,2.905-6.734,5.816-10.069,8.762c-6.075,5.351-12.365,10.469-18.667,15.564c-4.179,3.378-8.371,6.744-12.514,10.164 c-7.54,6.23-15.037,12.52-22.529,18.804c-7.091,5.955-14.182,11.904-21.19,17.949c-1.136,0.974-3.055,1.907-2.135,3.94 c0.831,1.836,2.774,1.417,4.341,1.578l12.145-0.599l14.151-0.698c1.031-0.102,2.192-0.257,2.89,0.632 c0.034,0.044,0.073,0.078,0.106,0.127c1.017,1.561-0.67,2.105-1.387,2.942c-6.308,7.318-12.616,14.637-18.978,21.907 c-8.161,9.339-16.353,18.649-24.544,27.958c-2.146,2.433-4.275,4.879-6.422,7.312c-1.034,1.172-2.129,2.272-1.238,3.922 c0.933,1.728,2.685,1.752,4.323,1.602c4.134-0.367,8.263-0.489,12.396-0.492c0.242,0,0.485-0.005,0.728-0.004 c2.711,0.009,5.422,0.068,8.134,0.145c2.582,0.074,5.166,0.165,7.752,0.249c0.275,1.62-0.879,2.356-1.62,3.259 c-1.333,1.626-2.667,3.247-4,4.867c-4.315,5.252-8.62,10.514-12.928,15.772c-3.562-2.725-7.007-5.733-10.324-9.051 C806.842,1546.667,797.552,1524.26,797.552,1498.009z\"></path>\n </svg>\n `\n\n const versionBadge = showVersion ? `\n <span class=\"inline-flex items-center rounded-md px-2 py-0.5 text-xs font-medium ring-1 ring-inset ${\n variant === 'white'\n ? 'bg-white/10 text-white/80 ring-white/20'\n : 'bg-cyan-50 text-cyan-700 ring-cyan-700/10 dark:bg-cyan-500/10 dark:text-cyan-400 dark:ring-cyan-500/20'\n }\">\n ${version}\n </span>\n ` : ''\n\n const logoContent = showText ? `\n <div class=\"flex items-center gap-2 ${className}\">\n ${logoSvg}\n ${versionBadge}\n </div>\n ` : logoSvg\n\n // Wrap in link if href is provided\n if (href) {\n return `<a href=\"${href}\" class=\"inline-block hover:opacity-80 transition-opacity\">${logoContent}</a>`\n }\n\n return logoContent\n}","import { HtmlEscapedString } from \"hono/utils/html\";\nimport { renderLogo } from \"../components/logo.template\";\n\n// Catalyst Checkbox Component (HTML implementation)\nexport interface CatalystCheckboxProps {\n id: string;\n name: string;\n checked?: boolean;\n disabled?: boolean;\n label?: string;\n description?: string;\n color?: 'dark/zinc' | 'dark/white' | 'white' | 'dark' | 'zinc' | 'blue' | 'green' | 'red';\n className?: string;\n}\n\nexport function renderCatalystCheckbox(props: CatalystCheckboxProps): string {\n const {\n id,\n name,\n checked = false,\n disabled = false,\n label,\n description,\n color = 'dark/zinc',\n className = ''\n } = props;\n\n const colorConfig = {\n 'dark/zinc': { bg: '#18181b', border: '#09090b', check: '#ffffff', darkBg: '#52525b' },\n 'dark/white': { bg: '#18181b', border: '#09090b', check: '#ffffff', darkBg: '#ffffff', darkCheck: '#18181b' },\n 'white': { bg: '#ffffff', border: '#09090b', check: '#18181b' },\n 'dark': { bg: '#18181b', border: '#09090b', check: '#ffffff' },\n 'zinc': { bg: '#52525b', border: '#3f3f46', check: '#ffffff' },\n 'blue': { bg: '#2563eb', border: '#1d4ed8', check: '#ffffff' },\n 'green': { bg: '#16a34a', border: '#15803d', check: '#ffffff' },\n 'red': { bg: '#dc2626', border: '#b91c1c', check: '#ffffff' }\n };\n\n const config = colorConfig[color] || colorConfig['dark/zinc'];\n\n const colorClasses = {\n 'dark/zinc': 'peer-checked:bg-zinc-900 peer-checked:before:bg-zinc-900 dark:peer-checked:bg-zinc-600',\n 'dark/white': 'peer-checked:bg-zinc-900 peer-checked:before:bg-zinc-900 dark:peer-checked:bg-white',\n 'white': 'peer-checked:bg-white peer-checked:before:bg-white',\n 'dark': 'peer-checked:bg-zinc-900 peer-checked:before:bg-zinc-900',\n 'zinc': 'peer-checked:bg-zinc-600 peer-checked:before:bg-zinc-600',\n 'blue': 'peer-checked:bg-blue-600 peer-checked:before:bg-blue-600',\n 'green': 'peer-checked:bg-green-600 peer-checked:before:bg-green-600',\n 'red': 'peer-checked:bg-red-600 peer-checked:before:bg-red-600'\n };\n\n const checkColor = color === 'dark/white' ? 'dark:text-zinc-900' : 'text-white';\n\n const baseClasses = `\n relative isolate flex w-4 h-4 items-center justify-center rounded-[0.3125rem]\n before:absolute before:inset-0 before:-z-10 before:rounded-[calc(0.3125rem-1px)] before:bg-white before:shadow-sm\n dark:before:hidden\n dark:bg-white/5\n border border-zinc-950/15 peer-checked:border-transparent\n dark:border-white/15 dark:peer-checked:border-white/5\n peer-focus:outline peer-focus:outline-2 peer-focus:outline-offset-2 peer-focus:outline-blue-500\n peer-disabled:opacity-50\n peer-disabled:border-zinc-950/25 peer-disabled:bg-zinc-950/5\n dark:peer-disabled:border-white/20 dark:peer-disabled:bg-white/2.5\n `.trim().replace(/\\s+/g, ' ');\n\n const checkIconClasses = `\n w-4 h-4 opacity-0 peer-checked:opacity-100 pointer-events-none\n `.trim().replace(/\\s+/g, ' ');\n\n if (description) {\n // Field layout with description\n return `\n <div class=\"grid grid-cols-[1.125rem_1fr] gap-x-4 gap-y-1 sm:grid-cols-[1rem_1fr] ${className}\">\n <div class=\"col-start-1 row-start-1 mt-0.75 sm:mt-1\">\n <input\n type=\"checkbox\"\n id=\"${id}\"\n name=\"${name}\"\n ${checked ? 'checked' : ''}\n ${disabled ? 'disabled' : ''}\n class=\"peer sr-only\"\n />\n <label for=\"${id}\" class=\"inline-flex cursor-pointer\">\n <span class=\"${baseClasses} ${colorClasses[color] || colorClasses['dark/zinc']}\">\n <svg class=\"${checkIconClasses} ${checkColor}\" viewBox=\"0 0 14 14\" fill=\"none\" stroke=\"currentColor\">\n <path d=\"M3 8L6 11L11 3.5\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </span>\n </label>\n </div>\n ${label ? `<label for=\"${id}\" class=\"col-start-2 row-start-1 text-sm/6 font-medium text-zinc-950 dark:text-white cursor-pointer\">${label}</label>` : ''}\n ${description ? `<p class=\"col-start-2 row-start-2 text-sm/6 text-zinc-500 dark:text-zinc-400\">${description}</p>` : ''}\n </div>\n `;\n } else {\n // Simple checkbox with optional label\n return `\n <label class=\"inline-flex items-center gap-3 cursor-pointer ${className}\">\n <input\n type=\"checkbox\"\n id=\"${id}\"\n name=\"${name}\"\n ${checked ? 'checked' : ''}\n ${disabled ? 'disabled' : ''}\n class=\"peer sr-only\"\n />\n <span class=\"${baseClasses} ${colorClasses[color] || colorClasses['dark/zinc']}\">\n <svg class=\"${checkIconClasses} ${checkColor}\" viewBox=\"0 0 14 14\" fill=\"none\" stroke=\"currentColor\">\n <path d=\"M3 8L6 11L11 3.5\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </span>\n ${label ? `<span class=\"text-sm/6 font-medium text-zinc-950 dark:text-white\">${label}</span>` : ''}\n </label>\n `;\n }\n}\n\nexport interface AdminLayoutCatalystData {\n title: string;\n pageTitle?: string;\n currentPath?: string;\n version?: string;\n enableExperimentalFeatures?: boolean;\n user?: {\n name: string;\n email: string;\n role: string;\n };\n scripts?: string[];\n styles?: string[];\n content: string | HtmlEscapedString;\n dynamicMenuItems?: Array<{\n label: string;\n path: string;\n icon: string;\n }>;\n}\n\nexport function renderAdminLayoutCatalyst(\n data: AdminLayoutCatalystData\n): string {\n return `<!DOCTYPE html>\n<html lang=\"en\" class=\"dark\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>${data.title} - SonicJS AI Admin</title>\n <link rel=\"icon\" type=\"image/x-icon\" href=\"https://demo.sonicjs.com/images/favicon.ico\">\n\n <!-- Tailwind CSS -->\n <script src=\"https://cdn.tailwindcss.com\"></script>\n <script>\n tailwind.config = {\n darkMode: 'class',\n theme: {\n extend: {\n colors: {\n zinc: {\n 50: '#fafafa',\n 100: '#f4f4f5',\n 200: '#e4e4e7',\n 300: '#d4d4d8',\n 400: '#a1a1aa',\n 500: '#71717a',\n 600: '#52525b',\n 700: '#3f3f46',\n 800: '#27272a',\n 900: '#18181b',\n 950: '#09090b'\n }\n }\n }\n }\n }\n </script>\n\n <!-- Additional Styles -->\n <style>\n @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');\n\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: 'Inter', system-ui, -apple-system, sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n\n /* Custom scrollbar */\n ::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n }\n\n ::-webkit-scrollbar-track {\n background: #27272a;\n }\n\n ::-webkit-scrollbar-thumb {\n background: #52525b;\n border-radius: 4px;\n }\n\n ::-webkit-scrollbar-thumb:hover {\n background: #71717a;\n }\n\n /* Smooth transitions */\n * {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n }\n </style>\n\n <!-- Scripts -->\n <script src=\"https://unpkg.com/htmx.org@2.0.3\"></script>\n <script src=\"https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js\" defer></script>\n <script src=\"https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js\"></script>\n\n ${\n data.styles\n ? data.styles\n .map((style) => `<link rel=\"stylesheet\" href=\"${style}\">`)\n .join(\"\\n \")\n : \"\"\n }\n ${\n data.scripts\n ? data.scripts\n .map((script) => `<script src=\"${script}\"></script>`)\n .join(\"\\n \")\n : \"\"\n }\n</head>\n<body class=\"min-h-screen bg-white dark:bg-zinc-900\">\n <div class=\"relative isolate flex min-h-svh w-full max-lg:flex-col lg:bg-zinc-100 dark:lg:bg-zinc-950\">\n <!-- Sidebar on desktop -->\n <div class=\"fixed inset-y-0 left-0 w-64 max-lg:hidden\">\n ${renderCatalystSidebar(\n data.currentPath,\n data.user,\n data.dynamicMenuItems,\n false,\n data.version,\n data.enableExperimentalFeatures\n )}\n </div>\n\n <!-- Mobile sidebar (hidden by default) -->\n <div id=\"mobile-sidebar-overlay\" class=\"fixed inset-0 bg-black/30 lg:hidden hidden z-40\" onclick=\"closeMobileSidebar()\"></div>\n <div id=\"mobile-sidebar\" class=\"fixed inset-y-0 left-0 w-80 transform -translate-x-full transition-transform duration-300 ease-in-out lg:hidden z-50\">\n ${renderCatalystSidebar(\n data.currentPath,\n data.user,\n data.dynamicMenuItems,\n true,\n data.version,\n data.enableExperimentalFeatures\n )}\n </div>\n\n <!-- Main content area -->\n <main class=\"flex flex-1 flex-col pb-2 lg:min-w-0 lg:pr-2 lg:pl-64\">\n <!-- Mobile header with menu toggle -->\n <header class=\"flex items-center px-4 py-2.5 lg:hidden border-b border-zinc-950/5 dark:border-white/5\">\n <button onclick=\"openMobileSidebar()\" class=\"relative flex items-center justify-center rounded-lg p-2 text-zinc-950 hover:bg-zinc-950/5 dark:text-white dark:hover:bg-white/5\" aria-label=\"Open navigation\">\n <svg class=\"h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n <path d=\"M2 6.75C2 6.33579 2.33579 6 2.75 6H17.25C17.6642 6 18 6.33579 18 6.75C18 7.16421 17.6642 7.5 17.25 7.5H2.75C2.33579 7.5 2 7.16421 2 6.75ZM2 13.25C2 12.8358 2.33579 12.5 2.75 12.5H17.25C17.6642 12.5 18 12.8358 18 13.25C18 13.6642 17.6642 14 17.25 14H2.75C2.33579 14 2 13.6642 2 13.25Z\" />\n </svg>\n </button>\n <div class=\"ml-4 flex-1\">\n ${renderLogo({ size: \"sm\", showText: true, variant: \"white\", version: data.version, href: \"/admin\" })}\n </div>\n </header>\n\n <!-- Content -->\n <div class=\"grow p-6 lg:rounded-lg lg:bg-white lg:p-10 lg:shadow-sm lg:ring-1 lg:ring-zinc-950/5 dark:lg:bg-zinc-900 dark:lg:ring-white/10\">\n ${data.content}\n </div>\n </main>\n </div>\n\n <!-- Notification Container -->\n <div id=\"notification-container\" class=\"fixed top-4 right-4 z-50 space-y-2\"></div>\n\n <script>\n // Mobile sidebar toggle\n function openMobileSidebar() {\n const sidebar = document.getElementById('mobile-sidebar');\n const overlay = document.getElementById('mobile-sidebar-overlay');\n sidebar.classList.remove('-translate-x-full');\n overlay.classList.remove('hidden');\n }\n\n function closeMobileSidebar() {\n const sidebar = document.getElementById('mobile-sidebar');\n const overlay = document.getElementById('mobile-sidebar-overlay');\n sidebar.classList.add('-translate-x-full');\n overlay.classList.add('hidden');\n }\n\n // User dropdown toggle\n function toggleUserDropdown() {\n const dropdown = document.getElementById('userDropdown');\n dropdown.classList.toggle('hidden');\n }\n\n // Close dropdown when clicking outside\n document.addEventListener('click', function(event) {\n const dropdown = document.getElementById('userDropdown');\n const button = event.target.closest('[data-user-menu]');\n if (!button && dropdown && !dropdown.contains(event.target)) {\n dropdown.classList.add('hidden');\n }\n });\n\n // Show notification\n function showNotification(message, type = 'info') {\n const container = document.getElementById('notification-container');\n const notification = document.createElement('div');\n const colors = {\n success: 'bg-green-50 dark:bg-green-500/10 text-green-700 dark:text-green-400 ring-green-600/20 dark:ring-green-500/20',\n error: 'bg-red-50 dark:bg-red-500/10 text-red-700 dark:text-red-400 ring-red-600/20 dark:ring-red-500/20',\n warning: 'bg-amber-50 dark:bg-amber-500/10 text-amber-700 dark:text-amber-400 ring-amber-600/20 dark:ring-amber-500/20',\n info: 'bg-blue-50 dark:bg-blue-500/10 text-blue-700 dark:text-blue-400 ring-blue-600/20 dark:ring-blue-500/20'\n };\n\n notification.className = \\`rounded-lg p-4 ring-1 \\${colors[type] || colors.info} max-w-sm shadow-lg\\`;\n notification.innerHTML = \\`\n <div class=\"flex items-center justify-between\">\n <span class=\"text-sm\">\\${message}</span>\n <button onclick=\"this.parentElement.parentElement.remove()\" class=\"ml-4 hover:opacity-70\">\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"></path>\n </svg>\n </button>\n </div>\n \\`;\n\n container.appendChild(notification);\n\n // Auto remove after 5 seconds\n setTimeout(() => {\n if (notification.parentElement) {\n notification.remove();\n }\n }, 5000);\n }\n\n // Initialize dark mode\n if (localStorage.getItem('darkMode') === 'false') {\n document.documentElement.classList.remove('dark');\n }\n </script>\n</body>\n</html>`;\n}\n\nfunction renderCatalystSidebar(\n currentPath: string = \"\",\n user?: any,\n dynamicMenuItems?: Array<{ label: string; path: string; icon: string }>,\n isMobile: boolean = false,\n version?: string,\n enableExperimentalFeatures?: boolean\n): string {\n let baseMenuItems = [\n {\n label: \"Dashboard\",\n path: \"/admin\",\n icon: `<svg class=\"h-5 w-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path d=\"M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z\"/>\n </svg>`,\n },\n {\n label: \"Collections\",\n path: \"/admin/collections\",\n icon: `<svg class=\"h-5 w-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path d=\"M7 3a1 1 0 000 2h6a1 1 0 100-2H7zM4 7a1 1 0 011-1h10a1 1 0 110 2H5a1 1 0 01-1-1zM2 11a2 2 0 012-2h12a2 2 0 012 2v4a2 2 0 01-2 2H4a2 2 0 01-2-2v-4z\"/>\n </svg>`,\n },\n {\n label: \"Content\",\n path: \"/admin/content\",\n icon: `<svg class=\"h-5 w-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path fill-rule=\"evenodd\" d=\"M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z\" clip-rule=\"evenodd\"/>\n </svg>`,\n },\n {\n label: \"Media\",\n path: \"/admin/media\",\n icon: `<svg class=\"h-5 w-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path fill-rule=\"evenodd\" d=\"M4 3a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V5a2 2 0 00-2-2H4zm12 12H4l4-8 3 6 2-4 3 6z\" clip-rule=\"evenodd\"/>\n </svg>`,\n },\n {\n label: \"Users\",\n path: \"/admin/users\",\n icon: `<svg class=\"h-5 w-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path d=\"M9 6a3 3 0 11-6 0 3 3 0 016 0zM17 6a3 3 0 11-6 0 3 3 0 016 0zM12.93 17c.046-.327.07-.66.07-1a6.97 6.97 0 00-1.5-4.33A5 5 0 0119 16v1h-6.07zM6 11a5 5 0 015 5v1H1v-1a5 5 0 015-5z\"/>\n </svg>`,\n },\n ];\n\n // Only include Plugins menu if experimental features are enabled\n if (enableExperimentalFeatures) {\n baseMenuItems.push({\n label: \"Plugins\",\n path: \"/admin/plugins\",\n icon: `<svg class=\"h-5 w-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10\"/>\n </svg>`,\n });\n }\n\n const settingsMenuItem = {\n label: \"Settings\",\n path: \"/admin/settings\",\n icon: `<svg class=\"h-5 w-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path fill-rule=\"evenodd\" d=\"M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z\" clip-rule=\"evenodd\"/>\n </svg>`,\n };\n\n // Combine base menu items with dynamic menu items\n const allMenuItems = [...baseMenuItems];\n if (dynamicMenuItems && dynamicMenuItems.length > 0) {\n // Insert dynamic menu items after Users menu item\n const usersIndex = allMenuItems.findIndex(\n (item) => item.path === \"/admin/users\"\n );\n if (usersIndex !== -1) {\n allMenuItems.splice(usersIndex + 1, 0, ...dynamicMenuItems);\n } else {\n // Fallback: add to end if Users not found\n allMenuItems.push(...dynamicMenuItems);\n }\n }\n\n const closeButton = isMobile\n ? `\n <div class=\"-mb-3 px-4 pt-3\">\n <button onclick=\"closeMobileSidebar()\" class=\"relative flex w-full items-center gap-3 rounded-lg p-2 text-left text-base/6 font-medium text-zinc-950 hover:bg-zinc-950/5 dark:text-white dark:hover:bg-white/5 sm:text-sm/5\" aria-label=\"Close navigation\">\n <svg class=\"h-5 w-5 shrink-0 fill-zinc-500 dark:fill-zinc-400\" viewBox=\"0 0 20 20\">\n <path d=\"M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z\" />\n </svg>\n <span>Close menu</span>\n </button>\n </div>\n `\n : \"\";\n\n return `\n <nav class=\"flex h-full min-h-0 flex-col bg-white shadow-sm ring-1 ring-zinc-950/5 dark:bg-zinc-900 dark:ring-white/10 ${\n isMobile ? \"rounded-lg p-2 m-2\" : \"\"\n }\">\n ${closeButton}\n\n <!-- Sidebar Header -->\n <div class=\"flex flex-col border-b border-zinc-950/5 p-4 dark:border-white/5\">\n ${renderLogo({ size: \"md\", showText: true, variant: \"white\", version, href: \"/admin\" })}\n </div>\n\n <!-- Sidebar Body -->\n <div class=\"flex flex-1 flex-col overflow-y-auto p-4\">\n <div class=\"flex flex-col gap-0.5\">\n ${allMenuItems\n .map((item) => {\n const isActive =\n currentPath === item.path ||\n (item.path !== \"/admin\" && currentPath?.startsWith(item.path));\n return `\n <span class=\"relative\">\n ${\n isActive\n ? `\n <span class=\"absolute inset-y-2 -left-4 w-0.5 rounded-full bg-cyan-500 dark:bg-cyan-400\"></span>\n `\n : \"\"\n }\n <a\n href=\"${item.path}\"\n class=\"flex w-full items-center gap-3 rounded-lg px-2 py-2.5 text-left text-sm/5 font-medium ${\n isActive\n ? \"text-zinc-950 dark:text-white\"\n : \"text-zinc-950 hover:bg-zinc-950/5 dark:text-white dark:hover:bg-white/5\"\n }\"\n ${isActive ? 'data-current=\"true\"' : \"\"}\n >\n <span class=\"shrink-0 ${\n isActive\n ? \"fill-zinc-950 dark:fill-white\"\n : \"fill-zinc-500 dark:fill-zinc-400\"\n }\">\n ${item.icon}\n </span>\n <span class=\"truncate\">${item.label}</span>\n </a>\n </span>\n `;\n })\n .join(\"\")}\n </div>\n </div>\n\n <!-- Settings Menu Item (Bottom) -->\n <div class=\"border-t border-zinc-950/5 p-4 dark:border-white/5\">\n ${(() => {\n const isActive =\n currentPath === settingsMenuItem.path ||\n currentPath?.startsWith(settingsMenuItem.path);\n return `\n <span class=\"relative\">\n ${\n isActive\n ? `\n <span class=\"absolute inset-y-2 -left-4 w-0.5 rounded-full bg-cyan-500 dark:bg-cyan-400\"></span>\n `\n : \"\"\n }\n <a\n href=\"${settingsMenuItem.path}\"\n class=\"flex w-full items-center gap-3 rounded-lg px-2 py-2.5 text-left text-sm/5 font-medium ${\n isActive\n ? \"text-zinc-950 dark:text-white\"\n : \"text-zinc-950 hover:bg-zinc-950/5 dark:text-white dark:hover:bg-white/5\"\n }\"\n ${isActive ? 'data-current=\"true\"' : \"\"}\n >\n <span class=\"shrink-0 ${\n isActive\n ? \"fill-zinc-950 dark:fill-white\"\n : \"fill-zinc-500 dark:fill-zinc-400\"\n }\">\n ${settingsMenuItem.icon}\n </span>\n <span class=\"truncate\">${settingsMenuItem.label}</span>\n </a>\n </span>\n `;\n })()}\n </div>\n\n <!-- Sidebar Footer (User) -->\n ${\n user\n ? `\n <div class=\"flex flex-col border-t border-zinc-950/5 p-4 dark:border-white/5\">\n <div class=\"relative\">\n <button\n data-user-menu\n onclick=\"toggleUserDropdown()\"\n class=\"flex w-full items-center gap-3 rounded-lg px-2 py-2.5 text-left text-sm/5 font-medium text-zinc-950 hover:bg-zinc-950/5 dark:text-white dark:hover:bg-white/5\"\n >\n <div class=\"flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-zinc-950 text-white dark:bg-white dark:text-zinc-950\">\n <span class=\"text-xs font-semibold\">${(\n user.name ||\n user.email ||\n \"U\"\n )\n .charAt(0)\n .toUpperCase()}</span>\n </div>\n <span class=\"flex-1 truncate\">${\n user.name || user.email || \"User\"\n }</span>\n <svg class=\"h-4 w-4 shrink-0 fill-zinc-500 dark:fill-zinc-400\" viewBox=\"0 0 20 20\">\n <path d=\"M5.22 8.22a.75.75 0 0 1 1.06 0L10 11.94l3.72-3.72a.75.75 0 1 1 1.06 1.06l-4.25 4.25a.75.75 0 0 1-1.06 0L5.22 9.28a.75.75 0 0 1 0-1.06Z\" />\n </svg>\n </button>\n\n <!-- User Dropdown -->\n <div id=\"userDropdown\" class=\"hidden absolute bottom-full mb-2 left-0 right-0 mx-2 rounded-xl bg-white shadow-lg ring-1 ring-zinc-950/10 dark:bg-zinc-800 dark:ring-white/10 z-50\">\n <div class=\"p-2\">\n <div class=\"px-3 py-2 border-b border-zinc-950/5 dark:border-white/5\">\n <p class=\"text-sm font-medium text-zinc-950 dark:text-white\">${\n user.name || user.email || \"User\"\n }</p>\n <p class=\"text-xs text-zinc-500 dark:text-zinc-400\">${\n user.email || \"\"\n }</p>\n </div>\n <a href=\"/admin/profile\" class=\"flex items-center gap-2 rounded-lg px-3 py-2 text-sm text-zinc-950 hover:bg-zinc-950/5 dark:text-white dark:hover:bg-white/5\">\n <svg class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z\"/>\n </svg>\n My Profile\n </a>\n <a href=\"/admin/settings\" class=\"flex items-center gap-2 rounded-lg px-3 py-2 text-sm text-zinc-950 hover:bg-zinc-950/5 dark:text-white dark:hover:bg-white/5\">\n <svg class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z\"/>\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 12a3 3 0 11-6 0 3 3 0 016 0z\"/>\n </svg>\n Settings\n </a>\n <a href=\"/auth/logout\" class=\"flex items-center gap-2 rounded-lg px-3 py-2 text-sm text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-500/10\">\n <svg class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1\"/>\n </svg>\n Sign Out\n </a>\n </div>\n </div>\n </div>\n </div>\n `\n : \"\"\n }\n </nav>\n `;\n}\n","import { renderLogo } from '../components/logo.template'\nimport { HtmlEscapedString } from 'hono/utils/html'\n\nexport interface AdminLayoutData {\n title: string\n pageTitle?: string\n currentPath?: string\n version?: string\n enableExperimentalFeatures?: boolean\n user?: {\n name: string\n email: string\n role: string\n }\n scripts?: string[]\n styles?: string[]\n content: string | HtmlEscapedString\n dynamicMenuItems?: Array<{\n label: string\n path: string\n icon: string\n }>\n}\n\nexport function renderAdminLayout(data: AdminLayoutData): string {\n // Import and use the new Catalyst layout\n const { renderAdminLayoutCatalyst } = require('./admin-layout-catalyst.template')\n return renderAdminLayoutCatalyst(data);\n}\n\nexport function adminLayoutV2(data: AdminLayoutData): string {\n return `<!DOCTYPE html>\n<html lang=\"en\" class=\"dark\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>${data.title} - SonicJS AI Admin</title>\n <link rel=\"icon\" type=\"image/x-icon\" href=\"https://demo.sonicjs.com/images/favicon.ico\">\n \n <!-- Tailwind CSS -->\n <script src=\"https://cdn.tailwindcss.com\"></script>\n <script>\n tailwind.config = {\n darkMode: 'class',\n theme: {\n extend: {\n backdropBlur: {\n xs: '2px',\n },\n colors: {\n primary: '#465FFF',\n secondary: '#212A3E',\n dark: '#1C1C24',\n 'dark-2': '#1A1A27',\n 'dark-3': '#2C2C54',\n 'dark-4': '#40407A',\n 'dark-5': '#706FD3',\n 'gray-1': '#F7F9FC',\n 'gray-2': '#E4E6EA',\n 'gray-3': '#D2D4D9',\n 'gray-4': '#9CA3AF',\n 'gray-5': '#6B7280',\n 'gray-6': '#4B5563',\n 'gray-7': '#374151',\n 'gray-8': '#1F2937',\n 'gray-9': '#111827',\n success: '#10B981',\n warning: '#F59E0B',\n error: '#EF4444',\n info: '#3B82F6'\n },\n fontFamily: {\n satoshi: ['Satoshi', 'sans-serif'],\n },\n spacing: {\n '4.5': '1.125rem',\n '5.5': '1.375rem',\n '6.5': '1.625rem',\n '7.5': '1.875rem'\n },\n boxShadow: {\n 'default': '0px 8px 13px -3px rgba(0, 0, 0, 0.07)',\n 'card': '0px 1px 3px rgba(0, 0, 0, 0.12)',\n 'card-2': '0px 1px 2px rgba(0, 0, 0, 0.05)',\n 'switcher': '0px 2px 4px rgba(0, 0, 0, 0.2), inset 0px 2px 2px #FFFFFF, inset 0px -1px 1px rgba(0, 0, 0, 0.1)',\n },\n dropShadow: {\n 1: '0px 1px 0px #E2E8F0',\n 2: '0px 1px 4px rgba(0, 0, 0, 0.12)',\n }\n }\n }\n }\n </script>\n \n <!-- Additional Styles -->\n <style>\n @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');\n \n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n \n body {\n font-family: 'Inter', system-ui, -apple-system, sans-serif;\n }\n \n /* Custom scrollbar */\n ::-webkit-scrollbar {\n width: 6px;\n }\n \n ::-webkit-scrollbar-track {\n background: #1F2937;\n }\n \n ::-webkit-scrollbar-thumb {\n background: #465FFF;\n border-radius: 3px;\n }\n \n ::-webkit-scrollbar-thumb:hover {\n background: #3B4EE8;\n }\n \n /* Sidebar animations */\n .sidebar-item {\n transition: all 0.3s ease;\n }\n \n .sidebar-item:hover {\n transform: translateX(4px);\n }\n \n /* Card animations */\n .card-hover {\n transition: all 0.3s ease;\n }\n \n .card-hover:hover {\n transform: translateY(-2px);\n box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);\n }\n \n /* Button gradients */\n .btn-gradient {\n background: linear-gradient(135deg, #465FFF 0%, #9333EA 100%);\n }\n \n .btn-gradient:hover {\n background: linear-gradient(135deg, #3B4EE8 0%, #7C2D12 100%);\n }\n \n /* Dark mode form elements */\n .form-input {\n background-color: #1F2937;\n border-color: #374151;\n color: #F9FAFB;\n }\n \n .form-input:focus {\n border-color: #465FFF;\n box-shadow: 0 0 0 3px rgba(70, 95, 255, 0.1);\n }\n \n /* Notification styles */\n .notification {\n animation: slideInRight 0.3s ease-out;\n }\n \n @keyframes slideInRight {\n from {\n transform: translateX(100%);\n opacity: 0;\n }\n to {\n transform: translateX(0);\n opacity: 1;\n }\n }\n \n /* Custom slider styles */\n .slider::-webkit-slider-thumb {\n appearance: none;\n height: 16px;\n width: 16px;\n border-radius: 50%;\n background: #465FFF;\n cursor: pointer;\n border: 2px solid white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n }\n \n .slider::-moz-range-thumb {\n height: 16px;\n width: 16px;\n border-radius: 50%;\n background: #465FFF;\n cursor: pointer;\n border: 2px solid white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n }\n \n .slider::-webkit-slider-track {\n height: 8px;\n border-radius: 4px;\n background: rgba(255, 255, 255, 0.2);\n }\n \n .slider::-moz-range-track {\n height: 8px;\n border-radius: 4px;\n background: rgba(255, 255, 255, 0.2);\n border: none;\n }\n \n /* PNG Background Images */\n .svg-pattern-blue-waves {\n background-color: #111827;\n background-image: url('/images/backgrounds/blue-waves.png');\n background-size: cover;\n background-position: center;\n background-repeat: no-repeat;\n }\n \n .svg-pattern-blue-crescent {\n background-color: #111827;\n background-image: url('/images/backgrounds/blue-crescent.png');\n background-size: cover;\n background-position: center;\n background-repeat: no-repeat;\n }\n \n .svg-pattern-blue-stars {\n background-color: #111827;\n background-image: url('/images/backgrounds/blue-stars.png');\n background-size: cover;\n background-position: center;\n background-repeat: no-repeat;\n }\n \n .svg-pattern-blue-waves-3d {\n background-color: #111827;\n background-image: url('/images/backgrounds/blue-waves-3d.png');\n background-size: cover;\n background-position: center;\n background-repeat: no-repeat;\n }\n </style>\n \n <!-- Scripts -->\n <script src=\"https://unpkg.com/htmx.org@2.0.3\"></script>\n <script src=\"https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js\" defer></script>\n <script src=\"https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js\"></script>\n \n ${data.styles ? data.styles.map(style => `<link rel=\"stylesheet\" href=\"${style}\">`).join('\\n ') : ''}\n ${data.scripts ? data.scripts.map(script => `<script src=\"${script}\"></script>`).join('\\n ') : ''}\n</head>\n<body class=\"bg-gradient-to-br from-slate-900 via-gray-900 to-black min-h-screen text-gray-1\">\n <!-- Background overlay with glass effect -->\n <div id=\"background-overlay\" class=\"fixed inset-0 backdrop-blur-sm\" style=\"background-color: rgba(0, 0, 0, 0.2);\"></div>\n <!-- Main container -->\n <div class=\"relative z-10 min-h-screen\">\n <!-- Header -->\n ${renderTopBar(data.pageTitle || 'Dashboard', data.user)}\n\n <!-- Main content area -->\n <div class=\"px-4 sm:px-6 lg:px-8 py-8\">\n <div class=\"grid grid-cols-1 lg:grid-cols-5 gap-6\">\n <!-- Sidebar -->\n <div class=\"lg:col-span-1\">\n ${renderSidebar(data.currentPath || '/', data.user, data.dynamicMenuItems)}\n </div>\n \n <!-- Main content -->\n <div class=\"lg:col-span-4\">\n ${data.content}\n </div>\n </div>\n </div>\n </div>\n \n <!-- Notification Container -->\n <div id=\"notification-container\" class=\"fixed top-4 right-4 z-50 space-y-2\"></div>\n \n <script>\n // Dark mode toggle functionality\n function toggleDarkMode() {\n document.documentElement.classList.toggle('dark');\n localStorage.setItem('darkMode', document.documentElement.classList.contains('dark'));\n }\n \n // Initialize dark mode from localStorage\n if (localStorage.getItem('darkMode') === 'true' || (!('darkMode' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {\n document.documentElement.classList.add('dark');\n }\n \n // Sidebar toggle for mobile\n function toggleSidebar() {\n const sidebar = document.getElementById('sidebar');\n const overlay = document.getElementById('sidebar-overlay');\n sidebar.classList.toggle('-translate-x-full');\n overlay.classList.toggle('hidden');\n }\n \n // Close sidebar on overlay click\n function closeSidebar() {\n const sidebar = document.getElementById('sidebar');\n const overlay = document.getElementById('sidebar-overlay');\n sidebar.classList.add('-translate-x-full');\n overlay.classList.add('hidden');\n }\n \n // User dropdown toggle\n function toggleUserDropdown() {\n const dropdown = document.getElementById('userDropdown');\n dropdown.classList.toggle('hidden');\n }\n \n // Close dropdown when clicking outside\n document.addEventListener('click', function(event) {\n const dropdown = document.getElementById('userDropdown');\n const button = event.target.closest('button');\n if (!button || !button.getAttribute('onclick')) {\n dropdown.classList.add('hidden');\n }\n });\n \n // Show notification\n function showNotification(message, type = 'info') {\n const container = document.getElementById('notification-container');\n const notification = document.createElement('div');\n const colors = {\n success: 'bg-success text-white',\n error: 'bg-error text-white',\n warning: 'bg-warning text-white',\n info: 'bg-info text-white'\n };\n \n notification.className = \\`notification px-6 py-4 rounded-lg shadow-lg \\${colors[type] || colors.info} max-w-sm\\`;\n notification.innerHTML = \\`\n <div class=\"flex items-center justify-between\">\n <span>\\${message}</span>\n <button onclick=\"this.parentElement.parentElement.remove()\" class=\"ml-4 text-white/80 hover:text-white\">\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"></path>\n </svg>\n </button>\n </div>\n \\`;\n \n container.appendChild(notification);\n \n // Auto remove after 5 seconds\n setTimeout(() => {\n if (notification.parentElement) {\n notification.remove();\n }\n }, 5000);\n }\n \n // Background customizer functionality\n function toggleBackgroundCustomizer() {\n const dropdown = document.getElementById('backgroundCustomizer');\n dropdown.classList.toggle('hidden');\n }\n \n // Background themes\n const backgroundThemes = {\n 'default': 'bg-gradient-to-br from-slate-900 via-gray-900 to-black',\n 'cosmic-blue': 'bg-gradient-to-br from-slate-900 via-blue-900 to-indigo-900',\n 'matrix-green': 'bg-gradient-to-br from-gray-900 via-emerald-900 to-green-900',\n 'cyber-pink': 'bg-gradient-to-br from-gray-900 via-pink-900 to-rose-900',\n 'neon-orange': 'bg-gradient-to-br from-gray-900 via-orange-900 to-amber-900',\n 'purple-space': 'bg-gradient-to-br from-gray-900 via-purple-900 to-violet-800',\n 'blue-waves': 'svg-pattern-blue-waves',\n 'blue-crescent': 'svg-pattern-blue-crescent',\n 'blue-stars': 'svg-pattern-blue-stars',\n 'blue-waves-3d': 'svg-pattern-blue-waves-3d'\n };\n \n // Set background theme\n function setBackground(theme) {\n const body = document.body;\n \n // Remove all existing background classes and SVG patterns\n Object.values(backgroundThemes).forEach(bgClass => {\n if (bgClass.startsWith('svg-pattern-')) {\n body.classList.remove(bgClass);\n } else {\n body.classList.remove(...bgClass.split(' ').slice(1)); // Remove 'bg-gradient-to-br' prefix\n }\n });\n body.classList.remove('bg-gradient-to-br');\n \n // Add new background\n const themeClass = backgroundThemes[theme];\n if (themeClass.startsWith('svg-pattern-')) {\n body.classList.add(themeClass);\n } else {\n const newClasses = themeClass.split(' ').slice(1); // Remove 'bg-gradient-to-br' prefix\n body.classList.add('bg-gradient-to-br', ...newClasses);\n }\n \n // Save preference\n localStorage.setItem('backgroundTheme', theme);\n \n // Close dropdown\n toggleBackgroundCustomizer();\n \n // Show notification\n showNotification('Background changed to ' + theme.replace('-', ' '), 'success');\n }\n \n // Adjust background darkness\n function adjustDarkness(value) {\n const overlay = document.getElementById('background-overlay');\n if (overlay) {\n const opacity = value / 100; // Convert percentage to decimal\n overlay.style.backgroundColor = 'rgba(0, 0, 0, ' + opacity + ')';\n localStorage.setItem('backgroundDarkness', value);\n console.log('Darkness adjusted to:', value + '%', 'Opacity:', opacity);\n } else {\n console.log('Overlay element not found');\n }\n }\n \n // Initialize background on page load\n function initializeBackground() {\n const savedTheme = localStorage.getItem('backgroundTheme') || 'default';\n const savedDarkness = localStorage.getItem('backgroundDarkness') || '20';\n \n // Set background theme\n if (savedTheme !== 'default') {\n const body = document.body;\n const themeClass = backgroundThemes[savedTheme];\n \n // Remove all existing backgrounds first\n Object.values(backgroundThemes).forEach(bgClass => {\n if (bgClass.startsWith('svg-pattern-')) {\n body.classList.remove(bgClass);\n } else {\n body.classList.remove(...bgClass.split(' ').slice(1));\n }\n });\n body.classList.remove('bg-gradient-to-br');\n \n // Apply saved theme\n if (themeClass.startsWith('svg-pattern-')) {\n body.classList.add(themeClass);\n } else {\n const newClasses = themeClass.split(' ').slice(1);\n body.classList.add('bg-gradient-to-br', ...newClasses);\n }\n }\n \n // Set darkness\n const overlay = document.getElementById('background-overlay');\n if (overlay) {\n const opacity = savedDarkness / 100;\n overlay.style.backgroundColor = 'rgba(0, 0, 0, ' + opacity + ')';\n }\n \n // Set slider value\n const slider = document.getElementById('darknessSlider');\n if (slider) {\n slider.value = savedDarkness;\n }\n }\n \n // Close dropdown when clicking outside\n document.addEventListener('click', function(event) {\n const dropdown = document.getElementById('backgroundCustomizer');\n const button = event.target.closest('button');\n const slider = event.target.closest('#darknessSlider');\n const dropdownContainer = event.target.closest('#backgroundCustomizer');\n \n // Don't close if clicking inside the dropdown, on the toggle button, or on the slider\n if (!button?.getAttribute('onclick')?.includes('toggleBackgroundCustomizer') && \n !slider && !dropdownContainer) {\n dropdown?.classList.add('hidden');\n }\n });\n \n // Initialize background when page loads\n document.addEventListener('DOMContentLoaded', initializeBackground);\n </script>\n</body>\n</html>`\n}\n\nfunction renderSidebar(currentPath: string, user?: any, dynamicMenuItems?: Array<{\n label: string\n path: string\n icon: string\n}>): string {\n const baseMenuItems = [\n {\n label: 'Dashboard',\n path: '/admin',\n icon: `<svg class=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path d=\"M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z\"/>\n </svg>`\n },\n {\n label: 'Content',\n path: '/admin/content',\n icon: `<svg class=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/>\n </svg>`\n },\n {\n label: 'Collections',\n path: '/admin/collections',\n icon: `<svg class=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path d=\"M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3z\"/>\n </svg>`\n },\n {\n label: 'Media',\n path: '/admin/media',\n icon: `<svg class=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path fill-rule=\"evenodd\" d=\"M3 3a1 1 0 000 2v8a2 2 0 002 2h2.586l-1.293 1.293a1 1 0 101.414 1.414L10 15.414l2.293 2.293a1 1 0 001.414-1.414L12.414 15H15a2 2 0 002-2V5a1 1 0 100-2H3zm11.707 4.707a1 1 0 00-1.414-1.414L10 9.586 8.707 8.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\" clip-rule=\"evenodd\"/>\n </svg>`\n },\n {\n label: 'Users',\n path: '/admin/users',\n icon: `<svg class=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path d=\"M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3z\"/>\n </svg>`\n },\n {\n label: 'Plugins',\n path: '/admin/plugins',\n icon: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10\"/>\n </svg>`\n },\n {\n label: 'Cache',\n path: '/admin/cache',\n icon: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 10V3L4 14h7v7l9-11h-7z\"/>\n </svg>`\n },\n {\n label: 'Design',\n path: '/admin/design',\n icon: `<svg class=\"w-5 h-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4.098 19.902a3.75 3.75 0 0 0 5.304 0l6.401-6.402M6.75 21A3.75 3.75 0 0 1 3 17.25V4.125C3 3.504 3.504 3 4.125 3h5.25c.621 0 1.125.504 1.125 1.125v4.072M6.75 21a3.75 3.75 0 0 0 3.75-3.75V8.197M6.75 21h13.125c.621 0 1.125-.504 1.125-1.125v-5.25c0-.621-.504-1.125-1.125-1.125h-4.072M10.5 8.197l2.88-2.88c.438-.439 1.15-.439 1.59 0l3.712 3.713c.44.44.44 1.152 0 1.59l-2.879 2.88M6.75 17.25h.008v.008H6.75v-.008Z\" />\n </svg>`\n },\n {\n label: 'Logs',\n path: '/admin/logs',\n icon: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/>\n </svg>`\n },\n {\n label: 'Settings',\n path: '/admin/settings',\n icon: `<svg class=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path fill-rule=\"evenodd\" d=\"M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z\" clip-rule=\"evenodd\"/>\n </svg>`\n },\n {\n label: 'API Reference',\n path: '/admin/api-reference',\n icon: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4\"/>\n </svg>`\n },\n {\n label: 'Field Types',\n path: '/admin/field-types',\n icon: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5H7a2 2 0 00-2 2v10a2 2 0 002 2h8a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"/>\n </svg>`\n },\n {\n label: 'API Spec',\n path: '/api',\n target: '_blank',\n icon: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/>\n </svg>`\n }\n ]\n\n // Combine base menu items with dynamic menu items from active plugins\n const allMenuItems = [...baseMenuItems]\n\n // Insert dynamic menu items after \"Users\"\n if (dynamicMenuItems && dynamicMenuItems.length > 0) {\n const usersIndex = allMenuItems.findIndex(item => item.path === '/admin/users')\n if (usersIndex !== -1) {\n allMenuItems.splice(usersIndex + 1, 0, ...dynamicMenuItems)\n } else {\n // Fallback: add to end if Users not found\n allMenuItems.push(...dynamicMenuItems)\n }\n }\n\n return `\n <nav class=\"backdrop-blur-md bg-black/30 rounded-xl border border-white/10 shadow-xl p-6 h-[calc(100vh-9.5rem)] sticky top-8\">\n <div class=\"space-y-4\">\n ${allMenuItems.map(item => {\n const isActive = currentPath === item.path || (item.path !== '/admin' && currentPath.startsWith(item.path))\n const targetAttr = (item as any).target ? ` target=\"${(item as any).target}\"` : ''\n return `\n <a href=\"${item.path}\"${targetAttr} class=\"flex items-center space-x-3 ${isActive ? 'text-white bg-white/20' : 'text-gray-300 hover:text-white'} rounded-lg px-3 py-2 transition-all hover:bg-white/10\">\n ${item.icon}\n <span>${item.label}</span>\n </a>\n `\n }).join('')}\n </div>\n </nav>\n `\n}\n\nfunction renderTopBar(pageTitle: string, user?: any): string {\n return `\n <header class=\"backdrop-blur-md bg-white/10 border-b border-white/20 shadow-lg relative z-[9998]\">\n <div class=\"px-4 sm:px-6 lg:px-8\">\n <div class=\"flex justify-between items-center py-4\">\n <div class=\"flex items-center space-x-4\">\n ${renderLogo({ size: 'md', showText: true, variant: 'white' })}\n </div>\n \n <div class=\"flex items-center space-x-4\">\n <!-- Notifications -->\n <button class=\"p-2 text-gray-300 hover:text-white transition-colors rounded-lg hover:bg-white/10 relative\">\n <svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9\"/>\n </svg>\n <span class=\"absolute top-1 right-1 w-2 h-2 bg-red-400 rounded-full\"></span>\n </button>\n\n <!-- Background Customizer -->\n <div class=\"relative z-[9999]\">\n <button class=\"p-2 text-gray-300 hover:text-white transition-colors rounded-lg hover:bg-white/10\" onclick=\"toggleBackgroundCustomizer()\">\n <svg class=\"w-5 h-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4.098 19.902a3.75 3.75 0 0 0 5.304 0l6.401-6.402M6.75 21A3.75 3.75 0 0 1 3 17.25V4.125C3 3.504 3.504 3 4.125 3h5.25c.621 0 1.125.504 1.125 1.125v4.072M6.75 21a3.75 3.75 0 0 0 3.75-3.75V8.197M6.75 21h13.125c.621 0 1.125-.504 1.125-1.125v-5.25c0-.621-.504-1.125-1.125-1.125h-4.072M10.5 8.197l2.88-2.88c.438-.439 1.15-.439 1.59 0l3.712 3.713c.44.44.44 1.152 0 1.59l-2.879 2.88M6.75 17.25h.008v.008H6.75v-.008Z\" />\n </svg>\n </button>\n \n <!-- Background Customizer Dropdown -->\n <div id=\"backgroundCustomizer\" class=\"hidden absolute right-0 mt-2 w-80 backdrop-blur-md bg-black/95 rounded-xl border border-white/10 shadow-xl z-[9999]\">\n <div class=\"p-6\">\n <div class=\"flex items-center justify-between mb-4\">\n <h3 class=\"text-lg font-semibold text-white\">Background Themes</h3>\n <button onclick=\"toggleBackgroundCustomizer()\" class=\"text-gray-400 hover:text-white\">\n <svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"/>\n </svg>\n </button>\n </div>\n \n <!-- Background Options -->\n <div class=\"space-y-3 mb-6\">\n <div class=\"grid grid-cols-2 gap-3\">\n <!-- Default (Deep Space) -->\n <button onclick=\"setBackground('default')\" class=\"bg-preview bg-gradient-to-br from-slate-900 via-gray-900 to-black h-16 rounded-lg border-2 border-white/20 hover:border-white/40 transition-all relative group\">\n <div class=\"absolute inset-0 bg-black/20 rounded-lg\"></div>\n <div class=\"absolute bottom-1 left-2 text-xs text-white font-medium\">Default</div>\n </button>\n \n <!-- Cosmic Blue -->\n <button onclick=\"setBackground('cosmic-blue')\" class=\"bg-preview bg-gradient-to-br from-slate-900 via-blue-900 to-indigo-900 h-16 rounded-lg border-2 border-white/20 hover:border-white/40 transition-all relative group\">\n <div class=\"absolute inset-0 bg-black/20 rounded-lg\"></div>\n <div class=\"absolute bottom-1 left-2 text-xs text-white font-medium\">Cosmic</div>\n </button>\n \n <!-- Matrix Green -->\n <button onclick=\"setBackground('matrix-green')\" class=\"bg-preview bg-gradient-to-br from-gray-900 via-emerald-900 to-green-900 h-16 rounded-lg border-2 border-white/20 hover:border-white/40 transition-all relative group\">\n <div class=\"absolute inset-0 bg-black/20 rounded-lg\"></div>\n <div class=\"absolute bottom-1 left-2 text-xs text-white font-medium\">Matrix</div>\n </button>\n \n <!-- Cyber Pink -->\n <button onclick=\"setBackground('cyber-pink')\" class=\"bg-preview bg-gradient-to-br from-gray-900 via-pink-900 to-rose-900 h-16 rounded-lg border-2 border-white/20 hover:border-white/40 transition-all relative group\">\n <div class=\"absolute inset-0 bg-black/20 rounded-lg\"></div>\n <div class=\"absolute bottom-1 left-2 text-xs text-white font-medium\">Cyber</div>\n </button>\n \n <!-- Neon Orange -->\n <button onclick=\"setBackground('neon-orange')\" class=\"bg-preview bg-gradient-to-br from-gray-900 via-orange-900 to-amber-900 h-16 rounded-lg border-2 border-white/20 hover:border-white/40 transition-all relative group\">\n <div class=\"absolute inset-0 bg-black/20 rounded-lg\"></div>\n <div class=\"absolute bottom-1 left-2 text-xs text-white font-medium\">Neon</div>\n </button>\n \n <!-- Purple Space -->\n <button onclick=\"setBackground('purple-space')\" class=\"bg-preview bg-gradient-to-br from-gray-900 via-purple-900 to-violet-800 h-16 rounded-lg border-2 border-white/20 hover:border-white/40 transition-all relative group\">\n <div class=\"absolute inset-0 bg-black/20 rounded-lg\"></div>\n <div class=\"absolute bottom-1 left-2 text-xs text-white font-medium\">Purple</div>\n </button>\n </div>\n \n <!-- Custom Backgrounds -->\n <div class=\"mt-4\">\n <h4 class=\"text-sm font-medium text-gray-300 mb-3\">Custom Backgrounds</h4>\n <div class=\"grid grid-cols-2 gap-3\">\n <!-- Blue Waves -->\n <button onclick=\"setBackground('blue-waves')\" class=\"h-16 rounded-lg border-2 border-white/20 hover:border-white/40 transition-all relative group overflow-hidden\">\n <div class=\"absolute inset-0\">\n <img src=\"/images/backgrounds/blue-waves.png\" alt=\"Blue Waves\" class=\"w-full h-full object-cover opacity-60\">\n </div>\n <div class=\"absolute bottom-1 left-2 text-xs text-white font-medium bg-black/50 px-2 py-1 rounded\">Waves</div>\n </button>\n \n <!-- Blue Crescent -->\n <button onclick=\"setBackground('blue-crescent')\" class=\"h-16 rounded-lg border-2 border-white/20 hover:border-white/40 transition-all relative group overflow-hidden\">\n <div class=\"absolute inset-0\">\n <img src=\"/images/backgrounds/blue-crescent.png\" alt=\"Blue Crescent\" class=\"w-full h-full object-cover opacity-60\">\n </div>\n <div class=\"absolute bottom-1 left-2 text-xs text-white font-medium bg-black/50 px-2 py-1 rounded\">Crescent</div>\n </button>\n \n <!-- Blue Stars -->\n <button onclick=\"setBackground('blue-stars')\" class=\"h-16 rounded-lg border-2 border-white/20 hover:border-white/40 transition-all relative group overflow-hidden\">\n <div class=\"absolute inset-0\">\n <img src=\"/images/backgrounds/blue-stars.png\" alt=\"Blue Stars\" class=\"w-full h-full object-cover opacity-60\">\n </div>\n <div class=\"absolute bottom-1 left-2 text-xs text-white font-medium bg-black/50 px-2 py-1 rounded\">Stars</div>\n </button>\n \n <!-- Blue Waves 3D -->\n <button onclick=\"setBackground('blue-waves-3d')\" class=\"h-16 rounded-lg border-2 border-white/20 hover:border-white/40 transition-all relative group overflow-hidden\">\n <div class=\"absolute inset-0\">\n <img src=\"/images/backgrounds/blue-waves-3d.png\" alt=\"Blue Waves 3D\" class=\"w-full h-full object-cover opacity-60\">\n </div>\n <div class=\"absolute bottom-1 left-2 text-xs text-white font-medium bg-black/50 px-2 py-1 rounded\">3D Waves</div>\n </button>\n </div>\n </div>\n </div>\n \n <!-- Darkness Slider -->\n <div class=\"space-y-3\">\n <label class=\"block text-sm font-medium text-white\">Background Darkness</label>\n <div class=\"flex items-center space-x-3\">\n <svg class=\"w-4 h-4 text-gray-400\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707\"/>\n </svg>\n <input \n type=\"range\" \n id=\"darknessSlider\" \n min=\"10\" \n max=\"100\" \n value=\"20\" \n class=\"flex-1 h-2 bg-white/20 rounded-lg appearance-none cursor-pointer slider\"\n oninput=\"adjustDarkness(this.value)\"\n onchange=\"adjustDarkness(this.value)\"\n >\n <svg class=\"w-4 h-4 text-gray-400\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z\"/>\n </svg>\n </div>\n <div class=\"text-xs text-gray-400 text-center\">Adjust overlay darkness</div>\n </div>\n </div>\n </div>\n </div>\n \n <!-- User Dropdown -->\n ${user ? `\n <div class=\"relative z-[9999]\">\n <button class=\"flex items-center space-x-3 p-2 rounded-lg hover:bg-white/10 transition-colors group\" onclick=\"toggleUserDropdown()\">\n <div class=\"w-8 h-8 bg-gradient-to-br from-green-400 to-blue-500 rounded-full flex items-center justify-center\">\n <span class=\"text-white text-sm font-medium\">${(user.name || user.email || 'U').charAt(0).toUpperCase()}</span>\n </div>\n <div class=\"hidden md:block text-left\">\n <div class=\"text-white text-sm font-medium\">${user.name || user.email || 'User'}</div>\n <div class=\"text-gray-400 text-xs\">${user.role || 'Administrator'}</div>\n </div>\n <svg class=\"w-4 h-4 text-gray-400 group-hover:text-white transition-colors\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 9l-7 7-7-7\"/>\n </svg>\n </button>\n \n <!-- Dropdown Menu -->\n <div id=\"userDropdown\" class=\"hidden absolute right-0 mt-2 w-48 backdrop-blur-md bg-black/95 rounded-xl border border-white/10 shadow-xl z-[9999]\">\n <div class=\"py-2\">\n <div class=\"px-4 py-2 border-b border-white/10\">\n <p class=\"text-sm font-medium text-gray-1\">${user.name || user.email || 'User'}</p>\n <p class=\"text-xs text-gray-4\">${user.email || ''}</p>\n </div>\n <a href=\"/admin/profile\" class=\"flex items-center gap-3 px-4 py-2 text-sm text-gray-300 hover:bg-white/10 hover:text-white transition-colors\">\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z\"/>\n </svg>\n My Profile\n </a>\n <a href=\"/admin/settings\" class=\"flex items-center gap-3 px-4 py-2 text-sm text-gray-300 hover:bg-white/10 hover:text-white transition-colors\">\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z\"/>\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 12a3 3 0 11-6 0 3 3 0 016 0z\"/>\n </svg>\n Settings\n </a>\n <a href=\"/auth/logout\" class=\"flex items-center gap-3 px-4 py-2 text-sm text-red-300 hover:bg-red-500/10 hover:text-red-200 transition-colors\">\n <svg class=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1\"/>\n </svg>\n Sign Out\n </a>\n </div>\n </div>\n </div>\n ` : `\n <a href=\"/auth/login\" class=\"backdrop-blur-md bg-white/10 px-4 py-2 rounded-lg text-white font-medium hover:bg-white/20 transition-all\">\n Sign In\n </a>\n `}\n </div>\n </div>\n </header>\n `\n}"]}