markdown_preview: Improved markdown rendering support (#7345)
This PR improves support for rendering markdown documents. ## After the updates https://github.com/zed-industries/zed/assets/18583882/48315901-563d-44c6-8265-8390e8eed942 ## Before the updates https://github.com/zed-industries/zed/assets/18583882/6d7ddb55-41f7-492e-af12-6ab54559f612 ## New features - @SomeoneToIgnore's [scrolling feature request](https://github.com/zed-industries/zed/pull/6958#pullrequestreview-1850458632). - Checkboxes (`- [ ]` and `- [x]`) - Inline code blocks. - Ordered and unordered lists at an arbitrary depth. - Block quotes that render nested content, like code blocks. - Lists that render nested content, like code blocks. - Block quotes that support variable heading sizes and the other markdown features added [here](https://github.com/zed-industries/zed/pull/6958). - Users can see and click internal links (`[See the docs](./docs.md)`). ## Notable changes - Removed dependency on `rich_text`. - Added a new method for parsing markdown into renderable structs. This method uses recursive descent so it can easily support more complex markdown documents. - Parsing does not happen for every call to `MarkdownPreviewView::render` anymore. ## TODO - [ ] Typing should move the markdown preview cursor. ## Future work under consideration - If a title exists for a link, show it on hover. - Images. - Since this PR brings the most support for markdown, we can consolidate `languages/markdown` and `rich_text` to use this new renderer. Note that the updated inline text rendering method in this PR originated from `langauges/markdown`. - Syntax highlighting in code blocks. - Footnote references. - Inline HTML. - Strikethrough support. - Scrolling improvements: - Handle automatic preview scrolling when multiple cursors are used in the editor. - > great to see that the render now respects editor's scrolls, but can we also support the vice-versa (as syntax tree does it in Zed) — when scrolling the render, it would be good to scroll the editor too - > sometimes it's hard to understand where the "caret" on the render is, so I wonder if we could go even further with its placement and place it inside the text, as a regular caret? Maybe even support the selections? - > switching to another markdown tab does not change the rendered contents and when I call the render command again, the screen gets another split — I would rather prefer to have Zed's syntax tree behavior: there's always a single panel that renders things for whatever tab is active now. At least we should not split if there's already a split, rather adding the new rendered tab there. - > plaintext URLs could get a highlight and the click action ## Release Notes - Improved support for markdown rendering.
This commit is contained in:
Kieran Gill
GitHub
parent
cbe7a12e65
commit
61b8d3639f
7 changed files with 1784 additions and 370 deletions
|
|
@ -1,346 +1,322 @@
|
|||
use std::{ops::Range, sync::Arc};
|
||||
|
||||
use gpui::{
|
||||
div, px, rems, AnyElement, DefiniteLength, Div, ElementId, Hsla, ParentElement, SharedString,
|
||||
Styled, StyledText, WindowContext,
|
||||
use crate::markdown_elements::{
|
||||
HeadingLevel, Link, ParsedMarkdown, ParsedMarkdownBlockQuote, ParsedMarkdownCodeBlock,
|
||||
ParsedMarkdownElement, ParsedMarkdownHeading, ParsedMarkdownList, ParsedMarkdownListItemType,
|
||||
ParsedMarkdownTable, ParsedMarkdownTableAlignment, ParsedMarkdownTableRow, ParsedMarkdownText,
|
||||
};
|
||||
use language::LanguageRegistry;
|
||||
use pulldown_cmark::{Alignment, CodeBlockKind, Event, HeadingLevel, Options, Parser, Tag};
|
||||
use rich_text::render_rich_text;
|
||||
use theme::{ActiveTheme, Theme};
|
||||
use ui::{h_flex, v_flex};
|
||||
use gpui::{
|
||||
div, px, rems, AbsoluteLength, AnyElement, DefiniteLength, Div, Element, ElementId,
|
||||
HighlightStyle, Hsla, InteractiveText, IntoElement, ParentElement, SharedString, Styled,
|
||||
StyledText, TextStyle, WeakView, WindowContext,
|
||||
};
|
||||
use std::{ops::Range, sync::Arc};
|
||||
use theme::{ActiveTheme, SyntaxTheme};
|
||||
use ui::{h_flex, v_flex, Label};
|
||||
use workspace::Workspace;
|
||||
|
||||
enum TableState {
|
||||
Header,
|
||||
Body,
|
||||
}
|
||||
|
||||
struct MarkdownTable {
|
||||
column_alignments: Vec<Alignment>,
|
||||
header: Vec<Div>,
|
||||
body: Vec<Vec<Div>>,
|
||||
current_row: Vec<Div>,
|
||||
state: TableState,
|
||||
pub struct RenderContext {
|
||||
workspace: Option<WeakView<Workspace>>,
|
||||
next_id: usize,
|
||||
text_style: TextStyle,
|
||||
border_color: Hsla,
|
||||
text_color: Hsla,
|
||||
text_muted_color: Hsla,
|
||||
code_block_background_color: Hsla,
|
||||
code_span_background_color: Hsla,
|
||||
syntax_theme: Arc<SyntaxTheme>,
|
||||
indent: usize,
|
||||
}
|
||||
|
||||
impl MarkdownTable {
|
||||
fn new(border_color: Hsla, column_alignments: Vec<Alignment>) -> Self {
|
||||
Self {
|
||||
column_alignments,
|
||||
header: Vec::new(),
|
||||
body: Vec::new(),
|
||||
current_row: Vec::new(),
|
||||
state: TableState::Header,
|
||||
border_color,
|
||||
impl RenderContext {
|
||||
pub fn new(workspace: Option<WeakView<Workspace>>, cx: &WindowContext) -> RenderContext {
|
||||
let theme = cx.theme().clone();
|
||||
|
||||
RenderContext {
|
||||
workspace,
|
||||
next_id: 0,
|
||||
indent: 0,
|
||||
text_style: cx.text_style(),
|
||||
syntax_theme: theme.syntax().clone(),
|
||||
border_color: theme.colors().border,
|
||||
text_color: theme.colors().text,
|
||||
text_muted_color: theme.colors().text_muted,
|
||||
code_block_background_color: theme.colors().surface_background,
|
||||
code_span_background_color: theme.colors().editor_document_highlight_read_background,
|
||||
}
|
||||
}
|
||||
|
||||
fn finish_row(&mut self) {
|
||||
match self.state {
|
||||
TableState::Header => {
|
||||
self.header.extend(self.current_row.drain(..));
|
||||
self.state = TableState::Body;
|
||||
}
|
||||
TableState::Body => {
|
||||
self.body.push(self.current_row.drain(..).collect());
|
||||
}
|
||||
}
|
||||
fn next_id(&mut self, span: &Range<usize>) -> ElementId {
|
||||
let id = format!("markdown-{}-{}-{}", self.next_id, span.start, span.end);
|
||||
self.next_id += 1;
|
||||
ElementId::from(SharedString::from(id))
|
||||
}
|
||||
|
||||
fn add_cell(&mut self, contents: AnyElement) {
|
||||
let container = match self.alignment_for_next_cell() {
|
||||
Alignment::Left | Alignment::None => div(),
|
||||
Alignment::Center => v_flex().items_center(),
|
||||
Alignment::Right => v_flex().items_end(),
|
||||
/// This ensures that children inside of block quotes
|
||||
/// have padding between them.
|
||||
///
|
||||
/// For example, for this markdown:
|
||||
///
|
||||
/// ```markdown
|
||||
/// > This is a block quote.
|
||||
/// >
|
||||
/// > And this is the next paragraph.
|
||||
/// ```
|
||||
///
|
||||
/// We give padding between "This is a block quote."
|
||||
/// and "And this is the next paragraph."
|
||||
fn with_common_p(&self, element: Div) -> Div {
|
||||
if self.indent > 0 {
|
||||
element.pb_3()
|
||||
} else {
|
||||
element
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
pub fn render_parsed_markdown(
|
||||
parsed: &ParsedMarkdown,
|
||||
workspace: Option<WeakView<Workspace>>,
|
||||
cx: &WindowContext,
|
||||
) -> Vec<AnyElement> {
|
||||
let mut cx = RenderContext::new(workspace, cx);
|
||||
let mut elements = Vec::new();
|
||||
|
||||
for child in &parsed.children {
|
||||
elements.push(render_markdown_block(child, &mut cx));
|
||||
}
|
||||
|
||||
return elements;
|
||||
}
|
||||
|
||||
pub fn render_markdown_block(block: &ParsedMarkdownElement, cx: &mut RenderContext) -> AnyElement {
|
||||
use ParsedMarkdownElement::*;
|
||||
match block {
|
||||
Paragraph(text) => render_markdown_paragraph(text, cx),
|
||||
Heading(heading) => render_markdown_heading(heading, cx),
|
||||
List(list) => render_markdown_list(list, cx),
|
||||
Table(table) => render_markdown_table(table, cx),
|
||||
BlockQuote(block_quote) => render_markdown_block_quote(block_quote, cx),
|
||||
CodeBlock(code_block) => render_markdown_code_block(code_block, cx),
|
||||
HorizontalRule(_) => render_markdown_rule(cx),
|
||||
}
|
||||
}
|
||||
|
||||
fn render_markdown_heading(parsed: &ParsedMarkdownHeading, cx: &mut RenderContext) -> AnyElement {
|
||||
let size = match parsed.level {
|
||||
HeadingLevel::H1 => rems(2.),
|
||||
HeadingLevel::H2 => rems(1.5),
|
||||
HeadingLevel::H3 => rems(1.25),
|
||||
HeadingLevel::H4 => rems(1.),
|
||||
HeadingLevel::H5 => rems(0.875),
|
||||
HeadingLevel::H6 => rems(0.85),
|
||||
};
|
||||
|
||||
let color = match parsed.level {
|
||||
HeadingLevel::H6 => cx.text_muted_color,
|
||||
_ => cx.text_color,
|
||||
};
|
||||
|
||||
let line_height = DefiniteLength::from(rems(1.25));
|
||||
|
||||
div()
|
||||
.line_height(line_height)
|
||||
.text_size(size)
|
||||
.text_color(color)
|
||||
.pt(rems(0.15))
|
||||
.pb_1()
|
||||
.child(render_markdown_text(&parsed.contents, cx))
|
||||
.into_any()
|
||||
}
|
||||
|
||||
fn render_markdown_list(parsed: &ParsedMarkdownList, cx: &mut RenderContext) -> AnyElement {
|
||||
use ParsedMarkdownListItemType::*;
|
||||
|
||||
let mut items = vec![];
|
||||
for item in &parsed.children {
|
||||
let padding = rems((item.depth - 1) as f32 * 0.25);
|
||||
|
||||
let bullet = match item.item_type {
|
||||
Ordered(order) => format!("{}.", order),
|
||||
Unordered => "•".to_string(),
|
||||
Task(checked) => if checked { "☑" } else { "☐" }.to_string(),
|
||||
};
|
||||
let bullet = div().mr_2().child(Label::new(bullet));
|
||||
|
||||
let contents: Vec<AnyElement> = item
|
||||
.contents
|
||||
.iter()
|
||||
.map(|c| render_markdown_block(c.as_ref(), cx))
|
||||
.collect();
|
||||
|
||||
let item = h_flex()
|
||||
.pl(DefiniteLength::Absolute(AbsoluteLength::Rems(padding)))
|
||||
.items_start()
|
||||
.children(vec![bullet, div().children(contents).pr_2().w_full()]);
|
||||
|
||||
items.push(item);
|
||||
}
|
||||
|
||||
cx.with_common_p(div()).children(items).into_any()
|
||||
}
|
||||
|
||||
fn render_markdown_table(parsed: &ParsedMarkdownTable, cx: &mut RenderContext) -> AnyElement {
|
||||
let header = render_markdown_table_row(&parsed.header, &parsed.column_alignments, true, cx);
|
||||
|
||||
let body: Vec<AnyElement> = parsed
|
||||
.body
|
||||
.iter()
|
||||
.map(|row| render_markdown_table_row(row, &parsed.column_alignments, false, cx))
|
||||
.collect();
|
||||
|
||||
cx.with_common_p(v_flex())
|
||||
.w_full()
|
||||
.child(header)
|
||||
.children(body)
|
||||
.into_any()
|
||||
}
|
||||
|
||||
fn render_markdown_table_row(
|
||||
parsed: &ParsedMarkdownTableRow,
|
||||
alignments: &Vec<ParsedMarkdownTableAlignment>,
|
||||
is_header: bool,
|
||||
cx: &mut RenderContext,
|
||||
) -> AnyElement {
|
||||
let mut items = vec![];
|
||||
|
||||
for cell in &parsed.children {
|
||||
let alignment = alignments
|
||||
.get(items.len())
|
||||
.copied()
|
||||
.unwrap_or(ParsedMarkdownTableAlignment::None);
|
||||
|
||||
let contents = render_markdown_text(cell, cx);
|
||||
|
||||
let container = match alignment {
|
||||
ParsedMarkdownTableAlignment::Left | ParsedMarkdownTableAlignment::None => div(),
|
||||
ParsedMarkdownTableAlignment::Center => v_flex().items_center(),
|
||||
ParsedMarkdownTableAlignment::Right => v_flex().items_end(),
|
||||
};
|
||||
|
||||
let cell = container
|
||||
let mut cell = container
|
||||
.w_full()
|
||||
.child(contents)
|
||||
.px_2()
|
||||
.py_1()
|
||||
.border_color(self.border_color);
|
||||
.border_color(cx.border_color);
|
||||
|
||||
let cell = match self.state {
|
||||
TableState::Header => cell.border_2(),
|
||||
TableState::Body => cell.border_1(),
|
||||
};
|
||||
|
||||
self.current_row.push(cell);
|
||||
}
|
||||
|
||||
fn finish(self) -> Div {
|
||||
let mut table = v_flex().w_full();
|
||||
let mut header = h_flex();
|
||||
|
||||
for cell in self.header {
|
||||
header = header.child(cell);
|
||||
if is_header {
|
||||
cell = cell.border_2()
|
||||
} else {
|
||||
cell = cell.border_1()
|
||||
}
|
||||
table = table.child(header);
|
||||
for row in self.body {
|
||||
let mut row_div = h_flex();
|
||||
for cell in row {
|
||||
row_div = row_div.child(cell);
|
||||
}
|
||||
table = table.child(row_div);
|
||||
}
|
||||
table
|
||||
|
||||
items.push(cell);
|
||||
}
|
||||
|
||||
fn alignment_for_next_cell(&self) -> Alignment {
|
||||
self.column_alignments
|
||||
.get(self.current_row.len())
|
||||
.copied()
|
||||
.unwrap_or(Alignment::None)
|
||||
}
|
||||
h_flex().children(items).into_any_element()
|
||||
}
|
||||
|
||||
struct Renderer<I> {
|
||||
source_contents: String,
|
||||
iter: I,
|
||||
theme: Arc<Theme>,
|
||||
finished: Vec<Div>,
|
||||
language_registry: Arc<LanguageRegistry>,
|
||||
table: Option<MarkdownTable>,
|
||||
list_depth: usize,
|
||||
block_quote_depth: usize,
|
||||
fn render_markdown_block_quote(
|
||||
parsed: &ParsedMarkdownBlockQuote,
|
||||
cx: &mut RenderContext,
|
||||
) -> AnyElement {
|
||||
cx.indent += 1;
|
||||
|
||||
let children: Vec<AnyElement> = parsed
|
||||
.children
|
||||
.iter()
|
||||
.map(|child| render_markdown_block(child, cx))
|
||||
.collect();
|
||||
|
||||
cx.indent -= 1;
|
||||
|
||||
cx.with_common_p(div())
|
||||
.child(
|
||||
div()
|
||||
.border_l_4()
|
||||
.border_color(cx.border_color)
|
||||
.pl_3()
|
||||
.children(children),
|
||||
)
|
||||
.into_any()
|
||||
}
|
||||
|
||||
impl<'a, I> Renderer<I>
|
||||
where
|
||||
I: Iterator<Item = (Event<'a>, Range<usize>)>,
|
||||
{
|
||||
fn new(
|
||||
iter: I,
|
||||
source_contents: String,
|
||||
language_registry: &Arc<LanguageRegistry>,
|
||||
theme: Arc<Theme>,
|
||||
) -> Self {
|
||||
Self {
|
||||
iter,
|
||||
source_contents,
|
||||
theme,
|
||||
table: None,
|
||||
finished: vec![],
|
||||
language_registry: language_registry.clone(),
|
||||
list_depth: 0,
|
||||
block_quote_depth: 0,
|
||||
}
|
||||
}
|
||||
|
||||
fn run(mut self, cx: &WindowContext) -> Self {
|
||||
while let Some((event, source_range)) = self.iter.next() {
|
||||
match event {
|
||||
Event::Start(tag) => {
|
||||
self.start_tag(tag);
|
||||
}
|
||||
Event::End(tag) => {
|
||||
self.end_tag(tag, source_range, cx);
|
||||
}
|
||||
Event::Rule => {
|
||||
let rule = div().w_full().h(px(2.)).bg(self.theme.colors().border);
|
||||
self.finished.push(div().mb_4().child(rule));
|
||||
}
|
||||
_ => {}
|
||||
}
|
||||
}
|
||||
self
|
||||
}
|
||||
|
||||
fn start_tag(&mut self, tag: Tag<'a>) {
|
||||
match tag {
|
||||
Tag::List(_) => {
|
||||
self.list_depth += 1;
|
||||
}
|
||||
Tag::BlockQuote => {
|
||||
self.block_quote_depth += 1;
|
||||
}
|
||||
Tag::Table(column_alignments) => {
|
||||
self.table = Some(MarkdownTable::new(
|
||||
self.theme.colors().border,
|
||||
column_alignments,
|
||||
));
|
||||
}
|
||||
_ => {}
|
||||
}
|
||||
}
|
||||
|
||||
fn end_tag(&mut self, tag: Tag, source_range: Range<usize>, cx: &WindowContext) {
|
||||
match tag {
|
||||
Tag::Paragraph => {
|
||||
if self.list_depth > 0 || self.block_quote_depth > 0 {
|
||||
return;
|
||||
}
|
||||
|
||||
let element = self.render_md_from_range(source_range.clone(), cx);
|
||||
let paragraph = div().mb_3().child(element);
|
||||
|
||||
self.finished.push(paragraph);
|
||||
}
|
||||
Tag::Heading(level, _, _) => {
|
||||
let mut headline = self.headline(level);
|
||||
if source_range.start > 0 {
|
||||
headline = headline.mt_4();
|
||||
}
|
||||
|
||||
let element = self.render_md_from_range(source_range.clone(), cx);
|
||||
let headline = headline.child(element);
|
||||
|
||||
self.finished.push(headline);
|
||||
}
|
||||
Tag::List(_) => {
|
||||
if self.list_depth == 1 {
|
||||
let element = self.render_md_from_range(source_range.clone(), cx);
|
||||
let list = div().mb_3().child(element);
|
||||
|
||||
self.finished.push(list);
|
||||
}
|
||||
|
||||
self.list_depth -= 1;
|
||||
}
|
||||
Tag::BlockQuote => {
|
||||
let element = self.render_md_from_range(source_range.clone(), cx);
|
||||
|
||||
let block_quote = h_flex()
|
||||
.mb_3()
|
||||
.child(
|
||||
div()
|
||||
.w(px(4.))
|
||||
.bg(self.theme.colors().border)
|
||||
.h_full()
|
||||
.mr_2()
|
||||
.mt_1(),
|
||||
)
|
||||
.text_color(self.theme.colors().text_muted)
|
||||
.child(element);
|
||||
|
||||
self.finished.push(block_quote);
|
||||
|
||||
self.block_quote_depth -= 1;
|
||||
}
|
||||
Tag::CodeBlock(kind) => {
|
||||
let contents = self.source_contents[source_range.clone()].trim();
|
||||
let contents = contents.trim_start_matches("```");
|
||||
let contents = contents.trim_end_matches("```");
|
||||
let contents = match kind {
|
||||
CodeBlockKind::Fenced(language) => {
|
||||
contents.trim_start_matches(&language.to_string())
|
||||
}
|
||||
CodeBlockKind::Indented => contents,
|
||||
};
|
||||
let contents: String = contents.into();
|
||||
let contents = SharedString::from(contents);
|
||||
|
||||
let code_block = div()
|
||||
.mb_3()
|
||||
.px_4()
|
||||
.py_0()
|
||||
.bg(self.theme.colors().surface_background)
|
||||
.child(StyledText::new(contents));
|
||||
|
||||
self.finished.push(code_block);
|
||||
}
|
||||
Tag::Table(_alignment) => {
|
||||
if self.table.is_none() {
|
||||
log::error!("Table end without table ({:?})", source_range);
|
||||
return;
|
||||
}
|
||||
|
||||
let table = self.table.take().unwrap();
|
||||
let table = table.finish().mb_4();
|
||||
self.finished.push(table);
|
||||
}
|
||||
Tag::TableHead => {
|
||||
if self.table.is_none() {
|
||||
log::error!("Table head without table ({:?})", source_range);
|
||||
return;
|
||||
}
|
||||
|
||||
self.table.as_mut().unwrap().finish_row();
|
||||
}
|
||||
Tag::TableRow => {
|
||||
if self.table.is_none() {
|
||||
log::error!("Table row without table ({:?})", source_range);
|
||||
return;
|
||||
}
|
||||
|
||||
self.table.as_mut().unwrap().finish_row();
|
||||
}
|
||||
Tag::TableCell => {
|
||||
if self.table.is_none() {
|
||||
log::error!("Table cell without table ({:?})", source_range);
|
||||
return;
|
||||
}
|
||||
|
||||
let contents = self.render_md_from_range(source_range.clone(), cx);
|
||||
self.table.as_mut().unwrap().add_cell(contents);
|
||||
}
|
||||
_ => {}
|
||||
}
|
||||
}
|
||||
|
||||
fn render_md_from_range(
|
||||
&self,
|
||||
source_range: Range<usize>,
|
||||
cx: &WindowContext,
|
||||
) -> gpui::AnyElement {
|
||||
let mentions = &[];
|
||||
let language = None;
|
||||
let paragraph = &self.source_contents[source_range.clone()];
|
||||
let rich_text = render_rich_text(
|
||||
paragraph.into(),
|
||||
mentions,
|
||||
&self.language_registry,
|
||||
language,
|
||||
);
|
||||
let id: ElementId = source_range.start.into();
|
||||
rich_text.element(id, cx)
|
||||
}
|
||||
|
||||
fn headline(&self, level: HeadingLevel) -> Div {
|
||||
let size = match level {
|
||||
HeadingLevel::H1 => rems(2.),
|
||||
HeadingLevel::H2 => rems(1.5),
|
||||
HeadingLevel::H3 => rems(1.25),
|
||||
HeadingLevel::H4 => rems(1.),
|
||||
HeadingLevel::H5 => rems(0.875),
|
||||
HeadingLevel::H6 => rems(0.85),
|
||||
};
|
||||
|
||||
let color = match level {
|
||||
HeadingLevel::H6 => self.theme.colors().text_muted,
|
||||
_ => self.theme.colors().text,
|
||||
};
|
||||
|
||||
let line_height = DefiniteLength::from(rems(1.25));
|
||||
|
||||
let headline = h_flex()
|
||||
.w_full()
|
||||
.line_height(line_height)
|
||||
.text_size(size)
|
||||
.text_color(color)
|
||||
.mb_4()
|
||||
.pb(rems(0.15));
|
||||
|
||||
headline
|
||||
}
|
||||
fn render_markdown_code_block(
|
||||
parsed: &ParsedMarkdownCodeBlock,
|
||||
cx: &mut RenderContext,
|
||||
) -> AnyElement {
|
||||
cx.with_common_p(div())
|
||||
.px_3()
|
||||
.py_3()
|
||||
.bg(cx.code_block_background_color)
|
||||
.child(StyledText::new(parsed.contents.clone()))
|
||||
.into_any()
|
||||
}
|
||||
|
||||
pub fn render_markdown(
|
||||
markdown_input: &str,
|
||||
language_registry: &Arc<LanguageRegistry>,
|
||||
cx: &WindowContext,
|
||||
) -> Vec<Div> {
|
||||
let theme = cx.theme().clone();
|
||||
let options = Options::all();
|
||||
let parser = Parser::new_ext(markdown_input, options);
|
||||
let renderer = Renderer::new(
|
||||
parser.into_offset_iter(),
|
||||
markdown_input.to_owned(),
|
||||
language_registry,
|
||||
theme,
|
||||
fn render_markdown_paragraph(parsed: &ParsedMarkdownText, cx: &mut RenderContext) -> AnyElement {
|
||||
cx.with_common_p(div())
|
||||
.child(render_markdown_text(parsed, cx))
|
||||
.into_any_element()
|
||||
}
|
||||
|
||||
fn render_markdown_text(parsed: &ParsedMarkdownText, cx: &mut RenderContext) -> AnyElement {
|
||||
let element_id = cx.next_id(&parsed.source_range);
|
||||
|
||||
let highlights = gpui::combine_highlights(
|
||||
parsed.highlights.iter().filter_map(|(range, highlight)| {
|
||||
let highlight = highlight.to_highlight_style(&cx.syntax_theme)?;
|
||||
Some((range.clone(), highlight))
|
||||
}),
|
||||
parsed
|
||||
.regions
|
||||
.iter()
|
||||
.zip(&parsed.region_ranges)
|
||||
.filter_map(|(region, range)| {
|
||||
if region.code {
|
||||
Some((
|
||||
range.clone(),
|
||||
HighlightStyle {
|
||||
background_color: Some(cx.code_span_background_color),
|
||||
..Default::default()
|
||||
},
|
||||
))
|
||||
} else {
|
||||
None
|
||||
}
|
||||
}),
|
||||
);
|
||||
let renderer = renderer.run(cx);
|
||||
return renderer.finished;
|
||||
|
||||
let mut links = Vec::new();
|
||||
let mut link_ranges = Vec::new();
|
||||
for (range, region) in parsed.region_ranges.iter().zip(&parsed.regions) {
|
||||
if let Some(link) = region.link.clone() {
|
||||
links.push(link);
|
||||
link_ranges.push(range.clone());
|
||||
}
|
||||
}
|
||||
|
||||
let workspace = cx.workspace.clone();
|
||||
|
||||
InteractiveText::new(
|
||||
element_id,
|
||||
StyledText::new(parsed.contents.clone()).with_highlights(&cx.text_style, highlights),
|
||||
)
|
||||
.on_click(
|
||||
link_ranges,
|
||||
move |clicked_range_ix, window_cx| match &links[clicked_range_ix] {
|
||||
Link::Web { url } => window_cx.open_url(url),
|
||||
Link::Path { path } => {
|
||||
if let Some(workspace) = &workspace {
|
||||
_ = workspace.update(window_cx, |workspace, cx| {
|
||||
workspace.open_abs_path(path.clone(), false, cx).detach();
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
)
|
||||
.into_any_element()
|
||||
}
|
||||
|
||||
fn render_markdown_rule(cx: &mut RenderContext) -> AnyElement {
|
||||
let rule = div().w_full().h(px(2.)).bg(cx.border_color);
|
||||
div().pt_3().pb_3().child(rule).into_any()
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue