Add mode specific styles

book/src/configuration.md

@@ -45,6 +45,7 @@ hidden = false
 | `auto-info` | Whether to display infoboxes | `true` |
 | `true-color` | Set to `true` to override automatic detection of terminal truecolor support in the event of a false negative. | `false` |
 | `rulers` | List of column positions at which to display the rulers. Can be overridden by language specific `rulers` in `languages.toml` file. | `[]` |
+| `color-modes` | Whether to color the mode indicator with different colors depending on the mode itself | `false` |
 
 ### `[editor.lsp]` Section
 

book/src/themes.md

@@ -219,14 +219,17 @@ These scopes are used for theming the editor interface.
 | `ui.linenr.selected`      | Line number for the line the cursor is on      |
 | `ui.statusline`           | Statusline                                     |
 | `ui.statusline.inactive`  | Statusline (unfocused document)                |
+| `ui.statusline.normal`    | Statusline mode during normal mode ([only if `editor.color-modes` is enabled][editor-section]) |
+| `ui.statusline.insert`    | Statusline mode during insert mode ([only if `editor.color-modes` is enabled][editor-section]) |
+| `ui.statusline.select`    | Statusline mode during select mode ([only if `editor.color-modes` is enabled][editor-section]) |
 | `ui.popup`                | Documentation popups (e.g space-k)             |
 | `ui.popup.info`           | Prompt for multiple key options                |
 | `ui.window`               | Border lines separating splits                 |
 | `ui.help`                 | Description box for commands                   |
 | `ui.text`                 | Command prompts, popup text, etc.              |
 | `ui.text.focus`           |                                                |
 | `ui.text.info`            | The key: command text in `ui.popup.info` boxes |
-| `ui.virtual.ruler`        | Ruler columns (see the [`editor.rulers` config][rulers-config])|
+| `ui.virtual.ruler`        | Ruler columns (see the [`editor.rulers` config][editor-section])|
 | `ui.virtual.whitespace`   | Visible white-space characters                 |
 | `ui.virtual.indent-guide` | Vertical indent width guides                   |
 | `ui.menu`                 | Code and command completion menus              |
@@ -243,4 +246,4 @@ These scopes are used for theming the editor interface.
 | `diagnostic.warning`      | Diagnostics warning (editing area)             |
 | `diagnostic.error`        | Diagnostics error (editing area)               |
 
-[rulers-config]: ./configuration.md#editor-section
+[editor-section]: ./configuration.md#editor-section

helix-term/src/ui/editor.rs

@@ -157,7 +157,7 @@ impl EditorView {
             .area
             .clip_top(view.area.height.saturating_sub(1))
             .clip_bottom(1); // -1 from bottom to remove commandline
-        self.render_statusline(doc, view, statusline_area, surface, theme, is_focused);
+        self.render_statusline(editor, doc, view, statusline_area, surface, is_focused);
     }
 
     pub fn render_rulers(
@@ -688,11 +688,11 @@ impl EditorView {
 
     pub fn render_statusline(
         &self,
+        editor: &Editor,
         doc: &Document,
         view: &View,
         viewport: Rect,
         surface: &mut Surface,
-        theme: &Theme,
         is_focused: bool,
     ) {
         use tui::text::{Span, Spans};
@@ -701,10 +701,11 @@ impl EditorView {
         // Left side of the status line.
         //-------------------------------
 
-        let mode = match doc.mode() {
-            Mode::Insert => "INS",
-            Mode::Select => "SEL",
-            Mode::Normal => "NOR",
+        let theme = &editor.theme;
+        let (mode, mode_style) = match doc.mode() {
+            Mode::Insert => (" INS ", theme.get("ui.statusline.insert")),
+            Mode::Select => (" SEL ", theme.get("ui.statusline.select")),
+            Mode::Normal => (" NOR ", theme.get("ui.statusline.normal")),
         };
         let progress = doc
             .language_server()
@@ -723,7 +724,13 @@ impl EditorView {
         // statusline
         surface.set_style(viewport.with_height(1), base_style);
         if is_focused {
-            surface.set_string(viewport.x + 1, viewport.y, mode, base_style);
+            let color_modes = editor.config().color_modes;
+            surface.set_string(
+                viewport.x,
+                viewport.y,
+                mode,
+                if color_modes { mode_style } else { base_style },
+            );
         }
         surface.set_string(viewport.x + 5, viewport.y, progress, base_style);
 

helix-view/src/editor.rs

@@ -158,6 +158,8 @@ pub struct Config {
     pub whitespace: WhitespaceConfig,
     /// Vertical indent width guides.
     pub indent_guides: IndentGuidesConfig,
+    /// Whether to color modes with different colors. Defaults to `false`.
+    pub color_modes: bool,
 }
 
 #[derive(Debug, Default, Clone, PartialEq, Serialize, Deserialize)]
@@ -410,6 +412,7 @@ impl Default for Config {
             rulers: Vec::new(),
             whitespace: WhitespaceConfig::default(),
             indent_guides: IndentGuidesConfig::default(),
+            color_modes: false,
         }
     }
 }

runtime/themes/rose_pine.toml

@@ -9,6 +9,9 @@
 "ui.selection" = { bg = "highlight" }
 "comment" = "subtle"
 "ui.statusline" = {fg = "foam", bg = "surface" }
+"ui.statusline.insert" = {fg = "base", bg = "foam", modifiers = ["bold"]}
+"ui.statusline.normal" = {fg = "base", bg = "rose", modifiers = ["bold"]}
+"ui.statusline.select" = {fg = "base", bg = "iris", modifiers = ["bold"]}
 "ui.statusline.inactive" = { fg = "iris", bg = "surface" }
 "ui.cursor" = { fg = "rose", modifiers = ["reversed"] }
 "ui.text" = { fg = "text" }