Tag

What is this component for? Tags serve as compact pill indicators used to render semantic metadata classifications, structural data rows, object statuses, or dynamic dismissible filter metrics across table interfaces and overview sheets.
Purpose: They categorize records fast and provide quick, visible semantic summaries or manageable attributes that users can inspect or clear dynamically.

Pill Container: A highly rounded wrapper defining the semantic fill background color, inner padding boundaries, and target borders.
Label Text: High-contrast, concise text indicating status categories or quantitative values.
Dismiss Button (Optional): A trailing 'x' glyph element positioned on the right boundary edge to clear the active tag asset from selection.

Semantic Palette Variants: Configured across various system theme categories to match information priorities: PRIMARY, SECONDARY, SUCCESS, DANGER, INFO, WARNING, SUPPORT-1, SUPPORT-2, SUPPORT-3, SUPPORT-4, WHITE, and NEUTRAL.
Functional Layout Variants:
- Simple / Read-Only Tag: A static pill element presenting core metadata properties or mini-counters (such as a generic +5 overflow badge layout).
- Dismissible / Closable Tag: Incorporates an interactive dismiss button icon directly inside the right margin area, enabling users to strip away the tag constraint manually.

Best practices

Do: Consistently use standardized semantic tokens (e.g., mapping SUCCESS to completed actions and DANGER to system faults or required fields) to preserve cognitive clarity.
Don't: Overload tag pills with dense strings or mixed layout widths that ruin cell scanning, especially when rendering user-generated criteria within responsive columns.