macOS Spotlight-style command palette with multi-step commands and scoped search. Press Ctrl+K or ⌘K to open — it's mounted once in the layout, so the shortcut and the navbar/sidebar search triggers work on every page.

Quick Start

Open the command palette and try the different modes:

Display style:

Modes

PrefixModeDescription
/ Commands Multi-step action wizards
: Search Scoped entity search
(none) Global Search everything

Commands (/)

Type / to see available commands:

ShortcutNameSteps
/deploy Deploy to Environment 2 steps
/assign Assign to User 2 steps
/go Go to Page 1 steps
/theme Switch Theme 1 steps

Try it

Search Contexts (:)

Type : to see search contexts:

ShortcutContext
:products Products
:orders Orders
:users Users
:invoices Invoices

Try it

Global Search

Just type without a prefix to search everything:

Extending it

The palette ships as a reusable LiveComponent. Mount it once in your layout and point it at a PureAdmin.CommandPalette.Source module that supplies your app's commands, contexts, search and actions:

<.live_component
  module={PureAdmin.CommandPalette}
  id="command-palette"
  source={MyApp.Palette} />

defmodule MyApp.Palette do
  use PureAdmin.CommandPalette.Source

  def commands, do: [%{id: "go", shortcut: "/go", ...}]
  def contexts, do: [%{id: "products", shortcut: ":p", ...}]
  def step_options("go", "page", q, _sel), do: search_pages(q)
  def search(:global, q), do: search_all(q)
  def on_select(item), do: {:navigate, item.href}
  def on_complete("go", sels), do: {:navigate, List.last(sels).value}
end

Keyboard Shortcuts

KeyAction
Ctrl+K / ⌘K Toggle command palette
↑ ↓ Navigate results
← → Previous / next page (search modes)
Enter / Tab Select item or confirm free text
Backspace (at start) Go back to previous step
Esc Back (in step/context) or close

John Doe

Administrator

Settings

Press Ctrl+K to preview the palette.
Sidebar
Display
Profile Panel
Body text size. All elements scale proportionally.
Commands
🚀
Deploy to Environment
Deploy a branch to an environment
g d
👤
Assign to User
Assign an item to a team member
g a
🧭
Go to Page
Navigate to a page
g g
🎨
Switch Theme
Change the visual theme
g t
Search
📦
Products
Search products
:products
📋
Orders
Search orders
:orders
👥
Users
Search users
:users
🧾
Invoices
Search invoices
:invoices