@loadsmart/miranda-wc
Version:
Miranda Web Components component library
63 lines (62 loc) • 2.23 kB
TypeScript
import type { LitElement, ReactiveControllerHost, ReactiveController } from 'lit';
export type KeyboardSupportControllerHost = ReactiveControllerHost & LitElement;
export type Shortcut = {
/**
* key identifier for the pressed key
*/
key: string;
/**
* is the meta (Command for Mac, Windows for MS Windows) key pressed?
*/
meta?: boolean;
/**
* is the shift key pressed?
*/
shift?: boolean;
/**
* is the ctrl key pressed?
*/
ctrl?: boolean;
/**
* is the alt key pressed?
*/
alt?: boolean;
};
export type ShortcutHandler = (event: KeyboardEvent) => void;
export type Keymap = {
shortcut: Shortcut | Shortcut[];
handler: ShortcutHandler;
};
export type KeyboardSupportControllerOptions = {
/**
* What event type to listen for. Either 'keydown' or 'keyup'.
*/
event?: 'keydown' | 'keyup';
getEventTarget?: (host: KeyboardSupportControllerHost) => HTMLElement;
};
export declare function getShortcutKey(shortcut: Shortcut): string;
/**
* Enable a component to implement behavior based on shortcuts.
*/
export declare class KeyboardSupportController implements ReactiveController {
#private;
host: KeyboardSupportControllerHost;
keymap: Map<string, ShortcutHandler>;
/**
* What event type to listen for. Either 'keydown' or 'keyup'.
*/
event: 'keydown' | 'keyup';
/**
* Get the element to which the keyboard event listener should be attached.
* This can be useful when you want to prevent [retargetting](https://lit.dev/docs/components/events/#shadowdom), which
* happens for events fired from the component's shadow DOM.
*
* By default, the target element will be the `host` element.
*
* @see {@link https://lit.dev/docs/components/events/#adding-event-listeners-to-the-component-or-its-shadow-root Lit, Adding event listeners to the component or its shadow root}
*/
getEventTarget: (host: KeyboardSupportControllerHost) => HTMLElement;
constructor(host: KeyboardSupportControllerHost, keymap: Keymap | Keymap[], options?: KeyboardSupportControllerOptions | null);
hostConnected(): Promise<void>;
hostDisconnected(): void;
}