@syncfusion/ej2-richtexteditor 19.3.53 → 19.4.40

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.
Files changed (38) hide show
  1. package/.github/PULL_REQUEST_TEMPLATE/Bug.md +41 -0
  2. package/.github/PULL_REQUEST_TEMPLATE/Feature.md +27 -0
  3. package/CHANGELOG.md +26 -0
  4. package/README.md +1 -1
  5. package/dist/ej2-richtexteditor.umd.min.js +2 -2
  6. package/dist/ej2-richtexteditor.umd.min.js.map +1 -1
  7. package/dist/es6/ej2-richtexteditor.es2015.js +200 -74
  8. package/dist/es6/ej2-richtexteditor.es2015.js.map +1 -1
  9. package/dist/es6/ej2-richtexteditor.es5.js +199 -73
  10. package/dist/es6/ej2-richtexteditor.es5.js.map +1 -1
  11. package/dist/global/ej2-richtexteditor.min.js +2 -2
  12. package/dist/global/ej2-richtexteditor.min.js.map +1 -1
  13. package/dist/global/index.d.ts +1 -1
  14. package/package.json +12 -12
  15. package/src/editor-manager/plugin/inserthtml.js +9 -1
  16. package/src/editor-manager/plugin/lists.js +2 -1
  17. package/src/editor-manager/plugin/ms-word-clean-up.js +1 -1
  18. package/src/editor-manager/plugin/selection-commands.js +10 -5
  19. package/src/editor-manager/plugin/undo.js +10 -1
  20. package/src/rich-text-editor/actions/color-picker.d.ts +1 -0
  21. package/src/rich-text-editor/actions/color-picker.js +2 -1
  22. package/src/rich-text-editor/actions/dropdown-buttons.js +0 -10
  23. package/src/rich-text-editor/actions/enter-key.d.ts +1 -0
  24. package/src/rich-text-editor/actions/enter-key.js +85 -34
  25. package/src/rich-text-editor/actions/html-editor.js +2 -2
  26. package/src/rich-text-editor/actions/quick-toolbar.d.ts +1 -0
  27. package/src/rich-text-editor/actions/quick-toolbar.js +16 -1
  28. package/src/rich-text-editor/actions/xhtml-validation.js +1 -1
  29. package/src/rich-text-editor/base/interface.d.ts +3 -1
  30. package/src/rich-text-editor/base/rich-text-editor.js +1 -1
  31. package/src/rich-text-editor/formatter/formatter.js +3 -3
  32. package/src/rich-text-editor/renderer/image-module.js +52 -7
  33. package/src/rich-text-editor/renderer/toolbar-renderer.d.ts +1 -1
  34. package/src/rich-text-editor/renderer/toolbar-renderer.js +3 -2
  35. package/src/selection/selection.js +2 -1
  36. package/styles/rich-text-editor/_fluent-definition.scss +168 -0
  37. package/styles/rich-text-editor/_layout.scss +1 -1
  38. package/styles/rich-text-editor/icons/_fluent.scss +303 -0
@@ -2968,7 +2968,7 @@ var ToolbarRenderer = /** @__PURE__ @class */ (function () {
2968
2968
  * @hidden
2969
2969
  * @deprecated
2970
2970
  */
2971
- ToolbarRenderer.prototype.renderColorPickerDropDown = function (args, item, colorPicker) {
2971
+ ToolbarRenderer.prototype.renderColorPickerDropDown = function (args, item, colorPicker, defaultColor) {
2972
2972
  var _this = this;
2973
2973
  // eslint-disable-next-line
2974
2974
  var proxy = this;
@@ -2977,8 +2977,9 @@ var ToolbarRenderer = /** @__PURE__ @class */ (function () {
2977
2977
  var content = proxy.parent.createElement('span', { className: CLS_COLOR_CONTENT });
2978
2978
  var inlineEle = proxy.parent.createElement('span', { className: args.cssClass });
2979
2979
  var range;
2980
+ var initialBackgroundColor = (isNullOrUndefined(defaultColor)) ? proxy.parent.backgroundColor.default : defaultColor;
2980
2981
  inlineEle.style.borderBottomColor = (item === 'backgroundcolor') ?
2981
- proxy.parent.backgroundColor.default : proxy.parent.fontColor.default;
2982
+ initialBackgroundColor : proxy.parent.fontColor.default;
2982
2983
  content.appendChild(inlineEle);
2983
2984
  var dropDown = new DropDownButton({
2984
2985
  target: colorPicker.element.parentElement, cssClass: css,
@@ -3606,11 +3607,6 @@ var DropDownButtons = /** @__PURE__ @class */ (function () {
3606
3607
  var prop = _a[_i];
3607
3608
  switch (prop) {
3608
3609
  case 'fontFamily':
3609
- if (this.parent.inlineMode.enable) {
3610
- if (!isNullOrUndefined(this.parent.fontFamily.default)) {
3611
- this.getEditNode().style.fontFamily = this.parent.fontFamily.default;
3612
- }
3613
- }
3614
3610
  if (this.fontNameDropDown) {
3615
3611
  for (var _b = 0, _c = Object.keys(newProp.fontFamily); _b < _c.length; _b++) {
3616
3612
  var fontFamily$$1 = _c[_b];
@@ -3642,11 +3638,6 @@ var DropDownButtons = /** @__PURE__ @class */ (function () {
3642
3638
  }
3643
3639
  break;
3644
3640
  case 'fontSize':
3645
- if (this.parent.inlineMode) {
3646
- if (!isNullOrUndefined(this.parent.fontSize.default)) {
3647
- this.getEditNode().style.fontSize = this.parent.fontSize.default;
3648
- }
3649
- }
3650
3641
  if (this.fontSizeDropDown) {
3651
3642
  for (var _d = 0, _e = Object.keys(newProp.fontSize); _d < _e.length; _d++) {
3652
3643
  var fontSize$$1 = _e[_d];
@@ -5040,7 +5031,7 @@ var ColorPickerInput = /** @__PURE__ @class */ (function () {
5040
5031
  target: (targetID)
5041
5032
  };
5042
5033
  _this.backgroundColorPicker = _this.toolbarRenderer.renderColorPicker(options, 'backgroundcolor');
5043
- _this.backgroundColorDropDown = _this.toolbarRenderer.renderColorPickerDropDown(options, 'backgroundcolor', _this.backgroundColorPicker);
5034
+ _this.backgroundColorDropDown = _this.toolbarRenderer.renderColorPickerDropDown(options, 'backgroundcolor', _this.backgroundColorPicker, _this.defaultColorPicker);
5044
5035
  break;
5045
5036
  }
5046
5037
  }
@@ -5075,6 +5066,7 @@ var ColorPickerInput = /** @__PURE__ @class */ (function () {
5075
5066
  if (this.backgroundColorDropDown && !this.backgroundColorDropDown.isDestroyed) {
5076
5067
  var innerEle = this.backgroundColorDropDown.element.querySelector('.e-rte-color-content');
5077
5068
  if (innerEle) {
5069
+ this.defaultColorPicker = innerEle.children[0].style.borderBottomColor;
5078
5070
  detach(innerEle);
5079
5071
  }
5080
5072
  this.backgroundColorDropDown.destroy();
@@ -5711,6 +5703,11 @@ var QuickToolbar = /** @__PURE__ @class */ (function () {
5711
5703
  this.parent.isBlur = false;
5712
5704
  this.parent.isRTE = true;
5713
5705
  };
5706
+ QuickToolbar.prototype.keyUpQT = function (e) {
5707
+ if (e.which == 27) {
5708
+ this.hideQuickToolbars();
5709
+ }
5710
+ };
5714
5711
  QuickToolbar.prototype.renderQuickToolbars = function () {
5715
5712
  if (this.linkQTBar || this.imageQTBar || this.textQTBar || this.tableQTBar) {
5716
5713
  return;
@@ -5725,15 +5722,19 @@ var QuickToolbar = /** @__PURE__ @class */ (function () {
5725
5722
  this.renderFactory.addRenderer(RenderType.TableToolbar, this.tableQTBar);
5726
5723
  if (this.linkQTBar) {
5727
5724
  EventHandler.add(this.linkQTBar.element, 'mousedown', this.onMouseDown, this);
5725
+ EventHandler.add(this.linkQTBar.element, 'keyup', this.keyUpQT, this);
5728
5726
  }
5729
5727
  if (this.imageQTBar) {
5730
5728
  EventHandler.add(this.imageQTBar.element, 'mousedown', this.onMouseDown, this);
5729
+ EventHandler.add(this.imageQTBar.element, 'keyup', this.keyUpQT, this);
5731
5730
  }
5732
5731
  if (this.textQTBar) {
5733
5732
  EventHandler.add(this.textQTBar.element, 'mousedown', this.onMouseDown, this);
5733
+ EventHandler.add(this.textQTBar.element, 'keyup', this.keyUpQT, this);
5734
5734
  }
5735
5735
  if (this.tableQTBar) {
5736
5736
  EventHandler.add(this.tableQTBar.element, 'mousedown', this.onMouseDown, this);
5737
+ EventHandler.add(this.tableQTBar.element, 'keyup', this.keyUpQT, this);
5737
5738
  }
5738
5739
  };
5739
5740
  QuickToolbar.prototype.renderInlineQuickToolbar = function () {
@@ -5742,6 +5743,7 @@ var QuickToolbar = /** @__PURE__ @class */ (function () {
5742
5743
  this.inlineQTBar = this.createQTBar('Inline', 'MultiRow', this.parent.toolbarSettings.items, RenderType.InlineToolbar);
5743
5744
  this.renderFactory.addRenderer(RenderType.InlineToolbar, this.inlineQTBar);
5744
5745
  EventHandler.add(this.inlineQTBar.element, 'mousedown', this.onMouseDown, this);
5746
+ EventHandler.add(this.inlineQTBar.element, 'keyup', this.keyUpQT, this);
5745
5747
  }
5746
5748
  };
5747
5749
  /**
@@ -5755,7 +5757,7 @@ var QuickToolbar = /** @__PURE__ @class */ (function () {
5755
5757
  * @deprecated
5756
5758
  */
5757
5759
  QuickToolbar.prototype.showInlineQTBar = function (x, y, target) {
5758
- if (this.parent.readonly) {
5760
+ if (this.parent.readonly || target.tagName.toLowerCase() === "img") {
5759
5761
  return;
5760
5762
  }
5761
5763
  this.inlineQTBar.showPopup(x, y, target);
@@ -5896,22 +5898,27 @@ var QuickToolbar = /** @__PURE__ @class */ (function () {
5896
5898
  QuickToolbar.prototype.destroy = function () {
5897
5899
  if (this.linkQTBar) {
5898
5900
  EventHandler.remove(this.linkQTBar.element, 'mousedown', this.onMouseDown);
5901
+ EventHandler.remove(this.linkQTBar.element, 'keyup', this.keyUpQT);
5899
5902
  this.linkQTBar.destroy();
5900
5903
  }
5901
5904
  if (this.textQTBar) {
5902
5905
  EventHandler.remove(this.textQTBar.element, 'mousedown', this.onMouseDown);
5906
+ EventHandler.remove(this.textQTBar.element, 'keyup', this.keyUpQT);
5903
5907
  this.textQTBar.destroy();
5904
5908
  }
5905
5909
  if (this.imageQTBar) {
5906
5910
  EventHandler.remove(this.imageQTBar.element, 'mousedown', this.onMouseDown);
5911
+ EventHandler.remove(this.imageQTBar.element, 'keyup', this.keyUpQT);
5907
5912
  this.imageQTBar.destroy();
5908
5913
  }
5909
5914
  if (this.tableQTBar) {
5910
5915
  EventHandler.remove(this.tableQTBar.element, 'mousedown', this.onMouseDown);
5916
+ EventHandler.remove(this.tableQTBar.element, 'keyup', this.keyUpQT);
5911
5917
  this.tableQTBar.destroy();
5912
5918
  }
5913
5919
  if (this.inlineQTBar) {
5914
5920
  EventHandler.remove(this.inlineQTBar.element, 'mousedown', this.onMouseDown);
5921
+ EventHandler.remove(this.inlineQTBar.element, 'keyup', this.keyUpQT);
5915
5922
  if (isIDevice()) {
5916
5923
  EventHandler.remove(document, 'selectionchange', this.selectionChangeHandler);
5917
5924
  }
@@ -6902,7 +6909,7 @@ var Formatter = /** @__PURE__ @class */ (function () {
6902
6909
  || ((args.item.subCommand === 'FontName' || args.item.subCommand === 'FontSize') && args.name === 'dropDownSelect')
6903
6910
  || ((args.item.subCommand === 'BackgroundColor' || args.item.subCommand === 'FontColor')
6904
6911
  && args.name === 'colorPickerChanged'))) {
6905
- extend(args, args, { requestType: args.item.subCommand, cancel: false, itemCollection: value }, true);
6912
+ extend(args, args, { requestType: args.item.subCommand, cancel: false, itemCollection: value, selectType: args.name }, true);
6906
6913
  self.trigger(actionBegin, args, function (actionBeginArgs) {
6907
6914
  if (!actionBeginArgs.cancel) {
6908
6915
  if (_this.getUndoRedoStack().length === 0 && actionBeginArgs.item.command !== 'Links'
@@ -6920,8 +6927,8 @@ var Formatter = /** @__PURE__ @class */ (function () {
6920
6927
  }
6921
6928
  else {
6922
6929
  _this.editorManager.observer.notify(checkUndo, { subCommand: actionBeginArgs.item.subCommand });
6923
- _this.editorManager.execCommand(actionBeginArgs.item.command, actionBeginArgs.item.subCommand, event, _this.onSuccess.bind(_this, self), actionBeginArgs.item.value, actionBeginArgs.item.subCommand === 'Pre' && args.name === 'dropDownSelect' ?
6924
- { name: args.name } : value, ('#' + self.getID() + ' iframe'), self.enterKey);
6930
+ _this.editorManager.execCommand(actionBeginArgs.item.command, actionBeginArgs.item.subCommand, event, _this.onSuccess.bind(_this, self), actionBeginArgs.item.value, actionBeginArgs.item.subCommand === 'Pre' && actionBeginArgs.selectType === 'dropDownSelect' ?
6931
+ { name: actionBeginArgs.selectType } : value, ('#' + self.getID() + ' iframe'), self.enterKey);
6925
6932
  }
6926
6933
  }
6927
6934
  });
@@ -9421,7 +9428,8 @@ var NodeSelection = /** @__PURE__ @class */ (function () {
9421
9428
  || range.startContainer;
9422
9429
  var endNode = range.endContainer.childNodes[(range.endOffset > 0) ? (range.endOffset - 1) : range.endOffset]
9423
9430
  || range.endContainer;
9424
- if (startNode === endNode && startNode.childNodes.length === 0) {
9431
+ if ((startNode === endNode || (startNode.nodeName === 'BR' && startNode === range.endContainer.childNodes[range.endOffset])) &&
9432
+ startNode.childNodes.length === 0) {
9425
9433
  return [startNode];
9426
9434
  }
9427
9435
  if (range.startOffset === range.endOffset && range.startOffset !== 0 && range.startContainer.nodeName === 'PRE') {
@@ -10555,8 +10563,9 @@ var Lists = /** @__PURE__ @class */ (function () {
10555
10563
  Lists.prototype.testCurrentList = function (range) {
10556
10564
  var olListStartRegex = [/^[1]+[.]+$/, /^[i]+[.]+$/, /^[a]+[.]+$/];
10557
10565
  if (!isNullOrUndefined(range.startContainer.textContent.slice(0, range.startOffset))) {
10566
+ var currentContent = range.startContainer.textContent.replace(/\u200B/g, '').slice(0, range.startOffset).trim();
10558
10567
  for (var i = 0; i < olListStartRegex.length; i++) {
10559
- if (olListStartRegex[i].test(range.startContainer.textContent.replace(/\u200B/g, '').slice(0, range.startOffset).trim())) {
10568
+ if (olListStartRegex[i].test(currentContent) && currentContent.length === 2) {
10560
10569
  return true;
10561
10570
  }
10562
10571
  }
@@ -12285,7 +12294,15 @@ var InsertHtml = /** @__PURE__ @class */ (function () {
12285
12294
  tempSpan.parentNode.replaceChild(node, tempSpan);
12286
12295
  }
12287
12296
  else {
12288
- var splitedElm = nodeCutter.GetSpliceNode(range, blockNode);
12297
+ var currentNode = nodes[nodes.length - 1];
12298
+ var splitedElm = void 0;
12299
+ if ((currentNode.nodeName === 'BR' || currentNode.nodeName === 'HR') && !isNullOrUndefined(currentNode.parentElement) &&
12300
+ currentNode.parentElement.textContent.trim().length === 0 && !node.classList.contains('pasteContent')) {
12301
+ splitedElm = currentNode;
12302
+ }
12303
+ else {
12304
+ splitedElm = nodeCutter.GetSpliceNode(range, blockNode);
12305
+ }
12289
12306
  splitedElm.parentNode.replaceChild(node, splitedElm);
12290
12307
  }
12291
12308
  }
@@ -14589,6 +14606,9 @@ var SelectionCommands = /** @__PURE__ @class */ (function () {
14589
14606
  };
14590
14607
  SelectionCommands.removeFormat = function (nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value, domSelection, endNode, domNode) {
14591
14608
  var splitNode = null;
14609
+ var startText = range.startContainer.nodeName === '#text' ?
14610
+ range.startContainer.textContent.substring(range.startOffset, range.startContainer.textContent.length) :
14611
+ range.startContainer.textContent;
14592
14612
  if (!(range.startContainer === range.endContainer && range.startOffset === 0
14593
14613
  && range.endOffset === range.startContainer.length)) {
14594
14614
  var nodeIndex = [];
@@ -14688,11 +14708,13 @@ var SelectionCommands = /** @__PURE__ @class */ (function () {
14688
14708
  for (var num = 0; num < child.length; num++) {
14689
14709
  if (child[num].nodeType !== 3 || (child[num].textContent && child[num].textContent.trim().length > 0)) {
14690
14710
  child[num] = InsertMethods.Wrap(child[num], this.GetFormatNode(format, value, formatNodeTagName, formatNodeStyles));
14691
- if (num === 0) {
14692
- range.setStartBefore(child[num]);
14693
- }
14694
- else if (num === child.length - 1) {
14695
- range.setEndAfter(child[num]);
14711
+ if (child[num].textContent === startText) {
14712
+ if (num === 0) {
14713
+ range.setStartBefore(child[num]);
14714
+ }
14715
+ else if (num === child.length - 1) {
14716
+ range.setEndAfter(child[num]);
14717
+ }
14696
14718
  }
14697
14719
  }
14698
14720
  }
@@ -15373,6 +15395,15 @@ var UndoRedoManager = /** @__PURE__ @class */ (function () {
15373
15395
  */
15374
15396
  UndoRedoManager.prototype.saveData = function (e) {
15375
15397
  var range = new NodeSelection().getRange(this.parent.currentDocument);
15398
+ var currentContainer = range.startContainer;
15399
+ for (var i = currentContainer.childNodes.length - 1; i >= 0; i--) {
15400
+ if (!isNullOrUndefined(currentContainer.childNodes[i]) && currentContainer.childNodes[i].nodeName === '#text' &&
15401
+ currentContainer.childNodes[i].textContent.length === 0 && currentContainer.childNodes[i].nodeName !== 'IMG' &&
15402
+ currentContainer.childNodes[i].nodeName !== 'BR' && currentContainer.childNodes[i].nodeName && 'HR') {
15403
+ detach(currentContainer.childNodes[i]);
15404
+ }
15405
+ }
15406
+ range = new NodeSelection().getRange(this.parent.currentDocument);
15376
15407
  var save = new NodeSelection().save(range, this.parent.currentDocument);
15377
15408
  var htmlText = this.parent.editableElement.innerHTML;
15378
15409
  var changEle = { text: htmlText, range: save };
@@ -15523,7 +15554,7 @@ var MsWordPaste = /** @__PURE__ @class */ (function () {
15523
15554
  this.parent.observer.on(MS_WORD_CLEANUP_PLUGIN, this.wordCleanup, this);
15524
15555
  };
15525
15556
  MsWordPaste.prototype.wordCleanup = function (e) {
15526
- var wordPasteStyleConfig = e.allowedStylePropertiesArray;
15557
+ var wordPasteStyleConfig = !isNullOrUndefined(e.allowedStylePropertiesArray) ? e.allowedStylePropertiesArray : [];
15527
15558
  var listNodes = [];
15528
15559
  var tempHTMLContent = e.args.clipboardData.getData('text/HTML');
15529
15560
  var rtfData = e.args.clipboardData.getData('text/rtf');
@@ -16992,7 +17023,7 @@ var XhtmlValidation = /** @__PURE__ @class */ (function () {
16992
17023
  this.ImageTags();
16993
17024
  this.removeTags();
16994
17025
  this.RemoveUnsupported();
16995
- this.currentElement.innerHTML = this.selfEncloseValidation(this.currentElement.innerHTML, this.currentElement.innerText === '\n' ?
17026
+ this.currentElement.innerHTML = this.selfEncloseValidation(this.currentElement.innerHTML, this.currentElement.innerText === "\n" ?
16996
17027
  this.currentElement.innerText.length : this.currentElement.innerText.trim().length);
16997
17028
  this.parent.setProperties({ value: this.currentElement.innerHTML }, true);
16998
17029
  }
@@ -17278,7 +17309,7 @@ var HtmlEditor = /** @__PURE__ @class */ (function () {
17278
17309
  e.args.action === 'enter' ||
17279
17310
  e.args.keyCode === 13) {
17280
17311
  this.spaceLink(e.args);
17281
- if (this.parent.editorMode === 'HTML' && !((this.parent.shiftEnterKey === 'BR' && e.args.shiftKey))) {
17312
+ if (this.parent.editorMode === 'HTML' && !this.parent.readonly) {
17282
17313
  this.parent.notify(enterHandler, { args: e.args });
17283
17314
  }
17284
17315
  }
@@ -17555,7 +17586,7 @@ var HtmlEditor = /** @__PURE__ @class */ (function () {
17555
17586
  var divElement = this.parent.createElement('div');
17556
17587
  divElement.setAttribute('class', 'pasteContent');
17557
17588
  divElement.style.display = 'inline';
17558
- divElement.innerHTML = contentInnerElem;
17589
+ divElement.innerHTML = contentInnerElem.replace('&para', '&amp;para');
17559
17590
  var paraElem = divElement.querySelectorAll('span, p');
17560
17591
  for (var i = 0; i < paraElem.length; i++) {
17561
17592
  var splitTextContent = paraElem[i].innerHTML.split(' ');
@@ -20175,7 +20206,7 @@ var Image = /** @__PURE__ @class */ (function () {
20175
20206
  left: elem.offsetLeft
20176
20207
  };
20177
20208
  };
20178
- Image.prototype.setAspectRatio = function (img, expectedX, expectedY) {
20209
+ Image.prototype.setAspectRatio = function (img, expectedX, expectedY, e) {
20179
20210
  if (isNullOrUndefined(img.width)) {
20180
20211
  return;
20181
20212
  }
@@ -20199,10 +20230,14 @@ var Image = /** @__PURE__ @class */ (function () {
20199
20230
  img.style.height = expectedY + 'px';
20200
20231
  }
20201
20232
  else if (img.style.width !== '' && img.style.height === '') {
20202
- img.style.width = ((width / height * expectedY) + width / height).toString() + 'px';
20233
+ var currentWidth = ((width / height * expectedY) + width / height) < (this.parent.inputElement.getBoundingClientRect().right - 32) ?
20234
+ ((width / height * expectedY) + width / height) : (this.parent.inputElement.getBoundingClientRect().right - 32);
20235
+ img.style.width = currentWidth.toString() + 'px';
20203
20236
  }
20204
20237
  else if (img.style.width !== '') {
20205
- img.style.width = (width / height * expectedY) + 'px';
20238
+ var currentWidth = (width / height * expectedY) < (this.parent.inputElement.getBoundingClientRect().right - 32) ?
20239
+ (width / height * expectedY) : (this.parent.inputElement.getBoundingClientRect().right - 32);
20240
+ img.style.width = currentWidth + 'px';
20206
20241
  img.style.height = expectedY + 'px';
20207
20242
  }
20208
20243
  else {
@@ -20225,7 +20260,7 @@ var Image = /** @__PURE__ @class */ (function () {
20225
20260
  img.style.height = (height / width * expectedX) + 'px';
20226
20261
  }
20227
20262
  else {
20228
- img.setAttribute('width', expectedX.toString());
20263
+ img.setAttribute('width', this.resizeBtnStat.botRight ? (this.getPointX(e.event) - img.getBoundingClientRect().left).toString() : expectedX.toString());
20229
20264
  }
20230
20265
  }
20231
20266
  else {
@@ -20266,7 +20301,7 @@ var Image = /** @__PURE__ @class */ (function () {
20266
20301
  return;
20267
20302
  }
20268
20303
  _this.imgEle.parentElement.style.cursor = 'pointer';
20269
- _this.setAspectRatio(_this.imgEle, parseInt(width, 10), parseInt(height, 10));
20304
+ _this.setAspectRatio(_this.imgEle, parseInt(width, 10), parseInt(height, 10), args);
20270
20305
  _this.resizeImgDupPos(_this.imgEle);
20271
20306
  _this.imgResizePos(_this.imgEle, _this.imgResizeDiv);
20272
20307
  _this.parent.setContentHeight('', false);
@@ -20311,7 +20346,7 @@ var Image = /** @__PURE__ @class */ (function () {
20311
20346
  };
20312
20347
  Image.prototype.resizeImgDupPos = function (e) {
20313
20348
  this.imgDupPos = {
20314
- width: (e.style.height !== '') ? this.imgEle.style.width : e.width + 'px',
20349
+ width: (e.style.width !== '') ? this.imgEle.style.width : e.width + 'px',
20315
20350
  height: (e.style.height !== '') ? this.imgEle.style.height : e.height + 'px'
20316
20351
  };
20317
20352
  };
@@ -20479,6 +20514,27 @@ var Image = /** @__PURE__ @class */ (function () {
20479
20514
  var src = this.deletedImg[i].src;
20480
20515
  this.imageRemovePost(src);
20481
20516
  }
20517
+ if (range.startContainer.nodeType === 3) {
20518
+ if (originalEvent.code === 'Backspace') {
20519
+ if (range.startContainer.previousElementSibling && range.startOffset === 0 &&
20520
+ range.startContainer.previousElementSibling.classList.contains(CLS_CAPTION) &&
20521
+ range.startContainer.previousElementSibling.classList.contains(CLS_CAPINLINE)) {
20522
+ detach(range.startContainer.previousElementSibling);
20523
+ }
20524
+ }
20525
+ else {
20526
+ if (range.startContainer.nextElementSibling &&
20527
+ range.endContainer.textContent.length === range.endOffset &&
20528
+ range.startContainer.nextElementSibling.classList.contains(CLS_CAPTION) &&
20529
+ range.startContainer.nextElementSibling.classList.contains(CLS_CAPINLINE)) {
20530
+ detach(range.startContainer.nextElementSibling);
20531
+ }
20532
+ }
20533
+ }
20534
+ else if ((range.startContainer.nodeType === 1 &&
20535
+ range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_CAPINLINE))) {
20536
+ detach(range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_CAPINLINE));
20537
+ }
20482
20538
  break;
20483
20539
  case 'insert-image':
20484
20540
  this.openDialog(true, originalEvent, save, selectNodeEle, selectParentEle);
@@ -20684,7 +20740,7 @@ var Image = /** @__PURE__ @class */ (function () {
20684
20740
  var target = args.target;
20685
20741
  this.contentModule = this.rendererFactory.getRenderer(RenderType.Content);
20686
20742
  var isPopupOpen = this.quickToolObj.imageQTBar.element.classList.contains('e-rte-pop');
20687
- if (target.nodeName === 'IMG' && this.parent.quickToolbarModule && this.parent.getRange().startOffset === this.parent.getRange().endOffset) {
20743
+ if (target.nodeName === 'IMG' && this.parent.quickToolbarModule) {
20688
20744
  if (isPopupOpen) {
20689
20745
  return;
20690
20746
  }
@@ -20925,6 +20981,9 @@ var Image = /** @__PURE__ @class */ (function () {
20925
20981
  Image.prototype.imageRemovePost = function (src) {
20926
20982
  var proxy = this;
20927
20983
  var absoluteUrl = '';
20984
+ if (isNullOrUndefined(this.parent.insertImageSettings.removeUrl) || this.parent.insertImageSettings.removeUrl === '') {
20985
+ return;
20986
+ }
20928
20987
  if (src.indexOf('http://') > -1 || src.indexOf('https://') > -1) {
20929
20988
  absoluteUrl = src;
20930
20989
  }
@@ -21769,6 +21828,7 @@ var Image = /** @__PURE__ @class */ (function () {
21769
21828
  imageTag.addEventListener('load', function () {
21770
21829
  _this.parent.trigger(actionComplete, e);
21771
21830
  });
21831
+ detach(parentElement);
21772
21832
  };
21773
21833
  /**
21774
21834
  * Rendering uploader and popup for drag and drop
@@ -21804,6 +21864,9 @@ var Image = /** @__PURE__ @class */ (function () {
21804
21864
  _this.popupObj.destroy();
21805
21865
  detach(_this.popupObj.element);
21806
21866
  _this.popupObj = null;
21867
+ if (!_this.parent.inlineMode.enable) {
21868
+ _this.parent.toolbarModule.baseToolbar.toolbarObj.disable(false);
21869
+ }
21807
21870
  }
21808
21871
  });
21809
21872
  this.popupObj.element.style.display = 'none';
@@ -21835,6 +21898,10 @@ var Image = /** @__PURE__ @class */ (function () {
21835
21898
  isUploading = false;
21836
21899
  detach(imageElement);
21837
21900
  _this.popupObj.close();
21901
+ _this.quickToolObj.imageQTBar.hidePopup();
21902
+ setTimeout(function () {
21903
+ _this.uploadObj.destroy();
21904
+ }, 900);
21838
21905
  },
21839
21906
  beforeUpload: function (args) {
21840
21907
  if (_this.parent.isServerRendered) {
@@ -21846,6 +21913,9 @@ var Image = /** @__PURE__ @class */ (function () {
21846
21913
  if (beforeUploadArgs.cancel) {
21847
21914
  return;
21848
21915
  }
21916
+ if (!_this.parent.inlineMode.enable) {
21917
+ _this.parent.toolbarModule.baseToolbar.toolbarObj.disable(true);
21918
+ }
21849
21919
  /* eslint-disable */
21850
21920
  _this.uploadObj.currentRequestHeader = beforeUploadArgs.currentRequest ?
21851
21921
  beforeUploadArgs.currentRequest : _this.uploadObj.currentRequestHeader;
@@ -21858,6 +21928,9 @@ var Image = /** @__PURE__ @class */ (function () {
21858
21928
  }
21859
21929
  else {
21860
21930
  _this.parent.trigger(beforeImageUpload, args);
21931
+ if (!_this.parent.inlineMode.enable) {
21932
+ _this.parent.toolbarModule.baseToolbar.toolbarObj.disable(true);
21933
+ }
21861
21934
  }
21862
21935
  },
21863
21936
  uploading: function (e) {
@@ -21900,6 +21973,9 @@ var Image = /** @__PURE__ @class */ (function () {
21900
21973
  }, 900);
21901
21974
  },
21902
21975
  success: function (e) {
21976
+ if (e.operation === "cancel") {
21977
+ return;
21978
+ }
21903
21979
  isUploading = false;
21904
21980
  _this.parent.inputElement.contentEditable = 'true';
21905
21981
  var args = {
@@ -24271,9 +24347,20 @@ var EnterKeyAction = /** @__PURE__ @class */ (function () {
24271
24347
  EnterKeyAction.prototype.enterHandler = function (e) {
24272
24348
  var _this = this;
24273
24349
  this.getRangeNode();
24350
+ var isTableEnter = true;
24351
+ if (!isNullOrUndefined(this.startNode.closest('TABLE')) && !isNullOrUndefined(this.endNode.closest('TABLE'))) {
24352
+ isTableEnter = false;
24353
+ var curElement = this.startNode;
24354
+ var blockElement = curElement;
24355
+ while (!this.parent.formatter.editorManager.domNode.isBlockNode(curElement)) {
24356
+ blockElement = curElement;
24357
+ curElement = curElement.parentElement;
24358
+ }
24359
+ isTableEnter = blockElement.tagName === 'TD' ? false : true;
24360
+ }
24274
24361
  if (e.args.which === 13 && e.args.code === 'Enter') {
24275
- if (isNullOrUndefined(this.startNode.closest('LI')) && isNullOrUndefined(this.endNode.closest('LI')) && isNullOrUndefined(this.startNode.closest('TABLE')) &&
24276
- isNullOrUndefined(this.endNode.closest('TABLE')) && isNullOrUndefined(this.startNode.closest('PRE')) && isNullOrUndefined(this.endNode.closest('PRE'))) {
24362
+ if (isNullOrUndefined(this.startNode.closest('LI')) && isNullOrUndefined(this.endNode.closest('LI')) && isTableEnter &&
24363
+ isNullOrUndefined(this.startNode.closest('PRE')) && isNullOrUndefined(this.endNode.closest('PRE'))) {
24277
24364
  var shiftKey_1 = e.args.shiftKey;
24278
24365
  var actionBeginArgs = {
24279
24366
  cancel: false,
@@ -24331,12 +24418,32 @@ var EnterKeyAction = /** @__PURE__ @class */ (function () {
24331
24418
  _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), _this.range.startContainer.childNodes[_this.range.startOffset], 0);
24332
24419
  _this.getRangeNode();
24333
24420
  }
24334
- if (_this.parent.enterKey === 'P' || _this.parent.enterKey === 'DIV' ||
24421
+ if ((_this.parent.enterKey === 'P' && !shiftKey_1) || (_this.parent.enterKey === 'DIV' && !shiftKey_1) ||
24335
24422
  (_this.parent.shiftEnterKey === 'P' && shiftKey_1) ||
24336
24423
  (_this.parent.shiftEnterKey === 'DIV' && shiftKey_1)) {
24337
- var nearBlockNode = _this.parent.formatter.editorManager.domNode.blockParentNode(_this.startNode);
24424
+ var nearBlockNode = void 0;
24425
+ if (isTableEnter && _this.parent.formatter.editorManager.domNode.isBlockNode(_this.startNode)) {
24426
+ nearBlockNode = _this.startNode;
24427
+ }
24428
+ else {
24429
+ nearBlockNode = _this.parent.formatter.editorManager.domNode.blockParentNode(_this.startNode);
24430
+ }
24338
24431
  var isImageNode = false;
24339
- if (_this.range.startOffset === 0 && _this.range.endOffset === 0 && !(!isNullOrUndefined(_this.range.startContainer.previousSibling) && _this.range.startContainer.previousSibling.nodeName === 'IMG')) {
24432
+ var isFocusedFirst = false;
24433
+ if (_this.range.startOffset != 0 && _this.range.endOffset != 0 && _this.range.startContainer === _this.range.endContainer &&
24434
+ !(!isNullOrUndefined(nearBlockNode.childNodes[0]) && nearBlockNode.childNodes[0].nodeName === 'IMG')) {
24435
+ var startNodeText = _this.range.startContainer.textContent;
24436
+ var splitFirstText = startNodeText.substring(0, _this.range.startOffset);
24437
+ if (splitFirstText.charCodeAt(_this.range.startOffset - 1) != 160 && splitFirstText.trim().length === 0) {
24438
+ isFocusedFirst = true;
24439
+ }
24440
+ }
24441
+ else if (_this.range.startOffset === 0 && _this.range.endOffset === 0) {
24442
+ isFocusedFirst = true;
24443
+ }
24444
+ if (((_this.range.startOffset === 0 && _this.range.endOffset === 0) || isFocusedFirst) &&
24445
+ !(!isNullOrUndefined(_this.range.startContainer.previousSibling) &&
24446
+ (_this.range.startContainer.previousSibling.nodeName === 'IMG' || _this.range.startContainer.previousSibling.nodeName === 'BR'))) {
24340
24447
  var isNearBlockLengthZero = void 0;
24341
24448
  var newElem = void 0;
24342
24449
  if (_this.range.startContainer.nodeName === 'IMG') {
@@ -24345,7 +24452,7 @@ var EnterKeyAction = /** @__PURE__ @class */ (function () {
24345
24452
  isNearBlockLengthZero = false;
24346
24453
  }
24347
24454
  else {
24348
- if (nearBlockNode.textContent.length !== 0) {
24455
+ if (nearBlockNode.textContent.trim().length !== 0) {
24349
24456
  newElem = _this.parent.formatter.editorManager.nodeCutter.SplitNode(_this.range, nearBlockNode, false).cloneNode(true);
24350
24457
  isNearBlockLengthZero = false;
24351
24458
  }
@@ -24394,7 +24501,18 @@ var EnterKeyAction = /** @__PURE__ @class */ (function () {
24394
24501
  }
24395
24502
  if (newElem.textContent.trim().length === 0) {
24396
24503
  var brElm = _this.parent.createElement('br');
24397
- _this.startNode.appendChild(brElm);
24504
+ if (_this.startNode.nodeName === 'A') {
24505
+ var startParentElem = _this.startNode.parentElement;
24506
+ _this.startNode.parentElement.insertBefore(brElm, _this.startNode);
24507
+ detach(_this.startNode);
24508
+ _this.startNode = startParentElem;
24509
+ }
24510
+ else {
24511
+ _this.startNode.appendChild(brElm);
24512
+ }
24513
+ if (newElem.childNodes[0].textContent === '\n') {
24514
+ detach(newElem.childNodes[0]);
24515
+ }
24398
24516
  _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), _this.startNode, 0);
24399
24517
  }
24400
24518
  if (((_this.parent.enterKey === 'P' || _this.parent.enterKey === 'DIV') && !shiftKey_1) || ((_this.parent.shiftEnterKey === 'DIV' ||
@@ -24405,12 +24523,13 @@ var EnterKeyAction = /** @__PURE__ @class */ (function () {
24405
24523
  }
24406
24524
  _this.parent.formatter.editorManager.domNode.insertAfter(insertElm, newElem);
24407
24525
  detach(newElem);
24408
- _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), _this.parent.formatter.editorManager.domNode.isBlockNode(_this.startNode) ? insertElm : _this.startNode, 0);
24526
+ _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), _this.parent.formatter.editorManager.domNode.isBlockNode(_this.startNode) ?
24527
+ insertElm : _this.startNode, 0);
24409
24528
  }
24410
24529
  }
24411
24530
  e.args.preventDefault();
24412
24531
  }
24413
- if (_this.parent.enterKey === 'BR' && !shiftKey_1) {
24532
+ if ((_this.parent.enterKey === 'BR' && !shiftKey_1) || (_this.parent.shiftEnterKey === 'BR' && shiftKey_1)) {
24414
24533
  var currentParent = void 0;
24415
24534
  if (!_this.parent.formatter.editorManager.domNode.isBlockNode(_this.startNode)) {
24416
24535
  var currentNode = _this.startNode;
@@ -24425,11 +24544,16 @@ var EnterKeyAction = /** @__PURE__ @class */ (function () {
24425
24544
  else {
24426
24545
  currentParent = _this.startNode;
24427
24546
  }
24428
- var isEmptyBrInserted = false;
24547
+ var currentParentLastChild = currentParent.lastChild;
24548
+ while (!isNullOrUndefined(currentParentLastChild) && !(currentParentLastChild.nodeName === '#text')) {
24549
+ currentParentLastChild = currentParentLastChild.lastChild;
24550
+ }
24551
+ var isLastNodeLength = _this.range.startContainer === currentParentLastChild ?
24552
+ _this.range.startContainer.textContent.length : currentParent.textContent.length;
24429
24553
  if (currentParent !== _this.parent.inputElement &&
24430
24554
  _this.parent.formatter.editorManager.domNode.isBlockNode(currentParent) &&
24431
24555
  _this.range.startOffset === _this.range.endOffset &&
24432
- _this.range.startOffset === currentParent.textContent.length) {
24556
+ _this.range.startOffset === isLastNodeLength) {
24433
24557
  var outerBRElem = _this.parent.createElement('br');
24434
24558
  _this.parent.formatter.editorManager.domNode.insertAfter(outerBRElem, currentParent);
24435
24559
  _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), outerBRElem, 0);
@@ -24456,37 +24580,15 @@ var EnterKeyAction = /** @__PURE__ @class */ (function () {
24456
24580
  currentFocusElem = currentFocusElem.lastChild;
24457
24581
  }
24458
24582
  _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), currentFocusElem, 0);
24459
- isEmptyBrInserted = true;
24583
+
24460
24584
  }
24461
24585
  else {
24462
- newElem = _this.parent.formatter.editorManager.nodeCutter.SplitNode(_this.range, currentParent, true);
24463
- newElem.parentElement.insertBefore(outerBRElem, newElem);
24464
- _this.insertFocusContent();
24586
+ _this.insertBRElement();
24465
24587
  }
24466
24588
  }
24467
24589
  }
24468
24590
  else {
24469
- var brElm = _this.parent.createElement('br');
24470
- if (_this.startNode.nodeName === 'BR' && _this.endNode.nodeName === 'BR' && _this.range.startOffset === 0 && _this.range.startOffset === _this.range.endOffset) {
24471
- _this.parent.formatter.editorManager.domNode.insertAfter(brElm, _this.startNode);
24472
- isEmptyBrInserted = true;
24473
- }
24474
- else {
24475
- if (_this.startNode === _this.parent.inputElement && !isNullOrUndefined(_this.range.startContainer.previousSibling) &&
24476
- _this.range.startContainer.previousSibling.nodeName === 'BR' && _this.range.startContainer.textContent.length === 0) {
24477
- isEmptyBrInserted = true;
24478
- }
24479
- _this.range.insertNode(brElm);
24480
- }
24481
- if (isEmptyBrInserted || (!isNullOrUndefined(brElm.nextElementSibling) && brElm.nextElementSibling.tagName === 'BR') || (!isNullOrUndefined(brElm.nextSibling) && brElm.nextSibling.textContent.length > 0)) {
24482
- _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), !isNullOrUndefined(brElm.nextSibling) ? brElm.nextSibling : brElm, 0);
24483
- isEmptyBrInserted = false;
24484
- }
24485
- else {
24486
- var brElm2 = _this.parent.createElement('br');
24487
- _this.range.insertNode(brElm2);
24488
- _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), brElm, 0);
24489
- }
24591
+ _this.insertBRElement();
24490
24592
  }
24491
24593
  e.args.preventDefault();
24492
24594
  }
@@ -24496,6 +24598,30 @@ var EnterKeyAction = /** @__PURE__ @class */ (function () {
24496
24598
  }
24497
24599
  }
24498
24600
  };
24601
+ EnterKeyAction.prototype.insertBRElement = function () {
24602
+ var isEmptyBrInserted = false;
24603
+ var brElm = this.parent.createElement('br');
24604
+ if (this.startNode.nodeName === 'BR' && this.endNode.nodeName === 'BR' && this.range.startOffset === 0 && this.range.startOffset === this.range.endOffset) {
24605
+ this.parent.formatter.editorManager.domNode.insertAfter(brElm, this.startNode);
24606
+ isEmptyBrInserted = true;
24607
+ }
24608
+ else {
24609
+ if (this.startNode === this.parent.inputElement && !isNullOrUndefined(this.range.startContainer.previousSibling) &&
24610
+ this.range.startContainer.previousSibling.nodeName === 'BR' && this.range.startContainer.textContent.length === 0) {
24611
+ isEmptyBrInserted = true;
24612
+ }
24613
+ this.range.insertNode(brElm);
24614
+ }
24615
+ if (isEmptyBrInserted || (!isNullOrUndefined(brElm.nextElementSibling) && brElm.nextElementSibling.tagName === 'BR') || (!isNullOrUndefined(brElm.nextSibling) && brElm.nextSibling.textContent.length > 0)) {
24616
+ this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), !isNullOrUndefined(brElm.nextSibling) ? brElm.nextSibling : brElm, 0);
24617
+ isEmptyBrInserted = false;
24618
+ }
24619
+ else {
24620
+ var brElm2 = this.parent.createElement('br');
24621
+ this.range.insertNode(brElm2);
24622
+ this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), brElm, 0);
24623
+ }
24624
+ };
24499
24625
  EnterKeyAction.prototype.insertFocusContent = function () {
24500
24626
  if (this.range.startContainer.textContent.length === 0) {
24501
24627
  if (this.range.startContainer.nodeName === '#text') {
@@ -25923,7 +26049,7 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
25923
26049
  this.setProperties({ value: this.valueTemplate });
25924
26050
  }
25925
26051
  else {
25926
- var compiledTemplate = compile(this.valueTemplate)('', this, 'valueTemplate');
26052
+ var compiledTemplate = compile(this.valueTemplate)("", this, 'valueTemplate');
25927
26053
  for (var i = 0; i < compiledTemplate.length; i++) {
25928
26054
  var item = compiledTemplate[i];
25929
26055
  append([item], this.element);