juxscript 1.1.137 → 1.1.139

package/dom-structure-map.json

@@ -1,6 +1,6 @@
 {
   "totalComponents": 69,
-  "generatedAt": "2026-02-13T17:29:37.469Z",
+  "generatedAt": "2026-02-13T18:01:49.517Z",
   "components": [
     {
       "file": "alert.js",

package/machinery/compiler3.js

@@ -18,6 +18,7 @@ export class JuxCompiler {
         this.paths = config.paths || {};
         this._juxscriptExports = null;
         this._juxscriptPath = null;
+        this._renderFunctionCounter = 0; // ✅ Add counter for unique IDs
     }
 
     /**
@@ -245,48 +246,46 @@ export class JuxCompiler {
 
         entry += `\n// --- VIEW FUNCTIONS ---\n`;
 
+        // ✅ Map to store route → function name mappings
+        const routeToFunctionMap = new Map();
+
         views.forEach(v => {
-            // ✅ Sanitize the name for use in function names
-            // Replace slashes, dots, and other invalid characters with underscores
-            const sanitizedName = v.name
-                .replace(/[\/\\.\\-\s]/g, '_')     // Replace /, \, ., -, spaces with _
-                .replace(/[^a-zA-Z0-9_]/g, '_')    // Replace any other invalid chars with _
-                .replace(/_+/g, '_')               // Collapse multiple consecutive underscores
-                .replace(/^_|_$/g, '');            // Remove leading/trailing underscores
-
-            const capitalized = sanitizedName.charAt(0).toUpperCase() + sanitizedName.slice(1);
-
-            // ✅ Check for duplicate function names and warn
-            const functionName = `render${capitalized}`;
-            if (sourceSnapshot[functionName]) {
-                console.error(`❌ DUPLICATE FUNCTION NAME: ${functionName}`);
-                console.error(`   Conflict between:`);
-                console.error(`     1. ${sourceSnapshot[functionName].file}`);
-                console.error(`     2. ${v.file}`);
-                console.error(`   This will cause a build error. Rename one of these files.`);
-                throw new Error(`Duplicate function name: ${functionName}`);
-            }
+            // ✅ Generate TRULY UNIQUE serial ID
+            const serialId = this._renderFunctionCounter++;
+            const functionName = `renderJux${serialId}`;
 
             sourceSnapshot[v.file] = {
                 name: v.name,
                 file: v.file,
                 content: v.content,
-                lines: v.content.split('\n')
-            };
-
-            // ✅ Also track by function name to catch duplicates
-            sourceSnapshot[functionName] = {
-                name: v.name,
-                file: v.file,
-                content: v.content,
-                lines: v.content.split('\n')
+                lines: v.content.split('\n'),
+                functionName // ✅ Store the unique function name
             };
 
             let viewCode = this.removeImports(v.content).replace(/^\s*export\s+default\s+.*$/gm, '');
             const asyncPrefix = viewCode.includes('await ') ? 'async ' : '';
 
-            // Use sanitized name in function declaration
+            // ✅ Use truly unique serial function name
             entry += `\n${asyncPrefix}function ${functionName}() {\n${viewCode}\n}\n`;
+
+            // ✅ Generate URL-safe route path from original name
+            const routePath = v.name
+                .toLowerCase()
+                .replace(/\\/g, '/')
+                .replace(/\.jux$/i, '')
+                .replace(/\./g, '-')
+                .replace(/\s+/g, '-')
+                .replace(/[^a-z0-9\/_-]/g, '')
+                .replace(/-+/g, '-')
+                .replace(/^-|-$/g, '');
+
+            // ✅ Handle index route
+            if (routePath === 'index' || routePath === '') {
+                routeToFunctionMap.set('/', functionName);
+            }
+
+            // ✅ Map route to function
+            routeToFunctionMap.set(`/${routePath}`, functionName);
         });
 
         dataModules.forEach(m => {
@@ -298,7 +297,9 @@ export class JuxCompiler {
 
         this._sourceSnapshot = sourceSnapshot;
         this._validationIssues = allIssues;
-        entry += this._generateRouter(views);
+
+        // ✅ Pass the route map to router generator
+        entry += this._generateRouter(routeToFunctionMap);
         return entry;
     }
 
@@ -319,39 +320,11 @@ export class JuxCompiler {
         return { isValid: errors.length === 0, errors, warnings };
     }
 
-    _generateRouter(views) {
+    _generateRouter(routeToFunctionMap) {
+        // ✅ Build route map from Map object
         let routeMap = '';
-        views.forEach(v => {
-            // ✅ Sanitize function name (same as above)
-            const sanitizedName = v.name
-                .replace(/[\/\\.\\-\s]/g, '_')
-                .replace(/[^a-zA-Z0-9_]/g, '_')
-                .replace(/_+/g, '_')
-                .replace(/^_|_$/g, '');
-
-            const cap = sanitizedName.charAt(0).toUpperCase() + sanitizedName.slice(1);
-
-            // ✅ Generate URL-safe route path from original name
-            // Convert: 'menus/main' → '/menus/main'
-            // Convert: 'about-us' → '/about-us'
-            // Convert: 'blog.post' → '/blog-post' (dots become dashes for URLs)
-            const routePath = v.name
-                .toLowerCase()
-                .replace(/\\/g, '/')          // Normalize backslashes to forward slashes
-                .replace(/\.jux$/i, '')       // Remove .jux extension if present
-                .replace(/\./g, '-')          // Convert dots to dashes (blog.post → blog-post)
-                .replace(/\s+/g, '-')         // Convert spaces to dashes
-                .replace(/[^a-z0-9\/_-]/g, '') // Remove any other unsafe URL chars
-                .replace(/-+/g, '-')          // Collapse multiple dashes
-                .replace(/^-|-$/g, '');       // Remove leading/trailing dashes
-
-            // ✅ Handle index route
-            if (routePath === 'index' || routePath === '') {
-                routeMap += `  '/': render${cap},\n`;
-            }
-
-            // ✅ Add regular route
-            routeMap += `  '/${routePath}': render${cap},\n`;
+        routeToFunctionMap.forEach((functionName, route) => {
+            routeMap += `  '${route}': ${functionName},\n`;
         });
 
         return `
@@ -369,12 +342,12 @@ async function __juxLoadSources() {
 }
 
 function __juxFindSource(stack) {
-    var match = stack.match(/render(\\w+)/);
+    var match = stack.match(/renderJux(\\d+)/);
     if (match) {
-        var viewName = match[1].toLowerCase();
+        var functionName = 'renderJux' + match[1];
         for (var file in __juxSources || {}) {
-            if (__juxSources[file].name.toLowerCase() === viewName) {
-                return { file: file, source: __juxSources[file], viewName: match[1] };
+            if (__juxSources[file].functionName === functionName) {
+                return { file: file, source: __juxSources[file], functionName: functionName };
             }
         }
     }
@@ -537,12 +510,11 @@ document.addEventListener('click', (e) => {
         const juxDistDir = path.join(this.distDir, 'jux');
         fs.mkdirSync(juxDistDir, { recursive: true });
 
-        // ✅ FIX: Create subdirectories and copy files
+        // ✅ Create subdirectories and copy files
         [...dataModules, ...sharedModules].forEach(m => {
             const destPath = path.join(juxDistDir, m.file);
             const destDir = path.dirname(destPath);
 
-            // Create subdirectory if it doesn't exist
             if (!fs.existsSync(destDir)) {
                 fs.mkdirSync(destDir, { recursive: true });
             }
@@ -574,15 +546,57 @@ document.addEventListener('click', (e) => {
                 platform: 'browser',
                 target: 'esnext',
                 sourcemap: true,
-                loader: { '.jux': 'js', '.css': 'empty' },
+
+                // ✅ FIX: Remove external packages restriction - bundle EVERYTHING
+                // This allows axios, lodash, date-fns, etc. to be bundled
+                // Remove the packages: 'external' or external: [...] config
+
+                loader: {
+                    '.jux': 'js',
+                    '.css': 'empty'
+                },
+
                 plugins: [{
                     name: 'juxscript-resolver',
                     setup: (build) => {
-                        build.onResolve({ filter: /^juxscript$/ }, () => ({ path: juxscriptPath }));
+                        // Only resolve juxscript - everything else gets bundled normally
+                        build.onResolve({ filter: /^juxscript$/ }, () => ({
+                            path: juxscriptPath
+                        }));
                     }
                 }],
+
+                // ✅ NEW: Minify and tree-shake in production
+                minify: process.env.NODE_ENV === 'production',
+                treeShaking: true,
+
+                // ✅ NEW: Handle node built-ins (like 'http', 'fs') that axios might use
+                // These should NOT be bundled (they don't work in browser)
+                external: [
+                    'fs',
+                    'path',
+                    'http',
+                    'https',
+                    'stream',
+                    'zlib',
+                    'crypto'
+                ],
+
+                // ✅ NEW: Define globals for node built-ins
+                define: {
+                    'process.env.NODE_ENV': '"production"',
+                    'global': 'window'
+                }
             });
+
             console.log('✅ esbuild complete');
+
+            // ✅ Show bundle size
+            const bundlePath = path.join(this.distDir, 'bundle.js');
+            const bundleStats = fs.statSync(bundlePath);
+            const bundleSizeKB = (bundleStats.size / 1024).toFixed(2);
+            console.log(`📦 Bundle size: ${bundleSizeKB} KB`);
+
         } catch (err) {
             console.error('❌ esbuild failed:', err);
             return { success: false, errors: [{ message: err.message }], warnings: [] };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "juxscript",
-  "version": "1.1.137",
+  "version": "1.1.139",
   "type": "module",
   "description": "A JavaScript UX authorship platform",
   "main": "index.js",