ngx-sp-infra 6.5.11 → 6.5.13
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.
|
@@ -6422,11 +6422,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
6422
6422
|
}] } });
|
|
6423
6423
|
|
|
6424
6424
|
class LibComboboxReworkComponent {
|
|
6425
|
+
set list(value) {
|
|
6426
|
+
this._list = value;
|
|
6427
|
+
// Re-resolve the current value when the list changes
|
|
6428
|
+
if (this._value) {
|
|
6429
|
+
this.writeValue(this._value);
|
|
6430
|
+
}
|
|
6431
|
+
}
|
|
6432
|
+
get list() {
|
|
6433
|
+
return this._list;
|
|
6434
|
+
}
|
|
6425
6435
|
// Getter/Setter para o valor
|
|
6426
6436
|
get value() { return this._value; }
|
|
6427
6437
|
set value(val) {
|
|
6428
|
-
|
|
6429
|
-
|
|
6438
|
+
const previousValue = this._value;
|
|
6439
|
+
this._value = val;
|
|
6440
|
+
if (val !== previousValue) {
|
|
6430
6441
|
this._onChange(this.formatReturn(val)); // Notifica o FormControl sobre a mudança
|
|
6431
6442
|
}
|
|
6432
6443
|
}
|
|
@@ -6465,7 +6476,7 @@ class LibComboboxReworkComponent {
|
|
|
6465
6476
|
this._destroy$ = new Subject();
|
|
6466
6477
|
// #endregion PRIVATE
|
|
6467
6478
|
// #region PUBLIC
|
|
6468
|
-
this.
|
|
6479
|
+
this._list = [];
|
|
6469
6480
|
this.placeholder = "Selecione uma opção...";
|
|
6470
6481
|
this.searchPlaceholder = "Pesquisa...";
|
|
6471
6482
|
this.noResultsText = "Nenhum registro encontrado com esta pesquisa...";
|
|
@@ -6582,6 +6593,10 @@ class LibComboboxReworkComponent {
|
|
|
6582
6593
|
if (typeof val === 'object' && val !== null && val[this.customValue] !== undefined) {
|
|
6583
6594
|
return val;
|
|
6584
6595
|
}
|
|
6596
|
+
// Se a lista não tiver sido carregada ainda ou for vazia e houver um valor pré-definido retorna o mesmo
|
|
6597
|
+
if ((!this.list || this.list.length === 0) && val) {
|
|
6598
|
+
return val;
|
|
6599
|
+
}
|
|
6585
6600
|
// Se é um valor primitivo, tenta encontrar na lista
|
|
6586
6601
|
const match = this.list?.find((item) => item[this.customValue] === val);
|
|
6587
6602
|
return match ?? null;
|
|
@@ -6707,7 +6722,7 @@ class LibComboboxReworkComponent {
|
|
|
6707
6722
|
useExisting: forwardRef(() => LibComboboxReworkComponent),
|
|
6708
6723
|
multi: true
|
|
6709
6724
|
}
|
|
6710
|
-
], queries: [{ propertyName: "optionTemplate", first: true, predicate: ["optionTemplate"], descendants: true, read: TemplateRef }, { propertyName: "leftButtonTemplate", first: true, predicate: ["leftButtonTemplate"], descendants: true, read: TemplateRef }, { propertyName: "rightButtonTemplate", first: true, predicate: ["rightButtonTemplate"], descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "toggleButton", first: true, predicate: ["toggleButton"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"reusable-combobox input-group\" [class.show]=\"isOpen\" (focusout)=\"onBlurOutside($event)\" >\n @if (leftButtonTemplate) { <ng-container *ngTemplateOutlet=\"leftButtonTemplate\"></ng-container> }\n\n <div class=\"dropdown w-100\">\n <div #toggleButton id=\"toggle-button\" class=\"form-select d-flex align-items-center text-start\" type=\"button\" data-bs-toggle=\"dropdown\"\n data-bs-auto-close=\"outside\" [attr.aria-expanded]=\"isOpen\" [attr.aria-haspopup]=\"true\" [attr.aria-label]=\"placeholder\" [class.disabled]=\"disabled\"\n [class.is-invalid]=\"invalid\" (click)=\"toggleDropdown()\" readonly\n [ngClass]=\"{\n 'rounded-start-0': leftButtonTemplate,\n 'rounded-end-0': rightButtonTemplate,\n }\" >\n <span class=\"w-100 overflow-hidden text-truncate\"> {{ displayValue() }} </span> \n </div>\n\n <div class=\"dropdown-menu p-2 w-100\" [class.show]=\"isOpen\" style=\"max-height: 320px; overflow-y: auto;\" >\n <div class=\"dropdown-search input-group mb-2\">\n <input class=\"form-control form-control-sm\" type=\"search\" [placeholder]=\"searchPlaceholder\" [formControl]=\"searchControl\" aria-label=\"Pesquisar op\u00E7\u00F5es\" (keyup.enter)=\"filterButtonClick.emit(searchControl.value)\" />\n <button class=\"btn btn-sm btn-primary\" type=\"button\" (click)=\"filterButtonClick.emit(searchControl.value)\"> <lib-icon iconName=\"lupa\" iconSize=\"medium-small\" /> </button>\n </div>\n\n @if (multiple && selectedValues?.length) {\n <div class=\"d-flex flex-row gap-2 flex-wrap my-2\">\n <span *ngFor=\"let value of selectedValues; trackBy: trackByFn\" class=\"px-3 badge rounded-pill text-primary bg-primary-subtle\">\n {{ value[customLabel] }} <lib-icon class=\"glb-cursor-pointer\" iconName=\"fechar\" iconSize=\"small\" (click)=\"select(value)\" />\n </span>\n </div>\n }\n\n <!-- Se utilizar o filtro interno utiliza a propriedade de lista filteredItems$, caso contr\u00E1rio usa a pr\u00F3pria list pois ela ser\u00E1 filtrada pelo componente pai -->\n <ng-container *ngIf=\"(innerFilter ? (filteredItems$ | async) : list) as items\">\n @if (items.length === 0) { <div class=\"py-2 px-3 text-muted small\">{{ noResultsText }}</div> }\n\n @if (value !== '' && value !== null) {\n <button type=\"button\" class=\"dropdown-item d-flex align-items-center\" (click)=\"writeValue(null)\">\n <span class=\"fw-bold\">Limpar {{ multiple ? 'op\u00E7\u00F5es selecionadas' : 'op\u00E7\u00E3o selecionada' }}</span>\n </button>\n }\n\n <button *ngFor=\"let item of items; trackBy: trackByFn\" class=\"dropdown-item d-flex align-items-center\" type=\"button\"\n (click)=\"select(item)\" [attr.aria-selected]=\"isSelected(item)\" >\n\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { $implicit: item, selected: isSelected(item) }\"></ng-container>\n }\n @else {\n <div class=\"w-100 original\">\n <div class=\"d-flex justify-content-between\">\n <div>{{ (item[customLabel] ?? item[customValue]) }}</div>\n <small class=\"text-muted\" *ngIf=\"isSelected(item)\">\u2713</small>\n </div>\n </div>\n }\n </button>\n </ng-container>\n </div>\n </div>\n\n @if (rightButtonTemplate) { <ng-container *ngTemplateOutlet=\"rightButtonTemplate\"></ng-container> }\n</div>\n", styles: [".reusable-combobox{position:relative;display:flex;flex-wrap:nowrap;width:100%;max-width:100%}.reusable-combobox #toggle-button{box-sizing:border-box}.reusable-combobox .dropdown-menu{width:100%;box-shadow:0 6px 18px #00000014;border-radius:.5rem}.reusable-combobox .dropdown-item{cursor:pointer;border-radius:6px;transition:all .3s ease}.reusable-combobox .dropdown-item:hover:not(:focus){background-color:#f1f5f9}.reusable-combobox.compact .dropdown-menu{max-height:200px}.bg-primary-subtle{background-color:#d1dfe7!important}::-webkit-scrollbar{width:4px;background:transparent}::-webkit-scrollbar-thumb{background:#bbb;border-radius:16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: LibIconsComponent, selector: "lib-icon", inputs: ["iconName", "iconColor", "iconSize", "iconFill"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6725
|
+
], queries: [{ propertyName: "optionTemplate", first: true, predicate: ["optionTemplate"], descendants: true, read: TemplateRef }, { propertyName: "leftButtonTemplate", first: true, predicate: ["leftButtonTemplate"], descendants: true, read: TemplateRef }, { propertyName: "rightButtonTemplate", first: true, predicate: ["rightButtonTemplate"], descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "toggleButton", first: true, predicate: ["toggleButton"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"reusable-combobox input-group\" [class.show]=\"isOpen\" (focusout)=\"onBlurOutside($event)\" >\n @if (leftButtonTemplate) { <ng-container *ngTemplateOutlet=\"leftButtonTemplate\"></ng-container> }\n\n <div class=\"dropdown w-100\">\n <div #toggleButton id=\"toggle-button\" class=\"form-select d-flex align-items-center text-start\" type=\"button\" data-bs-toggle=\"dropdown\"\n data-bs-auto-close=\"outside\" [attr.aria-expanded]=\"isOpen\" [attr.aria-haspopup]=\"true\" [attr.aria-label]=\"placeholder\" [class.disabled]=\"disabled\"\n [class.is-invalid]=\"invalid\" (click)=\"toggleDropdown()\" readonly\n [ngClass]=\"{\n 'rounded-start-0': leftButtonTemplate,\n 'rounded-end-0': rightButtonTemplate,\n }\" >\n <span class=\"w-100 overflow-hidden text-truncate\"> {{ displayValue() }} </span> \n </div>\n\n <div class=\"dropdown-menu p-2 w-100\" [class.show]=\"isOpen\" style=\"max-height: 320px; overflow-y: auto;\" >\n <div class=\"dropdown-search input-group mb-2\">\n <input class=\"form-control form-control-sm\" type=\"search\" [placeholder]=\"searchPlaceholder\" [formControl]=\"searchControl\" aria-label=\"Pesquisar op\u00E7\u00F5es\" (keyup.enter)=\"filterButtonClick.emit(searchControl.value)\" />\n <button class=\"btn btn-sm btn-primary\" type=\"button\" (click)=\"filterButtonClick.emit(searchControl.value)\"> <lib-icon iconName=\"lupa\" iconSize=\"medium-small\" /> </button>\n </div>\n\n @if (multiple && selectedValues?.length) {\n <div class=\"d-flex flex-row gap-2 flex-wrap my-2\">\n <span *ngFor=\"let value of selectedValues; trackBy: trackByFn\" class=\"px-3 badge rounded-pill text-primary bg-primary-subtle\">\n {{ value[customLabel] }} <lib-icon class=\"glb-cursor-pointer\" iconName=\"fechar\" iconSize=\"small\" (click)=\"select(value)\" />\n </span>\n </div>\n }\n\n <!-- Se utilizar o filtro interno utiliza a propriedade de lista filteredItems$, caso contr\u00E1rio usa a pr\u00F3pria list pois ela ser\u00E1 filtrada pelo componente pai -->\n <ng-container *ngIf=\"(innerFilter ? (filteredItems$ | async) : list) as items\">\n @if (items.length === 0) { <div class=\"py-2 px-3 text-muted small\">{{ noResultsText }}</div> }\n\n @if (value !== '' && value !== null) {\n <button type=\"button\" class=\"dropdown-item d-flex align-items-center\" (click)=\"writeValue(null)\">\n <span class=\"fw-bold\">Limpar {{ multiple ? 'op\u00E7\u00F5es selecionadas' : 'op\u00E7\u00E3o selecionada' }}</span>\n </button>\n }\n\n <button *ngFor=\"let item of items; trackBy: trackByFn\" class=\"dropdown-item d-flex align-items-center\" type=\"button\"\n (click)=\"select(item)\" [attr.aria-selected]=\"isSelected(item)\" >\n\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { $implicit: item, selected: isSelected(item) }\"></ng-container>\n }\n @else {\n <div class=\"w-100 original\">\n <div class=\"d-flex justify-content-between\">\n <div>{{ (item[customLabel] ?? item[customValue]) }}</div>\n <small class=\"text-muted\" *ngIf=\"isSelected(item)\">\u2713</small>\n </div>\n </div>\n }\n </button>\n </ng-container>\n </div>\n </div>\n\n @if (rightButtonTemplate) { <ng-container *ngTemplateOutlet=\"rightButtonTemplate\"></ng-container> }\n</div>\n", styles: [".reusable-combobox{position:relative;display:flex;flex-wrap:nowrap;width:100%;max-width:100%}.reusable-combobox #toggle-button{box-sizing:border-box}.reusable-combobox .dropdown-menu{width:100%;box-shadow:0 6px 18px #00000014;border-radius:.5rem}.reusable-combobox .dropdown-item{cursor:pointer;border-radius:6px;transition:all .3s ease}.reusable-combobox .dropdown-item:hover:not(:focus){background-color:#f1f5f9}.reusable-combobox.compact .dropdown-menu{max-height:200px}.bg-primary-subtle{background-color:#d1dfe7!important}::-webkit-scrollbar{width:4px;background:transparent}::-webkit-scrollbar-thumb{background:#bbb;border-radius:16px}.disabled{background-color:#e9ecef!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: LibIconsComponent, selector: "lib-icon", inputs: ["iconName", "iconColor", "iconSize", "iconFill"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6711
6726
|
}
|
|
6712
6727
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: LibComboboxReworkComponent, decorators: [{
|
|
6713
6728
|
type: Component,
|
|
@@ -6722,7 +6737,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
6722
6737
|
useExisting: forwardRef(() => LibComboboxReworkComponent),
|
|
6723
6738
|
multi: true
|
|
6724
6739
|
}
|
|
6725
|
-
], template: "<div class=\"reusable-combobox input-group\" [class.show]=\"isOpen\" (focusout)=\"onBlurOutside($event)\" >\n @if (leftButtonTemplate) { <ng-container *ngTemplateOutlet=\"leftButtonTemplate\"></ng-container> }\n\n <div class=\"dropdown w-100\">\n <div #toggleButton id=\"toggle-button\" class=\"form-select d-flex align-items-center text-start\" type=\"button\" data-bs-toggle=\"dropdown\"\n data-bs-auto-close=\"outside\" [attr.aria-expanded]=\"isOpen\" [attr.aria-haspopup]=\"true\" [attr.aria-label]=\"placeholder\" [class.disabled]=\"disabled\"\n [class.is-invalid]=\"invalid\" (click)=\"toggleDropdown()\" readonly\n [ngClass]=\"{\n 'rounded-start-0': leftButtonTemplate,\n 'rounded-end-0': rightButtonTemplate,\n }\" >\n <span class=\"w-100 overflow-hidden text-truncate\"> {{ displayValue() }} </span> \n </div>\n\n <div class=\"dropdown-menu p-2 w-100\" [class.show]=\"isOpen\" style=\"max-height: 320px; overflow-y: auto;\" >\n <div class=\"dropdown-search input-group mb-2\">\n <input class=\"form-control form-control-sm\" type=\"search\" [placeholder]=\"searchPlaceholder\" [formControl]=\"searchControl\" aria-label=\"Pesquisar op\u00E7\u00F5es\" (keyup.enter)=\"filterButtonClick.emit(searchControl.value)\" />\n <button class=\"btn btn-sm btn-primary\" type=\"button\" (click)=\"filterButtonClick.emit(searchControl.value)\"> <lib-icon iconName=\"lupa\" iconSize=\"medium-small\" /> </button>\n </div>\n\n @if (multiple && selectedValues?.length) {\n <div class=\"d-flex flex-row gap-2 flex-wrap my-2\">\n <span *ngFor=\"let value of selectedValues; trackBy: trackByFn\" class=\"px-3 badge rounded-pill text-primary bg-primary-subtle\">\n {{ value[customLabel] }} <lib-icon class=\"glb-cursor-pointer\" iconName=\"fechar\" iconSize=\"small\" (click)=\"select(value)\" />\n </span>\n </div>\n }\n\n <!-- Se utilizar o filtro interno utiliza a propriedade de lista filteredItems$, caso contr\u00E1rio usa a pr\u00F3pria list pois ela ser\u00E1 filtrada pelo componente pai -->\n <ng-container *ngIf=\"(innerFilter ? (filteredItems$ | async) : list) as items\">\n @if (items.length === 0) { <div class=\"py-2 px-3 text-muted small\">{{ noResultsText }}</div> }\n\n @if (value !== '' && value !== null) {\n <button type=\"button\" class=\"dropdown-item d-flex align-items-center\" (click)=\"writeValue(null)\">\n <span class=\"fw-bold\">Limpar {{ multiple ? 'op\u00E7\u00F5es selecionadas' : 'op\u00E7\u00E3o selecionada' }}</span>\n </button>\n }\n\n <button *ngFor=\"let item of items; trackBy: trackByFn\" class=\"dropdown-item d-flex align-items-center\" type=\"button\"\n (click)=\"select(item)\" [attr.aria-selected]=\"isSelected(item)\" >\n\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { $implicit: item, selected: isSelected(item) }\"></ng-container>\n }\n @else {\n <div class=\"w-100 original\">\n <div class=\"d-flex justify-content-between\">\n <div>{{ (item[customLabel] ?? item[customValue]) }}</div>\n <small class=\"text-muted\" *ngIf=\"isSelected(item)\">\u2713</small>\n </div>\n </div>\n }\n </button>\n </ng-container>\n </div>\n </div>\n\n @if (rightButtonTemplate) { <ng-container *ngTemplateOutlet=\"rightButtonTemplate\"></ng-container> }\n</div>\n", styles: [".reusable-combobox{position:relative;display:flex;flex-wrap:nowrap;width:100%;max-width:100%}.reusable-combobox #toggle-button{box-sizing:border-box}.reusable-combobox .dropdown-menu{width:100%;box-shadow:0 6px 18px #00000014;border-radius:.5rem}.reusable-combobox .dropdown-item{cursor:pointer;border-radius:6px;transition:all .3s ease}.reusable-combobox .dropdown-item:hover:not(:focus){background-color:#f1f5f9}.reusable-combobox.compact .dropdown-menu{max-height:200px}.bg-primary-subtle{background-color:#d1dfe7!important}::-webkit-scrollbar{width:4px;background:transparent}::-webkit-scrollbar-thumb{background:#bbb;border-radius:16px}\n"] }]
|
|
6740
|
+
], template: "<div class=\"reusable-combobox input-group\" [class.show]=\"isOpen\" (focusout)=\"onBlurOutside($event)\" >\n @if (leftButtonTemplate) { <ng-container *ngTemplateOutlet=\"leftButtonTemplate\"></ng-container> }\n\n <div class=\"dropdown w-100\">\n <div #toggleButton id=\"toggle-button\" class=\"form-select d-flex align-items-center text-start\" type=\"button\" data-bs-toggle=\"dropdown\"\n data-bs-auto-close=\"outside\" [attr.aria-expanded]=\"isOpen\" [attr.aria-haspopup]=\"true\" [attr.aria-label]=\"placeholder\" [class.disabled]=\"disabled\"\n [class.is-invalid]=\"invalid\" (click)=\"toggleDropdown()\" readonly\n [ngClass]=\"{\n 'rounded-start-0': leftButtonTemplate,\n 'rounded-end-0': rightButtonTemplate,\n }\" >\n <span class=\"w-100 overflow-hidden text-truncate\"> {{ displayValue() }} </span> \n </div>\n\n <div class=\"dropdown-menu p-2 w-100\" [class.show]=\"isOpen\" style=\"max-height: 320px; overflow-y: auto;\" >\n <div class=\"dropdown-search input-group mb-2\">\n <input class=\"form-control form-control-sm\" type=\"search\" [placeholder]=\"searchPlaceholder\" [formControl]=\"searchControl\" aria-label=\"Pesquisar op\u00E7\u00F5es\" (keyup.enter)=\"filterButtonClick.emit(searchControl.value)\" />\n <button class=\"btn btn-sm btn-primary\" type=\"button\" (click)=\"filterButtonClick.emit(searchControl.value)\"> <lib-icon iconName=\"lupa\" iconSize=\"medium-small\" /> </button>\n </div>\n\n @if (multiple && selectedValues?.length) {\n <div class=\"d-flex flex-row gap-2 flex-wrap my-2\">\n <span *ngFor=\"let value of selectedValues; trackBy: trackByFn\" class=\"px-3 badge rounded-pill text-primary bg-primary-subtle\">\n {{ value[customLabel] }} <lib-icon class=\"glb-cursor-pointer\" iconName=\"fechar\" iconSize=\"small\" (click)=\"select(value)\" />\n </span>\n </div>\n }\n\n <!-- Se utilizar o filtro interno utiliza a propriedade de lista filteredItems$, caso contr\u00E1rio usa a pr\u00F3pria list pois ela ser\u00E1 filtrada pelo componente pai -->\n <ng-container *ngIf=\"(innerFilter ? (filteredItems$ | async) : list) as items\">\n @if (items.length === 0) { <div class=\"py-2 px-3 text-muted small\">{{ noResultsText }}</div> }\n\n @if (value !== '' && value !== null) {\n <button type=\"button\" class=\"dropdown-item d-flex align-items-center\" (click)=\"writeValue(null)\">\n <span class=\"fw-bold\">Limpar {{ multiple ? 'op\u00E7\u00F5es selecionadas' : 'op\u00E7\u00E3o selecionada' }}</span>\n </button>\n }\n\n <button *ngFor=\"let item of items; trackBy: trackByFn\" class=\"dropdown-item d-flex align-items-center\" type=\"button\"\n (click)=\"select(item)\" [attr.aria-selected]=\"isSelected(item)\" >\n\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { $implicit: item, selected: isSelected(item) }\"></ng-container>\n }\n @else {\n <div class=\"w-100 original\">\n <div class=\"d-flex justify-content-between\">\n <div>{{ (item[customLabel] ?? item[customValue]) }}</div>\n <small class=\"text-muted\" *ngIf=\"isSelected(item)\">\u2713</small>\n </div>\n </div>\n }\n </button>\n </ng-container>\n </div>\n </div>\n\n @if (rightButtonTemplate) { <ng-container *ngTemplateOutlet=\"rightButtonTemplate\"></ng-container> }\n</div>\n", styles: [".reusable-combobox{position:relative;display:flex;flex-wrap:nowrap;width:100%;max-width:100%}.reusable-combobox #toggle-button{box-sizing:border-box}.reusable-combobox .dropdown-menu{width:100%;box-shadow:0 6px 18px #00000014;border-radius:.5rem}.reusable-combobox .dropdown-item{cursor:pointer;border-radius:6px;transition:all .3s ease}.reusable-combobox .dropdown-item:hover:not(:focus){background-color:#f1f5f9}.reusable-combobox.compact .dropdown-menu{max-height:200px}.bg-primary-subtle{background-color:#d1dfe7!important}::-webkit-scrollbar{width:4px;background:transparent}::-webkit-scrollbar-thumb{background:#bbb;border-radius:16px}.disabled{background-color:#e9ecef!important}\n"] }]
|
|
6726
6741
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }], propDecorators: { list: [{
|
|
6727
6742
|
type: Input,
|
|
6728
6743
|
args: [{ required: true }]
|