config now finally works

.envrc

@@ -0,0 +1 @@
+use flake

.gitignore

@@ -3,3 +3,4 @@
 /tantivy_indexes
 server/tantivy_indexes
 steel_decimal/tests/property_tests.proptest-regressions
+.direnv/

Cargo.lock

@@ -470,6 +470,20 @@ version = "1.10.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "d71b6127be86fdcfddb610f7182ac57211d4b18a3e9c82eb2d17662f2227ad6a"
 
+[[package]]
+name = "canvas"
+version = "0.4.1"
+dependencies = [
+ "anyhow",
+ "common",
+ "crossterm",
+ "ratatui",
+ "serde",
+ "tokio",
+ "tokio-test",
+ "toml",
+]
+
 [[package]]
 name = "cassowary"
 version = "0.3.0"
@@ -541,10 +555,11 @@ dependencies = [
 
 [[package]]
 name = "client"
-version = "0.3.13"
+version = "0.4.1"
 dependencies = [
  "anyhow",
  "async-trait",
+ "canvas",
  "common",
  "crossterm",
  "dirs",
@@ -591,7 +606,7 @@ dependencies = [
 
 [[package]]
 name = "common"
-version = "0.3.13"
+version = "0.4.1"
 dependencies = [
  "prost",
  "prost-types",
@@ -2877,7 +2892,7 @@ checksum = "1c107b6f4780854c8b126e228ea8869f4d7b71260f962fefb57b996b8959ba6b"
 
 [[package]]
 name = "search"
-version = "0.3.13"
+version = "0.4.1"
 dependencies = [
  "anyhow",
  "common",
@@ -2976,7 +2991,7 @@ dependencies = [
 
 [[package]]
 name = "server"
-version = "0.3.13"
+version = "0.4.1"
 dependencies = [
  "anyhow",
  "bcrypt",

Cargo.toml

@@ -1,11 +1,11 @@
 [workspace]
-members = ["client", "server", "common", "search"]
+members = ["client", "server", "common", "search", "canvas"]
 resolver = "2"
 
 [workspace.package]
 # TODO: idk how to do the name, fix later
 # name = "komp_ac"
-version = "0.3.13"
+version = "0.4.1"
 edition = "2021"
 license = "GPL-3.0-or-later"
 authors = ["Filip Priečinský <filippriec@gmail.com>"]
@@ -46,4 +46,9 @@ rust_decimal_macros = "1.37.1"
 thiserror = "2.0.12"
 regex = "1.11.1"
 
+# Canvas crate
+ratatui = { version = "0.29.0", features = ["crossterm"] }
+crossterm = "0.28.1"
+toml = "0.8.20"
+
 common = { path = "./common" }

canvas/CANVAS_MIGRATION.md

@@ -0,0 +1,160 @@
+# Canvas Crate Migration Documentation
+
+## Files Moved from Client to Canvas
+
+### Core Canvas Files
+
+| **Canvas Location** | **Original Client Location** | **Purpose** |
+|-------------------|---------------------------|-----------|
+| `canvas/src/state.rs` | `client/src/state/pages/canvas_state.rs` | Core CanvasState trait |
+| `canvas/src/actions/edit.rs` | `client/src/functions/modes/edit/form_e.rs` | Generic edit actions |
+| `canvas/src/renderer.rs` | `client/src/components/handlers/canvas.rs` | Canvas rendering logic |
+| `canvas/src/modes/highlight.rs` | `client/src/state/app/highlight.rs` | Highlight state types |
+| `canvas/src/modes/manager.rs` | `client/src/modes/handlers/mode_manager.rs` | Mode management |
+
+## Import Replacements Needed in Client
+
+### 1. CanvasState Trait Usage
+**Replace these imports:**
+```rust
+// OLD
+use crate::state::pages::canvas_state::CanvasState;
+
+// NEW  
+use canvas::CanvasState;
+```
+
+**Files that need updating:**
+- `src/modes/canvas/edit.rs` - Line 9
+- `src/modes/canvas/read_only.rs` - Line 5
+- `src/ui/handlers/render.rs` - Line 17
+- `src/state/pages/auth.rs` - All CanvasState impls
+- `src/state/pages/form.rs` - CanvasState impl
+- `src/state/pages/add_table.rs` - CanvasState impl  
+- `src/state/pages/add_logic.rs` - CanvasState impl
+
+### 2. Edit Actions Usage
+**Replace these imports:**
+```rust
+// OLD
+use crate::functions::modes::edit::form_e::{execute_edit_action, execute_common_action};
+
+// NEW
+use canvas::{execute_edit_action, execute_common_action};
+```
+
+**Files that need updating:**
+- `src/modes/canvas/edit.rs` - Lines 3-5
+- `src/functions/modes/edit/auth_e.rs`
+- `src/functions/modes/edit/add_table_e.rs`
+- `src/functions/modes/edit/add_logic_e.rs`
+
+### 3. Canvas Rendering Usage  
+**Replace these imports:**
+```rust
+// OLD  
+use crate::components::handlers::canvas::render_canvas;
+
+// NEW
+use canvas::render_canvas;
+```
+
+**Files that need updating:**
+- Any component that renders forms (login, register, add_table, add_logic, forms)
+
+### 4. Mode System Usage
+**Replace these imports:**
+```rust
+// OLD
+use crate::modes::handlers::mode_manager::{AppMode, ModeManager};
+use crate::state::app::highlight::HighlightState;
+
+// NEW
+use canvas::{AppMode, ModeManager, HighlightState};
+```
+
+**Files that need updating:**
+- `src/modes/handlers/event.rs` - Line 14
+- `src/ui/handlers/ui.rs` - Mode derivation calls
+- All mode handling files
+
+## Theme Integration Required
+
+The canvas crate expects a `CanvasTheme` trait. You need to implement this for your existing theme:
+
+```rust
+// In client/src/config/colors/themes.rs
+use canvas::CanvasTheme;
+use ratatui::style::Color;
+
+impl CanvasTheme for Theme {
+    fn primary_fg(&self) -> Color { self.fg }
+    fn primary_bg(&self) -> Color { self.bg }
+    fn accent(&self) -> Color { self.accent }
+    fn warning(&self) -> Color { self.warning }
+    fn secondary(&self) -> Color { self.secondary }
+    fn highlight(&self) -> Color { self.highlight }
+    fn highlight_bg(&self) -> Color { self.highlight_bg }
+}
+```
+
+## Systematic Replacement Strategy
+
+### Phase 1: Fix Compilation (Do This First)
+1. Update `client/Cargo.toml` to depend on canvas
+2. Add theme implementation  
+3. Replace imports in core files
+
+### Phase 2: Replace Feature-Specific Usage
+1. Update auth components
+2. Update form components  
+3. Update admin components
+4. Update mode handlers
+
+### Phase 3: Remove Old Files (After Everything Works)
+1. Delete `src/state/pages/canvas_state.rs`
+2. Delete `src/functions/modes/edit/form_e.rs`  
+3. Delete `src/components/handlers/canvas.rs`
+4. Delete `src/state/app/highlight.rs`
+5. Delete `src/modes/handlers/mode_manager.rs`
+
+## Files Safe to Delete After Migration
+
+**These can be removed once imports are updated:**
+- `client/src/state/pages/canvas_state.rs`
+- `client/src/functions/modes/edit/form_e.rs`
+- `client/src/components/handlers/canvas.rs`  
+- `client/src/state/app/highlight.rs`
+- `client/src/modes/handlers/mode_manager.rs`
+
+## Quick Start Commands
+
+```bash
+# 1. Add canvas dependency to client
+cd client
+echo 'canvas = { path = "../canvas" }' >> Cargo.toml
+
+# 2. Test compilation
+cargo check
+
+# 3. Fix imports one file at a time
+# Start with: src/config/colors/themes.rs (add CanvasTheme impl)
+# Then: src/modes/canvas/edit.rs (replace form_e imports)
+# Then: src/modes/canvas/read_only.rs (replace canvas_state import)
+
+# 4. After all imports fixed, delete old files
+rm src/state/pages/canvas_state.rs
+rm src/functions/modes/edit/form_e.rs  
+rm src/components/handlers/canvas.rs
+rm src/state/app/highlight.rs
+rm src/modes/handlers/mode_manager.rs
+```
+
+## Expected Compilation Errors
+
+You'll get errors like:
+- `cannot find type 'CanvasState' in this scope`
+- `cannot find function 'execute_edit_action' in this scope`  
+- `cannot find type 'AppMode' in this scope`
+
+Fix these by replacing the imports as documented above.

canvas/Cargo.toml

@@ -0,0 +1,38 @@
+[package]
+name = "canvas"
+version.workspace = true
+edition.workspace = true
+license.workspace = true
+authors.workspace = true
+description.workspace = true
+readme.workspace = true
+repository.workspace = true
+categories.workspace = true
+
+[dependencies]
+common = { path = "../common" }
+ratatui = { workspace = true }
+crossterm = { workspace = true }
+anyhow = { workspace = true }
+tokio = { workspace = true }
+toml = { workspace = true }
+serde = { workspace = true }
+
+[dev-dependencies]
+tokio-test = "0.4.4"
+
+[[example]]
+name = "simple_login"
+path = "examples/simple_login.rs"
+
+[[example]]
+name = "config_screen"
+path = "examples/config_screen.rs"
+
+[[example]]
+name = "basic_usage"
+path = "examples/basic_usage.rs"
+
+[[example]]
+name = "integration_patterns"
+path = "examples/integration_patterns.rs"

canvas/README.md

@@ -0,0 +1,366 @@
+# Canvas 🎨
+
+A reusable, type-safe canvas system for building form-based TUI applications with vim-like modal editing.
+
+## ✨ Features
+
+- **Type-Safe Actions**: No more string-based action names - everything is compile-time checked
+- **Generic Design**: Implement `CanvasState` once, get navigation, editing, and suggestions for free
+- **Vim-Like Experience**: Modal editing with familiar keybindings
+- **Suggestion System**: Built-in autocomplete and suggestions support
+- **Framework Agnostic**: Works with any TUI framework or raw terminal handling
+- **Async Ready**: Full async/await support for modern Rust applications
+- **Batch Operations**: Execute multiple actions atomically
+- **Extensible**: Custom actions and feature-specific handling
+
+## 🚀 Quick Start
+
+Add to your `Cargo.toml`:
+
+```toml
+cargo add canvas
+```
+
+Implement the `CanvasState` trait:
+
+```rust
+use canvas::prelude::*;
+
+#[derive(Debug)]
+struct LoginForm {
+    current_field: usize,
+    cursor_pos: usize,
+    username: String,
+    password: String,
+    has_changes: bool,
+}
+
+impl CanvasState for LoginForm {
+    fn current_field(&self) -> usize { self.current_field }
+    fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+    fn set_current_field(&mut self, index: usize) { self.current_field = index; }
+    fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+    fn get_current_input(&self) -> &str {
+        match self.current_field {
+            0 => &self.username,
+            1 => &self.password,
+            _ => "",
+        }
+    }
+
+    fn get_current_input_mut(&mut self) -> &mut String {
+        match self.current_field {
+            0 => &mut self.username,
+            1 => &mut self.password,
+            _ => unreachable!(),
+        }
+    }
+
+    fn inputs(&self) -> Vec<&String> { vec![&self.username, &self.password] }
+    fn fields(&self) -> Vec<&str> { vec!["Username", "Password"] }
+    fn has_unsaved_changes(&self) -> bool { self.has_changes }
+    fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+}
+```
+
+Use the type-safe action dispatcher:
+
+```rust
+#[tokio::main]
+async fn main() -> Result<(), Box<dyn std::error::Error>> {
+    let mut form = LoginForm::new();
+    let mut ideal_cursor = 0;
+
+    // Type a character - compile-time safe!
+    ActionDispatcher::dispatch(
+        CanvasAction::InsertChar('h'),
+        &mut form,
+        &mut ideal_cursor,
+    ).await?;
+
+    // Move to next field
+    ActionDispatcher::dispatch(
+        CanvasAction::NextField,
+        &mut form,
+        &mut ideal_cursor,
+    ).await?;
+
+    // Batch operations
+    let actions = vec![
+        CanvasAction::InsertChar('p'),
+        CanvasAction::InsertChar('a'),
+        CanvasAction::InsertChar('s'),
+        CanvasAction::InsertChar('s'),
+    ];
+
+    ActionDispatcher::dispatch_batch(actions, &mut form, &mut ideal_cursor).await?;
+
+    Ok(())
+}
+```
+
+## 📚 Examples
+
+The `examples/` directory contains comprehensive examples showing different usage patterns:
+
+### Run the Examples
+
+```bash
+# Basic login form with TUI
+cargo run --example simple_login
+
+# Advanced configuration screen with suggestions and validation
+cargo run --example config_screen
+
+# API usage patterns and quick start guide
+cargo run --example basic_usage
+
+# Advanced integration patterns (state machines, events, validation)
+cargo run --example integration_patterns
+```
+
+### Example Overview
+
+| Example | Description | Key Features |
+|---------|-------------|--------------|
+| `simple_login` | Interactive login form TUI | Basic form, custom actions, password masking |
+| `config_screen` | Configuration editor | Auto-suggestions, field validation, complex UI |
+| `basic_usage` | API demonstration | All core patterns, non-interactive |
+| `integration_patterns` | Architecture patterns | State machines, events, validation pipelines |
+
+## 🎯 Type-Safe Actions
+
+The Canvas system uses strongly-typed actions instead of error-prone strings:
+
+```rust
+// ✅ Type-safe - impossible to make typos
+ActionDispatcher::dispatch(CanvasAction::MoveLeft, &mut form, &mut cursor).await?;
+
+// ❌ Old way - runtime errors waiting to happen
+execute_edit_action("move_left", key, &mut form, &mut cursor).await?;
+execute_edit_action("move_leftt", key, &mut form, &mut cursor).await?; // Oops!
+```
+
+### Available Actions
+
+```rust
+pub enum CanvasAction {
+    // Character input
+    InsertChar(char),
+    
+    // Deletion
+    DeleteBackward,
+    DeleteForward,
+    
+    // Movement
+    MoveLeft, MoveRight, MoveUp, MoveDown,
+    MoveLineStart, MoveLineEnd,
+    MoveWordNext, MoveWordPrev,
+    
+    // Navigation
+    NextField, PrevField,
+    MoveFirstLine, MoveLastLine,
+    
+    // Suggestions
+    SuggestionUp, SuggestionDown,
+    SelectSuggestion, ExitSuggestions,
+    
+    // Extensibility
+    Custom(String),
+}
+```
+
+## 🔧 Advanced Features
+
+### Suggestions and Autocomplete
+
+```rust
+impl CanvasState for MyForm {
+    fn get_suggestions(&self) -> Option<&[String]> {
+        if self.suggestions.is_active {
+            Some(&self.suggestions.suggestions)
+        } else {
+            None
+        }
+    }
+
+    fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+        match action {
+            CanvasAction::InsertChar('@') => {
+                // Trigger email suggestions
+                let suggestions = vec![
+                    format!("{}@gmail.com", self.username),
+                    format!("{}@company.com", self.username),
+                ];
+                self.activate_suggestions(suggestions);
+                None // Let generic handler insert the '@'
+            }
+            CanvasAction::SelectSuggestion => {
+                if let Some(suggestion) = self.suggestions.get_selected() {
+                    *self.get_current_input_mut() = suggestion.clone();
+                    self.deactivate_suggestions();
+                    Some("Applied suggestion".to_string())
+                }
+                None
+            }
+            _ => None,
+        }
+    }
+}
+```
+
+### Custom Actions
+
+```rust
+fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+    match action {
+        CanvasAction::Custom(cmd) => match cmd.as_str() {
+            "uppercase" => {
+                *self.get_current_input_mut() = self.get_current_input().to_uppercase();
+                Some("Converted to uppercase".to_string())
+            }
+            "validate_email" => {
+                if self.get_current_input().contains('@') {
+                    Some("Email is valid".to_string())
+                } else {
+                    Some("Invalid email format".to_string())
+                }
+            }
+            _ => None,
+        },
+        _ => None,
+    }
+}
+```
+
+### Integration with TUI Frameworks
+
+Canvas is framework-agnostic and works with any TUI library:
+
+```rust
+// Works with crossterm (see examples)
+// Works with termion
+// Works with ratatui/tui-rs
+// Works with cursive
+// Works with raw terminal I/O
+```
+
+## 🏗️ Architecture
+
+Canvas follows a clean, layered architecture:
+
+```
+┌─────────────────────────────────────┐
+│           Your Application          │
+├─────────────────────────────────────┤
+│         ActionDispatcher            │  ← High-level API
+├─────────────────────────────────────┤
+│     CanvasAction (Type-Safe)        │  ← Type safety layer
+├─────────────────────────────────────┤
+│        Action Handlers              │  ← Core logic
+├─────────────────────────────────────┤
+│        CanvasState Trait            │  ← Your implementation
+└─────────────────────────────────────┘
+```
+
+## 🤝 Why Canvas?
+
+### Before Canvas
+```rust
+// ❌ Error-prone string actions
+execute_action("move_left", key, state)?;
+execute_action("move_leftt", key, state)?; // Runtime error!
+
+// ❌ Duplicate navigation logic everywhere
+impl MyLoginForm { /* navigation code */ }
+impl MyConfigForm { /* same navigation code */ }
+impl MyDataForm { /* same navigation code again */ }
+
+// ❌ Manual cursor and field management
+if key == Key::Tab {
+    current_field = (current_field + 1) % fields.len();
+    cursor_pos = cursor_pos.min(current_input.len());
+}
+```
+
+### With Canvas
+```rust
+// ✅ Type-safe actions
+ActionDispatcher::dispatch(CanvasAction::MoveLeft, state, cursor)?;
+// Typos are impossible - won't compile!
+
+// ✅ Implement once, use everywhere
+impl CanvasState for MyForm { /* minimal implementation */ }
+// All navigation, editing, suggestions work automatically!
+
+// ✅ High-level operations
+ActionDispatcher::dispatch_batch(actions, state, cursor)?;
+```
+
+## 📖 Documentation
+
+- **API Docs**: `cargo doc --open`
+- **Examples**: See `examples/` directory
+- **Migration Guide**: See `CANVAS_MIGRATION.md`
+
+## 🔄 Migration from String-Based Actions
+
+Canvas provides backwards compatibility during migration:
+
+```rust
+// Legacy support (deprecated)
+execute_edit_action("move_left", key, state, cursor).await?;
+
+// New type-safe way
+ActionDispatcher::dispatch(CanvasAction::MoveLeft, state, cursor).await?;
+```
+
+## 🧪 Testing
+
+```bash
+# Run all tests
+cargo test
+
+# Run specific example
+cargo run --example simple_login
+
+# Check type safety
+cargo check
+```
+
+## 📋 Requirements
+
+- Rust 1.70+
+- Terminal with cursor support
+- Optional: async runtime (tokio) for examples
+
+## 🤔 FAQ
+
+**Q: Does Canvas work with [my TUI framework]?**  
+A: Yes! Canvas is framework-agnostic. Just implement `CanvasState` and handle the key events.
+
+**Q: Can I extend Canvas with custom actions?**  
+A: Absolutely! Use `CanvasAction::Custom("my_action")` or implement `handle_feature_action`.
+
+**Q: Is Canvas suitable for complex forms?**  
+A: Yes! See the `config_screen` example for validation, suggestions, and multi-field forms.
+
+**Q: How do I migrate from string-based actions?**  
+A: Canvas provides backwards compatibility. Migrate incrementally using the type-safe APIs.
+
+## 📄 License
+
+Licensed under either of:
+- Apache License, Version 2.0 ([LICENSE-APACHE](LICENSE-APACHE))
+- MIT License ([LICENSE-MIT](LICENSE-MIT))
+
+at your option.
+
+## 🙏 Contributing
+
+Will write here something later on, too busy rn
+
+---
+
+Built with ❤️ for the Rust TUI community

canvas/canvas_config.toml

@@ -0,0 +1,56 @@
+# canvas_config.toml - Complete Canvas Configuration
+
+[behavior]
+wrap_around_fields = true
+auto_save_on_field_change = false
+word_chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789_"
+max_suggestions = 6
+
+[appearance]
+cursor_style = "block"  # "block", "bar", "underline"
+show_field_numbers = false
+highlight_current_field = true
+
+# Read-only mode keybindings (vim-style)
+[keybindings.read_only]
+move_left = ["h"]
+move_right = ["l"] 
+move_up = ["k"]
+move_down = ["p"]
+move_word_next = ["w"]
+move_word_end = ["e"]
+move_word_prev = ["b"]
+move_word_end_prev = ["ge"]
+move_line_start = ["0"]
+move_line_end = ["$"]
+move_first_line = ["gg"]
+move_last_line = ["G"]
+next_field = ["Tab"]
+prev_field = ["Shift+Tab"]
+
+# Edit mode keybindings
+[keybindings.edit]
+delete_char_backward = ["Backspace"]
+delete_char_forward = ["Delete"]
+move_left = ["Left"]
+move_right = ["Right"]
+move_up = ["Up"]
+move_down = ["Down"]
+move_line_start = ["Home"]
+move_line_end = ["End"]
+move_word_next = ["Ctrl+Right"]
+move_word_prev = ["Ctrl+Left"]
+next_field = ["Tab"]
+prev_field = ["Shift+Tab"]
+
+# Suggestion/autocomplete keybindings
+[keybindings.suggestions]
+suggestion_up = ["Up", "Ctrl+p"]
+suggestion_down = ["Down", "Ctrl+n"]
+select_suggestion = ["Enter", "Tab"]
+exit_suggestions = ["Esc"]
+
+# Global keybindings (work in both modes)
+[keybindings.global]
+move_up = ["Up"]
+move_down = ["Down"]

canvas/examples/basic_usage.rs

@@ -0,0 +1,378 @@
+// examples/basic_usage.rs
+//! Basic usage patterns and quick start guide
+//!
+//! This example demonstrates the core patterns for using the canvas crate:
+//! 1. Implementing CanvasState
+//! 2. Using the ActionDispatcher
+//! 3. Handling different types of actions
+//! 4. Working with suggestions
+//!
+//! Run with: cargo run --example basic_usage
+
+use canvas::prelude::*;
+
+#[tokio::main]
+async fn main() {
+    println!("🎨 Canvas Crate - Basic Usage Patterns");
+    println!("=====================================\n");
+
+    // Example 1: Minimal form implementation
+    example_1_minimal_form();
+
+    // Example 2: Form with suggestions
+    example_2_with_suggestions();
+
+    // Example 3: Custom actions
+    example_3_custom_actions().await;
+
+    // Example 4: Batch operations
+    example_4_batch_operations().await;
+}
+
+// Example 1: Minimal form - just the required methods
+fn example_1_minimal_form() {
+    println!("📝 Example 1: Minimal Form Implementation");
+
+    #[derive(Debug)]
+    struct SimpleForm {
+        current_field: usize,
+        cursor_pos: usize,
+        name: String,
+        email: String,
+        has_changes: bool,
+    }
+
+    impl SimpleForm {
+        fn new() -> Self {
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                name: String::new(),
+                email: String::new(),
+                has_changes: false,
+            }
+        }
+    }
+
+    impl CanvasState for SimpleForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index.min(1); }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str {
+            match self.current_field {
+                0 => &self.name,
+                1 => &self.email,
+                _ => "",
+            }
+        }
+
+        fn get_current_input_mut(&mut self) -> &mut String {
+            match self.current_field {
+                0 => &mut self.name,
+                1 => &mut self.email,
+                _ => unreachable!(),
+            }
+        }
+
+        fn inputs(&self) -> Vec<&String> { vec![&self.name, &self.email] }
+        fn fields(&self) -> Vec<&str> { vec!["Name", "Email"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+    }
+
+    let form = SimpleForm::new();
+    println!("  Created form with {} fields", form.fields().len());
+    println!("  Current field: {}", form.fields()[form.current_field()]);
+    println!("  ✅ Minimal implementation works!\n");
+}
+
+// Example 2: Form with suggestion support
+fn example_2_with_suggestions() {
+    println!("💡 Example 2: Form with Suggestions");
+
+    #[derive(Debug)]
+    struct FormWithSuggestions {
+        current_field: usize,
+        cursor_pos: usize,
+        country: String,
+        has_changes: bool,
+        suggestions: SuggestionState,
+    }
+
+    impl FormWithSuggestions {
+        fn new() -> Self {
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                country: String::new(),
+                has_changes: false,
+                suggestions: SuggestionState::default(),
+            }
+        }
+    }
+
+    impl CanvasState for FormWithSuggestions {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index; }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str { &self.country }
+        fn get_current_input_mut(&mut self) -> &mut String { &mut self.country }
+        fn inputs(&self) -> Vec<&String> { vec![&self.country] }
+        fn fields(&self) -> Vec<&str> { vec!["Country"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+
+        // Suggestion support
+        fn get_suggestions(&self) -> Option<&[String]> {
+            if self.suggestions.is_active {
+                Some(&self.suggestions.suggestions)
+            } else {
+                None
+            }
+        }
+
+        fn get_selected_suggestion_index(&self) -> Option<usize> {
+            self.suggestions.selected_index
+        }
+
+        fn set_selected_suggestion_index(&mut self, index: Option<usize>) {
+            self.suggestions.selected_index = index;
+        }
+
+        fn activate_suggestions(&mut self, suggestions: Vec<String>) {
+            self.suggestions.activate_with_suggestions(suggestions);
+        }
+
+        fn deactivate_suggestions(&mut self) {
+            self.suggestions.deactivate();
+        }
+
+        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+            match action {
+                CanvasAction::SelectSuggestion => {
+                    // Fix: Clone the suggestion first to avoid borrow checker issues
+                    if let Some(suggestion) = self.suggestions.get_selected().cloned() {
+                        self.country = suggestion.clone();
+                        self.cursor_pos = suggestion.len();
+                        self.deactivate_suggestions();
+                        self.has_changes = true;
+                        return Some(format!("Selected: {}", suggestion));
+                    }
+                    None
+                }
+                _ => None,
+            }
+        }
+    }
+
+    let mut form = FormWithSuggestions::new();
+
+    // Simulate user typing and triggering suggestions
+    form.activate_suggestions(vec![
+        "United States".to_string(),
+        "United Kingdom".to_string(),
+        "Ukraine".to_string(),
+    ]);
+
+    println!("  Activated suggestions: {:?}", form.get_suggestions().unwrap());
+    println!("  Current selection: {:?}", form.get_selected_suggestion_index());
+
+    // Navigate suggestions
+    form.set_selected_suggestion_index(Some(1));
+    println!("  Navigated to: {}", form.suggestions.get_selected().unwrap());
+    println!("  ✅ Suggestions work!\n");
+}
+
+// Example 3: Custom actions
+async fn example_3_custom_actions() {
+    println!("⚡ Example 3: Custom Actions");
+
+    #[derive(Debug)]
+    struct FormWithCustomActions {
+        current_field: usize,
+        cursor_pos: usize,
+        text: String,
+        has_changes: bool,
+    }
+
+    impl FormWithCustomActions {
+        fn new() -> Self {
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                text: "hello world".to_string(),
+                has_changes: false,
+            }
+        }
+    }
+
+    impl CanvasState for FormWithCustomActions {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index; }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str { &self.text }
+        fn get_current_input_mut(&mut self) -> &mut String { &mut self.text }
+        fn inputs(&self) -> Vec<&String> { vec![&self.text] }
+        fn fields(&self) -> Vec<&str> { vec!["Text"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+
+        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+            match action {
+                CanvasAction::Custom(cmd) => match cmd.as_str() {
+                    "uppercase" => {
+                        self.text = self.text.to_uppercase();
+                        self.has_changes = true;
+                        Some("Converted to uppercase".to_string())
+                    }
+                    "reverse" => {
+                        self.text = self.text.chars().rev().collect();
+                        self.has_changes = true;
+                        Some("Reversed text".to_string())
+                    }
+                    "word_count" => {
+                        let count = self.text.split_whitespace().count();
+                        Some(format!("Word count: {}", count))
+                    }
+                    _ => None,
+                },
+                _ => None,
+            }
+        }
+    }
+
+    let mut form = FormWithCustomActions::new();
+    let mut ideal_cursor = 0;
+
+    println!("  Initial text: '{}'", form.text);
+
+    // Execute custom actions
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("uppercase".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+
+    println!("  After uppercase: '{}' - {}", form.text, result.message().unwrap());
+
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("reverse".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+
+    println!("  After reverse: '{}' - {}", form.text, result.message().unwrap());
+
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("word_count".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+
+    println!("  {}", result.message().unwrap());
+    println!("  ✅ Custom actions work!\n");
+}
+
+// Example 4: Batch operations
+async fn example_4_batch_operations() {
+    println!("📦 Example 4: Batch Operations");
+
+    // Reuse the simple form from example 1
+    #[derive(Debug)]
+    struct SimpleForm {
+        current_field: usize,
+        cursor_pos: usize,
+        name: String,
+        email: String,
+        has_changes: bool,
+    }
+
+    impl SimpleForm {
+        fn new() -> Self {
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                name: String::new(),
+                email: String::new(),
+                has_changes: false,
+            }
+        }
+    }
+
+    impl CanvasState for SimpleForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index.min(1); }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str {
+            match self.current_field {
+                0 => &self.name,
+                1 => &self.email,
+                _ => "",
+            }
+        }
+
+        fn get_current_input_mut(&mut self) -> &mut String {
+            match self.current_field {
+                0 => &mut self.name,
+                1 => &mut self.email,
+                _ => unreachable!(),
+            }
+        }
+
+        fn inputs(&self) -> Vec<&String> { vec![&self.name, &self.email] }
+        fn fields(&self) -> Vec<&str> { vec!["Name", "Email"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+    }
+
+    let mut form = SimpleForm::new();
+    let mut ideal_cursor = 0;
+
+    // Execute a sequence of actions to type "John" in the name field
+    let actions = vec![
+        CanvasAction::InsertChar('J'),
+        CanvasAction::InsertChar('o'),
+        CanvasAction::InsertChar('h'),
+        CanvasAction::InsertChar('n'),
+        CanvasAction::NextField, // Move to email field
+        CanvasAction::InsertChar('j'),
+        CanvasAction::InsertChar('o'),
+        CanvasAction::InsertChar('h'),
+        CanvasAction::InsertChar('n'),
+        CanvasAction::InsertChar('@'),
+        CanvasAction::InsertChar('e'),
+        CanvasAction::InsertChar('x'),
+        CanvasAction::InsertChar('a'),
+        CanvasAction::InsertChar('m'),
+        CanvasAction::InsertChar('p'),
+        CanvasAction::InsertChar('l'),
+        CanvasAction::InsertChar('e'),
+        CanvasAction::InsertChar('.'),
+        CanvasAction::InsertChar('c'),
+        CanvasAction::InsertChar('o'),
+        CanvasAction::InsertChar('m'),
+    ];
+
+    println!("  Executing {} actions in batch...", actions.len());
+
+    let results = ActionDispatcher::dispatch_batch(
+        actions,
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+
+    println!("  Completed {} actions", results.len());
+    println!("  Final state:");
+    println!("    Name: '{}'", form.name);
+    println!("    Email: '{}'", form.email);
+    println!("    Current field: {}", form.fields()[form.current_field()]);
+    println!("    Has changes: {}", form.has_changes);
+}

canvas/examples/config_screen.rs

@@ -0,0 +1,590 @@
+// examples/config_screen.rs
+//! Advanced configuration screen with suggestions and validation
+//!
+//! This example demonstrates:
+//! - Multiple field types
+//! - Auto-suggestions
+//! - Field validation
+//! - Custom actions
+//!
+//! Run with: cargo run --example config_screen
+
+use canvas::prelude::*;
+use crossterm::{
+    event::{self, Event, KeyCode, KeyEvent, KeyModifiers},
+    terminal::{disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen},
+    ExecutableCommand,
+};
+use std::io::{self, Write};
+
+#[derive(Debug)]
+struct ConfigForm {
+    current_field: usize,
+    cursor_pos: usize,
+
+    // Configuration fields
+    server_host: String,
+    server_port: String,
+    database_url: String,
+    log_level: String,
+    max_connections: String,
+
+    has_changes: bool,
+    suggestions: SuggestionState,
+}
+
+impl ConfigForm {
+    fn new() -> Self {
+        Self {
+            current_field: 0,
+            cursor_pos: 0,
+            server_host: "localhost".to_string(),
+            server_port: "8080".to_string(),
+            database_url: String::new(),
+            log_level: "info".to_string(),
+            max_connections: "100".to_string(),
+            has_changes: false,
+            suggestions: SuggestionState::default(),
+        }
+    }
+
+    fn field_names() -> Vec<&'static str> {
+        vec![
+            "Server Host",
+            "Server Port",
+            "Database URL",
+            "Log Level",
+            "Max Connections"
+        ]
+    }
+
+    fn get_field_value(&self, index: usize) -> &String {
+        match index {
+            0 => &self.server_host,
+            1 => &self.server_port,
+            2 => &self.database_url,
+            3 => &self.log_level,
+            4 => &self.max_connections,
+            _ => panic!("Invalid field index: {}", index),
+        }
+    }
+
+    fn get_field_value_mut(&mut self, index: usize) -> &mut String {
+        match index {
+            0 => &mut self.server_host,
+            1 => &mut self.server_port,
+            2 => &mut self.database_url,
+            3 => &mut self.log_level,
+            4 => &mut self.max_connections,
+            _ => panic!("Invalid field index: {}", index),
+        }
+    }
+
+    fn validate_field(&self, index: usize) -> Option<String> {
+        let value = self.get_field_value(index);
+        match index {
+            0 => { // Server Host
+                if value.trim().is_empty() {
+                    Some("Server host cannot be empty".to_string())
+                } else {
+                    None
+                }
+            }
+            1 => { // Server Port
+                if let Ok(port) = value.parse::<u16>() {
+                    if port == 0 {
+                        Some("Port must be greater than 0".to_string())
+                    } else {
+                        None
+                    }
+                } else {
+                    Some("Port must be a valid number (1-65535)".to_string())
+                }
+            }
+            2 => { // Database URL
+                if !value.is_empty() && !value.starts_with("postgresql://") && !value.starts_with("mysql://") && !value.starts_with("sqlite://") {
+                    Some("Database URL should start with postgresql://, mysql://, or sqlite://".to_string())
+                } else {
+                    None
+                }
+            }
+            3 => { // Log Level
+                let valid_levels = ["trace", "debug", "info", "warn", "error"];
+                if !valid_levels.contains(&value.to_lowercase().as_str()) {
+                    Some("Log level must be one of: trace, debug, info, warn, error".to_string())
+                } else {
+                    None
+                }
+            }
+            4 => { // Max Connections
+                if let Ok(connections) = value.parse::<u32>() {
+                    if connections == 0 {
+                        Some("Max connections must be greater than 0".to_string())
+                    } else if connections > 10000 {
+                        Some("Max connections seems too high (>10000)".to_string())
+                    } else {
+                        None
+                    }
+                } else {
+                    Some("Max connections must be a valid number".to_string())
+                }
+            }
+            _ => None,
+        }
+    }
+
+    fn get_suggestions_for_field(&self, index: usize, current_value: &str) -> Vec<String> {
+        match index {
+            0 => { // Server Host
+                vec![
+                    "localhost".to_string(),
+                    "127.0.0.1".to_string(),
+                    "0.0.0.0".to_string(),
+                    format!("{}.local", current_value),
+                ]
+            }
+            1 => { // Server Port
+                vec![
+                    "8080".to_string(),
+                    "3000".to_string(),
+                    "8000".to_string(),
+                    "80".to_string(),
+                    "443".to_string(),
+                ]
+            }
+            2 => { // Database URL
+                if current_value.is_empty() {
+                    vec![
+                        "postgresql://localhost:5432/mydb".to_string(),
+                        "mysql://localhost:3306/mydb".to_string(),
+                        "sqlite://./database.db".to_string(),
+                    ]
+                } else {
+                    vec![]
+                }
+            }
+            3 => { // Log Level
+                vec![
+                    "trace".to_string(),
+                    "debug".to_string(),
+                    "info".to_string(),
+                    "warn".to_string(),
+                    "error".to_string(),
+                ]
+                .into_iter()
+                .filter(|level| level.starts_with(&current_value.to_lowercase()))
+                .collect()
+            }
+            4 => { // Max Connections
+                vec![
+                    "10".to_string(),
+                    "50".to_string(),
+                    "100".to_string(),
+                    "200".to_string(),
+                    "500".to_string(),
+                ]
+            }
+            _ => vec![],
+        }
+    }
+}
+
+impl CanvasState for ConfigForm {
+    fn current_field(&self) -> usize {
+        self.current_field
+    }
+
+    fn current_cursor_pos(&self) -> usize {
+        self.cursor_pos
+    }
+
+    fn set_current_field(&mut self, index: usize) {
+        self.current_field = index.min(4); // 5 fields total (0-4)
+        // Deactivate suggestions when changing fields
+        self.deactivate_suggestions();
+    }
+
+    fn set_current_cursor_pos(&mut self, pos: usize) {
+        self.cursor_pos = pos;
+    }
+
+    fn get_current_input(&self) -> &str {
+        self.get_field_value(self.current_field)
+    }
+
+    fn get_current_input_mut(&mut self) -> &mut String {
+        self.get_field_value_mut(self.current_field)
+    }
+
+    fn inputs(&self) -> Vec<&String> {
+        vec![
+            &self.server_host,
+            &self.server_port,
+            &self.database_url,
+            &self.log_level,
+            &self.max_connections,
+        ]
+    }
+
+    fn fields(&self) -> Vec<&str> {
+        Self::field_names()
+    }
+
+    fn has_unsaved_changes(&self) -> bool {
+        self.has_changes
+    }
+
+    fn set_has_unsaved_changes(&mut self, changed: bool) {
+        self.has_changes = changed;
+    }
+
+    // Suggestion support
+    fn get_suggestions(&self) -> Option<&[String]> {
+        if self.suggestions.is_active {
+            Some(&self.suggestions.suggestions)
+        } else {
+            None
+        }
+    }
+
+    fn get_selected_suggestion_index(&self) -> Option<usize> {
+        self.suggestions.selected_index
+    }
+
+    fn set_selected_suggestion_index(&mut self, index: Option<usize>) {
+        self.suggestions.selected_index = index;
+    }
+
+    fn activate_suggestions(&mut self, suggestions: Vec<String>) {
+        self.suggestions.activate_with_suggestions(suggestions);
+    }
+
+    fn deactivate_suggestions(&mut self) {
+        self.suggestions.deactivate();
+    }
+
+    fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+        match action {
+            CanvasAction::SelectSuggestion => {
+                // Fix: Clone the suggestion first to avoid borrow checker issues
+                if let Some(suggestion) = self.suggestions.get_selected().cloned() {
+                    *self.get_current_input_mut() = suggestion.clone();
+                    self.set_current_cursor_pos(suggestion.len());
+                    self.deactivate_suggestions();
+                    self.set_has_unsaved_changes(true);
+                    return Some("Applied suggestion".to_string());
+                }
+                None
+            }
+
+            CanvasAction::Custom(cmd) => match cmd.as_str() {
+                "trigger_suggestions" => {
+                    let current_value = self.get_current_input();
+                    let suggestions = self.get_suggestions_for_field(self.current_field, current_value);
+                    if !suggestions.is_empty() {
+                        self.activate_suggestions(suggestions);
+                        Some("Showing suggestions".to_string())
+                    } else {
+                        Some("No suggestions available".to_string())
+                    }
+                }
+                "validate_current" => {
+                    if let Some(error) = self.validate_field(self.current_field) {
+                        Some(format!("Validation Error: {}", error))
+                    } else {
+                        Some("Field is valid".to_string())
+                    }
+                }
+                "validate_all" => {
+                    let mut errors = Vec::new();
+                    for i in 0..5 {
+                        if let Some(error) = self.validate_field(i) {
+                            errors.push(format!("{}: {}", Self::field_names()[i], error));
+                        }
+                    }
+                    if errors.is_empty() {
+                        Some("All fields are valid!".to_string())
+                    } else {
+                        Some(format!("Errors found: {}", errors.join("; ")))
+                    }
+                }
+                "save_config" => {
+                    // Validate all fields first
+                    for i in 0..5 {
+                        if self.validate_field(i).is_some() {
+                            return Some("Cannot save: Please fix validation errors first".to_string());
+                        }
+                    }
+                    self.set_has_unsaved_changes(false);
+                    Some("Configuration saved successfully!".to_string())
+                }
+                _ => None,
+            },
+
+            // Auto-trigger suggestions for certain fields
+            CanvasAction::InsertChar(_) => {
+                // After character insertion, check if we should show suggestions
+                match self.current_field {
+                    3 => { // Log level - always show suggestions for autocomplete
+                        let current_value = self.get_current_input();
+                        let suggestions = self.get_suggestions_for_field(self.current_field, current_value);
+                        if !suggestions.is_empty() {
+                            self.activate_suggestions(suggestions);
+                        }
+                    }
+                    _ => {}
+                }
+                None // Let the generic handler insert the character
+            }
+
+            _ => None,
+        }
+    }
+}
+
+fn draw_ui(form: &ConfigForm, message: &str) -> io::Result<()> {
+    print!("\x1B[2J\x1B[1;1H");
+
+    println!("╔════════════════════════════════════════════════════════════════╗");
+    println!("║                      CONFIGURATION EDITOR                     ║");
+    println!("╠════════════════════════════════════════════════════════════════╣");
+
+    let field_names = ConfigForm::field_names();
+
+    for (i, field_name) in field_names.iter().enumerate() {
+        let is_current = i == form.current_field;
+        let indicator = if is_current { ">" } else { " " };
+        let value = form.get_field_value(i);
+        let display_value = if value.is_empty() {
+            format!("<enter {}>", field_name.to_lowercase())
+        } else {
+            value.clone()
+        };
+
+        // Truncate long values for display
+        let display_value = if display_value.len() > 35 {
+            format!("{}...", &display_value[..32])
+        } else {
+            display_value
+        };
+
+        println!("║ {} {:15}: {:35} ║", indicator, field_name, display_value);
+
+        // Show cursor for current field
+        if is_current {
+            let cursor_pos = form.cursor_pos.min(value.len());
+            let cursor_line = format!("║   {}{}║",
+                " ".repeat(18 + cursor_pos),
+                "▊"
+            );
+            println!("{:66}", cursor_line);
+        }
+
+        // Show validation error if any
+        if let Some(error) = form.validate_field(i) {
+            let error_display = if error.len() > 58 {
+                format!("{}...", &error[..55])
+            } else {
+                error
+            };
+            println!("║   ⚠️  {:58} ║", error_display);
+        } else if is_current {
+            println!("║{:64}║", "");
+        }
+    }
+
+    println!("╠════════════════════════════════════════════════════════════════╣");
+
+    // Show suggestions if active
+    if let Some(suggestions) = form.get_suggestions() {
+        println!("║ SUGGESTIONS:                                                   ║");
+        for (i, suggestion) in suggestions.iter().enumerate() {
+            let selected = form.get_selected_suggestion_index() == Some(i);
+            let marker = if selected { "→" } else { " " };
+            let display_suggestion = if suggestion.len() > 55 {
+                format!("{}...", &suggestion[..52])
+            } else {
+                suggestion.clone()
+            };
+            println!("║ {} {:58} ║", marker, display_suggestion);
+        }
+        println!("╠════════════════════════════════════════════════════════════════╣");
+    }
+
+    println!("║ CONTROLS:                                                      ║");
+    println!("║   Tab/↑↓      - Navigate fields                                ║");
+    println!("║   Ctrl+Space  - Show suggestions                               ║");
+    println!("║   ↑↓          - Navigate suggestions (when shown)             ║");
+    println!("║   Enter       - Select suggestion / Validate field            ║");
+    println!("║   Ctrl+S      - Save configuration                             ║");
+    println!("║   Ctrl+V      - Validate all fields                           ║");
+    println!("║   Ctrl+C      - Exit                                           ║");
+    println!("╠════════════════════════════════════════════════════════════════╣");
+
+    // Status
+    let status = if !message.is_empty() {
+        message.to_string()
+    } else if form.has_changes {
+        "Configuration modified - press Ctrl+S to save".to_string()
+    } else {
+        "Ready".to_string()
+    };
+
+    let status_display = if status.len() > 58 {
+        format!("{}...", &status[..55])
+    } else {
+        status
+    };
+
+    println!("║ Status: {:55} ║", status_display);
+    println!("╚════════════════════════════════════════════════════════════════╝");
+
+    io::stdout().flush()?;
+    Ok(())
+}
+
+#[tokio::main]
+async fn main() -> io::Result<()> {
+    enable_raw_mode()?;
+    io::stdout().execute(EnterAlternateScreen)?;
+
+    let mut form = ConfigForm::new();
+    let mut ideal_cursor = 0;
+    let mut message = String::new();
+
+    draw_ui(&form, &message)?;
+
+    loop {
+        if let Event::Key(key) = event::read()? {
+            if !message.is_empty() {
+                message.clear();
+            }
+
+            match key {
+                // Exit
+                KeyEvent { code: KeyCode::Char('c'), modifiers: KeyModifiers::CONTROL, .. } => {
+                    break;
+                }
+
+                // Show suggestions
+                KeyEvent { code: KeyCode::Char(' '), modifiers: KeyModifiers::CONTROL, .. } => {
+                    let result = ActionDispatcher::dispatch(
+                        CanvasAction::Custom("trigger_suggestions".to_string()),
+                        &mut form,
+                        &mut ideal_cursor,
+                    ).await.unwrap();
+
+                    if let Some(msg) = result.message() {
+                        message = msg.to_string();
+                    }
+                }
+
+                // Validate current field or select suggestion
+                KeyEvent { code: KeyCode::Enter, .. } => {
+                    if form.get_suggestions().is_some() {
+                        // Select suggestion
+                        let result = ActionDispatcher::dispatch(
+                            CanvasAction::SelectSuggestion,
+                            &mut form,
+                            &mut ideal_cursor,
+                        ).await.unwrap();
+
+                        if let Some(msg) = result.message() {
+                            message = msg.to_string();
+                        }
+                    } else {
+                        // Validate current field
+                        let result = ActionDispatcher::dispatch(
+                            CanvasAction::Custom("validate_current".to_string()),
+                            &mut form,
+                            &mut ideal_cursor,
+                        ).await.unwrap();
+
+                        if let Some(msg) = result.message() {
+                            message = msg.to_string();
+                        }
+                    }
+                }
+
+                // Save configuration
+                KeyEvent { code: KeyCode::Char('s'), modifiers: KeyModifiers::CONTROL, .. } => {
+                    let result = ActionDispatcher::dispatch(
+                        CanvasAction::Custom("save_config".to_string()),
+                        &mut form,
+                        &mut ideal_cursor,
+                    ).await.unwrap();
+
+                    if let Some(msg) = result.message() {
+                        message = msg.to_string();
+                    }
+                }
+
+                // Validate all fields
+                KeyEvent { code: KeyCode::Char('v'), modifiers: KeyModifiers::CONTROL, .. } => {
+                    let result = ActionDispatcher::dispatch(
+                        CanvasAction::Custom("validate_all".to_string()),
+                        &mut form,
+                        &mut ideal_cursor,
+                    ).await.unwrap();
+
+                    if let Some(msg) = result.message() {
+                        message = msg.to_string();
+                    }
+                }
+
+                // Handle up/down for suggestions
+                KeyEvent { code: KeyCode::Up, .. } => {
+                    let action = if form.get_suggestions().is_some() {
+                        CanvasAction::SuggestionUp
+                    } else {
+                        CanvasAction::MoveUp
+                    };
+
+                    let _ = ActionDispatcher::dispatch(action, &mut form, &mut ideal_cursor).await;
+                }
+
+                KeyEvent { code: KeyCode::Down, .. } => {
+                    let action = if form.get_suggestions().is_some() {
+                        CanvasAction::SuggestionDown
+                    } else {
+                        CanvasAction::MoveDown
+                    };
+
+                    let _ = ActionDispatcher::dispatch(action, &mut form, &mut ideal_cursor).await;
+                }
+
+                // Handle escape to close suggestions
+                KeyEvent { code: KeyCode::Esc, .. } => {
+                    if form.get_suggestions().is_some() {
+                        let _ = ActionDispatcher::dispatch(
+                            CanvasAction::ExitSuggestions,
+                            &mut form,
+                            &mut ideal_cursor,
+                        ).await;
+                    }
+                }
+
+                // Regular key handling
+                _ => {
+                    if let Some(action) = CanvasAction::from_key(key.code) {
+                        let result = ActionDispatcher::dispatch(action, &mut form, &mut ideal_cursor).await.unwrap();
+
+                        if !result.is_success() {
+                            if let Some(msg) = result.message() {
+                                message = format!("Error: {}", msg);
+                            }
+                        }
+                    }
+                }
+            }
+
+            draw_ui(&form, &message)?;
+        }
+    }
+
+    disable_raw_mode()?;
+    io::stdout().execute(LeaveAlternateScreen)?;
+    println!("Configuration editor closed!");
+
+    Ok(())
+}

canvas/examples/integration_patterns.rs

@@ -0,0 +1,617 @@
+// examples/integration_patterns.rs
+//! Advanced integration patterns showing how Canvas works with:
+//! - State management patterns
+//! - Event-driven architectures  
+//! - Validation systems
+//! - Custom rendering
+//! 
+//! Run with: cargo run --example integration_patterns
+
+use canvas::prelude::*;
+use std::collections::HashMap;
+
+#[tokio::main]
+async fn main() {
+    println!("🔧 Canvas Integration Patterns");
+    println!("==============================\n");
+
+    // Pattern 1: State machine integration
+    state_machine_example().await;
+    
+    // Pattern 2: Event-driven architecture
+    event_driven_example().await;
+    
+    // Pattern 3: Validation pipeline
+    validation_pipeline_example().await;
+    
+    // Pattern 4: Multi-form orchestration
+    multi_form_example().await;
+}
+
+// Pattern 1: Canvas with state machine
+async fn state_machine_example() {
+    println!("🔄 Pattern 1: State Machine Integration");
+    
+    #[derive(Debug, Clone, PartialEq)]
+    enum FormState {
+        Initial,
+        Editing,
+        Validating,
+        Submitting,
+        Success,
+        Error(String),
+    }
+
+    #[derive(Debug)]
+    struct StateMachineForm {
+        // Canvas state
+        current_field: usize,
+        cursor_pos: usize,
+        username: String,
+        password: String,
+        has_changes: bool,
+        
+        // State machine
+        state: FormState,
+    }
+
+    impl StateMachineForm {
+        fn new() -> Self {
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                username: String::new(),
+                password: String::new(),
+                has_changes: false,
+                state: FormState::Initial,
+            }
+        }
+
+        fn transition_to(&mut self, new_state: FormState) -> String {
+            let old_state = self.state.clone();
+            self.state = new_state;
+            format!("State transition: {:?} -> {:?}", old_state, self.state)
+        }
+
+        fn can_submit(&self) -> bool {
+            matches!(self.state, FormState::Editing) && 
+            !self.username.trim().is_empty() && 
+            !self.password.trim().is_empty()
+        }
+    }
+
+    impl CanvasState for StateMachineForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index.min(1); }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str {
+            match self.current_field {
+                0 => &self.username,
+                1 => &self.password,
+                _ => "",
+            }
+        }
+
+        fn get_current_input_mut(&mut self) -> &mut String {
+            match self.current_field {
+                0 => &mut self.username,
+                1 => &mut self.password,
+                _ => unreachable!(),
+            }
+        }
+
+        fn inputs(&self) -> Vec<&String> { vec![&self.username, &self.password] }
+        fn fields(&self) -> Vec<&str> { vec!["Username", "Password"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+
+        fn set_has_unsaved_changes(&mut self, changed: bool) { 
+            self.has_changes = changed;
+            // Transition to editing state when user starts typing
+            if changed && self.state == FormState::Initial {
+                self.state = FormState::Editing;
+            }
+        }
+
+        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+            match action {
+                CanvasAction::Custom(cmd) => match cmd.as_str() {
+                    "submit" => {
+                        if self.can_submit() {
+                            let msg = self.transition_to(FormState::Submitting);
+                            // Simulate submission
+                            self.state = FormState::Success;
+                            Some(format!("{} -> Form submitted successfully", msg))
+                        } else {
+                            let msg = self.transition_to(FormState::Error("Invalid form data".to_string()));
+                            Some(msg)
+                        }
+                    }
+                    "reset" => {
+                        self.username.clear();
+                        self.password.clear();
+                        self.has_changes = false;
+                        Some(self.transition_to(FormState::Initial))
+                    }
+                    _ => None,
+                },
+                _ => None,
+            }
+        }
+    }
+
+    let mut form = StateMachineForm::new();
+    let mut ideal_cursor = 0;
+
+    println!("  Initial state: {:?}", form.state);
+
+    // Type some text to trigger state change
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::InsertChar('u'),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+    println!("  After typing: {:?}", form.state);
+
+    // Try to submit (should fail)
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("submit".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+    println!("  Submit result: {}", result.message().unwrap_or(""));
+    println!("  ✅ State machine integration works!\n");
+}
+
+// Pattern 2: Event-driven architecture
+async fn event_driven_example() {
+    println!("📡 Pattern 2: Event-Driven Architecture");
+
+    #[derive(Debug, Clone)]
+    enum FormEvent {
+        FieldChanged { field: usize, old_value: String, new_value: String },
+        ValidationTriggered { field: usize, is_valid: bool },
+        ActionExecuted { action: String, success: bool },
+    }
+
+    #[derive(Debug)]
+    struct EventDrivenForm {
+        current_field: usize,
+        cursor_pos: usize,
+        email: String,
+        has_changes: bool,
+        events: Vec<FormEvent>,
+    }
+
+    impl EventDrivenForm {
+        fn new() -> Self {
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                email: String::new(),
+                has_changes: false,
+                events: Vec::new(),
+            }
+        }
+
+        fn emit_event(&mut self, event: FormEvent) {
+            println!("  📡 Event: {:?}", event);
+            self.events.push(event);
+        }
+
+        fn validate_email(&self) -> bool {
+            self.email.contains('@') && self.email.contains('.')
+        }
+    }
+
+    impl CanvasState for EventDrivenForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index; }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str { &self.email }
+        fn get_current_input_mut(&mut self) -> &mut String { &mut self.email }
+        fn inputs(&self) -> Vec<&String> { vec![&self.email] }
+        fn fields(&self) -> Vec<&str> { vec!["Email"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+
+        fn set_has_unsaved_changes(&mut self, changed: bool) { 
+            if changed != self.has_changes {
+                let old_value = if self.has_changes { "modified" } else { "unmodified" };
+                let new_value = if changed { "modified" } else { "unmodified" };
+                
+                self.emit_event(FormEvent::FieldChanged {
+                    field: self.current_field,
+                    old_value: old_value.to_string(),
+                    new_value: new_value.to_string(),
+                });
+            }
+            self.has_changes = changed;
+        }
+
+        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+            match action {
+                CanvasAction::Custom(cmd) => match cmd.as_str() {
+                    "validate" => {
+                        let is_valid = self.validate_email();
+                        self.emit_event(FormEvent::ValidationTriggered {
+                            field: self.current_field,
+                            is_valid,
+                        });
+                        
+                        self.emit_event(FormEvent::ActionExecuted {
+                            action: "validate".to_string(),
+                            success: true,
+                        });
+
+                        if is_valid {
+                            Some("Email is valid!".to_string())
+                        } else {
+                            Some("Email is invalid".to_string())
+                        }
+                    }
+                    _ => None,
+                },
+                _ => None,
+            }
+        }
+    }
+
+    let mut form = EventDrivenForm::new();
+    let mut ideal_cursor = 0;
+
+    // Type an email address
+    let email = "user@example.com";
+    for c in email.chars() {
+        ActionDispatcher::dispatch(
+            CanvasAction::InsertChar(c),
+            &mut form,
+            &mut ideal_cursor,
+        ).await.unwrap();
+    }
+
+    // Validate the email
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("validate".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+
+    println!("  Final email: {}", form.email);
+    println!("  Validation result: {}", result.message().unwrap_or(""));
+    println!("  Total events captured: {}", form.events.len());
+    println!("  ✅ Event-driven architecture works!\n");
+}
+
+// Pattern 3: Validation pipeline
+async fn validation_pipeline_example() {
+    println!("✅ Pattern 3: Validation Pipeline");
+
+    type ValidationRule = Box<dyn Fn(&str) -> Result<(), String>>;
+
+    #[derive(Debug)]
+    struct ValidatedForm {
+        current_field: usize,
+        cursor_pos: usize,
+        password: String,
+        has_changes: bool,
+        validators: HashMap<usize, Vec<ValidationRule>>,
+    }
+
+    impl ValidatedForm {
+        fn new() -> Self {
+            let mut validators: HashMap<usize, Vec<ValidationRule>> = HashMap::new();
+            
+            // Password validators
+            let mut password_validators: Vec<ValidationRule> = Vec::new();
+            password_validators.push(Box::new(|value| {
+                if value.len() < 8 {
+                    Err("Password must be at least 8 characters".to_string())
+                } else {
+                    Ok(())
+                }
+            }));
+            password_validators.push(Box::new(|value| {
+                if !value.chars().any(|c| c.is_uppercase()) {
+                    Err("Password must contain at least one uppercase letter".to_string())
+                } else {
+                    Ok(())
+                }
+            }));
+            password_validators.push(Box::new(|value| {
+                if !value.chars().any(|c| c.is_numeric()) {
+                    Err("Password must contain at least one number".to_string())
+                } else {
+                    Ok(())
+                }
+            }));
+            
+            validators.insert(0, password_validators);
+
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                password: String::new(),
+                has_changes: false,
+                validators,
+            }
+        }
+
+        fn validate_field(&self, field_index: usize) -> Vec<String> {
+            let mut errors = Vec::new();
+            
+            if let Some(validators) = self.validators.get(&field_index) {
+                let value = match field_index {
+                    0 => &self.password,
+                    _ => return errors,
+                };
+
+                for validator in validators {
+                    if let Err(error) = validator(value) {
+                        errors.push(error);
+                    }
+                }
+            }
+            
+            errors
+        }
+    }
+
+    impl CanvasState for ValidatedForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index; }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str { &self.password }
+        fn get_current_input_mut(&mut self) -> &mut String { &mut self.password }
+        fn inputs(&self) -> Vec<&String> { vec![&self.password] }
+        fn fields(&self) -> Vec<&str> { vec!["Password"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+
+        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+            match action {
+                CanvasAction::Custom(cmd) => match cmd.as_str() {
+                    "validate" => {
+                        let errors = self.validate_field(self.current_field);
+                        if errors.is_empty() {
+                            Some("Password meets all requirements!".to_string())
+                        } else {
+                            Some(format!("Validation errors: {}", errors.join(", ")))
+                        }
+                    }
+                    _ => None,
+                },
+                _ => None,
+            }
+        }
+    }
+
+    let mut form = ValidatedForm::new();
+    let mut ideal_cursor = 0;
+
+    // Test with weak password
+    let weak_password = "abc";
+    for c in weak_password.chars() {
+        ActionDispatcher::dispatch(
+            CanvasAction::InsertChar(c),
+            &mut form,
+            &mut ideal_cursor,
+        ).await.unwrap();
+    }
+
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("validate".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+    println!("  Weak password '{}': {}", form.password, result.message().unwrap_or(""));
+
+    // Clear and test with strong password
+    form.password.clear();
+    form.cursor_pos = 0;
+    
+    let strong_password = "StrongPass123";
+    for c in strong_password.chars() {
+        ActionDispatcher::dispatch(
+            CanvasAction::InsertChar(c),
+            &mut form,
+            &mut ideal_cursor,
+        ).await.unwrap();
+    }
+
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("validate".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+    println!("  Strong password '{}': {}", form.password, result.message().unwrap_or(""));
+    println!("  ✅ Validation pipeline works!\n");
+}
+
+// Pattern 4: Multi-form orchestration
+async fn multi_form_example() {
+    println!("🎭 Pattern 4: Multi-Form Orchestration");
+
+    #[derive(Debug)]
+    struct PersonalInfoForm {
+        current_field: usize,
+        cursor_pos: usize,
+        name: String,
+        age: String,
+        has_changes: bool,
+    }
+
+    #[derive(Debug)]
+    struct ContactInfoForm {
+        current_field: usize,
+        cursor_pos: usize,
+        email: String,
+        phone: String,
+        has_changes: bool,
+    }
+
+    // Implement CanvasState for both forms
+    impl CanvasState for PersonalInfoForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index.min(1); }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str {
+            match self.current_field {
+                0 => &self.name,
+                1 => &self.age,
+                _ => "",
+            }
+        }
+
+        fn get_current_input_mut(&mut self) -> &mut String {
+            match self.current_field {
+                0 => &mut self.name,
+                1 => &mut self.age,
+                _ => unreachable!(),
+            }
+        }
+
+        fn inputs(&self) -> Vec<&String> { vec![&self.name, &self.age] }
+        fn fields(&self) -> Vec<&str> { vec!["Name", "Age"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+    }
+
+    impl CanvasState for ContactInfoForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index.min(1); }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str {
+            match self.current_field {
+                0 => &self.email,
+                1 => &self.phone,
+                _ => "",
+            }
+        }
+
+        fn get_current_input_mut(&mut self) -> &mut String {
+            match self.current_field {
+                0 => &mut self.email,
+                1 => &mut self.phone,
+                _ => unreachable!(),
+            }
+        }
+
+        fn inputs(&self) -> Vec<&String> { vec![&self.email, &self.phone] }
+        fn fields(&self) -> Vec<&str> { vec!["Email", "Phone"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+    }
+
+    // Form orchestrator
+    #[derive(Debug)]
+    struct FormOrchestrator {
+        personal_form: PersonalInfoForm,
+        contact_form: ContactInfoForm,
+        current_form: usize, // 0 = personal, 1 = contact
+    }
+
+    impl FormOrchestrator {
+        fn new() -> Self {
+            Self {
+                personal_form: PersonalInfoForm {
+                    current_field: 0,
+                    cursor_pos: 0,
+                    name: String::new(),
+                    age: String::new(),
+                    has_changes: false,
+                },
+                contact_form: ContactInfoForm {
+                    current_field: 0,
+                    cursor_pos: 0,
+                    email: String::new(),
+                    phone: String::new(),
+                    has_changes: false,
+                },
+                current_form: 0,
+            }
+        }
+
+        async fn execute_action(&mut self, action: CanvasAction) -> ActionResult {
+            let mut ideal_cursor = 0;
+            
+            match self.current_form {
+                0 => ActionDispatcher::dispatch(action, &mut self.personal_form, &mut ideal_cursor).await.unwrap(),
+                1 => ActionDispatcher::dispatch(action, &mut self.contact_form, &mut ideal_cursor).await.unwrap(),
+                _ => ActionResult::error("Invalid form index"),
+            }
+        }
+
+        fn switch_form(&mut self) -> String {
+            self.current_form = (self.current_form + 1) % 2;
+            match self.current_form {
+                0 => "Switched to Personal Info form".to_string(),
+                1 => "Switched to Contact Info form".to_string(),
+                _ => "Unknown form".to_string(),
+            }
+        }
+
+        fn current_form_name(&self) -> &str {
+            match self.current_form {
+                0 => "Personal Info",
+                1 => "Contact Info",
+                _ => "Unknown",
+            }
+        }
+    }
+
+    let mut orchestrator = FormOrchestrator::new();
+
+    println!("  Current form: {}", orchestrator.current_form_name());
+
+    // Fill personal info
+    let personal_data = vec![
+        ('J', 'o', 'h', 'n'),
+    ];
+    
+    for &c in &['J', 'o', 'h', 'n'] {
+        orchestrator.execute_action(CanvasAction::InsertChar(c)).await;
+    }
+
+    orchestrator.execute_action(CanvasAction::NextField).await;
+    
+    for &c in &['2', '5'] {
+        orchestrator.execute_action(CanvasAction::InsertChar(c)).await;
+    }
+
+    println!("  Personal form - Name: '{}', Age: '{}'", 
+             orchestrator.personal_form.name, 
+             orchestrator.personal_form.age);
+
+    // Switch to contact form
+    let switch_msg = orchestrator.switch_form();
+    println!("  {}", switch_msg);
+
+    // Fill contact info
+    for &c in &['j', 'o', 'h', 'n', '@', 'e', 'x', 'a', 'm', 'p', 'l', 'e', '.', 'c', 'o', 'm'] {
+        orchestrator.execute_action(CanvasAction::InsertChar(c)).await;
+    }
+
+    orchestrator.execute_action(CanvasAction::NextField).await;
+    
+    for &c in &['5', '5', '5', '-', '1', '2', '3', '4'] {
+        orchestrator.execute_action(CanvasAction::InsertChar(c)).await;
+    }
+
+    println!("  Contact form - Email: '{}', Phone: '{}'", 
+             orchestrator.contact_form.email, 
+             orchestrator.contact_form.phone);
+
+    println!("  ✅ Multi-form orchestration works!\n");
+
+    println!("🎉 All integration patterns completed!");
+    println!("The Canvas crate seamlessly integrates with various architectural patterns!");
+}

canvas/examples/simple_login.rs

@@ -0,0 +1,354 @@
+// examples/simple_login.rs
+//! A simple login form demonstrating basic canvas usage
+//!
+//! Run with: cargo run --example simple_login
+
+use canvas::prelude::*;
+use crossterm::{
+    event::{self, Event, KeyCode, KeyEvent, KeyModifiers},
+    terminal::{disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen},
+    ExecutableCommand,
+};
+use std::io::{self, Write};
+
+#[derive(Debug)]
+struct LoginForm {
+    current_field: usize,
+    cursor_pos: usize,
+    username: String,
+    password: String,
+    has_changes: bool,
+}
+
+impl LoginForm {
+    fn new() -> Self {
+        Self {
+            current_field: 0,
+            cursor_pos: 0,
+            username: String::new(),
+            password: String::new(),
+            has_changes: false,
+        }
+    }
+
+    fn reset(&mut self) {
+        self.username.clear();
+        self.password.clear();
+        self.current_field = 0;
+        self.cursor_pos = 0;
+        self.has_changes = false;
+    }
+
+    fn is_valid(&self) -> bool {
+        !self.username.trim().is_empty() && !self.password.trim().is_empty()
+    }
+}
+
+impl CanvasState for LoginForm {
+    fn current_field(&self) -> usize {
+        self.current_field
+    }
+
+    fn current_cursor_pos(&self) -> usize {
+        self.cursor_pos
+    }
+
+    fn set_current_field(&mut self, index: usize) {
+        self.current_field = index.min(1); // Only 2 fields: username(0), password(1)
+    }
+
+    fn set_current_cursor_pos(&mut self, pos: usize) {
+        self.cursor_pos = pos;
+    }
+
+    fn get_current_input(&self) -> &str {
+        match self.current_field {
+            0 => &self.username,
+            1 => &self.password,
+            _ => "",
+        }
+    }
+
+    fn get_current_input_mut(&mut self) -> &mut String {
+        match self.current_field {
+            0 => &mut self.username,
+            1 => &mut self.password,
+            _ => unreachable!(),
+        }
+    }
+
+    fn inputs(&self) -> Vec<&String> {
+        vec![&self.username, &self.password]
+    }
+
+    fn fields(&self) -> Vec<&str> {
+        vec!["Username", "Password"]
+    }
+
+    fn has_unsaved_changes(&self) -> bool {
+        self.has_changes
+    }
+
+    fn set_has_unsaved_changes(&mut self, changed: bool) {
+        self.has_changes = changed;
+    }
+
+    // Custom action handling
+    fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+        match action {
+            CanvasAction::Custom(cmd) => match cmd.as_str() {
+                "submit" => {
+                    if self.is_valid() {
+                        Some(format!("Login successful! Welcome, {}", self.username))
+                    } else {
+                        Some("Error: Username and password are required".to_string())
+                    }
+                }
+                "clear" => {
+                    self.reset();
+                    Some("Form cleared".to_string())
+                }
+                _ => None,
+            },
+            _ => None,
+        }
+    }
+
+    // Override display for password field
+    fn get_display_value_for_field(&self, index: usize) -> &str {
+        match index {
+            0 => &self.username, // Username shows normally
+            1 => &self.password, // We'll handle masking in the UI drawing
+            _ => "",
+        }
+    }
+
+    fn has_display_override(&self, index: usize) -> bool {
+        index == 1 // Password field has display override
+    }
+}
+
+fn draw_ui(form: &LoginForm, message: &str) -> io::Result<()> {
+    // Clear screen and move cursor to top-left
+    print!("\x1B[2J\x1B[1;1H");
+
+    println!("╔═══════════════════════════════════════╗");
+    println!("║              LOGIN FORM               ║");
+    println!("╠═══════════════════════════════════════╣");
+
+    // Username field
+    let username_indicator = if form.current_field == 0 { "→" } else { " " };
+    let username_display = if form.username.is_empty() {
+        "<enter username>".to_string()
+    } else {
+        form.username.clone()
+    };
+    println!("║ {} Username: {:22} ║", username_indicator, 
+             if username_display.len() > 22 { 
+                 format!("{}...", &username_display[..19])
+             } else { 
+                 format!("{:22}", username_display) 
+             });
+
+    // Show cursor for username field
+    if form.current_field == 0 && !form.username.is_empty() {
+        let cursor_pos = form.cursor_pos.min(form.username.len());
+        let spaces_before = 11 + cursor_pos; // "Username: " = 10 chars + 1 space
+        let cursor_line = format!("║   {}█{:width$}║", 
+            " ".repeat(spaces_before), 
+            "",
+            width = 25_usize.saturating_sub(spaces_before)
+        );
+        println!("{}", cursor_line);
+    } else {
+        println!("║{:37}║", "");
+    }
+
+    // Password field
+    let password_indicator = if form.current_field == 1 { "→" } else { " " };
+    let password_display = if form.password.is_empty() {
+        "<enter password>".to_string()
+    } else {
+        "*".repeat(form.password.len())
+    };
+    println!("║ {} Password: {:22} ║", password_indicator, 
+             if password_display.len() > 22 { 
+                 format!("{}...", &password_display[..19])
+             } else { 
+                 format!("{:22}", password_display) 
+             });
+
+    // Show cursor for password field
+    if form.current_field == 1 && !form.password.is_empty() {
+        let cursor_pos = form.cursor_pos.min(form.password.len());
+        let spaces_before = 11 + cursor_pos; // "Password: " = 10 chars + 1 space
+        let cursor_line = format!("║   {}█{:width$}║", 
+            " ".repeat(spaces_before), 
+            "",
+            width = 25_usize.saturating_sub(spaces_before)
+        );
+        println!("{}", cursor_line);
+    } else {
+        println!("║{:37}║", "");
+    }
+
+    println!("╠═══════════════════════════════════════╣");
+    println!("║ CONTROLS:                             ║");
+    println!("║   Tab/↑↓    - Navigate fields         ║");
+    println!("║   Enter     - Submit form             ║");
+    println!("║   Ctrl+R    - Clear form              ║");
+    println!("║   Ctrl+C    - Exit                    ║");
+    println!("╠═══════════════════════════════════════╣");
+
+    // Status message
+    let status = if !message.is_empty() {
+        message.to_string()
+    } else if form.has_changes {
+        "Form modified".to_string()
+    } else {
+        "Ready - enter your credentials".to_string()
+    };
+
+    let status_display = if status.len() > 33 {
+        format!("{}...", &status[..30])
+    } else {
+        format!("{:33}", status)
+    };
+
+    println!("║ Status: {} ║", status_display);
+    println!("╚═══════════════════════════════════════╝");
+
+    // Show current state info
+    println!();
+    println!("Current field: {} ({})", 
+             form.current_field, 
+             form.fields()[form.current_field]);
+    println!("Cursor position: {}", form.cursor_pos);
+    println!("Has changes: {}", form.has_changes);
+
+    io::stdout().flush()?;
+    Ok(())
+}
+
+#[tokio::main]
+async fn main() -> io::Result<()> {
+    println!("Starting Canvas Login Demo...");
+    println!("Setting up terminal...");
+
+    // Setup terminal
+    enable_raw_mode()?;
+    io::stdout().execute(EnterAlternateScreen)?;
+
+    let mut form = LoginForm::new();
+    let mut ideal_cursor = 0;
+    let mut message = String::new();
+
+    // Initial draw
+    if let Err(e) = draw_ui(&form, &message) {
+        // Cleanup on error
+        let _ = disable_raw_mode();
+        let _ = io::stdout().execute(LeaveAlternateScreen);
+        return Err(e);
+    }
+
+    println!("Canvas Login Demo started. Use Ctrl+C to exit.");
+
+    loop {
+        match event::read() {
+            Ok(Event::Key(key)) => {
+                // Clear message after key press
+                if !message.is_empty() {
+                    message.clear();
+                }
+
+                match key {
+                    // Exit
+                    KeyEvent { code: KeyCode::Char('c'), modifiers: KeyModifiers::CONTROL, .. } => {
+                        break;
+                    }
+
+                    // Clear form
+                    KeyEvent { code: KeyCode::Char('r'), modifiers: KeyModifiers::CONTROL, .. } => {
+                        match ActionDispatcher::dispatch(
+                            CanvasAction::Custom("clear".to_string()),
+                            &mut form,
+                            &mut ideal_cursor,
+                        ).await {
+                            Ok(result) => {
+                                if let Some(msg) = result.message() {
+                                    message = msg.to_string();
+                                }
+                            }
+                            Err(e) => {
+                                message = format!("Error: {}", e);
+                            }
+                        }
+                    }
+
+                    // Submit form
+                    KeyEvent { code: KeyCode::Enter, .. } => {
+                        match ActionDispatcher::dispatch(
+                            CanvasAction::Custom("submit".to_string()),
+                            &mut form,
+                            &mut ideal_cursor,
+                        ).await {
+                            Ok(result) => {
+                                if let Some(msg) = result.message() {
+                                    message = msg.to_string();
+                                }
+                            }
+                            Err(e) => {
+                                message = format!("Error: {}", e);
+                            }
+                        }
+                    }
+
+                    // Regular key handling - let canvas handle it!
+                    _ => {
+                        if let Some(action) = CanvasAction::from_key(key.code) {
+                            match ActionDispatcher::dispatch(action, &mut form, &mut ideal_cursor).await {
+                                Ok(result) => {
+                                    if !result.is_success() {
+                                        if let Some(msg) = result.message() {
+                                            message = format!("Error: {}", msg);
+                                        }
+                                    }
+                                }
+                                Err(e) => {
+                                    message = format!("Error: {}", e);
+                                }
+                            }
+                        }
+                    }
+                }
+
+                // Redraw UI
+                if let Err(e) = draw_ui(&form, &message) {
+                    eprintln!("Error drawing UI: {}", e);
+                    break;
+                }
+            }
+            Ok(_) => {
+                // Ignore other events (mouse, resize, etc.)
+            }
+            Err(e) => {
+                message = format!("Event error: {}", e);
+                if let Err(_) = draw_ui(&form, &message) {
+                    break;
+                }
+            }
+        }
+    }
+
+    // Cleanup
+    disable_raw_mode()?;
+    io::stdout().execute(LeaveAlternateScreen)?;
+
+    println!("Thanks for using Canvas Login Demo!");
+    println!("Final form state:");
+    println!("  Username: '{}'", form.username);
+    println!("  Password: '{}'", "*".repeat(form.password.len()));
+    println!("  Valid: {}", form.is_valid());
+
+    Ok(())
+}

canvas/integration_patterns.rs

@@ -0,0 +1,620 @@
+// examples/integration_patterns.rs
+//! Advanced integration patterns showing how Canvas works with:
+//! - State management patterns
+//! - Event-driven architectures
+//! - Validation systems
+//! - Custom rendering
+//!
+//! Run with: cargo run --example integration_patterns
+
+use canvas::prelude::*;
+use std::collections::HashMap;
+
+#[tokio::main]
+async fn main() {
+    println!("🔧 Canvas Integration Patterns");
+    println!("==============================\n");
+
+    // Pattern 1: State machine integration
+    state_machine_example().await;
+
+    // Pattern 2: Event-driven architecture
+    event_driven_example().await;
+
+    // Pattern 3: Validation pipeline
+    validation_pipeline_example().await;
+
+    // Pattern 4: Multi-form orchestration
+    multi_form_example().await;
+}
+
+// Pattern 1: Canvas with state machine
+async fn state_machine_example() {
+    println!("🔄 Pattern 1: State Machine Integration");
+
+    #[derive(Debug, Clone, PartialEq)]
+    enum FormState {
+        Initial,
+        Editing,
+        Validating,
+        Submitting,
+        Success,
+        Error(String),
+    }
+
+    #[derive(Debug)]
+    struct StateMachineForm {
+        // Canvas state
+        current_field: usize,
+        cursor_pos: usize,
+        username: String,
+        password: String,
+        has_changes: bool,
+
+        // State machine
+        state: FormState,
+    }
+
+    impl StateMachineForm {
+        fn new() -> Self {
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                username: String::new(),
+                password: String::new(),
+                has_changes: false,
+                state: FormState::Initial,
+            }
+        }
+
+        fn transition_to(&mut self, new_state: FormState) -> String {
+            let old_state = self.state.clone();
+            self.state = new_state;
+            format!("State transition: {:?} -> {:?}", old_state, self.state)
+        }
+
+        fn can_submit(&self) -> bool {
+            matches!(self.state, FormState::Editing) &&
+            !self.username.trim().is_empty() &&
+            !self.password.trim().is_empty()
+        }
+    }
+
+    impl CanvasState for StateMachineForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index.min(1); }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str {
+            match self.current_field {
+                0 => &self.username,
+                1 => &self.password,
+                _ => "",
+            }
+        }
+
+        fn get_current_input_mut(&mut self) -> &mut String {
+            match self.current_field {
+                0 => &mut self.username,
+                1 => &mut self.password,
+                _ => unreachable!(),
+            }
+        }
+
+        fn inputs(&self) -> Vec<&String> { vec![&self.username, &self.password] }
+        fn fields(&self) -> Vec<&str> { vec!["Username", "Password"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+
+        fn set_has_unsaved_changes(&mut self, changed: bool) {
+            self.has_changes = changed;
+            // Transition to editing state when user starts typing
+            if changed && self.state == FormState::Initial {
+                self.state = FormState::Editing;
+            }
+        }
+
+        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+            match action {
+                CanvasAction::Custom(cmd) => match cmd.as_str() {
+                    "submit" => {
+                        if self.can_submit() {
+                            let msg = self.transition_to(FormState::Submitting);
+                            // Simulate submission
+                            self.state = FormState::Success;
+                            Some(format!("{} -> Form submitted successfully", msg))
+                        } else {
+                            let msg = self.transition_to(FormState::Error("Invalid form data".to_string()));
+                            Some(msg)
+                        }
+                    }
+                    "reset" => {
+                        self.username.clear();
+                        self.password.clear();
+                        self.has_changes = false;
+                        Some(self.transition_to(FormState::Initial))
+                    }
+                    _ => None,
+                },
+                _ => None,
+            }
+        }
+    }
+
+    let mut form = StateMachineForm::new();
+    let mut ideal_cursor = 0;
+
+    println!("  Initial state: {:?}", form.state);
+
+    // Type some text to trigger state change
+    let _result = ActionDispatcher::dispatch(
+        CanvasAction::InsertChar('u'),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+    println!("  After typing: {:?}", form.state);
+
+    // Try to submit (should fail)
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("submit".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+    println!("  Submit result: {}", result.message().unwrap_or(""));
+    println!("  ✅ State machine integration works!\n");
+}
+
+// Pattern 2: Event-driven architecture
+async fn event_driven_example() {
+    println!("📡 Pattern 2: Event-Driven Architecture");
+
+    #[derive(Debug, Clone)]
+    enum FormEvent {
+        FieldChanged { field: usize, old_value: String, new_value: String },
+        ValidationTriggered { field: usize, is_valid: bool },
+        ActionExecuted { action: String, success: bool },
+    }
+
+    #[derive(Debug)]
+    struct EventDrivenForm {
+        current_field: usize,
+        cursor_pos: usize,
+        email: String,
+        has_changes: bool,
+        events: Vec<FormEvent>,
+    }
+
+    impl EventDrivenForm {
+        fn new() -> Self {
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                email: String::new(),
+                has_changes: false,
+                events: Vec::new(),
+            }
+        }
+
+        fn emit_event(&mut self, event: FormEvent) {
+            println!("  📡 Event: {:?}", event);
+            self.events.push(event);
+        }
+
+        fn validate_email(&self) -> bool {
+            self.email.contains('@') && self.email.contains('.')
+        }
+    }
+
+    impl CanvasState for EventDrivenForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index; }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str { &self.email }
+        fn get_current_input_mut(&mut self) -> &mut String { &mut self.email }
+        fn inputs(&self) -> Vec<&String> { vec![&self.email] }
+        fn fields(&self) -> Vec<&str> { vec!["Email"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+
+        fn set_has_unsaved_changes(&mut self, changed: bool) {
+            if changed != self.has_changes {
+                let old_value = if self.has_changes { "modified" } else { "unmodified" };
+                let new_value = if changed { "modified" } else { "unmodified" };
+
+                self.emit_event(FormEvent::FieldChanged {
+                    field: self.current_field,
+                    old_value: old_value.to_string(),
+                    new_value: new_value.to_string(),
+                });
+            }
+            self.has_changes = changed;
+        }
+
+        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+            match action {
+                CanvasAction::Custom(cmd) => match cmd.as_str() {
+                    "validate" => {
+                        let is_valid = self.validate_email();
+                        self.emit_event(FormEvent::ValidationTriggered {
+                            field: self.current_field,
+                            is_valid,
+                        });
+
+                        self.emit_event(FormEvent::ActionExecuted {
+                            action: "validate".to_string(),
+                            success: true,
+                        });
+
+                        if is_valid {
+                            Some("Email is valid!".to_string())
+                        } else {
+                            Some("Email is invalid".to_string())
+                        }
+                    }
+                    _ => None,
+                },
+                _ => None,
+            }
+        }
+    }
+
+    let mut form = EventDrivenForm::new();
+    let mut ideal_cursor = 0;
+
+    // Type an email address
+    let email = "user@example.com";
+    for c in email.chars() {
+        ActionDispatcher::dispatch(
+            CanvasAction::InsertChar(c),
+            &mut form,
+            &mut ideal_cursor,
+        ).await.unwrap();
+    }
+
+    // Validate the email
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("validate".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+
+    println!("  Final email: {}", form.email);
+    println!("  Validation result: {}", result.message().unwrap_or(""));
+    println!("  Total events captured: {}", form.events.len());
+    println!("  ✅ Event-driven architecture works!\n");
+}
+
+// Pattern 3: Validation pipeline
+async fn validation_pipeline_example() {
+    println!("✅ Pattern 3: Validation Pipeline");
+
+    type ValidationRule = Box<dyn Fn(&str) -> Result<(), String>>;
+
+    // Custom Debug implementation since function pointers don't implement Debug
+    struct ValidatedForm {
+        current_field: usize,
+        cursor_pos: usize,
+        password: String,
+        has_changes: bool,
+        validators: HashMap<usize, Vec<ValidationRule>>,
+    }
+
+    impl std::fmt::Debug for ValidatedForm {
+        fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+            f.debug_struct("ValidatedForm")
+                .field("current_field", &self.current_field)
+                .field("cursor_pos", &self.cursor_pos)
+                .field("password", &self.password)
+                .field("has_changes", &self.has_changes)
+                .field("validators", &format!("HashMap with {} entries", self.validators.len()))
+                .finish()
+        }
+    }
+
+    impl ValidatedForm {
+        fn new() -> Self {
+            let mut validators: HashMap<usize, Vec<ValidationRule>> = HashMap::new();
+
+            // Password validators
+            let mut password_validators: Vec<ValidationRule> = Vec::new();
+            password_validators.push(Box::new(|value| {
+                if value.len() < 8 {
+                    Err("Password must be at least 8 characters".to_string())
+                } else {
+                    Ok(())
+                }
+            }));
+            password_validators.push(Box::new(|value| {
+                if !value.chars().any(|c| c.is_uppercase()) {
+                    Err("Password must contain at least one uppercase letter".to_string())
+                } else {
+                    Ok(())
+                }
+            }));
+            password_validators.push(Box::new(|value| {
+                if !value.chars().any(|c| c.is_numeric()) {
+                    Err("Password must contain at least one number".to_string())
+                } else {
+                    Ok(())
+                }
+            }));
+
+            validators.insert(0, password_validators);
+
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                password: String::new(),
+                has_changes: false,
+                validators,
+            }
+        }
+
+        fn validate_field(&self, field_index: usize) -> Vec<String> {
+            let mut errors = Vec::new();
+
+            if let Some(validators) = self.validators.get(&field_index) {
+                let value = match field_index {
+                    0 => &self.password,
+                    _ => return errors,
+                };
+
+                for validator in validators {
+                    if let Err(error) = validator(value) {
+                        errors.push(error);
+                    }
+                }
+            }
+
+            errors
+        }
+    }
+
+    impl CanvasState for ValidatedForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index; }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str { &self.password }
+        fn get_current_input_mut(&mut self) -> &mut String { &mut self.password }
+        fn inputs(&self) -> Vec<&String> { vec![&self.password] }
+        fn fields(&self) -> Vec<&str> { vec!["Password"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+
+        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+            match action {
+                CanvasAction::Custom(cmd) => match cmd.as_str() {
+                    "validate" => {
+                        let errors = self.validate_field(self.current_field);
+                        if errors.is_empty() {
+                            Some("Password meets all requirements!".to_string())
+                        } else {
+                            Some(format!("Validation errors: {}", errors.join(", ")))
+                        }
+                    }
+                    _ => None,
+                },
+                _ => None,
+            }
+        }
+    }
+
+    let mut form = ValidatedForm::new();
+    let mut ideal_cursor = 0;
+
+    // Test with weak password
+    let weak_password = "abc";
+    for c in weak_password.chars() {
+        ActionDispatcher::dispatch(
+            CanvasAction::InsertChar(c),
+            &mut form,
+            &mut ideal_cursor,
+        ).await.unwrap();
+    }
+
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("validate".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+    println!("  Weak password '{}': {}", form.password, result.message().unwrap_or(""));
+
+    // Clear and test with strong password
+    form.password.clear();
+    form.cursor_pos = 0;
+
+    let strong_password = "StrongPass123";
+    for c in strong_password.chars() {
+        ActionDispatcher::dispatch(
+            CanvasAction::InsertChar(c),
+            &mut form,
+            &mut ideal_cursor,
+        ).await.unwrap();
+    }
+
+    let result = ActionDispatcher::dispatch(
+        CanvasAction::Custom("validate".to_string()),
+        &mut form,
+        &mut ideal_cursor,
+    ).await.unwrap();
+    println!("  Strong password '{}': {}", form.password, result.message().unwrap_or(""));
+    println!("  ✅ Validation pipeline works!\n");
+}
+
+// Pattern 4: Multi-form orchestration
+async fn multi_form_example() {
+    println!("🎭 Pattern 4: Multi-Form Orchestration");
+
+    #[derive(Debug)]
+    struct PersonalInfoForm {
+        current_field: usize,
+        cursor_pos: usize,
+        name: String,
+        age: String,
+        has_changes: bool,
+    }
+
+    #[derive(Debug)]
+    struct ContactInfoForm {
+        current_field: usize,
+        cursor_pos: usize,
+        email: String,
+        phone: String,
+        has_changes: bool,
+    }
+
+    // Implement CanvasState for both forms
+    impl CanvasState for PersonalInfoForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index.min(1); }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str {
+            match self.current_field {
+                0 => &self.name,
+                1 => &self.age,
+                _ => "",
+            }
+        }
+
+        fn get_current_input_mut(&mut self) -> &mut String {
+            match self.current_field {
+                0 => &mut self.name,
+                1 => &mut self.age,
+                _ => unreachable!(),
+            }
+        }
+
+        fn inputs(&self) -> Vec<&String> { vec![&self.name, &self.age] }
+        fn fields(&self) -> Vec<&str> { vec!["Name", "Age"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+    }
+
+    impl CanvasState for ContactInfoForm {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index.min(1); }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str {
+            match self.current_field {
+                0 => &self.email,
+                1 => &self.phone,
+                _ => "",
+            }
+        }
+
+        fn get_current_input_mut(&mut self) -> &mut String {
+            match self.current_field {
+                0 => &mut self.email,
+                1 => &mut self.phone,
+                _ => unreachable!(),
+            }
+        }
+
+        fn inputs(&self) -> Vec<&String> { vec![&self.email, &self.phone] }
+        fn fields(&self) -> Vec<&str> { vec!["Email", "Phone"] }
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+    }
+
+    // Form orchestrator
+    #[derive(Debug)]
+    struct FormOrchestrator {
+        personal_form: PersonalInfoForm,
+        contact_form: ContactInfoForm,
+        current_form: usize, // 0 = personal, 1 = contact
+    }
+
+    impl FormOrchestrator {
+        fn new() -> Self {
+            Self {
+                personal_form: PersonalInfoForm {
+                    current_field: 0,
+                    cursor_pos: 0,
+                    name: String::new(),
+                    age: String::new(),
+                    has_changes: false,
+                },
+                contact_form: ContactInfoForm {
+                    current_field: 0,
+                    cursor_pos: 0,
+                    email: String::new(),
+                    phone: String::new(),
+                    has_changes: false,
+                },
+                current_form: 0,
+            }
+        }
+
+        async fn execute_action(&mut self, action: CanvasAction) -> ActionResult {
+            let mut ideal_cursor = 0;
+
+            match self.current_form {
+                0 => ActionDispatcher::dispatch(action, &mut self.personal_form, &mut ideal_cursor).await.unwrap(),
+                1 => ActionDispatcher::dispatch(action, &mut self.contact_form, &mut ideal_cursor).await.unwrap(),
+                _ => ActionResult::error("Invalid form index"),
+            }
+        }
+
+        fn switch_form(&mut self) -> String {
+            self.current_form = (self.current_form + 1) % 2;
+            match self.current_form {
+                0 => "Switched to Personal Info form".to_string(),
+                1 => "Switched to Contact Info form".to_string(),
+                _ => "Unknown form".to_string(),
+            }
+        }
+
+        fn current_form_name(&self) -> &str {
+            match self.current_form {
+                0 => "Personal Info",
+                1 => "Contact Info",
+                _ => "Unknown",
+            }
+        }
+    }
+
+    let mut orchestrator = FormOrchestrator::new();
+
+    println!("  Current form: {}", orchestrator.current_form_name());
+
+    // Fill personal info
+    for &c in &['J', 'o', 'h', 'n'] {
+        orchestrator.execute_action(CanvasAction::InsertChar(c)).await;
+    }
+
+    orchestrator.execute_action(CanvasAction::NextField).await;
+
+    for &c in &['2', '5'] {
+        orchestrator.execute_action(CanvasAction::InsertChar(c)).await;
+    }
+
+    println!("  Personal form - Name: '{}', Age: '{}'",
+             orchestrator.personal_form.name,
+             orchestrator.personal_form.age);
+
+    // Switch to contact form
+    let switch_msg = orchestrator.switch_form();
+    println!("  {}", switch_msg);
+
+    // Fill contact info
+    for &c in &['j', 'o', 'h', 'n', '@', 'e', 'x', 'a', 'm', 'p', 'l', 'e', '.', 'c', 'o', 'm'] {
+        orchestrator.execute_action(CanvasAction::InsertChar(c)).await;
+    }
+
+    orchestrator.execute_action(CanvasAction::NextField).await;
+
+    for &c in &['5', '5', '5', '-', '1', '2', '3', '4'] {
+        orchestrator.execute_action(CanvasAction::InsertChar(c)).await;
+    }
+
+    println!("  Contact form - Email: '{}', Phone: '{}'",
+             orchestrator.contact_form.email,
+             orchestrator.contact_form.phone);
+}

canvas/src/actions/edit.rs

@@ -0,0 +1,455 @@
+// canvas/src/actions/edit.rs
+
+use crate::state::{CanvasState, ActionContext};
+use crate::actions::types::{CanvasAction, ActionResult};
+use crossterm::event::{KeyCode, KeyEvent};
+use anyhow::Result;
+
+/// Execute a typed canvas action on any CanvasState implementation
+pub async fn execute_canvas_action<S: CanvasState>(
+    action: CanvasAction,
+    state: &mut S,
+    ideal_cursor_column: &mut usize,
+) -> Result<ActionResult> {
+    // 1. Try feature-specific handler first
+    let context = ActionContext {
+        key_code: None, // We don't need KeyCode anymore since action is typed
+        ideal_cursor_column: *ideal_cursor_column,
+        current_input: state.get_current_input().to_string(),
+        current_field: state.current_field(),
+    };
+
+    if let Some(result) = state.handle_feature_action(&action, &context) {
+        return Ok(ActionResult::HandledByFeature(result));
+    }
+
+    // 2. Handle suggestion actions
+    if let Some(result) = handle_suggestion_action(&action, state)? {
+        return Ok(result);
+    }
+
+    // 3. Handle generic canvas actions
+    handle_generic_canvas_action(action, state, ideal_cursor_column).await
+}
+
+/// Legacy function for string-based actions (backwards compatibility)
+pub async fn execute_edit_action<S: CanvasState>(
+    action: &str,
+    key: KeyEvent,
+    state: &mut S,
+    ideal_cursor_column: &mut usize,
+) -> Result<String> {
+    let typed_action = match action {
+        "insert_char" => {
+            if let KeyCode::Char(c) = key.code {
+                CanvasAction::InsertChar(c)
+            } else {
+                return Ok("Error: insert_char called without a char key.".to_string());
+            }
+        }
+        _ => CanvasAction::from_string(action),
+    };
+
+    let result = execute_canvas_action(typed_action, state, ideal_cursor_column).await?;
+    
+    // Convert ActionResult back to string for backwards compatibility
+    Ok(result.message().unwrap_or("").to_string())
+}
+
+/// Handle suggestion-related actions
+fn handle_suggestion_action<S: CanvasState>(
+    action: &CanvasAction,
+    state: &mut S,
+) -> Result<Option<ActionResult>> {
+    match action {
+        CanvasAction::SuggestionDown => {
+            if let Some(suggestions) = state.get_suggestions() {
+                if !suggestions.is_empty() {
+                    let current = state.get_selected_suggestion_index().unwrap_or(0);
+                    let next = (current + 1) % suggestions.len();
+                    state.set_selected_suggestion_index(Some(next));
+                    return Ok(Some(ActionResult::success()));
+                }
+            }
+            Ok(None)
+        }
+        
+        CanvasAction::SuggestionUp => {
+            if let Some(suggestions) = state.get_suggestions() {
+                if !suggestions.is_empty() {
+                    let current = state.get_selected_suggestion_index().unwrap_or(0);
+                    let prev = if current == 0 { suggestions.len() - 1 } else { current - 1 };
+                    state.set_selected_suggestion_index(Some(prev));
+                    return Ok(Some(ActionResult::success()));
+                }
+            }
+            Ok(None)
+        }
+        
+        CanvasAction::SelectSuggestion => {
+            // Let feature handle this via handle_feature_action since it's feature-specific
+            Ok(None)
+        }
+        
+        CanvasAction::ExitSuggestions => {
+            state.deactivate_suggestions();
+            Ok(Some(ActionResult::success()))
+        }
+        
+        _ => Ok(None),
+    }
+}
+
+/// Handle core canvas actions with full type safety
+async fn handle_generic_canvas_action<S: CanvasState>(
+    action: CanvasAction,
+    state: &mut S,
+    ideal_cursor_column: &mut usize,
+) -> Result<ActionResult> {
+    match action {
+        CanvasAction::InsertChar(c) => {
+            let cursor_pos = state.current_cursor_pos();
+            let field_value = state.get_current_input_mut();
+            let mut chars: Vec<char> = field_value.chars().collect();
+            
+            if cursor_pos <= chars.len() {
+                chars.insert(cursor_pos, c);
+                *field_value = chars.into_iter().collect();
+                state.set_current_cursor_pos(cursor_pos + 1);
+                state.set_has_unsaved_changes(true);
+                *ideal_cursor_column = state.current_cursor_pos();
+                Ok(ActionResult::success())
+            } else {
+                Ok(ActionResult::error("Invalid cursor position for character insertion"))
+            }
+        }
+
+        CanvasAction::DeleteBackward => {
+            if state.current_cursor_pos() > 0 {
+                let cursor_pos = state.current_cursor_pos();
+                let field_value = state.get_current_input_mut();
+                let mut chars: Vec<char> = field_value.chars().collect();
+                
+                if cursor_pos <= chars.len() {
+                    chars.remove(cursor_pos - 1);
+                    *field_value = chars.into_iter().collect();
+                    let new_pos = cursor_pos - 1;
+                    state.set_current_cursor_pos(new_pos);
+                    state.set_has_unsaved_changes(true);
+                    *ideal_cursor_column = new_pos;
+                }
+            }
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::DeleteForward => {
+            let cursor_pos = state.current_cursor_pos();
+            let field_value = state.get_current_input_mut();
+            let mut chars: Vec<char> = field_value.chars().collect();
+            
+            if cursor_pos < chars.len() {
+                chars.remove(cursor_pos);
+                *field_value = chars.into_iter().collect();
+                state.set_has_unsaved_changes(true);
+                *ideal_cursor_column = cursor_pos;
+            }
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::NextField => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let new_field = (current_field + 1) % num_fields;
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::PrevField => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let new_field = if current_field == 0 {
+                    num_fields - 1
+                } else {
+                    current_field - 1
+                };
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::MoveLeft => {
+            let new_pos = state.current_cursor_pos().saturating_sub(1);
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::MoveRight => {
+            let current_input = state.get_current_input();
+            let current_pos = state.current_cursor_pos();
+            if current_pos < current_input.len() {
+                let new_pos = current_pos + 1;
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::MoveUp => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let current_field = state.current_field();
+                let new_field = current_field.saturating_sub(1);
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::MoveDown => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let new_field = (state.current_field() + 1).min(num_fields - 1);
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::MoveLineStart => {
+            state.set_current_cursor_pos(0);
+            *ideal_cursor_column = 0;
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::MoveLineEnd => {
+            let current_input = state.get_current_input();
+            let new_pos = current_input.len();
+            state.set_current_cursor_pos(new_pos);
+            *ideal_cursor_column = new_pos;
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::MoveFirstLine => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                state.set_current_field(0);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok(ActionResult::success_with_message("Moved to first field"))
+        }
+
+        CanvasAction::MoveLastLine => {
+            let num_fields = state.fields().len();
+            if num_fields > 0 {
+                let new_field = num_fields - 1;
+                state.set_current_field(new_field);
+                let current_input = state.get_current_input();
+                let max_pos = current_input.len();
+                state.set_current_cursor_pos((*ideal_cursor_column).min(max_pos));
+            }
+            Ok(ActionResult::success_with_message("Moved to last field"))
+        }
+
+        CanvasAction::MoveWordNext => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_next_word_start(current_input, state.current_cursor_pos());
+                let final_pos = new_pos.min(current_input.len());
+                state.set_current_cursor_pos(final_pos);
+                *ideal_cursor_column = final_pos;
+            }
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::MoveWordEnd => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let current_pos = state.current_cursor_pos();
+                let new_pos = find_word_end(current_input, current_pos);
+
+                let final_pos = if new_pos == current_pos {
+                    find_word_end(current_input, new_pos + 1)
+                } else {
+                    new_pos
+                };
+
+                let max_valid_index = current_input.len().saturating_sub(1);
+                let clamped_pos = final_pos.min(max_valid_index);
+                state.set_current_cursor_pos(clamped_pos);
+                *ideal_cursor_column = clamped_pos;
+            }
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::MoveWordPrev => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_start(current_input, state.current_cursor_pos());
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok(ActionResult::success())
+        }
+
+        CanvasAction::MoveWordEndPrev => {
+            let current_input = state.get_current_input();
+            if !current_input.is_empty() {
+                let new_pos = find_prev_word_end(current_input, state.current_cursor_pos());
+                state.set_current_cursor_pos(new_pos);
+                *ideal_cursor_column = new_pos;
+            }
+            Ok(ActionResult::success_with_message("Moved to previous word end"))
+        }
+
+        CanvasAction::Custom(action_str) => {
+            Ok(ActionResult::error(format!("Unknown or unhandled custom action: {}", action_str)))
+        }
+
+        // Suggestion actions should have been handled above
+        CanvasAction::SuggestionUp | CanvasAction::SuggestionDown | 
+        CanvasAction::SelectSuggestion | CanvasAction::ExitSuggestions => {
+            Ok(ActionResult::error("Suggestion action not handled properly"))
+        }
+    }
+}
+
+// Word movement helper functions
+
+#[derive(PartialEq)]
+enum CharType {
+    Whitespace,
+    Alphanumeric,
+    Punctuation,
+}
+
+fn get_char_type(c: char) -> CharType {
+    if c.is_whitespace() {
+        CharType::Whitespace
+    } else if c.is_alphanumeric() {
+        CharType::Alphanumeric
+    } else {
+        CharType::Punctuation
+    }
+}
+
+fn find_next_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 || current_pos >= len {
+        return len;
+    }
+
+    let mut pos = current_pos;
+    let initial_type = get_char_type(chars[pos]);
+
+    while pos < len && get_char_type(chars[pos]) == initial_type {
+        pos += 1;
+    }
+
+    while pos < len && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos += 1;
+    }
+
+    pos
+}
+
+fn find_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.min(len - 1);
+
+    if get_char_type(chars[pos]) == CharType::Whitespace {
+        pos = find_next_word_start(text, pos);
+    }
+
+    if pos >= len {
+        return len.saturating_sub(1);
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos < len && get_char_type(chars[pos]) == word_type {
+        pos += 1;
+    }
+
+    pos.saturating_sub(1).min(len.saturating_sub(1))
+}
+
+fn find_prev_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos == 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        return 0;
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+        pos -= 1;
+    }
+
+    pos
+}
+
+fn find_prev_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    let len = chars.len();
+    if len == 0 || current_pos == 0 {
+        return 0;
+    }
+
+    let mut pos = current_pos.saturating_sub(1);
+
+    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos == 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+        return 0;
+    }
+    if pos == 0 && get_char_type(chars[pos]) != CharType::Whitespace {
+        return 0;
+    }
+
+    let word_type = get_char_type(chars[pos]);
+    while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+        pos -= 1;
+    }
+
+    while pos > 0 && get_char_type(chars[pos - 1]) == CharType::Whitespace {
+        pos -= 1;
+    }
+
+    if pos > 0 {
+        pos - 1
+    } else {
+        0
+    }
+}

canvas/src/actions/mod.rs

@@ -0,0 +1,8 @@
+// canvas/src/actions/mod.rs
+
+pub mod types;
+pub mod edit;
+
+// Re-export the main types for convenience
+pub use types::{CanvasAction, ActionResult};
+pub use edit::{execute_canvas_action, execute_edit_action};

canvas/src/actions/types.rs

@@ -0,0 +1,225 @@
+// canvas/src/actions/types.rs
+
+use crossterm::event::KeyCode;
+
+/// All possible canvas actions, type-safe and exhaustive
+#[derive(Debug, Clone, PartialEq, Eq)]
+pub enum CanvasAction {
+    // Character input
+    InsertChar(char),
+    
+    // Deletion
+    DeleteBackward,
+    DeleteForward,
+    
+    // Basic cursor movement
+    MoveLeft,
+    MoveRight,
+    MoveUp,
+    MoveDown,
+    
+    // Line movement
+    MoveLineStart,
+    MoveLineEnd,
+    MoveFirstLine,
+    MoveLastLine,
+    
+    // Word movement
+    MoveWordNext,
+    MoveWordEnd,
+    MoveWordPrev,
+    MoveWordEndPrev,
+    
+    // Field navigation
+    NextField,
+    PrevField,
+    
+    // Suggestions
+    SuggestionUp,
+    SuggestionDown,
+    SelectSuggestion,
+    ExitSuggestions,
+    
+    // Custom actions (escape hatch for feature-specific behavior)
+    Custom(String),
+}
+
+impl CanvasAction {
+    /// Convert a string action to typed action (for backwards compatibility during migration)
+    pub fn from_string(action: &str) -> Self {
+        match action {
+            "insert_char" => {
+                // This is a bit tricky - we need the char from context
+                // For now, we'll use Custom until we refactor the call sites
+                Self::Custom(action.to_string())
+            }
+            "delete_char_backward" => Self::DeleteBackward,
+            "delete_char_forward" => Self::DeleteForward,
+            "move_left" => Self::MoveLeft,
+            "move_right" => Self::MoveRight,
+            "move_up" => Self::MoveUp,
+            "move_down" => Self::MoveDown,
+            "move_line_start" => Self::MoveLineStart,
+            "move_line_end" => Self::MoveLineEnd,
+            "move_first_line" => Self::MoveFirstLine,
+            "move_last_line" => Self::MoveLastLine,
+            "move_word_next" => Self::MoveWordNext,
+            "move_word_end" => Self::MoveWordEnd,
+            "move_word_prev" => Self::MoveWordPrev,
+            "move_word_end_prev" => Self::MoveWordEndPrev,
+            "next_field" => Self::NextField,
+            "prev_field" => Self::PrevField,
+            "suggestion_up" => Self::SuggestionUp,
+            "suggestion_down" => Self::SuggestionDown,
+            "select_suggestion" => Self::SelectSuggestion,
+            "exit_suggestions" => Self::ExitSuggestions,
+            _ => Self::Custom(action.to_string()),
+        }
+    }
+    
+    /// Get string representation (for logging, debugging)
+    pub fn as_str(&self) -> &str {
+        match self {
+            Self::InsertChar(_) => "insert_char",
+            Self::DeleteBackward => "delete_char_backward",
+            Self::DeleteForward => "delete_char_forward",
+            Self::MoveLeft => "move_left",
+            Self::MoveRight => "move_right",
+            Self::MoveUp => "move_up",
+            Self::MoveDown => "move_down",
+            Self::MoveLineStart => "move_line_start",
+            Self::MoveLineEnd => "move_line_end",
+            Self::MoveFirstLine => "move_first_line",
+            Self::MoveLastLine => "move_last_line",
+            Self::MoveWordNext => "move_word_next",
+            Self::MoveWordEnd => "move_word_end",
+            Self::MoveWordPrev => "move_word_prev",
+            Self::MoveWordEndPrev => "move_word_end_prev",
+            Self::NextField => "next_field",
+            Self::PrevField => "prev_field",
+            Self::SuggestionUp => "suggestion_up",
+            Self::SuggestionDown => "suggestion_down",
+            Self::SelectSuggestion => "select_suggestion",
+            Self::ExitSuggestions => "exit_suggestions",
+            Self::Custom(s) => s,
+        }
+    }
+    
+    /// Create action from KeyCode for common cases
+    pub fn from_key(key: KeyCode) -> Option<Self> {
+        match key {
+            KeyCode::Char(c) => Some(Self::InsertChar(c)),
+            KeyCode::Backspace => Some(Self::DeleteBackward),
+            KeyCode::Delete => Some(Self::DeleteForward),
+            KeyCode::Left => Some(Self::MoveLeft),
+            KeyCode::Right => Some(Self::MoveRight),
+            KeyCode::Up => Some(Self::MoveUp),
+            KeyCode::Down => Some(Self::MoveDown),
+            KeyCode::Home => Some(Self::MoveLineStart),
+            KeyCode::End => Some(Self::MoveLineEnd),
+            KeyCode::Tab => Some(Self::NextField),
+            KeyCode::BackTab => Some(Self::PrevField),
+            _ => None,
+        }
+    }
+    
+    /// Check if this action modifies content
+    pub fn is_modifying(&self) -> bool {
+        matches!(self, 
+            Self::InsertChar(_) | 
+            Self::DeleteBackward | 
+            Self::DeleteForward |
+            Self::SelectSuggestion
+        )
+    }
+    
+    /// Check if this action moves the cursor
+    pub fn is_movement(&self) -> bool {
+        matches!(self,
+            Self::MoveLeft | Self::MoveRight | Self::MoveUp | Self::MoveDown |
+            Self::MoveLineStart | Self::MoveLineEnd | Self::MoveFirstLine | Self::MoveLastLine |
+            Self::MoveWordNext | Self::MoveWordEnd | Self::MoveWordPrev | Self::MoveWordEndPrev |
+            Self::NextField | Self::PrevField
+        )
+    }
+    
+    /// Check if this is a suggestion-related action
+    pub fn is_suggestion(&self) -> bool {
+        matches!(self,
+            Self::SuggestionUp | Self::SuggestionDown | 
+            Self::SelectSuggestion | Self::ExitSuggestions
+        )
+    }
+}
+
+/// Result of executing a canvas action
+#[derive(Debug, Clone, PartialEq, Eq)]
+pub enum ActionResult {
+    /// Action completed successfully, optional message for user feedback
+    Success(Option<String>),
+    /// Action was handled by custom feature logic
+    HandledByFeature(String),
+    /// Action requires additional context or cannot be performed
+    RequiresContext(String),
+    /// Action failed with error message
+    Error(String),
+}
+
+impl ActionResult {
+    pub fn success() -> Self {
+        Self::Success(None)
+    }
+    
+    pub fn success_with_message(msg: impl Into<String>) -> Self {
+        Self::Success(Some(msg.into()))
+    }
+    
+    pub fn error(msg: impl Into<String>) -> Self {
+        Self::Error(msg.into())
+    }
+    
+    pub fn is_success(&self) -> bool {
+        matches!(self, Self::Success(_) | Self::HandledByFeature(_))
+    }
+    
+    pub fn message(&self) -> Option<&str> {
+        match self {
+            Self::Success(msg) => msg.as_deref(),
+            Self::HandledByFeature(msg) => Some(msg),
+            Self::RequiresContext(msg) => Some(msg),
+            Self::Error(msg) => Some(msg),
+        }
+    }
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+    
+    #[test]
+    fn test_action_from_string() {
+        assert_eq!(CanvasAction::from_string("move_left"), CanvasAction::MoveLeft);
+        assert_eq!(CanvasAction::from_string("delete_char_backward"), CanvasAction::DeleteBackward);
+        assert_eq!(CanvasAction::from_string("unknown"), CanvasAction::Custom("unknown".to_string()));
+    }
+    
+    #[test]
+    fn test_action_from_key() {
+        assert_eq!(CanvasAction::from_key(KeyCode::Char('a')), Some(CanvasAction::InsertChar('a')));
+        assert_eq!(CanvasAction::from_key(KeyCode::Left), Some(CanvasAction::MoveLeft));
+        assert_eq!(CanvasAction::from_key(KeyCode::Backspace), Some(CanvasAction::DeleteBackward));
+        assert_eq!(CanvasAction::from_key(KeyCode::F(1)), None);
+    }
+    
+    #[test]
+    fn test_action_properties() {
+        assert!(CanvasAction::InsertChar('a').is_modifying());
+        assert!(!CanvasAction::MoveLeft.is_modifying());
+        
+        assert!(CanvasAction::MoveLeft.is_movement());
+        assert!(!CanvasAction::InsertChar('a').is_movement());
+        
+        assert!(CanvasAction::SuggestionUp.is_suggestion());
+        assert!(!CanvasAction::MoveLeft.is_suggestion());
+    }
+}

canvas/src/config.rs

@@ -0,0 +1,480 @@
+// canvas/src/config.rs
+use serde::{Deserialize, Serialize};
+use std::collections::HashMap;
+use crossterm::event::{KeyCode, KeyModifiers};
+use anyhow::{Context, Result};
+
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct CanvasConfig {
+    #[serde(default)]
+    pub keybindings: CanvasKeybindings,
+    #[serde(default)]
+    pub behavior: CanvasBehavior,
+    #[serde(default)]
+    pub appearance: CanvasAppearance,
+}
+
+#[derive(Debug, Clone, Serialize, Deserialize, Default)]
+pub struct CanvasKeybindings {
+    #[serde(default)]
+    pub read_only: HashMap<String, Vec<String>>,
+    #[serde(default)]
+    pub edit: HashMap<String, Vec<String>>,
+    #[serde(default)]
+    pub suggestions: HashMap<String, Vec<String>>,
+    #[serde(default)]
+    pub global: HashMap<String, Vec<String>>,
+}
+
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct CanvasBehavior {
+    #[serde(default = "default_wrap_around")]
+    pub wrap_around_fields: bool,
+    #[serde(default = "default_auto_save")]
+    pub auto_save_on_field_change: bool,
+    #[serde(default = "default_word_chars")]
+    pub word_chars: String,
+    #[serde(default = "default_suggestion_limit")]
+    pub max_suggestions: usize,
+}
+
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct CanvasAppearance {
+    #[serde(default = "default_cursor_style")]
+    pub cursor_style: String, // "block", "bar", "underline"
+    #[serde(default = "default_show_field_numbers")]
+    pub show_field_numbers: bool,
+    #[serde(default = "default_highlight_current_field")]
+    pub highlight_current_field: bool,
+}
+
+// Default values
+fn default_wrap_around() -> bool { true }
+fn default_auto_save() -> bool { false }
+fn default_word_chars() -> String { "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789_".to_string() }
+fn default_suggestion_limit() -> usize { 10 }
+fn default_cursor_style() -> String { "block".to_string() }
+fn default_show_field_numbers() -> bool { false }
+fn default_highlight_current_field() -> bool { true }
+
+impl Default for CanvasBehavior {
+    fn default() -> Self {
+        Self {
+            wrap_around_fields: default_wrap_around(),
+            auto_save_on_field_change: default_auto_save(),
+            word_chars: default_word_chars(),
+            max_suggestions: default_suggestion_limit(),
+        }
+    }
+}
+
+impl Default for CanvasAppearance {
+    fn default() -> Self {
+        Self {
+            cursor_style: default_cursor_style(),
+            show_field_numbers: default_show_field_numbers(),
+            highlight_current_field: default_highlight_current_field(),
+        }
+    }
+}
+
+impl Default for CanvasConfig {
+    fn default() -> Self {
+        Self {
+            keybindings: CanvasKeybindings::with_vim_defaults(),
+            behavior: CanvasBehavior::default(),
+            appearance: CanvasAppearance::default(),
+        }
+    }
+}
+
+impl CanvasKeybindings {
+    pub fn with_vim_defaults() -> Self {
+        let mut keybindings = Self::default();
+
+        // Read-only mode (vim-style navigation)
+        keybindings.read_only.insert("move_left".to_string(), vec!["h".to_string()]);
+        keybindings.read_only.insert("move_right".to_string(), vec!["l".to_string()]);
+        keybindings.read_only.insert("move_up".to_string(), vec!["k".to_string()]);
+        keybindings.read_only.insert("move_down".to_string(), vec!["j".to_string()]);
+        keybindings.read_only.insert("move_word_next".to_string(), vec!["w".to_string()]);
+        keybindings.read_only.insert("move_word_end".to_string(), vec!["e".to_string()]);
+        keybindings.read_only.insert("move_word_prev".to_string(), vec!["b".to_string()]);
+        keybindings.read_only.insert("move_word_end_prev".to_string(), vec!["ge".to_string()]);
+        keybindings.read_only.insert("move_line_start".to_string(), vec!["0".to_string()]);
+        keybindings.read_only.insert("move_line_end".to_string(), vec!["$".to_string()]);
+        keybindings.read_only.insert("move_first_line".to_string(), vec!["gg".to_string()]);
+        keybindings.read_only.insert("move_last_line".to_string(), vec!["G".to_string()]);
+        keybindings.read_only.insert("next_field".to_string(), vec!["Tab".to_string()]);
+        keybindings.read_only.insert("prev_field".to_string(), vec!["Shift+Tab".to_string()]);
+
+        // Edit mode
+        keybindings.edit.insert("delete_char_backward".to_string(), vec!["Backspace".to_string()]);
+        keybindings.edit.insert("delete_char_forward".to_string(), vec!["Delete".to_string()]);
+        keybindings.edit.insert("move_left".to_string(), vec!["Left".to_string()]);
+        keybindings.edit.insert("move_right".to_string(), vec!["Right".to_string()]);
+        keybindings.edit.insert("move_up".to_string(), vec!["Up".to_string()]);
+        keybindings.edit.insert("move_down".to_string(), vec!["Down".to_string()]);
+        keybindings.edit.insert("move_line_start".to_string(), vec!["Home".to_string()]);
+        keybindings.edit.insert("move_line_end".to_string(), vec!["End".to_string()]);
+        keybindings.edit.insert("move_word_next".to_string(), vec!["Ctrl+Right".to_string()]);
+        keybindings.edit.insert("move_word_prev".to_string(), vec!["Ctrl+Left".to_string()]);
+        keybindings.edit.insert("next_field".to_string(), vec!["Tab".to_string()]);
+        keybindings.edit.insert("prev_field".to_string(), vec!["Shift+Tab".to_string()]);
+
+        // Suggestions
+        keybindings.suggestions.insert("suggestion_up".to_string(), vec!["Up".to_string(), "Ctrl+p".to_string()]);
+        keybindings.suggestions.insert("suggestion_down".to_string(), vec!["Down".to_string(), "Ctrl+n".to_string()]);
+        keybindings.suggestions.insert("select_suggestion".to_string(), vec!["Enter".to_string(), "Tab".to_string()]);
+        keybindings.suggestions.insert("exit_suggestions".to_string(), vec!["Esc".to_string()]);
+
+        // Global (works in both modes)
+        keybindings.global.insert("move_up".to_string(), vec!["Up".to_string()]);
+        keybindings.global.insert("move_down".to_string(), vec!["Down".to_string()]);
+
+        keybindings
+    }
+
+    pub fn with_emacs_defaults() -> Self {
+        let mut keybindings = Self::default();
+
+        // Emacs-style bindings
+        keybindings.read_only.insert("move_left".to_string(), vec!["Ctrl+b".to_string()]);
+        keybindings.read_only.insert("move_right".to_string(), vec!["Ctrl+f".to_string()]);
+        keybindings.read_only.insert("move_up".to_string(), vec!["Ctrl+p".to_string()]);
+        keybindings.read_only.insert("move_down".to_string(), vec!["Ctrl+n".to_string()]);
+        keybindings.read_only.insert("move_word_next".to_string(), vec!["Alt+f".to_string()]);
+        keybindings.read_only.insert("move_word_prev".to_string(), vec!["Alt+b".to_string()]);
+        keybindings.read_only.insert("move_line_start".to_string(), vec!["Ctrl+a".to_string()]);
+        keybindings.read_only.insert("move_line_end".to_string(), vec!["Ctrl+e".to_string()]);
+
+        keybindings.edit.insert("delete_char_backward".to_string(), vec!["Ctrl+h".to_string(), "Backspace".to_string()]);
+        keybindings.edit.insert("delete_char_forward".to_string(), vec!["Ctrl+d".to_string(), "Delete".to_string()]);
+
+        keybindings
+    }
+}
+
+impl CanvasConfig {
+    /// Load from canvas_config.toml or fallback to vim defaults
+    pub fn load() -> Self {
+        // Try to load canvas_config.toml from current directory
+        if let Ok(config) = Self::from_file(std::path::Path::new("canvas_config.toml")) {
+            return config;
+        }
+        
+        // Fallback to vim defaults
+        Self::default()
+    }
+
+    /// Load from TOML string
+    pub fn from_toml(toml_str: &str) -> Result<Self> {
+        toml::from_str(toml_str)
+            .with_context(|| "Failed to parse canvas config TOML")
+    }
+
+    /// Load from file
+    pub fn from_file(path: &std::path::Path) -> Result<Self> {
+        let contents = std::fs::read_to_string(path)
+            .with_context(|| format!("Failed to read config file: {:?}", path))?;
+        Self::from_toml(&contents)
+    }
+
+    /// Get action for key in read-only mode
+    pub fn get_read_only_action(&self, key: KeyCode, modifiers: KeyModifiers) -> Option<&str> {
+        self.get_action_in_mode(&self.keybindings.read_only, key, modifiers)
+            .or_else(|| self.get_action_in_mode(&self.keybindings.global, key, modifiers))
+    }
+
+    /// Get action for key in edit mode
+    pub fn get_edit_action(&self, key: KeyCode, modifiers: KeyModifiers) -> Option<&str> {
+        self.get_action_in_mode(&self.keybindings.edit, key, modifiers)
+            .or_else(|| self.get_action_in_mode(&self.keybindings.global, key, modifiers))
+    }
+
+    /// Get action for key in suggestions mode
+    pub fn get_suggestion_action(&self, key: KeyCode, modifiers: KeyModifiers) -> Option<&str> {
+        self.get_action_in_mode(&self.keybindings.suggestions, key, modifiers)
+    }
+
+    /// Get action for key (mode-aware)
+    pub fn get_action_for_key(&self, key: KeyCode, modifiers: KeyModifiers, is_edit_mode: bool, has_suggestions: bool) -> Option<&str> {
+        // Suggestions take priority when active
+        if has_suggestions {
+            if let Some(action) = self.get_suggestion_action(key, modifiers) {
+                return Some(action);
+            }
+        }
+
+        // Then check mode-specific
+        if is_edit_mode {
+            self.get_edit_action(key, modifiers)
+        } else {
+            self.get_read_only_action(key, modifiers)
+        }
+    }
+
+    fn get_action_in_mode<'a>(&self, mode_bindings: &'a HashMap<String, Vec<String>>, key: KeyCode, modifiers: KeyModifiers) -> Option<&'a str> {
+        for (action, bindings) in mode_bindings {
+            for binding in bindings {
+                if self.matches_keybinding(binding, key, modifiers) {
+                    return Some(action);
+                }
+            }
+        }
+        None
+    }
+
+    fn matches_keybinding(&self, binding: &str, key: KeyCode, modifiers: KeyModifiers) -> bool {
+        // Special handling for shift+character combinations
+        if binding.to_lowercase().starts_with("shift+") {
+            let parts: Vec<&str> = binding.split('+').collect();
+            if parts.len() == 2 && parts[1].len() == 1 {
+                let expected_lowercase = parts[1].chars().next().unwrap().to_lowercase().next().unwrap();
+                let expected_uppercase = expected_lowercase.to_uppercase().next().unwrap();
+                if let KeyCode::Char(actual_char) = key {
+                    if actual_char == expected_uppercase && modifiers.contains(KeyModifiers::SHIFT) {
+                        return true;
+                    }
+                }
+            }
+        }
+
+        // Handle Shift+Tab -> BackTab
+        if binding.to_lowercase() == "shift+tab" && key == KeyCode::BackTab && modifiers.is_empty() {
+            return true;
+        }
+
+        // Handle multi-character bindings (all standard keys without modifiers)
+        if binding.len() > 1 && !binding.contains('+') {
+            return match binding.to_lowercase().as_str() {
+                // Navigation keys
+                "left" => key == KeyCode::Left,
+                "right" => key == KeyCode::Right,
+                "up" => key == KeyCode::Up,
+                "down" => key == KeyCode::Down,
+                "home" => key == KeyCode::Home,
+                "end" => key == KeyCode::End,
+                "pageup" | "pgup" => key == KeyCode::PageUp,
+                "pagedown" | "pgdn" => key == KeyCode::PageDown,
+                
+                // Editing keys
+                "insert" | "ins" => key == KeyCode::Insert,
+                "delete" | "del" => key == KeyCode::Delete,
+                "backspace" => key == KeyCode::Backspace,
+                
+                // Tab keys
+                "tab" => key == KeyCode::Tab,
+                "backtab" => key == KeyCode::BackTab,
+                
+                // Special keys
+                "enter" | "return" => key == KeyCode::Enter,
+                "escape" | "esc" => key == KeyCode::Esc,
+                "space" => key == KeyCode::Char(' '),
+                
+                // Function keys F1-F24
+                "f1" => key == KeyCode::F(1),
+                "f2" => key == KeyCode::F(2),
+                "f3" => key == KeyCode::F(3),
+                "f4" => key == KeyCode::F(4),
+                "f5" => key == KeyCode::F(5),
+                "f6" => key == KeyCode::F(6),
+                "f7" => key == KeyCode::F(7),
+                "f8" => key == KeyCode::F(8),
+                "f9" => key == KeyCode::F(9),
+                "f10" => key == KeyCode::F(10),
+                "f11" => key == KeyCode::F(11),
+                "f12" => key == KeyCode::F(12),
+                "f13" => key == KeyCode::F(13),
+                "f14" => key == KeyCode::F(14),
+                "f15" => key == KeyCode::F(15),
+                "f16" => key == KeyCode::F(16),
+                "f17" => key == KeyCode::F(17),
+                "f18" => key == KeyCode::F(18),
+                "f19" => key == KeyCode::F(19),
+                "f20" => key == KeyCode::F(20),
+                "f21" => key == KeyCode::F(21),
+                "f22" => key == KeyCode::F(22),
+                "f23" => key == KeyCode::F(23),
+                "f24" => key == KeyCode::F(24),
+                
+                // Lock keys (may not work reliably in all terminals)
+                "capslock" => key == KeyCode::CapsLock,
+                "scrolllock" => key == KeyCode::ScrollLock,
+                "numlock" => key == KeyCode::NumLock,
+                
+                // System keys
+                "printscreen" => key == KeyCode::PrintScreen,
+                "pause" => key == KeyCode::Pause,
+                "menu" => key == KeyCode::Menu,
+                "keypadbegin" => key == KeyCode::KeypadBegin,
+                
+                // Media keys (rarely supported but included for completeness)
+                "mediaplay" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Play),
+                "mediapause" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Pause),
+                "mediaplaypause" => key == KeyCode::Media(crossterm::event::MediaKeyCode::PlayPause),
+                "mediareverse" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Reverse),
+                "mediastop" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Stop),
+                "mediafastforward" => key == KeyCode::Media(crossterm::event::MediaKeyCode::FastForward),
+                "mediarewind" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Rewind),
+                "mediatracknext" => key == KeyCode::Media(crossterm::event::MediaKeyCode::TrackNext),
+                "mediatrackprevious" => key == KeyCode::Media(crossterm::event::MediaKeyCode::TrackPrevious),
+                "mediarecord" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Record),
+                "medialowervolume" => key == KeyCode::Media(crossterm::event::MediaKeyCode::LowerVolume),
+                "mediaraisevolume" => key == KeyCode::Media(crossterm::event::MediaKeyCode::RaiseVolume),
+                "mediamutevolume" => key == KeyCode::Media(crossterm::event::MediaKeyCode::MuteVolume),
+                
+                // Modifier keys (these work better as part of combinations)
+                "leftshift" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::LeftShift),
+                "leftcontrol" | "leftctrl" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::LeftControl),
+                "leftalt" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::LeftAlt),
+                "leftsuper" | "leftwindows" | "leftcmd" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::LeftSuper),
+                "lefthyper" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::LeftHyper),
+                "leftmeta" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::LeftMeta),
+                "rightshift" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::RightShift),
+                "rightcontrol" | "rightctrl" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::RightControl),
+                "rightalt" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::RightAlt),
+                "rightsuper" | "rightwindows" | "rightcmd" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::RightSuper),
+                "righthyper" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::RightHyper),
+                "rightmeta" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::RightMeta),
+                "isolevel3shift" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::IsoLevel3Shift),
+                "isolevel5shift" => key == KeyCode::Modifier(crossterm::event::ModifierKeyCode::IsoLevel5Shift),
+                
+                // Multi-key sequences need special handling
+                "gg" => false, // This needs sequence handling
+                _ => {
+                    // Handle single characters and punctuation
+                    if binding.len() == 1 {
+                        if let Some(c) = binding.chars().next() {
+                            key == KeyCode::Char(c)
+                        } else {
+                            false
+                        }
+                    } else {
+                        false
+                    }
+                }
+            };
+        }
+
+        // Handle modifier combinations (like "Ctrl+F5", "Alt+Shift+A")
+        let parts: Vec<&str> = binding.split('+').collect();
+        let mut expected_modifiers = KeyModifiers::empty();
+        let mut expected_key = None;
+
+        for part in parts {
+            match part.to_lowercase().as_str() {
+                // Modifiers
+                "ctrl" | "control" => expected_modifiers |= KeyModifiers::CONTROL,
+                "shift" => expected_modifiers |= KeyModifiers::SHIFT,
+                "alt" => expected_modifiers |= KeyModifiers::ALT,
+                "super" | "windows" | "cmd" => expected_modifiers |= KeyModifiers::SUPER,
+                "hyper" => expected_modifiers |= KeyModifiers::HYPER,
+                "meta" => expected_modifiers |= KeyModifiers::META,
+                
+                // Navigation keys
+                "left" => expected_key = Some(KeyCode::Left),
+                "right" => expected_key = Some(KeyCode::Right),
+                "up" => expected_key = Some(KeyCode::Up),
+                "down" => expected_key = Some(KeyCode::Down),
+                "home" => expected_key = Some(KeyCode::Home),
+                "end" => expected_key = Some(KeyCode::End),
+                "pageup" | "pgup" => expected_key = Some(KeyCode::PageUp),
+                "pagedown" | "pgdn" => expected_key = Some(KeyCode::PageDown),
+                
+                // Editing keys
+                "insert" | "ins" => expected_key = Some(KeyCode::Insert),
+                "delete" | "del" => expected_key = Some(KeyCode::Delete),
+                "backspace" => expected_key = Some(KeyCode::Backspace),
+                
+                // Tab keys
+                "tab" => expected_key = Some(KeyCode::Tab),
+                "backtab" => expected_key = Some(KeyCode::BackTab),
+                
+                // Special keys
+                "enter" | "return" => expected_key = Some(KeyCode::Enter),
+                "escape" | "esc" => expected_key = Some(KeyCode::Esc),
+                "space" => expected_key = Some(KeyCode::Char(' ')),
+                
+                // Function keys
+                "f1" => expected_key = Some(KeyCode::F(1)),
+                "f2" => expected_key = Some(KeyCode::F(2)),
+                "f3" => expected_key = Some(KeyCode::F(3)),
+                "f4" => expected_key = Some(KeyCode::F(4)),
+                "f5" => expected_key = Some(KeyCode::F(5)),
+                "f6" => expected_key = Some(KeyCode::F(6)),
+                "f7" => expected_key = Some(KeyCode::F(7)),
+                "f8" => expected_key = Some(KeyCode::F(8)),
+                "f9" => expected_key = Some(KeyCode::F(9)),
+                "f10" => expected_key = Some(KeyCode::F(10)),
+                "f11" => expected_key = Some(KeyCode::F(11)),
+                "f12" => expected_key = Some(KeyCode::F(12)),
+                "f13" => expected_key = Some(KeyCode::F(13)),
+                "f14" => expected_key = Some(KeyCode::F(14)),
+                "f15" => expected_key = Some(KeyCode::F(15)),
+                "f16" => expected_key = Some(KeyCode::F(16)),
+                "f17" => expected_key = Some(KeyCode::F(17)),
+                "f18" => expected_key = Some(KeyCode::F(18)),
+                "f19" => expected_key = Some(KeyCode::F(19)),
+                "f20" => expected_key = Some(KeyCode::F(20)),
+                "f21" => expected_key = Some(KeyCode::F(21)),
+                "f22" => expected_key = Some(KeyCode::F(22)),
+                "f23" => expected_key = Some(KeyCode::F(23)),
+                "f24" => expected_key = Some(KeyCode::F(24)),
+                
+                // Lock keys
+                "capslock" => expected_key = Some(KeyCode::CapsLock),
+                "scrolllock" => expected_key = Some(KeyCode::ScrollLock),
+                "numlock" => expected_key = Some(KeyCode::NumLock),
+                
+                // System keys
+                "printscreen" => expected_key = Some(KeyCode::PrintScreen),
+                "pause" => expected_key = Some(KeyCode::Pause),
+                "menu" => expected_key = Some(KeyCode::Menu),
+                "keypadbegin" => expected_key = Some(KeyCode::KeypadBegin),
+                
+                // Single character (letters, numbers, punctuation)
+                part => {
+                    if part.len() == 1 {
+                        if let Some(c) = part.chars().next() {
+                            expected_key = Some(KeyCode::Char(c));
+                        }
+                    }
+                }
+            }
+        }
+
+        modifiers == expected_modifiers && Some(key) == expected_key
+    }
+
+    /// Convenience method to create vim preset
+    pub fn vim_preset() -> Self {
+        Self {
+            keybindings: CanvasKeybindings::with_vim_defaults(),
+            behavior: CanvasBehavior::default(),
+            appearance: CanvasAppearance::default(),
+        }
+    }
+    
+    /// Convenience method to create emacs preset
+    pub fn emacs_preset() -> Self {
+        Self {
+            keybindings: CanvasKeybindings::with_emacs_defaults(),
+            behavior: CanvasBehavior::default(),
+            appearance: CanvasAppearance::default(),
+        }
+    }
+
+    /// Debug method to print loaded keybindings
+    pub fn debug_keybindings(&self) {
+        println!("📋 Canvas keybindings loaded:");
+        println!("  Read-only: {} actions", self.keybindings.read_only.len());
+        println!("  Edit: {} actions", self.keybindings.edit.len());
+        println!("  Suggestions: {} actions", self.keybindings.suggestions.len());
+        println!("  Global: {} actions", self.keybindings.global.len());
+    }
+}
+
+// Re-export for convenience
+pub use crate::actions::CanvasAction;
+pub use crate::dispatcher::ActionDispatcher;

canvas/src/dispatcher.rs

@@ -0,0 +1,180 @@
+// canvas/src/dispatcher.rs
+
+use crate::state::CanvasState;
+use crate::actions::{CanvasAction, ActionResult, execute_canvas_action};
+
+/// High-level action dispatcher that coordinates between different action types
+pub struct ActionDispatcher;
+
+impl ActionDispatcher {
+    /// Dispatch any action to the appropriate handler
+    pub async fn dispatch<S: CanvasState>(
+        action: CanvasAction,
+        state: &mut S,
+        ideal_cursor_column: &mut usize,
+    ) -> anyhow::Result<ActionResult> {
+        execute_canvas_action(action, state, ideal_cursor_column).await
+    }
+
+    /// Quick action dispatch from KeyCode
+    pub async fn dispatch_key<S: CanvasState>(
+        key: crossterm::event::KeyCode,
+        state: &mut S,
+        ideal_cursor_column: &mut usize,
+    ) -> anyhow::Result<Option<ActionResult>> {
+        if let Some(action) = CanvasAction::from_key(key) {
+            let result = Self::dispatch(action, state, ideal_cursor_column).await?;
+            Ok(Some(result))
+        } else {
+            Ok(None)
+        }
+    }
+
+    /// Batch dispatch multiple actions
+    pub async fn dispatch_batch<S: CanvasState>(
+        actions: Vec<CanvasAction>,
+        state: &mut S,
+        ideal_cursor_column: &mut usize,
+    ) -> anyhow::Result<Vec<ActionResult>> {
+        let mut results = Vec::new();
+        for action in actions {
+            let result = Self::dispatch(action, state, ideal_cursor_column).await?;
+            let is_success = result.is_success(); // Check success before moving
+            results.push(result);
+
+            // Stop on first error
+            if !is_success {
+                break;
+            }
+        }
+        Ok(results)
+    }
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+    use crate::actions::CanvasAction;
+
+    // Simple test implementation
+    struct TestFormState {
+        current_field: usize,
+        cursor_pos: usize,
+        inputs: Vec<String>,
+        field_names: Vec<String>,
+        has_changes: bool,
+    }
+
+    impl TestFormState {
+        fn new() -> Self {
+            Self {
+                current_field: 0,
+                cursor_pos: 0,
+                inputs: vec!["".to_string(), "".to_string()],
+                field_names: vec!["username".to_string(), "password".to_string()],
+                has_changes: false,
+            }
+        }
+    }
+
+    impl CanvasState for TestFormState {
+        fn current_field(&self) -> usize { self.current_field }
+        fn current_cursor_pos(&self) -> usize { self.cursor_pos }
+        fn set_current_field(&mut self, index: usize) { self.current_field = index; }
+        fn set_current_cursor_pos(&mut self, pos: usize) { self.cursor_pos = pos; }
+
+        fn get_current_input(&self) -> &str { &self.inputs[self.current_field] }
+        fn get_current_input_mut(&mut self) -> &mut String { &mut self.inputs[self.current_field] }
+        fn inputs(&self) -> Vec<&String> { self.inputs.iter().collect() }
+        fn fields(&self) -> Vec<&str> { self.field_names.iter().map(|s| s.as_str()).collect() }
+
+        fn has_unsaved_changes(&self) -> bool { self.has_changes }
+        fn set_has_unsaved_changes(&mut self, changed: bool) { self.has_changes = changed; }
+
+        // Custom action handling for testing
+        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &crate::state::ActionContext) -> Option<String> {
+            match action {
+                CanvasAction::Custom(s) if s == "test_custom" => {
+                    Some("Custom action handled".to_string())
+                }
+                _ => None,
+            }
+        }
+    }
+
+    #[tokio::test]
+    async fn test_typed_action_dispatch() {
+        let mut state = TestFormState::new();
+        let mut ideal_cursor = 0;
+
+        // Test character insertion
+        let result = ActionDispatcher::dispatch(
+            CanvasAction::InsertChar('a'),
+            &mut state,
+            &mut ideal_cursor,
+        ).await.unwrap();
+
+        assert!(result.is_success());
+        assert_eq!(state.get_current_input(), "a");
+        assert_eq!(state.cursor_pos, 1);
+        assert!(state.has_changes);
+    }
+
+    #[tokio::test]
+    async fn test_key_dispatch() {
+        let mut state = TestFormState::new();
+        let mut ideal_cursor = 0;
+
+        let result = ActionDispatcher::dispatch_key(
+            crossterm::event::KeyCode::Char('b'),
+            &mut state,
+            &mut ideal_cursor,
+        ).await.unwrap();
+
+        assert!(result.is_some());
+        assert!(result.unwrap().is_success());
+        assert_eq!(state.get_current_input(), "b");
+    }
+
+    #[tokio::test]
+    async fn test_custom_action() {
+        let mut state = TestFormState::new();
+        let mut ideal_cursor = 0;
+
+        let result = ActionDispatcher::dispatch(
+            CanvasAction::Custom("test_custom".to_string()),
+            &mut state,
+            &mut ideal_cursor,
+        ).await.unwrap();
+
+        match result {
+            ActionResult::HandledByFeature(msg) => {
+                assert_eq!(msg, "Custom action handled");
+            }
+            _ => panic!("Expected HandledByFeature result"),
+        }
+    }
+
+    #[tokio::test]
+    async fn test_batch_dispatch() {
+        let mut state = TestFormState::new();
+        let mut ideal_cursor = 0;
+
+        let actions = vec![
+            CanvasAction::InsertChar('h'),
+            CanvasAction::InsertChar('i'),
+            CanvasAction::MoveLeft,
+            CanvasAction::InsertChar('e'),
+        ];
+
+        let results = ActionDispatcher::dispatch_batch(
+            actions,
+            &mut state,
+            &mut ideal_cursor,
+        ).await.unwrap();
+
+        assert_eq!(results.len(), 4);
+        assert!(results.iter().all(|r| r.is_success()));
+        assert_eq!(state.get_current_input(), "hei");
+    }
+}

canvas/src/lib.rs

@@ -0,0 +1,36 @@
+// canvas/src/lib.rs
+//! Canvas - A reusable text editing and form canvas system
+//!
+//! This crate provides a generic canvas abstraction for building text-based interfaces
+//! with multiple input fields, cursor management, and mode-based editing.
+
+pub mod state;
+pub mod actions;
+pub mod modes;
+pub mod config;
+pub mod suggestions;
+pub mod dispatcher;
+
+// Re-export the main types for easy use
+pub use state::{CanvasState, ActionContext};
+pub use actions::{CanvasAction, ActionResult, execute_edit_action, execute_canvas_action};
+pub use modes::{AppMode, ModeManager, HighlightState};
+pub use suggestions::SuggestionState;
+pub use dispatcher::ActionDispatcher;
+
+// High-level convenience API
+pub mod prelude {
+    pub use crate::{
+        CanvasState,
+        ActionContext,
+        CanvasAction,
+        ActionResult,
+        execute_edit_action,
+        execute_canvas_action,
+        ActionDispatcher,
+        AppMode,
+        ModeManager,
+        HighlightState,
+        SuggestionState,
+    };
+}

canvas/src/modes/highlight.rs

@@ -0,0 +1,15 @@
+// src/state/app/highlight.rs
+// canvas/src/modes/highlight.rs
+
+#[derive(Debug, Clone, PartialEq, Eq)]
+pub enum HighlightState {
+    Off,
+    Characterwise { anchor: (usize, usize) }, // (field_index, char_position)
+    Linewise { anchor_line: usize },          // field_index
+}
+
+impl Default for HighlightState {
+    fn default() -> Self {
+        HighlightState::Off
+    }
+}

canvas/src/modes/manager.rs

@@ -0,0 +1,33 @@
+// src/modes/handlers/mode_manager.rs
+// canvas/src/modes/manager.rs
+
+
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+pub enum AppMode {
+    General,   // For intro and admin screens
+    ReadOnly,  // Canvas read-only mode
+    Edit,      // Canvas edit mode
+    Highlight, // Canvas highlight/visual mode
+    Command,   // Command mode overlay
+}
+
+pub struct ModeManager;
+
+impl ModeManager {
+    // Mode transition rules
+    pub fn can_enter_command_mode(current_mode: AppMode) -> bool {
+        !matches!(current_mode, AppMode::Edit)
+    }
+
+    pub fn can_enter_edit_mode(current_mode: AppMode) -> bool {
+        matches!(current_mode, AppMode::ReadOnly)
+    }
+
+    pub fn can_enter_read_only_mode(current_mode: AppMode) -> bool {
+        matches!(current_mode, AppMode::Edit | AppMode::Command | AppMode::Highlight)
+    }
+
+    pub fn can_enter_highlight_mode(current_mode: AppMode) -> bool {
+        matches!(current_mode, AppMode::ReadOnly)
+    }
+}

canvas/src/modes/mod.rs

@@ -0,0 +1,7 @@
+// canvas/src/modes/mod.rs
+
+pub mod highlight;
+pub mod manager;
+
+pub use highlight::HighlightState;
+pub use manager::{AppMode, ModeManager};

canvas/src/state.rs

@@ -0,0 +1,83 @@
+// canvas/src/state.rs
+
+use crate::actions::CanvasAction;
+
+/// Context passed to feature-specific action handlers
+#[derive(Debug)]
+pub struct ActionContext {
+    pub key_code: Option<crossterm::event::KeyCode>, // Kept for backwards compatibility
+    pub ideal_cursor_column: usize,
+    pub current_input: String,
+    pub current_field: usize,
+}
+
+/// Core trait that any form-like state must implement to work with the canvas system.
+/// This enables the same mode behaviors (edit, read-only, highlight) to work across
+/// any implementation - login forms, data entry forms, configuration screens, etc.
+pub trait CanvasState {
+    // --- Core Navigation ---
+    fn current_field(&self) -> usize;
+    fn current_cursor_pos(&self) -> usize;
+    fn set_current_field(&mut self, index: usize);
+    fn set_current_cursor_pos(&mut self, pos: usize);
+
+    // --- Data Access ---
+    fn get_current_input(&self) -> &str;
+    fn get_current_input_mut(&mut self) -> &mut String;
+    fn inputs(&self) -> Vec<&String>;
+    fn fields(&self) -> Vec<&str>;
+
+    // --- State Management ---
+    fn has_unsaved_changes(&self) -> bool;
+    fn set_has_unsaved_changes(&mut self, changed: bool);
+
+    // --- Autocomplete/Suggestions (Optional) ---
+    fn get_suggestions(&self) -> Option<&[String]> {
+        None
+    }
+    fn get_selected_suggestion_index(&self) -> Option<usize> {
+        None
+    }
+    fn set_selected_suggestion_index(&mut self, _index: Option<usize>) {
+        // Default: no-op (override if you support suggestions)
+    }
+    fn activate_suggestions(&mut self, _suggestions: Vec<String>) {
+        // Default: no-op (override if you support suggestions)
+    }
+    fn deactivate_suggestions(&mut self) {
+        // Default: no-op (override if you support suggestions)
+    }
+
+    // --- Feature-specific action handling (NEW: Type-safe) ---
+    fn handle_feature_action(&mut self, _action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+        None // Default: no feature-specific handling
+    }
+
+    // --- Legacy string-based action handling (for backwards compatibility) ---
+    fn handle_feature_action_legacy(&mut self, action: &str, context: &ActionContext) -> Option<String> {
+        // Convert string to typed action and delegate
+        let typed_action = match action {
+            "insert_char" => {
+                // This is tricky - we need the char from the KeyCode in context
+                if let Some(crossterm::event::KeyCode::Char(c)) = context.key_code {
+                    CanvasAction::InsertChar(c)
+                } else {
+                    CanvasAction::Custom(action.to_string())
+                }
+            }
+            _ => CanvasAction::from_string(action),
+        };
+        self.handle_feature_action(&typed_action, context)
+    }
+
+    // --- Display Overrides (for links, computed values, etc.) ---
+    fn get_display_value_for_field(&self, index: usize) -> &str {
+        self.inputs()
+            .get(index)
+            .map(|s| s.as_str())
+            .unwrap_or("")
+    }
+    fn has_display_override(&self, _index: usize) -> bool {
+        false
+    }
+}

canvas/src/suggestions.rs

@@ -0,0 +1,67 @@
+// canvas/src/suggestions.rs
+
+/// Generic suggestion system that can be implemented by any CanvasState
+#[derive(Debug, Clone)]
+pub struct SuggestionState {
+    pub suggestions: Vec<String>,
+    pub selected_index: Option<usize>,
+    pub is_active: bool,
+    pub trigger_chars: Vec<char>, // Characters that trigger suggestions
+}
+
+impl Default for SuggestionState {
+    fn default() -> Self {
+        Self {
+            suggestions: Vec::new(),
+            selected_index: None,
+            is_active: false,
+            trigger_chars: vec![], // No auto-trigger by default
+        }
+    }
+}
+
+impl SuggestionState {
+    pub fn new(trigger_chars: Vec<char>) -> Self {
+        Self {
+            trigger_chars,
+            ..Default::default()
+        }
+    }
+    
+    pub fn activate_with_suggestions(&mut self, suggestions: Vec<String>) {
+        self.suggestions = suggestions;
+        self.is_active = !self.suggestions.is_empty();
+        self.selected_index = if self.is_active { Some(0) } else { None };
+    }
+    
+    pub fn deactivate(&mut self) {
+        self.suggestions.clear();
+        self.selected_index = None;
+        self.is_active = false;
+    }
+    
+    pub fn select_next(&mut self) {
+        if !self.suggestions.is_empty() {
+            let current = self.selected_index.unwrap_or(0);
+            self.selected_index = Some((current + 1) % self.suggestions.len());
+        }
+    }
+    
+    pub fn select_previous(&mut self) {
+        if !self.suggestions.is_empty() {
+            let current = self.selected_index.unwrap_or(0);
+            self.selected_index = Some(
+                if current == 0 { self.suggestions.len() - 1 } else { current - 1 }
+            );
+        }
+    }
+    
+    pub fn get_selected(&self) -> Option<&String> {
+        self.selected_index
+            .and_then(|idx| self.suggestions.get(idx))
+    }
+    
+    pub fn should_trigger(&self, c: char) -> bool {
+        self.trigger_chars.contains(&c)
+    }
+}

client/Cargo.toml

@@ -5,22 +5,23 @@ edition.workspace = true
 license.workspace = true
 
 [dependencies]
-anyhow = "1.0.98"
+anyhow = { workspace = true }
 async-trait = "0.1.88"
 common = { path = "../common" }
+canvas = { path = "../canvas" }
 
+ratatui = { workspace = true }
+crossterm = { workspace = true }
 prost-types = { workspace = true }
-crossterm = "0.28.1"
 dirs = "6.0.0"
 dotenvy = "0.15.7"
 lazy_static = "1.5.0"
 prost = "0.13.5"
-ratatui = { version = "0.29.0", features = ["crossterm"] }
 serde = { version = "1.0.219", features = ["derive"] }
 serde_json = "1.0.140"
 time = "0.3.41"
 tokio = { version = "1.44.2", features = ["full", "macros"] }
-toml = "0.8.20"
+toml = { workspace = true }
 tonic = "0.13.0"
 tracing = "0.1.41"
 tracing-subscriber = "0.3.19"

client/canvas_config.toml

@@ -0,0 +1,56 @@
+# canvas_config.toml - Complete Canvas Configuration
+
+[behavior]
+wrap_around_fields = true
+auto_save_on_field_change = false
+word_chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789_"
+max_suggestions = 6
+
+[appearance]
+cursor_style = "block"  # "block", "bar", "underline"
+show_field_numbers = false
+highlight_current_field = true
+
+# Read-only mode keybindings (vim-style)
+[keybindings.read_only]
+move_left = ["h"]
+move_right = ["l"] 
+move_up = ["k"]
+move_down = ["j"]
+move_word_next = ["w"]
+move_word_end = ["e"]
+move_word_prev = ["b"]
+move_word_end_prev = ["ge"]
+move_line_start = ["0"]
+move_line_end = ["$"]
+move_first_line = ["gg"]
+move_last_line = ["CapsLock"]
+next_field = ["Tab"]
+prev_field = ["Shift+Tab"]
+
+# Edit mode keybindings
+[keybindings.edit]
+delete_char_backward = ["Backspace"]
+delete_char_forward = ["Delete"]
+move_left = ["Left"]
+move_right = ["Right"]
+move_up = ["Up"]
+move_down = ["Down"]
+move_line_start = ["Home"]
+move_line_end = ["End"]
+move_word_next = ["Ctrl+Right"]
+move_word_prev = ["Ctrl+Left"]
+next_field = ["Tab"]
+prev_field = ["Shift+Tab"]
+
+# Suggestion/autocomplete keybindings
+[keybindings.suggestions]
+suggestion_up = ["Up", "Ctrl+p"]
+suggestion_down = ["Down", "Ctrl+n"]
+select_suggestion = ["Enter", "Tab"]
+exit_suggestions = ["Esc"]
+
+# Global keybindings (work in both modes)
+[keybindings.global]
+move_up = ["Up"]
+move_down = ["Down"]

client/config.toml

@@ -2,9 +2,9 @@
 [keybindings]
 
 enter_command_mode = [":", "ctrl+;"]
-next_buffer = ["ctrl+l"]
-previous_buffer = ["ctrl+h"] 
-close_buffer = ["ctrl+k"]
+next_buffer = ["space+b+n"]
+previous_buffer = ["space+b+p"] 
+close_buffer = ["space+b+d"]
 
 [keybindings.general]
 move_up = ["k", "Up"]
@@ -22,8 +22,6 @@ open_search = ["ctrl+f"]
 [keybindings.common]
 save = ["ctrl+s"]
 quit = ["ctrl+q"]
-# !!!change to space b r in the future and from edit mode 
-revert = ["ctrl+r"]
 
 force_quit = ["ctrl+shift+q"]
 save_and_quit = ["ctrl+shift+s"]
@@ -39,6 +37,7 @@ enter_edit_mode_before = ["i"]
 enter_edit_mode_after = ["a"]
 previous_entry = ["left","q"]
 next_entry = ["right","1"]
+revert = ["space+b+r"]
 
 move_left = ["h"]
 move_right = ["l"]

client/src/components/form/form.rs

@@ -3,7 +3,7 @@ use crate::components::common::autocomplete;
 use crate::components::handlers::canvas::render_canvas;
 use crate::config::colors::themes::Theme;
 use crate::state::app::highlight::HighlightState;
-use crate::state::pages::canvas_state::CanvasState;
+use canvas::CanvasState;
 use crate::state::pages::form::FormState;
 use ratatui::{
     layout::{Alignment, Constraint, Direction, Layout, Margin, Rect},
@@ -64,7 +64,7 @@ pub fn render_form(
     f.render_widget(count_para, main_layout[0]);
 
     // Get the active field's rect from render_canvas
-    let active_field_rect = render_canvas(
+    let active_field_rect = crate::components::handlers::canvas::render_canvas_library(
         f,
         main_layout[1],
         form_state,

client/src/components/handlers/canvas.rs

@@ -9,13 +9,15 @@ use ratatui::{
 };
 use crate::config::colors::themes::Theme;
 use crate::state::app::highlight::HighlightState;
-use crate::state::pages::canvas_state::CanvasState;
+use crate::state::pages::canvas_state::CanvasState as LegacyCanvasState;
+use canvas::CanvasState as LibraryCanvasState;
 use std::cmp::{max, min};
 
+/// Render canvas for legacy CanvasState (AddTableState, LoginState, RegisterState, AddLogicState)
 pub fn render_canvas(
     f: &mut Frame,
     area: Rect,
-    form_state: &impl CanvasState,
+    form_state: &impl LegacyCanvasState,
     fields: &[&str],
     current_field_idx: &usize,
     inputs: &[&String],
@@ -23,12 +25,75 @@ pub fn render_canvas(
     is_edit_mode: bool,
     highlight_state: &HighlightState,
 ) -> Option<Rect> {
+    render_canvas_impl(
+        f,
+        area,
+        fields,
+        current_field_idx,
+        inputs,
+        theme,
+        is_edit_mode,
+        highlight_state,
+        form_state.current_cursor_pos(),
+        form_state.has_unsaved_changes(),
+        |i| form_state.get_display_value_for_field(i).to_string(),
+        |i| form_state.has_display_override(i),
+    )
+}
+
+/// Render canvas for library CanvasState (FormState)
+pub fn render_canvas_library(
+    f: &mut Frame,
+    area: Rect,
+    form_state: &impl LibraryCanvasState,
+    fields: &[&str],
+    current_field_idx: &usize,
+    inputs: &[&String],
+    theme: &Theme,
+    is_edit_mode: bool,
+    highlight_state: &HighlightState,
+) -> Option<Rect> {
+    render_canvas_impl(
+        f,
+        area,
+        fields,
+        current_field_idx,
+        inputs,
+        theme,
+        is_edit_mode,
+        highlight_state,
+        form_state.current_cursor_pos(),
+        form_state.has_unsaved_changes(),
+        |i| form_state.get_display_value_for_field(i).to_string(),
+        |i| form_state.has_display_override(i),
+    )
+}
+
+/// Internal implementation shared by both render functions
+fn render_canvas_impl<F1, F2>(
+    f: &mut Frame,
+    area: Rect,
+    fields: &[&str],
+    current_field_idx: &usize,
+    inputs: &[&String],
+    theme: &Theme,
+    is_edit_mode: bool,
+    highlight_state: &HighlightState,
+    current_cursor_pos: usize,
+    has_unsaved_changes: bool,
+    get_display_value: F1,
+    has_display_override: F2,
+) -> Option<Rect>
+where
+    F1: Fn(usize) -> String,
+    F2: Fn(usize) -> bool,
+{
     let columns = Layout::default()
         .direction(Direction::Horizontal)
         .constraints([Constraint::Percentage(30), Constraint::Percentage(70)])
         .split(area);
 
-    let border_style = if form_state.has_unsaved_changes() {
+    let border_style = if has_unsaved_changes {
         Style::default().fg(theme.warning)
     } else if is_edit_mode {
         Style::default().fg(theme.accent)
@@ -75,17 +140,16 @@ pub fn render_canvas(
 
     for (i, _input) in inputs.iter().enumerate() {
         let is_active = i == *current_field_idx;
-        let current_cursor_pos = form_state.current_cursor_pos();
 
-        // Use the trait method to get display value
-        let text = form_state.get_display_value_for_field(i);
+        // Use the provided closure to get display value
+        let text = get_display_value(i);
         let text_len = text.chars().count();
         let line: Line;
 
         match highlight_state {
             HighlightState::Off => {
                 line = Line::from(Span::styled(
-                    text,
+                    &text,
                     if is_active {
                         Style::default().fg(theme.highlight)
                     } else {
@@ -141,11 +205,11 @@ pub fn render_canvas(
                             Span::styled(after, normal_style_in_highlight),
                         ]);
                     } else {
-                        line = Line::from(Span::styled(text, highlight_style));
+                        line = Line::from(Span::styled(&text, highlight_style));
                     }
                 } else {
                     line = Line::from(Span::styled(
-                        text,
+                        &text,
                         if is_active { normal_style_in_highlight } else { normal_style_outside }
                     ));
                 }
@@ -158,10 +222,10 @@ pub fn render_canvas(
                 let normal_style_outside = Style::default().fg(theme.fg);
 
                 if i >= start_field && i <= end_field {
-                    line = Line::from(Span::styled(text, highlight_style));
+                    line = Line::from(Span::styled(&text, highlight_style));
                 } else {
                     line = Line::from(Span::styled(
-                        text,
+                        &text,
                         if is_active { normal_style_in_highlight } else { normal_style_outside }
                     ));
                 }
@@ -174,14 +238,13 @@ pub fn render_canvas(
         if is_active {
             active_field_input_rect = Some(input_rows[i]);
 
-            // --- CORRECTED CURSOR POSITIONING LOGIC ---
-            // Use the new generic trait method to check for an override.
-            let cursor_x = if form_state.has_display_override(i) {
+            // Use the provided closure to check for display override
+            let cursor_x = if has_display_override(i) {
                 // If an override exists, place the cursor at the end.
                 input_rows[i].x + text.chars().count() as u16
             } else {
                 // Otherwise, use the real cursor position.
-                input_rows[i].x + form_state.current_cursor_pos() as u16
+                input_rows[i].x + current_cursor_pos as u16
             };
             let cursor_y = input_rows[i].y;
             f.set_cursor_position((cursor_x, cursor_y));

client/src/config/binds/config.rs

@@ -251,47 +251,206 @@ impl Config {
         key: KeyCode,
         modifiers: KeyModifiers,
     ) -> bool {
-        // For multi-character bindings without modifiers, handle them in matches_key_sequence.
+        // Special handling for shift+character combinations
+        if binding.to_lowercase().starts_with("shift+") {
+            let parts: Vec<&str> = binding.split('+').collect();
+            if parts.len() == 2 && parts[1].len() == 1 {
+                let expected_lowercase = parts[1].chars().next().unwrap().to_lowercase().next().unwrap();
+                let expected_uppercase = expected_lowercase.to_uppercase().next().unwrap();
+                if let KeyCode::Char(actual_char) = key {
+                    if actual_char == expected_uppercase && modifiers.contains(KeyModifiers::SHIFT) {
+                        return true;
+                    }
+                }
+            }
+        }
+
+        // Handle Shift+Tab -> BackTab
+        if binding.to_lowercase() == "shift+tab" && key == KeyCode::BackTab && modifiers.is_empty() {
+            return true;
+        }
+
+        // Handle multi-character bindings (all standard keys without modifiers)
         if binding.len() > 1 && !binding.contains('+') {
             return match binding.to_lowercase().as_str() {
+                // Navigation keys
                 "left" => key == KeyCode::Left,
                 "right" => key == KeyCode::Right,
                 "up" => key == KeyCode::Up,
                 "down" => key == KeyCode::Down,
-                "esc" => key == KeyCode::Esc,
-                "enter" => key == KeyCode::Enter,
-                "delete" => key == KeyCode::Delete,
+                "home" => key == KeyCode::Home,
+                "end" => key == KeyCode::End,
+                "pageup" | "pgup" => key == KeyCode::PageUp,
+                "pagedown" | "pgdn" => key == KeyCode::PageDown,
+                
+                // Editing keys
+                "insert" | "ins" => key == KeyCode::Insert,
+                "delete" | "del" => key == KeyCode::Delete,
                 "backspace" => key == KeyCode::Backspace,
+                
+                // Tab keys
                 "tab" => key == KeyCode::Tab,
                 "backtab" => key == KeyCode::BackTab,
-                _ => false,
+                
+                // Special keys
+                "enter" | "return" => key == KeyCode::Enter,
+                "escape" | "esc" => key == KeyCode::Esc,
+                "space" => key == KeyCode::Char(' '),
+                
+                // Function keys F1-F24
+                "f1" => key == KeyCode::F(1),
+                "f2" => key == KeyCode::F(2),
+                "f3" => key == KeyCode::F(3),
+                "f4" => key == KeyCode::F(4),
+                "f5" => key == KeyCode::F(5),
+                "f6" => key == KeyCode::F(6),
+                "f7" => key == KeyCode::F(7),
+                "f8" => key == KeyCode::F(8),
+                "f9" => key == KeyCode::F(9),
+                "f10" => key == KeyCode::F(10),
+                "f11" => key == KeyCode::F(11),
+                "f12" => key == KeyCode::F(12),
+                "f13" => key == KeyCode::F(13),
+                "f14" => key == KeyCode::F(14),
+                "f15" => key == KeyCode::F(15),
+                "f16" => key == KeyCode::F(16),
+                "f17" => key == KeyCode::F(17),
+                "f18" => key == KeyCode::F(18),
+                "f19" => key == KeyCode::F(19),
+                "f20" => key == KeyCode::F(20),
+                "f21" => key == KeyCode::F(21),
+                "f22" => key == KeyCode::F(22),
+                "f23" => key == KeyCode::F(23),
+                "f24" => key == KeyCode::F(24),
+                
+                // Lock keys
+                "capslock" => key == KeyCode::CapsLock,
+                "scrolllock" => key == KeyCode::ScrollLock,
+                "numlock" => key == KeyCode::NumLock,
+                
+                // System keys
+                "printscreen" => key == KeyCode::PrintScreen,
+                "pause" => key == KeyCode::Pause,
+                "menu" => key == KeyCode::Menu,
+                "keypadbegin" => key == KeyCode::KeypadBegin,
+                
+                // Media keys
+                "mediaplay" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Play),
+                "mediapause" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Pause),
+                "mediaplaypause" => key == KeyCode::Media(crossterm::event::MediaKeyCode::PlayPause),
+                "mediareverse" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Reverse),
+                "mediastop" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Stop),
+                "mediafastforward" => key == KeyCode::Media(crossterm::event::MediaKeyCode::FastForward),
+                "mediarewind" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Rewind),
+                "mediatracknext" => key == KeyCode::Media(crossterm::event::MediaKeyCode::TrackNext),
+                "mediatrackprevious" => key == KeyCode::Media(crossterm::event::MediaKeyCode::TrackPrevious),
+                "mediarecord" => key == KeyCode::Media(crossterm::event::MediaKeyCode::Record),
+                "medialowervolume" => key == KeyCode::Media(crossterm::event::MediaKeyCode::LowerVolume),
+                "mediaraisevolume" => key == KeyCode::Media(crossterm::event::MediaKeyCode::RaiseVolume),
+                "mediamutevolume" => key == KeyCode::Media(crossterm::event::MediaKeyCode::MuteVolume),
+                
+                // Multi-key sequences need special handling
+                "gg" => false, // This needs sequence handling
+                _ => {
+                    // Handle single characters and punctuation
+                    if binding.len() == 1 {
+                        if let Some(c) = binding.chars().next() {
+                            key == KeyCode::Char(c)
+                        } else {
+                            false
+                        }
+                    } else {
+                        false
+                    }
+                }
             };
         }
 
+        // Handle modifier combinations (like "Ctrl+F5", "Alt+Shift+A")
         let parts: Vec<&str> = binding.split('+').collect();
         let mut expected_modifiers = KeyModifiers::empty();
         let mut expected_key = None;
 
         for part in parts {
             match part.to_lowercase().as_str() {
-                "ctrl" => expected_modifiers |= KeyModifiers::CONTROL,
+                // Modifiers
+                "ctrl" | "control" => expected_modifiers |= KeyModifiers::CONTROL,
                 "shift" => expected_modifiers |= KeyModifiers::SHIFT,
                 "alt" => expected_modifiers |= KeyModifiers::ALT,
+                "super" | "windows" | "cmd" => expected_modifiers |= KeyModifiers::SUPER,
+                "hyper" => expected_modifiers |= KeyModifiers::HYPER,
+                "meta" => expected_modifiers |= KeyModifiers::META,
+                
+                // Navigation keys
                 "left" => expected_key = Some(KeyCode::Left),
                 "right" => expected_key = Some(KeyCode::Right),
                 "up" => expected_key = Some(KeyCode::Up),
                 "down" => expected_key = Some(KeyCode::Down),
-                "esc" => expected_key = Some(KeyCode::Esc),
-                "enter" => expected_key = Some(KeyCode::Enter),
-                "delete" => expected_key = Some(KeyCode::Delete),
+                "home" => expected_key = Some(KeyCode::Home),
+                "end" => expected_key = Some(KeyCode::End),
+                "pageup" | "pgup" => expected_key = Some(KeyCode::PageUp),
+                "pagedown" | "pgdn" => expected_key = Some(KeyCode::PageDown),
+                
+                // Editing keys
+                "insert" | "ins" => expected_key = Some(KeyCode::Insert),
+                "delete" | "del" => expected_key = Some(KeyCode::Delete),
                 "backspace" => expected_key = Some(KeyCode::Backspace),
+                
+                // Tab keys
                 "tab" => expected_key = Some(KeyCode::Tab),
                 "backtab" => expected_key = Some(KeyCode::BackTab),
+                
+                // Special keys
+                "enter" | "return" => expected_key = Some(KeyCode::Enter),
+                "escape" | "esc" => expected_key = Some(KeyCode::Esc),
+                "space" => expected_key = Some(KeyCode::Char(' ')),
+                
+                // Function keys
+                "f1" => expected_key = Some(KeyCode::F(1)),
+                "f2" => expected_key = Some(KeyCode::F(2)),
+                "f3" => expected_key = Some(KeyCode::F(3)),
+                "f4" => expected_key = Some(KeyCode::F(4)),
+                "f5" => expected_key = Some(KeyCode::F(5)),
+                "f6" => expected_key = Some(KeyCode::F(6)),
+                "f7" => expected_key = Some(KeyCode::F(7)),
+                "f8" => expected_key = Some(KeyCode::F(8)),
+                "f9" => expected_key = Some(KeyCode::F(9)),
+                "f10" => expected_key = Some(KeyCode::F(10)),
+                "f11" => expected_key = Some(KeyCode::F(11)),
+                "f12" => expected_key = Some(KeyCode::F(12)),
+                "f13" => expected_key = Some(KeyCode::F(13)),
+                "f14" => expected_key = Some(KeyCode::F(14)),
+                "f15" => expected_key = Some(KeyCode::F(15)),
+                "f16" => expected_key = Some(KeyCode::F(16)),
+                "f17" => expected_key = Some(KeyCode::F(17)),
+                "f18" => expected_key = Some(KeyCode::F(18)),
+                "f19" => expected_key = Some(KeyCode::F(19)),
+                "f20" => expected_key = Some(KeyCode::F(20)),
+                "f21" => expected_key = Some(KeyCode::F(21)),
+                "f22" => expected_key = Some(KeyCode::F(22)),
+                "f23" => expected_key = Some(KeyCode::F(23)),
+                "f24" => expected_key = Some(KeyCode::F(24)),
+                
+                // Lock keys
+                "capslock" => expected_key = Some(KeyCode::CapsLock),
+                "scrolllock" => expected_key = Some(KeyCode::ScrollLock),
+                "numlock" => expected_key = Some(KeyCode::NumLock),
+                
+                // System keys
+                "printscreen" => expected_key = Some(KeyCode::PrintScreen),
+                "pause" => expected_key = Some(KeyCode::Pause),
+                "menu" => expected_key = Some(KeyCode::Menu),
+                "keypadbegin" => expected_key = Some(KeyCode::KeypadBegin),
+                
+                // Special characters and colon (legacy support)
                 ":" => expected_key = Some(KeyCode::Char(':')),
+                
+                // Single character (letters, numbers, punctuation)
                 part => {
                     if part.len() == 1 {
-                        let c = part.chars().next().unwrap();
-                        expected_key = Some(KeyCode::Char(c));
+                        if let Some(c) = part.chars().next() {
+                            expected_key = Some(KeyCode::Char(c));
+                        }
                     }
                 }
             }

client/src/config/binds/key_sequences.rs

@@ -149,14 +149,17 @@ fn parse_key_part(part: &str) -> Option<ParsedKey> {
     let mut code = None;
 
     if part.contains('+') {
-        // This handles modifiers like "ctrl+s"
+        // This handles modifiers like "ctrl+s", "super+shift+f5"
         let components: Vec<&str> = part.split('+').collect();
 
         for component in components {
             match component.to_lowercase().as_str() {
-                "ctrl" => modifiers |= KeyModifiers::CONTROL,
+                "ctrl" | "control" => modifiers |= KeyModifiers::CONTROL,
                 "shift" => modifiers |= KeyModifiers::SHIFT,
                 "alt" => modifiers |= KeyModifiers::ALT,
+                "super" | "windows" | "cmd" => modifiers |= KeyModifiers::SUPER,
+                "hyper" => modifiers |= KeyModifiers::HYPER,
+                "meta" => modifiers |= KeyModifiers::META,
                 _ => {
                     // Last component is the key
                     code = string_to_keycode(component);

client/src/functions/modes/edit/form_e.rs

@@ -1,13 +1,13 @@
 // src/functions/modes/edit/form_e.rs
 
 use crate::services::grpc_client::GrpcClient;
-use crate::state::pages::canvas_state::CanvasState;
 use crate::state::pages::form::FormState;
 use crate::state::app::state::AppState;
 use crate::tui::functions::common::form::{revert, save};
 use crate::tui::functions::common::form::SaveOutcome;
 use crate::modes::handlers::event::EventOutcome;
 use crossterm::event::{KeyCode, KeyEvent};
+use canvas::CanvasState;
 use std::any::Any;
 use anyhow::Result;
 

client/src/functions/modes/read_only/form_ro.rs

@@ -1,7 +1,7 @@
 // src/functions/modes/read_only/form_ro.rs
 
 use crate::config::binds::key_sequences::KeySequenceTracker;
-use crate::state::pages::canvas_state::CanvasState;
+use canvas::CanvasState;
 use anyhow::Result;
 
 #[derive(PartialEq)]

client/src/modes/canvas/edit.rs

@@ -9,9 +9,10 @@ use crate::state::app::state::AppState;
 use crate::state::pages::admin::AdminState;
 use crate::state::pages::{
     auth::{LoginState, RegisterState},
-    canvas_state::CanvasState,
     form::FormState,
 };
+use canvas::CanvasState;
+use canvas::{CanvasAction, ActionDispatcher, ActionResult};
 use anyhow::Result;
 use common::proto::komp_ac::search::search_response::Hit;
 use crossterm::event::{KeyCode, KeyEvent};
@@ -74,6 +75,57 @@ async fn trigger_form_autocomplete_search(
     }
 }
 
+pub async fn handle_form_edit_with_canvas(
+    key_event: KeyEvent,
+    config: &Config,
+    form_state: &mut FormState,
+    ideal_cursor_column: &mut usize,
+) -> Result<String> {
+    // Try canvas action from key first
+    if let Some(canvas_action) = CanvasAction::from_key(key_event.code) {
+        match ActionDispatcher::dispatch(canvas_action, form_state, ideal_cursor_column).await {
+            Ok(ActionResult::Success(msg)) => {
+                return Ok(msg.unwrap_or_default());
+            }
+            Ok(ActionResult::HandledByFeature(msg)) => {
+                return Ok(msg);
+            }
+            Ok(ActionResult::Error(msg)) => {
+                return Ok(format!("Error: {}", msg));
+            }
+            Ok(ActionResult::RequiresContext(msg)) => {
+                return Ok(format!("Context needed: {}", msg));
+            }
+            Err(_) => {
+                // Fall through to try config mapping
+            }
+        }
+    }
+
+    // Try config-mapped action
+    if let Some(action_str) = config.get_edit_action_for_key(key_event.code, key_event.modifiers) {
+        let canvas_action = CanvasAction::from_string(&action_str);
+        match ActionDispatcher::dispatch(canvas_action, form_state, ideal_cursor_column).await {
+            Ok(ActionResult::Success(msg)) => {
+                return Ok(msg.unwrap_or_default());
+            }
+            Ok(ActionResult::HandledByFeature(msg)) => {
+                return Ok(msg);
+            }
+            Ok(ActionResult::Error(msg)) => {
+                return Ok(format!("Error: {}", msg));
+            }
+            Ok(ActionResult::RequiresContext(msg)) => {
+                return Ok(format!("Context needed: {}", msg));
+            }
+            Err(e) => {
+                return Ok(format!("Action failed: {}", e));
+            }
+        }
+    }
+
+    Ok(String::new())
+}
 
 #[allow(clippy::too_many_arguments)]
 pub async fn handle_edit_event(
@@ -118,7 +170,7 @@ pub async fn handle_edit_event(
                     return Ok(EditEventOutcome::Message(String::new()));
                 }
                 "exit" => {
-                    form_state.deactivate_autocomplete();
+                    form_state.deactivate_suggestions();
                     return Ok(EditEventOutcome::Message(
                         "Autocomplete cancelled".to_string(),
                     ));
@@ -150,14 +202,14 @@ pub async fn handle_edit_event(
                             );
 
                             // 4. Finalize state
-                            form_state.deactivate_autocomplete();
+                            form_state.deactivate_suggestions();
                             form_state.set_has_unsaved_changes(true);
                             return Ok(EditEventOutcome::Message(
                                 "Selection made".to_string(),
                             ));
                         }
                     }
-                    form_state.deactivate_autocomplete();
+                    form_state.deactivate_suggestions();
                     // Fall through to default 'enter' behavior
                 }
                 _ => {} // Let other keys fall through to the live search logic

client/src/modes/canvas/read_only.rs

@@ -10,9 +10,62 @@ use crate::state::pages::add_logic::AddLogicState;
 use crate::state::pages::add_table::AddTableState;
 use crate::state::app::state::AppState;
 use crate::functions::modes::read_only::{add_logic_ro, auth_ro, form_ro, add_table_ro};
+use canvas::{CanvasAction, ActionDispatcher, ActionResult};
 use crossterm::event::KeyEvent;
 use anyhow::Result;
 
+pub async fn handle_form_readonly_with_canvas(
+    key_event: KeyEvent,
+    config: &Config,
+    form_state: &mut FormState,
+    ideal_cursor_column: &mut usize,
+) -> Result<String> {
+    // Try canvas action from key first
+    if let Some(canvas_action) = CanvasAction::from_key(key_event.code) {
+        match ActionDispatcher::dispatch(canvas_action, form_state, ideal_cursor_column).await {
+            Ok(ActionResult::Success(msg)) => {
+                return Ok(msg.unwrap_or_default());
+            }
+            Ok(ActionResult::HandledByFeature(msg)) => {
+                return Ok(msg);
+            }
+            Ok(ActionResult::Error(msg)) => {
+                return Ok(format!("Error: {}", msg));
+            }
+            Ok(ActionResult::RequiresContext(msg)) => {
+                return Ok(format!("Context needed: {}", msg));
+            }
+            Err(_) => {
+                // Fall through to try config mapping
+            }
+        }
+    }
+
+    // Try config-mapped action
+    if let Some(action_str) = config.get_read_only_action_for_key(key_event.code, key_event.modifiers) {
+        let canvas_action = CanvasAction::from_string(&action_str);
+        match ActionDispatcher::dispatch(canvas_action, form_state, ideal_cursor_column).await {
+            Ok(ActionResult::Success(msg)) => {
+                return Ok(msg.unwrap_or_default());
+            }
+            Ok(ActionResult::HandledByFeature(msg)) => {
+                return Ok(msg);
+            }
+            Ok(ActionResult::Error(msg)) => {
+                return Ok(format!("Error: {}", msg));
+            }
+            Ok(ActionResult::RequiresContext(msg)) => {
+                return Ok(format!("Context needed: {}", msg));
+            }
+            Err(e) => {
+                return Ok(format!("Action failed: {}", e));
+            }
+        }
+    }
+
+    Ok(String::new())
+}
+
 pub async fn handle_read_only_event(
     app_state: &mut AppState,
     key: KeyEvent,
@@ -36,18 +89,46 @@ pub async fn handle_read_only_event(
 
     if config.is_enter_edit_mode_after(key.code, key.modifiers) {
         // Determine target state to adjust cursor
-        let target_state: &mut dyn CanvasState = if app_state.ui.show_login { login_state }
-            else if app_state.ui.show_add_logic { add_logic_state }
-            else if app_state.ui.show_register { register_state }
-            else if app_state.ui.show_add_table { add_table_state }
-            else { form_state };
-        let current_input = target_state.get_current_input();
-        let current_pos = target_state.current_cursor_pos();
 
-        if !current_input.is_empty() && current_pos < current_input.len() {
-            target_state.set_current_cursor_pos(current_pos + 1);
-            *ideal_cursor_column = target_state.current_cursor_pos();
+        if app_state.ui.show_login {
+            let current_input = login_state.get_current_input();
+            let current_pos = login_state.current_cursor_pos();
+            if !current_input.is_empty() && current_pos < current_input.len() {
+                login_state.set_current_cursor_pos(current_pos + 1);
+                *ideal_cursor_column = login_state.current_cursor_pos();
+            }
+        } else if app_state.ui.show_add_logic {
+            let current_input = add_logic_state.get_current_input();
+            let current_pos = add_logic_state.current_cursor_pos();
+            if !current_input.is_empty() && current_pos < current_input.len() {
+                add_logic_state.set_current_cursor_pos(current_pos + 1);
+                *ideal_cursor_column = add_logic_state.current_cursor_pos();
+            }
+        } else if app_state.ui.show_register {
+            let current_input = register_state.get_current_input();
+            let current_pos = register_state.current_cursor_pos();
+            if !current_input.is_empty() && current_pos < current_input.len() {
+                register_state.set_current_cursor_pos(current_pos + 1);
+                *ideal_cursor_column = register_state.current_cursor_pos();
+            }
+        } else if app_state.ui.show_add_table {
+            let current_input = add_table_state.get_current_input();
+            let current_pos = add_table_state.current_cursor_pos();
+            if !current_input.is_empty() && current_pos < current_input.len() {
+                add_table_state.set_current_cursor_pos(current_pos + 1);
+                *ideal_cursor_column = add_table_state.current_cursor_pos();
+            }
+        } else {
+            // Handle FormState (uses library CanvasState)
+            use canvas::CanvasState as LibraryCanvasState;  // Import at the top of the function
+            let current_input = form_state.get_current_input();
+            let current_pos = form_state.current_cursor_pos();
+            if !current_input.is_empty() && current_pos < current_input.len() {
+                form_state.set_current_cursor_pos(current_pos + 1);
+                *ideal_cursor_column = form_state.current_cursor_pos();
+            }
         }
+
         *edit_mode_cooldown = true;
         *command_message = "Entering Edit mode (after cursor)".to_string();
         return Ok((false, command_message.clone()));

client/src/modes/handlers.rs

@@ -1,3 +1,4 @@
-// src/client/modes/handlers.rs
+// src/modes/handlers.rs
 pub mod event;
+pub mod event_helper;
 pub mod mode_manager;

client/src/modes/handlers/event.rs

@@ -15,8 +15,12 @@ use crate::modes::{
     general::{dialog, navigation},
     handlers::mode_manager::{AppMode, ModeManager},
 };
+use crate::state::pages::canvas_state::CanvasState as LegacyCanvasState;
 use crate::services::auth::AuthClient;
 use crate::services::grpc_client::GrpcClient;
+use canvas::{CanvasAction, ActionDispatcher, ActionResult};
+use canvas::CanvasState as LibraryCanvasState;
+use super::event_helper::*;
 use crate::state::{
     app::{
         buffer::{AppView, BufferState},
@@ -573,55 +577,106 @@ impl EventHandler {
                 }
 
                 AppMode::ReadOnly => {
-                    if config.get_read_only_action_for_key(key_code, modifiers) == Some("enter_highlight_mode_linewise") && ModeManager::can_enter_highlight_mode(current_mode) {
-                        let current_field_index = if app_state.ui.show_login { login_state.current_field() } else if app_state.ui.show_register { register_state.current_field() } else { form_state.current_field() };
-                        self.highlight_state = HighlightState::Linewise { anchor_line: current_field_index };
+                    // Handle highlight mode transitions
+                    if config.get_read_only_action_for_key(key_code, modifiers) == Some("enter_highlight_mode_linewise")
+                        && ModeManager::can_enter_highlight_mode(current_mode)
+                    {
+                        let current_field_index = get_current_field_for_state(
+                            app_state,
+                            login_state,
+                            register_state,
+                            form_state
+                        );
+                        self.highlight_state = HighlightState::Linewise {
+                            anchor_line: current_field_index
+                        };
                         self.command_message = "-- LINE HIGHLIGHT --".to_string();
                         return Ok(EventOutcome::Ok(self.command_message.clone()));
-                    } else if config.get_read_only_action_for_key(key_code, modifiers) == Some("enter_highlight_mode") && ModeManager::can_enter_highlight_mode(current_mode) {
-                        let current_field_index = if app_state.ui.show_login { login_state.current_field() } else if app_state.ui.show_register { register_state.current_field() } else { form_state.current_field() };
-                        let current_cursor_pos = if app_state.ui.show_login { login_state.current_cursor_pos() } else if app_state.ui.show_register { register_state.current_cursor_pos() } else { form_state.current_cursor_pos() };
+                    }
+                    else if config.get_read_only_action_for_key(key_code, modifiers) == Some("enter_highlight_mode")
+                        && ModeManager::can_enter_highlight_mode(current_mode)
+                    {
+                        let current_field_index = get_current_field_for_state(
+                            app_state,
+                            login_state,
+                            register_state,
+                            form_state
+                        );
+                        let current_cursor_pos = get_current_cursor_pos_for_state(
+                            app_state,
+                            login_state,
+                            register_state,
+                            form_state
+                        );
                         let anchor = (current_field_index, current_cursor_pos);
                         self.highlight_state = HighlightState::Characterwise { anchor };
                         self.command_message = "-- HIGHLIGHT --".to_string();
                         return Ok(EventOutcome::Ok(self.command_message.clone()));
-                    } else if config.get_read_only_action_for_key(key_code, modifiers).as_deref() == Some("enter_edit_mode_before") && ModeManager::can_enter_edit_mode(current_mode) {
+                    }
+
+                    // Handle edit mode transitions
+                    else if config.get_read_only_action_for_key(key_code, modifiers).as_deref() == Some("enter_edit_mode_before")
+                        && ModeManager::can_enter_edit_mode(current_mode)
+                    {
                         self.is_edit_mode = true;
                         self.edit_mode_cooldown = true;
                         self.command_message = "Edit mode".to_string();
                         terminal.set_cursor_style(SetCursorStyle::BlinkingBar)?;
                         return Ok(EventOutcome::Ok(self.command_message.clone()));
-                    } else if config.get_read_only_action_for_key(key_code, modifiers).as_deref() == Some("enter_edit_mode_after") && ModeManager::can_enter_edit_mode(current_mode) {
-                        let current_input = if app_state.ui.show_login || app_state.ui.show_register { login_state.get_current_input() } else { form_state.get_current_input() };
-                        let current_cursor_pos = if app_state.ui.show_login || app_state.ui.show_register { login_state.current_cursor_pos() } else { form_state.current_cursor_pos() };
+                    }
+                    else if config.get_read_only_action_for_key(key_code, modifiers).as_deref() == Some("enter_edit_mode_after")
+                        && ModeManager::can_enter_edit_mode(current_mode)
+                    {
+                        let current_input = get_current_input_for_state(
+                            app_state,
+                            login_state,
+                            register_state,
+                            form_state
+                        );
+                        let current_cursor_pos = get_cursor_pos_for_mixed_state(
+                            app_state,
+                            login_state,
+                            form_state
+                        );
+
+                        // Move cursor forward if possible
                         if !current_input.is_empty() && current_cursor_pos < current_input.len() {
-                            if app_state.ui.show_login || app_state.ui.show_register {
-                                login_state.set_current_cursor_pos(current_cursor_pos + 1);
-                                self.ideal_cursor_column = login_state.current_cursor_pos();
-                            } else {
-                                form_state.set_current_cursor_pos(current_cursor_pos + 1);
-                                self.ideal_cursor_column = form_state.current_cursor_pos();
-                            }
+                            let new_cursor_pos = current_cursor_pos + 1;
+                            set_current_cursor_pos_for_state(
+                                app_state,
+                                login_state,
+                                register_state,
+                                form_state,
+                                new_cursor_pos
+                            );
+                            self.ideal_cursor_column = get_current_cursor_pos_for_state(
+                                app_state,
+                                login_state,
+                                register_state,
+                                form_state
+                            );
                         }
+
                         self.is_edit_mode = true;
                         self.edit_mode_cooldown = true;
                         app_state.ui.focus_outside_canvas = false;
                         self.command_message = "Edit mode (after cursor)".to_string();
                         terminal.set_cursor_style(SetCursorStyle::BlinkingBar)?;
                         return Ok(EventOutcome::Ok(self.command_message.clone()));
-                    } else if config.get_read_only_action_for_key(key_code, modifiers) == Some("enter_command_mode") && ModeManager::can_enter_command_mode(current_mode) {
+                    }
+                    else if config.get_read_only_action_for_key(key_code, modifiers) == Some("enter_command_mode")
+                        && ModeManager::can_enter_command_mode(current_mode)
+                    {
                         self.command_mode = true;
                         self.command_input.clear();
                         self.command_message.clear();
                         return Ok(EventOutcome::Ok(String::new()));
                     }
 
-                    if let Some(action) =
-                        config.get_common_action(key_code, modifiers)
-                    {
+                    // Handle common actions (save, quit, etc.)
+                    if let Some(action) = config.get_common_action(key_code, modifiers) {
                         match action {
-                            "save" | "force_quit" | "save_and_quit"
-                            | "revert" => {
+                            "save" | "force_quit" | "save_and_quit" | "revert" => {
                                 return common_mode::handle_core_action(
                                     action,
                                     form_state,
@@ -639,23 +694,36 @@ impl EventHandler {
                         }
                     }
 
-                    let (_should_exit, message) =
-                        read_only::handle_read_only_event(
-                            app_state,
+                    // Try canvas action for form first (NEW: Canvas library integration)
+                    if app_state.ui.show_form {
+                        if let Ok(Some(canvas_message)) = self.handle_form_canvas_action(
                             key_event,
                             config,
                             form_state,
-                            login_state,
-                            register_state,
-                            &mut admin_state.add_table_state,
-                            &mut admin_state.add_logic_state,
-                            &mut self.key_sequence_tracker,
-                            &mut self.grpc_client, // <-- FIX 1
-                            &mut self.command_message,
-                            &mut self.edit_mode_cooldown,
-                            &mut self.ideal_cursor_column,
-                        )
-                        .await?;
+                            false, // not edit mode
+                        ).await {
+                            return Ok(EventOutcome::Ok(canvas_message));
+                        }
+                    }
+
+                    // Fallback to legacy read-only event handling
+                    let (_should_exit, message) = read_only::handle_read_only_event(
+                        app_state,
+                        key_event,
+                        config,
+                        form_state,
+                        login_state,
+                        register_state,
+                        &mut admin_state.add_table_state,
+                        &mut admin_state.add_logic_state,
+                        &mut self.key_sequence_tracker,
+                        &mut self.grpc_client,
+                        &mut self.command_message,
+                        &mut self.edit_mode_cooldown,
+                        &mut self.ideal_cursor_column,
+                    )
+                    .await?;
+
                     return Ok(EventOutcome::Ok(message));
                 }
 
@@ -695,12 +763,10 @@ impl EventHandler {
                 }
 
                 AppMode::Edit => {
-                    if let Some(action) =
-                        config.get_common_action(key_code, modifiers)
-                    {
+                    // Handle common actions (save, quit, etc.)
+                    if let Some(action) = config.get_common_action(key_code, modifiers) {
                         match action {
-                            "save" | "force_quit" | "save_and_quit"
-                            | "revert" => {
+                            "save" | "force_quit" | "save_and_quit" | "revert" => {
                                 return common_mode::handle_core_action(
                                     action,
                                     form_state,
@@ -718,9 +784,25 @@ impl EventHandler {
                         }
                     }
 
+                    // Try canvas action for form first (NEW: Canvas library integration)
+                    if app_state.ui.show_form {
+                        if let Ok(Some(canvas_message)) = self.handle_form_canvas_action(
+                            key_event,
+                            config,
+                            form_state,
+                            true, // edit mode
+                        ).await {
+                            if !canvas_message.is_empty() {
+                                self.command_message = canvas_message.clone();
+                            }
+                            return Ok(EventOutcome::Ok(canvas_message));
+                        }
+                    }
+
+                    // Handle legacy edit events
                     let mut current_position = form_state.current_position;
                     let total_count = form_state.total_count;
-                    // --- MODIFIED: Pass `self` instead of `grpc_client` ---
+
                     let edit_result = edit::handle_edit_event(
                         key_event,
                         config,
@@ -739,30 +821,62 @@ impl EventHandler {
                         Ok(edit::EditEventOutcome::ExitEditMode) => {
                             self.is_edit_mode = false;
                             self.edit_mode_cooldown = true;
-                            let has_changes = if app_state.ui.show_login { login_state.has_unsaved_changes() } else if app_state.ui.show_register { register_state.has_unsaved_changes() } else { form_state.has_unsaved_changes() };
-                            self.command_message = if has_changes { "Exited edit mode (unsaved changes remain)".to_string() } else { "Read-only mode".to_string() };
+
+                            // Check for unsaved changes across all states
+                            let has_changes = get_has_unsaved_changes_for_state(
+                                app_state,
+                                login_state,
+                                register_state,
+                                form_state
+                            );
+
+                            // Set appropriate message based on changes
+                            self.command_message = if has_changes {
+                                "Exited edit mode (unsaved changes remain)".to_string()
+                            } else {
+                                "Read-only mode".to_string()
+                            };
+
                             terminal.set_cursor_style(SetCursorStyle::SteadyBlock)?;
-                            let current_input = if app_state.ui.show_login { login_state.get_current_input() } else if app_state.ui.show_register { register_state.get_current_input() } else { form_state.get_current_input() };
-                            let current_cursor_pos = if app_state.ui.show_login { login_state.current_cursor_pos() } else if app_state.ui.show_register { register_state.current_cursor_pos() } else { form_state.current_cursor_pos() };
+
+                            // Get current input and cursor position
+                            let current_input = get_current_input_for_state(
+                                app_state,
+                                login_state,
+                                register_state,
+                                form_state
+                            );
+                            let current_cursor_pos = get_current_cursor_pos_for_state(
+                                app_state,
+                                login_state,
+                                register_state,
+                                form_state
+                            );
+
+                            // Adjust cursor if it's beyond the input length
                             if !current_input.is_empty() && current_cursor_pos >= current_input.len() {
                                 let new_pos = current_input.len() - 1;
-                                let target_state: &mut dyn CanvasState = if app_state.ui.show_login { login_state } else if app_state.ui.show_register { register_state } else { form_state };
-                                target_state.set_current_cursor_pos(new_pos);
+                                set_current_cursor_pos_for_state(
+                                    app_state,
+                                    login_state,
+                                    register_state,
+                                    form_state,
+                                    new_pos
+                                );
                                 self.ideal_cursor_column = new_pos;
                             }
-                            return Ok(EventOutcome::Ok(
-                                self.command_message.clone(),
-                            ));
+
+                            return Ok(EventOutcome::Ok(self.command_message.clone()));
                         }
+
                         Ok(edit::EditEventOutcome::Message(msg)) => {
                             if !msg.is_empty() {
                                 self.command_message = msg;
                             }
                             self.key_sequence_tracker.reset();
-                            return Ok(EventOutcome::Ok(
-                                self.command_message.clone(),
-                            ));
+                            return Ok(EventOutcome::Ok(self.command_message.clone()));
                         }
+
                         Err(e) => {
                             return Err(e.into());
                         }
@@ -906,4 +1020,180 @@ impl EventHandler {
     fn is_processed_command(&self, command: &str) -> bool {
         matches!(command, "w" | "q" | "q!" | "wq" | "r")
     }
+
+    async fn handle_form_canvas_action(
+        &mut self,
+        key_event: KeyEvent,
+        _config: &Config, // Not used anymore - canvas has its own config
+        form_state: &mut FormState,
+        is_edit_mode: bool,
+    ) -> Result<Option<String>> {
+        // Load canvas config (canvas_config.toml or vim defaults)
+        let canvas_config = canvas::config::CanvasConfig::load();
+
+        // Handle suggestion actions first if suggestions are active
+        if form_state.autocomplete_active {
+            if let Some(action_str) = canvas_config.get_suggestion_action(key_event.code, key_event.modifiers) {
+                let canvas_action = CanvasAction::from_string(&action_str);
+                match ActionDispatcher::dispatch(canvas_action, form_state, &mut self.ideal_cursor_column).await {
+                    Ok(result) => return Ok(Some(result.message().unwrap_or("").to_string())),
+                    Err(_) => return Ok(Some("Suggestion action failed".to_string())),
+                }
+            }
+
+            // Fallback hardcoded suggestion handling
+            match key_event.code {
+                KeyCode::Up => {
+                    if let Ok(result) = ActionDispatcher::dispatch(
+                        CanvasAction::SuggestionUp,
+                        form_state,
+                        &mut self.ideal_cursor_column,
+                    ).await {
+                        return Ok(Some(result.message().unwrap_or("").to_string()));
+                    }
+                }
+                KeyCode::Down => {
+                    if let Ok(result) = ActionDispatcher::dispatch(
+                        CanvasAction::SuggestionDown,
+                        form_state,
+                        &mut self.ideal_cursor_column,
+                    ).await {
+                        return Ok(Some(result.message().unwrap_or("").to_string()));
+                    }
+                }
+                KeyCode::Enter => {
+                    if let Ok(result) = ActionDispatcher::dispatch(
+                        CanvasAction::SelectSuggestion,
+                        form_state,
+                        &mut self.ideal_cursor_column,
+                    ).await {
+                        return Ok(Some(result.message().unwrap_or("").to_string()));
+                    }
+                }
+                KeyCode::Esc => {
+                    if let Ok(result) = ActionDispatcher::dispatch(
+                        CanvasAction::ExitSuggestions,
+                        form_state,
+                        &mut self.ideal_cursor_column,
+                    ).await {
+                        return Ok(Some(result.message().unwrap_or("").to_string()));
+                    }
+                }
+                _ => {}
+            }
+        }
+
+        // FIXED: Use canvas config instead of client config
+        let action_str = canvas_config.get_action_for_key(
+            key_event.code,
+            key_event.modifiers,
+            is_edit_mode,
+            form_state.autocomplete_active
+        );
+
+        if let Some(action_str) = action_str {
+            // Filter out mode transition actions - let legacy handlers deal with these
+            if Self::is_mode_transition_action(action_str) {
+                return Ok(None); // Let legacy handler handle mode transitions
+            }
+
+            let canvas_action = CanvasAction::from_string(&action_str);
+            match ActionDispatcher::dispatch(
+                canvas_action,
+                form_state,
+                &mut self.ideal_cursor_column,
+            ).await {
+                Ok(result) => {
+                    return Ok(Some(result.message().unwrap_or("").to_string()));
+                }
+                Err(_) => {
+                    return Ok(Some("Canvas action failed".to_string()));
+                }
+            }
+        }
+
+        // Fallback to automatic key handling for edit mode
+        if is_edit_mode {
+            if let Some(canvas_action) = CanvasAction::from_key(key_event.code) {
+                match ActionDispatcher::dispatch(
+                    canvas_action,
+                    form_state,
+                    &mut self.ideal_cursor_column,
+                ).await {
+                    Ok(result) => {
+                        return Ok(Some(result.message().unwrap_or("").to_string()));
+                    }
+                    Err(_) => {
+                        return Ok(Some("Auto action failed".to_string()));
+                    }
+                }
+            }
+        } else {
+            // In read-only mode, only handle non-character keys
+            let canvas_action = match key_event.code {
+                // Only handle special keys that don't conflict with vim bindings
+                KeyCode::Left => Some(CanvasAction::MoveLeft),
+                KeyCode::Right => Some(CanvasAction::MoveRight),
+                KeyCode::Up => Some(CanvasAction::MoveUp),
+                KeyCode::Down => Some(CanvasAction::MoveDown),
+                KeyCode::Home => Some(CanvasAction::MoveLineStart),
+                KeyCode::End => Some(CanvasAction::MoveLineEnd),
+                KeyCode::Tab => Some(CanvasAction::NextField),
+                KeyCode::BackTab => Some(CanvasAction::PrevField),
+                KeyCode::Delete => Some(CanvasAction::DeleteForward),
+                KeyCode::Backspace => Some(CanvasAction::DeleteBackward),
+                _ => None,
+            };
+
+            if let Some(canvas_action) = canvas_action {
+                match ActionDispatcher::dispatch(
+                    canvas_action,
+                    form_state,
+                    &mut self.ideal_cursor_column,
+                ).await {
+                    Ok(result) => {
+                        return Ok(Some(result.message().unwrap_or("").to_string()));
+                    }
+                    Err(_) => {
+                        return Ok(Some("Action failed".to_string()));
+                    }
+                }
+            }
+        }
+
+        Ok(None)
+    }
+
+    // ADDED: Helper function to identify mode transition actions
+    fn is_mode_transition_action(action: &str) -> bool {
+        matches!(action,
+            "exit" |
+            "exit_edit_mode" |
+            "enter_edit_mode_before" |
+            "enter_edit_mode_after" |
+            "enter_command_mode" |
+            "exit_command_mode" |
+            "enter_highlight_mode" |
+            "enter_highlight_mode_linewise" |
+            "exit_highlight_mode" |
+            "save" |
+            "quit" |
+            "force_quit" |
+            "save_and_quit" |
+            "revert" |
+            "enter_decider" |  // This is also handled specially by legacy system
+            "trigger_autocomplete" |  // This is handled specially by legacy system
+            "suggestion_up" |  // These are handled above in suggestion logic
+            "suggestion_down" |
+            "previous_entry" |  // Navigation between records
+            "next_entry" |
+            "toggle_sidebar" |
+            "toggle_buffer_list" |
+            "next_buffer" |
+            "previous_buffer" |
+            "close_buffer" |
+            "open_search" |
+            "find_file_palette_toggle"
+        )
+    }
 }

client/src/modes/handlers/event_helper.rs

@@ -0,0 +1,105 @@
+
+// src/modes/handlers/event_helper.rs
+//! Helper functions to handle the differences between legacy and library CanvasState traits
+
+use crate::state::app::state::AppState;
+use crate::state::pages::{
+    form::FormState,
+    auth::{LoginState, RegisterState},
+};
+use crate::state::pages::canvas_state::CanvasState as LegacyCanvasState;
+use canvas::CanvasState as LibraryCanvasState;
+
+/// Get the current field index from the appropriate state based on which UI is active
+pub fn get_current_field_for_state(
+    app_state: &AppState,
+    login_state: &LoginState,
+    register_state: &RegisterState,
+    form_state: &FormState,
+) -> usize {
+    if app_state.ui.show_login {
+        login_state.current_field() // Uses LegacyCanvasState
+    } else if app_state.ui.show_register {
+        register_state.current_field() // Uses LegacyCanvasState
+    } else {
+        form_state.current_field() // Uses LibraryCanvasState
+    }
+}
+
+/// Get the current cursor position from the appropriate state based on which UI is active
+pub fn get_current_cursor_pos_for_state(
+    app_state: &AppState,
+    login_state: &LoginState,
+    register_state: &RegisterState,
+    form_state: &FormState,
+) -> usize {
+    if app_state.ui.show_login {
+        login_state.current_cursor_pos() // Uses LegacyCanvasState
+    } else if app_state.ui.show_register {
+        register_state.current_cursor_pos() // Uses LegacyCanvasState
+    } else {
+        form_state.current_cursor_pos() // Uses LibraryCanvasState
+    }
+}
+
+/// Check if the appropriate state has unsaved changes based on which UI is active
+pub fn get_has_unsaved_changes_for_state(
+    app_state: &AppState,
+    login_state: &LoginState,
+    register_state: &RegisterState,
+    form_state: &FormState,
+) -> bool {
+    if app_state.ui.show_login {
+        login_state.has_unsaved_changes() // Uses LegacyCanvasState
+    } else if app_state.ui.show_register {
+        register_state.has_unsaved_changes() // Uses LegacyCanvasState
+    } else {
+        form_state.has_unsaved_changes() // Uses LibraryCanvasState
+    }
+}
+
+/// Get the current input from the appropriate state based on which UI is active
+pub fn get_current_input_for_state<'a>(
+    app_state: &AppState,
+    login_state: &'a LoginState,
+    register_state: &'a RegisterState,
+    form_state: &'a FormState,
+) -> &'a str {
+    if app_state.ui.show_login {
+        login_state.get_current_input() // Uses LegacyCanvasState
+    } else if app_state.ui.show_register {
+        register_state.get_current_input() // Uses LegacyCanvasState
+    } else {
+        form_state.get_current_input() // Uses LibraryCanvasState
+    }
+}
+
+/// Set the cursor position for the appropriate state based on which UI is active
+pub fn set_current_cursor_pos_for_state(
+    app_state: &AppState,
+    login_state: &mut LoginState,
+    register_state: &mut RegisterState,
+    form_state: &mut FormState,
+    pos: usize,
+) {
+    if app_state.ui.show_login {
+        login_state.set_current_cursor_pos(pos); // Uses LegacyCanvasState
+    } else if app_state.ui.show_register {
+        register_state.set_current_cursor_pos(pos); // Uses LegacyCanvasState
+    } else {
+        form_state.set_current_cursor_pos(pos); // Uses LibraryCanvasState
+    }
+}
+
+/// Get cursor position for mixed login/register vs form logic
+pub fn get_cursor_pos_for_mixed_state(
+    app_state: &AppState,
+    login_state: &LoginState,
+    form_state: &FormState,
+) -> usize {
+    if app_state.ui.show_login || app_state.ui.show_register {
+        login_state.current_cursor_pos() // Uses LegacyCanvasState
+    } else {
+        form_state.current_cursor_pos() // Uses LibraryCanvasState
+    }
+}

client/src/services/ui_service.rs

@@ -176,7 +176,7 @@ impl UiService {
         }
     }
 
-    // REFACTOR THIS FUNCTION
+    // TODO REFACTOR (maybe)
     pub async fn initialize_app_state_and_form(
         grpc_client: &mut GrpcClient,
         app_state: &mut AppState,
@@ -185,28 +185,27 @@ impl UiService {
             .get_profile_tree()
             .await
             .context("Failed to get profile tree")?;
+
         app_state.profile_tree = profile_tree;
 
-        let initial_profile_name = app_state
+        // Find first profile that contains tables
+        let (initial_profile_name, initial_table_name) = app_state
             .profile_tree
             .profiles
-            .first()
-            .map(|p| p.name.clone())
-            .unwrap_or_else(|| "default".to_string());
-
-        let initial_table_name = app_state
-            .profile_tree
-            .profiles
-            .first()
-            .and_then(|p| p.tables.first().map(|t| t.name.clone()))
-            .unwrap_or_else(|| "2025_company_data1".to_string());
+            .iter()
+            .find(|profile| !profile.tables.is_empty())
+            .and_then(|profile| {
+                profile.tables.first().map(|table| {
+                    (profile.name.clone(), table.name.clone())
+                })
+            })
+            .ok_or_else(|| anyhow!("No profiles with tables found. Create a table first."))?;
 
         app_state.set_current_view_table(
             initial_profile_name.clone(),
             initial_table_name.clone(),
         );
 
-        // NOW, just call our new central function. This avoids code duplication.
         let form_state = Self::load_table_view(
             grpc_client,
             app_state,
@@ -215,7 +214,6 @@ impl UiService {
         )
         .await?;
 
-        // The field names for the UI are derived from the new form_state
         let field_names = form_state.fields.iter().map(|f| f.display_name.clone()).collect();
 
         Ok((initial_profile_name, initial_table_name, field_names))

client/src/state/pages/form.rs

@@ -2,7 +2,7 @@
 
 use crate::config::colors::themes::Theme;
 use crate::state::app::highlight::HighlightState;
-use crate::state::pages::canvas_state::CanvasState;
+use canvas::{CanvasState, CanvasAction, ActionContext}; // CHANGED: Use canvas crate
 use common::proto::komp_ac::search::search_response::Hit;
 use ratatui::layout::Rect;
 use ratatui::Frame;
@@ -146,7 +146,7 @@ impl FormState {
         } else {
             self.current_position = 1;
         }
-        self.deactivate_autocomplete();
+        self.deactivate_suggestions(); // CHANGED: Use canvas trait method
         self.link_display_map.clear();
     }
 
@@ -205,14 +205,25 @@ impl FormState {
         self.has_unsaved_changes = false;
         self.current_field = 0;
         self.current_cursor_pos = 0;
-        self.deactivate_autocomplete();
+        self.deactivate_suggestions(); // CHANGED: Use canvas trait method
         self.link_display_map.clear();
     }
 
-    pub fn deactivate_autocomplete(&mut self) {
-        self.autocomplete_active = false;
-        self.autocomplete_suggestions.clear();
-        self.selected_suggestion_index = None;
+    // REMOVED: deactivate_autocomplete() - now using trait method
+
+    // NEW: Keep the rich suggestions methods for compatibility
+    pub fn get_rich_suggestions(&self) -> Option<&[Hit]> {
+        if self.autocomplete_active {
+            Some(&self.autocomplete_suggestions)
+        } else {
+            None
+        }
+    }
+
+    pub fn activate_rich_suggestions(&mut self, suggestions: Vec<Hit>) {
+        self.autocomplete_suggestions = suggestions;
+        self.autocomplete_active = !self.autocomplete_suggestions.is_empty();
+        self.selected_suggestion_index = if self.autocomplete_active { Some(0) } else { None };
         self.autocomplete_loading = false;
     }
 }
@@ -221,49 +232,54 @@ impl CanvasState for FormState {
     fn current_field(&self) -> usize {
         self.current_field
     }
+    
     fn current_cursor_pos(&self) -> usize {
         self.current_cursor_pos
     }
+    
     fn has_unsaved_changes(&self) -> bool {
         self.has_unsaved_changes
     }
+    
     fn inputs(&self) -> Vec<&String> {
         self.values.iter().collect()
     }
+    
     fn get_current_input(&self) -> &str {
         FormState::get_current_input(self)
     }
+    
     fn get_current_input_mut(&mut self) -> &mut String {
         FormState::get_current_input_mut(self)
     }
+    
     fn fields(&self) -> Vec<&str> {
         self.fields
             .iter()
             .map(|f| f.display_name.as_str())
             .collect()
     }
+    
     fn set_current_field(&mut self, index: usize) {
         if index < self.fields.len() {
             self.current_field = index;
         }
-        self.deactivate_autocomplete();
+        self.deactivate_suggestions(); // CHANGED: Use canvas trait method
     }
+    
     fn set_current_cursor_pos(&mut self, pos: usize) {
         self.current_cursor_pos = pos;
     }
+    
     fn set_has_unsaved_changes(&mut self, changed: bool) {
         self.has_unsaved_changes = changed;
     }
+
+    // --- CANVAS CRATE SUGGESTIONS SUPPORT ---
     fn get_suggestions(&self) -> Option<&[String]> {
-        None
-    }
-    fn get_rich_suggestions(&self) -> Option<&[Hit]> {
-        if self.autocomplete_active {
-            Some(&self.autocomplete_suggestions)
-        } else {
-            None
-        }
+        None // We use rich suggestions instead
     }
+
     fn get_selected_suggestion_index(&self) -> Option<usize> {
         if self.autocomplete_active {
             self.selected_suggestion_index
@@ -272,6 +288,52 @@ impl CanvasState for FormState {
         }
     }
 
+    fn set_selected_suggestion_index(&mut self, index: Option<usize>) {
+        if self.autocomplete_active {
+            self.selected_suggestion_index = index;
+        }
+    }
+
+    fn activate_suggestions(&mut self, suggestions: Vec<String>) {
+        // For compatibility - convert to rich format if needed
+        self.autocomplete_active = true;
+        self.selected_suggestion_index = if suggestions.is_empty() { None } else { Some(0) };
+    }
+
+    fn deactivate_suggestions(&mut self) {
+        self.autocomplete_active = false;
+        self.autocomplete_suggestions.clear();
+        self.selected_suggestion_index = None;
+        self.autocomplete_loading = false;
+    }
+
+    // --- FEATURE-SPECIFIC ACTION HANDLING ---
+    fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+        match action {
+            CanvasAction::SelectSuggestion => {
+                if let Some(selected_idx) = self.selected_suggestion_index {
+                    if let Some(hit) = self.autocomplete_suggestions.get(selected_idx).cloned() { // ADD .cloned()
+                        // Extract the value from the selected suggestion
+                        if let Ok(content_map) = serde_json::from_str::<HashMap<String, serde_json::Value>>(&hit.content_json) {
+                            let current_field_def = &self.fields[self.current_field];
+                            if let Some(value) = content_map.get(&current_field_def.data_key) {
+                                let new_value = json_value_to_string(value);
+                                let display_name = self.get_display_name_for_hit(&hit); // Calculate first
+                                *self.get_current_input_mut() = new_value.clone();
+                                self.set_current_cursor_pos(new_value.len());
+                                self.set_has_unsaved_changes(true);
+                                self.deactivate_suggestions();
+                                return Some(format!("Selected: {}", display_name)); // Use calculated value
+                            }
+                        }
+                    }
+                }
+                None
+            }
+            _ => None, // Let canvas handle other actions
+        }
+    }
+
     fn get_display_value_for_field(&self, index: usize) -> &str {
         if let Some(display_text) = self.link_display_map.get(&index) {
             return display_text.as_str();
@@ -282,7 +344,6 @@ impl CanvasState for FormState {
             .unwrap_or("")
     }
 
-    // --- IMPLEMENT THE NEW TRAIT METHOD ---
     fn has_display_override(&self, index: usize) -> bool {
         self.link_display_map.contains_key(&index)
     }

client/src/tui/functions/form.rs

@@ -1,7 +1,7 @@
 // src/tui/functions/form.rs
-use crate::state::pages::canvas_state::CanvasState;
 use crate::state::pages::form::FormState;
 use crate::services::grpc_client::GrpcClient;
+use canvas::CanvasState;
 use anyhow::{anyhow, Result};
 
 pub async fn handle_action(

flake.lock

@@ -0,0 +1,61 @@
+{
+  "nodes": {
+    "flake-utils": {
+      "inputs": {
+        "systems": "systems"
+      },
+      "locked": {
+        "lastModified": 1731533236,
+        "narHash": "sha256-l0KFg5HjrsfsO/JpG+r7fRrqm12kzFHyUHqHCVpMMbI=",
+        "owner": "numtide",
+        "repo": "flake-utils",
+        "rev": "11707dc2f618dd54ca8739b309ec4fc024de578b",
+        "type": "github"
+      },
+      "original": {
+        "owner": "numtide",
+        "repo": "flake-utils",
+        "type": "github"
+      }
+    },
+    "nixpkgs": {
+      "locked": {
+        "lastModified": 1753549186,
+        "narHash": "sha256-Znl7rzuxKg/Mdm6AhimcKynM7V3YeNDIcLjBuoBcmNs=",
+        "owner": "NixOS",
+        "repo": "nixpkgs",
+        "rev": "17f6bd177404d6d43017595c5264756764444ab8",
+        "type": "github"
+      },
+      "original": {
+        "owner": "NixOS",
+        "ref": "nixos-unstable",
+        "repo": "nixpkgs",
+        "type": "github"
+      }
+    },
+    "root": {
+      "inputs": {
+        "flake-utils": "flake-utils",
+        "nixpkgs": "nixpkgs"
+      }
+    },
+    "systems": {
+      "locked": {
+        "lastModified": 1681028828,
+        "narHash": "sha256-Vy1rq5AaRuLzOxct8nz4T6wlgyUR7zLU309k9mBC768=",
+        "owner": "nix-systems",
+        "repo": "default",
+        "rev": "da67096a3b9bf56a91d16901293e51ba5b49a27e",
+        "type": "github"
+      },
+      "original": {
+        "owner": "nix-systems",
+        "repo": "default",
+        "type": "github"
+      }
+    }
+  },
+  "root": "root",
+  "version": 7
+}

flake.nix

@@ -0,0 +1,52 @@
+{
+  description = "Komp AC - Kompress Accounting";
+
+  inputs = {
+    nixpkgs.url = "github:NixOS/nixpkgs/nixos-unstable";
+    flake-utils.url = "github:numtide/flake-utils";
+  };
+
+  outputs = { self, nixpkgs, flake-utils }:
+    flake-utils.lib.eachDefaultSystem (system:
+      let
+        pkgs = nixpkgs.legacyPackages.${system};
+      in
+      {
+        devShells.default = pkgs.mkShell {
+          buildInputs = with pkgs; [
+            # Rust toolchain
+            rustc
+            cargo
+            rustfmt
+            clippy
+	    cargo-watch
+
+            # C build tools (for your linker issue)
+            gcc
+            binutils
+            pkg-config
+            
+            # OpenSSL for crypto dependencies
+            openssl
+            openssl.dev
+            
+            # PostgreSQL for sqlx
+            postgresql
+	    sqlx-cli
+            
+            # Protocol Buffers compiler for gRPC
+            protobuf
+          ];
+
+          shellHook = ''
+            export PKG_CONFIG_PATH="${pkgs.openssl.dev}/lib/pkgconfig:$PKG_CONFIG_PATH"
+            export OPENSSL_DIR="${pkgs.openssl.dev}"
+            export OPENSSL_LIB_DIR="${pkgs.openssl.out}/lib"
+            export OPENSSL_INCLUDE_DIR="${pkgs.openssl.dev}/include"
+            echo "🦀 Rust development environment loaded"
+            echo "OpenSSL and PostgreSQL available"
+          '';
+        };
+      }
+    );
+}

server/docs-prod/book.toml

@@ -0,0 +1,14 @@
+[book]
+authors = ["Priec"]
+language = "en"
+src = "src"
+title = "Server API Documentation"
+
+[output.html.search]
+enable = true
+limit-results = 30
+teaser-word-count = 30
+use-boolean-and = true
+boost-title = 2
+boost-hierarchy = 1
+boost-paragraph = 1

server/docs-prod/book/.nojekyll

@@ -0,0 +1 @@
+This file makes sure that Github Pages doesn't process mdBook's output.

server/docs-prod/book/404.html

@@ -0,0 +1,216 @@
+<!DOCTYPE HTML>
+<html lang="en" class="light sidebar-visible" dir="ltr">
+    <head>
+        <!-- Book generated using mdBook -->
+        <meta charset="UTF-8">
+        <title>Page not found - Server API Documentation</title>
+        <base href="/">
+
+
+        <!-- Custom HTML head -->
+
+        <meta name="description" content="">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta name="theme-color" content="#ffffff">
+
+        <link rel="icon" href="favicon.svg">
+        <link rel="shortcut icon" href="favicon.png">
+        <link rel="stylesheet" href="css/variables.css">
+        <link rel="stylesheet" href="css/general.css">
+        <link rel="stylesheet" href="css/chrome.css">
+        <link rel="stylesheet" href="css/print.css" media="print">
+
+        <!-- Fonts -->
+        <link rel="stylesheet" href="FontAwesome/css/font-awesome.css">
+        <link rel="stylesheet" href="fonts/fonts.css">
+
+        <!-- Highlight.js Stylesheets -->
+        <link rel="stylesheet" id="highlight-css" href="highlight.css">
+        <link rel="stylesheet" id="tomorrow-night-css" href="tomorrow-night.css">
+        <link rel="stylesheet" id="ayu-highlight-css" href="ayu-highlight.css">
+
+        <!-- Custom theme stylesheets -->
+
+
+        <!-- Provide site root and default themes to javascript -->
+        <script>
+            const path_to_root = "";
+            const default_light_theme = "light";
+            const default_dark_theme = "navy";
+        </script>
+        <!-- Start loading toc.js asap -->
+        <script src="toc.js"></script>
+    </head>
+    <body>
+    <div id="body-container">
+        <!-- Work around some values being stored in localStorage wrapped in quotes -->
+        <script>
+            try {
+                let theme = localStorage.getItem('mdbook-theme');
+                let sidebar = localStorage.getItem('mdbook-sidebar');
+
+                if (theme.startsWith('"') && theme.endsWith('"')) {
+                    localStorage.setItem('mdbook-theme', theme.slice(1, theme.length - 1));
+                }
+
+                if (sidebar.startsWith('"') && sidebar.endsWith('"')) {
+                    localStorage.setItem('mdbook-sidebar', sidebar.slice(1, sidebar.length - 1));
+                }
+            } catch (e) { }
+        </script>
+
+        <!-- Set the theme before any content is loaded, prevents flash -->
+        <script>
+            const default_theme = window.matchMedia("(prefers-color-scheme: dark)").matches ? default_dark_theme : default_light_theme;
+            let theme;
+            try { theme = localStorage.getItem('mdbook-theme'); } catch(e) { }
+            if (theme === null || theme === undefined) { theme = default_theme; }
+            const html = document.documentElement;
+            html.classList.remove('light')
+            html.classList.add(theme);
+            html.classList.add("js");
+        </script>
+
+        <input type="checkbox" id="sidebar-toggle-anchor" class="hidden">
+
+        <!-- Hide / unhide sidebar before it is displayed -->
+        <script>
+            let sidebar = null;
+            const sidebar_toggle = document.getElementById("sidebar-toggle-anchor");
+            if (document.body.clientWidth >= 1080) {
+                try { sidebar = localStorage.getItem('mdbook-sidebar'); } catch(e) { }
+                sidebar = sidebar || 'visible';
+            } else {
+                sidebar = 'hidden';
+            }
+            sidebar_toggle.checked = sidebar === 'visible';
+            html.classList.remove('sidebar-visible');
+            html.classList.add("sidebar-" + sidebar);
+        </script>
+
+        <nav id="sidebar" class="sidebar" aria-label="Table of contents">
+            <!-- populated by js -->
+            <mdbook-sidebar-scrollbox class="sidebar-scrollbox"></mdbook-sidebar-scrollbox>
+            <noscript>
+                <iframe class="sidebar-iframe-outer" src="toc.html"></iframe>
+            </noscript>
+            <div id="sidebar-resize-handle" class="sidebar-resize-handle">
+                <div class="sidebar-resize-indicator"></div>
+            </div>
+        </nav>
+
+        <div id="page-wrapper" class="page-wrapper">
+
+            <div class="page">
+                <div id="menu-bar-hover-placeholder"></div>
+                <div id="menu-bar" class="menu-bar sticky">
+                    <div class="left-buttons">
+                        <label id="sidebar-toggle" class="icon-button" for="sidebar-toggle-anchor" title="Toggle Table of Contents" aria-label="Toggle Table of Contents" aria-controls="sidebar">
+                            <i class="fa fa-bars"></i>
+                        </label>
+                        <button id="theme-toggle" class="icon-button" type="button" title="Change theme" aria-label="Change theme" aria-haspopup="true" aria-expanded="false" aria-controls="theme-list">
+                            <i class="fa fa-paint-brush"></i>
+                        </button>
+                        <ul id="theme-list" class="theme-popup" aria-label="Themes" role="menu">
+                            <li role="none"><button role="menuitem" class="theme" id="default_theme">Auto</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="light">Light</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="rust">Rust</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
+                        </ul>
+                        <button id="search-toggle" class="icon-button" type="button" title="Search. (Shortkey: s)" aria-label="Toggle Searchbar" aria-expanded="false" aria-keyshortcuts="S" aria-controls="searchbar">
+                            <i class="fa fa-search"></i>
+                        </button>
+                    </div>
+
+                    <h1 class="menu-title">Server API Documentation</h1>
+
+                    <div class="right-buttons">
+                        <a href="print.html" title="Print this book" aria-label="Print this book">
+                            <i id="print-button" class="fa fa-print"></i>
+                        </a>
+
+                    </div>
+                </div>
+
+                <div id="search-wrapper" class="hidden">
+                    <form id="searchbar-outer" class="searchbar-outer">
+                        <input type="search" id="searchbar" name="searchbar" placeholder="Search this book ..." aria-controls="searchresults-outer" aria-describedby="searchresults-header">
+                    </form>
+                    <div id="searchresults-outer" class="searchresults-outer hidden">
+                        <div id="searchresults-header" class="searchresults-header"></div>
+                        <ul id="searchresults">
+                        </ul>
+                    </div>
+                </div>
+
+                <!-- Apply ARIA attributes after the sidebar and the sidebar toggle button are added to the DOM -->
+                <script>
+                    document.getElementById('sidebar-toggle').setAttribute('aria-expanded', sidebar === 'visible');
+                    document.getElementById('sidebar').setAttribute('aria-hidden', sidebar !== 'visible');
+                    Array.from(document.querySelectorAll('#sidebar a')).forEach(function(link) {
+                        link.setAttribute('tabIndex', sidebar === 'visible' ? 0 : -1);
+                    });
+                </script>
+
+                <div id="content" class="content">
+                    <main>
+                        <h1 id="document-not-found-404"><a class="header" href="#document-not-found-404">Document not found (404)</a></h1>
+<p>This URL is invalid, sorry. Please use the navigation bar or search to continue.</p>
+
+                    </main>
+
+                    <nav class="nav-wrapper" aria-label="Page navigation">
+                        <!-- Mobile navigation buttons -->
+
+
+                        <div style="clear: both"></div>
+                    </nav>
+                </div>
+            </div>
+
+            <nav class="nav-wide-wrapper" aria-label="Page navigation">
+
+            </nav>
+
+        </div>
+
+        <!-- Livereload script (if served using the cli tool) -->
+        <script>
+            const wsProtocol = location.protocol === 'https:' ? 'wss:' : 'ws:';
+            const wsAddress = wsProtocol + "//" + location.host + "/" + "__livereload";
+            const socket = new WebSocket(wsAddress);
+            socket.onmessage = function (event) {
+                if (event.data === "reload") {
+                    socket.close();
+                    location.reload();
+                }
+            };
+
+            window.onbeforeunload = function() {
+                socket.close();
+            }
+        </script>
+
+
+
+        <script>
+            window.playground_copyable = true;
+        </script>
+
+
+        <script src="elasticlunr.min.js"></script>
+        <script src="mark.min.js"></script>
+        <script src="searcher.js"></script>
+
+        <script src="clipboard.min.js"></script>
+        <script src="highlight.js"></script>
+        <script src="book.js"></script>
+
+        <!-- Custom JS scripts -->
+
+
+    </div>
+    </body>
+</html>

server/docs-prod/book/ayu-highlight.css

@@ -0,0 +1,78 @@
+/*
+Based off of the Ayu theme
+Original by Dempfi (https://github.com/dempfi/ayu)
+*/
+
+.hljs {
+  display: block;
+  overflow-x: auto;
+  background: #191f26;
+  color: #e6e1cf;
+}
+
+.hljs-comment,
+.hljs-quote {
+  color: #5c6773;
+  font-style: italic;
+}
+
+.hljs-variable,
+.hljs-template-variable,
+.hljs-attribute,
+.hljs-attr,
+.hljs-regexp,
+.hljs-link,
+.hljs-selector-id,
+.hljs-selector-class {
+  color: #ff7733;
+}
+
+.hljs-number,
+.hljs-meta,
+.hljs-builtin-name,
+.hljs-literal,
+.hljs-type,
+.hljs-params {
+  color: #ffee99;
+}
+
+.hljs-string,
+.hljs-bullet {
+  color: #b8cc52;
+}
+
+.hljs-title,
+.hljs-built_in,
+.hljs-section {
+  color: #ffb454;
+}
+
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-symbol {
+  color: #ff7733;
+}
+
+.hljs-name {
+    color: #36a3d9;
+}
+
+.hljs-tag {
+    color: #00568d;
+}
+
+.hljs-emphasis {
+  font-style: italic;
+}
+
+.hljs-strong {
+  font-weight: bold;
+}
+
+.hljs-addition {
+  color: #91b362;
+}
+
+.hljs-deletion {
+  color: #d96c75;
+}

server/docs-prod/book/book.js

@@ -0,0 +1,769 @@
+'use strict';
+
+/* global default_theme, default_dark_theme, default_light_theme, hljs, ClipboardJS */
+
+// Fix back button cache problem
+window.onunload = function() { };
+
+// Global variable, shared between modules
+function playground_text(playground, hidden = true) {
+    const code_block = playground.querySelector('code');
+
+    if (window.ace && code_block.classList.contains('editable')) {
+        const editor = window.ace.edit(code_block);
+        return editor.getValue();
+    } else if (hidden) {
+        return code_block.textContent;
+    } else {
+        return code_block.innerText;
+    }
+}
+
+(function codeSnippets() {
+    function fetch_with_timeout(url, options, timeout = 6000) {
+        return Promise.race([
+            fetch(url, options),
+            new Promise((_, reject) => setTimeout(() => reject(new Error('timeout')), timeout)),
+        ]);
+    }
+
+    const playgrounds = Array.from(document.querySelectorAll('.playground'));
+    if (playgrounds.length > 0) {
+        fetch_with_timeout('https://play.rust-lang.org/meta/crates', {
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            method: 'POST',
+            mode: 'cors',
+        })
+            .then(response => response.json())
+            .then(response => {
+            // get list of crates available in the rust playground
+                const playground_crates = response.crates.map(item => item['id']);
+                playgrounds.forEach(block => handle_crate_list_update(block, playground_crates));
+            });
+    }
+
+    function handle_crate_list_update(playground_block, playground_crates) {
+        // update the play buttons after receiving the response
+        update_play_button(playground_block, playground_crates);
+
+        // and install on change listener to dynamically update ACE editors
+        if (window.ace) {
+            const code_block = playground_block.querySelector('code');
+            if (code_block.classList.contains('editable')) {
+                const editor = window.ace.edit(code_block);
+                editor.addEventListener('change', () => {
+                    update_play_button(playground_block, playground_crates);
+                });
+                // add Ctrl-Enter command to execute rust code
+                editor.commands.addCommand({
+                    name: 'run',
+                    bindKey: {
+                        win: 'Ctrl-Enter',
+                        mac: 'Ctrl-Enter',
+                    },
+                    exec: _editor => run_rust_code(playground_block),
+                });
+            }
+        }
+    }
+
+    // updates the visibility of play button based on `no_run` class and
+    // used crates vs ones available on https://play.rust-lang.org
+    function update_play_button(pre_block, playground_crates) {
+        const play_button = pre_block.querySelector('.play-button');
+
+        // skip if code is `no_run`
+        if (pre_block.querySelector('code').classList.contains('no_run')) {
+            play_button.classList.add('hidden');
+            return;
+        }
+
+        // get list of `extern crate`'s from snippet
+        const txt = playground_text(pre_block);
+        const re = /extern\s+crate\s+([a-zA-Z_0-9]+)\s*;/g;
+        const snippet_crates = [];
+        let item;
+        // eslint-disable-next-line no-cond-assign
+        while (item = re.exec(txt)) {
+            snippet_crates.push(item[1]);
+        }
+
+        // check if all used crates are available on play.rust-lang.org
+        const all_available = snippet_crates.every(function(elem) {
+            return playground_crates.indexOf(elem) > -1;
+        });
+
+        if (all_available) {
+            play_button.classList.remove('hidden');
+        } else {
+            play_button.classList.add('hidden');
+        }
+    }
+
+    function run_rust_code(code_block) {
+        let result_block = code_block.querySelector('.result');
+        if (!result_block) {
+            result_block = document.createElement('code');
+            result_block.className = 'result hljs language-bash';
+
+            code_block.append(result_block);
+        }
+
+        const text = playground_text(code_block);
+        const classes = code_block.querySelector('code').classList;
+        let edition = '2015';
+        classes.forEach(className => {
+            if (className.startsWith('edition')) {
+                edition = className.slice(7);
+            }
+        });
+        const params = {
+            version: 'stable',
+            optimize: '0',
+            code: text,
+            edition: edition,
+        };
+
+        if (text.indexOf('#![feature') !== -1) {
+            params.version = 'nightly';
+        }
+
+        result_block.innerText = 'Running...';
+
+        fetch_with_timeout('https://play.rust-lang.org/evaluate.json', {
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            method: 'POST',
+            mode: 'cors',
+            body: JSON.stringify(params),
+        })
+            .then(response => response.json())
+            .then(response => {
+                if (response.result.trim() === '') {
+                    result_block.innerText = 'No output';
+                    result_block.classList.add('result-no-output');
+                } else {
+                    result_block.innerText = response.result;
+                    result_block.classList.remove('result-no-output');
+                }
+            })
+            .catch(error => result_block.innerText = 'Playground Communication: ' + error.message);
+    }
+
+    // Syntax highlighting Configuration
+    hljs.configure({
+        tabReplace: '    ', // 4 spaces
+        languages: [], // Languages used for auto-detection
+    });
+
+    const code_nodes = Array
+        .from(document.querySelectorAll('code'))
+        // Don't highlight `inline code` blocks in headers.
+        .filter(function(node) {
+            return !node.parentElement.classList.contains('header');
+        });
+
+    if (window.ace) {
+        // language-rust class needs to be removed for editable
+        // blocks or highlightjs will capture events
+        code_nodes
+            .filter(function(node) {
+                return node.classList.contains('editable');
+            })
+            .forEach(function(block) {
+                block.classList.remove('language-rust');
+            });
+
+        code_nodes
+            .filter(function(node) {
+                return !node.classList.contains('editable');
+            })
+            .forEach(function(block) {
+                hljs.highlightBlock(block);
+            });
+    } else {
+        code_nodes.forEach(function(block) {
+            hljs.highlightBlock(block);
+        });
+    }
+
+    // Adding the hljs class gives code blocks the color css
+    // even if highlighting doesn't apply
+    code_nodes.forEach(function(block) {
+        block.classList.add('hljs');
+    });
+
+    Array.from(document.querySelectorAll('code.hljs')).forEach(function(block) {
+
+        const lines = Array.from(block.querySelectorAll('.boring'));
+        // If no lines were hidden, return
+        if (!lines.length) {
+            return;
+        }
+        block.classList.add('hide-boring');
+
+        const buttons = document.createElement('div');
+        buttons.className = 'buttons';
+        buttons.innerHTML = '<button class="fa fa-eye" title="Show hidden lines" \
+aria-label="Show hidden lines"></button>';
+
+        // add expand button
+        const pre_block = block.parentNode;
+        pre_block.insertBefore(buttons, pre_block.firstChild);
+
+        pre_block.querySelector('.buttons').addEventListener('click', function(e) {
+            if (e.target.classList.contains('fa-eye')) {
+                e.target.classList.remove('fa-eye');
+                e.target.classList.add('fa-eye-slash');
+                e.target.title = 'Hide lines';
+                e.target.setAttribute('aria-label', e.target.title);
+
+                block.classList.remove('hide-boring');
+            } else if (e.target.classList.contains('fa-eye-slash')) {
+                e.target.classList.remove('fa-eye-slash');
+                e.target.classList.add('fa-eye');
+                e.target.title = 'Show hidden lines';
+                e.target.setAttribute('aria-label', e.target.title);
+
+                block.classList.add('hide-boring');
+            }
+        });
+    });
+
+    if (window.playground_copyable) {
+        Array.from(document.querySelectorAll('pre code')).forEach(function(block) {
+            const pre_block = block.parentNode;
+            if (!pre_block.classList.contains('playground')) {
+                let buttons = pre_block.querySelector('.buttons');
+                if (!buttons) {
+                    buttons = document.createElement('div');
+                    buttons.className = 'buttons';
+                    pre_block.insertBefore(buttons, pre_block.firstChild);
+                }
+
+                const clipButton = document.createElement('button');
+                clipButton.className = 'clip-button';
+                clipButton.title = 'Copy to clipboard';
+                clipButton.setAttribute('aria-label', clipButton.title);
+                clipButton.innerHTML = '<i class="tooltiptext"></i>';
+
+                buttons.insertBefore(clipButton, buttons.firstChild);
+            }
+        });
+    }
+
+    // Process playground code blocks
+    Array.from(document.querySelectorAll('.playground')).forEach(function(pre_block) {
+        // Add play button
+        let buttons = pre_block.querySelector('.buttons');
+        if (!buttons) {
+            buttons = document.createElement('div');
+            buttons.className = 'buttons';
+            pre_block.insertBefore(buttons, pre_block.firstChild);
+        }
+
+        const runCodeButton = document.createElement('button');
+        runCodeButton.className = 'fa fa-play play-button';
+        runCodeButton.hidden = true;
+        runCodeButton.title = 'Run this code';
+        runCodeButton.setAttribute('aria-label', runCodeButton.title);
+
+        buttons.insertBefore(runCodeButton, buttons.firstChild);
+        runCodeButton.addEventListener('click', () => {
+            run_rust_code(pre_block);
+        });
+
+        if (window.playground_copyable) {
+            const copyCodeClipboardButton = document.createElement('button');
+            copyCodeClipboardButton.className = 'clip-button';
+            copyCodeClipboardButton.innerHTML = '<i class="tooltiptext"></i>';
+            copyCodeClipboardButton.title = 'Copy to clipboard';
+            copyCodeClipboardButton.setAttribute('aria-label', copyCodeClipboardButton.title);
+
+            buttons.insertBefore(copyCodeClipboardButton, buttons.firstChild);
+        }
+
+        const code_block = pre_block.querySelector('code');
+        if (window.ace && code_block.classList.contains('editable')) {
+            const undoChangesButton = document.createElement('button');
+            undoChangesButton.className = 'fa fa-history reset-button';
+            undoChangesButton.title = 'Undo changes';
+            undoChangesButton.setAttribute('aria-label', undoChangesButton.title);
+
+            buttons.insertBefore(undoChangesButton, buttons.firstChild);
+
+            undoChangesButton.addEventListener('click', function() {
+                const editor = window.ace.edit(code_block);
+                editor.setValue(editor.originalCode);
+                editor.clearSelection();
+            });
+        }
+    });
+})();
+
+(function themes() {
+    const html = document.querySelector('html');
+    const themeToggleButton = document.getElementById('theme-toggle');
+    const themePopup = document.getElementById('theme-list');
+    const themeColorMetaTag = document.querySelector('meta[name="theme-color"]');
+    const themeIds = [];
+    themePopup.querySelectorAll('button.theme').forEach(function(el) {
+        themeIds.push(el.id);
+    });
+    const stylesheets = {
+        ayuHighlight: document.querySelector('#ayu-highlight-css'),
+        tomorrowNight: document.querySelector('#tomorrow-night-css'),
+        highlight: document.querySelector('#highlight-css'),
+    };
+
+    function showThemes() {
+        themePopup.style.display = 'block';
+        themeToggleButton.setAttribute('aria-expanded', true);
+        themePopup.querySelector('button#' + get_theme()).focus();
+    }
+
+    function updateThemeSelected() {
+        themePopup.querySelectorAll('.theme-selected').forEach(function(el) {
+            el.classList.remove('theme-selected');
+        });
+        const selected = get_saved_theme() ?? 'default_theme';
+        let element = themePopup.querySelector('button#' + selected);
+        if (element === null) {
+            // Fall back in case there is no "Default" item.
+            element = themePopup.querySelector('button#' + get_theme());
+        }
+        element.classList.add('theme-selected');
+    }
+
+    function hideThemes() {
+        themePopup.style.display = 'none';
+        themeToggleButton.setAttribute('aria-expanded', false);
+        themeToggleButton.focus();
+    }
+
+    function get_saved_theme() {
+        let theme = null;
+        try {
+            theme = localStorage.getItem('mdbook-theme');
+        } catch (e) {
+            // ignore error.
+        }
+        return theme;
+    }
+
+    function delete_saved_theme() {
+        localStorage.removeItem('mdbook-theme');
+    }
+
+    function get_theme() {
+        const theme = get_saved_theme();
+        if (theme === null || theme === undefined || !themeIds.includes(theme)) {
+            if (typeof default_dark_theme === 'undefined') {
+                // A customized index.hbs might not define this, so fall back to
+                // old behavior of determining the default on page load.
+                return default_theme;
+            }
+            return window.matchMedia('(prefers-color-scheme: dark)').matches
+                ? default_dark_theme
+                : default_light_theme;
+        } else {
+            return theme;
+        }
+    }
+
+    let previousTheme = default_theme;
+    function set_theme(theme, store = true) {
+        let ace_theme;
+
+        if (theme === 'coal' || theme === 'navy') {
+            stylesheets.ayuHighlight.disabled = true;
+            stylesheets.tomorrowNight.disabled = false;
+            stylesheets.highlight.disabled = true;
+
+            ace_theme = 'ace/theme/tomorrow_night';
+        } else if (theme === 'ayu') {
+            stylesheets.ayuHighlight.disabled = false;
+            stylesheets.tomorrowNight.disabled = true;
+            stylesheets.highlight.disabled = true;
+            ace_theme = 'ace/theme/tomorrow_night';
+        } else {
+            stylesheets.ayuHighlight.disabled = true;
+            stylesheets.tomorrowNight.disabled = true;
+            stylesheets.highlight.disabled = false;
+            ace_theme = 'ace/theme/dawn';
+        }
+
+        setTimeout(function() {
+            themeColorMetaTag.content = getComputedStyle(document.documentElement).backgroundColor;
+        }, 1);
+
+        if (window.ace && window.editors) {
+            window.editors.forEach(function(editor) {
+                editor.setTheme(ace_theme);
+            });
+        }
+
+        if (store) {
+            try {
+                localStorage.setItem('mdbook-theme', theme);
+            } catch (e) {
+                // ignore error.
+            }
+        }
+
+        html.classList.remove(previousTheme);
+        html.classList.add(theme);
+        previousTheme = theme;
+        updateThemeSelected();
+    }
+
+    const query = window.matchMedia('(prefers-color-scheme: dark)');
+    query.onchange = function() {
+        set_theme(get_theme(), false);
+    };
+
+    // Set theme.
+    set_theme(get_theme(), false);
+
+    themeToggleButton.addEventListener('click', function() {
+        if (themePopup.style.display === 'block') {
+            hideThemes();
+        } else {
+            showThemes();
+        }
+    });
+
+    themePopup.addEventListener('click', function(e) {
+        let theme;
+        if (e.target.className === 'theme') {
+            theme = e.target.id;
+        } else if (e.target.parentElement.className === 'theme') {
+            theme = e.target.parentElement.id;
+        } else {
+            return;
+        }
+        if (theme === 'default_theme' || theme === null) {
+            delete_saved_theme();
+            set_theme(get_theme(), false);
+        } else {
+            set_theme(theme);
+        }
+    });
+
+    themePopup.addEventListener('focusout', function(e) {
+        // e.relatedTarget is null in Safari and Firefox on macOS (see workaround below)
+        if (!!e.relatedTarget &&
+            !themeToggleButton.contains(e.relatedTarget) &&
+            !themePopup.contains(e.relatedTarget)
+        ) {
+            hideThemes();
+        }
+    });
+
+    // Should not be needed, but it works around an issue on macOS & iOS:
+    // https://github.com/rust-lang/mdBook/issues/628
+    document.addEventListener('click', function(e) {
+        if (themePopup.style.display === 'block' &&
+            !themeToggleButton.contains(e.target) &&
+            !themePopup.contains(e.target)
+        ) {
+            hideThemes();
+        }
+    });
+
+    document.addEventListener('keydown', function(e) {
+        if (e.altKey || e.ctrlKey || e.metaKey || e.shiftKey) {
+            return;
+        }
+        if (!themePopup.contains(e.target)) {
+            return;
+        }
+
+        let li;
+        switch (e.key) {
+        case 'Escape':
+            e.preventDefault();
+            hideThemes();
+            break;
+        case 'ArrowUp':
+            e.preventDefault();
+            li = document.activeElement.parentElement;
+            if (li && li.previousElementSibling) {
+                li.previousElementSibling.querySelector('button').focus();
+            }
+            break;
+        case 'ArrowDown':
+            e.preventDefault();
+            li = document.activeElement.parentElement;
+            if (li && li.nextElementSibling) {
+                li.nextElementSibling.querySelector('button').focus();
+            }
+            break;
+        case 'Home':
+            e.preventDefault();
+            themePopup.querySelector('li:first-child button').focus();
+            break;
+        case 'End':
+            e.preventDefault();
+            themePopup.querySelector('li:last-child button').focus();
+            break;
+        }
+    });
+})();
+
+(function sidebar() {
+    const body = document.querySelector('body');
+    const sidebar = document.getElementById('sidebar');
+    const sidebarLinks = document.querySelectorAll('#sidebar a');
+    const sidebarToggleButton = document.getElementById('sidebar-toggle');
+    const sidebarToggleAnchor = document.getElementById('sidebar-toggle-anchor');
+    const sidebarResizeHandle = document.getElementById('sidebar-resize-handle');
+    let firstContact = null;
+
+    function showSidebar() {
+        body.classList.remove('sidebar-hidden');
+        body.classList.add('sidebar-visible');
+        Array.from(sidebarLinks).forEach(function(link) {
+            link.setAttribute('tabIndex', 0);
+        });
+        sidebarToggleButton.setAttribute('aria-expanded', true);
+        sidebar.setAttribute('aria-hidden', false);
+        try {
+            localStorage.setItem('mdbook-sidebar', 'visible');
+        } catch (e) {
+            // Ignore error.
+        }
+    }
+
+    function hideSidebar() {
+        body.classList.remove('sidebar-visible');
+        body.classList.add('sidebar-hidden');
+        Array.from(sidebarLinks).forEach(function(link) {
+            link.setAttribute('tabIndex', -1);
+        });
+        sidebarToggleButton.setAttribute('aria-expanded', false);
+        sidebar.setAttribute('aria-hidden', true);
+        try {
+            localStorage.setItem('mdbook-sidebar', 'hidden');
+        } catch (e) {
+            // Ignore error.
+        }
+    }
+
+    // Toggle sidebar
+    sidebarToggleAnchor.addEventListener('change', function sidebarToggle() {
+        if (sidebarToggleAnchor.checked) {
+            const current_width = parseInt(
+                document.documentElement.style.getPropertyValue('--sidebar-target-width'), 10);
+            if (current_width < 150) {
+                document.documentElement.style.setProperty('--sidebar-target-width', '150px');
+            }
+            showSidebar();
+        } else {
+            hideSidebar();
+        }
+    });
+
+    sidebarResizeHandle.addEventListener('mousedown', initResize, false);
+
+    function initResize() {
+        window.addEventListener('mousemove', resize, false);
+        window.addEventListener('mouseup', stopResize, false);
+        body.classList.add('sidebar-resizing');
+    }
+    function resize(e) {
+        let pos = e.clientX - sidebar.offsetLeft;
+        if (pos < 20) {
+            hideSidebar();
+        } else {
+            if (body.classList.contains('sidebar-hidden')) {
+                showSidebar();
+            }
+            pos = Math.min(pos, window.innerWidth - 100);
+            document.documentElement.style.setProperty('--sidebar-target-width', pos + 'px');
+        }
+    }
+    //on mouseup remove windows functions mousemove & mouseup
+    function stopResize() {
+        body.classList.remove('sidebar-resizing');
+        window.removeEventListener('mousemove', resize, false);
+        window.removeEventListener('mouseup', stopResize, false);
+    }
+
+    document.addEventListener('touchstart', function(e) {
+        firstContact = {
+            x: e.touches[0].clientX,
+            time: Date.now(),
+        };
+    }, { passive: true });
+
+    document.addEventListener('touchmove', function(e) {
+        if (!firstContact) {
+            return;
+        }
+
+        const curX = e.touches[0].clientX;
+        const xDiff = curX - firstContact.x,
+            tDiff = Date.now() - firstContact.time;
+
+        if (tDiff < 250 && Math.abs(xDiff) >= 150) {
+            if (xDiff >= 0 && firstContact.x < Math.min(document.body.clientWidth * 0.25, 300)) {
+                showSidebar();
+            } else if (xDiff < 0 && curX < 300) {
+                hideSidebar();
+            }
+
+            firstContact = null;
+        }
+    }, { passive: true });
+})();
+
+(function chapterNavigation() {
+    document.addEventListener('keydown', function(e) {
+        if (e.altKey || e.ctrlKey || e.metaKey || e.shiftKey) {
+            return;
+        }
+        if (window.search && window.search.hasFocus()) {
+            return;
+        }
+        const html = document.querySelector('html');
+
+        function next() {
+            const nextButton = document.querySelector('.nav-chapters.next');
+            if (nextButton) {
+                window.location.href = nextButton.href;
+            }
+        }
+        function prev() {
+            const previousButton = document.querySelector('.nav-chapters.previous');
+            if (previousButton) {
+                window.location.href = previousButton.href;
+            }
+        }
+        switch (e.key) {
+        case 'ArrowRight':
+            e.preventDefault();
+            if (html.dir === 'rtl') {
+                prev();
+            } else {
+                next();
+            }
+            break;
+        case 'ArrowLeft':
+            e.preventDefault();
+            if (html.dir === 'rtl') {
+                next();
+            } else {
+                prev();
+            }
+            break;
+        }
+    });
+})();
+
+(function clipboard() {
+    const clipButtons = document.querySelectorAll('.clip-button');
+
+    function hideTooltip(elem) {
+        elem.firstChild.innerText = '';
+        elem.className = 'clip-button';
+    }
+
+    function showTooltip(elem, msg) {
+        elem.firstChild.innerText = msg;
+        elem.className = 'clip-button tooltipped';
+    }
+
+    const clipboardSnippets = new ClipboardJS('.clip-button', {
+        text: function(trigger) {
+            hideTooltip(trigger);
+            const playground = trigger.closest('pre');
+            return playground_text(playground, false);
+        },
+    });
+
+    Array.from(clipButtons).forEach(function(clipButton) {
+        clipButton.addEventListener('mouseout', function(e) {
+            hideTooltip(e.currentTarget);
+        });
+    });
+
+    clipboardSnippets.on('success', function(e) {
+        e.clearSelection();
+        showTooltip(e.trigger, 'Copied!');
+    });
+
+    clipboardSnippets.on('error', function(e) {
+        showTooltip(e.trigger, 'Clipboard error!');
+    });
+})();
+
+(function scrollToTop() {
+    const menuTitle = document.querySelector('.menu-title');
+
+    menuTitle.addEventListener('click', function() {
+        document.scrollingElement.scrollTo({ top: 0, behavior: 'smooth' });
+    });
+})();
+
+(function controllMenu() {
+    const menu = document.getElementById('menu-bar');
+
+    (function controllPosition() {
+        let scrollTop = document.scrollingElement.scrollTop;
+        let prevScrollTop = scrollTop;
+        const minMenuY = -menu.clientHeight - 50;
+        // When the script loads, the page can be at any scroll (e.g. if you reforesh it).
+        menu.style.top = scrollTop + 'px';
+        // Same as parseInt(menu.style.top.slice(0, -2), but faster
+        let topCache = menu.style.top.slice(0, -2);
+        menu.classList.remove('sticky');
+        let stickyCache = false; // Same as menu.classList.contains('sticky'), but faster
+        document.addEventListener('scroll', function() {
+            scrollTop = Math.max(document.scrollingElement.scrollTop, 0);
+            // `null` means that it doesn't need to be updated
+            let nextSticky = null;
+            let nextTop = null;
+            const scrollDown = scrollTop > prevScrollTop;
+            const menuPosAbsoluteY = topCache - scrollTop;
+            if (scrollDown) {
+                nextSticky = false;
+                if (menuPosAbsoluteY > 0) {
+                    nextTop = prevScrollTop;
+                }
+            } else {
+                if (menuPosAbsoluteY > 0) {
+                    nextSticky = true;
+                } else if (menuPosAbsoluteY < minMenuY) {
+                    nextTop = prevScrollTop + minMenuY;
+                }
+            }
+            if (nextSticky === true && stickyCache === false) {
+                menu.classList.add('sticky');
+                stickyCache = true;
+            } else if (nextSticky === false && stickyCache === true) {
+                menu.classList.remove('sticky');
+                stickyCache = false;
+            }
+            if (nextTop !== null) {
+                menu.style.top = nextTop + 'px';
+                topCache = nextTop;
+            }
+            prevScrollTop = scrollTop;
+        }, { passive: true });
+    })();
+    (function controllBorder() {
+        function updateBorder() {
+            if (menu.offsetTop === 0) {
+                menu.classList.remove('bordered');
+            } else {
+                menu.classList.add('bordered');
+            }
+        }
+        updateBorder();
+        document.addEventListener('scroll', updateBorder, { passive: true });
+    })();
+})();

server/docs-prod/book/chapter_1.html

@@ -0,0 +1,214 @@
+<!DOCTYPE HTML>
+<html lang="en" class="light sidebar-visible" dir="ltr">
+    <head>
+        <!-- Book generated using mdBook -->
+        <meta charset="UTF-8">
+        <title>Chapter 1 - Server API Documentation</title>
+
+
+        <!-- Custom HTML head -->
+
+        <meta name="description" content="">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta name="theme-color" content="#ffffff">
+
+        <link rel="icon" href="favicon.svg">
+        <link rel="shortcut icon" href="favicon.png">
+        <link rel="stylesheet" href="css/variables.css">
+        <link rel="stylesheet" href="css/general.css">
+        <link rel="stylesheet" href="css/chrome.css">
+        <link rel="stylesheet" href="css/print.css" media="print">
+
+        <!-- Fonts -->
+        <link rel="stylesheet" href="FontAwesome/css/font-awesome.css">
+        <link rel="stylesheet" href="fonts/fonts.css">
+
+        <!-- Highlight.js Stylesheets -->
+        <link rel="stylesheet" id="highlight-css" href="highlight.css">
+        <link rel="stylesheet" id="tomorrow-night-css" href="tomorrow-night.css">
+        <link rel="stylesheet" id="ayu-highlight-css" href="ayu-highlight.css">
+
+        <!-- Custom theme stylesheets -->
+
+
+        <!-- Provide site root and default themes to javascript -->
+        <script>
+            const path_to_root = "";
+            const default_light_theme = "light";
+            const default_dark_theme = "navy";
+        </script>
+        <!-- Start loading toc.js asap -->
+        <script src="toc.js"></script>
+    </head>
+    <body>
+    <div id="body-container">
+        <!-- Work around some values being stored in localStorage wrapped in quotes -->
+        <script>
+            try {
+                let theme = localStorage.getItem('mdbook-theme');
+                let sidebar = localStorage.getItem('mdbook-sidebar');
+
+                if (theme.startsWith('"') && theme.endsWith('"')) {
+                    localStorage.setItem('mdbook-theme', theme.slice(1, theme.length - 1));
+                }
+
+                if (sidebar.startsWith('"') && sidebar.endsWith('"')) {
+                    localStorage.setItem('mdbook-sidebar', sidebar.slice(1, sidebar.length - 1));
+                }
+            } catch (e) { }
+        </script>
+
+        <!-- Set the theme before any content is loaded, prevents flash -->
+        <script>
+            const default_theme = window.matchMedia("(prefers-color-scheme: dark)").matches ? default_dark_theme : default_light_theme;
+            let theme;
+            try { theme = localStorage.getItem('mdbook-theme'); } catch(e) { }
+            if (theme === null || theme === undefined) { theme = default_theme; }
+            const html = document.documentElement;
+            html.classList.remove('light')
+            html.classList.add(theme);
+            html.classList.add("js");
+        </script>
+
+        <input type="checkbox" id="sidebar-toggle-anchor" class="hidden">
+
+        <!-- Hide / unhide sidebar before it is displayed -->
+        <script>
+            let sidebar = null;
+            const sidebar_toggle = document.getElementById("sidebar-toggle-anchor");
+            if (document.body.clientWidth >= 1080) {
+                try { sidebar = localStorage.getItem('mdbook-sidebar'); } catch(e) { }
+                sidebar = sidebar || 'visible';
+            } else {
+                sidebar = 'hidden';
+            }
+            sidebar_toggle.checked = sidebar === 'visible';
+            html.classList.remove('sidebar-visible');
+            html.classList.add("sidebar-" + sidebar);
+        </script>
+
+        <nav id="sidebar" class="sidebar" aria-label="Table of contents">
+            <!-- populated by js -->
+            <mdbook-sidebar-scrollbox class="sidebar-scrollbox"></mdbook-sidebar-scrollbox>
+            <noscript>
+                <iframe class="sidebar-iframe-outer" src="toc.html"></iframe>
+            </noscript>
+            <div id="sidebar-resize-handle" class="sidebar-resize-handle">
+                <div class="sidebar-resize-indicator"></div>
+            </div>
+        </nav>
+
+        <div id="page-wrapper" class="page-wrapper">
+
+            <div class="page">
+                <div id="menu-bar-hover-placeholder"></div>
+                <div id="menu-bar" class="menu-bar sticky">
+                    <div class="left-buttons">
+                        <label id="sidebar-toggle" class="icon-button" for="sidebar-toggle-anchor" title="Toggle Table of Contents" aria-label="Toggle Table of Contents" aria-controls="sidebar">
+                            <i class="fa fa-bars"></i>
+                        </label>
+                        <button id="theme-toggle" class="icon-button" type="button" title="Change theme" aria-label="Change theme" aria-haspopup="true" aria-expanded="false" aria-controls="theme-list">
+                            <i class="fa fa-paint-brush"></i>
+                        </button>
+                        <ul id="theme-list" class="theme-popup" aria-label="Themes" role="menu">
+                            <li role="none"><button role="menuitem" class="theme" id="default_theme">Auto</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="light">Light</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="rust">Rust</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
+                        </ul>
+                        <button id="search-toggle" class="icon-button" type="button" title="Search. (Shortkey: s)" aria-label="Toggle Searchbar" aria-expanded="false" aria-keyshortcuts="S" aria-controls="searchbar">
+                            <i class="fa fa-search"></i>
+                        </button>
+                    </div>
+
+                    <h1 class="menu-title">Server API Documentation</h1>
+
+                    <div class="right-buttons">
+                        <a href="print.html" title="Print this book" aria-label="Print this book">
+                            <i id="print-button" class="fa fa-print"></i>
+                        </a>
+
+                    </div>
+                </div>
+
+                <div id="search-wrapper" class="hidden">
+                    <form id="searchbar-outer" class="searchbar-outer">
+                        <input type="search" id="searchbar" name="searchbar" placeholder="Search this book ..." aria-controls="searchresults-outer" aria-describedby="searchresults-header">
+                    </form>
+                    <div id="searchresults-outer" class="searchresults-outer hidden">
+                        <div id="searchresults-header" class="searchresults-header"></div>
+                        <ul id="searchresults">
+                        </ul>
+                    </div>
+                </div>
+
+                <!-- Apply ARIA attributes after the sidebar and the sidebar toggle button are added to the DOM -->
+                <script>
+                    document.getElementById('sidebar-toggle').setAttribute('aria-expanded', sidebar === 'visible');
+                    document.getElementById('sidebar').setAttribute('aria-hidden', sidebar !== 'visible');
+                    Array.from(document.querySelectorAll('#sidebar a')).forEach(function(link) {
+                        link.setAttribute('tabIndex', sidebar === 'visible' ? 0 : -1);
+                    });
+                </script>
+
+                <div id="content" class="content">
+                    <main>
+                        <h1 id="chapter-1"><a class="header" href="#chapter-1">Chapter 1</a></h1>
+
+                    </main>
+
+                    <nav class="nav-wrapper" aria-label="Page navigation">
+                        <!-- Mobile navigation buttons -->
+
+
+                        <div style="clear: both"></div>
+                    </nav>
+                </div>
+            </div>
+
+            <nav class="nav-wide-wrapper" aria-label="Page navigation">
+
+            </nav>
+
+        </div>
+
+        <!-- Livereload script (if served using the cli tool) -->
+        <script>
+            const wsProtocol = location.protocol === 'https:' ? 'wss:' : 'ws:';
+            const wsAddress = wsProtocol + "//" + location.host + "/" + "__livereload";
+            const socket = new WebSocket(wsAddress);
+            socket.onmessage = function (event) {
+                if (event.data === "reload") {
+                    socket.close();
+                    location.reload();
+                }
+            };
+
+            window.onbeforeunload = function() {
+                socket.close();
+            }
+        </script>
+
+
+
+        <script>
+            window.playground_copyable = true;
+        </script>
+
+
+        <script src="elasticlunr.min.js"></script>
+        <script src="mark.min.js"></script>
+        <script src="searcher.js"></script>
+
+        <script src="clipboard.min.js"></script>
+        <script src="highlight.js"></script>
+        <script src="book.js"></script>
+
+        <!-- Custom JS scripts -->
+
+
+    </div>
+    </body>
+</html>

server/docs-prod/book/css/chrome.css

@@ -0,0 +1,643 @@
+/* CSS for UI elements (a.k.a. chrome) */
+
+html {
+    scrollbar-color: var(--scrollbar) var(--bg);
+}
+#searchresults a,
+.content a:link,
+a:visited,
+a > .hljs {
+    color: var(--links);
+}
+
+/*
+    body-container is necessary because mobile browsers don't seem to like
+    overflow-x on the body tag when there is a <meta name="viewport"> tag.
+*/
+#body-container {
+    /*
+        This is used when the sidebar pushes the body content off the side of
+        the screen on small screens. Without it, dragging on mobile Safari
+        will want to reposition the viewport in a weird way.
+    */
+    overflow-x: clip;
+}
+
+/* Menu Bar */
+
+#menu-bar,
+#menu-bar-hover-placeholder {
+    z-index: 101;
+    margin: auto calc(0px - var(--page-padding));
+}
+#menu-bar {
+    position: relative;
+    display: flex;
+    flex-wrap: wrap;
+    background-color: var(--bg);
+    border-block-end-color: var(--bg);
+    border-block-end-width: 1px;
+    border-block-end-style: solid;
+}
+#menu-bar.sticky,
+#menu-bar-hover-placeholder:hover + #menu-bar,
+#menu-bar:hover,
+html.sidebar-visible #menu-bar {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 0 !important;
+}
+#menu-bar-hover-placeholder {
+    position: sticky;
+    position: -webkit-sticky;
+    top: 0;
+    height: var(--menu-bar-height);
+}
+#menu-bar.bordered {
+    border-block-end-color: var(--table-border-color);
+}
+#menu-bar i, #menu-bar .icon-button {
+    position: relative;
+    padding: 0 8px;
+    z-index: 10;
+    line-height: var(--menu-bar-height);
+    cursor: pointer;
+    transition: color 0.5s;
+}
+@media only screen and (max-width: 420px) {
+    #menu-bar i, #menu-bar .icon-button {
+        padding: 0 5px;
+    }
+}
+
+.icon-button {
+    border: none;
+    background: none;
+    padding: 0;
+    color: inherit;
+}
+.icon-button i {
+    margin: 0;
+}
+
+.right-buttons {
+    margin: 0 15px;
+}
+.right-buttons a {
+    text-decoration: none;
+}
+
+.left-buttons {
+    display: flex;
+    margin: 0 5px;
+}
+html:not(.js) .left-buttons button {
+    display: none;
+}
+
+.menu-title {
+    display: inline-block;
+    font-weight: 200;
+    font-size: 2.4rem;
+    line-height: var(--menu-bar-height);
+    text-align: center;
+    margin: 0;
+    flex: 1;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+.menu-title {
+    cursor: pointer;
+}
+
+.menu-bar,
+.menu-bar:visited,
+.nav-chapters,
+.nav-chapters:visited,
+.mobile-nav-chapters,
+.mobile-nav-chapters:visited,
+.menu-bar .icon-button,
+.menu-bar a i {
+    color: var(--icons);
+}
+
+.menu-bar i:hover,
+.menu-bar .icon-button:hover,
+.nav-chapters:hover,
+.mobile-nav-chapters i:hover {
+    color: var(--icons-hover);
+}
+
+/* Nav Icons */
+
+.nav-chapters {
+    font-size: 2.5em;
+    text-align: center;
+    text-decoration: none;
+
+    position: fixed;
+    top: 0;
+    bottom: 0;
+    margin: 0;
+    max-width: 150px;
+    min-width: 90px;
+
+    display: flex;
+    justify-content: center;
+    align-content: center;
+    flex-direction: column;
+
+    transition: color 0.5s, background-color 0.5s;
+}
+
+.nav-chapters:hover {
+    text-decoration: none;
+    background-color: var(--theme-hover);
+    transition: background-color 0.15s, color 0.15s;
+}
+
+.nav-wrapper {
+    margin-block-start: 50px;
+    display: none;
+}
+
+.mobile-nav-chapters {
+    font-size: 2.5em;
+    text-align: center;
+    text-decoration: none;
+    width: 90px;
+    border-radius: 5px;
+    background-color: var(--sidebar-bg);
+}
+
+/* Only Firefox supports flow-relative values */
+.previous { float: left; }
+[dir=rtl] .previous { float: right; }
+
+/* Only Firefox supports flow-relative values */
+.next {
+    float: right;
+    right: var(--page-padding);
+}
+[dir=rtl] .next {
+    float: left;
+    right: unset;
+    left: var(--page-padding);
+}
+
+/* Use the correct buttons for RTL layouts*/
+[dir=rtl] .previous i.fa-angle-left:before {content:"\f105";}
+[dir=rtl] .next i.fa-angle-right:before { content:"\f104"; }
+
+@media only screen and (max-width: 1080px) {
+    .nav-wide-wrapper { display: none; }
+    .nav-wrapper { display: block; }
+}
+
+/* sidebar-visible */
+@media only screen and (max-width: 1380px) {
+    #sidebar-toggle-anchor:checked ~ .page-wrapper .nav-wide-wrapper { display: none; }
+    #sidebar-toggle-anchor:checked ~ .page-wrapper .nav-wrapper { display: block; }
+}
+
+/* Inline code */
+
+:not(pre) > .hljs {
+    display: inline;
+    padding: 0.1em 0.3em;
+    border-radius: 3px;
+}
+
+:not(pre):not(a) > .hljs {
+    color: var(--inline-code-color);
+    overflow-x: initial;
+}
+
+a:hover > .hljs {
+    text-decoration: underline;
+}
+
+pre {
+    position: relative;
+}
+pre > .buttons {
+    position: absolute;
+    z-index: 100;
+    right: 0px;
+    top: 2px;
+    margin: 0px;
+    padding: 2px 0px;
+
+    color: var(--sidebar-fg);
+    cursor: pointer;
+    visibility: hidden;
+    opacity: 0;
+    transition: visibility 0.1s linear, opacity 0.1s linear;
+}
+pre:hover > .buttons {
+    visibility: visible;
+    opacity: 1
+}
+pre > .buttons :hover {
+    color: var(--sidebar-active);
+    border-color: var(--icons-hover);
+    background-color: var(--theme-hover);
+}
+pre > .buttons i {
+    margin-inline-start: 8px;
+}
+pre > .buttons button {
+    cursor: inherit;
+    margin: 0px 5px;
+    padding: 4px 4px 3px 5px;
+    font-size: 23px;
+
+    border-style: solid;
+    border-width: 1px;
+    border-radius: 4px;
+    border-color: var(--icons);
+    background-color: var(--theme-popup-bg);
+    transition: 100ms;
+    transition-property: color,border-color,background-color;
+    color: var(--icons);
+}
+
+pre > .buttons button.clip-button {
+    padding: 2px 4px 0px 6px;
+}
+pre > .buttons button.clip-button::before {
+    /* clipboard image from octicons (https://github.com/primer/octicons/tree/v2.0.0) MIT license
+     */
+    content: url('data:image/svg+xml,<svg width="21" height="20" viewBox="0 0 24 25" \
+xmlns="http://www.w3.org/2000/svg" aria-label="Copy to clipboard">\
+<path d="M18 20h2v3c0 1-1 2-2 2H2c-.998 0-2-1-2-2V5c0-.911.755-1.667 1.667-1.667h5A3.323 3.323 0 \
+0110 0a3.323 3.323 0 013.333 3.333h5C19.245 3.333 20 4.09 20 5v8.333h-2V9H2v14h16v-3zM3 \
+7h14c0-.911-.793-1.667-1.75-1.667H13.5c-.957 0-1.75-.755-1.75-1.666C11.75 2.755 10.957 2 10 \
+2s-1.75.755-1.75 1.667c0 .911-.793 1.666-1.75 1.666H4.75C3.793 5.333 3 6.09 3 7z"/>\
+<path d="M4 19h6v2H4zM12 11H4v2h8zM4 17h4v-2H4zM15 15v-3l-4.5 4.5L15 21v-3l8.027-.032L23 15z"/>\
+</svg>');
+    filter: var(--copy-button-filter);
+}
+pre > .buttons button.clip-button:hover::before {
+    filter: var(--copy-button-filter-hover);
+}
+
+@media (pointer: coarse) {
+    pre > .buttons button {
+        /* On mobile, make it easier to tap buttons. */
+        padding: 0.3rem 1rem;
+    }
+
+    .sidebar-resize-indicator {
+        /* Hide resize indicator on devices with limited accuracy */
+        display: none;
+    }
+}
+pre > code {
+    display: block;
+    padding: 1rem;
+}
+
+/* FIXME: ACE editors overlap their buttons because ACE does absolute
+   positioning within the code block which breaks padding. The only solution I
+   can think of is to move the padding to the outer pre tag (or insert a div
+   wrapper), but that would require fixing a whole bunch of CSS rules.
+*/
+.hljs.ace_editor {
+  padding: 0rem 0rem;
+}
+
+pre > .result {
+    margin-block-start: 10px;
+}
+
+/* Search */
+
+#searchresults a {
+    text-decoration: none;
+}
+
+mark {
+    border-radius: 2px;
+    padding-block-start: 0;
+    padding-block-end: 1px;
+    padding-inline-start: 3px;
+    padding-inline-end: 3px;
+    margin-block-start: 0;
+    margin-block-end: -1px;
+    margin-inline-start: -3px;
+    margin-inline-end: -3px;
+    background-color: var(--search-mark-bg);
+    transition: background-color 300ms linear;
+    cursor: pointer;
+}
+
+mark.fade-out {
+    background-color: rgba(0,0,0,0) !important;
+    cursor: auto;
+}
+
+.searchbar-outer {
+    margin-inline-start: auto;
+    margin-inline-end: auto;
+    max-width: var(--content-max-width);
+}
+
+#searchbar {
+    width: 100%;
+    margin-block-start: 5px;
+    margin-block-end: 0;
+    margin-inline-start: auto;
+    margin-inline-end: auto;
+    padding: 10px 16px;
+    transition: box-shadow 300ms ease-in-out;
+    border: 1px solid var(--searchbar-border-color);
+    border-radius: 3px;
+    background-color: var(--searchbar-bg);
+    color: var(--searchbar-fg);
+}
+#searchbar:focus,
+#searchbar.active {
+    box-shadow: 0 0 3px var(--searchbar-shadow-color);
+}
+
+.searchresults-header {
+    font-weight: bold;
+    font-size: 1em;
+    padding-block-start: 18px;
+    padding-block-end: 0;
+    padding-inline-start: 5px;
+    padding-inline-end: 0;
+    color: var(--searchresults-header-fg);
+}
+
+.searchresults-outer {
+    margin-inline-start: auto;
+    margin-inline-end: auto;
+    max-width: var(--content-max-width);
+    border-block-end: 1px dashed var(--searchresults-border-color);
+}
+
+ul#searchresults {
+    list-style: none;
+    padding-inline-start: 20px;
+}
+ul#searchresults li {
+    margin: 10px 0px;
+    padding: 2px;
+    border-radius: 2px;
+}
+ul#searchresults li.focus {
+    background-color: var(--searchresults-li-bg);
+}
+ul#searchresults span.teaser {
+    display: block;
+    clear: both;
+    margin-block-start: 5px;
+    margin-block-end: 0;
+    margin-inline-start: 20px;
+    margin-inline-end: 0;
+    font-size: 0.8em;
+}
+ul#searchresults span.teaser em {
+    font-weight: bold;
+    font-style: normal;
+}
+
+/* Sidebar */
+
+.sidebar {
+    position: fixed;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    width: var(--sidebar-width);
+    font-size: 0.875em;
+    box-sizing: border-box;
+    -webkit-overflow-scrolling: touch;
+    overscroll-behavior-y: contain;
+    background-color: var(--sidebar-bg);
+    color: var(--sidebar-fg);
+}
+.sidebar-iframe-inner {
+    --padding: 10px;
+
+    background-color: var(--sidebar-bg);
+    padding: var(--padding);
+    margin: 0;
+    font-size: 1.4rem;
+    color: var(--sidebar-fg);
+    min-height: calc(100vh - var(--padding) * 2);
+}
+.sidebar-iframe-outer {
+    border: none;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+}
+[dir=rtl] .sidebar { left: unset; right: 0; }
+.sidebar-resizing {
+    -moz-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+html:not(.sidebar-resizing) .sidebar {
+    transition: transform 0.3s; /* Animation: slide away */
+}
+.sidebar code {
+    line-height: 2em;
+}
+.sidebar .sidebar-scrollbox {
+    overflow-y: auto;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    padding: 10px 10px;
+}
+.sidebar .sidebar-resize-handle {
+    position: absolute;
+    cursor: col-resize;
+    width: 0;
+    right: calc(var(--sidebar-resize-indicator-width) * -1);
+    top: 0;
+    bottom: 0;
+    display: flex;
+    align-items: center;
+}
+
+.sidebar-resize-handle .sidebar-resize-indicator {
+    width: 100%;
+    height: 12px;
+    background-color: var(--icons);
+    margin-inline-start: var(--sidebar-resize-indicator-space);
+}
+
+[dir=rtl] .sidebar .sidebar-resize-handle {
+    left: calc(var(--sidebar-resize-indicator-width) * -1);
+    right: unset;
+}
+.js .sidebar .sidebar-resize-handle {
+    cursor: col-resize;
+    width: calc(var(--sidebar-resize-indicator-width) - var(--sidebar-resize-indicator-space));
+}
+/* sidebar-hidden */
+#sidebar-toggle-anchor:not(:checked) ~ .sidebar {
+    transform: translateX(calc(0px - var(--sidebar-width) - var(--sidebar-resize-indicator-width)));
+    z-index: -1;
+}
+[dir=rtl] #sidebar-toggle-anchor:not(:checked) ~ .sidebar {
+    transform: translateX(calc(var(--sidebar-width) + var(--sidebar-resize-indicator-width)));
+}
+.sidebar::-webkit-scrollbar {
+    background: var(--sidebar-bg);
+}
+.sidebar::-webkit-scrollbar-thumb {
+    background: var(--scrollbar);
+}
+
+/* sidebar-visible */
+#sidebar-toggle-anchor:checked ~ .page-wrapper {
+    transform: translateX(calc(var(--sidebar-width) + var(--sidebar-resize-indicator-width)));
+}
+[dir=rtl] #sidebar-toggle-anchor:checked ~ .page-wrapper {
+    transform: translateX(calc(0px - var(--sidebar-width) - var(--sidebar-resize-indicator-width)));
+}
+@media only screen and (min-width: 620px) {
+    #sidebar-toggle-anchor:checked ~ .page-wrapper {
+        transform: none;
+        margin-inline-start: calc(var(--sidebar-width) + var(--sidebar-resize-indicator-width));
+    }
+    [dir=rtl] #sidebar-toggle-anchor:checked ~ .page-wrapper {
+        transform: none;
+    }
+}
+
+.chapter {
+    list-style: none outside none;
+    padding-inline-start: 0;
+    line-height: 2.2em;
+}
+
+.chapter ol {
+    width: 100%;
+}
+
+.chapter li {
+    display: flex;
+    color: var(--sidebar-non-existant);
+}
+.chapter li a {
+    display: block;
+    padding: 0;
+    text-decoration: none;
+    color: var(--sidebar-fg);
+}
+
+.chapter li a:hover {
+    color: var(--sidebar-active);
+}
+
+.chapter li a.active {
+    color: var(--sidebar-active);
+}
+
+.chapter li > a.toggle {
+    cursor: pointer;
+    display: block;
+    margin-inline-start: auto;
+    padding: 0 10px;
+    user-select: none;
+    opacity: 0.68;
+}
+
+.chapter li > a.toggle div {
+    transition: transform 0.5s;
+}
+
+/* collapse the section */
+.chapter li:not(.expanded) + li > ol {
+    display: none;
+}
+
+.chapter li.chapter-item {
+    line-height: 1.5em;
+    margin-block-start: 0.6em;
+}
+
+.chapter li.expanded > a.toggle div {
+    transform: rotate(90deg);
+}
+
+.spacer {
+    width: 100%;
+    height: 3px;
+    margin: 5px 0px;
+}
+.chapter .spacer {
+    background-color: var(--sidebar-spacer);
+}
+
+@media (-moz-touch-enabled: 1), (pointer: coarse) {
+    .chapter li a { padding: 5px 0; }
+    .spacer { margin: 10px 0; }
+}
+
+.section {
+    list-style: none outside none;
+    padding-inline-start: 20px;
+    line-height: 1.9em;
+}
+
+/* Theme Menu Popup */
+
+.theme-popup {
+    position: absolute;
+    left: 10px;
+    top: var(--menu-bar-height);
+    z-index: 1000;
+    border-radius: 4px;
+    font-size: 0.7em;
+    color: var(--fg);
+    background: var(--theme-popup-bg);
+    border: 1px solid var(--theme-popup-border);
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    display: none;
+    /* Don't let the children's background extend past the rounded corners. */
+    overflow: hidden;
+}
+[dir=rtl] .theme-popup { left: unset;  right: 10px; }
+.theme-popup .default {
+    color: var(--icons);
+}
+.theme-popup .theme {
+    width: 100%;
+    border: 0;
+    margin: 0;
+    padding: 2px 20px;
+    line-height: 25px;
+    white-space: nowrap;
+    text-align: start;
+    cursor: pointer;
+    color: inherit;
+    background: inherit;
+    font-size: inherit;
+}
+.theme-popup .theme:hover {
+    background-color: var(--theme-hover);
+}
+
+.theme-selected::before {
+    display: inline-block;
+    content: "✓";
+    margin-inline-start: -14px;
+    width: 14px;
+}

server/docs-prod/book/css/general.css

@@ -0,0 +1,279 @@
+/* Base styles and content styles */
+
+:root {
+    /* Browser default font-size is 16px, this way 1 rem = 10px */
+    font-size: 62.5%;
+    color-scheme: var(--color-scheme);
+}
+
+html {
+    font-family: "Open Sans", sans-serif;
+    color: var(--fg);
+    background-color: var(--bg);
+    text-size-adjust: none;
+    -webkit-text-size-adjust: none;
+}
+
+body {
+    margin: 0;
+    font-size: 1.6rem;
+    overflow-x: hidden;
+}
+
+code {
+    font-family: var(--mono-font) !important;
+    font-size: var(--code-font-size);
+    direction: ltr !important;
+}
+
+/* make long words/inline code not x overflow */
+main {
+    overflow-wrap: break-word;
+}
+
+/* make wide tables scroll if they overflow */
+.table-wrapper {
+    overflow-x: auto;
+}
+
+/* Don't change font size in headers. */
+h1 code, h2 code, h3 code, h4 code, h5 code, h6 code {
+    font-size: unset;
+}
+
+.left { float: left; }
+.right { float: right; }
+.boring { opacity: 0.6; }
+.hide-boring .boring { display: none; }
+.hidden { display: none !important; }
+
+h2, h3 { margin-block-start: 2.5em; }
+h4, h5 { margin-block-start: 2em; }
+
+.header + .header h3,
+.header + .header h4,
+.header + .header h5 {
+    margin-block-start: 1em;
+}
+
+h1:target::before,
+h2:target::before,
+h3:target::before,
+h4:target::before,
+h5:target::before,
+h6:target::before {
+    display: inline-block;
+    content: "»";
+    margin-inline-start: -30px;
+    width: 30px;
+}
+
+/* This is broken on Safari as of version 14, but is fixed
+   in Safari Technology Preview 117 which I think will be Safari 14.2.
+   https://bugs.webkit.org/show_bug.cgi?id=218076
+*/
+:target {
+    /* Safari does not support logical properties */
+    scroll-margin-top: calc(var(--menu-bar-height) + 0.5em);
+}
+
+.page {
+    outline: 0;
+    padding: 0 var(--page-padding);
+    margin-block-start: calc(0px - var(--menu-bar-height)); /* Compensate for the #menu-bar-hover-placeholder */
+}
+.page-wrapper {
+    box-sizing: border-box;
+    background-color: var(--bg);
+}
+.no-js .page-wrapper,
+.js:not(.sidebar-resizing) .page-wrapper {
+    transition: margin-left 0.3s ease, transform 0.3s ease; /* Animation: slide away */
+}
+[dir=rtl] .js:not(.sidebar-resizing) .page-wrapper {
+    transition: margin-right 0.3s ease, transform 0.3s ease; /* Animation: slide away */
+}
+
+.content {
+    overflow-y: auto;
+    padding: 0 5px 50px 5px;
+}
+.content main {
+    margin-inline-start: auto;
+    margin-inline-end: auto;
+    max-width: var(--content-max-width);
+}
+.content p { line-height: 1.45em; }
+.content ol { line-height: 1.45em; }
+.content ul { line-height: 1.45em; }
+.content a { text-decoration: none; }
+.content a:hover { text-decoration: underline; }
+.content img, .content video { max-width: 100%; }
+.content .header:link,
+.content .header:visited {
+    color: var(--fg);
+}
+.content .header:link,
+.content .header:visited:hover {
+    text-decoration: none;
+}
+
+table {
+    margin: 0 auto;
+    border-collapse: collapse;
+}
+table td {
+    padding: 3px 20px;
+    border: 1px var(--table-border-color) solid;
+}
+table thead {
+    background: var(--table-header-bg);
+}
+table thead td {
+    font-weight: 700;
+    border: none;
+}
+table thead th {
+    padding: 3px 20px;
+}
+table thead tr {
+    border: 1px var(--table-header-bg) solid;
+}
+/* Alternate background colors for rows */
+table tbody tr:nth-child(2n) {
+    background: var(--table-alternate-bg);
+}
+
+
+blockquote {
+    margin: 20px 0;
+    padding: 0 20px;
+    color: var(--fg);
+    background-color: var(--quote-bg);
+    border-block-start: .1em solid var(--quote-border);
+    border-block-end: .1em solid var(--quote-border);
+}
+
+.warning {
+    margin: 20px;
+    padding: 0 20px;
+    border-inline-start: 2px solid var(--warning-border);
+}
+
+.warning:before {
+    position: absolute;
+    width: 3rem;
+    height: 3rem;
+    margin-inline-start: calc(-1.5rem - 21px);
+    content: "ⓘ";
+    text-align: center;
+    background-color: var(--bg);
+    color: var(--warning-border);
+    font-weight: bold;
+    font-size: 2rem;
+}
+
+blockquote .warning:before {
+    background-color: var(--quote-bg);
+}
+
+kbd {
+    background-color: var(--table-border-color);
+    border-radius: 4px;
+    border: solid 1px var(--theme-popup-border);
+    box-shadow: inset 0 -1px 0 var(--theme-hover);
+    display: inline-block;
+    font-size: var(--code-font-size);
+    font-family: var(--mono-font);
+    line-height: 10px;
+    padding: 4px 5px;
+    vertical-align: middle;
+}
+
+sup {
+    /* Set the line-height for superscript and footnote references so that there
+       isn't an awkward space appearing above lines that contain the footnote.
+
+       See https://github.com/rust-lang/mdBook/pull/2443#discussion_r1813773583
+       for an explanation.
+    */
+    line-height: 0;
+}
+
+.footnote-definition {
+    font-size: 0.9em;
+}
+/* The default spacing for a list is a little too large. */
+.footnote-definition ul,
+.footnote-definition ol {
+    padding-left: 20px;
+}
+.footnote-definition > li {
+    /* Required to position the ::before target */
+    position: relative;
+}
+.footnote-definition > li:target {
+    scroll-margin-top: 50vh;
+}
+.footnote-reference:target {
+    scroll-margin-top: 50vh;
+}
+/* Draws a border around the footnote (including the marker) when it is selected.
+   TODO: If there are multiple linkbacks, highlight which one you just came
+   from so you know which one to click.
+*/
+.footnote-definition > li:target::before {
+    border: 2px solid var(--footnote-highlight);
+    border-radius: 6px;
+    position: absolute;
+    top: -8px;
+    right: -8px;
+    bottom: -8px;
+    left: -32px;
+    pointer-events: none;
+    content: "";
+}
+/* Pulses the footnote reference so you can quickly see where you left off reading.
+   This could use some improvement.
+*/
+@media not (prefers-reduced-motion) {
+    .footnote-reference:target  {
+        animation: fn-highlight 0.8s;
+        border-radius: 2px;
+    }
+
+    @keyframes fn-highlight {
+        from {
+            background-color: var(--footnote-highlight);
+        }
+    }
+}
+
+.tooltiptext {
+    position: absolute;
+    visibility: hidden;
+    color: #fff;
+    background-color: #333;
+    transform: translateX(-50%); /* Center by moving tooltip 50% of its width left */
+    left: -8px; /* Half of the width of the icon */
+    top: -35px;
+    font-size: 0.8em;
+    text-align: center;
+    border-radius: 6px;
+    padding: 5px 8px;
+    margin: 5px;
+    z-index: 1000;
+}
+.tooltipped .tooltiptext {
+    visibility: visible;
+}
+
+.chapter li.part-title {
+    color: var(--sidebar-fg);
+    margin: 5px 0px;
+    font-weight: bold;
+}
+
+.result-no-output {
+    font-style: italic;
+}

server/docs-prod/book/css/print.css

@@ -0,0 +1,50 @@
+
+#sidebar,
+#menu-bar,
+.nav-chapters,
+.mobile-nav-chapters {
+    display: none;
+}
+
+#page-wrapper.page-wrapper {
+    transform: none !important;
+    margin-inline-start: 0px;
+    overflow-y: initial;
+}
+
+#content {
+    max-width: none;
+    margin: 0;
+    padding: 0;
+}
+
+.page {
+    overflow-y: initial;
+}
+
+code {
+    direction: ltr !important;
+}
+
+pre > .buttons {
+    z-index: 2;
+}
+
+a, a:visited, a:active, a:hover {
+    color: #4183c4;
+    text-decoration: none;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    page-break-inside: avoid;
+    page-break-after: avoid;
+}
+
+pre, code {
+    page-break-inside: avoid;
+    white-space: pre-wrap;
+}
+
+.fa {
+    display: none !important;
+}

server/docs-prod/book/css/variables.css

@@ -0,0 +1,320 @@
+
+/* Globals */
+
+:root {
+    --sidebar-target-width: 300px;
+    --sidebar-width: min(var(--sidebar-target-width), 80vw);
+    --sidebar-resize-indicator-width: 8px;
+    --sidebar-resize-indicator-space: 2px;
+    --page-padding: 15px;
+    --content-max-width: 750px;
+    --menu-bar-height: 50px;
+    --mono-font: "Source Code Pro", Consolas, "Ubuntu Mono", Menlo, "DejaVu Sans Mono", monospace, monospace;
+    --code-font-size: 0.875em; /* please adjust the ace font size accordingly in editor.js */
+}
+
+/* Themes */
+
+.ayu {
+    --bg: hsl(210, 25%, 8%);
+    --fg: #c5c5c5;
+
+    --sidebar-bg: #14191f;
+    --sidebar-fg: #c8c9db;
+    --sidebar-non-existant: #5c6773;
+    --sidebar-active: #ffb454;
+    --sidebar-spacer: #2d334f;
+
+    --scrollbar: var(--sidebar-fg);
+
+    --icons: #737480;
+    --icons-hover: #b7b9cc;
+
+    --links: #0096cf;
+
+    --inline-code-color: #ffb454;
+
+    --theme-popup-bg: #14191f;
+    --theme-popup-border: #5c6773;
+    --theme-hover: #191f26;
+
+    --quote-bg: hsl(226, 15%, 17%);
+    --quote-border: hsl(226, 15%, 22%);
+
+    --warning-border: #ff8e00;
+
+    --table-border-color: hsl(210, 25%, 13%);
+    --table-header-bg: hsl(210, 25%, 28%);
+    --table-alternate-bg: hsl(210, 25%, 11%);
+
+    --searchbar-border-color: #848484;
+    --searchbar-bg: #424242;
+    --searchbar-fg: #fff;
+    --searchbar-shadow-color: #d4c89f;
+    --searchresults-header-fg: #666;
+    --searchresults-border-color: #888;
+    --searchresults-li-bg: #252932;
+    --search-mark-bg: #e3b171;
+
+    --color-scheme: dark;
+
+    /* Same as `--icons` */
+    --copy-button-filter: invert(45%) sepia(6%) saturate(621%) hue-rotate(198deg) brightness(99%) contrast(85%);
+    /* Same as `--sidebar-active` */
+    --copy-button-filter-hover: invert(68%) sepia(55%) saturate(531%) hue-rotate(341deg) brightness(104%) contrast(101%);
+
+    --footnote-highlight: #2668a6;
+}
+
+.coal {
+    --bg: hsl(200, 7%, 8%);
+    --fg: #98a3ad;
+
+    --sidebar-bg: #292c2f;
+    --sidebar-fg: #a1adb8;
+    --sidebar-non-existant: #505254;
+    --sidebar-active: #3473ad;
+    --sidebar-spacer: #393939;
+
+    --scrollbar: var(--sidebar-fg);
+
+    --icons: #43484d;
+    --icons-hover: #b3c0cc;
+
+    --links: #2b79a2;
+
+    --inline-code-color: #c5c8c6;
+
+    --theme-popup-bg: #141617;
+    --theme-popup-border: #43484d;
+    --theme-hover: #1f2124;
+
+    --quote-bg: hsl(234, 21%, 18%);
+    --quote-border: hsl(234, 21%, 23%);
+
+    --warning-border: #ff8e00;
+
+    --table-border-color: hsl(200, 7%, 13%);
+    --table-header-bg: hsl(200, 7%, 28%);
+    --table-alternate-bg: hsl(200, 7%, 11%);
+
+    --searchbar-border-color: #aaa;
+    --searchbar-bg: #b7b7b7;
+    --searchbar-fg: #000;
+    --searchbar-shadow-color: #aaa;
+    --searchresults-header-fg: #666;
+    --searchresults-border-color: #98a3ad;
+    --searchresults-li-bg: #2b2b2f;
+    --search-mark-bg: #355c7d;
+
+    --color-scheme: dark;
+
+    /* Same as `--icons` */
+    --copy-button-filter: invert(26%) sepia(8%) saturate(575%) hue-rotate(169deg) brightness(87%) contrast(82%);
+    /* Same as `--sidebar-active` */
+    --copy-button-filter-hover: invert(36%) sepia(70%) saturate(503%) hue-rotate(167deg) brightness(98%) contrast(89%);
+
+    --footnote-highlight: #4079ae;
+}
+
+.light, html:not(.js) {
+    --bg: hsl(0, 0%, 100%);
+    --fg: hsl(0, 0%, 0%);
+
+    --sidebar-bg: #fafafa;
+    --sidebar-fg: hsl(0, 0%, 0%);
+    --sidebar-non-existant: #aaaaaa;
+    --sidebar-active: #1f1fff;
+    --sidebar-spacer: #f4f4f4;
+
+    --scrollbar: #8F8F8F;
+
+    --icons: #747474;
+    --icons-hover: #000000;
+
+    --links: #20609f;
+
+    --inline-code-color: #301900;
+
+    --theme-popup-bg: #fafafa;
+    --theme-popup-border: #cccccc;
+    --theme-hover: #e6e6e6;
+
+    --quote-bg: hsl(197, 37%, 96%);
+    --quote-border: hsl(197, 37%, 91%);
+
+    --warning-border: #ff8e00;
+
+    --table-border-color: hsl(0, 0%, 95%);
+    --table-header-bg: hsl(0, 0%, 80%);
+    --table-alternate-bg: hsl(0, 0%, 97%);
+
+    --searchbar-border-color: #aaa;
+    --searchbar-bg: #fafafa;
+    --searchbar-fg: #000;
+    --searchbar-shadow-color: #aaa;
+    --searchresults-header-fg: #666;
+    --searchresults-border-color: #888;
+    --searchresults-li-bg: #e4f2fe;
+    --search-mark-bg: #a2cff5;
+
+    --color-scheme: light;
+
+    /* Same as `--icons` */
+    --copy-button-filter: invert(45.49%);
+    /* Same as `--sidebar-active` */
+    --copy-button-filter-hover: invert(14%) sepia(93%) saturate(4250%) hue-rotate(243deg) brightness(99%) contrast(130%);
+
+    --footnote-highlight: #7e7eff;
+}
+
+.navy {
+    --bg: hsl(226, 23%, 11%);
+    --fg: #bcbdd0;
+
+    --sidebar-bg: #282d3f;
+    --sidebar-fg: #c8c9db;
+    --sidebar-non-existant: #505274;
+    --sidebar-active: #2b79a2;
+    --sidebar-spacer: #2d334f;
+
+    --scrollbar: var(--sidebar-fg);
+
+    --icons: #737480;
+    --icons-hover: #b7b9cc;
+
+    --links: #2b79a2;
+
+    --inline-code-color: #c5c8c6;
+
+    --theme-popup-bg: #161923;
+    --theme-popup-border: #737480;
+    --theme-hover: #282e40;
+
+    --quote-bg: hsl(226, 15%, 17%);
+    --quote-border: hsl(226, 15%, 22%);
+
+    --warning-border: #ff8e00;
+
+    --table-border-color: hsl(226, 23%, 16%);
+    --table-header-bg: hsl(226, 23%, 31%);
+    --table-alternate-bg: hsl(226, 23%, 14%);
+
+    --searchbar-border-color: #aaa;
+    --searchbar-bg: #aeaec6;
+    --searchbar-fg: #000;
+    --searchbar-shadow-color: #aaa;
+    --searchresults-header-fg: #5f5f71;
+    --searchresults-border-color: #5c5c68;
+    --searchresults-li-bg: #242430;
+    --search-mark-bg: #a2cff5;
+
+    --color-scheme: dark;
+
+    /* Same as `--icons` */
+    --copy-button-filter: invert(51%) sepia(10%) saturate(393%) hue-rotate(198deg) brightness(86%) contrast(87%);
+    /* Same as `--sidebar-active` */
+    --copy-button-filter-hover: invert(46%) sepia(20%) saturate(1537%) hue-rotate(156deg) brightness(85%) contrast(90%);
+
+    --footnote-highlight: #4079ae;
+}
+
+.rust {
+    --bg: hsl(60, 9%, 87%);
+    --fg: #262625;
+
+    --sidebar-bg: #3b2e2a;
+    --sidebar-fg: #c8c9db;
+    --sidebar-non-existant: #505254;
+    --sidebar-active: #e69f67;
+    --sidebar-spacer: #45373a;
+
+    --scrollbar: var(--sidebar-fg);
+
+    --icons: #737480;
+    --icons-hover: #262625;
+
+    --links: #2b79a2;
+
+    --inline-code-color: #6e6b5e;
+
+    --theme-popup-bg: #e1e1db;
+    --theme-popup-border: #b38f6b;
+    --theme-hover: #99908a;
+
+    --quote-bg: hsl(60, 5%, 75%);
+    --quote-border: hsl(60, 5%, 70%);
+
+    --warning-border: #ff8e00;
+
+    --table-border-color: hsl(60, 9%, 82%);
+    --table-header-bg: #b3a497;
+    --table-alternate-bg: hsl(60, 9%, 84%);
+
+    --searchbar-border-color: #aaa;
+    --searchbar-bg: #fafafa;
+    --searchbar-fg: #000;
+    --searchbar-shadow-color: #aaa;
+    --searchresults-header-fg: #666;
+    --searchresults-border-color: #888;
+    --searchresults-li-bg: #dec2a2;
+    --search-mark-bg: #e69f67;
+
+    /* Same as `--icons` */
+    --copy-button-filter: invert(51%) sepia(10%) saturate(393%) hue-rotate(198deg) brightness(86%) contrast(87%);
+    /* Same as `--sidebar-active` */
+    --copy-button-filter-hover: invert(77%) sepia(16%) saturate(1798%) hue-rotate(328deg) brightness(98%) contrast(83%);
+
+    --footnote-highlight: #d3a17a;
+}
+
+@media (prefers-color-scheme: dark) {
+    html:not(.js) {
+        --bg: hsl(200, 7%, 8%);
+        --fg: #98a3ad;
+
+        --sidebar-bg: #292c2f;
+        --sidebar-fg: #a1adb8;
+        --sidebar-non-existant: #505254;
+        --sidebar-active: #3473ad;
+        --sidebar-spacer: #393939;
+
+        --scrollbar: var(--sidebar-fg);
+
+        --icons: #43484d;
+        --icons-hover: #b3c0cc;
+
+        --links: #2b79a2;
+
+        --inline-code-color: #c5c8c6;
+
+        --theme-popup-bg: #141617;
+        --theme-popup-border: #43484d;
+        --theme-hover: #1f2124;
+
+        --quote-bg: hsl(234, 21%, 18%);
+        --quote-border: hsl(234, 21%, 23%);
+
+        --warning-border: #ff8e00;
+
+        --table-border-color: hsl(200, 7%, 13%);
+        --table-header-bg: hsl(200, 7%, 28%);
+        --table-alternate-bg: hsl(200, 7%, 11%);
+
+        --searchbar-border-color: #aaa;
+        --searchbar-bg: #b7b7b7;
+        --searchbar-fg: #000;
+        --searchbar-shadow-color: #aaa;
+        --searchresults-header-fg: #666;
+        --searchresults-border-color: #98a3ad;
+        --searchresults-li-bg: #2b2b2f;
+        --search-mark-bg: #355c7d;
+
+        --color-scheme: dark;
+
+        /* Same as `--icons` */
+        --copy-button-filter: invert(26%) sepia(8%) saturate(575%) hue-rotate(169deg) brightness(87%) contrast(82%);
+        /* Same as `--sidebar-active` */
+        --copy-button-filter-hover: invert(36%) sepia(70%) saturate(503%) hue-rotate(167deg) brightness(98%) contrast(89%);
+    }
+}

server/docs-prod/book/favicon.svg

@@ -0,0 +1,22 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 199.7 184.2">
+  <style>
+    @media (prefers-color-scheme: dark) {
+      svg { fill: white; }
+    }
+  </style>
+<path d="M189.5,36.8c0.2,2.8,0,5.1-0.6,6.8L153,162c-0.6,2.1-2,3.7-4.2,5c-2.2,1.2-4.4,1.9-6.7,1.9H31.4c-9.6,0-15.3-2.8-17.3-8.4
+  c-0.8-2.2-0.8-3.9,0.1-5.2c0.9-1.2,2.4-1.8,4.6-1.8H123c7.4,0,12.6-1.4,15.4-4.1s5.7-8.9,8.6-18.4l32.9-108.6
+  c1.8-5.9,1-11.1-2.2-15.6S169.9,0,164,0H72.7c-1,0-3.1,0.4-6.1,1.1l0.1-0.4C64.5,0.2,62.6,0,61,0.1s-3,0.5-4.3,1.4
+  c-1.3,0.9-2.4,1.8-3.2,2.8S52,6.5,51.2,8.1c-0.8,1.6-1.4,3-1.9,4.3s-1.1,2.7-1.8,4.2c-0.7,1.5-1.3,2.7-2,3.7c-0.5,0.6-1.2,1.5-2,2.5
+  s-1.6,2-2.2,2.8s-0.9,1.5-1.1,2.2c-0.2,0.7-0.1,1.8,0.2,3.2c0.3,1.4,0.4,2.4,0.4,3.1c-0.3,3-1.4,6.9-3.3,11.6
+  c-1.9,4.7-3.6,8.1-5.1,10.1c-0.3,0.4-1.2,1.3-2.6,2.7c-1.4,1.4-2.3,2.6-2.6,3.7c-0.3,0.4-0.3,1.5-0.1,3.4c0.3,1.8,0.4,3.1,0.3,3.8
+  c-0.3,2.7-1.3,6.3-3,10.8c-1.7,4.5-3.4,8.2-5,11c-0.2,0.5-0.9,1.4-2,2.8c-1.1,1.4-1.8,2.5-2,3.4c-0.2,0.6-0.1,1.8,0.1,3.4
+  c0.2,1.6,0.2,2.8-0.1,3.6c-0.6,3-1.8,6.7-3.6,11c-1.8,4.3-3.6,7.9-5.4,11c-0.5,0.8-1.1,1.7-2,2.8c-0.8,1.1-1.5,2-2,2.8
+  s-0.8,1.6-1,2.5c-0.1,0.5,0,1.3,0.4,2.3c0.3,1.1,0.4,1.9,0.4,2.6c-0.1,1.1-0.2,2.6-0.5,4.4c-0.2,1.8-0.4,2.9-0.4,3.2
+  c-1.8,4.8-1.7,9.9,0.2,15.2c2.2,6.2,6.2,11.5,11.9,15.8c5.7,4.3,11.7,6.4,17.8,6.4h110.7c5.2,0,10.1-1.7,14.7-5.2s7.7-7.8,9.2-12.9
+  l33-108.6c1.8-5.8,1-10.9-2.2-15.5C194.9,39.7,192.6,38,189.5,36.8z M59.6,122.8L73.8,80c0,0,7,0,10.8,0s28.8-1.7,25.4,17.5
+  c-3.4,19.2-18.8,25.2-36.8,25.4S59.6,122.8,59.6,122.8z M78.6,116.8c4.7-0.1,18.9-2.9,22.1-17.1S89.2,86.3,89.2,86.3l-8.9,0
+  l-10.2,30.5C70.2,116.9,74,116.9,78.6,116.8z M75.3,68.7L89,26.2h9.8l0.8,34l23.6-34h9.9l-13.6,42.5h-7.1l12.5-35.4l-24.5,35.4h-6.8
+  l-0.8-35L82,68.7H75.3z"/>
+</svg>
+<!-- Original image Copyright Dave Gandy — CC BY 4.0 License -->

server/docs-prod/book/fonts/OPEN-SANS-LICENSE.txt

@@ -0,0 +1,202 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

server/docs-prod/book/fonts/SOURCE-CODE-PRO-LICENSE.txt

@@ -0,0 +1,93 @@
+Copyright 2010, 2012 Adobe Systems Incorporated (http://www.adobe.com/), with Reserved Font Name 'Source'. All Rights Reserved. Source is a trademark of Adobe Systems Incorporated in the United States and/or other countries.
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

server/docs-prod/book/fonts/fonts.css

@@ -0,0 +1,100 @@
+/* Open Sans is licensed under the Apache License, Version 2.0. See http://www.apache.org/licenses/LICENSE-2.0 */
+/* Source Code Pro is under the Open Font License. See https://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL */
+
+/* open-sans-300 - latin_vietnamese_latin-ext_greek-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Open Sans';
+  font-style: normal;
+  font-weight: 300;
+  src: local('Open Sans Light'), local('OpenSans-Light'),
+       url('../fonts/open-sans-v17-all-charsets-300.woff2') format('woff2');
+}
+
+/* open-sans-300italic - latin_vietnamese_latin-ext_greek-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Open Sans';
+  font-style: italic;
+  font-weight: 300;
+  src: local('Open Sans Light Italic'), local('OpenSans-LightItalic'),
+       url('../fonts/open-sans-v17-all-charsets-300italic.woff2') format('woff2');
+}
+
+/* open-sans-regular - latin_vietnamese_latin-ext_greek-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Open Sans';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Open Sans Regular'), local('OpenSans-Regular'),
+       url('../fonts/open-sans-v17-all-charsets-regular.woff2') format('woff2');
+}
+
+/* open-sans-italic - latin_vietnamese_latin-ext_greek-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Open Sans';
+  font-style: italic;
+  font-weight: 400;
+  src: local('Open Sans Italic'), local('OpenSans-Italic'),
+       url('../fonts/open-sans-v17-all-charsets-italic.woff2') format('woff2');
+}
+
+/* open-sans-600 - latin_vietnamese_latin-ext_greek-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Open Sans';
+  font-style: normal;
+  font-weight: 600;
+  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
+       url('../fonts/open-sans-v17-all-charsets-600.woff2') format('woff2');
+}
+
+/* open-sans-600italic - latin_vietnamese_latin-ext_greek-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Open Sans';
+  font-style: italic;
+  font-weight: 600;
+  src: local('Open Sans SemiBold Italic'), local('OpenSans-SemiBoldItalic'),
+       url('../fonts/open-sans-v17-all-charsets-600italic.woff2') format('woff2');
+}
+
+/* open-sans-700 - latin_vietnamese_latin-ext_greek-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Open Sans';
+  font-style: normal;
+  font-weight: 700;
+  src: local('Open Sans Bold'), local('OpenSans-Bold'),
+       url('../fonts/open-sans-v17-all-charsets-700.woff2') format('woff2');
+}
+
+/* open-sans-700italic - latin_vietnamese_latin-ext_greek-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Open Sans';
+  font-style: italic;
+  font-weight: 700;
+  src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'),
+       url('../fonts/open-sans-v17-all-charsets-700italic.woff2') format('woff2');
+}
+
+/* open-sans-800 - latin_vietnamese_latin-ext_greek-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Open Sans';
+  font-style: normal;
+  font-weight: 800;
+  src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'),
+       url('../fonts/open-sans-v17-all-charsets-800.woff2') format('woff2');
+}
+
+/* open-sans-800italic - latin_vietnamese_latin-ext_greek-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Open Sans';
+  font-style: italic;
+  font-weight: 800;
+  src: local('Open Sans ExtraBold Italic'), local('OpenSans-ExtraBoldItalic'),
+       url('../fonts/open-sans-v17-all-charsets-800italic.woff2') format('woff2');
+}
+
+/* source-code-pro-500 - latin_vietnamese_latin-ext_greek_cyrillic-ext_cyrillic */
+@font-face {
+  font-family: 'Source Code Pro';
+  font-style: normal;
+  font-weight: 500;
+  src: url('../fonts/source-code-pro-v11-all-charsets-500.woff2') format('woff2');
+}

server/docs-prod/book/highlight.css

@@ -0,0 +1,83 @@
+/*
+ * An increased contrast highlighting scheme loosely based on the
+ * "Base16 Atelier Dune Light" theme by Bram de Haan
+ * (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune)
+ * Original Base16 color scheme by Chris Kempson
+ * (https://github.com/chriskempson/base16)
+ */
+
+/* Comment */
+.hljs-comment,
+.hljs-quote {
+  color: #575757;
+}
+
+/* Red */
+.hljs-variable,
+.hljs-template-variable,
+.hljs-attribute,
+.hljs-attr,
+.hljs-tag,
+.hljs-name,
+.hljs-regexp,
+.hljs-link,
+.hljs-name,
+.hljs-selector-id,
+.hljs-selector-class {
+  color: #d70025;
+}
+
+/* Orange */
+.hljs-number,
+.hljs-meta,
+.hljs-built_in,
+.hljs-builtin-name,
+.hljs-literal,
+.hljs-type,
+.hljs-params {
+  color: #b21e00;
+}
+
+/* Green */
+.hljs-string,
+.hljs-symbol,
+.hljs-bullet {
+  color: #008200;
+}
+
+/* Blue */
+.hljs-title,
+.hljs-section {
+  color: #0030f2;
+}
+
+/* Purple */
+.hljs-keyword,
+.hljs-selector-tag {
+  color: #9d00ec;
+}
+
+.hljs {
+  display: block;
+  overflow-x: auto;
+  background: #f6f7f6;
+  color: #000;
+}
+
+.hljs-emphasis {
+  font-style: italic;
+}
+
+.hljs-strong {
+  font-weight: bold;
+}
+
+.hljs-addition {
+  color: #22863a;
+  background-color: #f0fff4;
+}
+
+.hljs-deletion {
+  color: #b31d28;
+  background-color: #ffeef0;
+}

server/docs-prod/book/index.html

@@ -0,0 +1,214 @@
+<!DOCTYPE HTML>
+<html lang="en" class="light sidebar-visible" dir="ltr">
+    <head>
+        <!-- Book generated using mdBook -->
+        <meta charset="UTF-8">
+        <title>Chapter 1 - Server API Documentation</title>
+
+
+        <!-- Custom HTML head -->
+
+        <meta name="description" content="">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta name="theme-color" content="#ffffff">
+
+        <link rel="icon" href="favicon.svg">
+        <link rel="shortcut icon" href="favicon.png">
+        <link rel="stylesheet" href="css/variables.css">
+        <link rel="stylesheet" href="css/general.css">
+        <link rel="stylesheet" href="css/chrome.css">
+        <link rel="stylesheet" href="css/print.css" media="print">
+
+        <!-- Fonts -->
+        <link rel="stylesheet" href="FontAwesome/css/font-awesome.css">
+        <link rel="stylesheet" href="fonts/fonts.css">
+
+        <!-- Highlight.js Stylesheets -->
+        <link rel="stylesheet" id="highlight-css" href="highlight.css">
+        <link rel="stylesheet" id="tomorrow-night-css" href="tomorrow-night.css">
+        <link rel="stylesheet" id="ayu-highlight-css" href="ayu-highlight.css">
+
+        <!-- Custom theme stylesheets -->
+
+
+        <!-- Provide site root and default themes to javascript -->
+        <script>
+            const path_to_root = "";
+            const default_light_theme = "light";
+            const default_dark_theme = "navy";
+        </script>
+        <!-- Start loading toc.js asap -->
+        <script src="toc.js"></script>
+    </head>
+    <body>
+    <div id="body-container">
+        <!-- Work around some values being stored in localStorage wrapped in quotes -->
+        <script>
+            try {
+                let theme = localStorage.getItem('mdbook-theme');
+                let sidebar = localStorage.getItem('mdbook-sidebar');
+
+                if (theme.startsWith('"') && theme.endsWith('"')) {
+                    localStorage.setItem('mdbook-theme', theme.slice(1, theme.length - 1));
+                }
+
+                if (sidebar.startsWith('"') && sidebar.endsWith('"')) {
+                    localStorage.setItem('mdbook-sidebar', sidebar.slice(1, sidebar.length - 1));
+                }
+            } catch (e) { }
+        </script>
+
+        <!-- Set the theme before any content is loaded, prevents flash -->
+        <script>
+            const default_theme = window.matchMedia("(prefers-color-scheme: dark)").matches ? default_dark_theme : default_light_theme;
+            let theme;
+            try { theme = localStorage.getItem('mdbook-theme'); } catch(e) { }
+            if (theme === null || theme === undefined) { theme = default_theme; }
+            const html = document.documentElement;
+            html.classList.remove('light')
+            html.classList.add(theme);
+            html.classList.add("js");
+        </script>
+
+        <input type="checkbox" id="sidebar-toggle-anchor" class="hidden">
+
+        <!-- Hide / unhide sidebar before it is displayed -->
+        <script>
+            let sidebar = null;
+            const sidebar_toggle = document.getElementById("sidebar-toggle-anchor");
+            if (document.body.clientWidth >= 1080) {
+                try { sidebar = localStorage.getItem('mdbook-sidebar'); } catch(e) { }
+                sidebar = sidebar || 'visible';
+            } else {
+                sidebar = 'hidden';
+            }
+            sidebar_toggle.checked = sidebar === 'visible';
+            html.classList.remove('sidebar-visible');
+            html.classList.add("sidebar-" + sidebar);
+        </script>
+
+        <nav id="sidebar" class="sidebar" aria-label="Table of contents">
+            <!-- populated by js -->
+            <mdbook-sidebar-scrollbox class="sidebar-scrollbox"></mdbook-sidebar-scrollbox>
+            <noscript>
+                <iframe class="sidebar-iframe-outer" src="toc.html"></iframe>
+            </noscript>
+            <div id="sidebar-resize-handle" class="sidebar-resize-handle">
+                <div class="sidebar-resize-indicator"></div>
+            </div>
+        </nav>
+
+        <div id="page-wrapper" class="page-wrapper">
+
+            <div class="page">
+                <div id="menu-bar-hover-placeholder"></div>
+                <div id="menu-bar" class="menu-bar sticky">
+                    <div class="left-buttons">
+                        <label id="sidebar-toggle" class="icon-button" for="sidebar-toggle-anchor" title="Toggle Table of Contents" aria-label="Toggle Table of Contents" aria-controls="sidebar">
+                            <i class="fa fa-bars"></i>
+                        </label>
+                        <button id="theme-toggle" class="icon-button" type="button" title="Change theme" aria-label="Change theme" aria-haspopup="true" aria-expanded="false" aria-controls="theme-list">
+                            <i class="fa fa-paint-brush"></i>
+                        </button>
+                        <ul id="theme-list" class="theme-popup" aria-label="Themes" role="menu">
+                            <li role="none"><button role="menuitem" class="theme" id="default_theme">Auto</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="light">Light</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="rust">Rust</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
+                        </ul>
+                        <button id="search-toggle" class="icon-button" type="button" title="Search. (Shortkey: s)" aria-label="Toggle Searchbar" aria-expanded="false" aria-keyshortcuts="S" aria-controls="searchbar">
+                            <i class="fa fa-search"></i>
+                        </button>
+                    </div>
+
+                    <h1 class="menu-title">Server API Documentation</h1>
+
+                    <div class="right-buttons">
+                        <a href="print.html" title="Print this book" aria-label="Print this book">
+                            <i id="print-button" class="fa fa-print"></i>
+                        </a>
+
+                    </div>
+                </div>
+
+                <div id="search-wrapper" class="hidden">
+                    <form id="searchbar-outer" class="searchbar-outer">
+                        <input type="search" id="searchbar" name="searchbar" placeholder="Search this book ..." aria-controls="searchresults-outer" aria-describedby="searchresults-header">
+                    </form>
+                    <div id="searchresults-outer" class="searchresults-outer hidden">
+                        <div id="searchresults-header" class="searchresults-header"></div>
+                        <ul id="searchresults">
+                        </ul>
+                    </div>
+                </div>
+
+                <!-- Apply ARIA attributes after the sidebar and the sidebar toggle button are added to the DOM -->
+                <script>
+                    document.getElementById('sidebar-toggle').setAttribute('aria-expanded', sidebar === 'visible');
+                    document.getElementById('sidebar').setAttribute('aria-hidden', sidebar !== 'visible');
+                    Array.from(document.querySelectorAll('#sidebar a')).forEach(function(link) {
+                        link.setAttribute('tabIndex', sidebar === 'visible' ? 0 : -1);
+                    });
+                </script>
+
+                <div id="content" class="content">
+                    <main>
+                        <h1 id="chapter-1"><a class="header" href="#chapter-1">Chapter 1</a></h1>
+
+                    </main>
+
+                    <nav class="nav-wrapper" aria-label="Page navigation">
+                        <!-- Mobile navigation buttons -->
+
+
+                        <div style="clear: both"></div>
+                    </nav>
+                </div>
+            </div>
+
+            <nav class="nav-wide-wrapper" aria-label="Page navigation">
+
+            </nav>
+
+        </div>
+
+        <!-- Livereload script (if served using the cli tool) -->
+        <script>
+            const wsProtocol = location.protocol === 'https:' ? 'wss:' : 'ws:';
+            const wsAddress = wsProtocol + "//" + location.host + "/" + "__livereload";
+            const socket = new WebSocket(wsAddress);
+            socket.onmessage = function (event) {
+                if (event.data === "reload") {
+                    socket.close();
+                    location.reload();
+                }
+            };
+
+            window.onbeforeunload = function() {
+                socket.close();
+            }
+        </script>
+
+
+
+        <script>
+            window.playground_copyable = true;
+        </script>
+
+
+        <script src="elasticlunr.min.js"></script>
+        <script src="mark.min.js"></script>
+        <script src="searcher.js"></script>
+
+        <script src="clipboard.min.js"></script>
+        <script src="highlight.js"></script>
+        <script src="book.js"></script>
+
+        <!-- Custom JS scripts -->
+
+
+    </div>
+    </body>
+</html>

server/docs-prod/book/print.html

@@ -0,0 +1,220 @@
+<!DOCTYPE HTML>
+<html lang="en" class="light sidebar-visible" dir="ltr">
+    <head>
+        <!-- Book generated using mdBook -->
+        <meta charset="UTF-8">
+        <title>Server API Documentation</title>
+        <meta name="robots" content="noindex">
+
+
+        <!-- Custom HTML head -->
+
+        <meta name="description" content="">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta name="theme-color" content="#ffffff">
+
+        <link rel="icon" href="favicon.svg">
+        <link rel="shortcut icon" href="favicon.png">
+        <link rel="stylesheet" href="css/variables.css">
+        <link rel="stylesheet" href="css/general.css">
+        <link rel="stylesheet" href="css/chrome.css">
+        <link rel="stylesheet" href="css/print.css" media="print">
+
+        <!-- Fonts -->
+        <link rel="stylesheet" href="FontAwesome/css/font-awesome.css">
+        <link rel="stylesheet" href="fonts/fonts.css">
+
+        <!-- Highlight.js Stylesheets -->
+        <link rel="stylesheet" id="highlight-css" href="highlight.css">
+        <link rel="stylesheet" id="tomorrow-night-css" href="tomorrow-night.css">
+        <link rel="stylesheet" id="ayu-highlight-css" href="ayu-highlight.css">
+
+        <!-- Custom theme stylesheets -->
+
+
+        <!-- Provide site root and default themes to javascript -->
+        <script>
+            const path_to_root = "";
+            const default_light_theme = "light";
+            const default_dark_theme = "navy";
+        </script>
+        <!-- Start loading toc.js asap -->
+        <script src="toc.js"></script>
+    </head>
+    <body>
+    <div id="body-container">
+        <!-- Work around some values being stored in localStorage wrapped in quotes -->
+        <script>
+            try {
+                let theme = localStorage.getItem('mdbook-theme');
+                let sidebar = localStorage.getItem('mdbook-sidebar');
+
+                if (theme.startsWith('"') && theme.endsWith('"')) {
+                    localStorage.setItem('mdbook-theme', theme.slice(1, theme.length - 1));
+                }
+
+                if (sidebar.startsWith('"') && sidebar.endsWith('"')) {
+                    localStorage.setItem('mdbook-sidebar', sidebar.slice(1, sidebar.length - 1));
+                }
+            } catch (e) { }
+        </script>
+
+        <!-- Set the theme before any content is loaded, prevents flash -->
+        <script>
+            const default_theme = window.matchMedia("(prefers-color-scheme: dark)").matches ? default_dark_theme : default_light_theme;
+            let theme;
+            try { theme = localStorage.getItem('mdbook-theme'); } catch(e) { }
+            if (theme === null || theme === undefined) { theme = default_theme; }
+            const html = document.documentElement;
+            html.classList.remove('light')
+            html.classList.add(theme);
+            html.classList.add("js");
+        </script>
+
+        <input type="checkbox" id="sidebar-toggle-anchor" class="hidden">
+
+        <!-- Hide / unhide sidebar before it is displayed -->
+        <script>
+            let sidebar = null;
+            const sidebar_toggle = document.getElementById("sidebar-toggle-anchor");
+            if (document.body.clientWidth >= 1080) {
+                try { sidebar = localStorage.getItem('mdbook-sidebar'); } catch(e) { }
+                sidebar = sidebar || 'visible';
+            } else {
+                sidebar = 'hidden';
+            }
+            sidebar_toggle.checked = sidebar === 'visible';
+            html.classList.remove('sidebar-visible');
+            html.classList.add("sidebar-" + sidebar);
+        </script>
+
+        <nav id="sidebar" class="sidebar" aria-label="Table of contents">
+            <!-- populated by js -->
+            <mdbook-sidebar-scrollbox class="sidebar-scrollbox"></mdbook-sidebar-scrollbox>
+            <noscript>
+                <iframe class="sidebar-iframe-outer" src="toc.html"></iframe>
+            </noscript>
+            <div id="sidebar-resize-handle" class="sidebar-resize-handle">
+                <div class="sidebar-resize-indicator"></div>
+            </div>
+        </nav>
+
+        <div id="page-wrapper" class="page-wrapper">
+
+            <div class="page">
+                <div id="menu-bar-hover-placeholder"></div>
+                <div id="menu-bar" class="menu-bar sticky">
+                    <div class="left-buttons">
+                        <label id="sidebar-toggle" class="icon-button" for="sidebar-toggle-anchor" title="Toggle Table of Contents" aria-label="Toggle Table of Contents" aria-controls="sidebar">
+                            <i class="fa fa-bars"></i>
+                        </label>
+                        <button id="theme-toggle" class="icon-button" type="button" title="Change theme" aria-label="Change theme" aria-haspopup="true" aria-expanded="false" aria-controls="theme-list">
+                            <i class="fa fa-paint-brush"></i>
+                        </button>
+                        <ul id="theme-list" class="theme-popup" aria-label="Themes" role="menu">
+                            <li role="none"><button role="menuitem" class="theme" id="default_theme">Auto</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="light">Light</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="rust">Rust</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
+                            <li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
+                        </ul>
+                        <button id="search-toggle" class="icon-button" type="button" title="Search. (Shortkey: s)" aria-label="Toggle Searchbar" aria-expanded="false" aria-keyshortcuts="S" aria-controls="searchbar">
+                            <i class="fa fa-search"></i>
+                        </button>
+                    </div>
+
+                    <h1 class="menu-title">Server API Documentation</h1>
+
+                    <div class="right-buttons">
+                        <a href="print.html" title="Print this book" aria-label="Print this book">
+                            <i id="print-button" class="fa fa-print"></i>
+                        </a>
+
+                    </div>
+                </div>
+
+                <div id="search-wrapper" class="hidden">
+                    <form id="searchbar-outer" class="searchbar-outer">
+                        <input type="search" id="searchbar" name="searchbar" placeholder="Search this book ..." aria-controls="searchresults-outer" aria-describedby="searchresults-header">
+                    </form>
+                    <div id="searchresults-outer" class="searchresults-outer hidden">
+                        <div id="searchresults-header" class="searchresults-header"></div>
+                        <ul id="searchresults">
+                        </ul>
+                    </div>
+                </div>
+
+                <!-- Apply ARIA attributes after the sidebar and the sidebar toggle button are added to the DOM -->
+                <script>
+                    document.getElementById('sidebar-toggle').setAttribute('aria-expanded', sidebar === 'visible');
+                    document.getElementById('sidebar').setAttribute('aria-hidden', sidebar !== 'visible');
+                    Array.from(document.querySelectorAll('#sidebar a')).forEach(function(link) {
+                        link.setAttribute('tabIndex', sidebar === 'visible' ? 0 : -1);
+                    });
+                </script>
+
+                <div id="content" class="content">
+                    <main>
+                        <h1 id="chapter-1"><a class="header" href="#chapter-1">Chapter 1</a></h1>
+
+                    </main>
+
+                    <nav class="nav-wrapper" aria-label="Page navigation">
+                        <!-- Mobile navigation buttons -->
+
+
+                        <div style="clear: both"></div>
+                    </nav>
+                </div>
+            </div>
+
+            <nav class="nav-wide-wrapper" aria-label="Page navigation">
+
+            </nav>
+
+        </div>
+
+        <!-- Livereload script (if served using the cli tool) -->
+        <script>
+            const wsProtocol = location.protocol === 'https:' ? 'wss:' : 'ws:';
+            const wsAddress = wsProtocol + "//" + location.host + "/" + "__livereload";
+            const socket = new WebSocket(wsAddress);
+            socket.onmessage = function (event) {
+                if (event.data === "reload") {
+                    socket.close();
+                    location.reload();
+                }
+            };
+
+            window.onbeforeunload = function() {
+                socket.close();
+            }
+        </script>
+
+
+
+        <script>
+            window.playground_copyable = true;
+        </script>
+
+
+        <script src="elasticlunr.min.js"></script>
+        <script src="mark.min.js"></script>
+        <script src="searcher.js"></script>
+
+        <script src="clipboard.min.js"></script>
+        <script src="highlight.js"></script>
+        <script src="book.js"></script>
+
+        <!-- Custom JS scripts -->
+
+        <script>
+        window.addEventListener('load', function() {
+            window.setTimeout(window.print, 100);
+        });
+        </script>
+
+    </div>
+    </body>
+</html>

server/docs-prod/book/searcher.js

@@ -0,0 +1,528 @@
+'use strict';
+
+/* global Mark, elasticlunr, path_to_root */
+
+window.search = window.search || {};
+(function search() {
+    // Search functionality
+    //
+    // You can use !hasFocus() to prevent keyhandling in your key
+    // event handlers while the user is typing their search.
+
+    if (!Mark || !elasticlunr) {
+        return;
+    }
+
+    // eslint-disable-next-line max-len
+    // IE 11 Compatibility from https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith
+    if (!String.prototype.startsWith) {
+        String.prototype.startsWith = function(search, pos) {
+            return this.substr(!pos || pos < 0 ? 0 : +pos, search.length) === search;
+        };
+    }
+
+    const search_wrap = document.getElementById('search-wrapper'),
+        searchbar = document.getElementById('searchbar'),
+        searchresults = document.getElementById('searchresults'),
+        searchresults_outer = document.getElementById('searchresults-outer'),
+        searchresults_header = document.getElementById('searchresults-header'),
+        searchicon = document.getElementById('search-toggle'),
+        content = document.getElementById('content'),
+
+        // SVG text elements don't render if inside a <mark> tag.
+        mark_exclude = ['text'],
+        marker = new Mark(content),
+        URL_SEARCH_PARAM = 'search',
+        URL_MARK_PARAM = 'highlight',
+
+        SEARCH_HOTKEY_KEYCODE = 83,
+        ESCAPE_KEYCODE = 27,
+        DOWN_KEYCODE = 40,
+        UP_KEYCODE = 38,
+        SELECT_KEYCODE = 13;
+
+    let current_searchterm = '',
+        doc_urls = [],
+        search_options = {
+            bool: 'AND',
+            expand: true,
+            fields: {
+                title: {boost: 1},
+                body: {boost: 1},
+                breadcrumbs: {boost: 0},
+            },
+        },
+        searchindex = null,
+        results_options = {
+            teaser_word_count: 30,
+            limit_results: 30,
+        },
+        teaser_count = 0;
+
+    function hasFocus() {
+        return searchbar === document.activeElement;
+    }
+
+    function removeChildren(elem) {
+        while (elem.firstChild) {
+            elem.removeChild(elem.firstChild);
+        }
+    }
+
+    // Helper to parse a url into its building blocks.
+    function parseURL(url) {
+        const a = document.createElement('a');
+        a.href = url;
+        return {
+            source: url,
+            protocol: a.protocol.replace(':', ''),
+            host: a.hostname,
+            port: a.port,
+            params: (function() {
+                const ret = {};
+                const seg = a.search.replace(/^\?/, '').split('&');
+                for (const part of seg) {
+                    if (!part) {
+                        continue;
+                    }
+                    const s = part.split('=');
+                    ret[s[0]] = s[1];
+                }
+                return ret;
+            })(),
+            file: (a.pathname.match(/\/([^/?#]+)$/i) || ['', ''])[1],
+            hash: a.hash.replace('#', ''),
+            path: a.pathname.replace(/^([^/])/, '/$1'),
+        };
+    }
+
+    // Helper to recreate a url string from its building blocks.
+    function renderURL(urlobject) {
+        let url = urlobject.protocol + '://' + urlobject.host;
+        if (urlobject.port !== '') {
+            url += ':' + urlobject.port;
+        }
+        url += urlobject.path;
+        let joiner = '?';
+        for (const prop in urlobject.params) {
+            if (Object.prototype.hasOwnProperty.call(urlobject.params, prop)) {
+                url += joiner + prop + '=' + urlobject.params[prop];
+                joiner = '&';
+            }
+        }
+        if (urlobject.hash !== '') {
+            url += '#' + urlobject.hash;
+        }
+        return url;
+    }
+
+    // Helper to escape html special chars for displaying the teasers
+    const escapeHTML = (function() {
+        const MAP = {
+            '&': '&amp;',
+            '<': '&lt;',
+            '>': '&gt;',
+            '"': '&#34;',
+            '\'': '&#39;',
+        };
+        const repl = function(c) {
+            return MAP[c];
+        };
+        return function(s) {
+            return s.replace(/[&<>'"]/g, repl);
+        };
+    })();
+
+    function formatSearchMetric(count, searchterm) {
+        if (count === 1) {
+            return count + ' search result for \'' + searchterm + '\':';
+        } else if (count === 0) {
+            return 'No search results for \'' + searchterm + '\'.';
+        } else {
+            return count + ' search results for \'' + searchterm + '\':';
+        }
+    }
+
+    function formatSearchResult(result, searchterms) {
+        const teaser = makeTeaser(escapeHTML(result.doc.body), searchterms);
+        teaser_count++;
+
+        // The ?URL_MARK_PARAM= parameter belongs inbetween the page and the #heading-anchor
+        const url = doc_urls[result.ref].split('#');
+        if (url.length === 1) { // no anchor found
+            url.push('');
+        }
+
+        // encodeURIComponent escapes all chars that could allow an XSS except
+        // for '. Due to that we also manually replace ' with its url-encoded
+        // representation (%27).
+        const encoded_search = encodeURIComponent(searchterms.join(' ')).replace(/'/g, '%27');
+
+        return '<a href="' + path_to_root + url[0] + '?' + URL_MARK_PARAM + '=' + encoded_search
+            + '#' + url[1] + '" aria-details="teaser_' + teaser_count + '">'
+            + result.doc.breadcrumbs + '</a>' + '<span class="teaser" id="teaser_' + teaser_count
+            + '" aria-label="Search Result Teaser">' + teaser + '</span>';
+    }
+
+    function makeTeaser(body, searchterms) {
+        // The strategy is as follows:
+        // First, assign a value to each word in the document:
+        //  Words that correspond to search terms (stemmer aware): 40
+        //  Normal words: 2
+        //  First word in a sentence: 8
+        // Then use a sliding window with a constant number of words and count the
+        // sum of the values of the words within the window. Then use the window that got the
+        // maximum sum. If there are multiple maximas, then get the last one.
+        // Enclose the terms in <em>.
+        const stemmed_searchterms = searchterms.map(function(w) {
+            return elasticlunr.stemmer(w.toLowerCase());
+        });
+        const searchterm_weight = 40;
+        const weighted = []; // contains elements of ["word", weight, index_in_document]
+        // split in sentences, then words
+        const sentences = body.toLowerCase().split('. ');
+        let index = 0;
+        let value = 0;
+        let searchterm_found = false;
+        for (const sentenceindex in sentences) {
+            const words = sentences[sentenceindex].split(' ');
+            value = 8;
+            for (const wordindex in words) {
+                const word = words[wordindex];
+                if (word.length > 0) {
+                    for (const searchtermindex in stemmed_searchterms) {
+                        if (elasticlunr.stemmer(word).startsWith(
+                            stemmed_searchterms[searchtermindex])
+                        ) {
+                            value = searchterm_weight;
+                            searchterm_found = true;
+                        }
+                    }
+                    weighted.push([word, value, index]);
+                    value = 2;
+                }
+                index += word.length;
+                index += 1; // ' ' or '.' if last word in sentence
+            }
+            index += 1; // because we split at a two-char boundary '. '
+        }
+
+        if (weighted.length === 0) {
+            return body;
+        }
+
+        const window_weight = [];
+        const window_size = Math.min(weighted.length, results_options.teaser_word_count);
+
+        let cur_sum = 0;
+        for (let wordindex = 0; wordindex < window_size; wordindex++) {
+            cur_sum += weighted[wordindex][1];
+        }
+        window_weight.push(cur_sum);
+        for (let wordindex = 0; wordindex < weighted.length - window_size; wordindex++) {
+            cur_sum -= weighted[wordindex][1];
+            cur_sum += weighted[wordindex + window_size][1];
+            window_weight.push(cur_sum);
+        }
+
+        let max_sum_window_index = 0;
+        if (searchterm_found) {
+            let max_sum = 0;
+            // backwards
+            for (let i = window_weight.length - 1; i >= 0; i--) {
+                if (window_weight[i] > max_sum) {
+                    max_sum = window_weight[i];
+                    max_sum_window_index = i;
+                }
+            }
+        } else {
+            max_sum_window_index = 0;
+        }
+
+        // add <em/> around searchterms
+        const teaser_split = [];
+        index = weighted[max_sum_window_index][2];
+        for (let i = max_sum_window_index; i < max_sum_window_index + window_size; i++) {
+            const word = weighted[i];
+            if (index < word[2]) {
+                // missing text from index to start of `word`
+                teaser_split.push(body.substring(index, word[2]));
+                index = word[2];
+            }
+            if (word[1] === searchterm_weight) {
+                teaser_split.push('<em>');
+            }
+            index = word[2] + word[0].length;
+            teaser_split.push(body.substring(word[2], index));
+            if (word[1] === searchterm_weight) {
+                teaser_split.push('</em>');
+            }
+        }
+
+        return teaser_split.join('');
+    }
+
+    function init(config) {
+        results_options = config.results_options;
+        search_options = config.search_options;
+        doc_urls = config.doc_urls;
+        searchindex = elasticlunr.Index.load(config.index);
+
+        // Set up events
+        searchicon.addEventListener('click', () => {
+            searchIconClickHandler();
+        }, false);
+        searchbar.addEventListener('keyup', () => {
+            searchbarKeyUpHandler();
+        }, false);
+        document.addEventListener('keydown', e => {
+            globalKeyHandler(e);
+        }, false);
+        // If the user uses the browser buttons, do the same as if a reload happened
+        window.onpopstate = () => {
+            doSearchOrMarkFromUrl();
+        };
+        // Suppress "submit" events so the page doesn't reload when the user presses Enter
+        document.addEventListener('submit', e => {
+            e.preventDefault();
+        }, false);
+
+        // If reloaded, do the search or mark again, depending on the current url parameters
+        doSearchOrMarkFromUrl();
+
+        // Exported functions
+        config.hasFocus = hasFocus;
+    }
+
+    function unfocusSearchbar() {
+        // hacky, but just focusing a div only works once
+        const tmp = document.createElement('input');
+        tmp.setAttribute('style', 'position: absolute; opacity: 0;');
+        searchicon.appendChild(tmp);
+        tmp.focus();
+        tmp.remove();
+    }
+
+    // On reload or browser history backwards/forwards events, parse the url and do search or mark
+    function doSearchOrMarkFromUrl() {
+        // Check current URL for search request
+        const url = parseURL(window.location.href);
+        if (Object.prototype.hasOwnProperty.call(url.params, URL_SEARCH_PARAM)
+            && url.params[URL_SEARCH_PARAM] !== '') {
+            showSearch(true);
+            searchbar.value = decodeURIComponent(
+                (url.params[URL_SEARCH_PARAM] + '').replace(/\+/g, '%20'));
+            searchbarKeyUpHandler(); // -> doSearch()
+        } else {
+            showSearch(false);
+        }
+
+        if (Object.prototype.hasOwnProperty.call(url.params, URL_MARK_PARAM)) {
+            const words = decodeURIComponent(url.params[URL_MARK_PARAM]).split(' ');
+            marker.mark(words, {
+                exclude: mark_exclude,
+            });
+
+            const markers = document.querySelectorAll('mark');
+            const hide = () => {
+                for (let i = 0; i < markers.length; i++) {
+                    markers[i].classList.add('fade-out');
+                    window.setTimeout(() => {
+                        marker.unmark();
+                    }, 300);
+                }
+            };
+
+            for (let i = 0; i < markers.length; i++) {
+                markers[i].addEventListener('click', hide);
+            }
+        }
+    }
+
+    // Eventhandler for keyevents on `document`
+    function globalKeyHandler(e) {
+        if (e.altKey ||
+            e.ctrlKey ||
+            e.metaKey ||
+            e.shiftKey ||
+            e.target.type === 'textarea' ||
+            e.target.type === 'text' ||
+            !hasFocus() && /^(?:input|select|textarea)$/i.test(e.target.nodeName)
+        ) {
+            return;
+        }
+
+        if (e.keyCode === ESCAPE_KEYCODE) {
+            e.preventDefault();
+            searchbar.classList.remove('active');
+            setSearchUrlParameters('',
+                searchbar.value.trim() !== '' ? 'push' : 'replace');
+            if (hasFocus()) {
+                unfocusSearchbar();
+            }
+            showSearch(false);
+            marker.unmark();
+        } else if (!hasFocus() && e.keyCode === SEARCH_HOTKEY_KEYCODE) {
+            e.preventDefault();
+            showSearch(true);
+            window.scrollTo(0, 0);
+            searchbar.select();
+        } else if (hasFocus() && e.keyCode === DOWN_KEYCODE) {
+            e.preventDefault();
+            unfocusSearchbar();
+            searchresults.firstElementChild.classList.add('focus');
+        } else if (!hasFocus() && (e.keyCode === DOWN_KEYCODE
+                                || e.keyCode === UP_KEYCODE
+                                || e.keyCode === SELECT_KEYCODE)) {
+            // not `:focus` because browser does annoying scrolling
+            const focused = searchresults.querySelector('li.focus');
+            if (!focused) {
+                return;
+            }
+            e.preventDefault();
+            if (e.keyCode === DOWN_KEYCODE) {
+                const next = focused.nextElementSibling;
+                if (next) {
+                    focused.classList.remove('focus');
+                    next.classList.add('focus');
+                }
+            } else if (e.keyCode === UP_KEYCODE) {
+                focused.classList.remove('focus');
+                const prev = focused.previousElementSibling;
+                if (prev) {
+                    prev.classList.add('focus');
+                } else {
+                    searchbar.select();
+                }
+            } else { // SELECT_KEYCODE
+                window.location.assign(focused.querySelector('a'));
+            }
+        }
+    }
+
+    function showSearch(yes) {
+        if (yes) {
+            search_wrap.classList.remove('hidden');
+            searchicon.setAttribute('aria-expanded', 'true');
+        } else {
+            search_wrap.classList.add('hidden');
+            searchicon.setAttribute('aria-expanded', 'false');
+            const results = searchresults.children;
+            for (let i = 0; i < results.length; i++) {
+                results[i].classList.remove('focus');
+            }
+        }
+    }
+
+    function showResults(yes) {
+        if (yes) {
+            searchresults_outer.classList.remove('hidden');
+        } else {
+            searchresults_outer.classList.add('hidden');
+        }
+    }
+
+    // Eventhandler for search icon
+    function searchIconClickHandler() {
+        if (search_wrap.classList.contains('hidden')) {
+            showSearch(true);
+            window.scrollTo(0, 0);
+            searchbar.select();
+        } else {
+            showSearch(false);
+        }
+    }
+
+    // Eventhandler for keyevents while the searchbar is focused
+    function searchbarKeyUpHandler() {
+        const searchterm = searchbar.value.trim();
+        if (searchterm !== '') {
+            searchbar.classList.add('active');
+            doSearch(searchterm);
+        } else {
+            searchbar.classList.remove('active');
+            showResults(false);
+            removeChildren(searchresults);
+        }
+
+        setSearchUrlParameters(searchterm, 'push_if_new_search_else_replace');
+
+        // Remove marks
+        marker.unmark();
+    }
+
+    // Update current url with ?URL_SEARCH_PARAM= parameter, remove ?URL_MARK_PARAM and
+    // `#heading-anchor`. `action` can be one of "push", "replace",
+    // "push_if_new_search_else_replace" and replaces or pushes a new browser history item.
+    // "push_if_new_search_else_replace" pushes if there is no `?URL_SEARCH_PARAM=abc` yet.
+    function setSearchUrlParameters(searchterm, action) {
+        const url = parseURL(window.location.href);
+        const first_search = !Object.prototype.hasOwnProperty.call(url.params, URL_SEARCH_PARAM);
+
+        if (searchterm !== '' || action === 'push_if_new_search_else_replace') {
+            url.params[URL_SEARCH_PARAM] = searchterm;
+            delete url.params[URL_MARK_PARAM];
+            url.hash = '';
+        } else {
+            delete url.params[URL_MARK_PARAM];
+            delete url.params[URL_SEARCH_PARAM];
+        }
+        // A new search will also add a new history item, so the user can go back
+        // to the page prior to searching. A updated search term will only replace
+        // the url.
+        if (action === 'push' || action === 'push_if_new_search_else_replace' && first_search ) {
+            history.pushState({}, document.title, renderURL(url));
+        } else if (action === 'replace' ||
+            action === 'push_if_new_search_else_replace' &&
+            !first_search
+        ) {
+            history.replaceState({}, document.title, renderURL(url));
+        }
+    }
+
+    function doSearch(searchterm) {
+        // Don't search the same twice
+        if (current_searchterm === searchterm) {
+            return;
+        } else {
+            current_searchterm = searchterm;
+        }
+
+        if (searchindex === null) {
+            return;
+        }
+
+        // Do the actual search
+        const results = searchindex.search(searchterm, search_options);
+        const resultcount = Math.min(results.length, results_options.limit_results);
+
+        // Display search metrics
+        searchresults_header.innerText = formatSearchMetric(resultcount, searchterm);
+
+        // Clear and insert results
+        const searchterms = searchterm.split(' ');
+        removeChildren(searchresults);
+        for (let i = 0; i < resultcount ; i++) {
+            const resultElem = document.createElement('li');
+            resultElem.innerHTML = formatSearchResult(results[i], searchterms);
+            searchresults.appendChild(resultElem);
+        }
+
+        // Display results
+        showResults(true);
+    }
+
+    function loadScript(url, id) {
+        const script = document.createElement('script');
+        script.src = url;
+        script.id = id;
+        script.onload = () => init(window.search);
+        script.onerror = error => {
+            console.error(`Failed to load \`${url}\`: ${error}`);
+        };
+        document.head.append(script);
+    }
+
+    loadScript(path_to_root + 'searchindex.js', 'search-index');
+
+})(window.search);

server/docs-prod/book/searchindex.js

@@ -0,0 +1 @@
+window.search = JSON.parse('{"doc_urls":["chapter_1.html#chapter-1"],"index":{"documentStore":{"docInfo":{"0":{"body":0,"breadcrumbs":4,"title":2}},"docs":{"0":{"body":"","breadcrumbs":"Chapter 1 » Chapter 1","id":"0","title":"Chapter 1"}},"length":1,"save":true},"fields":["title","body","breadcrumbs"],"index":{"body":{"root":{"1":{"df":1,"docs":{"0":{"tf":1.0}}},"c":{"df":0,"docs":{},"h":{"a":{"df":0,"docs":{},"p":{"df":0,"docs":{},"t":{"df":0,"docs":{},"e":{"df":0,"docs":{},"r":{"df":1,"docs":{"0":{"tf":1.0}}}}}}},"df":0,"docs":{}}},"df":0,"docs":{}}},"breadcrumbs":{"root":{"1":{"df":1,"docs":{"0":{"tf":1.7320508075688772}}},"c":{"df":0,"docs":{},"h":{"a":{"df":0,"docs":{},"p":{"df":0,"docs":{},"t":{"df":0,"docs":{},"e":{"df":0,"docs":{},"r":{"df":1,"docs":{"0":{"tf":1.7320508075688772}}}}}}},"df":0,"docs":{}}},"df":0,"docs":{}}},"title":{"root":{"1":{"df":1,"docs":{"0":{"tf":1.0}}},"c":{"df":0,"docs":{},"h":{"a":{"df":0,"docs":{},"p":{"df":0,"docs":{},"t":{"df":0,"docs":{},"e":{"df":0,"docs":{},"r":{"df":1,"docs":{"0":{"tf":1.0}}}}}}},"df":0,"docs":{}}},"df":0,"docs":{}}}},"lang":"English","pipeline":["trimmer","stopWordFilter","stemmer"],"ref":"id","version":"0.9.5"},"results_options":{"limit_results":30,"teaser_word_count":30},"search_options":{"bool":"AND","expand":true,"fields":{"body":{"boost":1},"breadcrumbs":{"boost":1},"title":{"boost":2}}}}');

server/docs-prod/book/toc.html

@@ -0,0 +1,32 @@
+<!DOCTYPE HTML>
+<html lang="en" class="light" dir="ltr">
+    <head>
+        <!-- sidebar iframe generated using mdBook
+
+        This is a frame, and not included directly in the page, to control the total size of the
+        book. The TOC contains an entry for each page, so if each page includes a copy of the TOC,
+        the total size of the page becomes O(n**2).
+
+        The frame is only used as a fallback when JS is turned off. When it's on, the sidebar is
+        instead added to the main page by `toc.js` instead. The JavaScript mode is better
+        because, when running in a `file:///` URL, the iframed page would not be Same-Origin as
+        the rest of the page, so the sidebar and the main page theme would fall out of sync.
+        -->
+        <meta charset="UTF-8">
+        <meta name="robots" content="noindex">
+        <!-- Custom HTML head -->
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta name="theme-color" content="#ffffff">
+        <link rel="stylesheet" href="css/variables.css">
+        <link rel="stylesheet" href="css/general.css">
+        <link rel="stylesheet" href="css/chrome.css">
+        <link rel="stylesheet" href="css/print.css" media="print">
+        <!-- Fonts -->
+        <link rel="stylesheet" href="FontAwesome/css/font-awesome.css">
+        <link rel="stylesheet" href="fonts/fonts.css">
+        <!-- Custom theme stylesheets -->
+    </head>
+    <body class="sidebar-iframe-inner">
+        <ol class="chapter"><li class="chapter-item expanded "><a href="chapter_1.html" target="_parent"><strong aria-hidden="true">1.</strong> Chapter 1</a></li></ol>
+    </body>
+</html>

server/docs-prod/book/toc.js

@@ -0,0 +1,70 @@
+// Populate the sidebar
+//
+// This is a script, and not included directly in the page, to control the total size of the book.
+// The TOC contains an entry for each page, so if each page includes a copy of the TOC,
+// the total size of the page becomes O(n**2).
+class MDBookSidebarScrollbox extends HTMLElement {
+    constructor() {
+        super();
+    }
+    connectedCallback() {
+        this.innerHTML = '<ol class="chapter"><li class="chapter-item expanded "><a href="chapter_1.html"><strong aria-hidden="true">1.</strong> Chapter 1</a></li></ol>';
+        // Set the current, active page, and reveal it if it's hidden
+        let current_page = document.location.href.toString().split("#")[0].split("?")[0];
+        if (current_page.endsWith("/")) {
+            current_page += "index.html";
+        }
+        var links = Array.prototype.slice.call(this.querySelectorAll("a"));
+        var l = links.length;
+        for (var i = 0; i < l; ++i) {
+            var link = links[i];
+            var href = link.getAttribute("href");
+            if (href && !href.startsWith("#") && !/^(?:[a-z+]+:)?\/\//.test(href)) {
+                link.href = path_to_root + href;
+            }
+            // The "index" page is supposed to alias the first chapter in the book.
+            if (link.href === current_page || (i === 0 && path_to_root === "" && current_page.endsWith("/index.html"))) {
+                link.classList.add("active");
+                var parent = link.parentElement;
+                if (parent && parent.classList.contains("chapter-item")) {
+                    parent.classList.add("expanded");
+                }
+                while (parent) {
+                    if (parent.tagName === "LI" && parent.previousElementSibling) {
+                        if (parent.previousElementSibling.classList.contains("chapter-item")) {
+                            parent.previousElementSibling.classList.add("expanded");
+                        }
+                    }
+                    parent = parent.parentElement;
+                }
+            }
+        }
+        // Track and set sidebar scroll position
+        this.addEventListener('click', function(e) {
+            if (e.target.tagName === 'A') {
+                sessionStorage.setItem('sidebar-scroll', this.scrollTop);
+            }
+        }, { passive: true });
+        var sidebarScrollTop = sessionStorage.getItem('sidebar-scroll');
+        sessionStorage.removeItem('sidebar-scroll');
+        if (sidebarScrollTop) {
+            // preserve sidebar scroll position when navigating via links within sidebar
+            this.scrollTop = sidebarScrollTop;
+        } else {
+            // scroll sidebar to current active section when navigating via "next/previous chapter" buttons
+            var activeSection = document.querySelector('#sidebar .active');
+            if (activeSection) {
+                activeSection.scrollIntoView({ block: 'center' });
+            }
+        }
+        // Toggle buttons
+        var sidebarAnchorToggles = document.querySelectorAll('#sidebar a.toggle');
+        function toggleSection(ev) {
+            ev.currentTarget.parentElement.classList.toggle('expanded');
+        }
+        Array.from(sidebarAnchorToggles).forEach(function (el) {
+            el.addEventListener('click', toggleSection);
+        });
+    }
+}
+window.customElements.define("mdbook-sidebar-scrollbox", MDBookSidebarScrollbox);

server/docs-prod/book/tomorrow-night.css

@@ -0,0 +1,104 @@
+/* Tomorrow Night Theme */
+/* https://github.com/jmblog/color-themes-for-highlightjs */
+/* Original theme - https://github.com/chriskempson/tomorrow-theme */
+/* https://github.com/jmblog/color-themes-for-highlightjs */
+
+/* Tomorrow Comment */
+.hljs-comment {
+  color: #969896;
+}
+
+/* Tomorrow Red */
+.hljs-variable,
+.hljs-attribute,
+.hljs-attr,
+.hljs-tag,
+.hljs-regexp,
+.ruby .hljs-constant,
+.xml .hljs-tag .hljs-title,
+.xml .hljs-pi,
+.xml .hljs-doctype,
+.html .hljs-doctype,
+.css .hljs-id,
+.css .hljs-class,
+.css .hljs-pseudo {
+  color: #cc6666;
+}
+
+/* Tomorrow Orange */
+.hljs-number,
+.hljs-preprocessor,
+.hljs-pragma,
+.hljs-built_in,
+.hljs-literal,
+.hljs-params,
+.hljs-constant {
+  color: #de935f;
+}
+
+/* Tomorrow Yellow */
+.ruby .hljs-class .hljs-title,
+.css .hljs-rule .hljs-attribute {
+  color: #f0c674;
+}
+
+/* Tomorrow Green */
+.hljs-string,
+.hljs-value,
+.hljs-inheritance,
+.hljs-header,
+.hljs-name,
+.ruby .hljs-symbol,
+.xml .hljs-cdata {
+  color: #b5bd68;
+}
+
+/* Tomorrow Aqua */
+.hljs-title,
+.hljs-section,
+.css .hljs-hexcolor {
+  color: #8abeb7;
+}
+
+/* Tomorrow Blue */
+.hljs-function,
+.python .hljs-decorator,
+.python .hljs-title,
+.ruby .hljs-function .hljs-title,
+.ruby .hljs-title .hljs-keyword,
+.perl .hljs-sub,
+.javascript .hljs-title,
+.coffeescript .hljs-title {
+  color: #81a2be;
+}
+
+/* Tomorrow Purple */
+.hljs-keyword,
+.javascript .hljs-function {
+  color: #b294bb;
+}
+
+.hljs {
+  display: block;
+  overflow-x: auto;
+  background: #1d1f21;
+  color: #c5c8c6;
+}
+
+.coffeescript .javascript,
+.javascript .xml,
+.tex .hljs-formula,
+.xml .javascript,
+.xml .vbscript,
+.xml .css,
+.xml .hljs-cdata {
+  opacity: 0.5;
+}
+
+.hljs-addition {
+  color: #718c00;
+}
+
+.hljs-deletion {
+  color: #c82829;
+}

server/docs-prod/src/SUMMARY.md

@@ -0,0 +1,3 @@
+# Summary
+
+- [Chapter 1](./chapter_1.md)

server/docs-prod/src/chapter_1.md

@@ -0,0 +1 @@
+# Chapter 1