@trimble-oss/moduswebcomponents
Version:
Modus Web Components is a modern, accessible UI library built with Stencil JS that provides reusable web components following Trimble's Modus design system. This updated version focuses on improved flexibility, enhanced theming options, comprehensive cust
70 lines (69 loc) • 2.18 kB
TypeScript
import { EventEmitter } from '../../stencil-public-runtime';
import { AppName } from '../types';
export interface IAppMenuItem {
/** The app name of the menu item. */
appName: AppName;
}
export declare class ModusWcAppMenu {
private inheritedAttributes;
el: HTMLElement;
/** custom class to apply to the menu */
customClass?: string;
/** The layout of the menu. */
layout?: 'list' | 'grid';
/** The apps to display in the menu. */
apps?: IAppMenuItem[];
/** Emit event when the layout changes */
layoutChange: EventEmitter<{
layout: 'list' | 'grid';
}>;
/** Emitted when reordering is confirmed via "Done" and the order differs from when edit started */
itemsOrderChange: EventEmitter<IAppMenuItem[]>;
/** Emitted when an item is clicked */
itemClick: EventEmitter<{
appName: AppName;
}>;
isEditMode: boolean;
draggedItemPos: {
appIndex: number;
} | null;
dropTargetIndex: number | null;
grabbedItemPos: {
appIndex: number;
} | null;
truncatedApps: Set<AppName>;
private appsSnapshot;
componentWillLoad(): void;
componentDidLoad(): void;
onAppsChange(): void;
private scheduleTooltipUpdate;
private setsAreEqual;
private setTruncatedApps;
private updateGridTooltips;
/** Label text node that visually truncates (inner div), not `.modus-wc-menu-item-labels`. */
private getListMenuItemLabelTextElement;
private updateListTooltips;
private getDisplayName;
onLayoutChange(newLayout: 'list' | 'grid'): void;
private handleEdit;
private hasOrderChangedSinceEdit;
private handleDone;
private handleCancel;
private handleKeyDown;
private reorderByKeyboard;
private navigateFocusByKeyboard;
private isGrabbed;
private handleRowFocusOut;
private isDragSource;
private handleDragStart;
private handleDragOver;
private handleDragEnter;
private handleDragEnd;
private handleDragLeave;
private handleDrop;
private handleContainerDrop;
private renderListLayout;
private renderGridLayout;
private getClasses;
render(): any;
}