juxscript 1.0.24 → 1.0.25

package/bin/cli.js

@@ -247,18 +247,17 @@ async function buildProject(isServe = false) {
       console.log('+ Created jux/index.jux');
     }
 
-    // Copy preset styles to jux/styles/
-    const presetsSrc = path.join(PATHS.packageRoot, 'presets');
+    // Copy preset styles from presets/styles/ to jux/styles/
+    const presetsStylesSrc = path.join(PATHS.packageRoot, 'presets', 'styles');
     const stylesDest = path.join(juxDir, 'styles');
 
-    if (fs.existsSync(presetsSrc)) {
+    if (fs.existsSync(presetsStylesSrc)) {
       fs.mkdirSync(stylesDest, { recursive: true });
 
-      const presetFiles = fs.readdirSync(presetsSrc);
-      presetFiles.forEach(file => {
-        // Only copy CSS files, skip hey.jux
+      const styleFiles = fs.readdirSync(presetsStylesSrc);
+      styleFiles.forEach(file => {
         if (file.endsWith('.css')) {
-          const srcFile = path.join(presetsSrc, file);
+          const srcFile = path.join(presetsStylesSrc, file);
           const destFile = path.join(stylesDest, file);
           fs.copyFileSync(srcFile, destFile);
           console.log(`+ Copied preset style: styles/${file}`);
@@ -312,17 +311,24 @@ node_modules/
     // ✅ Always serves router bundle
     await buildProject(true);
 
-    const port = parseInt(process.argv[3]) || 3000;
-    await start(port);
+    // Parse port arguments: npx jux serve [httpPort] [wsPort]
+    const httpPort = parseInt(process.argv[3]) || 3000;
+    const wsPort = parseInt(process.argv[4]) || 3001;
+
+    await start(httpPort, wsPort);
 
   } else {
     console.log(`
 JUX CLI - A JavaScript UX authorship platform
 
 Usage:
-  npx jux init          Initialize a new JUX project
-  npx jux build         Build router bundle to ./jux-dist/
-  npx jux serve [port]  Start dev server with hot reload (default: 3000)
+  npx jux init              Initialize a new JUX project
+  npx jux build             Build router bundle to ./jux-dist/
+  npx jux serve [http] [ws] Start dev server with hot reload
+
+Arguments:
+  [http]  HTTP server port (default: 3000)
+  [ws]    WebSocket port (default: 3001)
 
 Project Structure:
   my-project/
@@ -345,9 +351,10 @@ Getting Started:
   4. Serve jux-dist/ from your backend
 
 Examples:
-  npx jux build        Build production bundle
-  npx jux serve        Start dev server on port 3000
-  npx jux serve 8080   Start dev server on port 8080
+  npx jux build        # Build production bundle
+  npx jux serve        # Dev server (ports 3000/3001)
+  npx jux serve 8080   # HTTP on 8080, WS on 3001
+  npx jux serve 8080 8081  # HTTP on 8080, WS on 8081
     `);
   }
 })();

package/lib/components/docs-data.json

@@ -2059,5 +2059,5 @@
     }
   ],
   "version": "1.0.0",
-  "lastUpdated": "2026-01-28T04:47:53.565Z"
+  "lastUpdated": "2026-01-28T14:47:56.941Z"
 }

package/machinery/compiler.js

@@ -580,8 +580,23 @@ ${routeTable}
 const app = document.getElementById('app');
 
 function render() {
-  const path = location.pathname;
-  const view = routes[path] || JuxNotFound;
+  let path = location.pathname;
+  
+  // Try exact match first
+  let view = routes[path];
+  
+  // If no match and path ends with /, try appending 'index'
+  if (!view && path.endsWith('/')) {
+    view = routes[path + 'index'] || routes[path.slice(0, -1) + '/index'];
+  }
+  
+  // If still no match and path doesn't end with /, try appending '/index'
+  if (!view && !path.endsWith('/')) {
+    view = routes[path + '/index'];
+  }
+  
+  // Fall back to 404
+  view = view || JuxNotFound;
   
   app.innerHTML = '';
   app.removeAttribute('data-jux-page');

package/machinery/server.js

@@ -9,7 +9,45 @@ import { WebSocketServer } from 'ws';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
-async function serve(port = 3000, distDir = './jux-dist') {
+/**
+ * Try to start a server on a port, with fallback to next port if busy
+ * Returns the actual port that was successfully allocated
+ */
+async function tryPort(startPort, maxAttempts = 5, reservedPorts = []) {
+  for (let attempt = 0; attempt < maxAttempts; attempt++) {
+    const port = startPort + attempt;
+
+    // Skip if this port is already reserved
+    if (reservedPorts.includes(port)) {
+      continue;
+    }
+
+    try {
+      // Test if port is available
+      await new Promise((resolve, reject) => {
+        const testServer = http.createServer();
+        testServer.once('error', reject);
+        testServer.once('listening', () => {
+          testServer.close();
+          resolve(port);
+        });
+        testServer.listen(port);
+      });
+      return port;
+    } catch (err) {
+      if (err.code === 'EADDRINUSE') {
+        if (attempt < maxAttempts - 1) {
+          console.log(`   Port ${port} in use, trying ${port + 1}...`);
+        }
+        continue;
+      }
+      throw err;
+    }
+  }
+  throw new Error(`Could not find available port after ${maxAttempts} attempts starting from ${startPort}`);
+}
+
+async function serve(httpPort = 3000, wsPort = 3001, distDir = './jux-dist') {
   const app = express();
   const absoluteDistDir = path.resolve(distDir);
   const projectRoot = path.resolve('.');
@@ -22,50 +60,46 @@ async function serve(port = 3000, distDir = './jux-dist') {
     process.exit(1);
   }
 
-  // ✅ Strong cache prevention for main.js
+  // Strong cache prevention
   app.use((req, res, next) => {
     res.setHeader('Cache-Control', 'no-store, no-cache, must-revalidate, max-age=0');
     res.setHeader('Pragma', 'no-cache');
     res.setHeader('Expires', '0');
-
-    // ✅ Add ETag prevention
     res.setHeader('ETag', 'W/"' + Date.now() + '"');
-
     next();
   });
 
-  // Disable caching in dev mode
-  app.use((req, res, next) => {
-    res.setHeader('Cache-Control', 'no-store, no-cache, must-revalidate');
-    res.setHeader('Pragma', 'no-cache');
-    res.setHeader('Expires', '0');
-    next();
-  });
-
-  // Serve static files (CSS, JS, images, etc.)
+  // Serve static files
   app.use(express.static(absoluteDistDir));
 
-  // SPA fallback: only for requests that accept HTML (not static files)
+  // SPA fallback
   app.get('*', (req, res) => {
-    // If request accepts HTML, serve index.html
     if (req.accepts('html')) {
       const indexPath = path.join(absoluteDistDir, 'index.html');
       if (fs.existsSync(indexPath)) {
         res.sendFile(indexPath);
       } else {
-        res.status(404).send('index.html not found. Run `npx jux bundle` first.');
+        res.status(404).send('index.html not found. Run `npx jux build` first.');
       }
     } else {
-      // For non-HTML requests (like .js, .css), return 404
       res.status(404).send('Not found');
     }
   });
 
+  // Find available ports sequentially to avoid collision
+  console.log('🔍 Finding available ports...');
+
+  // First, find HTTP port
+  const availableHttpPort = await tryPort(httpPort);
+
+  // Then find WS port, excluding the HTTP port we just allocated
+  const availableWsPort = await tryPort(wsPort, 5, [availableHttpPort]);
+
   // Create HTTP server
   const server = http.createServer(app);
 
   // WebSocket server for hot reload
-  const wss = new WebSocketServer({ port: 3001 });
+  const wss = new WebSocketServer({ port: availableWsPort });
   const clients = [];
 
   wss.on('connection', (ws) => {
@@ -83,11 +117,11 @@ async function serve(port = 3000, distDir = './jux-dist') {
     });
   });
 
-  console.log('🔌 WebSocket server running at ws://localhost:3001');
+  console.log(`🔌 WebSocket server running at ws://localhost:${availableWsPort}`);
 
   // Start HTTP server
-  server.listen(port, () => {
-    console.log(`🚀 JUX dev server running at http://localhost:${port}`);
+  server.listen(availableHttpPort, () => {
+    console.log(`🚀 JUX dev server running at http://localhost:${availableHttpPort}`);
     console.log(`   Serving: ${absoluteDistDir}`);
     console.log(`   Press Ctrl+C to stop\n`);
   });
@@ -110,9 +144,9 @@ async function serve(port = 3000, distDir = './jux-dist') {
   process.on('SIGINT', shutdown);
   process.on('SIGTERM', shutdown);
 
-  return { server };
+  return { server, httpPort: availableHttpPort, wsPort: availableWsPort };
 }
 
-export async function start(port = 3000) {
-  return serve(port, './jux-dist');
+export async function start(httpPort = 3000, wsPort = 3001) {
+  return serve(httpPort, wsPort, './jux-dist');
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "juxscript",
-  "version": "1.0.24",
+  "version": "1.0.25",
   "type": "module",
   "description": "A JavaScript UX authorship platform",
   "main": "lib/jux.js",