Back to Tuist

DropdownItem

noora/docs/components/dropdownitem.md

4.204.01.9 KB
Original Source
<!-- Generated by scripts/generate-web-components.js. Do not edit directly. -->

DropdownItem

Describes one declarative item inside a dropdown or breadcrumb menu.

html
<noora-dropdown-item value="edit" icon="edit">Edit</noora-dropdown-item>

Attributes

AttributeType or allowed valuesDefaultDescription
labelstring""Sets the item label instead of using its text content.
valuestringNoneSets the value emitted when the item is selected.
iconstringNoneShows an icon before the label.
right-iconstringNoneShows an icon after the label.
sizesmall, large"small"Controls the item dimensions.
hrefstringNoneRenders the item as a link.
secondary-textstringNoneAdds compact secondary text beside the label.
descriptionstringNoneAdds supporting text below the label.
disabledbooleanfalseDisables selection.
checkablebooleanfalseShows a checkbox indicator.
checkedbooleanfalseMarks a checkable item as selected.
selectedbooleanfalseMarks a breadcrumb menu item as selected.
avatarbooleanfalseShows an avatar before the label.
avatar-namestringNoneSets the avatar name.
avatar-colorstringNoneSets the avatar color.
avatar-image-hrefstringNoneSets the avatar image address.
badge-labelstringNoneShows a badge with this label.
badge-colorstringNoneSets the badge color.

Slots

SlotDescription
defaultThe item label.

Use this element inside noora-dropdown, noora-inline-dropdown, noora-button-dropdown, or noora-breadcrumb-item.

Item

Describe a selectable menu item.

html
<noora-dropdown-item value="edit" icon="edit">Edit</noora-dropdown-item>