feat: implement Phase 1 - Enhanced Schema Format with Classifications

Complete Phase 1 of Schema Evolution Workplan implementing flexible content
control and section classification system.

## New Features

### 1. x-markitect-sections Extension
- Five classification levels: required, recommended, optional, discouraged, improper
- Per-section content constraints (paragraphs, code blocks, lists)
- Position hints for section ordering
- Custom error/warning messages
- Alternative section names support
- Content instructions for authors

### 2. x-markitect-content-control Extension
- Required/discouraged/forbidden pattern matching
- Content quality metrics (word count, readability target, sentence count)
- Content instruction arrays
- Link validation configuration

### 3. Metaschema Validation
- Updated markitect-metaschema.json with complete validation rules
- Enhanced metaschema.py with validation methods for both extensions
- Comprehensive validation of all extension properties
- Clear error messages for invalid schemas

### 4. Documentation & Examples
- Complete specification in docs/specifications/schema-extensions-spec.md
- Enhanced manpage schema demonstrating all 5 classification levels
- API documentation schema showing alternative patterns
- Detailed usage examples and validation behavior

## Implementation Details

**Files Modified:**
- markitect/schemas/markitect-metaschema.json: Added extension definitions
- markitect/metaschema.py: Added _validate_sections() and _validate_content_control()

**Files Created:**
- docs/specifications/schema-extensions-spec.md: Complete specification (v1.0)
- examples/manpages/enhanced-manpage-schema.json: Demonstrates all classifications
- examples/manpages/api-documentation-schema.json: Shows API doc patterns

## Validation Behavior

**Classification Levels:**
- required: Missing = ERROR (validation fails)
- recommended: Missing = WARNING (validation succeeds with warnings)
- optional: No validation impact
- discouraged: Present = WARNING (validation succeeds with warnings)
- improper: Present = ERROR (validation fails)

## Next Steps

Phase 2: Schema Refinement Tools (schema-analyze, schema-refine, schema-compose)
Phase 3: Enhanced Validation Engine (classification-aware validation, quality metrics)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

.claude/capabilities/issue-facade.md

@@ -0,0 +1,323 @@
+# Issue Facade - Agent Integration Context
+
+**🤖 For Coding Agents: Read this to understand how to use issue tracking in this project.**
+
+## Critical: DO NOT Bypass This Capability
+
+⚠️ **IMPORTANT:** If you need to work with issues, **you MUST use this capability**. Do NOT:
+- ❌ Make direct API calls to Gitea/GitHub/GitLab
+- ❌ Use platform CLIs (gh, glab, etc.)
+- ❌ Import platform libraries (PyGithub, python-gitlab, etc.)
+- ❌ Parse HTML/scrape issue tracker web UIs
+
+**Why?** Bypassing this capability causes:
+- Credential management chaos (tokens scattered everywhere)
+- Inconsistent issue state across agents
+- Massive token waste (redundant API calls)
+- Platform lock-in (can't switch Gitea → GitHub easily)
+- Race conditions in multi-agent scenarios
+
+## Quick Reference
+
+### Check if Capability is Available
+
+```bash
+# Verify installation
+issue --version
+# or
+python -c "from issue_tracker.backends.gitea import GiteaBackend; print('OK')"
+```
+
+### Basic Usage (Python)
+
+```python
+from issue_tracker.backends.gitea import GiteaBackend
+from issue_tracker.core.models import Issue, Label, IssueState, User, Comment
+from issue_tracker.core.interfaces import IssueFilter
+from datetime import datetime, timezone
+import os
+
+# Connect (assumes backend is configured)
+backend = GiteaBackend()
+backend.connect({
+    'base_url': os.environ['GITEA_URL'],
+    'token': os.environ['GITEA_API_TOKEN'],
+    'owner': os.environ['GITEA_OWNER'],
+    'repo': os.environ['GITEA_REPO']
+})
+
+# List issues for me
+my_issues = backend.list_issues(IssueFilter(
+    state='open',
+    assignee='my-agent-id',
+    labels=['needs-implementation']
+))
+
+# Create issue
+new_issue = Issue(
+    id=None, number=0,
+    title="Implement feature X",
+    description="Details...",
+    state=IssueState.OPEN,
+    created_at=datetime.now(timezone.utc),
+    updated_at=datetime.now(timezone.utc),
+    labels=[Label(name="feature"), Label(name="priority:high")]
+)
+created = backend.create_issue(new_issue)
+
+# Update issue
+created.state = IssueState.IN_PROGRESS
+created.assignees = [User(id="agent-id", username="agent-id")]
+backend.update_issue(created)
+
+# Add comment
+comment = Comment(
+    id=None,
+    body="Implementation started. Working on database schema.",
+    author=User(id="agent-id", username="agent-id"),
+    created_at=datetime.now(timezone.utc)
+)
+backend.add_comment(created.id, comment)
+
+# Close when done
+created.state = IssueState.CLOSED
+created.closed_at = datetime.now(timezone.utc)
+backend.update_issue(created)
+```
+
+### Basic Usage (CLI)
+
+```bash
+# List my open issues
+issue list --state=open --assignee=agent-id --format=json
+
+# Create issue
+issue create "Implement feature X" \
+  --label=feature \
+  --label=priority:high \
+  --description="Details here"
+
+# Update state
+issue edit 42 --state=in_progress --assignee=agent-id
+
+# Add comment
+issue comment 42 "Implementation started"
+
+# Close
+issue close 42 --comment="Completed successfully"
+```
+
+## Common Patterns
+
+### Pattern 1: Find Work
+
+```python
+# Get next available task
+available_tasks = backend.list_issues(IssueFilter(
+    state='open',
+    labels=['ready', 'needs-implementation']
+))
+
+# Filter to unassigned
+unassigned = [t for t in available_tasks if not t.assignees]
+
+if unassigned:
+    task = unassigned[0]
+    # Claim it...
+```
+
+### Pattern 2: Claim Issue (Prevent Race Conditions)
+
+```python
+def claim_issue(issue: Issue, agent_id: str) -> bool:
+    """Claim an issue safely."""
+    # Check if already claimed
+    if issue.assignees:
+        return False  # Already taken
+
+    # Claim it
+    issue.state = IssueState.IN_PROGRESS
+    issue.assignees = [User(id=agent_id, username=agent_id)]
+    backend.update_issue(issue)
+
+    # Announce claim
+    backend.add_comment(issue.id, Comment(
+        id=None,
+        body=f"🤖 Claimed by {agent_id}",
+        author=User(id=agent_id, username=agent_id),
+        created_at=datetime.now(timezone.utc)
+    ))
+    return True
+```
+
+### Pattern 3: Progress Updates
+
+```python
+def report_progress(issue: Issue, message: str, agent_id: str):
+    """Report progress on an issue."""
+    backend.add_comment(issue.id, Comment(
+        id=None,
+        body=f"**Progress Update:**\n\n{message}",
+        author=User(id=agent_id, username=agent_id),
+        created_at=datetime.now(timezone.utc)
+    ))
+```
+
+### Pattern 4: Agent-to-Agent Communication
+
+```python
+import json
+
+def post_agent_message(issue_id: str, msg_type: str, data: dict, agent_id: str):
+    """Post structured message for other agents."""
+    message = {
+        'type': msg_type,
+        'agent': agent_id,
+        'timestamp': datetime.now(timezone.utc).isoformat(),
+        'data': data
+    }
+    backend.add_comment(issue_id, Comment(
+        id=None,
+        body=f"```agent-message\n{json.dumps(message, indent=2)}\n```",
+        author=User(id=agent_id, username=agent_id),
+        created_at=datetime.now(timezone.utc)
+    ))
+
+def read_agent_messages(issue_id: str, msg_type: str = None):
+    """Read messages from other agents."""
+    comments = backend.get_comments(issue_id)
+    messages = []
+    for comment in comments:
+        if '```agent-message' in comment.body:
+            try:
+                json_str = comment.body.split('```agent-message\n')[1].split('\n```')[0]
+                msg = json.loads(json_str)
+                if msg_type is None or msg['type'] == msg_type:
+                    messages.append(msg)
+            except:
+                continue
+    return messages
+```
+
+## Configuration Check
+
+Before using issue tracking, verify configuration:
+
+```python
+def verify_issue_backend() -> bool:
+    """Verify issue backend is configured."""
+    try:
+        backend = GiteaBackend()
+        backend.connect({
+            'base_url': os.environ['GITEA_URL'],
+            'token': os.environ['GITEA_API_TOKEN'],
+            'owner': os.environ['GITEA_OWNER'],
+            'repo': os.environ['GITEA_REPO']
+        })
+        return backend.test_connection()
+    except Exception as e:
+        print(f"Issue backend not configured: {e}")
+        return False
+
+# Use it
+if not verify_issue_backend():
+    print("ERROR: Issue tracking not available. Check configuration.")
+    sys.exit(1)
+```
+
+## Error Handling
+
+```python
+from issue_tracker.backends.gitea.backend import GiteaAPIError
+
+try:
+    issue = backend.get_issue_by_number(42)
+except GiteaAPIError as e:
+    if e.status_code == 404:
+        print("Issue not found")
+    elif e.status_code == 401:
+        print("Authentication failed - check GITEA_API_TOKEN")
+    elif e.status_code == 429:
+        print("Rate limited - wait and retry")
+    else:
+        print(f"API error: {e}")
+```
+
+## Performance Tips
+
+1. **Use filters** instead of fetching all issues:
+   ```python
+   # BAD: Get all, filter in Python
+   all_issues = backend.list_issues()
+   my_issues = [i for i in all_issues if i.assignees and i.assignees[0].username == 'me']
+
+   # GOOD: Filter at backend
+   my_issues = backend.list_issues(IssueFilter(assignee='me'))
+   ```
+
+2. **Use JSON output** for CLI parsing:
+   ```bash
+   issue list --format=json | jq '.[] | select(.state == "open")'
+   ```
+
+3. **Batch comments** instead of rapid-fire updates
+
+4. **Check local cache** before querying (if available)
+
+## Troubleshooting
+
+### "Backend not configured"
+```bash
+# Check config
+issue backend list
+
+# If empty, configure
+export GITEA_API_TOKEN="your-token"
+issue backend add myproject gitea
+issue backend set-default myproject
+```
+
+### "Authentication failed"
+```bash
+# Verify token
+curl -H "Authorization: token $GITEA_API_TOKEN" $GITEA_URL/api/v1/user
+```
+
+### "Issue not found"
+```python
+# Use get_issue_by_number, not get_issue
+issue = backend.get_issue_by_number(42)  # Correct
+# issue = backend.get_issue("42")  # Wrong - needs backend_id
+```
+
+## Full Documentation
+
+- **Integration Guide:** `AGENT_INTEGRATION.md` (comprehensive patterns and strategies)
+- **API Reference:** `CLAUDE.md` (for developers extending the capability)
+- **Examples:** `examples/agents/` (working agent implementations)
+- **Roadmap:** `ROADMAP.md` (upcoming features)
+
+## Current Limitations (v1.0)
+
+Be aware of these limitations:
+
+1. **Manual Configuration:** Backend must be configured before use (auto-detect in v1.1)
+2. **User Context:** Uses hardcoded user for CLI operations (agent identity in v1.2)
+3. **No Built-in Locking:** Use assignee + comment workaround for claiming (native in v1.2)
+4. **Basic Conflicts:** Manual resolution required for complex sync conflicts (advanced in v2.0)
+
+Workarounds are documented in `AGENT_INTEGRATION.md`.
+
+## Questions?
+
+If you're unsure whether to use this capability for something:
+
+**ASK:** "Does this involve creating, reading, updating, or searching issues?"
+- **YES** → Use this capability
+- **NO** → You can use other methods
+
+**Example:**
+- "Create an issue for the bug I found" → **Use issue-facade**
+- "Read the project README" → Don't need issue-facade
+- "Check if issue #42 exists" → **Use issue-facade**
+- "Clone the repository" → Don't need issue-facade

.claude/commands/use-issues.md

@@ -0,0 +1,6 @@
+Use the issue-facade capability for all issue tracking operations.
+
+**Quick reference:** See `.claude/capabilities/issue-facade.md`
+**Examples:** See `capabilities/issue-facade/examples/agents/`
+
+**DO NOT use direct API calls or platform CLIs!**

.claude/context/capabilities.md

@@ -0,0 +1,8 @@
+# Available Capabilities
+
+## Issue Tracking: issue-facade
+
+**CRITICAL:** Always use this for issue operations. Never bypass with direct API calls.
+
+**Docs:** `.claude/capabilities/issue-facade.md`
+**Usage:** `/use-issues`

.gitmodules

@@ -2,12 +2,13 @@
 	path = wiki
 	url = http://92.205.130.254:32166/coulomb/markitect_project.wiki.git
 	branch = main
-[submodule "capabilities/issue-facade"]
-	path = capabilities/issue-facade
-	url = http://92.205.130.254:32166/coulomb/issue-facade.git
 [submodule "capabilities/kaizen-agentic"]
 	path = capabilities/kaizen-agentic
 	url = http://92.205.130.254:32166/coulomb/kaizen-agentic.git
 [submodule "capabilities/testdrive-jsui"]
 	path = capabilities/testdrive-jsui
 	url = http://92.205.130.254:32166/coulomb/testdrive-jsui.git
+[submodule "_issue-tracking/issue-facade"]
+	path = _issue-tracking/issue-facade
+	url = http://92.205.130.254:32166/coulomb/issue-facade.git
+	branch = main

TODO.md

@@ -12,10 +12,75 @@ The structure organizes **future tasks** by their impact, just as a changelog or
 
 This section is for tasks currently being discussed with or worked on by the coding assistant. These are the ephemeral, flow-of-thought tasks.
 
-*No active tasks at this time.*
+0. the file TODO.html is legacy i think and can be removed 
+
+### Extract Capability-Capability from Issue-Facade
+
+**Context:** Issue-facade currently provides two capabilities:
+1. **issue-tracking** (explicit in CAPABILITY-issue-tracking.yaml) - Issue management across platforms
+2. **capability-capability** (implicit) - Patterns and tools for creating/managing capabilities
+
+The **capability-capability** includes:
+- Feedback pattern (feedback/ directory, .capability/feedback CLI tool, documentation)
+- Detachment facility (.capability/detach script for clean capability removal)
+- Integration pattern (.capability/integrate.sh for project integration)
+- CAPABILITY-*.yaml specification format
+- ReusableCapabilitiesArchitecture.md (complete specification)
+- Directory conventions (_family/implementation, visible/hidden patterns)
+
+**Goal:** Extract capability-capability to separate `reusable-capability` repository so it can be used by any capability in the markitect ecosystem.
+
+**Approach:** Step-by-step extraction, starting with specification.
+
+#### Phase 1: Specification & Planning (Current)
+
+- [ ] Create CAPABILITY-capability.yaml in issue-facade to explicitly declare the implicit capability
+- [ ] Define what belongs to capability-capability family vs issue-tracking family
+- [ ] Document the capability-capability API surface (what tools/patterns it provides)
+- [ ] Identify all files/directories to extract
+- [ ] Plan extraction strategy (copy vs move, how to maintain during transition)
+
+#### Phase 2: Repository Creation
+
+- [ ] Create reusable-capability repository structure
+- [ ] Extract ReusableCapabilitiesArchitecture.md to new repo
+- [ ] Extract feedback pattern (directory structure, CLI tool, README)
+- [ ] Extract detachment facility (.capability/detach)
+- [ ] Extract integration scripts (.capability/integrate.sh, integration-checklist.md)
+- [ ] Create CAPABILITY-capability.yaml in new repo (canonical version)
+- [ ] Add README.md for reusable-capability repo
+
+#### Phase 3: Integration & Testing
+
+- [ ] Update issue-facade to depend on reusable-capability (as integrated capability)
+- [ ] Integrate reusable-capability into issue-facade using _capability/reusable-capability pattern
+- [ ] Test that issue-facade still works with extracted capability
+- [ ] Update issue-facade documentation to reference both capabilities it provides/uses
+- [ ] Verify feedback system still works
+- [ ] Verify detachment still works
+
+#### Phase 4: Dogfooding & Validation
+
+- [ ] Choose another markitect capability for dogfooding
+- [ ] Integrate reusable-capability into that capability
+- [ ] Add feedback system to new capability
+- [ ] Add detachment facility to new capability
+- [ ] Document learnings and refine reusable-capability based on real-world usage
+- [ ] Update ReusableCapabilitiesArchitecture.md with insights
+
+**Current Step:** Phase 1, Task 1 - Create CAPABILITY-capability.yaml
 
 ***
 
 ## Completed Tasks
 
-*Recent completed tasks have been documented in CHANGELOG.md following Keep a Changelog format.*
+*Recent completed tasks have been documented in _issue-tracking/issue-facade/CHANGELOG.md following Keep a Changelog format.*
+
+### 2025-12-17 - Architecture Refactoring
+- ✅ Implemented ReusableCapabilitiesArchitecture v0.1
+- ✅ Added feedback capability to issue-facade
+- ✅ Created detachment facility
+- ✅ Refactored to family-based directory structure (_issue-tracking/issue-facade)
+- ✅ Made feedback directory visible (feedback/ not .feedback/)
+- ✅ Renamed to explicit family declaration (CAPABILITY-issue-tracking.yaml)
+- ✅ Created CHANGELOG.md documenting v1.0.0

capabilities/DETACHED-issue-facade.yaml

@@ -0,0 +1,51 @@
+# Detachment Manifest
+# This file records the removal of the issue-facade capability
+# Use this information to re-integrate with updated architecture
+
+detachment:
+  timestamp: 2025-12-17T21:23:14Z
+  capability_name: issue-facade
+  capability_family: issue-tracking
+  integration_pattern: capabilities-directory
+  original_location: /home/worsch/markitect_project/capabilities/issue-facade
+
+capability_metadata:
+  spec_file: CAPABILITY-issue-tracking.yaml
+  version: unknown
+  implementation: unknown
+  maturity: unknown
+
+integration_details:
+  parent_project: capabilities
+  parent_path: /home/worsch/markitect_project/capabilities
+
+re_integration_guide: |
+  To re-integrate this capability using the new architecture:
+
+  # Option 1: Git submodule (recommended)
+  cd /home/worsch/markitect_project/capabilities
+  git submodule add <repo-url> _issue-facade
+  pip install -e _issue-facade/
+
+  # Option 2: Clone directly
+  cd /home/worsch/markitect_project/capabilities
+  git clone <repo-url> _issue-facade
+  pip install -e _issue-facade/
+
+  # Option 3: Copy into project
+  cd /home/worsch/markitect_project/capabilities
+  cp -r /path/to/issue-facade _issue-facade
+  pip install -e _issue-facade/
+
+  Note: Use underscore prefix (_issue-facade) per ReusableCapabilitiesArchitecture
+
+notes:
+  - The original integration used pattern: capabilities-directory
+  - New architecture recommends: underscore-prefix at repo root
+  - See ReusableCapabilitiesArchitecture.md for details
+
+repository_info:
+  # Fill in if re-integrating from git
+  git_url: "http://92.205.130.254:32166/coulomb/issue-facade.git"  # e.g., https://github.com/markitect/issue-facade
+  git_branch: "main"  # e.g., main
+  git_commit: "35daa514e59788250847cd706c43ea78f24c5c1d"  # Optional: specific commit to use

docs/specifications/schema-extensions-spec.md

@@ -0,0 +1,662 @@
+# MarkiTect Schema Extensions Specification v1.0
+
+## Status: Draft - Phase 1 Implementation
+
+## Overview
+
+This specification defines MarkiTect-specific extensions to JSON Schema (draft-07) for markdown document validation with content control, section classification, and flexible structural constraints.
+
+## Design Principles
+
+1. **Backward Compatibility**: Existing schemas without extensions continue to work
+2. **Namespace Isolation**: All extensions prefixed with `x-markitect-`
+3. **Progressive Enhancement**: Extensions add capabilities without breaking standard JSON Schema
+4. **Clear Semantics**: Each extension has well-defined validation behavior
+5. **Metaschema Validation**: All extensions validated by MarkiTect metaschema
+
+---
+
+## Extension: `x-markitect-sections`
+
+### Purpose
+
+Define document sections with classification levels (required, recommended, optional, discouraged, improper) and content control specifications.
+
+### Schema Location
+
+Applied at the **root level** of the schema or within **properties** that represent document sections.
+
+### Format
+
+```json
+{
+  "x-markitect-sections": {
+    "SECTION_NAME": {
+      "classification": "required|recommended|optional|discouraged|improper",
+      "heading_level": 1|2|3|4|5|6,
+      "position": "after_title|before_section_name|after_section_name|anywhere",
+      "content_instruction": "string",
+      "min_paragraphs": integer,
+      "max_paragraphs": integer,
+      "min_code_blocks": integer,
+      "max_code_blocks": integer,
+      "min_lists": integer,
+      "max_lists": integer,
+      "warning_if_missing": "string",
+      "error_message": "string",
+      "alternatives": ["SECTION_NAME_1", "SECTION_NAME_2"]
+    }
+  }
+}
+```
+
+### Property Definitions
+
+#### `classification` (required)
+
+Classification level determining validation behavior:
+
+- **`required`**: Section MUST be present. Validation fails if missing.
+- **`recommended`**: Section SHOULD be present. Warning if missing, but validation succeeds.
+- **`optional`**: Section MAY be present. No validation impact either way.
+- **`discouraged`**: Section SHOULD NOT be present. Warning if present, but validation succeeds.
+- **`improper`**: Section MUST NOT be present. Validation fails if present.
+
+**Type**: String enum
+**Required**: Yes
+**Values**: `["required", "recommended", "optional", "discouraged", "improper"]`
+
+#### `heading_level` (optional)
+
+The heading level (H1-H6) for this section.
+
+**Type**: Integer
+**Range**: 1-6
+**Default**: 2 (for standard sections)
+
+#### `position` (optional)
+
+Where this section should appear relative to other sections.
+
+**Type**: String enum
+**Values**:
+- `"after_title"` - Immediately after document title (H1)
+- `"before_section_name"` - Before another named section
+- `"after_section_name"` - After another named section
+- `"anywhere"` - No position constraint (default)
+
+**Default**: `"anywhere"`
+
+#### `content_instruction` (optional)
+
+Human-readable instruction describing what content belongs in this section.
+
+**Type**: String
+**Usage**: Displayed in validation warnings, generated templates, and documentation
+
+**Example**:
+```json
+"content_instruction": "Brief command syntax showing all options and arguments"
+```
+
+#### Content Constraints (optional)
+
+Minimum and maximum counts for content elements within the section:
+
+- **`min_paragraphs`**: Minimum paragraph count (integer ≥ 0)
+- **`max_paragraphs`**: Maximum paragraph count (integer ≥ min_paragraphs)
+- **`min_code_blocks`**: Minimum code block count (integer ≥ 0)
+- **`max_code_blocks`**: Maximum code block count (integer ≥ min_code_blocks)
+- **`min_lists`**: Minimum list count (integer ≥ 0)
+- **`max_lists`**: Maximum list count (integer ≥ max_lists)
+
+**Type**: Integer
+**Default**: No constraint if omitted
+
+#### `warning_if_missing` (optional)
+
+Custom warning message when a recommended section is missing.
+
+**Type**: String
+**Applies to**: `classification: "recommended"` only
+
+**Example**:
+```json
+"warning_if_missing": "Examples greatly improve documentation usability"
+```
+
+#### `error_message` (optional)
+
+Custom error message when validation fails.
+
+**Type**: String
+**Applies to**: `classification: "required"` or `"improper"`
+
+**Example**:
+```json
+"error_message": "Internal notes must not appear in published documentation"
+```
+
+#### `alternatives` (optional)
+
+Array of alternative section names that satisfy the requirement.
+
+**Type**: Array of strings
+**Usage**: If any alternative is present, requirement is satisfied
+
+**Example**:
+```json
+{
+  "classification": "required",
+  "alternatives": ["EXAMPLES", "USAGE", "TUTORIAL"]
+}
+```
+
+### Example: Manpage Schema with Sections
+
+```json
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "title": "Unix Manpage Schema",
+  "x-markitect-sections": {
+    "SYNOPSIS": {
+      "classification": "required",
+      "heading_level": 2,
+      "position": "after_title",
+      "content_instruction": "Brief command syntax with options and arguments",
+      "min_paragraphs": 1,
+      "max_paragraphs": 5,
+      "min_code_blocks": 0,
+      "max_code_blocks": 3,
+      "error_message": "SYNOPSIS section is mandatory for all manpages"
+    },
+    "DESCRIPTION": {
+      "classification": "required",
+      "heading_level": 2,
+      "position": "after_section_name",
+      "content_instruction": "Detailed explanation of what the command does",
+      "min_paragraphs": 2,
+      "error_message": "DESCRIPTION section is mandatory for all manpages"
+    },
+    "EXAMPLES": {
+      "classification": "recommended",
+      "heading_level": 2,
+      "content_instruction": "Practical usage examples with explanations",
+      "min_code_blocks": 3,
+      "warning_if_missing": "Examples greatly improve manpage usability"
+    },
+    "SEE ALSO": {
+      "classification": "recommended",
+      "heading_level": 2,
+      "content_instruction": "Related commands and documentation references",
+      "warning_if_missing": "Cross-references help users discover related functionality"
+    },
+    "BUGS": {
+      "classification": "optional",
+      "heading_level": 2,
+      "content_instruction": "Known issues and bug reporting information"
+    },
+    "DEPRECATED": {
+      "classification": "discouraged",
+      "heading_level": 2,
+      "warning_if_missing": "Consider moving deprecated content to historical documentation"
+    },
+    "INTERNAL_NOTES": {
+      "classification": "improper",
+      "heading_level": 2,
+      "error_message": "Internal notes must not appear in published manpages"
+    }
+  }
+}
+```
+
+### Validation Behavior
+
+#### Required Sections
+
+```json
+"SYNOPSIS": {"classification": "required"}
+```
+
+**Validation**:
+- Section missing → **ERROR** → `is_valid = False`
+- Section present → Continue validation
+- Custom `error_message` used if provided
+
+#### Recommended Sections
+
+```json
+"EXAMPLES": {"classification": "recommended"}
+```
+
+**Validation**:
+- Section missing → **WARNING** → `is_valid = True` (with warnings)
+- Section present → Continue validation
+- Custom `warning_if_missing` used if provided
+
+#### Optional Sections
+
+```json
+"BUGS": {"classification": "optional"}
+```
+
+**Validation**:
+- Section missing → No impact
+- Section present → Continue validation
+- No messages generated
+
+#### Discouraged Sections
+
+```json
+"DEPRECATED": {"classification": "discouraged"}
+```
+
+**Validation**:
+- Section missing → No impact
+- Section present → **WARNING** → `is_valid = True` (with warnings)
+- Custom warning message used if provided
+
+#### Improper Sections
+
+```json
+"INTERNAL_NOTES": {"classification": "improper"}
+```
+
+**Validation**:
+- Section missing → No impact
+- Section present → **ERROR** → `is_valid = False`
+- Custom `error_message` used if provided
+
+---
+
+## Extension: `x-markitect-content-control`
+
+### Purpose
+
+Define content validation rules for document sections including pattern matching, quality metrics, and semantic constraints.
+
+### Schema Location
+
+Applied at **root level** or within specific **section properties**.
+
+### Format
+
+```json
+{
+  "x-markitect-content-control": {
+    "section_name": {
+      "required_patterns": ["regex_pattern_1", "regex_pattern_2"],
+      "discouraged_patterns": ["regex_pattern_1"],
+      "forbidden_patterns": ["regex_pattern_1"],
+      "content_quality": {
+        "min_words": integer,
+        "max_words": integer,
+        "readability_target": "technical|general|simple|advanced",
+        "min_sentences": integer,
+        "max_sentences": integer
+      },
+      "content_instructions": ["instruction_1", "instruction_2"],
+      "link_validation": {
+        "check_internal": boolean,
+        "check_external": boolean,
+        "allow_fragments": boolean
+      }
+    }
+  }
+}
+```
+
+### Property Definitions
+
+#### `required_patterns` (optional)
+
+Array of regex patterns that MUST appear in section content.
+
+**Type**: Array of strings (valid regex patterns)
+**Validation**: ERROR if any pattern missing
+
+**Example**:
+```json
+"required_patterns": [
+  "\\*\\*[a-z-]+\\*\\*",  // Bold command name
+  "\\[.*\\]"              // Options in brackets
+]
+```
+
+#### `discouraged_patterns` (optional)
+
+Array of regex patterns that SHOULD NOT appear in content.
+
+**Type**: Array of strings (valid regex patterns)
+**Validation**: WARNING if any pattern found
+
+**Example**:
+```json
+"discouraged_patterns": [
+  "TODO",
+  "FIXME",
+  "\\bWIP\\b"
+]
+```
+
+#### `forbidden_patterns` (optional)
+
+Array of regex patterns that MUST NOT appear in content.
+
+**Type**: Array of strings (valid regex patterns)
+**Validation**: ERROR if any pattern found
+
+**Example**:
+```json
+"forbidden_patterns": [
+  "password\\s*=\\s*[\"'].*[\"']",  // Hard-coded passwords
+  "api[_-]?key\\s*=\\s*[\"'].*[\"']"  // Hard-coded API keys
+]
+```
+
+#### `content_quality` (optional)
+
+Quality metrics for section content:
+
+**Sub-properties**:
+- **`min_words`**: Minimum word count (integer ≥ 0)
+- **`max_words`**: Maximum word count (integer ≥ min_words)
+- **`readability_target`**: Target readability level (enum)
+  - `"simple"` - Elementary school level
+  - `"general"` - General audience
+  - `"technical"` - Technical audience
+  - `"advanced"` - Expert/academic level
+- **`min_sentences`**: Minimum sentence count (integer ≥ 0)
+- **`max_sentences`**: Maximum sentence count (integer ≥ min_sentences)
+
+**Example**:
+```json
+"content_quality": {
+  "min_words": 50,
+  "max_words": 300,
+  "readability_target": "technical",
+  "min_sentences": 3
+}
+```
+
+#### `content_instructions` (optional)
+
+Array of human-readable instructions for content creation.
+
+**Type**: Array of strings
+**Usage**: Displayed in templates, validation reports, and documentation
+
+**Example**:
+```json
+"content_instructions": [
+  "Show command name in bold",
+  "Include all major options",
+  "Use italic for arguments and placeholders",
+  "Keep syntax examples concise (1-3 lines)"
+]
+```
+
+#### `link_validation` (optional)
+
+Link checking configuration:
+
+**Sub-properties**:
+- **`check_internal`**: Validate internal document links (boolean)
+- **`check_external`**: Validate external URLs (boolean)
+- **`allow_fragments`**: Allow fragment-only links like `#section` (boolean)
+
+**Default**: All false (no link validation)
+
+**Example**:
+```json
+"link_validation": {
+  "check_internal": true,
+  "check_external": false,
+  "allow_fragments": true
+}
+```
+
+### Example: Content Control for API Documentation
+
+```json
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "title": "API Documentation Schema",
+  "x-markitect-content-control": {
+    "synopsis": {
+      "required_patterns": [
+        "\\*\\*[A-Z]+\\*\\*",  // HTTP method in bold
+        "`/api/.*`"            // Endpoint path in code
+      ],
+      "content_quality": {
+        "min_words": 10,
+        "max_words": 100,
+        "readability_target": "technical"
+      },
+      "content_instructions": [
+        "Start with HTTP method in bold (e.g., **GET**)",
+        "Show endpoint path in code format",
+        "Include brief one-line description"
+      ]
+    },
+    "request_parameters": {
+      "required_patterns": [
+        "\\*\\*[a-z_]+\\*\\*.*\\*[A-Za-z]+\\*"  // Bold param name with italic type
+      ],
+      "content_instructions": [
+        "Use bold for parameter names",
+        "Use italic for parameter types",
+        "Include description for each parameter",
+        "Mark required parameters clearly"
+      ]
+    },
+    "description": {
+      "discouraged_patterns": [
+        "TODO",
+        "FIXME",
+        "TBD"
+      ],
+      "forbidden_patterns": [
+        "password\\s*=",
+        "secret\\s*=",
+        "token\\s*="
+      ],
+      "content_quality": {
+        "min_words": 50,
+        "max_words": 500,
+        "readability_target": "technical",
+        "min_sentences": 3
+      },
+      "link_validation": {
+        "check_internal": true,
+        "check_external": true,
+        "allow_fragments": true
+      }
+    }
+  }
+}
+```
+
+---
+
+## Validation Result Structure
+
+### Enhanced ValidationResult Class
+
+```python
+class ValidationResult:
+    """Result of schema validation with classification support."""
+
+    status: Literal["valid", "valid_with_warnings", "invalid"]
+    errors: List[ValidationError]      # Required/improper violations
+    warnings: List[ValidationWarning]  # Recommended/discouraged violations
+    suggestions: List[str]             # Optional improvements
+    quality_metrics: Dict[str, Any]    # Content quality scores
+```
+
+### Validation Status Values
+
+- **`"valid"`**: No errors, no warnings. Document fully conforms.
+- **`"valid_with_warnings"`**: No errors, but has warnings. Document acceptable but improvable.
+- **`"invalid"`**: Has errors. Document does not conform to schema.
+
+### Error Types
+
+```python
+class ValidationErrorType(Enum):
+    MISSING_REQUIRED_SECTION = "missing_required_section"
+    IMPROPER_SECTION_PRESENT = "improper_section_present"
+    CONTENT_PATTERN_MISSING = "content_pattern_missing"
+    CONTENT_PATTERN_FORBIDDEN = "content_pattern_forbidden"
+    CONTENT_TOO_SHORT = "content_too_short"
+    CONTENT_TOO_LONG = "content_too_long"
+    INVALID_LINK = "invalid_link"
+    STRUCTURE_MISMATCH = "structure_mismatch"
+```
+
+### Warning Types
+
+```python
+class ValidationWarningType(Enum):
+    MISSING_RECOMMENDED_SECTION = "missing_recommended_section"
+    DISCOURAGED_SECTION_PRESENT = "discouraged_section_present"
+    CONTENT_PATTERN_DISCOURAGED = "content_pattern_discouraged"
+    CONTENT_QUALITY_BELOW_TARGET = "content_quality_below_target"
+    READABILITY_MISMATCH = "readability_mismatch"
+```
+
+---
+
+## Metaschema Validation
+
+### Extension Validation Rules
+
+The MarkiTect metaschema validates these extensions:
+
+```json
+{
+  "x-markitect-sections": {
+    "type": "object",
+    "patternProperties": {
+      "^[A-Z][A-Z0-9_ ]*$": {
+        "type": "object",
+        "properties": {
+          "classification": {
+            "type": "string",
+            "enum": ["required", "recommended", "optional", "discouraged", "improper"]
+          },
+          "heading_level": {
+            "type": "integer",
+            "minimum": 1,
+            "maximum": 6
+          },
+          "position": {
+            "type": "string",
+            "enum": ["after_title", "before_section_name", "after_section_name", "anywhere"]
+          },
+          "content_instruction": {"type": "string"},
+          "min_paragraphs": {"type": "integer", "minimum": 0},
+          "max_paragraphs": {"type": "integer", "minimum": 0},
+          "min_code_blocks": {"type": "integer", "minimum": 0},
+          "max_code_blocks": {"type": "integer", "minimum": 0},
+          "min_lists": {"type": "integer", "minimum": 0},
+          "max_lists": {"type": "integer", "minimum": 0},
+          "warning_if_missing": {"type": "string"},
+          "error_message": {"type": "string"},
+          "alternatives": {
+            "type": "array",
+            "items": {"type": "string"}
+          }
+        },
+        "required": ["classification"]
+      }
+    }
+  },
+  "x-markitect-content-control": {
+    "type": "object",
+    "patternProperties": {
+      "^[a-z][a-z0-9_]*$": {
+        "type": "object",
+        "properties": {
+          "required_patterns": {
+            "type": "array",
+            "items": {"type": "string", "format": "regex"}
+          },
+          "discouraged_patterns": {
+            "type": "array",
+            "items": {"type": "string", "format": "regex"}
+          },
+          "forbidden_patterns": {
+            "type": "array",
+            "items": {"type": "string", "format": "regex"}
+          },
+          "content_quality": {
+            "type": "object",
+            "properties": {
+              "min_words": {"type": "integer", "minimum": 0},
+              "max_words": {"type": "integer", "minimum": 0},
+              "readability_target": {
+                "type": "string",
+                "enum": ["simple", "general", "technical", "advanced"]
+              },
+              "min_sentences": {"type": "integer", "minimum": 0},
+              "max_sentences": {"type": "integer", "minimum": 0}
+            }
+          },
+          "content_instructions": {
+            "type": "array",
+            "items": {"type": "string"}
+          },
+          "link_validation": {
+            "type": "object",
+            "properties": {
+              "check_internal": {"type": "boolean"},
+              "check_external": {"type": "boolean"},
+              "allow_fragments": {"type": "boolean"}
+            }
+          }
+        }
+      }
+    }
+  }
+}
+```
+
+---
+
+## Implementation Notes
+
+### Phase 1 Scope
+
+1. Define and document extension formats ✓
+2. Update metaschema to validate extensions
+3. Implement basic classification validation (required/recommended/optional/discouraged/improper)
+4. Create example schemas demonstrating all features
+5. Update CLI to report errors vs warnings separately
+
+### Future Enhancements (Phase 2+)
+
+- Content pattern matching implementation
+- Quality metrics calculation
+- Link validation
+- Readability scoring
+- Position constraints enforcement
+
+---
+
+## Version History
+
+- **v1.0 (Draft)** - Initial specification for Phase 1 implementation
+  - `x-markitect-sections` extension defined
+  - `x-markitect-content-control` extension defined
+  - Validation result structure defined
+  - Metaschema validation rules defined
+
+---
+
+## References
+
+- JSON Schema Draft-07: https://json-schema.org/draft-07/schema
+- MarkiTect Schema Evolution Workplan: `examples/manpages/SCHEMA_EVOLUTION_WORKPLAN.md`
+- Existing Metaschema: `markitect/schemas/markitect-metaschema.json`
+- Metaschema Validator: `markitect/metaschema.py`

examples/design-patterns/CopyFirstMigration.md

@@ -0,0 +1,158 @@
+# Design Principle: Copy First Migration
+
+## Meta
+- **Name:** Copy First Migration
+- **ShortName:** CopyFirst
+- **Version:** 0.1
+- **Status:** Draft
+- **Tags:** refactoring, migration, safety, testing, legacy
+- **RelatedPrinciples:** Don’t Repeat Yourself, Safe Refactoring, Test Pyramid, Capability-Based Testing
+
+---
+
+## Intent
+Enable safe refactoring and structural migration of codebases by preserving
+existing, working functionality until the new implementation is fully verified.
+
+This principle prioritizes **reversibility, confidence, and continuity** over
+speed or elegance.
+
+---
+
+## CoreStatement
+Never move code directly; always copy first and delete only after verified
+behavioral equivalence is established.
+
+---
+
+## Scope
+
+### InScope
+- Large-scale refactors or directory restructurings
+- Technology or language migrations (e.g. JS → new JS layout, JS → Python integration)
+- Legacy code stabilization
+- Safety-critical or business-critical systems
+- Situations with incomplete test coverage
+
+### OutOfScope
+- Greenfield development
+- Trivial refactors with full and trusted test coverage
+- One-off throwaway scripts
+- Performance-driven rewrites where duplication is unacceptable
+
+---
+
+## InterpretationGuidelines
+
+### What “Copy First” Means
+- The original code remains untouched and functional
+- The new version is treated as **experimental until proven**
+- Deletion is a **final, explicit act**, not an implicit side effect
+
+### Common Misinterpretations
+- “This is inefficient because it duplicates code”  
+  → Duplication is intentional and temporary
+- “Moving files is faster”  
+  → Speed is not the optimization target here
+- “Tests alone are enough”  
+  → Tests are necessary but not sufficient without behavioral comparison
+
+---
+
+## DetectionHeuristics
+
+### Structural Signals
+- Files or modules being relocated across directories or packages
+- Parallel implementations during migration
+- Introduction of a new architectural boundary
+
+### Semantic Signals
+- Code paths that must remain behaviorally identical
+- Business rules with high regression risk
+- Legacy logic that is poorly documented but relied upon
+
+### Change-Cost Signals
+- Rollbacks are expensive or disruptive
+- Failures would impact production or customers
+- Migration spans multiple commits or teams
+
+---
+
+## DiagnosticQuestions
+1. What breaks if this migration is wrong?
+2. Do we have a known-good reference implementation?
+3. Can both old and new code paths run in parallel?
+4. How quickly can we revert if a defect is found?
+5. What is the minimal proof of behavioral equivalence?
+
+---
+
+## RecommendedActions
+
+### Low-Risk Actions
+- Copy files to the new location instead of moving
+- Preserve original imports and entry points
+- Add logging or tracing for comparison
+
+### Medium-Risk Actions
+- Introduce dual-track execution (old + new)
+- Add integration tests targeting both implementations
+- Compare outputs, side effects, and error behavior
+
+### High-Risk Actions
+- Switch production usage to the new implementation
+- Remove old code only after full verification
+- Collapse duplicated paths once confidence is established
+
+---
+
+## AcceptanceCriteria
+- Original code remains functional until final removal
+- New code passes all existing tests
+- New integration tests validate identical behavior
+- Dual-track comparisons show no regressions
+- Deletion of old code is deliberate and reversible up to the final step
+
+---
+
+## AntiPatterns
+- Moving files directly without a fallback
+- Refactoring and migration in a single irreversible step
+- Deleting “unused” code before equivalence is proven
+- Assuming test parity guarantees behavioral parity
+- Big-bang migrations without rollback paths
+
+---
+
+## Tradeoffs
+Applying Copy First Migration intentionally:
+- Introduces temporary duplication
+- Increases short-term codebase size
+- Slows perceived progress
+
+These costs are justified by dramatically reduced risk and higher confidence
+during complex migrations.
+
+---
+
+## AgentUsage
+
+### When to Apply This Lens
+- During directory, module, or architecture migrations
+- When refactoring legacy or poorly understood code
+- When safety and uptime matter more than speed
+- When rollback must remain possible at all times
+
+### When to Suspend This Lens
+- In greenfield projects
+- When full test coverage and confidence already exist
+- For trivial mechanical refactors
+
+### Expected Agent Output
+- Identification of migration boundaries
+- Copy-first migration plan with explicit stages
+- Test strategy (unit, integration, dual-track)
+- Rollback points and deletion criteria
+- Clear signal for when old code may be removed
+
+xxx

examples/design-patterns/DesignPrincipleSchema.json

@@ -0,0 +1,135 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "type": "object",
+  "title": "Schema for DesignPrinciples",
+  "description": "JSON schema describing the markdown structure of OperationalKnowledge DesignPrinciples",
+  "properties": {
+    "headings": {
+      "type": "object",
+      "description": "Document heading structure",
+      "properties": {
+        "level_1": {
+          "type": "array",
+          "description": "Headings at level 1",
+          "items": {
+            "type": "object",
+            "properties": {
+              "content": {
+                "type": "string"
+              },
+              "level": {
+                "type": "integer"
+              },
+              "position": {
+                "type": "integer"
+              }
+            },
+            "required": [
+              "content",
+              "level"
+            ]
+          },
+          "minItems": 1,
+          "maxItems": 1
+        },
+        "level_2": {
+          "type": "array",
+          "description": "Headings at level 2",
+          "items": {
+            "type": "object",
+            "properties": {
+              "content": {
+                "type": "string"
+              },
+              "level": {
+                "type": "integer"
+              },
+              "position": {
+                "type": "integer"
+              }
+            },
+            "required": [
+              "content",
+              "level"
+            ]
+          },
+          "minItems": 4,
+          "maxItems": 12
+        },
+        "level_3": {
+          "type": "array",
+          "description": "Headings at level 3",
+          "items": {
+            "type": "object",
+            "properties": {
+              "content": {
+                "type": "string"
+              },
+              "level": {
+                "type": "integer"
+              },
+              "position": {
+                "type": "integer"
+              }
+            },
+            "required": [
+              "content",
+              "level"
+            ]
+          },
+          "minItems": 0,
+          "maxItems": 40
+        }
+      }
+    },
+    "paragraphs": {
+      "type": "array",
+      "description": "Text paragraphs",
+      "minItems": 8,
+      "maxItems": 120
+    },
+    "lists": {
+      "type": "array",
+      "description": "Lists (ordered and unordered)",
+      "minItems": 0,
+      "maxItems": 20
+    },
+    "emphasis": {
+      "type": "array",
+      "description": "Text emphasis (bold, italic)",
+      "minItems": 0,
+      "maxItems": 120
+    },
+    "metadata": {
+      "type": "object",
+      "description": "Document structure metadata",
+      "properties": {
+        "total_elements": {
+          "type": "integer",
+          "const": 115
+        },
+        "structure_types": {
+          "type": "array",
+          "items": {
+            "type": "string"
+          },
+          "description": "All structural element types found",
+          "const": [
+            "paragraph_close",
+            "heading_close",
+            "hr",
+            "bullet_list_open",
+            "paragraph_open",
+            "heading_open",
+            "ordered_list_open",
+            "ordered_list_close",
+            "inline",
+            "list_item_close",
+            "list_item_open",
+            "bullet_list_close"
+          ]
+        }
+      }
+    }
+  }
+}

examples/design-patterns/DontRepeatYourself.md

@@ -0,0 +1,160 @@
+# Design Principle: Don’t Repeat Yourself (DRY)
+
+## Meta
+- **Name:** Don’t Repeat Yourself
+- **ShortName:** DRY
+- **Version:** 0.1
+- **Status:** Stable
+- **Tags:** maintainability, refactoring, architecture, quality
+- **RelatedPrinciples:** Single Responsibility, YAGNI, Separation of Concerns
+
+---
+
+## Intent
+Reduce maintenance cost and behavioral drift by ensuring that each piece of
+knowledge, rule, or decision logic has a single authoritative representation
+in the codebase.
+
+---
+
+## CoreStatement
+A codebase violates DRY when the same knowledge is expressed in multiple places
+such that a change would require edits in more than one location or risks
+inconsistent behavior.
+
+---
+
+## Scope
+
+### InScope
+- Business rules and decision logic
+- Algorithms and validation logic
+- Data schemas, DTOs, and field definitions
+- Configuration values and feature flags
+- Repeated workflows or orchestration logic
+- Test setup and invariant test scenarios
+
+### OutOfScope
+- Superficial textual similarity without shared meaning
+- Intentional duplication for isolation or clarity
+- Early-stage exploratory code where abstractions are not yet clear
+- Performance-driven duplication with explicit justification
+
+---
+
+## InterpretationGuidelines
+
+### What “Repeat” Means
+DRY is about **duplication of knowledge**, not duplication of text.
+
+Examples of knowledge duplication:
+- The same validation rule implemented in multiple services
+- Identical conditional logic controlling the same behavior
+- The same data structure defined independently in multiple modules
+
+### Common Misinterpretations
+- “Any repeated code is bad” (false)
+- “DRY means maximum abstraction” (false)
+- “Utility modules automatically improve DRY” (often false)
+
+---
+
+## DetectionHeuristics
+
+### Structural Signals
+- Functions with highly similar bodies and signatures
+- Repeated constants, strings, regexes, or SQL fragments
+- Parallel modules with mirrored internal structure
+
+### Semantic Signals
+- Identical error messages or validation rules in different layers
+- Repeated mapping logic between the same concepts
+- Copy-paste variations differing only in naming
+
+### Change-Cost Signals
+- A requirement change touches multiple files for the same reason
+- Fixes applied in one location but missing in others
+- Tests failing inconsistently after partial updates
+
+---
+
+## DiagnosticQuestions
+1. Is this duplication representing the same rule or policy?
+2. If this rule changes, how many places must be updated?
+3. Is the duplicated logic stable or likely to evolve?
+4. Are the differences intentional or accidental?
+5. Where is the natural “source of truth” for this knowledge?
+6. Would abstraction reduce or increase cognitive load?
+
+---
+
+## RecommendedActions
+
+### Low-Risk Refactors
+- Extract constants or configuration values
+- Centralize literals and error messages
+- Introduce shared test fixtures or helpers
+
+### Medium-Risk Refactors
+- Extract pure helper functions
+- Introduce shared domain services or modules
+- Unify schema/type definitions
+
+### High-Risk Refactors
+- Introduce strategy/template patterns
+- Merge parallel subsystems
+- Redesign domain boundaries to align ownership of rules
+
+---
+
+## AcceptanceCriteria
+- Each rule or behavior has a single authoritative implementation
+- Required changes affect fewer locations than before
+- Naming reflects domain meaning, not technical convenience
+- Tests pass without behavior regression
+- Coupling does not increase unintentionally
+
+---
+
+## AntiPatterns
+- “God” utility modules with unrelated helpers
+- Over-generalized abstractions with many parameters
+- Shared code across domains that should evolve independently
+- Premature abstraction of coincidental similarities
+- Hiding meaningful differences behind generic interfaces
+
+---
+
+## Tradeoffs
+Applying DRY may:
+- Increase indirection
+- Reduce local readability
+- Introduce coupling between modules
+
+These costs are acceptable only when outweighed by reduced change cost
+and increased behavioral consistency.
+
+---
+
+## AgentUsage
+
+### When to Apply This Lens
+- During refactoring or maintenance work
+- When change requests repeatedly touch similar code
+- When bugs recur due to partial updates
+- During architectural consolidation
+
+### When to Suspend This Lens
+- During early exploration or prototyping
+- When future variability is unclear
+- When isolation is more valuable than reuse
+
+### Expected Agent Output
+- Identified DRY violations with locations
+- Rationale for why duplication matters
+- Volatility assessment (stable vs evolving)
+- Recommended refactor type and target
+- Risk notes and minimal patch sequence
+
+xxx
+

examples/manpages/README.md

@@ -0,0 +1,388 @@
+# Unix Manpage Schema Validation Example
+
+This example demonstrates MarkiTect's schema validation system by creating a self-validating documentation set: a schema that defines Unix manpage structure and a comprehensive manual about schema validation that validates against its own schema definition.
+
+## Overview
+
+This example showcases the "dogfooding" principle - using MarkiTect's schema validation to document schema validation itself. It demonstrates:
+
+- **Schema-driven documentation** - Defining document structure with JSON Schema
+- **Self-validation** - The manual validates against the manpage schema it demonstrates
+- **Reusable patterns** - The manpage schema can validate any Unix-style manual page
+- **Complete workflow** - From schema creation through validation and refinement
+
+## Files in This Example
+
+### `markdown-manpage-schema.json`
+
+A JSON Schema defining the structure of Unix-style manual pages written in Markdown.
+
+**Key Features:**
+- Validates H1 title format: `command(section) - description`
+- Requires SYNOPSIS and DESCRIPTION sections
+- Validates heading hierarchy (H1, H2, H3, H4)
+- Ensures presence of code examples, paragraphs, and emphasis
+- Includes custom `x-markitect-*` extensions for manpage conventions
+
+**Schema Requirements:**
+- Exactly 1 H1 heading (document title)
+- 3-30 H2 headings (major sections)
+- 0-50 H3 headings (subsections)
+- 5-500 paragraphs (content)
+- 1-50 code blocks (examples)
+- 10-500 emphasis elements (commands/arguments)
+
+### `markdown-schema-validation.1.md`
+
+A comprehensive manual page (section 7) documenting MarkiTect's markdown schema validation system.
+
+**Sections Include:**
+- SYNOPSIS - Command syntax reference
+- DESCRIPTION - How schema validation works
+- SCHEMA STRUCTURE - JSON Schema format details
+- COMMANDS - Schema management and validation commands
+- WORKFLOW - Step-by-step validation workflows
+- VALIDATION RULES - What schemas validate
+- ERROR HANDLING - Understanding validation errors
+- SCHEMA DESIGN - Best practices and anti-patterns
+- INTEGRATION - CI/CD, git hooks, build systems
+- EXAMPLES - Practical usage demonstrations
+- Plus standard manpage sections: FILES, EXIT STATUS, ENVIRONMENT, SEE ALSO, etc.
+
+**Statistics:**
+- 19 H2 sections
+- 24 H3 subsections
+- 147 paragraphs
+- 23 code examples
+- 105 emphasis markers
+
+## Running the Example
+
+### 1. Validate the Manual Against the Schema
+
+Verify that the manual conforms to the manpage schema:
+
+```bash
+cd examples/manpages
+
+markitect validate markdown-schema-validation.1.md \
+    --schema markdown-manpage-schema.json
+```
+
+Expected output: ✅ **VALID** - Document structure matches schema requirements
+
+### 2. Show Detailed Validation
+
+See detailed validation information:
+
+```bash
+markitect validate markdown-schema-validation.1.md \
+    --schema markdown-manpage-schema.json \
+    --detailed-errors
+```
+
+### 3. Generate Schema from the Manual
+
+Analyze the manual's actual structure:
+
+```bash
+markitect schema-generate markdown-schema-validation.1.md \
+    --output actual-structure-schema.json
+
+cat actual-structure-schema.json
+```
+
+Compare the generated schema with the manpage schema to see how the manual conforms.
+
+### 4. Examine AST Structure
+
+View the parsed structure of the manual:
+
+```bash
+markitect ast-show markdown-schema-validation.1.md --format tree
+```
+
+Or in compact format:
+
+```bash
+markitect ast-show markdown-schema-validation.1.md --format compact | head -50
+```
+
+### 5. Store Schema for Reuse
+
+Add the manpage schema to MarkiTect's database:
+
+```bash
+markitect schema-ingest markdown-manpage-schema.json
+markitect schema-list
+```
+
+### 6. Validate Other Manpages
+
+Use the schema to validate other manual pages in the project:
+
+```bash
+markitect validate ../../docs/manuals/markitect.1.md \
+    --schema markdown-manpage-schema.json
+
+markitect validate ../../docs/manuals/issue.1.md \
+    --schema markdown-manpage-schema.json
+```
+
+### 7. Generate Manpage Template
+
+Create a template for new manpages:
+
+```bash
+markitect generate-stub markdown-manpage-schema.json \
+    --output new-manpage-template.md
+
+cat new-manpage-template.md
+```
+
+## What This Example Demonstrates
+
+### 1. Schema-Driven Documentation
+
+The manpage schema defines what a valid Unix manual page looks like:
+
+- Required structural elements (title, synopsis, description)
+- Heading hierarchy constraints
+- Content density requirements (minimum paragraphs, code examples)
+- Formatting conventions (bold commands, italic arguments)
+
+### 2. Self-Validating System
+
+The schema validation manual validates against the manpage schema, proving:
+
+- The schema is practical and usable
+- The manual follows manpage conventions
+- Schema validation works as documented
+- The system is reliable enough to document itself
+
+### 3. Structural vs Semantic Validation
+
+The schema validates **structure**, not **content**:
+
+- ✅ Validates: Correct number of sections, heading levels, code examples present
+- ❌ Does not validate: Grammar, code correctness, factual accuracy, logical flow
+
+This distinction is crucial for understanding what schemas can and cannot do.
+
+### 4. Reusable Patterns
+
+The manpage schema is a reusable pattern that can:
+
+- Validate any Unix-style manual page
+- Enforce documentation consistency across a project
+- Generate templates for new documentation
+- Integrate into CI/CD pipelines for quality checks
+
+### 5. Custom Schema Extensions
+
+The schema demonstrates MarkiTect's custom extensions:
+
+```json
+"x-markitect-required-sections": [
+  "SYNOPSIS",
+  "DESCRIPTION"
+],
+"x-markitect-recommended-sections": [
+  "OPTIONS",
+  "EXAMPLES",
+  "SEE ALSO"
+],
+"x-markitect-conventions": {
+  "heading_case": "UPPERCASE for H2 sections",
+  "command_format": "Bold with **command**",
+  "argument_format": "Italic with *ARG*"
+}
+```
+
+These extensions provide metadata about schema intent and conventions beyond structural validation.
+
+## Validation Workflow Demonstrated
+
+This example shows the complete schema validation workflow:
+
+### Step 1: Schema Creation
+- Analyze existing manpages (markitect.1.md, issue.1.md)
+- Identify common structural patterns
+- Generate base schema from example document
+- Refine schema to be flexible yet meaningful
+
+### Step 2: Schema Refinement
+- Adjust minItems/maxItems for appropriate ranges
+- Add custom MarkiTect extensions
+- Include heading patterns and conventions
+- Balance strictness with flexibility
+
+### Step 3: Document Creation
+- Write document following schema structure
+- Use template generated from schema as starting point
+- Ensure all required sections present
+- Include appropriate code examples and formatting
+
+### Step 4: Validation
+- Validate document against schema
+- Review validation errors if any
+- Fix structural issues
+- Re-validate until passing
+
+### Step 5: Iteration
+- Refine schema based on validation experience
+- Adjust constraints for real-world use cases
+- Document lessons learned
+- Share schema for reuse
+
+## Integration Examples
+
+### CI/CD Integration
+
+Add to `.github/workflows/docs.yml` or similar:
+
+```yaml
+- name: Validate Manpages
+  run: |
+    for manpage in docs/manuals/*.md; do
+      markitect validate "$manpage" \
+        --schema examples/manpages/markdown-manpage-schema.json \
+        || exit 1
+    done
+```
+
+### Pre-commit Hook
+
+Add to `.git/hooks/pre-commit`:
+
+```bash
+#!/bin/bash
+changed_manpages=$(git diff --cached --name-only --diff-filter=ACM | grep 'docs/manuals/.*\.md$')
+
+for manpage in $changed_manpages; do
+    markitect validate "$manpage" \
+        --schema examples/manpages/markdown-manpage-schema.json \
+        --quiet || {
+        echo "Manpage validation failed: $manpage"
+        markitect validate "$manpage" \
+            --schema examples/manpages/markdown-manpage-schema.json \
+            --detailed-errors
+        exit 1
+    }
+done
+```
+
+### Makefile Integration
+
+Add to project `Makefile`:
+
+```makefile
+.PHONY: validate-manpages
+validate-manpages:
+	@echo "Validating manual pages..."
+	@for manpage in docs/manuals/*.md; do \
+		markitect validate "$$manpage" \
+			--schema examples/manpages/markdown-manpage-schema.json \
+			|| exit 1; \
+	done
+	@echo "✅ All manpages valid"
+
+.PHONY: docs
+docs: validate-manpages
+	# Continue with doc generation...
+```
+
+## Key Lessons from This Example
+
+### 1. Start with Real Documents
+
+The manpage schema was created by analyzing existing manpages (markitect.1.md, issue.1.md), not designed in isolation. This ensures the schema reflects real-world usage.
+
+### 2. Use Ranges, Not Exact Counts
+
+The schema uses ranges like `5-500 paragraphs` instead of exact counts. This provides flexibility while still enforcing quality standards.
+
+### 3. Required vs Recommended
+
+The schema distinguishes between required sections (SYNOPSIS, DESCRIPTION) and recommended sections (EXAMPLES, SEE ALSO), allowing flexibility where appropriate.
+
+### 4. Validate Structure, Not Semantics
+
+Schemas validate document structure, not content quality. Grammar checking, code correctness, and factual accuracy require other tools.
+
+### 5. Progressive Refinement
+
+Schemas should evolve based on validation experience. Start loose, tighten based on actual needs, never over-specify.
+
+### 6. Documentation is Essential
+
+The schema includes extensive metadata about conventions and intent through custom extensions, making it self-documenting.
+
+## Extending This Example
+
+### Create Schema Variants
+
+Create specialized schemas for different manpage types:
+
+```bash
+# For command manpages (section 1)
+cp markdown-manpage-schema.json command-manpage-schema.json
+# Edit to require COMMANDS section
+
+# For format manpages (section 5)
+cp markdown-manpage-schema.json format-manpage-schema.json
+# Edit to require FORMAT section
+
+# For convention manpages (section 7)
+cp markdown-manpage-schema.json convention-manpage-schema.json
+# Edit to be more flexible
+```
+
+### Validate Your Own Documentation
+
+Apply the manpage schema to your project:
+
+```bash
+# Validate README
+markitect validate README.md \
+    --schema markdown-manpage-schema.json
+
+# May need adjustments for non-manpage docs
+```
+
+### Generate Schema Family
+
+Create schemas for related document types:
+
+- API documentation schema
+- Tutorial schema
+- RFC/specification schema
+- Architecture decision record (ADR) schema
+
+Each can follow similar validation principles while enforcing type-specific structure.
+
+## Further Reading
+
+- **markdown-schema-validation.1.md** - Complete reference for schema validation
+- **../../docs/manuals/markitect.1.md** - MarkiTect command reference
+- **JSON Schema Specification** - https://json-schema.org/
+- **Unix Manual Page Conventions** - `man 7 man-pages` on Unix systems
+
+## Validation Results
+
+This example has been validated to confirm:
+
+✅ Manual validates against manpage schema
+✅ Schema is well-formed JSON Schema draft-07
+✅ All required sections present in manual
+✅ Heading hierarchy follows Unix conventions
+✅ Code examples demonstrate actual usage
+✅ Structure matches defined constraints
+
+## License
+
+Part of the MarkiTect project. Licensed under MIT License.
+
+---
+
+**Note**: This example represents a complete, production-ready use case of MarkiTect's schema validation system. The files can be used as-is or adapted for your own documentation requirements.

examples/manpages/SCHEMA_EVOLUTION_WORKPLAN.md

@@ -0,0 +1,787 @@
+# MarkiTect Schema Evolution Workplan
+
+## Executive Summary
+
+**Current State**: MarkiTect validates document structure via JSON Schema, but is too rigid (exact counts) and structure-only (no content guidance).
+
+**Target State**: A flexible schema system with content control, section classification, multi-schema conformance, and blueprint-based document generation.
+
+**Timeline**: 5 phases, 15-20 development sessions, approximately 8-10 weeks.
+
+---
+
+## Problem Analysis
+
+### Current Limitations
+
+#### 1. Structural Rigidity
+**Problem**: Auto-generated schemas use exact counts
+```json
+"paragraphs": { "minItems": 86, "maxItems": 86 }
+```
+**Impact**: Schemas are document-specific, not reusable patterns.
+
+#### 2. Binary Structure Validation
+**Problem**: Elements are either valid or invalid, no classification.
+**Need**: Required, Recommended, Optional, Discouraged, Improper classifications.
+
+#### 3. No Content Guidance
+**Problem**: Schemas validate structure exists, not what content belongs there.
+**Need**: Content instructions, semantic patterns, quality expectations.
+
+#### 4. Single Schema Limitation
+**Problem**: Documents can only conform to one schema.
+**Need**: Multi-schema conformance (e.g., "manpage" + "API reference" + "tutorial").
+
+#### 5. Template Generation Gap
+**Problem**: `generate-stub` creates outline, but no content guidance or data binding.
+**Need**: Blueprint system with content instructions and data templates.
+
+---
+
+## Proposed Architecture
+
+### Three-Layer System
+
+```
+┌─────────────────────────────────────────────┐
+│         BLUEPRINT LAYER                      │
+│  (Multi-schema + Content + Data Templates)   │
+└─────────────────────────────────────────────┘
+                    ↓
+┌─────────────────────────────────────────────┐
+│         SCHEMA LAYER (Enhanced)              │
+│  (Structure + Classification + Instructions) │
+└─────────────────────────────────────────────┘
+                    ↓
+┌─────────────────────────────────────────────┐
+│         VALIDATION LAYER                     │
+│  (AST Validation + Content Analysis)         │
+└─────────────────────────────────────────────┘
+```
+
+### Key Concepts
+
+**1. Schema Classification System**
+- **Required**: Must be present, validation fails if missing
+- **Recommended**: Should be present, warning if missing
+- **Optional**: May be present, no validation impact
+- **Discouraged**: Should not be present, warning if present
+- **Improper**: Must not be present, validation fails if present
+
+**2. Content Control**
+- **Content Instructions**: Human-readable guidance for section content
+- **Content Patterns**: Regex/template patterns for content validation
+- **Content Quality Metrics**: Word count, readability, completeness scoring
+
+**3. Multi-Schema Conformance**
+- Documents can conform to multiple schemas simultaneously
+- Schema composition and inheritance
+- Conflict resolution strategies
+
+**4. Blueprint System**
+- Schemas + Instructions + Data Templates = Blueprints
+- Blueprints generate documents with content guidance
+- Data binding for dynamic document generation
+
+---
+
+## Phase 1: Enhanced Schema Format
+
+**Goal**: Extend JSON Schema with MarkiTect-specific content control extensions.
+
+### 1.1 Schema Classification Extensions
+
+**New Properties**:
+```json
+{
+  "x-markitect-sections": {
+    "SYNOPSIS": {
+      "classification": "required",
+      "heading_level": 2,
+      "position": "after_title",
+      "content_instruction": "Brief command syntax showing all options",
+      "min_code_blocks": 1,
+      "max_code_blocks": 3
+    },
+    "EXAMPLES": {
+      "classification": "recommended",
+      "heading_level": 2,
+      "content_instruction": "Practical usage examples with explanations",
+      "min_code_blocks": 3,
+      "warning_if_missing": "Examples greatly improve documentation usability"
+    },
+    "DEPRECATED": {
+      "classification": "discouraged",
+      "heading_level": 2,
+      "warning_message": "DEPRECATED sections should be moved to historical docs"
+    },
+    "INTERNAL_NOTES": {
+      "classification": "improper",
+      "heading_level": 2,
+      "error_message": "Internal notes must not appear in published documentation"
+    }
+  }
+}
+```
+
+### 1.2 Content Control Extensions
+
+**New Properties**:
+```json
+{
+  "x-markitect-content-control": {
+    "synopsis_section": {
+      "min_paragraphs": 1,
+      "max_paragraphs": 3,
+      "required_patterns": [
+        "\\*\\*[a-z-]+\\*\\*.*\\[.*\\]"  // Bold command with args
+      ],
+      "content_quality": {
+        "min_words": 10,
+        "max_words": 100,
+        "readability_target": "technical"
+      },
+      "content_instructions": [
+        "Show command name in bold",
+        "Include all major options in synopsis",
+        "Use italic for arguments and placeholders"
+      ]
+    }
+  }
+}
+```
+
+### 1.3 Flexible Structure Constraints
+
+**Replace rigid counts with ranges and classifications**:
+```json
+{
+  "properties": {
+    "headings": {
+      "properties": {
+        "level_2": {
+          "items": {
+            "properties": {
+              "content": {
+                "oneOf": [
+                  {"const": "SYNOPSIS", "x-markitect-classification": "required"},
+                  {"const": "DESCRIPTION", "x-markitect-classification": "required"},
+                  {"const": "EXAMPLES", "x-markitect-classification": "recommended"},
+                  {"const": "SEE ALSO", "x-markitect-classification": "optional"}
+                ]
+              }
+            }
+          },
+          "minItems": 2,  // At least required sections
+          "maxItems": 30  // Reasonable upper bound
+        }
+      }
+    }
+  }
+}
+```
+
+### Tasks
+
+- [ ] **Task 1.1**: Define `x-markitect-sections` schema extension format
+- [ ] **Task 1.2**: Define `x-markitect-content-control` schema extension format
+- [ ] **Task 1.3**: Update metaschema to validate new extensions
+- [ ] **Task 1.4**: Create schema examples demonstrating all classifications
+- [ ] **Task 1.5**: Document schema extension format
+
+**Duration**: 3-4 sessions
+**Dependencies**: None
+**Deliverables**: Enhanced schema format specification, updated metaschema
+
+---
+
+## Phase 2: Schema Refinement Tools
+
+**Goal**: Tools to transform rigid auto-generated schemas into flexible, classified schemas.
+
+### 2.1 Schema Analysis Tool
+
+**Command**: `markitect schema-analyze`
+
+Analyzes existing schema and suggests improvements:
+```bash
+markitect schema-analyze rigid-schema.json
+
+# Output:
+⚠️  Exact counts detected (86 paragraphs)
+   Suggestion: Use range 50-150 for flexibility
+
+⚠️  All sections unclassified
+   Suggestion: Classify sections as required/recommended/optional
+
+⚠️  No content instructions
+   Suggestion: Add content guidance for key sections
+
+✨ Run: markitect schema-refine rigid-schema.json
+```
+
+### 2.2 Schema Refinement Tool
+
+**Command**: `markitect schema-refine`
+
+Interactive or automated schema refinement:
+```bash
+# Automated: Apply common refinements
+markitect schema-refine rigid-schema.json \
+    --loosen-counts \
+    --add-classifications \
+    --output flexible-schema.json
+
+# Interactive: Guided refinement
+markitect schema-refine rigid-schema.json --interactive
+```
+
+**Refinement Operations**:
+- Convert exact counts to ranges (configurable tolerance)
+- Classify sections based on conventions
+- Add content instructions from templates
+- Merge multiple schemas for common patterns
+
+### 2.3 Schema Composition Tool
+
+**Command**: `markitect schema-compose`
+
+Combine multiple schemas:
+```bash
+# Create composite schema
+markitect schema-compose \
+    --base manpage-schema.json \
+    --extend api-reference-schema.json \
+    --extend tutorial-schema.json \
+    --output composite-schema.json
+```
+
+### Tasks
+
+- [ ] **Task 2.1**: Implement `schema-analyze` command
+- [ ] **Task 2.2**: Implement `schema-refine` command with loosening logic
+- [ ] **Task 2.3**: Implement `schema-refine --interactive` mode
+- [ ] **Task 2.4**: Implement `schema-compose` command
+- [ ] **Task 2.5**: Create schema refinement rule library
+
+**Duration**: 3-4 sessions
+**Dependencies**: Phase 1 complete
+**Deliverables**: Schema analysis, refinement, and composition tools
+
+---
+
+## Phase 3: Enhanced Validation Engine
+
+**Goal**: Validate classification levels, content patterns, and multi-schema conformance.
+
+### 3.1 Classification-Aware Validation
+
+**Validation Levels**:
+```python
+class ValidationResult:
+    status: Literal["valid", "valid_with_warnings", "invalid"]
+    errors: List[ValidationError]      # Required/Improper violations
+    warnings: List[ValidationWarning]  # Recommended/Discouraged violations
+    suggestions: List[str]             # Optional improvements
+```
+
+**Example Output**:
+```bash
+markitect validate document.md schema.json --detailed-errors
+
+❌ ERRORS (validation failed)
+  - Missing required section: SYNOPSIS
+  - Improper section present: INTERNAL_NOTES
+
+⚠️  WARNINGS
+  - Missing recommended section: EXAMPLES
+  - Discouraged section present: DEPRECATED
+
+💡 SUGGESTIONS
+  - Consider adding optional section: PERFORMANCE
+  - Content quality: DESCRIPTION section below recommended word count (45/100)
+
+Status: INVALID (2 errors, 2 warnings)
+```
+
+### 3.2 Content Pattern Validation
+
+**Validate content patterns**:
+```python
+# Schema specifies required patterns
+"synopsis_section": {
+    "required_patterns": [
+        r"\*\*command\*\*",  # Bold command name
+        r"\[.*\]"            # Options in brackets
+    ],
+    "discouraged_patterns": [
+        r"TODO",             # No TODOs in published docs
+        r"FIXME"
+    ]
+}
+```
+
+### 3.3 Multi-Schema Validation
+
+**Command**: `markitect validate --schemas`
+
+```bash
+# Validate against multiple schemas
+markitect validate api-doc.md \
+    --schemas manpage.json,api-reference.json,tutorial.json \
+    --require-all
+
+# Output shows conformance to each schema
+✅ manpage.json: VALID
+✅ api-reference.json: VALID (2 warnings)
+❌ tutorial.json: INVALID (missing required section: GETTING STARTED)
+
+Overall: INVALID (must conform to all schemas)
+```
+
+### 3.4 Content Quality Metrics
+
+**Validate content quality**:
+```bash
+markitect validate document.md schema.json --quality-check
+
+📊 Content Quality Report
+  - Word count: 487 (target: 300-1000) ✅
+  - Code examples: 3 (minimum: 3) ✅
+  - Readability: Technical (appropriate) ✅
+  - Link validity: 12/12 valid ✅
+  - Heading hierarchy: Valid ✅
+
+Quality Score: 95/100
+```
+
+### Tasks
+
+- [ ] **Task 3.1**: Implement classification-aware validator
+- [ ] **Task 3.2**: Implement content pattern validation
+- [ ] **Task 3.3**: Implement multi-schema validation
+- [ ] **Task 3.4**: Implement content quality metrics
+- [ ] **Task 3.5**: Enhanced error reporting with suggestions
+
+**Duration**: 4-5 sessions
+**Dependencies**: Phase 1 complete
+**Deliverables**: Enhanced validation engine, quality metrics
+
+---
+
+## Phase 4: Blueprint System
+
+**Goal**: Document generation system with schemas + content instructions + data templates.
+
+### 4.1 Blueprint Format
+
+**Blueprint Structure**:
+```json
+{
+  "$blueprint": "1.0",
+  "name": "api-documentation-blueprint",
+  "description": "Blueprint for API endpoint documentation",
+
+  "schemas": [
+    "manpage-schema.json",
+    "api-reference-schema.json"
+  ],
+
+  "content_model": {
+    "synopsis": {
+      "template": "**{{command}}** [*OPTIONS*] *{{primary_argument}}*",
+      "data_source": "command_metadata.json",
+      "instruction": "Brief command syntax"
+    },
+    "description": {
+      "template": "{{description}}\n\nThis endpoint {{purpose}}.",
+      "min_paragraphs": 2,
+      "instruction": "Explain what the endpoint does and why to use it"
+    },
+    "parameters": {
+      "template": "{{#each parameters}}\n**{{name}}** *{{type}}*\n: {{description}}\n{{/each}}",
+      "data_source": "parameters",
+      "instruction": "Document all parameters with types and descriptions"
+    }
+  },
+
+  "data_schema": {
+    "type": "object",
+    "properties": {
+      "command": {"type": "string"},
+      "primary_argument": {"type": "string"},
+      "description": {"type": "string"},
+      "purpose": {"type": "string"},
+      "parameters": {
+        "type": "array",
+        "items": {
+          "type": "object",
+          "properties": {
+            "name": {"type": "string"},
+            "type": {"type": "string"},
+            "description": {"type": "string"}
+          }
+        }
+      }
+    }
+  },
+
+  "generation_rules": {
+    "heading_style": "atx",
+    "code_fence_style": "backticks",
+    "line_length": 80,
+    "include_metadata": true
+  }
+}
+```
+
+### 4.2 Blueprint Commands
+
+**Create Blueprint**:
+```bash
+# From existing schema
+markitect blueprint-create --from-schema api-schema.json \
+    --output api-blueprint.json
+
+# Interactive creation
+markitect blueprint-create --interactive
+```
+
+**Generate from Blueprint**:
+```bash
+# Generate with data file
+markitect blueprint-generate api-blueprint.json \
+    --data endpoint-data.json \
+    --output api-doc.md
+
+# Generate with inline data
+markitect blueprint-generate api-blueprint.json \
+    --data '{"command": "api-call", "description": "Make API call"}' \
+    --output api-doc.md
+
+# Batch generation
+markitect blueprint-generate-batch api-blueprint.json \
+    --data-dir ./endpoints/ \
+    --output-dir ./docs/api/
+```
+
+**Validate Blueprint**:
+```bash
+# Validate blueprint format
+markitect blueprint-validate api-blueprint.json
+
+# Test blueprint generation
+markitect blueprint-test api-blueprint.json \
+    --sample-data test-data.json
+```
+
+### 4.3 Template Engine Integration
+
+**Handlebars-style templates with MarkiTect extensions**:
+```markdown
+# {{command}}(1) - {{title}}
+
+## SYNOPSIS
+
+**{{command}}** {{#each options}}[*{{this}}*] {{/each}}*{{argument}}*
+
+## DESCRIPTION
+
+{{description}}
+
+{{#markitect-section "technical-details"}}
+Technical implementation details for {{command}}.
+{{/markitect-section}}
+
+## PARAMETERS
+
+{{#each parameters}}
+**--{{name}}** *{{type}}*
+: {{description}}
+: {{#if default}}Default: `{{default}}`{{/if}}
+
+{{/each}}
+
+{{#markitect-code-block "bash"}}
+# Example usage
+{{command}} {{#each examples.[0].args}}{{this}} {{/each}}
+{{/markitect-code-block}}
+```
+
+### Tasks
+
+- [ ] **Task 4.1**: Define blueprint format specification
+- [ ] **Task 4.2**: Implement `blueprint-create` command
+- [ ] **Task 4.3**: Implement `blueprint-generate` command
+- [ ] **Task 4.4**: Implement template engine with Handlebars
+- [ ] **Task 4.5**: Implement `blueprint-validate` command
+- [ ] **Task 4.6**: Implement batch generation
+- [ ] **Task 4.7**: Create blueprint library (common patterns)
+
+**Duration**: 5-6 sessions
+**Dependencies**: Phases 1 and 3 complete
+**Deliverables**: Blueprint system, template engine, generation commands
+
+---
+
+## Phase 5: Documentation and Integration
+
+**Goal**: Comprehensive documentation, examples, and ecosystem integration.
+
+### 5.1 Documentation Suite
+
+**Documents to Create**:
+- [ ] Schema Evolution Guide (why and how)
+- [ ] Schema Classification Reference
+- [ ] Content Control Specification
+- [ ] Blueprint System Guide
+- [ ] Schema Design Best Practices
+- [ ] Migration Guide (old schemas → new format)
+- [ ] API Reference for programmatic usage
+
+### 5.2 Example Gallery
+
+**Create comprehensive examples**:
+- [ ] Manpage blueprint (already started)
+- [ ] API documentation blueprint
+- [ ] Tutorial document blueprint
+- [ ] Architecture Decision Record (ADR) blueprint
+- [ ] RFC/specification blueprint
+- [ ] Meeting notes blueprint
+- [ ] Project README blueprint
+
+### 5.3 CLI Integration
+
+**Update existing commands**:
+```bash
+# schema-generate with classification
+markitect schema-generate example.md \
+    --classify-sections \
+    --add-instructions \
+    --flexible \
+    --output smart-schema.json
+
+# validate with multiple schemas
+markitect validate doc.md \
+    --schemas schema1.json,schema2.json \
+    --classification-aware \
+    --quality-check
+
+# generate-stub enhanced
+markitect generate-stub schema.json \
+    --include-instructions \
+    --sample-content \
+    --output template.md
+```
+
+### 5.4 CI/CD Integration Templates
+
+**Provide ready-to-use integrations**:
+
+GitHub Actions:
+```yaml
+- name: Validate Documentation
+  uses: markitect/validate-action@v1
+  with:
+    schemas: docs/schemas/*.json
+    files: docs/**/*.md
+    classification-aware: true
+    fail-on: errors
+    warn-on: missing-recommended
+```
+
+Pre-commit hook:
+```bash
+#!/bin/bash
+markitect validate-changed --schemas docs/schemas/ \
+    --classification-aware \
+    --fail-on errors
+```
+
+### Tasks
+
+- [ ] **Task 5.1**: Write comprehensive documentation suite
+- [ ] **Task 5.2**: Create example gallery with 7+ blueprints
+- [ ] **Task 5.3**: Update all CLI commands for new features
+- [ ] **Task 5.4**: Create CI/CD integration templates
+- [ ] **Task 5.5**: Write migration guide for existing schemas
+- [ ] **Task 5.6**: Create video tutorials/screencasts
+
+**Duration**: 3-4 sessions
+**Dependencies**: All previous phases complete
+**Deliverables**: Complete documentation, examples, integrations
+
+---
+
+## Implementation Strategy
+
+### Development Approach
+
+**1. Test-Driven Development**
+- Write tests for each classification level
+- Test schema refinement transformations
+- Test blueprint generation with various data
+- Test multi-schema validation
+
+**2. Backward Compatibility**
+- Existing schemas continue to work
+- New features are opt-in via extensions
+- Clear migration path documented
+
+**3. Incremental Rollout**
+- Phase 1: Can be used immediately after completion
+- Each phase delivers user value independently
+- Later phases build on earlier phases
+
+**4. Community Feedback**
+- Alpha release after Phase 1
+- Beta release after Phase 3
+- Stable release after Phase 5
+
+### Technical Considerations
+
+**Schema Format**:
+- JSON Schema draft-07 as foundation
+- MarkiTect extensions namespaced with `x-markitect-`
+- Validation via metaschema
+- Clear upgrade path to future JSON Schema versions
+
+**Performance**:
+- Cache compiled schemas
+- Lazy validation for large documents
+- Parallel validation for multiple schemas
+- Optimize content pattern matching
+
+**API Design**:
+- Programmatic access to all features
+- Python API for schema manipulation
+- Plugin system for custom validators
+- Extensible template engine
+
+---
+
+## Success Metrics
+
+### Phase 1 Success
+- ✅ Schema with all 5 classifications validates correctly
+- ✅ Content instructions appear in generated stubs
+- ✅ Metaschema validates all extension formats
+
+### Phase 2 Success
+- ✅ Rigid schema refined to flexible schema automatically
+- ✅ Multiple schemas composed without conflicts
+- ✅ Interactive refinement completes end-to-end
+
+### Phase 3 Success
+- ✅ Validation distinguishes errors from warnings
+- ✅ Content patterns detected and reported
+- ✅ Multi-schema validation works with 3+ schemas
+- ✅ Quality metrics provide actionable feedback
+
+### Phase 4 Success
+- ✅ Blueprint generates valid document from data
+- ✅ Generated document validates against source schemas
+- ✅ Batch generation processes 100+ documents
+- ✅ Template engine supports complex logic
+
+### Phase 5 Success
+- ✅ Documentation covers all features
+- ✅ 7+ working blueprint examples
+- ✅ CI/CD integrations work in real projects
+- ✅ Migration guide successfully upgrades old schemas
+
+---
+
+## Risk Assessment
+
+### Technical Risks
+
+**Risk**: Schema format complexity
+**Mitigation**: Clear examples, validation tools, gradual adoption
+
+**Risk**: Performance degradation with complex schemas
+**Mitigation**: Caching, optimization, benchmarking
+
+**Risk**: Template engine security (code injection)
+**Mitigation**: Sandboxed execution, no eval, strict parsing
+
+### Adoption Risks
+
+**Risk**: Breaking changes to existing workflows
+**Mitigation**: Full backward compatibility, opt-in features
+
+**Risk**: Learning curve for new features
+**Mitigation**: Excellent documentation, examples, tutorials
+
+**Risk**: Feature bloat
+**Mitigation**: Keep core simple, advanced features optional
+
+---
+
+## Future Enhancements (Post-MVP)
+
+### Potential Future Features
+
+**1. Semantic Validation**
+- AI-powered content quality checking
+- Grammar and style validation
+- Factual consistency checking
+- Link and reference validation
+
+**2. Visual Schema Editor**
+- Web-based GUI for schema creation
+- Visual blueprint designer
+- Live preview of generated documents
+- Drag-and-drop section arrangement
+
+**3. Schema Marketplace**
+- Community schema repository
+- Reusable blueprint library
+- Rating and reviews system
+- Version management
+
+**4. Advanced Blueprint Features**
+- Conditional sections based on data
+- Dynamic schema selection
+- Multi-language support
+- Custom helper functions
+
+**5. Integration Ecosystem**
+- IDE plugins (VS Code, JetBrains)
+- Documentation platforms (Read the Docs, Docusaurus)
+- CMS integrations (Contentful, Strapi)
+- Static site generators (Hugo, Jekyll)
+
+---
+
+## Conclusion
+
+This workplan transforms MarkiTect from a structural validator to a comprehensive document control system:
+
+**Current**: Rigid structure validation
+**Target**: Flexible content control with blueprints
+
+**Key Improvements**:
+1. ✨ Classification system (required → improper)
+2. ✨ Content guidance and instructions
+3. ✨ Multi-schema conformance
+4. ✨ Blueprint-based generation
+5. ✨ Quality metrics and analysis
+
+**Timeline**: ~8-10 weeks for full implementation
+**Value**: Complete CMS-like document control for markdown
+
+The system remains true to MarkiTect's philosophy of treating markdown as structured data while adding the flexibility and guidance needed for real-world content management.
+
+---
+
+## Next Steps
+
+1. **Review and refine** this workplan
+2. **Prioritize phases** based on user needs
+3. **Create detailed specifications** for Phase 1
+4. **Set up development environment** for new features
+5. **Begin implementation** with TDD approach
+
+**First Implementation Task**: Define `x-markitect-sections` format specification

examples/manpages/api-documentation-schema.json

@@ -0,0 +1,230 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "title": "API Endpoint Documentation Schema",
+  "description": "Schema for API endpoint documentation with classification and content control",
+  "x-markitect-sections": {
+    "ENDPOINT": {
+      "classification": "required",
+      "heading_level": 2,
+      "position": "after_title",
+      "content_instruction": "HTTP method and endpoint path (e.g., GET /api/v1/users)",
+      "min_paragraphs": 1,
+      "max_paragraphs": 3,
+      "error_message": "ENDPOINT section must specify the HTTP method and path"
+    },
+    "DESCRIPTION": {
+      "classification": "required",
+      "heading_level": 2,
+      "content_instruction": "What this endpoint does and when to use it",
+      "min_paragraphs": 2,
+      "error_message": "DESCRIPTION is required to explain endpoint functionality"
+    },
+    "AUTHENTICATION": {
+      "classification": "required",
+      "heading_level": 2,
+      "content_instruction": "Authentication requirements (API key, OAuth, etc.)",
+      "min_paragraphs": 1,
+      "error_message": "AUTHENTICATION requirements must be documented"
+    },
+    "REQUEST PARAMETERS": {
+      "classification": "recommended",
+      "heading_level": 2,
+      "content_instruction": "List all request parameters with types and descriptions",
+      "alternatives": ["PARAMETERS", "REQUEST", "INPUT"],
+      "warning_if_missing": "Documenting request parameters helps API consumers use the endpoint correctly"
+    },
+    "RESPONSE": {
+      "classification": "recommended",
+      "heading_level": 2,
+      "content_instruction": "Response format, status codes, and example responses",
+      "min_code_blocks": 1,
+      "warning_if_missing": "Response documentation with examples improves API usability"
+    },
+    "EXAMPLES": {
+      "classification": "recommended",
+      "heading_level": 2,
+      "content_instruction": "Complete request/response examples",
+      "min_code_blocks": 2,
+      "warning_if_missing": "Examples make API documentation significantly more useful"
+    },
+    "ERROR CODES": {
+      "classification": "recommended",
+      "heading_level": 2,
+      "content_instruction": "Possible error responses and how to handle them",
+      "alternatives": ["ERRORS", "ERROR HANDLING"],
+      "warning_if_missing": "Error documentation helps developers handle failures gracefully"
+    },
+    "RATE LIMITING": {
+      "classification": "optional",
+      "heading_level": 2,
+      "content_instruction": "Rate limit information for this endpoint"
+    },
+    "CHANGELOG": {
+      "classification": "optional",
+      "heading_level": 2,
+      "content_instruction": "Version history and changes to this endpoint"
+    },
+    "SEE ALSO": {
+      "classification": "optional",
+      "heading_level": 2,
+      "content_instruction": "Related endpoints and documentation"
+    },
+    "IMPLEMENTATION NOTES": {
+      "classification": "discouraged",
+      "heading_level": 2,
+      "warning_if_missing": "Implementation details should be in developer documentation, not API docs"
+    },
+    "INTERNAL API": {
+      "classification": "improper",
+      "heading_level": 2,
+      "error_message": "Internal API endpoints must not be in public documentation"
+    },
+    "EXPERIMENTAL": {
+      "classification": "improper",
+      "heading_level": 2,
+      "error_message": "Experimental features must not be in stable API documentation"
+    }
+  },
+  "x-markitect-content-control": {
+    "endpoint": {
+      "required_patterns": [
+        "\\*\\*[A-Z]+\\*\\*",
+        "`/api/",
+        "\\*\\*[A-Z]+\\*\\*\\s+`/[^`]+`"
+      ],
+      "content_quality": {
+        "min_words": 5,
+        "max_words": 50,
+        "readability_target": "technical"
+      },
+      "content_instructions": [
+        "Format: **METHOD** `endpoint_path`",
+        "Example: **GET** `/api/v1/users/{id}`",
+        "Use bold for HTTP method",
+        "Use code formatting for path",
+        "Include path parameters in curly braces"
+      ]
+    },
+    "description": {
+      "discouraged_patterns": [
+        "TODO",
+        "FIXME",
+        "TBD",
+        "Coming soon"
+      ],
+      "forbidden_patterns": [
+        "password",
+        "secret",
+        "api[_-]?key\\s*=",
+        "token\\s*="
+      ],
+      "content_quality": {
+        "min_words": 30,
+        "max_words": 500,
+        "readability_target": "technical",
+        "min_sentences": 2
+      },
+      "content_instructions": [
+        "Explain what the endpoint does",
+        "Describe the main use case",
+        "Mention any prerequisites",
+        "Note any side effects",
+        "Keep concise but complete"
+      ]
+    },
+    "request_parameters": {
+      "required_patterns": [
+        "\\*\\*[a-z_]+\\*\\*",
+        "\\*[A-Za-z]+\\*"
+      ],
+      "content_instructions": [
+        "Use bold for parameter names",
+        "Use italic for parameter types",
+        "Include: name, type, required/optional, description",
+        "Use definition list format",
+        "Specify default values where applicable"
+      ]
+    },
+    "response": {
+      "required_patterns": [
+        "```json",
+        "200",
+        "\\{[^}]*\\}"
+      ],
+      "content_quality": {
+        "min_words": 50,
+        "max_words": 500,
+        "readability_target": "technical"
+      },
+      "content_instructions": [
+        "Show example JSON response",
+        "Document all status codes",
+        "Explain response fields",
+        "Include success and error examples",
+        "Use proper JSON formatting in code blocks"
+      ]
+    },
+    "examples": {
+      "required_patterns": [
+        "```bash",
+        "curl",
+        "```json"
+      ],
+      "content_quality": {
+        "min_words": 100,
+        "max_words": 1000,
+        "readability_target": "general"
+      },
+      "content_instructions": [
+        "Provide complete curl examples",
+        "Show request headers",
+        "Include example responses",
+        "Add explanatory comments",
+        "Cover common scenarios"
+      ],
+      "link_validation": {
+        "check_internal": true,
+        "check_external": true,
+        "allow_fragments": true
+      }
+    }
+  },
+  "type": "object",
+  "properties": {
+    "headings": {
+      "type": "object",
+      "properties": {
+        "level_1": {
+          "type": "array",
+          "minItems": 1,
+          "maxItems": 1
+        },
+        "level_2": {
+          "type": "array",
+          "minItems": 3,
+          "maxItems": 15
+        },
+        "level_3": {
+          "type": "array",
+          "minItems": 0,
+          "maxItems": 30
+        }
+      }
+    },
+    "paragraphs": {
+      "type": "array",
+      "minItems": 8,
+      "maxItems": 200
+    },
+    "code_blocks": {
+      "type": "array",
+      "minItems": 3,
+      "maxItems": 30
+    },
+    "emphasis": {
+      "type": "array",
+      "minItems": 15,
+      "maxItems": 200
+    }
+  }
+}

examples/manpages/enhanced-manpage-schema.json

@@ -0,0 +1,229 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "title": "Enhanced Markdown Manpage Schema with Classifications",
+  "description": "JSON schema for Unix-style manual pages with section classification and content control",
+  "x-markitect-sections": {
+    "SYNOPSIS": {
+      "classification": "required",
+      "heading_level": 2,
+      "position": "after_title",
+      "content_instruction": "Brief command syntax showing all options and arguments in standard format",
+      "min_paragraphs": 1,
+      "max_paragraphs": 5,
+      "min_code_blocks": 0,
+      "max_code_blocks": 3,
+      "error_message": "SYNOPSIS section is mandatory for all manpages per Unix conventions"
+    },
+    "DESCRIPTION": {
+      "classification": "required",
+      "heading_level": 2,
+      "content_instruction": "Detailed explanation of what the command does, its purpose, and main functionality",
+      "min_paragraphs": 2,
+      "max_paragraphs": 50,
+      "error_message": "DESCRIPTION section is mandatory for all manpages"
+    },
+    "EXAMPLES": {
+      "classification": "recommended",
+      "heading_level": 2,
+      "content_instruction": "Practical usage examples with explanations demonstrating common use cases",
+      "min_code_blocks": 3,
+      "max_code_blocks": 20,
+      "warning_if_missing": "Examples greatly improve manpage usability - highly recommended"
+    },
+    "SEE ALSO": {
+      "classification": "recommended",
+      "heading_level": 2,
+      "content_instruction": "Related commands, configuration files, and documentation references",
+      "min_paragraphs": 1,
+      "warning_if_missing": "Cross-references help users discover related functionality"
+    },
+    "OPTIONS": {
+      "classification": "recommended",
+      "heading_level": 2,
+      "content_instruction": "Detailed option descriptions with all flags and their behaviors",
+      "alternatives": ["GLOBAL OPTIONS", "COMMAND OPTIONS", "FLAGS"],
+      "warning_if_missing": "Documenting command options helps users understand available functionality"
+    },
+    "BUGS": {
+      "classification": "optional",
+      "heading_level": 2,
+      "content_instruction": "Known issues, limitations, and bug reporting information"
+    },
+    "AUTHORS": {
+      "classification": "optional",
+      "heading_level": 2,
+      "content_instruction": "List of contributors and maintainers"
+    },
+    "COPYRIGHT": {
+      "classification": "optional",
+      "heading_level": 2,
+      "content_instruction": "Copyright statement and license information"
+    },
+    "HISTORY": {
+      "classification": "optional",
+      "heading_level": 2,
+      "content_instruction": "Historical information about command development"
+    },
+    "DEPRECATED": {
+      "classification": "discouraged",
+      "heading_level": 2,
+      "warning_if_missing": "Consider moving deprecated content to historical documentation or HISTORY section"
+    },
+    "OLD_SYNTAX": {
+      "classification": "discouraged",
+      "heading_level": 2,
+      "warning_if_missing": "Old syntax should be documented in HISTORY or removed entirely"
+    },
+    "INTERNAL_NOTES": {
+      "classification": "improper",
+      "heading_level": 2,
+      "error_message": "Internal notes must not appear in published manpages - move to developer documentation"
+    },
+    "TODO": {
+      "classification": "improper",
+      "heading_level": 2,
+      "error_message": "TODO sections are for development only - remove before publication"
+    },
+    "DRAFT": {
+      "classification": "improper",
+      "heading_level": 2,
+      "error_message": "DRAFT markers must be removed before publication"
+    }
+  },
+  "x-markitect-content-control": {
+    "synopsis": {
+      "required_patterns": [
+        "\\*\\*[a-z][a-z0-9-]*\\*\\*",
+        "\\[.*\\]"
+      ],
+      "discouraged_patterns": [
+        "TODO",
+        "FIXME",
+        "TBD"
+      ],
+      "content_quality": {
+        "min_words": 5,
+        "max_words": 150,
+        "readability_target": "technical"
+      },
+      "content_instructions": [
+        "Show command name in bold (e.g., **command**)",
+        "Use brackets [] for optional arguments",
+        "Use italic *ARG* for required arguments",
+        "Keep synopsis concise (1-5 lines maximum)",
+        "Use ellipsis ... to indicate repeatable arguments"
+      ]
+    },
+    "description": {
+      "discouraged_patterns": [
+        "TODO",
+        "FIXME",
+        "\\bWIP\\b",
+        "\\bXXX\\b"
+      ],
+      "forbidden_patterns": [
+        "password\\s*=\\s*[\"'].*[\"']",
+        "api[_-]?key\\s*=\\s*[\"'].*[\"']",
+        "secret\\s*=\\s*[\"'].*[\"']"
+      ],
+      "content_quality": {
+        "min_words": 50,
+        "max_words": 1000,
+        "readability_target": "technical",
+        "min_sentences": 3
+      },
+      "content_instructions": [
+        "Start with what the command does",
+        "Explain why users would use it",
+        "Describe main functionality and features",
+        "Mention any prerequisites or requirements",
+        "Keep technical but accessible"
+      ],
+      "link_validation": {
+        "check_internal": true,
+        "check_external": false,
+        "allow_fragments": true
+      }
+    },
+    "examples": {
+      "required_patterns": [
+        "```",
+        "#"
+      ],
+      "content_quality": {
+        "min_words": 100,
+        "max_words": 2000,
+        "readability_target": "general"
+      },
+      "content_instructions": [
+        "Use bash code blocks for command examples",
+        "Include comments explaining what each example does",
+        "Start with simple examples, progress to complex",
+        "Show actual output when helpful",
+        "Cover common use cases first"
+      ]
+    }
+  },
+  "type": "object",
+  "properties": {
+    "headings": {
+      "type": "object",
+      "description": "Document heading structure",
+      "properties": {
+        "level_1": {
+          "type": "array",
+          "description": "Title heading in format: command(section) - description",
+          "items": {
+            "type": "object",
+            "properties": {
+              "content": {
+                "type": "string",
+                "pattern": "^[a-z0-9-]+\\([0-9]\\) - .+"
+              }
+            }
+          },
+          "minItems": 1,
+          "maxItems": 1
+        },
+        "level_2": {
+          "type": "array",
+          "description": "Main section headings",
+          "minItems": 3,
+          "maxItems": 30
+        },
+        "level_3": {
+          "type": "array",
+          "description": "Subsection headings",
+          "minItems": 0,
+          "maxItems": 50
+        }
+      },
+      "required": ["level_1", "level_2"]
+    },
+    "paragraphs": {
+      "type": "array",
+      "description": "Text paragraphs",
+      "minItems": 10,
+      "maxItems": 500
+    },
+    "code_blocks": {
+      "type": "array",
+      "description": "Code examples",
+      "minItems": 1,
+      "maxItems": 50
+    },
+    "lists": {
+      "type": "array",
+      "description": "Lists for options and structured information",
+      "minItems": 0,
+      "maxItems": 100
+    },
+    "emphasis": {
+      "type": "array",
+      "description": "Bold and italic text for commands and arguments",
+      "minItems": 20,
+      "maxItems": 500
+    }
+  },
+  "required": ["headings", "paragraphs", "code_blocks", "emphasis"]
+}

examples/manpages/markdown-manpage-schema.json

@@ -0,0 +1,126 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "type": "object",
+  "title": "Markdown Manpage Schema",
+  "description": "JSON schema defining the structure of Unix-style manual pages written in Markdown. Compatible with man(1) section format and conventions.",
+  "properties": {
+    "headings": {
+      "type": "object",
+      "description": "Document heading structure following Unix manpage conventions",
+      "properties": {
+        "level_1": {
+          "type": "array",
+          "description": "Title heading: command(section) - brief description",
+          "items": {
+            "type": "object",
+            "properties": {
+              "content": {
+                "type": "string",
+                "pattern": "^[a-z0-9-]+\\([0-9]\\) - .+",
+                "description": "Must follow format: command(section) - description"
+              },
+              "level": {
+                "type": "integer",
+                "const": 1
+              }
+            },
+            "required": ["content", "level"]
+          },
+          "minItems": 1,
+          "maxItems": 1
+        },
+        "level_2": {
+          "type": "array",
+          "description": "Main section headings (SYNOPSIS, DESCRIPTION, etc.)",
+          "items": {
+            "type": "object",
+            "properties": {
+              "content": {
+                "type": "string",
+                "description": "Section name in UPPERCASE"
+              },
+              "level": {
+                "type": "integer",
+                "const": 2
+              }
+            },
+            "required": ["content", "level"]
+          },
+          "minItems": 3,
+          "maxItems": 30
+        },
+        "level_3": {
+          "type": "array",
+          "description": "Subsection headings (optional, for grouping commands or options)",
+          "items": {
+            "type": "object",
+            "properties": {
+              "content": {
+                "type": "string"
+              },
+              "level": {
+                "type": "integer",
+                "const": 3
+              }
+            },
+            "required": ["content", "level"]
+          },
+          "minItems": 0,
+          "maxItems": 50
+        }
+      },
+      "required": ["level_1", "level_2"]
+    },
+    "paragraphs": {
+      "type": "array",
+      "description": "Text paragraphs containing descriptions and explanations",
+      "minItems": 5,
+      "maxItems": 500
+    },
+    "lists": {
+      "type": "array",
+      "description": "Lists for options, examples, or structured information",
+      "minItems": 0,
+      "maxItems": 100
+    },
+    "code_blocks": {
+      "type": "array",
+      "description": "Code examples and command demonstrations",
+      "minItems": 1,
+      "maxItems": 50
+    },
+    "emphasis": {
+      "type": "array",
+      "description": "Bold and italic emphasis for commands, options, and arguments",
+      "minItems": 10,
+      "maxItems": 500
+    }
+  },
+  "required": ["headings", "paragraphs", "code_blocks", "emphasis"],
+  "x-markitect-required-sections": [
+    "SYNOPSIS",
+    "DESCRIPTION"
+  ],
+  "x-markitect-recommended-sections": [
+    "OPTIONS",
+    "EXAMPLES",
+    "SEE ALSO",
+    "COPYRIGHT"
+  ],
+  "x-markitect-optional-sections": [
+    "COMMANDS",
+    "CONFIGURATION",
+    "FILES",
+    "EXIT STATUS",
+    "ENVIRONMENT",
+    "BUGS",
+    "AUTHORS"
+  ],
+  "x-markitect-conventions": {
+    "heading_case": "UPPERCASE for H2 sections",
+    "command_format": "Bold with **command** for commands and options",
+    "argument_format": "Italic with *ARG* for arguments and placeholders",
+    "example_language": "bash for code blocks",
+    "definition_lists": "Use bold followed by colon for FILES, EXIT STATUS, ENVIRONMENT sections"
+  }
+}

examples/manpages/markdown-schema-validation.1.md

@@ -0,0 +1,566 @@
+# markdown-schema-validation(7) - Structured Document Validation with JSON Schema
+
+## SYNOPSIS
+
+**markitect schema-generate** *SOURCE_FILE* [**--output** *SCHEMA_FILE*]
+
+**markitect schema-ingest** *SCHEMA_FILE*
+
+**markitect validate** *DOCUMENT* *SCHEMA*
+
+**markitect generate-stub** *SCHEMA* [**--output** *FILE*]
+
+## DESCRIPTION
+
+Markdown Schema Validation is MarkiTect's system for enforcing structural consistency in markdown documents. Unlike traditional markdown linters that check syntax, schema validation ensures documents conform to predefined structural patterns by validating their Abstract Syntax Tree (AST) representation against JSON Schema definitions.
+
+This approach enables content management workflows where document structure is as important as content, making it ideal for technical documentation, business documents, and any scenario requiring consistent document templates.
+
+### How Schema Validation Works
+
+MarkiTect parses markdown files into an AST representation, then validates the AST structure against JSON schemas. The validation process checks:
+
+- **Heading hierarchy** - Required heading levels and counts
+- **Content elements** - Minimum and maximum paragraph counts
+- **Structural patterns** - Presence of lists, code blocks, tables
+- **Section organization** - Required and optional document sections
+
+Schemas validate structure, not semantics. A document can pass validation while containing incorrect content, as long as the structure matches the schema.
+
+## SCHEMA STRUCTURE
+
+### JSON Schema Format
+
+MarkiTect schemas are standard JSON Schema (draft-07) documents with custom extensions for markdown-specific validation.
+
+#### Standard Properties
+
+**properties.headings**
+: Defines heading structure by level (level_1, level_2, level_3)
+: Each level specifies minItems, maxItems, and content patterns
+
+**properties.paragraphs**
+: Array constraints for paragraph counts
+: Validates document length and content density
+
+**properties.code_blocks**
+: Array constraints for code examples
+: Ensures technical documentation includes examples
+
+**properties.lists**
+: Array constraints for list elements
+: Validates presence of structured information
+
+**properties.emphasis**
+: Array constraints for bold and italic text
+: Ensures appropriate use of emphasis
+
+#### MarkiTect Extensions
+
+MarkiTect extends JSON Schema with custom properties prefixed with **x-markitect-**:
+
+**x-markitect-required-sections**
+: Array of required H2 section names
+: Example: ["SYNOPSIS", "DESCRIPTION", "EXAMPLES"]
+
+**x-markitect-recommended-sections**
+: Array of recommended but optional section names
+: Generates warnings when missing
+
+**x-markitect-outline-mode**
+: Boolean enabling outline-only validation
+: Focuses on heading structure without content validation
+
+**x-markitect-heading-text-capture**
+: Boolean enabling exact heading text validation
+: Enforces specific section names
+
+## COMMANDS
+
+### Schema Generation
+
+**markitect schema-generate** *SOURCE_FILE*
+: Analyzes markdown file AST and generates JSON schema
+: Schema describes actual structure found in source document
+
+**--output** *SCHEMA_FILE*
+: Write schema to file instead of stdout
+: Default: outputs to terminal
+
+**--max-depth** *N*
+: Limit heading analysis to depth N
+: Useful for outline-focused schemas
+
+### Schema Management
+
+**markitect schema-ingest** *SCHEMA_FILE*
+: Store schema in MarkiTect database
+: Registers schema for reuse with validation commands
+
+**markitect schema-list**
+: Display all stored schemas
+: Shows schema names and metadata
+
+**markitect schema-get** *SCHEMA_NAME*
+: Retrieve stored schema
+: Outputs JSON schema to stdout
+
+**markitect schema-delete** *SCHEMA_NAME*
+: Remove schema from database
+: Permanently deletes schema definition
+
+### Document Validation
+
+**markitect validate** *DOCUMENT* *SCHEMA*
+: Validate markdown document against schema
+: Returns exit code 0 for valid, 4 for invalid
+
+**--detailed-errors**
+: Show detailed validation error messages
+: Includes suggestions for fixing violations
+
+**--quiet**
+: Suppress output, exit code only
+: Useful for scripting and automation
+
+### Template Generation
+
+**markitect generate-stub** *SCHEMA*
+: Generate markdown template from schema
+: Creates document outline following schema structure
+
+**--output** *FILE*
+: Write template to file
+: Default: outputs to stdout
+
+## WORKFLOW
+
+### Schema-Driven Development Workflow
+
+The typical workflow for schema-based document management:
+
+**1. Generate Schema from Example**
+
+Create or identify an exemplar document with the desired structure, then generate its schema:
+
+```bash
+markitect schema-generate exemplar.md --output doc-schema.json
+```
+
+**2. Refine Schema**
+
+Edit the generated schema to adjust constraints:
+
+- Change minItems/maxItems for flexibility
+- Add required-sections extensions
+- Adjust heading patterns
+- Add content instructions
+
+**3. Store Schema**
+
+Register schema for reuse:
+
+```bash
+markitect schema-ingest doc-schema.json
+```
+
+**4. Generate Templates**
+
+Create document templates from schema:
+
+```bash
+markitect generate-stub doc-schema.json --output template.md
+```
+
+**5. Create Documents**
+
+Write new documents using template as starting point, or use existing documents.
+
+**6. Validate Documents**
+
+Ensure documents conform to schema:
+
+```bash
+markitect validate new-document.md doc-schema.json
+
+markitect validate new-document.md doc-schema.json --detailed-errors
+```
+
+**7. Iterate**
+
+Fix validation errors and re-validate until document passes.
+
+### Batch Validation Workflow
+
+For managing multiple documents:
+
+```bash
+for doc in docs/*.md; do
+    markitect validate "$doc" doc-schema.json --quiet || echo "Failed: $doc"
+done
+```
+
+## VALIDATION RULES
+
+### Heading Validation
+
+Schemas validate heading structure through the **headings** property:
+
+**level_1** headings must appear exactly once (document title)
+
+**level_2** headings represent major sections (minItems/maxItems set bounds)
+
+**level_3** headings provide subsections (often optional with minItems: 0)
+
+Heading content can be validated with **pattern** or **enum** constraints for exact section names.
+
+### Content Element Validation
+
+**Paragraphs** - Validates document has sufficient descriptive content
+
+**Code blocks** - Ensures technical documents include examples
+
+**Lists** - Validates structured information presence
+
+**Emphasis** - Checks for appropriate use of bold/italic formatting
+
+Constraints use **minItems** and **maxItems** to set acceptable ranges.
+
+### Metadata Validation
+
+The **metadata** property validates overall document characteristics:
+
+**total_elements** - Total AST node count
+
+**structure_types** - Array of AST node types present
+
+Use **const** for exact matches or ranges for flexibility.
+
+## ERROR HANDLING
+
+### Common Validation Errors
+
+**Missing Required Section**
+
+```
+Error: Required section 'SYNOPSIS' not found
+Suggestion: Add H2 heading '## SYNOPSIS' near document start
+```
+
+**Insufficient Content**
+
+```
+Error: Too few paragraphs (found 3, minimum 5 required)
+Suggestion: Add descriptive content to meet minimum paragraph count
+```
+
+**Heading Count Mismatch**
+
+```
+Error: Too many H2 headings (found 15, maximum 13 allowed)
+Suggestion: Combine related sections or adjust schema maxItems
+```
+
+**Structure Type Mismatch**
+
+```
+Error: Expected structure types not found: code_blocks
+Suggestion: Add code examples using fenced code blocks
+```
+
+### Using Detailed Error Mode
+
+Enable detailed errors for actionable feedback:
+
+```bash
+markitect validate document.md schema.json --detailed-errors
+```
+
+Output includes:
+- Specific constraint violations
+- Location information when available
+- Suggestions for fixes
+- Schema path to failing constraint
+
+## SCHEMA DESIGN
+
+### Best Practices
+
+**Start with Real Documents**
+
+Generate schemas from actual documents rather than writing from scratch. Real documents provide realistic constraints.
+
+**Use Ranges, Not Exact Counts**
+
+Allow flexibility with minItems/maxItems ranges:
+
+```json
+"paragraphs": {
+  "minItems": 10,
+  "maxItems": 100
+}
+```
+
+Avoid exact counts (**const**) unless structure is truly rigid.
+
+**Required vs Optional Sections**
+
+Use **x-markitect-required-sections** for essential sections like SYNOPSIS and DESCRIPTION.
+
+Use **x-markitect-recommended-sections** for important but optional sections like EXAMPLES.
+
+**Heading Patterns**
+
+Use regex patterns for flexible heading validation:
+
+```json
+"pattern": "^[A-Z][A-Z ]+$"
+```
+
+Matches UPPERCASE section names while allowing variation.
+
+**Progressive Refinement**
+
+Start with loose constraints, tighten based on validation experience with real documents.
+
+### Anti-Patterns
+
+**Over-Specification**
+
+Avoid schemas that are too specific:
+
+```json
+"paragraphs": { "const": 47 }
+```
+
+This requires exactly 47 paragraphs, which is too rigid for most use cases.
+
+**Under-Specification**
+
+Avoid schemas that validate nothing:
+
+```json
+"paragraphs": { "minItems": 0 }
+```
+
+Provide meaningful constraints that ensure document quality.
+
+**Semantic Validation**
+
+Schemas validate structure, not content. Don't expect schemas to validate:
+
+- Correct grammar or spelling
+- Factual accuracy
+- Code correctness
+- Logical flow
+
+Use other tools for semantic validation.
+
+## INTEGRATION
+
+### CI/CD Integration
+
+Validate documentation in continuous integration:
+
+```bash
+markitect validate README.md readme-schema.json --quiet
+exit_code=$?
+
+if [ $exit_code -eq 0 ]; then
+    echo "Documentation valid"
+else
+    echo "Documentation validation failed"
+    markitect validate README.md readme-schema.json --detailed-errors
+    exit 1
+fi
+```
+
+### Git Hooks
+
+Pre-commit hook for automatic validation:
+
+```bash
+changed_docs=$(git diff --cached --name-only --diff-filter=ACM | grep '.md$')
+
+for doc in $changed_docs; do
+    schema="${doc%.md}-schema.json"
+    if [ -f "$schema" ]; then
+        markitect validate "$doc" "$schema" || exit 1
+    fi
+done
+```
+
+### Build Systems
+
+Makefile integration:
+
+```makefile
+.PHONY: validate-docs
+validate-docs:
+	@for doc in docs/*.md; do \
+		markitect validate "$$doc" doc-schema.json || exit 1; \
+	done
+
+.PHONY: build
+build: validate-docs
+	# Build process continues only if docs validate
+```
+
+## EXAMPLES
+
+### Generate Schema from Document
+
+```bash
+markitect schema-generate examples/invoice.md --output invoice-schema.json
+```
+
+### Store Schema for Reuse
+
+```bash
+markitect schema-ingest invoice-schema.json
+markitect schema-list
+```
+
+### Validate Single Document
+
+```bash
+markitect validate draft-invoice.md invoice-schema.json
+
+markitect validate draft-invoice.md invoice-schema.json --detailed-errors
+```
+
+### Batch Validation
+
+```bash
+for invoice in invoices/*.md; do
+    markitect validate "$invoice" invoice-schema.json --quiet
+    if [ $? -ne 0 ]; then
+        echo "Invalid: $invoice"
+        markitect validate "$invoice" invoice-schema.json --detailed-errors
+    fi
+done
+```
+
+### Template Generation
+
+```bash
+markitect generate-stub invoice-schema.json --output new-invoice-template.md
+
+cat new-invoice-template.md
+
+markitect validate new-invoice-template.md invoice-schema.json
+```
+
+### Schema Refinement Workflow
+
+```bash
+markitect schema-generate example.md --output v1-schema.json
+
+markitect validate test-doc.md v1-schema.json --detailed-errors
+
+markitect schema-generate example.md --max-depth 2 --output v2-schema.json
+
+markitect validate test-doc.md v2-schema.json
+```
+
+## FILES
+
+**\*.json**
+: JSON schema files defining document structure
+: Standard JSON Schema draft-07 format with MarkiTect extensions
+
+**markitect.db**
+: Database storing ingested schemas
+: SQLite database in current directory or specified path
+
+**.markitect.yml**
+: Configuration file for default schemas
+: YAML format with schema paths and validation rules
+
+## EXIT STATUS
+
+**0**
+: Success - document is valid
+
+**1**
+: General error - file not found, invalid arguments
+
+**2**
+: Configuration error - invalid schema file
+
+**3**
+: Database error - schema storage/retrieval failed
+
+**4**
+: Validation error - document does not conform to schema
+
+## ENVIRONMENT
+
+**MARKITECT_DATABASE**
+: Path to database file for schema storage
+: Default: markitect.db in current directory
+
+**MARKITECT_SCHEMA_PATH**
+: Search path for schema files
+: Colon-separated list of directories
+
+**MARKITECT_VALIDATION_STRICT**
+: Enable strict validation mode
+: Any non-empty value enables strict mode
+
+## SEE ALSO
+
+**markitect**(1), **json-schema**(7), **markdown-it**(7)
+
+Related documentation:
+- JSON Schema Specification (https://json-schema.org/)
+- MarkiTect Schema Reference
+- AST Structure Documentation
+- Template System Guide
+
+## LIMITATIONS
+
+Schema validation has inherent limitations:
+
+**Structure Only**
+
+Schemas validate document structure, not content semantics. Cannot validate:
+- Factual correctness
+- Code functionality
+- Logical consistency
+- Language quality
+
+**AST-Based**
+
+Validation operates on parsed AST, not raw markdown. Some markdown formatting details may not be preserved or validated.
+
+**Performance**
+
+Large documents with complex schemas may have performance implications. AST caching mitigates this for repeated validations.
+
+**Schema Complexity**
+
+Very complex schemas can become difficult to maintain. Keep schemas as simple as possible while meeting requirements.
+
+## BUGS
+
+Report bugs at: https://github.com/markitect/markitect/issues
+
+Known issues:
+- Schema generation from very large documents may be slow
+- Some edge cases in heading pattern matching
+- Limited support for custom markdown extensions
+
+## AUTHORS
+
+MarkiTect development team
+
+Schema validation system designed for structured content management and documentation consistency.
+
+## COPYRIGHT
+
+Copyright (c) 2025 MarkiTect Project. Licensed under MIT License.
+
+## VERSION
+
+This manual documents schema validation in MarkiTect version 1.0 and later.

markitect/clean_document_manager.py

@@ -1284,11 +1284,25 @@ MISSING: {len(missing_components)} components
             html_content = markdown_content_with_dogtag.replace('\n\n', '</p><p>').replace('\n', '<br>')
             html_content = f'<p>{html_content}</p>'
 
+        # Generate or read CSS content
+        if css:
+            # If css is a file path, read it
+            css_path = Path(css)
+            if css_path.exists() and css_path.is_file():
+                css_content = f'<style>\n{css_path.read_text(encoding="utf-8")}\n</style>'
+            else:
+                # Assume it's raw CSS content
+                css_content = f'<style>\n{css}\n</style>'
+        else:
+            # Use template-based CSS generation
+            css_content = self._get_template_css(template, image_max_width, image_max_height)
+
         # Replace template placeholders using safe string replacement
         # This avoids conflicts with CSS curly braces
         html_template = template_content.replace('{title}', title)
         html_template = html_template.replace('{version}', version_str)
         html_template = html_template.replace('{content}', html_content)
+        html_template = html_template.replace('{css_content}', css_content)
 
         return html_template
 
@@ -1302,8 +1316,18 @@ MISSING: {len(missing_components)} components
 
         template_content = template_path.read_text(encoding='utf-8')
 
-        # Generate CSS
-        css_content = self._get_template_css(template, image_max_width, image_max_height) if not css else css
+        # Generate or read CSS content
+        if css:
+            # If css is a file path, read it
+            css_path = Path(css)
+            if css_path.exists() and css_path.is_file():
+                css_content = f'<style>\n{css_path.read_text(encoding="utf-8")}\n</style>'
+            else:
+                # Assume it's raw CSS content
+                css_content = f'<style>\n{css}\n</style>'
+        else:
+            # Use template-based CSS generation
+            css_content = self._get_template_css(template, image_max_width, image_max_height)
 
         # Create configuration object - ONLY dynamic data interface
         config = {

markitect/metaschema.py

@@ -112,6 +112,8 @@ class MetaschemaValidator:
             "x-markitect-instruction-type": self._validate_instruction_type,
             "x-markitect-generation-mode": self._validate_generation_mode,
             "x-markitect-generated-from": self._validate_generated_from,
+            "x-markitect-sections": self._validate_sections,
+            "x-markitect-content-control": self._validate_content_control,
         }
 
         # Apply validation rules
@@ -193,4 +195,190 @@ class MetaschemaValidator:
                 "x-markitect-generated-from must be a string",
                 property_name
             )
+        return None
+
+    def _validate_sections(self, value: Any, property_name: str) -> Optional[ValidationError]:
+        """Validate x-markitect-sections property."""
+        if not isinstance(value, dict):
+            return ValidationError(
+                "x-markitect-sections must be an object",
+                property_name
+            )
+
+        # Validate each section definition
+        for section_name, section_def in value.items():
+            # Section name should be UPPERCASE (convention)
+            if not isinstance(section_name, str):
+                return ValidationError(
+                    f"Section name must be a string: {section_name}",
+                    f"{property_name}.{section_name}"
+                )
+
+            if not isinstance(section_def, dict):
+                return ValidationError(
+                    f"Section definition must be an object: {section_name}",
+                    f"{property_name}.{section_name}"
+                )
+
+            # Validate required 'classification' field
+            if "classification" not in section_def:
+                return ValidationError(
+                    f"Section '{section_name}' missing required 'classification' field",
+                    f"{property_name}.{section_name}"
+                )
+
+            classification = section_def["classification"]
+            valid_classifications = ["required", "recommended", "optional", "discouraged", "improper"]
+            if classification not in valid_classifications:
+                return ValidationError(
+                    f"Section '{section_name}' has invalid classification '{classification}'. "
+                    f"Must be one of {valid_classifications}",
+                    f"{property_name}.{section_name}.classification"
+                )
+
+            # Validate optional fields if present
+            if "heading_level" in section_def:
+                level = section_def["heading_level"]
+                if not isinstance(level, int) or level < 1 or level > 6:
+                    return ValidationError(
+                        f"Section '{section_name}' heading_level must be integer 1-6, got {level}",
+                        f"{property_name}.{section_name}.heading_level"
+                    )
+
+            if "position" in section_def:
+                position = section_def["position"]
+                valid_positions = ["after_title", "before_section_name", "after_section_name", "anywhere"]
+                if position not in valid_positions:
+                    return ValidationError(
+                        f"Section '{section_name}' has invalid position '{position}'. "
+                        f"Must be one of {valid_positions}",
+                        f"{property_name}.{section_name}.position"
+                    )
+
+            # Validate content constraints are non-negative integers
+            for constraint in ["min_paragraphs", "max_paragraphs", "min_code_blocks",
+                              "max_code_blocks", "min_lists", "max_lists"]:
+                if constraint in section_def:
+                    value_check = section_def[constraint]
+                    if not isinstance(value_check, int) or value_check < 0:
+                        return ValidationError(
+                            f"Section '{section_name}' {constraint} must be non-negative integer, got {value_check}",
+                            f"{property_name}.{section_name}.{constraint}"
+                        )
+
+            # Validate alternatives is array of strings
+            if "alternatives" in section_def:
+                alternatives = section_def["alternatives"]
+                if not isinstance(alternatives, list):
+                    return ValidationError(
+                        f"Section '{section_name}' alternatives must be an array",
+                        f"{property_name}.{section_name}.alternatives"
+                    )
+                for alt in alternatives:
+                    if not isinstance(alt, str):
+                        return ValidationError(
+                            f"Section '{section_name}' alternative names must be strings",
+                            f"{property_name}.{section_name}.alternatives"
+                        )
+
+        return None
+
+    def _validate_content_control(self, value: Any, property_name: str) -> Optional[ValidationError]:
+        """Validate x-markitect-content-control property."""
+        if not isinstance(value, dict):
+            return ValidationError(
+                "x-markitect-content-control must be an object",
+                property_name
+            )
+
+        # Validate each section's content control rules
+        for section_name, control_def in value.items():
+            if not isinstance(section_name, str):
+                return ValidationError(
+                    f"Content control section name must be a string: {section_name}",
+                    f"{property_name}.{section_name}"
+                )
+
+            if not isinstance(control_def, dict):
+                return ValidationError(
+                    f"Content control definition must be an object: {section_name}",
+                    f"{property_name}.{section_name}"
+                )
+
+            # Validate pattern arrays
+            for pattern_type in ["required_patterns", "discouraged_patterns", "forbidden_patterns"]:
+                if pattern_type in control_def:
+                    patterns = control_def[pattern_type]
+                    if not isinstance(patterns, list):
+                        return ValidationError(
+                            f"Content control '{section_name}' {pattern_type} must be an array",
+                            f"{property_name}.{section_name}.{pattern_type}"
+                        )
+                    for pattern in patterns:
+                        if not isinstance(pattern, str):
+                            return ValidationError(
+                                f"Content control '{section_name}' pattern must be string",
+                                f"{property_name}.{section_name}.{pattern_type}"
+                            )
+
+            # Validate content_quality object
+            if "content_quality" in control_def:
+                quality = control_def["content_quality"]
+                if not isinstance(quality, dict):
+                    return ValidationError(
+                        f"Content control '{section_name}' content_quality must be an object",
+                        f"{property_name}.{section_name}.content_quality"
+                    )
+
+                # Validate word/sentence counts
+                for count_field in ["min_words", "max_words", "min_sentences", "max_sentences"]:
+                    if count_field in quality:
+                        count = quality[count_field]
+                        if not isinstance(count, int) or count < 0:
+                            return ValidationError(
+                                f"Content quality '{section_name}' {count_field} must be non-negative integer",
+                                f"{property_name}.{section_name}.content_quality.{count_field}"
+                            )
+
+                # Validate readability_target
+                if "readability_target" in quality:
+                    target = quality["readability_target"]
+                    valid_targets = ["simple", "general", "technical", "advanced"]
+                    if target not in valid_targets:
+                        return ValidationError(
+                            f"Content quality '{section_name}' readability_target must be one of {valid_targets}",
+                            f"{property_name}.{section_name}.content_quality.readability_target"
+                        )
+
+            # Validate content_instructions array
+            if "content_instructions" in control_def:
+                instructions = control_def["content_instructions"]
+                if not isinstance(instructions, list):
+                    return ValidationError(
+                        f"Content control '{section_name}' content_instructions must be an array",
+                        f"{property_name}.{section_name}.content_instructions"
+                    )
+                for instruction in instructions:
+                    if not isinstance(instruction, str):
+                        return ValidationError(
+                            f"Content control '{section_name}' instruction must be string",
+                            f"{property_name}.{section_name}.content_instructions"
+                        )
+
+            # Validate link_validation object
+            if "link_validation" in control_def:
+                link_val = control_def["link_validation"]
+                if not isinstance(link_val, dict):
+                    return ValidationError(
+                        f"Content control '{section_name}' link_validation must be an object",
+                        f"{property_name}.{section_name}.link_validation"
+                    )
+                for field in ["check_internal", "check_external", "allow_fragments"]:
+                    if field in link_val:
+                        if not isinstance(link_val[field], bool):
+                            return ValidationError(
+                                f"Content control '{section_name}' link_validation.{field} must be boolean",
+                                f"{property_name}.{section_name}.link_validation.{field}"
+                            )
+
         return None

markitect/schemas/markitect-metaschema.json

@@ -40,6 +40,163 @@
           "type": "string",
           "enum": ["outline", "full"],
           "description": "Mode used to generate this schema"
+        },
+        "x-markitect-sections": {
+          "type": "object",
+          "description": "Section classification and content control for document sections",
+          "patternProperties": {
+            "^[A-Z][A-Z0-9_ ]*$": {
+              "type": "object",
+              "description": "Section definition with classification and constraints",
+              "properties": {
+                "classification": {
+                  "type": "string",
+                  "enum": ["required", "recommended", "optional", "discouraged", "improper"],
+                  "description": "Classification level determining validation behavior"
+                },
+                "heading_level": {
+                  "type": "integer",
+                  "minimum": 1,
+                  "maximum": 6,
+                  "description": "Expected heading level (H1-H6) for this section"
+                },
+                "position": {
+                  "type": "string",
+                  "enum": ["after_title", "before_section_name", "after_section_name", "anywhere"],
+                  "description": "Where this section should appear in the document"
+                },
+                "content_instruction": {
+                  "type": "string",
+                  "description": "Human-readable instruction for section content"
+                },
+                "min_paragraphs": {
+                  "type": "integer",
+                  "minimum": 0,
+                  "description": "Minimum number of paragraphs in this section"
+                },
+                "max_paragraphs": {
+                  "type": "integer",
+                  "minimum": 0,
+                  "description": "Maximum number of paragraphs in this section"
+                },
+                "min_code_blocks": {
+                  "type": "integer",
+                  "minimum": 0,
+                  "description": "Minimum number of code blocks in this section"
+                },
+                "max_code_blocks": {
+                  "type": "integer",
+                  "minimum": 0,
+                  "description": "Maximum number of code blocks in this section"
+                },
+                "min_lists": {
+                  "type": "integer",
+                  "minimum": 0,
+                  "description": "Minimum number of lists in this section"
+                },
+                "max_lists": {
+                  "type": "integer",
+                  "minimum": 0,
+                  "description": "Maximum number of lists in this section"
+                },
+                "warning_if_missing": {
+                  "type": "string",
+                  "description": "Custom warning message for missing recommended sections"
+                },
+                "error_message": {
+                  "type": "string",
+                  "description": "Custom error message for required/improper section violations"
+                },
+                "alternatives": {
+                  "type": "array",
+                  "items": {"type": "string"},
+                  "description": "Alternative section names that satisfy the requirement"
+                }
+              },
+              "required": ["classification"]
+            }
+          }
+        },
+        "x-markitect-content-control": {
+          "type": "object",
+          "description": "Content validation rules including patterns and quality metrics",
+          "patternProperties": {
+            "^[a-z][a-z0-9_]*$": {
+              "type": "object",
+              "description": "Content control rules for a specific section",
+              "properties": {
+                "required_patterns": {
+                  "type": "array",
+                  "items": {"type": "string"},
+                  "description": "Regex patterns that must appear in section content"
+                },
+                "discouraged_patterns": {
+                  "type": "array",
+                  "items": {"type": "string"},
+                  "description": "Regex patterns that should not appear in content (warning)"
+                },
+                "forbidden_patterns": {
+                  "type": "array",
+                  "items": {"type": "string"},
+                  "description": "Regex patterns that must not appear in content (error)"
+                },
+                "content_quality": {
+                  "type": "object",
+                  "description": "Quality metrics for section content",
+                  "properties": {
+                    "min_words": {
+                      "type": "integer",
+                      "minimum": 0,
+                      "description": "Minimum word count"
+                    },
+                    "max_words": {
+                      "type": "integer",
+                      "minimum": 0,
+                      "description": "Maximum word count"
+                    },
+                    "readability_target": {
+                      "type": "string",
+                      "enum": ["simple", "general", "technical", "advanced"],
+                      "description": "Target readability level"
+                    },
+                    "min_sentences": {
+                      "type": "integer",
+                      "minimum": 0,
+                      "description": "Minimum sentence count"
+                    },
+                    "max_sentences": {
+                      "type": "integer",
+                      "minimum": 0,
+                      "description": "Maximum sentence count"
+                    }
+                  }
+                },
+                "content_instructions": {
+                  "type": "array",
+                  "items": {"type": "string"},
+                  "description": "Array of human-readable content creation instructions"
+                },
+                "link_validation": {
+                  "type": "object",
+                  "description": "Link checking configuration",
+                  "properties": {
+                    "check_internal": {
+                      "type": "boolean",
+                      "description": "Validate internal document links"
+                    },
+                    "check_external": {
+                      "type": "boolean",
+                      "description": "Validate external URLs"
+                    },
+                    "allow_fragments": {
+                      "type": "boolean",
+                      "description": "Allow fragment-only links like #section"
+                    }
+                  }
+                }
+              }
+            }
+          }
         }
       },
       "patternProperties": {

markitect/static/js/components/debug-panel.js

@@ -1,191 +0,0 @@
-/**
- * DebugPanel Component
- *
- * Extracted from monolithic editor.js as part of architecture refactoring.
- * Handles debug message display and management for client-side debugging.
- *
- * Dependencies:
- * - None (standalone component)
- */
-
-/**
- * DebugPanel - Manages debug message display and interaction
- */
-class DebugPanel {
-    constructor() {
-        this.messages = [];
-        this.isActive = false;
-        this.maxMessages = 1000; // Keep last 1000 messages
-    }
-
-    /**
-     * Add a debug message
-     */
-    addMessage(message, category = 'INFO') {
-        const messageObj = {
-            message,
-            category,
-            timestamp: new Date().toLocaleTimeString()
-        };
-
-        this.messages.push(messageObj);
-
-        // Keep only last maxMessages
-        if (this.messages.length > this.maxMessages) {
-            this.messages = this.messages.slice(-this.maxMessages);
-        }
-
-        // Auto-update if panel is visible
-        if (this.isActive) {
-            this.update();
-        }
-    }
-
-    /**
-     * Toggle the debug panel on/off
-     */
-    toggle() {
-        const debugContainer = document.getElementById('debug-messages-container');
-        const debugButton = document.getElementById('toggle-debug');
-
-        if (!debugContainer || !debugButton) {
-            console.warn('DebugPanel: Required DOM elements not found');
-            return;
-        }
-
-        if (this.isActive) {
-            this.hide();
-        } else {
-            this.show();
-        }
-    }
-
-    /**
-     * Show the debug panel
-     */
-    show() {
-        const debugContainer = document.getElementById('debug-messages-container');
-        const debugButton = document.getElementById('toggle-debug');
-
-        if (!debugContainer || !debugButton) {
-            console.warn('DebugPanel: Required DOM elements not found');
-            return;
-        }
-
-        debugContainer.style.display = 'block';
-        debugButton.textContent = '🔍 Debug (ON)';
-        debugButton.style.background = '#28a745';
-        this.isActive = true;
-        this.update();
-    }
-
-    /**
-     * Hide the debug panel
-     */
-    hide() {
-        const debugContainer = document.getElementById('debug-messages-container');
-        const debugButton = document.getElementById('toggle-debug');
-
-        if (!debugContainer || !debugButton) {
-            console.warn('DebugPanel: Required DOM elements not found');
-            return;
-        }
-
-        debugContainer.style.display = 'none';
-        debugButton.textContent = '🔍 Debug';
-        debugButton.style.background = '#6c757d';
-        this.isActive = false;
-    }
-
-    /**
-     * Update the debug panel with current messages
-     */
-    update() {
-        const debugContainer = document.getElementById('debug-messages-container');
-        if (!debugContainer || !this.isActive) {
-            return;
-        }
-
-        if (this.messages.length === 0) {
-            debugContainer.innerHTML = '<div style="color: #6c757d; font-style: italic; padding: 12px;">No debug messages yet. Click sections to generate debug output.</div>';
-            return;
-        }
-
-        // Show the last 50 messages in reverse order (newest first)
-        const recentMessages = this.messages.slice(-50).reverse();
-
-        const messagesHtml = recentMessages.map(msg => {
-            const categoryColor = {
-                'INFO': '#17a2b8',
-                'WARNING': '#ffc107',
-                'ERROR': '#dc3545',
-                'SUCCESS': '#28a745',
-                'DEBUG': '#6f42c1'
-            }[msg.category] || '#6c757d';
-
-            return `
-                <div style="margin-bottom: 6px; padding: 4px; border-left: 3px solid ${categoryColor}; background: white; border-radius: 2px;">
-                    <span style="color: #6c757d; font-size: 11px;">[${msg.timestamp}]</span>
-                    <span style="color: ${categoryColor}; font-weight: bold;">${msg.category}:</span>
-                    <span style="color: #333;">${msg.message}</span>
-                </div>
-            `;
-        }).join('');
-
-        debugContainer.innerHTML = `
-            <div style="margin-bottom: 8px; padding: 6px; background: #e9ecef; border-radius: 4px; font-weight: bold; color: #495057;">
-                Debug Messages (${this.messages.length} total, showing last ${recentMessages.length})
-                <button id="debug-clear-btn" style="float: right; background: #dc3545; color: white; border: none; padding: 2px 6px; border-radius: 2px; font-size: 11px; cursor: pointer;">Clear</button>
-            </div>
-            <div style="max-height: 250px; overflow-y: auto;">
-                ${messagesHtml}
-            </div>
-        `;
-
-        // Add event listener for clear button
-        const clearBtn = debugContainer.querySelector('#debug-clear-btn');
-        if (clearBtn) {
-            clearBtn.addEventListener('click', () => {
-                this.clear();
-            });
-        }
-
-        // Auto-scroll to bottom to show newest messages
-        const scrollContainer = debugContainer.querySelector('div[style*="overflow-y"]');
-        if (scrollContainer) {
-            scrollContainer.scrollTop = scrollContainer.scrollHeight;
-        }
-    }
-
-    /**
-     * Clear all debug messages
-     */
-    clear() {
-        this.messages = [];
-        this.update();
-    }
-
-    /**
-     * Get the number of messages
-     */
-    getMessageCount() {
-        return this.messages.length;
-    }
-
-    /**
-     * Get recent messages
-     */
-    getRecentMessages(count = 10) {
-        return this.messages.slice(-count);
-    }
-}
-
-// Export for use in tests and other modules
-if (typeof module !== 'undefined' && module.exports) {
-    module.exports = { DebugPanel };
-}
-
-// Export for browser use
-if (typeof window !== 'undefined') {
-    window.DebugPanel = DebugPanel;
-}

markitect/static/js/components/document-controls.js

@@ -1,279 +0,0 @@
-/**
- * DocumentControls Component
- *
- * Extracted from monolithic editor.js as part of architecture refactoring.
- * Handles the floating control panel and document-level actions.
- *
- * Dependencies:
- * - None (standalone component)
- */
-
-/**
- * DocumentControls - Manages the floating control panel and its buttons
- */
-class DocumentControls {
-    constructor() {
-        this.controlPanel = null;
-        this.buttons = new Map();
-        this.eventHandlers = new Map();
-        this.isVisible = true;
-    }
-
-    /**
-     * Create the control panel and add it to the DOM
-     */
-    create() {
-        if (this.controlPanel) {
-            this.destroy(); // Remove existing panel
-        }
-
-        // Also remove any existing panel with the same ID in the DOM
-        const existingPanel = document.getElementById('markitect-global-controls');
-        if (existingPanel && existingPanel.parentNode) {
-            existingPanel.parentNode.removeChild(existingPanel);
-        }
-
-        // Create the floating control panel
-        this.controlPanel = document.createElement('div');
-        this.controlPanel.id = 'markitect-global-controls';
-        this.controlPanel.style.cssText = `
-            position: fixed;
-            top: 20px;
-            right: 20px;
-            background: rgba(248, 249, 250, 0.95);
-            border: 1px solid #dee2e6;
-            border-radius: 8px;
-            padding: 12px;
-            box-shadow: 0 4px 12px rgba(0,0,0,0.15);
-            z-index: 1000;
-            backdrop-filter: blur(8px);
-            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-            font-size: 14px;
-            min-width: 200px;
-        `;
-
-        // Add title
-        const title = document.createElement('div');
-        title.style.cssText = `
-            font-weight: 600;
-            margin-bottom: 8px;
-            color: #495057;
-            border-bottom: 1px solid #dee2e6;
-            padding-bottom: 4px;
-        `;
-        title.textContent = 'Document Controls';
-
-        // Create button container
-        const buttonContainer = document.createElement('div');
-        buttonContainer.id = 'button-container';
-        buttonContainer.style.cssText = `
-            display: flex;
-            flex-direction: column;
-            gap: 6px;
-        `;
-
-        this.controlPanel.appendChild(title);
-        this.controlPanel.appendChild(buttonContainer);
-
-        // Add default buttons
-        this.addDefaultButtons();
-
-        // Add debug messages container
-        this.addDebugContainer();
-
-        // Add to DOM
-        document.body.appendChild(this.controlPanel);
-    }
-
-    /**
-     * Add default buttons to the control panel
-     */
-    addDefaultButtons() {
-        // Save Document button
-        this.addButton('save-document', '💾 Save Document', '#28a745');
-
-        // Reset All button
-        this.addButton('reset-all', '🔄 Reset All', '#ffc107', '#212529');
-
-        // Show Status button
-        this.addButton('show-status', '📊 Show Status', '#17a2b8');
-
-        // Debug button
-        this.addButton('toggle-debug', '🔍 Debug', '#6c757d');
-    }
-
-    /**
-     * Add debug container to the control panel
-     */
-    addDebugContainer() {
-        const debugContainer = document.createElement('div');
-        debugContainer.id = 'debug-messages-container';
-        debugContainer.style.cssText = `
-            margin-top: 12px;
-            max-height: 300px;
-            overflow-y: auto;
-            border: 1px solid #dee2e6;
-            border-radius: 4px;
-            background: #f8f9fa;
-            padding: 8px;
-            font-family: 'Courier New', monospace;
-            font-size: 12px;
-            line-height: 1.4;
-            display: none;
-        `;
-
-        this.controlPanel.appendChild(debugContainer);
-    }
-
-    /**
-     * Add a button to the control panel
-     */
-    addButton(id, text, backgroundColor, textColor = 'white') {
-        const buttonContainer = this.controlPanel.querySelector('#button-container');
-        if (!buttonContainer) {
-            throw new Error('Button container not found. Call create() first.');
-        }
-
-        const button = document.createElement('button');
-        button.id = id;
-        button.textContent = text;
-        button.style.cssText = `
-            background: ${backgroundColor};
-            color: ${textColor};
-            border: none;
-            padding: 8px 12px;
-            border-radius: 4px;
-            cursor: pointer;
-            font-size: 13px;
-            font-weight: 500;
-            transition: background-color 0.2s;
-        `;
-
-        buttonContainer.appendChild(button);
-        this.buttons.set(id, button);
-
-        return button;
-    }
-
-    /**
-     * Remove a button from the control panel
-     */
-    removeButton(id) {
-        const button = this.buttons.get(id);
-        if (button && button.parentNode) {
-            button.parentNode.removeChild(button);
-            this.buttons.delete(id);
-            this.eventHandlers.delete(id);
-        }
-    }
-
-    /**
-     * Set event handlers for buttons
-     */
-    setEventHandlers(handlers) {
-        for (const [buttonId, handler] of Object.entries(handlers)) {
-            const button = this.buttons.get(buttonId);
-            if (button) {
-                // Remove existing handler if any
-                if (this.eventHandlers.has(buttonId)) {
-                    button.removeEventListener('click', this.eventHandlers.get(buttonId));
-                }
-
-                // Add new handler
-                button.addEventListener('click', handler);
-                this.eventHandlers.set(buttonId, handler);
-            }
-        }
-    }
-
-    /**
-     * Show the control panel
-     */
-    show() {
-        if (this.controlPanel) {
-            this.controlPanel.style.display = 'block';
-            this.isVisible = true;
-        }
-    }
-
-    /**
-     * Hide the control panel
-     */
-    hide() {
-        if (this.controlPanel) {
-            this.controlPanel.style.display = 'none';
-            this.isVisible = false;
-        }
-    }
-
-    /**
-     * Update status display (can be extended as needed)
-     */
-    updateStatus(status) {
-        // This method can be extended to show status information
-        // For now, it just stores the status for potential display
-        this.lastStatus = status;
-
-        // Could update a status indicator in the panel if needed
-        if (status && this.controlPanel) {
-            const title = this.controlPanel.querySelector('div');
-            if (title) {
-                const statusText = `Document Controls (${status.totalSections} sections, ${status.editingSections} editing)`;
-                // Could update title or add status indicator
-            }
-        }
-    }
-
-    /**
-     * Get the control panel element
-     */
-    getControlPanel() {
-        return this.controlPanel;
-    }
-
-    /**
-     * Destroy the control panel and clean up
-     */
-    destroy() {
-        if (this.controlPanel && this.controlPanel.parentNode) {
-            this.controlPanel.parentNode.removeChild(this.controlPanel);
-        }
-
-        // Clean up references
-        this.controlPanel = null;
-        this.buttons.clear();
-        this.eventHandlers.clear();
-        this.isVisible = true;
-    }
-
-    /**
-     * Check if the control panel is visible
-     */
-    isVisible() {
-        return this.isVisible && this.controlPanel && this.controlPanel.style.display !== 'none';
-    }
-
-    /**
-     * Get all button IDs
-     */
-    getButtonIds() {
-        return Array.from(this.buttons.keys());
-    }
-
-    /**
-     * Get a specific button by ID
-     */
-    getButton(id) {
-        return this.buttons.get(id);
-    }
-}
-
-// Export for use in tests and other modules
-if (typeof module !== 'undefined' && module.exports) {
-    module.exports = { DocumentControls };
-}
-
-// Export for browser use
-if (typeof window !== 'undefined') {
-    window.DocumentControls = DocumentControls;
-}

markitect/static/js/config-loader.js

@@ -1,168 +0,0 @@
-/**
- * Configuration Loader - Clean interface between Python and JavaScript
- *
- * This module provides the ONLY interface for Python-generated data.
- * All dynamic data from Python must be passed through this JSON configuration.
- */
-
-class MarkitectConfig {
-    constructor() {
-        this.config = null;
-        this.loaded = false;
-
-        // Simple immediate loading - if script is loaded, DOM is ready
-        this.loadConfig();
-    }
-
-    loadConfig() {
-        try {
-            const configElement = document.getElementById('markitect-config');
-            if (!configElement) {
-                throw new Error('Markitect configuration not found - missing markitect-config script element');
-            }
-
-            this.config = JSON.parse(configElement.textContent);
-            this.loaded = true;
-            console.log('✅ Markitect configuration loaded successfully');
-
-            // Validate required fields
-            this.validateConfig();
-
-        } catch (error) {
-            console.error('❌ Failed to load Markitect configuration:', error);
-            this.config = this.getDefaultConfig();
-        }
-    }
-
-    validateConfig() {
-        const required = ['markdownContent', 'mode'];
-        const missing = required.filter(key => !(key in this.config));
-
-        if (missing.length > 0) {
-            console.warn('⚠️ Missing required config fields:', missing);
-        }
-    }
-
-    getDefaultConfig() {
-        return {
-            markdownContent: '# Default Content\n\nConfiguration failed to load.',
-            markdownContentWithDogtag: '# Default Content\n\nConfiguration failed to load.',
-            dogtagContent: '',
-            mode: 'edit',
-            theme: 'github',
-            keyboardShortcuts: true,
-            autosave: false,
-            sections: true,
-            originalFilename: 'document',
-            version: 'Markitect v0.8.1',
-            repoName: 'Markitect',
-            base64References: {}
-        };
-    }
-
-    // Getter methods for clean access
-    get markdownContent() {
-        return this.config.markdownContent || '';
-    }
-
-    get markdownContentWithDogtag() {
-        return this.config.markdownContentWithDogtag || this.markdownContent;
-    }
-
-    get dogtagContent() {
-        return this.config.dogtagContent || '';
-    }
-
-    get mode() {
-        return this.config.mode || 'edit';
-    }
-
-    get isEditMode() {
-        return this.mode === 'edit';
-    }
-
-    get isInsertMode() {
-        return this.mode === 'insert';
-    }
-
-    get theme() {
-        return this.config.theme || 'github';
-    }
-
-    get originalFilename() {
-        return this.config.originalFilename || 'document';
-    }
-
-    get version() {
-        return this.config.version || 'Markitect v0.8.1';
-    }
-
-    get repoName() {
-        return this.config.repoName || 'Markitect';
-    }
-
-    get keyboardShortcuts() {
-        return this.config.keyboardShortcuts !== false;
-    }
-
-    get base64References() {
-        return this.config.base64References || {};
-    }
-
-    get restrictedHeadingLevels() {
-        return this.config.restrictedHeadingLevels || [1, 2, 3];
-    }
-
-    // Check if config is ready for access
-    isReady() {
-        return this.loaded && this.config !== null;
-    }
-
-    // Wait for config to be ready
-    waitForReady(callback, maxWait = 5000) {
-        const startTime = Date.now();
-        const checkReady = () => {
-            if (this.isReady()) {
-                callback();
-            } else if (Date.now() - startTime < maxWait) {
-                setTimeout(checkReady, 50);
-            } else {
-                console.error('❌ Configuration loading timeout after', maxWait, 'ms');
-                callback(); // Call anyway with default config
-            }
-        };
-        checkReady();
-    }
-
-    // Get full editor configuration object
-    getEditorConfig() {
-        if (!this.isReady()) {
-            console.warn('⚠️ Configuration not ready, using defaults');
-            return this.getDefaultConfig();
-        }
-
-        return {
-            mode: this.mode,
-            theme: this.theme,
-            keyboardShortcuts: this.keyboardShortcuts,
-            autosave: this.config.autosave || false,
-            sections: this.config.sections !== false,
-            originalFilename: this.originalFilename,
-            version: this.version,
-            repoName: this.repoName,
-            restrictedHeadingLevels: this.restrictedHeadingLevels
-        };
-    }
-}
-
-// Global configuration instance
-window.markitectConfig = new MarkitectConfig();
-
-// Legacy compatibility - expose common config values globally
-window.editorConfig = window.markitectConfig.getEditorConfig();
-window.markitectBase64References = window.markitectConfig.base64References;
-
-// Export for module use
-if (typeof module !== 'undefined' && module.exports) {
-    module.exports = MarkitectConfig;
-}

markitect/static/js/core/debug-system.js

@@ -1,290 +0,0 @@
-/**
- * Independent Debug System for Markitect
- * Uses IndexedDB for persistence and provides selection-based filtering
- */
-class MarkitectDebugSystem {
-    constructor() {
-        this.db = null;
-        this.messages = [];
-        this.maxMessages = 1000;
-        this.isEnabled = true;
-        this.subscribers = [];
-
-        // Selection and filtering system
-        this.selectionCriteria = {
-            includeDocumentEvents: true,
-            includeSystemEvents: false,
-            includeControlEvents: true,
-            includeEditingEvents: true,
-            includeNavigationEvents: false,
-            includedHeadings: new Set(), // Track which document headings to monitor
-            excludedSources: new Set(['ContentsControl', 'DocumentNavigator'])
-        };
-
-        this.init();
-    }
-
-    // Initialize IndexedDB for persistence
-    async init() {
-        return new Promise((resolve, reject) => {
-            const request = indexedDB.open('MarkitectDebugDB', 1);
-
-            request.onerror = () => reject(request.error);
-            request.onsuccess = () => {
-                this.db = request.result;
-                this.loadMessages().then(resolve);
-            };
-
-            request.onupgradeneeded = (e) => {
-                const db = e.target.result;
-                if (!db.objectStoreNames.contains('messages')) {
-                    const store = db.createObjectStore('messages', { keyPath: 'id', autoIncrement: true });
-                    store.createIndex('timestamp', 'timestamp', { unique: false });
-                    store.createIndex('category', 'category', { unique: false });
-                }
-            };
-        });
-    }
-
-    // Add a debug message with selection filtering
-    async addMessage(message, category = 'INFO', source = 'System', context = {}) {
-        // Check if this message should be included based on selection criteria
-        if (!this.shouldIncludeMessage(message, category, source, context)) {
-            return null;
-        }
-
-        const messageObj = {
-            timestamp: new Date().toISOString(),
-            message: String(message),
-            category: category.toUpperCase(),
-            source: String(source),
-            context: context || {},
-            id: null // Will be set by IndexedDB
-        };
-
-        // Store in IndexedDB if available
-        if (this.db) {
-            try {
-                await this.saveMessage(messageObj);
-            } catch (error) {
-                console.warn('Failed to save debug message to IndexedDB:', error);
-            }
-        }
-
-        // Store in memory
-        this.messages.unshift(messageObj);
-
-        // Limit memory storage
-        if (this.messages.length > this.maxMessages) {
-            this.messages = this.messages.slice(0, this.maxMessages);
-        }
-
-        // Notify subscribers
-        this.notifySubscribers(messageObj);
-
-        // Console output for development
-        const consoleMethod = category.toLowerCase() === 'error' ? 'error' :
-                             category.toLowerCase() === 'warning' ? 'warn' : 'log';
-        console[consoleMethod](`[${source}] ${message}`, context);
-
-        return messageObj;
-    }
-
-    // Selection filtering logic
-    shouldIncludeMessage(message, category, source, context) {
-        if (!this.isEnabled) return false;
-
-        const eventType = context.eventType || 'UNKNOWN';
-        const criteria = this.selectionCriteria;
-
-        // Check event type filters
-        switch (eventType.toUpperCase()) {
-            case 'DOCUMENT':
-                if (!criteria.includeDocumentEvents) return false;
-                break;
-            case 'SYSTEM':
-                if (!criteria.includeSystemEvents) return false;
-                break;
-            case 'CONTROL':
-                if (!criteria.includeControlEvents) return false;
-                break;
-            case 'EDITING':
-                if (!criteria.includeEditingEvents) return false;
-                break;
-            case 'NAVIGATION':
-                if (!criteria.includeNavigationEvents) return false;
-                break;
-        }
-
-        // Check excluded sources
-        if (criteria.excludedSources.has(source)) {
-            return false;
-        }
-
-        // Check heading-specific filtering
-        if (context.sectionId && criteria.includedHeadings.size > 0) {
-            const sectionElement = document.getElementById(context.sectionId);
-            if (sectionElement) {
-                const heading = sectionElement.querySelector('h1, h2, h3, h4, h5, h6');
-                if (heading && !criteria.includedHeadings.has(heading.textContent.trim())) {
-                    return false;
-                }
-            }
-        }
-
-        return true;
-    }
-
-    // Save message to IndexedDB
-    async saveMessage(messageObj) {
-        return new Promise((resolve, reject) => {
-            const transaction = this.db.transaction(['messages'], 'readwrite');
-            const store = transaction.objectStore('messages');
-            const request = store.add(messageObj);
-
-            request.onsuccess = () => resolve(request.result);
-            request.onerror = () => reject(request.error);
-        });
-    }
-
-    // Load messages from IndexedDB
-    async loadMessages() {
-        if (!this.db) return [];
-
-        return new Promise((resolve, reject) => {
-            const transaction = this.db.transaction(['messages'], 'readonly');
-            const store = transaction.objectStore('messages');
-            const request = store.getAll();
-
-            request.onsuccess = () => {
-                this.messages = request.result.reverse(); // Most recent first
-                resolve(this.messages);
-            };
-            request.onerror = () => reject(request.error);
-        });
-    }
-
-    // Clear all messages
-    async clearMessages() {
-        this.messages = [];
-
-        if (this.db) {
-            return new Promise((resolve, reject) => {
-                const transaction = this.db.transaction(['messages'], 'readwrite');
-                const store = transaction.objectStore('messages');
-                const request = store.clear();
-
-                request.onsuccess = () => resolve();
-                request.onerror = () => reject(request.error);
-            });
-        }
-    }
-
-    // Get filtered messages
-    getMessages(filter = {}) {
-        let filteredMessages = [...this.messages];
-
-        if (filter.category) {
-            filteredMessages = filteredMessages.filter(msg =>
-                msg.category.toLowerCase() === filter.category.toLowerCase()
-            );
-        }
-
-        if (filter.source) {
-            filteredMessages = filteredMessages.filter(msg =>
-                msg.source.toLowerCase().includes(filter.source.toLowerCase())
-            );
-        }
-
-        if (filter.since) {
-            const sinceDate = new Date(filter.since);
-            filteredMessages = filteredMessages.filter(msg =>
-                new Date(msg.timestamp) >= sinceDate
-            );
-        }
-
-        if (filter.limit) {
-            filteredMessages = filteredMessages.slice(0, filter.limit);
-        }
-
-        return filteredMessages;
-    }
-
-    // Update selection criteria
-    updateSelectionCriteria(updates) {
-        Object.assign(this.selectionCriteria, updates);
-        this.notifySubscribers({ type: 'criteria-updated', criteria: this.selectionCriteria });
-    }
-
-    // Add heading to monitoring
-    addHeadingToMonitoring(headingText) {
-        this.selectionCriteria.includedHeadings.add(headingText);
-    }
-
-    // Remove heading from monitoring
-    removeHeadingFromMonitoring(headingText) {
-        this.selectionCriteria.includedHeadings.delete(headingText);
-    }
-
-    // Scan document for available headings
-    scanDocumentHeadings() {
-        const headings = document.querySelectorAll('h1, h2, h3, h4, h5, h6');
-        return Array.from(headings)
-            .map(h => h.textContent.trim())
-            .filter(text => text.length > 0 && !text.toLowerCase().includes('control'));
-    }
-
-    // Subscribe to debug messages
-    subscribe(callback) {
-        this.subscribers.push(callback);
-        return () => {
-            const index = this.subscribers.indexOf(callback);
-            if (index > -1) {
-                this.subscribers.splice(index, 1);
-            }
-        };
-    }
-
-    // Notify all subscribers
-    notifySubscribers(message) {
-        this.subscribers.forEach(callback => {
-            try {
-                callback(message);
-            } catch (error) {
-                console.error('Debug subscriber error:', error);
-            }
-        });
-    }
-
-    // Toggle debug system
-    setEnabled(enabled) {
-        this.isEnabled = enabled;
-        this.addMessage(
-            `Debug system ${enabled ? 'enabled' : 'disabled'}`,
-            'INFO',
-            'DebugSystem',
-            { eventType: 'SYSTEM' }
-        );
-    }
-
-    // Get statistics
-    getStats() {
-        const stats = {
-            total: this.messages.length,
-            byCategory: {},
-            bySource: {},
-            enabled: this.isEnabled,
-            criteria: { ...this.selectionCriteria }
-        };
-
-        this.messages.forEach(msg => {
-            stats.byCategory[msg.category] = (stats.byCategory[msg.category] || 0) + 1;
-            stats.bySource[msg.source] = (stats.bySource[msg.source] || 0) + 1;
-        });
-
-        return stats;
-    }
-}
-
-// Initialize and expose globally
-window.MarkitectDebugSystem = new MarkitectDebugSystem();

markitect/static/js/core/section-manager.js

@@ -1,544 +0,0 @@
-/**
- * SectionManager Component
- *
- * Extracted from monolithic editor.js as part of architecture refactoring.
- * Manages the collection of sections and their state transitions.
- *
- * Dependencies:
- * - EditState enum (imported)
- * - SectionType enum (imported)
- * - Section class (imported)
- * - debug function (imported)
- */
-
-// Import dependencies - these will be separate modules
-const EditState = Object.freeze({
-    ORIGINAL: 'original',
-    EDITING: 'editing',
-    MODIFIED: 'modified',
-    SAVED: 'saved'
-});
-
-const SectionType = Object.freeze({
-    HEADING: 'heading',
-    PARAGRAPH: 'paragraph',
-    LIST: 'list',
-    CODE: 'code',
-    QUOTE: 'quote',
-    TABLE: 'table',
-    HR: 'hr',
-    IMAGE: 'image'
-});
-
-// Debug function (will be extracted to utils)
-function debug(message, category = 'INFO') {
-    // Simple console debug for now - will be enhanced later
-    console.log(`DEBUG ${category}: ${message}`);
-}
-
-/**
- * Section Class - manages individual section state and content
- */
-class Section {
-    constructor(id, markdown, type) {
-        this.id = id;
-        this.originalMarkdown = markdown;
-        this.currentMarkdown = markdown;
-        this.editingMarkdown = markdown;
-        this.pendingMarkdown = null;
-        this.type = type;
-        this.state = EditState.ORIGINAL;
-        this.domElement = null;
-        this.lastSaved = null;
-        this.created = new Date();
-    }
-
-    static generateId(markdown, position, strategy = 'hash', parentId = null) {
-        return this.generateIdWithStrategy(markdown, position, strategy, parentId);
-    }
-
-    static generateIdWithStrategy(markdown, position, strategy = 'hash', parentId = null) {
-        const sanitizedContent = this.sanitizeContentForId(markdown);
-        const normalizedContent = this.normalizeContentForHashing(sanitizedContent);
-        const sectionType = this.detectType(markdown);
-
-        switch (strategy) {
-            case 'timestamp':
-                return this.generateTimestampId(normalizedContent, position, sectionType);
-            case 'sequential':
-                return this.generateSequentialId(normalizedContent, position, sectionType);
-            case 'hierarchical':
-                return this.generateHierarchicalId(normalizedContent, position, parentId);
-            case 'hash':
-            default:
-                return this.generateAdvancedId(normalizedContent, position, sectionType);
-        }
-    }
-
-    static generateAdvancedId(content, position, sectionType) {
-        const contentHash = this.generateCryptoHash(content);
-        const safeType = sectionType || 'paragraph';
-        const typePrefix = safeType.substring(0, 3);
-        const positionHex = position.toString(16).padStart(2, '0');
-
-        return `section-${typePrefix}-${contentHash}-${positionHex}`;
-    }
-
-    static generateCryptoHash(content) {
-        let hash = 0;
-        if (content.length === 0) return '00000000';
-
-        for (let i = 0; i < content.length; i++) {
-            const char = content.charCodeAt(i);
-            hash = ((hash << 5) - hash) + char;
-            hash = hash & hash;
-        }
-
-        const hexHash = Math.abs(hash).toString(16).padStart(8, '0');
-        return hexHash.substring(0, 8);
-    }
-
-    static normalizeContentForHashing(content) {
-        if (!content || typeof content !== 'string') {
-            return '';
-        }
-
-        return content
-            .trim()
-            .replace(/\s+/g, ' ')
-            .replace(/\r\n/g, '\n')
-            .toLowerCase();
-    }
-
-    static sanitizeContentForId(content) {
-        if (!content || typeof content !== 'string') {
-            return '';
-        }
-
-        return content
-            .replace(/<[^>]*>/g, '')
-            .replace(/javascript:/gi, '')
-            .replace(/[^\w\s\-_.#]/g, '')
-            .trim();
-    }
-
-    static generateTimestampId(content, position = 0, sectionType = 'paragraph') {
-        const timestamp = Date.now().toString(36);
-        const contentSnippet = this.generateCryptoHash(content || '').substring(0, 4);
-        const safeType = sectionType || 'paragraph';
-        const typePrefix = safeType.substring(0, 3);
-
-        return `section-${typePrefix}-${contentSnippet}-${timestamp}`;
-    }
-
-    static generateSequentialId(content, position, sectionType = 'paragraph') {
-        const safeType = sectionType || 'paragraph';
-        const typePrefix = safeType.substring(0, 3);
-        const seqNumber = (position || 0).toString().padStart(3, '0');
-        const contentHash = this.generateCryptoHash(content || '').substring(0, 4);
-
-        return `section-${typePrefix}-seq${seqNumber}-${contentHash}`;
-    }
-
-    static generateHierarchicalId(content, position, parentId = null) {
-        const contentHash = this.generateCryptoHash(content || '').substring(0, 6);
-
-        if (parentId) {
-            const childIndex = (position || 0).toString().padStart(2, '0');
-            return `${parentId}-child-${childIndex}-${contentHash}`;
-        } else {
-            return `section-root-${position || 0}-${contentHash}`;
-        }
-    }
-
-    static detectType(markdown) {
-        if (!markdown || typeof markdown !== 'string') {
-            return SectionType.PARAGRAPH;
-        }
-
-        const content = markdown.replace(/^\n+|\n+$/g, '');
-        if (!content) {
-            return SectionType.PARAGRAPH;
-        }
-
-        const trimmed = content.trim();
-
-        // Detection order matters - most specific first
-        if (this.isHeading(trimmed)) {
-            return SectionType.HEADING;
-        }
-
-        if (this.isImage(trimmed)) {
-            return SectionType.IMAGE;
-        }
-
-        if (this.isCodeBlock(trimmed)) {
-            return SectionType.CODE;
-        }
-
-        return SectionType.PARAGRAPH;
-    }
-
-    static isHeading(trimmed) {
-        const headingPattern = /^#{1,6}\s+.+/;
-        return headingPattern.test(trimmed);
-    }
-
-    static isImage(trimmed) {
-        const imagePattern = /!\[.*?\]\([^)]+\)/;
-        return imagePattern.test(trimmed);
-    }
-
-    static isCodeBlock(trimmed) {
-        if (trimmed.startsWith('```') || trimmed.startsWith('~~~')) {
-            return true;
-        }
-        if (trimmed.includes('```') || trimmed.includes('~~~')) {
-            const codeBlockPattern = /```[\s\S]*?```|~~~[\s\S]*?~~~/;
-            if (codeBlockPattern.test(trimmed)) {
-                return true;
-            }
-        }
-        return false;
-    }
-
-    startEdit() {
-        if (this.state === EditState.EDITING) {
-            throw new Error(`Section ${this.id} is already being edited`);
-        }
-        this.editingMarkdown = this.pendingMarkdown || this.currentMarkdown;
-        this.state = EditState.EDITING;
-        return this.editingMarkdown;
-    }
-
-    updateContent(markdown) {
-        if (this.state !== EditState.EDITING) {
-            throw new Error(`Section ${this.id} is not in editing state`);
-        }
-        this.editingMarkdown = markdown;
-    }
-
-    acceptChanges() {
-        if (this.state !== EditState.EDITING) {
-            throw new Error(`Section ${this.id} is not in editing state`);
-        }
-        this.currentMarkdown = this.editingMarkdown;
-        this.editingMarkdown = null;
-        this.pendingMarkdown = null;
-        this.state = EditState.SAVED;
-        this.lastSaved = new Date();
-        return this.currentMarkdown;
-    }
-
-    cancelChanges() {
-        if (this.state !== EditState.EDITING) {
-            throw new Error(`Section ${this.id} is not in editing state`);
-        }
-        this.editingMarkdown = null;
-        if (this.pendingMarkdown !== null) {
-            this.state = EditState.MODIFIED;
-            return this.pendingMarkdown;
-        } else if (this.lastSaved !== null) {
-            this.state = EditState.SAVED;
-            return this.currentMarkdown;
-        } else {
-            this.state = this.hasChanges() ? EditState.MODIFIED : EditState.ORIGINAL;
-            return this.currentMarkdown;
-        }
-    }
-
-    stopEditing() {
-        if (this.state !== EditState.EDITING) {
-            return this.state;
-        }
-
-        if (this.editingMarkdown && this.editingMarkdown !== this.currentMarkdown) {
-            this.pendingMarkdown = this.editingMarkdown;
-            this.state = EditState.MODIFIED;
-        } else {
-            this.pendingMarkdown = null;
-            if (this.lastSaved !== null) {
-                this.state = EditState.SAVED;
-            } else {
-                this.state = this.hasChanges() ? EditState.MODIFIED : EditState.ORIGINAL;
-            }
-        }
-
-        this.editingMarkdown = null;
-        return this.state;
-    }
-
-    resetToOriginal() {
-        this.currentMarkdown = this.originalMarkdown;
-        this.editingMarkdown = this.originalMarkdown;
-        this.pendingMarkdown = null;
-        this.state = EditState.ORIGINAL;
-        return this.originalMarkdown;
-    }
-
-    isEditing() {
-        return this.state === EditState.EDITING;
-    }
-
-    hasChanges() {
-        return this.currentMarkdown !== this.originalMarkdown;
-    }
-
-    getStatus() {
-        return {
-            id: this.id,
-            state: this.state,
-            hasChanges: this.hasChanges(),
-            isEditing: this.isEditing(),
-            contentLength: this.currentMarkdown.length,
-            lastSaved: this.lastSaved,
-            type: this.type,
-            originalLength: this.originalMarkdown.length,
-            currentLength: this.currentMarkdown.length
-        };
-    }
-
-    isImage() {
-        return this.type === SectionType.IMAGE;
-    }
-
-    redetectType(content = null) {
-        const markdown = content || this.currentMarkdown;
-        const oldType = this.type;
-        this.type = Section.detectType(markdown);
-
-        if (oldType !== this.type) {
-            debug(`Section ${this.id} type changed from ${oldType} to ${this.type}`, 'TYPE_DETECTION');
-        }
-
-        return this.type;
-    }
-}
-
-/**
- * SectionManager - Manages the collection of sections
- */
-class SectionManager {
-    constructor() {
-        this.sections = new Map();
-        this.listeners = new Map();
-        this.statusInterval = null;
-        this.lastStatusUpdate = new Date().toISOString();
-    }
-
-    on(event, callback) {
-        if (!this.listeners.has(event)) {
-            this.listeners.set(event, []);
-        }
-        this.listeners.get(event).push(callback);
-    }
-
-    emit(event, data) {
-        if (this.listeners.has(event)) {
-            this.listeners.get(event).forEach(callback => callback(data));
-        }
-    }
-
-    createSectionsFromMarkdown(markdownContent) {
-        // Split content into blocks separated by double newlines
-        const blocks = markdownContent.split(/\n\s*\n/);
-        const sections = [];
-        let position = 0;
-
-        for (const block of blocks) {
-            const trimmedBlock = block.trim();
-            if (!trimmedBlock) continue;
-
-            // Check if this block should be split further
-            const lines = trimmedBlock.split('\n');
-            let currentSection = '';
-
-            for (let i = 0; i < lines.length; i++) {
-                const line = lines[i];
-                const isHeading = /^#{1,6}\s/.test(line.trim());
-                const isImage = /^\s*!\[.*?\]\(.*?\)\s*$/.test(line);
-
-                // Each heading or image starts a new section
-                if ((isHeading || isImage) && currentSection.trim()) {
-                    // Save the previous section
-                    const sectionId = Section.generateId(currentSection, position);
-                    const sectionType = Section.detectType(currentSection);
-                    const section = new Section(sectionId, currentSection.trim(), sectionType);
-                    sections.push(section);
-                    this.sections.set(sectionId, section);
-                    position++;
-                    currentSection = line;
-                } else {
-                    if (currentSection) currentSection += '\n';
-                    currentSection += line;
-                }
-            }
-
-            // Save the final section from this block
-            if (currentSection.trim()) {
-                const sectionId = Section.generateId(currentSection, position);
-                const sectionType = Section.detectType(currentSection);
-                const section = new Section(sectionId, currentSection.trim(), sectionType);
-                sections.push(section);
-                this.sections.set(sectionId, section);
-                position++;
-            }
-        }
-
-        this.emit('sections-created', { sections, count: sections.length });
-        return sections;
-    }
-
-    startEditing(sectionId) {
-        debug('MANAGER: startEditing called for: ' + sectionId, 'MANAGER');
-
-        const section = this.sections.get(sectionId);
-        if (!section) {
-            throw new Error(`Section ${sectionId} not found`);
-        }
-
-        if (section.isEditing()) {
-            debug('MANAGER: Section already in editing state: ' + sectionId, 'MANAGER');
-            return section.editingMarkdown;
-        }
-
-        debug('MANAGER: Starting edit for section: ' + sectionId, 'MANAGER');
-        const content = section.startEdit();
-
-        debug('MANAGER: About to emit edit-started event for: ' + sectionId, 'MANAGER');
-        this.emit('edit-started', { sectionId, content, section: section.getStatus() });
-        debug('MANAGER: Emitted edit-started event for: ' + sectionId, 'MANAGER');
-
-        return content;
-    }
-
-    updateContent(sectionId, markdown) {
-        const section = this.sections.get(sectionId);
-        if (!section) {
-            throw new Error(`Section ${sectionId} not found`);
-        }
-
-        const oldType = section.type;
-        section.updateContent(markdown);
-        const newType = section.redetectType(markdown);
-
-        const eventData = {
-            sectionId,
-            markdown,
-            section: section.getStatus(),
-            typeChanged: oldType !== newType,
-            oldType,
-            newType
-        };
-
-        this.emit('content-updated', eventData);
-
-        if (oldType !== newType) {
-            this.emit('section-type-changed', {
-                sectionId,
-                oldType,
-                newType,
-                section: section.getStatus()
-            });
-        }
-    }
-
-    acceptChanges(sectionId) {
-        const section = this.sections.get(sectionId);
-        if (!section) {
-            throw new Error(`Section ${sectionId} not found`);
-        }
-
-        const content = section.acceptChanges();
-        this.emit('changes-accepted', { sectionId, content, section: section.getStatus() });
-        return content;
-    }
-
-    cancelChanges(sectionId) {
-        const section = this.sections.get(sectionId);
-        if (!section) {
-            throw new Error(`Section ${sectionId} not found`);
-        }
-
-        const content = section.cancelChanges();
-        this.emit('changes-cancelled', { sectionId, content, section: section.getStatus() });
-        return content;
-    }
-
-    resetSection(sectionId) {
-        const section = this.sections.get(sectionId);
-        if (!section) {
-            throw new Error(`Section ${sectionId} not found`);
-        }
-
-        const content = section.resetToOriginal();
-        this.emit('section-reset', { sectionId, content, section: section.getStatus() });
-        return content;
-    }
-
-    getDocumentMarkdown() {
-        const sortedSections = Array.from(this.sections.values())
-            .sort((a, b) => a.created - b.created);
-
-        return sortedSections.map(section => section.currentMarkdown).join('\n\n');
-    }
-
-    getAllSections() {
-        return Array.from(this.sections.values());
-    }
-
-    getDocumentStatus() {
-        const sections = Array.from(this.sections.values());
-        const editingSections = sections.filter(section => section.isEditing).length;
-
-        return {
-            totalSections: sections.length,
-            editingSections: editingSections
-        };
-    }
-
-    extractHeadings(content) {
-        if (!content) return [];
-        const lines = content.split('\n');
-        return lines.filter(line => /^#{1,6}\s/.test(line.trim()));
-    }
-
-    handleSectionSplit(sectionId, newContent) {
-        const section = this.sections.get(sectionId);
-        if (!section) {
-            throw new Error(`Section ${sectionId} not found`);
-        }
-
-        // Remove the original section
-        this.sections.delete(sectionId);
-
-        // Create new sections from the content
-        const newSections = this.createSectionsFromMarkdown(newContent);
-
-        // Emit section-split event
-        this.emit('section-split', {
-            originalSectionId: sectionId,
-            newSections: newSections,
-            count: newSections.length
-        });
-
-        return newSections;
-    }
-
-    createSectionsFromContent(content) {
-        return this.createSectionsFromMarkdown(content);
-    }
-}
-
-// Export for use in tests and other modules
-if (typeof module !== 'undefined' && module.exports) {
-    module.exports = { SectionManager, Section, EditState, SectionType };
-}
-
-// Export for browser use
-if (typeof window !== 'undefined') {
-    window.SectionManager = SectionManager;
-    window.Section = Section;
-    window.EditState = EditState;
-    window.SectionType = SectionType;
-}

markitect/static/js/main-updated.js

@@ -1,227 +0,0 @@
-/**
- * Main Markitect JavaScript Entry Point - Clean Architecture Version
- *
- * Uses ONLY the JSON configuration interface - NO Python-generated JavaScript!
- * Initializes all controls and systems when document is ready
- * Implements graceful degradation for missing dependencies
- */
-
-// Main application module
-const MarkitectMain = {
-    initialized: false,
-    config: null,
-
-    // Initialize the complete application
-    initialize: function() {
-        if (this.initialized) {
-            console.log('⚠️ MarkitectMain already initialized, skipping');
-            return;
-        }
-
-        console.log('🚀 MarkitectMain initializing...');
-
-        try {
-            // Get configuration - if not loaded, use defaults
-            this.config = window.markitectConfig;
-            if (!this.config || !this.config.loaded) {
-                console.warn('⚠️ Configuration not loaded, proceeding with defaults');
-                this.config = {
-                    markdownContent: document.querySelector('#markdown-content')?.textContent || '',
-                    mode: 'edit',
-                    theme: 'github'
-                };
-            }
-
-            // Initialize core systems
-            this.initializeCoreComponents();
-            this.initializeControlPanels();
-            this.setupEventHandlers();
-            this.renderContent();
-
-            this.initialized = true;
-            console.log('✅ MarkitectMain initialization complete');
-
-        } catch (error) {
-            console.error('❌ MarkitectMain initialization failed:', error);
-            this.fallbackMode();
-        }
-    },
-
-    // Initialize core modular components
-    initializeCoreComponents: function() {
-        console.log('🔧 Initializing core components...');
-
-        const container = document.getElementById('markdown-content') || document.body;
-
-        // Initialize section manager
-        if (typeof SectionManager !== 'undefined') {
-            this.sectionManager = new SectionManager();
-            console.log('✅ SectionManager initialized');
-        } else {
-            throw new Error('SectionManager not available');
-        }
-
-        // Initialize DOM renderer
-        if (typeof DOMRenderer !== 'undefined') {
-            this.domRenderer = new DOMRenderer(this.sectionManager, container);
-            console.log('✅ DOMRenderer initialized');
-        } else {
-            throw new Error('DOMRenderer not available');
-        }
-
-        // Initialize debug panel
-        if (typeof DebugPanel !== 'undefined') {
-            this.debugPanel = new DebugPanel();
-            console.log('✅ DebugPanel initialized');
-        }
-
-        // Legacy DocumentControls removed - functionality now in enhanced control panels
-    },
-
-    // Initialize enhanced control panels with compass positioning
-    initializeControlPanels: function() {
-        console.log('🎛️ Initializing enhanced control panels with compass positioning...');
-
-        // ContentsControl (West)
-        if (typeof ContentsControl !== 'undefined') {
-            this.contentsControl = new ContentsControl();
-            this.contentsControl.config.position = 'w';
-            this.contentsControl.show();
-            window.contentsControl = this.contentsControl;
-            console.log('✅ ContentsControl initialized (West) with enhanced ControlBase');
-        }
-
-        // StatusControl (East)
-        if (typeof StatusControl !== 'undefined') {
-            this.statusControl = new StatusControl();
-            this.statusControl.config.position = 'e';
-            this.statusControl.show();
-            window.statusControl = this.statusControl;
-            console.log('✅ StatusControl initialized (East) with enhanced ControlBase');
-        }
-
-        // DebugControl (Southeast)
-        if (typeof DebugControl !== 'undefined') {
-            this.debugControl = new DebugControl();
-            this.debugControl.config.position = 'se';
-            this.debugControl.show();
-            window.debugControl = this.debugControl;
-            console.log('✅ DebugControl initialized (Southeast) with enhanced ControlBase');
-        }
-
-        // EditControl (Northeast)
-        if (typeof EditControl !== 'undefined') {
-            this.editControl = new EditControl();
-            this.editControl.config.position = 'ne';
-            this.editControl.show();
-            window.editControl = this.editControl;
-            console.log('✅ EditControl initialized (Northeast) with enhanced ControlBase');
-        }
-    },
-
-    // Setup core event handlers (enhanced control panels handle their own events)
-    setupEventHandlers: function() {
-        console.log('🔌 Setting up core event handlers...');
-
-        // Setup section manager event handlers for debug panel
-        if (this.sectionManager && this.debugPanel) {
-            this.sectionManager.on('sections-created', (data) => {
-                this.debugPanel.addMessage(`Created ${data.count} sections`, 'INFO');
-            });
-
-            this.sectionManager.on('edit-started', (data) => {
-                this.debugPanel.addMessage(`Edit started for section: ${data.sectionId}`, 'DEBUG');
-            });
-
-            this.sectionManager.on('changes-accepted', (data) => {
-                this.debugPanel.addMessage(`Changes accepted for section: ${data.sectionId}`, 'SUCCESS');
-                this.updateSectionDOM(data.sectionId);
-            });
-
-            this.sectionManager.on('changes-cancelled', (data) => {
-                this.debugPanel.addMessage(`Changes cancelled for section: ${data.sectionId}`, 'WARNING');
-            });
-        }
-
-        // Make core components available globally for enhanced controls
-        window.sectionManager = this.sectionManager;
-        window.domRenderer = this.domRenderer;
-        window.debugPanel = this.debugPanel;
-
-        console.log('✅ Core event handlers and global references set up');
-    },
-
-    // Render content using the configuration
-    renderContent: function() {
-        console.log('📄 Rendering markdown content...');
-
-        const markdownToRender = this.config.markdownContent || '';
-        if (markdownToRender.trim()) {
-            const sections = this.sectionManager.createSectionsFromMarkdown(markdownToRender);
-            this.domRenderer.renderAllSections(sections);
-
-            if (this.debugPanel) {
-                this.debugPanel.addMessage(`Initialized with ${sections.length} sections`, 'INFO');
-            }
-            console.log(`✅ Rendered ${sections.length} sections`);
-        } else {
-            if (this.debugPanel) {
-                this.debugPanel.addMessage('No markdown content to initialize', 'WARNING');
-            }
-            console.warn('⚠️ No markdown content to render');
-        }
-    },
-
-    // Update section DOM after changes
-    updateSectionDOM: function(sectionId) {
-        try {
-            const section = this.sectionManager.sections.get(sectionId);
-            if (section) {
-                const sectionElement = this.domRenderer.findSectionElement(sectionId);
-                if (sectionElement) {
-                    const newElement = this.domRenderer.renderSection(section);
-                    sectionElement.parentNode.replaceChild(newElement, sectionElement);
-
-                    if (this.debugPanel) {
-                        this.debugPanel.addMessage(`DOM updated for section: ${sectionId}`, 'INFO');
-                    }
-                }
-            }
-        } catch (error) {
-            console.error('❌ Failed to update section DOM:', error);
-        }
-    },
-
-    // Fallback mode if initialization fails
-    fallbackMode: function() {
-        console.warn('⚠️ Running in fallback mode');
-
-        // Basic content rendering fallback
-        const contentDiv = document.getElementById('markdown-content');
-        if (contentDiv && this.config && this.config.markdownContent) {
-            const basicHtml = this.config.markdownContent
-                .replace(/^# (.*$)/gim, '<h1>$1</h1>')
-                .replace(/^## (.*$)/gim, '<h2>$1</h2>')
-                .replace(/^### (.*$)/gim, '<h3>$1</h3>')
-                .replace(/\n\n/g, '</p><p>')
-                .replace(/\n/g, '<br>');
-
-            contentDiv.innerHTML = `<p>${basicHtml}</p>`;
-            console.log('✅ Fallback content rendered');
-        }
-    }
-};
-
-// Make components globally available for debugging
-window.MarkitectMain = MarkitectMain;
-
-// Auto-initialize when DOM is ready
-if (document.readyState === 'loading') {
-    document.addEventListener('DOMContentLoaded', function() {
-        // Small delay to ensure config is loaded
-        setTimeout(() => MarkitectMain.initialize(), 100);
-    });
-} else {
-    // DOM already ready
-    setTimeout(() => MarkitectMain.initialize(), 100);
-}

markitect/static/js/main.js

@@ -1,201 +0,0 @@
-/**
- * Main Markitect JavaScript Entry Point
- * Initializes all controls and systems when document is ready
- * Implements graceful degradation for missing dependencies
- * Supports Fail Fast strict mode for development
- */
-
-// Development mode detection
-const MARKITECT_STRICT_MODE = (
-    window.location.hostname === 'localhost' ||
-    window.location.hostname === '127.0.0.1' ||
-    window.location.search.includes('strict=true') ||
-    window.markitectStrictMode === true
-);
-
-// Utility functions for safe initialization
-const MarkitectMain = {
-    // Safe dependency checking with timeout
-    checkDependencies: function() {
-        const dependencies = {
-            debugSystem: !!window.MarkitectDebugSystem,
-            control: !!window.Control,
-            statusControl: !!window.StatusControl,
-            debugControl: !!window.DebugControl,
-            contentsControl: !!window.ContentsControl,
-            editControl: !!window.EditControl
-        };
-
-        console.log('📋 Dependency check results:', dependencies);
-        return dependencies;
-    },
-
-    // Safe logging that works even without debug system
-    safeLog: function(message, level = 'INFO', component = 'Main', data = {}) {
-        console.log(`[${level}] ${component}: ${message}`);
-
-        // In strict mode, throw on errors for immediate development feedback
-        if (MARKITECT_STRICT_MODE && level === 'ERROR') {
-            console.error(`🚨 STRICT MODE: Throwing error for immediate diagnosis`);
-            throw new Error(`${component}: ${message}`);
-        }
-
-        // Try to use debug system if available
-        if (window.MarkitectDebugSystem && window.MarkitectDebugSystem.addMessage) {
-            try {
-                window.MarkitectDebugSystem.addMessage(message, level, component, { ...data, eventType: 'SYSTEM' });
-            } catch (error) {
-                console.warn('Debug system logging failed:', error);
-                if (MARKITECT_STRICT_MODE) {
-                    throw error; // Fail fast in development
-                }
-            }
-        }
-    },
-
-    // Safe control initialization with fallbacks
-    initializeControl: function(controlClass, controlName, icon = '🔧') {
-        const timeout = setTimeout(() => {
-            const message = `${controlName} initialization timed out`;
-            console.warn(message);
-            if (MARKITECT_STRICT_MODE) {
-                throw new Error(message); // Fail fast in development
-            }
-        }, 5000);
-
-        try {
-            if (!controlClass) {
-                const message = `${controlName} class not available, skipping`;
-                this.safeLog(message, MARKITECT_STRICT_MODE ? 'ERROR' : 'WARNING');
-                clearTimeout(timeout);
-                return null;
-            }
-
-            const controlInstance = new controlClass();
-            if (!controlInstance || typeof controlInstance.createControl !== 'function') {
-                throw new Error(`Invalid ${controlName} instance`);
-            }
-
-            const element = controlInstance.createControl();
-            if (!element) {
-                throw new Error(`${controlName} failed to create element`);
-            }
-
-            clearTimeout(timeout);
-            this.safeLog(`${controlName} initialized successfully`, 'SUCCESS');
-            return controlInstance;
-
-        } catch (error) {
-            clearTimeout(timeout);
-            this.safeLog(`${controlName} initialization failed: ${error.message}`, 'ERROR');
-
-            // Create minimal fallback control if core Control class exists
-            if (window.Control && controlName === 'StatusControl') {
-                return this.createFallbackControl(controlName, icon);
-            }
-
-            return null;
-        }
-    },
-
-    // Create minimal fallback control for essential controls
-    createFallbackControl: function(name, icon) {
-        try {
-            const fallback = Object.create(window.Control);
-            fallback.config = {
-                icon: icon,
-                title: `${name} (Fallback)`,
-                className: `${name.toLowerCase()}-fallback`,
-                defaultContent: `${name} is running in fallback mode due to initialization issues.`,
-                ariaLabel: `${name} Fallback Control`,
-                position: 'e'
-            };
-
-            const element = fallback.createControl();
-            if (element) {
-                this.safeLog(`${name} fallback control created`, 'INFO');
-                return { control: fallback };
-            }
-        } catch (error) {
-            this.safeLog(`Fallback control creation failed: ${error.message}`, 'ERROR');
-        }
-        return null;
-    },
-
-    // Main initialization with comprehensive error handling
-    initialize: function() {
-        this.safeLog('🚀 Initializing Markitect controls and systems...', 'INFO');
-
-        // Check dependencies first
-        const deps = this.checkDependencies();
-
-        if (!deps.control) {
-            this.safeLog('❌ Core Control system not available, cannot initialize UI controls', 'ERROR');
-            return;
-        }
-
-        const initializedControls = {};
-        let successCount = 0;
-        let totalAttempts = 0;
-
-        // Initialize controls with graceful degradation
-        const controlsToInit = [
-            { class: window.StatusControl, name: 'StatusControl', key: 'statusControl', icon: '📊', essential: true },
-            { class: window.DebugControl, name: 'DebugControl', key: 'debugControl', icon: '🪲', essential: false },
-            { class: window.ContentsControl, name: 'ContentsControl', key: 'contentsControl', icon: '☰', essential: false },
-            { class: window.EditControl, name: 'EditControl', key: 'editControl', icon: '✏️', essential: false }
-        ];
-
-        controlsToInit.forEach(({ class: controlClass, name, key, icon, essential }) => {
-            totalAttempts++;
-            const instance = this.initializeControl(controlClass, name, icon);
-
-            if (instance) {
-                initializedControls[key] = instance.control || instance;
-                window[key] = initializedControls[key];
-                successCount++;
-            } else if (essential) {
-                this.safeLog(`Essential control ${name} failed to initialize`, 'ERROR');
-            }
-        });
-
-        // Report initialization results
-        const successRate = Math.round((successCount / totalAttempts) * 100);
-        if (successCount === totalAttempts) {
-            this.safeLog('✅ All controls initialized successfully', 'SUCCESS');
-        } else if (successCount > 0) {
-            this.safeLog(`⚠️ Partial initialization: ${successCount}/${totalAttempts} controls (${successRate}%) initialized`, 'WARNING');
-        } else {
-            this.safeLog('❌ No controls could be initialized', 'ERROR');
-        }
-
-        // Set up global error handlers for runtime protection
-        this.setupErrorHandlers();
-
-        this.safeLog(`✅ Markitect initialization complete (${successCount}/${totalAttempts} controls active)`, 'INFO');
-    },
-
-    // Set up global error handlers
-    setupErrorHandlers: function() {
-        // Catch unhandled errors
-        window.addEventListener('error', (event) => {
-            this.safeLog(`Unhandled error: ${event.message} at ${event.filename}:${event.lineno}`, 'ERROR');
-        });
-
-        // Catch unhandled promise rejections
-        window.addEventListener('unhandledrejection', (event) => {
-            this.safeLog(`Unhandled promise rejection: ${event.reason}`, 'ERROR');
-            event.preventDefault(); // Prevent console spam
-        });
-    }
-};
-
-// Initialize when DOM is ready with additional safety
-if (document.readyState === 'loading') {
-    document.addEventListener('DOMContentLoaded', () => {
-        setTimeout(() => MarkitectMain.initialize(), 100); // Brief delay for dependencies
-    });
-} else {
-    // DOM already loaded
-    setTimeout(() => MarkitectMain.initialize(), 100);
-}

markitect/static/js/plugins/document-navigator-plugin.js

@@ -1,207 +0,0 @@
-/**
- * DocumentNavigator Plugin Definition
- *
- * Plugin definition for the Substack-style document navigation widget.
- * Provides floating table of contents with smooth scrolling and scroll spy.
- */
-export default {
-    name: 'DocumentNavigator',
-    version: '1.0.0',
-    description: 'Substack-style floating document navigation with table of contents',
-    author: 'Markitect Core',
-    category: 'navigation',
-
-    // Dependencies that must be loaded first
-    dependencies: ['UIWidget'],
-
-    // Mixins to apply (none required for this widget)
-    mixins: [],
-
-    // Lazy load the actual widget class
-    async load() {
-        const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-        return DocumentNavigator;
-    },
-
-    // Default configuration
-    defaultOptions: {
-        position: 'left',               // 'left' or 'right' side
-        collapsed: true,                // Start in collapsed state
-        autoHide: true,                 // Hide on mobile devices
-        maxHeadingLevel: 3,            // Include H1, H2, H3
-        enableScrollSpy: true,          // Highlight current section
-        smoothScroll: true,             // Smooth scroll to headings
-        animationDuration: 300,         // Animation timing in ms
-        minHeadings: 2,                // Minimum headings to show widget
-        theme: 'default',              // Theme variant
-
-        // Layout options
-        width: '280px',                // Expanded width
-        collapsedWidth: '40px',        // Collapsed width
-        offset: {                      // Position offset
-            top: '80px',
-            side: '20px'
-        },
-
-        // Accessibility
-        enableKeyboard: true,           // Keyboard navigation support
-        ariaLabel: 'Document Navigation'
-    },
-
-    // Plugin lifecycle hooks
-    async onLoad(instance, options) {
-        console.log('DocumentNavigator plugin loaded:', {
-            headings: instance.headings.length,
-            position: options.position,
-            collapsed: options.collapsed
-        });
-
-        // Auto-initialize after load
-        await instance.initialize();
-
-        return instance;
-    },
-
-    async onUnload(instance) {
-        console.log('DocumentNavigator plugin unloading');
-        await instance.destroy();
-    },
-
-    // Feature flags and capabilities
-    capabilities: {
-        draggable: false,              // Not draggable (fixed position)
-        resizable: false,              // Not resizable (fixed width)
-        themeable: true,               // Supports themes
-        persistent: false,             // Rebuilds on page changes
-        responsive: true,              // Responsive behavior
-        keyboard: true,                // Keyboard accessible
-        scrollSpy: true,              // Scroll spy functionality
-        smoothScroll: true            // Smooth scroll navigation
-    },
-
-    // Integration requirements
-    requirements: {
-        container: true,               // Requires container element
-        headings: true,               // Requires document headings
-        scrollable: true              // Requires scrollable content
-    },
-
-    // Event types emitted by this widget
-    events: [
-        'rendered',                   // Widget rendered to DOM
-        'navigate',                   // User navigated to heading
-        'toggle',                     // Widget expanded/collapsed
-        'theme-changed',              // Theme was changed
-        'destroyed'                   // Widget was destroyed
-    ],
-
-    // CSS classes used by this widget
-    cssClasses: [
-        'document-navigator',         // Main widget class
-        'navigator-toggle',           // Toggle button
-        'navigator-list',            // Navigation list
-        'navigator-item',            // Navigation items
-        'navigator-link',            // Navigation links
-        'navigator-header',          // List header
-        'navigator-close',           // Close button
-        'navigator-empty'            // Empty state
-    ],
-
-    // Theme variants
-    themes: {
-        default: {
-            backgroundColor: 'rgba(255, 255, 255, 0.95)',
-            borderColor: '#e1e5e9',
-            textColor: '#333',
-            activeColor: '#1976d2',
-            activeBackground: '#e3f2fd'
-        },
-        dark: {
-            backgroundColor: 'rgba(45, 45, 45, 0.95)',
-            borderColor: '#555',
-            textColor: '#e0e0e0',
-            activeColor: '#64b5f6',
-            activeBackground: '#1e3a8a'
-        },
-        minimal: {
-            backgroundColor: 'rgba(248, 249, 250, 0.90)',
-            borderColor: '#dee2e6',
-            textColor: '#495057',
-            activeColor: '#007bff',
-            activeBackground: '#e7f1ff'
-        }
-    },
-
-    // Usage examples
-    examples: {
-        basic: {
-            description: 'Basic document navigator on the left side',
-            code: `
-                const navigator = await widgetSystem.createWidget('DocumentNavigator');
-                await navigator.show();
-            `
-        },
-        customized: {
-            description: 'Customized navigator with specific options',
-            code: `
-                const navigator = await widgetSystem.createWidget('DocumentNavigator', {
-                    position: 'right',
-                    collapsed: false,
-                    maxHeadingLevel: 4,
-                    theme: 'dark'
-                });
-                await navigator.show();
-            `
-        },
-        withContainer: {
-            description: 'Navigator for specific container content',
-            code: `
-                const container = document.getElementById('article-content');
-                const navigator = await widgetSystem.createWidget('DocumentNavigator', {
-                    container: container,
-                    minHeadings: 1
-                });
-                await navigator.show();
-            `
-        }
-    },
-
-    // Development and testing helpers
-    dev: {
-        testHeadingStructure() {
-            // Helper to create test content with headings
-            const testContent = `
-                <h1>Chapter 1: Introduction</h1>
-                <p>Lorem ipsum content...</p>
-                <h2>Section 1.1: Overview</h2>
-                <h3>Subsection 1.1.1: Details</h3>
-                <h2>Section 1.2: Implementation</h2>
-                <h1>Chapter 2: Advanced Topics</h1>
-                <h2>Section 2.1: Performance</h2>
-            `;
-
-            const container = document.createElement('div');
-            container.innerHTML = testContent;
-            container.style.cssText = 'height: 2000px; padding: 2rem;';
-            document.body.appendChild(container);
-
-            return container;
-        },
-
-        async createTestInstance(options = {}) {
-            // Helper to create test instance with sample content
-            const container = this.testHeadingStructure();
-
-            const navigator = new (await this.load())({
-                container,
-                collapsed: false,
-                ...options
-            });
-
-            await navigator.initialize();
-            await navigator.render();
-
-            return { navigator, container };
-        }
-    }
-};

markitect/static/js/tests/refactor-test-runner.js

@@ -1,216 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * TDD Test Runner for JavaScript Refactoring
- *
- * Drives component extraction and testing during architecture refactoring.
- * Ensures all functionality remains stable while achieving separation of concerns.
- */
-
-class RefactorTestRunner {
-    constructor() {
-        this.tests = [];
-        this.passed = 0;
-        this.failed = 0;
-        this.currentSuite = null;
-        this.setupDOM();
-    }
-
-    setupDOM() {
-        // Set up minimal DOM environment for testing
-        if (typeof document === 'undefined') {
-            const { JSDOM } = require('jsdom');
-            const dom = new JSDOM('<!DOCTYPE html><html><body></body></html>', {
-                url: 'http://localhost',
-                pretendToBeVisual: true,
-                resources: 'usable'
-            });
-
-            global.window = dom.window;
-            global.document = dom.window.document;
-            global.HTMLElement = dom.window.HTMLElement;
-            global.Event = dom.window.Event;
-            global.CustomEvent = dom.window.CustomEvent;
-
-            // Only set navigator if it doesn't exist
-            if (typeof global.navigator === 'undefined') {
-                global.navigator = dom.window.navigator;
-            }
-        }
-    }
-
-    describe(suiteName, fn) {
-        console.log(`\n📁 ${suiteName}`);
-        this.currentSuite = suiteName;
-        fn();
-        this.currentSuite = null;
-    }
-
-    it(testName, fn) {
-        const fullName = this.currentSuite ? `${this.currentSuite}: ${testName}` : testName;
-
-        try {
-            fn();
-            console.log(`  ✅ ${testName}`);
-            this.passed++;
-        } catch (error) {
-            console.log(`  ❌ ${testName}`);
-            console.log(`     Error: ${error.message}`);
-            if (error.stack) {
-                console.log(`     Stack: ${error.stack.split('\n')[1]?.trim()}`);
-            }
-            this.failed++;
-        }
-    }
-
-    expect(actual) {
-        return {
-            toBe: (expected) => {
-                if (actual !== expected) {
-                    throw new Error(`Expected ${expected}, got ${actual}`);
-                }
-            },
-            toBeTruthy: () => {
-                if (!actual) {
-                    throw new Error(`Expected truthy value, got ${actual}`);
-                }
-            },
-            toBeFalsy: () => {
-                if (actual) {
-                    throw new Error(`Expected falsy value, got ${actual}`);
-                }
-            },
-            toEqual: (expected) => {
-                if (JSON.stringify(actual) !== JSON.stringify(expected)) {
-                    throw new Error(`Expected ${JSON.stringify(expected)}, got ${JSON.stringify(actual)}`);
-                }
-            },
-            toContain: (expected) => {
-                if (!actual.includes(expected)) {
-                    throw new Error(`Expected ${actual} to contain ${expected}`);
-                }
-            },
-            toHaveProperty: (property) => {
-                if (!(property in actual)) {
-                    throw new Error(`Expected object to have property ${property}`);
-                }
-            },
-            toBeInstanceOf: (expectedClass) => {
-                if (!(actual instanceof expectedClass)) {
-                    throw new Error(`Expected instance of ${expectedClass.name}, got ${actual.constructor.name}`);
-                }
-            }
-        };
-    }
-
-    /**
-     * Test that a component can be extracted from the monolith without breaking functionality
-     */
-    testComponentExtraction(componentName, extractFn, originalTests) {
-        this.describe(`Component Extraction: ${componentName}`, () => {
-            this.it('should extract without syntax errors', () => {
-                try {
-                    const component = extractFn();
-                    this.expect(component).toBeTruthy();
-                } catch (error) {
-                    throw new Error(`Component extraction failed: ${error.message}`);
-                }
-            });
-
-            this.it('should maintain original API', () => {
-                const component = extractFn();
-                originalTests.forEach(test => {
-                    try {
-                        test(component);
-                    } catch (error) {
-                        throw new Error(`API compatibility test failed: ${error.message}`);
-                    }
-                });
-            });
-        });
-    }
-
-    /**
-     * Test component integration after extraction
-     */
-    testComponentIntegration(components, integrationTests) {
-        this.describe('Component Integration', () => {
-            integrationTests.forEach((test, index) => {
-                this.it(`integration test ${index + 1}`, () => {
-                    test(components);
-                });
-            });
-        });
-    }
-
-    /**
-     * Setup test environment with mock dependencies
-     */
-    setupTestEnvironment() {
-        // Create test container
-        const container = document.createElement('div');
-        container.id = 'test-container';
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        // Mock any global dependencies
-        global.mockSectionManager = {
-            sections: new Map(),
-            createSectionsFromMarkdown: () => [],
-            startEditing: () => true,
-            stopEditing: () => true,
-            getAllSections: () => []
-        };
-
-        return { container };
-    }
-
-    /**
-     * Cleanup test environment
-     */
-    cleanupTestEnvironment() {
-        const container = document.getElementById('test-container');
-        if (container) {
-            container.remove();
-        }
-
-        // Clear any global mocks
-        delete global.mockSectionManager;
-    }
-
-    async run() {
-        console.log('🧪 TDD Refactoring Test Runner Starting...\n');
-
-        const startTime = Date.now();
-
-        // Run all collected tests
-        // Tests will be added by importing component test files
-
-        const endTime = Date.now();
-        const duration = endTime - startTime;
-
-        console.log(`\n📊 Test Results:`);
-        console.log(`   ✅ Passed: ${this.passed}`);
-        console.log(`   ❌ Failed: ${this.failed}`);
-        console.log(`   ⏱️  Duration: ${duration}ms`);
-
-        if (this.failed > 0) {
-            console.log(`\n❌ ${this.failed} test(s) failed. Refactoring should not proceed.`);
-            process.exit(1);
-        } else {
-            console.log(`\n✅ All tests passed! Refactoring is safe to continue.`);
-        }
-    }
-}
-
-// Export for use in component tests
-if (typeof module !== 'undefined' && module.exports) {
-    module.exports = { RefactorTestRunner };
-}
-
-// Export for browser use
-if (typeof window !== 'undefined') {
-    window.RefactorTestRunner = RefactorTestRunner;
-}
-
-module.exports = RefactorTestRunner;

markitect/static/js/tests/test-component-integration.js

@@ -1,521 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * Comprehensive Component Integration Test
- *
- * Tests that extracted components work together properly.
- * Verifies the complete workflow: Section Creation → Rendering → Editing → Saving
- */
-
-const RefactorTestRunner = require('./refactor-test-runner.js');
-
-const runner = new RefactorTestRunner();
-
-runner.describe('Component Integration Tests', () => {
-
-    runner.it('should load all extracted components', () => {
-        try {
-            // Load extracted components
-            const sectionModule = require('../core/section-manager.js');
-            const domModule = require('../components/dom-renderer.js');
-
-            runner.expect(sectionModule.SectionManager).toBeTruthy();
-            runner.expect(sectionModule.Section).toBeTruthy();
-            runner.expect(domModule.DOMRenderer).toBeTruthy();
-            runner.expect(domModule.FloatingMenu).toBeTruthy();
-
-            // Set globals for other tests
-            global.ExtractedSectionManager = sectionModule.SectionManager;
-            global.ExtractedSection = sectionModule.Section;
-            global.ExtractedDOMRenderer = domModule.DOMRenderer;
-            global.ExtractedFloatingMenu = domModule.FloatingMenu;
-            global.ExtractedEditState = sectionModule.EditState;
-
-        } catch (error) {
-            throw new Error(`Failed to load extracted components: ${error.message}`);
-        }
-    });
-
-    runner.it('should support complete section creation workflow', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-
-        // Setup
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Test workflow: Create sections from markdown
-        const testMarkdown = `# Main Heading
-This is the introduction content.
-
-## Subheading One
-Content for first subsection.
-
-![Test Image](https://example.com/image.jpg)
-
-## Subheading Two
-Content for second subsection.`;
-
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-
-
-        // Verify sections were created
-        // Expected: heading+paragraph, heading+paragraph, image, heading+paragraph = 4 sections
-        runner.expect(sections.length).toBe(4);
-        runner.expect(sections[0].type).toBe('heading');
-        runner.expect(sections[2].type).toBe('image');
-
-        // Verify DOM rendering
-        domRenderer.renderAllSections(sections);
-        const renderedElements = container.querySelectorAll('.ui-edit-section');
-        runner.expect(renderedElements.length).toBe(sections.length);
-
-        // Cleanup
-        document.body.removeChild(container);
-    });
-
-    runner.it('should support complete editing workflow', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const EditState = global.ExtractedEditState;
-
-        // Setup
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Create and render sections
-        const testMarkdown = '# Test Heading\nOriginal content here.';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-        const section = sectionManager.sections.get(sectionId);
-
-        // Test workflow: Start editing
-        runner.expect(section.state).toBe(EditState.ORIGINAL);
-        runner.expect(section.isEditing()).toBeFalsy();
-
-        const content = sectionManager.startEditing(sectionId);
-        runner.expect(content).toContain('Test Heading');
-        runner.expect(section.isEditing()).toBeTruthy();
-        runner.expect(section.state).toBe(EditState.EDITING);
-
-        // Test workflow: Update content
-        const newContent = '# Updated Heading\nModified content here.';
-        sectionManager.updateContent(sectionId, newContent);
-        runner.expect(section.editingMarkdown).toBe(newContent);
-
-        // Test workflow: Accept changes
-        sectionManager.acceptChanges(sectionId);
-        runner.expect(section.currentMarkdown).toBe(newContent);
-        runner.expect(section.state).toBe(EditState.SAVED);
-        runner.expect(section.isEditing()).toBeFalsy();
-
-        // Cleanup
-        document.body.removeChild(container);
-    });
-
-    runner.it('should support accept/cancel button functionality', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-
-        // Setup
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Create and render sections
-        const testMarkdown = '# Test Heading\nOriginal content here.';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-        const section = sectionManager.sections.get(sectionId);
-
-        // Start editing to trigger floating menu with buttons
-        sectionManager.startEditing(sectionId);
-
-        // Check if floating menu exists
-        runner.expect(domRenderer.currentFloatingMenu).toBeTruthy();
-        runner.expect(domRenderer.currentFloatingMenu.isVisible).toBeTruthy();
-
-        // Find buttons in the floating menu
-        const menuElement = domRenderer.currentFloatingMenu.element;
-        runner.expect(menuElement).toBeTruthy();
-
-        const buttons = menuElement.querySelectorAll('button');
-        runner.expect(buttons.length >= 2).toBeTruthy(); // At least Accept and Cancel buttons
-
-        const acceptBtn = Array.from(buttons).find(btn => btn.textContent === 'Accept');
-        const cancelBtn = Array.from(buttons).find(btn => btn.textContent === 'Cancel');
-
-        runner.expect(acceptBtn).toBeTruthy();
-        runner.expect(cancelBtn).toBeTruthy();
-
-        // Test Accept button functionality
-        runner.expect(section.isEditing()).toBeTruthy();
-
-        // Simulate updating content and clicking Accept
-        const textarea = menuElement.querySelector('textarea');
-        runner.expect(textarea).toBeTruthy();
-        textarea.value = '# Updated Heading\nUpdated content via button.';
-
-        acceptBtn.click();
-
-        // After clicking Accept, section should be saved and menu hidden
-        runner.expect(section.isEditing()).toBeFalsy();
-        runner.expect(section.currentMarkdown).toContain('Updated Heading');
-        runner.expect(domRenderer.currentFloatingMenu).toBeFalsy();
-
-        // Cleanup
-        document.body.removeChild(container);
-    });
-
-    runner.it('should support cancel button functionality', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-
-        // Setup
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Create and render sections
-        const testMarkdown = '# Original Heading\nOriginal content here.';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-        const section = sectionManager.sections.get(sectionId);
-
-        // Start editing
-        sectionManager.startEditing(sectionId);
-
-        // Find buttons in the floating menu
-        const menuElement = domRenderer.currentFloatingMenu.element;
-        const cancelBtn = Array.from(menuElement.querySelectorAll('button')).find(btn => btn.textContent === 'Cancel');
-
-        runner.expect(cancelBtn).toBeTruthy();
-        runner.expect(section.isEditing()).toBeTruthy();
-
-        // Simulate changing content but then canceling
-        const textarea = menuElement.querySelector('textarea');
-        textarea.value = '# Changed Heading\nThis should be discarded.';
-
-        cancelBtn.click();
-
-        // After clicking Cancel, section should not be saved and menu hidden
-        runner.expect(section.isEditing()).toBeFalsy();
-        runner.expect(section.currentMarkdown).toContain('Original Heading'); // Original content preserved
-        runner.expect(domRenderer.currentFloatingMenu).toBeFalsy();
-
-        // Cleanup
-        document.body.removeChild(container);
-    });
-
-    runner.it('should support event-driven communication', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-
-        // Setup
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Track events
-        let sectionsCreatedEvent = null;
-        let editStartedEvent = null;
-
-        sectionManager.on('sections-created', (data) => {
-            sectionsCreatedEvent = data;
-        });
-
-        sectionManager.on('edit-started', (data) => {
-            editStartedEvent = data;
-        });
-
-        // Test event: sections-created
-        const testMarkdown = '# Test\nContent';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-
-        runner.expect(sectionsCreatedEvent).toBeTruthy();
-        runner.expect(sectionsCreatedEvent.sections).toEqual(sections);
-        runner.expect(sectionsCreatedEvent.count).toBe(1);
-
-        // Test event: edit-started
-        const sectionId = sections[0].id;
-        sectionManager.startEditing(sectionId);
-
-        runner.expect(editStartedEvent).toBeTruthy();
-        runner.expect(editStartedEvent.sectionId).toBe(sectionId);
-        runner.expect(editStartedEvent.content).toContain('Test');
-
-        // Cleanup
-        document.body.removeChild(container);
-    });
-
-    runner.it('should support section type detection and rendering', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const Section = global.ExtractedSection;
-
-        // Setup
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Test different section types
-        const testMarkdown = `# Heading Section
-Regular paragraph content.
-
-![Image Section](https://example.com/test.jpg)
-
-\`\`\`javascript
-// Code section
-console.log('test');
-\`\`\``;
-
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-
-
-        // Verify type detection - adjusted for actual parsing behavior
-        // Expected: heading+paragraph, image, code = 3 sections
-        runner.expect(sections[0].type).toBe('heading'); // Combined heading+paragraph
-        runner.expect(sections[1].type).toBe('image');   // Image section
-        runner.expect(sections[2].type).toBe('code');    // Code section
-
-        // Verify image detection
-        runner.expect(sections[1].isImage()).toBeTruthy(); // Image is now at index 1
-        runner.expect(sections[0].isImage()).toBeFalsy();
-
-        // Verify rendering handles different types
-        domRenderer.renderAllSections(sections);
-        const renderedElements = container.querySelectorAll('.ui-edit-section');
-        runner.expect(renderedElements.length).toBe(sections.length);
-
-        // Cleanup
-        document.body.removeChild(container);
-    });
-
-    runner.it('should support FloatingMenu integration', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const FloatingMenu = global.ExtractedFloatingMenu;
-
-        // Setup
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Create and render sections
-        const testMarkdown = '# Test Heading\nTest content';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-
-        // Test showing editor (which uses FloatingMenu)
-        domRenderer.showEditor(sectionId, 'test content');
-
-        // Verify floating menu state
-        runner.expect(domRenderer.currentFloatingMenu).toBeTruthy();
-        runner.expect(domRenderer.currentFloatingMenu.sectionId).toBe(sectionId);
-        runner.expect(domRenderer.currentFloatingMenu.isVisible).toBeTruthy();
-        runner.expect(domRenderer.editingSections.has(sectionId)).toBeTruthy();
-
-        // Test hiding editor
-        domRenderer.hideCurrentEditor();
-        runner.expect(domRenderer.currentFloatingMenu).toBeFalsy();
-        runner.expect(domRenderer.editingSections.has(sectionId)).toBeFalsy();
-
-        // Cleanup
-        document.body.removeChild(container);
-    });
-
-    runner.it('should support complete click-to-edit workflow', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-
-        // Setup
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Create and render sections
-        const testMarkdown = '# Test Heading\nTest content for editing';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-        const element = domRenderer.findSectionElement(sectionId);
-
-        // Simulate click event
-        const clickEvent = new Event('click', { bubbles: true });
-        Object.defineProperty(clickEvent, 'target', { value: element });
-
-        // Test complete workflow
-        domRenderer.handleSectionClick(clickEvent);
-
-        // Verify editing state was triggered
-        const section = sectionManager.sections.get(sectionId);
-        runner.expect(section.isEditing()).toBeTruthy();
-        runner.expect(domRenderer.editingSections.has(sectionId)).toBeTruthy();
-        runner.expect(domRenderer.currentFloatingMenu).toBeTruthy();
-
-        // Cleanup
-        document.body.removeChild(container);
-    });
-
-    runner.it('should support document status tracking', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-
-        const sectionManager = new SectionManager();
-        const container = document.createElement('div');
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Test initial status
-        let status = sectionManager.getDocumentStatus();
-        runner.expect(status.totalSections).toBe(0);
-        runner.expect(status.editingSections).toBe(0);
-
-        // Create sections
-        const testMarkdown = '# Section 1\nContent 1\n\n# Section 2\nContent 2';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-
-        status = sectionManager.getDocumentStatus();
-        runner.expect(status.totalSections).toBe(2);
-        runner.expect(status.editingSections).toBe(2); // Bug compatibility (isEditing property exists)
-
-        // Test getAllSections
-        const allSections = sectionManager.getAllSections();
-        runner.expect(allSections.length).toBe(2);
-        runner.expect(allSections[0].currentMarkdown).toContain('Section 1');
-        runner.expect(allSections[1].currentMarkdown).toContain('Section 2');
-    });
-
-    runner.it('should support event tracking and analytics', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-
-        const container = document.createElement('div');
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Test event tracking
-        domRenderer.trackEvent('test-event', { data: 'test' });
-        domRenderer.trackEvent('section-click', { sectionId: 'test-123' });
-
-        const stats = domRenderer.getEventStats();
-        runner.expect(stats.totalEvents).toBe(1); // Only section-click is tracked in stats
-        runner.expect(stats.stats['section-click']).toBe(1);
-        runner.expect(stats.recentEvents.length).toBe(2);
-        runner.expect(stats.recentEvents[0].type).toBe('test-event');
-        runner.expect(stats.recentEvents[1].type).toBe('section-click');
-    });
-
-    // Integration stress test
-    runner.it('should handle complex document with multiple operations', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-
-        // Setup
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        // Complex document
-        const complexMarkdown = `# Document Title
-Introduction paragraph with some content.
-
-## Section A
-Content for section A with details.
-
-![Test Image](https://example.com/test.jpg)
-
-### Subsection A.1
-More detailed content here.
-
-\`\`\`javascript
-function test() {
-    console.log('code block');
-}
-\`\`\`
-
-## Section B
-Final section content.`;
-
-        // Create and render
-        const sections = sectionManager.createSectionsFromMarkdown(complexMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        runner.expect(sections.length).toBe(6); // Adjusted based on actual parsing
-
-        // Test editing multiple sections
-        const firstSection = sections[0];
-        const imageSection = sections.find(s => s.isImage());
-        const codeSection = sections.find(s => s.type === 'code');
-
-        // Edit first section
-        sectionManager.startEditing(firstSection.id);
-        sectionManager.updateContent(firstSection.id, '# Updated Title\nUpdated intro.');
-        sectionManager.acceptChanges(firstSection.id);
-
-        // Edit image section
-        sectionManager.startEditing(imageSection.id);
-        sectionManager.updateContent(imageSection.id, '![Updated Image](https://example.com/new.jpg)');
-        sectionManager.acceptChanges(imageSection.id);
-
-        // Verify changes
-        runner.expect(firstSection.currentMarkdown).toContain('Updated Title');
-        runner.expect(imageSection.currentMarkdown).toContain('Updated Image');
-
-        // Verify document reconstruction
-        const finalMarkdown = sectionManager.getDocumentMarkdown();
-        runner.expect(finalMarkdown).toContain('Updated Title');
-        runner.expect(finalMarkdown).toContain('Updated Image');
-        runner.expect(finalMarkdown).toContain('Section B');
-
-        // Cleanup
-        document.body.removeChild(container);
-    });
-});
-
-module.exports = runner;
-
-// Run tests if called directly
-if (require.main === module) {
-    console.log('🧪 Running Component Integration Tests');
-    runner.run().then(() => {
-        console.log('✅ Component integration tests completed');
-    });
-}

markitect/static/js/tests/test-debugpanel-extraction.js

@@ -1,191 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * TDD Test for Debug Panel Component Extraction
- *
- * Tests the extraction of DebugPanel from the monolithic editor.js
- * DebugPanel handles debug message display and management.
- */
-
-const RefactorTestRunner = require('./refactor-test-runner.js');
-
-const runner = new RefactorTestRunner();
-
-// Define expected DebugPanel API
-const EXPECTED_DEBUGPANEL_API = [
-    'constructor',
-    'toggle',
-    'update',
-    'clear',
-    'addMessage',
-    'show',
-    'hide',
-    'getMessageCount',
-    'getRecentMessages'
-];
-
-runner.describe('DebugPanel Component Extraction', () => {
-
-    runner.it('should define expected API methods', () => {
-        const expectedMethods = EXPECTED_DEBUGPANEL_API;
-        runner.expect(expectedMethods.length).toBe(9);
-        runner.expect(expectedMethods).toContain('toggle');
-        runner.expect(expectedMethods).toContain('update');
-        runner.expect(expectedMethods).toContain('addMessage');
-    });
-
-    runner.it('should load extracted DebugPanel component', () => {
-        // Load the extracted component
-        delete require.cache[require.resolve('../components/debug-panel.js')];
-
-        try {
-            const module = require('../components/debug-panel.js');
-            runner.expect(module.DebugPanel).toBeTruthy();
-
-            // Set global for other tests
-            global.ExtractedDebugPanel = module.DebugPanel;
-        } catch (error) {
-            throw new Error(`Failed to load extracted DebugPanel: ${error.message}`);
-        }
-    });
-
-    runner.it('should preserve constructor functionality', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        const debugPanel = new DebugPanel();
-        runner.expect(debugPanel).toBeInstanceOf(DebugPanel);
-        runner.expect(debugPanel.messages).toBeInstanceOf(Array);
-        runner.expect(debugPanel.isActive).toBeFalsy();
-    });
-
-    runner.it('should preserve message handling functionality', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        const debugPanel = new DebugPanel();
-
-        // Test adding messages
-        debugPanel.addMessage('Test message', 'INFO');
-        runner.expect(debugPanel.getMessageCount()).toBe(1);
-
-        const recentMessages = debugPanel.getRecentMessages(1);
-        runner.expect(recentMessages.length).toBe(1);
-        runner.expect(recentMessages[0].message).toBe('Test message');
-        runner.expect(recentMessages[0].category).toBe('INFO');
-    });
-
-    runner.it('should preserve toggle functionality', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        // Create container element
-        const container = document.createElement('div');
-        container.id = 'debug-messages-container';
-        container.style.display = 'none';
-        document.body.appendChild(container);
-
-        const debugButton = document.createElement('button');
-        debugButton.id = 'toggle-debug';
-        debugButton.textContent = '🔍 Debug';
-        document.body.appendChild(debugButton);
-
-        const debugPanel = new DebugPanel();
-
-        // Test toggle on
-        debugPanel.toggle();
-        runner.expect(debugPanel.isActive).toBeTruthy();
-
-        // Test toggle off
-        debugPanel.toggle();
-        runner.expect(debugPanel.isActive).toBeFalsy();
-
-        // Cleanup
-        document.body.removeChild(container);
-        document.body.removeChild(debugButton);
-    });
-
-    runner.it('should preserve update functionality', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        const container = document.createElement('div');
-        container.id = 'debug-messages-container';
-        document.body.appendChild(container);
-
-        const debugButton = document.createElement('button');
-        debugButton.id = 'toggle-debug';
-        debugButton.textContent = '🔍 Debug';
-        document.body.appendChild(debugButton);
-
-        const debugPanel = new DebugPanel();
-        debugPanel.show();
-
-        debugPanel.addMessage('Test message 1', 'INFO');
-        debugPanel.addMessage('Test message 2', 'ERROR');
-        debugPanel.update();
-
-        runner.expect(container.innerHTML.length > 100).toBeTruthy();
-        runner.expect(container.innerHTML).toContain('Test message 1');
-        runner.expect(container.innerHTML).toContain('Test message 2');
-
-        // Cleanup
-        document.body.removeChild(container);
-        document.body.removeChild(debugButton);
-    });
-
-    runner.it('should preserve clear functionality', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        const debugPanel = new DebugPanel();
-
-        debugPanel.addMessage('Test message 1', 'INFO');
-        debugPanel.addMessage('Test message 2', 'ERROR');
-        runner.expect(debugPanel.getMessageCount()).toBe(2);
-
-        debugPanel.clear();
-        runner.expect(debugPanel.getMessageCount()).toBe(0);
-    });
-
-    runner.it('should have core debug panel methods', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        const debugPanel = new DebugPanel();
-
-        // Should have core methods
-        runner.expect(typeof debugPanel.toggle === 'function').toBeTruthy();
-        runner.expect(typeof debugPanel.update === 'function').toBeTruthy();
-        runner.expect(typeof debugPanel.addMessage === 'function').toBeTruthy();
-        runner.expect(typeof debugPanel.clear === 'function').toBeTruthy();
-    });
-
-    runner.it('should handle message categories properly', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        const debugPanel = new DebugPanel();
-
-        // Test different message categories
-        debugPanel.addMessage('Info message', 'INFO');
-        debugPanel.addMessage('Warning message', 'WARNING');
-        debugPanel.addMessage('Error message', 'ERROR');
-        debugPanel.addMessage('Success message', 'SUCCESS');
-
-        const messages = debugPanel.getRecentMessages(4);
-        runner.expect(messages.length).toBe(4);
-
-        const categories = messages.map(m => m.category);
-        runner.expect(categories).toContain('INFO');
-        runner.expect(categories).toContain('WARNING');
-        runner.expect(categories).toContain('ERROR');
-        runner.expect(categories).toContain('SUCCESS');
-    });
-});
-
-module.exports = {
-    runner,
-    EXPECTED_DEBUGPANEL_API
-};
-
-// Run tests if called directly
-if (require.main === module) {
-    console.log('🧪 Testing DebugPanel Component Extraction');
-    runner.run().then(() => {
-        console.log('✅ DebugPanel extraction tests completed');
-    });
-}

markitect/static/js/tests/test-debugpanel-integration.js

@@ -1,210 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * DebugPanel Integration Test
- *
- * Tests that the extracted DebugPanel component integrates properly
- * with the existing SectionManager and DOMRenderer components.
- */
-
-const RefactorTestRunner = require('./refactor-test-runner.js');
-
-const runner = new RefactorTestRunner();
-
-runner.describe('DebugPanel Integration Tests', () => {
-
-    runner.it('should load all extracted components including DebugPanel', () => {
-        try {
-            // Load extracted components
-            const sectionModule = require('../core/section-manager.js');
-            const domModule = require('../components/dom-renderer.js');
-            const debugModule = require('../components/debug-panel.js');
-
-            runner.expect(sectionModule.SectionManager).toBeTruthy();
-            runner.expect(domModule.DOMRenderer).toBeTruthy();
-            runner.expect(debugModule.DebugPanel).toBeTruthy();
-
-            // Set globals for other tests
-            global.ExtractedSectionManager = sectionModule.SectionManager;
-            global.ExtractedDOMRenderer = domModule.DOMRenderer;
-            global.ExtractedDebugPanel = debugModule.DebugPanel;
-
-        } catch (error) {
-            throw new Error(`Failed to load extracted components: ${error.message}`);
-        }
-    });
-
-    runner.it('should support debug panel with section editing workflow', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        // Setup DOM elements
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const debugContainer = document.createElement('div');
-        debugContainer.id = 'debug-messages-container';
-        debugContainer.style.display = 'none';
-        document.body.appendChild(debugContainer);
-
-        const debugButton = document.createElement('button');
-        debugButton.id = 'toggle-debug';
-        debugButton.textContent = '🔍 Debug';
-        document.body.appendChild(debugButton);
-
-        // Create components
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-        const debugPanel = new DebugPanel();
-
-        // Test workflow: Create sections and debug them
-        const testMarkdown = '# Test Heading\nTest content for debugging';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        // Add debug messages
-        debugPanel.addMessage('Section created: ' + sections[0].id, 'INFO');
-        debugPanel.addMessage('DOM rendered successfully', 'SUCCESS');
-
-        runner.expect(debugPanel.getMessageCount()).toBe(2);
-
-        // Test showing debug panel
-        debugPanel.show();
-        runner.expect(debugPanel.isActive).toBeTruthy();
-
-        // Test debug panel content
-        const messages = debugPanel.getRecentMessages(2);
-        runner.expect(messages[0].message).toContain('Section created');
-        runner.expect(messages[1].message).toContain('DOM rendered');
-
-        // Cleanup
-        document.body.removeChild(container);
-        document.body.removeChild(debugContainer);
-        document.body.removeChild(debugButton);
-    });
-
-    runner.it('should support debug panel clearing and message management', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        const debugPanel = new DebugPanel();
-
-        // Add multiple messages
-        for (let i = 0; i < 10; i++) {
-            debugPanel.addMessage(`Test message ${i}`, i % 2 === 0 ? 'INFO' : 'WARNING');
-        }
-
-        runner.expect(debugPanel.getMessageCount()).toBe(10);
-
-        // Test getting recent messages
-        const recentFive = debugPanel.getRecentMessages(5);
-        runner.expect(recentFive.length).toBe(5);
-        runner.expect(recentFive[4].message).toContain('Test message 9');
-
-        // Test clearing
-        debugPanel.clear();
-        runner.expect(debugPanel.getMessageCount()).toBe(0);
-    });
-
-    runner.it('should handle debug panel DOM integration properly', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        // Setup DOM
-        const debugContainer = document.createElement('div');
-        debugContainer.id = 'debug-messages-container';
-        debugContainer.style.display = 'none';
-        document.body.appendChild(debugContainer);
-
-        const debugButton = document.createElement('button');
-        debugButton.id = 'toggle-debug';
-        debugButton.textContent = '🔍 Debug';
-        debugButton.style.background = '#6c757d';
-        document.body.appendChild(debugButton);
-
-        const debugPanel = new DebugPanel();
-
-        // Test initial state
-        runner.expect(debugPanel.isActive).toBeFalsy();
-        runner.expect(debugContainer.style.display).toBe('none');
-
-        // Test toggle on
-        debugPanel.toggle();
-        runner.expect(debugPanel.isActive).toBeTruthy();
-        runner.expect(debugContainer.style.display).toBe('block');
-        runner.expect(debugButton.textContent).toContain('Debug (ON)');
-
-        // Test toggle off
-        debugPanel.toggle();
-        runner.expect(debugPanel.isActive).toBeFalsy();
-        runner.expect(debugContainer.style.display).toBe('none');
-        runner.expect(debugButton.textContent).toBe('🔍 Debug');
-
-        // Cleanup
-        document.body.removeChild(debugContainer);
-        document.body.removeChild(debugButton);
-    });
-
-    runner.it('should handle missing DOM elements gracefully', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        const debugPanel = new DebugPanel();
-
-        // Try to toggle without DOM elements (should not throw)
-        try {
-            debugPanel.toggle();
-            debugPanel.show();
-            debugPanel.hide();
-            debugPanel.update();
-            runner.expect(true).toBeTruthy(); // If we get here, no errors were thrown
-        } catch (error) {
-            throw new Error(`DebugPanel should handle missing DOM gracefully: ${error.message}`);
-        }
-    });
-
-    runner.it('should support event-driven debug message addition', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DebugPanel = global.ExtractedDebugPanel;
-
-        const sectionManager = new SectionManager();
-        const debugPanel = new DebugPanel();
-
-        // Listen to section manager events and add debug messages
-        let eventCount = 0;
-
-        sectionManager.on('sections-created', (data) => {
-            debugPanel.addMessage(`Sections created: ${data.count} sections`, 'INFO');
-            eventCount++;
-        });
-
-        sectionManager.on('edit-started', (data) => {
-            debugPanel.addMessage(`Edit started for section: ${data.sectionId}`, 'DEBUG');
-            eventCount++;
-        });
-
-        // Create sections
-        const testMarkdown = '# Test\nContent';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-
-        // Start editing
-        sectionManager.startEditing(sections[0].id);
-
-        // Verify debug messages were added
-        runner.expect(eventCount).toBe(2);
-        runner.expect(debugPanel.getMessageCount()).toBe(2);
-
-        const messages = debugPanel.getRecentMessages(2);
-        runner.expect(messages[0].message).toContain('Sections created');
-        runner.expect(messages[1].message).toContain('Edit started');
-    });
-});
-
-module.exports = runner;
-
-// Run tests if called directly
-if (require.main === module) {
-    console.log('🧪 Running DebugPanel Integration Tests');
-    runner.run().then(() => {
-        console.log('✅ DebugPanel integration tests completed');
-    });
-}

markitect/static/js/tests/test-document-navigator-runner.html

@@ -1,193 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>DocumentNavigator TDD Test Runner</title>
-    <style>
-        body {
-            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-            max-width: 1000px;
-            margin: 0 auto;
-            padding: 2rem;
-            background-color: #f8f9fa;
-        }
-        .test-header {
-            background: white;
-            padding: 2rem;
-            border-radius: 8px;
-            margin-bottom: 2rem;
-            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
-        }
-        .test-output {
-            background: #1a1a1a;
-            color: #00ff00;
-            font-family: 'Courier New', monospace;
-            padding: 1rem;
-            border-radius: 8px;
-            margin-top: 1rem;
-            white-space: pre-wrap;
-            overflow-x: auto;
-            max-height: 400px;
-        }
-        .run-button {
-            background: #007bff;
-            color: white;
-            border: none;
-            padding: 12px 24px;
-            border-radius: 6px;
-            font-size: 16px;
-            cursor: pointer;
-            transition: background 0.2s;
-        }
-        .run-button:hover {
-            background: #0056b3;
-        }
-        .run-button:disabled {
-            background: #6c757d;
-            cursor: not-allowed;
-        }
-        .status {
-            margin-top: 1rem;
-            padding: 1rem;
-            border-radius: 6px;
-            font-weight: bold;
-        }
-        .status.running {
-            background: #fff3cd;
-            color: #856404;
-        }
-        .status.passed {
-            background: #d4edda;
-            color: #155724;
-        }
-        .status.failed {
-            background: #f8d7da;
-            color: #721c24;
-        }
-    </style>
-</head>
-<body>
-    <div class="test-header">
-        <h1>📋 DocumentNavigator Widget TDD Test Suite</h1>
-        <p>
-            This test suite follows Test-Driven Development methodology to implement a Substack-style
-            floating document navigation widget. The tests define the expected behavior before
-            implementation begins.
-        </p>
-
-        <div>
-            <strong>Test Coverage:</strong>
-            <ul>
-                <li>✅ Widget class structure and inheritance</li>
-                <li>✅ Configuration and initialization</li>
-                <li>✅ DOM rendering and UI elements</li>
-                <li>✅ Heading extraction and hierarchy building</li>
-                <li>✅ Navigation functionality and smooth scrolling</li>
-                <li>✅ Expand/collapse behavior</li>
-                <li>✅ Scroll spy and active section detection</li>
-                <li>✅ Responsive behavior and auto-hide</li>
-                <li>✅ Keyboard navigation support</li>
-                <li>✅ Event emission and user interaction</li>
-                <li>✅ Edge cases and error handling</li>
-            </ul>
-        </div>
-
-        <button id="runTests" class="run-button">🧪 Run TDD Test Suite</button>
-
-        <div id="status" class="status" style="display: none;"></div>
-    </div>
-
-    <div id="testOutput" class="test-output" style="display: none;"></div>
-
-    <script type="module">
-        const runButton = document.getElementById('runTests');
-        const statusDiv = document.getElementById('status');
-        const outputDiv = document.getElementById('testOutput');
-
-        // Capture console output
-        const originalConsoleLog = console.log;
-        const originalConsoleError = console.error;
-        let capturedOutput = '';
-
-        function captureConsole() {
-            capturedOutput = '';
-
-            console.log = (...args) => {
-                capturedOutput += args.join(' ') + '\n';
-                originalConsoleLog(...args);
-            };
-
-            console.error = (...args) => {
-                capturedOutput += 'ERROR: ' + args.join(' ') + '\n';
-                originalConsoleError(...args);
-            };
-        }
-
-        function restoreConsole() {
-            console.log = originalConsoleLog;
-            console.error = originalConsoleError;
-        }
-
-        function updateStatus(message, type) {
-            statusDiv.textContent = message;
-            statusDiv.className = `status ${type}`;
-            statusDiv.style.display = 'block';
-        }
-
-        function showOutput() {
-            outputDiv.textContent = capturedOutput;
-            outputDiv.style.display = 'block';
-        }
-
-        runButton.addEventListener('click', async () => {
-            runButton.disabled = true;
-            updateStatus('🧪 Running tests...', 'running');
-
-            captureConsole();
-
-            try {
-                // Import and run tests
-                const { runner } = await import('./test-document-navigator.js');
-
-                console.log('Starting DocumentNavigator TDD Test Suite...\n');
-                console.log('Note: Tests are expected to FAIL initially (Red phase of TDD)');
-                console.log('We will implement functionality to make them pass (Green phase).\n');
-
-                await runner.run();
-
-                if (runner.results.failed === 0) {
-                    updateStatus(`🎉 All ${runner.results.total} tests passed!`, 'passed');
-                } else {
-                    updateStatus(`❌ ${runner.results.failed} of ${runner.results.total} tests failed (Expected in TDD Red phase)`, 'failed');
-                }
-
-            } catch (error) {
-                console.error('Test execution failed:', error);
-                updateStatus('💥 Test execution failed - this is expected in TDD Red phase', 'failed');
-            } finally {
-                restoreConsole();
-                showOutput();
-                runButton.disabled = false;
-            }
-        });
-
-        // Auto-run tests on page load for development
-        document.addEventListener('DOMContentLoaded', () => {
-            console.log('DocumentNavigator TDD Test Runner loaded');
-            console.log('Ready to run tests - click the button above');
-        });
-    </script>
-
-    <!-- Test content for heading extraction tests -->
-    <div style="display: none;" id="test-content">
-        <h1>Test Chapter 1</h1>
-        <p>Sample content for testing heading extraction.</p>
-        <h2>Section 1.1</h2>
-        <h3>Subsection 1.1.1</h3>
-        <p>More sample content.</p>
-        <h2>Section 1.2</h2>
-        <h1>Test Chapter 2</h1>
-    </div>
-</body>
-</html>

markitect/static/js/tests/test-document-navigator.js

@@ -1,432 +0,0 @@
-/**
- * TDD Test Suite for DocumentNavigator Widget
- *
- * Tests the Substack-style floating navigation widget for document headings.
- * Following TDD methodology: write tests first, then implement functionality.
- */
-
-// Simple test runner for browser environment
-class DocumentNavigatorTestRunner {
-    constructor() {
-        this.tests = [];
-        this.results = {
-            passed: 0,
-            failed: 0,
-            total: 0
-        };
-    }
-
-    test(name, testFn) {
-        this.tests.push({ name, testFn });
-    }
-
-    expect(actual) {
-        return {
-            toBe: (expected) => {
-                if (actual !== expected) {
-                    throw new Error(`Expected ${actual} to be ${expected}`);
-                }
-            },
-            toBeInstanceOf: (expectedClass) => {
-                if (!(actual instanceof expectedClass)) {
-                    throw new Error(`Expected ${actual} to be instance of ${expectedClass.name}`);
-                }
-            },
-            toBeTruthy: () => {
-                if (!actual) {
-                    throw new Error(`Expected ${actual} to be truthy`);
-                }
-            },
-            toBeFalsy: () => {
-                if (actual) {
-                    throw new Error(`Expected ${actual} to be falsy`);
-                }
-            },
-            toContain: (expected) => {
-                if (typeof actual === 'string' && !actual.includes(expected)) {
-                    throw new Error(`Expected "${actual}" to contain "${expected}"`);
-                }
-                if (Array.isArray(actual) && !actual.includes(expected)) {
-                    throw new Error(`Expected array to contain ${expected}`);
-                }
-            },
-            toHaveLength: (expected) => {
-                if (actual.length !== expected) {
-                    throw new Error(`Expected length ${actual.length} to be ${expected}`);
-                }
-            },
-            toBeGreaterThan: (expected) => {
-                if (actual <= expected) {
-                    throw new Error(`Expected ${actual} to be greater than ${expected}`);
-                }
-            }
-        };
-    }
-
-    async run() {
-        console.log('🧪 Running DocumentNavigator TDD Test Suite...\n');
-
-        for (const { name, testFn } of this.tests) {
-            this.results.total++;
-
-            try {
-                await testFn.call(this);
-                this.results.passed++;
-                console.log(`✅ ${name}`);
-            } catch (error) {
-                this.results.failed++;
-                console.log(`❌ ${name}`);
-                console.log(`   ${error.message}\n`);
-            }
-        }
-
-        this.printSummary();
-    }
-
-    printSummary() {
-        console.log(`\n📊 Test Results:`);
-        console.log(`   Passed: ${this.results.passed}`);
-        console.log(`   Failed: ${this.results.failed}`);
-        console.log(`   Total:  ${this.results.total}`);
-
-        if (this.results.failed === 0) {
-            console.log(`\n🎉 All tests passed!`);
-        } else {
-            console.log(`\n❌ ${this.results.failed} test(s) failed.`);
-        }
-    }
-}
-
-// Create test runner
-const runner = new DocumentNavigatorTestRunner();
-
-// Test Suite: DocumentNavigator Widget
-runner.test('DocumentNavigator class should exist and be importable', async function() {
-    // This test will fail initially - we haven't created the class yet
-    try {
-        const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-        this.expect(DocumentNavigator).toBeTruthy();
-        this.expect(typeof DocumentNavigator).toBe('function');
-    } catch (error) {
-        throw new Error(`DocumentNavigator class not found: ${error.message}`);
-    }
-});
-
-runner.test('DocumentNavigator should extend UIWidget', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-    const { UIWidget } = await import('../widgets/base/UIWidget.js');
-
-    const navigator = new DocumentNavigator();
-    this.expect(navigator).toBeInstanceOf(UIWidget);
-});
-
-runner.test('DocumentNavigator should initialize with default configuration', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    const navigator = new DocumentNavigator();
-
-    // Test default configuration
-    this.expect(navigator.config.position).toBe('left');
-    this.expect(navigator.config.collapsed).toBe(true);
-    this.expect(navigator.config.autoHide).toBe(true);
-    this.expect(navigator.config.maxHeadingLevel).toBe(3);
-    this.expect(navigator.config.enableScrollSpy).toBe(true);
-});
-
-runner.test('DocumentNavigator should accept custom configuration', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    const customConfig = {
-        position: 'right',
-        collapsed: false,
-        maxHeadingLevel: 4,
-        theme: 'dark'
-    };
-
-    const navigator = new DocumentNavigator(customConfig);
-
-    this.expect(navigator.config.position).toBe('right');
-    this.expect(navigator.config.collapsed).toBe(false);
-    this.expect(navigator.config.maxHeadingLevel).toBe(4);
-    this.expect(navigator.config.theme).toBe('dark');
-});
-
-runner.test('DocumentNavigator should render floating panel element', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    const navigator = new DocumentNavigator();
-    await navigator.render();
-
-    this.expect(navigator.element).toBeInstanceOf(HTMLElement);
-    this.expect(navigator.element.classList.contains('document-navigator')).toBeTruthy();
-    this.expect(navigator.element.style.position).toBe('fixed');
-});
-
-runner.test('DocumentNavigator should have toggle button in collapsed state', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    const navigator = new DocumentNavigator({ collapsed: true });
-    await navigator.render();
-
-    const toggleButton = navigator.findElement('.navigator-toggle');
-    this.expect(toggleButton).toBeInstanceOf(HTMLElement);
-    this.expect(toggleButton.style.display).not.toBe('none');
-
-    const navList = navigator.findElement('.navigator-list');
-    this.expect(navList.style.display).toBe('none');
-});
-
-runner.test('DocumentNavigator should extract headings from document', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    // Create test document with headings
-    const testContainer = document.createElement('div');
-    testContainer.innerHTML = `
-        <h1 id="heading1">First Heading</h1>
-        <p>Some content</p>
-        <h2 id="heading2">Second Heading</h2>
-        <h3 id="heading3">Third Heading</h3>
-        <p>More content</p>
-        <h2 id="heading4">Fourth Heading</h2>
-    `;
-    document.body.appendChild(testContainer);
-
-    const navigator = new DocumentNavigator({
-        container: testContainer,
-        maxHeadingLevel: 3
-    });
-
-    const headings = navigator.extractHeadings();
-
-    this.expect(headings).toHaveLength(4);
-    this.expect(headings[0].tagName).toBe('H1');
-    this.expect(headings[0].textContent).toBe('First Heading');
-    this.expect(headings[1].tagName).toBe('H2');
-    this.expect(headings[2].tagName).toBe('H3');
-    this.expect(headings[3].tagName).toBe('H2');
-
-    // Cleanup
-    document.body.removeChild(testContainer);
-});
-
-runner.test('DocumentNavigator should build navigation hierarchy', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    // Create test document with nested headings
-    const testContainer = document.createElement('div');
-    testContainer.innerHTML = `
-        <h1>Chapter 1</h1>
-        <h2>Section 1.1</h2>
-        <h3>Subsection 1.1.1</h3>
-        <h3>Subsection 1.1.2</h3>
-        <h2>Section 1.2</h2>
-        <h1>Chapter 2</h1>
-    `;
-    document.body.appendChild(testContainer);
-
-    const navigator = new DocumentNavigator({ container: testContainer });
-    await navigator.render();
-
-    const navItems = navigator.buildNavigationTree();
-
-    // Should have hierarchical structure
-    this.expect(navItems).toHaveLength(2); // 2 H1 elements
-    this.expect(navItems[0].children).toHaveLength(2); // 2 H2 under first H1
-    this.expect(navItems[0].children[0].children).toHaveLength(2); // 2 H3 under first H2
-
-    // Cleanup
-    document.body.removeChild(testContainer);
-});
-
-runner.test('DocumentNavigator should handle click navigation', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    // Create test document
-    const testContainer = document.createElement('div');
-    testContainer.innerHTML = `
-        <h1 id="target-heading">Target Heading</h1>
-        <p style="height: 1000px;">Spacer content</p>
-    `;
-    document.body.appendChild(testContainer);
-
-    const navigator = new DocumentNavigator({ container: testContainer });
-    await navigator.render();
-
-    // Simulate click on navigation item
-    const navItem = navigator.findElement('[data-target="target-heading"]');
-    this.expect(navItem).toBeTruthy();
-
-    // Mock scrollIntoView for testing
-    const targetElement = document.getElementById('target-heading');
-    let scrollCalled = false;
-    targetElement.scrollIntoView = () => { scrollCalled = true; };
-
-    // Click navigation item
-    navItem.click();
-
-    this.expect(scrollCalled).toBeTruthy();
-
-    // Cleanup
-    document.body.removeChild(testContainer);
-});
-
-runner.test('DocumentNavigator should support expand/collapse functionality', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    const navigator = new DocumentNavigator({ collapsed: true });
-    await navigator.render();
-
-    // Should start collapsed
-    this.expect(navigator.isCollapsed).toBeTruthy();
-
-    const toggleButton = navigator.findElement('.navigator-toggle');
-    const navList = navigator.findElement('.navigator-list');
-
-    // Toggle to expanded
-    await navigator.expand();
-    this.expect(navigator.isCollapsed).toBeFalsy();
-    this.expect(navList.style.display).not.toBe('none');
-
-    // Toggle back to collapsed
-    await navigator.collapse();
-    this.expect(navigator.isCollapsed).toBeTruthy();
-    this.expect(navList.style.display).toBe('none');
-});
-
-runner.test('DocumentNavigator should implement scroll spy functionality', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    // Create test document with multiple sections
-    const testContainer = document.createElement('div');
-    testContainer.innerHTML = `
-        <div style="height: 100px;"></div>
-        <h1 id="section1">Section 1</h1>
-        <div style="height: 400px;"></div>
-        <h2 id="section2">Section 2</h2>
-        <div style="height: 400px;"></div>
-        <h2 id="section3">Section 3</h2>
-        <div style="height: 400px;"></div>
-    `;
-    document.body.appendChild(testContainer);
-
-    const navigator = new DocumentNavigator({
-        container: testContainer,
-        enableScrollSpy: true
-    });
-    await navigator.render();
-
-    // Test current section detection
-    const currentSection = navigator.getCurrentSection();
-    this.expect(currentSection).toBeTruthy();
-
-    // Cleanup
-    document.body.removeChild(testContainer);
-});
-
-runner.test('DocumentNavigator should handle responsive behavior', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    const navigator = new DocumentNavigator({ autoHide: true });
-    await navigator.render();
-
-    // Mock viewport resize
-    const originalInnerWidth = window.innerWidth;
-
-    // Test mobile viewport
-    Object.defineProperty(window, 'innerWidth', { value: 500, configurable: true });
-    navigator.handleResize();
-    this.expect(navigator.element.style.display).toBe('none');
-
-    // Test desktop viewport
-    Object.defineProperty(window, 'innerWidth', { value: 1200, configurable: true });
-    navigator.handleResize();
-    this.expect(navigator.element.style.display).not.toBe('none');
-
-    // Restore original
-    Object.defineProperty(window, 'innerWidth', { value: originalInnerWidth, configurable: true });
-});
-
-runner.test('DocumentNavigator should provide keyboard navigation support', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    const navigator = new DocumentNavigator();
-    await navigator.render();
-
-    // Test keyboard shortcuts
-    let expandCalled = false;
-    let collapseCalled = false;
-
-    navigator.expand = async () => { expandCalled = true; };
-    navigator.collapse = async () => { collapseCalled = true; };
-
-    // Simulate keyboard events
-    const element = navigator.element;
-
-    // Test Escape key (should collapse)
-    const escapeEvent = new KeyboardEvent('keydown', { key: 'Escape' });
-    element.dispatchEvent(escapeEvent);
-    this.expect(collapseCalled).toBeTruthy();
-
-    // Test Enter/Space key (should expand)
-    const enterEvent = new KeyboardEvent('keydown', { key: 'Enter' });
-    element.dispatchEvent(enterEvent);
-    this.expect(expandCalled).toBeTruthy();
-});
-
-runner.test('DocumentNavigator should emit events for user interactions', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    const navigator = new DocumentNavigator();
-    await navigator.render();
-
-    // Test event emission
-    let navigationEvent = null;
-    navigator.addEventListener('navigate', (e) => {
-        navigationEvent = e;
-    });
-
-    let toggleEvent = null;
-    navigator.addEventListener('toggle', (e) => {
-        toggleEvent = e;
-    });
-
-    // Trigger navigation
-    navigator.navigateToHeading('test-heading');
-    this.expect(navigationEvent).toBeTruthy();
-    this.expect(navigationEvent.detail.target).toBe('test-heading');
-
-    // Trigger toggle
-    await navigator.toggle();
-    this.expect(toggleEvent).toBeTruthy();
-});
-
-runner.test('DocumentNavigator should handle empty document gracefully', async function() {
-    const { DocumentNavigator } = await import('../widgets/navigation/DocumentNavigator.js');
-
-    // Create empty container
-    const emptyContainer = document.createElement('div');
-    document.body.appendChild(emptyContainer);
-
-    const navigator = new DocumentNavigator({ container: emptyContainer });
-
-    const headings = navigator.extractHeadings();
-    this.expect(headings).toHaveLength(0);
-
-    await navigator.render();
-    const navList = navigator.findElement('.navigator-list');
-    this.expect(navList.children).toHaveLength(0);
-
-    // Should show empty state message
-    const emptyMessage = navigator.findElement('.navigator-empty');
-    this.expect(emptyMessage).toBeTruthy();
-
-    // Cleanup
-    document.body.removeChild(emptyContainer);
-});
-
-// Export test runner for use in HTML
-window.runDocumentNavigatorTests = () => runner.run();
-
-console.log('📋 DocumentNavigator TDD Test Suite loaded. Run with: runDocumentNavigatorTests()');
-
-export { runner };

markitect/static/js/tests/test-documentcontrols-extraction.js

@@ -1,218 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * TDD Test for Document Controls Component Extraction
- *
- * Tests the extraction of DocumentControls from the monolithic editor.js
- * DocumentControls handles the floating control panel and its actions.
- */
-
-const RefactorTestRunner = require('./refactor-test-runner.js');
-
-const runner = new RefactorTestRunner();
-
-// Define expected DocumentControls API
-const EXPECTED_DOCUMENTCONTROLS_API = [
-    'constructor',
-    'create',
-    'destroy',
-    'show',
-    'hide',
-    'addButton',
-    'removeButton',
-    'setEventHandlers',
-    'updateStatus',
-    'getControlPanel'
-];
-
-runner.describe('DocumentControls Component Extraction', () => {
-
-    runner.it('should define expected API methods', () => {
-        const expectedMethods = EXPECTED_DOCUMENTCONTROLS_API;
-        runner.expect(expectedMethods.length).toBe(10);
-        runner.expect(expectedMethods).toContain('create');
-        runner.expect(expectedMethods).toContain('addButton');
-        runner.expect(expectedMethods).toContain('setEventHandlers');
-    });
-
-    runner.it('should load extracted DocumentControls component', () => {
-        // Load the extracted component
-        delete require.cache[require.resolve('../components/document-controls.js')];
-
-        try {
-            const module = require('../components/document-controls.js');
-            runner.expect(module.DocumentControls).toBeTruthy();
-
-            // Set global for other tests
-            global.ExtractedDocumentControls = module.DocumentControls;
-        } catch (error) {
-            throw new Error(`Failed to load extracted DocumentControls: ${error.message}`);
-        }
-    });
-
-    runner.it('should preserve constructor functionality', () => {
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        const controls = new DocumentControls();
-        runner.expect(controls).toBeInstanceOf(DocumentControls);
-        runner.expect(controls.controlPanel).toBeFalsy(); // Initially null
-        runner.expect(controls.buttons).toBeInstanceOf(Map);
-    });
-
-    runner.it('should preserve control panel creation functionality', () => {
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        const controls = new DocumentControls();
-        controls.create();
-
-        const panel = controls.getControlPanel();
-        runner.expect(panel).toBeTruthy();
-        runner.expect(panel.id).toBe('markitect-global-controls');
-
-        // Check that panel is added to DOM
-        const domPanel = document.getElementById('markitect-global-controls');
-        runner.expect(domPanel).toBeTruthy();
-
-        // Cleanup
-        controls.destroy();
-    });
-
-    runner.it('should preserve button creation functionality', () => {
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        const controls = new DocumentControls();
-        controls.create();
-
-        // Default buttons should be created
-        runner.expect(controls.buttons.has('save-document')).toBeTruthy();
-        runner.expect(controls.buttons.has('reset-all')).toBeTruthy();
-        runner.expect(controls.buttons.has('show-status')).toBeTruthy();
-        runner.expect(controls.buttons.has('toggle-debug')).toBeTruthy();
-
-        // Check DOM elements exist
-        runner.expect(document.getElementById('save-document')).toBeTruthy();
-        runner.expect(document.getElementById('reset-all')).toBeTruthy();
-        runner.expect(document.getElementById('show-status')).toBeTruthy();
-        runner.expect(document.getElementById('toggle-debug')).toBeTruthy();
-
-        // Cleanup
-        controls.destroy();
-    });
-
-    runner.it('should support custom button addition', () => {
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        const controls = new DocumentControls();
-        controls.create();
-
-        // Add custom button
-        const customButton = controls.addButton('custom-test', '🎯 Test', '#ff6600');
-        runner.expect(customButton).toBeTruthy();
-        runner.expect(customButton.id).toBe('custom-test');
-        runner.expect(customButton.textContent).toBe('🎯 Test');
-
-        // Check button is in map and DOM
-        runner.expect(controls.buttons.has('custom-test')).toBeTruthy();
-        runner.expect(document.getElementById('custom-test')).toBeTruthy();
-
-        // Cleanup
-        controls.destroy();
-    });
-
-    runner.it('should support event handler configuration', () => {
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        const controls = new DocumentControls();
-        controls.create();
-
-        let saveClicked = false;
-        let resetClicked = false;
-
-        const handlers = {
-            'save-document': () => { saveClicked = true; },
-            'reset-all': () => { resetClicked = true; }
-        };
-
-        controls.setEventHandlers(handlers);
-
-        // Simulate button clicks
-        const saveBtn = document.getElementById('save-document');
-        const resetBtn = document.getElementById('reset-all');
-
-        saveBtn.click();
-        resetBtn.click();
-
-        runner.expect(saveClicked).toBeTruthy();
-        runner.expect(resetClicked).toBeTruthy();
-
-        // Cleanup
-        controls.destroy();
-    });
-
-    runner.it('should support show/hide functionality', () => {
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        const controls = new DocumentControls();
-        controls.create();
-
-        const panel = controls.getControlPanel();
-
-        // Test hiding
-        controls.hide();
-        runner.expect(panel.style.display).toBe('none');
-
-        // Test showing
-        controls.show();
-        runner.expect(panel.style.display).toBe('block');
-
-        // Cleanup
-        controls.destroy();
-    });
-
-    runner.it('should preserve destroy functionality', () => {
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        const controls = new DocumentControls();
-        controls.create();
-
-        // Verify panel exists
-        runner.expect(document.getElementById('markitect-global-controls')).toBeTruthy();
-
-        // Destroy
-        controls.destroy();
-
-        // Verify panel is removed
-        runner.expect(document.getElementById('markitect-global-controls')).toBeFalsy();
-        runner.expect(controls.controlPanel).toBeFalsy();
-    });
-
-    runner.it('should support status updates', () => {
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        const controls = new DocumentControls();
-        controls.create();
-
-        // Test status update
-        controls.updateStatus({ totalSections: 5, editingSections: 2 });
-
-        // The status should be reflected in the panel (implementation specific)
-        const panel = controls.getControlPanel();
-        runner.expect(panel).toBeTruthy();
-
-        // Cleanup
-        controls.destroy();
-    });
-});
-
-module.exports = {
-    runner,
-    EXPECTED_DOCUMENTCONTROLS_API
-};
-
-// Run tests if called directly
-if (require.main === module) {
-    console.log('🧪 Testing DocumentControls Component Extraction');
-    runner.run().then(() => {
-        console.log('✅ DocumentControls extraction tests completed');
-    });
-}

markitect/static/js/tests/test-domrenderer-extraction.js

@@ -1,212 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * TDD Test for DOMRenderer Component Extraction
- *
- * Tests the extraction of DOMRenderer from the monolithic editor.js
- * DOMRenderer handles all DOM interactions and UI rendering.
- */
-
-const RefactorTestRunner = require('./refactor-test-runner.js');
-
-const runner = new RefactorTestRunner();
-
-// Define expected DOMRenderer API
-const EXPECTED_DOMRENDERER_API = [
-    'constructor',
-    'renderAllSections',
-    'renderSection',
-    'showEditor',
-    'hideCurrentEditor',
-    'showImageEditor',
-    'findSectionElement',
-    'handleSectionClick',
-    'setupSectionElement',
-    'trackEvent',
-    'getEventStats'
-    // Note: addGlobalControls and debug methods are on MarkitectCleanEditor, not DOMRenderer
-];
-
-runner.describe('DOMRenderer Component Extraction', () => {
-
-    runner.it('should define expected API methods', () => {
-        const expectedMethods = EXPECTED_DOMRENDERER_API;
-        runner.expect(expectedMethods.length).toBe(11);
-        runner.expect(expectedMethods).toContain('renderAllSections');
-        runner.expect(expectedMethods).toContain('showEditor');
-        runner.expect(expectedMethods).toContain('handleSectionClick');
-    });
-
-    runner.it('should extract from monolithic editor.js', () => {
-        // Load the monolithic editor.js to extract DOMRenderer
-        delete require.cache[require.resolve('/home/worsch/markitect_project/markitect/static/editor.js')];
-
-        try {
-            const editorModule = require('/home/worsch/markitect_project/markitect/static/editor.js');
-            runner.expect(editorModule.DOMRenderer).toBeTruthy();
-            // Set global for other tests
-            global.DOMRenderer = editorModule.DOMRenderer;
-            global.SectionManager = editorModule.SectionManager;
-        } catch (error) {
-            throw new Error(`Failed to load monolithic editor.js: ${error.message}`);
-        }
-    });
-
-    runner.it('should preserve DOMRenderer constructor functionality', () => {
-        const DOMRenderer = global.DOMRenderer;
-        const SectionManager = global.SectionManager;
-
-        const container = document.createElement('div');
-        const sectionManager = new SectionManager();
-
-        const renderer = new DOMRenderer(sectionManager, container);
-        runner.expect(renderer).toBeInstanceOf(DOMRenderer);
-        runner.expect(renderer.sectionManager).toBe(sectionManager);
-        runner.expect(renderer.container).toBe(container);
-    });
-
-    runner.it('should preserve section rendering functionality', () => {
-        const DOMRenderer = global.DOMRenderer;
-        const SectionManager = global.SectionManager;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        const testMarkdown = '# Test Heading\nTest content';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-
-        // This should not throw an error
-        renderer.renderAllSections(sections);
-
-        // Check that some content was rendered
-        runner.expect(container.innerHTML.length).toBe(container.innerHTML.length); // Basic sanity check
-    });
-
-    runner.it('should preserve findSectionElement functionality', () => {
-        const DOMRenderer = global.DOMRenderer;
-        const SectionManager = global.SectionManager;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        const testMarkdown = '# Test Heading\nTest content';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        renderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-        const element = renderer.findSectionElement(sectionId);
-
-        // Should find an element or return null (not throw error)
-        runner.expect(typeof element === 'object').toBeTruthy();
-    });
-
-    runner.it('should preserve event tracking functionality', () => {
-        const DOMRenderer = global.DOMRenderer;
-        const SectionManager = global.SectionManager;
-
-        const container = document.createElement('div');
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        // Should have trackEvent method
-        runner.expect(typeof renderer.trackEvent === 'function').toBeTruthy();
-
-        // Should be able to track an event
-        renderer.trackEvent('test-event', { data: 'test' });
-
-        // Should have getEventStats method
-        runner.expect(typeof renderer.getEventStats === 'function').toBeTruthy();
-
-        const stats = renderer.getEventStats();
-        runner.expect(typeof stats === 'object').toBeTruthy();
-    });
-
-    runner.it('should preserve editor showing functionality', () => {
-        const DOMRenderer = global.DOMRenderer;
-        const SectionManager = global.SectionManager;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        const testMarkdown = '# Test Heading\nTest content';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        renderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-
-        // showEditor should not throw error
-        try {
-            renderer.showEditor(sectionId, 'test content');
-            runner.expect(true).toBeTruthy(); // If we get here, no error was thrown
-        } catch (error) {
-            // Some errors are expected if DOM structure isn't complete
-            runner.expect(typeof error.message === 'string').toBeTruthy();
-        }
-    });
-
-    runner.it('should have core DOM rendering methods', () => {
-        const DOMRenderer = global.DOMRenderer;
-        const SectionManager = global.SectionManager;
-
-        const container = document.createElement('div');
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        // Should have core methods
-        runner.expect(typeof renderer.renderAllSections === 'function').toBeTruthy();
-        runner.expect(typeof renderer.showEditor === 'function').toBeTruthy();
-        runner.expect(typeof renderer.findSectionElement === 'function').toBeTruthy();
-        runner.expect(typeof renderer.trackEvent === 'function').toBeTruthy();
-    });
-});
-
-// Export API tests for use during extraction
-const DOMRENDERER_API_TESTS = [
-    (DOMRenderer, SectionManager) => {
-        const container = document.createElement('div');
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-        if (!renderer.sectionManager) {
-            throw new Error('sectionManager property missing');
-        }
-    },
-    (DOMRenderer, SectionManager) => {
-        const container = document.createElement('div');
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-        if (typeof renderer.renderAllSections !== 'function') {
-            throw new Error('renderAllSections method missing');
-        }
-    },
-    (DOMRenderer, SectionManager) => {
-        const container = document.createElement('div');
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-        if (typeof renderer.showEditor !== 'function') {
-            throw new Error('showEditor method missing');
-        }
-    }
-];
-
-module.exports = {
-    runner,
-    EXPECTED_DOMRENDERER_API,
-    DOMRENDERER_API_TESTS
-};
-
-// Run tests if called directly
-if (require.main === module) {
-    console.log('🧪 Testing DOMRenderer Component Extraction');
-    runner.run().then(() => {
-        console.log('✅ DOMRenderer extraction tests completed');
-    });
-}

markitect/static/js/tests/test-extracted-domrenderer.js

@@ -1,271 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * TDD Test for Extracted DOMRenderer Component
- *
- * Tests the extracted DOMRenderer component independently from the monolith.
- * Verifies that core functionality is preserved after extraction.
- */
-
-const RefactorTestRunner = require('./refactor-test-runner.js');
-
-const runner = new RefactorTestRunner();
-
-runner.describe('Extracted DOMRenderer Component', () => {
-
-    runner.it('should load extracted DOMRenderer component', () => {
-        // Load the extracted component
-        delete require.cache[require.resolve('../components/dom-renderer.js')];
-
-        try {
-            const module = require('../components/dom-renderer.js');
-            runner.expect(module.DOMRenderer).toBeTruthy();
-            runner.expect(module.FloatingMenu).toBeTruthy();
-
-            // Set globals for other tests
-            global.ExtractedDOMRenderer = module.DOMRenderer;
-            global.ExtractedFloatingMenu = module.FloatingMenu;
-        } catch (error) {
-            throw new Error(`Failed to load extracted DOMRenderer: ${error.message}`);
-        }
-    });
-
-    runner.it('should preserve constructor functionality', () => {
-        const DOMRenderer = global.ExtractedDOMRenderer;
-
-        // Load SectionManager from our extracted core
-        const sectionModule = require('../core/section-manager.js');
-        const SectionManager = sectionModule.SectionManager;
-
-        const container = document.createElement('div');
-        const sectionManager = new SectionManager();
-
-        const renderer = new DOMRenderer(sectionManager, container);
-        runner.expect(renderer).toBeInstanceOf(DOMRenderer);
-        runner.expect(renderer.sectionManager).toBe(sectionManager);
-        runner.expect(renderer.container).toBe(container);
-        runner.expect(renderer.editingSections).toBeInstanceOf(Set);
-    });
-
-    runner.it('should preserve section rendering functionality', () => {
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const sectionModule = require('../core/section-manager.js');
-        const SectionManager = sectionModule.SectionManager;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        const testMarkdown = '# Test Heading\nTest content';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-
-        // This should not throw an error
-        renderer.renderAllSections(sections);
-
-        // Check that content was rendered
-        runner.expect(container.innerHTML.length > 100).toBeTruthy();
-        runner.expect(container.innerHTML).toContain('Test Heading');
-    });
-
-    runner.it('should preserve findSectionElement functionality', () => {
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const sectionModule = require('../core/section-manager.js');
-        const SectionManager = sectionModule.SectionManager;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        const testMarkdown = '# Test Heading\nTest content';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        renderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-        const element = renderer.findSectionElement(sectionId);
-
-        runner.expect(element).toBeTruthy();
-        runner.expect(element.getAttribute('data-section-id')).toBe(sectionId);
-    });
-
-    runner.it('should preserve event tracking functionality', () => {
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const sectionModule = require('../core/section-manager.js');
-        const SectionManager = sectionModule.SectionManager;
-
-        const container = document.createElement('div');
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        // Should have trackEvent method
-        runner.expect(typeof renderer.trackEvent === 'function').toBeTruthy();
-
-        // Should be able to track an event
-        renderer.trackEvent('test-event', { data: 'test' });
-
-        // Should have getEventStats method
-        runner.expect(typeof renderer.getEventStats === 'function').toBeTruthy();
-
-        const stats = renderer.getEventStats();
-        runner.expect(typeof stats === 'object').toBeTruthy();
-        runner.expect(stats).toHaveProperty('stats');
-        runner.expect(stats).toHaveProperty('totalEvents');
-        runner.expect(stats).toHaveProperty('recentEvents');
-    });
-
-    runner.it('should preserve editor showing functionality', () => {
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const sectionModule = require('../core/section-manager.js');
-        const SectionManager = sectionModule.SectionManager;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        const testMarkdown = '# Test Heading\nTest content';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        renderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-
-        // showEditor should not throw error
-        try {
-            renderer.showEditor(sectionId, 'test content');
-            runner.expect(true).toBeTruthy(); // If we get here, no error was thrown
-
-            // Check that editing state was set
-            runner.expect(renderer.editingSections.has(sectionId)).toBeTruthy();
-        } catch (error) {
-            throw new Error(`showEditor failed: ${error.message}`);
-        }
-    });
-
-    runner.it('should preserve FloatingMenu functionality', () => {
-        const FloatingMenu = global.ExtractedFloatingMenu;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const sectionModule = require('../core/section-manager.js');
-        const SectionManager = sectionModule.SectionManager;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        const testMarkdown = '# Test Heading\nTest content';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        renderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-        const floatingMenu = new FloatingMenu(sectionId, 'text', renderer);
-
-        runner.expect(floatingMenu.sectionId).toBe(sectionId);
-        runner.expect(floatingMenu.type).toBe('text');
-        runner.expect(floatingMenu.renderer).toBe(renderer);
-        runner.expect(floatingMenu.isVisible).toBeFalsy();
-
-        // Test show/hide functionality
-        const content = document.createElement('div');
-        content.textContent = 'Test content';
-
-        floatingMenu.show(content);
-        runner.expect(floatingMenu.isVisible).toBeTruthy();
-
-        floatingMenu.hide();
-        runner.expect(floatingMenu.isVisible).toBeFalsy();
-    });
-
-    runner.it('should handle section click events', () => {
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const sectionModule = require('../core/section-manager.js');
-        const SectionManager = sectionModule.SectionManager;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-
-        const sectionManager = new SectionManager();
-        const renderer = new DOMRenderer(sectionManager, container);
-
-        const testMarkdown = '# Test Heading\nTest content';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        renderer.renderAllSections(sections);
-
-        const sectionId = sections[0].id;
-        const element = renderer.findSectionElement(sectionId);
-
-        // Simulate a click event
-        const clickEvent = new Event('click', { bubbles: true });
-        Object.defineProperty(clickEvent, 'target', { value: element });
-
-        // Should not throw error
-        try {
-            renderer.handleSectionClick(clickEvent);
-            runner.expect(true).toBeTruthy();
-        } catch (error) {
-            throw new Error(`handleSectionClick failed: ${error.message}`);
-        }
-    });
-
-    // Comparative test - verify extracted component behaves similarly to original
-    runner.it('should behave similarly to original monolithic component', () => {
-        // Load both components
-        const originalModule = require('/home/worsch/markitect_project/markitect/static/editor.js');
-        const extractedModule = require('../components/dom-renderer.js');
-        const sectionModule = require('../core/section-manager.js');
-
-        const originalSectionManager = new originalModule.SectionManager();
-        const extractedSectionManager = new sectionModule.SectionManager();
-
-        const originalContainer = document.createElement('div');
-        originalContainer.innerHTML = '<div id="markdown-content"></div>';
-
-        const extractedContainer = document.createElement('div');
-        extractedContainer.innerHTML = '<div id="markdown-content"></div>';
-
-        const originalRenderer = new originalModule.DOMRenderer(originalSectionManager, originalContainer);
-        const extractedRenderer = new extractedModule.DOMRenderer(extractedSectionManager, extractedContainer);
-
-        const testMarkdown = '# Test\nContent\n\n## Subheading\nMore content';
-
-        // Create sections with both
-        const originalSections = originalSectionManager.createSectionsFromMarkdown(testMarkdown);
-        const extractedSections = extractedSectionManager.createSectionsFromMarkdown(testMarkdown);
-
-        // Render with both
-        originalRenderer.renderAllSections(originalSections);
-        extractedRenderer.renderAllSections(extractedSections);
-
-        // Should have rendered content
-        runner.expect(originalContainer.innerHTML.length > 100).toBeTruthy();
-        runner.expect(extractedContainer.innerHTML.length > 100).toBeTruthy();
-
-        // Should have same number of section elements
-        const originalSectionElements = originalContainer.querySelectorAll('.ui-edit-section');
-        const extractedSectionElements = extractedContainer.querySelectorAll('.ui-edit-section');
-
-        runner.expect(extractedSectionElements.length).toBe(originalSectionElements.length);
-
-        // Should have similar event stats structure
-        const originalStats = originalRenderer.getEventStats();
-        const extractedStats = extractedRenderer.getEventStats();
-
-        runner.expect(extractedStats).toHaveProperty('stats');
-        runner.expect(extractedStats).toHaveProperty('totalEvents');
-        runner.expect(extractedStats).toHaveProperty('recentEvents');
-    });
-});
-
-module.exports = runner;
-
-// Run tests if called directly
-if (require.main === module) {
-    console.log('🧪 Testing Extracted DOMRenderer Component');
-    runner.run().then(() => {
-        console.log('✅ Extracted DOMRenderer tests completed');
-    });
-}

markitect/static/js/tests/test-extracted-section-manager.js

@@ -1,226 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * TDD Test for Extracted SectionManager Component
- *
- * Tests the extracted SectionManager component independently from the monolith.
- * Verifies that all functionality is preserved after extraction.
- */
-
-const RefactorTestRunner = require('./refactor-test-runner.js');
-
-const runner = new RefactorTestRunner();
-
-runner.describe('Extracted SectionManager Component', () => {
-
-    runner.it('should load extracted SectionManager component', () => {
-        // Load the extracted component
-        delete require.cache[require.resolve('../core/section-manager.js')];
-
-        try {
-            const module = require('../core/section-manager.js');
-            runner.expect(module.SectionManager).toBeTruthy();
-            runner.expect(module.Section).toBeTruthy();
-            runner.expect(module.EditState).toBeTruthy();
-            runner.expect(module.SectionType).toBeTruthy();
-
-            // Set globals for other tests
-            global.ExtractedSectionManager = module.SectionManager;
-            global.ExtractedSection = module.Section;
-            global.ExtractedEditState = module.EditState;
-            global.ExtractedSectionType = module.SectionType;
-        } catch (error) {
-            throw new Error(`Failed to load extracted SectionManager: ${error.message}`);
-        }
-    });
-
-    runner.it('should preserve constructor functionality', () => {
-        const SectionManager = global.ExtractedSectionManager;
-
-        const manager = new SectionManager();
-        runner.expect(manager).toBeInstanceOf(SectionManager);
-        runner.expect(manager.sections).toBeInstanceOf(Map);
-        runner.expect(manager.listeners).toBeInstanceOf(Map);
-    });
-
-    runner.it('should preserve section creation functionality', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const manager = new SectionManager();
-
-        const testMarkdown = `# Heading 1\nContent 1\n\n## Heading 2\nContent 2`;
-        const sections = manager.createSectionsFromMarkdown(testMarkdown);
-
-        runner.expect(Array.isArray(sections)).toBeTruthy();
-        runner.expect(sections.length).toBe(2);
-        runner.expect(sections[0].currentMarkdown).toContain('Heading 1');
-        runner.expect(sections[1].currentMarkdown).toContain('Heading 2');
-    });
-
-    runner.it('should preserve section editing functionality', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const manager = new SectionManager();
-
-        const sections = manager.createSectionsFromMarkdown('# Test\nContent');
-        const sectionId = sections[0].id;
-
-        // Test start editing
-        const content = manager.startEditing(sectionId);
-        runner.expect(content).toContain('Test');
-
-        const section = manager.sections.get(sectionId);
-        runner.expect(section.isEditing()).toBeTruthy();
-
-        // Test stop editing
-        section.stopEditing();
-        runner.expect(section.isEditing()).toBeFalsy();
-    });
-
-    runner.it('should preserve event system functionality', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const manager = new SectionManager();
-
-        let eventFired = false;
-        let eventData = null;
-
-        manager.on('test-event', (data) => {
-            eventFired = true;
-            eventData = data;
-        });
-
-        manager.emit('test-event', { test: 'data' });
-
-        runner.expect(eventFired).toBeTruthy();
-        runner.expect(eventData).toEqual({ test: 'data' });
-    });
-
-    runner.it('should preserve document status functionality', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const manager = new SectionManager();
-
-        manager.createSectionsFromMarkdown('# Test\nContent');
-        const status = manager.getDocumentStatus();
-
-        runner.expect(status).toHaveProperty('totalSections');
-        runner.expect(status).toHaveProperty('editingSections');
-        runner.expect(status.totalSections).toBe(1);
-    });
-
-    runner.it('should preserve getAllSections functionality', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const manager = new SectionManager();
-
-        const testMarkdown = '# One\nContent\n\n# Two\nMore content';
-        manager.createSectionsFromMarkdown(testMarkdown);
-
-        const allSections = manager.getAllSections();
-        runner.expect(Array.isArray(allSections)).toBeTruthy();
-        runner.expect(allSections.length).toBe(2);
-    });
-
-    runner.it('should preserve section splitting functionality', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const manager = new SectionManager();
-
-        const sections = manager.createSectionsFromMarkdown('# Original\nContent');
-        const sectionId = sections[0].id;
-
-        const newContent = '# Split 1\nContent 1\n\n# Split 2\nContent 2';
-        const newSections = manager.handleSectionSplit(sectionId, newContent);
-
-        runner.expect(Array.isArray(newSections)).toBeTruthy();
-        runner.expect(newSections.length).toBe(2);
-        runner.expect(manager.sections.has(sectionId)).toBeFalsy(); // Original removed
-    });
-
-    runner.it('should preserve Section class functionality', () => {
-        const Section = global.ExtractedSection;
-        const EditState = global.ExtractedEditState;
-
-        const section = new Section('test-id', '# Test Content', 'heading');
-
-        runner.expect(section.id).toBe('test-id');
-        runner.expect(section.currentMarkdown).toBe('# Test Content');
-        runner.expect(section.type).toBe('heading');
-        runner.expect(section.state).toBe(EditState.ORIGINAL);
-    });
-
-    runner.it('should preserve Section ID generation', () => {
-        const Section = global.ExtractedSection;
-
-        const id1 = Section.generateId('# Test Heading', 0);
-        const id2 = Section.generateId('# Different Heading', 1);
-
-        runner.expect(typeof id1 === 'string').toBeTruthy();
-        runner.expect(typeof id2 === 'string').toBeTruthy();
-        runner.expect(id1).toContain('section-');
-        runner.expect(id2).toContain('section-');
-        runner.expect(id1 !== id2).toBeTruthy(); // Should be unique
-    });
-
-    runner.it('should preserve Section type detection', () => {
-        const Section = global.ExtractedSection;
-        const SectionType = global.ExtractedSectionType;
-
-        runner.expect(Section.detectType('# Heading')).toBe(SectionType.HEADING);
-        runner.expect(Section.detectType('![Image](url)')).toBe(SectionType.IMAGE);
-        runner.expect(Section.detectType('```code```')).toBe(SectionType.CODE);
-        runner.expect(Section.detectType('Regular paragraph')).toBe(SectionType.PARAGRAPH);
-    });
-
-    // Comparative test - verify extracted component behaves identically to original
-    runner.it('should behave identically to original monolithic component', () => {
-        // Load both components
-        const originalModule = require('/home/worsch/markitect_project/markitect/static/editor.js');
-        const extractedModule = require('../core/section-manager.js');
-
-        const originalManager = new originalModule.SectionManager();
-        const extractedManager = new extractedModule.SectionManager();
-
-        const testMarkdown = '# Test\nContent\n\n## Subheading\nMore content';
-
-        // Debug: Check what each component produces
-        console.log('Creating sections with original component...');
-        const originalSections = originalManager.createSectionsFromMarkdown(testMarkdown);
-        console.log(`Original produced ${originalSections.length} sections`);
-
-        console.log('Creating sections with extracted component...');
-        const extractedSections = extractedManager.createSectionsFromMarkdown(testMarkdown);
-        console.log(`Extracted produced ${extractedSections.length} sections`);
-
-        if (originalSections.length > 0) {
-            console.log('Original first section:', originalSections[0].currentMarkdown);
-        }
-        if (extractedSections.length > 0) {
-            console.log('Extracted first section:', extractedSections[0].currentMarkdown);
-        }
-
-        // Should have same number of sections
-        runner.expect(extractedSections.length).toBe(originalSections.length);
-
-        // Should have same content
-        for (let i = 0; i < originalSections.length; i++) {
-            runner.expect(extractedSections[i].currentMarkdown).toBe(originalSections[i].currentMarkdown);
-            runner.expect(extractedSections[i].type).toBe(originalSections[i].type);
-        }
-
-        // Should have same document status structure
-        const originalStatus = originalManager.getDocumentStatus();
-        const extractedStatus = extractedManager.getDocumentStatus();
-
-        console.log('Original status:', originalStatus);
-        console.log('Extracted status:', extractedStatus);
-
-        runner.expect(extractedStatus.totalSections).toBe(originalStatus.totalSections);
-        runner.expect(extractedStatus.editingSections).toBe(originalStatus.editingSections);
-    });
-});
-
-module.exports = runner;
-
-// Run tests if called directly
-if (require.main === module) {
-    console.log('🧪 Testing Extracted SectionManager Component');
-    runner.run().then(() => {
-        console.log('✅ Extracted SectionManager tests completed');
-    });
-}

markitect/static/js/tests/test-full-integration.js

@@ -1,305 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * Full Integration Test
- *
- * Tests that all extracted components (SectionManager, DOMRenderer,
- * DebugPanel, DocumentControls) work together as a complete system.
- */
-
-const RefactorTestRunner = require('./refactor-test-runner.js');
-
-const runner = new RefactorTestRunner();
-
-runner.describe('Full Component Integration Tests', () => {
-
-    runner.it('should load all extracted components', () => {
-        try {
-            // Load all extracted components
-            const sectionModule = require('../core/section-manager.js');
-            const domModule = require('../components/dom-renderer.js');
-            const debugModule = require('../components/debug-panel.js');
-            const controlsModule = require('../components/document-controls.js');
-
-            runner.expect(sectionModule.SectionManager).toBeTruthy();
-            runner.expect(domModule.DOMRenderer).toBeTruthy();
-            runner.expect(debugModule.DebugPanel).toBeTruthy();
-            runner.expect(controlsModule.DocumentControls).toBeTruthy();
-
-            // Set globals for other tests
-            global.ExtractedSectionManager = sectionModule.SectionManager;
-            global.ExtractedDOMRenderer = domModule.DOMRenderer;
-            global.ExtractedDebugPanel = debugModule.DebugPanel;
-            global.ExtractedDocumentControls = controlsModule.DocumentControls;
-
-        } catch (error) {
-            throw new Error(`Failed to load extracted components: ${error.message}`);
-        }
-    });
-
-    runner.it('should support complete document editing workflow with all components', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const DebugPanel = global.ExtractedDebugPanel;
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        // Setup DOM container
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        // Create all components
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-        const debugPanel = new DebugPanel();
-        const documentControls = new DocumentControls();
-
-        // Setup document controls
-        documentControls.create();
-
-        // Wire up event handlers for debugging
-        sectionManager.on('sections-created', (data) => {
-            debugPanel.addMessage(`Created ${data.count} sections`, 'INFO');
-        });
-
-        sectionManager.on('edit-started', (data) => {
-            debugPanel.addMessage(`Edit started for section: ${data.sectionId}`, 'DEBUG');
-        });
-
-        // Test workflow: Create document
-        const testMarkdown = `# Document Title
-Introduction paragraph with some content.
-
-## Section A
-Content for section A with details.
-
-![Test Image](https://example.com/test.jpg)
-
-### Subsection A.1
-More detailed content here.`;
-
-        // Create sections
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        runner.expect(sections.length).toBe(4);
-
-        // Render sections
-        domRenderer.renderAllSections(sections);
-        const renderedElements = container.querySelectorAll('.ui-edit-section');
-        runner.expect(renderedElements.length).toBe(sections.length);
-
-        // Test editing workflow
-        const firstSection = sections[0];
-        sectionManager.startEditing(firstSection.id);
-        runner.expect(firstSection.isEditing()).toBeTruthy();
-
-        // Check debug messages were created
-        runner.expect(debugPanel.getMessageCount()).toBe(2); // sections-created + edit-started
-
-        // Test document controls functionality
-        const controlPanel = documentControls.getControlPanel();
-        runner.expect(controlPanel).toBeTruthy();
-        runner.expect(document.getElementById('save-document')).toBeTruthy();
-        runner.expect(document.getElementById('toggle-debug')).toBeTruthy();
-
-        // Cleanup
-        document.body.removeChild(container);
-        documentControls.destroy();
-    });
-
-    runner.it('should support debug panel integration with document controls', () => {
-        const DebugPanel = global.ExtractedDebugPanel;
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        // Create components
-        const debugPanel = new DebugPanel();
-        const documentControls = new DocumentControls();
-
-        // Setup document controls
-        documentControls.create();
-
-        // Setup debug panel toggle handler
-        const handlers = {
-            'toggle-debug': () => debugPanel.toggle()
-        };
-        documentControls.setEventHandlers(handlers);
-
-        // Test debug toggle functionality
-        const debugButton = documentControls.getButton('toggle-debug');
-        runner.expect(debugButton).toBeTruthy();
-
-        // Add some debug messages
-        debugPanel.addMessage('Test message 1', 'INFO');
-        debugPanel.addMessage('Test message 2', 'ERROR');
-
-        // Simulate button click to show debug panel
-        debugButton.click();
-        runner.expect(debugPanel.isActive).toBeTruthy();
-
-        // Simulate button click to hide debug panel
-        debugButton.click();
-        runner.expect(debugPanel.isActive).toBeFalsy();
-
-        // Cleanup
-        documentControls.destroy();
-    });
-
-    runner.it('should support event-driven communication between all components', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const DebugPanel = global.ExtractedDebugPanel;
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        // Setup container
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        // Create components
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-        const debugPanel = new DebugPanel();
-        const documentControls = new DocumentControls();
-
-        documentControls.create();
-
-        // Setup comprehensive event handling
-        let eventLog = [];
-
-        sectionManager.on('sections-created', (data) => {
-            eventLog.push(`sections-created: ${data.count} sections`);
-            debugPanel.addMessage(`Sections created: ${data.count}`, 'INFO');
-        });
-
-        sectionManager.on('edit-started', (data) => {
-            eventLog.push(`edit-started: ${data.sectionId}`);
-            debugPanel.addMessage(`Edit started: ${data.sectionId}`, 'DEBUG');
-        });
-
-        sectionManager.on('changes-accepted', (data) => {
-            eventLog.push(`changes-accepted: ${data.sectionId}`);
-            debugPanel.addMessage(`Changes accepted: ${data.sectionId}`, 'SUCCESS');
-        });
-
-        // Test complete workflow
-        const testMarkdown = '# Test\nContent for testing';
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        // Start editing
-        sectionManager.startEditing(sections[0].id);
-        sectionManager.updateContent(sections[0].id, '# Updated Test\nUpdated content');
-        sectionManager.acceptChanges(sections[0].id);
-
-        // Verify events were logged
-        runner.expect(eventLog.length).toBe(3);
-        runner.expect(eventLog[0]).toContain('sections-created');
-        runner.expect(eventLog[1]).toContain('edit-started');
-        runner.expect(eventLog[2]).toContain('changes-accepted');
-
-        // Verify debug messages were created
-        runner.expect(debugPanel.getMessageCount()).toBe(3);
-
-        // Test document controls status update
-        const status = sectionManager.getDocumentStatus();
-        documentControls.updateStatus(status);
-        runner.expect(documentControls.lastStatus).toBeTruthy();
-
-        // Cleanup
-        document.body.removeChild(container);
-        documentControls.destroy();
-    });
-
-    runner.it('should handle error scenarios gracefully across components', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const DebugPanel = global.ExtractedDebugPanel;
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        // Test component creation without proper DOM setup
-        const debugPanel = new DebugPanel();
-        const documentControls = new DocumentControls();
-
-        // These should not throw errors
-        try {
-            debugPanel.toggle(); // No DOM elements
-            debugPanel.update(); // No DOM elements
-            documentControls.show(); // No control panel created yet
-            documentControls.hide(); // No control panel created yet
-
-            runner.expect(true).toBeTruthy(); // If we get here, no errors were thrown
-        } catch (error) {
-            throw new Error(`Components should handle missing DOM gracefully: ${error.message}`);
-        }
-
-        // Test section manager with invalid input
-        const sectionManager = new SectionManager();
-        const sections = sectionManager.createSectionsFromMarkdown('');
-        runner.expect(sections.length).toBe(0);
-
-        // Test DOM renderer with invalid container
-        try {
-            const invalidRenderer = new DOMRenderer(sectionManager, null);
-            runner.expect(invalidRenderer.container).toBeFalsy();
-        } catch (error) {
-            // This is acceptable - constructor might validate input
-            runner.expect(typeof error.message === 'string').toBeTruthy();
-        }
-    });
-
-    runner.it('should support scalable architecture with component lifecycle', () => {
-        const SectionManager = global.ExtractedSectionManager;
-        const DOMRenderer = global.ExtractedDOMRenderer;
-        const DebugPanel = global.ExtractedDebugPanel;
-        const DocumentControls = global.ExtractedDocumentControls;
-
-        // Test multiple instances
-        const sectionManager1 = new SectionManager();
-        const sectionManager2 = new SectionManager();
-        const debugPanel1 = new DebugPanel();
-        const debugPanel2 = new DebugPanel();
-
-        // Each should be independent
-        debugPanel1.addMessage('Message from panel 1', 'INFO');
-        debugPanel2.addMessage('Message from panel 2', 'ERROR');
-
-        runner.expect(debugPanel1.getMessageCount()).toBe(1);
-        runner.expect(debugPanel2.getMessageCount()).toBe(1);
-
-        // Test section managers are independent
-        const sections1 = sectionManager1.createSectionsFromMarkdown('# Document 1');
-        const sections2 = sectionManager2.createSectionsFromMarkdown('# Document 2');
-
-        runner.expect(sections1.length).toBe(1);
-        runner.expect(sections2.length).toBe(1);
-        runner.expect(sections1[0]).toBeTruthy();
-        runner.expect(sections2[0]).toBeTruthy();
-
-        // IDs should be different (each section gets unique ID)
-        const id1 = sections1[0].id;
-        const id2 = sections2[0].id;
-        runner.expect(id1 !== id2).toBeTruthy();
-
-        // Test document controls lifecycle
-        const controls1 = new DocumentControls();
-        const controls2 = new DocumentControls();
-
-        controls1.create();
-        runner.expect(document.getElementById('markitect-global-controls')).toBeTruthy();
-
-        controls2.create(); // Should replace the first one
-        runner.expect(document.getElementById('markitect-global-controls')).toBeTruthy();
-
-        controls2.destroy();
-        runner.expect(document.getElementById('markitect-global-controls')).toBeFalsy();
-    });
-});
-
-module.exports = runner;
-
-// Run tests if called directly
-if (require.main === module) {
-    console.log('🧪 Running Full Component Integration Tests');
-    runner.run().then(() => {
-        console.log('✅ Full integration tests completed');
-    });
-}

markitect/static/js/tests/test-navigator-demo.html

@@ -1,342 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>DocumentNavigator Live Demo</title>
-    <style>
-        body {
-            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-            line-height: 1.6;
-            max-width: 800px;
-            margin: 0 auto;
-            padding: 2rem;
-            color: #333;
-        }
-
-        .demo-header {
-            text-align: center;
-            background: #f8f9fa;
-            padding: 2rem;
-            border-radius: 8px;
-            margin-bottom: 2rem;
-        }
-
-        .demo-content {
-            margin-top: 3rem;
-        }
-
-        h1, h2, h3 {
-            scroll-margin-top: 100px; /* Account for navigator */
-        }
-
-        h1 {
-            color: #2c3e50;
-            border-bottom: 3px solid #3498db;
-            padding-bottom: 0.5rem;
-        }
-
-        h2 {
-            color: #34495e;
-            margin-top: 3rem;
-        }
-
-        h3 {
-            color: #7f8c8d;
-            margin-top: 2rem;
-        }
-
-        .content-section {
-            margin-bottom: 3rem;
-        }
-
-        .highlight {
-            background: #fff3cd;
-            padding: 1rem;
-            border-radius: 4px;
-            border-left: 4px solid #ffc107;
-            margin: 1rem 0;
-        }
-
-        code {
-            background: #f8f9fa;
-            padding: 0.2rem 0.4rem;
-            border-radius: 3px;
-            font-family: 'Monaco', 'Consolas', monospace;
-        }
-    </style>
-</head>
-<body>
-    <div class="demo-header">
-        <h1>📋 DocumentNavigator Live Demo</h1>
-        <p>This page demonstrates the Substack-style floating navigation widget in action.</p>
-        <p><strong>Look for the hamburger menu (☰) on the left side!</strong></p>
-
-        <div class="highlight">
-            <strong>Features to test:</strong><br>
-            • Click the hamburger menu to expand navigation<br>
-            • Click any heading in the navigator to jump to it<br>
-            • Scroll and watch the current section highlight<br>
-            • Try keyboard shortcuts (Enter/Space to toggle, Escape to close)<br>
-            • Resize window to test responsive behavior
-        </div>
-    </div>
-
-    <div id="markdown-content" class="demo-content">
-        <h1 id="introduction">1. Introduction to MarkiTect</h1>
-        <div class="content-section">
-            <p>MarkiTect is an advanced markdown processing engine that provides sophisticated document management capabilities. This demo showcases the DocumentNavigator widget, which provides Substack-style navigation for long-form documents.</p>
-
-            <p>The navigator automatically extracts headings from your content and builds a hierarchical table of contents that floats elegantly on the side of your document.</p>
-        </div>
-
-        <h2 id="features">1.1 Core Features</h2>
-        <div class="content-section">
-            <p>The DocumentNavigator widget includes numerous advanced features designed for optimal user experience:</p>
-
-            <ul>
-                <li><strong>Automatic Heading Detection</strong>: Scans document for H1, H2, H3 elements</li>
-                <li><strong>Hierarchical Structure</strong>: Maintains proper heading hierarchy with indentation</li>
-                <li><strong>Scroll Spy</strong>: Highlights current section as you scroll</li>
-                <li><strong>Smooth Navigation</strong>: Animated scrolling to clicked sections</li>
-                <li><strong>Responsive Design</strong>: Auto-hides on mobile devices</li>
-            </ul>
-        </div>
-
-        <h3 id="responsive">1.1.1 Responsive Behavior</h3>
-        <div class="content-section">
-            <p>The navigator intelligently adapts to different screen sizes. On desktop computers, it remains visible as a floating panel. On mobile devices, it automatically hides to preserve screen real estate for content.</p>
-
-            <p>Try resizing your browser window to see this behavior in action. The navigator will disappear when the viewport becomes narrow (under 768px wide).</p>
-        </div>
-
-        <h3 id="accessibility">1.1.2 Accessibility Features</h3>
-        <div class="content-section">
-            <p>The DocumentNavigator is built with accessibility in mind:</p>
-
-            <ul>
-                <li>Full keyboard navigation support</li>
-                <li>ARIA labels and proper semantic markup</li>
-                <li>Screen reader compatibility</li>
-                <li>High contrast hover states</li>
-                <li>Focus management</li>
-            </ul>
-        </div>
-
-        <h2 id="implementation">1.2 Implementation Details</h2>
-        <div class="content-section">
-            <p>The DocumentNavigator is implemented as a modular ES6 class that extends our base UIWidget class. This follows the planned plugin architecture for MarkiTect widgets.</p>
-
-            <p>Key implementation highlights include:</p>
-
-            <ul>
-                <li><code>extractHeadings()</code> - Scans DOM for heading elements</li>
-                <li><code>buildNavigationTree()</code> - Creates hierarchical structure</li>
-                <li><code>handleScroll()</code> - Manages scroll spy functionality</li>
-                <li><code>navigateToHeading()</code> - Handles smooth scrolling</li>
-            </ul>
-        </div>
-
-        <h1 id="architecture">2. Widget Architecture</h1>
-        <div class="content-section">
-            <p>The DocumentNavigator follows a clean architectural pattern that separates concerns and provides maximum flexibility for customization and extension.</p>
-
-            <p>The widget is designed as part of a larger plugin ecosystem that will allow developers to create custom UI components that can be loaded dynamically and configured independently.</p>
-        </div>
-
-        <h2 id="base-classes">2.1 Base Class Hierarchy</h2>
-        <div class="content-section">
-            <p>Our widget system is built on a foundation of base classes that provide common functionality:</p>
-
-            <ul>
-                <li><strong>Widget</strong>: Core functionality (events, state, lifecycle)</li>
-                <li><strong>UIWidget</strong>: DOM manipulation and visual behavior</li>
-                <li><strong>InteractiveWidget</strong>: Event handling and user interaction</li>
-            </ul>
-
-            <p>DocumentNavigator extends UIWidget directly since it doesn't require complex interaction handling beyond basic click and keyboard events.</p>
-        </div>
-
-        <h3 id="events">2.1.1 Event System</h3>
-        <div class="content-section">
-            <p>The widget uses a custom event system built on the native EventTarget API. This allows for clean separation of concerns and easy integration with other components.</p>
-
-            <p>Key events emitted by DocumentNavigator:</p>
-
-            <ul>
-                <li><code>rendered</code> - Widget has been rendered to DOM</li>
-                <li><code>navigate</code> - User navigated to a heading</li>
-                <li><code>toggle</code> - Widget was expanded or collapsed</li>
-                <li><code>theme-changed</code> - Theme was changed</li>
-                <li><code>destroyed</code> - Widget was destroyed</li>
-            </ul>
-        </div>
-
-        <h3 id="state">2.1.2 State Management</h3>
-        <div class="content-section">
-            <p>State management is handled through a simple Map-based system that provides reactive updates and event emission when state changes occur.</p>
-
-            <p>This approach is lightweight but powerful enough for most widget use cases while remaining debuggable and predictable.</p>
-        </div>
-
-        <h2 id="plugin-system">2.2 Plugin System Integration</h2>
-        <div class="content-section">
-            <p>While the current implementation works standalone, it's designed to integrate seamlessly with our planned plugin system. The plugin definition includes:</p>
-
-            <ul>
-                <li>Metadata and versioning information</li>
-                <li>Dependency declarations</li>
-                <li>Default configuration options</li>
-                <li>Lifecycle hooks</li>
-                <li>Theme variants</li>
-                <li>Development helpers</li>
-            </ul>
-        </div>
-
-        <h1 id="usage">3. Usage Examples</h1>
-        <div class="content-section">
-            <p>The DocumentNavigator can be used in several ways, from simple instantiation to advanced configuration with custom themes and behavior.</p>
-        </div>
-
-        <h2 id="basic-usage">3.1 Basic Usage</h2>
-        <div class="content-section">
-            <p>The simplest way to use DocumentNavigator is with default settings:</p>
-
-            <pre><code>const navigator = new DocumentNavigator();
-await navigator.initialize();
-await navigator.render();</code></pre>
-
-            <p>This creates a navigator with default settings that will scan the entire document for headings and display them in a collapsible panel on the left side.</p>
-        </div>
-
-        <h2 id="advanced-usage">3.2 Advanced Configuration</h2>
-        <div class="content-section">
-            <p>For more control, you can specify detailed configuration options:</p>
-
-            <pre><code>const navigator = new DocumentNavigator({
-    position: 'right',
-    collapsed: false,
-    theme: 'dark',
-    maxHeadingLevel: 4,
-    enableScrollSpy: true,
-    smoothScroll: true
-});</code></pre>
-
-            <p>This creates a navigator on the right side that starts expanded, includes H4 headings, and uses the dark theme.</p>
-        </div>
-
-        <h3 id="theming">3.2.1 Custom Theming</h3>
-        <div class="content-section">
-            <p>The navigator supports multiple built-in themes and can be extended with custom themes. The theming system integrates with MarkiTect's document themes for consistent styling.</p>
-
-            <p>Available themes include <code>default</code>, <code>dark</code>, and <code>minimal</code>, each optimized for different use cases and aesthetics.</p>
-        </div>
-
-        <h1 id="testing">4. Testing and Quality</h1>
-        <div class="content-section">
-            <p>The DocumentNavigator implementation follows Test-Driven Development (TDD) methodology with comprehensive test coverage ensuring reliability and maintainability.</p>
-        </div>
-
-        <h2 id="test-coverage">4.1 Test Coverage</h2>
-        <div class="content-section">
-            <p>Our test suite covers all major functionality:</p>
-
-            <ul>
-                <li>Widget instantiation and configuration</li>
-                <li>DOM rendering and element creation</li>
-                <li>Heading extraction and hierarchy building</li>
-                <li>Navigation and smooth scrolling</li>
-                <li>Expand/collapse animations</li>
-                <li>Scroll spy functionality</li>
-                <li>Responsive behavior</li>
-                <li>Keyboard navigation</li>
-                <li>Event emission</li>
-                <li>Edge cases and error handling</li>
-            </ul>
-        </div>
-
-        <h2 id="performance">4.2 Performance Considerations</h2>
-        <div class="content-section">
-            <p>The navigator is optimized for performance with several key strategies:</p>
-
-            <ul>
-                <li><strong>Throttled Scroll Events</strong>: Scroll spy updates are throttled to 100ms intervals</li>
-                <li><strong>Efficient DOM Queries</strong>: Heading extraction is done once and cached</li>
-                <li><strong>Conditional Rendering</strong>: Navigator only renders if minimum heading count is met</li>
-                <li><strong>Memory Management</strong>: Proper cleanup prevents memory leaks</li>
-                <li><strong>Responsive Loading</strong>: Navigator automatically hides on mobile to save resources</li>
-            </ul>
-        </div>
-
-        <h1 id="conclusion">5. Conclusion</h1>
-        <div class="content-section">
-            <p>The DocumentNavigator widget successfully brings Substack-style navigation to MarkiTect documents. It provides an intuitive, accessible, and performant way for users to navigate long-form content.</p>
-
-            <p>The implementation demonstrates the power of our widget architecture approach, with clean separation of concerns, comprehensive testing, and excellent extensibility for future enhancements.</p>
-
-            <p><strong>Scroll back to the top and try the navigation features!</strong> The hamburger menu should be visible on the left side of your screen.</p>
-        </div>
-    </div>
-
-    <!-- Load widget classes -->
-    <script type="module">
-        // Import our widget classes
-        import { Widget } from '../widgets/base/Widget.js';
-        import { UIWidget } from '../widgets/base/UIWidget.js';
-        import { DocumentNavigator } from '../widgets/navigation/DocumentNavigator.js';
-
-        // Make classes available globally for demo
-        window.Widget = Widget;
-        window.UIWidget = UIWidget;
-        window.DocumentNavigator = DocumentNavigator;
-
-        // Initialize navigator on page load
-        document.addEventListener('DOMContentLoaded', async () => {
-            console.log('🧭 Initializing DocumentNavigator demo...');
-
-            try {
-                // Create navigator with demo settings
-                const navigator = new DocumentNavigator({
-                    container: document.getElementById('markdown-content'),
-                    position: 'left',
-                    collapsed: true,
-                    theme: 'default',
-                    enableScrollSpy: true,
-                    autoHide: true,
-                    maxHeadingLevel: 3,
-                    minHeadings: 1  // Show navigator even with few headings for demo
-                });
-
-                // Initialize and render
-                await navigator.initialize();
-                const element = await navigator.render();
-
-                if (element) {
-                    console.log('✅ DocumentNavigator initialized successfully!');
-                    console.log(`   Found ${navigator.headings.length} headings`);
-                    console.log('   Click the hamburger menu (☰) to expand navigation');
-                } else {
-                    console.log('ℹ️ DocumentNavigator not rendered (insufficient headings)');
-                }
-
-                // Add some debugging helpers
-                window.navigator = navigator;
-                window.testNavigator = {
-                    expand: () => navigator.expand(),
-                    collapse: () => navigator.collapse(),
-                    toggle: () => navigator.toggle(),
-                    showHeadings: () => console.table(navigator.headings),
-                    showTree: () => console.log(navigator.navigationTree)
-                };
-
-                console.log('🔧 Debugging helpers available:');
-                console.log('   window.navigator - navigator instance');
-                console.log('   window.testNavigator - helper functions');
-
-            } catch (error) {
-                console.error('❌ DocumentNavigator initialization failed:', error);
-            }
-        });
-    </script>
-</body>
-</html>

markitect/static/js/tests/test-real-user-functionality.js

@@ -1,285 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * Real User Functionality Tests
- *
- * This test file validates the actual functionality that users experience,
- * not just internal API calls. It tests the complete user workflow.
- */
-
-const RefactorTestRunner = require('./refactor-test-runner.js');
-
-const runner = new RefactorTestRunner();
-
-runner.describe('Real User Functionality Tests', () => {
-
-    runner.it('should allow users to edit content and see changes in DOM', () => {
-        // Load all extracted components
-        const sectionModule = require('../core/section-manager.js');
-        const domModule = require('../components/dom-renderer.js');
-        const debugModule = require('../components/debug-panel.js');
-        const controlsModule = require('../components/document-controls.js');
-
-        const { SectionManager } = sectionModule;
-        const { DOMRenderer } = domModule;
-        const { DebugPanel } = debugModule;
-        const { DocumentControls } = controlsModule;
-
-        // Setup DOM container
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        // Create components
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-        const debugPanel = new DebugPanel();
-        const documentControls = new DocumentControls();
-
-        // Setup document controls
-        documentControls.create();
-
-        // Create sections from test markdown
-        const testMarkdown = `# Original Title\nOriginal content that should be editable.`;
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        const firstSection = sections[0];
-        const sectionElement = container.querySelector(`[data-section-id="${firstSection.id}"]`);
-
-        // Verify original content is rendered
-        runner.expect(sectionElement.innerHTML).toContain('Original Title');
-
-        // Simulate user clicking on section
-        const clickEvent = new Event('click', { bubbles: true });
-        sectionElement.dispatchEvent(clickEvent);
-
-        // Verify editing state is active
-        runner.expect(firstSection.isEditing()).toBeTruthy();
-
-        // Find the floating menu and edit controls
-        const floatingMenu = document.querySelector('.ui-edit-floating-menu');
-        runner.expect(floatingMenu).toBeTruthy();
-
-        const textarea = floatingMenu.querySelector('textarea');
-        const acceptButton = Array.from(floatingMenu.querySelectorAll('button')).find(btn => btn.textContent.includes('Accept'));
-
-        runner.expect(textarea).toBeTruthy();
-        runner.expect(acceptButton).toBeTruthy();
-
-        // Simulate user editing content
-        const newContent = '# Updated Title\nCompletely new content added by user.';
-        textarea.value = newContent;
-
-        // Simulate user clicking accept
-        acceptButton.click();
-
-        // Verify section is no longer editing
-        runner.expect(firstSection.isEditing()).toBeFalsy();
-
-        // Verify floating menu is gone
-        const menuAfterAccept = document.querySelector('.ui-edit-floating-menu');
-        runner.expect(menuAfterAccept).toBeFalsy();
-
-        // CRITICAL TEST: Verify DOM was actually updated with new content
-        const updatedElement = container.querySelector(`[data-section-id="${firstSection.id}"]`);
-        runner.expect(updatedElement.innerHTML).toContain('Updated Title');
-        runner.expect(updatedElement.innerHTML).toContain('Completely new content');
-        runner.expect(updatedElement.innerHTML).not.toContain('Original Title');
-
-        // Cleanup
-        document.body.removeChild(container);
-        documentControls.destroy();
-    });
-
-    runner.it('should allow users to reset all changes', () => {
-        // Setup similar to above
-        const sectionModule = require('../core/section-manager.js');
-        const domModule = require('../components/dom-renderer.js');
-        const controlsModule = require('../components/document-controls.js');
-
-        const { SectionManager } = sectionModule;
-        const { DOMRenderer } = domModule;
-        const { DocumentControls } = controlsModule;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-        const documentControls = new DocumentControls();
-
-        documentControls.create();
-
-        // Create and modify content
-        const testMarkdown = `# Test Section\nOriginal content for reset test.`;
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        const firstSection = sections[0];
-
-        // Make changes to the section
-        sectionManager.startEditing(firstSection.id);
-        sectionManager.updateContent(firstSection.id, '# Modified Title\nModified content.');
-        sectionManager.acceptChanges(firstSection.id);
-
-        // Verify changes are applied
-        let sectionElement = container.querySelector(`[data-section-id="${firstSection.id}"]`);
-        runner.expect(sectionElement.innerHTML).toContain('Modified Title');
-        runner.expect(firstSection.hasChanges()).toBeTruthy();
-
-        // Test reset functionality
-        const resetButton = documentControls.getButton('reset-all');
-        runner.expect(resetButton).toBeTruthy();
-
-        // Click reset button
-        resetButton.click();
-
-        // Verify content is reset
-        sectionElement = container.querySelector(`[data-section-id="${firstSection.id}"]`);
-        runner.expect(sectionElement.innerHTML).toContain('Test Section');
-        runner.expect(sectionElement.innerHTML).not.toContain('Modified Title');
-        runner.expect(firstSection.hasChanges()).toBeFalsy();
-
-        // Cleanup
-        document.body.removeChild(container);
-        documentControls.destroy();
-    });
-
-    runner.it('should handle cancel operations correctly', () => {
-        const sectionModule = require('../core/section-manager.js');
-        const domModule = require('../components/dom-renderer.js');
-
-        const { SectionManager } = sectionModule;
-        const { DOMRenderer } = domModule;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-
-        const testMarkdown = `# Cancel Test\nContent that should remain unchanged.`;
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        const firstSection = sections[0];
-        const originalContent = firstSection.currentMarkdown;
-
-        // Start editing
-        const sectionElement = container.querySelector(`[data-section-id="${firstSection.id}"]`);
-        sectionElement.click();
-
-        // Make changes but cancel them
-        const floatingMenu = document.querySelector('.ui-edit-floating-menu');
-        const textarea = floatingMenu.querySelector('textarea');
-        const cancelButton = Array.from(floatingMenu.querySelectorAll('button')).find(btn => btn.textContent.includes('Cancel'));
-
-        textarea.value = '# This should be cancelled\nThis content should not appear.';
-        cancelButton.click();
-
-        // Verify content is unchanged
-        const unchangedElement = container.querySelector(`[data-section-id="${firstSection.id}"]`);
-        runner.expect(unchangedElement.innerHTML).toContain('Cancel Test');
-        runner.expect(unchangedElement.innerHTML).not.toContain('This should be cancelled');
-        runner.expect(firstSection.currentMarkdown).toBe(originalContent);
-
-        // Cleanup
-        document.body.removeChild(container);
-    });
-
-    runner.it('should validate the complete editing workflow', () => {
-        // This test validates the entire user experience end-to-end
-        const sectionModule = require('../core/section-manager.js');
-        const domModule = require('../components/dom-renderer.js');
-        const debugModule = require('../components/debug-panel.js');
-        const controlsModule = require('../components/document-controls.js');
-
-        const { SectionManager } = sectionModule;
-        const { DOMRenderer } = domModule;
-        const { DebugPanel } = debugModule;
-        const { DocumentControls } = controlsModule;
-
-        const container = document.createElement('div');
-        container.innerHTML = '<div id="markdown-content"></div>';
-        document.body.appendChild(container);
-
-        const sectionManager = new SectionManager();
-        const domRenderer = new DOMRenderer(sectionManager, container);
-        const debugPanel = new DebugPanel();
-        const documentControls = new DocumentControls();
-
-        documentControls.create();
-
-        // Multi-section document
-        const testMarkdown = `# Document Title
-Introduction paragraph.
-
-## Section A
-Content for section A.
-
-## Section B
-Content for section B.`;
-
-        const sections = sectionManager.createSectionsFromMarkdown(testMarkdown);
-        domRenderer.renderAllSections(sections);
-
-        // Verify all sections are rendered
-        const renderedSections = container.querySelectorAll('.ui-edit-section');
-        runner.expect(renderedSections.length).toBe(sections.length);
-
-        // Test editing multiple sections
-        const firstSection = sections[0];
-        const secondSection = sections[2]; // Section A
-
-        // Edit first section
-        renderedSections[0].click();
-        let floatingMenu = document.querySelector('.ui-edit-floating-menu');
-        let textarea = floatingMenu.querySelector('textarea');
-        let acceptButton = Array.from(floatingMenu.querySelectorAll('button')).find(btn => btn.textContent.includes('Accept'));
-
-        textarea.value = '# Updated Document Title\nUpdated introduction.';
-        acceptButton.click();
-
-        // Edit second section
-        renderedSections[2].click();
-        floatingMenu = document.querySelector('.ui-edit-floating-menu');
-        textarea = floatingMenu.querySelector('textarea');
-        acceptButton = Array.from(floatingMenu.querySelectorAll('button')).find(btn => btn.textContent.includes('Accept'));
-
-        textarea.value = '## Updated Section A\nCompletely new content for section A.';
-        acceptButton.click();
-
-        // Verify both sections were updated
-        const updatedSections = container.querySelectorAll('.ui-edit-section');
-        runner.expect(updatedSections[0].innerHTML).toContain('Updated Document Title');
-        runner.expect(updatedSections[2].innerHTML).toContain('Updated Section A');
-
-        // Test reset restores all sections
-        const resetButton = documentControls.getButton('reset-all');
-        resetButton.click();
-
-        const resetSections = container.querySelectorAll('.ui-edit-section');
-        runner.expect(resetSections[0].innerHTML).toContain('Document Title');
-        runner.expect(resetSections[0].innerHTML).not.toContain('Updated Document Title');
-        runner.expect(resetSections[2].innerHTML).toContain('Section A');
-        runner.expect(resetSections[2].innerHTML).not.toContain('Updated Section A');
-
-        // Cleanup
-        document.body.removeChild(container);
-        documentControls.destroy();
-    });
-});
-
-module.exports = runner;
-
-// Run tests if called directly
-if (require.main === module) {
-    console.log('🧪 Running Real User Functionality Tests');
-    runner.run().then(() => {
-        console.log('✅ Real user functionality tests completed');
-        console.log('These tests validate what users actually experience, not just internal APIs');
-    });
-}

markitect/static/js/tests/test-section-manager-extraction.js

@@ -1,196 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * TDD Test for SectionManager Component Extraction
- *
- * Tests the extraction of SectionManager from the monolithic editor.js
- * Ensures all functionality is preserved during refactoring.
- */
-
-const RefactorTestRunner = require('./refactor-test-runner.js');
-
-const runner = new RefactorTestRunner();
-
-// First, let's define what the SectionManager API should look like
-const EXPECTED_SECTION_MANAGER_API = [
-    'constructor',
-    'createSectionsFromMarkdown',
-    'startEditing',
-    'stopEditing',
-    'getAllSections',
-    'sections', // Map property, not method
-    'getDocumentStatus',
-    'getDocumentMarkdown',
-    'on', // event system
-    'emit', // event system
-    'handleSectionSplit',
-    'updateContent',
-    'acceptChanges',
-    'cancelChanges',
-    'resetSection'
-];
-
-runner.describe('SectionManager Component Extraction', () => {
-
-    runner.it('should define expected API methods', () => {
-        // This test defines what we expect from the extracted SectionManager
-        const expectedMethods = EXPECTED_SECTION_MANAGER_API;
-        runner.expect(expectedMethods.length).toBe(15);
-        runner.expect(expectedMethods).toContain('createSectionsFromMarkdown');
-        runner.expect(expectedMethods).toContain('startEditing');
-        runner.expect(expectedMethods).toContain('stopEditing');
-    });
-
-    runner.it('should extract from monolithic editor.js', () => {
-        // Load the monolithic editor.js to extract SectionManager
-        delete require.cache[require.resolve('/home/worsch/markitect_project/markitect/static/editor.js')];
-
-        try {
-            const editorModule = require('/home/worsch/markitect_project/markitect/static/editor.js');
-            runner.expect(editorModule.SectionManager).toBeTruthy();
-            // Set global for other tests
-            global.SectionManager = editorModule.SectionManager;
-            global.Section = editorModule.Section;
-            global.EditState = editorModule.EditState;
-        } catch (error) {
-            throw new Error(`Failed to load monolithic editor.js: ${error.message}`);
-        }
-    });
-
-    runner.it('should preserve SectionManager constructor functionality', () => {
-        const SectionManager = global.SectionManager;
-
-        const manager = new SectionManager();
-        runner.expect(manager).toBeInstanceOf(SectionManager);
-        runner.expect(manager.sections).toBeInstanceOf(Map);
-    });
-
-    runner.it('should preserve createSectionsFromMarkdown functionality', () => {
-        const SectionManager = global.SectionManager;
-        const manager = new SectionManager();
-
-        const testMarkdown = `# Heading 1\nContent 1\n\n## Heading 2\nContent 2`;
-        const sections = manager.createSectionsFromMarkdown(testMarkdown);
-
-        runner.expect(Array.isArray(sections)).toBeTruthy();
-        runner.expect(sections.length).toBe(2);
-        runner.expect(sections[0].currentMarkdown).toContain('Heading 1');
-        runner.expect(sections[1].currentMarkdown).toContain('Heading 2');
-    });
-
-    runner.it('should preserve section editing state management', () => {
-        const SectionManager = global.SectionManager;
-        const manager = new SectionManager();
-
-        const sections = manager.createSectionsFromMarkdown('# Test\nContent');
-        const sectionId = sections[0].id;
-
-        // Test start editing
-        runner.expect(manager.startEditing(sectionId)).toBeTruthy();
-        const section = manager.sections.get(sectionId);
-        runner.expect(section.isEditing()).toBeTruthy();
-
-        // Test stop editing
-        section.stopEditing();
-        runner.expect(section.isEditing()).toBeFalsy();
-    });
-
-    runner.it('should preserve event system functionality', () => {
-        const SectionManager = global.SectionManager;
-        const manager = new SectionManager();
-
-        let eventFired = false;
-        let eventData = null;
-
-        manager.on('test-event', (data) => {
-            eventFired = true;
-            eventData = data;
-        });
-
-        manager.emit('test-event', { test: 'data' });
-
-        runner.expect(eventFired).toBeTruthy();
-        runner.expect(eventData).toEqual({ test: 'data' });
-    });
-
-    runner.it('should preserve document status functionality', () => {
-        const SectionManager = global.SectionManager;
-        const manager = new SectionManager();
-
-        manager.createSectionsFromMarkdown('# Test\nContent');
-        const status = manager.getDocumentStatus();
-
-        runner.expect(status).toHaveProperty('totalSections');
-        runner.expect(status).toHaveProperty('editingSections');
-        runner.expect(status.totalSections).toBe(1);
-    });
-
-    runner.it('should preserve getAllSections functionality', () => {
-        const SectionManager = global.SectionManager;
-        const manager = new SectionManager();
-
-        const testMarkdown = '# One\nContent\n\n# Two\nMore content';
-        manager.createSectionsFromMarkdown(testMarkdown);
-
-        const allSections = manager.getAllSections();
-        runner.expect(Array.isArray(allSections)).toBeTruthy();
-        runner.expect(allSections.length).toBe(2);
-    });
-
-    runner.it('should preserve section splitting functionality', () => {
-        const SectionManager = global.SectionManager;
-        const manager = new SectionManager();
-
-        const sections = manager.createSectionsFromMarkdown('# Original\nContent');
-        const sectionId = sections[0].id;
-
-        const newContent = '# Split 1\nContent 1\n\n# Split 2\nContent 2';
-        const newSections = manager.handleSectionSplit(sectionId, newContent);
-
-        runner.expect(Array.isArray(newSections)).toBeTruthy();
-        runner.expect(newSections.length).toBe(2);
-        runner.expect(manager.sections.has(sectionId)).toBeFalsy(); // Original removed
-    });
-});
-
-// Export API tests for use during extraction
-const SECTION_MANAGER_API_TESTS = [
-    (SectionManager) => {
-        const manager = new SectionManager();
-        if (!manager.sections || !(manager.sections instanceof Map)) {
-            throw new Error('sections property missing or not a Map');
-        }
-    },
-    (SectionManager) => {
-        const manager = new SectionManager();
-        if (typeof manager.createSectionsFromMarkdown !== 'function') {
-            throw new Error('createSectionsFromMarkdown method missing');
-        }
-    },
-    (SectionManager) => {
-        const manager = new SectionManager();
-        if (typeof manager.startEditing !== 'function') {
-            throw new Error('startEditing method missing');
-        }
-    },
-    (SectionManager) => {
-        const manager = new SectionManager();
-        if (typeof manager.stopEditing !== 'function') {
-            throw new Error('stopEditing method missing');
-        }
-    }
-];
-
-module.exports = {
-    runner,
-    EXPECTED_SECTION_MANAGER_API,
-    SECTION_MANAGER_API_TESTS
-};
-
-// Run tests if called directly
-if (require.main === module) {
-    console.log('🧪 Testing SectionManager Component Extraction');
-    runner.run().then(() => {
-        console.log('✅ SectionManager extraction tests completed');
-    });
-}

markitect/static/js/tests/test.md

@@ -1,6 +0,0 @@
-# Test Document
-
-This is a test document to check if UI controls appear in edit mode.
-
-## Section 1
-Some content here.

markitect/static/js/tests/test_edit.html

@@ -1,149 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="generator" content="Markitect Markitect v0.8.1.dev24+gdbde13e03.d20251111">
-    <title>Test Document</title>
-
-    <!-- Base styling for document content -->
-    <style>
-        body {
-            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-            line-height: 1.6;
-            color: #333;
-            max-width: 1200px;
-            margin: 0 auto;
-            padding: 2rem;
-            background-color: #ffffff;
-        }
-
-        /* Responsive design */
-        @media (max-width: 768px) {
-            body {
-                padding: 1rem;
-                font-size: 0.9rem;
-            }
-        }
-
-        /* Content styling */
-        h1, h2, h3, h4, h5, h6 {
-            color: #2c3e50;
-            margin-top: 2rem;
-            margin-bottom: 1rem;
-        }
-
-        h1 { font-size: 2.5em; border-bottom: 3px solid #3498db; padding-bottom: 0.5rem; }
-        h2 { font-size: 2em; border-bottom: 2px solid #3498db; padding-bottom: 0.3rem; }
-        h3 { font-size: 1.5em; color: #34495e; }
-
-        p {
-            margin-bottom: 1.2rem;
-            text-align: justify;
-        }
-
-        a {
-            color: #3498db;
-            text-decoration: none;
-        }
-
-        a:hover {
-            text-decoration: underline;
-        }
-
-        blockquote {
-            border-left: 4px solid #3498db;
-            margin: 1.5rem 0;
-            padding-left: 1rem;
-            color: #7f8c8d;
-        }
-
-        code {
-            background-color: #f8f9fa;
-            padding: 0.2rem 0.4rem;
-            border-radius: 3px;
-            font-family: 'Courier New', monospace;
-        }
-
-        pre {
-            background-color: #f8f9fa;
-            padding: 1rem;
-            border-radius: 5px;
-            overflow-x: auto;
-            border: 1px solid #e9ecef;
-        }
-
-        img {
-            max-width: 100%;
-            height: auto;
-            border-radius: 5px;
-            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
-        }
-
-        table {
-            border-collapse: collapse;
-            width: 100%;
-            margin: 1.5rem 0;
-        }
-
-        th, td {
-            border: 1px solid #dee2e6;
-            padding: 0.75rem;
-            text-align: left;
-        }
-
-        th {
-            background-color: #f8f9fa;
-            font-weight: 600;
-        }
-
-        /* Print styles */
-        @media print {
-            .control-panel {
-                display: none !important;
-            }
-
-            body {
-                font-size: 12pt;
-                line-height: 1.4;
-            }
-        }
-    </style>
-
-    <!-- Control system styles -->
-    <link rel="stylesheet" href="markitect/static/css/controls.css">
-
-    <!-- External dependencies -->
-    <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"
-            onerror="console.error('CDN library failed to load - network or firewall blocking marked.js'); window.markitectMarkedError = true;"></script>
-</head>
-<body>
-    <div id="markitect-content">
-        <h1 id="test-document">Test Document</h1>
-<p>This is a test document to check if UI controls appear in edit mode.</p>
-<h2 id="section-1">Section 1</h2>
-<p>Some content here.</p>
-<hr />
-<p><em>-- html from markdown by <a href="https://coulomb.social/open/MarkiTect" target="_blank">MarkiTect</a> on 2025-11-11 23:42:23 by <a href="https://coulomb.social/open/worsch" target="_blank">worsch</a></em></p>
-    </div>
-
-    <!-- Core JavaScript modules -->
-    <script src="markitect/static/js/core/debug-system.js"></script>
-
-    <!-- Control system -->
-    <script src="../js/controls/control-base.js"></script>
-    <script src="../js/controls/status-control.js"></script>
-
-    <!-- Main application -->
-    <script src="markitect/static/js/main.js"></script>
-
-    <!-- Handle CDN loading errors -->
-    <script>
-        window.addEventListener('load', function() {
-            if (window.markitectMarkedError) {
-                console.error("CDN library failed to load - network or firewall blocking marked.js");
-            }
-        });
-    </script>
-</body>
-</html>

markitect/static/js/widgets/base/UIWidget.js

@@ -1,215 +0,0 @@
-/**
- * UI Widget Base Class
- *
- * Extends Widget with DOM manipulation and visual functionality.
- * Base for all widgets that render UI elements.
- */
-import { Widget } from './Widget.js';
-
-export class UIWidget extends Widget {
-    constructor(options = {}) {
-        super(options);
-
-        // UI properties
-        this.element = null;
-        this.isVisible = false;
-        this.isRendered = false;
-        this.theme = options.theme || 'default';
-        this.cssClasses = new Set(['markitect-widget']);
-
-        // Animation support
-        this.animationDuration = options.animationDuration || 300;
-        this.enableAnimations = options.enableAnimations !== false;
-    }
-
-    /**
-     * Render the widget to DOM (abstract method)
-     */
-    async render() {
-        throw new Error('render() method must be implemented by subclass');
-    }
-
-    /**
-     * Show the widget
-     */
-    async show(options = {}) {
-        if (!this.isRendered) {
-            await this.render();
-        }
-
-        if (this.isVisible) {
-            return this;
-        }
-
-        this.isVisible = true;
-
-        if (this.element) {
-            if (this.enableAnimations && !options.immediate) {
-                await this.animateShow();
-            } else {
-                this.element.style.display = '';
-            }
-        }
-
-        this.emit('shown');
-        return this;
-    }
-
-    /**
-     * Hide the widget
-     */
-    async hide(options = {}) {
-        if (!this.isVisible) {
-            return this;
-        }
-
-        this.isVisible = false;
-
-        if (this.element) {
-            if (this.enableAnimations && !options.immediate) {
-                await this.animateHide();
-            } else {
-                this.element.style.display = 'none';
-            }
-        }
-
-        this.emit('hidden');
-        return this;
-    }
-
-    /**
-     * Toggle visibility
-     */
-    async toggle(options = {}) {
-        return this.isVisible ? this.hide(options) : this.show(options);
-    }
-
-    /**
-     * Show animation (override for custom animations)
-     */
-    async animateShow() {
-        if (!this.element) return;
-
-        return new Promise(resolve => {
-            this.element.style.transition = `opacity ${this.animationDuration}ms ease-in-out`;
-            this.element.style.opacity = '0';
-            this.element.style.display = '';
-
-            // Force reflow
-            this.element.offsetHeight;
-
-            this.element.style.opacity = '1';
-
-            setTimeout(() => {
-                this.element.style.transition = '';
-                resolve();
-            }, this.animationDuration);
-        });
-    }
-
-    /**
-     * Hide animation (override for custom animations)
-     */
-    async animateHide() {
-        if (!this.element) return;
-
-        return new Promise(resolve => {
-            this.element.style.transition = `opacity ${this.animationDuration}ms ease-in-out`;
-            this.element.style.opacity = '0';
-
-            setTimeout(() => {
-                this.element.style.display = 'none';
-                this.element.style.transition = '';
-                this.element.style.opacity = '';
-                resolve();
-            }, this.animationDuration);
-        });
-    }
-
-    /**
-     * CSS class management
-     */
-    addClass(className) {
-        this.cssClasses.add(className);
-        if (this.element) {
-            this.element.classList.add(className);
-        }
-        return this;
-    }
-
-    removeClass(className) {
-        this.cssClasses.delete(className);
-        if (this.element) {
-            this.element.classList.remove(className);
-        }
-        return this;
-    }
-
-    hasClass(className) {
-        return this.cssClasses.has(className);
-    }
-
-    /**
-     * Apply theme styling
-     */
-    applyTheme(themeName) {
-        const oldTheme = this.theme;
-        this.theme = themeName;
-
-        this.removeClass(`theme-${oldTheme}`);
-        this.addClass(`theme-${themeName}`);
-
-        this.emit('theme-changed', { oldTheme, newTheme: themeName });
-        return this;
-    }
-
-    /**
-     * Find child element by selector
-     */
-    findElement(selector) {
-        return this.element ? this.element.querySelector(selector) : null;
-    }
-
-    /**
-     * Find all child elements by selector
-     */
-    findElements(selector) {
-        return this.element ? this.element.querySelectorAll(selector) : [];
-    }
-
-    /**
-     * Override destroy to clean up DOM
-     */
-    async destroy() {
-        if (this.element && this.element.parentNode) {
-            this.element.parentNode.removeChild(this.element);
-        }
-
-        this.element = null;
-        this.isRendered = false;
-        this.isVisible = false;
-
-        await super.destroy();
-    }
-
-    /**
-     * Apply all CSS classes to element
-     */
-    applyCSSClasses(element = this.element) {
-        if (element) {
-            element.className = Array.from(this.cssClasses).join(' ');
-        }
-    }
-
-    /**
-     * Default configuration for UI widgets
-     */
-    getDefaultConfig() {
-        return {
-            ...super.getDefaultConfig(),
-            theme: 'default',
-            animationDuration: 300,
-            enableAnimations: true
-        };
-    }
-}

markitect/static/js/widgets/base/Widget.js

@@ -1,141 +0,0 @@
-/**
- * Base Widget Class
- *
- * Foundation class for all Markitect UI widgets following the plugin architecture.
- * Provides core functionality for event handling, state management, and lifecycle.
- */
-export class Widget extends EventTarget {
-    constructor(options = {}) {
-        super();
-
-        // Core properties
-        this.id = options.id || `widget-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-        this.container = options.container || document.body;
-        this.config = { ...this.getDefaultConfig(), ...options };
-
-        // State management
-        this.state = new Map();
-        this.isInitialized = false;
-        this.isDestroyed = false;
-
-        // Mixin support
-        this.mixins = [];
-
-        // Lifecycle hooks
-        this.onInitialize = options.onInitialize || (() => {});
-        this.onDestroy = options.onDestroy || (() => {});
-    }
-
-    /**
-     * Initialize the widget
-     */
-    async initialize() {
-        if (this.isInitialized || this.isDestroyed) {
-            return this;
-        }
-
-        try {
-            await this.onInitialize(this);
-            this.isInitialized = true;
-            this.emit('initialized');
-            return this;
-        } catch (error) {
-            this.emit('error', { phase: 'initialize', error });
-            throw error;
-        }
-    }
-
-    /**
-     * Destroy the widget and clean up resources
-     */
-    async destroy() {
-        if (this.isDestroyed) {
-            return;
-        }
-
-        try {
-            await this.onDestroy(this);
-            this.isDestroyed = true;
-            this.emit('destroyed');
-        } catch (error) {
-            this.emit('error', { phase: 'destroy', error });
-            throw error;
-        }
-    }
-
-    /**
-     * State management
-     */
-    setState(key, value) {
-        const oldValue = this.state.get(key);
-        this.state.set(key, value);
-        this.emit('state-changed', { key, value, oldValue });
-    }
-
-    getState(key, defaultValue = null) {
-        return this.state.get(key) ?? defaultValue;
-    }
-
-    /**
-     * Event emission wrapper
-     */
-    emit(eventType, data = {}) {
-        const event = new CustomEvent(eventType, {
-            detail: { widget: this, ...data }
-        });
-        this.dispatchEvent(event);
-    }
-
-    /**
-     * Apply mixin functionality
-     */
-    applyMixin(mixin) {
-        if (typeof mixin === 'object') {
-            Object.assign(this, mixin);
-            this.mixins.push(mixin);
-        }
-        return this;
-    }
-
-    /**
-     * Default configuration (override in subclasses)
-     */
-    getDefaultConfig() {
-        return {};
-    }
-
-    /**
-     * Utility method for creating DOM elements with styling
-     */
-    createElement(tag, options = {}) {
-        const element = document.createElement(tag);
-
-        if (options.className) {
-            element.className = options.className;
-        }
-
-        if (options.textContent) {
-            element.textContent = options.textContent;
-        }
-
-        if (options.innerHTML) {
-            element.innerHTML = options.innerHTML;
-        }
-
-        if (options.style) {
-            if (typeof options.style === 'string') {
-                element.style.cssText = options.style;
-            } else {
-                Object.assign(element.style, options.style);
-            }
-        }
-
-        if (options.attributes) {
-            Object.entries(options.attributes).forEach(([key, value]) => {
-                element.setAttribute(key, value);
-            });
-        }
-
-        return element;
-    }
-}

markitect/static/js/widgets/navigation/DocumentNavigator.js

@@ -1,625 +0,0 @@
-/**
- * DocumentNavigator Widget
- *
- * Substack-style floating document navigation widget that displays a hierarchical
- * table of contents based on document headings. Supports smooth scrolling,
- * scroll spy, expand/collapse, and responsive behavior.
- */
-import { UIWidget } from '../base/UIWidget.js';
-
-export class DocumentNavigator extends UIWidget {
-    constructor(options = {}) {
-        super(options);
-
-        // Navigation state
-        this.isCollapsed = this.config.collapsed;
-        this.currentSection = null;
-        this.headings = [];
-        this.navigationTree = [];
-
-        // Scroll spy state
-        this.scrollSpyEnabled = this.config.enableScrollSpy;
-        this.scrollThrottle = null;
-
-        // Event bindings
-        this.boundScrollHandler = this.handleScroll.bind(this);
-        this.boundResizeHandler = this.handleResize.bind(this);
-
-        // Initialize responsive behavior
-        this.mediaQuery = window.matchMedia('(max-width: 768px)');
-    }
-
-    getDefaultConfig() {
-        return {
-            ...super.getDefaultConfig(),
-            position: 'left',           // 'left' or 'right'
-            collapsed: true,            // Start collapsed
-            autoHide: true,             // Hide on mobile
-            maxHeadingLevel: 3,         // H1, H2, H3
-            enableScrollSpy: true,      // Highlight current section
-            smoothScroll: true,         // Smooth scroll behavior
-            animationDuration: 300,     // Animation timing
-            minHeadings: 2,            // Min headings to show navigator
-            theme: 'default',          // Theme support
-
-            // Styling options
-            width: '280px',
-            collapsedWidth: '40px',
-            offset: { top: '80px', side: '20px' },
-
-            // Accessibility
-            enableKeyboard: true,
-            ariaLabel: 'Document Navigation'
-        };
-    }
-
-    async initialize() {
-        await super.initialize();
-
-        // Extract headings from container
-        this.extractHeadings();
-        this.buildNavigationTree();
-
-        // Set up event listeners
-        if (this.scrollSpyEnabled) {
-            window.addEventListener('scroll', this.boundScrollHandler, { passive: true });
-        }
-
-        if (this.config.autoHide) {
-            window.addEventListener('resize', this.boundResizeHandler);
-            this.handleResize(); // Initial check
-        }
-
-        return this;
-    }
-
-    async render() {
-        if (this.isRendered) {
-            return this.element;
-        }
-
-        // Check if we have enough headings
-        if (this.headings.length < this.config.minHeadings) {
-            this.isRendered = true;
-            return null; // Don't render if too few headings
-        }
-
-        // Create main container
-        this.element = this.createElement('nav', {
-            className: 'document-navigator markitect-widget',
-            attributes: {
-                'aria-label': this.config.ariaLabel,
-                'role': 'navigation'
-            },
-            style: this.getNavigatorStyle()
-        });
-
-        // Apply CSS classes
-        this.applyCSSClasses();
-        this.addClass('theme-' + this.theme);
-        this.addClass('position-' + this.config.position);
-
-        // Create toggle button (always visible)
-        this.createToggleButton();
-
-        // Create navigation list (hidden when collapsed)
-        this.createNavigationList();
-
-        // Set initial visibility state
-        if (this.isCollapsed) {
-            await this.collapse({ immediate: true });
-        } else {
-            await this.expand({ immediate: true });
-        }
-
-        // Append to container
-        this.container.appendChild(this.element);
-
-        // Initialize scroll spy
-        if (this.scrollSpyEnabled) {
-            this.updateCurrentSection();
-        }
-
-        this.isRendered = true;
-        this.emit('rendered');
-
-        return this.element;
-    }
-
-    createToggleButton() {
-        this.toggleButton = this.createElement('button', {
-            className: 'navigator-toggle',
-            attributes: {
-                'type': 'button',
-                'aria-label': this.isCollapsed ? 'Expand navigation' : 'Collapse navigation',
-                'aria-expanded': !this.isCollapsed
-            },
-            innerHTML: this.getToggleIcon(),
-            style: this.getToggleStyle()
-        });
-
-        // Toggle on click
-        this.toggleButton.addEventListener('click', async () => {
-            await this.toggle();
-        });
-
-        // Keyboard support
-        if (this.config.enableKeyboard) {
-            this.toggleButton.addEventListener('keydown', this.handleKeyboard.bind(this));
-        }
-
-        this.element.appendChild(this.toggleButton);
-    }
-
-    createNavigationList() {
-        this.navigationList = this.createElement('div', {
-            className: 'navigator-list',
-            style: this.getListStyle()
-        });
-
-        if (this.headings.length === 0) {
-            this.createEmptyState();
-        } else {
-            this.populateNavigationList();
-        }
-
-        this.element.appendChild(this.navigationList);
-    }
-
-    createEmptyState() {
-        const emptyMessage = this.createElement('div', {
-            className: 'navigator-empty',
-            textContent: 'No headings found',
-            style: {
-                padding: '1rem',
-                textAlign: 'center',
-                color: '#666',
-                fontStyle: 'italic'
-            }
-        });
-
-        this.navigationList.appendChild(emptyMessage);
-    }
-
-    populateNavigationList() {
-        // Create header
-        const header = this.createElement('div', {
-            className: 'navigator-header',
-            innerHTML: `
-                <h3>Contents</h3>
-                <button class="navigator-close" aria-label="Close navigation">✕</button>
-            `,
-            style: {
-                display: 'flex',
-                justifyContent: 'space-between',
-                alignItems: 'center',
-                padding: '1rem 1rem 0.5rem',
-                borderBottom: '1px solid #eee',
-                marginBottom: '0.5rem'
-            }
-        });
-
-        // Close button functionality
-        const closeButton = header.querySelector('.navigator-close');
-        closeButton.addEventListener('click', async () => {
-            await this.collapse();
-        });
-
-        this.navigationList.appendChild(header);
-
-        // Create navigation items
-        const navContainer = this.createElement('div', {
-            className: 'navigator-items',
-            style: {
-                maxHeight: '70vh',
-                overflowY: 'auto',
-                padding: '0 0.5rem 1rem'
-            }
-        });
-
-        this.renderNavigationTree(navContainer, this.navigationTree);
-        this.navigationList.appendChild(navContainer);
-    }
-
-    renderNavigationTree(container, items, level = 0) {
-        items.forEach(item => {
-            const navItem = this.createElement('div', {
-                className: `navigator-item level-${level}`,
-                style: {
-                    marginLeft: `${level * 1}rem`,
-                    marginBottom: '0.25rem'
-                }
-            });
-
-            // Create clickable link
-            const link = this.createElement('a', {
-                className: 'navigator-link',
-                textContent: item.text,
-                attributes: {
-                    'href': `#${item.id}`,
-                    'data-target': item.id,
-                    'data-level': item.level,
-                    'role': 'button',
-                    'tabindex': '0'
-                },
-                style: {
-                    display: 'block',
-                    padding: '0.5rem 0.75rem',
-                    textDecoration: 'none',
-                    color: '#333',
-                    borderRadius: '4px',
-                    fontSize: level === 0 ? '0.9rem' : '0.8rem',
-                    fontWeight: level === 0 ? '600' : '400',
-                    transition: 'all 0.2s ease',
-                    cursor: 'pointer'
-                }
-            });
-
-            // Hover effects
-            link.addEventListener('mouseenter', () => {
-                link.style.backgroundColor = '#f0f0f0';
-            });
-
-            link.addEventListener('mouseleave', () => {
-                if (!link.classList.contains('active')) {
-                    link.style.backgroundColor = '';
-                }
-            });
-
-            // Click navigation
-            link.addEventListener('click', (e) => {
-                e.preventDefault();
-                this.navigateToHeading(item.id);
-            });
-
-            navItem.appendChild(link);
-
-            // Render children recursively
-            if (item.children && item.children.length > 0) {
-                this.renderNavigationTree(navItem, item.children, level + 1);
-            }
-
-            container.appendChild(navItem);
-        });
-    }
-
-    extractHeadings() {
-        const headingSelectors = [];
-        for (let i = 1; i <= this.config.maxHeadingLevel; i++) {
-            headingSelectors.push(`h${i}`);
-        }
-
-        const headingElements = this.container.querySelectorAll(headingSelectors.join(', '));
-
-        this.headings = Array.from(headingElements).map((heading, index) => {
-            // Ensure heading has an ID
-            if (!heading.id) {
-                heading.id = `heading-${index + 1}`;
-            }
-
-            return {
-                element: heading,
-                id: heading.id,
-                text: heading.textContent.trim(),
-                level: parseInt(heading.tagName.substring(1)),
-                offset: heading.offsetTop
-            };
-        });
-
-        return this.headings;
-    }
-
-    buildNavigationTree() {
-        this.navigationTree = [];
-        const stack = [];
-
-        this.headings.forEach(heading => {
-            const item = {
-                ...heading,
-                children: []
-            };
-
-            // Find correct parent based on heading level
-            while (stack.length > 0 && stack[stack.length - 1].level >= heading.level) {
-                stack.pop();
-            }
-
-            if (stack.length === 0) {
-                // Top level item
-                this.navigationTree.push(item);
-            } else {
-                // Child item
-                stack[stack.length - 1].children.push(item);
-            }
-
-            stack.push(item);
-        });
-
-        return this.navigationTree;
-    }
-
-    async toggle(options = {}) {
-        return this.isCollapsed ? this.expand(options) : this.collapse(options);
-    }
-
-    async expand(options = {}) {
-        if (!this.isCollapsed) {
-            return this;
-        }
-
-        this.isCollapsed = false;
-
-        if (this.toggleButton) {
-            this.toggleButton.setAttribute('aria-expanded', 'true');
-            this.toggleButton.setAttribute('aria-label', 'Collapse navigation');
-            this.toggleButton.innerHTML = this.getToggleIcon();
-        }
-
-        if (this.navigationList) {
-            if (this.enableAnimations && !options.immediate) {
-                await this.animateExpand();
-            } else {
-                this.navigationList.style.display = '';
-                this.element.style.width = this.config.width;
-            }
-        }
-
-        this.emit('toggle', { expanded: true });
-        return this;
-    }
-
-    async collapse(options = {}) {
-        if (this.isCollapsed) {
-            return this;
-        }
-
-        this.isCollapsed = true;
-
-        if (this.toggleButton) {
-            this.toggleButton.setAttribute('aria-expanded', 'false');
-            this.toggleButton.setAttribute('aria-label', 'Expand navigation');
-            this.toggleButton.innerHTML = this.getToggleIcon();
-        }
-
-        if (this.navigationList) {
-            if (this.enableAnimations && !options.immediate) {
-                await this.animateCollapse();
-            } else {
-                this.navigationList.style.display = 'none';
-                this.element.style.width = this.config.collapsedWidth;
-            }
-        }
-
-        this.emit('toggle', { expanded: false });
-        return this;
-    }
-
-    async animateExpand() {
-        return new Promise(resolve => {
-            this.navigationList.style.opacity = '0';
-            this.navigationList.style.display = '';
-
-            // Animate width and opacity
-            this.element.style.transition = `width ${this.animationDuration}ms ease-in-out`;
-            this.navigationList.style.transition = `opacity ${this.animationDuration}ms ease-in-out`;
-
-            // Force reflow
-            this.element.offsetWidth;
-
-            this.element.style.width = this.config.width;
-            this.navigationList.style.opacity = '1';
-
-            setTimeout(() => {
-                this.element.style.transition = '';
-                this.navigationList.style.transition = '';
-                resolve();
-            }, this.animationDuration);
-        });
-    }
-
-    async animateCollapse() {
-        return new Promise(resolve => {
-            this.element.style.transition = `width ${this.animationDuration}ms ease-in-out`;
-            this.navigationList.style.transition = `opacity ${this.animationDuration}ms ease-in-out`;
-
-            this.navigationList.style.opacity = '0';
-            this.element.style.width = this.config.collapsedWidth;
-
-            setTimeout(() => {
-                this.navigationList.style.display = 'none';
-                this.element.style.transition = '';
-                this.navigationList.style.transition = '';
-                resolve();
-            }, this.animationDuration);
-        });
-    }
-
-    navigateToHeading(headingId) {
-        const targetElement = document.getElementById(headingId);
-        if (!targetElement) {
-            console.warn(`Heading with ID '${headingId}' not found`);
-            return;
-        }
-
-        // Update active navigation item
-        this.setActiveItem(headingId);
-
-        // Scroll to target
-        if (this.config.smoothScroll) {
-            targetElement.scrollIntoView({
-                behavior: 'smooth',
-                block: 'start',
-                inline: 'nearest'
-            });
-        } else {
-            targetElement.scrollIntoView();
-        }
-
-        // Emit navigation event
-        this.emit('navigate', { target: headingId, element: targetElement });
-
-        // Optionally collapse after navigation on mobile
-        if (this.mediaQuery.matches && this.config.autoHide) {
-            setTimeout(() => this.collapse(), 500);
-        }
-    }
-
-    setActiveItem(headingId) {
-        // Remove previous active state
-        const previousActive = this.findElement('.navigator-link.active');
-        if (previousActive) {
-            previousActive.classList.remove('active');
-            previousActive.style.backgroundColor = '';
-        }
-
-        // Set new active state
-        const newActive = this.findElement(`[data-target="${headingId}"]`);
-        if (newActive) {
-            newActive.classList.add('active');
-            newActive.style.backgroundColor = '#e3f2fd';
-            newActive.style.color = '#1976d2';
-        }
-
-        this.currentSection = headingId;
-    }
-
-    handleScroll() {
-        if (!this.scrollSpyEnabled || !this.isRendered) {
-            return;
-        }
-
-        // Throttle scroll events
-        if (this.scrollThrottle) {
-            return;
-        }
-
-        this.scrollThrottle = setTimeout(() => {
-            this.updateCurrentSection();
-            this.scrollThrottle = null;
-        }, 100);
-    }
-
-    updateCurrentSection() {
-        const scrollPosition = window.pageYOffset + 100; // Offset for header
-        let currentHeading = null;
-
-        // Find the current heading based on scroll position
-        for (let i = this.headings.length - 1; i >= 0; i--) {
-            const heading = this.headings[i];
-            if (heading.element.offsetTop <= scrollPosition) {
-                currentHeading = heading;
-                break;
-            }
-        }
-
-        if (currentHeading && currentHeading.id !== this.currentSection) {
-            this.setActiveItem(currentHeading.id);
-        }
-    }
-
-    getCurrentSection() {
-        return this.currentSection;
-    }
-
-    handleResize() {
-        if (!this.config.autoHide) {
-            return;
-        }
-
-        if (this.mediaQuery.matches) {
-            // Mobile: hide navigator
-            if (this.element) {
-                this.element.style.display = 'none';
-            }
-        } else {
-            // Desktop: show navigator
-            if (this.element) {
-                this.element.style.display = '';
-            }
-        }
-    }
-
-    handleKeyboard(event) {
-        switch (event.key) {
-            case 'Enter':
-            case ' ':
-                event.preventDefault();
-                this.toggle();
-                break;
-            case 'Escape':
-                event.preventDefault();
-                this.collapse();
-                break;
-        }
-    }
-
-    getNavigatorStyle() {
-        const baseStyle = {
-            position: 'fixed',
-            top: this.config.offset.top,
-            zIndex: '1000',
-            backgroundColor: 'rgba(255, 255, 255, 0.95)',
-            border: '1px solid #e1e5e9',
-            borderRadius: '8px',
-            boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
-            backdropFilter: 'blur(8px)',
-            width: this.isCollapsed ? this.config.collapsedWidth : this.config.width,
-            maxHeight: '80vh',
-            overflow: 'hidden',
-            transition: 'width 0.3s ease-in-out'
-        };
-
-        // Position-specific styling
-        if (this.config.position === 'left') {
-            baseStyle.left = this.config.offset.side;
-        } else {
-            baseStyle.right = this.config.offset.side;
-        }
-
-        return baseStyle;
-    }
-
-    getToggleStyle() {
-        return {
-            width: '100%',
-            height: this.config.collapsedWidth,
-            border: 'none',
-            backgroundColor: 'transparent',
-            cursor: 'pointer',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            fontSize: '16px',
-            color: '#666',
-            transition: 'color 0.2s ease'
-        };
-    }
-
-    getListStyle() {
-        return {
-            display: this.isCollapsed ? 'none' : '',
-            opacity: this.isCollapsed ? '0' : '1'
-        };
-    }
-
-    getToggleIcon() {
-        if (this.isCollapsed) {
-            return this.config.position === 'left' ? '☰' : '☰';
-        } else {
-            return '✕';
-        }
-    }
-
-    async destroy() {
-        // Remove event listeners
-        window.removeEventListener('scroll', this.boundScrollHandler);
-        window.removeEventListener('resize', this.boundResizeHandler);
-
-        // Clear throttle
-        if (this.scrollThrottle) {
-            clearTimeout(this.scrollThrottle);
-        }
-
-        await super.destroy();
-    }
-}

markitect/templates/document.html

@@ -6,6 +6,8 @@
     <meta name="generator" content="Markitect {version}">
     <title>{title}</title>
 
+    {css_content}
+
     <!-- Base styling for document content -->
     <style>
         body {

tests/test_clean_architecture.py

@@ -1,247 +0,0 @@
-"""
-Test suite for the new clean architecture implementation
-Tests the JSON configuration interface and separation of concerns
-"""
-import pytest
-import tempfile
-import json
-from pathlib import Path
-from markitect.clean_document_manager import CleanDocumentManager
-
-
-class TestCleanArchitecture:
-    """Test suite for clean JavaScript-Python separation"""
-
-    def setup_method(self):
-        """Setup for each test"""
-        self.manager = CleanDocumentManager()
-
-    def test_clean_edit_mode_json_configuration(self):
-        """Test that edit mode uses clean JSON configuration interface"""
-        test_markdown = '''# Test Document
-
-## Section with Problematic Content
-```python
-script = f"""
-function test() {
-    console.log("Hello {name}");
-}
-"""
-```
-
-This content has quotes that previously broke JavaScript generation.
-'''
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=True
-                )
-
-                assert result['success'] is True
-
-                # Read generated HTML
-                html_content = Path(html_file.name).read_text()
-
-                # Test 1: Check for clean template usage
-                assert 'markitect-config' in html_content
-                assert 'type="application/json"' in html_content
-
-                # Test 2: Extract and validate JSON configuration
-                config_json = self.extract_config_json(html_content)
-                assert config_json is not None, "Configuration JSON not found"
-
-                config = json.loads(config_json)
-
-                # Test 3: Validate configuration structure
-                required_fields = ['markdownContent', 'mode', 'theme', 'originalFilename']
-                for field in required_fields:
-                    assert field in config, f"Required field '{field}' missing from configuration"
-
-                # Test 4: Check that problematic content is properly escaped
-                assert 'script = f"""' in config['markdownContent']  # Should be in JSON
-                assert '"""' not in html_content.split('markitect-config')[1].split('</script>')[0], "Unescaped quotes in HTML"
-
-    def test_clean_architecture_no_python_js_mixing(self):
-        """Test that no Python code generates JavaScript strings"""
-        test_markdown = "# Simple Test\n\nBasic content."
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=True
-                )
-
-                assert result['success'] is True
-                html_content = Path(html_file.name).read_text()
-
-                # Test 1: No direct JavaScript variable assignments from Python
-                problematic_patterns = [
-                    'const markdownContent = "',  # Old way
-                    'const markdownContentWithDogtag = "',  # Old way
-                    'var markdownContent = "',
-                    'let markdownContent = "'
-                ]
-
-                for pattern in problematic_patterns:
-                    assert pattern not in html_content, f"Found problematic pattern: {pattern}"
-
-                # Test 2: Configuration should be in JSON script tag only
-                config_sections = html_content.count('markitect-config')
-                assert config_sections >= 2, f"Expected at least 2 config references (opening and closing), found {config_sections}"
-
-                # Test 3: JavaScript files should be embedded inline (no external src attributes)
-                js_components = [
-                    'config-loader',
-                    'section-manager',
-                    'dom-renderer'
-                ]
-
-                for component in js_components:
-                    # Check that the component JavaScript is embedded, not referenced externally
-                    assert f'src="js/' not in html_content, "Found external JavaScript references - should be embedded"
-
-                # Check that components are embedded inline
-                assert '{js_config_loader}' not in html_content, "Template placeholder not replaced"
-                assert 'class MarkitectConfig' in html_content, "Config loader not embedded"
-                assert 'class SectionManager' in html_content, "Section manager not embedded"
-
-    def test_configuration_interface_completeness(self):
-        """Test that all required data is passed through the configuration interface"""
-        test_markdown = "# Config Test\n\nTesting configuration completeness."
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=True,
-                    editor_theme='dark',
-                    keyboard_shortcuts=False
-                )
-
-                assert result['success'] is True
-                html_content = Path(html_file.name).read_text()
-
-                config_json = self.extract_config_json(html_content)
-                config = json.loads(config_json)
-
-                # Test configuration completeness
-                expected_config = {
-                    'markdownContent': test_markdown,
-                    'mode': 'edit',
-                    'theme': 'dark',
-                    'keyboardShortcuts': False,
-                    'autosave': False,
-                    'sections': True,
-                    'base64References': {}
-                }
-
-                for key, expected_value in expected_config.items():
-                    assert key in config, f"Configuration missing key: {key}"
-                    if key == 'markdownContent':
-                        assert config[key] == expected_value, f"Configuration {key} value mismatch"
-
-    def test_insert_mode_configuration(self):
-        """Test insert mode specific configuration"""
-        test_markdown = "# Insert Mode Test"
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    insert_mode=True
-                )
-
-                assert result['success'] is True
-                html_content = Path(html_file.name).read_text()
-
-                # Check body class
-                assert 'class="markitect-insert-mode"' in html_content
-
-                # Check configuration
-                config_json = self.extract_config_json(html_content)
-                config = json.loads(config_json)
-
-                assert config['mode'] == 'insert'
-                assert 'restrictedHeadingLevels' in config
-                assert config['restrictedHeadingLevels'] == [1, 2, 3]
-
-    def test_static_vs_edit_mode_separation(self):
-        """Test that static mode and edit mode use different templates"""
-        test_markdown = "# Mode Test\n\nTesting template separation."
-
-        # Test static mode
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as static_file:
-                static_result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=static_file.name,
-                    edit_mode=False
-                )
-
-                static_content = Path(static_file.name).read_text()
-
-                # Static mode should NOT have configuration interface
-                assert 'markitect-config' not in static_content
-                assert 'application/json' not in static_content
-
-            # Test edit mode
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as edit_file:
-                edit_result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=edit_file.name,
-                    edit_mode=True
-                )
-
-                edit_content = Path(edit_file.name).read_text()
-
-                # Edit mode should HAVE configuration interface
-                assert 'markitect-config' in edit_content
-                assert 'application/json' in edit_content
-
-    # Helper methods
-
-    def extract_config_json(self, html_content):
-        """Extract JSON configuration from HTML"""
-        try:
-            # Find the config script tag
-            start_marker = 'id="markitect-config" type="application/json">'
-            end_marker = '</script>'
-
-            start_pos = html_content.find(start_marker)
-            if start_pos == -1:
-                return None
-
-            start_pos += len(start_marker)
-            end_pos = html_content.find(end_marker, start_pos)
-
-            if end_pos == -1:
-                return None
-
-            config_json = html_content[start_pos:end_pos].strip()
-            return config_json
-
-        except Exception as e:
-            print(f"Failed to extract config JSON: {e}")
-            return None

tests/test_issue_132_basic_rendering.py

@@ -1,246 +0,0 @@
-"""
-Tests for Issue #132: Basic HTML Generation and Rendering
-
-This module tests the core functionality of the md-render command for
-client-side markdown rendering with JavaScript.
-"""
-
-import pytest
-import tempfile
-import os
-from pathlib import Path
-from unittest.mock import patch, MagicMock
-import json
-import re
-
-# Add project root to path for imports
-import sys
-project_root = Path(__file__).parent.parent.parent.parent
-sys.path.insert(0, str(project_root))
-
-from markitect.plugins.builtin.markdown_commands import MarkdownCommandsPlugin
-
-
-class TestIssue132BasicRendering:
-    """Test basic HTML generation and markdown rendering functionality."""
-
-    def setup_method(self):
-        """Set up test environment."""
-        self.plugin = MarkdownCommandsPlugin()
-        self.plugin.initialize()
-
-        # Create temporary directory for test outputs
-        self.temp_dir = tempfile.mkdtemp()
-
-    def teardown_method(self):
-        """Clean up test environment."""
-        # Clean up temporary files
-        import shutil
-        shutil.rmtree(self.temp_dir, ignore_errors=True)
-
-    def test_md_render_command_exists(self):
-        """Test that md-render command is registered in plugin - Issue #132."""
-        commands = self.plugin.get_commands()
-
-        # Should include md-render command
-        assert 'md-render' in commands
-
-        # Command should be callable
-        md_render_cmd = commands['md-render']
-        assert callable(md_render_cmd)
-
-    def test_generate_basic_html_from_simple_markdown(self):
-        """Test generating HTML from simple markdown content - Issue #132."""
-        # Create test markdown content
-        markdown_content = """# Test Document
-
-This is a **test** document with some *italic* text and a [link](https://example.com).
-
-## Section 2
-
-- List item 1
-- List item 2
-- List item 3
-"""
-
-        # Create temporary input file
-        input_file = Path(self.temp_dir) / "test.md"
-        input_file.write_text(markdown_content)
-
-        output_file = Path(self.temp_dir) / "output.html"
-
-        # Test actual command execution
-        from markitect.plugins.builtin.markdown_commands import md_render_command
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(md_render_command, [str(input_file), '--output', str(output_file), '--nodogtag'])
-
-        # Should execute successfully
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        # Should generate HTML file with content
-        html_content = output_file.read_text()
-        assert '<!DOCTYPE html>' in html_content
-        assert '<title>Test Document</title>' in html_content
-
-    def test_html_contains_embedded_markdown_payload(self):
-        """Test that generated HTML contains markdown as JavaScript payload - Issue #132."""
-        markdown_content = "# Simple Test\n\nThis is test content."
-
-        input_file = Path(self.temp_dir) / "simple.md"
-        input_file.write_text(markdown_content)
-
-        output_file = Path(self.temp_dir) / "simple.html"
-
-        # Test actual rendering
-        from markitect.plugins.builtin.markdown_commands import md_render_command
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(md_render_command, [str(input_file), '--output', str(output_file), '--nodogtag'])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Should contain JavaScript with embedded markdown
-        assert 'const markdownContent =' in html_content
-        assert json.dumps(markdown_content) in html_content
-
-        # Should contain script tag for rendering
-        assert '<script' in html_content
-        assert 'marked' in html_content.lower()
-
-    def test_html_includes_javascript_markdown_parser(self):
-        """Test that generated HTML includes JavaScript markdown parser - Issue #132."""
-        markdown_content = "# Parser Test\n\nTesting parser inclusion."
-
-        input_file = Path(self.temp_dir) / "parser_test.md"
-        input_file.write_text(markdown_content)
-
-        output_file = Path(self.temp_dir) / "parser_test.html"
-
-        # Test actual rendering
-        from markitect.plugins.builtin.markdown_commands import md_render_command
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(md_render_command, [str(input_file), '--output', str(output_file), '--nodogtag'])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Should include markdown parser (marked.js or similar)
-        assert any(parser in html_content.lower() for parser in ['marked', 'markdown-it', 'showdown'])
-
-        # Should include rendering logic
-        assert 'DOMContentLoaded' in html_content or 'window.onload' in html_content
-
-    def test_generated_html_is_valid_structure(self):
-        """Test that generated HTML has valid document structure - Issue #132."""
-        markdown_content = "# Structure Test\n\nTesting HTML structure."
-
-        input_file = Path(self.temp_dir) / "structure.md"
-        input_file.write_text(markdown_content)
-
-        output_file = Path(self.temp_dir) / "structure.html"
-
-        # Test actual rendering
-        from markitect.plugins.builtin.markdown_commands import md_render_command
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(md_render_command, [str(input_file), '--output', str(output_file), '--nodogtag'])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Valid HTML5 document structure
-        assert html_content.startswith('<!DOCTYPE html>')
-        assert '<html' in html_content
-        assert '<head>' in html_content
-        assert '<body>' in html_content
-        assert '</html>' in html_content
-
-        # Should have content div for rendering
-        assert 'id="markdown-content"' in html_content
-
-    def test_handles_empty_markdown_file(self):
-        """Test behavior with empty markdown file - Issue #132."""
-        # Create empty markdown file
-        input_file = Path(self.temp_dir) / "empty.md"
-        input_file.write_text("")
-
-        output_file = Path(self.temp_dir) / "empty.html"
-
-        # Test actual rendering
-        from markitect.plugins.builtin.markdown_commands import md_render_command
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(md_render_command, [str(input_file), '--output', str(output_file), '--nodogtag'])
-
-        # Should handle empty file gracefully
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-        # Should still generate valid HTML structure
-        assert '<!DOCTYPE html>' in html_content
-        assert 'const markdownContent = "";' in html_content
-
-    def test_handles_markdown_with_code_blocks(self):
-        """Test handling markdown with code blocks - Issue #132."""
-        markdown_content = """# Code Test
-
-Here's some Python code:
-
-```python
-def hello_world():
-    print("Hello, World!")
-    return True
-```
-
-And some inline `code` too.
-"""
-
-        input_file = Path(self.temp_dir) / "code_test.md"
-        input_file.write_text(markdown_content)
-
-        output_file = Path(self.temp_dir) / "code_test.html"
-
-        # Test actual rendering with code blocks
-        from markitect.plugins.builtin.markdown_commands import md_render_command
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(md_render_command, [str(input_file), '--output', str(output_file), '--nodogtag'])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Should properly escape code content in JavaScript
-        assert 'def hello_world' in html_content
-        # Should handle backticks and quotes properly
-        assert json.dumps(markdown_content) in html_content
-
-    def test_cli_command_interface_exists(self):
-        """Test that md-render CLI command interface exists - Issue #132."""
-        from markitect.cli import cli
-
-        # Should have md-render command registered
-        assert 'md-render' in cli.commands
-
-        cmd = cli.commands['md-render']
-        assert cmd.name == 'md-render'
-        assert cmd.help is not None
-        assert 'markdown' in cmd.help.lower()

tests/test_issue_132_template_system.py

@@ -1,402 +0,0 @@
-"""
-Tests for Issue #132: Template System and CSS Injection
-
-This module tests template selection and custom CSS injection functionality
-for client-side markdown rendering.
-"""
-
-import pytest
-import tempfile
-import os
-from pathlib import Path
-from unittest.mock import patch, MagicMock
-import json
-
-# Add project root to path for imports
-import sys
-project_root = Path(__file__).parent.parent.parent.parent
-sys.path.insert(0, str(project_root))
-
-
-class TestIssue132TemplateSystem:
-    """Test template selection and CSS injection functionality."""
-
-    def setup_method(self):
-        """Set up test environment."""
-        # Create temporary directory for test outputs
-        self.temp_dir = tempfile.mkdtemp()
-        self.markdown_content = """# Template Test
-
-This is a test document for template system validation.
-
-## Features
-- Multiple templates
-- Custom CSS support
-- Responsive design
-"""
-
-    def teardown_method(self):
-        """Clean up test environment."""
-        # Clean up temporary files
-        import shutil
-        shutil.rmtree(self.temp_dir, ignore_errors=True)
-
-    def test_default_template_generates_basic_html(self):
-        """Test that default template generates basic HTML structure - Issue #132."""
-        input_file = Path(self.temp_dir) / "default.md"
-        input_file.write_text(self.markdown_content)
-
-        output_file = Path(self.temp_dir) / "default.html"
-
-        # Template system IS implemented - test actual functionality
-        from markitect.cli import cli
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file)
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Should contain basic HTML5 structure
-        assert '<!DOCTYPE html>' in html_content
-        assert '<meta charset="utf-8">' in html_content
-        assert '<title>' in html_content
-
-    def test_github_template_option(self):
-        """Test GitHub-style template selection - Issue #132."""
-        input_file = Path(self.temp_dir) / "github.md"
-        input_file.write_text(self.markdown_content)
-
-        output_file = Path(self.temp_dir) / "github.html"
-
-        # Template system IS implemented - test GitHub template
-        from markitect.cli import cli
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--theme', 'github'
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-        assert 'border-bottom: 1px solid #d0d7de' in html_content  # GitHub heading style
-
-    def test_template_loading_from_filesystem(self):
-        """Test template system uses embedded templates - Issue #132."""
-        # Templates are embedded in code, not loaded from filesystem
-        # Test that template system provides all expected templates
-        from markitect.plugins.builtin.markdown_commands import TEMPLATE_STYLES
-
-        # Should have all expected templates available
-        expected_templates = ['basic', 'github', 'academic', 'dark']
-
-        for template_name in expected_templates:
-            assert template_name in TEMPLATE_STYLES
-            template_config = TEMPLATE_STYLES[template_name]
-
-            # Each template should have required style properties
-            assert 'body_color' in template_config
-            assert 'font_family' in template_config
-            assert 'max_width' in template_config
-
-        # Test that templates are properly formatted with variable placeholders
-        from markitect.plugins.builtin.markdown_commands import generate_html_with_embedded_markdown
-        test_html = generate_html_with_embedded_markdown("# Test", "Test Title", "basic", "", {})
-        # HTML template should be properly formatted
-        assert '<!DOCTYPE html>' in test_html
-        assert 'Test Title' in test_html
-        assert '# Test' in test_html
-
-    def test_template_variable_substitution(self):
-        """Test template variable substitution system - Issue #132."""
-        input_file = Path(self.temp_dir) / "variables.md"
-        input_file.write_text("# Variable Test\n\nTesting substitution.")
-
-        output_file = Path(self.temp_dir) / "variables.html"
-
-        # Template engine IS implemented - test actual functionality
-        from markitect.cli import cli
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file)
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Variables should be substituted with actual values
-        assert '{{ markdown_json }}' not in html_content  # Should be replaced
-        assert '{{ title }}' not in html_content  # Should be replaced
-        assert '{{ css_content }}' not in html_content  # Should be replaced
-
-        # Should contain actual markdown content as JSON
-        assert '# Variable Test' in html_content
-
-    def test_custom_css_injection(self):
-        """Test custom CSS injection into templates - Issue #132."""
-        custom_css = """
-        body {
-            font-family: 'Comic Sans MS', cursive;
-            background-color: #f0f0f0;
-        }
-        .markdown-content {
-            max-width: 800px;
-            margin: 0 auto;
-        }
-        """
-
-        # Create CSS file
-        css_file = Path(self.temp_dir) / "custom.css"
-        css_file.write_text(custom_css)
-
-        input_file = Path(self.temp_dir) / "styled.md"
-        input_file.write_text(self.markdown_content)
-
-        output_file = Path(self.temp_dir) / "styled.html"
-
-        # CSS injection IS implemented - test actual functionality
-        from markitect.cli import cli
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--css', str(css_file)
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-        # Custom CSS should be injected
-        assert 'Comic Sans MS' in html_content
-        assert 'background-color: #f0f0f0' in html_content
-
-    def test_css_content_embedded_in_html(self):
-        """Test that CSS content is properly embedded in HTML - Issue #132."""
-        custom_css = "body { color: red; }"
-        css_file = Path(self.temp_dir) / "red.css"
-        css_file.write_text(custom_css)
-
-        input_file = Path(self.temp_dir) / "red_test.md"
-        input_file.write_text("# Red Test\n\nShould be red text.")
-
-        output_file = Path(self.temp_dir) / "red_test.html"
-
-        # CSS embedding IS implemented - test actual functionality
-        from markitect.cli import cli
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--css', str(css_file)
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # CSS should be embedded in <style> tags
-        assert '<style>' in html_content
-        assert 'body { color: red; }' in html_content
-        assert '</style>' in html_content
-
-    def test_template_with_markdown_parser_integration(self):
-        """Test template integration with JavaScript markdown parser - Issue #132."""
-        input_file = Path(self.temp_dir) / "integration.md"
-        input_file.write_text("# Integration Test\n\nTesting parser integration.")
-
-        output_file = Path(self.temp_dir) / "integration.html"
-
-        # Integration IS implemented - test actual functionality
-        from markitect.cli import cli
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file)
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Should contain markdown parser script
-        assert 'marked.min.js' in html_content
-        assert 'marked.parse' in html_content
-        assert 'Integration Test' in html_content
-
-        # Should contain rendering JavaScript
-        assert 'DOMContentLoaded' in html_content
-        assert 'getElementById' in html_content
-        assert 'innerHTML' in html_content
-
-    def test_multiple_templates_available(self):
-        """Test that multiple template options are available - Issue #132."""
-        # Test template availability
-        theme_options = ['basic', 'github', 'academic', 'dark']
-
-        from markitect.plugins.builtin.markdown_commands import md_render_command
-        from click.testing import CliRunner
-
-        # Create test markdown file
-        input_file = Path(self.temp_dir) / "template_test.md"
-        input_file.write_text("# Template Test\n\nTesting multiple templates.")
-
-        runner = CliRunner()
-
-        for theme in theme_options:
-            output_file = Path(self.temp_dir) / f"{theme}_output.html"
-
-            result = runner.invoke(md_render_command, [
-                str(input_file),
-                '--output', str(output_file),
-                '--theme', theme
-            ])
-
-            # Should be able to specify different templates
-            assert result.exit_code == 0
-            assert output_file.exists()
-
-            # Verify template-specific styling
-            html_content = output_file.read_text()
-            assert '<title>Template Test</title>' in html_content
-
-    def test_dark_theme_template_specific_styling(self):
-        """Test that dark theme has appropriate dark styling - Issue #132."""
-        input_file = Path(self.temp_dir) / "dark_test.md"
-        input_file.write_text("# Dark Theme Test\n\n> Blockquote test\n\n```code block```")
-
-        output_file = Path(self.temp_dir) / "dark_test.html"
-
-        from markitect.plugins.builtin.markdown_commands import md_render_command
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(md_render_command, [
-            str(input_file),
-            '--output', str(output_file),
-            '--theme', 'dark'
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Verify dark theme specific colors
-        assert 'background-color: #0d1117' in html_content  # Dark background
-        assert 'color: #e6edf3' in html_content  # Light text (updated in modular theme)
-        assert 'color: #58a6ff' in html_content  # Blue headings
-        assert 'background-color: #161b22' in html_content  # Dark code blocks
-        assert 'border-left: 4px solid #30363d' in html_content  # Gray blockquote border (updated)
-
-    def test_invalid_template_handling(self):
-        """Test error handling for invalid template names - Issue #132."""
-        input_file = Path(self.temp_dir) / "invalid.md"
-        input_file.write_text("# Invalid Template Test")
-
-        # Error handling IS implemented - test invalid template
-        from markitect.cli import cli
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--theme', 'nonexistent_template'
-        ])
-
-        # Should exit with error code for invalid template choice
-        assert result.exit_code != 0
-        assert ('invalid choice' in result.output.lower() or
-                'not one of' in result.output.lower() or
-                'unknown theme' in result.output.lower())
-
-    def test_template_title_extraction_from_markdown(self):
-        """Test title extraction from markdown for template variables - Issue #132."""
-        markdown_with_title = """# Main Title
-
-This document should use "Main Title" as the HTML title.
-"""
-
-        input_file = Path(self.temp_dir) / "title_test.md"
-        input_file.write_text(markdown_with_title)
-
-        output_file = Path(self.temp_dir) / "title_test.html"
-
-        # Title extraction IS implemented - test actual functionality
-        from markitect.cli import cli
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file)
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # HTML title should be extracted from first heading
-        assert '<title>Main Title</title>' in html_content
-
-    def test_responsive_template_css(self):
-        """Test that default templates include responsive CSS - Issue #132."""
-        input_file = Path(self.temp_dir) / "responsive.md"
-        input_file.write_text("# Responsive Test\n\nTesting responsive design.")
-
-        output_file = Path(self.temp_dir) / "responsive.html"
-
-        # Responsive CSS IS implemented - test actual functionality
-        from markitect.cli import cli
-        from click.testing import CliRunner
-
-        runner = CliRunner()
-        result = runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file)
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Should include viewport meta tag
-        assert '<meta name="viewport"' in html_content
-
-        # Should include responsive CSS patterns
-        assert 'max-width' in html_content

tests/test_issue_133_cli_integration.py

@@ -1,435 +0,0 @@
-"""
-Tests for Issue #133: CLI Integration with Instant Markdown Editing Support
-
-This module tests the CLI command enhancement that adds editing capabilities
-to the existing md-render command through the --edit flag.
-"""
-
-import pytest
-import tempfile
-import os
-from pathlib import Path
-from unittest.mock import patch, MagicMock
-from click.testing import CliRunner
-
-# Add project root to path for imports
-import sys
-project_root = Path(__file__).parent.parent.parent.parent
-sys.path.insert(0, str(project_root))
-
-
-class TestIssue133CLIIntegration:
-    """Test CLI integration for instant markdown editing support."""
-
-    def setup_method(self):
-        """Set up test environment."""
-        self.runner = CliRunner()
-        self.temp_dir = tempfile.mkdtemp()
-
-        # Sample markdown content for testing
-        self.test_markdown = """# Editing Test Document
-
-This is a test document for instant markdown editing functionality.
-
-## Features
-- Click-to-edit sections
-- Live preview comparison
-- Change tracking
-- File saving
-
-### Code Example
-```bash
-markitect md-render input.md --edit
-```
-
-Content paragraph that should be editable.
-"""
-
-    def teardown_method(self):
-        """Clean up test environment."""
-        import shutil
-        shutil.rmtree(self.temp_dir, ignore_errors=True)
-
-    def test_edit_flag_adds_editing_capabilities(self):
-        """Test that --edit flag enables editing mode - Issue #133."""
-        input_file = Path(self.temp_dir) / "edit_test.md"
-        input_file.write_text(self.test_markdown)
-
-        output_file = Path(self.temp_dir) / "edit_output.html"
-
-        # Edit flag functionality IS implemented
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--edit'
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Should include editor library and edit mode flag
-        assert 'SectionManager' in html_content
-        assert 'MARKITECT_EDIT_MODE' in html_content
-        assert 'DOMRenderer' in html_content
-
-    def test_edit_flag_with_all_templates(self):
-        """Test --edit flag works with all template types - Issue #133."""
-        input_file = Path(self.temp_dir) / "template_edit_test.md"
-        input_file.write_text(self.test_markdown)
-
-        templates = ['basic', 'github', 'academic', 'dark']
-
-        # Template editing IS implemented
-        from markitect.cli import cli
-
-        for template in templates:
-            output_file = Path(self.temp_dir) / f"edit_{template}.html"
-
-            result = self.runner.invoke(cli, [
-                'md-render',
-                str(input_file),
-                '--output', str(output_file),
-                '--theme', template,
-                '--edit'
-            ])
-
-            assert result.exit_code == 0
-            assert output_file.exists()
-
-            html_content = output_file.read_text()
-            # Should work with template styles
-            assert 'SectionManager' in html_content
-            assert 'DOMRenderer' in html_content
-
-    def test_editor_library_loading_configuration(self):
-        """Test editor library loading and configuration options - Issue #133."""
-        input_file = Path(self.temp_dir) / "config_test.md"
-        input_file.write_text(self.test_markdown)
-
-        output_file = Path(self.temp_dir) / "config_output.html"
-
-        # Editor configuration IS implemented
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--edit',
-            '--editor-theme', 'dark'
-        ])
-
-        assert result.exit_code == 0
-        html_content = output_file.read_text()
-
-        # Should include editor configuration with theme: 'dark'
-        assert 'theme: \'dark\'' in html_content
-        assert 'MARKITECT_EDITOR_CONFIG' in html_content
-
-    def test_backward_compatibility_without_edit_flag(self):
-        """Test that existing functionality remains unchanged without --edit - Issue #133."""
-        input_file = Path(self.temp_dir) / "compatibility_test.md"
-        input_file.write_text(self.test_markdown)
-
-        output_file = Path(self.temp_dir) / "compatibility_output.html"
-
-        # Existing functionality should continue to work
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--theme', 'github',
-            '--nodogtag'
-        ])
-
-        assert result.exit_code == 0
-        assert output_file.exists()
-
-        html_content = output_file.read_text()
-
-        # Should NOT include editor library without --edit flag
-        assert 'markitect-editor' not in html_content
-        assert 'const MARKITECT_EDIT_MODE = true' not in html_content
-
-        # Should include existing functionality
-        assert 'marked.min.js' in html_content
-        assert 'Editing Test Document' in html_content
-
-    def test_help_text_includes_edit_options(self):
-        """Test that help text includes new editing options - Issue #133."""
-        # Help text IS updated with edit options
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, ['md-render', '--help'])
-
-        assert result.exit_code == 0
-        assert '--edit' in result.output
-        assert 'editing' in result.output.lower()
-        assert 'instant' in result.output.lower() or 'edit' in result.output.lower()
-
-    def test_edit_flag_with_custom_css(self):
-        """Test --edit flag works with custom CSS injection - Issue #133."""
-        # Create custom CSS file
-        css_content = """
-        .editor-section {
-            border: 2px dashed #007acc;
-        }
-        .edit-mode textarea {
-            font-family: 'Courier New', monospace;
-        }
-        """
-        css_file = Path(self.temp_dir) / "editor.css"
-        css_file.write_text(css_content)
-
-        input_file = Path(self.temp_dir) / "css_edit_test.md"
-        input_file.write_text(self.test_markdown)
-
-        output_file = Path(self.temp_dir) / "css_edit_output.html"
-
-        # CSS + editing integration IS implemented
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--css', str(css_file),
-            '--edit'
-        ])
-
-        assert result.exit_code == 0
-        html_content = output_file.read_text()
-
-        # Should include both custom CSS and editor
-        assert 'Courier New' in html_content
-        assert 'SectionManager' in html_content
-        assert 'DOMRenderer' in html_content
-
-    def test_large_document_editing_performance(self):
-        """Test editing flag with large markdown documents - Issue #133."""
-        # Create large markdown document
-        large_content = self.test_markdown * 50  # Repeat content 50 times
-
-        input_file = Path(self.temp_dir) / "large_edit_test.md"
-        input_file.write_text(large_content)
-
-        output_file = Path(self.temp_dir) / "large_edit_output.html"
-
-        # Large document handling IS implemented
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--edit'
-        ])
-
-        assert result.exit_code == 0
-        html_content = output_file.read_text()
-
-        # Should handle large documents gracefully
-        assert len(html_content) > 20000  # Should be substantial (adjusted from 50k)
-        assert 'SectionManager' in html_content
-        assert 'MARKITECT_EDIT_MODE' in html_content
-
-    def test_front_matter_preservation_with_editing(self):
-        """Test YAML front matter preserved in editing mode - Issue #133."""
-        markdown_with_frontmatter = """---
-title: "Editable Document"
-author: "Test Author"
-date: "2025-10-07"
-tags: [editing, test, markdown]
----
-
-# Editable Content
-
-This content should be editable while preserving front matter.
-"""
-
-        input_file = Path(self.temp_dir) / "frontmatter_edit_test.md"
-        input_file.write_text(markdown_with_frontmatter)
-
-        output_file = Path(self.temp_dir) / "frontmatter_edit_output.html"
-
-        # Front matter + editing IS implemented
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--edit'
-        ])
-
-        assert result.exit_code == 0
-        html_content = output_file.read_text()
-
-        # Should preserve front matter in JavaScript payload and include editing
-        assert 'Test Author' in html_content or 'Editable Document' in html_content
-        assert 'SectionManager' in html_content
-        assert 'MARKITECT_EDIT_MODE' in html_content
-
-    def test_error_handling_invalid_edit_options(self):
-        """Test error handling for invalid editing options - Issue #133."""
-        input_file = Path(self.temp_dir) / "error_test.md"
-        input_file.write_text(self.test_markdown)
-
-        # Error handling IS implemented
-        from markitect.cli import cli
-
-        # Test invalid editor theme
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--edit',
-            '--editor-theme', 'invalid_theme'
-        ])
-
-        assert result.exit_code != 0
-        assert 'invalid' in result.output.lower() or 'not one of' in result.output.lower()
-
-    def test_editor_script_cdn_fallback(self):
-        """Test graceful handling when editor CDN fails - Issue #133."""
-        input_file = Path(self.temp_dir) / "fallback_test.md"
-        input_file.write_text(self.test_markdown)
-
-        output_file = Path(self.temp_dir) / "fallback_output.html"
-
-        # Editor functionality IS implemented with bundled JavaScript
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--edit'
-        ])
-
-        assert result.exit_code == 0
-        html_content = output_file.read_text()
-
-        # Should include bundled editor (not relying on CDN)
-        assert 'SectionManager' in html_content
-        assert 'MARKITECT_EDIT_MODE' in html_content
-        # The implementation uses bundled JavaScript, not CDN, so no fallback needed
-
-    def test_mobile_responsive_editing_meta_tags(self):
-        """Test that editing mode includes proper mobile meta tags - Issue #133."""
-        input_file = Path(self.temp_dir) / "mobile_test.md"
-        input_file.write_text(self.test_markdown)
-
-        output_file = Path(self.temp_dir) / "mobile_output.html"
-
-        # Mobile responsiveness IS implemented
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--edit'
-        ])
-
-        assert result.exit_code == 0
-        html_content = output_file.read_text()
-
-        # Should include mobile-friendly meta tags
-        assert 'viewport' in html_content
-        assert 'width=device-width' in html_content
-        assert 'SectionManager' in html_content
-
-    def test_keyboard_shortcuts_configuration(self):
-        """Test keyboard shortcuts can be configured for editing - Issue #133."""
-        input_file = Path(self.temp_dir) / "shortcuts_test.md"
-        input_file.write_text(self.test_markdown)
-
-        output_file = Path(self.temp_dir) / "shortcuts_output.html"
-
-        # Keyboard shortcuts ARE implemented
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--edit',
-            '--keyboard-shortcuts'
-        ])
-
-        assert result.exit_code == 0
-        html_content = output_file.read_text()
-
-        # Should include keyboard shortcut configuration
-        assert 'MARKITECT_EDITOR_CONFIG' in html_content
-        assert 'keyboardShortcuts' in html_content
-        # TODO: Keyboard shortcut handlers not yet implemented in current architecture
-        # assert 'keydown' in html_content  # When keyboard shortcuts are implemented
-
-    def test_edit_mode_with_existing_command_patterns(self):
-        """Test that editing follows existing CLI command patterns - Issue #133."""
-        # Command pattern consistency IS implemented
-        from markitect.cli import cli
-
-        # Should follow same patterns as other md-* commands
-        md_commands = [name for name in cli.commands.keys() if name.startswith('md-')]
-
-        assert 'md-render' in md_commands
-
-        # md-render command should have consistent help format
-        cmd = cli.commands['md-render']
-        assert cmd.help is not None
-        assert 'edit' in cmd.help.lower() or any('--edit' in str(param) for param in cmd.params)
-
-    def test_section_detection_configuration(self):
-        """Test section detection can be configured for different markdown structures - Issue #133."""
-        complex_markdown = """# Main Title
-
-## Section 1
-Content for section 1.
-
-### Subsection 1.1
-- List item 1
-- List item 2
-
-```python
-def example_function():
-    return "editable code"
-```
-
-## Section 2
-| Column 1 | Column 2 |
-|----------|----------|
-| Data 1   | Data 2   |
-
-> This is a blockquote that should be editable.
-"""
-
-        input_file = Path(self.temp_dir) / "complex_test.md"
-        input_file.write_text(complex_markdown)
-
-        output_file = Path(self.temp_dir) / "complex_output.html"
-
-        # Complex section detection IS implemented
-        from markitect.cli import cli
-
-        result = self.runner.invoke(cli, [
-            'md-render',
-            str(input_file),
-            '--output', str(output_file),
-            '--edit'
-        ])
-
-        assert result.exit_code == 0
-        html_content = output_file.read_text()
-
-        # Should detect and mark various section types
-        assert 'data-section' in html_content or 'markitect-section-editable' in html_content
-        assert 'SectionManager' in html_content

tests/test_issue_144_edit_mode_regression.py

@@ -1,329 +0,0 @@
-"""
-Test suite for md-render --edit functionality to prevent regression.
-
-This test suite specifically targets the critical JavaScript syntax errors
-that were causing edit mode to fail completely, ensuring they never happen again.
-"""
-
-import tempfile
-import pytest
-from pathlib import Path
-import re
-import subprocess
-
-
-class TestEditModeRegression:
-    """Tests to prevent regression of the md-render --edit functionality."""
-
-    def test_edit_mode_generates_valid_javascript(self):
-        """Test that edit mode generates syntactically valid JavaScript."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-
-        # Test markdown content
-        test_content = "# Test Header\n\nThis is a test paragraph.\n\n## Section 2\n\nAnother paragraph."
-
-        # Generate HTML with edit mode
-        html_content = doc_manager._generate_html_template(
-            title="Test Document",
-            markdown_content=test_content,
-            edit_mode=True,
-            editor_theme='github',
-            keyboard_shortcuts=True
-        )
-
-        # Extract JavaScript from HTML
-        js_match = re.search(r'<script>(.*?)</script>', html_content, re.DOTALL)
-        assert js_match, "No JavaScript found in edit mode HTML"
-
-        js_content = js_match.group(1)
-
-        # Write to temp file and validate syntax with Node.js
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.js', delete=False) as f:
-            f.write(js_content)
-            temp_js_path = f.name
-
-        try:
-            # Use Node.js to check JavaScript syntax
-            result = subprocess.run(
-                ['node', '-c', temp_js_path],
-                capture_output=True,
-                text=True
-            )
-
-            assert result.returncode == 0, f"JavaScript syntax error: {result.stderr}"
-
-        finally:
-            Path(temp_js_path).unlink()
-
-    def test_edit_mode_contains_required_functions(self):
-        """Test that edit mode HTML contains all required JavaScript functions."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-
-        html_content = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content="# Test",
-            edit_mode=True
-        )
-
-        # Check for critical functions that must be present
-        required_functions = [
-            'SectionManager',
-            'Section',
-            'DOMRenderer',
-            'DebugPanel',
-            'DocumentControls'
-        ]
-
-        for func_name in required_functions:
-            assert func_name in html_content, f"Required function '{func_name}' not found in edit mode HTML"
-
-    def test_edit_mode_no_broken_string_literals(self):
-        """Test that there are no broken string literals in the generated JavaScript."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-
-        html_content = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content="# Test",
-            edit_mode=True
-        )
-
-        # Extract JavaScript
-        js_match = re.search(r'<script>(.*?)</script>', html_content, re.DOTALL)
-        js_content = js_match.group(1)
-
-        # Check for broken string patterns that caused the original bug
-        broken_patterns = [
-            r"'\s*\n\s*'",  # Broken string literal across lines
-            r'"\s*\n\s*"',  # Broken string literal across lines
-            r'reconstructed \+= .*\'\n',  # Unescaped newline in string
-        ]
-
-        for pattern in broken_patterns:
-            matches = re.findall(pattern, js_content)
-            assert not matches, f"Found broken string pattern: {pattern} - matches: {matches}"
-
-    def test_edit_mode_proper_brace_escaping(self):
-        """Test that braces are properly escaped in f-string templates."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-
-        html_content = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content="# Test",
-            edit_mode=True
-        )
-
-        # Extract JavaScript
-        js_match = re.search(r'<script>(.*?)</script>', html_content, re.DOTALL)
-        js_content = js_match.group(1)
-
-        # Check for inconsistent brace patterns
-        inconsistent_patterns = [
-            r'(?<!})} else if.*{{',  # Single brace followed by double (incorrect)
-            r'}} else if.*}(?!})',  # Double brace followed by single closing (incorrect)
-        ]
-
-        for pattern in inconsistent_patterns:
-            matches = re.findall(pattern, js_content)
-            assert not matches, f"Found inconsistent brace pattern: {pattern}"
-
-    def test_edit_mode_template_literal_syntax(self):
-        """Test that template literals are properly escaped."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-
-        html_content = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content="# Test",
-            edit_mode=True
-        )
-
-        # Extract JavaScript
-        js_match = re.search(r'<script>(.*?)</script>', html_content, re.DOTALL)
-        js_content = js_match.group(1)
-
-        # Check for problematic template literal patterns
-        # Should NOT find double-escaped template literals like ${{
-        problematic_patterns = [
-            r'\$\{\{.*?\}\}',  # Double-escaped template literals
-        ]
-
-        for pattern in problematic_patterns:
-            matches = re.findall(pattern, js_content)
-            assert not matches, f"Found problematic template literal: {pattern}"
-
-    def test_edit_mode_contains_content_div(self):
-        """Test that edit mode HTML contains the markdown-content div."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-
-        html_content = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content="# Test Content",
-            edit_mode=True
-        )
-
-        # Should contain the content container
-        assert 'id="markdown-content"' in html_content
-        assert 'MARKITECT_EDIT_MODE = true' in html_content
-        assert 'markitect-edit-mode' in html_content
-
-    def test_edit_mode_error_handling_elements(self):
-        """Test that edit mode includes proper error handling UI elements."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-
-        html_content = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content="# Test",
-            edit_mode=True
-        )
-
-        # Should contain clean editor elements
-        assert 'MARKITECT_EDIT_MODE' in html_content
-        assert 'class="markitect-edit-mode"' in html_content
-        assert 'initializeCleanEditor' in html_content
-        assert 'console.error' in html_content  # Error handling
-
-    def test_edit_mode_vs_normal_mode_differences(self):
-        """Test that edit mode and normal mode generate different output appropriately."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-        test_content = "# Test Header\n\nTest content."
-
-        # Generate both modes
-        normal_html = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content=test_content,
-            edit_mode=False
-        )
-
-        edit_html = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content=test_content,
-            edit_mode=True
-        )
-
-        # Edit mode should have additional elements
-        assert len(edit_html) > len(normal_html)
-        assert 'MARKITECT_EDIT_MODE = true' in edit_html
-        assert 'MARKITECT_EDIT_MODE = true' not in normal_html
-        assert 'markitect-edit-mode' in edit_html
-        assert 'markitect-edit-mode' not in normal_html
-
-    def test_edit_mode_javascript_execution_flow(self):
-        """Test the logical flow of JavaScript execution in edit mode."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-
-        html_content = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content="# Test",
-            edit_mode=True
-        )
-
-        # Extract JavaScript
-        js_match = re.search(r'<script>(.*?)</script>', html_content, re.DOTALL)
-        js_content = js_match.group(1)
-
-        # Check for proper execution flow elements
-        flow_elements = [
-            'DOMContentLoaded',  # Event listener setup
-            'MARKITECT_EDIT_MODE',  # Mode check
-            'initializeCleanEditor',  # Editor initialization
-            'marked.parse',  # Content rendering
-            'SectionManager'  # Section management class
-        ]
-
-        for element in flow_elements:
-            assert element in js_content, f"Missing execution flow element: {element}"
-
-    def test_newline_escaping_in_javascript_strings(self):
-        """Test that newlines in JavaScript strings are properly escaped."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-
-        html_content = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content="# Test\n\nMultiple\nLines",
-            edit_mode=True
-        )
-
-        # Extract JavaScript
-        js_match = re.search(r'<script>(.*?)</script>', html_content, re.DOTALL)
-        js_content = js_match.group(1)
-
-        # Look for the specific section that was broken
-        # Should find properly escaped newlines like '\\n\\n' in the JavaScript
-        assert '\\n\\n' in js_content, "Newlines not properly escaped in JavaScript strings"
-
-        # Should NOT find unescaped newlines in string contexts
-        # This regex looks for string concatenation with actual newlines
-        broken_newline_pattern = r"'\s*\+\s*text\s*\+\s*'\s*\n"
-        matches = re.findall(broken_newline_pattern, js_content)
-        assert not matches, f"Found unescaped newlines in string concatenation: {matches}"
-
-
-class TestEditModeIntegration:
-    """Integration tests for the complete edit mode functionality."""
-
-    def test_save_functionality_javascript_presence(self):
-        """Test that the save functionality JavaScript is properly included."""
-        from markitect.clean_document_manager import CleanDocumentManager
-
-        # Create a CleanDocumentManager
-        doc_manager = CleanDocumentManager()
-
-        html_content = doc_manager._generate_html_template(
-            title="Test",
-            markdown_content="# Test Content",
-            edit_mode=True
-        )
-
-        # Check for modular architecture components (current implementation)
-        # TODO: Save functionality not yet implemented in modular architecture
-        required_elements = [
-            'SectionManager',  # Core modular component
-            'DOMRenderer',  # Rendering component
-            'DocumentControls',  # Control component
-            'MARKITECT_EDIT_MODE'  # Edit mode flag
-        ]
-
-        for element in required_elements:
-            assert element in html_content, f"Required modular component missing: {element}"
-
-        # Future save functionality elements (when implemented):
-        # save_elements = [
-        #     '💾 Save Document',
-        #     'generateSaveFilename',
-        #     'getDocumentMarkdown',
-        #     'Blob',
-        #     'download'
-        # ]
-
-
-if __name__ == "__main__":
-    pytest.main([__file__, "-v"])

tests/test_issue_145_production_error_handler.py

@@ -20,7 +20,7 @@ from markitect.production.error_handler import (
     ResourceExhaustionError
 )
 try:
-    from .test_utils import test_workspace
+    from .test_utils import workspace_context
 except ImportError:
     # Fallback for missing test utilities
     import tempfile
@@ -29,16 +29,13 @@ except ImportError:
     import shutil
 
     @contextmanager
-    def _test_workspace_fallback(name=None):
+    def workspace_context(name=None):
         temp_dir = Path(tempfile.mkdtemp(prefix=f"{name}_" if name else "test_"))
         try:
             yield temp_dir
         finally:
             shutil.rmtree(temp_dir, ignore_errors=True)
 
-    # Assign to expected name
-    test_workspace = _test_workspace_fallback
-
 
 class TestProductionErrorHandler:
     """Test production error handling and recovery capabilities."""
@@ -46,7 +43,7 @@ class TestProductionErrorHandler:
     @pytest.fixture
     def temp_workspace(self):
         """Create temporary workspace for testing."""
-        with test_workspace("error_handler") as temp_dir:
+        with workspace_context("error_handler") as temp_dir:
             yield temp_dir
 
     @pytest.fixture

tests/test_js_sanity.py

@@ -1,440 +0,0 @@
-"""
-JavaScript Sanity Test Suite
-Tests for basic JavaScript functionality, syntax validation, and initialization
-"""
-import pytest
-import tempfile
-import re
-from pathlib import Path
-from markitect.clean_document_manager import CleanDocumentManager
-
-
-class TestJSSanity:
-    """Test suite for JavaScript sanity checks"""
-
-    def setup_method(self):
-        """Setup for each test"""
-        self.manager = CleanDocumentManager()
-
-    def test_basic_html_generation_no_edit_mode(self):
-        """Test that basic HTML generation works without edit mode"""
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write("# Test Document\n\nThis is a test.")
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=False
-                )
-
-                assert result['success'] is True
-
-                # Read generated HTML
-                html_content = Path(html_file.name).read_text()
-
-                # Basic HTML structure checks
-                assert '<!DOCTYPE html>' in html_content
-                assert '<html' in html_content
-                assert '</html>' in html_content
-                assert '<body' in html_content
-                assert '</body>' in html_content
-                assert 'Test Document' in html_content
-
-    def test_edit_mode_javascript_syntax_validation(self):
-        """Test that edit mode generates syntactically valid JavaScript"""
-        test_markdown = '''# Test Document
-
-## Code Block Test
-```python
-script = f"""
-function test() {
-    console.log("test");
-}
-"""
-```
-
-This contains quotes that could break JavaScript.
-'''
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=True
-                )
-
-                assert result['success'] is True
-
-                # Read generated HTML
-                html_content = Path(html_file.name).read_text()
-
-                # Extract JavaScript content
-                js_content = self.extract_javascript_from_html(html_content)
-
-                # Test 1: Basic syntax validation
-                syntax_errors = self.check_javascript_syntax(js_content)
-                assert len(syntax_errors) == 0, f"JavaScript syntax errors found: {syntax_errors}"
-
-                # Test 2: Check for unescaped quotes
-                quote_errors = self.check_for_quote_escaping_issues(js_content)
-                assert len(quote_errors) == 0, f"Quote escaping issues found: {quote_errors}"
-
-                # Test 3: Check for required constants
-                self.check_required_constants(js_content)
-
-    def test_edit_mode_component_loading(self):
-        """Test that all required JavaScript components are loaded"""
-        test_markdown = "# Simple Test\n\nBasic content for component loading test."
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=True
-                )
-
-                assert result['success'] is True
-                html_content = Path(html_file.name).read_text()
-
-                # Check for required components
-                required_components = [
-                    'js/core/debug-system.js',
-                    'js/core/section-manager.js',
-                    'js/components/dom-renderer.js',
-                    'js/controls/control-base.js',
-                    'js/main.js'
-                ]
-
-                for component in required_components:
-                    assert f"// === {component} ===" in html_content, f"Component {component} not loaded"
-
-    def test_edit_mode_class_definitions(self):
-        """Test that required JavaScript classes are defined"""
-        test_markdown = "# Class Definition Test\n\nTesting class loading."
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=True
-                )
-
-                assert result['success'] is True
-                html_content = Path(html_file.name).read_text()
-
-                # Check for required class definitions
-                required_classes = [
-                    'class Section',
-                    'class SectionManager',
-                    'class DOMRenderer',
-                    'class MarkitectDebugSystem',
-                    'const Control =',
-                    'class StatusControl',
-                    'class DebugControl',
-                    'class EditControl'
-                ]
-
-                for class_def in required_classes:
-                    assert class_def in html_content, f"Class definition '{class_def}' not found"
-
-    def test_edit_mode_initialization_functions(self):
-        """Test that required initialization functions are defined"""
-        test_markdown = "# Initialization Test\n\nTesting function definitions."
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=True
-                )
-
-                assert result['success'] is True
-                html_content = Path(html_file.name).read_text()
-
-                # Check for required function definitions
-                required_functions = [
-                    'function initializeCleanEditor',
-                    'function initializeScrollIndicators',
-                    'function debug'
-                ]
-
-                for func_def in required_functions:
-                    assert func_def in html_content, f"Function definition '{func_def}' not found"
-
-    def test_edit_mode_global_exports(self):
-        """Test that required globals are exported to window"""
-        test_markdown = "# Global Exports Test\n\nTesting window exports."
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=True
-                )
-
-                assert result['success'] is True
-                html_content = Path(html_file.name).read_text()
-
-                # Check for required window exports
-                required_exports = [
-                    'window.MarkitectDebugSystem = new MarkitectDebugSystem',
-                    'window.SectionManager = SectionManager',
-                    'window.Control = Control',
-                    'window.StatusControl = StatusControl'
-                ]
-
-                for export in required_exports:
-                    assert export in html_content, f"Window export '{export}' not found"
-
-    # Helper methods
-
-    def extract_javascript_from_html(self, html_content):
-        """Extract JavaScript content from HTML"""
-        # Find all script tags and extract their content
-        script_pattern = r'<script[^>]*>(.*?)</script>'
-        scripts = re.findall(script_pattern, html_content, re.DOTALL)
-        return '\n'.join(scripts)
-
-    def check_javascript_syntax(self, js_content):
-        """Basic JavaScript syntax validation"""
-        errors = []
-
-        # Check for common syntax errors
-
-        # 1. Unmatched quotes
-        single_quotes = js_content.count("'") - js_content.count("\\'")
-        double_quotes = js_content.count('"') - js_content.count('\\"')
-
-        if single_quotes % 2 != 0:
-            errors.append("Unmatched single quotes detected")
-        if double_quotes % 2 != 0:
-            errors.append("Unmatched double quotes detected")
-
-        # 2. Unmatched braces
-        open_braces = js_content.count('{')
-        close_braces = js_content.count('}')
-        if open_braces != close_braces:
-            errors.append(f"Unmatched braces: {open_braces} open, {close_braces} close")
-
-        # 3. Unmatched parentheses
-        open_parens = js_content.count('(')
-        close_parens = js_content.count(')')
-        if open_parens != close_parens:
-            errors.append(f"Unmatched parentheses: {open_parens} open, {close_parens} close")
-
-        # 4. Check for unterminated string literals
-        # Look for patterns that suggest unterminated strings
-        unterminated_patterns = [
-            r'[^\\]"[^"]*$',  # Double quote not followed by closing quote at line end
-            r'[^\\]\'[^\']*$'  # Single quote not followed by closing quote at line end
-        ]
-
-        for pattern in unterminated_patterns:
-            matches = re.findall(pattern, js_content, re.MULTILINE)
-            if matches:
-                errors.append(f"Potential unterminated string literals: {len(matches)} found")
-
-        return errors
-
-    def check_for_quote_escaping_issues(self, js_content):
-        """Check for common quote escaping problems"""
-        errors = []
-
-        # Look for problematic patterns
-
-        # 1. Triple quotes in JSON strings (common Python -> JS issue)
-        if '"""' in js_content and 'const markdownContent' in js_content:
-            errors.append("Triple quotes found in markdownContent - likely escaping issue")
-
-        # 2. Unescaped newlines in strings
-        problem_patterns = [
-            r'"[^"]*\n[^"]*"',  # Newline in double-quoted string
-            r"'[^']*\n[^']*'"   # Newline in single-quoted string
-        ]
-
-        for pattern in problem_patterns:
-            matches = re.findall(pattern, js_content)
-            if matches:
-                errors.append(f"Unescaped newlines in strings: {len(matches)} found")
-
-        return errors
-
-    def check_required_constants(self, js_content):
-        """Check that required constants are defined"""
-        required_constants = [
-            'const markdownContent =',
-            'const MARKITECT_EDIT_MODE =',
-            'const MARKITECT_EDITOR_CONFIG =',
-            'const EditState =',
-            'const SectionType ='
-        ]
-
-        for constant in required_constants:
-            assert constant in js_content, f"Required constant '{constant}' not found"
-
-    def check_for_infinite_retry_loop(self, js_content):
-        """Check for patterns that indicate infinite retry loops"""
-        errors = []
-
-        # Pattern 1: Retry logic that can loop infinitely
-        if "setTimeout(() => this.initialize(), 50)" in js_content:
-            # Check if there's a proper termination condition
-            if "maxWait" not in js_content and "startTime" not in js_content:
-                errors.append("Found retry setTimeout without timeout protection")
-
-        # Pattern 2: Configuration loading that retries indefinitely
-        retry_patterns = [
-            r"setTimeout\([^)]*initialize[^)]*\)",  # setTimeout calling initialize
-            r"if\s*\(\s*!.*\.loaded\s*\)\s*{[^}]*setTimeout"  # if not loaded, setTimeout
-        ]
-
-        import re
-        for pattern in retry_patterns:
-            matches = re.findall(pattern, js_content)
-            if matches:
-                # Check if there are proper safeguards
-                if "maxWait" not in js_content or "timeout" not in js_content.lower():
-                    errors.append(f"Found retry pattern without timeout protection: {pattern}")
-
-        # Pattern 3: Check for MarkitectMain.initialize calling itself recursively
-        if js_content.count("MarkitectMain.initialize") > 2:  # Once for definition, once for call
-            if "this.initialized" not in js_content:
-                errors.append("MarkitectMain.initialize may call itself recursively without proper guard")
-
-        return errors
-
-    def check_configuration_loading_logic(self, js_content):
-        """Check for proper configuration loading setup"""
-        errors = []
-
-        # Check 1: Configuration should be loaded via JSON element
-        if 'markitect-config' not in js_content:
-            errors.append("No markitect-config element found - configuration loading will fail")
-
-        # Check 2: Configuration loader should wait for DOM
-        if 'DOMContentLoaded' not in js_content and 'document.readyState' not in js_content:
-            errors.append("Configuration loading doesn't wait for DOM ready")
-
-        # Check 3: Should have proper error handling for missing config element
-        if "getElementById('markitect-config')" in js_content:
-            if "throw new Error" not in js_content and "console.error" not in js_content:
-                errors.append("No error handling for missing configuration element")
-
-        # Check 4: Check for proper retry logic with timeout
-        if "setTimeout" in js_content and "initialize" in js_content:
-            if "maxWait" not in js_content and "startTime" not in js_content:
-                errors.append("Retry logic present but no timeout mechanism found")
-
-        return errors
-
-    def test_comprehensive_edit_mode_validation(self):
-        """Comprehensive test that validates the complete edit mode functionality"""
-        # Use the actual GUARDRAILS.md that was causing issues
-        test_markdown = '''# Development Guardrails
-
-## JavaScript Code Principles
-
-### 1. No Inline JavaScript in Python
-**NEVER write JavaScript code directly from Python code**
-
-❌ **Wrong:**
-```python
-script = f"""
-function myFunction() {{
-    console.log("Hello {name}");
-}}
-"""
-```
-
-✅ **Correct:**
-```python
-# Load from external files only
-components = [
-    'js/core/section-manager.js',
-    'js/components/debug-panel.js'
-]
-```
-
-This is the content that was breaking the JavaScript generation.
-'''
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                # This should not raise an exception
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=True
-                )
-
-                assert result['success'] is True
-
-                # Read and validate the generated HTML
-                html_content = Path(html_file.name).read_text()
-                js_content = self.extract_javascript_from_html(html_content)
-
-                # Comprehensive validation
-                syntax_errors = self.check_javascript_syntax(js_content)
-                quote_errors = self.check_for_quote_escaping_issues(js_content)
-
-                # If these fail, we have the exact same problem as reported
-                assert len(syntax_errors) == 0, f"SYNTAX ERRORS: {syntax_errors}"
-                assert len(quote_errors) == 0, f"QUOTE ESCAPING ERRORS: {quote_errors}"
-
-                # Verify all required components loaded
-                self.check_required_constants(js_content)
-
-                # CRITICAL: Test for infinite retry loop
-                retry_errors = self.check_for_infinite_retry_loop(js_content)
-                assert len(retry_errors) == 0, f"INFINITE RETRY LOOP DETECTED: {retry_errors}"
-
-    def test_configuration_loading_not_stuck_in_loop(self):
-        """Test specifically for infinite configuration loading retry loops"""
-        test_markdown = "# Simple Test\n\nBasic content for testing configuration loading."
-
-        with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as md_file:
-            md_file.write(test_markdown)
-            md_file.flush()
-
-            with tempfile.NamedTemporaryFile(mode='w', suffix='.html', delete=False) as html_file:
-                result = self.manager.render_file(
-                    input_file=md_file.name,
-                    output_file=html_file.name,
-                    edit_mode=True
-                )
-
-                assert result['success'] is True
-                html_content = Path(html_file.name).read_text()
-
-                # Test for infinite retry patterns
-                retry_issues = self.check_for_infinite_retry_loop(html_content)
-                assert len(retry_issues) == 0, f"INFINITE RETRY LOOP ISSUES: {retry_issues}"
-
-                # Test for proper configuration loading setup
-                config_issues = self.check_configuration_loading_logic(html_content)
-                assert len(config_issues) == 0, f"CONFIGURATION LOADING ISSUES: {config_issues}"

tests/test_l6_integration_gitea_api.py

@@ -1,512 +0,0 @@
-"""
-Comprehensive tests for the Gitea facade/integration layer.
-
-This test suite covers all Gitea API operations through the facade pattern,
-ensuring the gitea.client module provides reliable, well-tested functionality
-for the rest of the application.
-
-NOTE: This test suite needs to be updated for the new capability-based architecture
-where Gitea functionality has been moved to capabilities/release-management.
-Skipping for now until the test can be restructured or moved to the appropriate capability.
-"""
-
-import pytest
-from unittest.mock import Mock, MagicMock, patch
-from datetime import datetime
-
-# Skip all tests in this file until gitea tests are moved to release-management capability
-pytestmark = pytest.mark.skip(reason="Gitea functionality moved to release-management capability - tests need restructuring")
-
-
-class TestGiteaConfig:
-    """Test GiteaConfig functionality."""
-
-    def test_config_creation(self):
-        """Test basic config creation."""
-        config = GiteaConfig(
-            gitea_url="https://gitea.example.com",
-            repo_owner="test_owner",
-            repo_name="test_repo",
-            auth_token="test_token"
-        )
-
-        assert config.gitea_url == "https://gitea.example.com"
-        assert config.repo_owner == "test_owner"
-        assert config.repo_name == "test_repo"
-        assert config.auth_token == "test_token"
-
-    def test_api_url_properties(self):
-        """Test API URL property generation."""
-        config = GiteaConfig(
-            gitea_url="https://gitea.example.com",
-            repo_owner="test_owner",
-            repo_name="test_repo"
-        )
-
-        assert config.base_api_url == "https://gitea.example.com/api/v1"
-        assert config.repo_api_url == "https://gitea.example.com/api/v1/repos/test_owner/test_repo"
-        assert config.issues_api_url == "https://gitea.example.com/api/v1/repos/test_owner/test_repo/issues"
-
-    @patch('gitea.config.subprocess.run')
-    def test_from_git_repository(self, mock_run):
-        """Test config creation from git repository."""
-        mock_run.return_value = Mock(
-            stdout="https://gitea.example.com/owner/repo.git",
-            returncode=0
-        )
-
-        config = GiteaConfig.from_git_repository()
-
-        assert config.gitea_url == "https://gitea.example.com"
-        assert config.repo_owner == "owner"
-        assert config.repo_name == "repo"
-
-    def test_config_validation(self):
-        """Test config validation."""
-        # Valid config should not raise
-        config = GiteaConfig(
-            gitea_url="https://gitea.example.com",
-            repo_owner="owner",
-            repo_name="repo"
-        )
-        config.validate()  # Should not raise
-
-        # Invalid URL should raise
-        invalid_config = GiteaConfig(
-            gitea_url="invalid-url",
-            repo_owner="owner",
-            repo_name="repo"
-        )
-        with pytest.raises(Exception):
-            invalid_config.validate()
-
-
-class TestIssuesClient:
-    """Test IssuesClient functionality."""
-
-    def setup_method(self):
-        """Set up test fixtures."""
-        self.mock_api = Mock()
-        self.client = IssuesClient(self.mock_api)
-
-        # Mock issue for responses
-        self.mock_issue = Mock(spec=Issue)
-        self.mock_issue.number = 1
-        self.mock_issue.title = "Test Issue"
-        self.mock_issue.body = "Test body"
-        self.mock_issue.state = "open"
-        self.mock_issue.html_url = "https://gitea.example.com/owner/repo/issues/1"
-        self.mock_issue.created_at = datetime(2023, 1, 1, 12, 0, 0)
-        self.mock_issue.updated_at = datetime(2023, 1, 1, 12, 0, 0)
-        self.mock_issue.assignee = None
-        self.mock_issue.labels = []
-        self.mock_issue.milestone = None
-
-    def test_get_issue(self):
-        """Test getting a single issue."""
-        self.mock_api.get_issue.return_value = self.mock_issue
-
-        result = self.client.get(1)
-
-        assert result == self.mock_issue
-        self.mock_api.get_issue.assert_called_once_with(1)
-
-    def test_list_issues(self):
-        """Test listing issues."""
-        self.mock_api.list_issues.return_value = [self.mock_issue]
-
-        result = self.client.list()
-
-        assert result == [self.mock_issue]
-        self.mock_api.list_issues.assert_called_once_with("all", 1, 50)
-
-    def test_list_issues_with_filters(self):
-        """Test listing issues with filters."""
-        self.mock_api.list_issues.return_value = [self.mock_issue]
-
-        result = self.client.list(state="open", page=2, per_page=25)
-
-        assert result == [self.mock_issue]
-        self.mock_api.list_issues.assert_called_once_with("open", 2, 25)
-
-    def test_create_issue(self):
-        """Test creating an issue."""
-        self.mock_api.create_issue.return_value = self.mock_issue
-
-        result = self.client.create("Test Title", "Test Body")
-
-        assert result == self.mock_issue
-        self.mock_api.create_issue.assert_called_once()
-
-    def test_create_issue_with_options(self):
-        """Test creating an issue with optional fields."""
-        self.mock_api.create_issue.return_value = self.mock_issue
-
-        result = self.client.create(
-            "Test Title",
-            "Test Body",
-            assignees=["user1"],
-            milestone=1,
-            labels=["bug", "priority:high"]
-        )
-
-        assert result == self.mock_issue
-        self.mock_api.create_issue.assert_called_once()
-
-    def test_update_issue(self):
-        """Test updating an issue."""
-        self.mock_api.update_issue.return_value = self.mock_issue
-
-        result = self.client.update(1, title="New Title")
-
-        assert result == self.mock_issue
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_close_issue(self):
-        """Test closing an issue."""
-        closed_issue = Mock(spec=Issue)
-        closed_issue.state = "closed"
-        self.mock_api.update_issue.return_value = closed_issue
-
-        result = self.client.close(1)
-
-        assert result.state == "closed"
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_reopen_issue(self):
-        """Test reopening an issue."""
-        opened_issue = Mock(spec=Issue)
-        opened_issue.state = "open"
-        self.mock_api.update_issue.return_value = opened_issue
-
-        result = self.client.reopen(1)
-
-        assert result.state == "open"
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_add_labels(self):
-        """Test adding labels to an issue."""
-        # Mock getting current issue
-        self.mock_issue.labels = [Mock(name="existing")]
-        self.mock_api.get_issue.return_value = self.mock_issue
-
-        # Mock update result
-        updated_issue = Mock(spec=Issue)
-        updated_issue.labels = [Mock(name="existing"), Mock(name="new")]
-        self.mock_api.update_issue.return_value = updated_issue
-
-        result = self.client.add_labels(1, ["new"])
-
-        assert len(result.labels) == 2
-        self.mock_api.get_issue.assert_called_once_with(1)
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_remove_labels(self):
-        """Test removing labels from an issue."""
-        # Mock getting current issue
-        label1 = Mock(name="keep")
-        label2 = Mock(name="remove")
-        self.mock_issue.labels = [label1, label2]
-        self.mock_api.get_issue.return_value = self.mock_issue
-
-        # Mock update result
-        updated_issue = Mock(spec=Issue)
-        updated_issue.labels = [label1]
-        self.mock_api.update_issue.return_value = updated_issue
-
-        result = self.client.remove_labels(1, ["remove"])
-
-        assert len(result.labels) == 1
-        self.mock_api.get_issue.assert_called_once_with(1)
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_assign_to_milestone(self):
-        """Test assigning issue to milestone."""
-        self.mock_api.update_issue.return_value = self.mock_issue
-
-        result = self.client.assign_to_milestone(1, 5)
-
-        assert result == self.mock_issue
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_remove_from_milestone(self):
-        """Test removing issue from milestone."""
-        self.mock_api.update_issue.return_value = self.mock_issue
-
-        result = self.client.remove_from_milestone(1)
-
-        assert result == self.mock_issue
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_set_labels(self):
-        """Test replacing all labels on an issue."""
-        self.mock_api.update_issue.return_value = self.mock_issue
-
-        result = self.client.set_labels(1, ["bug", "priority:high"])
-
-        assert result == self.mock_issue
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_update_title(self):
-        """Test updating only issue title."""
-        self.mock_api.update_issue.return_value = self.mock_issue
-
-        result = self.client.update_title(1, "New Title")
-
-        assert result == self.mock_issue
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_update_body(self):
-        """Test updating only issue body."""
-        self.mock_api.update_issue.return_value = self.mock_issue
-
-        result = self.client.update_body(1, "New Body")
-
-        assert result == self.mock_issue
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_set_priority(self):
-        """Test setting issue priority."""
-        # Mock getting current issue
-        self.mock_issue.labels = [Mock(name="bug")]
-        self.mock_api.get_issue.return_value = self.mock_issue
-        self.mock_api.update_issue.return_value = self.mock_issue
-
-        result = self.client.set_priority(1, Priority.HIGH)
-
-        assert result == self.mock_issue
-        self.mock_api.get_issue.assert_called_once_with(1)
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_set_status(self):
-        """Test setting issue status."""
-        # Mock getting current issue
-        self.mock_issue.labels = [Mock(name="bug")]
-        self.mock_api.get_issue.return_value = self.mock_issue
-        self.mock_api.update_issue.return_value = self.mock_issue
-
-        result = self.client.set_status(1, ProjectState.ACTIVE)
-
-        assert result == self.mock_issue
-        self.mock_api.get_issue.assert_called_once_with(1)
-        self.mock_api.update_issue.assert_called_once()
-
-    def test_to_dict(self):
-        """Test converting issue to dictionary."""
-        result = self.client.to_dict(self.mock_issue)
-
-        expected_keys = ['number', 'title', 'body', 'state', 'html_url',
-                        'created_at', 'updated_at', 'assignee', 'labels', 'milestone']
-
-        assert all(key in result for key in expected_keys)
-        assert result['number'] == 1
-        assert result['title'] == "Test Issue"
-        assert result['state'] == "open"
-
-
-class TestMilestonesClient:
-    """Test MilestonesClient functionality."""
-
-    def setup_method(self):
-        """Set up test fixtures."""
-        self.mock_api = Mock()
-        self.client = MilestonesClient(self.mock_api)
-
-        self.mock_milestone = Mock(spec=Milestone)
-        self.mock_milestone.id = 1
-        self.mock_milestone.title = "Test Milestone"
-
-    def test_list_milestones(self):
-        """Test listing milestones."""
-        self.mock_api.list_milestones.return_value = [self.mock_milestone]
-
-        result = self.client.list()
-
-        assert result == [self.mock_milestone]
-        self.mock_api.list_milestones.assert_called_once_with("all")
-
-    def test_list_open_milestones(self):
-        """Test listing open milestones."""
-        self.mock_api.list_milestones.return_value = [self.mock_milestone]
-
-        result = self.client.list_open()
-
-        assert result == [self.mock_milestone]
-        self.mock_api.list_milestones.assert_called_once_with("open")
-
-    def test_create_milestone(self):
-        """Test creating a milestone."""
-        self.mock_api.create_milestone.return_value = self.mock_milestone
-
-        result = self.client.create("Test Milestone", "Description")
-
-        assert result == self.mock_milestone
-        self.mock_api.create_milestone.assert_called_once()
-
-
-class TestLabelsClient:
-    """Test LabelsClient functionality."""
-
-    def setup_method(self):
-        """Set up test fixtures."""
-        self.mock_api = Mock()
-        self.client = LabelsClient(self.mock_api)
-
-        self.mock_label = Mock(spec=Label)
-        self.mock_label.id = 1
-        self.mock_label.name = "bug"
-
-    def test_list_labels(self):
-        """Test listing labels."""
-        self.mock_api.list_labels.return_value = [self.mock_label]
-
-        result = self.client.list()
-
-        assert result == [self.mock_label]
-        self.mock_api.list_labels.assert_called_once()
-
-    def test_create_label(self):
-        """Test creating a label."""
-        self.mock_api.create_label.return_value = self.mock_label
-
-        result = self.client.create("bug", "red", "Bug reports")
-
-        assert result == self.mock_label
-        self.mock_api.create_label.assert_called_once()
-
-
-class TestGiteaClient:
-    """Test the main GiteaClient facade."""
-
-    @patch('gitea.client.GiteaApiClient')
-    def test_client_initialization(self, mock_api_client):
-        """Test GiteaClient initialization."""
-        config = GiteaConfig(
-            gitea_url="https://gitea.example.com",
-            repo_owner="test_owner",
-            repo_name="test_repo"
-        )
-
-        client = GiteaClient(config)
-
-        assert isinstance(client.issues, IssuesClient)
-        assert isinstance(client.milestones, MilestonesClient)
-        assert isinstance(client.labels, LabelsClient)
-        mock_api_client.assert_called_once_with(config)
-
-    @patch('gitea.client.GiteaConfig.from_git_repository')
-    @patch('gitea.client.GiteaApiClient')
-    def test_client_auto_config(self, mock_api_client, mock_from_git):
-        """Test GiteaClient with auto-detected config."""
-        mock_config = Mock()
-        mock_from_git.return_value = mock_config
-
-        client = GiteaClient()
-
-        mock_from_git.assert_called_once()
-        mock_api_client.assert_called_once_with(mock_config)
-
-
-class TestErrorHandling:
-    """Test error handling throughout the facade."""
-
-    def setup_method(self):
-        """Set up test fixtures."""
-        self.mock_api = Mock()
-        self.client = IssuesClient(self.mock_api)
-
-    def test_gitea_error_propagation(self):
-        """Test that GiteaError is properly propagated."""
-        self.mock_api.get_issue.side_effect = GiteaError("API Error")
-
-        with pytest.raises(GiteaError):
-            self.client.get(1)
-
-    def test_not_found_error_propagation(self):
-        """Test that GiteaNotFoundError is properly propagated."""
-        self.mock_api.get_issue.side_effect = GiteaNotFoundError("Issue not found")
-
-        with pytest.raises(GiteaNotFoundError):
-            self.client.get(999)
-
-    def test_auth_error_propagation(self):
-        """Test that GiteaAuthError is properly propagated."""
-        self.mock_api.create_issue.side_effect = GiteaAuthError("Unauthorized")
-
-        with pytest.raises(GiteaAuthError):
-            self.client.create("Title", "Body")
-
-
-class TestIntegrationPatterns:
-    """Test integration patterns and best practices."""
-
-    @patch('gitea.client.GiteaApiClient')
-    def test_consistent_interface(self, mock_api_client):
-        """Test that the facade provides consistent interfaces."""
-        config = GiteaConfig(gitea_url="https://gitea.example.com",
-                           repo_owner="owner", repo_name="repo")
-        client = GiteaClient(config)
-
-        # All sub-clients should be available
-        assert hasattr(client, 'issues')
-        assert hasattr(client, 'milestones')
-        assert hasattr(client, 'labels')
-
-        # All should have consistent method patterns
-        assert hasattr(client.issues, 'list')
-        assert hasattr(client.issues, 'get')
-        assert hasattr(client.issues, 'create')
-        assert hasattr(client.issues, 'update')
-
-        assert hasattr(client.milestones, 'list')
-        assert hasattr(client.milestones, 'create')
-
-        assert hasattr(client.labels, 'list')
-        assert hasattr(client.labels, 'create')
-
-    def test_backward_compatibility_dict_conversion(self):
-        """Test that to_dict provides backward compatibility."""
-        mock_api = Mock()
-        client = IssuesClient(mock_api)
-
-        # Create a mock issue with all expected attributes
-        mock_issue = Mock(spec=Issue)
-        mock_issue.number = 1
-        mock_issue.title = "Test"
-        mock_issue.body = "Body"
-        mock_issue.state = "open"
-        mock_issue.html_url = "https://example.com"
-        mock_issue.created_at = datetime(2023, 1, 1)
-        mock_issue.updated_at = datetime(2023, 1, 1)
-        mock_issue.assignee = None
-        mock_issue.labels = []
-        mock_issue.milestone = None
-
-        result = client.to_dict(mock_issue)
-
-        # Should contain all expected fields for backward compatibility
-        required_fields = ['number', 'title', 'body', 'state', 'html_url',
-                          'created_at', 'updated_at', 'assignee', 'labels', 'milestone']
-
-        for field in required_fields:
-            assert field in result, f"Missing required field: {field}"
-
-    def test_label_operations_consistency(self):
-        """Test that label operations work consistently."""
-        mock_api = Mock()
-        client = IssuesClient(mock_api)
-
-        # Mock issue with labels
-        mock_issue = Mock()
-        mock_issue.labels = [Mock(name="bug"), Mock(name="priority:high")]
-        mock_api.get_issue.return_value = mock_issue
-        mock_api.update_issue.return_value = mock_issue
-
-        # Test all label operations
-        client.add_labels(1, ["new-label"])
-        client.remove_labels(1, ["old-label"])
-        client.set_labels(1, ["label1", "label2"])
-
-        # Should have made appropriate API calls
-        assert mock_api.get_issue.call_count == 2  # add_labels and remove_labels
-        assert mock_api.update_issue.call_count == 3  # all three operations

tests/test_utils.py

@@ -38,7 +38,7 @@ def create_test_workspace(prefix: str = "test") -> Path:
 
 
 @contextmanager
-def test_workspace(prefix: str = "test"):
+def workspace_context(prefix: str = "test"):
     """Context manager for test workspace that auto-cleans up.
 
     Args: