primeng 16.5.1 → 16.7.0

package/multiselect/multiselect.d.ts

@@ -21,19 +21,23 @@ import * as i10 from "primeng/icons/times";
 import * as i11 from "primeng/icons/chevrondown";
 export declare const MULTISELECT_VALUE_ACCESSOR: any;
 export declare class MultiSelectItem {
+    id: string | undefined;
     option: any;
     selected: boolean | undefined;
     label: string | undefined;
     disabled: boolean | undefined;
     itemSize: number | undefined;
+    focused: boolean | undefined;
+    ariaPosInset: string | undefined;
+    ariaSetSize: string | undefined;
     template: TemplateRef<any> | undefined;
     checkIconTemplate: TemplateRef<any> | undefined;
     onClick: EventEmitter<any>;
-    onKeydown: EventEmitter<any>;
+    onMouseEnter: EventEmitter<any>;
     onOptionClick(event: Event): void;
-    onOptionKeydown(event: Event): void;
+    onOptionMouseEnter(event: Event): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectItem, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectItem, "p-multiSelectItem", never, { "option": { "alias": "option"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "label": { "alias": "label"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "template": { "alias": "template"; "required": false; }; "checkIconTemplate": { "alias": "checkIconTemplate"; "required": false; }; }, { "onClick": "onClick"; "onKeydown": "onKeydown"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectItem, "p-multiSelectItem", never, { "id": { "alias": "id"; "required": false; }; "option": { "alias": "option"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "label": { "alias": "label"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "focused": { "alias": "focused"; "required": false; }; "ariaPosInset": { "alias": "ariaPosInset"; "required": false; }; "ariaSetSize": { "alias": "ariaSetSize"; "required": false; }; "template": { "alias": "template"; "required": false; }; "checkIconTemplate": { "alias": "checkIconTemplate"; "required": false; }; }, { "onClick": "onClick"; "onMouseEnter": "onMouseEnter"; }, never, never, false, never>;
 }
 /**
  * MultiSelect is used to select multiple items from a collection.
@@ -47,6 +51,16 @@ export declare class MultiSelect implements OnInit, AfterViewInit, AfterContentI
     filterService: FilterService;
     config: PrimeNGConfig;
     overlayService: OverlayService;
+    /**
+     * Unique identifier of the component
+     * @group Props
+     */
+    id: string | undefined;
+    /**
+     * Defines a string that labels the input for accessibility.
+     * @group Props
+     */
+    ariaLabel: string | undefined;
     /**
      * Inline style of the element.
      * @group Props
@@ -129,11 +143,6 @@ export declare class MultiSelect implements OnInit, AfterViewInit, AfterContentI
      * @group Props
      */
     name: string | undefined;
-    /**
-     * Label of the input for accessibility.
-     * @group Props
-     */
-    label: string | undefined;
     /**
      * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
      * @group Props
@@ -149,6 +158,11 @@ export declare class MultiSelect implements OnInit, AfterViewInit, AfterContentI
      * @group Props
      */
     maxSelectedLabels: number;
+    /**
+     * Decides how many selected item labels to show at most.
+     * @group Props
+     */
+    selectionLimit: number | undefined;
     /**
      * Label to display after exceeding max selected labels e.g. ({0} items selected), defaults "ellipsis" keyword to indicate a text-overflow.
      * @group Props
@@ -355,20 +369,25 @@ export declare class MultiSelect implements OnInit, AfterViewInit, AfterContentI
     get itemSize(): number | undefined;
     set itemSize(val: number | undefined);
     /**
-     * Number of maximum options that can be selected.
+     * Fields used when filtering the options, defaults to optionLabel.
      * @group Props
      */
-    get selectionLimit(): number | undefined;
-    set selectionLimit(val: number | undefined);
-    containerViewChild: Nullable<ElementRef>;
-    overlayViewChild: Nullable<Overlay>;
-    filterInputChild: Nullable<ElementRef>;
-    accessibleViewChild: Nullable<ElementRef>;
-    itemsViewChild: Nullable<ElementRef>;
-    scroller: Nullable<Scroller>;
-    footerFacet: any;
-    headerFacet: any;
-    templates: Nullable<QueryList<PrimeTemplate>>;
+    focusOnHover: boolean;
+    /**
+     * Fields used when filtering the options, defaults to optionLabel.
+     * @group Props
+     */
+    filterFields: any[] | undefined;
+    /**
+     * Determines if the option will be selected on focus.
+     * @group Props
+     */
+    selectOnFocus: boolean;
+    /**
+     * Whether to focus on the first visible or selected element when the overlay panel is shown.
+     * @group Props
+     */
+    autoOptionFocus: boolean;
     /**
      * Callback to invoke when value changes.
      * @param {MultiSelectChangeEvent} event - Custom change event.
@@ -426,6 +445,20 @@ export declare class MultiSelect implements OnInit, AfterViewInit, AfterContentI
      * @group Emits
      */
     onRemove: EventEmitter<MultiSelectRemoveEvent>;
+    containerViewChild: Nullable<ElementRef>;
+    overlayViewChild: Nullable<Overlay>;
+    filterInputChild: Nullable<ElementRef>;
+    focusInputViewChild: Nullable<ElementRef>;
+    itemsViewChild: Nullable<ElementRef>;
+    scroller: Nullable<Scroller>;
+    lastHiddenFocusableElementOnOverlay: Nullable<ElementRef>;
+    firstHiddenFocusableElementOnOverlay: Nullable<ElementRef>;
+    headerCheckboxViewChild: Nullable<ElementRef>;
+    footerFacet: any;
+    headerFacet: any;
+    templates: Nullable<QueryList<PrimeTemplate>>;
+    searchValue: Nullable<string>;
+    searchTimeout: any;
     _autoZIndex: boolean | undefined;
     _baseZIndex: number | undefined;
     _showTransitionOptions: string | undefined;
@@ -440,8 +473,6 @@ export declare class MultiSelect implements OnInit, AfterViewInit, AfterContentI
     onModelTouched: Function;
     valuesAsString: string | undefined;
     focus: boolean | undefined;
-    filled: boolean | undefined | null;
-    _filterValue: string | undefined | null;
     filtered: boolean | undefined;
     itemTemplate: TemplateRef<any> | undefined;
     groupTemplate: TemplateRef<any> | undefined;
@@ -460,68 +491,148 @@ export declare class MultiSelect implements OnInit, AfterViewInit, AfterContentI
     dropdownIconTemplate: TemplateRef<any> | undefined;
     headerCheckboxFocus: boolean | undefined;
     filterOptions: MultiSelectFilterOptions | undefined;
-    _options: any[] | undefined;
     maxSelectionLimitReached: boolean | undefined;
     preventModelTouched: boolean | undefined;
     preventDocumentDefault: boolean | undefined;
+    focused: boolean;
+    itemsWrapper: any;
+    modelValue: import("@angular/core").WritableSignal<any>;
+    _filterValue: import("@angular/core").WritableSignal<any>;
+    _options: import("@angular/core").WritableSignal<any[]>;
+    startRangeIndex: import("@angular/core").WritableSignal<number>;
+    focusedOptionIndex: import("@angular/core").WritableSignal<number>;
+    get containerClass(): {
+        'p-multiselect p-component p-inputwrapper': boolean;
+        'p-disabled': boolean;
+        'p-multiselect-clearable': boolean;
+        'p-multiselect-chip': boolean;
+        'p-focus': boolean;
+        'p-inputwrapper-filled': boolean;
+        'p-inputwrapper-focus': boolean;
+    };
+    get inputClass(): {
+        'p-multiselect-label p-inputtext': boolean;
+        'p-placeholder': boolean;
+        'p-multiselect-label-empty': boolean;
+    };
+    get panelClass(): {
+        'p-multiselect-panel p-component': boolean;
+        'p-input-filled': boolean;
+        'p-ripple-disabled': boolean;
+    };
+    get labelClass(): {
+        'p-multiselect-label': boolean;
+        'p-placeholder': boolean;
+        'p-multiselect-label-empty': boolean;
+    };
+    get emptyMessageLabel(): string;
+    get emptyFilterMessageLabel(): string;
+    get filled(): boolean;
+    get isVisibleClearIcon(): boolean | undefined;
+    get toggleAllAriaLabel(): string;
+    get closeAriaLabel(): string;
+    visibleOptions: import("@angular/core").Signal<any>;
+    label: import("@angular/core").Signal<any>;
+    chipSelectedItems: import("@angular/core").Signal<any>;
     constructor(el: ElementRef, renderer: Renderer2, cd: ChangeDetectorRef, zone: NgZone, filterService: FilterService, config: PrimeNGConfig, overlayService: OverlayService);
     ngOnInit(): void;
     ngAfterContentInit(): void;
     ngAfterViewInit(): void;
     ngAfterViewChecked(): void;
+    flatOptions(options: any): any;
+    autoUpdateModel(): void;
+    updateModel(value: any, event?: any): void;
+    onOptionSelect(event: any, isFocus?: boolean, index?: number): void;
+    onOptionSelectRange(event: any, start?: number, end?: number): void;
+    searchFields(): any[];
+    findNearestSelectedOptionIndex(index: any, firstCheckUp?: boolean): any;
+    findPrevSelectedOptionIndex(index: any): number;
+    findFirstFocusedOptionIndex(): any;
+    findFirstOptionIndex(): any;
+    findFirstSelectedOptionIndex(): any;
+    findNextSelectedOptionIndex(index: any): any;
+    equalityKey(): string;
+    hasSelectedOption(): boolean;
+    isValidSelectedOption(option: any): any;
+    isOptionGroup(option: any): any;
+    isValidOption(option: any): boolean;
+    isOptionDisabled(option: any): any;
+    isSelected(option: any): any;
+    isOptionMatched(option: any): any;
+    isEmpty(): boolean;
+    getOptionIndex(index: any, scrollerOptions: any): any;
+    getAriaPosInset(index: any): any;
+    get ariaSetSize(): any;
+    getLabelByValue(value: any): any;
+    getSelectedItemsLabel(): string;
     getOptionLabel(option: any): any;
     getOptionValue(option: any): any;
     getOptionGroupLabel(optionGroup: any): any;
     getOptionGroupChildren(optionGroup: any): any;
-    isOptionDisabled(option: any): any;
-    writeValue(value: any): void;
+    onKeyDown(event: KeyboardEvent): void;
+    onFilterKeyDown(event: KeyboardEvent): void;
+    onArrowLeftKey(event: KeyboardEvent, pressedInInputText?: boolean): void;
+    onArrowDownKey(event: any): void;
+    onArrowUpKey(event: any, pressedInInputText?: boolean): void;
+    onHomeKey(event: any, pressedInInputText?: boolean): void;
+    onEndKey(event: any, pressedInInputText?: boolean): void;
+    onPageDownKey(event: any): void;
+    onPageUpKey(event: any): void;
+    onEnterKey(event: any): void;
+    onEscapeKey(event: any): void;
+    onDeleteKey(event: KeyboardEvent): void;
+    onTabKey(event: any, pressedInInputText?: boolean): void;
+    onShiftKey(): void;
+    onContainerClick(event: any): void;
+    onFirstHiddenFocus(event: any): void;
+    onInputFocus(event: Event): void;
+    onInputBlur(event: Event): void;
+    onFilterInputChange(event: KeyboardEvent): void;
+    onLastHiddenFocus(event: any): void;
+    onOptionMouseEnter(event: any, index: any): void;
+    onHeaderCheckboxKeyDown(event: any): void;
+    onFilterBlur(event: any): void;
+    onHeaderCheckboxFocus(): void;
+    onHeaderCheckboxBlur(): void;
+    onToggleAll(event: any): void;
+    changeFocusedOptionIndex(event: any, index: any): void;
+    get virtualScrollerDisabled(): boolean;
+    scrollInView(index?: number): void;
+    get focusedOptionId(): string;
     checkSelectionLimit(): void;
-    updateFilledState(): void;
+    writeValue(value: any): void;
     registerOnChange(fn: Function): void;
     registerOnTouched(fn: Function): void;
     setDisabledState(val: boolean): void;
-    onOptionClick(event: {
-        originalEvent: Event;
-        option: any;
-    }): void;
-    isSelected(option: any): boolean;
-    findSelectionIndex(val: any): number;
-    get toggleAllDisabled(): boolean;
-    toggleAll(event: Event): void;
-    checkAll(): void;
-    uncheckAll(): void;
-    show(): void;
+    allSelected(): any;
+    /**
+     * Displays the panel.
+     * @group Method
+     */
+    show(isFocus?: any): void;
+    /**
+     * Hides the panel.
+     * @group Method
+     */
+    hide(isFocus?: any): void;
     onOverlayAnimationStart(event: AnimationEvent): void;
-    hide(): void;
     resetFilter(): void;
     close(event: Event): void;
     clear(event: Event): void;
-    onMouseclick(event: MouseEvent, input: HTMLInputElement): void;
-    removeChip(chip: MultiSelectItem, event: MouseEvent): void;
-    onInputFocus(event: Event): void;
-    onInputBlur(event: Event): void;
-    onOptionKeydown(event: {
-        originalEvent: Event;
-        option: any;
-    }): void;
+    removeOption(optionValue: any, event: any): void;
     findNextItem(item: any): HTMLElement | null;
     findPrevItem(item: any): HTMLElement | null;
-    onKeydown(event: KeyboardEvent): void;
-    updateLabel(): void;
-    findLabelByValue(val: any): string;
-    searchLabelByValue(val: any, options: any[]): string;
-    get allChecked(): boolean;
-    get optionsToRender(): any[];
-    get emptyMessageLabel(): string;
-    get emptyFilterMessageLabel(): string;
-    hasFilter(): boolean;
-    isEmpty(): boolean;
-    onFilterInputChange(event: KeyboardEvent): void;
+    findNextOptionIndex(index: any): any;
+    findPrevOptionIndex(index: any): any;
+    findLastSelectedOptionIndex(): number;
+    findLastFocusedOptionIndex(): number;
+    findLastOptionIndex(): number;
+    searchOptions(event: any, char: any): boolean;
     activateFilter(): void;
-    onHeaderCheckboxFocus(): void;
-    onHeaderCheckboxBlur(): void;
+    hasFocusableElements(): boolean;
+    hasFilter(): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelect, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelect, "p-multiSelect", never, { "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "panelStyle": { "alias": "panelStyle"; "required": false; }; "panelStyleClass": { "alias": "panelStyleClass"; "required": false; }; "inputId": { "alias": "inputId"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "group": { "alias": "group"; "required": false; }; "filter": { "alias": "filter"; "required": false; }; "filterPlaceHolder": { "alias": "filterPlaceHolder"; "required": false; }; "filterLocale": { "alias": "filterLocale"; "required": false; }; "overlayVisible": { "alias": "overlayVisible"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "appendTo": { "alias": "appendTo"; "required": false; }; "dataKey": { "alias": "dataKey"; "required": false; }; "name": { "alias": "name"; "required": false; }; "label": { "alias": "label"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "displaySelectedLabel": { "alias": "displaySelectedLabel"; "required": false; }; "maxSelectedLabels": { "alias": "maxSelectedLabels"; "required": false; }; "selectedItemsLabel": { "alias": "selectedItemsLabel"; "required": false; }; "showToggleAll": { "alias": "showToggleAll"; "required": false; }; "emptyFilterMessage": { "alias": "emptyFilterMessage"; "required": false; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; }; "resetFilterOnHide": { "alias": "resetFilterOnHide"; "required": false; }; "dropdownIcon": { "alias": "dropdownIcon"; "required": false; }; "optionLabel": { "alias": "optionLabel"; "required": false; }; "optionValue": { "alias": "optionValue"; "required": false; }; "optionDisabled": { "alias": "optionDisabled"; "required": false; }; "optionGroupLabel": { "alias": "optionGroupLabel"; "required": false; }; "optionGroupChildren": { "alias": "optionGroupChildren"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "filterBy": { "alias": "filterBy"; "required": false; }; "scrollHeight": { "alias": "scrollHeight"; "required": false; }; "lazy": { "alias": "lazy"; "required": false; }; "virtualScroll": { "alias": "virtualScroll"; "required": false; }; "virtualScrollItemSize": { "alias": "virtualScrollItemSize"; "required": false; }; "virtualScrollOptions": { "alias": "virtualScrollOptions"; "required": false; }; "overlayOptions": { "alias": "overlayOptions"; "required": false; }; "ariaFilterLabel": { "alias": "ariaFilterLabel"; "required": false; }; "filterMatchMode": { "alias": "filterMatchMode"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "tooltipPosition": { "alias": "tooltipPosition"; "required": false; }; "tooltipPositionStyle": { "alias": "tooltipPositionStyle"; "required": false; }; "tooltipStyleClass": { "alias": "tooltipStyleClass"; "required": false; }; "autofocusFilter": { "alias": "autofocusFilter"; "required": false; }; "display": { "alias": "display"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "showClear": { "alias": "showClear"; "required": false; }; "autoZIndex": { "alias": "autoZIndex"; "required": false; }; "baseZIndex": { "alias": "baseZIndex"; "required": false; }; "showTransitionOptions": { "alias": "showTransitionOptions"; "required": false; }; "hideTransitionOptions": { "alias": "hideTransitionOptions"; "required": false; }; "defaultLabel": { "alias": "defaultLabel"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "options": { "alias": "options"; "required": false; }; "filterValue": { "alias": "filterValue"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "selectionLimit": { "alias": "selectionLimit"; "required": false; }; }, { "onChange": "onChange"; "onFilter": "onFilter"; "onFocus": "onFocus"; "onBlur": "onBlur"; "onClick": "onClick"; "onClear": "onClear"; "onPanelShow": "onPanelShow"; "onPanelHide": "onPanelHide"; "onLazyLoad": "onLazyLoad"; "onRemove": "onRemove"; }, ["footerFacet", "headerFacet", "templates"], ["p-header", "p-footer"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelect, "p-multiSelect", never, { "id": { "alias": "id"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "panelStyle": { "alias": "panelStyle"; "required": false; }; "panelStyleClass": { "alias": "panelStyleClass"; "required": false; }; "inputId": { "alias": "inputId"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "group": { "alias": "group"; "required": false; }; "filter": { "alias": "filter"; "required": false; }; "filterPlaceHolder": { "alias": "filterPlaceHolder"; "required": false; }; "filterLocale": { "alias": "filterLocale"; "required": false; }; "overlayVisible": { "alias": "overlayVisible"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "appendTo": { "alias": "appendTo"; "required": false; }; "dataKey": { "alias": "dataKey"; "required": false; }; "name": { "alias": "name"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "displaySelectedLabel": { "alias": "displaySelectedLabel"; "required": false; }; "maxSelectedLabels": { "alias": "maxSelectedLabels"; "required": false; }; "selectionLimit": { "alias": "selectionLimit"; "required": false; }; "selectedItemsLabel": { "alias": "selectedItemsLabel"; "required": false; }; "showToggleAll": { "alias": "showToggleAll"; "required": false; }; "emptyFilterMessage": { "alias": "emptyFilterMessage"; "required": false; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; }; "resetFilterOnHide": { "alias": "resetFilterOnHide"; "required": false; }; "dropdownIcon": { "alias": "dropdownIcon"; "required": false; }; "optionLabel": { "alias": "optionLabel"; "required": false; }; "optionValue": { "alias": "optionValue"; "required": false; }; "optionDisabled": { "alias": "optionDisabled"; "required": false; }; "optionGroupLabel": { "alias": "optionGroupLabel"; "required": false; }; "optionGroupChildren": { "alias": "optionGroupChildren"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "filterBy": { "alias": "filterBy"; "required": false; }; "scrollHeight": { "alias": "scrollHeight"; "required": false; }; "lazy": { "alias": "lazy"; "required": false; }; "virtualScroll": { "alias": "virtualScroll"; "required": false; }; "virtualScrollItemSize": { "alias": "virtualScrollItemSize"; "required": false; }; "virtualScrollOptions": { "alias": "virtualScrollOptions"; "required": false; }; "overlayOptions": { "alias": "overlayOptions"; "required": false; }; "ariaFilterLabel": { "alias": "ariaFilterLabel"; "required": false; }; "filterMatchMode": { "alias": "filterMatchMode"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "tooltipPosition": { "alias": "tooltipPosition"; "required": false; }; "tooltipPositionStyle": { "alias": "tooltipPositionStyle"; "required": false; }; "tooltipStyleClass": { "alias": "tooltipStyleClass"; "required": false; }; "autofocusFilter": { "alias": "autofocusFilter"; "required": false; }; "display": { "alias": "display"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "showClear": { "alias": "showClear"; "required": false; }; "autoZIndex": { "alias": "autoZIndex"; "required": false; }; "baseZIndex": { "alias": "baseZIndex"; "required": false; }; "showTransitionOptions": { "alias": "showTransitionOptions"; "required": false; }; "hideTransitionOptions": { "alias": "hideTransitionOptions"; "required": false; }; "defaultLabel": { "alias": "defaultLabel"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "options": { "alias": "options"; "required": false; }; "filterValue": { "alias": "filterValue"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "focusOnHover": { "alias": "focusOnHover"; "required": false; }; "filterFields": { "alias": "filterFields"; "required": false; }; "selectOnFocus": { "alias": "selectOnFocus"; "required": false; }; "autoOptionFocus": { "alias": "autoOptionFocus"; "required": false; }; }, { "onChange": "onChange"; "onFilter": "onFilter"; "onFocus": "onFocus"; "onBlur": "onBlur"; "onClick": "onClick"; "onClear": "onClear"; "onPanelShow": "onPanelShow"; "onPanelHide": "onPanelHide"; "onLazyLoad": "onLazyLoad"; "onRemove": "onRemove"; }, ["footerFacet", "headerFacet", "templates"], ["p-header", "p-footer"], false, never>;
 }
 export declare class MultiSelectModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectModule, never>;

package/overlaypanel/overlaypanel.d.ts

@@ -138,6 +138,7 @@ export declare class OverlayPanel implements AfterContentInit, OnDestroy {
      */
     hide(): void;
     onCloseClick(event: MouseEvent): void;
+    onEscapeKeydown(event: KeyboardEvent): void;
     onWindowResize(): void;
     bindDocumentResizeListener(): void;
     unbindDocumentResizeListener(): void;