Component ListItem

ListItem

A row in a list. Title plus optional description, leading icon, trailing icon, selected/disabled state, and click handler.

use yororen_ui::headless::list_item::list_item;

list_item("item-1", "Ada Lovelace", cx)
    .description("mathematician")
    .leading_icon(IconSource::Named(IconName::User))
    .selected(self.selected_id == "item-1")
    .on_click({
        let entity = cx.entity();
        move |_, _, cx| entity.update(cx, |s, _| s.selected_id = "item-1".into());
    })
    .render(cx)

Props

Method	Purpose
description(s)	Secondary line below the title.
leading_icon(source)	Icon shown on the left.
trailing_icon(source)	Icon shown on the right (e.g. a chevron).
selected(v)	Apply the selected visual state.
disabled(v)	Disable the click handler and dim the row.
on_click(closure)	Fn(&ClickEvent, &mut Window, &mut App) + 'static + Send + Sync.

Factory takes (id, title, _cx); title is required. For a single-select list, the parent view stores the selected id and passes .selected(parent.selected_id == row_id) for each row.

.render(cx) returns Stateful<Div>.

See also: Listbox, TreeItem, Select.