Tag, TagContainer

TagContainer is necessary for the correct appearance and behavior of the Delete tag button.

TagProps

& {...}

Name	Type	Description
disabled	boolean	Value responsible for tag availability
active	boolean	Value responsible for tag activity
interactive	boolean	Interactive tag
theme		Tag theme, there are several default themes or you can use your color
color	string	Tag color text
size		Tag size
addonLeft		Left addon tag
addonRight		Right addon tag
locale	string	Specifies the locale for i18n support

TagContainer.Close

Delete tag button automatically adjusts to the selected theme and size.

Accepts all Box properties.

import { TagContainer } from '@semcore/ui/tag';
<TagContainer.Close />;

Tag.Addon

The addon inside the tag (most commonly an icon) sets the correct indents depending on the size.

It takes all the properties of the Box.

import Tag from '@semcore/ui/tag';
<Tag.Addon />;

Tag.Text

An instance of Text with the appropriate styles depending on the tag size.

Plain text without addons placed directly in Tag is wrapped in Tag.Text automatically.

import Tag from '@semcore/ui/tag';
<Tag.Text />;

NSText.Props

& & ( {formatTags?: boolean; ellipsis?: never; ellipsisProps?: never; hint?: never; hintProps?: never } | ( {formatTags?: never } & & ))

Tag.Circle

A special addon for round elements inside a tag (most often a picture) places the correct indents depending on the size.

It accepts all Box properties.

import Tag from '@semcore/ui/tag';
<Tag.Circle />;