@nuraly/lumenjs 0.1.4 → 0.2.0

package/dist/build/serve.js

@@ -22,6 +22,8 @@ import { createHealthCheckHandler } from '../shared/health.js';
 import { createRequestIdMiddleware } from '../shared/request-id.js';
 import { getRequestId } from '../shared/request-id.js';
 import { setupGracefulShutdown } from '../shared/graceful-shutdown.js';
+import { setupSocketIO } from '../shared/socket-io-setup.js';
+import crypto from 'crypto';
 export async function serveProject(options) {
     const { projectDir } = options;
     const port = options.port || 3000;
@@ -51,7 +53,9 @@ export async function serveProject(options) {
         logger.fatal('No index.html found in build output.');
         process.exit(1);
     }
-    const indexHtmlShell = fs.readFileSync(indexHtmlPath, 'utf-8');
+    let indexHtmlShell = fs.readFileSync(indexHtmlPath, 'utf-8');
+    // Substitute env var placeholders (e.g. __UMAMI_WEBSITE_ID__)
+    indexHtmlShell = indexHtmlShell.replace(/__([A-Z0-9_]+)__/g, (_, key) => process.env[key] || '');
     // Load bundled SSR runtime first — its install-global-dom-shim sets up
     // the proper HTMLElement/window/document shims that @lit-labs/ssr needs.
     // The lit-shared chunk handles missing HTMLElement via a fallback to its own shim,
@@ -195,14 +199,8 @@ export async function serveProject(options) {
                 if (res.writableEnded)
                     return;
             }
-            // -1. Auth routes (login, logout, me, signup, etc.)
-            if (authConfig && pathname.startsWith('/__nk_auth/')) {
-                const handled = await handleAuthRoutes(authConfig, req, res, authDb);
-                if (handled)
-                    return;
-            }
-            // 0. Run user middleware chain
-            if (middlewareModules.size > 0 && !pathname.includes('.') && !pathname.startsWith('/__nk_')) {
+            // 0. Run user middleware chain (runs before auth routes so middleware can gate signup etc.)
+            if (middlewareModules.size > 0 && !pathname.includes('.') && (!pathname.startsWith('/__nk_') || pathname.startsWith('/__nk_auth/'))) {
                 const matching = getMiddlewareDirsForPathname(pathname, middlewareEntries);
                 const allMw = [];
                 for (const entry of matching) {
@@ -221,12 +219,120 @@ export async function serveProject(options) {
                         return;
                 }
             }
-            // 1. API routes
+            // 1. Auth routes (login, logout, me, signup, etc. — runs after user middleware so invite gate can intercept)
+            if (authConfig && pathname.startsWith('/__nk_auth/')) {
+                const handled = await handleAuthRoutes(authConfig, req, res, authDb);
+                if (handled)
+                    return;
+            }
+            // 2. API routes
             if (pathname.startsWith('/api/')) {
                 await handleApiRoute(manifest, serverDir, pathname, queryString, method, req, res);
                 return;
             }
-            // 2. Static assets — try to serve from client dir
+            // 2b. Communication file upload
+            if (pathname === '/__nk_comm/upload' && method === 'POST') {
+                const userId = req.nkAuth?.user?.sub;
+                if (!userId) {
+                    res.statusCode = 401;
+                    res.end(JSON.stringify({ error: 'Unauthorized' }));
+                    return;
+                }
+                const MAX_UPLOAD_SIZE = 10 * 1024 * 1024;
+                const chunks = [];
+                let uploadSize = 0;
+                let aborted = false;
+                req.on('data', (c) => {
+                    uploadSize += c.length;
+                    if (uploadSize > MAX_UPLOAD_SIZE) {
+                        aborted = true;
+                        req.destroy();
+                        res.statusCode = 413;
+                        res.end(JSON.stringify({ error: 'File too large' }));
+                        return;
+                    }
+                    chunks.push(c);
+                });
+                req.on('end', async () => {
+                    if (aborted)
+                        return;
+                    try {
+                        const body = Buffer.concat(chunks);
+                        const id = crypto.randomUUID();
+                        const fileName = req.headers['x-filename'] || `file-${id}`;
+                        const mimeType = req.headers['content-type'] || 'application/octet-stream';
+                        const ext = fileName.includes('.') ? `.${fileName.split('.').pop()}` : '';
+                        const key = `chat-uploads/${id}${ext}`;
+                        // Use R2/S3 if configured, otherwise fall back to local disk
+                        if (process.env.R2_BUCKET && process.env.R2_ENDPOINT) {
+                            const { S3StorageAdapter } = await import('../storage/adapters/s3.js');
+                            const s3 = new S3StorageAdapter({
+                                bucket: process.env.R2_BUCKET,
+                                region: 'auto',
+                                accessKeyId: process.env.LUMENJS_S3_ACCESS_KEY || '',
+                                secretAccessKey: process.env.LUMENJS_S3_SECRET_KEY || '',
+                                endpoint: process.env.R2_ENDPOINT,
+                                publicBaseUrl: process.env.R2_PUBLIC_URL,
+                            });
+                            const stored = await s3.put(body, { key, mimeType, fileName });
+                            res.statusCode = 201;
+                            res.setHeader('Content-Type', 'application/json');
+                            res.end(JSON.stringify({ id, url: stored.url, size: body.length }));
+                        }
+                        else {
+                            // Local fallback
+                            const uploadDir = path.join(projectDir, 'data', 'uploads');
+                            if (!fs.existsSync(uploadDir))
+                                fs.mkdirSync(uploadDir, { recursive: true });
+                            fs.writeFileSync(path.join(uploadDir, `${id}.bin`), body);
+                            fs.writeFileSync(path.join(uploadDir, `${id}.meta.json`), JSON.stringify({ id, filename: fileName, mimetype: mimeType, size: body.length }));
+                            res.statusCode = 201;
+                            res.setHeader('Content-Type', 'application/json');
+                            res.end(JSON.stringify({ id, url: `/__nk_comm/files/${id}`, size: body.length }));
+                        }
+                    }
+                    catch (err) {
+                        logger.error('Upload failed', { error: err?.message });
+                        res.statusCode = 500;
+                        res.end(JSON.stringify({ error: 'Upload failed' }));
+                    }
+                });
+                return;
+            }
+            // Serve locally stored files (fallback when R2 is not configured)
+            if (pathname.startsWith('/__nk_comm/files/') && method === 'GET') {
+                const fileId = pathname.slice('/__nk_comm/files/'.length);
+                if (!/^[a-zA-Z0-9._-]+$/.test(fileId)) {
+                    res.statusCode = 400;
+                    res.end('Invalid file ID');
+                    return;
+                }
+                const uploadDir = path.join(projectDir, 'data', 'uploads');
+                const filePath = path.resolve(uploadDir, `${fileId}.bin`);
+                if (!filePath.startsWith(path.resolve(uploadDir))) {
+                    res.statusCode = 400;
+                    res.end('Invalid file ID');
+                    return;
+                }
+                if (!fs.existsSync(filePath)) {
+                    res.statusCode = 404;
+                    res.end('File not found');
+                    return;
+                }
+                let contentType = 'application/octet-stream';
+                try {
+                    const meta = JSON.parse(fs.readFileSync(path.resolve(uploadDir, `${fileId}.meta.json`), 'utf-8'));
+                    contentType = meta.mimetype || contentType;
+                }
+                catch { }
+                const stat = fs.statSync(filePath);
+                res.setHeader('Content-Type', contentType);
+                res.setHeader('Content-Length', stat.size);
+                res.setHeader('Cache-Control', 'public, max-age=31536000, immutable');
+                fs.createReadStream(filePath).pipe(res);
+                return;
+            }
+            // 3. Static assets — try to serve from client dir
             if (pathname.includes('.')) {
                 const served = serveStaticFile(clientDir, pathname, req, res);
                 if (served)
@@ -298,6 +404,20 @@ export async function serveProject(options) {
             logger.request(req, res.statusCode, duration, { requestId: getRequestId(req) });
         }
     });
+    // Socket.IO setup (attach before listen so it shares the HTTP server)
+    const socketRoutes = manifest.routes
+        .filter(r => r.hasSocket && r.module)
+        .map(r => ({ path: r.path, hasSocket: true, filePath: path.join(serverDir, r.module) }));
+    if (socketRoutes.length > 0) {
+        setupSocketIO({
+            httpServer: server,
+            loadModule: (fp) => import(fp),
+            routes: socketRoutes,
+            projectDir,
+        }).catch((err) => {
+            logger.warn('Socket.IO setup failed', { error: err?.message });
+        });
+    }
     // Graceful shutdown
     setupGracefulShutdown(server, {
         onShutdown: async () => {

package/dist/dev-server/config.js

@@ -12,6 +12,7 @@ export function readProjectConfig(projectDir) {
     let prefetch = 'viewport';
     let prerender;
     let i18n;
+    let securityHeaders;
     const configPath = path.join(projectDir, 'lumenjs.config.ts');
     if (fs.existsSync(configPath)) {
         try {
@@ -38,6 +39,22 @@ export function readProjectConfig(projectDir) {
             if (prerenderMatch) {
                 prerender = prerenderMatch[1] === 'true';
             }
+            const secHeadersMatch = configContent.match(/securityHeaders\s*:\s*\{([\s\S]*?)\}/);
+            if (secHeadersMatch) {
+                const block = secHeadersMatch[1];
+                const cspMatch = block.match(/contentSecurityPolicy\s*:\s*"([^"]+)"/)
+                    || block.match(/contentSecurityPolicy\s*:\s*'([^']+)'/)
+                    || block.match(/contentSecurityPolicy\s*:\s*`([^`]+)`/);
+                const ppMatch = block.match(/permissionsPolicy\s*:\s*'([^']+)'/)
+                    || block.match(/permissionsPolicy\s*:\s*"([^"]+)"/)
+                    || block.match(/permissionsPolicy\s*:\s*`([^`]+)`/);
+                if (cspMatch || ppMatch) {
+                    securityHeaders = {
+                        ...(cspMatch ? { contentSecurityPolicy: cspMatch[1] } : {}),
+                        ...(ppMatch ? { permissionsPolicy: ppMatch[1] } : {}),
+                    };
+                }
+            }
             const i18nMatch = configContent.match(/i18n\s*:\s*\{([\s\S]*?)\}/);
             if (i18nMatch) {
                 const block = i18nMatch[1];
@@ -69,7 +86,7 @@ export function readProjectConfig(projectDir) {
         }
         catch { /* ignore */ }
     }
-    return { title, integrations, prefetch, version, ...(i18n ? { i18n } : {}), ...(prerender ? { prerender } : {}) };
+    return { title, integrations, prefetch, version, ...(i18n ? { i18n } : {}), ...(prerender ? { prerender } : {}), ...(securityHeaders ? { securityHeaders } : {}) };
 }
 /**
  * Reads the project title from lumenjs.config.ts (or returns default).

package/dist/dev-server/index-html.d.ts

@@ -18,6 +18,7 @@ export interface IndexHtmlOptions {
     prefetch?: string;
     authUser?: any;
     headContent?: string;
+    base?: string;
 }
 /**
  * Generates the index.html shell that loads the LumenJS app.

package/dist/dev-server/index-html.js

@@ -4,6 +4,9 @@ import { escapeHtml } from '../shared/utils.js';
  * Includes the router, app shell, and optionally the editor bridge.
  */
 export function generateIndexHtml(options) {
+    // Note: script src uses /@lumenjs/ (no base prefix) because Vite's
+    // transformIndexHtml already prepends config.base to absolute URLs.
+    // Including base here would double it when base != '/'.
     const editorScript = options.editorMode
         ? `<script type="module" src="/@lumenjs/editor-bridge"></script>`
         : '';
@@ -50,7 +53,7 @@ export function generateIndexHtml(options) {
   <meta name="viewport" content="width=device-width, initial-scale=1.0, interactive-widget=resizes-content" />
   <title>${escapeHtml(options.title)}</title>
   <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-  ${options.integrations?.includes('nuralyui') ? '<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@nuraly/lumenui@latest/packages/themes/dist/default.css">' : ''}${options.integrations?.includes('tailwind') ? '\n  <script type="module">import "/styles/tailwind.css";</script>' : ''}
+  ${options.integrations?.includes('tailwind') ? '<script type="module">import "/styles/tailwind.css";</script>' : ''}
   ${options.headContent || ''}
   <style>
     *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

package/dist/dev-server/plugins/vite-plugin-routes.js

@@ -1,6 +1,6 @@
 import fs from 'fs';
 import path from 'path';
-import { dirToLayoutTagName, fileHasLoader, fileHasSubscribe, fileHasAuth, fileHasMeta, fileHasStandalone, filePathToRoute, filePathToTagName } from '../../shared/utils.js';
+import { dirToLayoutTagName, fileHasLoader, fileHasSubscribe, fileHasSocket, fileHasAuth, fileHasMeta, fileHasStandalone, filePathToRoute, filePathToTagName } from '../../shared/utils.js';
 const VIRTUAL_MODULE_ID = 'virtual:lumenjs-routes';
 const RESOLVED_VIRTUAL_MODULE_ID = '\0' + VIRTUAL_MODULE_ID;
 /**
@@ -105,6 +105,7 @@ export function lumenRoutesPlugin(pagesDir) {
                     .map(r => {
                     const hasLoader = fileHasLoader(r.componentPath);
                     const hasSubscribe = fileHasSubscribe(r.componentPath);
+                    const hasSocketFlag = fileHasSocket(r.componentPath);
                     const hasAuth = fileHasAuth(r.componentPath);
                     const hasMeta = fileHasMeta(r.componentPath);
                     const isStandalone = fileHasStandalone(r.componentPath);
@@ -121,7 +122,7 @@ export function lumenRoutesPlugin(pagesDir) {
                         });
                         layoutsStr = `, layouts: [${items.join(', ')}]`;
                     }
-                    return `  { path: ${JSON.stringify(r.path)}, tagName: ${JSON.stringify(r.tagName)}${hasLoader ? ', hasLoader: true' : ''}${hasSubscribe ? ', hasSubscribe: true' : ''}${hasMeta ? ', hasMeta: true' : ''}${hasAuth ? ', __nk_has_auth: true' : ''}, load: () => import('${componentPath}')${layoutsStr} }`;
+                    return `  { path: ${JSON.stringify(r.path)}, tagName: ${JSON.stringify(r.tagName)}${hasLoader ? ', hasLoader: true' : ''}${hasSubscribe ? ', hasSubscribe: true' : ''}${hasSocketFlag ? ', hasSocket: true' : ''}${hasMeta ? ', hasMeta: true' : ''}${hasAuth ? ', __nk_has_auth: true' : ''}, load: () => import('${componentPath}')${layoutsStr} }`;
                 })
                     .join(',\n');
                 return `export const routes = [\n${routeArray}\n];\n`;

package/dist/dev-server/plugins/vite-plugin-virtual-modules.js

@@ -19,6 +19,7 @@ export function virtualModulesPlugin(runtimeDir, editorDir) {
         'communication': 'communication.js',
         'webrtc': 'webrtc.js',
         'error-boundary': 'error-boundary.js',
+        'island': 'island.js',
         'hydrate-support': '__virtual__',
     };
     // Modules resolved via resolve.alias instead of virtual module.
@@ -36,17 +37,27 @@ export function virtualModulesPlugin(runtimeDir, editorDir) {
         'standalone-overlay-styles': 'standalone-overlay-styles.js',
         'standalone-file-panel': 'standalone-file-panel.js',
         'overlay-utils': 'overlay-utils.js',
+        'overlay-events': 'overlay-events.js',
+        'overlay-hmr': 'overlay-hmr.js',
+        'overlay-selection': 'overlay-selection.js',
         'text-toolbar': 'text-toolbar.js',
+        'toolbar-styles': 'toolbar-styles.js',
         'editor-toolbar': 'editor-toolbar.js',
         'css-rules': 'css-rules.js',
         'ast-modification': 'ast-modification.js',
         'ast-service': 'ast-service.js',
         'file-service': 'file-service.js',
+        'file-editor': 'file-editor.js',
+        'syntax-highlighter': 'syntax-highlighter.js',
         'property-registry': 'property-registry.js',
         'properties-panel': 'properties-panel.js',
+        'properties-panel-persist': 'properties-panel-persist.js',
+        'properties-panel-rows': 'properties-panel-rows.js',
+        'properties-panel-styles': 'properties-panel-styles.js',
         'i18n-key-gen': 'i18n-key-gen.js',
         'ai-chat-panel': 'ai-chat-panel.js',
         'ai-project-panel': 'ai-project-panel.js',
+        'ai-markdown': 'ai-markdown.js',
     };
     function rewriteRelativeImports(code, modules) {
         for (const name of Object.keys(modules)) {
@@ -54,14 +65,26 @@ export function virtualModulesPlugin(runtimeDir, editorDir) {
             // Aliased modules use @lumenjs/name (resolved by Vite alias).
             // Virtual modules use /@lumenjs/name (resolved by this plugin).
             const prefix = aliasedModules.has(name) ? '@lumenjs' : '/@lumenjs';
-            code = code.replace(new RegExp(`from\\s+['"]\\.\\/${file.replace('.', '\\.')}['"]`, 'g'), `from '${prefix}/${name}'`);
+            const escaped = file.replace('.', '\\.');
+            // Rewrite `from './file.js'`
+            code = code.replace(new RegExp(`from\\s+['"]\\.\\/${escaped}['"]`, 'g'), `from '${prefix}/${name}'`);
+            // Rewrite side-effect `import './file.js'`
+            code = code.replace(new RegExp(`import\\s+['"]\\.\\/${escaped}['"]`, 'g'), `import '${prefix}/${name}'`);
         }
         return code;
     }
+    let viteBase = '/';
     return {
         name: 'lumenjs-virtual-modules',
         enforce: 'pre',
+        configResolved(config) {
+            viteBase = config.base || '/';
+        },
         resolveId(id) {
+            // Strip Vite base prefix if present (e.g. /__app_dev/{id}/@lumenjs/foo → /@lumenjs/foo)
+            if (viteBase !== '/' && id.startsWith(viteBase)) {
+                id = '/' + id.slice(viteBase.length);
+            }
             const match = id.match(/^\/@lumenjs\/(.+)$/);
             if (!match)
                 return;
@@ -143,13 +166,18 @@ globalThis.litElementHydrateSupport = ({LitElement}) => {
       try {
         hydrate(value, this.renderRoot, this.renderOptions);
       } catch (err) {
-        // Digest mismatch — clear SSR content and render fresh (CSR fallback)
-        console.warn('[LumenJS] Hydration failed for <' + this.localName + '>, falling back to CSR:', err.message);
+        // Digest mismatch — re-render fresh but avoid visible flash
+        console.warn('[LumenJS] Hydration mismatch for <' + this.localName + '>, falling back to CSR');
         const root = this.renderRoot;
-        while (root.firstChild) root.removeChild(root.firstChild);
-        delete root._$litPart$;
-        // Re-adopt styles since clearing removed SSR <style> tags
+        // Preserve adopted styles so content is never unstyled
         adoptElementStyles(this);
+        // Remove only non-style children to keep styles applied during re-render
+        const toRemove = [];
+        for (let c = root.firstChild; c; c = c.nextSibling) {
+          if (c.nodeName !== 'STYLE') toRemove.push(c);
+        }
+        toRemove.forEach(c => root.removeChild(c));
+        delete root._$litPart$;
         render(value, root, this.renderOptions);
       }
     } else {