@globalpayments/vega 2.97.0 → 2.99.0

package/dist/collection/components/vega-rich-text-editor/extensions/paste/parse-local-images-helper/paste-image-parser.js

@@ -0,0 +1,295 @@
+import { generateUUID } from '../../../../../utils/misc';
+/**
+ * Extracts pasted image files from clipboard payloads and swaps matching
+ * `<img>` elements to local object-URL previews.
+ *
+ * The parser is stateless: callers own the returned {@link PasteImagePreview}
+ * list and decide how to track pending uploads.
+ */
+export class PasteImageParser {
+  /**
+   * Parses local `file://` images from the HTML, swaps matching `<img>`
+   * elements to object-URL previews, and returns the rewritten HTML alongside
+   * the resolved pending previews.
+   *
+   * When no local images are resolved, the original HTML is returned unchanged
+   * with an empty preview list.
+   *
+   * @param {string} html HTML content to parse.
+   * @param {ClipboardFileContent | null} clipboardFileContent Clipboard payload for image extraction.
+   * @returns {ParseLocalImagesResult} Rewritten HTML and resolved previews.
+   */
+  parseLocalImages(html, clipboardFileContent) {
+    if (!html.includes('<img')) {
+      return { html, previews: [] };
+    }
+    const safeHtml = html.replace(/\s+style=/g, ' data-style=');
+    const parser = new DOMParser();
+    const parsedDoc = parser.parseFromString(safeHtml, 'text/html');
+    const localImageElements = Array.from(parsedDoc.querySelectorAll('img')).filter((img) => img.src.startsWith('file://'));
+    if (localImageElements.length === 0) {
+      return { html, previews: [] };
+    }
+    const imageFiles = this.extractImageFiles(clipboardFileContent, localImageElements);
+    if (imageFiles.length === 0) {
+      return { html, previews: [] };
+    }
+    const previews = this.createImagePreviews(localImageElements, imageFiles);
+    const rewrittenHtml = parsedDoc.body.innerHTML.replace(/ data-style=/g, ' style=');
+    return { html: rewrittenHtml, previews };
+  }
+  /**
+   * Swaps each `<img>` src to a local object-URL preview using the provided
+   * image files (paired by order), returning one preview per resolved image.
+   *
+   * Images that live inside a list are dropped instead of being previewed: the
+   * RTE does not support list images. They are removed here (after holding their
+   * position while the RTF images are paired by order) so the remaining images
+   * stay aligned with their files even when a list image is not the last one.
+   *
+   * @param {HTMLImageElement[]} images Placeholder `<img>` elements in document order.
+   * @param {File[]} files Image files to pair with the elements, in the same order.
+   * @returns {PasteImagePreview[]} Previews for the images that were resolved to a file.
+   */
+  createImagePreviews(images, files) {
+    const previews = [];
+    images.forEach((imageElement, index) => {
+      // List images have no editor representation, so drop them here instead of
+      // creating a preview. Removing them at this stage (rather than earlier)
+      // keeps the remaining images aligned with their files.
+      if (this.isListImage(imageElement)) {
+        imageElement.remove();
+        return;
+      }
+      const file = files[index];
+      if (!file) {
+        return;
+      }
+      const objectUrl = URL.createObjectURL(file);
+      imageElement.setAttribute('src', objectUrl);
+      const imageId = generateUUID();
+      imageElement.setAttribute(PasteImageParser.PREVIEW_IMG_KEY, imageId);
+      previews.push({ id: imageId, file, objectUrl });
+    });
+    return previews;
+  }
+  /**
+   * Extracts image files from clipboard data, preferring Word RTF-decoded
+   * images and falling back to the clipboard file list when RTF yields none.
+   *
+   * @param {ClipboardFileContent | null} clipboardFileContent Clipboard payload from a paste event.
+   * @param {HTMLElement[]} images `<img>` elements the files will be paired with.
+   * @returns {File[]} Image files found on the clipboard.
+   */
+  extractImageFiles(clipboardFileContent, images) {
+    let result = [];
+    if (clipboardFileContent) {
+      if (clipboardFileContent.rtf) {
+        result = this.safeExtractWordImages(clipboardFileContent.rtf, images);
+      }
+      if (result.length === 0 && clipboardFileContent.files) {
+        result = clipboardFileContent.files.filter((file) => file.type.startsWith('image/'));
+      }
+    }
+    return result;
+  }
+  /**
+   * Safely extracts image files from Word RTF clipboard data.
+   *
+   * @param {string} rtf Clipboard payload from a paste event.
+   * @param {HTMLElement[]} images Array of `<img>` elements that may be updated with staged previews.
+   * @returns {File[]} Image files found in the clipboard data.
+   */
+  safeExtractWordImages(rtf, images) {
+    // Word defines a list's picture bullet once in the list table
+    // (`{\*\listpicture ...}`) with no rendered counterpart. Drop that
+    // definition so its blip is not counted as a content image; the per-item
+    // `{\listtext ...}` bullet blips are kept because each still pairs with a
+    // preserved bullet placeholder `<img>`.
+    const contentRtf = this.stripListPictureDefinitions(rtf);
+    const fileObjects = [];
+    const imageRegex = /\\pngblip|\\jpegblip/g;
+    const matches = [...contentRtf.matchAll(imageRegex)];
+    matches.forEach((match, index) => {
+      if (index >= images.length || match.index === undefined) {
+        return;
+      }
+      const mimeType = match[0].includes('png') ? 'image/png' : 'image/jpeg';
+      const startIndex = match.index + match[0].length;
+      const bytes = this.extractImageBytes(contentRtf, startIndex);
+      if (bytes.length === 0) {
+        return;
+      }
+      const extension = mimeType.split('/')[1];
+      const file = new File(
+      // eslint-disable-next-line spellcheck/spell-checker
+      [new Uint8Array(bytes)], `word_img_${Date.now()}_${index}.${extension}`, { type: mimeType });
+      fileObjects.push(file);
+    });
+    return fileObjects;
+  }
+  /**
+   * Removes Word list-table picture-bullet definitions from the RTF so they are
+   * not counted as content images.
+   *
+   * Word declares a list's picture bullet once as a `{\*\listpicture ...}`
+   * destination inside the list table. It renders nothing on its own, so its
+   * blip has no matching content `<img>`; leaving it in shifts the ordinal
+   * pairing and makes the first real image resolve to the bullet. The per-item
+   * `{\listtext ...}` bullets are intentionally left untouched because each is
+   * kept as a placeholder `<img>` that consumes its blip downstream.
+   *
+   * @param {string} rtf Full RTF clipboard payload.
+   * @returns {string} RTF with list-table picture-bullet definitions removed.
+   */
+  stripListPictureDefinitions(rtf) {
+    // eslint-disable-next-line spellcheck/spell-checker
+    return this.removeBalancedGroups(rtf, '{\\*\\listpicture');
+  }
+  /**
+   * Removes every balanced-brace RTF group that starts with the given marker.
+   *
+   * @param {string} rtf RTF payload to scan.
+   * @param {string} marker Opening delimiter of the group to remove (including its `{`).
+   * @returns {string} RTF with the matching groups removed.
+   */
+  removeBalancedGroups(rtf, marker) {
+    let index = rtf.indexOf(marker);
+    while (index !== -1) {
+      const end = this.findGroupEnd(rtf, index);
+      rtf = rtf.slice(0, index) + rtf.slice(end);
+      index = rtf.indexOf(marker, index);
+    }
+    return rtf;
+  }
+  /**
+   * Finds the index just past the brace that closes the group opened at `start`.
+   *
+   * A backslash escapes the next character (such as `\{` or `\}`) so escaped
+   * braces are not counted. When the group is unbalanced the RTF length is
+   * returned so the trailing remainder is dropped.
+   *
+   * @param {string} rtf RTF payload to scan.
+   * @param {number} start Index of the group's opening `{`.
+   * @returns {number} Index immediately after the matching closing `}`.
+   */
+  findGroupEnd(rtf, start) {
+    const length = rtf.length;
+    let depth = 0;
+    let position = start;
+    while (position < length) {
+      const char = rtf[position];
+      if (char === '\\') {
+        position += 2;
+        continue;
+      }
+      if (char === '{') {
+        depth++;
+      }
+      else if (char === '}') {
+        depth--;
+        if (depth === 0) {
+          return position + 1;
+        }
+      }
+      position++;
+    }
+    return length;
+  }
+  /**
+   * Extracts the raw image bytes that follow a Word RTF blip marker.
+   *
+   * Starting just after the blip control word, RTF control words (such as
+   * `\bliptag`) and nested groups (such as `{\*\blipuid ...}`) are skipped so
+   * their hex is not mistaken for image data. Hex digits are decoded into bytes
+   * until the enclosing `{\pict}` group is closed.
+   *
+   * @param {string} rtf Full RTF clipboard payload.
+   * @param {number} startIndex Index immediately after the blip marker.
+   * @returns {number[]} Decoded image byte values.
+   */
+  extractImageBytes(rtf, startIndex) {
+    const length = rtf.length;
+    const bytes = [];
+    let depth = 0;
+    let highNibble = -1;
+    let position = startIndex;
+    while (position < length) {
+      const char = rtf[position];
+      if (char === '{') {
+        depth++;
+        position++;
+        continue;
+      }
+      if (char === '}') {
+        if (depth === 0) {
+          break;
+        }
+        depth--;
+        position++;
+        continue;
+      }
+      if (depth > 0) {
+        position++;
+        continue;
+      }
+      if (char === '\\') {
+        position++;
+        while (position < length && /[a-zA-Z]/.test(rtf[position])) {
+          position++;
+        }
+        if (position < length && rtf[position] === '-') {
+          position++;
+        }
+        while (position < length && /[0-9]/.test(rtf[position])) {
+          position++;
+        }
+        continue;
+      }
+      const nibble = this.hexNibble(char);
+      if (nibble >= 0) {
+        if (highNibble < 0) {
+          highNibble = nibble;
+        }
+        else {
+          bytes.push((highNibble << 4) | nibble);
+          highNibble = -1;
+        }
+      }
+      position++;
+    }
+    return bytes;
+  }
+  /**
+   * Converts a single hex character to its numeric value.
+   *
+   * @param {string} char Candidate hex character.
+   * @returns {number} Value in `[0, 15]`, or `-1` when not a hex digit.
+   */
+  hexNibble(char) {
+    if (char >= '0' && char <= '9') {
+      return char.charCodeAt(0) - 48;
+    }
+    if (char >= 'a' && char <= 'f') {
+      return char.charCodeAt(0) - 87;
+    }
+    if (char >= 'A' && char <= 'F') {
+      return char.charCodeAt(0) - 55;
+    }
+    return -1;
+  }
+  /**
+   * Returns whether an `<img>` element is nested inside list content.
+   *
+   * The Word paste sanitizer strips non-allowlisted attributes but keeps the
+   * `ul`/`ol`/`li` structure, so list membership is detected by DOM ancestry
+   * here rather than by a marker attribute set upstream.
+   *
+   * @param {HTMLImageElement} imageElement Image element to test.
+   * @returns {boolean} Whether the image is part of list content.
+   */
+  isListImage(imageElement) {
+    return Boolean(imageElement.closest('li,ul,ol'));
+  }
+}
+PasteImageParser.PREVIEW_IMG_KEY = 'data-rte-id';

package/dist/collection/components/vega-rich-text-editor/extensions/paste/parse-local-images-helper/pending-image-registry.js

@@ -0,0 +1,116 @@
+import { ImageReplaceSrcAction } from '../actions/image-replace-src-action';
+/**
+ * Owns the lifecycle of pasted images awaiting upload: it tracks their local
+ * object-URL previews, notifies the consumer once they are inserted, applies the
+ * uploaded URL back onto the live preview, and revokes object URLs on teardown.
+ *
+ * Keeping this state here rather than on the paste extension keeps the extension
+ * focused on clipboard capture and the chooser UI.
+ */
+export class PendingImageRegistry {
+  constructor() {
+    /** Ids of pending images still holding an object URL owned by this registry. */
+    this.ownedImageIds = new Set();
+    /** Ids queued for the next {@link notifyInserted} call. */
+    this.pendingNotifyImageIds = [];
+  }
+  /**
+   * Registers freshly created previews so they can be notified and later
+   * resolved to their uploaded URLs.
+   *
+   * @param {PasteImagePreview[]} previews Previews produced for the current paste.
+   */
+  register(previews) {
+    this.pendingNotifyImageIds = [];
+    previews.forEach((preview) => {
+      this.pendingNotifyImageIds.push(preview.id);
+      this.ownedImageIds.add(preview.id);
+      PendingImageRegistry.pendingImages.set(preview.id, preview);
+    });
+  }
+  /**
+   * @returns {boolean} Whether previews are queued for notification.
+   */
+  hasPendingNotifications() {
+    return this.pendingNotifyImageIds.length > 0;
+  }
+  /**
+   * Notifies the consumer about newly inserted pasted images so they can upload
+   * them and fill in the real URLs via the supplied `replaceUrl` callback.
+   *
+   * @param {ImageInsertedCallback | undefined} callback Consumer callback to invoke.
+   * @param {GetEditableElement} getEditableElement Resolves the live editable element.
+   * @param {ResolveImageNode} resolveImageNode Resolves the DTO node for a preview element.
+   */
+  notifyInserted(callback, getEditableElement, resolveImageNode) {
+    const images = this.pendingNotifyImageIds
+      .map((id) => PendingImageRegistry.pendingImages.get(id))
+      .filter((preview) => !!preview);
+    this.pendingNotifyImageIds = [];
+    if (images.length && typeof callback === 'function') {
+      // Mark as handed to the consumer so teardown keeps them for a later replaceUrl.
+      images.forEach((image) => (image.notified = true));
+      const pasteImages = images.map((image) => ({
+        id: image.id,
+        file: image.file,
+      }));
+      callback(pasteImages, (imageId, url) => this.replaceUrl(imageId, url, getEditableElement, resolveImageNode));
+    }
+  }
+  /**
+   * Revokes and forgets only previews that were never handed to a consumer for
+   * upload. Previews already notified via {@link notifyInserted} are left intact
+   * so an async {@link replaceUrl} can still resolve them after the extension is
+   * recreated; that callback owns their teardown.
+   */
+  discardUnsentPreviews() {
+    this.ownedImageIds.forEach((imageId) => {
+      const pending = PendingImageRegistry.pendingImages.get(imageId);
+      if (pending && pending.notified) {
+        return;
+      }
+      if (pending && pending.objectUrl.startsWith('blob:')) {
+        URL.revokeObjectURL(pending.objectUrl);
+      }
+      PendingImageRegistry.pendingImages.delete(imageId);
+      this.ownedImageIds.delete(imageId);
+    });
+    this.pendingNotifyImageIds = [];
+  }
+  /**
+   * Applies the uploaded URL for a pending pasted image, replacing its local
+   * preview `src` and revoking the object URL.
+   *
+   * @param {string} imageId Pending image id supplied to the consumer callback.
+   * @param {string} url Uploaded image URL to apply.
+   * @param {GetEditableElement} getEditableElement Resolves the live editable element.
+   * @param {ResolveImageNode} resolveImageNode Resolves the DTO node for a preview element.
+   */
+  replaceUrl(imageId, url, getEditableElement, resolveImageNode) {
+    var _a;
+    const editableEl = getEditableElement();
+    if (editableEl) {
+      const imageElement = (_a = editableEl.querySelector(`img[data-rte-id="${imageId}"]`)) !== null && _a !== void 0 ? _a : null;
+      if (imageElement) {
+        const imageNode = resolveImageNode(imageElement);
+        imageNode && imageNode.apply(new ImageReplaceSrcAction(imageElement, url));
+      }
+    }
+    const pending = PendingImageRegistry.pendingImages.get(imageId);
+    if (pending) {
+      if (pending.objectUrl.startsWith('blob:')) {
+        URL.revokeObjectURL(pending.objectUrl);
+      }
+      PendingImageRegistry.pendingImages.delete(imageId);
+      this.ownedImageIds.delete(imageId);
+    }
+  }
+}
+/**
+ * Pasted images awaiting upload, keyed by their {@link VegaRTEPasteImage.id}.
+ *
+ * Shared statically across instances so previews survive a paste-extension
+ * re-instantiation: the consumer may resolve `replaceUrl` after the editor
+ * has re-mounted and created a new extension/registry instance.
+ */
+PendingImageRegistry.pendingImages = new Map();

package/dist/collection/components/vega-rich-text-editor/extensions/paste/paste-chooser-ui.js

@@ -1,13 +1,15 @@
 import { VegaInternalIconManager } from '../../../../helpers/icon/internal-icon-manager';
 import { VegaInternalTranslation } from '../../../../helpers/translation/internal-translation-controller';
+import { RTEPasteMode } from './strategies/paste-processing-strategy.abstract';
 import paste from './assets/paste';
 /**
  * Renders and manages the paste format chooser UI.
  */
 export class RTEPasteChooserUI {
-  constructor(hostRoot, callbacks) {
+  constructor(hostRoot, callbacks, options = {}) {
     this.hostRoot = hostRoot;
     this.callbacks = callbacks;
+    this.options = options;
     this.chooserEl = null;
     this.dropdownEl = null;
     this.triggerButtonEl = null;
@@ -108,11 +110,17 @@ export class RTEPasteChooserUI {
     dropdownEl.append(tooltipEl);
     const itemsContainer = doc.createElement('div');
     itemsContainer.setAttribute('slot', 'items');
-    itemsContainer.append(this.createDropdownItem(doc, 'rich', VegaInternalTranslation.t('Use rich text'), RTEPasteChooserUI.CHOOSER_RICH_ATTR));
+    const dropdownItems = [
+      this.createDropdownItem(doc, RTEPasteMode.RICH, VegaInternalTranslation.t('Use rich text'), RTEPasteChooserUI.CHOOSER_RICH_ATTR),
+    ];
+    if (this.options.showWordOption) {
+      dropdownItems.push(this.createDropdownItem(doc, RTEPasteMode.WORD, VegaInternalTranslation.t('Use Word'), RTEPasteChooserUI.CHOOSER_WORD_ATTR));
+    }
+    itemsContainer.append(...dropdownItems);
     dropdownEl.append(itemsContainer);
     dropdownEl.addEventListener('vegaDropdownClick', (event) => {
       const mode = event.detail;
-      if (mode === 'rich') {
+      if (mode === RTEPasteMode.RICH || mode === RTEPasteMode.WORD) {
         this.callbacks.onModeSelect(mode);
       }
     });
@@ -122,7 +130,7 @@ export class RTEPasteChooserUI {
    * Creates a single dropdown item element for a paste mode.
    *
    * @param {Document} doc Document used to create the element.
-   * @param {PasteMode} key Paste mode key for the item.
+   * @param {RTEPasteMode} key Paste mode key for the item.
    * @param {string} label Display label for the item.
    * @param {string} dataAttrName Data attribute marker for the item.
    * @returns {HTMLVegaDropdownItemElement} Configured dropdown item element.
@@ -142,4 +150,5 @@ export class RTEPasteChooserUI {
 })();
 RTEPasteChooserUI.CHOOSER_ATTR = 'data-rte-paste-chooser';
 RTEPasteChooserUI.CHOOSER_RICH_ATTR = 'data-rte-paste-type-rich';
+RTEPasteChooserUI.CHOOSER_WORD_ATTR = 'data-rte-paste-type-word';
 RTEPasteChooserUI.CHOOSER_TRIGGER_ATTR = 'data-rte-paste-trigger';

package/dist/collection/components/vega-rich-text-editor/extensions/paste/paste-extension.js

@@ -1,19 +1,32 @@
 import { VegaRTEExtension } from '../extension.abstract';
 import { RTEPasteChooserUI } from './paste-chooser-ui';
-import { RTE_PASTE_MODE_DATA_TYPE } from './paste-constants';
+import { RTE_PASTE_MODE_DATA_TYPE } from '../../constants/constant';
+import { PasteStrategySelector } from './strategies/paste-strategy-selector';
+import { RTEPasteMode, } from './strategies/paste-processing-strategy.abstract';
+import { PasteImageParser } from './parse-local-images-helper/paste-image-parser';
+import { RTEImageNode } from '../../dto/nodes/image-node';
+import { REPLACE_IMAGE_SRC } from './actions/image-replace-src-action';
+import { ImageReplaceSrcStrategy } from './action-handler-strategies/image-replace-src-strategy';
+import { PendingImageRegistry } from './parse-local-images-helper/pending-image-registry';
 /**
  * Vega Rich Text Editor paste extension.
  * Intercepts keyboard paste and allows users to choose paste mode.
  */
 export class VegaRTEPasteExtension extends VegaRTEExtension {
-  constructor() {
-    super(...arguments);
+  constructor(options = {}) {
+    super();
     this.editableEl = null;
     this.contentHostEl = null;
     this.chooserUI = null;
     this.pendingPastePayload = null;
     this.listenerDocument = null;
     this.listenerWindow = null;
+    this.options = {};
+    this.strategySelector = new PasteStrategySelector();
+    this.clipboardFileContent = null;
+    this.imageParser = new PasteImageParser();
+    /** Owns pending pasted-image previews awaiting upload and their URL replacement. */
+    this.pendingImageRegistry = new PendingImageRegistry();
     /**
      * Handles a native paste event by capturing the clipboard payload and
      * rendering the paste-mode chooser.
@@ -29,6 +42,9 @@ export class VegaRTEPasteExtension extends VegaRTEExtension {
       // HTML is sanitized via DOMParser and ElementToDtoStrategyProcessor pipeline
       const html = clipboardData.getData('text/html') || '';
       const text = clipboardData.getData('text/plain') || '';
+      // RTF must be read synchronously here: the paste event's DataTransfer is only
+      // readable during event dispatch, so reading it later (after the chooser) returns ''.
+      const rtf = clipboardData.getData('text/rtf') || '';
       if (!html && !text) {
         // Empty clipboard paste should not mutate editor content.
         event.preventDefault();
@@ -40,6 +56,10 @@ export class VegaRTEPasteExtension extends VegaRTEExtension {
       const range = this.cloneCurrentSelectionRange();
       const selectedNodes = ((_b = (_a = this.extensionContext) === null || _a === void 0 ? void 0 : _a.getSelectedNodes) === null || _b === void 0 ? void 0 : _b.call(_a)) || [];
       this.pendingPastePayload = { html, text, range, selectedNodes: [...selectedNodes] };
+      this.clipboardFileContent = {
+        files: clipboardData.files ? Array.from(clipboardData.files) : [],
+        rtf,
+      };
       this.renderPasteChooser(event);
     };
     /**
@@ -73,6 +93,7 @@ export class VegaRTEPasteExtension extends VegaRTEExtension {
     this.handleOutsideScroll = () => {
       this.clearPasteChooser();
     };
+    this.options = options;
   }
   /** @inheritDoc */
   initialExtensionAfterLoad(context) {
@@ -84,6 +105,7 @@ export class VegaRTEPasteExtension extends VegaRTEExtension {
   destroyExtension() {
     this.detachPasteListener();
     this.clearPasteChooser();
+    this.pendingImageRegistry.discardUnsentPreviews();
   }
   /**
    * Attaches the paste listener to the editable element.
@@ -146,7 +168,7 @@ export class VegaRTEPasteExtension extends VegaRTEExtension {
    * @param {ClipboardEvent} pasteEvent Originating paste event used for positioning.
    */
   renderPasteChooser(pasteEvent) {
-    var _a, _b;
+    var _a, _b, _c;
     const hostRoot = (_b = (_a = this.hostEl) === null || _a === void 0 ? void 0 : _a.shadowRoot) !== null && _b !== void 0 ? _b : null;
     if (!hostRoot) {
       return;
@@ -158,6 +180,8 @@ export class VegaRTEPasteExtension extends VegaRTEExtension {
       onModeSelect: (mode) => {
         this.applyPasteMode(mode);
       },
+    }, {
+      showWordOption: ((_c = this.options) === null || _c === void 0 ? void 0 : _c.enableWordPaste) === true,
     });
     this.chooserUI.open(position);
     this.listenerDocument = this.hostEl.ownerDocument;
@@ -287,7 +311,10 @@ export class VegaRTEPasteExtension extends VegaRTEExtension {
   /**
    * Applies the chosen paste mode by dispatching a synthetic paste input event.
    *
-   * @param {PasteMode} mode Selected paste mode.
+   * `rich` keeps auto-detection enabled; any other explicit mode forces the
+   * corresponding registered strategy.
+   *
+   * @param {RTEPasteMode} mode Selected paste mode.
    */
   applyPasteMode(mode) {
     var _a;
@@ -303,9 +330,42 @@ export class VegaRTEPasteExtension extends VegaRTEExtension {
     editableEl.focus();
     this.restoreSelectionRange(this.pendingPastePayload.range);
     this.restoreSelectionControllerState(this.pendingPastePayload);
-    const dataTransfer = this.createDataTransfer(this.pendingPastePayload.html, this.pendingPastePayload.text, mode);
+    const strategy = mode === RTEPasteMode.RICH
+      ? this.strategySelector.selectStrategy(this.pendingPastePayload.html)
+      : this.strategySelector.selectStrategyByType(mode);
+    let processedHtml = strategy.process(this.pendingPastePayload.html);
+    // If the strategy supports image processing and there is clipboard file content, parse local images.
+    if (strategy.supportsImageProcessing && this.clipboardFileContent) {
+      processedHtml = this.parseLocalImages(processedHtml, this.clipboardFileContent);
+    }
+    this.clipboardFileContent = null;
+    const dataTransfer = this.createDataTransfer(processedHtml, this.pendingPastePayload.text, strategy.type);
     this.dispatchBeforeInputPaste(editableEl, dataTransfer);
     this.clearPasteChooser();
+    this.emitLocalImageInsertedEvent();
+  }
+  /**
+   * Parses local images from the HTML and emits events for further processing.
+   *
+   * @param {string} html HTML content to parse.
+   * @param {ClipboardFileContent} clipboardFileContent Clipboard file content for image extraction.
+   * @returns {string} Processed HTML with local image references replaced.
+   */
+  parseLocalImages(html, clipboardFileContent) {
+    const { html: result, previews } = this.imageParser.parseLocalImages(html, clipboardFileContent);
+    if (previews.length > 0) {
+      this.pendingImageRegistry.register(previews);
+    }
+    return result;
+  }
+  /**
+   * Emits the `imageInsertedCallback` for any pending previews, allowing the
+   * consumer to upload them and resolve their URLs.
+   */
+  emitLocalImageInsertedEvent() {
+    if (this.pendingImageRegistry.hasPendingNotifications()) {
+      this.pendingImageRegistry.notifyInserted(this.options.imageInsertedCallback, () => { var _a; return (_a = this.editableEl) !== null && _a !== void 0 ? _a : this.getEditableElement(); }, (imageElement) => this.getDTOEntityByDom(imageElement));
+    }
   }
   /**
    * Restores SelectionController state from the captured selection so synthetic
@@ -379,7 +439,7 @@ export class VegaRTEPasteExtension extends VegaRTEExtension {
    *
    * @param {string} html HTML clipboard content.
    * @param {string} text Plain text clipboard content.
-   * @param {PasteMode} [mode] Selected paste mode marker.
+   * @param {RTEPasteMode} [mode] Selected paste mode marker.
    * @returns {DataTransfer} Populated data transfer payload.
    */
   createDataTransfer(html, text, mode) {
@@ -440,3 +500,6 @@ export class VegaRTEPasteExtension extends VegaRTEExtension {
     }
   }
 }
+(() => {
+  VegaRTEExtension.registerActionHandleStrategy(RTEImageNode.name, REPLACE_IMAGE_SRC, new ImageReplaceSrcStrategy());
+})();

package/dist/collection/components/vega-rich-text-editor/extensions/paste/strategies/default-paste-strategy.js

@@ -0,0 +1,38 @@
+import { AbstractPasteProcessingStrategy, PasteProcessingStrategyPriority, } from './paste-processing-strategy.abstract';
+/**
+ * Default paste processing strategy that acts as a fallback when no other
+ * strategy matches. This strategy always accepts the content and passes it
+ * through unchanged — the normal RTE paste pipeline (DOMParser +
+ * ElementToDtoStrategyProcessor) handles the rest.
+ */
+export class DefaultPasteProcessingStrategy extends AbstractPasteProcessingStrategy {
+  /**
+   * Always matches as the terminal fallback strategy.
+   *
+   * @param {string} html Raw clipboard HTML.
+   * @returns {boolean} Always `true`.
+   */
+  canHandle(html) {
+    // Default strategy is the fallback — always returns true.
+    return html !== undefined;
+  }
+  /**
+   * Returns the original HTML unchanged.
+   *
+   * @param {string} html Raw clipboard HTML.
+   * @returns {string} Unchanged HTML.
+   */
+  process(html) {
+    // Current default behavior: pass through unchanged
+    // (DOMParser + ElementToDtoStrategyProcessor handles the rest)
+    return html;
+  }
+  /**
+   * Fallback priority so other strategies can win when matched.
+   *
+   * @returns {number} Strategy priority.
+   */
+  get priority() {
+    return PasteProcessingStrategyPriority.DEFAULT_FALLBACK;
+  }
+}