Button
通用操作按钮。默认不换行:按钮宽度该由文案决定,容器挤不下时应当压缩别的元素或让按钮溢出,而不是把「新建 Agent」折成两行——工具栏里那是最先被牺牲、也最先被看见的可读性。
高度走 --ui-control-height,与输入框 / 下拉在同一行天然等高;尺寸由 size prop(mini / small / medium / large / super)或宿主标 data-size="small" 全局紧凑切换(试试右上角调试面板),组件不感知具体档位。
type 支持原生的 button | submit | reset,默认是不会误触发表单提交的 button;在 XForm 中使用 type="submit" 发起整表校验与提交。
变体
outline 常规操作 / primary 主操作 / gradient 品牌强调 / ghost 轻量操作 / danger 危险操作。品牌渐变按钮是 gradient 变体,不再单独成组件。
五种变体
L0 内联写法(正文里直接 MDC):
尺寸
五种尺寸
Loading 与禁用
loading 时禁用点击并出旋转指示,:disabled="disabled || loading" 同一语义:
loading / 禁用
API
Props
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
type | "button" | "submit" | "reset" | undefined | "button" | — |
variant | "primary" | "danger" | "outline" | "gradient" | "ghost" | undefined | "outline" | outline 常规操作 / primary 主操作 / gradient 品牌强调 / ghost 轻量操作 / danger 危险操作 |
block | boolean | undefined | false | 占满父容器宽度 |
disabled | boolean | undefined | false | — |
loading | boolean | undefined | false | — |
size | "mini" | "small" | "medium" | "large" | "super" | undefined | undefined | 尺寸:mini / small / medium(默认) / large / super;不传则跟随环境 data-size |
Slots
| 插槽 | 说明 |
|---|---|
default | — |