@syncfusion/ej2-richtexteditor 24.2.9 → 25.1.35

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 (133) hide show
  1. package/CHANGELOG.md +18 -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 +908 -485
  6. package/dist/es6/ej2-richtexteditor.es2015.js.map +1 -1
  7. package/dist/es6/ej2-richtexteditor.es5.js +892 -474
  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 +13 -13
  13. package/src/common/config.d.ts +7 -0
  14. package/src/common/config.js +11 -0
  15. package/src/common/interface.d.ts +12 -0
  16. package/src/common/types.d.ts +6 -0
  17. package/src/editor-manager/plugin/dom-node.d.ts +5 -1
  18. package/src/editor-manager/plugin/dom-node.js +161 -12
  19. package/src/editor-manager/plugin/formats.js +1 -1
  20. package/src/editor-manager/plugin/image.js +12 -16
  21. package/src/editor-manager/plugin/inserthtml.d.ts +1 -0
  22. package/src/editor-manager/plugin/inserthtml.js +31 -0
  23. package/src/editor-manager/plugin/link.js +1 -1
  24. package/src/editor-manager/plugin/lists.js +24 -2
  25. package/src/editor-manager/plugin/ms-word-clean-up.js +65 -57
  26. package/src/editor-manager/plugin/selection-commands.js +52 -3
  27. package/src/editor-manager/plugin/table.js +18 -3
  28. package/src/editor-manager/plugin/toolbar-status.d.ts +2 -2
  29. package/src/editor-manager/plugin/toolbar-status.js +17 -9
  30. package/src/rich-text-editor/actions/base-quick-toolbar.d.ts +3 -3
  31. package/src/rich-text-editor/actions/base-quick-toolbar.js +41 -10
  32. package/src/rich-text-editor/actions/base-toolbar.js +24 -30
  33. package/src/rich-text-editor/actions/dropdown-buttons.js +4 -4
  34. package/src/rich-text-editor/actions/emoji-picker.js +1 -1
  35. package/src/rich-text-editor/actions/enter-key.js +2 -1
  36. package/src/rich-text-editor/actions/full-screen.js +2 -2
  37. package/src/rich-text-editor/actions/html-editor.d.ts +0 -2
  38. package/src/rich-text-editor/actions/html-editor.js +8 -26
  39. package/src/rich-text-editor/actions/markdown-editor.js +3 -1
  40. package/src/rich-text-editor/actions/paste-clean-up.d.ts +1 -0
  41. package/src/rich-text-editor/actions/paste-clean-up.js +23 -0
  42. package/src/rich-text-editor/actions/quick-toolbar.d.ts +7 -0
  43. package/src/rich-text-editor/actions/quick-toolbar.js +23 -8
  44. package/src/rich-text-editor/actions/resize.js +2 -1
  45. package/src/rich-text-editor/actions/toolbar.d.ts +0 -2
  46. package/src/rich-text-editor/actions/toolbar.js +13 -85
  47. package/src/rich-text-editor/base/classes.d.ts +0 -5
  48. package/src/rich-text-editor/base/classes.js +0 -5
  49. package/src/rich-text-editor/base/constant.d.ts +5 -0
  50. package/src/rich-text-editor/base/constant.js +5 -0
  51. package/src/rich-text-editor/base/interface.d.ts +36 -2
  52. package/src/rich-text-editor/base/rich-text-editor-model.d.ts +2 -2
  53. package/src/rich-text-editor/base/rich-text-editor.d.ts +4 -3
  54. package/src/rich-text-editor/base/rich-text-editor.js +81 -58
  55. package/src/rich-text-editor/base/util.js +8 -2
  56. package/src/rich-text-editor/models/default-locale.js +15 -12
  57. package/src/rich-text-editor/models/toolbar-settings-model.d.ts +1 -1
  58. package/src/rich-text-editor/models/toolbar-settings.d.ts +1 -1
  59. package/src/rich-text-editor/models/toolbar-settings.js +1 -1
  60. package/src/rich-text-editor/renderer/iframe-content-renderer.js +2 -1
  61. package/src/rich-text-editor/renderer/image-module.d.ts +8 -1
  62. package/src/rich-text-editor/renderer/image-module.js +148 -155
  63. package/src/rich-text-editor/renderer/table-module.d.ts +2 -0
  64. package/src/rich-text-editor/renderer/table-module.js +71 -8
  65. package/src/rich-text-editor/renderer/toolbar-renderer.d.ts +3 -0
  66. package/src/rich-text-editor/renderer/toolbar-renderer.js +61 -2
  67. package/src/rich-text-editor/renderer/video-module.js +7 -4
  68. package/src/rich-text-editor/renderer/view-source.js +7 -4
  69. package/styles/bootstrap-dark.css +57 -17
  70. package/styles/bootstrap.css +58 -18
  71. package/styles/bootstrap4.css +58 -18
  72. package/styles/bootstrap5-dark.css +64 -17
  73. package/styles/bootstrap5.css +64 -17
  74. package/styles/fabric-dark.css +57 -17
  75. package/styles/fabric.css +58 -18
  76. package/styles/fluent-dark.css +57 -17
  77. package/styles/fluent.css +57 -17
  78. package/styles/highcontrast-light.css +57 -17
  79. package/styles/highcontrast.css +58 -18
  80. package/styles/material-dark.css +57 -17
  81. package/styles/material.css +57 -17
  82. package/styles/material3-dark.css +59 -19
  83. package/styles/material3.css +59 -19
  84. package/styles/rich-text-editor/_bds-definition.scss +279 -0
  85. package/styles/rich-text-editor/_bootstrap-dark-definition.scss +1 -0
  86. package/styles/rich-text-editor/_bootstrap-definition.scss +1 -1
  87. package/styles/rich-text-editor/_bootstrap4-definition.scss +3 -2
  88. package/styles/rich-text-editor/_bootstrap5-definition.scss +1 -0
  89. package/styles/rich-text-editor/_fabric-dark-definition.scss +1 -0
  90. package/styles/rich-text-editor/_fabric-definition.scss +2 -1
  91. package/styles/rich-text-editor/_fluent-definition.scss +1 -0
  92. package/styles/rich-text-editor/_fusionnew-definition.scss +1 -0
  93. package/styles/rich-text-editor/_highcontrast-definition.scss +2 -1
  94. package/styles/rich-text-editor/_highcontrast-light-definition.scss +1 -0
  95. package/styles/rich-text-editor/_layout.scss +47 -13
  96. package/styles/rich-text-editor/_material-dark-definition.scss +1 -0
  97. package/styles/rich-text-editor/_material-definition.scss +1 -0
  98. package/styles/rich-text-editor/_material3-definition.scss +1 -0
  99. package/styles/rich-text-editor/_tailwind-definition.scss +4 -3
  100. package/styles/rich-text-editor/_theme.scss +18 -5
  101. package/styles/rich-text-editor/bootstrap-dark.css +57 -17
  102. package/styles/rich-text-editor/bootstrap.css +58 -18
  103. package/styles/rich-text-editor/bootstrap4.css +58 -18
  104. package/styles/rich-text-editor/bootstrap5-dark.css +64 -17
  105. package/styles/rich-text-editor/bootstrap5.css +64 -17
  106. package/styles/rich-text-editor/fabric-dark.css +57 -17
  107. package/styles/rich-text-editor/fabric.css +58 -18
  108. package/styles/rich-text-editor/fluent-dark.css +57 -17
  109. package/styles/rich-text-editor/fluent.css +57 -17
  110. package/styles/rich-text-editor/highcontrast-light.css +57 -17
  111. package/styles/rich-text-editor/highcontrast.css +58 -18
  112. package/styles/rich-text-editor/icons/_bds.scss +351 -0
  113. package/styles/rich-text-editor/icons/_bootstrap-dark.scss +7 -4
  114. package/styles/rich-text-editor/icons/_bootstrap.scss +7 -4
  115. package/styles/rich-text-editor/icons/_bootstrap4.scss +7 -4
  116. package/styles/rich-text-editor/icons/_bootstrap5.scss +7 -4
  117. package/styles/rich-text-editor/icons/_fabric-dark.scss +7 -4
  118. package/styles/rich-text-editor/icons/_fabric.scss +7 -4
  119. package/styles/rich-text-editor/icons/_fluent.scss +7 -4
  120. package/styles/rich-text-editor/icons/_highcontrast-light.scss +7 -4
  121. package/styles/rich-text-editor/icons/_highcontrast.scss +7 -4
  122. package/styles/rich-text-editor/icons/_material-dark.scss +7 -4
  123. package/styles/rich-text-editor/icons/_material.scss +7 -4
  124. package/styles/rich-text-editor/icons/_material3.scss +7 -4
  125. package/styles/rich-text-editor/icons/_tailwind.scss +7 -4
  126. package/styles/rich-text-editor/material-dark.css +57 -17
  127. package/styles/rich-text-editor/material.css +57 -17
  128. package/styles/rich-text-editor/material3-dark.css +59 -19
  129. package/styles/rich-text-editor/material3.css +59 -19
  130. package/styles/rich-text-editor/tailwind-dark.css +61 -21
  131. package/styles/rich-text-editor/tailwind.css +61 -21
  132. package/styles/tailwind-dark.css +61 -21
  133. package/styles/tailwind.css +61 -21
@@ -769,6 +769,11 @@ const documentClickClosedBy = 'documentClickClosedBy';
769
769
  * @deprecated
770
770
  */
771
771
  const showColorPicker = 'showColorPicker';
772
+ /**
773
+ * @hidden
774
+ * @deprecated
775
+ */
776
+ const closeTooltip = 'closeTooltip';
772
777
  /**
773
778
  * @hidden
774
779
  * @deprecated
@@ -1019,11 +1024,6 @@ const CLS_TB_FIXED = 'e-rte-tb-fixed';
1019
1024
  * @deprecated
1020
1025
  */
1021
1026
  const CLS_TB_FLOAT = 'e-rte-tb-float';
1022
- /**
1023
- * @hidden
1024
- * @deprecated
1025
- */
1026
- const CLS_TB_ABS_FLOAT = 'e-rte-tb-abs-float';
1027
1027
  /**
1028
1028
  * @hidden
1029
1029
  * @deprecated
@@ -2694,7 +2694,7 @@ let defaultLocale = {
2694
2694
  'linkTooltipLabel': 'Title',
2695
2695
  'linkWebUrl': 'Web address',
2696
2696
  'linkTitle': 'Enter a title',
2697
- 'linkurl': 'http://example.com',
2697
+ 'linkurl': 'https://example.com',
2698
2698
  'linkOpenInNewWindow': 'Open link in new window',
2699
2699
  'linkHeader': 'Insert Link',
2700
2700
  'dialogInsert': 'Insert',
@@ -2717,9 +2717,9 @@ let defaultLocale = {
2717
2717
  'imageAlternateText': 'Alternate Text',
2718
2718
  'alternateHeader': 'Alternative Text',
2719
2719
  'browse': 'Browse',
2720
- 'imageUrl': 'http://example.com/image.png',
2721
- 'audioUrl': 'http://example.com/audio.mp3',
2722
- 'videoUrl': 'http://example.com/video.mp4',
2720
+ 'imageUrl': 'https://example.com/image.png',
2721
+ 'audioUrl': 'https://example.com/audio.mp3',
2722
+ 'videoUrl': 'https://example.com/video.mp4',
2723
2723
  'webUrl': 'Web URL',
2724
2724
  'embedUrl': 'Embed Code',
2725
2725
  'imageCaption': 'Caption',
@@ -2730,7 +2730,7 @@ let defaultLocale = {
2730
2730
  'videoHeight': 'Height',
2731
2731
  'videoWidth': 'Width',
2732
2732
  'textPlaceholder': 'Enter text',
2733
- 'inserttablebtn': 'Insert table',
2733
+ 'inserttablebtn': 'Insert Table',
2734
2734
  'tabledialogHeader': 'Insert Table',
2735
2735
  'tableWidth': 'Width',
2736
2736
  'cellpadding': 'Cell Padding',
@@ -2744,7 +2744,7 @@ let defaultLocale = {
2744
2744
  'createTable': 'Create Table',
2745
2745
  'removeTable': 'Remove Table',
2746
2746
  'tableHeader': 'Header Row',
2747
- 'tableRemove': 'Delete',
2747
+ 'tableRemove': 'Delete Table',
2748
2748
  'tableCellBackground': 'Table Cell Background',
2749
2749
  'tableEditProperties': 'Table Edit Properties',
2750
2750
  'styles': 'Styles',
@@ -2806,11 +2806,11 @@ let defaultLocale = {
2806
2806
  'fontNameTimesNewRoman': 'Times New Roman',
2807
2807
  'fontNameVerdana': 'Verdana',
2808
2808
  'numberFormatListNumber': 'Number',
2809
- 'numberFormatListLowerAlpha': 'LowerAlpha',
2810
- 'numberFormatListUpperAlpha': 'UpperAlpha',
2811
- 'numberFormatListLowerRoman': 'LowerRoman',
2812
- 'numberFormatListUpperRoman': 'UpperRoman',
2813
- 'numberFormatListLowerGreek': 'LowerGreek',
2809
+ 'numberFormatListLowerAlpha': 'Lower Alpha',
2810
+ 'numberFormatListUpperAlpha': 'Upper Alpha',
2811
+ 'numberFormatListLowerRoman': 'Lower Roman',
2812
+ 'numberFormatListUpperRoman': 'Upper Roman',
2813
+ 'numberFormatListLowerGreek': 'Lower Greek',
2814
2814
  'bulletFormatListDisc': 'Disc',
2815
2815
  'bulletFormatListCircle': 'Circle',
2816
2816
  'bulletFormatListSquare': 'Square',
@@ -2824,7 +2824,10 @@ let defaultLocale = {
2824
2824
  'emojiPickerNoResultFound': 'No results found',
2825
2825
  'emojiPickerTrySomethingElse': 'Try something else',
2826
2826
  'linkAriaLabel': 'Open in new window',
2827
- 'unsupportedImage': 'Unsupported file format'
2827
+ 'unsupportedImage': 'Unsupported file format',
2828
+ 'mergecells': 'Merge cells',
2829
+ 'verticalsplit': 'Vertical split',
2830
+ 'horizontalsplit': 'Horizontal split'
2828
2831
  };
2829
2832
  let toolsLocale = {
2830
2833
  'alignments': 'alignments',
@@ -3215,7 +3218,12 @@ function setToolbarStatus(e, isPopToolbar, self) {
3215
3218
  }
3216
3219
  case 'bulletFormatList':
3217
3220
  case 'numberFormatList': {
3218
- removeClass([e.tbElements[j]], [CLS_ACTIVE]);
3221
+ if (value !== '') {
3222
+ addClass([e.tbElements[j]], [CLS_ACTIVE]);
3223
+ }
3224
+ else {
3225
+ removeClass([e.tbElements[j]], [CLS_ACTIVE]);
3226
+ }
3219
3227
  }
3220
3228
  }
3221
3229
  }
@@ -3456,7 +3464,8 @@ function updateTextNode(value, rteObj) {
3456
3464
  imageElm[i].classList.add(CLS_RTE_IMAGE);
3457
3465
  }
3458
3466
  if (!(imageElm[i].classList.contains(CLS_IMGINLINE) ||
3459
- imageElm[i].classList.contains(CLS_IMGBREAK))) {
3467
+ imageElm[i].classList.contains(CLS_IMGBREAK)) &&
3468
+ !(imageElm[i].classList.contains('e-imgleft') || imageElm[i].classList.contains('e-imgright') || imageElm[i].classList.contains('e-imgcenter'))) {
3460
3469
  imageElm[i].classList.add(CLS_IMGINLINE);
3461
3470
  }
3462
3471
  }
@@ -3605,6 +3614,7 @@ class ToolbarRenderer {
3605
3614
  wireEvent() {
3606
3615
  this.parent.on(destroy, this.unWireEvent, this);
3607
3616
  this.parent.on(destroyTooltip, this.destroyTooltip, this);
3617
+ this.parent.on(closeTooltip, this.closeTooltip, this);
3608
3618
  }
3609
3619
  destroyTooltip() {
3610
3620
  const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
@@ -3617,6 +3627,8 @@ class ToolbarRenderer {
3617
3627
  }
3618
3628
  unWireEvent() {
3619
3629
  this.parent.off(destroy, this.unWireEvent);
3630
+ this.parent.off(destroyTooltip, this.destroyTooltip);
3631
+ this.parent.off(closeTooltip, this.closeTooltip);
3620
3632
  }
3621
3633
  toolbarBeforeCreate(e) {
3622
3634
  if (this.mode === 'Extended') {
@@ -3735,7 +3747,7 @@ class ToolbarRenderer {
3735
3747
  windowCollision: true,
3736
3748
  position: 'BottomCenter'
3737
3749
  });
3738
- this.tooltip.appendTo(args.target);
3750
+ this.tooltip.appendTo(args.target.parentElement);
3739
3751
  }
3740
3752
  }
3741
3753
  /**
@@ -3866,6 +3878,32 @@ class ToolbarRenderer {
3866
3878
  popupElement.setAttribute('aria-owns', this.parent.getID());
3867
3879
  return dropDown;
3868
3880
  }
3881
+ mouseOutHandler() {
3882
+ if (!isNullOrUndefined(this.tooltipTargetEle)) {
3883
+ this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));
3884
+ }
3885
+ else {
3886
+ const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
3887
+ this.parent.contentModule.getDocument();
3888
+ this.tooltipTargetEle = currentDocument.querySelector('[data-title]');
3889
+ this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));
3890
+ }
3891
+ this.tooltipTargetEle.removeAttribute('data-title');
3892
+ EventHandler.remove(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler);
3893
+ }
3894
+ closeTooltip(args) {
3895
+ const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
3896
+ this.parent.contentModule.getDocument();
3897
+ this.tooltipTargetEle = closest(args.target, '[data-tooltip-id]');
3898
+ if (!isNullOrUndefined(this.tooltipTargetEle) && this.parent.showTooltip && !isNullOrUndefined(currentDocument.querySelector('.e-tooltip-wrap'))) {
3899
+ this.destroyTooltip();
3900
+ if (!this.tooltipTargetEle.closest('.e-rte-quick-popup')) {
3901
+ this.tooltipTargetEle.setAttribute('data-title', this.tooltipTargetEle.getAttribute('title'));
3902
+ this.tooltipTargetEle.removeAttribute('title');
3903
+ EventHandler.add(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler, this);
3904
+ }
3905
+ }
3906
+ }
3869
3907
  /**
3870
3908
  * renderListDropDown method
3871
3909
  *
@@ -3890,6 +3928,35 @@ class ToolbarRenderer {
3890
3928
  enableRtl: this.parent.enableRtl,
3891
3929
  select: this.dropDownSelected.bind(this),
3892
3930
  beforeOpen: (args) => {
3931
+ if (proxy.parent.editorMode !== 'Markdown') {
3932
+ const startNode = proxy.parent.getRange().startContainer.parentElement;
3933
+ const listElem = startNode.closest('LI');
3934
+ const currentLiElem = !isNullOrUndefined(listElem) ? listElem.parentElement : null;
3935
+ if (!isNullOrUndefined(currentLiElem) && (currentLiElem.nodeName === 'OL' || currentLiElem.nodeName === 'UL')) {
3936
+ if (currentLiElem.nodeName === 'UL' && args.items[0].subCommand === 'NumberFormatList') {
3937
+ addClass([args.element.childNodes[0]], 'e-active');
3938
+ }
3939
+ else if (currentLiElem.nodeName === 'OL' && args.items[0].subCommand === 'BulletFormatList') {
3940
+ addClass([args.element.childNodes[0]], 'e-active');
3941
+ }
3942
+ else {
3943
+ let currentListStyle = currentLiElem.style.listStyleType.split('-').join('').toLocaleLowerCase();
3944
+ currentListStyle = currentListStyle === 'decimal' ? 'number' : currentListStyle;
3945
+ for (let index = 0; index < args.element.childNodes.length; index++) {
3946
+ if (currentListStyle === args.element.childNodes[index].innerHTML.split(' ').join('').toLocaleLowerCase()) {
3947
+ addClass([args.element.childNodes[index]], 'e-active');
3948
+ }
3949
+ else if (currentListStyle === '') {
3950
+ addClass([args.element.childNodes[index]], 'e-active');
3951
+ }
3952
+ }
3953
+ }
3954
+ }
3955
+ else {
3956
+ addClass([args.element.childNodes[0]], 'e-active');
3957
+ }
3958
+ }
3959
+ this.closeTooltip({ target: args.event.target });
3893
3960
  if (proxy.parent.readonly || !proxy.parent.enabled) {
3894
3961
  args.cancel = true;
3895
3962
  return;
@@ -4303,23 +4370,13 @@ class BaseToolbar {
4303
4370
  case '-':
4304
4371
  return { type: 'Separator', cssClass: CLS_HR_SEPARATOR };
4305
4372
  default:
4306
- if (this.parent.showTooltip) {
4307
- return {
4308
- id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
4309
- prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
4310
- tooltipText: getTooltipText(itemStr, this.locator),
4311
- command: this.tools[itemStr.toLocaleLowerCase()].command,
4312
- subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
4313
- };
4314
- }
4315
- else {
4316
- return {
4317
- id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
4318
- prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
4319
- command: this.tools[itemStr.toLocaleLowerCase()].command,
4320
- subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
4321
- };
4322
- }
4373
+ return {
4374
+ id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
4375
+ prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
4376
+ tooltipText: getTooltipText(itemStr, this.locator),
4377
+ command: this.tools[itemStr.toLocaleLowerCase()].command,
4378
+ subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
4379
+ };
4323
4380
  }
4324
4381
  }
4325
4382
  }
@@ -4366,17 +4423,21 @@ class BaseToolbar {
4366
4423
  items.push(item);
4367
4424
  }
4368
4425
  }
4369
- for (let num = 0; num < items.length; num++) {
4370
- const tooltipText = items[num].tooltipText;
4371
- let shortCutKey;
4372
- if (windowKeys[`${tooltipText}`]) {
4373
- shortCutKey = Browser.isDevice && isIDevice() ? windowKeys[`${tooltipText}`].replace('Ctrl', 'Cmd') : windowKeys[`${tooltipText}`];
4374
- }
4375
- else {
4376
- shortCutKey = tooltipText;
4377
- }
4378
- if (shortCutKey) {
4379
- items[num].tooltipText = (tooltipText !== shortCutKey) ? tooltipText + ' (' + shortCutKey + ')' : tooltipText;
4426
+ if (this.parent.showTooltip) {
4427
+ for (let num = 0; num < items.length; num++) {
4428
+ const tooltipText = items[num].tooltipText;
4429
+ let shortCutKey;
4430
+ if (windowKeys[`${tooltipText}`]) {
4431
+ shortCutKey = window.navigator.platform.toLocaleLowerCase().includes('mac') ? windowKeys[`${tooltipText}`].replace('Ctrl', 'Cmd') : windowKeys[`${tooltipText}`];
4432
+ }
4433
+ else {
4434
+ shortCutKey = tooltipText;
4435
+ }
4436
+ if (shortCutKey) {
4437
+ if (!(items[num].command === "Images" && items[num].subCommand === "InsertLink")) {
4438
+ items[num].tooltipText = (tooltipText !== shortCutKey) ? tooltipText + ' (' + shortCutKey + ')' : tooltipText;
4439
+ }
4440
+ }
4380
4441
  }
4381
4442
  }
4382
4443
  return items;
@@ -4425,7 +4486,7 @@ class DropDownButtons {
4425
4486
  addClass([args.element], item.cssClass);
4426
4487
  }
4427
4488
  if (item.command === 'Images' || item.command === 'Videos' || item.command === 'Audios' || item.command === 'Table') {
4428
- args.element.setAttribute('title', getQuickToolbarTooltipText(item.text));
4489
+ args.element.setAttribute('title', getQuickToolbarTooltipText(item.text) !== '' ? getQuickToolbarTooltipText(item.text) : item.text);
4429
4490
  }
4430
4491
  if (item.command === 'Alignments' || item.subCommand === 'JustifyLeft'
4431
4492
  || item.subCommand === 'JustifyRight' || item.subCommand === 'JustifyCenter') {
@@ -4435,13 +4496,13 @@ class DropDownButtons {
4435
4496
  args.element.setAttribute('title', getTooltipTextDropdownItems(item.subCommand.toLocaleLowerCase(), this.locator, formatsLocale));
4436
4497
  }
4437
4498
  if (item.command === 'Font') {
4438
- args.element.setAttribute('title', getTooltipTextDropdownItems(item.value.toLocaleLowerCase(), this.locator, fontNameLocale));
4499
+ args.element.setAttribute('title', getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, fontNameLocale) !== '' ? getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, fontNameLocale) : item.text);
4439
4500
  }
4440
4501
  if (item.subCommand === 'BulletFormatList') {
4441
- args.element.setAttribute('title', getTooltipTextDropdownItems(item.value.toLocaleLowerCase(), this.locator, bulletFormatListLocale));
4502
+ args.element.setAttribute('title', getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, bulletFormatListLocale) !== '' ? getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, bulletFormatListLocale) : item.text);
4442
4503
  }
4443
4504
  if (item.subCommand === 'NumberFormatList') {
4444
- args.element.setAttribute('title', getTooltipTextDropdownItems(item.text.replace(/\s/g, '').toLocaleLowerCase(), this.locator, numberFormatListLocale));
4505
+ args.element.setAttribute('title', (getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, numberFormatListLocale)) !== '' ? getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, numberFormatListLocale) : item.text);
4445
4506
  }
4446
4507
  if (item.subCommand === 'FontSize') {
4447
4508
  args.element.setAttribute('title', getTooltipTextDropdownItems(item.value.toLocaleLowerCase(), null, null, this.parent));
@@ -5242,72 +5303,14 @@ class Toolbar$2 {
5242
5303
  }
5243
5304
  }
5244
5305
  toggleFloatClass(e) {
5245
- let topValue;
5246
- let isBody = false;
5247
- let isFloat = false;
5248
- let scrollParent;
5249
5306
  const floatOffset = this.parent.floatingToolbarOffset;
5250
- if (e && this.parent.iframeSettings.enable && this.parent.inputElement.ownerDocument === e.target) {
5251
- scrollParent = e.target.body;
5252
- }
5253
- else if (e && e.target !== document) {
5254
- scrollParent = e.target;
5255
- }
5256
- else {
5257
- isBody = true;
5258
- scrollParent = document.body;
5259
- }
5260
- const tbHeight = this.getToolbarHeight() + this.getExpandTBarPopHeight();
5261
- if (this.isTransformChild) {
5262
- topValue = 0;
5263
- let scrollParentRelativeTop = 0;
5264
- const trgHeight = this.parent.element.offsetHeight;
5265
- if (isBody) {
5266
- const bodyStyle = window.getComputedStyle(scrollParent);
5267
- scrollParentRelativeTop = parseFloat(bodyStyle.marginTop.split('px')[0]) + parseFloat(bodyStyle.paddingTop.split('px')[0]);
5268
- }
5269
- const targetTop = this.parent.element.getBoundingClientRect().top;
5270
- const scrollParentYOffset = (Browser.isMSPointer && isBody) ? window.pageYOffset : scrollParent.parentElement.scrollTop;
5271
- const scrollParentRect = scrollParent.getBoundingClientRect();
5272
- const scrollParentTop = (!isBody) ? scrollParentRect.top : (scrollParentRect.top + scrollParentYOffset);
5273
- const outOfRange = ((targetTop - ((!isBody) ? scrollParentTop : 0))
5274
- + trgHeight > tbHeight + floatOffset) ? false : true;
5275
- if (targetTop > (scrollParentTop + floatOffset) || targetTop < -trgHeight || ((targetTop < 0) ? outOfRange : false)) {
5276
- isFloat = false;
5277
- removeClass([this.tbElement], [CLS_TB_ABS_FLOAT]);
5278
- }
5279
- else if (targetTop < (scrollParentTop + floatOffset)) {
5280
- if (targetTop < 0) {
5281
- topValue = (-targetTop) + scrollParentTop;
5282
- }
5283
- else {
5284
- topValue = scrollParentTop - targetTop;
5285
- }
5286
- topValue = (isBody) ? topValue - scrollParentRelativeTop : topValue;
5287
- addClass([this.tbElement], [CLS_TB_ABS_FLOAT]);
5288
- isFloat = true;
5289
- }
5290
- }
5291
- else {
5292
- const parent = this.parent.element.getBoundingClientRect();
5293
- if (window.innerHeight < parent.top) {
5294
- return;
5295
- }
5296
- topValue = (e && e.target !== document) ? scrollParent.getBoundingClientRect().top : 0;
5297
- if ((parent.bottom < (floatOffset + tbHeight + topValue)) || parent.bottom < 0 || parent.top > floatOffset + topValue) {
5298
- isFloat = false;
5299
- }
5300
- else if (parent.top < floatOffset || parent.top < floatOffset + topValue) {
5301
- isFloat = true;
5302
- }
5303
- }
5304
- if (!isFloat) {
5305
- removeClass([this.tbElement], [CLS_TB_FLOAT]);
5306
- setStyleAttribute(this.tbElement, { top: 0 + 'px', width: '100%' });
5307
+ if (this.parent.toolbarSettings.enableFloating) {
5308
+ addClass([this.tbElement.parentElement], [CLS_TB_FLOAT]);
5309
+ setStyleAttribute(this.tbElement.parentElement, { top: (floatOffset) + 'px' });
5307
5310
  }
5308
5311
  else {
5309
- addClass([this.tbElement], [CLS_TB_FLOAT]);
5310
- setStyleAttribute(this.tbElement, { width: this.parent.element.offsetWidth + 'px', top: (floatOffset + topValue) + 'px' });
5312
+ removeClass([this.tbElement.parentElement], [CLS_TB_FLOAT]);
5313
+ setStyleAttribute(this.tbElement.parentElement, { top: '' });
5311
5314
  }
5312
5315
  }
5313
5316
  renderToolbar() {
@@ -5613,19 +5616,6 @@ class Toolbar$2 {
5613
5616
  this.toolbarActionModule.parent = null;
5614
5617
  this.dropDownModule.parent = null;
5615
5618
  }
5616
- scrollHandler(e) {
5617
- if (!this.parent.inlineMode.enable) {
5618
- if (this.parent.toolbarSettings.enableFloating && this.getDOMVisibility(this.tbElement)) {
5619
- this.toggleFloatClass(e.args);
5620
- }
5621
- }
5622
- }
5623
- getDOMVisibility(el) {
5624
- if (!el.offsetParent && el.offsetWidth === 0 && el.offsetHeight === 0) {
5625
- return false;
5626
- }
5627
- return true;
5628
- }
5629
5619
  mouseDownHandler() {
5630
5620
  if (Browser.isDevice && this.parent.inlineMode.enable && !isIDevice()) {
5631
5621
  this.showFixedTBar();
@@ -5662,11 +5652,6 @@ class Toolbar$2 {
5662
5652
  }
5663
5653
  adjustContentHeight(trg, isKeyboard) {
5664
5654
  if (trg && this.parent.toolbarSettings.type === ToolbarType.Expand && !isNullOrUndefined(trg)) {
5665
- const extendedTbar = this.tbElement.querySelector('.e-toolbar-extended');
5666
- if (!isNullOrUndefined(extendedTbar)) {
5667
- setStyleAttribute(extendedTbar, { maxHeight: '', display: 'block' });
5668
- setStyleAttribute(extendedTbar, { maxHeight: extendedTbar.offsetHeight + 'px', display: '' });
5669
- }
5670
5655
  const hasActiveClass = trg.classList.contains('e-nav-active');
5671
5656
  const isExpand = isKeyboard ? (hasActiveClass ? false : true) : (hasActiveClass ? true : false);
5672
5657
  if (isExpand) {
@@ -5675,7 +5660,7 @@ class Toolbar$2 {
5675
5660
  else {
5676
5661
  removeClass([this.tbElement], [CLS_EXPAND_OPEN]);
5677
5662
  }
5678
- this.parent.setContentHeight('toolbar', isExpand);
5663
+ this.parent.setContentHeight('Toolbar', isExpand);
5679
5664
  }
5680
5665
  else if (Browser.isDevice || this.parent.inlineMode.enable) {
5681
5666
  this.isToolbar = true;
@@ -5700,7 +5685,6 @@ class Toolbar$2 {
5700
5685
  this.dropDownModule = new DropDownButtons(this.parent, this.locator);
5701
5686
  this.toolbarActionModule = new ToolbarAction(this.parent);
5702
5687
  this.parent.on(initialEnd, this.renderToolbar, this);
5703
- this.parent.on(scroll, this.scrollHandler, this);
5704
5688
  this.parent.on(bindOnEnd, this.toolbarBindEvent, this);
5705
5689
  this.parent.on(toolbarUpdated, this.updateToolbarStatus, this);
5706
5690
  this.parent.on(modelChanged, this.onPropertyChanged, this);
@@ -5725,7 +5709,6 @@ class Toolbar$2 {
5725
5709
  return;
5726
5710
  }
5727
5711
  this.parent.off(initialEnd, this.renderToolbar);
5728
- this.parent.off(scroll, this.scrollHandler);
5729
5712
  this.parent.off(bindOnEnd, this.toolbarBindEvent);
5730
5713
  this.parent.off(toolbarUpdated, this.updateToolbarStatus);
5731
5714
  this.parent.off(modelChanged, this.onPropertyChanged);
@@ -5760,7 +5743,8 @@ class Toolbar$2 {
5760
5743
  if (!this.parent.inlineMode.enable) {
5761
5744
  this.refreshToolbarOverflow();
5762
5745
  }
5763
- this.parent.setContentHeight('', true);
5746
+ const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
5747
+ this.parent.setContentHeight('Refresh', isExpand);
5764
5748
  }
5765
5749
  /**
5766
5750
  * Called internally if any of the property value changed.
@@ -5780,6 +5764,11 @@ class Toolbar$2 {
5780
5764
  }
5781
5765
  }
5782
5766
  }
5767
+ if (!isNullOrUndefined(e.newProp.toolbarSettings)) {
5768
+ if (!isNullOrUndefined(e.newProp.toolbarSettings.enableFloating)) {
5769
+ this.toggleFloatClass();
5770
+ }
5771
+ }
5783
5772
  if (e.module !== this.getModuleName()) {
5784
5773
  return;
5785
5774
  }
@@ -6279,7 +6268,7 @@ class BaseQuickToolbar {
6279
6268
  constructor(parent, locator) {
6280
6269
  this.parent = parent;
6281
6270
  this.locator = locator;
6282
- this.isDOMElement = false;
6271
+ this.isRendered = false;
6283
6272
  this.renderFactory = this.locator.getService('rendererFactory');
6284
6273
  this.contentRenderer = this.renderFactory.getRenderer(RenderType.Content);
6285
6274
  this.popupRenderer = this.renderFactory.getRenderer(RenderType.Popup);
@@ -6343,7 +6332,18 @@ class BaseQuickToolbar {
6343
6332
  e.target.classList.contains('e-imgbreak')) ? false : true;
6344
6333
  let target = !isNullOrUndefined(imgWrapper) ? imgWrapper : e.target;
6345
6334
  addClass([this.toolbarElement], [CLS_RM_WHITE_SPACE]);
6346
- const targetOffsetTop = (target.classList.contains("e-rte-audio")) ? target.parentElement.offsetTop : target.offsetTop;
6335
+ let targetOffsetTop;
6336
+ if (!isNullOrUndefined(closest(target, 'table'))) {
6337
+ targetOffsetTop = target.offsetTop;
6338
+ let parentTable = closest(target, 'table');
6339
+ while (!isNullOrUndefined(parentTable)) {
6340
+ targetOffsetTop += parentTable.offsetTop;
6341
+ parentTable = closest(parentTable.parentElement, 'table');
6342
+ }
6343
+ }
6344
+ else {
6345
+ targetOffsetTop = (target.classList.contains("e-rte-audio")) ? target.parentElement.offsetTop : target.offsetTop;
6346
+ }
6347
6347
  const parentOffsetTop = window.pageYOffset + e.parentData.top;
6348
6348
  if ((targetOffsetTop - e.editTop) > e.popHeight) {
6349
6349
  y = parentOffsetTop + e.tBarElementHeight + (targetOffsetTop - e.editTop) - e.popHeight - 5;
@@ -6355,11 +6355,30 @@ class BaseQuickToolbar {
6355
6355
  y = e.y;
6356
6356
  }
6357
6357
  target = isAligned ? e.target : target;
6358
- if (target.offsetWidth > e.popWidth) {
6359
- x = (target.offsetWidth / 2) - (e.popWidth / 2) + e.parentData.left + ((target.classList.contains("e-rte-audio")) ? target.parentElement.offsetLeft : target.offsetLeft);
6358
+ let targetOffsetLeft;
6359
+ let currentOffsetWidth;
6360
+ if (!isNullOrUndefined(closest(target, 'table'))) {
6361
+ targetOffsetLeft = target.offsetLeft;
6362
+ let parentTable = closest(target, 'table');
6363
+ let checkOffSetParentWidth = false;
6364
+ if (!isNullOrUndefined(closest(parentTable, 'TD'))) {
6365
+ checkOffSetParentWidth = true;
6366
+ }
6367
+ while (!isNullOrUndefined(parentTable)) {
6368
+ targetOffsetLeft += parentTable.offsetLeft;
6369
+ currentOffsetWidth = checkOffSetParentWidth ? parentTable.offsetWidth : target.offsetWidth;
6370
+ parentTable = closest(parentTable.parentElement, 'table');
6371
+ }
6360
6372
  }
6361
6373
  else {
6362
- x = e.parentData.left + target.offsetLeft;
6374
+ currentOffsetWidth = target.offsetWidth;
6375
+ targetOffsetLeft = (target.classList.contains("e-rte-audio")) ? target.parentElement.offsetLeft : target.offsetLeft;
6376
+ }
6377
+ if (currentOffsetWidth > e.popWidth) {
6378
+ x = (currentOffsetWidth / 2) - (e.popWidth / 2) + e.parentData.left + targetOffsetLeft;
6379
+ }
6380
+ else {
6381
+ x = e.parentData.left + targetOffsetLeft;
6363
6382
  }
6364
6383
  this.popupObj.position.X = ((x + e.popWidth) > e.parentData.right) ? e.parentData.right - e.popWidth : x;
6365
6384
  this.popupObj.position.Y = (y >= 0) ? y : e.y + 5;
@@ -6496,7 +6515,8 @@ class BaseQuickToolbar {
6496
6515
  openDelay: 400,
6497
6516
  showTipPointer: true,
6498
6517
  windowCollision: true,
6499
- position: 'BottomCenter'
6518
+ position: 'BottomCenter',
6519
+ cssClass: this.parent.getCssClass()
6500
6520
  });
6501
6521
  this.tooltip.appendTo(this.element);
6502
6522
  }
@@ -6530,7 +6550,7 @@ class BaseQuickToolbar {
6530
6550
  parentData: parent.getBoundingClientRect(),
6531
6551
  tBarElementHeight: tBarHeight
6532
6552
  };
6533
- if ((target.tagName === 'IMG' || target.tagName === 'AUDIO' || target.tagName === 'VIDEO' || target.tagName === 'IFRAME' || (target.classList &&
6553
+ if ((closest(target, 'TABLE') || target.tagName === 'IMG' || target.tagName === 'AUDIO' || target.tagName === 'VIDEO' || target.tagName === 'IFRAME' || (target.classList &&
6534
6554
  (target.classList.contains(CLS_AUDIOWRAP) || target.classList.contains(CLS_CLICKELEM) ||
6535
6555
  target.classList.contains(CLS_VID_CLICK_ELEM)))) && (x == beforeQuickToolbarArgs.positionX || y == beforeQuickToolbarArgs.positionY)) {
6536
6556
  this.setPosition(showPopupData);
@@ -6550,7 +6570,7 @@ class BaseQuickToolbar {
6550
6570
  maxWidth: window.outerWidth + 'px'
6551
6571
  });
6552
6572
  addClass([this.element], [CLS_POP]);
6553
- this.isDOMElement = true;
6573
+ this.isRendered = true;
6554
6574
  }
6555
6575
  });
6556
6576
  }
@@ -6590,7 +6610,7 @@ class BaseQuickToolbar {
6590
6610
  this.parent.notify(destroyTooltip, { args: event });
6591
6611
  }
6592
6612
  this.removeEleFromDOM();
6593
- this.isDOMElement = false;
6613
+ this.isRendered = false;
6594
6614
  }
6595
6615
  /**
6596
6616
  * @param {string} item - specifies the string value
@@ -6613,7 +6633,7 @@ class BaseQuickToolbar {
6613
6633
  }
6614
6634
  removeEleFromDOM() {
6615
6635
  const element = this.popupObj.element;
6616
- if (this.isDOMElement) {
6636
+ if (this.isRendered) {
6617
6637
  this.dropDownButtons.destroyDropDowns();
6618
6638
  this.colorPickerObj.destroyColorPicker();
6619
6639
  removeClass([this.element], [CLS_POP]);
@@ -7024,6 +7044,9 @@ class QuickToolbar {
7024
7044
  }
7025
7045
  }
7026
7046
  if (!isNullOrUndefined(this.textQTBar) && !isNullOrUndefined(this.parent.quickToolbarSettings.text) && !this.parent.inlineMode.enable) {
7047
+ if (!isNullOrUndefined(e) && !isNullOrUndefined(e.name) && e.name === 'sourceCodeMouseDown') {
7048
+ return;
7049
+ }
7027
7050
  const args = e.args.touches ?
7028
7051
  e.args.changedTouches[0] : e.args;
7029
7052
  const target = e.args.target;
@@ -7034,7 +7057,7 @@ class QuickToolbar {
7034
7057
  this.offsetY = pageYOffset(args, this.parent.element, this.parent.iframeSettings.enable);
7035
7058
  const range = this.parent.getRange();
7036
7059
  if ((range.endContainer.parentElement.tagName === range.startContainer.parentElement.tagName && (range.startContainer.parentElement.tagName === 'A' && range.endContainer.parentElement.tagName === 'A')) ||
7037
- (target.tagName === 'IMG') || (target.tagName === 'VIDEO') || (target.tagName === 'AUDIO') || (target.childNodes[0].nodeType === 1 && target.childNodes[0].classList.contains('e-rte-audio')) ||
7060
+ (target.tagName === 'IMG') || (target.tagName === 'VIDEO') || (target.tagName === 'AUDIO') || (target.childNodes[0] && target.childNodes[0].nodeType === 1 && target.childNodes[0].classList.contains('e-rte-audio')) ||
7038
7061
  (this.parent.getRange().startOffset === this.parent.getRange().endOffset)) {
7039
7062
  return;
7040
7063
  }
@@ -7042,13 +7065,16 @@ class QuickToolbar {
7042
7065
  this.textQTBar.showPopup(this.offsetX, this.offsetY, target, 'text');
7043
7066
  }
7044
7067
  }
7045
- keyDownHandler() {
7046
- if ((this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice()))
7047
- && !isNullOrUndefined(select('.' + CLS_INLINE_POP, document))) {
7048
- this.hideInlineQTBar();
7049
- }
7050
- if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close')) {
7051
- this.textQTBar.hidePopup();
7068
+ keyDownHandler(e) {
7069
+ const preventHide = e.args.altKey;
7070
+ if (!preventHide) {
7071
+ if ((this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice()))
7072
+ && !isNullOrUndefined(select('.' + CLS_INLINE_POP, document))) {
7073
+ this.hideInlineQTBar();
7074
+ }
7075
+ if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close')) {
7076
+ this.textQTBar.hidePopup();
7077
+ }
7052
7078
  }
7053
7079
  }
7054
7080
  inlineQTBarMouseDownHandler() {
@@ -7374,6 +7400,15 @@ class QuickToolbar {
7374
7400
  getModuleName() {
7375
7401
  return 'quickToolbar';
7376
7402
  }
7403
+ /**
7404
+ *
7405
+ * @returns {BaseQuickToolbar[]} - specifies the quick toolbar instance.
7406
+ * @hidden
7407
+ * @private
7408
+ */
7409
+ getQuickToolbarInstance() {
7410
+ return [this.linkQTBar, this.imageQTBar, this.audioQTBar, this.videoQTBar, this.tableQTBar, this.textQTBar, this.inlineQTBar];
7411
+ }
7377
7412
  }
7378
7413
 
7379
7414
  /**
@@ -9645,6 +9680,17 @@ const selfClosingTags = [
9645
9680
  'BR',
9646
9681
  'IMG'
9647
9682
  ];
9683
+ /**
9684
+ * Resize factor for image.
9685
+ * @hidden
9686
+ *
9687
+ */
9688
+ const imageResizeFactor = {
9689
+ topLeft: [-1, -1],
9690
+ topRight: [1, -1],
9691
+ botRight: [1, 1],
9692
+ botLeft: [-1, 1]
9693
+ };
9648
9694
 
9649
9695
  /**
9650
9696
  * `Undo` module is used to handle undo actions.
@@ -10578,7 +10624,9 @@ class MarkdownEditor {
10578
10624
  onToolbarClick(args) {
10579
10625
  const item = args.item;
10580
10626
  const textArea = this.parent.contentModule.getEditPanel();
10581
- textArea.focus();
10627
+ if (item.command !== 'Formats') {
10628
+ textArea.focus();
10629
+ }
10582
10630
  const startOffset = textArea.selectionStart;
10583
10631
  const endOffset = textArea.selectionEnd;
10584
10632
  const text = textArea.value.substring(startOffset, endOffset);
@@ -11899,11 +11947,12 @@ class DOMNode {
11899
11947
  /**
11900
11948
  * blockNodes method
11901
11949
  *
11950
+ * @param {boolean} action - Optional Boolean that specifies the action is whether performed.
11902
11951
  * @returns {Node[]} - returns the node array values
11903
11952
  * @hidden
11904
11953
  * @deprecated
11905
11954
  */
11906
- blockNodes() {
11955
+ blockNodes(action) {
11907
11956
  const collectionNodes = [];
11908
11957
  const selection = this.getSelection();
11909
11958
  if (this.isEditorArea() && selection.rangeCount) {
@@ -11917,23 +11966,46 @@ class DOMNode {
11917
11966
  collectionNodes.push(startNode);
11918
11967
  }
11919
11968
  parentNode = this.blockParentNode(startNode);
11969
+ const endParentNode = this.blockParentNode(endNode);
11920
11970
  if (parentNode && collectionNodes.indexOf(parentNode) < 0) {
11921
- if (IGNORE_BLOCK_TAGS.indexOf(parentNode.tagName.toLocaleLowerCase()) >= 0 && (startNode.tagName === 'BR' ||
11922
- startNode.nodeType === Node.TEXT_NODE ||
11923
- startNode.classList.contains(markerClassName.startSelection) ||
11924
- startNode.classList.contains(markerClassName.endSelection))) {
11925
- const tempNode = startNode.previousSibling &&
11926
- startNode.previousSibling.nodeType === Node.TEXT_NODE ?
11927
- startNode.previousSibling : startNode;
11928
- if (!startNode.nextSibling && !startNode.previousSibling && startNode.tagName === 'BR') {
11929
- collectionNodes.push(tempNode);
11971
+ if (!isNullOrUndefined(action) && action) {
11972
+ if (range.commonAncestorContainer.nodeName === 'TD' || parentNode.nodeName === 'TD' || endParentNode.nodeName === 'TD') {
11973
+ const processedNodes = this.getPreBlockNodeCollection(range);
11974
+ if (processedNodes.length > 1) {
11975
+ this.wrapWithBlockNode(processedNodes, collectionNodes);
11976
+ }
11977
+ else if (processedNodes.length > 0) {
11978
+ if (startNode !== endNode && startNode.nodeName !== 'BR') {
11979
+ collectionNodes.push(this.createTempNode(startNode));
11980
+ }
11981
+ else if (startNode === endNode && startNode.nodeName === 'SPAN' && (startNode.classList.contains(markerClassName.startSelection)
11982
+ || startNode.classList.contains(markerClassName.endSelection))) {
11983
+ collectionNodes.push(this.createTempNode(startNode));
11984
+ }
11985
+ }
11930
11986
  }
11931
11987
  else {
11932
- collectionNodes.push(this.createTempNode(tempNode));
11988
+ collectionNodes.push(parentNode);
11933
11989
  }
11934
11990
  }
11935
11991
  else {
11936
- collectionNodes.push(parentNode);
11992
+ if (IGNORE_BLOCK_TAGS.indexOf(parentNode.tagName.toLocaleLowerCase()) >= 0 && (startNode.tagName === 'BR' ||
11993
+ startNode.nodeType === Node.TEXT_NODE ||
11994
+ startNode.classList.contains(markerClassName.startSelection) ||
11995
+ startNode.classList.contains(markerClassName.endSelection))) {
11996
+ const tempNode = startNode.previousSibling &&
11997
+ startNode.previousSibling.nodeType === Node.TEXT_NODE ?
11998
+ startNode.previousSibling : startNode;
11999
+ if (!startNode.nextSibling && !startNode.previousSibling && startNode.tagName === 'BR') {
12000
+ collectionNodes.push(tempNode);
12001
+ }
12002
+ else {
12003
+ collectionNodes.push(this.createTempNode(tempNode));
12004
+ }
12005
+ }
12006
+ else {
12007
+ collectionNodes.push(parentNode);
12008
+ }
11937
12009
  }
11938
12010
  }
11939
12011
  const nodes = [];
@@ -12002,6 +12074,131 @@ class DOMNode {
12002
12074
  ignoreTableTag(element) {
12003
12075
  return !(TABLE_BLOCK_TAGS.indexOf(element.tagName.toLocaleLowerCase()) >= 0);
12004
12076
  }
12077
+ getPreBlockNodeCollection(range) {
12078
+ const startNode = this.getSelectedNode(range.startContainer, range.startOffset);
12079
+ const endNode = this.getSelectedNode(range.endContainer, range.endOffset);
12080
+ const nodes = [];
12081
+ const rootNode = startNode.closest('td, th');
12082
+ if (isNullOrUndefined(rootNode)) {
12083
+ return nodes;
12084
+ }
12085
+ const rootChildNode = Array.from(rootNode.childNodes);
12086
+ let isContinue = true;
12087
+ const processedStart = this.getClosestInlineParent(startNode, rootNode, true);
12088
+ const processedEnd = this.getClosestInlineParent(endNode, rootNode, false);
12089
+ for (let i = 0; i < rootChildNode.length; i++) {
12090
+ const child = rootChildNode[i];
12091
+ if (processedStart === processedEnd && child === processedStart) {
12092
+ nodes.push(child);
12093
+ isContinue = true;
12094
+ }
12095
+ else if (child === processedStart) {
12096
+ isContinue = false;
12097
+ }
12098
+ else if (child === processedEnd) {
12099
+ nodes.push(child); // Early Exit so Push the end node.
12100
+ isContinue = true;
12101
+ }
12102
+ if (isContinue) {
12103
+ continue;
12104
+ }
12105
+ else {
12106
+ nodes.push(child);
12107
+ }
12108
+ }
12109
+ return nodes;
12110
+ }
12111
+ getClosestInlineParent(node, rootNode, isStart) {
12112
+ // 1. If the node is a text node, return the node
12113
+ // 2. If the node is a block node return block node
12114
+ // 3. If the node is a inline node,
12115
+ // Traverse back untill the TD or TH node
12116
+ // Check if the the previous sibling , next sibling is a block node.
12117
+ // If yes return the inline node that is closest to the block node.
12118
+ if (node.nodeType === Node.TEXT_NODE) {
12119
+ return node;
12120
+ }
12121
+ if (this.isBlockNode(node)) {
12122
+ return node;
12123
+ }
12124
+ let currentNode = node;
12125
+ let rootFlag = false;
12126
+ while (currentNode) {
12127
+ const previousNode = currentNode;
12128
+ if (rootFlag) {
12129
+ if (this.isBlockNode(currentNode)) {
12130
+ return previousNode;
12131
+ }
12132
+ if (isStart && currentNode.previousSibling) {
12133
+ if (this.isBlockNode(currentNode.previousSibling) || currentNode.previousSibling.nodeName === 'BR') {
12134
+ return previousNode;
12135
+ }
12136
+ else {
12137
+ currentNode = currentNode.previousSibling;
12138
+ }
12139
+ }
12140
+ else if (!isStart && currentNode.nextSibling) {
12141
+ if (this.isBlockNode(currentNode.nextSibling) || currentNode.nextSibling.nodeName === 'BR') {
12142
+ return previousNode;
12143
+ }
12144
+ else {
12145
+ currentNode = currentNode.nextSibling;
12146
+ }
12147
+ }
12148
+ else {
12149
+ return currentNode;
12150
+ }
12151
+ }
12152
+ else {
12153
+ currentNode = currentNode.parentElement;
12154
+ if (currentNode === rootNode) {
12155
+ currentNode = previousNode;
12156
+ rootFlag = true;
12157
+ }
12158
+ }
12159
+ }
12160
+ return null;
12161
+ }
12162
+ wrapWithBlockNode(nodes, collectionNodes) {
12163
+ let wrapperElement = createElement('p');
12164
+ for (let i = 0; i < nodes.length; i++) {
12165
+ const child = nodes[i];
12166
+ if (child.nodeName === 'BR') {
12167
+ child.parentNode.insertBefore(wrapperElement, child);
12168
+ wrapperElement.appendChild(child);
12169
+ if (wrapperElement.childNodes.length > 0) {
12170
+ collectionNodes.push(wrapperElement);
12171
+ }
12172
+ wrapperElement = createElement('p');
12173
+ }
12174
+ else {
12175
+ if (!this.isBlockNode(child)) {
12176
+ if (child.nodeName === '#text' && child.textContent.trim() === '') {
12177
+ continue;
12178
+ }
12179
+ if (wrapperElement.childElementCount === 0) {
12180
+ child.parentNode.insertBefore(wrapperElement, child);
12181
+ wrapperElement.appendChild(child);
12182
+ }
12183
+ else {
12184
+ wrapperElement.appendChild(child);
12185
+ }
12186
+ }
12187
+ else {
12188
+ collectionNodes.push(child);
12189
+ }
12190
+ // Use case when the BR is next sibling but the BR is not the part of selection.
12191
+ if ((i === nodes.length - 1) && wrapperElement.nextElementSibling &&
12192
+ wrapperElement.querySelectorAll('br').length === 0 &&
12193
+ wrapperElement.nextElementSibling.nodeName === 'BR') {
12194
+ wrapperElement.appendChild(wrapperElement.nextElementSibling);
12195
+ }
12196
+ }
12197
+ }
12198
+ if (wrapperElement.childNodes.length > 0 && collectionNodes.indexOf(wrapperElement) < 0) {
12199
+ collectionNodes.push(wrapperElement);
12200
+ }
12201
+ }
12005
12202
  }
12006
12203
 
12007
12204
  /**
@@ -12113,7 +12310,8 @@ class Lists {
12113
12310
  startNode.textContent = '';
12114
12311
  }
12115
12312
  const startNodeParent = startNode.parentElement;
12116
- if (isNullOrUndefined(startNodeParent.parentElement.closest('UL')) && isNullOrUndefined(startNodeParent.parentElement.closest('OL'))) {
12313
+ const parentOfCurrentOLUL = startNodeParent.parentElement;
12314
+ if (isNullOrUndefined(parentOfCurrentOLUL.closest('UL')) && isNullOrUndefined(parentOfCurrentOLUL.closest('OL'))) {
12117
12315
  if (!isNullOrUndefined(startNode.nextElementSibling)) {
12118
12316
  const nearBlockNode = this.parent.domNode.blockParentNode(startNode);
12119
12317
  this.parent.nodeCutter.GetSpliceNode(range, nearBlockNode);
@@ -12140,6 +12338,15 @@ class Lists {
12140
12338
  detach(startNode);
12141
12339
  }
12142
12340
  }
12341
+ // To handle the nested enter key press in the list for the first LI element
12342
+ if (!isNullOrUndefined(parentOfCurrentOLUL) && (!isNullOrUndefined(parentOfCurrentOLUL.closest('UL')) || !isNullOrUndefined(parentOfCurrentOLUL.closest('OL'))) &&
12343
+ parentOfCurrentOLUL.nodeName === 'LI' && parentOfCurrentOLUL.style.listStyleType === 'none' &&
12344
+ parentOfCurrentOLUL.textContent === '' && startNode.textContent === '' && startNode === startNodeParent.firstElementChild &&
12345
+ isNullOrUndefined(startNode.nextSibling)) {
12346
+ detach(startNodeParent);
12347
+ parentOfCurrentOLUL.style.removeProperty('list-style-type');
12348
+ e.event.preventDefault();
12349
+ }
12143
12350
  }
12144
12351
  }
12145
12352
  backspaceList(e) {
@@ -12513,7 +12720,7 @@ class Lists {
12513
12720
  this.currentAction = e.subCommand;
12514
12721
  this.currentAction = e.subCommand = this.currentAction === 'NumberFormatList' ? 'OL' : this.currentAction === 'BulletFormatList' ? 'UL' : this.currentAction;
12515
12722
  this.domNode.setMarker(this.saveSelection);
12516
- let listsNodes = this.domNode.blockNodes();
12723
+ let listsNodes = this.domNode.blockNodes(true);
12517
12724
  if (e.enterAction === 'BR') {
12518
12725
  this.setSelectionBRConfig();
12519
12726
  const allSelectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument);
@@ -12627,6 +12834,17 @@ class Lists {
12627
12834
  listEle.innerHTML = '<li><br/></li>';
12628
12835
  elements[i].appendChild(listEle);
12629
12836
  }
12837
+ else if ('LI' !== elements[i].tagName && isNullOrUndefined(item) &&
12838
+ elements[i].nodeName === 'BLOCKQUOTE') {
12839
+ const elemAtt = this.domNode.attributes(elements[i]);
12840
+ const openTag = '<' + type + '>';
12841
+ const closeTag = '</' + type + '>';
12842
+ const newTag = 'li' + elemAtt;
12843
+ const replaceHTML = elements[i].innerHTML;
12844
+ const innerHTML = this.domNode.createTagString(newTag, null, replaceHTML);
12845
+ const collectionString = openTag + innerHTML + closeTag;
12846
+ elements[i].innerHTML = collectionString;
12847
+ }
12630
12848
  else if ('LI' !== elements[i].tagName && isNullOrUndefined(item)) {
12631
12849
  const elemAtt = elements[i].tagName === 'IMG' ? '' : this.domNode.attributes(elements[i]);
12632
12850
  const openTag = '<' + type + '>';
@@ -13413,7 +13631,7 @@ class Formats {
13413
13631
  }
13414
13632
  let save = this.parent.nodeSelection.save(range, this.parent.currentDocument);
13415
13633
  this.parent.domNode.setMarker(save);
13416
- let formatsNodes = this.parent.domNode.blockNodes();
13634
+ let formatsNodes = this.parent.domNode.blockNodes(true);
13417
13635
  if (e.enterAction === 'BR') {
13418
13636
  this.setSelectionBRConfig();
13419
13637
  const allSelectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument);
@@ -13630,6 +13848,10 @@ class InsertHtml {
13630
13848
  const isCollapsed = range.collapsed;
13631
13849
  const nodes = this.getNodeCollection(range, nodeSelection, node);
13632
13850
  const closestParentNode = (node.nodeName.toLowerCase() === 'table') ? this.closestEle(nodes[0].parentNode, editNode) : nodes[0];
13851
+ if (closestParentNode && closestParentNode.nodeName === 'LI' && node.nodeName.toLowerCase() === 'table') {
13852
+ this.insertTableInList(range, node, closestParentNode, nodes[0], nodeCutter);
13853
+ return;
13854
+ }
13633
13855
  if (isExternal || (!isNullOrUndefined(node) && !isNullOrUndefined(node.classList) &&
13634
13856
  node.classList.contains('pasteContent'))) {
13635
13857
  this.pasteInsertHTML(nodes, node, range, nodeSelection, nodeCutter, docElement, isCollapsed, closestParentNode, editNode, enterAction);
@@ -14125,6 +14347,9 @@ class InsertHtml {
14125
14347
  }
14126
14348
  static closestEle(element, editNode) {
14127
14349
  let el = element;
14350
+ if (closest(el, 'li')) {
14351
+ return closest(el, 'li');
14352
+ }
14128
14353
  while (el && el.nodeType === 1) {
14129
14354
  if (el.parentNode === editNode ||
14130
14355
  (!isNullOrUndefined(el.parentNode.tagName) &&
@@ -14135,6 +14360,30 @@ class InsertHtml {
14135
14360
  }
14136
14361
  return null;
14137
14362
  }
14363
+ static insertTableInList(range, insertNode, parentNode, currentNode, nodeCutter) {
14364
+ if (range.collapsed) {
14365
+ const isStart = range.startOffset === 0;
14366
+ const isEnd = range.startContainer.textContent.trimEnd().length === range.startOffset;
14367
+ if (isStart || isEnd) {
14368
+ if (isStart) {
14369
+ InsertMethods.AppendBefore(insertNode, currentNode, false);
14370
+ }
14371
+ else {
14372
+ InsertMethods.AppendBefore(insertNode, currentNode, true);
14373
+ }
14374
+ }
14375
+ else {
14376
+ const preNode = nodeCutter.SplitNode(range, parentNode, true);
14377
+ const sibNode = preNode.previousSibling;
14378
+ sibNode.appendChild(insertNode);
14379
+ }
14380
+ }
14381
+ else {
14382
+ range.deleteContents();
14383
+ parentNode.appendChild(insertNode);
14384
+ }
14385
+ insertNode.classList.add('ignore-table');
14386
+ }
14138
14387
  }
14139
14388
  /**
14140
14389
  * Insert method
@@ -14340,7 +14589,7 @@ class LinkCommand {
14340
14589
  for (let i = 0, j = 0, k = 0; i <= finalinlineNodes.length; i++) {
14341
14590
  if (i === 0) {
14342
14591
  finalinlineNodes[i].parentNode.insertBefore(anchorNodes[j], finalinlineNodes[i].nextSibling);
14343
- if (this.parent.domNode.blockNodes().length === 1) {
14592
+ if (this.parent.domNode.blockNodes().length === 1 && anchorNodes.length === 1) {
14344
14593
  this.parent.nodeSelection.setSelectionNode(this.parent.currentDocument, anchorNodes[j]);
14345
14594
  }
14346
14595
  removeNodes[k] = finalinlineNodes[i];
@@ -14797,21 +15046,18 @@ class ImageCommand {
14797
15046
  const selectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)[0];
14798
15047
  const imgElm = (e.value === 'Replace' || isReplaced) ? e.item.selectParent[0] :
14799
15048
  (Browser.isIE ? selectedNode.previousSibling : selectedNode.previousElementSibling);
14800
- imgElm.addEventListener('load', () => {
14801
- if (e.value !== 'Replace' || !isReplaced) {
14802
- e.callBack({
14803
- requestType: 'Images',
14804
- editorMode: 'HTML',
14805
- event: e.event,
14806
- range: this.parent.nodeSelection.getRange(this.parent.currentDocument),
14807
- elements: [imgElm]
14808
- });
14809
- }
14810
- });
14811
- }
14812
- if (e.value === 'Replace') {
14813
- e.item.subCommand = 'Replace';
14814
- this.callBack(e);
15049
+ let imageInstance = this;
15050
+ const onImageLoadEvent = () => {
15051
+ e.callBack({
15052
+ requestType: (e.value === 'Replace') ? (e.item.subCommand = 'Replace', "Replace") : 'Images',
15053
+ editorMode: 'HTML',
15054
+ event: e.event,
15055
+ range: imageInstance.parent.nodeSelection.getRange(imageInstance.parent.currentDocument),
15056
+ elements: [imgElm]
15057
+ });
15058
+ imgElm.removeEventListener('load', onImageLoadEvent);
15059
+ };
15060
+ imgElm.addEventListener('load', onImageLoadEvent);
14815
15061
  }
14816
15062
  }
14817
15063
  setStyle(imgElement, e, imgReplace) {
@@ -15523,7 +15769,7 @@ class TableCommand {
15523
15769
  e.item.selection.restore();
15524
15770
  InsertHtml.Insert(this.parent.currentDocument, table, this.parent.editableElement);
15525
15771
  e.item.selection.setSelectionText(this.parent.currentDocument, table.querySelector('td'), table.querySelector('td'), 0, 0);
15526
- if (table.nextElementSibling === null) {
15772
+ if (table.nextElementSibling === null && !table.classList.contains('ignore-table')) {
15527
15773
  let insertElem;
15528
15774
  if (e.enterAction === 'DIV') {
15529
15775
  insertElem = createElement('div');
@@ -15538,6 +15784,9 @@ class TableCommand {
15538
15784
  }
15539
15785
  this.insertAfter(insertElem, table);
15540
15786
  }
15787
+ if (table.classList.contains('ignore-table')) {
15788
+ table.classList.remove('ignore-table');
15789
+ }
15541
15790
  table.querySelector('td').classList.add('e-cell-select');
15542
15791
  if (e.callBack) {
15543
15792
  e.callBack({
@@ -15957,10 +16206,22 @@ class TableCommand {
15957
16206
  firstCell.setAttribute('rowspan', (minMaxIndexes.endRow - minMaxIndexes.startRow + 1).toString());
15958
16207
  }
15959
16208
  let totalWidth = 0;
16209
+ let unit;
15960
16210
  for (let j = rowSelectedCells.length - 1; j >= 0; j--) {
15961
- totalWidth = totalWidth + parseFloat(rowSelectedCells[j].style.width);
16211
+ if (!isNullOrUndefined(rowSelectedCells[j].style.width)
16212
+ && rowSelectedCells[j].style.width !== '') {
16213
+ if (!unit) {
16214
+ const match = rowSelectedCells[j].style.width.match(/^([\d.]+)([a-z%]+)$/i);
16215
+ unit = match ? match[2] : '%';
16216
+ }
16217
+ totalWidth = totalWidth + parseFloat(rowSelectedCells[j].style.width);
16218
+ }
16219
+ else {
16220
+ totalWidth = totalWidth + ((rowSelectedCells[j].offsetWidth / this.curTable.offsetWidth) * 100);
16221
+ unit = '%';
16222
+ }
15962
16223
  }
15963
- firstCell.style.width = totalWidth + '%';
16224
+ firstCell.style.width = totalWidth + unit;
15964
16225
  for (let i = 1; i <= selectedCells.length - 1; i++) {
15965
16226
  detach(selectedCells[i]);
15966
16227
  }
@@ -16968,6 +17229,30 @@ class SelectionCommands {
16968
17229
  formatNode.style.textDecoration = 'none';
16969
17230
  child = [formatNode];
16970
17231
  }
17232
+ else if (IsFormatted.inlineTags.indexOf(formatNodeTagName.toLowerCase()) !== -1 && isFontStyle && formatNodeTagName.toLocaleLowerCase() !== 'span') {
17233
+ let fontNodeStyle = formatNode.style;
17234
+ if (fontNodeStyle.color && format === 'fontcolor') {
17235
+ if (formatNode.nodeName === 'A') {
17236
+ fontNodeStyle.color = value;
17237
+ }
17238
+ else {
17239
+ fontNodeStyle.color = '';
17240
+ }
17241
+ }
17242
+ else if (fontNodeStyle.backgroundColor && format === 'backgroundcolor') {
17243
+ fontNodeStyle.backgroundColor = '';
17244
+ }
17245
+ else if (fontNodeStyle.fontSize && format === 'fontsize') {
17246
+ fontNodeStyle.fontSize = '';
17247
+ }
17248
+ else if (fontNodeStyle.fontFamily && format === 'fontname') {
17249
+ fontNodeStyle.fontFamily = '';
17250
+ }
17251
+ if (formatNode.getAttribute("style") === '') {
17252
+ formatNode.removeAttribute("style");
17253
+ }
17254
+ child = [formatNode];
17255
+ }
16971
17256
  else {
16972
17257
  child = InsertMethods.unwrap(formatNode);
16973
17258
  let liElement = nodes[index].parentElement;
@@ -17148,19 +17433,44 @@ class SelectionCommands {
17148
17433
  parentElement = parentElement.parentElement;
17149
17434
  liElement = parentElement;
17150
17435
  }
17151
- if (format === 'fontcolor') {
17436
+ if (format === 'fontcolor' || format === 'fontname') {
17152
17437
  const parentElem = nodes[index].parentElement;
17153
17438
  if (!isNullOrUndefined(parentElem) && parentElem.childNodes) {
17154
17439
  for (let i = 0; i < parentElem.childNodes.length; i++) {
17155
17440
  if (this.concatenateTextExcludingList(nodes, index) === nodes[index].textContent) {
17441
+ let liElement;
17156
17442
  if (parentElem.tagName === 'LI') {
17157
- parentElem.style.color = value;
17443
+ liElement = parentElem;
17444
+ }
17445
+ else if (parentElem.closest('li')) {
17446
+ liElement = parentElem.closest('li');
17447
+ }
17448
+ if (!isNullOrUndefined(liElement)) {
17449
+ switch (format) {
17450
+ case 'fontcolor':
17451
+ liElement.style.color = value;
17452
+ break;
17453
+ case 'fontname':
17454
+ liElement.style.fontFamily = value;
17455
+ break;
17456
+ default:
17457
+ break;
17458
+ }
17158
17459
  }
17159
17460
  }
17160
17461
  // eslint-disable-next-line
17161
17462
  const childElement = parentElem.childNodes[i];
17162
17463
  if (childElement.tagName === 'OL' || childElement.tagName === 'UL') {
17163
- childElement.style.color = 'initial';
17464
+ switch (format) {
17465
+ case 'fontcolor':
17466
+ childElement.style.color = 'initial';
17467
+ break;
17468
+ case 'fontname':
17469
+ childElement.style.fontFamily = 'initial';
17470
+ break;
17471
+ default:
17472
+ break;
17473
+ }
17164
17474
  }
17165
17475
  }
17166
17476
  }
@@ -18588,72 +18898,80 @@ class MsWordPaste {
18588
18898
  }
18589
18899
  styleCorrection(elm, wordPasteStyleConfig) {
18590
18900
  const styleElement = elm.querySelectorAll('style');
18901
+ let styles = [];
18591
18902
  if (styleElement.length > 0) {
18592
- const styles = styleElement[0].innerHTML.match(/[\S ]+\s+{[\s\S]+?}/gi);
18903
+ if (!isNullOrUndefined(styleElement[0].innerHTML.match(/[\S ]+\s+{[\s\S]+?}/gi))) {
18904
+ styles = styleElement[0].innerHTML.match(/[\S ]+\s+{[\s\S]+?}/gi);
18905
+ }
18906
+ else if (styleElement.length > 1) {
18907
+ styles = styleElement[1].innerHTML.match(/[\S ]+\s+{[\s\S]+?}/gi);
18908
+ }
18593
18909
  const styleClassObject = !isNullOrUndefined(styles) ? this.findStyleObject(styles) : null;
18594
- const keys = Object.keys(styleClassObject);
18595
- let values = keys.map((key) => {
18596
- return styleClassObject[`${key}`];
18597
- });
18598
- values = this.removeUnwantedStyle(values, wordPasteStyleConfig);
18599
- this.filterStyles(elm, wordPasteStyleConfig);
18600
- let resultElem;
18601
- let fromClass = false;
18602
- for (let i = 0; i < keys.length; i++) {
18603
- if (keys[i].split('.')[0] === '') {
18604
- resultElem = elm.getElementsByClassName(keys[i].split('.')[1]);
18605
- fromClass = true;
18606
- }
18607
- else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') >= 0) {
18608
- continue;
18609
- }
18610
- else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') < 0) {
18611
- resultElem = elm.getElementsByTagName(keys[i]);
18612
- }
18613
- else {
18614
- resultElem = elm.querySelectorAll(keys[i]);
18615
- }
18616
- for (let j = 0; j < resultElem.length; j++) {
18617
- if (resultElem[j].closest('li') && keys[i] === 'p') {
18910
+ if (!isNullOrUndefined(styleClassObject)) {
18911
+ const keys = Object.keys(styleClassObject);
18912
+ let values = keys.map((key) => {
18913
+ return styleClassObject[`${key}`];
18914
+ });
18915
+ values = this.removeUnwantedStyle(values, wordPasteStyleConfig);
18916
+ this.filterStyles(elm, wordPasteStyleConfig);
18917
+ let resultElem;
18918
+ let fromClass = false;
18919
+ for (let i = 0; i < keys.length; i++) {
18920
+ if (keys[i].split('.')[0] === '') {
18921
+ resultElem = elm.getElementsByClassName(keys[i].split('.')[1]);
18922
+ fromClass = true;
18923
+ }
18924
+ else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') >= 0) {
18618
18925
  continue;
18619
18926
  }
18620
- const styleProperty = resultElem[j].getAttribute('style');
18621
- if (!isNullOrUndefined(styleProperty) && styleProperty.trim() !== '') {
18622
- const valueSplit = values[i].split(';');
18623
- if (!fromClass) {
18624
- for (let k = 0; k < valueSplit.length; k++) {
18625
- if (styleProperty.indexOf(valueSplit[k].split(':')[0]) >= 0) {
18626
- valueSplit.splice(k, 1);
18627
- k--;
18927
+ else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') < 0) {
18928
+ resultElem = elm.getElementsByTagName(keys[i]);
18929
+ }
18930
+ else {
18931
+ resultElem = elm.querySelectorAll(keys[i]);
18932
+ }
18933
+ for (let j = 0; j < resultElem.length; j++) {
18934
+ if (resultElem[j].closest('li') && keys[i] === 'p') {
18935
+ continue;
18936
+ }
18937
+ const styleProperty = resultElem[j].getAttribute('style');
18938
+ if (!isNullOrUndefined(styleProperty) && styleProperty.trim() !== '') {
18939
+ const valueSplit = values[i].split(';');
18940
+ if (!fromClass) {
18941
+ for (let k = 0; k < valueSplit.length; k++) {
18942
+ if (styleProperty.indexOf(valueSplit[k].split(':')[0]) >= 0) {
18943
+ valueSplit.splice(k, 1);
18944
+ k--;
18945
+ }
18628
18946
  }
18629
18947
  }
18948
+ const changedValue = styleProperty + valueSplit.join(';') + ';';
18949
+ resultElem[j].setAttribute('style', changedValue);
18950
+ }
18951
+ else {
18952
+ values[i] = values[i].replace(/text-indent:-(.*?)(?=;|$)/gm, '');
18953
+ resultElem[j].setAttribute('style', values[i]);
18630
18954
  }
18631
- const changedValue = styleProperty + valueSplit.join(';') + ';';
18632
- resultElem[j].setAttribute('style', changedValue);
18633
- }
18634
- else {
18635
- values[i] = values[i].replace(/text-indent:-(.*?)(?=;|$)/gm, '');
18636
- resultElem[j].setAttribute('style', values[i]);
18637
18955
  }
18638
- }
18639
- fromClass = false;
18640
- }
18641
- const listClass = ['MsoListParagraphCxSpFirst', 'MsoListParagraphCxSpMiddle', 'MsoListParagraphCxSpLast'];
18642
- for (let i = 0; i < listClass.length; i++) {
18643
- if (keys.indexOf('li.' + listClass[i]) > -1) {
18644
- const olULElems = elm.querySelectorAll('ol.' + listClass[i] + ', ul.' + listClass[i]);
18645
- for (let j = 0; j < olULElems.length; j++) {
18646
- const styleProperty = olULElems[j].getAttribute('style');
18647
- if (!isNullOrUndefined(styleProperty) && styleProperty.trim() !== '' && olULElems[j].style.marginLeft !== '') {
18648
- const valueSplit = values[keys.indexOf('li.' + listClass[i])].split(';');
18649
- for (let k = 0; k < valueSplit.length; k++) {
18650
- if ('margin-left'.indexOf(valueSplit[k].split(':')[0]) >= 0) {
18651
- if (!isNullOrUndefined(valueSplit[k].split(':')[1]) &&
18652
- valueSplit[k].split(':')[1].indexOf('in') >= 0 &&
18653
- olULElems[j].style.marginLeft.indexOf('in') >= 0) {
18654
- const classStyle = parseFloat(valueSplit[k].split(':')[1].split('in')[0]);
18655
- const inlineStyle = parseFloat(olULElems[j].style.marginLeft.split('in')[0]);
18656
- olULElems[j].style.marginLeft = (inlineStyle - classStyle) + 'in';
18956
+ fromClass = false;
18957
+ }
18958
+ const listClass = ['MsoListParagraphCxSpFirst', 'MsoListParagraphCxSpMiddle', 'MsoListParagraphCxSpLast'];
18959
+ for (let i = 0; i < listClass.length; i++) {
18960
+ if (keys.indexOf('li.' + listClass[i]) > -1) {
18961
+ const olULElems = elm.querySelectorAll('ol.' + listClass[i] + ', ul.' + listClass[i]);
18962
+ for (let j = 0; j < olULElems.length; j++) {
18963
+ const styleProperty = olULElems[j].getAttribute('style');
18964
+ if (!isNullOrUndefined(styleProperty) && styleProperty.trim() !== '' && olULElems[j].style.marginLeft !== '') {
18965
+ const valueSplit = values[keys.indexOf('li.' + listClass[i])].split(';');
18966
+ for (let k = 0; k < valueSplit.length; k++) {
18967
+ if ('margin-left'.indexOf(valueSplit[k].split(':')[0]) >= 0) {
18968
+ if (!isNullOrUndefined(valueSplit[k].split(':')[1]) &&
18969
+ valueSplit[k].split(':')[1].indexOf('in') >= 0 &&
18970
+ olULElems[j].style.marginLeft.indexOf('in') >= 0) {
18971
+ const classStyle = parseFloat(valueSplit[k].split(':')[1].split('in')[0]);
18972
+ const inlineStyle = parseFloat(olULElems[j].style.marginLeft.split('in')[0]);
18973
+ olULElems[j].style.marginLeft = (inlineStyle - classStyle) + 'in';
18974
+ }
18657
18975
  }
18658
18976
  }
18659
18977
  }
@@ -19224,7 +19542,7 @@ class ToolbarStatus {
19224
19542
  * get method
19225
19543
  *
19226
19544
  * @param {Document} docElement - specifies the document element
19227
- * @param {Node} targetNode - specifies the target node
19545
+ * @param {Node} rootNode - specifies the content editable element
19228
19546
  * @param {string[]} formatNode - specifies the format node
19229
19547
  * @param {string[]} fontSize - specifies the font size
19230
19548
  * @param {string[]} fontName - specifies the font name.
@@ -19233,7 +19551,7 @@ class ToolbarStatus {
19233
19551
  * @hidden
19234
19552
  * @deprecated
19235
19553
  */
19236
- static get(docElement, targetNode, formatNode, fontSize, fontName, documentNode) {
19554
+ static get(docElement, rootNode, formatNode, fontSize, fontName, documentNode) {
19237
19555
  let formatCollection = JSON.parse(JSON.stringify(statusCollection));
19238
19556
  const nodeCollection = JSON.parse(JSON.stringify(statusCollection));
19239
19557
  const nodeSelection = new NodeSelection();
@@ -19263,7 +19581,7 @@ class ToolbarStatus {
19263
19581
  }
19264
19582
  for (let index = 0; index < nodes.length; index++) {
19265
19583
  // eslint-disable-next-line max-len
19266
- formatCollection = this.getFormatParent(docElement, formatCollection, nodes[index], targetNode, formatNode, fontSize, fontName);
19584
+ formatCollection = this.getFormatParent(docElement, formatCollection, nodes[index], rootNode, formatNode, fontSize, fontName);
19267
19585
  if ((index === 0 && formatCollection.bold) || !formatCollection.bold) {
19268
19586
  nodeCollection.bold = formatCollection.bold;
19269
19587
  }
@@ -19338,16 +19656,24 @@ class ToolbarStatus {
19338
19656
  return node;
19339
19657
  }
19340
19658
  static getFormatParent(docElement, formatCollection, node, targetNode, formatNode, fontSize, fontName) {
19659
+ let isListUpdated = false;
19660
+ let isComplexListUpdated = false;
19341
19661
  if (targetNode.contains(node) ||
19342
19662
  (node.nodeType === 3 && targetNode.nodeType !== 3 && targetNode.contains(node.parentNode))) {
19343
19663
  do {
19344
- formatCollection = this.isFormattedNode(docElement, formatCollection, node, formatNode, fontSize, fontName);
19664
+ formatCollection = this.isFormattedNode(docElement, formatCollection, node, isListUpdated, isComplexListUpdated, formatNode, fontSize, fontName);
19665
+ if (formatCollection.orderedlist || formatCollection.unorderedlist) {
19666
+ isListUpdated = true;
19667
+ }
19668
+ if (formatCollection.bulletFormatList || formatCollection.numberFormatList) {
19669
+ isComplexListUpdated = true;
19670
+ }
19345
19671
  node = node.parentNode;
19346
19672
  } while (node && (node !== targetNode));
19347
19673
  }
19348
19674
  return formatCollection;
19349
19675
  }
19350
- static isFormattedNode(docElement, formatCollection, node, formatNode, fontSize, fontName) {
19676
+ static isFormattedNode(docElement, formatCollection, node, isListUpdated, isComplexListUpdated, formatNode, fontSize, fontName) {
19351
19677
  if (!formatCollection.bold) {
19352
19678
  formatCollection.bold = IsFormatted.isBold(node);
19353
19679
  }
@@ -19378,10 +19704,10 @@ class ToolbarStatus {
19378
19704
  if (!formatCollection.backgroundcolor) {
19379
19705
  formatCollection.backgroundcolor = this.isBackgroundColor(node);
19380
19706
  }
19381
- if (!formatCollection.orderedlist) {
19707
+ if (!formatCollection.orderedlist && !isListUpdated) {
19382
19708
  formatCollection.orderedlist = this.isOrderedList(node);
19383
19709
  }
19384
- if (!formatCollection.unorderedlist) {
19710
+ if (!formatCollection.unorderedlist && !isListUpdated) {
19385
19711
  formatCollection.unorderedlist = this.isUnorderedList(node);
19386
19712
  }
19387
19713
  if (!formatCollection.alignments) {
@@ -19396,10 +19722,10 @@ class ToolbarStatus {
19396
19722
  if (!formatCollection.createlink) {
19397
19723
  formatCollection.createlink = this.isLink(node);
19398
19724
  }
19399
- if (!formatCollection.numberFormatList) {
19725
+ if (!formatCollection.numberFormatList && !isComplexListUpdated) {
19400
19726
  formatCollection.numberFormatList = this.isNumberFormatList(node);
19401
19727
  }
19402
- if (!formatCollection.bulletFormatList) {
19728
+ if (!formatCollection.bulletFormatList && !isComplexListUpdated) {
19403
19729
  formatCollection.bulletFormatList = this.isBulletFormatList(node);
19404
19730
  }
19405
19731
  return formatCollection;
@@ -20486,12 +20812,12 @@ class EditorManager {
20486
20812
  }
20487
20813
  }
20488
20814
  getParentBlockNode(node) {
20489
- let treeWalker = this.currentDocument.createTreeWalker(this.editableElement, // root
20815
+ const treeWalker = this.currentDocument.createTreeWalker(this.editableElement, // root
20490
20816
  NodeFilter.SHOW_ELEMENT, // whatToShow
20491
20817
  {
20492
20818
  acceptNode: function (currentNode) {
20493
20819
  // Check if the node is a block element
20494
- let displayStyle = window.getComputedStyle(currentNode).display;
20820
+ const displayStyle = window.getComputedStyle(currentNode).display;
20495
20821
  if (displayStyle.indexOf('inline') < 0) {
20496
20822
  return NodeFilter.FILTER_ACCEPT;
20497
20823
  }
@@ -20501,11 +20827,11 @@ class EditorManager {
20501
20827
  }
20502
20828
  });
20503
20829
  treeWalker.currentNode = node;
20504
- let blockParent = treeWalker.parentNode();
20830
+ const blockParent = treeWalker.parentNode();
20505
20831
  return blockParent;
20506
20832
  }
20507
20833
  getLastTextNode(node) {
20508
- let treeWalker = this.currentDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT, null);
20834
+ const treeWalker = this.currentDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT, null);
20509
20835
  let lastTextNode = null;
20510
20836
  let currentNode = treeWalker.nextNode();
20511
20837
  while (currentNode) {
@@ -20515,8 +20841,8 @@ class EditorManager {
20515
20841
  return lastTextNode;
20516
20842
  }
20517
20843
  getFirstTextNode(node) {
20518
- let treeWalker = this.currentDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT, null);
20519
- let firstTextNode = treeWalker.nextNode();
20844
+ const treeWalker = this.currentDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT, null);
20845
+ const firstTextNode = treeWalker.nextNode();
20520
20846
  return firstTextNode;
20521
20847
  }
20522
20848
  }
@@ -20752,8 +21078,12 @@ const IFRAMEHEADER = `
20752
21078
  .e-mob-rte.e-mob-span span.e-rte-imageboxmark, .e-mob-rte.e-mob-span span.e-rte-videoboxmark { background: #4a90e2; border: 1px solid #fff; }
20753
21079
  .e-rte-content .e-content img.e-resize, .e-rte-content .e-content video.e-resize { z-index: 1000; }
20754
21080
  .e-img-caption .e-img-inner { outline: 0; }
21081
+ .e-rte-img-caption.e-imgleft .e-img-inner { float: left; text-align: left; }
21082
+ .e-rte-img-caption.e-imgright .e-img-inner { float: right; text-align: right; }
21083
+ .e-rte-img-caption.e-imgleft .e-img-wrap, .e-rte-img-caption.e-imgright .e-img-wrap { display: contents; }
20755
21084
  .e-img-caption a:focus-visible { outline: none; }
20756
- .e-img-caption .e-rte-image.e-imgright, .e-img-caption .e-rte-image.e-imgleft { float: none; margin: 0;}
21085
+ .e-rte-img-caption .e-rte-image.e-imgright { margin-left: auto; margin-right: 0; }
21086
+ .e-rte-img-caption .e-rte-image.e-imgleft { margin: 0; }
20757
21087
  body{box-sizing: border-box;min-height: 100px;outline: 0 solid transparent;
20758
21088
  overflow-x: auto;padding: 16px;position: relative;text-align: inherit;z-index: 2;}
20759
21089
  p{margin: 0 0 10px;margin-bottom: 10px;}
@@ -20801,6 +21131,7 @@ const IFRAMEHEADER = `
20801
21131
  .e-table-rhelper { background-color: #4a90e2;}
20802
21132
  .e-rtl { direction: rtl; }
20803
21133
  .e-rte-placeholder::before { content: attr(placeholder); opacity: 0.54; overflow: hidden; padding-top: 16px; position: absolute; text-align: start; top: 0; z-index: 1; }
21134
+ li ol, li ul { margin-block-start: 10px;}
20804
21135
  </style>
20805
21136
  </head>`;
20806
21137
  /**
@@ -20828,6 +21159,7 @@ class IframeContentRender extends ContentRender {
20828
21159
  styles: 'display:block;',
20829
21160
  attrs: { 'srcdoc': iFrameContent }
20830
21161
  });
21162
+ iframe.setAttribute("role", "none");
20831
21163
  this.setPanel(iframe);
20832
21164
  rteObj.element.appendChild(iframe);
20833
21165
  iframe.contentDocument.body.id = this.parent.getID() + '_rte-edit-view';
@@ -21528,7 +21860,11 @@ class HtmlEditor {
21528
21860
  (!isNullOrUndefined(this.deleteRangeElement.nextElementSibling) && this.deleteRangeElement.nextElementSibling.tagName === 'TABLE'))) {
21529
21861
  return;
21530
21862
  }
21531
- if (this.getCaretIndex(currentRange, this.deleteRangeElement) === this.deleteRangeElement.textContent.length) {
21863
+ let isImgWithEmptyBlockNode = false;
21864
+ if (this.deleteRangeElement.querySelectorAll('img').length > 0 && this.deleteRangeElement.textContent.trim() === '') {
21865
+ isImgWithEmptyBlockNode = true;
21866
+ }
21867
+ if (this.getCaretIndex(currentRange, this.deleteRangeElement) === this.deleteRangeElement.textContent.length && !isImgWithEmptyBlockNode) {
21532
21868
  if (!isNullOrUndefined(liElement)) {
21533
21869
  if (isLiElement || !isNullOrUndefined(liElement.nextElementSibling)) {
21534
21870
  this.deleteOldRangeElement = this.getRangeElement(liElement.nextElementSibling);
@@ -21720,36 +22056,14 @@ class HtmlEditor {
21720
22056
  }, e, value);
21721
22057
  }
21722
22058
  }
21723
- mouseOutHandler() {
21724
- if (!isNullOrUndefined(this.tooltipTargetEle)) {
21725
- this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));
21726
- }
21727
- else {
21728
- const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
21729
- this.parent.contentModule.getDocument();
21730
- this.tooltipTargetEle = currentDocument.querySelector('[data-title]');
21731
- this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));
21732
- }
21733
- this.tooltipTargetEle.removeAttribute('data-title');
21734
- EventHandler.remove(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler);
21735
- }
21736
22059
  onToolbarClick(args) {
21737
22060
  let save;
21738
22061
  let selectNodeEle;
21739
22062
  let selectParentEle;
21740
22063
  const item = args.item;
21741
22064
  const closestElement = closest(args.originalEvent.target, '.e-rte-quick-popup');
21742
- const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
21743
- this.parent.contentModule.getDocument();
21744
- this.tooltipTargetEle = closest(args.originalEvent.target, '[data-tooltip-id]');
21745
- if (!isNullOrUndefined(this.tooltipTargetEle) && this.parent.showTooltip && !isNullOrUndefined(currentDocument.querySelector('.e-tooltip-wrap'))) {
21746
- this.parent.notify(destroyTooltip, { args: event });
21747
- if (!this.tooltipTargetEle.closest('.e-rte-quick-popup')) {
21748
- this.tooltipTargetEle.setAttribute('data-title', this.tooltipTargetEle.getAttribute('title'));
21749
- this.tooltipTargetEle.removeAttribute('title');
21750
- EventHandler.add(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler, this);
21751
- }
21752
- }
22065
+ let target = args.originalEvent.target;
22066
+ this.parent.notify(closeTooltip, { target: target });
21753
22067
  if (item.command !== 'FormatPainter') {
21754
22068
  if (closestElement && !closestElement.classList.contains('e-rte-inline-popup') && !closestElement.classList.contains('e-rte-text-popup')) {
21755
22069
  if (!(item.subCommand === 'SourceCode' || item.subCommand === 'Preview' ||
@@ -22665,6 +22979,9 @@ class PasteCleanup {
22665
22979
  this.setImageProperties(allImg[i]);
22666
22980
  }
22667
22981
  this.addTempClass(clipBoardElem);
22982
+ if (clipBoardElem.querySelectorAll('picture').length > 0) {
22983
+ this.processPictureElement(clipBoardElem);
22984
+ }
22668
22985
  if (clipBoardElem.textContent !== '' || !isNullOrUndefined(clipBoardElem.querySelector('img')) ||
22669
22986
  !isNullOrUndefined(clipBoardElem.querySelector('table'))) {
22670
22987
  const tempWrapperElem = this.parent.createElement('div');
@@ -23122,6 +23439,26 @@ class PasteCleanup {
23122
23439
  }
23123
23440
  return null;
23124
23441
  }
23442
+ processPictureElement(clipBoardElem) {
23443
+ const pictureElems = clipBoardElem.querySelectorAll('picture');
23444
+ for (let i = 0; i < pictureElems.length; i++) {
23445
+ const imgElem = pictureElems[i].querySelector('img');
23446
+ const sourceElems = pictureElems[i].querySelectorAll('source');
23447
+ if (imgElem && imgElem.getAttribute('src')) {
23448
+ const srcValue = imgElem.getAttribute('src');
23449
+ const url = new URL(srcValue);
23450
+ for (let j = 0; j < sourceElems.length; j++) {
23451
+ let srcset = sourceElems[j].getAttribute('srcset');
23452
+ if (srcset) {
23453
+ if (srcset.indexOf('http') === -1) {
23454
+ const fullPath = url.origin + srcset;
23455
+ sourceElems[j].setAttribute('srcset', fullPath);
23456
+ }
23457
+ }
23458
+ }
23459
+ }
23460
+ }
23461
+ }
23125
23462
  /**
23126
23463
  * For internal use only - Get the module name.
23127
23464
  *
@@ -23201,7 +23538,8 @@ class Resize {
23201
23538
  this.parent.element.style.width = (!this.parent.enableRtl) ? eventType.clientX - boundRect.left + 'px' : boundRect.right - eventType.clientX + 'px';
23202
23539
  }
23203
23540
  if (!this.parent.toolbarSettings.enable) {
23204
- this.parent.setContentHeight('', false);
23541
+ const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
23542
+ this.parent.setContentHeight('Resize', isExpand);
23205
23543
  }
23206
23544
  this.parent.refreshUI();
23207
23545
  }
@@ -23552,7 +23890,7 @@ class FullScreen {
23552
23890
  this.parent.element.classList.add(CLS_FULL_SCREEN);
23553
23891
  this.toggleParentOverflow(true);
23554
23892
  const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
23555
- this.parent.setContentHeight(null, isExpand);
23893
+ this.parent.setContentHeight('Maximize', isExpand);
23556
23894
  if (this.parent.toolbarModule) {
23557
23895
  if (!this.parent.getBaseToolbarObject().toolbarObj.items[0].properties) {
23558
23896
  this.parent.getBaseToolbarObject().toolbarObj.removeItems(0);
@@ -23603,7 +23941,7 @@ class FullScreen {
23603
23941
  removeClass([elem[i]], ['e-rte-overflow']);
23604
23942
  }
23605
23943
  const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
23606
- this.parent.setContentHeight(null, isExpand);
23944
+ this.parent.setContentHeight('Minimize', isExpand);
23607
23945
  if (this.parent.toolbarModule) {
23608
23946
  if (!this.parent.getBaseToolbarObject().toolbarObj.items[0].properties) {
23609
23947
  this.parent.getBaseToolbarObject().toolbarObj.removeItems(0);
@@ -23949,7 +24287,7 @@ class EmojiPicker {
23949
24287
  }
23950
24288
  this.popDiv = this.parent.createElement('div', { className: 'e-rte-emojipicker-popup', id: this.parent.getID() + '_emojiPicker' });
23951
24289
  if (!isNullOrUndefined(this.parent.getToolbar()) && !this.parent.inlineMode.enable) {
23952
- this.parent.getToolbar().appendChild(this.popDiv);
24290
+ this.parent.getToolbar().parentElement.appendChild(this.popDiv);
23953
24291
  }
23954
24292
  else if (this.parent.inlineMode.enable) {
23955
24293
  this.parent.element.appendChild(this.popDiv);
@@ -25378,7 +25716,6 @@ class Image$1 {
25378
25716
  this.isAllowedTypes = true;
25379
25717
  this.pageX = null;
25380
25718
  this.pageY = null;
25381
- this.mouseX = null;
25382
25719
  this.deletedImg = [];
25383
25720
  this.parent = parent;
25384
25721
  this.rteID = parent.element.id;
@@ -25536,11 +25873,6 @@ class Image$1 {
25536
25873
  }
25537
25874
  const args = { event: e, requestType: 'images' };
25538
25875
  this.parent.trigger(resizeStop, args);
25539
- /* eslint-disable */
25540
- let pageX = this.getPointX(e);
25541
- let pageY = (this.parent.iframeSettings.enable) ? window.pageYOffset +
25542
- this.parent.element.getBoundingClientRect().top + e.clientY : e.pageY;
25543
- /* eslint-enable */
25544
25876
  this.parent.formatter.editorManager.observer.on(checkUndo, this.undoStack, this);
25545
25877
  this.parent.formatter.saveData();
25546
25878
  }
@@ -25570,17 +25902,15 @@ class Image$1 {
25570
25902
  if (this.quickToolObj) {
25571
25903
  this.quickToolObj.imageQTBar.hidePopup();
25572
25904
  }
25573
- if (target.classList.contains('e-rte-topLeft')) {
25574
- this.resizeBtnStat.topLeft = true;
25575
- }
25576
- if (target.classList.contains('e-rte-topRight')) {
25577
- this.resizeBtnStat.topRight = true;
25578
- }
25579
- if (target.classList.contains('e-rte-botLeft')) {
25580
- this.resizeBtnStat.botLeft = true;
25581
- }
25582
- if (target.classList.contains('e-rte-botRight')) {
25583
- this.resizeBtnStat.botRight = true;
25905
+ const handlers = ['topLeft', 'topRight', 'botLeft', 'botRight'];
25906
+ for (let i = 0; i < handlers.length; i++) {
25907
+ const handler = handlers[i];
25908
+ if (target.classList.contains('e-rte-' + handler)) {
25909
+ this.resizeBtnStat[handler] = true;
25910
+ this.currentResizeHandler = handler;
25911
+ this.aspectRatio = this.findAspectRatio(this.imgEle);
25912
+ break; // Exit the loop once a match is found
25913
+ }
25584
25914
  }
25585
25915
  if (Browser.isDevice && this.contentModule.getEditPanel().contains(this.imgResizeDiv) &&
25586
25916
  !this.imgResizeDiv.classList.contains('e-mob-span')) {
@@ -25711,89 +26041,80 @@ class Image$1 {
25711
26041
  };
25712
26042
  }
25713
26043
  }
25714
- setAspectRatio(img, expectedX, expectedY, e) {
26044
+ setAspectRatio(img, expectedX, expectedY) {
25715
26045
  if (isNullOrUndefined(img.width)) {
25716
26046
  return;
25717
26047
  }
25718
- // eslint-disable-next-line security/detect-unsafe-regex
25719
- const width = img.style.width !== '' ? img.style.width.match(/^\d+(\.\d*)?%$/g) ? parseFloat(img.style.width) :
25720
- parseInt(img.style.width, 10) : img.width;
25721
- const height = img.style.height !== '' ? parseInt(img.style.height, 10) : img.height;
25722
- if (width > height) {
25723
- img.style.minWidth = this.parent.insertImageSettings.minWidth === 0 ? '20px' : formatUnit(this.parent.insertImageSettings.minWidth);
25724
- if (this.parent.insertImageSettings.resizeByPercent) {
25725
- if (parseInt('' + img.getBoundingClientRect().width + '', 10) !== 0 && parseInt('' + width + '', 10) !== 0) {
25726
- const original = img.offsetWidth + this.mouseX;
25727
- const finalWidthByPerc = (original / img.offsetWidth) * (parseFloat(img.style.width).toString() === 'NaN' ? (img.offsetWidth / (parseFloat(getComputedStyle(this.parent.element).width)) * 100) : parseFloat(img.style.width));
25728
- img.style.width = ((finalWidthByPerc > 3) ? finalWidthByPerc : 3) + '%';
26048
+ const width = img.width;
26049
+ const height = img.height;
26050
+ const sameHeightWidth = (width === height);
26051
+ const factor = this.parent.insertImageSettings.resizeByPercent ? '%' : 'px';
26052
+ const emptyStyleDimension = (img.style.width === '' && img.style.height === '');
26053
+ if (!sameHeightWidth && !emptyStyleDimension) {
26054
+ if (img.style.width !== '' && img.style.height !== '') {
26055
+ if (this.parent.insertImageSettings.resizeByPercent) {
26056
+ this.setImageWidth(img, expectedX, factor);
26057
+ this.removeImageHeight(img);
25729
26058
  }
25730
26059
  else {
25731
- img.style.width = this.pixToPerc((width / height * expectedY), (img.previousElementSibling || img.parentElement)) + '%';
26060
+ this.setImageWidth(img, expectedX, factor);
26061
+ this.setImageHeight(img, expectedY, factor);
25732
26062
  }
25733
- img.style.height = null;
25734
- img.removeAttribute('height');
25735
- }
25736
- else if (img.style.width === '' && img.style.height !== '') {
25737
- img.style.height = expectedY + 'px';
25738
- }
25739
- else if (img.style.width !== '' && img.style.height === '') {
25740
- const currentWidth = ((width / height * expectedY) + width / height) <
25741
- (this.parent.inputElement.getBoundingClientRect().right - 32) ?
25742
- ((width / height * expectedY) + width / height) : (this.parent.inputElement.getBoundingClientRect().right - 32);
25743
- img.style.width = currentWidth.toString() + 'px';
25744
- img.style.height = expectedY + 'px';
25745
26063
  }
25746
26064
  else if (img.style.width !== '') {
25747
- const currentWidth = (width / height * expectedY) < (this.parent.inputElement.getBoundingClientRect().right - 32) ?
25748
- (width / height * expectedY) : (this.parent.inputElement.getBoundingClientRect().right - 32);
25749
- img.style.width = currentWidth + 'px';
25750
- img.style.height = expectedY + 'px';
25751
- }
25752
- else {
25753
- if (this.parent.iframeSettings.enable) {
25754
- img.setAttribute('width', (img.width + this.mouseX).toString());
26065
+ if (this.parent.insertImageSettings.resizeByPercent) {
26066
+ this.setImageWidth(img, expectedX, factor);
26067
+ this.removeImageHeight(img);
25755
26068
  }
25756
26069
  else {
25757
- const currentWidth = img.offsetWidth === 0 ? img.width + this.mouseX + parseInt(img.style.outlineWidth.split('p')[0], 10) : img.offsetWidth + this.mouseX;
25758
- img.setAttribute('width', (currentWidth).toString());
26070
+ this.setImageWidth(img, expectedX, factor);
25759
26071
  }
25760
26072
  }
25761
- }
25762
- else if (height > width) {
25763
- if (this.parent.insertImageSettings.resizeByPercent) {
25764
- if (parseInt('' + img.getBoundingClientRect().width + '', 10) !== 0 && parseInt('' + width + '', 10) !== 0) {
25765
- const original = img.offsetWidth + this.mouseX;
25766
- const finalWidthByPerc = (original / img.offsetWidth) * (parseFloat(img.style.width).toString() === 'NaN' ?
25767
- (img.offsetWidth / (parseFloat(getComputedStyle(this.parent.element).width)) * 100) :
25768
- parseFloat(img.style.width));
25769
- img.style.width = ((finalWidthByPerc > 3) ? finalWidthByPerc : 3) + '%';
26073
+ else if (img.style.height !== '') {
26074
+ if (this.parent.insertImageSettings.resizeByPercent) {
26075
+ this.setImageWidth(img, expectedX, factor);
26076
+ this.removeImageHeight(img);
25770
26077
  }
25771
26078
  else {
25772
- img.style.width = this.pixToPerc((expectedX / height * expectedY), (img.previousElementSibling || img.parentElement)) + '%';
26079
+ this.setImageHeight(img, expectedY, factor);
25773
26080
  }
25774
- img.style.height = null;
25775
- img.removeAttribute('height');
25776
- }
25777
- else if (img.style.width !== '') {
25778
- img.style.width = expectedX + 'px';
25779
- img.style.height = (height / width * expectedX) + 'px';
25780
- }
25781
- else {
25782
- img.setAttribute('width', this.resizeBtnStat.botRight ? (this.getPointX(e.event) - img.getBoundingClientRect().left).toString() : expectedX.toString());
25783
26081
  }
25784
26082
  }
25785
26083
  else {
26084
+ this.setImageWidth(img, expectedX, factor);
25786
26085
  if (this.parent.insertImageSettings.resizeByPercent) {
25787
- img.style.width = this.pixToPerc(expectedX, (img.previousElementSibling || img.parentElement)) + '%';
25788
- img.style.height = null;
25789
- img.removeAttribute('height');
26086
+ this.removeImageHeight(img);
25790
26087
  }
25791
26088
  else {
25792
- img.style.width = ((expectedX >= 15) ? expectedX : 15) + 'px';
25793
- img.style.height = ((expectedX >= 15) ? expectedX : 15) + 'px';
26089
+ this.setImageHeight(img, expectedY, factor);
25794
26090
  }
25795
26091
  }
25796
26092
  }
26093
+ setImageWidth(img, value, suffix) {
26094
+ img.style.width = this.getImageDimension(value, img) + suffix;
26095
+ if (!this.parent.insertImageSettings.resizeByPercent) {
26096
+ img.setAttribute('width', value.toString());
26097
+ }
26098
+ }
26099
+ setImageHeight(img, value, suffix) {
26100
+ img.style.height = this.getImageDimension(value, img) + suffix;
26101
+ if (!this.parent.insertImageSettings.resizeByPercent) {
26102
+ img.setAttribute('height', value.toString());
26103
+ }
26104
+ }
26105
+ removeImageHeight(img) {
26106
+ img.style.height = '';
26107
+ img.removeAttribute('height');
26108
+ }
26109
+ getImageDimension(value, img) {
26110
+ if (this.parent.insertImageSettings.resizeByPercent) {
26111
+ const rootElem = img.parentElement || img.previousElementSibling;
26112
+ return this.pixToPerc(value, rootElem);
26113
+ }
26114
+ else {
26115
+ return value;
26116
+ }
26117
+ }
25797
26118
  pixToPerc(expected, parentEle) {
25798
26119
  return expected / parseFloat(getComputedStyle(parentEle).width) * 100;
25799
26120
  }
@@ -25815,7 +26136,7 @@ class Image$1 {
25815
26136
  return;
25816
26137
  }
25817
26138
  this.imgEle.parentElement.style.cursor = 'pointer';
25818
- this.setAspectRatio(this.imgEle, parseInt(width, 10), parseInt(height, 10), args);
26139
+ this.setAspectRatio(this.imgEle, parseInt(width, 10), parseInt(height, 10));
25819
26140
  this.resizeImgDupPos(this.imgEle);
25820
26141
  this.imgResizePos(this.imgEle, this.imgResizeDiv);
25821
26142
  }
@@ -25826,35 +26147,37 @@ class Image$1 {
25826
26147
  this.cancelResizeAction();
25827
26148
  return;
25828
26149
  }
25829
- if (this.imgEle.offsetWidth >= this.parent.getInsertImgMaxWidth()) {
25830
- this.imgEle.style.maxHeight = this.imgEle.offsetHeight + 'px';
25831
- }
25832
- else if (isNullOrUndefined(this.parent.insertImageSettings.maxHeight)) {
25833
- this.imgEle.style.maxHeight = '';
25834
- }
25835
- this.imgEle.style.maxWidth = (closest(this.imgEle, 'ol,ul') != null ? this.parent.getInsertImgMaxWidth() - parseInt((getComputedStyle(closest(this.imgEle, 'ol,ul')).paddingLeft), 0) : this.parent.getInsertImgMaxWidth()) + 'px';
25836
- const pageX = this.getPointX(e);
25837
- const pageY = this.getPointY(e);
25838
- const mouseX = (this.resizeBtnStat.botLeft || this.resizeBtnStat.topLeft) ? -(pageX - this.pageX) : (pageX - this.pageX);
25839
- const mouseY = (this.resizeBtnStat.botLeft || this.resizeBtnStat.topLeft) ? -(pageY - this.pageY) : (pageY - this.pageY);
25840
- const width = parseInt(this.imgDupPos.width, 10) + mouseX;
25841
- const height = parseInt(this.imgDupPos.height, 10) + mouseY;
25842
- this.mouseX = mouseX;
25843
- this.pageX = pageX;
25844
- this.pageY = pageY;
25845
- if (this.resizeBtnStat.botRight) {
25846
- this.imgDupMouseMove(width + 'px', height + 'px', e);
25847
- }
25848
- else if (this.resizeBtnStat.botLeft) {
25849
- this.imgDupMouseMove(width + 'px', height + 'px', e);
25850
- }
25851
- else if (this.resizeBtnStat.topRight) {
25852
- this.imgDupMouseMove(width + 'px', height + 'px', e);
25853
- }
25854
- else if (this.resizeBtnStat.topLeft) {
26150
+ if (this.resizeBtnStat.botRight || this.resizeBtnStat.botLeft || this.resizeBtnStat.topRight || this.resizeBtnStat.topLeft) {
26151
+ const pageX = this.getPointX(e);
26152
+ const pageY = this.getPointY(e);
26153
+ const resizeFactor = this.getResizeFactor(this.currentResizeHandler);
26154
+ const diffX = (pageX - this.pageX);
26155
+ const diffY = (pageY - this.pageY);
26156
+ const currentWidth = this.imgEle.clientWidth;
26157
+ const currentHeight = this.imgEle.clientHeight;
26158
+ let width = diffX * resizeFactor[0] + currentWidth;
26159
+ let height = diffY * resizeFactor[1] + currentHeight;
26160
+ width = (width < 16) ? 16 : width;
26161
+ height = (height < 16) ? 16 : height;
26162
+ if (Math.abs(diffX) > Math.abs(diffY)) {
26163
+ height = Math.round(width / this.aspectRatio);
26164
+ width = Math.round(height * this.aspectRatio);
26165
+ }
26166
+ else {
26167
+ width = Math.round(height * this.aspectRatio);
26168
+ height = Math.round(width / this.aspectRatio);
26169
+ }
26170
+ this.pageX = pageX;
26171
+ this.pageY = pageY;
25855
26172
  this.imgDupMouseMove(width + 'px', height + 'px', e);
25856
26173
  }
25857
26174
  }
26175
+ getResizeFactor(value) {
26176
+ return imageResizeFactor[value];
26177
+ }
26178
+ findAspectRatio(image) {
26179
+ return image.clientWidth / image.clientHeight;
26180
+ }
25858
26181
  cancelResizeAction() {
25859
26182
  EventHandler.remove(this.contentModule.getDocument(), Browser.touchMoveEvent, this.resizing);
25860
26183
  EventHandler.remove(this.contentModule.getDocument(), Browser.touchEndEvent, this.resizeEnd);
@@ -25864,6 +26187,8 @@ class Image$1 {
25864
26187
  this.imgResizeDiv = null;
25865
26188
  this.pageX = null;
25866
26189
  this.pageY = null;
26190
+ this.currentResizeHandler = null;
26191
+ this.aspectRatio = null;
25867
26192
  }
25868
26193
  }
25869
26194
  resizeImgDupPos(e) {
@@ -25874,6 +26199,8 @@ class Image$1 {
25874
26199
  };
25875
26200
  }
25876
26201
  resizeBtnInit() {
26202
+ this.aspectRatio = null;
26203
+ this.currentResizeHandler = null;
25877
26204
  return this.resizeBtnStat = { botLeft: false, botRight: false, topRight: false, topLeft: false };
25878
26205
  }
25879
26206
  onToolbarAction(args) {
@@ -26373,7 +26700,7 @@ class Image$1 {
26373
26700
  this.checkBoxObj.createElement = this.parent.createElement;
26374
26701
  this.checkBoxObj.appendTo(linkTarget);
26375
26702
  let target = this.checkBoxObj.checked ? '_blank' : null;
26376
- let imageLabel = this.checkBoxObj.checked ? this.i10n.getConstant('imageLinkAriaLabel') : null;
26703
+ const imageLabel = this.checkBoxObj.checked ? this.i10n.getConstant('imageLinkAriaLabel') : null;
26377
26704
  const linkUpdate = this.i10n.getConstant('dialogUpdate');
26378
26705
  const linkargs = {
26379
26706
  args: e.args,
@@ -26381,7 +26708,6 @@ class Image$1 {
26381
26708
  selectNode: e.selectNode, selectParent: e.selectParent, link: inputLink, target: target, ariaLabel: imageLabel
26382
26709
  };
26383
26710
  this.dialogObj.setProperties({
26384
- height: 'inherit',
26385
26711
  width: '290px',
26386
26712
  header: this.parent.localeObj.getConstant('imageInsertLinkHeader'),
26387
26713
  content: linkWrap,
@@ -26433,7 +26759,7 @@ class Image$1 {
26433
26759
  alt: inputAlt
26434
26760
  };
26435
26761
  this.dialogObj.setProperties({
26436
- height: 'inherit', width: '290px', header: altHeader, content: altWrap,
26762
+ width: '290px', header: altHeader, content: altWrap,
26437
26763
  buttons: [{
26438
26764
  // eslint-disable-next-line
26439
26765
  click: (e) => {
@@ -26681,7 +27007,7 @@ class Image$1 {
26681
27007
  const dialogContent = this.imgsizeInput(e);
26682
27008
  const selectObj = { args: e.args, selfImage: this, selection: e.selection, selectNode: e.selectNode };
26683
27009
  this.dialogObj.setProperties({
26684
- height: (Browser.isDevice) ? '300px' : 'inherit', width: '290px', header: imgSizeHeader, content: dialogContent,
27010
+ width: '290px', header: imgSizeHeader, content: dialogContent,
26685
27011
  buttons: [{
26686
27012
  // eslint-disable-next-line
26687
27013
  click: (e) => {
@@ -26881,7 +27207,6 @@ class Image$1 {
26881
27207
  for (let i = 0; i < items.length; i++) {
26882
27208
  removeClass([items[i]], 'e-img-focus');
26883
27209
  removeClass([items[i]], 'e-resize');
26884
- items[i].style.maxWidth = '';
26885
27210
  }
26886
27211
  }
26887
27212
  }
@@ -26895,7 +27220,6 @@ class Image$1 {
26895
27220
  this.cancelResizeAction();
26896
27221
  }
26897
27222
  }
26898
- // eslint-disable-next-line
26899
27223
  imageUrlPopup(e) {
26900
27224
  const imgUrl = this.parent.createElement('div', { className: 'imgUrl' + this.parent.getCssClass(true) });
26901
27225
  const placeUrl = this.i10n.getConstant('imageUrl');
@@ -26974,12 +27298,18 @@ class Image$1 {
26974
27298
  const imgHeight = this.i10n.getConstant('imageHeight');
26975
27299
  const imgWidth = this.i10n.getConstant('imageWidth');
26976
27300
  const imgSizeWrap = this.parent.createElement('div', { className: 'e-img-sizewrap' + this.parent.getCssClass(true) });
26977
- const widthVal = isNullOrUndefined(this.changedWidthValue) && (selectNode.style.width.toString() === 'auto' ||
27301
+ let widthVal = isNullOrUndefined(this.changedWidthValue) && (selectNode.style.width.toString() === 'auto' ||
26978
27302
  selectNode.style.width !== '') ? selectNode.style.width : !isNullOrUndefined(this.changedWidthValue) ?
26979
27303
  this.changedWidthValue : (parseInt(selectNode.getClientRects()[0].width.toString(), 10)).toString();
26980
- const heightVal = isNullOrUndefined(this.changedHeightValue) && (selectNode.style.height.toString() === 'auto' ||
27304
+ let heightVal = isNullOrUndefined(this.changedHeightValue) && (selectNode.style.height.toString() === 'auto' ||
26981
27305
  selectNode.style.height !== '') ? selectNode.style.height : !isNullOrUndefined(this.changedHeightValue) ?
26982
27306
  this.changedHeightValue : (parseInt(selectNode.getClientRects()[0].height.toString(), 10)).toString();
27307
+ if (selectNode.style.width === '') {
27308
+ widthVal = 'auto';
27309
+ }
27310
+ if (selectNode.style.height === '') {
27311
+ heightVal = 'auto';
27312
+ }
26983
27313
  this.changedWidthValue = null;
26984
27314
  this.changedHeightValue = null;
26985
27315
  const content = '<div class="e-rte-label' + this.parent.getCssClass(true) + '"><label>' + imgWidth +
@@ -27113,7 +27443,7 @@ class Image$1 {
27113
27443
  this.parent.trigger(imageSelected, selectArgs, (selectArgs) => {
27114
27444
  if (!selectArgs.cancel) {
27115
27445
  this.checkExtension(selectArgs.filesData[0]);
27116
- altText = selectArgs.filesData[0].name;
27446
+ altText = selectArgs.filesData[0].name.replace(/\.[a-zA-Z0-9]+$/, '');
27117
27447
  if (this.parent.editorMode === 'HTML' && isNullOrUndefined(this.parent.insertImageSettings.path)) {
27118
27448
  const reader = new FileReader();
27119
27449
  // eslint-disable-next-line
@@ -28673,7 +29003,7 @@ class Video {
28673
29003
  const dialogContent = this.vidsizeInput(e);
28674
29004
  const selectObj = { args: e.args, selfVideo: this, selection: e.selection, selectNode: e.selectNode };
28675
29005
  this.dialogObj.setProperties({
28676
- height: 'inherit', width: '290px', header: vidSizeHeader, content: dialogContent,
29006
+ width: '290px', header: vidSizeHeader, content: dialogContent,
28677
29007
  buttons: [{
28678
29008
  // eslint-disable-next-line
28679
29009
  click: (e) => {
@@ -29042,7 +29372,6 @@ class Video {
29042
29372
  this.setAspectRatio(this.videoEle, parseInt(width, 10), parseInt(height, 10), args);
29043
29373
  this.resizeVidDupPos(this.videoEle);
29044
29374
  this.vidResizePos(this.videoEle, this.vidResizeDiv);
29045
- this.parent.setContentHeight('', false);
29046
29375
  }
29047
29376
  });
29048
29377
  }
@@ -29851,8 +30180,12 @@ class Video {
29851
30180
  this.parent.trigger(fileRemoving, e, (e) => {
29852
30181
  proxy.isVideoUploaded = false;
29853
30182
  this.dialogObj.getButtons(0).element.disabled = true;
29854
- //proxy.inputUrl.removeAttribute('disabled');
29855
- proxy.embedInputUrl.removeAttribute('disabled');
30183
+ if (proxy.inputUrl.getAttribute('disabled')) {
30184
+ proxy.inputUrl.removeAttribute('disabled');
30185
+ }
30186
+ if (proxy.embedInputUrl.getAttribute('disabled')) {
30187
+ proxy.embedInputUrl.removeAttribute('disabled');
30188
+ }
29856
30189
  if (proxy.uploadUrl) {
29857
30190
  proxy.uploadUrl.url = '';
29858
30191
  }
@@ -30086,7 +30419,6 @@ class ViewSource {
30086
30419
  rteContent.appendChild(this.previewElement);
30087
30420
  this.parent.element.appendChild(rteContent);
30088
30421
  rteContent.style.height = this.contentModule.getPanel().style.height;
30089
- rteContent.style.marginTop = this.contentModule.getPanel().style.marginTop;
30090
30422
  this.getPanel().value = this.getTextAreaValue();
30091
30423
  this.contentModule.getPanel().style.display = 'none';
30092
30424
  rteContent.style.display = 'block';
@@ -30107,14 +30439,17 @@ class ViewSource {
30107
30439
  removeClass([this.parent.getToolbar()], [CLS_EXPAND_OPEN]);
30108
30440
  }
30109
30441
  removeClass(tbItems, [CLS_ACTIVE]);
30110
- this.parent.setContentHeight('sourceCode', true);
30442
+ const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
30443
+ this.parent.setContentHeight('SourceCode', isExpand);
30111
30444
  this.wireEvent(this.previewElement);
30112
30445
  this.unWireBaseKeyDown();
30113
30446
  this.previewElement.focus();
30114
30447
  this.parent.updateValue();
30115
30448
  if (!isNullOrUndefined(this.parent.placeholder) && !this.parent.iframeSettings.enable) {
30116
30449
  const placeHolderWrapper = this.parent.element.querySelector('.rte-placeholder.e-rte-placeholder');
30117
- placeHolderWrapper.style.display = 'none';
30450
+ if (placeHolderWrapper) {
30451
+ placeHolderWrapper.style.display = 'none';
30452
+ }
30118
30453
  }
30119
30454
  this.parent.trigger(actionComplete, { requestType: 'SourceCode', targetItem: 'SourceCode', args: args });
30120
30455
  this.parent.invokeChangeEvent();
@@ -30170,7 +30505,8 @@ class ViewSource {
30170
30505
  if (this.parent.getToolbar()) {
30171
30506
  removeClass([this.parent.getToolbar()], [CLS_EXPAND_OPEN]);
30172
30507
  }
30173
- this.parent.setContentHeight('preview', true);
30508
+ const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
30509
+ this.parent.setContentHeight('Preview', isExpand);
30174
30510
  this.unWireEvent();
30175
30511
  this.wireBaseKeyDown();
30176
30512
  this.contentModule.getEditPanel().focus();
@@ -30244,6 +30580,7 @@ class Table {
30244
30580
  this.pageY = null;
30245
30581
  this.moveEle = null;
30246
30582
  this.currentColumnResize = '';
30583
+ this.resizeEndTime = 0;
30247
30584
  this.parent = parent;
30248
30585
  this.rteID = parent.element.id;
30249
30586
  this.l10n = serviceLocator.getService('rteLocale');
@@ -30401,7 +30738,15 @@ class Table {
30401
30738
  keyUp(e) {
30402
30739
  const target = e.args.target;
30403
30740
  if (e.args.key.toLocaleLowerCase() === 'escape' && target && target.classList && (this.popupObj && !closest(target, '[id=' + "'" + this.popupObj.element.id + "'" + ']')) && this.popupObj) {
30741
+ let createTableToolbarBtn = this.popupObj.relateTo;
30742
+ if (createTableToolbarBtn.nodeName !== 'BUTTON') {
30743
+ createTableToolbarBtn = createTableToolbarBtn.querySelector('span.e-create-table');
30744
+ createTableToolbarBtn = createTableToolbarBtn.parentElement;
30745
+ }
30404
30746
  this.popupObj.hide();
30747
+ if (createTableToolbarBtn) {
30748
+ createTableToolbarBtn.focus();
30749
+ }
30405
30750
  }
30406
30751
  }
30407
30752
  keyDown(e) {
@@ -30581,7 +30926,20 @@ class Table {
30581
30926
  return false;
30582
30927
  }
30583
30928
  }
30929
+ removeEmptyTextNodes(element) {
30930
+ const children = element.childNodes;
30931
+ for (let i = children.length - 1; i >= 0; i--) {
30932
+ const node = children[i];
30933
+ if (node.nodeType === Node.TEXT_NODE && node.nodeValue.trim() === '') {
30934
+ element.removeChild(node);
30935
+ }
30936
+ }
30937
+ }
30584
30938
  tabSelection(event, selection, ele) {
30939
+ let allHeadBodyTRElements = ele.closest('table').querySelectorAll('thead, tbody, tr');
30940
+ for (let i = 0; i < allHeadBodyTRElements.length; i++) {
30941
+ this.removeEmptyTextNodes(allHeadBodyTRElements[i]);
30942
+ }
30585
30943
  this.previousTableElement = ele;
30586
30944
  const insideList = this.insideList(selection.range);
30587
30945
  if ((event.keyCode === 37 || event.keyCode === 39) && selection.range.startContainer.nodeType === 3 ||
@@ -30718,10 +31076,12 @@ class Table {
30718
31076
  const startNode = this.parent.getRange().startContainer.parentElement;
30719
31077
  const endNode = this.parent.getRange().endContainer.parentElement;
30720
31078
  const isAnchorEle = this.getAnchorNode(target);
31079
+ const currentTime = new Date().getTime();
30721
31080
  if (target && target.nodeName !== 'A' && isAnchorEle.nodeName !== 'A' && target.nodeName !== 'IMG' && target.nodeName !== 'VIDEO' && !target.classList.contains(CLS_CLICKELEM) &&
30722
31081
  target.nodeName !== 'AUDIO' && startNode === endNode && (target.nodeName === 'TD' || target.nodeName === 'TH' ||
30723
31082
  target.nodeName === 'TABLE' || (closestTable && this.parent.contentModule.getEditPanel().contains(closestTable)))
30724
- && !(range.startContainer.nodeType === 3 && !range.collapsed)) {
31083
+ && !(range.startContainer.nodeType === 3 && !range.collapsed) &&
31084
+ currentTime - this.resizeEndTime > 100) {
30725
31085
  const range = this.parent.formatter.editorManager.nodeSelection.getRange(this.contentModule.getDocument());
30726
31086
  this.parent.formatter.editorManager.nodeSelection.save(range, this.contentModule.getDocument());
30727
31087
  this.parent.formatter.editorManager.nodeSelection.Clear(this.contentModule.getDocument());
@@ -30817,7 +31177,10 @@ class Table {
30817
31177
  const tdNode = closest(target, 'td,th');
30818
31178
  target = (target.nodeName !== 'TD' && tdNode && this.parent.contentModule.getEditPanel().contains(tdNode)) ?
30819
31179
  tdNode : target;
30820
- removeClass(this.contentModule.getEditPanel().querySelectorAll('table td, table th'), CLS_TABLE_SEL);
31180
+ if (!(this.parent.quickToolbarSettings.showOnRightClick && e.args.which === 3 &&
31181
+ target.classList.contains(CLS_TABLE_SEL))) {
31182
+ removeClass(this.contentModule.getEditPanel().querySelectorAll('table td, table th'), CLS_TABLE_SEL);
31183
+ }
30821
31184
  if (target && (target.tagName === 'TD' || target.tagName === 'TH')) {
30822
31185
  addClass([target], CLS_TABLE_SEL);
30823
31186
  this.activeCell = target;
@@ -31204,6 +31567,9 @@ class Table {
31204
31567
  widthCompare = rteWidth;
31205
31568
  }
31206
31569
  if (this.resizeBtnStat.column) {
31570
+ if (this.curTable.closest('li')) {
31571
+ widthCompare = this.curTable.closest('li').offsetWidth;
31572
+ }
31207
31573
  const colGroup = this.curTable.querySelectorAll('colgroup > col');
31208
31574
  let currentTableWidth;
31209
31575
  if (this.curTable.style.width !== '' && this.curTable.style.width.includes('%')) {
@@ -31229,6 +31595,15 @@ class Table {
31229
31595
  (this.convertPixelToPercentage(tableWidth - mouseX, widthCompare) + '%');
31230
31596
  const differenceWidth = currentTableWidth - this.convertPixelToPercentage(tableWidth - mouseX, widthCompare);
31231
31597
  let preMarginLeft = 0;
31598
+ const widthType = this.curTable.style.width.indexOf('%') > -1;
31599
+ if (!widthType && this.curTable.offsetWidth > this.contentModule.getEditPanel().offsetWidth) {
31600
+ this.curTable.style.width = rteWidth + 'px';
31601
+ return;
31602
+ }
31603
+ if (widthType && parseFloat(this.curTable.style.width.split('%')[0]) > 100) {
31604
+ this.curTable.style.width = '100%';
31605
+ return;
31606
+ }
31232
31607
  if (!isNullOrUndefined(this.curTable.style.marginLeft) && this.curTable.style.marginLeft !== '') {
31233
31608
  const regex = /[-+]?\d*\.\d+|\d+/;
31234
31609
  const value = this.curTable.style.marginLeft.match(regex);
@@ -31236,7 +31611,16 @@ class Table {
31236
31611
  preMarginLeft = parseFloat(value[0]);
31237
31612
  }
31238
31613
  }
31239
- const currentMarginLeft = preMarginLeft + differenceWidth;
31614
+ let currentMarginLeft = preMarginLeft + differenceWidth;
31615
+ if (currentMarginLeft && currentMarginLeft > 100) {
31616
+ const width = parseFloat(this.curTable.style.width);
31617
+ currentMarginLeft = 100 - width;
31618
+ }
31619
+ if (currentMarginLeft && currentMarginLeft < 1) {
31620
+ this.curTable.style.marginLeft = null;
31621
+ this.curTable.style.width = '100%';
31622
+ return;
31623
+ }
31240
31624
  this.curTable.style.marginLeft = 'calc(' + (this.curTable.style.width === '100%' ? 0 : currentMarginLeft) + '%)';
31241
31625
  for (let i = 0; i < firstColumnsCell.length; i++) {
31242
31626
  const currentColumnCellWidth = this.getCurrentColWidth(firstColumnsCell[i], tableWidth);
@@ -31307,15 +31691,26 @@ class Table {
31307
31691
  maxiumWidth = Math.abs(tableBoxPosition - currentTdElement.getBoundingClientRect().width) - 5;
31308
31692
  this.curTable.style.maxWidth = maxiumWidth + 'px';
31309
31693
  }
31310
- const widthType = this.curTable.style.width.indexOf('%') > -1;
31311
- this.curTable.style.width = widthType ? this.convertPixelToPercentage(tableWidth + mouseX, widthCompare) + '%'
31312
- : tableWidth + mouseX + 'px';
31313
31694
  this.curTable.style.height = tableHeight + mouseY + 'px';
31314
31695
  if (!isNullOrUndefined(tableReBox)) {
31315
31696
  tableReBox.classList.add('e-rbox-select');
31316
31697
  tableReBox.style.cssText = 'top: ' + (this.calcPos(this.curTable).top + tableHeight - 4) +
31317
31698
  'px; left:' + (this.calcPos(this.curTable).left + tableWidth - 4) + 'px;';
31318
31699
  }
31700
+ if (this.curTable.closest('li')) {
31701
+ widthCompare = this.curTable.closest('li').offsetWidth;
31702
+ }
31703
+ const widthType = this.curTable.style.width.indexOf('%') > -1;
31704
+ if (widthType && parseFloat(this.curTable.style.width.split('%')[0]) > 100) {
31705
+ this.curTable.style.width = '100%';
31706
+ return;
31707
+ }
31708
+ if (!widthType && this.curTable.offsetWidth > this.contentModule.getEditPanel().offsetWidth) {
31709
+ this.curTable.style.width = rteWidth + 'px';
31710
+ return;
31711
+ }
31712
+ this.curTable.style.width = widthType ? this.convertPixelToPercentage(tableWidth + mouseX, widthCompare) + '%'
31713
+ : tableWidth + mouseX + 'px';
31319
31714
  }
31320
31715
  }
31321
31716
  });
@@ -31389,6 +31784,7 @@ class Table {
31389
31784
  const args = { event: e, requestType: 'table' };
31390
31785
  this.parent.trigger(resizeStop, args);
31391
31786
  this.parent.formatter.saveData();
31787
+ this.resizeEndTime = new Date().getTime();
31392
31788
  }
31393
31789
  resetResizeHelper(curTable) {
31394
31790
  const colHelper = this.parent.element.querySelectorAll('.e-table-rhelper.e-column-helper');
@@ -31403,6 +31799,9 @@ class Table {
31403
31799
  element.parentNode.removeChild(element);
31404
31800
  }
31405
31801
  });
31802
+ if (!curTable.style.width) {
31803
+ curTable.style.width = curTable.offsetWidth + 'px';
31804
+ }
31406
31805
  const colGroup = curTable.querySelector('colgroup');
31407
31806
  if (colGroup) {
31408
31807
  for (let i = 0; i < curTable.rows.length; i++) {
@@ -31498,7 +31897,7 @@ class Table {
31498
31897
  this.createTableButton.isStringTemplate = true;
31499
31898
  this.createTableButton.appendTo(btnEle);
31500
31899
  EventHandler.add(btnEle, 'click', this.insertTableDialog, { self: this, args: args.args, selection: args.selection });
31501
- this.parent.getToolbar().appendChild(this.dlgDiv);
31900
+ this.parent.getToolbar().parentElement.appendChild(this.dlgDiv);
31502
31901
  let target = args.args.originalEvent.target;
31503
31902
  target = target.classList.contains('e-toolbar-item') ? target.firstChild : target.parentElement;
31504
31903
  this.popupObj = new Popup(this.dlgDiv, {
@@ -32470,7 +32869,7 @@ __decorate$2([
32470
32869
  Property(null)
32471
32870
  ], PasteCleanupSettings.prototype, "deniedAttrs", void 0);
32472
32871
  __decorate$2([
32473
- Property(['background', 'background-color', 'border', 'border-bottom', 'border-left', 'border-radius', 'border-right', 'border-style', 'border-top', 'border-width', 'clear', 'color', 'cursor', 'direction', 'display', 'float', 'font', 'font-family', 'font-size', 'font-weight', 'font-style', 'height', 'left', 'line-height', 'list-style-type', 'margin', 'margin-top', 'margin-left', 'margin-right', 'margin-bottom', 'max-height', 'max-width', 'min-height', 'min-width', 'overflow', 'overflow-x', 'overflow-y', 'padding', 'padding-bottom', 'padding-left', 'padding-right', 'padding-top', 'position', 'right', 'table-layout', 'text-align', 'text-decoration', 'text-indent', 'top', 'vertical-align', 'visibility', 'white-space', 'width'])
32872
+ Property(['background', 'background-color', 'border', 'border-bottom', 'border-left', 'border-radius', 'border-right', 'border-style', 'border-top', 'border-width', 'clear', 'color', 'cursor', 'direction', 'display', 'float', 'font', 'font-family', 'font-size', 'font-weight', 'font-style', 'height', 'left', 'line-height', 'list-style-type', 'margin', 'margin-top', 'margin-left', 'margin-right', 'margin-bottom', 'max-height', 'max-width', 'min-height', 'min-width', 'overflow', 'overflow-x', 'overflow-y', 'padding', 'padding-bottom', 'padding-left', 'padding-right', 'padding-top', 'position', 'right', 'table-layout', 'text-align', 'text-decoration', 'text-transform', 'text-indent', 'top', 'vertical-align', 'visibility', 'white-space', 'width'])
32474
32873
  ], PasteCleanupSettings.prototype, "allowedStyleProps", void 0);
32475
32874
  __decorate$2([
32476
32875
  Property(null)
@@ -32679,7 +33078,8 @@ class EnterKeyAction {
32679
33078
  isTableEnter = blockElement.tagName === 'TD' || blockElement.tagName === 'TBODY' ? false : true;
32680
33079
  }
32681
33080
  if (e.args.which === 13 && !e.args.ctrlKey && (!Browser.isDevice ? e.args.code === 'Enter' : e.args.key === 'Enter')) {
32682
- if (isNullOrUndefined(this.startNode.closest('LI, UL, OL')) && isNullOrUndefined(this.endNode.closest('LI, UL, OL')) && isTableEnter &&
33081
+ if (isNullOrUndefined(this.startNode.closest('LI, UL, OL')) && isNullOrUndefined(this.endNode.closest('LI, UL, OL')) &&
33082
+ isNullOrUndefined(this.startNode.closest('.e-img-inner')) && isTableEnter &&
32683
33083
  isNullOrUndefined(this.startNode.closest('PRE')) && isNullOrUndefined(this.endNode.closest('PRE'))) {
32684
33084
  const shiftKey = e.args.shiftKey;
32685
33085
  const actionBeginArgs = {
@@ -33167,6 +33567,14 @@ let RichTextEditor = class RichTextEditor extends Component {
33167
33567
  member: 'image',
33168
33568
  args: [this, this.serviceLocator]
33169
33569
  });
33570
+ modules.push({
33571
+ member: 'audio',
33572
+ args: [this, this.serviceLocator]
33573
+ });
33574
+ modules.push({
33575
+ member: 'video',
33576
+ args: [this, this.serviceLocator]
33577
+ });
33170
33578
  if (this.quickToolbarSettings.enable) {
33171
33579
  modules.push({ member: 'quickToolbar', args: [this, this.serviceLocator] });
33172
33580
  }
@@ -33180,14 +33588,6 @@ let RichTextEditor = class RichTextEditor extends Component {
33180
33588
  if (this.editorMode === 'HTML') {
33181
33589
  modules.push({ member: 'htmlEditor', args: [this, this.serviceLocator] });
33182
33590
  modules.push({ member: 'pasteCleanup', args: [this, this.serviceLocator] });
33183
- modules.push({
33184
- member: 'audio',
33185
- args: [this, this.serviceLocator]
33186
- });
33187
- modules.push({
33188
- member: 'video',
33189
- args: [this, this.serviceLocator]
33190
- });
33191
33591
  modules.push({
33192
33592
  member: 'formatPainter',
33193
33593
  args: [this]
@@ -33219,7 +33619,7 @@ let RichTextEditor = class RichTextEditor extends Component {
33219
33619
  else {
33220
33620
  if (this.getToolbar()) {
33221
33621
  removeClass(this.getToolbar().querySelectorAll('.' + CLS_ACTIVE), CLS_ACTIVE);
33222
- removeClass([this.getToolbar()], [CLS_TB_FLOAT, CLS_TB_ABS_FLOAT]);
33622
+ removeClass([this.getToolbar().parentElement], [CLS_TB_FLOAT]);
33223
33623
  }
33224
33624
  addClass([this.element], CLS_DISABLED);
33225
33625
  this.element.tabIndex = -1;
@@ -33640,7 +34040,7 @@ let RichTextEditor = class RichTextEditor extends Component {
33640
34040
  (this.toolbarSettings.items.indexOf('Undo') > -1 && this.toolbarSettings.items.indexOf('Redo') > -1)) {
33641
34041
  this.disableToolbarItem(['Undo', 'Redo']);
33642
34042
  }
33643
- this.setContentHeight();
34043
+ this.setContentHeight('Init');
33644
34044
  if (this.value !== null) {
33645
34045
  this.valueContainer.defaultValue = this.value;
33646
34046
  }
@@ -33844,9 +34244,16 @@ let RichTextEditor = class RichTextEditor extends Component {
33844
34244
  switch (e.action) {
33845
34245
  case 'toolbar-focus':
33846
34246
  if (this.toolbarSettings.enable && this.getToolbarElement()) {
33847
- const firstActiveItem = this.getToolbarElement().querySelector('.e-toolbar-item:not(.e-overlay)[title]');
33848
- firstActiveItem.firstElementChild.removeAttribute('tabindex');
33849
- firstActiveItem.firstElementChild.focus();
34247
+ let firstActiveItem = this.getToolbarElement().querySelector('.e-toolbar-item:not(.e-overlay)[title]');
34248
+ const quickToolbarElem = this.getRenderedQuickToolbarElem();
34249
+ if (quickToolbarElem) {
34250
+ firstActiveItem = quickToolbarElem.querySelector('.e-toolbar-item:not(.e-overlay)[title]');
34251
+ }
34252
+ if (firstActiveItem) {
34253
+ const firstChild = firstActiveItem.firstElementChild;
34254
+ firstChild.removeAttribute('tabindex');
34255
+ firstChild.focus();
34256
+ }
33850
34257
  }
33851
34258
  break;
33852
34259
  case 'escape':
@@ -34062,6 +34469,7 @@ let RichTextEditor = class RichTextEditor extends Component {
34062
34469
  this.notify(pasteClean, { args: e });
34063
34470
  }
34064
34471
  else {
34472
+ console.warn('[WARNING] :: Module "pasteCleanup" is not available in RichTextEditor component! You either misspelled the module name or forgot to load it.');
34065
34473
  const args = { requestType: 'Paste', editorMode: this.editorMode, event: e };
34066
34474
  let value = null;
34067
34475
  let htmlValue = false;
@@ -34355,7 +34763,7 @@ let RichTextEditor = class RichTextEditor extends Component {
34355
34763
  break;
34356
34764
  case 'height':
34357
34765
  this.setHeight(newProp[prop]);
34358
- this.setContentHeight();
34766
+ this.setContentHeight('Init');
34359
34767
  this.autoResize();
34360
34768
  break;
34361
34769
  case 'readonly':
@@ -34402,11 +34810,11 @@ let RichTextEditor = class RichTextEditor extends Component {
34402
34810
  break;
34403
34811
  case 'inlineMode':
34404
34812
  this.notify(modelChanged, { module: 'quickToolbar', newProp: newProp, oldProp: oldProp });
34405
- this.setContentHeight();
34813
+ this.setContentHeight('Init');
34406
34814
  break;
34407
34815
  case 'toolbarSettings':
34408
34816
  this.notify(modelChanged, { module: 'toolbar', newProp: newProp, oldProp: oldProp });
34409
- this.setContentHeight();
34817
+ this.setContentHeight('Init');
34410
34818
  break;
34411
34819
  case 'maxLength':
34412
34820
  if (this.showCharCount) {
@@ -34565,7 +34973,7 @@ let RichTextEditor = class RichTextEditor extends Component {
34565
34973
  this.inputElement.setAttribute('placeholder', this.placeholder);
34566
34974
  }
34567
34975
  }
34568
- if (this.placeholder && this.iframeSettings.enable) {
34976
+ if (this.placeholder && this.iframeSettings.enable && this.inputElement) {
34569
34977
  if (this.inputElement.textContent.length === 0 && this.inputElement.childNodes.length < 2 && !isNullOrUndefined(this.inputElement.firstChild) && (this.inputElement.firstChild.nodeName === 'BR' ||
34570
34978
  ((this.inputElement.firstChild.nodeName === 'P' || this.inputElement.firstChild.nodeName === 'DIV') && !isNullOrUndefined(this.inputElement.firstChild.firstChild) &&
34571
34979
  this.inputElement.firstChild.firstChild.nodeName === 'BR'))) {
@@ -34910,12 +35318,9 @@ let RichTextEditor = class RichTextEditor extends Component {
34910
35318
  */
34911
35319
  setContentHeight(target, isExpand) {
34912
35320
  let heightValue;
34913
- let topValue = 0;
34914
35321
  let rteHeightPercent;
34915
35322
  const heightPercent = typeof (this.height) === 'string' && this.height.indexOf('%') > -1;
34916
- const cntEle = (this.sourceCodeModule.getPanel() &&
34917
- this.sourceCodeModule.getPanel().parentElement.style.display === 'block') ? this.sourceCodeModule.getPanel().parentElement :
34918
- this.contentModule.getPanel();
35323
+ const cntEle = this.contentModule.getPanel();
34919
35324
  let rteHeight = this.element.offsetHeight;
34920
35325
  if (rteHeight === 0 && this.height !== 'auto' && !this.getToolbar()) {
34921
35326
  rteHeight = parseInt(this.height, 10);
@@ -34923,43 +35328,40 @@ let RichTextEditor = class RichTextEditor extends Component {
34923
35328
  rteHeightPercent = this.height;
34924
35329
  }
34925
35330
  }
34926
- const tbHeight = this.getToolbar() ? this.toolbarModule.getToolbarHeight() : 0;
35331
+ let tbHeight = this.getToolbar() ? this.toolbarModule.getToolbarHeight() : 0;
34927
35332
  const rzHandle = this.element.querySelector('.' + CLS_RTE_RES_HANDLE);
34928
35333
  const rzHeight = this.enableResize ? (!isNullOrUndefined(rzHandle) ? (rzHandle.offsetHeight + 8) : 0) : 0;
34929
35334
  const expandPopHeight = this.getToolbar() ? this.toolbarModule.getExpandTBarPopHeight() : 0;
34930
- if (this.toolbarSettings.type === ToolbarType.Expand && isExpand) {
34931
- heightValue = (this.height === 'auto' && rzHeight === 0) ? 'auto' : rteHeight - (tbHeight + expandPopHeight + rzHeight) + 'px';
34932
- topValue = (!this.toolbarSettings.enableFloating) ? expandPopHeight : 0;
35335
+ if (target && target !== 'Toolbar' && expandPopHeight && this.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0) {
35336
+ tbHeight = tbHeight - expandPopHeight;
34933
35337
  }
34934
- else {
34935
- if (this.height === 'auto' && !(this.element.classList.contains('e-rte-full-screen')) && !this.isResizeInitialized) {
34936
- heightValue = 'auto';
35338
+ if (this.toolbarSettings.type === ToolbarType.Expand) {
35339
+ if (isExpand) {
35340
+ heightValue = (this.height === 'auto' && this.element.style.height === 'auto') ? 'auto' : rteHeight - (tbHeight + expandPopHeight + rzHeight) + 'px';
34937
35341
  }
34938
35342
  else {
34939
- heightValue = heightPercent && rteHeightPercent ? rteHeightPercent : rteHeight - (tbHeight + rzHeight) + 'px';
35343
+ heightValue = (this.height === 'auto' && this.element.style.height === 'auto') ? 'auto' : rteHeight - (tbHeight - expandPopHeight + rzHeight) + 'px';
34940
35344
  }
34941
35345
  }
34942
- if (target !== 'windowResize' || heightPercent) {
34943
- if (this.iframeSettings.enable) {
34944
- if (heightValue !== 'auto') {
34945
- setStyleAttribute(cntEle, { height: heightValue, marginTop: topValue + 'px' });
35346
+ else {
35347
+ heightValue = (this.height === 'auto' && this.element.style.height === 'auto') ? 'auto' : rteHeight - tbHeight + 'px';
35348
+ }
35349
+ const finalHeight = heightPercent && rteHeightPercent ? rteHeightPercent : heightValue;
35350
+ switch (target) {
35351
+ case 'Init':
35352
+ case 'Toolbar':
35353
+ case 'WindowResize':
35354
+ case 'Refresh':
35355
+ if (this.element.querySelectorAll('.e-source-content').length > 0 && this.element.querySelector('.e-source-content').style.display === 'block') {
35356
+ setStyleAttribute(this.element.querySelector('.e-source-content'), { height: finalHeight });
34946
35357
  }
34947
- }
34948
- else {
34949
- if (target === 'windowResize' && heightPercent) {
34950
- //cntEle hide the borderBottom of RichTextEditor. so removed the 2px of cntEle height.
34951
- heightValue = parseInt(heightValue, 10) - 2 + 'px';
35358
+ else {
35359
+ setStyleAttribute(cntEle, { height: finalHeight });
34952
35360
  }
34953
- setStyleAttribute(cntEle, { height: heightValue, marginTop: topValue + 'px' });
34954
- }
34955
- }
34956
- if (this.iframeSettings.enable && target === 'sourceCode') {
34957
- const codeElement = select('.' + CLS_RTE_CONTENT, this.element);
34958
- setStyleAttribute(codeElement, { height: heightValue, marginTop: topValue + 'px' });
34959
- }
34960
- if (this.toolbarSettings.enableFloating && this.getToolbar() && !this.inlineMode.enable) {
34961
- const tbWrapHeight = (isExpand ? (tbHeight + expandPopHeight) : tbHeight) + 'px';
34962
- setStyleAttribute(this.getToolbar().parentElement, { height: tbWrapHeight });
35361
+ break;
35362
+ case 'Resize':
35363
+ setStyleAttribute(cntEle, { height: finalHeight });
35364
+ break;
34963
35365
  }
34964
35366
  if (rzHeight === 0) {
34965
35367
  this.autoResize();
@@ -35162,18 +35564,14 @@ let RichTextEditor = class RichTextEditor extends Component {
35162
35564
  resizeHandler() {
35163
35565
  let isExpand = false;
35164
35566
  if (!document.body.contains(this.element)) {
35165
- document.defaultView.removeEventListener('resize', this.onResizeHandler, true);
35567
+ document.defaultView.removeEventListener('resize', debounce(this.onResizeHandler, 10), true);
35166
35568
  return;
35167
35569
  }
35168
35570
  if (this.toolbarSettings.enable && !this.inlineMode.enable) {
35169
35571
  this.toolbarModule.refreshToolbarOverflow();
35170
35572
  isExpand = this.toolbarModule.baseToolbar.toolbarObj.element.classList.contains(CLS_EXPAND_OPEN);
35171
35573
  }
35172
- if (this.iframeSettings.enable !== true) {
35173
- // When resize the window,border bottom of cntEle and this.element border visible separatly.so none the cntEle borderBottom.
35174
- this.contentModule.getPanel().style.borderBottom = 'none';
35175
- }
35176
- this.setContentHeight('windowResize', isExpand);
35574
+ this.setContentHeight('WindowResize', isExpand);
35177
35575
  this.notify(windowResize, null);
35178
35576
  }
35179
35577
  scrollHandler(e) {
@@ -35309,6 +35707,10 @@ let RichTextEditor = class RichTextEditor extends Component {
35309
35707
  this.isRTE = false;
35310
35708
  }
35311
35709
  this.notify(docClick, { args: e });
35710
+ const hideQuickToolbarChecker = this.quickToolbarModule && !this.inlineMode.enable && isNullOrUndefined(this.quickToolbarModule.inlineQTBar);
35711
+ if ((hideQuickToolbarChecker && !isNullOrUndefined(closest(target, '.' + 'e-toolbar-wrapper'))) || (hideQuickToolbarChecker && (!isNullOrUndefined(closest(target, '.e-rte-table-resize')) || !isNullOrUndefined(closest(target, '.e-table-box'))))) {
35712
+ this.quickToolbarModule.hideQuickToolbars();
35713
+ }
35312
35714
  if (Browser.info.name !== 'msie' && e.detail > 3) {
35313
35715
  e.preventDefault();
35314
35716
  }
@@ -35456,9 +35858,10 @@ let RichTextEditor = class RichTextEditor extends Component {
35456
35858
  this.triggerEditArea(e.originalEvent);
35457
35859
  }
35458
35860
  contextHandler(e) {
35459
- const closestElem = closest(e.target, 'a, table, img');
35861
+ const closestElem = closest(e.target, 'a, table, img, video, audio');
35460
35862
  if (this.inlineMode.onSelection === false || (!isNullOrUndefined(closestElem) && this.inputElement.contains(closestElem)
35461
- && (closestElem.tagName === 'IMG' || closestElem.tagName === 'TABLE' || closestElem.tagName === 'A'))) {
35863
+ && (closestElem.tagName === 'IMG' || closestElem.tagName === 'TABLE' || closestElem.tagName === 'A' ||
35864
+ closestElem.tagName.toLowerCase() === 'video' || closestElem.tagName.toLowerCase() === 'audio'))) {
35462
35865
  e.preventDefault();
35463
35866
  }
35464
35867
  }
@@ -35491,10 +35894,21 @@ let RichTextEditor = class RichTextEditor extends Component {
35491
35894
  }
35492
35895
  }
35493
35896
  setAutoHeight(element) {
35494
- if (!isNullOrUndefined(element)) {
35897
+ if (!isNullOrUndefined(element) && !this.iframeSettings.enable) {
35495
35898
  element.style.height = this.inputElement.scrollHeight + 'px';
35496
35899
  element.style.overflow = 'hidden';
35497
35900
  }
35901
+ else if (!isNullOrUndefined(element) && !isNullOrUndefined(element.parentElement) && this.iframeSettings.enable) {
35902
+ const newRange = this.getRange();
35903
+ element.style.height = 'auto';
35904
+ const newHeight = element.contentDocument.body.scrollHeight + 'px';
35905
+ element.style.height = newHeight;
35906
+ element.style.overflow = 'hidden';
35907
+ // 16 px added for padding doesn't affect the editor height
35908
+ if (newRange.startContainer.nodeName !== '#text' && newRange.startContainer.nodeName !== 'BODY' && window.innerHeight < newRange.startContainer.getBoundingClientRect().top + element.getBoundingClientRect().top + 16) {
35909
+ newRange.startContainer.scrollIntoView(false);
35910
+ }
35911
+ }
35498
35912
  }
35499
35913
  wireEvents() {
35500
35914
  this.element.addEventListener('focusin', this.onFocusHandler, true);
@@ -35549,7 +35963,7 @@ let RichTextEditor = class RichTextEditor extends Component {
35549
35963
  EventHandler.add(this.inputElement, Browser.touchStartEvent, this.mouseDownHandler, this);
35550
35964
  this.wireContextEvent();
35551
35965
  this.formatter.editorManager.observer.on(KEY_DOWN_HANDLER, this.editorKeyDown, this);
35552
- this.element.ownerDocument.defaultView.addEventListener('resize', this.onResizeHandler, true);
35966
+ this.element.ownerDocument.defaultView.addEventListener('resize', debounce(this.onResizeHandler, 10), true);
35553
35967
  if (this.iframeSettings.enable) {
35554
35968
  EventHandler.add(this.inputElement, 'focusin', this.focusHandler, this);
35555
35969
  EventHandler.add(this.inputElement, 'focusout', this.blurHandler, this);
@@ -35615,7 +36029,7 @@ let RichTextEditor = class RichTextEditor extends Component {
35615
36029
  if (this.formatter) {
35616
36030
  this.formatter.editorManager.observer.off(KEY_DOWN_HANDLER, this.editorKeyDown);
35617
36031
  }
35618
- this.element.ownerDocument.defaultView.removeEventListener('resize', this.onResizeHandler, true);
36032
+ this.element.ownerDocument.defaultView.removeEventListener('resize', debounce(this.onResizeHandler, 10), true);
35619
36033
  if (this.iframeSettings.enable) {
35620
36034
  EventHandler.remove(this.inputElement, 'focusin', this.focusHandler);
35621
36035
  EventHandler.remove(this.inputElement, 'focusout', this.blurHandler);
@@ -35680,6 +36094,15 @@ let RichTextEditor = class RichTextEditor extends Component {
35680
36094
  }
35681
36095
  }
35682
36096
  }
36097
+ getRenderedQuickToolbarElem() {
36098
+ const quickToolbars = this.quickToolbarModule.getQuickToolbarInstance();
36099
+ for (let i = 0; i < quickToolbars.length; i++) {
36100
+ if (quickToolbars[i] && quickToolbars[i].isRendered) {
36101
+ return quickToolbars[i].element;
36102
+ }
36103
+ }
36104
+ return null;
36105
+ }
35683
36106
  };
35684
36107
  __decorate$1([
35685
36108
  Complex({}, ToolbarSettings$1)
@@ -35983,5 +36406,5 @@ RichTextEditor = __decorate$1([
35983
36406
  * Rich Text Editor component exported items
35984
36407
  */
35985
36408
 
35986
- export { Toolbar$2 as Toolbar, KeyboardEvents$1 as KeyboardEvents, BaseToolbar, BaseQuickToolbar, QuickToolbar, Count, ColorPickerInput, MarkdownToolbarStatus, ExecCommandCallBack, ToolbarAction, MarkdownEditor, HtmlEditor, PasteCleanup, Resize, DropDownButtons, FileManager$1 as FileManager, FullScreen, setAttributes, HtmlToolbarStatus, XhtmlValidation, FormatPainter, EmojiPicker, HTMLFormatter, Formatter, MarkdownFormatter, ContentRender, Render, ToolbarRenderer, Link, Image$1 as Image, Audio, Video, ViewSource, Table, DialogRenderer, IframeContentRender, MarkdownRender, PopupRenderer, RichTextEditor, RenderType, ToolbarType, DialogType, executeGroup, created, destroyed, tableclass, load, initialLoad, contentChanged, initialEnd, iframeMouseDown, destroy, toolbarClick, toolbarRefresh, refreshBegin, toolbarUpdated, bindOnEnd, renderColorPicker, htmlToolbarClick, markdownToolbarClick, destroyColorPicker, modelChanged, tableModulekeyUp, keyUp, keyDown, mouseUp, toolbarCreated, toolbarRenderComplete, enableFullScreen, disableFullScreen, dropDownSelect, beforeDropDownItemRender, execCommandCallBack, imageToolbarAction, audioToolbarAction, videoToolbarAction, linkToolbarAction, windowResize, resizeStart, onResize, resizeStop, undo, redo, insertLink, unLink, editLink, openLink, actionBegin, actionComplete, updatedToolbarStatus, actionSuccess, updateToolbarItem, insertImage, insertAudio, insertVideo, insertCompleted, imageLeft, imageRight, imageCenter, imageBreak, imageInline, imageLink, imageAlt, imageDelete, audioDelete, videoDelete, imageCaption, imageSize, videoSize, sourceCode, updateSource, toolbarOpen, beforeDropDownOpen, selectionSave, selectionRestore, expandPopupClick, count, contentFocus, contentBlur, mouseDown, sourceCodeMouseDown, editAreaClick, scroll, contentscroll, colorPickerChanged, tableColorPickerChanged, focusChange, selectAll$1 as selectAll, selectRange, getSelectedHtml, renderInlineToolbar, paste, imgModule, rtlMode, createTable, docClick, tableToolbarAction, checkUndo, readOnlyMode, moduleDestroy, pasteClean, enterHandler, beforeDialogOpen, clearDialogObj, dialogOpen, beforeDialogClose, dialogClose, beforeQuickToolbarOpen, quickToolbarOpen, quickToolbarClose, popupHide, imageSelected, imageUploading, imageUploadSuccess, imageUploadFailed, imageRemoving, fileSelected, fileUploading, fileUploadSuccess, fileUploadFailed, fileRemoving, afterImageDelete, afterMediaDelete, drop, xhtmlValidation, beforeImageUpload, beforeFileUpload, resizeInitialized, renderFileManager, beforeImageDrop, dynamicModule, beforePasteCleanup, afterPasteCleanup, updateTbItemsStatus, showLinkDialog, closeLinkDialog, showImageDialog, showAudioDialog, showVideoDialog, closeImageDialog, closeAudioDialog, closeVideoDialog, showTableDialog, closeTableDialog, bindCssClass, formatPainterClick, formatPainterDoubleClick, emojiPicker, destroyTooltip, hidePopup, cleanupResizeElements, afterKeyDown, updateValueOnIdle, documentClickClosedBy, showColorPicker, blockEmptyNodes, inlineEmptyNodes, supportedUnits, conversionFactors, onHandleFontsizeChange, CLS_RTE, CLS_RTL, CLS_CONTENT, CLS_DISABLED, CLS_SCRIPT_SHEET, CLS_STYLE_SHEET, CLS_TOOLBAR, CLS_TB_FIXED, CLS_TB_FLOAT, CLS_TB_ABS_FLOAT, CLS_INLINE, CLS_TB_INLINE, CLS_RTE_EXPAND_TB, CLS_FULL_SCREEN, CLS_QUICK_TB, CLS_TEXT_QUICK_TB, CLS_POP, CLS_TB_STATIC, CLS_QUICK_POP, CLS_QUICK_DROPDOWN, CLS_IMAGE_POP, CLS_TEXT_POP, CLS_INLINE_POP, CLS_INLINE_DROPDOWN, CLS_DROPDOWN_POPUP, CLS_DROPDOWN_ICONS, CLS_DROPDOWN_ITEMS, CLS_DROPDOWN_BTN, CLS_RTE_CONTENT, CLS_TB_ITEM, CLS_TB_EXTENDED, CLS_TB_WRAP, CLS_POPUP, CLS_SEPARATOR, CLS_MINIMIZE, CLS_MAXIMIZE, CLS_BACK, CLS_SHOW, CLS_HIDE, CLS_VISIBLE, CLS_FOCUS, CLS_RM_WHITE_SPACE, CLS_IMGRIGHT, CLS_IMGLEFT, CLS_IMGCENTER, CLS_IMGBREAK, CLS_AUDIOBREAK, CLS_CLICKELEM, CLS_VID_CLICK_ELEM, CLS_AUDIOWRAP, CLS_VIDEOWRAP, CLS_VIDEOBREAK, CLS_CAPTION, CLS_RTE_CAPTION, CLS_CAPINLINE, CLS_IMGINLINE, CLS_AUDIOINLINE, CLS_VIDEOINLINE, CLS_COUNT, CLS_WARNING, CLS_ERROR, CLS_ICONS, CLS_ACTIVE, CLS_EXPAND_OPEN, CLS_RTE_ELEMENTS, CLS_TB_BTN, CLS_HR_SEPARATOR, CLS_TB_IOS_FIX, CLS_LIST_PRIMARY_CONTENT, CLS_NUMBERFORMATLIST_TB_BTN, CLS_BULLETFORMATLIST_TB_BTN, CLS_FORMATS_TB_BTN, CLS_FONT_NAME_TB_BTN, CLS_FONT_SIZE_TB_BTN, CLS_ALIGN_TB_BTN, CLS_FONT_COLOR_TARGET, CLS_BACKGROUND_COLOR_TARGET, CLS_COLOR_CONTENT, CLS_FONT_COLOR_DROPDOWN, CLS_BACKGROUND_COLOR_DROPDOWN, CLS_COLOR_PALETTE, CLS_FONT_COLOR_PICKER, CLS_BACKGROUND_COLOR_PICKER, CLS_RTE_READONLY, CLS_TABLE_SEL, CLS_TB_DASH_BOR, CLS_TB_ALT_BOR, CLS_TB_COL_RES, CLS_TB_ROW_RES, CLS_TB_BOX_RES, CLS_RTE_HIDDEN, CLS_RTE_PASTE_KEEP_FORMAT, CLS_RTE_PASTE_REMOVE_FORMAT, CLS_RTE_PASTE_PLAIN_FORMAT, CLS_RTE_PASTE_OK, CLS_RTE_PASTE_CANCEL, CLS_RTE_DIALOG_MIN_HEIGHT, CLS_RTE_RES_HANDLE, CLS_RTE_RES_EAST, CLS_RTE_IMAGE, CLS_RESIZE, CLS_IMG_FOCUS, CLS_AUD_FOCUS, CLS_VID_FOCUS, CLS_RTE_DRAG_IMAGE, CLS_RTE_UPLOAD_POPUP, CLS_POPUP_OPEN, CLS_IMG_RESIZE, CLS_DROPAREA, CLS_IMG_INNER, CLS_UPLOAD_FILES, CLS_RTE_DIALOG_UPLOAD, CLS_RTE_RES_CNT, CLS_CUSTOM_TILE, CLS_NOCOLOR_ITEM, CLS_TABLE, CLS_TABLE_BORDER, CLS_RTE_TABLE_RESIZE, CLS_RTE_FIXED_TB_EXPAND, CLS_RTE_TB_ENABLED, CLS_RTE_RES_WEST, CLS_RTE_SOURCE_CODE_TXTAREA, getIndex, hasClass, getDropDownValue, isIDevice, getFormattedFontSize, pageYOffset, getTooltipText, getTooltipTextDropdownItems, getQuickToolbarTooltipText, setToolbarStatus, getCollection, getTBarItemsIndex, updateUndoRedoStatus, dispatchEvent, parseHtml, getTextNodesUnder, toObjectLowerCase, getEditValue, updateTextNode, getDefaultValue, isEditableValueEmpty, decode, sanitizeHelper, convertToBlob, getLocaleFontFormat, updateDropDownFontFormatLocale, ServiceLocator, RendererFactory, EditorManager, IMAGE, AUDIO, VIDEO, TABLE, LINK, INSERT_ROW, INSERT_COLUMN, DELETEROW, DELETECOLUMN, REMOVETABLE, TABLEHEADER, TABLE_VERTICAL_ALIGN, TABLE_MERGE, TABLE_VERTICAL_SPLIT, TABLE_HORIZONTAL_SPLIT, TABLE_MOVE, ALIGNMENT_TYPE, INDENT_TYPE, DEFAULT_TAG, BLOCK_TAGS, IGNORE_BLOCK_TAGS, TABLE_BLOCK_TAGS, SELECTION_TYPE, INSERTHTML_TYPE, INSERT_TEXT_TYPE, CLEAR_TYPE, SELF_CLOSING_TAGS, PASTE_SOURCE, CLASS_IMAGE_RIGHT, CLASS_IMAGE_LEFT, CLASS_IMAGE_CENTER, CLASS_VIDEO_RIGHT, CLASS_VIDEO_LEFT, CLASS_VIDEO_CENTER, CLASS_IMAGE_BREAK, CLASS_AUDIO_BREAK, CLASS_VIDEO_BREAK, CLASS_CAPTION, CLASS_RTE_CAPTION, CLASS_CAPTION_INLINE, CLASS_IMAGE_INLINE, CLASS_AUDIO_INLINE, CLASS_CLICK_ELEM, CLASS_VIDEO_CLICK_ELEM, CLASS_AUDIO, CLASS_VIDEO, CLASS_AUDIO_WRAP, CLASS_VIDEO_WRAP, CLASS_EMBED_VIDEO_WRAP, CLASS_AUDIO_FOCUS, CLASS_VIDEO_FOCUS, CLASS_VIDEO_INLINE, Lists, markerClassName, DOMNode, Alignments, Indents, Formats, LinkCommand, InsertMethods, InsertTextExec, InsertHtmlExec, InsertHtml, IsFormatted, MsWordPaste, NodeCutter, ImageCommand, AudioCommand, VideoCommand, SelectionCommands, SelectionBasedExec, ClearFormatExec, UndoRedoManager, TableCommand, statusCollection, ToolbarStatus, FormatPainterActions, EmojiPickerAction, NodeSelection, MarkdownParser, LISTS_COMMAND, selectionCommand, LINK_COMMAND, CLEAR_COMMAND, MD_TABLE, INSERT_TEXT_COMMAND, ClearFormat, MDLists, MDFormats, MarkdownSelection, UndoRedoCommands, MDSelectionFormats, MDLink, MDTable, markdownFormatTags, markdownSelectionTags, markdownListsTags, htmlKeyConfig, markdownKeyConfig, pasteCleanupGroupingTags, listConversionFilters, selfClosingTags, KEY_DOWN, ACTION, FORMAT_TYPE, KEY_DOWN_HANDLER, LIST_TYPE, KEY_UP_HANDLER, KEY_UP, MODEL_CHANGED_PLUGIN, MODEL_CHANGED, MS_WORD_CLEANUP_PLUGIN, MS_WORD_CLEANUP, ON_BEGIN, SPACE_ACTION, FORMAT_PAINTER_ACTIONS, EMOJI_PICKER_ACTIONS, MOUSE_DOWN };
36409
+ export { Toolbar$2 as Toolbar, KeyboardEvents$1 as KeyboardEvents, BaseToolbar, BaseQuickToolbar, QuickToolbar, Count, ColorPickerInput, MarkdownToolbarStatus, ExecCommandCallBack, ToolbarAction, MarkdownEditor, HtmlEditor, PasteCleanup, Resize, DropDownButtons, FileManager$1 as FileManager, FullScreen, setAttributes, HtmlToolbarStatus, XhtmlValidation, FormatPainter, EmojiPicker, HTMLFormatter, Formatter, MarkdownFormatter, ContentRender, Render, ToolbarRenderer, Link, Image$1 as Image, Audio, Video, ViewSource, Table, DialogRenderer, IframeContentRender, MarkdownRender, PopupRenderer, RichTextEditor, RenderType, ToolbarType, DialogType, executeGroup, created, destroyed, tableclass, load, initialLoad, contentChanged, initialEnd, iframeMouseDown, destroy, toolbarClick, toolbarRefresh, refreshBegin, toolbarUpdated, bindOnEnd, renderColorPicker, htmlToolbarClick, markdownToolbarClick, destroyColorPicker, modelChanged, tableModulekeyUp, keyUp, keyDown, mouseUp, toolbarCreated, toolbarRenderComplete, enableFullScreen, disableFullScreen, dropDownSelect, beforeDropDownItemRender, execCommandCallBack, imageToolbarAction, audioToolbarAction, videoToolbarAction, linkToolbarAction, windowResize, resizeStart, onResize, resizeStop, undo, redo, insertLink, unLink, editLink, openLink, actionBegin, actionComplete, updatedToolbarStatus, actionSuccess, updateToolbarItem, insertImage, insertAudio, insertVideo, insertCompleted, imageLeft, imageRight, imageCenter, imageBreak, imageInline, imageLink, imageAlt, imageDelete, audioDelete, videoDelete, imageCaption, imageSize, videoSize, sourceCode, updateSource, toolbarOpen, beforeDropDownOpen, selectionSave, selectionRestore, expandPopupClick, count, contentFocus, contentBlur, mouseDown, sourceCodeMouseDown, editAreaClick, scroll, contentscroll, colorPickerChanged, tableColorPickerChanged, focusChange, selectAll$1 as selectAll, selectRange, getSelectedHtml, renderInlineToolbar, paste, imgModule, rtlMode, createTable, docClick, tableToolbarAction, checkUndo, readOnlyMode, moduleDestroy, pasteClean, enterHandler, beforeDialogOpen, clearDialogObj, dialogOpen, beforeDialogClose, dialogClose, beforeQuickToolbarOpen, quickToolbarOpen, quickToolbarClose, popupHide, imageSelected, imageUploading, imageUploadSuccess, imageUploadFailed, imageRemoving, fileSelected, fileUploading, fileUploadSuccess, fileUploadFailed, fileRemoving, afterImageDelete, afterMediaDelete, drop, xhtmlValidation, beforeImageUpload, beforeFileUpload, resizeInitialized, renderFileManager, beforeImageDrop, dynamicModule, beforePasteCleanup, afterPasteCleanup, updateTbItemsStatus, showLinkDialog, closeLinkDialog, showImageDialog, showAudioDialog, showVideoDialog, closeImageDialog, closeAudioDialog, closeVideoDialog, showTableDialog, closeTableDialog, bindCssClass, formatPainterClick, formatPainterDoubleClick, emojiPicker, destroyTooltip, hidePopup, cleanupResizeElements, afterKeyDown, updateValueOnIdle, documentClickClosedBy, showColorPicker, closeTooltip, blockEmptyNodes, inlineEmptyNodes, supportedUnits, conversionFactors, onHandleFontsizeChange, CLS_RTE, CLS_RTL, CLS_CONTENT, CLS_DISABLED, CLS_SCRIPT_SHEET, CLS_STYLE_SHEET, CLS_TOOLBAR, CLS_TB_FIXED, CLS_TB_FLOAT, CLS_INLINE, CLS_TB_INLINE, CLS_RTE_EXPAND_TB, CLS_FULL_SCREEN, CLS_QUICK_TB, CLS_TEXT_QUICK_TB, CLS_POP, CLS_TB_STATIC, CLS_QUICK_POP, CLS_QUICK_DROPDOWN, CLS_IMAGE_POP, CLS_TEXT_POP, CLS_INLINE_POP, CLS_INLINE_DROPDOWN, CLS_DROPDOWN_POPUP, CLS_DROPDOWN_ICONS, CLS_DROPDOWN_ITEMS, CLS_DROPDOWN_BTN, CLS_RTE_CONTENT, CLS_TB_ITEM, CLS_TB_EXTENDED, CLS_TB_WRAP, CLS_POPUP, CLS_SEPARATOR, CLS_MINIMIZE, CLS_MAXIMIZE, CLS_BACK, CLS_SHOW, CLS_HIDE, CLS_VISIBLE, CLS_FOCUS, CLS_RM_WHITE_SPACE, CLS_IMGRIGHT, CLS_IMGLEFT, CLS_IMGCENTER, CLS_IMGBREAK, CLS_AUDIOBREAK, CLS_CLICKELEM, CLS_VID_CLICK_ELEM, CLS_AUDIOWRAP, CLS_VIDEOWRAP, CLS_VIDEOBREAK, CLS_CAPTION, CLS_RTE_CAPTION, CLS_CAPINLINE, CLS_IMGINLINE, CLS_AUDIOINLINE, CLS_VIDEOINLINE, CLS_COUNT, CLS_WARNING, CLS_ERROR, CLS_ICONS, CLS_ACTIVE, CLS_EXPAND_OPEN, CLS_RTE_ELEMENTS, CLS_TB_BTN, CLS_HR_SEPARATOR, CLS_TB_IOS_FIX, CLS_LIST_PRIMARY_CONTENT, CLS_NUMBERFORMATLIST_TB_BTN, CLS_BULLETFORMATLIST_TB_BTN, CLS_FORMATS_TB_BTN, CLS_FONT_NAME_TB_BTN, CLS_FONT_SIZE_TB_BTN, CLS_ALIGN_TB_BTN, CLS_FONT_COLOR_TARGET, CLS_BACKGROUND_COLOR_TARGET, CLS_COLOR_CONTENT, CLS_FONT_COLOR_DROPDOWN, CLS_BACKGROUND_COLOR_DROPDOWN, CLS_COLOR_PALETTE, CLS_FONT_COLOR_PICKER, CLS_BACKGROUND_COLOR_PICKER, CLS_RTE_READONLY, CLS_TABLE_SEL, CLS_TB_DASH_BOR, CLS_TB_ALT_BOR, CLS_TB_COL_RES, CLS_TB_ROW_RES, CLS_TB_BOX_RES, CLS_RTE_HIDDEN, CLS_RTE_PASTE_KEEP_FORMAT, CLS_RTE_PASTE_REMOVE_FORMAT, CLS_RTE_PASTE_PLAIN_FORMAT, CLS_RTE_PASTE_OK, CLS_RTE_PASTE_CANCEL, CLS_RTE_DIALOG_MIN_HEIGHT, CLS_RTE_RES_HANDLE, CLS_RTE_RES_EAST, CLS_RTE_IMAGE, CLS_RESIZE, CLS_IMG_FOCUS, CLS_AUD_FOCUS, CLS_VID_FOCUS, CLS_RTE_DRAG_IMAGE, CLS_RTE_UPLOAD_POPUP, CLS_POPUP_OPEN, CLS_IMG_RESIZE, CLS_DROPAREA, CLS_IMG_INNER, CLS_UPLOAD_FILES, CLS_RTE_DIALOG_UPLOAD, CLS_RTE_RES_CNT, CLS_CUSTOM_TILE, CLS_NOCOLOR_ITEM, CLS_TABLE, CLS_TABLE_BORDER, CLS_RTE_TABLE_RESIZE, CLS_RTE_FIXED_TB_EXPAND, CLS_RTE_TB_ENABLED, CLS_RTE_RES_WEST, CLS_RTE_SOURCE_CODE_TXTAREA, getIndex, hasClass, getDropDownValue, isIDevice, getFormattedFontSize, pageYOffset, getTooltipText, getTooltipTextDropdownItems, getQuickToolbarTooltipText, setToolbarStatus, getCollection, getTBarItemsIndex, updateUndoRedoStatus, dispatchEvent, parseHtml, getTextNodesUnder, toObjectLowerCase, getEditValue, updateTextNode, getDefaultValue, isEditableValueEmpty, decode, sanitizeHelper, convertToBlob, getLocaleFontFormat, updateDropDownFontFormatLocale, ServiceLocator, RendererFactory, EditorManager, IMAGE, AUDIO, VIDEO, TABLE, LINK, INSERT_ROW, INSERT_COLUMN, DELETEROW, DELETECOLUMN, REMOVETABLE, TABLEHEADER, TABLE_VERTICAL_ALIGN, TABLE_MERGE, TABLE_VERTICAL_SPLIT, TABLE_HORIZONTAL_SPLIT, TABLE_MOVE, ALIGNMENT_TYPE, INDENT_TYPE, DEFAULT_TAG, BLOCK_TAGS, IGNORE_BLOCK_TAGS, TABLE_BLOCK_TAGS, SELECTION_TYPE, INSERTHTML_TYPE, INSERT_TEXT_TYPE, CLEAR_TYPE, SELF_CLOSING_TAGS, PASTE_SOURCE, CLASS_IMAGE_RIGHT, CLASS_IMAGE_LEFT, CLASS_IMAGE_CENTER, CLASS_VIDEO_RIGHT, CLASS_VIDEO_LEFT, CLASS_VIDEO_CENTER, CLASS_IMAGE_BREAK, CLASS_AUDIO_BREAK, CLASS_VIDEO_BREAK, CLASS_CAPTION, CLASS_RTE_CAPTION, CLASS_CAPTION_INLINE, CLASS_IMAGE_INLINE, CLASS_AUDIO_INLINE, CLASS_CLICK_ELEM, CLASS_VIDEO_CLICK_ELEM, CLASS_AUDIO, CLASS_VIDEO, CLASS_AUDIO_WRAP, CLASS_VIDEO_WRAP, CLASS_EMBED_VIDEO_WRAP, CLASS_AUDIO_FOCUS, CLASS_VIDEO_FOCUS, CLASS_VIDEO_INLINE, Lists, markerClassName, DOMNode, Alignments, Indents, Formats, LinkCommand, InsertMethods, InsertTextExec, InsertHtmlExec, InsertHtml, IsFormatted, MsWordPaste, NodeCutter, ImageCommand, AudioCommand, VideoCommand, SelectionCommands, SelectionBasedExec, ClearFormatExec, UndoRedoManager, TableCommand, statusCollection, ToolbarStatus, FormatPainterActions, EmojiPickerAction, NodeSelection, MarkdownParser, LISTS_COMMAND, selectionCommand, LINK_COMMAND, CLEAR_COMMAND, MD_TABLE, INSERT_TEXT_COMMAND, ClearFormat, MDLists, MDFormats, MarkdownSelection, UndoRedoCommands, MDSelectionFormats, MDLink, MDTable, markdownFormatTags, markdownSelectionTags, markdownListsTags, htmlKeyConfig, markdownKeyConfig, pasteCleanupGroupingTags, listConversionFilters, selfClosingTags, imageResizeFactor, KEY_DOWN, ACTION, FORMAT_TYPE, KEY_DOWN_HANDLER, LIST_TYPE, KEY_UP_HANDLER, KEY_UP, MODEL_CHANGED_PLUGIN, MODEL_CHANGED, MS_WORD_CLEANUP_PLUGIN, MS_WORD_CLEANUP, ON_BEGIN, SPACE_ACTION, FORMAT_PAINTER_ACTIONS, EMOJI_PICKER_ACTIONS, MOUSE_DOWN };
35987
36410
  //# sourceMappingURL=ej2-richtexteditor.es2015.js.map