@globalpayments/vega 2.57.1 → 2.59.0

package/dist/cjs/{component-value-history-controller-slimmer.abstract-a6e4e5bc.js → component-value-history-controller-slimmer.abstract-34f4577a.js}

@@ -1,16 +1,17 @@
 'use strict';
 
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
+const codeBlock = require('./code-block-4bfae76d.js');
 const timer = require('./timer-5f33058b.js');
-const codeBlock = require('./code-block-7650c868.js');
 const component = require('./component-1e352960.js');
 const changeManager = require('./change-manager-a297e4d2.js');
-const domNodeSubjectFactory = require('./dom-node-subject-factory-769dd00f.js');
-const vegaInternalEventId = require('./vega-internal-event-id-bda08efa.js');
+const domNodeSubjectFactory = require('./dom-node-subject-factory-bad99695.js');
+const vegaInternalEventId = require('./vega-internal-event-id-ae6e2c13.js');
 const observer = require('./observer-f49483e8.js');
-const ui = require('./ui-6c069604.js');
+const ui = require('./ui-4ce1fa08.js');
 const synchronizeTaskQueue = require('./synchronize-task-queue-1ee80e94.js');
-const keyboardManagerSlimmer = require('./keyboard-manager-slimmer-92c7227b.js');
+const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-df6e6df0.js');
+const keyboardManagerSlimmer = require('./keyboard-manager-slimmer-faca2038.js');
 
 let processing = false;
 /**
@@ -121,20 +122,22 @@ class ShadowSelectionPolyfill {
   getFirefoxSelection() {
     // eslint-disable-next-line no-restricted-globals
     const selection = document.getSelection();
-    const range = selection.getRangeAt(0);
-    const startNode = range.startContainer;
-    const endNode = range.endContainer;
-    if (startNode !== endNode && startNode.textContent.length === range.startOffset) {
-      const nextSibling = startNode.nodeType === Node.TEXT_NODE
-        ? startNode.parentNode.nextSibling
-        : startNode.nextSibling;
-      range.setStart(nextSibling.firstChild, 0);
-    }
-    if (endNode !== startNode && range.endOffset === 0) {
-      const previousSibling = endNode.nodeType === Node.TEXT_NODE
-        ? endNode.parentNode.previousSibling
-        : endNode.previousSibling;
-      range.setEnd(previousSibling.lastChild, previousSibling.lastChild.textContent.length);
+    if (selection.rangeCount > 0) {
+      const range = selection.getRangeAt(0);
+      const startNode = range.startContainer;
+      const endNode = range.endContainer;
+      if (startNode !== endNode && startNode.textContent.length === range.startOffset) {
+        const nextSibling = startNode.nodeType === Node.TEXT_NODE
+          ? startNode.parentNode.nextSibling
+          : startNode.nextSibling;
+        range.setStart(nextSibling.firstChild, 0);
+      }
+      if (endNode !== startNode && range.endOffset === 0) {
+        const previousSibling = endNode.nodeType === Node.TEXT_NODE
+          ? endNode.parentNode.previousSibling
+          : endNode.previousSibling;
+        range.setEnd(previousSibling.lastChild, previousSibling.lastChild.textContent.length);
+      }
     }
     return selection;
   }
@@ -319,8 +322,8 @@ class RTERange {
     if (startNode instanceof codeBlock.RTENode) {
       this._startNode = startNode;
       this._endNode = endNode;
-      const startContainer = this.getElementByRTENode(this._startNode);
-      const endContainer = this._startNode === this._endNode ? startContainer : this.getElementByRTENode(this._endNode);
+      const startContainer = this._startNode.getRangeContainer();
+      const endContainer = this._startNode === this._endNode ? startContainer : this._endNode.getRangeContainer();
       if (startContainer) {
         this._startContainer = startContainer;
         this._endContainer = endContainer;
@@ -357,37 +360,26 @@ class RTERange {
    * @returns {Nullable<Range>} The range instance. The return value could be null if the start node or end node are not rendered.
    */
   toNativeRange() {
-    const startContainer = this.getElementByRTENode(this._startNode);
-    const endContainer = this._startNode === this._endNode ? startContainer : this.getElementByRTENode(this._endNode);
-    const range = new Range();
-    if (startContainer && endContainer) {
-      range.setStart(startContainer, this._startOffset);
-      range.setEnd(endContainer, this._endOffset);
-      this._startContainer = startContainer;
-      this._endContainer = endContainer;
-      this._oldNativeRange = range;
-      return range;
+    let range = null;
+    if (this._startNode) {
+      const startContainer = this._startNode.getRangeContainer();
+      const endContainer = this._startNode === this._endNode
+        ? startContainer
+        : this._endNode.getRangeContainer();
+      if (startContainer && endContainer) {
+        range = new Range();
+        range.setStart(startContainer, this._startOffset);
+        range.setEnd(endContainer, this._endOffset);
+        this._startContainer = startContainer;
+        this._endContainer = endContainer;
+        this._oldNativeRange = range;
+        return range;
+      }
     }
-    else if (this._oldNativeRange) {
+    if (!range && this._oldNativeRange) {
       return this._oldNativeRange;
     }
   }
-  /**
-   * Retrieves the DOM element associated with a given RTENode entity.
-   *
-   * @param {Nullable<RTENode>} node - Represents a node in a Rich Text Editor.
-   * @returns {Nullable<Node>} a Node object or null.
-   */
-  getElementByRTENode(node) {
-    if (node) {
-      const element = codeBlock.stateEntityRenderingRegistry.getDOMByEntity(node);
-      if (element) {
-        return node instanceof codeBlock.RTEImageNode
-          ? ui.findParent(element, 'vega-rich-text-image-editor')
-          : element.firstChild;
-      }
-    }
-  }
   /**
    * Retrieves an RTENode based on the given element by checking its type and parent elements.
    *
@@ -398,8 +390,8 @@ class RTERange {
     if (element) {
       const registerElement = element.nodeType === Node.TEXT_NODE
         ? element.parentElement
-        : element.nodeName === 'VEGA-RICH-TEXT-IMAGE-EDITOR'
-          ? element.querySelector('img')
+        : ui.isHTMLElement(element) && codeBlock.RTEDecoratorNode.isDecoratorNodeContainerElement(element)
+          ? codeBlock.RTEDecoratorNode.getDecoratorNodeElement(element)
           : element;
       return codeBlock.stateEntityRenderingRegistry.getEntityByDOM(registerElement);
     }
@@ -462,6 +454,7 @@ class SelectionController extends AutoRunWhenReRenderTaskQueueSlimmer {
    */
   disconnectedCallback() {
     changeManager.ChangeManager.unregister(domNodeSubjectFactory.domNodeSubjectFactory.getSubject(this.host, vegaInternalEventId.VegaInternalRichTextEditorSelectionRangeChange), this.selectionRangeChangeObserver);
+    domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.host, vegaInternalEventId.VegaInternalUpdateRTECursorPosition);
   }
   /**
    * Component lifecycle - [componentDidLoad]{@link VegaRichTextEditor.componentDidLoad}
@@ -469,6 +462,7 @@ class SelectionController extends AutoRunWhenReRenderTaskQueueSlimmer {
   componentDidLoad() {
     // eslint-disable-next-line no-restricted-globals
     document.addEventListener('selectionchange', this.handleSelectionWithDebounce);
+    this.registerUpdateCaretPositionObserver();
   }
   /**
    * Watches the internal value of the editor
@@ -590,7 +584,7 @@ class SelectionController extends AutoRunWhenReRenderTaskQueueSlimmer {
    * Get selected rich text
    */
   handleSelectionChange() {
-    if (this.disabled)
+    if (this.disabled || this.sourceView)
       return;
     const selection = this.getSelection();
     if (!selection || selection.rangeCount === 0)
@@ -603,6 +597,7 @@ class SelectionController extends AutoRunWhenReRenderTaskQueueSlimmer {
     /**
      * Rich text node filter
      *
+     * @todo refactor the function by a handlers chain https://gethired.atlassian.net/browse/VD-7132
      * @param {Node} node - Start node
      */
     const filterNode = (node) => {
@@ -617,9 +612,9 @@ class SelectionController extends AutoRunWhenReRenderTaskQueueSlimmer {
           return;
         }
       }
-      if (node.nodeType === Node.ELEMENT_NODE) {
-        const entityElement = node.nodeName === 'VEGA-RICH-TEXT-IMAGE-EDITOR'
-          ? node.querySelector('img')
+      if (ui.isHTMLElement(node)) {
+        const entityElement = codeBlock.RTEDecoratorNode.isDecoratorNodeContainerElement(node)
+          ? codeBlock.RTEDecoratorNode.getDecoratorNodeElement(node)
           : node;
         const nodeEntity = codeBlock.stateEntityRenderingRegistry.getEntityByDOM(entityElement);
         if (nodeEntity instanceof codeBlock.RTECodeBlock) {
@@ -632,6 +627,11 @@ class SelectionController extends AutoRunWhenReRenderTaskQueueSlimmer {
           selectedNodes.push(nodeEntity);
           return;
         }
+        // If no node is selected, try to get the nearest node from the current range and set the range to it
+        if (nodeEntity instanceof codeBlock.RTEBlock && range.collapsed) {
+          this.tryToFindTheNearestSelectedNode(range, selectedNodes);
+          return;
+        }
       }
       node.childNodes.forEach(filterNode);
     };
@@ -715,6 +715,61 @@ class SelectionController extends AutoRunWhenReRenderTaskQueueSlimmer {
       this.pendingRestoreSelectionNodes = [];
     }
   }
+  /**
+   * Register the update caret position observer.
+   */
+  registerUpdateCaretPositionObserver() {
+    domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(this.host, vegaInternalEventId.VegaInternalUpdateRTECursorPosition, (payload) => {
+      const { node, updateDirectly } = payload;
+      const offset = typeof payload.offset === 'number' ? payload.offset : node.getRangeEndOffset();
+      this.enqueueSelectionRangeFutureState(node, offset, node, offset, updateDirectly);
+    });
+  }
+  /**
+   * If no node is selected, try to get the nearest node from the current range and set the range to it
+   *
+   * @param {Range} range - The current range
+   * @param {RTENode[]} selectedNodes - The selected nodes array
+   */
+  tryToFindTheNearestSelectedNode(range, selectedNodes) {
+    const { startContainer, startOffset, collapsed } = range;
+    if (selectedNodes.length === 0 && ui.isHTMLElement(startContainer) && collapsed) {
+      const entity = codeBlock.stateEntityRenderingRegistry.getEntityByDOM(startContainer);
+      if (entity instanceof codeBlock.RTEBlock && entity.children.length >= startOffset) {
+        const nearestFocusState = this.detectNearestElement(entity, startOffset);
+        if (nearestFocusState) {
+          const { startNode, startOffset } = nearestFocusState;
+          selectedNodes.push(startNode);
+          this.currentRange = this.currentRange.updateRTERange({ startNode, endNode: startNode, startOffset, endOffset: startOffset }, range);
+        }
+      }
+    }
+  }
+  /**
+   * Detects the nearest element in the block at the given offset.
+   *
+   * @param {RTEBlock} block - The block to search within.
+   * @param {number} offset - The offset to search from.
+   * @returns {Nullable<FocusNodeRangeState>} - The detected element's range state or null if not found.
+   */
+  detectNearestElement(block, offset) {
+    if (block.children) {
+      const currentNode = block.children[offset];
+      const prevNode = block.children[offset - 1];
+      if (currentNode && currentNode instanceof codeBlock.RTENode) {
+        return {
+          startNode: currentNode,
+          startOffset: 0,
+        };
+      }
+      else if (prevNode && prevNode instanceof codeBlock.RTENode) {
+        return {
+          startNode: prevNode,
+          startOffset: prevNode.getRangeEndOffset(),
+        };
+      }
+    }
+  }
 }
 SelectionController.SELECTION_CHANGE_DEBOUNCE_TIME = 50;
 __decorate([
@@ -732,6 +787,9 @@ __decorate([
 __decorate([
   globalSlimmerRegistry.MapToComponentField()
 ], SelectionController.prototype, "disabled", void 0);
+__decorate([
+  globalSlimmerRegistry.MapToComponentField()
+], SelectionController.prototype, "sourceView", void 0);
 __decorate([
   globalSlimmerRegistry.MapToComponentField()
 ], SelectionController.prototype, "valueController", void 0);