| 1 | import type { ComponentProps } from "react"; |
| 2 | |
| 3 | import { cn } from "../../lib/cn"; |
| 4 | |
| 5 | // shadcn/ui's kbd, styled with g1t's tokens: a key, as a small raised cap |
| 6 | // in the text's own size and colour. `KbdGroup` holds a chord such as Ctrl K. |
| 7 | |
| 8 | export function Kbd({ className, ...props }: ComponentProps<"kbd">) { |
| 9 | return <kbd data-slot="kbd" className={cn("rounded bg-raised px-1 font-mono ring-1 ring-line", className)} {...props} />; |
| 10 | } |
| 11 | |
| 12 | export function KbdGroup({ className, ...props }: ComponentProps<"span">) { |
| 13 | return <span data-slot="kbd-group" className={cn("inline-flex items-center gap-1", className)} {...props} />; |
| 14 | } |