Very basic Rich Text Support (#9733)

* Add is_markdown property

* Add builtins.slint line

* Add parse_markdown function

* Formatting

* Add strikethrough

* Assume that end tags always match and don't contain any additional info

* Layout rich text

* Formatting

* Handle code blocks, hackily do indentation and list points

* Remove dbg!

* Apply a few suggestions

* Write unit tests

* Do a 3rd layer of bullet point indentation

* Test nested lists

* Add markdown text component

* Add a paragraph_from_text function

* Remove MarkdownText if SLINT_ENABLE_EXPERIMENTAL_FEATURES is not set

* Mark as experimental

* [autofix.ci] apply automated fixes

* Add cfg flag to test

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

Author: expenses

api/cpp/cbindgen.rs

@@ -304,6 +304,7 @@ fn gen_corelib(
         "Flickable",
         "SimpleText",
         "ComplexText",
+        "MarkdownText",
         "Path",
         "WindowItem",
         "TextInput",

internal/compiler/builtins.slint

@@ -120,6 +120,18 @@ component ComplexText inherits SimpleText {
 
 export { ComplexText as Text }
 
+export component MarkdownText inherits SimpleText {
+    in property <string> font-family;
+    in property <bool> font-italic;
+    in property <TextOverflow> overflow;
+    in property <TextWrap> wrap;
+    in property <length> letter-spacing;
+    in property <brush> stroke;
+    in property <length> stroke-width;
+    in property <TextStrokeStyle> stroke-style;
+    //-default_size_binding:implicit_size
+}
+
 export component TouchArea {
     in property <bool> enabled: true;
     out property <bool> pressed;

internal/compiler/passes/embed_glyphs.rs

@@ -559,7 +559,7 @@ pub fn collect_font_sizes_used(
         .to_string()
         .as_str()
     {
-        "TextInput" | "Text" | "SimpleText" | "ComplexText" => {
+        "TextInput" | "Text" | "SimpleText" | "ComplexText" | "MarkdownText" => {
             if let Some(font_size) = try_extract_font_size_from_element(elem, "font-size") {
                 add_font_size(font_size)
             }

internal/compiler/typeregister.rs

@@ -585,6 +585,8 @@ impl TypeRegister {
         register.elements.remove("DropArea").unwrap();
         register.types.remove("DropEvent").unwrap(); // Also removed in xtask/src/slintdocs.rs
 
+        register.elements.remove("MarkdownText").unwrap();
+
         Rc::new(RefCell::new(register))
     }
 

internal/core/Cargo.toml

@@ -63,6 +63,8 @@ raw-window-handle-06 = ["dep:raw-window-handle-06"]
 
 experimental = []
 
+experimental-rich-text = ["dep:pulldown-cmark"]
+
 unstable-wgpu-26 = ["dep:wgpu-26"]
 unstable-wgpu-27 = ["dep:wgpu-27"]
 
@@ -106,6 +108,7 @@ integer-sqrt = { version = "0.1.5" }
 bytemuck = { workspace = true, optional = true, features = ["derive"] }
 sys-locale = { version = "0.3.2", optional = true }
 parley = { version = "0.6.0", optional = true }
+pulldown-cmark = { version = "0.13.0", optional = true }
 
 image = { workspace = true, optional = true, default-features = false }
 clru = { workspace = true, optional = true }

internal/core/item_rendering.rs

@@ -281,6 +281,7 @@ pub trait RenderText {
     fn overflow(self: Pin<&Self>) -> TextOverflow;
     fn letter_spacing(self: Pin<&Self>) -> LogicalLength;
     fn stroke(self: Pin<&Self>) -> (Brush, LogicalLength, TextStrokeStyle);
+    fn is_markdown(self: Pin<&Self>) -> bool;
 }
 
 impl RenderText for (SharedString, Brush) {
@@ -321,6 +322,10 @@ impl RenderText for (SharedString, Brush) {
     fn stroke(self: Pin<&Self>) -> (Brush, LogicalLength, TextStrokeStyle) {
         Default::default()
     }
+
+    fn is_markdown(self: Pin<&Self>) -> bool {
+        false
+    }
 }
 
 /// Trait used to render each items.

internal/core/items.rs

@@ -1727,6 +1727,10 @@ declare_item_vtable! {
     fn slint_get_ComplexTextVTable() -> ComplexTextVTable for ComplexText
 }
 
+declare_item_vtable! {
+    fn slint_get_MarkdownTextVTable() -> MarkdownTextVTable for MarkdownText
+}
+
 declare_item_vtable! {
     fn slint_get_SimpleTextVTable() -> SimpleTextVTable for SimpleText
 }

internal/core/items/text.rs

@@ -200,6 +200,10 @@ impl RenderText for ComplexText {
     fn stroke(self: Pin<&Self>) -> (Brush, LogicalLength, TextStrokeStyle) {
         (self.stroke(), self.stroke_width(), self.stroke_style())
     }
+
+    fn is_markdown(self: Pin<&Self>) -> bool {
+        false
+    }
 }
 
 impl ComplexText {
@@ -215,6 +219,189 @@ impl ComplexText {
     }
 }
 
+/// The implementation of the `Text` element
+#[repr(C)]
+#[derive(FieldOffsets, Default, SlintElement)]
+#[pin]
+pub struct MarkdownText {
+    pub width: Property<LogicalLength>,
+    pub height: Property<LogicalLength>,
+    pub text: Property<SharedString>,
+    pub font_size: Property<LogicalLength>,
+    pub font_weight: Property<i32>,
+    pub color: Property<Brush>,
+    pub horizontal_alignment: Property<TextHorizontalAlignment>,
+    pub vertical_alignment: Property<TextVerticalAlignment>,
+
+    pub font_family: Property<SharedString>,
+    pub font_italic: Property<bool>,
+    pub wrap: Property<TextWrap>,
+    pub overflow: Property<TextOverflow>,
+    pub letter_spacing: Property<LogicalLength>,
+    pub stroke: Property<Brush>,
+    pub stroke_width: Property<LogicalLength>,
+    pub stroke_style: Property<TextStrokeStyle>,
+    pub cached_rendering_data: CachedRenderingData,
+}
+
+impl Item for MarkdownText {
+    fn init(self: Pin<&Self>, _self_rc: &ItemRc) {}
+
+    fn layout_info(
+        self: Pin<&Self>,
+        orientation: Orientation,
+        window_adapter: &Rc<dyn WindowAdapter>,
+        self_rc: &ItemRc,
+    ) -> LayoutInfo {
+        text_layout_info(
+            self,
+            &self_rc,
+            window_adapter,
+            orientation,
+            Self::FIELD_OFFSETS.width.apply_pin(self),
+        )
+    }
+
+    fn input_event_filter_before_children(
+        self: Pin<&Self>,
+        _: &MouseEvent,
+        _window_adapter: &Rc<dyn WindowAdapter>,
+        _self_rc: &ItemRc,
+    ) -> InputEventFilterResult {
+        InputEventFilterResult::ForwardAndIgnore
+    }
+
+    fn input_event(
+        self: Pin<&Self>,
+        _: &MouseEvent,
+        _window_adapter: &Rc<dyn WindowAdapter>,
+        _self_rc: &ItemRc,
+    ) -> InputEventResult {
+        InputEventResult::EventIgnored
+    }
+
+    fn capture_key_event(
+        self: Pin<&Self>,
+        _: &KeyEvent,
+        _window_adapter: &Rc<dyn WindowAdapter>,
+        _self_rc: &ItemRc,
+    ) -> KeyEventResult {
+        KeyEventResult::EventIgnored
+    }
+
+    fn key_event(
+        self: Pin<&Self>,
+        _: &KeyEvent,
+        _window_adapter: &Rc<dyn WindowAdapter>,
+        _self_rc: &ItemRc,
+    ) -> KeyEventResult {
+        KeyEventResult::EventIgnored
+    }
+
+    fn focus_event(
+        self: Pin<&Self>,
+        _: &FocusEvent,
+        _window_adapter: &Rc<dyn WindowAdapter>,
+        _self_rc: &ItemRc,
+    ) -> FocusEventResult {
+        FocusEventResult::FocusIgnored
+    }
+
+    fn render(
+        self: Pin<&Self>,
+        backend: &mut &mut dyn ItemRenderer,
+        self_rc: &ItemRc,
+        size: LogicalSize,
+    ) -> RenderingResult {
+        (*backend).draw_text(self, self_rc, size, &self.cached_rendering_data);
+        RenderingResult::ContinueRenderingChildren
+    }
+
+    fn bounding_rect(
+        self: core::pin::Pin<&Self>,
+        _window_adapter: &Rc<dyn WindowAdapter>,
+        _self_rc: &ItemRc,
+        geometry: LogicalRect,
+    ) -> LogicalRect {
+        geometry
+    }
+
+    fn clips_children(self: Pin<&Self>) -> bool {
+        false
+    }
+}
+
+impl ItemConsts for MarkdownText {
+    const cached_rendering_data_offset: const_field_offset::FieldOffset<
+        MarkdownText,
+        CachedRenderingData,
+    > = MarkdownText::FIELD_OFFSETS.cached_rendering_data.as_unpinned_projection();
+}
+
+impl RenderText for MarkdownText {
+    fn target_size(self: Pin<&Self>) -> LogicalSize {
+        LogicalSize::from_lengths(self.width(), self.height())
+    }
+
+    fn text(self: Pin<&Self>) -> SharedString {
+        self.text()
+    }
+
+    fn font_request(self: Pin<&Self>, self_rc: &ItemRc) -> FontRequest {
+        WindowItem::resolved_font_request(
+            self_rc,
+            self.font_family(),
+            self.font_weight(),
+            self.font_size(),
+            self.letter_spacing(),
+            self.font_italic(),
+        )
+    }
+
+    fn color(self: Pin<&Self>) -> Brush {
+        self.color()
+    }
+
+    fn alignment(
+        self: Pin<&Self>,
+    ) -> (super::TextHorizontalAlignment, super::TextVerticalAlignment) {
+        (self.horizontal_alignment(), self.vertical_alignment())
+    }
+
+    fn wrap(self: Pin<&Self>) -> TextWrap {
+        self.wrap()
+    }
+
+    fn overflow(self: Pin<&Self>) -> TextOverflow {
+        self.overflow()
+    }
+
+    fn letter_spacing(self: Pin<&Self>) -> LogicalLength {
+        self.letter_spacing()
+    }
+
+    fn stroke(self: Pin<&Self>) -> (Brush, LogicalLength, TextStrokeStyle) {
+        (self.stroke(), self.stroke_width(), self.stroke_style())
+    }
+
+    fn is_markdown(self: Pin<&Self>) -> bool {
+        true
+    }
+}
+
+impl MarkdownText {
+    pub fn font_metrics(
+        self: Pin<&Self>,
+        window_adapter: &Rc<dyn WindowAdapter>,
+        self_rc: &ItemRc,
+    ) -> FontMetrics {
+        let window_inner = WindowInner::from_pub(window_adapter.window());
+        let scale_factor = ScaleFactor::new(window_inner.scale_factor());
+        let font_request = self.font_request(self_rc);
+        window_adapter.renderer().font_metrics(font_request, scale_factor)
+    }
+}
+
 /// The implementation of the `Text` element
 #[repr(C)]
 #[derive(FieldOffsets, Default, SlintElement)]
@@ -371,6 +558,10 @@ impl RenderText for SimpleText {
     fn stroke(self: Pin<&Self>) -> (Brush, LogicalLength, TextStrokeStyle) {
         Default::default()
     }
+
+    fn is_markdown(self: Pin<&Self>) -> bool {
+        false
+    }
 }
 
 impl SimpleText {