@globalpayments/vega 2.34.1 → 2.36.0

package/dist/collection/components/vega-rich-text-editor/dto/blocks/list-item-block.js

@@ -10,12 +10,21 @@ import { InsertBlocksAfterAction } from '../actions/insert-blocks-after-block';
 import { InsertBlocksBeforeAction } from '../actions/insert-blocks-before-block';
 import { isNonNullable } from '../../../../types/type-guard';
 import { NodeAnnotationTypeEnum } from '../annotations/node-annotation.abstract';
+/**
+ * List item block
+ */
 export class RTEListItemBlock extends RTETextBlock {
   constructor(id, children) {
     super(id, 'list-item');
     this.children = [];
     this.children = children;
   }
+  /**
+   * Converts a VegaRTEListItemBlock object to an RTEListItemBlock
+   *
+   * @param {VegaRTEListBlock} block - Converts a `VegaRTEListItemBlock` object into an `RTEListItemBlock`.
+   * @returns {RTEListBlock} Return an instance of `RTEListItemBlock`
+   */
   static from(block) {
     const listItemBlock = new RTEListItemBlock(block.id);
     listItemBlock.nodes = block.nodes.map((richText) => RTETextNode.from(richText, listItemBlock));
@@ -37,16 +46,25 @@ export class RTEListItemBlock extends RTETextBlock {
     }
     return listItemBlock;
   }
+  /**
+   * @inheritDoc
+   */
   toJSON() {
     var _a;
     return Object.assign(Object.assign({}, super.toJSON()), { type: 'list-item', children: (_a = this.children) === null || _a === void 0 ? void 0 : _a.map((block) => block.toJSON()) });
   }
+  /**
+   * @inheritDoc
+   */
   cloneWithNodes(nodes) {
     const block = new RTEListItemBlock(generateUUID());
     block.nodes = [];
     block.apply(new AppendChildNodesAction(nodes));
     return block;
   }
+  /**
+   * @inheritDoc
+   */
   isNotEmpty() {
     if (this.children) {
       return super.isNotEmpty() || this.children.some((block) => block.isNotEmpty());
@@ -55,6 +73,9 @@ export class RTEListItemBlock extends RTETextBlock {
       return super.isNotEmpty();
     }
   }
+  /**
+   * @inheritDoc
+   */
   getLastNode() {
     if (this.children && this.children.length > 0) {
       const childListBlock = this.children[this.children.length - 1];
@@ -62,9 +83,6 @@ export class RTEListItemBlock extends RTETextBlock {
     }
     return super.getLastNode();
   }
-  render(renderContext) {
-    return super.render(renderContext, this.renderChildren(renderContext));
-  }
   /**
    * Apply a modify action to block
    *
@@ -120,16 +138,22 @@ export class RTEListItemBlock extends RTETextBlock {
         break;
     }
   }
-  renderChildren(renderContext) {
-    var _a;
-    return (_a = this.children) === null || _a === void 0 ? void 0 : _a.map((block) => block.render(renderContext));
-  }
+  /**
+   * Remove the list child node
+   *
+   * @param {RemoveChildAction} action - Modify action
+   */
   removeListChildNode(action) {
     this.nodes = this.nodes.filter((node) => node !== action.entityToBeRemoved);
     if (this.nodes.length === 0 && (!this.children || !this.children.length)) {
       this.parent.apply(new RemoveChildAction(this));
     }
   }
+  /**
+   * Remove the nest list
+   *
+   * @param {RemoveNestListAction} action - Modify action
+   */
   removeNestList(action) {
     if (this.children) {
       if (this.children.length > 1) {
@@ -140,15 +164,34 @@ export class RTEListItemBlock extends RTETextBlock {
       }
     }
   }
+  /**
+   * Iterates through a list of RTEListBlock and sets their parent property to the current object, then replaces the children property with the new list.
+   *
+   * @param {RTEListBlock[]} newList - new list that you want to replace the existing children of the current object with.
+   */
   replaceNestList(newList) {
     newList.forEach((listBlock) => {
       listBlock.parent = this;
     });
     this.children = newList;
   }
+  /**
+   * Split list item block
+   *
+   * @param {SplitBlockWithNodeAction} action - Modify action
+   */
   splitListItemBlock(action) {
     action.newBlock = this.splitTextNodeBlock(action.splitPointNode, action.startOffsetOfNode);
   }
+  /**
+   * Breaks a single list item block at a specific position.
+   *
+   * @param {RTETextNode} splitNode - The node that needs to be split within a list item block.
+   * @param {number} startOffsetOfNode - The index within the `splitNode` where the break operation should occur.
+   * @returns {Nullable<RTEBlock>} Returns either a new `RTEListItemBlock` if the caret
+   * position is at the end of the `splitNode`, or it returns the result of splitting the block at the
+   * caret position if it is neither at the start nor at the end.
+   */
   breakSingleListItemBlock(splitNode, startOffsetOfNode) {
     const newListItem = new RTEListItemBlock(generateUUID());
     const newBreakNode = this.copyInlineStyleToNewNode(splitNode);
@@ -166,6 +209,12 @@ export class RTEListItemBlock extends RTETextBlock {
     }
     return newListItem;
   }
+  /**
+   * Breaks a list item at the end and handles the insertion of a new list item or paragraph accordingly.
+   *
+   * @param {RTEListItemBlock} newListItem - Item that represents a new list item to be added to the existing list.
+   * @returns {RTEBlock} Returns a `RTEBlock`.
+   */
   breakListItemAtEnd(newListItem) {
     const lastItem = this.parent.blocks[this.parent.blocks.length - 1];
     const currentItemIsEmpty = this.nodes.length === 1 && this.nodes[0].isEmpty();
@@ -192,6 +241,11 @@ export class RTEListItemBlock extends RTETextBlock {
     }
     return newListItem;
   }
+  /**
+   * Delete list node content
+   *
+   * @param {DeleteBlockContentAction} action - Modify action
+   */
   deleteListNodeContent(action) {
     const startContainerNode = action.startContainerNode;
     const listBlock = startContainerNode.parentBlock.parent;
@@ -200,9 +254,15 @@ export class RTEListItemBlock extends RTETextBlock {
       listBlock.parent.apply(new RemoveChildAction(listBlock));
     }
   }
+  /**
+   * Copy the inline style to new node
+   *
+   * @param {RTETextNode} needCopedNode - The node that needed to be copied to
+   * @returns {RTETextNode} Returns a `RTETextNode`.
+   */
   copyInlineStyleToNewNode(needCopedNode) {
     const textNode = needCopedNode.cloneWithText('');
-    // The link annotation don't need inherited
+    // The link annotation doesn't need to inherit
     textNode.annotationMap.delete(NodeAnnotationTypeEnum.LINK);
     return textNode;
   }

package/dist/collection/components/vega-rich-text-editor/dto/blocks/text-block.js

@@ -1,6 +1,4 @@
-import { h } from '@stencil/core';
 import { RTETextNode } from '../nodes/text-node';
-import stateEntityRenderingRegistry from '../../slimmers/controllers/state-entity-rendering-registry';
 import { isNonNullable } from '../../../../types/type-guard';
 import { TextStyleAnnotation } from '../annotations/text-style-annotation';
 import { ModifyContentActionType } from '../actions/modify-content-action.abstract';
@@ -36,6 +34,12 @@ export class RTETextBlock extends RTEBlock {
       this.annotationMap = new Map([TextStyleAnnotation.from('paragraph')]);
     }
   }
+  /**
+   * Converts a VegaRTETextBlock into an RTETextBlock.
+   *
+   * @param {VegaRTETextBlock} block - The block object
+   * @returns {RTETextBlock} A RTETextBlock class
+   */
   static from(block) {
     const textBlock = new RTETextBlock(block.id, block.type);
     const { annotations } = block;
@@ -70,9 +74,20 @@ export class RTETextBlock extends RTEBlock {
       return super.createAnnotationEntity(type, value);
     }
   }
+  /**
+   * Checks if a given text block type is one of the acceptable text styles.
+   *
+   * @param {VegaRTETextBlockType} type - The text block type
+   * @returns {boolean} Return a boolean value indicating whether the `type` parameter is valid.
+   */
   static isAcceptableTextStyle(type) {
     return ['title', 'subtitle', 'paragraph', 'heading-1', 'heading-2', 'heading-3'].includes(type);
   }
+  /**
+   * Merges RTETextNode nodes based on certain conditions.
+   *
+   * @param {AnnotationAction} action - AnnotationAction
+   */
   mergeNodes(action) {
     this.nodes = this.nodes.reduce((prev, cur) => {
       const lastNode = prev.at(-1);
@@ -89,38 +104,39 @@ export class RTETextBlock extends RTEBlock {
       return [...prev, cur];
     }, []);
   }
+  /**
+   * @inheritDoc
+   */
   toJSON() {
     return Object.assign(Object.assign({}, super.toJSON()), { type: this.type, nodes: this.nodes.map((node) => node.toJSON()) });
   }
+  /**
+   * Clone the nodes to a new block
+   *
+   * @param {RTEBlock} nodes - The nodes will be copied
+   * @returns {RTEBlock} New block
+   */
   cloneWithNodes(nodes) {
     const block = new RTETextBlock(generateUUID(), this.type);
     block.nodes = [];
     block.apply(new AppendChildNodesAction(nodes));
     return block;
   }
+  /**
+   * @inheritDoc
+   */
   isNotEmpty() {
     return this.nodes.length > 0 && this.nodes.some((node) => !node.isEmpty());
   }
+  /**
+   * @inheritDoc
+   */
   getLastNode() {
     return this.nodes[this.nodes.length - 1];
   }
-  render(renderContext, children) {
-    const BlockTag = this.getBlockTagByType(this.type);
-    return (h(BlockTag, { ref: this.registerRef.bind(this), style: this.getStyles(), class: super.getClasses() },
-      this.renderNodes(renderContext),
-      children));
-  }
-  registerRef(ref) {
-    if (ref) {
-      stateEntityRenderingRegistry.register(ref, this);
-    }
-  }
-  renderNodes(renderConfig = {}) {
-    const linkGroupAnnotation = this.getAnnotationByType(InternalAnnotationTypeEnum.LINK_GROUP);
-    return linkGroupAnnotation
-      ? linkGroupAnnotation.renderNodes(this.nodes, renderConfig)
-      : this.nodes.map((node) => node.render());
-  }
+  /**
+   * @inheritDoc
+   */
   doAnnotationActionApply(action) {
     if (action instanceof TextStyleAnnotationAction) {
       if (this.type !== 'list-item') {
@@ -202,6 +218,13 @@ export class RTETextBlock extends RTEBlock {
         break;
     }
   }
+  /**
+   * Splits a text node at a specified offset within a block of nodes and returns a new block with the split nodes.
+   *
+   * @param {RTETextNode} splitNode - The text node that will be split
+   * @param {number} startOffsetOfNode - The index at which will split the text content of the `splitNode`.
+   * @returns {Nullable<RTEBlock>} return either an RTEBlock object or null.
+   */
   splitTextNodeBlock(splitNode, startOffsetOfNode) {
     if (splitNode) {
       const beforeText = splitNode.text.slice(0, startOffsetOfNode);
@@ -223,13 +246,34 @@ export class RTETextBlock extends RTEBlock {
       }
     }
   }
+  /**
+   * Checks if the caret position is at the start of a specified RTETextNode.
+   *
+   * @param {RTETextNode} node - `RTETextNode` - a node representing an image in a rich text editor.
+   * @param {number} startOffset - The position within the text node where the caret is located.
+   * @returns {boolean} a boolean value, which indicates whether the caret position is at the start of the RTETextNode.
+   */
   isCaretPositionAtStart(node, startOffset) {
     return node === this.nodes[0] && startOffset === 0;
   }
+  /**
+   * Checks if the caret position is at the end of a specified RTETextNode.
+   *
+   * @param {RTETextNode} node - `RTETextNode` - a node representing an image in a rich text editor.
+   * @param {number} startOffset - The position within the text node where the caret is located.
+   * @returns {boolean} a boolean value, which indicates whether the caret position is at the start of the RTETextNode.
+   */
   isCaretPositionAtEnd(node, startOffset) {
     const lastNode = this.nodes[this.nodes.length - 1];
     return node === lastNode && (node.isEmpty() || startOffset === lastNode.text.length);
   }
+  /**
+   * lineBreakSingleBlock
+   *
+   * @param {RTETextNode} splitNode -
+   * @param {number} startOffsetOfNode -
+   * @returns {Nullable<RTETextNode>} Nullable<RTETextNode>
+   */
   lineBreakSingleBlock(splitNode, startOffsetOfNode) {
     if (splitNode) {
       const lineBreakNode = new RTETextNode(generateUUID(), '\n', this);
@@ -250,6 +294,12 @@ export class RTETextBlock extends RTEBlock {
       return lineBreakNode;
     }
   }
+  /**
+   * lineBreakMultipleBlocks
+   *
+   * @param {RTEBlock[]} selectedBlocks -
+   * @returns {Nullable<RTETextNode>} Nullable<RTETextNode>
+   */
   lineBreakMultipleBlocks(selectedBlocks) {
     const beforeNodes = this['nodes'];
     const lineBreakNode = new RTETextNode(generateUUID(), '\n', this);
@@ -257,6 +307,11 @@ export class RTETextBlock extends RTEBlock {
     this.mergeLineBreakNodes(beforeNodes, lineBreakNode, afterNodes);
     return lineBreakNode;
   }
+  /**
+   * deleteNodeContent
+   *
+   * @param {DeleteBlockContentAction} action - ModifyContentAction
+   */
   deleteNodeContent(action) {
     const startContainerNode = action.startContainerNode;
     const startOffset = action.startOffset;
@@ -298,6 +353,7 @@ export class RTETextBlock extends RTEBlock {
         }
         /**
          * Remove line break
+         *
          * @example caret at the first line
          * \n
          * test
@@ -307,6 +363,7 @@ export class RTETextBlock extends RTEBlock {
         }
         /**
          * Remove line break
+         *
          * @example caret at the begin of second line
          * \n
          * test
@@ -332,35 +389,37 @@ export class RTETextBlock extends RTEBlock {
       }
     }
   }
+  /**
+   * Remove the child node
+   *
+   * @param {RemoveChildAction} action - Modify action
+   */
   removeChildNode(action) {
     this.nodes = this.nodes.filter((node) => node !== action.entityToBeRemoved);
     if (this.nodes.length === 0) {
       this.parent.apply(new RemoveChildAction(this));
     }
   }
+  /**
+   * mergeLineBreakNodes
+   *
+   * @param {RTENode[]} beforeNodes -
+   * @param {RTETextNode} lineBreakNode -
+   * @param {RTENode[]} afterNodes -
+   */
   mergeLineBreakNodes(beforeNodes, lineBreakNode, afterNodes) {
     if (afterNodes.length === 0 || (afterNodes[0] && afterNodes[0].text === '')) {
       afterNodes.push(new RTETextNode(generateUUID(), '\n', this, beforeNodes[beforeNodes.length - 1] && beforeNodes[beforeNodes.length - 1].annotationMap));
     }
     this.apply(new ReplaceChildNodesAction([...beforeNodes, lineBreakNode, ...afterNodes]));
   }
-  getBlockTagByType(type) {
-    switch (type) {
-      case 'title':
-      case 'subtitle':
-        return `div`;
-      case 'heading-1':
-        return `h1`;
-      case 'heading-2':
-        return `h2`;
-      case 'heading-3':
-        return `h3`;
-      case 'paragraph':
-        return 'p';
-      case 'list-item':
-        return 'li';
-    }
-  }
+  /**
+   * breakSingleTextBlock
+   *
+   * @param {RTETextNode} splitNode -
+   * @param {number} startOffsetOfNode -
+   * @returns {Nullable<RTEBlock>} Nullable<RTEBlock>
+   */
   breakSingleTextBlock(splitNode, startOffsetOfNode) {
     const newParagraph = this.copyInlineStyleToNewParagraph(splitNode);
     if (this.isCaretPositionAtEnd(splitNode, startOffsetOfNode)) {
@@ -376,6 +435,11 @@ export class RTETextBlock extends RTEBlock {
     }
     return newParagraph;
   }
+  /**
+   * convertParagraphToList
+   *
+   * @param {TransformListAction} action - ModifyContentAction
+   */
   convertParagraphToList(action) {
     const bulletList = this.parent.createList(action.listType);
     const listItems = action.selectedBlocks.map((node) => this.parent.toListItem(node));
@@ -385,6 +449,11 @@ export class RTETextBlock extends RTEBlock {
       node.parent.apply(new RemoveChildAction(node));
     });
   }
+  /**
+   * insertImage
+   *
+   * @param {InsertImageToBlockAction} action - ModifyContentAction
+   */
   insertImage(action) {
     const splitNode = action.splitPointNode;
     const startOffsetOfNode = action.startOffsetOfNode;
@@ -401,6 +470,12 @@ export class RTETextBlock extends RTEBlock {
       this.parent.apply(new InsertBlocksAfterAction(this, newImageBlock));
     }
   }
+  /**
+   * copyInlineStyleToNewParagraph
+   *
+   * @param {RTETextNode} needCopedNode -
+   * @returns {RTETextBlock} RTETextBlock
+   */
   copyInlineStyleToNewParagraph(needCopedNode) {
     const textNode = needCopedNode.cloneWithText('');
     // The link annotation don't need inherited

package/dist/collection/components/vega-rich-text-editor/dto/nodes/image-node.js

@@ -1,13 +1,11 @@
-import { h } from '@stencil/core';
 import { NodeTypeEnum, RTENode } from './node.abstract';
-import stateEntityRenderingRegistry from '../../slimmers/controllers/state-entity-rendering-registry';
 import { ImageAnnotation } from '../annotations/image-annotation';
-import { ImageAnnotationAction } from '../actions/image-annotation-action';
 import { methodPlaceholder } from 'vega-slimmer/core';
 import { NodeAnnotationTypeEnum } from '../annotations/node-annotation.abstract';
 import { isNonNullable } from '../../../../types/type-guard';
-import { DomNodeSubjectObserverFactory } from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-observer-factory';
-import { VegaChange } from '../../../../helpers/event-manager/event-id/vega-event-id';
+/**
+ * Image node
+ */
 export class RTEImageNode extends RTENode {
   constructor(id, url, parentBlock, annotationMap) {
     super(id, annotationMap);
@@ -15,20 +13,30 @@ export class RTEImageNode extends RTENode {
     this.url = url;
     this.parentBlock = parentBlock;
   }
-  static from(image, parentBlock) {
-    const imageNode = new RTEImageNode(image.id, image.url, parentBlock);
+  /**
+   * Converts a VegaRTEImageNode into an RTEImageNode by mapping nodes and creating annotations.
+   *
+   * @param {VegaRTEImageNode} node - The node to be converted.
+   * @param {RTEImageBlock} parentBlock - The parent block
+   * @returns {RTEImageBlock} An instance of `RTEImageBlock`
+   */
+  static from(node, parentBlock) {
+    const imageNode = new RTEImageNode(node.id, node.url, parentBlock);
     let annotations;
-    if (!image.annotations || Object.keys(image.annotations).length === 0) {
+    if (!node.annotations || Object.keys(node.annotations).length === 0) {
       annotations = { size: 'md' };
     }
     else {
-      annotations = image.annotations;
+      annotations = node.annotations;
     }
     imageNode.annotationMap = new Map(Object.keys(annotations)
       .map(() => ImageAnnotation.from(annotations.size, annotations.alt))
       .filter(isNonNullable));
     return imageNode;
   }
+  /**
+   * @inheritDoc
+   */
   toJSON() {
     const imageAnnotation = this.annotationMap.get(NodeAnnotationTypeEnum.IMAGE);
     const annotations = {};
@@ -40,54 +48,19 @@ export class RTEImageNode extends RTENode {
     }
     return Object.assign(Object.assign({ id: this.id }, (Object.keys(annotations).length > 0 ? { annotations } : {})), { type: 'image', url: this.url });
   }
-  render({ editable } = {}) {
-    const imageAnnotation = this.annotationMap.get(NodeAnnotationTypeEnum.IMAGE);
-    const size = imageAnnotation === null || imageAnnotation === void 0 ? void 0 : imageAnnotation.size;
-    const alt = imageAnnotation === null || imageAnnotation === void 0 ? void 0 : imageAnnotation.alt;
-    const handleChange = ({ detail, }) => {
-      switch (detail.action) {
-        case 'edit': {
-          const size = detail.payload.size;
-          const alt = detail.payload.alt;
-          this.apply(new ImageAnnotationAction(size, alt));
-          break;
-        }
-        /*
-         * The below method is e2e-test covered in
-         * @see{module:vega-rich-text-editor-image-click-delete-button}
-         */
-        /* istanbul ignore next */
-        case 'delete': {
-          const event = new InputEvent('beforeinput', {
-            inputType: 'deleteContentBackward',
-            bubbles: true,
-          });
-          setTimeout(() => {
-            stateEntityRenderingRegistry.getDOMByEntity(this).dispatchEvent(event);
-          }, 50);
-          break;
-        }
-      }
-    };
-    return editable ? (h("vega-rich-text-image-editor", { style: this.getStyles(), size: size, alt: alt, ref: (ref) => {
-        DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaChange, handleChange);
-      } }, this.renderImage(editable, alt))) : (this.renderImage(editable, alt));
-  }
+  /**
+   * @inheritDoc
+   */
   doAnnotationActionApply(action) {
     const annotation = action.toAnnotation();
     this.annotationMap.set(annotation.type, annotation);
   }
   // placeholder method
   /* istanbul ignore next */
+  /**
+   * @inheritDoc
+   */
   doModifyActionApply(action) {
     methodPlaceholder(action);
   }
-  registerRef(ref) {
-    if (ref) {
-      stateEntityRenderingRegistry.register(ref, this);
-    }
-  }
-  renderImage(editable, alt) {
-    return (h("img", { style: editable ? { width: '100%' } : this.getStyles(), alt: alt, src: this.url, ref: this.registerRef.bind(this) }));
-  }
 }

package/dist/collection/components/vega-rich-text-editor/dto/nodes/node.abstract.js

@@ -1,4 +1,3 @@
-import { NodeAnnotation } from '../annotations/node-annotation.abstract';
 import ChangeManager from '../../../../helpers/change-manager/change-manager';
 import stateEntityRenderingRegistry from '../../slimmers/controllers/state-entity-rendering-registry';
 import domNodeSubjectFactory from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-factory';
@@ -64,30 +63,6 @@ export class RTENode {
       this.doAnnotationActionApply(action);
     }
   }
-  /**
-   * Get styles from annotations
-   *
-   * @returns {AnnotationStyle} - Annotation style
-   */
-  getStyles() {
-    return Array.from(this.annotationMap.values())
-      .filter((annotation) => annotation instanceof NodeAnnotation)
-      .map((annotation) => annotation.render())
-      .filter(Boolean)
-      .reduce((current, obj) => (Object.assign(Object.assign({}, current), obj)), {});
-  }
-  /**
-   * Get classes from annotations
-   *
-   * @returns {AnnotationStyle} - Annotation style
-   */
-  getClasses() {
-    return Array.from(this.annotationMap.values())
-      .filter((annotation) => annotation instanceof NodeAnnotation)
-      .map((annotation) => { var _a; return (_a = annotation.renderClass) === null || _a === void 0 ? void 0 : _a.call(annotation); })
-      .filter(Boolean)
-      .reduce((pre, cur) => [pre, cur].join(' '), '');
-  }
   /**
    * Flush the value change
    */