Labels are a visual pattern used to categorize information providing quick and easy recognition.
|install||yarn add @clayui/label|
Stable3.88.0View in LexiconCHANGELOG
ClayLabel offers two different APIs for use by toggling the prop
withClose. By default(
ClayLabel behaves like a high-level component. If you want to use the lower-level components and compose multiple parts to your label, all you need to do is set
Check out this storybook example for a demo.
displayType property you can use these color variations on Label component:
closeButtonProps property for applying custom properties to the button that wraps the closing icon.
In this example, an Id was settled for the closing element:
You can also set a state for the visibility of the ClayLabel for example, handling
onClick property on the closing element.