Components
CommandPalette
A modern, keyboard-first navigation UI that allows users to search and execute various commands through a floating interface. Supports keyboard shortcuts, search functionality, and customizable command groups.
import CommandPalette from "@/components/ui/command-palette";
export default function DemoOne() {
return (
<div className="min-h-screen w-full bg-gray-50 dark:bg-gray-900 text-gray-800 dark:text-gray-200 flex flex-col items-center justify-center font-sans p-4">
<div className="text-center">
<h1 className="text-3xl md:text-4xl font-bold text-gray-900 dark:text-white mb-4">Command Palette Component</h1>
<p className="text-lg text-gray-600 dark:text-gray-400 mb-8">A modern, keyboard-first navigation UI.</p>
{/* The CommandPalette component handles all the command palette functionality */}
<CommandPalette />
</div>
</div>
);
}