➤ wl-list-item

Display an item in a list.

➤ Properties

Property	Attribute	Type	Default	Description
`clickable`	`clickable`	`boolean`	false	Makes the element clickable.
`disabled`	`disabled`	`boolean`	false	Disables the element.
`name`	`name`	`string`		Name of the native form element.
`noRipple`	`noRipple`	`boolean`	false	Deactivates the ripple.
`readonly`	`readonly`	`boolean`	false	Makes the element readonly (disabled but tabbable)
`required`	`required`	`boolean`	false	Makes the element required in a form context.
`role`	`role`	`AriaRole`	"listitem"	Role of the list item.
`type`	`type`	`"button" \| "submit"`	"submit"	Type of the button.
`value`	`value`	`string`	""	Value of the form element.

Property	Description
`--list-item-after-align-self`	Alignment of the after slot
`--list-item-after-margin`	Margin of the after slot
`--list-item-before-align-self`	Alignment of the before slot
`--list-item-before-margin`	Margin of the before slot
`--list-item-bg`	Default background
`--list-item-bg-active`	Background when active
`--list-item-bg-active-hover`	Background when active and hover
`--list-item-bg-disabled`	Background when disabled
`--list-item-bg-hover`	Background when hover
`--list-item-border-radius`	Border radius
`--list-item-color`	Default color
`--list-item-color-active`	Color when active
`--list-item-color-active-hover`	Color when active and hover
`--list-item-color-disabled`	Color when disabled
`--list-item-color-hover`	Color when hover
`--list-item-opacity-disabled`	Opacity when disabled
`--list-item-padding`	Padding
`--list-item-transition`	Transition

Go here to try the demo.


Andreas Mehlsen	You?

Licensed under MIT.