@inspark/inspark-components 14.0.56 → 14.0.57

package/full/fesm2015/inspark-inspark-components.mjs

@@ -433,42 +433,51 @@ class InsparkDialogService {
         this.componentFactoryResolver = componentFactoryResolver;
         this.appRef = appRef;
         this.injector = injector;
+        this.dialogComponentRefs = [];
     }
     open(componentType, config) {
-        const dialogRef = this.appendDialogComponentToBody(config);
-        console.log('window.scrollY', window.scrollY);
-        document.body.style.top = `-${window.scrollY}px`;
-        document.body.style.position = 'fixed';
+        const dialogRef = this.appendDialogComponentToBody(componentType, config);
+        // Зафиксируем скролл (можно делать только для первого окна)
+        if (this.dialogComponentRefs.length === 1) {
+            document.body.style.top = `-${window.scrollY}px`;
+            document.body.style.position = 'fixed';
+        }
         dialogRef.onClose.subscribe(() => {
-            console.log('custom subscrnve');
-            const scrollY = document.body.style.top;
-            document.body.style.position = '';
-            document.body.style.top = '';
-            window.scrollTo(0, parseInt(scrollY || '0') * -1);
+            this.removeDialogComponent(dialogRef);
+            // Восстановим скролл только если это последнее окно
+            if (this.dialogComponentRefs.length === 0) {
+                const scrollY = document.body.style.top;
+                document.body.style.position = '';
+                document.body.style.top = '';
+                window.scrollTo(0, parseInt(scrollY || '0') * -1);
+            }
         });
-        this.dialogComponentRef.instance.childComponentType = componentType;
         return dialogRef;
     }
-    appendDialogComponentToBody(config) {
+    appendDialogComponentToBody(componentType, config) {
         const map = new WeakMap();
         map.set(DynamicDialogConfig, config);
         const dialogRef = new DynamicDialogRef();
         map.set(DynamicDialogRef, dialogRef);
-        const sub = dialogRef.onClose.subscribe(() => {
-            this.removeDialogComponentFromBody();
-            sub.unsubscribe();
-        });
         const componentFactory = this.componentFactoryResolver.resolveComponentFactory(DynamicDialogComponent);
         const componentRef = componentFactory.create(new DynamicDialogInjector(this.injector, map));
+        componentRef.instance.childComponentType = componentType;
         this.appRef.attachView(componentRef.hostView);
         const domElem = componentRef.hostView.rootNodes[0];
         document.body.appendChild(domElem);
-        this.dialogComponentRef = componentRef;
+        this.dialogComponentRefs.push(componentRef);
+        dialogRef.onClose.subscribe(() => {
+            this.removeDialogComponent(dialogRef);
+        });
         return dialogRef;
     }
-    removeDialogComponentFromBody() {
-        this.appRef.detachView(this.dialogComponentRef.hostView);
-        this.dialogComponentRef.destroy();
+    removeDialogComponent(dialogRef) {
+        const componentRef = this.dialogComponentRefs.find(ref => ref.instance.dialogRef === dialogRef);
+        if (!componentRef)
+            return;
+        this.appRef.detachView(componentRef.hostView);
+        componentRef.destroy();
+        this.dialogComponentRefs = this.dialogComponentRefs.filter(ref => ref !== componentRef);
     }
 }
 InsparkDialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InsparkDialogService, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ApplicationRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
@@ -1182,14 +1191,14 @@ class DropdownComponent extends Dropdown {
     }
 }
 DropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownComponent, selector: "in-dropdown", inputs: { title: "title", error: "error", scrollHeight: "scrollHeight", filter: "filter", name: "name", options: "options", style: "style", panelStyle: "panelStyle", styleClass: "styleClass", panelStyleClass: "panelStyleClass", readonly: "readonly", required: "required", editable: "editable", appendTo: "appendTo", tabindex: "tabindex", placeholder: "placeholder", filterPlaceholder: "filterPlaceholder", filterLocale: "filterLocale", inputId: "inputId", selectId: "selectId", dataKey: "dataKey", filterBy: "filterBy", autofocus: "autofocus", resetFilterOnHide: "resetFilterOnHide", dropdownIcon: "dropdownIcon", optionLabel: "optionLabel", optionValue: "optionValue", optionDisabled: "optionDisabled", optionGroupLabel: "optionGroupLabel", optionGroupChildren: "optionGroupChildren", autoDisplayFirst: "autoDisplayFirst", group: "group", showClear: "showClear", emptyFilterMessage: "emptyFilterMessage", emptyMessage: "emptyMessage", lazy: "lazy", virtualScroll: "virtualScroll", virtualScrollItemSize: "virtualScrollItemSize", virtualScrollOptions: "virtualScrollOptions", overlayOptions: "overlayOptions", ariaFilterLabel: "ariaFilterLabel", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", filterMatchMode: "filterMatchMode", maxlength: "maxlength", tooltip: "tooltip", tooltipPosition: "tooltipPosition", tooltipPositionStyle: "tooltipPositionStyle", tooltipStyleClass: "tooltipStyleClass", autofocusFilter: "autofocusFilter", overlayDirection: "overlayDirection", itemSize: "itemSize", autoZIndex: "autoZIndex", baseZIndex: "baseZIndex", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { onChange: "onChange", onFilter: "onFilter", onFocus: "onFocus", onBlur: "onBlur", onClick: "onClick", onShow: "onShow", onHide: "onHide", onClear: "onClear", onLazyLoad: "onLazyLoad" }, host: { properties: { "class.p-inputwrapper-filled": "filled", "class.p-inputwrapper-focus": "focused || overlayVisible" }, classAttribute: "p-element p-inputwrapper" }, providers: [DROPDOWN_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0, template: "<label class=\"label type_varchars\">\n<span *ngIf=\"title\" class=\"c-label__content\">\n        {{ title }}\n  <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{ error }}</span>\n    </span>\n  <div\n    #container\n    (click)=\"onMouseclick($event)\"\n    [class]=\"styleClass\"\n    [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\n    [ngStyle]=\"style\"\n  >\n    <div class=\"p-hidden-accessible\">\n      <input\n        #in\n        (blur)=\"onInputBlur($event)\"\n        (focus)=\"onInputFocus($event)\"\n        (keydown)=\"onKeydown($event, true)\"\n        [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\n        [attr.aria-expanded]=\"false\"\n        [attr.aria-label]=\"ariaLabel\"\n        [attr.aria-labelledby]=\"ariaLabelledBy\"\n        [attr.id]=\"inputId\"\n        [attr.placeholder]=\"placeholder\"\n        [attr.tabindex]=\"tabindex\"\n        [autofocus]=\"autofocus\"\n        [disabled]=\"disabled\"\n        aria-haspopup=\"listbox\"\n        aria-haspopup=\"listbox\"\n        pAutoFocus\n        readonly\n        role=\"combobox\"\n        type=\"text\"\n      />\n    </div>\n    <span\n      *ngIf=\"!editable && label != null\"\n      [attr.id]=\"labelId\"\n      [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\n      [pTooltip]=\"tooltip\"\n      [positionStyle]=\"tooltipPositionStyle\"\n      [tooltipPosition]=\"tooltipPosition\"\n      [tooltipStyleClass]=\"tooltipStyleClass\">\n                <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || '' }}</ng-container>\n                <ng-container\n                  *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\n            </span>\n    <span\n      *ngIf=\"!editable && label == null\"\n      [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\">{{ placeholder || '' }}</span>\n    <input\n      #editableInput\n      (blur)=\"onInputBlur($event)\"\n      (focus)=\"onEditableInputFocus($event)\"\n      (input)=\"onEditableInputChange($event)\"\n      *ngIf=\"editable\"\n      [attr.aria-expanded]=\"overlayVisible\"\n      [attr.maxlength]=\"maxlength\"\n      [attr.placeholder]=\"placeholder\"\n      [disabled]=\"disabled\"\n      aria-haspopup=\"listbox\"\n      class=\"p-dropdown-label p-inputtext\"\n      type=\"text\"\n    />\n    <i (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\" class=\"p-dropdown-clear-icon pi pi-times\"></i>\n    <div [attr.aria-expanded]=\"overlayVisible\" aria-haspopup=\"listbox\" aria-label=\"dropdown trigger\"\n         class=\"p-dropdown-trigger\"\n         role=\"button\">\n      <span [ngClass]=\"dropdownIcon\" class=\"p-dropdown-trigger-icon\"></span>\n    </div>\n    <p-overlay\n      #overlay\n      (onAnimationStart)=\"onOverlayAnimationStart($event)\"\n      (onHide)=\"hide()\"\n      [(visible)]=\"overlayVisible\"\n      [appendTo]=\"appendTo\"\n      [autoZIndex]=\"autoZIndex\"\n      [baseZIndex]=\"baseZIndex\"\n      [hideTransitionOptions]=\"hideTransitionOptions\"\n      [options]=\"overlayOptions\"\n      [showTransitionOptions]=\"showTransitionOptions\"\n      [target]=\"'@parent'\"\n    >\n      <ng-template pTemplate=\"content\">\n        <div [class]=\"panelStyleClass\" [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\">\n          <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n          <div (click)=\"$event.stopPropagation()\" *ngIf=\"filter\" class=\"p-dropdown-header\">\n            <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\n              <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\n            </ng-container>\n            <ng-template #builtInFilterElement>\n              <div class=\"p-dropdown-filter-container\">\n                <input\n                  #filter\n                  (input)=\"onFilterInputChange($event)\"\n                  (keydown)=\"onKeydown($event, false)\"\n                  (keydown.enter)=\"$event.preventDefault()\"\n                  [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\n                  [attr.aria-label]=\"ariaFilterLabel\"\n                  [attr.placeholder]=\"filterPlaceholder\"\n                  [value]=\"filterValue || ''\"\n                  autocomplete=\"off\"\n                  class=\"p-dropdown-filter p-inputtext p-component\"\n                  type=\"text\"\n                />\n                <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\n              </div>\n            </ng-template>\n          </div>\n          <div [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\" class=\"p-dropdown-items-wrapper\">\n            <p-scroller\n              #scroller\n              (onLazyLoad)=\"onLazyLoad.emit($event)\"\n              *ngIf=\"virtualScroll\"\n              [autoSize]=\"true\"\n              [itemSize]=\"virtualScrollItemSize || _itemSize\"\n              [items]=\"optionsToDisplay\"\n              [lazy]=\"lazy\"\n              [options]=\"virtualScrollOptions\"\n              [style]=\"{ height: scrollHeight }\"\n            >\n              <ng-template let-items let-scrollerOptions=\"options\" pTemplate=\"content\">\n                <ng-container\n                  *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n              </ng-template>\n              <ng-container *ngIf=\"loaderTemplate\">\n                <ng-template let-scrollerOptions=\"options\" pTemplate=\"loader\">\n                  <ng-container\n                    *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n                </ng-template>\n              </ng-container>\n            </p-scroller>\n            <ng-container *ngIf=\"!virtualScroll\">\n              <ng-container\n                *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\n            </ng-container>\n\n            <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n              <ul #items [attr.id]=\"listId\" [ngClass]=\"scrollerOptions.contentStyleClass\"\n                  [style]=\"scrollerOptions.contentStyle\"\n                  class=\"p-dropdown-items\" role=\"listbox\">\n                <ng-container *ngIf=\"group\">\n                  <ng-template [ngForOf]=\"items\" let-optgroup ngFor>\n                    <li [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\" class=\"p-dropdown-item-group\">\n                      <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || '' }}</span>\n                      <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n                    </li>\n                    <ng-container\n                      *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\n                  </ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"!group\">\n                  <ng-container\n                    *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\n                </ng-container>\n                <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\n                  <ng-template [ngForOf]=\"options\" let-i=\"index\" let-option ngFor>\n                    <p-dropdownItem\n                      (onClick)=\"onItemClick($event)\"\n                      [disabled]=\"isOptionDisabled(option)\"\n                      [label]=\"getOptionLabel(option)\"\n                      [option]=\"option\"\n                      [selected]=\"selectedOption == option\"\n                      [template]=\"itemTemplate\"\n                    ></p-dropdownItem>\n                  </ng-template>\n                </ng-template>\n                <li *ngIf=\"filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n                    class=\"p-dropdown-empty-message\">\n                  <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\n                    {{ emptyFilterMessageLabel }}\n                  </ng-container>\n                  <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\n                </li>\n                <li *ngIf=\"!filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n                    class=\"p-dropdown-empty-message\">\n                  <ng-container *ngIf=\"!emptyTemplate\">\n                    {{ emptyMessageLabel }}\n                  </ng-container>\n                  <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n                </li>\n              </ul>\n            </ng-template>\n          </div>\n          <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n        </div>\n      </ng-template>\n    </p-overlay>\n  </div>\n</label>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.Overlay, selector: "p-overlay", inputs: ["visible", "mode", "style", "styleClass", "contentStyle", "contentStyleClass", "target", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "listener", "responsive", "options"], outputs: ["visibleChange", "onBeforeShow", "onShow", "onBeforeHide", "onHide", "onAnimationStart", "onAnimationDone"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i5.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i7$1.AutoFocus, selector: "[pAutoFocus]", inputs: ["autofocus"] }, { kind: "component", type: DropdownItem, selector: "p-dropdownItem", inputs: ["option", "selected", "label", "disabled", "visible", "itemSize", "template"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownComponent, selector: "in-dropdown", inputs: { title: "title", error: "error", scrollHeight: "scrollHeight", filter: "filter", name: "name", options: "options", style: "style", panelStyle: "panelStyle", styleClass: "styleClass", panelStyleClass: "panelStyleClass", readonly: "readonly", required: "required", editable: "editable", appendTo: "appendTo", tabindex: "tabindex", placeholder: "placeholder", filterPlaceholder: "filterPlaceholder", filterLocale: "filterLocale", inputId: "inputId", selectId: "selectId", dataKey: "dataKey", filterBy: "filterBy", autofocus: "autofocus", resetFilterOnHide: "resetFilterOnHide", dropdownIcon: "dropdownIcon", optionLabel: "optionLabel", optionValue: "optionValue", optionDisabled: "optionDisabled", optionGroupLabel: "optionGroupLabel", optionGroupChildren: "optionGroupChildren", autoDisplayFirst: "autoDisplayFirst", group: "group", showClear: "showClear", emptyFilterMessage: "emptyFilterMessage", emptyMessage: "emptyMessage", lazy: "lazy", virtualScroll: "virtualScroll", virtualScrollItemSize: "virtualScrollItemSize", virtualScrollOptions: "virtualScrollOptions", overlayOptions: "overlayOptions", ariaFilterLabel: "ariaFilterLabel", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", filterMatchMode: "filterMatchMode", maxlength: "maxlength", tooltip: "tooltip", tooltipPosition: "tooltipPosition", tooltipPositionStyle: "tooltipPositionStyle", tooltipStyleClass: "tooltipStyleClass", autofocusFilter: "autofocusFilter", overlayDirection: "overlayDirection", itemSize: "itemSize", autoZIndex: "autoZIndex", baseZIndex: "baseZIndex", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { onChange: "onChange", onFilter: "onFilter", onFocus: "onFocus", onBlur: "onBlur", onClick: "onClick", onShow: "onShow", onHide: "onHide", onClear: "onClear", onLazyLoad: "onLazyLoad" }, host: { properties: { "class.p-inputwrapper-filled": "filled", "class.p-inputwrapper-focus": "focused || overlayVisible" }, classAttribute: "p-element p-inputwrapper" }, providers: [DROPDOWN_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0, template: "<label class=\"label type_varchars in-dropdown\">\n<span *ngIf=\"title\" class=\"c-label__content\">\n        {{ title }}\n  <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{ error }}</span>\n    </span>\n  <div\n    #container\n    (click)=\"onMouseclick($event)\"\n    [class]=\"styleClass\"\n    [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\n    [ngStyle]=\"style\"\n  >\n    <div class=\"p-hidden-accessible\">\n      <input\n        #in\n        (blur)=\"onInputBlur($event)\"\n        (focus)=\"onInputFocus($event)\"\n        (keydown)=\"onKeydown($event, true)\"\n        [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\n        [attr.aria-expanded]=\"false\"\n        [attr.aria-label]=\"ariaLabel\"\n        [attr.aria-labelledby]=\"ariaLabelledBy\"\n        [attr.id]=\"inputId\"\n        [attr.placeholder]=\"placeholder\"\n        [attr.tabindex]=\"tabindex\"\n        [autofocus]=\"autofocus\"\n        [disabled]=\"disabled\"\n        aria-haspopup=\"listbox\"\n        aria-haspopup=\"listbox\"\n        pAutoFocus\n        readonly\n        role=\"combobox\"\n        type=\"text\"\n      />\n    </div>\n    <span\n      *ngIf=\"!editable && label != null\"\n      [attr.id]=\"labelId\"\n      [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\n      [pTooltip]=\"tooltip\"\n      [positionStyle]=\"tooltipPositionStyle\"\n      [tooltipPosition]=\"tooltipPosition\"\n      [tooltipStyleClass]=\"tooltipStyleClass\">\n                <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || '' }}</ng-container>\n                <ng-container\n                  *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\n            </span>\n    <span\n      *ngIf=\"!editable && label == null\"\n      [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\">{{ placeholder || '' }}</span>\n    <input\n      #editableInput\n      (blur)=\"onInputBlur($event)\"\n      (focus)=\"onEditableInputFocus($event)\"\n      (input)=\"onEditableInputChange($event)\"\n      *ngIf=\"editable\"\n      [attr.aria-expanded]=\"overlayVisible\"\n      [attr.maxlength]=\"maxlength\"\n      [attr.placeholder]=\"placeholder\"\n      [disabled]=\"disabled\"\n      aria-haspopup=\"listbox\"\n      class=\"p-dropdown-label p-inputtext\"\n      type=\"text\"\n    />\n    <i (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\" class=\"p-dropdown-clear-icon pi pi-times\"></i>\n    <div [attr.aria-expanded]=\"overlayVisible\" aria-haspopup=\"listbox\" aria-label=\"dropdown trigger\"\n         class=\"p-dropdown-trigger\"\n         role=\"button\">\n      <span [ngClass]=\"dropdownIcon\" class=\"p-dropdown-trigger-icon\"></span>\n    </div>\n    <p-overlay\n      #overlay\n      (onAnimationStart)=\"onOverlayAnimationStart($event)\"\n      (onHide)=\"hide()\"\n      [(visible)]=\"overlayVisible\"\n      [appendTo]=\"appendTo\"\n      [autoZIndex]=\"autoZIndex\"\n      [baseZIndex]=\"baseZIndex\"\n      [hideTransitionOptions]=\"hideTransitionOptions\"\n      [options]=\"overlayOptions\"\n      [showTransitionOptions]=\"showTransitionOptions\"\n      [target]=\"'@parent'\"\n    >\n      <ng-template pTemplate=\"content\">\n        <div [class]=\"panelStyleClass\" [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\">\n          <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n          <div (click)=\"$event.stopPropagation()\" *ngIf=\"filter\" class=\"p-dropdown-header\">\n            <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\n              <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\n            </ng-container>\n            <ng-template #builtInFilterElement>\n              <div class=\"p-dropdown-filter-container\">\n                <input\n                  #filter\n                  (input)=\"onFilterInputChange($event)\"\n                  (keydown)=\"onKeydown($event, false)\"\n                  (keydown.enter)=\"$event.preventDefault()\"\n                  [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\n                  [attr.aria-label]=\"ariaFilterLabel\"\n                  [attr.placeholder]=\"filterPlaceholder\"\n                  [value]=\"filterValue || ''\"\n                  autocomplete=\"off\"\n                  class=\"p-dropdown-filter p-inputtext p-component\"\n                  type=\"text\"\n                />\n                <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\n              </div>\n            </ng-template>\n          </div>\n          <div [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\" class=\"p-dropdown-items-wrapper\">\n            <p-scroller\n              #scroller\n              (onLazyLoad)=\"onLazyLoad.emit($event)\"\n              *ngIf=\"virtualScroll\"\n              [autoSize]=\"true\"\n              [itemSize]=\"virtualScrollItemSize || _itemSize\"\n              [items]=\"optionsToDisplay\"\n              [lazy]=\"lazy\"\n              [options]=\"virtualScrollOptions\"\n              [style]=\"{ height: scrollHeight }\"\n            >\n              <ng-template let-items let-scrollerOptions=\"options\" pTemplate=\"content\">\n                <ng-container\n                  *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n              </ng-template>\n              <ng-container *ngIf=\"loaderTemplate\">\n                <ng-template let-scrollerOptions=\"options\" pTemplate=\"loader\">\n                  <ng-container\n                    *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n                </ng-template>\n              </ng-container>\n            </p-scroller>\n            <ng-container *ngIf=\"!virtualScroll\">\n              <ng-container\n                *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\n            </ng-container>\n\n            <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n              <ul #items [attr.id]=\"listId\" [ngClass]=\"scrollerOptions.contentStyleClass\"\n                  [style]=\"scrollerOptions.contentStyle\"\n                  class=\"p-dropdown-items\" role=\"listbox\">\n                <ng-container *ngIf=\"group\">\n                  <ng-template [ngForOf]=\"items\" let-optgroup ngFor>\n                    <li [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\" class=\"p-dropdown-item-group\">\n                      <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || '' }}</span>\n                      <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n                    </li>\n                    <ng-container\n                      *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\n                  </ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"!group\">\n                  <ng-container\n                    *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\n                </ng-container>\n                <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\n                  <ng-template [ngForOf]=\"options\" let-i=\"index\" let-option ngFor>\n                    <p-dropdownItem\n                      (onClick)=\"onItemClick($event)\"\n                      [disabled]=\"isOptionDisabled(option)\"\n                      [label]=\"getOptionLabel(option)\"\n                      [option]=\"option\"\n                      [selected]=\"selectedOption == option\"\n                      [template]=\"itemTemplate\"\n                    ></p-dropdownItem>\n                  </ng-template>\n                </ng-template>\n                <li *ngIf=\"filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n                    class=\"p-dropdown-empty-message\">\n                  <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\n                    {{ emptyFilterMessageLabel }}\n                  </ng-container>\n                  <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\n                </li>\n                <li *ngIf=\"!filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n                    class=\"p-dropdown-empty-message\">\n                  <ng-container *ngIf=\"!emptyTemplate\">\n                    {{ emptyMessageLabel }}\n                  </ng-container>\n                  <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n                </li>\n              </ul>\n            </ng-template>\n          </div>\n          <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n        </div>\n      </ng-template>\n    </p-overlay>\n  </div>\n</label>\n", styles: [".in-dropdown{width:100%}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.Overlay, selector: "p-overlay", inputs: ["visible", "mode", "style", "styleClass", "contentStyle", "contentStyleClass", "target", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "listener", "responsive", "options"], outputs: ["visibleChange", "onBeforeShow", "onShow", "onBeforeHide", "onHide", "onAnimationStart", "onAnimationDone"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i5.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i7$1.AutoFocus, selector: "[pAutoFocus]", inputs: ["autofocus"] }, { kind: "component", type: DropdownItem, selector: "p-dropdownItem", inputs: ["option", "selected", "label", "disabled", "visible", "itemSize", "template"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownComponent, decorators: [{
             type: Component,
             args: [{ selector: 'in-dropdown', host: {
                         class: 'p-element p-inputwrapper',
                         '[class.p-inputwrapper-filled]': 'filled',
                         '[class.p-inputwrapper-focus]': 'focused || overlayVisible'
-                    }, providers: [DROPDOWN_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<label class=\"label type_varchars\">\n<span *ngIf=\"title\" class=\"c-label__content\">\n        {{ title }}\n  <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{ error }}</span>\n    </span>\n  <div\n    #container\n    (click)=\"onMouseclick($event)\"\n    [class]=\"styleClass\"\n    [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\n    [ngStyle]=\"style\"\n  >\n    <div class=\"p-hidden-accessible\">\n      <input\n        #in\n        (blur)=\"onInputBlur($event)\"\n        (focus)=\"onInputFocus($event)\"\n        (keydown)=\"onKeydown($event, true)\"\n        [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\n        [attr.aria-expanded]=\"false\"\n        [attr.aria-label]=\"ariaLabel\"\n        [attr.aria-labelledby]=\"ariaLabelledBy\"\n        [attr.id]=\"inputId\"\n        [attr.placeholder]=\"placeholder\"\n        [attr.tabindex]=\"tabindex\"\n        [autofocus]=\"autofocus\"\n        [disabled]=\"disabled\"\n        aria-haspopup=\"listbox\"\n        aria-haspopup=\"listbox\"\n        pAutoFocus\n        readonly\n        role=\"combobox\"\n        type=\"text\"\n      />\n    </div>\n    <span\n      *ngIf=\"!editable && label != null\"\n      [attr.id]=\"labelId\"\n      [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\n      [pTooltip]=\"tooltip\"\n      [positionStyle]=\"tooltipPositionStyle\"\n      [tooltipPosition]=\"tooltipPosition\"\n      [tooltipStyleClass]=\"tooltipStyleClass\">\n                <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || '' }}</ng-container>\n                <ng-container\n                  *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\n            </span>\n    <span\n      *ngIf=\"!editable && label == null\"\n      [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\">{{ placeholder || '' }}</span>\n    <input\n      #editableInput\n      (blur)=\"onInputBlur($event)\"\n      (focus)=\"onEditableInputFocus($event)\"\n      (input)=\"onEditableInputChange($event)\"\n      *ngIf=\"editable\"\n      [attr.aria-expanded]=\"overlayVisible\"\n      [attr.maxlength]=\"maxlength\"\n      [attr.placeholder]=\"placeholder\"\n      [disabled]=\"disabled\"\n      aria-haspopup=\"listbox\"\n      class=\"p-dropdown-label p-inputtext\"\n      type=\"text\"\n    />\n    <i (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\" class=\"p-dropdown-clear-icon pi pi-times\"></i>\n    <div [attr.aria-expanded]=\"overlayVisible\" aria-haspopup=\"listbox\" aria-label=\"dropdown trigger\"\n         class=\"p-dropdown-trigger\"\n         role=\"button\">\n      <span [ngClass]=\"dropdownIcon\" class=\"p-dropdown-trigger-icon\"></span>\n    </div>\n    <p-overlay\n      #overlay\n      (onAnimationStart)=\"onOverlayAnimationStart($event)\"\n      (onHide)=\"hide()\"\n      [(visible)]=\"overlayVisible\"\n      [appendTo]=\"appendTo\"\n      [autoZIndex]=\"autoZIndex\"\n      [baseZIndex]=\"baseZIndex\"\n      [hideTransitionOptions]=\"hideTransitionOptions\"\n      [options]=\"overlayOptions\"\n      [showTransitionOptions]=\"showTransitionOptions\"\n      [target]=\"'@parent'\"\n    >\n      <ng-template pTemplate=\"content\">\n        <div [class]=\"panelStyleClass\" [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\">\n          <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n          <div (click)=\"$event.stopPropagation()\" *ngIf=\"filter\" class=\"p-dropdown-header\">\n            <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\n              <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\n            </ng-container>\n            <ng-template #builtInFilterElement>\n              <div class=\"p-dropdown-filter-container\">\n                <input\n                  #filter\n                  (input)=\"onFilterInputChange($event)\"\n                  (keydown)=\"onKeydown($event, false)\"\n                  (keydown.enter)=\"$event.preventDefault()\"\n                  [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\n                  [attr.aria-label]=\"ariaFilterLabel\"\n                  [attr.placeholder]=\"filterPlaceholder\"\n                  [value]=\"filterValue || ''\"\n                  autocomplete=\"off\"\n                  class=\"p-dropdown-filter p-inputtext p-component\"\n                  type=\"text\"\n                />\n                <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\n              </div>\n            </ng-template>\n          </div>\n          <div [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\" class=\"p-dropdown-items-wrapper\">\n            <p-scroller\n              #scroller\n              (onLazyLoad)=\"onLazyLoad.emit($event)\"\n              *ngIf=\"virtualScroll\"\n              [autoSize]=\"true\"\n              [itemSize]=\"virtualScrollItemSize || _itemSize\"\n              [items]=\"optionsToDisplay\"\n              [lazy]=\"lazy\"\n              [options]=\"virtualScrollOptions\"\n              [style]=\"{ height: scrollHeight }\"\n            >\n              <ng-template let-items let-scrollerOptions=\"options\" pTemplate=\"content\">\n                <ng-container\n                  *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n              </ng-template>\n              <ng-container *ngIf=\"loaderTemplate\">\n                <ng-template let-scrollerOptions=\"options\" pTemplate=\"loader\">\n                  <ng-container\n                    *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n                </ng-template>\n              </ng-container>\n            </p-scroller>\n            <ng-container *ngIf=\"!virtualScroll\">\n              <ng-container\n                *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\n            </ng-container>\n\n            <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n              <ul #items [attr.id]=\"listId\" [ngClass]=\"scrollerOptions.contentStyleClass\"\n                  [style]=\"scrollerOptions.contentStyle\"\n                  class=\"p-dropdown-items\" role=\"listbox\">\n                <ng-container *ngIf=\"group\">\n                  <ng-template [ngForOf]=\"items\" let-optgroup ngFor>\n                    <li [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\" class=\"p-dropdown-item-group\">\n                      <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || '' }}</span>\n                      <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n                    </li>\n                    <ng-container\n                      *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\n                  </ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"!group\">\n                  <ng-container\n                    *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\n                </ng-container>\n                <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\n                  <ng-template [ngForOf]=\"options\" let-i=\"index\" let-option ngFor>\n                    <p-dropdownItem\n                      (onClick)=\"onItemClick($event)\"\n                      [disabled]=\"isOptionDisabled(option)\"\n                      [label]=\"getOptionLabel(option)\"\n                      [option]=\"option\"\n                      [selected]=\"selectedOption == option\"\n                      [template]=\"itemTemplate\"\n                    ></p-dropdownItem>\n                  </ng-template>\n                </ng-template>\n                <li *ngIf=\"filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n                    class=\"p-dropdown-empty-message\">\n                  <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\n                    {{ emptyFilterMessageLabel }}\n                  </ng-container>\n                  <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\n                </li>\n                <li *ngIf=\"!filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n                    class=\"p-dropdown-empty-message\">\n                  <ng-container *ngIf=\"!emptyTemplate\">\n                    {{ emptyMessageLabel }}\n                  </ng-container>\n                  <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n                </li>\n              </ul>\n            </ng-template>\n          </div>\n          <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n        </div>\n      </ng-template>\n    </p-overlay>\n  </div>\n</label>\n" }]
+                    }, providers: [DROPDOWN_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<label class=\"label type_varchars in-dropdown\">\n<span *ngIf=\"title\" class=\"c-label__content\">\n        {{ title }}\n  <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{ error }}</span>\n    </span>\n  <div\n    #container\n    (click)=\"onMouseclick($event)\"\n    [class]=\"styleClass\"\n    [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\n    [ngStyle]=\"style\"\n  >\n    <div class=\"p-hidden-accessible\">\n      <input\n        #in\n        (blur)=\"onInputBlur($event)\"\n        (focus)=\"onInputFocus($event)\"\n        (keydown)=\"onKeydown($event, true)\"\n        [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\n        [attr.aria-expanded]=\"false\"\n        [attr.aria-label]=\"ariaLabel\"\n        [attr.aria-labelledby]=\"ariaLabelledBy\"\n        [attr.id]=\"inputId\"\n        [attr.placeholder]=\"placeholder\"\n        [attr.tabindex]=\"tabindex\"\n        [autofocus]=\"autofocus\"\n        [disabled]=\"disabled\"\n        aria-haspopup=\"listbox\"\n        aria-haspopup=\"listbox\"\n        pAutoFocus\n        readonly\n        role=\"combobox\"\n        type=\"text\"\n      />\n    </div>\n    <span\n      *ngIf=\"!editable && label != null\"\n      [attr.id]=\"labelId\"\n      [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\n      [pTooltip]=\"tooltip\"\n      [positionStyle]=\"tooltipPositionStyle\"\n      [tooltipPosition]=\"tooltipPosition\"\n      [tooltipStyleClass]=\"tooltipStyleClass\">\n                <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || '' }}</ng-container>\n                <ng-container\n                  *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\n            </span>\n    <span\n      *ngIf=\"!editable && label == null\"\n      [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\">{{ placeholder || '' }}</span>\n    <input\n      #editableInput\n      (blur)=\"onInputBlur($event)\"\n      (focus)=\"onEditableInputFocus($event)\"\n      (input)=\"onEditableInputChange($event)\"\n      *ngIf=\"editable\"\n      [attr.aria-expanded]=\"overlayVisible\"\n      [attr.maxlength]=\"maxlength\"\n      [attr.placeholder]=\"placeholder\"\n      [disabled]=\"disabled\"\n      aria-haspopup=\"listbox\"\n      class=\"p-dropdown-label p-inputtext\"\n      type=\"text\"\n    />\n    <i (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\" class=\"p-dropdown-clear-icon pi pi-times\"></i>\n    <div [attr.aria-expanded]=\"overlayVisible\" aria-haspopup=\"listbox\" aria-label=\"dropdown trigger\"\n         class=\"p-dropdown-trigger\"\n         role=\"button\">\n      <span [ngClass]=\"dropdownIcon\" class=\"p-dropdown-trigger-icon\"></span>\n    </div>\n    <p-overlay\n      #overlay\n      (onAnimationStart)=\"onOverlayAnimationStart($event)\"\n      (onHide)=\"hide()\"\n      [(visible)]=\"overlayVisible\"\n      [appendTo]=\"appendTo\"\n      [autoZIndex]=\"autoZIndex\"\n      [baseZIndex]=\"baseZIndex\"\n      [hideTransitionOptions]=\"hideTransitionOptions\"\n      [options]=\"overlayOptions\"\n      [showTransitionOptions]=\"showTransitionOptions\"\n      [target]=\"'@parent'\"\n    >\n      <ng-template pTemplate=\"content\">\n        <div [class]=\"panelStyleClass\" [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\">\n          <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n          <div (click)=\"$event.stopPropagation()\" *ngIf=\"filter\" class=\"p-dropdown-header\">\n            <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\n              <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\n            </ng-container>\n            <ng-template #builtInFilterElement>\n              <div class=\"p-dropdown-filter-container\">\n                <input\n                  #filter\n                  (input)=\"onFilterInputChange($event)\"\n                  (keydown)=\"onKeydown($event, false)\"\n                  (keydown.enter)=\"$event.preventDefault()\"\n                  [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\n                  [attr.aria-label]=\"ariaFilterLabel\"\n                  [attr.placeholder]=\"filterPlaceholder\"\n                  [value]=\"filterValue || ''\"\n                  autocomplete=\"off\"\n                  class=\"p-dropdown-filter p-inputtext p-component\"\n                  type=\"text\"\n                />\n                <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\n              </div>\n            </ng-template>\n          </div>\n          <div [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\" class=\"p-dropdown-items-wrapper\">\n            <p-scroller\n              #scroller\n              (onLazyLoad)=\"onLazyLoad.emit($event)\"\n              *ngIf=\"virtualScroll\"\n              [autoSize]=\"true\"\n              [itemSize]=\"virtualScrollItemSize || _itemSize\"\n              [items]=\"optionsToDisplay\"\n              [lazy]=\"lazy\"\n              [options]=\"virtualScrollOptions\"\n              [style]=\"{ height: scrollHeight }\"\n            >\n              <ng-template let-items let-scrollerOptions=\"options\" pTemplate=\"content\">\n                <ng-container\n                  *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n              </ng-template>\n              <ng-container *ngIf=\"loaderTemplate\">\n                <ng-template let-scrollerOptions=\"options\" pTemplate=\"loader\">\n                  <ng-container\n                    *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n                </ng-template>\n              </ng-container>\n            </p-scroller>\n            <ng-container *ngIf=\"!virtualScroll\">\n              <ng-container\n                *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\n            </ng-container>\n\n            <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n              <ul #items [attr.id]=\"listId\" [ngClass]=\"scrollerOptions.contentStyleClass\"\n                  [style]=\"scrollerOptions.contentStyle\"\n                  class=\"p-dropdown-items\" role=\"listbox\">\n                <ng-container *ngIf=\"group\">\n                  <ng-template [ngForOf]=\"items\" let-optgroup ngFor>\n                    <li [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\" class=\"p-dropdown-item-group\">\n                      <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || '' }}</span>\n                      <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n                    </li>\n                    <ng-container\n                      *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\n                  </ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"!group\">\n                  <ng-container\n                    *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\n                </ng-container>\n                <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\n                  <ng-template [ngForOf]=\"options\" let-i=\"index\" let-option ngFor>\n                    <p-dropdownItem\n                      (onClick)=\"onItemClick($event)\"\n                      [disabled]=\"isOptionDisabled(option)\"\n                      [label]=\"getOptionLabel(option)\"\n                      [option]=\"option\"\n                      [selected]=\"selectedOption == option\"\n                      [template]=\"itemTemplate\"\n                    ></p-dropdownItem>\n                  </ng-template>\n                </ng-template>\n                <li *ngIf=\"filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n                    class=\"p-dropdown-empty-message\">\n                  <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\n                    {{ emptyFilterMessageLabel }}\n                  </ng-container>\n                  <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\n                </li>\n                <li *ngIf=\"!filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n                    class=\"p-dropdown-empty-message\">\n                  <ng-container *ngIf=\"!emptyTemplate\">\n                    {{ emptyMessageLabel }}\n                  </ng-container>\n                  <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n                </li>\n              </ul>\n            </ng-template>\n          </div>\n          <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n        </div>\n      </ng-template>\n    </p-overlay>\n  </div>\n</label>\n", styles: [".in-dropdown{width:100%}\n"] }]
         }], propDecorators: { title: [{
                 type: Input
             }], error: [{