@globalpayments/vega 2.32.0 → 2.34.0

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

@@ -0,0 +1,189 @@
+import { h } from '@stencil/core';
+import { RTEBlock } from './block.abstract';
+import { RTEListItemBlock } from './list-item-block';
+import stateEntityRenderingRegistry from '../../slimmers/controllers/state-entity-rendering-registry';
+import { ModifyContentActionType } from '../actions/modify-content-action.abstract';
+import { RemoveChildAction } from '../actions/remove-child-action';
+import { InsertBlocksAfterAction } from '../actions/insert-blocks-after-block';
+import { generateUUID } from '../../../../utils/misc';
+import { RTETextBlock } from './text-block';
+import { AppendChildNodesAction } from '../actions/append-child-nodes-action';
+import { InsertBlocksBeforeAction } from '../actions/insert-blocks-before-block';
+import { SyncUpSelectionAction } from '../actions/sync-up-selection-action';
+import { RemoveNestListAction } from '../actions/remove-nest-list-action';
+import { BlockAnnotationTypeEnum } from '../annotations/block-annotation.abstract';
+import { isNonNullable } from '../../../../types/type-guard';
+export class RTEListBlock extends RTEBlock {
+  constructor(id, type) {
+    super(id);
+    this.type = 'bullet-list';
+    this.blocks = [];
+    this.type = type;
+  }
+  static from(block) {
+    const listBlock = new RTEListBlock(block.id, block.type);
+    listBlock.blocks = block.blocks.map((item) => {
+      const listItemBlock = RTEListItemBlock.from(item);
+      listItemBlock.parent = listBlock;
+      return listItemBlock;
+    });
+    return listBlock;
+  }
+  static fromHTML(node) {
+    const listBlock = new RTEListBlock(generateUUID(), node.nodeName === 'UL' ? 'bullet-list' : 'number-list');
+    listBlock.blocks = Array.from(node.children)
+      .map((item) => {
+      const listItemBlock = RTEListItemBlock.fromHTML(item);
+      listItemBlock && (listItemBlock.parent = listBlock);
+      return listItemBlock;
+    })
+      .filter(Boolean);
+    Object.keys(BlockAnnotationTypeEnum).forEach((type) => {
+      const item = this.createAnnotationEntityFromHTML(type, node);
+      if (isNonNullable(item)) {
+        listBlock.annotationMap.set(...item);
+      }
+    });
+    return listBlock;
+  }
+  toJSON() {
+    return Object.assign(Object.assign({}, super.toJSON()), { id: this.id, type: this.type, blocks: this.blocks.map((block) => block.toJSON()) });
+  }
+  isNotEmpty() {
+    return (this.blocks.length > 0 &&
+      this.blocks.some((listItemBlock) => listItemBlock.isNotEmpty()));
+  }
+  getLastNode() {
+    return this.blocks[this.blocks.length - 1].getLastNode();
+  }
+  render(renderContext) {
+    const BlockTag = this.type === 'number-list' ? 'ol' : 'ul';
+    return (h(BlockTag, { ref: this.registerRef.bind(this) }, this.blocks.map((block) => block.render(renderContext))));
+  }
+  /**
+   * Apply a modify action to block
+   *
+   * @param {ModifyContentAction} action - Modify action
+   */
+  doModifyActionApply(action) {
+    switch (action.type) {
+      case ModifyContentActionType.DELETE_CHILD:
+        this.removeListItemBlock(action.entityToBeRemoved);
+        break;
+      case ModifyContentActionType.INSERT_BLOCKS_AFTER:
+        this.replaceBlockWithBlocks(action.referBlock, [
+          action.referBlock,
+          ...action.blocksToBeInserted,
+        ]);
+        break;
+      case ModifyContentActionType.INSERT_BLOCKS_BEFORE:
+        this.replaceBlockWithBlocks(action.referBlock, [
+          ...action.blocksToBeInserted,
+          action.referBlock,
+        ]);
+        break;
+      case ModifyContentActionType.APPEND_CHILD_NODES:
+        this.appendChildBlocks(action.entityToBeAppended);
+        break;
+      case ModifyContentActionType.TRANSFORM_LIST_BLOCK:
+        this.convertToList(action);
+        break;
+      case ModifyContentActionType.TRANSFORM_PARAGRAPH_BLOCK:
+        this.convertToParagraph(action);
+        break;
+      case ModifyContentActionType.INSERT_IMAGE_TO_BLOCK:
+        this.insertImage(action);
+        break;
+    }
+  }
+  toParagraph(block) {
+    const textBlock = new RTETextBlock(generateUUID(), 'paragraph');
+    textBlock.apply(new AppendChildNodesAction(block['nodes']));
+    textBlock['annotationMap'] = block['annotationMap'];
+    return textBlock;
+  }
+  registerRef(ref) {
+    if (ref) {
+      stateEntityRenderingRegistry.register(ref, this);
+    }
+  }
+  convertToList(action) {
+    const selectedBlocks = action.selectedBlocks;
+    const bulletList = this.parent.createList(action.listType);
+    const isSameList = selectedBlocks.every((block) => block.parent === this);
+    if (isSameList) {
+      // Select one or more list items belonging to the same list, and all items in this list should be updated
+      bulletList.apply(new AppendChildNodesAction(this.blocks));
+      this.parent.apply(new InsertBlocksAfterAction(this, bulletList));
+      this.parent.apply(new RemoveChildAction(this));
+      selectedBlocks.forEach((block) => block.nodes.map((node) => node.apply(new SyncUpSelectionAction())));
+    }
+    else {
+      const listItems = action.selectedBlocks.map((block) => this.parent.toListItem(block));
+      bulletList.apply(new AppendChildNodesAction(listItems));
+      this.parent.apply(new InsertBlocksAfterAction(this, bulletList));
+      action.selectedBlocks.forEach((block) => {
+        block.parent.apply(new RemoveChildAction(block));
+      });
+      if (this.blocks.length === 0) {
+        this.parent.apply(new RemoveChildAction(this));
+      }
+    }
+  }
+  convertToParagraph(action) {
+    let isSelectedFirstBlock = false;
+    let isSelectedLastBlock = false;
+    const selectedBlocks = action.selectedBlocks;
+    const currentParagraph = selectedBlocks.map((block) => {
+      block.nodes.map((node) => node.apply(new SyncUpSelectionAction()));
+      if (block === this.blocks[0])
+        isSelectedFirstBlock = true;
+      if (block === this.blocks[this.blocks.length - 1])
+        isSelectedLastBlock = true;
+      return this.toParagraph(block);
+    });
+    if (isSelectedFirstBlock) {
+      this.parent.apply(new InsertBlocksBeforeAction(this, ...currentParagraph));
+    }
+    else if (isSelectedLastBlock) {
+      this.parent.apply(new InsertBlocksAfterAction(this, ...currentParagraph));
+    }
+    else {
+      const startIndex = this.blocks.indexOf(selectedBlocks[0]);
+      const lastIndex = this.blocks.indexOf(selectedBlocks[selectedBlocks.length - 1]);
+      const firstBulletList = this.parent.createList(this.type);
+      firstBulletList.apply(new AppendChildNodesAction(this.blocks.slice(0, startIndex)));
+      const lastBulletList = this.parent.createList(this.type);
+      lastBulletList.apply(new AppendChildNodesAction(this.blocks.slice(lastIndex + 1)));
+      this.parent.apply(new InsertBlocksBeforeAction(this, firstBulletList, ...currentParagraph, lastBulletList));
+      this.parent.apply(new RemoveChildAction(this));
+    }
+    selectedBlocks.map((block) => {
+      this.apply(new RemoveChildAction(block));
+    });
+    if (this.blocks.length === 0) {
+      this.parent.apply(new RemoveChildAction(this));
+    }
+  }
+  insertImage(action) {
+    const imageBlock = action.imageBlockToBeInserted;
+    if (this.parent['type'] !== 'list-item') {
+      this.parent.apply(new InsertBlocksAfterAction(this, imageBlock));
+    }
+    else {
+      this.parent.apply(action);
+    }
+  }
+  removeListItemBlock(blockToBeRemoved) {
+    super.removeChildBlock(blockToBeRemoved);
+    if (this.blocks.length === 0 && this.parent) {
+      // The parent is a list item mean the current block is a nest list, so we need use RemoveNestListAction to remove the item
+      if (this.parent instanceof RTEListItemBlock) {
+        this.parent.apply(new RemoveNestListAction(this));
+      }
+      else {
+        this.parent.apply(new RemoveChildAction(this));
+      }
+    }
+  }
+}

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

@@ -0,0 +1,236 @@
+import { RTETextNode } from '../nodes/text-node';
+import { RTEListBlock } from './list-block';
+import { ModifyContentActionType } from '../actions/modify-content-action.abstract';
+import { RemoveChildAction } from '../actions/remove-child-action';
+import { AppendChildNodesAction } from '../actions/append-child-nodes-action';
+import { generateUUID } from '../../../../utils/misc';
+import { SplitBlockWithNodeAction } from '../actions/split-block-with-node-action';
+import { RTETextBlock } from './text-block';
+import { InsertBlocksAfterAction } from '../actions/insert-blocks-after-block';
+import { InsertBlocksBeforeAction } from '../actions/insert-blocks-before-block';
+import { BlockAnnotationTypeEnum } from '../annotations/block-annotation.abstract';
+import { isNonNullable } from '../../../../types/type-guard';
+import { NodeAnnotationTypeEnum } from '../annotations/node-annotation.abstract';
+export class RTEListItemBlock extends RTETextBlock {
+  constructor(id, children) {
+    super(id, 'list-item');
+    this.children = [];
+    this.children = children;
+  }
+  static from(block) {
+    const listItemBlock = new RTEListItemBlock(block.id);
+    listItemBlock.nodes = block.nodes.map((richText) => RTETextNode.from(richText, listItemBlock));
+    if (block.children) {
+      listItemBlock.children = block.children.map((child) => {
+        const listBlock = RTEListBlock.from(child);
+        listBlock.parent = listItemBlock;
+        return listBlock;
+      });
+    }
+    const { annotations } = block;
+    if (annotations) {
+      Object.entries(annotations).forEach(([type, value]) => {
+        const item = this.createAnnotationEntity(type, value);
+        if (isNonNullable(item)) {
+          listItemBlock.annotationMap.set(...item);
+        }
+      });
+    }
+    return listItemBlock;
+  }
+  static fromHTML(node) {
+    const listItem = new RTEListItemBlock(generateUUID());
+    listItem.nodes = Array.from(node.childNodes)
+      .map((item) => {
+      if (!['UL', 'OL'].includes(item.nodeName)) {
+        return RTETextNode.fromHTML(item, listItem);
+      }
+    })
+      .filter(Boolean);
+    listItem.children = Array.from(node.childNodes)
+      .map((item) => {
+      if (['UL', 'OL'].includes(item.nodeName)) {
+        const listBlock = RTEListBlock.fromHTML(item);
+        listBlock && (listBlock.parent = listItem);
+        return listBlock;
+      }
+    })
+      .filter(Boolean);
+    Object.keys(BlockAnnotationTypeEnum).forEach((type) => {
+      const item = this.createAnnotationEntityFromHTML(type, node);
+      if (isNonNullable(item)) {
+        listItem.annotationMap.set(...item);
+      }
+    });
+    return listItem;
+  }
+  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()) });
+  }
+  cloneWithNodes(nodes) {
+    const block = new RTEListItemBlock(generateUUID());
+    block.nodes = [];
+    block.apply(new AppendChildNodesAction(nodes));
+    return block;
+  }
+  isNotEmpty() {
+    if (this.children) {
+      return super.isNotEmpty() || this.children.some((block) => block.isNotEmpty());
+    }
+    else {
+      return super.isNotEmpty();
+    }
+  }
+  getLastNode() {
+    if (this.children && this.children.length > 0) {
+      const childListBlock = this.children[this.children.length - 1];
+      return childListBlock.getLastNode();
+    }
+    return super.getLastNode();
+  }
+  render(renderContext) {
+    return super.render(renderContext, this.renderChildren(renderContext));
+  }
+  /**
+   * Apply a modify action to block
+   *
+   * @param {ModifyContentAction} action - Modify action
+   */
+  doModifyActionApply(action) {
+    switch (action.type) {
+      case ModifyContentActionType.DELETE_CHILD:
+        this.removeListChildNode(action);
+        break;
+      case ModifyContentActionType.DELETE_NEST_LIST:
+        this.removeNestList(action);
+        break;
+      case ModifyContentActionType.APPEND_CHILD_NODES:
+        this.appendChildNodes(action.entityToBeAppended);
+        break;
+      case ModifyContentActionType.CLEAR_CHILD_NODES:
+        this.nodes = [];
+        break;
+      case ModifyContentActionType.SPLIT_BLOCK_WITH_NODE:
+        this.splitListItemBlock(action);
+        break;
+      case ModifyContentActionType.REPLACE_CHILD_NODES:
+        this.nodes = [];
+        this.appendChildNodes(action.newChildNodes);
+        break;
+      case ModifyContentActionType.REPLACE_NEST_LIST:
+        this.replaceNestList(action.newList);
+        break;
+      case ModifyContentActionType.MERGE_TWO_BLOCKS_NODES:
+        this.mergeTwoBlocksNodes(action.blockNeedToBeMerged);
+        break;
+      case ModifyContentActionType.BREAK_SINGLE_BLOCK:
+        action.newBlock = this.breakSingleListItemBlock(action.startContainerNode, action.startOffset);
+        break;
+      case ModifyContentActionType.LINE_BREAK_SINGLE_BLOCK:
+        action.lineBreakNode = this.lineBreakSingleBlock(action.startContainerNode, action.startOffset);
+        break;
+      case ModifyContentActionType.LINE_BREAK_MULTIPLE_BLOCKS:
+        action.lineBreakNode = this.lineBreakMultipleBlocks(action.selectedBlocks);
+        break;
+      case ModifyContentActionType.DELETE_BLOCK_CONTENT:
+        this.deleteListNodeContent(action);
+        break;
+      case ModifyContentActionType.INSERT_IMAGE_TO_BLOCK:
+        this.parent.apply(action);
+        break;
+      case ModifyContentActionType.INSERT_NODES_BEFORE:
+        this.replaceNodeWithNodes(action.referNode, [
+          ...action.nodesToBeInserted,
+          action.referNode,
+        ]);
+        break;
+    }
+  }
+  renderChildren(renderContext) {
+    var _a;
+    return (_a = this.children) === null || _a === void 0 ? void 0 : _a.map((block) => block.render(renderContext));
+  }
+  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));
+    }
+  }
+  removeNestList(action) {
+    if (this.children) {
+      if (this.children.length > 1) {
+        this.children = this.children.filter((child) => child !== action.nestListBlockToBeRemoved);
+      }
+      else {
+        this.children = undefined;
+      }
+    }
+  }
+  replaceNestList(newList) {
+    newList.forEach((listBlock) => {
+      listBlock.parent = this;
+    });
+    this.children = newList;
+  }
+  splitListItemBlock(action) {
+    action.newBlock = this.splitTextNodeBlock(action.splitPointNode, action.startOffsetOfNode);
+  }
+  breakSingleListItemBlock(splitNode, startOffsetOfNode) {
+    const newListItem = new RTEListItemBlock(generateUUID());
+    const newBreakNode = this.copyInlineStyleToNewNode(splitNode);
+    newListItem.apply(new AppendChildNodesAction([newBreakNode]));
+    if (this.isCaretPositionAtEnd(splitNode, startOffsetOfNode)) {
+      return this.breakListItemAtEnd(newListItem);
+    }
+    else if (this.isCaretPositionAtStart(splitNode, startOffsetOfNode)) {
+      this.parent.apply(new InsertBlocksBeforeAction(this, newListItem));
+    }
+    else {
+      const splitBlockAction = new SplitBlockWithNodeAction(splitNode, startOffsetOfNode);
+      this.apply(splitBlockAction);
+      return splitBlockAction.newBlock;
+    }
+    return newListItem;
+  }
+  breakListItemAtEnd(newListItem) {
+    const lastItem = this.parent.blocks[this.parent.blocks.length - 1];
+    const currentItemIsEmpty = this.nodes.length === 1 && this.nodes[0].isEmpty();
+    if (this === lastItem && currentItemIsEmpty) {
+      const parentParent = this.parent.parent;
+      if (parentParent['type'] !== 'list-item') {
+        const newParagraph = RTETextBlock.from({
+          id: generateUUID(),
+          type: 'paragraph',
+          nodes: [],
+        });
+        newParagraph.apply(new AppendChildNodesAction(newListItem.nodes));
+        parentParent.apply(new InsertBlocksAfterAction(this.parent, newParagraph));
+        this.parent.apply(new RemoveChildAction(this));
+        return newParagraph;
+      }
+      else {
+        parentParent.parent.apply(new InsertBlocksAfterAction(parentParent, newListItem));
+        this.parent.apply(new RemoveChildAction(this));
+      }
+    }
+    else {
+      this.parent.apply(new InsertBlocksAfterAction(this, newListItem));
+    }
+    return newListItem;
+  }
+  deleteListNodeContent(action) {
+    const startContainerNode = action.startContainerNode;
+    const listBlock = startContainerNode.parentBlock.parent;
+    this.deleteNodeContent(action);
+    if (listBlock.blocks.length === 0) {
+      listBlock.parent.apply(new RemoveChildAction(listBlock));
+    }
+  }
+  copyInlineStyleToNewNode(needCopedNode) {
+    const textNode = needCopedNode.cloneWithText('');
+    // The link annotation don't need inherited
+    textNode.annotationMap.delete(NodeAnnotationTypeEnum.LINK);
+    return textNode;
+  }
+}