intro is now separated

register is now separated also
login function moved
2025-08-23 21:58:29 +02:00 · 2025-08-23 21:47:18 +02:00 · 2025-08-23 21:05:02 +02:00 · 2025-08-23 20:58:12 +02:00 · 2025-08-23 19:48:23 +02:00 · 2025-08-23 13:36:46 +02:00
211 changed files with 12715 additions and 14850 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -5,3 +5,4 @@ server/tantivy_indexes
 steel_decimal/tests/property_tests.proptest-regressions
 .direnv/
 canvas/*.toml
+.aider*
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -324,6 +324,27 @@ dependencies = [
 "serde",
 ]

+[[package]]
+name = "bit-set"
+version = "0.5.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "0700ddab506f33b20a03b13996eccd309a48e5ff77d0d95926aa0210fb4e95f1"
+dependencies = [
+ "bit-vec",
+]
+
+[[package]]
+name = "bit-vec"
+version = "0.6.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "349f9b6a179ed607305526ca489b34ad0a41aed5f7980fa90eb03160b69598fb"
+
+[[package]]
+name = "bitflags"
+version = "1.3.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "bef38d45163c2f1dde094a7dfd33ccf595c92905c8f8f4fdc18d06fb1037718a"
+
 [[package]]
 name = "bitflags"
 version = "2.9.1"
@@ -472,16 +493,18 @@ checksum = "d71b6127be86fdcfddb610f7182ac57211d4b18a3e9c82eb2d17662f2227ad6a"

 [[package]]
 name = "canvas"
-version = "0.4.2"
+version = "0.5.0"
 dependencies = [
 "anyhow",
 "async-trait",
- "common",
 "crossterm",
+ "once_cell",
 "ratatui",
 "regex",
+ "ropey",
 "serde",
- "thiserror",
+ "syntect",
+ "thiserror 2.0.12",
 "tokio",
 "tokio-test",
 "toml",
@@ -561,7 +584,7 @@ dependencies = [

 [[package]]
 name = "client"
-version = "0.4.2"
+version = "0.5.0"
 dependencies = [
 "anyhow",
 "async-trait",
@@ -612,7 +635,7 @@ dependencies = [

 [[package]]
 name = "common"
-version = "0.4.2"
+version = "0.5.0"
 dependencies = [
 "prost",
 "prost-types",
@@ -771,7 +794,7 @@ version = "0.28.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "829d955a0bb380ef178a640b91779e3987da38c9aea133b20614cfed8cdea9c6"
 dependencies = [
- "bitflags",
+ "bitflags 2.9.1",
 "crossterm_winapi",
 "mio",
 "parking_lot",
@@ -995,7 +1018,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "778e2ac28f6c47af28e4907f13ffd1e1ddbd400980a9abd7c8df189bf578a5ad"
 dependencies = [
 "libc",
- "windows-sys 0.52.0",
+ "windows-sys 0.60.2",
 ]

 [[package]]
@@ -1020,6 +1043,16 @@ dependencies = [
 "pin-project-lite",
 ]

+[[package]]
+name = "fancy-regex"
+version = "0.11.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "b95f7c0680e4142284cf8b22c14a476e87d61b004a3a0861872b32ef7ead40a2"
+dependencies = [
+ "bit-set",
+ "regex",
+]
+
 [[package]]
 name = "fastdivide"
 version = "0.4.2"
@@ -1038,6 +1071,16 @@ version = "0.5.7"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "1d674e81391d1e1ab681a28d99df07927c6d4aa5b027d7da16ba32d1d21ecd99"

+[[package]]
+name = "flate2"
+version = "1.1.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "4a3d7db9596fecd151c5f638c0ee5d5bd487b6e0ea232e5dc96d5250f6f94b1d"
+dependencies = [
+ "crc32fast",
+ "miniz_oxide",
+]
+
 [[package]]
 name = "flume"
 version = "0.11.1"
@@ -1724,7 +1767,7 @@ version = "0.7.9"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "d93587f37623a1a17d94ef2bc9ada592f5465fe7732084ab7beefabe5c77c0c4"
 dependencies = [
- "bitflags",
+ "bitflags 2.9.1",
 "cfg-if",
 "libc",
 ]
@@ -1843,7 +1886,7 @@ version = "0.1.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "4488594b9328dee448adb906d8b126d9b7deb7cf5c22161ee591610bb1be83c0"
 dependencies = [
- "bitflags",
+ "bitflags 2.9.1",
 "libc",
 ]

@@ -1857,6 +1900,12 @@ dependencies = [
 "vcpkg",
 ]

+[[package]]
+name = "linked-hash-map"
+version = "0.5.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "0717cef1bc8b636c6e1c1bbdefc09e6322da8a9321966e8928ef80d20f7f770f"
+
 [[package]]
 name = "linux-raw-sys"
 version = "0.4.15"
@@ -2139,7 +2188,7 @@ version = "0.10.73"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "8505734d46c8ab1e19a1dce3aef597ad87dcb4c37e7188231769bd6bd51cebf8"
 dependencies = [
- "bitflags",
+ "bitflags 2.9.1",
 "cfg-if",
 "foreign-types",
 "libc",
@@ -2327,6 +2376,19 @@ version = "0.3.32"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "7edddbd0b52d732b21ad9a5fab5c704c14cd949e5e9a1ec5929a24fded1b904c"

+[[package]]
+name = "plist"
+version = "1.7.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "3af6b589e163c5a788fab00ce0c0366f6efbb9959c2f9874b224936af7fce7e1"
+dependencies = [
+ "base64",
+ "indexmap 2.10.0",
+ "quick-xml",
+ "serde",
+ "time",
+]
+
 [[package]]
 name = "polling"
 version = "3.9.0"
@@ -2498,6 +2560,15 @@ dependencies = [
 "syn 1.0.109",
 ]

+[[package]]
+name = "quick-xml"
+version = "0.38.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "9845d9dccf565065824e69f9f235fafba1587031eda353c1f1561cd6a6be78f4"
+dependencies = [
+ "memchr",
+]
+
 [[package]]
 name = "quickscope"
 version = "0.2.0"
@@ -2613,7 +2684,7 @@ version = "0.29.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "eabd94c2f37801c20583fc49dd5cd6b0ba68c716787c2dd6ed18571e1e63117b"
 dependencies = [
- "bitflags",
+ "bitflags 2.9.1",
 "cassowary",
 "compact_str",
 "crossterm",
@@ -2654,7 +2725,7 @@ version = "0.5.15"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "7e8af0dde094006011e6a740d4879319439489813bd0bcdc7d821beaeeff48ec"
 dependencies = [
- "bitflags",
+ "bitflags 2.9.1",
 ]

 [[package]]
@@ -2665,7 +2736,7 @@ checksum = "dd6f9d3d47bdd2ad6945c5015a226ec6155d0bcdfd8f7cd29f86b71f8de99d2b"
 dependencies = [
 "getrandom 0.2.16",
 "libredox",
- "thiserror",
+ "thiserror 2.0.12",
 ]

 [[package]]
@@ -2764,6 +2835,16 @@ dependencies = [
 "syn 1.0.109",
 ]

+[[package]]
+name = "ropey"
+version = "1.6.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "93411e420bcd1a75ddd1dc3caf18c23155eda2c090631a85af21ba19e97093b5"
+dependencies = [
+ "smallvec",
+ "str_indices",
+]
+
 [[package]]
 name = "rsa"
 version = "0.9.8"
@@ -2877,11 +2958,11 @@ version = "0.38.44"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "fdb5bc1ae2baa591800df16c9ca78619bf65c0488b41b96ccec5d11220d8c154"
 dependencies = [
- "bitflags",
+ "bitflags 2.9.1",
 "errno",
 "libc",
 "linux-raw-sys 0.4.15",
- "windows-sys 0.52.0",
+ "windows-sys 0.59.0",
 ]

 [[package]]
@@ -2890,11 +2971,11 @@ version = "1.0.8"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "11181fbabf243db407ef8df94a6ce0b2f9a733bd8be4ad02b4eda9602296cac8"
 dependencies = [
- "bitflags",
+ "bitflags 2.9.1",
 "errno",
 "libc",
 "linux-raw-sys 0.9.4",
- "windows-sys 0.52.0",
+ "windows-sys 0.60.2",
 ]

 [[package]]
@@ -2909,6 +2990,15 @@ version = "1.0.20"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "28d3b2b1366ec20994f1fd18c3c594f05c5dd4bc44d8bb0c1c632c8d6829481f"

+[[package]]
+name = "same-file"
+version = "1.0.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "93fc1dc3aaa9bfed95e02e6eadabb4baf7e3078b0bd1b4d7b6b0b68378900502"
+dependencies = [
+ "winapi-util",
+]
+
 [[package]]
 name = "schannel"
 version = "0.1.27"
@@ -2932,7 +3022,7 @@ checksum = "1c107b6f4780854c8b126e228ea8869f4d7b71260f962fefb57b996b8959ba6b"

 [[package]]
 name = "search"
-version = "0.4.2"
+version = "0.5.0"
 dependencies = [
 "anyhow",
 "common",
@@ -2953,7 +3043,7 @@ version = "2.11.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "897b2245f0b511c87893af39b033e5ca9cce68824c4d7e7630b5a1d339658d02"
 dependencies = [
- "bitflags",
+ "bitflags 2.9.1",
 "core-foundation",
 "core-foundation-sys",
 "libc",
@@ -3031,7 +3121,7 @@ dependencies = [

 [[package]]
 name = "server"
-version = "0.4.2"
+version = "0.5.0"
 dependencies = [
 "anyhow",
 "bcrypt",
@@ -3058,7 +3148,7 @@ dependencies = [
 "steel-decimal",
 "steel-derive",
 "tantivy",
- "thiserror",
+ "thiserror 2.0.12",
 "time",
 "tokio",
 "tokio-test",
@@ -3160,7 +3250,7 @@ checksum = "297f631f50729c8c99b84667867963997ec0b50f32b2a7dbcab828ef0541e8bb"
 dependencies = [
 "num-bigint",
 "num-traits",
- "thiserror",
+ "thiserror 2.0.12",
 "time",
 ]

@@ -3280,7 +3370,7 @@ dependencies = [
 "serde_json",
 "sha2",
 "smallvec",
- "thiserror",
+ "thiserror 2.0.12",
 "time",
 "tokio",
 "tokio-stream",
@@ -3335,7 +3425,7 @@ checksum = "aa003f0038df784eb8fecbbac13affe3da23b45194bd57dba231c8f48199c526"
 dependencies = [
 "atoi",
 "base64",
- "bitflags",
+ "bitflags 2.9.1",
 "byteorder",
 "bytes",
 "chrono",
@@ -3366,7 +3456,7 @@ dependencies = [
 "smallvec",
 "sqlx-core",
 "stringprep",
- "thiserror",
+ "thiserror 2.0.12",
 "time",
 "tracing",
 "uuid",
@@ -3381,7 +3471,7 @@ checksum = "db58fcd5a53cf07c184b154801ff91347e4c30d17a3562a635ff028ad5deda46"
 dependencies = [
 "atoi",
 "base64",
- "bitflags",
+ "bitflags 2.9.1",
 "byteorder",
 "chrono",
 "crc",
@@ -3407,7 +3497,7 @@ dependencies = [
 "smallvec",
 "sqlx-core",
 "stringprep",
- "thiserror",
+ "thiserror 2.0.12",
 "time",
 "tracing",
 "uuid",
@@ -3434,7 +3524,7 @@ dependencies = [
 "serde",
 "serde_urlencoded",
 "sqlx-core",
- "thiserror",
+ "thiserror 2.0.12",
 "time",
 "tracing",
 "url",
@@ -3516,7 +3606,7 @@ dependencies = [
 "rust_decimal_macros",
 "steel-core",
 "steel-derive",
- "thiserror",
+ "thiserror 2.0.12",
 ]

 [[package]]
@@ -3558,6 +3648,12 @@ dependencies = [
 "smallvec",
 ]

+[[package]]
+name = "str_indices"
+version = "0.4.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "d08889ec5408683408db66ad89e0e1f93dff55c73a4ccc71c427d5b277ee47e6"
+
 [[package]]
 name = "stringprep"
 version = "0.1.5"
@@ -3642,6 +3738,28 @@ dependencies = [
 "syn 2.0.104",
 ]

+[[package]]
+name = "syntect"
+version = "5.2.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "874dcfa363995604333cf947ae9f751ca3af4522c60886774c4963943b4746b1"
+dependencies = [
+ "bincode",
+ "bitflags 1.3.2",
+ "fancy-regex",
+ "flate2",
+ "fnv",
+ "once_cell",
+ "plist",
+ "regex-syntax",
+ "serde",
+ "serde_derive",
+ "serde_json",
+ "thiserror 1.0.69",
+ "walkdir",
+ "yaml-rust",
+]
+
 [[package]]
 name = "tantivy"
 version = "0.24.2"
@@ -3688,7 +3806,7 @@ dependencies = [
 "tantivy-stacker",
 "tantivy-tokenizer-api",
 "tempfile",
- "thiserror",
+ "thiserror 2.0.12",
 "time",
 "uuid",
 "winapi",
@@ -3804,7 +3922,7 @@ dependencies = [
 "getrandom 0.3.3",
 "once_cell",
 "rustix 1.0.8",
- "windows-sys 0.52.0",
+ "windows-sys 0.59.0",
 ]

 [[package]]
@@ -3816,13 +3934,33 @@ dependencies = [
 "winapi-util",
 ]

+[[package]]
+name = "thiserror"
+version = "1.0.69"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "b6aaf5339b578ea85b50e080feb250a3e8ae8cfcdff9a461c9ec2904bc923f52"
+dependencies = [
+ "thiserror-impl 1.0.69",
+]
+
 [[package]]
 name = "thiserror"
 version = "2.0.12"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "567b8a2dae586314f7be2a752ec7474332959c6460e02bde30d702a66d488708"
 dependencies = [
- "thiserror-impl",
+ "thiserror-impl 2.0.12",
+]
+
+[[package]]
+name = "thiserror-impl"
+version = "1.0.69"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "4fee6c4efc90059e10f81e6d42c60a18f76588c3d74cb83a0b242a2b6c7504c1"
+dependencies = [
+ "proc-macro2",
+ "quote",
+ "syn 2.0.104",
 ]

 [[package]]
@@ -4347,6 +4485,16 @@ version = "0.9.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "0b928f33d975fc6ad9f86c8f283853ad26bdd5b10b7f1542aa2fa15e2289105a"

+[[package]]
+name = "walkdir"
+version = "2.5.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "29790946404f91d9c5d06f9874efddea1dc06c5efe94541a7d6863108e3a5e4b"
+dependencies = [
+ "same-file",
+ "winapi-util",
+]
+
 [[package]]
 name = "want"
 version = "0.3.1"
@@ -4485,7 +4633,7 @@ version = "0.1.9"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "cf221c93e13a30d793f7645a0e7762c55d169dbb0a49671918a2319d289b10bb"
 dependencies = [
- "windows-sys 0.48.0",
+ "windows-sys 0.59.0",
 ]

 [[package]]
@@ -4795,7 +4943,7 @@ version = "0.39.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "6f42320e61fe2cfd34354ecb597f86f413484a798ba44a8ca1165c58d42da6c1"
 dependencies = [
- "bitflags",
+ "bitflags 2.9.1",
 ]

 [[package]]
@@ -4819,6 +4967,15 @@ version = "3.0.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "2fb433233f2df9344722454bc7e96465c9d03bff9d77c248f9e7523fe79585b5"

+[[package]]
+name = "yaml-rust"
+version = "0.4.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "56c1936c4cc7a1c9ab21a1ebb602eb942ba868cbd44a99cb7cdc5892335e1c85"
+dependencies = [
+ "linked-hash-map",
+]
+
 [[package]]
 name = "yoke"
 version = "0.8.0"
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -5,7 +5,7 @@ resolver = "2"
 [workspace.package]
 # TODO: idk how to do the name, fix later
 # name = "komp_ac"
-version = "0.4.2"
+version = "0.5.0"
 edition = "2021"
 license = "GPL-3.0-or-later"
 authors = ["Filip Priečinský <filippriec@gmail.com>"]
--- a/canvas/CANVAS_MIGRATION.md
+++ b/canvas/CANVAS_MIGRATION.md
@@ -57,7 +57,7 @@ use canvas::canvas::CanvasState;
 use canvas::canvas::CanvasAction;
 use canvas::canvas::ActionContext;
 use canvas::canvas::HighlightState;
-use canvas::canvas::CanvasTheme;
+use canvas::CanvasTheme;
 use canvas::dispatcher::ActionDispatcher;
 use canvas::canvas::ActionResult;
 ```
@@ -153,7 +153,7 @@ if editor.is_suggestions_active() {
 **New rendering:**
 ```rust
 // Canvas handles everything
-use canvas::canvas::render_canvas;
+use canvas::render_canvas_default;

 let active_field_rect = render_canvas(f, area, form_state, theme, edit_mode, highlight_state);

--- a/canvas/Cargo.toml
+++ b/canvas/Cargo.toml
@@ -2,15 +2,14 @@
 name = "canvas"
 version.workspace = true
 edition.workspace = true
-license.workspace = true
+license = "MIT OR Apache-2.0"
 authors.workspace = true
-description.workspace = true
+description = "Form/textarea for TUI"
 readme.workspace = true
 repository.workspace = true
 categories.workspace = true

 [dependencies]
-common = { path = "../common" }
 ratatui = { workspace = true, optional = true }
 crossterm = { workspace = true, optional = true }
 anyhow.workspace = true
@@ -24,17 +23,37 @@ tracing = "0.1.41"
 tracing-subscriber = "0.3.19"
 async-trait.workspace = true
 regex = { workspace = true, optional = true }
+ropey = { version = "1.6.1", optional = true }
+once_cell = "1.21.3"
+syntect = { version = "5.2.0", optional = true, default-features = false, features = ["default-fancy"] }

 [dev-dependencies]
 tokio-test = "0.4.4"

 [features]
-default = []
+default = ["textmode-vim"]
 gui = ["ratatui", "crossterm"]
 suggestions = ["tokio"]
 cursor-style = ["crossterm"]
 validation = ["regex"]
 computed = []
+textarea = ["dep:ropey","gui"]
+syntect = ["dep:syntect", "gui", "textarea"]
+keymap = ["gui"]
+
+# text modes (mutually exclusive; default to vim)
+textmode-vim = []
+textmode-normal = []
+
+all-nontextmodes = [
+    "gui",
+    "suggestions",
+    "cursor-style",
+    "validation",
+    "computed",
+    "textarea",
+    "keymap"
+]

 [[example]]
 name = "suggestions"
@@ -42,30 +61,55 @@ required-features = ["suggestions", "gui", "cursor-style"]
 path = "examples/suggestions.rs"

 [[example]]
-name = "canvas_gui_demo"
+name = "suggestions2"
+required-features = ["suggestions", "gui", "cursor-style"]
+path = "examples/suggestions2.rs"
+
+[[example]]
+name = "canvas_cursor_auto"
 required-features = ["gui", "cursor-style"]
-path = "examples/canvas_gui_demo.rs"
+path = "examples/canvas_cursor_auto.rs"

 [[example]]
 name = "validation_1"
-required-features = ["gui", "validation"]
+required-features = ["gui", "validation", "cursor-style"]

 [[example]]
 name = "validation_2"
-required-features = ["gui", "validation"]
+required-features = ["gui", "validation", "cursor-style"]

 [[example]]
 name = "validation_3"
-required-features = ["gui", "validation"]
+required-features = ["gui", "validation", "cursor-style"]

 [[example]]
 name = "validation_4"
-required-features = ["gui", "validation"]
+required-features = ["gui", "validation", "cursor-style"]

 [[example]]
 name = "validation_5"
-required-features = ["gui", "validation"]
+required-features = ["gui", "validation", "cursor-style"]

 [[example]]
 name = "computed_fields"
 required-features = ["gui", "computed"]
+
+[[example]]
+name = "textarea_vim"
+required-features = ["gui", "cursor-style", "textarea", "textmode-vim"]
+path = "examples/textarea_vim.rs"
+
+[[example]]
+name = "textarea_normal"
+required-features = ["gui", "cursor-style", "textarea", "textmode-normal"]
+path = "examples/textarea_normal.rs"
+
+[[example]]
+name = "textarea_syntax"
+required-features = ["gui", "cursor-style", "textarea", "textmode-normal", "syntect"]
+path = "examples/textarea_syntax.rs"
+
+[[example]]
+name = "canvas_keymap"
+required-features = ["gui", "keymap", "cursor-style"]
+path = "examples/canvas_keymap.rs"
--- a/canvas/README.md
+++ b/canvas/README.md
@@ -1,337 +1,113 @@
-# Canvas 🎨
+# Canvas

-A reusable, type-safe canvas system for building form-based TUI applications with vim-like modal editing.
+Canvas is a Rust library for building form‑based and textarea‑driven terminal user interfaces.
+It provides the core logic for text editing, validation, suggestions, and cursor management.

-## ✨ 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 suggestions dropdown 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(())
-}
-```
-
-## 🎯 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 Dropdown (not inline 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
+The library does not enforce a specific terminal UI framework:
+- Core functionality works without any rendering backend.
+- Terminal rendering support is available through the `gui` feature, which enables integration with `ratatui` and `crossterm`.
+- Applications may also integrate Canvas with other backends by handling input and rendering independently.

 ---

-Built with ❤️ for the Rust TUI community
+## Overview
+
+Canvas is designed for applications that require structured text input in a terminal environment.
+It provides:
+
+- Text editing modes (Vim‑like or normal)
+- Validation (regex, masks, limits, formatting)
+- Suggestions (asynchronous dropdowns)
+- Computed fields (derived values)
+- Textarea widget with cursor management
+- Syntax highlighting (via syntect)
+- Extensible architecture for custom behaviors
+
+---
+
+## Installation
+
+Add the dependency to your `Cargo.toml`:
+
+```toml
+[dependencies]
+canvas = { version = "0.x", features = ["gui", "cursor-style", "textarea", "validation"] }
+```
+
+---
+
+## Features
+
+The library is feature‑gated. Enable only what you need:
+
+- `gui` – terminal rendering support (ratatui + crossterm)
+- `cursor-style` – styled cursor support
+- `validation` – regex, masks, limits, formatting
+- `suggestions` – asynchronous suggestions dropdowns
+- `computed` – derived fields
+- `textarea` – textarea widget
+- `syntect` – syntax highlighting support
+- `textmode-vim` – Vim‑like editing (default)
+- `textmode-normal` – normal editing mode
+
+**Note:** `textmode-vim` and `textmode-normal` are mutually exclusive. Enable exactly one.
+
+The default feature set is `["textmode-vim"]`.
+
+---
+
+## Running Examples
+
+The repository includes several examples. Each requires specific feature flags.
+Use the following commands to run them:
+
+```bash
+# Textarea with Vim mode
+cargo run --example textarea_vim --features "gui cursor-style textarea textmode-vim"
+
+# Textarea with Normal mode
+cargo run --example textarea_normal --features "gui cursor-style textarea textmode-normal"
+
+# Textarea with syntax highlighting
+cargo run --example textarea_syntax --features "gui cursor-style textarea syntect textmode-normal"
+
+# Validation examples
+cargo run --example validation_1 --features "gui validation cursor-style"
+cargo run --example validation_2 --features "gui validation cursor-style"
+cargo run --example validation_3 --features "gui validation cursor-style"
+cargo run --example validation_4 --features "gui validation cursor-style"
+cargo run --example validation_5 --features "gui validation cursor-style"
+
+# Suggestions
+cargo run --example suggestions --features "suggestions gui cursor-style"
+cargo run --example suggestions2 --features "suggestions gui cursor-style"
+
+# Cursor auto movement
+cargo run --example canvas_cursor_auto --features "gui cursor-style"
+
+# Computed fields
+cargo run --example computed_fields --features "gui computed"
+```
+
+---
+
+## Documentation
+
+- API documentation: `cargo doc --open`
+- Migration notes: `CANVAS_MIGRATION.md`
+
+---
+
+## License
+
+Licensed under either of:
+- Apache License, Version 2.0
+- MIT License
+
+at your option.
+
+---
+
+## Contributing
+
+Contributions are welcome. Please follow the existing code structure and feature‑gating conventions.
--- a/canvas/aider.md
+++ b/canvas/aider.md
@@ -0,0 +1,16 @@
+# Aider Instructions
+
+## General Rules
+- Only modify files that I explicitly add with `/add`.
+- If a prompt mentions multiple files, **ignore all files except the ones I have added**.
+- Do not create, edit, or delete any files unless they are explicitly added.
+- Keep all other files exactly as they are, even if the prompt suggests changes.
+- Never move logic into or out of files that are not explicitly added.
+- If a prompt suggests changes to multiple files, apply **only the subset of changes** that belong to the added file(s).
+- If a change requires touching other files, ignore them, if they were not manually added.
+
+## Coding Style
+- Follow Rust 2021 edition idioms.
+- No logic in `mod.rs` files (only exports/routing).
+- Always update or create tests **only if the test file is explicitly added**.
+- Do not think, only apply changes from the prompt
--- a/canvas/examples/canvas_cursor_auto.rs
+++ b/canvas/examples/canvas_cursor_auto.rs
@@ -38,7 +38,7 @@ use ratatui::{
 use canvas::{
    canvas::{
        gui::render_canvas_default,
-        modes::{AppMode, ModeManager, HighlightState},
+        modes::AppMode,
        CursorManager, // This import only exists when cursor-style feature is enabled
    },
    DataProvider, FormEditor,
@@ -205,7 +205,7 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
            self.has_unsaved_changes = true;
            self.debug_message = "⌫ Deleted character backward".to_string();
        }
-        Ok(result?)
+        result
    }

    fn delete_forward(&mut self) -> anyhow::Result<()> {
@@ -214,7 +214,7 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
            self.has_unsaved_changes = true;
            self.debug_message = "⌦ Deleted character forward".to_string();
        }
-        Ok(result?)
+        result
    }

    // === MODE TRANSITIONS WITH AUTOMATIC CURSOR MANAGEMENT ===
@@ -240,7 +240,7 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
        if result.is_ok() {
            self.has_unsaved_changes = true;
        }
-        Ok(result?)
+        result
    }

    // === MANUAL CURSOR OVERRIDE DEMONSTRATION ===
@@ -275,7 +275,8 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
    }

    fn current_text(&self) -> &str {
-        self.editor.current_text()
+        let field_index = self.editor.current_field();
+        self.editor.data_provider().field_value(field_index)
    }

    fn data_provider(&self) -> &D {
@@ -306,6 +307,42 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
    fn has_unsaved_changes(&self) -> bool {
        self.has_unsaved_changes
    }
+
+    fn open_line_below(&mut self) -> anyhow::Result<()> {
+        let result = self.editor.open_line_below();
+        if result.is_ok() {
+            self.debug_message = "✏️  INSERT (open line below) - Cursor: Steady Bar |".to_string();
+        }
+        result
+    }
+
+    fn open_line_above(&mut self) -> anyhow::Result<()> {
+        let result = self.editor.open_line_above();
+        if result.is_ok() {
+            self.debug_message = "✏️  INSERT (open line above) - Cursor: Steady Bar |".to_string();
+        }
+        result
+    }
+
+    fn move_big_word_next(&mut self) {
+        self.editor.move_big_word_next();
+        self.update_visual_selection();
+    }
+
+    fn move_big_word_prev(&mut self) {
+        self.editor.move_big_word_prev();
+        self.update_visual_selection();
+    }
+
+    fn move_big_word_end(&mut self) {
+        self.editor.move_big_word_end();
+        self.update_visual_selection();
+    }
+
+    fn move_big_word_end_prev(&mut self) {
+        self.editor.move_big_word_end_prev();
+        self.update_visual_selection();
+    }
 }

 // Demo form data with interesting text for cursor demonstration
@@ -389,10 +426,17 @@ fn handle_key_press(
            editor.set_debug_message("✏️  INSERT (end of line) - Cursor: Steady Bar |".to_string());
            editor.clear_command_buffer();
        }
+
        (AppMode::ReadOnly, KeyCode::Char('o'), _) => {
-            editor.move_line_end();
-            editor.enter_edit_mode(); // 🎯 Automatic: cursor becomes bar |
-            editor.set_debug_message("✏️  INSERT (open line) - Cursor: Steady Bar |".to_string());
+            if let Err(e) = editor.open_line_below() {
+                editor.set_debug_message(format!("Error opening line below: {e}"));
+            }
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('O'), _) => {
+            if let Err(e) = editor.open_line_above() {
+                editor.set_debug_message(format!("Error opening line above: {e}"));
+            }
            editor.clear_command_buffer();
        }

@@ -507,10 +551,40 @@ fn handle_key_press(
            editor.clear_command_buffer();
        }
        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('e'), _) => {
-            editor.move_word_end();
-            editor.set_debug_message("e: word end".to_string());
+            // Check if this is 'ge' command
+            if editor.get_command_buffer() == "g" {
+                editor.move_word_end_prev();
+                editor.set_debug_message("ge: previous word end".to_string());
+                editor.clear_command_buffer();
+            } else {
+                editor.move_word_end();
+                editor.set_debug_message("e: word end".to_string());
+                editor.clear_command_buffer();
+            }
+        }
+
+        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('W'), _) => {
+            editor.move_big_word_next();
+            editor.set_debug_message("W: next WORD start".to_string());
            editor.clear_command_buffer();
        }
+        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('B'), _) => {
+            editor.move_big_word_prev();
+            editor.set_debug_message("B: previous WORD start".to_string());
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('E'), _) => {
+            // Check if this is 'gE' command
+            if editor.get_command_buffer() == "g" {
+                editor.move_big_word_end_prev();
+                editor.set_debug_message("gE: previous WORD end".to_string());
+                editor.clear_command_buffer();
+            } else {
+                editor.move_big_word_end();
+                editor.set_debug_message("E: WORD end".to_string());
+                editor.clear_command_buffer();
+            }
+        }

        // Line movement
        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('0'), _)
@@ -620,8 +694,7 @@ fn handle_key_press(
                editor.set_debug_message("Invalid command sequence".to_string());
            } else {
                editor.set_debug_message(format!(
-                    "Unhandled: {:?} + {:?} in {:?} mode",
-                    key, modifiers, mode
+                    "Unhandled: {key:?} + {modifiers:?} in {mode:?} mode"
                ));
            }
        }
@@ -645,7 +718,7 @@ fn run_app<B: Backend>(
                    }
                }
                Err(e) => {
-                    editor.set_debug_message(format!("Error: {}", e));
+                    editor.set_debug_message(format!("Error: {e}"));
                }
            }
        }
@@ -721,9 +794,9 @@ fn render_status_and_help(
                }
            } else {
                "🎯 CURSOR-STYLE DEMO: Normal █ | Insert | | Visual blinking█\n\
-                 Normal: hjkl/arrows=move, w/b/e=words, 0/$=line, gg/G=first/last\n\
-                 i/a/A=insert, v/b=visual, x/X=delete, ?=info\n\
-                 F1=demo manual cursor, F2=restore automatic"
+                Normal: hjkl/arrows=move, w/b/e=words, W/B/E=WORDS, 0/$=line, gg/G=first/last\n\
+                i/a/A/o/O=insert, v/V=visual, x/X=delete, ?=info\n\
+                F1=demo manual cursor, F2=restore automatic"
            }
        }
        AppMode::Edit => {
@@ -784,7 +857,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
    terminal.show_cursor()?;

    if let Err(err) = res {
-        println!("{:?}", err);
+        println!("{err:?}");
    }

    println!("🎯 Cursor automatically reset to default!");
--- a/canvas/examples/canvas_keymap.rs
+++ b/canvas/examples/canvas_keymap.rs
@@ -0,0 +1,376 @@
+// examples/canvas_keymap.rs
+//! Demonstrates the centralized keymap system for canvas interactions
+//!
+//! This example shows how to use the canvas-keymap feature to delegate
+//! all canvas key handling to the library, supporting complex sequences
+//! like "gg", "ge", etc.
+//!
+//! Run with:
+//! cargo run --example canvas_keymap --features "gui,keymap,cursor-style"
+
+#[cfg(not(feature = "keymap"))]
+compile_error!(
+    "This example requires the 'keymap' feature. \
+     Run with: cargo run --example canvas_keymap --features \"gui,keymap,cursor-style\""
+);
+
+use std::collections::HashMap;
+use std::io;
+use crossterm::{
+    event::{self, DisableMouseCapture, EnableMouseCapture, Event, KeyEvent},
+    execute,
+    terminal::{disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen},
+};
+use ratatui::{
+    backend::{Backend, CrosstermBackend},
+    layout::{Constraint, Direction, Layout},
+    style::{Color, Style},
+    text::{Line, Span},
+    widgets::{Block, Borders, Paragraph},
+    Frame, Terminal,
+};
+
+use canvas::{
+    canvas::{gui::render_canvas_default, modes::AppMode},
+    keymap::{CanvasKeyMap, KeyEventOutcome},
+    DataProvider, FormEditor,
+};
+
+/// Demo application using centralized keymap system
+struct KeymapDemoApp {
+    editor: FormEditor<DemoData>,
+    message: String,
+    quit: bool,
+}
+
+impl KeymapDemoApp {
+    fn new() -> Self {
+        let data = DemoData::new();
+        let mut editor = FormEditor::new(data);
+        
+        // Build and inject the keymap from our config
+        let keymap = Self::build_demo_keymap();
+        editor.set_keymap(keymap);
+        
+        Self {
+            editor,
+            message: "🎯 Keymap system loaded! Try: gg, ge, hjkl, w/b/e, v, i, etc.".to_string(),
+            quit: false,
+        }
+    }
+
+    /// Build a comprehensive keymap configuration
+    fn build_demo_keymap() -> CanvasKeyMap {
+        let mut read_only = HashMap::new();
+        let mut edit = HashMap::new();
+        let mut highlight = HashMap::new();
+
+        // === READ-ONLY MODE KEYBINDINGS ===
+        
+        // Basic movement
+        read_only.insert("move_left".to_string(), vec!["h".to_string(), "Left".to_string()]);
+        read_only.insert("move_right".to_string(), vec!["l".to_string(), "Right".to_string()]);
+        read_only.insert("move_up".to_string(), vec!["k".to_string(), "Up".to_string()]);
+        read_only.insert("move_down".to_string(), vec!["j".to_string(), "Down".to_string()]);
+
+        // Word movement
+        read_only.insert("move_word_next".to_string(), vec!["w".to_string()]);
+        read_only.insert("move_word_prev".to_string(), vec!["b".to_string()]);
+        read_only.insert("move_word_end".to_string(), vec!["e".to_string()]);
+        read_only.insert("move_word_end_prev".to_string(), vec!["ge".to_string()]); // Multi-key!
+
+        // Big word movement  
+        read_only.insert("move_big_word_next".to_string(), vec!["W".to_string()]);
+        read_only.insert("move_big_word_prev".to_string(), vec!["B".to_string()]);
+        read_only.insert("move_big_word_end".to_string(), vec!["E".to_string()]);
+        read_only.insert("move_big_word_end_prev".to_string(), vec!["gE".to_string()]); // Multi-key!
+
+        // Line movement
+        read_only.insert("move_line_start".to_string(), vec!["0".to_string(), "Home".to_string()]);
+        read_only.insert("move_line_end".to_string(), vec!["$".to_string(), "End".to_string()]);
+        
+        // Field movement
+        read_only.insert("move_first_line".to_string(), vec!["gg".to_string()]); // Multi-key!
+        read_only.insert("move_last_line".to_string(), vec!["G".to_string()]);
+        read_only.insert("next_field".to_string(), vec!["Tab".to_string()]);
+        read_only.insert("prev_field".to_string(), vec!["Shift+Tab".to_string()]);
+
+        // Mode transitions
+        read_only.insert("enter_edit_mode_before".to_string(), vec!["i".to_string()]);
+        read_only.insert("enter_edit_mode_after".to_string(), vec!["a".to_string()]);
+        read_only.insert("enter_highlight_mode".to_string(), vec!["v".to_string()]);
+        read_only.insert("enter_highlight_mode_linewise".to_string(), vec!["V".to_string()]);
+
+        // Editing actions in normal mode
+        read_only.insert("delete_char_forward".to_string(), vec!["x".to_string()]);
+        read_only.insert("delete_char_backward".to_string(), vec!["X".to_string()]);
+        read_only.insert("open_line_below".to_string(), vec!["o".to_string()]);
+        read_only.insert("open_line_above".to_string(), vec!["O".to_string()]);
+
+        // === EDIT MODE KEYBINDINGS ===
+        
+        edit.insert("exit_edit_mode".to_string(), vec!["esc".to_string()]);
+        edit.insert("move_left".to_string(), vec!["Left".to_string()]);
+        edit.insert("move_right".to_string(), vec!["Right".to_string()]);
+        edit.insert("move_up".to_string(), vec!["Up".to_string()]);
+        edit.insert("move_down".to_string(), vec!["Down".to_string()]);
+        edit.insert("move_line_start".to_string(), vec!["Home".to_string()]);
+        edit.insert("move_line_end".to_string(), vec!["End".to_string()]);
+        edit.insert("move_word_next".to_string(), vec!["Ctrl+Right".to_string()]);
+        edit.insert("move_word_prev".to_string(), vec!["Ctrl+Left".to_string()]);
+        edit.insert("next_field".to_string(), vec!["Tab".to_string()]);
+        edit.insert("prev_field".to_string(), vec!["Shift+Tab".to_string()]);
+        edit.insert("delete_char_backward".to_string(), vec!["Backspace".to_string()]);
+        edit.insert("delete_char_forward".to_string(), vec!["Delete".to_string()]);
+
+        // === HIGHLIGHT MODE KEYBINDINGS ===
+        
+        highlight.insert("exit_highlight_mode".to_string(), vec!["esc".to_string()]);
+        highlight.insert("enter_highlight_mode_linewise".to_string(), vec!["V".to_string()]);
+        
+        // Movement (extends selection)
+        highlight.insert("move_left".to_string(), vec!["h".to_string(), "Left".to_string()]);
+        highlight.insert("move_right".to_string(), vec!["l".to_string(), "Right".to_string()]);
+        highlight.insert("move_up".to_string(), vec!["k".to_string(), "Up".to_string()]);
+        highlight.insert("move_down".to_string(), vec!["j".to_string(), "Down".to_string()]);
+        highlight.insert("move_word_next".to_string(), vec!["w".to_string()]);
+        highlight.insert("move_word_prev".to_string(), vec!["b".to_string()]);
+        highlight.insert("move_word_end".to_string(), vec!["e".to_string()]);
+        highlight.insert("move_word_end_prev".to_string(), vec!["ge".to_string()]);
+        highlight.insert("move_line_start".to_string(), vec!["0".to_string()]);
+        highlight.insert("move_line_end".to_string(), vec!["$".to_string()]);
+        highlight.insert("move_first_line".to_string(), vec!["gg".to_string()]);
+        highlight.insert("move_last_line".to_string(), vec!["G".to_string()]);
+
+        CanvasKeyMap::from_mode_maps(&read_only, &edit, &highlight)
+    }
+
+    fn handle_key_event(&mut self, key_event: KeyEvent) -> io::Result<()> {
+        // First, try canvas keymap
+        match self.editor.handle_key_event(key_event) {
+            KeyEventOutcome::Consumed(Some(msg)) => {
+                self.message = format!("🎯 Canvas: {}", msg);
+                return Ok(());
+            }
+            KeyEventOutcome::Consumed(None) => {
+                self.message = "🎯 Canvas action executed".to_string();
+                return Ok(());
+            }
+            KeyEventOutcome::Pending => {
+                self.message = "⏳ Waiting for next key in sequence...".to_string();
+                return Ok(());
+            }
+            KeyEventOutcome::NotMatched => {
+                // Fall through to client actions
+            }
+        }
+
+        // Handle client-specific actions (non-canvas)
+        use crossterm::event::{KeyCode, KeyModifiers};
+        match (key_event.code, key_event.modifiers) {
+            (KeyCode::Char('q'), KeyModifiers::CONTROL) |
+            (KeyCode::Char('c'), KeyModifiers::CONTROL) => {
+                self.quit = true;
+                self.message = "👋 Goodbye!".to_string();
+            }
+            (KeyCode::F(1), _) => {
+                self.message = "ℹ️  F1: This is a client action (not handled by canvas keymap)".to_string();
+            }
+            (KeyCode::F(2), _) => {
+                // Demonstrate saving
+                self.message = "💾 F2: Save action (client-side)".to_string();
+            }
+            (KeyCode::Char('?'), _) if self.editor.mode() == AppMode::ReadOnly => {
+                self.show_help();
+            }
+            _ => {
+                // Unknown key
+                self.message = format!(
+                    "❓ Unhandled key: {:?} (mode: {:?})",
+                    key_event.code,
+                    self.editor.mode()
+                );
+            }
+        }
+
+        Ok(())
+    }
+
+    fn show_help(&mut self) {
+        self.message = "📖 Help: Multi-key sequences work! Try gg, ge, gE. Also: hjkl, w/b/e, v/V, i/a/o".to_string();
+    }
+
+    fn should_quit(&self) -> bool {
+        self.quit
+    }
+
+    fn editor(&self) -> &FormEditor<DemoData> {
+        &self.editor
+    }
+
+    fn message(&self) -> &str {
+        &self.message
+    }
+}
+
+/// Demo form data with interesting examples for keymap testing
+struct DemoData {
+    fields: Vec<(String, String)>,
+}
+
+impl DemoData {
+    fn new() -> Self {
+        Self {
+            fields: vec![
+                ("🎯 Name".to_string(), "John-Paul McDonald-Smith".to_string()),
+                ("📧 Email".to_string(), "user@long-domain-name.example.com".to_string()),
+                ("📱 Phone".to_string(), "+1 (555) 123-4567 ext. 890".to_string()),
+                ("🏠 Address".to_string(), "123 Main Street, Apartment 4B, Suite 100".to_string()),
+                ("🏷️  Tags".to_string(), "urgent,important,follow-up,high-priority".to_string()),
+                ("📝 Notes".to_string(), "Test word movements: w=next-word, b=prev-word, e=word-end, ge=prev-word-end".to_string()),
+                ("🔥 Multi-key".to_string(), "Try multi-key sequences: gg=first-field, ge=prev-word-end, gE=prev-WORD-end".to_string()),
+                ("⚡ Vim Actions".to_string(), "Normal mode: x=delete-char, o=open-line-below, v=visual, i=insert".to_string()),
+            ],
+        }
+    }
+}
+
+impl DataProvider for DemoData {
+    fn field_count(&self) -> usize {
+        self.fields.len()
+    }
+
+    fn field_name(&self, index: usize) -> &str {
+        &self.fields[index].0
+    }
+
+    fn field_value(&self, index: usize) -> &str {
+        &self.fields[index].1
+    }
+
+    fn set_field_value(&mut self, index: usize, value: String) {
+        self.fields[index].1 = value;
+    }
+}
+
+fn run_app<B: Backend>(terminal: &mut Terminal<B>, mut app: KeymapDemoApp) -> io::Result<()> {
+    loop {
+        terminal.draw(|f| ui(f, &app))?;
+
+        if let Event::Key(key) = event::read()? {
+            app.handle_key_event(key)?;
+            if app.should_quit() {
+                break;
+            }
+        }
+    }
+    Ok(())
+}
+
+fn ui(f: &mut Frame, app: &KeymapDemoApp) {
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([Constraint::Min(8), Constraint::Length(12)])
+        .split(f.area());
+
+    // Render the canvas
+    render_canvas_default(f, chunks[0], app.editor());
+
+    // Render status and help
+    render_status_and_help(f, chunks[1], app);
+}
+
+fn render_status_and_help(f: &mut Frame, area: ratatui::layout::Rect, app: &KeymapDemoApp) {
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([Constraint::Length(3), Constraint::Min(9)])
+        .split(area);
+
+    // Status message
+    let status_text = format!(
+        "Mode: {:?} | Field: {}/{} | Pos: {} | {}",
+        app.editor().mode(),
+        app.editor().current_field() + 1,
+        app.editor().data_provider().field_count(),
+        app.editor().cursor_position(),
+        app.message()
+    );
+
+    let status = Paragraph::new(Line::from(Span::raw(status_text)))
+        .block(Block::default().borders(Borders::ALL).title("🎯 Keymap Demo Status"));
+
+    f.render_widget(status, chunks[0]);
+
+    // Help text based on current mode
+    let help_text = match app.editor().mode() {
+        AppMode::ReadOnly => {
+            "🎯 KEYMAP DEMO - All keys handled by centralized keymap system!\n\
+             \n\
+             📍 MOVEMENT: hjkl(basic) | w/b/e(words) | W/B/E(WORDS) | 0/$(line) | gg/G(fields)\n\
+             🔥 MULTI-KEY: gg=first-field, ge=prev-word-end, gE=prev-WORD-end\n\
+             ✏️  MODES: i/a(insert) | v/V(visual) | o/O(open-line)\n\
+             🗑️  DELETE: x/X(delete-char)\n\
+             📂 FIELDS: Tab/Shift+Tab\n\
+             \n\
+             💡 Try multi-key sequences like 'gg' or 'ge' - watch the status for 'Waiting...'\n\
+             🚪 Ctrl+C=quit | ?=help | F1/F2=client actions (not canvas)"
+        }
+        AppMode::Edit => {
+            "✏️  INSERT MODE - Keys handled by keymap system\n\
+             \n\
+             🔄 NAVIGATION: arrows | Ctrl+arrows(words) | Home/End(line) | Tab/Shift+Tab(fields)\n\
+             🗑️  DELETE: Backspace/Delete\n\
+             🚪 EXIT: Esc=normal\n\
+             \n\
+             💡 Type text normally - the keymap handles navigation!"
+        }
+        AppMode::Highlight => {
+            "🎯 VISUAL MODE - Selection extended by keymap movements\n\
+             \n\
+             📍 EXTEND: hjkl(basic) | w/b/e(words) | 0/$(line) | gg/G(fields)\n\
+             🔄 SWITCH: V=toggle-line-mode\n\
+             🚪 EXIT: Esc=normal\n\
+             \n\
+             💡 All movements extend the selection automatically!"
+        }
+        _ => "🎯 Keymap system active!"
+    };
+
+    let help = Paragraph::new(help_text)
+        .block(Block::default().borders(Borders::ALL).title("🚀 Centralized Keymap System"))
+        .style(Style::default().fg(Color::Gray));
+
+    f.render_widget(help, chunks[1]);
+}
+
+fn main() -> Result<(), Box<dyn std::error::Error>> {
+    println!("🎯 Canvas Keymap Demo");
+    println!("✅ canvas-keymap feature: ENABLED");
+    println!("🚀 Centralized key handling: ACTIVE");
+    println!("📖 Multi-key sequences: SUPPORTED (gg, ge, gE, etc.)");
+    println!();
+
+    enable_raw_mode()?;
+    let mut stdout = io::stdout();
+    execute!(stdout, EnterAlternateScreen, EnableMouseCapture)?;
+    let backend = CrosstermBackend::new(stdout);
+    let mut terminal = Terminal::new(backend)?;
+
+    let app = KeymapDemoApp::new();
+    let res = run_app(&mut terminal, app);
+
+    disable_raw_mode()?;
+    execute!(
+        terminal.backend_mut(),
+        LeaveAlternateScreen,
+        DisableMouseCapture
+    )?;
+    terminal.show_cursor()?;
+
+    if let Err(err) = res {
+        println!("{err:?}");
+    }
+
+    println!("🎯 Keymap demo completed!");
+    Ok(())
+}
--- a/canvas/examples/computed_fields.rs
+++ b/canvas/examples/computed_fields.rs
@@ -133,7 +133,7 @@ impl ComputedProvider for InvoiceCalculator {
                if qty == 0.0 || price == 0.0 {
                    "".to_string()  // Show empty if no meaningful calculation
                } else {
-                    format!("{:.2}", subtotal)
+                    format!("{subtotal:.2}")
                }
            }
            5 => {
@@ -147,7 +147,7 @@ impl ComputedProvider for InvoiceCalculator {
                if subtotal == 0.0 || tax_rate == 0.0 {
                    "".to_string()
                } else {
-                    format!("{:.2}", tax_amount)
+                    format!("{tax_amount:.2}")
                }
            }
            6 => {
@@ -162,7 +162,7 @@ impl ComputedProvider for InvoiceCalculator {
                } else {
                    let tax_amount = subtotal * (tax_rate / 100.0);
                    let total = subtotal + tax_amount;
-                    format!("{:.2}", total)
+                    format!("{total:.2}")
                }
            }
            _ => "".to_string(),
@@ -170,7 +170,7 @@ impl ComputedProvider for InvoiceCalculator {
    }
    
    fn handles_field(&self, field_index: usize) -> bool {
-        matches!(field_index, 4 | 5 | 6) // Subtotal, Tax Amount, Total
+        matches!(field_index, 4..=6) // Subtotal, Tax Amount, Total
    }
    
    fn field_dependencies(&self, field_index: usize) -> Vec<usize> {
@@ -244,13 +244,13 @@ impl<D: DataProvider> ComputedFieldsEditor<D> {
                
                let mut parts = Vec::new();
                if !subtotal.is_empty() {
-                    parts.push(format!("Subtotal=${}", subtotal));
+                    parts.push(format!("Subtotal=${subtotal}"));
                }
                if !tax.is_empty() {
-                    parts.push(format!("Tax=${}", tax));
+                    parts.push(format!("Tax=${tax}"));
                }
                if !total.is_empty() {
-                    parts.push(format!("Total=${}", total));
+                    parts.push(format!("Total=${total}"));
                }
                
                if !parts.is_empty() {
@@ -268,7 +268,7 @@ impl<D: DataProvider> ComputedFieldsEditor<D> {
        let current_field = self.editor.current_field();
        let result = self.editor.insert_char(ch);

-        if result.is_ok() && matches!(current_field, 1 | 2 | 3) {
+        if result.is_ok() && matches!(current_field, 1..=3) {
            self.editor.on_field_changed(&mut self.calculator, current_field);
            self.update_computed_fields();
        }
@@ -280,7 +280,7 @@ impl<D: DataProvider> ComputedFieldsEditor<D> {
        let current_field = self.editor.current_field();
        let result = self.editor.delete_backward();

-        if result.is_ok() && matches!(current_field, 1 | 2 | 3) {
+        if result.is_ok() && matches!(current_field, 1..=3) {
            self.editor.on_field_changed(&mut self.calculator, current_field);
            self.update_computed_fields();
        }
@@ -292,7 +292,7 @@ impl<D: DataProvider> ComputedFieldsEditor<D> {
        let current_field = self.editor.current_field();
        let result = self.editor.delete_forward();

-        if result.is_ok() && matches!(current_field, 1 | 2 | 3) {
+        if result.is_ok() && matches!(current_field, 1..=3) {
            self.editor.on_field_changed(&mut self.calculator, current_field);
            self.update_computed_fields();
        }
@@ -312,7 +312,7 @@ impl<D: DataProvider> ComputedFieldsEditor<D> {
            } else {
                "editable"
            };
-            self.debug_message = format!("→ {} - {} field", field_name, field_type);
+            self.debug_message = format!("→ {field_name} - {field_type} field");
        }
    }

@@ -328,7 +328,7 @@ impl<D: DataProvider> ComputedFieldsEditor<D> {
            } else {
                "editable"
            };
-            self.debug_message = format!("← {} - {} field", field_name, field_type);
+            self.debug_message = format!("← {field_name} - {field_type} field");
        }
    }

@@ -339,15 +339,14 @@ impl<D: DataProvider> ComputedFieldsEditor<D> {
        if self.editor.data_provider().is_computed_field(current) || self.is_computed_field(current) {
            let field_name = self.editor.data_provider().field_name(current);
            self.debug_message = format!(
-                "🚫 {} is computed (read-only) - Press Tab to move to editable fields",
-                field_name
+                "🚫 {field_name} is computed (read-only) - Press Tab to move to editable fields"
            );
            return;
        }
        
        self.editor.enter_edit_mode();
        let field_name = self.editor.data_provider().field_name(current);
-        self.debug_message = format!("✏️ Editing {} - Type to see calculations update", field_name);
+        self.debug_message = format!("✏️ Editing {field_name} - Type to see calculations update");
    }

    fn enter_append_mode(&mut self) {
@@ -356,22 +355,21 @@ impl<D: DataProvider> ComputedFieldsEditor<D> {
        if self.editor.data_provider().is_computed_field(current) || self.is_computed_field(current) {
            let field_name = self.editor.data_provider().field_name(current);
            self.debug_message = format!(
-                "🚫 {} is computed (read-only) - Press Tab to move to editable fields",
-                field_name
+                "🚫 {field_name} is computed (read-only) - Press Tab to move to editable fields"
            );
            return;
        }
        
        self.editor.enter_append_mode();
        let field_name = self.editor.data_provider().field_name(current);
-        self.debug_message = format!("✏️ Appending to {} - Type to see calculations", field_name);
+        self.debug_message = format!("✏️ Appending to {field_name} - Type to see calculations");
    }

    fn exit_edit_mode(&mut self) {
        let current_field = self.editor.current_field();
        self.editor.exit_edit_mode();

-        if matches!(current_field, 1 | 2 | 3) {
+        if matches!(current_field, 1..=3) {
            self.editor.on_field_changed(&mut self.calculator, current_field);
            self.update_computed_fields();
        }
@@ -383,7 +381,10 @@ impl<D: DataProvider> ComputedFieldsEditor<D> {
    fn current_field(&self) -> usize { self.editor.current_field() }
    fn cursor_position(&self) -> usize { self.editor.cursor_position() }
    fn mode(&self) -> AppMode { self.editor.mode() }
-    fn current_text(&self) -> &str { self.editor.current_text() }
+    fn current_text(&self) -> &str {
+        let field_index = self.editor.current_field();
+        self.editor.data_provider().field_value(field_index)
+    }
    fn data_provider(&self) -> &D { self.editor.data_provider() }
    fn ui_state(&self) -> &canvas::EditorState { self.editor.ui_state() }
    fn move_left(&mut self) { self.editor.move_left(); }
@@ -500,7 +501,7 @@ fn run_app<B: Backend>(
                    }
                }
                Err(e) => {
-                    editor.debug_message = format!("Error: {}", e);
+                    editor.debug_message = format!("Error: {e}");
                }
            }
        }
@@ -612,7 +613,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
    terminal.show_cursor()?;

    if let Err(err) = res {
-        println!("{:?}", err);
+        println!("{err:?}");
    }

    println!("💰 Demo completed! Computed fields should have updated in real-time!");
--- a/canvas/examples/full_canvas_demo.rs
+++ b/canvas/examples/full_canvas_demo.rs
@@ -1,724 +0,0 @@
-// examples/full_canvas_demo.rs
-//! Demonstrates the FULL potential of the canvas library using the native API
-
-use std::io;
-use crossterm::{
-    cursor::SetCursorStyle,
-    event::{
-        self, DisableMouseCapture, EnableMouseCapture, Event, KeyCode, KeyModifiers,
-    },
-    execute,
-    terminal::{
-        disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen,
-    },
-};
-use ratatui::{
-    backend::{Backend, CrosstermBackend},
-    layout::{Constraint, Direction, Layout},
-    style::{Color, Style},
-    text::{Line, Span},
-    widgets::{Block, Borders, Paragraph},
-    Frame, Terminal,
-};
-
-use canvas::{
-    canvas::{
-        gui::render_canvas_default,
-        modes::{AppMode, ModeManager, HighlightState},
-    },
-    DataProvider, FormEditor,
-};
-
-/// Update cursor style based on current AppMode
-fn update_cursor_for_mode(mode: AppMode) -> io::Result<()> {
-    let style = match mode {
-        AppMode::Edit => SetCursorStyle::SteadyBar,           // Thin line for insert mode
-        AppMode::ReadOnly => SetCursorStyle::SteadyBlock,     // Block for normal mode  
-        AppMode::Highlight => SetCursorStyle::BlinkingBlock,  // Blinking block for visual mode
-        AppMode::General => SetCursorStyle::SteadyBlock,      // Block for general mode
-        AppMode::Command => SetCursorStyle::SteadyUnderScore, // Underscore for command mode
-    };
-    
-    execute!(io::stdout(), style)
-}
-
-// Enhanced FormEditor that adds visual mode and status tracking
-struct EnhancedFormEditor<D: DataProvider> {
-    editor: FormEditor<D>,
-    highlight_state: HighlightState,
-    has_unsaved_changes: bool,
-    debug_message: String,
-    command_buffer: String, // For multi-key vim commands like "gg"
-}
-
-impl<D: DataProvider> EnhancedFormEditor<D> {
-    fn new(data_provider: D) -> Self {
-        Self {
-            editor: FormEditor::new(data_provider),
-            highlight_state: HighlightState::Off,
-            has_unsaved_changes: false,
-            debug_message: "Full Canvas Demo - All features enabled".to_string(),
-            command_buffer: String::new(),
-        }
-    }
-
-    // === COMMAND BUFFER HANDLING ===
-
-    fn clear_command_buffer(&mut self) {
-        self.command_buffer.clear();
-    }
-
-    fn add_to_command_buffer(&mut self, ch: char) {
-        self.command_buffer.push(ch);
-    }
-
-    fn get_command_buffer(&self) -> &str {
-        &self.command_buffer
-    }
-
-    fn has_pending_command(&self) -> bool {
-        !self.command_buffer.is_empty()
-    }
-
-    // === VISUAL/HIGHLIGHT MODE SUPPORT ===
-
-    fn enter_visual_mode(&mut self) {
-        if ModeManager::can_enter_highlight_mode(self.editor.mode()) {
-            self.editor.set_mode(AppMode::Highlight);
-            self.highlight_state = HighlightState::Characterwise {
-                anchor: (
-                    self.editor.current_field(),
-                    self.editor.cursor_position(),
-                ),
-            };
-            self.debug_message = "-- VISUAL --".to_string();
-        }
-    }
-
-    fn enter_visual_line_mode(&mut self) {
-        if ModeManager::can_enter_highlight_mode(self.editor.mode()) {
-            self.editor.set_mode(AppMode::Highlight);
-            self.highlight_state =
-                HighlightState::Linewise { anchor_line: self.editor.current_field() };
-            self.debug_message = "-- VISUAL LINE --".to_string();
-        }
-    }
-
-    fn exit_visual_mode(&mut self) {
-        self.highlight_state = HighlightState::Off;
-        if self.editor.mode() == AppMode::Highlight {
-            self.editor.set_mode(AppMode::ReadOnly);
-            self.debug_message = "Visual mode exited".to_string();
-        }
-    }
-
-    fn update_visual_selection(&mut self) {
-        if self.editor.mode() == AppMode::Highlight {
-            match &self.highlight_state {
-                HighlightState::Characterwise { anchor: _ } => {
-                    self.debug_message = format!(
-                        "Visual selection: char {} in field {}",
-                        self.editor.cursor_position(),
-                        self.editor.current_field()
-                    );
-                }
-                HighlightState::Linewise { anchor_line: _ } => {
-                    self.debug_message = format!(
-                        "Visual line selection: field {}",
-                        self.editor.current_field()
-                    );
-                }
-                _ => {}
-            }
-        }
-    }
-
-    // === ENHANCED MOVEMENT WITH VISUAL UPDATES ===
-
-    fn move_left(&mut self) {
-        self.editor.move_left();
-        self.update_visual_selection();
-    }
-
-    fn move_right(&mut self) {
-        self.editor.move_right();
-        self.update_visual_selection();
-    }
-
-    fn move_up(&mut self) {
-        self.editor.move_up();
-        self.update_visual_selection();
-    }
-
-    fn move_down(&mut self) {
-        self.editor.move_down();
-        self.update_visual_selection();
-    }
-
-    fn move_word_next(&mut self) {
-        self.editor.move_word_next();
-        self.update_visual_selection();
-    }
-
-    fn move_word_prev(&mut self) {
-        self.editor.move_word_prev();
-        self.update_visual_selection();
-    }
-
-    fn move_word_end(&mut self) {
-        self.editor.move_word_end();
-        self.update_visual_selection();
-    }
-
-    fn move_word_end_prev(&mut self) {
-        self.editor.move_word_end_prev();
-        self.update_visual_selection();
-    }
-
-    fn move_line_start(&mut self) {
-        self.editor.move_line_start();
-        self.update_visual_selection();
-    }
-
-    fn move_line_end(&mut self) {
-        self.editor.move_line_end();
-        self.update_visual_selection();
-    }
-
-    fn move_first_line(&mut self) {
-        self.editor.move_first_line();
-        self.update_visual_selection();
-    }
-
-    fn move_last_line(&mut self) {
-        self.editor.move_last_line();
-        self.update_visual_selection();
-    }
-
-    fn prev_field(&mut self) {
-        self.editor.prev_field();
-        self.update_visual_selection();
-    }
-
-    fn next_field(&mut self) {
-        self.editor.next_field();
-        self.update_visual_selection();
-    }
-
-    // === DELETE OPERATIONS ===
-
-    fn delete_backward(&mut self) -> anyhow::Result<()> {
-        let result = self.editor.delete_backward();
-        if result.is_ok() {
-            self.has_unsaved_changes = true;
-            self.debug_message = "Deleted character backward".to_string();
-        }
-        Ok(result?)
-    }
-
-    fn delete_forward(&mut self) -> anyhow::Result<()> {
-        let result = self.editor.delete_forward();
-        if result.is_ok() {
-            self.has_unsaved_changes = true;
-            self.debug_message = "Deleted character forward".to_string();
-        }
-        Ok(result?)
-    }
-
-    // === MODE TRANSITIONS ===
-
-    fn enter_edit_mode(&mut self) {
-        self.editor.enter_edit_mode();
-        self.debug_message = "-- INSERT --".to_string();
-    }
-
-    fn exit_edit_mode(&mut self) {
-        self.editor.exit_edit_mode();
-        self.exit_visual_mode();
-        self.debug_message = "".to_string();
-    }
-
-    fn insert_char(&mut self, ch: char) -> anyhow::Result<()> {
-        let result = self.editor.insert_char(ch);
-        if result.is_ok() {
-            self.has_unsaved_changes = true;
-        }
-        Ok(result?)
-    }
-
-    // === DELEGATE TO ORIGINAL EDITOR ===
-
-    fn current_field(&self) -> usize {
-        self.editor.current_field()
-    }
-
-    fn cursor_position(&self) -> usize {
-        self.editor.cursor_position()
-    }
-
-    fn mode(&self) -> AppMode {
-        self.editor.mode()
-    }
-
-    fn current_text(&self) -> &str {
-        self.editor.current_text()
-    }
-
-    fn data_provider(&self) -> &D {
-        self.editor.data_provider()
-    }
-
-    fn ui_state(&self) -> &canvas::EditorState {
-        self.editor.ui_state()
-    }
-
-    fn set_mode(&mut self, mode: AppMode) {
-        self.editor.set_mode(mode);
-        if mode != AppMode::Highlight {
-            self.exit_visual_mode();
-        }
-    }
-
-    // === STATUS AND DEBUG ===
-
-    fn set_debug_message(&mut self, msg: String) {
-        self.debug_message = msg;
-    }
-
-    fn debug_message(&self) -> &str {
-        &self.debug_message
-    }
-
-    fn highlight_state(&self) -> &HighlightState {
-        &self.highlight_state
-    }
-
-    fn has_unsaved_changes(&self) -> bool {
-        self.has_unsaved_changes
-    }
-}
-
-// Demo form data with interesting text for word movement
-struct FullDemoData {
-    fields: Vec<(String, String)>,
-}
-
-impl FullDemoData {
-    fn new() -> Self {
-        Self {
-            fields: vec![
-                ("Name".to_string(), "John-Paul McDonald".to_string()),
-                (
-                    "Email".to_string(),
-                    "user@example-domain.com".to_string(),
-                ),
-                ("Phone".to_string(), "+1 (555) 123-4567".to_string()),
-                ("Address".to_string(), "123 Main St, Apt 4B".to_string()),
-                (
-                    "Tags".to_string(),
-                    "urgent,important,follow-up".to_string(),
-                ),
-                (
-                    "Notes".to_string(),
-                    "This is a sample note with multiple words, punctuation! And symbols @#$"
-                        .to_string(),
-                ),
-            ],
-        }
-    }
-}
-
-impl DataProvider for FullDemoData {
-    fn field_count(&self) -> usize {
-        self.fields.len()
-    }
-
-    fn field_name(&self, index: usize) -> &str {
-        &self.fields[index].0
-    }
-
-    fn field_value(&self, index: usize) -> &str {
-        &self.fields[index].1
-    }
-
-    fn set_field_value(&mut self, index: usize, value: String) {
-        self.fields[index].1 = value;
-    }
-
-    fn supports_suggestions(&self, _field_index: usize) -> bool {
-        false
-    }
-
-    fn display_value(&self, _index: usize) -> Option<&str> {
-        None
-    }
-}
-
-/// Full vim-like key handling using the native FormEditor API
-fn handle_key_press(
-    key: KeyCode,
-    modifiers: KeyModifiers,
-    editor: &mut EnhancedFormEditor<FullDemoData>,
-) -> anyhow::Result<bool> {
-    let old_mode = editor.mode(); // Store mode before processing
-
-    // Quit handling
-    if (key == KeyCode::Char('q') && modifiers.contains(KeyModifiers::CONTROL))
-        || (key == KeyCode::Char('c') && modifiers.contains(KeyModifiers::CONTROL))
-        || key == KeyCode::F(10)
-    {
-        return Ok(false);
-    }
-
-    match (old_mode, key, modifiers) {
-        // === MODE TRANSITIONS ===
-        (AppMode::ReadOnly, KeyCode::Char('i'), _) => {
-            editor.enter_edit_mode();
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly, KeyCode::Char('a'), _) => {
-            editor.move_right(); // Move after current character
-            editor.enter_edit_mode();
-            editor.set_debug_message("-- INSERT -- (append)".to_string());
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly, KeyCode::Char('A'), _) => {
-            editor.move_line_end();
-            editor.enter_edit_mode();
-            editor.set_debug_message("-- INSERT -- (end of line)".to_string());
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly, KeyCode::Char('o'), _) => {
-            editor.move_line_end();
-            editor.enter_edit_mode();
-            editor.set_debug_message("-- INSERT -- (open line)".to_string());
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly, KeyCode::Char('v'), _) => {
-            editor.enter_visual_mode();
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly, KeyCode::Char('V'), _) => {
-            editor.enter_visual_line_mode();
-            editor.clear_command_buffer();
-        }
-        (_, KeyCode::Esc, _) => {
-            editor.exit_edit_mode();
-            editor.clear_command_buffer();
-        }
-
-        // === MOVEMENT: VIM-STYLE NAVIGATION ===
-
-        // Basic movement (hjkl and arrows)
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('h'), _)
-        | (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Left, _) => {
-            editor.move_left();
-            editor.set_debug_message("← left".to_string());
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('l'), _)
-        | (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Right, _) => {
-            editor.move_right();
-            editor.set_debug_message("→ right".to_string());
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('j'), _)
-        | (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Down, _) => {
-            editor.move_down();
-            editor.set_debug_message("↓ next field".to_string());
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('k'), _)
-        | (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Up, _) => {
-            editor.move_up();
-            editor.set_debug_message("↑ previous field".to_string());
-            editor.clear_command_buffer();
-        }
-
-        // Word movement - Full vim word navigation
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('w'), _) => {
-            editor.move_word_next();
-            editor.set_debug_message("w: next word start".to_string());
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('b'), _) => {
-            editor.move_word_prev();
-            editor.set_debug_message("b: previous word start".to_string());
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('e'), _) => {
-            editor.move_word_end();
-            editor.set_debug_message("e: word end".to_string());
-            editor.clear_command_buffer();
-        }
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('W'), _) => {
-            editor.move_word_end_prev();
-            editor.set_debug_message("W: previous word end".to_string());
-            editor.clear_command_buffer();
-        }
-
-        // Line movement
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('0'), _)
-        | (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Home, _) => {
-            editor.move_line_start();
-            editor.set_debug_message("0: line start".to_string());
-        }
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('$'), _)
-        | (AppMode::ReadOnly | AppMode::Highlight, KeyCode::End, _) => {
-            editor.move_line_end();
-            editor.set_debug_message("$: line end".to_string());
-        }
-
-        // Field/document movement
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('g'), _) => {
-            if editor.get_command_buffer() == "g" {
-                // Second 'g' - execute "gg" command
-                editor.move_first_line();
-                editor.set_debug_message("gg: first field".to_string());
-                editor.clear_command_buffer();
-            } else {
-                // First 'g' - start command buffer
-                editor.clear_command_buffer();
-                editor.add_to_command_buffer('g');
-                editor.set_debug_message("g".to_string());
-            }
-        }
-        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('G'), _) => {
-            editor.move_last_line();
-            editor.set_debug_message("G: last field".to_string());
-            editor.clear_command_buffer();
-        }
-
-        // === EDIT MODE MOVEMENT ===
-        (AppMode::Edit, KeyCode::Left, m) if m.contains(KeyModifiers::CONTROL) => {
-            editor.move_word_prev();
-            editor.set_debug_message("Ctrl+← word back".to_string());
-        }
-        (AppMode::Edit, KeyCode::Right, m) if m.contains(KeyModifiers::CONTROL) => {
-            editor.move_word_next();
-            editor.set_debug_message("Ctrl+→ word forward".to_string());
-        }
-        (AppMode::Edit, KeyCode::Left, _) => {
-            editor.move_left();
-        }
-        (AppMode::Edit, KeyCode::Right, _) => {
-            editor.move_right();
-        }
-        (AppMode::Edit, KeyCode::Up, _) => {
-            editor.move_up();
-        }
-        (AppMode::Edit, KeyCode::Down, _) => {
-            editor.move_down();
-        }
-        (AppMode::Edit, KeyCode::Home, _) => {
-            editor.move_line_start();
-        }
-        (AppMode::Edit, KeyCode::End, _) => {
-            editor.move_line_end();
-        }
-
-        // === DELETE OPERATIONS ===
-        (AppMode::Edit, KeyCode::Backspace, _) => {
-            editor.delete_backward()?;
-        }
-        (AppMode::Edit, KeyCode::Delete, _) => {
-            editor.delete_forward()?;
-        }
-
-        // Delete operations in normal mode (vim x)
-        (AppMode::ReadOnly, KeyCode::Char('x'), _) => {
-            editor.delete_forward()?;
-            editor.set_debug_message("x: deleted character".to_string());
-        }
-        (AppMode::ReadOnly, KeyCode::Char('X'), _) => {
-            editor.delete_backward()?;
-            editor.set_debug_message("X: deleted character backward".to_string());
-        }
-
-        // === TAB NAVIGATION ===
-        (_, KeyCode::Tab, _) => {
-            editor.next_field();
-            editor.set_debug_message("Tab: next field".to_string());
-        }
-        (_, KeyCode::BackTab, _) => {
-            editor.prev_field();
-            editor.set_debug_message("Shift+Tab: previous field".to_string());
-        }
-
-        // === CHARACTER INPUT ===
-        (AppMode::Edit, KeyCode::Char(c), m) if !m.contains(KeyModifiers::CONTROL) => {
-            editor.insert_char(c)?;
-        }
-
-        // === DEBUG/INFO COMMANDS ===
-        (AppMode::ReadOnly, KeyCode::Char('?'), _) => {
-            editor.set_debug_message(format!(
-                "Field {}/{}, Pos {}, Mode: {:?}",
-                editor.current_field() + 1,
-                editor.data_provider().field_count(),
-                editor.cursor_position(),
-                editor.mode()
-            ));
-        }
-
-        _ => {
-            // If we have a pending command and this key doesn't complete it, clear the buffer
-            if editor.has_pending_command() {
-                editor.clear_command_buffer();
-                editor.set_debug_message("Invalid command sequence".to_string());
-            } else {
-                editor.set_debug_message(format!(
-                    "Unhandled: {:?} + {:?} in {:?} mode",
-                    key, modifiers, old_mode
-                ));
-            }
-        }
-    }
-
-    // Update cursor if mode changed
-    let new_mode = editor.mode();
-    if old_mode != new_mode {
-        update_cursor_for_mode(new_mode)?;
-    }
-
-    Ok(true)
-}
-
-fn run_app<B: Backend>(
-    terminal: &mut Terminal<B>,
-    mut editor: EnhancedFormEditor<FullDemoData>,
-) -> io::Result<()> {
-    loop {
-        terminal.draw(|f| ui(f, &editor))?;
-
-        if let Event::Key(key) = event::read()? {
-            match handle_key_press(key.code, key.modifiers, &mut editor) {
-                Ok(should_continue) => {
-                    if !should_continue {
-                        break;
-                    }
-                }
-                Err(e) => {
-                    editor.set_debug_message(format!("Error: {}", e));
-                }
-            }
-        }
-    }
-
-    Ok(())
-}
-
-fn ui(f: &mut Frame, editor: &EnhancedFormEditor<FullDemoData>) {
-    let chunks = Layout::default()
-        .direction(Direction::Vertical)
-        .constraints([Constraint::Min(8), Constraint::Length(8)])
-        .split(f.area());
-
-    render_enhanced_canvas(f, chunks[0], editor);
-    render_status_and_help(f, chunks[1], editor);
-}
-
-fn render_enhanced_canvas(
-    f: &mut Frame,
-    area: ratatui::layout::Rect,
-    editor: &EnhancedFormEditor<FullDemoData>,
-) {
-    render_canvas_default(f, area, &editor.editor);
-}
-
-fn render_status_and_help(
-    f: &mut Frame,
-    area: ratatui::layout::Rect,
-    editor: &EnhancedFormEditor<FullDemoData>,
-) {
-    let chunks = Layout::default()
-        .direction(Direction::Vertical)
-        .constraints([Constraint::Length(3), Constraint::Length(5)])
-        .split(area);
-
-    // Status bar
-    let mode_text = match editor.mode() {
-        AppMode::Edit => "INSERT",
-        AppMode::ReadOnly => "NORMAL",
-        AppMode::Highlight => match editor.highlight_state() {
-            HighlightState::Characterwise { .. } => "VISUAL",
-            HighlightState::Linewise { .. } => "VISUAL LINE",
-            _ => "VISUAL",
-        },
-        _ => "NORMAL",
-    };
-
-    let status_text = if editor.has_pending_command() {
-        format!("-- {} -- {} [{}]", mode_text, editor.debug_message(), editor.get_command_buffer())
-    } else if editor.has_unsaved_changes() {
-        format!("-- {} -- [Modified] {}", mode_text, editor.debug_message())
-    } else {
-        format!("-- {} -- {}", mode_text, editor.debug_message())
-    };
-
-    let status = Paragraph::new(Line::from(Span::raw(status_text)))
-        .block(Block::default().borders(Borders::ALL).title("Status"));
-
-    f.render_widget(status, chunks[0]);
-
-    // Help text
-    let help_text = match editor.mode() {
-        AppMode::ReadOnly => {
-            if editor.has_pending_command() {
-                match editor.get_command_buffer() {
-                    "g" => "Press 'g' again for first field, or any other key to cancel",
-                    _ => "Pending command... (Esc to cancel)"
-                }
-            } else {
-                "Normal: hjkl/arrows=move, w/b/e=words, 0/$=line, gg/G=first/last, i/a/A=insert, v/V=visual, x/X=delete, ?=info"
-            }
-        }
-        AppMode::Edit => {
-            "Insert: arrows=move, Ctrl+arrows=words, Backspace/Del=delete, Esc=normal, Tab/Shift+Tab=fields"
-        }
-        AppMode::Highlight => {
-            "Visual: hjkl/arrows=extend selection, w/b/e=word selection, Esc=normal"
-        }
-        _ => "Press ? for help"
-    };
-
-    let help = Paragraph::new(Line::from(Span::raw(help_text)))
-        .block(Block::default().borders(Borders::ALL).title("Commands"))
-        .style(Style::default().fg(Color::Gray));
-
-    f.render_widget(help, chunks[1]);
-}
-
-fn main() -> Result<(), Box<dyn std::error::Error>> {
-    enable_raw_mode()?;
-    let mut stdout = io::stdout();
-    execute!(stdout, EnterAlternateScreen, EnableMouseCapture)?;
-    let backend = CrosstermBackend::new(stdout);
-    let mut terminal = Terminal::new(backend)?;
-
-    let data = FullDemoData::new();
-    let mut editor = EnhancedFormEditor::new(data);
-    editor.set_mode(AppMode::ReadOnly); // Start in normal mode
-    
-    // Set initial cursor style
-    update_cursor_for_mode(editor.mode())?;
-
-    let res = run_app(&mut terminal, editor);
-
-    // Reset cursor style on exit
-    execute!(io::stdout(), SetCursorStyle::DefaultUserShape)?;
-
-    disable_raw_mode()?;
-    execute!(
-        terminal.backend_mut(),
-        LeaveAlternateScreen,
-        DisableMouseCapture
-    )?;
-    terminal.show_cursor()?;
-
-    if let Err(err) = res {
-        println!("{:?}", err);
-    }
-
-    Ok(())
-}
--- a/canvas/examples/suggestions.rs
+++ b/canvas/examples/suggestions.rs
--- a/canvas/examples/suggestions2.rs
+++ b/canvas/examples/suggestions2.rs
@@ -1,7 +1,11 @@
 // examples/suggestions2.rs
-//! Demonstrates automatic cursor management + MULTIPLE SUGGESTION FIELDS
+//! Production-ready Tab-triggered suggestions demonstration
 //!
-//! This example REQUIRES the `cursor-style` feature to compile.
+//! This example demonstrates:
+//! - Tab-triggered suggestions dropdown
+//! - Non-blocking architecture for real network/database calls
+//! - Multiple suggestion field types
+//! - Professional-grade user experience
 //!
 //! Run with:
 //! cargo run --example suggestions2 --features "gui,cursor-style,suggestions"
@@ -35,7 +39,7 @@ use ratatui::{
 use canvas::{
    canvas::{
        gui::render_canvas_default,
-        modes::{AppMode, ModeManager, HighlightState},
+        modes::AppMode,
        CursorManager, // This import only exists when cursor-style feature is enabled
    },
    suggestions::gui::render_suggestions_dropdown,
@@ -45,7 +49,7 @@ use canvas::{
 use async_trait::async_trait;
 use anyhow::Result;

-// Enhanced FormEditor that demonstrates automatic cursor management + SUGGESTIONS
+// Enhanced FormEditor that demonstrates professional suggestions architecture
 struct AutoCursorFormEditor<D: DataProvider> {
    editor: FormEditor<D>,
    has_unsaved_changes: bool,
@@ -58,11 +62,15 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
        Self {
            editor: FormEditor::new(data_provider),
            has_unsaved_changes: false,
-            debug_message: "🎯 Multi-Field Suggestions Demo - 5 fields with different suggestions!".to_string(),
+            debug_message: "🚀 Production-Ready Tab-Triggered Suggestions Demo - Copy this architecture for your app!".to_string(),
            command_buffer: String::new(),
        }
    }

+    fn close_suggestions(&mut self) {
+        self.editor.close_suggestions();
+    }
+
    // === COMMAND BUFFER HANDLING ===

    fn clear_command_buffer(&mut self) {
@@ -84,19 +92,16 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
    // === VISUAL/HIGHLIGHT MODE SUPPORT ===

    fn enter_visual_mode(&mut self) {
-        // Use the library method instead of manual state setting
        self.editor.enter_highlight_mode();
        self.debug_message = "🔥 VISUAL MODE - Cursor: Blinking Block █".to_string();
    }

    fn enter_visual_line_mode(&mut self) {
-        // Use the library method instead of manual state setting
        self.editor.enter_highlight_line_mode();
        self.debug_message = "🔥 VISUAL LINE MODE - Cursor: Blinking Block █".to_string();
    }

    fn exit_visual_mode(&mut self) {
-        // Use the library method
        self.editor.exit_highlight_mode();
        self.debug_message = "🔒 NORMAL MODE - Cursor: Steady Block █".to_string();
    }
@@ -128,12 +133,12 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
    // === ENHANCED MOVEMENT WITH VISUAL UPDATES ===

    fn move_left(&mut self) {
-        self.editor.move_left();
+        let _ = self.editor.move_left();
        self.update_visual_selection();
    }

    fn move_right(&mut self) {
-        self.editor.move_right();
+        let _ = self.editor.move_right();
        self.update_visual_selection();
    }

@@ -178,12 +183,12 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
    }

    fn move_first_line(&mut self) {
-        self.editor.move_first_line();
+        let _ = self.editor.move_first_line();
        self.update_visual_selection();
    }

    fn move_last_line(&mut self) {
-        self.editor.move_last_line();
+        let _ = self.editor.move_last_line();
        self.update_visual_selection();
    }

@@ -205,7 +210,7 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
            self.has_unsaved_changes = true;
            self.debug_message = "⌫ Deleted character backward".to_string();
        }
-        Ok(result?)
+        result
    }

    fn delete_forward(&mut self) -> anyhow::Result<()> {
@@ -214,7 +219,7 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
            self.has_unsaved_changes = true;
            self.debug_message = "⌦ Deleted character forward".to_string();
        }
-        Ok(result?)
+        result
    }

    // === SUGGESTIONS CONTROL WRAPPERS ===
@@ -223,20 +228,16 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
        self.editor.open_suggestions(field_index);
    }

-    fn close_suggestions(&mut self) {
-        self.editor.close_suggestions();
-    }
-
    // === MODE TRANSITIONS WITH AUTOMATIC CURSOR MANAGEMENT ===

    fn enter_edit_mode(&mut self) {
        self.editor.enter_edit_mode(); // 🎯 Library automatically sets cursor to bar |
-        self.debug_message = "✏️  INSERT MODE - Cursor: Steady Bar |".to_string();
+        self.debug_message = "✏️  INSERT MODE - Cursor: Steady Bar | - Press Tab for suggestions".to_string();
    }

    fn enter_append_mode(&mut self) {
        self.editor.enter_append_mode(); // 🎯 Library automatically positions cursor and sets mode
-        self.debug_message = "✏️  INSERT (append) - Cursor: Steady Bar |".to_string();
+        self.debug_message = "✏️  INSERT (append) - Cursor: Steady Bar | - Press Tab for suggestions".to_string();
    }

    fn exit_edit_mode(&mut self) {
@@ -250,16 +251,42 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
        if result.is_ok() {
            self.has_unsaved_changes = true;
        }
-        Ok(result?)
+        result
    }

-    // === SUGGESTIONS SUPPORT ===
+    // === PRODUCTION-READY NON-BLOCKING SUGGESTIONS ===

-    async fn trigger_suggestions<A>(&mut self, provider: &mut A) -> anyhow::Result<()>
-    where
-        A: SuggestionsProvider,
-    {
-        self.editor.trigger_suggestions(provider).await
+    /// Trigger suggestions with non-blocking approach (production pattern)
+    ///
+    /// This method demonstrates the proper way to integrate suggestions with
+    /// real APIs, databases, or any async data source without blocking the UI.
+    async fn trigger_suggestions_async(
+        &mut self,
+        provider: &mut ProductionSuggestionsProvider,
+        field_index: usize,
+    ) {
+        // Step 1: Start loading immediately (UI updates instantly)
+        if let Some(query) = self.editor.start_suggestions(field_index) {
+            // Step 2: Fetch from your data source (API, database, etc.)
+            match provider.fetch_suggestions(field_index, &query).await {
+                Ok(results) => {
+                    // Step 3: Apply results with built-in stale protection
+                    let applied = self.editor.apply_suggestions_result(field_index, &query, results);
+                    if applied {
+                        self.editor.update_inline_completion();
+                        if self.editor.suggestions().is_empty() {
+                            self.set_debug_message(format!("🔍 No matches for '{query}'"));
+                        } else {
+                            self.set_debug_message(format!("✨ {} matches for '{}'", self.editor.suggestions().len(), query));
+                        }
+                    }
+                    // If not applied, results were stale (user kept typing)
+                }
+                Err(e) => {
+                    self.set_debug_message(format!("❌ Suggestion error: {e}"));
+                }
+            }
+        }
    }

    fn suggestions_next(&mut self) {
@@ -284,16 +311,13 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {

    // === MANUAL CURSOR OVERRIDE DEMONSTRATION ===

-    /// Demonstrate manual cursor control (for advanced users)
    fn demo_manual_cursor_control(&mut self) -> std::io::Result<()> {
-        // Users can still manually control cursor if needed
        CursorManager::update_for_mode(AppMode::Command)?;
        self.debug_message = "🔧 Manual override: Command cursor _".to_string();
        Ok(())
    }

    fn restore_automatic_cursor(&mut self) -> std::io::Result<()> {
-        // Restore automatic cursor based on current mode
        CursorManager::update_for_mode(self.editor.mode())?;
        self.debug_message = "🎯 Restored automatic cursor management".to_string();
        Ok(())
@@ -314,7 +338,8 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
    }

    fn current_text(&self) -> &str {
-        self.editor.current_text()
+        let field_index = self.editor.current_field();
+        self.editor.data_provider().field_value(field_index)
    }

    fn data_provider(&self) -> &D {
@@ -348,28 +373,28 @@ impl<D: DataProvider> AutoCursorFormEditor<D> {
 }

 // ===================================================================
-// MULTI-FIELD DEMO DATA - 5 different types of suggestion fields
+// PRODUCTION DATA MODEL - Copy this pattern for your application
 // ===================================================================

-struct MultiFieldDemoData {
+struct ApplicationData {
    fields: Vec<(String, String)>,
 }

-impl MultiFieldDemoData {
+impl ApplicationData {
    fn new() -> Self {
        Self {
            fields: vec![
-                ("🍎 Favorite Fruit".to_string(), "".to_string()),           // Field 0: Fruits
-                ("💼 Job Role".to_string(), "".to_string()),                 // Field 1: Jobs
-                ("💻 Programming Language".to_string(), "".to_string()),     // Field 2: Languages
-                ("🌍 Country".to_string(), "".to_string()),                  // Field 3: Countries
-                ("🎨 Favorite Color".to_string(), "".to_string()),           // Field 4: Colors
+                ("🍎 Favorite Fruit".to_string(), "".to_string()),
+                ("💼 Job Role".to_string(), "".to_string()),
+                ("💻 Programming Language".to_string(), "".to_string()),
+                ("🌍 Country".to_string(), "".to_string()),
+                ("🎨 Favorite Color".to_string(), "".to_string()),
            ],
        }
    }
 }

-impl DataProvider for MultiFieldDemoData {
+impl DataProvider for ApplicationData {
    fn field_count(&self) -> usize {
        self.fields.len()
    }
@@ -387,7 +412,7 @@ impl DataProvider for MultiFieldDemoData {
    }

    fn supports_suggestions(&self, field_index: usize) -> bool {
-        // All 5 fields support suggestions - perfect for testing!
+        // Configure which fields support suggestions
        field_index < 5
    }

@@ -397,36 +422,74 @@ impl DataProvider for MultiFieldDemoData {
 }

 // ===================================================================
-// COMPREHENSIVE SUGGESTIONS PROVIDER - 5 different suggestion types!
+// PRODUCTION SUGGESTIONS PROVIDER - Copy this pattern for your APIs
 // ===================================================================

-struct ComprehensiveSuggestionsProvider;
+/// Production-ready suggestions provider
+///
+/// Replace the data sources below with your actual:
+/// - REST API calls (reqwest, hyper)
+/// - Database queries (sqlx, diesel)
+/// - Search engines (elasticsearch, algolia)
+/// - Cache lookups (redis, memcached)
+/// - GraphQL queries
+/// - gRPC services
+///
+/// The non-blocking architecture works with any async data source.
+struct ProductionSuggestionsProvider {
+    // Add your API clients, database connections, cache clients here
+    // Example:
+    // api_client: reqwest::Client,
+    // db_pool: sqlx::PgPool,
+    // cache: redis::Client,
+}

-impl ComprehensiveSuggestionsProvider {
+impl ProductionSuggestionsProvider {
    fn new() -> Self {
-        Self
+        Self {
+            // Initialize your clients here
+            // api_client: reqwest::Client::new(),
+            // db_pool: create_db_pool().await,
+            // cache: redis::Client::open("redis://localhost").unwrap(),
+        }
    }

-    /// Get fruit suggestions (field 0)
-    fn get_fruit_suggestions(&self, query: &str) -> Vec<SuggestionItem> {
+    /// Get fruit suggestions (replace with your API call)
+    async fn get_fruit_suggestions(&self, query: &str) -> Result<Vec<SuggestionItem>> {
+        // Example: Replace with actual API call
+        // let response = self.api_client
+        //     .get(&format!("https://api.example.com/fruits?q={}", query))
+        //     .send()
+        //     .await?;
+        // let fruits: Vec<Fruit> = response.json().await?;
+
        let fruits = vec![
            ("Apple", "🍎 Crisp and sweet"),
            ("Banana", "🍌 Rich in potassium"),
            ("Cherry", "🍒 Small and tart"),
            ("Date", "📅 Sweet and chewy"),
+            ("Ananas", "🍎 Crisp and sweet"),
            ("Elderberry", "🫐 Dark purple berry"),
            ("Fig", "🍇 Sweet Mediterranean fruit"),
            ("Grape", "🍇 Perfect for wine"),
            ("Honeydew", "🍈 Sweet melon"),
-            ("Ananas", "🍎 Crisp and sweet"),
-            ("Avocado", "🍈 Sweet melon"),
+            ("avocado", "🍎 Crisp and sweet"),
        ];

-        self.filter_suggestions(fruits, query, "fruit")
+        Ok(self.filter_suggestions(fruits, query))
    }

-    /// Get job role suggestions (field 1)
-    fn get_job_suggestions(&self, query: &str) -> Vec<SuggestionItem> {
+    /// Get job suggestions (replace with your database query)
+    async fn get_job_suggestions(&self, query: &str) -> Result<Vec<SuggestionItem>> {
+        // Example: Replace with actual database query
+        // let jobs = sqlx::query_as!(
+        //     JobRow,
+        //     "SELECT title, description FROM jobs WHERE title ILIKE $1 LIMIT 10",
+        //     format!("%{}%", query)
+        // )
+        // .fetch_all(&self.db_pool)
+        // .await?;
+
        let jobs = vec![
            ("Software Engineer", "👨‍💻 Build applications"),
            ("Product Manager", "📋 Manage product roadmap"),
@@ -438,11 +501,17 @@ impl ComprehensiveSuggestionsProvider {
            ("Accountant", "💼 Manage finances"),
        ];

-        self.filter_suggestions(jobs, query, "role")
+        Ok(self.filter_suggestions(jobs, query))
    }

-    /// Get programming language suggestions (field 2)
-    fn get_language_suggestions(&self, query: &str) -> Vec<SuggestionItem> {
+    /// Get language suggestions (replace with your cache lookup)
+    async fn get_language_suggestions(&self, query: &str) -> Result<Vec<SuggestionItem>> {
+        // Example: Replace with cache lookup + fallback to API
+        // let cached = self.cache.get(&format!("langs:{}", query)).await?;
+        // if let Some(cached_result) = cached {
+        //     return Ok(serde_json::from_str(&cached_result)?);
+        // }
+
        let languages = vec![
            ("Rust", "🦀 Systems programming"),
            ("Python", "🐍 Versatile and popular"),
@@ -454,11 +523,18 @@ impl ComprehensiveSuggestionsProvider {
            ("Swift", "🍎 iOS development"),
        ];

-        self.filter_suggestions(languages, query, "language")
+        Ok(self.filter_suggestions(languages, query))
    }

-    /// Get country suggestions (field 3)
-    fn get_country_suggestions(&self, query: &str) -> Vec<SuggestionItem> {
+    /// Get country suggestions (replace with your geographic API)
+    async fn get_country_suggestions(&self, query: &str) -> Result<Vec<SuggestionItem>> {
+        // Example: Replace with geographic API call
+        // let response = self.api_client
+        //     .get(&format!("https://restcountries.com/v3.1/name/{}", query))
+        //     .send()
+        //     .await?;
+        // let countries: Vec<Country> = response.json().await?;
+
        let countries = vec![
            ("United States", "🇺🇸 North America"),
            ("Canada", "🇨🇦 Great neighbors"),
@@ -470,11 +546,11 @@ impl ComprehensiveSuggestionsProvider {
            ("Brazil", "🇧🇷 Carnival country"),
        ];

-        self.filter_suggestions(countries, query, "country")
+        Ok(self.filter_suggestions(countries, query))
    }

-    /// Get color suggestions (field 4)
-    fn get_color_suggestions(&self, query: &str) -> Vec<SuggestionItem> {
+    /// Get color suggestions (local data)
+    async fn get_color_suggestions(&self, query: &str) -> Result<Vec<SuggestionItem>> {
        let colors = vec![
            ("Red", "🔴 Bold and energetic"),
            ("Blue", "🔵 Calm and trustworthy"),
@@ -486,11 +562,11 @@ impl ComprehensiveSuggestionsProvider {
            ("Black", "⚫ Classic and elegant"),
        ];

-        self.filter_suggestions(colors, query, "color")
+        Ok(self.filter_suggestions(colors, query))
    }

-    /// Generic filtering helper
-    fn filter_suggestions(&self, items: Vec<(&str, &str)>, query: &str, _category: &str) -> Vec<SuggestionItem> {
+    /// Generic filtering helper (reusable for any data source)
+    fn filter_suggestions(&self, items: Vec<(&str, &str)>, query: &str) -> Vec<SuggestionItem> {
        let query_lower = query.to_lowercase();

        items.iter()
@@ -498,7 +574,7 @@ impl ComprehensiveSuggestionsProvider {
                query.is_empty() || item.to_lowercase().starts_with(&query_lower)
            })
            .map(|(item, description)| SuggestionItem {
-                display_text: format!("{} - {}", item, description),
+                display_text: format!("{item} - {description}"),
                value_to_store: item.to_string(),
            })
            .collect()
@@ -506,38 +582,26 @@ impl ComprehensiveSuggestionsProvider {
 }

 #[async_trait]
-impl SuggestionsProvider for ComprehensiveSuggestionsProvider {
+impl SuggestionsProvider for ProductionSuggestionsProvider {
+    /// Main suggestions entry point - route to appropriate data source
    async fn fetch_suggestions(&mut self, field_index: usize, query: &str) -> Result<Vec<SuggestionItem>> {
-        // Simulate different network delays for different fields (realistic!)
-        let delay_ms = match field_index {
-            0 => 100, // Fruits: local data
-            1 => 200, // Jobs: medium API call
-            2 => 150, // Languages: cached data
-            3 => 300, // Countries: slow geographic API
-            4 => 80,  // Colors: instant local
-            _ => 100,
-        };
-        tokio::time::sleep(std::time::Duration::from_millis(delay_ms)).await;
-
-        let suggestions = match field_index {
-            0 => self.get_fruit_suggestions(query),
-            1 => self.get_job_suggestions(query),
-            2 => self.get_language_suggestions(query),
-            3 => self.get_country_suggestions(query),
-            4 => self.get_color_suggestions(query),
-            _ => Vec::new(),
-        };
-
-        Ok(suggestions)
+        match field_index {
+            0 => self.get_fruit_suggestions(query).await,      // API call
+            1 => self.get_job_suggestions(query).await,        // Database query
+            2 => self.get_language_suggestions(query).await,   // Cache + API
+            3 => self.get_country_suggestions(query).await,    // Geographic API
+            4 => self.get_color_suggestions(query).await,      // Local data
+            _ => Ok(Vec::new()),
+        }
    }
 }

-/// Multi-field suggestions demonstration + automatic cursor management
+/// Production-ready key handling with Tab-triggered suggestions
 async fn handle_key_press(
    key: KeyCode,
    modifiers: KeyModifiers,
-    editor: &mut AutoCursorFormEditor<MultiFieldDemoData>,
-    suggestions_provider: &mut ComprehensiveSuggestionsProvider,
+    editor: &mut AutoCursorFormEditor<ApplicationData>,
+    suggestions_provider: &mut ProductionSuggestionsProvider,
 ) -> anyhow::Result<bool> {
    let mode = editor.mode();

@@ -550,27 +614,16 @@ async fn handle_key_press(
    }

    match (mode, key, modifiers) {
-        // === SUGGESTIONS HANDLING ===
+        // === TAB-TRIGGERED SUGGESTIONS HANDLING ===
        (_, KeyCode::Tab, _) => {
            if editor.is_suggestions_active() {
                // Cycle through suggestions
                editor.suggestions_next();
                editor.set_debug_message("📍 Next suggestion".to_string());
            } else if editor.data_provider().supports_suggestions(editor.current_field()) {
-                // Open suggestions explicitly
-                editor.open_suggestions(editor.current_field());
-                match editor.trigger_suggestions(suggestions_provider).await {
-                    Ok(_) => {
-                        editor.update_inline_completion();
-                        editor.set_debug_message(format!(
-                            "✨ {} suggestions loaded",
-                            editor.suggestions().len()
-                        ));
-                    }
-                    Err(e) => {
-                        editor.set_debug_message(format!("❌ Suggestion error: {}", e));
-                    }
-                }
+                // Trigger non-blocking suggestions
+                let field_index = editor.current_field();
+                editor.trigger_suggestions_async(suggestions_provider, field_index).await;
            } else {
                editor.next_field();
                editor.set_debug_message("Tab: next field".to_string());
@@ -581,7 +634,7 @@ async fn handle_key_press(
        (_, KeyCode::Enter, _) => {
            if editor.is_suggestions_active() {
                if let Some(applied) = editor.apply_suggestion() {
-                    editor.set_debug_message(format!("✅ Selected: {}", applied));
+                    editor.set_debug_message(format!("✅ Selected: {applied}"));
                } else {
                    editor.set_debug_message("❌ No suggestion selected".to_string());
                }
@@ -589,7 +642,7 @@ async fn handle_key_press(
                editor.next_field();
                let field_names = ["Fruit", "Job", "Language", "Country", "Color"];
                let field_name = field_names.get(editor.current_field()).unwrap_or(&"Field");
-                editor.set_debug_message(format!("Enter: moved to {} field", field_name));
+                editor.set_debug_message(format!("Enter: moved to {field_name} field"));
            }
        }

@@ -613,26 +666,21 @@ async fn handle_key_press(
            }
        }

-        // === MODE TRANSITIONS WITH AUTOMATIC CURSOR MANAGEMENT ===
+        // === MODE TRANSITIONS (NO AUTO-SUGGESTIONS) ===
        (AppMode::ReadOnly, KeyCode::Char('i'), _) => {
-            editor.enter_edit_mode(); // 🎯 Automatic: cursor becomes bar |
+            editor.enter_edit_mode();
            editor.clear_command_buffer();
-
-            // Auto-show suggestions on entering insert mode
-            if editor.data_provider().supports_suggestions(editor.current_field()) {
-                let _ = editor.trigger_suggestions(suggestions_provider).await;
-                editor.update_inline_completion();
-            }
+            // For auto-suggestions on insert: add `editor.auto_trigger_suggestions(suggestions_provider).await;`
        }
        (AppMode::ReadOnly, KeyCode::Char('a'), _) => {
            editor.enter_append_mode();
-            editor.set_debug_message("✏️  INSERT (append) - Cursor: Steady Bar |".to_string());
+            editor.set_debug_message("✏️  INSERT (append) - Cursor: Steady Bar | - Press Tab for suggestions".to_string());
            editor.clear_command_buffer();
        }
        (AppMode::ReadOnly, KeyCode::Char('A'), _) => {
            editor.move_line_end();
-            editor.enter_edit_mode(); // 🎯 Automatic: cursor becomes bar |
-            editor.set_debug_message("✏️  INSERT (end of line) - Cursor: Steady Bar |".to_string());
+            editor.enter_edit_mode();
+            editor.set_debug_message("✏️  INSERT (end of line) - Cursor: Steady Bar | - Press Tab for suggestions".to_string());
            editor.clear_command_buffer();
        }

@@ -671,20 +719,18 @@ async fn handle_key_press(
        }
        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('j'), _)
        | (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Down, _) => {
-            editor.close_suggestions(); // ⬅ close dropdown
            editor.move_down();
            let field_names = ["Fruit", "Job", "Language", "Country", "Color"];
            let field_name = field_names.get(editor.current_field()).unwrap_or(&"Field");
-            editor.set_debug_message(format!("↓ moved to {} field", field_name));
+            editor.set_debug_message(format!("↓ moved to {field_name} field"));
            editor.clear_command_buffer();
        }
        (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Char('k'), _)
        | (AppMode::ReadOnly | AppMode::Highlight, KeyCode::Up, _) => {
-            editor.close_suggestions(); // ⬅ close dropdown
            editor.move_up();
            let field_names = ["Fruit", "Job", "Language", "Country", "Color"];
            let field_name = field_names.get(editor.current_field()).unwrap_or(&"Field");
-            editor.set_debug_message(format!("↑ moved to {} field", field_name));
+            editor.set_debug_message(format!("↑ moved to {field_name} field"));
            editor.clear_command_buffer();
        }

@@ -751,11 +797,9 @@ async fn handle_key_press(
            editor.move_right();
        }
        (AppMode::Edit, KeyCode::Up, _) => {
-            editor.close_suggestions();
            editor.move_up();
        }
        (AppMode::Edit, KeyCode::Down, _) => {
-            editor.close_suggestions();
            editor.move_down();
        }
        (AppMode::Edit, KeyCode::Home, _) => {
@@ -765,59 +809,23 @@ async fn handle_key_press(
            editor.move_line_end();
        }

-        // === DELETE OPERATIONS ===
+        // === DELETE OPERATIONS (AUTO-FETCH WHEN SUGGESTIONS ACTIVE) ===
        (AppMode::Edit, KeyCode::Backspace, _) => {
            editor.delete_backward()?;
-
-            // Update suggestions after deletion
-            if editor.data_provider().supports_suggestions(editor.current_field()) {
-                let current_text = editor.current_text().to_string();
-                if current_text.is_empty() {
-                    let _ = editor.trigger_suggestions(suggestions_provider).await;
-                    editor.set_debug_message(format!("✨ {} total suggestions", editor.suggestions().len()));
-                    editor.update_inline_completion();
-                } else {
-                    match editor.trigger_suggestions(suggestions_provider).await {
-                        Ok(_) => {
-                            if editor.suggestions().is_empty() {
-                                editor.set_debug_message(format!("🔍 No matches for '{}'", current_text));
-                            } else {
-                                editor.set_debug_message(format!("✨ {} matches for '{}'", editor.suggestions().len(), current_text));
-                            }
-                        }
-                        Err(e) => {
-                            editor.set_debug_message(format!("❌ Suggestion error: {}", e));
-                        }
-                    }
-                    editor.update_inline_completion();
-                }
+            // Auto-fetch only if suggestions are already active (triggered by Tab)
+            // For full auto-triggering: remove the `if` check below
+            if editor.is_suggestions_active() {
+                let field_index = editor.current_field();
+                editor.trigger_suggestions_async(suggestions_provider, field_index).await;
            }
        }
        (AppMode::Edit, KeyCode::Delete, _) => {
            editor.delete_forward()?;
-
-            // Update suggestions after deletion
-            if editor.data_provider().supports_suggestions(editor.current_field()) {
-                let current_text = editor.current_text().to_string();
-                if current_text.is_empty() {
-                    let _ = editor.trigger_suggestions(suggestions_provider).await;
-                    editor.set_debug_message(format!("✨ {} total suggestions", editor.suggestions().len()));
-                    editor.update_inline_completion();
-                } else {
-                    match editor.trigger_suggestions(suggestions_provider).await {
-                        Ok(_) => {
-                            if editor.suggestions().is_empty() {
-                                editor.set_debug_message(format!("🔍 No matches for '{}'", current_text));
-                            } else {
-                                editor.set_debug_message(format!("✨ {} matches for '{}'", editor.suggestions().len(), current_text));
-                            }
-                        }
-                        Err(e) => {
-                            editor.set_debug_message(format!("❌ Suggestion error: {}", e));
-                        }
-                    }
-                    editor.update_inline_completion();
-                }
+            // Auto-fetch only if suggestions are already active (triggered by Tab)
+            // For full auto-triggering: remove the `if` check below
+            if editor.is_suggestions_active() {
+                let field_index = editor.current_field();
+                editor.trigger_suggestions_async(suggestions_provider, field_index).await;
            }
        }

@@ -831,26 +839,14 @@ async fn handle_key_press(
            editor.set_debug_message("X: deleted character backward".to_string());
        }

-        // === CHARACTER INPUT WITH REAL-TIME SUGGESTIONS ===
+        // === CHARACTER INPUT (AUTO-FETCH WHEN SUGGESTIONS ACTIVE) ===
        (AppMode::Edit, KeyCode::Char(c), m) if !m.contains(KeyModifiers::CONTROL) => {
            editor.insert_char(c)?;
-
-            // Auto-trigger suggestions after typing
-            if editor.data_provider().supports_suggestions(editor.current_field()) {
-                match editor.trigger_suggestions(suggestions_provider).await {
-                    Ok(_) => {
-                        let current_text = editor.current_text().to_string();
-                        if editor.suggestions().is_empty() {
-                            editor.set_debug_message(format!("🔍 No matches for '{}'", current_text));
-                        } else {
-                            editor.set_debug_message(format!("✨ {} matches for '{}'", editor.suggestions().len(), current_text));
-                        }
-                        editor.update_inline_completion();
-                    }
-                    Err(e) => {
-                        editor.set_debug_message(format!("❌ Suggestion error: {}", e));
-                    }
-                }
+            // Auto-fetch only if suggestions are already active (triggered by Tab)
+            // For full auto-triggering: remove the `if` check below
+            if editor.is_suggestions_active() {
+                let field_index = editor.current_field();
+                editor.trigger_suggestions_async(suggestions_provider, field_index).await;
            }
        }

@@ -876,8 +872,7 @@ async fn handle_key_press(
                let field_names = ["Fruit", "Job", "Language", "Country", "Color"];
                let current_field = field_names.get(editor.current_field()).unwrap_or(&"Field");
                editor.set_debug_message(format!(
-                    "{} field - Try: i=insert, Tab=suggestions, j/k=move. Key: {:?}",
-                    current_field, key
+                    "{current_field} field - Try: i=insert, Tab=suggestions, j/k=move. Key: {key:?}"
                ));
            }
        }
@@ -888,9 +883,9 @@ async fn handle_key_press(

 async fn run_app<B: Backend>(
    terminal: &mut Terminal<B>,
-    mut editor: AutoCursorFormEditor<MultiFieldDemoData>,
+    mut editor: AutoCursorFormEditor<ApplicationData>,
 ) -> io::Result<()> {
-    let mut suggestions_provider = ComprehensiveSuggestionsProvider::new();
+    let mut suggestions_provider = ProductionSuggestionsProvider::new();

    loop {
        terminal.draw(|f| ui(f, &editor))?;
@@ -903,7 +898,7 @@ async fn run_app<B: Backend>(
                    }
                }
                Err(e) => {
-                    editor.set_debug_message(format!("Error: {}", e));
+                    editor.set_debug_message(format!("Error: {e}"));
                }
            }
        }
@@ -912,7 +907,7 @@ async fn run_app<B: Backend>(
    Ok(())
 }

-fn ui(f: &mut Frame, editor: &AutoCursorFormEditor<MultiFieldDemoData>) {
+fn ui(f: &mut Frame, editor: &AutoCursorFormEditor<ApplicationData>) {
    let chunks = Layout::default()
        .direction(Direction::Vertical)
        .constraints([Constraint::Min(8), Constraint::Length(12)])
@@ -926,7 +921,7 @@ fn ui(f: &mut Frame, editor: &AutoCursorFormEditor<MultiFieldDemoData>) {
            f,
            chunks[0],
            input_rect,
-            &canvas::canvas::theme::DefaultCanvasTheme::default(),
+            &canvas::canvas::theme::DefaultCanvasTheme,
            &editor.editor,
        );
    }
@@ -937,7 +932,7 @@ fn ui(f: &mut Frame, editor: &AutoCursorFormEditor<MultiFieldDemoData>) {
 fn render_enhanced_canvas(
    f: &mut Frame,
    area: ratatui::layout::Rect,
-    editor: &AutoCursorFormEditor<MultiFieldDemoData>,
+    editor: &AutoCursorFormEditor<ApplicationData>,
 ) -> Option<ratatui::layout::Rect> {
    render_canvas_default(f, area, &editor.editor)
 }
@@ -945,7 +940,7 @@ fn render_enhanced_canvas(
 fn render_status_and_help(
    f: &mut Frame,
    area: ratatui::layout::Rect,
-    editor: &AutoCursorFormEditor<MultiFieldDemoData>,
+    editor: &AutoCursorFormEditor<ApplicationData>,
 ) {
    let chunks = Layout::default()
        .direction(Direction::Vertical)
@@ -984,38 +979,37 @@ fn render_status_and_help(
    );

    let status = Paragraph::new(Line::from(Span::raw(status_text)))
-        .block(Block::default().borders(Borders::ALL).title("🎯 Multi-Field Suggestions Demo"));
+        .block(Block::default().borders(Borders::ALL).title("🚀 Production-Ready Smart Suggestions (Tab to activate → type to filter)"));

    f.render_widget(status, chunks[0]);

-    // Comprehensive help text
+    // Production help text
    let help_text = match editor.mode() {
        AppMode::ReadOnly => {
-            "🎯 MULTI-FIELD SUGGESTIONS DEMO: Normal █ | Insert | | Visual █\n\
+            "🚀 PRODUCTION-READY SUGGESTIONS: Copy this architecture for your app!\n\
             Movement: j/k or ↑↓=fields, h/l or ←→=chars, gg/G=first/last, w/b/e=words\n\
             Actions: i/a/A=insert, v/V=visual, x/X=delete, ?=info, Enter=next field\n\
-             🍎 Fruits: Apple, Banana, Cherry... | 💼 Jobs: Engineer, Manager, Designer...\n\
-             💻 Languages: Rust, Python, JS... | 🌍 Countries: USA, Canada, UK...\n\
-             🎨 Colors: Red, Blue, Green... | Tab=suggestions, Enter=select\n\
-             Edge cases to test: empty→suggestions, partial matches, field navigation!"
+             Integration: Replace data sources with your APIs, databases, caches\n\
+             Architecture: Non-blocking • Instant UI • Stale protection • Professional UX\n\
+             🔑 Tab=activate suggestions → type to filter • Enter=select • Ready for: REST, GraphQL, SQL, Redis"
        }
        AppMode::Edit => {
-            "🎯 INSERT MODE - Cursor: | (bar)\n\
-             Type to filter suggestions! Tab=show/cycle, Enter=select, Esc=normal\n\
-             Test cases: 'r'→Red/Rust, 's'→Software Engineer/Swift, 'c'→Canada/Cherry...\n\
+            "🚀 INSERT MODE - Press Tab to activate suggestions, then type to filter!\n\
+             Tab=activate suggestions • Type/Backspace=filter while active • Enter=select\n\
+             Perfect for: Autocomplete, search dropdowns, data entry assistance\n\
             Navigation: arrows=move, Ctrl+arrows=words, Home/End=line edges\n\
-             Try different fields for different suggestion behaviors and timing!"
+             Copy this pattern for production: API calls, database queries, cache lookups"
        }
        AppMode::Highlight => {
-            "🎯 VISUAL MODE - Cursor: █ (blinking block)\n\
+            "🚀 VISUAL MODE - Selection with suggestions support\n\
             Selection: hjkl/arrows=extend, w/b/e=word selection, Esc=normal\n\
-             Test multi-character selections across different suggestion field types!"
+             Professional editor experience with Tab-triggered autocomplete!"
        }
-        _ => "🎯 Multi-field suggestions! 5 fields × 8 suggestions each = lots of testing!"
+        _ => "🚀 Copy this suggestions architecture for your production app!"
    };

    let help = Paragraph::new(help_text)
-        .block(Block::default().borders(Borders::ALL).title("🚀 Comprehensive Testing Guide"))
+        .block(Block::default().borders(Borders::ALL).title("📋 Production Integration Guide"))
        .style(Style::default().fg(Color::Gray));

    f.render_widget(help, chunks[1]);
@@ -1023,27 +1017,27 @@ fn render_status_and_help(

 #[tokio::main]
 async fn main() -> Result<(), Box<dyn std::error::Error>> {
-    // Print comprehensive demo information
-    println!("🎯 Multi-Field Suggestions Demo - Perfect for Testing Edge Cases!");
-    println!("✅ cursor-style feature: ENABLED");
-    println!("✅ suggestions feature: ENABLED");
-    println!("🚀 Automatic cursor management: ACTIVE");
-    println!("✨ 5 different suggestion types: ACTIVE");
+    // Print production-ready information
+    println!("🚀 Production-Ready Tab-Triggered Suggestions Demo");
+    println!("✅ Press Tab to activate suggestions, then type to filter in real-time");
+    println!("✅ Professional autocomplete architecture");
+    println!("✅ Copy this pattern for your production application!");
    println!();
-    println!("📋 Test These 5 Fields:");
-    println!("   🍎 Fruits: Apple, Banana, Cherry, Date, Elderberry, Fig, Grape, Honeydew");
-    println!("   💼 Jobs: Software Engineer, Product Manager, Data Scientist, UX Designer...");
-    println!("   💻 Languages: Rust, Python, JavaScript, TypeScript, Go, Java, C++, Swift");
-    println!("   🌍 Countries: USA, Canada, UK, Germany, France, Japan, Australia, Brazil");
-    println!("   🎨 Colors: Red, Blue, Green, Yellow, Purple, Orange, Pink, Black");
+    println!("🏗️  Integration Ready For:");
+    println!("   📡 REST APIs (reqwest, hyper)");
+    println!("   🗄️  Databases (sqlx, diesel, mongodb)");
+    println!("   🔍 Search Engines (elasticsearch, algolia, typesense)");
+    println!("   💾 Caches (redis, memcached)");
+    println!("   🌐 GraphQL APIs");
+    println!("   🔗 gRPC Services");
    println!();
-    println!("🧪 Edge Cases to Test:");
-    println!("   • Navigation between suggestion/non-suggestion fields");
-    println!("   • Empty field → Tab → see all suggestions");
-    println!("   • Partial typing → Tab → filtered suggestions");
-    println!("   • Different loading times per field (100-300ms)");
-    println!("   • Field switching while suggestions active");
-    println!("   • Visual mode selections across suggestion fields");
+    println!("⚡ Key Features:");
+    println!("   • Press Tab to activate suggestions dropdown");
+    println!("   • Real-time filtering while suggestions are active");
+    println!("   • Built-in stale result protection");
+    println!("   • Tab cycles through suggestions");
+    println!("   • Professional-grade user experience");
+    println!("   • Easy to integrate with any async data source");
    println!();

    enable_raw_mode()?;
@@ -1052,7 +1046,7 @@ async fn main() -> Result<(), Box<dyn std::error::Error>> {
    let backend = CrosstermBackend::new(stdout);
    let mut terminal = Terminal::new(backend)?;

-    let data = MultiFieldDemoData::new();
+    let data = ApplicationData::new();
    let mut editor = AutoCursorFormEditor::new(data);

    // Initialize with normal mode - library automatically sets block cursor
@@ -1076,9 +1070,9 @@ async fn main() -> Result<(), Box<dyn std::error::Error>> {
    terminal.show_cursor()?;

    if let Err(err) = res {
-        println!("{:?}", err);
+        println!("{err:?}");
    }

-    println!("🎯 Multi-field testing complete! Great for finding edge cases!");
+    println!("🚀 Ready to integrate this architecture into your production app!");
    Ok(())
 }
--- a/canvas/examples/textarea_normal.rs
+++ b/canvas/examples/textarea_normal.rs
@@ -0,0 +1,397 @@
+// examples/textarea_normal.rs
+//! Demonstrates automatic cursor management with the textarea widget
+//!
+//! This example REQUIRES the `cursor-style` and `textarea` features to compile,
+//! and is adapted for `textmode-normal` (always editing, no vim modes).
+//!
+//! Run with:
+//! cargo run --example canvas_textarea_cursor_auto_normal --features "gui,cursor-style,textarea,textmode-normal"
+
+#[cfg(not(feature = "cursor-style"))]
+compile_error!(
+    "This example requires the 'cursor-style' feature. \
+     Run with: cargo run --example canvas_textarea_cursor_auto_normal --features \"gui,cursor-style,textarea,textmode-normal\""
+);
+
+#[cfg(not(feature = "textarea"))]
+compile_error!(
+    "This example requires the 'textarea' feature. \
+     Run with: cargo run --example canvas_textarea_cursor_auto_normal --features \"gui,cursor-style,textarea,textmode-normal\""
+);
+
+use std::io;
+use crossterm::{
+    event::{self, DisableMouseCapture, EnableMouseCapture, Event, KeyCode, KeyEvent, KeyModifiers},
+    execute,
+    terminal::{disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen},
+};
+use ratatui::{
+    backend::{Backend, CrosstermBackend},
+    layout::{Constraint, Direction, Layout},
+    style::{Color, Style},
+    text::{Line, Span},
+    widgets::{Block, Borders, Paragraph},
+    Frame, Terminal,
+};
+
+use canvas::{
+    canvas::CursorManager,
+    textarea::{TextArea, TextAreaState},
+};
+
+/// TextArea demo adapted for NORMALMODE (always editing)
+struct AutoCursorTextArea {
+    textarea: TextAreaState,
+    has_unsaved_changes: bool,
+    debug_message: String,
+    command_buffer: String,
+}
+
+impl AutoCursorTextArea {
+    fn new() -> Self {
+        let initial_text = "🎯 Automatic Cursor Management Demo (NORMALMODE)\n\
+Welcome to the textarea cursor demo!\n\
+\n\
+This demo runs in NORMALMODE:\n\
+• Always editing (no insert/normal toggle)\n\
+• Cursor is always underscore _\n\
+\n\
+Navigation commands:\n\
+• hjkl or arrow keys: move cursor\n\
+• w/b/e/W/B/E: word movements\n\
+• 0/$: line start/end\n\
+• g/gG: first/last line\n\
+\n\
+Editing commands:\n\
+• x/X: delete characters\n\
+\n\
+Press ? for help, Ctrl+Q to quit.";
+
+        let mut textarea = TextAreaState::from_text(initial_text);
+        textarea.set_placeholder("Start typing...");
+
+        Self {
+            textarea,
+            has_unsaved_changes: false,
+            debug_message: "🎯 NORMALMODE Demo - always editing".to_string(),
+            command_buffer: String::new(),
+        }
+    }
+
+    fn handle_textarea_input(&mut self, key: KeyEvent) {
+        self.textarea.input(key);
+        self.has_unsaved_changes = true;
+    }
+
+    fn move_left(&mut self) {
+        self.textarea.move_left();
+        self.debug_message = "← left".to_string();
+    }
+    fn move_right(&mut self) {
+        self.textarea.move_right();
+        self.debug_message = "→ right".to_string();
+    }
+    fn move_up(&mut self) {
+        self.textarea.move_up();
+        self.debug_message = "↑ up".to_string();
+    }
+    fn move_down(&mut self) {
+        self.textarea.move_down();
+        self.debug_message = "↓ down".to_string();
+    }
+
+    fn move_word_next(&mut self) {
+        self.textarea.move_word_next();
+        self.debug_message = "w: next word".to_string();
+    }
+    fn move_word_prev(&mut self) {
+        self.textarea.move_word_prev();
+        self.debug_message = "b: previous word".to_string();
+    }
+    fn move_word_end(&mut self) {
+        self.textarea.move_word_end();
+        self.debug_message = "e: word end".to_string();
+    }
+    fn move_word_end_prev(&mut self) {
+        self.textarea.move_word_end_prev();
+        self.debug_message = "ge: previous word end".to_string();
+    }
+
+    fn move_line_start(&mut self) {
+        self.textarea.move_line_start();
+        self.debug_message = "0: line start".to_string();
+    }
+    fn move_line_end(&mut self) {
+        self.textarea.move_line_end();
+        self.debug_message = "$: line end".to_string();
+    }
+    fn move_first_line(&mut self) {
+        self.textarea.move_first_line();
+        self.debug_message = "gg: first line".to_string();
+    }
+    fn move_last_line(&mut self) {
+        self.textarea.move_last_line();
+        self.debug_message = "G: last line".to_string();
+    }
+
+    fn delete_char_forward(&mut self) {
+        if let Ok(_) = self.textarea.delete_forward() {
+            self.has_unsaved_changes = true;
+            self.debug_message = "x: deleted character".to_string();
+        }
+    }
+    fn delete_char_backward(&mut self) {
+        if let Ok(_) = self.textarea.delete_backward() {
+            self.has_unsaved_changes = true;
+            self.debug_message = "X: deleted character backward".to_string();
+        }
+    }
+
+    fn clear_command_buffer(&mut self) {
+        self.command_buffer.clear();
+    }
+    fn add_to_command_buffer(&mut self, ch: char) {
+        self.command_buffer.push(ch);
+    }
+    fn get_command_buffer(&self) -> &str {
+        &self.command_buffer
+    }
+    fn has_pending_command(&self) -> bool {
+        !self.command_buffer.is_empty()
+    }
+
+    fn debug_message(&self) -> &str {
+        &self.debug_message
+    }
+    fn set_debug_message(&mut self, msg: String) {
+        self.debug_message = msg;
+    }
+    fn has_unsaved_changes(&self) -> bool {
+        self.has_unsaved_changes
+    }
+    fn get_cursor_info(&self) -> String {
+        format!(
+            "Line {}, Col {}",
+            self.textarea.current_field() + 1,
+            self.textarea.cursor_position() + 1
+        )
+    }
+
+    // === BIG WORD MOVEMENTS ===
+
+    fn move_big_word_next(&mut self) {
+        self.textarea.move_big_word_next();
+        self.debug_message = "W: next WORD".to_string();
+    }
+
+    fn move_big_word_prev(&mut self) {
+        self.textarea.move_big_word_prev();
+        self.debug_message = "B: previous WORD".to_string();
+    }
+
+    fn move_big_word_end(&mut self) {
+        self.textarea.move_big_word_end();
+        self.debug_message = "E: WORD end".to_string();
+    }
+
+    fn move_big_word_end_prev(&mut self) {
+        self.textarea.move_big_word_end_prev();
+        self.debug_message = "gE: previous WORD end".to_string();
+    }
+}
+
+/// Handle key press in NORMALMODE (always editing, casual editor style)
+fn handle_key_press(
+    key_event: KeyEvent,
+    editor: &mut AutoCursorTextArea,
+) -> anyhow::Result<bool> {
+    let KeyEvent {
+        code: key,
+        modifiers,
+        ..
+    } = key_event;
+
+    // Quit
+    if (key == KeyCode::Char('q') && modifiers.contains(KeyModifiers::CONTROL))
+        || (key == KeyCode::Char('c') && modifiers.contains(KeyModifiers::CONTROL))
+        || key == KeyCode::F(10)
+    {
+        return Ok(false);
+    }
+
+    match (key, modifiers) {
+        // Movement
+        (KeyCode::Left, _) => editor.move_left(),
+        (KeyCode::Right, _) => editor.move_right(),
+        (KeyCode::Up, _) => editor.move_up(),
+        (KeyCode::Down, _) => editor.move_down(),
+
+        // Word movement (Ctrl+Arrows)
+        (KeyCode::Left, m) if m.contains(KeyModifiers::CONTROL) => editor.move_word_prev(),
+        (KeyCode::Right, m) if m.contains(KeyModifiers::CONTROL) => editor.move_word_next(),
+        (KeyCode::Right, m) if m.contains(KeyModifiers::CONTROL | KeyModifiers::SHIFT) => {
+            editor.move_word_end()
+        }
+
+        // Line/document movement
+        (KeyCode::Home, _) => editor.move_line_start(),
+        (KeyCode::End, _) => editor.move_line_end(),
+        (KeyCode::Home, m) if m.contains(KeyModifiers::CONTROL) => editor.move_first_line(),
+        (KeyCode::End, m) if m.contains(KeyModifiers::CONTROL) => editor.move_last_line(),
+
+        // Delete
+        (KeyCode::Delete, _) => editor.delete_char_forward(),
+        (KeyCode::Backspace, _) => editor.delete_char_backward(),
+
+        (KeyCode::F(1), _) => {
+            // Switch to indicator mode
+            editor.textarea.use_overflow_indicator('$');
+            editor.set_debug_message("Overflow: indicator '$' (wrap OFF)".to_string());
+        }
+        (KeyCode::F(2), _) => {
+            // Switch to wrap mode
+            editor.textarea.use_wrap();
+            editor.set_debug_message("Overflow: wrap ON".to_string());
+        }
+
+        (KeyCode::F(3), _) => {
+            editor.textarea.set_wrap_indent_cols(3);
+            editor.set_debug_message("Wrap indent: 3 columns".to_string());
+        }
+        (KeyCode::F(4), _) => {
+            editor.textarea.set_wrap_indent_cols(0);
+            editor.set_debug_message("Wrap indent: 0 columns".to_string());
+        }
+
+        // Debug/info
+        (KeyCode::Char('?'), _) => {
+            editor.set_debug_message(format!(
+                "{}, Mode: NORMALMODE (casual editor, underscore cursor)",
+                editor.get_cursor_info()
+            ));
+            editor.clear_command_buffer();
+        }
+
+        // Default: treat as text input
+        _ => editor.handle_textarea_input(key_event),
+    }
+
+    Ok(true)
+}
+
+fn run_app<B: Backend>(terminal: &mut Terminal<B>, mut editor: AutoCursorTextArea) -> io::Result<()> {
+    loop {
+        terminal.draw(|f| ui(f, &mut editor))?;
+
+        if let Event::Key(key) = event::read()? {
+            match handle_key_press(key, &mut editor) {
+                Ok(should_continue) => {
+                    if !should_continue {
+                        break;
+                    }
+                }
+                Err(e) => {
+                    editor.set_debug_message(format!("Error: {e}"));
+                }
+            }
+        }
+    }
+    Ok(())
+}
+
+fn ui(f: &mut Frame, editor: &mut AutoCursorTextArea) {
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([Constraint::Min(8), Constraint::Length(8)])
+        .split(f.area());
+
+    render_textarea(f, chunks[0], editor);
+    render_status_and_help(f, chunks[1], editor);
+}
+
+fn render_textarea(f: &mut Frame, area: ratatui::layout::Rect, editor: &mut AutoCursorTextArea) {
+    let block = Block::default()
+        .borders(Borders::ALL)
+        .title("🎯 Textarea with NORMALMODE (always editing)");
+
+    let textarea_widget = TextArea::default().block(block.clone());
+    f.render_stateful_widget(textarea_widget, area, &mut editor.textarea);
+
+    let (cx, cy) = editor.textarea.cursor(area, Some(&block));
+    f.set_cursor_position((cx, cy));
+}
+
+fn render_status_and_help(f: &mut Frame, area: ratatui::layout::Rect, editor: &AutoCursorTextArea) {
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([Constraint::Length(3), Constraint::Length(5)])
+        .split(area);
+
+    let status_text = if editor.has_pending_command() {
+        format!(
+            "-- NORMALMODE (underscore cursor) -- {} [{}]",
+            editor.debug_message(),
+            editor.get_command_buffer()
+        )
+    } else if editor.has_unsaved_changes() {
+        format!(
+            "-- NORMALMODE (underscore cursor) -- [Modified] {} | {}",
+            editor.debug_message(),
+            editor.get_cursor_info()
+        )
+    } else {
+        format!(
+            "-- NORMALMODE (underscore cursor) -- {} | {}",
+            editor.debug_message(),
+            editor.get_cursor_info()
+        )
+    };
+
+    let status = Paragraph::new(Line::from(Span::raw(status_text)))
+        .block(Block::default().borders(Borders::ALL).title("🎯 Cursor Status"));
+
+    f.render_widget(status, chunks[0]);
+
+    let help_text = "🎯 NORMALMODE (always editing)\n\
+hjkl/arrows=move, w/b/e=words, W/B/E=WORDS, 0/$=line, g/G=first/last\n\
+x/X=delete, typing inserts text\n\
+?=info, Ctrl+Q=quit";
+
+    let help = Paragraph::new(help_text)
+        .block(Block::default().borders(Borders::ALL).title("🚀 Help"))
+        .style(Style::default().fg(Color::Gray));
+
+    f.render_widget(help, chunks[1]);
+}
+
+fn main() -> Result<(), Box<dyn std::error::Error>> {
+    println!("🎯 Canvas Textarea Cursor Auto Demo (NORMALMODE)");
+    println!("✅ cursor-style feature: ENABLED");
+    println!("✅ textarea feature: ENABLED");
+    println!("✅ textmode-normal feature: ENABLED");
+    println!("🚀 Always editing, underscore cursor active");
+    println!();
+
+    enable_raw_mode()?;
+    let mut stdout = io::stdout();
+    execute!(stdout, EnterAlternateScreen, EnableMouseCapture)?;
+    let backend = CrosstermBackend::new(stdout);
+    let mut terminal = Terminal::new(backend)?;
+
+    let editor = AutoCursorTextArea::new();
+
+    let res = run_app(&mut terminal, editor);
+
+    CursorManager::reset()?;
+
+    disable_raw_mode()?;
+    execute!(terminal.backend_mut(), LeaveAlternateScreen, DisableMouseCapture)?;
+    terminal.show_cursor()?;
+
+    if let Err(err) = res {
+        println!("{err:?}");
+    }
+
+    println!("🎯 Cursor automatically reset to default!");
+    Ok(())
+}
--- a/canvas/examples/textarea_syntax.rs
+++ b/canvas/examples/textarea_syntax.rs
@@ -0,0 +1,413 @@
+// examples/textarea_syntax.rs
+//! Demonstrates syntax highlighting with the textarea widget
+//!
+//! This example REQUIRES the `syntect` feature to compile.
+//!
+//! Run with:
+//! cargo run --example textarea_syntax --features "gui,cursor-style,textarea,syntect,textmode-normal"
+
+#[cfg(not(feature = "syntect"))]
+compile_error!(
+    "This example requires the 'syntect' feature. \
+     Run with: cargo run --example textarea_syntax --features \"gui,cursor-style,textarea,syntect,textmode-normal\""
+);
+
+use std::io;
+use crossterm::{
+    event::{self, DisableMouseCapture, EnableMouseCapture, Event, KeyCode, KeyEvent, KeyModifiers},
+    execute,
+    terminal::{disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen},
+};
+use ratatui::{
+    backend::{Backend, CrosstermBackend},
+    layout::{Constraint, Direction, Layout},
+    style::{Color, Style},
+    text::{Line, Span},
+    widgets::{Block, Borders, Paragraph},
+    Frame, Terminal,
+};
+
+use canvas::{
+    canvas::CursorManager,
+    textarea::highlight::{TextAreaSyntax, TextAreaSyntaxState},
+};
+
+/// Syntax highlighting TextArea demo
+struct SyntaxTextAreaDemo {
+    textarea: TextAreaSyntaxState,
+    has_unsaved_changes: bool,
+    debug_message: String,
+    current_language: String,
+    current_theme: String,
+}
+
+impl SyntaxTextAreaDemo {
+    fn new() -> Self {
+        let initial_text = r#"// 🎯 Multi-language Syntax Highlighting Demo
+// ==========================
+// Rust
+// ==========================
+fn main() {
+    println!("Hello, Rust 🦀");
+    let nums = vec![1, 2, 3, 4, 5];
+    for n in nums {
+        println!("n = {}", n);
+    }
+}
+
+// ==========================
+// Python
+// ==========================
+# 🐍 Python example
+def fib(n):
+    if n <= 1:
+        return n
+    return fib(n-1) + fib(n-2)
+
+print([fib(i) for i in range(6)])
+
+# ==========================
+// JavaScript
+// ==========================
+ // 🟨 JavaScript example
+function greet(name) {
+    console.log(`Hello, ${name}!`);
+}
+greet("World");
+
+// ==========================
+// Scheme
+// ==========================
+;; 🎭 Scheme example
+(define (square x) (* x x))
+(display (square 5))
+(newline)
+"#;
+
+        let mut textarea = TextAreaSyntaxState::from_text(initial_text);
+        textarea.set_placeholder("Start typing code...");
+
+        // Pick a colorful default theme
+        let default_theme = "base16-ocean.dark";
+        let _ = textarea.set_syntax_theme(default_theme);
+        // Default to Rust syntax
+        let _ = textarea.set_syntax_by_extension("rs");
+
+        Self {
+            textarea,
+            has_unsaved_changes: false,
+            debug_message: format!("🎯 Syntax highlighting enabled - Rust ({})", default_theme),
+            current_language: "Rust".to_string(),
+            current_theme: default_theme.to_string(),
+        }
+    }
+
+    fn handle_textarea_input(&mut self, key: KeyEvent) {
+        self.textarea.input(key);
+        self.has_unsaved_changes = true;
+    }
+
+    fn switch_to_rust(&mut self) {
+        let _ = self.textarea.set_syntax_by_extension("rs");
+        self.current_language = "Rust".to_string();
+        self.debug_message = format!("🦀 Switched to Rust syntax ({})", self.current_theme);
+        
+        let rust_code = r#"// Rust example
+fn fibonacci(n: u32) -> u32 {
+    match n {
+        0 => 0,
+        1 => 1,
+        _ => fibonacci(n - 1) + fibonacci(n - 2),
+    }
+}
+
+fn main() {
+    for i in 0..10 {
+        println!("fib({}) = {}", i, fibonacci(i));
+    }
+}"#;
+        self.textarea.set_text(rust_code);
+        self.has_unsaved_changes = false;
+    }
+
+    fn switch_to_python(&mut self) {
+        let _ = self.textarea.set_syntax_by_extension("py");
+        self.current_language = "Python".to_string();
+        self.debug_message = format!("🐍 Switched to Python syntax ({})", self.current_theme);
+        
+        let python_code = r#"# Python example
+def fibonacci(n):
+    if n <= 1:
+        return n
+    return fibonacci(n - 1) + fibonacci(n - 2)
+
+def main():
+    for i in range(10):
+        print(f"fib({i}) = {fibonacci(i)}")
+
+if __name__ == "__main__":
+    main()"#;
+        self.textarea.set_text(python_code);
+        self.has_unsaved_changes = false;
+    }
+
+    fn switch_to_javascript(&mut self) {
+        let _ = self.textarea.set_syntax_by_extension("js");
+        self.current_language = "JavaScript".to_string();
+        self.debug_message = format!("🟨 Switched to JavaScript syntax ({})", self.current_theme);
+        
+        let js_code = r#"// JavaScript example
+function fibonacci(n) {
+    if (n <= 1) return n;
+    return fibonacci(n - 1) + fibonacci(n - 2);
+}
+
+function main() {
+    for (let i = 0; i < 10; i++) {
+        console.log(`fib(${i}) = ${fibonacci(i)}`);
+    }
+}
+
+main();"#;
+        self.textarea.set_text(js_code);
+        self.has_unsaved_changes = false;
+    }
+
+    fn switch_to_scheme(&mut self) {
+        let _ = self.textarea.set_syntax_by_name("Scheme");
+        self.current_language = "Scheme".to_string();
+        self.debug_message = format!("🎭 Switched to Scheme syntax ({})", self.current_theme);
+        
+        let scheme_code = r#";; Scheme example
+(define (fibonacci n)
+  (cond ((= n 0) 0)
+        ((= n 1) 1)
+        (else (+ (fibonacci (- n 1))
+                 (fibonacci (- n 2))))))
+
+(define (main)
+  (do ((i 0 (+ i 1)))
+      ((= i 10))
+    (display (format "fib(~a) = ~a~n" i (fibonacci i)))))
+
+(main)"#;
+        self.textarea.set_text(scheme_code);
+        self.has_unsaved_changes = false;
+    }
+
+    fn cycle_theme(&mut self) {
+        let themes = [
+            "InspiredGitHub",
+            "base16-ocean.dark",
+            "base16-eighties.dark",
+            "Solarized (dark)",
+            "Monokai Extended",
+        ];
+        let current_pos = themes.iter().position(|t| *t == self.current_theme);
+        let next_pos = match current_pos {
+            Some(p) => (p + 1) % themes.len(),
+            None => 0,
+        };
+        let next_theme = themes[next_pos];
+        let _ = self.textarea.set_syntax_theme(next_theme);
+        self.current_theme = next_theme.to_string();
+        self.debug_message = format!("🎨 Theme switched to {}", next_theme);
+    }
+
+    fn get_cursor_info(&self) -> String {
+        format!(
+            "Line {}, Col {} | Lang: {} | Theme: {}",
+            self.textarea.current_field() + 1,
+            self.textarea.cursor_position() + 1,
+            self.current_language,
+            self.current_theme
+        )
+    }
+
+    fn debug_message(&self) -> &str {
+        &self.debug_message
+    }
+
+    fn set_debug_message(&mut self, msg: String) {
+        self.debug_message = msg;
+    }
+
+    fn has_unsaved_changes(&self) -> bool {
+        self.has_unsaved_changes
+    }
+}
+
+fn handle_key_press(
+    key_event: KeyEvent,
+    editor: &mut SyntaxTextAreaDemo,
+) -> anyhow::Result<bool> {
+    let KeyEvent {
+        code: key,
+        modifiers,
+        ..
+    } = key_event;
+
+    // Quit
+    if (key == KeyCode::Char('q') && modifiers.contains(KeyModifiers::CONTROL))
+        || (key == KeyCode::Char('c') && modifiers.contains(KeyModifiers::CONTROL))
+        || key == KeyCode::F(10)
+    {
+        return Ok(false);
+    }
+
+    match (key, modifiers) {
+        // Language switching
+        (KeyCode::F(5), _) => editor.switch_to_rust(),
+        (KeyCode::F(6), _) => editor.switch_to_python(),
+        (KeyCode::F(7), _) => editor.switch_to_javascript(),
+        (KeyCode::F(8), _) => editor.switch_to_scheme(),
+
+        // Theme cycling
+        (KeyCode::F(9), _) => editor.cycle_theme(),
+
+        // Overflow modes
+        (KeyCode::F(1), _) => {
+            editor.textarea.use_overflow_indicator('$');
+            editor.set_debug_message(format!("Overflow: indicator '$' (wrap OFF) | Theme: {}", editor.current_theme));
+        }
+        (KeyCode::F(2), _) => {
+            editor.textarea.use_wrap();
+            editor.set_debug_message(format!("Overflow: wrap ON | Theme: {}", editor.current_theme));
+        }
+
+        // Wrap indent
+        (KeyCode::F(3), _) => {
+            editor.textarea.set_wrap_indent_cols(4);
+            editor.set_debug_message(format!("Wrap indent: 4 columns | Theme: {}", editor.current_theme));
+        }
+        (KeyCode::F(4), _) => {
+            editor.textarea.set_wrap_indent_cols(0);
+            editor.set_debug_message(format!("Wrap indent: 0 columns | Theme: {}", editor.current_theme));
+        }
+
+        // Info
+        (KeyCode::Char('?'), _) => {
+            editor.set_debug_message(format!(
+                "{} | Syntax highlighting enabled",
+                editor.get_cursor_info()
+            ));
+        }
+
+        // Default: pass to textarea
+        _ => editor.handle_textarea_input(key_event),
+    }
+
+    Ok(true)
+}
+
+fn run_app<B: Backend>(terminal: &mut Terminal<B>, mut editor: SyntaxTextAreaDemo) -> io::Result<()> {
+    loop {
+        terminal.draw(|f| ui(f, &mut editor))?;
+
+        if let Event::Key(key) = event::read()? {
+            match handle_key_press(key, &mut editor) {
+                Ok(should_continue) => {
+                    if !should_continue {
+                        break;
+                    }
+                }
+                Err(e) => {
+                    editor.set_debug_message(format!("Error: {e}"));
+                }
+            }
+        }
+    }
+    Ok(())
+}
+
+fn ui(f: &mut Frame, editor: &mut SyntaxTextAreaDemo) {
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([Constraint::Min(8), Constraint::Length(8)])
+        .split(f.area());
+
+    render_textarea(f, chunks[0], editor);
+    render_status_and_help(f, chunks[1], editor);
+}
+
+fn render_textarea(f: &mut Frame, area: ratatui::layout::Rect, editor: &mut SyntaxTextAreaDemo) {
+    let block = Block::default()
+        .borders(Borders::ALL)
+        .title("🎨 Syntax Highlighted Code Editor");
+
+    let textarea_widget = TextAreaSyntax::default().block(block.clone());
+    f.render_stateful_widget(textarea_widget, area, &mut editor.textarea);
+
+    // Reuse cursor calculation from the wrapped textarea
+    let (cx, cy) = editor.textarea.cursor(area, Some(&block));
+    f.set_cursor_position((cx, cy));
+}
+
+fn render_status_and_help(f: &mut Frame, area: ratatui::layout::Rect, editor: &SyntaxTextAreaDemo) {
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([Constraint::Length(3), Constraint::Length(5)])
+        .split(area);
+
+    let status_text = if editor.has_unsaved_changes() {
+        format!(
+            "-- SYNTAX MODE (highlighting enabled) -- [Modified] {} | {}",
+            editor.debug_message(),
+            editor.get_cursor_info()
+        )
+    } else {
+        format!(
+            "-- SYNTAX MODE (highlighting enabled) -- {} | {}",
+            editor.debug_message(),
+            editor.get_cursor_info()
+        )
+    };
+
+    let status = Paragraph::new(Line::from(Span::raw(status_text)))
+        .block(Block::default().borders(Borders::ALL).title("🎨 Syntax Status"));
+
+    f.render_widget(status, chunks[0]);
+
+    let help_text = "🎨 SYNTAX HIGHLIGHTING DEMO\n\
+F5=Rust, F6=Python, F7=JavaScript, F8=Scheme\n\
+F1/F2=overflow modes, F3/F4=wrap indent\n\
+F9=cycle themes, ?=info, Ctrl+Q=quit";
+
+    let help = Paragraph::new(help_text)
+        .block(Block::default().borders(Borders::ALL).title("🚀 Help"))
+        .style(Style::default().fg(Color::Cyan));
+
+    f.render_widget(help, chunks[1]);
+}
+
+fn main() -> Result<(), Box<dyn std::error::Error>> {
+    println!("🎨 Canvas Textarea Syntax Highlighting Demo");
+    println!("✅ cursor-style feature: ENABLED");
+    println!("✅ textarea feature: ENABLED");
+    println!("✅ syntect feature: ENABLED");
+    println!("🎨 Syntax highlighting active");
+    println!();
+
+    enable_raw_mode()?;
+    let mut stdout = io::stdout();
+    execute!(stdout, EnterAlternateScreen, EnableMouseCapture)?;
+    let backend = CrosstermBackend::new(stdout);
+    let mut terminal = Terminal::new(backend)?;
+
+    let editor = SyntaxTextAreaDemo::new();
+
+    let res = run_app(&mut terminal, editor);
+
+    CursorManager::reset()?;
+
+    disable_raw_mode()?;
+    execute!(terminal.backend_mut(), LeaveAlternateScreen, DisableMouseCapture)?;
+    terminal.show_cursor()?;
+
+    if let Err(err) = res {
+        println!("{err:?}");
+    }
+
+    println!("🎨 Syntax highlighting demo complete!");
+    Ok(())
+}
--- a/canvas/examples/textarea_vim.rs
+++ b/canvas/examples/textarea_vim.rs
@@ -0,0 +1,652 @@
+// examples/textarea_vim.rs
+//! Demonstrates automatic cursor management with the textarea widget
+//!
+//! This example REQUIRES the `cursor-style` and `textarea` features to compile.
+//!
+//! Run with:
+//! cargo run --example canvas_textarea_cursor_auto --features "gui,cursor-style,textarea"
+
+// REQUIRE cursor-style and textarea features
+#[cfg(not(feature = "cursor-style"))]
+compile_error!(
+    "This example requires the 'cursor-style' feature. \
+     Run with: cargo run --example canvas_textarea_cursor_auto --features \"gui,cursor-style,textarea\""
+);
+
+#[cfg(not(feature = "textarea"))]
+compile_error!(
+    "This example requires the 'textarea' feature. \
+     Run with: cargo run --example canvas_textarea_cursor_auto --features \"gui,cursor-style,textarea\""
+);
+
+use std::io;
+use crossterm::{
+    event::{
+        self, DisableMouseCapture, EnableMouseCapture, Event, KeyCode, KeyEvent, KeyModifiers,
+    },
+    execute,
+    terminal::{
+        disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen,
+    },
+};
+use ratatui::{
+    backend::{Backend, CrosstermBackend},
+    layout::{Constraint, Direction, Layout},
+    style::{Color, Style},
+    text::{Line, Span},
+    widgets::{Block, Borders, Paragraph},
+    Frame, Terminal,
+};
+
+use canvas::{
+    canvas::{
+        modes::AppMode,
+        CursorManager, // This import only exists when cursor-style feature is enabled
+    },
+    textarea::{TextArea, TextAreaState},
+};
+
+/// Enhanced TextArea that demonstrates automatic cursor management
+/// Now uses direct FormEditor method calls via Deref!
+struct AutoCursorTextArea {
+    textarea: TextAreaState,
+    has_unsaved_changes: bool,
+    debug_message: String,
+    command_buffer: String,
+}
+
+impl AutoCursorTextArea {
+    fn new() -> Self {
+        let initial_text = "🎯 Automatic Cursor Management Demo\n\
+Welcome to the textarea cursor demo!\n\
+\n\
+Try different modes:\n\
+• Normal mode: Block cursor █\n\
+• Insert mode: Bar cursor |\n\
+\n\
+Navigation commands:\n\
+• hjkl or arrow keys: move cursor\n\
+• i/a/A/o/O: enter insert mode\n\
+• w/b/e/W/B/E: word movements\n\
+• Esc: return to normal mode\n\
+\n\
+Watch how the terminal cursor changes automatically!\n\
+This text can be edited when in insert mode.\n\
+\n\
+Press ? for help, F1/F2 for manual cursor control demo.";
+
+        let mut textarea = TextAreaState::from_text(initial_text);
+        textarea.set_placeholder("Start typing...");
+        textarea.use_wrap();
+        
+        Self {
+            textarea,
+            has_unsaved_changes: false,
+            debug_message: "🎯 Automatic Cursor Demo - cursor-style feature enabled!".to_string(),
+            command_buffer: String::new(),
+        }
+    }
+
+    // === MODE TRANSITIONS WITH AUTOMATIC CURSOR MANAGEMENT ===
+
+    fn enter_insert_mode(&mut self) -> std::io::Result<()> {
+        self.textarea.enter_edit_mode(); // 🎯 Direct FormEditor method call via Deref!
+        CursorManager::update_for_mode(AppMode::Edit)?; // 🎯 Automatic: cursor becomes bar |
+        self.debug_message = "✏️  INSERT MODE - Cursor: Steady Bar |".to_string();
+        Ok(())
+    }
+
+    fn enter_append_mode(&mut self) -> std::io::Result<()> {
+        self.textarea.enter_append_mode(); // 🎯 Direct FormEditor method call!
+        CursorManager::update_for_mode(AppMode::Edit)?;
+        self.debug_message = "✏️  INSERT (append) - Cursor: Steady Bar |".to_string();
+        Ok(())
+    }
+
+    fn exit_to_normal_mode(&mut self) -> std::io::Result<()> {
+        self.textarea.exit_edit_mode(); // 🎯 Direct FormEditor method call!
+        CursorManager::update_for_mode(AppMode::ReadOnly)?; // 🎯 Automatic: cursor becomes steady block
+        self.debug_message = "🔒 NORMAL MODE - Cursor: Steady Block █".to_string();
+        Ok(())
+    }
+
+    // === MANUAL CURSOR OVERRIDE DEMONSTRATION ===
+
+    fn demo_manual_cursor_control(&mut self) -> std::io::Result<()> {
+        // Users can still manually control cursor if needed
+        CursorManager::update_for_mode(AppMode::Command)?;
+        self.debug_message = "🔧 Manual override: Command cursor _".to_string();
+        Ok(())
+    }
+
+    fn restore_automatic_cursor(&mut self) -> std::io::Result<()> {
+        // Restore automatic cursor based on current mode
+        CursorManager::update_for_mode(self.textarea.mode())?; // 🎯 Direct method call!
+        self.debug_message = "🎯 Restored automatic cursor management".to_string();
+        Ok(())
+    }
+
+    // === TEXTAREA OPERATIONS ===
+
+    fn handle_textarea_input(&mut self, key: KeyEvent) {
+        self.textarea.input(key);
+        self.has_unsaved_changes = true;
+    }
+
+    // === MOVEMENT OPERATIONS (using direct FormEditor methods!) ===
+
+    fn move_left(&mut self) {
+        self.textarea.move_left(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("← left");
+    }
+
+    fn move_right(&mut self) {
+        self.textarea.move_right(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("→ right");
+    }
+
+    fn move_up(&mut self) {
+        self.textarea.move_up(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("↑ up");
+    }
+
+    fn move_down(&mut self) {
+        self.textarea.move_down(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("↓ down");
+    }
+
+    fn move_word_next(&mut self) {
+        self.textarea.move_word_next(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("w: next word");
+    }
+
+    fn move_word_prev(&mut self) {
+        self.textarea.move_word_prev(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("b: previous word");
+    }
+
+    fn move_word_end(&mut self) {
+        self.textarea.move_word_end(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("e: word end");
+    }
+
+    fn move_word_end_prev(&mut self) {
+        self.textarea.move_word_end_prev(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("ge: previous word end");
+    }
+
+    fn move_line_start(&mut self) {
+        self.textarea.move_line_start(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("0: line start");
+    }
+
+    fn move_line_end(&mut self) {
+        self.textarea.move_line_end(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("$: line end");
+    }
+
+    fn move_first_line(&mut self) {
+        self.textarea.move_first_line(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("gg: first line");
+    }
+
+    fn move_last_line(&mut self) {
+        self.textarea.move_last_line(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("G: last line");
+    }
+
+    // === BIG WORD MOVEMENTS ===
+
+    fn move_big_word_next(&mut self) {
+        self.textarea.move_big_word_next(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("W: next WORD");
+    }
+
+    fn move_big_word_prev(&mut self) {
+        self.textarea.move_big_word_prev(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("B: previous WORD");
+    }
+
+    fn move_big_word_end(&mut self) {
+        self.textarea.move_big_word_end(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("E: WORD end");
+    }
+
+    fn move_big_word_end_prev(&mut self) {
+        self.textarea.move_big_word_end_prev(); // 🎯 Direct FormEditor method call!
+        self.update_debug_for_movement("gE: previous WORD end");
+    }
+
+    fn update_debug_for_movement(&mut self, action: &str) {
+        self.debug_message = action.to_string();
+    }
+
+    // === DELETE OPERATIONS ===
+
+    fn delete_char_forward(&mut self) {
+        if let Ok(_) = self.textarea.delete_forward() { // 🎯 Direct FormEditor method call!
+            self.has_unsaved_changes = true;
+            self.debug_message = "x: deleted character".to_string();
+        }
+    }
+
+    fn delete_char_backward(&mut self) {
+        if let Ok(_) = self.textarea.delete_backward() { // 🎯 Direct FormEditor method call!
+            self.has_unsaved_changes = true;
+            self.debug_message = "X: deleted character backward".to_string();
+        }
+    }
+
+    // === VIM-STYLE EDITING ===
+
+    fn open_line_below(&mut self) -> anyhow::Result<()> {
+        let result = self.textarea.open_line_below(); // 🎯 Textarea-specific override!
+        if result.is_ok() {
+            CursorManager::update_for_mode(AppMode::Edit)?;
+            self.debug_message = "✏️  INSERT (open line below) - Cursor: Steady Bar |".to_string();
+            self.has_unsaved_changes = true;
+        }
+        result
+    }
+
+    fn open_line_above(&mut self) -> anyhow::Result<()> {
+        let result = self.textarea.open_line_above(); // 🎯 Textarea-specific override!
+        if result.is_ok() {
+            CursorManager::update_for_mode(AppMode::Edit)?;
+            self.debug_message = "✏️  INSERT (open line above) - Cursor: Steady Bar |".to_string();
+            self.has_unsaved_changes = true;
+        }
+        result
+    }
+
+    // === COMMAND BUFFER HANDLING ===
+
+    fn clear_command_buffer(&mut self) {
+        self.command_buffer.clear();
+    }
+
+    fn add_to_command_buffer(&mut self, ch: char) {
+        self.command_buffer.push(ch);
+    }
+
+    fn get_command_buffer(&self) -> &str {
+        &self.command_buffer
+    }
+
+    fn has_pending_command(&self) -> bool {
+        !self.command_buffer.is_empty()
+    }
+
+    // === GETTERS ===
+
+    fn mode(&self) -> AppMode {
+        self.textarea.mode() // 🎯 Direct FormEditor method call!
+    }
+
+    fn debug_message(&self) -> &str {
+        &self.debug_message
+    }
+
+    fn has_unsaved_changes(&self) -> bool {
+        self.has_unsaved_changes
+    }
+
+    fn set_debug_message(&mut self, msg: String) {
+        self.debug_message = msg;
+    }
+
+    fn get_cursor_info(&self) -> String {
+        format!(
+            "Line {}, Col {}",
+            self.textarea.current_field() + 1, // 🎯 Direct FormEditor method call!
+            self.textarea.cursor_position() + 1 // 🎯 Direct FormEditor method call!
+        )
+    }
+}
+
+/// Handle key press with automatic cursor management
+fn handle_key_press(
+    key_event: KeyEvent,
+    editor: &mut AutoCursorTextArea,
+) -> anyhow::Result<bool> {
+    let KeyEvent { code: key, modifiers, .. } = key_event;
+    let mode = editor.mode();
+
+    // Quit handling
+    if (key == KeyCode::Char('q') && modifiers.contains(KeyModifiers::CONTROL))
+        || (key == KeyCode::Char('c') && modifiers.contains(KeyModifiers::CONTROL))
+        || key == KeyCode::F(10)
+    {
+        return Ok(false);
+    }
+
+    match (mode, key, modifiers) {
+        // === MODE TRANSITIONS WITH AUTOMATIC CURSOR MANAGEMENT ===
+        (AppMode::ReadOnly, KeyCode::Char('i'), _) => {
+            editor.enter_insert_mode()?;
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('a'), _) => {
+            editor.enter_append_mode()?;
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('A'), _) => {
+            editor.move_line_end();
+            editor.enter_insert_mode()?;
+            editor.clear_command_buffer();
+        }
+
+        // Vim o/O commands
+        (AppMode::ReadOnly, KeyCode::Char('o'), _) => {
+            if let Err(e) = editor.open_line_below() {
+                editor.set_debug_message(format!("Error opening line below: {e}"));
+            }
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('O'), _) => {
+            if let Err(e) = editor.open_line_above() {
+                editor.set_debug_message(format!("Error opening line above: {e}"));
+            }
+            editor.clear_command_buffer();
+        }
+
+        // Escape: Exit any mode back to normal
+        (AppMode::Edit, KeyCode::Esc, _) => {
+            editor.exit_to_normal_mode()?;
+        }
+
+        // === INSERT MODE: Pass to textarea ===
+        (AppMode::Edit, _, _) => {
+            editor.handle_textarea_input(key_event);
+        }
+
+        // === CURSOR MANAGEMENT DEMONSTRATION ===
+        (AppMode::ReadOnly, KeyCode::F(1), _) => {
+            editor.demo_manual_cursor_control()?;
+        }
+        (AppMode::ReadOnly, KeyCode::F(2), _) => {
+            editor.restore_automatic_cursor()?;
+        }
+
+        // === MOVEMENT: VIM-STYLE NAVIGATION (Normal mode) ===
+        (AppMode::ReadOnly, KeyCode::Char('h'), _)
+        | (AppMode::ReadOnly, KeyCode::Left, _) => {
+            editor.move_left();
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('l'), _)
+        | (AppMode::ReadOnly, KeyCode::Right, _) => {
+            editor.move_right();
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('j'), _)
+        | (AppMode::ReadOnly, KeyCode::Down, _) => {
+            editor.move_down();
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('k'), _)
+        | (AppMode::ReadOnly, KeyCode::Up, _) => {
+            editor.move_up();
+            editor.clear_command_buffer();
+        }
+
+        // Word movement
+        (AppMode::ReadOnly, KeyCode::Char('w'), _) => {
+            editor.move_word_next();
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('b'), _) => {
+            editor.move_word_prev();
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('e'), _) => {
+            if editor.get_command_buffer() == "g" {
+                editor.move_word_end_prev();
+                editor.clear_command_buffer();
+            } else {
+                editor.move_word_end();
+                editor.clear_command_buffer();
+            }
+        }
+
+        // Big word movement (vim W/B/E commands)
+        (AppMode::ReadOnly, KeyCode::Char('W'), _) => {
+            editor.move_big_word_next();
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('B'), _) => {
+            editor.move_big_word_prev();
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('E'), _) => {
+            if editor.get_command_buffer() == "g" {
+                editor.move_big_word_end_prev();
+                editor.clear_command_buffer();
+            } else {
+                editor.move_big_word_end();
+                editor.clear_command_buffer();
+            }
+        }
+
+        // Line movement
+        (AppMode::ReadOnly, KeyCode::Char('0'), _)
+        | (AppMode::ReadOnly, KeyCode::Home, _) => {
+            editor.move_line_start();
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('$'), _)
+        | (AppMode::ReadOnly, KeyCode::End, _) => {
+            editor.move_line_end();
+            editor.clear_command_buffer();
+        }
+
+        // Document movement with command buffer
+        (AppMode::ReadOnly, KeyCode::Char('g'), _) => {
+            if editor.get_command_buffer() == "g" {
+                editor.move_first_line();
+                editor.clear_command_buffer();
+            } else {
+                editor.clear_command_buffer();
+                editor.add_to_command_buffer('g');
+                editor.set_debug_message("g".to_string());
+            }
+        }
+        (AppMode::ReadOnly, KeyCode::Char('G'), _) => {
+            editor.move_last_line();
+            editor.clear_command_buffer();
+        }
+
+        // === DELETE OPERATIONS (Normal mode) ===
+        (AppMode::ReadOnly, KeyCode::Char('x'), _) => {
+            editor.delete_char_forward();
+            editor.clear_command_buffer();
+        }
+        (AppMode::ReadOnly, KeyCode::Char('X'), _) => {
+            editor.delete_char_backward();
+            editor.clear_command_buffer();
+        }
+
+        // === DEBUG/INFO COMMANDS ===
+        (AppMode::ReadOnly, KeyCode::Char('?'), _) => {
+            editor.set_debug_message(format!(
+                "{}, Mode: {:?} - Cursor managed automatically!",
+                editor.get_cursor_info(),
+                mode
+            ));
+            editor.clear_command_buffer();
+        }
+
+        _ => {
+            if editor.has_pending_command() {
+                editor.clear_command_buffer();
+                editor.set_debug_message("Invalid command sequence".to_string());
+            } else {
+                editor.set_debug_message(format!(
+                    "Unhandled: {key:?} + {modifiers:?} in {mode:?} mode"
+                ));
+            }
+        }
+    }
+
+    Ok(true)
+}
+
+fn run_app<B: Backend>(
+    terminal: &mut Terminal<B>,
+    mut editor: AutoCursorTextArea,
+) -> io::Result<()> {
+    loop {
+        terminal.draw(|f| ui(f, &mut editor))?;
+
+        if let Event::Key(key) = event::read()? {
+            match handle_key_press(key, &mut editor) {
+                Ok(should_continue) => {
+                    if !should_continue {
+                        break;
+                    }
+                }
+                Err(e) => {
+                    editor.set_debug_message(format!("Error: {e}"));
+                }
+            }
+        }
+    }
+
+    Ok(())
+}
+
+fn ui(f: &mut Frame, editor: &mut AutoCursorTextArea) {
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([Constraint::Min(8), Constraint::Length(8)])
+        .split(f.area());
+
+    render_textarea(f, chunks[0], editor);
+    render_status_and_help(f, chunks[1], editor);
+}
+
+fn render_textarea(
+    f: &mut Frame,
+    area: ratatui::layout::Rect,
+    editor: &mut AutoCursorTextArea,
+) {
+    let block = Block::default()
+        .borders(Borders::ALL)
+        .title("🎯 Textarea with Automatic Cursor Management");
+
+    let textarea_widget = TextArea::default().block(block.clone());
+
+    f.render_stateful_widget(textarea_widget, area, &mut editor.textarea);
+
+    // Set cursor position for terminal cursor
+    // Always show cursor - CursorManager handles the style (block/bar/blinking)
+    let (cx, cy) = editor.textarea.cursor(area, Some(&block));
+    f.set_cursor_position((cx, cy));
+}
+
+fn render_status_and_help(
+    f: &mut Frame,
+    area: ratatui::layout::Rect,
+    editor: &AutoCursorTextArea,
+) {
+    let chunks = Layout::default()
+        .direction(Direction::Vertical)
+        .constraints([Constraint::Length(3), Constraint::Length(5)])
+        .split(area);
+
+    // Status bar with cursor information
+    let mode_text = match editor.mode() {
+        AppMode::Edit => "INSERT | (bar cursor)",
+        AppMode::ReadOnly => "NORMAL █ (block cursor)",
+        AppMode::Highlight => "VISUAL █ (blinking block)",
+        _ => "NORMAL █ (block cursor)",
+    };
+
+    let status_text = if editor.has_pending_command() {
+        format!("-- {} -- {} [{}]", mode_text, editor.debug_message(), editor.get_command_buffer())
+    } else if editor.has_unsaved_changes() {
+        format!("-- {} -- [Modified] {} | {}", mode_text, editor.debug_message(), editor.get_cursor_info())
+    } else {
+        format!("-- {} -- {} | {}", mode_text, editor.debug_message(), editor.get_cursor_info())
+    };
+
+    let status = Paragraph::new(Line::from(Span::raw(status_text)))
+        .block(Block::default().borders(Borders::ALL).title("🎯 Automatic Cursor Status"));
+
+    f.render_widget(status, chunks[0]);
+
+    // Help text
+    let help_text = match editor.mode() {
+        AppMode::ReadOnly => {
+            if editor.has_pending_command() {
+                match editor.get_command_buffer() {
+                    "g" => "Press 'g' again for first line, or any other key to cancel",
+                    _ => "Pending command... (Esc to cancel)"
+                }
+            } else {
+                "🎯 CURSOR-STYLE DEMO: Normal █ | Insert | \n\
+                Normal: hjkl/arrows=move, w/b/e=words, W/B/E=WORDS, 0/$=line, g/G=first/last\n\
+                i/a/A/o/O=insert, x/X=delete, ?=info\n\
+                F1=demo manual cursor, F2=restore automatic, Ctrl+Q=quit"
+            }
+        }
+        AppMode::Edit => {
+            "🎯 INSERT MODE - Cursor: | (bar)\n\
+            Type to edit text, arrows=move, Enter=new line\n\
+            Esc=normal mode"
+        }
+        AppMode::Highlight => {
+            "🎯 VISUAL MODE - Cursor: █ (blinking block)\n\
+            hjkl/arrows=extend selection\n\
+            Esc=normal mode"
+        }
+        _ => "🎯 Watch the cursor change automatically!"
+    };
+
+    let help = Paragraph::new(help_text)
+        .block(Block::default().borders(Borders::ALL).title("🚀 Automatic Cursor Management"))
+        .style(Style::default().fg(Color::Gray));
+
+    f.render_widget(help, chunks[1]);
+}
+
+fn main() -> Result<(), Box<dyn std::error::Error>> {
+    // Print feature status
+    println!("🎯 Canvas Textarea Cursor Auto Demo");
+    println!("✅ cursor-style feature: ENABLED");
+    println!("✅ textarea feature: ENABLED");
+    println!("🚀 Automatic cursor management: ACTIVE");
+    println!("📖 Watch your terminal cursor change based on mode!");
+    println!();
+
+    enable_raw_mode()?;
+    let mut stdout = io::stdout();
+    execute!(stdout, EnterAlternateScreen, EnableMouseCapture)?;
+    let backend = CrosstermBackend::new(stdout);
+    let mut terminal = Terminal::new(backend)?;
+
+    let mut editor = AutoCursorTextArea::new();
+
+    // Initialize with normal mode - library automatically sets block cursor
+    editor.exit_to_normal_mode()?;
+
+    let res = run_app(&mut terminal, editor);
+
+    // Reset cursor on exit
+    CursorManager::reset()?;
+
+    disable_raw_mode()?;
+    execute!(
+        terminal.backend_mut(),
+        LeaveAlternateScreen,
+        DisableMouseCapture
+    )?;
+    terminal.show_cursor()?;
+
+    if let Err(err) = res {
+        println!("{err:?}");
+    }
+
+    println!("🎯 Cursor automatically reset to default!");
+    Ok(())
+}
--- a/canvas/examples/validation_1.rs
+++ b/canvas/examples/validation_1.rs
@@ -34,7 +34,6 @@ use ratatui::{
    widgets::{Block, Borders, Paragraph, Wrap},
    Frame, Terminal,
 };
-
 use canvas::{
    canvas::{
        gui::render_canvas_default,
@@ -62,10 +61,8 @@ struct ValidationFormEditor<D: DataProvider> {
 impl<D: DataProvider> ValidationFormEditor<D> {
    fn new(data_provider: D) -> Self {
        let mut editor = FormEditor::new(data_provider);
-        
        // Enable validation by default
        editor.set_validation_enabled(true);
-        
        Self {
            editor,
            has_unsaved_changes: false,
@@ -98,7 +95,6 @@ impl<D: DataProvider> ValidationFormEditor<D> {
    fn toggle_validation(&mut self) {
        self.validation_enabled = !self.validation_enabled;
        self.editor.set_validation_enabled(self.validation_enabled);
-        
        if self.validation_enabled {
            self.debug_message = "✅ Validation ENABLED - Try exceeding limits!".to_string();
        } else {
@@ -110,14 +106,12 @@ impl<D: DataProvider> ValidationFormEditor<D> {
        if !self.validation_enabled {
            return (true, None);
        }
-        
        let can_switch = self.editor.can_switch_fields();
        let reason = if !can_switch {
            self.editor.field_switch_block_reason()
        } else {
            None
        };
-        
        (can_switch, reason)
    }

@@ -125,11 +119,9 @@ impl<D: DataProvider> ValidationFormEditor<D> {
        if !self.validation_enabled {
            return "❌ DISABLED".to_string();
        }
-
        if self.field_switch_blocked {
            return "🚫 SWITCH BLOCKED".to_string();
        }
-
        let summary = self.editor.validation_summary();
        if summary.has_errors() {
            format!("❌ {} ERRORS", summary.error_fields)
@@ -149,10 +141,10 @@ impl<D: DataProvider> ValidationFormEditor<D> {
                self.debug_message = "✅ Current field is valid!".to_string();
            }
            ValidationResult::Warning { message } => {
-                self.debug_message = format!("⚠️  Warning: {}", message);
+                self.debug_message = format!("⚠️  Warning: {message}");
            }
            ValidationResult::Error { message } => {
-                self.debug_message = format!("❌ Error: {}", message);
+                self.debug_message = format!("❌ Error: {message}");
            }
        }
    }
@@ -162,7 +154,6 @@ impl<D: DataProvider> ValidationFormEditor<D> {
        for i in 0..field_count {
            self.editor.validate_field(i);
        }
-        
        let summary = self.editor.validation_summary();
        self.debug_message = format!(
            "🔍 Validated all fields: {} valid, {} warnings, {} errors",
@@ -198,7 +189,7 @@ impl<D: DataProvider> ValidationFormEditor<D> {
            Err(e) => {
                self.field_switch_blocked = true;
                self.block_reason = Some(e.to_string());
-                self.debug_message = format!("🚫 Field switch blocked: {}", e);
+                self.debug_message = format!("🚫 Field switch blocked: {e}");
            }
        }
    }
@@ -213,7 +204,7 @@ impl<D: DataProvider> ValidationFormEditor<D> {
            Err(e) => {
                self.field_switch_blocked = true;
                self.block_reason = Some(e.to_string());
-                self.debug_message = format!("🚫 Field switch blocked: {}", e);
+                self.debug_message = format!("🚫 Field switch blocked: {e}");
            }
        }
    }
@@ -250,21 +241,17 @@ impl<D: DataProvider> ValidationFormEditor<D> {
        if !self.validation_enabled {
            return;
        }
-
-        if let Some(result) = self.editor.current_field_validation() {
-            match result {
-                ValidationResult::Valid => {
-                    self.debug_message = format!("Field {}: ✅ Valid", self.editor.current_field() + 1);
-                }
-                ValidationResult::Warning { message } => {
-                    self.debug_message = format!("Field {}: ⚠️  {}", self.editor.current_field() + 1, message);
-                }
-                ValidationResult::Error { message } => {
-                    self.debug_message = format!("Field {}: ❌ {}", self.editor.current_field() + 1, message);
-                }
+        let result = self.editor.validate_current_field();
+        match result {
+            ValidationResult::Valid => {
+                self.debug_message = format!("Field {}: ✅ Valid", self.editor.current_field() + 1);
+            }
+            ValidationResult::Warning { message } => {
+                self.debug_message = format!("Field {}: ⚠️  {}", self.editor.current_field() + 1, message);
+            }
+            ValidationResult::Error { message } => {
+                self.debug_message = format!("Field {}: ❌ {}", self.editor.current_field() + 1, message);
            }
-        } else {
-            self.debug_message = format!("Field {}: 🔍 Not validated yet", self.editor.current_field() + 1);
        }
    }

@@ -293,26 +280,28 @@ impl<D: DataProvider> ValidationFormEditor<D> {
        if result.is_ok() {
            self.has_unsaved_changes = true;
            // Show real-time validation feedback
-            if let Some(validation_result) = self.editor.current_field_validation() {
-                match validation_result {
-                    ValidationResult::Valid => {
-                        // Don't spam with valid messages, just show character count if applicable
-                        if let Some(limits) = self.get_current_field_limits() {
-                            if let Some(status) = limits.status_text(self.editor.current_text()) {
-                                self.debug_message = format!("✏️  {}", status);
-                            }
+            let validation_result = self.editor.validate_current_field();
+            match validation_result {
+                ValidationResult::Valid => {
+                    // Don't spam with valid messages, just show character count if applicable
+                    if let Some(limits) = self.get_current_field_limits() {
+                        let field_index = self.editor.current_field();
+                        if let Some(status) = limits.status_text(
+                            self.editor.data_provider().field_value(field_index)
+                        ) {
+                            self.debug_message = format!("✏️  {status}");
                        }
                    }
-                    ValidationResult::Warning { message } => {
-                        self.debug_message = format!("⚠️  {}", message);
-                    }
-                    ValidationResult::Error { message } => {
-                        self.debug_message = format!("❌ {}", message);
-                    }
+                }
+                ValidationResult::Warning { message } => {
+                    self.debug_message = format!("⚠️  {message}");
+                }
+                ValidationResult::Error { message } => {
+                    self.debug_message = format!("❌ {message}");
                }
            }
        }
-        Ok(result?)
+        result
    }

    fn get_current_field_limits(&self) -> Option<&CharacterLimits> {
@@ -328,7 +317,7 @@ impl<D: DataProvider> ValidationFormEditor<D> {
            self.has_unsaved_changes = true;
            self.debug_message = "⌫ Deleted character".to_string();
        }
-        Ok(result?)
+        result
    }

    fn delete_forward(&mut self) -> anyhow::Result<()> {
@@ -337,7 +326,7 @@ impl<D: DataProvider> ValidationFormEditor<D> {
            self.has_unsaved_changes = true;
            self.debug_message = "⌦ Deleted character".to_string();
        }
-        Ok(result?)
+        result
    }

    // === DELEGATE TO ORIGINAL EDITOR ===
@@ -354,7 +343,8 @@ impl<D: DataProvider> ValidationFormEditor<D> {
    }

    fn current_text(&self) -> &str {
-        self.editor.current_text()
+        let field_index = self.editor.current_field();
+        self.editor.data_provider().field_value(field_index)
    }

    fn data_provider(&self) -> &D {
@@ -380,7 +370,7 @@ impl<D: DataProvider> ValidationFormEditor<D> {
            Err(e) => {
                self.field_switch_blocked = true;
                self.block_reason = Some(e.to_string());
-                self.debug_message = format!("🚫 Cannot move to next field: {}", e);
+                self.debug_message = format!("🚫 Cannot move to next field: {e}");
            }
        }
    }
@@ -395,7 +385,7 @@ impl<D: DataProvider> ValidationFormEditor<D> {
            Err(e) => {
                self.field_switch_blocked = true;
                self.block_reason = Some(e.to_string());
-                self.debug_message = format!("🚫 Cannot move to previous field: {}", e);
+                self.debug_message = format!("🚫 Cannot move to previous field: {e}");
            }
        }
    }
@@ -536,7 +526,6 @@ fn handle_key_press(
            editor.enter_edit_mode();
            editor.clear_command_buffer();
        }
-
        // Escape: Exit edit mode
        (_, KeyCode::Esc, _) => {
            if mode == AppMode::Edit {
@@ -629,7 +618,6 @@ fn handle_key_press(
                summary.validated_fields
            ));
        }
-
        _ => {
            if editor.has_pending_command() {
                editor.clear_command_buffer();
@@ -656,12 +644,11 @@ fn run_app<B: Backend>(
                    }
                }
                Err(e) => {
-                    editor.set_debug_message(format!("Error: {}", e));
+                    editor.set_debug_message(format!("Error: {e}"));
                }
            }
        }
    }
-
    Ok(())
 }

@@ -705,27 +692,27 @@ fn render_validation_status(
    };

    let validation_status = editor.get_validation_status();
+
    let status_text = if editor.has_pending_command() {
-        format!("-- {} -- {} [{}] | Validation: {}", 
+        format!("-- {} -- {} [{}] | Validation: {}",
                mode_text, editor.debug_message(), editor.get_command_buffer(), validation_status)
    } else if editor.has_unsaved_changes() {
-        format!("-- {} -- [Modified] {} | Validation: {}", 
+        format!("-- {} -- [Modified] {} | Validation: {}",
                mode_text, editor.debug_message(), validation_status)
    } else {
-        format!("-- {} -- {} | Validation: {}", 
+        format!("-- {} -- {} | Validation: {}",
                mode_text, editor.debug_message(), validation_status)
    };

    let status = Paragraph::new(Line::from(Span::raw(status_text)))
        .block(Block::default().borders(Borders::ALL).title("🔍 Validation Status"));
-
    f.render_widget(status, chunks[0]);

    // Validation summary with field switching info
    let summary = editor.editor.validation_summary();
    let summary_text = if editor.validation_enabled {
        let switch_info = if editor.field_switch_blocked {
-            format!("\n🚫 Field switching blocked: {}", 
+            format!("\n🚫 Field switching blocked: {}",
                   editor.block_reason.as_deref().unwrap_or("Unknown reason"))
        } else {
            let (can_switch, reason) = editor.check_field_switch_allowed();
@@ -764,7 +751,6 @@ fn render_validation_status(
        .block(Block::default().borders(Borders::ALL).title("📈 Validation Overview"))
        .style(summary_style)
        .wrap(Wrap { trim: true });
-
    f.render_widget(validation_summary, chunks[1]);

    // Enhanced help text
@@ -791,7 +777,6 @@ fn render_validation_status(
        .block(Block::default().borders(Borders::ALL).title("🚀 Validation Commands"))
        .style(Style::default().fg(Color::Gray))
        .wrap(Wrap { trim: true });
-
    f.render_widget(help, chunks[2]);
 }

@@ -816,10 +801,10 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {

    let data = ValidationDemoData::new();
    let mut editor = ValidationFormEditor::new(data);
-
+    
    // Initialize with normal mode - library automatically sets block cursor
    editor.set_mode(AppMode::ReadOnly);
-
+    
    // Demonstrate that CursorManager is available and working
    CursorManager::update_for_mode(AppMode::ReadOnly)?;

@@ -838,7 +823,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
    terminal.show_cursor()?;

    if let Err(err) = res {
-        println!("{:?}", err);
+        println!("{err:?}");
    }

    println!("🔍 Validation demo completed!");
--- a/canvas/examples/validation_2.rs
+++ b/canvas/examples/validation_2.rs
@@ -71,12 +71,12 @@ impl<D: DataProvider> AdvancedPatternFormEditor<D> {

    // ... (keeping all the same methods as before for brevity)
    // [All the previous methods: clear_command_buffer, add_to_command_buffer, etc.]
-    
+
    fn clear_command_buffer(&mut self) { self.command_buffer.clear(); }
    fn add_to_command_buffer(&mut self, ch: char) { self.command_buffer.push(ch); }
    fn get_command_buffer(&self) -> &str { &self.command_buffer }
    fn has_pending_command(&self) -> bool { !self.command_buffer.is_empty() }
-    
+
    fn toggle_validation(&mut self) {
        self.validation_enabled = !self.validation_enabled;
        self.editor.set_validation_enabled(self.validation_enabled);
@@ -89,36 +89,36 @@ impl<D: DataProvider> AdvancedPatternFormEditor<D> {

    fn move_left(&mut self) { self.editor.move_left(); self.field_switch_blocked = false; self.block_reason = None; }
    fn move_right(&mut self) { self.editor.move_right(); self.field_switch_blocked = false; self.block_reason = None; }
-    
+
    fn move_up(&mut self) {
        match self.editor.move_up() {
            Ok(()) => { self.update_field_validation_status(); self.field_switch_blocked = false; self.block_reason = None; }
-            Err(e) => { self.field_switch_blocked = true; self.block_reason = Some(e.to_string()); self.debug_message = format!("🚫 Field switch blocked: {}", e); }
+            Err(e) => { self.field_switch_blocked = true; self.block_reason = Some(e.to_string()); self.debug_message = format!("🚫 Field switch blocked: {e}"); }
        }
    }
-    
+
    fn move_down(&mut self) {
        match self.editor.move_down() {
            Ok(()) => { self.update_field_validation_status(); self.field_switch_blocked = false; self.block_reason = None; }
-            Err(e) => { self.field_switch_blocked = true; self.block_reason = Some(e.to_string()); self.debug_message = format!("🚫 Field switch blocked: {}", e); }
+            Err(e) => { self.field_switch_blocked = true; self.block_reason = Some(e.to_string()); self.debug_message = format!("🚫 Field switch blocked: {e}"); }
        }
    }

    fn move_line_start(&mut self) { self.editor.move_line_start(); }
    fn move_line_end(&mut self) { self.editor.move_line_end(); }
-    
+
    fn enter_edit_mode(&mut self) {
        // Library will automatically update cursor to bar | in insert mode
        self.editor.enter_edit_mode();
        self.debug_message = "✏️  INSERT MODE - Cursor: Steady Bar | - Testing advanced pattern validation".to_string();
    }
-    
+
    fn enter_append_mode(&mut self) {
        // Library will automatically update cursor to bar | in insert mode
        self.editor.enter_append_mode();
        self.debug_message = "✏️  INSERT (append) - Cursor: Steady Bar | - Advanced patterns active".to_string();
    }
-    
+
    fn exit_edit_mode(&mut self) {
        // Library will automatically update cursor to block █ in normal mode
        self.editor.exit_edit_mode();
@@ -129,34 +129,36 @@ impl<D: DataProvider> AdvancedPatternFormEditor<D> {
    fn insert_char(&mut self, ch: char) -> anyhow::Result<()> {
        let result = self.editor.insert_char(ch);
        if result.is_ok() {
-            if let Some(validation_result) = self.editor.current_field_validation() {
-                match validation_result {
-                    ValidationResult::Valid => { self.debug_message = "✅ Character accepted".to_string(); }
-                    ValidationResult::Warning { message } => { self.debug_message = format!("⚠️  Warning: {}", message); }
-                    ValidationResult::Error { message } => { self.debug_message = format!("❌ Pattern violation: {}", message); }
-                }
+            let validation_result = self.editor.validate_current_field();
+            match validation_result {
+                ValidationResult::Valid => { self.debug_message = "✅ Character accepted".to_string(); }
+                ValidationResult::Warning { message } => { self.debug_message = format!("⚠️  Warning: {message}"); }
+                ValidationResult::Error { message } => { self.debug_message = format!("❌ Pattern violation: {message}"); }
            }
        }
-        Ok(result?)
+        result
    }

    fn delete_backward(&mut self) -> anyhow::Result<()> {
        let result = self.editor.delete_backward();
        if result.is_ok() { self.debug_message = "⌫ Character deleted".to_string(); }
-        Ok(result?)
+        result
    }

    fn delete_forward(&mut self) -> anyhow::Result<()> {
        let result = self.editor.delete_forward();
        if result.is_ok() { self.debug_message = "⌦ Character deleted".to_string(); }
-        Ok(result?)
+        result
    }

    // Delegate methods
    fn current_field(&self) -> usize { self.editor.current_field() }
    fn cursor_position(&self) -> usize { self.editor.cursor_position() }
    fn mode(&self) -> AppMode { self.editor.mode() }
-    fn current_text(&self) -> &str { self.editor.current_text() }
+    fn current_text(&self) -> &str {
+        let field_index = self.editor.current_field();
+        self.editor.data_provider().field_value(field_index)
+    }
    fn data_provider(&self) -> &D { self.editor.data_provider() }
    fn ui_state(&self) -> &canvas::EditorState { self.editor.ui_state() }
    fn set_mode(&mut self, mode: AppMode) { self.editor.set_mode(mode); }
@@ -164,14 +166,14 @@ impl<D: DataProvider> AdvancedPatternFormEditor<D> {
    fn next_field(&mut self) {
        match self.editor.next_field() {
            Ok(()) => { self.update_field_validation_status(); self.field_switch_blocked = false; self.block_reason = None; }
-            Err(e) => { self.field_switch_blocked = true; self.block_reason = Some(e.to_string()); self.debug_message = format!("🚫 Cannot move to next field: {}", e); }
+            Err(e) => { self.field_switch_blocked = true; self.block_reason = Some(e.to_string()); self.debug_message = format!("🚫 Cannot move to next field: {e}"); }
        }
    }

    fn prev_field(&mut self) {
        match self.editor.prev_field() {
            Ok(()) => { self.update_field_validation_status(); self.field_switch_blocked = false; self.block_reason = None; }
-            Err(e) => { self.field_switch_blocked = true; self.block_reason = Some(e.to_string()); self.debug_message = format!("🚫 Cannot move to previous field: {}", e); }
+            Err(e) => { self.field_switch_blocked = true; self.block_reason = Some(e.to_string()); self.debug_message = format!("🚫 Cannot move to previous field: {e}"); }
        }
    }

@@ -180,12 +182,11 @@ impl<D: DataProvider> AdvancedPatternFormEditor<D> {

    fn update_field_validation_status(&mut self) {
        if !self.validation_enabled { return; }
-        if let Some(result) = self.editor.current_field_validation() {
-            match result {
-                ValidationResult::Valid => { self.debug_message = format!("Field {}: ✅ Pattern valid", self.editor.current_field() + 1); }
-                ValidationResult::Warning { message } => { self.debug_message = format!("Field {}: ⚠️  {}", self.editor.current_field() + 1, message); }
-                ValidationResult::Error { message } => { self.debug_message = format!("Field {}: ❌ {}", self.editor.current_field() + 1, message); }
-            }
+        let result = self.editor.validate_current_field();
+        match result {
+            ValidationResult::Valid => { self.debug_message = format!("Field {}: ✅ Pattern valid", self.editor.current_field() + 1); }
+            ValidationResult::Warning { message } => { self.debug_message = format!("Field {}: ⚠️  {}", self.editor.current_field() + 1, message); }
+            ValidationResult::Error { message } => { self.debug_message = format!("Field {}: ❌ {}", self.editor.current_field() + 1, message); }
        }
    }

@@ -384,7 +385,7 @@ impl DataProvider for AdvancedPatternData {
                            // Even positions (0,2,4...): vowels (a,e,i,o,u)
                            // Odd positions (1,3,5...): consonants
                            let vowels = ['a', 'e', 'i', 'o', 'u', 'A', 'E', 'I', 'O', 'U'];
-                            
+
                            // For demo purposes, we'll just accept alphabetic characters
                            // In real usage, you'd implement the alternating logic based on position
                            c.is_alphabetic()
@@ -491,7 +492,7 @@ fn run_app<B: Backend>(
                    }
                }
                Err(e) => {
-                    editor.set_debug_message(format!("Error: {}", e));
+                    editor.set_debug_message(format!("Error: {e}"));
                }
            }
        }
@@ -653,7 +654,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
    terminal.show_cursor()?;

    if let Err(err) = res {
-        println!("{:?}", err);
+        println!("{err:?}");
    }

    println!("🚀 Advanced pattern validation demo completed!");
--- a/canvas/examples/validation_3.rs
+++ b/canvas/examples/validation_3.rs
@@ -54,7 +54,6 @@ use canvas::{
    },
    DataProvider, FormEditor,
    ValidationConfig, ValidationConfigBuilder, DisplayMask,
-    validation::mask::MaskDisplayMode,
 };

 // Enhanced FormEditor wrapper for mask demonstration
@@ -108,7 +107,7 @@ impl<D: DataProvider> MaskDemoFormEditor<D> {

    fn get_current_field_info(&self) -> (String, String, String) {
        let field_index = self.editor.current_field();
-        let raw_data = self.editor.current_text();
+        let raw_data = self.editor.data_provider().field_value(field_index);
        let display_data = if self.validation_enabled {
            self.editor.current_display_text()
        } else {
@@ -117,8 +116,8 @@ impl<D: DataProvider> MaskDemoFormEditor<D> {

        let mask_info = if let Some(config) = self.editor.validation_state().get_field_config(field_index) {
            if let Some(mask) = &config.display_mask {
-                format!("Pattern: '{}', Mode: {:?}", 
-                       mask.pattern(), 
+                format!("Pattern: '{}', Mode: {:?}",
+                       mask.pattern(),
                       mask.display_mode())
            } else {
                "No mask configured".to_string()
@@ -131,37 +130,37 @@ impl<D: DataProvider> MaskDemoFormEditor<D> {
    }

    // === ENHANCED MOVEMENT WITH MASK AWARENESS ===
-    fn move_left(&mut self) { 
-        self.editor.move_left(); 
+    fn move_left(&mut self) {
+        self.editor.move_left();
        self.update_cursor_info();
    }

-    fn move_right(&mut self) { 
-        self.editor.move_right(); 
+    fn move_right(&mut self) {
+        self.editor.move_right();
        self.update_cursor_info();
    }

    fn move_up(&mut self) {
        match self.editor.move_up() {
            Ok(()) => { self.update_field_info(); }
-            Err(e) => { self.debug_message = format!("🚫 Field switch blocked: {}", e); }
+            Err(e) => { self.debug_message = format!("🚫 Field switch blocked: {e}"); }
        }
    }

    fn move_down(&mut self) {
        match self.editor.move_down() {
            Ok(()) => { self.update_field_info(); }
-            Err(e) => { self.debug_message = format!("🚫 Field switch blocked: {}", e); }
+            Err(e) => { self.debug_message = format!("🚫 Field switch blocked: {e}"); }
        }
    }

-    fn move_line_start(&mut self) { 
-        self.editor.move_line_start(); 
+    fn move_line_start(&mut self) {
+        self.editor.move_line_start();
        self.update_cursor_info();
    }

-    fn move_line_end(&mut self) { 
-        self.editor.move_line_end(); 
+    fn move_line_end(&mut self) {
+        self.editor.move_line_end();
        self.update_cursor_info();
    }

@@ -170,16 +169,16 @@ impl<D: DataProvider> MaskDemoFormEditor<D> {
            let raw_pos = self.editor.cursor_position();
            let display_pos = self.editor.display_cursor_position();
            if raw_pos != display_pos {
-                self.debug_message = format!("📍 Cursor: Raw pos {} → Display pos {} (mask active)", raw_pos, display_pos);
+                self.debug_message = format!("📍 Cursor: Raw pos {raw_pos} → Display pos {display_pos} (mask active)");
            } else {
-                self.debug_message = format!("📍 Cursor at position {} (no mask offset)", raw_pos);
+                self.debug_message = format!("📍 Cursor at position {raw_pos} (no mask offset)");
            }
        }
    }

    fn update_field_info(&mut self) {
        let field_name = self.editor.data_provider().field_name(self.editor.current_field());
-        self.debug_message = format!("📝 Switched to: {}", field_name);
+        self.debug_message = format!("📝 Switched to: {field_name}");
    }

    // === MODE TRANSITIONS ===
@@ -206,12 +205,12 @@ impl<D: DataProvider> MaskDemoFormEditor<D> {
        if result.is_ok() {
            let (raw, display, _) = self.get_current_field_info();
            if raw != display {
-                self.debug_message = format!("✏️ Added '{}': Raw='{}' Display='{}'", ch, raw, display);
+                self.debug_message = format!("✏️ Added '{ch}': Raw='{raw}' Display='{display}'");
            } else {
-                self.debug_message = format!("✏️ Added '{}': '{}'", ch, raw);
+                self.debug_message = format!("✏️ Added '{ch}': '{raw}'");
            }
        }
-        Ok(result?)
+        result
    }

    // === DELETE OPERATIONS ===
@@ -221,7 +220,7 @@ impl<D: DataProvider> MaskDemoFormEditor<D> {
            self.debug_message = "⌫ Character deleted".to_string();
            self.update_cursor_info();
        }
-        Ok(result?)
+        result
    }

    fn delete_forward(&mut self) -> anyhow::Result<()> {
@@ -230,32 +229,35 @@ impl<D: DataProvider> MaskDemoFormEditor<D> {
            self.debug_message = "⌦ Character deleted".to_string();
            self.update_cursor_info();
        }
-        Ok(result?)
+        result
    }

    // === DELEGATE TO ORIGINAL EDITOR ===
    fn current_field(&self) -> usize { self.editor.current_field() }
    fn cursor_position(&self) -> usize { self.editor.cursor_position() }
    fn mode(&self) -> AppMode { self.editor.mode() }
-    fn current_text(&self) -> &str { self.editor.current_text() }
+    fn current_text(&self) -> &str {
+        let field_index = self.editor.current_field();
+        self.editor.data_provider().field_value(field_index)
+    }
    fn data_provider(&self) -> &D { self.editor.data_provider() }
    fn ui_state(&self) -> &canvas::EditorState { self.editor.ui_state() }
-    fn set_mode(&mut self, mode: AppMode) { 
+    fn set_mode(&mut self, mode: AppMode) {
        // Library automatically updates cursor for the mode
-        self.editor.set_mode(mode); 
+        self.editor.set_mode(mode);
    }

    fn next_field(&mut self) {
        match self.editor.next_field() {
            Ok(()) => { self.update_field_info(); }
-            Err(e) => { self.debug_message = format!("🚫 Cannot move to next field: {}", e); }
+            Err(e) => { self.debug_message = format!("🚫 Cannot move to next field: {e}"); }
        }
    }

    fn prev_field(&mut self) {
        match self.editor.prev_field() {
            Ok(()) => { self.update_field_info(); }
-            Err(e) => { self.debug_message = format!("🚫 Cannot move to previous field: {}", e); }
+            Err(e) => { self.debug_message = format!("🚫 Cannot move to previous field: {e}"); }
        }
    }

@@ -265,7 +267,7 @@ impl<D: DataProvider> MaskDemoFormEditor<D> {

    fn show_mask_details(&mut self) {
        let (raw, display, mask_info) = self.get_current_field_info();
-        self.debug_message = format!("🔍 Field {}: {} | Raw: '{}' Display: '{}'", 
+        self.debug_message = format!("🔍 Field {}: {} | Raw: '{}' Display: '{}'",
                                   self.current_field() + 1, mask_info, raw, display);
    }

@@ -284,7 +286,7 @@ impl<D: DataProvider> MaskDemoFormEditor<D> {
            }
        }

-        format!("🎭 {} MASKS", mask_count)
+        format!("🎭 {mask_count} MASKS")
    }
 }

@@ -331,11 +333,11 @@ impl DataProvider for MaskDemoData {
                    .build())
            }
            1 => {
-                // 📞 Phone (Template) - FIXED: Perfect mask/limit coordination  
+                // 📞 Phone (Template) - FIXED: Perfect mask/limit coordination
                let phone_template = DisplayMask::new("(###) ###-####", '#')
                    .with_template('_');
                Some(ValidationConfigBuilder::new()
-                    .with_display_mask(phone_template)  
+                    .with_display_mask(phone_template)
                    .with_max_length(10)  // ✅ CRITICAL: Exactly matches 10 input positions
                    .build())
            }
@@ -361,7 +363,7 @@ impl DataProvider for MaskDemoData {
                let ssn_mask = DisplayMask::new("XXX-XX-XXXX", 'X');
                Some(ValidationConfigBuilder::new()
                    .with_display_mask(ssn_mask)
-                    .with_max_length(9)  // ✅ CRITICAL: Exactly matches 9 input positions  
+                    .with_max_length(9)  // ✅ CRITICAL: Exactly matches 9 input positions
                    .build())
            }
            6 => {
@@ -546,7 +548,7 @@ fn run_app<B: Backend>(
                    }
                }
                Err(e) => {
-                    editor.set_debug_message(format!("Error: {}", e));
+                    editor.set_debug_message(format!("Error: {e}"));
                }
            }
        }
@@ -595,9 +597,9 @@ fn render_mask_status(
    };

    let mask_status = editor.get_mask_status();
-    let status_text = format!("-- {} -- {} | Masks: {} | View: {}", 
-                             mode_text, 
-                             editor.debug_message(), 
+    let status_text = format!("-- {} -- {} | Masks: {} | View: {}",
+                             mode_text,
+                             editor.debug_message(),
                             mask_status,
                             if editor.show_raw_data { "RAW" } else { "FORMATTED" });

@@ -609,7 +611,7 @@ fn render_mask_status(
    // Data comparison showing raw vs display
    let (raw_data, display_data, mask_info) = editor.get_current_field_info();
    let field_name = editor.data_provider().field_name(editor.current_field());
-    
+
    let comparison_text = format!(
        "📝 Current Field: {}\n\
         🔧 Mask Config: {}\n\
@@ -648,7 +650,7 @@ fn render_mask_status(
             • Dynamic vs Template modes  • Custom separators  • Different input chars\n\
             \n\
             Commands: i/a=insert, m=mask details, r=toggle raw/display view\n\
-             Movement: hjkl/arrows=move, 0=$=line start/end, Tab=next field, F1=toggle masks\n\
+             Movement: hjkl/arrows=move, 0/$=line start/end, Tab=next field, F1=toggle masks\n\
             ?=detailed info, Ctrl+C=quit"
        }
        AppMode::Edit => {
@@ -723,7 +725,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
    CursorManager::reset()?;

    if let Err(err) = res {
-        println!("{:?}", err);
+        println!("{err:?}");
    }

    println!("🎭 Display mask demo completed!");
--- a/canvas/examples/validation_4.rs
+++ b/canvas/examples/validation_4.rs
@@ -1,6 +1,6 @@
 /* examples/validation_4.rs
   Enhanced Feature 4 Demo: Multiple custom formatters with comprehensive edge cases
-   
+
   Demonstrates:
   - Multiple formatter types: PSC, Phone, Credit Card, Date
   - Edge case handling: incomplete input, invalid chars, overflow
@@ -53,18 +53,18 @@ impl CustomFormatter for PSCFormatter {
        if raw.is_empty() {
            return FormattingResult::success("");
        }
-        
+
        // Validate: only digits allowed
        if !raw.chars().all(|c| c.is_ascii_digit()) {
            return FormattingResult::error("PSC must contain only digits");
        }
-        
+
        let len = raw.chars().count();
        match len {
            0 => FormattingResult::success(""),
            1..=3 => FormattingResult::success(raw),
            4 => FormattingResult::warning(
-                format!("{} ", &raw[..3]), 
+                format!("{} ", &raw[..3]),
                "PSC incomplete (4/5 digits)"
            ),
            5 => {
@@ -88,16 +88,16 @@ impl CustomFormatter for PhoneFormatter {
        if raw.is_empty() {
            return FormattingResult::success("");
        }
-        
+
        // Only digits allowed
        if !raw.chars().all(|c| c.is_ascii_digit()) {
            return FormattingResult::error("Phone must contain only digits");
        }
-        
+
        let len = raw.chars().count();
        match len {
            0 => FormattingResult::success(""),
-            1..=3 => FormattingResult::success(format!("({})", raw)),
+            1..=3 => FormattingResult::success(format!("({raw})")),
            4..=6 => FormattingResult::success(format!("({}) {}", &raw[..3], &raw[3..])),
            7..=10 => FormattingResult::success(format!("({}) {}-{}", &raw[..3], &raw[3..6], &raw[6..])),
            10 => {
@@ -120,11 +120,11 @@ impl CustomFormatter for CreditCardFormatter {
        if raw.is_empty() {
            return FormattingResult::success("");
        }
-        
+
        if !raw.chars().all(|c| c.is_ascii_digit()) {
            return FormattingResult::error("Card number must contain only digits");
        }
-        
+
        let mut formatted = String::new();
        for (i, ch) in raw.chars().enumerate() {
            if i > 0 && i % 4 == 0 {
@@ -132,10 +132,10 @@ impl CustomFormatter for CreditCardFormatter {
            }
            formatted.push(ch);
        }
-        
+
        let len = raw.chars().count();
        match len {
-            0..=15 => FormattingResult::warning(formatted, format!("Card incomplete ({}/16 digits)", len)),
+            0..=15 => FormattingResult::warning(formatted, format!("Card incomplete ({len}/16 digits)")),
            16 => FormattingResult::success(formatted),
            _ => FormattingResult::warning(formatted, "Card too long (extra digits shown)"),
        }
@@ -155,11 +155,11 @@ impl CustomFormatter for DateFormatter {
        if raw.is_empty() {
            return FormattingResult::success("");
        }
-        
+
        if !raw.chars().all(|c| c.is_ascii_digit()) {
            return FormattingResult::error("Date must contain only digits");
        }
-        
+
        let len = raw.len();
        match len {
            0 => FormattingResult::success(""),
@@ -170,23 +170,23 @@ impl CustomFormatter for DateFormatter {
                let month = &raw[..2];
                let day = &raw[2..4];
                let year = &raw[4..];
-                
+
                // Basic validation
                let m: u32 = month.parse().unwrap_or(0);
                let d: u32 = day.parse().unwrap_or(0);
-                
+
                if m == 0 || m > 12 {
                    FormattingResult::warning(
-                        format!("{}/{}/{}", month, day, year),
+                        format!("{month}/{day}/{year}"),
                        "Invalid month (01-12)"
                    )
                } else if d == 0 || d > 31 {
                    FormattingResult::warning(
-                        format!("{}/{}/{}", month, day, year),
+                        format!("{month}/{day}/{year}"),
                        "Invalid day (01-31)"
                    )
                } else {
-                    FormattingResult::success(format!("{}/{}/{}", month, day, year))
+                    FormattingResult::success(format!("{month}/{day}/{year}"))
                }
            },
            _ => FormattingResult::error("Date too long (MMDDYYYY format)"),
@@ -217,15 +217,15 @@ impl DataProvider for MultiFormatterDemoData {
    fn field_count(&self) -> usize {
        self.fields.len()
    }
-    
+
    fn field_name(&self, index: usize) -> &str {
        &self.fields[index].0
    }
-    
+
    fn field_value(&self, index: usize) -> &str {
        &self.fields[index].1
    }
-    
+
    fn set_field_value(&mut self, index: usize, value: String) {
        self.fields[index].1 = value;
    }
@@ -288,7 +288,7 @@ impl<D: DataProvider> EnhancedDemoEditor<D> {
        match self.editor.current_field() {
            0 => "PSC",
            1 => "Phone",
-            2 => "Credit Card", 
+            2 => "Credit Card",
            3 => "Date",
            _ => "Plain Text",
        }
@@ -320,16 +320,16 @@ impl<D: DataProvider> EnhancedDemoEditor<D> {
            // Edge cases
            vec!["00000", "0000000000", "0000000000000000", "99", "13012024", ""],
        ];
-        
+
        self.example_mode = (self.example_mode + 1) % examples.len();
        let current_examples = &examples[self.example_mode];
-        
+
        for (i, example) in current_examples.iter().enumerate() {
            if i < self.editor.data_provider().field_count() {
                self.editor.data_provider_mut().set_field_value(i, example.to_string());
            }
        }
-        
+
        let mode_names = ["Valid Examples", "Incomplete Input", "Invalid Characters", "Edge Cases"];
        self.debug_message = format!("📋 Loaded: {}", mode_names[self.example_mode]);
    }
@@ -364,9 +364,10 @@ impl<D: DataProvider> EnhancedDemoEditor<D> {
    }

    fn get_current_field_analysis(&self) -> (String, String, String, Option<String>) {
-        let raw = self.editor.current_text();
+        let field_index = self.editor.current_field();
+        let raw = self.editor.data_provider().field_value(field_index);
        let display = self.editor.current_display_text();
-        
+
        let status = if raw == display {
            if self.has_formatter() {
                if self.mode() == AppMode::Edit {
@@ -383,7 +384,7 @@ impl<D: DataProvider> EnhancedDemoEditor<D> {

        let warning = if self.validation_enabled && self.has_formatter() {
            // Check if there are any formatting warnings
-            if raw.len() > 0 {
+            if !raw.is_empty() {
                match self.editor.current_field() {
                    0 if raw.len() < 5 => Some(format!("PSC incomplete: {}/5", raw.len())),
                    1 if raw.len() < 10 => Some(format!("Phone incomplete: {}/10", raw.len())),
@@ -407,7 +408,7 @@ impl<D: DataProvider> EnhancedDemoEditor<D> {
        self.editor.enter_edit_mode();
        let field_type = self.current_field_type();
        let rules = self.get_input_rules();
-        self.debug_message = format!("✏️ INSERT MODE - Cursor: Steady Bar | - {} - {}", field_type, rules);
+        self.debug_message = format!("✏️ INSERT MODE - Cursor: Steady Bar | - {field_type} - {rules}");
    }

    fn exit_edit_mode(&mut self) {
@@ -428,9 +429,9 @@ impl<D: DataProvider> EnhancedDemoEditor<D> {
        if result.is_ok() {
            let (raw, display, _, _) = self.get_current_field_analysis();
            if raw != display && self.validation_enabled {
-                self.debug_message = format!("✏️ '{}' added - Real-time formatting active", ch);
+                self.debug_message = format!("✏️ '{ch}' added - Real-time formatting active");
            } else {
-                self.debug_message = format!("✏️ '{}' added", ch);
+                self.debug_message = format!("✏️ '{ch}' added");
            }
        }
        result
@@ -445,9 +446,10 @@ impl<D: DataProvider> EnhancedDemoEditor<D> {

        let raw_pos = self.editor.cursor_position();
        let display_pos = self.editor.display_cursor_position();
-        let raw = self.editor.current_text();
+        let field_index = self.editor.current_field();
+        let raw = self.editor.data_provider().field_value(field_index);
        let display = self.editor.current_display_text();
-        
+
        if raw_pos != display_pos {
            self.debug_message = format!(
                "🗺️ Position mapping: Raw[{}]='{}' ↔ Display[{}]='{}'",
@@ -457,7 +459,7 @@ impl<D: DataProvider> EnhancedDemoEditor<D> {
                display.chars().nth(display_pos).unwrap_or('∅')
            );
        } else {
-            self.debug_message = format!("📍 Cursor at position {} (no mapping needed)", raw_pos);
+            self.debug_message = format!("📍 Cursor at position {raw_pos} (no mapping needed)");
        }
    }

@@ -468,7 +470,7 @@ impl<D: DataProvider> EnhancedDemoEditor<D> {
    fn data_provider(&self) -> &D { self.editor.data_provider() }
    fn data_provider_mut(&mut self) -> &mut D { self.editor.data_provider_mut() }
    fn ui_state(&self) -> &canvas::EditorState { self.editor.ui_state() }
-    
+
    fn move_up(&mut self) { let _ = self.editor.move_up(); }
    fn move_down(&mut self) { let _ = self.editor.move_down(); }
    fn move_left(&mut self) { let _ = self.editor.move_left(); }
@@ -488,7 +490,7 @@ fn handle_key_press(
    let mode = editor.mode();

    // Quit
-    if matches!(key, KeyCode::F(10)) || 
+    if matches!(key, KeyCode::F(10)) ||
       (key == KeyCode::Char('q') && modifiers.contains(KeyModifiers::CONTROL)) ||
       (key == KeyCode::Char('c') && modifiers.contains(KeyModifiers::CONTROL)) {
        return Ok(false);
@@ -528,9 +530,9 @@ fn handle_key_press(
        // Field analysis
        (AppMode::ReadOnly, KeyCode::Char('?'), _) => {
            let (raw, display, status, warning) = editor.get_current_field_analysis();
-            let warning_text = warning.map(|w| format!(" ⚠️ {}", w)).unwrap_or_default();
+            let warning_text = warning.map(|w| format!(" ⚠️ {w}")).unwrap_or_default();
            editor.debug_message = format!(
-                "🔍 Field {}: {} | Raw: '{}' | Display: '{}'{}", 
+                "🔍 Field {}: {} | Raw: '{}' | Display: '{}'{}",
                editor.current_field() + 1, status, raw, display, warning_text
            );
        },
@@ -556,7 +558,7 @@ fn run_app<B: Backend>(
                    }
                }
                Err(e) => {
-                    editor.debug_message = format!("❌ Error: {}", e);
+                    editor.debug_message = format!("❌ Error: {e}");
                }
            }
        }
@@ -618,18 +620,18 @@ fn render_enhanced_status(
    let (raw, display, status, warning) = editor.get_current_field_analysis();
    let field_name = editor.data_provider().field_name(editor.current_field());
    let field_type = editor.current_field_type();
-    
+
    let mut analysis_lines = vec![
        format!("📝 Current: {} ({})", field_name, field_type),
        format!("🔧 Status: {}", status),
    ];

    if editor.show_raw_data || editor.mode() == AppMode::Edit {
-        analysis_lines.push(format!("💾 Raw Data: '{}'", raw));
-        analysis_lines.push(format!("✨ Display: '{}'", display));
+        analysis_lines.push(format!("💾 Raw Data: '{raw}'"));
+        analysis_lines.push(format!("✨ Display: '{display}'"));
    } else {
-        analysis_lines.push(format!("✨ User Sees: '{}'", display));
-        analysis_lines.push(format!("💾 Stored As: '{}'", raw));
+        analysis_lines.push(format!("✨ User Sees: '{display}'"));
+        analysis_lines.push(format!("💾 Stored As: '{raw}'"));
    }

    if editor.show_cursor_details {
@@ -641,7 +643,7 @@ fn render_enhanced_status(
    }

    if let Some(ref warn) = warning {
-        analysis_lines.push(format!("⚠️ Warning: {}", warn));
+        analysis_lines.push(format!("⚠️ Warning: {warn}"));
    }

    let analysis_color = if warning.is_some() {
@@ -740,7 +742,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
    CursorManager::reset()?;

    if let Err(err) = res {
-        println!("{:?}", err);
+        println!("{err:?}");
    }

    println!("🧩 Enhanced custom formatter demo completed!");
--- a/canvas/examples/validation_5.rs
+++ b/canvas/examples/validation_5.rs
@@ -1,9 +1,10 @@
 // examples/validation_5.rs
-//! Enhanced Feature 5: Comprehensive external validation (UI-only) demo with Feature 4 integration
+//! Enhanced Feature 5: Comprehensive external validation (UI-only) demo with automatic validation
 //!
 //! Demonstrates:
-//! - Multiple external validation types: PSC lookup, email domain check, username availability, 
+//! - Multiple external validation types: PSC lookup, email domain check, username availability,
 //!   API key validation, credit card verification
+//! - AUTOMATIC validation on field transitions (arrows, Tab, Esc)
 //! - Async validation simulation with realistic delays
 //! - Validation caching and debouncing
 //! - Progressive validation (local → remote)
@@ -15,7 +16,8 @@
 //! Controls:
 //! - i/a: insert/append
 //! - Esc: exit edit mode (triggers validation on configured fields)
-//! - Tab/Shift+Tab: next/prev field (triggers validation)
+//! - Tab/Shift+Tab: next/prev field (triggers validation automatically)
+//! - Arrow keys: move between fields (triggers validation automatically)
 //! - v: manually trigger validation of current field
 //! - V: validate all fields
 //! - c: clear external validation state for current field
@@ -37,7 +39,7 @@ compile_error!(
 );

 use std::io;
-use std::sync::Arc;
+use std::sync::{Arc, Mutex};
 use std::collections::HashMap;
 use std::time::{Instant, Duration};

@@ -85,13 +87,13 @@ impl ValidationResult {
            cached: false,
        }
    }
-    
+
    fn complete(mut self, state: ExternalValidationState) -> Self {
        self.state = state;
        self.completed_at = Some(Instant::now());
        self
    }
-    
+
    fn from_cache(state: ExternalValidationState, validation_type: String) -> Self {
        Self {
            state,
@@ -101,7 +103,7 @@ impl ValidationResult {
            cached: true,
        }
    }
-    
+
    fn duration(&self) -> Duration {
        self.completed_at.unwrap_or_else(Instant::now).duration_since(self.started_at)
    }
@@ -115,11 +117,11 @@ impl CustomFormatter for PSCFormatter {
        if raw.is_empty() {
            return FormattingResult::success("");
        }
-        
+
        if !raw.chars().all(|c| c.is_ascii_digit()) {
            return FormattingResult::error("PSC must contain only digits");
        }
-        
+
        match raw.len() {
            0 => FormattingResult::success(""),
            1..=3 => FormattingResult::success(raw.to_string()),
@@ -141,11 +143,11 @@ impl CustomFormatter for CreditCardFormatter {
        if raw.is_empty() {
            return FormattingResult::success("");
        }
-        
+
        if !raw.chars().all(|c| c.is_ascii_digit()) {
            return FormattingResult::error("Card number must contain only digits");
        }
-        
+
        let mut formatted = String::new();
        for (i, ch) in raw.chars().enumerate() {
            if i > 0 && i % 4 == 0 {
@@ -153,7 +155,7 @@ impl CustomFormatter for CreditCardFormatter {
            }
            formatted.push(ch);
        }
-        
+
        match raw.len() {
            0..=15 => FormattingResult::warning(formatted, "Card incomplete - validation pending"),
            16 => FormattingResult::success(formatted),
@@ -173,15 +175,15 @@ impl ValidationCache {
            results: HashMap::new(),
        }
    }
-    
+
    fn get(&self, key: &str) -> Option<&ExternalValidationState> {
        self.results.get(key)
    }
-    
+
    fn set(&mut self, key: String, result: ExternalValidationState) {
        self.results.insert(key, result);
    }
-    
+
    fn clear(&mut self) {
        self.results.clear();
    }
@@ -198,293 +200,293 @@ impl ValidationServices {
            cache: ValidationCache::new(),
        }
    }
-    
+
    /// PSC validation: simulates postal service API lookup
    fn validate_psc(&mut self, psc: &str) -> ExternalValidationState {
-        let cache_key = format!("psc:{}", psc);
+        let cache_key = format!("psc:{psc}");
        if let Some(cached) = self.cache.get(&cache_key) {
            return cached.clone();
        }
-        
+
        if psc.is_empty() {
            return ExternalValidationState::NotValidated;
        }
-        
+
        if !psc.chars().all(|c| c.is_ascii_digit()) || psc.len() != 5 {
-            let result = ExternalValidationState::Invalid { 
-                message: "Invalid PSC format".to_string(), 
-                suggestion: Some("Enter 5 digits".to_string()) 
+            let result = ExternalValidationState::Invalid {
+                message: "Invalid PSC format".to_string(),
+                suggestion: Some("Enter 5 digits".to_string())
            };
            self.cache.set(cache_key, result.clone());
            return result;
        }
-        
+
        // Simulate realistic PSC validation scenarios
        let result = match psc {
-            "00000" | "99999" => ExternalValidationState::Invalid { 
-                message: "PSC does not exist".to_string(), 
-                suggestion: Some("Check postal code".to_string()) 
+            "00000" | "99999" => ExternalValidationState::Invalid {
+                message: "PSC does not exist".to_string(),
+                suggestion: Some("Check postal code".to_string())
            },
            "01001" => ExternalValidationState::Valid(Some("Prague 1 - verified".to_string())),
            "10000" => ExternalValidationState::Valid(Some("Bratislava - verified".to_string())),
-            "12345" => ExternalValidationState::Warning { 
-                message: "PSC region deprecated - still valid".to_string() 
+            "12345" => ExternalValidationState::Warning {
+                message: "PSC region deprecated - still valid".to_string()
            },
-            "50000" => ExternalValidationState::Invalid { 
-                message: "PSC temporarily unavailable".to_string(), 
-                suggestion: Some("Try again later".to_string()) 
+            "50000" => ExternalValidationState::Invalid {
+                message: "PSC temporarily unavailable".to_string(),
+                suggestion: Some("Try again later".to_string())
            },
            _ => {
                // Most PSCs are valid with generic info
                let region = match &psc[..2] {
                    "01" | "02" | "03" => "Prague region",
-                    "10" | "11" | "12" => "Bratislava region", 
+                    "10" | "11" | "12" => "Bratislava region",
                    "20" | "21" => "Brno region",
                    _ => "Valid postal region"
                };
-                ExternalValidationState::Valid(Some(format!("{} - verified", region)))
+                ExternalValidationState::Valid(Some(format!("{region} - verified")))
            }
        };
-        
+
        self.cache.set(cache_key, result.clone());
        result
    }
-    
+
    /// Email validation: simulates domain checking
    fn validate_email(&mut self, email: &str) -> ExternalValidationState {
-        let cache_key = format!("email:{}", email);
+        let cache_key = format!("email:{email}");
        if let Some(cached) = self.cache.get(&cache_key) {
            return cached.clone();
        }
-        
+
        if email.is_empty() {
            return ExternalValidationState::NotValidated;
        }
-        
+
        if !email.contains('@') {
-            let result = ExternalValidationState::Invalid { 
-                message: "Email must contain @".to_string(), 
-                suggestion: Some("Format: user@domain.com".to_string()) 
+            let result = ExternalValidationState::Invalid {
+                message: "Email must contain @".to_string(),
+                suggestion: Some("Format: user@domain.com".to_string())
            };
            self.cache.set(cache_key, result.clone());
            return result;
        }
-        
+
        let parts: Vec<&str> = email.split('@').collect();
        if parts.len() != 2 || parts[0].is_empty() || parts[1].is_empty() {
-            let result = ExternalValidationState::Invalid { 
-                message: "Invalid email format".to_string(), 
-                suggestion: Some("Format: user@domain.com".to_string()) 
+            let result = ExternalValidationState::Invalid {
+                message: "Invalid email format".to_string(),
+                suggestion: Some("Format: user@domain.com".to_string())
            };
            self.cache.set(cache_key, result.clone());
            return result;
        }
-        
+
        let domain = parts[1];
        let result = match domain {
            "gmail.com" | "outlook.com" | "yahoo.com" => {
                ExternalValidationState::Valid(Some("Popular email provider - verified".to_string()))
            },
            "example.com" | "test.com" => {
-                ExternalValidationState::Warning { 
-                    message: "Test domain - email may not be deliverable".to_string() 
+                ExternalValidationState::Warning {
+                    message: "Test domain - email may not be deliverable".to_string()
                }
            },
            "blocked.com" | "spam.com" => {
-                ExternalValidationState::Invalid { 
-                    message: "Domain blocked".to_string(), 
-                    suggestion: Some("Use different email provider".to_string()) 
+                ExternalValidationState::Invalid {
+                    message: "Domain blocked".to_string(),
+                    suggestion: Some("Use different email provider".to_string())
                }
            },
            _ if domain.contains('.') => {
                ExternalValidationState::Valid(Some("Domain appears valid - not verified".to_string()))
            },
            _ => {
-                ExternalValidationState::Invalid { 
-                    message: "Invalid domain format".to_string(), 
-                    suggestion: Some("Domain must contain '.'".to_string()) 
+                ExternalValidationState::Invalid {
+                    message: "Invalid domain format".to_string(),
+                    suggestion: Some("Domain must contain '.'".to_string())
                }
            }
        };
-        
+
        self.cache.set(cache_key, result.clone());
        result
    }
-    
+
    /// Username validation: simulates availability checking
    fn validate_username(&mut self, username: &str) -> ExternalValidationState {
-        let cache_key = format!("username:{}", username);
+        let cache_key = format!("username:{username}");
        if let Some(cached) = self.cache.get(&cache_key) {
            return cached.clone();
        }
-        
+
        if username.is_empty() {
            return ExternalValidationState::NotValidated;
        }
-        
+
        if username.len() < 3 {
-            let result = ExternalValidationState::Invalid { 
-                message: "Username too short".to_string(), 
-                suggestion: Some("Minimum 3 characters".to_string()) 
+            let result = ExternalValidationState::Invalid {
+                message: "Username too short".to_string(),
+                suggestion: Some("Minimum 3 characters".to_string())
            };
            self.cache.set(cache_key, result.clone());
            return result;
        }
-        
+
        if !username.chars().all(|c| c.is_alphanumeric() || c == '_') {
-            let result = ExternalValidationState::Invalid { 
-                message: "Invalid characters".to_string(), 
-                suggestion: Some("Use letters, numbers, underscore only".to_string()) 
+            let result = ExternalValidationState::Invalid {
+                message: "Invalid characters".to_string(),
+                suggestion: Some("Use letters, numbers, underscore only".to_string())
            };
            self.cache.set(cache_key, result.clone());
            return result;
        }
-        
+
        let result = match username {
            "admin" | "root" | "user" | "test" => {
-                ExternalValidationState::Invalid { 
-                    message: "Username reserved".to_string(), 
-                    suggestion: Some("Choose different username".to_string()) 
+                ExternalValidationState::Invalid {
+                    message: "Username reserved".to_string(),
+                    suggestion: Some("Choose different username".to_string())
                }
            },
            "john123" | "alice_dev" => {
-                ExternalValidationState::Invalid { 
-                    message: "Username already taken".to_string(), 
-                    suggestion: Some("Try variations or add numbers".to_string()) 
+                ExternalValidationState::Invalid {
+                    message: "Username already taken".to_string(),
+                    suggestion: Some("Try variations or add numbers".to_string())
                }
            },
            username if username.starts_with("temp_") => {
-                ExternalValidationState::Warning { 
-                    message: "Temporary username pattern - are you sure?".to_string() 
+                ExternalValidationState::Warning {
+                    message: "Temporary username pattern - are you sure?".to_string()
                }
            },
            _ => {
                ExternalValidationState::Valid(Some("Username available - good choice!".to_string()))
            }
        };
-        
+
        self.cache.set(cache_key, result.clone());
        result
    }
-    
+
    /// API Key validation: simulates authentication service
    fn validate_api_key(&mut self, key: &str) -> ExternalValidationState {
-        let cache_key = format!("apikey:{}", key);
+        let cache_key = format!("apikey:{key}");
        if let Some(cached) = self.cache.get(&cache_key) {
            return cached.clone();
        }
-        
+
        if key.is_empty() {
            return ExternalValidationState::NotValidated;
        }
-        
+
        if key.len() < 20 {
-            let result = ExternalValidationState::Invalid { 
-                message: "API key too short".to_string(), 
-                suggestion: Some("Valid keys are 32+ characters".to_string()) 
+            let result = ExternalValidationState::Invalid {
+                message: "API key too short".to_string(),
+                suggestion: Some("Valid keys are 32+ characters".to_string())
            };
            self.cache.set(cache_key, result.clone());
            return result;
        }
-        
+
        let result = match key {
            "invalid_key_12345678901" => {
-                ExternalValidationState::Invalid { 
-                    message: "API key not found".to_string(), 
-                    suggestion: Some("Check key and permissions".to_string()) 
+                ExternalValidationState::Invalid {
+                    message: "API key not found".to_string(),
+                    suggestion: Some("Check key and permissions".to_string())
                }
            },
            "expired_key_12345678901" => {
-                ExternalValidationState::Invalid { 
-                    message: "API key expired".to_string(), 
-                    suggestion: Some("Generate new key".to_string()) 
+                ExternalValidationState::Invalid {
+                    message: "API key expired".to_string(),
+                    suggestion: Some("Generate new key".to_string())
                }
            },
            "limited_key_12345678901" => {
-                ExternalValidationState::Warning { 
-                    message: "API key has limited permissions".to_string() 
+                ExternalValidationState::Warning {
+                    message: "API key has limited permissions".to_string()
                }
            },
            key if key.starts_with("test_") => {
-                ExternalValidationState::Warning { 
-                    message: "Test API key - limited functionality".to_string() 
+                ExternalValidationState::Warning {
+                    message: "Test API key - limited functionality".to_string()
                }
            },
            _ if key.len() >= 32 => {
                ExternalValidationState::Valid(Some("API key authenticated - full access".to_string()))
            },
            _ => {
-                ExternalValidationState::Invalid { 
-                    message: "Invalid API key format".to_string(), 
-                    suggestion: Some("Keys should be 32+ alphanumeric characters".to_string()) 
+                ExternalValidationState::Invalid {
+                    message: "Invalid API key format".to_string(),
+                    suggestion: Some("Keys should be 32+ alphanumeric characters".to_string())
                }
            }
        };
-        
+
        self.cache.set(cache_key, result.clone());
        result
    }
-    
+
    /// Credit Card validation: simulates bank verification
    fn validate_credit_card(&mut self, card: &str) -> ExternalValidationState {
-        let cache_key = format!("card:{}", card);
+        let cache_key = format!("card:{card}");
        if let Some(cached) = self.cache.get(&cache_key) {
            return cached.clone();
        }
-        
+
        if card.is_empty() {
            return ExternalValidationState::NotValidated;
        }
-        
+
        if !card.chars().all(|c| c.is_ascii_digit()) || card.len() != 16 {
-            let result = ExternalValidationState::Invalid { 
-                message: "Invalid card format".to_string(), 
-                suggestion: Some("Enter 16 digits".to_string()) 
+            let result = ExternalValidationState::Invalid {
+                message: "Invalid card format".to_string(),
+                suggestion: Some("Enter 16 digits".to_string())
            };
            self.cache.set(cache_key, result.clone());
            return result;
        }
-        
+
        // Basic Luhn algorithm check (simplified)
        let sum: u32 = card.chars()
            .filter_map(|c| c.to_digit(10))
            .enumerate()
            .map(|(i, digit)| {
-                if i % 2 == 0 { 
+                if i % 2 == 0 {
                    let doubled = digit * 2;
                    if doubled > 9 { doubled - 9 } else { doubled }
-                } else { 
-                    digit 
+                } else {
+                    digit
                }
            })
            .sum();
-        
+
        if sum % 10 != 0 {
-            let result = ExternalValidationState::Invalid { 
-                message: "Invalid card number (failed checksum)".to_string(), 
-                suggestion: Some("Check card number".to_string()) 
+            let result = ExternalValidationState::Invalid {
+                message: "Invalid card number (failed checksum)".to_string(),
+                suggestion: Some("Check card number".to_string())
            };
            self.cache.set(cache_key, result.clone());
            return result;
        }
-        
+
        let result = match &card[..4] {
            "4000" => ExternalValidationState::Valid(Some("Visa - card verified".to_string())),
            "5555" => ExternalValidationState::Valid(Some("Mastercard - card verified".to_string())),
-            "4111" => ExternalValidationState::Warning { 
-                message: "Test card number - not for real transactions".to_string() 
+            "4111" => ExternalValidationState::Warning {
+                message: "Test card number - not for real transactions".to_string()
            },
-            "0000" => ExternalValidationState::Invalid { 
-                message: "Card declined by issuer".to_string(), 
-                suggestion: Some("Contact your bank".to_string()) 
+            "0000" => ExternalValidationState::Invalid {
+                message: "Card declined by issuer".to_string(),
+                suggestion: Some("Contact your bank".to_string())
            },
            _ => ExternalValidationState::Valid(Some("Card number valid - bank not verified".to_string()))
        };
-        
+
        self.cache.set(cache_key, result.clone());
        result
    }
-    
+
    fn clear_cache(&mut self) {
        self.cache.clear();
    }
@@ -546,16 +548,15 @@ impl DataProvider for ValidationDemoData {
    }
 }

-/// Enhanced editor with comprehensive external validation management
+/// Enhanced editor with automatic external validation management
 struct ValidationDemoEditor<D: DataProvider> {
    editor: FormEditor<D>,
-    services: ValidationServices,
+    services: Arc<Mutex<ValidationServices>>,
    validation_history: Vec<(usize, String, ValidationResult)>,
    debug_message: String,
    show_history: bool,
    example_mode: usize,
    validation_enabled: bool,
-    auto_validate: bool,
    validation_stats: HashMap<usize, (u32, Duration)>, // field -> (count, total_time)
 }

@@ -564,15 +565,70 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
        let mut editor = FormEditor::new(data_provider);
        editor.set_validation_enabled(true);

+        let services = Arc::new(Mutex::new(ValidationServices::new()));
+        let services_for_cb = Arc::clone(&services);
+        let services_for_history = Arc::clone(&services);
+
+        // Create a history tracker that we'll share between callback and editor
+        let validation_history: Arc<Mutex<Vec<(usize, String, ValidationResult)>>> = Arc::new(Mutex::new(Vec::new()));
+        let history_for_cb = Arc::clone(&validation_history);
+
+        // Library-level automatic external validation on field transitions
+        editor.set_external_validation_callback(move |field_idx, text| {
+            let mut svc = services_for_cb.lock().unwrap();
+            
+            let validation_type = match field_idx {
+                0 => "PSC Lookup",
+                1 => "Email Domain Check", 
+                2 => "Username Availability",
+                3 => "API Key Auth",
+                4 => "Credit Card Verify",
+                _ => "Unknown",
+            }.to_string();
+
+            let start_time = Instant::now();
+            
+            let validation_result = match field_idx {
+                0 => svc.validate_psc(text),
+                1 => svc.validate_email(text),
+                2 => svc.validate_username(text),
+                3 => svc.validate_api_key(text),
+                4 => svc.validate_credit_card(text),
+                _ => ExternalValidationState::NotValidated,
+            };
+
+            // Record in shared history (if we can lock it)
+            if let Ok(mut history) = history_for_cb.try_lock() {
+                let duration = start_time.elapsed();
+                let result = ValidationResult {
+                    state: validation_result.clone(),
+                    started_at: start_time,
+                    completed_at: Some(Instant::now()),
+                    validation_type,
+                    cached: false, // We could enhance this by checking if it was from cache
+                };
+                
+                history.push((field_idx, text.to_string(), result));
+                
+                // Limit history size
+                if history.len() > 50 {
+                    history.remove(0);
+                }
+            }
+
+            validation_result
+        });
+
        Self {
            editor,
-            services: ValidationServices::new(),
+            services,
            validation_history: Vec::new(),
-            debug_message: "🧪 Enhanced External Validation Demo - Multiple validation types with rich scenarios!".to_string(),
+            debug_message:
+                "🧪 Enhanced External Validation Demo - Automatic validation on field transitions!"
+                    .to_string(),
            show_history: false,
            example_mode: 0,
            validation_enabled: true,
-            auto_validate: true,
            validation_stats: HashMap::new(),
        }
    }
@@ -586,7 +642,7 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
        match self.current_field() {
            0 => "PSC",
            1 => "Email",
-            2 => "Username", 
+            2 => "Username",
            3 => "API Key",
            4 => "Credit Card",
            _ => "Plain Text",
@@ -608,7 +664,7 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
        self.current_field() < 5
    }

-    /// Trigger external validation for specific field
+    /// Trigger external validation for specific field (manual validation)
    fn validate_field(&mut self, field_index: usize) {
        if !self.validation_enabled || field_index >= 5 {
            return;
@@ -626,7 +682,7 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
        let validation_type = match field_index {
            0 => "PSC Lookup",
            1 => "Email Domain Check",
-            2 => "Username Availability", 
+            2 => "Username Availability",
            3 => "API Key Auth",
            4 => "Credit Card Verify",
            _ => "Unknown",
@@ -634,14 +690,17 @@ impl<D: DataProvider> ValidationDemoEditor<D> {

        let mut result = ValidationResult::new(validation_type.clone());

-        // Perform validation (in real app, this would be async)
-        let validation_result = match field_index {
-            0 => self.services.validate_psc(&raw_value),
-            1 => self.services.validate_email(&raw_value),
-            2 => self.services.validate_username(&raw_value),
-            3 => self.services.validate_api_key(&raw_value),
-            4 => self.services.validate_credit_card(&raw_value),
-            _ => ExternalValidationState::NotValidated,
+        // Perform validation using the shared services
+        let validation_result = {
+            let mut svc = self.services.lock().unwrap();
+            match field_index {
+                0 => svc.validate_psc(&raw_value),
+                1 => svc.validate_email(&raw_value),
+                2 => svc.validate_username(&raw_value),
+                3 => svc.validate_api_key(&raw_value),
+                4 => svc.validate_credit_card(&raw_value),
+                _ => ExternalValidationState::NotValidated,
+            }
        };

        result = result.complete(validation_result.clone());
@@ -651,7 +710,7 @@ impl<D: DataProvider> ValidationDemoEditor<D> {

        // Record in history
        self.validation_history.push((field_index, raw_value, result.clone()));
-        
+
        // Update stats
        let stats = self.validation_stats.entry(field_index).or_insert((0, Duration::from_secs(0)));
        stats.0 += 1;
@@ -665,8 +724,7 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
        let duration_ms = result.duration().as_millis();
        let cached_text = if result.cached { " (cached)" } else { "" };
        self.debug_message = format!(
-            "🔍 {} validation completed in {}ms{}",
-            validation_type, duration_ms, cached_text
+            "🔍 {validation_type} validation completed in {duration_ms}ms{cached_text} (manual)"
        );
    }

@@ -675,7 +733,7 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
        for i in 0..field_count {
            self.validate_field(i);
        }
-        self.debug_message = "🔍 All fields validated".to_string();
+        self.debug_message = "🔍 All fields validated manually".to_string();
    }

    fn clear_validation_state(&mut self, field_index: Option<usize>) {
@@ -690,7 +748,9 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
                }
                self.validation_history.clear();
                self.validation_stats.clear();
-                self.services.clear_cache();
+                if let Ok(mut svc) = self.services.lock() {
+                    svc.clear_cache();
+                }
                self.debug_message = "🧹 Cleared all validation states and cache".to_string();
            }
        }
@@ -720,8 +780,8 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
    fn cycle_examples(&mut self) {
        let examples = [
            // Valid examples
-            vec!["01001", "user@gmail.com", "alice_dev", "valid_api_key_123456789012345", "4000123456789012", "Valid data"],
-            // Invalid examples  
+            vec!["01001", "user@gmail.com", "alice_dev_new", "valid_api_key_123456789012345", "4000123456789012", "Valid data"],
+            // Invalid examples
            vec!["00000", "invalid-email", "admin", "short_key", "0000000000000000", "Invalid data"],
            // Warning examples
            vec!["12345", "test@example.com", "temp_user", "test_api_key_123456789012345", "4111111111111111", "Warning cases"],
@@ -739,7 +799,7 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
        }

        let mode_names = ["Valid Examples", "Invalid Examples", "Warning Cases", "Mixed Scenarios"];
-        self.debug_message = format!("📋 Loaded: {}", mode_names[self.example_mode]);
+        self.debug_message = format!("📋 Loaded: {} (navigate to trigger validation)", mode_names[self.example_mode]);
    }

    fn get_validation_summary(&self) -> String {
@@ -751,14 +811,14 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
            0
        };

-        format!("Total: {} validations, Avg: {}ms", total_validations, avg_time_ms)
+        format!("Total: {total_validations} validations, Avg: {avg_time_ms}ms")
    }

    fn get_field_validation_state(&self, field_index: usize) -> ExternalValidationState {
        self.editor.ui_state().validation_state().get_external_validation(field_index)
    }

-    // Editor pass-through methods
+    // Editor pass-through methods - simplified since library handles automatic validation
    fn enter_edit_mode(&mut self) {
        self.editor.enter_edit_mode();
        let rules = self.field_validation_rules();
@@ -766,34 +826,36 @@ impl<D: DataProvider> ValidationDemoEditor<D> {
    }

    fn exit_edit_mode(&mut self) {
-        let current_field = self.current_field();
        self.editor.exit_edit_mode();
-        
-        // Auto-validate on blur if enabled
-        if self.auto_validate && self.has_external_validation() {
-            self.validate_field(current_field);
-        }
-        
-        self.debug_message = format!("🔒 NORMAL - Cursor: Steady Block █ - {}", self.field_type());
+        // Library automatically validates on exit, no manual call needed
+        self.debug_message = format!("🔒 NORMAL - Cursor: Steady Block █ - {} (auto-validated)", self.field_type());
    }

    fn next_field(&mut self) {
-        let current = self.current_field();
        if let Ok(()) = self.editor.next_field() {
-            if self.auto_validate && current < 5 {
-                self.validate_field(current);
-            }
-            self.debug_message = "➡ Next field".to_string();
+            // Library triggers external validation automatically via transition_to_field()
+            self.debug_message = "➡ Next field (auto-validation triggered by library)".to_string();
        }
    }

    fn prev_field(&mut self) {
-        let current = self.current_field();
        if let Ok(()) = self.editor.prev_field() {
-            if self.auto_validate && current < 5 {
-                self.validate_field(current);
-            }
-            self.debug_message = "⬅ Previous field".to_string();
+            // Library triggers external validation automatically via transition_to_field()
+            self.debug_message = "⬅ Previous field (auto-validation triggered by library)".to_string();
+        }
+    }
+
+    fn move_up(&mut self) {
+        if let Ok(()) = self.editor.move_up() {
+            // Library triggers external validation automatically via transition_to_field()
+            self.debug_message = "⬆ Move up (auto-validation triggered by library)".to_string();
+        }
+    }
+
+    fn move_down(&mut self) {
+        if let Ok(()) = self.editor.move_down() {
+            // Library triggers external validation automatically via transition_to_field()
+            self.debug_message = "⬇ Move down (auto-validation triggered by library)".to_string();
        }
    }

@@ -823,7 +885,7 @@ fn run_app<B: Backend>(
            let km = key.modifiers;

            // Quit
-            if matches!(kc, KeyCode::F(10)) || 
+            if matches!(kc, KeyCode::F(10)) ||
               (kc == KeyCode::Char('q') && km.contains(KeyModifiers::CONTROL)) ||
               (kc == KeyCode::Char('c') && km.contains(KeyModifiers::CONTROL)) {
                break;
@@ -839,16 +901,25 @@ fn run_app<B: Backend>(
                },
                (_, KeyCode::Esc, _) => editor.exit_edit_mode(),

-                // Movement - cursor within field
-                (_, KeyCode::Left, _) | (AppMode::ReadOnly, KeyCode::Char('h'), _) => { let _ = editor.editor.move_left(); },
-                (_, KeyCode::Right, _) | (AppMode::ReadOnly, KeyCode::Char('l'), _) => { let _ = editor.editor.move_right(); },
-                (_, KeyCode::Up, _) | (AppMode::ReadOnly, KeyCode::Char('k'), _) => { let _ = editor.editor.move_up(); },
-                (_, KeyCode::Down, _) | (AppMode::ReadOnly, KeyCode::Char('j'), _) => { let _ = editor.editor.move_down(); },
-                // Field switching
+                // Movement - these now trigger automatic validation via the library!
+                (_, KeyCode::Left, _) | (AppMode::ReadOnly, KeyCode::Char('h'), _) => { 
+                    let _ = editor.editor.move_left(); 
+                },
+                (_, KeyCode::Right, _) | (AppMode::ReadOnly, KeyCode::Char('l'), _) => { 
+                    let _ = editor.editor.move_right(); 
+                },
+                (_, KeyCode::Up, _) | (AppMode::ReadOnly, KeyCode::Char('k'), _) => { 
+                    editor.move_up(); // Use wrapper to get debug message
+                },
+                (_, KeyCode::Down, _) | (AppMode::ReadOnly, KeyCode::Char('j'), _) => { 
+                    editor.move_down(); // Use wrapper to get debug message
+                },
+                
+                // Field switching - these trigger automatic validation via the library!
                (_, KeyCode::Tab, _) => editor.next_field(),
                (_, KeyCode::BackTab, _) => editor.prev_field(),

-                // Validation commands (ONLY in ReadOnly mode)
+                // Manual validation commands (ONLY in ReadOnly mode)
                (AppMode::ReadOnly, KeyCode::Char('v'), _) => {
                    let field = editor.current_field();
                    editor.validate_field(field);
@@ -868,8 +939,8 @@ fn run_app<B: Backend>(
                // Editing
                (AppMode::Edit, KeyCode::Left, _) => { let _ = editor.editor.move_left(); },
                (AppMode::Edit, KeyCode::Right, _) => { let _ = editor.editor.move_right(); },
-                (AppMode::Edit, KeyCode::Up, _) => { let _ = editor.editor.move_up(); },
-                (AppMode::Edit, KeyCode::Down, _) => { let _ = editor.editor.move_down(); },
+                (AppMode::Edit, KeyCode::Up, _) => { editor.move_up(); },
+                (AppMode::Edit, KeyCode::Down, _) => { editor.move_down(); },
                (AppMode::Edit, KeyCode::Char(c), m) if !m.contains(KeyModifiers::CONTROL) => {
                    let _ = editor.insert_char(c);
                },
@@ -916,25 +987,24 @@ fn render_validation_panel(
    // Status bar
    let mode_text = match editor.mode() {
        AppMode::Edit => "INSERT | (bar cursor)",
-        AppMode::ReadOnly => "NORMAL █ (block cursor)", 
+        AppMode::ReadOnly => "NORMAL █ (block cursor)",
        _ => "NORMAL █ (block cursor)",
    };

    let summary = editor.get_validation_summary();
    let status_text = format!(
-        "-- {} -- {} | {} | Auto: {} | View: {}",
+        "-- {} -- {} | {} | View: {}",
        mode_text,
        editor.debug_message,
        summary,
-        if editor.auto_validate { "ON" } else { "OFF" },
        if editor.show_history { "HISTORY" } else { "STATUS" }
    );

    let status = Paragraph::new(Line::from(Span::raw(status_text)))
-        .block(Block::default().borders(Borders::ALL).title("🧪 External Validation Demo"));
+        .block(Block::default().borders(Borders::ALL).title("🧪 Automatic External Validation Demo"));
    f.render_widget(status, chunks[0]);

-    // Validation states for all fields - FIXED: render each field on its own line
+    // Validation states for all fields - render each field on its own line
    let mut field_lines: Vec<Line> = Vec::new();
    for i in 0..editor.data_provider().field_count() {
        let field_name = editor.data_provider().field_name(i);
@@ -961,17 +1031,16 @@ fn render_validation_panel(
        };

        let field_line = Line::from(vec![
-            Span::styled(format!("{}{}: ", indicator, field_name), Style::default().fg(Color::White)),
-            Span::raw(format!("'{}' → ", value_display)),
+            Span::styled(format!("{indicator}{field_name}: "), Style::default().fg(Color::White)),
+            Span::raw(format!("'{value_display}' → ")),
            Span::styled(state_text.to_string(), Style::default().fg(color)),
        ]);

        field_lines.push(field_line);
    }

-    // Use Vec<Line> to avoid a single long line overflowing
    let validation_states = Paragraph::new(field_lines)
-        .block(Block::default().borders(Borders::ALL).title("🔍 Validation States"));
+        .block(Block::default().borders(Borders::ALL).title("🔍 Validation States (Library Auto-triggered)"));
    f.render_widget(validation_states, chunks[1]);

    // History or Help panel
@@ -983,13 +1052,13 @@ fn render_validation_panel(
            .map(|(field_idx, value, result)| {
                let field_name = match field_idx {
                    0 => "PSC",
-                    1 => "Email", 
+                    1 => "Email",
                    2 => "Username",
                    3 => "API Key",
                    4 => "Card",
                    _ => "Other",
                };
-                
+
                let duration_ms = result.duration().as_millis();
                let cached_text = if result.cached { " (cached)" } else { "" };
                let short_value = if value.len() > 15 {
@@ -997,53 +1066,52 @@ fn render_validation_panel(
                } else {
                    value.clone()
                };
-                
+
                let state_summary = match &result.state {
                    ExternalValidationState::Valid(_) => "✓ Valid",
-                    ExternalValidationState::Invalid { .. } => "✖ Invalid", 
+                    ExternalValidationState::Invalid { .. } => "✖ Invalid",
                    ExternalValidationState::Warning { .. } => "⚠ Warning",
                    ExternalValidationState::Validating => "… Validating",
                    ExternalValidationState::NotValidated => "○ Not validated",
                };
-                
+
                ListItem::new(format!(
-                    "{}: '{}' → {} ({}ms{})",
-                    field_name, short_value, state_summary, duration_ms, cached_text
+                    "{field_name}: '{short_value}' → {state_summary} ({duration_ms}ms{cached_text})"
                ))
            })
            .collect();

        let history = List::new(recent_history)
-            .block(Block::default().borders(Borders::ALL).title("📜 Validation History (recent 5)"));
+            .block(Block::default().borders(Borders::ALL).title("📜 Auto-Validation History (recent 5)"));
        f.render_widget(history, chunks[2]);
    } else {
        let help_text = match editor.mode() {
            AppMode::ReadOnly => {
-                "🎯 CURSOR-STYLE: Normal █ | Insert |\n\
-                 🧪 EXTERNAL VALIDATION DEMO - Multiple validation types with async simulation\n\
+                "🎯 FULLY AUTOMATIC VALIDATION: Library handles all validation on field transitions!\n\
+                 🧪 EXTERNAL VALIDATION DEMO - No manual triggers needed, just navigate!\n\
                 \n\
-                 Commands: v=validate current, V=validate all, c=clear current, C=clear all\n\
-                 e=cycle examples, r=toggle history, h=field help, F1=toggle validation\n\
-                 Movement: Tab/Shift+Tab=switch fields, i/a=insert/append, Esc=exit edit\n\
+                 🚀 AUTOMATIC: Arrow keys, Tab, and Esc trigger validation automatically\n\
+                 Manual: v=validate current, V=validate all, c=clear current, C=clear all\n\
+                 Controls: e=cycle examples, r=toggle history, h=field help, F1=toggle validation\n\
                 \n\
-                 Try different values to see validation in action!"
+                 Just load examples and navigate - validation happens automatically!"
            }
            AppMode::Edit => {
                "🎯 INSERT MODE - Cursor: | (bar)\n\
-                 ✏️ Type to see validation on field blur\n\
+                 ✏️ Type to edit field content\n\
                 \n\
-                 Current field validation will trigger when you:\n\
+                 🚀 AUTOMATIC: Library validates when you leave this field via:\n\
                 • Press Esc (exit edit mode)\n\
-                 • Press Tab (move to next field)\n\
-                 • Press 'v' manually\n\
+                 • Press Tab/Shift+Tab (move between fields)\n\
+                 • Press arrow keys (Up/Down move between fields)\n\
                 \n\
                 Esc=exit edit, arrows=navigate, Backspace/Del=delete"
            }
-            _ => "🧪 Enhanced External Validation Demo"
+            _ => "🧪 Enhanced Fully Automatic External Validation Demo"
        };

        let help = Paragraph::new(help_text)
-            .block(Block::default().borders(Borders::ALL).title("🚀 External Validation Features"))
+            .block(Block::default().borders(Borders::ALL).title("🚀 Fully Automatic External Validation"))
            .style(Style::default().fg(Color::Gray))
            .wrap(Wrap { trim: true });
        f.render_widget(help, chunks[2]);
@@ -1051,16 +1119,19 @@ fn render_validation_panel(
 }

 fn main() -> Result<(), Box<dyn std::error::Error>> {
-    println!("🧪 Enhanced External Validation Demo (Feature 5)");
+    println!("🧪 Enhanced Fully Automatic External Validation Demo (Feature 5)");
    println!("✅ validation feature: ENABLED");
-    println!("✅ gui feature: ENABLED"); 
+    println!("✅ gui feature: ENABLED");
    println!("✅ cursor-style feature: ENABLED");
+    println!("🚀 NEW: Library handles all automatic validation!");
    println!("🧪 Enhanced features:");
    println!("   • 5 different external validation types with realistic scenarios");
+    println!("   • LIBRARY-LEVEL automatic validation on all field transitions");
    println!("   • Validation caching and performance metrics");
    println!("   • Comprehensive validation history and error handling");
    println!("   • Multiple example datasets for testing edge cases");
    println!("   • Progressive validation patterns (local + remote simulation)");
+    println!("   • NO manual validation calls needed - library handles everything!");
    println!();

    enable_raw_mode()?;
@@ -1089,14 +1160,16 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
    CursorManager::reset()?;

    if let Err(err) = res {
-        println!("{:?}", err);
+        println!("{err:?}");
    }

-    println!("🧪 Enhanced external validation demo completed!");
-    println!("🏆 You experienced comprehensive external validation with:");
+    println!("🧪 Enhanced fully automatic external validation demo completed!");
+    println!("🏆 You experienced library-level automatic external validation with:");
    println!("   • Multiple validation services (PSC, Email, Username, API Key, Credit Card)");
+    println!("   • AUTOMATIC validation handled entirely by the library");
    println!("   • Realistic async validation simulation with caching");
    println!("   • Comprehensive error handling and user feedback");
    println!("   • Performance metrics and validation history tracking");
+    println!("   • Zero manual validation calls needed!");
    Ok(())
 }
--- a/canvas/integration_patterns.rs
+++ b/canvas/integration_patterns.rs
@@ -114,7 +114,7 @@ async fn state_machine_example() {
            }
        }

-        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+        fn handle_feature_action(&mut self, action: &CanvasAction, context: &ActionContext) -> Option<String> {
            match action {
                CanvasAction::Custom(cmd) => match cmd.as_str() {
                    "submit" => {
@@ -147,7 +147,7 @@ async fn state_machine_example() {
    println!("  Initial state: {:?}", form.state);

    // Type some text to trigger state change
-    let _result = ActionDispatcher::dispatch(
+    let result = ActionDispatcher::dispatch(
        CanvasAction::InsertChar('u'),
        &mut form,
        &mut ideal_cursor,
@@ -231,7 +231,7 @@ async fn event_driven_example() {
            self.has_changes = changed;
        }

-        fn handle_feature_action(&mut self, action: &CanvasAction, _context: &ActionContext) -> Option<String> {
+        fn handle_feature_action(&mut self, action: &CanvasAction, context: &ActionContext) -> Option<String> {
            match action {
                CanvasAction::Custom(cmd) => match cmd.as_str() {
                    "validate" => {
@@ -384,7 +384,7 @@ async fn validation_pipeline_example() {
        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> {
+        fn handle_feature_action(&mut self, action: &CanvasAction, context: &ActionContext) -> Option<String> {
            match action {
                CanvasAction::Custom(cmd) => match cmd.as_str() {
                    "validate" => {
--- a/canvas/src/canvas/actions/mod.rs
+++ b/canvas/src/canvas/actions/mod.rs
@@ -1,4 +1,5 @@
 // src/canvas/actions/mod.rs
+//! Canvas action definitions and movement utilities

 pub mod types;
 pub mod movement;
--- a/canvas/src/canvas/actions/movement/char.rs
+++ b/canvas/src/canvas/actions/movement/char.rs
@@ -1,4 +1,5 @@
 // src/canvas/actions/movement/char.rs
+//! Character-level cursor movement functions

 /// Calculate new position when moving left
 pub fn move_left(current_pos: usize) -> usize {
--- a/canvas/src/canvas/actions/movement/line.rs
+++ b/canvas/src/canvas/actions/movement/line.rs
@@ -1,4 +1,5 @@
 // src/canvas/actions/movement/line.rs
+//! Line-level cursor movement and positioning

 /// Calculate cursor position for line start
 pub fn line_start_position() -> usize {
--- a/canvas/src/canvas/actions/movement/mod.rs
+++ b/canvas/src/canvas/actions/movement/mod.rs
@@ -1,10 +1,17 @@
 // src/canvas/actions/movement/mod.rs
+//! Movement utilities for character, word, and line navigation

 pub mod word;
 pub mod line;
 pub mod char;

 // Re-export commonly used functions
-pub use word::{find_next_word_start, find_word_end, find_prev_word_start, find_prev_word_end};
+pub use word::{
+    find_next_word_start, find_word_end, find_prev_word_start, find_prev_word_end,
+    find_next_big_word_start, find_prev_big_word_start, find_big_word_end, find_prev_big_word_end,
+    // Add these new exports:
+    find_last_word_start_in_field, find_last_word_end_in_field,
+    find_last_big_word_start_in_field, find_last_big_word_end_in_field,
+};
 pub use line::{line_start_position, line_end_position, safe_cursor_position};
 pub use char::{move_left, move_right, is_valid_cursor_position, clamp_cursor_position};
--- a/canvas/src/canvas/actions/movement/word.rs
+++ b/canvas/src/canvas/actions/movement/word.rs
@@ -1,6 +1,7 @@
 // src/canvas/actions/movement/word.rs
+//! Word-based cursor movement with vim-like semantics

-#[derive(PartialEq)]
+#[derive(PartialEq, Copy, Clone)]
 enum CharType {
    Whitespace,
    Alphanumeric,
@@ -55,7 +56,7 @@ pub fn find_word_end(text: &str, current_pos: usize) -> usize {

    let mut pos = current_pos.min(len - 1);
    let current_type = get_char_type(chars[pos]);
-    
+
    // If we're not on whitespace, move to end of current word
    if current_type != CharType::Whitespace {
        while pos < len && get_char_type(chars[pos]) == current_type {
@@ -107,40 +108,296 @@ pub fn find_prev_word_start(text: &str, current_pos: usize) -> usize {
    }
 }

-/// Find the end of the previous word
+/// Find the end of the previous word (CORRECTED VERSION for vim's ge command)
 pub fn find_prev_word_end(text: &str, current_pos: usize) -> usize {
    let chars: Vec<char> = text.chars().collect();
    if chars.is_empty() || current_pos == 0 {
        return 0;
    }

+    // Find all word end positions using boundary detection
+    let mut word_ends = Vec::new();
+    let mut in_word = false;
+    let mut current_word_type: Option<CharType> = None;
+
+    for (i, &ch) in chars.iter().enumerate() {
+        let char_type = get_char_type(ch);
+        
+        match char_type {
+            CharType::Whitespace => {
+                if in_word {
+                    // End of a word
+                    word_ends.push(i - 1);
+                    in_word = false;
+                    current_word_type = None;
+                }
+            }
+            _ => {
+                if !in_word || current_word_type != Some(char_type) {
+                    // Start of a new word (or word type change)
+                    if in_word {
+                        // End the previous word first
+                        word_ends.push(i - 1);
+                    }
+                    in_word = true;
+                    current_word_type = Some(char_type);
+                }
+            }
+        }
+    }
+
+    // Add the final word end if text doesn't end with whitespace
+    if in_word && !chars.is_empty() {
+        word_ends.push(chars.len() - 1);
+    }
+
+    // Find the largest word end position that's before current_pos
+    for &end_pos in word_ends.iter().rev() {
+        if end_pos < current_pos {
+            return end_pos;
+        }
+    }
+
+    0
+}
+
+/// Find the start of the next big_word (whitespace-separated)
+pub fn find_next_big_word_start(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() || current_pos >= chars.len() {
+        return text.chars().count();
+    }
+
+    let mut pos = current_pos;
+
+    // If we're on non-whitespace, skip to end of current big_word
+    while pos < chars.len() && !chars[pos].is_whitespace() {
+        pos += 1;
+    }
+
+    // Skip whitespace to find start of next big_word
+    while pos < chars.len() && chars[pos].is_whitespace() {
+        pos += 1;
+    }
+
+    pos
+}
+
+/// Find the start of the previous big_word (whitespace-separated)
+pub fn find_prev_big_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);

    // Skip whitespace backwards
-    while pos > 0 && get_char_type(chars[pos]) == CharType::Whitespace {
+    while pos > 0 && chars[pos].is_whitespace() {
        pos -= 1;
    }

-    if pos == 0 && get_char_type(chars[0]) == CharType::Whitespace {
-        return 0;
-    }
-    if pos == 0 && get_char_type(chars[0]) != CharType::Whitespace {
-        return 0;
-    }
-
-    let word_type = get_char_type(chars[pos]);
-    while pos > 0 && get_char_type(chars[pos - 1]) == word_type {
+    // Find start of current big_word by going back while non-whitespace
+    while pos > 0 && !chars[pos - 1].is_whitespace() {
        pos -= 1;
    }

-    // Skip whitespace before this word
-    while pos > 0 && get_char_type(chars[pos - 1]) == CharType::Whitespace {
-        pos -= 1;
-    }
-
-    if pos > 0 {
-        pos - 1
-    } else {
-        0
-    }
+    pos
+}
+
+/// Find the end of the current/next big_word (whitespace-separated)
+pub fn find_big_word_end(text: &str, current_pos: usize) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() {
+        return 0;
+    }
+
+    let mut pos = current_pos;
+
+    // If we're on whitespace, skip to start of next big_word
+    while pos < chars.len() && chars[pos].is_whitespace() {
+        pos += 1;
+    }
+
+    // If we reached end, return it
+    if pos >= chars.len() {
+        return chars.len();
+    }
+
+    // Find end of current big_word (last non-whitespace char)
+    while pos < chars.len() && !chars[pos].is_whitespace() {
+        pos += 1;
+    }
+
+    // Return position of last character in big_word
+    pos.saturating_sub(1)
+}
+
+/// Find the end of the previous big_word (whitespace-separated)
+pub fn find_prev_big_word_end(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);
+
+    // Skip whitespace backwards
+    while pos > 0 && chars[pos].is_whitespace() {
+        pos -= 1;
+    }
+
+    // If we hit start of text and it's whitespace, return 0
+    if pos == 0 && chars[0].is_whitespace() {
+        return 0;
+    }
+
+    // Skip back to start of current big_word, then forward to end
+    while pos > 0 && !chars[pos - 1].is_whitespace() {
+        pos -= 1;
+    }
+
+    // Now find end of this big_word
+    while pos < chars.len() && !chars[pos].is_whitespace() {
+        pos += 1;
+    }
+
+    // Return position of last character in big_word
+    pos.saturating_sub(1)
+}
+
+// ============================================================================
+// FIELD BOUNDARY HELPER FUNCTIONS (for cross-field movement)
+// ============================================================================
+
+/// Find the start of the last word in a field (for cross-field 'b' movement)
+pub fn find_last_word_start_in_field(text: &str) -> usize {
+    if text.is_empty() {
+        return 0;
+    }
+
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() {
+        return 0;
+    }
+
+    let mut pos = chars.len().saturating_sub(1);
+
+    // Skip trailing whitespace
+    while pos > 0 && chars[pos].is_whitespace() {
+        pos -= 1;
+    }
+
+    // If the whole field is whitespace, return 0
+    if pos == 0 && chars[0].is_whitespace() {
+        return 0;
+    }
+
+    // Now we're on a non-whitespace character
+    // Find the start of this word by going backwards while chars are the same type
+    let char_type = if chars[pos].is_alphanumeric() { "alnum" } else { "punct" };
+
+    while pos > 0 {
+        let prev_char = chars[pos - 1];
+        let prev_type = if prev_char.is_alphanumeric() {
+            "alnum"
+        } else if prev_char.is_whitespace() {
+            "space"
+        } else {
+            "punct"
+        };
+
+        // Stop if we hit whitespace or different word type
+        if prev_type == "space" || prev_type != char_type {
+            break;
+        }
+        pos -= 1;
+    }
+
+    pos
+}
+
+/// Find the end of the last word in a field (for cross-field 'ge' movement)
+pub fn find_last_word_end_in_field(text: &str) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() {
+        return 0;
+    }
+
+    // Start from the end and find the last non-whitespace character
+    let mut pos = chars.len() - 1;
+    
+    // Skip trailing whitespace
+    while pos > 0 && chars[pos].is_whitespace() {
+        pos -= 1;
+    }
+
+    // If the whole field is whitespace, return 0
+    if chars[pos].is_whitespace() {
+        return 0;
+    }
+
+    // We're now at the end of the last word
+    pos
+}
+
+/// Find the start of the last big_word in a field (for cross-field 'B' movement)
+pub fn find_last_big_word_start_in_field(text: &str) -> usize {
+    if text.is_empty() {
+        return 0;
+    }
+
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() {
+        return 0;
+    }
+
+    let mut pos = chars.len().saturating_sub(1);
+
+    // Skip trailing whitespace
+    while pos > 0 && chars[pos].is_whitespace() {
+        pos -= 1;
+    }
+
+    // If the whole field is whitespace, return 0
+    if pos == 0 && chars[0].is_whitespace() {
+        return 0;
+    }
+
+    // Now we're on a non-whitespace character
+    // Find the start of this big_word by going backwards while chars are non-whitespace
+    while pos > 0 {
+        let prev_char = chars[pos - 1];
+
+        // Stop if we hit whitespace (big_word boundary)
+        if prev_char.is_whitespace() {
+            break;
+        }
+        pos -= 1;
+    }
+
+    pos
+}
+
+/// Find the end of the last big_word in a field (for cross-field 'gE' movement)
+pub fn find_last_big_word_end_in_field(text: &str) -> usize {
+    let chars: Vec<char> = text.chars().collect();
+    if chars.is_empty() {
+        return 0;
+    }
+
+    let mut pos = chars.len().saturating_sub(1);
+
+    // Skip trailing whitespace
+    while pos > 0 && chars[pos].is_whitespace() {
+        pos -= 1;
+    }
+
+    // If the whole field is whitespace, return 0
+    if pos == 0 && chars[0].is_whitespace() {
+        return 0;
+    }
+
+    // We're now at the end of the last big_word
+    pos
 }
--- a/canvas/src/canvas/actions/types.rs
+++ b/canvas/src/canvas/actions/types.rs
@@ -1,77 +1,121 @@
 // src/canvas/actions/types.rs
+//! Core action types and result handling for canvas operations.

-/// All available canvas actions
+/// All available canvas actions.
+///
+/// This enum lists high-level actions that can be performed on the canvas.
+/// Consumers can match on variants to implement custom handling or map input
+/// events to these canonical actions.
+#[non_exhaustive]
 #[derive(Debug, Clone, PartialEq)]
 pub enum CanvasAction {
    // Movement actions
+    /// Move the cursor left by one character (or logical unit).
    MoveLeft,
+    /// Move the cursor right by one character (or logical unit).
    MoveRight,
+    /// Move the cursor up a visual line/field.
    MoveUp,
+    /// Move the cursor down a visual line/field.
    MoveDown,

    // Word movement
+    /// Move to the start of the next word.
    MoveWordNext,
+    /// Move to the start of the previous word.
    MoveWordPrev,
+    /// Move to the end of the current/next word.
    MoveWordEnd,
+    /// Move to the previous word end (vim `ge`).
    MoveWordEndPrev,

    // Line movement
+    /// Move to the start of the current line.
    MoveLineStart,
+    /// Move to the end of the current line.
    MoveLineEnd,

    // Field movement
+    /// Move to the next field.
    NextField,
+    /// Move to the previous field.
    PrevField,
+    /// Move to the first field.
    MoveFirstLine,
+    /// Move to the last field.
    MoveLastLine,

    // Editing actions
+    /// Insert a character at the cursor.
    InsertChar(char),
+    /// Delete character before the cursor.
    DeleteBackward,
+    /// Delete character under/after the cursor.
    DeleteForward,

    // Suggestions actions
-        TriggerSuggestions,
-        SuggestionUp,
-        SuggestionDown,
-        SelectSuggestion,
-        ExitSuggestions,
+    /// Trigger suggestions dropdown (e.g. Tab).
+    TriggerSuggestions,
+    /// Move selection up in suggestions dropdown.
+    SuggestionUp,
+    /// Move selection down in suggestions dropdown.
+    SuggestionDown,
+    /// Accept the selected suggestion.
+    SelectSuggestion,
+    /// Exit suggestions UI.
+    ExitSuggestions,

    // Custom actions
+    /// Custom named action for application-specific behavior.
    Custom(String),
 }

-/// Result type for canvas actions
+/// Result type for canvas actions.
+///
+/// Action handlers return an ActionResult to indicate success, user-facing
+/// messages, or errors. The enum is non-exhaustive to allow extension.
+#[non_exhaustive]
 #[derive(Debug, Clone)]
 pub enum ActionResult {
+    /// Action completed successfully.
    Success,
+    /// Action completed with a user-facing message.
    Message(String),
+    /// Action was handled by the application with an associated message.
    HandledByApp(String),
+    /// Action was handled by a feature with an associated message.
    HandledByFeature(String), // Keep for compatibility
+    /// An error occurred while handling the action.
    Error(String),
 }

 impl ActionResult {
+    /// Convenience constructor for Success.
    pub fn success() -> Self {
        Self::Success
    }

+    /// Convenience constructor for Message.
    pub fn success_with_message(msg: &str) -> Self {
        Self::Message(msg.to_string())
    }

+    /// Convenience constructor for HandledByApp.
    pub fn handled_by_app(msg: &str) -> Self {
        Self::HandledByApp(msg.to_string())
    }

+    /// Convenience constructor for Error.
    pub fn error(msg: &str) -> Self {
        Self::Error(msg.to_string())
    }

+    /// Returns true for any variant representing a success-like outcome.
    pub fn is_success(&self) -> bool {
        matches!(self, Self::Success | Self::Message(_) | Self::HandledByApp(_) | Self::HandledByFeature(_))
    }

+    /// Extract a message from the result when present.
    pub fn message(&self) -> Option<&str> {
        match self {
            Self::Message(msg) | Self::HandledByApp(msg) | Self::HandledByFeature(msg) | Self::Error(msg) => Some(msg),
@@ -81,7 +125,7 @@ impl ActionResult {
 }

 impl CanvasAction {
-    /// Get a human-readable description of this action
+    /// Get a human-readable description of this action.
    pub fn description(&self) -> &'static str {
        match self {
            Self::MoveLeft => "move left",
@@ -110,7 +154,7 @@ impl CanvasAction {
        }
    }

-    /// Get all movement-related actions
+    /// Get all movement-related actions.
    pub fn movement_actions() -> Vec<CanvasAction> {
        vec![
            Self::MoveLeft,
@@ -130,7 +174,7 @@ impl CanvasAction {
        ]
    }

-    /// Get all editing-related actions
+    /// Get all editing-related actions.
    pub fn editing_actions() -> Vec<CanvasAction> {
        vec![
            Self::InsertChar(' '), // Example char
@@ -139,7 +183,7 @@ impl CanvasAction {
        ]
    }

-    /// Get all suggestions-related actions
+    /// Get all suggestions-related actions.
    pub fn suggestions_actions() -> Vec<CanvasAction> {
        vec![
            Self::TriggerSuggestions,
@@ -150,7 +194,7 @@ impl CanvasAction {
        ]
    }

-    /// Check if this action modifies text content
+    /// Check if this action modifies text content.
    pub fn is_editing_action(&self) -> bool {
        matches!(self,
            Self::InsertChar(_) |
@@ -159,7 +203,7 @@ impl CanvasAction {
        )
    }

-    /// Check if this action moves the cursor
+    /// Check if this action moves the cursor.
    pub fn is_movement_action(&self) -> bool {
        matches!(self,
            Self::MoveLeft | Self::MoveRight | Self::MoveUp | Self::MoveDown |
--- a/canvas/src/canvas/cursor.rs
+++ b/canvas/src/canvas/cursor.rs
@@ -1,5 +1,9 @@
 // src/canvas/cursor.rs
 //! Cursor style management for different canvas modes
+//!
+//! Provides helpers to update and reset terminal cursor style when the
+//! `cursor-style` feature is enabled. When the feature is disabled the
+//! functions are no-ops.

 #[cfg(feature = "cursor-style")]
 use crossterm::{cursor::SetCursorStyle, execute};
@@ -12,32 +16,47 @@ use crate::canvas::modes::AppMode;
 pub struct CursorManager;

 impl CursorManager {
-    /// Update cursor style based on current mode
+    /// Update cursor style based on current mode.
+    ///
+    /// When the `textmode-normal` feature is enabled a fixed style is applied.
+    /// Otherwise, the cursor style is mapped to the provided AppMode.
    #[cfg(feature = "cursor-style")]
    pub fn update_for_mode(mode: AppMode) -> io::Result<()> {
-        let style = match mode {
-            AppMode::Edit => SetCursorStyle::SteadyBar,           // Thin line for insert
-            AppMode::ReadOnly => SetCursorStyle::SteadyBlock,     // Block for normal
-            AppMode::Highlight => SetCursorStyle::BlinkingBlock,  // Blinking for visual
-            AppMode::General => SetCursorStyle::SteadyBlock,      // Block for general
-            AppMode::Command => SetCursorStyle::SteadyUnderScore, // Underscore for command
-        };
-        
-        execute!(io::stdout(), style)
+        // NORMALMODE: force underscore for every mode
+        #[cfg(feature = "textmode-normal")]
+        {
+            let style = SetCursorStyle::SteadyBar;
+            execute!(io::stdout(), style)
+        }
+
+        // Default (not normal): original mapping
+        #[cfg(not(feature = "textmode-normal"))]
+        {
+            let style = match mode {
+                AppMode::Edit => SetCursorStyle::SteadyBar,           // Thin line for insert
+                AppMode::ReadOnly => SetCursorStyle::SteadyBlock,     // Block for normal
+                AppMode::Highlight => SetCursorStyle::BlinkingBlock,  // Blinking for visual
+                AppMode::General => SetCursorStyle::SteadyBlock,      // Block for general
+                AppMode::Command => SetCursorStyle::SteadyUnderScore, // Underscore for command
+            };
+
+            return execute!(io::stdout(), style);
+        }
    }

-    /// No-op when cursor-style feature is disabled
+    /// No-op when cursor-style feature is disabled.
    #[cfg(not(feature = "cursor-style"))]
    pub fn update_for_mode(_mode: AppMode) -> io::Result<()> {
        Ok(())
    }

-    /// Reset cursor to default on cleanup
+    /// Reset cursor to default on cleanup.
    #[cfg(feature = "cursor-style")]
    pub fn reset() -> io::Result<()> {
        execute!(io::stdout(), SetCursorStyle::DefaultUserShape)
    }

+    /// Reset is a no-op when the cursor-style feature is disabled.
    #[cfg(not(feature = "cursor-style"))]
    pub fn reset() -> io::Result<()> {
        Ok(())
--- a/canvas/src/canvas/gui.rs
+++ b/canvas/src/canvas/gui.rs
@@ -1,12 +1,16 @@
 // src/canvas/gui.rs
 //! Canvas GUI updated to work with FormEditor
+//!
+//! This module provides rendering helpers for the canvas UI when the `gui`
+//! feature is enabled. It exposes high-level functions to render the canvas
+//! and convenience types for display options.

 #[cfg(feature = "gui")]
 use ratatui::{
    layout::{Alignment, Constraint, Direction, Layout, Rect},
    style::{Modifier, Style},
    text::{Line, Span},
-    widgets::{Block, Borders, BorderType, Paragraph},
+    widgets::{Block, Borders, BorderType, Paragraph, Wrap},
    Frame,
 };

@@ -15,45 +19,258 @@ use crate::canvas::theme::{CanvasTheme, DefaultCanvasTheme};
 use crate::canvas::modes::HighlightState;
 use crate::data_provider::DataProvider;
 use crate::editor::FormEditor;
+use unicode_width::UnicodeWidthChar;

 #[cfg(feature = "gui")]
 use std::cmp::{max, min};

-/// Render ONLY the canvas form fields - no suggestions rendering here
-/// Updated to work with FormEditor instead of CanvasState trait
 #[cfg(feature = "gui")]
+#[derive(Debug, Clone, Copy)]
+/// How to handle overflow when rendering a field's content.
+pub enum OverflowMode {
+    /// Show an indicator character at the left/right when text is truncated.
+    /// Common default is '$'.
+    Indicator(char),
+    /// Wrap content into multiple visual lines.
+    Wrap,
+}
+
+#[cfg(feature = "gui")]
+#[derive(Debug, Clone, Copy)]
+/// Display options controlling canvas rendering behavior.
+pub struct CanvasDisplayOptions {
+    /// How to handle horizontal overflow for fields.
+    pub overflow: OverflowMode,
+}
+
+#[cfg(feature = "gui")]
+impl Default for CanvasDisplayOptions {
+    fn default() -> Self {
+        Self {
+            overflow: OverflowMode::Indicator('$'),
+        }
+    }
+}
+
+/// Utility: measure display width of a string
+#[cfg(feature = "gui")]
+fn display_width(s: &str) -> u16 {
+    s.chars()
+        .map(|c| UnicodeWidthChar::width(c).unwrap_or(0) as u16)
+        .sum()
+}
+
+/// Utility: clip a string to fit width, append indicator if overflow
+#[cfg(feature = "gui")]
+fn clip_with_indicator_line<'a>(s: &'a str, width: u16, indicator: char) -> Line<'a> {
+    if width == 0 {
+        return Line::from("");
+    }
+    if display_width(s) <= width {
+        return Line::from(Span::raw(s));
+    }
+    let budget = width.saturating_sub(1);
+    let mut out = String::new();
+    let mut used: u16 = 0;
+    for ch in s.chars() {
+        let w = UnicodeWidthChar::width(ch).unwrap_or(0) as u16;
+        if used + w > budget {
+            break;
+        }
+        out.push(ch);
+        used = used.saturating_add(w);
+    }
+    Line::from(vec![Span::raw(out), Span::raw(indicator.to_string())])
+}
+
+#[cfg(feature = "gui")]
+const RIGHT_PAD: u16 = 3;
+
+#[cfg(feature = "gui")]
+fn slice_by_display_cols(s: &str, start_cols: u16, max_cols: u16) -> String {
+    if max_cols == 0 {
+        return String::new();
+    }
+    let mut cols: u16 = 0;
+    let mut out = String::new();
+    let mut taken: u16 = 0;
+    let mut started = false;
+
+    for ch in s.chars() {
+        let w = UnicodeWidthChar::width(ch).unwrap_or(0) as u16;
+        let next = cols.saturating_add(w);
+
+        if !started {
+            if next <= start_cols {
+                cols = next;
+                continue;
+            } else {
+                started = true;
+            }
+        }
+
+        if taken.saturating_add(w) > max_cols {
+            break;
+        }
+        out.push(ch);
+        taken = taken.saturating_add(w);
+        cols = next;
+    }
+
+    out
+}
+
+#[cfg(feature = "gui")]
+fn compute_h_scroll_with_padding(cursor_cols: u16, width: u16) -> (u16, u16) {
+    let mut h = 0u16;
+    for _ in 0..2 {
+        let left_cols = if h > 0 { 1 } else { 0 };
+        let max_x_visible = width.saturating_sub(1 + RIGHT_PAD + left_cols);
+        let needed = cursor_cols.saturating_sub(max_x_visible);
+        if needed <= h {
+            return (h, left_cols);
+        }
+        h = needed;
+    }
+    let left_cols = if h > 0 { 1 } else { 0 };
+    (h, left_cols)
+}
+
+#[cfg(feature = "gui")]
+fn render_active_line_with_indicator<T: CanvasTheme>(
+    typed_text: &str,
+    completion: Option<&str>,
+    width: u16,
+    indicator: char,
+    cursor_chars: usize,
+    theme: &T,
+) -> (Line<'static>, u16, u16) {
+    if width == 0 {
+        return (Line::from(""), 0, 0);
+    }
+
+    // Cursor display column
+    let mut cursor_cols: u16 = 0;
+    for (i, ch) in typed_text.chars().enumerate() {
+        if i >= cursor_chars {
+            break;
+        }
+        cursor_cols = cursor_cols
+            .saturating_add(UnicodeWidthChar::width(ch).unwrap_or(0) as u16);
+    }
+
+    let (h_scroll, left_cols) = compute_h_scroll_with_padding(cursor_cols, width);
+
+    let total_cols = display_width(typed_text);
+    let content_budget = width.saturating_sub(left_cols);
+    let show_right = total_cols.saturating_sub(h_scroll) > content_budget;
+    let right_cols: u16 = if show_right { 1 } else { 0 };
+
+    let visible_cols = width.saturating_sub(left_cols + right_cols);
+    let visible_typed = slice_by_display_cols(typed_text, h_scroll, visible_cols);
+
+    let used_typed_cols = display_width(&visible_typed);
+    let mut remaining_cols = visible_cols.saturating_sub(used_typed_cols);
+    let mut visible_completion = String::new();
+
+    if let Some(comp) = completion {
+        if !comp.is_empty() && remaining_cols > 0 {
+            visible_completion = slice_by_display_cols(comp, 0, remaining_cols);
+        }
+    }
+
+    let mut spans: Vec<Span> = Vec::with_capacity(3);
+    if left_cols == 1 {
+        spans.push(Span::raw(indicator.to_string()));
+    }
+    spans.push(Span::styled(
+        visible_typed,
+        Style::default().fg(theme.fg()),
+    ));
+    if !visible_completion.is_empty() {
+        spans.push(Span::styled(
+            visible_completion,
+            Style::default().fg(theme.suggestion_gray()),
+        ));
+    }
+    if show_right {
+        spans.push(Span::raw(indicator.to_string()));
+    }
+
+    (Line::from(spans), h_scroll, left_cols)
+}
+
+#[cfg(feature = "gui")]
+/// Render the canvas into the provided frame using default display options.
+///
+/// Returns the rectangle of the active input field if present.
 pub fn render_canvas<T: CanvasTheme, D: DataProvider>(
    f: &mut Frame,
    area: Rect,
    editor: &FormEditor<D>,
    theme: &T,
 ) -> Option<Rect> {
-    // Convert SelectionState to HighlightState
-    let highlight_state = convert_selection_to_highlight(editor.ui_state().selection_state());
-    render_canvas_with_highlight(f, area, editor, theme, &highlight_state)
+    let opts = CanvasDisplayOptions::default();
+    render_canvas_with_options(f, area, editor, theme, opts)
 }

-/// Render canvas with explicit highlight state (for advanced use)
 #[cfg(feature = "gui")]
-pub fn render_canvas_with_highlight<T: CanvasTheme, D: DataProvider>(
+/// Render the canvas into the provided frame with explicit display options.
+///
+/// This is the more configurable entrypoint for rendering and is useful for
+/// tests or when callers need to override overflow handling.
+pub fn render_canvas_with_options<T: CanvasTheme, D: DataProvider>(
+    f: &mut Frame,
+    area: Rect,
+    editor: &FormEditor<D>,
+    theme: &T,
+    opts: CanvasDisplayOptions,
+) -> Option<Rect> {
+    let highlight_state =
+        convert_selection_to_highlight(editor.ui_state().selection_state());
+
+    #[cfg(feature = "suggestions")]
+    let active_completion = if editor.ui_state().is_suggestions_active()
+        && editor.ui_state().suggestions.active_field
+            == Some(editor.ui_state().current_field())
+    {
+        editor.ui_state().suggestions.completion_text.clone()
+    } else {
+        None
+    };
+    #[cfg(not(feature = "suggestions"))]
+    let active_completion: Option<String> = None;
+
+    render_canvas_with_highlight_and_options(
+        f,
+        area,
+        editor,
+        theme,
+        &highlight_state,
+        active_completion,
+        opts,
+    )
+}
+
+#[cfg(feature = "gui")]
+fn render_canvas_with_highlight_and_options<T: CanvasTheme, D: DataProvider>(
    f: &mut Frame,
    area: Rect,
    editor: &FormEditor<D>,
    theme: &T,
    highlight_state: &HighlightState,
+    active_completion: Option<String>,
+    opts: CanvasDisplayOptions,
 ) -> Option<Rect> {
    let ui_state = editor.ui_state();
    let data_provider = editor.data_provider();

-    // Build field information
    let field_count = data_provider.field_count();
    let mut fields: Vec<&str> = Vec::with_capacity(field_count);
    let mut inputs: Vec<String> = Vec::with_capacity(field_count);

    for i in 0..field_count {
        fields.push(data_provider.field_name(i));
-
-        // Use editor-provided effective display text per field (Feature 4/mask aware)
        #[cfg(feature = "validation")]
        {
            inputs.push(editor.display_text_for_field(i));
@@ -67,16 +284,7 @@ pub fn render_canvas_with_highlight<T: CanvasTheme, D: DataProvider>(
    let current_field_idx = ui_state.current_field();
    let is_edit_mode = matches!(ui_state.mode(), crate::canvas::modes::AppMode::Edit);

-    // Precompute completion for active field
-    let active_completion = if ui_state.is_suggestions_active()
-        && ui_state.suggestions.active_field == Some(current_field_idx)
-    {
-        ui_state.suggestions.completion_text.clone()
-    } else {
-        None
-    };
-
-    render_canvas_fields(
+    render_canvas_fields_with_options(
        f,
        area,
        &fields,
@@ -85,67 +293,50 @@ pub fn render_canvas_with_highlight<T: CanvasTheme, D: DataProvider>(
        theme,
        is_edit_mode,
        highlight_state,
-        editor.display_cursor_position(), // Use display cursor position for masks
-        false, // TODO: track unsaved changes in editor
-        |i| {
-            // Get display value for field i using editor logic (Feature 4 + masks)
-            #[cfg(feature = "validation")]
-            {
-                editor.display_text_for_field(i)
-            }
-            #[cfg(not(feature = "validation"))]
-            {
-                data_provider.field_value(i).to_string()
-            }
-        },
-        |i| {
-            // Check if field has display override (custom formatter or mask)
-            #[cfg(feature = "validation")]
-            {
-                editor.ui_state().validation_state().get_field_config(i)
-                    .map(|cfg| {
-                        // Formatter takes precedence; if present, it's a display override
-                        #[allow(unused_mut)]
-                        let mut has_override = false;
-                        #[cfg(feature = "validation")]
-                        {
-                            has_override = cfg.custom_formatter.is_some();
-                        }
-                        has_override || cfg.display_mask.is_some()
-                    })
-                    .unwrap_or(false)
-            }
-            #[cfg(not(feature = "validation"))]
-            {
-                false
-            }
-        },
-        // NEW: provide completion for the active field
-        |i| {
-            if i == current_field_idx {
-                active_completion.clone()
-            } else {
-                None
-            }
+        editor.display_cursor_position(),
+        false,
+        #[cfg(feature = "validation")]
+        |field_idx| editor.display_text_for_field(field_idx),
+        #[cfg(not(feature = "validation"))]
+        |field_idx| data_provider.field_value(field_idx).to_string(),
+        #[cfg(feature = "validation")]
+        |field_idx| {
+            editor
+                .ui_state()
+                .validation_state()
+                .get_field_config(field_idx)
+                .map(|cfg| cfg.custom_formatter.is_some() || cfg.display_mask.is_some())
+                .unwrap_or(false)
        },
+        #[cfg(not(feature = "validation"))]
+        |_field_idx| false,
+        active_completion,
+        opts,
    )
 }

-/// Convert SelectionState to HighlightState for rendering
 #[cfg(feature = "gui")]
-fn convert_selection_to_highlight(selection: &crate::canvas::state::SelectionState) -> HighlightState {
+fn convert_selection_to_highlight(
+    selection: &crate::canvas::state::SelectionState,
+) -> HighlightState {
    use crate::canvas::state::SelectionState;

    match selection {
        SelectionState::None => HighlightState::Off,
-        SelectionState::Characterwise { anchor } => HighlightState::Characterwise { anchor: *anchor },
-        SelectionState::Linewise { anchor_field } => HighlightState::Linewise { anchor_line: *anchor_field },
+        SelectionState::Characterwise { anchor } => {
+            HighlightState::Characterwise { anchor: *anchor }
+        }
+        SelectionState::Linewise { anchor_field } => {
+            HighlightState::Linewise {
+                anchor_line: *anchor_field,
+            }
+        }
    }
 }

-/// Core canvas field rendering
+/// Core canvas field rendering with options
 #[cfg(feature = "gui")]
-fn render_canvas_fields<T: CanvasTheme, F1, F2, F3>(
+fn render_canvas_fields_with_options<T: CanvasTheme, F1, F2>(
    f: &mut Frame,
    area: Rect,
    fields: &[&str],
@@ -158,20 +349,18 @@ fn render_canvas_fields<T: CanvasTheme, F1, F2, F3>(
    has_unsaved_changes: bool,
    get_display_value: F1,
    has_display_override: F2,
-    get_completion: F3,
+    active_completion: Option<String>,
+    opts: CanvasDisplayOptions,
 ) -> Option<Rect>
 where
    F1: Fn(usize) -> String,
    F2: Fn(usize) -> bool,
-    F3: Fn(usize) -> Option<String>,
 {
-    // Create layout
    let columns = Layout::default()
        .direction(Direction::Horizontal)
        .constraints([Constraint::Percentage(30), Constraint::Percentage(70)])
        .split(area);

-    // Border style based on state
    let border_style = if has_unsaved_changes {
        Style::default().fg(theme.warning())
    } else if is_edit_mode {
@@ -180,7 +369,6 @@ where
        Style::default().fg(theme.secondary())
    };

-    // Input container
    let input_container = Block::default()
        .borders(Borders::ALL)
        .border_type(BorderType::Rounded)
@@ -196,29 +384,111 @@ where

    f.render_widget(&input_container, input_block);

-    // Input area layout
    let input_area = input_container.inner(input_block);
+
    let input_rows = Layout::default()
        .direction(Direction::Vertical)
        .constraints(vec![Constraint::Length(1); fields.len()])
        .split(input_area);

-    // Render field labels
    render_field_labels(f, columns[0], input_block, fields, theme);

-    // Render field values and return active field rect
-    render_field_values(
-        f,
-        input_rows.to_vec(),
-        inputs,
-        current_field_idx,
-        theme,
-        highlight_state,
-        current_cursor_pos,
-        get_display_value,
-        has_display_override,
-        get_completion,
-    )
+    let mut active_field_input_rect = None;
+
+    for i in 0..inputs.len() {
+        let is_active = i == *current_field_idx;
+        let typed_text = get_display_value(i);
+        let inner_width = input_rows[i].width;
+
+        // ---- BEGIN MODIFIED SECTION ----
+        let mut h_scroll_for_cursor: u16 = 0;
+        let mut left_offset_for_cursor: u16 = 0;
+
+        let line = match highlight_state {
+            // Selection highlighting active: always use highlighting, even for the active field
+            HighlightState::Characterwise { .. } | HighlightState::Linewise { .. } => {
+                apply_highlighting(
+                    &typed_text,
+                    i,
+                    current_field_idx,
+                    current_cursor_pos,
+                    highlight_state,
+                    theme,
+                    is_active,
+                )
+            }
+
+            // No selection highlighting
+            HighlightState::Off => match opts.overflow {
+                // Indicator mode: special-case the active field to preserve h-scroll + indicators
+                OverflowMode::Indicator(ind) => {
+                    if is_active {
+                        let (l, hs, left_cols) = render_active_line_with_indicator(
+                            &typed_text,
+                            active_completion.as_deref(),
+                            inner_width,
+                            ind,
+                            current_cursor_pos,
+                            theme,
+                        );
+                        h_scroll_for_cursor = hs;
+                        left_offset_for_cursor = left_cols;
+                        l
+                    } else if display_width(&typed_text) <= inner_width {
+                        Line::from(Span::raw(typed_text.clone()))
+                    } else {
+                        clip_with_indicator_line(&typed_text, inner_width, ind)
+                    }
+                }
+
+                // Wrap mode: keep active completion for active line
+                OverflowMode::Wrap => {
+                    if is_active {
+                        let mut spans: Vec<Span> = Vec::new();
+                        spans.push(Span::styled(
+                                typed_text.clone(),
+                                Style::default().fg(theme.fg()),
+                        ));
+                        if let Some(completion) = &active_completion {
+                            if !completion.is_empty() {
+                                spans.push(Span::styled(
+                                        completion.clone(),
+                                        Style::default().fg(theme.suggestion_gray()),
+                                ));
+                            }
+                        }
+                        Line::from(spans)
+                    } else {
+                        Line::from(Span::raw(typed_text.clone()))
+                    }
+                }
+            },
+        };        
+        // ---- END MODIFIED SECTION ----
+
+        let mut p = Paragraph::new(line).alignment(Alignment::Left);
+
+        if matches!(opts.overflow, OverflowMode::Wrap) {
+            p = p.wrap(Wrap { trim: false });
+        }
+
+        f.render_widget(p, input_rows[i]);
+
+        if is_active {
+            active_field_input_rect = Some(input_rows[i]);
+            set_cursor_position_scrolled(
+                f,
+                input_rows[i],
+                &typed_text,
+                current_cursor_pos,
+                has_display_override(i),
+                h_scroll_for_cursor,
+                left_offset_for_cursor,
+            );
+        }
+    }
+
+    active_field_input_rect
 }

 /// Render field labels
@@ -232,7 +502,7 @@ fn render_field_labels<T: CanvasTheme>(
 ) {
    for (i, field) in fields.iter().enumerate() {
        let label = Paragraph::new(Line::from(Span::styled(
-            format!("{}:", field),
+            format!("{field}:"),
            Style::default().fg(theme.fg()),
        )));
        f.render_widget(
@@ -247,72 +517,6 @@ fn render_field_labels<T: CanvasTheme>(
    }
 }

-/// Render field values with highlighting
-#[cfg(feature = "gui")]
-fn render_field_values<T: CanvasTheme, F1, F2, F3>(
-    f: &mut Frame,
-    input_rows: Vec<Rect>,
-    inputs: &[String],
-    current_field_idx: &usize,
-    theme: &T,
-    highlight_state: &HighlightState,
-    current_cursor_pos: usize,
-    get_display_value: F1,
-    has_display_override: F2,
-    get_completion: F3,
-) -> Option<Rect>
-where
-    F1: Fn(usize) -> String,
-    F2: Fn(usize) -> bool,
-    F3: Fn(usize) -> Option<String>,
-{
-    let mut active_field_input_rect = None;
-
-    for (i, _input) in inputs.iter().enumerate() {
-        let is_active = i == *current_field_idx;
-        let typed_text = get_display_value(i);
-
-        let line = if is_active {
-            // Compose typed + gray completion for the active field
-            let normal_style = Style::default().fg(theme.fg());
-            let gray_style = Style::default().fg(theme.suggestion_gray());
-
-            let mut spans: Vec<Span> = Vec::new();
-            spans.push(Span::styled(typed_text.clone(), normal_style));
-
-            if let Some(completion) = get_completion(i) {
-                if !completion.is_empty() {
-                    spans.push(Span::styled(completion, gray_style));
-                }
-            }
-
-            Line::from(spans)
-        } else {
-            // Non-active fields: keep existing highlighting logic
-            apply_highlighting(
-                &typed_text,
-                i,
-                current_field_idx,
-                current_cursor_pos,
-                highlight_state,
-                theme,
-                is_active,
-            )
-        };
-
-        let input_display = Paragraph::new(line).alignment(Alignment::Left);
-        f.render_widget(input_display, input_rows[i]);
-
-        // Set cursor for active field at end of typed text (not after completion)
-        if is_active {
-            active_field_input_rect = Some(input_rows[i]);
-            set_cursor_position(f, input_rows[i], &typed_text, current_cursor_pos, has_display_override(i));
-        }
-    }
-
-    active_field_input_rect
-}
-
 /// Apply highlighting based on highlight state
 #[cfg(feature = "gui")]
 fn apply_highlighting<'a, T: CanvasTheme>(
@@ -322,27 +526,40 @@ fn apply_highlighting<'a, T: CanvasTheme>(
    current_cursor_pos: usize,
    highlight_state: &HighlightState,
    theme: &T,
-    _is_active: bool,
+    is_active: bool,
 ) -> Line<'a> {
    let text_len = text.chars().count();

    match highlight_state {
        HighlightState::Off => {
-            Line::from(Span::styled(
-                text,
-                Style::default().fg(theme.fg())
-            ))
+            Line::from(Span::styled(text, Style::default().fg(theme.fg())))
        }
        HighlightState::Characterwise { anchor } => {
-            apply_characterwise_highlighting(text, text_len, field_index, current_field_idx, current_cursor_pos, anchor, theme, _is_active)
+            apply_characterwise_highlighting(
+                text,
+                text_len,
+                field_index,
+                current_field_idx,
+                current_cursor_pos,
+                anchor,
+                theme,
+                is_active,
+            )
        }
        HighlightState::Linewise { anchor_line } => {
-            apply_linewise_highlighting(text, field_index, current_field_idx, anchor_line, theme, _is_active)
+            apply_linewise_highlighting(
+                text,
+                field_index,
+                current_field_idx,
+                anchor_line,
+                theme,
+                is_active,
+            )
        }
    }
 }

-/// Apply characterwise highlighting - PROPER VIM-LIKE VERSION
+/// Apply characterwise highlighting (unchanged)
 #[cfg(feature = "gui")]
 fn apply_characterwise_highlighting<'a, T: CanvasTheme>(
    text: &'a str,
@@ -358,21 +575,20 @@ fn apply_characterwise_highlighting<'a, T: CanvasTheme>(
    let start_field = min(anchor_field, *current_field_idx);
    let end_field = max(anchor_field, *current_field_idx);

-    // Vim-like styling:
-    // - Selected text: contrasting color + background (like vim visual selection)
-    // - All other text: normal color (no special colors for active fields, etc.)
    let highlight_style = Style::default()
-        .fg(theme.highlight())          // ✅ Contrasting text color for selected text
-        .bg(theme.highlight_bg())       // ✅ Background for selected text
+        .fg(theme.highlight())
+        .bg(theme.highlight_bg())
        .add_modifier(Modifier::BOLD);

-    let normal_style = Style::default().fg(theme.fg()); // ✅ Normal text color everywhere else
+    let normal_style = Style::default().fg(theme.fg());

    if field_index >= start_field && field_index <= end_field {
        if start_field == end_field {
-            // Single field selection
            let (start_char, end_char) = if anchor_field == *current_field_idx {
-                (min(anchor_char, current_cursor_pos), max(anchor_char, current_cursor_pos))
+                (
+                    min(anchor_char, current_cursor_pos),
+                    max(anchor_char, current_cursor_pos),
+                )
            } else if anchor_field < *current_field_idx {
                (anchor_char, current_cursor_pos)
            } else {
@@ -383,71 +599,67 @@ fn apply_characterwise_highlighting<'a, T: CanvasTheme>(
            let clamped_end = end_char.min(text_len);

            let before: String = text.chars().take(clamped_start).collect();
-            let highlighted: String = text.chars()
+            let highlighted: String = text
+                .chars()
                .skip(clamped_start)
                .take(clamped_end.saturating_sub(clamped_start) + 1)
                .collect();
            let after: String = text.chars().skip(clamped_end + 1).collect();

            Line::from(vec![
-                Span::styled(before, normal_style),         // Normal text color
-                Span::styled(highlighted, highlight_style), // Contrasting color + background
-                Span::styled(after, normal_style),          // Normal text color
+                Span::styled(before, normal_style),
+                Span::styled(highlighted, highlight_style),
+                Span::styled(after, normal_style),
            ])
-        } else {
-            // Multi-field selection
-            if field_index == anchor_field {
-                if anchor_field < *current_field_idx {
-                    let clamped_start = anchor_char.min(text_len);
-                    let before: String = text.chars().take(clamped_start).collect();
-                    let highlighted: String = text.chars().skip(clamped_start).collect();
+        } else if field_index == anchor_field {
+            if anchor_field < *current_field_idx {
+                let clamped_start = anchor_char.min(text_len);
+                let before: String = text.chars().take(clamped_start).collect();
+                let highlighted: String = text.chars().skip(clamped_start).collect();

-                    Line::from(vec![
-                        Span::styled(before, normal_style),
-                        Span::styled(highlighted, highlight_style),
-                    ])
-                } else {
-                    let clamped_end = anchor_char.min(text_len);
-                    let highlighted: String = text.chars().take(clamped_end + 1).collect();
-                    let after: String = text.chars().skip(clamped_end + 1).collect();
-
-                    Line::from(vec![
-                        Span::styled(highlighted, highlight_style),
-                        Span::styled(after, normal_style),
-                    ])
-                }
-            } else if field_index == *current_field_idx {
-                if anchor_field < *current_field_idx {
-                    let clamped_end = current_cursor_pos.min(text_len);
-                    let highlighted: String = text.chars().take(clamped_end + 1).collect();
-                    let after: String = text.chars().skip(clamped_end + 1).collect();
-
-                    Line::from(vec![
-                        Span::styled(highlighted, highlight_style),
-                        Span::styled(after, normal_style),
-                    ])
-                } else {
-                    let clamped_start = current_cursor_pos.min(text_len);
-                    let before: String = text.chars().take(clamped_start).collect();
-                    let highlighted: String = text.chars().skip(clamped_start).collect();
-
-                    Line::from(vec![
-                        Span::styled(before, normal_style),
-                        Span::styled(highlighted, highlight_style),
-                    ])
-                }
+                Line::from(vec![
+                    Span::styled(before, normal_style),
+                    Span::styled(highlighted, highlight_style),
+                ])
            } else {
-                // Middle field: highlight entire field
-                Line::from(Span::styled(text, highlight_style))
+                let clamped_end = anchor_char.min(text_len);
+                let highlighted: String = text.chars().take(clamped_end + 1).collect();
+                let after: String = text.chars().skip(clamped_end + 1).collect();
+
+                Line::from(vec![
+                    Span::styled(highlighted, highlight_style),
+                    Span::styled(after, normal_style),
+                ])
            }
+        } else if field_index == *current_field_idx {
+            if anchor_field < *current_field_idx {
+                let clamped_end = current_cursor_pos.min(text_len);
+                let highlighted: String = text.chars().take(clamped_end + 1).collect();
+                let after: String = text.chars().skip(clamped_end + 1).collect();
+
+                Line::from(vec![
+                    Span::styled(highlighted, highlight_style),
+                    Span::styled(after, normal_style),
+                ])
+            } else {
+                let clamped_start = current_cursor_pos.min(text_len);
+                let before: String = text.chars().take(clamped_start).collect();
+                let highlighted: String = text.chars().skip(clamped_start).collect();
+
+                Line::from(vec![
+                    Span::styled(before, normal_style),
+                    Span::styled(highlighted, highlight_style),
+                ])
+            }
+        } else {
+            Line::from(Span::styled(text, highlight_style))
        }
    } else {
-        // Outside selection: always normal text color (no special active field color)
        Line::from(Span::styled(text, normal_style))
    }
 }

-/// Apply linewise highlighting - PROPER VIM-LIKE VERSION
+/// Apply linewise highlighting (unchanged)
 #[cfg(feature = "gui")]
 fn apply_linewise_highlighting<'a, T: CanvasTheme>(
    text: &'a str,
@@ -460,52 +672,58 @@ fn apply_linewise_highlighting<'a, T: CanvasTheme>(
    let start_field = min(*anchor_line, *current_field_idx);
    let end_field = max(*anchor_line, *current_field_idx);

-    // Vim-like styling:
-    // - Selected lines: contrasting text color + background
-    // - All other lines: normal text color (no special active field color)
    let highlight_style = Style::default()
-        .fg(theme.highlight())          // ✅ Contrasting text color for selected text
-        .bg(theme.highlight_bg())       // ✅ Background for selected text
+        .fg(theme.highlight())
+        .bg(theme.highlight_bg())
        .add_modifier(Modifier::BOLD);

-    let normal_style = Style::default().fg(theme.fg()); // ✅ Normal text color everywhere else
+    let normal_style = Style::default().fg(theme.fg());

    if field_index >= start_field && field_index <= end_field {
-        // Selected line: contrasting text color + background
        Line::from(Span::styled(text, highlight_style))
    } else {
-        // Normal line: normal text color (no special active field color)
        Line::from(Span::styled(text, normal_style))
    }
 }

-/// Set cursor position
+/// Set cursor position (x clamp only; no Y offset with wrap in this version)
 #[cfg(feature = "gui")]
-fn set_cursor_position(
+fn set_cursor_position_scrolled(
    f: &mut Frame,
    field_rect: Rect,
    text: &str,
    current_cursor_pos: usize,
-    has_display_override: bool,
+    _has_display_override: bool,
+    h_scroll: u16,
+    left_offset: u16,
 ) {
-    // BUG FIX: Use the correct display cursor position, not end of text
-    let cursor_x = field_rect.x + current_cursor_pos as u16;
+    let mut cols: u16 = 0;
+    for (i, ch) in text.chars().enumerate() {
+        if i >= current_cursor_pos {
+            break;
+        }
+        cols = cols.saturating_add(UnicodeWidthChar::width(ch).unwrap_or(0) as u16);
+    }
+
+    let mut visible_x = cols.saturating_sub(h_scroll).saturating_add(left_offset);
+
+    let limit = field_rect.width.saturating_sub(1 + RIGHT_PAD);
+    if visible_x > limit {
+        visible_x = limit;
+    }
+
+    let cursor_x = field_rect.x.saturating_add(visible_x);
    let cursor_y = field_rect.y;
-    
-    // SAFETY: Ensure cursor doesn't go beyond field bounds
-    let max_cursor_x = field_rect.x + field_rect.width.saturating_sub(1);
-    let safe_cursor_x = cursor_x.min(max_cursor_x);
-    
-    f.set_cursor_position((safe_cursor_x, cursor_y));
+    f.set_cursor_position((cursor_x, cursor_y));
 }

-/// Set default theme if custom not specified
+/// Default theme
 #[cfg(feature = "gui")]
 pub fn render_canvas_default<D: DataProvider>(
    f: &mut Frame,
    area: Rect,
    editor: &FormEditor<D>,
 ) -> Option<Rect> {
-    let theme = DefaultCanvasTheme::default();
+    let theme = DefaultCanvasTheme;
    render_canvas(f, area, editor, &theme)
 }
--- a/canvas/src/canvas/mod.rs
+++ b/canvas/src/canvas/mod.rs
@@ -1,4 +1,8 @@
 // src/canvas/mod.rs
+//! Top-level canvas module.
+//!
+//! Re-exports commonly used canvas types and modules so that downstream
+//! consumers can import them from `crate::canvas`.

 pub mod actions;
 pub mod state;
--- a/canvas/src/canvas/modes/highlight.rs
+++ b/canvas/src/canvas/modes/highlight.rs
@@ -1,15 +1,18 @@
-// src/state/app/highlight.rs
-// canvas/src/modes/highlight.rs
+// src/canvas/modes/highlight.rs
+//! Highlight state definitions for canvas visual/selection modes.

 #[derive(Debug, Clone, PartialEq, Eq)]
+#[derive(Default)]
+/// Represents the current highlight/visual selection state.
+///
+/// This enum is used by the GUI and selection logic to track whether a visual
+/// selection is active and its anchor position.
 pub enum HighlightState {
+    /// No highlighting active.
+    #[default]
    Off,
+    /// Characterwise selection with an anchor (field_index, char_position).
    Characterwise { anchor: (usize, usize) }, // (field_index, char_position)
+    /// Linewise selection anchored at a field index.
    Linewise { anchor_line: usize },          // field_index
 }
-
-impl Default for HighlightState {
-    fn default() -> Self {
-        HighlightState::Off
-    }
-}
--- a/canvas/src/canvas/modes/manager.rs
+++ b/canvas/src/canvas/modes/manager.rs
@@ -1,51 +1,84 @@
 // src/modes/handlers/mode_manager.rs
 // canvas/src/modes/manager.rs
+//! Mode manager utilities and the AppMode enum.
+//!
+//! This module defines the available canvas modes and provides helper
+//! functions to validate mode transitions and perform required side-effects
+//! such as updating cursor style when enabled.

 #[cfg(feature = "cursor-style")]
 use crate::canvas::CursorManager;

 #[derive(Debug, Clone, Copy, PartialEq, Eq)]
+/// Top-level application modes used by the canvas UI.
+///
+/// These modes control input handling, cursor behavior, and how the UI should
+/// respond to user actions.
 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
+    /// For intro and admin screens
+    General,
+    /// Canvas read-only mode (navigation)
+    ReadOnly,
+    /// Canvas edit mode (insertion/modification)
+    Edit,
+    /// Canvas highlight/visual mode (selection)
+    Highlight,
+    /// Command mode overlay (for commands)
+    Command,
 }

 pub struct ModeManager;

 impl ModeManager {
    // Mode transition rules
+
+    /// Return true if the system can enter Command mode from the given current mode.
    pub fn can_enter_command_mode(current_mode: AppMode) -> bool {
        !matches!(current_mode, AppMode::Edit)
    }

+    /// Return true if the system can enter Edit mode from the given current mode.
    pub fn can_enter_edit_mode(current_mode: AppMode) -> bool {
        matches!(current_mode, AppMode::ReadOnly)
    }

+    /// Return true if the system can enter ReadOnly mode from the given current mode.
    pub fn can_enter_read_only_mode(current_mode: AppMode) -> bool {
        matches!(current_mode, AppMode::Edit | AppMode::Command | AppMode::Highlight)
    }

+    /// Return true if the system can enter Highlight mode from the given current mode.
    pub fn can_enter_highlight_mode(current_mode: AppMode) -> bool {
        matches!(current_mode, AppMode::ReadOnly)
    }


-    /// Transition to new mode with automatic cursor update (when cursor-style feature enabled)
+    /// Transition to new mode with automatic cursor update (when cursor-style feature enabled).
+    ///
+    /// Returns the resulting mode or an I/O error if cursor style update fails.
    pub fn transition_to_mode(current_mode: AppMode, new_mode: AppMode) -> std::io::Result<AppMode> {
-        if current_mode != new_mode {
-            #[cfg(feature = "cursor-style")]
-            {
-                let _ = CursorManager::update_for_mode(new_mode);
-            }
+        #[cfg(feature = "textmode-normal")]
+        {
+            // Always force Edit in normalmode
+            Ok(AppMode::Edit)
+        }
+
+        #[cfg(not(feature = "textmode-normal"))]
+        {
+            if current_mode != new_mode {
+                #[cfg(feature = "cursor-style")]
+                {
+                    let _ = CursorManager::update_for_mode(new_mode);
+                }
+            }
+            Ok(new_mode)
        }
-        Ok(new_mode)
    }

-    /// Enter highlight mode with cursor styling
+    /// Enter highlight mode with cursor styling.
+    ///
+    /// Returns Ok(true) if the transition succeeded (and cursor style was updated
+    /// when enabled), otherwise Ok(false) if the transition is not allowed.
    pub fn enter_highlight_mode_with_cursor(current_mode: AppMode) -> std::io::Result<bool> {
        if Self::can_enter_highlight_mode(current_mode) {
            #[cfg(feature = "cursor-style")]
@@ -58,7 +91,10 @@ impl ModeManager {
        }
    }

-    /// Exit highlight mode with cursor styling
+    /// Exit highlight mode with cursor styling and return the next mode.
+    ///
+    /// This helper returns the mode to switch to (ReadOnly) and updates cursor
+    /// style if the feature is enabled.
    pub fn exit_highlight_mode_with_cursor() -> std::io::Result<AppMode> {
        let new_mode = AppMode::ReadOnly;
        #[cfg(feature = "cursor-style")]
--- a/canvas/src/canvas/state.rs
+++ b/canvas/src/canvas/state.rs
@@ -1,10 +1,20 @@
 // src/canvas/state.rs
 //! Library-owned UI state - user never directly modifies this
+//!
+//! This module exposes the EditorState type (and related selection and
+//! suggestions types) which represent the internal UI state maintained by the
+//! canvas library. These types are intended for read-only access by callers
+//! and are mutated only through the library's APIs.

 use crate::canvas::modes::AppMode;

 /// Library-owned UI state - user never directly modifies this
 #[derive(Debug, Clone)]
+/// Internal editor UI state managed by the canvas library.
+///
+/// The fields are `pub(crate)` because they should only be modified by the
+/// library's internal action handlers. Consumers can use the provided getter
+/// methods to observe the state.
 pub struct EditorState {
    // Navigation state
    pub(crate) current_field: usize,
@@ -14,7 +24,8 @@ pub struct EditorState {
    // Mode state
    pub(crate) current_mode: AppMode,

-    // Suggestions dropdown state
+    // Suggestions dropdown state (only available with suggestions feature)
+    #[cfg(feature = "suggestions")]
    pub(crate) suggestions: SuggestionsUIState,

    // Selection state (for vim visual mode)
@@ -29,34 +40,51 @@ pub struct EditorState {
    pub(crate) computed: Option<crate::computed::ComputedState>,
 }

+#[cfg(feature = "suggestions")]
 #[derive(Debug, Clone)]
+/// Internal suggestions UI state used to manage the suggestions dropdown.
 pub struct SuggestionsUIState {
    pub(crate) is_active: bool,
    pub(crate) is_loading: bool,
    pub(crate) selected_index: Option<usize>,
    pub(crate) active_field: Option<usize>,
+    pub(crate) active_query: Option<String>,
    pub(crate) completion_text: Option<String>,
 }

 #[derive(Debug, Clone)]
+/// SelectionState represents the current selection/visual mode state used by
+/// the canvas (for example, Vim-like visual modes).
 pub enum SelectionState {
+    /// No selection is active.
    None,
+    /// Characterwise selection: (field_index, char_position)
    Characterwise { anchor: (usize, usize) },
+    /// Linewise selection anchored at a field (field index).
    Linewise { anchor_field: usize },
 }

 impl EditorState {
+    /// Create a new EditorState with default initial values.
    pub fn new() -> Self {
        Self {
            current_field: 0,
            cursor_pos: 0,
            ideal_cursor_column: 0,
+            // NORMALMODE: always start in Edit
+            #[cfg(feature = "textmode-normal")]
            current_mode: AppMode::Edit,
+            // Default (vim): start in ReadOnly
+            #[cfg(not(feature = "textmode-normal"))]
+            current_mode: AppMode::ReadOnly,
+
+            #[cfg(feature = "suggestions")]
            suggestions: SuggestionsUIState {
                is_active: false,
                is_loading: false,
                selected_index: None,
                active_field: None,
+                active_query: None,
                completion_text: None,
            },
            selection: SelectionState::None,
@@ -101,11 +129,13 @@ impl EditorState {
    }

    /// Check if suggestions dropdown is active (for user's business logic)
+    #[cfg(feature = "suggestions")]
    pub fn is_suggestions_active(&self) -> bool {
        self.suggestions.is_active
    }

    /// Check if suggestions dropdown is loading (for user's business logic)
+    #[cfg(feature = "suggestions")]
    pub fn is_suggestions_loading(&self) -> bool {
        self.suggestions.is_loading
    }
@@ -126,6 +156,10 @@ impl EditorState {
    // INTERNAL MUTATIONS: Only library modifies these
    // ===================================================================

+    /// Move internal pointer to another field index.
+    ///
+    /// This method is intended for internal library use to change the current
+    /// field and reset the cursor to a safe value.
    pub(crate) fn move_to_field(&mut self, field_index: usize, field_count: usize) {
        if field_index < field_count {
            self.current_field = field_index;
@@ -134,6 +168,11 @@ impl EditorState {
        }
    }

+    /// Set the cursor position with appropriate clamping depending on mode.
+    ///
+    /// If `for_edit_mode` is true the cursor may be positioned at the end of
+    /// the text (allowing insertion); otherwise it will be kept within the
+    /// bounds of the existing text for read-only/highlight modes.
    pub(crate) fn set_cursor(
        &mut self,
        position: usize,
@@ -150,38 +189,24 @@ impl EditorState {
        self.ideal_cursor_column = self.cursor_pos;
    }

-    /// Legacy internal activation (still used internally if needed)
-    pub(crate) fn activate_suggestions(&mut self, field_index: usize) {
-        self.suggestions.is_active = true;
-        self.suggestions.is_loading = true;
-        self.suggestions.active_field = Some(field_index);
-        self.suggestions.selected_index = None;
-        self.suggestions.completion_text = None;
-    }
-
-    /// Legacy internal deactivation
-    pub(crate) fn deactivate_suggestions(&mut self) {
-        self.suggestions.is_active = false;
-        self.suggestions.is_loading = false;
-        self.suggestions.active_field = None;
-        self.suggestions.selected_index = None;
-        self.suggestions.completion_text = None;
-    }
-
    /// Explicitly open suggestions — should only be called on Tab
+    #[cfg(feature = "suggestions")]
    pub(crate) fn open_suggestions(&mut self, field_index: usize) {
        self.suggestions.is_active = true;
        self.suggestions.is_loading = true;
        self.suggestions.active_field = Some(field_index);
+        self.suggestions.active_query = None;
        self.suggestions.selected_index = None;
        self.suggestions.completion_text = None;
    }

    /// Explicitly close suggestions — should be called on Esc or field change
+    #[cfg(feature = "suggestions")]
    pub(crate) fn close_suggestions(&mut self) {
        self.suggestions.is_active = false;
        self.suggestions.is_loading = false;
        self.suggestions.active_field = None;
+        self.suggestions.active_query = None;
        self.suggestions.selected_index = None;
        self.suggestions.completion_text = None;
    }
--- a/canvas/src/computed/mod.rs
+++ b/canvas/src/computed/mod.rs
@@ -1,5 +1,11 @@
+//! Computed fields subsystem.
+//!
+//! This module exposes the provider trait and the internal state management
+//! for computed (display-only) fields. Computed fields are values derived
+//! from other fields in the form and are not directly editable by the user.
+
 pub mod provider;
 pub mod state;

 pub use provider::{ComputedContext, ComputedProvider};
-pub use state::ComputedState;
+pub use state::ComputedState;
--- a/canvas/src/computed/provider.rs
+++ b/canvas/src/computed/provider.rs
@@ -1,6 +1,7 @@
-// ================================================================================================
-// COMPUTED FIELDS - Provider and Context
-// ================================================================================================
+//! Provider interface and context for computed/display-only fields.
+//!
+//! Implementors provide logic to compute a field's display value from the
+//! other field values in the form.

 /// Context information provided to computed field calculations
 #[derive(Debug, Clone)]
@@ -28,4 +29,4 @@ pub trait ComputedProvider {
    fn field_dependencies(&self, _field_index: usize) -> Vec<usize> {
        (0..100).collect()
    }
-}
+}
--- a/canvas/src/computed/state.rs
+++ b/canvas/src/computed/state.rs
@@ -1,11 +1,10 @@
-/* file: canvas/src/computed/state.rs */
-/*
-Add computed state module file implementing caching and dependencies
-*/
-
-// ================================================================================================
-// COMPUTED FIELDS - State: caching and dependencies
-// ================================================================================================
+// src/computed/state.rs
+//! Computed field state: caching and dependency graph.
+//!
+//! This module holds the internal state necessary to track which fields are
+//! computed, their dependencies, and cached computed values. It is used by the
+//! editor to avoid unnecessary recomputation and to present computed fields as
+//! read-only.

 use std::collections::{HashMap, HashSet};

@@ -85,4 +84,4 @@ impl Default for ComputedState {
    fn default() -> Self {
        Self::new()
    }
-}
+}
--- a/canvas/src/data_provider.rs
+++ b/canvas/src/data_provider.rs
@@ -1,7 +1,9 @@
 // src/data_provider.rs
 //! Simplified user interface - only business data, no UI state

+#[cfg(feature = "suggestions")]
 use anyhow::Result;
+#[cfg(feature = "suggestions")]
 use async_trait::async_trait;

 /// User implements this - only business data, no UI state
@@ -27,7 +29,7 @@ pub trait DataProvider {
    fn display_value(&self, _index: usize) -> Option<&str> {
        None // Default: use actual value
    }
-    
+
    /// Get validation configuration for a field (optional)
    /// Only available when the 'validation' feature is enabled
    #[cfg(feature = "validation")]
@@ -51,6 +53,7 @@ pub trait DataProvider {
 }

 /// Optional: User implements this for suggestions data
+#[cfg(feature = "suggestions")]
 #[async_trait]
 pub trait SuggestionsProvider {
    /// Fetch suggestions (user's business logic)
@@ -58,6 +61,7 @@ pub trait SuggestionsProvider {
        -> Result<Vec<SuggestionItem>>;
 }

+#[cfg(feature = "suggestions")]
 #[derive(Debug, Clone)]
 pub struct SuggestionItem {
    pub display_text: String,
--- a/canvas/src/editor.rs
+++ b/canvas/src/editor.rs
--- a/canvas/src/editor/computed_helpers.rs
+++ b/canvas/src/editor/computed_helpers.rs
@@ -0,0 +1,111 @@
+// src/editor/computed_helpers.rs
+
+use crate::computed::{ComputedContext, ComputedProvider, ComputedState};
+use crate::editor::FormEditor;
+use crate::DataProvider;
+
+impl<D: DataProvider> FormEditor<D> {
+    #[cfg(feature = "computed")]
+    pub fn set_computed_provider<C>(&mut self, mut provider: C)
+    where
+        C: ComputedProvider,
+    {
+        self.ui_state.computed = Some(ComputedState::new());
+
+        let field_count = self.data_provider.field_count();
+        for field_index in 0..field_count {
+            if provider.handles_field(field_index) {
+                let deps = provider.field_dependencies(field_index);
+                if let Some(computed_state) = &mut self.ui_state.computed {
+                    computed_state.register_computed_field(field_index, deps);
+                }
+            }
+        }
+
+        self.recompute_all_fields(&mut provider);
+    }
+
+    #[cfg(feature = "computed")]
+    pub fn recompute_fields<C>(
+        &mut self,
+        provider: &mut C,
+        field_indices: &[usize],
+    ) where
+        C: ComputedProvider,
+    {
+        if let Some(computed_state) = &mut self.ui_state.computed {
+            let field_values: Vec<String> = (0..self.data_provider.field_count())
+                .map(|i| {
+                    if computed_state.is_computed_field(i) {
+                        computed_state
+                            .get_computed_value(i)
+                            .cloned()
+                            .unwrap_or_default()
+                    } else {
+                        self.data_provider.field_value(i).to_string()
+                    }
+                })
+                .collect();
+
+            let field_refs: Vec<&str> =
+                field_values.iter().map(|s| s.as_str()).collect();
+
+            for &field_index in field_indices {
+                if provider.handles_field(field_index) {
+                    let context = ComputedContext {
+                        field_values: &field_refs,
+                        target_field: field_index,
+                        current_field: Some(self.ui_state.current_field),
+                    };
+
+                    let computed_value = provider.compute_field(context);
+                    computed_state.set_computed_value(
+                        field_index,
+                        computed_value,
+                    );
+                }
+            }
+        }
+    }
+
+    #[cfg(feature = "computed")]
+    pub fn recompute_all_fields<C>(&mut self, provider: &mut C)
+    where
+        C: ComputedProvider,
+    {
+        if let Some(computed_state) = &self.ui_state.computed {
+            let computed_fields: Vec<usize> =
+                computed_state.computed_fields().collect();
+            self.recompute_fields(provider, &computed_fields);
+        }
+    }
+
+    #[cfg(feature = "computed")]
+    pub fn on_field_changed<C>(
+        &mut self,
+        provider: &mut C,
+        changed_field: usize,
+    ) where
+        C: ComputedProvider,
+    {
+        if let Some(computed_state) = &self.ui_state.computed {
+            let fields_to_update =
+                computed_state.fields_to_recompute(changed_field);
+            if !fields_to_update.is_empty() {
+                self.recompute_fields(provider, &fields_to_update);
+            }
+        }
+    }
+
+    #[cfg(feature = "computed")]
+    pub fn effective_field_value(&self, field_index: usize) -> String {
+        if let Some(computed_state) = &self.ui_state.computed {
+            if let Some(computed_value) =
+                computed_state.get_computed_value(field_index)
+            {
+                return computed_value.clone();
+            }
+        }
+        self.data_provider.field_value(field_index).to_string()
+    }
+}
--- a/canvas/src/editor/core.rs
+++ b/canvas/src/editor/core.rs
@@ -0,0 +1,166 @@
+// src/editor/core.rs
+
+#[cfg(feature = "cursor-style")]
+use crate::canvas::CursorManager;
+
+use crate::canvas::modes::AppMode;
+use crate::canvas::state::EditorState;
+use crate::DataProvider;
+#[cfg(feature = "suggestions")]
+use crate::SuggestionItem;
+
+// NEW: Import keymap types when keymap feature is enabled
+#[cfg(feature = "keymap")]
+use crate::keymap::{CanvasKeyMap, KeySequenceTracker};
+
+pub struct FormEditor<D: DataProvider> {
+    pub(crate) ui_state: EditorState,
+    pub(crate) data_provider: D,
+    #[cfg(feature = "suggestions")]
+    pub(crate) suggestions: Vec<SuggestionItem>,
+
+    #[cfg(feature = "validation")]
+    pub(crate) external_validation_callback: Option<
+        Box<
+            dyn FnMut(usize, &str) -> crate::validation::ExternalValidationState
+                + Send
+                + Sync,
+        >,
+    >,
+
+    // NEW: Injected keymap and sequence tracker (keymap feature only)
+    #[cfg(feature = "keymap")]
+    pub(crate) keymap: Option<CanvasKeyMap>,
+    #[cfg(feature = "keymap")]
+    pub(crate) seq_tracker: KeySequenceTracker,
+}
+
+impl<D: DataProvider> FormEditor<D> {
+    // Make helpers visible to sibling modules in this crate
+    pub(crate) fn char_to_byte_index(s: &str, char_idx: usize) -> usize {
+        s.char_indices()
+            .nth(char_idx)
+            .map(|(byte_idx, _)| byte_idx)
+            .unwrap_or_else(|| s.len())
+    }
+
+    #[allow(dead_code)]
+    pub(crate) fn byte_to_char_index(s: &str, byte_idx: usize) -> usize {
+        s[..byte_idx].chars().count()
+    }
+
+    pub fn new(data_provider: D) -> Self {
+        let editor = Self {
+            ui_state: EditorState::new(),
+            data_provider,
+            #[cfg(feature = "suggestions")]
+            suggestions: Vec::new(),
+            #[cfg(feature = "validation")]
+            external_validation_callback: None,
+            // NEW: Initialize keymap fields
+            #[cfg(feature = "keymap")]
+            keymap: None,
+            #[cfg(feature = "keymap")]
+            seq_tracker: KeySequenceTracker::new(400), // 400ms default timeout
+        };
+
+        #[cfg(feature = "validation")]
+        {
+            let mut editor = editor;
+            editor.initialize_validation();
+
+            #[cfg(feature = "cursor-style")]
+            {
+                let _ = CursorManager::update_for_mode(editor.ui_state.current_mode);
+            }
+            editor
+        }
+        #[cfg(not(feature = "validation"))]
+        {
+            #[cfg(feature = "cursor-style")]
+            {
+                let _ = CursorManager::update_for_mode(editor.ui_state.current_mode);
+            }
+            editor
+        }
+    }
+
+    // NEW: Keymap management methods (keymap feature only)
+    
+    /// Set the keymap for this editor instance
+    #[cfg(feature = "keymap")]
+    pub fn set_keymap(&mut self, keymap: CanvasKeyMap) {
+        self.keymap = Some(keymap);
+    }
+
+    /// Check if this editor has a keymap configured
+    #[cfg(feature = "keymap")]
+    pub fn has_keymap(&self) -> bool {
+        self.keymap.is_some()
+    }
+
+    /// Set the timeout for multi-key sequences (in milliseconds)
+    #[cfg(feature = "keymap")]
+    pub fn set_key_sequence_timeout_ms(&mut self, timeout_ms: u64) {
+        self.seq_tracker = KeySequenceTracker::new(timeout_ms);
+    }
+
+    // Library-internal, used by multiple modules
+    pub(crate) fn current_text(&self) -> &str {
+        let field_index = self.ui_state.current_field;
+        if field_index < self.data_provider.field_count() {
+            self.data_provider.field_value(field_index)
+        } else {
+            ""
+        }
+    }
+
+    // Read-only getters
+    pub fn current_field(&self) -> usize {
+        self.ui_state.current_field()
+    }
+    pub fn cursor_position(&self) -> usize {
+        self.ui_state.cursor_position()
+    }
+    pub fn mode(&self) -> AppMode {
+        self.ui_state.mode()
+    }
+    #[cfg(feature = "suggestions")]
+    pub fn is_suggestions_active(&self) -> bool {
+        self.ui_state.is_suggestions_active()
+    }
+    pub fn ui_state(&self) -> &EditorState {
+        &self.ui_state
+    }
+    pub fn data_provider(&self) -> &D {
+        &self.data_provider
+    }
+    pub fn data_provider_mut(&mut self) -> &mut D {
+        &mut self.data_provider
+    }
+    #[cfg(feature = "suggestions")]
+    pub fn suggestions(&self) -> &[SuggestionItem] {
+        &self.suggestions
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn validation_state(&self) -> &crate::validation::ValidationState {
+        self.ui_state.validation_state()
+    }
+
+    // Cursor cleanup
+    #[cfg(feature = "cursor-style")]
+    pub fn cleanup_cursor(&self) -> std::io::Result<()> {
+        CursorManager::reset()
+    }
+    #[cfg(not(feature = "cursor-style"))]
+    pub fn cleanup_cursor(&self) -> std::io::Result<()> {
+        Ok(())
+    }
+}
+
+impl<D: DataProvider> Drop for FormEditor<D> {
+    fn drop(&mut self) {
+        let _ = self.cleanup_cursor();
+    }
+}
--- a/canvas/src/editor/display.rs
+++ b/canvas/src/editor/display.rs
@@ -0,0 +1,123 @@
+// src/editor/display.rs
+
+use crate::canvas::modes::AppMode;
+use crate::editor::FormEditor;
+use crate::DataProvider;
+
+impl<D: DataProvider> FormEditor<D> {
+    /// Get current field text for display.
+    /// Policies documented in original file.
+    #[cfg(feature = "validation")]
+    pub fn current_display_text(&self) -> String {
+        let field_index = self.ui_state.current_field;
+        let raw = if field_index < self.data_provider.field_count() {
+            self.data_provider.field_value(field_index)
+        } else {
+            ""
+        };
+
+        if let Some(cfg) = self.ui_state.validation.get_field_config(field_index) {
+            if cfg.custom_formatter.is_none() {
+                if let Some(mask) = &cfg.display_mask {
+                    return mask.apply_to_display(raw);
+                }
+            }
+
+            if cfg.custom_formatter.is_some() {
+                if matches!(self.ui_state.current_mode, AppMode::Edit) {
+                    return raw.to_string();
+                }
+                if let Some((formatted, _mapper, _warning)) =
+                    cfg.run_custom_formatter(raw)
+                {
+                    return formatted;
+                }
+            }
+
+            if let Some(mask) = &cfg.display_mask {
+                return mask.apply_to_display(raw);
+            }
+        }
+
+        raw.to_string()
+    }
+
+    /// Get effective display text for any field index (Feature 4 + masks).
+    #[cfg(feature = "validation")]
+    pub fn display_text_for_field(&self, field_index: usize) -> String {
+        let raw = if field_index < self.data_provider.field_count() {
+            self.data_provider.field_value(field_index)
+        } else {
+            ""
+        };
+
+        if let Some(cfg) = self.ui_state.validation.get_field_config(field_index) {
+            if cfg.custom_formatter.is_none() {
+                if let Some(mask) = &cfg.display_mask {
+                    return mask.apply_to_display(raw);
+                }
+            }
+
+            if cfg.custom_formatter.is_some() {
+                if field_index == self.ui_state.current_field
+                    && matches!(self.ui_state.current_mode, AppMode::Edit)
+                {
+                    return raw.to_string();
+                }
+                if let Some((formatted, _mapper, _warning)) =
+                    cfg.run_custom_formatter(raw)
+                {
+                    return formatted;
+                }
+            }
+
+            if let Some(mask) = &cfg.display_mask {
+                return mask.apply_to_display(raw);
+            }
+        }
+
+        raw.to_string()
+    }
+
+    /// Map raw cursor to display position (formatter/mask aware).
+    pub fn display_cursor_position(&self) -> usize {
+        let current_text = self.current_text();
+        let char_count = current_text.chars().count();
+
+        let raw_pos = match self.ui_state.current_mode {
+            AppMode::Edit => self.ui_state.cursor_pos.min(char_count),
+            _ => {
+                if char_count == 0 {
+                    0
+                } else {
+                    self.ui_state
+                        .cursor_pos
+                        .min(char_count.saturating_sub(1))
+                }
+            }
+        };
+
+        #[cfg(feature = "validation")]
+        {
+            let field_index = self.ui_state.current_field;
+            if let Some(cfg) = self.ui_state.validation.get_field_config(field_index) {
+                if !matches!(self.ui_state.current_mode, AppMode::Edit) {
+                    if let Some((formatted, mapper, _)) =
+                        cfg.run_custom_formatter(current_text)
+                    {
+                        return mapper.raw_to_formatted(
+                            current_text,
+                            &formatted,
+                            raw_pos,
+                        );
+                    }
+                }
+                if let Some(mask) = &cfg.display_mask {
+                    return mask.raw_pos_to_display_pos(raw_pos);
+                }
+            }
+        }
+
+        raw_pos
+    }
+}
--- a/canvas/src/editor/editing.rs
+++ b/canvas/src/editor/editing.rs
@@ -0,0 +1,348 @@
+// src/editor/editing.rs
+
+use crate::editor::FormEditor;
+use crate::DataProvider;
+
+impl<D: DataProvider> FormEditor<D> {
+    /// Open new line below (vim o)
+    pub fn open_line_below(&mut self) -> anyhow::Result<()> {
+        // paste the method body unchanged from editor.rs
+        // (exact code from your VIM COMMANDS: o and O section)
+        let field_count = self.data_provider.field_count();
+        if field_count == 0 {
+            return Ok(());
+        }
+        let next_field = (self.ui_state.current_field + 1)
+            .min(field_count.saturating_sub(1));
+        self.transition_to_field(next_field)?;
+        self.ui_state.cursor_pos = 0;
+        self.ui_state.ideal_cursor_column = 0;
+        self.enter_edit_mode();
+        Ok(())
+    }
+
+    /// Open new line above (vim O)
+    pub fn open_line_above(&mut self) -> anyhow::Result<()> {
+        let prev_field = self.ui_state.current_field.saturating_sub(1);
+        self.transition_to_field(prev_field)?;
+        self.ui_state.cursor_pos = 0;
+        self.ui_state.ideal_cursor_column = 0;
+        self.enter_edit_mode();
+        Ok(())
+    }
+
+    /// Handle character insertion (mask/limit-aware)
+    pub fn insert_char(&mut self, ch: char) -> anyhow::Result<()> {
+        // paste entire insert_char body unchanged
+        if self.ui_state.current_mode != crate::canvas::modes::AppMode::Edit
+        {
+            return Ok(());
+        }
+
+        #[cfg(feature = "validation")]
+        let field_index = self.ui_state.current_field;
+        #[cfg(feature = "validation")]
+        let raw_cursor_pos = self.ui_state.cursor_pos;
+        #[cfg(feature = "validation")]
+        let current_raw_text = self.data_provider.field_value(field_index);
+
+        #[cfg(not(feature = "validation"))]
+        let field_index = self.ui_state.current_field;
+        #[cfg(not(feature = "validation"))]
+        let raw_cursor_pos = self.ui_state.cursor_pos;
+        #[cfg(not(feature = "validation"))]
+        let current_raw_text = self.data_provider.field_value(field_index);
+
+        #[cfg(feature = "validation")]
+        {
+            if let Some(cfg) = self.ui_state.validation.get_field_config(
+                field_index,
+            ) {
+                if let Some(mask) = &cfg.display_mask {
+                    let display_cursor_pos =
+                        mask.raw_pos_to_display_pos(raw_cursor_pos);
+
+                    let pattern_char_len = mask.pattern().chars().count();
+                    if display_cursor_pos >= pattern_char_len {
+                        return Ok(());
+                    }
+
+                    if !mask.is_input_position(display_cursor_pos) {
+                        return Ok(());
+                    }
+
+                    let input_slots = (0..pattern_char_len)
+                        .filter(|&pos| mask.is_input_position(pos))
+                        .count();
+                    if current_raw_text.chars().count() >= input_slots {
+                        return Ok(());
+                    }
+                }
+            }
+        }
+
+        #[cfg(feature = "validation")]
+        {
+            let vr = self.ui_state.validation.validate_char_insertion(
+                field_index,
+                current_raw_text,
+                raw_cursor_pos,
+                ch,
+            );
+            if !vr.is_acceptable() {
+                return Ok(());
+            }
+        }
+
+        let new_raw_text = {
+            let mut temp = current_raw_text.to_string();
+            let byte_pos = Self::char_to_byte_index(
+                current_raw_text,
+                raw_cursor_pos,
+            );
+            temp.insert(byte_pos, ch);
+            temp
+        };
+
+        #[cfg(feature = "validation")]
+        {
+            if let Some(cfg) = self.ui_state.validation.get_field_config(
+                field_index,
+            ) {
+                if let Some(limits) = &cfg.character_limits {
+                    if let Some(result) = limits.validate_content(&new_raw_text)
+                    {
+                        if !result.is_acceptable() {
+                            return Ok(());
+                        }
+                    }
+                }
+                if let Some(mask) = &cfg.display_mask {
+                    let pattern_char_len = mask.pattern().chars().count();
+                    let input_slots = (0..pattern_char_len)
+                        .filter(|&pos| mask.is_input_position(pos))
+                        .count();
+                    if new_raw_text.chars().count() > input_slots {
+                        return Ok(());
+                    }
+                }
+            }
+        }
+
+        self.data_provider
+            .set_field_value(field_index, new_raw_text.clone());
+
+        #[cfg(feature = "validation")]
+        {
+            if let Some(cfg) = self.ui_state.validation.get_field_config(
+                field_index,
+            ) {
+                if let Some(mask) = &cfg.display_mask {
+                    let new_raw_pos = raw_cursor_pos + 1;
+                    let display_pos = mask.raw_pos_to_display_pos(new_raw_pos);
+                    let next_input_display =
+                        mask.next_input_position(display_pos);
+                    let next_raw_pos =
+                        mask.display_pos_to_raw_pos(next_input_display);
+                    let max_raw = new_raw_text.chars().count();
+
+                    self.ui_state.cursor_pos = next_raw_pos.min(max_raw);
+                    self.ui_state.ideal_cursor_column =
+                        self.ui_state.cursor_pos;
+                    return Ok(());
+                }
+            }
+        }
+
+        self.ui_state.cursor_pos = raw_cursor_pos + 1;
+        self.ui_state.ideal_cursor_column = self.ui_state.cursor_pos;
+        Ok(())
+    }
+
+    /// Delete backward (backspace)
+    pub fn delete_backward(&mut self) -> anyhow::Result<()> {
+        // paste entire delete_backward body unchanged
+        if self.ui_state.current_mode != crate::canvas::modes::AppMode::Edit
+        {
+            return Ok(());
+        }
+        if self.ui_state.cursor_pos == 0 {
+            return Ok(());
+        }
+
+        let field_index = self.ui_state.current_field;
+        let mut current_text =
+            self.data_provider.field_value(field_index).to_string();
+
+        let new_cursor = self.ui_state.cursor_pos.saturating_sub(1);
+
+        let start = Self::char_to_byte_index(
+            &current_text,
+            self.ui_state.cursor_pos - 1,
+        );
+        let end =
+            Self::char_to_byte_index(&current_text, self.ui_state.cursor_pos);
+        current_text.replace_range(start..end, "");
+        self.data_provider
+            .set_field_value(field_index, current_text.clone());
+
+        #[cfg(feature = "validation")]
+        let mut target_cursor = new_cursor;
+        #[cfg(not(feature = "validation"))]
+        let target_cursor = new_cursor;
+
+        #[cfg(feature = "validation")]
+        {
+            if let Some(cfg) = self.ui_state.validation.get_field_config(
+                field_index,
+            ) {
+                if let Some(mask) = &cfg.display_mask {
+                    let display_pos =
+                        mask.raw_pos_to_display_pos(new_cursor);
+                    if let Some(prev_input) =
+                        mask.prev_input_position(display_pos)
+                    {
+                        target_cursor =
+                            mask.display_pos_to_raw_pos(prev_input);
+                    }
+                }
+            }
+        }
+
+        self.ui_state.cursor_pos = target_cursor;
+        self.ui_state.ideal_cursor_column = target_cursor;
+
+        #[cfg(feature = "validation")]
+        {
+            let _ = self.ui_state.validation.validate_field_content(
+                field_index,
+                &current_text,
+            );
+        }
+
+        Ok(())
+    }
+
+    /// Delete forward (Delete key)
+    pub fn delete_forward(&mut self) -> anyhow::Result<()> {
+        // paste entire delete_forward body unchanged
+        if self.ui_state.current_mode != crate::canvas::modes::AppMode::Edit
+        {
+            return Ok(());
+        }
+
+        let field_index = self.ui_state.current_field;
+        let mut current_text =
+            self.data_provider.field_value(field_index).to_string();
+
+        if self.ui_state.cursor_pos < current_text.chars().count() {
+            let start = Self::char_to_byte_index(
+                &current_text,
+                self.ui_state.cursor_pos,
+            );
+            let end = Self::char_to_byte_index(
+                &current_text,
+                self.ui_state.cursor_pos + 1,
+            );
+            current_text.replace_range(start..end, "");
+            self.data_provider
+                .set_field_value(field_index, current_text.clone());
+
+            #[cfg(feature = "validation")]
+            let mut target_cursor = self.ui_state.cursor_pos;
+            #[cfg(not(feature = "validation"))]
+            let target_cursor = self.ui_state.cursor_pos;
+
+            #[cfg(feature = "validation")]
+            {
+                if let Some(cfg) = self.ui_state.validation.get_field_config(
+                    field_index,
+                ) {
+                    if let Some(mask) = &cfg.display_mask {
+                        let display_pos =
+                            mask.raw_pos_to_display_pos(
+                                self.ui_state.cursor_pos,
+                            );
+                        let next_input =
+                            mask.next_input_position(display_pos);
+                        target_cursor = mask
+                            .display_pos_to_raw_pos(next_input)
+                            .min(current_text.chars().count());
+                    }
+                }
+            }
+
+            self.ui_state.cursor_pos = target_cursor;
+            self.ui_state.ideal_cursor_column = target_cursor;
+
+            #[cfg(feature = "validation")]
+            {
+                let _ = self.ui_state.validation.validate_field_content(
+                    field_index,
+                    &current_text,
+                );
+            }
+        }
+
+        Ok(())
+    }
+
+    /// Enter edit mode with cursor positioned for append (vim 'a')
+    pub fn enter_append_mode(&mut self) {
+        // paste body unchanged
+        let current_text = self.current_text();
+
+        let char_len = current_text.chars().count();
+        let append_pos = if current_text.is_empty() {
+            0
+        } else {
+            (self.ui_state.cursor_pos + 1).min(char_len)
+        };
+
+        self.ui_state.cursor_pos = append_pos;
+        self.ui_state.ideal_cursor_column = append_pos;
+
+        self.set_mode(crate::canvas::modes::AppMode::Edit);
+    }
+
+    /// Set current field value (validates under feature flag)
+    pub fn set_current_field_value(&mut self, value: String) {
+        let field_index = self.ui_state.current_field;
+        self.data_provider.set_field_value(field_index, value.clone());
+        self.ui_state.cursor_pos = 0;
+        self.ui_state.ideal_cursor_column = 0;
+
+        #[cfg(feature = "validation")]
+        {
+            let _ = self
+                .ui_state
+                .validation
+                .validate_field_content(field_index, &value);
+        }
+    }
+
+    /// Set specific field value by index (validates under feature flag)
+    pub fn set_field_value(&mut self, field_index: usize, value: String) {
+        if field_index < self.data_provider.field_count() {
+            self.data_provider
+                .set_field_value(field_index, value.clone());
+            if field_index == self.ui_state.current_field {
+                self.ui_state.cursor_pos = 0;
+                self.ui_state.ideal_cursor_column = 0;
+            }
+
+            #[cfg(feature = "validation")]
+            {
+                let _ = self
+                    .ui_state
+                    .validation
+                    .validate_field_content(field_index, &value);
+            }
+        }
+    }
+
+    /// Clear the current field
+    pub fn clear_current_field(&mut self) {
+        self.set_current_field_value(String::new());
+    }
+}
--- a/canvas/src/editor/key_input.rs
+++ b/canvas/src/editor/key_input.rs
@@ -0,0 +1,228 @@
+// src/editor/key_input.rs
+use crossterm::event::{KeyCode, KeyEvent, KeyModifiers};
+
+use crate::canvas::modes::AppMode;
+use crate::editor::FormEditor;
+use crate::DataProvider;
+
+#[cfg(feature = "keymap")]
+use crate::keymap::{KeyEventOutcome, KeyStroke};
+
+impl<D: DataProvider> FormEditor<D> {
+    #[cfg(feature = "keymap")]
+    pub fn handle_key_event(&mut self, evt: KeyEvent) -> KeyEventOutcome {
+        // Check if keymap exists first
+        if self.keymap.is_none() {
+            return KeyEventOutcome::NotMatched;
+        }
+
+        let mode = self.ui_state.current_mode;
+
+        // Convert event to normalized stroke
+        let stroke = KeyStroke {
+            code: evt.code,
+            modifiers: evt.modifiers,
+        };
+
+        // Add key to sequence tracker
+        self.seq_tracker.add_key(stroke);
+
+        // Look up the action in keymap
+        let (matched, is_prefix) = {
+            let km = self.keymap.as_ref().unwrap();
+            km.lookup(mode, self.seq_tracker.sequence())
+        };
+
+        if let Some(action) = matched {
+            // Clone the action string to avoid borrow checker issues
+            let action_owned = action.to_string();
+            let msg = self.dispatch_canvas_action(&action_owned);
+            self.seq_tracker.reset();
+            return KeyEventOutcome::Consumed(msg);
+        }
+
+        if is_prefix {
+            // Wait for more keys
+            return KeyEventOutcome::Pending;
+        }
+
+        // No match: reset sequence and try insert-char fallback in Edit
+        self.seq_tracker.reset();
+
+        if mode == AppMode::Edit {
+            if let KeyCode::Char(c) = evt.code {
+                // Skip control/alt combos
+                let m = evt.modifiers;
+                let is_plain =
+                    m.is_empty() || m == KeyModifiers::SHIFT;
+                if is_plain {
+                    if self.insert_char(c).is_ok() {
+                        return KeyEventOutcome::Consumed(None);
+                    }
+                }
+            }
+        }
+
+        KeyEventOutcome::NotMatched
+    }
+
+    #[cfg(feature = "keymap")]
+    fn dispatch_canvas_action(&mut self, action: &str) -> Option<String> {
+        match action {
+            // Movement
+            "move_left" => {
+                let _ = self.move_left();
+                None
+            }
+            "move_right" => {
+                let _ = self.move_right();
+                None
+            }
+            "move_up" => {
+                let _ = self.move_up();
+                None
+            }
+            "move_down" => {
+                let _ = self.move_down();
+                None
+            }
+            "next_field" => {
+                let _ = self.next_field();
+                None
+            }
+            "prev_field" => {
+                let _ = self.prev_field();
+                None
+            }
+            "move_line_start" => {
+                self.move_line_start();
+                None
+            }
+            "move_line_end" => {
+                self.move_line_end();
+                None
+            }
+            "move_first_line" => {
+                let _ = self.move_first_line();
+                None
+            }
+            "move_last_line" => {
+                let _ = self.move_last_line();
+                None
+            }
+
+            // Word/big-word movement (cross-field aware)
+            "move_word_next" => {
+                self.move_word_next();
+                None
+            }
+            "move_word_prev" => {
+                self.move_word_prev();
+                None
+            }
+            "move_word_end" => {
+                self.move_word_end();
+                None
+            }
+            "move_word_end_prev" => {
+                self.move_word_end_prev();
+                None
+            }
+            "move_big_word_next" => {
+                self.move_big_word_next();
+                None
+            }
+            "move_big_word_prev" => {
+                self.move_big_word_prev();
+                None
+            }
+            "move_big_word_end" => {
+                self.move_big_word_end();
+                None
+            }
+            "move_big_word_end_prev" => {
+                self.move_big_word_end_prev();
+                None
+            }
+
+            // Editing
+            "delete_char_backward" => {
+                let _ = self.delete_backward();
+                None
+            }
+            "delete_char_forward" => {
+                let _ = self.delete_forward();
+                None
+            }
+            "open_line_below" => {
+                let _ = self.open_line_below();
+                None
+            }
+            "open_line_above" => {
+                let _ = self.open_line_above();
+                None
+            }
+
+            // Suggestions (only when feature is enabled)
+            #[cfg(feature = "suggestions")]
+            "open_suggestions" => {
+                let idx = self.current_field();
+                self.open_suggestions(idx);
+                None
+            }
+            #[cfg(feature = "suggestions")]
+            "apply_suggestion" | "enter_decider" => {
+                if let Some(_applied) = self.apply_suggestion() {
+                    None
+                } else {
+                    None
+                }
+            }
+            #[cfg(feature = "suggestions")]
+            "suggestion_down" => {
+                self.suggestions_next();
+                None
+            }
+            #[cfg(feature = "suggestions")]
+            "suggestion_up" => {
+                self.suggestions_prev();
+                None
+            }
+
+            // Mode transitions (vim-like)
+            "enter_edit_mode_before" => {
+                self.enter_edit_mode();
+                None
+            }
+            "enter_edit_mode_after" => {
+                // Move forward 1 char if possible (vim 'a'), then enter insert
+                let txt_len = self.current_text().chars().count();
+                let pos = self.ui_state.cursor_pos;
+                if pos < txt_len {
+                    self.ui_state.cursor_pos = pos + 1;
+                    self.ui_state.ideal_cursor_column = self.ui_state.cursor_pos;
+                }
+                self.enter_edit_mode();
+                None
+            }
+            "exit" | "exit_edit_mode" => {
+                let _ = self.exit_edit_mode();
+                None
+            }
+            "enter_highlight_mode" => {
+                self.enter_highlight_mode();
+                None
+            }
+            "enter_highlight_mode_linewise" => {
+                self.enter_highlight_line_mode();
+                None
+            }
+            "exit_highlight_mode" => {
+                self.exit_highlight_mode();
+                None
+            }
+
+            _ => None,
+        }
+    }
+}
--- a/canvas/src/editor/mod.rs
+++ b/canvas/src/editor/mod.rs
@@ -0,0 +1,28 @@
+// src/editor/mod.rs
+//! Editor submodule exports.
+//!
+//! This module exposes the internal editor pieces (core, editing, movement,
+//! navigation, mode, and optional features like suggestions, validation, and
+//! computed field helpers). Only module declarations and re-exports live here.
+
+pub mod core;
+pub mod display;
+pub mod editing;
+pub mod movement;
+pub mod navigation;
+pub mod mode;
+
+#[cfg(feature = "suggestions")]
+pub mod suggestions;
+
+#[cfg(feature = "validation")]
+pub mod validation_helpers;
+
+#[cfg(feature = "computed")]
+pub mod computed_helpers;
+
+#[cfg(feature = "keymap")] 
+pub mod key_input;
+
+// Re-export the main type
+pub use core::FormEditor;
--- a/canvas/src/editor/mode.rs
+++ b/canvas/src/editor/mode.rs
@@ -0,0 +1,305 @@
+// src/editor/mode.rs
+
+#[cfg(feature = "cursor-style")]
+use crate::canvas::CursorManager;
+
+use crate::canvas::modes::AppMode;
+use crate::canvas::state::SelectionState;
+use crate::editor::FormEditor;
+use crate::DataProvider;
+
+impl<D: DataProvider> FormEditor<D> {
+    /// Change mode
+    pub fn set_mode(&mut self, mode: AppMode) {
+        // Avoid unused param warning in normalmode
+        #[cfg(feature = "textmode-normal")]
+        let _ = mode;
+
+        // NORMALMODE: force Edit, ignore requested mode
+        #[cfg(feature = "textmode-normal")]
+        {
+            self.ui_state.current_mode = AppMode::Edit;
+            self.ui_state.selection = SelectionState::None;
+
+            #[cfg(feature = "cursor-style")]
+            {
+                let _ = CursorManager::update_for_mode(AppMode::Edit);
+            }
+        }
+
+        // Default (not normal): original vim behavior
+        #[cfg(not(feature = "textmode-normal"))]
+        match (self.ui_state.current_mode, mode) {
+            (AppMode::ReadOnly, AppMode::Highlight) => {
+                self.enter_highlight_mode();
+            }
+            (AppMode::Highlight, AppMode::ReadOnly) => {
+                self.exit_highlight_mode();
+            }
+            (_, new_mode) => {
+                self.ui_state.current_mode = new_mode;
+                if new_mode != AppMode::Highlight {
+                    self.ui_state.selection = SelectionState::None;
+                }
+                #[cfg(feature = "cursor-style")]
+                {
+                    let _ = CursorManager::update_for_mode(new_mode);
+                }
+            }
+        }
+    }
+
+    /// Exit edit mode to read-only mode
+    pub fn exit_edit_mode(&mut self) -> anyhow::Result<()> {
+        #[cfg(feature = "validation")]
+        {
+            let current_text = self.current_text();
+            if !self.ui_state.validation.allows_field_switch(
+                self.ui_state.current_field,
+                current_text,
+            ) {
+                if let Some(reason) = self
+                    .ui_state
+                    .validation
+                    .field_switch_block_reason(
+                        self.ui_state.current_field,
+                        current_text,
+                    )
+                {
+                    self.ui_state
+                        .validation
+                        .set_last_switch_block(reason.clone());
+                    return Err(anyhow::anyhow!(
+                        "Cannot exit edit mode: {}",
+                        reason
+                    ));
+                }
+            }
+        }
+
+        let current_text = self.current_text();
+        if !current_text.is_empty() {
+            let max_normal_pos =
+                current_text.chars().count().saturating_sub(1);
+            if self.ui_state.cursor_pos > max_normal_pos {
+                self.ui_state.cursor_pos = max_normal_pos;
+                self.ui_state.ideal_cursor_column = self.ui_state.cursor_pos;
+            }
+        }
+
+        #[cfg(feature = "validation")]
+        {
+            let field_index = self.ui_state.current_field;
+            if let Some(cfg) =
+                self.ui_state.validation.get_field_config(field_index)
+            {
+                if cfg.external_validation_enabled {
+                    let text = self.current_text().to_string();
+                    if !text.is_empty() {
+                        self.set_external_validation(
+                            field_index,
+                            crate::validation::ExternalValidationState::Validating,
+                        );
+                        if let Some(cb) =
+                            self.external_validation_callback.as_mut()
+                        {
+                            let final_state = cb(field_index, &text);
+                            self.set_external_validation(field_index, final_state);
+                        }
+                    }
+                }
+            }
+        }
+
+        // NORMALMODE: stay in Edit (do not switch to ReadOnly)
+        #[cfg(feature = "textmode-normal")]
+        {
+            #[cfg(feature = "suggestions")]
+            {
+                self.close_suggestions();
+            }
+            Ok(())
+        }
+
+        // Default (not normal): original vim behavior
+        #[cfg(not(feature = "textmode-normal"))]
+        {
+            self.set_mode(AppMode::ReadOnly);
+            #[cfg(feature = "suggestions")]
+            {
+                self.close_suggestions();
+            }
+            Ok(())
+        }
+    }
+
+    /// Enter edit mode
+    pub fn enter_edit_mode(&mut self) {
+        #[cfg(feature = "computed")]
+        {
+            if let Some(computed_state) = &self.ui_state.computed {
+                if computed_state.is_computed_field(self.ui_state.current_field)
+                {
+                    return;
+                }
+            }
+        }
+
+        // NORMALMODE: already in Edit, but enforce it
+        #[cfg(feature = "textmode-normal")]
+        {
+            self.ui_state.current_mode = AppMode::Edit;
+            self.ui_state.selection = SelectionState::None;
+            #[cfg(feature = "cursor-style")]
+            {
+                let _ = CursorManager::update_for_mode(AppMode::Edit);
+            }
+        }
+
+        // Default (not normal): vim behavior
+        #[cfg(not(feature = "textmode-normal"))]
+        self.set_mode(AppMode::Edit);
+    }
+
+    // -------------------- Highlight/Visual mode -------------------------
+
+    pub fn enter_highlight_mode(&mut self) {
+        // NORMALMODE: ignore request (stay in Edit)
+        #[cfg(feature = "textmode-normal")]
+        {
+        }
+
+        // Default (not normal): original vim
+        #[cfg(not(feature = "textmode-normal"))]
+        {
+            if self.ui_state.current_mode == AppMode::ReadOnly {
+                self.ui_state.current_mode = AppMode::Highlight;
+                self.ui_state.selection = SelectionState::Characterwise {
+                    anchor: (self.ui_state.current_field, self.ui_state.cursor_pos),
+                };
+
+                #[cfg(feature = "cursor-style")]
+                {
+                    let _ = CursorManager::update_for_mode(AppMode::Highlight);
+                }
+            }
+        }
+    }
+
+    pub fn enter_highlight_line_mode(&mut self) {
+        // NORMALMODE: ignore
+        #[cfg(feature = "textmode-normal")]
+        {
+        }
+
+        // Default (not normal): original vim
+        #[cfg(not(feature = "textmode-normal"))]
+        {
+            if self.ui_state.current_mode == AppMode::ReadOnly {
+                self.ui_state.current_mode = AppMode::Highlight;
+                self.ui_state.selection =
+                    SelectionState::Linewise { anchor_field: self.ui_state.current_field };
+
+                #[cfg(feature = "cursor-style")]
+                {
+                    let _ = CursorManager::update_for_mode(AppMode::Highlight);
+                }
+            }
+        }
+    }
+
+    pub fn exit_highlight_mode(&mut self) {
+        // NORMALMODE: ignore
+        #[cfg(feature = "textmode-normal")]
+        {
+        }
+
+        // Default (not normal): original vim
+        #[cfg(not(feature = "textmode-normal"))]
+        {
+            if self.ui_state.current_mode == AppMode::Highlight {
+                self.ui_state.current_mode = AppMode::ReadOnly;
+                self.ui_state.selection = SelectionState::None;
+
+                #[cfg(feature = "cursor-style")]
+                {
+                    let _ = CursorManager::update_for_mode(AppMode::ReadOnly);
+                }
+            }
+        }
+    }
+
+    pub fn is_highlight_mode(&self) -> bool {
+        #[cfg(feature = "textmode-normal")]
+        {
+            false
+        }
+        #[cfg(not(feature = "textmode-normal"))]
+        {
+            return self.ui_state.current_mode == AppMode::Highlight;
+        }
+    }
+
+    pub fn selection_state(&self) -> &SelectionState {
+        &self.ui_state.selection
+    }
+
+    // Visual-mode movements reuse existing movement methods
+    // These keep calling the movement methods; in normalmode selection is never enabled,
+    // so these just move without creating a selection.
+    pub fn move_left_with_selection(&mut self) {
+        let _ = self.move_left();
+    }
+
+    pub fn move_right_with_selection(&mut self) {
+        let _ = self.move_right();
+    }
+
+    pub fn move_up_with_selection(&mut self) {
+        let _ = self.move_up();
+    }
+
+    pub fn move_down_with_selection(&mut self) {
+        let _ = self.move_down();
+    }
+
+    pub fn move_word_next_with_selection(&mut self) {
+        self.move_word_next();
+    }
+
+    pub fn move_word_end_with_selection(&mut self) {
+        self.move_word_end();
+    }
+
+    pub fn move_word_prev_with_selection(&mut self) {
+        self.move_word_prev();
+    }
+
+    pub fn move_word_end_prev_with_selection(&mut self) {
+        self.move_word_end_prev();
+    }
+
+    pub fn move_big_word_next_with_selection(&mut self) {
+        self.move_big_word_next();
+    }
+
+    pub fn move_big_word_end_with_selection(&mut self) {
+        self.move_big_word_end();
+    }
+
+    pub fn move_big_word_prev_with_selection(&mut self) {
+        self.move_big_word_prev();
+    }
+
+    pub fn move_big_word_end_prev_with_selection(&mut self) {
+        self.move_big_word_end_prev();
+    }
+
+    pub fn move_line_start_with_selection(&mut self) {
+        self.move_line_start();
+    }
+
+    pub fn move_line_end_with_selection(&mut self) {
+        self.move_line_end();
+    }
+}
--- a/canvas/src/editor/movement.rs
+++ b/canvas/src/editor/movement.rs
@@ -0,0 +1,687 @@
+// src/editor/movement.rs
+
+use crate::canvas::actions::movement::line::{
+    line_end_position, line_start_position,
+};
+use crate::canvas::modes::AppMode;
+use crate::editor::FormEditor;
+use crate::DataProvider;
+use crate::canvas::actions::movement::word::{
+    find_last_big_word_start_in_field, find_last_word_start_in_field,
+};
+
+impl<D: DataProvider> FormEditor<D> {
+    /// Move cursor left within current field (mask-aware)
+    pub fn move_left(&mut self) -> anyhow::Result<()> {
+        #[cfg(feature = "validation")]
+        let mut moved = false;
+        #[cfg(not(feature = "validation"))]
+        let moved = false;
+
+        #[cfg(feature = "validation")]
+        {
+            let field_index = self.ui_state.current_field;
+            if let Some(cfg) =
+                self.ui_state.validation.get_field_config(field_index)
+            {
+                if let Some(mask) = &cfg.display_mask {
+                    let display_pos =
+                        mask.raw_pos_to_display_pos(self.ui_state.cursor_pos);
+                    if let Some(prev_input) =
+                        mask.prev_input_position(display_pos)
+                    {
+                        let raw_pos =
+                            mask.display_pos_to_raw_pos(prev_input);
+                        let max_pos = self.current_text().chars().count();
+                        self.ui_state.cursor_pos = raw_pos.min(max_pos);
+                        self.ui_state.ideal_cursor_column =
+                            self.ui_state.cursor_pos;
+                        moved = true;
+                    } else {
+                        self.ui_state.cursor_pos = 0;
+                        self.ui_state.ideal_cursor_column = 0;
+                        moved = true;
+                    }
+                }
+            }
+        }
+
+        if !moved
+            && self.ui_state.cursor_pos > 0 {
+                self.ui_state.cursor_pos -= 1;
+                self.ui_state.ideal_cursor_column = self.ui_state.cursor_pos;
+            }
+        Ok(())
+    }
+
+    /// Move cursor right within current field (mask-aware)
+    pub fn move_right(&mut self) -> anyhow::Result<()> {
+        #[cfg(feature = "validation")]
+        let mut moved = false;
+        #[cfg(not(feature = "validation"))]
+        let moved = false;
+
+        #[cfg(feature = "validation")]
+        {
+            let field_index = self.ui_state.current_field;
+            if let Some(cfg) =
+                self.ui_state.validation.get_field_config(field_index)
+            {
+                if let Some(mask) = &cfg.display_mask {
+                    let display_pos =
+                        mask.raw_pos_to_display_pos(self.ui_state.cursor_pos);
+                    let next_display_pos = mask.next_input_position(display_pos);
+                    let next_pos =
+                        mask.display_pos_to_raw_pos(next_display_pos);
+                    let max_pos = self.current_text().chars().count();
+                    self.ui_state.cursor_pos = next_pos.min(max_pos);
+                    self.ui_state.ideal_cursor_column =
+                        self.ui_state.cursor_pos;
+                    moved = true;
+                }
+            }
+        }
+
+        if !moved {
+            let max_pos = self.current_text().chars().count();
+            if self.ui_state.cursor_pos < max_pos {
+                self.ui_state.cursor_pos += 1;
+                self.ui_state.ideal_cursor_column = self.ui_state.cursor_pos;
+            }
+        }
+        Ok(())
+    }
+
+    /// Move to start of current field (vim 0)
+    pub fn move_line_start(&mut self) {
+        let new_pos = line_start_position();
+        self.ui_state.cursor_pos = new_pos;
+        self.ui_state.ideal_cursor_column = new_pos;
+    }
+
+    /// Move to end of current field (vim $)
+    pub fn move_line_end(&mut self) {
+        let current_text = self.current_text();
+        let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+
+        let new_pos = line_end_position(current_text, is_edit_mode);
+        self.ui_state.cursor_pos = new_pos;
+        self.ui_state.ideal_cursor_column = new_pos;
+    }
+
+    /// Set cursor to exact position (for f/F/t/T etc.)
+    pub fn set_cursor_position(&mut self, position: usize) {
+        let current_text = self.current_text();
+        let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+
+        let char_len = current_text.chars().count();
+        let max_pos = if is_edit_mode {
+            char_len
+        } else {
+            char_len.saturating_sub(1)
+        };
+
+        let clamped_pos = position.min(max_pos);
+        self.ui_state.cursor_pos = clamped_pos;
+        self.ui_state.ideal_cursor_column = clamped_pos;
+    }
+}
+
+
+impl<D: DataProvider> FormEditor<D> {
+    /// Move to start of next word (vim w) - can cross field boundaries
+    pub fn move_word_next(&mut self) {
+        use crate::canvas::actions::movement::word::find_next_word_start;
+        let current_text = self.current_text();
+
+        if current_text.is_empty() {
+            // Empty field - try to move to next field
+            if self.move_down().is_ok() {
+                // Successfully moved to next field, try to find first word
+                let new_text = self.current_text();
+                if !new_text.is_empty() {
+                    let first_word_pos = if new_text.chars().next().is_some_and(|c| !c.is_whitespace()) {
+                        // Field starts with non-whitespace, go to position 0
+                        0
+                    } else {
+                        // Field starts with whitespace, find first word
+                        find_next_word_start(new_text, 0)
+                    };
+                    let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+                    let char_len = new_text.chars().count();
+                    let final_pos = if is_edit_mode {
+                        first_word_pos.min(char_len)
+                    } else {
+                        first_word_pos.min(char_len.saturating_sub(1))
+                    };
+                    self.ui_state.cursor_pos = final_pos;
+                    self.ui_state.ideal_cursor_column = final_pos;
+                }
+            }
+            return;
+        }
+
+        let current_pos = self.ui_state.cursor_pos;
+        let new_pos = find_next_word_start(current_text, current_pos);
+        
+        // Check if we've hit the end of the current field
+        if new_pos >= current_text.chars().count() {
+            // At end of field - jump to next field and start from beginning
+            if self.move_down().is_ok() {
+                // Successfully moved to next field
+                let new_text = self.current_text();
+                if new_text.is_empty() {
+                    // New field is empty, cursor stays at 0
+                    self.ui_state.cursor_pos = 0;
+                    self.ui_state.ideal_cursor_column = 0;
+                } else {
+                    // Find first word in new field
+                    let first_word_pos = if new_text.chars().next().is_some_and(|c| !c.is_whitespace()) {
+                        // Field starts with non-whitespace, go to position 0
+                        0
+                    } else {
+                        // Field starts with whitespace, find first word
+                        find_next_word_start(new_text, 0)
+                    };
+                    let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+                    let char_len = new_text.chars().count();
+                    let final_pos = if is_edit_mode {
+                        first_word_pos.min(char_len)
+                    } else {
+                        first_word_pos.min(char_len.saturating_sub(1))
+                    };
+                    self.ui_state.cursor_pos = final_pos;
+                    self.ui_state.ideal_cursor_column = final_pos;
+                }
+            }
+            // If move_down() failed, we stay where we are (at end of last field)
+        } else {
+            // Normal word movement within current field
+            let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+            let char_len = current_text.chars().count();
+            let final_pos = if is_edit_mode {
+                new_pos.min(char_len)
+            } else {
+                new_pos.min(char_len.saturating_sub(1))
+            };
+
+            self.ui_state.cursor_pos = final_pos;
+            self.ui_state.ideal_cursor_column = final_pos;
+        }
+    }
+
+    /// Move to start of previous word (vim b) - can cross field boundaries
+    pub fn move_word_prev(&mut self) {
+        use crate::canvas::actions::movement::word::find_prev_word_start;
+        let current_text = self.current_text();
+
+        if current_text.is_empty() {
+            // Empty field - try to move to previous field and find last word
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok() {
+                // Check if we actually moved to a different field
+                if self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        let last_word_start = find_last_word_start_in_field(new_text);
+                        self.ui_state.cursor_pos = last_word_start;
+                        self.ui_state.ideal_cursor_column = last_word_start;
+                    }
+                }
+            }
+            return;
+        }
+
+        let current_pos = self.ui_state.cursor_pos;
+
+        // Special case: if we're at position 0, jump to previous field
+        if current_pos == 0 {
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok() {
+                // Check if we actually moved to a different field
+                if self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        let last_word_start = find_last_word_start_in_field(new_text);
+                        self.ui_state.cursor_pos = last_word_start;
+                        self.ui_state.ideal_cursor_column = last_word_start;
+                    }
+                }
+            }
+            return;
+        }
+
+        // Try to find previous word in current field
+        let new_pos = find_prev_word_start(current_text, current_pos);
+
+        // Check if we actually moved
+        if new_pos < current_pos {
+            // Normal word movement within current field - we found a previous word
+            self.ui_state.cursor_pos = new_pos;
+            self.ui_state.ideal_cursor_column = new_pos;
+        } else {
+            // We didn't move (probably at start of first word), try previous field
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok() {
+                // Check if we actually moved to a different field
+                if self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        let last_word_start = find_last_word_start_in_field(new_text);
+                        self.ui_state.cursor_pos = last_word_start;
+                        self.ui_state.ideal_cursor_column = last_word_start;
+                    }
+                }
+            }
+        }
+    }
+
+    /// Move to end of current/next word (vim e) - can cross field boundaries
+    pub fn move_word_end(&mut self) {
+        use crate::canvas::actions::movement::word::find_word_end;
+        let current_text = self.current_text();
+
+        if current_text.is_empty() {
+            // Empty field - try to move to next field
+            if self.move_down().is_ok() {
+                // Recursively call move_word_end in the new field
+                self.move_word_end();
+            }
+            return;
+        }
+
+        let current_pos = self.ui_state.cursor_pos;
+        let char_len = current_text.chars().count();
+        let new_pos = find_word_end(current_text, current_pos);
+
+        // Check if we didn't move or hit the end of the field
+        if new_pos == current_pos && current_pos + 1 < char_len {
+            // Try next character and find word end from there
+            let next_pos = find_word_end(current_text, current_pos + 1);
+            if next_pos < char_len {
+                let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+                let final_pos = if is_edit_mode {
+                    next_pos.min(char_len)
+                } else {
+                    next_pos.min(char_len.saturating_sub(1))
+                };
+                self.ui_state.cursor_pos = final_pos;
+                self.ui_state.ideal_cursor_column = final_pos;
+                return;
+            }
+        }
+
+        // If we're at or near the end of the field, try next field
+        if new_pos >= char_len.saturating_sub(1) {
+            if self.move_down().is_ok() {
+                // Position at start and find first word end
+                self.ui_state.cursor_pos = 0;
+                self.ui_state.ideal_cursor_column = 0;
+                self.move_word_end();
+            }
+        } else {
+            // Normal word end movement within current field
+            let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+            let final_pos = if is_edit_mode {
+                new_pos.min(char_len)
+            } else {
+                new_pos.min(char_len.saturating_sub(1))
+            };
+
+            self.ui_state.cursor_pos = final_pos;
+            self.ui_state.ideal_cursor_column = final_pos;
+        }
+    }
+
+    /// Move to end of previous word (vim ge) - can cross field boundaries
+    pub fn move_word_end_prev(&mut self) {
+        use crate::canvas::actions::movement::word::{find_prev_word_end, find_last_word_end_in_field};
+        let current_text = self.current_text();
+
+        if current_text.is_empty() {
+            // Empty field - try to move to previous field (but don't recurse)
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok() {
+                // Check if we actually moved to a different field
+                if self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        // Find end of last word in the field
+                        let last_word_end = find_last_word_end_in_field(new_text);
+                        self.ui_state.cursor_pos = last_word_end;
+                        self.ui_state.ideal_cursor_column = last_word_end;
+                    }
+                }
+            }
+            return;
+        }
+
+        let current_pos = self.ui_state.cursor_pos;
+
+        // Special case: if we're at position 0, jump to previous field (but don't recurse)
+        if current_pos == 0 {
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok() {
+                // Check if we actually moved to a different field
+                if self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        let last_word_end = find_last_word_end_in_field(new_text);
+                        self.ui_state.cursor_pos = last_word_end;
+                        self.ui_state.ideal_cursor_column = last_word_end;
+                    }
+                }
+            }
+            return;
+        }
+
+        let new_pos = find_prev_word_end(current_text, current_pos);
+
+        // Only try to cross fields if we didn't move at all (stayed at same position)
+        if new_pos == current_pos {
+            // We didn't move within the current field, try previous field
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok() {
+                // Check if we actually moved to a different field
+                if self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        let last_word_end = find_last_word_end_in_field(new_text);
+                        self.ui_state.cursor_pos = last_word_end;
+                        self.ui_state.ideal_cursor_column = last_word_end;
+                    }
+                }
+            }
+        } else {
+            // Normal word movement within current field
+            let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+            let char_len = current_text.chars().count();
+            let final_pos = if is_edit_mode {
+                new_pos.min(char_len)
+            } else {
+                new_pos.min(char_len.saturating_sub(1))
+            };
+
+            self.ui_state.cursor_pos = final_pos;
+            self.ui_state.ideal_cursor_column = final_pos;
+        }
+    }
+
+    /// Move to start of next big_word (vim W) - can cross field boundaries
+    pub fn move_big_word_next(&mut self) {
+        use crate::canvas::actions::movement::word::find_next_big_word_start;
+        let current_text = self.current_text();
+
+        if current_text.is_empty() {
+            // Empty field - try to move to next field
+            if self.move_down().is_ok() {
+                // Successfully moved to next field, try to find first big_word
+                let new_text = self.current_text();
+                if !new_text.is_empty() {
+                    let first_big_word_pos = if new_text.chars().next().is_some_and(|c| !c.is_whitespace()) {
+                        // Field starts with non-whitespace, go to position 0
+                        0
+                    } else {
+                        // Field starts with whitespace, find first big_word
+                        find_next_big_word_start(new_text, 0)
+                    };
+                    let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+                    let char_len = new_text.chars().count();
+                    let final_pos = if is_edit_mode {
+                        first_big_word_pos.min(char_len)
+                    } else {
+                        first_big_word_pos.min(char_len.saturating_sub(1))
+                    };
+                    self.ui_state.cursor_pos = final_pos;
+                    self.ui_state.ideal_cursor_column = final_pos;
+                }
+            }
+            return;
+        }
+
+        let current_pos = self.ui_state.cursor_pos;
+        let new_pos = find_next_big_word_start(current_text, current_pos);
+
+        // Check if we've hit the end of the current field
+        if new_pos >= current_text.chars().count() {
+            // At end of field - jump to next field and start from beginning
+            if self.move_down().is_ok() {
+                // Successfully moved to next field
+                let new_text = self.current_text();
+                if new_text.is_empty() {
+                    // New field is empty, cursor stays at 0
+                    self.ui_state.cursor_pos = 0;
+                    self.ui_state.ideal_cursor_column = 0;
+                } else {
+                    // Find first big_word in new field
+                    let first_big_word_pos = if new_text.chars().next().is_some_and(|c| !c.is_whitespace()) {
+                        // Field starts with non-whitespace, go to position 0
+                        0
+                    } else {
+                        // Field starts with whitespace, find first big_word
+                        find_next_big_word_start(new_text, 0)
+                    };
+                    let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+                    let char_len = new_text.chars().count();
+                    let final_pos = if is_edit_mode {
+                        first_big_word_pos.min(char_len)
+                    } else {
+                        first_big_word_pos.min(char_len.saturating_sub(1))
+                    };
+                    self.ui_state.cursor_pos = final_pos;
+                    self.ui_state.ideal_cursor_column = final_pos;
+                }
+            }
+            // If move_down() failed, we stay where we are (at end of last field)
+        } else {
+            // Normal big_word movement within current field
+            let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+            let char_len = current_text.chars().count();
+            let final_pos = if is_edit_mode {
+                new_pos.min(char_len)
+            } else {
+                new_pos.min(char_len.saturating_sub(1))
+            };
+
+            self.ui_state.cursor_pos = final_pos;
+            self.ui_state.ideal_cursor_column = final_pos;
+        }
+    }
+
+    /// Move to start of previous big_word (vim B) - can cross field boundaries
+    pub fn move_big_word_prev(&mut self) {
+        use crate::canvas::actions::movement::word::find_prev_big_word_start;
+        let current_text = self.current_text();
+
+        if current_text.is_empty() {
+            // Empty field - try to move to previous field and find last big_word
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok() {
+                // Check if we actually moved to a different field
+                if self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        let last_big_word_start = find_last_big_word_start_in_field(new_text);
+                        self.ui_state.cursor_pos = last_big_word_start;
+                        self.ui_state.ideal_cursor_column = last_big_word_start;
+                    }
+                }
+            }
+            return;
+        }
+
+        let current_pos = self.ui_state.cursor_pos;
+
+        // Special case: if we're at position 0, jump to previous field
+        if current_pos == 0 {
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok() {
+                // Check if we actually moved to a different field
+                if self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        let last_big_word_start = find_last_big_word_start_in_field(new_text);
+                        self.ui_state.cursor_pos = last_big_word_start;
+                        self.ui_state.ideal_cursor_column = last_big_word_start;
+                    }
+                }
+            }
+            return;
+        }
+
+        // Try to find previous big_word in current field
+        let new_pos = find_prev_big_word_start(current_text, current_pos);
+
+        // Check if we actually moved
+        if new_pos < current_pos {
+            // Normal big_word movement within current field - we found a previous big_word
+            self.ui_state.cursor_pos = new_pos;
+            self.ui_state.ideal_cursor_column = new_pos;
+        } else {
+            // We didn't move (probably at start of first big_word), try previous field
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok() {
+                // Check if we actually moved to a different field
+                if self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        let last_big_word_start = find_last_big_word_start_in_field(new_text);
+                        self.ui_state.cursor_pos = last_big_word_start;
+                        self.ui_state.ideal_cursor_column = last_big_word_start;
+                    }
+                }
+            }
+        }
+    }
+
+    /// Move to end of current/next big_word (vim E) - can cross field boundaries
+    pub fn move_big_word_end(&mut self) {
+        use crate::canvas::actions::movement::word::find_big_word_end;
+        let current_text = self.current_text();
+
+        if current_text.is_empty() {
+            // Empty field - try to move to next field (but don't recurse)
+            if self.move_down().is_ok() {
+                let new_text = self.current_text();
+                if !new_text.is_empty() {
+                    // Find first big_word end in new field
+                    let first_big_word_end = find_big_word_end(new_text, 0);
+                    let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+                    let char_len = new_text.chars().count();
+                    let final_pos = if is_edit_mode {
+                        first_big_word_end.min(char_len)
+                    } else {
+                        first_big_word_end.min(char_len.saturating_sub(1))
+                    };
+                    self.ui_state.cursor_pos = final_pos;
+                    self.ui_state.ideal_cursor_column = final_pos;
+                }
+            }
+            return;
+        }
+
+        let current_pos = self.ui_state.cursor_pos;
+        let char_len = current_text.chars().count();
+        let new_pos = find_big_word_end(current_text, current_pos);
+
+        // Check if we didn't move or hit the end of the field
+        if new_pos == current_pos && current_pos + 1 < char_len {
+            // Try next character and find big_word end from there
+            let next_pos = find_big_word_end(current_text, current_pos + 1);
+            if next_pos < char_len {
+                let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+                let final_pos = if is_edit_mode {
+                    next_pos.min(char_len)
+                } else {
+                    next_pos.min(char_len.saturating_sub(1))
+                };
+                self.ui_state.cursor_pos = final_pos;
+                self.ui_state.ideal_cursor_column = final_pos;
+                return;
+            }
+        }
+
+        // If we're at or near the end of the field, try next field (but don't recurse)
+        if new_pos >= char_len.saturating_sub(1) {
+            if self.move_down().is_ok() {
+                // Find first big_word end in new field
+                let new_text = self.current_text();
+                if !new_text.is_empty() {
+                    let first_big_word_end = find_big_word_end(new_text, 0);
+                    let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+                    let new_char_len = new_text.chars().count();
+                    let final_pos = if is_edit_mode {
+                        first_big_word_end.min(new_char_len)
+                    } else {
+                        first_big_word_end.min(new_char_len.saturating_sub(1))
+                    };
+                    self.ui_state.cursor_pos = final_pos;
+                    self.ui_state.ideal_cursor_column = final_pos;
+                }
+            }
+        } else {
+            // Normal big_word end movement within current field
+            let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+            let final_pos = if is_edit_mode {
+                new_pos.min(char_len)
+            } else {
+                new_pos.min(char_len.saturating_sub(1))
+            };
+
+            self.ui_state.cursor_pos = final_pos;
+            self.ui_state.ideal_cursor_column = final_pos;
+        }
+    }
+
+    /// Move to end of previous big_word (vim gE) - can cross field boundaries
+    pub fn move_big_word_end_prev(&mut self) {
+        use crate::canvas::actions::movement::word::{
+            find_prev_big_word_end, find_big_word_end,
+        };
+
+        let current_text = self.current_text();
+
+        if current_text.is_empty() {
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok()
+                && self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        // Find first big_word end in new field
+                        let last_big_word_end = find_big_word_end(new_text, 0);
+                        self.ui_state.cursor_pos = last_big_word_end;
+                        self.ui_state.ideal_cursor_column = last_big_word_end;
+                    }
+                }
+            return;
+        }
+
+        let current_pos = self.ui_state.cursor_pos;
+        let new_pos = find_prev_big_word_end(current_text, current_pos);
+
+        // Only try to cross fields if we didn't move at all (stayed at same position)
+        if new_pos == current_pos {
+            let current_field = self.ui_state.current_field;
+            if self.move_up().is_ok()
+                && self.ui_state.current_field != current_field {
+                    let new_text = self.current_text();
+                    if !new_text.is_empty() {
+                        let last_big_word_end = find_big_word_end(new_text, 0);
+                        self.ui_state.cursor_pos = last_big_word_end;
+                        self.ui_state.ideal_cursor_column = last_big_word_end;
+                    }
+                }
+        } else {
+            // Normal big_word movement within current field
+            let is_edit_mode = self.ui_state.current_mode == AppMode::Edit;
+            let char_len = current_text.chars().count();
+            let final_pos = if is_edit_mode {
+                new_pos.min(char_len)
+            } else {
+                new_pos.min(char_len.saturating_sub(1))
+            };
+            self.ui_state.cursor_pos = final_pos;
+            self.ui_state.ideal_cursor_column = final_pos;
+        }
+    }
+}
--- a/canvas/src/editor/navigation.rs
+++ b/canvas/src/editor/navigation.rs
@@ -0,0 +1,177 @@
+// src/editor/navigation.rs
+
+use crate::canvas::modes::AppMode;
+use crate::editor::FormEditor;
+use crate::DataProvider;
+
+impl<D: DataProvider> FormEditor<D> {
+    /// Centralized field transition logic (unchanged).
+    pub fn transition_to_field(&mut self, new_field: usize) -> anyhow::Result<()> {
+        let field_count = self.data_provider.field_count();
+        if field_count == 0 {
+            return Ok(());
+        }
+
+        let prev_field = self.ui_state.current_field;
+
+        #[cfg(feature = "computed")]
+        let mut target_field = new_field.min(field_count - 1);
+        #[cfg(not(feature = "computed"))]
+        let target_field = new_field.min(field_count - 1);
+
+        #[cfg(feature = "computed")]
+        {
+            if let Some(computed_state) = &self.ui_state.computed {
+                if computed_state.is_computed_field(target_field) {
+                    if target_field >= prev_field {
+                        for i in (target_field + 1)..field_count {
+                            if !computed_state.is_computed_field(i) {
+                                target_field = i;
+                                break;
+                            }
+                        }
+                    } else {
+                        let mut i = target_field;
+                        loop {
+                            if !computed_state.is_computed_field(i) {
+                                target_field = i;
+                                break;
+                            }
+                            if i == 0 {
+                                break;
+                            }
+                            i -= 1;
+                        }
+                    }
+                }
+            }
+        }
+
+        if target_field == prev_field {
+            return Ok(());
+        }
+
+        #[cfg(feature = "validation")]
+        self.ui_state.validation.clear_last_switch_block();
+
+        #[cfg(feature = "validation")]
+        {
+            let current_text = self.current_text();
+            if !self
+                .ui_state
+                .validation
+                .allows_field_switch(prev_field, current_text)
+            {
+                if let Some(reason) = self
+                    .ui_state
+                    .validation
+                    .field_switch_block_reason(prev_field, current_text)
+                {
+                    self.ui_state
+                        .validation
+                        .set_last_switch_block(reason.clone());
+                    tracing::debug!("Field switch blocked: {}", reason);
+                    return Err(anyhow::anyhow!(
+                        "Cannot switch fields: {}",
+                        reason
+                    ));
+                }
+            }
+        }
+
+        #[cfg(feature = "validation")]
+        {
+            let text =
+                self.data_provider.field_value(prev_field).to_string();
+            let _ = self
+                .ui_state
+                .validation
+                .validate_field_content(prev_field, &text);
+
+            if let Some(cfg) =
+                self.ui_state.validation.get_field_config(prev_field)
+            {
+                if cfg.external_validation_enabled && !text.is_empty() {
+                    self.set_external_validation(
+                        prev_field,
+                        crate::validation::ExternalValidationState::Validating,
+                    );
+
+                    if let Some(cb) =
+                        self.external_validation_callback.as_mut()
+                    {
+                        let final_state = cb(prev_field, &text);
+                        self.set_external_validation(prev_field, final_state);
+                    }
+                }
+            }
+        }
+
+        #[cfg(feature = "computed")]
+        {
+            // Placeholder for recompute hook if needed later
+        }
+
+        self.ui_state.move_to_field(target_field, field_count);
+
+        let current_text = self.current_text();
+        let max_pos = current_text.chars().count();
+        self.ui_state.set_cursor(
+            self.ui_state.ideal_cursor_column,
+            max_pos,
+            self.ui_state.current_mode == AppMode::Edit,
+        );
+
+        // Automatically close suggestions on field switch
+        #[cfg(feature = "suggestions")]
+        {
+            self.close_suggestions();
+        }
+
+        Ok(())
+    }
+
+    /// Move to first line (vim gg)
+    pub fn move_first_line(&mut self) -> anyhow::Result<()> {
+        self.transition_to_field(0)
+    }
+
+    /// Move to last line (vim G)
+    pub fn move_last_line(&mut self) -> anyhow::Result<()> {
+        let last_field =
+            self.data_provider.field_count().saturating_sub(1);
+        self.transition_to_field(last_field)
+    }
+
+    /// Move to previous field (vim k / up)
+    pub fn move_up(&mut self) -> anyhow::Result<()> {
+        let new_field = self.ui_state.current_field.saturating_sub(1);
+        self.transition_to_field(new_field)
+    }
+
+    /// Move to next field (vim j / down)
+    pub fn move_down(&mut self) -> anyhow::Result<()> {
+        let new_field = (self.ui_state.current_field + 1)
+            .min(self.data_provider.field_count().saturating_sub(1));
+        self.transition_to_field(new_field)
+    }
+
+    /// Move to next field cyclic
+    pub fn move_to_next_field(&mut self) -> anyhow::Result<()> {
+        let field_count = self.data_provider.field_count();
+        if field_count == 0 {
+            return Ok(());
+        }
+        let new_field = (self.ui_state.current_field + 1) % field_count;
+        self.transition_to_field(new_field)
+    }
+
+    /// Aliases
+    pub fn prev_field(&mut self) -> anyhow::Result<()> {
+        self.move_up()
+    }
+
+    pub fn next_field(&mut self) -> anyhow::Result<()> {
+        self.move_down()
+    }
+}
--- a/canvas/src/editor/suggestions.rs
+++ b/canvas/src/editor/suggestions.rs
@@ -0,0 +1,181 @@
+// src/editor/suggestions.rs
+
+use crate::editor::FormEditor;
+use crate::{DataProvider, SuggestionItem};
+
+impl<D: DataProvider> FormEditor<D> {
+    /// Compute inline completion for current selection and text
+    fn compute_current_completion(&self) -> Option<String> {
+        let typed = self.current_text();
+        let idx = self.ui_state.suggestions.selected_index?;
+        let sugg = self.suggestions.get(idx)?;
+        if let Some(rest) = sugg.value_to_store.strip_prefix(typed) {
+            if !rest.is_empty() {
+                return Some(rest.to_string());
+            }
+        }
+        None
+    }
+
+    /// Update UI state's completion text from current selection
+    pub fn update_inline_completion(&mut self) {
+        self.ui_state.suggestions.completion_text =
+            self.compute_current_completion();
+    }
+
+    /// Open the suggestions UI for `field_index`
+    pub fn open_suggestions(&mut self, field_index: usize) {
+        self.ui_state.open_suggestions(field_index);
+    }
+
+    /// Close suggestions UI and clear current suggestion results
+    pub fn close_suggestions(&mut self) {
+        self.ui_state.close_suggestions();
+        self.suggestions.clear();
+    }
+
+    /// Handle Escape key in ReadOnly mode (closes suggestions if active)
+    pub fn handle_escape_readonly(&mut self) {
+        if self.ui_state.suggestions.is_active {
+            self.close_suggestions();
+        }
+    }
+
+    // ----------------- Non-blocking suggestions API --------------------
+
+    #[cfg(feature = "suggestions")]
+    pub fn start_suggestions(&mut self, field_index: usize) -> Option<String> {
+        if !self.data_provider.supports_suggestions(field_index) {
+            return None;
+        }
+
+        let query = self.current_text().to_string();
+        self.ui_state.open_suggestions(field_index);
+        self.ui_state.suggestions.is_loading = true;
+        self.ui_state.suggestions.active_query = Some(query.clone());
+        self.suggestions.clear();
+        Some(query)
+    }
+
+    #[cfg(not(feature = "suggestions"))]
+    pub fn start_suggestions(&mut self, _field_index: usize) -> Option<String> {
+        None
+    }
+
+    #[cfg(feature = "suggestions")]
+    pub fn apply_suggestions_result(
+        &mut self,
+        field_index: usize,
+        query: &str,
+        results: Vec<SuggestionItem>,
+    ) -> bool {
+        if self.ui_state.suggestions.active_field != Some(field_index) {
+            return false;
+        }
+        if self.ui_state.suggestions.active_query.as_deref() != Some(query) {
+            return false;
+        }
+
+        self.ui_state.suggestions.is_loading = false;
+        self.suggestions = results;
+
+        if !self.suggestions.is_empty() {
+            self.ui_state.suggestions.selected_index = Some(0);
+            self.update_inline_completion();
+        } else {
+            self.ui_state.suggestions.selected_index = None;
+            self.ui_state.suggestions.completion_text = None;
+        }
+        true
+    }
+
+    #[cfg(not(feature = "suggestions"))]
+    pub fn apply_suggestions_result(
+        &mut self,
+        _field_index: usize,
+        _query: &str,
+        _results: Vec<SuggestionItem>,
+    ) -> bool {
+        false
+    }
+
+    #[cfg(feature = "suggestions")]
+    pub fn pending_suggestions_query(&self) -> Option<(usize, String)> {
+        if self.ui_state.suggestions.is_loading {
+            if let (Some(field), Some(query)) = (
+                self.ui_state.suggestions.active_field,
+                &self.ui_state.suggestions.active_query,
+            ) {
+                return Some((field, query.clone()));
+            }
+        }
+        None
+    }
+
+    #[cfg(not(feature = "suggestions"))]
+    pub fn pending_suggestions_query(&self) -> Option<(usize, String)> {
+        None
+    }
+
+    pub fn cancel_suggestions(&mut self) {
+        self.close_suggestions();
+    }
+
+    pub fn suggestions_next(&mut self) {
+        if !self.ui_state.suggestions.is_active || self.suggestions.is_empty()
+        {
+            return;
+        }
+
+        let current = self.ui_state.suggestions.selected_index.unwrap_or(0);
+        let next = (current + 1) % self.suggestions.len();
+        self.ui_state.suggestions.selected_index = Some(next);
+        self.update_inline_completion();
+    }
+
+    pub fn suggestions_prev(&mut self) {
+        if !self.ui_state.suggestions.is_active || self.suggestions.is_empty() {
+            return;
+        }
+
+        let current = self.ui_state.suggestions.selected_index.unwrap_or(0);
+        let prev = if current == 0 {
+            self.suggestions.len() - 1
+        } else {
+            current - 1
+        };
+        self.ui_state.suggestions.selected_index = Some(prev);
+        self.update_inline_completion();
+    }
+
+    pub fn apply_suggestion(&mut self) -> Option<String> {
+        if let Some(selected_index) = self.ui_state.suggestions.selected_index {
+            if let Some(suggestion) = self.suggestions.get(selected_index).cloned()
+            {
+                let field_index = self.ui_state.current_field;
+
+                self.data_provider.set_field_value(
+                    field_index,
+                    suggestion.value_to_store.clone(),
+                );
+
+                self.ui_state.cursor_pos = suggestion.value_to_store.len();
+                self.ui_state.ideal_cursor_column = self.ui_state.cursor_pos;
+
+                self.close_suggestions();
+                self.suggestions.clear();
+
+                #[cfg(feature = "validation")]
+                {
+                    let _ = self.ui_state.validation.validate_field_content(
+                        field_index,
+                        &suggestion.value_to_store,
+                    );
+                }
+
+                return Some(suggestion.display_text);
+            }
+        }
+        None
+    }
+}
--- a/canvas/src/editor/suggestions_stub.rs
+++ b/canvas/src/editor/suggestions_stub.rs
@@ -0,0 +1,23 @@
+// src/editor/suggestions_stub.rs
+// Crate-private no-op methods so internal calls compile when feature is off.
+
+use crate::editor::FormEditor;
+use crate::DataProvider;
+
+impl<D: DataProvider> FormEditor<D> {
+    pub(crate) fn open_suggestions(&mut self, _field_index: usize) {
+        // no-op
+    }
+
+    pub(crate) fn close_suggestions(&mut self) {
+        // no-op
+    }
+
+    pub(crate) fn handle_escape_readonly(&mut self) {
+        // no-op
+    }
+
+    pub(crate) fn cancel_suggestions(&mut self) {
+        // no-op
+    }
+}
--- a/canvas/src/editor/validation_helpers.rs
+++ b/canvas/src/editor/validation_helpers.rs
@@ -0,0 +1,178 @@
+// src/editor/validation_helpers.rs
+
+use crate::editor::FormEditor;
+use crate::DataProvider;
+
+impl<D: DataProvider> FormEditor<D> {
+    #[cfg(feature = "validation")]
+    pub fn set_validation_enabled(&mut self, enabled: bool) {
+        self.ui_state.validation.set_enabled(enabled);
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn is_validation_enabled(&self) -> bool {
+        self.ui_state.validation.is_enabled()
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn set_field_validation(
+        &mut self,
+        field_index: usize,
+        config: crate::validation::ValidationConfig,
+    ) {
+        self.ui_state
+            .validation
+            .set_field_config(field_index, config);
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn remove_field_validation(&mut self, field_index: usize) {
+        self.ui_state.validation.remove_field_config(field_index);
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn validate_current_field(
+        &mut self,
+    ) -> crate::validation::ValidationResult {
+        let field_index = self.ui_state.current_field;
+        let current_text = self.current_text().to_string();
+        self.ui_state
+            .validation
+            .validate_field_content(field_index, &current_text)
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn validate_field(
+        &mut self,
+        field_index: usize,
+    ) -> Option<crate::validation::ValidationResult> {
+        if field_index < self.data_provider.field_count() {
+            let text =
+                self.data_provider.field_value(field_index).to_string();
+            Some(
+                self.ui_state
+                    .validation
+                    .validate_field_content(field_index, &text),
+            )
+        } else {
+            None
+        }
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn clear_validation_results(&mut self) {
+        self.ui_state.validation.clear_all_results();
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn validation_summary(
+        &self,
+    ) -> crate::validation::ValidationSummary {
+        self.ui_state.validation.summary()
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn can_switch_fields(&self) -> bool {
+        let current_text = self.current_text();
+        self.ui_state.validation.allows_field_switch(
+            self.ui_state.current_field,
+            current_text,
+        )
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn field_switch_block_reason(&self) -> Option<String> {
+        let current_text = self.current_text();
+        self.ui_state.validation.field_switch_block_reason(
+            self.ui_state.current_field,
+            current_text,
+        )
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn last_switch_block(&self) -> Option<&str> {
+        self.ui_state.validation.last_switch_block()
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn current_limits_status_text(&self) -> Option<String> {
+        let idx = self.ui_state.current_field;
+        if let Some(cfg) = self.ui_state.validation.get_field_config(idx) {
+            if let Some(limits) = &cfg.character_limits {
+                return limits.status_text(self.current_text());
+            }
+        }
+        None
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn current_formatter_warning(&self) -> Option<String> {
+        let idx = self.ui_state.current_field;
+        if let Some(cfg) = self.ui_state.validation.get_field_config(idx) {
+            if let Some((_fmt, _mapper, warn)) =
+                cfg.run_custom_formatter(self.current_text())
+            {
+                return warn;
+            }
+        }
+        None
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn external_validation_of(
+        &self,
+        field_index: usize,
+    ) -> crate::validation::ExternalValidationState {
+        self.ui_state
+            .validation
+            .get_external_validation(field_index)
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn clear_all_external_validation(&mut self) {
+        self.ui_state.validation.clear_all_external_validation();
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn clear_external_validation(&mut self, field_index: usize) {
+        self.ui_state
+            .validation
+            .clear_external_validation(field_index);
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn set_external_validation(
+        &mut self,
+        field_index: usize,
+        state: crate::validation::ExternalValidationState,
+    ) {
+        self.ui_state
+            .validation
+            .set_external_validation(field_index, state);
+    }
+
+    #[cfg(feature = "validation")]
+    pub fn set_external_validation_callback<F>(&mut self, callback: F)
+    where
+        F: FnMut(usize, &str) -> crate::validation::ExternalValidationState
+            + Send
+            + Sync
+            + 'static,
+    {
+        self.external_validation_callback = Some(Box::new(callback));
+    }
+
+    #[cfg(feature = "validation")]
+    pub(crate) fn initialize_validation(&mut self) {
+        let field_count = self.data_provider.field_count();
+        for field_index in 0..field_count {
+            if let Some(config) =
+                self.data_provider.validation_config(field_index)
+            {
+                self.ui_state
+                    .validation
+                    .set_field_config(field_index, config);
+            }
+        }
+    }
+}
--- a/canvas/src/keymap/mod.rs
+++ b/canvas/src/keymap/mod.rs
@@ -0,0 +1,344 @@
+// src/keymap/mod.rs
+use std::collections::HashMap;
+use std::time::{Duration, Instant};
+
+use crossterm::event::{KeyCode, KeyModifiers};
+
+use crate::canvas::modes::AppMode;
+
+#[derive(Clone, Debug, PartialEq, Eq, Hash)]
+pub struct KeyStroke {
+    pub code: KeyCode,
+    pub modifiers: KeyModifiers,
+}
+
+#[derive(Clone, Debug)]
+struct Binding {
+    action: String,
+    sequence: Vec<KeyStroke>,
+}
+
+#[derive(Clone, Debug, Default)]
+pub struct CanvasKeyMap {
+    ro: Vec<Binding>,
+    edit: Vec<Binding>,
+    hl: Vec<Binding>,
+}
+
+// FIXED: Removed Copy because Option<String> is not Copy
+#[derive(Debug, Clone, PartialEq, Eq)]
+pub enum KeyEventOutcome {
+    Consumed(Option<String>),
+    Pending,
+    NotMatched,
+}
+
+#[derive(Debug, Clone)]
+pub struct KeySequenceTracker {
+    sequence: Vec<KeyStroke>,
+    last_key_time: Instant,
+    timeout: Duration,
+}
+
+impl KeySequenceTracker {
+    pub fn new(timeout_ms: u64) -> Self {
+        Self {
+            sequence: Vec::new(),
+            last_key_time: Instant::now(),
+            timeout: Duration::from_millis(timeout_ms),
+        }
+    }
+
+    pub fn reset(&mut self) {
+        self.sequence.clear();
+        self.last_key_time = Instant::now();
+    }
+
+    pub fn add_key(&mut self, stroke: KeyStroke) {
+        let now = Instant::now();
+        if now.duration_since(self.last_key_time) > self.timeout {
+            self.reset();
+        }
+        self.sequence.push(normalize_stroke(stroke));
+        self.last_key_time = now;
+    }
+
+    pub fn sequence(&self) -> &[KeyStroke] {
+        &self.sequence
+    }
+}
+
+fn normalize_stroke(mut s: KeyStroke) -> KeyStroke {
+    // Normalize Shift+Tab to BackTab
+    let is_shift_tab =
+        s.code == KeyCode::Tab && s.modifiers.contains(KeyModifiers::SHIFT);
+    if is_shift_tab {
+        s.code = KeyCode::BackTab;
+        s.modifiers.remove(KeyModifiers::SHIFT);
+        return s;
+    }
+
+    // Normalize Shift+char to uppercase char without SHIFT when possible
+    if let KeyCode::Char(c) = s.code {
+        if s.modifiers.contains(KeyModifiers::SHIFT) {
+            let mut up = c;
+            // Only letters transform meaningfully
+            if c.is_ascii_alphabetic() {
+                up = c.to_ascii_uppercase();
+            }
+            s.code = KeyCode::Char(up);
+            s.modifiers.remove(KeyModifiers::SHIFT);
+            return s;
+        }
+    }
+    s
+}
+
+impl CanvasKeyMap {
+    pub fn from_mode_maps(
+        read_only: &HashMap<String, Vec<String>>,
+        edit: &HashMap<String, Vec<String>>,
+        highlight: &HashMap<String, Vec<String>>,
+    ) -> Self {
+        let mut km = Self::default();
+        km.ro = collect_bindings(read_only);
+        km.edit = collect_bindings(edit);
+        km.hl = collect_bindings(highlight);
+        km
+    }
+
+    pub fn lookup(
+        &self,
+        mode: AppMode,
+        seq: &[KeyStroke],
+    ) -> (Option<&str>, bool) {
+        let bindings = match mode {
+            AppMode::ReadOnly => &self.ro,
+            AppMode::Edit => &self.edit,
+            AppMode::Highlight => &self.hl,
+            _ => return (None, false),
+        };
+
+        if seq.is_empty() {
+            return (None, false);
+        }
+
+        // Exact match
+        for b in bindings {
+            if sequences_equal(&b.sequence, seq) {
+                return (Some(b.action.as_str()), false);
+            }
+        }
+
+        // Prefix match
+        for b in bindings {
+            if is_prefix(&b.sequence, seq) {
+                return (None, true);
+            }
+        }
+
+        (None, false)
+    }
+}
+
+fn sequences_equal(a: &[KeyStroke], b: &[KeyStroke]) -> bool {
+    if a.len() != b.len() {
+        return false;
+    }
+    a.iter().zip(b.iter()).all(|(x, y)| strokes_equal(x, y))
+}
+
+fn strokes_equal(a: &KeyStroke, b: &KeyStroke) -> bool {
+    // Both KeyStroke are already normalized
+    a.code == b.code && a.modifiers == b.modifiers
+}
+
+fn is_prefix(binding: &[KeyStroke], seq: &[KeyStroke]) -> bool {
+    if seq.len() >= binding.len() {
+        return false;
+    }
+    binding
+        .iter()
+        .zip(seq.iter())
+        .all(|(b, s)| strokes_equal(b, s))
+}
+
+fn collect_bindings(
+    mode_map: &HashMap<String, Vec<String>>,
+) -> Vec<Binding> {
+    let mut out = Vec::new();
+    for (action, list) in mode_map {
+        for binding_str in list {
+            if let Some(seq) = parse_binding_to_sequence(binding_str) {
+                out.push(Binding {
+                    action: action.to_string(),
+                    sequence: seq,
+                });
+            }
+        }
+    }
+    out
+}
+
+fn parse_binding_to_sequence(input: &str) -> Option<Vec<KeyStroke>> {
+    let s = input.trim();
+    if s.is_empty() {
+        return None;
+    }
+
+    let has_space = s.contains(' ');
+    let has_plus = s.contains('+');
+
+    if has_space {
+        let mut seq = Vec::new();
+        for part in s.split_whitespace() {
+            if let Some(mut strokes) = parse_part_to_sequence(part) {
+                seq.append(&mut strokes);
+            } else {
+                return None;
+            }
+        }
+        return Some(seq);
+    }
+
+    if has_plus {
+        if contains_modifier_token(s) {
+            if let Some(k) = parse_chord_with_modifiers(s) {
+                return Some(vec![k]);
+            }
+            return None;
+        } else {
+            let mut seq = Vec::new();
+            for t in s.split('+') {
+                if let Some(mut strokes) = parse_part_to_sequence(t) {
+                    seq.append(&mut strokes);
+                } else {
+                    return None;
+                }
+            }
+            return Some(seq);
+        }
+    }
+
+    if is_compound_key(s) {
+        if let Some(k) = parse_simple_key(s) {
+            return Some(vec![k]);
+        }
+        return None;
+    }
+
+    if s.len() > 1 {
+        let mut seq = Vec::new();
+        for ch in s.chars() {
+            seq.push(KeyStroke {
+                code: KeyCode::Char(ch),
+                modifiers: KeyModifiers::empty(),
+            });
+        }
+        return Some(seq);
+    }
+
+    if let Some(k) = parse_simple_key(s) {
+        return Some(vec![k]);
+    }
+    None
+}
+
+fn parse_part_to_sequence(part: &str) -> Option<Vec<KeyStroke>> {
+    let p = part.trim();
+    if p.is_empty() {
+        return None;
+    }
+
+    if p.contains('+') && contains_modifier_token(p) {
+        if let Some(k) = parse_chord_with_modifiers(p) {
+            return Some(vec![k]);
+        }
+        return None;
+    }
+
+    if is_compound_key(p) {
+        if let Some(k) = parse_simple_key(p) {
+            return Some(vec![k]);
+        }
+        return None;
+    }
+
+    if p.len() > 1 {
+        let mut seq = Vec::new();
+        for ch in p.chars() {
+            seq.push(KeyStroke {
+                code: KeyCode::Char(ch),
+                modifiers: KeyModifiers::empty(),
+            });
+        }
+        return Some(seq);
+    }
+
+    parse_simple_key(p).map(|k| vec![k])
+}
+
+fn contains_modifier_token(s: &str) -> bool {
+    let low = s.to_lowercase();
+    low.contains("ctrl") || low.contains("shift") || low.contains("alt") || 
+    low.contains("super") || low.contains("cmd") || low.contains("meta")
+}
+
+fn parse_chord_with_modifiers(s: &str) -> Option<KeyStroke> {
+    let mut mods = KeyModifiers::empty();
+    let mut key: Option<KeyCode> = None;
+
+    for comp in s.split('+') {
+        match comp.to_lowercase().as_str() {
+            "ctrl" => mods |= KeyModifiers::CONTROL,
+            "shift" => mods |= KeyModifiers::SHIFT,
+            "alt" => mods |= KeyModifiers::ALT,
+            "super" | "cmd" => mods |= KeyModifiers::SUPER,
+            "meta" => mods |= KeyModifiers::META,
+            other => {
+                key = string_to_keycode(other);
+            }
+        }
+    }
+
+    key.map(|k| normalize_stroke(KeyStroke { code: k, modifiers: mods }))
+}
+
+fn is_compound_key(s: &str) -> bool {
+    matches!(s.to_lowercase().as_str(),
+        "left" | "right" | "up" | "down" | "esc" | "enter" | "backspace" | 
+        "delete" | "tab" | "home" | "end" | "$" | "0"
+    )
+}
+
+fn parse_simple_key(s: &str) -> Option<KeyStroke> {
+    if let Some(kc) = string_to_keycode(&s.to_lowercase()) {
+        return Some(KeyStroke { code: kc, modifiers: KeyModifiers::empty() });
+    }
+
+    if s.chars().count() == 1 {
+        let ch = s.chars().next().unwrap();
+        return Some(KeyStroke { code: KeyCode::Char(ch), modifiers: KeyModifiers::empty() });
+    }
+
+    None
+}
+
+fn string_to_keycode(s: &str) -> Option<KeyCode> {
+    Some(match s {
+        "left" => KeyCode::Left,
+        "right" => KeyCode::Right, 
+        "up" => KeyCode::Up,
+        "down" => KeyCode::Down,
+        "esc" => KeyCode::Esc,
+        "enter" => KeyCode::Enter,
+        "backspace" => KeyCode::Backspace,
+        "delete" => KeyCode::Delete,
+        "tab" => KeyCode::Tab,
+        "home" => KeyCode::Home,
+        "end" => KeyCode::End,
+        "$" => KeyCode::Char('$'),
+        "0" => KeyCode::Char('0'),
+        _ => return None,
+    })
+}
--- a/canvas/src/lib.rs
+++ b/canvas/src/lib.rs
@@ -4,18 +4,21 @@ pub mod canvas;
 pub mod editor;
 pub mod data_provider;

-// Only include suggestions module if feature is enabled
 #[cfg(feature = "suggestions")]
 pub mod suggestions;

-// Only include validation module if feature is enabled
 #[cfg(feature = "validation")]
 pub mod validation;

-// Only include computed module if feature is enabled
+#[cfg(feature = "textarea")]
+pub mod textarea;
+
 #[cfg(feature = "computed")]
 pub mod computed;

+#[cfg(feature = "keymap")]
+pub mod keymap;
+
 #[cfg(feature = "cursor-style")]
 pub use canvas::CursorManager;

@@ -25,7 +28,9 @@ pub use canvas::CursorManager;

 // Main API exports
 pub use editor::FormEditor;
-pub use data_provider::{DataProvider, SuggestionsProvider, SuggestionItem};
+pub use data_provider::DataProvider;
+#[cfg(feature = "suggestions")]
+pub use data_provider::{SuggestionsProvider, SuggestionItem};

 // UI state (read-only access for users)
 pub use canvas::state::EditorState;
@@ -54,10 +59,19 @@ pub use computed::{ComputedProvider, ComputedContext, ComputedState};
 pub use canvas::theme::{CanvasTheme, DefaultCanvasTheme};

 #[cfg(feature = "gui")]
-pub use canvas::gui::render_canvas;
+pub use canvas::gui::{render_canvas, render_canvas_default};

 #[cfg(feature = "gui")]
-pub use canvas::gui::render_canvas_default;
+pub use canvas::gui::render_canvas_with_options;
+
+#[cfg(feature = "gui")]
+pub use canvas::gui::{CanvasDisplayOptions, OverflowMode};

 #[cfg(all(feature = "gui", feature = "suggestions"))]
 pub use suggestions::gui::render_suggestions_dropdown;
+
+#[cfg(feature = "keymap")]
+pub use keymap::{CanvasKeyMap, KeyEventOutcome};
+
+#[cfg(feature = "textarea")]
+pub use textarea::{TextArea, TextAreaProvider, TextAreaState, TextAreaEditor};
--- a/canvas/src/suggestions/gui.rs
+++ b/canvas/src/suggestions/gui.rs
@@ -149,9 +149,6 @@ fn calculate_dropdown_position(
    if dropdown_area.right() > frame_area.width {
        dropdown_area.x = frame_area.width.saturating_sub(dropdown_width);
    }
-    dropdown_area.x = dropdown_area.x.max(0);
-    dropdown_area.y = dropdown_area.y.max(0);
-
    dropdown_area
 }

--- a/canvas/src/suggestions/mod.rs
+++ b/canvas/src/suggestions/mod.rs
@@ -1,4 +1,8 @@
 // src/suggestions/mod.rs
+//! Suggestions subsystem - provider and optional GUI.
+//!
+//! Contains the suggestion provider types used by the editor and, when the GUI
+//! feature is enabled, the rendering helpers for the suggestions dropdown.

 pub mod state;
 #[cfg(feature = "gui")]
--- a/canvas/src/textarea/highlight/chunks.rs
+++ b/canvas/src/textarea/highlight/chunks.rs
@@ -0,0 +1,183 @@
+// src/textarea/highlight/chunks.rs
+use ratatui::text::{Line, Span};
+use ratatui::style::Style;
+use unicode_width::UnicodeWidthChar;
+
+#[derive(Debug, Clone)]
+pub struct StyledChunk {
+    pub text: String,
+    pub style: Style,
+}
+
+pub fn display_width_chunks(chunks: &[StyledChunk]) -> u16 {
+    chunks
+        .iter()
+        .map(|c| {
+            c.text
+                .chars()
+                .map(|ch| UnicodeWidthChar::width(ch).unwrap_or(0) as u16)
+                .sum::<u16>()
+        })
+        .sum()
+}
+
+pub fn slice_chunks_by_display_cols(
+    chunks: &[StyledChunk],
+    start_cols: u16,
+    max_cols: u16,
+) -> Vec<StyledChunk> {
+    if max_cols == 0 {
+        return Vec::new();
+    }
+
+    let mut skipped: u16 = 0;
+    let mut taken: u16 = 0;
+    let mut out: Vec<StyledChunk> = Vec::new();
+
+    for ch in chunks {
+        if taken >= max_cols {
+            break;
+        }
+
+        let mut acc = String::new();
+
+        for c in ch.text.chars() {
+            let w = UnicodeWidthChar::width(c).unwrap_or(0) as u16;
+            if skipped + w <= start_cols {
+                skipped += w;
+                continue;
+            }
+            if taken + w > max_cols {
+                break;
+            }
+            acc.push(c);
+            taken = taken.saturating_add(w);
+            if taken >= max_cols {
+                break;
+            }
+        }
+
+        if !acc.is_empty() {
+            out.push(StyledChunk {
+                text: acc,
+                style: ch.style,
+            });
+        }
+    }
+
+    out
+}
+
+pub fn clip_chunks_window_with_indicator_padded(
+    chunks: &[StyledChunk],
+    view_width: u16,
+    indicator: char,
+    start_cols: u16,
+) -> Line<'static> {
+    if view_width == 0 {
+        return Line::from("");
+    }
+
+    let total = display_width_chunks(chunks);
+    let show_left = start_cols > 0;
+    let left_cols: u16 = if show_left { 1 } else { 0 };
+
+    let cap_with_right = view_width.saturating_sub(left_cols + 1);
+    let remaining = total.saturating_sub(start_cols);
+    let show_right = remaining > cap_with_right;
+
+    let max_visible = if show_right {
+        cap_with_right
+    } else {
+        view_width.saturating_sub(left_cols)
+    };
+
+    let visible = slice_chunks_by_display_cols(chunks, start_cols, max_visible);
+    let used_cols = left_cols + display_width_chunks(&visible);
+
+    let mut spans: Vec<Span> = Vec::new();
+    if show_left {
+        spans.push(Span::raw(indicator.to_string()));
+    }
+    for v in visible {
+        spans.push(Span::styled(v.text, v.style));
+    }
+    if show_right {
+        let right_pos = view_width.saturating_sub(1);
+        let filler = right_pos.saturating_sub(used_cols);
+        if filler > 0 {
+            spans.push(Span::raw(" ".repeat(filler as usize)));
+        }
+        spans.push(Span::raw(indicator.to_string()));
+    }
+
+    Line::from(spans)
+}
+
+pub fn wrap_chunks_indented(
+    chunks: &[StyledChunk],
+    width: u16,
+    indent: u16,
+) -> Vec<Line<'static>> {
+    if width == 0 {
+        return vec![Line::from("")];
+    }
+    let indent = indent.min(width.saturating_sub(1));
+    let cont_cap = width.saturating_sub(indent);
+    let indent_str = " ".repeat(indent as usize);
+
+    let mut lines: Vec<Line> = Vec::new();
+    let mut current_spans: Vec<Span> = Vec::new();
+    let mut used: u16 = 0;
+    let mut first_line = true;
+
+    // Fixed: Restructure to avoid borrow checker issues
+    for chunk in chunks {
+        let mut buf = String::new();
+        let mut buf_style = chunk.style;
+
+        for ch in chunk.text.chars() {
+            let w = UnicodeWidthChar::width(ch).unwrap_or(0) as u16;
+            let cap = if first_line { width } else { cont_cap };
+
+            if used > 0 && used.saturating_add(w) >= cap {
+                if !buf.is_empty() {
+                    current_spans.push(Span::styled(buf.clone(), buf_style));
+                    buf.clear();
+                }
+                lines.push(Line::from(current_spans));
+                current_spans = Vec::new();
+                first_line = false;
+                used = 0;
+                
+                // Add indent directly instead of using closure
+                if !first_line && indent > 0 {
+                    current_spans.push(Span::raw(indent_str.clone()));
+                    used = indent;
+                }
+            }
+
+            if !buf.is_empty() && buf_style != chunk.style {
+                current_spans.push(Span::styled(buf.clone(), buf_style));
+                buf.clear();
+            }
+            buf_style = chunk.style;
+            
+            // Add indent if needed
+            if used == 0 && !first_line && indent > 0 {
+                current_spans.push(Span::raw(indent_str.clone()));
+                used = indent;
+            }
+            
+            buf.push(ch);
+            used = used.saturating_add(w);
+        }
+
+        if !buf.is_empty() {
+            current_spans.push(Span::styled(buf, buf_style));
+        }
+    }
+
+    lines.push(Line::from(current_spans));
+    lines
+}
--- a/canvas/src/textarea/highlight/engine.rs
+++ b/canvas/src/textarea/highlight/engine.rs
@@ -0,0 +1,294 @@
+// src/textarea/highlight/engine.rs
+#![allow(dead_code)]
+
+use std::collections::hash_map::DefaultHasher;
+use std::hash::{Hash, Hasher};
+
+use ratatui::style::{Modifier, Style};
+use syntect::{
+    highlighting::{
+        HighlightIterator, HighlightState, Highlighter, Style as SynStyle, Theme, ThemeSet,
+    },
+    parsing::{ParseState, ScopeStack, SyntaxReference, SyntaxSet},
+};
+
+use crate::data_provider::DataProvider;
+use super::chunks::StyledChunk;
+
+#[derive(Debug)]
+pub struct SyntectEngine {
+    ps: SyntaxSet,
+    ts: ThemeSet,
+    theme_name: String,
+    syntax_name: Option<String>,
+    // Cached parser state (after line i)
+    parse_after: Vec<ParseState>,
+    // Cached scope stack (after line i)
+    stack_after: Vec<ScopeStack>,
+    // Hash of line contents to detect edits
+    line_hashes: Vec<u64>,
+}
+
+impl Default for SyntectEngine {
+    fn default() -> Self {
+        Self::new()
+    }
+}
+
+impl SyntectEngine {
+    pub fn new() -> Self {
+        let ps = SyntaxSet::load_defaults_newlines();
+        let ts = ThemeSet::load_defaults();
+        Self {
+            ps,
+            ts,
+            theme_name: "InspiredGitHub".to_string(),
+            syntax_name: None,
+            parse_after: Vec::new(),
+            stack_after: Vec::new(),
+            line_hashes: Vec::new(),
+        }
+    }
+
+    pub fn clear(&mut self) {
+        self.parse_after.clear();
+        self.stack_after.clear();
+        self.line_hashes.clear();
+    }
+
+    pub fn set_theme(&mut self, theme_name: &str) -> bool {
+        if self.ts.themes.contains_key(theme_name) {
+            self.theme_name = theme_name.to_string();
+            true
+        } else {
+            false
+        }
+    }
+
+    pub fn set_syntax_by_name(&mut self, name: &str) -> bool {
+        if self.ps.find_syntax_by_name(name).is_some() {
+            self.syntax_name = Some(name.to_string());
+            self.clear();
+            true
+        } else {
+            false
+        }
+    }
+
+    pub fn set_syntax_by_extension(&mut self, ext: &str) -> bool {
+        if let Some(s) = self.ps.find_syntax_by_extension(ext) {
+            self.syntax_name = Some(s.name.clone());
+            self.clear();
+            true
+        } else {
+            false
+        }
+    }
+
+    pub fn invalidate_from(&mut self, line_idx: usize) {
+        if line_idx < self.parse_after.len() {
+            self.parse_after.truncate(line_idx);
+        }
+        if line_idx < self.stack_after.len() {
+            self.stack_after.truncate(line_idx);
+        }
+        if line_idx < self.line_hashes.len() {
+            self.line_hashes.truncate(line_idx);
+        }
+    }
+
+    pub fn on_insert_line(&mut self, at: usize) {
+        self.invalidate_from(at);
+    }
+
+    pub fn on_delete_line(&mut self, at: usize) {
+        self.invalidate_from(at);
+    }
+
+    fn theme(&self) -> &Theme {
+        self.ts
+            .themes
+            .get(&self.theme_name)
+            .expect("theme exists")
+    }
+
+    fn syntax_ref(&self) -> &SyntaxReference {
+        if let Some(name) = &self.syntax_name {
+            if let Some(s) = self.ps.find_syntax_by_name(name) {
+                return s;
+            }
+        }
+        self.ps.find_syntax_plain_text()
+    }
+
+    fn map_syntect_style(s: SynStyle) -> Style {
+        let fg =
+            ratatui::style::Color::Rgb(s.foreground.r, s.foreground.g, s.foreground.b);
+        let mut st = Style::default().fg(fg);
+        use syntect::highlighting::FontStyle;
+        if s.font_style.contains(FontStyle::BOLD) {
+            st = st.add_modifier(Modifier::BOLD);
+        }
+        if s.font_style.contains(FontStyle::UNDERLINE) {
+            st = st.add_modifier(Modifier::UNDERLINED);
+        }
+        if s.font_style.contains(FontStyle::ITALIC) {
+            st = st.add_modifier(Modifier::ITALIC);
+        }
+        st
+    }
+
+    fn hash_line(s: &str) -> u64 {
+        let mut h = DefaultHasher::new();
+        s.hash(&mut h);
+        h.finish()
+    }
+
+    // Verify cached chain up to the nearest trusted predecessor of line_idx,
+    // using the provider to fetch the current lines.
+    fn verify_and_truncate_before(&mut self, line_idx: usize, provider: &dyn DataProvider) {
+        let mut k = std::cmp::min(line_idx, self.parse_after.len());
+        while k > 0 {
+            let j = k - 1;
+            let curr = Self::hash_line(provider.field_value(j));
+            if self.line_hashes.get(j) == Some(&curr) {
+                break;
+            }
+            self.invalidate_from(j);
+            k = j;
+        }
+    }
+
+    // Ensure we have parser + stack for lines [0..line_idx)
+    fn ensure_state_before(&mut self, line_idx: usize, provider: &dyn DataProvider) {
+        if line_idx == 0 || self.parse_after.len() >= line_idx {
+            return;
+        }
+
+        let syntax = self.syntax_ref();
+        let theme = self.theme().clone(); // Clone to avoid borrow conflicts
+        let highlighter = Highlighter::new(&theme);
+
+        let mut ps = if self.parse_after.is_empty() {
+            ParseState::new(syntax)
+        } else {
+            self.parse_after[self.parse_after.len() - 1].clone()
+        };
+        let mut stack = if self.stack_after.is_empty() {
+            ScopeStack::new()
+        } else {
+            self.stack_after[self.stack_after.len() - 1].clone()
+        };
+
+        let start = self.parse_after.len();
+        for i in start..line_idx {
+            let s = provider.field_value(i);
+            
+            // Fix: parse_line takes 2 arguments: line and &SyntaxSet
+            let ops = ps.parse_line(s, &self.ps).unwrap_or_default();
+            
+            // Fix: HighlightState::new requires &Highlighter and ScopeStack
+            let mut highlight_state = HighlightState::new(&highlighter, stack.clone());
+            
+            // Fix: HighlightIterator::new expects &mut HighlightState as first parameter
+            let it = HighlightIterator::new(&mut highlight_state, &ops[..], s, &highlighter);
+            for (_style, _text) in it {
+                // Iterate to apply ops; we don't need the tokens here.
+            }
+            
+            // Update the stack from the highlight state
+            stack = highlight_state.path.clone();
+
+            let h = Self::hash_line(s);
+
+            self.parse_after.push(ps.clone());
+            self.stack_after.push(stack.clone());
+            if i >= self.line_hashes.len() {
+                self.line_hashes.push(h);
+            } else {
+                self.line_hashes[i] = h;
+            }
+        }
+    }
+
+    // Highlight a single line using cached state; update caches for this line.
+    pub fn highlight_line_cached(
+        &mut self,
+        line_idx: usize,
+        line: &str,
+        provider: &dyn DataProvider,
+    ) -> Vec<StyledChunk> {
+        // Auto-detect prior changes and truncate cache if needed
+        self.verify_and_truncate_before(line_idx, provider);
+        // Precompute states up to line_idx
+        self.ensure_state_before(line_idx, provider);
+
+        let syntax = self.syntax_ref();
+        let theme = self.theme().clone(); // Clone to avoid borrow conflicts
+        let highlighter = Highlighter::new(&theme);
+
+        let mut ps = if line_idx == 0 {
+            ParseState::new(syntax)
+        } else if self.parse_after.len() >= line_idx {
+            self.parse_after[line_idx - 1].clone()
+        } else {
+            ParseState::new(syntax)
+        };
+
+        let stack = if line_idx == 0 {
+            ScopeStack::new()
+        } else if self.stack_after.len() >= line_idx {
+            self.stack_after[line_idx - 1].clone()
+        } else {
+            ScopeStack::new()
+        };
+
+        // Fix: parse_line takes 2 arguments: line and &SyntaxSet
+        let ops = ps.parse_line(line, &self.ps).unwrap_or_default();
+        
+        // Fix: HighlightState::new requires &Highlighter and ScopeStack
+        let mut highlight_state = HighlightState::new(&highlighter, stack);
+        
+        // Fix: HighlightIterator::new expects &mut HighlightState as first parameter
+        let iter = HighlightIterator::new(&mut highlight_state, &ops[..], line, &highlighter);
+
+        let mut out: Vec<StyledChunk> = Vec::new();
+        for (syn_style, slice) in iter {
+            if slice.is_empty() {
+                continue;
+            }
+            let text = slice.trim_end_matches('\n').to_string();
+            if text.is_empty() {
+                continue;
+            }
+            out.push(StyledChunk {
+                text,
+                style: Self::map_syntect_style(syn_style),
+            });
+        }
+
+        // Update caches for this line (state after this line)
+        let h = Self::hash_line(line);
+        if line_idx >= self.parse_after.len() {
+            self.parse_after.push(ps);
+        } else {
+            self.parse_after[line_idx] = ps;
+        }
+        
+        // Update stack from highlight state
+        let final_stack = highlight_state.path.clone();
+        if line_idx >= self.stack_after.len() {
+            self.stack_after.push(final_stack);
+        } else {
+            self.stack_after[line_idx] = final_stack;
+        }
+        
+        if line_idx >= self.line_hashes.len() {
+            self.line_hashes.push(h);
+        } else {
+            self.line_hashes[line_idx] = h;
+        }
+
+        out
+    }
+}
--- a/canvas/src/textarea/highlight/mod.rs
+++ b/canvas/src/textarea/highlight/mod.rs
@@ -0,0 +1,18 @@
+// src/textarea/highlight/mod.rs
+#[cfg(all(feature = "syntect", feature = "gui"))]
+pub mod engine;
+#[cfg(all(feature = "syntect", feature = "gui"))]
+pub mod chunks;
+#[cfg(all(feature = "syntect", feature = "gui"))]
+pub mod state;
+#[cfg(all(feature = "syntect", feature = "gui"))]
+pub mod widget;
+
+#[cfg(all(feature = "syntect", feature = "gui"))]
+pub use engine::SyntectEngine;
+#[cfg(all(feature = "syntect", feature = "gui"))]
+pub use chunks::StyledChunk;
+#[cfg(all(feature = "syntect", feature = "gui"))]
+pub use state::TextAreaSyntaxState;
+#[cfg(all(feature = "syntect", feature = "gui"))]
+pub use widget::TextAreaSyntax;
--- a/canvas/src/textarea/highlight/state.rs
+++ b/canvas/src/textarea/highlight/state.rs
@@ -0,0 +1,45 @@
+// src/textarea/highlight/state.rs
+use std::ops::{Deref, DerefMut};
+
+use super::engine::SyntectEngine;
+use crate::textarea::state::TextAreaState;
+
+// Remove Debug derive since TextAreaState doesn't implement Debug
+#[derive(Default)]
+pub struct TextAreaSyntaxState {
+    pub textarea: TextAreaState,
+    pub engine: SyntectEngine,
+}
+
+impl TextAreaSyntaxState {
+    pub fn from_text<S: Into<String>>(text: S) -> Self {
+        let mut s = Self::default();
+        s.textarea.set_text(text);
+        s
+    }
+
+    // Optional: convenience setters
+    pub fn set_syntax_theme(&mut self, theme: &str) -> bool {
+        self.engine.set_theme(theme)
+    }
+    pub fn set_syntax_by_name(&mut self, name: &str) -> bool {
+        self.engine.set_syntax_by_name(name)
+    }
+    pub fn set_syntax_by_extension(&mut self, ext: &str) -> bool {
+        self.engine.set_syntax_by_extension(ext)
+    }
+}
+
+impl Deref for TextAreaSyntaxState {
+    type Target = TextAreaState;
+    fn deref(&self) -> &Self::Target {
+        &self.textarea
+    }
+}
+
+impl DerefMut for TextAreaSyntaxState {
+    fn deref_mut(&mut self) -> &mut Self::Target {
+        &mut self.textarea
+    }
+}
+
--- a/canvas/src/textarea/highlight/widget.rs
+++ b/canvas/src/textarea/highlight/widget.rs
@@ -0,0 +1,211 @@
+// src/textarea/highlight/widget.rs
+use ratatui::{
+    buffer::Buffer,
+    layout::{Alignment, Rect},
+    style::Style,
+    text::{Line, Span},
+    widgets::{Block, BorderType, Borders, Paragraph, StatefulWidget, Widget},
+};
+
+use unicode_width::UnicodeWidthChar;
+
+use super::chunks::{
+    clip_chunks_window_with_indicator_padded,
+    wrap_chunks_indented,
+};
+use super::state::TextAreaSyntaxState;
+
+use crate::data_provider::DataProvider;
+use crate::textarea::state::{
+    compute_h_scroll_with_padding, count_wrapped_rows_indented, TextOverflowMode,
+};
+
+#[derive(Debug, Clone)]
+pub struct TextAreaSyntax<'a> {
+    pub block: Option<Block<'a>>,
+    pub style: Style,
+    pub border_type: BorderType,
+}
+
+impl<'a> Default for TextAreaSyntax<'a> {
+    fn default() -> Self {
+        Self {
+            block: Some(
+                Block::default()
+                    .borders(Borders::ALL)
+                    .border_type(BorderType::Rounded),
+            ),
+            style: Style::default(),
+            border_type: BorderType::Rounded,
+        }
+    }
+}
+
+impl<'a> TextAreaSyntax<'a> {
+    pub fn block(mut self, block: Block<'a>) -> Self {
+        self.block = Some(block);
+        self
+    }
+    pub fn style(mut self, style: Style) -> Self {
+        self.style = style;
+        self
+    }
+    pub fn border_type(mut self, ty: BorderType) -> Self {
+        self.border_type = ty;
+        if let Some(b) = &mut self.block {
+            *b = b.clone().border_type(ty);
+        }
+        self
+    }
+}
+
+fn display_width(s: &str) -> u16 {
+    s.chars()
+        .map(|c| UnicodeWidthChar::width(c).unwrap_or(0) as u16)
+        .sum()
+}
+
+fn display_cols_up_to(s: &str, char_count: usize) -> u16 {
+    let mut cols: u16 = 0;
+    for (i, ch) in s.chars().enumerate() {
+        if i >= char_count {
+            break;
+        }
+        cols = cols.saturating_add(UnicodeWidthChar::width(ch).unwrap_or(0) as u16);
+    }
+    cols
+}
+
+fn resolve_start_line_and_intra_indented(
+    state: &TextAreaSyntaxState,
+    inner: Rect,
+) -> (usize, u16) {
+    let provider = state.textarea.editor.data_provider();
+    let total = provider.line_count();
+
+    if total == 0 {
+        return (0, 0);
+    }
+
+    let wrap = matches!(state.textarea.overflow_mode, TextOverflowMode::Wrap);
+    let width = inner.width;
+    let target_vis = state.textarea.scroll_y;
+
+    if !wrap {
+        let start = (target_vis as usize).min(total);
+        return (start, 0);
+    }
+
+    let indent = state.textarea.wrap_indent_cols;
+
+    let mut acc: u16 = 0;
+    for i in 0..total {
+        let s = provider.field_value(i);
+        let rows = count_wrapped_rows_indented(s, width, indent);
+        if acc.saturating_add(rows) > target_vis {
+            let intra = target_vis.saturating_sub(acc);
+            return (i, intra);
+        }
+        acc = acc.saturating_add(rows);
+    }
+
+    (total.saturating_sub(1), 0)
+}
+
+impl<'a> StatefulWidget for TextAreaSyntax<'a> {
+    type State = TextAreaSyntaxState;
+
+    fn render(self, area: Rect, buf: &mut Buffer, state: &mut Self::State) {
+        // Reuse existing scroll logic
+        state.textarea.ensure_visible(area, self.block.as_ref());
+
+        let inner = if let Some(b) = &self.block {
+            b.clone().render(area, buf);
+            b.inner(area)
+        } else {
+            area
+        };
+
+        let edited_now = state.textarea.take_edited_flag();
+
+        let wrap_mode = matches!(state.textarea.overflow_mode, TextOverflowMode::Wrap);
+        let provider = state.textarea.editor.data_provider();
+        let total = provider.line_count();
+
+        let (start, intra) = resolve_start_line_and_intra_indented(state, inner);
+
+        let mut display_lines: Vec<Line> = Vec::new();
+
+        if total == 0 || start >= total {
+            if let Some(ph) = &state.textarea.placeholder {
+                display_lines.push(Line::from(Span::raw(ph.clone())));
+            }
+        } else if wrap_mode {
+            let mut rows_left = inner.height;
+            let indent = state.textarea.wrap_indent_cols;
+
+            let mut i = start;
+            while i < total && rows_left > 0 {
+                let s = provider.field_value(i);
+
+                let chunks = state
+                    .engine
+                    .highlight_line_cached(i, s, provider);
+
+                let lines = wrap_chunks_indented(&chunks, inner.width, indent);
+                let skip = if i == start { intra as usize } else { 0 };
+                for l in lines.into_iter().skip(skip) {
+                    display_lines.push(l);
+                    rows_left = rows_left.saturating_sub(1);
+                    if rows_left == 0 {
+                        break;
+                    }
+                }
+                i += 1;
+            }
+        } else {
+            let end = (start.saturating_add(inner.height as usize)).min(total);
+
+            for i in start..end {
+                let s = provider.field_value(i);
+
+                let chunks = state.engine.highlight_line_cached(i, s, provider);
+
+                let fits = display_width(s) <= inner.width;
+                let start_cols = if i == state.textarea.current_field() {
+                    let col_idx = state.textarea.display_cursor_position();
+                    let cursor_cols = display_cols_up_to(s, col_idx);
+                    let (target_h, _left_cols) =
+                        compute_h_scroll_with_padding(cursor_cols, inner.width);
+
+                    if fits {
+                        if edited_now {
+                            target_h
+                        } else {
+                            0
+                        }
+                    } else {
+                        target_h.max(state.textarea.h_scroll)
+                    }
+                } else {
+                    0
+                };
+
+                if let TextOverflowMode::Indicator { ch } = state.textarea.overflow_mode {
+                    display_lines.push(clip_chunks_window_with_indicator_padded(
+                        &chunks,
+                        inner.width,
+                        ch,
+                        start_cols,
+                    ));
+                }
+            }
+        }
+
+        let p = Paragraph::new(display_lines)
+            .alignment(Alignment::Left)
+            .style(self.style);
+
+        p.render(inner, buf);
+    }
+}
--- a/canvas/src/textarea/mod.rs
+++ b/canvas/src/textarea/mod.rs
@@ -0,0 +1,17 @@
+// src/textarea/mod.rs
+//! Text area convenience exports.
+
+pub mod provider;
+pub mod state;
+
+#[cfg(feature = "gui")]
+pub mod widget;
+
+#[cfg(all(feature = "syntect", feature = "gui"))]
+pub mod highlight;
+
+pub use provider::TextAreaProvider;
+pub use state::{TextAreaEditor, TextAreaState, TextOverflowMode};
+
+#[cfg(feature = "gui")]
+pub use widget::TextArea;
--- a/canvas/src/textarea/provider.rs
+++ b/canvas/src/textarea/provider.rs
@@ -0,0 +1,250 @@
+// src/textarea/provider.rs
+use crate::DataProvider;
+use once_cell::unsync::OnceCell;
+use ropey::Rope;
+use std::io::{self, BufReader, Read};
+use std::path::Path;
+
+#[derive(Debug)] // Clone removed: OnceCell<String> is not Clone
+pub struct TextAreaProvider {
+    rope: Rope,
+    name: String,
+    // Lazy per-line cache; only lines that are actually used get materialized.
+    // This keeps memory low even for very large files.
+    line_cache: Vec<OnceCell<String>>,
+}
+
+impl Default for TextAreaProvider {
+    fn default() -> Self {
+        let rope = Rope::from_str("");
+        Self {
+            rope,
+            name: "Text".to_string(),
+            line_cache: vec![OnceCell::new()], // at least 1 logical line
+        }
+    }
+}
+
+impl TextAreaProvider {
+    pub fn from_text<S: Into<String>>(text: S) -> Self {
+        let s = text.into();
+        let rope = Rope::from_str(&s);
+        let lines = rope.len_lines().max(1);
+        Self {
+            rope,
+            name: "Text".to_string(),
+            line_cache: vec![(); lines].into_iter().map(|_| OnceCell::new()).collect(),
+        }
+    }
+
+    pub fn to_text(&self) -> String {
+        self.rope.to_string()
+    }
+
+    pub fn from_file<P: AsRef<Path>>(path: P) -> io::Result<Self> {
+        let f = std::fs::File::open(path)?;
+        let mut reader = BufReader::new(f);
+        Self::from_reader(&mut reader)
+    }
+
+    pub fn from_reader<R: Read>(reader: &mut R) -> io::Result<Self> {
+        let rope = Rope::from_reader(reader)?;
+        let lines = rope.len_lines().max(1);
+        Ok(Self {
+            rope,
+            name: "Text".to_string(),
+            line_cache: vec![(); lines].into_iter().map(|_| OnceCell::new()).collect(),
+        })
+    }
+
+    pub fn set_text<S: Into<String>>(&mut self, text: S) {
+        let s = text.into();
+        self.rope = Rope::from_str(&s);
+        self.resize_cache();
+        self.invalidate_cache_from(0);
+    }
+
+    pub fn line_count(&self) -> usize {
+        self.rope.len_lines().max(1)
+    }
+
+    fn resize_cache(&mut self) {
+        let want = self.line_count();
+        if self.line_cache.len() < want {
+            self.line_cache
+                .extend((0..(want - self.line_cache.len())).map(|_| OnceCell::new()));
+        } else if self.line_cache.len() > want {
+            self.line_cache.truncate(want);
+        }
+    }
+
+    fn invalidate_cache_from(&mut self, line_idx: usize) {
+        self.resize_cache();
+        if line_idx < self.line_cache.len() {
+            for cell in &mut self.line_cache[line_idx..] {
+                let _ = cell.take();
+            }
+        }
+    }
+
+    #[inline]
+    fn line_bounds_chars(&self, line_idx: usize) -> (usize, usize) {
+        // Returns [start, end) in char indices for content only (excluding newline).
+        let total_lines = self.line_count();
+        let start = self.rope.line_to_char(line_idx);
+        let end_exclusive = if line_idx + 1 < total_lines {
+            // Next line start is at the char index right after the newline.
+            // Exclude the newline itself by not including it in the range.
+            self.rope.line_to_char(line_idx + 1) - 1
+        } else {
+            self.rope.len_chars()
+        };
+        (start, end_exclusive)
+    }
+
+    fn line_content_len_chars(&self, line_idx: usize) -> usize {
+        let slice = self.rope.line(line_idx);
+        let mut len = slice.len_chars();
+        if line_idx + 1 < self.line_count() && len > 0 {
+            // Non-final lines include a trailing '\n' char in rope; exclude it.
+            len -= 1;
+        }
+        len
+    }
+
+    fn compute_line_string(&self, index: usize) -> String {
+        let mut s = self.rope.line(index).to_string();
+        // Trim trailing newline/CR if present (for non-final lines)
+        if s.ends_with('\n') {
+            s.pop();
+            if s.ends_with('\r') {
+                s.pop();
+            }
+        }
+        s
+    }
+
+    // --------------------------
+    // Editing helpers for TextAreaState (unchanged API)
+    // --------------------------
+
+    /// Split line at a character offset (within that line).
+    /// Returns the index of the newly created line (line_idx + 1).
+    pub fn split_line_at(&mut self, line_idx: usize, at_char: usize) -> usize {
+        let lines = self.line_count();
+        let clamped_line = line_idx.min(lines.saturating_sub(1));
+        let (start, end) = self.line_bounds_chars(clamped_line);
+        let line_len = end.saturating_sub(start);
+        let at = at_char.min(line_len);
+
+        let insert_at = start + at;
+        self.rope.insert(insert_at, "\n"); // rope insert at char index
+
+        self.resize_cache();
+        self.invalidate_cache_from(clamped_line);
+        clamped_line + 1
+    }
+
+    /// Join current line with the next by removing the newline.
+    /// Returns Some(new_cursor_col_on_merged_line) or None if no next line.
+    pub fn join_with_next(&mut self, line_idx: usize) -> Option<usize> {
+        if line_idx + 1 >= self.line_count() {
+            return None;
+        }
+        let newline_pos = self.rope.line_to_char(line_idx + 1) - 1; // index of '\n'
+        let left_len = self.line_content_len_chars(line_idx);
+        self.rope.remove(newline_pos..newline_pos + 1); // remove the newline
+
+        self.resize_cache();
+        self.invalidate_cache_from(line_idx);
+        Some(left_len)
+    }
+
+    /// Join current line with the previous by removing the previous newline.
+    /// Returns Some((new_prev_index, cursor_col)) or None if at line 0.
+    pub fn join_with_prev(&mut self, line_idx: usize) -> Option<(usize, usize)> {
+        if line_idx == 0 || line_idx >= self.line_count() {
+            return None;
+        }
+        let prev_idx = line_idx - 1;
+        let prev_len = self.line_content_len_chars(prev_idx);
+        let newline_pos = self.rope.line_to_char(line_idx) - 1; // index of '\n' before current line
+        self.rope.remove(newline_pos..newline_pos + 1);
+
+        self.resize_cache();
+        self.invalidate_cache_from(prev_idx);
+        Some((prev_idx, prev_len))
+    }
+
+    /// Insert an empty line after given index.
+    /// Returns the index of the inserted blank line (line_idx + 1).
+    pub fn insert_blank_line_after(&mut self, line_idx: usize) -> usize {
+        let lines = self.line_count();
+        let clamped = line_idx.min(lines.saturating_sub(1));
+        let pos = if clamped + 1 < lines {
+            self.rope.line_to_char(clamped + 1)
+        } else {
+            self.rope.len_chars()
+        };
+        self.rope.insert(pos, "\n");
+
+        self.resize_cache();
+        self.invalidate_cache_from(clamped);
+        clamped + 1
+    }
+
+    /// Insert an empty line before given index.
+    /// Returns the index of the inserted blank line (line_idx).
+    pub fn insert_blank_line_before(&mut self, line_idx: usize) -> usize {
+        let clamped = line_idx.min(self.line_count());
+        let pos = if clamped < self.line_count() {
+            self.rope.line_to_char(clamped)
+        } else {
+            self.rope.len_chars()
+        };
+        self.rope.insert(pos, "\n");
+
+        self.resize_cache();
+        self.invalidate_cache_from(clamped);
+        clamped
+    }
+}
+
+impl DataProvider for TextAreaProvider {
+    fn field_count(&self) -> usize {
+        self.line_count()
+    }
+
+    fn field_name(&self, _index: usize) -> &str {
+        &self.name
+    }
+
+    fn field_value(&self, index: usize) -> &str {
+        if index >= self.line_cache.len() {
+            return "";
+        }
+        let cell = &self.line_cache[index];
+        // Fill lazily on first read, from &self (no &mut needed).
+        let s_ref = cell.get_or_init(|| self.compute_line_string(index));
+        s_ref.as_str()
+    }
+
+    fn set_field_value(&mut self, index: usize, value: String) {
+        if index >= self.line_count() {
+            return;
+        }
+        // Enforce single-line invariant: strip embedded newlines
+        let clean = value.replace('\n', "");
+
+        let (start, end) = self.line_bounds_chars(index);
+        self.rope.remove(start..end);
+        self.rope.insert(start, &clean);
+
+        self.resize_cache();
+        if index < self.line_cache.len() {
+            // Replace this line’s cached string only; other lines unchanged
+            let _ = self.line_cache[index].take();
+            let _ = self.line_cache[index].set(clean);
+        }
+    }
+}
--- a/canvas/src/textarea/state.rs
+++ b/canvas/src/textarea/state.rs
@@ -0,0 +1,518 @@
+// src/textarea/state.rs
+use std::ops::{Deref, DerefMut};
+
+use crossterm::event::{KeyCode, KeyEvent, KeyEventKind, KeyModifiers};
+
+use crate::editor::FormEditor;
+use crate::textarea::provider::TextAreaProvider;
+use crate::data_provider::DataProvider;
+
+#[cfg(feature = "gui")]
+use ratatui::{layout::Rect, widgets::Block};
+
+#[cfg(feature = "gui")]
+use unicode_width::UnicodeWidthChar;
+
+#[cfg(feature = "gui")]
+pub(crate) const RIGHT_PAD: u16 = 3;
+
+#[cfg(feature = "gui")]
+pub(crate) fn compute_h_scroll_with_padding(
+    cursor_cols: u16,
+    width: u16,
+) -> (u16, u16) {
+    let mut h = 0u16;
+    for _ in 0..2 {
+        let left_cols = if h > 0 { 1 } else { 0 };
+        let max_x_visible = width.saturating_sub(1 + RIGHT_PAD + left_cols);
+        let needed = cursor_cols.saturating_sub(max_x_visible);
+        if needed <= h {
+            return (h, left_cols);
+        }
+        h = needed;
+    }
+    let left_cols = if h > 0 { 1 } else { 0 };
+    (h, left_cols)
+}
+
+#[cfg(feature = "gui")]
+fn normalize_indent(width: u16, indent: u16) -> u16 {
+    indent.min(width.saturating_sub(1))
+}
+
+#[cfg(feature = "gui")]
+pub(crate) fn count_wrapped_rows_indented(
+    s: &str,
+    width: u16,
+    indent: u16,
+) -> u16 {
+    if width == 0 {
+        return 1;
+    }
+    let indent = normalize_indent(width, indent);
+    let cont_cap = width.saturating_sub(indent);
+
+    let mut rows: u16 = 1;
+    let mut used: u16 = 0;
+    let mut first = true;
+
+    for ch in s.chars() {
+        let w = UnicodeWidthChar::width(ch).unwrap_or(0) as u16;
+        let cap = if first { width } else { cont_cap };
+
+        if used > 0 && used.saturating_add(w) >= cap {
+            rows = rows.saturating_add(1);
+            first = false;
+            used = indent;
+        }
+        used = used.saturating_add(w);
+    }
+
+    rows
+}
+
+#[cfg(feature = "gui")]
+fn wrapped_rows_to_cursor_indented(
+    s: &str,
+    width: u16,
+    indent: u16,
+    cursor_chars: usize,
+) -> (u16, u16) {
+    if width == 0 {
+        return (0, 0);
+    }
+    let indent = normalize_indent(width, indent);
+    let cont_cap = width.saturating_sub(indent);
+
+    let mut row: u16 = 0;
+    let mut used: u16 = 0;
+    let mut first = true;
+
+    for (i, ch) in s.chars().enumerate() {
+        if i >= cursor_chars {
+            break;
+        }
+        let w = UnicodeWidthChar::width(ch).unwrap_or(0) as u16;
+        let cap = if first { width } else { cont_cap };
+
+        if used > 0 && used.saturating_add(w) >= cap {
+            row = row.saturating_add(1);
+            first = false;
+            used = indent;
+        }
+        used = used.saturating_add(w);
+    }
+
+    (row, used.min(width.saturating_sub(1)))
+}
+
+pub type TextAreaEditor = FormEditor<TextAreaProvider>;
+
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+pub enum TextOverflowMode {
+    Indicator { ch: char },
+    Wrap,
+}
+
+pub struct TextAreaState {
+    pub(crate) editor: TextAreaEditor,
+    pub(crate) scroll_y: u16,
+    pub(crate) placeholder: Option<String>,
+    pub(crate) overflow_mode: TextOverflowMode,
+    pub(crate) h_scroll: u16,
+    #[cfg(feature = "gui")]
+    pub(crate) wrap_indent_cols: u16,
+    #[cfg(feature = "gui")]
+    pub(crate) edited_this_frame: bool,
+}
+
+impl Default for TextAreaState {
+    fn default() -> Self {
+        Self {
+            editor: FormEditor::new(TextAreaProvider::default()),
+            scroll_y: 0,
+            placeholder: None,
+            overflow_mode: TextOverflowMode::Indicator { ch: '$' },
+            h_scroll: 0,
+            #[cfg(feature = "gui")]
+            wrap_indent_cols: 0,
+            #[cfg(feature = "gui")]
+            edited_this_frame: false,
+        }
+    }
+}
+
+impl Deref for TextAreaState {
+    type Target = TextAreaEditor;
+
+    fn deref(&self) -> &Self::Target {
+        &self.editor
+    }
+}
+
+impl DerefMut for TextAreaState {
+    fn deref_mut(&mut self) -> &mut Self::Target {
+        &mut self.editor
+    }
+}
+
+impl TextAreaState {
+    pub fn from_text<S: Into<String>>(text: S) -> Self {
+        let provider = TextAreaProvider::from_text(text);
+        Self {
+            editor: FormEditor::new(provider),
+            scroll_y: 0,
+            placeholder: None,
+            overflow_mode: TextOverflowMode::Indicator { ch: '$' },
+            h_scroll: 0,
+            #[cfg(feature = "gui")]
+            wrap_indent_cols: 0,
+            #[cfg(feature = "gui")]
+            edited_this_frame: false,
+        }
+    }
+
+    pub fn text(&self) -> String {
+        self.editor.data_provider().to_text()
+    }
+
+    pub fn set_text<S: Into<String>>(&mut self, text: S) {
+        self.editor.data_provider_mut().set_text(text);
+        self.editor.ui_state.current_field = 0;
+        self.editor.ui_state.cursor_pos = 0;
+        self.editor.ui_state.ideal_cursor_column = 0;
+    }
+
+    pub fn set_placeholder<S: Into<String>>(&mut self, s: S) {
+        self.placeholder = Some(s.into());
+    }
+
+    pub fn use_overflow_indicator(&mut self, ch: char) {
+        self.overflow_mode = TextOverflowMode::Indicator { ch };
+    }
+
+    pub fn use_wrap(&mut self) {
+        self.overflow_mode = TextOverflowMode::Wrap;
+    }
+
+    pub fn set_wrap_indent_cols(&mut self, cols: u16) {
+        #[cfg(feature = "gui")]
+        {
+            self.wrap_indent_cols = cols;
+        }
+    }
+
+    pub fn insert_newline(&mut self) {
+        #[cfg(feature = "gui")]
+        {
+            self.edited_this_frame = true;
+        }
+        let line_idx = self.current_field();
+        let col = self.cursor_position();
+
+        let new_idx = self
+            .editor
+            .data_provider_mut()
+            .split_line_at(line_idx, col);
+
+        let _ = self.transition_to_field(new_idx);
+        self.move_line_start();
+        self.enter_edit_mode();
+    }
+
+    pub fn backspace(&mut self) {
+        let col = self.cursor_position();
+        if col > 0 {
+            #[cfg(feature = "gui")]
+            {
+                self.edited_this_frame = true;
+            }
+            let _ = self.delete_backward();
+            return;
+        }
+
+        let line_idx = self.current_field();
+        if line_idx == 0 {
+            return;
+        }
+
+        if let Some((prev_idx, new_col)) =
+            self.editor.data_provider_mut().join_with_prev(line_idx)
+        {
+            #[cfg(feature = "gui")]
+            {
+                self.edited_this_frame = true;
+            }
+            let _ = self.transition_to_field(prev_idx);
+            self.set_cursor_position(new_col);
+            self.enter_edit_mode();
+        }
+    }
+
+    pub fn delete_forward_or_join(&mut self) {
+        let line_idx = self.current_field();
+        let line_len = self.current_text().chars().count();
+        let col = self.cursor_position();
+
+        if col < line_len {
+            #[cfg(feature = "gui")]
+            {
+                self.edited_this_frame = true;
+            }
+            let _ = self.delete_forward();
+            return;
+        }
+
+        if let Some(new_col) =
+            self.editor.data_provider_mut().join_with_next(line_idx)
+        {
+            #[cfg(feature = "gui")]
+            {
+                self.edited_this_frame = true;
+            }
+            self.set_cursor_position(new_col);
+            self.enter_edit_mode();
+        }
+    }
+
+    pub fn input(&mut self, key: KeyEvent) {
+        if key.kind != KeyEventKind::Press {
+            return;
+        }
+
+        match (key.code, key.modifiers) {
+            (KeyCode::Enter, _) => self.insert_newline(),
+            (KeyCode::Backspace, _) => self.backspace(),
+            (KeyCode::Delete, _) => self.delete_forward_or_join(),
+
+            (KeyCode::Left, _) => {
+                let _ = self.move_left();
+            }
+            (KeyCode::Right, _) => {
+                let _ = self.move_right();
+            }
+            (KeyCode::Up, _) => {
+                let _ = self.move_up();
+            }
+            (KeyCode::Down, _) => {
+                let _ = self.move_down();
+            }
+
+            (KeyCode::Home, _)
+            | (KeyCode::Char('a'), KeyModifiers::CONTROL) => {
+                self.move_line_start();
+            }
+            (KeyCode::End, _)
+            | (KeyCode::Char('e'), KeyModifiers::CONTROL) => {
+                self.move_line_end();
+            }
+
+            (KeyCode::Char('b'), KeyModifiers::ALT) => self.move_word_prev(),
+            (KeyCode::Char('f'), KeyModifiers::ALT) => self.move_word_next(),
+            (KeyCode::Char('e'), KeyModifiers::ALT) => self.move_word_end(),
+
+            (KeyCode::Char(c), m) if m.is_empty() => {
+                self.enter_edit_mode();
+                #[cfg(feature = "gui")]
+                {
+                    self.edited_this_frame = true;
+                }
+                let _ = self.insert_char(c);
+            }
+
+            (KeyCode::Tab, _) => {
+                self.enter_edit_mode();
+                #[cfg(feature = "gui")]
+                {
+                    self.edited_this_frame = true;
+                }
+                for _ in 0..4 {
+                    let _ = self.insert_char(' ');
+                }
+            }
+
+            _ => {}
+        }
+    }
+
+    #[cfg(feature = "gui")]
+    fn visual_rows_before_line_and_intra_indented(
+        &self,
+        width: u16,
+        line_idx: usize,
+    ) -> u16 {
+        let provider = self.editor.data_provider();
+        let mut acc: u16 = 0;
+        let indent = self.wrap_indent_cols;
+
+        for i in 0..line_idx {
+            let s = provider.field_value(i);
+            acc = acc.saturating_add(count_wrapped_rows_indented(s, width, indent));
+        }
+        acc
+    }
+
+    #[cfg(feature = "gui")]
+    pub fn cursor(&self, area: Rect, block: Option<&Block<'_>>) -> (u16, u16) {
+        let inner = if let Some(b) = block { b.inner(area) } else { area };
+        let line_idx = self.current_field();
+
+        match self.overflow_mode {
+            TextOverflowMode::Wrap => {
+                let width = inner.width;
+                let y_top = inner.y;
+                let indent = self.wrap_indent_cols;
+
+                if width == 0 {
+                    let prefix = self.visual_rows_before_line_and_intra_indented(1, line_idx);
+                    let y = y_top.saturating_add(prefix.saturating_sub(self.scroll_y));
+                    return (inner.x, y);
+                }
+
+                let prefix_rows =
+                    self.visual_rows_before_line_and_intra_indented(width, line_idx);
+                let current_line = self.current_text();
+                let col_chars = self.display_cursor_position();
+
+                let (subrow, x_cols) = wrapped_rows_to_cursor_indented(
+                    current_line,
+                    width,
+                    indent,
+                    col_chars,
+                );
+
+                let caret_vis_row = prefix_rows.saturating_add(subrow);
+                let y = y_top.saturating_add(caret_vis_row.saturating_sub(self.scroll_y));
+                let x = inner.x.saturating_add(x_cols);
+                (x, y)
+            }
+            TextOverflowMode::Indicator { .. } => {
+                let y = inner.y + (line_idx as u16).saturating_sub(self.scroll_y);
+                let current_line = self.current_text();
+                let col = self.display_cursor_position();
+
+                let mut x_cols: u16 = 0;
+                let mut total_cols: u16 = 0;
+                for (i, ch) in current_line.chars().enumerate() {
+                    let w = UnicodeWidthChar::width(ch).unwrap_or(0) as u16;
+                    if i < col {
+                        x_cols = x_cols.saturating_add(w);
+                    }
+                    total_cols = total_cols.saturating_add(w);
+                }
+
+                let left_cols = if self.h_scroll > 0 { 1 } else { 0 };
+
+                let mut x_off_visible = x_cols
+                    .saturating_sub(self.h_scroll)
+                    .saturating_add(left_cols);
+
+                let limit = inner.width.saturating_sub(1 + RIGHT_PAD);
+
+                if x_off_visible > limit {
+                    x_off_visible = limit;
+                }
+
+                let x = inner.x.saturating_add(x_off_visible);
+                (x, y)
+            }
+        }
+    }
+
+    #[cfg(feature = "gui")]
+    pub(crate) fn ensure_visible(&mut self, area: Rect, block: Option<&Block<'_>>) {
+        let inner = if let Some(b) = block { b.inner(area) } else { area };
+        if inner.height == 0 {
+            return;
+        }
+
+        match self.overflow_mode {
+            TextOverflowMode::Indicator { .. } => {
+                let line_idx_u16 = self.current_field() as u16;
+                if line_idx_u16 < self.scroll_y {
+                    self.scroll_y = line_idx_u16;
+                } else if line_idx_u16 >= self.scroll_y + inner.height {
+                    self.scroll_y = line_idx_u16.saturating_sub(inner.height - 1);
+                }
+
+                let width = inner.width;
+                if width == 0 {
+                    return;
+                }
+
+                let current_line = self.current_text();
+                let mut total_cols: u16 = 0;
+                for ch in current_line.chars() {
+                    total_cols = total_cols
+                        .saturating_add(UnicodeWidthChar::width(ch).unwrap_or(0) as u16);
+                }
+                if total_cols <= width {
+                    self.h_scroll = 0;
+                    return;
+                }
+
+                let col = self.display_cursor_position();
+                let mut cursor_cols: u16 = 0;
+                for (i, ch) in current_line.chars().enumerate() {
+                    if i >= col {
+                        break;
+                    }
+                    cursor_cols = cursor_cols
+                        .saturating_add(UnicodeWidthChar::width(ch).unwrap_or(0) as u16);
+                }
+
+                let (target_h, _left_cols) =
+                    compute_h_scroll_with_padding(cursor_cols, width);
+
+                if target_h > self.h_scroll {
+                    self.h_scroll = target_h;
+                } else if cursor_cols < self.h_scroll {
+                    self.h_scroll = cursor_cols;
+                }
+            }
+            TextOverflowMode::Wrap => {
+                let width = inner.width;
+                if width == 0 {
+                    self.h_scroll = 0;
+                    return;
+                }
+
+                let indent = self.wrap_indent_cols;
+                let line_idx = self.current_field();
+
+                let prefix_rows =
+                    self.visual_rows_before_line_and_intra_indented(width, line_idx);
+
+                let current_line = self.current_text();
+                let col = self.display_cursor_position();
+
+                let (subrow, _x_cols) =
+                    wrapped_rows_to_cursor_indented(current_line, width, indent, col);
+
+                let caret_vis_row = prefix_rows.saturating_add(subrow);
+
+                let top = self.scroll_y;
+                let height = inner.height;
+
+                if caret_vis_row < top {
+                    self.scroll_y = caret_vis_row;
+                } else {
+                    let bottom = top.saturating_add(height.saturating_sub(1));
+                    if caret_vis_row > bottom {
+                        let shift = caret_vis_row.saturating_sub(bottom);
+                        self.scroll_y = top.saturating_add(shift);
+                    }
+                }
+
+                self.h_scroll = 0;
+            }
+        }
+    }
+    
+    #[cfg(feature = "gui")]
+    pub(crate) fn take_edited_flag(&mut self) -> bool {
+        let v = self.edited_this_frame;
+        self.edited_this_frame = false;
+        v
+    }
+}
--- a/canvas/src/textarea/widget.rs
+++ b/canvas/src/textarea/widget.rs
@@ -0,0 +1,352 @@
+// src/textarea/widget.rs
+#[cfg(feature = "gui")]
+use ratatui::{
+    buffer::Buffer,
+    layout::{Alignment, Rect},
+    style::Style,
+    text::{Line, Span},
+    widgets::{
+        Block, BorderType, Borders, Paragraph, StatefulWidget, Widget,
+    },
+};
+
+#[cfg(feature = "gui")]
+use crate::data_provider::DataProvider;
+
+#[cfg(feature = "gui")]
+use crate::textarea::state::{
+    compute_h_scroll_with_padding,
+    count_wrapped_rows_indented,
+    TextAreaState,
+    TextOverflowMode,
+};
+
+#[cfg(feature = "gui")]
+use unicode_width::UnicodeWidthChar;
+
+#[cfg(feature = "gui")]
+#[derive(Debug, Clone)]
+pub struct TextArea<'a> {
+    pub(crate) block: Option<Block<'a>>,
+    pub(crate) style: Style,
+    pub(crate) border_type: BorderType,
+}
+
+#[cfg(feature = "gui")]
+impl<'a> Default for TextArea<'a> {
+    fn default() -> Self {
+        Self {
+            block: Some(
+                Block::default()
+                    .borders(Borders::ALL)
+                    .border_type(BorderType::Rounded),
+            ),
+            style: Style::default(),
+            border_type: BorderType::Rounded,
+        }
+    }
+}
+
+#[cfg(feature = "gui")]
+impl<'a> TextArea<'a> {
+    pub fn block(mut self, block: Block<'a>) -> Self {
+        self.block = Some(block);
+        self
+    }
+
+    pub fn style(mut self, style: Style) -> Self {
+        self.style = style;
+        self
+    }
+
+    pub fn border_type(mut self, ty: BorderType) -> Self {
+        self.border_type = ty;
+        if let Some(b) = &mut self.block {
+            *b = b.clone().border_type(ty);
+        }
+        self
+    }
+}
+
+#[cfg(feature = "gui")]
+fn display_width(s: &str) -> u16 {
+    s.chars()
+        .map(|c| UnicodeWidthChar::width(c).unwrap_or(0) as u16)
+        .sum()
+}
+
+#[cfg(feature = "gui")]
+fn display_cols_up_to(s: &str, char_count: usize) -> u16 {
+    let mut cols: u16 = 0;
+    for (i, ch) in s.chars().enumerate() {
+        if i >= char_count {
+            break;
+        }
+        cols = cols.saturating_add(UnicodeWidthChar::width(ch).unwrap_or(0) as u16);
+    }
+    cols
+}
+
+#[cfg(feature = "gui")]
+fn slice_by_display_cols(s: &str, start_cols: u16, max_cols: u16) -> String {
+    if max_cols == 0 {
+        return String::new();
+    }
+
+    let mut current_cols: u16 = 0;
+    let mut output = String::new();
+    let mut taken: u16 = 0;
+    let mut started = false;
+
+    for ch in s.chars() {
+        let w = UnicodeWidthChar::width(ch).unwrap_or(0) as u16;
+
+        if !started {
+            if current_cols.saturating_add(w) <= start_cols {
+                current_cols = current_cols.saturating_add(w);
+                continue;
+            } else {
+                started = true;
+            }
+        }
+
+        if taken.saturating_add(w) > max_cols {
+            break;
+        }
+
+        output.push(ch);
+        taken = taken.saturating_add(w);
+        current_cols = current_cols.saturating_add(w);
+    }
+
+    output
+}
+
+#[cfg(feature = "gui")]
+fn clip_window_with_indicator_padded(
+    text: &str,
+    view_width: u16,
+    indicator: char,
+    start_cols: u16,
+) -> Line<'static> {
+    if view_width == 0 {
+        return Line::from("");
+    }
+
+    let total = display_width(text);
+
+    // Left indicator if we scrolled
+    let show_left = start_cols > 0;
+    let left_cols: u16 = if show_left { 1 } else { 0 };
+
+    // Capacity for text if we also need a right indicator
+    let cap_with_right = view_width.saturating_sub(left_cols + 1);
+
+    // Do we still have content beyond this window?
+    let remaining = total.saturating_sub(start_cols);
+    let show_right = remaining > cap_with_right;
+
+    // Final capacity for visible text
+    let max_visible = if show_right {
+        cap_with_right
+    } else {
+        view_width.saturating_sub(left_cols)
+    };
+
+    let visible = slice_by_display_cols(text, start_cols, max_visible);
+
+    let mut spans: Vec<Span> = Vec::new();
+    if show_left {
+        spans.push(Span::raw(indicator.to_string()));
+    }
+
+    // Visible text
+    spans.push(Span::raw(visible.clone()));
+
+    // Place $ flush-right
+    if show_right {
+        let used_cols = left_cols + display_width(&visible);
+        let right_pos = view_width.saturating_sub(1);
+        let filler = right_pos.saturating_sub(used_cols);
+        if filler > 0 {
+            spans.push(Span::raw(" ".repeat(filler as usize)));
+        }
+        spans.push(Span::raw(indicator.to_string()));
+    }
+
+    Line::from(spans)
+}
+
+#[cfg(feature = "gui")]
+fn wrap_segments_with_indent(
+    s: &str,
+    width: u16,
+    indent: u16,
+) -> Vec<String> {
+    let mut segments: Vec<String> = Vec::new();
+    if width == 0 {
+        segments.push(String::new());
+        return segments;
+    }
+
+    let indent = indent.min(width.saturating_sub(1));
+    let cont_cap = width.saturating_sub(indent);
+    let indent_str = " ".repeat(indent as usize);
+
+    let mut buf = String::new();
+    let mut used: u16 = 0;
+    let mut first = true;
+
+    for ch in s.chars() {
+        let w = UnicodeWidthChar::width(ch).unwrap_or(0) as u16;
+        let cap = if first { width } else { cont_cap };
+
+        // Early-wrap: wrap before filling the last cell (and avoid empty segment)
+        if used > 0 && used.saturating_add(w) >= cap {
+            segments.push(buf);
+            buf = String::new();
+            used = 0;
+            first = false;
+            if indent > 0 {
+                buf.push_str(&indent_str);
+                used = indent;
+            }
+        }
+
+        buf.push(ch);
+        used = used.saturating_add(w);
+    }
+
+    segments.push(buf);
+    segments
+}
+
+// Map visual row offset to (logical line, intra segment)
+#[cfg(feature = "gui")]
+fn resolve_start_line_and_intra_indented(
+    state: &TextAreaState,
+    inner: Rect,
+) -> (usize, u16) {
+    let provider = state.editor.data_provider();
+    let total = provider.line_count();
+
+    if total == 0 {
+        return (0, 0);
+    }
+
+    let wrap = matches!(state.overflow_mode, TextOverflowMode::Wrap);
+    let width = inner.width;
+    let target_vis = state.scroll_y;
+
+    if !wrap {
+        let start = (target_vis as usize).min(total);
+        return (start, 0);
+    }
+
+    let indent = state.wrap_indent_cols;
+
+    let mut acc: u16 = 0;
+    for i in 0..total {
+        let s = provider.field_value(i);
+        let rows = count_wrapped_rows_indented(s, width, indent);
+        if acc.saturating_add(rows) > target_vis {
+            let intra = target_vis.saturating_sub(acc);
+            return (i, intra);
+        }
+        acc = acc.saturating_add(rows);
+    }
+
+    (total.saturating_sub(1), 0)
+}
+
+#[cfg(feature = "gui")]
+impl<'a> StatefulWidget for TextArea<'a> {
+    type State = TextAreaState;
+
+    fn render(self, area: Rect, buf: &mut Buffer, state: &mut Self::State) {
+        state.ensure_visible(area, self.block.as_ref());
+
+        let inner = if let Some(b) = &self.block {
+            b.clone().render(area, buf);
+            b.inner(area)
+        } else {
+            area
+        };
+
+        let edited_now = state.take_edited_flag();
+
+        let wrap_mode = matches!(state.overflow_mode, TextOverflowMode::Wrap);
+        let provider = state.editor.data_provider();
+        let total = provider.line_count();
+
+        let (start, intra) = resolve_start_line_and_intra_indented(state, inner);
+
+        let mut display_lines: Vec<Line> = Vec::new();
+
+        if total == 0 || start >= total {
+            if let Some(ph) = &state.placeholder {
+                display_lines.push(Line::from(Span::raw(ph.clone())));
+            }
+        } else if wrap_mode {
+            // manual pre-wrap path (unchanged)
+            let mut rows_left = inner.height;
+            let indent = state.wrap_indent_cols;
+            let mut i = start;
+            while i < total && rows_left > 0 {
+                let s = provider.field_value(i);
+                let segments = wrap_segments_with_indent(s, inner.width, indent);
+                let skip = if i == start { intra as usize } else { 0 };
+                for seg in segments.into_iter().skip(skip) {
+                    display_lines.push(Line::from(Span::raw(seg)));
+                    rows_left = rows_left.saturating_sub(1);
+                    if rows_left == 0 {
+                        break;
+                    }
+                }
+                i += 1;
+            }
+        } else {
+            // Indicator mode: full inner width; RIGHT_PAD only affects cursor clamp and h-scroll
+            let end = (start.saturating_add(inner.height as usize)).min(total);
+
+            for i in start..end {
+                let s = provider.field_value(i);
+                match state.overflow_mode {
+                    TextOverflowMode::Wrap => unreachable!(),
+                    TextOverflowMode::Indicator { ch } => {
+                        let fits = display_width(s) <= inner.width;
+
+                        let start_cols = if i == state.current_field() {
+                            let col_idx = state.display_cursor_position();
+                            let cursor_cols = display_cols_up_to(s, col_idx);
+                            let (target_h, _left_cols) =
+                                compute_h_scroll_with_padding(cursor_cols, inner.width);
+
+                            if fits {
+                                if edited_now { target_h } else { 0 }
+                            } else {
+                                target_h.max(state.h_scroll)
+                            }
+                        } else {
+                            0
+                        };
+
+                        display_lines.push(clip_window_with_indicator_padded(
+                            s,
+                            inner.width,
+                            ch,
+                            start_cols,
+                        ));
+                    }
+                }
+            }
+        }
+
+        let p = Paragraph::new(display_lines)
+            .alignment(Alignment::Left)
+            .style(self.style);
+
+        // No Paragraph::wrap/scroll in wrap mode — we pre-wrap.
+        p.render(inner, buf);
+    }
+}
--- a/canvas/src/validation/formatting.rs
+++ b/canvas/src/validation/formatting.rs
@@ -1,6 +1,11 @@
-/* canvas/src/validation/formatting.rs
-   Add new formatting module with CustomFormatter, PositionMapper, DefaultPositionMapper, and FormattingResult
-*/
+// src/validation/formatting.rs
+//! Custom formatting and position mapping for validation/display.
+//!
+//! This module defines the CustomFormatter trait along with helpers to map
+//! cursor positions between the raw stored text and the formatted display
+//! representation. Implementors may provide a custom PositionMapper to handle
+//! advanced formatting scenarios.
+
 use std::sync::Arc;

 /// Bidirectional mapping between raw input positions and formatted display positions.
@@ -108,7 +113,7 @@ impl FormattingResult {
    pub fn success(formatted: impl Into<String>) -> Self {
        FormattingResult::Success {
            formatted: formatted.into(),
-            mapper: Arc::new(DefaultPositionMapper::default()),
+            mapper: Arc::new(DefaultPositionMapper),
        }
    }

@@ -117,7 +122,7 @@ impl FormattingResult {
        FormattingResult::Warning {
            formatted: formatted.into(),
            message: message.into(),
-            mapper: Arc::new(DefaultPositionMapper::default()),
+            mapper: Arc::new(DefaultPositionMapper),
        }
    }

@@ -187,7 +192,7 @@ mod tests {

    #[test]
    fn default_mapper_roundtrip_basic() {
-        let mapper = DefaultPositionMapper::default();
+        let mapper = DefaultPositionMapper;
        let raw = "01001";
        let formatted = "010 01";

@@ -214,4 +219,4 @@ mod tests {
            _ => panic!("expected success"),
        }
    }
-}
+}
--- a/canvas/src/validation/limits.rs
+++ b/canvas/src/validation/limits.rs
@@ -23,8 +23,10 @@ pub struct CharacterLimits {

 /// How to count characters for limit checking
 #[derive(Debug, Clone, Copy, Serialize, Deserialize)]
+#[derive(Default)]
 pub enum CountMode {
    /// Count actual characters (default)
+    #[default]
    Characters,
    
    /// Count display width (useful for CJK characters)
@@ -34,11 +36,6 @@ pub enum CountMode {
    Bytes,
 }

-impl Default for CountMode {
-    fn default() -> Self {
-        CountMode::Characters
-    }
-}

 /// Result of a character limit check
 #[derive(Debug, Clone, PartialEq, Eq)]
@@ -122,42 +119,55 @@ impl CharacterLimits {
    pub fn validate_insertion(
        &self,
        current_text: &str,
-        _position: usize,
+        position: usize,
        character: char,
    ) -> Option<ValidationResult> {
-        let current_count = self.count(current_text);
-        let char_count = match self.count_mode {
-            CountMode::Characters => 1,
-            CountMode::DisplayWidth => {
-                let char_str = character.to_string();
-                char_str.width()
-            },
-            CountMode::Bytes => character.len_utf8(),
-        };
-        let new_count = current_count + char_count;
+        // FIX: Actually simulate the insertion at the specified position
+        // This makes the `position` parameter essential to the logic
        
+        // 1. Create the new string by inserting the character at the correct position
+        let mut new_text = String::with_capacity(current_text.len() + character.len_utf8());
+        let mut chars = current_text.chars();
+
+        // Append characters from the original string that come before the insertion point
+        // We clamp the position to be safe
+        let clamped_pos = position.min(current_text.chars().count());
+        for _ in 0..clamped_pos {
+            if let Some(ch) = chars.next() {
+                new_text.push(ch);
+            }
+        }
+
+        // Insert the new character
+        new_text.push(character);
+
+        // Append the rest of the original string
+        for ch in chars {
+            new_text.push(ch);
+        }
+
+        // 2. Now perform all validation on the *actual* resulting text
+        let new_count = self.count(&new_text);
+        let current_count = self.count(current_text);
+
        // Check max length
        if let Some(max) = self.max_length {
            if new_count > max {
                return Some(ValidationResult::error(format!(
-                    "Character limit exceeded: {}/{}", 
-                    new_count, 
-                    max
+                    "Character limit exceeded: {new_count}/{max}"
                )));
            }
-            
+
            // Check warning threshold
            if let Some(warning_threshold) = self.warning_threshold {
                if new_count >= warning_threshold && current_count < warning_threshold {
                    return Some(ValidationResult::warning(format!(
-                        "Approaching character limit: {}/{}", 
-                        new_count, 
-                        max
+                        "Approaching character limit: {new_count}/{max}"
                    )));
                }
            }
        }
-        
+
        None // No validation issues
    }
    
@@ -169,9 +179,7 @@ impl CharacterLimits {
        if let Some(min) = self.min_length {
            if count < min {
                return Some(ValidationResult::warning(format!(
-                    "Minimum length not met: {}/{}", 
-                    count, 
-                    min
+                    "Minimum length not met: {count}/{min}"
                )));
            }
        }
@@ -180,9 +188,7 @@ impl CharacterLimits {
        if let Some(max) = self.max_length {
            if count > max {
                return Some(ValidationResult::error(format!(
-                    "Character limit exceeded: {}/{}", 
-                    count, 
-                    max
+                    "Character limit exceeded: {count}/{max}"
                )));
            }
            
@@ -190,9 +196,7 @@ impl CharacterLimits {
            if let Some(warning_threshold) = self.warning_threshold {
                if count >= warning_threshold {
                    return Some(ValidationResult::warning(format!(
-                        "Approaching character limit: {}/{}", 
-                        count, 
-                        max
+                        "Approaching character limit: {count}/{max}"
                    )));
                }
            }
@@ -234,20 +238,16 @@ impl CharacterLimits {
        match self.check_limits(text) {
            LimitCheckResult::Ok => {
                // Show current/max if we have a max limit
-                if let Some(max) = self.max_length {
-                    Some(format!("{}/{}", self.count(text), max))
-                } else {
-                    None
-                }
+                self.max_length.map(|max| format!("{}/{}", self.count(text), max))
            },
            LimitCheckResult::Warning { current, max } => {
-                Some(format!("{}/{} (approaching limit)", current, max))
+                Some(format!("{current}/{max} (approaching limit)"))
            },
            LimitCheckResult::Exceeded { current, max } => {
-                Some(format!("{}/{} (exceeded)", current, max))
+                Some(format!("{current}/{max} (exceeded)"))
            },
            LimitCheckResult::TooShort { current, min } => {
-                Some(format!("{}/{} minimum", current, min))
+                Some(format!("{current}/{min} minimum"))
            },
        }
    }
@@ -267,8 +267,7 @@ impl CharacterLimits {
            let count = self.count(text);
            if count > 0 && count < min {
                return Some(format!(
-                    "Field must be empty or have at least {} characters (currently: {})",
-                    min, count
+                    "Field must be empty or have at least {min} characters (currently: {count})"
                ));
            }
        }
--- a/canvas/src/validation/mask.rs
+++ b/canvas/src/validation/mask.rs
@@ -2,9 +2,11 @@
 //! Pure display mask system - user-defined patterns only

 #[derive(Debug, Clone, PartialEq, Eq)]
+#[derive(Default)]
 pub enum MaskDisplayMode {
    /// Only show separators as user types
    /// Example: "" → "", "123" → "123", "12345" → "(123) 45"
+    #[default]
    Dynamic,
    
    /// Show full template with placeholders from start
@@ -15,11 +17,6 @@ pub enum MaskDisplayMode {
    },
 }

-impl Default for MaskDisplayMode {
-    fn default() -> Self {
-        MaskDisplayMode::Dynamic
-    }
-}

 #[derive(Debug, Clone, PartialEq, Eq)]
 pub struct DisplayMask {
--- a/canvas/src/validation/mod.rs
+++ b/canvas/src/validation/mod.rs
@@ -1,6 +1,11 @@
 // src/validation/mod.rs
+//! Validation subsystem re-exports and helpers.
+//!
+//! This module collects validation-related modules (limits, masks, patterns,
+//! formatting, and state) and re-exports the most commonly used types so that
+//! callers can import them from `crate::validation`.

-// Core validation modules
+ // Core validation modules
 pub mod config;
 pub mod limits;
 pub mod state;
--- a/canvas/src/validation/patterns.rs
+++ b/canvas/src/validation/patterns.rs
@@ -49,8 +49,8 @@ impl std::fmt::Debug for CharacterFilter {
            CharacterFilter::Alphabetic => write!(f, "Alphabetic"),
            CharacterFilter::Numeric => write!(f, "Numeric"),
            CharacterFilter::Alphanumeric => write!(f, "Alphanumeric"),
-            CharacterFilter::Exact(ch) => write!(f, "Exact('{}')", ch),
-            CharacterFilter::OneOf(chars) => write!(f, "OneOf({:?})", chars),
+            CharacterFilter::Exact(ch) => write!(f, "Exact('{ch}')"),
+            CharacterFilter::OneOf(chars) => write!(f, "OneOf({chars:?})"),
            CharacterFilter::Custom(_) => write!(f, "Custom(<function>)"),
        }
    }
@@ -130,10 +130,10 @@ impl CharacterFilter {
            CharacterFilter::Alphabetic => "alphabetic characters (a-z, A-Z)".to_string(),
            CharacterFilter::Numeric => "numeric characters (0-9)".to_string(),
            CharacterFilter::Alphanumeric => "alphanumeric characters (a-z, A-Z, 0-9)".to_string(),
-            CharacterFilter::Exact(ch) => format!("exactly '{}'", ch),
+            CharacterFilter::Exact(ch) => format!("exactly '{ch}'"),
            CharacterFilter::OneOf(chars) => {
                let char_list: String = chars.iter().collect();
-                format!("one of: {}", char_list)
+                format!("one of: {char_list}")
            },
            CharacterFilter::Custom(_) => "custom filter".to_string(),
        }
@@ -207,9 +207,7 @@ impl PatternFilters {
    /// Validate entire text against all filters
    pub fn validate_text(&self, text: &str) -> Result<(), String> {
        for (position, character) in text.char_indices() {
-            if let Err(error) = self.validate_char_at_position(position, character) {
-                return Err(error);
-            }
+            self.validate_char_at_position(position, character)?
        }
        Ok(())
    }
--- a/canvas/src/validation/state.rs
+++ b/canvas/src/validation/state.rs
@@ -21,6 +21,8 @@ pub struct ValidationState {

    /// External validation results per field (Feature 5)
    external_results: HashMap<usize, ExternalValidationState>,
+
+    last_switch_block: Option<String>,
 }

 impl ValidationState {
@@ -32,6 +34,7 @@ impl ValidationState {
            validated_fields: std::collections::HashSet::new(),
            enabled: true,
            external_results: HashMap::new(),
+            last_switch_block: None,
        }
    }
    
@@ -256,6 +259,22 @@ impl ValidationState {
            error_fields: errors,
        }
    }
+
+ 
+    /// Set the last switch block reason (for UI convenience)
+    pub fn set_last_switch_block<S: Into<String>>(&mut self, reason: S) {
+        self.last_switch_block = Some(reason.into());
+    }
+    
+    /// Clear the last switch block reason
+    pub fn clear_last_switch_block(&mut self) {
+        self.last_switch_block = None;
+    }
+    
+    /// Get the last switch block reason (if any)
+    pub fn last_switch_block(&self) -> Option<&str> {
+        self.last_switch_block.as_deref()
+    }
 }

 /// Summary of validation state across all fields
--- a/client/Cargo.toml
+++ b/client/Cargo.toml
@@ -8,7 +8,7 @@ license.workspace = true
 anyhow = { workspace = true }
 async-trait = "0.1.88"
 common = { path = "../common" }
-canvas = { path = "../canvas", features = ["gui"] }
+canvas = { path = "../canvas", features = ["gui", "suggestions", "cursor-style", "keymap"] }

 ratatui = { workspace = true }
 crossterm = { workspace = true }
--- a/client/config.toml
+++ b/client/config.toml
@@ -40,7 +40,7 @@ previous_entry = ["left","q"]
 next_entry = ["right","1"]

 enter_highlight_mode = ["v"]
-enter_highlight_mode_linewise = ["ctrl+v"]
+enter_highlight_mode_linewise = ["shift+v"]

 ### AUTOGENERATED CANVAS CONFIG
 # Required
@@ -50,7 +50,7 @@ move_right = ["l", "Right"]
 move_down = ["j", "Down"]
 # Optional
 move_line_end = ["$"]
-# move_word_next = ["w"]
+move_word_next = ["w"]
 next_field = ["Tab"]
 move_word_prev = ["b"]
 move_word_end = ["e"]
@@ -91,23 +91,23 @@ suggestion_up = ["ctrl+p", "shift+tab"]

 ### AUTOGENERATED CANVAS CONFIG
 # Required
-move_right = ["Right", "l"]
+move_right = ["Right"]
 delete_char_backward = ["Backspace"]
 next_field = ["Tab", "Enter"]
-move_up = ["Up", "k"]
-move_down = ["Down", "j"]
+move_up = ["Up"]
+move_down = ["Down"]
 prev_field = ["Shift+Tab"]
-move_left = ["Left", "h"]
+move_left = ["Left"]
 # Optional
-move_last_line = ["Ctrl+End", "G"]
+move_last_line = ["Ctrl+End"]
 delete_char_forward = ["Delete"]
-move_word_prev = ["Ctrl+Left", "b"]
-move_word_end = ["e"]
-move_word_end_prev = ["ge"]
-move_first_line = ["Ctrl+Home", "gg"]
-move_word_next = ["Ctrl+Right", "w"]
-move_line_start = ["Home", "0"]
-move_line_end = ["End", "$"]
+move_word_prev = ["Ctrl+Left"]
+# move_word_end = ["e"]
+# move_word_end_prev = ["ge"]
+move_first_line = ["Ctrl+Home"]
+move_word_next = ["Ctrl+Right"]
+move_line_start = ["Home"]
+move_line_end = ["End"]

 [keybindings.command]
 exit_command_mode = ["ctrl+g", "esc"]
--- a/client/src/components/common/command_line.rs
+++ b/client/src/components/common/command_line.rs
--- a/client/src/components/common/find_file_palette.rs
+++ b/client/src/components/common/find_file_palette.rs
@@ -1,4 +1,4 @@
-// src/components/common/find_file_palette.rs
+// src/bottom_panel/find_file_palette.rs

 use crate::config::colors::themes::Theme;
 use crate::modes::general::command_navigation::NavigationState; // Corrected path
--- a/client/src/bottom_panel/layout.rs
+++ b/client/src/bottom_panel/layout.rs
@@ -0,0 +1,97 @@
+// src/bottom_panel/layout.rs
+
+use ratatui::{layout::Constraint, layout::Rect, Frame};
+use crate::bottom_panel::{status_line::render_status_line, command_line::render_command_line};
+use crate::bottom_panel::find_file_palette;
+use crate::config::colors::themes::Theme;
+use crate::modes::general::command_navigation::NavigationState;
+use crate::state::app::state::AppState;
+
+/// Calculate the layout constraints for the bottom panel (status line + command line/palette).
+pub fn bottom_panel_constraints(
+    app_state: &AppState,
+    navigation_state: &NavigationState,
+    event_handler_command_mode_active: bool,
+) -> Vec<Constraint> {
+    let mut status_line_height = 1;
+    #[cfg(feature = "ui-debug")]
+    {
+        if let Some(debug_state) = &app_state.debug_state {
+            if debug_state.is_error {
+                status_line_height = 4;
+            }
+        }
+    }
+
+    const PALETTE_OPTIONS_HEIGHT_FOR_LAYOUT: u16 = 15;
+    let command_palette_area_height = if navigation_state.active {
+        1 + PALETTE_OPTIONS_HEIGHT_FOR_LAYOUT
+    } else if event_handler_command_mode_active {
+        1
+    } else {
+        0
+    };
+
+    let mut constraints = vec![Constraint::Length(status_line_height)];
+    if command_palette_area_height > 0 {
+        constraints.push(Constraint::Length(command_palette_area_height));
+    }
+    constraints
+}
+
+/// Render the bottom panel (status line + command line/palette).
+pub fn render_bottom_panel(
+    f: &mut Frame,
+    root_chunks: &[Rect],
+    chunk_idx: &mut usize,
+    current_dir: &str,
+    theme: &Theme,
+    is_event_handler_edit_mode: bool,
+    current_fps: f64,
+    app_state: &AppState,
+    navigation_state: &NavigationState,
+    event_handler_command_input: &str,
+    event_handler_command_mode_active: bool,
+    event_handler_command_message: &str,
+) {
+    // --- Status line area ---
+    let status_line_area = root_chunks[*chunk_idx];
+    *chunk_idx += 1;
+
+    // --- Command line / palette area ---
+    let command_render_area = if root_chunks.len() > *chunk_idx {
+        Some(root_chunks[*chunk_idx])
+    } else {
+        None
+    };
+    if command_render_area.is_some() {
+        *chunk_idx += 1;
+    }
+
+    // --- Render status line ---
+    render_status_line(
+        f,
+        status_line_area,
+        current_dir,
+        theme,
+        is_event_handler_edit_mode,
+        current_fps,
+        app_state,
+    );
+
+    // --- Render command line or palette ---
+    if let Some(area) = command_render_area {
+        if navigation_state.active {
+            find_file_palette::render_find_file_palette(f, area, theme, navigation_state);
+        } else if event_handler_command_mode_active {
+            render_command_line(
+                f,
+                area,
+                event_handler_command_input,
+                true,
+                theme,
+                event_handler_command_message,
+            );
+        }
+    }
+}
--- a/client/src/bottom_panel/mod.rs
+++ b/client/src/bottom_panel/mod.rs
@@ -0,0 +1,6 @@
+// src/bottom_panel/mod.rs
+
+pub mod status_line; 
+pub mod command_line;
+pub mod layout;
+pub mod find_file_palette;
--- a/client/src/components/common/status_line.rs
+++ b/client/src/components/common/status_line.rs
@@ -5,10 +5,9 @@ use ratatui::{
    layout::Rect,
    style::Style,
    text::{Line, Span, Text},
-    widgets::Paragraph,
+    widgets::{Paragraph, Wrap},
    Frame,
 };
-use ratatui::widgets::Wrap;
 use std::path::Path;
 use unicode_width::UnicodeWidthStr;

--- a/client/src/functions/common/buffer.rs
+++ b/client/src/functions/common/buffer.rs
@@ -1,7 +1,7 @@
-// src/functions/common/buffer.rs
+// src/buffer/functions/buffer.rs

-use crate::state::app::buffer::BufferState;
-use crate::state::app::buffer::AppView;
+use crate::buffer::state::BufferState;
+use crate::buffer::state::AppView;

 pub fn get_view_layer(view: &AppView) -> u8 {
    match view {
--- a/client/src/buffer/logic.rs
+++ b/client/src/buffer/logic.rs
@@ -0,0 +1,20 @@
+// src/buffer/logic.rs
+use crossterm::event::{KeyCode, KeyModifiers};
+use crate::config::binds::config::Config;
+use crate::state::app::state::UiState;
+
+/// Toggle the buffer list visibility based on keybindings.
+pub fn toggle_buffer_list(
+    ui_state: &mut UiState,
+    config: &Config,
+    key: KeyCode,
+    modifiers: KeyModifiers,
+) -> bool {
+    if let Some(action) = config.get_common_action(key, modifiers) {
+        if action == "toggle_buffer_list" {
+            ui_state.show_buffer_list = !ui_state.show_buffer_list;
+            return true;
+        }
+    }
+    false
+}
--- a/client/src/buffer/mod.rs
+++ b/client/src/buffer/mod.rs
@@ -0,0 +1,11 @@
+// src/buffer/mod.rs
+
+pub mod state;
+pub mod functions;
+pub mod ui;
+pub mod logic;
+
+pub use state::{AppView, BufferState};
+pub use functions::*;
+pub use ui::render_buffer_list;
+pub use logic::toggle_buffer_list;
--- a/client/src/state/app/buffer.rs
+++ b/client/src/state/app/buffer.rs
@@ -1,4 +1,4 @@
-// src/state/app/buffer.rs
+// src/buffer/state/buffer.rs

 #[derive(Debug, Clone, PartialEq, Eq)]
 pub enum AppView {
--- a/client/src/components/handlers/buffer_list.rs
+++ b/client/src/components/handlers/buffer_list.rs
@@ -1,7 +1,7 @@
-// src/components/handlers/buffer_list.rs
+// src/buffer/ui.rs

 use crate::config::colors::themes::Theme;
-use crate::state::app::buffer::BufferState;
+use crate::buffer::state::BufferState;
 use crate::state::app::state::AppState;  // Add this import
 use ratatui::{
    layout::{Alignment, Rect},
@@ -11,7 +11,7 @@ use ratatui::{
    Frame,
 };
 use unicode_width::UnicodeWidthStr;
-use crate::functions::common::buffer::get_view_layer;
+use crate::buffer::functions::get_view_layer;

 pub fn render_buffer_list(
    f: &mut Frame,
--- a/client/src/components/admin/add_logic.rs
+++ b/client/src/components/admin/add_logic.rs
@@ -1,9 +1,8 @@
 // src/components/admin/add_logic.rs
 use crate::config::colors::themes::Theme;
-use crate::state::app::highlight::HighlightState;
 use crate::state::app::state::AppState;
 use crate::state::pages::add_logic::{AddLogicFocus, AddLogicState};
-use canvas::canvas::{render_canvas, CanvasState, HighlightState as CanvasHighlightState}; // Use canvas library
+use canvas::{render_canvas, FormEditor};
 use ratatui::{
    layout::{Alignment, Constraint, Direction, Layout, Rect},
    style::{Modifier, Style},
@@ -11,18 +10,10 @@ use ratatui::{
    widgets::{Block, BorderType, Borders, Paragraph},
    Frame,
 };
-use crate::components::common::{dialog, autocomplete}; // Added autocomplete
+use crate::components::common::autocomplete;
+use crate::dialog;
 use crate::config::binds::config::EditorKeybindingMode;

-// Helper function to convert between HighlightState types
-fn convert_highlight_state(local: &HighlightState) -> CanvasHighlightState {
-    match local {
-        HighlightState::Off => CanvasHighlightState::Off,
-        HighlightState::Characterwise { anchor } => CanvasHighlightState::Characterwise { anchor: *anchor },
-        HighlightState::Linewise { anchor_line } => CanvasHighlightState::Linewise { anchor_line: *anchor_line },
-    }
-}
-
 pub fn render_add_logic(
    f: &mut Frame,
    area: Rect,
@@ -30,7 +21,6 @@ pub fn render_add_logic(
    app_state: &AppState,
    add_logic_state: &mut AddLogicState,
    is_edit_mode: bool,
-    highlight_state: &HighlightState,
 ) {
    let main_block = Block::default()
        .title(" Add New Logic Script ")
@@ -168,19 +158,12 @@ pub fn render_add_logic(
            | AddLogicFocus::InputDescription
    );

-    let canvas_highlight_state = convert_highlight_state(highlight_state);
-    let active_field_rect = render_canvas(
-        f,
-        canvas_area,
-        add_logic_state,        // AddLogicState implements CanvasState
-        theme,                  // Theme implements CanvasTheme
-        is_edit_mode && focus_on_canvas_inputs,
-        &canvas_highlight_state,
-    );
+    let editor = FormEditor::new(add_logic_state.clone());
+    let active_field_rect = render_canvas(f, canvas_area, &editor, theme);

    // --- Render Autocomplete for Target Column ---
    // `is_edit_mode` here refers to the general edit mode of the EventHandler
-    if is_edit_mode && add_logic_state.current_field() == 1 { // Target Column field
+    if is_edit_mode && editor.current_field() == 1 { // Target Column field
        if add_logic_state.in_target_column_suggestion_mode && add_logic_state.show_target_column_suggestions {
            if !add_logic_state.target_column_suggestions.is_empty() {
                if let Some(input_rect) = active_field_rect {
--- a/client/src/components/admin/add_table.rs
+++ b/client/src/components/admin/add_table.rs
@@ -1,9 +1,8 @@
 // src/components/admin/add_table.rs
 use crate::config::colors::themes::Theme;
-use crate::state::app::highlight::HighlightState;
 use crate::state::app::state::AppState;
 use crate::state::pages::add_table::{AddTableFocus, AddTableState};
-use canvas::canvas::{render_canvas, CanvasState, HighlightState as CanvasHighlightState};
+use canvas::{render_canvas, FormEditor};
 use ratatui::{
    layout::{Alignment, Constraint, Direction, Layout, Rect},
    style::{Modifier, Style},
@@ -11,16 +10,7 @@ use ratatui::{
    widgets::{Block, BorderType, Borders, Cell, Paragraph, Row, Table},
    Frame,
 };
-use crate::components::common::dialog;
-
-// Helper function to convert between HighlightState types
-fn convert_highlight_state(local: &HighlightState) -> CanvasHighlightState {
-    match local {
-        HighlightState::Off => CanvasHighlightState::Off,
-        HighlightState::Characterwise { anchor } => CanvasHighlightState::Characterwise { anchor: *anchor },
-        HighlightState::Linewise { anchor_line } => CanvasHighlightState::Linewise { anchor_line: *anchor_line },
-    }
-}
+use crate::dialog;

 /// Renders the Add New Table page layout, structuring the display of table information,
 /// input fields, and action buttons. Adapts layout based on terminal width.
@@ -31,7 +21,6 @@ pub fn render_add_table(
    app_state: &AppState,
    add_table_state: &mut AddTableState,
    is_edit_mode: bool, // Determines if canvas inputs are in edit mode
-    highlight_state: &HighlightState, // For text highlighting in canvas
 ) {
    // --- Configuration ---
    // Threshold width to switch between wide and narrow layouts
@@ -357,15 +346,8 @@ pub fn render_add_table(
    );

    // --- Canvas Rendering (Column Definition Input) - USING CANVAS LIBRARY ---
-    let canvas_highlight_state = convert_highlight_state(highlight_state);
-    let _active_field_rect = render_canvas(
-        f,
-        canvas_area,
-        add_table_state,        // AddTableState implements CanvasState
-        theme,                  // Theme implements CanvasTheme
-        is_edit_mode && focus_on_canvas_inputs,
-        &canvas_highlight_state,
-    );
+    let editor = FormEditor::new(add_table_state.clone());
+    let _active_field_rect = render_canvas(f, canvas_area, &editor, theme);

    // --- Button Style Helpers ---
    let get_button_style = |button_focus: AddTableFocus, current_focus| {
--- a/client/src/components/auth.rs
+++ b/client/src/components/auth.rs
@@ -1,6 +0,0 @@
-// src/components/form.rs
-pub mod login;
-pub mod register;
-
-pub use login::*;
-pub use register::*;
--- a/client/src/components/common.rs
+++ b/client/src/components/common.rs
@@ -1,18 +1,9 @@
 // src/components/common.rs
-pub mod command_line;
-pub mod status_line;
+
 pub mod text_editor;
 pub mod background;
-pub mod dialog;
 pub mod autocomplete;
-pub mod search_palette;
-pub mod find_file_palette;

-pub use command_line::*;
-pub use status_line::*;
 pub use text_editor::*;
 pub use background::*;
-pub use dialog::*;
 pub use autocomplete::*;
-pub use search_palette::*;
-pub use find_file_palette::*;
--- a/client/src/components/common/autocomplete.rs
+++ b/client/src/components/common/autocomplete.rs
@@ -1,8 +1,8 @@
 // src/components/common/autocomplete.rs

 use crate::config::colors::themes::Theme;
-use crate::state::pages::form::FormState;
 use common::proto::komp_ac::search::search_response::Hit;
+use crate::pages::forms::FormState;
 use ratatui::{
    layout::Rect,
    style::{Color, Modifier, Style},
--- a/client/src/components/form.rs
+++ b/client/src/components/form.rs
@@ -1,4 +0,0 @@
-// src/components/form.rs
-pub mod form;
-
-pub use form::*;
--- a/client/src/components/handlers.rs
+++ b/client/src/components/handlers.rs
@@ -1,6 +0,0 @@
-// src/components/handlers.rs
-pub mod sidebar;
-pub mod buffer_list;
-
-pub use sidebar::*;
-pub use buffer_list::*;
--- a/client/src/components/intro.rs
+++ b/client/src/components/intro.rs
@@ -1,4 +0,0 @@
-// src/components/intro.rs
-pub mod intro;
-
-pub use intro::*;
--- a/client/src/components/mod.rs
+++ b/client/src/components/mod.rs
@@ -1,16 +1,9 @@
 // src/components/mod.rs
-pub mod handlers;
-pub mod intro;
+
 pub mod admin;
 pub mod common;
-pub mod form;
-pub mod auth;
 pub mod utils;

-pub use handlers::*;
-pub use intro::*;
 pub use admin::*;
 pub use common::*;
-pub use form::*;
-pub use auth::*;
 pub use utils::*;
--- a/client/src/config/binds/config.rs
+++ b/client/src/config/binds/config.rs
@@ -5,6 +5,7 @@ use std::collections::HashMap;
 use std::path::Path;
 use anyhow::{Context, Result};
 use crossterm::event::{KeyCode, KeyModifiers};
+use canvas::CanvasKeyMap;

 // NEW: Editor Keybinding Mode Enum
 #[derive(Debug, Clone, Serialize, Deserialize, PartialEq, Eq)]
@@ -760,4 +761,43 @@ impl Config {
        }
        false
    }
+
+    /// Unified action resolver for app-level actions
+    pub fn get_app_action(
+        &self,
+        key_code: crossterm::event::KeyCode,
+        modifiers: crossterm::event::KeyModifiers,
+    ) -> Option<&str> {
+        // First check common actions
+        if let Some(action) = self.get_common_action(key_code, modifiers) {
+            return Some(action);
+        }
+
+        // Then check read-only mode actions
+        if let Some(action) = self.get_read_only_action_for_key(key_code, modifiers) {
+            return Some(action);
+        }
+
+        // Then check highlight mode actions
+        if let Some(action) = self.get_highlight_action_for_key(key_code, modifiers) {
+            return Some(action);
+        }
+
+        // Then check edit mode actions
+        if let Some(action) = self.get_edit_action_for_key(key_code, modifiers) {
+            return Some(action);
+        }
+
+        None
+    }
+
+    pub fn build_canvas_keymap(&self) -> CanvasKeyMap {
+        CanvasKeyMap::from_mode_maps(
+            &self.keybindings.read_only,
+            &self.keybindings.edit,
+            &self.keybindings.highlight,
+        )
+    }
 }
+
+
--- a/client/src/config/colors/themes.rs
+++ b/client/src/config/colors/themes.rs
@@ -1,6 +1,6 @@
 // src/config/colors/themes.rs
 use ratatui::style::Color;
-use canvas::canvas::CanvasTheme;
+use canvas::CanvasTheme;

 #[derive(Debug, Clone)]
 pub struct Theme {
@@ -12,7 +12,7 @@ pub struct Theme {
    pub warning: Color,
    pub border: Color,
    pub highlight_bg: Color,
-    pub inactive_highlight_bg: Color,// admin panel no idea what it really is
+    pub inactive_highlight_bg: Color, // admin panel no idea what it really is
 }

 impl Theme {
@@ -108,4 +108,9 @@ impl CanvasTheme for Theme {
    fn warning(&self) -> Color {
        self.warning
    }
+
+    fn suggestion_gray(&self) -> Color {
+        // Neutral gray for suggestions
+        Color::Rgb(128, 128, 128)
+    }
 }
--- a/client/src/dialog/functions.rs
+++ b/client/src/dialog/functions.rs
@@ -0,0 +1,85 @@
+// src/dialog/functions.rs
+
+use crate::dialog::DialogState;
+use crate::state::app::state::AppState;
+use crate::ui::handlers::context::DialogPurpose;
+
+impl AppState {
+    pub fn show_dialog(
+        &mut self,
+        title: &str,
+        message: &str,
+        buttons: Vec<String>,
+        purpose: DialogPurpose,
+    ) {
+        self.ui.dialog.dialog_title = title.to_string();
+        self.ui.dialog.dialog_message = message.to_string();
+        self.ui.dialog.dialog_buttons = buttons;
+        self.ui.dialog.dialog_active_button_index = 0;
+        self.ui.dialog.purpose = Some(purpose);
+        self.ui.dialog.is_loading = false;
+        self.ui.dialog.dialog_show = true;
+        self.ui.focus_outside_canvas = true;
+    }
+
+    pub fn show_loading_dialog(&mut self, title: &str, message: &str) {
+        self.ui.dialog.dialog_title = title.to_string();
+        self.ui.dialog.dialog_message = message.to_string();
+        self.ui.dialog.dialog_buttons.clear();
+        self.ui.dialog.dialog_active_button_index = 0;
+        self.ui.dialog.purpose = None;
+        self.ui.dialog.is_loading = true;
+        self.ui.dialog.dialog_show = true;
+        self.ui.focus_outside_canvas = true;
+    }
+
+    pub fn update_dialog_content(
+        &mut self,
+        message: &str,
+        buttons: Vec<String>,
+        purpose: DialogPurpose,
+    ) {
+        if self.ui.dialog.dialog_show {
+            self.ui.dialog.dialog_message = message.to_string();
+            self.ui.dialog.dialog_buttons = buttons;
+            self.ui.dialog.dialog_active_button_index = 0;
+            self.ui.dialog.purpose = Some(purpose);
+            self.ui.dialog.is_loading = false;
+        }
+    }
+
+    pub fn hide_dialog(&mut self) {
+        self.ui.dialog.dialog_show = false;
+        self.ui.dialog.dialog_title.clear();
+        self.ui.dialog.dialog_message.clear();
+        self.ui.dialog.dialog_buttons.clear();
+        self.ui.dialog.dialog_active_button_index = 0;
+        self.ui.dialog.purpose = None;
+        self.ui.focus_outside_canvas = false;
+        self.ui.dialog.is_loading = false;
+    }
+
+    pub fn next_dialog_button(&mut self) {
+        if !self.ui.dialog.dialog_buttons.is_empty() {
+            let next_index = (self.ui.dialog.dialog_active_button_index + 1)
+                % self.ui.dialog.dialog_buttons.len();
+            self.ui.dialog.dialog_active_button_index = next_index;
+        }
+    }
+
+    pub fn previous_dialog_button(&mut self) {
+        if !self.ui.dialog.dialog_buttons.is_empty() {
+            let len = self.ui.dialog.dialog_buttons.len();
+            let prev_index =
+                (self.ui.dialog.dialog_active_button_index + len - 1) % len;
+            self.ui.dialog.dialog_active_button_index = prev_index;
+        }
+    }
+
+    pub fn get_active_dialog_button_label(&self) -> Option<&str> {
+        self.ui.dialog
+            .dialog_buttons
+            .get(self.ui.dialog.dialog_active_button_index)
+            .map(|s| s.as_str())
+    }
+}
--- a/client/src/dialog/logic.rs
+++ b/client/src/dialog/logic.rs
@@ -0,0 +1,207 @@
+// src/dialog/logic.rs
+
+// TODO(dialog-refactor):
+// Currently this module (`handle_dialog_event`) contains page-specific logic
+// (e.g. Login, Register, Admin, SaveTable). This couples the dialog crate
+// to application pages and business logic.
+//
+// Refactor plan:
+// 1. Keep dialog generic: only handle navigation (next/prev/select) and return
+//    a `DialogResult` (Dismissed | Selected { purpose, index }).
+// 2. Move all page-specific actions (e.g. login::back_to_main, register::back_to_login,
+//    handle_delete_selected_columns, buffer_state.update_history) into the
+//    respective page or event handler (e.g. modes/handlers/event.rs).
+// 3. Dialog crate should only provide state, rendering, and generic navigation.
+//    Pages decide what to do when a dialog button is pressed.
+
+use crossterm::event::{Event, KeyCode};
+use crate::config::binds::config::Config;
+use crate::ui::handlers::context::DialogPurpose;
+use crate::state::app::state::AppState;
+use crate::buffer::AppView;
+use crate::buffer::state::BufferState;
+use crate::modes::handlers::event::EventOutcome;
+use crate::pages::register;
+use crate::pages::login;
+use crate::tui::functions::common::add_table::handle_delete_selected_columns;
+use crate::pages::routing::{Router, Page};
+use anyhow::Result;
+
+/// Handles key events specifically when a dialog is active.
+/// Returns Some(Result<EventOutcome, Error>) if the event was handled (consumed),
+/// otherwise returns None.
+pub async fn handle_dialog_event(
+    event: &Event,
+    config: &Config,
+    app_state: &mut AppState,
+    buffer_state: &mut BufferState,
+    router: &mut Router,
+) -> Option<Result<EventOutcome>> {
+    if let Event::Key(key) = event {
+        // Always allow Esc to dismiss
+        if key.code == KeyCode::Esc {
+            app_state.hide_dialog();
+            return Some(Ok(EventOutcome::Ok("Dialog dismissed".to_string())));
+        }
+
+        // Check general bindings for dialog actions
+        if let Some(action) = config.get_general_action(key.code, key.modifiers) {
+            match action {
+                "move_down" | "next_option" => {
+                    let current_index = app_state.ui.dialog.dialog_active_button_index;
+                    let num_buttons = app_state.ui.dialog.dialog_buttons.len();
+                    if num_buttons > 0 && current_index < num_buttons - 1 {
+                        app_state.ui.dialog.dialog_active_button_index += 1;
+                    }
+                    return Some(Ok(EventOutcome::Ok(String::new())));
+                }
+                "move_up" | "previous_option" => {
+                    let current_index = app_state.ui.dialog.dialog_active_button_index;
+                    if current_index > 0 {
+                        app_state.ui.dialog.dialog_active_button_index -= 1;
+                    }
+                    return Some(Ok(EventOutcome::Ok(String::new())));
+                }
+                "select" => {
+                    let selected_index = app_state.ui.dialog.dialog_active_button_index;
+                    let purpose = match app_state.ui.dialog.purpose {
+                        Some(p) => p,
+                        None => {
+                            app_state.hide_dialog();
+                            return Some(Ok(EventOutcome::Ok(
+                                "Internal Error: Dialog context lost".to_string(),
+                            )));
+                        }
+                    };
+
+                    // Handle Dialog Actions Directly Here
+                    match purpose {
+                        DialogPurpose::LoginSuccess => match selected_index {
+                            0 => {
+                                // "Menu" button selected
+                                app_state.hide_dialog();
+                                if let Page::Login(state) = &mut router.current {
+                                    let message =
+                                        login::back_to_main(state, app_state, buffer_state).await;
+                                    return Some(Ok(EventOutcome::Ok(message)));
+                                }
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Login state not active".to_string(),
+                                )));
+                            }
+                            1 => {
+                                app_state.hide_dialog();
+                                return Some(Ok(EventOutcome::Ok("Exiting dialog".to_string())));
+                            }
+                            _ => {
+                                app_state.hide_dialog();
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Unknown dialog button selected".to_string(),
+                                )));
+                            }
+                        },
+                        DialogPurpose::LoginFailed => match selected_index {
+                            0 => {
+                                // "OK" button selected
+                                app_state.hide_dialog();
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Login failed dialog dismissed".to_string(),
+                                )));
+                            }
+                            _ => {
+                                app_state.hide_dialog();
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Unknown dialog button selected".to_string(),
+                                )));
+                            }
+                        },
+                        DialogPurpose::RegisterSuccess => match selected_index {
+                            0 => {
+                                // "OK" button for RegisterSuccess
+                                app_state.hide_dialog();
+                                if let Page::Register(state) = &mut router.current {
+                                    let message =
+                                        register::back_to_login(state, app_state, buffer_state)
+                                            .await;
+                                    return Some(Ok(EventOutcome::Ok(message)));
+                                }
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Register state not active".to_string(),
+                                )));
+                            }
+                            _ => {
+                                app_state.hide_dialog();
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Unknown dialog button selected".to_string(),
+                                )));
+                            }
+                        },
+                        DialogPurpose::RegisterFailed => match selected_index {
+                            0 => {
+                                // "OK" button for RegisterFailed
+                                app_state.hide_dialog(); // Just dismiss
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Register failed dialog dismissed".to_string(),
+                                )));
+                            }
+                            _ => {
+                                app_state.hide_dialog();
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Unknown dialog button selected".to_string(),
+                                )));
+                            }
+                        },
+                        DialogPurpose::ConfirmDeleteColumns => match selected_index {
+                            0 => {
+                                // "Confirm" button selected
+                                if let Page::Admin(state) = &mut router.current {
+                                    let outcome_message =
+                                        handle_delete_selected_columns(&mut state.add_table_state);
+                                    app_state.hide_dialog();
+                                    return Some(Ok(EventOutcome::Ok(outcome_message)));
+                                }
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Admin state not active".to_string(),
+                                )));
+                            }
+                            1 => {
+                                // "Cancel" button selected
+                                app_state.hide_dialog();
+                                return Some(Ok(EventOutcome::Ok("Deletion cancelled.".to_string())));
+                            }
+                            _ => { /* Handle unexpected index */ }
+                        },
+                        DialogPurpose::SaveTableSuccess => match selected_index {
+                            0 => {
+                                // "OK" button selected
+                                app_state.hide_dialog();
+                                buffer_state.update_history(AppView::Admin); // Navigate back
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Save success dialog dismissed.".to_string(),
+                                )));
+                            }
+                            _ => { /* Handle unexpected index */ }
+                        },
+                        DialogPurpose::SaveLogicSuccess => match selected_index {
+                            0 => {
+                                // "OK" button selected
+                                app_state.hide_dialog();
+                                buffer_state.update_history(AppView::Admin);
+                                return Some(Ok(EventOutcome::Ok(
+                                    "Save success dialog dismissed.".to_string(),
+                                )));
+                            }
+                            _ => { /* Handle unexpected index */ }
+                        },
+                    }
+                }
+                _ => {} // Ignore other general actions when dialog is shown
+            }
+        }
+        // If it was a key event but not handled above, consume it
+        Some(Ok(EventOutcome::Ok(String::new())))
+    } else {
+        // If it wasn't a key event, consume it too while dialog is active
+        Some(Ok(EventOutcome::Ok(String::new())))
+    }
+}
--- a/client/src/dialog/mod.rs
+++ b/client/src/dialog/mod.rs
@@ -0,0 +1,10 @@
+// src/dialog/mod.rs
+
+pub mod ui;
+pub mod logic;
+pub mod state;
+pub mod functions;
+
+pub use ui::render_dialog;
+pub use logic::handle_dialog_event;
+pub use state::DialogState;
--- a/client/src/dialog/state.rs
+++ b/client/src/dialog/state.rs
@@ -0,0 +1,26 @@
+// src/dialog/state.rs
+use crate::ui::handlers::context::DialogPurpose;
+
+pub struct DialogState {
+    pub dialog_show: bool,
+    pub dialog_title: String,
+    pub dialog_message: String,
+    pub dialog_buttons: Vec<String>,
+    pub dialog_active_button_index: usize,
+    pub purpose: Option<DialogPurpose>,
+    pub is_loading: bool,
+}
+
+impl Default for DialogState {
+    fn default() -> Self {
+        Self {
+            dialog_show: false,
+            dialog_title: String::new(),
+            dialog_message: String::new(),
+            dialog_buttons: Vec::new(),
+            dialog_active_button_index: 0,
+            purpose: None,
+            is_loading: false,
+        }
+    }
+}
--- a/client/src/components/common/dialog.rs
+++ b/client/src/components/common/dialog.rs
@@ -1,3 +1,5 @@
+// src/dialog/ui.rs
+
 use crate::config::colors::themes::Theme;
 use ratatui::{
    layout::{Constraint, Direction, Layout, Margin, Rect},
--- a/client/src/functions/common.rs
+++ b/client/src/functions/common.rs
@@ -1,5 +0,0 @@
-// src/functions/common.rs
-
-pub mod buffer;
-
-pub use buffer::*;
--- a/client/src/functions/mod.rs
+++ b/client/src/functions/mod.rs
@@ -1,6 +1,5 @@
 // src/functions/mod.rs

-pub mod common;
 pub mod modes;

 pub use modes::*;
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
filipriec	88a4b2d69c	intro is now separated	2025-08-23 21:58:29 +02:00
filipriec	e6072d25c5	register is now separated also	2025-08-23 21:47:18 +02:00
filipriec	fc2b65601e	login function moved	2025-08-23 21:05:02 +02:00
filipriec	597bdde7e1	login moved to the pages	2025-08-23 20:58:12 +02:00
filipriec	f56092e86c	login page now in a separate dir	2025-08-23 19:48:23 +02:00
filipriec	d5cfe59f47	dialog refactor comment, dialog crate finished for now	2025-08-23 13:36:46 +02:00
filipriec	f281eaa662	dialog is a feature	2025-08-23 13:29:28 +02:00
Priec	cbb3ed7c48	small cleanup	2025-08-23 00:22:07 +02:00
Priec	41a0b85376	forms page moved more2	2025-08-23 00:16:07 +02:00
Priec	b5a31ee81c	forms page	2025-08-22 23:54:22 +02:00
Priec	dceb031822	removed docs book from git history	2025-08-22 23:31:08 +02:00
Priec	78bc9fc432	router4 compiled	2025-08-22 23:27:32 +02:00
Priec	b9072e4d7c	router2, needs bug fixes3	2025-08-22 22:57:28 +02:00
Priec	5d97e63f93	router2, needs bug fixes	2025-08-22 22:52:20 +02:00
Priec	957f5bf9f0	router implementation	2025-08-22 22:19:59 +02:00
Priec	6833ac5fad	find palette in the bottom panel	2025-08-22 17:11:52 +02:00
Priec	3dff2ced6c	bottom panel moved	2025-08-22 16:48:25 +02:00
Priec	ea7ff3796f	search grpc client isolated a bit mode	2025-08-22 16:09:16 +02:00
Priec	310617d62b	cargo fix	2025-08-22 15:49:33 +02:00
Priec	1d94e82f4b	search	2025-08-22 15:48:30 +02:00
Priec	00dad5d673	fixed buffer logic	2025-08-22 14:26:58 +02:00
Priec	414c6957e7	sidebar as a feature	2025-08-22 14:11:36 +02:00
Priec	f127298e5a	buffer as a feature	2025-08-22 13:47:34 +02:00
Priec	f49899e66d	general movement now works	2025-08-22 11:23:11 +02:00
Priec	5717c88857	proper config.toml	2025-08-22 10:55:37 +02:00
Priec	ae8aa16208	working entering to the edit mode	2025-08-22 09:56:55 +02:00
Priec	4ed8e7b421	fixed form state removed, but not won, aint working yet	2025-08-22 00:27:23 +02:00
Priec	3dd6808ea2	now no need for init_form_editor everywhere	2025-08-21 21:16:59 +02:00
Priec	f2b426851b	compiled still not working	2025-08-21 13:23:21 +02:00
Priec	f9e0833bcf	working keymap	2025-08-21 12:32:36 +02:00
Priec	11b073c2fd	removing highlightmode from the app, handled by the library now	2025-08-21 10:33:52 +02:00
Priec	1320884409	more improvements	2025-08-20 23:52:14 +02:00
filipriec	aea2c39215	reverted core actions in canvas	2025-08-20 16:33:19 +02:00
filipriec	4c2464ab30	compiled	2025-08-20 16:28:31 +02:00
filipriec	26053a5fd8	fixes 9	2025-08-20 11:36:56 +02:00
filipriec	589220a2ba	fixing 8	2025-08-20 11:33:34 +02:00
filipriec	2cda54633f	not working, needs more fixes	2025-08-19 22:14:43 +02:00
filipriec	3eea6b9e88	fixes 7	2025-08-19 22:02:00 +02:00
filipriec	db9bb7e168	fixes 5	2025-08-19 20:05:18 +02:00
filipriec	3ccd094a22	fixing problems more6	2025-08-19 19:21:02 +02:00
filipriec	032f21edaa	more canvas implementation4	2025-08-19 14:43:10 +02:00
Priec	42eb087363	canvas fixes3	2025-08-19 13:25:10 +02:00
Priec	d0ff449e3b	going into a new canvas library structure	2025-08-19 13:24:48 +02:00
Priec	858f5137d8	migrating to the new canvas library	2025-08-19 10:56:54 +02:00
Priec	80d5dd0761	forgotten cargo	2025-08-19 01:15:16 +02:00
Priec	49b31c6e92	readme updated	2025-08-19 01:12:59 +02:00
Priec	8ed2fbbe34	more warnings cleared	2025-08-19 01:04:40 +02:00
Priec	5ae8d13719	clippy improvements	2025-08-19 01:03:28 +02:00
Priec	7bf2b81229	syntax highlighting example is now fine	2025-08-19 00:58:21 +02:00
Priec	0215f2824a	working syntax highlighting	2025-08-19 00:51:57 +02:00
Priec	3fdb7e4e37	syntec, but not compiling	2025-08-19 00:46:11 +02:00
Priec	a3f578ebac	using ropey for textarea	2025-08-19 00:03:04 +02:00
Priec	f0bc7abaad	closer to prod more than ever	2025-08-18 22:52:08 +02:00
Priec	f9d9231d50	more prod ready comments	2025-08-18 21:10:06 +02:00
Priec	465db82bd9	prod comments in the codebase	2025-08-18 21:00:14 +02:00
Priec	885a48bdd8	more clippy fixes	2025-08-18 19:49:08 +02:00
Priec	c915b3287b	cargo clippy ran	2025-08-18 19:42:31 +02:00
Priec	7b2f021509	bugs fixed	2025-08-18 19:23:10 +02:00
Priec	5f1bdfefca	fixing warnings	2025-08-18 18:01:22 +02:00
Priec	3273a43e20	restored grayed out suggestions	2025-08-18 17:39:25 +02:00
Priec	61e439a1d4	fixing warnings and depracated legacy things	2025-08-18 17:19:21 +02:00
Priec	03808a8b3b	now finally end line working as intended	2025-08-18 16:59:38 +02:00
Priec	57aa0ed8e3	trying to fix end line bugs	2025-08-18 16:45:49 +02:00
Priec	5efee3f044	line wrapping is now working properly well	2025-08-18 09:44:53 +02:00
Priec	6588f310f2	end of the line fixed	2025-08-18 00:22:09 +02:00
Priec	25b54afff4	improved textarea normal editor mode, not just vim	2025-08-17 18:35:51 +02:00
Priec	b9a7f9a03f	textarea	2025-08-17 17:52:40 +02:00
Priec	e36324af6f	working textarea with example, time to prepare it for the future implementations	2025-08-17 12:17:46 +02:00
Priec	60cb45dcca	first textarea implementation	2025-08-17 11:01:38 +02:00
Priec	215be3cf09	renamed capital lettered functions and fixed examples	2025-08-16 23:10:50 +02:00
Priec	b2aa966588	suggestions behind features flag only	2025-08-15 00:06:54 +02:00
Priec	67512ac151	src/editor.rs doesnt exist anymore	2025-08-15 00:06:19 +02:00
Priec	3f5dedbd6e	a bit of a cleanup, updated functionality of ge now working porperly well	2025-08-14 14:23:08 +02:00
Priec	ce07105eea	more vim functionality added	2025-08-14 00:08:18 +02:00
Priec	587470c48b	vim like behaviour is being built	2025-08-13 22:16:28 +02:00
Priec	3227d341ed	cleared codebase	2025-08-13 01:22:50 +02:00
Priec	2b16a80ef8	removed silenced variables	2025-08-12 09:53:24 +02:00
Priec	8b742bbe09	comments for reimplementation of autotrigger	2025-08-11 23:08:57 +02:00
Priec	189d3d2fc5	suggestions2 only on tab trigger and not automatic	2025-08-11 23:05:56 +02:00
Priec	082093ea17	compiled examples	2025-08-11 22:50:28 +02:00
Priec	280f314100	fixing examples	2025-08-11 12:41:42 +02:00
Priec	163a6262c8	proper example is being set	2025-08-11 12:03:56 +02:00
Priec	e8a564aed3	sugggestions are agnostic	2025-08-11 00:01:53 +02:00
filipriec	53464dfcbf	switch handled by the library from now on	2025-08-10 22:07:25 +02:00
filipriec	b364a6606d	fixing more code refactorization	2025-08-10 16:10:45 +02:00
Priec	f09e476bb6	working, restored	2025-08-10 12:20:43 +02:00
Priec	e2c9cc4347	WIP: staged changes before destructive reset	2025-08-10 11:03:31 +02:00
Priec	06106dc31b	improvements done by gpt5	2025-08-08 23:10:23 +02:00