primeng
Version:
PrimeNG is a premium UI library for Angular featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock,
382 lines (377 loc) • 16 kB
TypeScript
import { MenuItemTemplateContext, MenuPassThrough, MenuExpandedKeys, MenuSubmenuHeaderTemplateContext } from 'primeng/types/menu';
export * from 'primeng/types/menu';
import * as _angular_core from '@angular/core';
import { TemplateRef, PipeTransform, ElementRef } from '@angular/core';
import { MotionOptions, MotionEvent } from '@primeuix/motion';
import * as i2 from 'primeng/api';
import { MenuItem, OverlayService } from 'primeng/api';
import { BaseComponent } from 'primeng/basecomponent';
import * as i1 from 'primeng/bind';
import { Bind } from 'primeng/bind';
import { ConnectedOverlayScrollHandler } from 'primeng/dom';
import { CSSProperties, AppendTo } from 'primeng/types/shared';
import { VoidListener } from 'primeng/ts-helpers';
import { BaseStyle } from 'primeng/base';
import { SafeHtml } from '@angular/platform-browser';
/**
*
* Menu is a navigation / command component that supports dynamic and static positioning.
*
* [Live Demo](https://www.primeng.org/menu/)
*
* @module menustyle
*
*/
declare enum MenuClasses {
/**
* Class name of the root element
*/
root = "p-menu",
/**
* Class name of the start element
*/
start = "p-menu-start",
/**
* Class name of the list element
*/
list = "p-menu-list",
/**
* Class name of the submenu label element (non-toggleable group headers)
*/
submenuLabel = "p-menu-submenu-label",
/**
* Class name of the nested submenu list element
*/
submenuList = "p-menu-submenu-list",
/**
* Class name of the separator element
*/
separator = "p-menu-separator",
/**
* Class name of the end element
*/
end = "p-menu-end",
/**
* Class name of the item element
*/
item = "p-menu-item",
/**
* Class name of the item content element
*/
itemContent = "p-menu-item-content",
/**
* Class name of the item link element
*/
itemLink = "p-menu-item-link",
/**
* Class name of the item icon element
*/
itemIcon = "p-menu-item-icon",
/**
* Class name of the item label element
*/
itemLabel = "p-menu-item-label",
/**
* Class name of the item submenu toggle icon element (toggleable items)
*/
itemSubmenuIcon = "p-menu-item-submenu-icon"
}
declare class MenuStyle extends BaseStyle {
name: string;
style: string;
classes: {
root: ({ instance }: {
instance: any;
}) => (string | {
'p-menu-overlay': any;
})[];
start: string;
list: string;
submenuLabel: string;
submenuList: string;
separator: string;
end: string;
item: ({ instance, item, id, toggleable }: {
instance: any;
item: any;
id: any;
toggleable: any;
}) => any[];
itemContent: string;
itemLink: string;
itemIcon: ({ item }: {
item: any;
}) => any[];
itemLabel: string;
itemSubmenuIcon: string;
};
inlineStyles: {
root: ({ instance }: {
instance: any;
}) => any;
};
static ɵfac: _angular_core.ɵɵFactoryDeclaration<MenuStyle, never>;
static ɵprov: _angular_core.ɵɵInjectableDeclaration<MenuStyle>;
}
interface MenuStyle extends BaseStyle {
}
declare class SafeHtmlPipe implements PipeTransform {
private platformId;
private sanitizer;
transform(value: string): SafeHtml;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SafeHtmlPipe, never>;
static ɵpipe: _angular_core.ɵɵPipeDeclaration<SafeHtmlPipe, "safeHtml", true>;
}
declare class MenuItemContent extends BaseComponent {
item: _angular_core.InputSignal<MenuItem | undefined>;
itemTemplate: _angular_core.InputSignal<TemplateRef<MenuItemTemplateContext> | undefined>;
menuitemId: _angular_core.InputSignal<string>;
idx: _angular_core.InputSignal<number>;
toggleable: _angular_core.InputSignalWithTransform<boolean, unknown>;
expanded: _angular_core.InputSignalWithTransform<boolean, unknown>;
depth: _angular_core.InputSignalWithTransform<number, unknown>;
submenuIconTemplate: _angular_core.InputSignal<TemplateRef<any> | undefined>;
onMenuItemClick: _angular_core.OutputEmitterRef<{
originalEvent: Event;
item: MenuItem | undefined;
}>;
menu: Menu;
_componentStyle: MenuStyle;
hostName: string;
onItemClick(event: Event, item: MenuItem | undefined): void;
getRouterLinkActiveOptions(item: MenuItem | undefined): any;
getPTOptions(key: string): any;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<MenuItemContent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<MenuItemContent, "[pMenuItemContent]", never, { "item": { "alias": "pMenuItemContent"; "required": false; "isSignal": true; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; "isSignal": true; }; "menuitemId": { "alias": "menuitemId"; "required": false; "isSignal": true; }; "idx": { "alias": "idx"; "required": false; "isSignal": true; }; "toggleable": { "alias": "toggleable"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; "depth": { "alias": "depth"; "required": false; "isSignal": true; }; "submenuIconTemplate": { "alias": "submenuIconTemplate"; "required": false; "isSignal": true; }; }, { "onMenuItemClick": "onMenuItemClick"; }, never, ["*"], true, never>;
}
/**
* Menu is a navigation / command component that supports dynamic and static positioning.
* @group Components
*/
declare class Menu extends BaseComponent<MenuPassThrough> {
componentName: string;
/**
* An array of menuitems.
* @group Props
*/
model: _angular_core.InputSignal<MenuItem[] | undefined>;
/**
* Defines if menu would displayed as a popup.
* @group Props
*/
popup: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Inline style of the component.
* @group Props
*/
style: _angular_core.InputSignal<CSSProperties>;
/**
* Style class of the component.
* @group Props
*/
styleClass: _angular_core.InputSignal<string | undefined>;
/**
* Whether to automatically manage layering.
* @group Props
*/
autoZIndex: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Base zIndex value to use in layering.
* @group Props
*/
baseZIndex: _angular_core.InputSignalWithTransform<number, unknown>;
/**
* Defines a string value that labels an interactive element.
* @group Props
*/
ariaLabel: _angular_core.InputSignal<string | undefined>;
/**
* Identifier of the underlying input element.
* @group Props
*/
ariaLabelledBy: _angular_core.InputSignal<string | undefined>;
/**
* Current id state as a string.
* @group Props
*/
id: _angular_core.InputSignal<string | undefined>;
/**
* Index of the element in tabbing order.
* @group Props
*/
tabindex: _angular_core.InputSignalWithTransform<number, unknown>;
/**
* Target element to attach the overlay, valid values are "body" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name).
* @defaultValue 'self'
* @group Props
*/
appendTo: _angular_core.InputSignal<AppendTo>;
/**
* The motion options.
* @group Props
*/
motionOptions: _angular_core.InputSignal<MotionOptions | undefined>;
/**
* When provided, switches the component to controlled mode; each key is the DOM id of a toggleable submenu header and the value its expansion flag.
* Use two-way binding with `[(expandedKeys)]`.
* @group Props
*/
expandedKeys: _angular_core.ModelSignal<MenuExpandedKeys | undefined>;
/**
* Callback to invoke when overlay menu is shown.
* @group Emits
*/
onShow: _angular_core.OutputEmitterRef<object>;
/**
* Callback to invoke when overlay menu is hidden.
* @group Emits
*/
onHide: _angular_core.OutputEmitterRef<object>;
/**
* Callback to invoke when the list loses focus.
* @param {Event} event - blur event.
* @group Emits
*/
onBlur: _angular_core.OutputEmitterRef<Event>;
/**
* Callback to invoke when the list receives focus.
* @param {Event} event - focus event.
* @group Emits
*/
onFocus: _angular_core.OutputEmitterRef<Event>;
/**
* Defines template option for start.
* @group Templates
*/
startTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
/**
* Defines template option for end.
* @group Templates
*/
endTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
/**
* Custom item template.
* @param {MenuItemTemplateContext} context - item context.
* @see {@link MenuItemTemplateContext}
* @group Templates
*/
itemTemplate: _angular_core.Signal<TemplateRef<MenuItemTemplateContext> | undefined>;
/**
* Custom submenu header template.
* @param {MenuSubmenuHeaderTemplateContext} context - submenu header context.
* @see {@link MenuSubmenuHeaderTemplateContext}
* @group Templates
*/
submenuHeaderTemplate: _angular_core.Signal<TemplateRef<MenuSubmenuHeaderTemplateContext> | undefined>;
/**
* Custom submenu toggle icon template.
* @param {MenuSubmenuHeaderTemplateContext} context - submenu header context.
* @see {@link MenuSubmenuHeaderTemplateContext}
* @group Templates
*/
submenuIconTemplate: _angular_core.Signal<TemplateRef<MenuSubmenuHeaderTemplateContext> | undefined>;
listViewChild: _angular_core.Signal<ElementRef<any> | undefined>;
containerViewChild: _angular_core.Signal<ElementRef<any> | undefined>;
private _internalId;
$id: _angular_core.Signal<string>;
$appendTo: _angular_core.Signal<AppendTo>;
computedMotionOptions: _angular_core.Signal<MotionOptions>;
container: HTMLElement | undefined;
scrollHandler: ConnectedOverlayScrollHandler | null | undefined;
documentClickListener: VoidListener;
documentResizeListener: VoidListener;
preventDocumentDefault: boolean | undefined;
target: HTMLElement | null;
visible: _angular_core.WritableSignal<boolean>;
focusedOptionId: _angular_core.Signal<string | number | null>;
focusedOptionIndex: _angular_core.WritableSignal<string | number>;
selectedOptionIndex: _angular_core.WritableSignal<number>;
focused: _angular_core.WritableSignal<boolean>;
overlayVisible: _angular_core.WritableSignal<boolean>;
d_expandedKeys: _angular_core.WritableSignal<MenuExpandedKeys>;
currentExpandedKeys: _angular_core.Signal<MenuExpandedKeys>;
$pcMenu: Menu | undefined;
overlayService: OverlayService;
_componentStyle: MenuStyle;
bindDirectiveInstance: Bind;
onAfterViewChecked(): void;
dataP: _angular_core.Signal<string>;
getPTOptions(key: string, item: MenuItem | undefined, index: number, id: string): any;
/**
* Toggles the visibility of the popup menu.
* @param {Event} event - Browser event.
* @group Method
*/
toggle(event: Event): void;
/**
* Displays the popup menu.
* @param {Event} event - Browser event.
* @group Method
*/
show(event: Event): void;
onInit(): void;
getTabIndexValue(): string | null;
onOverlayBeforeEnter(event: MotionEvent): void;
onOverlayAfterLeave(): void;
appendOverlay(): void;
restoreOverlayAppend(): void;
moveOnTop(): void;
/**
* Hides the popup menu.
* @group Method
*/
hide(): void;
onWindowResize(): void;
menuitemId(item: MenuItem, id: string, index?: string | number, childIndex?: string | number): string;
isItemFocused(id: string | number | null): boolean;
label(label: string | (() => string) | undefined): string | undefined;
disabled(disabled: boolean | (() => boolean) | undefined): boolean;
isVisible(item: MenuItem): boolean;
isSeparatorVisible(item: MenuItem): boolean | undefined;
isItemVisible(item: MenuItem): boolean;
isSubmenuSeparatorVisible(item: MenuItem, submenu: MenuItem): boolean | undefined;
isSubmenuItemVisible(item: MenuItem, submenu: MenuItem): boolean;
activedescendant: _angular_core.Signal<string | number | null | undefined>;
onListFocus(event: Event): void;
onListBlur(event: FocusEvent | MouseEvent): void;
onListKeyDown(event: KeyboardEvent): void;
onArrowDownKey(event: KeyboardEvent): void;
onArrowUpKey(event: KeyboardEvent): void;
onHomeKey(event: KeyboardEvent): void;
onEndKey(event: KeyboardEvent): void;
onEnterKey(event: KeyboardEvent): void;
onSpaceKey(event: KeyboardEvent): void;
findNextOptionIndex(index: string | number): number;
findPrevOptionIndex(index: string | number): number;
changeFocusedOptionIndex(index: number): void;
itemClick(event: {
originalEvent: Event;
item: MenuItem;
}, id: string): void;
onOverlayClick(event: Event): void;
bindDocumentClickListener(): void;
unbindDocumentClickListener(): void;
bindDocumentResizeListener(): void;
unbindDocumentResizeListener(): void;
bindScrollListener(): void;
unbindScrollListener(): void;
onOverlayHide(): void;
onDestroy(): void;
hasSubMenu(): boolean;
getSubmenuKey(submenu: MenuItem, id: string): string;
isSubmenuToggleable(submenu: MenuItem, depth?: number): boolean;
isSubmenuExpanded(submenu: MenuItem, depth?: number, id?: string): boolean;
toggleSubmenu(submenu: MenuItem, id: string, depth?: number): void;
onItemLiClick(event: Event, item: MenuItem, id: string, depth: number): void;
onItemLiMousedown(event: Event, item: MenuItem, depth: number): void;
focusMenuList(): void;
isItemHidden(item: MenuItem): boolean;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<Menu, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<Menu, "p-menu", never, { "model": { "alias": "model"; "required": false; "isSignal": true; }; "popup": { "alias": "popup"; "required": false; "isSignal": true; }; "style": { "alias": "style"; "required": false; "isSignal": true; }; "styleClass": { "alias": "styleClass"; "required": false; "isSignal": true; }; "autoZIndex": { "alias": "autoZIndex"; "required": false; "isSignal": true; }; "baseZIndex": { "alias": "baseZIndex"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "tabindex": { "alias": "tabindex"; "required": false; "isSignal": true; }; "appendTo": { "alias": "appendTo"; "required": false; "isSignal": true; }; "motionOptions": { "alias": "motionOptions"; "required": false; "isSignal": true; }; "expandedKeys": { "alias": "expandedKeys"; "required": false; "isSignal": true; }; }, { "expandedKeys": "expandedKeysChange"; "onShow": "onShow"; "onHide": "onHide"; "onBlur": "onBlur"; "onFocus": "onFocus"; }, ["startTemplate", "endTemplate", "itemTemplate", "submenuHeaderTemplate", "submenuIconTemplate"], never, true, [{ directive: typeof i1.Bind; inputs: {}; outputs: {}; }]>;
}
declare class MenuModule {
static ɵfac: _angular_core.ɵɵFactoryDeclaration<MenuModule, never>;
static ɵmod: _angular_core.ɵɵNgModuleDeclaration<MenuModule, never, [typeof Menu, typeof i2.SharedModule, typeof SafeHtmlPipe], [typeof Menu, typeof i2.SharedModule, typeof SafeHtmlPipe]>;
static ɵinj: _angular_core.ɵɵInjectorDeclaration<MenuModule>;
}
export { Menu, MenuClasses, MenuItemContent, MenuModule, MenuStyle, SafeHtmlPipe };