Phase 3 implementation:
- Created layout-presets.ts with 3 built-in presets (side-by-side, main-sidebar, grid)
- Implemented fillLayoutTemplate() for recursive template filling with window IDs
- Added collectWindowIds() for depth-first traversal of layout trees
- Created applyPresetToLayout() to reorganize existing windows
- Created layout-parser.ts for /layout command argument parsing
- Added layout command to man.ts with documentation and examples
- Built LayoutViewer component with:
* Visual preset gallery with diagrams
* Window count validation
* Apply preset functionality
* Error handling for insufficient windows
* Command-line preset specification support
- Wired LayoutViewer into WindowRenderer with lazy loading
- Added "layout" to AppId type definition
- Exposed applyPresetLayout in useGrimoire hook
Presets allow users to quickly reorganize multiple windows into
common layouts: 50/50 splits, 70/30 main+sidebar, or 2×2 grids.
Generated with [Claude Code](https://claude.com/claude-code)
Add per-workspace layout configuration UI with visual controls:
**Core Changes:**
- Add updateWorkspaceLayoutConfig() function to logic.ts for updating workspace layout settings
- Expose updateWorkspaceLayoutConfig in useGrimoire hook
**UI Components:**
- Create WorkspaceSettings dialog with three sections:
* Insertion Mode selector (Balanced/Horizontal/Vertical) with icons
* Split Percentage slider (10-90%) with real-time preview
* Insertion Position toggle (Left-Top/Right-Bottom)
- Add settings icon (SlidersHorizontal) to workspace tabs that appears on hover
- Settings button opens configuration dialog for that workspace
**UX Details:**
- Settings icon only visible on hover to reduce visual clutter
- Clear visual feedback for selected options with primary color highlights
- Preview section shows current configuration in plain language
- Reset to Defaults button restores smart mode defaults
- Prevents workspace switch when clicking settings icon
**Icons Used:**
- Sparkles: Balanced (smart auto-balancing)
- SplitSquareHorizontal: Horizontal splits
- SplitSquareVertical: Vertical splits
- SlidersHorizontal: Settings access
Each workspace can now have independent layout behavior configured through an intuitive UI.
Add per-workspace layout configuration with smart auto-balancing:
**Core Changes:**
- Add LayoutConfig interface to Workspace type with insertionMode, splitPercentage, insertionPosition
- Create layout-utils.ts with smart direction algorithm that auto-balances horizontal/vertical splits
- Update addWindow() to use workspace layoutConfig instead of hardcoded values
- Migrate state from v7→v8, adding layoutConfig to all workspaces with smart defaults
**Smart Direction Algorithm:**
- Analyzes layout tree to count horizontal vs vertical splits
- Automatically balances by favoring the less-common direction
- Defaults to horizontal (row) for first split
- Provides foundation for "Balanced (auto)" insertion mode
**Testing:**
- Add 30 comprehensive tests for layout-utils.ts (tree analysis, smart direction, window insertion)
- Add 30 tests for logic.ts addWindow() with different layout configs (row/column/smart modes)
- Update migration tests to verify v6→v7→v8 and v7→v8 paths
**Migration:**
- v7→v8 adds layoutConfig with defaults: smart mode, 50% split, second position
- All existing workspaces automatically get smart auto-balancing behavior
Implements orthogonal design: layout behavior = workspace settings (not command flags)
- Display option flags on separate lines with indented descriptions to prevent overflow
- Parse and separate example commands from their descriptions
- Highlight commands in accent color with muted descriptions below
- Increase spacing between items for better readability
