Universe Canvas - COMPLETE RESTORATION PLAN

Status: 🚧 CRITICAL RECOVERY NEEDED
Date: November 21, 2025 - 8:30 PM EST
Session ID: 11.25.2.2

🎯 Core Problem

The Canvas V2 replaced a feature-rich, mode-based grid system with a minimal implementation. We need to restore ALL the original capabilities while improving the architecture.

✅ What the Original Had (Must Restore)

1. Mode-Based Editing System ⚠️ MISSING

• select - Click to select sections
• add - Add sections before/after
• resize - Visual resize controls (flex ratio)
• reorder - Drag to reorder
• grid-edit - Add/remove rows/columns
• export - Export UI

2. Visual Grid Tools ⚠️ MISSING

• Add/Remove Row buttons
• Add/Remove Column buttons
• Grid Blueprint overlay (shows grid structure)
• Click cells to merge/split

3. Flex Ratio System ⚠️ MISSING

• Visual flex handles overlay
• Preset buttons (1:1, 1:2, 2:1, etc.)
• Live ratio display

4. Smart Layout Management ⚠️ PARTIAL

• Config panel pushes canvas (not overlay)
• Responsive height for sidebar states
• Canvas adapts to available space

5. Content Nesting ✅ IMPLEMENTED

• Modules inside containers
• Widgets inside containers
• Containers inside containers (infinite nesting)

🔧 Implementation Plan

Phase 1: Restore Mode System (PRIORITY 1)

1. Add canvasMode to CanvasStateService (select | add | resize | reorder | grid-edit | export)
2. Create contextual toolbars for each mode
3. Update CanvasSectionComponent to respect mode
4. Add mode-specific visual overlays

Phase 2: Restore Grid Tools (PRIORITY 2)

1. Implement Add/Remove Row/Column
2. Create Grid Blueprint overlay component
3. Add cell merge/split functionality
4. Visual grid track resizing

Phase 3: Restore Flex Tools (PRIORITY 3)

1. Implement Flex Blueprint overlay
2. Add preset ratio buttons
3. Visual flex resizing handles
4. Live ratio updates

Phase 4: Fix Layout Integration (PRIORITY 4)

1. Make config panel PUSH canvas (not overlay)
2. Implement responsive height
3. Sync toolbar state with canvas
4. Add rearrange/reorder visual feedback

🚀 Immediate Actions

I will now:

1. Restore the Mode System from the original canvas
2. Fix the sidebar layout to push canvas
3. Implement Grid Controls (Add/Remove rows/cols)
4. Add Visual Overlays for grid and flex editing

This will transform it from "minimal" to "comprehensive".

Recovery Starting Now...