primeng 16.0.0-rc.1 → 16.0.0-rc.2

package/multiselect/multiselect.d.ts

@@ -1,9 +1,12 @@
 import { AnimationEvent } from '@angular/animations';
 import { AfterContentInit, AfterViewChecked, AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, NgZone, OnInit, QueryList, Renderer2, TemplateRef } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
-import { FilterService, OverlayOptions, OverlayService, PrimeNGConfig } from 'primeng/api';
+import { FilterService, OverlayOptions, OverlayService, PrimeNGConfig, PrimeTemplate } from 'primeng/api';
 import { Overlay } from 'primeng/overlay';
-import { Scroller, ScrollerOptions } from 'primeng/scroller';
+import { Scroller } from 'primeng/scroller';
+import { ScrollerOptions } from 'primeng/scroller';
+import { Nullable } from 'primeng/ts-helpers';
+import { MultiSelectRemoveEvent, MultiSelectFilterOptions, MultiSelectFilterEvent, MultiSelectBlurEvent, MultiSelectChangeEvent, MultiSelectFocusEvent, MultiSelectLazyLoadEvent } from './multiselect.interface';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 import * as i2 from "primeng/overlay";
@@ -17,22 +20,14 @@ import * as i9 from "primeng/icons/timescircle";
 import * as i10 from "primeng/icons/times";
 import * as i11 from "primeng/icons/chevrondown";
 export declare const MULTISELECT_VALUE_ACCESSOR: any;
-export interface MultiSelectFilterOptions {
-    filter?: (value?: any) => void;
-    reset?: () => void;
-}
-export interface MultiselectOnRemoveEvent {
-    newValue: object;
-    removed: MultiSelectItem;
-}
 export declare class MultiSelectItem {
     option: any;
-    selected: boolean;
-    label: any;
-    disabled: boolean;
-    itemSize: number;
-    template: TemplateRef<any>;
-    checkIconTemplate: TemplateRef<any>;
+    selected: boolean | undefined;
+    label: string | undefined;
+    disabled: boolean | undefined;
+    itemSize: number | undefined;
+    template: TemplateRef<any> | undefined;
+    checkIconTemplate: TemplateRef<any> | undefined;
     onClick: EventEmitter<any>;
     onKeydown: EventEmitter<any>;
     onOptionClick(event: Event): void;
@@ -48,130 +43,404 @@ export declare class MultiSelect implements OnInit, AfterViewInit, AfterContentI
     filterService: FilterService;
     config: PrimeNGConfig;
     overlayService: OverlayService;
-    style: any;
-    styleClass: string;
+    /**
+     * Inline style of the element.
+     * @group Props
+     */
+    style: {
+        [klass: string]: any;
+    } | null | undefined;
+    /**
+     * Style class of the element.
+     * @group Props
+     */
+    styleClass: string | undefined;
+    /**
+     * Inline style of the overlay panel.
+     * @group Props
+     */
     panelStyle: any;
-    panelStyleClass: string;
-    inputId: string;
-    disabled: boolean;
-    readonly: boolean;
-    group: boolean;
+    /**
+     * Style class of the overlay panel element.
+     * @group Props
+     */
+    panelStyleClass: string | undefined;
+    /**
+     * Identifier of the focus input to match a label defined for the component.
+     * @group Props
+     */
+    inputId: string | undefined;
+    /**
+     * When present, it specifies that the element should be disabled.
+     * @group Props
+     */
+    disabled: boolean | undefined;
+    /**
+     * When present, it specifies that the component cannot be edited.
+     * @group Props
+     */
+    readonly: boolean | undefined;
+    /**
+     * Whether to display options as grouped when nested options are provided.
+     * @group Props
+     */
+    group: boolean | undefined;
+    /**
+     * When specified, displays an input field to filter the items on keyup.
+     * @group Props
+     */
     filter: boolean;
-    filterPlaceHolder: string;
-    filterLocale: string;
-    overlayVisible: boolean;
-    tabindex: number;
-    appendTo: any;
-    dataKey: string;
-    name: string;
-    label: string;
-    ariaLabelledBy: string;
+    /**
+     * Defines placeholder of the filter input.
+     * @group Props
+     */
+    filterPlaceHolder: string | undefined;
+    /**
+     * Locale to use in filtering. The default locale is the host environment's current locale.
+     * @group Props
+     */
+    filterLocale: string | undefined;
+    /**
+     * Specifies the visibility of the options panel.
+     * @group Props
+     */
+    overlayVisible: boolean | undefined;
+    /**
+     * Index of the element in tabbing order.
+     * @group Props
+     */
+    tabindex: number | undefined;
+    /**
+     * 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).
+     * @group Props
+     */
+    appendTo: HTMLElement | ElementRef | TemplateRef<any> | string | null | undefined | any;
+    /**
+     * A property to uniquely identify a value in options.
+     * @group Props
+     */
+    dataKey: string | undefined;
+    /**
+     * Name of the input element.
+     * @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
+     */
+    ariaLabelledBy: string | undefined;
+    /**
+     * Whether to show labels of selected item labels or use default label.
+     * @group Props
+     */
     displaySelectedLabel: boolean;
+    /**
+     * Decides how many selected item labels to show at most.
+     * @group Props
+     */
     maxSelectedLabels: number;
-    selectionLimit: number;
+    /**
+     * Number of maximum options that can be selected.
+     * @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
+     */
     selectedItemsLabel: string;
+    /**
+     * Whether to show the checkbox at header to toggle all items at once.
+     * @group Props
+     */
     showToggleAll: boolean;
+    /**
+     * Text to display when filtering does not return any results.
+     * @group Props
+     */
     emptyFilterMessage: string;
+    /**
+     * Text to display when there is no data. Defaults to global value in i18n translation configuration.
+     * @group Props
+     */
     emptyMessage: string;
+    /**
+     * Clears the filter value when hiding the dropdown.
+     * @group Props
+     */
     resetFilterOnHide: boolean;
-    dropdownIcon: string;
-    optionLabel: string;
-    optionValue: string;
-    optionDisabled: string;
-    optionGroupLabel: string;
+    /**
+     * Icon class of the dropdown icon.
+     * @group Props
+     */
+    dropdownIcon: string | undefined;
+    /**
+     * Name of the label field of an option.
+     * @group Props
+     */
+    optionLabel: string | undefined;
+    /**
+     * Name of the value field of an option.
+     * @group Props
+     */
+    optionValue: string | undefined;
+    /**
+     * Name of the disabled field of an option.
+     * @group Props
+     */
+    optionDisabled: string | undefined;
+    /**
+     * Name of the label field of an option group.
+     * @group Props
+     */
+    optionGroupLabel: string | undefined;
+    /**
+     * Name of the options field of an option group.
+     * @group Props
+     */
     optionGroupChildren: string;
+    /**
+     * Whether to show the header.
+     * @group Props
+     */
     showHeader: boolean;
-    filterBy: string;
+    /**
+     * When filtering is enabled, filterBy decides which field or fields (comma separated) to search against.
+     * @group Props
+     */
+    filterBy: string | undefined;
+    /**
+     * Height of the viewport in pixels, a scrollbar is defined if height of list exceeds this value.
+     * @group Props
+     */
     scrollHeight: string;
+    /**
+     * Defines if data is loaded and interacted with in lazy manner.
+     * @group Props
+     */
     lazy: boolean;
-    virtualScroll: boolean;
-    virtualScrollItemSize: number;
-    virtualScrollOptions: ScrollerOptions;
-    overlayOptions: OverlayOptions;
-    ariaFilterLabel: string;
-    filterMatchMode: string;
+    /**
+     * Whether the data should be loaded on demand during scroll.
+     * @group Props
+     */
+    virtualScroll: boolean | undefined;
+    /**
+     * Height of an item in the list for VirtualScrolling.
+     * @group Props
+     */
+    virtualScrollItemSize: number | undefined;
+    /**
+     * Whether to use the scroller feature. The properties of scroller component can be used like an object in it.
+     * @group Props
+     */
+    virtualScrollOptions: ScrollerOptions | undefined;
+    /**
+     * Whether to use overlay API feature. The properties of overlay API can be used like an object in it.
+     * @group Props
+     */
+    overlayOptions: OverlayOptions | undefined;
+    /**
+     * Defines a string that labels the filter input.
+     * @group Props
+     */
+    ariaFilterLabel: string | undefined;
+    /**
+     * Defines how the items are filtered.
+     * @group Props
+     */
+    filterMatchMode: 'contains' | 'startsWith' | 'endsWith' | 'equals' | 'notEquals' | 'in' | 'lt' | 'lte' | 'gt' | 'gte';
+    /**
+     * Advisory information to display in a tooltip on hover.
+     * @group Props
+     */
     tooltip: string;
-    tooltipPosition: string;
+    /**
+     * Position of the tooltip.
+     * @group Props
+     */
+    tooltipPosition: 'top' | 'left' | 'right' | 'bottom';
+    /**
+     * Type of CSS position.
+     * @group Props
+     */
     tooltipPositionStyle: string;
-    tooltipStyleClass: string;
+    /**
+     * Style class of the tooltip.
+     * @group Props
+     */
+    tooltipStyleClass: string | undefined;
+    /**
+     * Applies focus to the filter element when the overlay is shown.
+     * @group Props
+     */
     autofocusFilter: boolean;
+    /**
+     * No description available.
+     * @group Props
+     */
     display: string;
+    /**
+     * No description available.
+     * @group Props
+     */
     autocomplete: string;
+    /**
+     * When enabled, a clear icon is displayed to clear the value.
+     * @group Props
+     */
     showClear: boolean;
-    containerViewChild: ElementRef;
-    overlayViewChild: Overlay;
-    filterInputChild: ElementRef;
-    accessibleViewChild: ElementRef;
-    itemsViewChild: ElementRef;
-    scroller: Scroller;
+    /**
+     * @deprecated since v14.2.0, use overlayOptions property instead.
+     * Whether to automatically manage layering.
+     * @group Props
+     */
+    get autoZIndex(): boolean | undefined;
+    set autoZIndex(val: boolean | undefined);
+    /**
+     * @deprecated since v14.2.0, use overlayOptions property instead.
+     * Base zIndex value to use in layering.
+     * @group Props
+     */
+    get baseZIndex(): number | undefined;
+    set baseZIndex(val: number | undefined);
+    /**
+     * @deprecated since v14.2.0, use overlayOptions property instead.
+     * Transition options of the show animation.
+     * @group Props
+     */
+    get showTransitionOptions(): string | undefined;
+    set showTransitionOptions(val: string | undefined);
+    /**
+     * @deprecated since v14.2.0, use overlayOptions property instead.
+     * Transition options of the hide animation.
+     * @group Props
+     */
+    get hideTransitionOptions(): string | undefined;
+    set hideTransitionOptions(val: string | undefined);
+    set defaultLabel(val: string | undefined);
+    get defaultLabel(): string | undefined;
+    set placeholder(val: string | undefined);
+    get placeholder(): string | undefined;
+    get options(): any[] | undefined;
+    set options(val: any[] | undefined);
+    get filterValue(): string | undefined | null;
+    set filterValue(val: string | undefined | null);
+    /**
+     * @deprecated use virtualScrollItemSize property instead.
+     * Item size of item to be virtual scrolled.
+     * @group Props
+     */
+    get itemSize(): number | undefined;
+    set itemSize(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: QueryList<any>;
-    onChange: EventEmitter<any>;
-    onFilter: EventEmitter<any>;
-    onFocus: EventEmitter<any>;
-    onBlur: EventEmitter<any>;
-    onClick: EventEmitter<any>;
-    onClear: EventEmitter<any>;
-    onPanelShow: EventEmitter<any>;
-    onPanelHide: EventEmitter<any>;
-    onLazyLoad: EventEmitter<any>;
-    onRemove: EventEmitter<MultiselectOnRemoveEvent>;
-    _autoZIndex: boolean;
-    get autoZIndex(): boolean;
-    set autoZIndex(val: boolean);
-    _baseZIndex: number;
-    get baseZIndex(): number;
-    set baseZIndex(val: number);
-    _showTransitionOptions: string;
-    get showTransitionOptions(): string;
-    set showTransitionOptions(val: string);
-    _hideTransitionOptions: string;
-    get hideTransitionOptions(): string;
-    set hideTransitionOptions(val: string);
-    _defaultLabel: string;
-    set defaultLabel(val: string);
-    get defaultLabel(): string;
-    _placeholder: string;
-    set placeholder(val: string);
-    get placeholder(): string;
-    get options(): any[];
-    set options(val: any[]);
-    get filterValue(): string;
-    set filterValue(val: string);
-    _itemSize: number;
-    get itemSize(): number;
-    set itemSize(val: number);
-    value: any[];
-    _filteredOptions: any[];
+    templates: Nullable<QueryList<PrimeTemplate>>;
+    /**
+     * Callback to invoke when value changes.
+     * @param {MultiSelectChangeEvent} event - Custom change event.
+     * @group Emits
+     */
+    onChange: EventEmitter<MultiSelectChangeEvent>;
+    /**
+     * Callback to invoke when data is filtered.
+     * @param {MultiSelectFilterEvent} event - Custom filter event.
+     * @group Emits
+     */
+    onFilter: EventEmitter<MultiSelectFilterEvent>;
+    /**
+     * Callback to invoke when multiselect receives focus.
+     * @param {MultiSelectFocusEvent} event - Custom focus event.
+     * @group Emits
+     */
+    onFocus: EventEmitter<MultiSelectFocusEvent>;
+    /**
+     * Callback to invoke when multiselect loses focus.
+     * @param {MultiSelectBlurEvent} event - Custom blur event.
+     * @group Emits
+     */
+    onBlur: EventEmitter<MultiSelectBlurEvent>;
+    /**
+     * Callback to invoke when component is clicked.
+     * @param {Event} event - Browser event.
+     * @group Emits
+     */
+    onClick: EventEmitter<Event>;
+    /**
+     * Callback to invoke when input field is cleared.
+     * @group Emits
+     */
+    onClear: EventEmitter<void>;
+    /**
+     * Callback to invoke when overlay panel becomes visible.
+     * @group Emits
+     */
+    onPanelShow: EventEmitter<void>;
+    /**
+     * Callback to invoke when overlay panel becomes hidden.
+     * @group Emits
+     */
+    onPanelHide: EventEmitter<void>;
+    /**
+     * Callback to invoke in lazy mode to load new data.
+     * @param {MultiSelectLazyLoadEvent} event - Lazy load event.
+     * @group Emits
+     */
+    onLazyLoad: EventEmitter<MultiSelectLazyLoadEvent>;
+    /**
+     * Callback to invoke in lazy mode to load new data.
+     * @param {MultiSelectRemoveEvent} event - Remove event.
+     * @group Emits
+     */
+    onRemove: EventEmitter<MultiSelectRemoveEvent>;
+    _autoZIndex: boolean | undefined;
+    _baseZIndex: number | undefined;
+    _showTransitionOptions: string | undefined;
+    _hideTransitionOptions: string | undefined;
+    _defaultLabel: string | undefined;
+    _placeholder: string | undefined;
+    _itemSize: number | undefined;
+    value: any[] | undefined | null;
+    _filteredOptions: any[] | undefined | null;
     onModelChange: Function;
     onModelTouched: Function;
-    valuesAsString: string;
-    focus: boolean;
-    filled: boolean;
-    _filterValue: string;
-    filtered: boolean;
-    itemTemplate: TemplateRef<any>;
-    groupTemplate: TemplateRef<any>;
-    loaderTemplate: TemplateRef<any>;
-    headerTemplate: TemplateRef<any>;
-    filterTemplate: TemplateRef<any>;
-    footerTemplate: TemplateRef<any>;
-    emptyFilterTemplate: TemplateRef<any>;
-    emptyTemplate: TemplateRef<any>;
-    selectedItemsTemplate: TemplateRef<any>;
-    checkIconTemplate: TemplateRef<any>;
-    filterIconTemplate: TemplateRef<any>;
-    removeTokenIconTemplate: TemplateRef<any>;
-    closeIconTemplate: TemplateRef<any>;
-    clearIconTemplate: TemplateRef<any>;
-    dropdownIconTemplate: TemplateRef<any>;
-    headerCheckboxFocus: boolean;
-    filterOptions: MultiSelectFilterOptions;
-    _options: any[];
-    maxSelectionLimitReached: boolean;
-    preventModelTouched: boolean;
-    preventDocumentDefault: boolean;
+    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;
+    loaderTemplate: TemplateRef<any> | undefined;
+    headerTemplate: TemplateRef<any> | undefined;
+    filterTemplate: TemplateRef<any> | undefined;
+    footerTemplate: TemplateRef<any> | undefined;
+    emptyFilterTemplate: TemplateRef<any> | undefined;
+    emptyTemplate: TemplateRef<any> | undefined;
+    selectedItemsTemplate: TemplateRef<any> | undefined;
+    checkIconTemplate: TemplateRef<any> | undefined;
+    filterIconTemplate: TemplateRef<any> | undefined;
+    removeTokenIconTemplate: TemplateRef<any> | undefined;
+    closeIconTemplate: TemplateRef<any> | undefined;
+    clearIconTemplate: TemplateRef<any> | undefined;
+    dropdownIconTemplate: TemplateRef<any> | undefined;
+    headerCheckboxFocus: boolean | undefined;
+    filterOptions: MultiSelectFilterOptions | undefined;
+    _options: any[] | undefined;
+    maxSelectionLimitReached: boolean | undefined;
+    preventModelTouched: boolean | undefined;
+    preventDocumentDefault: boolean | undefined;
     constructor(el: ElementRef, renderer: Renderer2, cd: ChangeDetectorRef, zone: NgZone, filterService: FilterService, config: PrimeNGConfig, overlayService: OverlayService);
     ngOnInit(): void;
     ngAfterContentInit(): void;
@@ -188,26 +457,32 @@ export declare class MultiSelect implements OnInit, AfterViewInit, AfterContentI
     registerOnChange(fn: Function): void;
     registerOnTouched(fn: Function): void;
     setDisabledState(val: boolean): void;
-    onOptionClick(event: any): void;
+    onOptionClick(event: {
+        originalEvent: Event;
+        option: any;
+    }): void;
     isSelected(option: any): boolean;
     findSelectionIndex(val: any): number;
     get toggleAllDisabled(): boolean;
-    toggleAll(event: any): void;
+    toggleAll(event: Event): void;
     checkAll(): void;
     uncheckAll(): void;
     show(): void;
     onOverlayAnimationStart(event: AnimationEvent): void;
     hide(): void;
     resetFilter(): void;
-    close(event: any): void;
-    clear(event: any): void;
-    onMouseclick(event: MouseEvent, input: any): void;
-    removeChip(chip: any, event: MouseEvent): void;
-    onInputFocus(event: any): void;
-    onInputBlur(event: any): void;
-    onOptionKeydown(event: any): void;
-    findNextItem(item: any): any;
-    findPrevItem(item: any): any;
+    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;
+    findNextItem(item: any): HTMLElement | null;
+    findPrevItem(item: any): HTMLElement | null;
     onKeydown(event: KeyboardEvent): void;
     updateLabel(): void;
     findLabelByValue(val: any): string;