@syncfusion/ej2-richtexteditor 23.1.41 → 23.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.
@@ -3363,10 +3363,10 @@ class ToolbarRenderer {
3363
3363
  if (!this.parent.enabled) {
3364
3364
  return;
3365
3365
  }
3366
+ this.parent.trigger('toolbarClick', args);
3366
3367
  if (!this.parent.readonly || isNullOrUndefined(args.item)) {
3367
3368
  this.parent.notify(toolbarClick, args);
3368
3369
  }
3369
- this.parent.trigger('toolbarClick', args);
3370
3370
  }
3371
3371
  dropDownSelected(args) {
3372
3372
  this.parent.notify(dropDownSelect, args);
@@ -4806,6 +4806,7 @@ class ToolbarAction {
4806
4806
  */
4807
4807
  class Toolbar$2 {
4808
4808
  constructor(parent, serviceLocator) {
4809
+ this.tools = {};
4809
4810
  this.parent = parent;
4810
4811
  this.isToolbar = false;
4811
4812
  this.locator = serviceLocator;
@@ -13440,7 +13441,8 @@ class InsertHtml {
13440
13441
  : lastSelectionNode.previousSibling) : lastSelectionNode;
13441
13442
  while (!isNullOrUndefined(lastSelectionNode) && lastSelectionNode.nodeName !== '#text' && lastSelectionNode.nodeName !== 'IMG' &&
13442
13443
  lastSelectionNode.nodeName !== 'BR' && lastSelectionNode.nodeName !== 'HR') {
13443
- if (!isNullOrUndefined(lastSelectionNode.lastChild) && (lastSelectionNode.lastChild.nodeName === 'P' && lastSelectionNode.lastChild.innerHTML === '')) {
13444
+ if (!isNullOrUndefined(lastSelectionNode.lastChild) && (lastSelectionNode.lastChild.nodeName === 'P' &&
13445
+ lastSelectionNode.lastChild.innerHTML === '')) {
13444
13446
  const lineBreak = createElement('br');
13445
13447
  lastSelectionNode.lastChild.appendChild(lineBreak);
13446
13448
  }
@@ -13910,7 +13912,7 @@ class LinkCommand {
13910
13912
  for (let i = 0; i < blockNodes.length; i++) {
13911
13913
  const linkNode = blockNodes[i].querySelectorAll('a');
13912
13914
  for (let j = 0; j < linkNode.length; j++) {
13913
- if (document.getSelection().containsNode(linkNode[j], true)) {
13915
+ if (this.parent.currentDocument.getSelection().containsNode(linkNode[j], true)) {
13914
13916
  linkNode[j].outerHTML = linkNode[j].innerHTML;
13915
13917
  }
13916
13918
  }
@@ -17744,8 +17746,8 @@ class MsWordPaste {
17744
17746
  }
17745
17747
  isCroppedImage = ((this.extractCropValue('cropl', fullImg[i]) > 0 &&
17746
17748
  this.extractCropValue('cropt', fullImg[i]) > 0) ||
17747
- (this.extractCropValue('cropr', fullImg[i]) > 0 &&
17748
- this.extractCropValue('cropb', fullImg[i]))) ? true : false;
17749
+ this.extractCropValue('cropr', fullImg[i]) > 0 ||
17750
+ this.extractCropValue('cropb', fullImg[i])) ? true : false;
17749
17751
  if (isCroppedImage) {
17750
17752
  goalWidth = this.extractCropValue('wgoal', fullImg[i]);
17751
17753
  goalHeight = this.extractCropValue('hgoal', fullImg[i]);
@@ -17772,7 +17774,7 @@ class MsWordPaste {
17772
17774
  }
17773
17775
  extractCropValue(crop, rtfData) {
17774
17776
  // eslint-disable-next-line security/detect-non-literal-regexp
17775
- const result = new RegExp('\\\\pic' + crop + '(\\-?\\d+)\\\\').exec(rtfData.replace(/\r\n\\/g, '\\'))[1];
17777
+ const result = new RegExp('\\\\pic' + crop + '(\\-?\\d+)\\\\').exec(rtfData.replace(/\r\n\\/g, '\\').replace(/\n/g, '\\'))[1];
17776
17778
  return parseInt(result, 10);
17777
17779
  }
17778
17780
  removeClassName(elm) {
@@ -17811,6 +17813,10 @@ class MsWordPaste {
17811
17813
  return removableElement;
17812
17814
  }
17813
17815
  removeUnwantedElements(elm) {
17816
+ let styleElm = elm.querySelector('style');
17817
+ if (!isNullOrUndefined(styleElm)) {
17818
+ detach(styleElm);
17819
+ }
17814
17820
  let innerElement = elm.innerHTML;
17815
17821
  for (let i = 0; i < this.removableElements.length; i++) {
17816
17822
  // eslint-disable-next-line security/detect-non-literal-regexp
@@ -18108,10 +18114,8 @@ class MsWordPaste {
18108
18114
  }
18109
18115
  if (!isNullOrUndefined(listNodes[i].getAttribute('style'))) {
18110
18116
  listNodes[i].setAttribute('style', listNodes[i].getAttribute('style').replace('text-align:start;', ''));
18111
- if (listNodes[i].style.textAlign !== '') {
18112
- listNodes[i].setAttribute('style', 'text-align:' + listNodes[i].style.textAlign);
18113
- currentListStyle = listNodes[i].getAttribute('style');
18114
- }
18117
+ listNodes[i].style.textIndent = '';
18118
+ currentListStyle = listNodes[i].getAttribute('style');
18115
18119
  }
18116
18120
  collection.push({
18117
18121
  listType: type, content: tempNode, nestedLevel: level, class: currentClassName,
@@ -18319,8 +18323,7 @@ class MsWordPaste {
18319
18323
  }
18320
18324
  }
18321
18325
  prevList.setAttribute('class', collection[index].class);
18322
- const currentStyle = prevList.getAttribute('style');
18323
- prevList.setAttribute('style', (!isNullOrUndefined(currentStyle) ? currentStyle : ''));
18326
+ prevList.setAttribute('style', (!isNullOrUndefined(collection[index].listStyle) ? collection[index].listStyle : ''));
18324
18327
  pLevel = collection[index].nestedLevel;
18325
18328
  listCount++;
18326
18329
  if (!isNullOrUndefined(collection[index].start)) {
@@ -18763,7 +18766,7 @@ class EmojiPickerAction {
18763
18766
  }
18764
18767
  emojiInsert(args) {
18765
18768
  const node = document.createTextNode(args.value);
18766
- const selection = window.getSelection();
18769
+ const selection = this.parent.currentDocument.getSelection();
18767
18770
  const range = selection.getRangeAt(0);
18768
18771
  const cursorPos = range.startOffset;
18769
18772
  for (let i = cursorPos - 1; i >= cursorPos - 15; i--) {
@@ -22835,7 +22838,7 @@ class EmojiPicker {
22835
22838
  }
22836
22839
  else if (isNullOrUndefined(args.x) && isNullOrUndefined(args.y) && !this.parent.inlineMode.enable && isNullOrUndefined(this.parent.quickToolbarSettings.text)) {
22837
22840
  target = this.parent.inputElement;
22838
- if (window.getSelection().rangeCount > 0) {
22841
+ if (this.parent.contentModule.getDocument().getSelection().rangeCount > 0) {
22839
22842
  const coordinates = this.getCoordinates();
22840
22843
  xValue = coordinates.left;
22841
22844
  yValue = coordinates.top;
@@ -22843,7 +22846,7 @@ class EmojiPicker {
22843
22846
  }
22844
22847
  else if (isNullOrUndefined(args.x) && isNullOrUndefined(args.y) && (this.parent.inlineMode.enable || !isNullOrUndefined(this.parent.quickToolbarSettings.text))) {
22845
22848
  this.parent.notify(hidePopup, {});
22846
- if (window.getSelection().rangeCount > 0) {
22849
+ if (this.parent.contentModule.getDocument().getSelection().rangeCount > 0) {
22847
22850
  const coordinates = this.getCoordinates();
22848
22851
  xValue = coordinates.left;
22849
22852
  yValue = coordinates.top;
@@ -23432,7 +23435,7 @@ class EmojiPicker {
23432
23435
  }
23433
23436
  onkeyPress(e) {
23434
23437
  const originalEvent = e.args;
23435
- const selection = window.getSelection();
23438
+ const selection = this.parent.contentModule.getDocument().getSelection();
23436
23439
  if (selection.rangeCount <= 0) {
23437
23440
  return;
23438
23441
  }
@@ -23462,7 +23465,10 @@ class EmojiPicker {
23462
23465
  }
23463
23466
  onkeyUp(e) {
23464
23467
  const originalEvent = e.args;
23465
- const selection = window.getSelection();
23468
+ const selection = this.parent.contentModule.getDocument().getSelection();
23469
+ if (selection.rangeCount <= 0) {
23470
+ return;
23471
+ }
23466
23472
  const range = selection.getRangeAt(0);
23467
23473
  const cursorPos = range.startOffset;
23468
23474
  // eslint-disable-next-line
@@ -23485,7 +23491,7 @@ class EmojiPicker {
23485
23491
  }
23486
23492
  getCoordinates() {
23487
23493
  let coordinates;
23488
- const selection = window.getSelection();
23494
+ const selection = this.parent.contentModule.getDocument().getSelection();
23489
23495
  const range = selection.getRangeAt(0);
23490
23496
  let firstChild;
23491
23497
  if (range.startContainer.nodeName === 'P' || range.startContainer.nodeName === 'DIV') {
@@ -25656,7 +25662,7 @@ class Image$1 {
25656
25662
  }
25657
25663
  }
25658
25664
  if (target.tagName !== 'IMG') {
25659
- let items = this.contentModule.getEditPanel().querySelectorAll('img');
25665
+ const items = this.contentModule.getEditPanel().querySelectorAll('img');
25660
25666
  for (let i = 0; i < items.length; i++) {
25661
25667
  removeClass([items[i]], 'e-img-focus');
25662
25668
  removeClass([items[i]], 'e-resize');
@@ -32399,7 +32405,8 @@ let RichTextEditor = class RichTextEditor extends Component {
32399
32405
  }
32400
32406
  }
32401
32407
  const notFormatPainterCopy = isNullOrUndefined(e.action) ? true : (e.action !== 'format-copy' ? true : false);
32402
- if (this.formatter.getUndoRedoStack().length === 0 && notFormatPainterCopy && !(e.altKey || e.shiftKey || (e.altKey && e.shiftKey && e.which == 67))) {
32408
+ if (this.formatter.getUndoRedoStack().length === 0 && notFormatPainterCopy &&
32409
+ !(e.altKey || e.shiftKey || (e.altKey && e.shiftKey && e.which === 67))) {
32403
32410
  this.formatter.saveData();
32404
32411
  }
32405
32412
  if (e.action !== 'insert-link' &&
@@ -33515,8 +33522,8 @@ let RichTextEditor = class RichTextEditor extends Component {
33515
33522
  }
33516
33523
  else {
33517
33524
  if (target === 'windowResize' && heightPercent) {
33518
- // cntEle hide the borderBottom of RichTextEditor. so removed the 2px of cntEle height.
33519
- heightValue = parseInt(heightValue) - 2 + 'px';
33525
+ //cntEle hide the borderBottom of RichTextEditor. so removed the 2px of cntEle height.
33526
+ heightValue = parseInt(heightValue, 10) - 2 + 'px';
33520
33527
  }
33521
33528
  setStyleAttribute(cntEle, { height: heightValue, marginTop: topValue + 'px' });
33522
33529
  }
@@ -33540,7 +33547,7 @@ let RichTextEditor = class RichTextEditor extends Component {
33540
33547
  * @public
33541
33548
  */
33542
33549
  getHtml() {
33543
- const htmlValue = this.contentModule.getEditPanel().innerHTML;
33550
+ const htmlValue = this.removeResizeElement(this.contentModule.getEditPanel().innerHTML);
33544
33551
  return (this.enableXhtml && (htmlValue === '<p><br></p>' || htmlValue === '<div><br></div>' ||
33545
33552
  htmlValue === '<br>') ? null : this.serializeValue(htmlValue));
33546
33553
  }
@@ -33551,7 +33558,7 @@ let RichTextEditor = class RichTextEditor extends Component {
33551
33558
  * @public
33552
33559
  */
33553
33560
  getXhtml() {
33554
- let currentValue = this.value;
33561
+ let currentValue = this.removeResizeElement(this.value);
33555
33562
  if (!isNullOrUndefined(currentValue) && this.enableXhtml) {
33556
33563
  currentValue = this.htmlEditorModule.xhtmlValidation.selfEncloseValidation(currentValue);
33557
33564
  }
@@ -33792,14 +33799,11 @@ let RichTextEditor = class RichTextEditor extends Component {
33792
33799
  }
33793
33800
  getUpdatedValue() {
33794
33801
  let value;
33795
- if (!isNullOrUndefined(this.tableModule)) {
33796
- this.tableModule.removeResizeElement();
33797
- }
33798
33802
  const getTextArea = this.element.querySelector('.e-rte-srctextarea');
33799
33803
  if (this.editorMode === 'HTML') {
33800
33804
  value = (this.inputElement.innerHTML === '<p><br></p>' || this.inputElement.innerHTML === '<div><br></div>' ||
33801
33805
  this.inputElement.innerHTML === '<br>') ? null : this.enableHtmlEncode ?
33802
- this.encode(decode(this.inputElement.innerHTML)) : this.inputElement.innerHTML;
33806
+ this.encode(decode(this.removeResizeElement(this.inputElement.innerHTML))) : this.inputElement.innerHTML;
33803
33807
  if (getTextArea && getTextArea.style.display === 'block') {
33804
33808
  value = getTextArea.value;
33805
33809
  }
@@ -33808,6 +33812,9 @@ let RichTextEditor = class RichTextEditor extends Component {
33808
33812
  value = this.inputElement.value === '' ? null :
33809
33813
  this.inputElement.value;
33810
33814
  }
33815
+ if (value != null && !this.enableHtmlEncode) {
33816
+ value = this.removeResizeElement(value);
33817
+ }
33811
33818
  return value;
33812
33819
  }
33813
33820
  updateValueOnIdle() {
@@ -33823,6 +33830,17 @@ let RichTextEditor = class RichTextEditor extends Component {
33823
33830
  clearTimeout(this.idleInterval);
33824
33831
  this.idleInterval = setTimeout(this.updateValueOnIdle.bind(this), 0);
33825
33832
  }
33833
+ removeResizeElement(value) {
33834
+ let valueElementWrapper = document.createElement("div");
33835
+ valueElementWrapper.innerHTML = value;
33836
+ let item = valueElementWrapper.querySelectorAll('.e-column-resize, .e-row-resize, .e-table-box, .e-table-rhelper, .e-img-resize');
33837
+ if (item.length > 0) {
33838
+ for (let i = 0; i < item.length; i++) {
33839
+ detach(item[i]);
33840
+ }
33841
+ }
33842
+ return valueElementWrapper.innerHTML;
33843
+ }
33826
33844
  updateStatus(e) {
33827
33845
  if (!isNullOrUndefined(e.html) || !isNullOrUndefined(e.markdown)) {
33828
33846
  const status = this.formatter.editorManager.undoRedoManager.getUndoStatus();
@@ -33871,6 +33889,7 @@ let RichTextEditor = class RichTextEditor extends Component {
33871
33889
  this.notify(focusChange, {});
33872
33890
  const value = this.getUpdatedValue();
33873
33891
  this.setProperties({ value: value });
33892
+ this.valueContainer.value = this.value;
33874
33893
  this.notify(toolbarRefresh, { args: e, documentNode: document });
33875
33894
  this.isValueChangeBlurhandler = true;
33876
33895
  this.invokeChangeEvent();