Documentation Index
Fetch the complete documentation index at: https://mintlify.com/Augani/kael/llms.txt
Use this file to discover all available pages before exploring further.
Kael gives you three distinct primitives for displaying text content. Plain Rust strings are the zero-ceremony option for static output. label() wraps a string in an accessible container that can forward keyboard focus to an associated control. rich_text() is a builder that composes multi-segment content — mixing plain prose, styled spans, clickable links, mentions, hashtags, inline code, and even arbitrary inline elements — into a single reflowed paragraph.
Plain text
Both &'static str and String/SharedString implement IntoElement, so you can pass them directly as children of any container:
div()
.child("Static label") // &'static str
.child(format!("Count: {}", self.count)) // String
.child(SharedString::from("Dynamic text")) // SharedString
div that sets those properties.
Plain string elements do not accept style methods. To control the appearance of a run of text, wrap it in a div that sets the desired text style, or use rich_text() with .styled().
label()
label() wraps its content in a div with role="static-text" and optionally wires a click handler to transfer focus to a form control.
Signature
pub fn label(id: impl Into<ElementId>) -> Label
Methods on Label
// Set the visible text string for the label
pub fn text(mut self, text: impl Into<SharedString>) -> Self
// Transfer keyboard focus to the given handle when the label is clicked
pub fn for_focus_handle(mut self, focus_handle: FocusHandle) -> Self
Label also implements ParentElement, so you can compose arbitrary child elements instead of (or in addition to) the plain .text() string.
Example: pairing a label with a text input
let input_focus = cx.focus_handle();
div()
.flex()
.items_center()
.gap_2()
.child(
label("username-label")
.text("Username")
.for_focus_handle(input_focus.clone()),
)
.child(
text_input("username-input", self.username.clone())
// ...
)
StaticText accessibility role.
rich_text()
rich_text() returns a RichText builder. You compose content by calling segment methods in order; the segments are concatenated and reflowed together as a single paragraph.
Signature
pub fn rich_text() -> RichText
Text segment methods
// Append plain text
pub fn text(self, text: impl Into<SharedString>) -> Self
// Append text with a HighlightStyle applied on top of the current text style
pub fn styled(self, text: impl Into<SharedString>, style: impl Into<HighlightStyle>) -> Self
// Append inline-code-styled text
pub fn code(self, text: impl Into<SharedString>) -> Self
Entity methods
Entities are interactive spans with an associated on_click handler. Each carries a typed payload string.
// A hyperlink entity
pub fn link<F>(
self,
text: impl Into<SharedString>,
target: impl Into<SharedString>,
on_click: F,
) -> Self
where
F: Fn(&mut Window, &mut App) + 'static
// A user mention entity (@alice)
pub fn mention<F>(
self,
text: impl Into<SharedString>,
payload: impl Into<SharedString>,
on_click: F,
) -> Self
where
F: Fn(&mut Window, &mut App) + 'static
// A hashtag entity (#topic)
pub fn hashtag<F>(
self,
text: impl Into<SharedString>,
payload: impl Into<SharedString>,
on_click: F,
) -> Self
where
F: Fn(&mut Window, &mut App) + 'static
Inline element methods
You can embed arbitrary elements — icons, avatars, badges — inside the paragraph flow:
// Inline element aligned to the text baseline automatically
pub fn inline_element(self, element: impl IntoElement) -> Self
// Inline element with an explicit baseline offset from its top edge
pub fn inline_element_with_baseline(
self,
element: impl IntoElement,
baseline_offset: Pixels,
) -> Self
Selection and layout tracking
// Enable mouse text selection and platform input geometry
pub fn selectable(self) -> Self
// Set the selection highlight color
pub fn selection_color(self, color: Hsla) -> Self
// Bind to a RichTextLayout handle for external geometry access
pub fn track_layout(self, layout: &RichTextLayout) -> Self
// Assign an element id for persistent selection state
pub fn id(self, id: impl Into<ElementId>) -> Self
Example: chat message with entities
rich_text()
.text("Hey ")
.mention("@alice", "user:alice", {
let cx_handle = cx.weak_handle();
move |_window, _cx| {
// open alice's profile
}
})
.text(" check out ")
.link("this article", "https://example.com", |_window, _cx| {
// open URL
})
.text(". Also tagged ")
.hashtag("#rust", "rust", |_window, _cx| {
// filter by hashtag
})
.text(".")
Example: inline icon in a paragraph
rich_text()
.text("Click ")
.inline_element(icon(IconName::Star).size(px(16.0)))
.text(" to bookmark.")
Call .selectable() if users need to copy the rich text content. Without it, mouse events are not captured and the platform is not informed of the text geometry, so system-level text selection and accessibility will not work correctly.
