Spinner
spinner加载旋转器 · 纯 CSS animate-spin SVG 环 + role=status + RSC
用法
基础用法
默认 md 尺寸、primary 色的旋转指示器，纯 CSS 动画，可 RSC。
tsx
<Spinner />三尺寸
size 控制大小：sm / md / lg。
tsx
<>
<Spinner size="sm" />
<Spinner size="md" />
<Spinner size="lg" />
</>色调
tone 切换语义色，current 跟随父级 text 色，可置于深色按钮内。
tsx
<>
<Spinner tone="primary" />
<Spinner tone="muted" />
<span className="text-danger"><Spinner tone="current" /></span>
</>何时用
需要一个裸的加载旋转图标时用（按钮内、行内、空状态占位）：纯 CSS animate-spin SVG 环，带 role=status，零交互、可作 RSC。需要遮罩/包裹内容区/整页加载用 Spin；已知进度用 Progress。
导入
ts
import { Spinner, spinnerVariants } from "@hulianui/ui"Props
| 名称 | 类型 | 默认 | 说明 |
|---|---|---|---|
| size | "sm"｜"md"｜"lg" | "md" | 尺寸 |
| tone | "primary"｜"current"｜"muted" | "primary" | 配色（current=继承 currentColor，适合放进彩色按钮内） |
| label | string | "加载中" | a11y 文案（role=status 读屏播报） |
| className | string | — | 容器类名 |
禁忌 / 坑
tone="current"才继承currentColor——放进彩色按钮/链接内想随文字色变时用它，默认primary是固定主色。- 它无
spinning开关，渲染即转；要按状态控制显隐自行{loading && <Spinner />}，或用 Spin 的spinningprop。 - 暂无其它已知坑。
相关
Playground
<Spinner />