jac-client 0.2.8__py3-none-any.whl → 0.2.9__py3-none-any.whl

jac_client/plugin/utils/impl/node_installer.impl.jac

@@ -0,0 +1,249 @@
+"""Implementation of Node.js installer methods."""
+
+"""Check if Node.js is installed and accessible."""
+impl NodeInstaller.is_node_installed -> bool {
+    try {
+        result = subprocess.run(
+            ['node', '--version'], capture_output=True, text=True, timeout=5
+        );
+        return result.returncode == 0;
+    } except (FileNotFoundError, subprocess.TimeoutExpired) {
+        return False;
+    }
+}
+
+"""Check if npm is installed and accessible."""
+impl NodeInstaller.is_npm_installed -> bool {
+    try {
+        result = subprocess.run(
+            ['npm', '--version'], capture_output=True, text=True, timeout=5
+        );
+        return result.returncode == 0;
+    } except (FileNotFoundError, subprocess.TimeoutExpired) {
+        return False;
+    }
+}
+
+"""Check if NVM is installed."""
+impl NodeInstaller.is_nvm_installed -> bool {
+    nvm_dir = Path.home() / '.nvm';
+    return nvm_dir.exists() and (nvm_dir / 'nvm.sh').exists();
+}
+
+"""Get the currently installed Node.js version."""
+impl NodeInstaller.get_node_version -> (str | None) {
+    try {
+        result = subprocess.run(
+            ['node', '--version'], capture_output=True, text=True, timeout=5
+        );
+        if result.returncode == 0 {
+            return result.stdout.strip();
+        }
+    } except (FileNotFoundError, subprocess.TimeoutExpired) { }
+    return None;
+}
+
+"""Install NVM (Node Version Manager)."""
+impl NodeInstaller.install_nvm -> tuple[bool, str] {
+    system = platform.system();
+    if system == 'Windows' {
+        return (
+            False,
+            'Windows detected. Please install Node.js manually:\n' + '  1. Download from: https://nodejs.org/\n' + '  2. Or use nvm-windows: https://github.com/coreybutler/nvm-windows\n' + '  After installation, run "jac add --cl" again.'
+        );
+    }
+    print('Installing NVM (Node Version Manager)...');
+    try {
+        # Download and run NVM installation script
+        install_script = subprocess.run(
+            ['curl', '-o-', NodeInstaller.NVM_INSTALL_URL],
+            capture_output=True,
+            text=True,
+            timeout=30
+        );
+
+        if install_script.returncode != 0 {
+            return (
+                False,
+                f'Failed to download NVM installer: {install_script.stderr}'
+            );
+        }
+
+        # Execute the installation script
+        result = subprocess.run(
+            ['bash', '-c', install_script.stdout],
+            capture_output=True,
+            text=True,
+            timeout=60
+        );
+
+        if result.returncode != 0 {
+            return (False, f'NVM installation failed: {result.stderr}');
+        }
+
+        print('NVM installed successfully!');
+        return (True, 'NVM installed successfully');
+    } except subprocess.TimeoutExpired {
+        return (
+            False,
+            'NVM installation timed out. Please check your internet connection.'
+        );
+    } except FileNotFoundError as e {
+        if 'curl' in str(e) {
+            return (
+                False,
+                'curl command not found. Please install curl first:\n' + '  Ubuntu/Debian: sudo apt-get install curl\n' + '  macOS: curl is pre-installed\n' + '  Fedora/RHEL: sudo dnf install curl'
+            );
+        }
+        return (False, f'Required command not found: {e}');
+    } except Exception as e {
+        return (False, f'Unexpected error during NVM installation: {e}');
+    }
+}
+
+"""Install Node.js using NVM."""
+impl NodeInstaller.install_node_via_nvm(version: str = "20") -> tuple[bool, str] {
+    print(f'Installing Node.js v{version} via NVM...');
+    nvm_dir = Path.home() / '.nvm';
+    nvm_script = nvm_dir / 'nvm.sh';
+    if not nvm_script.exists() {
+        return (False, 'NVM is not installed or nvm.sh not found');
+    }
+    try {
+        # Source NVM and install Node.js
+        command = (
+            'export NVM_DIR="$HOME/.nvm"\n' + '[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh"\n' + f'nvm install {version}\n' + f'nvm use {version}\n' + f'nvm alias default {version}\n'
+        );
+
+        result = subprocess.run(
+            ['bash', '-c', command], capture_output=True, text=True, timeout=300
+        );
+
+        if result.returncode != 0 {
+            return (False, f'Node.js installation failed: {result.stderr}');
+        }
+
+        print(f'Node.js v{version} installed successfully!');
+        return (True, f'Node.js v{version} installed successfully');
+    } except subprocess.TimeoutExpired {
+        return (False, 'Node.js installation timed out. Please try again.');
+    } except Exception as e {
+        return (False, f'Unexpected error during Node.js installation: {e}');
+    }
+}
+
+"""Ensure Node.js is installed, installing automatically if needed.
+
+Returns tuple of (success: bool, message: str, was_just_installed: bool)
+"""
+impl NodeInstaller.ensure_node_installed(
+    interactive: bool = True
+) -> tuple[bool, str, bool] {
+    # Common fallback message for manual installation
+    manual_install_msg = (
+        'Please install Node.js manually:\n' + '  • Download from: https://nodejs.org/\n' + '  • Or install NVM: https://github.com/nvm-sh/nvm\n' + '  After installation, run "jac add --cl" again.'
+    );
+    # Check if Node.js is already available
+    if NodeInstaller.is_node_installed() and NodeInstaller.is_npm_installed() {
+        version = NodeInstaller.get_node_version();
+        return (True, f'Node.js {version} is already installed', False);
+    }
+    print('\nNode.js is not installed or not found in PATH.');
+    # Check for interactive mode
+    if interactive {
+        print(
+            '\nJac client requires Node.js to build and run client-side applications.'
+        );
+        print(
+            f'Would you like to automatically install Node.js v{NodeInstaller.DEFAULT_NODE_VERSION} using NVM?'
+        );
+        response = input('Install Node.js? [Y/n]: ').strip().lower();
+        if response and response not in ('y', 'yes') {
+            return (
+                False,
+                f'Node.js installation cancelled. {manual_install_msg}',
+                False
+            );
+        }
+    }
+    # Wrap entire installation process in error handling
+    try {
+        # Check if NVM is installed
+        if not NodeInstaller.is_nvm_installed() {
+            success_nvm = NodeInstaller.install_nvm();
+            if not success_nvm[0] {
+                return (
+                    False,
+                    f'Unable to automatically install Node.js.\n\nError: {success_nvm[
+                        1
+                    ]}\n\n{manual_install_msg}',
+                    False
+                );
+            }
+        }
+
+        # Install Node.js via NVM
+        success_node = NodeInstaller.install_node_via_nvm();
+        if not success_node[0] {
+            return (
+                False,
+                f'Unable to automatically install Node.js.\n\nError: {success_node[1]}\n\n{manual_install_msg}',
+                False
+            );
+        }
+
+        # Node.js is now available via NVM sourcing in subprocesses
+        print('\n' + '=' * 70);
+        print('Node.js has been installed successfully!');
+        print('Continuing with package installation...');
+        print('=' * 70 + '\n');
+
+        return (
+            True,
+            f'Node.js {NodeInstaller.DEFAULT_NODE_VERSION} installed successfully',
+            True
+        );
+    } except Exception as e {
+        # Catch any unexpected errors during installation
+        return (
+            False,
+            f'Unable to automatically install Node.js.\n\nUnexpected error: {str(e)}\n\n{manual_install_msg}',
+            False
+        );
+    }
+}
+
+"""Run npm command with NVM environment properly sourced.
+
+This method automatically sources NVM in a subprocess, so npm commands work
+immediately after NVM installation without requiring the user to reload their shell.
+"""
+impl NodeInstaller.run_npm_with_nvm(
+    args: list, cwd: Path, timeout: int = 300
+) -> object {
+    # First, try running npm directly (in case it's already in PATH)
+    try {
+        return subprocess.run(
+            ['npm'] + args,
+            cwd=cwd,
+            capture_output=True,
+            text=True,
+            timeout=timeout,
+            check=True
+        );
+    } except FileNotFoundError { }
+    # If npm is not in PATH, source NVM and run npm in a subprocess
+    # This allows npm to work immediately after installation without shell reload
+    args_str = ' '.join(args);
+    command = (
+        'export NVM_DIR="$HOME/.nvm"\n' + '[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh"\n' + f'npm {args_str}\n'
+    );
+    return subprocess.run(
+        ['bash', '-c', command],
+        cwd=cwd,
+        capture_output=True,
+        text=True,
+        timeout=timeout,
+        check=True
+    );
+}

jac_client/plugin/utils/node_installer.jac

@@ -0,0 +1,41 @@
+"""Automatic Node.js installation utility using NVM."""
+
+import os;
+import platform;
+import subprocess;
+import from pathlib { Path }
+
+"""Handles Node.js installation and detection."""
+obj NodeInstaller {
+    static has DEFAULT_NODE_VERSION: str = "20",
+        NVM_INSTALL_URL: str = "https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh";
+
+    """Check if Node.js is installed and accessible."""
+    static def is_node_installed -> bool;
+
+    """Check if npm is installed and accessible."""
+    static def is_npm_installed -> bool;
+
+    """Check if NVM is installed."""
+    static def is_nvm_installed -> bool;
+
+    """Get the currently installed Node.js version."""
+    static def get_node_version -> (str | None);
+
+    """Install NVM (Node Version Manager)."""
+    static def install_nvm -> tuple[bool, str];
+
+    """Install Node.js using NVM."""
+    static def install_node_via_nvm(version: str = "20") -> tuple[bool, str];
+
+    """Ensure Node.js is installed, installing automatically if needed.
+
+    Returns tuple of (success: bool, message: str, was_just_installed: bool)
+    """
+    static def ensure_node_installed(
+        interactive: bool = True
+    ) -> tuple[bool, str, bool];
+
+    """Run npm command with NVM environment properly sourced."""
+    static def run_npm_with_nvm(args: list, cwd: Path, timeout: int = 300) -> object;
+}

jac_client/templates/client.jacpack

@@ -0,0 +1,72 @@
+{
+  "name": "client",
+  "description": "Jac project with frontend client setup",
+  "config": {
+    "project": {
+      "name": "{{name}}",
+      "version": "1.0.0",
+      "description": "Jac client application: {{name}}",
+      "entry-point": "main.jac"
+    },
+    "dependencies": {},
+    "dependencies.npm": {
+      "jac-client-node": "1.0.4"
+    },
+    "dependencies.npm.dev": {
+      "@jac-client/dev-deps": "1.0.0"
+    },
+    "dev-dependencies": {
+      "watchdog": ">=3.0.0"
+    },
+    "serve": {
+      "base_route_app": "app"
+    },
+    "plugins.client": {}
+  },
+  "files": {
+    "main.jac": "\"\"\"Main entry point for {{name}}.\"\"\"\n\n# Client-side imports (useState is auto-injected when using `has` variables)\ncl import from react { useEffect }\ncl import from .components.Button { Button }\n\n# Client-side component\ncl {\n    def:pub app() -> any {\n        has count: int = 0;\n\n        useEffect(lambda -> None {\n            console.log(\"Count updated:\", count);\n        }, [count]);\n\n        return <div style={{padding: \"2rem\", fontFamily: \"Arial, sans-serif\"}}>\n            <h1>Hello, World!</h1>\n            <p>Count: {count}</p>\n            <div style={{display: \"flex\", gap: \"1rem\", marginTop: \"1rem\"}}>\n                <Button\n                    label=\"Increment\"\n                    onClick={lambda -> None { count = count + 1; }}\n                    variant=\"primary\"\n                />\n                <Button\n                    label=\"Reset\"\n                    onClick={lambda -> None { count = 0; }}\n                    variant=\"secondary\"\n                />\n            </div>\n        </div>;\n    }\n}\n",
+    "components/Button.cl.jac": "\"\"\"Button component for the Jac client application.\"\"\"\n\ndef:pub Button(label: str, onClick: any, variant: str = \"primary\", disabled: bool = False) -> any {\n    base_styles = {\n        \"padding\": \"0.75rem 1.5rem\",\n        \"fontSize\": \"1rem\",\n        \"fontWeight\": \"600\",\n        \"borderRadius\": \"0.5rem\",\n        \"border\": \"none\",\n        \"cursor\": \"not-allowed\" if disabled else \"pointer\",\n        \"transition\": \"all 0.2s ease\"\n    };\n\n    variant_styles = {\n        \"primary\": {\n            \"backgroundColor\": \"#9ca3af\" if disabled else \"#3b82f6\",\n            \"color\": \"#ffffff\"\n        },\n        \"secondary\": {\n            \"backgroundColor\": \"#e5e7eb\" if disabled else \"#6b7280\",\n            \"color\": \"#ffffff\"\n        }\n    };\n\n    return <button\n        style={{**base_styles, **variant_styles[variant]}}\n        onClick={onClick}\n        disabled={disabled}\n    >\n        {label}\n    </button>;\n}\n",
+    "README.md": "# {{name}}\n\nA Jac client-side application with React support.\n\n## Project Structure\n\n```\n{{name}}/\n\u251c\u2500\u2500 jac.toml              # Project configuration\n\u251c\u2500\u2500 main.jac              # Main application entry\n\u251c\u2500\u2500 components/           # Reusable components\n\u2502   \u2514\u2500\u2500 Button.cl.jac     # Example Jac component\n\u251c\u2500\u2500 assets/               # Static assets (images, fonts, etc.)\n\u2514\u2500\u2500 build/                # Build output (generated)\n```\n\n## Getting Started\n\nStart the development server:\n\n```bash\njac start main.jac\n```\n\n## Components\n\nCreate Jac components in `components/` as `.cl.jac` files and import them:\n\n```jac\ncl import from .components.Button { Button }\n```\n\n## Adding Dependencies\n\nAdd npm packages with the --cl flag:\n\n```bash\njac add --cl react-router-dom\n```\n"
+  },
+  "directories": [
+    "components",
+    "assets",
+    ".jac/client"
+  ],
+  "gitignore_entries": [
+    "# Ignore all build artifacts in .jac directory",
+    "*"
+  ],
+  "root_gitignore_entries": [
+    "# Jac project",
+    "packages/",
+    "*.jbc",
+    "*.jir",
+    "",
+    "# Python",
+    "__pycache__/",
+    "*.py[cod]",
+    ".venv/",
+    "venv/",
+    "",
+    "# IDE",
+    ".idea/",
+    ".vscode/",
+    "*.swp",
+    "",
+    "# Node.js",
+    "node_modules/",
+    "",
+    "# Build artifacts",
+    ".jac/",
+    "*.session",
+    "*.session.*"
+  ],
+  "jaclang": "0.9.8",
+  "plugins": [
+    {
+      "name": "jac-client",
+      "version": "0.2.8"
+    }
+  ]
+}

jac_client/templates/fullstack.jacpack

@@ -0,0 +1,61 @@
+{
+  "name": "fullstack",
+  "description": "Full-stack Jac app with authenticated todo list example",
+  "config": {
+    "project": {
+      "name": "{{name}}",
+      "version": "0.1.0",
+      "description": "A full-stack Jac application",
+      "entry-point": "main.jac"
+    },
+    "dependencies": {},
+    "dependencies.npm": {
+      "jac-client-node": "1.0.4"
+    },
+    "dependencies.npm.dev": {
+      "@jac-client/dev-deps": "1.0.0"
+    },
+    "dev-dependencies": {
+      "watchdog": ">=3.0.0"
+    },
+    "serve": {
+      "base_route_app": "app"
+    },
+    "plugins.client": {}
+  },
+  "files": {
+    "main.jac": "\"\"\"{{name}} - Entry Point.\n\nCombines server-side endpoints with client-side UI.\n\"\"\"\n\n# Import server-side data models and walkers\nsv {\n    import from endpoints { Todo, AddTodo, ListTodos, ToggleTodo, DeleteTodo }\n}\n\n# Client-side UI\ncl {\n    import from .frontend { app as ClientApp }\n\n    def:pub app -> any {\n        return\n            <ClientApp />;\n    }\n}\n",
+    "endpoints.sv.jac": "\"\"\"Todo App - Server-Side Data Layer.\n\nEach user gets their own todo list automatically!\nWhen authenticated, `root spawn` uses the user's personal root node.\n\"\"\"\n\n# ========================================\n# Data Models\n# ========================================\nnode Todo {\n    has id: str,\n        title: str,\n        completed: bool = False;\n}\n\nglob todo_counter: int = 0;\n\n# ========================================\n# Walkers (API Operations)\n# ========================================\nwalker:priv AddTodo {\n    \"\"\"Add a new todo item to the user's list.\"\"\"\n    has title: str;\n\n    can create with `root entry {\n        global todo_counter;\n        todo_counter += 1;\n        new_id = \"todo_\" + str(todo_counter);\n        new_todo = here ++> Todo(id=new_id, title=self.title, completed=False);\n        if new_todo {\n            report new_todo[0] ;\n        }\n    }\n}\n\nwalker:priv ListTodos {\n    \"\"\"List all todo items for the current user.\"\"\"\n    has todos: list = [];\n\n    can collect with `root entry {\n        visit [-->];\n    }\n\n    can gather with Todo entry {\n        self.todos.append(\n            {\"id\": here.id, \"title\": here.title, \"completed\": here.completed}\n        );\n    }\n\n    can report_all with `root exit {\n        report self.todos ;\n    }\n}\n\nwalker:priv ToggleTodo {\n    \"\"\"Toggle a todo's completed status.\"\"\"\n    has todo_id: str;\n\n    can search with `root entry {\n        visit [-->];\n    }\n\n    can toggle with Todo entry {\n        if here.id == self.todo_id {\n            here.completed = not here.completed;\n            report {\"id\": here.id, \"completed\": here.completed} ;\n        }\n    }\n}\n\nwalker:priv DeleteTodo {\n    \"\"\"Delete a todo item.\"\"\"\n    has todo_id: str;\n\n    can search with `root entry {\n        visit [-->];\n    }\n\n    can delete with Todo entry {\n        if here.id == self.todo_id {\n            del here ;\n            report {\"deleted\": self.todo_id} ;\n        }\n    }\n}\n",
+    "frontend.cl.jac": "\"\"\"Todo App - Client-Side UI.\"\"\"\n\nimport from react { useEffect }\nimport from \"@jac-client/utils\" { jacSignup, jacLogin, jacLogout, jacIsLoggedIn }\n\nimport from .components.TodoItem { TodoItem }\nimport from .components.AuthForm { AuthForm }\n\nsv import from endpoints { AddTodo, ListTodos, ToggleTodo, DeleteTodo }\n\ndef:pub app -> any {\n    has isLoggedIn: bool = False,\n        checkingAuth: bool = True,\n        isSignup: bool = False,\n        username: str = \"\",\n        password: str = \"\",\n        error: str = \"\",\n        loading: bool = False,\n        todos: list = [],\n        newTodoText: str = \"\",\n        todosLoading: bool = True;\n\n    # Check login status on mount\n    useEffect(lambda -> None { isLoggedIn = jacIsLoggedIn();checkingAuth = False;}, []);\n\n    # Load todos when logged in\n    useEffect(\n        lambda -> None { if isLoggedIn {\n            fetchTodos();\n        }},\n        [isLoggedIn]\n    );\n\n    # Fetch todos from server\n    async def fetchTodos -> None {\n        todosLoading = True;\n        result = root spawn ListTodos();\n        todos = result.reports[0] if result.reports else [];\n        todosLoading = False;\n    }\n\n    # Add a new todo\n    async def addTodo -> None {\n        if not newTodoText.trim() {\n            return;\n        }\n        response = root spawn AddTodo(title=newTodoText);\n        newTodo = response.reports[0];\n        todos = todos.concat(\n            [\n                {\n                    \"id\": newTodo.id,\n                    \"title\": newTodo.title,\n                    \"completed\": newTodo.completed\n                }\n            ]\n        );\n        newTodoText = \"\";\n    }\n\n    # Toggle todo completion\n    async def toggleTodo(todoId: str) -> None {\n        root spawn ToggleTodo(todo_id=todoId);\n        todos = todos.map(\n            lambda t: any  -> any { if t.id == todoId {\n                return {\"id\": t.id, \"title\": t.title, \"completed\": not t.completed};\n            }return t; }\n        );\n    }\n\n    # Delete a todo\n    async def deleteTodo(todoId: str) -> None {\n        root spawn DeleteTodo(todo_id=todoId);\n        todos = todos.filter(lambda t: any  -> bool { return t.id != todoId; });\n    }\n\n    # Handle login\n    async def handleLogin -> None {\n        error = \"\";\n        if not username.trim() or not password {\n            error = \"Please fill in all fields\";\n            return;\n        }\n        loading = True;\n        success = await jacLogin(username, password);\n        loading = False;\n        if success {\n            isLoggedIn = True;\n            username = \"\";\n            password = \"\";\n        } else {\n            error = \"Invalid username or password\";\n        }\n    }\n\n    # Handle signup\n    async def handleSignup -> None {\n        error = \"\";\n        if not username.trim() or not password {\n            error = \"Please fill in all fields\";\n            return;\n        }\n        if password.length < 4 {\n            error = \"Password must be at least 4 characters\";\n            return;\n        }\n        loading = True;\n        result = await jacSignup(username, password);\n        loading = False;\n        if result[\"success\"] {\n            isLoggedIn = True;\n            username = \"\";\n            password = \"\";\n        } else {\n            error = result[\"error\"] if result[\"error\"] else \"Signup failed\";\n        }\n    }\n\n    # Handle logout\n    def handleLogout -> None {\n        jacLogout();\n        isLoggedIn = False;\n        todos = [];\n        username = \"\";\n        password = \"\";\n        error = \"\";\n    }\n\n    # Handle form submit\n    async def handleSubmit(e: any) -> None {\n        e.preventDefault();\n        if isSignup {\n            await handleSignup();\n        } else {\n            await handleLogin();\n        }\n    }\n\n    # Handle enter key for todo input\n    def handleTodoKeyPress(e: any) -> None {\n        if e.key == \"Enter\" {\n            addTodo();\n        }\n    }\n\n    # Loading screen\n    if checkingAuth {\n        return\n            <div\n                style={{\n                    \"display\": \"flex\",\n                    \"justifyContent\": \"center\",\n                    \"alignItems\": \"center\",\n                    \"height\": \"100vh\",\n                    \"fontFamily\": \"system-ui, -apple-system, sans-serif\",\n                    \"color\": \"#666\"\n                }}\n            >\n                Loading...\n            </div>;\n    }\n\n    # Logged in - Show Todo List\n    if isLoggedIn {\n        return\n            <div\n                style={{\n                    \"maxWidth\": \"600px\",\n                    \"margin\": \"2rem auto\",\n                    \"padding\": \"2rem\",\n                    \"fontFamily\": \"system-ui, -apple-system, sans-serif\"\n                }}\n            >\n                <div\n                    style={{\n                        \"display\": \"flex\",\n                        \"justifyContent\": \"space-between\",\n                        \"alignItems\": \"center\",\n                        \"marginBottom\": \"1.5rem\"\n                    }}\n                >\n                    <h1 style={{\"margin\": \"0\", \"color\": \"#1a1a2e\"}}>\n                        My Todos\n                    </h1>\n                    <button\n                        onClick={handleLogout}\n                        style={{\n                            \"padding\": \"0.5rem 1rem\",\n                            \"fontSize\": \"0.9rem\",\n                            \"backgroundColor\": \"#f8f9fa\",\n                            \"color\": \"#666\",\n                            \"border\": \"1px solid #ddd\",\n                            \"borderRadius\": \"6px\",\n                            \"cursor\": \"pointer\"\n                        }}\n                    >\n                        Log Out\n                    </button>\n                </div>\n                <div\n                    style={{\n                        \"display\": \"flex\",\n                        \"gap\": \"0.5rem\",\n                        \"marginBottom\": \"1.5rem\"\n                    }}\n                >\n                    <input\n                        type=\"text\"\n                        value={newTodoText}\n                        onChange={lambda e: any  -> None { newTodoText = e.target.value;}}\n                        onKeyPress={handleTodoKeyPress}\n                        placeholder=\"What needs to be done?\"\n                        style={{\n                            \"flex\": \"1\",\n                            \"padding\": \"0.75rem 1rem\",\n                            \"fontSize\": \"1rem\",\n                            \"border\": \"2px solid #e0e0e0\",\n                            \"borderRadius\": \"8px\",\n                            \"outline\": \"none\"\n                        }}\n                    />\n                    <button\n                        onClick={lambda -> None { addTodo();}}\n                        style={{\n                            \"padding\": \"0.75rem 1.5rem\",\n                            \"fontSize\": \"1rem\",\n                            \"backgroundColor\": \"#4CAF50\",\n                            \"color\": \"white\",\n                            \"border\": \"none\",\n                            \"borderRadius\": \"8px\",\n                            \"cursor\": \"pointer\"\n                        }}\n                    >\n                        Add\n                    </button>\n                </div>\n                {(\n                    <div style={{\"color\": \"#666\", \"textAlign\": \"center\"}}>\n                        Loading todos...\n                    </div>\n                )\n                if todosLoading\n                else None}\n                {(\n                    <div>\n                        {(\n                            <p\n                                style={{\n                                    \"color\": \"#888\",\n                                    \"textAlign\": \"center\",\n                                    \"padding\": \"2rem\"\n                                }}\n                            >\n                                No todos yet. Add one above!\n                            </p>\n                        )\n                        if todos.length == 0\n                        else None}{todos.map(\n                            lambda todo: any  -> any { return\n                                <TodoItem\n                                    key={todo.id}\n                                    todo={todo}\n                                    onToggle={toggleTodo}\n                                    onDelete={deleteTodo}\n                                />; }\n                        )}\n                    </div>\n                )\n                if not todosLoading\n                else None}\n                <div\n                    style={{\n                        \"marginTop\": \"2rem\",\n                        \"paddingTop\": \"1rem\",\n                        \"borderTop\": \"1px solid #eee\",\n                        \"color\": \"#888\",\n                        \"fontSize\": \"0.9rem\"\n                    }}\n                >\n                    {todos.filter(lambda t: any  -> bool { return not t.completed; }).length} items left\n                </div>\n            </div>;\n    }\n\n    # Not logged in - Show Auth Form\n    return\n        <AuthForm\n            isSignup={isSignup}\n            username={username}\n            password={password}\n            error={error}\n            loading={loading}\n            onUsernameChange={lambda e: any  -> None { username = e.target.value;}}\n            onPasswordChange={lambda e: any  -> None { password = e.target.value;}}\n            onSubmit={handleSubmit}\n            onToggleMode={lambda -> None { isSignup = not isSignup;error = \"\";}}\n        />;\n}\n",
+    "components/AuthForm.cl.jac": "\"\"\"Authentication form component for login/signup.\"\"\"\n\ndef:pub AuthForm(\n    isSignup: bool,\n    username: str,\n    password: str,\n    error: str,\n    loading: bool,\n    onUsernameChange: any,\n    onPasswordChange: any,\n    onSubmit: any,\n    onToggleMode: any\n) -> any {\n    return\n        <div\n            style={{\n                \"maxWidth\": \"400px\",\n                \"margin\": \"4rem auto\",\n                \"padding\": \"2rem\",\n                \"fontFamily\": \"system-ui, -apple-system, sans-serif\",\n                \"backgroundColor\": \"#fff\",\n                \"borderRadius\": \"12px\",\n                \"boxShadow\": \"0 4px 6px rgba(0,0,0,0.1)\"\n            }}\n        >\n            <h1\n                style={{\n                    \"marginBottom\": \"0.5rem\",\n                    \"color\": \"#1a1a2e\",\n                    \"textAlign\": \"center\"\n                }}\n            >\n                Jac Todo App\n            </h1>\n            <p\n                style={{\n                    \"marginBottom\": \"1.5rem\",\n                    \"color\": \"#666\",\n                    \"textAlign\": \"center\"\n                }}\n            >\n                {(\"Create an account\" if isSignup else \"Sign in to your account\")}\n            </p>\n            {(\n                <div\n                    style={{\n                        \"padding\": \"0.75rem\",\n                        \"marginBottom\": \"1rem\",\n                        \"backgroundColor\": \"#fee\",\n                        \"color\": \"#c00\",\n                        \"borderRadius\": \"6px\",\n                        \"fontSize\": \"0.9rem\"\n                    }}\n                >\n                    {error}\n                </div>\n            )\n            if error\n            else None}\n            <form onSubmit={onSubmit}>\n                <input\n                    type=\"text\"\n                    value={username}\n                    onChange={onUsernameChange}\n                    placeholder=\"Username\"\n                    style={{\n                        \"width\": \"100%\",\n                        \"padding\": \"0.75rem 1rem\",\n                        \"marginBottom\": \"0.75rem\",\n                        \"fontSize\": \"1rem\",\n                        \"border\": \"2px solid #e0e0e0\",\n                        \"borderRadius\": \"8px\",\n                        \"outline\": \"none\",\n                        \"boxSizing\": \"border-box\"\n                    }}\n                />\n                <input\n                    type=\"password\"\n                    value={password}\n                    onChange={onPasswordChange}\n                    placeholder=\"Password\"\n                    style={{\n                        \"width\": \"100%\",\n                        \"padding\": \"0.75rem 1rem\",\n                        \"marginBottom\": \"1rem\",\n                        \"fontSize\": \"1rem\",\n                        \"border\": \"2px solid #e0e0e0\",\n                        \"borderRadius\": \"8px\",\n                        \"outline\": \"none\",\n                        \"boxSizing\": \"border-box\"\n                    }}\n                />\n                <button\n                    type=\"submit\"\n                    disabled={loading}\n                    style={{\n                        \"width\": \"100%\",\n                        \"padding\": \"0.75rem\",\n                        \"fontSize\": \"1rem\",\n                        \"backgroundColor\": (\"#999\" if loading else \"#4CAF50\"),\n                        \"color\": \"white\",\n                        \"border\": \"none\",\n                        \"borderRadius\": \"8px\",\n                        \"cursor\": (\"not-allowed\" if loading else \"pointer\"),\n                        \"marginBottom\": \"1rem\"\n                    }}\n                >\n                    {(\n                        (\n                            \"Processing...\"\n                            if loading\n                            else (\"Sign Up\" if isSignup else \"Log In\")\n                        )\n                    )}\n                </button>\n            </form>\n            <p style={{\"textAlign\": \"center\", \"color\": \"#666\", \"fontSize\": \"0.9rem\"}}>\n                {(\n                    \"Already have an account? \"\n                    if isSignup\n                    else \"Don't have an account? \"\n                )}\n                <span\n                    onClick={onToggleMode}\n                    style={{\n                        \"color\": \"#4CAF50\",\n                        \"cursor\": \"pointer\",\n                        \"fontWeight\": \"bold\"\n                    }}\n                >\n                    {(\"Log In\" if isSignup else \"Sign Up\")}\n                </span>\n            </p>\n        </div>;\n}\n",
+    "components/TodoItem.cl.jac": "\"\"\"Todo item component for displaying a single todo.\"\"\"\n\ndef:pub TodoItem(todo: dict, onToggle: any, onDelete: any) -> any {\n    return\n        <div\n            key={todo.id}\n            style={{\n                \"display\": \"flex\",\n                \"alignItems\": \"center\",\n                \"gap\": \"0.75rem\",\n                \"padding\": \"1rem\",\n                \"marginBottom\": \"0.5rem\",\n                \"backgroundColor\": \"#f8f9fa\",\n                \"borderRadius\": \"8px\",\n                \"border\": \"1px solid #e9ecef\"\n            }}\n        >\n            <input\n                type=\"checkbox\"\n                checked={todo.completed}\n                onChange={lambda -> None { onToggle(todo.id);}}\n                style={{\"width\": \"20px\", \"height\": \"20px\", \"cursor\": \"pointer\"}}\n            />\n            <span\n                style={{\n                    \"flex\": \"1\",\n                    \"textDecoration\": (\"line-through\" if todo.completed else \"none\"),\n                    \"color\": (\"#888\" if todo.completed else \"#333\")\n                }}\n            >\n                {todo.title}\n            </span>\n            <button\n                onClick={lambda -> None { onDelete(todo.id);}}\n                style={{\n                    \"padding\": \"0.5rem\",\n                    \"backgroundColor\": \"transparent\",\n                    \"color\": \"#dc3545\",\n                    \"border\": \"none\",\n                    \"cursor\": \"pointer\",\n                    \"fontSize\": \"1.2rem\"\n                }}\n            >\n                x\n            </button>\n        </div>;\n}\n",
+    "components/Button.cl.jac": "\"\"\"Button component for the Jac client application.\"\"\"\n\ndef:pub Button(\n    label: str, onClick: any, variant: str = \"primary\", disabled: bool = False\n) -> any {\n    base_styles = {\n        \"padding\": \"0.75rem 1.5rem\",\n        \"fontSize\": \"1rem\",\n        \"fontWeight\": \"600\",\n        \"borderRadius\": \"0.5rem\",\n        \"border\": \"none\",\n        \"cursor\": \"not-allowed\" if disabled else \"pointer\",\n        \"transition\": \"all 0.2s ease\"\n    };\n\n    variant_styles = {\n        \"primary\": {\n            \"backgroundColor\": \"#9ca3af\" if disabled else \"#3b82f6\",\n            \"color\": \"#ffffff\"\n        },\n        \"secondary\": {\n            \"backgroundColor\": \"#e5e7eb\" if disabled else \"#6b7280\",\n            \"color\": \"#ffffff\"\n        }\n    };\n\n    return\n        <button\n            style={{** base_styles, ** variant_styles[variant]}}\n            onClick={onClick}\n            disabled={disabled}\n        >\n            {label}\n        </button>;\n}\n",
+    "README.md": "# {{name}}\n\nA full-stack Jac application with user authentication and todo list functionality.\n\n## Project Structure\n\n```\n{{name}}/\n\u251c\u2500\u2500 jac.toml              # Project configuration\n\u251c\u2500\u2500 main.jac              # Main entry point (combines server + client)\n\u251c\u2500\u2500 endpoints.sv.jac      # Server-side data models and walkers\n\u251c\u2500\u2500 frontend.cl.jac       # Client-side React UI\n\u251c\u2500\u2500 components/           # Reusable client components\n\u2502   \u251c\u2500\u2500 AuthForm.cl.jac   # Login/signup form\n\u2502   \u251c\u2500\u2500 TodoItem.cl.jac   # Individual todo display\n\u2502   \u2514\u2500\u2500 Button.cl.jac     # Reusable button component\n\u2514\u2500\u2500 assets/               # Static assets (images, fonts, etc.)\n```\n\n## Getting Started\n\nStart the development server:\n\n```bash\njac start main.jac\n```\n\nThen open your browser to the URL shown in the terminal.\n\n## Features\n\n- **User Authentication**: Sign up and log in with username/password\n- **Personal Todo Lists**: Each user gets their own isolated todo list\n- **CRUD Operations**: Create, read, update (toggle), and delete todos\n- **Real-time UI**: Responsive React frontend with instant updates\n\n## Architecture\n\nThis template demonstrates the full-stack Jac architecture:\n\n- **Server (`.sv.jac`)**: Defines data models (`node Todo`) and walkers for API operations\n- **Client (`.cl.jac`)**: React components with hooks and state management\n- **Entry Point (`main.jac`)**: Combines server and client imports\n\n## Adding Dependencies\n\nAdd npm packages with the --cl flag:\n\n```bash\njac add --cl react-router-dom\n```\n"
+  },
+  "directories": [
+    ".jac",
+    "assets"
+  ],
+  "gitignore_entries": [
+    "# Ignore all build artifacts in .jac directory",
+    "*"
+  ],
+  "root_gitignore_entries": [
+    "# Jac build artifacts",
+    ".jac/",
+    "",
+    "# Dependencies",
+    "node_modules/",
+    "",
+    "# IDE",
+    ".vscode/",
+    ".idea/"
+  ],
+  "jaclang": "0.9.8",
+  "plugins": [
+    {
+      "name": "jac-client",
+      "version": "0.2.8"
+    }
+  ]
+}

jac_client/tests/conftest.py

@@ -15,13 +15,31 @@ import subprocess
 import sys
 import tempfile
 from collections.abc import Generator
+from concurrent.futures import ThreadPoolExecutor
 from pathlib import Path
 from unittest.mock import patch
 
 import pytest
 
+from jaclang.pycore.program import JacProgram
 from jaclang.pycore.runtime import JacRuntime as Jac
-from jaclang.pycore.runtime import JacRuntimeImpl, plugin_manager
+from jaclang.pycore.runtime import JacRuntimeImpl, JacRuntimeInterface, plugin_manager
+
+# =============================================================================
+# Console Output Normalization - Disable Rich styling during tests
+# =============================================================================
+
+
+@pytest.fixture(autouse=True)
+def disable_rich_console_formatting(monkeypatch: pytest.MonkeyPatch) -> None:
+    """Disable Rich console formatting for consistent test output.
+
+    Sets NO_COLOR and NO_EMOJI environment variables to ensure tests
+    get plain text output without ANSI codes or emoji prefixes.
+    """
+    monkeypatch.setenv("NO_COLOR", "1")
+    monkeypatch.setenv("NO_EMOJI", "1")
+
 
 # Store unregistered plugins globally for session-level management
 _external_plugins: list = []
@@ -79,11 +97,34 @@ def _get_env_with_npm() -> dict[str, str]:
 
 
 @pytest.fixture(autouse=True)
-def reset_jac_machine() -> Generator[None, None, None]:
+def reset_jac_machine(tmp_path: Path) -> Generator[None, None, None]:
     """Reset Jac machine before and after each test."""
-    Jac.reset_machine()
+    # Close existing context if any
+    if Jac.exec_ctx is not None:
+        Jac.exec_ctx.mem.close()
+
+    # Remove user .jac modules from sys.modules so they get re-imported fresh
+    # Keep jaclang.* and __main__ to avoid breaking dataclass references
+    for mod in list(Jac.loaded_modules.values()):
+        if not mod.__name__.startswith("jaclang.") and mod.__name__ != "__main__":
+            sys.modules.pop(mod.__name__, None)
+    Jac.loaded_modules.clear()
+
+    # Set up fresh state
+    Jac.base_path_dir = str(tmp_path)
+    Jac.program = JacProgram()
+    Jac.pool = ThreadPoolExecutor()
+    Jac.exec_ctx = JacRuntimeInterface.create_j_context(user_root=None)
+
     yield
-    Jac.reset_machine()
+
+    # Cleanup after test
+    if Jac.exec_ctx is not None:
+        Jac.exec_ctx.mem.close()
+    for mod in list(Jac.loaded_modules.values()):
+        if not mod.__name__.startswith("jaclang.") and mod.__name__ != "__main__":
+            sys.modules.pop(mod.__name__, None)
+    Jac.loaded_modules.clear()
 
 
 # Session-scoped cache for npm installation
@@ -123,11 +164,11 @@ def npm_cache_dir() -> Generator[Path, None, None]:
     jac_toml = cache_dir / "jac.toml"
     jac_toml.write_text(_get_minimal_jac_toml())
 
-    # Run jac add --cl to install packages
+    # Run jac add --npm to install packages
     jac_cmd = _get_jac_command()
     env = _get_env_with_npm()
     result = subprocess.run(
-        [*jac_cmd, "add", "--cl"],
+        [*jac_cmd, "add", "--npm"],
         cwd=cache_dir,
         capture_output=True,
         text=True,
@@ -213,7 +254,7 @@ antd = "^6.0.0"
     jac_cmd = _get_jac_command()
     env = _get_env_with_npm()
     result = subprocess.run(
-        [*jac_cmd, "add", "--cl"],
+        [*jac_cmd, "add", "--npm"],
         cwd=tmp_path,
         capture_output=True,
         text=True,