# Baba Yaga AST Visualizer

A web-based tool for visualizing the Abstract Syntax Tree (AST) of Baba Yaga code.

## Features

- **Real-time AST Generation**: Enter Baba Yaga code and see its AST instantly
- **Token Visualization**: View the tokenized representation of your code
- **Error Display**: Clear error messages for invalid syntax
- **Example Code**: Pre-loaded examples demonstrating different language features
- **Copy to Clipboard**: One-click copying of AST and tokens for easy sharing
- **Clean Interface**: Simple, focused design following the project's design patterns

## Usage

1. Open `ast-viewer.html` in your browser
2. Enter Baba Yaga code in the text area
3. Click "Generate AST" or use Ctrl+Enter
4. View the AST and tokens in the output sections below
5. Use the "Copy AST" or "Copy Tokens" buttons to copy the content to your clipboard

## Examples Included

- **Simple Assignment**: Basic variable assignment
- **When Expression**: Pattern matching with when/is/then
- **Function Definition**: Arrow function with pattern matching
- **Table Literal**: Creating and accessing table structures
- **Arithmetic Expression**: Mathematical operations and function composition
- **Complex When Expression**: Multi-pattern matching

## Technical Details

- Uses the same `lexer.js` and `parser.js` modules as the main language
- No modifications to core language files required
- Pure client-side JavaScript with ES6 modules
- Responsive design that works on desktop and mobile

## File Structure

```
web/
├── ast.html          # Main AST visualization interface
├── src/
│   └── ast.js        # AST generation logic
├── style.css         # Shared styling
└── README-AST.md     # This file
```

## Browser Compatibility

Requires a modern browser with ES6 module support:
- Chrome 61+
- Firefox 60+
- Safari 10.1+
- Edge 16+

## Development

To run locally:
```bash
cd web
python3 -m http.server 8000
# or
npx serve .
```

Then open `http://localhost:8000/ast.html`