@sumaris-net/ngx-components 2.8.6 → 2.8.8
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.
- package/esm2022/src/app/core/account/new-token.modal.mjs +1 -1
- package/esm2022/src/app/shared/form/field.component.mjs +1 -1
- package/esm2022/src/app/shared/material/boolean/material.boolean.mjs +5 -8
- package/esm2022/src/app/shared/material/chips/material.chips.mjs +11 -5
- package/esm2022/src/app/shared/material/chips/testing/chips.test.mjs +3 -2
- package/esm2022/src/app/social/message/message.form.mjs +1 -1
- package/fesm2022/sumaris-net.ngx-components.mjs +19 -15
- package/fesm2022/sumaris-net.ngx-components.mjs.map +1 -1
- package/package.json +1 -1
- package/src/app/shared/material/boolean/material.boolean.d.ts +1 -1
- package/src/app/shared/material/chips/material.chips.d.ts +3 -1
- package/src/app/shared/material/chips/testing/chips.test.d.ts +1 -0
- package/src/assets/manifest.json +1 -1
|
@@ -5784,12 +5784,9 @@ class MatBooleanField {
|
|
|
5784
5784
|
markForCheck() {
|
|
5785
5785
|
this.cd.markForCheck();
|
|
5786
5786
|
}
|
|
5787
|
-
|
|
5788
|
-
|
|
5789
|
-
return; // Skip
|
|
5790
|
-
event?.preventDefault();
|
|
5787
|
+
clearValue(event) {
|
|
5788
|
+
this.writeValue(null);
|
|
5791
5789
|
event?.stopPropagation();
|
|
5792
|
-
this.formControl.reset(null);
|
|
5793
5790
|
}
|
|
5794
5791
|
onBlur(event) {
|
|
5795
5792
|
// Setup a one-time focus event handler
|
|
@@ -5808,11 +5805,11 @@ class MatBooleanField {
|
|
|
5808
5805
|
window.addEventListener('focus', focusListener, true);
|
|
5809
5806
|
}
|
|
5810
5807
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MatBooleanField, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$2.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
5811
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: MatBooleanField, selector: "mat-boolean-field", inputs: { disabled: "disabled", formControl: "formControl", formControlName: "formControlName", placeholder: "placeholder", floatLabel: "floatLabel", appearance: "appearance", subscriptSizing: "subscriptSizing", readonly: "readonly", required: "required", compact: "compact", style: "style", buttonsColCount: "buttonsColCount", classList: ["class", "classList"], yesLabel: "yesLabel", noLabel: "noLabel", showButtonIcons: "showButtonIcons", yesIcon: "yesIcon", noIcon: "noIcon", clearable: "clearable", labelPosition: "labelPosition", tabindex: "tabindex", showRadio: "showRadio", value: "value" }, outputs: { keyupEnter: "keyup.enter", blurred: "blur" }, providers: [DEFAULT_VALUE_ACCESSOR$4], viewQueries: [{ propertyName: "yesButton", first: true, predicate: ["yesButton"], descendants: true }, { propertyName: "noButton", first: true, predicate: ["noButton"], descendants: true }, { propertyName: "checkboxButton", first: true, predicate: ["checkboxButton"], descendants: true }, { propertyName: "fakeInput", first: true, predicate: ["fakeInput"], descendants: true }], ngImport: i0, template: "@if (readonly) {\n <mat-form-field\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-form-field-disabled {{ classList }}\"\n >\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label>{{ placeholder }}</mat-label>\n }\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input matInput hidden type=\"text\" readonly [placeholder]=\"placeholder\" [formControl]=\"formControl\" />\n <ion-text>\n {{ (value === null ? 'COMMON.EMPTY_OPTION' : value === true ? yesLabel : noLabel) | translate }}\n </ion-text>\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n} @else {\n @switch (style) {\n <!-- Radio -->\n @case ('radio') {\n <mat-form-field\n [floatLabel]=\"showRadio && (!floatLabel || floatLabel === 'auto') ? 'always' : (floatLabel | asFloatLabelType)\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-boolean-field mat-boolean-field-radio {{ classList }}\"\n >\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label [title]=\"placeholder\">\n {{ placeholder }}\n <span [class.cdk-visually-hidden]=\"showRadio\">({{ yesLabel | translate }}/{{ noLabel | translate }})</span>\n </mat-label>\n }\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input\n matInput\n #fakeInput\n type=\"text\"\n readonly=\"true\"\n [formControl]=\"formControl\"\n (focus)=\"onFocusFakeInput($event)\"\n [required]=\"required\"\n [class.cdk-visually-hidden]=\"showRadio\"\n [tabindex]=\"tabindex\"\n />\n\n <!-- radio button -->\n <mat-radio-group\n [class.cdk-visually-hidden]=\"!showRadio\"\n [formControl]=\"formControl\"\n (change)=\"onRadioValueChanged($event)\"\n >\n <mat-radio-button #yesButton [value]=\"true\">\n <span>{{ yesLabel | translate }}</span>\n </mat-radio-button>\n \n <mat-radio-button #noButton [value]=\"false\">\n <span>{{ noLabel | translate }}</span>\n </mat-radio-button>\n </mat-radio-group>\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (clearable) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clear($event)\"\n [hidden]=\"_value | isNil\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n }\n\n <!-- Checkbox -->\n @case ('checkbox') {\n <mat-form-field\n floatLabel=\"always\"\n [appearance]=\"appearance\"\n class=\"mat-boolean-field mat-boolean-field-checkbox {{ classList }}\"\n >\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input\n matInput\n #matInput\n [formControl]=\"formControl\"\n (focus)=\"onFocusFakeInput($event)\"\n [required]=\"required\"\n [class.cdk-visually-hidden]=\"showRadio\"\n [tabindex]=\"tabindex\"\n />\n\n <!-- checkbox, when compact -->\n <mat-checkbox\n #checkboxButton\n [formControl]=\"formControl\"\n (change)=\"onCheckboxValueChanged($event)\"\n [indeterminate]=\"value === null || value === undefined\"\n [class.cdk-visually-hidden]=\"!showRadio\"\n [tabindex]=\"tabindex\"\n [labelPosition]=\"labelPosition\"\n [title]=\"placeholder || ''\"\n >\n {{ placeholder || '' }}\n </mat-checkbox>\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (clearable) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clear($event)\"\n [hidden]=\"_value | isNil\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n }\n\n <!-- Buttons -->\n @case ('button') {\n <mat-form-field\n [floatLabel]=\"'always'\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-boolean-field mat-boolean-field-button {{ classList }}\"\n >\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label [title]=\"placeholder\">{{ placeholder }}</mat-label>\n } @else {\n <mat-label> </mat-label>\n }\n\n <input matInput type=\"text\" hidden [formControl]=\"formControl\" [required]=\"required\" />\n @if (formControl.disabled) {\n <ion-label><i translate>COMMON.EMPTY_OPTION</i></ion-label>\n } @else {\n <div class=\"mat-form-field-buttons\" [style.--buttons-col-count]=\"buttonsColCount\">\n <!-- yes -->\n <ion-button\n class=\"mat-form-field-button\"\n [tabindex]=\"_tabindex\"\n (click)=\"writeValue(true, $event)\"\n (keyup.enter)=\"writeValue(true, $event)\"\n [color]=\"_value === null ? 'tertiary' : _value === true ? 'accent' : 'light'\"\n >\n @if (showButtonIcons && yesIcon; as icon) {\n <ion-icon slot=\"start\" [name]=\"icon\"></ion-icon>\n }\n {{ yesLabel | translate }}\n </ion-button>\n\n <!-- No button -->\n <ion-button\n class=\"mat-form-field-button\"\n [tabindex]=\"_tabindex !== undefined && _tabindex != -1 ? _tabindex + 1 : _tabindex\"\n (click)=\"writeValue(false, $event)\"\n (keyup.enter)=\"writeValue(false, $event)\"\n [color]=\"_value === null ? 'tertiary' : _value === false ? 'accent' : 'light'\"\n >\n @if (showButtonIcons && noIcon; as icon) {\n <ion-icon slot=\"start\" [name]=\"icon\"></ion-icon>\n }\n {{ noLabel | translate }}\n </ion-button>\n </div>\n }\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (clearable) {\n <ion-button\n matSuffix\n fill=\"clear\"\n size=\"small\"\n color=\"medium\"\n tabindex=\"-1\"\n (click)=\"clear($event)\"\n [hidden]=\"_value | isNil\"\n >\n <ion-icon slot=\"icon-only\" name=\"close\"></ion-icon>\n </ion-button>\n }\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n }\n }\n}\n\n<ng-template #matPrefixTemplate>\n <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n<ng-template #matSuffixTemplate>\n <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n", styles: [":host{width:100%}.mat-mdc-form-field .mat-form-field-buttons{width:100%;display:flex;flex-flow:row wrap;justify-content:flex-start;align-items:center}.mat-mdc-form-field .mat-form-field-buttons .mat-form-field-button{--button-padding-end: 4px;--flex-basis: calc(100% / var(--buttons-col-count, 2) - var(--button-padding-end, 0px));flex:0 1 var(--flex-basis);max-width:min(var(--flex-basis),150px);white-space:normal;padding:0 2px;height:var(--mat-mdc-form-field-height)}\n"], dependencies: [{ kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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"], exportAs: ["matInput"] }, { kind: "directive", type: i6.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i6.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "pipe", type: IsNilPipe, name: "isNil" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5808
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: MatBooleanField, selector: "mat-boolean-field", inputs: { disabled: "disabled", formControl: "formControl", formControlName: "formControlName", placeholder: "placeholder", floatLabel: "floatLabel", appearance: "appearance", subscriptSizing: "subscriptSizing", readonly: "readonly", required: "required", compact: "compact", style: "style", buttonsColCount: "buttonsColCount", classList: ["class", "classList"], yesLabel: "yesLabel", noLabel: "noLabel", showButtonIcons: "showButtonIcons", yesIcon: "yesIcon", noIcon: "noIcon", clearable: "clearable", labelPosition: "labelPosition", tabindex: "tabindex", showRadio: "showRadio", value: "value" }, outputs: { keyupEnter: "keyup.enter", blurred: "blur" }, providers: [DEFAULT_VALUE_ACCESSOR$4], viewQueries: [{ propertyName: "yesButton", first: true, predicate: ["yesButton"], descendants: true }, { propertyName: "noButton", first: true, predicate: ["noButton"], descendants: true }, { propertyName: "checkboxButton", first: true, predicate: ["checkboxButton"], descendants: true }, { propertyName: "fakeInput", first: true, predicate: ["fakeInput"], descendants: true }], ngImport: i0, template: "@if (readonly) {\n <mat-form-field\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-form-field-disabled {{ classList }}\"\n >\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label>{{ placeholder }}</mat-label>\n }\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input matInput hidden type=\"text\" readonly [placeholder]=\"placeholder\" [formControl]=\"formControl\" />\n <ion-text>\n {{ (value === null ? 'COMMON.EMPTY_OPTION' : value === true ? yesLabel : noLabel) | translate }}\n </ion-text>\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n} @else {\n @switch (style) {\n <!-- Radio -->\n @case ('radio') {\n <mat-form-field\n [floatLabel]=\"showRadio && (!floatLabel || floatLabel === 'auto') ? 'always' : (floatLabel | asFloatLabelType)\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-boolean-field mat-boolean-field-radio {{ classList }}\"\n >\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label [title]=\"placeholder\">\n {{ placeholder }}\n <span [class.cdk-visually-hidden]=\"showRadio\">({{ yesLabel | translate }}/{{ noLabel | translate }})</span>\n </mat-label>\n }\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input\n matInput\n #fakeInput\n type=\"text\"\n readonly=\"true\"\n [formControl]=\"formControl\"\n (focus)=\"onFocusFakeInput($event)\"\n [required]=\"required\"\n [class.cdk-visually-hidden]=\"showRadio\"\n [tabindex]=\"tabindex\"\n />\n\n <!-- radio button -->\n <mat-radio-group\n [class.cdk-visually-hidden]=\"!showRadio\"\n [formControl]=\"formControl\"\n (change)=\"onRadioValueChanged($event)\"\n >\n <mat-radio-button #yesButton [value]=\"true\">\n <span>{{ yesLabel | translate }}</span>\n </mat-radio-button>\n \n <mat-radio-button #noButton [value]=\"false\">\n <span>{{ noLabel | translate }}</span>\n </mat-radio-button>\n </mat-radio-group>\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (clearable) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clearValue($event)\"\n [hidden]=\"_value | isNil\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n }\n\n <!-- Checkbox -->\n @case ('checkbox') {\n <mat-form-field\n floatLabel=\"always\"\n [appearance]=\"appearance\"\n class=\"mat-boolean-field mat-boolean-field-checkbox {{ classList }}\"\n >\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input\n matInput\n #matInput\n [formControl]=\"formControl\"\n (focus)=\"onFocusFakeInput($event)\"\n [required]=\"required\"\n [class.cdk-visually-hidden]=\"showRadio\"\n [tabindex]=\"tabindex\"\n />\n\n <!-- checkbox, when compact -->\n <mat-checkbox\n #checkboxButton\n [formControl]=\"formControl\"\n (change)=\"onCheckboxValueChanged($event)\"\n [indeterminate]=\"value === null || value === undefined\"\n [class.cdk-visually-hidden]=\"!showRadio\"\n [tabindex]=\"tabindex\"\n [labelPosition]=\"labelPosition\"\n [title]=\"placeholder || ''\"\n >\n {{ placeholder || '' }}\n </mat-checkbox>\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (clearable) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clearValue($event)\"\n [hidden]=\"_value | isNil\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n }\n\n <!-- Buttons -->\n @case ('button') {\n <mat-form-field\n [floatLabel]=\"'always'\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-boolean-field mat-boolean-field-button {{ classList }}\"\n >\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label [title]=\"placeholder\">{{ placeholder }}</mat-label>\n } @else {\n <mat-label> </mat-label>\n }\n\n <input matInput type=\"text\" hidden [formControl]=\"formControl\" [required]=\"required\" />\n @if (formControl.disabled) {\n <ion-label><i translate>COMMON.EMPTY_OPTION</i></ion-label>\n } @else {\n <div class=\"mat-form-field-buttons\" [style.--buttons-col-count]=\"buttonsColCount\">\n <!-- yes -->\n <ion-button\n class=\"mat-form-field-button\"\n [tabindex]=\"_tabindex\"\n (click)=\"writeValue(true, $event)\"\n (keyup.enter)=\"writeValue(true, $event)\"\n [color]=\"_value === null ? 'tertiary' : _value === true ? 'accent' : 'light'\"\n >\n @if (showButtonIcons && yesIcon; as icon) {\n <ion-icon slot=\"start\" [name]=\"icon\"></ion-icon>\n }\n {{ yesLabel | translate }}\n </ion-button>\n\n <!-- No button -->\n <ion-button\n class=\"mat-form-field-button\"\n [tabindex]=\"_tabindex !== undefined && _tabindex != -1 ? _tabindex + 1 : _tabindex\"\n (click)=\"writeValue(false, $event)\"\n (keyup.enter)=\"writeValue(false, $event)\"\n [color]=\"_value === null ? 'tertiary' : _value === false ? 'accent' : 'light'\"\n >\n @if (showButtonIcons && noIcon; as icon) {\n <ion-icon slot=\"start\" [name]=\"icon\"></ion-icon>\n }\n {{ noLabel | translate }}\n </ion-button>\n </div>\n }\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (clearable) {\n <ion-button\n matSuffix\n fill=\"clear\"\n size=\"small\"\n color=\"medium\"\n tabindex=\"-1\"\n (click)=\"clearValue($event)\"\n [hidden]=\"_value | isNil\"\n >\n <ion-icon slot=\"icon-only\" name=\"close\"></ion-icon>\n </ion-button>\n }\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n }\n }\n}\n\n<ng-template #matPrefixTemplate>\n <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n<ng-template #matSuffixTemplate>\n <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n", styles: [":host{width:100%}.mat-mdc-form-field .mat-form-field-buttons{width:100%;display:flex;flex-flow:row wrap;justify-content:flex-start;align-items:center}.mat-mdc-form-field .mat-form-field-buttons .mat-form-field-button{--button-padding-end: 4px;--flex-basis: calc(100% / var(--buttons-col-count, 2) - var(--button-padding-end, 0px));flex:0 1 var(--flex-basis);max-width:min(var(--flex-basis),150px);white-space:normal;padding:0 2px;height:var(--mat-mdc-form-field-height)}\n"], dependencies: [{ kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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"], exportAs: ["matInput"] }, { kind: "directive", type: i6.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i6.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "pipe", type: IsNilPipe, name: "isNil" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5812
5809
|
}
|
|
5813
5810
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MatBooleanField, decorators: [{
|
|
5814
5811
|
type: Component,
|
|
5815
|
-
args: [{ selector: 'mat-boolean-field', providers: [DEFAULT_VALUE_ACCESSOR$4], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (readonly) {\n <mat-form-field\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-form-field-disabled {{ classList }}\"\n >\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label>{{ placeholder }}</mat-label>\n }\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input matInput hidden type=\"text\" readonly [placeholder]=\"placeholder\" [formControl]=\"formControl\" />\n <ion-text>\n {{ (value === null ? 'COMMON.EMPTY_OPTION' : value === true ? yesLabel : noLabel) | translate }}\n </ion-text>\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n} @else {\n @switch (style) {\n <!-- Radio -->\n @case ('radio') {\n <mat-form-field\n [floatLabel]=\"showRadio && (!floatLabel || floatLabel === 'auto') ? 'always' : (floatLabel | asFloatLabelType)\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-boolean-field mat-boolean-field-radio {{ classList }}\"\n >\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label [title]=\"placeholder\">\n {{ placeholder }}\n <span [class.cdk-visually-hidden]=\"showRadio\">({{ yesLabel | translate }}/{{ noLabel | translate }})</span>\n </mat-label>\n }\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input\n matInput\n #fakeInput\n type=\"text\"\n readonly=\"true\"\n [formControl]=\"formControl\"\n (focus)=\"onFocusFakeInput($event)\"\n [required]=\"required\"\n [class.cdk-visually-hidden]=\"showRadio\"\n [tabindex]=\"tabindex\"\n />\n\n <!-- radio button -->\n <mat-radio-group\n [class.cdk-visually-hidden]=\"!showRadio\"\n [formControl]=\"formControl\"\n (change)=\"onRadioValueChanged($event)\"\n >\n <mat-radio-button #yesButton [value]=\"true\">\n <span>{{ yesLabel | translate }}</span>\n </mat-radio-button>\n \n <mat-radio-button #noButton [value]=\"false\">\n <span>{{ noLabel | translate }}</span>\n </mat-radio-button>\n </mat-radio-group>\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (clearable) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"
|
|
5812
|
+
args: [{ selector: 'mat-boolean-field', providers: [DEFAULT_VALUE_ACCESSOR$4], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (readonly) {\n <mat-form-field\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-form-field-disabled {{ classList }}\"\n >\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label>{{ placeholder }}</mat-label>\n }\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input matInput hidden type=\"text\" readonly [placeholder]=\"placeholder\" [formControl]=\"formControl\" />\n <ion-text>\n {{ (value === null ? 'COMMON.EMPTY_OPTION' : value === true ? yesLabel : noLabel) | translate }}\n </ion-text>\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n} @else {\n @switch (style) {\n <!-- Radio -->\n @case ('radio') {\n <mat-form-field\n [floatLabel]=\"showRadio && (!floatLabel || floatLabel === 'auto') ? 'always' : (floatLabel | asFloatLabelType)\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-boolean-field mat-boolean-field-radio {{ classList }}\"\n >\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label [title]=\"placeholder\">\n {{ placeholder }}\n <span [class.cdk-visually-hidden]=\"showRadio\">({{ yesLabel | translate }}/{{ noLabel | translate }})</span>\n </mat-label>\n }\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input\n matInput\n #fakeInput\n type=\"text\"\n readonly=\"true\"\n [formControl]=\"formControl\"\n (focus)=\"onFocusFakeInput($event)\"\n [required]=\"required\"\n [class.cdk-visually-hidden]=\"showRadio\"\n [tabindex]=\"tabindex\"\n />\n\n <!-- radio button -->\n <mat-radio-group\n [class.cdk-visually-hidden]=\"!showRadio\"\n [formControl]=\"formControl\"\n (change)=\"onRadioValueChanged($event)\"\n >\n <mat-radio-button #yesButton [value]=\"true\">\n <span>{{ yesLabel | translate }}</span>\n </mat-radio-button>\n \n <mat-radio-button #noButton [value]=\"false\">\n <span>{{ noLabel | translate }}</span>\n </mat-radio-button>\n </mat-radio-group>\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (clearable) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clearValue($event)\"\n [hidden]=\"_value | isNil\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n }\n\n <!-- Checkbox -->\n @case ('checkbox') {\n <mat-form-field\n floatLabel=\"always\"\n [appearance]=\"appearance\"\n class=\"mat-boolean-field mat-boolean-field-checkbox {{ classList }}\"\n >\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n <input\n matInput\n #matInput\n [formControl]=\"formControl\"\n (focus)=\"onFocusFakeInput($event)\"\n [required]=\"required\"\n [class.cdk-visually-hidden]=\"showRadio\"\n [tabindex]=\"tabindex\"\n />\n\n <!-- checkbox, when compact -->\n <mat-checkbox\n #checkboxButton\n [formControl]=\"formControl\"\n (change)=\"onCheckboxValueChanged($event)\"\n [indeterminate]=\"value === null || value === undefined\"\n [class.cdk-visually-hidden]=\"!showRadio\"\n [tabindex]=\"tabindex\"\n [labelPosition]=\"labelPosition\"\n [title]=\"placeholder || ''\"\n >\n {{ placeholder || '' }}\n </mat-checkbox>\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (clearable) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clearValue($event)\"\n [hidden]=\"_value | isNil\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n }\n\n <!-- Buttons -->\n @case ('button') {\n <mat-form-field\n [floatLabel]=\"'always'\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"mat-boolean-field mat-boolean-field-button {{ classList }}\"\n >\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label [title]=\"placeholder\">{{ placeholder }}</mat-label>\n } @else {\n <mat-label> </mat-label>\n }\n\n <input matInput type=\"text\" hidden [formControl]=\"formControl\" [required]=\"required\" />\n @if (formControl.disabled) {\n <ion-label><i translate>COMMON.EMPTY_OPTION</i></ion-label>\n } @else {\n <div class=\"mat-form-field-buttons\" [style.--buttons-col-count]=\"buttonsColCount\">\n <!-- yes -->\n <ion-button\n class=\"mat-form-field-button\"\n [tabindex]=\"_tabindex\"\n (click)=\"writeValue(true, $event)\"\n (keyup.enter)=\"writeValue(true, $event)\"\n [color]=\"_value === null ? 'tertiary' : _value === true ? 'accent' : 'light'\"\n >\n @if (showButtonIcons && yesIcon; as icon) {\n <ion-icon slot=\"start\" [name]=\"icon\"></ion-icon>\n }\n {{ yesLabel | translate }}\n </ion-button>\n\n <!-- No button -->\n <ion-button\n class=\"mat-form-field-button\"\n [tabindex]=\"_tabindex !== undefined && _tabindex != -1 ? _tabindex + 1 : _tabindex\"\n (click)=\"writeValue(false, $event)\"\n (keyup.enter)=\"writeValue(false, $event)\"\n [color]=\"_value === null ? 'tertiary' : _value === false ? 'accent' : 'light'\"\n >\n @if (showButtonIcons && noIcon; as icon) {\n <ion-icon slot=\"start\" [name]=\"icon\"></ion-icon>\n }\n {{ noLabel | translate }}\n </ion-button>\n </div>\n }\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (clearable) {\n <ion-button\n matSuffix\n fill=\"clear\"\n size=\"small\"\n color=\"medium\"\n tabindex=\"-1\"\n (click)=\"clearValue($event)\"\n [hidden]=\"_value | isNil\"\n >\n <ion-icon slot=\"icon-only\" name=\"close\"></ion-icon>\n </ion-button>\n }\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n </mat-form-field>\n }\n }\n}\n\n<ng-template #matPrefixTemplate>\n <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n<ng-template #matSuffixTemplate>\n <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n", styles: [":host{width:100%}.mat-mdc-form-field .mat-form-field-buttons{width:100%;display:flex;flex-flow:row wrap;justify-content:flex-start;align-items:center}.mat-mdc-form-field .mat-form-field-buttons .mat-form-field-button{--button-padding-end: 4px;--flex-basis: calc(100% / var(--buttons-col-count, 2) - var(--button-padding-end, 0px));flex:0 1 var(--flex-basis);max-width:min(var(--flex-basis),150px);white-space:normal;padding:0 2px;height:var(--mat-mdc-form-field-height)}\n"] }]
|
|
5816
5813
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$2.FormGroupDirective, decorators: [{
|
|
5817
5814
|
type: Optional
|
|
5818
5815
|
}] }], propDecorators: { yesButton: [{
|
|
@@ -9742,6 +9739,8 @@ class MatChipsField {
|
|
|
9742
9739
|
showLoadingSpinner = true;
|
|
9743
9740
|
chipColor;
|
|
9744
9741
|
debug = false;
|
|
9742
|
+
dropButtonTitle;
|
|
9743
|
+
clearButtonTitle;
|
|
9745
9744
|
clicked = new EventEmitter();
|
|
9746
9745
|
blurred = new EventEmitter();
|
|
9747
9746
|
focused = new EventEmitter();
|
|
@@ -9862,7 +9861,7 @@ class MatChipsField {
|
|
|
9862
9861
|
// - ese => auto size
|
|
9863
9862
|
this.displayAttributes.map((attr) => attr && (attr.endsWith('label') ? 3 : attr.endsWith('rankOrder') ? 2 : undefined));
|
|
9864
9863
|
this.displayColumnNames = this.displayAttributes.map((attr, index) => (this.displayColumnNames && this.displayColumnNames[index]) || this.i18nPrefix + changeCaseToUnderscore(attr).toUpperCase());
|
|
9865
|
-
this.mobile = toBoolean(this.mobile,
|
|
9864
|
+
this.mobile = toBoolean(this.mobile, this.config.mobile);
|
|
9866
9865
|
this.equals = this.equals || MatAutocompleteFieldUtils.defaultEquals;
|
|
9867
9866
|
const classList = this.classList?.split(' ');
|
|
9868
9867
|
this.panelWidth =
|
|
@@ -10272,13 +10271,13 @@ class MatChipsField {
|
|
|
10272
10271
|
}
|
|
10273
10272
|
}
|
|
10274
10273
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MatChipsField, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
10275
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: MatChipsField, selector: "mat-chips-field", inputs: { equals: "equals", logPrefix: "logPrefix", formControl: "formControl", formControlName: "formControlName", floatLabel: "floatLabel", appearance: "appearance", subscriptSizing: "subscriptSizing", placeholder: "placeholder", suggestFn: "suggestFn", required: "required", mobile: "mobile", readonly: "readonly", clearable: "clearable", debounceTime: "debounceTime", displayWith: "displayWith", displayAttributes: "displayAttributes", displayColumnSizes: "displayColumnSizes", displayColumnNames: "displayColumnNames", highlightAccent: "highlightAccent", showAllOnFocus: "showAllOnFocus", showPanelOnFocus: "showPanelOnFocus", autofocus: "autofocus", config: "config", i18nPrefix: "i18nPrefix", noResultMessage: "noResultMessage", classList: ["class", "classList"], panelWidth: "panelWidth", matAutocompletePosition: "matAutocompletePosition", itemSize: "itemSize", fetchMoreThreshold: "fetchMoreThreshold", suggestLengthThreshold: "suggestLengthThreshold", showLoadingSpinner: "showLoadingSpinner", chipColor: "chipColor", debug: "debug", filter: "filter", tabindex: "tabindex", items: "items" }, outputs: { clicked: "click", blurred: "blur", focused: "focus", dropButtonClick: "dropButtonClick", keydownEscape: "keydown.escape", keyupEnter: "keyup.enter" }, providers: [
|
|
10274
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: MatChipsField, selector: "mat-chips-field", inputs: { equals: "equals", logPrefix: "logPrefix", formControl: "formControl", formControlName: "formControlName", floatLabel: "floatLabel", appearance: "appearance", subscriptSizing: "subscriptSizing", placeholder: "placeholder", suggestFn: "suggestFn", required: "required", mobile: "mobile", readonly: "readonly", clearable: "clearable", debounceTime: "debounceTime", displayWith: "displayWith", displayAttributes: "displayAttributes", displayColumnSizes: "displayColumnSizes", displayColumnNames: "displayColumnNames", highlightAccent: "highlightAccent", showAllOnFocus: "showAllOnFocus", showPanelOnFocus: "showPanelOnFocus", autofocus: "autofocus", config: "config", i18nPrefix: "i18nPrefix", noResultMessage: "noResultMessage", classList: ["class", "classList"], panelWidth: "panelWidth", matAutocompletePosition: "matAutocompletePosition", itemSize: "itemSize", fetchMoreThreshold: "fetchMoreThreshold", suggestLengthThreshold: "suggestLengthThreshold", showLoadingSpinner: "showLoadingSpinner", chipColor: "chipColor", debug: "debug", dropButtonTitle: "dropButtonTitle", clearButtonTitle: "clearButtonTitle", filter: "filter", tabindex: "tabindex", items: "items" }, outputs: { clicked: "click", blurred: "blur", focused: "focus", dropButtonClick: "dropButtonClick", keydownEscape: "keydown.escape", keyupEnter: "keyup.enter" }, providers: [
|
|
10276
10275
|
{
|
|
10277
10276
|
provide: NG_VALUE_ACCESSOR,
|
|
10278
10277
|
multi: true,
|
|
10279
10278
|
useExisting: forwardRef(() => MatChipsField),
|
|
10280
10279
|
},
|
|
10281
|
-
], viewQueries: [{ propertyName: "matInputText", first: true, predicate: ["matInputText"], descendants: true }, { propertyName: "autocomplete", first: true, predicate: MatAutocomplete, descendants: true }, { propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], ngImport: i0, template: "<ion-grid class=\"ion-no-padding\">\n <ion-row>\n <ion-col class=\"ion-no-padding\">\n <mat-form-field\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"material-chips\"\n [class.mat-form-field-disabled]=\"disabled\"\n >\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label>{{ placeholder }}</mat-label>\n }\n <mat-chip-grid #chipList (focus)=\"filterChipsFocusEvent($event)\">\n @for (item of value; track item) {\n <mat-chip-row\n class=\"ion-no-margin\"\n [removable]=\"!disabled\"\n (removed)=\"remove(item)\"\n [color]=\"chipColor\"\n [highlighted]=\"true\"\n >\n {{ item | toString: displayWith }}\n @if (enabled) {\n <mat-icon matChipRemove>cancel</mat-icon>\n }\n </mat-chip-row>\n }\n\n <input\n #matInputText\n type=\"text\"\n [matAutocomplete]=\"autocomplete\"\n [matAutocompletePosition]=\"matAutocompletePosition\"\n [formControl]=\"inputControl\"\n [appAutofocus]=\"autofocus\"\n [tabindex]=\"_tabindex\"\n [readonly]=\"disabled\"\n [hidden]=\"disabled\"\n [required]=\"required\"\n [required]=\"required\"\n (click)=\"clicked.emit($event)\"\n (focus)=\"filterInputTextFocusEvent($event)\"\n (blur)=\"filterInputTextBlurEvent($event)\"\n (keydown.escape)=\"keydownEscape.emit($event)\"\n (keyup.enter)=\"keyupEnter.emit($event)\"\n (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n [matChipInputFor]=\"chipList\"\n />\n </mat-chip-grid>\n\n <!-- autocomplete -->\n <mat-autocomplete\n #autocomplete=\"matAutocomplete\"\n (optionSelected)=\"add($event)\"\n autoActiveFirstOption\n [displayWith]=\"displayWith\"\n [class]=\"classList\"\n [panelWidth]=\"panelWidth\"\n >\n <!-- Headers -->\n <ion-row class=\"mat-autocomplete-header column ion-no-padding\">\n @for (attr of displayAttributes; track attr; let i = $index) {\n <ion-col [size]=\"displayColumnSizes[i]\">\n <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n </ion-col>\n }\n </ion-row>\n\n <!-- Options -->\n @if ($filteredItems | async; as items) {\n <!-- No item option -->\n @if (items | isEmptyArray) {\n <mat-option class=\"ion-padding text-italic\" disabled>\n <ion-label>\n <i>{{ noResultMessage | translate }}</i>\n </ion-label>\n </mat-option>\n }\n @for (item of items; track item) {\n <mat-option [value]=\"item\" class=\"ion-no-padding\">\n <ion-row [classList]=\"item.classList\">\n @for (path of displayAttributes; track path; let i = $index) {\n <ion-col\n [size]=\"displayColumnSizes[i]\"\n [title]=\"text.innerText\"\n >\n <ion-text>\n <span\n #text\n [innerHTML]=\"\n item\n | propertyGet: path\n | highlight: { search: inputControl.value, withAccent: highlightAccent }\n \"\n ></span>\n </ion-text>\n </ion-col>\n }\n </ion-row>\n </mat-option>\n }\n <!-- More item -->\n @if (_moreItemsCount) {\n <mat-option\n (ngInit)=\"_initAutocompleteInfiniteScroll()\"\n class=\"ion-padding\"\n disabled\n >\n <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n </mat-option>\n }\n } @else {\n @if ((matInputText.value | strLength) >= suggestLengthThreshold) {\n <mat-option\n class=\"ion-padding\"\n disabled\n >\n <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n </mat-option>\n } @else {\n <mat-option class=\"ion-padding text-italic\" disabled>\n <ion-label>\n {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n </ion-label>\n </mat-option>\n }\n }\n\n <!-- Loading spinner -->\n\n <!-- Need more characters -->\n\n <!-- footer -->\n @if (itemCount; as count) {\n <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n <ion-col>\n <ion-text class=\"ion-float-end ion-padding-end\">\n <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n </ion-text>\n </ion-col>\n </ion-row>\n }\n </mat-autocomplete>\n\n <div matSuffix class=\"mat-form-field-suffix-bottom\">\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n <ng-content select=\"[matError]\"></ng-content>\n </mat-form-field>\n </ion-col>\n <ion-col size=\"auto\" class=\"ion-align-self-center\">\n <ng-content select=\"[matAfter]\"></ng-content>\n </ion-col>\n </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"dropButtonClick.emit($event)\"\n [hidden]=\"disabled\"\n >\n <ion-icon name=\"caret-down-outline\"></ion-icon>\n </button>\n @if (clearable) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clearValue($event)\"\n [hidden]=\"disabled || !formControl.value\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n", styles: [":host{width:100%;display:inline-block;position:relative}:host.ion-text-wrap ion-label{white-space:normal!important}button[hidden]{display:none}.mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height: 23px;margin:1px 0 0 8px!important;min-height:calc(31px - .5em)}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action{padding:0 2px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action{padding-right:4px;padding-left:4px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action mat-icon{color:inherit}.mat-mdc-chip.mat-mdc-standard-chip.mat-primary{background-color:var(--ion-color-primary);color:var(--ion-color-primary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-secondary{background-color:var(--ion-color-secondary);color:var(--ion-color-secondary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-tertiary{background-color:var(--ion-color-tertiary);color:var(--ion-color-tertiary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-accent{background-color:var(--ion-color-accent);color:var(--ion-color-accent-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-warning{background-color:var(--ion-color-warning);color:var(--ion-color-warning-contrast)}\n"], dependencies: [{ kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonRow, selector: "ion-row" }, { kind: "component", type: i2$1.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgInitDirective, selector: "[ngInit]", outputs: ["ngInit"] }, { kind: "directive", type: AutofocusDirective, selector: "[autofocus], input[appAutofocus]", inputs: ["appAutofocus", "autofocusDelay"] }, { kind: "component", type: i7.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i7.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i11$1.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i11$1.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i11$1.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i11$1.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: PropertyGetPipe, name: "propertyGet" }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: EmptyArrayPipe, name: "isEmptyArray" }, { kind: "pipe", type: ToStringPipe, name: "toString" }, { kind: "pipe", type: StrLengthPipe, name: "strLength" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10280
|
+
], viewQueries: [{ propertyName: "matInputText", first: true, predicate: ["matInputText"], descendants: true }, { propertyName: "autocomplete", first: true, predicate: MatAutocomplete, descendants: true }, { propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], ngImport: i0, template: "<ion-grid class=\"ion-no-padding\">\n <ion-row>\n <ion-col class=\"ion-no-padding\">\n <mat-form-field\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"material-chips\"\n [class.mat-form-field-disabled]=\"disabled\"\n >\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label>{{ placeholder }}</mat-label>\n }\n <mat-chip-grid #chipList (focus)=\"filterChipsFocusEvent($event)\">\n @for (item of value; track item) {\n <mat-chip-row\n class=\"ion-no-margin\"\n [removable]=\"!disabled\"\n (removed)=\"remove(item)\"\n [color]=\"chipColor\"\n [highlighted]=\"true\"\n >\n {{ item | toString: displayWith }}\n @if (enabled) {\n <mat-icon matChipRemove>cancel</mat-icon>\n }\n </mat-chip-row>\n }\n\n <input\n #matInputText\n type=\"text\"\n [matAutocomplete]=\"autocomplete\"\n [matAutocompletePosition]=\"matAutocompletePosition\"\n [formControl]=\"inputControl\"\n [appAutofocus]=\"autofocus\"\n [tabindex]=\"_tabindex\"\n [readonly]=\"disabled\"\n [hidden]=\"disabled\"\n [required]=\"required\"\n (click)=\"clicked.emit($event)\"\n (focus)=\"filterInputTextFocusEvent($event)\"\n (blur)=\"filterInputTextBlurEvent($event)\"\n (keydown.escape)=\"keydownEscape.emit($event)\"\n (keyup.enter)=\"keyupEnter.emit($event)\"\n (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n [matChipInputFor]=\"chipList\"\n />\n </mat-chip-grid>\n\n <!-- autocomplete -->\n <mat-autocomplete\n #autocomplete=\"matAutocomplete\"\n (optionSelected)=\"add($event)\"\n autoActiveFirstOption\n [displayWith]=\"displayWith\"\n [class]=\"classList\"\n [panelWidth]=\"panelWidth\"\n >\n <!-- Headers -->\n <ion-row class=\"mat-autocomplete-header column ion-no-padding\">\n @for (attr of displayAttributes; track attr; let i = $index) {\n <ion-col [size]=\"displayColumnSizes[i]\">\n <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n </ion-col>\n }\n </ion-row>\n\n <!-- Options -->\n @if ($filteredItems | async; as items) {\n <!-- No item option -->\n @if (items | isEmptyArray) {\n <mat-option class=\"ion-padding text-italic\" disabled>\n <ion-label>\n <i>{{ noResultMessage | translate }}</i>\n </ion-label>\n </mat-option>\n }\n @for (item of items; track item) {\n <mat-option [value]=\"item\" class=\"ion-no-padding\">\n <ion-row [classList]=\"item.classList\">\n @for (path of displayAttributes; track path; let i = $index) {\n <ion-col [size]=\"displayColumnSizes[i]\" [title]=\"text.innerText\">\n <ion-text>\n <span\n #text\n [innerHTML]=\"\n item\n | propertyGet: path\n | highlight: { search: inputControl.value, withAccent: highlightAccent }\n \"\n ></span>\n </ion-text>\n </ion-col>\n }\n </ion-row>\n </mat-option>\n }\n <!-- More item -->\n @if (_moreItemsCount) {\n <mat-option (ngInit)=\"_initAutocompleteInfiniteScroll()\" class=\"ion-padding\" disabled>\n <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n </mat-option>\n }\n } @else {\n <!-- Loading spinner -->\n @if ((matInputText.value | strLength) >= suggestLengthThreshold) {\n <mat-option class=\"ion-padding\" disabled>\n <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n </mat-option>\n } @else {\n <!-- Need more characters -->\n <mat-option class=\"ion-padding text-italic\" disabled>\n <ion-label>\n {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n </ion-label>\n </mat-option>\n }\n }\n\n <!-- footer -->\n @if (itemCount; as count) {\n <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n <ion-col>\n <ion-text class=\"ion-float-end ion-padding-end\">\n <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n </ion-text>\n </ion-col>\n </ion-row>\n }\n </mat-autocomplete>\n\n <div matSuffix class=\"mat-form-field-suffix-bottom\">\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (formControl.hasError('entity')) {\n <mat-error translate>ERROR.FIELD_INVALID</mat-error>\n }\n <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n <!-- Hints -->\n @if (!formControl.invalid) {\n <mat-hint>\n <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n </mat-hint>\n }\n </mat-form-field>\n </ion-col>\n <ion-col size=\"auto\" class=\"ion-align-self-center\">\n <ng-content select=\"[matAfter]\"></ng-content>\n </ion-col>\n </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"dropButtonClick.emit($event)\"\n [hidden]=\"disabled\"\n [title]=\"dropButtonTitle || '' | translate\"\n >\n <mat-icon>{{ mobile ? 'arrow_drop_down' : 'keyboard_arrow_down' }}</mat-icon>\n </button>\n @if (clearable) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clearValue($event)\"\n [hidden]=\"disabled || !formControl.value\"\n [title]=\"clearButtonTitle || '' | translate\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #matErrorTemplate>\n <ng-content select=\"mat-error,[matError]\"></ng-content>\n</ng-template>\n\n<ng-template #matHintTemplate>\n <div class=\"mat-mdc-form-field-hint-wrapper\">\n <ng-content select=\"mat-hint:not([align='end']),[matHint]\"></ng-content>\n <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n <ng-content select=\"mat-hint[align='end']\"></ng-content>\n </div>\n</ng-template>\n", styles: [":host{width:100%;display:inline-block;position:relative}:host.ion-text-wrap ion-label{white-space:normal!important}button[hidden]{display:none}.mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height: 23px;margin:1px 0 0 8px!important;min-height:calc(31px - .5em)}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action{padding:0 2px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action{padding-right:4px;padding-left:4px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action mat-icon{color:inherit}.mat-mdc-chip.mat-mdc-standard-chip.mat-primary{background-color:var(--ion-color-primary);color:var(--ion-color-primary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-secondary{background-color:var(--ion-color-secondary);color:var(--ion-color-secondary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-tertiary{background-color:var(--ion-color-tertiary);color:var(--ion-color-tertiary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-accent{background-color:var(--ion-color-accent);color:var(--ion-color-accent-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-warning{background-color:var(--ion-color-warning);color:var(--ion-color-warning-contrast)}\n"], dependencies: [{ kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonRow, selector: "ion-row" }, { kind: "component", type: i2$1.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgInitDirective, selector: "[ngInit]", outputs: ["ngInit"] }, { kind: "directive", type: AutofocusDirective, selector: "[autofocus], input[appAutofocus]", inputs: ["appAutofocus", "autofocusDelay"] }, { kind: "component", type: i7.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i7.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { 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.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i11$1.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i11$1.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i11$1.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i11$1.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: PropertyGetPipe, name: "propertyGet" }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: EmptyArrayPipe, name: "isEmptyArray" }, { kind: "pipe", type: ToStringPipe, name: "toString" }, { kind: "pipe", type: StrLengthPipe, name: "strLength" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10282
10281
|
}
|
|
10283
10282
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MatChipsField, decorators: [{
|
|
10284
10283
|
type: Component,
|
|
@@ -10288,7 +10287,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
10288
10287
|
multi: true,
|
|
10289
10288
|
useExisting: forwardRef(() => MatChipsField),
|
|
10290
10289
|
},
|
|
10291
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-grid class=\"ion-no-padding\">\n <ion-row>\n <ion-col class=\"ion-no-padding\">\n <mat-form-field\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"material-chips\"\n [class.mat-form-field-disabled]=\"disabled\"\n
|
|
10290
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-grid class=\"ion-no-padding\">\n <ion-row>\n <ion-col class=\"ion-no-padding\">\n <mat-form-field\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"subscriptSizing\"\n class=\"material-chips\"\n [class.mat-form-field-disabled]=\"disabled\"\n >\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n @if (floatLabel !== 'never' && !!placeholder) {\n <mat-label>{{ placeholder }}</mat-label>\n }\n <mat-chip-grid #chipList (focus)=\"filterChipsFocusEvent($event)\">\n @for (item of value; track item) {\n <mat-chip-row\n class=\"ion-no-margin\"\n [removable]=\"!disabled\"\n (removed)=\"remove(item)\"\n [color]=\"chipColor\"\n [highlighted]=\"true\"\n >\n {{ item | toString: displayWith }}\n @if (enabled) {\n <mat-icon matChipRemove>cancel</mat-icon>\n }\n </mat-chip-row>\n }\n\n <input\n #matInputText\n type=\"text\"\n [matAutocomplete]=\"autocomplete\"\n [matAutocompletePosition]=\"matAutocompletePosition\"\n [formControl]=\"inputControl\"\n [appAutofocus]=\"autofocus\"\n [tabindex]=\"_tabindex\"\n [readonly]=\"disabled\"\n [hidden]=\"disabled\"\n [required]=\"required\"\n (click)=\"clicked.emit($event)\"\n (focus)=\"filterInputTextFocusEvent($event)\"\n (blur)=\"filterInputTextBlurEvent($event)\"\n (keydown.escape)=\"keydownEscape.emit($event)\"\n (keyup.enter)=\"keyupEnter.emit($event)\"\n (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n [matChipInputFor]=\"chipList\"\n />\n </mat-chip-grid>\n\n <!-- autocomplete -->\n <mat-autocomplete\n #autocomplete=\"matAutocomplete\"\n (optionSelected)=\"add($event)\"\n autoActiveFirstOption\n [displayWith]=\"displayWith\"\n [class]=\"classList\"\n [panelWidth]=\"panelWidth\"\n >\n <!-- Headers -->\n <ion-row class=\"mat-autocomplete-header column ion-no-padding\">\n @for (attr of displayAttributes; track attr; let i = $index) {\n <ion-col [size]=\"displayColumnSizes[i]\">\n <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n </ion-col>\n }\n </ion-row>\n\n <!-- Options -->\n @if ($filteredItems | async; as items) {\n <!-- No item option -->\n @if (items | isEmptyArray) {\n <mat-option class=\"ion-padding text-italic\" disabled>\n <ion-label>\n <i>{{ noResultMessage | translate }}</i>\n </ion-label>\n </mat-option>\n }\n @for (item of items; track item) {\n <mat-option [value]=\"item\" class=\"ion-no-padding\">\n <ion-row [classList]=\"item.classList\">\n @for (path of displayAttributes; track path; let i = $index) {\n <ion-col [size]=\"displayColumnSizes[i]\" [title]=\"text.innerText\">\n <ion-text>\n <span\n #text\n [innerHTML]=\"\n item\n | propertyGet: path\n | highlight: { search: inputControl.value, withAccent: highlightAccent }\n \"\n ></span>\n </ion-text>\n </ion-col>\n }\n </ion-row>\n </mat-option>\n }\n <!-- More item -->\n @if (_moreItemsCount) {\n <mat-option (ngInit)=\"_initAutocompleteInfiniteScroll()\" class=\"ion-padding\" disabled>\n <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n </mat-option>\n }\n } @else {\n <!-- Loading spinner -->\n @if ((matInputText.value | strLength) >= suggestLengthThreshold) {\n <mat-option class=\"ion-padding\" disabled>\n <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n </mat-option>\n } @else {\n <!-- Need more characters -->\n <mat-option class=\"ion-padding text-italic\" disabled>\n <ion-label>\n {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n </ion-label>\n </mat-option>\n }\n }\n\n <!-- footer -->\n @if (itemCount; as count) {\n <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n <ion-col>\n <ion-text class=\"ion-float-end ion-padding-end\">\n <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n </ion-text>\n </ion-col>\n </ion-row>\n }\n </mat-autocomplete>\n\n <div matSuffix class=\"mat-form-field-suffix-bottom\">\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n\n @if (formControl.hasError('required')) {\n <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n }\n\n @if (formControl.hasError('entity')) {\n <mat-error translate>ERROR.FIELD_INVALID</mat-error>\n }\n <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n <!-- Hints -->\n @if (!formControl.invalid) {\n <mat-hint>\n <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n </mat-hint>\n }\n </mat-form-field>\n </ion-col>\n <ion-col size=\"auto\" class=\"ion-align-self-center\">\n <ng-content select=\"[matAfter]\"></ng-content>\n </ion-col>\n </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"dropButtonClick.emit($event)\"\n [hidden]=\"disabled\"\n [title]=\"dropButtonTitle || '' | translate\"\n >\n <mat-icon>{{ mobile ? 'arrow_drop_down' : 'keyboard_arrow_down' }}</mat-icon>\n </button>\n @if (clearable) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clearValue($event)\"\n [hidden]=\"disabled || !formControl.value\"\n [title]=\"clearButtonTitle || '' | translate\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #matErrorTemplate>\n <ng-content select=\"mat-error,[matError]\"></ng-content>\n</ng-template>\n\n<ng-template #matHintTemplate>\n <div class=\"mat-mdc-form-field-hint-wrapper\">\n <ng-content select=\"mat-hint:not([align='end']),[matHint]\"></ng-content>\n <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n <ng-content select=\"mat-hint[align='end']\"></ng-content>\n </div>\n</ng-template>\n", styles: [":host{width:100%;display:inline-block;position:relative}:host.ion-text-wrap ion-label{white-space:normal!important}button[hidden]{display:none}.mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height: 23px;margin:1px 0 0 8px!important;min-height:calc(31px - .5em)}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action{padding:0 2px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action{padding-right:4px;padding-left:4px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action mat-icon{color:inherit}.mat-mdc-chip.mat-mdc-standard-chip.mat-primary{background-color:var(--ion-color-primary);color:var(--ion-color-primary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-secondary{background-color:var(--ion-color-secondary);color:var(--ion-color-secondary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-tertiary{background-color:var(--ion-color-tertiary);color:var(--ion-color-tertiary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-accent{background-color:var(--ion-color-accent);color:var(--ion-color-accent-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-warning{background-color:var(--ion-color-warning);color:var(--ion-color-warning-contrast)}\n"] }]
|
|
10292
10291
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.FormGroupDirective, decorators: [{
|
|
10293
10292
|
type: Optional
|
|
10294
10293
|
}] }], propDecorators: { equals: [{
|
|
@@ -10360,6 +10359,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
10360
10359
|
type: Input
|
|
10361
10360
|
}], debug: [{
|
|
10362
10361
|
type: Input
|
|
10362
|
+
}], dropButtonTitle: [{
|
|
10363
|
+
type: Input
|
|
10364
|
+
}], clearButtonTitle: [{
|
|
10365
|
+
type: Input
|
|
10363
10366
|
}], clicked: [{
|
|
10364
10367
|
type: Output,
|
|
10365
10368
|
args: ['click']
|
|
@@ -12860,7 +12863,7 @@ class AppFormField {
|
|
|
12860
12863
|
useExisting: forwardRef(() => AppFormField),
|
|
12861
12864
|
multi: true,
|
|
12862
12865
|
},
|
|
12863
|
-
], viewQueries: [{ propertyName: "matInput", first: true, predicate: ["matInput"], descendants: true }, { propertyName: "autocompleteField", first: true, predicate: ["autocompleteField"], descendants: true }], ngImport: i0, template: "<ng-container [ngSwitch]=\"type\">\n <!-- integer -->\n <mat-form-field *ngSwitchCase=\"'integer'\" [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [class]=\"classList\">\n <mat-label *ngIf=\"floatLabel !== 'never' && !!placeholder\">{{ placeholder }}</mat-label>\n <input\n matInput\n #matInput\n type=\"number\"\n autocomplete=\"off\"\n [readonly]=\"readonly\"\n [min]=\"definition.minValue\"\n [max]=\"definition.maxValue\"\n pattern=\"-?[0-9]*\"\n step=\"1\"\n [appAutofocus]=\"autofocus\"\n [placeholder]=\"floatLabel === 'never' && placeholder\"\n (keyup.enter)=\"onKeyupEnter.emit($event)\"\n (keypress)=\"filterNumberInput($event, false)\"\n [formControl]=\"formControl\"\n [required]=\"required\"\n [tabIndex]=\"tabindex\"\n (click)=\"selectInputContent($event)\"\n />\n <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n <mat-error *ngIf=\"formControl.hasError('min')\">\n {{ (compact ? 'ERROR.FIELD_MIN_COMPACT' : 'ERROR.FIELD_MIN') | translate: formControl.errors['min'] }}\n </mat-error>\n <mat-error *ngIf=\"formControl.hasError('max')\">\n {{ (compact ? 'ERROR.FIELD_MAX_COMPACT' : 'ERROR.FIELD_MAX') | translate: formControl.errors['max'] }}\n </mat-error>\n <mat-error *ngIf=\"formControl.hasError('pattern')\">\n {{ 'ERROR.FIELD_NOT_VALID_INTEGER' | translate }}\n </mat-error>\n <mat-error *ngIf=\"formControl.hasError('integer')\">\n {{ 'ERROR.FIELD_NOT_VALID_INTEGER' | translate }}\n </mat-error>\n\n <button\n matSuffix\n *ngIf=\"clearable\"\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"formControl.reset()\"\n [hidden]=\"formControl.disabled || (formControl | formGetValue | isNilOrBlank)\"\n >\n <mat-icon>close</mat-icon>\n </button>\n\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-form-field>\n\n <!-- double -->\n <mat-form-field *ngSwitchCase=\"'double'\" [floatLabel]=\"floatLabel | asFloatLabelType\" [class]=\"classList\">\n <mat-label *ngIf=\"floatLabel !== 'never' && !!placeholder\">{{ placeholder }}</mat-label>\n\n <input\n matInput\n #matInput\n type=\"number\"\n decimal=\"true\"\n autocomplete=\"off\"\n [min]=\"definition.minValue\"\n [max]=\"definition.maxValue\"\n [appAutofocus]=\"autofocus\"\n [readonly]=\"readonly\"\n [placeholder]=\"floatLabel === 'never' && placeholder\"\n [step]=\"numberInputStep\"\n (keypress)=\"filterNumberInput($event, true)\"\n [formControl]=\"formControl\"\n [required]=\"required\"\n [tabIndex]=\"tabindex\"\n (click)=\"selectInputContent($event)\"\n />\n <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n <mat-error *ngIf=\"formControl.hasError('decimal')\" translate>ERROR.FIELD_NOT_VALID_DECIMAL</mat-error>\n <mat-error *ngIf=\"formControl.hasError('min')\">\n {{ (compact ? 'ERROR.FIELD_MIN_COMPACT' : 'ERROR.FIELD_MIN') | translate: formControl.errors['min'] }}\n </mat-error>\n <mat-error *ngIf=\"formControl.hasError('max')\">\n {{ (compact ? 'ERROR.FIELD_MAX_COMPACT' : 'ERROR.FIELD_MAX') | translate: formControl.errors['max'] }}\n </mat-error>\n <mat-error *ngIf=\"formControl.hasError('maxDecimals')\">\n {{\n (compact ? 'ERROR.FIELD_MAXIMUM_DECIMALS_COMPACT' : 'ERROR.FIELD_MAXIMUM_DECIMALS')\n | translate: { maxDecimals: definition.maximumNumberDecimals }\n }}\n </mat-error>\n\n <button\n matSuffix\n *ngIf=\"clearable\"\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"formControl.reset()\"\n [hidden]=\"formControl.disabled || (formControl | formGetValue | isNilOrBlank)\"\n >\n <mat-icon>close</mat-icon>\n </button>\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-form-field>\n\n <!-- boolean -->\n <mat-boolean-field\n *ngSwitchCase=\"'boolean'\"\n #matInput\n [class]=\"classList\"\n [formControl]=\"formControl\"\n [placeholder]=\"placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [appearance]=\"appearance\"\n [required]=\"required\"\n [compact]=\"compact\"\n [tabindex]=\"tabindex\"\n [readonly]=\"readonly\"\n >\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-boolean-field>\n\n <!-- date -->\n <mat-date-field\n *ngSwitchCase=\"'date'\"\n #matInput\n [class]=\"classList\"\n [formControl]=\"formControl\"\n [placeholder]=\"compact ? ('COMMON.DATE_PLACEHOLDER' | translate) : placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [required]=\"required\"\n [clearable]=\"clearable\"\n [readonly]=\"readonly\"\n [compact]=\"compact\"\n [tabindex]=\"tabindex\"\n [autofocus]=\"autofocus\"\n >\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-date-field>\n\n <!-- date time -->\n <mat-date-time-field\n *ngSwitchCase=\"'dateTime'\"\n #matInput\n [class]=\"classList\"\n [formControl]=\"formControl\"\n [placeholder]=\"compact ? ('COMMON.DATE_TIME_PLACEHOLDER' | translate) : placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [required]=\"required\"\n [clearable]=\"clearable\"\n [readonly]=\"readonly\"\n [compact]=\"compact\"\n [tabindex]=\"tabindex\"\n [autofocus]=\"autofocus\"\n >\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-date-time-field>\n\n <!-- enum -->\n <mat-form-field *ngSwitchCase=\"'enum'\"\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [class]=\"classList\">\n <mat-label *ngIf=\"floatLabel !== 'never' && !!placeholder\">{{ placeholder }}</mat-label>\n <mat-select\n [formControl]=\"formControl\"\n [placeholder]=\"floatLabel === 'never' && placeholder\"\n [required]=\"required\"\n [tabindex]=\"tabindex\"\n (keyup.enter)=\"onKeyupEnter.emit($event)\"\n >\n <mat-option *ngFor=\"let item of _values\" [value]=\"item.key\">{{ item.value | translate }}</mat-option>\n </mat-select>\n\n <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-form-field>\n\n <!-- multi enum -->\n <mat-chips-field\n *ngSwitchCase=\"'enums'\"\n [class]=\"classList\"\n [placeholder]=\"placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [formControl]=\"formControl\"\n [clearable]=\"clearable\"\n [items]=\"_values\"\n [displayAttributes]=\"definition.autocomplete?.attributes || ['key', 'value']\"\n [config]=\"definition.autocomplete\"\n [showAllOnFocus]=\"true\"\n [required]=\"required\"\n [chipColor]=\"chipColor | matColor\"\n >\n <ng-content select=\"[matPrefix]\"></ng-content>\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-chips-field>\n\n <!-- color -->\n <mat-form-field *ngSwitchCase=\"'color'\"\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [class]=\"classList\">\n <ion-icon margin-right name=\"color-fill\" matPrefix></ion-icon>\n\n <input\n matInput\n autocomplete=\"off\"\n [appAutofocus]=\"autofocus\"\n [formControl]=\"formControl\"\n [style.color]=\"getColorContrast(formControl.value)\"\n [style.background]=\"formControl.value\"\n [colorPicker]=\"formControl.value\"\n (colorPickerChange)=\"writeValue($event)\"\n [cpSaveClickOutside]=\"true\"\n cpPosition=\"top\"\n cpOutputFormat=\"hex\"\n [cpOKButton]=\"false\"\n [required]=\"required\"\n />\n <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n </mat-form-field>\n\n <!-- string -->\n <mat-form-field *ngSwitchCase=\"'string'\"\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [class]=\"classList\">\n <mat-label *ngIf=\"floatLabel !== 'never' && !!placeholder\">{{ placeholder }}</mat-label>\n <input\n matInput\n #matInput\n autocomplete=\"off\"\n [appAutofocus]=\"autofocus\"\n [formControl]=\"formControl\"\n [placeholder]=\"floatLabel === 'never' && placeholder\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [tabIndex]=\"tabindex\"\n (click)=\"selectInputContent($event)\"\n (keypress)=\"filterAlphanumericalInput($event)\"\n (keyup.enter)=\"onKeyupEnter.emit($event)\"\n />\n <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n\n <button\n matSuffix\n *ngIf=\"clearable\"\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"formControl.reset()\"\n [hidden]=\"formControl.disabled || (formControl | formGetValue | isNilOrBlank)\"\n >\n <mat-icon>close</mat-icon>\n </button>\n\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-form-field>\n\n <!-- auto-complete -->\n <mat-autocomplete-field\n *ngSwitchCase=\"'entity'\"\n #autocompleteField\n [class]=\"classList\"\n [autofocus]=\"autofocus\"\n [placeholder]=\"placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [formControl]=\"formControl\"\n [config]=\"definition.autocomplete\"\n [required]=\"required\"\n [tabindex]=\"tabindex\"\n [clearable]=\"clearable\"\n (keyup.enter)=\"onKeyupEnter.emit($event)\"\n [displayWith]=\"getDisplayValueFn(definition)\"\n >\n <ng-content select=\"[matPrefix]\"></ng-content>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </mat-autocomplete-field>\n\n <!-- multi auto-complete -->\n <mat-chips-field\n *ngSwitchCase=\"'entities'\"\n [class]=\"classList\"\n [placeholder]=\"placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [formControl]=\"formControl\"\n [config]=\"definition.autocomplete\"\n [required]=\"required\"\n [chipColor]=\"chipColor | matColor\"\n [clearable]=\"clearable\"\n [displayWith]=\"getDisplayValueFn(definition)\"\n >\n <ng-content select=\"[matPrefix]\"></ng-content>\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-chips-field>\n\n <!-- other -->\n <div *ngSwitchDefault>\n <mat-error *ngIf=\"type\">\n Unknown type {{ type }} for option {{ definition.key }}. Please report this error.\n </mat-error>\n <mat-error *ngIf=\"!type\">Error on option field. Please check console log for details.</mat-error>\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </div>\n</ng-container>\n", styles: [":host{display:inline-block;position:relative}button[hidden]{display:none}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: i1$2.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$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i5$2.ColorPickerDirective, selector: "[colorPicker]", inputs: ["colorPicker", "cpWidth", "cpHeight", "cpToggle", "cpDisabled", "cpIgnoredElements", "cpFallbackColor", "cpColorMode", "cpCmykEnabled", "cpOutputFormat", "cpAlphaChannel", "cpDisableInput", "cpDialogDisplay", "cpSaveClickOutside", "cpCloseClickOutside", "cpUseRootViewContainer", "cpPosition", "cpPositionOffset", "cpPositionRelativeToArrow", "cpOKButton", "cpOKButtonText", "cpOKButtonClass", "cpCancelButton", "cpCancelButtonText", "cpCancelButtonClass", "cpEyeDropper", "cpPresetLabel", "cpPresetColors", "cpPresetColorsClass", "cpMaxPresetColorsLength", "cpPresetEmptyMessage", "cpPresetEmptyMessageClass", "cpAddColorButton", "cpAddColorButtonText", "cpAddColorButtonClass", "cpRemoveColorButtonClass", "cpArrowPosition", "cpExtraTemplate"], outputs: ["cpInputChange", "cpToggleChange", "cpSliderChange", "cpSliderDragEnd", "cpSliderDragStart", "colorPickerOpen", "colorPickerClose", "colorPickerCancel", "colorPickerSelect", "colorPickerChange", "cpCmykColorChange", "cpPresetColorsChange"], exportAs: ["ngxColorPicker"] }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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"], exportAs: ["matInput"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i13.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: MatAutocompleteField, selector: "mat-autocomplete-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "mobile", "clearable", "debounceTime", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "autofocus", "config", "i18nPrefix", "noResultMessage", "class", "panelWidth", "matAutocompletePosition", "multiple", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "debug", "showSearchBar", "stickySearchBar", "applyImplicitValue", "dropButtonTitle", "clearButtonTitle", "filter", "readonly", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keyup.enter"] }, { kind: "component", type: MatDate, selector: "mat-date-field", inputs: ["mobile", "formControl", "formControlName", "placeholder", "floatLabel", "required", "compact", "autofocus", "startDate", "clearable", "timezone", "datePickerFilter", "appearance", "subscriptSizing", "readonly", "tabindex"] }, { kind: "component", type: MatDateTime, selector: "mat-date-time-field", inputs: ["placeholder", "floatLabel", "mobile", "compact", "autofocus", "startDate", "clearable", "datePickerFilter", "appearance", "subscriptSizing", "formControl", "formControlName", "required", "readonly", "tabindex"] }, { kind: "component", type: MatBooleanField, selector: "mat-boolean-field", inputs: ["disabled", "formControl", "formControlName", "placeholder", "floatLabel", "appearance", "subscriptSizing", "readonly", "required", "compact", "style", "buttonsColCount", "class", "yesLabel", "noLabel", "showButtonIcons", "yesIcon", "noIcon", "clearable", "labelPosition", "tabindex", "showRadio", "value"], outputs: ["keyup.enter", "blur"] }, { kind: "component", type: MatChipsField, selector: "mat-chips-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "mobile", "readonly", "clearable", "debounceTime", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "autofocus", "config", "i18nPrefix", "noResultMessage", "class", "panelWidth", "matAutocompletePosition", "itemSize", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "chipColor", "debug", "filter", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keyup.enter"] }, { kind: "directive", type: AutofocusDirective, selector: "[autofocus], input[appAutofocus]", inputs: ["appAutofocus", "autofocusDelay"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: IsNilOrBlankPipe, name: "isNilOrBlank" }, { kind: "pipe", type: FormGetValuePipe, name: "formGetValue" }, { kind: "pipe", type: MatColorPipe, name: "matColor" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
12866
|
+
], viewQueries: [{ propertyName: "matInput", first: true, predicate: ["matInput"], descendants: true }, { propertyName: "autocompleteField", first: true, predicate: ["autocompleteField"], descendants: true }], ngImport: i0, template: "<ng-container [ngSwitch]=\"type\">\n <!-- integer -->\n <mat-form-field *ngSwitchCase=\"'integer'\" [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [class]=\"classList\">\n <mat-label *ngIf=\"floatLabel !== 'never' && !!placeholder\">{{ placeholder }}</mat-label>\n <input\n matInput\n #matInput\n type=\"number\"\n autocomplete=\"off\"\n [readonly]=\"readonly\"\n [min]=\"definition.minValue\"\n [max]=\"definition.maxValue\"\n pattern=\"-?[0-9]*\"\n step=\"1\"\n [appAutofocus]=\"autofocus\"\n [placeholder]=\"floatLabel === 'never' && placeholder\"\n (keyup.enter)=\"onKeyupEnter.emit($event)\"\n (keypress)=\"filterNumberInput($event, false)\"\n [formControl]=\"formControl\"\n [required]=\"required\"\n [tabIndex]=\"tabindex\"\n (click)=\"selectInputContent($event)\"\n />\n <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n <mat-error *ngIf=\"formControl.hasError('min')\">\n {{ (compact ? 'ERROR.FIELD_MIN_COMPACT' : 'ERROR.FIELD_MIN') | translate: formControl.errors['min'] }}\n </mat-error>\n <mat-error *ngIf=\"formControl.hasError('max')\">\n {{ (compact ? 'ERROR.FIELD_MAX_COMPACT' : 'ERROR.FIELD_MAX') | translate: formControl.errors['max'] }}\n </mat-error>\n <mat-error *ngIf=\"formControl.hasError('pattern')\">\n {{ 'ERROR.FIELD_NOT_VALID_INTEGER' | translate }}\n </mat-error>\n <mat-error *ngIf=\"formControl.hasError('integer')\">\n {{ 'ERROR.FIELD_NOT_VALID_INTEGER' | translate }}\n </mat-error>\n\n <button\n matSuffix\n *ngIf=\"clearable\"\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"formControl.reset()\"\n [hidden]=\"formControl.disabled || (formControl | formGetValue | isNilOrBlank)\"\n >\n <mat-icon>close</mat-icon>\n </button>\n\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-form-field>\n\n <!-- double -->\n <mat-form-field *ngSwitchCase=\"'double'\" [floatLabel]=\"floatLabel | asFloatLabelType\" [class]=\"classList\">\n <mat-label *ngIf=\"floatLabel !== 'never' && !!placeholder\">{{ placeholder }}</mat-label>\n\n <input\n matInput\n #matInput\n type=\"number\"\n decimal=\"true\"\n autocomplete=\"off\"\n [min]=\"definition.minValue\"\n [max]=\"definition.maxValue\"\n [appAutofocus]=\"autofocus\"\n [readonly]=\"readonly\"\n [placeholder]=\"floatLabel === 'never' && placeholder\"\n [step]=\"numberInputStep\"\n (keypress)=\"filterNumberInput($event, true)\"\n [formControl]=\"formControl\"\n [required]=\"required\"\n [tabIndex]=\"tabindex\"\n (click)=\"selectInputContent($event)\"\n />\n <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n <mat-error *ngIf=\"formControl.hasError('decimal')\" translate>ERROR.FIELD_NOT_VALID_DECIMAL</mat-error>\n <mat-error *ngIf=\"formControl.hasError('min')\">\n {{ (compact ? 'ERROR.FIELD_MIN_COMPACT' : 'ERROR.FIELD_MIN') | translate: formControl.errors['min'] }}\n </mat-error>\n <mat-error *ngIf=\"formControl.hasError('max')\">\n {{ (compact ? 'ERROR.FIELD_MAX_COMPACT' : 'ERROR.FIELD_MAX') | translate: formControl.errors['max'] }}\n </mat-error>\n <mat-error *ngIf=\"formControl.hasError('maxDecimals')\">\n {{\n (compact ? 'ERROR.FIELD_MAXIMUM_DECIMALS_COMPACT' : 'ERROR.FIELD_MAXIMUM_DECIMALS')\n | translate: { maxDecimals: definition.maximumNumberDecimals }\n }}\n </mat-error>\n\n <button\n matSuffix\n *ngIf=\"clearable\"\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"formControl.reset()\"\n [hidden]=\"formControl.disabled || (formControl | formGetValue | isNilOrBlank)\"\n >\n <mat-icon>close</mat-icon>\n </button>\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-form-field>\n\n <!-- boolean -->\n <mat-boolean-field\n *ngSwitchCase=\"'boolean'\"\n #matInput\n [class]=\"classList\"\n [formControl]=\"formControl\"\n [placeholder]=\"placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [appearance]=\"appearance\"\n [required]=\"required\"\n [compact]=\"compact\"\n [tabindex]=\"tabindex\"\n [readonly]=\"readonly\"\n >\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-boolean-field>\n\n <!-- date -->\n <mat-date-field\n *ngSwitchCase=\"'date'\"\n #matInput\n [class]=\"classList\"\n [formControl]=\"formControl\"\n [placeholder]=\"compact ? ('COMMON.DATE_PLACEHOLDER' | translate) : placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [required]=\"required\"\n [clearable]=\"clearable\"\n [readonly]=\"readonly\"\n [compact]=\"compact\"\n [tabindex]=\"tabindex\"\n [autofocus]=\"autofocus\"\n >\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-date-field>\n\n <!-- date time -->\n <mat-date-time-field\n *ngSwitchCase=\"'dateTime'\"\n #matInput\n [class]=\"classList\"\n [formControl]=\"formControl\"\n [placeholder]=\"compact ? ('COMMON.DATE_TIME_PLACEHOLDER' | translate) : placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [required]=\"required\"\n [clearable]=\"clearable\"\n [readonly]=\"readonly\"\n [compact]=\"compact\"\n [tabindex]=\"tabindex\"\n [autofocus]=\"autofocus\"\n >\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-date-time-field>\n\n <!-- enum -->\n <mat-form-field *ngSwitchCase=\"'enum'\"\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [class]=\"classList\">\n <mat-label *ngIf=\"floatLabel !== 'never' && !!placeholder\">{{ placeholder }}</mat-label>\n <mat-select\n [formControl]=\"formControl\"\n [placeholder]=\"floatLabel === 'never' && placeholder\"\n [required]=\"required\"\n [tabindex]=\"tabindex\"\n (keyup.enter)=\"onKeyupEnter.emit($event)\"\n >\n <mat-option *ngFor=\"let item of _values\" [value]=\"item.key\">{{ item.value | translate }}</mat-option>\n </mat-select>\n\n <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-form-field>\n\n <!-- multi enum -->\n <mat-chips-field\n *ngSwitchCase=\"'enums'\"\n [class]=\"classList\"\n [placeholder]=\"placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [formControl]=\"formControl\"\n [clearable]=\"clearable\"\n [items]=\"_values\"\n [displayAttributes]=\"definition.autocomplete?.attributes || ['key', 'value']\"\n [config]=\"definition.autocomplete\"\n [showAllOnFocus]=\"true\"\n [required]=\"required\"\n [chipColor]=\"chipColor | matColor\"\n >\n <ng-content select=\"[matPrefix]\"></ng-content>\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-chips-field>\n\n <!-- color -->\n <mat-form-field *ngSwitchCase=\"'color'\"\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [class]=\"classList\">\n <ion-icon margin-right name=\"color-fill\" matPrefix></ion-icon>\n\n <input\n matInput\n autocomplete=\"off\"\n [appAutofocus]=\"autofocus\"\n [formControl]=\"formControl\"\n [style.color]=\"getColorContrast(formControl.value)\"\n [style.background]=\"formControl.value\"\n [colorPicker]=\"formControl.value\"\n (colorPickerChange)=\"writeValue($event)\"\n [cpSaveClickOutside]=\"true\"\n cpPosition=\"top\"\n cpOutputFormat=\"hex\"\n [cpOKButton]=\"false\"\n [required]=\"required\"\n />\n <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n </mat-form-field>\n\n <!-- string -->\n <mat-form-field *ngSwitchCase=\"'string'\"\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [class]=\"classList\">\n <mat-label *ngIf=\"floatLabel !== 'never' && !!placeholder\">{{ placeholder }}</mat-label>\n <input\n matInput\n #matInput\n autocomplete=\"off\"\n [appAutofocus]=\"autofocus\"\n [formControl]=\"formControl\"\n [placeholder]=\"floatLabel === 'never' && placeholder\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [tabIndex]=\"tabindex\"\n (click)=\"selectInputContent($event)\"\n (keypress)=\"filterAlphanumericalInput($event)\"\n (keyup.enter)=\"onKeyupEnter.emit($event)\"\n />\n <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n\n <button\n matSuffix\n *ngIf=\"clearable\"\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"formControl.reset()\"\n [hidden]=\"formControl.disabled || (formControl | formGetValue | isNilOrBlank)\"\n >\n <mat-icon>close</mat-icon>\n </button>\n\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-form-field>\n\n <!-- auto-complete -->\n <mat-autocomplete-field\n *ngSwitchCase=\"'entity'\"\n #autocompleteField\n [class]=\"classList\"\n [autofocus]=\"autofocus\"\n [placeholder]=\"placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [formControl]=\"formControl\"\n [config]=\"definition.autocomplete\"\n [required]=\"required\"\n [tabindex]=\"tabindex\"\n [clearable]=\"clearable\"\n (keyup.enter)=\"onKeyupEnter.emit($event)\"\n [displayWith]=\"getDisplayValueFn(definition)\"\n >\n <ng-content select=\"[matPrefix]\"></ng-content>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </mat-autocomplete-field>\n\n <!-- multi auto-complete -->\n <mat-chips-field\n *ngSwitchCase=\"'entities'\"\n [class]=\"classList\"\n [placeholder]=\"placeholder\"\n [floatLabel]=\"floatLabel\"\n [appearance]=\"appearance\"\n [formControl]=\"formControl\"\n [config]=\"definition.autocomplete\"\n [required]=\"required\"\n [chipColor]=\"chipColor | matColor\"\n [clearable]=\"clearable\"\n [displayWith]=\"getDisplayValueFn(definition)\"\n >\n <ng-content select=\"[matPrefix]\"></ng-content>\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </mat-chips-field>\n\n <!-- other -->\n <div *ngSwitchDefault>\n <mat-error *ngIf=\"type\">\n Unknown type {{ type }} for option {{ definition.key }}. Please report this error.\n </mat-error>\n <mat-error *ngIf=\"!type\">Error on option field. Please check console log for details.</mat-error>\n <div matSuffix>\n <ng-content select=\"[matSuffix]\"></ng-content>\n </div>\n </div>\n</ng-container>\n", styles: [":host{display:inline-block;position:relative}button[hidden]{display:none}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: i1$2.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$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i5$2.ColorPickerDirective, selector: "[colorPicker]", inputs: ["colorPicker", "cpWidth", "cpHeight", "cpToggle", "cpDisabled", "cpIgnoredElements", "cpFallbackColor", "cpColorMode", "cpCmykEnabled", "cpOutputFormat", "cpAlphaChannel", "cpDisableInput", "cpDialogDisplay", "cpSaveClickOutside", "cpCloseClickOutside", "cpUseRootViewContainer", "cpPosition", "cpPositionOffset", "cpPositionRelativeToArrow", "cpOKButton", "cpOKButtonText", "cpOKButtonClass", "cpCancelButton", "cpCancelButtonText", "cpCancelButtonClass", "cpEyeDropper", "cpPresetLabel", "cpPresetColors", "cpPresetColorsClass", "cpMaxPresetColorsLength", "cpPresetEmptyMessage", "cpPresetEmptyMessageClass", "cpAddColorButton", "cpAddColorButtonText", "cpAddColorButtonClass", "cpRemoveColorButtonClass", "cpArrowPosition", "cpExtraTemplate"], outputs: ["cpInputChange", "cpToggleChange", "cpSliderChange", "cpSliderDragEnd", "cpSliderDragStart", "colorPickerOpen", "colorPickerClose", "colorPickerCancel", "colorPickerSelect", "colorPickerChange", "cpCmykColorChange", "cpPresetColorsChange"], exportAs: ["ngxColorPicker"] }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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"], exportAs: ["matInput"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i13.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: MatAutocompleteField, selector: "mat-autocomplete-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "mobile", "clearable", "debounceTime", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "autofocus", "config", "i18nPrefix", "noResultMessage", "class", "panelWidth", "matAutocompletePosition", "multiple", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "debug", "showSearchBar", "stickySearchBar", "applyImplicitValue", "dropButtonTitle", "clearButtonTitle", "filter", "readonly", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keyup.enter"] }, { kind: "component", type: MatDate, selector: "mat-date-field", inputs: ["mobile", "formControl", "formControlName", "placeholder", "floatLabel", "required", "compact", "autofocus", "startDate", "clearable", "timezone", "datePickerFilter", "appearance", "subscriptSizing", "readonly", "tabindex"] }, { kind: "component", type: MatDateTime, selector: "mat-date-time-field", inputs: ["placeholder", "floatLabel", "mobile", "compact", "autofocus", "startDate", "clearable", "datePickerFilter", "appearance", "subscriptSizing", "formControl", "formControlName", "required", "readonly", "tabindex"] }, { kind: "component", type: MatBooleanField, selector: "mat-boolean-field", inputs: ["disabled", "formControl", "formControlName", "placeholder", "floatLabel", "appearance", "subscriptSizing", "readonly", "required", "compact", "style", "buttonsColCount", "class", "yesLabel", "noLabel", "showButtonIcons", "yesIcon", "noIcon", "clearable", "labelPosition", "tabindex", "showRadio", "value"], outputs: ["keyup.enter", "blur"] }, { kind: "component", type: MatChipsField, selector: "mat-chips-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "mobile", "readonly", "clearable", "debounceTime", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "autofocus", "config", "i18nPrefix", "noResultMessage", "class", "panelWidth", "matAutocompletePosition", "itemSize", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "chipColor", "debug", "dropButtonTitle", "clearButtonTitle", "filter", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keyup.enter"] }, { kind: "directive", type: AutofocusDirective, selector: "[autofocus], input[appAutofocus]", inputs: ["appAutofocus", "autofocusDelay"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: IsNilOrBlankPipe, name: "isNilOrBlank" }, { kind: "pipe", type: FormGetValuePipe, name: "formGetValue" }, { kind: "pipe", type: MatColorPipe, name: "matColor" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
12864
12867
|
}
|
|
12865
12868
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppFormField, decorators: [{
|
|
12866
12869
|
type: Component,
|
|
@@ -34895,7 +34898,7 @@ class NewTokenModal extends AppEntityEditorModal {
|
|
|
34895
34898
|
return flags;
|
|
34896
34899
|
}
|
|
34897
34900
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: NewTokenModal, deps: [{ token: i0.Injector }, { token: UserTokenValidatorService }, { token: AccountService }], target: i0.ɵɵFactoryTarget.Component });
|
|
34898
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: NewTokenModal, selector: "app-new-token-modal", inputs: { showScopes: "showScopes", tokenScopes: "tokenScopes", existingNames: "existingNames" }, usesInheritance: true, ngImport: i0, template: "<app-modal-toolbar\n modalName=\"NewTokenModal\"\n [title]=\"titleSubject | async\"\n [color]=\"'secondary'\"\n [showSpinner]=\"loading\"\n [canValidate]=\"!loading && valid\"\n (cancel)=\"close($event)\"\n (validate)=\"saveAndClose($event)\"\n></app-modal-toolbar>\n\n<ion-content class=\"ion-padding\">\n <!-- error -->\n <ion-item *ngIf=\"error\" lines=\"none\">\n <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"error | translate\"></ion-label>\n </ion-item>\n\n <p><b translate>ACCOUNT.TOKENS.CREATE.DESCRIPTION</b></p>\n\n <form class=\"form-container\" [formGroup]=\"tokenForm\">\n <ion-grid class=\"ion-no-padding\">\n <ion-row>\n <ion-col>\n <mat-form-field>\n <mat-label>{{ 'ACCOUNT.TOKENS.CREATE.NAME' | translate }}</mat-label>\n <input\n matInput\n [appAutofocus]=\"true\"\n [autofocusDelay]=\"500\"\n formControlName=\"name\"\n autocomplete=\"off\"\n required\n [readonly]=\"tokenForm | formGetValue: 'token' | isNotNilOrBlank\"\n />\n <mat-error *ngIf=\"form.controls.name.hasError('required') && form.controls.name.touched\" translate>\n ERROR.FIELD_REQUIRED\n </mat-error>\n <mat-error *ngIf=\"form.controls.name.hasError('notAlreadyExists') && form.controls.name.touched\" translate>\n ACCOUNT.TOKENS.CREATE.NAME_ALREADY_EXISTS\n </mat-error>\n </mat-form-field>\n </ion-col>\n </ion-row>\n @if (showScopes) {\n <ion-row>\n <ion-col>\n <mat-chips-field\n formControlName=\"scopes\"\n appearance=\"fill\"\n chipColor=\"primary\"\n [placeholder]=\"'ACCOUNT.TOKENS.CREATE.SCOPES' | translate\"\n [config]=\"tokenConfig\"\n [mobile]=\"mobile\"\n [debug]=\"false\"\n [required]=\"true\"\n [readonly]=\"tokenForm | formGetValue: 'token' | isNotNilOrBlank\"\n >\n <mat-error *ngIf=\"form.controls.name.hasError('notEmptyArray') && form.controls.name.touched\" translate>\n ERROR.FIELD_REQUIRED\n </mat-error>\n </mat-chips-field>\n </ion-col>\n </ion-row>\n }\n <ion-row>\n <ion-col>\n <mat-date-field\n formControlName=\"expirationDate\"\n [placeholder]=\"'ACCOUNT.TOKENS.CREATE.EXPIRATION_DATE' | translate\"\n [mobile]=\"mobile\"\n [required]=\"true\"\n [readonly]=\"tokenForm | formGetValue: 'token' | isNotNilOrBlank\"\n ></mat-date-field>\n </ion-col>\n </ion-row>\n <ion-row>\n <ion-col>\n <ion-button\n *ngIf=\"tokenForm | formGetValue: 'token' | isNilOrBlank; else showToken\"\n [title]=\"'ACCOUNT.TOKENS.CREATE.BTN_GENERATE_TITLE' | translate\"\n (click)=\"generate($event)\"\n [disabled]=\"tokenForm.invalid\"\n >\n {{ 'ACCOUNT.TOKENS.CREATE.BTN_GENERATE' | translate }}\n </ion-button>\n <ng-template #showToken>\n <p><b translate>ACCOUNT.TOKENS.CREATE.COPY_HELP</b></p>\n <mat-form-field subscriptSizing=\"dynamic\">\n <textarea\n matInput\n formControlName=\"token\"\n readonly\n style=\"height: auto; background-color: lightgray\"\n rows=\"8\"\n ></textarea>\n <button\n matSuffix\n mat-icon-button\n [title]=\"'ACCOUNT.TOKENS.CREATE.BTN_COPY_TITLE' | translate\"\n (click)=\"copy($event)\"\n >\n <mat-icon>content_copy</mat-icon>\n </button>\n </mat-form-field>\n </ng-template>\n </ion-col>\n </ion-row>\n </ion-grid>\n </form>\n</ion-content>\n\n<ion-footer hidden-xs hidden-sm hidden-mobile>\n <ion-toolbar>\n <ion-row class=\"ion-no-padding\" nowrap>\n <ion-col>\n <ng-content></ng-content>\n </ion-col>\n\n <ion-col size=\"auto\">\n <ion-button fill=\"clear\" color=\"dark\" (click)=\"close($event)\">\n <ion-label translate>COMMON.BTN_CANCEL</ion-label>\n </ion-button>\n\n <ion-button\n [fill]=\"invalid ? 'clear' : 'solid'\"\n [disabled]=\"disabled || loading || invalid\"\n (click)=\"saveAndClose($event)\"\n (keyup.enter)=\"saveAndClose($event)\"\n color=\"tertiary\"\n >\n <ion-label translate>COMMON.BTN_VALIDATE</ion-label>\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-toolbar>\n</ion-footer>\n", dependencies: [{ kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2$1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2$1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2$1.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2$1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonRow, selector: "ion-row" }, { kind: "component", type: i2$1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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"], exportAs: ["matInput"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: MatDate, selector: "mat-date-field", inputs: ["mobile", "formControl", "formControlName", "placeholder", "floatLabel", "required", "compact", "autofocus", "startDate", "clearable", "timezone", "datePickerFilter", "appearance", "subscriptSizing", "readonly", "tabindex"] }, { kind: "component", type: MatChipsField, selector: "mat-chips-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "mobile", "readonly", "clearable", "debounceTime", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "autofocus", "config", "i18nPrefix", "noResultMessage", "class", "panelWidth", "matAutocompletePosition", "itemSize", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "chipColor", "debug", "filter", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keyup.enter"] }, { kind: "directive", type: AutofocusDirective, selector: "[autofocus], input[appAutofocus]", inputs: ["appAutofocus", "autofocusDelay"] }, { kind: "component", type: ModalToolbarComponent, selector: "app-modal-toolbar", inputs: ["modalName", "title", "color", "showSpinner", "canValidate", "validateIcon"], outputs: ["cancel", "validate"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: IsNilOrBlankPipe, name: "isNilOrBlank" }, { kind: "pipe", type: IsNotNilOrBlankPipe, name: "isNotNilOrBlank" }, { kind: "pipe", type: FormGetValuePipe, name: "formGetValue" }] });
|
|
34901
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: NewTokenModal, selector: "app-new-token-modal", inputs: { showScopes: "showScopes", tokenScopes: "tokenScopes", existingNames: "existingNames" }, usesInheritance: true, ngImport: i0, template: "<app-modal-toolbar\n modalName=\"NewTokenModal\"\n [title]=\"titleSubject | async\"\n [color]=\"'secondary'\"\n [showSpinner]=\"loading\"\n [canValidate]=\"!loading && valid\"\n (cancel)=\"close($event)\"\n (validate)=\"saveAndClose($event)\"\n></app-modal-toolbar>\n\n<ion-content class=\"ion-padding\">\n <!-- error -->\n <ion-item *ngIf=\"error\" lines=\"none\">\n <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"error | translate\"></ion-label>\n </ion-item>\n\n <p><b translate>ACCOUNT.TOKENS.CREATE.DESCRIPTION</b></p>\n\n <form class=\"form-container\" [formGroup]=\"tokenForm\">\n <ion-grid class=\"ion-no-padding\">\n <ion-row>\n <ion-col>\n <mat-form-field>\n <mat-label>{{ 'ACCOUNT.TOKENS.CREATE.NAME' | translate }}</mat-label>\n <input\n matInput\n [appAutofocus]=\"true\"\n [autofocusDelay]=\"500\"\n formControlName=\"name\"\n autocomplete=\"off\"\n required\n [readonly]=\"tokenForm | formGetValue: 'token' | isNotNilOrBlank\"\n />\n <mat-error *ngIf=\"form.controls.name.hasError('required') && form.controls.name.touched\" translate>\n ERROR.FIELD_REQUIRED\n </mat-error>\n <mat-error *ngIf=\"form.controls.name.hasError('notAlreadyExists') && form.controls.name.touched\" translate>\n ACCOUNT.TOKENS.CREATE.NAME_ALREADY_EXISTS\n </mat-error>\n </mat-form-field>\n </ion-col>\n </ion-row>\n @if (showScopes) {\n <ion-row>\n <ion-col>\n <mat-chips-field\n formControlName=\"scopes\"\n appearance=\"fill\"\n chipColor=\"primary\"\n [placeholder]=\"'ACCOUNT.TOKENS.CREATE.SCOPES' | translate\"\n [config]=\"tokenConfig\"\n [mobile]=\"mobile\"\n [debug]=\"false\"\n [required]=\"true\"\n [readonly]=\"tokenForm | formGetValue: 'token' | isNotNilOrBlank\"\n >\n <mat-error *ngIf=\"form.controls.name.hasError('notEmptyArray') && form.controls.name.touched\" translate>\n ERROR.FIELD_REQUIRED\n </mat-error>\n </mat-chips-field>\n </ion-col>\n </ion-row>\n }\n <ion-row>\n <ion-col>\n <mat-date-field\n formControlName=\"expirationDate\"\n [placeholder]=\"'ACCOUNT.TOKENS.CREATE.EXPIRATION_DATE' | translate\"\n [mobile]=\"mobile\"\n [required]=\"true\"\n [readonly]=\"tokenForm | formGetValue: 'token' | isNotNilOrBlank\"\n ></mat-date-field>\n </ion-col>\n </ion-row>\n <ion-row>\n <ion-col>\n <ion-button\n *ngIf=\"tokenForm | formGetValue: 'token' | isNilOrBlank; else showToken\"\n [title]=\"'ACCOUNT.TOKENS.CREATE.BTN_GENERATE_TITLE' | translate\"\n (click)=\"generate($event)\"\n [disabled]=\"tokenForm.invalid\"\n >\n {{ 'ACCOUNT.TOKENS.CREATE.BTN_GENERATE' | translate }}\n </ion-button>\n <ng-template #showToken>\n <p><b translate>ACCOUNT.TOKENS.CREATE.COPY_HELP</b></p>\n <mat-form-field subscriptSizing=\"dynamic\">\n <textarea\n matInput\n formControlName=\"token\"\n readonly\n style=\"height: auto; background-color: lightgray\"\n rows=\"8\"\n ></textarea>\n <button\n matSuffix\n mat-icon-button\n [title]=\"'ACCOUNT.TOKENS.CREATE.BTN_COPY_TITLE' | translate\"\n (click)=\"copy($event)\"\n >\n <mat-icon>content_copy</mat-icon>\n </button>\n </mat-form-field>\n </ng-template>\n </ion-col>\n </ion-row>\n </ion-grid>\n </form>\n</ion-content>\n\n<ion-footer hidden-xs hidden-sm hidden-mobile>\n <ion-toolbar>\n <ion-row class=\"ion-no-padding\" nowrap>\n <ion-col>\n <ng-content></ng-content>\n </ion-col>\n\n <ion-col size=\"auto\">\n <ion-button fill=\"clear\" color=\"dark\" (click)=\"close($event)\">\n <ion-label translate>COMMON.BTN_CANCEL</ion-label>\n </ion-button>\n\n <ion-button\n [fill]=\"invalid ? 'clear' : 'solid'\"\n [disabled]=\"disabled || loading || invalid\"\n (click)=\"saveAndClose($event)\"\n (keyup.enter)=\"saveAndClose($event)\"\n color=\"tertiary\"\n >\n <ion-label translate>COMMON.BTN_VALIDATE</ion-label>\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-toolbar>\n</ion-footer>\n", dependencies: [{ kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2$1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2$1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2$1.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2$1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonRow, selector: "ion-row" }, { kind: "component", type: i2$1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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"], exportAs: ["matInput"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: MatDate, selector: "mat-date-field", inputs: ["mobile", "formControl", "formControlName", "placeholder", "floatLabel", "required", "compact", "autofocus", "startDate", "clearable", "timezone", "datePickerFilter", "appearance", "subscriptSizing", "readonly", "tabindex"] }, { kind: "component", type: MatChipsField, selector: "mat-chips-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "mobile", "readonly", "clearable", "debounceTime", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "autofocus", "config", "i18nPrefix", "noResultMessage", "class", "panelWidth", "matAutocompletePosition", "itemSize", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "chipColor", "debug", "dropButtonTitle", "clearButtonTitle", "filter", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keyup.enter"] }, { kind: "directive", type: AutofocusDirective, selector: "[autofocus], input[appAutofocus]", inputs: ["appAutofocus", "autofocusDelay"] }, { kind: "component", type: ModalToolbarComponent, selector: "app-modal-toolbar", inputs: ["modalName", "title", "color", "showSpinner", "canValidate", "validateIcon"], outputs: ["cancel", "validate"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: IsNilOrBlankPipe, name: "isNilOrBlank" }, { kind: "pipe", type: IsNotNilOrBlankPipe, name: "isNotNilOrBlank" }, { kind: "pipe", type: FormGetValuePipe, name: "formGetValue" }] });
|
|
34899
34902
|
}
|
|
34900
34903
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: NewTokenModal, decorators: [{
|
|
34901
34904
|
type: Component,
|
|
@@ -37571,7 +37574,7 @@ class MessageForm extends AppForm {
|
|
|
37571
37574
|
this.cd.markForCheck();
|
|
37572
37575
|
}
|
|
37573
37576
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MessageForm, deps: [{ token: i0.Injector }, { token: i1$2.UntypedFormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
37574
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: MessageForm, selector: "app-message-form", inputs: { suggestFn: "suggestFn", subjectMinLength: "subjectMinLength", subjectMaxLength: "subjectMaxLength", bodyMaxLength: "bodyMaxLength", bodyAutoHeight: "bodyAutoHeight", canSelectType: "canSelectType", canRecipientFilter: "canRecipientFilter", recipientFilterCount: "recipientFilterCount" }, usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"form-container\">\n <!-- type -->\n <mat-form-field *ngIf=\"canSelectType\">\n <mat-label>{{ 'SOCIAL.MESSAGE.TYPE' | translate }}</mat-label>\n <mat-select formControlName=\"type\">\n <ng-container *ngFor=\"let item of types\">\n <mat-option [value]=\"item.id\" *ngIf=\"item.id !== 'FEED' || canRecipientFilter\">\n <ion-icon [name]=\"item.icon\"></ion-icon>\n {{ item.label | translate }}\n </mat-option>\n </ng-container>\n </mat-select>\n </mat-form-field>\n\n <!-- Recipients -->\n <mat-chips-field\n *ngIf=\"(form.controls.type.valueChanges | async) !== 'FEED'; else recipientFilter\"\n formControlName=\"recipients\"\n chipColor=\"accent\"\n [placeholder]=\"'SOCIAL.MESSAGE.RECIPIENTS' | translate\"\n [config]=\"autocompleteFields.recipients\"\n [equals]=\"isSamePerson\"\n ></mat-chips-field>\n <ng-template #recipientFilter>\n <mat-form-field>\n <mat-chip-grid>\n <mat-chip-row>\n {{ 'SOCIAL.MESSAGE.RECIPIENT_FILTER_COUNT' | translate: { count: recipientFilterCount } }}\n </mat-chip-row>\n </mat-chip-grid>\n <input matInput hidden type=\"number\" />\n </mat-form-field>\n </ng-template>\n\n <!-- Subject -->\n <mat-form-field>\n <mat-label>{{ 'SOCIAL.MESSAGE.SUBJECT' | translate }}</mat-label>\n <input matInput type=\"text\" formControlName=\"subject\" autocomplete=\"off\" required />\n <mat-error *ngIf=\"form.controls.subject.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n <mat-error *ngIf=\"form.controls.subject.hasError('minlength')\">\n {{ 'ERROR.FIELD_MIN_LENGTH_COMPACT' | translate }}\n </mat-error>\n <mat-error *ngIf=\"form.controls.subject.hasError('maxlength')\">\n {{ 'ERROR.FIELD_MAX_LENGTH_COMPACT' | translate }}\n </mat-error>\n <mat-hint *ngIf=\"subjectMaxLength\" align=\"end\">\n {{\n 'INFO.TEXT_PROGRESS' | translate: { current: form.controls.subject.value?.length || 0, max: subjectMaxLength }\n }}\n </mat-hint>\n </mat-form-field>\n\n <!-- Body -->\n <mat-form-field>\n <mat-label>{{ 'SOCIAL.MESSAGE.BODY_HELP' | translate }}</mat-label>\n <textarea\n matInput\n type=\"text\"\n formControlName=\"body\"\n [class.fixed-height]=\"!bodyAutoHeight\"\n [cdkTextareaAutosize]=\"bodyAutoHeight\"\n (keydown.control.enter)=\"doSubmit($event)\"\n ></textarea>\n <mat-error *ngIf=\"form.controls.body.hasError('maxlength')\">\n {{ 'ERROR.FIELD_MAX_LENGTH' | translate: form.controls.body.errors.maxlength }}\n </mat-error>\n <mat-hint *ngIf=\"bodyMaxLength\" align=\"end\">\n {{ 'INFO.TEXT_PROGRESS' | translate: { current: form.controls.body.value?.length || 0, max: bodyMaxLength } }}\n </mat-hint>\n </mat-form-field>\n</form>\n", styles: ["textarea.fixed-height{height:11.5em}textarea{min-height:11.5em}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { 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: 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"], exportAs: ["matInput"] }, { kind: "directive", type: i5$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: i13.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: MatChipsField, selector: "mat-chips-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "mobile", "readonly", "clearable", "debounceTime", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "autofocus", "config", "i18nPrefix", "noResultMessage", "class", "panelWidth", "matAutocompletePosition", "itemSize", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "chipColor", "debug", "filter", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keyup.enter"] }, { kind: "component", type: i11$1.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "component", type: i11$1.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
37577
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: MessageForm, selector: "app-message-form", inputs: { suggestFn: "suggestFn", subjectMinLength: "subjectMinLength", subjectMaxLength: "subjectMaxLength", bodyMaxLength: "bodyMaxLength", bodyAutoHeight: "bodyAutoHeight", canSelectType: "canSelectType", canRecipientFilter: "canRecipientFilter", recipientFilterCount: "recipientFilterCount" }, usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"form-container\">\n <!-- type -->\n <mat-form-field *ngIf=\"canSelectType\">\n <mat-label>{{ 'SOCIAL.MESSAGE.TYPE' | translate }}</mat-label>\n <mat-select formControlName=\"type\">\n <ng-container *ngFor=\"let item of types\">\n <mat-option [value]=\"item.id\" *ngIf=\"item.id !== 'FEED' || canRecipientFilter\">\n <ion-icon [name]=\"item.icon\"></ion-icon>\n {{ item.label | translate }}\n </mat-option>\n </ng-container>\n </mat-select>\n </mat-form-field>\n\n <!-- Recipients -->\n <mat-chips-field\n *ngIf=\"(form.controls.type.valueChanges | async) !== 'FEED'; else recipientFilter\"\n formControlName=\"recipients\"\n chipColor=\"accent\"\n [placeholder]=\"'SOCIAL.MESSAGE.RECIPIENTS' | translate\"\n [config]=\"autocompleteFields.recipients\"\n [equals]=\"isSamePerson\"\n ></mat-chips-field>\n <ng-template #recipientFilter>\n <mat-form-field>\n <mat-chip-grid>\n <mat-chip-row>\n {{ 'SOCIAL.MESSAGE.RECIPIENT_FILTER_COUNT' | translate: { count: recipientFilterCount } }}\n </mat-chip-row>\n </mat-chip-grid>\n <input matInput hidden type=\"number\" />\n </mat-form-field>\n </ng-template>\n\n <!-- Subject -->\n <mat-form-field>\n <mat-label>{{ 'SOCIAL.MESSAGE.SUBJECT' | translate }}</mat-label>\n <input matInput type=\"text\" formControlName=\"subject\" autocomplete=\"off\" required />\n <mat-error *ngIf=\"form.controls.subject.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n <mat-error *ngIf=\"form.controls.subject.hasError('minlength')\">\n {{ 'ERROR.FIELD_MIN_LENGTH_COMPACT' | translate }}\n </mat-error>\n <mat-error *ngIf=\"form.controls.subject.hasError('maxlength')\">\n {{ 'ERROR.FIELD_MAX_LENGTH_COMPACT' | translate }}\n </mat-error>\n <mat-hint *ngIf=\"subjectMaxLength\" align=\"end\">\n {{\n 'INFO.TEXT_PROGRESS' | translate: { current: form.controls.subject.value?.length || 0, max: subjectMaxLength }\n }}\n </mat-hint>\n </mat-form-field>\n\n <!-- Body -->\n <mat-form-field>\n <mat-label>{{ 'SOCIAL.MESSAGE.BODY_HELP' | translate }}</mat-label>\n <textarea\n matInput\n type=\"text\"\n formControlName=\"body\"\n [class.fixed-height]=\"!bodyAutoHeight\"\n [cdkTextareaAutosize]=\"bodyAutoHeight\"\n (keydown.control.enter)=\"doSubmit($event)\"\n ></textarea>\n <mat-error *ngIf=\"form.controls.body.hasError('maxlength')\">\n {{ 'ERROR.FIELD_MAX_LENGTH' | translate: form.controls.body.errors.maxlength }}\n </mat-error>\n <mat-hint *ngIf=\"bodyMaxLength\" align=\"end\">\n {{ 'INFO.TEXT_PROGRESS' | translate: { current: form.controls.body.value?.length || 0, max: bodyMaxLength } }}\n </mat-hint>\n </mat-form-field>\n</form>\n", styles: ["textarea.fixed-height{height:11.5em}textarea{min-height:11.5em}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { 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: 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"], exportAs: ["matInput"] }, { kind: "directive", type: i5$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: i13.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: MatChipsField, selector: "mat-chips-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "mobile", "readonly", "clearable", "debounceTime", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "autofocus", "config", "i18nPrefix", "noResultMessage", "class", "panelWidth", "matAutocompletePosition", "itemSize", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "chipColor", "debug", "dropButtonTitle", "clearButtonTitle", "filter", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keyup.enter"] }, { kind: "component", type: i11$1.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "component", type: i11$1.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
37575
37578
|
}
|
|
37576
37579
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: MessageForm, decorators: [{
|
|
37577
37580
|
type: Component,
|
|
@@ -39504,6 +39507,7 @@ class ChipsTestPage {
|
|
|
39504
39507
|
form;
|
|
39505
39508
|
autocompleteFields = new MatAutocompleteConfigHolder();
|
|
39506
39509
|
appearance = 'fill';
|
|
39510
|
+
mobile = true;
|
|
39507
39511
|
constructor(formBuilder) {
|
|
39508
39512
|
this.formBuilder = formBuilder;
|
|
39509
39513
|
this.form = formBuilder.group({
|
|
@@ -39597,7 +39601,7 @@ class ChipsTestPage {
|
|
|
39597
39601
|
return JSON.stringify(value);
|
|
39598
39602
|
}
|
|
39599
39603
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ChipsTestPage, deps: [{ token: i1$2.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
39600
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ChipsTestPage, selector: "app-chips-test", ngImport: i0, template: "<ion-header>\n <ion-toolbar color=\"primary\">\n <ion-buttons slot=\"start\">\n <ion-back-button></ion-back-button>\n </ion-buttons>\n\n <ion-title>Chips field test page</ion-title>\n </ion-toolbar>\n</ion-header>\n\n<ion-content class=\"ion-padding\">\n <form class=\"form-container\" [formGroup]=\"form\" (ngSubmit)=\"doSubmit($event)\">\n <ion-grid>\n <ion-row>\n <ion-col size=\"12\">\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-text color=\"primary\">Suggest() function</ion-text>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <pre><small>suggestFn: (searchText, filter) => any[]</small></pre>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <ion-grid class=\"ion-no-padding\">\n <ion-row>\n <ion-col>\n <mat-chips-field\n formControlName=\"entity\"\n placeholder=\"A chip field\"\n [appearance]=\"appearance\"\n [config]=\"autocompleteFields.get('entity-suggestFn')\"\n [logPrefix]=\"'[mat-chips-empty] '\"\n chipColor=\"accent\"\n [debug]=\"true\"\n ></mat-chips-field>\n </ion-col>\n\n <ion-col>\n <mat-form-field [appearance]=\"appearance\">\n <mat-label>Another field</mat-label>\n <input matInput type=\"text\" />\n </mat-form-field>\n </ion-col>\n </ion-row>\n <ion-row>\n <ion-col>\n {{ form.controls.entity.value | json }}\n </ion-col>\n </ion-row>\n </ion-grid>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">Suggest() function with initial value</ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <pre><small>suggestFn: (searchText, filter) => any[]</small></pre>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-chips-field\n formControlName=\"entityInitial\"\n [config]=\"autocompleteFields.get('entity-suggestFn')\"\n placeholder=\"A suggestFn field\"\n [logPrefix]=\"'[mat-chips-initialized] '\"\n chipColor=\"primary\"\n [debug]=\"true\"\n ></mat-chips-field>\n {{ form.controls.entityInitial.value | json }}\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">Disabled control</ion-label>\n </ion-card-title>\n </ion-card-header>\n <ion-card-content>\n <mat-chips-field\n formControlName=\"disableEntity\"\n [config]=\"autocompleteFields.get('entity-suggestFn')\"\n [equals]=\"equals\"\n placeholder=\"A disabled field\"\n [logPrefix]=\"'[mat-chips-disabled] '\"\n chipColor=\"warn\"\n [debug]=\"true\"\n ></mat-chips-field>\n {{ form.controls.disableEntity.value | json }}\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">Readonly control</ion-label>\n </ion-card-title>\n </ion-card-header>\n <ion-card-content>\n <mat-chips-field\n formControlName=\"entity\"\n [config]=\"autocompleteFields.get('entity-suggestFn')\"\n [equals]=\"equals\"\n placeholder=\"A readonly field\"\n [logPrefix]=\"'[mat-chips-readonly] '\"\n [readonly]=\"true\"\n ></mat-chips-field>\n {{ form.controls.entity?.value | json }}\n </ion-card-content>\n </ion-card>\n </ion-col>\n </ion-row>\n </ion-grid>\n </form>\n</ion-content>\n", dependencies: [{ kind: "component", type: i2$1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2$1.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i2$1.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i2$1.IonCardHeader, selector: "ion-card-header", inputs: ["color", "mode", "translucent"] }, { kind: "component", type: i2$1.IonCardSubtitle, selector: "ion-card-subtitle", inputs: ["color", "mode"] }, { kind: "component", type: i2$1.IonCardTitle, selector: "ion-card-title", inputs: ["color", "mode"] }, { kind: "component", type: i2$1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2$1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2$1.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonRow, selector: "ion-row" }, { kind: "component", type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "component", type: i2$1.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i2$1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: i2$1.IonBackButton, selector: "ion-back-button" }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { 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: 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"], exportAs: ["matInput"] }, { kind: "component", type: MatChipsField, selector: "mat-chips-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "mobile", "readonly", "clearable", "debounceTime", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "autofocus", "config", "i18nPrefix", "noResultMessage", "class", "panelWidth", "matAutocompletePosition", "itemSize", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "chipColor", "debug", "filter", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keyup.enter"] }, { kind: "pipe", type: i3$1.JsonPipe, name: "json" }] });
|
|
39604
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ChipsTestPage, selector: "app-chips-test", ngImport: i0, template: "<ion-header>\n <ion-toolbar color=\"primary\">\n <ion-buttons slot=\"start\">\n <ion-back-button></ion-back-button>\n </ion-buttons>\n\n <ion-title>Chips field test page</ion-title>\n </ion-toolbar>\n</ion-header>\n\n<ion-content class=\"ion-padding\">\n <form class=\"form-container\" [formGroup]=\"form\" (ngSubmit)=\"doSubmit($event)\">\n <ion-grid>\n <ion-row>\n <ion-col size=\"12\">\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-text color=\"primary\">Suggest() function</ion-text>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <pre><small>suggestFn: (searchText, filter) => any[]</small></pre>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <ion-grid class=\"ion-no-padding\">\n <ion-row>\n <ion-col>\n <mat-chips-field\n formControlName=\"entity\"\n placeholder=\"A chip field\"\n [appearance]=\"appearance\"\n [config]=\"autocompleteFields.get('entity-suggestFn')\"\n [logPrefix]=\"'[mat-chips-empty] '\"\n chipColor=\"accent\"\n [debug]=\"true\"\n ></mat-chips-field>\n </ion-col>\n\n <ion-col>\n <mat-form-field [appearance]=\"appearance\">\n <mat-label>Another field</mat-label>\n <input matInput type=\"text\" />\n </mat-form-field>\n </ion-col>\n </ion-row>\n <ion-row>\n <ion-col>\n {{ form.controls.entity.value | json }}\n </ion-col>\n </ion-row>\n </ion-grid>\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">Suggest() function with initial value</ion-label>\n </ion-card-title>\n <ion-card-subtitle>\n <ion-text color=\"medium\">\n <pre><small>suggestFn: (searchText, filter) => any[]</small></pre>\n </ion-text>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content>\n <mat-chips-field\n formControlName=\"entityInitial\"\n [config]=\"autocompleteFields.get('entity-suggestFn')\"\n placeholder=\"A suggestFn field\"\n [logPrefix]=\"'[mat-chips-initialized] '\"\n chipColor=\"primary\"\n [debug]=\"true\"\n ></mat-chips-field>\n {{ form.controls.entityInitial.value | json }}\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">Disabled control</ion-label>\n </ion-card-title>\n </ion-card-header>\n <ion-card-content>\n <mat-chips-field\n formControlName=\"disableEntity\"\n [config]=\"autocompleteFields.get('entity-suggestFn')\"\n [equals]=\"equals\"\n placeholder=\"A disabled field\"\n [logPrefix]=\"'[mat-chips-disabled] '\"\n chipColor=\"warn\"\n [debug]=\"true\"\n ></mat-chips-field>\n {{ form.controls.disableEntity.value | json }}\n </ion-card-content>\n </ion-card>\n </ion-col>\n\n <ion-col>\n <ion-card>\n <ion-card-header>\n <ion-card-title>\n <ion-label color=\"primary\">Readonly control</ion-label>\n </ion-card-title>\n </ion-card-header>\n <ion-card-content>\n <mat-chips-field\n formControlName=\"entity\"\n [config]=\"autocompleteFields.get('entity-suggestFn')\"\n [equals]=\"equals\"\n placeholder=\"A readonly field\"\n [logPrefix]=\"'[mat-chips-readonly] '\"\n [readonly]=\"true\"\n ></mat-chips-field>\n {{ form.controls.entity?.value | json }}\n </ion-card-content>\n </ion-card>\n </ion-col>\n </ion-row>\n </ion-grid>\n </form>\n</ion-content>\n", dependencies: [{ kind: "component", type: i2$1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2$1.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i2$1.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i2$1.IonCardHeader, selector: "ion-card-header", inputs: ["color", "mode", "translucent"] }, { kind: "component", type: i2$1.IonCardSubtitle, selector: "ion-card-subtitle", inputs: ["color", "mode"] }, { kind: "component", type: i2$1.IonCardTitle, selector: "ion-card-title", inputs: ["color", "mode"] }, { kind: "component", type: i2$1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2$1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2$1.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonRow, selector: "ion-row" }, { kind: "component", type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "component", type: i2$1.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i2$1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: i2$1.IonBackButton, selector: "ion-back-button" }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { 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: 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"], exportAs: ["matInput"] }, { kind: "component", type: MatChipsField, selector: "mat-chips-field", inputs: ["equals", "logPrefix", "formControl", "formControlName", "floatLabel", "appearance", "subscriptSizing", "placeholder", "suggestFn", "required", "mobile", "readonly", "clearable", "debounceTime", "displayWith", "displayAttributes", "displayColumnSizes", "displayColumnNames", "highlightAccent", "showAllOnFocus", "showPanelOnFocus", "autofocus", "config", "i18nPrefix", "noResultMessage", "class", "panelWidth", "matAutocompletePosition", "itemSize", "fetchMoreThreshold", "suggestLengthThreshold", "showLoadingSpinner", "chipColor", "debug", "dropButtonTitle", "clearButtonTitle", "filter", "tabindex", "items"], outputs: ["click", "blur", "focus", "dropButtonClick", "keydown.escape", "keyup.enter"] }, { kind: "pipe", type: i3$1.JsonPipe, name: "json" }] });
|
|
39601
39605
|
}
|
|
39602
39606
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ChipsTestPage, decorators: [{
|
|
39603
39607
|
type: Component,
|