@syncfusion/ej2-richtexteditor 23.2.7-52849 → 24.1.41-569421

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 (171) hide show
  1. package/.eslintrc.json +260 -0
  2. package/CHANGELOG.md +203 -1
  3. package/dist/ej2-richtexteditor.umd.min.js +1 -1
  4. package/dist/ej2-richtexteditor.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-richtexteditor.es2015.js +9873 -7941
  6. package/dist/es6/ej2-richtexteditor.es2015.js.map +1 -1
  7. package/dist/es6/ej2-richtexteditor.es5.js +9967 -8034
  8. package/dist/es6/ej2-richtexteditor.es5.js.map +1 -1
  9. package/package.json +13 -13
  10. package/src/common/config.d.ts +7 -0
  11. package/src/common/config.js +12 -1
  12. package/src/common/constant.d.ts +6 -0
  13. package/src/common/constant.js +6 -0
  14. package/src/common/interface.d.ts +12 -0
  15. package/src/common/types.d.ts +6 -0
  16. package/src/common/util.d.ts +6 -0
  17. package/src/common/util.js +61 -20
  18. package/src/editor-manager/base/constant.d.ts +6 -0
  19. package/src/editor-manager/base/constant.js +6 -0
  20. package/src/editor-manager/base/editor-manager.d.ts +5 -0
  21. package/src/editor-manager/base/editor-manager.js +59 -0
  22. package/src/editor-manager/base/interface.d.ts +8 -0
  23. package/src/editor-manager/plugin/audio.js +13 -3
  24. package/src/editor-manager/plugin/dom-node.d.ts +5 -1
  25. package/src/editor-manager/plugin/dom-node.js +169 -28
  26. package/src/editor-manager/plugin/format-painter-actions.d.ts +1 -0
  27. package/src/editor-manager/plugin/format-painter-actions.js +19 -1
  28. package/src/editor-manager/plugin/formats.d.ts +1 -0
  29. package/src/editor-manager/plugin/formats.js +38 -3
  30. package/src/editor-manager/plugin/image.js +38 -15
  31. package/src/editor-manager/plugin/indents.js +1 -1
  32. package/src/editor-manager/plugin/inserthtml.d.ts +1 -0
  33. package/src/editor-manager/plugin/inserthtml.js +83 -20
  34. package/src/editor-manager/plugin/link.js +8 -3
  35. package/src/editor-manager/plugin/lists.js +159 -70
  36. package/src/editor-manager/plugin/ms-word-clean-up.d.ts +3 -0
  37. package/src/editor-manager/plugin/ms-word-clean-up.js +215 -85
  38. package/src/editor-manager/plugin/nodecutter.js +5 -2
  39. package/src/editor-manager/plugin/selection-commands.d.ts +2 -0
  40. package/src/editor-manager/plugin/selection-commands.js +248 -4
  41. package/src/editor-manager/plugin/table.d.ts +4 -1
  42. package/src/editor-manager/plugin/table.js +95 -49
  43. package/src/editor-manager/plugin/toolbar-status.d.ts +2 -2
  44. package/src/editor-manager/plugin/toolbar-status.js +20 -10
  45. package/src/editor-manager/plugin/undo.d.ts +1 -0
  46. package/src/editor-manager/plugin/undo.js +21 -1
  47. package/src/rich-text-editor/actions/base-quick-toolbar.d.ts +4 -3
  48. package/src/rich-text-editor/actions/base-quick-toolbar.js +61 -14
  49. package/src/rich-text-editor/actions/base-toolbar.js +33 -34
  50. package/src/rich-text-editor/actions/color-picker.d.ts +1 -0
  51. package/src/rich-text-editor/actions/color-picker.js +13 -3
  52. package/src/rich-text-editor/actions/count.js +1 -1
  53. package/src/rich-text-editor/actions/dropdown-buttons.d.ts +1 -0
  54. package/src/rich-text-editor/actions/dropdown-buttons.js +11 -5
  55. package/src/rich-text-editor/actions/emoji-picker.js +16 -7
  56. package/src/rich-text-editor/actions/enter-key.js +10 -5
  57. package/src/rich-text-editor/actions/file-manager.js +1 -1
  58. package/src/rich-text-editor/actions/format-painter.js +5 -2
  59. package/src/rich-text-editor/actions/full-screen.js +5 -4
  60. package/src/rich-text-editor/actions/html-editor.d.ts +2 -0
  61. package/src/rich-text-editor/actions/html-editor.js +124 -17
  62. package/src/rich-text-editor/actions/keyboard.js +3 -1
  63. package/src/rich-text-editor/actions/markdown-editor.js +3 -1
  64. package/src/rich-text-editor/actions/paste-clean-up.d.ts +5 -0
  65. package/src/rich-text-editor/actions/paste-clean-up.js +156 -28
  66. package/src/rich-text-editor/actions/quick-toolbar.d.ts +8 -0
  67. package/src/rich-text-editor/actions/quick-toolbar.js +59 -12
  68. package/src/rich-text-editor/actions/resize.js +2 -1
  69. package/src/rich-text-editor/actions/toolbar-action.js +1 -1
  70. package/src/rich-text-editor/actions/toolbar.d.ts +3 -3
  71. package/src/rich-text-editor/actions/toolbar.js +35 -96
  72. package/src/rich-text-editor/base/classes.d.ts +5 -5
  73. package/src/rich-text-editor/base/classes.js +5 -5
  74. package/src/rich-text-editor/base/constant.d.ts +46 -1
  75. package/src/rich-text-editor/base/constant.js +215 -1
  76. package/src/rich-text-editor/base/interface.d.ts +47 -3
  77. package/src/rich-text-editor/base/rich-text-editor-model.d.ts +3 -3
  78. package/src/rich-text-editor/base/rich-text-editor.d.ts +16 -4
  79. package/src/rich-text-editor/base/rich-text-editor.js +184 -97
  80. package/src/rich-text-editor/base/util.js +22 -4
  81. package/src/rich-text-editor/formatter/formatter.js +16 -4
  82. package/src/rich-text-editor/models/default-locale.js +31 -25
  83. package/src/rich-text-editor/models/items.js +3 -3
  84. package/src/rich-text-editor/models/toolbar-settings-model.d.ts +1 -1
  85. package/src/rich-text-editor/models/toolbar-settings.d.ts +1 -1
  86. package/src/rich-text-editor/models/toolbar-settings.js +1 -1
  87. package/src/rich-text-editor/renderer/audio-module.d.ts +1 -0
  88. package/src/rich-text-editor/renderer/audio-module.js +22 -4
  89. package/src/rich-text-editor/renderer/dialog-renderer.d.ts +2 -0
  90. package/src/rich-text-editor/renderer/dialog-renderer.js +22 -2
  91. package/src/rich-text-editor/renderer/iframe-content-renderer.js +2 -1
  92. package/src/rich-text-editor/renderer/image-module.d.ts +9 -1
  93. package/src/rich-text-editor/renderer/image-module.js +248 -213
  94. package/src/rich-text-editor/renderer/link-module.js +53 -24
  95. package/src/rich-text-editor/renderer/table-module.d.ts +10 -1
  96. package/src/rich-text-editor/renderer/table-module.js +343 -168
  97. package/src/rich-text-editor/renderer/toolbar-renderer.d.ts +3 -6
  98. package/src/rich-text-editor/renderer/toolbar-renderer.js +106 -101
  99. package/src/rich-text-editor/renderer/video-module.d.ts +3 -0
  100. package/src/rich-text-editor/renderer/video-module.js +82 -41
  101. package/src/rich-text-editor/renderer/view-source.d.ts +1 -0
  102. package/src/rich-text-editor/renderer/view-source.js +15 -5
  103. package/src/selection/selection.js +3 -0
  104. package/styles/bootstrap-dark.css +353 -103
  105. package/styles/bootstrap.css +357 -112
  106. package/styles/bootstrap4.css +338 -96
  107. package/styles/bootstrap5-dark.css +344 -97
  108. package/styles/bootstrap5.css +344 -97
  109. package/styles/fabric-dark.css +332 -90
  110. package/styles/fabric.css +333 -91
  111. package/styles/fluent-dark.css +360 -98
  112. package/styles/fluent.css +360 -98
  113. package/styles/highcontrast-light.css +332 -90
  114. package/styles/highcontrast.css +336 -91
  115. package/styles/material-dark.css +339 -92
  116. package/styles/material.css +339 -92
  117. package/styles/material3-dark.css +348 -100
  118. package/styles/material3.css +348 -100
  119. package/styles/rich-text-editor/_bds-definition.scss +279 -0
  120. package/styles/rich-text-editor/_bootstrap-dark-definition.scss +17 -13
  121. package/styles/rich-text-editor/_bootstrap-definition.scss +22 -19
  122. package/styles/rich-text-editor/_bootstrap4-definition.scss +11 -7
  123. package/styles/rich-text-editor/_bootstrap5-definition.scss +8 -4
  124. package/styles/rich-text-editor/_fabric-dark-definition.scss +6 -2
  125. package/styles/rich-text-editor/_fabric-definition.scss +7 -3
  126. package/styles/rich-text-editor/_fluent-definition.scss +14 -10
  127. package/styles/rich-text-editor/_fusionnew-definition.scss +7 -3
  128. package/styles/rich-text-editor/_highcontrast-definition.scss +7 -3
  129. package/styles/rich-text-editor/_highcontrast-light-definition.scss +6 -2
  130. package/styles/rich-text-editor/_layout.scss +211 -34
  131. package/styles/rich-text-editor/_material-dark-definition.scss +6 -2
  132. package/styles/rich-text-editor/_material-definition.scss +6 -2
  133. package/styles/rich-text-editor/_material3-definition.scss +16 -12
  134. package/styles/rich-text-editor/_tailwind-definition.scss +23 -19
  135. package/styles/rich-text-editor/_theme.scss +113 -24
  136. package/styles/rich-text-editor/bootstrap-dark.css +353 -103
  137. package/styles/rich-text-editor/bootstrap.css +357 -112
  138. package/styles/rich-text-editor/bootstrap4.css +338 -96
  139. package/styles/rich-text-editor/bootstrap5-dark.css +344 -97
  140. package/styles/rich-text-editor/bootstrap5.css +344 -97
  141. package/styles/rich-text-editor/fabric-dark.css +332 -90
  142. package/styles/rich-text-editor/fabric.css +333 -91
  143. package/styles/rich-text-editor/fluent-dark.css +360 -98
  144. package/styles/rich-text-editor/fluent.css +360 -98
  145. package/styles/rich-text-editor/highcontrast-light.css +332 -90
  146. package/styles/rich-text-editor/highcontrast.css +336 -91
  147. package/styles/rich-text-editor/icons/_bds.scss +348 -0
  148. package/styles/rich-text-editor/icons/_bootstrap-dark.scss +4 -4
  149. package/styles/rich-text-editor/icons/_bootstrap.scss +4 -4
  150. package/styles/rich-text-editor/icons/_bootstrap4.scss +4 -4
  151. package/styles/rich-text-editor/icons/_bootstrap5.scss +4 -4
  152. package/styles/rich-text-editor/icons/_fabric-dark.scss +4 -4
  153. package/styles/rich-text-editor/icons/_fabric.scss +4 -4
  154. package/styles/rich-text-editor/icons/_fluent.scss +4 -4
  155. package/styles/rich-text-editor/icons/_fusionnew.scss +3 -3
  156. package/styles/rich-text-editor/icons/_highcontrast-light.scss +4 -4
  157. package/styles/rich-text-editor/icons/_highcontrast.scss +4 -4
  158. package/styles/rich-text-editor/icons/_material-dark.scss +4 -4
  159. package/styles/rich-text-editor/icons/_material.scss +4 -4
  160. package/styles/rich-text-editor/icons/_material3.scss +4 -4
  161. package/styles/rich-text-editor/icons/_tailwind.scss +4 -4
  162. package/styles/rich-text-editor/material-dark.css +339 -92
  163. package/styles/rich-text-editor/material.css +339 -92
  164. package/styles/rich-text-editor/material3-dark.css +348 -100
  165. package/styles/rich-text-editor/material3.css +348 -100
  166. package/styles/rich-text-editor/tailwind-dark.css +383 -113
  167. package/styles/rich-text-editor/tailwind.css +383 -113
  168. package/styles/tailwind-dark.css +383 -113
  169. package/styles/tailwind.css +383 -113
  170. package/.github/PULL_REQUEST_TEMPLATE/Bug.md +0 -41
  171. package/.github/PULL_REQUEST_TEMPLATE/Feature.md +0 -27
@@ -38,6 +38,45 @@ var SelectionCommands = /** @class */ (function () {
38
38
  var nodeCutter = new NodeCutter();
39
39
  var isFormatted = new IsFormatted();
40
40
  var range = domSelection.getRange(docElement);
41
+ var currentAnchorNode = range.startContainer.parentElement;
42
+ if (range.collapsed && !isNOU(currentAnchorNode) &&
43
+ currentAnchorNode.tagName === 'A' &&
44
+ (range.startOffset === currentAnchorNode.textContent.length || range.startOffset === 0)) {
45
+ var emptyTextNode = document.createTextNode('');
46
+ if (range.startOffset === 0) {
47
+ currentAnchorNode.parentNode.insertBefore(emptyTextNode, currentAnchorNode);
48
+ }
49
+ else {
50
+ if (!isNOU(currentAnchorNode.nextSibling)) {
51
+ currentAnchorNode.parentElement.insertBefore(emptyTextNode, currentAnchorNode.nextSibling);
52
+ }
53
+ else {
54
+ currentAnchorNode.parentNode.appendChild(emptyTextNode);
55
+ }
56
+ }
57
+ // Set the range to the empty text node
58
+ var newRange = docElement.createRange();
59
+ range.setStart(emptyTextNode, 0);
60
+ range.setEnd(emptyTextNode, 0);
61
+ range.collapse(true);
62
+ domSelection.setRange(docElement, newRange);
63
+ }
64
+ if (Browser.userAgent.indexOf('Firefox') !== -1 && range.startContainer === range.endContainer && !isNOU(endNode) && range.startContainer === endNode) {
65
+ var startChildNodes = range.startContainer.childNodes;
66
+ var startNode = ((startChildNodes[(range.startOffset > 0) ? (range.startOffset - 1) :
67
+ range.startOffset]) || range.startContainer);
68
+ var endNode_1 = (range.endContainer.childNodes[(range.endOffset > 0) ? (range.endOffset - 1) :
69
+ range.endOffset] || range.endContainer);
70
+ var lastSelectionNode = (endNode_1.lastChild.nodeName === 'BR' ? (isNOU(endNode_1.lastChild.previousSibling) ? endNode_1
71
+ : endNode_1.lastChild.previousSibling) : endNode_1.firstChild);
72
+ while (!isNOU(lastSelectionNode) && lastSelectionNode.nodeName !== '#text' && lastSelectionNode.nodeName !== 'IMG' &&
73
+ lastSelectionNode.nodeName !== 'BR' && lastSelectionNode.nodeName !== 'HR') {
74
+ lastSelectionNode = lastSelectionNode.lastChild;
75
+ }
76
+ ;
77
+ domSelection.setSelectionText(docElement, startNode, lastSelectionNode, 0, 0);
78
+ range = domSelection.getRange(docElement);
79
+ }
41
80
  var save = domSelection.save(range, docElement);
42
81
  var nodes = range.collapsed ? domSelection.getSelectionNodeCollection(range) :
43
82
  domSelection.getSelectionNodeCollectionBr(range);
@@ -185,8 +224,7 @@ var SelectionCommands = /** @class */ (function () {
185
224
  cursorNodes[0].firstElementChild.tagName.toLowerCase() === 'br')) {
186
225
  cursorNodes[0].innerHTML = '';
187
226
  }
188
- if (cursorNodes.length === 1 && range.startOffset === 0 && (cursorNodes[0].nodeName === 'BR' ||
189
- cursorNodes[0].nextSibling.nodeName === 'BR')) {
227
+ if (cursorNodes.length === 1 && range.startOffset === 0 && (cursorNodes[0].nodeName === 'BR' || (isNOU(cursorNodes[0].nextSibling) ? false : cursorNodes[0].nextSibling.nodeName === 'BR'))) {
190
228
  detach(cursorNodes[0].nodeName === '#text' ? cursorNodes[0].nextSibling : cursorNodes[0]);
191
229
  }
192
230
  cursorNode = this.getInsertNode(docElement, range, format, value).firstChild;
@@ -211,11 +249,15 @@ var SelectionCommands = /** @class */ (function () {
211
249
  && range.endOffset === range.startContainer.length)) {
212
250
  var nodeIndex = [];
213
251
  var cloneNode = nodes[index];
252
+ var clonedElement = cloneNode;
214
253
  do {
215
254
  nodeIndex.push(domSelection.getIndex(cloneNode));
216
255
  cloneNode = cloneNode.parentNode;
217
256
  } while (cloneNode && (cloneNode !== formatNode));
218
257
  if (nodes[index].nodeName !== 'BR') {
258
+ if (clonedElement.nodeName === '#text' && clonedElement.textContent.includes('\u200B')) {
259
+ clonedElement.remove();
260
+ }
219
261
  cloneNode = splitNode = (isCursor && (formatNode.textContent.length - 1) === range.startOffset) ?
220
262
  nodeCutter.SplitNode(range, formatNode, true)
221
263
  : nodeCutter.GetSpliceNode(range, formatNode);
@@ -293,8 +335,49 @@ var SelectionCommands = /** @class */ (function () {
293
335
  formatNode.style.textDecoration = 'none';
294
336
  child = [formatNode];
295
337
  }
338
+ else if (IsFormatted.inlineTags.indexOf(formatNodeTagName.toLowerCase()) !== -1 && isFontStyle && formatNodeTagName.toLocaleLowerCase() !== 'span') {
339
+ var fontNodeStyle = formatNode.style;
340
+ if (fontNodeStyle.color && format === 'fontcolor') {
341
+ if (formatNode.nodeName === 'A') {
342
+ fontNodeStyle.color = value;
343
+ }
344
+ else {
345
+ fontNodeStyle.color = '';
346
+ }
347
+ }
348
+ else if (fontNodeStyle.backgroundColor && format === 'backgroundcolor') {
349
+ fontNodeStyle.backgroundColor = '';
350
+ }
351
+ else if (fontNodeStyle.fontSize && format === 'fontsize') {
352
+ fontNodeStyle.fontSize = '';
353
+ }
354
+ else if (fontNodeStyle.fontFamily && format === 'fontname') {
355
+ fontNodeStyle.fontFamily = '';
356
+ }
357
+ if (formatNode.getAttribute("style") === '') {
358
+ formatNode.removeAttribute("style");
359
+ }
360
+ child = [formatNode];
361
+ }
296
362
  else {
297
363
  child = InsertMethods.unwrap(formatNode);
364
+ var liElement = nodes[index].parentElement;
365
+ if (!isNOU(liElement) && liElement.tagName.toLowerCase() !== 'li') {
366
+ liElement = closest(liElement, 'li');
367
+ }
368
+ if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' &&
369
+ liElement.textContent.trim() === nodes[index].textContent.trim()) {
370
+ if (format === 'bold') {
371
+ liElement.style.fontWeight = 'normal';
372
+ }
373
+ else if (format === "italic") {
374
+ liElement.style.fontStyle = 'normal';
375
+ }
376
+ }
377
+ else if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li'
378
+ && liElement.textContent.trim() !== nodes[index].textContent.trim()) {
379
+ SelectionCommands.conCatenateTextNode(liElement, format, '', 'normal');
380
+ }
298
381
  }
299
382
  if (child[0] && !isFontStyle) {
300
383
  var nodeTraverse = child[index] ? child[index] : child[0];
@@ -343,6 +426,20 @@ var SelectionCommands = /** @class */ (function () {
343
426
  if (child[num].nodeType !== 3 || (child[num].textContent &&
344
427
  child[num].textContent.trim().length > 0)) {
345
428
  child[num] = InsertMethods.Wrap(child[num], this.GetFormatNode(format, value, formatNodeTagName, formatNodeStyles));
429
+ var liElement = nodes[index].parentElement;
430
+ if (!isNOU(liElement) && liElement.tagName.toLowerCase() !== 'li') {
431
+ liElement = closest(liElement, 'li');
432
+ }
433
+ if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' &&
434
+ liElement.textContent.trim() === nodes[index].textContent.trim()) {
435
+ if (format === 'fontname') {
436
+ liElement.style.fontFamily = value;
437
+ }
438
+ }
439
+ if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li'
440
+ && liElement.textContent.trim() !== nodes[index].textContent.trim()) {
441
+ SelectionCommands.conCatenateTextNode(liElement, format, liElement.textContent, format, value);
442
+ }
346
443
  if (child[num].textContent === startText) {
347
444
  if (num === 0) {
348
445
  range.setStartBefore(child[num]);
@@ -375,7 +472,10 @@ var SelectionCommands = /** @class */ (function () {
375
472
  }
376
473
  var num = index;
377
474
  var liChildContent = '';
378
- while (num >= 0 && !isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' && liElement.textContent.replace('/\u200B/g', '').trim().includes(nodes[num].textContent.trim())) {
475
+ /* eslint-disable security/detect-object-injection */
476
+ while (num >= 0 && !isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' && liElement.contains(nodes[num]) &&
477
+ liElement.textContent.replace('/\u200B/g', '').trim().includes(nodes[num].textContent.trim())) {
478
+ /* eslint-enable security/detect-object-injection */
379
479
  liChildContent = ' ' + nodes[num].textContent.trim() + liChildContent;
380
480
  num--;
381
481
  }
@@ -447,6 +547,54 @@ var SelectionCommands = /** @class */ (function () {
447
547
  parentElement = parentElement.parentElement;
448
548
  liElement = parentElement;
449
549
  }
550
+ if (format === 'fontcolor' || format === 'fontname' || format === 'fontsize') {
551
+ var parentElem = nodes[index].parentElement;
552
+ if (!isNOU(parentElem) && parentElem.childNodes) {
553
+ for (var i = 0; i < parentElem.childNodes.length; i++) {
554
+ if (this.concatenateTextExcludingList(nodes, index) === nodes[index].textContent) {
555
+ var liElement_1 = void 0;
556
+ if (parentElem.tagName === 'LI') {
557
+ liElement_1 = parentElem;
558
+ }
559
+ else if (parentElem.closest('li')) {
560
+ liElement_1 = parentElem.closest('li');
561
+ }
562
+ if (!isNOU(liElement_1)) {
563
+ switch (format) {
564
+ case 'fontcolor':
565
+ liElement_1.style.color = value;
566
+ break;
567
+ case 'fontname':
568
+ liElement_1.style.fontFamily = value;
569
+ break;
570
+ case 'fontsize':
571
+ liElement_1.style.fontSize = value;
572
+ break;
573
+ default:
574
+ break;
575
+ }
576
+ }
577
+ }
578
+ // eslint-disable-next-line
579
+ var childElement = parentElem.childNodes[i];
580
+ if (childElement.tagName === 'OL' || childElement.tagName === 'UL') {
581
+ switch (format) {
582
+ case 'fontcolor':
583
+ childElement.style.color = 'initial';
584
+ break;
585
+ case 'fontname':
586
+ childElement.style.fontFamily = 'initial';
587
+ break;
588
+ case 'fontsize':
589
+ childElement.style.fontSize = 'initial';
590
+ break;
591
+ default:
592
+ break;
593
+ }
594
+ }
595
+ }
596
+ }
597
+ }
450
598
  if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' &&
451
599
  liElement.textContent.trim() === nodes[index].textContent.trim()) {
452
600
  if (format === 'fontsize') {
@@ -456,6 +604,9 @@ var SelectionCommands = /** @class */ (function () {
456
604
  liElement.style.color = value;
457
605
  liElement.style.textDecoration = 'inherit';
458
606
  }
607
+ else if (format === 'fontname') {
608
+ liElement.style.fontFamily = value;
609
+ }
459
610
  }
460
611
  if (value === 'formatPainter') {
461
612
  return this.insertFormatPainterElem(nodes, index, range, nodeCutter, painterValues, domNode);
@@ -496,6 +647,10 @@ var SelectionCommands = /** @class */ (function () {
496
647
  }
497
648
  nodeList[0] = currentFormatNode;
498
649
  this.applyStyles(nodeList, 0, element);
650
+ if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li'
651
+ && liElement.textContent.trim() !== nodes[index].textContent.trim()) {
652
+ SelectionCommands.conCatenateTextNode(liElement, format, liElement.textContent, format, value);
653
+ }
499
654
  }
500
655
  else {
501
656
  nodes[index] = this.applyStyles(nodes, index, element);
@@ -503,6 +658,23 @@ var SelectionCommands = /** @class */ (function () {
503
658
  }
504
659
  else {
505
660
  nodes[index] = this.applyStyles(nodes, index, element);
661
+ var liElement = nodes[index].parentElement;
662
+ if (!isNOU(liElement) && liElement.tagName.toLowerCase() !== 'li') {
663
+ liElement = closest(liElement, 'li');
664
+ }
665
+ if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' &&
666
+ liElement.textContent.trim() === nodes[index].textContent.trim()) {
667
+ if (format === 'bold') {
668
+ liElement.style.fontWeight = 'bold';
669
+ }
670
+ else if (format === "italic") {
671
+ liElement.style.fontStyle = 'italic';
672
+ }
673
+ }
674
+ else if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li'
675
+ && liElement.textContent.trim() !== nodes[index].textContent.trim()) {
676
+ SelectionCommands.conCatenateTextNode(liElement, format, liElement.textContent, format);
677
+ }
506
678
  }
507
679
  }
508
680
  }
@@ -706,7 +878,9 @@ var SelectionCommands = /** @class */ (function () {
706
878
  }
707
879
  var blockChildNodes = parent.parentElement.childNodes;
708
880
  for (var k = 0; k < blockChildNodes.length; k++) {
709
- if (blockChildNodes[k].textContent.trim() === '' || blockChildNodes[k].textContent.length === 0) {
881
+ if ((blockChildNodes[k].textContent.trim() === '' || blockChildNodes[k].textContent.length === 0) &&
882
+ blockChildNodes[k].textContent.charCodeAt(0) !== 160) {
883
+ // 160 is the char code for &nbsp;
710
884
  detach(blockChildNodes[k]);
711
885
  }
712
886
  }
@@ -730,6 +904,76 @@ var SelectionCommands = /** @class */ (function () {
730
904
  }
731
905
  }
732
906
  };
907
+ SelectionCommands.concatenateTextExcludingList = function (nodes, index) {
908
+ var result = '';
909
+ var parentNode = nodes[index].parentElement;
910
+ for (var i = 0; i < parentNode.childNodes.length; i++) {
911
+ // eslint-disable-next-line
912
+ var childNode = parentNode.childNodes[i];
913
+ if ((childNode.nodeType === 3) || (childNode.nodeType === 1 && (childNode.tagName !== 'OL' && childNode.tagName !== 'UL'))) {
914
+ result += childNode.textContent;
915
+ }
916
+ }
917
+ return result;
918
+ };
919
+ SelectionCommands.conCatenateTextNode = function (liElement, format, value, formatStr, constVal) {
920
+ var result = '';
921
+ switch (format) {
922
+ case 'bold':
923
+ liElement.querySelectorAll('strong').forEach(function (e) {
924
+ result = result + e.textContent;
925
+ });
926
+ if (result === value) {
927
+ liElement.style.fontWeight = formatStr;
928
+ }
929
+ break;
930
+ case 'italic':
931
+ liElement.querySelectorAll('em').forEach(function (e) {
932
+ result = result + e.textContent;
933
+ });
934
+ if (result === value) {
935
+ liElement.style.fontStyle = formatStr;
936
+ }
937
+ break;
938
+ case 'fontcolor':
939
+ var colorStyle_1 = '';
940
+ liElement.querySelectorAll('span').forEach(function (span) {
941
+ colorStyle_1 = span.style.color;
942
+ if (colorStyle_1 === constVal) {
943
+ result = result + span.textContent;
944
+ }
945
+ });
946
+ if (result === value) {
947
+ liElement.style.color = colorStyle_1;
948
+ liElement.style.textDecoration = 'inherit';
949
+ }
950
+ break;
951
+ case 'fontsize':
952
+ var fontSize_1 = '';
953
+ liElement.querySelectorAll('span').forEach(function (span) {
954
+ fontSize_1 = span.style.getPropertyValue('font-size');
955
+ if (fontSize_1 === constVal) {
956
+ result = result + span.textContent;
957
+ }
958
+ });
959
+ if (result === value) {
960
+ liElement.style.fontSize = fontSize_1;
961
+ }
962
+ break;
963
+ case 'fontname':
964
+ var fontFamily_1 = '';
965
+ liElement.querySelectorAll('span').forEach(function (span) {
966
+ fontFamily_1 = span.style.getPropertyValue('font-family');
967
+ if (fontFamily_1 === constVal) {
968
+ result = result + span.textContent;
969
+ }
970
+ });
971
+ if (result === value) {
972
+ liElement.style.fontFamily = fontFamily_1;
973
+ }
974
+ break;
975
+ }
976
+ };
733
977
  SelectionCommands.enterAction = 'P';
734
978
  return SelectionCommands;
735
979
  }());
@@ -20,7 +20,6 @@ export declare class TableCommand {
20
20
  private addEventListener;
21
21
  private createTable;
22
22
  private calculateStyleValue;
23
- private removeEmptyNode;
24
23
  private insertAfter;
25
24
  private getSelectedCellMinMaxIndex;
26
25
  private insertRow;
@@ -39,6 +38,10 @@ export declare class TableCommand {
39
38
  private getSelectedMinMaxIndexes;
40
39
  private HorizontalSplit;
41
40
  private VerticalSplit;
41
+ private getSplitColWidth;
42
+ private getColSizes;
43
+ private getCellIndex;
44
+ private convertPixelToPercentage;
42
45
  private getCorrespondingColumns;
43
46
  private FindIndex;
44
47
  private getCorrespondingIndex;
@@ -60,9 +60,8 @@ var TableCommand = /** @class */ (function () {
60
60
  table.appendChild(tblBody);
61
61
  e.item.selection.restore();
62
62
  InsertHtml.Insert(this.parent.currentDocument, table, this.parent.editableElement);
63
- this.removeEmptyNode();
64
63
  e.item.selection.setSelectionText(this.parent.currentDocument, table.querySelector('td'), table.querySelector('td'), 0, 0);
65
- if (table.nextElementSibling === null) {
64
+ if (table.nextElementSibling === null && !table.classList.contains('ignore-table')) {
66
65
  var insertElem = void 0;
67
66
  if (e.enterAction === 'DIV') {
68
67
  insertElem = createElement('div');
@@ -77,6 +76,9 @@ var TableCommand = /** @class */ (function () {
77
76
  }
78
77
  this.insertAfter(insertElem, table);
79
78
  }
79
+ if (table.classList.contains('ignore-table')) {
80
+ table.classList.remove('ignore-table');
81
+ }
80
82
  table.querySelector('td').classList.add('e-cell-select');
81
83
  if (e.callBack) {
82
84
  e.callBack({
@@ -104,24 +106,6 @@ var TableCommand = /** @class */ (function () {
104
106
  }
105
107
  return styleValue;
106
108
  };
107
- TableCommand.prototype.removeEmptyNode = function () {
108
- var emptyUl = this.parent.editableElement.querySelectorAll('ul:empty, ol:empty');
109
- for (var i = 0; i < emptyUl.length; i++) {
110
- detach(emptyUl[i]);
111
- }
112
- var emptyLiChild = this.parent.editableElement.querySelectorAll('li *:empty:not(img)');
113
- for (var i = 0; i < emptyLiChild.length; i++) {
114
- detach(emptyLiChild[i]);
115
- if (emptyLiChild.length === i + 1) {
116
- emptyLiChild = this.parent.editableElement.querySelectorAll('li *:empty:not(img)');
117
- i = -1;
118
- }
119
- }
120
- var emptyLi = this.parent.editableElement.querySelectorAll('li:empty');
121
- for (var i = 0; i < emptyLi.length; i++) {
122
- detach(emptyLi[i]);
123
- }
124
- };
125
109
  TableCommand.prototype.insertAfter = function (newNode, referenceNode) {
126
110
  referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
127
111
  };
@@ -472,14 +456,21 @@ var TableCommand = /** @class */ (function () {
472
456
  }
473
457
  };
474
458
  TableCommand.prototype.tableVerticalAlign = function (e) {
475
- if (e.item.subCommand === 'AlignTop') {
476
- e.item.tableCell.style.verticalAlign = 'top';
477
- }
478
- else if (e.item.subCommand === 'AlignMiddle') {
479
- e.item.tableCell.style.verticalAlign = 'middle';
459
+ var value = '';
460
+ switch (e.item.subCommand) {
461
+ case 'AlignTop':
462
+ value = 'top';
463
+ break;
464
+ case 'AlignMiddle':
465
+ value = 'middle';
466
+ break;
467
+ case 'AlignBottom':
468
+ value = 'bottom';
469
+ break;
480
470
  }
481
- else {
482
- e.item.tableCell.style.verticalAlign = 'bottom';
471
+ e.item.tableCell.style.verticalAlign = value;
472
+ if (value && value !== '' && e.item.tableCell.getAttribute('valign')) {
473
+ e.item.tableCell.removeAttribute('valign');
483
474
  }
484
475
  if (e.callBack) {
485
476
  e.callBack({
@@ -510,10 +501,22 @@ var TableCommand = /** @class */ (function () {
510
501
  firstCell.setAttribute('rowspan', (minMaxIndexes.endRow - minMaxIndexes.startRow + 1).toString());
511
502
  }
512
503
  var totalWidth = 0;
504
+ var unit;
513
505
  for (var j = rowSelectedCells.length - 1; j >= 0; j--) {
514
- totalWidth = totalWidth + parseFloat(rowSelectedCells[j].style.width);
506
+ if (!isNOU(rowSelectedCells[j].style.width)
507
+ && rowSelectedCells[j].style.width !== '') {
508
+ if (!unit) {
509
+ var match = rowSelectedCells[j].style.width.match(/^([\d.]+)([a-z%]+)$/i);
510
+ unit = match ? match[2] : '%';
511
+ }
512
+ totalWidth = totalWidth + parseFloat(rowSelectedCells[j].style.width);
513
+ }
514
+ else {
515
+ totalWidth = totalWidth + ((rowSelectedCells[j].offsetWidth / this.curTable.offsetWidth) * 100);
516
+ unit = '%';
517
+ }
515
518
  }
516
- firstCell.style.width = totalWidth + '%';
519
+ firstCell.style.width = totalWidth + unit;
517
520
  for (var i = 1; i <= selectedCells.length - 1; i++) {
518
521
  detach(selectedCells[i]);
519
522
  }
@@ -550,7 +553,7 @@ var TableCommand = /** @class */ (function () {
550
553
  var eleArray = elements;
551
554
  //eslint-disable-next-line
552
555
  if (min < (max = Math.min(max, eleArray[0].length - 1))) {
553
- for (colIndex === min; colIndex <= max; colIndex++) {
556
+ for (colIndex = min; colIndex <= max; colIndex++) {
554
557
  // eslint-disable-next-line
555
558
  if (!(min < colIndex && eleArray[0][colIndex] === eleArray[0][colIndex - 1]) && 1 < (index =
556
559
  Math.min(parseInt(eleArray[0][colIndex].getAttribute('colspan'), 10) || 1, max - min + 1)) &&
@@ -741,28 +744,23 @@ var TableCommand = /** @class */ (function () {
741
744
  var newCell = this.activeCell.cloneNode(true);
742
745
  newCell.removeAttribute('class');
743
746
  newCell.innerHTML = '</br>';
744
- var avgWidth = parseFloat(this.activeCell.style.width) / 2;
745
- if (this.activeCell.tagName === 'TH' && isNaN(avgWidth)) {
746
- var cellCount = this.curTable.querySelector('tr').childElementCount;
747
- var colSpanCount = 0;
748
- for (var i = 0; i < cellCount; i++) {
749
- colSpanCount = colSpanCount + (parseInt(this.curTable.querySelector('tr').children[i].getAttribute('colspan'), 10) || 1);
750
- }
751
- avgWidth = parseFloat((((this.activeCell.offsetWidth / 2) / this.curTable.offsetWidth) * 100).toFixed(1));
752
- }
753
747
  var activeCellIndex = this.getCorrespondingIndex(this.activeCell, this.getCorrespondingColumns());
754
748
  var correspondingColumns = this.getCorrespondingColumns();
755
- var activeCellcolSpan = parseInt(this.activeCell.getAttribute('colspan'), 10);
749
+ var activeCellcolSpan = parseInt(this.activeCell.getAttribute('colspan'), 10) || 1;
756
750
  if (activeCellcolSpan > 1) {
757
- // eslint-disable-next-line
758
- 1 < Math.ceil(activeCellcolSpan / 2) ? this.activeCell.setAttribute('colspan', (activeCellcolSpan / 2).toString())
759
- : this.activeCell.removeAttribute('colspan');
760
- // eslint-disable-next-line
761
- 1 < (activeCellcolSpan - activeCellcolSpan / 2) ? newCell.setAttribute('colspan',
762
- // eslint-disable-next-line
763
- (activeCellcolSpan - activeCellcolSpan / 2).toString()) : newCell.removeAttribute('colspan');
751
+ var colSpan = Math.ceil(activeCellcolSpan / 2);
752
+ var getColSizes = this.getColSizes(this.curTable);
753
+ var activeCellUpdatedWidth = this.getSplitColWidth(activeCellIndex[1], activeCellIndex[1] + colSpan - 1, getColSizes);
754
+ var newCellWidth = this.getSplitColWidth(activeCellIndex[1] + colSpan, activeCellIndex[1] + activeCellcolSpan - 1, getColSizes);
755
+ var activeCellWidth = this.convertPixelToPercentage(this.activeCell.offsetWidth, this.curTable.offsetWidth);
756
+ newCellWidth = (activeCellWidth - activeCellUpdatedWidth) < newCellWidth ? (activeCellWidth - activeCellUpdatedWidth) : newCellWidth;
757
+ 1 < colSpan ? this.activeCell.setAttribute('colspan', colSpan.toString()) : this.activeCell.removeAttribute('colspan');
758
+ 1 < activeCellcolSpan - colSpan ? newCell.setAttribute('colspan', (activeCellcolSpan - colSpan).toString()) : newCell.removeAttribute('colspan');
759
+ this.activeCell.style.width = activeCellUpdatedWidth + '%';
760
+ newCell.style.width = newCellWidth + '%';
764
761
  }
765
762
  else {
763
+ var avgWidth = parseFloat(this.activeCell.style.width) / 2;
766
764
  for (var i = 0; i <= allRows.length - 1; i++) {
767
765
  if (0 === i || correspondingColumns[i][activeCellIndex[1]] !== correspondingColumns[i - 1][activeCellIndex[1]]) {
768
766
  var currentCell = correspondingColumns[i][activeCellIndex[1]];
@@ -772,9 +770,9 @@ var TableCommand = /** @class */ (function () {
772
770
  }
773
771
  }
774
772
  }
773
+ this.activeCell.style.width = avgWidth + '%';
774
+ newCell.style.width = avgWidth + '%';
775
775
  }
776
- this.activeCell.style.width = avgWidth + '%';
777
- newCell.style.width = avgWidth + '%';
778
776
  this.activeCell.parentNode.insertBefore(newCell, this.activeCell.nextSibling);
779
777
  if (e.callBack) {
780
778
  e.callBack({
@@ -786,6 +784,54 @@ var TableCommand = /** @class */ (function () {
786
784
  });
787
785
  }
788
786
  };
787
+ TableCommand.prototype.getSplitColWidth = function (startIndex, endInex, sizes) {
788
+ var width = 0;
789
+ for (var i = startIndex; i <= endInex; i++) {
790
+ width += sizes[i];
791
+ }
792
+ return this.convertPixelToPercentage(width, this.curTable.offsetWidth);
793
+ };
794
+ TableCommand.prototype.getColSizes = function (curTable) {
795
+ var cellColl = curTable.rows[0].cells;
796
+ var cellCount = 0;
797
+ for (var cell = 0; cell < cellColl.length; cell++) {
798
+ cellCount = cellCount + cellColl[cell].colSpan;
799
+ }
800
+ var sizes = new Array(cellCount);
801
+ var rowSpanCells = new Map();
802
+ for (var i = 0; i < curTable.rows.length; i++) {
803
+ var currentColIndex = 0;
804
+ for (var k = 0; k < curTable.rows[i].cells.length; k++) {
805
+ for (var l = 1; l < curTable.rows[i].cells[k].rowSpan; l++) {
806
+ var key = "" + (i + l) + currentColIndex;
807
+ rowSpanCells.set(key, curTable.rows[i].cells[k]);
808
+ }
809
+ var cellIndex = this.getCellIndex(rowSpanCells, i, k);
810
+ if (cellIndex > currentColIndex) {
811
+ currentColIndex = cellIndex;
812
+ }
813
+ var width = curTable.rows[i].cells[k].offsetWidth;
814
+ if (!sizes[currentColIndex] || width < sizes[currentColIndex]) {
815
+ sizes[currentColIndex] = width;
816
+ }
817
+ currentColIndex += 1 + curTable.rows[i].cells[k].colSpan - 1;
818
+ }
819
+ }
820
+ return sizes;
821
+ };
822
+ TableCommand.prototype.getCellIndex = function (rowSpanCells, rowIndex, colIndex) {
823
+ var cellKey = "" + rowIndex + colIndex;
824
+ var spannedCell = rowSpanCells.get(cellKey);
825
+ if (spannedCell) {
826
+ return this.getCellIndex(rowSpanCells, rowIndex, colIndex + spannedCell.colSpan);
827
+ }
828
+ else {
829
+ return colIndex;
830
+ }
831
+ };
832
+ TableCommand.prototype.convertPixelToPercentage = function (value, offsetValue) {
833
+ return (value / offsetValue) * 100;
834
+ };
789
835
  TableCommand.prototype.getCorrespondingColumns = function () {
790
836
  var elementArray = [];
791
837
  // eslint-disable-next-line
@@ -11,7 +11,7 @@ export declare class ToolbarStatus {
11
11
  * get method
12
12
  *
13
13
  * @param {Document} docElement - specifies the document element
14
- * @param {Node} targetNode - specifies the target node
14
+ * @param {Node} rootNode - specifies the content editable element
15
15
  * @param {string[]} formatNode - specifies the format node
16
16
  * @param {string[]} fontSize - specifies the font size
17
17
  * @param {string[]} fontName - specifies the font name.
@@ -20,7 +20,7 @@ export declare class ToolbarStatus {
20
20
  * @hidden
21
21
  * @deprecated
22
22
  */
23
- static get(docElement: Document, targetNode: Node, formatNode?: string[], fontSize?: string[], fontName?: string[], documentNode?: Node): IToolbarStatus;
23
+ static get(docElement: Document, rootNode: Node, formatNode?: string[], fontSize?: string[], fontName?: string[], documentNode?: Node): IToolbarStatus;
24
24
  private static getImmediateBlockNode;
25
25
  private static getFormatParent;
26
26
  private static isFormattedNode;