ngx-eiffage-material 0.1.3 → 0.1.5
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.
|
@@ -7,7 +7,7 @@ import { MatIconModule } from '@angular/material/icon';
|
|
|
7
7
|
import * as i2 from '@angular/material/progress-spinner';
|
|
8
8
|
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
9
9
|
import * as i3$1 from '@angular/forms';
|
|
10
|
-
import { FormControl, ReactiveFormsModule, NG_VALUE_ACCESSOR, NgControl, Validators, FormArray, FormGroup, FormBuilder, FormsModule } from '@angular/forms';
|
|
10
|
+
import { FormControl, ReactiveFormsModule, NG_VALUE_ACCESSOR, NgControl, FormGroupDirective, NgForm, Validators, FormArray, FormGroup, FormBuilder, FormsModule } from '@angular/forms';
|
|
11
11
|
import * as i11 from '@angular/common';
|
|
12
12
|
import { CommonModule, DatePipe, isPlatformBrowser, LowerCasePipe } from '@angular/common';
|
|
13
13
|
import * as i2$1 from '@angular/material/chips';
|
|
@@ -597,6 +597,9 @@ class NgxBasicSelect {
|
|
|
597
597
|
* y para no fallar cuando el componente se usa sin formulario.
|
|
598
598
|
*/
|
|
599
599
|
_ngControl = inject(NgControl, { self: true, optional: true });
|
|
600
|
+
/** Formulario contenedor, para saber si ya se intentó enviar (reactive o template-driven). */
|
|
601
|
+
_parentFormGroup = inject(FormGroupDirective, { optional: true });
|
|
602
|
+
_parentForm = inject(NgForm, { optional: true });
|
|
600
603
|
// ─── Inputs ──────────────────────────────────────────────────────────────
|
|
601
604
|
label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
602
605
|
options = input.required(...(ngDevMode ? [{ debugName: "options" }] : []));
|
|
@@ -673,9 +676,15 @@ class NgxBasicSelect {
|
|
|
673
676
|
const count = this.resolvedOptions().filter(o => o.visible).length;
|
|
674
677
|
return this.intl.getSearchResultsCountMessage(count);
|
|
675
678
|
}, ...(ngDevMode ? [{ debugName: "searchAnnouncement" }] : []));
|
|
676
|
-
/**
|
|
679
|
+
/**
|
|
680
|
+
* ErrorStateMatcher que refleja el estado del control del formulario.
|
|
681
|
+
* Replica el criterio por defecto de Material: se muestra el error si el
|
|
682
|
+
* control es inválido y además ha sido tocado O ya se ha enviado el
|
|
683
|
+
* formulario. Sin la parte de `submitted`, al pulsar "Guardar" los campos
|
|
684
|
+
* obligatorios que el usuario no llegó a tocar no se marcaban en rojo.
|
|
685
|
+
*/
|
|
677
686
|
errorStateMatcher = {
|
|
678
|
-
isErrorState: () => !!(this._ngControl?.invalid && this._ngControl?.touched),
|
|
687
|
+
isErrorState: () => !!(this._ngControl?.invalid && (this._ngControl?.touched || this._isParentFormSubmitted())),
|
|
679
688
|
};
|
|
680
689
|
/**
|
|
681
690
|
* Obligatorio si el control del formulario tiene el validador `required`.
|
|
@@ -685,6 +694,10 @@ class NgxBasicSelect {
|
|
|
685
694
|
isRequired() {
|
|
686
695
|
return this._ngControl?.control?.hasValidator(Validators.required) ?? false;
|
|
687
696
|
}
|
|
697
|
+
/** true cuando el formulario contenedor ya ha intentado enviarse. */
|
|
698
|
+
_isParentFormSubmitted() {
|
|
699
|
+
return this._parentFormGroup?.submitted || this._parentForm?.submitted || false;
|
|
700
|
+
}
|
|
688
701
|
constructor() {
|
|
689
702
|
// Auto-registro como CVA (evita el provider NG_VALUE_ACCESSOR y su DI circular).
|
|
690
703
|
if (this._ngControl)
|
|
@@ -3503,6 +3516,9 @@ class NgxPaginatedSelect {
|
|
|
3503
3516
|
_bottomSheet = inject(MatBottomSheet);
|
|
3504
3517
|
/** Se auto-registra como CVA (self/optional para leer validación y no fallar sin form). */
|
|
3505
3518
|
_ngControl = inject(NgControl, { self: true, optional: true });
|
|
3519
|
+
/** Formulario contenedor, para saber si ya se intento enviar (reactive o template-driven). */
|
|
3520
|
+
_parentFormGroup = inject(FormGroupDirective, { optional: true });
|
|
3521
|
+
_parentForm = inject(NgForm, { optional: true });
|
|
3506
3522
|
intl = inject(NgxTablesIntl);
|
|
3507
3523
|
// ─── Inputs ────────────────────────────────────────────────────────────────
|
|
3508
3524
|
/** Label that floats on the form field */
|
|
@@ -3594,8 +3610,12 @@ class NgxPaginatedSelect {
|
|
|
3594
3610
|
remainingChipsCount = computed(() => Math.max(0, this._selectedItems().length - this.maxChipsDisplayed()), ...(ngDevMode ? [{ debugName: "remainingChipsCount" }] : []));
|
|
3595
3611
|
/** ErrorStateMatcher que refleja el estado del control del formulario. */
|
|
3596
3612
|
errorStateMatcher = {
|
|
3597
|
-
isErrorState: () => !!(this._ngControl?.invalid && this._ngControl?.touched),
|
|
3613
|
+
isErrorState: () => !!(this._ngControl?.invalid && (this._ngControl?.touched || this._isParentFormSubmitted())),
|
|
3598
3614
|
};
|
|
3615
|
+
/** true cuando el formulario contenedor ya ha intentado enviarse. */
|
|
3616
|
+
_isParentFormSubmitted() {
|
|
3617
|
+
return this._parentFormGroup?.submitted || this._parentForm?.submitted || false;
|
|
3618
|
+
}
|
|
3599
3619
|
/**
|
|
3600
3620
|
* Obligatorio si el control del formulario tiene el validador `required`.
|
|
3601
3621
|
* Se propaga al input interno para que el mat-form-field pinte el asterisco,
|
|
@@ -3772,7 +3792,7 @@ class NgxPaginatedSelect {
|
|
|
3772
3792
|
this._ngControl?.control?.markAsTouched();
|
|
3773
3793
|
}
|
|
3774
3794
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NgxPaginatedSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3775
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: NgxPaginatedSelect, isStandalone: true, selector: "ngx-paginated-select", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, endpoint: { classPropertyName: "endpoint", publicName: "endpoint", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, displayMode: { classPropertyName: "displayMode", publicName: "displayMode", isSignal: true, isRequired: false, transformFunction: null }, showSearch: { classPropertyName: "showSearch", publicName: "showSearch", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, noResultsMessage: { classPropertyName: "noResultsMessage", publicName: "noResultsMessage", isSignal: true, isRequired: false, transformFunction: null }, confirmLabel: { classPropertyName: "confirmLabel", publicName: "confirmLabel", isSignal: true, isRequired: false, transformFunction: null }, resetLabel: { classPropertyName: "resetLabel", publicName: "resetLabel", isSignal: true, isRequired: false, transformFunction: null }, subscriptSizing: { classPropertyName: "subscriptSizing", publicName: "subscriptSizing", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, optionTemplate: { classPropertyName: "optionTemplate", publicName: "optionTemplate", isSignal: true, isRequired: false, transformFunction: null }, extraFiltersTemplate: { classPropertyName: "extraFiltersTemplate", publicName: "extraFiltersTemplate", isSignal: true, isRequired: false, transformFunction: null }, maxChipsDisplayed: { classPropertyName: "maxChipsDisplayed", publicName: "maxChipsDisplayed", isSignal: true, isRequired: false, transformFunction: null }, chipsDirection: { classPropertyName: "chipsDirection", publicName: "chipsDirection", isSignal: true, isRequired: false, transformFunction: null }, showSelectAll: { classPropertyName: "showSelectAll", publicName: "showSelectAll", isSignal: true, isRequired: false, transformFunction: null }, selectAllLabel: { classPropertyName: "selectAllLabel", publicName: "selectAllLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", selectionChange: "selectionChange" }, ngImport: i0, template: "<!-- \u2500\u2500 Chips mode (multiple + displayMode = 'chips') \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n@if (showChips()) {\n <mat-form-field\n appearance=\"outline\"\n floatLabel=\"always\"\n [subscriptSizing]=\"subscriptSizing()\"\n class=\"ps-trigger\"\n [class.ps-trigger--disabled]=\"isDisabled()\"\n [class.ps-trigger--open]=\"_isOpen()\"\n [class.ps-trigger--row]=\"chipsDirection() === 'row'\"\n (click)=\"openBottomSheet($event)\"\n >\n <mat-label>{{ label() }}</mat-label>\n\n <mat-chip-grid\n #chipGrid\n class=\"ps-trigger__chip-grid\"\n [class.ps-trigger__chip-grid--column]=\"chipsDirection() === 'column'\"\n [disabled]=\"isDisabled()\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n @for (item of displayedChips(); track item[config().valueKey]) {\n <mat-chip-row\n class=\"ps-trigger__chip\"\n [value]=\"item[config().valueKey]\"\n [disabled]=\"isDisabled()\"\n (removed)=\"removeChip(item, $event)\"\n >\n {{ getLabel(item) }}\n <button matChipRemove [disabled]=\"isDisabled()\" (click)=\"$event.stopPropagation()\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip-row>\n }\n </mat-chip-grid>\n\n @if (remainingChipsCount() > 0) {\n <span class=\"ps-trigger__remaining\">+{{ remainingChipsCount() }}</span>\n }\n\n <!-- Hidden input required for mat-chip-grid; tambi\u00E9n da foco de teclado al trigger -->\n <input\n matInput\n [matChipInputFor]=\"chipGrid\"\n class=\"ps-trigger__kbd-input\"\n [required]=\"isRequired()\"\n readonly\n role=\"combobox\"\n [attr.aria-haspopup]=\"'dialog'\"\n [attr.aria-expanded]=\"_isOpen()\"\n [attr.aria-label]=\"label()\"\n (keydown)=\"onTriggerKeydown($event)\"\n />\n\n <div matSuffix class=\"ps-trigger__suffix\">\n @if (clearable() && hasSelection() && !isDisabled()) {\n <button matIconButton matSuffix [attr.aria-label]=\"intl.clearSearchTooltip\" (click)=\"clearSelection($event)\">\n <mat-icon>close</mat-icon>\n </button>\n }\n <mat-icon [class.ps-trigger__arrow--open]=\"_isOpen()\">arrow_drop_down</mat-icon>\n </div>\n\n @if (error()) {\n <mat-error>{{ error() }}</mat-error>\n }\n @if (hint()) {\n <mat-hint>{{ hint() }}</mat-hint>\n }\n </mat-form-field>\n}\n\n<!-- \u2500\u2500 Text mode (single or multiple + displayMode = 'text') \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n@if (!showChips()) {\n <mat-form-field\n appearance=\"outline\"\n floatLabel=\"always\"\n [subscriptSizing]=\"subscriptSizing()\"\n class=\"ps-trigger\"\n [class.ps-trigger--disabled]=\"isDisabled()\"\n [class.ps-trigger--open]=\"_isOpen()\"\n (click)=\"openBottomSheet($event)\"\n >\n <mat-label>{{ label() }}</mat-label>\n\n <input\n matInput\n class=\"ps-trigger__input\"\n [required]=\"isRequired()\"\n readonly\n role=\"combobox\"\n [attr.aria-haspopup]=\"'dialog'\"\n [attr.aria-expanded]=\"_isOpen()\"\n [value]=\"selectedLabel()\"\n [disabled]=\"isDisabled()\"\n [errorStateMatcher]=\"errorStateMatcher\"\n (keydown)=\"onTriggerKeydown($event)\"\n />\n\n <div matSuffix class=\"ps-trigger__suffix\">\n @if (clearable() && hasSelection() && !isDisabled()) {\n <button matIconButton matSuffix [attr.aria-label]=\"intl.clearSearchTooltip\" (click)=\"clearSelection($event)\">\n <mat-icon>close</mat-icon>\n </button>\n }\n <mat-icon [class.ps-trigger__arrow--open]=\"_isOpen()\">arrow_drop_down</mat-icon>\n </div>\n\n @if (error()) {\n <mat-error>{{ error() }}</mat-error>\n }\n @if (hint()) {\n <mat-hint>{{ hint() }}</mat-hint>\n }\n </mat-form-field>\n}\n", styles: [":host{display:block}.ps-trigger{width:100%;cursor:pointer;--mat-form-field-outlined-focus-outline-color: var(--mat-sys-outline);--mat-form-field-outlined-outline-color: var(--mat-sys-outline);--mat-form-field-outlined-hover-outline-color: var(--mat-sys-outline)}.ps-trigger ::ng-deep .mat-mdc-form-field-flex{cursor:pointer}.ps-trigger--open{--mat-form-field-outlined-outline-color: var(--mat-sys-primary);--mat-form-field-outlined-focus-outline-color: var(--mat-sys-primary);--mat-form-field-outlined-hover-outline-color: var(--mat-sys-primary)}.ps-trigger__input{cursor:pointer!important;caret-color:transparent;pointer-events:none}.ps-trigger__kbd-input{width:0;min-width:0;flex:0 0 0;padding:0;margin:0;caret-color:transparent}.ps-trigger__chip-grid{cursor:pointer;min-height:36px}.ps-trigger__chip-grid ::ng-deep .mdc-evolution-chip-set__chips{flex-wrap:nowrap;overflow:hidden;gap:6px}.ps-trigger__chip-grid--column ::ng-deep .mdc-evolution-chip-set__chips{flex-wrap:wrap;overflow:visible}.ps-trigger__chip.mat-mdc-chip{height:30px;border:none!important;background-color:var(--mat-sys-secondary-container)!important;color:var(--mat-sys-on-secondary-container);font:var(--mat-sys-label-large);box-shadow:none!important;--mdc-chip-elevated-container-elevation: none;--mdc-chip-outline-width: 0}.ps-trigger__chip.mat-mdc-chip ::ng-deep .mat-mdc-chip-focus-overlay{display:none}.ps-trigger__suffix{display:flex;align-items:center;gap:0;flex-shrink:0}.ps-trigger__clear{width:28px;height:28px;line-height:28px;opacity:.6}.ps-trigger__clear:hover{opacity:1}.ps-trigger__clear mat-icon{font-size:18px;width:18px;height:18px}.ps-trigger__remaining{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:22px;padding:0 7px;font-size:11px;font-weight:600;font-variant-numeric:tabular-nums;background:var(--mat-sys-surface-container-highest);color:var(--mat-sys-on-surface-variant);margin-left:6px;white-space:nowrap;flex-shrink:0}.ps-trigger .ps-trigger__arrow--open{transform:rotate(180deg);transition:transform .2s ease}.ps-trigger mat-icon:not(.ps-trigger__clear mat-icon){transition:transform .2s ease}.ps-trigger--row ::ng-deep .mat-mdc-form-field-infix{display:flex;align-items:center;flex-wrap:nowrap;overflow:hidden;min-height:56px}.ps-trigger--row .ps-trigger__chip-grid{flex:1 1 auto;min-width:0;min-height:0;overflow:hidden}.ps-trigger--row .ps-trigger__chip-grid ::ng-deep .mdc-evolution-chip-set__chips{min-height:0}.ps-trigger--row .ps-trigger__remaining{flex:0 0 auto}.ps-trigger--disabled{cursor:not-allowed}.ps-trigger--disabled ::ng-deep .mat-mdc-form-field-flex{cursor:not-allowed}.ps-trigger--disabled .ps-trigger__input,.ps-trigger--disabled .ps-trigger__chip,.ps-trigger--disabled .ps-trigger__suffix{opacity:.38}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatBottomSheetModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i2$1.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i2$1.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i2$1.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i2$1.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3795
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: NgxPaginatedSelect, isStandalone: true, selector: "ngx-paginated-select", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, endpoint: { classPropertyName: "endpoint", publicName: "endpoint", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, displayMode: { classPropertyName: "displayMode", publicName: "displayMode", isSignal: true, isRequired: false, transformFunction: null }, showSearch: { classPropertyName: "showSearch", publicName: "showSearch", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, noResultsMessage: { classPropertyName: "noResultsMessage", publicName: "noResultsMessage", isSignal: true, isRequired: false, transformFunction: null }, confirmLabel: { classPropertyName: "confirmLabel", publicName: "confirmLabel", isSignal: true, isRequired: false, transformFunction: null }, resetLabel: { classPropertyName: "resetLabel", publicName: "resetLabel", isSignal: true, isRequired: false, transformFunction: null }, subscriptSizing: { classPropertyName: "subscriptSizing", publicName: "subscriptSizing", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, optionTemplate: { classPropertyName: "optionTemplate", publicName: "optionTemplate", isSignal: true, isRequired: false, transformFunction: null }, extraFiltersTemplate: { classPropertyName: "extraFiltersTemplate", publicName: "extraFiltersTemplate", isSignal: true, isRequired: false, transformFunction: null }, maxChipsDisplayed: { classPropertyName: "maxChipsDisplayed", publicName: "maxChipsDisplayed", isSignal: true, isRequired: false, transformFunction: null }, chipsDirection: { classPropertyName: "chipsDirection", publicName: "chipsDirection", isSignal: true, isRequired: false, transformFunction: null }, showSelectAll: { classPropertyName: "showSelectAll", publicName: "showSelectAll", isSignal: true, isRequired: false, transformFunction: null }, selectAllLabel: { classPropertyName: "selectAllLabel", publicName: "selectAllLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", selectionChange: "selectionChange" }, ngImport: i0, template: "<!-- \u2500\u2500 Chips mode (multiple + displayMode = 'chips') \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n@if (showChips()) {\n <mat-form-field\n appearance=\"outline\"\n floatLabel=\"always\"\n [subscriptSizing]=\"subscriptSizing()\"\n class=\"ps-trigger\"\n [class.ps-trigger--disabled]=\"isDisabled()\"\n [class.ps-trigger--open]=\"_isOpen()\"\n [class.ps-trigger--row]=\"chipsDirection() === 'row'\"\n (click)=\"openBottomSheet($event)\"\n >\n <mat-label>{{ label() }}</mat-label>\n\n <mat-chip-grid\n #chipGrid\n class=\"ps-trigger__chip-grid\"\n [class.ps-trigger__chip-grid--column]=\"chipsDirection() === 'column'\"\n [disabled]=\"isDisabled()\"\n [errorStateMatcher]=\"errorStateMatcher\"\n [required]=\"isRequired()\"\n >\n @for (item of displayedChips(); track item[config().valueKey]) {\n <mat-chip-row\n class=\"ps-trigger__chip\"\n [value]=\"item[config().valueKey]\"\n [disabled]=\"isDisabled()\"\n (removed)=\"removeChip(item, $event)\"\n >\n {{ getLabel(item) }}\n <button matChipRemove [disabled]=\"isDisabled()\" (click)=\"$event.stopPropagation()\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip-row>\n }\n </mat-chip-grid>\n\n @if (remainingChipsCount() > 0) {\n <span class=\"ps-trigger__remaining\">+{{ remainingChipsCount() }}</span>\n }\n\n <!-- Hidden input required for mat-chip-grid; tambi\u00E9n da foco de teclado al trigger -->\n <input\n matInput\n [matChipInputFor]=\"chipGrid\"\n class=\"ps-trigger__kbd-input\"\n [required]=\"isRequired()\"\n readonly\n role=\"combobox\"\n [attr.aria-haspopup]=\"'dialog'\"\n [attr.aria-expanded]=\"_isOpen()\"\n [attr.aria-label]=\"label()\"\n (keydown)=\"onTriggerKeydown($event)\"\n />\n\n <div matSuffix class=\"ps-trigger__suffix\">\n @if (clearable() && hasSelection() && !isDisabled()) {\n <button matIconButton matSuffix [attr.aria-label]=\"intl.clearSearchTooltip\" (click)=\"clearSelection($event)\">\n <mat-icon>close</mat-icon>\n </button>\n }\n <mat-icon [class.ps-trigger__arrow--open]=\"_isOpen()\">arrow_drop_down</mat-icon>\n </div>\n\n @if (error()) {\n <mat-error>{{ error() }}</mat-error>\n }\n @if (hint()) {\n <mat-hint>{{ hint() }}</mat-hint>\n }\n </mat-form-field>\n}\n\n<!-- \u2500\u2500 Text mode (single or multiple + displayMode = 'text') \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n@if (!showChips()) {\n <mat-form-field\n appearance=\"outline\"\n floatLabel=\"always\"\n [subscriptSizing]=\"subscriptSizing()\"\n class=\"ps-trigger\"\n [class.ps-trigger--disabled]=\"isDisabled()\"\n [class.ps-trigger--open]=\"_isOpen()\"\n (click)=\"openBottomSheet($event)\"\n >\n <mat-label>{{ label() }}</mat-label>\n\n <input\n matInput\n class=\"ps-trigger__input\"\n [required]=\"isRequired()\"\n readonly\n role=\"combobox\"\n [attr.aria-haspopup]=\"'dialog'\"\n [attr.aria-expanded]=\"_isOpen()\"\n [value]=\"selectedLabel()\"\n [disabled]=\"isDisabled()\"\n [errorStateMatcher]=\"errorStateMatcher\"\n (keydown)=\"onTriggerKeydown($event)\"\n />\n\n <div matSuffix class=\"ps-trigger__suffix\">\n @if (clearable() && hasSelection() && !isDisabled()) {\n <button matIconButton matSuffix [attr.aria-label]=\"intl.clearSearchTooltip\" (click)=\"clearSelection($event)\">\n <mat-icon>close</mat-icon>\n </button>\n }\n <mat-icon [class.ps-trigger__arrow--open]=\"_isOpen()\">arrow_drop_down</mat-icon>\n </div>\n\n @if (error()) {\n <mat-error>{{ error() }}</mat-error>\n }\n @if (hint()) {\n <mat-hint>{{ hint() }}</mat-hint>\n }\n </mat-form-field>\n}\n", styles: [":host{display:block}.ps-trigger{width:100%;cursor:pointer;--mat-form-field-outlined-focus-outline-color: var(--mat-sys-outline);--mat-form-field-outlined-outline-color: var(--mat-sys-outline);--mat-form-field-outlined-hover-outline-color: var(--mat-sys-outline)}.ps-trigger ::ng-deep .mat-mdc-form-field-flex{cursor:pointer}.ps-trigger--open{--mat-form-field-outlined-outline-color: var(--mat-sys-primary);--mat-form-field-outlined-focus-outline-color: var(--mat-sys-primary);--mat-form-field-outlined-hover-outline-color: var(--mat-sys-primary)}.ps-trigger__input{cursor:pointer!important;caret-color:transparent;pointer-events:none}.ps-trigger__kbd-input{width:0;min-width:0;flex:0 0 0;padding:0;margin:0;caret-color:transparent}.ps-trigger__chip-grid{cursor:pointer;min-height:36px}.ps-trigger__chip-grid ::ng-deep .mdc-evolution-chip-set__chips{flex-wrap:nowrap;overflow:hidden;gap:6px}.ps-trigger__chip-grid--column ::ng-deep .mdc-evolution-chip-set__chips{flex-wrap:wrap;overflow:visible}.ps-trigger__chip.mat-mdc-chip{height:30px;border:none!important;background-color:var(--mat-sys-secondary-container)!important;color:var(--mat-sys-on-secondary-container);font:var(--mat-sys-label-large);box-shadow:none!important;--mdc-chip-elevated-container-elevation: none;--mdc-chip-outline-width: 0}.ps-trigger__chip.mat-mdc-chip ::ng-deep .mat-mdc-chip-focus-overlay{display:none}.ps-trigger__suffix{display:flex;align-items:center;gap:0;flex-shrink:0}.ps-trigger__clear{width:28px;height:28px;line-height:28px;opacity:.6}.ps-trigger__clear:hover{opacity:1}.ps-trigger__clear mat-icon{font-size:18px;width:18px;height:18px}.ps-trigger__remaining{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:22px;padding:0 7px;font-size:11px;font-weight:600;font-variant-numeric:tabular-nums;background:var(--mat-sys-surface-container-highest);color:var(--mat-sys-on-surface-variant);margin-left:6px;white-space:nowrap;flex-shrink:0}.ps-trigger .ps-trigger__arrow--open{transform:rotate(180deg);transition:transform .2s ease}.ps-trigger mat-icon:not(.ps-trigger__clear mat-icon){transition:transform .2s ease}.ps-trigger--row ::ng-deep .mat-mdc-form-field-infix{display:flex;align-items:center;flex-wrap:nowrap;overflow:hidden;min-height:56px}.ps-trigger--row .ps-trigger__chip-grid{flex:1 1 auto;min-width:0;min-height:0;overflow:hidden}.ps-trigger--row .ps-trigger__chip-grid ::ng-deep .mdc-evolution-chip-set__chips{min-height:0}.ps-trigger--row .ps-trigger__remaining{flex:0 0 auto}.ps-trigger--disabled{cursor:not-allowed}.ps-trigger--disabled ::ng-deep .mat-mdc-form-field-flex{cursor:not-allowed}.ps-trigger--disabled .ps-trigger__input,.ps-trigger--disabled .ps-trigger__chip,.ps-trigger--disabled .ps-trigger__suffix{opacity:.38}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatBottomSheetModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i2$1.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i2$1.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i2$1.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i2$1.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3776
3796
|
}
|
|
3777
3797
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NgxPaginatedSelect, decorators: [{
|
|
3778
3798
|
type: Component,
|
|
@@ -3787,7 +3807,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
3787
3807
|
MatInputModule,
|
|
3788
3808
|
MatTooltipModule,
|
|
3789
3809
|
MatProgressSpinnerModule,
|
|
3790
|
-
], template: "<!-- \u2500\u2500 Chips mode (multiple + displayMode = 'chips') \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n@if (showChips()) {\n <mat-form-field\n appearance=\"outline\"\n floatLabel=\"always\"\n [subscriptSizing]=\"subscriptSizing()\"\n class=\"ps-trigger\"\n [class.ps-trigger--disabled]=\"isDisabled()\"\n [class.ps-trigger--open]=\"_isOpen()\"\n [class.ps-trigger--row]=\"chipsDirection() === 'row'\"\n (click)=\"openBottomSheet($event)\"\n >\n <mat-label>{{ label() }}</mat-label>\n\n <mat-chip-grid\n #chipGrid\n class=\"ps-trigger__chip-grid\"\n [class.ps-trigger__chip-grid--column]=\"chipsDirection() === 'column'\"\n [disabled]=\"isDisabled()\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n @for (item of displayedChips(); track item[config().valueKey]) {\n <mat-chip-row\n class=\"ps-trigger__chip\"\n [value]=\"item[config().valueKey]\"\n [disabled]=\"isDisabled()\"\n (removed)=\"removeChip(item, $event)\"\n >\n {{ getLabel(item) }}\n <button matChipRemove [disabled]=\"isDisabled()\" (click)=\"$event.stopPropagation()\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip-row>\n }\n </mat-chip-grid>\n\n @if (remainingChipsCount() > 0) {\n <span class=\"ps-trigger__remaining\">+{{ remainingChipsCount() }}</span>\n }\n\n <!-- Hidden input required for mat-chip-grid; tambi\u00E9n da foco de teclado al trigger -->\n <input\n matInput\n [matChipInputFor]=\"chipGrid\"\n class=\"ps-trigger__kbd-input\"\n [required]=\"isRequired()\"\n readonly\n role=\"combobox\"\n [attr.aria-haspopup]=\"'dialog'\"\n [attr.aria-expanded]=\"_isOpen()\"\n [attr.aria-label]=\"label()\"\n (keydown)=\"onTriggerKeydown($event)\"\n />\n\n <div matSuffix class=\"ps-trigger__suffix\">\n @if (clearable() && hasSelection() && !isDisabled()) {\n <button matIconButton matSuffix [attr.aria-label]=\"intl.clearSearchTooltip\" (click)=\"clearSelection($event)\">\n <mat-icon>close</mat-icon>\n </button>\n }\n <mat-icon [class.ps-trigger__arrow--open]=\"_isOpen()\">arrow_drop_down</mat-icon>\n </div>\n\n @if (error()) {\n <mat-error>{{ error() }}</mat-error>\n }\n @if (hint()) {\n <mat-hint>{{ hint() }}</mat-hint>\n }\n </mat-form-field>\n}\n\n<!-- \u2500\u2500 Text mode (single or multiple + displayMode = 'text') \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n@if (!showChips()) {\n <mat-form-field\n appearance=\"outline\"\n floatLabel=\"always\"\n [subscriptSizing]=\"subscriptSizing()\"\n class=\"ps-trigger\"\n [class.ps-trigger--disabled]=\"isDisabled()\"\n [class.ps-trigger--open]=\"_isOpen()\"\n (click)=\"openBottomSheet($event)\"\n >\n <mat-label>{{ label() }}</mat-label>\n\n <input\n matInput\n class=\"ps-trigger__input\"\n [required]=\"isRequired()\"\n readonly\n role=\"combobox\"\n [attr.aria-haspopup]=\"'dialog'\"\n [attr.aria-expanded]=\"_isOpen()\"\n [value]=\"selectedLabel()\"\n [disabled]=\"isDisabled()\"\n [errorStateMatcher]=\"errorStateMatcher\"\n (keydown)=\"onTriggerKeydown($event)\"\n />\n\n <div matSuffix class=\"ps-trigger__suffix\">\n @if (clearable() && hasSelection() && !isDisabled()) {\n <button matIconButton matSuffix [attr.aria-label]=\"intl.clearSearchTooltip\" (click)=\"clearSelection($event)\">\n <mat-icon>close</mat-icon>\n </button>\n }\n <mat-icon [class.ps-trigger__arrow--open]=\"_isOpen()\">arrow_drop_down</mat-icon>\n </div>\n\n @if (error()) {\n <mat-error>{{ error() }}</mat-error>\n }\n @if (hint()) {\n <mat-hint>{{ hint() }}</mat-hint>\n }\n </mat-form-field>\n}\n", styles: [":host{display:block}.ps-trigger{width:100%;cursor:pointer;--mat-form-field-outlined-focus-outline-color: var(--mat-sys-outline);--mat-form-field-outlined-outline-color: var(--mat-sys-outline);--mat-form-field-outlined-hover-outline-color: var(--mat-sys-outline)}.ps-trigger ::ng-deep .mat-mdc-form-field-flex{cursor:pointer}.ps-trigger--open{--mat-form-field-outlined-outline-color: var(--mat-sys-primary);--mat-form-field-outlined-focus-outline-color: var(--mat-sys-primary);--mat-form-field-outlined-hover-outline-color: var(--mat-sys-primary)}.ps-trigger__input{cursor:pointer!important;caret-color:transparent;pointer-events:none}.ps-trigger__kbd-input{width:0;min-width:0;flex:0 0 0;padding:0;margin:0;caret-color:transparent}.ps-trigger__chip-grid{cursor:pointer;min-height:36px}.ps-trigger__chip-grid ::ng-deep .mdc-evolution-chip-set__chips{flex-wrap:nowrap;overflow:hidden;gap:6px}.ps-trigger__chip-grid--column ::ng-deep .mdc-evolution-chip-set__chips{flex-wrap:wrap;overflow:visible}.ps-trigger__chip.mat-mdc-chip{height:30px;border:none!important;background-color:var(--mat-sys-secondary-container)!important;color:var(--mat-sys-on-secondary-container);font:var(--mat-sys-label-large);box-shadow:none!important;--mdc-chip-elevated-container-elevation: none;--mdc-chip-outline-width: 0}.ps-trigger__chip.mat-mdc-chip ::ng-deep .mat-mdc-chip-focus-overlay{display:none}.ps-trigger__suffix{display:flex;align-items:center;gap:0;flex-shrink:0}.ps-trigger__clear{width:28px;height:28px;line-height:28px;opacity:.6}.ps-trigger__clear:hover{opacity:1}.ps-trigger__clear mat-icon{font-size:18px;width:18px;height:18px}.ps-trigger__remaining{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:22px;padding:0 7px;font-size:11px;font-weight:600;font-variant-numeric:tabular-nums;background:var(--mat-sys-surface-container-highest);color:var(--mat-sys-on-surface-variant);margin-left:6px;white-space:nowrap;flex-shrink:0}.ps-trigger .ps-trigger__arrow--open{transform:rotate(180deg);transition:transform .2s ease}.ps-trigger mat-icon:not(.ps-trigger__clear mat-icon){transition:transform .2s ease}.ps-trigger--row ::ng-deep .mat-mdc-form-field-infix{display:flex;align-items:center;flex-wrap:nowrap;overflow:hidden;min-height:56px}.ps-trigger--row .ps-trigger__chip-grid{flex:1 1 auto;min-width:0;min-height:0;overflow:hidden}.ps-trigger--row .ps-trigger__chip-grid ::ng-deep .mdc-evolution-chip-set__chips{min-height:0}.ps-trigger--row .ps-trigger__remaining{flex:0 0 auto}.ps-trigger--disabled{cursor:not-allowed}.ps-trigger--disabled ::ng-deep .mat-mdc-form-field-flex{cursor:not-allowed}.ps-trigger--disabled .ps-trigger__input,.ps-trigger--disabled .ps-trigger__chip,.ps-trigger--disabled .ps-trigger__suffix{opacity:.38}\n"] }]
|
|
3810
|
+
], template: "<!-- \u2500\u2500 Chips mode (multiple + displayMode = 'chips') \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n@if (showChips()) {\n <mat-form-field\n appearance=\"outline\"\n floatLabel=\"always\"\n [subscriptSizing]=\"subscriptSizing()\"\n class=\"ps-trigger\"\n [class.ps-trigger--disabled]=\"isDisabled()\"\n [class.ps-trigger--open]=\"_isOpen()\"\n [class.ps-trigger--row]=\"chipsDirection() === 'row'\"\n (click)=\"openBottomSheet($event)\"\n >\n <mat-label>{{ label() }}</mat-label>\n\n <mat-chip-grid\n #chipGrid\n class=\"ps-trigger__chip-grid\"\n [class.ps-trigger__chip-grid--column]=\"chipsDirection() === 'column'\"\n [disabled]=\"isDisabled()\"\n [errorStateMatcher]=\"errorStateMatcher\"\n [required]=\"isRequired()\"\n >\n @for (item of displayedChips(); track item[config().valueKey]) {\n <mat-chip-row\n class=\"ps-trigger__chip\"\n [value]=\"item[config().valueKey]\"\n [disabled]=\"isDisabled()\"\n (removed)=\"removeChip(item, $event)\"\n >\n {{ getLabel(item) }}\n <button matChipRemove [disabled]=\"isDisabled()\" (click)=\"$event.stopPropagation()\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip-row>\n }\n </mat-chip-grid>\n\n @if (remainingChipsCount() > 0) {\n <span class=\"ps-trigger__remaining\">+{{ remainingChipsCount() }}</span>\n }\n\n <!-- Hidden input required for mat-chip-grid; tambi\u00E9n da foco de teclado al trigger -->\n <input\n matInput\n [matChipInputFor]=\"chipGrid\"\n class=\"ps-trigger__kbd-input\"\n [required]=\"isRequired()\"\n readonly\n role=\"combobox\"\n [attr.aria-haspopup]=\"'dialog'\"\n [attr.aria-expanded]=\"_isOpen()\"\n [attr.aria-label]=\"label()\"\n (keydown)=\"onTriggerKeydown($event)\"\n />\n\n <div matSuffix class=\"ps-trigger__suffix\">\n @if (clearable() && hasSelection() && !isDisabled()) {\n <button matIconButton matSuffix [attr.aria-label]=\"intl.clearSearchTooltip\" (click)=\"clearSelection($event)\">\n <mat-icon>close</mat-icon>\n </button>\n }\n <mat-icon [class.ps-trigger__arrow--open]=\"_isOpen()\">arrow_drop_down</mat-icon>\n </div>\n\n @if (error()) {\n <mat-error>{{ error() }}</mat-error>\n }\n @if (hint()) {\n <mat-hint>{{ hint() }}</mat-hint>\n }\n </mat-form-field>\n}\n\n<!-- \u2500\u2500 Text mode (single or multiple + displayMode = 'text') \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n@if (!showChips()) {\n <mat-form-field\n appearance=\"outline\"\n floatLabel=\"always\"\n [subscriptSizing]=\"subscriptSizing()\"\n class=\"ps-trigger\"\n [class.ps-trigger--disabled]=\"isDisabled()\"\n [class.ps-trigger--open]=\"_isOpen()\"\n (click)=\"openBottomSheet($event)\"\n >\n <mat-label>{{ label() }}</mat-label>\n\n <input\n matInput\n class=\"ps-trigger__input\"\n [required]=\"isRequired()\"\n readonly\n role=\"combobox\"\n [attr.aria-haspopup]=\"'dialog'\"\n [attr.aria-expanded]=\"_isOpen()\"\n [value]=\"selectedLabel()\"\n [disabled]=\"isDisabled()\"\n [errorStateMatcher]=\"errorStateMatcher\"\n (keydown)=\"onTriggerKeydown($event)\"\n />\n\n <div matSuffix class=\"ps-trigger__suffix\">\n @if (clearable() && hasSelection() && !isDisabled()) {\n <button matIconButton matSuffix [attr.aria-label]=\"intl.clearSearchTooltip\" (click)=\"clearSelection($event)\">\n <mat-icon>close</mat-icon>\n </button>\n }\n <mat-icon [class.ps-trigger__arrow--open]=\"_isOpen()\">arrow_drop_down</mat-icon>\n </div>\n\n @if (error()) {\n <mat-error>{{ error() }}</mat-error>\n }\n @if (hint()) {\n <mat-hint>{{ hint() }}</mat-hint>\n }\n </mat-form-field>\n}\n", styles: [":host{display:block}.ps-trigger{width:100%;cursor:pointer;--mat-form-field-outlined-focus-outline-color: var(--mat-sys-outline);--mat-form-field-outlined-outline-color: var(--mat-sys-outline);--mat-form-field-outlined-hover-outline-color: var(--mat-sys-outline)}.ps-trigger ::ng-deep .mat-mdc-form-field-flex{cursor:pointer}.ps-trigger--open{--mat-form-field-outlined-outline-color: var(--mat-sys-primary);--mat-form-field-outlined-focus-outline-color: var(--mat-sys-primary);--mat-form-field-outlined-hover-outline-color: var(--mat-sys-primary)}.ps-trigger__input{cursor:pointer!important;caret-color:transparent;pointer-events:none}.ps-trigger__kbd-input{width:0;min-width:0;flex:0 0 0;padding:0;margin:0;caret-color:transparent}.ps-trigger__chip-grid{cursor:pointer;min-height:36px}.ps-trigger__chip-grid ::ng-deep .mdc-evolution-chip-set__chips{flex-wrap:nowrap;overflow:hidden;gap:6px}.ps-trigger__chip-grid--column ::ng-deep .mdc-evolution-chip-set__chips{flex-wrap:wrap;overflow:visible}.ps-trigger__chip.mat-mdc-chip{height:30px;border:none!important;background-color:var(--mat-sys-secondary-container)!important;color:var(--mat-sys-on-secondary-container);font:var(--mat-sys-label-large);box-shadow:none!important;--mdc-chip-elevated-container-elevation: none;--mdc-chip-outline-width: 0}.ps-trigger__chip.mat-mdc-chip ::ng-deep .mat-mdc-chip-focus-overlay{display:none}.ps-trigger__suffix{display:flex;align-items:center;gap:0;flex-shrink:0}.ps-trigger__clear{width:28px;height:28px;line-height:28px;opacity:.6}.ps-trigger__clear:hover{opacity:1}.ps-trigger__clear mat-icon{font-size:18px;width:18px;height:18px}.ps-trigger__remaining{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:22px;padding:0 7px;font-size:11px;font-weight:600;font-variant-numeric:tabular-nums;background:var(--mat-sys-surface-container-highest);color:var(--mat-sys-on-surface-variant);margin-left:6px;white-space:nowrap;flex-shrink:0}.ps-trigger .ps-trigger__arrow--open{transform:rotate(180deg);transition:transform .2s ease}.ps-trigger mat-icon:not(.ps-trigger__clear mat-icon){transition:transform .2s ease}.ps-trigger--row ::ng-deep .mat-mdc-form-field-infix{display:flex;align-items:center;flex-wrap:nowrap;overflow:hidden;min-height:56px}.ps-trigger--row .ps-trigger__chip-grid{flex:1 1 auto;min-width:0;min-height:0;overflow:hidden}.ps-trigger--row .ps-trigger__chip-grid ::ng-deep .mdc-evolution-chip-set__chips{min-height:0}.ps-trigger--row .ps-trigger__remaining{flex:0 0 auto}.ps-trigger--disabled{cursor:not-allowed}.ps-trigger--disabled ::ng-deep .mat-mdc-form-field-flex{cursor:not-allowed}.ps-trigger--disabled .ps-trigger__input,.ps-trigger--disabled .ps-trigger__chip,.ps-trigger--disabled .ps-trigger__suffix{opacity:.38}\n"] }]
|
|
3791
3811
|
}], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], endpoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "endpoint", required: true }] }], config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], filters: [{ type: i0.Input, args: [{ isSignal: true, alias: "filters", required: false }] }], selectedItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItems", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], displayMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayMode", required: false }] }], showSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSearch", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], noResultsMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "noResultsMessage", required: false }] }], confirmLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmLabel", required: false }] }], resetLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "resetLabel", required: false }] }], subscriptSizing: [{ type: i0.Input, args: [{ isSignal: true, alias: "subscriptSizing", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], optionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionTemplate", required: false }] }], extraFiltersTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "extraFiltersTemplate", required: false }] }], maxChipsDisplayed: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxChipsDisplayed", required: false }] }], chipsDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "chipsDirection", required: false }] }], showSelectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSelectAll", required: false }] }], selectAllLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAllLabel", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }] } });
|
|
3792
3812
|
|
|
3793
3813
|
class NgxSkeleton {
|