Skip to content 
Item Header
Item description
ListItem 🟠 Not ready
The ListItem component can be used imported from:
Playground
Parameters
Slots
This component has slots. Check the documentation about how to use the slots.
| Name | Tags | Description |
|---|---|---|
default | span | Description of the list item |
header | span | Header of the list item |
image-src | span | Slottable image |
left-actions | span | Left actions of the list item |
right-actions | span | Right actions of the list item |
Parameters use
Check the documentation about how to use the parameters.
header
The header attribute is used to set the header of the list item.
Alternatively, you can use the header slot to display the header.
content
The content attribute is used to set the content of the list item.
Also you can use the default slot to set the content of the list item.
timestamp
The timestamp attribute is used to set the timestamp of the list item.
icon-right
icon-left
The icon-right and icon-left attributes are used to set the icons of the list item.
Check the icon list here. This attributes will receive the name of the icon to be show. You can use both solid or line (outlined) version.
The following attributes are related to Profile component.
initials
The initials attribute is used to set the initials of the profile in the list item.
Image
image-src
The image-src attribute is used to set the image source of the profile in the list item.
pictogram
The pictogram parameter is used to define the pictogram to be displayed inside action card. Make sure you specify correctly the name of the pictogram you want to display. Check the Pictogram component for the list of available pictograms.
If both image-src and pictogram are defined, the pictogram will be displayed.
image-alt
The image-alt attribute is used to set the image alt of the profile in the list item.
Browser support
Detected engine:
Chromium
Webkit
Gecko