@syncfusion/ej2-richtexteditor 23.2.7 → 24.1.43
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/CHANGELOG.md +35 -1
- package/dist/ej2-richtexteditor.min.js +2 -2
- package/dist/ej2-richtexteditor.umd.min.js +2 -2
- package/dist/ej2-richtexteditor.umd.min.js.map +1 -1
- package/dist/es6/ej2-richtexteditor.es2015.js +574 -309
- package/dist/es6/ej2-richtexteditor.es2015.js.map +1 -1
- package/dist/es6/ej2-richtexteditor.es5.js +573 -308
- package/dist/es6/ej2-richtexteditor.es5.js.map +1 -1
- package/dist/global/ej2-richtexteditor.min.js +2 -2
- package/dist/global/ej2-richtexteditor.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +13 -13
- package/src/common/config.js +1 -1
- package/src/editor-manager/plugin/audio.js +13 -3
- package/src/editor-manager/plugin/dom-node.js +1 -14
- package/src/editor-manager/plugin/image.js +30 -3
- package/src/editor-manager/plugin/inserthtml.js +5 -2
- package/src/editor-manager/plugin/ms-word-clean-up.js +4 -1
- package/src/editor-manager/plugin/nodecutter.js +1 -1
- package/src/editor-manager/plugin/selection-commands.js +39 -0
- package/src/rich-text-editor/actions/base-quick-toolbar.js +18 -4
- package/src/rich-text-editor/actions/color-picker.js +3 -3
- package/src/rich-text-editor/actions/dropdown-buttons.js +4 -2
- package/src/rich-text-editor/actions/emoji-picker.js +12 -3
- package/src/rich-text-editor/actions/enter-key.js +2 -1
- package/src/rich-text-editor/actions/file-manager.js +1 -1
- package/src/rich-text-editor/actions/format-painter.js +1 -1
- package/src/rich-text-editor/actions/full-screen.js +2 -2
- package/src/rich-text-editor/actions/html-editor.d.ts +2 -0
- package/src/rich-text-editor/actions/html-editor.js +36 -5
- package/src/rich-text-editor/actions/paste-clean-up.d.ts +2 -0
- package/src/rich-text-editor/actions/paste-clean-up.js +75 -19
- package/src/rich-text-editor/actions/quick-toolbar.js +24 -5
- package/src/rich-text-editor/actions/toolbar.d.ts +1 -0
- package/src/rich-text-editor/actions/toolbar.js +18 -10
- package/src/rich-text-editor/base/classes.d.ts +5 -0
- package/src/rich-text-editor/base/classes.js +5 -0
- package/src/rich-text-editor/base/constant.d.ts +6 -1
- package/src/rich-text-editor/base/constant.js +6 -1
- package/src/rich-text-editor/base/interface.d.ts +11 -0
- package/src/rich-text-editor/base/rich-text-editor-model.d.ts +1 -1
- package/src/rich-text-editor/base/rich-text-editor.d.ts +9 -0
- package/src/rich-text-editor/base/rich-text-editor.js +80 -17
- package/src/rich-text-editor/base/util.js +11 -2
- package/src/rich-text-editor/formatter/formatter.js +1 -1
- package/src/rich-text-editor/models/default-locale.js +2 -0
- package/src/rich-text-editor/models/items.js +1 -1
- package/src/rich-text-editor/renderer/dialog-renderer.js +10 -1
- package/src/rich-text-editor/renderer/image-module.js +68 -59
- package/src/rich-text-editor/renderer/link-module.js +43 -23
- package/src/rich-text-editor/renderer/table-module.d.ts +2 -0
- package/src/rich-text-editor/renderer/table-module.js +43 -30
- package/src/rich-text-editor/renderer/toolbar-renderer.d.ts +0 -6
- package/src/rich-text-editor/renderer/toolbar-renderer.js +13 -93
- package/src/rich-text-editor/renderer/view-source.js +3 -1
- package/styles/bootstrap-dark.css +194 -52
- package/styles/bootstrap.css +197 -53
- package/styles/bootstrap4.css +194 -52
- package/styles/bootstrap5-dark.css +195 -53
- package/styles/bootstrap5.css +195 -53
- package/styles/fabric-dark.css +194 -52
- package/styles/fabric.css +194 -52
- package/styles/fluent-dark.css +197 -53
- package/styles/fluent.css +197 -53
- package/styles/highcontrast-light.css +194 -52
- package/styles/highcontrast.css +194 -52
- package/styles/material-dark.css +196 -53
- package/styles/material.css +196 -53
- package/styles/material3-dark.css +194 -52
- package/styles/material3.css +194 -52
- package/styles/rich-text-editor/_bootstrap5-definition.scss +1 -1
- package/styles/rich-text-editor/_fluent-definition.scss +1 -1
- package/styles/rich-text-editor/_layout.scss +78 -3
- package/styles/rich-text-editor/_theme.scss +1 -1
- package/styles/rich-text-editor/bootstrap-dark.css +194 -52
- package/styles/rich-text-editor/bootstrap.css +197 -53
- package/styles/rich-text-editor/bootstrap4.css +194 -52
- package/styles/rich-text-editor/bootstrap5-dark.css +195 -53
- package/styles/rich-text-editor/bootstrap5.css +195 -53
- package/styles/rich-text-editor/fabric-dark.css +194 -52
- package/styles/rich-text-editor/fabric.css +194 -52
- package/styles/rich-text-editor/fluent-dark.css +197 -53
- package/styles/rich-text-editor/fluent.css +197 -53
- package/styles/rich-text-editor/highcontrast-light.css +194 -52
- package/styles/rich-text-editor/highcontrast.css +194 -52
- package/styles/rich-text-editor/icons/_bootstrap-dark.scss +3 -3
- package/styles/rich-text-editor/icons/_bootstrap.scss +3 -3
- package/styles/rich-text-editor/icons/_bootstrap4.scss +3 -3
- package/styles/rich-text-editor/icons/_bootstrap5.scss +3 -3
- package/styles/rich-text-editor/icons/_fabric-dark.scss +3 -3
- package/styles/rich-text-editor/icons/_fabric.scss +3 -3
- package/styles/rich-text-editor/icons/_fluent.scss +3 -3
- package/styles/rich-text-editor/icons/_fusionnew.scss +3 -3
- package/styles/rich-text-editor/icons/_highcontrast-light.scss +3 -3
- package/styles/rich-text-editor/icons/_highcontrast.scss +3 -3
- package/styles/rich-text-editor/icons/_material-dark.scss +3 -3
- package/styles/rich-text-editor/icons/_material.scss +3 -3
- package/styles/rich-text-editor/icons/_material3.scss +3 -3
- package/styles/rich-text-editor/icons/_tailwind.scss +3 -3
- package/styles/rich-text-editor/material-dark.css +196 -53
- package/styles/rich-text-editor/material.css +196 -53
- package/styles/rich-text-editor/material3-dark.css +194 -52
- package/styles/rich-text-editor/material3.css +194 -52
- package/styles/rich-text-editor/tailwind-dark.css +194 -52
- package/styles/rich-text-editor/tailwind.css +194 -52
- package/styles/tailwind-dark.css +194 -52
- package/styles/tailwind.css +194 -52
|
@@ -64,6 +64,8 @@ export declare class PasteCleanup {
|
|
|
64
64
|
private removeTempClass;
|
|
65
65
|
private sanitizeHelper;
|
|
66
66
|
private plainFormatting;
|
|
67
|
+
private removingComments;
|
|
68
|
+
private reframeToBrContent;
|
|
67
69
|
private getTextContent;
|
|
68
70
|
private detachInlineElements;
|
|
69
71
|
private findDetachEmptyElem;
|
|
@@ -66,6 +66,7 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
66
66
|
event: e
|
|
67
67
|
};
|
|
68
68
|
var value = null;
|
|
69
|
+
var isClipboardHTMLDataNull = false;
|
|
69
70
|
var imageproperties;
|
|
70
71
|
if (e.args && !isNOU(e.args.clipboardData)) {
|
|
71
72
|
value = e.args.clipboardData.getData('text/html');
|
|
@@ -104,6 +105,7 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
104
105
|
var divElement = this.parent.createElement('div');
|
|
105
106
|
divElement.innerHTML = this.splitBreakLine(value);
|
|
106
107
|
value = divElement.innerHTML;
|
|
108
|
+
isClipboardHTMLDataNull = true;
|
|
107
109
|
}
|
|
108
110
|
}
|
|
109
111
|
else if (value.length > 0) {
|
|
@@ -125,10 +127,16 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
125
127
|
tempDivElem.innerHTML = value;
|
|
126
128
|
var isValueNotEmpty = tempDivElem.textContent !== '' || !isNOU(tempDivElem.querySelector('img')) ||
|
|
127
129
|
!isNOU(tempDivElem.querySelector('table'));
|
|
130
|
+
this.parent.notify(events.cleanupResizeElements, {
|
|
131
|
+
value: value,
|
|
132
|
+
callBack: function (currentValue) {
|
|
133
|
+
value = currentValue;
|
|
134
|
+
}
|
|
135
|
+
});
|
|
128
136
|
if (this.parent.pasteCleanupSettings.prompt) {
|
|
129
137
|
if (isValueNotEmpty) {
|
|
130
138
|
e.args.preventDefault();
|
|
131
|
-
this.pasteDialog(value, args);
|
|
139
|
+
this.pasteDialog(value, args, isClipboardHTMLDataNull);
|
|
132
140
|
}
|
|
133
141
|
else if (Browser.userAgent.indexOf('Firefox') !== -1 && isNOU(file)) {
|
|
134
142
|
this.fireFoxImageUpload();
|
|
@@ -140,7 +148,7 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
140
148
|
}
|
|
141
149
|
else if (this.parent.pasteCleanupSettings.plainText) {
|
|
142
150
|
e.args.preventDefault();
|
|
143
|
-
this.plainFormatting(value, args);
|
|
151
|
+
this.plainFormatting(value, args, isClipboardHTMLDataNull);
|
|
144
152
|
}
|
|
145
153
|
else if (this.parent.pasteCleanupSettings.keepFormat) {
|
|
146
154
|
e.args.preventDefault();
|
|
@@ -182,13 +190,17 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
182
190
|
PasteCleanup.prototype.splitBreakLine = function (value) {
|
|
183
191
|
var enterSplitText = value.split('\n');
|
|
184
192
|
var contentInnerElem = '';
|
|
193
|
+
var startNode = this.parent.enterKey === 'P' ? '<p>' : (this.parent.enterKey === 'DIV' ? '<div>' : '');
|
|
194
|
+
var endNode = this.parent.enterKey === 'P' ? '</p>' : (this.parent.enterKey === 'DIV' ? '</div>' : '<br>');
|
|
185
195
|
for (var i = 0; i < enterSplitText.length; i++) {
|
|
186
196
|
if (enterSplitText[i].trim() === '') {
|
|
187
197
|
contentInnerElem += getDefaultValue(this.parent);
|
|
188
198
|
}
|
|
189
199
|
else {
|
|
190
200
|
var contentWithSpace = this.makeSpace(enterSplitText[i]);
|
|
191
|
-
contentInnerElem += '<
|
|
201
|
+
contentInnerElem += (i === 0 && this.parent.enterKey !== 'BR' ? '<span>' : startNode) +
|
|
202
|
+
(contentWithSpace.trim() === '' ? '<br>' : contentWithSpace.trim()) +
|
|
203
|
+
(enterSplitText.length - 1 === i && this.parent.enterKey === 'BR' ? '' : (i === 0 && this.parent.enterKey !== 'BR' ? '</span>' : endNode));
|
|
192
204
|
}
|
|
193
205
|
}
|
|
194
206
|
return contentInnerElem;
|
|
@@ -457,10 +469,10 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
457
469
|
var range = this.nodeSelectionObj.getRange(currentDocument);
|
|
458
470
|
this.saveSelection = this.nodeSelectionObj.save(range, currentDocument);
|
|
459
471
|
if (this.parent.pasteCleanupSettings.prompt) {
|
|
460
|
-
this.pasteDialog(imageValue, pasteArgs);
|
|
472
|
+
this.pasteDialog(imageValue, pasteArgs, false);
|
|
461
473
|
}
|
|
462
474
|
else if (this.parent.pasteCleanupSettings.plainText) {
|
|
463
|
-
this.plainFormatting(imageValue, pasteArgs);
|
|
475
|
+
this.plainFormatting(imageValue, pasteArgs, false);
|
|
464
476
|
}
|
|
465
477
|
else if (this.parent.pasteCleanupSettings.keepFormat) {
|
|
466
478
|
this.formatting(imageValue, false, pasteArgs);
|
|
@@ -484,7 +496,7 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
484
496
|
var plainTextElement = this.parent.element.querySelector('#plainTextFormat');
|
|
485
497
|
this.plainTextRadioButton.appendTo(plainTextElement);
|
|
486
498
|
};
|
|
487
|
-
PasteCleanup.prototype.selectFormatting = function (value, args, keepChecked, cleanChecked) {
|
|
499
|
+
PasteCleanup.prototype.selectFormatting = function (value, args, keepChecked, cleanChecked, isClipboardHTMLDataNull) {
|
|
488
500
|
if (keepChecked) {
|
|
489
501
|
this.formatting(value, false, args);
|
|
490
502
|
}
|
|
@@ -492,10 +504,10 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
492
504
|
this.formatting(value, true, args);
|
|
493
505
|
}
|
|
494
506
|
else {
|
|
495
|
-
this.plainFormatting(value, args);
|
|
507
|
+
this.plainFormatting(value, args, isClipboardHTMLDataNull);
|
|
496
508
|
}
|
|
497
509
|
};
|
|
498
|
-
PasteCleanup.prototype.pasteDialog = function (value, args) {
|
|
510
|
+
PasteCleanup.prototype.pasteDialog = function (value, args, isClipboardHTMLDataNull) {
|
|
499
511
|
var _this = this;
|
|
500
512
|
var isHeight = false;
|
|
501
513
|
var preRTEHeight = this.parent.height;
|
|
@@ -512,7 +524,7 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
512
524
|
var argument = _this.dialogObj;
|
|
513
525
|
_this.dialogRenderObj.close(argument);
|
|
514
526
|
_this.dialogObj.destroy();
|
|
515
|
-
_this.selectFormatting(value, args, keepChecked, cleanChecked);
|
|
527
|
+
_this.selectFormatting(value, args, keepChecked, cleanChecked, isClipboardHTMLDataNull);
|
|
516
528
|
}
|
|
517
529
|
},
|
|
518
530
|
buttonModel: {
|
|
@@ -573,7 +585,7 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
573
585
|
isHeight = true;
|
|
574
586
|
}
|
|
575
587
|
this.dialogObj.show();
|
|
576
|
-
this.setCssClass({ cssClass: this.parent.
|
|
588
|
+
this.setCssClass({ cssClass: this.parent.getCssClass() });
|
|
577
589
|
};
|
|
578
590
|
PasteCleanup.prototype.updateCss = function (currentObj, e) {
|
|
579
591
|
if (currentObj && e.cssClass) {
|
|
@@ -786,7 +798,7 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
786
798
|
return value;
|
|
787
799
|
};
|
|
788
800
|
//Plain Formatting
|
|
789
|
-
PasteCleanup.prototype.plainFormatting = function (value, args) {
|
|
801
|
+
PasteCleanup.prototype.plainFormatting = function (value, args, isClipboardHTMLDataNull) {
|
|
790
802
|
var _this = this;
|
|
791
803
|
var clipBoardElem = this.parent.createElement('div', { className: 'pasteContent', styles: 'display:inline;' });
|
|
792
804
|
clipBoardElem.innerHTML = value;
|
|
@@ -824,6 +836,13 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
824
836
|
this.saveSelection.restore();
|
|
825
837
|
clipBoardElem.innerHTML = this.sanitizeHelper(clipBoardElem.innerHTML);
|
|
826
838
|
this.addTempClass(clipBoardElem);
|
|
839
|
+
this.removingComments(clipBoardElem);
|
|
840
|
+
if (this.parent.enterKey === 'BR' && !isClipboardHTMLDataNull) {
|
|
841
|
+
clipBoardElem = this.reframeToBrContent(clipBoardElem);
|
|
842
|
+
}
|
|
843
|
+
else if (this.parent.enterKey === 'DIV') {
|
|
844
|
+
clipBoardElem.innerHTML = clipBoardElem.innerHTML.replace(/<p class="pasteContent_RTE">/g, '<div>').replace(/<\/p>/g, '</div>');
|
|
845
|
+
}
|
|
827
846
|
this.parent.trigger(events.afterPasteCleanup, { value: clipBoardElem.innerHTML, filesData: null }, function (updatedArgs) { value = updatedArgs.value; });
|
|
828
847
|
clipBoardElem.innerHTML = value;
|
|
829
848
|
this.parent.formatter.editorManager.execCommand('inserthtml', 'pasteCleanup', args, function (returnArgs) {
|
|
@@ -838,6 +857,41 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
838
857
|
this.parent.formatter.onSuccess(this.parent, args);
|
|
839
858
|
}
|
|
840
859
|
};
|
|
860
|
+
PasteCleanup.prototype.removingComments = function (elm) {
|
|
861
|
+
var innerElement = elm.innerHTML;
|
|
862
|
+
innerElement = innerElement.replace(/<!--[\s\S]*?-->/g, '');
|
|
863
|
+
elm.innerHTML = innerElement;
|
|
864
|
+
};
|
|
865
|
+
PasteCleanup.prototype.reframeToBrContent = function (clipBoardElem) {
|
|
866
|
+
var newClipBoardElem = this.parent.createElement('div', { className: 'pasteContent', styles: 'display:inline;' });
|
|
867
|
+
while (!isNOU(clipBoardElem.firstChild)) {
|
|
868
|
+
var brElem = this.parent.createElement('br');
|
|
869
|
+
var currentFirstChild = clipBoardElem.firstChild;
|
|
870
|
+
if (currentFirstChild.nodeName === '#text') {
|
|
871
|
+
var isNextSibPresent = !isNOU(currentFirstChild.nextSibling);
|
|
872
|
+
newClipBoardElem.appendChild(currentFirstChild);
|
|
873
|
+
if (isNextSibPresent) {
|
|
874
|
+
newClipBoardElem.appendChild(brElem);
|
|
875
|
+
}
|
|
876
|
+
}
|
|
877
|
+
else {
|
|
878
|
+
var isCurrentNodeBRElm = currentFirstChild.nodeName === 'BR';
|
|
879
|
+
if (isCurrentNodeBRElm) {
|
|
880
|
+
newClipBoardElem.appendChild(currentFirstChild);
|
|
881
|
+
}
|
|
882
|
+
else {
|
|
883
|
+
newClipBoardElem.appendChild(currentFirstChild.childNodes[0]);
|
|
884
|
+
}
|
|
885
|
+
if (!isNOU(currentFirstChild) && !isNOU(currentFirstChild.nextSibling)) {
|
|
886
|
+
newClipBoardElem.appendChild(brElem);
|
|
887
|
+
}
|
|
888
|
+
if (!isCurrentNodeBRElm && !isNOU(currentFirstChild)) {
|
|
889
|
+
detach(currentFirstChild);
|
|
890
|
+
}
|
|
891
|
+
}
|
|
892
|
+
}
|
|
893
|
+
return newClipBoardElem;
|
|
894
|
+
};
|
|
841
895
|
PasteCleanup.prototype.getTextContent = function (clipBoardElem) {
|
|
842
896
|
for (var i = 0; i < this.blockNode.length; i++) {
|
|
843
897
|
var inElem = clipBoardElem.querySelectorAll(this.blockNode[i]);
|
|
@@ -885,14 +939,16 @@ var PasteCleanup = /** @class */ (function () {
|
|
|
885
939
|
for (var i = 0; i < this.inlineNode.length; i++) {
|
|
886
940
|
var inElem = clipBoardElem.querySelectorAll(this.inlineNode[i]);
|
|
887
941
|
for (var j = 0; j < inElem.length; j++) {
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
942
|
+
if (!(inElem[j] === clipBoardElem.firstChild && inElem[j].nodeName === 'SPAN')) {
|
|
943
|
+
var parElem = void 0;
|
|
944
|
+
for (var k = 0; k < inElem[j].childNodes.length; k++) {
|
|
945
|
+
parElem = inElem[j].childNodes[k].parentElement;
|
|
946
|
+
inElem[j].childNodes[k].parentElement.parentElement.insertBefore(inElem[j].childNodes[k], inElem[j].childNodes[k].parentElement);
|
|
947
|
+
k--;
|
|
948
|
+
}
|
|
949
|
+
if (!isNOU(parElem)) {
|
|
950
|
+
detach(parElem);
|
|
951
|
+
}
|
|
896
952
|
}
|
|
897
953
|
}
|
|
898
954
|
}
|
|
@@ -47,7 +47,7 @@ var QuickToolbar = /** @class */ (function () {
|
|
|
47
47
|
toolbarItems: items,
|
|
48
48
|
mode: mode,
|
|
49
49
|
renderType: type,
|
|
50
|
-
cssClass: this.parent.
|
|
50
|
+
cssClass: this.parent.getCssClass()
|
|
51
51
|
};
|
|
52
52
|
};
|
|
53
53
|
/**
|
|
@@ -261,6 +261,9 @@ var QuickToolbar = /** @class */ (function () {
|
|
|
261
261
|
&& !isNullOrUndefined(select('.' + CLS_INLINE_POP, document))) {
|
|
262
262
|
this.hideInlineQTBar();
|
|
263
263
|
}
|
|
264
|
+
if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close')) {
|
|
265
|
+
this.textQTBar.hidePopup();
|
|
266
|
+
}
|
|
264
267
|
};
|
|
265
268
|
QuickToolbar.prototype.inlineQTBarMouseDownHandler = function () {
|
|
266
269
|
if ((this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice()))
|
|
@@ -274,8 +277,8 @@ var QuickToolbar = /** @class */ (function () {
|
|
|
274
277
|
}
|
|
275
278
|
};
|
|
276
279
|
QuickToolbar.prototype.keyUpHandler = function (e) {
|
|
280
|
+
var args = e.args;
|
|
277
281
|
if (this.parent.inlineMode.enable && !Browser.isDevice) {
|
|
278
|
-
var args = e.args;
|
|
279
282
|
if (this.parent.inlineMode.onSelection) {
|
|
280
283
|
if (this.parent.getSelection().length > 0) {
|
|
281
284
|
if ((args.ctrlKey && args.keyCode === 65) || (args.shiftKey && (args.keyCode === 33 || args.keyCode === 34 ||
|
|
@@ -288,6 +291,13 @@ var QuickToolbar = /** @class */ (function () {
|
|
|
288
291
|
}
|
|
289
292
|
this.deBounce(this.offsetX, this.offsetY, args.target);
|
|
290
293
|
}
|
|
294
|
+
if (this.parent.quickToolbarSettings.text && !Browser.isDevice) {
|
|
295
|
+
if ((args.ctrlKey && args.keyCode === 65) || (args.shiftKey && (args.keyCode === 33 || args.keyCode === 34 ||
|
|
296
|
+
args.keyCode === 35 || args.keyCode === 36 || args.keyCode === 37 || args.keyCode === 38 ||
|
|
297
|
+
args.keyCode === 39 || args.keyCode === 40))) {
|
|
298
|
+
this.textQTBar.showPopup(this.offsetX, this.offsetY, args.target, 'text');
|
|
299
|
+
}
|
|
300
|
+
}
|
|
291
301
|
};
|
|
292
302
|
QuickToolbar.prototype.selectionChangeHandler = function (e) {
|
|
293
303
|
var _this = this;
|
|
@@ -447,6 +457,15 @@ var QuickToolbar = /** @class */ (function () {
|
|
|
447
457
|
if (this.videoQTBar && !hasClass(this.videoQTBar.element, 'e-popup-close')) {
|
|
448
458
|
this.videoQTBar.hidePopup();
|
|
449
459
|
}
|
|
460
|
+
if (this.tableQTBar && !hasClass(this.tableQTBar.element, 'e-popup-close')) {
|
|
461
|
+
this.tableQTBar.hidePopup();
|
|
462
|
+
}
|
|
463
|
+
if (this.linkQTBar && !hasClass(this.linkQTBar.element, 'e-popup-close')) {
|
|
464
|
+
this.linkQTBar.hidePopup();
|
|
465
|
+
}
|
|
466
|
+
if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close')) {
|
|
467
|
+
this.textQTBar.hidePopup();
|
|
468
|
+
}
|
|
450
469
|
}
|
|
451
470
|
};
|
|
452
471
|
QuickToolbar.prototype.onIframeMouseDown = function () {
|
|
@@ -499,6 +518,9 @@ var QuickToolbar = /** @class */ (function () {
|
|
|
499
518
|
|
|
500
519
|
*/
|
|
501
520
|
QuickToolbar.prototype.removeEventListener = function () {
|
|
521
|
+
if (this.deBouncer) {
|
|
522
|
+
clearTimeout(this.deBouncer);
|
|
523
|
+
}
|
|
502
524
|
if (this.parent.isDestroyed) {
|
|
503
525
|
return;
|
|
504
526
|
}
|
|
@@ -519,9 +541,6 @@ var QuickToolbar = /** @class */ (function () {
|
|
|
519
541
|
this.parent.off(events.rtlMode, this.setRtl);
|
|
520
542
|
this.parent.off(events.bindCssClass, this.setCssClass);
|
|
521
543
|
this.parent.off(events.hidePopup, this.hideQuickToolbars);
|
|
522
|
-
if (this.deBouncer) {
|
|
523
|
-
clearTimeout(this.deBouncer);
|
|
524
|
-
}
|
|
525
544
|
};
|
|
526
545
|
/**
|
|
527
546
|
* Called internally if any of the property value changed.
|
|
@@ -157,6 +157,7 @@ export declare class Toolbar {
|
|
|
157
157
|
private dropDownBeforeOpenHandler;
|
|
158
158
|
private tbFocusHandler;
|
|
159
159
|
private toolbarClickHandler;
|
|
160
|
+
private adjustContentHeight;
|
|
160
161
|
protected wireEvents(): void;
|
|
161
162
|
protected unWireEvents(): void;
|
|
162
163
|
protected addEventListener(): void;
|
|
@@ -52,6 +52,10 @@ var Toolbar = /** @class */ (function () {
|
|
|
52
52
|
case 'escape':
|
|
53
53
|
this.parent.contentModule.getEditPanel().focus();
|
|
54
54
|
break;
|
|
55
|
+
case 'enter':
|
|
56
|
+
if (e.target.classList.contains('e-hor-nav')) {
|
|
57
|
+
this.adjustContentHeight(e.target, true);
|
|
58
|
+
}
|
|
55
59
|
}
|
|
56
60
|
};
|
|
57
61
|
Toolbar.prototype.createToolbarElement = function () {
|
|
@@ -107,7 +111,7 @@ var Toolbar = /** @class */ (function () {
|
|
|
107
111
|
items: this.parent.toolbarSettings.items,
|
|
108
112
|
mode: tBarMode,
|
|
109
113
|
target: ele,
|
|
110
|
-
cssClass: this.parent.
|
|
114
|
+
cssClass: this.parent.getCssClass()
|
|
111
115
|
});
|
|
112
116
|
if (this.parent.toolbarSettings.type === ToolbarType.Expand) {
|
|
113
117
|
addClass([ele], ['e-rte-tb-mobile']);
|
|
@@ -226,7 +230,7 @@ var Toolbar = /** @class */ (function () {
|
|
|
226
230
|
items: this.parent.toolbarSettings.items,
|
|
227
231
|
mode: this.getToolbarMode(),
|
|
228
232
|
target: this.tbElement,
|
|
229
|
-
cssClass: this.parent.
|
|
233
|
+
cssClass: this.parent.getCssClass()
|
|
230
234
|
});
|
|
231
235
|
if (!this.parent.inlineMode.enable) {
|
|
232
236
|
if (this.parent.toolbarSettings.enableFloating) {
|
|
@@ -256,7 +260,7 @@ var Toolbar = /** @class */ (function () {
|
|
|
256
260
|
});
|
|
257
261
|
this.refreshToolbarOverflow();
|
|
258
262
|
}
|
|
259
|
-
var divEle = this.parent.element.querySelector('.
|
|
263
|
+
var divEle = this.parent.element.querySelector('.' + classes.CLS_RTE_SOURCE_CODE_TXTAREA);
|
|
260
264
|
var iframeEle = this.parent.element.querySelector('.e-source-content');
|
|
261
265
|
if ((!this.parent.iframeSettings.enable && (!isNOU(divEle) && divEle.style.display === 'block')) ||
|
|
262
266
|
(this.parent.iframeSettings.enable && (!isNOU(iframeEle) && iframeEle.style.display === 'block'))) {
|
|
@@ -386,7 +390,7 @@ var Toolbar = /** @class */ (function () {
|
|
|
386
390
|
baseToolbar.toolbarObj.enableItems(item, isEnable);
|
|
387
391
|
}
|
|
388
392
|
}
|
|
389
|
-
if (!select('.
|
|
393
|
+
if (!select('.' + classes.CLS_RTE_SOURCE_CODE_TXTAREA, this.parent.element) && !muteToolbarUpdate) {
|
|
390
394
|
updateUndoRedoStatus(baseToolbar, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());
|
|
391
395
|
}
|
|
392
396
|
};
|
|
@@ -559,20 +563,24 @@ var Toolbar = /** @class */ (function () {
|
|
|
559
563
|
};
|
|
560
564
|
Toolbar.prototype.toolbarClickHandler = function (e) {
|
|
561
565
|
var trg = closest(e.originalEvent.target, '.e-hor-nav');
|
|
566
|
+
this.adjustContentHeight(trg, false);
|
|
567
|
+
};
|
|
568
|
+
Toolbar.prototype.adjustContentHeight = function (trg, isKeyboard) {
|
|
562
569
|
if (trg && this.parent.toolbarSettings.type === ToolbarType.Expand && !isNOU(trg)) {
|
|
563
570
|
var extendedTbar = this.tbElement.querySelector('.e-toolbar-extended');
|
|
564
571
|
if (!isNOU(extendedTbar)) {
|
|
565
572
|
setStyleAttribute(extendedTbar, { maxHeight: '', display: 'block' });
|
|
566
573
|
setStyleAttribute(extendedTbar, { maxHeight: extendedTbar.offsetHeight + 'px', display: '' });
|
|
567
574
|
}
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
575
|
+
var hasActiveClass = trg.classList.contains('e-nav-active');
|
|
576
|
+
var isExpand = isKeyboard ? (hasActiveClass ? false : true) : (hasActiveClass ? true : false);
|
|
577
|
+
if (isExpand) {
|
|
578
|
+
addClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);
|
|
571
579
|
}
|
|
572
580
|
else {
|
|
573
|
-
|
|
574
|
-
this.parent.setContentHeight('toolbar', true);
|
|
581
|
+
removeClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);
|
|
575
582
|
}
|
|
583
|
+
this.parent.setContentHeight('toolbar', isExpand);
|
|
576
584
|
}
|
|
577
585
|
else if (Browser.isDevice || this.parent.inlineMode.enable) {
|
|
578
586
|
this.isToolbar = true;
|
|
@@ -696,7 +704,7 @@ var Toolbar = /** @class */ (function () {
|
|
|
696
704
|
this.addEventListener();
|
|
697
705
|
this.renderToolbar();
|
|
698
706
|
this.parent.wireScrollElementsEvents();
|
|
699
|
-
if (!select('.
|
|
707
|
+
if (!select('.' + classes.CLS_RTE_SOURCE_CODE_TXTAREA, this.parent.element)) {
|
|
700
708
|
updateUndoRedoStatus(this.baseToolbar, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());
|
|
701
709
|
}
|
|
702
710
|
this.parent.notify(events.dynamicModule, {});
|
|
@@ -730,7 +730,7 @@ export declare const emojiPicker: string;
|
|
|
730
730
|
* @hidden
|
|
731
731
|
|
|
732
732
|
*/
|
|
733
|
-
export declare const
|
|
733
|
+
export declare const destroyTooltip: string;
|
|
734
734
|
/**
|
|
735
735
|
* @hidden
|
|
736
736
|
|
|
@@ -739,6 +739,11 @@ export declare const hidePopup: string;
|
|
|
739
739
|
/**
|
|
740
740
|
* @hidden
|
|
741
741
|
|
|
742
|
+
*/
|
|
743
|
+
export declare const cleanupResizeElements: string;
|
|
744
|
+
/**
|
|
745
|
+
* @hidden
|
|
746
|
+
|
|
742
747
|
*/
|
|
743
748
|
export declare const blockEmptyNodes: string;
|
|
744
749
|
/**
|
|
@@ -730,7 +730,7 @@ export var emojiPicker = 'emojiPicker';
|
|
|
730
730
|
* @hidden
|
|
731
731
|
|
|
732
732
|
*/
|
|
733
|
-
export var
|
|
733
|
+
export var destroyTooltip = 'destroyTooltip';
|
|
734
734
|
/**
|
|
735
735
|
* @hidden
|
|
736
736
|
|
|
@@ -739,6 +739,11 @@ export var hidePopup = 'hidePopup';
|
|
|
739
739
|
/**
|
|
740
740
|
* @hidden
|
|
741
741
|
|
|
742
|
+
*/
|
|
743
|
+
export var cleanupResizeElements = 'cleanupResizeElements';
|
|
744
|
+
/**
|
|
745
|
+
* @hidden
|
|
746
|
+
|
|
742
747
|
*/
|
|
743
748
|
export var blockEmptyNodes = "address:empty, article:empty, aside:empty, blockquote:empty,\n details:empty, dd:empty, div:empty, dl:empty, dt:empty, fieldset:empty, footer:empty,form:empty, h1:empty,\n h2:empty, h3:empty, h4:empty, h5:empty, h6:empty, header:empty, hgroup:empty, li:empty, main:empty, nav:empty,\n noscript:empty, output:empty, p:empty, pre:empty, section:empty, td:empty, th:empty";
|
|
744
749
|
/**
|
|
@@ -159,6 +159,7 @@ export interface IRichTextEditor extends Component<HTMLElement> {
|
|
|
159
159
|
getCollection?(items: string | string[]): string[];
|
|
160
160
|
getRange(): Range;
|
|
161
161
|
getID(): string;
|
|
162
|
+
getCssClass(isSpace?: boolean): string;
|
|
162
163
|
getText(): string;
|
|
163
164
|
updateValueData?(): void;
|
|
164
165
|
getBaseToolbarObject(): BaseToolbar;
|
|
@@ -377,6 +378,7 @@ export interface IImageNotifyArgs {
|
|
|
377
378
|
member?: string;
|
|
378
379
|
name?: string;
|
|
379
380
|
cssClass?: string;
|
|
381
|
+
ariaLabel?: string;
|
|
380
382
|
}
|
|
381
383
|
/**
|
|
382
384
|
* Provides information about a Image added in the Rich Text Editor.
|
|
@@ -1368,3 +1370,12 @@ export interface ToolbarStatusEventArgs {
|
|
|
1368
1370
|
/** Defines the markdown toolbar status arguments. */
|
|
1369
1371
|
markdown?: object;
|
|
1370
1372
|
}
|
|
1373
|
+
/**
|
|
1374
|
+
* @hidden
|
|
1375
|
+
|
|
1376
|
+
*/
|
|
1377
|
+
export interface CleanupResizeElemArgs {
|
|
1378
|
+
name?: string;
|
|
1379
|
+
value: string;
|
|
1380
|
+
callBack(value: string): void;
|
|
1381
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Component, ModuleDeclaration, EventHandler, Complex, Browser, EmitType, addClass, select, detach } from '@syncfusion/ej2-base';import { Property, NotifyPropertyChanges, INotifyPropertyChanged, formatUnit, L10n, closest } from '@syncfusion/ej2-base';import { setStyleAttribute, Event, removeClass, print as printWindow, attributes } from '@syncfusion/ej2-base';import { isNullOrUndefined as isNOU, compile, append, extend, debounce } from '@syncfusion/ej2-base';import { Touch as EJ2Touch, TapEventArgs } from '@syncfusion/ej2-base';import { getScrollableParent, BeforeOpenEventArgs, BeforeCloseEventArgs } from '@syncfusion/ej2-popups';import * as events from '../base/constant';import * as classes from '../base/classes';import { Render } from '../renderer/render';import { ViewSource } from '../renderer/view-source';import { IRenderer, IFormatter, PrintEventArgs, ActionCompleteEventArgs, ActionBeginEventArgs, ImageDropEventArgs, IFormatPainterArgs } from './interface';import { IExecutionGroup, executeGroup, CommandName, ResizeArgs, StatusArgs, ToolbarStatusEventArgs } from './interface';import { BeforeQuickToolbarOpenArgs, ChangeEventArgs, AfterImageDeleteEventArgs, AfterMediaDeleteEventArgs, PasteCleanupArgs } from './interface';import { ILinkCommandsArgs, IImageCommandsArgs, IAudioCommandsArgs, IVideoCommandsArgs, BeforeSanitizeHtmlArgs, ITableCommandsArgs, ExecuteCommandOption } from './interface';import { ServiceLocator } from '../services/service-locator';import { RendererFactory } from '../services/renderer-factory';import { RenderType, ToolbarType, DialogType } from './enum';import { EditorMode, ShiftEnterKey, EnterKey } from './../../common/types';import { Toolbar } from '../actions/toolbar';import { ExecCommandCallBack } from '../actions/execute-command-callback';import { KeyboardEvents, KeyboardEventArgs } from '../actions/keyboard';import { FontFamilyModel, FontSizeModel, FontColorModel, FormatModel, BackgroundColorModel, NumberFormatListModel, BulletFormatListModel } from '../models/models';import { ToolbarSettingsModel, IFrameSettingsModel, ImageSettingsModel, AudioSettingsModel, VideoSettingsModel, TableSettingsModel } from '../models/models';import { QuickToolbarSettingsModel, InlineModeModel, PasteCleanupSettingsModel, FileManagerSettingsModel, FormatPainterSettingsModel, EmojiSettingsModel } from '../models/models';import { ToolbarSettings, ImageSettings, AudioSettings, VideoSettings, QuickToolbarSettings, FontFamily, FontSize, Format, NumberFormatList, BulletFormatList, FormatPainterSettings, EmojiSettings } from '../models/toolbar-settings';import { FileManagerSettings } from '../models/toolbar-settings';import { TableSettings, PasteCleanupSettings } from '../models/toolbar-settings';import { FontColor, BackgroundColor } from '../models/toolbar-settings';import { IFrameSettings } from '../models/iframe-settings';import { InlineMode } from '../models/inline-mode';import { Link } from '../renderer/link-module';import { Image } from '../renderer/image-module';import { Audio } from '../renderer/audio-module';import { Video } from '../renderer/video-module';import { Table } from '../renderer/table-module';import { Count } from '../actions/count';import { HtmlEditor } from '../actions/html-editor';import { MarkdownEditor } from '../actions/markdown-editor';import { defaultLocale } from '../models/default-locale';import { setAttributes } from '../actions/html-attributes';import { BaseToolbar } from '../actions/base-toolbar';import { QuickToolbar } from '../actions/quick-toolbar';import { FullScreen } from '../actions/full-screen';import { PasteCleanup } from '../actions/paste-clean-up';import { EnterKeyAction } from '../actions/enter-key';import * as CONSTANT from '../../common/constant';import { IHtmlKeyboardEvent } from '../../editor-manager/base/interface';import { dispatchEvent, getEditValue, isIDevice, decode, isEditableValueEmpty, getDefaultValue } from '../base/util';import { DialogRenderer } from '../renderer/dialog-renderer';import { SelectedEventArgs, RemovingEventArgs, UploadingEventArgs, BeforeUploadEventArgs } from '@syncfusion/ej2-inputs';import { Resize } from '../actions/resize';import { FileManager } from '../actions/file-manager';import { FormatPainter } from '../actions/format-painter';import { EmojiPicker } from '../actions/emoji-picker';
|
|
1
|
+
import { Component, ModuleDeclaration, EventHandler, Complex, Browser, EmitType, addClass, select, detach } from '@syncfusion/ej2-base';import { Property, NotifyPropertyChanges, INotifyPropertyChanged, formatUnit, L10n, closest } from '@syncfusion/ej2-base';import { setStyleAttribute, Event, removeClass, print as printWindow, attributes } from '@syncfusion/ej2-base';import { isNullOrUndefined as isNOU, compile, append, extend, debounce } from '@syncfusion/ej2-base';import { Touch as EJ2Touch, TapEventArgs } from '@syncfusion/ej2-base';import { getScrollableParent, BeforeOpenEventArgs, BeforeCloseEventArgs } from '@syncfusion/ej2-popups';import * as events from '../base/constant';import * as classes from '../base/classes';import { Render } from '../renderer/render';import { ViewSource } from '../renderer/view-source';import { IRenderer, IFormatter, PrintEventArgs, ActionCompleteEventArgs, ActionBeginEventArgs, ImageDropEventArgs, IFormatPainterArgs, CleanupResizeElemArgs } from './interface';import { IExecutionGroup, executeGroup, CommandName, ResizeArgs, StatusArgs, ToolbarStatusEventArgs } from './interface';import { BeforeQuickToolbarOpenArgs, ChangeEventArgs, AfterImageDeleteEventArgs, AfterMediaDeleteEventArgs, PasteCleanupArgs } from './interface';import { ILinkCommandsArgs, IImageCommandsArgs, IAudioCommandsArgs, IVideoCommandsArgs, BeforeSanitizeHtmlArgs, ITableCommandsArgs, ExecuteCommandOption } from './interface';import { ServiceLocator } from '../services/service-locator';import { RendererFactory } from '../services/renderer-factory';import { RenderType, ToolbarType, DialogType } from './enum';import { EditorMode, ShiftEnterKey, EnterKey } from './../../common/types';import { Toolbar } from '../actions/toolbar';import { ExecCommandCallBack } from '../actions/execute-command-callback';import { KeyboardEvents, KeyboardEventArgs } from '../actions/keyboard';import { FontFamilyModel, FontSizeModel, FontColorModel, FormatModel, BackgroundColorModel, NumberFormatListModel, BulletFormatListModel } from '../models/models';import { ToolbarSettingsModel, IFrameSettingsModel, ImageSettingsModel, AudioSettingsModel, VideoSettingsModel, TableSettingsModel } from '../models/models';import { QuickToolbarSettingsModel, InlineModeModel, PasteCleanupSettingsModel, FileManagerSettingsModel, FormatPainterSettingsModel, EmojiSettingsModel } from '../models/models';import { ToolbarSettings, ImageSettings, AudioSettings, VideoSettings, QuickToolbarSettings, FontFamily, FontSize, Format, NumberFormatList, BulletFormatList, FormatPainterSettings, EmojiSettings } from '../models/toolbar-settings';import { FileManagerSettings } from '../models/toolbar-settings';import { TableSettings, PasteCleanupSettings } from '../models/toolbar-settings';import { FontColor, BackgroundColor } from '../models/toolbar-settings';import { IFrameSettings } from '../models/iframe-settings';import { InlineMode } from '../models/inline-mode';import { Link } from '../renderer/link-module';import { Image } from '../renderer/image-module';import { Audio } from '../renderer/audio-module';import { Video } from '../renderer/video-module';import { Table } from '../renderer/table-module';import { Count } from '../actions/count';import { HtmlEditor } from '../actions/html-editor';import { MarkdownEditor } from '../actions/markdown-editor';import { defaultLocale } from '../models/default-locale';import { setAttributes } from '../actions/html-attributes';import { BaseToolbar } from '../actions/base-toolbar';import { QuickToolbar } from '../actions/quick-toolbar';import { FullScreen } from '../actions/full-screen';import { PasteCleanup } from '../actions/paste-clean-up';import { EnterKeyAction } from '../actions/enter-key';import * as CONSTANT from '../../common/constant';import { IHtmlKeyboardEvent } from '../../editor-manager/base/interface';import { dispatchEvent, getEditValue, isIDevice, decode, isEditableValueEmpty, getDefaultValue } from '../base/util';import { DialogRenderer } from '../renderer/dialog-renderer';import { SelectedEventArgs, RemovingEventArgs, UploadingEventArgs, BeforeUploadEventArgs } from '@syncfusion/ej2-inputs';import { Resize } from '../actions/resize';import { FileManager } from '../actions/file-manager';import { FormatPainter } from '../actions/format-painter';import { EmojiPicker } from '../actions/emoji-picker';
|
|
2
2
|
import {ComponentModel} from '@syncfusion/ej2-base';
|
|
3
3
|
|
|
4
4
|
/**
|
|
@@ -1515,6 +1515,14 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
|
|
|
1515
1515
|
|
|
1516
1516
|
*/
|
|
1517
1517
|
getID(): string;
|
|
1518
|
+
/**
|
|
1519
|
+
* @returns {void}
|
|
1520
|
+
* getCssClass method
|
|
1521
|
+
*
|
|
1522
|
+
* @hidden
|
|
1523
|
+
|
|
1524
|
+
*/
|
|
1525
|
+
getCssClass(isSpace?: boolean): string;
|
|
1518
1526
|
private mouseDownHandler;
|
|
1519
1527
|
private preventImgResize;
|
|
1520
1528
|
/**
|
|
@@ -1534,6 +1542,7 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
|
|
|
1534
1542
|
private getUpdatedValue;
|
|
1535
1543
|
private updateValueOnIdle;
|
|
1536
1544
|
private updateIntervalValue;
|
|
1545
|
+
private cleanupResizeElements;
|
|
1537
1546
|
private removeResizeElement;
|
|
1538
1547
|
private updateStatus;
|
|
1539
1548
|
private onDocumentClick;
|