4.3k

Spinner

An indeterminate progress leaf for work with no measurable fraction; when there is one, use progress instead. For a placeholder that sketches the shape of the loading content, use skeleton.

spinner
An indeterminate spinner rendered by the engine (light theme)

Markup

<row gap="12" cross="center">
  <spinner></spinner>
  <text foreground="text_muted">Loading notes…</text>
</row>

Zig builder

Spinner has no sugar method; use ui.el with the element kind.

ui.row(.{ .gap = 12, .cross = .center }, .{
    ui.el(.spinner, .{}, .{}),
    ui.text(.{ .style_tokens = .{ .foreground = .text_muted } }, "Loading notes…"),
})

Attributes

AttributeDescription
widthDefinite width (plain number): the element is exactly this wide; content neither shrinks nor overflows it. On resizable it is the initial width.
heightDefinite height (plain number): the element is exactly this tall; content neither shrinks nor overflows it.