Search for a command to run...
A component to display keyboard keys and shortcuts.
Press
⌘Kto open search
Or use
⌘ + K
import { Kbd, KbdGroup } from "@/components/optics/kbd";<div className="flex flex-col items-center gap-6"> <div className="flex items-center gap-2"> <p className="text-sm"> Press </p> <Kbd useHotkey> ⌘ </Kbd> <Kbd useHotkey> K </Kbd> <p className="text-sm"> to open search </p> </div> <div className="flex items-center gap-2"> <p className="text-sm"> Or use </p> <KbdGroup> <Kbd useHotkey> ⌘ + K </Kbd> </KbdGroup> </div></div>import { Kbd, KbdGroup } from "@/components/optics/kbd";<div className="flex flex-col items-center gap-6"> <div className="flex items-center gap-2"> <p className="text-sm"> Press </p> <Kbd useHotkey> ⌘ </Kbd> <Kbd useHotkey> K </Kbd> <p className="text-sm"> to open search </p> </div> <div className="flex items-center gap-2"> <p className="text-sm"> Or use </p> <KbdGroup> <Kbd useHotkey> ⌘ + K </Kbd> </KbdGroup> </div></div>Name | Type | |
|---|---|---|
variant | string(default: default) | |
useHotkey | boolean(default: false) | |
animate | boolean(default: true) | |
onHotkeyPress | string(default: undefined) | |
hotkey | string(default: undefined) |