webspresso 0.0.86 → 0.0.87

package/README.md

@@ -885,7 +885,7 @@ if (adminApi) {
 | `scripts` | External script URLs, script objects, or inline scripts injected into SSR Admin Panel (`registerScript`) |
 | `styles` | External stylesheet URLs or inline CSS injected into SSR Admin Panel (`registerStyle`) |
 
-Pages support JavaScript client components (`componentFile`, `pagesDir`, `component`) as well as **custom HTML & external URL pages** (`url` or `iframeUrl` for external web apps, and `html` or `htmlFile` for local HTML files like EUIX Engine apps). By default (`layout: true`), custom page views are automatically wrapped in the Admin Layout with Breadcrumbs. Set `layout: false` for full-screen / custom canvas pages.
+Pages support JavaScript client components (`componentFile`, `pagesDir`, `component`), external URLs (`url` or `iframeUrl` inside `<iframe>`), as well as **native custom HTML pages** (`html` or `htmlFile` for local HTML files like EUIX Engine apps, Vue, or Alpine). HTML pages render directly in the page DOM with full Tailwind CSS styling, dark mode, and script execution without iframe overhead. Set `iframe: true` to isolate in an iframe if needed. By default (`layout: true`), custom page views are automatically wrapped in the Admin Layout with Breadcrumbs. Set `layout: false` for full-screen / custom canvas pages.
 
 **Example component file (`admin/reports.js`):**
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webspresso",
-  "version": "0.0.86",
+  "version": "0.0.87",
   "description": "Minimal, production-ready SSR framework for Node.js with file-based routing, Nunjucks templating, built-in i18n, and CLI tooling",
   "main": "index.js",
   "types": "index.d.ts",

package/plugins/admin-panel/core/admin-module.js

@@ -272,6 +272,7 @@ function registerPages(moduleId, pages, deps) {
       description: page.description,
       permission: page.permission,
       layout: page.layout !== undefined ? page.layout : true,
+      iframe: page.iframe,
       url: page.url || page.iframeUrl || undefined,
       html: htmlContent || undefined,
     });

package/plugins/admin-panel/core/registry.js

@@ -479,6 +479,7 @@ class AdminRegistry {
         description: p.description,
         permission: p.permission,
         layout: p.layout !== undefined ? p.layout : true,
+        iframe: p.iframe,
         url: p.url || p.iframeUrl,
         html: p.html,
         hasClientComponent: this.clientComponents.has(p.id),

package/plugins/admin-panel/modules/custom-pages.js

@@ -156,7 +156,7 @@ function generateCustomPageComponent() {
   return `
 // Custom Page Component Factory
 function createCustomPage(pageConfig) {
-  if (pageConfig && (pageConfig.url || pageConfig.html)) {
+  if (pageConfig && (pageConfig.url || (pageConfig.html && pageConfig.iframe))) {
     var iframeAttrs = {
       src: pageConfig.url || undefined,
       srcdoc: pageConfig.html || undefined,
@@ -187,6 +187,46 @@ function createCustomPage(pageConfig) {
     };
   }
 
+  if (pageConfig && pageConfig.html) {
+    var executeScripts = function(vnode) {
+      if (!vnode.dom) return;
+      var scripts = vnode.dom.querySelectorAll('script');
+      scripts.forEach(function(oldScript) {
+        if (oldScript.dataset && oldScript.dataset.executed) return;
+        var newScript = document.createElement('script');
+        Array.from(oldScript.attributes).forEach(function(attr) {
+          newScript.setAttribute(attr.name, attr.value);
+        });
+        newScript.dataset.executed = 'true';
+        newScript.appendChild(document.createTextNode(oldScript.innerHTML));
+        oldScript.parentNode.replaceChild(newScript, oldScript);
+      });
+    };
+    if (pageConfig.layout === false) {
+      return {
+        oncreate: executeScripts,
+        view: function() {
+          return m('div.custom-html-container', m.trust(pageConfig.html));
+        }
+      };
+    }
+    return {
+      oncreate: executeScripts,
+      view: function() {
+        return m(Layout, [
+          m(Breadcrumb, { items: [{ label: pageConfig.title, href: pageConfig.path }] }),
+          m('div.mb-4.flex.items-start.justify-between.gap-4', [
+            m('div', [
+              m('h1.text-2xl.font-bold.text-gray-900.dark:text-slate-100', pageConfig.title),
+              pageConfig.description && m('p.text-gray-500.dark:text-slate-400.mt-1', pageConfig.description)
+            ])
+          ]),
+          m('div.custom-html-container', m.trust(pageConfig.html))
+        ]);
+      }
+    };
+  }
+
   return {
     oninit(vnode) {
       vnode.state.data = null;