@heartlandone/vega 2.100.0 → 2.102.0

package/dist/esm/{code-block-741d6b8e.js → code-block-d8f83d85.js}

@@ -1,12 +1,13 @@
 import { C as ChangeManager } from './change-manager-6a7eb88c.js';
 import { d as domNodeSubjectFactory } from './dom-node-subject-observer-factory-bb7e68a0.js';
-import { e as VegaInternalRichTextEditorFlushChanges, f as VegaInternalRichTextEditorSelectionRangeChange } from './vega-internal-event-id-86fce049.js';
+import { e as VegaInternalRichTextEditorFlushChanges, f as VegaInternalRichTextEditorSelectionRangeChange } from './vega-internal-event-id-02093067.js';
 import { d as dashCaseToCamel, c as camelToDashCase } from './string-a953eafc.js';
 import { L as LogUtility } from './global-slimmer-registry-17c4efd4.js';
-import { i as isNonNullable } from './type-guard-26d83e7e.js';
+import { i as isNonNullable } from './type-guard-08c82e08.js';
 import { T as TypographyUrls } from './typography-19c3b9be.js';
+import { D as Discriminated } from './discriminated-fe5bf3c8.js';
 import { g as generateUUID } from './misc-9fdbcfbb.js';
-import { V as VegaInternalThemeManager } from './dark-mode-style-controller-352f15ff.js';
+import { V as VegaInternalThemeManager } from './dark-mode-style-controller-4e04a2d3.js';
 import { c as cleanObject } from './object-0c277f57.js';
 import { f as findParent } from './ui-80e610f4.js';
 
@@ -20,6 +21,14 @@ var InternalAnnotationTypeEnum;
  * Abstract class for all annotations
  */
 class Annotation {
+  /**
+   * Whether the annotation only represents transient formatting state.
+   *
+   * @returns {boolean} True when the annotation should be treated as formatting-only.
+   */
+  get isFormattingOnly() {
+    return false;
+  }
 }
 
 var BlockAnnotationTypeEnum;
@@ -114,7 +123,7 @@ class StateEntityRenderingRegistry {
    * @returns {entity is VegaRTEContent} - True if the entity is a VegaRTEContent instance, false otherwise.
    */
   isVegaRTEContent(entity) {
-    return entity && entity.dtoName === 'VegaRTEContent';
+    return entity && entity.typeName === 'VegaRTEContent';
   }
 }
 const stateEntityRenderingRegistry = new StateEntityRenderingRegistry();
@@ -535,7 +544,7 @@ class Predicate {
    * @returns {boolean} True if the block or node instance is a text node and has a link annotation, false otherwise.
    */
   static isLinkNode(blockOrNodeInstance) {
-    return (this.isTextNode(blockOrNodeInstance.dtoName) &&
+    return (this.isTextNode(blockOrNodeInstance.typeName) &&
       !!blockOrNodeInstance.getAnnotationByType(NodeAnnotationTypeEnum.LINK));
   }
   /**
@@ -545,7 +554,7 @@ class Predicate {
    * @returns {boolean} True if the block or node instance is a code node, false otherwise.
    */
   static isCodeNode(blockOrNodeInstance) {
-    if (this.isTextNode(blockOrNodeInstance.dtoName)) {
+    if (this.isTextNode(blockOrNodeInstance.typeName)) {
       const codeAnnotation = blockOrNodeInstance.getAnnotationByType(NodeAnnotationTypeEnum.CODE);
       return !!codeAnnotation && codeAnnotation.code;
     }
@@ -558,7 +567,7 @@ class Predicate {
    * @returns {boolean} True if the block or node instance is an image node, false otherwise.
    */
   static isImageNode(blockOrNodeInstance) {
-    return blockOrNodeInstance.dtoName === 'RTEImageNode';
+    return blockOrNodeInstance.typeName === 'RTEImageNode';
   }
   /**
    * Check if the given block or node instance is a code block node, which is defined as an instance of RTECodeBlockNode.
@@ -567,7 +576,7 @@ class Predicate {
    * @returns {boolean} True if the block or node instance is a code block node, false otherwise.
    */
   static isCodeBlockNode(blockOrNodeInstance) {
-    return blockOrNodeInstance.dtoName === 'RTECodeBlockNode';
+    return blockOrNodeInstance.typeName === 'RTECodeBlockNode';
   }
 }
 Predicate.RTE_TEXT_NODE_CLASS_NAME = 'RTETextNode';
@@ -747,7 +756,9 @@ class LinkGroupAnnotation extends Annotation {
   getAttribute(linkAnnotation) {
     const { href, customAttribute = {} } = linkAnnotation.link;
     const useInternalStyle = linkAnnotation.useInternalStyle;
-    const target = customAttribute.target || (useInternalStyle ? '_blank' : '');
+    const target = (href === null || href === void 0 ? void 0 : href.startsWith('#'))
+      ? '_self'
+      : customAttribute.target || (useInternalStyle ? '_blank' : '');
     return Object.assign(Object.assign(Object.assign({}, customAttribute), (href ? { href } : useInternalStyle ? { href } : {})), (target ? { target } : {}));
   }
   /**
@@ -937,8 +948,8 @@ class ActionHandlerInterceptorRegistry {
    * @returns {Nullable<ActionHandlerInterceptor<T, target>>} - The action handler interceptor instance or null if not found.
    */
   static get(action, targetClass) {
-    const targetClassName = targetClass.constructor.name;
-    const actionType = action instanceof ModifyContentAction ? action.type : action.constructor.name;
+    const targetClassName = targetClass.typeName;
+    const actionType = action instanceof ModifyContentAction ? action.type : action.typeName;
     const strategyMap = this.registry.get(targetClassName);
     if (strategyMap) {
       const set = strategyMap.get(actionType);
@@ -1008,14 +1019,14 @@ class ActionHandleStrategyRegistry {
     const interceptor = ActionHandlerInterceptorRegistry.get(action, RTEInstance);
     // eslint-disable-next-line jsdoc/require-jsdoc
     const executeStrategy = () => {
-      const actionType = action instanceof ModifyContentAction ? action.type : action.constructor.name;
-      const strategy = ActionHandleStrategyRegistry.get(actionType, RTEInstance.constructor.name);
+      const actionType = action instanceof ModifyContentAction ? action.type : action.typeName;
+      const strategy = ActionHandleStrategyRegistry.get(actionType, RTEInstance.typeName);
       if (strategy) {
         action['executedFlag'] = true;
         return strategy.execute(action, RTEInstance);
       }
       else {
-        LogUtility.warn(`Type ${actionType} action handle strategy is not registered in class ${RTEInstance.constructor.name}`);
+        LogUtility.warn(`Type ${actionType} action handle strategy is not registered in class ${RTEInstance.typeName}`);
       }
     };
     if (interceptor) {
@@ -1033,7 +1044,7 @@ class ActionHandleStrategyRegistry {
    * @returns {boolean} - Whether the action type can be handled by the strategy.
    */
   static canHandle(actionType, RTEInstance) {
-    const strategy = ActionHandleStrategyRegistry.get(actionType, RTEInstance.constructor.name);
+    const strategy = ActionHandleStrategyRegistry.get(actionType, RTEInstance.typeName);
     return strategy ? true : false;
   }
 }
@@ -1388,7 +1399,7 @@ class RTEFilterStylesStrategyRegistry {
    * Registers a filter styles strategy for a specific DTO class name.
    * Duplicate strategy instances are ignored.
    *
-   * @param {string} dtoClassName - The DTO class name (e.g. `RTEListBlock.name`).
+   * @param {string} dtoClassName - The DTO class name (e.g. `RTEListBlock.typeName`).
    * @param {RTEFilterStylesStrategy} strategy - The strategy instance to register.
    */
   static register(dtoClassName, strategy) {
@@ -1417,7 +1428,7 @@ class RTEFilterStylesStrategyRegistry {
    * The instance is also passed to matched strategies so they can make decisions from DTO annotations.
    */
   static executeTheStrategyFilterAction(blockOrNodeInstance, styles, classNames) {
-    const dtoClassName = blockOrNodeInstance.dtoName;
+    const dtoClassName = blockOrNodeInstance.typeName;
     const strategies = this.getStrategies(dtoClassName);
     const matchedStrategies = strategies.filter((strategy) => {
       return strategy.canFilter(blockOrNodeInstance);
@@ -1483,14 +1494,10 @@ var NodeTypeEnum;
 /**
  * Abstract class for all nodes
  */
-class RTENode {
+class RTENode extends Discriminated {
   constructor(id, annotationMap) {
+    super();
     this.annotationMap = new Map();
-    /**
-     * Minimize-safe type discriminator. Each concrete sub-class declares its own
-     * `static readonly dtoName = 'ClassName'`.
-     */
-    this.dtoName = this.constructor.name;
     this.id = id;
     if (annotationMap) {
       this.annotationMap = annotationMap;
@@ -1504,7 +1511,7 @@ class RTENode {
    * @param {VegaRTETransformOptions} options - Options for transforming the node.
    */
   static from(json, parentBlock, options) {
-    throw new Error(`[Vega] ${this.constructor.name}.from(${JSON.stringify(json)}, ${parentBlock}, ${options}) is not implemented. Please implement this method in the subclass.`);
+    throw new Error(`[Vega] ${this.typeName}.from(${JSON.stringify(json)}, ${parentBlock}, ${options}) is not implemented. Please implement this method in the subclass.`);
   }
   /**
    * Creates different types of text annotations based on the provided type and value.
@@ -1693,6 +1700,7 @@ class RTENode {
   doModifyActionApply(action) {
   }
 }
+RTENode.typeName = 'RTENode';
 
 /**
  * RTEDTOClassManager is a singleton class that manages the registration and retrieval of RTE DTO classes.
@@ -1747,14 +1755,10 @@ const RTEDTOClassManager$1 = new RTEDTOClassManager();
 /**
  * Abstract class for block
  */
-class RTEBlock {
+class RTEBlock extends Discriminated {
   constructor(id) {
+    super();
     this.annotationMap = new Map();
-    /**
-     * Minimize-safe type discriminator. Each concrete sub-class declares its own
-     * `static readonly dtoName = 'ClassName'`.
-     */
-    this.dtoName = this.constructor.name;
     this.id = id;
   }
   /**
@@ -1764,7 +1768,7 @@ class RTEBlock {
    * @param {VegaRTETransformOptions} options - Options for transforming the block.
    */
   static from(json, options) {
-    throw new Error(`[Vega] ${this.constructor.name}.from(${JSON.stringify(json)}, ${options}) is not implemented. Please implement this method in the subclass.`);
+    throw new Error(`[Vega] ${this.typeName}.from(${JSON.stringify(json)}, ${options}) is not implemented. Please implement this method in the subclass.`);
   }
   /**
    * Generates block children from an array of VegaRTEContentBlock.
@@ -2017,7 +2021,7 @@ class RTEBlock {
       this.doAnnotationActionApply(action);
     }
     else {
-      const strategy = ActionHandleStrategyRegistry.get(action.constructor.name, this.constructor.name);
+      const strategy = ActionHandleStrategyRegistry.get(action.typeName, this.typeName);
       if (strategy) {
         strategy.execute(action, this);
       }
@@ -2032,101 +2036,84 @@ class RTEBlock {
     return new Map(Array.from(this.annotationMap.entries()).map(([key, value]) => [key, value.clone()]));
   }
 }
+RTEBlock.typeName = 'RTEBlock';
 
 /**
- * Abstract class for annotation actions
- */
-class AnnotationAction {
-}
-
-/**
- * Abstract class for which can be splittable
+ * Append children to a block or rte content
+ *
+ * @example parent.apply(new AppendChildrenAction([newChildren]))
  */
-class TextSplittableAction extends AnnotationAction {
-  constructor() {
-    super(...arguments);
-    /**
-     * Whether the action should split the node
-     */
-    this.doSplit = true;
+class AppendChildrenAction extends ModifyContentAction {
+  constructor(childNodes) {
+    super();
+    this.type = ModifyContentActionType.APPEND_CHILDREN;
+    this.entityToBeAppended = childNodes;
   }
 }
 
+const TEXT_STYLE_DEFAULT_FONT_WEIGHT = '500';
+const TEXT_STYLE_BASE = {
+  fontFamily: 'Inter',
+  fontSize: '16px',
+  lineHeight: '22px',
+  minHeight: '22px',
+  fontWeight: TEXT_STYLE_DEFAULT_FONT_WEIGHT,
+};
+const PARAGRAPH_TEXT_STYLE = Object.assign(Object.assign({}, TEXT_STYLE_BASE), { marginTop: '0px', marginBottom: '0px' });
+const TEXT_STYLE_DEFAULTS = {
+  'paragraph': PARAGRAPH_TEXT_STYLE,
+  'title': Object.assign(Object.assign({}, TEXT_STYLE_BASE), { fontSize: '36px', lineHeight: '40px', minHeight: '40px' }),
+  'subtitle': Object.assign(Object.assign({}, TEXT_STYLE_BASE), { fontSize: '28px', lineHeight: '32px', minHeight: '32px' }),
+  'heading-1': Object.assign(Object.assign({}, PARAGRAPH_TEXT_STYLE), { fontSize: '22px', lineHeight: '24px', minHeight: '24px' }),
+  'heading-2': Object.assign(Object.assign({}, PARAGRAPH_TEXT_STYLE), { fontSize: '20px', lineHeight: '24px', minHeight: '24px' }),
+  'heading-3': Object.assign(Object.assign({}, PARAGRAPH_TEXT_STYLE), { fontSize: '18px' }),
+  'heading-4': Object.assign({}, PARAGRAPH_TEXT_STYLE),
+  'heading-5': Object.assign(Object.assign({}, PARAGRAPH_TEXT_STYLE), { fontSize: '14px' }),
+  'heading-6': Object.assign(Object.assign({}, PARAGRAPH_TEXT_STYLE), { fontSize: '12px' }),
+};
+
 /**
- * Annotation to represent a selection range
+ * Text style annotation
  */
-class SelectionRangeAnnotation extends Annotation {
-  constructor(range) {
+class TextStyleAnnotation extends BlockAnnotation {
+  constructor(textStyle) {
     super();
-    this.type = InternalAnnotationTypeEnum.SELECTION_RANGE;
-    this.range = range;
+    this.type = BlockAnnotationTypeEnum.TEXT_STYLE;
+    this.textStyle = textStyle;
   }
   /**
-   * Clone the selection range annotation
+   * Generate the map item for the annotations
    *
-   * @returns {SelectionRangeAnnotation} A cloned instance of the selection range annotation
+   * @param {VegaRTETextStyleType} textStyle - the text style type
+   * @returns {[BlockAnnotationTypeEnum.TEXT_STYLE, TextStyleAnnotation]} Map item for the annotation
    */
-  clone() {
-    return new SelectionRangeAnnotation(this.range);
-  }
-}
-
-/**
- * Default CSS style values produced by inline text-formatting annotations.
- *
- * These constants are the single source of truth for the CSS values that
- * bold, italic, underline and strikethrough semantic annotations render as
- * (in standalone mode) and that annotation handlers / filter strategies use
- * to detect or remove redundant inline styles.
- */
-/** CSS `font-weight` value rendered by the bold annotation. */
-const BOLD_FONT_WEIGHT = '700';
-/** Alternative `font-weight` keyword that browsers report for bold elements. */
-const BOLD_FONT_WEIGHT_KEYWORD = 'bold';
-/** CSS `font-style` value rendered by the italic annotation. */
-const ITALIC_FONT_STYLE = 'italic';
-/** CSS `text-decoration` token rendered by the underline annotation. */
-const UNDERLINE_TEXT_DECORATION = 'underline';
-/** CSS `text-decoration` token rendered by the strikethrough annotation. */
-const STRIKETHROUGH_TEXT_DECORATION = 'line-through';
-/** CSS `font-family` value rendered by the code annotation. */
-const CODE_FONT_FAMILY = 'Roboto Mono';
-/** CSS `white-space` value rendered by the code annotation. */
-const CODE_WHITE_SPACE = 'pre-wrap';
-
-/**
- * Annotation to make text with strikethrough
- */
-class StrikethroughAnnotation extends NodeAnnotation {
-  constructor(underline) {
-    super();
-    this.type = NodeAnnotationTypeEnum.STRIKETHROUGH;
-    this.strikethrough = underline;
+  static from(textStyle) {
+    return [BlockAnnotationTypeEnum.TEXT_STYLE, new TextStyleAnnotation(textStyle)];
   }
   /**
-   * Generate the map item for the annotation
+   * Get the default styles for a given text style type.
    *
-   * @param {Nullable<boolean>} strikethrough - Strikethrough annotation
-   * @returns {[NodeAnnotationTypeEnum.STRIKETHROUGH, StrikethroughAnnotation]} Map item for the annotation
+   * @param {VegaRTETextStyleType} textStyle - The text style type.
+   * @returns {Nullable<AnnotationStyle>} The default styles for the given text style type.
    */
-  static from(strikethrough) {
-    return [NodeAnnotationTypeEnum.STRIKETHROUGH, new StrikethroughAnnotation(strikethrough)];
+  static getDefaultStyles(textStyle) {
+    if (!textStyle)
+      return null;
+    return TEXT_STYLE_DEFAULTS[textStyle];
   }
   /**
    * Generate the JSON representation of the annotation
    *
-   * @returns {Record<string, unknown>} JSON representation of the annotation
+   * @returns {Nullable<Record<string, unknown>>} JSON representation of the annotation
    */
   toJSON() {
-    return {
-      strikethrough: this.strikethrough,
-    };
+    return { textStyle: this.textStyle };
   }
   /**
    * @inheritDoc
    */
   clone() {
-    return new StrikethroughAnnotation(this.strikethrough);
+    return new TextStyleAnnotation(this.textStyle);
   }
   /**
    * @inheritDoc
@@ -2134,7 +2121,7 @@ class StrikethroughAnnotation extends NodeAnnotation {
   renderClass(options) {
     if (options === null || options === void 0 ? void 0 : options.standalone)
       return null;
-    return this.strikethrough ? 'v-rte--strikethrough' : null;
+    return this.textStyle ? `v-rte--text-style-${this.textStyle}` : null;
   }
   /**
    * @inheritDoc
@@ -2142,131 +2129,628 @@ class StrikethroughAnnotation extends NodeAnnotation {
   renderStyle(options) {
     if (!(options === null || options === void 0 ? void 0 : options.standalone))
       return null;
-    return this.strikethrough ? { textDecoration: STRIKETHROUGH_TEXT_DECORATION } : null;
+    return this.textStyle ? TextStyleAnnotation.getDefaultStyles(this.textStyle) : null;
   }
 }
 
 /**
- * Annotation to make text with underline
+ * Abstract class for annotation actions
  */
-class UnderlineAnnotation extends NodeAnnotation {
-  constructor(underline) {
+class AnnotationAction extends Discriminated {
+}
+AnnotationAction.typeName = 'AnnotationAction';
+
+/**
+ * Action to change the text style of a block
+ */
+class TextStyleAnnotationAction extends AnnotationAction {
+  constructor(textStyle, bold) {
     super();
-    this.type = NodeAnnotationTypeEnum.UNDERLINE;
-    this.underline = underline;
-  }
-  /**
-   * Generate the map item for the annotation
-   *
-   * @param {boolean} underline - Underline annotation
-   * @returns {[NodeAnnotationTypeEnum.UNDERLINE, UnderlineAnnotation]} Map item for the annotation
-   */
-  static from(underline) {
-    return [NodeAnnotationTypeEnum.UNDERLINE, new UnderlineAnnotation(underline)];
+    this.isFlushable = true;
+    this.textStyle = textStyle;
+    this.bold = bold;
   }
   /**
-   * Generate the JSON representation of the annotation
+   * Converts the action to a block annotation
    *
-   * @returns {Record<string, unknown>} JSON representation of the annotation
-   */
-  toJSON() {
-    return {
-      underline: this.underline,
-    };
-  }
-  /**
-   * @inheritDoc
-   */
-  clone() {
-    return new UnderlineAnnotation(this.underline);
-  }
-  /**
-   * @inheritDoc
-   */
-  renderClass(options) {
-    if (options === null || options === void 0 ? void 0 : options.standalone)
-      return null;
-    return this.underline ? 'v-rte--underline' : null;
-  }
-  /**
-   * @inheritDoc
+   * @returns {BlockAnnotation} the block annotation
    */
-  renderStyle(options) {
-    if (!(options === null || options === void 0 ? void 0 : options.standalone))
-      return null;
-    return this.underline ? { textDecoration: UNDERLINE_TEXT_DECORATION } : null;
+  toAnnotation() {
+    return new TextStyleAnnotation(this.textStyle);
   }
 }
+TextStyleAnnotationAction.typeName = 'TextStyleAnnotationAction';
 
 /**
- * Annotation to make text Italic
+ * Annotation to make text a link
  */
-class ItalicAnnotation extends NodeAnnotation {
-  constructor(italic) {
+class LinkAnnotation extends NodeAnnotation {
+  constructor(link, useInternalStyle = true) {
     super();
-    this.type = NodeAnnotationTypeEnum.ITALIC;
-    this.italic = italic;
+    this.type = NodeAnnotationTypeEnum.LINK;
+    this.link = link;
+    this.useInternalStyle = useInternalStyle;
   }
   /**
    * Generate the map item for the annotation
    *
-   * @param {boolean} italic - Italic annotation
-   * @returns {[NodeAnnotationTypeEnum.ITALIC, ItalicAnnotation]} Map item for the annotation
+   * @param {VegaRTELink} link - Bold annotation
+   * @param {boolean} useInternalStyle - Whether to use default style for the link
+   * @returns {[NodeAnnotationTypeEnum.LINK, LinkAnnotation]} Map item for the annotation
    */
-  static from(italic) {
-    return [NodeAnnotationTypeEnum.ITALIC, new ItalicAnnotation(italic)];
+  static from(link, useInternalStyle = true) {
+    return [NodeAnnotationTypeEnum.LINK, new LinkAnnotation(link, useInternalStyle)];
   }
   /**
    * Generate the JSON representation of the annotation
    *
-   * @returns {Record<string, unknown>} JSON representation of the annotation
+   * @returns {Record<'link', VegaRTELink>} JSON representation of the annotation
    */
   toJSON() {
     return {
-      italic: this.italic,
+      link: this.link,
     };
   }
   /**
    * @inheritDoc
    */
   clone() {
-    return new ItalicAnnotation(this.italic);
+    return new LinkAnnotation(this.link, this.useInternalStyle);
+  }
+  /**
+   * Verify whether two link annotation is same or not
+   *
+   * @param {LinkAnnotation} annotation - Compared annotation
+   * @returns {boolean} Whether two link annotation is same or not
+   */
+  toEqual(annotation) {
+    return this.link.groupKey === annotation.link.groupKey;
   }
   /**
    * @inheritDoc
    */
-  renderClass(options) {
-    if (options === null || options === void 0 ? void 0 : options.standalone)
-      return null;
-    return this.italic ? 'v-rte--italic' : null;
+  renderClass() {
+    return null;
   }
   /**
    * @inheritDoc
    */
-  renderStyle(options) {
-    if (!(options === null || options === void 0 ? void 0 : options.standalone))
-      return null;
-    return this.italic ? { fontStyle: ITALIC_FONT_STYLE } : null;
+  renderStyle() {
+    return null;
   }
 }
 
 /**
- * Annotation to make text bold
+ * Abstract class for which can be splittable
  */
-class BoldAnnotation extends NodeAnnotation {
-  constructor(bold) {
-    super();
-    this.type = NodeAnnotationTypeEnum.BOLD;
-    this.bold = bold;
+class TextSplittableAction extends AnnotationAction {
+  constructor() {
+    super(...arguments);
+    /**
+     * Whether the action should split the node
+     */
+    this.doSplit = true;
   }
-  /**
-   * Generate the map item for the annotation
-   *
-   * @param {boolean} bold - Bold annotation
-   * @returns {[NodeAnnotationTypeEnum.BOLD, BoldAnnotation]} Map item for the annotation
-   */
-  static from(bold) {
-    return [NodeAnnotationTypeEnum.BOLD, new BoldAnnotation(bold)];
+}
+TextSplittableAction.typeName = 'TextSplittableAction';
+
+/**
+ * Action to toggle link annotation
+ */
+class LinkAnnotationAction extends TextSplittableAction {
+  constructor({ link, newText, needMergeNode, doSplit, type, }) {
+    super();
+    this.isFlushable = true;
+    this.link = link;
+    this.needMergeNode = needMergeNode;
+    this.newText = newText;
+    this.type = type;
+    if (isNonNullable(doSplit)) {
+      this.doSplit = doSplit;
+    }
+  }
+  /**
+   * Converts the action to an annotation
+   *
+   * @returns {LinkAnnotation} the annotation
+   */
+  toAnnotation() {
+    return new LinkAnnotation(this.link);
+  }
+}
+LinkAnnotationAction.typeName = 'LinkAnnotationAction';
+
+/**
+ * Action to link a group of nodes
+ */
+class LinkGroupAnnotationAction extends AnnotationAction {
+  constructor(groupKey, nodes, type) {
+    super();
+    this.isFlushable = false;
+    this.groupKey = groupKey;
+    this.nodes = nodes;
+    this.type = type;
+  }
+  /**
+   * Converts the action to an annotation
+   *
+   * @returns {Annotation} The annotation
+   */
+  toAnnotation() {
+    return new LinkGroupAnnotation(this.groupKey);
+  }
+}
+LinkGroupAnnotationAction.typeName = 'LinkGroupAnnotationAction';
+
+/**
+ * Default CSS style values produced by inline text-formatting annotations.
+ *
+ * These constants are the single source of truth for the CSS values that
+ * bold, italic, underline and strikethrough semantic annotations render as
+ * (in standalone mode) and that annotation handlers / filter strategies use
+ * to detect or remove redundant inline styles.
+ */
+/** CSS `font-weight` value rendered by the bold annotation. */
+const BOLD_FONT_WEIGHT = '700';
+/** Alternative `font-weight` keyword that browsers report for bold elements. */
+const BOLD_FONT_WEIGHT_KEYWORD = 'bold';
+/** CSS `font-style` value rendered by the italic annotation. */
+const ITALIC_FONT_STYLE = 'italic';
+/** CSS `text-decoration` token rendered by the underline annotation. */
+const UNDERLINE_TEXT_DECORATION = 'underline';
+/** CSS `text-decoration` token rendered by the strikethrough annotation. */
+const STRIKETHROUGH_TEXT_DECORATION = 'line-through';
+/** CSS `font-family` value rendered by the code annotation. */
+const CODE_FONT_FAMILY = 'Roboto Mono';
+/** CSS `white-space` value rendered by the code annotation. */
+const CODE_WHITE_SPACE = 'pre-wrap';
+
+/**
+ * Annotation to make text bold
+ */
+class BoldAnnotation extends NodeAnnotation {
+  constructor(bold) {
+    super();
+    this.type = NodeAnnotationTypeEnum.BOLD;
+    this.bold = bold;
+  }
+  /**
+   * Generate the map item for the annotation
+   *
+   * @param {boolean} bold - Bold annotation
+   * @returns {[NodeAnnotationTypeEnum.BOLD, BoldAnnotation]} Map item for the annotation
+   */
+  static from(bold) {
+    return [NodeAnnotationTypeEnum.BOLD, new BoldAnnotation(bold)];
+  }
+  /**
+   * @inheritDoc
+   */
+  get isFormattingOnly() {
+    return true;
+  }
+  /**
+   * Generate the JSON representation of the annotation
+   *
+   * @returns {Record<string, unknown>} JSON representation of the annotation
+   */
+  toJSON() {
+    return {
+      bold: this.bold,
+    };
+  }
+  /**
+   * @inheritDoc
+   */
+  clone() {
+    return new BoldAnnotation(this.bold);
+  }
+  /**
+   * @inheritDoc
+   */
+  renderClass(options) {
+    if (options === null || options === void 0 ? void 0 : options.standalone)
+      return null;
+    return this.bold ? 'v-rte--bold' : null;
+  }
+  /**
+   * @inheritDoc
+   */
+  renderStyle(options) {
+    if (!(options === null || options === void 0 ? void 0 : options.standalone))
+      return null;
+    return this.bold ? { fontWeight: BOLD_FONT_WEIGHT } : null;
+  }
+}
+
+/**
+ * Action to toggle bold annotation
+ */
+class BoldAnnotationAction extends TextSplittableAction {
+  constructor(bold) {
+    super();
+    this.isFlushable = true;
+    this.bold = bold;
+  }
+  /**
+   * Converts the action to an annotation
+   *
+   * @returns {BoldAnnotation} the annotation
+   */
+  toAnnotation() {
+    return new BoldAnnotation(this.bold);
+  }
+}
+BoldAnnotationAction.typeName = 'BoldAnnotationAction';
+
+/**
+ * Delete the node annotation by type
+ */
+class DeleteNodeAnnotationAction extends AnnotationAction {
+  constructor(annotationType) {
+    super();
+    this.isFlushable = true;
+    this.annotationType = annotationType;
+  }
+  /**
+   * Don't need this for this action
+   *
+   * @returns {Nullable<Annotation>} undefined
+   */
+  toAnnotation() {
+    return undefined;
+  }
+}
+DeleteNodeAnnotationAction.typeName = 'DeleteNodeAnnotationAction';
+
+/**
+ * The base action handle strategy class, use to modify the rich text node content or modify the annotation.
+ */
+class ActionHandleStrategy {
+  /**
+   * Public method to invoke the handle logic.
+   *
+   * @typedef R generic type
+   * @param {ModifyContentAction | AnnotationAction} action - The action instance. Contains the action type and necessary params.
+   * @param {RTENode | RTEBlock | VegaRTEContent} target - The rich text node instance that will be modified.
+   * @returns {R} - The invoke result in special strategy.
+   */
+  execute(action, target) {
+    const actionType = action instanceof ModifyContentAction ? action.type : action.typeName;
+    LogUtility.log(`Executing action ${actionType} on ${target.typeName} ${target['id']}`);
+    return this.handleAction(action, target);
+  }
+  /**
+   * Update the custom style annotation of a block or node
+   *
+   * @param {RTEBlock | RTETextNode} item - block or node
+   * @param {string[]} styleKeys - custom style keys, for examples ['fontSize', 'fontWeight'].
+   */
+  updateCustomStyleAnnotation(item, styleKeys) {
+    const customStyleAnnotation = item.annotationMap.get(CommonAnnotationTypeEnum.CUSTOM_STYLE);
+    if (customStyleAnnotation && this.isCustomStyle(customStyleAnnotation, styleKeys)) {
+      item.annotationMap.set(customStyleAnnotation.type, new CustomStyleAnnotation(customStyleAnnotation.removeStyles(styleKeys)));
+    }
+  }
+  /**
+   * Create a new paragraph block with the given text.
+   *
+   * @param {string} text - The text content for the new paragraph.
+   * @returns {Nullable<RTETextBlock>} - The newly created paragraph block, or null if creation failed.
+   */
+  createNewParagraph(text) {
+    const dtoClass = RTEDTOClassManager$1.getRTEBlockClass('paragraph');
+    if (dtoClass) {
+      const newParagraph = dtoClass.from({
+        id: generateUUID(),
+        type: 'paragraph',
+        nodes: [{ id: generateUUID(), type: 'text', text }],
+      });
+      return newParagraph;
+    }
+  }
+  /**
+   * Get the root content from a child block or node.
+   *
+   * @param {RTEBlock | RTENode} child - The child block or node.
+   * @returns {Nullable<VegaRTEContent>} The root content, if found.
+   */
+  getRootContent(child) {
+    const parent = child.parent;
+    if (parent) {
+      if (parent.typeName === 'VegaRTEContent') {
+        return parent;
+      }
+      else {
+        return this.getRootContent(parent);
+      }
+    }
+  }
+  /**
+   * Check the caret position at the start of a block.
+   *
+   * @param {RTEBlock} block - The RTE Block.
+   * @param {RTENode} node - The RTE Node.
+   * @param {number} offset - The offset position.
+   * @returns {boolean} - Whether the caret is at the start of the block.
+   */
+  isCaretPositionAtBlockStart(block, node, offset) {
+    return node === block.children[0] && offset === 0;
+  }
+  /**
+   * Check the caret position at the end of a block.
+   *
+   * @param {RTEBlock} block - The RTE Block.
+   * @param {RTENode} node - The RTE Node.
+   * @param {number} offset - The offset position.
+   * @returns {boolean} - Whether the caret is at the end of the block.
+   */
+  isCaretPositionAtBlockEnd(block, node, offset) {
+    if (!node.isContentEditable()) {
+      return this.isCaretPositionAtDecoratorBlockEnd(block, node, offset);
+    }
+    else {
+      return this.isCaretPositionAtTextBlockEnd(block, node, offset);
+    }
+  }
+  /**
+   * Get the registered DOM element by the RTE entity.
+   *
+   * @param {RTEBlock | RTENode} instance - The RTE block or node instance.
+   * @returns {Nullable<HTMLElement>} The registered DOM element.
+   */
+  getDOMByEntity(instance) {
+    return stateEntityRenderingRegistry.getDOMByEntity(instance);
+  }
+  /**
+   * Checks if the caret position is at the end of a specified RTETextNode.
+   *
+   * @param {RTETextBlock} textBlock - `RTETextBlock` - a text block.
+   * @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.
+   */
+  isCaretPositionAtTextBlockEnd(textBlock, node, startOffset) {
+    const lastNode = textBlock.children[textBlock.children.length - 1];
+    return node === lastNode && (node.isEmpty() || startOffset === lastNode.text.length);
+  }
+  /**
+   * Checks if the caret position is at the end of a given decorator node.
+   *
+   * @param {RTEBlock} target - The image block.
+   * @param {RTENode} node - `node` is a RTEDecoratorNode or non-editable text node.
+   * @param {number} startOffset - The position within the `RTEDecoratorNode` where the caret is located.
+   * @returns {boolean}Returns a boolean value indicating whether the caret position is at the end of the `RTEDecoratorNode`.
+   */
+  isCaretPositionAtDecoratorBlockEnd(target, node, startOffset) {
+    return node === target.children[target.children.length - 1] && startOffset !== 0;
+  }
+  /**
+   * Determines if the custom style annotation includes any the custom style.
+   *
+   * @param {CustomStyleAnnotation} customStyleAnnotation - custom style annotation
+   * @param {string[]} styleKeys - custom style keys, for examples ['fontSize', 'fontWeight'].
+   * @returns {boolean} - True if the custom key includes the custom style, false otherwise.
+   */
+  isCustomStyle(customStyleAnnotation, styleKeys) {
+    return styleKeys.some((item) => Object.keys(customStyleAnnotation.customStyle).includes(item));
+  }
+}
+
+/**
+ * Update the text block text style strategy.
+ */
+class BlockUpdateTextStyleStrategy extends ActionHandleStrategy {
+  /**
+   * Update the text block type and add or remove the bold style from child nodes.
+   *
+   * @param {TextStyleAnnotationAction} action - The text style annotation action.
+   * @param {RTETextBlock} target - The current text block.
+   */
+  handleAction(action, target) {
+    if (target.type !== 'list-item') {
+      target.type = action.textStyle;
+    }
+    if (action.bold) {
+      target.children.forEach((node) => {
+        const boldAnnotationAction = new BoldAnnotationAction(true);
+        boldAnnotationAction.doSplit = false;
+        node.apply(boldAnnotationAction);
+      });
+    }
+    else {
+      target.children.forEach((node) => {
+        node.apply(new DeleteNodeAnnotationAction(NodeAnnotationTypeEnum.BOLD));
+      });
+    }
+    this.updateCustomStyleAnnotation(target, ['fontFamily', 'lineHeight', 'fontWeight', 'fontSize']);
+  }
+}
+
+/**
+ * Update the text block link group annotation strategy.
+ */
+class BlockUpdateLinkGroupStrategy extends ActionHandleStrategy {
+  /**
+   * Update link group after the child link node update.
+   *
+   * @param {LinkGroupAnnotationAction} action - The link group annotation action instance.
+   * @param {RTETextBlock} target - The current text block.
+   */
+  handleAction(action, target) {
+    let linkGroupAnnotation = target.getAnnotationByType(InternalAnnotationTypeEnum.LINK_GROUP);
+    if (action.type === 'update_link') {
+      if (linkGroupAnnotation) {
+        const linkGroup = linkGroupAnnotation.linkGroups.get(action.groupKey);
+        if (linkGroup) {
+          linkGroupAnnotation.linkGroups.set(action.groupKey, [linkGroup[0]]);
+        }
+      }
+    }
+    else {
+      if (linkGroupAnnotation) {
+        const linkGroup = linkGroupAnnotation.linkGroups.get(action.groupKey) || [];
+        linkGroupAnnotation.linkGroups.set(action.groupKey, [...linkGroup, ...action.nodes]);
+      }
+      else {
+        linkGroupAnnotation = action.toAnnotation();
+        linkGroupAnnotation.linkGroups.set(action.groupKey, [...action.nodes]);
+      }
+      target.annotationMap.set(InternalAnnotationTypeEnum.LINK_GROUP, linkGroupAnnotation);
+    }
+  }
+}
+
+/**
+ * Insert a new children after a existing children
+ *
+ * @example parent.apply(new InsertChildrenAfterAction(existingChildren, newChildren, ...))
+ */
+class InsertChildrenAfterAction extends ModifyContentAction {
+  constructor(referBlock, ...blocksToBeInserted) {
+    super();
+    this.type = ModifyContentActionType.INSERT_CHILDREN_AFTER;
+    this.referChildren = referBlock;
+    this.childrenToBeInserted = blocksToBeInserted;
+  }
+}
+
+/**
+ * Clear the current block nodes and append new nodes
+ *
+ * @example block.apply(new ReplaceChildNodesAction(newNodes))
+ */
+class ReplaceChildNodesAction extends ModifyContentAction {
+  constructor(newChildNodes) {
+    super();
+    this.type = ModifyContentActionType.REPLACE_CHILD_NODES;
+    this.newChildNodes = newChildNodes;
+  }
+}
+
+/**
+ * Split the current node with a special position strategy.
+ */
+class BlockSplitWithTextNodeStrategy extends ActionHandleStrategy {
+  /**
+   * @inheritDoc
+   */
+  handleAction(action, target) {
+    action.newBlock = this.splitTextNodeBlock(action.splitPointNode, action.startOffsetOfNode, target);
+  }
+  /**
+   * 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`.
+   * @param {RTETextBlock} textBlock - The text block need to be splited.
+   * @returns {Nullable<RTEBlock>} return either an RTEBlock object or null.
+   */
+  splitTextNodeBlock(splitNode, startOffsetOfNode, textBlock) {
+    if (splitNode) {
+      const beforeText = splitNode.text.slice(0, startOffsetOfNode);
+      const afterText = splitNode.text.slice(startOffsetOfNode);
+      const nodesSplitIndex = textBlock.children.indexOf(splitNode);
+      if (nodesSplitIndex > -1) {
+        const beforeNodes = textBlock.children.slice(0, nodesSplitIndex);
+        const afterNodes = textBlock.children.slice(nodesSplitIndex + 1);
+        if (splitNode.isContentEditable()) {
+          if (beforeText) {
+            beforeNodes.push(splitNode.cloneWithText(beforeText));
+          }
+          if (afterText) {
+            afterNodes.unshift(splitNode.cloneWithText(afterText));
+          }
+        }
+        else {
+          startOffsetOfNode > 0 ? beforeNodes.push(splitNode) : afterNodes.unshift(splitNode);
+        }
+        textBlock.apply(new ReplaceChildNodesAction(beforeNodes));
+        const newBlock = textBlock.cloneWithNodes(afterNodes);
+        textBlock.parent.apply(new InsertChildrenAfterAction(textBlock, newBlock));
+        return newBlock;
+      }
+    }
+  }
+}
+
+/**
+ * Remove all nodes and append new nodes strategy.
+ */
+class BlockReplaceNodesStrategy extends ActionHandleStrategy {
+  /**
+   * Empty the text block or image block nodes and add new nodes.
+   *
+   * @param {ReplaceChildNodesAction} action - The replace child nodes action instance.
+   * @param {RTETextBlock | RTEImageBlock} target - The text block or the image block.
+   */
+  handleAction(action, target) {
+    target.children = [];
+    target.apply(new AppendChildrenAction(action.newChildNodes));
+  }
+}
+
+/**
+ * Remove a children from the current block
+ *
+ * @example needRemovedChildren.parent.apply(new RemoveChildrenAction(needRemovedChildren))
+ */
+class RemoveChildrenAction extends ModifyContentAction {
+  constructor(childNode) {
+    super();
+    this.type = ModifyContentActionType.DELETE_CHILDREN;
+    this.entityToBeRemoved = childNode;
+  }
+}
+
+/**
+ * Annotation to represent a selection range
+ */
+class SelectionRangeAnnotation extends Annotation {
+  constructor(range) {
+    super();
+    this.type = InternalAnnotationTypeEnum.SELECTION_RANGE;
+    this.range = range;
+  }
+  /**
+   * @inheritDoc
+   */
+  get isFormattingOnly() {
+    return true;
+  }
+  /**
+   * Clone the selection range annotation
+   *
+   * @returns {SelectionRangeAnnotation} A cloned instance of the selection range annotation
+   */
+  clone() {
+    return new SelectionRangeAnnotation(this.range);
+  }
+}
+
+/**
+ * Annotation to make text with strikethrough
+ */
+class StrikethroughAnnotation extends NodeAnnotation {
+  constructor(underline) {
+    super();
+    this.type = NodeAnnotationTypeEnum.STRIKETHROUGH;
+    this.strikethrough = underline;
+  }
+  /**
+   * Generate the map item for the annotation
+   *
+   * @param {Nullable<boolean>} strikethrough - Strikethrough annotation
+   * @returns {[NodeAnnotationTypeEnum.STRIKETHROUGH, StrikethroughAnnotation]} Map item for the annotation
+   */
+  static from(strikethrough) {
+    return [NodeAnnotationTypeEnum.STRIKETHROUGH, new StrikethroughAnnotation(strikethrough)];
+  }
+  /**
+   * @inheritDoc
+   */
+  get isFormattingOnly() {
+    return true;
   }
   /**
    * Generate the JSON representation of the annotation
@@ -2275,14 +2759,14 @@ class BoldAnnotation extends NodeAnnotation {
    */
   toJSON() {
     return {
-      bold: this.bold,
+      strikethrough: this.strikethrough,
     };
   }
   /**
    * @inheritDoc
    */
   clone() {
-    return new BoldAnnotation(this.bold);
+    return new StrikethroughAnnotation(this.strikethrough);
   }
   /**
    * @inheritDoc
@@ -2290,7 +2774,7 @@ class BoldAnnotation extends NodeAnnotation {
   renderClass(options) {
     if (options === null || options === void 0 ? void 0 : options.standalone)
       return null;
-    return this.bold ? 'v-rte--bold' : null;
+    return this.strikethrough ? 'v-rte--strikethrough' : null;
   }
   /**
    * @inheritDoc
@@ -2298,7 +2782,123 @@ class BoldAnnotation extends NodeAnnotation {
   renderStyle(options) {
     if (!(options === null || options === void 0 ? void 0 : options.standalone))
       return null;
-    return this.bold ? { fontWeight: BOLD_FONT_WEIGHT } : null;
+    return this.strikethrough ? { textDecoration: STRIKETHROUGH_TEXT_DECORATION } : null;
+  }
+}
+
+/**
+ * Annotation to make text with underline
+ */
+class UnderlineAnnotation extends NodeAnnotation {
+  constructor(underline) {
+    super();
+    this.type = NodeAnnotationTypeEnum.UNDERLINE;
+    this.underline = underline;
+  }
+  /**
+   * Generate the map item for the annotation
+   *
+   * @param {boolean} underline - Underline annotation
+   * @returns {[NodeAnnotationTypeEnum.UNDERLINE, UnderlineAnnotation]} Map item for the annotation
+   */
+  static from(underline) {
+    return [NodeAnnotationTypeEnum.UNDERLINE, new UnderlineAnnotation(underline)];
+  }
+  /**
+   * @inheritDoc
+   */
+  get isFormattingOnly() {
+    return true;
+  }
+  /**
+   * Generate the JSON representation of the annotation
+   *
+   * @returns {Record<string, unknown>} JSON representation of the annotation
+   */
+  toJSON() {
+    return {
+      underline: this.underline,
+    };
+  }
+  /**
+   * @inheritDoc
+   */
+  clone() {
+    return new UnderlineAnnotation(this.underline);
+  }
+  /**
+   * @inheritDoc
+   */
+  renderClass(options) {
+    if (options === null || options === void 0 ? void 0 : options.standalone)
+      return null;
+    return this.underline ? 'v-rte--underline' : null;
+  }
+  /**
+   * @inheritDoc
+   */
+  renderStyle(options) {
+    if (!(options === null || options === void 0 ? void 0 : options.standalone))
+      return null;
+    return this.underline ? { textDecoration: UNDERLINE_TEXT_DECORATION } : null;
+  }
+}
+
+/**
+ * Annotation to make text Italic
+ */
+class ItalicAnnotation extends NodeAnnotation {
+  constructor(italic) {
+    super();
+    this.type = NodeAnnotationTypeEnum.ITALIC;
+    this.italic = italic;
+  }
+  /**
+   * Generate the map item for the annotation
+   *
+   * @param {boolean} italic - Italic annotation
+   * @returns {[NodeAnnotationTypeEnum.ITALIC, ItalicAnnotation]} Map item for the annotation
+   */
+  static from(italic) {
+    return [NodeAnnotationTypeEnum.ITALIC, new ItalicAnnotation(italic)];
+  }
+  /**
+   * @inheritDoc
+   */
+  get isFormattingOnly() {
+    return true;
+  }
+  /**
+   * Generate the JSON representation of the annotation
+   *
+   * @returns {Record<string, unknown>} JSON representation of the annotation
+   */
+  toJSON() {
+    return {
+      italic: this.italic,
+    };
+  }
+  /**
+   * @inheritDoc
+   */
+  clone() {
+    return new ItalicAnnotation(this.italic);
+  }
+  /**
+   * @inheritDoc
+   */
+  renderClass(options) {
+    if (options === null || options === void 0 ? void 0 : options.standalone)
+      return null;
+    return this.italic ? 'v-rte--italic' : null;
+  }
+  /**
+   * @inheritDoc
+   */
+  renderStyle(options) {
+    if (!(options === null || options === void 0 ? void 0 : options.standalone))
+      return null;
+    return this.italic ? { fontStyle: ITALIC_FONT_STYLE } : null;
   }
 }
 
@@ -2333,6 +2933,12 @@ class CodeAnnotation extends NodeAnnotation {
       whiteSpace: CODE_WHITE_SPACE,
     };
   }
+  /**
+   * @inheritDoc
+   */
+  get isFormattingOnly() {
+    return true;
+  }
   /**
    * Generate the JSON representation of the annotation
    *
@@ -2474,108 +3080,44 @@ const RTE_PASTE_MODE_WORD = 'word';
 const RTE_WORD_COUNT_KEY = 'rte-word-count';
 
 /**
- * Annotation to make text with text color
- */
-class TextColorAnnotation extends NodeAnnotation {
-  constructor(textColor) {
-    super();
-    this.type = NodeAnnotationTypeEnum.TEXT_COLOR;
-    this.textColor = this.formatTextColor(textColor);
-  }
-  /**
-   * Generate the map item for the annotation
-   *
-   * @param {string} textColor - text color annotation
-   * @returns {[NodeAnnotationTypeEnum.TEXT_COLOR, TextColorAnnotation]} Map item for the annotation
-   */
-  static from(textColor) {
-    return [NodeAnnotationTypeEnum.TEXT_COLOR, new TextColorAnnotation(textColor)];
-  }
-  /**
-   * Generate the JSON representation of the annotation
-   *
-   * @returns {Record<string, unknown>} JSON representation of the annotation
-   */
-  toJSON() {
-    return {
-      textColor: this.textColor.key,
-    };
-  }
-  /**
-   * @inheritDoc
-   */
-  clone() {
-    return new TextColorAnnotation(this.textColor.key);
-  }
-  /**
-   * @inheritDoc
-   */
-  renderClass() {
-    return null;
-  }
-  /**
-   * @inheritDoc
-   */
-  renderStyle() {
-    return {
-      color: VegaInternalThemeManager.isDarkMode() ? this.textColor.dark : this.textColor.light,
-    };
-  }
-  /**
-   * format text color
-   *
-   * @param {string} textColor - text color
-   * @returns {VegaRTEColorSchema} - VegaRTEColorSchema
-   */
-  formatTextColor(textColor) {
-    return (RTE_TEXT_COLORS.find((item) => item.key === textColor) || RTE_TEXT_COLORS[0]);
-  }
-}
-
-/**
- * Annotation to make text a link
+ * Annotation to make text with text color
  */
-class LinkAnnotation extends NodeAnnotation {
-  constructor(link, useInternalStyle = true) {
+class TextColorAnnotation extends NodeAnnotation {
+  constructor(textColor) {
     super();
-    this.type = NodeAnnotationTypeEnum.LINK;
-    this.link = link;
-    this.useInternalStyle = useInternalStyle;
+    this.type = NodeAnnotationTypeEnum.TEXT_COLOR;
+    this.textColor = this.formatTextColor(textColor);
   }
   /**
    * Generate the map item for the annotation
    *
-   * @param {VegaRTELink} link - Bold annotation
-   * @param {boolean} useInternalStyle - Whether to use default style for the link
-   * @returns {[NodeAnnotationTypeEnum.LINK, LinkAnnotation]} Map item for the annotation
+   * @param {string} textColor - text color annotation
+   * @returns {[NodeAnnotationTypeEnum.TEXT_COLOR, TextColorAnnotation]} Map item for the annotation
    */
-  static from(link, useInternalStyle = true) {
-    return [NodeAnnotationTypeEnum.LINK, new LinkAnnotation(link, useInternalStyle)];
+  static from(textColor) {
+    return [NodeAnnotationTypeEnum.TEXT_COLOR, new TextColorAnnotation(textColor)];
+  }
+  /**
+   * @inheritDoc
+   */
+  get isFormattingOnly() {
+    return true;
   }
   /**
    * Generate the JSON representation of the annotation
    *
-   * @returns {Record<'link', VegaRTELink>} JSON representation of the annotation
+   * @returns {Record<string, unknown>} JSON representation of the annotation
    */
   toJSON() {
     return {
-      link: this.link,
+      textColor: this.textColor.key,
     };
   }
   /**
    * @inheritDoc
    */
   clone() {
-    return new LinkAnnotation(this.link, this.useInternalStyle);
-  }
-  /**
-   * Verify whether two link annotation is same or not
-   *
-   * @param {LinkAnnotation} annotation - Compared annotation
-   * @returns {boolean} Whether two link annotation is same or not
-   */
-  toEqual(annotation) {
-    return this.link.groupKey === annotation.link.groupKey;
+    return new TextColorAnnotation(this.textColor.key);
   }
   /**
    * @inheritDoc
@@ -2587,28 +3129,18 @@ class LinkAnnotation extends NodeAnnotation {
    * @inheritDoc
    */
   renderStyle() {
-    return null;
-  }
-}
-
-/**
- * Action to link a group of nodes
- */
-class LinkGroupAnnotationAction extends AnnotationAction {
-  constructor(groupKey, nodes, type) {
-    super();
-    this.isFlushable = false;
-    this.groupKey = groupKey;
-    this.nodes = nodes;
-    this.type = type;
+    return {
+      color: VegaInternalThemeManager.isDarkMode() ? this.textColor.dark : this.textColor.light,
+    };
   }
   /**
-   * Converts the action to an annotation
+   * format text color
    *
-   * @returns {Annotation} The annotation
+   * @param {string} textColor - text color
+   * @returns {VegaRTEColorSchema} - VegaRTEColorSchema
    */
-  toAnnotation() {
-    return new LinkGroupAnnotation(this.groupKey);
+  formatTextColor(textColor) {
+    return (RTE_TEXT_COLORS.find((item) => item.key === textColor) || RTE_TEXT_COLORS[0]);
   }
 }
 
@@ -2629,139 +3161,7 @@ class SyncUpSelectionAction extends AnnotationAction {
     return null;
   }
 }
-
-/**
- * The base action handle strategy class, use to modify the rich text node content or modify the annotation.
- */
-class ActionHandleStrategy {
-  /**
-   * Public method to invoke the handle logic.
-   *
-   * @typedef R generic type
-   * @param {ModifyContentAction | AnnotationAction} action - The action instance. Contains the action type and necessary params.
-   * @param {RTENode | RTEBlock | VegaRTEContent} target - The rich text node instance that will be modified.
-   * @returns {R} - The invoke result in special strategy.
-   */
-  execute(action, target) {
-    LogUtility.log(`Executing action ${action.constructor.name} on ${target.constructor.name} ${target['id']}`);
-    return this.handleAction(action, target);
-  }
-  /**
-   * Update the custom style annotation of a block or node
-   *
-   * @param {RTEBlock | RTETextNode} item - block or node
-   * @param {string[]} styleKeys - custom style keys, for examples ['fontSize', 'fontWeight'].
-   */
-  updateCustomStyleAnnotation(item, styleKeys) {
-    const customStyleAnnotation = item.annotationMap.get(CommonAnnotationTypeEnum.CUSTOM_STYLE);
-    if (customStyleAnnotation && this.isCustomStyle(customStyleAnnotation, styleKeys)) {
-      item.annotationMap.set(customStyleAnnotation.type, new CustomStyleAnnotation(customStyleAnnotation.removeStyles(styleKeys)));
-    }
-  }
-  /**
-   * Create a new paragraph block with the given text.
-   *
-   * @param {string} text - The text content for the new paragraph.
-   * @returns {Nullable<RTETextBlock>} - The newly created paragraph block, or null if creation failed.
-   */
-  createNewParagraph(text) {
-    const dtoClass = RTEDTOClassManager$1.getRTEBlockClass('paragraph');
-    if (dtoClass) {
-      const newParagraph = dtoClass.from({
-        id: generateUUID(),
-        type: 'paragraph',
-        nodes: [{ id: generateUUID(), type: 'text', text }],
-      });
-      return newParagraph;
-    }
-  }
-  /**
-   * Get the root content from a child block or node.
-   *
-   * @param {RTEBlock | RTENode} child - The child block or node.
-   * @returns {Nullable<VegaRTEContent>} The root content, if found.
-   */
-  getRootContent(child) {
-    const parent = child.parent;
-    if (parent) {
-      if (parent.dtoName === 'VegaRTEContent') {
-        return parent;
-      }
-      else {
-        return this.getRootContent(parent);
-      }
-    }
-  }
-  /**
-   * Check the caret position at the start of a block.
-   *
-   * @param {RTEBlock} block - The RTE Block.
-   * @param {RTENode} node - The RTE Node.
-   * @param {number} offset - The offset position.
-   * @returns {boolean} - Whether the caret is at the start of the block.
-   */
-  isCaretPositionAtBlockStart(block, node, offset) {
-    return node === block.children[0] && offset === 0;
-  }
-  /**
-   * Check the caret position at the end of a block.
-   *
-   * @param {RTEBlock} block - The RTE Block.
-   * @param {RTENode} node - The RTE Node.
-   * @param {number} offset - The offset position.
-   * @returns {boolean} - Whether the caret is at the end of the block.
-   */
-  isCaretPositionAtBlockEnd(block, node, offset) {
-    if (!node.isContentEditable()) {
-      return this.isCaretPositionAtDecoratorBlockEnd(block, node, offset);
-    }
-    else {
-      return this.isCaretPositionAtTextBlockEnd(block, node, offset);
-    }
-  }
-  /**
-   * Get the registered DOM element by the RTE entity.
-   *
-   * @param {RTEBlock | RTENode} instance - The RTE block or node instance.
-   * @returns {Nullable<HTMLElement>} The registered DOM element.
-   */
-  getDOMByEntity(instance) {
-    return stateEntityRenderingRegistry.getDOMByEntity(instance);
-  }
-  /**
-   * Checks if the caret position is at the end of a specified RTETextNode.
-   *
-   * @param {RTETextBlock} textBlock - `RTETextBlock` - a text block.
-   * @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.
-   */
-  isCaretPositionAtTextBlockEnd(textBlock, node, startOffset) {
-    const lastNode = textBlock.children[textBlock.children.length - 1];
-    return node === lastNode && (node.isEmpty() || startOffset === lastNode.text.length);
-  }
-  /**
-   * Checks if the caret position is at the end of a given decorator node.
-   *
-   * @param {RTEBlock} target - The image block.
-   * @param {RTENode} node - `node` is a RTEDecoratorNode or non-editable text node.
-   * @param {number} startOffset - The position within the `RTEDecoratorNode` where the caret is located.
-   * @returns {boolean}Returns a boolean value indicating whether the caret position is at the end of the `RTEDecoratorNode`.
-   */
-  isCaretPositionAtDecoratorBlockEnd(target, node, startOffset) {
-    return node === target.children[target.children.length - 1] && startOffset !== 0;
-  }
-  /**
-   * Determines if the custom style annotation includes any the custom style.
-   *
-   * @param {CustomStyleAnnotation} customStyleAnnotation - custom style annotation
-   * @param {string[]} styleKeys - custom style keys, for examples ['fontSize', 'fontWeight'].
-   * @returns {boolean} - True if the custom key includes the custom style, false otherwise.
-   */
-  isCustomStyle(customStyleAnnotation, styleKeys) {
-    return styleKeys.some((item) => Object.keys(customStyleAnnotation.customStyle).includes(item));
-  }
-}
+SyncUpSelectionAction.typeName = 'SyncUpSelectionAction';
 
 /**
  * Split the corresponding link group nodes *
@@ -2912,25 +3312,6 @@ class NodeSplitTextStrategy extends ActionHandleStrategy {
   }
 }
 
-/**
- * Action to toggle bold annotation
- */
-class BoldAnnotationAction extends TextSplittableAction {
-  constructor(bold) {
-    super();
-    this.isFlushable = true;
-    this.bold = bold;
-  }
-  /**
-   * Converts the action to an annotation
-   *
-   * @returns {BoldAnnotation} the annotation
-   */
-  toAnnotation() {
-    return new BoldAnnotation(this.bold);
-  }
-}
-
 /**
  * Annotation to host which annotations will be clear formatting
  */
@@ -2967,6 +3348,7 @@ class ClearFormattingAnnotationAction extends TextSplittableAction {
     return new ClearFormattingAnnotation();
   }
 }
+ClearFormattingAnnotationAction.typeName = 'ClearFormattingAnnotationAction';
 
 /**
  * Action to toggle code annotation
@@ -2986,69 +3368,27 @@ class CodeAnnotationAction extends TextSplittableAction {
     return new CodeAnnotation(this.code);
   }
 }
-
-/**
- * Delete the node annotation by type
- */
-class DeleteNodeAnnotationAction extends AnnotationAction {
-  constructor(annotationType) {
-    super();
-    this.isFlushable = true;
-    this.annotationType = annotationType;
-  }
-  /**
-   * Don't need this for this action
-   *
-   * @returns {Nullable<Annotation>} undefined
-   */
-  toAnnotation() {
-    return undefined;
-  }
-}
+CodeAnnotationAction.typeName = 'CodeAnnotationAction';
 
 /**
  * Action to toggle the italic annotation
- */
-class ItalicAnnotationAction extends TextSplittableAction {
-  constructor(italic) {
-    super();
-    this.isFlushable = true;
-    this.italic = italic;
-  }
-  /**
-   * Converts the action to an annotation
-   *
-   * @returns {ItalicAnnotation} The annotation
-   */
-  toAnnotation() {
-    return new ItalicAnnotation(this.italic);
-  }
-}
-
-/**
- * Action to toggle link annotation
- */
-class LinkAnnotationAction extends TextSplittableAction {
-  constructor({ link, newText, needMergeNode, doSplit, type, }) {
+ */
+class ItalicAnnotationAction extends TextSplittableAction {
+  constructor(italic) {
     super();
     this.isFlushable = true;
-    this.link = link;
-    this.needMergeNode = needMergeNode;
-    this.newText = newText;
-    this.type = type;
-    if (isNonNullable(doSplit)) {
-      this.doSplit = doSplit;
-    }
+    this.italic = italic;
   }
   /**
    * Converts the action to an annotation
    *
-   * @returns {LinkAnnotation} the annotation
+   * @returns {ItalicAnnotation} The annotation
    */
   toAnnotation() {
-    return new LinkAnnotation(this.link);
+    return new ItalicAnnotation(this.italic);
   }
 }
+ItalicAnnotationAction.typeName = 'ItalicAnnotationAction';
 
 /**
  * Action to toggle the strikethrough annotation
@@ -3068,6 +3408,7 @@ class StrikethroughAnnotationAction extends TextSplittableAction {
     return new StrikethroughAnnotation(this.strikethrough);
   }
 }
+StrikethroughAnnotationAction.typeName = 'StrikethroughAnnotationAction';
 
 /**
  * Action to toggle the underline annotation
@@ -3087,6 +3428,7 @@ class UnderlineAnnotationAction extends TextSplittableAction {
     return new UnderlineAnnotation(this.underline);
   }
 }
+UnderlineAnnotationAction.typeName = 'UnderlineAnnotationAction';
 
 /**
  * The current strategy used to modify the text node annotation map.
@@ -3376,6 +3718,12 @@ class PlainTextAnnotation extends NodeAnnotation {
   static from(plainText) {
     return [NodeAnnotationTypeEnum.PLAIN_TEXT, new PlainTextAnnotation(plainText)];
   }
+  /**
+   * @inheritDoc
+   */
+  get isFormattingOnly() {
+    return true;
+  }
   /**
    * @inheritDoc
    */
@@ -3420,6 +3768,7 @@ class TextColorAnnotationAction extends TextSplittableAction {
     return new TextColorAnnotation(this.textColor);
   }
 }
+TextColorAnnotationAction.typeName = 'TextColorAnnotationAction';
 
 /**
  * Text node
@@ -3427,7 +3776,6 @@ class TextColorAnnotationAction extends TextSplittableAction {
 class RTETextNode extends RTENode {
   constructor(id, text, parentBlock, annotationMap) {
     super(id, annotationMap);
-    this.dtoName = RTETextNode.dtoName;
     this.type = NodeTypeEnum.TEXT;
     this.parent = parentBlock;
     this.text = text;
@@ -3663,24 +4011,24 @@ class RTETextNode extends RTENode {
    * Registers the action strategies for the RTETextNode.
    */
   registerModifyStrategy() {
-    const dtoClassName = this.constructor.name;
+    const dtoClassName = this.typeName;
     if (!RTETextNode.registerActionStrategyStatus[dtoClassName]) {
       if (this.isContentEditable()) {
         ActionHandleStrategyRegistry.register(ModifyContentActionType.UPDATE_TEXT, dtoClassName, new NodeUpdateTextStrategy());
         ActionHandleStrategyRegistry.register(ModifyContentActionType.REPLACE_SELECTED_TEXT, dtoClassName, new NodeReplaceSelectedTextStrategy());
         ActionHandleStrategyRegistry.register(ModifyContentActionType.LINK_GROUP_NODE_SPLIT, dtoClassName, new LinkGroupNodeSplitStrategy());
-        ActionHandleStrategyRegistry.register(LinkAnnotationAction.name, dtoClassName, new NodeUpdateAnnotationMapStrategy());
+        ActionHandleStrategyRegistry.register(LinkAnnotationAction.typeName, dtoClassName, new NodeUpdateAnnotationMapStrategy());
       }
-      ActionHandleStrategyRegistry.register(TextSplittableAction.name, dtoClassName, new NodeSplitTextStrategy());
+      ActionHandleStrategyRegistry.register(TextSplittableAction.typeName, dtoClassName, new NodeSplitTextStrategy());
       ActionHandleStrategyRegistry.register(ModifyContentActionType.DELETE_LINK_GROUP, dtoClassName, new DeleteLinkGroupStrategy());
-      ActionHandleStrategyRegistry.register(BoldAnnotationAction.name, dtoClassName, new NodeUpdateAnnotationMapStrategy());
-      ActionHandleStrategyRegistry.register(ClearFormattingAnnotationAction.name, dtoClassName, new NodeUpdateAnnotationMapStrategy());
-      ActionHandleStrategyRegistry.register(ItalicAnnotationAction.name, dtoClassName, new NodeUpdateAnnotationMapStrategy());
-      ActionHandleStrategyRegistry.register(UnderlineAnnotationAction.name, dtoClassName, new NodeUpdateAnnotationMapStrategy());
-      ActionHandleStrategyRegistry.register(TextColorAnnotationAction.name, dtoClassName, new NodeUpdateAnnotationMapStrategy());
-      ActionHandleStrategyRegistry.register(StrikethroughAnnotationAction.name, dtoClassName, new NodeUpdateAnnotationMapStrategy());
-      ActionHandleStrategyRegistry.register(CodeAnnotationAction.name, dtoClassName, new NodeUpdateAnnotationMapStrategy());
-      ActionHandleStrategyRegistry.register(AnnotationAction.name, dtoClassName, new NodeUpdateAnnotationMapStrategy());
+      ActionHandleStrategyRegistry.register(BoldAnnotationAction.typeName, dtoClassName, new NodeUpdateAnnotationMapStrategy());
+      ActionHandleStrategyRegistry.register(ClearFormattingAnnotationAction.typeName, dtoClassName, new NodeUpdateAnnotationMapStrategy());
+      ActionHandleStrategyRegistry.register(ItalicAnnotationAction.typeName, dtoClassName, new NodeUpdateAnnotationMapStrategy());
+      ActionHandleStrategyRegistry.register(UnderlineAnnotationAction.typeName, dtoClassName, new NodeUpdateAnnotationMapStrategy());
+      ActionHandleStrategyRegistry.register(TextColorAnnotationAction.typeName, dtoClassName, new NodeUpdateAnnotationMapStrategy());
+      ActionHandleStrategyRegistry.register(StrikethroughAnnotationAction.typeName, dtoClassName, new NodeUpdateAnnotationMapStrategy());
+      ActionHandleStrategyRegistry.register(CodeAnnotationAction.typeName, dtoClassName, new NodeUpdateAnnotationMapStrategy());
+      ActionHandleStrategyRegistry.register(AnnotationAction.typeName, dtoClassName, new NodeUpdateAnnotationMapStrategy());
       RTETextNode.registerActionStrategyStatus[dtoClassName] = true;
     }
   }
@@ -3690,7 +4038,7 @@ class RTETextNode extends RTENode {
   doAnnotationActionApply(action) {
     const selectionRangeAnnotation = this.getAnnotationByType(InternalAnnotationTypeEnum.SELECTION_RANGE);
     if (action instanceof TextSplittableAction && action.doSplit && selectionRangeAnnotation) {
-      const splitStrategy = ActionHandleStrategyRegistry.get(TextSplittableAction.name, this.constructor.name);
+      const splitStrategy = ActionHandleStrategyRegistry.get(TextSplittableAction.typeName, this.typeName);
       if (splitStrategy) {
         const newNode = splitStrategy.execute(action, this);
         if (newNode) {
@@ -3700,421 +4048,155 @@ class RTETextNode extends RTENode {
     }
     else {
       this.applyActionToNode(this, action);
-    }
-    if (typeof this.parent.mergeNodes === 'function') {
-      this.parent.mergeNodes(action);
-    }
-  }
-  /**
-   * @inheritDoc
-   */
-  doModifyActionApply(action) {
-    ActionHandleStrategyRegistry.executeTheStrategy(action, this);
-  }
-  /**
-   * Apply action to node
-   *
-   * @param {RTETextNode} node - Text node
-   * @param {AnnotationAction} action - AnnotationAction
-   */
-  applyActionToNode(node, action) {
-    const annotation = action.toAnnotation();
-    if (action instanceof SyncUpSelectionAction) {
-      this.syncUpSelectedNodes(node);
-      return;
-    }
-    // Sync up RTETextNode selected state to selection controller for any action apply, except selection range change.
-    if (!(annotation instanceof SelectionRangeAnnotation)) {
-      this.syncUpSelectedNodes(node);
-    }
-    /**
-     * 1. Try to get the specific strategy for the action and node type first (e.g., LinkAnnotationAction on RTETextNode).
-     * 2. If no specific strategy found, try to get the generic NodeUpdateAnnotationMapStrategy for AnnotationAction on RTETextNode.
-     */
-    const strategy = ActionHandleStrategyRegistry.get(action.constructor.name, node.constructor.name);
-    if (strategy) {
-      strategy.execute(action, node);
-      return;
-    }
-    const updateAnnotationMapStrategy = ActionHandleStrategyRegistry.get(AnnotationAction.name, RTETextNode.name);
-    if (updateAnnotationMapStrategy) {
-      updateAnnotationMapStrategy.execute(action, node);
-      return;
-    }
-  }
-  /**
-   * Sync up the selected node by change manager
-   *
-   * @param {RTETextNode} selectedNode - The selected node
-   */
-  syncUpSelectedNodes(selectedNode) {
-    const currentNodeDom = this.getElementRef();
-    if (currentNodeDom) {
-      const nodeSubject = domNodeSubjectFactory.getSubjectFromParentNodeByEventId(currentNodeDom, VegaInternalRichTextEditorSelectionRangeChange);
-      if (nodeSubject) {
-        ChangeManager.notify(nodeSubject, { node: selectedNode });
-      }
-    }
-  }
-  /**
-   * @param {InlineHtmlAnnotation} inlineHtmlNode - The inline HTML annotation to wrap the text node.
-   * @param {VegaRTETransformOptions} [options] - Optional conversion options that may affect how the text node is rendered as HTML.
-   * @returns {string} The HTML string representation of the text node wrapped with the inline HTML.
-   */
-  renderWithWrapperStr(inlineHtmlNode, options) {
-    const { htmlTag, child } = inlineHtmlNode;
-    const attrStr = this.annotationAttrStr(inlineHtmlNode);
-    if (!child) {
-      if (HTML_VOID_TAGS.has(htmlTag)) {
-        return `<${htmlTag}${attrStr}>`;
-      }
-      if (!this.text) {
-        return `<${htmlTag}${attrStr}></${htmlTag}>`;
-      }
-      return `<${htmlTag}${attrStr}>${this.renderTextStr(options)}</${htmlTag}>`;
-    }
-    return `<${htmlTag}${attrStr}>${this.renderWithWrapperStr(child, options)}</${htmlTag}>`;
-  }
-  /**
-   * Generate the attribute string for the inline HTML annotation
-   *
-   * @param {InlineHtmlAnnotation} annotation - The inline HTML annotation
-   * @returns {string} The attribute string for the inline HTML annotation
-   */
-  annotationAttrStr(annotation) {
-    const { customAttribute, customClass, customStyle } = annotation;
-    const attrs = [
-      ...((customAttribute === null || customAttribute === void 0 ? void 0 : customAttribute.toString()) || []),
-      customClass === null || customClass === void 0 ? void 0 : customClass.toString(),
-      customStyle === null || customStyle === void 0 ? void 0 : customStyle.toString(),
-    ].filter(isNonNullable);
-    return attrs.length > 0 ? ` ${attrs.join(' ')}` : '';
-  }
-  /**
-   * Generates the HTML representation of the text node.
-   *
-   * @param {VegaRTETransformOptions} [options] - Optional conversion options that may affect how the text node is rendered as HTML.
-   * @returns {string} The HTML string representation of the text node.
-   */
-  renderTextStr(options) {
-    var _a;
-    const NodeTag = ((_a = this.getAnnotationByType(NodeAnnotationTypeEnum.CODE)) === null || _a === void 0 ? void 0 : _a.code)
-      ? 'code'
-      : 'span';
-    const attrStr = super.generateAttributeString(options);
-    // If the text contains a newline character, we need to replace it with a <br> tag.
-    if (this.text === '\n') {
-      return `<br>`;
-    }
-    if (this.shouldRenderAsPlainText()) {
-      return this.text;
-    }
-    const content = NodeTag === 'code' ? escapeHtml(this.text) : this.text;
-    return `<${NodeTag}${attrStr}>${content}</${NodeTag}>`;
-  }
-  /**
-   * Determines if the text node should be rendered as plain text.
-   *
-   * @returns {boolean} `true` if the text node should be rendered as plain text, otherwise `false`.
-   */
-  shouldRenderAsPlainText() {
-    const plainTextAnnotation = super.getAnnotationByType(NodeAnnotationTypeEnum.PLAIN_TEXT);
-    if (plainTextAnnotation) {
-      return (plainTextAnnotation.plainText &&
-        Array.from(this.annotationMap.values()).filter((annotation) => (annotation instanceof NodeAnnotation &&
-          !(annotation instanceof LinkAnnotation) &&
-          !(annotation instanceof PlainTextAnnotation)) ||
-          annotation instanceof CommonAnnotation).length === 0);
-    }
-    else {
-      return false;
-    }
-  }
-}
-RTETextNode.registerActionStrategyStatus = {};
-RTETextNode.htmlTag = 'span';
-RTETextNode.dtoName = 'RTETextNode';
-
-/**
- * Append children to a block or rte content
- *
- * @example parent.apply(new AppendChildrenAction([newChildren]))
- */
-class AppendChildrenAction extends ModifyContentAction {
-  constructor(childNodes) {
-    super();
-    this.type = ModifyContentActionType.APPEND_CHILDREN;
-    this.entityToBeAppended = childNodes;
-  }
-}
-
-const TEXT_STYLE_DEFAULT_FONT_WEIGHT = '500';
-const TEXT_STYLE_BASE = {
-  fontFamily: 'Inter',
-  fontSize: '16px',
-  lineHeight: '22px',
-  minHeight: '22px',
-  fontWeight: TEXT_STYLE_DEFAULT_FONT_WEIGHT,
-};
-const PARAGRAPH_TEXT_STYLE = Object.assign(Object.assign({}, TEXT_STYLE_BASE), { marginTop: '0px', marginBottom: '0px' });
-const TEXT_STYLE_DEFAULTS = {
-  'paragraph': PARAGRAPH_TEXT_STYLE,
-  'title': Object.assign(Object.assign({}, TEXT_STYLE_BASE), { fontSize: '36px', lineHeight: '40px', minHeight: '40px' }),
-  'subtitle': Object.assign(Object.assign({}, TEXT_STYLE_BASE), { fontSize: '28px', lineHeight: '32px', minHeight: '32px' }),
-  'heading-1': Object.assign(Object.assign({}, PARAGRAPH_TEXT_STYLE), { fontSize: '22px', lineHeight: '24px', minHeight: '24px' }),
-  'heading-2': Object.assign(Object.assign({}, PARAGRAPH_TEXT_STYLE), { fontSize: '20px', lineHeight: '24px', minHeight: '24px' }),
-  'heading-3': Object.assign(Object.assign({}, PARAGRAPH_TEXT_STYLE), { fontSize: '18px' }),
-  'heading-4': Object.assign({}, PARAGRAPH_TEXT_STYLE),
-  'heading-5': Object.assign(Object.assign({}, PARAGRAPH_TEXT_STYLE), { fontSize: '14px' }),
-  'heading-6': Object.assign(Object.assign({}, PARAGRAPH_TEXT_STYLE), { fontSize: '12px' }),
-};
-
-/**
- * Text style annotation
- */
-class TextStyleAnnotation extends BlockAnnotation {
-  constructor(textStyle) {
-    super();
-    this.type = BlockAnnotationTypeEnum.TEXT_STYLE;
-    this.textStyle = textStyle;
-  }
-  /**
-   * Generate the map item for the annotations
-   *
-   * @param {VegaRTETextStyleType} textStyle - the text style type
-   * @returns {[BlockAnnotationTypeEnum.TEXT_STYLE, TextStyleAnnotation]} Map item for the annotation
-   */
-  static from(textStyle) {
-    return [BlockAnnotationTypeEnum.TEXT_STYLE, new TextStyleAnnotation(textStyle)];
-  }
-  /**
-   * Get the default styles for a given text style type.
-   *
-   * @param {VegaRTETextStyleType} textStyle - The text style type.
-   * @returns {Nullable<AnnotationStyle>} The default styles for the given text style type.
-   */
-  static getDefaultStyles(textStyle) {
-    if (!textStyle)
-      return null;
-    return TEXT_STYLE_DEFAULTS[textStyle];
-  }
-  /**
-   * Generate the JSON representation of the annotation
-   *
-   * @returns {Nullable<Record<string, unknown>>} JSON representation of the annotation
-   */
-  toJSON() {
-    return { textStyle: this.textStyle };
-  }
-  /**
-   * @inheritDoc
-   */
-  clone() {
-    return new TextStyleAnnotation(this.textStyle);
-  }
-  /**
-   * @inheritDoc
-   */
-  renderClass(options) {
-    if (options === null || options === void 0 ? void 0 : options.standalone)
-      return null;
-    return this.textStyle ? `v-rte--text-style-${this.textStyle}` : null;
-  }
-  /**
-   * @inheritDoc
-   */
-  renderStyle(options) {
-    if (!(options === null || options === void 0 ? void 0 : options.standalone))
-      return null;
-    return this.textStyle ? TextStyleAnnotation.getDefaultStyles(this.textStyle) : null;
-  }
-}
-
-/**
- * Action to change the text style of a block
- */
-class TextStyleAnnotationAction extends AnnotationAction {
-  constructor(textStyle, bold) {
-    super();
-    this.isFlushable = true;
-    this.textStyle = textStyle;
-    this.bold = bold;
+    }
+    if (typeof this.parent.mergeNodes === 'function') {
+      this.parent.mergeNodes(action);
+    }
   }
   /**
-   * Converts the action to a block annotation
-   *
-   * @returns {BlockAnnotation} the block annotation
+   * @inheritDoc
    */
-  toAnnotation() {
-    return new TextStyleAnnotation(this.textStyle);
+  doModifyActionApply(action) {
+    ActionHandleStrategyRegistry.executeTheStrategy(action, this);
   }
-}
-
-/**
- * Update the text block text style strategy.
- */
-class BlockUpdateTextStyleStrategy extends ActionHandleStrategy {
   /**
-   * Update the text block type and add or remove the bold style from child nodes.
+   * Apply action to node
    *
-   * @param {TextStyleAnnotationAction} action - The text style annotation action.
-   * @param {RTETextBlock} target - The current text block.
+   * @param {RTETextNode} node - Text node
+   * @param {AnnotationAction} action - AnnotationAction
    */
-  handleAction(action, target) {
-    if (target.type !== 'list-item') {
-      target.type = action.textStyle;
+  applyActionToNode(node, action) {
+    const annotation = action.toAnnotation();
+    if (action instanceof SyncUpSelectionAction) {
+      this.syncUpSelectedNodes(node);
+      return;
     }
-    if (action.bold) {
-      target.children.forEach((node) => {
-        const boldAnnotationAction = new BoldAnnotationAction(true);
-        boldAnnotationAction.doSplit = false;
-        node.apply(boldAnnotationAction);
-      });
+    // Sync up RTETextNode selected state to selection controller for any action apply, except selection range change.
+    if (!(annotation instanceof SelectionRangeAnnotation)) {
+      this.syncUpSelectedNodes(node);
     }
-    else {
-      target.children.forEach((node) => {
-        node.apply(new DeleteNodeAnnotationAction(NodeAnnotationTypeEnum.BOLD));
-      });
+    /**
+     * 1. Try to get the specific strategy for the action and node type first (e.g., LinkAnnotationAction on RTETextNode).
+     * 2. If no specific strategy found, try to get the generic NodeUpdateAnnotationMapStrategy for AnnotationAction on RTETextNode.
+     */
+    const strategy = ActionHandleStrategyRegistry.get(action.typeName, node.typeName);
+    if (strategy) {
+      strategy.execute(action, node);
+      return;
+    }
+    const updateAnnotationMapStrategy = ActionHandleStrategyRegistry.get(AnnotationAction.typeName, RTETextNode.typeName);
+    if (updateAnnotationMapStrategy) {
+      updateAnnotationMapStrategy.execute(action, node);
+      return;
     }
-    this.updateCustomStyleAnnotation(target, ['fontFamily', 'lineHeight', 'fontWeight', 'fontSize']);
   }
-}
-
-/**
- * Update the text block link group annotation strategy.
- */
-class BlockUpdateLinkGroupStrategy extends ActionHandleStrategy {
   /**
-   * Update link group after the child link node update.
+   * Sync up the selected node by change manager
    *
-   * @param {LinkGroupAnnotationAction} action - The link group annotation action instance.
-   * @param {RTETextBlock} target - The current text block.
+   * @param {RTETextNode} selectedNode - The selected node
    */
-  handleAction(action, target) {
-    let linkGroupAnnotation = target.getAnnotationByType(InternalAnnotationTypeEnum.LINK_GROUP);
-    if (action.type === 'update_link') {
-      if (linkGroupAnnotation) {
-        const linkGroup = linkGroupAnnotation.linkGroups.get(action.groupKey);
-        if (linkGroup) {
-          linkGroupAnnotation.linkGroups.set(action.groupKey, [linkGroup[0]]);
-        }
+  syncUpSelectedNodes(selectedNode) {
+    const currentNodeDom = this.getElementRef();
+    if (currentNodeDom) {
+      const nodeSubject = domNodeSubjectFactory.getSubjectFromParentNodeByEventId(currentNodeDom, VegaInternalRichTextEditorSelectionRangeChange);
+      if (nodeSubject) {
+        ChangeManager.notify(nodeSubject, { node: selectedNode });
       }
     }
-    else {
-      if (linkGroupAnnotation) {
-        const linkGroup = linkGroupAnnotation.linkGroups.get(action.groupKey) || [];
-        linkGroupAnnotation.linkGroups.set(action.groupKey, [...linkGroup, ...action.nodes]);
+  }
+  /**
+   * @param {InlineHtmlAnnotation} inlineHtmlNode - The inline HTML annotation to wrap the text node.
+   * @param {VegaRTETransformOptions} [options] - Optional conversion options that may affect how the text node is rendered as HTML.
+   * @returns {string} The HTML string representation of the text node wrapped with the inline HTML.
+   */
+  renderWithWrapperStr(inlineHtmlNode, options) {
+    const { htmlTag, child } = inlineHtmlNode;
+    const attrStr = this.annotationAttrStr(inlineHtmlNode);
+    if (!child) {
+      if (HTML_VOID_TAGS.has(htmlTag)) {
+        return `<${htmlTag}${attrStr}>`;
       }
-      else {
-        linkGroupAnnotation = action.toAnnotation();
-        linkGroupAnnotation.linkGroups.set(action.groupKey, [...action.nodes]);
+      if (!this.text) {
+        return `<${htmlTag}${attrStr}></${htmlTag}>`;
       }
-      target.annotationMap.set(InternalAnnotationTypeEnum.LINK_GROUP, linkGroupAnnotation);
+      return `<${htmlTag}${attrStr}>${this.renderTextStr(options)}</${htmlTag}>`;
     }
+    return `<${htmlTag}${attrStr}>${this.renderWithWrapperStr(child, options)}</${htmlTag}>`;
   }
-}
-
-/**
- * Insert a new children after a existing children
- *
- * @example parent.apply(new InsertChildrenAfterAction(existingChildren, newChildren, ...))
- */
-class InsertChildrenAfterAction extends ModifyContentAction {
-  constructor(referBlock, ...blocksToBeInserted) {
-    super();
-    this.type = ModifyContentActionType.INSERT_CHILDREN_AFTER;
-    this.referChildren = referBlock;
-    this.childrenToBeInserted = blocksToBeInserted;
-  }
-}
-
-/**
- * Clear the current block nodes and append new nodes
- *
- * @example block.apply(new ReplaceChildNodesAction(newNodes))
- */
-class ReplaceChildNodesAction extends ModifyContentAction {
-  constructor(newChildNodes) {
-    super();
-    this.type = ModifyContentActionType.REPLACE_CHILD_NODES;
-    this.newChildNodes = newChildNodes;
-  }
-}
-
-/**
- * Split the current node with a special position strategy.
- */
-class BlockSplitWithTextNodeStrategy extends ActionHandleStrategy {
   /**
-   * @inheritDoc
+   * Generate the attribute string for the inline HTML annotation
+   *
+   * @param {InlineHtmlAnnotation} annotation - The inline HTML annotation
+   * @returns {string} The attribute string for the inline HTML annotation
    */
-  handleAction(action, target) {
-    action.newBlock = this.splitTextNodeBlock(action.splitPointNode, action.startOffsetOfNode, target);
+  annotationAttrStr(annotation) {
+    const { customAttribute, customClass, customStyle } = annotation;
+    const attrs = [
+      ...((customAttribute === null || customAttribute === void 0 ? void 0 : customAttribute.toString()) || []),
+      customClass === null || customClass === void 0 ? void 0 : customClass.toString(),
+      customStyle === null || customStyle === void 0 ? void 0 : customStyle.toString(),
+    ].filter(isNonNullable);
+    return attrs.length > 0 ? ` ${attrs.join(' ')}` : '';
   }
   /**
-   * Splits a text node at a specified offset within a block of nodes and returns a new block with the split nodes.
+   * Generates the HTML representation of the text node.
    *
-   * @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`.
-   * @param {RTETextBlock} textBlock - The text block need to be splited.
-   * @returns {Nullable<RTEBlock>} return either an RTEBlock object or null.
+   * @param {VegaRTETransformOptions} [options] - Optional conversion options that may affect how the text node is rendered as HTML.
+   * @returns {string} The HTML string representation of the text node.
    */
-  splitTextNodeBlock(splitNode, startOffsetOfNode, textBlock) {
-    if (splitNode) {
-      const beforeText = splitNode.text.slice(0, startOffsetOfNode);
-      const afterText = splitNode.text.slice(startOffsetOfNode);
-      const nodesSplitIndex = textBlock.children.indexOf(splitNode);
-      if (nodesSplitIndex > -1) {
-        const beforeNodes = textBlock.children.slice(0, nodesSplitIndex);
-        const afterNodes = textBlock.children.slice(nodesSplitIndex + 1);
-        if (splitNode.isContentEditable()) {
-          if (beforeText) {
-            beforeNodes.push(splitNode.cloneWithText(beforeText));
-          }
-          if (afterText) {
-            afterNodes.unshift(splitNode.cloneWithText(afterText));
-          }
-        }
-        else {
-          startOffsetOfNode > 0 ? beforeNodes.push(splitNode) : afterNodes.unshift(splitNode);
-        }
-        textBlock.apply(new ReplaceChildNodesAction(beforeNodes));
-        const newBlock = textBlock.cloneWithNodes(afterNodes);
-        textBlock.parent.apply(new InsertChildrenAfterAction(textBlock, newBlock));
-        return newBlock;
-      }
+  renderTextStr(options) {
+    var _a;
+    const NodeTag = ((_a = this.getAnnotationByType(NodeAnnotationTypeEnum.CODE)) === null || _a === void 0 ? void 0 : _a.code)
+      ? 'code'
+      : 'span';
+    const attrStr = super.generateAttributeString(options);
+    // If the text contains a newline character, we need to replace it with a <br> tag.
+    if (this.text === '\n') {
+      return `<br>`;
+    }
+    if (this.shouldSkipEmptyFormattingMarker()) {
+      return '';
     }
+    if (this.shouldRenderAsPlainText()) {
+      return this.text;
+    }
+    const content = NodeTag === 'code' ? escapeHtml(this.text) : this.text;
+    return `<${NodeTag}${attrStr}>${content}</${NodeTag}>`;
   }
-}
-
-/**
- * Remove all nodes and append new nodes strategy.
- */
-class BlockReplaceNodesStrategy extends ActionHandleStrategy {
   /**
-   * Empty the text block or image block nodes and add new nodes.
+   * Formatting toggles at a collapsed caret intentionally keep empty marker
+   * nodes in the live model so future typing inherits the pending style. Those
+   * nodes are not semantic content and should not appear in serialized HTML.
    *
-   * @param {ReplaceChildNodesAction} action - The replace child nodes action instance.
-   * @param {RTETextBlock | RTEImageBlock} target - The text block or the image block.
+   * @returns {boolean} True when the node is an empty formatting-only marker that should be omitted from serialized HTML.
    */
-  handleAction(action, target) {
-    target.children = [];
-    target.apply(new AppendChildrenAction(action.newChildNodes));
+  shouldSkipEmptyFormattingMarker() {
+    return (this.text === '' &&
+      this.annotationMap.size > 0 &&
+      Array.from(this.annotationMap.values()).every((annotation) => annotation.isFormattingOnly));
   }
-}
-
-/**
- * Remove a children from the current block
- *
- * @example needRemovedChildren.parent.apply(new RemoveChildrenAction(needRemovedChildren))
- */
-class RemoveChildrenAction extends ModifyContentAction {
-  constructor(childNode) {
-    super();
-    this.type = ModifyContentActionType.DELETE_CHILDREN;
-    this.entityToBeRemoved = childNode;
+  /**
+   * Determines if the text node should be rendered as plain text.
+   *
+   * @returns {boolean} `true` if the text node should be rendered as plain text, otherwise `false`.
+   */
+  shouldRenderAsPlainText() {
+    const plainTextAnnotation = super.getAnnotationByType(NodeAnnotationTypeEnum.PLAIN_TEXT);
+    if (plainTextAnnotation) {
+      return (plainTextAnnotation.plainText &&
+        Array.from(this.annotationMap.values()).filter((annotation) => (annotation instanceof NodeAnnotation &&
+          !(annotation instanceof LinkAnnotation) &&
+          !(annotation instanceof PlainTextAnnotation)) ||
+          annotation instanceof CommonAnnotation).length === 0);
+    }
+    else {
+      return false;
+    }
   }
 }
+RTETextNode.registerActionStrategyStatus = {};
+RTETextNode.htmlTag = 'span';
+RTETextNode.typeName = 'RTETextNode';
 
 /**
  * Append the second block child nodes to the first block child nodes and remove the second block strategy.
@@ -4347,13 +4429,13 @@ class BlockInsertImageIntoTextStrategy extends ActionHandleStrategy {
  * @returns {RTEBlock[]} Top-level selected blocks to emit into the rebuilt list.
  */
 function normalizeMixedListSelection(selectedBlocks, listType) {
-  const selectedListItems = new Set(selectedBlocks.filter((block) => block.dtoName === 'RTEListItemBlock'));
+  const selectedListItems = new Set(selectedBlocks.filter((block) => block.typeName === 'RTEListItemBlock'));
   return selectedBlocks.filter((block) => {
-    if (!(block.dtoName === 'RTEListItemBlock')) {
+    if (!(block.typeName === 'RTEListItemBlock')) {
       return true;
     }
     let parentList = block.parent;
-    while (parentList.parent && parentList.parent.dtoName === 'RTEListItemBlock') {
+    while (parentList.parent && parentList.parent.typeName === 'RTEListItemBlock') {
       const ownerItem = parentList.parent;
       if (selectedListItems.has(ownerItem)) {
         block.parent.type = listType;
@@ -4410,6 +4492,7 @@ class HorizontalAlignmentAnnotationAction extends AnnotationAction {
     return new HorizontalAlignmentAnnotation(this.textAlign);
   }
 }
+HorizontalAlignmentAnnotationAction.typeName = 'HorizontalAlignmentAnnotationAction';
 
 /**
  * Update the text block and image block horizontal alignment strategy.
@@ -4459,6 +4542,7 @@ class IndentAnnotationAction extends AnnotationAction {
     return new IndentAnnotation(this.indent);
   }
 }
+IndentAnnotationAction.typeName = 'IndentAnnotationAction';
 
 /**
  * Unlink the text block link group annotation strategy.
@@ -4489,7 +4573,6 @@ class BlockUnlinkLinkGroupStrategy extends ActionHandleStrategy {
 class RTETextBlock extends RTEBlock {
   constructor(id, type, options) {
     super(id);
-    this.dtoName = RTETextBlock.dtoName;
     this.children = [];
     this.type = type;
     const { autoMatchFormat } = options || { autoMatchFormat: true };
@@ -4514,18 +4597,30 @@ class RTETextBlock extends RTEBlock {
     const textBlock = new RTETextBlock(block.id, block.type, options);
     const annotations = options.autoMatchFormat
       ? Object.assign(Object.assign({}, block.annotations), { textStyle: (_b = (_a = block.annotations) === null || _a === void 0 ? void 0 : _a.textStyle) !== null && _b !== void 0 ? _b : textBlock.type }) : block.annotations;
-    textBlock.children = block.nodes
+    textBlock.children = RTETextBlock.convertNodes(block.nodes, textBlock, options);
+    if (annotations) {
+      super.convertAnnotationsToMap(textBlock.annotationMap, annotations);
+    }
+    return textBlock;
+  }
+  /**
+   * Convert raw node payloads to their registered `RTENode` subclasses via
+   * `RTEDTOClassManager`, preserving custom types (e.g. `RTETokenNode`, `RTEBookmarkNode`).
+   *
+   * @param {VegaRTETextNode[]} nodes - Raw node payloads.
+   * @param {RTETextBlock} parent - Parent block for the converted nodes.
+   * @param {VegaRTETransformOptions} [options] - Optional transform options.
+   * @returns {RTETextNode[]} Converted nodes; unregistered types are dropped.
+   */
+  static convertNodes(nodes, parent, options) {
+    return nodes
       .map((richText) => {
       const NodeClass = RTEDTOClassManager$1.getRTENodeClass(richText.type);
       if (NodeClass) {
-        return NodeClass.from(richText, textBlock, options);
+        return NodeClass.from(richText, parent, options);
       }
     })
       .filter(isNonNullable);
-    if (annotations) {
-      super.convertAnnotationsToMap(textBlock.annotationMap, annotations);
-    }
-    return textBlock;
   }
   /**
    * The function `createAnnotationEntity` creates a block annotation entity based on the provided type
@@ -4686,7 +4781,7 @@ class RTETextBlock extends RTEBlock {
    * @inheritDoc
    */
   doAnnotationActionApply(action) {
-    const strategy = ActionHandleStrategyRegistry.get(action.constructor.name, RTETextBlock.name);
+    const strategy = ActionHandleStrategyRegistry.get(action.typeName, RTETextBlock.typeName);
     if (strategy) {
       strategy.execute(action, this);
     }
@@ -4768,21 +4863,22 @@ class RTETextBlock extends RTEBlock {
     return nodesHtml;
   }
 }
+RTETextBlock.typeName = 'RTETextBlock';
+// eslint-disable-next-line @globalpayments/vega-eslint/vega-class-member-order-rule
 (() => {
-  ActionHandleStrategyRegistry.register(TextStyleAnnotationAction.name, RTETextBlock.name, new BlockUpdateTextStyleStrategy());
-  ActionHandleStrategyRegistry.register(HorizontalAlignmentAnnotationAction.name, RTETextBlock.name, new BlockUpdateHorizontalAlignmentStrategy());
-  ActionHandleStrategyRegistry.register(IndentAnnotationAction.name, RTETextBlock.name, new BlockUpdateIndentStrategy());
-  ActionHandleStrategyRegistry.register(LinkGroupAnnotationAction.name, RTETextBlock.name, new BlockUpdateLinkGroupStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.UNLINK_LINK_GROUP, RTETextBlock.name, new BlockUnlinkLinkGroupStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.SPLIT_BLOCK_WITH_NODE, RTETextBlock.name, new BlockSplitWithTextNodeStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.REPLACE_CHILD_NODES, RTETextBlock.name, new BlockReplaceNodesStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.MERGE_TWO_BLOCKS_NODES, RTETextBlock.name, new BlockMergeNodesStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.LINE_BREAK_SINGLE_BLOCK, RTETextBlock.name, new BlockInsertLineBreakStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.LINE_BREAK_MULTIPLE_BLOCKS, RTETextBlock.name, new BlockInsertLineBreakWithBlocksStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.INSERT_IMAGE_TO_BLOCK, RTETextBlock.name, new BlockInsertImageIntoTextStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.TRANSFORM_LIST_BLOCK, RTETextBlock.name, new BlockTransformToListStrategy());
+  ActionHandleStrategyRegistry.register(TextStyleAnnotationAction.typeName, RTETextBlock.typeName, new BlockUpdateTextStyleStrategy());
+  ActionHandleStrategyRegistry.register(HorizontalAlignmentAnnotationAction.typeName, RTETextBlock.typeName, new BlockUpdateHorizontalAlignmentStrategy());
+  ActionHandleStrategyRegistry.register(IndentAnnotationAction.typeName, RTETextBlock.typeName, new BlockUpdateIndentStrategy());
+  ActionHandleStrategyRegistry.register(LinkGroupAnnotationAction.typeName, RTETextBlock.typeName, new BlockUpdateLinkGroupStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.UNLINK_LINK_GROUP, RTETextBlock.typeName, new BlockUnlinkLinkGroupStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.SPLIT_BLOCK_WITH_NODE, RTETextBlock.typeName, new BlockSplitWithTextNodeStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.REPLACE_CHILD_NODES, RTETextBlock.typeName, new BlockReplaceNodesStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.MERGE_TWO_BLOCKS_NODES, RTETextBlock.typeName, new BlockMergeNodesStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.LINE_BREAK_SINGLE_BLOCK, RTETextBlock.typeName, new BlockInsertLineBreakStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.LINE_BREAK_MULTIPLE_BLOCKS, RTETextBlock.typeName, new BlockInsertLineBreakWithBlocksStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.INSERT_IMAGE_TO_BLOCK, RTETextBlock.typeName, new BlockInsertImageIntoTextStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.TRANSFORM_LIST_BLOCK, RTETextBlock.typeName, new BlockTransformToListStrategy());
 })();
-RTETextBlock.dtoName = 'RTETextBlock';
 
 /**
  * Remove list item nest list block strategy.
@@ -4938,7 +5034,6 @@ class ListItemInsertImageStrategy extends ActionHandleStrategy {
 class RTEListItemBlock extends RTETextBlock {
   constructor(id, nestList, options) {
     super(id, 'list-item', options);
-    this.dtoName = RTEListItemBlock.dtoName;
     /**
      * TODO: Refactor the list item properties children and nestList, merge two properties together.
      *
@@ -4957,7 +5052,8 @@ class RTEListItemBlock extends RTETextBlock {
    */
   static from(block, options = { autoMatchFormat: true }) {
     const listItemBlock = new RTEListItemBlock(block.id, undefined, options);
-    listItemBlock.children = block.nodes.map((richText) => RTETextNode.from(richText, listItemBlock, options));
+    // Do not coerce list nodes to text; bookmarks, tokens and other extension nodes are polymorphic text nodes.
+    listItemBlock.children = RTEListItemBlock.convertNodes(block.nodes, listItemBlock, options);
     if (block.children) {
       listItemBlock.nestList = block.children.map((child) => {
         const listBlock = RTEListBlock.from(child, options);
@@ -5044,19 +5140,20 @@ class RTEListItemBlock extends RTETextBlock {
     return block;
   }
 }
+RTEListItemBlock.typeName = 'RTEListItemBlock';
+// eslint-disable-next-line @globalpayments/vega-eslint/vega-class-member-order-rule
 (() => {
-  ActionHandleStrategyRegistry.register(TextStyleAnnotationAction.name, RTEListItemBlock.name, new BlockUpdateTextStyleStrategy());
-  ActionHandleStrategyRegistry.register(HorizontalAlignmentAnnotationAction.name, RTEListItemBlock.name, new BlockUpdateHorizontalAlignmentStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.LINE_BREAK_SINGLE_BLOCK, RTEListItemBlock.name, new BlockInsertLineBreakStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.LINE_BREAK_MULTIPLE_BLOCKS, RTEListItemBlock.name, new BlockInsertLineBreakWithBlocksStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.DELETE_NEST_LIST, RTEListItemBlock.name, new ListItemRemoveNestListStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.SPLIT_BLOCK_WITH_NODE, RTEListItemBlock.name, new BlockSplitWithTextNodeStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.REPLACE_CHILD_NODES, RTEListItemBlock.name, new BlockReplaceNodesStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.REPLACE_NEST_LIST, RTEListItemBlock.name, new ListItemReplaceNestListStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.MERGE_TWO_BLOCKS_NODES, RTEListItemBlock.name, new BlockMergeNodesStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.INSERT_IMAGE_TO_BLOCK, RTEListItemBlock.name, new ListItemInsertImageStrategy());
+  ActionHandleStrategyRegistry.register(TextStyleAnnotationAction.typeName, RTEListItemBlock.typeName, new BlockUpdateTextStyleStrategy());
+  ActionHandleStrategyRegistry.register(HorizontalAlignmentAnnotationAction.typeName, RTEListItemBlock.typeName, new BlockUpdateHorizontalAlignmentStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.LINE_BREAK_SINGLE_BLOCK, RTEListItemBlock.typeName, new BlockInsertLineBreakStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.LINE_BREAK_MULTIPLE_BLOCKS, RTEListItemBlock.typeName, new BlockInsertLineBreakWithBlocksStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.DELETE_NEST_LIST, RTEListItemBlock.typeName, new ListItemRemoveNestListStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.SPLIT_BLOCK_WITH_NODE, RTEListItemBlock.typeName, new BlockSplitWithTextNodeStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.REPLACE_CHILD_NODES, RTEListItemBlock.typeName, new BlockReplaceNodesStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.REPLACE_NEST_LIST, RTEListItemBlock.typeName, new ListItemReplaceNestListStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.MERGE_TWO_BLOCKS_NODES, RTEListItemBlock.typeName, new BlockMergeNodesStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.INSERT_IMAGE_TO_BLOCK, RTEListItemBlock.typeName, new ListItemInsertImageStrategy());
 })();
-RTEListItemBlock.dtoName = 'RTEListItemBlock';
 
 /**
  * Replace the nest list with new list array
@@ -5268,7 +5365,6 @@ class TransformParagraphAction extends ModifyContentAction {
 class RTEHtmlBlock extends RTEBlock {
   constructor(id, htmlTag) {
     super(id);
-    this.dtoName = RTEHtmlBlock.dtoName;
     this.type = 'html-block';
     this.children = [];
     this.htmlTag = htmlTag;
@@ -5339,7 +5435,7 @@ class RTEHtmlBlock extends RTEBlock {
     return Object.assign(Object.assign({}, super.toJSON()), { id: this.id, type: this.type, htmlTag: this.htmlTag, children: this.children.map((child) => child.toJSON()) });
   }
 }
-RTEHtmlBlock.dtoName = 'RTEHtmlBlock';
+RTEHtmlBlock.typeName = 'RTEHtmlBlock';
 
 /**
  * Convert the selected list block to paragraph strategy.
@@ -5647,8 +5743,8 @@ class ListTransformToParagraphStrategy extends ListAnnotationStrategy {
         return null;
       }
       path.unshift(itemIndex);
-      if (currentList.parent.dtoName === 'VegaRTEContent' ||
-        currentList.parent.dtoName === 'RTEHtmlBlock') {
+      if (currentList.parent.typeName === 'VegaRTEContent' ||
+        currentList.parent.typeName === 'RTEHtmlBlock') {
         const containerPath = this.getContainerPath(currentList);
         return containerPath ? [...containerPath, ...path] : null;
       }
@@ -6059,7 +6155,6 @@ class ListAnnotation extends BlockAnnotation {
 class RTEListBlock extends RTEBlock {
   constructor(id, type, options) {
     super(id);
-    this.dtoName = RTEListBlock.dtoName;
     this.type = 'bullet-list';
     this.children = [];
     this.type = type;
@@ -6164,14 +6259,15 @@ class RTEListBlock extends RTEBlock {
     return this.type === 'number-list' ? 'ol' : 'ul';
   }
 }
+RTEListBlock.typeName = 'RTEListBlock';
+// eslint-disable-next-line @globalpayments/vega-eslint/vega-class-member-order-rule
 (() => {
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.TRANSFORM_LIST_BLOCK, RTEListBlock.name, new ListTransformToListStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.TRANSFORM_PARAGRAPH_BLOCK, RTEListBlock.name, new ListTransformToParagraphStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.INSERT_IMAGE_TO_BLOCK, RTEListBlock.name, new ListInsertImageStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.NEST_LIST_ITEMS, RTEListBlock.name, new ListNestItemsStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.UNNEST_LIST_ITEMS, RTEListBlock.name, new ListUnnestItemsStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.TRANSFORM_LIST_BLOCK, RTEListBlock.typeName, new ListTransformToListStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.TRANSFORM_PARAGRAPH_BLOCK, RTEListBlock.typeName, new ListTransformToParagraphStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.INSERT_IMAGE_TO_BLOCK, RTEListBlock.typeName, new ListInsertImageStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.NEST_LIST_ITEMS, RTEListBlock.typeName, new ListNestItemsStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.UNNEST_LIST_ITEMS, RTEListBlock.typeName, new ListUnnestItemsStrategy());
 })();
-RTEListBlock.dtoName = 'RTEListBlock';
 
 /**
  * The delete node content contains some common functions that used for image block delete the image node or text block delete text node.
@@ -6337,7 +6433,7 @@ class BlockDeleteNodeContentStrategy extends ActionHandleStrategy {
    * @returns {boolean} True if the block is not the root content block, false otherwise.
    */
   isRTEBlock(block) {
-    return block && block.dtoName !== 'VegaRTEContent';
+    return block && block.typeName !== 'VegaRTEContent';
   }
 }
 
@@ -6487,6 +6583,7 @@ class SelectionChangeAction extends AnnotationAction {
     return new SelectionRangeAnnotation(this.range);
   }
 }
+SelectionChangeAction.typeName = 'SelectionChangeAction';
 
 /**
  * Update the code block node annotation map strategy.
@@ -6551,6 +6648,7 @@ class RTEDecoratorNode extends RTENode {
     return false;
   }
 }
+RTEDecoratorNode.typeName = 'RTEDecoratorNode';
 // CSS class names for the decorator node parent element
 RTEDecoratorNode.DECORATOR_CONTAINER_CLASS = 'v-internal-decorator-container';
 // CSS class names for the decorator node element
@@ -6608,7 +6706,6 @@ CodeBlockNodeFilterStylesStrategy.STYLES = {
 class RTECodeBlockNode extends RTEDecoratorNode {
   constructor(id, content, language, parentBlock) {
     super(id);
-    this.dtoName = RTECodeBlockNode.dtoName;
     this.type = NodeTypeEnum.CODE_BLOCK_NODE;
     this.text = '';
     this.annotationMap = new Map();
@@ -6658,11 +6755,12 @@ class RTECodeBlockNode extends RTEDecoratorNode {
     ActionHandleStrategyRegistry.executeTheStrategy(action, this);
   }
 }
+RTECodeBlockNode.typeName = 'RTECodeBlockNode';
+// eslint-disable-next-line @globalpayments/vega-eslint/vega-class-member-order-rule
 (() => {
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.UPDATE_CODE_BLOCK, RTECodeBlockNode.name, new UpdateCodeBlockStrategy());
-  ActionHandleStrategyRegistry.register(SelectionChangeAction.name, RTECodeBlockNode.name, new CodeNodeSetSelectionRangeAnnotationStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.UPDATE_CODE_BLOCK, RTECodeBlockNode.typeName, new UpdateCodeBlockStrategy());
+  ActionHandleStrategyRegistry.register(SelectionChangeAction.typeName, RTECodeBlockNode.typeName, new CodeNodeSetSelectionRangeAnnotationStrategy());
 })();
-RTECodeBlockNode.dtoName = 'RTECodeBlockNode';
 
 /**
  * Insert image behind after code block strategy.
@@ -6729,7 +6827,7 @@ class CodeBlockFilterStylesStrategy extends RTEFilterStylesStrategy {
    * @inheritDoc
    */
   canFilter(blockOrNodeInstance) {
-    return Predicate.isCodeBlock(blockOrNodeInstance.dtoName);
+    return Predicate.isCodeBlock(blockOrNodeInstance.typeName);
   }
   /**
    * The code block styles is preset and will convert to vega-code-block element so we don't need to to refill styles back to element.
@@ -6760,7 +6858,6 @@ CodeBlockFilterStylesStrategy.STYLES = {
 class RTECodeBlock extends RTEBlock {
   constructor(id, content, language) {
     super(id);
-    this.dtoName = RTECodeBlock.dtoName;
     this.type = 'code-block';
     this.annotationMap = new Map([CustomStyleAnnotation.from(CodeBlockFilterStylesStrategy.STYLES)]);
     this.children = [new RTECodeBlockNode(`${id}-1`, content, language, this)];
@@ -6842,13 +6939,14 @@ class RTECodeBlock extends RTEBlock {
     return this.children[0].annotationMap.has(InternalAnnotationTypeEnum.SELECTION_RANGE);
   }
 }
+RTECodeBlock.typeName = 'RTECodeBlock';
+// eslint-disable-next-line @globalpayments/vega-eslint/vega-class-member-order-rule
 (() => {
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.DELETE_CODE_BLOCK, RTECodeBlock.name, new CodeBlockRemoveSelfStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.DELETE_CHILDREN, RTECodeBlock.name, new RemoveChildrenStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.SWITCH_OUT_FROM_CODE_BLOCK, RTECodeBlock.name, new SwitchOutFromCodeBlockStrategy());
-  ActionHandleStrategyRegistry.register(ModifyContentActionType.INSERT_IMAGE_TO_BLOCK, RTECodeBlock.name, new CodeBlockInsertImageStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.DELETE_CODE_BLOCK, RTECodeBlock.typeName, new CodeBlockRemoveSelfStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.DELETE_CHILDREN, RTECodeBlock.typeName, new RemoveChildrenStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.SWITCH_OUT_FROM_CODE_BLOCK, RTECodeBlock.typeName, new SwitchOutFromCodeBlockStrategy());
+  ActionHandleStrategyRegistry.register(ModifyContentActionType.INSERT_IMAGE_TO_BLOCK, RTECodeBlock.typeName, new CodeBlockInsertImageStrategy());
 })();
 RTECodeBlock.CODE_BLOCK_PLACEHOLDER_CLASS_NAME = 'code-block-placeholder-element';
-RTECodeBlock.dtoName = 'RTECodeBlock';
 
-export { ITALIC_FONT_STYLE as $, ActionHandleStrategyRegistry as A, BlockAnnotation as B, CommonAnnotationTypeEnum as C, CommonAnnotation as D, ReplaceChildNodesAction as E, BlockMergeNodesStrategy as F, BlockReplaceNodesStrategy as G, HTML_VOID_TAGS as H, InsertChildrenAfterAction as I, HorizontalAlignmentAnnotationAction as J, BlockUpdateHorizontalAlignmentStrategy as K, BlockDeleteNodeContentStrategy as L, ModifyContentAction as M, NodeAnnotationTypeEnum as N, RemoveChildrenStrategy as O, RemoveNestListAction as P, ReplaceNestListAction as Q, RTETextNode as R, SplitBlockWithNodeAction as S, RTEListBlock as T, UpdateTextAction as U, VegaRTEPresetToolbarItems as V, BOLD_FONT_WEIGHT_KEYWORD as W, BOLD_FONT_WEIGHT as X, createStyleMapFromElement as Y, RTE_TEXT_COLORS as Z, RTE_DEFAULT_TEXT_COLOR as _, RTEBlock as a, STRIKETHROUGH_TEXT_DECORATION as a0, UNDERLINE_TEXT_DECORATION as a1, TextStyleAnnotation as a2, RTEHtmlBlock as a3, Predicate as a4, ListAnnotation as a5, HorizontalAlignmentAnnotation as a6, CodeAnnotation as a7, TEXT_STYLE_DEFAULT_FONT_WEIGHT as a8, LinkFilterStylesStrategy as a9, RTE_PASTE_MODE_WORD as aA, RTE_UPDATE_SOURCE_KEY as aB, RTE_EMAIL_LINK_TYPE_KEY as aC, RTE_DEFAULT_LINK_TYPE_KEY as aD, RTE_SUPPORTED_LINK_TYPE_KEYS as aE, CodeBlockFilterStylesStrategy as aa, CodeBlockNodeFilterStylesStrategy as ab, SyncUpSelectionAction as ac, ActionHandlerInterceptorRegistry as ad, CodeLanguage as ae, CustomClassAnnotation as af, VegaRTEDefaultTextStyleItems as ag, ZERO_WIDTH_SPACE as ah, LinkAnnotationAction as ai, UpdateCodeBlockAction as aj, SelectionChangeAction as ak, TextColorAnnotationAction as al, VegaRTEOneRowHeightPx as am, BoldAnnotationAction as an, ItalicAnnotationAction as ao, UnderlineAnnotationAction as ap, TextStyleAnnotationAction as aq, BoldAnnotation as ar, BlockAnnotationTypeEnum as as, ClearFormattingAnnotationAction as at, CodeAnnotationAction as au, StrikethroughAnnotationAction as av, IndentAnnotationAction as aw, TransformParagraphAction as ax, RTEUpdateSource as ay, escapeHtml as az, RTETextBlock as b, RTE_BLOCK_BOUNDARY_ATTRIBUTE as c, RTEAnnotationStyle as d, ActionHandleStrategy as e, AppendChildrenAction as f, RTENode as g, InsertChildrenBeforeAction as h, InternalAnnotationTypeEnum as i, ModifyContentActionType as j, AnnotationAction as k, RemoveChildrenAction as l, CustomAttributeAnnotation as m, RTEDTOClassManager$1 as n, RTEFilterStylesStrategy as o, RTEDecoratorNode as p, RTECodeBlock as q, RTEListItemBlock as r, stateEntityRenderingRegistry as s, RTECodeBlockNode as t, CustomStyleAnnotation as u, RTEFilterStylesStrategyRegistry as v, RTE_PASTE_MODE_DATA_TYPE as w, RTE_WORD_COUNT_KEY as x, NodeAnnotation as y, NodeTypeEnum as z };
+export { ITALIC_FONT_STYLE as $, ActionHandleStrategyRegistry as A, BlockAnnotation as B, CommonAnnotationTypeEnum as C, CommonAnnotation as D, ReplaceChildNodesAction as E, BlockMergeNodesStrategy as F, BlockReplaceNodesStrategy as G, HTML_VOID_TAGS as H, InsertChildrenAfterAction as I, HorizontalAlignmentAnnotationAction as J, BlockUpdateHorizontalAlignmentStrategy as K, BlockDeleteNodeContentStrategy as L, ModifyContentAction as M, NodeAnnotationTypeEnum as N, RemoveChildrenStrategy as O, RemoveNestListAction as P, ReplaceNestListAction as Q, RTETextNode as R, SplitBlockWithNodeAction as S, RTEListBlock as T, UpdateTextAction as U, VegaRTEPresetToolbarItems as V, BOLD_FONT_WEIGHT_KEYWORD as W, BOLD_FONT_WEIGHT as X, createStyleMapFromElement as Y, RTE_TEXT_COLORS as Z, RTE_DEFAULT_TEXT_COLOR as _, RTEBlock as a, STRIKETHROUGH_TEXT_DECORATION as a0, UNDERLINE_TEXT_DECORATION as a1, TextStyleAnnotation as a2, RTEHtmlBlock as a3, Predicate as a4, ListAnnotation as a5, HorizontalAlignmentAnnotation as a6, CodeAnnotation as a7, TEXT_STYLE_DEFAULT_FONT_WEIGHT as a8, LinkFilterStylesStrategy as a9, RTEUpdateSource as aA, escapeHtml as aB, RTE_PASTE_MODE_WORD as aC, RTE_UPDATE_SOURCE_KEY as aD, RTE_EMAIL_LINK_TYPE_KEY as aE, RTE_DEFAULT_LINK_TYPE_KEY as aF, RTE_SUPPORTED_LINK_TYPE_KEYS as aG, CodeBlockFilterStylesStrategy as aa, CodeBlockNodeFilterStylesStrategy as ab, SyncUpSelectionAction as ac, escapeHtmlAttribute as ad, BoldAnnotationAction as ae, DeleteNodeAnnotationAction as af, ActionHandlerInterceptorRegistry as ag, CodeLanguage as ah, CustomClassAnnotation as ai, VegaRTEDefaultTextStyleItems as aj, ZERO_WIDTH_SPACE as ak, LinkAnnotationAction as al, UpdateCodeBlockAction as am, SelectionChangeAction as an, TextColorAnnotationAction as ao, VegaRTEOneRowHeightPx as ap, ItalicAnnotationAction as aq, UnderlineAnnotationAction as ar, TextStyleAnnotationAction as as, BoldAnnotation as at, BlockAnnotationTypeEnum as au, ClearFormattingAnnotationAction as av, CodeAnnotationAction as aw, StrikethroughAnnotationAction as ax, IndentAnnotationAction as ay, TransformParagraphAction as az, RTETextBlock as b, RTE_BLOCK_BOUNDARY_ATTRIBUTE as c, RTEAnnotationStyle as d, ActionHandleStrategy as e, AppendChildrenAction as f, RTENode as g, InsertChildrenBeforeAction as h, InternalAnnotationTypeEnum as i, ModifyContentActionType as j, AnnotationAction as k, RemoveChildrenAction as l, CustomAttributeAnnotation as m, RTEDTOClassManager$1 as n, RTEFilterStylesStrategy as o, RTEDecoratorNode as p, RTECodeBlock as q, RTEListItemBlock as r, stateEntityRenderingRegistry as s, RTECodeBlockNode as t, CustomStyleAnnotation as u, RTEFilterStylesStrategyRegistry as v, RTE_PASTE_MODE_DATA_TYPE as w, RTE_WORD_COUNT_KEY as x, NodeAnnotation as y, NodeTypeEnum as z };