myrta-ui 1.1.23 → 1.1.25

package/fesm2020/myrta-ui.mjs

@@ -4426,9 +4426,6 @@ class MrxFormValidator {
         if (!validateEmptyValue && (value.length === 0)) {
             return;
         }
-        if (!this._isValid) {
-            return;
-        }
         for (let key in validations) {
             switch (key) {
                 case ValidationTypesEnum.Required:
@@ -4437,9 +4434,6 @@ class MrxFormValidator {
                     if (!silent && !this._errors[name]) {
                         this._errors[name] = requiredRes.message;
                     }
-                    if (!this._isValid) {
-                        return;
-                    }
                     break;
                 case ValidationTypesEnum.Email:
                     const emailRes = emailValidation(value, validations, key, this._invalidMessages);
@@ -4447,9 +4441,6 @@ class MrxFormValidator {
                     if (!silent && !this._errors[name]) {
                         this._errors[name] = emailRes.message;
                     }
-                    if (!this._isValid) {
-                        return;
-                    }
                     break;
                 case ValidationTypesEnum.Pattern:
                     const patternRes = patternValidation(value, validations, key, this._invalidMessages);
@@ -4457,9 +4448,6 @@ class MrxFormValidator {
                     if (!silent && !this._errors[name]) {
                         this._errors[name] = patternRes.message;
                     }
-                    if (!this._isValid) {
-                        return;
-                    }
                     break;
                 case ValidationTypesEnum.MinLength:
                     const minLengthRes = minLengthValidation(value, validations, key, this._invalidMessages);
@@ -4467,9 +4455,6 @@ class MrxFormValidator {
                     if (!silent && !this._errors[name]) {
                         this._errors[name] = minLengthRes.message;
                     }
-                    if (!this._isValid) {
-                        return;
-                    }
                     break;
                 case ValidationTypesEnum.MaxLength:
                     const maxLengthRes = maxLengthValidation(value, validations, key, this._invalidMessages);
@@ -4477,9 +4462,6 @@ class MrxFormValidator {
                     if (!silent && !this._errors[name]) {
                         this._errors[name] = maxLengthRes.message;
                     }
-                    if (!this._isValid) {
-                        return;
-                    }
                     break;
                 case ValidationTypesEnum.MinValue:
                     const minValueRes = minValueValidation(value, validations, key, this._invalidMessages);
@@ -4487,9 +4469,6 @@ class MrxFormValidator {
                     if (!silent && !this._errors[name]) {
                         this._errors[name] = minValueRes.message;
                     }
-                    if (!this._isValid) {
-                        return;
-                    }
                     break;
                 case ValidationTypesEnum.MaxValue:
                     const maxValueRes = maxValueValidation(value, validations, key, this._invalidMessages);
@@ -4497,9 +4476,6 @@ class MrxFormValidator {
                     if (!silent && !this._errors[name]) {
                         this._errors[name] = maxValueRes.message;
                     }
-                    if (!this._isValid) {
-                        return;
-                    }
                     break;
                 case ValidationTypesEnum.Callback:
                     const callbackRes = callbackValidation(value, validations, key, this._invalidMessages);
@@ -4507,13 +4483,20 @@ class MrxFormValidator {
                     if (!silent && !this._errors[name]) {
                         this._errors[name] = callbackRes.message;
                     }
-                    if (!this._isValid) {
-                        return;
-                    }
                     break;
             }
         }
     }
+    _checkErrors(errors) {
+        let isValid = true;
+        for (let error in errors) {
+            if (!!errors[error]) {
+                isValid = !errors[error];
+                break;
+            }
+        }
+        return isValid;
+    }
     initFields(fields, validations) {
         this.fields = cloneDeep(fields);
         this._validations = validations;
@@ -4549,13 +4532,10 @@ class MrxFormValidator {
     }
     isValid() {
         for (let key in this._validations) {
-            if (!this._isValid) {
-                return this._isValid;
-            }
             this.errors[key] = null;
             this.validateField(this._fields[key], key, this._validations[key], true);
         }
-        return this._isValid;
+        return this._checkErrors(this.errors);
     }
     // TODO Вырезать в будущем
     initModelChangedFromField(field, fieldName) {
@@ -17495,6 +17475,7 @@ class FormulaEditorComponent {
         if (outsideValue !== null) {
             this.value = outsideValue;
             this.visibleValue = this._transformValue(this._modifiedValue(outsideValue)).visibleValue;
+            this._detector.detectChanges();
         }
     }
     onInput(event) {
@@ -17525,6 +17506,7 @@ class FormulaEditorComponent {
     updateVisibleValue(insideValue) {
         this.visibleValue = insideValue;
         this._storeCursorPosition();
+        this._detector.detectChanges();
     }
     updateValue(insideValue) {
         this.value = insideValue;
@@ -17673,14 +17655,14 @@ FormulaEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
             provide: NG_VALUE_ACCESSOR,
             useExisting: forwardRef(() => FormulaEditorComponent),
             multi: true
-        }], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true, static: true }], ngImport: i0, template: "<div\r\n  class=\"mrx-formula-editor\"\r\n  [class.mrx-input-error]=\"getInvalid\"\r\n  [class.-disabled]=\"disabled\"\r\n  [class.-readonly]=\"readonly\"\r\n  [class]=\"getClasses\"\r\n>\r\n  <div class=\"mrx-formula-editor__wrapper\">\r\n    <div\r\n      [innerHTML]=\"visibleValue.trim() | safe\"\r\n      #inputElement\r\n      class=\"mrx-formula-editor__box\"\r\n      contenteditable=\"true\"\r\n      [attr.data-ph]=\"placeholder\"\r\n      (input)=\"onInput($event)\"\r\n      (blur)=\"onBlur($event)\"\r\n      (focus)=\"onFocus($event)\"\r\n    ></div>\r\n\r\n    <div class=\"mrx-formula-editor__popup\" *ngIf=\"isFocused\">\r\n      <ng-container *ngIf=\"errorModel.isError && isFocused\">\r\n        <div class=\"mrx-formula-editor__popup--error\">\r\n          {{ getErrorMessage }}\r\n        </div>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"filteredList.length; else emptyList\">\r\n        <div\r\n          class=\"mrx-formula-editor__popup--row\"\r\n          *ngFor=\"let item of filteredList\"\r\n          (click)=\"insertTag(item); $event.stopPropagation()\"\r\n        >\r\n          {{ item.label }}\r\n        </div>\r\n      </ng-container>\r\n      <ng-template #emptyList>\r\n        <div class=\"mrx-formula-editor__popup--row\">\r\n          \u041D\u0435\u0442 \u0440\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\u043E\u0432\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </div>\r\n\r\n    <mrx-error-message\r\n      *ngIf=\"getInvalid && getErrorMessage && !isFocused\"\r\n      [invalidMessage]=\"getErrorMessage\"\r\n    ></mrx-error-message>\r\n\r\n    <mrx-save-state [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n", styles: [".mrx-formula-editor{position:relative}.mrx-formula-editor__box{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:36px;padding:5px var(--spacing-3, 12px) 5px var(--spacing-2, 8px);border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1, 4px);outline:none;color:var(--neutral-text-primary, #262626);transition:outline-width .2s,border .2s;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space}.mrx-formula-editor__box:focus,.mrx-formula-editor__box:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-formula-editor__wrapper{position:relative}.mrx-formula-editor__box ::ng-deep .tag{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);border-radius:var(--border-radius-1, 4px);background:var(--brand-bg-secondary-default, #EDF5FF);padding:6px 12px;margin:0 2px;cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .bracket{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-tertiary, #71767E);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .operator{display:inline-flex;font-family:var(--body-lg-font-family, \"PT Sans\");font-size:var(--body-lg-font-size, 16px);font-weight:var(--body-lg-font-weight, 400);line-height:var(--body-lg-line-height, 24px);color:var(--system-text-attention, #AC5C06);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .number{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--system-text-negative, #8E2100);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__popup{position:absolute;width:100%;border-radius:var(--border-radius-1);background:var(--neutral-bg-island-default, #F8F9FA);box-shadow:0 1px 4px #3a3a3a4d;background-color:#fff;max-height:240px;overflow-x:hidden;overflow-y:auto;margin-top:4px}.mrx-formula-editor__popup--error{padding:var(--spacing-2) var(--spacing-4);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height);color:var(--system-text-negative, #8E2100)}.mrx-formula-editor__popup--row{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);padding:calc(var(--spacing-2) + var(--spacing-half)) var(--spacing-4);white-space:normal;transition:background-color .2s}.mrx-formula-editor__popup--row:hover{cursor:pointer;background-color:var(--Bg2)!important}.mrx-formula-editor__box:empty:not(:focus):before{content:attr(data-ph);color:var(--neutral-text-tertiary, #71767E);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height);padding-left:8px}.mrx-formula-editor.-disabled .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-tertiary, #71767E);pointer-events:none}.mrx-formula-editor.-readonly .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-primary, #262626);pointer-events:none}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}\n"], components: [{ type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "safe": SafePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        }], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true, static: true }], ngImport: i0, template: "<div\r\n  class=\"mrx-formula-editor\"\r\n  [class.mrx-input-error]=\"getInvalid\"\r\n  [class.-disabled]=\"disabled\"\r\n  [class.-readonly]=\"readonly\"\r\n  [class]=\"getClasses\"\r\n>\r\n  <div class=\"mrx-formula-editor__wrapper\">\r\n    <div\r\n      [innerHTML]=\"visibleValue.trim() | safe\"\r\n      #inputElement\r\n      class=\"mrx-formula-editor__box\"\r\n      contenteditable=\"true\"\r\n      [attr.data-ph]=\"placeholder\"\r\n      (input)=\"onInput($event)\"\r\n      (blur)=\"onBlur($event)\"\r\n      (focus)=\"onFocus($event)\"\r\n    ></div>\r\n\r\n    <div class=\"mrx-formula-editor__popup\" *ngIf=\"isFocused\">\r\n      <ng-container *ngIf=\"errorModel.isError && isFocused\">\r\n        <div class=\"mrx-formula-editor__popup--error\">\r\n          {{ getErrorMessage }}\r\n        </div>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"filteredList.length; else emptyList\">\r\n        <div\r\n          class=\"mrx-formula-editor__popup--row\"\r\n          *ngFor=\"let item of filteredList\"\r\n          (click)=\"insertTag(item); $event.stopPropagation()\"\r\n        >\r\n          {{ item.label }}\r\n        </div>\r\n      </ng-container>\r\n      <ng-template #emptyList>\r\n        <div class=\"mrx-formula-editor__popup--row\">\r\n          \u041D\u0435\u0442 \u0440\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\u043E\u0432\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </div>\r\n\r\n    <mrx-error-message\r\n      *ngIf=\"getInvalid && getErrorMessage && !isFocused\"\r\n      [invalidMessage]=\"getErrorMessage\"\r\n    ></mrx-error-message>\r\n\r\n    <mrx-save-state [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n", styles: [".mrx-formula-editor{position:relative}.mrx-formula-editor__box{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:36px;padding:5px var(--spacing-3, 12px) 5px var(--spacing-2, 8px);border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1, 4px);outline:none;color:var(--neutral-text-primary, #262626);transition:outline-width .2s,border .2s;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space}.mrx-formula-editor__box:focus,.mrx-formula-editor__box:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-formula-editor__wrapper{position:relative}.mrx-formula-editor__box ::ng-deep .tag{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);border-radius:var(--border-radius-1, 4px);background:var(--brand-bg-secondary-default, #EDF5FF);padding:6px 12px;margin:0 2px;cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .bracket{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-tertiary, #71767E);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .operator{display:inline-flex;font-family:var(--body-lg-font-family, \"PT Sans\");font-size:var(--body-lg-font-size, 16px);font-weight:var(--body-lg-font-weight, 400);line-height:var(--body-lg-line-height, 24px);color:var(--system-text-attention, #AC5C06);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .number{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--system-text-negative, #8E2100);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__popup{position:absolute;z-index:99;width:100%;border-radius:var(--border-radius-1);background:var(--neutral-bg-island-default, #F8F9FA);box-shadow:0 1px 4px #3a3a3a4d;background-color:#fff;max-height:240px;overflow-x:hidden;overflow-y:auto;margin-top:4px}.mrx-formula-editor__popup--error{padding:var(--spacing-2) var(--spacing-4);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height);color:var(--system-text-negative, #8E2100)}.mrx-formula-editor__popup--row{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);padding:calc(var(--spacing-2) + var(--spacing-half)) var(--spacing-4);white-space:normal;transition:background-color .2s}.mrx-formula-editor__popup--row:hover{cursor:pointer;background-color:var(--Bg2)!important}.mrx-formula-editor__box:empty:not(:focus):before{content:attr(data-ph);color:var(--neutral-text-tertiary, #71767E);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height);padding-left:8px}.mrx-formula-editor.-disabled .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-tertiary, #71767E);pointer-events:none}.mrx-formula-editor.-readonly .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-primary, #262626);pointer-events:none}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}\n"], components: [{ type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "safe": SafePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FormulaEditorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mrx-formula-editor', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => FormulaEditorComponent),
                             multi: true
-                        }], template: "<div\r\n  class=\"mrx-formula-editor\"\r\n  [class.mrx-input-error]=\"getInvalid\"\r\n  [class.-disabled]=\"disabled\"\r\n  [class.-readonly]=\"readonly\"\r\n  [class]=\"getClasses\"\r\n>\r\n  <div class=\"mrx-formula-editor__wrapper\">\r\n    <div\r\n      [innerHTML]=\"visibleValue.trim() | safe\"\r\n      #inputElement\r\n      class=\"mrx-formula-editor__box\"\r\n      contenteditable=\"true\"\r\n      [attr.data-ph]=\"placeholder\"\r\n      (input)=\"onInput($event)\"\r\n      (blur)=\"onBlur($event)\"\r\n      (focus)=\"onFocus($event)\"\r\n    ></div>\r\n\r\n    <div class=\"mrx-formula-editor__popup\" *ngIf=\"isFocused\">\r\n      <ng-container *ngIf=\"errorModel.isError && isFocused\">\r\n        <div class=\"mrx-formula-editor__popup--error\">\r\n          {{ getErrorMessage }}\r\n        </div>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"filteredList.length; else emptyList\">\r\n        <div\r\n          class=\"mrx-formula-editor__popup--row\"\r\n          *ngFor=\"let item of filteredList\"\r\n          (click)=\"insertTag(item); $event.stopPropagation()\"\r\n        >\r\n          {{ item.label }}\r\n        </div>\r\n      </ng-container>\r\n      <ng-template #emptyList>\r\n        <div class=\"mrx-formula-editor__popup--row\">\r\n          \u041D\u0435\u0442 \u0440\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\u043E\u0432\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </div>\r\n\r\n    <mrx-error-message\r\n      *ngIf=\"getInvalid && getErrorMessage && !isFocused\"\r\n      [invalidMessage]=\"getErrorMessage\"\r\n    ></mrx-error-message>\r\n\r\n    <mrx-save-state [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n", styles: [".mrx-formula-editor{position:relative}.mrx-formula-editor__box{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:36px;padding:5px var(--spacing-3, 12px) 5px var(--spacing-2, 8px);border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1, 4px);outline:none;color:var(--neutral-text-primary, #262626);transition:outline-width .2s,border .2s;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space}.mrx-formula-editor__box:focus,.mrx-formula-editor__box:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-formula-editor__wrapper{position:relative}.mrx-formula-editor__box ::ng-deep .tag{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);border-radius:var(--border-radius-1, 4px);background:var(--brand-bg-secondary-default, #EDF5FF);padding:6px 12px;margin:0 2px;cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .bracket{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-tertiary, #71767E);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .operator{display:inline-flex;font-family:var(--body-lg-font-family, \"PT Sans\");font-size:var(--body-lg-font-size, 16px);font-weight:var(--body-lg-font-weight, 400);line-height:var(--body-lg-line-height, 24px);color:var(--system-text-attention, #AC5C06);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .number{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--system-text-negative, #8E2100);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__popup{position:absolute;width:100%;border-radius:var(--border-radius-1);background:var(--neutral-bg-island-default, #F8F9FA);box-shadow:0 1px 4px #3a3a3a4d;background-color:#fff;max-height:240px;overflow-x:hidden;overflow-y:auto;margin-top:4px}.mrx-formula-editor__popup--error{padding:var(--spacing-2) var(--spacing-4);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height);color:var(--system-text-negative, #8E2100)}.mrx-formula-editor__popup--row{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);padding:calc(var(--spacing-2) + var(--spacing-half)) var(--spacing-4);white-space:normal;transition:background-color .2s}.mrx-formula-editor__popup--row:hover{cursor:pointer;background-color:var(--Bg2)!important}.mrx-formula-editor__box:empty:not(:focus):before{content:attr(data-ph);color:var(--neutral-text-tertiary, #71767E);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height);padding-left:8px}.mrx-formula-editor.-disabled .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-tertiary, #71767E);pointer-events:none}.mrx-formula-editor.-readonly .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-primary, #262626);pointer-events:none}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}\n"] }]
+                        }], template: "<div\r\n  class=\"mrx-formula-editor\"\r\n  [class.mrx-input-error]=\"getInvalid\"\r\n  [class.-disabled]=\"disabled\"\r\n  [class.-readonly]=\"readonly\"\r\n  [class]=\"getClasses\"\r\n>\r\n  <div class=\"mrx-formula-editor__wrapper\">\r\n    <div\r\n      [innerHTML]=\"visibleValue.trim() | safe\"\r\n      #inputElement\r\n      class=\"mrx-formula-editor__box\"\r\n      contenteditable=\"true\"\r\n      [attr.data-ph]=\"placeholder\"\r\n      (input)=\"onInput($event)\"\r\n      (blur)=\"onBlur($event)\"\r\n      (focus)=\"onFocus($event)\"\r\n    ></div>\r\n\r\n    <div class=\"mrx-formula-editor__popup\" *ngIf=\"isFocused\">\r\n      <ng-container *ngIf=\"errorModel.isError && isFocused\">\r\n        <div class=\"mrx-formula-editor__popup--error\">\r\n          {{ getErrorMessage }}\r\n        </div>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"filteredList.length; else emptyList\">\r\n        <div\r\n          class=\"mrx-formula-editor__popup--row\"\r\n          *ngFor=\"let item of filteredList\"\r\n          (click)=\"insertTag(item); $event.stopPropagation()\"\r\n        >\r\n          {{ item.label }}\r\n        </div>\r\n      </ng-container>\r\n      <ng-template #emptyList>\r\n        <div class=\"mrx-formula-editor__popup--row\">\r\n          \u041D\u0435\u0442 \u0440\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\u043E\u0432\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </div>\r\n\r\n    <mrx-error-message\r\n      *ngIf=\"getInvalid && getErrorMessage && !isFocused\"\r\n      [invalidMessage]=\"getErrorMessage\"\r\n    ></mrx-error-message>\r\n\r\n    <mrx-save-state [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n", styles: [".mrx-formula-editor{position:relative}.mrx-formula-editor__box{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:36px;padding:5px var(--spacing-3, 12px) 5px var(--spacing-2, 8px);border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1, 4px);outline:none;color:var(--neutral-text-primary, #262626);transition:outline-width .2s,border .2s;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space}.mrx-formula-editor__box:focus,.mrx-formula-editor__box:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-formula-editor__wrapper{position:relative}.mrx-formula-editor__box ::ng-deep .tag{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);border-radius:var(--border-radius-1, 4px);background:var(--brand-bg-secondary-default, #EDF5FF);padding:6px 12px;margin:0 2px;cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .bracket{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-tertiary, #71767E);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .operator{display:inline-flex;font-family:var(--body-lg-font-family, \"PT Sans\");font-size:var(--body-lg-font-size, 16px);font-weight:var(--body-lg-font-weight, 400);line-height:var(--body-lg-line-height, 24px);color:var(--system-text-attention, #AC5C06);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .number{display:inline-flex;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--system-text-negative, #8E2100);cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__popup{position:absolute;z-index:99;width:100%;border-radius:var(--border-radius-1);background:var(--neutral-bg-island-default, #F8F9FA);box-shadow:0 1px 4px #3a3a3a4d;background-color:#fff;max-height:240px;overflow-x:hidden;overflow-y:auto;margin-top:4px}.mrx-formula-editor__popup--error{padding:var(--spacing-2) var(--spacing-4);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height);color:var(--system-text-negative, #8E2100)}.mrx-formula-editor__popup--row{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);padding:calc(var(--spacing-2) + var(--spacing-half)) var(--spacing-4);white-space:normal;transition:background-color .2s}.mrx-formula-editor__popup--row:hover{cursor:pointer;background-color:var(--Bg2)!important}.mrx-formula-editor__box:empty:not(:focus):before{content:attr(data-ph);color:var(--neutral-text-tertiary, #71767E);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height);padding-left:8px}.mrx-formula-editor.-disabled .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-tertiary, #71767E);pointer-events:none}.mrx-formula-editor.-readonly .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-primary, #262626);pointer-events:none}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}\n"] }]
         }], ctorParameters: function () { return [{ type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]