import type { ICommandMenuAction } from './ICommandMenuAction.js'; import { LitElement } from 'lit'; import '../visually-hidden/VisuallyHidden.js'; import './CommandMenuAction.js'; /** * Command Menu allows users to navigate and use an app without * touching the mouse and helps them transform into “power users” * who can harness more advanced features far faster. * * @status ready * @category action * @slot footer - Used to replace the default footer contents. * @fires open - The command menu was opened. * @fires close - The command menu was closed. * @fires {SelectEvent} nord-select - User selected a command from the menu. * * @cssprop [--n-command-menu-inline-size=640px] - Controls the max inline size, or width, of the command menu. * @cssprop [--n-command-menu-block-size=290px] - Controls the max block size, or height, of the command menu. * @cssprop [--n-command-menu-block-start=16%] - Controls the command menu offset from the block start, or top, of the screen. * * @localization instructions - Instructions that offer guidance on how to use the command menu. * @localization inputLabel - Accessible label given to the command menu's input. * @localization footerArrowKeys - Describes what the arrow keys do. * @localization footerEnterKey - Describes what the enter key does. * @localization footerEscapeKey - Describes what the escape key does. * @localization footerBackspaceKey - Describes what the backspace key does. * @localization noResults - A message shown when there are no matching results. * @localization tip - A hint tip that describes some approaches to find a command when there are no matching results. * @localization placeholder - Hint text to display in the Command Menu search field. */ export default class CommandMenu extends LitElement { static styles: import("lit").CSSResult[]; private inputRef; private listRef; private previousFocus?; private localize; private dismissController; private keyboardController; /** * Show or hide the command menu. */ open: boolean; /** * Use external filtering mode. When set to true, the component will not perform * internal text-based filtering and expects external filtering logic to be implemented. */ externalFiltering: boolean; /** * When enabled, typing in the search input will automatically exit nested views * to allow global search across all commands. */ exitNestedOnSearch: boolean; /** * Array of commands to be included in the menu. * Please see “Commands data” section for more documentation. */ commands: Array; /** * Current search query in the command menu input. */ searchQuery: string; private parent; private bump; private selectedIndex; private filteredCommands; private get selected(); /** * Show the command menu programmatically. * @param options - Options for showing the menu. * @param options.parent - Opens the menu filtered to a specific parent command. */ show(options?: { parent?: string; }): void; /** * Close the command menu programmatically. */ close(): void; /** * Toggle the open state programmatically. */ toggleOpen(): void; /** * Focus the command menu's input. */ focus(): void; render(): import("lit").TemplateResult<1>; private renderNoResults; private renderSection; protected handleCommandsChange(): void; protected handleBump(): void; protected focusOnOpen(): void; private handleAnimationEnd; private handleBlur; private handleInput; private select; private start; private end; private next; private previous; private goBack; private setParent; private setSearch; private filterCommands; } declare global { interface HTMLElementTagNameMap { 'nord-command-menu': CommandMenu; } }