Marker

A one-line event in a conversation or a log: a branch created, a tool running, the model thinking. The host supplies the label and the state; the marker infers nothing.

Import

use limn::{Component, Icon, Marker, MarkerVariant};

Usage

A marker needs an ID, a label and the palette. It is drawn in the palette’s muted color and is passive unless it is given an action.

fn view(palette: ComponentPalette) -> Element {
    Marker::new("branch-created", "Branch created", palette)
        .icon(Icon::GitBranch)
        .render()
}

Loading

Marker::new("tests", "Running tests", palette).loading(state.running).render()

A loading marker shows a Spinner in place of its icon and a highlight sweeps across its label. shimmer(true) is the highlight alone, with the icon kept.

Thinking

Marker::new("thinking", "Thinking", palette).thinking(true).render()

thinking shows a still brain icon and a quieter highlight across the label. It takes precedence over loading and over icon.

Variants

Marker::new("today", "Today", palette)
    .variant(MarkerVariant::Separator)
    .render()

Default is the row alone. Separator centers the label between two rules that take the width it leaves. Border draws one rule under the row.

Truncate

Marker::new("tool", &state.step, palette).truncate(true).render()

A label wraps by default. truncate(true) keeps it on one line and cuts it with an ellipsis.

Ink

Marker::new("request", "Request failed", palette).ink(danger).render()

ink paints the label, the icon and the spinner in a status color of the host’s, in place of the palette’s muted.

As an action

fn view(palette: ComponentPalette) -> Element {
    Marker::new("result", "See result", palette).action("open-result").render()
}

fn update(state: &mut State, action: &UiAction) {
    if let UiAction::Clicked { id } = action {
        if id == "open-result" {
            state.open_result();
        }
    }
}

action makes the whole marker a control at least 32 px high, with a hover fill, that can be focused.

Disabled

Marker::new("result", "See result", palette).action("open-result").enabled(false).render()

A disabled marker keeps the place and the look of its action, without the hover fill. It takes no pointer or focus and reports nothing. A marker without an action is passive already.

Motion

The highlight of a loading, shimmering or thinking label and the spinner are continuous, not transitions. With reduced motion both hold still and the label is drawn in its plain color.

Actions

Accessibility

A marker with an action is a button named by its label, and stays there as disabled when it is disabled. Without an action it is text and the platform is told nothing more.