Components
Tag
Use for non-interactive labels, categories, and keywords. Not for actions, navigation, or status.
Proposed. fe-distillery has no first-class Tag yet: only a third-party tags multi-select combobox. This documents the canonical Tag the audit recommends building.
Preview
Engineering
Variants
Default
<Tag>Default</Tag>A single default style: no variants or size axes exist in any source API, so none are invented.
API
Prop
Type
Default
Description
children
ReactNode
required
Label text; a leading icon is sized automatically.
asChild
boolean
false
Render the child element as the tag, keeping the styles.
...props
HTMLAttributes
—
Native attributes pass through.
Don't and Do
Don't
Don't render a category with an outline button (tower's ActionPill) or a raw styled span (spear's status pill) and a status belongs in a Badge, not a Tag.
Do
<Tag>Engineering</Tag>import { Tag } from "@/components/ui/tag";
export function Category() {
return <Tag>Engineering</Tag>;
}