export class AuroMenuOption extends AuroElement { /** * This will register this element with the browser. * @param {string} [name="auro-menuoption"] - The name of the element that you want to register. * * @example * AuroMenuOption.register("custom-menuoption") // this will register this element to * */ static register(name?: string): void; static get properties(): { /** * When true, disables the menu option. */ disabled: { type: BooleanConstructor; reflect: boolean; }; /** * @private */ event: { type: StringConstructor; reflect: boolean; }; /** * @private */ layout: { type: StringConstructor; }; /** * Allows users to set a unique key for the menu option for specified option selection. If no key is provided, the value property will be used. */ key: { type: StringConstructor; reflect: boolean; }; /** * @private */ menuService: { type: ObjectConstructor; state: boolean; }; /** * @private */ matchWord: { type: StringConstructor; state: boolean; }; /** * @private */ noCheckmark: { type: BooleanConstructor; reflect: boolean; }; /** * Specifies that an option is selected. */ selected: { type: BooleanConstructor; reflect: boolean; }; /** * Specifies the tab index of the menu option. */ tabIndex: { type: NumberConstructor; reflect: boolean; }; /** * Specifies the value to be sent to a server. */ value: { type: StringConstructor; reflect: boolean; }; }; static get styles(): import("lit").CSSResult[]; /** * Returns whether the menu option is currently active and selectable. * An option is considered active if it is not hidden, not disabled, and not static. * @returns {boolean} True if the option is active, false otherwise. */ get isActive(): boolean; /** * @private */ private shape; /** * @private */ private size; iconTag: any; selected: boolean; noCheckmark: boolean; disabled: boolean; /** * @private */ private runtimeUtils; menuService: any; unsubscribe: any; /** * Handles changes from the menu service and updates the option's state. * This function synchronizes the option's properties and selection/highlight state with menu events. * @param {Object} event - The event object from the menu service. */ handleMenuChange(event: any): void; _contextConsumer: ContextConsumer, this>; key: any; firstUpdated(): void; updated(changedProperties: any): void; /** * Sets up event listeners for user interaction with the menu option. * This function enables click and mouse enter events to trigger selection and highlighting logic. */ bindEvents(): void; /** * Attaches this menu option to a menu service and subscribes to its events. * This method enables the option to participate in menu selection and highlighting logic. * @param {Object} service - The menu service instance to attach to. */ attachTo(service: any): void; active: boolean; /** * Updates the internal selected state of the menu option bypassing 'updated' and triggers custom events if selected. * This function ensures the option's selection state is synchronized with menu logic and notifies listeners. * @param {boolean} isSelected - Whether the option should be marked as selected. */ setInternalSelected(isSelected: boolean): void; internalUpdateInProgress: boolean; /** * Sets the selected state of the menu option. * This function updates whether the option is currently selected. * @param {boolean} isSelected - Whether the option should be marked as selected. * @deprecated Simply modify the `selected` property directly instead. */ setSelected(isSelected: boolean): void; /** * Updates the active state and visual highlighting of the menu option. * This function toggles the option's active status and applies or removes the active CSS class. * @param {boolean} isActive - Whether the option should be marked as active. * @deprecated Simply modify the `active` property directly instead. */ updateActive(isActive: boolean): void; /** * Updates the CSS class for the menu option based on its active state. * This function adds or removes the 'active' class to visually indicate the option's active status. * @private */ private updateActiveClasses; /** * Updates the visual highlighting of text within the menu option based on the current match word. * This function highlights matching text segments and manages nested spacers for display formatting. * @private */ private updateTextHighlight; /** * Handles click events on the menu option, toggling its selected state. * This function dispatches a click event and updates selection if the option is not disabled. * @private */ private handleClick; /** * Handles mouse enter events to highlight the menu option. * This function updates the menu service to set this option as the currently highlighted item if not disabled. * @private */ private handleMouseEnter; /** * Dispatches custom events defined for this menu option. * This function notifies listeners when a custom event is triggered by the option. * @private */ private handleCustomEvent; /** * Dispatches a click event for this menu option. * This function notifies listeners that the option has been clicked. * @private */ private dispatchClickEvent; /** * Generates an HTML element containing an SVG icon based on the provided `svgContent`. * * @private * @param {string} svgContent - The SVG content to be embedded. * @returns {Element} The HTML element containing the SVG icon. */ private generateIconHtml; /** * Logic to determine the layout of the component. * @protected * @returns {void} */ protected renderLayout(): void; } import { AuroElement } from "../../layoutElement/src/auroElement.js"; import { ContextConsumer } from '@lit/context';