Pattern · Lumina
Command Palette
A porta de entrada universal do produto: ⌘K abre busca + ações + atalhos. Inspirado em Linear, Raycast, Vercel.
Onde já está vivo
O ⌘K que tu acessa de qualquer página do Lumina. Tente agora.
Aperta ⌘ K aí em cima do navegador.
Receita completa
CommandDialog do shadcn + cmdk + groups por categoria. Atalho global, fuzzy match nativo, footer com kbd.
components/command-palette.tsxTSX
Princípios
- ⌘K abre e fecha. Mesmo atalho, toggle.
- Foco no input ao abrir. Setas navegam, Enter abre, Esc fecha.
- Agrupar por categoria: Mood, Foundations, Brand, Components, Marketing, Ações externas.
- Keywords escondidas em
valuepra fuzzy match casar com sinônimos. - Ações fora do site (GitHub, lucide.dev) ganham ícone
ArrowUpRightemCommandShortcut. - Footer com kbd: ↑↓ navegar, ↵ abrir, esc fechar.
Anti-padrões
- ⌘K que só busca, sem ações. Vira box de search inútil.
- Lista plana sem categorias. Acima de 10 items vira lista de telefone.
- Não respeitar input ativo. Trocar mood enquanto o usuário digita “mood” é grosseria.