@syncfusion/ej2-richtexteditor 25.1.35 → 25.1.37

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 (53) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/ej2-richtexteditor.min.js +2 -2
  3. package/dist/ej2-richtexteditor.umd.min.js +2 -2
  4. package/dist/ej2-richtexteditor.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-richtexteditor.es2015.js +28 -15
  6. package/dist/es6/ej2-richtexteditor.es2015.js.map +1 -1
  7. package/dist/es6/ej2-richtexteditor.es5.js +29 -16
  8. package/dist/es6/ej2-richtexteditor.es5.js.map +1 -1
  9. package/dist/global/ej2-richtexteditor.min.js +2 -2
  10. package/dist/global/ej2-richtexteditor.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +9 -9
  13. package/src/editor-manager/plugin/dom-node.js +2 -1
  14. package/src/editor-manager/plugin/lists.js +12 -0
  15. package/src/editor-manager/plugin/ms-word-clean-up.js +2 -2
  16. package/src/editor-manager/plugin/selection-commands.js +4 -0
  17. package/src/rich-text-editor/base/rich-text-editor.js +2 -4
  18. package/src/rich-text-editor/renderer/toolbar-renderer.js +7 -9
  19. package/styles/bootstrap-dark.css +4 -0
  20. package/styles/bootstrap.css +4 -0
  21. package/styles/bootstrap4.css +4 -0
  22. package/styles/bootstrap5-dark.css +4 -0
  23. package/styles/bootstrap5.css +4 -0
  24. package/styles/fabric-dark.css +4 -0
  25. package/styles/fabric.css +4 -0
  26. package/styles/fluent-dark.css +4 -0
  27. package/styles/fluent.css +4 -0
  28. package/styles/highcontrast-light.css +4 -0
  29. package/styles/highcontrast.css +4 -0
  30. package/styles/material-dark.css +4 -0
  31. package/styles/material.css +4 -0
  32. package/styles/material3-dark.css +4 -0
  33. package/styles/material3.css +4 -0
  34. package/styles/rich-text-editor/_layout.scss +4 -4
  35. package/styles/rich-text-editor/bootstrap-dark.css +4 -0
  36. package/styles/rich-text-editor/bootstrap.css +4 -0
  37. package/styles/rich-text-editor/bootstrap4.css +4 -0
  38. package/styles/rich-text-editor/bootstrap5-dark.css +4 -0
  39. package/styles/rich-text-editor/bootstrap5.css +4 -0
  40. package/styles/rich-text-editor/fabric-dark.css +4 -0
  41. package/styles/rich-text-editor/fabric.css +4 -0
  42. package/styles/rich-text-editor/fluent-dark.css +4 -0
  43. package/styles/rich-text-editor/fluent.css +4 -0
  44. package/styles/rich-text-editor/highcontrast-light.css +4 -0
  45. package/styles/rich-text-editor/highcontrast.css +4 -0
  46. package/styles/rich-text-editor/material-dark.css +4 -0
  47. package/styles/rich-text-editor/material.css +4 -0
  48. package/styles/rich-text-editor/material3-dark.css +4 -0
  49. package/styles/rich-text-editor/material3.css +4 -0
  50. package/styles/rich-text-editor/tailwind-dark.css +4 -4
  51. package/styles/rich-text-editor/tailwind.css +4 -4
  52. package/styles/tailwind-dark.css +4 -4
  53. package/styles/tailwind.css +4 -4
@@ -4035,8 +4035,6 @@ var ToolbarRenderer = /** @__PURE__ @class */ (function () {
4035
4035
  target: colorPicker.element.parentElement, cssClass: css,
4036
4036
  enablePersistence: this.parent.enablePersistence, enableRtl: this.parent.enableRtl,
4037
4037
  beforeOpen: function (dropDownArgs) {
4038
- colorPicker.inline = true;
4039
- colorPicker.dataBind();
4040
4038
  if (proxy.parent.readonly || !proxy.parent.enabled) {
4041
4039
  dropDownArgs.cancel = true;
4042
4040
  return;
@@ -4175,14 +4173,18 @@ var ToolbarRenderer = /** @__PURE__ @class */ (function () {
4175
4173
  var colorPicker = new ColorPicker({
4176
4174
  enablePersistence: this.parent.enablePersistence,
4177
4175
  enableRtl: this.parent.enableRtl,
4178
- inline: false,
4179
- value: '#fff',
4176
+ inline: true,
4177
+ value: null,
4178
+ cssClass: ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass + ' ' + 'e-rte-picker-init',
4180
4179
  created: function () {
4181
4180
  var value = (item === 'backgroundcolor') ? proxy.parent.backgroundColor.default : proxy.parent.fontColor.default;
4182
- colorPicker.setProperties({ value: value });
4181
+ colorPicker.cssClass = ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass;
4182
+ colorPicker.value = value;
4183
4183
  },
4184
4184
  mode: ((item === 'backgroundcolor') ? proxy.parent.backgroundColor.mode : proxy.parent.fontColor.mode),
4185
4185
  modeSwitcher: ((item === 'backgroundcolor') ? proxy.parent.backgroundColor.modeSwitcher : proxy.parent.fontColor.modeSwitcher),
4186
+ presetColors: (item === 'backgroundcolor') ? this.parent.backgroundColor.colorCode : this.parent.fontColor.colorCode,
4187
+ columns: (item === 'backgroundcolor') ? this.parent.backgroundColor.columns : this.parent.fontColor.columns,
4186
4188
  beforeTileRender: function (args) {
4187
4189
  args.element.classList.add(CLS_COLOR_PALETTE);
4188
4190
  args.element.classList.add(CLS_CUSTOM_TILE);
@@ -4227,10 +4229,6 @@ var ToolbarRenderer = /** @__PURE__ @class */ (function () {
4227
4229
  }
4228
4230
  });
4229
4231
  colorPicker.isStringTemplate = true;
4230
- colorPicker.columns = (item === 'backgroundcolor') ? this.parent.backgroundColor.columns : this.parent.fontColor.columns;
4231
- colorPicker.presetColors = (item === 'backgroundcolor') ? this.parent.backgroundColor.colorCode :
4232
- this.parent.fontColor.colorCode;
4233
- colorPicker.cssClass = ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass;
4234
4232
  colorPicker.createElement = this.parent.createElement;
4235
4233
  colorPicker.appendTo(document.getElementById(args.target));
4236
4234
  return colorPicker;
@@ -11949,7 +11947,8 @@ var DOMNode = /** @__PURE__ @class */ (function () {
11949
11947
  }
11950
11948
  }
11951
11949
  else {
11952
- if (start.tagName === 'IMG') {
11950
+ var tagName = !isNullOrUndefined(start.parentElement) ? start.parentElement.tagName.toLocaleLowerCase() : '';
11951
+ if (start.tagName === 'IMG' && tagName !== 'p' && tagName !== 'div') {
11953
11952
  var parNode = document.createElement('p');
11954
11953
  start.parentElement.insertBefore(parNode, start);
11955
11954
  parNode.appendChild(start);
@@ -13028,8 +13027,17 @@ var Lists = /** @__PURE__ @class */ (function () {
13028
13027
  };
13029
13028
  Lists.prototype.cleanNode = function () {
13030
13029
  var liParents = this.parent.editableElement.querySelectorAll('ol + ol, ul + ul');
13030
+ var listStyleType;
13031
+ var firstNodeOL;
13031
13032
  for (var c = 0; c < liParents.length; c++) {
13032
13033
  var node = liParents[c];
13034
+ var toFindtopOlUl = true;
13035
+ if (toFindtopOlUl && (liParents[c].parentElement.parentElement.nodeName === 'OL' || liParents[c].parentElement.parentElement.nodeName === 'UL')) {
13036
+ toFindtopOlUl = false;
13037
+ var preElement = liParents[c].parentElement.parentElement;
13038
+ listStyleType = preElement.style.listStyleType;
13039
+ firstNodeOL = node.previousElementSibling;
13040
+ }
13033
13041
  if (this.domNode.isList(node.previousElementSibling) &&
13034
13042
  this.domNode.openTagString(node) === this.domNode.openTagString(node.previousElementSibling)) {
13035
13043
  var contentNodes = this.domNode.contents(node);
@@ -13044,6 +13052,9 @@ var Lists = /** @__PURE__ @class */ (function () {
13044
13052
  }
13045
13053
  }
13046
13054
  }
13055
+ if (firstNodeOL) {
13056
+ firstNodeOL.style.listStyleType = listStyleType;
13057
+ }
13047
13058
  };
13048
13059
  Lists.prototype.findUnSelected = function (temp, elements) {
13049
13060
  temp = temp.slice().reverse();
@@ -17266,11 +17277,15 @@ var SelectionCommands = /** @__PURE__ @class */ (function () {
17266
17277
  && range.endOffset === range.startContainer.length)) {
17267
17278
  var nodeIndex = [];
17268
17279
  var cloneNode = nodes[index];
17280
+ var clonedElement = cloneNode;
17269
17281
  do {
17270
17282
  nodeIndex.push(domSelection.getIndex(cloneNode));
17271
17283
  cloneNode = cloneNode.parentNode;
17272
17284
  } while (cloneNode && (cloneNode !== formatNode));
17273
17285
  if (nodes[index].nodeName !== 'BR') {
17286
+ if (clonedElement.nodeName === '#text' && clonedElement.textContent.includes('\u200B')) {
17287
+ clonedElement.remove();
17288
+ }
17274
17289
  cloneNode = splitNode = (isCursor && (formatNode.textContent.length - 1) === range.startOffset) ?
17275
17290
  nodeCutter.SplitNode(range, formatNode, true)
17276
17291
  : nodeCutter.GetSpliceNode(range, formatNode);
@@ -18598,7 +18613,7 @@ var MsWordPaste = /** @__PURE__ @class */ (function () {
18598
18613
  'x', 'xi', 'xii', 'xiii', 'xiv', 'xv', 'xvi', 'xvii', 'xviii', 'xix', 'xx'];
18599
18614
  this.lowerGreekNumber = ['α', 'β', 'γ', 'δ', 'ε', 'ζ', 'η', 'θ', 'ι', 'κ', 'λ',
18600
18615
  'μ', 'ν', 'ξ', 'ο', 'π', 'ρ', 'σ', 'τ', 'υ', 'φ', 'χ', 'ψ', 'ω'];
18601
- this.removableElements = ['o:p', 'style'];
18616
+ this.removableElements = ['o:p', 'style', 'w:sdt'];
18602
18617
  this.listContents = [];
18603
18618
  this.cropImageDimensions = [];
18604
18619
  this.parent = parent;
@@ -18963,7 +18978,7 @@ var MsWordPaste = /** @__PURE__ @class */ (function () {
18963
18978
  var innerElement = elm.innerHTML;
18964
18979
  for (var i = 0; i < this.removableElements.length; i++) {
18965
18980
  // eslint-disable-next-line security/detect-non-literal-regexp
18966
- var regExpStartElem = new RegExp('<' + this.removableElements[i] + '>', 'g');
18981
+ var regExpStartElem = new RegExp('<' + this.removableElements[i] + '\\s*[^>]*>', 'g');
18967
18982
  // eslint-disable-next-line security/detect-non-literal-regexp
18968
18983
  var regExpEndElem = new RegExp('</' + this.removableElements[i] + '>', 'g');
18969
18984
  innerElement = innerElement.replace(regExpStartElem, '');
@@ -36202,10 +36217,8 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
36202
36217
  }, 0);
36203
36218
  }
36204
36219
  else if (this.iframeSettings.enable) {
36205
- var iframeElement_1 = this.element.querySelector('#' + this.getID() + '_rte-view');
36206
- setTimeout(function () {
36207
- _this.setAutoHeight(iframeElement_1);
36208
- }, 100);
36220
+ var iframeElement = this.element.querySelector('#' + this.getID() + '_rte-view');
36221
+ this.setAutoHeight(iframeElement);
36209
36222
  this.inputElement.style.overflow = 'hidden';
36210
36223
  }
36211
36224
  }