Tag 设计文档
标签：light/solid/ghost 三态，16 色板 + white，可关闭(closable)、可交互(onClick/keydown)、头像(avatarSrc)、AI 多彩(colorful/gradient)、前后缀图标。受控 visible 不回写，仅通过 onClose 通知。配套 TagGroup（折叠 +N）与 SplitTagGroup（连接式组合），对齐 Semi 同页三组件。
← API 文档使用建议
标签：light/solid/ghost 三态，16 色板 + white，可关闭(closable)、可交互(onClick/keydown)、头像(avatarSrc)、AI 多彩(colorful/gradient)、前后缀图标。受控 visible 不回写，仅通过 onClose 通知。配套 TagGroup（折叠 +N）与 SplitTagGroup（连接式组合），对齐 Semi 同页三组件。
Accessibility
- clickable（有 onClick 或 closable）时根 div role=button + tabIndex；Enter 激活 onClick、Delete/Backspace 关闭、Esc 失焦。
设计变量
| 变量 | 默认值 | 用法 |
|---|---|---|
--cd-tag-avatar-bg | var(--cd-color-bg-4) | 头像标签背景色（Semi $color-tag_avatar-bg-default） |
--cd-tag-avatar-border | var(--cd-color-border) | 头像标签描边色（Semi $color-tag_avatar-border-default） |
--cd-tag-avatar-square-img-bg | var(--cd-color-fill-1) | 方形头像图片背景色（Semi $color-tag_avatar_square_img-bg-default，近似 color-default） |
--cd-tag-avatar-text | var(--cd-color-text-0) | 头像标签文字色（Semi $color-tag_avatar-text-default） |
--cd-tag-close-icon-active | var(--cd-color-text-0) | 关闭按钮按下颜色（Semi $color-tag_close-icon-active） |
--cd-tag-close-icon-default | var(--cd-color-text-2) | 可删除标签删除按钮颜色（Semi $color-tag_close-icon-default） |
--cd-tag-close-icon-hover | var(--cd-color-text-1) | 关闭按钮悬浮颜色（Semi $color-tag_close-icon-hover） |
--cd-tag-colorful-from | #4d6bff | colorful（AI 多彩）蓝→紫渐变起始色 |
--cd-tag-colorful-to | #a64dff | colorful（AI 多彩）蓝→紫渐变结束色 |
--cd-tag-colorful-via | #7b5cff | colorful（AI 多彩）蓝→紫渐变中间色 |