Trace

Anatomy

Trace composes agent activity lines. trace, line, icon, title and description accept caller-provided Maud markup and optional class strings. Status::Done emits no status; Running, Error, and Pending correspond to the upstream data statuses. State the status in the title: color and animation alone do not convey it. Icons are decorative and hidden from assistive technology. Text passed through html! is escaped; PreEscaped is trusted caller content.

use maud::html;
use maud_ui::primitives::trace::{self, Status};

let activity = trace::trace("", trace::collapsible(
    "build-output", false, true, "",
    trace::line(Status::Done, "", html! {
        (trace::title("", html! { "Build completed" }))
        (trace::description("", html! { "2s" }))
    }),
    html! { "All checks passed." },
));

A line is a span, not a button. Wrap it in a genuine anchor or another component's trigger for interaction. collapsible and collapsible_with render a native type=button trigger with a unique caller-provided panel ID, expanded state and a decorative chevron. CollapsibleProps accepts independent root, trigger and content classes. open is the initial state; subsequent state is owned by the browser runtime, not an upstream React controlled onOpenChange prop. keep_mounted=true retains nested DOM and form state while closed; false removes it after the exit transition and recreates it on open. Use document-unique IDs. The closed server-rendered fallback is hidden; without the runtime its button does not open.

Running titles shimmer in normal motion and disable shimmer under reduced motion. The trace can contain other components, including CodeBlock, via Maud markup. Links opening a new tab should include an accessible “opens in a new tab” indication and a safe rel value.

In Nova, a title's CSS class can customize --shimmer-angle, --shimmer-duration, --shimmer-spread, --shimmer-color, --shimmer-text-fill, and --shimmer-image. Set these on the title itself; the image and text-fill properties do not inherit. Reduced motion disables both the shimmer image and animation.

Reference: pinned Base UI Trace and official Trace documentation. The current upstream Trace source at 8ab27715521cbd4f87ae6886cd989cbb678f6de7 has the same SHA-256 as the pinned file; the overall upstream snapshots are not assumed identical.

maud_ui::primitives::trace

Props

Generated from public Rust fields. Defaults are evaluated from the implementation.

This module uses typed helper functions instead of a Props struct. See Examples for the function API.

Accessibility

Supply meaningful labels, choose heading levels for the surrounding page, and preserve native link and form behavior. Keyboard focus follows document order. Motion honors reduced-motion preferences.