Navigation
命令面板
一个带键盘快捷键、分组结果和最近命令的可搜索命令面板。
作者:mcpSkills
框架
nextjs
UI 库
shadcntailwind
难度advanced
英文提示词
Create a command palette modal triggered by ⌘K. Include a search input at the top, grouped results (Recent, Pages, Actions), keyboard navigation with arrow keys, highlighted selection, and a footer showing keyboard shortcuts. Use shadcn/ui Dialog, Command, and Badge components and Tailwind CSS. Make it accessible with focus trapping and Escape to close.
中文提示词
创建一个通过 ⌘K 触发的命令面板弹窗。顶部包含搜索输入、分组结果(Recent、Pages、Actions)、方向键键盘导航、高亮选择和显示键盘快捷键的页脚。使用 shadcn/ui Dialog、Command 和 Badge 组件以及 Tailwind CSS。使其可访问,包含焦点捕获和 Escape 关闭。

概述
一个供高级用户快速导航和执行操作的命令面板。包含搜索、分组和键盘快捷键。
功能特性
- ⌘K 键盘触发
- 搜索输入
- 分组命令结果
- 方向键导航
- 高亮选择
- 快捷键提示页脚
- 焦点捕获和 Escape 关闭
使用方法
将提示词复制到 v0 或 Cursor 中。将命令连接到你的应用路由和操作。
自定义选项
修改提示词以:
- 添加命令图标
- 支持嵌套命令页面
- 显示最近搜索
- 添加模糊搜索匹配