feat: overhaul UI and add guarded code visualizer

.gitignore

@@ -16,6 +16,7 @@ dist-ssr
 .vscode/*
 !.vscode/extensions.json
 .idea
+.jambavan/
 .DS_Store
 *.suo
 *.ntvs*

.pre-commit-config.yaml

@@ -0,0 +1,23 @@
+---
+# Fast repository hygiene plus the same TypeScript checks used locally.
+repos:
+- repo: https://github.com/pre-commit/pre-commit-hooks
+  rev: v6.0.0
+  hooks:
+  - id: trailing-whitespace
+  - id: check-merge-conflict
+  - id: check-json
+  - id: check-yaml
+  - id: end-of-file-fixer
+- repo: local
+  hooks:
+  - id: eslint
+    name: ESLint
+    entry: npm run lint
+    language: system
+    pass_filenames: false
+  - id: vitest
+    name: Vitest
+    entry: npm test
+    language: system
+    pass_filenames: false

README.md

@@ -24,6 +24,7 @@ An interactive, browser-based playground for learning algorithms, data structure
   - Evolution Simulator (genetic algorithm)
   - Rubik's Cube Solver
 - **Git Visualizer** — a 1.7k-LOC pure-TS Git simulator with terminal, commit-DAG canvas, freeplay mode, and guided lessons (init/add/commit, branching, merging, rebase, reset, stash, cherry-pick, remotes, push/pull, etc.).
+- **Visualize Your Code** — enter a bounded JavaScript subset and play through line highlights, variable snapshots, array bars, and console output. A whitelist interpreter enforces source, operation, loop, trace, time, and memory limits without `eval` or browser-code execution.
 
 ## Quick start
 
@@ -83,6 +84,7 @@ The pure-TS layer (`algorithms/` or `engine/`) returns arrays of `Step` objects
 | Styling    | Tailwind CSS v4 (`@tailwindcss/vite`)       |
 | Routing    | `react-router-dom` v7 with code-split routes |
 | Icons      | `lucide-react`                              |
+| Code parsing | Acorn 8 + a bounded, purpose-built interpreter |
 | Audio      | Web Audio API (single shared `AudioContext`) |
 | Lint       | ESLint flat config + `typescript-eslint` + `react-hooks` |
 

docs/404.html

@@ -5,8 +5,8 @@
     <link rel="icon" type="image/svg+xml" href="/algorithm-visualizer/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Algorithm Visualizer</title>
-    <script type="module" crossorigin src="/algorithm-visualizer/assets/index-eCXyAnHs.js"></script>
-    <link rel="stylesheet" crossorigin href="/algorithm-visualizer/assets/index-yKJrWCHV.css">
+    <script type="module" crossorigin src="/algorithm-visualizer/assets/index-DBkLeWDs.js"></script>
+    <link rel="stylesheet" crossorigin href="/algorithm-visualizer/assets/index-BWwyfYSG.css">
   </head>
   <body>
     <div id="root"></div>