@syncfusion/ej2-richtexteditor 19.4.52 → 19.4.55

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.
@@ -10828,7 +10828,15 @@ class Lists {
10828
10828
  return isNested;
10829
10829
  }
10830
10830
  applyListsHandler(e) {
10831
- const range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
10831
+ let range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
10832
+ if (range.startContainer === range.endContainer && range.startContainer === this.parent.editableElement &&
10833
+ range.startOffset === range.endOffset && range.startOffset === 0 &&
10834
+ this.parent.editableElement.textContent.length === 0 && (this.parent.editableElement.childNodes[0].nodeName != 'TABLE' &&
10835
+ this.parent.editableElement.childNodes[0].nodeName != 'IMG')) {
10836
+ const focusNode = range.startContainer.childNodes[0];
10837
+ this.parent.nodeSelection.setSelectionText(this.parent.currentDocument, focusNode, focusNode, 0, 0);
10838
+ range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
10839
+ }
10832
10840
  this.saveSelection = this.parent.nodeSelection.save(range, this.parent.currentDocument);
10833
10841
  this.currentAction = e.subCommand;
10834
10842
  this.currentAction = e.subCommand = this.currentAction === 'NumberFormatList' ? 'OL' : this.currentAction === 'BulletFormatList' ? 'UL' : this.currentAction;
@@ -12196,7 +12204,7 @@ class InsertHtml {
12196
12204
  let currentNode = nodes[nodes.length - 1];
12197
12205
  let splitedElm;
12198
12206
  if ((currentNode.nodeName === 'BR' || currentNode.nodeName === 'HR') && !isNullOrUndefined(currentNode.parentElement) &&
12199
- currentNode.parentElement.textContent.trim().length === 0 && !node.classList.contains('pasteContent')) {
12207
+ currentNode.parentElement.textContent.trim().length === 0 && (currentNode.parentElement === editNode || !node.classList.contains('pasteContent'))) {
12200
12208
  splitedElm = currentNode;
12201
12209
  }
12202
12210
  else {
@@ -12358,7 +12366,12 @@ class LinkCommand {
12358
12366
  }
12359
12367
  else {
12360
12368
  const domSelection = new NodeSelection();
12361
- const range = domSelection.getRange(this.parent.currentDocument);
12369
+ let range = domSelection.getRange(this.parent.currentDocument);
12370
+ if (range.endContainer.nodeName === '#text' && range.startContainer.textContent.length === (range.endOffset + 1) &&
12371
+ range.endContainer.textContent.charAt(range.endOffset) === ' ' && range.endContainer.nextSibling.nodeName === 'A') {
12372
+ domSelection.setSelectionText(this.parent.currentDocument, range.startContainer, range.endContainer, range.startOffset, range.endOffset + 1);
12373
+ range = domSelection.getRange(this.parent.currentDocument);
12374
+ }
12362
12375
  const text = isNullOrUndefined(e.item.text) ? true : e.item.text.replace(/ /g, '').localeCompare(range.toString()
12363
12376
  .replace(/\n/g, ' ').replace(/ /g, '')) < 0;
12364
12377
  if (e.event && e.event.type === 'keydown' && (e.event.keyCode === 32
@@ -13012,7 +13025,12 @@ class ImageCommand {
13012
13025
  removeImage(e) {
13013
13026
  if (closest(e.item.selectNode[0], 'a')) {
13014
13027
  if (e.item.selectNode[0].parentElement.nodeName === 'A' && !isNullOrUndefined(e.item.selectNode[0].parentElement.innerText)) {
13015
- detach(e.item.selectNode[0]);
13028
+ if (!isNullOrUndefined(closest(e.item.selectNode[0], '.' + CLASS_CAPTION))) {
13029
+ detach(closest(e.item.selectNode[0], '.' + CLASS_CAPTION));
13030
+ }
13031
+ else {
13032
+ detach(e.item.selectNode[0]);
13033
+ }
13016
13034
  }
13017
13035
  else {
13018
13036
  detach(closest(e.item.selectNode[0], 'a'));
@@ -14413,6 +14431,7 @@ class SelectionCommands {
14413
14431
  }
14414
14432
  static insertCursorNode(docElement, domSelection, range, isFormatted, nodeCutter, format, value, endNode) {
14415
14433
  const cursorNodes = domSelection.getNodeCollection(range);
14434
+ const domNode = new DOMNode(endNode, docElement);
14416
14435
  const cursorFormat = (cursorNodes.length > 0) ?
14417
14436
  (cursorNodes.length > 1 && range.startContainer === range.endContainer) ?
14418
14437
  this.getCursorFormat(isFormatted, cursorNodes, format, endNode) :
@@ -14420,11 +14439,16 @@ class SelectionCommands {
14420
14439
  let cursorNode = null;
14421
14440
  if (cursorFormat) {
14422
14441
  cursorNode = cursorNodes[0];
14423
- if (cursorFormat.firstChild.textContent.charCodeAt(0) === 8203) {
14442
+ if (cursorFormat.firstChild.textContent.charCodeAt(0) === 8203 && cursorFormat.firstChild.nodeType === 3) {
14424
14443
  const regEx = new RegExp(String.fromCharCode(8203), 'g');
14425
14444
  let emptySpaceNode;
14426
14445
  if (cursorFormat.firstChild === cursorNode) {
14427
- cursorNode.textContent = cursorNode.textContent.replace(regEx, '');
14446
+ cursorNode.textContent = (cursorFormat.parentElement && (domNode.isBlockNode(cursorFormat.parentElement) &&
14447
+ cursorFormat.parentElement.textContent.length <= 1 ? cursorFormat.parentElement.childElementCount > 1 :
14448
+ cursorFormat.childElementCount === 0) &&
14449
+ (cursorFormat.parentElement.textContent.length > 1 ||
14450
+ cursorFormat.parentElement.firstChild && cursorFormat.parentElement.firstChild.nodeType === 1) ?
14451
+ cursorNode.textContent : cursorNode.textContent.replace(regEx, ''));
14428
14452
  emptySpaceNode = cursorNode;
14429
14453
 
14430
14454
  }
@@ -17138,6 +17162,7 @@ class XhtmlValidation {
17138
17162
  class HtmlEditor {
17139
17163
  constructor(parent, serviceLocator) {
17140
17164
  this.rangeCollection = [];
17165
+ this.isImageDelete = false;
17141
17166
  this.parent = parent;
17142
17167
  this.locator = serviceLocator;
17143
17168
  this.renderFactory = this.locator.getService('rendererFactory');
@@ -17223,7 +17248,9 @@ class HtmlEditor {
17223
17248
  this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), range.startContainer, pointer);
17224
17249
  }
17225
17250
  if (!isNullOrUndefined(range.startContainer.previousSibling) && !isNullOrUndefined(range.startContainer.previousSibling.parentElement) &&
17226
- range.startContainer.parentElement === range.startContainer.previousSibling.parentElement && range.startContainer.previousSibling.textContent.charCodeAt(0) === 8203) {
17251
+ range.startContainer.parentElement === range.startContainer.previousSibling.parentElement &&
17252
+ range.startContainer.previousSibling.textContent.charCodeAt(0) === 8203 &&
17253
+ range.startContainer.previousSibling.textContent.length <= 1) {
17227
17254
  range.startContainer.previousSibling.textContent = range.startContainer.previousSibling.textContent.replace(regEx, '');
17228
17255
  }
17229
17256
  if (range.endContainer.textContent.charCodeAt(range.endOffset) === 8203) {
@@ -17310,7 +17337,9 @@ class HtmlEditor {
17310
17337
  this.oldRangeElement = null;
17311
17338
  this.deleteRangeElement = null;
17312
17339
  this.deleteOldRangeElement = null;
17313
- args.preventDefault();
17340
+ if (!this.isImageDelete) {
17341
+ args.preventDefault();
17342
+ }
17314
17343
  }
17315
17344
  }
17316
17345
  isOrderedList(editorValue) {
@@ -17434,7 +17463,15 @@ class HtmlEditor {
17434
17463
  return;
17435
17464
  }
17436
17465
  else {
17437
- this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), this.deleteRangeElement, this.deleteRangeElement.childNodes.length);
17466
+ if (currentRange.startOffset === 0 && currentRange.endOffset === 1 &&
17467
+ this.deleteRangeElement.childNodes[0].nodeName === 'IMG') {
17468
+ this.parent.formatter.editorManager.nodeSelection.setSelectionText(this.parent.contentModule.getDocument(), this.deleteRangeElement, this.deleteRangeElement, 0, 1);
17469
+ this.isImageDelete = true;
17470
+ }
17471
+ else {
17472
+ this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), this.deleteRangeElement, this.deleteRangeElement.childNodes.length);
17473
+ this.isImageDelete = false;
17474
+ }
17438
17475
  if (this.deleteRangeElement.querySelector('BR')) {
17439
17476
  detach(this.deleteRangeElement.querySelector('BR'));
17440
17477
  }
@@ -18014,6 +18051,11 @@ class PasteCleanup {
18014
18051
  }
18015
18052
  }
18016
18053
  }
18054
+ toolbarEnableDisable(state) {
18055
+ if (!this.parent.inlineMode.enable) {
18056
+ this.parent.toolbarModule.baseToolbar.toolbarObj.disable(state);
18057
+ }
18058
+ }
18017
18059
  uploadMethod(fileList, imgElem) {
18018
18060
  const uploadEle = document.createElement('div');
18019
18061
  document.body.appendChild(uploadEle);
@@ -18089,6 +18131,7 @@ class PasteCleanup {
18089
18131
  if (beforeUploadArgs.cancel) {
18090
18132
  return;
18091
18133
  }
18134
+ this.toolbarEnableDisable(true);
18092
18135
  /* eslint-disable */
18093
18136
  uploadObj.currentRequestHeader = beforeUploadArgs.currentRequest ?
18094
18137
  beforeUploadArgs.currentRequest : uploadObj.currentRequestHeader;
@@ -18100,6 +18143,7 @@ class PasteCleanup {
18100
18143
  }
18101
18144
  else {
18102
18145
  this.parent.trigger(beforeImageUpload, args);
18146
+ this.toolbarEnableDisable(true);
18103
18147
  }
18104
18148
  },
18105
18149
  // eslint-disable-next-line
@@ -18171,6 +18215,7 @@ class PasteCleanup {
18171
18215
  popupObj.close();
18172
18216
  imgElem.style.opacity = '1';
18173
18217
  uploadObj.destroy();
18218
+ this.toolbarEnableDisable(false);
18174
18219
  }
18175
18220
  refreshPopup(imageElement, popupObj) {
18176
18221
  const imgPosition = this.parent.iframeSettings.enable ? this.parent.element.offsetTop +
@@ -21674,7 +21719,8 @@ class Image {
21674
21719
  if (activePopupElement) {
21675
21720
  activePopupElement.classList.add(CLS_HIDE);
21676
21721
  }
21677
- if (e.dataTransfer.files.length > 0) { //For external image drag and drop
21722
+ const imgElement = this.parent.inputElement.ownerDocument.querySelector('.' + CLS_RTE_DRAG_IMAGE);
21723
+ if (e.dataTransfer.files.length > 0 && imgElement === null) { //For external image drag and drop
21678
21724
  if (e.dataTransfer.files.length > 1) {
21679
21725
  return;
21680
21726
  }
@@ -21697,7 +21743,6 @@ class Image {
21697
21743
  }
21698
21744
  else { //For internal image drag and drop
21699
21745
  const range = this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument());
21700
- const imgElement = this.parent.inputElement.ownerDocument.querySelector('.' + CLS_RTE_DRAG_IMAGE);
21701
21746
  if (imgElement && imgElement.tagName === 'IMG') {
21702
21747
  if (imgElement.nextElementSibling) {
21703
21748
  if (imgElement.nextElementSibling.classList.contains(CLS_IMG_INNER)) {
@@ -22819,7 +22864,7 @@ class Table {
22819
22864
  return;
22820
22865
  }
22821
22866
  const target = e.target || e.targetTouches[0].target;
22822
- const closestTable = closest(target, 'table');
22867
+ const closestTable = closest(target, 'table.e-rte-table');
22823
22868
  if (!isNullOrUndefined(this.curTable) && !isNullOrUndefined(closestTable) && closestTable !== this.curTable) {
22824
22869
  this.removeResizeElement();
22825
22870
  this.removeHelper(e);
@@ -24237,6 +24282,7 @@ class EnterKeyAction {
24237
24282
  else if (this.range.startOffset === 0 && this.range.endOffset === 0) {
24238
24283
  isFocusedFirst = true;
24239
24284
  }
24285
+ this.removeBRElement(nearBlockNode);
24240
24286
  if (((this.range.startOffset === 0 && this.range.endOffset === 0) || isFocusedFirst) &&
24241
24287
  !(!isNullOrUndefined(this.range.startContainer.previousSibling) &&
24242
24288
  (this.range.startContainer.previousSibling.nodeName === 'IMG' || this.range.startContainer.previousSibling.nodeName === 'BR'))) {
@@ -24340,6 +24386,7 @@ class EnterKeyAction {
24340
24386
  else {
24341
24387
  currentParent = this.startNode;
24342
24388
  }
24389
+ this.removeBRElement(currentParent);
24343
24390
  let currentParentLastChild = currentParent.lastChild;
24344
24391
  while (!isNullOrUndefined(currentParentLastChild) && !(currentParentLastChild.nodeName === '#text' || currentParentLastChild.nodeName === 'BR')) {
24345
24392
  currentParentLastChild = currentParentLastChild.lastChild;
@@ -24401,6 +24448,13 @@ class EnterKeyAction {
24401
24448
  }
24402
24449
  }
24403
24450
  }
24451
+ removeBRElement(currentElement) {
24452
+ if (Browser.userAgent.indexOf('Firefox') != -1 &&
24453
+ this.range.endOffset === currentElement.textContent.length &&
24454
+ currentElement.lastChild.nodeName === 'BR') {
24455
+ detach(currentElement.lastChild);
24456
+ }
24457
+ }
24404
24458
  insertBRElement() {
24405
24459
  let isEmptyBrInserted = false;
24406
24460
  const brElm = this.parent.createElement('br');
@@ -24857,6 +24911,27 @@ let RichTextEditor = class RichTextEditor extends Component {
24857
24911
  eventInitializer() {
24858
24912
  this.wireEvents();
24859
24913
  }
24914
+ cleanList(e) {
24915
+ const range = this.getRange();
24916
+ const currentStartContainer = range.startContainer;
24917
+ const currentEndContainer = range.endContainer;
24918
+ let currentStartOffset = range.startOffset;
24919
+ let isSameContainer = currentStartContainer === currentEndContainer ? true : false;
24920
+ let currentEndOffset;
24921
+ const endNode = range.endContainer.nodeName === '#text' ? range.endContainer.parentElement :
24922
+ range.endContainer;
24923
+ let closestLI = closest(endNode, 'LI');
24924
+ if (!isNullOrUndefined(closestLI) && endNode.textContent.length === range.endOffset &&
24925
+ !range.collapsed) {
24926
+ closestLI.textContent = closestLI.textContent.trim();
24927
+ currentEndOffset = closestLI.textContent.length - 1;
24928
+ let currentLastElem = closestLI;
24929
+ while (currentLastElem.nodeName !== '#text') {
24930
+ currentLastElem = currentLastElem.lastChild;
24931
+ }
24932
+ this.formatter.editorManager.nodeSelection.setSelectionText(this.contentModule.getDocument(), isSameContainer ? currentLastElem : currentStartContainer, currentLastElem, currentStartOffset, currentLastElem.textContent.length);
24933
+ }
24934
+ }
24860
24935
  /**
24861
24936
  * For internal use only - keydown the event handler;
24862
24937
  *
@@ -24869,6 +24944,9 @@ let RichTextEditor = class RichTextEditor extends Component {
24869
24944
  keyDown(e) {
24870
24945
  this.notify(keyDown, { member: 'keydown', args: e });
24871
24946
  this.restrict(e);
24947
+ if (this.editorMode === 'HTML') {
24948
+ this.cleanList(e);
24949
+ }
24872
24950
  if (this.editorMode === 'HTML' && ((e.which === 8 && e.code === 'Backspace') || (e.which === 46 && e.code === 'Delete'))) {
24873
24951
  const range = this.getRange();
24874
24952
  const startNode = range.startContainer.nodeName === '#text' ? range.startContainer.parentElement :