@globalpayments/vega 2.60.0 → 2.62.0

package/dist/types/components/vega-date-picker/vega-date-picker.d.ts

@@ -1,6 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { FormFieldValidationRule } from '../../helpers/validator/rules/form-field-validation-rule';
-import { DatePickerModeType, DatePickerValueType, DropdownConfigForDatePicker } from './types';
+import { DatePickerModeType, DatePickerMonthYearTypes, DatePickerValueType, DropdownConfigForDatePicker } from './types';
 import { GlobalSlimmers } from '../../vega-slimmer/vega-slimmer-core';
 import { FormFieldControllerSlimmer } from '../../helpers/slimmers/form-field-controller-slimmer';
 import { VegaDatePickerRenderer } from './slimmers/renderers/vega-date-picker-renderer';
@@ -20,6 +20,7 @@ import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/
 import { TranslationSlimmer } from '../../helpers/slimmers/translation';
 import { VegaDatePickerMonthYearDropdownRenderer } from './slimmers/renderers/vega-date-picker-calendar-month-year-dropdown-renderer';
 import { DisabledDate } from '../vega-calendar/types';
+import { VegaDatePickerMonthYearChangeEventController } from './slimmers/controllers/vega-date-picker-month-year-change-event-controller';
 /**
  * @vegaVersion 1.3.0
  */
@@ -40,10 +41,12 @@ export declare class VegaDatePicker {
   protected vegaDatePickerRangeInputRenderer: VegaDatePickerRangeInputRenderer;
   protected vegaDatePickerCalendarRenderer: VegaDatePickerCalendarRenderer;
   protected formFieldController: FormFieldControllerSlimmer<string[] | string>;
+  protected monthYearChangeEventEmitter: EventEmitSlimmerBase;
   protected changeEventEmitter: EventEmitSlimmerBase;
   protected inputEventPrevent: ChildNodesEventPreventSlimmer;
   protected vegaComponentUsageRuntimeMetricsSlimmer: VegaComponentUsageRuntimeMetricsSlimmer<HTMLVegaDatePickerElement>;
   protected monthYearDropdownRenderer: VegaDatePickerMonthYearDropdownRenderer;
+  protected vegaDatePickerMonthYearChangeEventController: VegaDatePickerMonthYearChangeEventController;
   host: HTMLVegaDatePickerElement;
   /**
    * Specifies the selection mode of the date picker.
@@ -232,6 +235,19 @@ export declare class VegaDatePicker {
    * @vegaVersion 2.0.0
    */
   change: EventEmitter<string | string[]>;
+  /**
+   * An event emitter notifying the month and year change when the navigation buttons are clicked or the month and year dropdowns are selected in the date picker,
+   *    whether triggered programmatically or through user interaction.
+   *
+   * @vegaVersion 2.61.0
+   */
+  vegaMonthYearChange: EventEmitter<DatePickerMonthYearTypes>;
+  /**
+   * An event emitter notifying the month and year change when the navigation buttons are clicked or the month and year dropdowns are selected in the date picker,
+   * @eventSemantics namespace:native
+   * @vegaVersion 2.61.0
+   */
+  monthYearChange: EventEmitter<DatePickerMonthYearTypes>;
   /**
    * Invoke this method to close the calendar dropdown
    *    associated with the date picker.

package/dist/types/components/vega-rich-text-content/vega-rich-text-content.d.ts

@@ -3,6 +3,7 @@ import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/
 import { VegaRichTextContentRenderer } from './slimmers/renderers/vega-rich-text-content-renderer';
 import { VegaRTEContent } from '../vega-rich-text-editor/dto/content-state';
 import { VegaRichTextContentStateController } from './slimmers/controllers/vega-rich-text-content-state-controller';
+import { VegaRTEExtension } from '../vega-rich-text-editor/extensions/extension.abstract';
 /**
  * @vegaVersion 2.34.0
  */
@@ -37,6 +38,13 @@ export declare class VegaRichTextContent {
    */
   content: VegaRTEContent;
   watchValueUpdate(): void;
+  /**
+   * Defines the configuration for rich text content extensions.
+   * It enables support for custom nodes, ensuring that extended content is rendered correctly.
+   *
+   * @vegaVersion 2.62.0
+   */
+  extensions: VegaRTEExtension[];
   /**
    * Invoke this method to focus on rich text content editable div
    *

package/dist/types/components/vega-rich-text-editor/constants/constant.d.ts

@@ -1,4 +1,5 @@
-import { VegaRTEColorSchema } from '../interface';
+import { VegaRTEColorSchema, VegaRTEToolbarItem } from '../interface';
 export declare const RTE_DEFAULT_TEXT_COLOR: VegaRTEColorSchema;
 export declare const RTE_TEXT_COLORS: VegaRTEColorSchema[];
 export declare const ZERO_WIDTH_SPACE: string;
+export declare const VegaRTEPresetToolbarItems: VegaRTEToolbarItem[][];

package/dist/types/components/vega-rich-text-editor/dto/action-handle-strategies/action-handle-strategy-registry.d.ts

@@ -38,4 +38,12 @@ export declare class ActionHandleStrategyRegistry {
    * @returns {R | undefined} The return value of the strategy method execute invoke result.
    */
   static executeTheStrategy<T extends ModifyContentAction | AnnotationAction, target extends RTENode | RTEBlock | VegaRTEContent, R = void>(action: T, RTEInstance: target): R | undefined;
+  /**
+   * Check if the action type can be handled by strategy for the specific RTE instance.
+   *
+   * @param {string} actionType - The special action type or the action class name.
+   * @param {RTENode | RTEBlock} RTEInstance - The rich text editor node.
+   * @returns {boolean} - Whether the action type can be handled by the strategy.
+   */
+  static canHandle(actionType: string, RTEInstance: RTENode | RTEBlock): boolean;
 }

package/dist/types/components/vega-rich-text-editor/dto/action-handle-strategies/modify-content-strategies/insert-node-to-nearest-root-strategy.d.ts

@@ -0,0 +1,18 @@
+import { InsertNodeToNearestRootAction } from '../../actions/insert-node-to-nearest-root-action';
+import type { RTEBlock } from '../../blocks/block.abstract';
+import { ActionHandleStrategy } from '../action-handle-strategy.abstract';
+/**
+ * Insert a new node in nearest position of parent block strategy.
+ */
+export declare class InsertNodeToNearestRootStrategy extends ActionHandleStrategy<InsertNodeToNearestRootAction, RTEBlock> {
+  /**
+   * @inheritDoc
+   */
+  protected handleAction(action: InsertNodeToNearestRootAction, target: RTEBlock): void;
+  /**
+   * Update the cursor position to end of the inserted node.
+   *
+   * @param {RTENode} node - node to find root content
+   */
+  private updateCursorPosition;
+}

package/dist/types/components/vega-rich-text-editor/dto/actions/insert-node-to-nearest-root-action.d.ts

@@ -0,0 +1,14 @@
+import { RTENode } from '../nodes/node.abstract';
+import { RTERange } from '../range';
+import { ModifyContentAction, ModifyContentActionType } from './modify-content-action.abstract';
+/**
+ * Insert a new children to the nearest position of the parent container
+ *
+ * @example parent.apply(new InsertNodeToNearestRoot(rteRange, nodeToBeInserted))
+ */
+export declare class InsertNodeToNearestRootAction extends ModifyContentAction {
+  type: ModifyContentActionType;
+  rteRange: RTERange;
+  nodeToBeInserted: RTENode;
+  constructor(rteRange: RTERange, nodeToBeInserted: RTENode);
+}

package/dist/types/components/vega-rich-text-editor/dto/actions/modify-content-action.abstract.d.ts

@@ -26,7 +26,8 @@ export declare enum ModifyContentActionType {
   'LINK_GROUP_NODE_SPLIT' = "LINK_GROUP_NODE_SPLIT",
   'DELETE_LINK_GROUP' = "DELETE_LINK_GROUP",
   'UPDATE_CURSOR_POSITION' = "UPDATE_CURSOR_POSITION",
-  'INSERT_TEXT_TO_DECORATOR_NODE' = "INSERT_TEXT_TO_DECORATOR_NODE"
+  'INSERT_TEXT_TO_DECORATOR_NODE' = "INSERT_TEXT_TO_DECORATOR_NODE",
+  'INSERT_NODE_TO_NEAREST_ROOT' = "INSERT_NODE_TO_NEAREST_ROOT"
 }
 /**
  * Abstract class for update node content, delete node, insert node

package/dist/types/components/vega-rich-text-editor/dto/actions/update-cursor-position-action.d.ts

@@ -4,17 +4,19 @@ import { ModifyContentAction } from './modify-content-action.abstract';
 /**
  * Update the cursor position in the editor.
  *
- * @example richEditorRef.value.apply(new UpdateCursorPositionAction(nextFocusNode, [offset]))
+ * @example richEditorRef.value.apply(new UpdateCursorPositionAction(nextFocusNode, [offset], [immediatelyRun]))
  */
 export declare class UpdateCursorPositionAction extends ModifyContentAction {
   type: string;
   nextFocusNode: RTENode;
   offset: Nullable<number>;
+  immediatelyRun: boolean;
   /**
    * Set the cursor position at end of the current node.
    *
    * @param {RTENode} nextFocusNode - The rich text editor needs focus node.
    * @param {number} offset - The cursor offset position.
+   * @param {boolean} immediatelyRun - Whether to immediately set the cursor position after applying it. Usually the set action will trigger after the UI renders.
    */
-  constructor(nextFocusNode: RTENode, offset?: number);
+  constructor(nextFocusNode: RTENode, offset?: number, immediatelyRun?: boolean);
 }

package/dist/types/components/vega-rich-text-editor/dto/blocks/block.abstract.d.ts

@@ -12,8 +12,8 @@ import { CustomAttributeAnnotation } from '../annotations/custom-attribute-annot
 import { ClassType } from '../../../../types/class.type';
 export declare type BlockAnnotations = Map<RTEBlockAnnotationMapKey, RTEBlockAnnotationMapValue>;
 export declare type BlockAnnotationsEntity = [RTEBlockAnnotationMapKey, RTEBlockAnnotationMapValue];
-declare type RTEBlockParentType = VegaRTEContent | RTEBlock;
-declare type RTEBlockChildrenType = RTEBlock | RTENode;
+export declare type RTEBlockParentType = VegaRTEContent | RTEBlock;
+export declare type RTEBlockChildrenType = RTEBlock | RTENode;
 /**
  * Abstract class for block
  */
@@ -154,4 +154,3 @@ export declare abstract class RTEBlock<P = RTEBlockParentType, C = RTEBlockChild
    */
   abstract clone(): InstanceType<ClassType<RTEBlock>>;
 }
-export {};

package/dist/types/components/vega-rich-text-editor/dto/content-state.d.ts

@@ -60,6 +60,12 @@ export declare class VegaRTEContent {
    * @param {ModifyContentAction} action - Modify content action
    */
   apply(action: ModifyContentAction): void;
+  /**
+   * Get the last node in the content.
+   *
+   * @returns {Nullable<RTENode>} The last node in the content or null if there are no nodes.
+   */
+  getLastNode(): Nullable<RTENode>;
   /**
    * Convert text to list.
    *

package/dist/types/components/vega-rich-text-editor/dto/nodes/text-node.d.ts

@@ -1,5 +1,5 @@
 import { RTENodeAnnotationMapKey, RTENodeAnnotationMapValue, VegaRTETransformOptions, VegaRTETextAnnotations, VegaRTETextNode } from '../../interface';
-import { NodeTypeEnum, RTENode } from './node.abstract';
+import { NodeAnnotations, NodeTypeEnum, RTENode } from './node.abstract';
 import { AnnotationAction } from '../actions/annotation-action.abstract';
 import { Nullable } from '../../../../types/general';
 import { RTETextBlock } from '../blocks/text-block';
@@ -33,6 +33,16 @@ export declare class RTETextNode extends RTENode<RTETextBlock> {
    * @returns {RTETextNode} an RTETextNode
    */
   static from(richText: VegaRTETextNode, parentBlock: RTETextBlock, options?: VegaRTETransformOptions): RTETextNode;
+  /**
+   * Generates a map of text annotations for the given set of annotations.
+   *
+   * @param {VegaRTETextAnnotations} annotations - The annotations to be converted into a map.
+   * @param {VegaRTETransformOptions} options - Optional transformation options.
+   * @param {RTETextBlock} parentBlock - The parent text block.
+   * @param {RTETextNode} textNode - The text node.
+   * @returns {NodeAnnotations} The map of text annotations.
+   */
+  protected static generateTextAnnotationMap(annotations: VegaRTETextAnnotations, options?: VegaRTETransformOptions, parentBlock?: RTETextBlock, textNode?: RTETextNode): NodeAnnotations;
   /**
    * Creates different types of text annotations based on the provided type and value.
    *

package/dist/types/components/vega-rich-text-editor/dto/renderers/blocks/link-wrapper-renderer.d.ts

@@ -1,6 +1,6 @@
 import { RTETextNode } from '../../nodes/text-node';
 import { LinkGroupAnnotation } from '../../annotations/link-group-annotation';
-import { RTERenderContext } from '../../../interface';
+import { RTERenderContext, VegaRTERenderResult } from '../../../interface';
 /**
  * Renders link nodes and wraps them with link editor or anchor element based on edit mode.
  */
@@ -11,9 +11,9 @@ declare class RTELinkWrapperRenderer {
    * @param {RTETextNode[]} nodes - Array of text nodes to render.
    * @param {LinkGroupAnnotation} linkGroupAnnotation - link group annotation
    * @param {RTERenderContext} context - Context containing render options.
-   * @returns {HTMLElement[]} - Array of rendered HTML elements.
+   * @returns {VegaRTERenderResult[]} - Array of rendered HTML elements.
    */
-  render(nodes: RTETextNode[], linkGroupAnnotation: LinkGroupAnnotation, { editable }: RTERenderContext): HTMLElement[];
+  render(nodes: RTETextNode[], linkGroupAnnotation: LinkGroupAnnotation, { editable }: RTERenderContext): VegaRTERenderResult[];
   private groupNodesByLink;
   private isLinkGroup;
   private renderLinkEditorWrapper;

package/dist/types/components/vega-rich-text-editor/extensions/base-toolbar-button-renderer.d.ts

@@ -1,13 +1,106 @@
-import { VegaRTECreateElementFunction, VegaRTEExtensionContext, VegaRTERenderResult } from '../interface';
+import { Nullable } from '../../../types/general';
+import { VegaRTECreateElementFunction, VegaRTEToolbarRenderContext, VegaRTERenderResult, RTEToolbarDropdownProps, RTEDropdownListItem, RTEToolbarButtonProps } from '../interface';
 /**
  * Base class for rendering extension toolbar button in the rich text editor.
+ * The renderer provides common functionalities for rendering toolbar buttons, including:
+ * - Rendering a button with an icon, label, and optional arrow icon.
+ * - Rendering a dropdown with a list of items.
+ * - Rendering dropdown items.
+ * - Rendering template for dropdown list.
+ * - Determining if the button should be disabled based on the editor context.
+ * - Handling button and dropdown click events.
+ * Override the methods to customize the rendering and behavior of the button.
  */
 export declare abstract class VegaRTEToolbarButtonRenderer {
+  /**
+   * Checks if the button should be hidden.
+   *
+   * @param {VegaRTEToolbarRenderContext} editorContext The render context for the editor.
+   * @returns {boolean} True if the button is hidden, false otherwise.
+   */
+  isHidden(editorContext: VegaRTEToolbarRenderContext): boolean;
   /**
    * Renders the toolbar button.
    *
    * @param createElement Function to create elements in the rich text editor.
    * @returns {VegaRTERenderResult} Toolbar button.
    */
-  abstract render(createElement: VegaRTECreateElementFunction, editorContext?: VegaRTEExtensionContext): VegaRTERenderResult;
+  abstract render(createElement: VegaRTECreateElementFunction, editorContext?: VegaRTEToolbarRenderContext): VegaRTERenderResult;
+  /**
+   * Renders a dropdown component with the specified properties and children.
+   *
+   * @param {VegaRTECreateElementFunction} h - Create element function.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   * @param {RTEToolbarDropdownProps} dropdownProps - The properties for the dropdown.
+   * @param {VegaRTERenderResult[]} children - The children elements for the dropdown.
+   * @returns {VegaRTERenderResult} - The render result for the dropdown.
+   */
+  protected renderDropdown(h: VegaRTECreateElementFunction, editorContext: VegaRTEToolbarRenderContext, dropdownProps: RTEToolbarDropdownProps, children: VegaRTERenderResult[]): VegaRTERenderResult;
+  /**
+   * Renders the dropdown list template.
+   *
+   * @param {VegaRTECreateElementFunction} h - Create element function.
+   * @param {RTEDropdownListItem[]} itemList - The list of dropdown items.
+   * @returns {VegaRTERenderResult} - The render result for the dropdown list.
+   */
+  protected renderDropdownListTemplate(h: VegaRTECreateElementFunction, itemList: RTEDropdownListItem[]): VegaRTERenderResult;
+  /**
+   * Renders a dropdown item for the toolbar button.
+   *
+   * @param {VegaRTECreateElementFunction} h - Create element function.
+   * @param {RTEDropdownListItem} item - The dropdown item.
+   * @returns {VegaRTERenderResult} - The render result for the dropdown item.
+   */
+  protected renderDropdownItem(h: VegaRTECreateElementFunction, item: RTEDropdownListItem): VegaRTERenderResult;
+  /**
+   * Renders a common toolbar button with optional icon, label, and arrow icon.
+   *
+   * @param {VegaRTECreateElementFunction} h - Create element function.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   * @param {RTEToolbarButtonProps} buttonProps - The properties for the button.
+   * @returns {VegaRTERenderResult} - The render result for the button.
+   */
+  protected renderButton(h: VegaRTECreateElementFunction, editorContext: VegaRTEToolbarRenderContext, buttonProps: RTEToolbarButtonProps): VegaRTERenderResult;
+  /**
+   * Renders the button label.
+   *
+   * @param {VegaRTECreateElementFunction} h - Create element function.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   * @param {Nullable<string>} label - The button label if exist.
+   * @returns {Nullable<VegaRTERenderResult>} - The render result for the button.
+   */
+  protected renderButtonLabel(h: VegaRTECreateElementFunction, editorContext: VegaRTEToolbarRenderContext, label: Nullable<string>): Nullable<VegaRTERenderResult>;
+  /**
+   * Determines if the button should be disabled based on the editor context.
+   *
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   * @returns {boolean} - True if the button should be disabled, false otherwise.
+   */
+  protected isDisabled(editorContext: VegaRTEToolbarRenderContext): boolean;
+  /**
+   * Checks if the button should be selected.
+   *
+   * @param {VegaRTEToolbarRenderContext} _editorContext The render context for the editor.
+   * @returns {boolean} True if the button is selected, false otherwise.
+   */
+  protected isSelected(_editorContext: VegaRTEToolbarRenderContext): boolean;
+  /**
+   * Prevents the default action of the click event. This is to avoid losing focus from the editor when the button is clicked.
+   *
+   * @param {MouseEvent} e The mouse event to prevent default action for.
+   */
+  protected preventDefault(e: MouseEvent): void;
+  /**
+   * Handles the button click event.
+   *
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   */
+  protected abstract handleButtonClick(editorContext: VegaRTEToolbarRenderContext): void;
+  /**
+   * Handles the dropdown click event.
+   *
+   * @param {string} itemKey - The key of the clicked dropdown item.
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   */
+  protected abstract handleDropdownClick(itemKey: string, editorContext?: VegaRTEToolbarRenderContext): void;
 }

package/dist/types/components/vega-rich-text-editor/extensions/extension.abstract.d.ts

@@ -0,0 +1,82 @@
+import { BaseRenderer } from '../../../helpers/rte-manager/dto-renderer-manager';
+import { ClassType } from '../../../types/class.type';
+import { RTEBlock } from '../dto/blocks/block.abstract';
+import { RTENode } from '../dto/nodes/node.abstract';
+import { VegaRTEToolbarButtonRenderer } from './base-toolbar-button-renderer';
+import { ElementToDTOStrategy } from '../slimmers/controllers/helper/element-to-dto-strategy/element-to-dto-strategy.abstract';
+import { Nullable } from '../../../types/general';
+import { RTEExtensionContext } from '../interface';
+import { ActionHandleStrategy } from '../dto/action-handle-strategies/action-handle-strategy.abstract';
+import { ModifyContentAction } from '../public-api';
+/**
+ * Abstract class for Vega Rich Text Editor extensions.
+ */
+export declare abstract class VegaRTEExtension {
+  /**
+   * The context of the RTE extension, which may include references to the host editor and other relevant information.
+   */
+  protected extensionContext: Nullable<RTEExtensionContext>;
+  /**
+   * Registers an action handle strategy for a specific node or block class.
+   *
+   * @param {string} nodeOrBlockClassName - The name of the node or block class.
+   * @param {string} actionType - The type of the action.
+   * @param {ActionHandleStrategy<ModifyContentAction, RTENode | RTEBlock>} strategy - The strategy to register.
+   */
+  static registerActionHandleStrategy(nodeOrBlockClassName: string, actionType: string, strategy: ActionHandleStrategy<ModifyContentAction, RTENode | RTEBlock>): void;
+  /**
+   * Initializes the RTE extension with the provided context.
+   *
+   * @param {RTEExtensionContext} context - The context of the RTE extension.
+   */
+  initialExtension(context: RTEExtensionContext): void;
+  /**
+   * Register a node type with the extension.
+   *
+   * @param {string} type - The type of the node or block. The type should be a string that uniquely identifies the node or block.
+   * @param {ClassType<RTEBlock | RTENode>} DTOClass - The DTO class to register.
+   */
+  protected registerNode(type: string, DTOClass: ClassType<RTEBlock | RTENode>): void;
+  /**
+   * Register a renderer for a node type with the extension.
+   *
+   * @param {string} type - The type of the node or block. The type should be a string that uniquely identifies the node or block.
+   * @param {BaseRenderer} renderer - The renderer to register.
+   */
+  protected registerRenderer(type: string, renderer: BaseRenderer): void;
+  /**
+   * Register a toolbar button renderer for the extension.
+   *
+   * @param {string} type - The type of the toolbar button.
+   * @param {VegaRTEToolbarButtonRenderer} renderer - The renderer to register.
+   */
+  protected registerToolbarButtonRenderer(type: string, renderer: VegaRTEToolbarButtonRenderer): void;
+  /**
+   * This is a helper method that utilizes RTEUtils to register common strategies.
+   * Call the method with the class name of the block to make it support basic strategies like:
+   * - Delete children
+   * - Append the children
+   * - Delete the block children content
+   *
+   * @param {string} blockClassName - The class name of the block to register strategies for.
+   */
+  protected registerBlockBasicStrategies(blockClassName: string): void;
+  /**
+   * Register an element to block DTO class strategy.
+   *
+   * @param {ElementToDTOStrategy} strategy - The strategy to register.
+   */
+  protected registerElementToBlockDTOClassStrategy(strategy: ElementToDTOStrategy): void;
+  /**
+   * Register an element to node DTO class strategy.
+   *
+   * @param {ElementToDTOStrategy} strategy - The strategy to register.
+   */
+  protected registerElementToNodeDTOClassStrategy(strategy: ElementToDTOStrategy): void;
+  /**
+   * Get the registered element to node DTO class strategies.
+   *
+   * @returns {ElementToDTOStrategy[]} - The registered element to node DTO class strategies.
+   */
+  protected getElementToNodeDTOClassStrategies(): ElementToDTOStrategy[];
+}

package/dist/types/components/vega-rich-text-editor/extensions/languages/language-extension.d.ts

@@ -0,0 +1,50 @@
+import { RTEDropdownListItem, RTEExtensionContext, RTELanguageExtensionState } from '../../interface';
+import { VegaRTEExtension } from '../extension.abstract';
+/**
+ * Language extension for Vega Rich Text Editor.
+ * This extension allows users to switch between different languages and maintain separate content for each language.
+ */
+export declare class VegaRTELanguageExtension extends VegaRTEExtension {
+  private languageToolbarButtonRenderer;
+  private languageState;
+  constructor(languageList: RTEDropdownListItem[], languagesState?: RTELanguageExtensionState);
+  /**
+   * Initializes the language extension.
+   * Applies the content for the selected language upon initialization.
+   *
+   * @param {RTEExtensionContext} context The extension context.
+   */
+  initialExtension(context: RTEExtensionContext): void;
+  /**
+   * Invoked to set the language extension state. The method used if the state can not be provide when the editor is initialized.
+   *
+   * @param {RTELanguageExtensionState} state The language extension state to set.
+   */
+  setState(state: RTELanguageExtensionState): void;
+  /**
+   * Invoked to get the language extension state.
+   *
+   * @returns {RTELanguageExtensionState} The current language extension state.
+   */
+  getState(): RTELanguageExtensionState;
+  /**
+   * Listener for language change events from the toolbar button renderer.
+   *
+   * @param {string} selectedLanguage - The newly selected language.
+   */
+  private languageChangeCallBack;
+  /**
+   * Applies the content for the selected language.
+   *
+   * @param {string} selectedLanguage - The newly selected language.
+   * @param {RTELanguageExtensionState['contentMap']} contentMap - The content map for all languages.
+   */
+  private applyLanguageContent;
+  /**
+   * Get the RTE latest value. The value is from the code block when in source edit mode; otherwise, it's from the host value.
+   *
+   * @param {HTMLElement} host - The host element of the rich text editor.
+   * @returns {VegaRTEContent} - The content.
+   */
+  private getRTELatestValue;
+}

package/dist/types/components/vega-rich-text-editor/extensions/languages/language-toolbar-button-renderer.d.ts

@@ -0,0 +1,54 @@
+import { RTEDropdownListItem, VegaRTECreateElementFunction, VegaRTERenderResult, VegaRTEToolbarRenderContext } from '../../interface';
+import { VegaRTEToolbarButtonRenderer } from '../base-toolbar-button-renderer';
+export declare type LanguageSelectedCallback = (selectedLanguage: string) => void;
+/**
+ * Toolbar button renderer for language selection in Vega Rich Text Editor.
+ */
+export declare class RTELanguageToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer {
+  private languageList;
+  private selectedLanguage;
+  private labelRef;
+  private languageChangeCallback;
+  constructor(languageList: RTEDropdownListItem[], languageChangeCallback: LanguageSelectedCallback, selectedLanguage: string);
+  /**
+   * Public method to set the selected language.
+   *
+   * @param {string} language The language key to set as selected.
+   */
+  setSelectedLanguage(language: string): void;
+  /**
+   * The source edit mode does not affect the language button visibility.
+   *
+   * @returns {boolean} True if the button is hidden, false otherwise.
+   */
+  isHidden(): boolean;
+  /**
+   * @inheritDoc
+   */
+  render(createElement: VegaRTECreateElementFunction, editorContext: VegaRTEToolbarRenderContext): VegaRTERenderResult;
+  /**
+   * Override to render the button label with custom behavior.
+   *
+   * @inheritDoc
+   */
+  protected renderButtonLabel(h: VegaRTECreateElementFunction, editorContext: VegaRTEToolbarRenderContext, label: string): VegaRTERenderResult;
+  /**
+   * Handles the button click event. No need this method for language button.
+   *
+   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
+   */
+  protected handleButtonClick(editorContext: VegaRTEToolbarRenderContext): void;
+  /**
+   * Handles the language selection event.
+   *
+   * @param {string} itemKey - The key of the selected language item.
+   */
+  protected handleDropdownClick: (itemKey: string) => void;
+  /**
+   * Gets the label of a language by its key.
+   *
+   * @param {string} key The language key to look up.
+   * @returns {string} The label of the language, or the key if not found.
+   */
+  private getLanguageLabelByKey;
+}

package/dist/types/components/vega-rich-text-editor/extensions/tokens/insert-token-node-action.d.ts

@@ -0,0 +1,16 @@
+import { Nullable } from '../../../../types/general';
+import { ModifyContentAction } from '../../dto/actions/modify-content-action.abstract';
+import { RTERange } from '../../dto/range';
+import { RTEDropdownListItem } from '../../interface';
+/**
+ * Action to insert a token node at a specified range in the Rich Text Editor.
+ *
+ * @example block.apply(new InsertTokenNodeAction(rteRange, tokenNode));
+ */
+export declare class InsertTokenNodeAction extends ModifyContentAction {
+  type: string;
+  token: RTEDropdownListItem;
+  rteRange: Nullable<RTERange>;
+  actionHandleResult: boolean;
+  constructor(rteRange: Nullable<RTERange>, token: RTEDropdownListItem);
+}

package/dist/types/components/vega-rich-text-editor/extensions/tokens/insert-token-node-strategy.d.ts

@@ -0,0 +1,12 @@
+import { ActionHandleStrategy } from '../../dto/action-handle-strategies/action-handle-strategy.abstract';
+import type { RTETextBlock } from '../../dto/blocks/text-block';
+import { InsertTokenNodeAction } from './insert-token-node-action';
+/**
+ * Strategy to handle the insertion of a token node into the nearest root block.
+ */
+export declare class InsertTokenNodeStrategy extends ActionHandleStrategy<InsertTokenNodeAction, RTETextBlock> {
+  /**
+   * @inheritDoc
+   */
+  protected handleAction(action: InsertTokenNodeAction, block: RTETextBlock): void;
+}

package/dist/types/components/vega-rich-text-editor/extensions/tokens/span-to-token-node-strategy.d.ts

@@ -0,0 +1,24 @@
+import { Nullable } from '../../../../types/general';
+import { VegaRTECustomNode } from '../../interface';
+import { ElementToDTOStrategy } from '../../slimmers/controllers/helper/element-to-dto-strategy/element-to-dto-strategy.abstract';
+/**
+ * Strategy to convert <span class="token" token-key="...">...</span> to a token node
+ */
+export declare class SpanToTokenNodeStrategy extends ElementToDTOStrategy {
+  /**
+   * @inheritDoc
+   */
+  canHandle(elementsArray: HTMLElement[], currentIndex: number): number;
+  /**
+   * @inheritDoc
+   */
+  handle(elementsArray: HTMLElement[]): Nullable<VegaRTECustomNode>;
+  /**
+   * @inheritDoc
+   */
+  appendChildBlocks(): void;
+  /**
+   * @inheritDoc
+   */
+  shouldProceedToElementChildren(): boolean;
+}

package/dist/types/components/vega-rich-text-editor/extensions/tokens/token-extension.d.ts

@@ -0,0 +1,14 @@
+import { RTEDropdownListItem, RTEExtensionContext } from '../../interface';
+import { VegaRTEExtension } from '../extension.abstract';
+/**
+ * Vega Rich Text Editor Token Extension
+ */
+export declare class VegaRTETokenExtension extends VegaRTEExtension {
+  private tokenRenderer;
+  private tokenToolbarButtonRenderer;
+  constructor(tokenList?: RTEDropdownListItem[]);
+  /**
+   * @inheritDoc
+   */
+  initialExtension(context: RTEExtensionContext): void;
+}

package/dist/types/components/vega-rich-text-editor/extensions/tokens/token-node-renderer.d.ts

@@ -0,0 +1,38 @@
+import { RTEExtensionContext, RTERenderContext, VegaRTECreateElementFunction, VegaRTERenderResult } from '../../interface';
+import { VegaRTEExtensionRenderer } from '../base-extension-renderer';
+import { RTETokenNode } from './token-node';
+/**
+ * Token node renderer for the rich text editor.
+ */
+export declare class RTETokenNodeRenderer extends VegaRTEExtensionRenderer {
+  private extensionContext;
+  /**
+   * Renders the token node as a DOM element.
+   *
+   * @param {VegaRTECreateElementFunction} createElement - The function to create a DOM element.
+   * @param {RTETokenNode} node - The token node to render.
+   * @param {RTERenderContext} editorContent - The editor content context.
+   * @returns {VegaRTERenderResult} - The rendered DOM element.
+   */
+  doRender(createElement: VegaRTECreateElementFunction, node: RTETokenNode, editorContent?: RTERenderContext): VegaRTERenderResult;
+  /**
+   * Sets the RTE extension context.
+   *
+   * @param {RTEExtensionContext} context - The context of the RTE extension.
+   */
+  injectExtensionContext(context: RTEExtensionContext): void;
+  /**
+   * Get the style for the token element.
+   *
+   * @param {RTETokenNode} node - The token node.
+   * @returns {Record<string, string>} The style object for the token element.
+   */
+  protected getStyle(node: RTETokenNode): Record<string, string>;
+  /**
+   * Handle the click event on the token element.
+   *
+   * @param {MouseEvent} event - The click event.
+   * @param {RTETokenNode} node - The token node that was clicked.
+   */
+  private handleTokenElementClick;
+}