Documentation

Command

Command palette / search interface with keyboard shortcuts.

Installation

pnpm add @rouf-dev/pantheon-ui cmdk

Usage

import {
  Command,
  CommandDialog,
  CommandInput,
  CommandList,
  CommandEmpty,
  CommandGroup,
  CommandItem,
  CommandSeparator,
  CommandShortcut,
} from "@rouf-dev/pantheon-ui";

<Command>
  <CommandInput placeholder="Type a command or search..." />
  <CommandList>
    <CommandEmpty>No results found.</CommandEmpty>
    <CommandGroup heading="Suggestions">
      <CommandItem>
        Calendar
        <CommandShortcut>āŒ˜K</CommandShortcut>
      </CommandItem>
      <CommandItem>Search Emoji</CommandItem>
    </CommandGroup>
    <CommandSeparator />
    <CommandGroup heading="Settings">
      <CommandItem>Profile</CommandItem>
      <CommandItem>Billing</CommandItem>
    </CommandGroup>
  </CommandList>
</Command>

Examples

Full interactive examples coming soon. Command provides powerful command palette functionality with search and keyboard navigation.