@kitn.ai/ui/dist/ui/kbd.d.ts

Framework-agnostic, Shadow-DOM web components for building AI chat interfaces — works in React, Vue, Angular, Svelte, or plain HTML. Authored in SolidJS.

import { JSX } from 'solid-js';
export type KbdPlatform = 'auto' | 'mac' | 'other';
export interface KbdProps extends JSX.HTMLAttributes<HTMLElement> {
    /** Shortcut spec — tokens joined by `+` (e.g. `Mod+Shift+K`). When omitted,
     *  children render verbatim. Display only; `kai-kbd` does not bind keys. */
    keys?: string;
    /** Glyph platform. `mac` uses ⌘/⌥; `other` uses Ctrl. `auto` (default for the
     *  facade) sniffs the OS, SSR-safe (falls back to `other` on the server). */
    platform?: KbdPlatform;
    /** Cap size. Defaults to `md`. */
    size?: 'sm' | 'md';
}
/**
 * `Kbd`: a keyboard-shortcut display. Splits `keys` on `+`, maps each token to a
 * platform glyph (`Mod` → ⌘ on mac else Ctrl, `Shift` → ⇧, `ArrowUp` → ↑, …) and
 * renders each as an inset `part="key"` cap, with an empty `part="separator"` hook
 * between caps. Token-driven, light + dark. Display only — it does not bind keys.
 *
 * When `keys` is omitted, the children render verbatim (use any custom content).
 */
export declare function Kbd(props: KbdProps): JSX.Element;