1# CommandPalette
2 
3A command palette with full-text search powered by Fuse.js for efficient fuzzy matching.
4 
5> Based on [Reka UI CommandPalette](https://reka-ui.com/docs/components/listbox)
6 
7## Key Props
8 
9- `groups`: as an array of objects with the following properties:
10 
11- `id: string`{lang="ts-type"}
12- `label?: string`{lang="ts-type"}
13- `slot?: string`{lang="ts-type"}
14- `items?: CommandPaletteItem[]`{lang="ts-type"}
15- [`ignoreFilter?: boolean`{lang="ts-type"}](#with-ignore-filter)
16- [`postFilter?: (searchTerm: string, items: T[]) => T[]`{lang="ts-type"}](#with-post-filtered-items)
17- `highlightedIcon?: string`{lang="ts-type"}
18 
19::caution
20You must provide an `id` for each group otherwise the group will be ignored.
21 
22- `multiple`: to allow multiple selections.
23- `placeholder`: to change the placeholder text.
24- `icon`: to customize the input [Icon](/docs/components/icon).
25- `loading`: to show a loading icon on the CommandPalette.
26- `close`: to display a [Button](/docs/components/button) to dismiss the CommandPalette.
27- `back`: to customize or hide the back button (with `false` value) displayed when navigating into a submenu.
28- `disabled`: to disable the CommandPalette.
29- `virtualize`: to enable virtualization for large lists as a boolean or an object with options like `{ estimateSize: 32, overscan: 12 }`.
30- `slot`:
31 
32## Usage
33 
34```vue
35<UCommandPalette
36  <!-- props here -->
37/>
38```
39 
40## Slots
41 
42- `#footer`
43- `#item`
44