# CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

## Project Overview

This is an experimental project demonstrating the Infinite Agentic Loop pattern using Claude Code's custom slash commands. The project orchestrates multiple AI agents in parallel to generate evolving iterations of themed hybrid UI components based on specifications.

## Key Commands

### Running the Original Infinite Agentic Loop

```bash
claude
```

Then use the `/project:infinite` slash command with these variants:

```bash
# Single generation
/project:infinite specs/invent_new_ui_v3.md src 1

# Small batch (5 iterations)
/project:infinite specs/invent_new_ui_v3.md src_new 5

# Large batch (20 iterations)
/project:infinite specs/invent_new_ui_v3.md src_new 20

# Infinite mode (continuous generation)
/project:infinite specs/invent_new_ui_v3.md infinite_src_new/ infinite
```

### Running the Web-Enhanced Infinite Loop (NEW!)

The `/project:infinite-web` command adds progressive web-based learning where each iteration fetches and learns from web resources:

```bash
# Single D3 visualization with web learning
/project:infinite-web specs/d3_visualization_progressive.md d3_viz 1

# Batch of 5 with different web sources
/project:infinite-web specs/d3_visualization_progressive.md d3_viz 5

# Progressive learning (20 iterations from foundation → expert)
/project:infinite-web specs/d3_visualization_progressive.md d3_viz 20 specs/d3_url_strategy.json

# Infinite mode - continuous learning until context limits
/project:infinite-web specs/d3_visualization_progressive.md d3_viz infinite specs/d3_url_strategy.json
```

**Key Enhancement:** Each iteration fetches a web URL, learns specific techniques, and applies them to create progressively sophisticated outputs. See [WEB_ENHANCED_GUIDE.md](WEB_ENHANCED_GUIDE.md) for details.

## Architecture & Structure

### Command System
The project uses Claude Code's custom commands feature:
- `.claude/commands/infinite.md` - Original infinite loop orchestrator command
- `.claude/commands/infinite-web.md` - NEW! Web-enhanced loop with progressive learning
- `.claude/commands/prime.md` - Context priming command
- `.claude/commands/prime-initial.md` - Initial context loading command
- `.claude/settings.json` - Permissions configuration allowing Write, MultiEdit, Edit, and Bash

### Specification-Driven Generation
- Specifications in `specs/` directory define what type of content to generate
- **Original Specs:**
  - `specs/invent_new_ui_v3.md` - Themed Hybrid UI Component Specification
  - `specs/invent_new_ui_v4.md` - Modular architecture variant (3-file structure)
- **Web-Enhanced Specs (NEW!):**
  - `specs/d3_visualization_progressive.md` - D3.js visualizations with progressive web learning
  - `specs/d3_url_strategy.json` - Curated URL progression for D3 learning
- Specs define naming patterns, content structure, design dimensions, quality standards, and web integration strategy

### Multi-Agent Orchestration Pattern
Both infinite commands implement sophisticated parallel agent coordination:

**Original Pattern (`/project:infinite`):**
1. **Specification Analysis** - Deeply understands the spec requirements
2. **Directory Reconnaissance** - Analyzes existing iterations to maintain uniqueness
3. **Parallel Sub-Agent Deployment** - Launches multiple agents with distinct creative directions
4. **Wave-Based Generation** - For infinite mode, manages successive agent waves
5. **Context Management** - Optimizes context usage across all agents

**Web-Enhanced Pattern (`/project:infinite-web` - NEW!):**
1. **Initial Web Priming** - Fetches foundational web resources to build knowledge base
2. **Specification + Web Context Analysis** - Understands spec with web knowledge integration
3. **URL Strategy Planning** - Maps iterations to progressive difficulty URLs
4. **Parallel Web-Enhanced Agents** - Each agent fetches unique URL, learns, and generates
5. **Progressive Wave Learning** - Each wave increases sophistication with expert URLs
6. **Knowledge Accumulation** - Later iterations build on earlier web discoveries

### Generated Content Organization
**Original Loop Outputs:**
- `src/` - Primary output directory for themed hybrid UI components (35 files)
- `src_infinite/` - Infinite mode UI generations (25 files)
- `src_group/` - Modular 3-file architecture components (5 directories)
- `legacy/` - Previous iteration attempts and experiments

**Web-Enhanced Loop Outputs (NEW!):**
- `d3_viz/` - D3 visualizations with progressive web learning (create with `/project:infinite-web`)
- Each output file documents its web source and learning application

### Key Implementation Details
**Original Loop:**
- Sub-agents receive complete context including spec, existing iterations, and unique creative assignments
- Parallel execution managed through Task tool with batch sizes optimized by count
- Progressive sophistication strategy for infinite mode waves
- Each iteration must be genuinely unique while maintaining spec compliance

**Web-Enhanced Loop (NEW!):**
- Initial web priming phase fetches 3-5 foundational resources before generation
- Each sub-agent assigned unique URL to fetch and learn from
- WebFetch or WebSearch tools used to retrieve documentation, tutorials, examples
- Agents extract 1-3 specific techniques from web source and apply to output
- URL tracking prevents duplicate web sources across iterations
- Progressive URL difficulty: foundation → intermediate → advanced → expert
- Dynamic web search fallback when pre-defined URLs exhausted
- All outputs document web source and demonstrate learning application