@syncfusion/ej2-richtexteditor 29.2.4-795127 → 29.2.4-803054

package/package.json

@@ -80,6 +80,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "29.2.4-795127",
+  "version": "29.2.4-803054",
   "sideEffects": false
 }

package/src/rich-text-editor/actions/paste-clean-up.d.ts

@@ -33,6 +33,10 @@ export declare class PasteCleanup {
     private destroy;
     private removeEventListener;
     private pasteClean;
+    private findSource;
+    private extractImageSrcDOM;
+    private fetchImageWithMetadata;
+    private getFilenameFromUrl;
     private splitBreakLine;
     private makeSpace;
     private imgUploading;

package/src/rich-text-editor/actions/paste-clean-up.js

@@ -1,7 +1,7 @@
 import * as events from '../base/constant';
 import { Popup } from '@syncfusion/ej2-popups';
 import { RadioButton } from '@syncfusion/ej2-buttons';
-import { isNullOrUndefined as isNOU, isNullOrUndefined, detach, extend, addClass, removeClass } from '@syncfusion/ej2-base';
+import { isNullOrUndefined as isNOU, isNullOrUndefined, detach, extend, addClass, removeClass, createElement } from '@syncfusion/ej2-base';
 import { getUniqueID, Browser, closest } from '@syncfusion/ej2-base';
 import { CLS_RTE_PASTE_KEEP_FORMAT, CLS_RTE_PASTE_REMOVE_FORMAT, CLS_RTE_PASTE_PLAIN_FORMAT } from '../base/classes';
 import { CLS_RTE_PASTE_OK, CLS_RTE_PASTE_CANCEL, CLS_RTE_DIALOG_MIN_HEIGHT } from '../base/classes';
@@ -13,6 +13,7 @@ import { Uploader } from '@syncfusion/ej2-inputs';
 import * as classes from '../base/classes';
 import { sanitizeHelper, convertToBlob } from '../base/util';
 import { scrollToCursor } from '../../common/util';
+import { PASTE_SOURCE } from './../../editor-manager/base';
 /**
  * PasteCleanup module called when pasting content in RichTextEditor
  */
@@ -113,7 +114,11 @@ var PasteCleanup = /** @class */ (function () {
         if (e.args && value !== null && this.parent.editorMode === 'HTML') {
             var file = void 0;
             var files = e.args.clipboardData.files;
-            if (value.length === 0 || (!isNOU(files) && files.length > 0)) {
+            var elm = createElement('p');
+            elm.innerHTML = value;
+            var source = this.findSource(elm);
+            var extractedSRC = this.parent.insertImageSettings.uploadRemoteURLs ? this.extractImageSrcDOM(value) : null;
+            if (value.length === 0 || (!isNOU(files) && files.length > 0 && source === 'html')) {
                 var htmlRegex = new RegExp(/<\/[a-z][\s\S]*>/i);
                 value = e.args.clipboardData.getData('text/plain');
                 this.parent.trigger(events.beforePasteCleanup, { value: value });
@@ -156,6 +161,14 @@ var PasteCleanup = /** @class */ (function () {
                     value = divElement.innerHTML;
                 }
             }
+            else if (Array.isArray(extractedSRC) && extractedSRC.length &&
+                this.parent.insertImageSettings.saveUrl && this.parent.insertImageSettings.path) {
+                this.parent.trigger(events.beforePasteCleanup, { value: value });
+                for (var i = 0; i < extractedSRC.length; i++) {
+                    var src = extractedSRC[i];
+                    this.fetchImageWithMetadata(src);
+                }
+            }
             else if (value.length > 0) {
                 this.parent.trigger(events.beforePasteCleanup, { value: value });
                 this.parent.formatter.editorManager.observer.notify(EVENTS.MS_WORD_CLEANUP, {
@@ -212,6 +225,69 @@ var PasteCleanup = /** @class */ (function () {
             }
         }
     };
+    PasteCleanup.prototype.findSource = function (element) {
+        var metaNodes = element.querySelectorAll('meta');
+        for (var i = 0; i < metaNodes.length; i++) {
+            var metaNode = metaNodes[i];
+            var content = metaNode.getAttribute('content');
+            var name_1 = metaNode.getAttribute('name');
+            if (name_1 && name_1.toLowerCase().indexOf('generator') >= 0 && content && content.toLowerCase().indexOf('microsoft') >= 0) {
+                for (var j = 0; j < PASTE_SOURCE.length; j++) {
+                    if (content.toLowerCase().indexOf(PASTE_SOURCE[j]) >= 0) {
+                        return PASTE_SOURCE[j];
+                    }
+                }
+            }
+        }
+        return 'html';
+    };
+    PasteCleanup.prototype.extractImageSrcDOM = function (value) {
+        if (!value || typeof value !== 'string') {
+            return null;
+        }
+        var parser = new DOMParser();
+        var doc = parser.parseFromString(value, 'text/html');
+        var images = doc.querySelectorAll('img');
+        if (images.length === 0) {
+            return null;
+        }
+        var srcs = Array.from(images)
+            .map(function (img) { return img.getAttribute('src') || img.src || ''; })
+            .map(function (src) { return src.trim(); })
+            .filter(function (src) { return !!src; })
+            // Exclude base64/data URLs, blob URLs, and anything containing "id="
+            .filter(function (src) {
+            var s = src.toLowerCase();
+            return !s.startsWith('data:') && !s.includes('base64') && !s.startsWith('blob:') && !s.includes('id=');
+        });
+        return srcs.length ? srcs : null;
+    };
+    PasteCleanup.prototype.fetchImageWithMetadata = function (url) {
+        var _this = this;
+        fetch(url)
+            .then(function (response) {
+            if (!response.ok) {
+                console.warn("Fetch status " + response.status + " for: " + url);
+                return null;
+            }
+            return response.blob();
+        })
+            .then(function (blob) {
+            if (blob) {
+                var filename = _this.getFilenameFromUrl(url) || 'downloaded-image.jpg';
+                var mimeType = blob.type || 'image/jpeg';
+                var file = new File([blob], filename, { type: mimeType });
+                var imageElement = _this.parent.inputElement.querySelector("img[src=\"" + url + "\"]");
+                _this.uploadMethod(file, imageElement);
+            }
+        });
+    };
+    // Helper method to extract filename from URL
+    PasteCleanup.prototype.getFilenameFromUrl = function (url) {
+        var pathname = new URL(url).pathname;
+        var filename = pathname.substring(pathname.lastIndexOf('/') + 1);
+        return filename || 'image.jpg';
+    };
     PasteCleanup.prototype.splitBreakLine = function (value) {
         var enterSplitText = value.split('\r\n\r\n');
         var finalText = '';

package/src/rich-text-editor/models/toolbar-settings-model.d.ts

@@ -227,6 +227,13 @@ export interface ImageSettingsModel {
      */
     resizeByPercent?: boolean;
 
+    /**
+     * Specifies whether to allow uploading remote image URLs.
+     *
+     * @default false
+     */
+    uploadRemoteURLs?: boolean;
+
 }
 
 /**

package/src/rich-text-editor/models/toolbar-settings.d.ts

@@ -201,6 +201,12 @@ export declare class ImageSettings extends ChildProperty<ImageSettings> {
      * @default false
      */
     resizeByPercent: boolean;
+    /**
+     * Specifies whether to allow uploading remote image URLs.
+     *
+     * @default false
+     */
+    uploadRemoteURLs: boolean;
 }
 /**
  * Configures the audio settings of the RichTextEditor.

package/src/rich-text-editor/models/toolbar-settings.js

@@ -155,6 +155,9 @@ var ImageSettings = /** @class */ (function (_super) {
     __decorate([
         Property(false)
     ], ImageSettings.prototype, "resizeByPercent", void 0);
+    __decorate([
+        Property(false)
+    ], ImageSettings.prototype, "uploadRemoteURLs", void 0);
     return ImageSettings;
 }(ChildProperty));
 export { ImageSettings };