Style rich text editor newlines as line breaks, not paragraph breaks

app/src/code/editor/comment_editor.rs

@@ -2,11 +2,7 @@ use crate::code::editor::comments::{EditorCommentsModel, PendingCommentEvent};
 use crate::code::editor::line::EditorLineLocation;
 use crate::code_review::comments::{CommentId, CommentOrigin};
 use crate::editor::InteractionState;
-use crate::notebooks::editor::{
-    model::NotebooksEditorModel,
-    rich_text_styles,
-    view::{EditorViewEvent, RichTextEditorConfig, RichTextEditorView},
-};
+use crate::notebooks::editor::{model::NotebooksEditorModel, view::{EditorViewEvent, RichTextEditorConfig, RichTextEditorView}, RichTextStylesExt};
 use crate::notebooks::link::{NotebookLinks, SessionSource};
 use crate::settings::FontSettings;
 use crate::ui_components::blended_colors;
@@ -19,6 +15,7 @@ use pathfinder_geometry::vector::Vector2F;
 use std::cell::RefCell;
 use warp_core::ui::{appearance::Appearance, theme::Fill};
 use warp_editor::render::element::VerticalExpansionBehavior;
+use warp_editor::render::model::RichTextStyles;
 use warpui::{
     elements::{
         Border, ChildView, Clipped, ConstrainedBox, Container, CornerRadius, CrossAxisAlignment,
@@ -423,7 +420,7 @@ impl View for CommentEditor {
                     )
                     .with_child(
                         Container::new(footer_row)
-                            .with_vertical_padding(8.)
+                            .with_vertical_padding(4.)
                             .with_horizontal_padding(8.)
                             .with_border(Border::top(1.).with_border_fill(border_color))
                             .finish(),
@@ -517,7 +514,11 @@ fn create_comment_markdown_editor_inner<V>(
 where
     V: View,
 {
-    let rich_text_styles = rich_text_styles(Appearance::as_ref(ctx), FontSettings::as_ref(ctx));
+    // Use the style factory as the single source of truth for initial styles.
+    let style_factory: fn(&Appearance, &FontSettings) -> RichTextStyles =
+        RichTextStyles::new_with_default_line_height;
+    let rich_text_styles = style_factory(Appearance::as_ref(ctx), FontSettings::as_ref(ctx));
+
     let window_id = ctx.window_id();
     let parent_view_id = ctx.view_id();
 
@@ -543,6 +544,7 @@ where
                 can_execute_shell_commands: Some(false),
                 disable_block_insertion_menu: true,
                 disable_scrolling,
+                style_factory: Some(style_factory),
             },
             ctx,
         )

app/src/notebooks/editor/mod.rs

@@ -38,10 +38,13 @@ pub mod model;
 pub mod notebook_command;
 mod omnibar;
 pub mod view;
+mod styles;
 
 pub use block_insertion_menu::BlockInsertionSource;
 use warpui::elements::ListIndentLevel;
 
+pub use styles::RichTextStylesExt;
+
 const NOTEBOOK_LINE_HEIGHT_RATIO: f32 = 1.6;
 const NOTEBOOK_BASELINE_RATIO: f32 = 0.7;
 
@@ -202,37 +205,43 @@ pub(crate) fn markdown_table_style(
 
 /// Build [`RichTextStyles`] based on the current [`Appearance`].
 pub fn rich_text_styles(appearance: &Appearance, font_settings: &FontSettings) -> RichTextStyles {
+    rich_text_styles_internal(appearance, font_settings, NOTEBOOK_LINE_HEIGHT_RATIO, NOTEBOOK_BASELINE_RATIO)
+}
+
+/// Build [`RichTextStyles`] based on the current [`Appearance`].
+fn rich_text_styles_internal(appearance: &Appearance, font_settings: &FontSettings, line_height_ratio: f32, baseline_ratio: f32) -> RichTextStyles {
+
     let theme = appearance.theme();
     let inline_font_color: ColorU = theme.terminal_colors().normal.red.into();
     let font_size = derived_notebook_font_size(font_settings);
     RichTextStyles {
         base_text: ParagraphStyles {
             font_size,
             font_weight: Default::default(),
-            line_height_ratio: NOTEBOOK_LINE_HEIGHT_RATIO,
+            line_height_ratio,
             font_family: appearance.ui_font_family(),
             text_color: theme.main_text_color(theme.background()).into_solid(),
-            baseline_ratio: NOTEBOOK_BASELINE_RATIO,
+            baseline_ratio,
             fixed_width_tab_size: None,
         },
         code_text: ParagraphStyles {
             font_family: appearance.monospace_font_family(),
             font_size,
             font_weight: Default::default(),
-            line_height_ratio: NOTEBOOK_LINE_HEIGHT_RATIO,
+            line_height_ratio,
             text_color: theme.main_text_color(theme.background()).into_solid(),
-            baseline_ratio: NOTEBOOK_BASELINE_RATIO,
+            baseline_ratio,
             fixed_width_tab_size: Some(4),
         },
         code_background: theme.background().into(),
         embedding_background: theme.surface_2().into(),
         embedding_text: ParagraphStyles {
             font_size,
             font_weight: Default::default(),
-            line_height_ratio: NOTEBOOK_LINE_HEIGHT_RATIO,
+            line_height_ratio,
             font_family: appearance.monospace_font_family(),
             text_color: theme.main_text_color(theme.surface_2()).into_solid(),
-            baseline_ratio: NOTEBOOK_BASELINE_RATIO,
+            baseline_ratio,
             fixed_width_tab_size: Some(4),
         },
         code_border: Border::all(1.).with_border_fill(theme.surface_3()),
@@ -275,6 +284,8 @@ pub fn rich_text_styles(appearance: &Appearance, font_settings: &FontSettings) -
     }
 }
 
+
+
 impl From<BlockType> for BufferBlockStyle {
     fn from(block_type: BlockType) -> Self {
         match block_type {

app/src/notebooks/editor/styles.rs

@@ -0,0 +1,45 @@
+use warp_core::ui::appearance::Appearance;
+use warp_editor::render::model::{BlockSpacing, IndentableBlockSpacing, RichTextStyles};
+use warpui::elements::{Margin, Padding};
+use warpui::text_layout::DEFAULT_TOP_BOTTOM_RATIO;
+use crate::notebooks::editor::{NOTEBOOK_BASELINE_RATIO, NOTEBOOK_LINE_HEIGHT_RATIO};
+use crate::settings::FontSettings;
+
+pub trait RichTextStylesExt {
+    fn new_for_notebook(appearance: &Appearance, font_settings: &FontSettings) -> Self;
+
+    fn new_with_default_line_height(appearance: &Appearance, font_settings: &FontSettings) -> Self;
+}
+
+impl RichTextStylesExt for RichTextStyles {
+    fn new_for_notebook(appearance: &Appearance, font_settings: &FontSettings) -> Self {
+        super::rich_text_styles_internal(appearance, font_settings, NOTEBOOK_LINE_HEIGHT_RATIO, NOTEBOOK_BASELINE_RATIO)
+    }
+
+    fn new_with_default_line_height(appearance: &Appearance, font_settings: &FontSettings) -> Self {
+        // Bump the line height ratio slightly so soft-wrapped and hard-wrapped lines
+        // have consistent, comfortable spacing.
+        let line_height_ratio = appearance.line_height_ratio() + 0.15;
+        let compact_text_spacing = BlockSpacing {
+            margin: Margin::uniform(0.),
+            padding: Padding::uniform(0.),
+        };
+        let compact_indentable = IndentableBlockSpacing::new(Margin::uniform(0.), 20.);
+        let mut styles = super::rich_text_styles_internal(
+            appearance,
+            font_settings,
+            line_height_ratio,
+            DEFAULT_TOP_BOTTOM_RATIO,
+        );
+        styles.minimum_paragraph_height = None;
+        styles.cursor_width = 3.;
+        styles.show_placeholder_text_on_empty_block = true;
+        // Only compact text block spacings; keep the default code block spacing.
+        styles.block_spacings.text = compact_text_spacing;
+        styles.block_spacings.header = compact_text_spacing;
+        styles.block_spacings.task_list = compact_indentable.clone();
+        styles.block_spacings.ordered_list = compact_indentable.clone();
+        styles.block_spacings.unordered_list = compact_indentable;
+        styles
+    }
+}

app/src/notebooks/editor/view.rs

@@ -21,7 +21,7 @@ use warp_editor::{
             DisplayOptions, DisplayStateHandle, RichTextAction, RichTextElement,
             VerticalExpansionBehavior,
         },
-        model::{BlockItem, HitTestBlockType, Location, RenderState},
+        model::{BlockItem, HitTestBlockType, Location, RenderState, RichTextStyles},
     },
     selection::{TextDirection, TextUnit},
 };
@@ -199,8 +199,8 @@ pub fn init(app: &mut AppContext) {
         ),
         FixedBinding::new("tab", EditorViewAction::Tab, text_entry.clone()),
         FixedBinding::new("shift-tab", EditorViewAction::ShiftTab, text_entry.clone()),
-        // Also create the word movement shortcuts with `meta` in place of `alt`, to accommodate
-        // the "Left Option is Meta" and "Right Option is Meta" settings.
+        // Also create the word movement and word deletion shortcuts with `meta` in place of
+        // `alt`, to accommodate the "Left Option is Meta" and "Right Option is Meta" settings.
         FixedBinding::new(
             "meta-left",
             EditorViewAction::MoveBackwardsByWord,
@@ -211,6 +211,16 @@ pub fn init(app: &mut AppContext) {
             EditorViewAction::MoveForwardsByWord,
             text_entry.clone(),
         ),
+        FixedBinding::new(
+            "meta-backspace",
+            EditorViewAction::DeleteWordLeft,
+            text_entry.clone(),
+        ),
+        FixedBinding::new(
+            "meta-d",
+            EditorViewAction::CutWordRight,
+            text_entry.clone(),
+        ),
         FixedBinding::new_per_platform(
             PerPlatformKeystroke {
                 mac: "shift-alt-left",
@@ -465,7 +475,7 @@ pub fn init(app: &mut AppContext) {
         .with_key_binding("ctrl-f"),
         EditableBinding::new(
             // This doesn't reuse the move_to_line_start naming from the terminal input editor to
-            // distinguish between soft-wrapped line and hard-wrapped line (paragraph) movement.
+            // distinguish between soft-wrappped line and hard-wrapped line (paragraph) movement.
             "editor_view:move_to_paragraph_start",
             "Move to start of paragraph",
             EditorViewAction::MoveToParagraphStart,
@@ -962,7 +972,7 @@ struct MouseStateHandles {
     secondary_link_mouse_handle: MouseStateHandle,
 }
 
-// Represents the states of an ongoing mouse event. Note that these states are mutually exclusive:
+// Represents the states of an ongoing mouse event. Note that these states are mutally exclusive:
 // If one is selecting, they couldn't be initiating task list toggling at the same time.
 enum OngoingMouseEvent {
     Selecting,
@@ -1048,6 +1058,9 @@ pub struct RichTextEditorView {
 
     /// When true, the block insertion menu (slash menu) is disabled.
     disable_block_insertion_menu: bool,
+
+    /// Custom factory for rebuilding [`RichTextStyles`] when appearance or font settings change.
+    style_factory: Option<fn(&Appearance, &FontSettings) -> RichTextStyles>,
 }
 
 #[derive(Default)]
@@ -1071,6 +1084,10 @@ pub struct RichTextEditorConfig {
     /// Enable or disable the block insertion menu (slash menu).
     /// When disabled, typing "/" will not open the menu.
     pub disable_block_insertion_menu: bool,
+
+    /// Custom factory for rebuilding [`RichTextStyles`] when appearance or font settings change.
+    /// When `None`, the default notebook styles are used.
+    pub style_factory: Option<fn(&Appearance, &FontSettings) -> RichTextStyles>,
 }
 
 impl RichTextEditorView {
@@ -1155,6 +1172,7 @@ impl RichTextEditorView {
             can_execute_shell_commands: config.can_execute_shell_commands.unwrap_or(true),
             disable_scrolling: config.disable_scrolling,
             disable_block_insertion_menu: config.disable_block_insertion_menu,
+            style_factory: config.style_factory,
         }
     }
 
@@ -1275,7 +1293,10 @@ impl RichTextEditorView {
     fn handle_appearance_or_font_change(&mut self, ctx: &mut ViewContext<Self>) {
         let font_settings = FontSettings::as_ref(ctx);
         let appearance = Appearance::as_ref(ctx);
-        let new_styles = rich_text_styles(appearance, font_settings);
+        let new_styles = match self.style_factory {
+            Some(factory) => factory(appearance, font_settings),
+            None => rich_text_styles(appearance, font_settings),
+        };
         self.model.update(ctx, move |model, ctx| {
             model.update_rich_text_styles(new_styles, ctx);
         });

crates/editor/src/render/model/mod.rs

@@ -514,6 +514,13 @@ pub struct IndentableBlockSpacing {
 }
 
 impl IndentableBlockSpacing {
+    pub fn new(margin: Margin, unit_padding: f32) -> Self {
+        Self {
+            margin,
+            unit_padding,
+        }
+    }
+
     pub fn to_spacing(&self, indent_level: ListIndentLevel) -> BlockSpacing {
         BlockSpacing {
             margin: self.margin,
@@ -540,6 +547,27 @@ impl Default for BlockSpacings {
 }
 
 impl BlockSpacings {
+    /// Creates a `BlockSpacings` where all block types use the same spacing.
+    pub fn uniform(spacing: BlockSpacing) -> Self {
+        Self {
+            text: spacing,
+            header: spacing,
+            code_block: spacing,
+            task_list: IndentableBlockSpacing {
+                margin: spacing.margin,
+                unit_padding: 0.,
+            },
+            ordered_list: IndentableBlockSpacing {
+                margin: spacing.margin,
+                unit_padding: 0.,
+            },
+            unordered_list: IndentableBlockSpacing {
+                margin: spacing.margin,
+                unit_padding: 0.,
+            },
+        }
+    }
+
     pub fn from_block_style(&self, block_type: &BufferBlockStyle) -> BlockSpacing {
         match block_type {
             BufferBlockStyle::Header { .. } => self.header,