myrta-ui 1.1.46 → 1.1.47
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/esm2020/lib/components/form/editor/editor.component.mjs +22 -8
- package/fesm2015/myrta-ui.mjs +14 -4
- package/fesm2015/myrta-ui.mjs.map +1 -1
- package/fesm2020/myrta-ui.mjs +18 -4
- package/fesm2020/myrta-ui.mjs.map +1 -1
- package/lib/components/form/editor/editor.component.d.ts +1 -0
- package/package.json +1 -1
package/fesm2020/myrta-ui.mjs
CHANGED
|
@@ -10316,6 +10316,7 @@ class EditorComponent {
|
|
|
10316
10316
|
language: 'ru',
|
|
10317
10317
|
showCharsCounter: false,
|
|
10318
10318
|
showWordsCounter: false,
|
|
10319
|
+
limitHTML: true,
|
|
10319
10320
|
showXPathInStatusbar: false,
|
|
10320
10321
|
link: {
|
|
10321
10322
|
noFollowCheckbox: false
|
|
@@ -10400,7 +10401,10 @@ class EditorComponent {
|
|
|
10400
10401
|
this.defaultConfig = { ...this.defaultConfig, iframe: changes['iframe'].currentValue };
|
|
10401
10402
|
}
|
|
10402
10403
|
if (changes['defaultInlineStyle']) {
|
|
10403
|
-
this.defaultConfig = {
|
|
10404
|
+
this.defaultConfig = {
|
|
10405
|
+
...this.defaultConfig,
|
|
10406
|
+
createAttributes: { ...this.defaultConfig.createAttributes, ...defaultInlineStyleConstant }
|
|
10407
|
+
};
|
|
10404
10408
|
}
|
|
10405
10409
|
if (changes['editHTMLDocumentMode']) {
|
|
10406
10410
|
this.defaultConfig = {
|
|
@@ -10445,6 +10449,9 @@ class EditorComponent {
|
|
|
10445
10449
|
get getClasses() {
|
|
10446
10450
|
return `${this.customClasses} ${this.checkValidClasses}`;
|
|
10447
10451
|
}
|
|
10452
|
+
get _cleanedValue() {
|
|
10453
|
+
return this.editorElementRef.editor.value.replace(/ /g, ' ').replace(/ /g, ' ');
|
|
10454
|
+
}
|
|
10448
10455
|
insertPositionText(text) {
|
|
10449
10456
|
this.editorElementRef.editor.s.insertHTML(text);
|
|
10450
10457
|
}
|
|
@@ -10470,12 +10477,15 @@ class EditorComponent {
|
|
|
10470
10477
|
return value ? value.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '') : value;
|
|
10471
10478
|
}
|
|
10472
10479
|
_calculateChartsCount() {
|
|
10473
|
-
this.valueLength = this.
|
|
10480
|
+
this.valueLength = this._cleanedValue.length;
|
|
10474
10481
|
}
|
|
10475
10482
|
updateValue(insideValue) {
|
|
10476
10483
|
if (this.maxLength) {
|
|
10477
10484
|
this._calculateChartsCount();
|
|
10478
10485
|
}
|
|
10486
|
+
if (this.maxLength && this._cleanedValue.length > this.maxLength) {
|
|
10487
|
+
return;
|
|
10488
|
+
}
|
|
10479
10489
|
if (this._isInit) {
|
|
10480
10490
|
this.value = insideValue;
|
|
10481
10491
|
this.changed.emit(insideValue);
|
|
@@ -10487,6 +10497,10 @@ class EditorComponent {
|
|
|
10487
10497
|
onBlur(value) {
|
|
10488
10498
|
this.changeFocused(value);
|
|
10489
10499
|
this.blurred.emit({ value: this.value, id: this.uuid });
|
|
10500
|
+
if (this.maxLength && this._cleanedValue.length > this.maxLength) {
|
|
10501
|
+
this.editorElementRef.editor.value = this.value;
|
|
10502
|
+
this.updateValue(this.editorElementRef.editor.value);
|
|
10503
|
+
}
|
|
10490
10504
|
}
|
|
10491
10505
|
}
|
|
10492
10506
|
EditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EditorComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
@@ -10496,7 +10510,7 @@ EditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
|
|
|
10496
10510
|
useExisting: forwardRef(() => EditorComponent),
|
|
10497
10511
|
multi: true,
|
|
10498
10512
|
},
|
|
10499
|
-
], viewQueries: [{ propertyName: "editorElementRef", first: true, predicate: ["editorElementRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"mrx-editor\"\r\n [class.mrx-input-focused]=\"isFocused\"\r\n [class.mrx-input-error]=\"getInvalid\"\r\n [class]=\"getClasses\"\r\n>\r\n <jodit-editor\r\n #editorElementRef\r\n [config]=\"defaultConfig\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n (onFocus)=\"changeFocused(true)\"\r\n (onBlur)=\"onBlur(false)\"\r\n ></jodit-editor>\r\n\r\n <mrx-
|
|
10513
|
+
], viewQueries: [{ propertyName: "editorElementRef", first: true, predicate: ["editorElementRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"mrx-editor\"\r\n [class.mrx-input-focused]=\"isFocused\"\r\n [class.mrx-input-error]=\"getInvalid\"\r\n [class]=\"getClasses\"\r\n>\r\n <jodit-editor\r\n #editorElementRef\r\n [config]=\"defaultConfig\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n (onFocus)=\"changeFocused(true)\"\r\n (onBlur)=\"onBlur(false)\"\r\n ></jodit-editor>\r\n\r\n <mrx-error-message\r\n *ngIf=\"getInvalid && getInvalidMessage\"\r\n [invalidMessage]=\"getInvalidMessage\"\r\n ></mrx-error-message>\r\n\r\n <mrx-save-state type=\"editor\" [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n\r\n<br>\r\n<br>\r\n<br>\r\n<br>\r\n\r\n<div>\r\n <mrx-chars-left\r\n *ngIf=\"!disabled && maxLength\"\r\n [valueLength]=\"valueLength\"\r\n [maxlength]=\"maxLength\"\r\n ></mrx-chars-left>\r\n</div>\r\n", styles: [":host::ng-deep .mrx-editor .jodit-toolbar__box:not(:empty){background-color:#fff;padding:4px}:host::ng-deep .mrx-editor .jodit-toolbar__box .jodit-toolbar-collection_size_middle.jodit-toolbar-collection_mode_horizontal,:host::ng-deep .mrx-editor .jodit-toolbar__box .jodit-toolbar-collection_size_middle.jodit-toolbar-editor-collection_mode_horizontal,:host::ng-deep .mrx-editor .jodit-toolbar__box .jodit-toolbar-editor-collection_size_middle.jodit-toolbar-collection_mode_horizontal,:host::ng-deep .mrx-editor .jodit-toolbar__box .jodit-toolbar-editor-collection_size_middle.jodit-toolbar-editor-collection_mode_horizontal{background-image:none}:host::ng-deep .mrx-editor .jodit-toolbar__box .jodit-toolbar-editor-collection:after{display:none}:host::ng-deep .mrx-editor .jodit-ui-group{flex-wrap:wrap;gap:var(--sizing-1)}:host::ng-deep .mrx-editor .jodit-toolbar-button{height:28px;margin:0;border:none}:host::ng-deep .mrx-editor .jodit-toolbar-button.jodit-toolbar-button_with-trigger_true:hover:not([disabled]){border-color:transparent;box-shadow:0 1px 4px #3a3a3a4d}:host::ng-deep .mrx-editor .jodit-toolbar-button .jodit-toolbar-button__button{height:28px}:host::ng-deep .mrx-editor .jodit-toolbar-button .jodit-toolbar-button__button:hover:not([disabled]){background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-editor .jodit-toolbar-button .jodit-toolbar-button__button[aria-pressed=true]:not([disabled]){background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-editor .jodit-toolbar-button .jodit-toolbar-button__trigger:hover:not([disabled]){background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-editor .jodit-ui-separator{border-color:var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-editor .jodit-add-new-line{display:none}:host::ng-deep .mrx-editor{position:relative}:host::ng-deep .mrx-editor .jodit-container .jodit-wysiwyg{padding:var(--spacing-3) var(--spacing-4)}:host::ng-deep .mrx-editor .jodit-container:not(.jodit_inline).jodit_disabled .jodit-toolbar__box{background-color:var(--neutral-bg-island-default)}:host::ng-deep .mrx-editor .jodit-container:not(.jodit_inline).jodit_disabled .jodit-workplace{opacity:1;background-color:var(--neutral-bg-disabled)}:host::ng-deep .mrx-editor.mrx-input-error .jodit-container,:host::ng-deep .mrx-editor.mrx-input-checked-error .jodit-container{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)!important}:host::ng-deep .mrx-editor.mrx-input-error .jodit-container .jodit-toolbar__box:not(:empty),:host::ng-deep .mrx-editor.mrx-input-checked-error .jodit-container .jodit-toolbar__box:not(:empty){border-bottom:var(--border-width-default) solid var(--system-bg-controls-negative-default)!important}:host::ng-deep .mrx-editor.mrx-input-success .jodit-container,:host::ng-deep .mrx-editor.mrx-input-checked-success .jodit-container{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)!important}:host::ng-deep .mrx-editor.mrx-input-success .jodit-container .jodit-toolbar__box:not(:empty),:host::ng-deep .mrx-editor.mrx-input-checked-success .jodit-container .jodit-toolbar__box:not(:empty){border-bottom:var(--border-width-default) solid var(--system-bg-controls-positive-default)!important}:host::ng-deep .mrx-editor.mrx-input-checked-error .jodit-workplace{background-color:var(--system-bg-negative-secondary)!important}:host::ng-deep .mrx-editor.mrx-input-checked-success .jodit-workplace{background-color:var(--system-bg-positive-secondary)!important}:host::ng-deep .mrx-editor .jodit-container{transition:border .2s;border:var(--border-width-default) solid var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-editor .jodit-container:not(.jodit_inline),:host::ng-deep .mrx-editor .jodit-container .jodit-workplace{border-radius:4px}:host::ng-deep .mrx-editor .jodit-container .jodit-toolbar__box:not(:empty){transition:border .2s;border-bottom:var(--border-width-default) solid var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-editor .jodit-container:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}:host::ng-deep .mrx-editor .jodit-container:hover .jodit-toolbar__box:not(:empty){border-bottom:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}:host::ng-deep .mrx-editor.mrx-input-focused .jodit-container{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}::ng-deep .jodit.jodit-popup-container .jodit-popup .jodit-popup__content:not(:empty){background-color:#fff;padding:4px}::ng-deep .jodit.jodit-popup-container .jodit-popup .jodit-ui-group{flex-wrap:wrap;gap:var(--sizing-1)}::ng-deep .jodit.jodit-popup-container .jodit-popup .jodit-toolbar-button.jodit-toolbar-button_with-trigger_true:hover:not([disabled]){border-color:transparent;box-shadow:0 1px 4px #3a3a3a4d}::ng-deep .jodit.jodit-popup-container .jodit-popup .jodit-toolbar-button .jodit-toolbar-button__button:hover:not([disabled]){background-color:var(--brand-bg-tertiary-hover)}::ng-deep .jodit.jodit-popup-container .jodit-popup .jodit-toolbar-button .jodit-toolbar-button__trigger:hover:not([disabled]){background-color:var(--brand-bg-tertiary-hover)}::ng-deep .jodit.jodit-popup-container .jodit-toolbar-button_nullable{display:none!important}::ng-deep .jodit.jodit-popup-container .jodit-form__table-creator-box .jodit-form__container span.jodit_hovered{background-color:var(--system-diagram-diagram-2);border-color:var(--system-diagram-diagram-2)}::ng-deep .jodit.jodit-popup-container .jodit-popup__content .jodit-ui-checkbox__wrapper .jodit-ui-checkbox__input{-webkit-appearance:checkbox!important;position:static!important;width:auto!important}\n"], components: [{ type: i1$8.JoditAngularComponent, selector: "jodit-editor", inputs: ["config", "tagName", "id", "defaultValue"] }, { type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }, { type: CharsLeftComponent, selector: "mrx-chars-left", inputs: ["maxlength", "valueLength", "value"] }], directives: [{ type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10500
10514
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EditorComponent, decorators: [{
|
|
10501
10515
|
type: Component,
|
|
10502
10516
|
args: [{ selector: 'mrx-editor', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
@@ -10505,7 +10519,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
10505
10519
|
useExisting: forwardRef(() => EditorComponent),
|
|
10506
10520
|
multi: true,
|
|
10507
10521
|
},
|
|
10508
|
-
], template: "<div\r\n class=\"mrx-editor\"\r\n [class.mrx-input-focused]=\"isFocused\"\r\n [class.mrx-input-error]=\"getInvalid\"\r\n [class]=\"getClasses\"\r\n>\r\n <jodit-editor\r\n #editorElementRef\r\n [config]=\"defaultConfig\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n (onFocus)=\"changeFocused(true)\"\r\n (onBlur)=\"onBlur(false)\"\r\n ></jodit-editor>\r\n\r\n <mrx-
|
|
10522
|
+
], template: "<div\r\n class=\"mrx-editor\"\r\n [class.mrx-input-focused]=\"isFocused\"\r\n [class.mrx-input-error]=\"getInvalid\"\r\n [class]=\"getClasses\"\r\n>\r\n <jodit-editor\r\n #editorElementRef\r\n [config]=\"defaultConfig\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n (onFocus)=\"changeFocused(true)\"\r\n (onBlur)=\"onBlur(false)\"\r\n ></jodit-editor>\r\n\r\n <mrx-error-message\r\n *ngIf=\"getInvalid && getInvalidMessage\"\r\n [invalidMessage]=\"getInvalidMessage\"\r\n ></mrx-error-message>\r\n\r\n <mrx-save-state type=\"editor\" [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n\r\n<br>\r\n<br>\r\n<br>\r\n<br>\r\n\r\n<div>\r\n <mrx-chars-left\r\n *ngIf=\"!disabled && maxLength\"\r\n [valueLength]=\"valueLength\"\r\n [maxlength]=\"maxLength\"\r\n ></mrx-chars-left>\r\n</div>\r\n", styles: [":host::ng-deep .mrx-editor .jodit-toolbar__box:not(:empty){background-color:#fff;padding:4px}:host::ng-deep .mrx-editor .jodit-toolbar__box .jodit-toolbar-collection_size_middle.jodit-toolbar-collection_mode_horizontal,:host::ng-deep .mrx-editor .jodit-toolbar__box .jodit-toolbar-collection_size_middle.jodit-toolbar-editor-collection_mode_horizontal,:host::ng-deep .mrx-editor .jodit-toolbar__box .jodit-toolbar-editor-collection_size_middle.jodit-toolbar-collection_mode_horizontal,:host::ng-deep .mrx-editor .jodit-toolbar__box .jodit-toolbar-editor-collection_size_middle.jodit-toolbar-editor-collection_mode_horizontal{background-image:none}:host::ng-deep .mrx-editor .jodit-toolbar__box .jodit-toolbar-editor-collection:after{display:none}:host::ng-deep .mrx-editor .jodit-ui-group{flex-wrap:wrap;gap:var(--sizing-1)}:host::ng-deep .mrx-editor .jodit-toolbar-button{height:28px;margin:0;border:none}:host::ng-deep .mrx-editor .jodit-toolbar-button.jodit-toolbar-button_with-trigger_true:hover:not([disabled]){border-color:transparent;box-shadow:0 1px 4px #3a3a3a4d}:host::ng-deep .mrx-editor .jodit-toolbar-button .jodit-toolbar-button__button{height:28px}:host::ng-deep .mrx-editor .jodit-toolbar-button .jodit-toolbar-button__button:hover:not([disabled]){background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-editor .jodit-toolbar-button .jodit-toolbar-button__button[aria-pressed=true]:not([disabled]){background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-editor .jodit-toolbar-button .jodit-toolbar-button__trigger:hover:not([disabled]){background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-editor .jodit-ui-separator{border-color:var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-editor .jodit-add-new-line{display:none}:host::ng-deep .mrx-editor{position:relative}:host::ng-deep .mrx-editor .jodit-container .jodit-wysiwyg{padding:var(--spacing-3) var(--spacing-4)}:host::ng-deep .mrx-editor .jodit-container:not(.jodit_inline).jodit_disabled .jodit-toolbar__box{background-color:var(--neutral-bg-island-default)}:host::ng-deep .mrx-editor .jodit-container:not(.jodit_inline).jodit_disabled .jodit-workplace{opacity:1;background-color:var(--neutral-bg-disabled)}:host::ng-deep .mrx-editor.mrx-input-error .jodit-container,:host::ng-deep .mrx-editor.mrx-input-checked-error .jodit-container{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)!important}:host::ng-deep .mrx-editor.mrx-input-error .jodit-container .jodit-toolbar__box:not(:empty),:host::ng-deep .mrx-editor.mrx-input-checked-error .jodit-container .jodit-toolbar__box:not(:empty){border-bottom:var(--border-width-default) solid var(--system-bg-controls-negative-default)!important}:host::ng-deep .mrx-editor.mrx-input-success .jodit-container,:host::ng-deep .mrx-editor.mrx-input-checked-success .jodit-container{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)!important}:host::ng-deep .mrx-editor.mrx-input-success .jodit-container .jodit-toolbar__box:not(:empty),:host::ng-deep .mrx-editor.mrx-input-checked-success .jodit-container .jodit-toolbar__box:not(:empty){border-bottom:var(--border-width-default) solid var(--system-bg-controls-positive-default)!important}:host::ng-deep .mrx-editor.mrx-input-checked-error .jodit-workplace{background-color:var(--system-bg-negative-secondary)!important}:host::ng-deep .mrx-editor.mrx-input-checked-success .jodit-workplace{background-color:var(--system-bg-positive-secondary)!important}:host::ng-deep .mrx-editor .jodit-container{transition:border .2s;border:var(--border-width-default) solid var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-editor .jodit-container:not(.jodit_inline),:host::ng-deep .mrx-editor .jodit-container .jodit-workplace{border-radius:4px}:host::ng-deep .mrx-editor .jodit-container .jodit-toolbar__box:not(:empty){transition:border .2s;border-bottom:var(--border-width-default) solid var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-editor .jodit-container:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}:host::ng-deep .mrx-editor .jodit-container:hover .jodit-toolbar__box:not(:empty){border-bottom:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}:host::ng-deep .mrx-editor.mrx-input-focused .jodit-container{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}::ng-deep .jodit.jodit-popup-container .jodit-popup .jodit-popup__content:not(:empty){background-color:#fff;padding:4px}::ng-deep .jodit.jodit-popup-container .jodit-popup .jodit-ui-group{flex-wrap:wrap;gap:var(--sizing-1)}::ng-deep .jodit.jodit-popup-container .jodit-popup .jodit-toolbar-button.jodit-toolbar-button_with-trigger_true:hover:not([disabled]){border-color:transparent;box-shadow:0 1px 4px #3a3a3a4d}::ng-deep .jodit.jodit-popup-container .jodit-popup .jodit-toolbar-button .jodit-toolbar-button__button:hover:not([disabled]){background-color:var(--brand-bg-tertiary-hover)}::ng-deep .jodit.jodit-popup-container .jodit-popup .jodit-toolbar-button .jodit-toolbar-button__trigger:hover:not([disabled]){background-color:var(--brand-bg-tertiary-hover)}::ng-deep .jodit.jodit-popup-container .jodit-toolbar-button_nullable{display:none!important}::ng-deep .jodit.jodit-popup-container .jodit-form__table-creator-box .jodit-form__container span.jodit_hovered{background-color:var(--system-diagram-diagram-2);border-color:var(--system-diagram-diagram-2)}::ng-deep .jodit.jodit-popup-container .jodit-popup__content .jodit-ui-checkbox__wrapper .jodit-ui-checkbox__input{-webkit-appearance:checkbox!important;position:static!important;width:auto!important}\n"] }]
|
|
10509
10523
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { fields: [{
|
|
10510
10524
|
type: Input
|
|
10511
10525
|
}], toolbar: [{
|