iter(g189): 补命令面板组合配方

llms-full.txt

@@ -2463,6 +2463,35 @@ dataTable({ columns, data: rows, selectable: true }); // 表格只吃派生出
 - 区间类控件都自带先后与越界修正：`slider` 的 `value`/`end` 越界会压平，`datePicker` 点早了会自动交换两端——调用方不要再写 clamp。
 - 长候选集给 `option.group` 分块、常用时间段给 `presets`（`days` 相对今天，跨月跨年由组件算），比让用户逐行扫列表更快。
 
+## 配方 12：命令面板（⌘K 全局操作入口）
+
+```ts
+const cmdkOpen = signal(false);   // 面板显隐：快捷键与按钮共用同一份状态
+const cmdk = commandPalette({
+  open: cmdkOpen,
+  items: [
+    { id: 'new-order', label: '新建工单', group: '快捷操作', hint: '⌘N' },
+    { id: 'export', label: '导出当前列表', group: '快捷操作' },
+    { id: 'invite', label: '邀请成员', group: '协作', keywords: ['yaoqing', 'yao qing'] },
+    { id: 'theme', label: '切换暗色主题', group: '偏好', keywords: ['dark'] },
+  ],
+  onSelect: (item) => {
+    if (item.id === 'theme') return toggleTheme();       // 立即型命令：自己带副作用
+    if (item.id === 'invite') return inviteModal.open(); // 需要表单的交给已有弹窗，面板只做入口
+    toast.success(`已执行：${item.label}`);               // 其余执行完给一次轻反馈
+  },
+});
+document.body.append(cmdk.el); // 面板是 fixed + 遮罩，挂 body 最省事
+```
+
+要点：
+- 用 `id` 做命令分发键、`label` 只负责显示：以后改文案不会打断路由；同一 `id` 也是埋点的事件名。
+- 过滤看三层 `label` / `hint` / `keywords`：拼音与别名塞 `keywords`（如 `yaoqing`），用户没切输入法也能命中。
+- 同组必须**连续排列**才会合并成一段标题，`items` 顺序即展示顺序，组件不排序——按「快捷操作 / 跳转 / 偏好」排好再传。
+- 需要二次确认的命令在 `onSelect` 里开 `modal` / `popconfirm`，别在面板内部再叠一层确认，否则 Esc 栈会有两层。
+- 一页只留一个实例用缺省 `hotkey`（⌘K / Ctrl+K），其余传 `hotkey: false` 自己绑，否则一次按键会同时开两个面板。
+- 命令集随权限变化时**重建实例**（`items` 是创建时快照），不要往原数组里 push。
+
 ## 通用约定
 
 - 状态一律放信号（`signal` / `computed`），组件只读写信号，不持有业务数据副本。

llms.txt

@@ -158,3 +158,4 @@
 - 配方 9：详情页排版（栅格 + 排版文本 + 描述列表）（3 条要点）
 - 配方 10：暗色主题切换（只切 data-theme，不改令牌名）（3 条要点）
 - 配方 11：数据看板筛选区（区间滑块 + 日期预设 + 分组下拉）（3 条要点）
+- 配方 12：命令面板（⌘K 全局操作入口）（6 条要点）

packages/tools/cli/recipes.md

@@ -230,6 +230,35 @@ dataTable({ columns, data: rows, selectable: true }); // 表格只吃派生出
 - 区间类控件都自带先后与越界修正：`slider` 的 `value`/`end` 越界会压平，`datePicker` 点早了会自动交换两端——调用方不要再写 clamp。
 - 长候选集给 `option.group` 分块、常用时间段给 `presets`（`days` 相对今天，跨月跨年由组件算），比让用户逐行扫列表更快。
 
+## 配方 12：命令面板（⌘K 全局操作入口）
+
+```ts
+const cmdkOpen = signal(false);   // 面板显隐：快捷键与按钮共用同一份状态
+const cmdk = commandPalette({
+  open: cmdkOpen,
+  items: [
+    { id: 'new-order', label: '新建工单', group: '快捷操作', hint: '⌘N' },
+    { id: 'export', label: '导出当前列表', group: '快捷操作' },
+    { id: 'invite', label: '邀请成员', group: '协作', keywords: ['yaoqing', 'yao qing'] },
+    { id: 'theme', label: '切换暗色主题', group: '偏好', keywords: ['dark'] },
+  ],
+  onSelect: (item) => {
+    if (item.id === 'theme') return toggleTheme();       // 立即型命令：自己带副作用
+    if (item.id === 'invite') return inviteModal.open(); // 需要表单的交给已有弹窗，面板只做入口
+    toast.success(`已执行：${item.label}`);               // 其余执行完给一次轻反馈
+  },
+});
+document.body.append(cmdk.el); // 面板是 fixed + 遮罩，挂 body 最省事
+```
+
+要点：
+- 用 `id` 做命令分发键、`label` 只负责显示：以后改文案不会打断路由；同一 `id` 也是埋点的事件名。
+- 过滤看三层 `label` / `hint` / `keywords`：拼音与别名塞 `keywords`（如 `yaoqing`），用户没切输入法也能命中。
+- 同组必须**连续排列**才会合并成一段标题，`items` 顺序即展示顺序，组件不排序——按「快捷操作 / 跳转 / 偏好」排好再传。
+- 需要二次确认的命令在 `onSelect` 里开 `modal` / `popconfirm`，别在面板内部再叠一层确认，否则 Esc 栈会有两层。
+- 一页只留一个实例用缺省 `hotkey`（⌘K / Ctrl+K），其余传 `hotkey: false` 自己绑，否则一次按键会同时开两个面板。
+- 命令集随权限变化时**重建实例**（`items` 是创建时快照），不要往原数组里 push。
+
 ## 通用约定
 
 - 状态一律放信号（`signal` / `computed`），组件只读写信号，不持有业务数据副本。