juxscript 1.0.129 → 1.0.131

package/index.js

@@ -16,7 +16,7 @@ export { List } from './lib/componentsv2/list/List.js';
 export { BaseEngine } from './lib/componentsv2/base/BaseEngine.js';
 export { BaseSkin } from './lib/componentsv2/base/BaseSkin.js';
 export { State } from './lib/componentsv2/base/State.js';
-export { GlobalBus } from './lib/componentsv2/base/Neighborhood.js';
+export { Neighborhood } from './lib/componentsv2/base/Neighborhood.js';
 
 // Utilities
 export { validateOptions } from './lib/componentsv2/base/OptionsContract.js';

package/lib/componentsv2/base/BaseSkin.d.ts

@@ -36,15 +36,14 @@ export declare abstract class BaseSkin<TState extends BaseState, TEngine extends
      *
      * Use this for internal signals like "loginSuccess", "error", or "animationStart".
      */
-    protected listenToMe(event: string, callback: (data: any) => void): void;
+    protected onSelf(event: string, callback: (data: any) => void): void;
     /**
      * Utility: Subscribe to the Global Bus (The Neighborhood).
      * "Neighbors" refers to other components or global system events.
      *
-     * ⚠️ USE SPARINGLY. Ideally, data flows down from the Engine via State.
      * Use this for purely visual coordination like "theme:switched" or "layout:collapse-all".
      */
-    protected listenToNeighbors(channel: string, callback: (data: any) => void): void;
+    protected onNeighbor(channel: string, callback: (data: any) => void): void;
     /**
      * Component Teardown.
      * Removes the root element and cleans up all event listeners.

package/lib/componentsv2/base/BaseSkin.js

@@ -40,7 +40,7 @@ export class BaseSkin {
      *
      * Use this for internal signals like "loginSuccess", "error", or "animationStart".
      */
-    listenToMe(event, callback) {
+    onSelf(event, callback) {
         this.engine.on(event, callback);
         this._cleanupTasks.push(() => this.engine.off(event, callback));
     }
@@ -48,10 +48,9 @@ export class BaseSkin {
      * Utility: Subscribe to the Global Bus (The Neighborhood).
      * "Neighbors" refers to other components or global system events.
      *
-     * ⚠️ USE SPARINGLY. Ideally, data flows down from the Engine via State.
      * Use this for purely visual coordination like "theme:switched" or "layout:collapse-all".
      */
-    listenToNeighbors(channel, callback) {
+    onNeighbor(channel, callback) {
         Neighborhood.on(channel, callback);
         this._cleanupTasks.push(() => Neighborhood.off(channel, callback));
     }

package/package.json

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

package/lib/componentsv2/base/GlobalBus.d.ts

@@ -1,22 +0,0 @@
-type GlobalListener = (data: any) => void;
-/**
- * THE NEIGHBORHOOD (Global Event Mediator)
- *
- * Acts as the certal nervous system where all components post updates.
- * Other components can tune in to specific frequencies (channels) here.
- */
-export declare class JuxGlobalBus {
-    private listeners;
-    on(channel: string, callback: GlobalListener): void;
-    off(channel: string, callback: GlobalListener): void;
-    emit(channel: string, data: any): void;
-    /**
-     * DEBUG: Read-only Snapshot of active channels and listener identities.
-     * usage: juxV2.events.registry
-     * Returns: { "channelName": ["functionName", "(anonymous)"] }
-     */
-    get registry(): Record<string, string[]>;
-}
-export declare const GlobalBus: JuxGlobalBus;
-export {};
-//# sourceMappingURL=GlobalBus.d.ts.map

package/lib/componentsv2/base/GlobalBus.js

@@ -1,56 +0,0 @@
-/**
- * THE NEIGHBORHOOD (Global Event Mediator)
- *
- * Acts as the certal nervous system where all components post updates.
- * Other components can tune in to specific frequencies (channels) here.
- */
-export class JuxGlobalBus {
-    constructor() {
-        this.listeners = new Map();
-    }
-    on(channel, callback) {
-        if (!this.listeners.has(channel)) {
-            this.listeners.set(channel, new Set());
-        }
-        this.listeners.get(channel).add(callback);
-    }
-    off(channel, callback) {
-        const set = this.listeners.get(channel);
-        if (set) {
-            set.delete(callback);
-            if (set.size === 0) {
-                this.listeners.delete(channel);
-            }
-        }
-    }
-    emit(channel, data) {
-        const set = this.listeners.get(channel);
-        if (set) {
-            set.forEach(callback => {
-                try {
-                    callback(data);
-                }
-                catch (e) {
-                    console.error(`Jux GlobalBus Error [${channel}]:`, e);
-                }
-            });
-        }
-        // Optional: We could have a wildcard '*' listener here for debuggers/loggers
-    }
-    /**
-     * DEBUG: Read-only Snapshot of active channels and listener identities.
-     * usage: juxV2.events.registry
-     * Returns: { "channelName": ["functionName", "(anonymous)"] }
-     */
-    get registry() {
-        const snapshot = {};
-        this.listeners.forEach((set, channel) => {
-            // Map the Set of functions to their names for easier debugging
-            snapshot[channel] = Array.from(set).map(fn => fn.name || '(anonymous)');
-        });
-        return snapshot;
-    }
-}
-// Singleton Instance
-export const GlobalBus = new JuxGlobalBus();
-//# sourceMappingURL=GlobalBus.js.map

package/lib/componentsv2/tools/CreateSkin.js

@@ -1,62 +0,0 @@
-import fs from 'fs';
-import path from 'path';
-import { fileURLToPath } from 'url';
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-const COMPONENTS_DIR = path.resolve(__dirname, '..');
-
-const componentName = process.argv[2];
-const skinName = process.argv[3];
-
-if (!componentName || !skinName) {
-    console.error('❌ Usage: npm run create-skin <component-name> <skin-name>');
-    console.error('   Example: npm run create-skin list dark-mode');
-    process.exit(1);
-}
-
-const targetDir = path.join(COMPONENTS_DIR, componentName, 'skins');
-
-if (!fs.existsSync(targetDir)) {
-    console.error(`❌ Component "${componentName}" does not exist or has no skins folder.`);
-    process.exit(1);
-}
-
-const fileName = `${skinName}.css`;
-const filePath = path.join(targetDir, fileName);
-
-const cssContent = `/**
- * 🎨 Skin: ${skinName}
- * Component: ${componentName}
- * 
- * Usage:
- * import theme from './skins/${fileName}';
- * component.skin.setTheme(theme);
- */
-
-/* Override Base Variables for this Skin */
-.jux-${componentName} {
-    --color-background: #000;
-    --color-text-primary: #fff;
-    --radius-sm: 0px; /* Square Look */
-}
-
-/* Component Specific Styles */
-.jux-${componentName} {
-    border: 2px solid var(--color-brand);
-    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
-}
-
-/* Interactive States */
-.jux-${componentName}:hover {
-    border-color: var(--color-brand-hover);
-}
-`;
-
-fs.writeFileSync(filePath, cssContent);
-
-console.log(`\n✨ New Skin Created:`);
-console.log(`   📂 ${filePath}`);
-console.log(`\nTo use this skin in your code:`);
-console.log(`   1. Import the CSS file (as string using a loader or inlining)`);
-console.log(`   2. Call component.skin.setTheme(myNewCssString)`);

package/lib/componentsv2/tools/DocSpam.js

@@ -1,134 +0,0 @@
-import fs from 'fs';
-import path from 'path';
-import { fileURLToPath } from 'url';
-
-// --- Configuration ---
-const EMOJI_REGEX = /\p{Extended_Pictographic}/u;
-const IGNORE_DIRS = ['node_modules', '.git', 'dist', '.jux-dist'];
-const EXTENSIONS = ['.ts', '.js', '.jux', '.md'];
-
-// --- Patterns ---
-// 1. Console Spam: console.log("✨...")
-const PATTERN_CONSOLE = /console\.(log|warn|error|info|group|groupCollapsed)\((['"`])(.*?)\2/g;
-
-// 2. Line Comments: // ✨ ...
-const PATTERN_LINE_COMMENT = /\/\/(.*)$/gm;
-
-// 3. Block Comments: /* ✨ ... */
-const PATTERN_BLOCK_COMMENT = /\/\*([\s\S]*?)\*\//gm;
-
-function scanFile(filePath) {
-    const content = fs.readFileSync(filePath, 'utf-8');
-    const ext = path.extname(filePath);
-    const findings = [];
-
-    // 1. Check Console Logs (JS/TS Files)
-    if (['.js', '.ts', '.jux'].includes(ext)) {
-        let match;
-        while ((match = PATTERN_CONSOLE.exec(content)) !== null) {
-            const logContent = match[3]; // The text inside quotes
-            if (EMOJI_REGEX.test(logContent)) {
-                findings.push({
-                    type: 'Console',
-                    line: getLineNumber(content, match.index),
-                    match: match[0].trim()
-                });
-            }
-        }
-    }
-
-    // 2. Check Line Comments
-    if (['.js', '.ts', '.jux'].includes(ext)) {
-        let match;
-        while ((match = PATTERN_LINE_COMMENT.exec(content)) !== null) {
-            const commentText = match[1];
-            if (EMOJI_REGEX.test(commentText)) {
-                findings.push({
-                    type: 'Line Comment',
-                    line: getLineNumber(content, match.index),
-                    match: match[0].trim()
-                });
-            }
-        }
-    }
-
-    // 3. Check Block Comments
-    if (['.js', '.ts', '.jux'].includes(ext)) {
-        let match;
-        while ((match = PATTERN_BLOCK_COMMENT.exec(content)) !== null) {
-            const commentText = match[1];
-            if (EMOJI_REGEX.test(commentText)) {
-                findings.push({
-                    type: 'Block Comment',
-                    line: getLineNumber(content, match.index),
-                    match: match[0].replace(/\n/g, ' ').substring(0, 50) + '...'
-                });
-            }
-        }
-    }
-
-    // 4. Markdown (Treat almost everything as "Content" but flag emojis)
-    if (ext === '.md') {
-        const lines = content.split('\n');
-        lines.forEach((line, i) => {
-            if (EMOJI_REGEX.test(line)) {
-                findings.push({
-                    type: 'Markdown Content',
-                    line: i + 1,
-                    match: line.trim().substring(0, 60)
-                });
-            }
-        });
-    }
-
-    return findings;
-}
-
-function getLineNumber(content, index) {
-    return content.substring(0, index).split('\n').length;
-}
-
-function walkDir(dir) {
-    const results = {};
-    const list = fs.readdirSync(dir);
-
-    list.forEach(file => {
-        if (IGNORE_DIRS.includes(file)) return;
-
-        const filePath = path.join(dir, file);
-        const stat = fs.statSync(filePath);
-
-        if (stat && stat.isDirectory()) {
-            Object.assign(results, walkDir(filePath));
-        } else {
-            if (EXTENSIONS.includes(path.extname(filePath))) {
-                const findings = scanFile(filePath);
-                if (findings.length > 0) {
-                    results[filePath] = findings;
-                }
-            }
-        }
-    });
-    return results;
-}
-
-// --- Main Execution ---
-const targetDir = process.argv[2] ? path.resolve(process.argv[2]) : process.cwd();
-
-console.log(`\n🔎  Scanning for Emoji Spam in: ${targetDir}\n`);
-const report = walkDir(targetDir);
-const fileCount = Object.keys(report).length;
-
-if (fileCount === 0) {
-    console.log("✅ No emoji spam found! Clean codebase.");
-} else {
-    Object.entries(report).forEach(([file, items]) => {
-        const relativePath = path.relative(process.cwd(), file);
-        console.log(`\n📄  \x1b[1m${relativePath}\x1b[0m`);
-        items.forEach(item => {
-            const typeColor = item.type === 'Console' ? '\x1b[31m' : '\x1b[33m'; // Red for console, Yellow for comments
-            console.log(`    L${item.line.toString().padEnd(4)} ${typeColor}[${item.type}]\x1b[0m  ${item.match}`);
-        });
-    });
-    console.log(`\n🚨 Found emoji usage in ${fileCount} files.`);
-}

package/lib/componentsv2/tools/FluencyAudit.js

@@ -1,141 +0,0 @@
-import fs from 'fs';
-import path from 'path';
-import ts from 'typescript';
-
-const TARGET_DIR = path.resolve('./lib/componentsv2');
-const ENGINE_SUFFIX = 'Engine.ts';
-
-// Methods to ignore (Lifecycle, Private, Getters)
-const IGNORE_LIST = [
-    'constructor', 'prepareState', 'subscribe', 'debug', 'dispose',
-    'on', 'off', 'listenTo', 'addPlugin', 'removePlugin',
-    'get eventRegistry', 'get stateHistory', 'get emitHistory'
-];
-
-/**
- * AST Traversal to analyze method behaviors
- */
-function analyzeMethod(node) {
-    let returnsThis = false;
-    let updatesState = false;
-    let emitsEvent = false;
-
-    // Recursive visitor to inspect code inside the method body
-    function visit(n) {
-        // Check 1: Return This ("return this;")
-        if (ts.isReturnStatement(n) && n.expression && n.expression.kind === ts.SyntaxKind.ThisKeyword) {
-            returnsThis = true;
-        }
-
-        // Check 2 & 3: Method Calls ("this.updateState(...)", "this.emit(...)")
-        if (ts.isCallExpression(n) && ts.isPropertyAccessExpression(n.expression)) {
-            const propAccess = n.expression;
-            // Ensure caller is 'this'
-            if (propAccess.expression.kind === ts.SyntaxKind.ThisKeyword) {
-                const methodName = propAccess.name.text;
-                if (methodName === 'updateState') updatesState = true;
-                if (methodName === 'emit') emitsEvent = true;
-            }
-        }
-
-        ts.forEachChild(n, visit);
-    }
-
-    if (node.body) {
-        visit(node.body);
-    }
-
-    return { returnsThis, updatesState, emitsEvent };
-}
-
-function gradeFile(filePath) {
-    const code = fs.readFileSync(filePath, 'utf-8');
-
-    // Create AST from TS Source
-    const sourceFile = ts.createSourceFile(
-        filePath,
-        code,
-        ts.ScriptTarget.Latest,
-        true
-    );
-
-    let score = 0;
-    let totalMutators = 0;
-    const report = [];
-
-    function visitNode(node) {
-        // Look for Classes
-        if (ts.isClassDeclaration(node)) {
-            node.members.forEach(member => {
-                // Look for Methods
-                if (ts.isMethodDeclaration(member)) {
-                    const name = member.name.getText(sourceFile);
-
-                    // Skip ignored, private (#), or static methods
-                    if (
-                        IGNORE_LIST.includes(name) ||
-                        name.startsWith('#') ||
-                        (ts.getCombinedModifierFlags(member) & ts.ModifierFlags.Static)
-                    ) {
-                        return;
-                    }
-
-                    // Analyze
-                    const analysis = analyzeMethod(member);
-
-                    // Logic: If it mutates state, it MUST emit and rely on the fluent chain.
-                    // We only grade methods that exhibit at least one of these traits to avoid grading helpers.
-                    if (analysis.updatesState || analysis.emitsEvent || analysis.returnsThis) {
-                        totalMutators++;
-
-                        const issues = [];
-                        if (!analysis.returnsThis) issues.push('❌ Return `this`');
-                        if (!analysis.updatesState) issues.push('⚠️ No State Update');
-                        if (!analysis.emitsEvent) issues.push('❌ No Emission');
-
-                        if (issues.length === 0) {
-                            score++;
-                        } else {
-                            report.push(`    METHOD: ${name}`);
-                            issues.forEach(i => report.push(`      ${i}`));
-                        }
-                    }
-                }
-            });
-        }
-        ts.forEachChild(node, visitNode);
-    }
-
-    visitNode(sourceFile);
-
-    return { total: totalMutators, passed: score, report };
-}
-
-function walk(dir) {
-    const files = fs.readdirSync(dir);
-    files.forEach(f => {
-        const full = path.join(dir, f);
-        if (fs.statSync(full).isDirectory()) {
-            walk(full);
-        } else if (full.endsWith(ENGINE_SUFFIX) && !full.endsWith('BaseEngine.ts')) {
-            const relative = path.relative(process.cwd(), full);
-            const { total, passed, report } = gradeFile(full);
-
-            if (total > 0) {
-                const percent = Math.round((passed / total) * 100);
-                const color = percent === 100 ? '\x1b[32m' : (percent > 80 ? '\x1b[33m' : '\x1b[31m');
-
-                console.log(`\n📄 ${relative}`);
-                console.log(`   Fluency Score: ${color}${percent}% (${passed}/${total})\x1b[0m`);
-                if (report.length > 0) {
-                    console.log(report.join('\n'));
-                }
-            }
-        }
-    });
-}
-
-console.log('\n🕵️  JUX FLUENCY AUDIT (AST Powered)');
-console.log('   Checking for: 1. return this, 2. updateState(), 3. emit()\n');
-walk(TARGET_DIR);
-console.log('\n');

package/lib/componentsv2/tools/OptionsAudit.js

@@ -1,177 +0,0 @@
-import fs from 'fs';
-import path from 'path';
-import ts from 'typescript';
-
-const TARGET_DIR = path.resolve('./lib/componentsv2');
-const ENGINE_SUFFIX = 'Engine.ts'; // Only scan engines
-
-// BaseState properties that EVERY engine must initialize
-const BASE_STATE_KEYS = ['id', 'classes', 'visible', 'disabled', 'loading', 'attributes'];
-
-function getInterfaceProperties(node, sourceFile) {
-    const props = [];
-    node.members.forEach(member => {
-        if (ts.isPropertySignature(member)) {
-            props.push(member.name.getText(sourceFile));
-        }
-    });
-    return props;
-}
-
-function analyzePrepareState(node, sourceFile, stateKeys, optionsKeys) {
-    const report = [];
-    let passed = true;
-
-    // 1. Capture Return Object Keys
-    let returnedKeys = [];
-    let foundReturn = false;
-
-    function visitReturn(n) {
-        // ✅ STOP recursion if entering a nested function (like .map(() => ...))
-        // We only care about the return statement of `prepareState` itself.
-        if (ts.isArrowFunction(n) || ts.isFunctionExpression(n) || ts.isFunctionDeclaration(n)) {
-            return;
-        }
-
-        if (ts.isReturnStatement(n)) {
-            foundReturn = true;
-            if (n.expression && ts.isObjectLiteralExpression(n.expression)) {
-                n.expression.properties.forEach(prop => {
-                    // Start Update: Handle both Assignment types
-                    if (ts.isPropertyAssignment(prop)) {
-                        returnedKeys.push(prop.name.getText(sourceFile));
-                    }
-                    // ✅ ADDED: Handle shorthand assignments (e.g. { id })
-                    else if (ts.isShorthandPropertyAssignment(prop)) {
-                        returnedKeys.push(prop.name.getText(sourceFile));
-                    }
-                    // End Update
-                });
-            }
-        }
-        ts.forEachChild(n, visitReturn);
-    }
-
-    // Start visiting from the function body
-    if (node.body) {
-        ts.forEachChild(node.body, visitReturn);
-    }
-
-    if (!foundReturn) {
-        return { passed: false, report: ['❌ prepareState does not return an object literal directly.'] };
-    }
-
-    // 2. Check State Coverage (Expected = BaseState + ComponentState)
-    const expectedKeys = new Set([...BASE_STATE_KEYS, ...stateKeys]);
-    const actualKeys = new Set(returnedKeys);
-
-    // Missing Keys
-    const missing = [...expectedKeys].filter(k => !actualKeys.has(k));
-    if (missing.length > 0) {
-        report.push(`❌ Missing Initialization for: ${missing.join(', ')}`);
-        passed = false;
-    }
-
-    // Extra Keys (Pollution / Typos)
-    const extra = [...actualKeys].filter(k => !expectedKeys.has(k));
-    if (extra.length > 0) {
-        report.push(`⚠️  Unknown properties in State: ${extra.join(', ')}`);
-    }
-
-    // 3. Check Options Usage
-    // We scan for `options.KEY` usage in the function body
-    const usedOptions = new Set();
-
-    function visitOptionsUsage(n) {
-        if (ts.isPropertyAccessExpression(n)) {
-            if (n.expression.getText(sourceFile) === 'options') {
-                usedOptions.add(n.name.getText(sourceFile));
-            }
-        }
-        ts.forEachChild(n, visitOptionsUsage);
-    }
-    if (node.body) {
-        visitOptionsUsage(node.body);
-    }
-
-    const unusedOptions = optionsKeys.filter(k => !usedOptions.has(k));
-    if (unusedOptions.length > 0) {
-        report.push(`⚠️  Unused Options: ${unusedOptions.join(', ')}`);
-    }
-
-    return { passed, report };
-}
-
-function auditFile(filePath) {
-    const code = fs.readFileSync(filePath, 'utf-8');
-    const sourceFile = ts.createSourceFile(filePath, code, ts.ScriptTarget.Latest, true);
-
-    let stateInterfaceProps = [];
-    let optionsInterfaceProps = [];
-    let prepareStateMethod = null;
-
-    function visit(node) {
-        // Find Interfaces
-        if (ts.isInterfaceDeclaration(node)) {
-            const name = node.name.text;
-            if (name.endsWith('State') && name !== 'BaseState') {
-                stateInterfaceProps = getInterfaceProperties(node, sourceFile);
-            } else if (name.endsWith('Options')) {
-                optionsInterfaceProps = getInterfaceProperties(node, sourceFile);
-            }
-        }
-
-        // Find Class & prepareState
-        if (ts.isClassDeclaration(node)) {
-            node.members.forEach(member => {
-                if (ts.isMethodDeclaration(member) && member.name.getText(sourceFile) === 'prepareState') {
-                    prepareStateMethod = member;
-                }
-            });
-        }
-        ts.forEachChild(node, visit);
-    }
-
-    visit(sourceFile);
-
-    // If no prepareState found, it might be abstract or a utility class; skip nicely
-    if (!prepareStateMethod) return null;
-
-    const result = analyzePrepareState(prepareStateMethod, sourceFile, stateInterfaceProps, optionsInterfaceProps);
-
-    return {
-        file: path.relative(process.cwd(), filePath),
-        ...result
-    };
-}
-
-function printResult(res) {
-    if (!res) return;
-    const color = res.passed ? '\x1b[32m' : '\x1b[31m'; // Green / Red
-
-    console.log(`📄 ${res.file}`);
-    if (res.passed && res.report.length === 0) {
-        console.log(`   ${color}100% Match\x1b[0m`);
-    } else {
-        res.report.forEach(msg => console.log(`   ${msg}`));
-        if (!res.passed) console.log(`   ${color}Validation Failed\x1b[0m`);
-    }
-    console.log('');
-}
-
-function walk(dir) {
-    const files = fs.readdirSync(dir);
-    files.forEach(f => {
-        const full = path.join(dir, f);
-        if (fs.statSync(full).isDirectory()) {
-            walk(full);
-        } else if (full.endsWith(ENGINE_SUFFIX) && !full.endsWith('BaseEngine.ts')) {
-            const res = auditFile(full);
-            printResult(res);
-        }
-    });
-}
-
-console.log(`\n📋 JUX OPTIONS AUDIT`);
-console.log(`   Verifying prepareState() maps all Options -> State correctly.\n`);
-walk(TARGET_DIR);

package/lib/componentsv2/tools/Scaffold.js

@@ -1,124 +0,0 @@
-import fs from 'fs';
-import path from 'path';
-import { execSync } from 'child_process';
-import { fileURLToPath } from 'url';
-import readline from 'readline';
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-const COMPONENTS_DIR = path.resolve(__dirname, '..');
-const STUBS_DIR = path.join(COMPONENTS_DIR, 'stubs');
-const INDEX_FILE = path.join(COMPONENTS_DIR, 'index.ts');
-const RESERVED = ['base', 'bases', 'plugin', 'plugins', 'tool', 'tools', 'stub', 'stubs', 'skin', 'skins', 'structure', 'structures', 'engine', 'engines', 'component', 'components'];
-
-const toPascalCase = (str) => str.replace(/(^\w|-\w)/g, (clear) => clear.replace('-', '').toUpperCase());
-const log = (msg, color = '\x1b[36m') => console.log(`${color}${msg}\x1b[0m`);
-const error = (msg) => { console.error(`\x1b[31m❌ ${msg}\x1b[0m`); process.exit(1); };
-
-const componentName = process.argv[2];
-
-if (!componentName) error('Usage: npm run scaffold -- <component-name>');
-if (!/^[a-z0-9-]+$/.test(componentName)) error('Name must be kebab-case (e.g. task-list)');
-if (RESERVED.includes(componentName)) error(`"${componentName}" is a reserved system name.`);
-
-const ComponentName = toPascalCase(componentName);
-const targetDir = path.join(COMPONENTS_DIR, componentName);
-
-if (fs.existsSync(targetDir)) error(`Directory already exists: ${targetDir}`);
-
-log(`🚀 Scaffolding Jux v2 Component: ${ComponentName} (${componentName})...`);
-
-const indexBackup = fs.readFileSync(INDEX_FILE, 'utf-8');
-
-(async function main() {
-    try {
-        // 1. Create Directory
-        fs.mkdirSync(targetDir);
-
-        // 2. Generate Files from Stubs
-        const stubs = {
-            'ComponentComposition.ts.stub': `component.ts`,
-            'ComponentEngine.ts.stub': `engine.ts`,
-            'ComponentSkin.ts.stub': `skin.ts`,
-            'ComponentStructure.css.stub': `structure.css`
-        };
-
-        Object.entries(stubs).forEach(([stub, file]) => {
-            let content = fs.readFileSync(path.join(STUBS_DIR, stub), 'utf-8');
-
-            content = content.replace(/\[%\s*ComponentName\s*%\]/g, ComponentName)
-                .replace(/\[%\s*component-name\s*%\]/g, componentName);
-
-            fs.writeFileSync(path.join(targetDir, file), content);
-            log(`   + Created ${file}`);
-        });
-
-        // 3. Update Index
-        log(`   ... Registering in ${path.basename(INDEX_FILE)}`);
-        let indexContent = indexBackup;
-
-        const importLine = `import { ${ComponentName} } from './${componentName}/component.js';`; // Updated import path
-        if (!indexContent.includes(importLine) && !indexContent.includes(`import { ${ComponentName} }`)) {
-            if (indexContent.includes(`// Export individually`)) {
-                indexContent = indexContent.replace(`// Export individually`, `${importLine}\n\n// Export individually`);
-            } else {
-                indexContent = `${importLine}\n${indexContent}`;
-            }
-        }
-
-        const exportRegex = /export\s*\{([^}]+)\};/;
-        if (exportRegex.test(indexContent)) {
-            indexContent = indexContent.replace(exportRegex, (match, content) => {
-                const parts = content.split(',').map(s => s.trim()).filter(Boolean);
-                const unique = new Set(parts);
-                unique.add(ComponentName);
-                return `export { ${Array.from(unique).join(', ')} };`;
-            });
-        } else {
-            indexContent += `\nexport { ${ComponentName} };`;
-        }
-
-        fs.writeFileSync(INDEX_FILE, indexContent);
-
-        console.log(`\n\x1b[33m⚠️  MANUAL ACTION REQUIRED:\x1b[0m`);
-        console.log(`   Please register \x1b[1m${ComponentName}\x1b[0m in the \x1b[1mjuxV2\x1b[0m namespace object.`);
-        console.log(`   File: \x1b[36m${INDEX_FILE}\x1b[0m`);
-        console.log(`   add: \x1b[32m${ComponentName},\x1b[0m\n`);
-
-
-        // 5. Verification
-        log(`\n🕵️  Verifying Integrity (Targeted TypeScript Check)...`);
-        try {
-            const filesToCheck = Object.values(stubs)
-                .filter(f => f.endsWith('.ts'))
-                .map(f => path.join(targetDir, f))
-                .join(' ');
-
-            execSync(`npx tsc --noEmit --target ES2022 --module NodeNext --moduleResolution NodeNext --esModuleInterop --skipLibCheck ${filesToCheck}`, { stdio: 'inherit' });
-
-            log(`\n✅ Verification Passed! Component Ready.`);
-        } catch (e) {
-            throw new Error("Type check failed on new component.");
-        }
-
-    } catch (e) {
-        console.error(`\n\x1b[31m❌ ERROR: ${e.message}\x1b[0m`);
-        // Rollback...
-        const rl = readline.createInterface({ input: process.stdin, output: process.stdout });
-        const answer = await new Promise(resolve => {
-            rl.question(`\n⚠️  An error occurred. Rollback changes (delete created files)? [y/n]: `, (ans) => {
-                resolve(ans.trim().toLowerCase());
-            });
-        });
-        rl.close();
-
-        if (answer === 'y' || answer === 'yes') {
-            log(`⏪ Rolling back changes...`, '\x1b[33m');
-            fs.writeFileSync(INDEX_FILE, indexBackup);
-            if (fs.existsSync(targetDir)) {
-                fs.rmSync(targetDir, { recursive: true, force: true });
-            }
-        }
-        process.exit(1);
-    }
-})();