HIGHLIGHT MODE

client/src/components/auth/login.rs

@@ -20,6 +20,8 @@ pub fn render_login(
     login_state: &LoginState,
     app_state: &AppState,
     is_edit_mode: bool,
+    is_highlight_mode: bool,
+    highlight_anchor: Option<(usize, usize)>,
 ) {
     // Main container
     let block = Block::default()
@@ -56,6 +58,8 @@ pub fn render_login(
         &[&login_state.username, &login_state.password],
         theme,
         is_edit_mode,
+        is_highlight_mode,
+        highlight_anchor,
     );
 
     // --- ERROR MESSAGE ---

client/src/components/auth/register.rs

@@ -22,6 +22,8 @@ pub fn render_register(
     state: &RegisterState, // Use RegisterState
     app_state: &AppState,
     is_edit_mode: bool,
+    is_highlight_mode: bool,
+    highlight_anchor: Option<(usize, usize)>,
 ) {
     let block = Block::default()
         .borders(Borders::ALL)
@@ -64,6 +66,8 @@ pub fn render_register(
         &state.inputs().iter().map(|s| *s).collect::<Vec<&String>>(), // Pass inputs directly
         theme,
         is_edit_mode,
+        is_highlight_mode,
+        highlight_anchor,
     );
 
     // --- HELP TEXT ---

client/src/components/form/form.rs

@@ -18,6 +18,8 @@ pub fn render_form(
     inputs: &[&String],
     theme: &Theme,
     is_edit_mode: bool,
+    is_highlight_mode: bool,
+    highlight_anchor: Option<(usize, usize)>,
     total_count: u64,
     current_position: u64,
 ) {
@@ -62,5 +64,7 @@ pub fn render_form(
         inputs,
         theme,
         is_edit_mode,
+        is_highlight_mode,
+        highlight_anchor,
     );
 }

client/src/components/handlers/canvas.rs

@@ -2,7 +2,7 @@
 use ratatui::{
     widgets::{Paragraph, Block, Borders},
     layout::{Layout, Constraint, Direction, Rect},
-    style::Style,
+    style::{Style, Modifier},
     text::{Line, Span},
     Frame,
     prelude::Alignment,
@@ -19,6 +19,8 @@ pub fn render_canvas(
     inputs: &[&String],
     theme: &Theme,
     is_edit_mode: bool,
+    is_highlight_mode: bool,
+    highlight_anchor: Option<(usize, usize)>,
 ) -> Option<Rect> {
     // Split area into columns
     let columns = Layout::default()
@@ -75,19 +77,54 @@ pub fn render_canvas(
     // Render inputs and cursor
     for (i, input) in inputs.iter().enumerate() {
         let is_active = i == *current_field;
-        let input_display = Paragraph::new(input.as_str())
-            .alignment(Alignment::Left)
-            .style(if is_active {
-                Style::default().fg(theme.highlight)
-            } else {
-                Style::default().fg(theme.fg)
-            });
+        let current_cursor_pos = form_state.current_cursor_pos();
 
+        let line = if is_highlight_mode && highlight_anchor.is_some() {
+            let (anchor_field, anchor_char) = highlight_anchor.unwrap();
+
+            if i == anchor_field && i == *current_field { // Highlight within the same field
+                let start = anchor_char.min(current_cursor_pos);
+                let end = anchor_char.max(current_cursor_pos);
+                let text = input.as_str();
+                let len = text.chars().count();
+
+                // Ensure start and end are within bounds
+                let safe_start = start.min(len);
+                let safe_end = end.min(len);
+
+                let before: String = text.chars().take(safe_start).collect();
+                let highlighted: String = text.chars().skip(safe_start).take(safe_end - safe_start).collect();
+                let after: String = text.chars().skip(safe_end).collect();
+
+                Line::from(vec![
+                    Span::styled(before, Style::default().fg(theme.fg)),
+                    Span::styled(
+                        highlighted,
+                        Style::default().fg(theme.highlight).bg(theme.highlight_bg).add_modifier(Modifier::BOLD)
+                    ),
+                    Span::styled(after, Style::default().fg(theme.fg)),
+                ])
+            } else {
+                // Field is not the anchor or not the current field during highlight
+                // Render normally for now (could extend to multi-line later)
+                Line::from(Span::styled(input.as_str(), Style::default().fg(theme.fg)))
+            }
+        } else {
+            // Not in highlight mode, render normally
+            Line::from(Span::styled(
+                input.as_str(),
+                if is_active { Style::default().fg(theme.highlight) } else { Style::default().fg(theme.fg) }
+            ))
+        };
+
+        let input_display = Paragraph::new(line)
+            .alignment(Alignment::Left);
         f.render_widget(input_display, input_rows[i]);
 
         if is_active {
             active_field_input_rect = Some(input_rows[i]);
-            let cursor_x = input_rows[i].x + form_state.current_cursor_pos() as u16;
+            // Cursor position calculation remains the same
+            let cursor_x = input_rows[i].x + current_cursor_pos as u16;
             let cursor_y = input_rows[i].y;
             f.set_cursor_position((cursor_x, cursor_y));
         }