ngx-vector-components 5.110.0 → 5.112.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Component, Input, Pipe, NgModule, InjectionToken, Inject, EventEmitter, Output, Injectable, ViewChild, ViewEncapsulation, HostListener, inject } from '@angular/core';
2
+ import { Component, Input, Pipe, NgModule, InjectionToken, Inject, EventEmitter, Output, Injectable, ViewChild, signal, ViewEncapsulation, HostListener, inject } from '@angular/core';
3
3
  import * as i1 from '@angular/common';
4
4
  import { CommonModule } from '@angular/common';
5
5
  import * as i2 from 'primeng/tooltip';
@@ -380,6 +380,8 @@ var ProfileModuleActionType;
380
380
  ProfileModuleActionType["AUTOMATIC_CHECKIN"] = "Automatic CheckIn";
381
381
  ProfileModuleActionType["SHOW_FILTERS_MONTHLY_RECEPTION"] = "Show Filters Monthly Reception";
382
382
  ProfileModuleActionType["VIEW_ROUTE_TRIP"] = "View Route Trip";
383
+ ProfileModuleActionType["SHOW_ROUTE"] = "Show Route";
384
+ ProfileModuleActionType["EDIT_ROUTE"] = "Edit Route";
383
385
  ProfileModuleActionType["SHOW_RISK_MANAGEMENT"] = "Show Risk Management";
384
386
  ProfileModuleActionType["ADD_RISK_MANAGEMENT"] = "Add Risk Management";
385
387
  ProfileModuleActionType["EDIT_RISK_MANAGEMENT"] = "Edit Risk Management";
@@ -2886,6 +2888,7 @@ class MultiselectFieldComponent {
2886
2888
  this.currentScrollIndex = 0;
2887
2889
  this.unlistenAutocompleteVirtualScroll = () => { };
2888
2890
  this._pagedSugestion = [];
2891
+ this.signalOptions = signal([]);
2889
2892
  }
2890
2893
  ngOnInit() {
2891
2894
  if (this.initialLoad && this.filterVirtualScrool) {
@@ -2941,10 +2944,21 @@ class MultiselectFieldComponent {
2941
2944
  .getPaged(encodeURIComponent(this.currentSearchQuery), this.currentScrollPage, this.limitScrollPage, this.dependencies)
2942
2945
  .subscribe({
2943
2946
  next: (response) => {
2944
- this.options =
2945
- this.currentScrollPage === 0
2946
- ? response
2947
- : this.options?.concat(response);
2947
+ if (response && response.length) {
2948
+ const currentSignalOptions = this.signalOptions() || [];
2949
+ const combined = [
2950
+ ...currentSignalOptions,
2951
+ ...response,
2952
+ ...(this.currentScrollPage === 0 ? [] : this.options),
2953
+ ];
2954
+ const uniqueOptions = combined.filter((item, index, self) => self.findIndex((i) => i.code === item.code) === index);
2955
+ this.options = uniqueOptions;
2956
+ this.signalOptions.set(uniqueOptions);
2957
+ }
2958
+ else {
2959
+ this.options = this.currentScrollPage === 0 ? [] : this.options;
2960
+ this.signalOptions.set(this.options);
2961
+ }
2948
2962
  const controlValue = typeof this.control.value == 'object' ? this.control.value?.code : this.control.value;
2949
2963
  if (this.control.value && this.options?.find((item) => item.code == controlValue)) {
2950
2964
  this.setControlValueFromSuggestions();
@@ -3002,6 +3016,24 @@ class MultiselectFieldComponent {
3002
3016
  this.options = [];
3003
3017
  }
3004
3018
  }
3019
+ onFilterChange($event) {
3020
+ if (!$event || !$event.filter)
3021
+ return;
3022
+ if (this.service && $event?.filter.length >= this.minLengthToService) {
3023
+ this.service.getPaged($event.filter, this.currentScrollPage, this.limitScrollPage, this.dependencies).subscribe({
3024
+ next: (response) => {
3025
+ if (response && response.length) {
3026
+ const currentSignalOptions = this.signalOptions() || [];
3027
+ const combined = [...response, ...currentSignalOptions, ...this.options];
3028
+ const uniqueOptions = combined.filter((item, index, self) => self.findIndex((i) => i.code === item.code) === index);
3029
+ this.options = uniqueOptions;
3030
+ this.signalOptions.set(uniqueOptions);
3031
+ }
3032
+ },
3033
+ error: (err) => { },
3034
+ });
3035
+ }
3036
+ }
3005
3037
  pageResults() {
3006
3038
  const filteredOptions = this.filterListByQuery(this.pagedSugestion, this.currentSearchQuery.toUpperCase());
3007
3039
  this.options = filteredOptions.slice(0, this.currentScrollIndex + 20);
@@ -3045,11 +3077,11 @@ class MultiselectFieldComponent {
3045
3077
  }
3046
3078
  }
3047
3079
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MultiselectFieldComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
3048
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: MultiselectFieldComponent, selector: "vector-multiselect-field", inputs: { pagedSugestion: "pagedSugestion", isRequired: "isRequired", control: "control", label: "label", options: "options", filter: "filter", showSelectAllOption: "showSelectAllOption", display: "display", paged: "paged", disabled: "disabled", minLengthToService: "minLengthToService", initialLoad: "initialLoad", service: "service", filterVirtualScrool: "filterVirtualScrool", showHeader: "showHeader", showFlags: "showFlags", dependencies: "dependencies", limitScrollPage: "limitScrollPage", forceSelection: "forceSelection", showFlagsOptions: "showFlagsOptions" }, outputs: { onChange: "onChange", onClosePanel: "onClosePanel" }, ngImport: i0, template: "<div class=\"multiselect-field-input-container\">\r\n <p-multiSelect\r\n *ngIf=\"!filterVirtualScrool\"\r\n #multiselect\r\n appendTo=\"body\"\r\n optionLabel=\"name\"\r\n optionValue=\"code\"\r\n dropdownIcon=\"fas fa-sort-down\"\r\n selectedItemsLabel=\"Selecionar todos\"\r\n [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n [options]=\"options\"\r\n [formControl]=\"control\"\r\n [placeholder]=\"placeholder\"\r\n [filter]=\"filter\"\r\n [maxSelectedLabels]=\"options.length - 1\"\r\n [showToggleAll]=\"showSelectAllOption\"\r\n [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n [display]=\"display\"\r\n (onChange)=\"onChange.emit($event)\"\r\n (onPanelHide)=\"onClosePanel.emit($event)\"\r\n (onPanelShow)=\"customFormattingMultiSelectFieldWithFlags()\"\r\n [disabled]=\"disabled\"\r\n [showHeader]=\"showHeader\"\r\n >\r\n <ng-container *ngIf=\"showFlags\">\r\n <ng-template let-option pTemplate=\"item\">\r\n <div class=\"grid-nogutter w-full flex\">\r\n <div\r\n class=\"md:col-6 sm:col-12 align-content-center\"\r\n [ngClass]=\"option.align === 'center' ? 'md:text-center' : 'md:text-left'\"\r\n >\r\n <img\r\n *ngIf=\"option.type == 'img'\"\r\n [src]=\"option.imgSource\"\r\n [ngClass]=\"option.imgClass\"\r\n [style]=\"{ height: option.imgSize + 'px' }\"\r\n />\r\n <i\r\n *ngIf=\"option.type == 'icon'\"\r\n [className]=\"option.iconSource\"\r\n [ngClass]=\"option.iconClass\"\r\n [style]=\"{ 'font-size': option.iconSize }\"\r\n ></i>\r\n </div>\r\n\r\n <div *ngIf=\"option.showDescriptionOnRight\" class=\"col-6 hidden md:block align-content-center\">\r\n <span class=\"block\">{{ option.name }}</span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n </p-multiSelect>\r\n\r\n <p-multiSelect\r\n *ngIf=\"filterVirtualScrool\"\r\n #multiselect\r\n appendTo=\"body\"\r\n optionLabel=\"name\"\r\n optionValue=\"code\"\r\n dropdownIcon=\"fas fa-sort-down\"\r\n selectedItemsLabel=\"Selecionar todos\"\r\n [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n [options]=\"options\"\r\n [formControl]=\"control\"\r\n [placeholder]=\"placeholder\"\r\n [filter]=\"filter\"\r\n [maxSelectedLabels]=\"options.length - 1\"\r\n [showHeader]=\"true\"\r\n [showToggleAll]=\"showSelectAllOption\"\r\n [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n [display]=\"display\"\r\n (onChange)=\"onChange.emit($event)\"\r\n (onFilter)=\"search($event)\"\r\n (onPanelShow)=\"onOpenAutocompletePanel()\"\r\n (onPanelHide)=\"onHideAutocompletePanel()\"\r\n [disabled]=\"disabled\"\r\n >\r\n </p-multiSelect>\r\n <p-multiSelect\r\n *ngIf=\"filterVirtualScrool\"\r\n #multiselect\r\n appendTo=\"body\"\r\n optionLabel=\"name\"\r\n optionValue=\"code\"\r\n dropdownIcon=\"fas fa-sort-down\"\r\n selectedItemsLabel=\"Selecionar todos\"\r\n [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n [options]=\"options\"\r\n [formControl]=\"control\"\r\n [placeholder]=\"placeholder\"\r\n [filter]=\"filter\"\r\n [maxSelectedLabels]=\"options.length - 1\"\r\n [showHeader]=\"true\"\r\n [showToggleAll]=\"showSelectAllOption\"\r\n [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n [display]=\"display\"\r\n (onChange)=\"onChange.emit($event)\"\r\n (onFilter)=\"search($event)\"\r\n (onPanelShow)=\"onOpenAutocompletePanel()\"\r\n (onPanelHide)=\"onHideAutocompletePanel()\"\r\n [disabled]=\"disabled\"\r\n >\r\n </p-multiSelect>\r\n <span class=\"input-error\">{{ fieldErrorLabel() }}</span>\r\n</div>\r\n", styles: [".multiselect-field-input-container .input-error{font-size:.7em;color:var(--error-color)}.multiselect-field-input-container div.p-multiselect-token{padding:auto 1em!important;background:#eff0f6!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }] }); }
3080
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: MultiselectFieldComponent, selector: "vector-multiselect-field", inputs: { pagedSugestion: "pagedSugestion", isRequired: "isRequired", control: "control", label: "label", options: "options", filter: "filter", showSelectAllOption: "showSelectAllOption", display: "display", paged: "paged", disabled: "disabled", minLengthToService: "minLengthToService", initialLoad: "initialLoad", service: "service", filterVirtualScrool: "filterVirtualScrool", showHeader: "showHeader", showFlags: "showFlags", dependencies: "dependencies", limitScrollPage: "limitScrollPage", forceSelection: "forceSelection", showFlagsOptions: "showFlagsOptions" }, outputs: { onChange: "onChange", onClosePanel: "onClosePanel" }, ngImport: i0, template: "<div class=\"multiselect-field-input-container\">\r\n <p-multiSelect\r\n *ngIf=\"!filterVirtualScrool\"\r\n #multiselect\r\n appendTo=\"body\"\r\n optionLabel=\"name\"\r\n optionValue=\"code\"\r\n dropdownIcon=\"fas fa-sort-down\"\r\n selectedItemsLabel=\"Selecionar todos\"\r\n [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n [options]=\"options\"\r\n [formControl]=\"control\"\r\n [placeholder]=\"placeholder\"\r\n [filter]=\"filter\"\r\n [maxSelectedLabels]=\"options.length - 1\"\r\n [showToggleAll]=\"showSelectAllOption\"\r\n [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n [display]=\"display\"\r\n (onChange)=\"onChange.emit($event)\"\r\n (onPanelHide)=\"onClosePanel.emit($event)\"\r\n (onPanelShow)=\"customFormattingMultiSelectFieldWithFlags()\"\r\n (onFilter)=\"onFilterChange($event)\"\r\n [disabled]=\"disabled\"\r\n [showHeader]=\"showHeader\"\r\n >\r\n <ng-container *ngIf=\"showFlags\">\r\n <ng-template let-option pTemplate=\"item\">\r\n <div class=\"grid-nogutter w-full flex\">\r\n <div\r\n class=\"md:col-6 sm:col-12 align-content-center\"\r\n [ngClass]=\"option.align === 'center' ? 'md:text-center' : 'md:text-left'\"\r\n >\r\n <img\r\n *ngIf=\"option.type == 'img'\"\r\n [src]=\"option.imgSource\"\r\n [ngClass]=\"option.imgClass\"\r\n [style]=\"{ height: option.imgSize + 'px' }\"\r\n />\r\n <i\r\n *ngIf=\"option.type == 'icon'\"\r\n [className]=\"option.iconSource\"\r\n [ngClass]=\"option.iconClass\"\r\n [style]=\"{ 'font-size': option.iconSize }\"\r\n ></i>\r\n </div>\r\n\r\n <div *ngIf=\"option.showDescriptionOnRight\" class=\"col-6 hidden md:block align-content-center\">\r\n <span class=\"block\">{{ option.name }}</span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n </p-multiSelect>\r\n\r\n <p-multiSelect\r\n *ngIf=\"filterVirtualScrool\"\r\n #multiselect\r\n appendTo=\"body\"\r\n optionLabel=\"name\"\r\n optionValue=\"code\"\r\n dropdownIcon=\"fas fa-sort-down\"\r\n selectedItemsLabel=\"Selecionar todos\"\r\n [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n [options]=\"options\"\r\n [formControl]=\"control\"\r\n [placeholder]=\"placeholder\"\r\n [filter]=\"filter\"\r\n [maxSelectedLabels]=\"options.length - 1\"\r\n [showHeader]=\"true\"\r\n [showToggleAll]=\"showSelectAllOption\"\r\n [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n [display]=\"display\"\r\n (onChange)=\"onChange.emit($event)\"\r\n (onFilter)=\"search($event)\"\r\n (onPanelShow)=\"onOpenAutocompletePanel()\"\r\n (onPanelHide)=\"onHideAutocompletePanel()\"\r\n [disabled]=\"disabled\"\r\n >\r\n </p-multiSelect>\r\n <span class=\"input-error\">{{ fieldErrorLabel() }}</span>\r\n</div>\r\n", styles: [".multiselect-field-input-container .input-error{font-size:.7em;color:var(--error-color)}.multiselect-field-input-container div.p-multiselect-token{padding:auto 1em!important;background:#eff0f6!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }] }); }
3049
3081
  }
3050
3082
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MultiselectFieldComponent, decorators: [{
3051
3083
  type: Component,
3052
- args: [{ selector: 'vector-multiselect-field', template: "<div class=\"multiselect-field-input-container\">\r\n <p-multiSelect\r\n *ngIf=\"!filterVirtualScrool\"\r\n #multiselect\r\n appendTo=\"body\"\r\n optionLabel=\"name\"\r\n optionValue=\"code\"\r\n dropdownIcon=\"fas fa-sort-down\"\r\n selectedItemsLabel=\"Selecionar todos\"\r\n [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n [options]=\"options\"\r\n [formControl]=\"control\"\r\n [placeholder]=\"placeholder\"\r\n [filter]=\"filter\"\r\n [maxSelectedLabels]=\"options.length - 1\"\r\n [showToggleAll]=\"showSelectAllOption\"\r\n [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n [display]=\"display\"\r\n (onChange)=\"onChange.emit($event)\"\r\n (onPanelHide)=\"onClosePanel.emit($event)\"\r\n (onPanelShow)=\"customFormattingMultiSelectFieldWithFlags()\"\r\n [disabled]=\"disabled\"\r\n [showHeader]=\"showHeader\"\r\n >\r\n <ng-container *ngIf=\"showFlags\">\r\n <ng-template let-option pTemplate=\"item\">\r\n <div class=\"grid-nogutter w-full flex\">\r\n <div\r\n class=\"md:col-6 sm:col-12 align-content-center\"\r\n [ngClass]=\"option.align === 'center' ? 'md:text-center' : 'md:text-left'\"\r\n >\r\n <img\r\n *ngIf=\"option.type == 'img'\"\r\n [src]=\"option.imgSource\"\r\n [ngClass]=\"option.imgClass\"\r\n [style]=\"{ height: option.imgSize + 'px' }\"\r\n />\r\n <i\r\n *ngIf=\"option.type == 'icon'\"\r\n [className]=\"option.iconSource\"\r\n [ngClass]=\"option.iconClass\"\r\n [style]=\"{ 'font-size': option.iconSize }\"\r\n ></i>\r\n </div>\r\n\r\n <div *ngIf=\"option.showDescriptionOnRight\" class=\"col-6 hidden md:block align-content-center\">\r\n <span class=\"block\">{{ option.name }}</span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n </p-multiSelect>\r\n\r\n <p-multiSelect\r\n *ngIf=\"filterVirtualScrool\"\r\n #multiselect\r\n appendTo=\"body\"\r\n optionLabel=\"name\"\r\n optionValue=\"code\"\r\n dropdownIcon=\"fas fa-sort-down\"\r\n selectedItemsLabel=\"Selecionar todos\"\r\n [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n [options]=\"options\"\r\n [formControl]=\"control\"\r\n [placeholder]=\"placeholder\"\r\n [filter]=\"filter\"\r\n [maxSelectedLabels]=\"options.length - 1\"\r\n [showHeader]=\"true\"\r\n [showToggleAll]=\"showSelectAllOption\"\r\n [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n [display]=\"display\"\r\n (onChange)=\"onChange.emit($event)\"\r\n (onFilter)=\"search($event)\"\r\n (onPanelShow)=\"onOpenAutocompletePanel()\"\r\n (onPanelHide)=\"onHideAutocompletePanel()\"\r\n [disabled]=\"disabled\"\r\n >\r\n </p-multiSelect>\r\n <p-multiSelect\r\n *ngIf=\"filterVirtualScrool\"\r\n #multiselect\r\n appendTo=\"body\"\r\n optionLabel=\"name\"\r\n optionValue=\"code\"\r\n dropdownIcon=\"fas fa-sort-down\"\r\n selectedItemsLabel=\"Selecionar todos\"\r\n [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n [options]=\"options\"\r\n [formControl]=\"control\"\r\n [placeholder]=\"placeholder\"\r\n [filter]=\"filter\"\r\n [maxSelectedLabels]=\"options.length - 1\"\r\n [showHeader]=\"true\"\r\n [showToggleAll]=\"showSelectAllOption\"\r\n [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n [display]=\"display\"\r\n (onChange)=\"onChange.emit($event)\"\r\n (onFilter)=\"search($event)\"\r\n (onPanelShow)=\"onOpenAutocompletePanel()\"\r\n (onPanelHide)=\"onHideAutocompletePanel()\"\r\n [disabled]=\"disabled\"\r\n >\r\n </p-multiSelect>\r\n <span class=\"input-error\">{{ fieldErrorLabel() }}</span>\r\n</div>\r\n", styles: [".multiselect-field-input-container .input-error{font-size:.7em;color:var(--error-color)}.multiselect-field-input-container div.p-multiselect-token{padding:auto 1em!important;background:#eff0f6!important}\n"] }]
3084
+ args: [{ selector: 'vector-multiselect-field', template: "<div class=\"multiselect-field-input-container\">\r\n <p-multiSelect\r\n *ngIf=\"!filterVirtualScrool\"\r\n #multiselect\r\n appendTo=\"body\"\r\n optionLabel=\"name\"\r\n optionValue=\"code\"\r\n dropdownIcon=\"fas fa-sort-down\"\r\n selectedItemsLabel=\"Selecionar todos\"\r\n [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n [options]=\"options\"\r\n [formControl]=\"control\"\r\n [placeholder]=\"placeholder\"\r\n [filter]=\"filter\"\r\n [maxSelectedLabels]=\"options.length - 1\"\r\n [showToggleAll]=\"showSelectAllOption\"\r\n [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n [display]=\"display\"\r\n (onChange)=\"onChange.emit($event)\"\r\n (onPanelHide)=\"onClosePanel.emit($event)\"\r\n (onPanelShow)=\"customFormattingMultiSelectFieldWithFlags()\"\r\n (onFilter)=\"onFilterChange($event)\"\r\n [disabled]=\"disabled\"\r\n [showHeader]=\"showHeader\"\r\n >\r\n <ng-container *ngIf=\"showFlags\">\r\n <ng-template let-option pTemplate=\"item\">\r\n <div class=\"grid-nogutter w-full flex\">\r\n <div\r\n class=\"md:col-6 sm:col-12 align-content-center\"\r\n [ngClass]=\"option.align === 'center' ? 'md:text-center' : 'md:text-left'\"\r\n >\r\n <img\r\n *ngIf=\"option.type == 'img'\"\r\n [src]=\"option.imgSource\"\r\n [ngClass]=\"option.imgClass\"\r\n [style]=\"{ height: option.imgSize + 'px' }\"\r\n />\r\n <i\r\n *ngIf=\"option.type == 'icon'\"\r\n [className]=\"option.iconSource\"\r\n [ngClass]=\"option.iconClass\"\r\n [style]=\"{ 'font-size': option.iconSize }\"\r\n ></i>\r\n </div>\r\n\r\n <div *ngIf=\"option.showDescriptionOnRight\" class=\"col-6 hidden md:block align-content-center\">\r\n <span class=\"block\">{{ option.name }}</span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n </p-multiSelect>\r\n\r\n <p-multiSelect\r\n *ngIf=\"filterVirtualScrool\"\r\n #multiselect\r\n appendTo=\"body\"\r\n optionLabel=\"name\"\r\n optionValue=\"code\"\r\n dropdownIcon=\"fas fa-sort-down\"\r\n selectedItemsLabel=\"Selecionar todos\"\r\n [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n [options]=\"options\"\r\n [formControl]=\"control\"\r\n [placeholder]=\"placeholder\"\r\n [filter]=\"filter\"\r\n [maxSelectedLabels]=\"options.length - 1\"\r\n [showHeader]=\"true\"\r\n [showToggleAll]=\"showSelectAllOption\"\r\n [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n [display]=\"display\"\r\n (onChange)=\"onChange.emit($event)\"\r\n (onFilter)=\"search($event)\"\r\n (onPanelShow)=\"onOpenAutocompletePanel()\"\r\n (onPanelHide)=\"onHideAutocompletePanel()\"\r\n [disabled]=\"disabled\"\r\n >\r\n </p-multiSelect>\r\n <span class=\"input-error\">{{ fieldErrorLabel() }}</span>\r\n</div>\r\n", styles: [".multiselect-field-input-container .input-error{font-size:.7em;color:var(--error-color)}.multiselect-field-input-container div.p-multiselect-token{padding:auto 1em!important;background:#eff0f6!important}\n"] }]
3053
3085
  }], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { pagedSugestion: [{
3054
3086
  type: Input
3055
3087
  }], isRequired: [{