v1.4.0 · 内测版 · 36 个组件入口

Evoke Tools UI

产品级 GUI 框架：命令驱动、三档密度、可停靠工作台、键盘优先。 36 个组件入口分两层：common-tools 通用层（29）+ office-tools 办公子类（7）。

快速开始组件目录案例

29 + 7组件入口（通用层 + 办公层）

7构建期质量门

24 / 32 / 40三档密度控件高

432单测 + 28 视觉回归

工具区 · 命令表驱动（点一下试试）

这一段不是截图：点的、悬停的都是真组件，改命令表即改界面。

命令是唯一事实源

每个可点控件绑命令 id，enabled / active 只有一处实现；工具区、右键、命令面板、键位表四处可达且状态一致。

工作台即数据

停靠、面板、尺寸、折叠是一棵可序列化的树，持久化读回；坏档降级到默认布局，不白屏。

键盘优先

焦点漫游、快捷键解析、组字守卫与浮层焦点陷阱都是框架契约；面板尺寸可用纯键盘调整。

浮层有焦点契约

对话框、菜单、提示统一滚动锁定、焦点陷阱与 Esc 归还，三处行为一致，行为可断言。

三档密度

紧凑 / 默认 / 宽松写在根上（html[data-density]），切换即时生效，组件内部不做密度分支。

令牌切片

三层令牌 --eb-* → --et-* → --ot-*：底座继承、框架自持、画布调色板随主题联动。

peer

底座是 Business UI

tools-ui 的 peer 依赖就是同族的中后台组件库：reset、底座件与 --eb-* 令牌都来自它。图表能力在同族的 Evoke Charts，三站共用一套设计语言。

访问 Business UI 文档

分区速览

案例8 个完整装配（可运行）通用层 common29 件：基准件 / 壳 / 命令面 / 面板 办公层 office7 件：功能区 / 公式栏 / 表页签 / 画布宿主 命令驱动命令表与状态单源 工作台与停靠布局树 / 持久化 / 折叠 键盘与焦点快捷键 / 焦点陷阱

30 秒上手

1. 安装

bash

pnpm add @wil-works/evoke-tools-ui @wil-works/evoke-business-ui vue

2. 挂插件

import { createApp } from 'vue'
import EvokeToolsUI from '@wil-works/evoke-tools-ui'
import '@wil-works/evoke-tools-ui/styles'
import '@wil-works/evoke-business-ui/styles'
import App from './App.vue'

createApp(App).use(EvokeToolsUI).mount('#app')

3. 写一个工具钮

vue

<template>
  <et-provider>
    <et-tool-button icon="copy" label="复制" size="small" tip="复制" />
  </et-provider>
</template>

按需引入（子路径 / runtime / icons）与真实装配见快速开始，两层清单见common-tools 与office-tools。