Skip to content

Properties

Tag properties

PropertiesDescription
text or children(optional) The content of the tag can be a string or a React Element.
icon(optional) To be included in the tag. Primary Icons can be set as a string (e.g. icon="chevron_right"), other icons should be set as React elements. Note, we recommend not to use icons with clickable tags.
hasLabel(optional) If a label is given, typical inside a table or dl (definition list), then you can disable Tag.Group as a dependent of Tag. Use true to omit the Tag group required: warning.
variant(optional) Possible values are default, clickable, addable, or removable. Defaults to default.
skeleton(optional) Applies loading skeleton.
className(optional) Custom className for the component root.
Space(optional) Spacing properties like top or bottom are supported.
omitOnKeyUpDeleteEvent(optional) Set to true to omit triggering an event when the user releases the Delete or Backspace keys. Defaults to false.
onClick(optional) Callback on click. Used with variant other than default.

Tag.Group properties

PropertiesDescription
label(required) The label description of the group of tags.
children(optional) Content of the component. Can be used instead of the data-property, by adding Tag elements as children <Tag {...props} />.
className(optional) Custom className for the component root.
Space(optional) spacing properties like top or bottom are supported.
skeleton(optional) Applies loading skeleton.

Tag translations

More info about translations can be found in the general localization and Eufemia Forms localization docs.

Keynb-NOen-GB
Tag.removeIconTitleFjernRemove
Tag.addIconTitleLegg tilAdd