@inspark/inspark-components 14.0.54 → 14.0.56

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

@@ -935,10 +935,10 @@ class ComponentContainerComponent {
     }
 }
 ComponentContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ComponentContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ComponentContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ComponentContainerComponent, selector: "in-component-container", inputs: { align: "align" }, ngImport: i0, template: "<div [ngClass]=\"align\" class=\"inspark-component-container\">\n  <ng-content></ng-content>\n</div>\n", styles: ["@charset \"UTF-8\";.inspark-component-container{display:flex}@media screen and (min-width: 480px){.inspark-component-container{padding-bottom:0}}:host ::ng-deep in-button{margin-right:8px}:host ::ng-deep in-button:last-child{margin-right:0}:host ::ng-deep in-link{margin-right:8px}:host ::ng-deep in-link:last-child{margin-right:0}.right{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+ComponentContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ComponentContainerComponent, selector: "in-component-container", inputs: { align: "align" }, ngImport: i0, template: "<div [ngClass]=\"align\" class=\"inspark-component-container\">\n  <ng-content></ng-content>\n</div>\n", styles: ["@charset \"UTF-8\";.inspark-component-container{display:flex;gap:8px}@media screen and (min-width: 480px){.inspark-component-container{padding-bottom:0}}.right{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ComponentContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'in-component-container', template: "<div [ngClass]=\"align\" class=\"inspark-component-container\">\n  <ng-content></ng-content>\n</div>\n", styles: ["@charset \"UTF-8\";.inspark-component-container{display:flex}@media screen and (min-width: 480px){.inspark-component-container{padding-bottom:0}}:host ::ng-deep in-button{margin-right:8px}:host ::ng-deep in-button:last-child{margin-right:0}:host ::ng-deep in-link{margin-right:8px}:host ::ng-deep in-link:last-child{margin-right:0}.right{justify-content:flex-end}\n"] }]
+            args: [{ selector: 'in-component-container', template: "<div [ngClass]=\"align\" class=\"inspark-component-container\">\n  <ng-content></ng-content>\n</div>\n", styles: ["@charset \"UTF-8\";.inspark-component-container{display:flex;gap:8px}@media screen and (min-width: 480px){.inspark-component-container{padding-bottom:0}}.right{justify-content:flex-end}\n"] }]
         }], propDecorators: { align: [{
                 type: Input
             }] } });
@@ -1182,14 +1182,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: "<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\" 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 *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\" [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", 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\">\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 });
 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: "<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\" 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 *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\" [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" }]
+                    }, 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" }]
         }], propDecorators: { title: [{
                 type: Input
             }], error: [{
@@ -2180,7 +2180,7 @@ SelectButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
             useExisting: forwardRef(() => SelectButtonComponent),
             multi: true,
         }
-    ], usesOnChanges: true, ngImport: i0, template: "<span *ngIf=\"label\" class=\"c-label__content\">\n        {{label}}\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 class=\"container\">\n  <in-button class=\"button-none\"></in-button>\n  <in-button (click)=\"clickButton(option)\"\n             *ngFor=\"let option of options\"\n             [color]=\"selected.indexOf(option.value) === -1 ? 'normal': 'primary' \"\n             [icon]=\"option.icon\"\n             [label]=\"option.label | translate\"\n             [testId]=\"'filter-buttons-' + option.value\"\n             [title]=\"option.title ? (option.title | translate) : ''\"\n             [name] = option.label\n             [disabled]=\"option.readonly\"\n  >\n  </in-button>\n</div>\n", styles: [".container{white-space:nowrap}in-button ::ng-deep button{outline:none}in-button:first-child ::ng-deep button{border-bottom-right-radius:0;border-top-right-radius:0;border-right:1px solid #000}in-button:not(:first-child):not(:last-child) ::ng-deep button{border-radius:0;border-right:1px solid #000}in-button:last-child ::ng-deep button{border-bottom-left-radius:0;border-top-left-radius:0}.button-none{display:none}\n"], dependencies: [{ 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: "component", type: ButtonComponent, selector: "in-button", inputs: ["size", "color", "type", "name", "testId", "label", "icon", "className", "notify", "svg", "width", "link", "isLoading", "shadow", "isIconOnly", "linkType", "linkTarget", "pressed", "disabled", "iconPos", "selectedItem", "menuPlacement", "menuItems"], outputs: ["focus", "blur", "click"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
+    ], usesOnChanges: true, ngImport: i0, template: "<span *ngIf=\"label\" class=\"c-label__content\">\n        {{label}}\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 class=\"container\">\n  <in-button class=\"button-none\"></in-button>\n  <in-button (click)=\"clickButton(option)\"\n             *ngFor=\"let option of options\"\n             [color]=\"selected.indexOf(option.value) === -1 ? 'normal': 'primary' \"\n             [icon]=\"option.icon\"\n             [label]=\"option.label | translate\"\n             [testId]=\"'filter-buttons-' + option.value\"\n             [title]=\"option.title ? (option.title | translate) : ''\"\n             [name] = option.label\n             [disabled]=\"option.readonly || disabled\"\n  >\n  </in-button>\n</div>\n", styles: [".container{white-space:nowrap}in-button ::ng-deep button{outline:none}in-button:first-child ::ng-deep button{border-bottom-right-radius:0;border-top-right-radius:0;border-right:1px solid #000}in-button:not(:first-child):not(:last-child) ::ng-deep button{border-radius:0;border-right:1px solid #000}in-button:last-child ::ng-deep button{border-bottom-left-radius:0;border-top-left-radius:0}.button-none{display:none}\n"], dependencies: [{ 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: "component", type: ButtonComponent, selector: "in-button", inputs: ["size", "color", "type", "name", "testId", "label", "icon", "className", "notify", "svg", "width", "link", "isLoading", "shadow", "isIconOnly", "linkType", "linkTarget", "pressed", "disabled", "iconPos", "selectedItem", "menuPlacement", "menuItems"], outputs: ["focus", "blur", "click"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'in-select-button', providers: [
@@ -2189,7 +2189,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                             useExisting: forwardRef(() => SelectButtonComponent),
                             multi: true,
                         }
-                    ], template: "<span *ngIf=\"label\" class=\"c-label__content\">\n        {{label}}\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 class=\"container\">\n  <in-button class=\"button-none\"></in-button>\n  <in-button (click)=\"clickButton(option)\"\n             *ngFor=\"let option of options\"\n             [color]=\"selected.indexOf(option.value) === -1 ? 'normal': 'primary' \"\n             [icon]=\"option.icon\"\n             [label]=\"option.label | translate\"\n             [testId]=\"'filter-buttons-' + option.value\"\n             [title]=\"option.title ? (option.title | translate) : ''\"\n             [name] = option.label\n             [disabled]=\"option.readonly\"\n  >\n  </in-button>\n</div>\n", styles: [".container{white-space:nowrap}in-button ::ng-deep button{outline:none}in-button:first-child ::ng-deep button{border-bottom-right-radius:0;border-top-right-radius:0;border-right:1px solid #000}in-button:not(:first-child):not(:last-child) ::ng-deep button{border-radius:0;border-right:1px solid #000}in-button:last-child ::ng-deep button{border-bottom-left-radius:0;border-top-left-radius:0}.button-none{display:none}\n"] }]
+                    ], template: "<span *ngIf=\"label\" class=\"c-label__content\">\n        {{label}}\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 class=\"container\">\n  <in-button class=\"button-none\"></in-button>\n  <in-button (click)=\"clickButton(option)\"\n             *ngFor=\"let option of options\"\n             [color]=\"selected.indexOf(option.value) === -1 ? 'normal': 'primary' \"\n             [icon]=\"option.icon\"\n             [label]=\"option.label | translate\"\n             [testId]=\"'filter-buttons-' + option.value\"\n             [title]=\"option.title ? (option.title | translate) : ''\"\n             [name] = option.label\n             [disabled]=\"option.readonly || disabled\"\n  >\n  </in-button>\n</div>\n", styles: [".container{white-space:nowrap}in-button ::ng-deep button{outline:none}in-button:first-child ::ng-deep button{border-bottom-right-radius:0;border-top-right-radius:0;border-right:1px solid #000}in-button:not(:first-child):not(:last-child) ::ng-deep button{border-radius:0;border-right:1px solid #000}in-button:last-child ::ng-deep button{border-bottom-left-radius:0;border-top-left-radius:0}.button-none{display:none}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { name: [{
                 type: Input
             }], testId: [{