1pub mod parser;
2mod path_range;
3
4use base64::Engine as _;
5use futures::FutureExt as _;
6use gpui::EdgesRefinement;
7use gpui::HitboxBehavior;
8use gpui::UnderlineStyle;
9use language::LanguageName;
10use log::Level;
11pub use path_range::{LineCol, PathWithRange};
12use settings::Settings as _;
13use theme::ThemeSettings;
14use ui::Checkbox;
15use ui::CopyButton;
16
17use std::borrow::Cow;
18use std::iter;
19use std::mem;
20use std::ops::Range;
21use std::path::Path;
22use std::rc::Rc;
23use std::sync::Arc;
24use std::time::Duration;
25
26use collections::{HashMap, HashSet};
27use gpui::{
28 AnyElement, App, BorderStyle, Bounds, ClipboardItem, CursorStyle, DispatchPhase, Edges, Entity,
29 FocusHandle, Focusable, FontStyle, FontWeight, GlobalElementId, Hitbox, Hsla, Image,
30 ImageFormat, KeyContext, Length, MouseButton, MouseDownEvent, MouseEvent, MouseMoveEvent,
31 MouseUpEvent, Point, ScrollHandle, Stateful, StrikethroughStyle, StyleRefinement, StyledText,
32 Task, TextLayout, TextRun, TextStyle, TextStyleRefinement, actions, img, point, quad,
33};
34use language::{CharClassifier, Language, LanguageRegistry, Rope};
35use parser::CodeBlockMetadata;
36use parser::{MarkdownEvent, MarkdownTag, MarkdownTagEnd, parse_links_only, parse_markdown};
37use pulldown_cmark::Alignment;
38use sum_tree::TreeMap;
39use theme::SyntaxTheme;
40use ui::{ScrollAxes, Scrollbars, WithScrollbar, prelude::*};
41use util::ResultExt;
42
43use crate::parser::CodeBlockKind;
44
45/// A callback function that can be used to customize the style of links based on the destination URL.
46/// If the callback returns `None`, the default link style will be used.
47type LinkStyleCallback = Rc<dyn Fn(&str, &App) -> Option<TextStyleRefinement>>;
48
49/// Defines custom style refinements for each heading level (H1-H6)
50#[derive(Clone, Default)]
51pub struct HeadingLevelStyles {
52 pub h1: Option<TextStyleRefinement>,
53 pub h2: Option<TextStyleRefinement>,
54 pub h3: Option<TextStyleRefinement>,
55 pub h4: Option<TextStyleRefinement>,
56 pub h5: Option<TextStyleRefinement>,
57 pub h6: Option<TextStyleRefinement>,
58}
59
60#[derive(Clone)]
61pub struct MarkdownStyle {
62 pub base_text_style: TextStyle,
63 pub container_style: StyleRefinement,
64 pub code_block: StyleRefinement,
65 pub code_block_overflow_x_scroll: bool,
66 pub inline_code: TextStyleRefinement,
67 pub block_quote: TextStyleRefinement,
68 pub link: TextStyleRefinement,
69 pub link_callback: Option<LinkStyleCallback>,
70 pub rule_color: Hsla,
71 pub block_quote_border_color: Hsla,
72 pub syntax: Arc<SyntaxTheme>,
73 pub selection_background_color: Hsla,
74 pub heading: StyleRefinement,
75 pub heading_level_styles: Option<HeadingLevelStyles>,
76 pub height_is_multiple_of_line_height: bool,
77 pub prevent_mouse_interaction: bool,
78 pub table_columns_min_size: bool,
79}
80
81impl Default for MarkdownStyle {
82 fn default() -> Self {
83 Self {
84 base_text_style: Default::default(),
85 container_style: Default::default(),
86 code_block: Default::default(),
87 code_block_overflow_x_scroll: false,
88 inline_code: Default::default(),
89 block_quote: Default::default(),
90 link: Default::default(),
91 link_callback: None,
92 rule_color: Default::default(),
93 block_quote_border_color: Default::default(),
94 syntax: Arc::new(SyntaxTheme::default()),
95 selection_background_color: Default::default(),
96 heading: Default::default(),
97 heading_level_styles: None,
98 height_is_multiple_of_line_height: false,
99 prevent_mouse_interaction: false,
100 table_columns_min_size: false,
101 }
102 }
103}
104
105pub enum MarkdownFont {
106 Agent,
107 Editor,
108}
109
110impl MarkdownStyle {
111 pub fn themed(font: MarkdownFont, window: &Window, cx: &App) -> Self {
112 let theme_settings = ThemeSettings::get_global(cx);
113 let colors = cx.theme().colors();
114
115 let buffer_font_weight = theme_settings.buffer_font.weight;
116 let (buffer_font_size, ui_font_size) = match font {
117 MarkdownFont::Agent => (
118 theme_settings.agent_buffer_font_size(cx),
119 theme_settings.agent_ui_font_size(cx),
120 ),
121 MarkdownFont::Editor => (
122 theme_settings.buffer_font_size(cx),
123 theme_settings.ui_font_size(cx),
124 ),
125 };
126
127 let text_color = colors.text;
128
129 let mut text_style = window.text_style();
130 let line_height = buffer_font_size * 1.75;
131
132 text_style.refine(&TextStyleRefinement {
133 font_family: Some(theme_settings.ui_font.family.clone()),
134 font_fallbacks: theme_settings.ui_font.fallbacks.clone(),
135 font_features: Some(theme_settings.ui_font.features.clone()),
136 font_size: Some(ui_font_size.into()),
137 line_height: Some(line_height.into()),
138 color: Some(text_color),
139 ..Default::default()
140 });
141
142 MarkdownStyle {
143 base_text_style: text_style.clone(),
144 syntax: cx.theme().syntax().clone(),
145 selection_background_color: colors.element_selection_background,
146 code_block_overflow_x_scroll: true,
147 heading_level_styles: Some(HeadingLevelStyles {
148 h1: Some(TextStyleRefinement {
149 font_size: Some(rems(1.15).into()),
150 ..Default::default()
151 }),
152 h2: Some(TextStyleRefinement {
153 font_size: Some(rems(1.1).into()),
154 ..Default::default()
155 }),
156 h3: Some(TextStyleRefinement {
157 font_size: Some(rems(1.05).into()),
158 ..Default::default()
159 }),
160 h4: Some(TextStyleRefinement {
161 font_size: Some(rems(1.).into()),
162 ..Default::default()
163 }),
164 h5: Some(TextStyleRefinement {
165 font_size: Some(rems(0.95).into()),
166 ..Default::default()
167 }),
168 h6: Some(TextStyleRefinement {
169 font_size: Some(rems(0.875).into()),
170 ..Default::default()
171 }),
172 }),
173 code_block: StyleRefinement {
174 padding: EdgesRefinement {
175 top: Some(DefiniteLength::Absolute(AbsoluteLength::Pixels(px(8.)))),
176 left: Some(DefiniteLength::Absolute(AbsoluteLength::Pixels(px(8.)))),
177 right: Some(DefiniteLength::Absolute(AbsoluteLength::Pixels(px(8.)))),
178 bottom: Some(DefiniteLength::Absolute(AbsoluteLength::Pixels(px(8.)))),
179 },
180 margin: EdgesRefinement {
181 top: Some(Length::Definite(px(8.).into())),
182 left: Some(Length::Definite(px(0.).into())),
183 right: Some(Length::Definite(px(0.).into())),
184 bottom: Some(Length::Definite(px(12.).into())),
185 },
186 border_style: Some(BorderStyle::Solid),
187 border_widths: EdgesRefinement {
188 top: Some(AbsoluteLength::Pixels(px(1.))),
189 left: Some(AbsoluteLength::Pixels(px(1.))),
190 right: Some(AbsoluteLength::Pixels(px(1.))),
191 bottom: Some(AbsoluteLength::Pixels(px(1.))),
192 },
193 border_color: Some(colors.border_variant),
194 background: Some(colors.editor_background.into()),
195 text: TextStyleRefinement {
196 font_family: Some(theme_settings.buffer_font.family.clone()),
197 font_fallbacks: theme_settings.buffer_font.fallbacks.clone(),
198 font_features: Some(theme_settings.buffer_font.features.clone()),
199 font_size: Some(buffer_font_size.into()),
200 font_weight: Some(buffer_font_weight),
201 ..Default::default()
202 },
203 ..Default::default()
204 },
205 inline_code: TextStyleRefinement {
206 font_family: Some(theme_settings.buffer_font.family.clone()),
207 font_fallbacks: theme_settings.buffer_font.fallbacks.clone(),
208 font_features: Some(theme_settings.buffer_font.features.clone()),
209 font_size: Some(buffer_font_size.into()),
210 font_weight: Some(buffer_font_weight),
211 background_color: Some(colors.editor_foreground.opacity(0.08)),
212 ..Default::default()
213 },
214 link: TextStyleRefinement {
215 background_color: Some(colors.editor_foreground.opacity(0.025)),
216 color: Some(colors.text_accent),
217 underline: Some(UnderlineStyle {
218 color: Some(colors.text_accent.opacity(0.5)),
219 thickness: px(1.),
220 ..Default::default()
221 }),
222 ..Default::default()
223 },
224 ..Default::default()
225 }
226 }
227
228 pub fn with_muted_text(mut self, cx: &App) -> Self {
229 let colors = cx.theme().colors();
230 self.base_text_style.color = colors.text_muted;
231 self
232 }
233}
234
235pub struct Markdown {
236 source: SharedString,
237 selection: Selection,
238 pressed_link: Option<RenderedLink>,
239 autoscroll_request: Option<usize>,
240 parsed_markdown: ParsedMarkdown,
241 images_by_source_offset: HashMap<usize, Arc<Image>>,
242 should_reparse: bool,
243 pending_parse: Option<Task<()>>,
244 focus_handle: FocusHandle,
245 language_registry: Option<Arc<LanguageRegistry>>,
246 fallback_code_block_language: Option<LanguageName>,
247 options: Options,
248 copied_code_blocks: HashSet<ElementId>,
249 code_block_scroll_handles: HashMap<usize, ScrollHandle>,
250 context_menu_selected_text: Option<String>,
251}
252
253struct Options {
254 parse_links_only: bool,
255}
256
257pub enum CodeBlockRenderer {
258 Default {
259 copy_button: bool,
260 copy_button_on_hover: bool,
261 border: bool,
262 },
263 Custom {
264 render: CodeBlockRenderFn,
265 /// A function that can modify the parent container after the code block
266 /// content has been appended as a child element.
267 transform: Option<CodeBlockTransformFn>,
268 },
269}
270
271pub type CodeBlockRenderFn = Arc<
272 dyn Fn(
273 &CodeBlockKind,
274 &ParsedMarkdown,
275 Range<usize>,
276 CodeBlockMetadata,
277 &mut Window,
278 &App,
279 ) -> Div,
280>;
281
282pub type CodeBlockTransformFn =
283 Arc<dyn Fn(AnyDiv, Range<usize>, CodeBlockMetadata, &mut Window, &App) -> AnyDiv>;
284
285actions!(
286 markdown,
287 [
288 /// Copies the selected text to the clipboard.
289 Copy,
290 /// Copies the selected text as markdown to the clipboard.
291 CopyAsMarkdown
292 ]
293);
294
295impl Markdown {
296 pub fn new(
297 source: SharedString,
298 language_registry: Option<Arc<LanguageRegistry>>,
299 fallback_code_block_language: Option<LanguageName>,
300 cx: &mut Context<Self>,
301 ) -> Self {
302 let focus_handle = cx.focus_handle();
303 let mut this = Self {
304 source,
305 selection: Selection::default(),
306 pressed_link: None,
307 autoscroll_request: None,
308 should_reparse: false,
309 images_by_source_offset: Default::default(),
310 parsed_markdown: ParsedMarkdown::default(),
311 pending_parse: None,
312 focus_handle,
313 language_registry,
314 fallback_code_block_language,
315 options: Options {
316 parse_links_only: false,
317 },
318 copied_code_blocks: HashSet::default(),
319 code_block_scroll_handles: HashMap::default(),
320 context_menu_selected_text: None,
321 };
322 this.parse(cx);
323 this
324 }
325
326 pub fn new_text(source: SharedString, cx: &mut Context<Self>) -> Self {
327 let focus_handle = cx.focus_handle();
328 let mut this = Self {
329 source,
330 selection: Selection::default(),
331 pressed_link: None,
332 autoscroll_request: None,
333 should_reparse: false,
334 parsed_markdown: ParsedMarkdown::default(),
335 images_by_source_offset: Default::default(),
336 pending_parse: None,
337 focus_handle,
338 language_registry: None,
339 fallback_code_block_language: None,
340 options: Options {
341 parse_links_only: true,
342 },
343 copied_code_blocks: HashSet::default(),
344 code_block_scroll_handles: HashMap::default(),
345 context_menu_selected_text: None,
346 };
347 this.parse(cx);
348 this
349 }
350
351 fn code_block_scroll_handle(&mut self, id: usize) -> ScrollHandle {
352 self.code_block_scroll_handles
353 .entry(id)
354 .or_insert_with(ScrollHandle::new)
355 .clone()
356 }
357
358 fn retain_code_block_scroll_handles(&mut self, ids: &HashSet<usize>) {
359 self.code_block_scroll_handles
360 .retain(|id, _| ids.contains(id));
361 }
362
363 fn clear_code_block_scroll_handles(&mut self) {
364 self.code_block_scroll_handles.clear();
365 }
366
367 pub fn is_parsing(&self) -> bool {
368 self.pending_parse.is_some()
369 }
370
371 pub fn source(&self) -> &str {
372 &self.source
373 }
374
375 pub fn append(&mut self, text: &str, cx: &mut Context<Self>) {
376 self.source = SharedString::new(self.source.to_string() + text);
377 self.parse(cx);
378 }
379
380 pub fn replace(&mut self, source: impl Into<SharedString>, cx: &mut Context<Self>) {
381 self.source = source.into();
382 self.parse(cx);
383 }
384
385 pub fn reset(&mut self, source: SharedString, cx: &mut Context<Self>) {
386 if source == self.source() {
387 return;
388 }
389 self.source = source;
390 self.selection = Selection::default();
391 self.autoscroll_request = None;
392 self.pending_parse = None;
393 self.should_reparse = false;
394 // Don't clear parsed_markdown here - keep existing content visible until new parse completes
395 self.parse(cx);
396 }
397
398 #[cfg(any(test, feature = "test-support"))]
399 pub fn parsed_markdown(&self) -> &ParsedMarkdown {
400 &self.parsed_markdown
401 }
402
403 pub fn escape(s: &str) -> Cow<'_, str> {
404 // Valid to use bytes since multi-byte UTF-8 doesn't use ASCII chars.
405 let count = s
406 .bytes()
407 .filter(|c| *c == b'\n' || c.is_ascii_punctuation())
408 .count();
409 if count > 0 {
410 let mut output = String::with_capacity(s.len() + count);
411 let mut is_newline = false;
412 for c in s.chars() {
413 if is_newline && c == ' ' {
414 continue;
415 }
416 is_newline = c == '\n';
417 if c == '\n' {
418 output.push('\n')
419 } else if c.is_ascii_punctuation() {
420 output.push('\\')
421 }
422 output.push(c)
423 }
424 output.into()
425 } else {
426 s.into()
427 }
428 }
429
430 pub fn selected_text(&self) -> Option<String> {
431 if self.selection.end <= self.selection.start {
432 None
433 } else {
434 Some(self.source[self.selection.start..self.selection.end].to_string())
435 }
436 }
437
438 fn copy(&self, text: &RenderedText, _: &mut Window, cx: &mut Context<Self>) {
439 if self.selection.end <= self.selection.start {
440 return;
441 }
442 let text = text.text_for_range(self.selection.start..self.selection.end);
443 cx.write_to_clipboard(ClipboardItem::new_string(text));
444 }
445
446 fn copy_as_markdown(&mut self, _: &mut Window, cx: &mut Context<Self>) {
447 if let Some(text) = self.context_menu_selected_text.take() {
448 cx.write_to_clipboard(ClipboardItem::new_string(text));
449 return;
450 }
451 if self.selection.end <= self.selection.start {
452 return;
453 }
454 let text = self.source[self.selection.start..self.selection.end].to_string();
455 cx.write_to_clipboard(ClipboardItem::new_string(text));
456 }
457
458 fn capture_selection_for_context_menu(&mut self) {
459 self.context_menu_selected_text = self.selected_text();
460 }
461
462 fn parse(&mut self, cx: &mut Context<Self>) {
463 if self.source.is_empty() {
464 return;
465 }
466
467 if self.pending_parse.is_some() {
468 self.should_reparse = true;
469 return;
470 }
471 self.should_reparse = false;
472 self.pending_parse = Some(self.start_background_parse(cx));
473 }
474
475 fn start_background_parse(&self, cx: &Context<Self>) -> Task<()> {
476 let source = self.source.clone();
477 let should_parse_links_only = self.options.parse_links_only;
478 let language_registry = self.language_registry.clone();
479 let fallback = self.fallback_code_block_language.clone();
480
481 let parsed = cx.background_spawn(async move {
482 if should_parse_links_only {
483 return (
484 ParsedMarkdown {
485 events: Arc::from(parse_links_only(source.as_ref())),
486 source,
487 languages_by_name: TreeMap::default(),
488 languages_by_path: TreeMap::default(),
489 },
490 Default::default(),
491 );
492 }
493
494 let (events, language_names, paths) = parse_markdown(&source);
495 let mut images_by_source_offset = HashMap::default();
496 let mut languages_by_name = TreeMap::default();
497 let mut languages_by_path = TreeMap::default();
498 if let Some(registry) = language_registry.as_ref() {
499 for name in language_names {
500 let language = if !name.is_empty() {
501 registry.language_for_name_or_extension(&name).left_future()
502 } else if let Some(fallback) = &fallback {
503 registry.language_for_name(fallback.as_ref()).right_future()
504 } else {
505 continue;
506 };
507 if let Ok(language) = language.await {
508 languages_by_name.insert(name, language);
509 }
510 }
511
512 for path in paths {
513 if let Ok(language) = registry
514 .load_language_for_file_path(Path::new(path.as_ref()))
515 .await
516 {
517 languages_by_path.insert(path, language);
518 }
519 }
520 }
521
522 for (range, event) in &events {
523 if let MarkdownEvent::Start(MarkdownTag::Image { dest_url, .. }) = event
524 && let Some(data_url) = dest_url.strip_prefix("data:")
525 {
526 let Some((mime_info, data)) = data_url.split_once(',') else {
527 continue;
528 };
529 let Some((mime_type, encoding)) = mime_info.split_once(';') else {
530 continue;
531 };
532 let Some(format) = ImageFormat::from_mime_type(mime_type) else {
533 continue;
534 };
535 let is_base64 = encoding == "base64";
536 if is_base64
537 && let Some(bytes) = base64::prelude::BASE64_STANDARD
538 .decode(data)
539 .log_with_level(Level::Debug)
540 {
541 let image = Arc::new(Image::from_bytes(format, bytes));
542 images_by_source_offset.insert(range.start, image);
543 }
544 }
545 }
546
547 (
548 ParsedMarkdown {
549 source,
550 events: Arc::from(events),
551 languages_by_name,
552 languages_by_path,
553 },
554 images_by_source_offset,
555 )
556 });
557
558 cx.spawn(async move |this, cx| {
559 let (parsed, images_by_source_offset) = parsed.await;
560
561 this.update(cx, |this, cx| {
562 this.parsed_markdown = parsed;
563 this.images_by_source_offset = images_by_source_offset;
564 this.pending_parse.take();
565 if this.should_reparse {
566 this.parse(cx);
567 }
568 cx.refresh_windows();
569 })
570 .ok();
571 })
572 }
573}
574
575impl Focusable for Markdown {
576 fn focus_handle(&self, _cx: &App) -> FocusHandle {
577 self.focus_handle.clone()
578 }
579}
580
581#[derive(Debug, Default, Clone)]
582enum SelectMode {
583 #[default]
584 Character,
585 Word(Range<usize>),
586 Line(Range<usize>),
587 All,
588}
589
590#[derive(Clone, Default)]
591struct Selection {
592 start: usize,
593 end: usize,
594 reversed: bool,
595 pending: bool,
596 mode: SelectMode,
597}
598
599impl Selection {
600 fn set_head(&mut self, head: usize, rendered_text: &RenderedText) {
601 match &self.mode {
602 SelectMode::Character => {
603 if head < self.tail() {
604 if !self.reversed {
605 self.end = self.start;
606 self.reversed = true;
607 }
608 self.start = head;
609 } else {
610 if self.reversed {
611 self.start = self.end;
612 self.reversed = false;
613 }
614 self.end = head;
615 }
616 }
617 SelectMode::Word(original_range) | SelectMode::Line(original_range) => {
618 let head_range = if matches!(self.mode, SelectMode::Word(_)) {
619 rendered_text.surrounding_word_range(head)
620 } else {
621 rendered_text.surrounding_line_range(head)
622 };
623
624 if head < original_range.start {
625 self.start = head_range.start;
626 self.end = original_range.end;
627 self.reversed = true;
628 } else if head >= original_range.end {
629 self.start = original_range.start;
630 self.end = head_range.end;
631 self.reversed = false;
632 } else {
633 self.start = original_range.start;
634 self.end = original_range.end;
635 self.reversed = false;
636 }
637 }
638 SelectMode::All => {
639 self.start = 0;
640 self.end = rendered_text
641 .lines
642 .last()
643 .map(|line| line.source_end)
644 .unwrap_or(0);
645 self.reversed = false;
646 }
647 }
648 }
649
650 fn tail(&self) -> usize {
651 if self.reversed { self.end } else { self.start }
652 }
653}
654
655#[derive(Debug, Clone, Default)]
656pub struct ParsedMarkdown {
657 pub source: SharedString,
658 pub events: Arc<[(Range<usize>, MarkdownEvent)]>,
659 pub languages_by_name: TreeMap<SharedString, Arc<Language>>,
660 pub languages_by_path: TreeMap<Arc<str>, Arc<Language>>,
661}
662
663impl ParsedMarkdown {
664 pub fn source(&self) -> &SharedString {
665 &self.source
666 }
667
668 pub fn events(&self) -> &Arc<[(Range<usize>, MarkdownEvent)]> {
669 &self.events
670 }
671}
672
673pub struct MarkdownElement {
674 markdown: Entity<Markdown>,
675 style: MarkdownStyle,
676 code_block_renderer: CodeBlockRenderer,
677 on_url_click: Option<Box<dyn Fn(SharedString, &mut Window, &mut App)>>,
678}
679
680impl MarkdownElement {
681 pub fn new(markdown: Entity<Markdown>, style: MarkdownStyle) -> Self {
682 Self {
683 markdown,
684 style,
685 code_block_renderer: CodeBlockRenderer::Default {
686 copy_button: true,
687 copy_button_on_hover: false,
688 border: false,
689 },
690 on_url_click: None,
691 }
692 }
693
694 #[cfg(any(test, feature = "test-support"))]
695 pub fn rendered_text(
696 markdown: Entity<Markdown>,
697 cx: &mut gpui::VisualTestContext,
698 style: impl FnOnce(&Window, &App) -> MarkdownStyle,
699 ) -> String {
700 use gpui::size;
701
702 let (text, _) = cx.draw(
703 Default::default(),
704 size(px(600.0), px(600.0)),
705 |window, cx| Self::new(markdown, style(window, cx)),
706 );
707 text.text
708 .lines
709 .iter()
710 .map(|line| line.layout.wrapped_text())
711 .collect::<Vec<_>>()
712 .join("\n")
713 }
714
715 pub fn code_block_renderer(mut self, variant: CodeBlockRenderer) -> Self {
716 self.code_block_renderer = variant;
717 self
718 }
719
720 pub fn on_url_click(
721 mut self,
722 handler: impl Fn(SharedString, &mut Window, &mut App) + 'static,
723 ) -> Self {
724 self.on_url_click = Some(Box::new(handler));
725 self
726 }
727
728 fn paint_selection(
729 &self,
730 bounds: Bounds<Pixels>,
731 rendered_text: &RenderedText,
732 window: &mut Window,
733 cx: &mut App,
734 ) {
735 let selection = self.markdown.read(cx).selection.clone();
736 let selection_start = rendered_text.position_for_source_index(selection.start);
737 let selection_end = rendered_text.position_for_source_index(selection.end);
738 if let Some(((start_position, start_line_height), (end_position, end_line_height))) =
739 selection_start.zip(selection_end)
740 {
741 if start_position.y == end_position.y {
742 window.paint_quad(quad(
743 Bounds::from_corners(
744 start_position,
745 point(end_position.x, end_position.y + end_line_height),
746 ),
747 Pixels::ZERO,
748 self.style.selection_background_color,
749 Edges::default(),
750 Hsla::transparent_black(),
751 BorderStyle::default(),
752 ));
753 } else {
754 window.paint_quad(quad(
755 Bounds::from_corners(
756 start_position,
757 point(bounds.right(), start_position.y + start_line_height),
758 ),
759 Pixels::ZERO,
760 self.style.selection_background_color,
761 Edges::default(),
762 Hsla::transparent_black(),
763 BorderStyle::default(),
764 ));
765
766 if end_position.y > start_position.y + start_line_height {
767 window.paint_quad(quad(
768 Bounds::from_corners(
769 point(bounds.left(), start_position.y + start_line_height),
770 point(bounds.right(), end_position.y),
771 ),
772 Pixels::ZERO,
773 self.style.selection_background_color,
774 Edges::default(),
775 Hsla::transparent_black(),
776 BorderStyle::default(),
777 ));
778 }
779
780 window.paint_quad(quad(
781 Bounds::from_corners(
782 point(bounds.left(), end_position.y),
783 point(end_position.x, end_position.y + end_line_height),
784 ),
785 Pixels::ZERO,
786 self.style.selection_background_color,
787 Edges::default(),
788 Hsla::transparent_black(),
789 BorderStyle::default(),
790 ));
791 }
792 }
793 }
794
795 fn paint_mouse_listeners(
796 &mut self,
797 hitbox: &Hitbox,
798 rendered_text: &RenderedText,
799 window: &mut Window,
800 cx: &mut App,
801 ) {
802 if self.style.prevent_mouse_interaction {
803 return;
804 }
805
806 let is_hovering_link = hitbox.is_hovered(window)
807 && !self.markdown.read(cx).selection.pending
808 && rendered_text
809 .link_for_position(window.mouse_position())
810 .is_some();
811
812 if !self.style.prevent_mouse_interaction {
813 if is_hovering_link {
814 window.set_cursor_style(CursorStyle::PointingHand, hitbox);
815 } else {
816 window.set_cursor_style(CursorStyle::IBeam, hitbox);
817 }
818 }
819
820 let on_open_url = self.on_url_click.take();
821
822 self.on_mouse_event(window, cx, {
823 let hitbox = hitbox.clone();
824 move |markdown, event: &MouseDownEvent, phase, window, _| {
825 if phase.capture()
826 && event.button == MouseButton::Right
827 && hitbox.is_hovered(window)
828 {
829 // Capture selected text so it survives until menu item is clicked
830 markdown.capture_selection_for_context_menu();
831 }
832 }
833 });
834
835 self.on_mouse_event(window, cx, {
836 let rendered_text = rendered_text.clone();
837 let hitbox = hitbox.clone();
838 move |markdown, event: &MouseDownEvent, phase, window, cx| {
839 if hitbox.is_hovered(window) {
840 if phase.bubble() {
841 if let Some(link) = rendered_text.link_for_position(event.position) {
842 markdown.pressed_link = Some(link.clone());
843 } else {
844 let source_index =
845 match rendered_text.source_index_for_position(event.position) {
846 Ok(ix) | Err(ix) => ix,
847 };
848 let (range, mode) = match event.click_count {
849 1 => {
850 let range = source_index..source_index;
851 (range, SelectMode::Character)
852 }
853 2 => {
854 let range = rendered_text.surrounding_word_range(source_index);
855 (range.clone(), SelectMode::Word(range))
856 }
857 3 => {
858 let range = rendered_text.surrounding_line_range(source_index);
859 (range.clone(), SelectMode::Line(range))
860 }
861 _ => {
862 let range = 0..rendered_text
863 .lines
864 .last()
865 .map(|line| line.source_end)
866 .unwrap_or(0);
867 (range, SelectMode::All)
868 }
869 };
870 markdown.selection = Selection {
871 start: range.start,
872 end: range.end,
873 reversed: false,
874 pending: true,
875 mode,
876 };
877 window.focus(&markdown.focus_handle, cx);
878 }
879
880 window.prevent_default();
881 cx.notify();
882 }
883 } else if phase.capture() && event.button == MouseButton::Left {
884 markdown.selection = Selection::default();
885 markdown.pressed_link = None;
886 cx.notify();
887 }
888 }
889 });
890 self.on_mouse_event(window, cx, {
891 let rendered_text = rendered_text.clone();
892 let hitbox = hitbox.clone();
893 let was_hovering_link = is_hovering_link;
894 move |markdown, event: &MouseMoveEvent, phase, window, cx| {
895 if phase.capture() {
896 return;
897 }
898
899 if markdown.selection.pending {
900 let source_index = match rendered_text.source_index_for_position(event.position)
901 {
902 Ok(ix) | Err(ix) => ix,
903 };
904 markdown.selection.set_head(source_index, &rendered_text);
905 markdown.autoscroll_request = Some(source_index);
906 cx.notify();
907 } else {
908 let is_hovering_link = hitbox.is_hovered(window)
909 && rendered_text.link_for_position(event.position).is_some();
910 if is_hovering_link != was_hovering_link {
911 cx.notify();
912 }
913 }
914 }
915 });
916 self.on_mouse_event(window, cx, {
917 let rendered_text = rendered_text.clone();
918 move |markdown, event: &MouseUpEvent, phase, window, cx| {
919 if phase.bubble() {
920 if let Some(pressed_link) = markdown.pressed_link.take()
921 && Some(&pressed_link) == rendered_text.link_for_position(event.position)
922 {
923 if let Some(open_url) = on_open_url.as_ref() {
924 open_url(pressed_link.destination_url, window, cx);
925 } else {
926 cx.open_url(&pressed_link.destination_url);
927 }
928 }
929 } else if markdown.selection.pending {
930 markdown.selection.pending = false;
931 #[cfg(any(target_os = "linux", target_os = "freebsd"))]
932 {
933 let text = rendered_text
934 .text_for_range(markdown.selection.start..markdown.selection.end);
935 cx.write_to_primary(ClipboardItem::new_string(text))
936 }
937 cx.notify();
938 }
939 }
940 });
941 }
942
943 fn autoscroll(
944 &self,
945 rendered_text: &RenderedText,
946 window: &mut Window,
947 cx: &mut App,
948 ) -> Option<()> {
949 let autoscroll_index = self
950 .markdown
951 .update(cx, |markdown, _| markdown.autoscroll_request.take())?;
952 let (position, line_height) = rendered_text.position_for_source_index(autoscroll_index)?;
953
954 let text_style = self.style.base_text_style.clone();
955 let font_id = window.text_system().resolve_font(&text_style.font());
956 let font_size = text_style.font_size.to_pixels(window.rem_size());
957 let em_width = window.text_system().em_width(font_id, font_size).unwrap();
958 window.request_autoscroll(Bounds::from_corners(
959 point(position.x - 3. * em_width, position.y - 3. * line_height),
960 point(position.x + 3. * em_width, position.y + 3. * line_height),
961 ));
962 Some(())
963 }
964
965 fn on_mouse_event<T: MouseEvent>(
966 &self,
967 window: &mut Window,
968 _cx: &mut App,
969 mut f: impl 'static
970 + FnMut(&mut Markdown, &T, DispatchPhase, &mut Window, &mut Context<Markdown>),
971 ) {
972 window.on_mouse_event({
973 let markdown = self.markdown.downgrade();
974 move |event, phase, window, cx| {
975 markdown
976 .update(cx, |markdown, cx| f(markdown, event, phase, window, cx))
977 .log_err();
978 }
979 });
980 }
981}
982
983impl Styled for MarkdownElement {
984 fn style(&mut self) -> &mut StyleRefinement {
985 &mut self.style.container_style
986 }
987}
988
989impl Element for MarkdownElement {
990 type RequestLayoutState = RenderedMarkdown;
991 type PrepaintState = Hitbox;
992
993 fn id(&self) -> Option<ElementId> {
994 None
995 }
996
997 fn source_location(&self) -> Option<&'static core::panic::Location<'static>> {
998 None
999 }
1000
1001 fn request_layout(
1002 &mut self,
1003 _id: Option<&GlobalElementId>,
1004 _inspector_id: Option<&gpui::InspectorElementId>,
1005 window: &mut Window,
1006 cx: &mut App,
1007 ) -> (gpui::LayoutId, Self::RequestLayoutState) {
1008 let mut builder = MarkdownElementBuilder::new(
1009 &self.style.container_style,
1010 self.style.base_text_style.clone(),
1011 self.style.syntax.clone(),
1012 );
1013 let (parsed_markdown, images) = {
1014 let markdown = self.markdown.read(cx);
1015 (
1016 markdown.parsed_markdown.clone(),
1017 markdown.images_by_source_offset.clone(),
1018 )
1019 };
1020 let markdown_end = if let Some(last) = parsed_markdown.events.last() {
1021 last.0.end
1022 } else {
1023 0
1024 };
1025 let mut code_block_ids = HashSet::default();
1026
1027 let mut current_img_block_range: Option<Range<usize>> = None;
1028 for (index, (range, event)) in parsed_markdown.events.iter().enumerate() {
1029 // Skip alt text for images that rendered
1030 if let Some(current_img_block_range) = ¤t_img_block_range
1031 && current_img_block_range.end > range.end
1032 {
1033 continue;
1034 }
1035
1036 match event {
1037 MarkdownEvent::Start(tag) => {
1038 match tag {
1039 MarkdownTag::Image { .. } => {
1040 if let Some(image) = images.get(&range.start) {
1041 current_img_block_range = Some(range.clone());
1042 builder.modify_current_div(|el| {
1043 el.items_center()
1044 .flex()
1045 .flex_row()
1046 .child(img(image.clone()))
1047 });
1048 }
1049 }
1050 MarkdownTag::Paragraph => {
1051 builder.push_div(
1052 div().when(!self.style.height_is_multiple_of_line_height, |el| {
1053 el.mb_2().line_height(rems(1.3))
1054 }),
1055 range,
1056 markdown_end,
1057 );
1058 }
1059 MarkdownTag::Heading { level, .. } => {
1060 let mut heading = div().mb_2();
1061
1062 heading = apply_heading_style(
1063 heading,
1064 *level,
1065 self.style.heading_level_styles.as_ref(),
1066 );
1067
1068 heading.style().refine(&self.style.heading);
1069
1070 let text_style = self.style.heading.text_style().clone();
1071
1072 builder.push_text_style(text_style);
1073 builder.push_div(heading, range, markdown_end);
1074 }
1075 MarkdownTag::BlockQuote => {
1076 builder.push_text_style(self.style.block_quote.clone());
1077 builder.push_div(
1078 div()
1079 .pl_4()
1080 .mb_2()
1081 .border_l_4()
1082 .border_color(self.style.block_quote_border_color),
1083 range,
1084 markdown_end,
1085 );
1086 }
1087 MarkdownTag::CodeBlock { kind, .. } => {
1088 let language = match kind {
1089 CodeBlockKind::Fenced => None,
1090 CodeBlockKind::FencedLang(language) => {
1091 parsed_markdown.languages_by_name.get(language).cloned()
1092 }
1093 CodeBlockKind::FencedSrc(path_range) => parsed_markdown
1094 .languages_by_path
1095 .get(&path_range.path)
1096 .cloned(),
1097 _ => None,
1098 };
1099
1100 let is_indented = matches!(kind, CodeBlockKind::Indented);
1101 let scroll_handle = if self.style.code_block_overflow_x_scroll {
1102 code_block_ids.insert(range.start);
1103 Some(self.markdown.update(cx, |markdown, _| {
1104 markdown.code_block_scroll_handle(range.start)
1105 }))
1106 } else {
1107 None
1108 };
1109
1110 match (&self.code_block_renderer, is_indented) {
1111 (CodeBlockRenderer::Default { .. }, _) | (_, true) => {
1112 // This is a parent container that we can position the copy button inside.
1113 let parent_container =
1114 div().group("code_block").relative().w_full();
1115
1116 let mut parent_container: AnyDiv = if let Some(scroll_handle) =
1117 scroll_handle.as_ref()
1118 {
1119 let scrollbars = Scrollbars::new(ScrollAxes::Horizontal)
1120 .id(("markdown-code-block-scrollbar", range.start))
1121 .tracked_scroll_handle(scroll_handle)
1122 .with_track_along(
1123 ScrollAxes::Horizontal,
1124 cx.theme().colors().editor_background,
1125 )
1126 .notify_content();
1127
1128 parent_container
1129 .rounded_lg()
1130 .custom_scrollbars(scrollbars, window, cx)
1131 .into()
1132 } else {
1133 parent_container.into()
1134 };
1135
1136 if let CodeBlockRenderer::Default { border: true, .. } =
1137 &self.code_block_renderer
1138 {
1139 parent_container = parent_container
1140 .rounded_md()
1141 .border_1()
1142 .border_color(cx.theme().colors().border_variant);
1143 }
1144
1145 parent_container.style().refine(&self.style.code_block);
1146 builder.push_div(parent_container, range, markdown_end);
1147
1148 let code_block = div()
1149 .id(("code-block", range.start))
1150 .rounded_lg()
1151 .map(|mut code_block| {
1152 if let Some(scroll_handle) = scroll_handle.as_ref() {
1153 code_block.style().restrict_scroll_to_axis =
1154 Some(true);
1155 code_block
1156 .flex()
1157 .overflow_x_scroll()
1158 .track_scroll(scroll_handle)
1159 } else {
1160 code_block.w_full()
1161 }
1162 });
1163
1164 builder.push_text_style(self.style.code_block.text.to_owned());
1165 builder.push_code_block(language);
1166 builder.push_div(code_block, range, markdown_end);
1167 }
1168 (CodeBlockRenderer::Custom { .. }, _) => {}
1169 }
1170 }
1171 MarkdownTag::HtmlBlock => builder.push_div(div(), range, markdown_end),
1172 MarkdownTag::List(bullet_index) => {
1173 builder.push_list(*bullet_index);
1174 builder.push_div(div().pl_2p5(), range, markdown_end);
1175 }
1176 MarkdownTag::Item => {
1177 let bullet = if let Some((_, MarkdownEvent::TaskListMarker(checked))) =
1178 parsed_markdown.events.get(index.saturating_add(1))
1179 {
1180 let source = &parsed_markdown.source()[range.clone()];
1181
1182 Checkbox::new(
1183 ElementId::Name(source.to_string().into()),
1184 if *checked {
1185 ToggleState::Selected
1186 } else {
1187 ToggleState::Unselected
1188 },
1189 )
1190 .fill()
1191 .visualization_only(true)
1192 .into_any_element()
1193 } else if let Some(bullet_index) = builder.next_bullet_index() {
1194 div().child(format!("{}.", bullet_index)).into_any_element()
1195 } else {
1196 div().child("•").into_any_element()
1197 };
1198 builder.push_div(
1199 div()
1200 .when(!self.style.height_is_multiple_of_line_height, |el| {
1201 el.mb_1().gap_1().line_height(rems(1.3))
1202 })
1203 .h_flex()
1204 .items_start()
1205 .child(bullet),
1206 range,
1207 markdown_end,
1208 );
1209 // Without `w_0`, text doesn't wrap to the width of the container.
1210 builder.push_div(div().flex_1().w_0(), range, markdown_end);
1211 }
1212 MarkdownTag::Emphasis => builder.push_text_style(TextStyleRefinement {
1213 font_style: Some(FontStyle::Italic),
1214 ..Default::default()
1215 }),
1216 MarkdownTag::Strong => builder.push_text_style(TextStyleRefinement {
1217 font_weight: Some(FontWeight::BOLD),
1218 ..Default::default()
1219 }),
1220 MarkdownTag::Strikethrough => {
1221 builder.push_text_style(TextStyleRefinement {
1222 strikethrough: Some(StrikethroughStyle {
1223 thickness: px(1.),
1224 color: None,
1225 }),
1226 ..Default::default()
1227 })
1228 }
1229 MarkdownTag::Link { dest_url, .. } => {
1230 if builder.code_block_stack.is_empty() {
1231 builder.push_link(dest_url.clone(), range.clone());
1232 let style = self
1233 .style
1234 .link_callback
1235 .as_ref()
1236 .and_then(|callback| callback(dest_url, cx))
1237 .unwrap_or_else(|| self.style.link.clone());
1238 builder.push_text_style(style)
1239 }
1240 }
1241 MarkdownTag::MetadataBlock(_) => {}
1242 MarkdownTag::Table(alignments) => {
1243 builder.table.start(alignments.clone());
1244
1245 let column_count = alignments.len();
1246 builder.push_div(
1247 div()
1248 .id(("table", range.start))
1249 .grid()
1250 .grid_cols(column_count as u16)
1251 .when(self.style.table_columns_min_size, |this| {
1252 this.grid_cols_min_content(column_count as u16)
1253 })
1254 .when(!self.style.table_columns_min_size, |this| {
1255 this.grid_cols(column_count as u16)
1256 })
1257 .w_full()
1258 .mb_2()
1259 .border(px(1.5))
1260 .border_color(cx.theme().colors().border)
1261 .rounded_sm()
1262 .overflow_hidden(),
1263 range,
1264 markdown_end,
1265 );
1266 }
1267 MarkdownTag::TableHead => {
1268 builder.table.start_head();
1269 builder.push_text_style(TextStyleRefinement {
1270 font_weight: Some(FontWeight::SEMIBOLD),
1271 ..Default::default()
1272 });
1273 }
1274 MarkdownTag::TableRow => {
1275 builder.table.start_row();
1276 }
1277 MarkdownTag::TableCell => {
1278 let is_header = builder.table.in_head;
1279 let row_index = builder.table.row_index;
1280 let col_index = builder.table.col_index;
1281
1282 builder.push_div(
1283 div()
1284 .when(col_index > 0, |this| this.border_l_1())
1285 .when(row_index > 0, |this| this.border_t_1())
1286 .border_color(cx.theme().colors().border)
1287 .px_1()
1288 .py_0p5()
1289 .when(is_header, |this| {
1290 this.bg(cx.theme().colors().title_bar_background)
1291 })
1292 .when(!is_header && row_index % 2 == 1, |this| {
1293 this.bg(cx.theme().colors().panel_background)
1294 }),
1295 range,
1296 markdown_end,
1297 );
1298 }
1299 _ => log::debug!("unsupported markdown tag {:?}", tag),
1300 }
1301 }
1302 MarkdownEvent::End(tag) => match tag {
1303 MarkdownTagEnd::Image => {
1304 current_img_block_range.take();
1305 }
1306 MarkdownTagEnd::Paragraph => {
1307 builder.pop_div();
1308 }
1309 MarkdownTagEnd::Heading(_) => {
1310 builder.pop_div();
1311 builder.pop_text_style()
1312 }
1313 MarkdownTagEnd::BlockQuote(_kind) => {
1314 builder.pop_text_style();
1315 builder.pop_div()
1316 }
1317 MarkdownTagEnd::CodeBlock => {
1318 builder.trim_trailing_newline();
1319
1320 builder.pop_div();
1321 builder.pop_code_block();
1322 builder.pop_text_style();
1323
1324 if let CodeBlockRenderer::Default {
1325 copy_button: true, ..
1326 } = &self.code_block_renderer
1327 {
1328 builder.modify_current_div(|el| {
1329 let content_range = parser::extract_code_block_content_range(
1330 &parsed_markdown.source()[range.clone()],
1331 );
1332 let content_range = content_range.start + range.start
1333 ..content_range.end + range.start;
1334
1335 let code = parsed_markdown.source()[content_range].to_string();
1336 let codeblock = render_copy_code_block_button(
1337 range.end,
1338 code,
1339 self.markdown.clone(),
1340 );
1341 el.child(
1342 h_flex()
1343 .w_4()
1344 .absolute()
1345 .top_1p5()
1346 .right_1p5()
1347 .justify_end()
1348 .child(codeblock),
1349 )
1350 });
1351 }
1352
1353 if let CodeBlockRenderer::Default {
1354 copy_button_on_hover: true,
1355 ..
1356 } = &self.code_block_renderer
1357 {
1358 builder.modify_current_div(|el| {
1359 let content_range = parser::extract_code_block_content_range(
1360 &parsed_markdown.source()[range.clone()],
1361 );
1362 let content_range = content_range.start + range.start
1363 ..content_range.end + range.start;
1364
1365 let code = parsed_markdown.source()[content_range].to_string();
1366 let codeblock = render_copy_code_block_button(
1367 range.end,
1368 code,
1369 self.markdown.clone(),
1370 );
1371 el.child(
1372 h_flex()
1373 .w_4()
1374 .absolute()
1375 .top_0()
1376 .right_0()
1377 .justify_end()
1378 .visible_on_hover("code_block")
1379 .child(codeblock),
1380 )
1381 });
1382 }
1383
1384 // Pop the parent container.
1385 builder.pop_div();
1386 }
1387 MarkdownTagEnd::HtmlBlock => builder.pop_div(),
1388 MarkdownTagEnd::List(_) => {
1389 builder.pop_list();
1390 builder.pop_div();
1391 }
1392 MarkdownTagEnd::Item => {
1393 builder.pop_div();
1394 builder.pop_div();
1395 }
1396 MarkdownTagEnd::Emphasis => builder.pop_text_style(),
1397 MarkdownTagEnd::Strong => builder.pop_text_style(),
1398 MarkdownTagEnd::Strikethrough => builder.pop_text_style(),
1399 MarkdownTagEnd::Link => {
1400 if builder.code_block_stack.is_empty() {
1401 builder.pop_text_style()
1402 }
1403 }
1404 MarkdownTagEnd::Table => {
1405 builder.pop_div();
1406 builder.table.end();
1407 }
1408 MarkdownTagEnd::TableHead => {
1409 builder.pop_text_style();
1410 builder.table.end_head();
1411 }
1412 MarkdownTagEnd::TableRow => {
1413 builder.table.end_row();
1414 }
1415 MarkdownTagEnd::TableCell => {
1416 builder.pop_div();
1417 builder.table.end_cell();
1418 }
1419 _ => log::debug!("unsupported markdown tag end: {:?}", tag),
1420 },
1421 MarkdownEvent::Text => {
1422 builder.push_text(&parsed_markdown.source[range.clone()], range.clone());
1423 }
1424 MarkdownEvent::SubstitutedText(text) => {
1425 builder.push_text(text, range.clone());
1426 }
1427 MarkdownEvent::Code => {
1428 builder.push_text_style(self.style.inline_code.clone());
1429 builder.push_text(&parsed_markdown.source[range.clone()], range.clone());
1430 builder.pop_text_style();
1431 }
1432 MarkdownEvent::Html => {
1433 let html = &parsed_markdown.source[range.clone()];
1434 if html.starts_with("<!--") {
1435 builder.html_comment = true;
1436 }
1437 if html.trim_end().ends_with("-->") {
1438 builder.html_comment = false;
1439 continue;
1440 }
1441 if builder.html_comment {
1442 continue;
1443 }
1444 builder.push_text(html, range.clone());
1445 }
1446 MarkdownEvent::InlineHtml => {
1447 let html = &parsed_markdown.source[range.clone()];
1448 if html.starts_with("<code>") {
1449 builder.push_text_style(self.style.inline_code.clone());
1450 continue;
1451 }
1452 if html.trim_end().starts_with("</code>") {
1453 builder.pop_text_style();
1454 continue;
1455 }
1456 builder.push_text(&parsed_markdown.source[range.clone()], range.clone());
1457 }
1458 MarkdownEvent::Rule => {
1459 builder.push_div(
1460 div()
1461 .border_b_1()
1462 .my_2()
1463 .border_color(self.style.rule_color),
1464 range,
1465 markdown_end,
1466 );
1467 builder.pop_div()
1468 }
1469 MarkdownEvent::SoftBreak => builder.push_text(" ", range.clone()),
1470 MarkdownEvent::HardBreak => builder.push_text("\n", range.clone()),
1471 MarkdownEvent::TaskListMarker(_) => {
1472 // handled inside the `MarkdownTag::Item` case
1473 }
1474 _ => log::debug!("unsupported markdown event {:?}", event),
1475 }
1476 }
1477 if self.style.code_block_overflow_x_scroll {
1478 let code_block_ids = code_block_ids;
1479 self.markdown.update(cx, move |markdown, _| {
1480 markdown.retain_code_block_scroll_handles(&code_block_ids);
1481 });
1482 } else {
1483 self.markdown
1484 .update(cx, |markdown, _| markdown.clear_code_block_scroll_handles());
1485 }
1486 let mut rendered_markdown = builder.build();
1487 let child_layout_id = rendered_markdown.element.request_layout(window, cx);
1488 let layout_id = window.request_layout(gpui::Style::default(), [child_layout_id], cx);
1489 (layout_id, rendered_markdown)
1490 }
1491
1492 fn prepaint(
1493 &mut self,
1494 _id: Option<&GlobalElementId>,
1495 _inspector_id: Option<&gpui::InspectorElementId>,
1496 bounds: Bounds<Pixels>,
1497 rendered_markdown: &mut Self::RequestLayoutState,
1498 window: &mut Window,
1499 cx: &mut App,
1500 ) -> Self::PrepaintState {
1501 let focus_handle = self.markdown.read(cx).focus_handle.clone();
1502 window.set_focus_handle(&focus_handle, cx);
1503 window.set_view_id(self.markdown.entity_id());
1504
1505 let hitbox = window.insert_hitbox(bounds, HitboxBehavior::Normal);
1506 rendered_markdown.element.prepaint(window, cx);
1507 self.autoscroll(&rendered_markdown.text, window, cx);
1508 hitbox
1509 }
1510
1511 fn paint(
1512 &mut self,
1513 _id: Option<&GlobalElementId>,
1514 _inspector_id: Option<&gpui::InspectorElementId>,
1515 bounds: Bounds<Pixels>,
1516 rendered_markdown: &mut Self::RequestLayoutState,
1517 hitbox: &mut Self::PrepaintState,
1518 window: &mut Window,
1519 cx: &mut App,
1520 ) {
1521 let mut context = KeyContext::default();
1522 context.add("Markdown");
1523 window.set_key_context(context);
1524 window.on_action(std::any::TypeId::of::<crate::Copy>(), {
1525 let entity = self.markdown.clone();
1526 let text = rendered_markdown.text.clone();
1527 move |_, phase, window, cx| {
1528 let text = text.clone();
1529 if phase == DispatchPhase::Bubble {
1530 entity.update(cx, move |this, cx| this.copy(&text, window, cx))
1531 }
1532 }
1533 });
1534 window.on_action(std::any::TypeId::of::<crate::CopyAsMarkdown>(), {
1535 let entity = self.markdown.clone();
1536 move |_, phase, window, cx| {
1537 if phase == DispatchPhase::Bubble {
1538 entity.update(cx, move |this, cx| this.copy_as_markdown(window, cx))
1539 }
1540 }
1541 });
1542
1543 self.paint_mouse_listeners(hitbox, &rendered_markdown.text, window, cx);
1544 rendered_markdown.element.paint(window, cx);
1545 self.paint_selection(bounds, &rendered_markdown.text, window, cx);
1546 }
1547}
1548
1549fn apply_heading_style(
1550 mut heading: Div,
1551 level: pulldown_cmark::HeadingLevel,
1552 custom_styles: Option<&HeadingLevelStyles>,
1553) -> Div {
1554 heading = match level {
1555 pulldown_cmark::HeadingLevel::H1 => heading.text_3xl(),
1556 pulldown_cmark::HeadingLevel::H2 => heading.text_2xl(),
1557 pulldown_cmark::HeadingLevel::H3 => heading.text_xl(),
1558 pulldown_cmark::HeadingLevel::H4 => heading.text_lg(),
1559 pulldown_cmark::HeadingLevel::H5 => heading.text_base(),
1560 pulldown_cmark::HeadingLevel::H6 => heading.text_sm(),
1561 };
1562
1563 if let Some(styles) = custom_styles {
1564 let style_opt = match level {
1565 pulldown_cmark::HeadingLevel::H1 => &styles.h1,
1566 pulldown_cmark::HeadingLevel::H2 => &styles.h2,
1567 pulldown_cmark::HeadingLevel::H3 => &styles.h3,
1568 pulldown_cmark::HeadingLevel::H4 => &styles.h4,
1569 pulldown_cmark::HeadingLevel::H5 => &styles.h5,
1570 pulldown_cmark::HeadingLevel::H6 => &styles.h6,
1571 };
1572
1573 if let Some(style) = style_opt {
1574 heading.style().text = style.clone();
1575 }
1576 }
1577
1578 heading
1579}
1580
1581fn render_copy_code_block_button(
1582 id: usize,
1583 code: String,
1584 markdown: Entity<Markdown>,
1585) -> impl IntoElement {
1586 let id = ElementId::named_usize("copy-markdown-code", id);
1587
1588 CopyButton::new(id.clone(), code.clone()).custom_on_click({
1589 let markdown = markdown;
1590 move |_window, cx| {
1591 let id = id.clone();
1592 markdown.update(cx, |this, cx| {
1593 this.copied_code_blocks.insert(id.clone());
1594
1595 cx.write_to_clipboard(ClipboardItem::new_string(code.clone()));
1596
1597 cx.spawn(async move |this, cx| {
1598 cx.background_executor().timer(Duration::from_secs(2)).await;
1599
1600 cx.update(|cx| {
1601 this.update(cx, |this, cx| {
1602 this.copied_code_blocks.remove(&id);
1603 cx.notify();
1604 })
1605 })
1606 .ok();
1607 })
1608 .detach();
1609 });
1610 }
1611 })
1612}
1613
1614impl IntoElement for MarkdownElement {
1615 type Element = Self;
1616
1617 fn into_element(self) -> Self::Element {
1618 self
1619 }
1620}
1621
1622pub enum AnyDiv {
1623 Div(Div),
1624 Stateful(Stateful<Div>),
1625}
1626
1627impl AnyDiv {
1628 fn into_any_element(self) -> AnyElement {
1629 match self {
1630 Self::Div(div) => div.into_any_element(),
1631 Self::Stateful(div) => div.into_any_element(),
1632 }
1633 }
1634}
1635
1636impl From<Div> for AnyDiv {
1637 fn from(value: Div) -> Self {
1638 Self::Div(value)
1639 }
1640}
1641
1642impl From<Stateful<Div>> for AnyDiv {
1643 fn from(value: Stateful<Div>) -> Self {
1644 Self::Stateful(value)
1645 }
1646}
1647
1648impl Styled for AnyDiv {
1649 fn style(&mut self) -> &mut StyleRefinement {
1650 match self {
1651 Self::Div(div) => div.style(),
1652 Self::Stateful(div) => div.style(),
1653 }
1654 }
1655}
1656
1657impl ParentElement for AnyDiv {
1658 fn extend(&mut self, elements: impl IntoIterator<Item = AnyElement>) {
1659 match self {
1660 Self::Div(div) => div.extend(elements),
1661 Self::Stateful(div) => div.extend(elements),
1662 }
1663 }
1664}
1665
1666#[derive(Default)]
1667struct TableState {
1668 alignments: Vec<Alignment>,
1669 in_head: bool,
1670 row_index: usize,
1671 col_index: usize,
1672}
1673
1674impl TableState {
1675 fn start(&mut self, alignments: Vec<Alignment>) {
1676 self.alignments = alignments;
1677 self.in_head = false;
1678 self.row_index = 0;
1679 self.col_index = 0;
1680 }
1681
1682 fn end(&mut self) {
1683 self.alignments.clear();
1684 self.in_head = false;
1685 self.row_index = 0;
1686 self.col_index = 0;
1687 }
1688
1689 fn start_head(&mut self) {
1690 self.in_head = true;
1691 }
1692
1693 fn end_head(&mut self) {
1694 self.in_head = false;
1695 }
1696
1697 fn start_row(&mut self) {
1698 self.col_index = 0;
1699 }
1700
1701 fn end_row(&mut self) {
1702 self.row_index += 1;
1703 }
1704
1705 fn end_cell(&mut self) {
1706 self.col_index += 1;
1707 }
1708}
1709
1710struct MarkdownElementBuilder {
1711 div_stack: Vec<AnyDiv>,
1712 rendered_lines: Vec<RenderedLine>,
1713 pending_line: PendingLine,
1714 rendered_links: Vec<RenderedLink>,
1715 current_source_index: usize,
1716 html_comment: bool,
1717 base_text_style: TextStyle,
1718 text_style_stack: Vec<TextStyleRefinement>,
1719 code_block_stack: Vec<Option<Arc<Language>>>,
1720 list_stack: Vec<ListStackEntry>,
1721 table: TableState,
1722 syntax_theme: Arc<SyntaxTheme>,
1723}
1724
1725#[derive(Default)]
1726struct PendingLine {
1727 text: String,
1728 runs: Vec<TextRun>,
1729 source_mappings: Vec<SourceMapping>,
1730}
1731
1732struct ListStackEntry {
1733 bullet_index: Option<u64>,
1734}
1735
1736impl MarkdownElementBuilder {
1737 fn new(
1738 container_style: &StyleRefinement,
1739 base_text_style: TextStyle,
1740 syntax_theme: Arc<SyntaxTheme>,
1741 ) -> Self {
1742 Self {
1743 div_stack: vec![{
1744 let mut base_div = div();
1745 base_div.style().refine(container_style);
1746 base_div.debug_selector(|| "inner".into()).into()
1747 }],
1748 rendered_lines: Vec::new(),
1749 pending_line: PendingLine::default(),
1750 rendered_links: Vec::new(),
1751 current_source_index: 0,
1752 html_comment: false,
1753 base_text_style,
1754 text_style_stack: Vec::new(),
1755 code_block_stack: Vec::new(),
1756 list_stack: Vec::new(),
1757 table: TableState::default(),
1758 syntax_theme,
1759 }
1760 }
1761
1762 fn push_text_style(&mut self, style: TextStyleRefinement) {
1763 self.text_style_stack.push(style);
1764 }
1765
1766 fn text_style(&self) -> TextStyle {
1767 let mut style = self.base_text_style.clone();
1768 for refinement in &self.text_style_stack {
1769 style.refine(refinement);
1770 }
1771 style
1772 }
1773
1774 fn pop_text_style(&mut self) {
1775 self.text_style_stack.pop();
1776 }
1777
1778 fn push_div(&mut self, div: impl Into<AnyDiv>, range: &Range<usize>, markdown_end: usize) {
1779 let mut div = div.into();
1780 self.flush_text();
1781
1782 if range.start == 0 {
1783 // Remove the top margin on the first element.
1784 div.style().refine(&StyleRefinement {
1785 margin: gpui::EdgesRefinement {
1786 top: Some(Length::Definite(px(0.).into())),
1787 left: None,
1788 right: None,
1789 bottom: None,
1790 },
1791 ..Default::default()
1792 });
1793 }
1794
1795 if range.end == markdown_end {
1796 div.style().refine(&StyleRefinement {
1797 margin: gpui::EdgesRefinement {
1798 top: None,
1799 left: None,
1800 right: None,
1801 bottom: Some(Length::Definite(rems(0.).into())),
1802 },
1803 ..Default::default()
1804 });
1805 }
1806
1807 self.div_stack.push(div);
1808 }
1809
1810 fn modify_current_div(&mut self, f: impl FnOnce(AnyDiv) -> AnyDiv) {
1811 self.flush_text();
1812 if let Some(div) = self.div_stack.pop() {
1813 self.div_stack.push(f(div));
1814 }
1815 }
1816
1817 fn pop_div(&mut self) {
1818 self.flush_text();
1819 let div = self.div_stack.pop().unwrap().into_any_element();
1820 self.div_stack.last_mut().unwrap().extend(iter::once(div));
1821 }
1822
1823 fn push_list(&mut self, bullet_index: Option<u64>) {
1824 self.list_stack.push(ListStackEntry { bullet_index });
1825 }
1826
1827 fn next_bullet_index(&mut self) -> Option<u64> {
1828 self.list_stack.last_mut().and_then(|entry| {
1829 let item_index = entry.bullet_index.as_mut()?;
1830 *item_index += 1;
1831 Some(*item_index - 1)
1832 })
1833 }
1834
1835 fn pop_list(&mut self) {
1836 self.list_stack.pop();
1837 }
1838
1839 fn push_code_block(&mut self, language: Option<Arc<Language>>) {
1840 self.code_block_stack.push(language);
1841 }
1842
1843 fn pop_code_block(&mut self) {
1844 self.code_block_stack.pop();
1845 }
1846
1847 fn push_link(&mut self, destination_url: SharedString, source_range: Range<usize>) {
1848 self.rendered_links.push(RenderedLink {
1849 source_range,
1850 destination_url,
1851 });
1852 }
1853
1854 fn push_text(&mut self, text: &str, source_range: Range<usize>) {
1855 self.pending_line.source_mappings.push(SourceMapping {
1856 rendered_index: self.pending_line.text.len(),
1857 source_index: source_range.start,
1858 });
1859 self.pending_line.text.push_str(text);
1860 self.current_source_index = source_range.end;
1861
1862 if let Some(Some(language)) = self.code_block_stack.last() {
1863 let mut offset = 0;
1864 for (range, highlight_id) in language.highlight_text(&Rope::from(text), 0..text.len()) {
1865 if range.start > offset {
1866 self.pending_line
1867 .runs
1868 .push(self.text_style().to_run(range.start - offset));
1869 }
1870
1871 let mut run_style = self.text_style();
1872 if let Some(highlight) = highlight_id.style(&self.syntax_theme) {
1873 run_style = run_style.highlight(highlight);
1874 }
1875 self.pending_line.runs.push(run_style.to_run(range.len()));
1876 offset = range.end;
1877 }
1878
1879 if offset < text.len() {
1880 self.pending_line
1881 .runs
1882 .push(self.text_style().to_run(text.len() - offset));
1883 }
1884 } else {
1885 self.pending_line
1886 .runs
1887 .push(self.text_style().to_run(text.len()));
1888 }
1889 }
1890
1891 fn trim_trailing_newline(&mut self) {
1892 if self.pending_line.text.ends_with('\n') {
1893 self.pending_line
1894 .text
1895 .truncate(self.pending_line.text.len() - 1);
1896 self.pending_line.runs.last_mut().unwrap().len -= 1;
1897 self.current_source_index -= 1;
1898 }
1899 }
1900
1901 fn flush_text(&mut self) {
1902 let line = mem::take(&mut self.pending_line);
1903 if line.text.is_empty() {
1904 return;
1905 }
1906
1907 let text = StyledText::new(line.text).with_runs(line.runs);
1908 self.rendered_lines.push(RenderedLine {
1909 layout: text.layout().clone(),
1910 source_mappings: line.source_mappings,
1911 source_end: self.current_source_index,
1912 language: self.code_block_stack.last().cloned().flatten(),
1913 });
1914 self.div_stack.last_mut().unwrap().extend([text.into_any()]);
1915 }
1916
1917 fn build(mut self) -> RenderedMarkdown {
1918 debug_assert_eq!(self.div_stack.len(), 1);
1919 self.flush_text();
1920 RenderedMarkdown {
1921 element: self.div_stack.pop().unwrap().into_any_element(),
1922 text: RenderedText {
1923 lines: self.rendered_lines.into(),
1924 links: self.rendered_links.into(),
1925 },
1926 }
1927 }
1928}
1929
1930struct RenderedLine {
1931 layout: TextLayout,
1932 source_mappings: Vec<SourceMapping>,
1933 source_end: usize,
1934 language: Option<Arc<Language>>,
1935}
1936
1937impl RenderedLine {
1938 fn rendered_index_for_source_index(&self, source_index: usize) -> usize {
1939 if source_index >= self.source_end {
1940 return self.layout.len();
1941 }
1942
1943 let mapping = match self
1944 .source_mappings
1945 .binary_search_by_key(&source_index, |probe| probe.source_index)
1946 {
1947 Ok(ix) => &self.source_mappings[ix],
1948 Err(ix) => &self.source_mappings[ix - 1],
1949 };
1950 mapping.rendered_index + (source_index - mapping.source_index)
1951 }
1952
1953 fn source_index_for_rendered_index(&self, rendered_index: usize) -> usize {
1954 if rendered_index >= self.layout.len() {
1955 return self.source_end;
1956 }
1957
1958 let mapping = match self
1959 .source_mappings
1960 .binary_search_by_key(&rendered_index, |probe| probe.rendered_index)
1961 {
1962 Ok(ix) => &self.source_mappings[ix],
1963 Err(ix) => &self.source_mappings[ix - 1],
1964 };
1965 mapping.source_index + (rendered_index - mapping.rendered_index)
1966 }
1967
1968 /// Returns the source index for use as an exclusive range end at a word/selection boundary.
1969 /// When the rendered index is exactly at the start of a segment with a gap from the previous
1970 /// segment (e.g., after stripped markdown syntax like backticks), this returns the end of the
1971 /// previous segment rather than the start of the current one.
1972 fn source_index_for_exclusive_rendered_end(&self, rendered_index: usize) -> usize {
1973 if rendered_index >= self.layout.len() {
1974 return self.source_end;
1975 }
1976
1977 let ix = match self
1978 .source_mappings
1979 .binary_search_by_key(&rendered_index, |probe| probe.rendered_index)
1980 {
1981 Ok(ix) => ix,
1982 Err(ix) => {
1983 return self.source_mappings[ix - 1].source_index
1984 + (rendered_index - self.source_mappings[ix - 1].rendered_index);
1985 }
1986 };
1987
1988 // Exact match at the start of a segment. Check if there's a gap from the previous segment.
1989 if ix > 0 {
1990 let prev_mapping = &self.source_mappings[ix - 1];
1991 let mapping = &self.source_mappings[ix];
1992 let prev_segment_len = mapping.rendered_index - prev_mapping.rendered_index;
1993 let prev_source_end = prev_mapping.source_index + prev_segment_len;
1994 if prev_source_end < mapping.source_index {
1995 return prev_source_end;
1996 }
1997 }
1998
1999 self.source_mappings[ix].source_index
2000 }
2001
2002 fn source_index_for_position(&self, position: Point<Pixels>) -> Result<usize, usize> {
2003 let line_rendered_index;
2004 let out_of_bounds;
2005 match self.layout.index_for_position(position) {
2006 Ok(ix) => {
2007 line_rendered_index = ix;
2008 out_of_bounds = false;
2009 }
2010 Err(ix) => {
2011 line_rendered_index = ix;
2012 out_of_bounds = true;
2013 }
2014 };
2015 let source_index = self.source_index_for_rendered_index(line_rendered_index);
2016 if out_of_bounds {
2017 Err(source_index)
2018 } else {
2019 Ok(source_index)
2020 }
2021 }
2022}
2023
2024#[derive(Copy, Clone, Debug, Default)]
2025struct SourceMapping {
2026 rendered_index: usize,
2027 source_index: usize,
2028}
2029
2030pub struct RenderedMarkdown {
2031 element: AnyElement,
2032 text: RenderedText,
2033}
2034
2035#[derive(Clone)]
2036struct RenderedText {
2037 lines: Rc<[RenderedLine]>,
2038 links: Rc<[RenderedLink]>,
2039}
2040
2041#[derive(Debug, Clone, Eq, PartialEq)]
2042struct RenderedLink {
2043 source_range: Range<usize>,
2044 destination_url: SharedString,
2045}
2046
2047impl RenderedText {
2048 fn source_index_for_position(&self, position: Point<Pixels>) -> Result<usize, usize> {
2049 let mut lines = self.lines.iter().peekable();
2050 let mut fallback_line: Option<&RenderedLine> = None;
2051
2052 while let Some(line) = lines.next() {
2053 let line_bounds = line.layout.bounds();
2054
2055 // Exact match: position is within bounds (handles overlapping bounds like table columns)
2056 if line_bounds.contains(&position) {
2057 return line.source_index_for_position(position);
2058 }
2059
2060 // Track fallback for Y-coordinate based matching
2061 if position.y <= line_bounds.bottom() && fallback_line.is_none() {
2062 fallback_line = Some(line);
2063 }
2064
2065 // Handle gap between lines
2066 if position.y > line_bounds.bottom() {
2067 if let Some(next_line) = lines.peek()
2068 && position.y < next_line.layout.bounds().top()
2069 {
2070 return Err(line.source_end);
2071 }
2072 }
2073 }
2074
2075 // Fall back to Y-coordinate matched line
2076 if let Some(line) = fallback_line {
2077 return line.source_index_for_position(position);
2078 }
2079
2080 Err(self.lines.last().map_or(0, |line| line.source_end))
2081 }
2082
2083 fn position_for_source_index(&self, source_index: usize) -> Option<(Point<Pixels>, Pixels)> {
2084 for line in self.lines.iter() {
2085 let line_source_start = line.source_mappings.first().unwrap().source_index;
2086 if source_index < line_source_start {
2087 break;
2088 } else if source_index > line.source_end {
2089 continue;
2090 } else {
2091 let line_height = line.layout.line_height();
2092 let rendered_index_within_line = line.rendered_index_for_source_index(source_index);
2093 let position = line.layout.position_for_index(rendered_index_within_line)?;
2094 return Some((position, line_height));
2095 }
2096 }
2097 None
2098 }
2099
2100 fn surrounding_word_range(&self, source_index: usize) -> Range<usize> {
2101 for line in self.lines.iter() {
2102 if source_index > line.source_end {
2103 continue;
2104 }
2105
2106 let line_rendered_start = line.source_mappings.first().unwrap().rendered_index;
2107 let rendered_index_in_line =
2108 line.rendered_index_for_source_index(source_index) - line_rendered_start;
2109 let text = line.layout.text();
2110
2111 let scope = line.language.as_ref().map(|l| l.default_scope());
2112 let classifier = CharClassifier::new(scope);
2113
2114 let mut prev_chars = text[..rendered_index_in_line].chars().rev().peekable();
2115 let mut next_chars = text[rendered_index_in_line..].chars().peekable();
2116
2117 let word_kind = std::cmp::max(
2118 prev_chars.peek().map(|&c| classifier.kind(c)),
2119 next_chars.peek().map(|&c| classifier.kind(c)),
2120 );
2121
2122 let mut start = rendered_index_in_line;
2123 for c in prev_chars {
2124 if Some(classifier.kind(c)) == word_kind {
2125 start -= c.len_utf8();
2126 } else {
2127 break;
2128 }
2129 }
2130
2131 let mut end = rendered_index_in_line;
2132 for c in next_chars {
2133 if Some(classifier.kind(c)) == word_kind {
2134 end += c.len_utf8();
2135 } else {
2136 break;
2137 }
2138 }
2139
2140 return line.source_index_for_rendered_index(line_rendered_start + start)
2141 ..line.source_index_for_exclusive_rendered_end(line_rendered_start + end);
2142 }
2143
2144 source_index..source_index
2145 }
2146
2147 fn surrounding_line_range(&self, source_index: usize) -> Range<usize> {
2148 for line in self.lines.iter() {
2149 if source_index > line.source_end {
2150 continue;
2151 }
2152 let line_source_start = line.source_mappings.first().unwrap().source_index;
2153 return line_source_start..line.source_end;
2154 }
2155
2156 source_index..source_index
2157 }
2158
2159 fn text_for_range(&self, range: Range<usize>) -> String {
2160 let mut accumulator = String::new();
2161
2162 for line in self.lines.iter() {
2163 if range.start > line.source_end {
2164 continue;
2165 }
2166 let line_source_start = line.source_mappings.first().unwrap().source_index;
2167 if range.end < line_source_start {
2168 break;
2169 }
2170
2171 let text = line.layout.text();
2172
2173 let start = if range.start < line_source_start {
2174 0
2175 } else {
2176 line.rendered_index_for_source_index(range.start)
2177 };
2178 let end = if range.end > line.source_end {
2179 line.rendered_index_for_source_index(line.source_end)
2180 } else {
2181 line.rendered_index_for_source_index(range.end)
2182 }
2183 .min(text.len());
2184
2185 accumulator.push_str(&text[start..end]);
2186 accumulator.push('\n');
2187 }
2188 // Remove trailing newline
2189 accumulator.pop();
2190 accumulator
2191 }
2192
2193 fn link_for_position(&self, position: Point<Pixels>) -> Option<&RenderedLink> {
2194 let source_index = self.source_index_for_position(position).ok()?;
2195 self.links
2196 .iter()
2197 .find(|link| link.source_range.contains(&source_index))
2198 }
2199}
2200
2201#[cfg(test)]
2202mod tests {
2203 use super::*;
2204 use gpui::{TestAppContext, size};
2205 use language::{Language, LanguageConfig, LanguageMatcher};
2206 use std::sync::Arc;
2207
2208 fn ensure_theme_initialized(cx: &mut TestAppContext) {
2209 cx.update(|cx| {
2210 if !cx.has_global::<settings::SettingsStore>() {
2211 settings::init(cx);
2212 }
2213 if !cx.has_global::<theme::GlobalTheme>() {
2214 theme::init(theme::LoadThemes::JustBase, cx);
2215 }
2216 });
2217 }
2218
2219 #[gpui::test]
2220 fn test_mappings(cx: &mut TestAppContext) {
2221 // Formatting.
2222 assert_mappings(
2223 &render_markdown("He*l*lo", cx),
2224 vec![vec![(0, 0), (1, 1), (2, 3), (3, 5), (4, 6), (5, 7)]],
2225 );
2226
2227 // Multiple lines.
2228 assert_mappings(
2229 &render_markdown("Hello\n\nWorld", cx),
2230 vec![
2231 vec![(0, 0), (1, 1), (2, 2), (3, 3), (4, 4), (5, 5)],
2232 vec![(0, 7), (1, 8), (2, 9), (3, 10), (4, 11), (5, 12)],
2233 ],
2234 );
2235
2236 // Multi-byte characters.
2237 assert_mappings(
2238 &render_markdown("αβγ\n\nδεζ", cx),
2239 vec![
2240 vec![(0, 0), (2, 2), (4, 4), (6, 6)],
2241 vec![(0, 8), (2, 10), (4, 12), (6, 14)],
2242 ],
2243 );
2244
2245 // Smart quotes.
2246 assert_mappings(&render_markdown("\"", cx), vec![vec![(0, 0), (3, 1)]]);
2247 assert_mappings(
2248 &render_markdown("\"hey\"", cx),
2249 vec![vec![(0, 0), (3, 1), (4, 2), (5, 3), (6, 4), (9, 5)]],
2250 );
2251
2252 // HTML Comments are ignored
2253 assert_mappings(
2254 &render_markdown(
2255 "<!--\nrdoc-file=string.c\n- str.intern -> symbol\n- str.to_sym -> symbol\n-->\nReturns",
2256 cx,
2257 ),
2258 vec![vec![
2259 (0, 78),
2260 (1, 79),
2261 (2, 80),
2262 (3, 81),
2263 (4, 82),
2264 (5, 83),
2265 (6, 84),
2266 ]],
2267 );
2268 }
2269
2270 fn render_markdown(markdown: &str, cx: &mut TestAppContext) -> RenderedText {
2271 render_markdown_with_language_registry(markdown, None, cx)
2272 }
2273
2274 fn render_markdown_with_language_registry(
2275 markdown: &str,
2276 language_registry: Option<Arc<LanguageRegistry>>,
2277 cx: &mut TestAppContext,
2278 ) -> RenderedText {
2279 struct TestWindow;
2280
2281 impl Render for TestWindow {
2282 fn render(&mut self, _: &mut Window, _: &mut Context<Self>) -> impl IntoElement {
2283 div()
2284 }
2285 }
2286
2287 ensure_theme_initialized(cx);
2288
2289 let (_, cx) = cx.add_window_view(|_, _| TestWindow);
2290 let markdown =
2291 cx.new(|cx| Markdown::new(markdown.to_string().into(), language_registry, None, cx));
2292 cx.run_until_parked();
2293 let (rendered, _) = cx.draw(
2294 Default::default(),
2295 size(px(600.0), px(600.0)),
2296 |_window, _cx| {
2297 MarkdownElement::new(markdown, MarkdownStyle::default()).code_block_renderer(
2298 CodeBlockRenderer::Default {
2299 copy_button: false,
2300 copy_button_on_hover: false,
2301 border: false,
2302 },
2303 )
2304 },
2305 );
2306 rendered.text
2307 }
2308
2309 #[gpui::test]
2310 fn test_surrounding_word_range(cx: &mut TestAppContext) {
2311 let rendered = render_markdown("Hello world tesεζ", cx);
2312
2313 // Test word selection for "Hello"
2314 let word_range = rendered.surrounding_word_range(2); // Simulate click on 'l' in "Hello"
2315 let selected_text = rendered.text_for_range(word_range);
2316 assert_eq!(selected_text, "Hello");
2317
2318 // Test word selection for "world"
2319 let word_range = rendered.surrounding_word_range(7); // Simulate click on 'o' in "world"
2320 let selected_text = rendered.text_for_range(word_range);
2321 assert_eq!(selected_text, "world");
2322
2323 // Test word selection for "tesεζ"
2324 let word_range = rendered.surrounding_word_range(14); // Simulate click on 's' in "tesεζ"
2325 let selected_text = rendered.text_for_range(word_range);
2326 assert_eq!(selected_text, "tesεζ");
2327
2328 // Test word selection at word boundary (space)
2329 let word_range = rendered.surrounding_word_range(5); // Simulate click on space between "Hello" and "world", expect highlighting word to the left
2330 let selected_text = rendered.text_for_range(word_range);
2331 assert_eq!(selected_text, "Hello");
2332 }
2333
2334 #[gpui::test]
2335 fn test_surrounding_line_range(cx: &mut TestAppContext) {
2336 let rendered = render_markdown("First line\n\nSecond line\n\nThird lineεζ", cx);
2337
2338 // Test getting line range for first line
2339 let line_range = rendered.surrounding_line_range(5); // Simulate click somewhere in first line
2340 let selected_text = rendered.text_for_range(line_range);
2341 assert_eq!(selected_text, "First line");
2342
2343 // Test getting line range for second line
2344 let line_range = rendered.surrounding_line_range(13); // Simulate click at beginning in second line
2345 let selected_text = rendered.text_for_range(line_range);
2346 assert_eq!(selected_text, "Second line");
2347
2348 // Test getting line range for third line
2349 let line_range = rendered.surrounding_line_range(37); // Simulate click at end of third line with multi-byte chars
2350 let selected_text = rendered.text_for_range(line_range);
2351 assert_eq!(selected_text, "Third lineεζ");
2352 }
2353
2354 #[gpui::test]
2355 fn test_selection_head_movement(cx: &mut TestAppContext) {
2356 let rendered = render_markdown("Hello world test", cx);
2357
2358 let mut selection = Selection {
2359 start: 5,
2360 end: 5,
2361 reversed: false,
2362 pending: false,
2363 mode: SelectMode::Character,
2364 };
2365
2366 // Test forward selection
2367 selection.set_head(10, &rendered);
2368 assert_eq!(selection.start, 5);
2369 assert_eq!(selection.end, 10);
2370 assert!(!selection.reversed);
2371 assert_eq!(selection.tail(), 5);
2372
2373 // Test backward selection
2374 selection.set_head(2, &rendered);
2375 assert_eq!(selection.start, 2);
2376 assert_eq!(selection.end, 5);
2377 assert!(selection.reversed);
2378 assert_eq!(selection.tail(), 5);
2379
2380 // Test forward selection again from reversed state
2381 selection.set_head(15, &rendered);
2382 assert_eq!(selection.start, 5);
2383 assert_eq!(selection.end, 15);
2384 assert!(!selection.reversed);
2385 assert_eq!(selection.tail(), 5);
2386 }
2387
2388 #[gpui::test]
2389 fn test_word_selection_drag(cx: &mut TestAppContext) {
2390 let rendered = render_markdown("Hello world test", cx);
2391
2392 // Start with a simulated double-click on "world" (index 6-10)
2393 let word_range = rendered.surrounding_word_range(7); // Click on 'o' in "world"
2394 let mut selection = Selection {
2395 start: word_range.start,
2396 end: word_range.end,
2397 reversed: false,
2398 pending: true,
2399 mode: SelectMode::Word(word_range),
2400 };
2401
2402 // Drag forward to "test" - should expand selection to include "test"
2403 selection.set_head(13, &rendered); // Index in "test"
2404 assert_eq!(selection.start, 6); // Start of "world"
2405 assert_eq!(selection.end, 16); // End of "test"
2406 assert!(!selection.reversed);
2407 let selected_text = rendered.text_for_range(selection.start..selection.end);
2408 assert_eq!(selected_text, "world test");
2409
2410 // Drag backward to "Hello" - should expand selection to include "Hello"
2411 selection.set_head(2, &rendered); // Index in "Hello"
2412 assert_eq!(selection.start, 0); // Start of "Hello"
2413 assert_eq!(selection.end, 11); // End of "world" (original selection)
2414 assert!(selection.reversed);
2415 let selected_text = rendered.text_for_range(selection.start..selection.end);
2416 assert_eq!(selected_text, "Hello world");
2417
2418 // Drag back within original word - should revert to original selection
2419 selection.set_head(8, &rendered); // Back within "world"
2420 assert_eq!(selection.start, 6); // Start of "world"
2421 assert_eq!(selection.end, 11); // End of "world"
2422 assert!(!selection.reversed);
2423 let selected_text = rendered.text_for_range(selection.start..selection.end);
2424 assert_eq!(selected_text, "world");
2425 }
2426
2427 #[gpui::test]
2428 fn test_selection_with_markdown_formatting(cx: &mut TestAppContext) {
2429 let rendered = render_markdown(
2430 "This is **bold** text, this is *italic* text, use `code` here",
2431 cx,
2432 );
2433 let word_range = rendered.surrounding_word_range(10); // Inside "bold"
2434 let selected_text = rendered.text_for_range(word_range);
2435 assert_eq!(selected_text, "bold");
2436
2437 let word_range = rendered.surrounding_word_range(32); // Inside "italic"
2438 let selected_text = rendered.text_for_range(word_range);
2439 assert_eq!(selected_text, "italic");
2440
2441 let word_range = rendered.surrounding_word_range(51); // Inside "code"
2442 let selected_text = rendered.text_for_range(word_range);
2443 assert_eq!(selected_text, "code");
2444 }
2445
2446 #[gpui::test]
2447 fn test_table_column_selection(cx: &mut TestAppContext) {
2448 let rendered = render_markdown("| a | b |\n|---|---|\n| c | d |", cx);
2449
2450 assert!(rendered.lines.len() >= 2);
2451 let first_bounds = rendered.lines[0].layout.bounds();
2452 let second_bounds = rendered.lines[1].layout.bounds();
2453
2454 let first_index = match rendered.source_index_for_position(first_bounds.center()) {
2455 Ok(index) | Err(index) => index,
2456 };
2457 let second_index = match rendered.source_index_for_position(second_bounds.center()) {
2458 Ok(index) | Err(index) => index,
2459 };
2460
2461 let first_word = rendered.text_for_range(rendered.surrounding_word_range(first_index));
2462 let second_word = rendered.text_for_range(rendered.surrounding_word_range(second_index));
2463
2464 assert_eq!(first_word, "a");
2465 assert_eq!(second_word, "b");
2466 }
2467
2468 #[gpui::test]
2469 fn test_inline_code_word_selection_excludes_backticks(cx: &mut TestAppContext) {
2470 // Test that double-clicking on inline code selects just the code content,
2471 // not the backticks. This verifies the fix for the bug where selecting
2472 // inline code would include the trailing backtick.
2473 let rendered = render_markdown("use `blah` here", cx);
2474
2475 // Source layout: "use `blah` here"
2476 // 0123456789...
2477 // The inline code "blah" is at source positions 5-8 (content range 5..9)
2478
2479 // Click inside "blah" - should select just "blah", not "blah`"
2480 let word_range = rendered.surrounding_word_range(6); // 'l' in "blah"
2481
2482 // text_for_range extracts from the rendered text (without backticks), so it
2483 // would return "blah" even with a wrong source range. We check it anyway.
2484 let selected_text = rendered.text_for_range(word_range.clone());
2485 assert_eq!(selected_text, "blah");
2486
2487 // The source range is what matters for copy_as_markdown and selected_text,
2488 // which extract directly from the source. With the bug, this would be 5..10
2489 // which includes the closing backtick at position 9.
2490 assert_eq!(word_range, 5..9);
2491 }
2492
2493 #[gpui::test]
2494 fn test_surrounding_word_range_respects_word_characters(cx: &mut TestAppContext) {
2495 let rendered = render_markdown("foo.bar() baz", cx);
2496
2497 // Double clicking on 'f' in "foo" - should select just "foo"
2498 let word_range = rendered.surrounding_word_range(0);
2499 let selected_text = rendered.text_for_range(word_range);
2500 assert_eq!(selected_text, "foo");
2501
2502 // Double clicking on 'b' in "bar" - should select just "bar"
2503 let word_range = rendered.surrounding_word_range(4);
2504 let selected_text = rendered.text_for_range(word_range);
2505 assert_eq!(selected_text, "bar");
2506
2507 // Double clicking on 'b' in "baz" - should select "baz"
2508 let word_range = rendered.surrounding_word_range(10);
2509 let selected_text = rendered.text_for_range(word_range);
2510 assert_eq!(selected_text, "baz");
2511
2512 // Double clicking selects word characters in code blocks
2513 let javascript_language = Arc::new(Language::new(
2514 LanguageConfig {
2515 name: "JavaScript".into(),
2516 matcher: LanguageMatcher {
2517 path_suffixes: vec!["js".to_string()],
2518 ..Default::default()
2519 },
2520 word_characters: ['$', '#'].into_iter().collect(),
2521 ..Default::default()
2522 },
2523 None,
2524 ));
2525
2526 let language_registry = Arc::new(LanguageRegistry::test(cx.executor()));
2527 language_registry.add(javascript_language);
2528
2529 let rendered = render_markdown_with_language_registry(
2530 "```javascript\n$foo #bar\n```",
2531 Some(language_registry),
2532 cx,
2533 );
2534
2535 let word_range = rendered.surrounding_word_range(14);
2536 let selected_text = rendered.text_for_range(word_range);
2537 assert_eq!(selected_text, "$foo");
2538
2539 let word_range = rendered.surrounding_word_range(19);
2540 let selected_text = rendered.text_for_range(word_range);
2541 assert_eq!(selected_text, "#bar");
2542 }
2543
2544 #[gpui::test]
2545 fn test_all_selection(cx: &mut TestAppContext) {
2546 let rendered = render_markdown("Hello world\n\nThis is a test\n\nwith multiple lines", cx);
2547
2548 let total_length = rendered
2549 .lines
2550 .last()
2551 .map(|line| line.source_end)
2552 .unwrap_or(0);
2553
2554 let mut selection = Selection {
2555 start: 0,
2556 end: total_length,
2557 reversed: false,
2558 pending: true,
2559 mode: SelectMode::All,
2560 };
2561
2562 selection.set_head(5, &rendered); // Try to set head in middle
2563 assert_eq!(selection.start, 0);
2564 assert_eq!(selection.end, total_length);
2565 assert!(!selection.reversed);
2566
2567 selection.set_head(25, &rendered); // Try to set head near end
2568 assert_eq!(selection.start, 0);
2569 assert_eq!(selection.end, total_length);
2570 assert!(!selection.reversed);
2571
2572 let selected_text = rendered.text_for_range(selection.start..selection.end);
2573 assert_eq!(
2574 selected_text,
2575 "Hello world\nThis is a test\nwith multiple lines"
2576 );
2577 }
2578
2579 #[test]
2580 fn test_escape() {
2581 assert_eq!(Markdown::escape("hello `world`"), "hello \\`world\\`");
2582 assert_eq!(
2583 Markdown::escape("hello\n cool world"),
2584 "hello\n\ncool world"
2585 );
2586 }
2587
2588 #[track_caller]
2589 fn assert_mappings(rendered: &RenderedText, expected: Vec<Vec<(usize, usize)>>) {
2590 assert_eq!(rendered.lines.len(), expected.len(), "line count mismatch");
2591 for (line_ix, line_mappings) in expected.into_iter().enumerate() {
2592 let line = &rendered.lines[line_ix];
2593
2594 assert!(
2595 line.source_mappings.windows(2).all(|mappings| {
2596 mappings[0].source_index < mappings[1].source_index
2597 && mappings[0].rendered_index < mappings[1].rendered_index
2598 }),
2599 "line {} has duplicate mappings: {:?}",
2600 line_ix,
2601 line.source_mappings
2602 );
2603
2604 for (rendered_ix, source_ix) in line_mappings {
2605 assert_eq!(
2606 line.source_index_for_rendered_index(rendered_ix),
2607 source_ix,
2608 "line {}, rendered_ix {}",
2609 line_ix,
2610 rendered_ix
2611 );
2612
2613 assert_eq!(
2614 line.rendered_index_for_source_index(source_ix),
2615 rendered_ix,
2616 "line {}, source_ix {}",
2617 line_ix,
2618 source_ix
2619 );
2620 }
2621 }
2622 }
2623}