@syncfusion/ej2-richtexteditor 25.2.5 → 25.2.6

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.
@@ -13211,7 +13211,7 @@ class Lists {
13211
13211
  e.event.preventDefault();
13212
13212
  }
13213
13213
  }
13214
- onKeyUp() {
13214
+ onKeyUp(e) {
13215
13215
  if (!isNullOrUndefined(this.commonLIParent) && !isNullOrUndefined(this.commonLIParent.querySelector('.removeList'))) {
13216
13216
  const currentLIElem = this.commonLIParent.querySelector('.removeList');
13217
13217
  while (!isNullOrUndefined(currentLIElem.firstChild)) {
@@ -13219,6 +13219,14 @@ class Lists {
13219
13219
  }
13220
13220
  detach(currentLIElem);
13221
13221
  }
13222
+ if (e.event.keyCode === 13) {
13223
+ const listElements = this.parent.editableElement.querySelectorAll('UL, OL');
13224
+ for (let i = 0; i < listElements.length; i++) {
13225
+ if (!isNullOrUndefined(listElements[i]) && !isNullOrUndefined(listElements[i].parentElement) && !isNullOrUndefined(listElements[i].previousElementSibling) && (listElements[i].parentElement.nodeName === 'UL' || listElements[i].parentElement.nodeName === 'OL')) {
13226
+ listElements[i].previousElementSibling.appendChild(listElements[i]);
13227
+ }
13228
+ }
13229
+ }
13222
13230
  }
13223
13231
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
13224
13232
  firstListBackSpace(range, _e) {
@@ -13460,6 +13468,8 @@ class Lists {
13460
13468
  else {
13461
13469
  if (prevSibling.tagName === 'LI') {
13462
13470
  const nestedElement = createElement(elements[i].parentNode.tagName);
13471
+ nestedElement.style.listStyleType =
13472
+ elements[i].parentNode.style.listStyleType;
13463
13473
  append([nestedElement], prevSibling);
13464
13474
  append([elements[i]], nestedElement);
13465
13475
  }
@@ -13566,7 +13576,7 @@ class Lists {
13566
13576
  }
13567
13577
  let elemAtt;
13568
13578
  elements[i].style.removeProperty('margin-left');
13569
- elemAtt = elements[i].tagName === 'IMG' ? '' : this.domNode.attributes(elements[i]);
13579
+ elemAtt = elements[i].tagName === 'IMG' || elements[i].classList.contains('e-editor-select-start') ? '' : this.domNode.attributes(elements[i]);
13570
13580
  if (elements[i].getAttribute('contenteditable') === 'true'
13571
13581
  && elements[i].childNodes.length === 1 && elements[i].childNodes[0].nodeName === 'TABLE') {
13572
13582
  const listEle = document.createElement(type);
@@ -13687,6 +13697,13 @@ class Lists {
13687
13697
  for (let c = 0; c < liParents.length; c++) {
13688
13698
  const node = liParents[c];
13689
13699
  let toFindtopOlUl = true;
13700
+ let containsListElements = node;
13701
+ while (containsListElements.parentElement) {
13702
+ if (containsListElements.parentElement && containsListElements.parentElement.tagName !== 'LI' && containsListElements.parentElement.tagName !== 'OL' && containsListElements.parentElement.tagName !== 'UL') {
13703
+ break;
13704
+ }
13705
+ containsListElements = containsListElements.parentElement;
13706
+ }
13690
13707
  if (toFindtopOlUl && (liParents[c].parentElement.parentElement.nodeName === 'OL' || liParents[c].parentElement.parentElement.nodeName === 'UL')) {
13691
13708
  toFindtopOlUl = false;
13692
13709
  const preElement = liParents[c].parentElement.parentElement;
@@ -13706,9 +13723,43 @@ class Lists {
13706
13723
  node.previousElementSibling.lastChild.append(node);
13707
13724
  }
13708
13725
  }
13726
+ else if (this.domNode.isList(node.previousElementSibling) && containsListElements.contains(node.previousElementSibling) && ((node.tagName === 'OL' || node.tagName === 'UL') && (node.previousElementSibling.nodeName === 'OL' || node.previousElementSibling.nodeName === 'UL'))) {
13727
+ const contentNodes = this.domNode.contents(node);
13728
+ for (let f = 0; f < contentNodes.length; f++) {
13729
+ node.previousElementSibling.appendChild(contentNodes[f]);
13730
+ }
13731
+ node.parentNode.removeChild(node);
13732
+ }
13709
13733
  }
13710
13734
  if (firstNodeOL) {
13711
13735
  firstNodeOL.style.listStyleType = listStyleType;
13736
+ const range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
13737
+ let listOlUlElements = [];
13738
+ if (range.commonAncestorContainer.nodeName === 'UL' || range.commonAncestorContainer.nodeName === 'OL') {
13739
+ if (range.commonAncestorContainer instanceof Element) {
13740
+ listOlUlElements.push(range.commonAncestorContainer);
13741
+ }
13742
+ listOlUlElements = listOlUlElements.concat(Array.from(range.commonAncestorContainer.querySelectorAll('ol, ul')));
13743
+ }
13744
+ else {
13745
+ listOlUlElements = Array.from(range.commonAncestorContainer.querySelectorAll('ol, ul'));
13746
+ }
13747
+ for (let k = 0; k < listOlUlElements.length; k++) {
13748
+ let listStyle;
13749
+ let listElements = listOlUlElements[k];
13750
+ while (listElements) {
13751
+ if (listElements.nodeName === 'OL' || listElements.nodeName === 'OL') {
13752
+ if (listElements.style.listStyleType !== '' && listElements.style.listStyleType !== 'none' && listElements.nodeName !== 'LI') {
13753
+ listStyle = listElements.style.listStyleType;
13754
+ }
13755
+ else if (!isNullOrUndefined(listStyle) && (listElements.style.listStyleType === '' || listElements.style.listStyleType === 'none') &&
13756
+ listElements.nodeName !== 'LI' && (listElements.nodeName === 'UL' || listElements.nodeName === 'OL')) {
13757
+ listElements.style.listStyleType = listStyle;
13758
+ }
13759
+ }
13760
+ listElements = listElements.querySelector('UL,OL');
13761
+ }
13762
+ }
13712
13763
  }
13713
13764
  }
13714
13765
  findUnSelected(temp, elements) {
@@ -19930,7 +19981,7 @@ class MsWordPaste {
19930
19981
  !isNormalList) {
19931
19982
  prevList = null;
19932
19983
  }
19933
- const pElement = createElement('p', { className: 'MsoNormal' });
19984
+ const pElement = createElement('p', { className: 'MsoNoSpacing' });
19934
19985
  pElement.innerHTML = collection[index].content.join(' ');
19935
19986
  if ((collection[index].nestedLevel === 1) &&
19936
19987
  (listCount === 0 || lfo !== collection[index].listFormatOverride) &&
@@ -21964,7 +22015,7 @@ class HtmlEditor {
21964
22015
  const range = this.nodeSelectionObj.getRange(this.contentRenderer.getDocument());
21965
22016
  const parentNode = this.nodeSelectionObj.getParentNodeCollection(range);
21966
22017
  if (!((parentNode[0].nodeName === 'LI' || closest(parentNode[0], 'li') ||
21967
- closest(parentNode[0], 'table')) && range.startOffset === 0)) {
22018
+ closest(parentNode[0], 'table')))) {
21968
22019
  args.preventDefault();
21969
22020
  const selection = this.contentRenderer.getDocument().getSelection().getRangeAt(0);
21970
22021
  let alignmentNodes = this.parent.formatter.editorManager.domNode.blockNodes();
@@ -23345,7 +23396,8 @@ class PasteCleanup {
23345
23396
  clipBoardElem = this.allowedStyle(clipBoardElem);
23346
23397
  }
23347
23398
  this.saveSelection.restore();
23348
- clipBoardElem.innerHTML = this.sanitizeHelper(clipBoardElem.innerHTML);
23399
+ const newText = clipBoardElem.innerHTML.split("&").join("&amp;");
23400
+ clipBoardElem.innerHTML = this.sanitizeHelper(newText);
23349
23401
  const allImg = clipBoardElem.querySelectorAll('img');
23350
23402
  for (let i = 0; i < allImg.length; i++) {
23351
23403
  if (!isNullOrUndefined(allImg[i].getAttribute('src'))) {
@@ -26704,13 +26756,13 @@ class Image$1 {
26704
26756
  selectParentEle = this.parent.formatter.editorManager.nodeSelection.getParentNodeCollection(range);
26705
26757
  if (!originalEvent.ctrlKey && originalEvent.key && (originalEvent.key.length === 1 || originalEvent.action === 'enter') &&
26706
26758
  (!isNullOrUndefined(selectParentEle[0]) && selectParentEle[0].tagName === 'IMG') && selectParentEle[0].parentElement) {
26707
- const prev = selectParentEle[0].parentElement.childNodes[0];
26708
26759
  if (this.contentModule.getEditPanel().querySelector('.e-img-resize')) {
26709
26760
  this.removeResizeEle();
26710
26761
  }
26711
- this.parent.formatter.editorManager.nodeSelection.setSelectionText(this.contentModule.getDocument(), prev, prev, prev.textContent.length, prev.textContent.length);
26712
26762
  removeClass([selectParentEle[0]], 'e-img-focus');
26713
- this.quickToolObj.imageQTBar.hidePopup();
26763
+ if (this.quickToolObj && this.quickToolObj.imageQTBar) {
26764
+ this.quickToolObj.imageQTBar.hidePopup();
26765
+ }
26714
26766
  }
26715
26767
  }
26716
26768
  if (originalEvent.ctrlKey && (originalEvent.keyCode === 89 || originalEvent.keyCode === 90)) {
@@ -33488,16 +33540,18 @@ class EnterKeyAction {
33488
33540
  this.getRangeNode();
33489
33541
  let isTableEnter = true;
33490
33542
  this.formatTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'blockquote'];
33491
- const isCursorAtTableEnd = this.range.collapsed && (this.range.startContainer.nodeType === 1) &&
33492
- this.range.startContainer.isContentEditable &&
33493
- this.range.startContainer.childNodes[this.range.startOffset - 1] &&
33494
- this.range.startContainer.childNodes[this.range.startOffset - 1].nodeName === 'TABLE';
33495
- const isCursorAtTableStart = this.range.collapsed && (this.range.startContainer.nodeType === 1) &&
33496
- this.range.startContainer.isContentEditable && this.range.startContainer.childNodes[this.range.startOffset] &&
33497
- this.range.startContainer.childNodes[this.range.startOffset].nodeName === 'TABLE';
33498
- if (isCursorAtTableEnd || isCursorAtTableStart) {
33499
- this.handleCursorAtTableSide(e, isCursorAtTableStart, isCursorAtTableEnd);
33500
- return;
33543
+ const tableImagCursor = this.processedTableImageCursor();
33544
+ if (tableImagCursor.start || tableImagCursor.end) {
33545
+ if (tableImagCursor.startName === 'TABLE' || tableImagCursor.endName === 'TABLE') { // Default browser action prevented and hanled manually.
33546
+ this.handleCursorAtTableSide(e, tableImagCursor.start, tableImagCursor.end);
33547
+ return;
33548
+ }
33549
+ }
33550
+ if (tableImagCursor.start || tableImagCursor.end || this.range.startContainer.nodeName === 'IMG') {
33551
+ if (this.parent.enterKey === 'BR' && (tableImagCursor.startName === 'IMG' || tableImagCursor.endName === 'IMG' || this.range.startContainer.nodeName === 'IMG')) { // Default browser action prevented and hanled manually.
33552
+ this.handleEnterKeyAtImageSide(e, tableImagCursor.start, tableImagCursor.end);
33553
+ return;
33554
+ }
33501
33555
  }
33502
33556
  if (!isNullOrUndefined(this.startNode.closest('TABLE')) && !isNullOrUndefined(this.endNode.closest('TABLE'))) {
33503
33557
  isTableEnter = false;
@@ -33865,7 +33919,6 @@ class EnterKeyAction {
33865
33919
  const outerBRElem = this.parent.createElement('br');
33866
33920
  if (this.range.startOffset === 0 && this.range.endOffset === 0 &&
33867
33921
  !isNullOrUndefined(currentParent.previousSibling) && currentParent.previousSibling.nodeName === 'BR' && currentParent.nodeName !== 'P' && currentParent.nodeName !== 'DIV') {
33868
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
33869
33922
  newElem = this.parent.formatter.editorManager.nodeCutter.SplitNode(this.range, currentParent, false).cloneNode(true);
33870
33923
  this.parent.formatter.editorManager.domNode.insertAfter(outerBRElem, currentParent);
33871
33924
  this.insertFocusContent();
@@ -33895,7 +33948,7 @@ class EnterKeyAction {
33895
33948
  }
33896
33949
  e.args.preventDefault();
33897
33950
  }
33898
- this.parent.trigger(actionComplete, { requestType: shiftKey ? 'ShiftEnterAction' : 'EnterAction', args: e.args });
33951
+ this.triggerActionComplete(e, shiftKey);
33899
33952
  }
33900
33953
  });
33901
33954
  }
@@ -33965,6 +34018,9 @@ class EnterKeyAction {
33965
34018
  }
33966
34019
  return insertElem;
33967
34020
  }
34021
+ triggerActionComplete(e, shiftKey) {
34022
+ this.parent.trigger(actionComplete, { requestType: shiftKey ? 'ShiftEnterAction' : 'EnterAction', args: e.args });
34023
+ }
33968
34024
  handleCursorAtTableSide(e, isStart, isEnd) {
33969
34025
  if (this.parent.enterKey !== 'BR') {
33970
34026
  const shiftKey = e.args.shiftKey;
@@ -33994,11 +34050,91 @@ class EnterKeyAction {
33994
34050
  }
33995
34051
  this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), newElement, 0);
33996
34052
  e.args.preventDefault();
33997
- this.parent.trigger(actionComplete, { requestType: shiftKey ? 'ShiftEnterAction' : 'EnterAction', args: e.args });
34053
+ this.triggerActionComplete(e, shiftKey);
33998
34054
  }
33999
34055
  });
34000
34056
  }
34001
34057
  }
34058
+ handleEnterKeyAtImageSide(e, isStart, isEnd) {
34059
+ const actionBeginArgs = {
34060
+ cancel: false,
34061
+ name: actionBegin,
34062
+ requestType: e.args.shiftKey ? 'ShiftEnterAction' : 'EnterAction',
34063
+ originalEvent: e.args
34064
+ };
34065
+ let directRange = false;
34066
+ if (this.range.startContainer.nodeName === 'IMG' && this.range.startOffset === 0) {
34067
+ directRange = true;
34068
+ }
34069
+ this.parent.trigger(actionBegin, actionBeginArgs, (actionBeginArgs) => {
34070
+ if (!actionBeginArgs.cancel) {
34071
+ if (this.parent.enterKey === 'BR') {
34072
+ const newElement = this.parent.createElement('BR');
34073
+ let imageElement;
34074
+ if (directRange) {
34075
+ imageElement = this.range.startContainer;
34076
+ imageElement.parentElement.insertBefore(newElement, imageElement);
34077
+ this.parent.formatter.editorManager.nodeSelection.
34078
+ setCursorPoint(this.parent.contentModule.getDocument(), imageElement, 0);
34079
+ }
34080
+ if (isStart) {
34081
+ imageElement = this.range.startContainer.childNodes[this.range.startOffset];
34082
+ imageElement.parentElement.insertBefore(newElement, imageElement);
34083
+ this.parent.formatter.editorManager.nodeSelection.
34084
+ setCursorPoint(this.parent.contentModule.getDocument(), imageElement, 0);
34085
+ }
34086
+ if (isEnd) {
34087
+ imageElement = this.range.startContainer.childNodes[this.range.startOffset - 1];
34088
+ if (!isNullOrUndefined(imageElement.nextSibling)) {
34089
+ imageElement.parentElement.insertBefore(newElement, imageElement.nextSibling);
34090
+ this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), newElement.nextSibling, 0);
34091
+ }
34092
+ else if (isNullOrUndefined(imageElement.nextSibling)) {
34093
+ imageElement.parentElement.appendChild(newElement);
34094
+ const brElement = this.parent.createElement('BR');
34095
+ imageElement.parentElement.appendChild(brElement);
34096
+ this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), brElement, 0);
34097
+ }
34098
+ }
34099
+ e.args.preventDefault();
34100
+ this.triggerActionComplete(e, e.args.shiftKey);
34101
+ }
34102
+ }
34103
+ });
34104
+ }
34105
+ isTableOrImageStart() {
34106
+ const customHandlerElements = ['IMG', 'TABLE'];
34107
+ const startContainer = this.range.startContainer;
34108
+ const startOffset = this.range.startOffset;
34109
+ const isCursorAtStart = this.range.collapsed && (startContainer.nodeType === 1) &&
34110
+ startContainer.isContentEditable && startContainer.childNodes[startOffset] &&
34111
+ (customHandlerElements.indexOf(startContainer.childNodes[startOffset].nodeName) > -1);
34112
+ if (isCursorAtStart) {
34113
+ return { start: isCursorAtStart, startNodeName: startContainer.childNodes[startOffset].nodeName };
34114
+ }
34115
+ else {
34116
+ return { start: false, startNodeName: '' };
34117
+ }
34118
+ }
34119
+ isTableOrImageEnd() {
34120
+ const customHandlerElements = ['IMG', 'TABLE'];
34121
+ const startContainer = this.range.startContainer;
34122
+ const startOffset = this.range.startOffset;
34123
+ const isCursorAtEnd = this.range.collapsed && (startContainer.nodeType === 1) &&
34124
+ startContainer.isContentEditable && startContainer.childNodes[startOffset - 1] &&
34125
+ (customHandlerElements.indexOf(startContainer.childNodes[startOffset - 1].nodeName) > -1);
34126
+ if (isCursorAtEnd) {
34127
+ return { end: isCursorAtEnd, endNodeName: startContainer.childNodes[startOffset - 1].nodeName };
34128
+ }
34129
+ else {
34130
+ return { end: false, endNodeName: '' };
34131
+ }
34132
+ }
34133
+ processedTableImageCursor() {
34134
+ const { start, startNodeName } = this.isTableOrImageStart();
34135
+ const { end, endNodeName } = this.isTableOrImageEnd();
34136
+ return { start, startName: startNodeName, end, endName: endNodeName };
34137
+ }
34002
34138
  }
34003
34139
 
34004
34140
  var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -35370,7 +35506,7 @@ let RichTextEditor = class RichTextEditor extends Component {
35370
35506
  }
35371
35507
  }
35372
35508
  updatePanelValue() {
35373
- let value = this.value;
35509
+ let value = this.listOrderCorrection(this.value);
35374
35510
  value = (this.enableHtmlEncode && this.value) ? decode(value) : value;
35375
35511
  const getTextArea = this.element.querySelector('.' + CLS_RTE_SOURCE_CODE_TXTAREA);
35376
35512
  if (value) {
@@ -35414,6 +35550,17 @@ let RichTextEditor = class RichTextEditor extends Component {
35414
35550
  this.countModule.refresh();
35415
35551
  }
35416
35552
  }
35553
+ listOrderCorrection(value) {
35554
+ const valueElementWrapper = this.createElement('div');
35555
+ valueElementWrapper.innerHTML = value;
35556
+ const listElements = valueElementWrapper.querySelectorAll('UL, OL');
35557
+ for (let i = 0; i < listElements.length; i++) {
35558
+ if (!isNullOrUndefined(listElements[i]) && !isNullOrUndefined(listElements[i].parentElement) && !isNullOrUndefined(listElements[i].previousElementSibling) && (listElements[i].parentElement.nodeName === 'UL' || listElements[i].parentElement.nodeName === 'OL')) {
35559
+ listElements[i].previousElementSibling.appendChild(listElements[i]);
35560
+ }
35561
+ }
35562
+ return valueElementWrapper.innerHTML;
35563
+ }
35417
35564
  setHeight(height) {
35418
35565
  if (height !== 'auto') {
35419
35566
  this.element.style.height = formatUnit(height);