Search

Search command palettes and search results pages.

Search Command Palette

Full-featured command palette with search, recent items, and keyboard shortcuts.

Preview

No preview available

See the code snippet below for usage.

Search Command Palette.tsx
import { SearchCommandPalette } from "@launchapp/design-system/blocks/search";const results = [  { id: "1", title: "Dashboard", description: "Main dashboard", href: "/dashboard", type: "page" },  { id: "2", title: "Settings", description: "Account settings", href: "/settings", type: "page" },];export default function Page() {  return (    <SearchCommandPalette      results={results}      onSearch={(q) => console.log("search", q)}      onSelect={(item) => console.log("select", item)}    />  );}

Search Results

Search results page with filters, sort, and paginated result list.

Preview

No preview available

See the code snippet below for usage.

Search Results.tsx
import { SearchResults } from "@launchapp/design-system/blocks/search";const results = [  { id: "1", title: "Getting Started Guide", description: "Learn how to use LaunchApp.", type: "doc", href: "/docs/getting-started" },  { id: "2", title: "API Reference", description: "Complete API documentation.", type: "doc", href: "/docs/api" },];export default function Page() {  return (    <SearchResults      query="getting started"      searchResults={results}      totalCount={2}      onSearch={(q) => console.log("search", q)}      onResultClick={(item) => console.log("click", item)}    />  );}