List Item
Single list/tree row: label, optional icon, metadata, and optional backend hydration — normally driven by ab-list, usable standalone for custom lists.
HTML tag: c-e428f6608bb9d43b181559053bcbfb513
When to use
Section titled “When to use”- single row inside ab-list (prefer parent .items)
- custom lightweight row with backend load
- not for data grid cells
| Prop | Type | Default | Description |
|---|---|---|---|
item | Object | ||
data_source__thing_id | String | “ | |
display_path | String | “ | |
value_path | String | “ | |
label | String | “ | |
thing_id | String | “ | |
meta | String | “ | |
data_source_input_params | Object | [object Object] | |
icon_path | String | “ | |
loading | Boolean | false | |
error_text | String | “ |
- Prefer parent ab-list with .items rather than many standalone ab-list-item nodes.
- Pass .item object plus display_path/value_path/icon_path (or set on parent list).
- For remote rows set data_source__thing_id + data_source_input_params (object).
- Listen for item-selected; handle source-data-loaded / source-data-load-failed when using data sources.
What to avoid
Section titled “What to avoid”Do not use for table cells — ab-data-grid columns handle that. Do not duplicate ab-list tree logic in manual ab-list-item lists unless building a custom lightweight picker.
Example
Section titled “Example”<c-e428f6608bb9d43b181559053bcbfb513 .item=${row} .display_path=${'label'} .value_path=${'id'} @item-selected=${onRowSelect}></c-e428f6608bb9d43b181559053bcbfb513>