Global search
Full-screen application-level search overlay with category chips, grouped lists, and path / badge / shortcut display.
Basic usage
Differences from CommandPalette: this component is a full-screen overlay (paddingTop 8vh) with built-in category filter chips and a three-column title/path/badge layout.
Use it for “application spotlight” use cases; the command palette is for “Cmd+K command search”.
<CfGlobalSearch
:open="open"
:results="results"
@update:open="setOpen"
@select="onSelect"
/> <CfGlobalSearch
open={open}
onOpenChange={setOpen}
results={results}
onSelect={onSelect}
/> Category filter
18 results across 5 categories. Click a top chip to filter; the chip row is hidden automatically when there is at most one category.
<CfGlobalSearch ... :show-categories="true" /> <CfGlobalSearch ... showCategories /> API
| Prop | Type | Default | Description |
|---|---|---|---|
open / v-model:open | boolean | — | |
results | GlobalSearchResult[] | — | { id, title, description?, category, badge?, path?, shortcut?, keywords?, disabled? } |
placeholder / emptyText | |||
showCategories | boolean | true | Top category chips |
closeOnSelect | boolean | true |
Keyboard: up/down navigate, enter select, Esc close.
反馈与讨论
Global search · Discussion